/* BankMovie V148.61
   Mobile header polish
   - slightly shorter header
   - larger logo
   - cleaner, thinner, bluer halo on internal pages */
@media (max-width: 991.98px) {
  html body #siteHeader,
  html body #siteHeader.header,
  html body #siteHeader.header-admin {
    min-height: 64px !important;
    height: 64px !important;
  }

  html body #siteHeader .header-inner,
  html body #siteHeader.header-admin .header-inner {
    width: calc(100% - 20px) !important;
    min-height: 60px !important;
    height: 60px !important;
    border-radius: 28px !important;
    padding-inline: 12px !important;
    gap: 10px !important;
  }

  html body #siteHeader .logo {
    flex: 0 0 92px !important;
    width: 92px !important;
    min-width: 92px !important;
    max-width: 92px !important;
    height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  html body #siteHeader .bm-header-logo-img {
    width: 92px !important;
    max-width: 92px !important;
    height: auto !important;
    max-height: 34px !important;
    object-fit: contain !important;
  }

  html body #siteHeader .header-actions {
    gap: 7px !important;
  }

  html body #siteHeader .menu-btn,
  html body #siteHeader .bm-header-collection,
  html body #siteHeader .notif-bell,
  html body #siteHeader .bm-header-search,
  html body #siteHeader .bm-header-search-trigger,
  html body #siteHeader .user-trigger,
  html body #siteHeader .auth-trigger,
  html body #siteHeader .admin-panel-trigger {
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    border-radius: 13px !important;
  }

  html body #siteHeader .menu-btn svg,
  html body #siteHeader .bm-header-collection svg,
  html body #siteHeader .notif-bell svg,
  html body #siteHeader .bm-header-search-content svg,
  html body #siteHeader .user-trigger svg,
  html body #siteHeader .auth-trigger svg {
    width: 20px !important;
    height: 20px !important;
  }

  html body #siteHeader .notif-badge {
    top: 10px !important;
    right: 10px !important;
  }

  /* Internal pages only: refine the halo to be tighter, brighter and more blue. */
  html body #siteHeader[data-bm-page]:not([data-bm-page="index.php"]) .header-inner,
  html body #siteHeader[data-bm-page]:not([data-bm-page="index.php"]).header-admin .header-inner {
    border-color: rgba(102, 214, 255, .46) !important;
    box-shadow:
      inset 0 0 0 1px rgba(255,255,255,.05),
      0 0 0 1px rgba(77, 191, 255, .16),
      0 0 12px rgba(52, 176, 255, .22),
      0 8px 20px rgba(4, 14, 28, .18) !important;
  }

  html body #siteHeader[data-bm-page]:not([data-bm-page="index.php"]) .header-inner::before {
    inset: -1px !important;
    border-radius: 30px !important;
    background: radial-gradient(circle at 50% 50%, rgba(74, 210, 255, .22) 0%, rgba(74, 210, 255, .12) 34%, rgba(43, 157, 255, .06) 52%, rgba(43, 157, 255, 0) 68%) !important;
    filter: blur(10px) !important;
    opacity: .84 !important;
  }

  html body #siteHeader[data-bm-page]:not([data-bm-page="index.php"]) .header-inner::after {
    border-radius: 28px !important;
    border-color: rgba(225, 247, 255, .16) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.09) !important;
  }

  html body #siteHeader[data-bm-page]:not([data-bm-page="index.php"]).is-mobile-surface-transparent .header-inner {
    border-color: rgba(102, 214, 255, .34) !important;
    box-shadow:
      inset 0 0 0 1px rgba(255,255,255,.03),
      0 0 0 1px rgba(77, 191, 255, .10),
      0 0 10px rgba(52, 176, 255, .16) !important;
  }

  html body #siteHeader[data-bm-page]:not([data-bm-page="index.php"]).is-mobile-surface-transparent .header-inner::before {
    opacity: .68 !important;
  }
}

@media (max-width: 420px) {
  html body #siteHeader,
  html body #siteHeader.header,
  html body #siteHeader.header-admin {
    min-height: 62px !important;
    height: 62px !important;
  }

  html body #siteHeader .header-inner,
  html body #siteHeader.header-admin .header-inner {
    width: calc(100% - 16px) !important;
    min-height: 58px !important;
    height: 58px !important;
    padding-inline: 10px !important;
    gap: 8px !important;
  }

  html body #siteHeader .logo {
    flex-basis: 88px !important;
    width: 88px !important;
    min-width: 88px !important;
    max-width: 88px !important;
  }

  html body #siteHeader .bm-header-logo-img {
    width: 88px !important;
    max-width: 88px !important;
    max-height: 32px !important;
  }

  html body #siteHeader .menu-btn,
  html body #siteHeader .bm-header-collection,
  html body #siteHeader .notif-bell,
  html body #siteHeader .bm-header-search,
  html body #siteHeader .bm-header-search-trigger,
  html body #siteHeader .user-trigger,
  html body #siteHeader .auth-trigger {
    width: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
  }
}
