/* DonaFiel · hoja compartida de las webs (portada, afiliación, anulación, métricas).
   Marca: verde #1B7A43, verde profundo #0E3D22, dorado #C79A46, crema #F5F1E6
   (lib/theme/app_theme.dart de la app). El dorado es ornamental: nunca lleva texto
   sobre fondo claro, porque no alcanza el contraste mínimo. */
:root{
  --fondo:#F5F1E6; --superficie:#FFFFFF; --hundido:#EEE9DC; --linea:#DDD6C4; --linea-2:#BFB6A0;
  --texto:#14231A; --texto-2:#3A4840; --texto-3:#56645B;
  --verde:#1B7A43; --verde-profundo:#0E3D22; --oro:#C79A46; --oro-tinta:#7A5718;
  --boton:#1B7A43; --boton-texto:#FFFFFF; --boton-hover:#156637;
  --foco:#C79A46;
  --error:#A8231B; --error-suave:#FBEAE7; --aviso:#7E4B00; --aviso-suave:#FBF0DA; --info-suave:#E7F1EA;
  --barra:#0E3D22; --sobre-barra:#FFFFFF; --sobre-barra-2:#C9DCCF;
  --fuente:'Noto Sans',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --fondo:#0B1510; --superficie:#101C15; --hundido:#15241B; --linea:#253A2E; --linea-2:#3A5444;
    --texto:#E9F0EB; --texto-2:#C3D1C7; --texto-3:#9AAEA1;
    --verde:#6CC892; --oro-tinta:#DDB872;
    --boton:#6CC892; --boton-texto:#08190F; --boton-hover:#86D6A6;
    --error:#F4958C; --error-suave:#2D1412; --aviso:#F0B85A; --aviso-suave:#2A1F0B; --info-suave:#12261A;
    --barra:#08190F;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --fondo:#0B1510; --superficie:#101C15; --hundido:#15241B; --linea:#253A2E; --linea-2:#3A5444;
  --texto:#E9F0EB; --texto-2:#C3D1C7; --texto-3:#9AAEA1;
  --verde:#6CC892; --oro-tinta:#DDB872;
  --boton:#6CC892; --boton-texto:#08190F; --boton-hover:#86D6A6;
  --error:#F4958C; --error-suave:#2D1412; --aviso:#F0B85A; --aviso-suave:#2A1F0B; --info-suave:#12261A;
  --barra:#08190F;
  color-scheme:dark;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;min-height:100vh;display:flex;flex-direction:column;background:var(--fondo);color:var(--texto);font:400 16px/1.6 var(--fuente)}
main{flex:1}
img,svg{max-width:100%}
p{margin:0}
h1,h2,h3{margin:0;text-wrap:balance;line-height:1.15}
a{color:var(--verde);text-underline-offset:3px}
:focus-visible{outline:3px solid var(--foco);outline-offset:2px}
[hidden]{display:none!important}
.num{font-variant-numeric:tabular-nums lining-nums}
.mono{font-family:var(--mono);font-size:.92em;letter-spacing:.01em}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.contenedor{width:100%;max-width:1080px;margin-inline:auto;padding-inline:20px}
@media (max-width:420px){.contenedor{padding-inline:16px}}

/* ── barra superior ─────────────────────────────────── */
.barra{background:var(--barra);color:var(--sobre-barra);border-bottom:2px solid var(--oro)}
.barra__in{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px}
.lockup{display:inline-flex;align-items:center;gap:10px;color:inherit;text-decoration:none}
.lockup svg{width:34px;height:34px;flex:none}
.lockup b{font-size:21px;font-weight:800;letter-spacing:-.01em;color:#fff}
.lockup b span{color:var(--oro)}
.barra__titulo{font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--sobre-barra-2);text-align:right}
.aviso-demo{padding-block:9px;background:var(--aviso-suave);color:var(--aviso);border-bottom:1px solid var(--linea);font-size:13.5px}

/* ── pie ────────────────────────────────────────────── */
.pie{margin-top:56px;background:var(--barra);color:var(--sobre-barra-2);font-size:13px}
.pie__in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;padding-block:20px}
.powered{display:inline-flex;align-items:center;gap:10px}
.powered img{height:34px;width:auto}

/* ── tipografía de página ───────────────────────────── */
.cejilla{font-size:12.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--verde)}
.titulo{margin-top:8px;font-size:clamp(28px,6vw,40px);font-weight:800;letter-spacing:-.02em}
.entrada{margin-top:10px;max-width:62ch;font-size:17px;color:var(--texto-2)}
.rotulo{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--texto-3)}

