/* Alpha 41 — carousel controls + single hotel related cards restoration. */
:root{--mb41-navy:#0b2d4d;--mb41-navy-dark:#071f36;--mb41-gold:#dfad4f;--mb41-border:#e3e9ee}

/* Homepage featured carousel: controls must always be visible and readable. */
html body .mb5-carousel{position:relative!important;overflow:visible!important;padding-inline:18px!important}
html body .mb5-arrow{
 position:absolute!important;top:50%!important;transform:translateY(-50%)!important;z-index:40!important;
 display:grid!important;place-items:center!important;width:46px!important;height:46px!important;min-width:46px!important;min-height:46px!important;
 border:2px solid #fff!important;border-radius:999px!important;background:var(--mb41-navy)!important;color:#fff!important;
 box-shadow:0 10px 28px rgba(7,31,54,.28)!important;opacity:1!important;visibility:visible!important;overflow:hidden!important;
 font-size:0!important;line-height:1!important;cursor:pointer!important;transition:.2s ease!important
}
html body .mb5-arrow:hover{background:var(--mb41-gold)!important;color:var(--mb41-navy-dark)!important;transform:translateY(-50%) scale(1.06)!important}
html body .mb5-arrow:focus-visible{outline:3px solid rgba(223,173,79,.38)!important;outline-offset:3px!important}
html body .mb5-arrow svg{display:none!important}
html body .mb5-arrow::before{display:block!important;font-family:Arial,sans-serif!important;font-size:25px!important;font-weight:700!important;color:currentColor!important;line-height:1!important}
html body .mb5-prev{right:-5px!important;left:auto!important}
html body .mb5-next{left:-5px!important;right:auto!important}
html body .mb5-prev::before{content:'›'!important}
html body .mb5-next::before{content:'‹'!important}
html body .mb5-track{scrollbar-width:none!important}
html body .mb5-track::-webkit-scrollbar{display:none!important}

/* Related hotels on single hotel pages. JS adds these deterministic classes. */
html body .mb41-related-section{position:relative!important;display:block!important;overflow:visible!important;margin-block:58px 28px!important;padding-block:0 24px!important;content-visibility:visible!important;contain:none!important}
html body .mb41-related-heading{display:block!important;margin:0 0 26px!important;color:var(--mb41-navy-dark)!important;font-size:32px!important;line-height:1.3!important;font-weight:800!important;text-align:right!important}
html body .mb41-related-heading::before{content:'خيارات أخرى';display:block;margin-bottom:7px;color:#9a572a;font-size:13px;font-weight:800}
html body .mb41-related-track{display:flex!important;gap:18px!important;overflow-x:auto!important;overflow-y:visible!important;scroll-behavior:smooth!important;scroll-snap-type:x mandatory!important;padding:5px 4px 18px!important;scrollbar-width:none!important}
html body .mb41-related-track::-webkit-scrollbar{display:none!important}
html body .mb41-related-card{
 flex:0 0 calc((100% - 54px)/4)!important;min-width:0!important;display:flex!important;flex-direction:column!important;
 background:#fff!important;border:1px solid var(--mb41-border)!important;border-radius:15px!important;overflow:hidden!important;
 box-shadow:0 10px 28px rgba(8,38,64,.07)!important;text-decoration:none!important;color:var(--mb41-navy-dark)!important;
 scroll-snap-align:start!important;transition:transform .25s ease,box-shadow .25s ease!important
}
html body .mb41-related-card:hover{transform:translateY(-5px)!important;box-shadow:0 18px 42px rgba(8,38,64,.14)!important}
html body .mb41-related-card img{display:block!important;width:100%!important;height:210px!important;min-height:210px!important;object-fit:cover!important;border:0!important;border-radius:0!important;margin:0!important}
html body .mb41-related-card .mb41-related-content{display:flex!important;flex:1!important;flex-direction:column!important;padding:16px 17px 18px!important;text-align:right!important}
html body .mb41-related-card .mb41-related-title{display:block!important;margin:0 0 7px!important;color:var(--mb41-navy-dark)!important;font-size:17px!important;line-height:1.55!important;font-weight:800!important;white-space:normal!important}
html body .mb41-related-card .mb41-related-meta{display:block!important;min-height:22px!important;margin-bottom:14px!important;color:#7d8a95!important;font-size:12px!important;line-height:1.7!important}
html body .mb41-related-card .mb41-related-cta{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;margin-top:auto!important;padding-top:12px!important;border-top:1px solid #edf0f2!important;color:#9a572a!important;font-size:13px!important;font-weight:800!important}
html body .mb41-related-card .mb41-related-cta::after{content:'←';display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#f8f1e5;color:var(--mb41-navy-dark);font-size:15px}
html body .mb41-related-nav{
 position:absolute!important;top:50%!important;z-index:20!important;display:grid!important;place-items:center!important;
 width:42px!important;height:42px!important;border:2px solid #fff!important;border-radius:50%!important;background:var(--mb41-navy)!important;color:#fff!important;
 box-shadow:0 8px 23px rgba(8,38,64,.24)!important;font-size:24px!important;line-height:1!important;cursor:pointer!important
}
html body .mb41-related-prev{right:-18px!important}
html body .mb41-related-next{left:-18px!important}
html body .mb41-related-nav:hover{background:var(--mb41-gold)!important;color:var(--mb41-navy-dark)!important}

@media(max-width:1024px){
 html body .mb41-related-card{flex-basis:calc((100% - 36px)/3)!important}
 html body .mb5-prev{right:0!important}html body .mb5-next{left:0!important}
}
@media(max-width:767px){
 html body .mb5-carousel{padding-inline:5px!important}
 html body .mb5-arrow{width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important}
 html body .mb5-prev{right:-7px!important}html body .mb5-next{left:-7px!important}
 html body .mb41-related-section{margin-block:42px 18px!important}
 html body .mb41-related-heading{font-size:25px!important;margin-bottom:18px!important}
 html body .mb41-related-track{gap:12px!important;padding-inline:2px!important}
 html body .mb41-related-card{flex-basis:78%!important;max-width:300px!important}
 html body .mb41-related-card img{height:180px!important;min-height:180px!important}
 html body .mb41-related-card .mb41-related-content{padding:13px 14px 15px!important}
 html body .mb41-related-card .mb41-related-title{font-size:15px!important}
 html body .mb41-related-nav{display:none!important}
}
