/* SSTRADERS V50 — shared page heading + public navbar polish
   Loaded last so this is the authoritative presentation layer. */

/* =========================================================
   STUDIO / ADMIN — one clean page heading across every page
   ========================================================= */
.admin-content .page-heading{
    display:flex!important;
    align-items:flex-end!important;
    justify-content:space-between!important;
    gap:18px!important;
    width:100%!important;
    margin:0 0 24px!important;
    padding:2px 0 18px!important;
    background:transparent!important;
    border:0!important;
    border-bottom:1px solid #dfe7f0!important;
    border-radius:0!important;
    box-shadow:none!important;
    color:#10233c!important;
}
.admin-content .page-heading>div:first-child{
    min-width:0!important;
    max-width:820px!important;
}
.admin-content .page-heading .section-kicker{
    display:inline-flex!important;
    align-items:center!important;
    min-height:25px!important;
    margin:0 0 7px!important;
    padding:4px 9px!important;
    border:1px solid #dce8f5!important;
    border-radius:999px!important;
    background:#f4f8fd!important;
    color:#53708f!important;
    font-size:.60rem!important;
    line-height:1.2!important;
    font-weight:800!important;
    letter-spacing:.12em!important;
    text-transform:uppercase!important;
}
.admin-content .page-heading h1,
.admin-content .page-heading h2,
.admin-content .page-heading h3{
    margin:0!important;
    color:#10233c!important;
    font-size:clamp(1.55rem,2.3vw,2.05rem)!important;
    line-height:1.08!important;
    letter-spacing:-.035em!important;
    font-weight:850!important;
}
.admin-content .page-heading p{
    max-width:720px!important;
    margin:7px 0 0!important;
    color:#708197!important;
    font-size:.88rem!important;
    line-height:1.55!important;
}
.admin-content .page-heading .heading-actions,
.admin-content .page-heading>div:last-child:not(:first-child){
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:8px!important;
    flex-wrap:wrap!important;
    flex:0 0 auto!important;
}
.admin-content .page-heading>.btn-primary-admin,
.admin-content .page-heading>.btn-secondary-admin,
.admin-content .page-heading .heading-actions .btn-primary-admin,
.admin-content .page-heading .heading-actions .btn-secondary-admin{
    min-height:40px!important;
    padding:9px 13px!important;
    border-radius:11px!important;
    white-space:nowrap!important;
}

/* Products used to have a special heading. It now follows the same shared rule. */
.admin-content .products-page-heading{
    padding:2px 0 18px!important;
    margin:0 0 24px!important;
    border-bottom:1px solid #dfe7f0!important;
}

/* Dark Studio heading: genuinely dark surface context + light readable type. */
html[data-theme="dark"] .admin-content .page-heading{
    background:transparent!important;
    color:#eef5ff!important;
    border-bottom-color:#263b53!important;
}
html[data-theme="dark"] .admin-content .page-heading .section-kicker{
    background:#10243a!important;
    border-color:#2b4662!important;
    color:#8db4dd!important;
}
html[data-theme="dark"] .admin-content .page-heading :is(h1,h2,h3){
    color:#f2f7ff!important;
}
html[data-theme="dark"] .admin-content .page-heading p{
    color:#9fb1c6!important;
}
html[data-theme="dark"] .admin-content .page-heading .btn-secondary-admin{
    background:#0d1d30!important;
    color:#e9f2ff!important;
    border-color:#304a65!important;
}
html[data-theme="dark"] .admin-content .page-heading .btn-secondary-admin:hover{
    background:#142942!important;
    border-color:#456785!important;
}

