/**
 * WP Admin Bar Offset — Single source
 *
 * WP admin bar:
 *   >782px:  height 32px, position: fixed
 *   <=782px: height 46px, position: fixed
 *   <=600px: height 46px, position: absolute (scrolls away)
 *
 * WP always adds: html { margin-top: 32px|46px !important }
 *
 * Both sticky AND fixed elements need top offset so they don't
 * sit behind the admin bar.
 */

/* ===== Variable ===== */
.admin-bar {
    --wp-bar: 32px;
}
@media (max-width: 782px) {
    .admin-bar {
        --wp-bar: 46px;
    }
}
/* <=600px: admin bar is position:absolute (scrolls away).
   JS in main.js dynamically adjusts --wp-bar based on scroll
   to prevent both overlap AND gap. */

/* ==========================================================
   PUBLIC HEADER — .site-header (sticky via public.css)
   ========================================================== */
.admin-bar .site-header {
    top: var(--wp-bar);
}

/* ==========================================================
   LANDING HEADER — .site-header (fixed via landing.css)
   Higher specificity to beat .landing-page .site-header
   ========================================================== */
.admin-bar.landing-page .site-header {
    top: var(--wp-bar);
}

/* ==========================================================
   DASHBOARD — fixed layout, shift top below admin bar
   ========================================================== */
.admin-bar .scrm-dashboard-layout {
    top: var(--wp-bar);
}

/* ==========================================================
   AUTH PAGE — min-height adjustment
   ========================================================== */
.admin-bar .scrm-auth-page {
    height: calc(100vh - var(--wp-bar));
    min-height: calc(100vh - var(--wp-bar));
}

/* ==========================================================
   LANDING HERO — min-height adjustment
   ========================================================== */
.admin-bar.landing-page .hero-section {
    min-height: calc(100vh - var(--wp-bar));
}

/* ==========================================================
   PUBLIC — sticky sidebars (blog, single post, single product)
   Header top shifts by --wp-bar, so sidebar top must also shift.
   ========================================================== */
.admin-bar .scrm-blog-sidebar,
.admin-bar .scrm-single-sidebar,
.admin-bar .scrm-ps-sidebar {
    top: calc(88px + var(--wp-bar));
}

/* ==========================================================
   AUTH PAGE — mobile height fix with admin bar
   ========================================================== */
@media (max-width: 768px) {
    .admin-bar .scrm-auth-page,
    .admin-bar .scrm-auth-form-panel {
        min-height: calc(100vh - var(--wp-bar));
    }
}

/* ==========================================================
   MOBILE ADMIN BAR FIXES
   ========================================================== */

/* Sidebar overlay must start below admin bar */
@media (max-width: 782px) {
    .admin-bar .scrm-sidebar-overlay {
        top: var(--wp-bar);
    }
}

/* Mobile sidebar with admin bar */
@media (max-width: 768px) {
    .admin-bar .scrm-sidebar {
        top: var(--wp-bar);
        bottom: 0;
    }
}