/* Ficha en vivo (RF-AFI-12, M2_08_FICHA_EN_VIVO): réplica del frente de la ficha oficial, que se completa
   mientras la persona escribe. Solo se carga en /afiliate/nueva. Tinta azul sobre papel, como una ficha llenada a mano. */

.ficha-vivo[hidden], .ficha-vivo__abrir[hidden] { display: none !important; }

.ficha-vivo__cabecera { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.ficha-vivo__titulo { margin: 0; color: var(--azul-noche); font-family: var(--display); font-size: 1.35rem; font-weight: 800; text-transform: uppercase; }
.ficha-vivo__bajada { margin: 6px 0 14px; color: var(--gris-consejo); font-size: .95rem; }
.ficha-vivo__nota { margin: 12px 0 0; color: var(--gris-consejo); font-size: .9rem; }
.ficha-vivo__cerrar { min-height: 44px; padding: 0 16px; border: 1.5px solid var(--azul-pj); border-radius: var(--radio); background: var(--blanco); color: var(--azul-pj); font: 600 1rem var(--texto); cursor: pointer; }
.ficha-vivo__abrir { position: fixed; right: 16px; bottom: max(16px, env(safe-area-inset-bottom)); z-index: 40; box-shadow: 0 6px 18px rgba(11,39,68,.35); }
.ficha-vivo__papel { container-type: inline-size; }

/* ---- El papel ---- */
.ficha {
  padding: 1.4em 1.6em 1.2em; border: 1px solid #D9D4C7; border-radius: 3px; background: #FFFEFA;
  box-shadow: 0 1px 0 #EFEBE1, 0 10px 24px rgba(11,39,68,.12);
  color: #1E1E1E; font-family: "Times New Roman", Times, "Liberation Serif", serif; font-size: clamp(10px, 2.35cqi, 14.5px); line-height: 1.25;
}
.ficha p { margin: 0; }
.ficha__partido { display: flex; align-items: baseline; gap: .6em; margin-bottom: .9em !important; padding-bottom: .25em; border-bottom: 1.5px solid #1E1E1E; font-size: 1.25em; font-weight: 700; }
.ficha__partido span { font-size: 1.1em; letter-spacing: .32em; }
.ficha__fila { display: flex; flex-wrap: wrap; gap: .35em 1em; margin-bottom: .55em; }
.ficha__campo { display: flex; flex: 1 1 8em; align-items: baseline; gap: .3em; min-width: 0; border-radius: 2px; transition: background-color .2s, box-shadow .2s; }
.ficha__campo--largo { flex: 3 1 14em; }
.ficha__campo--corto { flex: 1 1 5em; }
.ficha__campo--dni { flex: 3 1 19em; }
.ficha__campo--dni .ficha__valor { white-space: nowrap; min-width: 6.5em; }   /* el número no se parte en dos renglones */
.ficha__campo--fecha { flex: 0 0 auto; }   /* día / mes / año: ancho fijo, si no el año pisa al renglón de al lado */
.ficha__rotulo { flex: none; white-space: nowrap; }
.ficha__valor {
  flex: 1 1 auto; min-width: 2.5em; min-height: 1.25em; border-bottom: 1.5px dotted #6B6B6B;
  color: #1C3F94; font-family: "Courier New", Courier, monospace; font-weight: 700; letter-spacing: .02em; overflow-wrap: anywhere;
}
.ficha__valor--fecha { flex: 0 0 2.2em; text-align: center; }
.ficha__valor--anio { flex: 0 0 3.6em; text-align: center; }
.ficha__barra { flex: none; }

/* El renglón que la persona está completando se ilumina, para unir el formulario con la ficha. */
.ficha__campo--activo { background: rgba(116,172,223,.25); box-shadow: 0 0 0 .25em rgba(116,172,223,.25); }

/* "Marcá con un círculo tu documento" (instructivo): el círculo de tinta sobre DNI o LE/LC. */
.ficha__doc { position: relative; }
.ficha__marcado::after { content: ""; position: absolute; inset: -.3em -.4em; border: 2px solid #1C3F94; border-radius: 50%; transform: rotate(-5deg); }

.ficha__domicilio { display: grid; grid-template-columns: 7.2em 1fr; gap: 0 .8em; margin-top: .3em; }
.ficha__domicilio-rotulo { align-self: center; }
.ficha__domicilio-campos { padding-right: .8em; border-right: 1.5px solid #1E1E1E; }

.ficha__pie { display: grid; grid-template-columns: 1fr 1.25fr; gap: 1.2em; margin-top: 1em; font-size: .86em; }
.ficha__firmas, .ficha__certificaciones { display: grid; gap: 1em; align-content: start; }
.ficha__aceptacion { display: grid; gap: .45em; padding: .6em .8em; border: 1.5px solid #1E1E1E; }
.ficha__firma { display: grid; gap: .2em; text-align: center; }
.ficha__linea { display: block; height: 1.5em; border-bottom: 1.5px dotted #6B6B6B; }

@container (max-width: 440px) {
  .ficha__domicilio, .ficha__pie { grid-template-columns: 1fr; }
  .ficha__domicilio-rotulo { margin-bottom: .4em !important; }
  .ficha__domicilio-campos { padding-right: 0; border-right: 0; }
}

/* ---- Dónde se muestra ---- */
@media (max-width: 1099px) {
  .con-ficha { padding-bottom: 96px; }   /* que el botón flotante no tape "Enviar" */
  .ficha-vivo { display: none; }
  .ficha-vivo.ficha-vivo--abierta {
    position: fixed; inset: auto 0 0; z-index: 60; display: block; max-height: 88vh; overflow-y: auto;
    padding: 16px 16px max(20px, env(safe-area-inset-bottom)); border-radius: 14px 14px 0 0; background: var(--blanco);
    box-shadow: 0 0 0 100vmax rgba(11,39,68,.55); animation: hoja .25s ease-out;
  }
}
@media (min-width: 1100px) {
  .con-ficha { display: grid; grid-template-columns: minmax(0, 36rem) minmax(0, 1fr); gap: 48px; align-items: start; }
  .con-ficha .formulario { max-width: none; }
  .ficha-vivo { position: sticky; top: 92px; }
  .ficha-vivo__abrir, .ficha-vivo__cerrar { display: none; }
}
@keyframes hoja { from { opacity: 0; transform: translateY(24px); } }
@media (prefers-reduced-motion: reduce) {
  .ficha-vivo--abierta { animation: none !important; }
  .ficha__campo { transition: none; }
}