/* ── controles ──────────────────────────────────────── */
.boton{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 22px;border:1px solid transparent;border-radius:4px;background:var(--boton);color:var(--boton-texto);font:600 16px/1.2 var(--fuente);text-decoration:none;cursor:pointer}
.boton:hover{background:var(--boton-hover)}
.boton:disabled{opacity:.55;cursor:not-allowed}
.boton--secundario{background:transparent;color:var(--texto);border-color:var(--linea-2)}
.boton--secundario:hover{background:var(--hundido)}
.enlace-boton{background:none;border:0;padding:12px 4px;min-height:44px;color:var(--verde);font:600 15px var(--fuente);cursor:pointer;text-decoration:underline;text-underline-offset:3px}

.campo{display:flex;flex-direction:column;gap:6px;min-width:0}
.campo>label,.campo>.etiqueta{font-size:14.5px;font-weight:600;color:var(--texto)}
.campo .ayuda{font-size:13.5px;color:var(--texto-3)}
.campo .error{font-size:13.5px;font-weight:600;color:var(--error)}
.entrada-texto,select.entrada-texto{width:100%;min-height:48px;padding:11px 14px;border:1px solid var(--linea-2);border-radius:4px;background:var(--superficie);color:var(--texto);font:400 16px/1.3 var(--fuente)}
.entrada-texto:focus{outline:none;border-color:var(--verde);box-shadow:0 0 0 3px color-mix(in srgb,var(--verde) 25%,transparent)}
.entrada-texto[aria-invalid="true"]{border-color:var(--error)}
.entrada-texto.mono{font-family:var(--mono);letter-spacing:.06em}
.compuesto{display:grid;grid-template-columns:92px minmax(0,1fr);gap:8px}
.rejilla-campos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 20px}
.rejilla-campos .ancho{grid-column:1/-1}
@media (max-width:560px){.rejilla-campos{grid-template-columns:minmax(0,1fr)}}

/* Selector segmentado: opciones contiguas en una sola pieza, no botones sueltos. */
.segmentos{display:grid;grid-template-columns:repeat(var(--n,5),minmax(0,1fr));border:1px solid var(--linea-2);border-radius:4px;overflow:hidden;background:var(--superficie)}
.segmentos label{position:relative;display:flex;align-items:center;justify-content:center;min-height:48px;padding:6px 4px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--texto-2);cursor:pointer;text-align:center}
.segmentos label+label{border-left:1px solid var(--linea)}
.segmentos input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.segmentos label:has(input:checked){background:var(--verde-profundo);color:#fff}
:root[data-theme="dark"] .segmentos label:has(input:checked){background:var(--boton);color:var(--boton-texto)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .segmentos label:has(input:checked){background:var(--boton);color:var(--boton-texto)}}
.segmentos label:has(input:focus-visible){outline:3px solid var(--foco);outline-offset:-3px}
@media (max-width:380px){.segmentos{grid-template-columns:repeat(3,minmax(0,1fr))}.segmentos label:nth-child(4){border-left:0}.segmentos label:nth-child(n+4){border-top:1px solid var(--linea)}}

.casilla{display:grid;grid-template-columns:24px minmax(0,1fr);gap:12px;align-items:start;min-height:44px;padding:10px 0;font-size:15px;color:var(--texto-2);cursor:pointer}
.casilla input{width:22px;height:22px;margin:1px 0 0;accent-color:var(--verde)}

/* ── notas por tipo ─────────────────────────────────── */
.nota{display:grid;grid-template-columns:26px minmax(0,1fr);gap:12px;padding:14px 16px;background:var(--info-suave);border:1px solid color-mix(in srgb,var(--verde) 35%,transparent);font-size:14.5px;color:var(--texto-2)}
.nota b{color:var(--texto)}
.nota__i{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--verde);color:var(--superficie);font:800 14px/1 var(--fuente)}
.nota--aviso{background:var(--aviso-suave);border-color:color-mix(in srgb,var(--aviso) 35%,transparent)}
.nota--aviso .nota__i{background:var(--aviso)}
.nota--error{background:var(--error-suave);border-color:color-mix(in srgb,var(--error) 35%,transparent)}
.nota--error .nota__i{background:var(--error)}

/* ── tablas ─────────────────────────────────────────── */
.tabla-scroll{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:14.5px}
th,td{padding:10px 12px 10px 0;text-align:left;border-bottom:1px solid var(--linea);vertical-align:baseline}
th:last-child,td:last-child{padding-right:0}
thead th{font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--texto-3);border-bottom:2px solid var(--texto)}
td.r,th.r{text-align:right}
td{color:var(--texto-2)}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
