/* Alpha 36 — definitive header tools alignment + archive action controls. */
:root{--mb36-navy:#0b2f4f;--mb36-navy2:#08243d;--mb36-gold:#dfad52}

/* Header tools: isolated, stable, and identical on every page. */
html body #makkah-v2-header .makkah-v2-actions{display:flex!important;align-items:center!important;gap:10px!important;position:relative!important}
html body #makkah-v2-header .makkah-v2-actions>.mb30-header-icon{
  position:relative!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;
  flex:0 0 44px!important;width:44px!important;height:44px!important;min-width:44px!important;max-width:44px!important;
  margin:0!important;padding:0!important;border:1px solid rgba(255,255,255,.25)!important;border-radius:12px!important;
  background:rgba(255,255,255,.035)!important;color:#fff!important;text-decoration:none!important;box-shadow:none!important;
  overflow:visible!important;line-height:1!important;vertical-align:middle!important;appearance:none!important;-webkit-appearance:none!important;
}
html body #makkah-v2-header .makkah-v2-actions>.mb30-header-icon:hover,
html body #makkah-v2-header .makkah-v2-actions>.mb30-header-icon:focus-visible{background:var(--mb36-gold)!important;color:var(--mb36-navy2)!important;border-color:var(--mb36-gold)!important;transform:translateY(-1px)!important}
html body #makkah-v2-header .makkah-v2-actions>.mb30-header-icon>svg{display:block!important;width:21px!important;height:21px!important;min-width:21px!important;max-width:21px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.9!important;stroke-linecap:round!important;stroke-linejoin:round!important;pointer-events:none!important}
html body #makkah-v2-header .makkah-v2-actions>.mb30-header-icon>.mb30-icon-count{
  position:absolute!important;z-index:5!important;top:-7px!important;right:-7px!important;left:auto!important;bottom:auto!important;
  display:flex!important;align-items:center!important;justify-content:center!important;min-width:18px!important;width:auto!important;height:18px!important;
  padding:0 5px!important;margin:0!important;border:2px solid var(--mb36-navy)!important;border-radius:999px!important;
  background:var(--mb36-gold)!important;color:var(--mb36-navy2)!important;font:800 10px/1 Cairo,Arial,sans-serif!important;
}
html body #makkah-v2-header .makkah-v2-actions>.mb30-header-icon>.mb30-icon-count[hidden]{display:none!important}
html body #makkah-v2-header .makkah-v2-actions>.makkah-v2-cta{position:static!important;overflow:visible!important}
html body #makkah-v2-header .makkah-v2-actions>.makkah-v2-cta .mb30-icon-count{display:none!important}

/* Archive card: wishlist and compare are two independent round buttons. */
html body .mba-hotel-card .mba-card-media{position:relative!important;overflow:hidden!important}
html body .mba-hotel-card .mba-wishlist,
html body .mba-hotel-card .mba-compare-check{
  position:absolute!important;z-index:25!important;top:12px!important;display:flex!important;align-items:center!important;justify-content:center!important;
  width:42px!important;height:42px!important;min-width:42px!important;max-width:42px!important;padding:0!important;margin:0!important;
  border:1px solid rgba(255,255,255,.28)!important;border-radius:50%!important;background:rgba(8,43,73,.92)!important;color:#fff!important;
  box-shadow:0 8px 20px rgba(5,29,50,.2)!important;cursor:pointer!important;line-height:1!important;appearance:none!important;-webkit-appearance:none!important;
}
html body .mba-hotel-card .mba-wishlist{left:12px!important;right:auto!important}
html body .mba-hotel-card .mba-compare-check{left:62px!important;right:auto!important;font-size:0!important}
html body .mba-hotel-card .mba-wishlist svg,
html body .mba-hotel-card .mba-compare-check svg{display:block!important;width:20px!important;height:20px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.9!important;stroke-linecap:round!important;stroke-linejoin:round!important;pointer-events:none!important}
html body .mba-hotel-card .mba-compare-check input{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;margin:0!important}
html body .mba-hotel-card .mba-wishlist.active,
html body .mba-hotel-card .mba-compare-check.active,
html body .mba-hotel-card .mba-compare-check:has(input:checked){background:var(--mb36-gold)!important;color:var(--mb36-navy2)!important;border-color:var(--mb36-gold)!important}
html body .mba-hotel-card .mba-wishlist:hover,
html body .mba-hotel-card .mba-compare-check:hover{transform:translateY(-2px)!important}

@media(max-width:900px){
  html body #makkah-v2-header .makkah-v2-header-row{
    display:grid!important;grid-template-columns:48px minmax(0,1fr) 48px!important;align-items:center!important;
    direction:ltr!important;gap:8px!important;padding:0 10px!important;min-height:68px!important;
  }
  html body #makkah-v2-header .makkah-v2-brand-wrap{grid-column:1!important;grid-row:1!important;order:initial!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;min-width:0!important}
  html body #makkah-v2-header .makkah-v2-actions{grid-column:2!important;grid-row:1!important;order:initial!important;display:flex!important;justify-content:center!important;align-items:center!important;gap:7px!important;min-width:0!important;direction:ltr!important}
  html body #makkah-v2-header .makkah-v2-menu-toggle{grid-column:3!important;grid-row:1!important;order:initial!important;position:static!important;width:42px!important;height:42px!important;min-width:42px!important;margin:0!important;justify-self:end!important}
  html body #makkah-v2-header .makkah-v2-actions>.mb30-header-icon{flex-basis:38px!important;width:38px!important;height:38px!important;min-width:38px!important;max-width:38px!important;border-radius:10px!important}
  html body #makkah-v2-header .makkah-v2-actions>.mb30-header-icon>svg{width:18px!important;height:18px!important;min-width:18px!important;max-width:18px!important}
  html body #makkah-v2-header .makkah-v2-actions>.mb30-header-icon>.mb30-icon-count{top:-5px!important;right:-5px!important;min-width:16px!important;height:16px!important;padding:0 4px!important;font-size:9px!important;border-width:1.5px!important}
  html body #makkah-v2-header .makkah-v2-actions>.makkah-v2-cta{display:none!important}
  html body .mba-hotel-card .mba-wishlist,html body .mba-hotel-card .mba-compare-check{top:9px!important;width:36px!important;height:36px!important;min-width:36px!important;max-width:36px!important}
  html body .mba-hotel-card .mba-wishlist{left:8px!important}
  html body .mba-hotel-card .mba-compare-check{left:49px!important}
  html body .mba-hotel-card .mba-wishlist svg,html body .mba-hotel-card .mba-compare-check svg{width:17px!important;height:17px!important}
}
@media(max-width:360px){
  html body #makkah-v2-header .makkah-v2-header-row{grid-template-columns:44px minmax(0,1fr) 44px!important;gap:4px!important;padding:0 7px!important}
  html body #makkah-v2-header .makkah-v2-actions{gap:4px!important}
  html body #makkah-v2-header .makkah-v2-actions>.mb30-header-icon{flex-basis:34px!important;width:34px!important;height:34px!important;min-width:34px!important;max-width:34px!important}
}