@import url('https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;600;700;800;900&display=swap');

:root {
    color-scheme: light;
    --amarillo: #f7c300;
    --amarillo-claro: #fff4bd;
    --negro: #000000;
    --negro-suave: #1a1a1a;
    --blanco: #ffffff;
    --gris: #686868;
    --gris-claro: #f5f5f5;
    --borde: #dedede;
    --error: #8a1c25;
    --exito: #17613a;
    --radio: 28px;
    --sombra: 0 18px 50px rgba(0, 0, 0, .12);
}

* { box-sizing: border-box; }
html { font-size: 16px; }

body {
    min-height: 100vh;
    margin: 0;
    color: var(--negro);
    background: var(--amarillo);
    font-family: "Inter Tight", Inter, Arial, sans-serif;
    line-height: 1.45;
}

.contenedor {
    width: min(100% - 32px, 780px);
    margin: 0 auto;
    padding: clamp(24px, 5vw, 58px) 0;
}

.cabecera-app {
    width: min(100% - 32px, 1100px);
    margin: 0 auto clamp(20px, 4vw, 34px);
    text-align: center;
}

.contenedor .cabecera-app { width: 100%; }

.cabecera-app h1 {
    margin: 0;
    color: var(--blanco);
    font-size: clamp(2.7rem, 8vw, 4.2rem);
    font-weight: 900;
    letter-spacing: -.04em;
    line-height: .95;
}

.cabecera-app p {
    max-width: 760px;
    margin: 12px auto 0;
    color: var(--negro);
    font-size: clamp(1.05rem, 3vw, 1.45rem);
    font-weight: 700;
    line-height: 1.2;
}

.tarjeta,
.panel,
.manual-box,
.resumen-box,
.mapa-contenedor,
.asistencia {
    background: var(--blanco);
    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: var(--radio);
    box-shadow: var(--sombra);
}

.tarjeta { padding: clamp(22px, 5vw, 40px); text-align: center; }

h2 {
    margin: 0 0 22px;
    font-size: clamp(1.65rem, 4vw, 2.2rem);
    font-weight: 800;
    line-height: 1.1;
}

h3 { font-weight: 800; }

.formulario {
    display: grid;
    gap: 17px;
    max-width: 520px;
    margin: 0 auto;
    text-align: left;
}

.formulario label:not(.opcion),
.manual-field { display: grid; gap: 7px; font-weight: 700; }

input,
select,
textarea,
button {
    width: 100%;
    min-height: 48px;
    padding: 12px 15px;
    color: var(--negro);
    background: var(--blanco);
    border: 1.5px solid #b7b7b7;
    border-radius: 14px;
    font: inherit;
}

input:focus,
select:focus,
textarea:focus,
button:focus,
a:focus {
    outline: 4px solid rgba(0, 0, 0, .16);
    outline-offset: 3px;
}

button,
.boton-enlace {
    display: inline-flex;
    width: auto;
    min-height: 50px;
    align-items: center;
    justify-content: center;
    padding: 13px 25px;
    color: var(--blanco);
    background: var(--negro);
    border: 1px solid var(--negro);
    border-radius: 999px;
    font-weight: 800;
    line-height: 1.15;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    transition: transform .18s ease, background .18s ease;
}

button:hover,
.boton-enlace:hover { color: var(--blanco); background: var(--negro-suave); transform: translateY(-1px); }

