.agenda-panel {
    max-width: 1180px;
    margin: 0 auto;
}

.agenda-encabezado {
    align-items: center;
    background: linear-gradient(135deg, #eff6ff 0%, #ffffff 72%);
    border: 1px solid #dbeafe;
    border-radius: var(--radio-lg);
    display: flex;
    justify-content: space-between;
    margin-bottom: 1.5rem;
    overflow: hidden;
    padding: 1.75rem 2rem;
    position: relative;
}

.agenda-encabezado::after {
    background: var(--color-primario);
    border-radius: 50%;
    content: '';
    height: 12rem;
    opacity: 0.08;
    position: absolute;
    right: 2.5rem;
    top: -5rem;
    width: 12rem;
}

.agenda-kicker,
.agenda-seccion-etiqueta {
    align-items: center;
    color: var(--color-primario);
    display: inline-flex;
    font-size: 0.72rem;
    font-weight: 800;
    gap: 0.4rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.agenda-kicker svg {
    height: 1rem;
    width: 1rem;
}

.agenda-encabezado h1 {
    color: var(--color-texto-principal);
    font-size: clamp(1.65rem, 3vw, 2.25rem);
    letter-spacing: -0.02em;
    margin: 0.35rem 0;
}

.agenda-encabezado p:last-child {
    color: var(--color-texto-secundario);
    margin: 0;
}

.agenda-resumen-icono {
    align-items: center;
    background: var(--color-primario);
    border-radius: 1rem;
    color: white;
    display: flex;
    height: 4rem;
    justify-content: center;
    position: relative;
    width: 4rem;
    z-index: 1;
}

.agenda-resumen-icono svg {
    height: 2rem;
    width: 2rem;
}

.agenda-formulario {
    background: var(--color-superficie);
    border: 1px solid var(--color-borde);
    border-radius: var(--radio-lg);
    box-shadow: var(--sombra-sm);
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-bottom: 2rem;
    padding: 1.35rem;
}

.agenda-formulario-titulo {
    align-items: center;
    border-bottom: 1px solid var(--color-borde);
    display: flex;
    grid-column: 1 / -1;
    justify-content: space-between;
    padding-bottom: 1rem;
}

.agenda-formulario-titulo h2,
.agenda-listado-encabezado h2 {
    color: var(--color-texto-principal);
    font-size: 1.05rem;
    margin: 0.25rem 0 0;
}

.agenda-formulario-titulo > svg {
    color: var(--color-primario);
    height: 1.5rem;
    width: 1.5rem;
}

.agenda-formulario .campo-formulario {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.agenda-formulario .campo-formulario label {
    color: var(--color-texto-secundario);
    font-size: 0.8rem;
    font-weight: 700;
}

.agenda-formulario .input-control {
    min-height: 2.65rem;
}

.agenda-submit {
    align-self: end;
    min-height: 2.65rem;
}

.agenda-listado-encabezado {
    align-items: end;
    display: flex;
    justify-content: space-between;
    margin-bottom: 0.75rem;
}

.agenda-ayuda {
    color: var(--color-texto-terciario);
    font-size: 0.8rem;
}

.agenda-listado {
    background: transparent;
    border: 0;
    box-shadow: none;
    padding: 0;
}

.agenda-clase-item {
    align-items: center;
    background: var(--color-superficie);
    border: 1px solid var(--color-borde);
    border-left: 4px solid var(--color-primario);
    border-radius: var(--radio-md);
    box-shadow: var(--sombra-sm);
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin-bottom: 0.75rem;
    padding: 1rem 1.15rem;
    transition: transform var(--transicion-base), box-shadow var(--transicion-base);
}

.agenda-clase-item:hover {
    box-shadow: var(--sombra-md);
    transform: translateY(-1px);
}

.agenda-clase-nombre {
    color: var(--color-texto-principal);
    display: block;
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 0.4rem;
}

.agenda-clase-dato {
    align-items: center;
    color: var(--color-texto-secundario);
    display: inline-flex;
    font-size: 0.8rem;
    gap: 0.3rem;
    margin-right: 1rem;
}

.agenda-clase-dato svg {
    color: var(--color-primario);
    height: 0.85rem;
    width: 0.85rem;
}

.agenda-clase-acciones {
    align-items: center;
    display: flex;
    gap: 0.65rem;
}

.agenda-cupos,
.agenda-estado {
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 0.35rem 0.65rem;
    white-space: nowrap;
}

.agenda-cupos {
    background: #ecfdf5;
    color: #047857;
}

.agenda-cupos.sin-cupos {
    background: #fff7ed;
    color: #c2410c;
}

.agenda-cupos small {
    font-size: 0.68rem;
    font-weight: 500;
}

.agenda-inscritos {
    color: var(--color-texto-secundario);
    font-size: 0.78rem;
    position: relative;
}

.agenda-inscritos summary {
    cursor: pointer;
    font-weight: 700;
    list-style: none;
    white-space: nowrap;
}

.agenda-inscritos summary::before {
    content: '+ ';
    color: var(--color-primario);
}

.agenda-inscritos[open] summary::before {
    content: '- ';
}

.agenda-lista-usuarios {
    background: var(--color-superficie);
    border: 1px solid var(--color-borde);
    border-radius: var(--radio-md);
    box-shadow: var(--sombra-md);
    display: grid;
    gap: 0.45rem;
    min-width: 14rem;
    padding: 0.75rem;
    position: absolute;
    right: 0;
    top: calc(100% + 0.5rem);
    z-index: 5;
}

.agenda-lista-usuarios span {
    align-items: center;
    display: flex;
    gap: 0.4rem;
    white-space: nowrap;
}

.agenda-lista-usuarios svg {
    color: var(--color-primario);
    height: 0.85rem;
    width: 0.85rem;
}

.agenda-estado {
    background: #eff6ff;
    color: var(--color-primario);
}

.agenda-estado.estado-cancelada {
    background: #fef2f2;
    color: var(--color-error);
}

.agenda-clase-acciones .btn {
    white-space: nowrap;
}

.agenda-cargando {
    color: var(--color-texto-secundario);
    padding: 2rem;
    text-align: center;
}

@media (max-width: 900px) {
    .agenda-formulario {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .agenda-encabezado {
        padding: 1.25rem;
    }

    .agenda-resumen-icono {
        display: none;
    }

    .agenda-formulario {
        grid-template-columns: 1fr;
    }

    .agenda-formulario-titulo {
        grid-column: auto;
    }

    .agenda-listado-encabezado,
    .agenda-clase-item {
        align-items: flex-start;
        flex-direction: column;
    }

    .agenda-clase-acciones {
        flex-wrap: wrap;
        width: 100%;
    }
}

/* Agenda y recepción: controles compactos y adaptación a pantallas pequeñas. */
.agenda-filtros{display:flex;align-items:end;gap:.6rem;flex-wrap:wrap;margin:1rem 0}
.agenda-busqueda{display:grid;gap:.3rem;margin-left:auto;font-size:.8rem;min-width:240px}
.agenda-clase-item{align-items:flex-start;flex-direction:column}
.agenda-clase-acciones{flex-wrap:wrap;width:100%;gap:.5rem}
.agenda-clase-acciones .selector-instructor-clase{width:auto;max-width:220px}
.agenda-eliminar{color:var(--color-error)}
.agenda-estado.estado-asistida{background:#ecfdf5;color:#047857}
.control-panel{max-width:1280px;margin:auto}
.control-grid{display:grid;grid-template-columns:minmax(300px,.8fr) minmax(0,1.3fr);gap:1.25rem;align-items:start}
.control-columna{display:grid;gap:1rem;min-width:0}
.control-tarjeta{padding:1.4rem;background:var(--color-superficie);border:1px solid var(--color-borde);border-radius:16px;box-shadow:var(--sombra-sm);min-width:0}
.control-tarjeta h2{font-size:1.15rem;margin:.7rem 0}
.control-tarjeta p,.control-tarjeta small{color:var(--color-texto-secundario);line-height:1.6}
.control-icono{display:grid;place-items:center;width:54px;height:54px;border-radius:14px;background:#eff6ff;color:var(--color-primario)}
.control-escaneo form{display:grid;gap:.7rem;margin:1.3rem 0}
.control-tarjeta label{display:block;font-size:.82rem;font-weight:600;margin-bottom:.4rem}
.control-escaneo input{font-size:1.2rem;min-height:52px;width:100%}
.control-escaneo .btn{justify-content:center;min-height:46px}
.control-disponible{background:#eff6ff;color:#1d4ed8;padding:.5rem .8rem;border-radius:30px;font-size:.8rem;white-space:nowrap}
.control-cabecera{display:flex;align-items:center;justify-content:space-between;gap:.7rem;margin-bottom:1rem}
.control-historial>.input-control{width:100%}
.control-historial .tabla-responsive{overflow:auto;max-height:580px}
.control-historial th{white-space:nowrap}
.control-resultado{border-left:4px solid #94a3b8}
.control-resultado[data-estado="exito"]{border-color:#059669;background:#f0fdf4}
.control-resultado[data-estado="error"]{border-color:#dc2626;background:#fff7f7}
.control-resultado[data-estado="aviso"]{border-color:#d97706;background:#fffbeb}
.control-resultado[data-estado="exito"] #iconoResultado{color:#047857}
.control-resultado[data-estado="error"] #iconoResultado{color:#dc2626}
.control-resultado dl{margin:1rem 0 0}
.control-resultado dl div{display:flex;justify-content:space-between;gap:1rem;border-top:1px solid var(--color-borde);padding:.65rem 0}
.control-resultado dl [hidden],.control-resultado [hidden]{display:none}
.control-resultado dt{color:var(--color-texto-secundario);font-size:.85rem}
.control-resultado dd{margin:0;font-weight:600;text-align:right}
@media(max-width:980px){.control-grid{grid-template-columns:1fr}.control-columna{grid-template-columns:1fr 1fr;align-items:start}}
@media(max-width:640px){.control-columna{grid-template-columns:1fr}.control-disponible{display:none}.control-tarjeta{padding:1rem}.control-cabecera{flex-wrap:wrap}.agenda-busqueda{width:100%;margin:0}.agenda-clase-acciones .selector-instructor-clase{max-width:100%;width:100%}}

.control-historial .tabla-datos{min-width:0;width:100%}.control-historial .tabla-datos td{white-space:normal;overflow-wrap:anywhere}
.control-historial .tabla-datos th,.control-historial .tabla-datos td{padding:.8rem .6rem}

.agenda-recurrencia{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:1rem;font-size:.85rem}.agenda-recurrencia fieldset{width:100%;border:1px solid var(--color-borde);border-radius:12px;padding:1rem}.agenda-recurrencia fieldset label{display:inline-flex;gap:.35rem;margin:.4rem .8rem .4rem 0}.agenda-recurrencia p{color:var(--color-texto-secundario);font-size:.8rem}.agenda-recurrencia [hidden]{display:none}.agenda-horarios h2{font-size:1rem}.agenda-horarios article{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem;background:#eff6ff;border:1px solid #dbeafe;border-radius:12px;margin:.75rem 0}.agenda-horarios p{font-size:.8rem;margin:.4rem 0;color:var(--color-texto-secundario)}@media(max-width:640px){.agenda-horarios article{align-items:start;flex-direction:column}}
.agenda-horarios-editor{grid-column:1/-1}.agenda-horarios-editor-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}.agenda-horarios-editor-head h2{margin:.28rem 0;font-size:1rem}.agenda-horarios-editor-head .btn{flex:0 0 auto}.agenda-horarios-lista{display:grid;gap:.7rem;margin-top:.85rem}.agenda-horario-editor{display:block!important;padding:1rem!important;background:#f8fbff!important}.agenda-horario-editor-head{display:flex;justify-content:space-between;align-items:center;gap:.75rem}.agenda-horario-numero{color:#1d4ed8;font-size:.82rem}.agenda-horario-quitar{display:grid;place-items:center;width:30px;height:30px;border:1px solid #fecaca;border-radius:7px;background:#fff;color:#b91c1c;font-size:1.2rem;cursor:pointer}.agenda-horario-quitar:disabled{opacity:.4;cursor:default}.agenda-horario-campos{display:grid;grid-template-columns:minmax(210px,1fr) minmax(170px,.55fr);gap:.75rem;align-items:end;margin-top:.8rem}.agenda-horario-campos label{display:grid;gap:.35rem;color:var(--color-texto-secundario);font-size:.78rem;font-weight:700}.agenda-repite-label{display:flex!important;align-items:center;min-height:2.65rem;gap:.45rem;padding:.15rem 0}.agenda-dias-horario{margin-top:.75rem;border:1px solid var(--color-borde);border-radius:10px;padding:.7rem .85rem}.agenda-dias-horario legend{padding:0 .3rem;font-size:.76rem;font-weight:700;color:var(--color-texto-secundario)}.agenda-dias-horario label{display:inline-flex;gap:.3rem;margin:.25rem .65rem .25rem 0;font-size:.8rem}.agenda-dias-horario p{margin:.45rem 0 0}@media(max-width:640px){.agenda-horarios-editor-head{flex-direction:column}.agenda-horarios-editor-head .btn{width:100%}.agenda-horario-campos{grid-template-columns:1fr}.agenda-horario-editor-head{flex-direction:row}.agenda-horario-quitar{align-self:flex-start}}

.agenda-recurrente-head{display:flex;justify-content:space-between;align-items:start;gap:1rem;width:100%}.agenda-horario-texto{display:block;margin:.5rem 0;font-size:1rem;color:var(--color-texto-principal)}.agenda-recurrente-card{border-left-color:#0f766e}.agenda-fechas{width:100%;border-top:1px solid var(--color-borde);padding-top:.8rem}.agenda-fechas>summary{cursor:pointer;font-weight:600;font-size:.85rem;color:var(--color-primario)}.agenda-fechas-lista{max-height:420px;overflow:auto}.agenda-fecha-fila{display:flex;flex-direction:column;gap:.65rem;padding:1rem 0;border-bottom:1px solid var(--color-borde)}.agenda-fecha-fila>div:first-child{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;font-size:.8rem}.agenda-fecha-fila span{color:var(--color-texto-secundario)}@media(max-width:600px){.agenda-recurrente-head{flex-direction:column}}
