/* bom.css — hoja de estilos única de la aplicación.
 *
 * Antes cada página traía su propio bloque <style> con un puñado de reglas
 * distinto: la cabecera estaba duplicada cinco veces y por eso el menú
 * divergía (cada página elegía su lista de enlaces y su versión de .actions).
 * Aquí vive lo común; cada página deja en su <style> solo su excepción de
 * maquetación (el ancho de su tarjeta, el centrado del login).
 *
 * Ojo con dos nombres:
 *   - .err / .ok  son mensajes de TEXTO y los pone el JS de tesoreria.php.
 *   - .okpanel    es el panel de éxito de aviso.php (antes se llamaba .ok y
 *                 chocaba: la regla display:none de uno escondía al otro).
 * La sección activa del menú la marca el parcial con .is-active + aria-current.
 */

:root{--brand:#2f8f83;--line:#dbe2ea;--ink:#1f2a37;--muted:#5f6f80;--red:#c0392b}
*{box-sizing:border-box}
body{margin:0;background:#eef1f5;font-family:-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--ink);padding:20px}
.wrap{max-width:900px;margin:0 auto}

/* --- Cabecera y menú ----------------------------------------------------- */
.top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.top h1{margin:0;font-size:20px}
.top .who{font-size:12.5px;color:var(--muted)}
.actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}

/* --- Botones ------------------------------------------------------------- */
.btn{background:var(--brand);color:#fff;border:none;border-radius:9px;padding:9px 14px;font-size:13px;font-weight:700;cursor:pointer;text-decoration:none;display:inline-block}
.btn.ghost{background:#eef2f6;color:#33414f;border:1px solid var(--line)}
.btn.danger{background:#fbe3e0;color:#a03026;border:1px solid #eec9c4}
.btn:disabled{background:#b9c8c5;cursor:not-allowed}
/* Sección activa: 5.5:1 de contraste. El blanco sobre --brand da 3.9:1 y
   reprueba AA, así que el activo va en claro con borde de marca. */
.btn.is-active{background:#eef7f4;color:#1f6f64;border:1px solid var(--brand);cursor:default}

/* --- Tarjetas, cabecera de tarjeta y tablas ------------------------------ */
.card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px;margin-bottom:20px;box-shadow:0 1px 3px rgba(20,40,60,.05)}
.card.box{max-width:440px;margin:0 auto;padding:0;overflow:hidden;border-radius:16px;box-shadow:0 2px 8px rgba(20,40,60,.08)}
.head{background:linear-gradient(135deg,#2f8f83,#256e64);color:#fff;padding:18px 20px}
.head b{font-size:12px;letter-spacing:.04em;opacity:.9}
.head h1{margin:2px 0;font-size:19px}
.head p{margin:0;font-size:12px;opacity:.9}
table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:0 1px 3px rgba(20,40,60,.05)}
th,td{text-align:left;padding:9px 12px;border-bottom:1px solid var(--line);font-size:13px;vertical-align:top}
th{background:#f4f7fa;font-size:11px;text-transform:uppercase;color:#3a5266}
td.k{font-weight:700;width:190px}
.empty{background:#fff;border:1px dashed var(--line);border-radius:12px;padding:24px;text-align:center;color:var(--muted);font-size:13.5px}
.arch{display:inline-block;max-width:190px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom}

/* --- Estatus ------------------------------------------------------------- */
.est{display:inline-block;padding:2px 9px;border-radius:20px;font-size:11px;font-weight:700}
.est.en{background:#dcf1e6;color:#1c7a4d}
.est.pr{background:#fbf5e6;color:#8a6212}
.est.in{background:#fbe3e0;color:#a03026}
.est.re{background:#dcebf6;color:#1f6690}
.est.pe{background:#eef2f6;color:#5f6f80}
.est.co{background:#dcebf6;color:#1f6690}
.est.pl{background:#eef2f6;color:#5f6f80}

/* --- Formularios --------------------------------------------------------- */
label{display:block;font-weight:700;font-size:12.5px;margin:10px 0 4px}
input,select{width:100%;padding:9px 11px;border:1px solid #cdd7e1;border-radius:9px;font-size:13.5px}
.hint{font-weight:400;color:var(--muted);font-size:11px;margin-top:2px}
.locked{background:#eef7f4;border:1px solid #a8ddc0;color:#1a6b5c;font-weight:700;border-radius:9px;padding:10px 11px;margin-top:8px}
.read{border:1px solid #a8ddc0;border-radius:12px;padding:10px 12px;margin-top:10px;background:#f2fbf8;display:none}
.read h4{margin:0 0 8px;font-size:12px;color:#1a6b5c}
.kv{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.kv .f{display:flex;flex-direction:column}
.kv label{margin:0 0 2px}
.log{margin-top:8px;font-size:11px;color:var(--muted);min-height:14px}
.results{border:1px solid var(--line);border-radius:9px;margin-top:6px;max-height:200px;overflow:auto;display:none;background:#fff}
.results .it{padding:8px 10px;border-bottom:1px solid #eef1f5;cursor:pointer;font-size:13px}
.results .it:hover{background:#eef7f4}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}

/* --- Multi-plaza (tesoreros) ------------------------------------------------ */
.plazas{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:8px;border:0;padding:0;margin:10px 0 4px}
.plazas legend{font-weight:700;font-size:12.5px;padding:0}
.plazas .ck{display:flex;align-items:center;gap:7px;font-weight:400;margin:0;font-size:13px;cursor:pointer}
.plazas .ck input{width:auto;margin:0}

/* --- Zona de arrastre del archivo ---------------------------------------- */
.drop{border:2px dashed #9cccc3;border-radius:12px;padding:18px;text-align:center;background:#f4faf9;color:#1f6f64;font-weight:700;cursor:pointer;margin-top:8px;transition:all .15s ease}
.drop.over{border-color:#2f8f83;background:#e3f4f0;box-shadow:0 0 0 3px rgba(47,143,131,.18);transform:scale(1.01)}
.drop .dzsub{display:block;font-weight:400;font-size:11.5px;color:var(--muted);margin-top:4px}
.drop:focus-visible{outline:3px solid rgba(47,143,131,.45);outline-offset:2px}
.drop.has-file{border-style:solid;background:#eaf7f3}
.file-in{display:none}

/* --- Mensajes ------------------------------------------------------------ */
.err{color:var(--red);font-weight:600}
.ok{color:#1f6f64;font-weight:600}
.okpanel{display:none;text-align:center;padding:24px}
.okpanel .t{font-size:44px;color:#1c7a4d}
.okpanel p{font-size:13px;color:var(--muted)}
.warn{background:#fbf5e6;border:1px dashed #d8c281;border-radius:12px;padding:14px 16px;font-size:12.5px;color:#6f5a12;margin-bottom:16px}
.aviso{background:#fbf5e6;border:1px dashed #d8c281;border-radius:12px;padding:12px 14px;font-size:12.5px;color:#6f5a12;margin:0 0 10px}
.peligro{background:#fdf0ee;border:1px dashed #eec9c4;border-radius:12px;padding:12px 14px;font-size:12.5px;color:#8d2a21;margin:0 0 10px}
.msg{margin-top:8px;font-size:12.5px;min-height:18px}

/* --- Reportar falla (FEAT mejora continua): botón flotante + diálogo ------- */
.fab{position:fixed;right:16px;bottom:16px;z-index:50;width:48px;height:48px;border-radius:50%;border:0;background:#2f8f83;color:#fff;font-size:22px;cursor:pointer;box-shadow:0 2px 10px rgba(0,0,0,.25)}
.fab:focus-visible{outline:3px solid rgba(47,143,131,.45);outline-offset:2px}
#dlgFalla{border:0;border-radius:14px;padding:20px;max-width:min(480px,92vw);width:100%}
#dlgFalla::backdrop{background:rgba(0,0,0,.45)}
#dlgFalla h2{margin:0 0 8px;font-size:17px}
#dlgFalla textarea{width:100%;box-sizing:border-box;margin:4px 0 8px;min-height:88px}
#dlgFalla .locked{margin-bottom:10px}