/* Marca de las interfaces de la plataforma (tokens tomados del diseño de la propuesta). Sin recursos externos. */
@font-face { font-family: 'Outfit'; src: url(marca/Outfit-Regular.ttf) format('truetype'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Outfit'; src: url(marca/Outfit-SemiBold.ttf) format('truetype'); font-weight: 600; font-display: swap; }
@font-face { font-family: 'Outfit'; src: url(marca/Outfit-Bold.ttf) format('truetype'); font-weight: 700; font-display: swap; }
@font-face { font-family: 'Poppins'; src: url(marca/Poppins-SemiBold.ttf) format('truetype'); font-weight: 600; font-display: swap; }
:root {
  --cf-primary: #003DA5; --cf-primary-dark: #0033A1; --cf-deep: #173a6b; --cf-cyan: #34BBDA; --cf-lime: #97D700; --cf-page: #F2F5FA; --cf-bg: #FFFFFF;
  --cf-text: #302F30; --cf-text-2: #4B4B4B; --cf-muted: #6b6b6b; --cf-border: #E1E1E1; --cf-border-strong: #D1D5DB; --cf-tint: #EAF3FB;
  --ok-bg: #E6F6EC; --ok-ink: #17693B; --warn-bg: #FEF3C7; --warn-ink: #7A5D00; --lime-bg: #EEF8D6; --lime-ink: #2F4A00; --err-bg: #FDE7EA; --err-ink: #A32222; --info-bg: #DCEDFF;
  --font: 'Outfit', system-ui, -apple-system, 'Segoe UI', sans-serif; --font-titulo: 'Poppins', 'Outfit', system-ui, sans-serif; --mono: ui-monospace, Menlo, Consolas, monospace;
  --radio: 12px; --sombra: 0 1px 2px rgba(16, 24, 40, .06), 0 1px 3px rgba(16, 24, 40, .08);
}
/* Tema del formulario de ODK Web Forms incrustado: se viste con la marca por sus variables, sin tocar su código. ODK las declara en :root y las
   inyecta después de esta hoja, por eso aquí van con más especificidad (html:root). */
html:root {
  --odk-font-family: var(--font); --odk-primary-text-color: var(--cf-primary); --odk-primary-border-color: var(--cf-primary); --odk-primary-light-background-color: var(--cf-tint);
  --odk-primary-lighter-background-color: #F4F8FD; --odk-text-color: var(--cf-text); --odk-muted-text-color: var(--cf-muted); --odk-border-color: var(--cf-border); --odk-radius: 10px;
  --odk-base-background-color: var(--cf-page); --odk-max-form-width: 760px; --p-primary-color: var(--cf-primary); --p-primary-500: var(--cf-primary); --p-primary-600: var(--cf-primary-dark);
}
* { box-sizing: border-box; }
html, body { margin: 0; }
body { background: var(--cf-page); color: var(--cf-text); font: 16px/1.5 var(--font); -webkit-font-smoothing: antialiased; }
/* ODK Web Forms inyecta su tipografía en body y botones: la interfaz de la plataforma conserva la suya. */
html body, html body .boton, html body .tabla, html body label.campo { font-family: var(--font); }
h1, h2, h3 { font-family: var(--font-titulo); font-weight: 600; margin: 0; text-wrap: balance; letter-spacing: -.01em; }
a { color: var(--cf-primary); }
button, input, select, textarea { font: inherit; color: inherit; }
.boton { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; padding: 0 18px; border-radius: 10px; border: 1.5px solid var(--cf-primary); background: var(--cf-primary); color: #fff; font-weight: 600; cursor: pointer; text-decoration: none; }
.boton:hover { background: var(--cf-primary-dark); }
.boton[disabled] { background: #F2F2F2; border-color: #F2F2F2; color: #A0A0A0; cursor: not-allowed; }
.boton.secundario { background: #fff; color: var(--cf-primary); }
.boton.secundario:hover { background: var(--cf-tint); }
.boton.texto { background: none; border-color: transparent; color: var(--cf-primary); }
.boton.peligro { background: #fff; color: var(--err-ink); border-color: #e7b3b3; }
.boton:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, .pestana:focus-visible { outline: 3px solid rgba(52, 187, 218, .55); outline-offset: 2px; }
label.campo { display: grid; gap: 6px; font-weight: 600; font-size: 15px; }
label.campo input, label.campo select, label.campo textarea { font-weight: 400; min-height: 48px; padding: 10px 14px; border: 1.5px solid var(--cf-border); border-radius: 10px; background: #fff; width: 100%; }
label.campo textarea { min-height: 120px; font-family: var(--mono); font-size: 13px; }
.tarjeta { background: var(--cf-bg); border: 1px solid var(--cf-border); border-radius: var(--radio); padding: 18px; box-shadow: var(--sombra); min-width: 0; }
.chip { display: inline-flex; align-items: center; gap: 6px; padding: 3px 12px; border-radius: 99px; font-size: 13.5px; font-weight: 600; white-space: nowrap; }
.chip.ok { background: var(--ok-bg); color: var(--ok-ink); } .chip.aviso { background: var(--warn-bg); color: var(--warn-ink); } .chip.lima { background: var(--lime-bg); color: var(--lime-ink); }
.chip.info { background: var(--cf-tint); color: var(--cf-primary); } .chip.gris { background: #F2F2F2; color: var(--cf-text-2); } .chip.error { background: var(--err-bg); color: var(--err-ink); }
.nota { color: var(--cf-muted); font-size: 14px; }
.aviso { background: var(--warn-bg); color: var(--warn-ink); border: 1px solid #f0dc96; border-radius: 10px; padding: 12px 14px; font-size: 14.5px; }
.exito { background: var(--ok-bg); color: var(--ok-ink); border-radius: 10px; padding: 12px 14px; font-size: 14.5px; }
.error { background: var(--err-bg); color: var(--err-ink); border-radius: 10px; padding: 12px 14px; font-size: 14.5px; }
.barra { height: 10px; background: #EEF1F5; border-radius: 6px; overflow: hidden; } .barra > i { display: block; height: 100%; background: var(--cf-primary); border-radius: 6px; }
.barra.lima > i { background: #a3d04a; }
table.tabla { width: 100%; border-collapse: collapse; font-size: 15px; }
table.tabla th, table.tabla td { text-align: left; padding: 12px 10px; border-bottom: 1px solid var(--cf-border); vertical-align: middle; }
table.tabla th { font-size: 12.5px; text-transform: uppercase; letter-spacing: .06em; color: var(--cf-muted); font-weight: 600; }
.num { font-variant-numeric: tabular-nums; white-space: nowrap; }
.desplazable { overflow-x: auto; }
.oculto-visual { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.logo { height: 44px; width: auto; border-radius: 8px; display: block; }
.marca-prueba { font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--cf-muted); }
/* Ajustes puntuales del formulario incrustado: títulos sin partir palabras y la misma tipografía que el resto de la interfaz. */
[data-motor] .form-title h1, [data-motor] .smaller-screens h1 { word-break: normal !important; overflow-wrap: anywhere; font-family: var(--font-titulo); font-weight: 600 !important; }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }
