/* Fanadiquna Cars v2 — identity, header, footer, actions (phase 2, 2026-11-04).
   Scope: loaded only on cars-section pages while v2 is active. Every rule is under .fcr / body.fcr-on.
   Concept: "خط الطريق" — a dashed amber road line marks the section (under the header, above the footer). */

:root{
  --fcr-ink:#0F1E26; --fcr-ink-2:#2E3D45; --fcr-muted:#62707A;
  --fcr-sand:#F7F3EC; --fcr-paper:#FFFFFF; --fcr-line:#E6DFD3; --fcr-line-2:#D9D0C1;
  --fcr-petrol:#0C5A5C; --fcr-petrol-700:#083F41; --fcr-petrol-50:#E7F1F0;
  --fcr-amber:#E9A73B; --fcr-amber-50:#FDF3E1;
  --fcr-wa:#0E7A43; --fcr-wa-700:#0A5F34;
  --fcr-r-s:8px; --fcr-r-m:12px; --fcr-r-l:18px; --fcr-pill:999px;
  --fcr-s1:4px; --fcr-s2:8px; --fcr-s3:12px; --fcr-s4:16px; --fcr-s5:24px; --fcr-s6:32px; --fcr-s7:48px; --fcr-s8:64px;
  --fcr-font:'Fanadiquna Alexandria',Alexandria,Tahoma,'Segoe UI',sans-serif;
  --fcr-shadow:0 10px 30px rgba(15,30,38,.12),0 2px 6px rgba(15,30,38,.06);
  --fcr-hh:68px;
  --fcr-road:repeating-linear-gradient(90deg,var(--fcr-amber) 0 22px,transparent 22px 36px);
}

