/* postula.apside.cl — estilos.
 *
 * Se usan los COMPONENTES CANÓNICOS del design system (`.ap-header`, `.ap-footer--min`,
 * `.ap-hero`, `.ap-fieldset`, `.ap-archivo`, `.ap-check`, `.ap-alerta`, `.ap-proceso`) en vez de
 * clases propias: el kit ya los define y hasta nombra a postula al describir el footer mínimo.
 *
 * Y se usan los TOKENS SEMÁNTICOS de la capa de temas v1.3 (`--ap-fondo`, `--ap-txt`,
 * `--ap-borde`…) en lugar de elegir colores a mano. El header y el footer llevan su propio
 * `data-tema="oscuro"` en el marcado: así la identidad oscura está garantizada sin escribir un
 * solo color, que es justo el antipatrón que la v1.3 vino a matar.
 *
 * Los tokens se cargan ANTES que este archivo (ver base.html).
 */

@font-face { font-family:'Poppins'; src:url('/estaticos/fonts/poppins-400.woff2') format('woff2');
  font-weight:400; font-display:swap; }
@font-face { font-family:'Poppins'; src:url('/estaticos/fonts/poppins-500.woff2') format('woff2');
  font-weight:500; font-display:swap; }
@font-face { font-family:'Poppins'; src:url('/estaticos/fonts/poppins-600.woff2') format('woff2');
  font-weight:600; font-display:swap; }
@font-face { font-family:'Poppins'; src:url('/estaticos/fonts/poppins-700.woff2') format('woff2');
  font-weight:700; font-display:swap; }
@font-face { font-family:'Open Sans'; src:url('/estaticos/fonts/open-sans.woff2') format('woff2');
  font-weight:400 700; font-display:swap; }

*, *::before, *::after { box-sizing:border-box; }

body { margin:0; font-family:var(--ap-fuente-cuerpo); font-size:var(--ap-txt-base);
  line-height:var(--ap-alto-cuerpo); color:var(--ap-txt); background:var(--ap-fondo); }

h1, h2, h3 { font-family:var(--ap-fuente-titulo); color:var(--ap-txt-fuerte);
  line-height:var(--ap-alto-titulo); margin:0 0 var(--ap-e4); }
h1 { font-size:var(--ap-txt-4xl); font-weight:var(--ap-peso-bold); }
h2 { font-size:var(--ap-txt-2xl); font-weight:var(--ap-peso-semi); }
h3 { font-size:var(--ap-txt-lg); font-weight:var(--ap-peso-semi); }
p { margin:0 0 var(--ap-e4); }
a { color:var(--ap-accion); }
:focus-visible { outline:none; box-shadow:var(--ap-foco); border-radius:var(--ap-radio-sm); }

.ap-saltar { position:absolute; left:-9999px; }
.ap-saltar:focus { left:var(--ap-e4); top:var(--ap-e4); z-index:10;
  background:var(--ap-sup-1); padding:var(--ap-e3) var(--ap-e4);
  border-radius:var(--ap-radio-sm); }

/* — Header y footer (canónicos; llevan su propio tema en el marcado) — */

.ap-header { background-color:var(--ap-fondo); color:var(--ap-txt); }
.ap-header__in { max-width:var(--ap-contenedor); margin:0 auto;
  padding:var(--ap-e4) var(--ap-e6); display:flex; align-items:center;
  justify-content:space-between; gap:var(--ap-e6); }
.ap-nav { display:flex; align-items:center; gap:var(--ap-e6); flex-wrap:wrap; }
.ap-nav a { font-family:var(--ap-fuente-titulo); font-size:var(--ap-txt-sm);
  font-weight:var(--ap-peso-medio); color:var(--ap-txt-suave); text-decoration:none;
  display:inline-flex; align-items:center; gap:var(--ap-e1); padding:var(--ap-e2) 0; }
