/*
 * /preparapolicia/ — se carga DESPUÉS de /test/test.css y solo redefine lo que cambia:
 * paleta (azul navy de fondo; amarillo y rojo como acciones destacadas; texto blanco /
 * negro) y los componentes que /test/ no tiene. Diseño plano (CLAUDE.md): sin sombras.
 *
 *   amarillo → respuestas (botones de opción), resalte
 *   rojo     → acción principal (Continuar, Descargar) y opción elegida
 */
.tb.pp {
  --tb-bg: #0A1F4A;            /* azul navy */
  --tb-text: #FFFFFF;
  --tb-text-2: rgba(255,255,255,.85);
  --tb-text-3: rgba(255,255,255,.62);
  --tb-field: #FFFFFF;
  --tb-field-text: #0A0A0A;
  --tb-accent: #C8102E;        /* rojo: texto blanco 5,9:1 */
  --tb-accent-dark: #9E0C24;
  --tb-opt: #FFC72C;           /* amarillo */
  --tb-opt-dark: #F0B400;
  --tb-opt-text: #0A0A0A;      /* negro sobre amarillo */
  --tb-hl: #FFC72C;
  --tb-err: #FFB3BC;
  --tb-outline: rgba(255,255,255,.55);
  --tb-outline-off: rgba(255,255,255,.26);
  --tb-display: "Inter Tight", system-ui, -apple-system, "Segoe UI", sans-serif; /* rotulación sobria, sin serif */
}
html { background: #0A1F4A; }
.tb.pp :focus-visible { outline-color: #fff; }
.tb.pp .tb-q { font-weight: 800; letter-spacing: -.01em; }
.tb.pp .tb-cookies button { background: var(--tb-accent); }
.tb.pp .tb-cookies .tb-cookies-ghost { background: #E6E8EE; color: #0A0A0A; }

/* Campos en fila (edad + peso) y etiquetas visibles */
.pp-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.pp-field { margin: 0 0 4px; }
.pp-label { display: block; margin: 0 0 6px; font-size: .9rem; font-weight: 700; color: var(--tb-text-2); }
.pp-select { appearance: none; -webkit-appearance: none; padding-right: 48px; cursor: pointer;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='10' viewBox='0 0 16 10'%3E%3Cpath d='M1 1l7 7 7-7' fill='none' stroke='%230A1F4A' stroke-width='2'/%3E%3C/svg%3E") no-repeat right 20px center; }
.pp-group { margin: 22px 0 10px; font-family: var(--tb-body); font-size: 1.05rem; font-weight: 700; color: var(--tb-text); }
.pp-group:first-of-type { margin-top: 0; }
.pp-2col { grid-template-columns: 1fr 1fr; }
.pp-opt-2 span { display: block; }
.pp-opt-2 small { display: block; margin-top: 2px; font-size: .88rem; font-weight: 500; opacity: .85; }
.pp-hint { margin: 10px 0 16px; font-size: .9rem; color: var(--tb-text-2); max-width: 52ch; }
.pp-note { padding: 12px 14px; border: 1.5px solid var(--tb-outline); border-radius: 6px; }

/* Descarga: rojo, con icono; deshabilitado hasta captcha + términos */
.pp-btn-dl { gap: 10px; }
.pp-btn-dl:disabled { background: transparent; color: var(--tb-text-3); border: 1.5px dashed var(--tb-outline-off); opacity: 1; }
.pp-btn-alt { background: var(--tb-opt); color: var(--tb-opt-text); }
.pp-btn-alt:hover { background: var(--tb-opt-dark); }
.pp-actions { margin: 0 0 8px; }
.pp-actions .tb-btn { margin-top: 0; }

/* Lista lateral: los bloques se iluminan al personalizarse */
.pp-sl li.is-on { color: var(--tb-hl); border-color: var(--tb-hl); font-weight: 700; }

/* Instrucciones de importación */
.pp-import details { border-top: 1px solid var(--tb-outline-off); padding: 12px 0; }
.pp-import details:last-child { border-bottom: 1px solid var(--tb-outline-off); }
.pp-import summary { cursor: pointer; font-weight: 700; }
.pp-import ol, .pp-import p { margin: 10px 0 0; padding-left: 1.2em; font-size: .95rem; color: var(--tb-text-2); }
.pp-import p { padding-left: 0; }
.pp-legal { margin: 28px 0 0; font-size: .82rem; line-height: 1.45; color: var(--tb-text-3); max-width: 60ch; }

@media (max-width: 480px) {
  .pp-row { grid-template-columns: 1fr 1fr; }
  .pp-2col { grid-template-columns: 1fr; }
  .tb.pp .tb-input-short { max-width: none; }
}

.tb-q + .pp-group { margin-top: 20px; }
