/* fuel-prices.eu - light theme layer (POC 20 aug 2026). Aditiv: default ramane dark. */
html.fp-light{
  --bg:#eef1f5; --bg-card:#ffffff; --bg-elev:rgba(255,255,255,.92);
  --border:rgba(16,28,42,.14); --border-strong:rgba(16,28,42,.30);
  --text:#1a2430; --text-dim:#44536a; --text-muted:#57657c;
  --cyan:#00705f; --cyan-dim:rgba(0,112,95,.55);
  --amber:#92610a; --red:#c92a2a; --emerald:#0b7a53;
  color-scheme:light;
}
html.fp-light body::before{opacity:.015}
#fpThemeBtn{position:fixed;top:14px;right:14px;z-index:10050;padding:8px 14px;border-radius:8px;
  border:1px solid rgba(255,255,255,.25);background:#141a20;color:#d6dde6;
  font:600 12px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.6px;cursor:pointer}
html.fp-light #fpThemeBtn{background:#ffffff;color:#1a2430;border-color:rgba(16,28,42,.30)}
#fpThemeBtn:hover{border-color:var(--cyan,#00e5c7)}

/* below-fold sheet (.fp-below) — varianta light */
html.fp-light .fp-below{
  background:linear-gradient(180deg,#e7ebf0 0,#eef1f5 240px);
  border-top:1px solid rgba(0,112,95,.35);
  box-shadow:0 -18px 50px rgba(15,28,42,.14);
  color:#26303d;
}
html.fp-light .fp-below h1, html.fp-light .fp-below h2, html.fp-light .fp-below h3,
html.fp-light .fp-below h4, html.fp-light .fp-below strong{color:#16202c}
html.fp-light .fp-below a{color:#00705f}

/* masca de focus (vecinii tarii, poligon negru) — in light devine ceata deschisa */
html.fp-light .leaflet-overlay-pane path[fill="#000"]{fill:#dfe7ef}

/* bara de reclama ancora (containerul nostru; creativul din iframe ramane al Google) */
html.fp-light #fpAnchor{background:rgba(248,250,252,.96);border-top:1px solid rgba(0,112,95,.35);box-shadow:0 -8px 30px rgba(15,28,42,.18)}
html.fp-light #fpAnchor::before{background:linear-gradient(90deg,#00705f,#0b7a53)}
html.fp-light .fp-anchor__label{color:#57657c}
html.fp-light .fp-anchor__close{color:#44536a;background:transparent}
html.fp-light #fpAnchorReopen{background:rgba(248,250,252,.96);border-color:rgba(0,112,95,.4);color:#00705f}
html.fp-light .fp-anchor__close{border-color:rgba(0,112,95,.4)}
html.fp-light .fp-anchor__close:hover{background:rgba(0,112,95,.10)}

/* hotfix 21 aug 2026 — dropdown de căutare + inputuri ilizibile în light (background
   hardcodat rgba(13,17,23,.96), text pe tokens deschise = contrast inversat); bara de
   reclamă (#fpAnchor__ins, 970px) cu creativul de 728px lipit stânga în loc de centrat. */
html.fp-light .search-dropdown{background:rgba(255,255,255,.97);box-shadow:0 12px 32px rgba(15,28,42,.16),0 0 0 1px rgba(0,112,95,.06)}
html.fp-light .sd-item{border-bottom-color:rgba(16,28,42,.07)}
html.fp-light .sd-item:hover,html.fp-light .sd-item.active{background:rgba(0,112,95,.07)}
html.fp-light .sd-price{background:rgba(16,28,42,.05)}
html.fp-light .search-box input,html.fp-light .route-search{background:rgba(16,28,42,.05)}
html.fp-light .search-box input:focus{background:rgba(0,112,95,.06)}
.fp-anchor__ins{text-align:center}
.fp-anchor__ins iframe{margin:0 auto}

/* polish v2, 21 aug 2026 — moșteniri dark rămase în light (panoul "lângă tine", selectul de
   carburant principal, pastilele RON/EUR/USD, atribuirea Leaflet) + rafinare buton temă.
   Toate fundalurile de mai jos erau rgba(0,0,0,.15-.4) hardcodat, indiferent de temă. */

/* --- panoul "lângă tine" (near-me): cardul de recomandare + selectul + slider-ul raza --- */
html.fp-light .nm-bd-card{background:rgba(255,255,255,.85);border-color:rgba(146,97,10,.35);box-shadow:0 4px 16px rgba(15,28,42,.08),inset 0 0 0 1px rgba(16,28,42,.02)}
html.fp-light .nm-bd-hint{background:rgba(16,28,42,.045)}
html.fp-light .nm-bd-cta-btn.detail{background:rgba(16,28,42,.05)}
html.fp-light .nm-bd-cta-btn{color:var(--emerald)}
html.fp-light .nm-bd-label{color:var(--amber)}
html.fp-light .nm-bd-metric-value.total{color:var(--amber)}
html.fp-light .nm-bd-metric-value.price{color:var(--emerald)}
html.fp-light .nm-fuel-select{background:rgba(16,28,42,.05)}
html.fp-light .nm-radius{background:rgba(16,28,42,.035)}
html.fp-light .nm-settings-toggle{background:rgba(16,28,42,.03)}
html.fp-light .nm-settings{background:rgba(16,28,42,.02)}
html.fp-light .nm-action{background:rgba(16,28,42,.05)}
html.fp-light .near-me-btn .nm-badge{background:rgba(16,28,42,.08)}
html.fp-light .near-me-btn.active .nm-badge{background:rgba(0,112,95,.12)}
html.fp-light .sd-meta{background:rgba(16,28,42,.04)}

/* --- selectul principal (Toti carburantii) + pastilele RON/EUR/USD, RO/EN --- */
html.fp-light .select{background:rgba(16,28,42,.05)}
html.fp-light .toggle-group{background:rgba(16,28,42,.05)}
html.fp-light .toggle-opt.active{color:#fff}

/* --- atribuire Leaflet: fundal negru ilizibil în light --- */
html.fp-light .leaflet-control-attribution{background:rgba(255,255,255,.85)!important;color:#44536a!important}
html.fp-light .leaflet-control-attribution a{color:var(--cyan)!important}

/* --- buton temă: aliniere icon+text, hover rafinat --- */
#fpThemeBtn{display:inline-flex;align-items:center;gap:6px;transition:border-color .15s ease,box-shadow .15s ease}
#fpThemeBtn svg{flex:0 0 auto;display:block}
#fpThemeBtn:hover{border-color:var(--cyan,#00e5c7);box-shadow:0 0 0 1px rgba(0,229,199,.18)}
html.fp-light #fpThemeBtn:hover{box-shadow:0 0 0 1px rgba(0,112,95,.14)}

/* hotfix 21 aug 2026 - vezi fp-theme.js: cand panoul de statie (#detail-panel.open)
   e deschis, butonul de tema (fixed top:14/right:14) se suprapune peste X-ul lui
   de close (.detail-close, tot top-right). Ascundem butonul cat panoul e deschis,
   in ambele teme, mostenind tranzitia FAB-urilor deja folosita in familie. */
#fpThemeBtn.fp-hide-for-panel{opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .18s ease,visibility 0s linear .18s}

/* lightcity 21-22 aug 2026 — DIRECTIVA lightcity: /live/romania/{oras}/ (city_ro.php, D14,
   75 orase) avea tokens LOCALE proprii (--bgc/--bgh/--cy/--gn/--tx/--txd/--bd) neconectate
   la stratul global -> fix-ul de fond e redenumirea lor in fisier la tokens canonice
   (--bg-card/--bg-elev/--cyan/--emerald/--text/--text-dim/--border), care mostenesc automat
   html.fp-light de aici. Regulile de mai jos sunt DOAR completari tintite, globale, pentru
   componente care raman needarite dupa redenumire (masurat efectiv, nu presupus). */

/* city_ro.php: header-ul sticky (<header>, fara clasa) e UNIC in familia /live/ — nu exista
   in celelalte 5 city*.php si nu in index/station.php (verificat, zero coliziuni) — foloseste
   glass dark hardcodat (rgba(13,14,18,.9)), ramanea o bara neagra in pagina light. */
html.fp-light header{background:rgba(248,250,252,.92)}

/* city_ro.php: badge-ul "Date din ..." avea fundal cu tenta verde fixa (rgba(34,197,94,.08))
   care, masurat, da doar 4.45:1 cu textul emerald din light (--emerald:#0b7a53) — sub pragul
   AA de 4.5:1. Fundal alb (var(--bg-card)) + acelasi text -> 5.35:1, verificat OK. */
html.fp-light .stamp{background:var(--bg-card);border-color:rgba(11,122,83,.35)}

/* city_ro.php: legenda hartii "ieftin -> scump" (.lgd i, gradient verde-galben-rosu) — culorile
   raman semantice universale (nu se schimba pe tema), dar swatch-ul era fara contur si se
   pierdea vizual pe fundal alb; adaugam contur, acelasi tratament ca markerii hartii. */
html.fp-light .lgd i{border:1px solid var(--border)}

/* celelalte 5 city*.php (denmark/france/italy/spain/uk) — buton activ .lang-toggle a.active
   are text hardcodat #06281f, calibrat pentru --cyan dark (#00e5c7, deschis) -> 9.79:1 acolo.
   In light, --cyan devine #00705f (teal inchis) -> textul inchis pe fundal inchis da doar
   2.62:1, sub AA. Text alb pe acelasi fundal teal -> 6.03:1 (verificat), acelasi idiom deja
   folosit mai sus pentru .toggle-opt.active. */
html.fp-light .lang-toggle a.active,
html.fp-light .lang-toggle a.active:hover{color:#fff}

/* gasit la QA (nu presupus): 4 din cele 6 city*.php (france/italy/uk/denmark — spain si romania
   NU includ search-box.php) au wrapper-ul .fps-host cu tokens PROPRII setate INLINE
   (style="--fps-card:#11151c;--fps-border:rgba(255,255,255,.12);--fps-muted:#9aa6b8;..."),
   care ocolesc lantul de fallback din search-box.php insusi (var(--fps-card,var(--bg-card,...)))
   -- exact acelasi tip de bug ca city_ro.php, dar prin custom-properties inline in loc de :root.
   O proprietate CSS setata inline nu poate fi batuta decat cu !important intr-o foaie externa.
   Masurat: caseta de cautare ramanea neagra (fundal #11151c) in pagina light (motivul
   "carduri negre in afara hartii"); --fps-muted (subtitluri, placeholder, eticheta grupului
   din dropdown) 2.46:1 pe alb; --fps-accent (icon+contur) 1.61:1 pe alb. Refolosim exact
   valorile deja validate mai sus (--cyan/--text-dim/--border din light), nu valori noi. */
html.fp-light .fps-host{
  --fps-card:#ffffff!important; --fps-cardh:#f3f5f8!important;
  --fps-border:rgba(16,28,42,.14)!important; --fps-muted:#44536a!important;
  --fps-accent:#00705f!important; --fps-accent-soft:rgba(0,112,95,.12)!important;
  --fps-ring:rgba(0,112,95,.20)!important;
}
