/* Diga di Ridracoli (#1695). Stessa grammatica di drought.css: pannelli su --bg-secondary, note in
   --text-secondary. I colori dei DATI hanno la loro coppia chiaro/scuro; nel chiaro le linee sono scure
   abbastanza da superare 3:1 anche sopra le fasce grigie (contrasto non testuale, WCAG 1.4.11). */
:root {
  --rd-acqua: #1558b0;
  --rd-acqua-tenue: rgba(21, 88, 176, .14);
  --rd-prev: #a14a06;
  --rd-prev-tenue: rgba(180, 83, 9, .20);
  --rd-pioggia: #2f8f83;
  --rd-grigio: #6b7280;
  --rd-mediana: #3f4752;
  --rd-gronda: rgba(47, 143, 131, .14);
  --rd-bordo-bacino: rgba(60, 70, 80, .55);
  --rd-giu: #b3261e;
  --rd-su: #0b7a52;
}
[data-theme="dark"] {
  --rd-acqua: #6cb6ff;
  --rd-acqua-tenue: rgba(108, 182, 255, .20);
  --rd-prev: #ffb74d;
  --rd-prev-tenue: rgba(255, 183, 77, .24);
  --rd-pioggia: #5fd0c2;
  --rd-grigio: #a7b0bd;
  --rd-mediana: #d0d6de;
  --rd-gronda: rgba(95, 208, 194, .13);
  --rd-bordo-bacino: rgba(210, 220, 230, .45);
  --rd-giu: #ff8a80;
  --rd-su: #69d3a6;
}

.rd-vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.rd-main { max-width: 1100px; margin: 0 auto; padding: 1rem 1rem 4rem; }
.rd-intro h1 { font-family: var(--font-display, inherit); margin: .4rem 0 .5rem; }
.rd-lede { color: var(--text-secondary); line-height: 1.55; margin: 0; }
.rd-foto { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; margin: .9rem 0 0; }
.rd-foto figure { margin: 0; }
.rd-foto img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 10px;
               border: 1px solid var(--border); background: var(--bg-tertiary); }
.rd-foto figcaption { font-size: var(--font-size-sm, .8125rem); line-height: 1.35; margin-top: .3rem; color: var(--text-secondary); }
.rd-foto figcaption b { color: var(--text-primary); }
.rd-foto__crediti { grid-column: 1 / -1; margin: 0; font-size: var(--font-size-xs, .75rem); color: var(--text-secondary); line-height: 1.4; }
.rd-foto__crediti a { color: var(--primary); }
.rd-aggiornato { margin: .5rem 0 0; font-size: var(--font-size-sm, .875rem); color: var(--text-secondary); }
.rd-aggiornato:empty { display: none; }
.rd-avviso {
  margin: .9rem 0 0; padding: .7rem .9rem; border-radius: var(--radius, 10px);
  border: 1px solid var(--rd-prev); background: var(--rd-prev-tenue); color: var(--text-primary); line-height: 1.45;
}
.rd-stato { color: var(--text-secondary); margin: 0; min-height: 1.5em; }