.ap-nav a:hover { color:var(--ap-txt-fuerte); }
.ap-nav a:focus-visible { outline:none; box-shadow:var(--ap-foco);
  border-radius:var(--ap-radio-sm); }

.ap-footer--min { background-color:var(--ap-fondo); color:var(--ap-txt);
  border-top:1px solid var(--ap-borde); margin-top:var(--ap-e20); }
.ap-footer__legal-in { max-width:var(--ap-contenedor); margin:0 auto;
  padding:var(--ap-e8) var(--ap-e6); display:flex; justify-content:space-between;
  gap:var(--ap-e4); flex-wrap:wrap; font-size:var(--ap-txt-sm); color:var(--ap-txt-suave); }
.ap-footer__legal-in p { margin:0; }
.ap-footer__legal-in a { color:var(--ap-txt-suave); }
.ap-footer__legal-in a:hover { color:var(--ap-txt-fuerte); }

/* — Layout — */

.ap-contenedor { max-width:var(--ap-contenedor); margin-inline:auto;
  padding-inline:var(--ap-e6); }
.ap-seccion { padding-block:var(--ap-seccion-y); }
/* Sección hundida: separa bloques sin meter una línea. */
.ap-seccion--superficie { background:var(--ap-sup-2); }
.ap-ficha { max-width:var(--ap-contenido-max); margin-inline:auto; }

/* — Hero — */

.ap-hero { background:var(--ap-grad-hero); color:var(--ap-sobre-oscuro);
  padding-block:var(--ap-seccion-y); }
.ap-hero__in { max-width:var(--ap-contenedor); margin:0 auto;
  padding-inline:var(--ap-e6); }
.ap-hero__eyebrow { font-family:var(--ap-fuente-titulo); font-size:var(--ap-txt-sm);
  font-weight:var(--ap-peso-semi); letter-spacing:.08em; text-transform:uppercase;
  color:var(--ap-cian); margin:0 0 var(--ap-e3); }
.ap-hero__titulo { color:var(--ap-sobre-oscuro); max-width:var(--ap-contenido-max);
  margin-bottom:var(--ap-e4); }
.ap-hero__bajada { color:var(--ap-sobre-oscuro-suave); font-size:var(--ap-txt-lg);
  max-width:var(--ap-contenido-max); }
.ap-hero__acciones { display:flex; gap:var(--ap-e4); flex-wrap:wrap;
  margin-top:var(--ap-e8); }

/* — Datos (las cifras del hero) — */

.ap-datos__grid { display:flex; gap:var(--ap-e12); flex-wrap:wrap;
  margin-top:var(--ap-e12); padding-top:var(--ap-e6);
  border-top:1px solid var(--ap-linea-oscura); }
.ap-dato__valor { display:block; font-family:var(--ap-fuente-titulo);
  font-size:var(--ap-txt-2xl); font-weight:var(--ap-peso-bold); color:var(--ap-cian); }
.ap-dato__label { font-size:var(--ap-txt-sm); color:var(--ap-sobre-oscuro-suave); }

/* — Botones — */

.ap-btn { display:inline-flex; align-items:center; gap:var(--ap-e2);
  font-family:var(--ap-fuente-titulo); font-size:.9375rem; font-weight:var(--ap-peso-medio);
  padding:var(--ap-e3) var(--ap-e8); border-radius:var(--ap-radio-pill);
  border:1px solid transparent; cursor:pointer; text-decoration:none;
  min-height:var(--ap-control); transition:filter var(--ap-transicion); }
.ap-btn:hover { filter:brightness(1.08); }
.ap-btn:focus-visible { outline:none; box-shadow:var(--ap-foco); }
.ap-btn--primario { background:var(--ap-accion); color:var(--ap-accion-sobre); }
.ap-btn--secundario { background:transparent; color:var(--ap-accion);
  border-color:var(--ap-accion); }
.ap-btn--sobre-oscuro { background:var(--ap-blanco); color:var(--ap-noche); }
.ap-btn--contorno-claro { background:transparent; color:var(--ap-sobre-oscuro);
  border-color:var(--ap-linea-oscura); }
