/* Consola de administración (se carga después de app.css): la planilla de control del servicio,
   con la misma tinta, los mismos filetes y los mismos sellos que el horario de la actividad. */
body.consola { --materia: var(--tinta); --materia-tinte: var(--cabecera); }

/* ------------------------------------------------------------------ cabecera */
.consola-cabecera {
  display: flex; align-items: center; gap: calc(var(--u) * 3) calc(var(--u) * 8); flex-wrap: wrap;
  padding: calc(var(--u) * 3) calc(var(--u) * 6); border-bottom: var(--marco); background: var(--papel);
}
.consola-marca {
  display: inline-flex; align-items: baseline; gap: calc(var(--u) * 2); color: var(--tinta); text-decoration: none;
  font-weight: 700; font-size: 1.0625rem;
}
.consola-marca span {
  font-family: var(--letra-estrecha); font-weight: 600; font-size: 0.8125rem; text-transform: uppercase;
  letter-spacing: 0.06em; color: var(--tinta-3);
}
.consola-nav { display: flex; gap: calc(var(--u) * 6); flex-wrap: wrap; margin-right: auto; }
.consola-nav a {
  font-family: var(--letra-estrecha); font-weight: 700; font-size: 0.9375rem; text-transform: uppercase; letter-spacing: 0.04em;
  color: var(--tinta-2); text-decoration: none; padding: calc(var(--u) * 1) 0; border-bottom: 3px solid transparent;
}
.consola-nav a:hover { color: var(--tinta); border-bottom-color: var(--filete-medio); }
.consola-nav a[aria-current="page"] { color: var(--tinta); border-bottom-color: var(--tinta); }
.consola-usuario { display: flex; align-items: center; gap: calc(var(--u) * 2); flex-wrap: wrap; }
.consola-usuario form { margin: 0; }
.consola-persona { font-weight: 600; }

/* ------------------------------------------------------------------ hoja */
.consola-hoja { max-width: 1240px; gap: calc(var(--u) * 6); }
.encabezado > .nota { margin: 0; }
.migas { font-weight: 600; margin-bottom: calc(var(--u) * -4); }
.migas a::after { content: " /"; color: var(--tinta-3); text-decoration: none; display: inline-block; margin-left: calc(var(--u) * 1); }

.consola-cuerpo { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: calc(var(--u) * 10); align-items: start; }
.indice { position: sticky; top: calc(var(--u) * 4); }
.indice ol { list-style: none; margin: 0; padding: 0; border-top: var(--marco); }
.indice li { border-bottom: var(--linea); }
.indice a {
  display: block; padding: calc(var(--u) * 2) calc(var(--u) * 1); text-decoration: none; color: var(--tinta-2);
  font-family: var(--letra-estrecha); font-weight: 700; font-size: 0.9375rem; text-transform: uppercase; letter-spacing: 0.04em;
}
.indice a:hover { color: var(--tinta); background: var(--cabecera); }
.consola-secciones { display: grid; grid-template-columns: minmax(0, 1fr); gap: calc(var(--u) * 12); min-width: 0; }

.seccion-consola { display: grid; grid-template-columns: minmax(0, 1fr); gap: calc(var(--u) * 4); min-width: 0; scroll-margin-top: calc(var(--u) * 4); }
.seccion-consola > h2 { padding-top: calc(var(--u) * 3); border-top: var(--marco); }
.seccion-consola > h3, .estado-drive > h3 { margin-top: calc(var(--u) * 2); }
.seccion-consola > p, .seccion-consola > .nota { margin: 0; max-width: 80ch; }
.seccion-consola form { margin: 0; }
.formulario .boton-peligro { margin-left: 0; }
.linea-estado { display: flex; gap: calc(var(--u) * 2); flex-wrap: wrap; }

/* ------------------------------------------------------------------ avisos */
.aviso-consola {
  margin: 0; padding: calc(var(--u) * 3) calc(var(--u) * 4); border-top: 2px solid currentColor; border-bottom: 1px solid currentColor;
  font-weight: 600; color: var(--tinta);
}
.aviso-consola[data-kind="ok"] { color: var(--ok); background: var(--ok-tinte); }
.aviso-consola[data-kind="error"] { color: var(--error); background: var(--error-tinte); }
.aviso-consola[data-kind="info"] { color: var(--tinta); background: var(--cabecera); }

.secreto { display: grid; gap: calc(var(--u) * 3); padding: calc(var(--u) * 5); border: var(--marco); background: var(--aviso-tinte); }
.secreto > * { margin: 0; }
.copiable { display: flex; gap: calc(var(--u) * 2); }
.copiable input { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: 0.875rem; }
.copiable .boton { flex: none; }

/* ------------------------------------------------------------------ cifras (cuadro de estado) */
.cifras {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; border-top: var(--marco); border-left: var(--linea);
}
.cifras-cortas { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 560px; }
.cifras div { padding: calc(var(--u) * 3); border-right: var(--linea); border-bottom: var(--linea); display: grid; gap: var(--u); }
.cifras dt {
  font-family: var(--letra-estrecha); font-weight: 600; font-size: 0.8125rem; text-transform: uppercase; letter-spacing: 0.04em;
  color: var(--tinta-2);
}
.cifras dd { margin: 0; font-family: var(--letra-estrecha); font-weight: 700; font-size: 1.75rem; line-height: 1; font-variant-numeric: tabular-nums; }
.cifras div[data-kind="aviso"] { background: var(--aviso-tinte); }
.cifras div[data-kind="aviso"] dd { color: var(--aviso); }
.cifras div[data-kind="error"] { background: var(--error-tinte); }
.cifras div[data-kind="error"] dd { color: var(--error); }

