/* Componentes compartidos; se cargan después del CSS de cada vista. */
.uaa-layout {
    min-width: 0;
}

.uaa-layout > #uaa-main {
    padding-bottom: 0 !important;
}

.uaa-app .uaa-page {
    width: 100%;
    margin: 0;
    min-height: 100dvh;
    background: var(--uaa-background);
    font-family: inherit;
}

.uaa-app .uaa-content {
    width: auto;
    min-width: 0;
    min-height: 100dvh;
    margin-left: var(--uaa-sidebar-width);
    padding: var(--uaa-page-padding);
}

.uaa-content > :is(.create-container, .content-container, .details-container, .solicitud-contenedor, .laboratorios-page) {
    width: 100%;
    max-width: 1120px;
    margin: 0 auto;
    padding: 0;
}

.uaa-content > .laboratorios-page {
    max-width: var(--uaa-content-width);
}

.uaa-content > :is(.formulario-card, .formulario-topbar) {
    width: 100%;
    max-width: 720px;
    margin-inline: auto;
}

.uaa-app .uaa-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
    margin: 0 0 var(--uaa-space-5);
}

.uaa-header :is(h1, .laboratorios-title), .uaa-content .formulario-titulo h1 {
    margin: 0 0 8px;
    color: var(--uaa-text);
    font-size: clamp(1.6rem, 2.2vw, 2.1rem);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -.025em;
}

.uaa-header :is(p, .laboratorios-subtitle) {
    margin: 0;
    color: var(--uaa-muted);
    font-size: .95rem;
    line-height: 1.5;
}

.uaa-header > :is(h1, p) {
    flex-basis: 100%;
}

.uaa-header:has(> h1) {
    gap: 0;
}

.uaa-header:has(> h1) > a {
    margin-top: 16px;
}

.uaa-content :is(.header-actions, .bottom-actions, .card-actions, .form-actions, .formulario-acciones, .solicitud-acciones, .resultado-acciones) {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

/* Una navegación visual; cada vista conserva sus enlaces y permisos. */
.uaa-app .uaa-sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 100;
    width: var(--uaa-sidebar-width);
    padding: 20px 16px;
    display: flex;
    flex-direction: column;
    gap: 24px;
    overflow-y: auto;
    color: white;
    background: var(--uaa-primary);
    border: 0;
    box-shadow: none;
}

.uaa-sidebar :is(.sidebar-logo, .usuarios-logo, .docente-logo, .solicitud-logo) {
    height: 116px;
    min-height: 116px;
    padding: 16px;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: white;
    border-radius: var(--uaa-radius-sm);
}

.uaa-sidebar :is(.sidebar-logo, .usuarios-logo, .docente-logo, .solicitud-logo) img {
    display: block;
    width: 100%;
    max-width: 190px;
    max-height: 88px;
    object-fit: contain;
}