/* ---------- scoped reset (legacy theme styles bare elements) ---------- */
.fcr,.fcr *{box-sizing:border-box}
.fcr{font-family:var(--fcr-font);color:var(--fcr-ink);font-size:15px;line-height:1.6;direction:rtl;text-align:start;letter-spacing:0}
:where(.fcr) ul,:where(.fcr) ol{list-style:none;margin:0;padding:0}
:where(.fcr) li{margin:0;padding:0;list-style:none}
:where(.fcr) li::before,:where(.fcr) li::after{content:none}
:where(.fcr) a{color:inherit;text-decoration:none;background:none}
:where(.fcr) p{margin:0}
:where(.fcr) img{max-width:100%;height:auto;display:block}
:where(.fcr) button{font:inherit;color:inherit;background:none;border:0;margin:0;padding:0;cursor:pointer;line-height:inherit;text-transform:none;box-shadow:none}
:where(.fcr) svg{width:20px;height:20px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.fcr :focus-visible{outline:3px solid var(--fcr-amber);outline-offset:2px;border-radius:var(--fcr-r-s)}
.fcr-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.fcr-skip{position:absolute;inset-inline-start:12px;top:-60px;z-index:1001;background:var(--fcr-ink);color:#fff;padding:10px 14px;border-radius:var(--fcr-r-s);font-family:var(--fcr-font)}
.fcr-skip:focus{top:12px}

/* ---------- buttons ---------- */
.fcr-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border-radius:var(--fcr-pill);font-weight:600;font-size:14.5px;white-space:nowrap;transition:background-color .18s,border-color .18s,color .18s,transform .18s}
.fcr-btn:active{transform:translateY(1px)}
.fcr-btn--wa{background:var(--fcr-wa);color:#fff!important}
.fcr-btn--wa:hover{background:var(--fcr-wa-700)}
.fcr-btn--primary{background:var(--fcr-petrol);color:#fff!important}
.fcr-btn--primary:hover{background:var(--fcr-petrol-700)}
.fcr-btn--ghost{border:1.5px solid var(--fcr-line-2);color:var(--fcr-ink)!important;background:var(--fcr-paper)}
.fcr-btn--ghost:hover{border-color:var(--fcr-petrol);color:var(--fcr-petrol)!important}
.fcr-btn--icon{width:44px;padding:0}

/* ---------- header ---------- */
body.fcr-on{padding-top:0!important}
body.fcr-on > root{display:block}
.fcr-hdr{position:sticky;top:var(--fcr-adm,0px);z-index:1000;background:#fff;border-bottom:1px solid var(--fcr-line)}
.fcr-hdr::after{content:"";position:absolute;inset-inline:0;bottom:-4px;height:3px;background:var(--fcr-road);opacity:.9;pointer-events:none}
.fcr-hdr__in{max-width:1240px;margin:0 auto;height:var(--fcr-hh);padding:0 var(--fcr-s5);display:flex;align-items:center;gap:var(--fcr-s5)}
.fcr-brand{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.fcr-brand img{height:40px;width:auto}
.fcr-brand__tag{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border-radius:var(--fcr-pill);background:var(--fcr-petrol-50);color:var(--fcr-petrol);font-weight:700;font-size:13.5px}
.fcr-brand__tag svg{width:18px;height:18px}

.fcr-nav{flex:1 1 auto;min-width:0}
.fcr-nav__list{display:flex;align-items:center;gap:2px}
.fcr-nav__item{position:relative}
.fcr-nav__btn,.fcr-nav__soon{display:inline-flex;align-items:center;gap:6px;height:44px;padding:0 12px;border-radius:var(--fcr-r-m);font-weight:600;font-size:14.5px;color:var(--fcr-ink-2)}
.fcr-nav__btn:hover,.fcr-nav__btn[aria-expanded="true"]{background:var(--fcr-sand);color:var(--fcr-ink)}
.fcr-nav__btn .fcr-chev{width:16px;height:16px;transition:transform .2s}
.fcr-nav__btn[aria-expanded="true"] .fcr-chev{transform:rotate(180deg)}
.fcr-nav__soon{color:var(--fcr-muted);cursor:default}
.fcr-soon{font-style:normal;font-size:11.5px;font-weight:700;padding:2px 8px;border-radius:var(--fcr-pill);background:var(--fcr-amber-50);color:#8A5A0B}

.fcr-pop{position:absolute;top:calc(100% + 10px);inset-inline-start:0;min-width:280px;background:var(--fcr-paper);border:1px solid var(--fcr-line);border-radius:var(--fcr-r-l);box-shadow:var(--fcr-shadow);padding:var(--fcr-s3);z-index:1002}
.fcr-pop[hidden]{display:none}
.fcr-pop--wide{min-width:520px;display:grid;grid-template-columns:1fr 1fr;gap:var(--fcr-s3)}
.fcr-pop--wide[hidden]{display:none}
.fcr-pop__hd{font-size:12.5px;font-weight:700;color:var(--fcr-muted);padding:6px 10px 4px;display:flex;align-items:center;gap:6px}
.fcr-pop__hd svg{width:16px;height:16px;color:var(--fcr-petrol)}
.fcr-dest{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;padding:8px 10px;border-radius:var(--fcr-r-m)}
.fcr-dest:hover{background:var(--fcr-sand)}
.fcr-dest__name{display:flex;flex-direction:column;font-weight:600;font-size:15px;line-height:1.35}
.fcr-dest__name small{font-weight:400;font-size:12.5px;color:var(--fcr-muted)}
.fcr-dest__meta{font-size:12.5px;font-weight:600;color:var(--fcr-petrol);background:var(--fcr-petrol-50);border-radius:var(--fcr-pill);padding:2px 10px;white-space:nowrap}

.fcr-hdr__act{display:flex;align-items:center;gap:var(--fcr-s2);flex:0 0 auto;margin-inline-start:auto}
.fcr-burger{display:none}

/* drawer (mobile/tablet) */
@media (max-width:1079px){
  :root{--fcr-hh:60px}
  .fcr-hdr__in{padding:0 var(--fcr-s4);gap:var(--fcr-s3)}
  .fcr-brand img{height:34px}
  .fcr-brand__tag{height:28px;font-size:13px;padding:0 10px}
  .fcr-hdr__act .fcr-btn--wa,.fcr-hdr__act .fcr-hotels{display:none}
  .fcr-burger{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:44px;min-width:44px;padding:0 12px;border-radius:var(--fcr-r-m);border:1.5px solid var(--fcr-line-2);font-weight:600;font-size:14px}
  .fcr-burger .fcr-i-close{display:none}
  .fcr-hdr.is-open .fcr-burger .fcr-i-menu{display:none}
  .fcr-hdr.is-open .fcr-burger .fcr-i-close{display:block}
  .fcr-nav{position:fixed;inset:var(--fcr-dtop,calc(var(--fcr-hh) + var(--fcr-adm,0px))) 0 0 0;background:var(--fcr-paper);overflow-y:auto;overscroll-behavior:contain;padding:var(--fcr-s4) var(--fcr-s4) calc(var(--fcr-s8) + env(safe-area-inset-bottom));visibility:hidden;opacity:0;transform:translateY(-8px);transition:opacity .2s,transform .2s,visibility 0s .2s;border-top:1px solid var(--fcr-line)}
  .fcr-hdr.is-open .fcr-nav{visibility:visible;opacity:1;transform:none;transition:opacity .2s,transform .2s}
  .fcr-nav__list{flex-direction:column;align-items:stretch;gap:4px}
  .fcr-nav__btn,.fcr-nav__soon{width:100%;justify-content:space-between;height:52px;font-size:16px;padding:0 14px;background:var(--fcr-sand)}
  .fcr-pop,.fcr-pop--wide{position:static;min-width:0;box-shadow:none;border:0;padding:4px 0 8px;display:block}
  .fcr-pop--wide[hidden],.fcr-pop[hidden]{display:none}
  .fcr-pop--wide > div + div{margin-top:8px}
  .fcr-dest{min-height:52px;padding:8px 14px}
  .fcr-drawer-extra{display:grid!important;gap:var(--fcr-s2);margin-top:var(--fcr-s4)}
  .fcr-drawer-extra .fcr-btn{width:100%;min-height:52px;font-size:15.5px}
}
.fcr-drawer-extra{display:none}
body.fcr-lock{overflow:hidden}

/* ---------- mobile action bar ---------- */
.fcr-mbar{display:none}
@media (max-width:1079px){
  .fcr-mbar{display:flex;gap:var(--fcr-s2);position:fixed;inset-inline:0;bottom:0;z-index:999;padding:10px var(--fcr-s4) calc(10px + env(safe-area-inset-bottom));background:rgba(255,255,255,.98);border-top:1px solid var(--fcr-line);box-shadow:0 -6px 20px rgba(15,30,38,.08)}
  .fcr-mbar .fcr-btn{min-height:50px;font-size:15.5px}
  .fcr-mbar .fcr-btn--wa{flex:1 1 auto}
  .fcr-mbar .fcr-btn--icon{width:50px}
  body.fcr-on{padding-bottom:76px!important}
}

/* ---------- footer ---------- */
.fcr-ftr{position:relative;background:var(--fcr-ink);color:#D5DEE1;margin-top:var(--fcr-s7);padding-top:6px}
.fcr-ftr::before{content:"";position:absolute;inset-inline:0;top:0;height:4px;background:var(--fcr-road)}
.fcr-ftr__in{max-width:1240px;margin:0 auto;padding:var(--fcr-s7) var(--fcr-s5) var(--fcr-s6);display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:var(--fcr-s6)}
.fcr-ftr__logo{display:inline-flex;align-items:center;gap:10px;margin-bottom:var(--fcr-s3)}
.fcr-ftr__logo img{height:36px;width:auto;background:#fff;border-radius:10px;padding:4px 8px}
.fcr-ftr__logo span{color:var(--fcr-amber);font-weight:700}
.fcr-ftr__txt{font-size:14px;color:#AFC0C5;max-width:36ch;margin-bottom:var(--fcr-s4)!important}
.fcr-ftr__cta{display:flex;flex-wrap:wrap;gap:var(--fcr-s2)}
.fcr-ftr .fcr-btn--ghost{background:transparent;border-color:#3A4C55;color:#fff!important}
.fcr-ftr .fcr-btn--ghost:hover{border-color:var(--fcr-amber);color:var(--fcr-amber)!important}
.fcr-ftr__h{font-size:13px;font-weight:700;color:var(--fcr-amber);margin-bottom:var(--fcr-s3)!important}
.fcr-ftr__col a{display:inline-flex;align-items:center;gap:6px;min-height:40px;font-size:14.5px;color:#E3EAEC}
.fcr-ftr__col a:hover{color:#fff;text-decoration:underline;text-underline-offset:4px}
.fcr-ftr__col small{display:block;font-size:12px;color:#8FA3A9;margin-top:-6px;margin-bottom:6px}
.fcr-ftr__col svg{width:14px;height:14px}
.fcr-ftr__bar{border-top:1px solid #23343C}
.fcr-ftr__bar p{max-width:1240px;margin:0 auto!important;padding:var(--fcr-s4) var(--fcr-s5);font-size:13px;color:#8FA3A9;display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--fcr-s2)}
.fcr-ltr{direction:ltr;unicode-bidi:isolate}
@media (max-width:1079px){
  .fcr-ftr__in{grid-template-columns:1fr 1fr;gap:var(--fcr-s5) var(--fcr-s4);padding:var(--fcr-s6) var(--fcr-s4) var(--fcr-s5)}
  .fcr-ftr__about{grid-column:1/-1}
  .fcr-ftr__help{grid-column:1/-1}
  .fcr-ftr__bar p{padding:var(--fcr-s4)}
}

@media (prefers-reduced-motion:reduce){.fcr *{transition:none!important}}

/* admin-only preview badge: keep it above the mobile action bar */
@media (max-width:1079px){#fcr-pv{bottom:calc(86px + env(safe-area-inset-bottom))!important;top:auto!important;font-size:12px!important;padding:8px 12px!important;max-width:calc(100vw - 24px)!important}}
body.fcr-lock #fcr-pv{display:none!important}
@media (max-width:1079px){.fcr-ftr{padding-bottom:calc(76px + env(safe-area-inset-bottom))}}
@media (max-width:480px){.fcr-ftr__in > nav:nth-of-type(1){grid-column:1/-1}.fcr-ftr__in > nav:nth-of-type(1) ul{display:grid;grid-template-columns:1fr 1fr;column-gap:12px}.fcr-ftr__help{grid-column:auto}.fcr-ftr__col a{font-size:14px;line-height:1.4}}