/* ------------------------------------------------------------------ tablas */
.tabla { width: 100%; border-collapse: collapse; font-size: 0.9375rem; border-top: var(--marco); }
.tabla th, .tabla td { text-align: left; padding: calc(var(--u) * 2.5) calc(var(--u) * 3); border-bottom: var(--linea); vertical-align: top; }
.tabla thead th {
  background: var(--cabecera); font-family: var(--letra-estrecha); font-weight: 700; font-size: 0.8125rem; text-transform: uppercase;
  letter-spacing: 0.04em; color: var(--tinta-2); vertical-align: bottom;
}
.tabla tbody th { font-weight: 600; }
.tabla tbody tr:hover { background: #f6f8fa; }
.tabla thead th.num { text-align: right; }
.tabla td.num { text-align: right; font-variant-numeric: tabular-nums; font-family: var(--letra-estrecha); font-weight: 700; font-size: 1.0625rem; }
.tabla .fecha, .tabla .ip { white-space: nowrap; font-variant-numeric: tabular-nums; }
.tabla code { font-size: 0.8125rem; }
.tabla a { font-weight: 700; }
.tabla .sello { margin: 2px 0; }
.acciones-tabla { display: flex; flex-wrap: wrap; align-items: center; gap: var(--u) calc(var(--u) * 2); }
.acciones-tabla form { display: inline; margin: 0; }
.acciones-tabla .boton-enlace { min-height: 36px; padding: var(--u) calc(var(--u) * 1); }
.peligro { color: var(--error) !important; }
.tabla-registro td { font-size: 0.875rem; }

/* ------------------------------------------------------------------ formularios */
.formulario-una { grid-template-columns: minmax(0, 1fr); }
.formulario-linea { grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)); max-width: 760px; }
.pasos { padding-left: calc(var(--u) * 6); margin: 0; display: grid; gap: calc(var(--u) * 2); max-width: 80ch; }
.estado-drive { display: grid; gap: calc(var(--u) * 3); padding-top: calc(var(--u) * 4); border-top: var(--linea); }
.estado-drive > p { margin: 0; }

/* ------------------------------------------------------------------ acceso */
.hoja-acceso { gap: calc(var(--u) * 4); }
.hoja-acceso h1 { color: var(--tinta); }
.pasos-acceso {
  list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; border: var(--linea);
  counter-reset: paso;
}
.pasos-acceso li {
  counter-increment: paso; padding: calc(var(--u) * 2) calc(var(--u) * 3); font-family: var(--letra-estrecha); font-weight: 600;
  text-transform: uppercase; letter-spacing: 0.04em; font-size: 0.875rem; color: var(--tinta-3);
}
.pasos-acceso li + li { border-left: var(--linea); }
.pasos-acceso li::before { content: counter(paso) ". "; }
.pasos-acceso li[aria-current="step"] { background: var(--tinta); color: var(--papel); }
input.codigo { font-family: var(--letra-estrecha); font-weight: 700; font-size: 1.75rem; letter-spacing: 0.3em; font-variant-numeric: tabular-nums; }
.qr { display: flex; justify-content: center; }
.qr svg { width: 220px; height: 220px; background: var(--papel); border: var(--linea); padding: calc(var(--u) * 2); }

/* ------------------------------------------------------------------ pantallas medianas y celular */
@media (max-width: 960px) {
  .consola-cuerpo { grid-template-columns: minmax(0, 1fr); gap: calc(var(--u) * 6); }
  .indice { position: static; }
  .indice ol { display: flex; flex-wrap: wrap; border-top: 0; gap: calc(var(--u) * 1) calc(var(--u) * 4); }
  .indice li { border-bottom: 0; }
  .indice a { padding: var(--u) 0; text-decoration: underline; text-underline-offset: 0.25em; }
  .cifras { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
  .consola-cabecera { padding: calc(var(--u) * 3) calc(var(--u) * 4); gap: calc(var(--u) * 2) calc(var(--u) * 4); }
  .consola-nav { order: 3; width: 100%; }
  /* Tablas como fichas apiladas: cada celda con su título. */
  .tabla-apilable, .tabla-apilable tbody, .tabla-apilable tr, .tabla-apilable th, .tabla-apilable td { display: block; }
  .tabla-apilable thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .tabla-apilable tr { padding: calc(var(--u) * 2) 0; border-bottom: var(--linea); }
  .tabla-apilable th, .tabla-apilable td { border-bottom: 0; padding: var(--u) calc(var(--u) * 2); }
  .tabla-apilable tbody th { font-size: 1.0625rem; }
  .tabla-apilable td[data-etiqueta] { display: grid; grid-template-columns: 9.5rem minmax(0, 1fr); gap: calc(var(--u) * 3); align-items: baseline; }
  .tabla-apilable td[data-etiqueta]::before {
    content: attr(data-etiqueta); font-family: var(--letra-estrecha); font-weight: 600; font-size: 0.8125rem; text-transform: uppercase;
    letter-spacing: 0.04em; color: var(--tinta-2);
  }
  .tabla-apilable td.num { text-align: left; }
  .cifras-cortas { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .copiable { flex-direction: column; }
  .migas { margin-bottom: calc(var(--u) * -3); }
}
