/* ══════════════════════════════════════════════════════════════════════
   ayu-altas.css · la pestaña de altas del ayudante
   ──────────────────────────────────────────────────────────────────────
   20/09/2026 · PARTE 2 DE 3

   Igual que en la parte 1: fichero aparte, se carga el último, y lleva
   su propia señal de vida. Si no llega, el JS no monta la pestaña y la
   app se queda exactamente como estaba.
   ══════════════════════════════════════════════════════════════════════ */

:root{ --ayu-altas:1; }

/* Seis pestañas ya no caben en cinco columnas. Se cambia sólo cuando
   la sexta existe de verdad, para no descolocar a quien todavía tenga
   la versión anterior en el móvil. */
.tabs2.ayu-seis{ grid-template-columns:repeat(6,1fr); }
.tabs2.ayu-seis .t2{ padding:8px 1px 7px; }
.tabs2.ayu-seis .t2 .t2l{ font-size:0.58rem; }
.tabs2.ayu-seis .t2 .t2i{ font-size:1.05rem; }

/* En pantallas muy estrechas (un móvil pequeño, o la letra en grande)
   seis etiquetas no entran. Se quedan los iconos, que es mejor que seis
   palabras cortadas a la mitad. */
@media (max-width:360px){
  .tabs2.ayu-seis .t2 .t2l{ display:none; }
  .tabs2.ayu-seis .t2{ padding:11px 1px; }
  .tabs2.ayu-seis .t2 .t2i{ font-size:1.25rem; }
}

/* ── Un campo: etiqueta encima, campo debajo ───────────────────────── */
.ayu-alta-c{ display:block; margin-bottom:2px; }
.ayu-alta-c > span{
  display:block;
  font-size:0.68rem; font-weight:800; letter-spacing:0.3px;
  color:var(--muted); margin-bottom:4px;
}

/* Dos campos por fila cuando caben. Nombre y apellidos juntos se lee
   como una sola cosa, que es lo que son. */
.ayu-alta-rej{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
@media (max-width:420px){ .ayu-alta-rej{ grid-template-columns:1fr; gap:0; } }

/* La fecha de nacimiento en tres trozos, como en la app del gestor:
   escribir «11/03/2014» en un campo de fecha del móvil es un suplicio. */
.ayu-alta-fecha{ display:grid; grid-template-columns:0.8fr 1.4fr 1fr; gap:8px; }
.ayu-alta-fecha input, .ayu-alta-fecha select{ margin-bottom:10px; }

.ayu-alta-sep{
  font-size:0.63rem; font-weight:800; letter-spacing:1.1px; text-transform:uppercase;
  color:var(--muted2); margin:14px 0 8px;
  padding-top:12px; border-top:1px solid var(--line);
}

/* ── Los días ──────────────────────────────────────────────────────── */
.ayu-alta-dias{
  display:grid; grid-template-columns:repeat(7,1fr); gap:5px; margin-bottom:12px;
}
.ayu-dia{
  padding:10px 2px; border-radius:var(--r-xs);
  border:1px solid var(--line); background:var(--card2);
  color:var(--muted); font-weight:800; font-size:0.72rem;
  font-family:inherit; cursor:pointer; min-width:0;
  transition:background .16s, color .16s, border-color .16s;
}
.ayu-dia:hover{ color:var(--text); }
.ayu-dia.on{
  background:linear-gradient(135deg,var(--acc),var(--acc2));
  color:var(--acc-ink); border-color:transparent;
}

.ayu-alta-aviso{
  background:var(--acc-soft); border:1px solid var(--line);
  border-radius:var(--r-sm); padding:10px 12px; margin:6px 0 12px;
  font-size:0.78rem; line-height:1.4; color:var(--muted);
}

/* ── Lo que está sin mandar ─────────────────────────────────────────── */
.ayu-alta-fila{
  display:flex; align-items:center; gap:9px;
  padding:9px 0; border-bottom:1px solid var(--line);
  font-size:0.86rem;
}
.ayu-alta-fila:last-of-type{ border-bottom:none; }
.ayu-alta-fila b{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ayu-alta-fila span{
  font-size:0.64rem; font-weight:800; letter-spacing:0.6px; text-transform:uppercase;
  color:var(--muted2); background:var(--card2);
  border-radius:var(--r-pill); padding:3px 9px;
}
.ayu-alta-x{
  flex-shrink:0; width:28px; height:28px; border-radius:var(--r-pill);
  border:1px solid var(--line); background:transparent; color:var(--muted);
  font-family:inherit; font-size:0.85rem; cursor:pointer; padding:0;
  display:flex; align-items:center; justify-content:center;
}
.ayu-alta-x:hover{ color:var(--red); border-color:var(--red); }
