/* Mobile-only compact header */

.mobile-header{display:none}
.mobile-searchbar{display:none}

@media (max-width: 576px){
  /* Hide existing headers on mobile */
  .top-header, .main-header{display:none !important}
  /* Keep navbar (menu list) but hide its default toggler */
  .navbar .navbar-toggler{display:none !important}

  /* Make room for fixed mobile header */
  body{padding-top:56px}

  .mobile-header{display:flex; position:fixed; top:0; right:0; left:0; height:48px; background:#fff; border-bottom:1px solid #eee; z-index:10005; align-items:center; justify-content:space-between; padding:0 8px; direction:rtl}

  .mobile-header .mh-left, .mobile-header .mh-right{display:flex; align-items:center; gap:6px}
  .mobile-header .mh-logo img{height:26px; width:auto; display:block}

  .mobile-header .mh-btn{background:transparent; border:0; width:36px; height:36px; display:inline-flex; align-items:center; justify-content:center; color:#333; border-radius:8px}
  .mobile-header .mh-btn:active{background:#f5f5f5}
  .mobile-header .mh-btn i{font-size:18px; line-height:1}

  .mobile-header .mh-title{font-size:14px; color:#333; font-weight:700}

  /* Cart badge */
  .mobile-header .mh-btn.mh-cart{position:relative}
  .mobile-header .mh-badge{position:absolute; top:2px; left:2px; background:#dc3545; color:#fff; border-radius:999px; min-width:16px; height:16px; padding:0 4px; font-size:11px; line-height:16px; text-align:center; display:none}
  .mobile-header .mh-badge.show{display:inline-block}

  /* Search dropdown under header */
  .mobile-searchbar{display:none; position:fixed; top:48px; right:0; left:0; background:#fff; border-bottom:1px solid #eee; padding:8px; z-index:10005}
  .mobile-searchbar.open{display:block}
  .mobile-searchbar .form-control{height:36px; font-size:14px}
  .mobile-searchbar .mh-search-actions{display:flex; gap:8px; margin-top:6px}
  .mobile-searchbar .btn{height:36px; font-size:13px; padding:0 12px}
}