button:disabled { color: #ececec; background: #777; border-color: #777; cursor: wait; transform: none; }
.formulario button { justify-self: center; min-width: 180px; }
.telefono-campos { display: grid; grid-template-columns: minmax(0, .75fr) minmax(0, 1.25fr); gap: 14px; }
.telefono-campos label { min-width: 0; }

fieldset { margin: 4px 0; padding: 17px; border: 1.5px solid var(--borde); border-radius: 18px; }
legend { padding: 0 8px; font-weight: 800; }
.ayuda, small { color: var(--gris); font-weight: 500; }
.ayuda { margin: 0 0 10px; }

.opcion { display: flex; align-items: center; gap: 10px; padding: 8px 0; font-weight: 600; cursor: pointer; }
.opcion input { width: 22px; height: 22px; min-height: auto; margin: 0; accent-color: var(--negro); }

.alerta,
.mensaje,
.alert { margin: 0 auto 20px; padding: 15px 17px; border-radius: 16px; line-height: 1.5; }

.alerta.error,
.mensaje.error,
.error-ubicacion,
.alert.err { color: var(--error); background: #fff0f1; border: 1px solid #e8aeb3; }

.alerta.informacion,
.mensaje.informacion,
.mensaje.advertencia { color: var(--negro); background: var(--amarillo-claro); border: 1px solid #dcc04a; }

.mensaje.exito,
.alert.ok { color: var(--exito); background: #edf9f1; border: 1px solid #9bd1ae; }

.mensaje-exitoso p { max-width: 600px; margin: 0 auto 24px; font-size: 1.08rem; line-height: 1.6; }
.acciones-usuario { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 16px; margin-top: 25px; }
.lista-formularios { display: grid; gap: 15px; text-align: left; }
.formulario-item { padding: 20px; border: 1.5px solid var(--borde); border-radius: 18px; }
.formulario-item p { line-height: 1.55; }
a { color: var(--negro); font-weight: 700; text-underline-offset: 3px; }
a:hover { text-decoration-thickness: 2px; }
.bloque-registro { display: grid; justify-items: center; gap: 1px; margin: 24px 0 0; }
.texto-sin-cuenta { font-size: 1rem; font-weight: 700; line-height: 1.45; }
.enlace-registro { font-size: clamp(1.05rem, 3vw, 1.45rem); font-weight: 900; line-height: 1.2; }

/* Asistencia y consulta */
.pagina-simple { width: min(100% - 32px, 780px); max-width: 780px; margin: 0 auto; padding: clamp(24px, 5vw, 58px) 0; background: var(--amarillo); }
.pagina-simple > h2 { text-align: center; }
.centrado { text-align: center; }
.pagina-simple > a,
.volver { display: block; margin-top: 16px; text-align: center; }
.pagina-simple button { color: var(--blanco); background: var(--negro); border-color: var(--negro); border-radius: 999px; }
.pagina-simple button:hover { background: var(--negro-suave); }
.pagina-simple a { color: var(--negro); }
.pagina-simple .mensaje.advertencia { color: var(--negro); background: var(--amarillo-claro); border-color: #dcc04a; }
.pagina-simple .mensaje.exito { color: var(--exito); background: #edf9f1; border-color: #9bd1ae; }
.pagina-simple .mensaje.error,
.pagina-simple .error-ubicacion { color: var(--error); background: #fff0f1; border-color: #e8aeb3; }
.mapa-contenedor,
.pagina-simple .mapa-contenedor { margin: 26px 0 10px; padding: 18px; background: var(--blanco); border-color: rgba(0,0,0,.08); border-radius: var(--radio); text-align: center; }
.mapa-contenedor h3 { margin: 0 0 12px; }
#estado-mapa { margin: 10px 0; }
#mapa-ubicacion { display: none; width: 100%; height: 350px; margin-top: 15px; border: 0; border-radius: 18px; }
#datos-coordenadas { display: none; margin-top: 10px; color: var(--gris); font-size: .9rem; }
#enlace-google-maps { display: none; margin-top: 12px; }
.asistencia,
.pagina-simple .asistencia { margin-bottom: 18px; padding: 18px; background: var(--blanco); border-color: rgba(0,0,0,.08); border-radius: var(--radio); }
.asistencia iframe { width: 100%; height: 250px; margin-top: 12px; border: 0; border-radius: 18px; }

/* Administración */
.pagina-admin { width: 100%; max-width: none; padding: 26px 0 50px; overflow-x: hidden; color: var(--negro); background: var(--amarillo); font-family: "Inter Tight", Inter, Arial, sans-serif; }
.pagina-admin > h2,
.pagina-admin .panel > h3,
.pagina-admin .panel > h4 { text-align: center; }
.pagina-admin .cabecera-app { margin-bottom: 20px; }
.admin-salida { display: flex; justify-content: center; width: min(100% - 32px, 1100px); margin: -4px auto 24px; }
.pagina-admin .admin-salida button { min-height: 44px; padding: 10px 20px; }
.admin-login { width: min(100% - 32px, 540px); margin: 0 auto; padding: 28px; }
.admin-login form { display: grid; gap: 14px; }
.admin-login button { justify-self: center; }
.pagina-admin button { color: var(--blanco); background: var(--negro); border-color: var(--negro); border-radius: 999px; }
.pagina-admin button:hover,
.pagina-admin button:focus { background: var(--negro-suave); border-color: var(--negro-suave); }
.pagina-admin input,
.pagina-admin select,
.pagina-admin textarea { border-color: #b7b7b7; border-radius: 14px; }
.admin-navegacion {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: fit-content;
    max-width: calc(100% - 32px);
    margin: 0 auto 24px !important;
    text-align: center;
}
.admin-navegacion .boton-enlace { min-height: 44px; padding: 10px 18px; }
.pagina-admin .manual-box,
.pagina-admin .resumen-box { background: var(--blanco); border-color: rgba(0,0,0,.08); border-radius: var(--radio); }
.pagina-admin .manual-box .ayuda { color: var(--gris); }
.pagina-admin .filtros button,
.pagina-admin .acciones button,
.pagina-admin .manual-form button { color: var(--blanco); background: var(--negro); border-color: var(--negro); border-radius: 999px; }
.pagina-admin .filtros button:hover,
.pagina-admin .acciones button:hover,
.pagina-admin .manual-form button:hover,
.pagina-admin .manual-form button:focus { background: var(--negro-suave); border-color: var(--negro-suave); }
.pagina-admin .badge-cantidad { color: var(--blanco); background: var(--negro); }
.pagina-admin th { color: var(--blanco); background: var(--negro); }
.pagina-admin tr:nth-child(even) td { background: var(--gris-claro); }
.metricas-admin { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; width: min(95%, 1120px); margin: 20px auto; }
.metrica-admin { display: flex; min-height: 150px; flex-direction: column; align-items: center; justify-content: center; padding: 22px; background: var(--blanco); border: 1px solid rgba(0,0,0,.08); border-radius: var(--radio); box-shadow: var(--sombra); text-align: center; }
.metrica-admin strong { font-size: clamp(2.4rem, 6vw, 4.2rem); font-weight: 900; line-height: .95; }
.metrica-admin span { margin-top: 10px; font-size: 1.05rem; font-weight: 800; }
.metrica-admin small { margin-top: 5px; color: var(--gris); }
.metrica-en-linea strong { color: var(--exito); }
.actividad-admin { width: min(95%, 1120px); margin: 24px auto; }
.actividad-admin > h3 { margin: 0; text-align: center; }
.actividad-admin > p { margin: 6px 0 12px; text-align: center; }
.actividad-admin .tabla-scroll { width: 100%; }
.estado-usuario { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 999px; font-weight: 800; white-space: nowrap; }
.estado-usuario::before { width: 9px; height: 9px; border-radius: 50%; content: ""; }
.estado-usuario.en-linea { color: #155b36; background: #e7f7ed; }
.estado-usuario.en-linea::before { background: #1f9d55; }
.estado-usuario.fuera-linea { color: #555; background: #ededed; }
.estado-usuario.fuera-linea::before { background: #8a8a8a; }
.editor-usuario { width: min(95%, 680px); margin: 24px auto; padding: clamp(20px, 4vw, 34px); }
.editor-usuario h3 { margin-top: 0; text-align: center; }
.acciones-editor { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 18px; }
.acciones-fila { display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.acciones-fila form { margin: 0; }
.accion-editar { display: inline-flex; min-height: 38px; align-items: center; padding: 8px 13px; color: var(--negro); background: var(--amarillo); border-radius: 999px; text-decoration: none; }
.pagina-admin .accion-eliminar { min-height: 38px; padding: 8px 13px; color: #fff; background: #8a1c25; border-color: #8a1c25; font-size: .9rem; }
.pagina-admin .accion-eliminar:hover { background: #68131a; border-color: #68131a; }
.manual-box,
.resumen-box { width: min(95%, 1120px); margin: 20px auto; padding: 20px; }
.manual-box h3,
.resumen-box h3 { margin: 0 0 9px; text-align: center; }
.manual-box .ayuda { max-width: 900px; margin: 0 auto 15px; text-align: center; }
.manual-form { display: grid; gap: 12px; width: min(100%, 520px); margin: 0 auto; }
.manual-form button { justify-self: center; }
.filtros,
.acciones { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; width: min(95%, 1120px); margin: 12px auto; }
.filtros input { width: min(100%, 230px); }
.acciones input[type="file"] { width: min(100%, 430px); }
.filtros a { text-decoration: none; }
.filtros button,
.acciones button { min-height: 48px; padding: 11px 18px; }
.alert { width: min(95%, 1120px); }
.resumen-total { text-align: center; font-weight: 700; }
.badge-cantidad { display: inline-block; min-width: 36px; padding: 5px 9px; color: var(--blanco); background: var(--negro); border-radius: 999px; text-align: center; font-weight: 800; text-decoration: none; }
.tabla-titulo { margin: 30px auto 10px; text-align: center; }
.tabla-scroll { width: min(95%, 1120px); margin: 18px auto; overflow-x: auto; border: 1px solid var(--negro); border-radius: 18px; background: var(--blanco); box-shadow: 0 10px 25px rgba(0,0,0,.08); }
.resumen-box .tabla-scroll { width: 100%; margin-bottom: 0; }
table { width: 100%; min-width: 780px; border-collapse: collapse; }
th, td { padding: 11px 12px; border-bottom: 1px solid var(--borde); text-align: left; vertical-align: middle; }
th { color: var(--blanco); background: var(--negro); white-space: nowrap; }
tr:nth-child(even) td { background: var(--gris-claro); }
.map-link { display: inline-flex; align-items: center; gap: 6px; }
.map-pin { width: 18px; height: 18px; }
.map-cell { text-align: center; }
.muted { color: var(--gris); }

/* Motor y constructor de formularios */
.pagina-constructor > h2,
.pagina-dashboard > h2 { text-align: center; }
.constructor-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; width: min(95%, 1120px); margin: 20px auto; align-items: start; }
.constructor-layout-unico { grid-template-columns: minmax(0, 760px); justify-content: center; }
.constructor-editor,
.constructor-preguntas,
.lista-preguntas-admin,
.listado-formularios-admin,
.detalle-identificado,
.exportaciones-dashboard { padding: clamp(20px, 4vw, 32px); }
.constructor-editor h3,
.constructor-preguntas h3,
.lista-preguntas-admin > h3,
.listado-formularios-admin h3 { margin-top: 0; text-align: center; }
.constructor-editor,
.constructor-preguntas,
.listado-formularios-admin { text-align: center; }
.constructor-editor .formulario,
.constructor-preguntas .formulario,
.listado-formularios-admin table { text-align: left; }
.constructor-acciones { margin-top: 24px; }
.constructor-acciones form { margin: 0; }
.campos-numericos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.campos-numericos label { display: grid; gap: 6px; }
.lista-preguntas-admin,
.listado-formularios-admin { width: min(95%, 1120px); margin: 24px auto; }
.pregunta-admin-item { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 16px 0; border-bottom: 1px solid var(--borde); }
.pregunta-admin-item:last-child { border-bottom: 0; }
.pregunta-admin-item small { display: block; margin-top: 4px; }
.pregunta-admin-item p { margin: 6px 0 0; color: var(--gris); }
.titulo-con-accion { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; text-align: center; }
.titulo-con-accion h3 { margin: 0; }
.titulo-con-accion p { margin: 6px 0 0; }

/* Formulario que completa el usuario */
.contenedor-formulario { width: min(100% - 32px, 900px); }
.formulario-publico { text-align: left; }
.formulario-publico > h2,
.descripcion-formulario { text-align: center; }
.descripcion-formulario { max-width: 720px; margin: -8px auto 28px; line-height: 1.6; }
.formulario-dinamico {
    gap: 32px;
    max-width: 760px;
    font-family: "Inter Tight", Inter, Arial, sans-serif;
    font-size: 1rem;
}
.pregunta-formulario {
    display: block;
    margin: 0;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 0;
}
.pregunta-formulario legend {
    display: block;
    width: 100%;
    max-width: 100%;
    margin: 0 0 13px;
    padding: 0;
    font-family: inherit;
    font-size: 1.05rem;
    font-weight: 800;
    line-height: 1.4;
}
.pregunta-formulario .ayuda { margin: -5px 0 13px; font-size: .95rem; line-height: 1.45; }
.formulario-publico .pregunta-formulario input:not([type="checkbox"]):not([type="radio"]),
.formulario-publico .pregunta-formulario select,
.formulario-publico .pregunta-formulario textarea {
    min-height: 52px;
    padding: 13px 16px;
    font-family: "Inter Tight", Inter, Arial, sans-serif;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.4;
}
.formulario-publico .pregunta-formulario select option {
    font-family: "Inter Tight", Inter, Arial, sans-serif;
    font-size: 1rem;
    font-weight: 500;
}
.pregunta-formulario textarea { min-height: 125px; resize: vertical; }
.formulario-publico .pregunta-formulario .opcion {
    display: flex;
    min-height: 40px;
    align-items: center;
    gap: 12px;
    padding: 6px 0;
    font-family: "Inter Tight", Inter, Arial, sans-serif;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.4;
}
.formulario-publico .pregunta-formulario .opcion input[type="checkbox"],
.formulario-publico .pregunta-formulario .opcion input[type="radio"] {
    width: 22px;
    height: 22px;
    min-height: 22px;
    flex: 0 0 22px;
}
.pregunta-formulario > .opcion + input[type="text"],
.pregunta-formulario > select + input[type="text"] { margin-top: 12px; }
.formulario-publico .pregunta-formulario input:focus,
.formulario-publico .pregunta-formulario select:focus,
.formulario-publico .pregunta-formulario textarea:focus {
    border-color: var(--negro);
    outline: none;
    box-shadow: none;
}
.seccion-formulario { margin: 12px 0 0; padding: 18px 20px; color: var(--negro); background: var(--amarillo-claro); border-radius: 18px; }
.seccion-formulario h3 { margin: 0; }
.seccion-formulario p { margin: 8px 0 0; }
.estado-completado { display: inline-flex; margin: 8px 0 14px; padding: 7px 13px; color: var(--exito); background: #e7f7ed; border-radius: 999px; font-weight: 800; }
.formulario-item .estado-completado { margin-right: 10px; }

/* Dashboard de resultados */
.dashboard-aclaracion { width: min(95%, 820px); margin: -10px auto 24px; color: #3f3f3f; text-align: center; }
.sobrelinea-dashboard { display: block; margin-bottom: 5px; font-size: .78rem; font-weight: 900; letter-spacing: .11em; text-transform: uppercase; }
.filtros-dashboard { width: min(95%, 1120px); margin: 0 auto 18px; padding: clamp(22px, 4vw, 32px); }
.encabezado-filtros-dashboard { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin-bottom: 20px; text-align: left; }
.encabezado-filtros-dashboard h3 { margin: 0; font-size: clamp(1.25rem, 2.5vw, 1.65rem); text-align: left; }
.encabezado-filtros-dashboard p { margin: 5px 0 0; color: var(--gris); }
.campos-filtros-dashboard { display: grid; grid-template-columns: 1.35fr 1.15fr .85fr .85fr; gap: 12px; }
.campos-filtros-dashboard label { display: grid; gap: 7px; font-weight: 800; }
.campos-filtros-dashboard label small { color: var(--gris); font-weight: 500; }
.acciones-filtros-dashboard { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; gap: 12px; margin-top: 18px; }
.acciones-filtros-dashboard button { width: auto; min-width: 210px; }
.boton-secundario-dashboard { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; padding: 11px 20px; color: var(--negro); background: var(--blanco); border: 2px solid var(--negro); border-radius: 999px; font-weight: 800; text-decoration: none; }
.boton-secundario-dashboard:hover { color: var(--blanco); background: var(--negro); }
.contexto-dashboard { display: flex; align-items: center; justify-content: space-between; gap: 24px; width: min(95%, 1120px); margin: 18px auto; padding: 22px 26px; border-left: 8px solid var(--negro); }
.contexto-dashboard h3 { margin: 0; font-size: clamp(1.35rem, 3vw, 1.9rem); text-align: left; }
.contexto-dashboard p { margin: 5px 0 0; color: var(--gris); }
.etiquetas-contexto-dashboard { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.etiquetas-contexto-dashboard span { padding: 7px 11px; background: var(--amarillo-claro); border-radius: 999px; font-size: .86rem; font-weight: 800; white-space: nowrap; }
.metricas-dashboard { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.metricas-dashboard .metrica-admin { min-height: 158px; }
.metricas-dashboard .metrica-admin strong { font-size: clamp(2.4rem, 5vw, 3.8rem); }
.metricas-dashboard .metrica-admin small { text-align: center; }
.dashboard-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; width: min(95%, 1120px); margin: 24px auto; }
.grafico-panel,
.resultado-pregunta { padding: clamp(22px, 4vw, 30px); }
.grafico-panel h3,
.resultado-pregunta h4 { margin-top: 0; text-align: center; }
.explicacion-grafico-dashboard { max-width: 470px; margin: -8px auto 20px; color: var(--gris); font-size: .92rem; text-align: center; }
.barra-fila { display: grid; grid-template-columns: minmax(120px, 1.2fr) minmax(130px, 3fr) minmax(72px, auto); gap: 10px; align-items: center; margin: 12px 0; }
.barra-fila > span { overflow-wrap: anywhere; }
.barra-pista { height: 14px; overflow: hidden; background: #e6e6e6; border-radius: 999px; }
.barra-pista i { display: block; height: 100%; min-width: 0; background: var(--amarillo); border-radius: inherit; transition: width .25s ease; }
.barra-fila strong { text-align: right; }
.lectura-rapida-dashboard { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 18px 0 0; padding: 0; list-style: none; }
.lectura-rapida-dashboard li { display: flex; min-height: 112px; flex-direction: column; align-items: center; justify-content: center; padding: 15px 10px; background: var(--gris-claro); border-radius: 18px; text-align: center; }
.lectura-rapida-dashboard strong { font-size: 1.9rem; line-height: 1; }
.lectura-rapida-dashboard span { margin-top: 7px; color: var(--gris); font-size: .88rem; font-weight: 700; }
.estado-vacio-dashboard { margin: 18px 0 0; padding: 14px 16px; color: #4c4c4c; background: #f2f2f2; border-radius: 14px; text-align: center; }
.resultados-preguntas { width: min(95%, 1120px); margin: 28px auto; }
.encabezado-seccion-dashboard { margin-bottom: 18px; text-align: center; }
.encabezado-seccion-dashboard h3 { margin: 0; font-size: clamp(1.5rem, 3vw, 2rem); }
.encabezado-seccion-dashboard p { max-width: 700px; margin: 7px auto 0; color: #4a4a4a; }
.resultado-pregunta { margin-bottom: 18px; border-left: 7px solid var(--negro); }
.resultado-sin-datos { opacity: .75; border-left-color: #a8a8a8; }
.encabezado-pregunta-dashboard { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 14px; align-items: center; margin-bottom: 20px; }
.numero-pregunta-dashboard { display: inline-flex; width: 38px; height: 38px; align-items: center; justify-content: center; flex: 0 0 38px; color: var(--blanco); background: var(--negro); border-radius: 50%; font-size: 1.05rem; font-weight: 900; }
.tipo-pregunta-dashboard { display: block; margin-bottom: 4px; color: var(--gris); font-size: .78rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.resultado-pregunta .encabezado-pregunta-dashboard h4 { margin: 0; font-size: clamp(1.05rem, 2vw, 1.28rem); line-height: 1.25; text-align: left; }
.total-pregunta-dashboard { padding: 7px 11px; color: var(--negro); background: var(--amarillo-claro); border-radius: 999px; font-size: .86rem; white-space: nowrap; }
.resumen-numerico { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 12px 0; }
.resumen-numerico span { display: inline-flex; align-items: center; gap: 7px; padding: 10px 14px; background: var(--gris-claro); border-radius: 12px; }
.resumen-numerico .promedio-destacado-dashboard { background: var(--amarillo-claro); }
.barras-pregunta-dashboard { display: grid; gap: 2px; }
.barra-resultado-dashboard { grid-template-columns: minmax(180px, 1.4fr) minmax(180px, 3fr) minmax(92px, auto); padding: 8px 0; border-bottom: 1px solid #ececec; }
.barra-resultado-dashboard:last-child { border-bottom: 0; }
.barra-resultado-dashboard strong { display: flex; align-items: baseline; justify-content: flex-end; gap: 6px; }
.barra-resultado-dashboard strong b { font-size: 1.05rem; }
.barra-resultado-dashboard strong small { min-width: 52px; color: var(--gris); font-size: .82rem; text-align: right; }
.nota-dashboard { color: var(--gris); font-size: .85rem; text-align: center; }
.respuestas-abiertas-dashboard { margin-top: 18px; }
.respuestas-abiertas-dashboard summary { padding: 12px 15px; background: var(--amarillo-claro); border-radius: 12px; font-weight: 800; cursor: pointer; }
.respuestas-abiertas { display: grid; gap: 10px; padding-left: 20px; }
.respuestas-abiertas li { padding: 9px 12px; background: var(--gris-claro); border-radius: 10px; }
.llamada-seleccion-dashboard { display: flex; align-items: center; justify-content: center; gap: 18px; width: min(95%, 760px); margin: 28px auto; padding: 28px; }
.llamada-seleccion-dashboard h3 { margin: 0; text-align: left; }
.llamada-seleccion-dashboard p { margin: 6px 0 0; color: var(--gris); }
.exportaciones-dashboard,
.detalle-identificado { width: min(95%, 1120px); margin: 24px auto; }
.exportaciones-dashboard { text-align: center; }
.exportaciones-dashboard h3 { margin: 0; text-align: center; }
.exportaciones-dashboard > p { margin: 7px 0 18px; color: var(--gris); }
.acciones-dashboard { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.acciones-dashboard .accion-exportacion-dashboard { min-width: 260px; flex-direction: column; gap: 4px; }
.accion-exportacion-dashboard small { color: #e8e8e8; font-size: .78rem; font-weight: 500; }
.detalle-identificado .tabla-scroll,
.listado-formularios-admin .tabla-scroll { width: 100%; margin-bottom: 0; }

@media (max-width: 900px) {
    .campos-filtros-dashboard { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .contexto-dashboard { align-items: flex-start; flex-direction: column; }
    .etiquetas-contexto-dashboard { justify-content: flex-start; }
    .metricas-dashboard { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dashboard-grid { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
    .telefono-campos {
        grid-template-columns: minmax(90px, .75fr) minmax(0, 1.25fr);
        gap: 10px;
    }
    .contenedor,
    .pagina-simple { width: min(100% - 20px, 780px); padding: 20px 0 30px; }
    .cabecera-app { width: min(100% - 20px, 1100px); }
    .cabecera-app h1 { font-size: clamp(2.45rem, 16vw, 3.25rem); }
    .tarjeta { padding: 22px 16px; border-radius: 22px; }
    .acciones-usuario { flex-direction: column; }
    .acciones-usuario .boton-enlace,
    .acciones-usuario a { width: 100%; }
    .formulario button,
    .manual-form button,
    .filtros > *,
    .filtros a,
    .filtros button,
    .acciones > *,
    .acciones button { width: 100%; }
    .filtros input,
    .acciones input[type="file"] { width: 100%; }
    #mapa-ubicacion { height: 280px; }
    .metricas-admin { grid-template-columns: 1fr; }
    .metrica-admin { min-height: 125px; }
    .acciones-editor { flex-direction: column; }
    .acciones-editor > * { width: 100%; text-align: center; }
    .admin-navegacion { width: calc(100% - 20px); max-width: 1120px; }
    .admin-navegacion .boton-enlace { width: 100%; }
    .constructor-layout,
    .dashboard-grid { grid-template-columns: 1fr; width: min(100% - 20px, 1120px); }
    .campos-numericos { grid-template-columns: 1fr; }
    .pregunta-admin-item,
    .titulo-con-accion { align-items: stretch; flex-direction: column; }
    .filtros-dashboard { width: min(100% - 20px, 1120px); }
    .campos-filtros-dashboard { grid-template-columns: 1fr; }
    .acciones-filtros-dashboard { align-items: stretch; flex-direction: column; }
    .acciones-filtros-dashboard button,
    .acciones-filtros-dashboard .boton-secundario-dashboard { width: 100%; }
    .contexto-dashboard { width: min(100% - 20px, 1120px); }
    .metricas-dashboard { grid-template-columns: 1fr; }
    .lectura-rapida-dashboard { grid-template-columns: 1fr; }
    .barra-fila { grid-template-columns: minmax(0, 1fr) auto; gap: 7px 10px; }
    .barra-fila > span { grid-column: 1 / -1; font-weight: 700; }
    .barra-fila .barra-pista { grid-column: 1; }
    .barra-fila > strong { grid-column: 2; }
    .encabezado-pregunta-dashboard { grid-template-columns: auto minmax(0, 1fr); }
    .total-pregunta-dashboard { grid-column: 1 / -1; justify-self: start; margin-left: 52px; }
    .llamada-seleccion-dashboard { align-items: flex-start; width: min(100% - 20px, 760px); }
    .acciones-dashboard .boton-enlace { width: 100%; }
}


/* Estilos de admin_resultados_dashboard.php */
        body.pagina-dashboard-visual {
            --dv-fondo: #f2f5fa;
            --dv-superficie: #fff;
            --dv-suave: #f7f9fd;
            --dv-texto: #17213a;
            --dv-secundario: #68738a;
            --dv-borde: #e1e7f1;
            --dv-azul: #4f67e8;
            --dv-celeste: #18b5cb;
            --dv-violeta: #835fdf;
            --dv-coral: #ef7169;
            --dv-verde: #25aa79;
            --dv-amarillo: #e9ac25;
            min-height: 100vh;
            margin: 0;
            padding: 0 0 42px;
            color: var(--dv-texto);
            background: var(--dv-fondo);
            font-family: "Inter Tight", Inter, Arial, sans-serif;
        }
        .pagina-dashboard-visual * { box-sizing: border-box; }
        .dv-topbar { color: #fff; background: #16234a; }
        .dv-topbar-interior { display: flex; width: min(100% - 32px, 1320px); min-height: 68px; align-items: center; justify-content: space-between; gap: 20px; margin: 0 auto; }
        .dv-marca { display: flex; align-items: center; gap: 11px; color: #fff; font-size: 1.05rem; font-weight: 900; text-decoration: none; }
        .dv-marca-simbolo { display: grid; width: 38px; height: 38px; place-items: center; color: #16234a; background: #f5c440; border-radius: 11px; }
        .dv-navegacion { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 5px; }
        .dv-navegacion a { padding: 8px 11px; color: #cbd4ee; border-radius: 9px; font-size: .83rem; text-decoration: none; }
        .dv-navegacion a:hover, .dv-navegacion a[aria-current="page"] { color: #fff; background: rgba(255,255,255,.14); }
        .pagina-dashboard-visual .dv-cerrar { min-height: 38px; padding: 8px 13px; color: #fff; background: #5068d7; border: 0; border-radius: 999px; font-size: .78rem; }
        .dv-contenedor { width: min(100% - 32px, 1320px); margin: 0 auto; padding-top: 22px; }
        .dv-encabezado { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 16px; }
        .dv-encabezado h1 { margin: 0; color: var(--dv-texto); font-size: clamp(1.65rem, 3vw, 2.35rem); line-height: 1.05; letter-spacing: -.035em; }
        .dv-encabezado p { margin: 7px 0 0; color: var(--dv-secundario); }
        .dv-etiqueta { display: inline-flex; align-items: center; padding: 7px 11px; color: var(--dv-azul); background: #edf0ff; border-radius: 999px; font-size: .78rem; font-weight: 800; white-space: nowrap; }
        .dv-panel { min-width: 0; background: var(--dv-superficie); border: 1px solid var(--dv-borde); border-radius: 18px; box-shadow: 0 8px 26px rgba(31,47,85,.06); }
        .dv-filtros { display: grid; grid-template-columns: 1.45fr 1fr 1.35fr .82fr .82fr auto auto; gap: 10px; margin-bottom: 14px; padding: 14px; }
        .dv-campo { display: grid; min-width: 0; gap: 5px; color: var(--dv-secundario); font-size: .73rem; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; }
        .pagina-dashboard-visual .dv-campo select,
        .pagina-dashboard-visual .dv-campo input { width: 100%; min-height: 40px; padding: 8px 10px; color: var(--dv-texto); background: var(--dv-suave); border: 1px solid var(--dv-borde); border-radius: 10px; font-size: .86rem; font-weight: 600; letter-spacing: 0; text-transform: none; }
        .pagina-dashboard-visual .dv-aplicar,
        .dv-limpiar { align-self: end; display: inline-flex; min-height: 40px; align-items: center; justify-content: center; padding: 9px 14px; border-radius: 10px; font-size: .82rem; font-weight: 800; text-decoration: none; white-space: nowrap; }
        .pagina-dashboard-visual .dv-aplicar { color: #fff; background: var(--dv-azul); border: 1px solid var(--dv-azul); }
        .dv-limpiar { color: var(--dv-texto); background: var(--dv-superficie); border: 1px solid var(--dv-borde); }
        .dv-contexto { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; padding: 12px 16px; }
        .dv-contexto strong { font-size: 1rem; }
        .dv-contexto span { color: var(--dv-secundario); font-size: .82rem; }
        .dv-contexto-filtros { display: flex; flex-wrap: wrap; gap: 7px; }
        .dv-contexto-filtros i { padding: 6px 9px; color: #374361; background: var(--dv-suave); border-radius: 999px; font-size: .72rem; font-style: normal; font-weight: 700; }
        .dv-metricas { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 11px; margin-bottom: 14px; }
        .dv-metrica { display: flex; min-width: 0; align-items: center; gap: 12px; padding: 16px; }
        .dv-metrica-icono { display: grid; width: 42px; height: 42px; flex: 0 0 42px; place-items: center; border-radius: 12px; font-size: 1.05rem; font-weight: 900; }
        .dv-metrica:nth-child(1) .dv-metrica-icono { color: var(--dv-azul); background: #edf0ff; }
        .dv-metrica:nth-child(2) .dv-metrica-icono { color: var(--dv-celeste); background: #eafafd; }
        .dv-metrica:nth-child(3) .dv-metrica-icono { color: var(--dv-violeta); background: #f2edff; }
        .dv-metrica:nth-child(4) .dv-metrica-icono { color: var(--dv-coral); background: #fff0ef; }
        .dv-metrica strong { display: block; font-size: clamp(1.7rem, 3vw, 2.25rem); line-height: 1; letter-spacing: -.04em; }
        .dv-metrica span { display: block; margin-top: 5px; color: var(--dv-secundario); font-size: .8rem; font-weight: 700; }
        .dv-panel-cabecera { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin-bottom: 14px; }
        .dv-panel-cabecera h2, .dv-panel-cabecera h3 { margin: 0; color: var(--dv-texto); text-align: left; }
        .dv-panel-cabecera h2 { font-size: 1.25rem; }
        .dv-panel-cabecera h3 { font-size: 1.05rem; }
        .dv-panel-cabecera p { margin: 4px 0 0; color: var(--dv-secundario); font-size: .82rem; }
        .dv-formularios { padding: 18px; }
        .dv-lista-formularios { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
        .dv-formulario { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 15px; color: var(--dv-texto); background: var(--dv-suave); border: 1px solid transparent; border-radius: 13px; text-decoration: none; }
        .dv-formulario:hover { border-color: var(--dv-azul); }
        .dv-formulario strong { display: block; }
        .dv-formulario small { display: block; margin-top: 4px; color: var(--dv-secundario); }
        .dv-formulario-cantidad { min-width: 58px; text-align: right; }
        .dv-formulario-cantidad b { display: block; font-size: 1.45rem; line-height: 1; }
        .dv-formulario-cantidad span { color: var(--dv-secundario); font-size: .7rem; }
        .dv-resumen-grid { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(280px, .75fr); gap: 12px; margin-bottom: 16px; }
        .dv-destacados, .dv-funciones { padding: 18px; }
        .dv-lista-destacados { display: grid; gap: 11px; }
        .dv-destacado { display: grid; grid-template-columns: minmax(170px, 1.2fr) minmax(130px, 1.5fr) 86px; align-items: center; gap: 10px; }
        .dv-destacado-etiqueta strong, .dv-destacado-etiqueta span { display: block; }
        .dv-destacado-etiqueta strong { font-size: .86rem; }
        .dv-destacado-etiqueta span { margin-top: 2px; overflow: hidden; color: var(--dv-secundario); font-size: .72rem; text-overflow: ellipsis; white-space: nowrap; }
        .dv-pista { height: 9px; overflow: hidden; background: var(--dv-borde); border-radius: 999px; }
        .dv-pista i { display: block; height: 100%; background: var(--color-barra, var(--dv-azul)); border-radius: inherit; }
        .dv-destacado-valor { text-align: right; white-space: nowrap; }
        .dv-destacado-valor b { font-size: .95rem; }
        .dv-destacado-valor span { color: var(--dv-secundario); font-size: .76rem; }
        .dv-grid-funciones { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
        .dv-funcion { padding: 12px; background: var(--dv-suave); border-radius: 11px; }
        .dv-funcion i { display: block; width: 9px; height: 9px; margin-bottom: 8px; border-radius: 50%; }
        .dv-funcion strong { display: block; font-size: 1.45rem; line-height: 1; }
        .dv-funcion span { display: block; margin-top: 5px; color: var(--dv-secundario); font-size: .76rem; font-weight: 700; }
        .dv-nota { margin: 10px 0 0; color: var(--dv-secundario); font-size: .73rem; }
        .dv-seccion-cabecera { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; margin: 20px 0 11px; }
        .dv-seccion-cabecera h2 { margin: 0; font-size: 1.35rem; }
        .dv-seccion-cabecera p { margin: 4px 0 0; color: var(--dv-secundario); font-size: .82rem; }
        .dv-preguntas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
        .dv-pregunta { min-width: 0; padding: 17px; }
        .dv-pregunta-cabecera { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: start; gap: 10px; margin-bottom: 14px; }
        .dv-numero { display: grid; width: 31px; height: 31px; place-items: center; color: #fff; background: #16234a; border-radius: 9px; font-size: .76rem; font-weight: 900; }
        .dv-tipo { display: block; margin-bottom: 3px; color: var(--dv-secundario); font-size: .68rem; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; }
        .dv-pregunta h3 { margin: 0; font-size: .98rem; line-height: 1.3; text-align: left; }
        .dv-total-pregunta { color: var(--dv-secundario); font-size: .72rem; white-space: nowrap; }
        .dv-circular { display: grid; grid-template-columns: 132px minmax(0, 1fr); align-items: center; gap: 16px; }
        .dv-dona-contenedor { position: relative; display: grid; place-items: center; }
        .dv-dona { display: grid; width: 124px; height: 124px; place-items: center; border-radius: 50%; }
        .dv-dona::after { width: 78px; height: 78px; background: var(--dv-superficie); border-radius: 50%; content: ""; }
        .dv-dona-centro { position: absolute; text-align: center; }
        .dv-dona-centro strong { display: block; font-size: 1.35rem; line-height: 1; }
        .dv-dona-centro span { display: block; max-width: 76px; margin-top: 4px; overflow: hidden; color: var(--dv-secundario); font-size: .64rem; text-overflow: ellipsis; white-space: nowrap; }
        .dv-leyenda { display: grid; gap: 7px; }
        .dv-leyenda-fila { display: grid; grid-template-columns: 9px minmax(0, 1fr) auto; align-items: center; gap: 7px; font-size: .76rem; }
        .dv-leyenda-fila i { width: 9px; height: 9px; border-radius: 50%; }
        .dv-leyenda-fila span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
        .dv-leyenda-fila b { font-size: .75rem; white-space: nowrap; }
        .dv-barras { display: grid; gap: 8px; }
        .dv-barra { display: grid; grid-template-columns: minmax(125px, 1.2fr) minmax(120px, 1.5fr) 82px; align-items: center; gap: 9px; font-size: .78rem; }
        .dv-barra > span { overflow-wrap: anywhere; }
        .dv-barra b { font-size: .75rem; text-align: right; white-space: nowrap; }
        .dv-promedio { display: inline-flex; margin-bottom: 12px; padding: 8px 11px; color: var(--dv-violeta); background: #f2edff; border-radius: 10px; font-size: .8rem; font-weight: 800; }
        .dv-abierta { display: grid; grid-template-columns: 98px minmax(0, 1fr); align-items: center; gap: 14px; }
        .dv-abierta-total { display: grid; width: 88px; height: 88px; place-items: center; background: #fff0ef; border-radius: 50%; text-align: center; }
        .dv-abierta-total strong { display: block; font-size: 1.6rem; line-height: 1; }
        .dv-abierta-total span { display: block; margin-top: 4px; color: var(--dv-secundario); font-size: .68rem; }
        .dv-respuestas-abiertas summary, .dv-mas-opciones summary, .dv-detalle summary { color: var(--dv-azul); font-size: .78rem; font-weight: 800; cursor: pointer; }
        .dv-respuestas-abiertas ul { max-height: 320px; margin: 10px 0 0; padding-left: 20px; overflow-y: auto; }
        .dv-respuestas-abiertas li { margin-bottom: 8px; padding: 9px; background: var(--dv-suave); border-radius: 8px; font-size: .78rem; }
        .dv-sin-datos { padding: 18px; color: var(--dv-secundario); background: var(--dv-suave); border-radius: 12px; text-align: center; }
        .dv-herramientas { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; margin-top: 18px; padding: 16px 18px; }
        .dv-herramientas h2 { margin: 0; font-size: 1.05rem; }
        .dv-herramientas p { margin: 4px 0 0; color: var(--dv-secundario); font-size: .78rem; }
        .dv-acciones { display: flex; flex-wrap: wrap; gap: 8px; }
        .dv-accion { display: inline-flex; min-height: 38px; align-items: center; padding: 8px 12px; color: #fff; background: #16234a; border-radius: 9px; font-size: .76rem; font-weight: 800; text-decoration: none; }
        .dv-detalle { margin-top: 12px; padding: 16px 18px; }
        .dv-detalle > summary { color: var(--dv-texto); font-size: .95rem; }
        .dv-tabla { width: 100%; margin-top: 14px; overflow-x: auto; border: 1px solid var(--dv-borde); border-radius: 12px; }
        .dv-tabla table { min-width: 900px; }
        .dv-tabla th { background: #16234a; }
        .dv-tabla td { font-size: .78rem; }
        @media (max-width: 1100px) {
            .dv-filtros { grid-template-columns: repeat(3, minmax(0, 1fr)); }
            .dv-metricas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
        }
        @media (max-width: 820px) {
            .dv-topbar-interior { padding: 10px 0; }
            .dv-navegacion { display: none; }
            .dv-resumen-grid, .dv-preguntas, .dv-lista-formularios { grid-template-columns: 1fr; }
        }
        @media (max-width: 620px) {
            .dv-topbar-interior, .dv-contenedor { width: min(100% - 20px, 1320px); }
            .dv-marca span:last-child { display: none; }
            .dv-encabezado { align-items: flex-start; flex-direction: column; }
            .dv-filtros, .dv-metricas { grid-template-columns: 1fr; }
            .pagina-dashboard-visual .dv-aplicar, .dv-limpiar { width: 100%; }
            .dv-destacado, .dv-barra { grid-template-columns: minmax(0, 1fr) auto; }
            .dv-destacado-etiqueta, .dv-barra > span { grid-column: 1 / -1; }
            .dv-circular, .dv-abierta { grid-template-columns: 1fr; }
            .dv-grid-funciones { grid-template-columns: 1fr 1fr; }
            .dv-pregunta-cabecera { grid-template-columns: auto minmax(0, 1fr); }
            .dv-total-pregunta { grid-column: 2; }
        }


/* Estilos de admin_asistencias.php */
        :root {
            --input-font: inherit; /* Hereda la misma tipografía del body o del CSS externo */
            --input-size: 16px;
            --input-color: #333;
            --input-bg: #fff;
            --input-border: 1px solid #ccc;
            --input-radius: 8px;
            --input-pad: 10px 12px;
            --input-height: 40px;
        }

        body { font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }

        table {
            margin: 20px auto;
            width: 95%;
            border-collapse: collapse;
        }
        th, td {
            padding: 8px;
            border: 1px solid #ccc;
            text-align: left;
        }
        th {
            background-color: #007bff;
            color: white;
        }
        tr:nth-child(even) {
            background-color: #f8f8f8;
        }

        form.filtros, .acciones {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            gap: 10px;
            margin-bottom: 10px;
        }

        /* 🔧 Unificar estilo de TODOS los inputs (DNI y FECHA) */
        .filtros input {
            font-family: var(--input-font);
            font-size: var(--input-size);
            color: var(--input-color);
            background: var(--input-bg);
            border: var(--input-border);
            border-radius: var(--input-radius);
            padding: var(--input-pad);
            height: var(--input-height);
            line-height: calc(var(--input-height) - 2px);
            box-sizing: border-box;
        }

        /* Asegurar que el input de fecha use la MISMA tipografía/estilo que el de texto */
        .filtros input[type="date"] {
            appearance: none;
            -webkit-appearance: none;
            -moz-appearance: textfield;
            font-family: var(--input-font) !important;
            font-size: var(--input-size) !important;
            color: var(--input-color) !important;
        }

        /* Chrome/Edge/Opera: forzar que el “dd/mm/aa” herede la tipografía */
        .filtros input[type="date"]::-webkit-datetime-edit,
        .filtros input[type="date"]::-webkit-datetime-edit-fields-wrapper,
        .filtros input[type="date"]::-webkit-datetime-edit-text,
        .filtros input[type="date"]::-webkit-datetime-edit-month-field,
        .filtros input[type="date"]::-webkit-datetime-edit-day-field,
        .filtros input[type="date"]::-webkit-datetime-edit-year-field {
            font-family: var(--input-font);
            font-size: var(--input-size);
            color: var(--input-color);
        }

        .filtros input[type="date"]::-webkit-calendar-picker-indicator {
            cursor: pointer;
            opacity: 0.75;
        }

        .filtros input[type="date"]::-moz-focus-inner { border: 0; }
        .filtros input[type="date"]::-moz-placeholder { font-family: var(--input-font); font-size: var(--input-size); color: var(--input-color); }

        /* Botones */
        .filtros button,
        .acciones button {
            height: var(--input-height);
            padding: 0 12px;
            border-radius: var(--input-radius);
            border: 1px solid #007bff;
            background: #007bff;
            color: #fff;
            cursor: pointer;
        }
        .filtros a button { cursor: pointer; }

        .pagina-admin .accion-habilitar {
            min-height: 38px;
            padding: 8px 13px;
            border: 0;
            border-radius: 999px;
            color: #fff;
            background: #176b3a;
            cursor: pointer;
            font-size: .9rem;
        }
        .estado-cuenta-editor {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            justify-content: space-between;
            gap: 14px;
            padding: 15px 17px;
            border: 1px solid #d8dde3;
            border-radius: 14px;
            background: #f7f8fa;
        }
        .estado-cuenta-editor p {
            margin: 0;
        }
        .estado-cuenta-editor small {
            display: block;
            margin-top: 4px;
            color: #59616b;
        }
        .pagina-admin .accion-bloquear,
        .pagina-admin .accion-desbloquear {
            min-height: 40px;
            padding: 9px 15px;
            border-radius: 999px;
            color: #fff;
            cursor: pointer;
        }
        .pagina-admin .accion-bloquear {
            border: 1px solid #9b2630;
            background: #9b2630;
        }
        .pagina-admin .accion-bloquear:hover,
        .pagina-admin .accion-bloquear:focus {
            border-color: #731922;
            background: #731922;
        }
        .pagina-admin .accion-desbloquear {
            border: 1px solid #176b3a;
            background: #176b3a;
        }
        .pagina-admin .accion-desbloquear:hover,
        .pagina-admin .accion-desbloquear:focus {
            border-color: #0f4d29;
            background: #0f4d29;
        }

        /* En todo el administrador, los textos sólo pueden pasar de línea
           entre palabras: nunca se cortan letras dentro de una palabra. */
        .pagina-admin,
        .pagina-admin * {
            word-break: normal;
            overflow-wrap: normal;
            hyphens: none;
        }

        /* La tabla de usuarios aprovecha el ancho disponible y, en pantallas
           angostas, se transforma en tarjetas sin desplazamiento horizontal. */
        .actividad-admin {
            width: min(calc(100% - 24px), 1500px);
        }
        .actividad-admin .tabla-scroll {
            overflow: hidden;
            border: 0;
            border-radius: 18px;
        }
        .actividad-admin table {
            width: 100%;
            min-width: 0;
            margin: 0;
        }
        .actividad-admin th,
        .actividad-admin td {
            word-break: normal;
            overflow-wrap: normal;
            hyphens: none;
        }
        .actividad-usuarios-tabla .fecha-hora,
        .actividad-usuarios-tabla .telefono-linea {
            display: inline-block;
            white-space: nowrap;
        }
        .actividad-usuarios-tabla th:nth-child(9),
        .actividad-usuarios-tabla td:nth-child(9) {
            min-width: 100px;
            white-space: nowrap;
        }
        .actividad-usuarios-tabla .columna-seleccion {
            width: 86px;
            text-align: center;
        }
        .actividad-usuarios-tabla .selector-usuario {
            width: 22px;
            height: 22px;
            min-height: 22px;
            margin: 0;
            accent-color: #000;
        }
        .actividad-usuarios-tabla .correo-usuario {
            display: block;
            margin-top: 4px;
            color: #686868;
            font-weight: 500;
        }
        .actividad-admin .acciones-fila {
            flex-wrap: wrap;
            white-space: normal;
        }

        /* En computadora las doce columnas se distribuyen dentro del panel,
           sin barras de desplazamiento horizontales ni verticales. */
        @media (min-width: 901px) {
            #usuarios-registrados .tabla-scroll {
                width: 100%;
                max-width: 100%;
                max-height: none;
                overflow: visible;
            }
            #usuarios-registrados .actividad-usuarios-tabla {
                width: 100%;
                min-width: 0;
                table-layout: fixed;
            }
            #usuarios-registrados .actividad-usuarios-tabla th,
            #usuarios-registrados .actividad-usuarios-tabla td {
                padding: 9px 6px;
                font-size: .82rem;
            }
            #usuarios-registrados .actividad-usuarios-tabla th {
                white-space: normal;
                line-height: 1.1;
            }
            #usuarios-registrados .actividad-usuarios-tabla th:nth-child(1),
            #usuarios-registrados .actividad-usuarios-tabla td:nth-child(1) { width: 4%; }
            #usuarios-registrados .actividad-usuarios-tabla th:nth-child(2),
            #usuarios-registrados .actividad-usuarios-tabla td:nth-child(2) { width: 17%; }
            #usuarios-registrados .actividad-usuarios-tabla th:nth-child(3),
            #usuarios-registrados .actividad-usuarios-tabla td:nth-child(3) { width: 7%; }
            #usuarios-registrados .actividad-usuarios-tabla th:nth-child(4),
            #usuarios-registrados .actividad-usuarios-tabla td:nth-child(4) { width: 8.5%; }
            #usuarios-registrados .actividad-usuarios-tabla th:nth-child(5),
            #usuarios-registrados .actividad-usuarios-tabla td:nth-child(5) { width: 5%; text-align: center; }
            #usuarios-registrados .actividad-usuarios-tabla th:nth-child(6),
            #usuarios-registrados .actividad-usuarios-tabla td:nth-child(6) { width: 8%; }
            #usuarios-registrados .actividad-usuarios-tabla th:nth-child(7),
            #usuarios-registrados .actividad-usuarios-tabla td:nth-child(7) { width: 9%; }
            #usuarios-registrados .actividad-usuarios-tabla th:nth-child(8),
            #usuarios-registrados .actividad-usuarios-tabla td:nth-child(8) { width: 10.5%; }
            #usuarios-registrados .actividad-usuarios-tabla th:nth-child(9),
            #usuarios-registrados .actividad-usuarios-tabla td:nth-child(9) { width: 8%; min-width: 0; }
            #usuarios-registrados .actividad-usuarios-tabla th:nth-child(10),
            #usuarios-registrados .actividad-usuarios-tabla td:nth-child(10) { width: 7%; text-align: center; }
            #usuarios-registrados .actividad-usuarios-tabla th:nth-child(11),
            #usuarios-registrados .actividad-usuarios-tabla td:nth-child(11) { width: 8%; }
            #usuarios-registrados .actividad-usuarios-tabla th:nth-child(12),
            #usuarios-registrados .actividad-usuarios-tabla td:nth-child(12) { width: 7.5%; }
            #usuarios-registrados .actividad-usuarios-tabla .correo-usuario {
                overflow-wrap: anywhere;
            }
            #usuarios-registrados .actividad-usuarios-tabla .acciones-fila,
            #usuarios-registrados .actividad-usuarios-tabla .acciones-fila form,
            #usuarios-registrados .actividad-usuarios-tabla .acciones-fila a,
            #usuarios-registrados .actividad-usuarios-tabla .acciones-fila button {
                width: 100%;
            }
            #usuarios-registrados .actividad-usuarios-tabla .acciones-fila a,
            #usuarios-registrados .actividad-usuarios-tabla .acciones-fila button {
                justify-content: center;
                padding-right: 6px;
                padding-left: 6px;
                text-align: center;
            }
        }
        .actividad-admin-cabecera {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 16px;
            margin-bottom: 12px;
            text-align: center;
        }
        .actividad-admin-cabecera h3,
        .actividad-admin-cabecera p {
            margin: 0;
        }
        .actividad-admin-cabecera p {
            margin-top: 5px;
        }
        .boton-mostrar-usuarios {
            flex: 0 0 auto;
            min-height: 42px;
            padding: 9px 15px;
            border: 1px solid #007bff;
            border-radius: 8px;
            background: #007bff;
            color: #fff;
            font-weight: 700;
            cursor: pointer;
        }
        .boton-mostrar-usuarios:hover,
        .boton-mostrar-usuarios:focus {
            background: #0069d9;
            border-color: #0062cc;
        }
        .filtro-usuarios-funcion {
            display: flex;
            flex-wrap: wrap;
            align-items: flex-end;
            justify-content: center;
            gap: 10px;
            margin: 0 0 16px;
            padding: 14px;
            border: 1px solid #cfe2ff;
            border-radius: 10px;
            background: #f4f8ff;
        }
        .filtro-usuarios-funcion label {
            display: flex;
            flex-direction: column;
            gap: 5px;
            min-width: min(100%, 260px);
            font-weight: 700;
        }
        .filtro-usuarios-funcion select,
        .filtro-usuarios-funcion input[type="search"] {
            min-height: 42px;
            padding: 8px 10px;
            border: 1px solid #b8c7dc;
            border-radius: 7px;
            background: #fff;
            font: inherit;
        }
        .filtro-usuarios-funcion .limpiar-filtros-usuarios {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-height: 42px;
            padding: 8px 15px;
            border: 1px solid #6c757d;
            border-radius: 7px;
            color: #343a40;
            background: #fff;
            text-decoration: none;
        }
        .filtro-usuarios-funcion button {
            min-height: 42px;
            padding: 8px 15px;
            border: 1px solid #007bff;
            border-radius: 7px;
            background: #007bff;
            color: #fff;
            font-weight: 700;
            cursor: pointer;
        }
        .resultado-busqueda-usuarios {
            width: 100%;
            margin: 0;
            color: #4d5866;
            text-align: center;
        }
        .cuenta-estado {
            display: inline-flex;
            align-items: center;
            min-height: 28px;
            padding: 4px 9px;
            border-radius: 999px;
            font-size: .84rem;
            font-weight: 800;
        }
        .cuenta-estado.habilitada { color: #145a32; background: #dff4e7; }
        .cuenta-estado.pendiente { color: #76520b; background: #fff0c7; }
        .cuenta-estado.bloqueada { color: #7b241c; background: #fde0e3; }

        /* En computadoras, las cuatro métricas ocupan una única fila. */
        @media (min-width: 901px) {
            .pagina-admin .metricas-admin {
                grid-template-columns: repeat(4, minmax(0, 1fr));
                width: min(calc(100% - 24px), 1500px);
            }
            .pagina-admin .metrica-admin {
                min-width: 0;
                padding-inline: 16px;
            }
            .pagina-admin .metrica-admin strong {
                font-size: clamp(2.4rem, 4vw, 3.8rem);
            }
        }

        /* En tablet se conservan tarjetas amplias en dos columnas. */
        @media (min-width: 641px) and (max-width: 900px) {
            .pagina-admin .metricas-admin {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
        }
        #usuarios-registrados-contenido[hidden] {
            display: none !important;
        }
        .notificaciones-admin {
            width: min(95%, 1120px);
            margin: 24px auto;
            padding: clamp(18px, 3vw, 28px);
            border: 1px solid #cfd8ee;
            border-radius: 18px;
            background: #f7f9ff;
        }
        .notificaciones-admin-cabecera {
            margin-bottom: 16px;
            text-align: center;
        }
        .notificaciones-admin-cabecera h4 {
            margin: 0;
            font-size: 1.25rem;
        }
        .notificaciones-admin-cabecera p {
            max-width: 760px;
            margin: 6px auto 0;
            color: #5f6675;
        }
        .seccion-desplegable-admin {
            overflow: hidden;
        }
        .editor-usuario.seccion-desplegable-admin,
        .notificaciones-admin.seccion-desplegable-admin {
            padding: 0;
        }
        .seccion-desplegable-admin > summary {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            gap: 4px 18px;
            align-items: center;
            padding: clamp(18px, 3vw, 24px);
            color: #17213a;
            background: #fff;
            cursor: pointer;
            list-style: none;
        }
        .seccion-desplegable-admin > summary::-webkit-details-marker {
            display: none;
        }
        .seccion-desplegable-admin > summary > span {
            font-size: 1.2rem;
            font-weight: 900;
            line-height: 1.2;
        }
        .seccion-desplegable-admin > summary > small {
            grid-column: 1;
            color: #5f6675;
            font-size: .92rem;
        }
        .seccion-desplegable-admin > summary::after {
            grid-column: 2;
            grid-row: 1 / span 2;
            min-width: 82px;
            padding: 8px 12px;
            color: #fff;
            background: #5068d7;
            border-radius: 10px;
            content: "Mostrar";
            font-size: .82rem;
            font-weight: 800;
            text-align: center;
        }
        .seccion-desplegable-admin[open] > summary {
            border-bottom: 1px solid #dfe5f0;
        }
        .seccion-desplegable-admin[open] > summary::after {
            content: "Ocultar";
        }
        .seccion-desplegable-admin > summary:hover,
        .seccion-desplegable-admin > summary:focus-visible {
            background: #f6f8fc;
        }
        .seccion-desplegable-contenido {
            padding: clamp(18px, 3vw, 28px);
        }
        .editor-usuario .seccion-desplegable-contenido > p {
            margin-top: 0;
            text-align: center;
        }
        .notificaciones-admin.seccion-desplegable-admin > summary {
            background: #f7f9ff;
        }
        .notificacion-formulario {
            display: grid;
            grid-template-columns: minmax(240px, .9fr) minmax(320px, 1.5fr);
            gap: 16px 20px;
            max-width: 1040px;
            margin: 0 auto;
        }
        .notificacion-formulario fieldset {
            grid-row: span 2;
            margin: 0;
            padding: 15px;
            background: #fff;
        }
        .notificacion-formulario > label {
            display: grid;
            gap: 6px;
            font-weight: 800;
        }
        .campo-editor-correo {
            display: grid;
            min-width: 0;
            gap: 6px;
        }
        .etiqueta-editor-correo {
            font-weight: 800;
        }
        .barra-editor-correo {
            display: flex;
            flex-wrap: wrap;
            gap: 6px;
            padding: 8px;
            background: #eef2f9;
            border: 1px solid #b8c7dc;
            border-bottom: 0;
            border-radius: 11px 11px 0 0;
        }
        .pagina-admin-dashboard .barra-editor-correo button {
            width: auto;
            min-height: 34px;
            padding: 6px 10px;
            color: #17213a;
            background: #fff;
            border: 1px solid #c9d3e4;
            border-radius: 7px;
            font-size: .82rem;
            font-weight: 700;
        }
        .pagina-admin-dashboard .barra-editor-correo button:hover,
        .pagina-admin-dashboard .barra-editor-correo button:focus {
            color: #fff;
            background: #4f67e8;
            border-color: #4f67e8;
        }
        .editor-correo-contenido {
            min-height: 165px;
            max-height: 420px;
            padding: 13px 15px;
            overflow-y: auto;
            color: #17213a;
            background: #fff;
            border: 1px solid #b8c7dc;
            border-radius: 0 0 11px 11px;
            font-size: 1rem;
            font-weight: 500;
            line-height: 1.55;
            outline: none;
        }
        .editor-correo-contenido:focus {
            border-color: #4f67e8;
            box-shadow: 0 0 0 3px rgba(79, 103, 232, .16);
        }
        .editor-correo-contenido:empty::before {
            color: #7b8496;
            content: attr(data-placeholder);
            pointer-events: none;
        }
        .editor-correo-contenido p {
            margin: 0 0 .8em;
        }
        .editor-correo-contenido p:last-child {
            margin-bottom: 0;
        }
        .editor-correo-contenido a {
            color: #4058d2;
            text-decoration: underline;
        }
        .campo-editor-correo > small {
            color: #68738a;
            font-size: .8rem;
            font-weight: 500;
        }
        .notificacion-formulario input[type="text"],
        .notificacion-formulario textarea {
            width: 100%;
            border-color: #b8c7dc;
            background: #fff;
        }
        .notificacion-formulario textarea {
            min-height: 150px;
            resize: vertical;
        }
        .notificacion-formulario .opcion-notificacion {
            display: flex;
            align-items: flex-start;
            gap: 10px;
            padding: 8px 0;
            font-weight: 700;
        }
        .notificacion-formulario .opcion-notificacion input {
            width: 20px;
            height: 20px;
            min-height: 20px;
            margin: 1px 0 0;
            accent-color: #000;
        }
        .notificacion-formulario .opcion-notificacion small {
            display: block;
            margin-top: 3px;
            font-weight: 500;
        }
        .acciones-notificacion {
            display: flex;
            grid-column: 1 / -1;
            flex-wrap: wrap;
            align-items: center;
            justify-content: center;
            gap: 10px;
        }
        .acciones-notificacion button {
            min-height: 42px;
            padding: 9px 15px;
        }
        .acciones-notificacion .accion-seleccion {
            color: #000;
            background: #fff;
            border: 1px solid #000;
            border-radius: 999px;
        }
        .acciones-notificacion .accion-seleccion:hover,
        .acciones-notificacion .accion-seleccion:focus {
            color: #fff;
            background: #000;
        }
        .contador-seleccionados {
            min-width: 140px;
            color: #4f596f;
            font-size: .9rem;
            font-weight: 800;
            text-align: center;
        }
        .notificacion-remitente {
            grid-column: 1 / -1;
            margin: 0;
            color: #5f6675;
            font-size: .88rem;
            text-align: center;
        }

        @media (max-width: 900px) {
            .actividad-admin-cabecera {
                align-items: stretch;
                flex-direction: column;
            }
            .boton-mostrar-usuarios {
                width: 100%;
            }
            .filtro-usuarios-funcion,
            .filtro-usuarios-funcion label,
            .filtro-usuarios-funcion select,
            .filtro-usuarios-funcion input[type="search"],
            .filtro-usuarios-funcion button,
            .filtro-usuarios-funcion .limpiar-filtros-usuarios {
                width: 100%;
            }
            .notificacion-formulario {
                grid-template-columns: 1fr;
            }
            .notificacion-formulario fieldset {
                grid-row: auto;
            }
            .barra-editor-correo button {
                flex: 1 1 auto;
            }
            .acciones-notificacion,
            .notificacion-remitente {
                grid-column: 1;
            }
            .actividad-admin .tabla-scroll {
                overflow: visible;
                border: 0;
                border-radius: 0;
                background: transparent;
                box-shadow: none;
            }
            .actividad-usuarios-tabla,
            .actividad-usuarios-tabla tbody,
            .actividad-usuarios-tabla tr,
            .actividad-usuarios-tabla td {
                display: block;
                width: 100%;
                min-width: 0;
            }
            .actividad-usuarios-tabla thead {
                position: absolute;
                width: 1px;
                height: 1px;
                overflow: hidden;
                clip: rect(0 0 0 0);
                white-space: nowrap;
                clip-path: inset(50%);
            }
            .actividad-usuarios-tabla tbody tr {
                margin-bottom: 16px;
                overflow: hidden;
                border: 1px solid #b7b7b7;
                border-radius: 16px;
                background: #fff;
                box-shadow: 0 7px 18px rgba(0, 0, 0, .09);
            }
            .actividad-usuarios-tabla tbody td,
            .actividad-usuarios-tabla tbody tr:nth-child(even) td {
                display: grid;
                grid-template-columns: minmax(120px, .75fr) minmax(0, 1fr);
                gap: 12px;
                align-items: center;
                padding: 11px 14px;
                border-bottom: 1px solid #dedede;
                background: #fff;
            }
            .actividad-usuarios-tabla tbody td:last-child {
                border-bottom: 0;
            }
            .actividad-usuarios-tabla td::before {
                content: attr(data-label);
                font-weight: 800;
            }
            .actividad-usuarios-tabla td.celda-acciones {
                display: block;
            }
            .actividad-usuarios-tabla td.celda-acciones::before {
                display: block;
                margin-bottom: 10px;
            }
            .actividad-usuarios-tabla .acciones-fila {
                gap: 8px;
            }
        }

        @media (max-width: 480px) {
            .actividad-admin {
                width: calc(100% - 20px);
            }
            .actividad-usuarios-tabla tbody td,
            .actividad-usuarios-tabla tbody tr:nth-child(even) td {
                grid-template-columns: 1fr;
                gap: 5px;
            }
            .actividad-usuarios-tabla .acciones-fila,
            .actividad-usuarios-tabla .acciones-fila form,
            .actividad-usuarios-tabla .acciones-fila a,
            .actividad-usuarios-tabla .acciones-fila button {
                width: 100%;
            }
            .actividad-usuarios-tabla .acciones-fila a,
            .actividad-usuarios-tabla .acciones-fila button {
                justify-content: center;
                text-align: center;
            }
        }

        .map-link {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            text-decoration: none;
            font-weight: 600;
        }
        .map-pin {
            width: 18px;
            height: 18px;
            display: inline-block;
        }
        .map-cell { text-align: center; }
        .muted { color: #777; }
        .alert {
            width: 95%;
            margin: 10px auto;
            padding: 10px 12px;
            border-radius: 6px;
        }
        .alert.ok {
            background: #e7f7ed;
            border: 1px solid #2ecc71;
            color: #145a32;
        }
        .alert.err {
            background: #fdecea;
            border: 1px solid #e74c3c;
            color: #7b241c;
        }
        .resumen-box {
            width: 95%;
            margin: 20px auto 10px auto;
            padding: 14px;
            background: #f4f8ff;
            border: 1px solid #cfe2ff;
            border-radius: 10px;
        }
        .resumen-box h3 {
            margin: 0 0 8px 0;
            text-align: center;
        }
        .resumen-total {
            text-align: center;
            font-weight: 700;
            margin-bottom: 10px;
        }
        .badge-cantidad {
            display: inline-block;
            min-width: 34px;
            padding: 4px 8px;
            border-radius: 999px;
            background: #007bff;
            color: #fff;
            text-align: center;
            font-weight: 700;
        }
        .manual-box {
            width: 95%;
            margin: 20px auto;
            padding: 16px;
            box-sizing: border-box;
            /* Mismo fondo y borde azul suave que el resto de los paneles. */
            background: #f4f8ff;
            border: 1px solid #cfe2ff;
            border-radius: 10px;
        }
        .manual-box h3 {
            margin: 0 0 8px 0;
            text-align: center;
        }
        .manual-box .ayuda {
            max-width: 900px;
            margin: 0 auto 14px auto;
            text-align: center;
            color: #666;
        }
        .manual-form {
            display: flex;
            flex-direction: column;
            align-items: stretch;
            gap: 10px;
            width: min(100%, 420px);
            margin: 0 auto;
        }
        .manual-field {
            display: flex;
            flex-direction: column;
            gap: 5px;
            width: 100%;
            min-width: 0;
        }
        .manual-field.alumno {
            width: 100%;
            min-width: 0;
        }
        .manual-field label {
            font-size: 14px;
            font-weight: 700;
            text-align: left;
        }
        .manual-field select,
        .manual-field input {
            width: 100%;
            min-height: var(--input-height);
            box-sizing: border-box;
            font-family: var(--input-font);
            font-size: var(--input-size);
            color: var(--input-color);
            background: var(--input-bg);
            border: var(--input-border);
            border-radius: var(--input-radius);
            padding: var(--input-pad);
        }
        .manual-form button {
            align-self: center;
            min-height: var(--input-height);
            padding: 0 16px;
            border-radius: var(--input-radius);
            border: 1px solid #007bff;
            background: #007bff;
            color: #fff;
            font-weight: 700;
            cursor: pointer;
        }
        .manual-form button:hover,
        .manual-form button:focus {
            background: #0069d9;
            border-color: #0062cc;
        }
        @media (max-width: 640px) {
            .manual-form {
                width: 100%;
            }

            .manual-form button {
                width: 100%;
            }
        }

/* Identidad visual compartida por todas las pantallas administrativas */
body.pagina-admin-dashboard {
    --dv-fondo: #f2f5fa;
    --dv-superficie: #fff;
    --dv-suave: #f7f9fd;
    --dv-texto: #17213a;
    --dv-secundario: #68738a;
    --dv-borde: #e1e7f1;
    --dv-azul: #4f67e8;
    --dv-celeste: #18b5cb;
    --dv-violeta: #835fdf;
    --dv-coral: #ef7169;
    --dv-verde: #25aa79;
    --dv-amarillo: #e9ac25;
    min-height: 100vh;
    margin: 0;
    padding: 0 0 42px;
    color: var(--dv-texto);
    background: var(--dv-fondo);
    font-family: "Inter Tight", Inter, Arial, sans-serif;
}

.pagina-admin-dashboard * { box-sizing: border-box; }
.pagina-admin-dashboard .pagina-admin-contenido { padding-top: 22px; }
.pagina-admin-dashboard .dv-encabezado { margin-bottom: 18px; }
.pagina-admin-dashboard .dv-encabezado h1 { text-align: left; }

.pagina-admin-dashboard .panel,
.pagina-admin-dashboard .manual-box,
.pagina-admin-dashboard .resumen-box,
.pagina-admin-dashboard .metrica-admin,
.pagina-admin-dashboard .actividad-admin,
.pagina-admin-dashboard .tabla-scroll {
    background: var(--dv-superficie);
    border-color: var(--dv-borde);
    border-radius: 18px;
    box-shadow: 0 8px 26px rgba(31, 47, 85, .06);
}

.pagina-admin-dashboard .alert,
.pagina-admin-dashboard .metricas-admin,
.pagina-admin-dashboard .actividad-admin,
.pagina-admin-dashboard .constructor-layout,
.pagina-admin-dashboard .lista-preguntas-admin,
.pagina-admin-dashboard .listado-formularios-admin,
.pagina-admin-dashboard .filtros-dashboard,
.pagina-admin-dashboard .contexto-dashboard,
.pagina-admin-dashboard .dashboard-grid,
.pagina-admin-dashboard .resultados-preguntas,
.pagina-admin-dashboard .exportaciones-dashboard,
.pagina-admin-dashboard .detalle-identificado,
.pagina-admin-dashboard .manual-box,
.pagina-admin-dashboard .resumen-box,
.pagina-admin-dashboard .filtros,
.pagina-admin-dashboard .acciones {
    width: 100%;
}

.pagina-admin-dashboard .metricas-admin {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 11px;
    margin: 0 0 14px;
}

.pagina-admin-dashboard .metrica-admin {
    min-height: 125px;
    align-items: flex-start;
    padding: 18px;
    text-align: left;
}

.pagina-admin-dashboard .metrica-admin strong {
    color: var(--dv-texto);
    font-size: clamp(1.9rem, 3vw, 2.55rem);
}

.pagina-admin-dashboard .metrica-admin span {
    color: var(--dv-secundario);
    font-size: .86rem;
}

.pagina-admin-dashboard .metrica-admin small { color: var(--dv-secundario); }
.pagina-admin-dashboard .metrica-en-linea strong { color: var(--dv-verde); }

.pagina-admin-dashboard .actividad-admin {
    margin: 18px 0;
    padding: 18px;
}

.pagina-admin-dashboard .constructor-layout,
.pagina-admin-dashboard .dashboard-grid { margin: 0 0 18px; }
.pagina-admin-dashboard .lista-preguntas-admin,
.pagina-admin-dashboard .listado-formularios-admin,
.pagina-admin-dashboard .resultados-preguntas,
.pagina-admin-dashboard .exportaciones-dashboard,
.pagina-admin-dashboard .detalle-identificado { margin: 18px 0; }

.pagina-admin-dashboard input,
.pagina-admin-dashboard select,
.pagina-admin-dashboard textarea {
    color: var(--dv-texto);
    background: var(--dv-suave);
    border: 1px solid var(--dv-borde);
    border-radius: 10px;
}

.pagina-admin-dashboard button,
.pagina-admin-dashboard .boton-enlace {
    color: #fff;
    background: var(--dv-azul);
    border-color: var(--dv-azul);
    border-radius: 10px;
}

.pagina-admin-dashboard button:hover,
.pagina-admin-dashboard button:focus,
.pagina-admin-dashboard .boton-enlace:hover {
    color: #fff;
    background: #3f57d0;
    border-color: #3f57d0;
}

.pagina-admin-dashboard .dv-cerrar,
.pagina-admin-dashboard .dv-cerrar:hover,
.pagina-admin-dashboard .dv-cerrar:focus {
    min-height: 38px;
    padding: 8px 13px;
    color: #fff;
    background: #5068d7;
    border: 0;
    border-radius: 999px;
    font-size: .78rem;
}

.pagina-admin-dashboard .accion-editar,
.pagina-admin-dashboard .boton-secundario-dashboard,
.pagina-admin-dashboard .limpiar-filtros-usuarios,
.pagina-admin-dashboard .accion-seleccion {
    color: var(--dv-azul);
    background: #edf0ff;
    border-color: #d9dffe;
    border-radius: 10px;
}

.pagina-admin-dashboard .accion-editar:hover,
.pagina-admin-dashboard .boton-secundario-dashboard:hover,
.pagina-admin-dashboard .limpiar-filtros-usuarios:hover,
.pagina-admin-dashboard .accion-seleccion:hover {
    color: #fff;
    background: var(--dv-azul);
}

.pagina-admin-dashboard .tabla-scroll {
    width: 100%;
    margin: 14px 0 0;
    overflow-x: auto;
}

.pagina-admin-dashboard table { width: 100%; margin: 0; }
.pagina-admin-dashboard th { color: #fff; background: #16234a; }
.pagina-admin-dashboard td { border-color: var(--dv-borde); }
.pagina-admin-dashboard tr:nth-child(even) td { background: var(--dv-suave); }

.pagina-admin-dashboard .contexto-dashboard { border-left-color: var(--dv-azul); }
.pagina-admin-dashboard .etiquetas-contexto-dashboard span,
.pagina-admin-dashboard .total-pregunta-dashboard,
.pagina-admin-dashboard .respuestas-abiertas-dashboard summary {
    color: #374361;
    background: #edf0ff;
}

.pagina-admin-dashboard .barra-pista { background: var(--dv-borde); }
.pagina-admin-dashboard .barra-pista i { background: var(--dv-azul); }
.pagina-admin-dashboard .resultado-pregunta { border-left-color: var(--dv-azul); }
.pagina-admin-dashboard .numero-pregunta-dashboard { background: #16234a; }
.pagina-admin-dashboard .manual-box,
.pagina-admin-dashboard .resumen-box { margin: 18px 0; }

.pagina-admin-login .dv-topbar-interior { justify-content: flex-start; }
.pagina-admin-login .admin-login { margin-top: 54px; }

.pagina-dashboard-visual .dv-tabla table {
    width: 100%;
    margin: 0;
    border-collapse: collapse;
}

/* Menú administrativo para celulares y tabletas */
.dv-menu-movil { display: none; position: relative; }

.dv-menu-movil > summary {
    display: grid;
    width: 42px;
    height: 42px;
    padding: 10px 9px;
    align-content: center;
    gap: 5px;
    color: #fff;
    background: rgba(255, 255, 255, .12);
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 10px;
    cursor: pointer;
    list-style: none;
}

.dv-menu-movil > summary::-webkit-details-marker { display: none; }

.dv-menu-movil > summary span {
    display: block;
    width: 100%;
    height: 2px;
    background: currentColor;
    border-radius: 999px;
    transition: transform .18s ease, opacity .18s ease;
}

.dv-menu-movil[open] > summary span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.dv-menu-movil[open] > summary span:nth-child(2) { opacity: 0; }
.dv-menu-movil[open] > summary span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.dv-menu-movil-panel {
    position: absolute;
    z-index: 1000;
    top: calc(100% + 9px);
    right: 0;
    width: min(310px, calc(100vw - 20px));
    overflow: hidden;
    color: var(--dv-texto, #17213a);
    background: #fff;
    border: 1px solid var(--dv-borde, #e1e7f1);
    border-radius: 14px;
    box-shadow: 0 18px 45px rgba(16, 28, 61, .24);
}

.dv-menu-movil-panel nav { display: grid; padding: 7px; }

.dv-menu-movil-panel a {
    display: block;
    padding: 12px 13px;
    color: var(--dv-texto, #17213a);
    border-radius: 9px;
    font-size: .9rem;
    font-weight: 750;
    text-decoration: none;
}

.dv-menu-movil-panel a:hover,
.dv-menu-movil-panel a[aria-current="page"] {
    color: var(--dv-azul, #4f67e8);
    background: #edf0ff;
}

.dv-menu-movil-panel form {
    margin: 0;
    padding: 7px;
    border-top: 1px solid var(--dv-borde, #e1e7f1);
}

.dv-menu-movil-panel .dv-menu-cerrar,
.pagina-admin-dashboard .dv-menu-movil-panel .dv-menu-cerrar,
.pagina-dashboard-visual .dv-menu-movil-panel .dv-menu-cerrar {
    display: flex;
    width: 100%;
    min-height: 42px;
    align-items: center;
    justify-content: flex-start;
    padding: 10px 13px;
    color: #fff;
    background: #16234a;
    border: 1px solid #16234a;
    border-radius: 9px;
    font-size: .9rem;
    font-weight: 800;
    text-align: left;
}

.dv-menu-movil-panel .dv-menu-cerrar:hover,
.dv-menu-movil-panel .dv-menu-cerrar:focus {
    color: #fff;
    background: #0e1835;
    border-color: #0e1835;
}

@media (max-width: 1100px) {
    .pagina-admin-dashboard .metricas-admin { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 820px) {
    .dv-topbar-interior { padding: 10px 0; }
    .dv-navegacion,
    .dv-salida-escritorio { display: none; }
    .dv-menu-movil { display: block; margin-left: auto; }
    .pagina-admin-dashboard .constructor-layout,
    .pagina-admin-dashboard .dashboard-grid { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
    .pagina-admin-dashboard .dv-topbar-interior,
    .pagina-admin-dashboard .dv-contenedor { width: min(100% - 20px, 1320px); }
    .pagina-admin-dashboard .dv-marca span:last-child { display: none; }
    .pagina-admin-dashboard .dv-encabezado { align-items: flex-start; flex-direction: column; }
    .pagina-admin-dashboard .metricas-admin { grid-template-columns: 1fr; }
    .pagina-admin-dashboard .metrica-admin { align-items: center; text-align: center; }
}

/* Formularios que también funcionan como evaluaciones. */
.etiqueta-modalidad,
.etiqueta-evaluacion-publica {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 4px 9px;
    color: #3152b8;
    background: #edf0ff;
    border: 1px solid #dce2ff;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 800;
}

.campo-respuesta-correcta {
    padding: 14px;
    background: #f4fbf7;
    border: 1px solid #cfeadb;
    border-radius: 12px;
}

.campo-respuesta-correcta > strong {
    display: block;
    margin-bottom: 10px;
}

.selector-respuestas-correctas {
    display: grid;
    gap: 7px;
    margin-bottom: 8px;
}

.selector-respuestas-correctas .opcion {
    margin: 0;
    padding: 9px 11px;
    background: #fff;
    border: 1px solid #dce7e1;
    border-radius: 9px;
}

.selector-respuestas-correctas p {
    margin: 0;
    color: #52617c;
}

.campos-numericos[hidden] {
    display: none;
}

.opcion-correcta-admin,
.dv-respuesta-correcta {
    color: #16734a;
    font-weight: 800;
}

.dv-respuesta-correcta {
    display: block;
    margin-top: 5px;
}

.resultado-evaluacion {
    display: grid;
    justify-items: center;
    gap: 5px;
    margin: 18px 0;
    padding: 22px;
    color: #17213a;
    background: linear-gradient(135deg, #f4fbf7, #edf0ff);
    border: 1px solid #cfeadb;
    border-radius: 16px;
    text-align: center;
}

.resultado-evaluacion span {
    font-weight: 750;
}

.resultado-evaluacion strong {
    color: #3152b8;
    font-size: clamp(2.25rem, 9vw, 4rem);
    line-height: 1;
}

.resultado-evaluacion small {
    color: #52617c;
    font-size: .92rem;
}

.dv-resultados-evaluacion .dv-tabla {
    margin-top: 18px;
}

.dv-puntaje-total {
    display: inline-flex;
    min-width: 68px;
    justify-content: center;
    padding: 6px 10px;
    color: #fff;
    background: #3152b8;
    border-radius: 999px;
    font-size: 1rem;
    line-height: 1;
}