.uaa-sidebar nav {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.uaa-sidebar :is(.sidebar-link, .usuarios-link, .docente-menu-link, .solicitud-menu-link, .cerrar-sesion, .usuarios-logout, .docente-salir, .solicitud-salir) {
    width: 100%;
    min-height: 46px;
    padding: 10px 12px;
    display: flex;
    align-items: center;
    gap: 12px;
    color: white;
    font-size: .9rem;
    font-weight: 500;
    line-height: 1.4;
    text-align: left;
    text-decoration: none;
    background: transparent;
    border: 1px solid transparent;
    border-radius: var(--uaa-radius-sm);
    transition: background-color .15s;
}

.uaa-sidebar nav a i, .uaa-sidebar button i {
    width: 22px;
    flex-shrink: 0;
    font-size: 1.2rem;
    text-align: center;
}

.uaa-sidebar nav a:hover, .uaa-sidebar button:hover {
    color: white;
    background: rgb(255 255 255 / 10%);
    transform: none;
}

.uaa-sidebar nav a.activo {
    background: rgb(255 255 255 / 18%);
    border-color: rgb(255 255 255 / 20%);
    font-weight: 650;
}

.uaa-sidebar nav a.desactivado {
    opacity: .65;
    cursor: not-allowed;
}

.uaa-sidebar :focus-visible {
    outline-color: white;
}

.uaa-sidebar .uaa-nav-footer {
    margin-top: auto;
}

.uaa-sidebar :is(.usuario-admin, .usuarios-admin, .docente-usuario, .solicitud-usuario) {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 20px 4px 16px;
    margin: 0;
    border-top: 1px solid rgb(255 255 255 / 22%);
    border-bottom: 0;
}

.uaa-sidebar :is(.usuario-icono, .docente-usuario-icono, .solicitud-usuario-icono, .usuarios-admin > i) {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    border: 1px solid rgb(255 255 255 / 60%);
    border-radius: 50%;
    font-size: 1.2rem;
}

.uaa-sidebar :is(.usuario-datos, .docente-usuario-datos, .solicitud-usuario-datos, .usuarios-admin > div) {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.uaa-sidebar :is(.usuario-nombre, .docente-usuario-rol, .solicitud-usuario-rol, .usuarios-admin strong) {
    font-size: .85rem;
    font-weight: 650;
}

.uaa-sidebar :is(.usuario-correo, .docente-usuario-correo, .solicitud-usuario-correo, .usuarios-admin span) {
    color: #e1eee8;
    font-size: .75rem;
    overflow-wrap: anywhere;
    white-space: normal;
}

.uaa-menu-toggle {
    display: none;
}

/* Superficies, formularios y jerarquía. */
.uaa-app :is(.panel-card, .form-shell, .form-card, .usuarios-card, .formulario-card, .reservas-docente-card, .solicitud-seccion, .chart-card, .usage-chart-card, .laboratorios-card, .uaa-card) {
    border: 1px solid var(--uaa-border);
    border-radius: var(--uaa-radius);
    background: var(--uaa-surface);
    box-shadow: var(--uaa-shadow);
    min-width: 0;
}

.uaa-card {
    padding: var(--uaa-space-5);
    margin-bottom: var(--uaa-space-5);
}

.uaa-app :is(.section-title h2, .solicitud-seccion-titulo h2, .chart-title, .section-heading h2, .usuarios-card-header h2, .reservas-docente-header h2) {
    color: var(--uaa-text);
    font-size: 1.1rem;
    font-weight: 650;
    line-height: 1.4;
}

.uaa-app :is(.form-section, .solicitud-seccion, .form-body, .details-body) {
    padding: var(--uaa-space-5);
}

.uaa-app .solicitud-seccion {
    margin-bottom: var(--uaa-space-5);
}

.uaa-app :is(.form-grid, .solicitud-grid) {
    gap: 24px;
}

.uaa-app :is(.field, .form-field, .solicitud-campo, .filter-field) {
    min-width: 0;
}

.uaa-app :is(.field-label, .form-label, .solicitud-campo > label, .filter-field > label, .docente-campo > label, .date-field > label, .analytics-field > label, .funcionario-label) {
    color: var(--uaa-text);
    font-size: .85rem;
    font-weight: 600;
    margin-bottom: 8px;
}

.uaa-app :is(.form-control-modern, .form-control-custom, .solicitud-control, .filter-control, .docente-fecha, .date-field input, .analytics-field select, .form-control, .form-select) {
    min-width: 0;
    min-height: 44px;
    border-color: #c8d5cf;
    border-radius: var(--uaa-radius-sm);
    color: var(--uaa-text);
    background-color: var(--uaa-surface);
    font-size: .925rem;
}

.uaa-app :is(.form-control-modern, .form-control-custom, .solicitud-control, .filter-control, .docente-fecha, .date-field input, .analytics-field select, .form-control, .form-select):focus {
    border-color: var(--uaa-primary);
    box-shadow: var(--uaa-focus);
    outline: none;
}

.uaa-app :is(.field-help, .password-ayuda, .dato-secundario) {
    color: var(--uaa-muted);
    line-height: 1.5;
}

.uaa-app :is(.field-validation-error, .validation-message, .text-danger) {
    color: var(--uaa-danger);
}

.uaa-app :is(.form-control, .form-control-modern, .form-control-custom, .solicitud-control).input-validation-error {
    border-color: var(--uaa-danger);
    background: #fffafb;
}

.uaa-app .form-check-input:checked {
    background-color: var(--uaa-primary);
    border-color: var(--uaa-primary);
}

.uaa-app textarea {
    min-height: 110px;
    resize: vertical;
}

/* Acciones: altura, radios y tipografía compartidos. */
.uaa-app :is(.btn, .primary-action, .secondary-action, .filter-button, .download-button, .chart-download-small, .btn-uaa, .submit-button, .cancel-button, .delete-button, .back-button, .action-button, .solicitud-boton, .resultado-boton, .btn-crear-funcionario, .btn-cancelar, .docente-filtrar, .docente-limpiar) {
    min-height: 44px;
    border-radius: var(--uaa-radius-sm);
    font-size: .875rem;
    font-weight: 600;
    line-height: 1.4;
    padding: 10px 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-decoration: none;
}

.uaa-app :is(.primary-action, .filter-button, .btn-uaa, .submit-button, .action-button.primary, .solicitud-boton.principal, .resultado-boton-principal, .btn-crear-funcionario, .docente-filtrar, .btn-primary, .btn-success, .btn-funcionario) {
    color: white;
    background: var(--uaa-primary);
    border: 1px solid var(--uaa-primary);
}

.uaa-app :is(.primary-action, .filter-button, .btn-uaa, .submit-button, .action-button.primary, .solicitud-boton.principal, .resultado-boton-principal, .btn-crear-funcionario, .docente-filtrar, .btn-primary, .btn-success, .btn-funcionario):hover {
    color: white;
    background: var(--uaa-primary-dark);
    border-color: var(--uaa-primary-dark);
}

.uaa-app :is(.secondary-action, .cancel-button, .back-button, .btn-cancelar, .docente-limpiar, .btn-outline-secondary, .btn-outline-success, .download-button, .chart-download-small) {
    color: var(--uaa-primary-dark);
    background: white;
    border: 1px solid #b9cfc4;
}

.uaa-app :is(.delete-button, .btn-danger) {
    background: var(--uaa-danger);
    color: white;
    border-color: var(--uaa-danger);
}

.uaa-app :is(.btn, button):disabled {
    cursor: not-allowed;
    opacity: .55;
}

/* Tablas: el scroll pertenece al contenedor, nunca a toda la página. */
.uaa-app :is(.table-responsive, .table-scroll, .tabla-docente-contenedor) {
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-x: contain;
}

.uaa-app :is(.table, .data-table, .tabla-docente, .laboratorios-table) {
    width: 100%;
    margin-bottom: 0;
    border-collapse: collapse;
    color: var(--uaa-text);
    font-size: .875rem;
}

.uaa-app :is(.table, .data-table, .tabla-docente, .laboratorios-table) > thead > tr > th {
    padding: 14px 16px;
    color: #496057;
    background: #f0f6f3;
    border-bottom: 1px solid var(--uaa-border);
    font-size: .75rem;
    font-weight: 650;
    letter-spacing: .025em;
    text-align: left;
}

.uaa-app :is(.table, .data-table, .tabla-docente, .laboratorios-table) > tbody > tr > td {
    padding: 16px;
    border-bottom: 1px solid #eaf0ed;
    vertical-align: middle;
}

.uaa-app :is(.table, .data-table, .tabla-docente, .laboratorios-table) > tbody > tr:last-child > td {
    border-bottom: 0;
}

.uaa-app :is(.table, .data-table, .tabla-docente, .laboratorios-table) > tbody > tr:hover > td {
    background: #f7faf8;
    --bs-table-accent-bg: #f7faf8;
}

.uaa-app .table-striped {
    --bs-table-striped-bg: #fbfcfb;
}

.uaa-app :is(.action-group, .row-actions, .reservation-actions, .usuarios-acciones-celda) {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.uaa-app :is(.action-btn, .icon-action, .btn-usuario-accion, .ver-reserva, .compact-assign-button) {
    min-height: 36px;
    min-width: 36px;
    padding: 8px 10px;
    border-radius: var(--uaa-radius-sm);
    font-size: .8rem;
    line-height: 1.3;
}

.uaa-app :is(.status-badge, .estado-docente, .estado-badge, .detail-status, .rol-badge, .badge) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 5px 9px;
    border-radius: 6px;
    font-size: .75rem;
    font-weight: 600;
    line-height: 1.4;
    white-space: normal;
    text-align: center;
}

.uaa-app :is(.estado-asignada, .status-active, .estado-badge:not(.bloqueado), .available-badge) {
    background: var(--uaa-primary-soft);
    color: var(--uaa-primary-dark);
}

.uaa-app :is(.estado-pendiente, .estado-revision, .status-special) {
    background: var(--uaa-warning-soft);
    color: var(--uaa-warning);
}

.uaa-app :is(.estado-rechazada, .estado-sin-disponibilidad, .estado-badge.bloqueado) {
    background: var(--uaa-danger-soft);
    color: var(--uaa-danger);
}

.uaa-app :is(.estado-cancelada, .estado-neutro, .estado-finalizada, .status-inactive) {
    background: #eef1f0;
    color: #54645d;
}

.uaa-app :is(.rol-badge, .status-normal, .status-standard) {
    background: var(--uaa-info-soft);
    color: var(--uaa-info);
}

.uaa-app .pagination {
    flex-wrap: wrap;
    gap: 4px;
}

.uaa-app .page-link {
    color: var(--uaa-primary);
    border-color: var(--uaa-border);
    border-radius: 6px;
}

.uaa-app .page-item.active .page-link {
    color: white;
    background: var(--uaa-primary);
    border-color: var(--uaa-primary);
}

.uaa-report-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
}

.uaa-facts {
    display: grid;
    grid-template-columns: minmax(150px, 1fr) 1fr;
    gap: 14px 24px;
    margin: 0;
}

.uaa-facts dd {
    margin: 0;
    overflow-wrap: anywhere;
}

.uaa-facts dt {
    color: var(--uaa-muted);
    font-weight: 500;
}

.uaa-app .uaa-footer {
    position: static;
    padding: 20px;
    line-height: 1.5;
    background: white;
}

@media (min-width: 1900px) {
    .uaa-app .uaa-content {
        padding-inline: max(var(--uaa-page-padding), calc((100vw - var(--uaa-sidebar-width) - var(--uaa-content-width)) / 2));
    }

}

@media (max-width: 1000px) {
    :root {
        --uaa-sidebar-width: 220px;
    }

    .uaa-app .uaa-report-grid {
        grid-template-columns: 1fr;
    }

}

@media (max-width: 800px) {
    :root {
        --uaa-page-padding: 20px;
    }

    .uaa-app .uaa-content {
        margin-left: 0;
        min-height: auto;
        padding: var(--uaa-page-padding);
    }

    .uaa-app .uaa-sidebar {
        position: relative;
        width: 100%;
        padding: 12px 20px;
        gap: 12px;
        overflow: visible;
    }

    .uaa-sidebar :is(.sidebar-logo, .usuarios-logo, .docente-logo, .solicitud-logo) {
        width: 158px;
        height: 60px;
        min-height: 60px;
        padding: 8px;
    }

    .uaa-sidebar :is(.sidebar-logo, .usuarios-logo, .docente-logo, .solicitud-logo) img {
        max-height: 46px;
    }

    .uaa-nav-ready .uaa-menu-toggle {
        position: absolute;
        top: 20px;
        right: 20px;
        display: flex;
        align-items: center;
        gap: 8px;
        min-height: 44px;
        padding: 8px 12px;
        color: white;
        background: transparent;
        border: 1px solid rgb(255 255 255 / 55%);
        border-radius: 8px;
    }

    .uaa-sidebar.uaa-nav-ready:not(.uaa-nav-open) > :is(nav, .uaa-nav-footer) {
        display: none;
    }

    .uaa-sidebar nav {
        display: flex;
        flex-direction: column;
    }

    .uaa-app .uaa-header {
        margin-bottom: 24px;
    }

    .uaa-app .uaa-header h1 {
        overflow-wrap: anywhere;
    }

    .uaa-app :is(.form-grid.three-columns, .solicitud-grid, .form-grid) {
        grid-template-columns: 1fr;
    }

    .uaa-app :is(.header-actions, .form-actions, .card-actions, .formulario-acciones, .solicitud-acciones) > :is(a, button) {
        flex: 1 1 auto;
    }

    .uaa-app :is(.filter-field, .date-field, .analytics-field, .docente-campo) {
        min-width: 0;
    }

    .uaa-app :is(.action-btn, .icon-action, .btn-usuario-accion, .ver-reserva, .compact-assign-button) {
        min-height: 44px;
        min-width: 44px;
    }

    .uaa-app :is(.date-filter, .analytics-filter, .download-actions) {
        gap: 12px;
        flex-wrap: wrap;
    }

}

@media (max-width: 480px) {
    :root {
        --uaa-page-padding: 16px;
    }

    .uaa-app :is(.form-section, .solicitud-seccion, .form-body, .details-body, .uaa-card) {
        padding: 20px 16px;
    }

    .uaa-facts {
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .uaa-facts dd {
        margin-bottom: 12px;
    }

}

/* Vistas de lectura y encabezados con icono. */
.uaa-app :is(.resultado-page, .detalle-page) {
    padding: var(--uaa-page-padding);
}

.uaa-app .uaa-header:has(> .page-icon) {
    justify-content: flex-start;
    align-items: center;
}

.uaa-app .uaa-header > .page-heading {
    min-width: 0;
    flex: 1;
}

.uaa-app .uaa-header:has(> h1):has(> p) {
    display: block;
}

.uaa-app :is(.resultado-estado, .resultado-card, .detalle-card) {
    border-radius: var(--uaa-radius);
    box-shadow: var(--uaa-shadow);
}

.uaa-app :is(.detalle-valor, .detail-value, .solicitud-dato strong) {
    overflow-wrap: anywhere;
}

.uaa-app :is(.details-hero, .details-body, .details-grid, .detalle-grid) {
    gap: 24px;
}

.uaa-app .uaa-content .formulario-topbar {
    margin-bottom: 24px;
}

@media (max-width: 600px) {
    .uaa-app .solicitar-card {
        padding: 24px 20px;
        min-height: 120px;
        gap: 16px;
        border-radius: var(--uaa-radius);
        box-shadow: var(--uaa-shadow);
    }

    .uaa-app .solicitar-icono {
        width: 44px;
        height: 44px;
        flex-basis: 44px;
        font-size: 2.25rem;
    }

    .uaa-app .solicitar-texto h2 {
        font-size: 1.15rem;
    }

    .uaa-app .solicitar-texto p {
        font-size: .875rem;
    }

    .uaa-app .uaa-header:has(> .page-icon) {
        flex-direction: row;
        align-items: flex-start;
    }

    .uaa-app .uaa-header > .page-icon {
        width: 42px;
        height: 42px;
        border-radius: 8px;
        font-size: 1.25rem;
    }

}

/* Foco de teclado también en las opciones visuales de turnos y espacios. */
.turno-option:focus-within .turno-card, .lab-option:focus-within .lab-card, .turno-card:focus-within .turno-card-contenido, .facec-card:focus-within .facec-card-contenido {
    outline: 3px solid var(--uaa-primary);
    outline-offset: 3px;
}