/* DineOutPro – top contact bar + language switch (EN/AR) */
:root{
  --dop-navy:#0E0B3D;
  --dop-blue:#0080f6;
  --dop-blue-soft:rgba(0,128,246,.18);
  --dop-text:#e9ecff;
}
.dop-topbar{background:linear-gradient(90deg,#0E0B3D 0%,#16125a 60%,#0b2a6b 100%);color:var(--dop-text);font-size:13px;line-height:1;position:relative;z-index:50}
.dop-topbar__inner{max-width:1240px;margin:0 auto;padding:7px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.dop-topbar__contact{display:flex;align-items:center;gap:22px;min-width:0}
.dop-topbar__link{display:inline-flex;align-items:center;gap:7px;color:var(--dop-text)!important;text-decoration:none;font-weight:500;letter-spacing:.2px;white-space:nowrap;opacity:.92;transition:opacity .2s,color .2s}
.dop-topbar__link:hover{opacity:1;color:#fff!important}
.dop-topbar__link svg{color:#5fb2ff;flex:none}
.dop-lang{display:flex;align-items:center;gap:8px}
.dop-lang__globe{display:inline-flex;color:#9fb9ff}
.dop-lang__switch{position:relative;display:inline-grid;grid-template-columns:1fr 1fr;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:999px;padding:3px;isolation:isolate;box-shadow:inset 0 1px 2px rgba(0,0,0,.25)}
.dop-lang__pill{position:absolute;z-index:-1;top:3px;bottom:3px;left:3px;width:calc(50% - 3px);border-radius:999px;background:linear-gradient(135deg,#1e90ff,#0066d6);box-shadow:0 4px 12px rgba(0,128,246,.45);transition:transform .35s cubic-bezier(.5,.1,.2,1)}
.dop-lang__switch.is-ar .dop-lang__pill{transform:translateX(100%)}
.dop-lang__opt{display:block;min-width:74px;text-align:center;padding:6px 12px;border-radius:999px;color:#c9d3ff!important;text-decoration:none!important;font-weight:600;font-size:12.5px;letter-spacing:.3px;transition:color .25s}
.dop-lang__opt[lang="ar"]{font-family:'Tajawal','Segoe UI',Tahoma,sans-serif;font-size:13.5px}
.dop-lang__opt:hover{color:#fff!important}
.dop-lang__opt.is-active{color:#fff!important}
.dop-lang__opt:focus-visible{outline:2px solid #fff;outline-offset:2px}
/* the switch is a physical LTR control in both languages: EN left, AR right */
.dop-lang__switch{direction:ltr}
/* page title band for pages that had no H1 */
.dop-page-title{max-width:1240px;margin:28px auto 8px;padding:0 16px;text-align:center}
.dop-page-title h1{font-size:clamp(26px,3.4vw,40px);line-height:1.25;color:#0E0B3D;margin:0;font-weight:800}
@media (max-width:767px){
  .dop-topbar__mail{display:none}
  .dop-topbar__inner{padding:6px 12px}
  .dop-lang__globe{display:none}
  .dop-lang__opt{min-width:62px;padding:6px 9px}
}
/* stop 1–2px horizontal overflow from bootstrap rows on small screens */
html,body{overflow-x:clip}
