/* Identidad visual TAI (Manual de marca 2026): Montserrat, vinotinto y dorado. */
@font-face { font-family: "Montserrat"; src: url("../fonts/Montserrat-Regular.ttf") format("truetype"); font-weight: 400; }
@font-face { font-family: "Montserrat"; src: url("../fonts/Montserrat-Bold.ttf") format("truetype"); font-weight: 700; }

:root, html[data-theme="light"], html[data-theme="dark"] {
  --tai-vino: #6E2650;
  --tai-vino-oscuro: #501B3B;
  --tai-oro: #AF8834;
  --tai-oro-claro: #F1BE21;
  --tai-crema: #FAF28B;
  --tai-gris: #D0D0D0;
  --tai-gris-medio: #B2B2B2;
  --tai-negro: #1D1D1B;

  --font-family-primary: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
  --primary: var(--tai-vino);
  --secondary: var(--tai-vino-oscuro);
  --accent: var(--tai-oro-claro);
  --header-bg: var(--tai-vino-oscuro);
  --header-color: #fff;
  --header-branding-color: #fff;
  --header-link-color: #fff;
  --breadcrumbs-bg: var(--tai-vino);
  --link-selected-fg: var(--tai-oro);
  --button-bg: var(--tai-vino);
  --button-hover-bg: var(--tai-vino-oscuro);
  --default-button-bg: var(--tai-oro);
  --default-button-hover-bg: #8f6f2a;
  --object-tools-bg: var(--tai-vino);
  --object-tools-hover-bg: var(--tai-vino-oscuro);
}
html[data-theme="light"], :root:not([data-theme="dark"]) { --link-fg: var(--tai-vino); --link-hover-color: var(--tai-oro); }

#header { border-bottom: 4px solid var(--tai-oro-claro); }
#branding h1 { display: flex; align-items: center; gap: 12px; font-weight: 700; }
#branding img { height: 38px; background: #fff; border-radius: 6px; padding: 3px 6px; }
.module caption, .module h2, .inline-group h2 { background: var(--tai-vino); }

.insignia { display: inline-block; padding: 1px 8px; border-radius: 10px; font-size: 11px; font-weight: 700; color: #fff; }
.estado-vigente { background: #2e7d32; }
.estado-por-vencer { background: var(--tai-oro); }
.estado-vencido { background: #c62828; }
.estado-sin-fecha { background: var(--tai-gris-medio); }
a.boton-pdf { background: var(--tai-vino); color: #fff !important; padding: 2px 10px; border-radius: 4px; font-weight: 700; }

/* Tablero */
.tablero { margin-bottom: 24px; }
.tablero-indicadores { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; margin-bottom: 18px; }
.tarjeta { border: 1px solid var(--hairline-color); border-top: 4px solid var(--tai-vino); border-radius: 8px; padding: 12px 14px; background: var(--body-bg); }
.tarjeta .cifra { font-size: 30px; font-weight: 700; color: var(--tai-vino); line-height: 1.1; }
html[data-theme="dark"] .tarjeta .cifra { color: var(--tai-oro-claro); }
.tarjeta a { display: block; color: inherit; }
.accion-principal { display: inline-block; background: var(--tai-oro-claro); color: var(--tai-negro) !important; font-weight: 700; padding: 10px 18px; border-radius: 6px; margin: 0 8px 14px 0; }
.accion-secundaria { display: inline-block; background: var(--tai-vino); color: #fff !important; font-weight: 700; padding: 10px 18px; border-radius: 6px; margin: 0 8px 14px 0; }
.tabla-alertas { width: 100%; }
.tabla-alertas td.dias { white-space: nowrap; font-weight: 700; }
.vacio { color: var(--body-quiet-color); padding: 8px 0; }

/* Envío del FUEC al conductor */
.envio-pasos { background: var(--darkened-bg); border-left: 4px solid var(--tai-oro-claro); padding: 12px 14px; margin: 12px 0 18px; border-radius: 6px; }
.envio-pasos .accion-principal { margin: 10px 0 0; }
.envio-tabla { width: 100%; }
.envio-botones form { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; }
.boton-envio { display: inline-block; border: 0; border-radius: 5px; padding: 7px 12px; font: 700 13px var(--font-family-primary); color: #fff !important; cursor: pointer; }
.boton-wa { background: #1f8a4c; }
.boton-correo { background: var(--tai-vino); }
.boton-ambos { background: var(--tai-oro); }