/* 17 oct · Administración › Alumnos · vista de administración del alumno (admin-perfil.js · docs/ADMIN-17OCT.md zona A).
   Es la ficha de Admisiones (.ficha-adm) con otra maqueta (.ficha-perfil): una caja que se desplaza (.pf-cuerpo) con la
   cabecera pegada arriba (sticky), Estado e Instrumento y cuatro secciones plegables; el pie de siempre debajo. Las reglas de la base valen para
   las dos apariencias (solo usan tokens); las de Selah empiezan por :root[data-diseno="selah"]. El teléfono (≤ 760 px)
   hereda la página entera de tel-admin.css y aquí solo se ajusta lo propio (al final, con más peso). */

.ficha-adm.ficha-perfil {
  display: flex; flex-direction: column; width: min(1000px, 100%);
  height: calc(100dvh - max(24px, 5vh) - 20px); max-height: 900px; min-height: 0;
}
.ficha-perfil .fc-cab {
  flex: none; position: sticky; top: 0; z-index: 2; align-items: center; gap: 14px; padding: 18px 60px 16px 24px;
  border-bottom: 1px solid var(--linea); background: var(--sup);
}
.ficha-perfil .pf-quien { gap: 6px; }
.ficha-perfil .pf-datos { gap: 6px 16px; }
.pf-dato { display: inline-flex; align-items: center; gap: 6px; min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
.pf-dato.vacio { color: var(--tinta-4); }
.pf-saldo {
  display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px; border-radius: var(--r-pildora);
  font: 600 var(--t-s)/1 var(--f-ui); color: var(--tinta-2); background: var(--sup-3); white-space: nowrap;
}
.pf-saldo .ic { width: 14px; height: 14px; }
.pf-saldo.debe { color: var(--peligro-texto); background: var(--peligro-fondo); }
.pf-saldo.al-dia { color: var(--tinta-2); }
.pf-saldo.sin { color: var(--tinta-3); font-weight: 500; }

.pf-cuerpo { flex: 1; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: 12px; padding: 0 0 24px; }
.pf-cuerpo > :not(.fc-cab) { margin-inline: 24px; }
.ficha-perfil .fc-barra { padding: 2px 0 2px; }
.ficha-perfil .fc-recordatorio { margin: 0; }
.ficha-perfil .fc-editor { flex: none; display: flex; flex-direction: column; gap: 12px; padding: 0; min-height: auto; }

/* ── secciones plegables ── */
.pf-seccion { border: 1px solid var(--linea); border-radius: var(--r-l); background: var(--sup); overflow: clip; }
.pf-seccion[data-estado="falta-algo"] { border-color: color-mix(in srgb, var(--aviso) 55%, var(--linea)); }
.pf-seccion[data-estado="falta-algo"] > .pf-sec-cab { background: var(--aviso-fondo); }
.pf-seccion[data-estado="falta-todo"] { border-color: color-mix(in srgb, var(--peligro) 55%, var(--linea)); }
.pf-seccion[data-estado="falta-todo"] > .pf-sec-cab { background: var(--peligro-fondo); }
.pf-sec-cab {
  display: flex; align-items: center; gap: 12px; width: 100%; min-height: 58px; padding: 10px 16px; border: 0; background: transparent;
  color: var(--tinta); text-align: left; cursor: pointer; font: 600 var(--t-l)/var(--lh-l) var(--f-ui);
}
.pf-sec-cab:focus-visible { outline: 2px solid var(--acento); outline-offset: -2px; }
.pf-sec-ic { flex: none; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--sup-3); color: var(--tinta-3); }
.pf-sec-ic .ic { width: 17px; height: 17px; }
.pf-seccion[data-estado="falta-algo"] .pf-sec-ic { color: var(--aviso-texto); background: color-mix(in srgb, var(--aviso) 18%, var(--sup)); }
.pf-seccion[data-estado="falta-todo"] .pf-sec-ic { color: var(--peligro-texto); background: color-mix(in srgb, var(--peligro) 14%, var(--sup)); }
.pf-sec-titulo { flex: none; }
.pf-sec-cab > .espacio { flex: 1; }
.pf-chips { flex: 1; min-width: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.pf-chip {
  display: inline-flex; align-items: center; height: 24px; padding: 0 10px; border-radius: var(--r-pildora);
  font: 600 var(--t-s)/1 var(--f-ui); white-space: nowrap; color: var(--aviso-texto); background: color-mix(in srgb, var(--aviso) 16%, var(--sup));
}
.pf-seccion[data-estado="falta-todo"] .pf-chip { color: var(--peligro-texto); background: color-mix(in srgb, var(--peligro) 12%, var(--sup)); }
.pf-estado-txt { flex: none; display: inline-flex; align-items: center; gap: 4px; font: 500 var(--t-s)/var(--lh-s) var(--f-ui); color: var(--tinta-3); }
.pf-estado-txt .ic { width: 14px; height: 14px; color: var(--ok); }
.pf-seccion[data-estado="falta-algo"] .pf-estado-txt { color: var(--aviso-texto); }
.pf-seccion[data-estado="falta-todo"] .pf-estado-txt { color: var(--peligro-texto); }
.pf-sec-flecha { flex: none; width: 18px; height: 18px; color: var(--tinta-3); transition: transform var(--dur) var(--ease); }
.pf-seccion.abierta .pf-sec-flecha { transform: rotate(180deg); }
.pf-sec-cuerpo { display: flex; flex-direction: column; gap: 22px; padding: 18px 20px 20px; border-top: 1px solid var(--linea); }

/* dentro: los pasos de la ficha, uno debajo del otro, sin su propio desplazamiento */
.pf-paso, .pf-sub { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.pf-paso .fc-ed-cab { margin: 0; }
.pf-paso .fc-ed-cab .fc-t-titulo, .pf-sub-titulo { margin: 0; font: 600 var(--t-m)/var(--lh-m) var(--f-ui); color: var(--tinta-2); }
.pf-sub-titulo { padding-left: 2px; }
.ficha-perfil .pf-paso .fc-ed-cuerpo { flex: none; overflow: visible; margin: 0; padding: 0; }
.ficha-perfil .pf-paso .fc-ed-cuerpo.p-disponibilidades { overflow: visible; }
.ficha-perfil .pf-paso .dp-marco { max-height: 440px; }
.ficha-perfil .pf-notas .fc-notas { padding: 0; border: 0; overflow: visible; }
.ficha-perfil .fc-docs { display: grid; gap: 10px; }

.pf-horario { display: flex; flex-direction: column; gap: 12px; }
.pf-horario-fila { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; }
.pf-horario-res { flex: 1 1 260px; display: flex; align-items: center; gap: 8px; margin: 0; font: 500 var(--t-l)/var(--lh-l) var(--f-ui); }
.pf-horario-res .ic { width: 18px; height: 18px; color: var(--tinta-3); }
.pf-horario-res.vacio { color: var(--tinta-3); }
.pf-asignacion { display: flex; flex-direction: column; height: 620px; border: 1px solid var(--linea); border-radius: var(--r-l); overflow: hidden; }
.pf-asignacion > .fc-ed-cuerpo.p-horario { flex: 1; min-height: 0; }
.ficha-perfil .fc-bandeja { position: static; margin: 0; }

.pf-saldo-linea { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0; font: 600 var(--t-l)/var(--lh-l) var(--f-ui); }
.pf-saldo-linea .ic { width: 18px; height: 18px; color: var(--tinta-3); }
.pf-saldo-linea.debe { color: var(--peligro-texto); }
.pf-saldo-linea.debe .ic { color: var(--peligro); }
.pf-saldo-linea small { font: 400 var(--t-s)/var(--lh-s) var(--f-ui); color: var(--tinta-3); }

/* ── Selah: vidrio claro, radios grandes y el nombre en la letra de marca (la cabecera ya la pone selah-admisiones) ── */
:root[data-diseno="selah"] .ficha-perfil .fc-cab { background: var(--sup); box-shadow: 0 10px 24px -22px rgba(35, 50, 104, .45); }
:root[data-diseno="selah"] .ficha-perfil .pf-seccion { border-radius: 18px; background: var(--vidrio-2, var(--sup)); box-shadow: 0 1px 0 var(--brillo, transparent) inset, 0 10px 30px -22px rgba(35, 50, 104, .35); }
:root[data-diseno="selah"] .ficha-perfil .pf-sec-titulo { font-weight: 700; }
:root[data-diseno="selah"] .ficha-perfil .pf-saldo { border-radius: var(--r-pildora); }

/* ── teléfono (≤ 760 px): la página entera de tel-admin.css; la cabecera se parte en líneas, nada se corta ── */
@media (max-width: 760px) {
  html:root[data-diseno] .ficha-adm.ficha-perfil { display: flex; flex-direction: column; height: 100dvh; max-height: none; }
  html:root[data-diseno] .ficha-adm.ficha-perfil .fc-cab { align-items: flex-start; padding: 6px 16px 10px 4px; }
  html:root[data-diseno] .ficha-adm.ficha-perfil .fc-cab > .avatar { margin-top: 4px; }
  html:root[data-diseno] .ficha-adm.ficha-perfil .pf-datos { white-space: normal; overflow: visible; display: flex; flex-wrap: wrap; gap: 2px 12px; }
  html:root[data-diseno] .ficha-adm.ficha-perfil .pf-quien h2 { white-space: normal; }
  html:root[data-diseno] .ficha-adm.ficha-perfil .pf-cuerpo { padding: 0 0 16px; gap: 10px; }
  html:root[data-diseno] .ficha-adm.ficha-perfil .pf-cuerpo > :not(.fc-cab) { margin-inline: 12px; }
  html:root[data-diseno] .ficha-adm.ficha-perfil .fc-barra { padding: 10px 0 0; }
  html:root[data-diseno] .ficha-adm.ficha-perfil .pf-sec-cab { flex-wrap: wrap; gap: 8px; min-height: 56px; padding: 10px 12px; font-size: 15px; }
  html:root[data-diseno] .ficha-adm.ficha-perfil .pf-sec-titulo { flex: 1 1 0; min-width: 0; }
  html:root[data-diseno] .ficha-adm.ficha-perfil .pf-sec-cab > .espacio { display: none; }
  /* plegada con lo que falta: las fichas en su línea (ya lo dicen); el número se omite */
  html:root[data-diseno] .ficha-adm.ficha-perfil .pf-sec-cab:has(.pf-chips) .pf-estado-txt { display: none; }
  html:root[data-diseno] .ficha-adm.ficha-perfil .pf-chips { order: 5; flex: 1 1 100%; padding-left: 40px; }
  html:root[data-diseno] .ficha-adm.ficha-perfil .pf-sec-cuerpo { padding: 14px 12px 16px; gap: 18px; }
  html:root[data-diseno] .ficha-adm.ficha-perfil .pf-sec-cuerpo :is(.boton, .fc-prefijo) { min-height: 44px; }
  html:root[data-diseno] .ficha-adm.ficha-perfil .pf-sec-cuerpo .fc-zona-adj { min-height: 44px; }
  html:root[data-diseno] .ficha-adm.ficha-perfil .pf-asignacion { height: 70dvh; }
  html:root[data-diseno] .ficha-adm.ficha-perfil .fc-campos.c2 { grid-template-columns: minmax(0, 1fr); }
}
