/* falcon.css — UI condivisa Falcon Phyto (Fase 1)
   Solo classi nuove (fp-*): non tocca gli stili esistenti delle pagine.
   Token derivati dalla palette storica dell'app. */
:root{
  --fp-green:#2e7d32; --fp-green-d:#1b5e20; --fp-blue:#1565c0;
  --fp-bg:#eef2ec; --fp-card:#fff; --fp-line:#e0e4dd;
  --fp-ink:#1f2a1c; --fp-muted:#6b7464;
  --fp-r-s:10px; --fp-r-m:14px; --fp-r-l:18px;
  --fp-shadow:0 2px 8px rgba(0,0,0,.05);
}

/* ---------- barra di navigazione unificata ---------- */
.fp-top{
  position:sticky; top:0; z-index:60;
  display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:6px;
  background:rgba(244,247,243,.9);
  -webkit-backdrop-filter:saturate(1.6) blur(14px); backdrop-filter:saturate(1.6) blur(14px);
  border-bottom:1px solid var(--fp-line);
  padding:calc(6px + env(safe-area-inset-top)) 8px 6px;
  min-height:44px;
}
.fp-back{
  justify-self:start; display:inline-flex; align-items:center; gap:1px;
  text-decoration:none; color:var(--fp-green-d); font-size:16px; font-weight:600;
  padding:7px 9px 7px 4px; border-radius:var(--fp-r-s);
  max-width:38vw; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.fp-back:active{background:rgba(0,0,0,.06)}
.fp-back .fp-chev{font-size:26px; line-height:.9; font-weight:400; margin-right:1px}
.fp-title{
  justify-self:center; font-size:16px; font-weight:700; color:var(--fp-ink);
  max-width:52vw; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.fp-right{justify-self:end}
.fp-hidden{display:none!important}

/* ---------- scheda account (dentro Impostazioni) ---------- */
.fp-account{
  background:var(--fp-card); border:1px solid var(--fp-line); border-radius:var(--fp-r-l);
  padding:16px 18px; margin:22px 0 8px; box-shadow:var(--fp-shadow);
  display:flex; align-items:center; gap:14px;
}
.fp-account .fp-avatar{
  width:44px; height:44px; flex:0 0 44px; border-radius:50%;
  background:var(--fp-green-d); color:#fff; display:flex; align-items:center; justify-content:center;
  font-size:19px; font-weight:700; text-transform:uppercase;
}
.fp-account .fp-mail{font-size:15px; font-weight:600; word-break:break-all}
.fp-account .fp-ruolo{font-size:12px; color:var(--fp-muted); margin-top:1px}
.fp-esci{
  margin-left:auto; flex:0 0 auto; border:1px solid var(--fp-line); background:#fff;
  color:#8c1d18; font-size:14px; font-weight:700; padding:9px 14px; border-radius:999px;
  text-decoration:none;
}
.fp-esci:active{background:#fdecea}

/* ---------- toast di conferma ---------- */
.fp-toast{
  position:fixed; left:50%; top:calc(12px + env(safe-area-inset-top)); z-index:300;
  transform:translateX(-50%) translateY(-10px);
  background:#233022; color:#fff; font-size:14px; font-weight:600;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  padding:11px 18px; border-radius:999px; box-shadow:0 8px 24px rgba(0,0,0,.28);
  opacity:0; transition:opacity .18s ease, transform .18s ease;
  pointer-events:none; max-width:88vw; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.fp-toast.fp-on{opacity:1; transform:translateX(-50%) translateY(0)}
.fp-toast.fp-ok{background:var(--fp-green-d)}
.fp-toast.fp-err{background:#8c1d18}
@media (prefers-reduced-motion:reduce){
  .fp-toast{transition:none}
}

/* ---------- lista raggruppata (stile Impostazioni iOS) — Fase 2 ---------- */
.fp-gruppo{
  background:var(--fp-card); border:1px solid var(--fp-line); border-radius:var(--fp-r-l);
  padding:2px 16px; margin:24px 0 10px; box-shadow:var(--fp-shadow);
}
.fp-riga{display:flex; align-items:center; gap:12px; padding:13px 0; text-decoration:none; color:inherit}
.fp-riga+.fp-riga{border-top:1px solid var(--fp-line)}
.fp-riga:active{opacity:.7}
.fp-rico{
  width:34px; height:34px; flex:0 0 34px; border-radius:9px; background:#f1f1ee;
  display:flex; align-items:center; justify-content:center; font-size:17px;
}
.fp-rtt{font-size:15px; font-weight:600}
.fp-rds{font-size:12px; color:var(--fp-muted); margin-top:1px}
.fp-rarr{margin-left:auto; color:var(--fp-muted); font-size:20px}

/* ---------- header GreenHouse con selettore ciclo — Fase 2c ---------- */
.fp-hrow{display:flex; align-items:center; justify-content:space-between; gap:10px; margin:22px 4px 8px}
.fp-hrow h2{margin:0}
.fp-ciclosel{
  -webkit-appearance:none; appearance:none;
  border:1px solid var(--fp-line); background:#fff; color:var(--fp-green-d);
  font-family:inherit; font-weight:600; font-size:13px;
  padding:7px 26px 7px 12px; border-radius:999px; max-width:58%;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%231b5e20' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 10px center;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}

/* ---------- griglia serre (GreenHouse) — Fase 2d ---------- */
/* fp-ux7-v1: 3 serre per fila anche su telefono, card compatte */
.fp-sgrid{display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:10px 0}
.fp-scard{
  display:flex; flex-direction:column; align-items:center; gap:5px;
  text-decoration:none; color:inherit;
  background:var(--fp-card); border:1px solid var(--fp-line); border-radius:var(--fp-r-l);
  padding:12px 6px 10px; box-shadow:var(--fp-shadow); transition:transform .05s ease; /* fp-ux7-v1 */
}
.fp-scard:active{transform:scale(.97)}
.fp-sico{position:relative; width:44px; height:39px; color:var(--fp-green-d)} /* fp-ux7-v1 */
.fp-sico svg{width:100%; height:100%}
.fp-sdot{
  position:absolute; right:-5px; top:-3px; width:13px; height:13px; border-radius:50%;
  background:#c9cfc6; border:2.5px solid var(--fp-card);
}
.fp-sdot.full{background:var(--fp-green)}
.fp-sdot.part{background:#e0a100}
.fp-snome{font-size:15px; font-weight:700; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap} /* fp-ux7-v1 */
.fp-sstat{font-size:11px; color:var(--fp-muted); white-space:nowrap} /* fp-ux7-v1 */
.fp-sstat b{color:var(--fp-ink); font-weight:600}

/* ---------- salvataggio sempre a portata di pollice — Fase 3 ---------- */
.fp-savebar{
  position:fixed; left:50%; transform:translateX(-50%);
  bottom:calc(12px + env(safe-area-inset-bottom)); z-index:120;
  border:0; border-radius:999px; background:var(--fp-green-d); color:#fff;
  font-family:inherit; font-size:16px; font-weight:700;
  padding:14px 26px; box-shadow:0 8px 24px rgba(0,0,0,.28);
  cursor:pointer; max-width:92vw; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.fp-savebar:active{transform:translateX(-50%) scale(.97)}
.fp-savebar.hide{display:none}
.fp-stickybtn{position:sticky; bottom:12px; z-index:20; box-shadow:0 6px 18px rgba(0,0,0,.18)}

/* ---------- griglia tappe (rilievo irriguo) — Fase 3b ---------- */
/* fp-ux9-v1: 4 tappe per fila; nei blocchi mezza-riga la pagina passa a 2 colonne */
.fp-tgrid{display:grid; grid-template-columns:repeat(4,1fr); gap:6px; margin:6px 0 12px}
.fp-tcard{
  position:relative; display:flex; flex-direction:column; align-items:center; gap:2px;
  background:#fff; border:1px solid var(--fp-line); border-radius:14px;
  padding:9px 6px 8px; cursor:pointer; transition:transform .05s ease; /* fp-ux8-v1 */
}
.fp-tcard:active{transform:scale(.96)}
.fp-tcard .fp-tico{width:19px; height:24px; color:var(--fp-blue)} /* fp-ux8-v1 */
.fp-tcard .fp-tico svg{width:100%; height:100%}
.fp-tset{font-size:12.5px; font-weight:700; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap} /* fp-ux8-v1 */
.fp-tsub{font-size:10px; color:var(--fp-muted); max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap} /* fp-ux8-v1 */
.fp-tdot{
  position:absolute; right:7px; top:6px; width:17px; height:17px; border-radius:50%;
  font-size:11px; font-weight:800; line-height:17px; text-align:center; color:#fff;
}
.fp-tcard.done{background:#f4faf3; border-color:#cfe3cb}
.fp-tcard.done .fp-tdot{background:var(--fp-green)}
.fp-tcard.done .fp-tico{color:#9fb99b}
.fp-tcard.cur{border:2px solid var(--fp-blue); padding:8px 5px 7px; background:#f4f8fe} /* fp-ux8-v1 */

/* ==================== DARK MODE automatica — Fase 4 ====================
   Segue il tema del telefono (prefers-color-scheme). Le pagine condividono
   la stessa palette di variabili: qui si ribaltano, piu' le correzioni
   puntuali dove i colori erano fissi. Testo accent chiaro (--green-d),
   sfondi dei bottoni ri-scuriti esplicitamente. */
@media (prefers-color-scheme: dark){
  :root{
    color-scheme:dark;
    --bg:#141811; --card:#1d241b; --line:#35402f; --ink:#e8ede5; --muted:#9ba695;
    --green:#35933e; --green-d:#a5d6a7; --blue:#82b4ee;
    --amber:#f4b942; --amber-d:#d99a2b; --red:#ef7066;
    --fp-bg:#141811; --fp-card:#1d241b; --fp-line:#35402f; --fp-ink:#e8ede5; --fp-muted:#9ba695;
    --fp-green:#35933e; --fp-green-d:#a5d6a7; --fp-blue:#82b4ee;
  }
  body{background:var(--bg)}
  input,select,textarea{background:#232b21; color:var(--ink); border-color:var(--line)}
  input::placeholder,textarea::placeholder{color:#7b8574}
  /* sfondi che usavano il verde scuro (ora e' testo chiaro): ri-scuriti */
  .acct{background:#1d3620}
  .btn:active{background:#2a7031}
  button.dl{background:var(--green)}
  .btn.ghost{background:#242c22; color:var(--green-d)}
  .seg button{background:var(--card); color:var(--ink)}
  /* tinte chiare fisse -> equivalenti scuri */
  .ico{background:#262e23}
  .ico.g{background:#20351f} .ico.b{background:#1c2a3c} .ico.n{background:#262e23}
  .ico.p{background:#2a2433} .ico.s{background:#332c1c}
  .hint{background:transparent; border-color:var(--line); color:var(--muted)}
  .readout{background:#20271e; border-color:var(--line)}
  .guida{background:#1d2a1b; border-color:#2e4429}
  .status.ok{background:#1d3320; color:#b4e2b7; border-color:#2f5a33}
  .status.err{background:#3b2321; color:#f2b0aa; border-color:#5e332f}
  .status.no{background:#38301e; color:#f0cf8f; border-color:#5c4b26}
  .mbadge.ok{background:#1d3320; color:#b4e2b7; border-color:#2f5a33}
  .mbadge.no{background:#3b2321; color:#f2b0aa; border-color:#5e332f}
  .pill{background:var(--card)}
  .pill.done{background:#1d3320; border-color:#2f5a33}
/* fp-ciclo-data-v3: la pillola di casa (vestito unico dei numeri di testata) */
.fp-pillbar{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin:10px 0}
.fp-pill{background:var(--card);border:1px solid var(--line);border-radius:999px;padding:8px 14px;font-size:14px}
.fp-pill b{color:var(--green-d)}
.fp-pill.done{background:#1d3320;border-color:#2f5a33}
.fp-pill svg{width:16px;height:16px;vertical-align:-3px}
  .vuoto{background:var(--card)}
  .lrow{background:var(--card)}
  .lrow.cur{background:#1d2f1b}
  .allarme{background:#3b2321; border-color:#5e332f; color:#f2b0aa}
  .chart svg [stroke="#eee"]{stroke:#37402e}
  /* componenti fp */
  .fp-top{background:rgba(20,24,18,.9)}
  .fp-savebar{background:#2a7031}
  .fp-toast.fp-ok{background:#2a7031}
  .fp-account .fp-avatar{background:#2a7031}
  .fp-esci{background:var(--fp-card)}
  .fp-rico{background:#262e23}
  .fp-ciclosel{
    background-color:var(--fp-card);
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23a5d6a7' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  }
  .fp-tcard{background:var(--fp-card)}
  .fp-tcard.done{background:#1d3320; border-color:#2f5a33}
  .fp-tcard.done .fp-tico{color:#5e7f60}
  .fp-tcard.cur{background:#182636}
}

/* ==================== DARK MODE — correzioni v8 (grafici e spoiler) ====================
   Le serie dei grafici (storico, irrigazione, resa) usano colori scuri fissi
   negli attributi SVG: qui si rimappano sugli equivalenti chiari. Le legende
   hanno il colore inline nello style: serve il selettore a sottostringa. */
@media (prefers-color-scheme: dark){
  /* assi e griglia */
  svg [stroke="#eee"]{stroke:#333d2e}
  svg [fill="#999"]{fill:#9ba695}
  /* serie: scuro -> chiaro (stessa tinta) */
  svg [stroke="#2e7d32"]{stroke:#7ec983} svg [fill="#2e7d32"]{fill:#7ec983}
  svg [stroke="#1b5e20"]{stroke:#7ec983} svg [fill="#1b5e20"]{fill:#7ec983}
  svg [stroke="#1565c0"]{stroke:#82b4ee} svg [fill="#1565c0"]{fill:#82b4ee}
  svg [stroke="#f9a825"]{stroke:#f4c04f} svg [fill="#f9a825"]{fill:#f4c04f}
  svg [stroke="#e53935"]{stroke:#f28b84} svg [fill="#e53935"]{fill:#f28b84}
  svg [stroke="#6a1b9a"]{stroke:#c493e0} svg [fill="#6a1b9a"]{fill:#c493e0}
  svg [stroke="#00838f"]{stroke:#6cc9d4} svg [fill="#00838f"]{fill:#6cc9d4}
  svg [stroke="#5d4037"]{stroke:#c9a191} svg [fill="#5d4037"]{fill:#c9a191}
  /* legende e badge col colore inline */
  [style*="color:#2e7d32"]{color:#7ec983!important}
  [style*="color:#1b5e20"]{color:#7ec983!important}
  [style*="color:#1565c0"]{color:#82b4ee!important}
  [style*="color:#f9a825"]{color:#f4c04f!important}
  [style*="color:#e53935"]{color:#f28b84!important}
  [style*="color:#6a1b9a"]{color:#c493e0!important}
  [style*="color:#00838f"]{color:#6cc9d4!important}
  [style*="color:#5d4037"]{color:#c9a191!important}
  /* spoiler / sezioni a scomparsa (dettaglio ciclo in Resa, opzioni in Nutrizione) */
  details{border-color:var(--line)}
  details[open]{background:#20261e}
  summary{color:var(--green-d)}
  /* avviso giallo (Nutrizione) */
  .avviso{background:#332c17; border-color:#5c4b26}
}

/* ==================== DARK MODE — chiusura audit v9 ====================
   Selettori con sfondi chiari fissi emersi dall'audit completo pagina per
   pagina: pagina serra (.gruppo), semaforo sentinella in home, barre del
   confronto storico, scatole varie. */
@media (prefers-color-scheme: dark){
  .gruppo{background:var(--card)}
  #srvBadge{background:var(--card); color:var(--ink); border-color:var(--line)}
  #srvBadge.ok{background:#1d3320; border-color:#2f5a33; color:#b4e2b7}
  #srvBadge.warn{background:#38301e; border-color:#5c4b26; color:#f0cf8f}
  #srvBadge.fail{background:#3b2321; border-color:#5e332f; color:#f2b0aa}
  #srvDet{background:var(--card); border-color:var(--line)}
  .csv{background:var(--card)}
  .csbarwrap{background:#262e23}
  .csband{background:#3a5a36}
  .step{background:#332c17; border-color:#5c4b26; color:#f0cf8f}
  .chip{background:#262e23}
  .sugg{background:#20351f; border-color:#2e4a2b}
  .desc{background:#20261e; border-color:var(--line)}
  .estivo{background:#332c17; border-color:#5c4b26}
  .garrow{background:var(--card)}
  .badge{background:#20351f}
  .gh{background:var(--card)}
  .add{background:#20351f}
  .tappa{background:var(--card)}
  .trow select{background:#232b21; color:var(--ink); border-color:var(--line)}
  .btn[disabled]{background:#3a4436; color:#93a08c}
}

/* fp-anti-sbordo-v1: token lunghi (email, URL) si spezzano invece di
   sfondare le card; i figli flex tornano liberi di stringersi; il body
   non scrolla mai di lato. :where = specificita' zero, nessuna regola
   esistente viene scavalcata. */
body{overflow-x:hidden}
.wrap :where(div,span,p,b,i,td,li){min-width:0;overflow-wrap:anywhere}

/* fp-pota-footer-v1: il terzo ritorno muore ovunque — il footer coi
   link sparisce da tutta l'app, il ritorno vive solo nel header. */
.foot{display:none}