.ap-btn--texto { background:none; padding-inline:0; color:var(--ap-accion);
  font-weight:var(--ap-peso-semi); }
.ap-btn--peligro { background:var(--ap-error); color:var(--ap-blanco); }
.ap-btn[disabled] { opacity:.6; cursor:progress; }

/* — Vacantes — */

.ap-vacantes { display:grid; gap:var(--ap-e4); margin-top:var(--ap-e8); }
.ap-vacante { background:var(--ap-sup-1); border:1px solid var(--ap-borde);
  border-radius:var(--ap-radio); padding:var(--ap-e6); box-shadow:var(--ap-elevacion);
  display:flex; justify-content:space-between; gap:var(--ap-e6); flex-wrap:wrap;
  align-items:center; transition:box-shadow var(--ap-transicion); }
.ap-vacante:hover { box-shadow:var(--ap-elevacion-alta); }
.ap-vacante h3 { margin-bottom:var(--ap-e2); }
.ap-vacante__meta { font-size:var(--ap-txt-sm); color:var(--ap-txt-suave); margin:0; }
.ap-vacante__tags { display:flex; gap:var(--ap-e2); flex-wrap:wrap;
  margin-top:var(--ap-e3); }

.ap-badge { display:inline-flex; align-items:center; gap:var(--ap-e1);
  font-size:var(--ap-txt-xs); font-weight:var(--ap-peso-semi);
  padding:var(--ap-e1) var(--ap-e3); border-radius:var(--ap-radio-pill); }
.ap-badge--neutro { background:var(--ap-sup-2); color:var(--ap-txt);
  border:1px solid var(--ap-borde); }

/* — Proceso (qué pasa después de postular) — */

.ap-proceso { display:grid; grid-template-columns:repeat(auto-fit, minmax(14rem, 1fr));
  gap:var(--ap-e8); margin-top:var(--ap-e8); }
.ap-proceso__paso { position:relative; }
.ap-proceso__num { display:inline-flex; align-items:center; justify-content:center;
  width:2rem; height:2rem; border-radius:var(--ap-radio-pill);
  background:var(--ap-accion); color:var(--ap-accion-sobre);
  font-family:var(--ap-fuente-titulo); font-weight:var(--ap-peso-bold);
  font-size:var(--ap-txt-sm); margin-bottom:var(--ap-e3); }
.ap-proceso__titulo { font-family:var(--ap-fuente-titulo); font-weight:var(--ap-peso-semi);
  color:var(--ap-txt-fuerte); margin:0 0 var(--ap-e2); }
.ap-proceso__desc { font-size:var(--ap-txt-sm); color:var(--ap-txt-suave); margin:0; }

/* — Formulario — */

.ap-fieldset { border:none; margin:0 0 var(--ap-e12); padding:0; }
.ap-legend { font-family:var(--ap-fuente-titulo); font-size:var(--ap-txt-lg);
  font-weight:var(--ap-peso-semi); color:var(--ap-txt-fuerte); padding:0;
  margin-bottom:var(--ap-e2); }
.ap-fieldset__ayuda { font-size:var(--ap-txt-sm); color:var(--ap-txt-suave);
  margin:0 0 var(--ap-e6); }

.ap-campo { display:flex; flex-direction:column; gap:var(--ap-e1);
  margin-bottom:var(--ap-e4); }
.ap-campo__label { font-family:var(--ap-fuente-titulo); font-size:var(--ap-txt-sm);
  font-weight:var(--ap-peso-medio); color:var(--ap-txt-fuerte); }
.ap-campo__ayuda { font-size:var(--ap-txt-xs); color:var(--ap-txt-suave); }
.ap-campo__input { font-family:var(--ap-fuente-cuerpo); font-size:var(--ap-txt-base);
  color:var(--ap-txt-fuerte); background:var(--ap-sup-1); border:1px solid var(--ap-borde);
  border-radius:var(--ap-radio-sm); padding:var(--ap-e3) var(--ap-e4);
  min-height:var(--ap-control); width:100%; }
