/* Smart mobile header for TheBuilt (loads after responsive.css) */
:root { --sh-accent: #0a8a3c; }  /* brand green: change here */
.sh-burger { display: none; }

/* Desktop: no extra bars/pills drawn on the header edge */
@media (min-width: 1025px) {
  header.main-header:before,
  header.main-header:after,
  header.main-header .container:after,
  header.main-header .row:after,
  .sh-burger,
  .sh-sub-btn { display: none !important; }
  header.main-header .navbar-toggle { display: none !important; }
}

@media (max-width: 1024px) {

  /* ---- Compact single-row bar ---- */
  header.main-header {
    position: sticky;
    top: 0;
    z-index: 999;
    background: #fff;
    box-shadow: 0 1px 0 rgba(0,0,0,.06);
    transition: transform .3s ease, box-shadow .3s ease;
    will-change: transform;
  }
  .admin-bar header.main-header { top: 46px; }
  header.main-header.sh-hidden { transform: translateY(-100%); }
  header.main-header.sh-scrolled { box-shadow: 0 4px 16px rgba(0,0,0,.10); }
  header.main-header.sh-scrolled .col-md-12 { height: 72px !important; }
  header.main-header.sh-scrolled .logo-link img { max-height: 54px; }
  header.main-header .col-md-12,
  header .logo-link img { transition: height .25s ease, max-height .25s ease; }
  /* Transparent/overlay headers become a normal solid sticky bar on mobile */
  header.main-header.transparent-header {
    position: sticky; display: block; height: auto; background: #fff;
  }
  header.transparent-header .regular-logo { display: inline; }
  header.transparent-header .light-logo { display: none; }
  header.main-header { padding-top: env(safe-area-inset-top, 0px); }

  header.main-header > .container,
  header.main-header > .container-fluid {
    padding: 0 16px;
  }
  header.main-header .col-md-12 {
    position: static;
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    height: 88px !important;
    padding: 0;
  }
  header .header-left.logo {
    display: block;
    margin: 0;
    height: auto;
    min-width: 0;
    text-align: left;
    flex: 0 1 auto;
  }
  header .logo-link img { max-height: 68px; width: auto; }
  header .header-center {
    display: block;
    min-width: 0;
    flex: 0 0 auto;
    order: 3;
  }
  header .header-right {
    display: block;
    min-width: 0;
    flex: 0 0 auto;
    margin-left: auto;
    order: 2;
  }
  header .header-right ul.header-nav {
    display: flex;
    align-items: center;
    gap: 4px;
    margin: 0 !important;
    padding: 0;
    float: none;
  }
  header .header-right ul.header-nav > li { margin: 0; }
  header .header-right ul.header-nav > li > div > a,
  header .header-right ul.header-nav > li > a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 44px;
  }

  /* ---- "MENU ≡" pill button (created by smart-header.js) ---- */
  .sh-burger {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    height: 48px;
    margin-left: 8px;
    padding: 0 20px;
    background: #000;
    color: #fff;
    border: 0;
    border-radius: 12px;
    font: 500 18px/1 inherit;
    font-family: inherit;
    letter-spacing: .5px;
    text-transform: uppercase;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    box-shadow: 0 2px 6px rgba(0,0,0,.25);
    transition: background .2s ease, transform .1s ease;
    order: 4;
  }
  .sh-burger:active { transform: scale(.97); }
  .sh-burger .sh-label { font-weight: 500; }
  .sh-burger .sh-icon { display: inline-flex; flex-direction: column; gap: 4px; width: 18px; }
  .sh-burger .sh-icon span {
    display: block; height: 2.5px; background: #fff; border-radius: 2px;
    transition: transform .25s ease, opacity .2s ease;
  }
  .sh-burger[aria-expanded="true"] .sh-icon span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
  .sh-burger[aria-expanded="true"] .sh-icon span:nth-child(2) { opacity: 0; }
  .sh-burger[aria-expanded="true"] .sh-icon span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

  /* Hide the theme's old "Menu" button when ours is active */
  .sh-ready .navbar .navbar-toggle { display: none !important; }

  /* ---- Dropdown menu panel ---- */
  .sh-ready .mainmenu-belowheader,
  .sh-ready header .header-center .navbar { padding: 0; margin: 0; }
  .sh-ready .navbar-collapse.collapse {
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    z-index: 998;
    background: #fff;
    max-height: calc(100vh - 88px);
    max-height: calc(100dvh - 88px - env(safe-area-inset-top, 0px));
    padding-bottom: calc(16px + env(safe-area-inset-bottom, 0px));
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    box-shadow: 0 12px 24px rgba(0,0,0,.12);
    padding: 8px 16px 16px;
    margin: 0;
  }
  .sh-ready .navbar-collapse.collapse:not(.in) { display: none; }
  .sh-ready .navbar-collapse.collapse.in { display: block; }
  .sh-ready header.main-header .navbar,
  .sh-ready header.main-header .navbar-inner,
  .sh-ready header.main-header .mainmenu-belowheader { position: static; }

  .sh-ready .navbar .nav { margin: 0; padding: 0; float: none; }
  .sh-ready .navbar .nav > li { float: none; display: block; }
  .sh-ready .navbar .nav > li > a,
  .sh-ready .navbar .nav .sub-menu li > a {
    display: block;
    padding: 14px 4px !important;   /* 44px+ tap target */
    font-size: 16px;
    line-height: 1.3;
    color: #1d2127 !important;
    border-bottom: 1px solid rgba(0,0,0,.07);
  }
  .sh-ready .navbar .nav .sub-menu {
    position: static;
    padding-left: 14px;
    background: none;
  }

  /* Submenu chevron: separate tap target so the parent link still works */
  .sh-ready .navbar .nav > li.menu-item-has-children { position: relative; }
  .sh-ready .navbar .nav > li.menu-item-has-children > a:after { display: none; }
  .sh-sub-btn {
    position: absolute; right: 0; top: 0;
    width: 48px; height: 48px;
    background: transparent; border: 0; cursor: pointer; color: #1d2127;
  }
  .sh-sub-btn:before {
    content: ""; display: block; width: 9px; height: 9px; margin: 0 auto;
    border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
    transform: rotate(45deg) translate(-2px,-2px); transition: transform .2s ease;
  }
  li.sh-open > .sh-sub-btn:before { transform: rotate(-135deg) translate(-2px,-2px); }
  .sh-ready .navbar .nav .sub-menu { display: none; }
  .sh-ready .navbar .nav li.sh-open > .sub-menu { display: block; }
  .sh-ready .navbar .nav .current-menu-item > a,
  .sh-ready .navbar .nav .current-menu-ancestor > a { color: var(--sh-accent) !important; font-weight: 700; }
  .sh-burger:focus-visible, .sh-sub-btn:focus-visible,
  .sh-ready .navbar .nav a:focus-visible { outline: 2px solid var(--sh-accent); outline-offset: 2px; }

  /* Reading-progress line along the bottom of the bar */
  header.main-header:after {
    content: ""; position: absolute; left: 0; bottom: 0; height: 3px;
    width: calc(var(--sh-progress, 0) * 1%); background: var(--sh-accent);
    pointer-events: none;
  }

  /* Dim page behind open menu */
  body.sh-menu-open::after {
    content: "";
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.35);
    z-index: 990;
  }
  body.sh-menu-open { overflow: hidden; }
  header.main-header { z-index: 999; }
}

@media (max-width: 767px) {
  header .header-right { display: none; }
}

@media (max-width: 480px) {
  header.main-header .col-md-12 { height: 78px !important; }
  header .logo-link img { max-height: 60px; }
  .sh-burger { height: 46px; padding: 0 18px; font-size: 17px; }
  .sh-ready .navbar-collapse.collapse { max-height: calc(100vh - 78px); }
}

@media (prefers-reduced-motion: reduce) {
  header.main-header, .sh-burger .sh-icon span { transition: none; }
}