.rd-panel {
  margin-top: 1.6rem; padding: 1rem; border: 1px solid var(--border);
  border-radius: var(--radius, 12px); background: var(--bg-secondary);
}
.rd-panel h2 { margin: 0 0 .7rem; font-size: 1.2rem; display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.rd-panel h3 { margin: 1.4rem 0 .45rem; font-size: 1rem; }
.rd-note { color: var(--text-secondary); font-size: var(--font-size-sm, .875rem);
           margin: .6rem 0 0; line-height: 1.5; }
.rd-note--prima { margin-top: 0; }
.rd-note:empty { display: none; }
.rd-scarica { color: var(--primary); white-space: nowrap; }
.rd-badge { font-size: var(--font-size-xs, .75rem); font-weight: 600; text-transform: uppercase; letter-spacing: .05em;
            padding: .15rem .55rem; border-radius: 999px; border: 1px solid var(--rd-prev); color: var(--rd-prev);
            background: var(--rd-prev-tenue); }
.rd-sperimentale { margin: 0 0 .8rem; line-height: 1.5; }

/* ---------- adesso ---------- */
.rd-adesso__grid { display: grid; gap: 1.2rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 760px) { .rd-adesso__grid { grid-template-columns: minmax(260px, 1fr) minmax(0, 1fr); align-items: center; } }
.rd-livello__pct { font-family: var(--font-display, inherit); font-size: 3.4rem; line-height: 1;
                   font-weight: 700; color: var(--rd-acqua); font-variant-numeric: tabular-nums; }
.rd-livello__pct small { font-size: 1.6rem; margin-left: .1rem; }
.rd-livello__txt { margin: .35rem 0 .7rem; color: var(--text-primary); line-height: 1.45; }
.rd-livello__nota { margin: .7rem 0 0; font-size: var(--font-size-sm, .875rem); color: var(--text-secondary); line-height: 1.45; }
.rd-barra { position: relative; height: 18px; border-radius: 9px; overflow: hidden;
            background: var(--bg-tertiary); border: 1px solid var(--border); }
.rd-barra__acqua { position: absolute; inset: 0 auto 0 0; width: 0; background: var(--rd-acqua); transition: width .6s ease-out; }
@media (prefers-reduced-motion: reduce) { .rd-barra__acqua { transition: none; } }
.rd-barra__scala { display: flex; justify-content: space-between; margin-top: .25rem;
                   font-size: var(--font-size-xs, .75rem); color: var(--text-secondary); }
.rd-scala { margin: 0; }
.rd-scala svg { width: 100%; max-width: 360px; height: auto; display: block; }
.rd-tab__fascia { display: block; font-size: var(--font-size-xs, .75rem); }
.rd-tab thead th { white-space: normal; }
.rd-tab--prev tbody th { white-space: nowrap; }
@media (min-width: 640px) { .rd-tab__fascia { display: inline; margin-left: .4rem; } }
.rd-scala figcaption { font-size: var(--font-size-sm, .8125rem); color: var(--text-secondary); line-height: 1.4; margin-top: .3rem; }

.rd-cifre { display: grid; gap: .7rem; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 1.2rem 0 0; }
@media (min-width: 900px) { .rd-cifre { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.rd-cifra { border: 1px solid var(--border); border-radius: var(--radius, 10px); padding: .7rem .8rem; background: var(--bg-primary); margin: 0; }
.rd-cifra dt { font-size: var(--font-size-xs, .75rem); text-transform: uppercase; letter-spacing: .04em; color: var(--text-secondary); }
.rd-cifra dd { margin: .25rem 0 0; font-family: var(--font-display, inherit); font-size: 1.45rem; line-height: 1.15; font-variant-numeric: tabular-nums; }
.rd-cifra dd small { font-size: .85rem; color: var(--text-secondary); }
.rd-cifra dd.rd-cifra__nota { font-family: var(--font-body, inherit); font-size: var(--font-size-sm, .8125rem);
                              color: var(--text-secondary); line-height: 1.35; }
.rd-giu { color: var(--rd-giu); }
.rd-su { color: var(--rd-su); }

.rd-ufficiale { margin: 1.1rem 0 0; padding: .8rem .95rem; border-radius: var(--radius, 10px);
                border: 1px solid var(--rd-prev); border-left-width: 5px; background: var(--bg-primary); }
.rd-ufficiale h3 { margin: 0 0 .3rem; font-size: 1rem; }
.rd-ufficiale h3 span { color: var(--rd-prev); text-transform: uppercase; letter-spacing: .03em; }
.rd-ufficiale p { margin: 0; line-height: 1.5; }
.rd-ufficiale__fonte { margin-top: .4rem !important; font-size: var(--font-size-sm, .8125rem); color: var(--text-secondary); }
.rd-ufficiale a { color: var(--primary); }
.rd-confronto { margin: 1rem 0 0; line-height: 1.5; }
.rd-confronto:empty { display: none; }

.rd-chart { width: 100%; height: 300px; margin-top: .4rem; }
.rd-chart--alto { height: 360px; }

/* ---------- previsione ---------- */
.rd-risposta { font-size: 1.05rem; line-height: 1.5; margin: 0 0 .8rem; }
.rd-risposta:empty { display: none; }
.rd-pp { display: grid; gap: .35rem; max-width: 560px; }
.rd-pp__riga { display: grid; grid-template-columns: 8.5em minmax(60px, 1fr) 9.5em; gap: .6rem; align-items: center;
               font-variant-numeric: tabular-nums; }
.rd-pp__giorno { font-size: var(--font-size-sm, .875rem); }
.rd-pp__barra { position: relative; height: 12px; border-radius: 6px; background: var(--bg-tertiary); overflow: hidden; }
.rd-pp__fascia { position: absolute; top: 0; bottom: 0; background: var(--rd-pioggia); opacity: .35; border-radius: 6px; }
.rd-pp__val { position: absolute; top: -2px; bottom: -2px; width: 4px; border-radius: 2px; background: var(--rd-pioggia); }
.rd-pp__num { font-size: var(--font-size-sm, .875rem); }
.rd-pp__num small { color: var(--text-secondary); }

.rd-scenari { border: 0; padding: 0; margin: 0 0 .4rem; }
.rd-scenari legend { padding: 0; margin: 0 0 .35rem; font-size: var(--font-size-sm, .875rem); color: var(--text-secondary); }
.rd-scenari__opz { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; max-width: 540px; }
.rd-scenario { position: relative; display: flex; flex-direction: column; align-items: center; cursor: pointer;
               padding: .5rem .5rem; border-radius: 12px; border: 1px solid var(--border); background: var(--bg-primary);
               line-height: 1.25; text-align: center; }
.rd-scenario input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.rd-scenario__nome { font-weight: 600; }
.rd-scenario__val { font-size: var(--font-size-xs, .75rem); color: var(--text-secondary); }
.rd-scenario:has(input:checked) { border-color: var(--rd-prev); background: var(--rd-prev-tenue); box-shadow: inset 0 0 0 1px var(--rd-prev); }
.rd-scenario:has(input:focus-visible) { outline: 2px solid var(--rd-prev); outline-offset: 2px; }

.rd-tablewrap { overflow-x: auto; margin-top: .6rem; }
.rd-tab { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.rd-tab th, .rd-tab td { text-align: right; padding: .45rem .5rem; border-bottom: 1px solid var(--border-light, var(--border)); white-space: nowrap; }
.rd-tab th:first-child, .rd-tab td:first-child { text-align: left; white-space: normal; }
.rd-tab tbody th { font-weight: 400; }
.rd-tab thead th { font-size: var(--font-size-xs, .75rem); text-transform: uppercase; letter-spacing: .03em; color: var(--text-secondary); font-weight: 600; }
.rd-tab tbody tr:last-child th, .rd-tab tbody tr:last-child td { border-bottom: 0; }
.rd-tab small { color: var(--text-secondary); text-transform: none; letter-spacing: 0; font-weight: 400; }
.rd-tab .rd-tab__misurata th, .rd-tab .rd-tab__misurata td { font-weight: 600; }
.rd-tab .rd-tab__passato { opacity: .55; }
.rd-verifica { margin: .8rem 0 0; padding: .6rem .8rem; border-radius: 10px; background: var(--bg-primary); border: 1px dashed var(--border);
               font-size: var(--font-size-sm, .875rem); line-height: 1.45; }
.rd-verifica:empty { display: none; }

.rd-more { margin-top: 1rem; }
.rd-more summary { cursor: pointer; font-weight: 600; color: var(--primary); padding: .25rem 0; }
.rd-limiti, .rd-passi { color: var(--text-secondary); font-size: var(--font-size-sm, .875rem); line-height: 1.55; padding-left: 1.2rem; margin: .5rem 0 0; }
.rd-limiti li, .rd-passi li { margin: .4rem 0; }
.rd-limiti strong { color: var(--text-primary); }

/* ---------- mappa ---------- */
.rd-mappa { margin: .8rem 0 0; }
.rd-mappa svg { width: 100%; max-width: 640px; height: auto; display: block; margin: 0 auto; }
.rd-mappa figcaption { font-size: var(--font-size-sm, .8125rem); color: var(--text-secondary); line-height: 1.45; margin: .5rem 0 0; }
.rd-mappa__nome { font-size: 15px; font-weight: 600; fill: var(--text-primary); paint-order: stroke; stroke: var(--bg-secondary); stroke-width: 4px; }
.rd-mappa__info { font-size: 13px; fill: var(--text-secondary); paint-order: stroke; stroke: var(--bg-secondary); stroke-width: 4px; }
.rd-mappa__lista { margin: .8rem 0 0; padding-left: 1.2rem; font-size: var(--font-size-sm, .875rem); line-height: 1.55; color: var(--text-secondary); }
.rd-mappa__lista b { color: var(--text-primary); font-weight: 600; }

/* ---------- storico ---------- */
.rd-toolbar { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; margin: .8rem 0 0; }
.rd-toolbar label { font-size: var(--font-size-sm, .875rem); color: var(--text-secondary); }
.rd-toolbar select { max-width: 100%; font: inherit; padding: .35rem .5rem; border-radius: 8px;
                     border: 1px solid var(--border); background: var(--bg-primary); color: var(--text-primary); }
.rd-periodi { display: flex; flex-wrap: wrap; gap: .4rem; margin: 0 0 .2rem; }
.rd-periodi button { font: inherit; font-size: var(--font-size-sm, .875rem); cursor: pointer; padding: .35rem .75rem;
                     border-radius: 999px; border: 1px solid var(--border); background: var(--bg-primary); color: var(--text-primary); }
.rd-periodi button[aria-pressed="true"] { border-color: var(--rd-acqua); background: var(--rd-acqua-tenue); font-weight: 600; }
.rd-periodi button:focus-visible { outline: 2px solid var(--rd-acqua); outline-offset: 2px; }

.rd-fare p { margin: 0; line-height: 1.55; }
.rd-metodo dl { margin: .4rem 0 0; }
.rd-metodo dt { font-weight: 600; margin-top: .7rem; }
.rd-metodo dd { margin: .2rem 0 0; color: var(--text-secondary); font-size: var(--font-size-sm, .875rem); line-height: 1.5; }
.rd-metodo a { color: var(--primary); }

@media (max-width: 640px) {
  .rd-main { padding: .6rem .7rem 3rem; }
  .rd-panel { padding: .85rem; }
  .rd-chart { height: 270px; }
  .rd-chart--alto { height: 310px; }
  .rd-livello__pct { font-size: 3rem; }
  .rd-cifra dd { font-size: 1.25rem; }
  .rd-tab th, .rd-tab td { padding: .4rem .3rem; }
  .rd-pp__riga { grid-template-columns: 6.6em minmax(40px, 1fr) 8.4em; gap: .4rem; }
  .rd-mappa__nome { font-size: 19px; }
  .rd-mappa__info { font-size: 16px; }
}

/* ---------- Ridracoli e San Marino ---------- */
.rd-sm__barra { display: flex; height: 26px; border-radius: 8px; overflow: hidden; border: 1px solid var(--border); margin: .4rem 0 0; }
.rd-sm__barra span { display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; color: #fff; white-space: nowrap; }
.rd-sm__q-ridracoli { background: var(--rd-acqua); }
.rd-sm__q-marecchia { background: var(--rd-pioggia); }
.rd-sm__q-hera { background: var(--rd-grigio); }
.rd-sm__legenda { list-style: none; padding: 0; margin: .5rem 0 0; display: flex; flex-wrap: wrap; gap: .3rem 1.1rem;
                  font-size: var(--font-size-sm, .875rem); color: var(--text-secondary); }
.rd-sm__legenda i { display: inline-block; width: .8em; height: .8em; border-radius: 2px; margin-right: .35em; vertical-align: -.05em; }
.rd-ordinanza h3 span { text-transform: none; }
.rd-ordinanza__divieti { margin: .4rem 0; padding-left: 1.2rem; line-height: 1.5; }
.rd-ordinanza p + p { margin-top: .4rem; }
.rd-fare p + p { margin-top: .6rem; }