.ap-campo__input:focus { outline:none; border-color:var(--ap-accion);
  box-shadow:var(--ap-foco); }
.ap-campo--error .ap-campo__input { border-color:var(--ap-error); }
.ap-campo__error { font-size:var(--ap-txt-xs); color:var(--ap-error);
  font-weight:var(--ap-peso-medio); }
.ap-fila { display:grid; grid-template-columns:1fr 1fr; gap:var(--ap-e4); }
@media (max-width:30rem) { .ap-fila { grid-template-columns:1fr; } }

/* Archivo: el input nativo es feo e inconsistente entre navegadores, pero sigue siendo el
   input nativo — se estiliza el envoltorio, no se reconstruye el control. */
.ap-archivo { display:flex; align-items:center; gap:var(--ap-e4); flex-wrap:wrap;
  border:1px dashed var(--ap-borde-fuerte); border-radius:var(--ap-radio);
  padding:var(--ap-e4) var(--ap-e6); background:var(--ap-sup-1); }
.ap-archivo input[type=file] { font-family:var(--ap-fuente-cuerpo);
  font-size:var(--ap-txt-sm); color:var(--ap-txt); }
.ap-archivo input[type=file]::file-selector-button {
  font-family:var(--ap-fuente-titulo); font-size:var(--ap-txt-sm);
  font-weight:var(--ap-peso-medio); padding:var(--ap-e2) var(--ap-e6);
  margin-right:var(--ap-e4); border-radius:var(--ap-radio-pill);
  border:1px solid var(--ap-accion); background:transparent; color:var(--ap-accion);
  cursor:pointer; }
.ap-archivo input[type=file]::file-selector-button:hover {
  background:var(--ap-accion); color:var(--ap-accion-sobre); }

/* Consentimiento: control nativo con accent-color, no un checkbox reconstruido con divs. */
.ap-check { display:flex; gap:var(--ap-e3); align-items:flex-start;
  font-size:var(--ap-txt-sm); }
.ap-check input[type=checkbox] { accent-color:var(--ap-accion); width:1.25rem;
  height:1.25rem; margin-top:.15rem; flex:none; }
.ap-consentimiento { background:var(--ap-sup-1); border:1px solid var(--ap-borde);
  border-radius:var(--ap-radio); padding:var(--ap-e6); margin-block:var(--ap-e8); }

/* — Alertas (color + texto, nunca color solo) — */

.ap-alerta { border-radius:var(--ap-radio); padding:var(--ap-e4) var(--ap-e6);
  margin-bottom:var(--ap-e6); font-size:var(--ap-txt-sm);
  display:flex; gap:var(--ap-e3); align-items:flex-start; }
.ap-alerta--error { background:rgba(179,25,31,.08); border:1px solid rgba(179,25,31,.25);
  color:var(--ap-error); }
.ap-alerta--exito { background:rgba(30,127,79,.1); border:1px solid rgba(30,127,79,.3);
  color:var(--ap-exito); }
.ap-alerta svg { flex:none; margin-top:.15rem; }

/* — Página de estado (sin vacantes) — */

.ap-estado { text-align:center; max-width:var(--ap-contenido-max);
  margin-inline:auto; padding-block:var(--ap-e8); }
.ap-estado__icono { color:var(--ap-txt-suave); margin-bottom:var(--ap-e4); }
.ap-estado__titulo { margin-bottom:var(--ap-e3); }
.ap-estado__texto { color:var(--ap-txt-suave); }
.ap-estado__acciones { display:flex; gap:var(--ap-e4); justify-content:center;
  flex-wrap:wrap; margin-top:var(--ap-e6); }

/* Nota de versión del consentimiento: dato de trazabilidad, no contenido. */
.ap-nota-consent { margin-top:var(--ap-e4); }