/* Campestre · tokens de identidad (docs/identidad/campestre-identidad.md). Modo del sistema por defecto; data-tema fija claro u oscuro. */
:root{
  --fondo:#FFFFFF; --fondo2:#F7F8F5; --linea:#E6EBE5; --texto:#1C2B23; --texto2:#5D6D63; --lectura:#1E4937;
  --marca:#285B49; --sobre-marca:#FFFFFF; --salvia:#AFC9B1; --sol:#E8B94F; --sobre-sol:#1C2B23;
  --exito:#247A50; --aviso:#915B00; --error:#B42318; --info:#1C5C8C;
  --titulos:'Instrument Sans',system-ui,sans-serif; --cuerpo:'IBM Plex Sans',system-ui,sans-serif; --mono:'IBM Plex Mono',ui-monospace,Menlo,monospace;
  --radio:8px;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){ :root:not([data-tema="claro"]){
  --fondo:#101A16; --fondo2:#18251F; --linea:#3A5145; --texto:#F3F5F1; --texto2:#BBC7BF; --lectura:#B9D5C2;
  --marca:#B9D5C2; --sobre-marca:#101A16; --sol:#F1C95A; --sobre-sol:#1C2B23;
  --exito:#74D3A0; --aviso:#F0C36C; --error:#FF8A80; --info:#8BC8F3; color-scheme:dark } }
:root[data-tema="oscuro"]{
  --fondo:#101A16; --fondo2:#18251F; --linea:#3A5145; --texto:#F3F5F1; --texto2:#BBC7BF; --lectura:#B9D5C2;
  --marca:#B9D5C2; --sobre-marca:#101A16; --sol:#F1C95A; --sobre-sol:#1C2B23;
  --exito:#74D3A0; --aviso:#F0C36C; --error:#FF8A80; --info:#8BC8F3; color-scheme:dark }
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--fondo);color:var(--texto);font:14px/1.5 var(--cuerpo)}
h1,h2,h3{font-family:var(--titulos);font-weight:600;letter-spacing:-0.01em;text-wrap:balance;margin:0 0 8px;color:var(--lectura)}
h1{font-size:24px} h2{font-size:18px} h3{font-size:15px}
a{color:var(--lectura)}
.mono,.cifra{font-family:var(--mono);font-variant-numeric:tabular-nums}
.cifra{text-align:right}
.centrado{min-height:100%;display:grid;place-items:center;align-content:center;gap:20px;padding-block:32px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.marca{display:flex;align-items:center;gap:12px}
.logotipo{font-family:var(--titulos);font-weight:600;font-size:28px;letter-spacing:-0.02em;color:var(--lectura)}
.tarjeta{border:1px solid var(--linea);border-radius:var(--radio);background:var(--fondo);padding:20px;width:min(100%,380px)}
.formulario{display:grid;gap:6px}
.formulario label{font-size:13px;color:var(--texto2);margin-top:6px}
input,select{accent-color:var(--marca);font:inherit;color:var(--texto);background:var(--fondo);border:1px solid var(--linea);border-radius:var(--radio);padding:8px 10px;width:100%}
input:focus-visible,select:focus-visible,button:focus-visible{outline:2px solid var(--sol);outline-offset:1px}
.boton{font:600 14px var(--cuerpo);border-radius:var(--radio);padding:9px 16px;border:1px solid var(--linea);background:var(--fondo);color:var(--lectura);cursor:pointer;margin-top:10px}
.boton.primario{background:var(--marca);color:var(--sobre-marca);border-color:var(--marca)}
.boton.pagar{background:var(--sol);color:var(--sobre-sol);border-color:var(--sol)}
.boton-tema{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid var(--linea);border-radius:var(--radio);background:var(--fondo);color:var(--texto2);cursor:pointer;padding:0}
.boton-tema .icono-luna{display:none}
@media (prefers-color-scheme:dark){ :root:not([data-tema="claro"]) .boton-tema .icono-sol{display:none} :root:not([data-tema="claro"]) .boton-tema .icono-luna{display:inline} }
:root[data-tema="oscuro"] .boton-tema .icono-sol{display:none}
:root[data-tema="oscuro"] .boton-tema .icono-luna{display:inline}
@media (prefers-reduced-motion:no-preference){ .boton,.boton-tema,input{transition:border-color .12s,background-color .12s} }
/* Pantallas internas */
.barra{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;border-bottom:1px solid var(--linea);padding-block:10px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));background:var(--fondo2)}
.barra-izq,.barra-der{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.barra .logotipo{font-size:20px;text-decoration:none}
.club{color:var(--texto2);font-size:13px}
.menu{display:flex;gap:4px}
.menu a{text-decoration:none;color:var(--texto2);padding:6px 10px;border-radius:var(--radio);font-weight:500}
.menu a[aria-current="page"]{color:var(--lectura);background:var(--fondo);border:1px solid var(--linea)}
.usuario{font-size:13px;color:var(--texto2)}
.barra form{margin:0}.barra .boton{margin:0;padding:6px 12px}
.contenido{max-width:1100px;margin-inline:auto;padding-block:20px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.titulo-seccion{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.meta{color:var(--texto2);font-size:13px}
.cifras{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin:0 0 20px;padding:0}
.cifras div{border:1px solid var(--linea);border-radius:var(--radio);padding:10px 12px;background:var(--fondo)}
.cifras dt{font-size:12px;color:var(--texto2);text-transform:uppercase;letter-spacing:.04em}
.cifras dd{margin:4px 0 0;font-size:22px;font-weight:500;text-align:left}
.cifras dd.enfasis{color:var(--error)}
.dos-columnas{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.dos-columnas .col-ancha{grid-column:1 / span 1}
@media (min-width:900px){ .dos-columnas{grid-template-columns:3fr 2fr} }
@media (max-width:700px){ .dos-columnas{grid-template-columns:1fr} }
.dos-columnas section{min-width:0}
.tabla{overflow-x:auto;border:1px solid var(--linea);border-radius:var(--radio);margin-block:8px 16px;background:var(--fondo)}
table{border-collapse:collapse;width:100%;font-size:13.5px}
th,td{text-align:left;padding:7px 10px;border-bottom:1px solid var(--linea);vertical-align:top}
th{font-weight:600;color:var(--texto2);font-size:12px;letter-spacing:.04em;text-transform:uppercase;background:var(--fondo2)}
tbody tr:last-child td{border-bottom:none}
tfoot th{background:var(--fondo);color:var(--texto);text-transform:none;font-size:14px;letter-spacing:0;border-top:1px solid var(--linea)}
td.num,th.num{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.chip{display:inline-block;border-radius:var(--radio);padding:0 8px;font-size:12px;font-weight:500;border:1px solid currentColor;line-height:1.6}
.chip.ok{color:var(--exito)} .chip.aviso{color:var(--aviso)} .chip.error{color:var(--error)}
.vacio{border:1px dashed var(--linea);border-radius:var(--radio);padding:14px;color:var(--texto2)}
.error{color:var(--error);margin:0 0 6px}
.aviso-ok{color:var(--exito);border:1px solid var(--linea);border-left:3px solid var(--exito);border-radius:var(--radio);padding:8px 12px;margin:0 0 14px}
.buscador{display:flex;gap:8px;margin-bottom:14px}
.buscador input{max-width:520px}
.buscador .boton{margin:0}
.visual-oculto{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
details summary{cursor:pointer;color:var(--texto2);font-size:12px}
.lineas{list-style:none;margin:6px 0 0;padding:0;font-size:12.5px}
.lineas li{display:flex;justify-content:space-between;gap:12px;padding:2px 0;border-top:1px solid var(--linea)}
.lineas .cifra{white-space:nowrap}

/* Acciones sobre la ficha (enviar estado de cuenta) */
.acciones-ficha { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; margin-top: 1rem; }

/* Página del socio (enlace de pago), pensada para el celular */
.socio{max-width:520px;margin-inline:auto;padding-block:20px 32px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));display:grid;gap:16px}
.marca-socio{justify-content:space-between}
.club-nombre{font-family:var(--titulos);font-weight:600;font-size:18px;color:var(--lectura)}
.tarjeta-socio{width:100%}
.etiqueta{text-transform:uppercase;letter-spacing:.06em;font-size:12px;margin:0 0 4px}
.pago .tabla{margin-block:14px 10px}
.pago td.marcar{width:34px;padding-right:0}
.pago td.marcar input{width:18px;height:18px;margin:2px 0 0}
.opciones{border:1px solid var(--linea);border-radius:var(--radio);padding:10px 12px 12px;margin:0;display:grid;gap:8px}
.opciones legend{font-weight:600;color:var(--lectura);padding-inline:4px}
.opcion{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--texto);margin:0}
.opcion input{width:18px;height:18px;margin:2px 0 0;flex:none}
.opcion strong{font-weight:500}
.monto{display:flex;align-items:center;gap:6px;margin-left:28px}
.monto .prefijo{font-family:var(--mono);color:var(--texto2)}
.pago .boton.pagar{font-size:16px;padding:12px 18px;width:100%}
.pie-socio{text-align:center}

.en-linea{display:inline;margin:0}
.enlace{background:none;border:none;padding:0;font:inherit;color:var(--lectura);text-decoration:underline;cursor:pointer}

.filtros select{width:auto;min-width:180px}
.cifras div .meta{display:block;margin-top:2px}
.tabla form{margin:0}.tabla .boton{margin:0;padding:4px 10px;font-size:13px}
.contenido section > h2:not(:first-child){margin-top:20px}