/* Heading responsiveness — no overflow and no giant card-like block on phones. */
@media (max-width:767.98px){
    .admin-content .page-heading{
        align-items:stretch!important;
        flex-direction:column!important;
        gap:13px!important;
        margin-bottom:18px!important;
        padding:0 0 15px!important;
    }
    .admin-content .page-heading>div:first-child{max-width:none!important;width:100%!important}
    .admin-content .page-heading h1,
    .admin-content .page-heading h2,
    .admin-content .page-heading h3{font-size:1.55rem!important}
    .admin-content .page-heading p{font-size:.84rem!important;line-height:1.5!important}
    .admin-content .page-heading .heading-actions,
    .admin-content .page-heading>div:last-child:not(:first-child){
        width:100%!important;
        justify-content:flex-start!important;
    }
    .admin-content .page-heading>.btn-primary-admin,
    .admin-content .page-heading>.btn-secondary-admin{
        align-self:flex-start!important;
    }
}

/* =========================================================
   PUBLIC WEBSITE NAVBAR — desktop always stays on one line
   ========================================================= */
@media (min-width:1200px){
    .ss13-navbar{padding:.48rem 0!important;min-height:78px!important}
    .ss13-nav-inner{
        width:100%!important;
        max-width:1500px!important;
        padding-left:22px!important;
        padding-right:22px!important;
        gap:18px!important;
        flex-wrap:nowrap!important;
    }
    .ss13-brand{
        flex:0 0 auto!important;
        gap:10px!important;
        min-width:0!important;
        white-space:nowrap!important;
    }
    .ss13-brand img{width:72px!important;max-height:62px!important}
    .ss13-brand strong{font-size:1rem!important;white-space:nowrap!important}
    .ss13-brand small{font-size:.59rem!important;max-width:190px!important;white-space:nowrap!important}
    #ss13MainNav.navbar-collapse{
        display:flex!important;
        align-items:center!important;
        min-width:0!important;
        flex-wrap:nowrap!important;
        gap:12px!important;
    }
    .ss13-nav-links{
        display:flex!important;
        align-items:center!important;
        flex-direction:row!important;
        flex-wrap:nowrap!important;
        gap:1px!important;
        margin-left:auto!important;
        margin-right:auto!important;
        min-width:0!important;
        white-space:nowrap!important;
    }
    .ss13-nav-links .nav-item{flex:0 0 auto!important}
    .ss13-nav-links .nav-link{
        display:flex!important;
        align-items:center!important;
        min-height:40px!important;
        padding:8px 9px!important;
        font-size:.84rem!important;
        line-height:1!important;
        white-space:nowrap!important;
    }
    .ss13-nav-actions{
        display:flex!important;
        align-items:center!important;
        flex:0 0 auto!important;
        flex-wrap:nowrap!important;
        gap:7px!important;
        white-space:nowrap!important;
    }
    .ss13-nav-actions .ui-pref-controls{display:flex!important;flex-wrap:nowrap!important;gap:5px!important}
    .ss13-nav-actions .ui-pref-btn{min-width:42px!important;height:40px!important;padding:0 9px!important;white-space:nowrap!important}
    .ss13-cart{width:40px!important;height:40px!important;flex:0 0 40px!important}
    .ss13-quote,.ss13-studio{
        height:40px!important;
        padding:0 15px!important;
        font-size:.84rem!important;
        white-space:nowrap!important;
        flex:0 0 auto!important;
    }
}

/* A little extra breathing room around common 1200–1370px laptop widths. */
@media (min-width:1200px) and (max-width:1370px){
    .ss13-nav-inner{padding-left:14px!important;padding-right:14px!important;gap:10px!important}
    .ss13-brand img{width:66px!important}
    .ss13-brand small{display:none!important}
    .ss13-nav-links .nav-link{padding:8px 7px!important;font-size:.80rem!important}
    .ss13-nav-actions{gap:5px!important}
    .ss13-nav-actions .ui-pref-btn{min-width:39px!important;padding:0 7px!important;font-size:.72rem!important}
    .ss13-cart{width:38px!important;height:38px!important;flex-basis:38px!important}
    .ss13-quote,.ss13-studio{height:38px!important;padding:0 12px!important;font-size:.79rem!important}
}

/* Below XL we intentionally use Bootstrap's collapsed/mobile navigation. */
@media (max-width:1199.98px){
    .ss13-nav-links .nav-link{white-space:normal!important}
    .ss13-nav-actions{flex-wrap:wrap!important}
}
