@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

/* ============================================================
   NeurySis · Tema sobre Bootstrap 5.3
   Navy primario + naranja como acción/acento.
   Solo van clases que Bootstrap no provee.
   ============================================================ */

:root {
    /* Overrides de Bootstrap */
    --bs-primary: #1d4ed8;
    --bs-primary-rgb: 29, 78, 216;
    --bs-body-bg: #FAFBFC;
    --bs-body-color: #1e293b;
    --bs-body-font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
    --bs-border-color: #e2e8f0;
    --bs-border-color-translucent: rgba(30, 41, 59, .12);
    --bs-secondary-color: #64748b;
    --bs-tertiary-bg: #EEF2F7;
    --bs-link-color: #1d4ed8;
    --bs-link-color-rgb: 29, 78, 216;
    --bs-link-hover-color: #1e40af;
    --bs-link-hover-color-rgb: 30, 64, 175;
    --bs-border-radius: .6rem;
    --bs-border-radius-sm: .45rem;
    --bs-border-radius-lg: .85rem;
    --bs-heading-color: #1e293b;
}

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* ---- Botón primario (navy) ---- */
.btn-primary {
    --bs-btn-bg: #1d4ed8;
    --bs-btn-border-color: #1d4ed8;
    --bs-btn-hover-bg: #1e40af;
    --bs-btn-hover-border-color: #1e40af;
    --bs-btn-active-bg: #1e3a8a;
    --bs-btn-active-border-color: #1e3a8a;
    --bs-btn-disabled-bg: #1d4ed8;
    --bs-btn-disabled-border-color: #1d4ed8;
}

.btn-outline-primary {
    --bs-btn-color: #1d4ed8;
    --bs-btn-border-color: #1d4ed8;
    --bs-btn-hover-bg: #1d4ed8;
    --bs-btn-hover-border-color: #1d4ed8;
    --bs-btn-active-bg: #1e40af;
    --bs-btn-active-border-color: #1e40af;
}

/* ---- Botón naranja (acción primaria; Bootstrap no lo trae) ---- */
.btn-orange {
    --bs-btn-color: #fff;
    --bs-btn-bg: #f97316;
    --bs-btn-border-color: #f97316;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #ea580c;
    --bs-btn-hover-border-color: #ea580c;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #c2410c;
    --bs-btn-active-border-color: #c2410c;
    --bs-btn-disabled-bg: #f97316;
    --bs-btn-disabled-border-color: #f97316;
    --bs-btn-disabled-color: #fff;
}

/* ---- Foco temático ---- */
.form-control:focus,
.form-select:focus,
.form-check-input:focus,
.btn:focus-visible {
    border-color: #93c5fd;
    box-shadow: 0 0 0 .2rem rgba(29, 78, 216, .22);
}

.form-check-input:checked {
    background-color: #1d4ed8;
    border-color: #1d4ed8;
}

/* Inputs blancos */
.form-control,
.form-select {
    background-color: #fff;
    border-color: #e2e8f0;
}

.form-control:focus,
.form-select:focus {
    background-color: #fff;
}

/* Inputs readonly: que se vean igual de blancos (Bootstrap los grisea) */
.form-control[readonly],
.form-control:disabled,
.form-select:disabled {
    background-color: #fff;
    opacity: 1;
}

/* Quita el tinte azul/amarillo de Chrome autofill */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
    -webkit-text-fill-color: #1e293b !important;
    caret-color: #1e293b;
    transition: background-color 5000s ease-in-out 0s;
}

/* Caja del icono en input-group: naranja como el botón Guardar */
.input-group-text {
    background-color: #f97316;
    color: #fff;
    border-color: #f97316;
}

/* En el login (tarjeta cyan) los inputs siguen siendo blancos */
.login-card .form-control { background-color: #fff; }
.login-card .form-control:focus { background-color: #fff; }

.text-primary { color: #1d4ed8 !important; }
.bg-primary-subtle { background-color: #dbeafe !important; }
.text-bg-primary { background-color: #1d4ed8 !important; color: #fff !important; }

/* ---- Tablas y tarjetas ---- */
.table { --bs-table-bg: #fff; }
.table > thead {
    --bs-table-color: #64748b;
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .03em;
}
.card {
    --bs-card-border-color: #e2e8f0;
    --bs-card-cap-bg: #fff;
}

/* ============================================================
   Shell del layout
   ============================================================ */

.app-shell { display: flex; min-height: 100vh; }

.app-sidebar {
    width: 240px;
    flex-shrink: 0;
    background: linear-gradient(180deg, #1e40af 0%, #1e3a8a 100%);
    color: #fff;
    border-right: 0;
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
}

.app-content {
    flex: 1;
    min-width: 0;
    background: #FAFBFC;
}

.sidebar-logo {
    height: 36px;
    width: auto;
}

/* Nav del sidebar (Bootstrap nav-pills + matices del tema) */
.app-sidebar .nav-link {
    color: rgba(255, 255, 255, .72);
    font-size: .9rem;
    font-weight: 500;
    padding: .55rem .9rem;
    display: flex;
    align-items: center;
    gap: .6rem;
    position: relative;
}
.app-sidebar .nav-link:hover {
    background: rgba(255, 255, 255, .08);
    color: #fff;
}
.app-sidebar .nav-link.active {
    background: rgba(255, 255, 255, .12);
    color: #fff;
    font-weight: 600;
}
.app-sidebar .nav-link.active::before {
    content: "";
    position: absolute;
    left: 0;
    top: .35rem;
    bottom: .35rem;
    width: 3px;
    background: #f97316;
    border-radius: 2px;
}
.app-sidebar .nav-link svg {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}
/* Flecha indicadora de submenú — empujada a la derecha; rota al expandirse */
.app-sidebar .nav-link .nav-chevron {
    width: 15px;
    height: 15px;
    margin-left: auto;
    transition: transform .2s ease;
    opacity: .8;
}
.app-sidebar .nav-link[aria-expanded="true"] .nav-chevron {
    transform: rotate(180deg);
}

/* Botón destacado "Ver Documentación" — último ítem del menú */
.app-sidebar .nav-doc-wrap { margin-top: 16px; padding-top: 14px; border-top: 1px solid rgba(255, 255, 255, .14); }
.app-sidebar .nav-doc {
    background: linear-gradient(135deg, #0ea5e9, #6366f1);
    color: #fff !important; font-weight: 700; border-radius: 10px;
    box-shadow: 0 6px 16px rgba(79, 70, 229, .35);
    transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.app-sidebar .nav-doc:hover { background: linear-gradient(135deg, #0284c7, #4f46e5); color: #fff !important; transform: translateY(-1px); box-shadow: 0 10px 22px rgba(79, 70, 229, .45); }
.app-sidebar .nav-doc.active { outline: 2px solid rgba(255, 255, 255, .65); outline-offset: 1px; }
.app-sidebar .nav-doc svg { stroke: #fff; }
.app-sidebar .nav-doc::before { display: none !important; }

/* Iconos emoji en el sidebar — tamaño consistente con los SVG */
.app-sidebar .nav-emoji {
    width: 22px;
    font-size: 18px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    text-align: center;
    /* Fuentes de emoji a color en Windows / macOS / Linux */
    font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", "Segoe UI Symbol", sans-serif;
    /* Restaurar saturación natural sobre el sidebar oscuro */
    filter: saturate(1.15);
}

/* Bordes / tonos en el sidebar */
.app-sidebar .border-bottom,
.app-sidebar .border-top { border-color: rgba(255, 255, 255, .15) !important; }
.app-sidebar .text-secondary { color: rgba(255, 255, 255, .65) !important; }
.app-sidebar .btn-outline-secondary {
    --bs-btn-color: rgba(255, 255, 255, .85);
    --bs-btn-border-color: rgba(255, 255, 255, .35);
    --bs-btn-hover-bg: rgba(255, 255, 255, .12);
    --bs-btn-hover-border-color: rgba(255, 255, 255, .5);
    --bs-btn-hover-color: #fff;
}

@media (max-width: 768px) {
    .app-shell { flex-direction: column; }
    .app-sidebar {
        width: 100%;
        height: auto;
        position: static;
    }
}

/* ---- Marca usada en pantallas de auth (legacy) ---- */
/* ===== Toggle "ojito" para mostrar/ocultar contraseña ===== */
.pwd-wrap { position: relative; }
.btn-toggle-pwd {
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    background: transparent;
    border: 0;
    color: #64748b;
    padding: 4px;
    line-height: 0;
    cursor: pointer;
    border-radius: 6px;
    transition: color .15s, background .15s;
    z-index: 5;
}
.btn-toggle-pwd:hover { color: #0ea5e9; background: #f0f9ff; }
.btn-toggle-pwd:focus { outline: 2px solid #0ea5e9; outline-offset: 1px; }

/* ===== OTP (casillas de código de 6 dígitos) ===== */
.otp-wrap { user-select: none; }
.otp-cell {
    width: 44px;
    height: 52px;
    text-align: center;
    font-size: 22px;
    font-weight: 600;
    color: #0c4a6e;
    border: 1.5px solid #bae6fd;
    border-radius: 10px;
    background: #f8fbff;
    transition: border-color .15s, box-shadow .15s, background .15s;
}
.otp-cell:focus {
    outline: none;
    border-color: #0ea5e9;
    background: #fff;
    box-shadow: 0 0 0 3px rgba(14, 165, 233, .15);
}
.otp-cell:not(:placeholder-shown) { background: #fff; }
.otp-clear {
    width: 32px; height: 32px;
    border-radius: 50%;
    border: 1.5px solid #bae6fd;
    background: #f8fbff;
    color: #64748b;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all .15s;
    flex-shrink: 0;
}
.otp-clear:hover {
    background: #fee2e2;
    border-color: #fca5a5;
    color: #b91c1c;
}
.otp-clear:active { transform: scale(.94); }

.brand-mark {
    width: 34px;
    height: 34px;
    border-radius: 9px;
    background: linear-gradient(135deg, #1d4ed8, #1e3a8a);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    flex-shrink: 0;
}

/* ---- Avatares con iniciales en la lista ---- */
.avatar-init {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: .78rem;
    flex-shrink: 0;
}
.avatar-init.c1 { background: #FCE7F3; color: #BE185D; }
.avatar-init.c2 { background: #E0F2FE; color: #0369A1; }
.avatar-init.c3 { background: #EDE9FE; color: #6D28D9; }
.avatar-init.c4 { background: #FEF3C7; color: #A16207; }
.avatar-init.c5 { background: #DCFCE7; color: #15803D; }
.avatar-init.c6 { background: #FFE4E6; color: #BE123C; }
.avatar-init.c7 { background: #CFFAFE; color: #0E7490; }

/* ---- Avatar con foto en grillas ---- */
.avatar-foto {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
    border: 1px solid #e2e8f0;
}

/* ---- Subida de foto en formularios ---- */
.tbd-foto-wrap {
    display: flex;
    align-items: center;
    gap: 18px;
    flex-wrap: wrap;
}
.tbd-foto-prev {
    width: 144px;
    height: 144px;
    border-radius: 18px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #94a3b8;
    overflow: hidden;
    flex-shrink: 0;
}
.tbd-foto-prev img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.tbd-foto-ctrls {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.tbd-btn-foto,
.tbd-btn-foto-del {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 14px;
    border-radius: 9px;
    font-size: .82rem;
    font-weight: 600;
    cursor: pointer;
    border: 1px solid transparent;
    width: fit-content;
}
.tbd-btn-foto {
    background: #e0f2fe;
    color: #0369a1;
    border-color: #bae6fd;
}
.tbd-btn-foto:hover { background: #bae6fd; }
.tbd-btn-foto-del {
    background: #fef2f2;
    color: #b91c1c;
    border-color: #fecaca;
}
.tbd-btn-foto-del:hover { background: #fee2e2; }
.tbd-foto-hint {
    margin: 2px 0 0;
    font-size: .76rem;
    color: #94a3b8;
}

/* ---- Badges por rol ---- */
.badge-rol-estudiante { background: #DBEAFE; color: #1E40AF; }
.badge-rol-tutor      { background: #FEF3C7; color: #A16207; }
.badge-rol-psicologo  { background: #FCE7F3; color: #BE185D; }
.badge-rol-master     { background: #E0E7FF; color: #3730A3; }
.badge-rol-auditor    { background: #DCFCE7; color: #15803D; }

/* ---- Punto de estado en listas ---- */
.status-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    display: inline-block;
    flex-shrink: 0;
}

/* ---- Cabecera de tabla con fondo claro ---- */
.table > thead > tr > th {
    background-color: #F8FAFC;
    color: #64748b;
    font-weight: 600;
}

/* ---- Cabecera de sección con icono (Bootstrap no lo trae) ---- */
.section-icon {
    width: 32px;
    height: 32px;
    border-radius: .55rem;
    background: rgba(249, 115, 22, .14);
    color: #ea580c;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* ============================================================
   Pantallas de autenticación (login centrado, tarjeta azul)
   ============================================================ */

.auth-form-wrap { width: 100%; max-width: 420px; }
.auth-logo { height: 56px; width: auto; }

.login-card {
    background: linear-gradient(165deg, #53bfe6 0%, #3fa8d8 100%);
    border: 0;
    border-radius: 1.4rem;
    box-shadow: 0 22px 48px -16px rgba(39, 48, 74, .45);
    color: #fff;
}
.login-avatar {
    width: 96px;
    height: 96px;
    border-radius: 50%;
    margin: 0 auto -48px;
    background: #fff;
    box-shadow: 0 10px 22px -6px rgba(39, 48, 74, .28);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    position: relative;
    z-index: 2;
}
.login-avatar img { width: 100%; height: 100%; object-fit: contain; padding: 14px; }
.login-title { letter-spacing: .2em; font-weight: 600; }

.login-card .input-group-text { background: #fff; border: 0; color: #93a0c6; }
.login-card button.input-group-text { cursor: pointer; transition: color .15s; }
.login-card button.input-group-text:hover,
.login-card button.input-group-text:focus { color: #3fa8d8; outline: none; }
.login-card .form-control { border: 0; box-shadow: none; }
.login-card .form-control:focus { box-shadow: 0 0 0 .2rem rgba(255, 255, 255, .4); }
.login-card a { color: #fff; text-decoration: underline; }
.login-card a:hover { color: #eaf7fc; }
.login-card .form-check-label { color: #fff; }

/* ============================================================
   Tech Blue Dashboard (TBD)
   Estilos compartidos por las vistas:
     Usuarios/Index · _ListUsuarios · CreateEdit · Details
   Paleta: cian #bae6fd / azul oscuro #0c4a6e / acento naranja #f97316
   ============================================================ */

/* ---------- 1. Tarjetas base ---------- */
.tbd-card {
    background: #fff;
    border: 1px solid #bae6fd;
    border-radius: 16px;
    box-shadow: 0 4px 14px rgba(14, 165, 233, .08);
    overflow: hidden;
}
.tbd-card-det {
    background: #fff;
    border: 1px solid #bae6fd;
    border-radius: 16px;
    box-shadow: 0 4px 14px rgba(14, 165, 233, .08);
    overflow: hidden;
    height: 100%;
}

/* ---------- 2. Header de página (Index) ---------- */
.tbd-hdr { display: flex; align-items: center; gap: 18px; margin-bottom: 24px; }
.tbd-icon {
    width: 56px; height: 56px; border-radius: 16px;
    background: linear-gradient(135deg, #3b82f6, #0ea5e9);
    display: flex; align-items: center; justify-content: center;
    color: #fff; box-shadow: 0 8px 20px rgba(59, 130, 246, .35);
    position: relative; flex-shrink: 0;
}
.tbd-icon[data-count]::after {
    content: attr(data-count);
    position: absolute; top: -6px; right: -6px;
    background: #ef4444; color: #fff;
    min-width: 22px; height: 22px; padding: 0 6px;
    border-radius: 11px;
    font-size: 11px; font-weight: 700;
    display: flex; align-items: center; justify-content: center;
    border: 2px solid #fff;
}
.tbd-title {
    font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
    font-weight: 800; font-size: 30px;
    color: #0c4a6e; margin: 0; letter-spacing: -.7px;
}
.tbd-sub { font-size: 14px; color: #0369a1; margin: 3px 0 0; font-weight: 500; }

/* ---------- 3. Header dentro de tarjeta (CreateEdit / Details cards) ---------- */
.tbd-hdr-form {
    display: flex; align-items: center; gap: 16px;
    padding: 24px 28px;
    background: linear-gradient(180deg, #f0f9ff, #e0f2fe);
    border-bottom: 1px solid #bae6fd;
}
.tbd-hdr-det {
    display: flex; align-items: flex-start; gap: 18px;
    margin-bottom: 22px;
}
.tbd-back {
    width: 42px; height: 42px; border-radius: 12px;
    background: #fff; border: 1px solid #bae6fd;
    color: #0c4a6e;
    display: flex; align-items: center; justify-content: center;
    transition: all .15s; text-decoration: none; flex-shrink: 0;
}
.tbd-back:hover { background: #0ea5e9; color: #fff; border-color: #0ea5e9; }
.tbd-crumb {
    font-size: 12.5px; color: #0369a1; font-weight: 500;
    text-transform: uppercase; letter-spacing: 1px;
    margin: 0 0 4px;
}
.tbd-crumb a { color: inherit; text-decoration: none; }
.tbd-crumb a:hover { color: #0c4a6e; }
.tbd-title-form {
    font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
    font-weight: 800; font-size: 24px;
    color: #0c4a6e; margin: 0; letter-spacing: -.5px;
}
.tbd-sub-form { font-size: 13.5px; color: #0369a1; margin: 3px 0 0; font-weight: 500; }
.tbd-title-det {
    font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
    font-weight: 800; font-size: 28px;
    color: #0c4a6e; margin: 0; letter-spacing: -.6px;
}

/* ---------- 4. Botones ---------- */
.tbd-btn-nuevo,
.tbd-btn-save,
.tbd-btn-edit {
    background: linear-gradient(135deg, #fb923c, #f97316);
    color: #fff; border: none;
    padding: 10px 18px; border-radius: 12px;
    font-weight: 600; font-size: 14px;
    display: inline-flex; align-items: center; gap: 8px;
    box-shadow: 0 6px 14px rgba(249, 115, 22, .35);
    transition: all .2s;
    text-decoration: none;
}
.tbd-btn-nuevo:hover,
.tbd-btn-save:hover,
.tbd-btn-edit:hover {
    color: #fff; transform: translateY(-2px);
    box-shadow: 0 10px 20px rgba(249, 115, 22, .45);
    background: linear-gradient(135deg, #f97316, #ea580c);
}
.tbd-btn-save { padding: 9px 22px; border-radius: 10px; }
.tbd-btn-edit { padding: 10px 20px; border-radius: 11px; }
.tbd-btn-cancel {
    background: #fff; border: 1px solid #bae6fd;
    color: #0c4a6e;
    padding: 9px 22px; border-radius: 10px;
    font-weight: 600; font-size: 14px;
    text-decoration: none;
    display: inline-flex; align-items: center;
    transition: all .15s;
}
.tbd-btn-cancel:hover { background: #f0f9ff; color: #0c4a6e; }

/* ---------- 5. Toolbar (Index) ---------- */
.tbd-toolbar {
    background: linear-gradient(180deg, #f0f9ff, #e0f2fe) !important;
    border-bottom: 1px solid #bae6fd !important;
}

/* ---------- 6. Tabla (Index / _ListUsuarios) ---------- */
#tablaCrud { margin: 0; }
#tablaCrud thead th {
    font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
    font-weight: 700; font-size: 12px;
    letter-spacing: 1px; text-transform: uppercase;
    color: #0c4a6e;
    padding: 12px 16px;
    background: linear-gradient(180deg, #f0f9ff, #e0f2fe);
    border-bottom: 2px solid #bae6fd !important;
    border-top: none;
}
#tablaCrud tbody tr {
    transition: all .18s;
    border-left: 3px solid transparent;
}
#tablaCrud tbody tr:hover {
    background: #f0f9ff !important;
    border-left-color: #0ea5e9;
}
#tablaCrud tbody td {
    padding: 10px 16px;
    border-bottom: 1px solid #e0f2fe;
    font-size: 13px;
    color: #0c4a6e;
    vertical-align: middle;
}

/* ---------- 7. Badges de rol con degradado ---------- */
.tbd-role {
    color: #fff;
    padding: 4px 11px;
    border-radius: 7px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
    display: inline-block;
    line-height: 1.4;
}
.tbd-role-master      { background: linear-gradient(135deg, #3b82f6, #1e40af); }
.tbd-role-psicologo   { background: linear-gradient(135deg, #10b981, #0d9488); }
.tbd-role-tutor       { background: linear-gradient(135deg, #f59e0b, #d97706); }
.tbd-role-auditor     { background: linear-gradient(135deg, #8b5cf6, #6d28d9); }
.tbd-role-estudiante  { background: linear-gradient(135deg, #06b6d4, #0891b2); }
/* Variante grande para hero/detalle */
.tbd-role-hero {
    color: #fff; padding: 5px 14px; border-radius: 8px;
    font-size: 12.5px; font-weight: 600;
}

/* ---------- 8. Botones de acción (tabla) ---------- */
.tbd-act {
    width: 28px; height: 28px;
    border: none; border-radius: 8px;
    display: inline-flex; align-items: center; justify-content: center;
    transition: all .15s; font-weight: 600;
    padding: 0;
}
.tbd-act + .tbd-act { margin-left: 4px; }
.tbd-act-ver  { background: #dbeafe; color: #1e40af; }
.tbd-act-ver:hover  { background: #2563eb; color: #fff; transform: scale(1.08); }
.tbd-act-edit { background: #ccfbf1; color: #0f766e; }
.tbd-act-edit:hover { background: #14b8a6; color: #fff; transform: scale(1.08); }
.tbd-act-perm { background: #fef3c7; color: #a16207; }
.tbd-act-perm:hover { background: #f59e0b; color: #fff; transform: scale(1.08); }
.tbd-act-del  { background: #fee2e2; color: #b91c1c; }
.tbd-act-del:hover  { background: #ef4444; color: #fff; transform: scale(1.08); }
.tbd-act-pdf  { background: #ffe4e6; color: #be123c; }
.tbd-act-pdf:hover  { background: #e11d48; color: #fff; transform: scale(1.08); }
.tbd-act-entrev  { background: #ede9fe; color: #5b21b6; }
.tbd-act-entrev:hover  { background: #7c3aed; color: #fff; transform: scale(1.08); }
.tbd-act-disabled {
    background: #f1f5f9; color: #94a3b8;
    cursor: not-allowed; pointer-events: none; opacity: .75;
}

/* Encabezado y celda de acciones: en una sola línea */
#tablaCrud th.tbd-col-acciones,
#tablaCrud td.tbd-col-acciones { white-space: nowrap; }
/* Columna de rol más angosta para que quepan los botones de acción */
#tablaCrud th.tbd-col-rol,
#tablaCrud td.tbd-col-rol { width: 116px; }
/* Texto del badge de rol dentro de la grilla, 2 pt más pequeño */
#tablaCrud td.tbd-col-rol .tbd-role { font-size: 11px; }

/* ---------- 8b. Modal de confirmación global (ModalConfirm) ---------- */
.mc-content {
    border: none; border-radius: 18px; overflow: hidden;
    box-shadow: 0 24px 60px -16px rgba(12, 74, 110, .45);
}
.mc-header {
    display: flex; align-items: center; gap: 14px;
    padding: 22px 26px;
    background: linear-gradient(135deg, #0ea5e9, #0c4a6e);
    color: #fff;
}
.mc-icon {
    width: 44px; height: 44px; border-radius: 12px; flex-shrink: 0;
    display: flex; align-items: center; justify-content: center;
    background: rgba(255, 255, 255, .18);
}
.mc-title {
    font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
    font-weight: 800; font-size: 18px; margin: 0; letter-spacing: -.3px;
}
.mc-body {
    padding: 24px 26px;
    font-size: 14.5px; color: #0c4a6e; line-height: 1.55;
}
.mc-footer {
    padding: 16px 26px; background: #f0f9ff;
    border-top: 1px solid #bae6fd;
    display: flex; justify-content: flex-end; gap: 10px;
}
.mc-btn-cerrar {
    background: #fff; border: 1px solid #bae6fd; color: #0c4a6e;
    padding: 9px 20px; border-radius: 10px;
    font-weight: 600; font-size: 14px; transition: all .15s;
}
.mc-btn-cerrar:hover { background: #e0f2fe; }
.mc-btn-confirmar {
    border: none; color: #fff;
    padding: 9px 22px; border-radius: 10px;
    font-weight: 600; font-size: 14px; transition: all .2s;
    display: inline-flex; align-items: center; gap: 8px;
}
.mc-btn-confirmar:hover { color: #fff; transform: translateY(-2px); }
/* Variantes de color del botón Confirmar / icono según el tipo de acción */
.mc-peligro    .mc-btn-confirmar { background: linear-gradient(135deg, #f87171, #dc2626); box-shadow: 0 6px 14px rgba(220, 38, 38, .38); }
.mc-advertencia .mc-btn-confirmar { background: linear-gradient(135deg, #fb923c, #f97316); box-shadow: 0 6px 14px rgba(249, 115, 22, .38); }
.mc-info       .mc-btn-confirmar { background: linear-gradient(135deg, #38bdf8, #0284c7); box-shadow: 0 6px 14px rgba(2, 132, 199, .38); }
.mc-exito      .mc-btn-confirmar { background: linear-gradient(135deg, #34d399, #059669); box-shadow: 0 6px 14px rgba(5, 150, 105, .38); }

/* ---------- 9. Footer (paginación tabla / formulario) ---------- */
.tbd-foot { background: #f0f9ff; border-top: 1px solid #bae6fd; }
.tbd-foot-form {
    padding: 20px 28px;
    background: #f0f9ff;
    border-top: 1px solid #bae6fd;
    display: flex; justify-content: flex-end; gap: 10px;
}

/* ---------- 10. Sección con icono (CreateEdit, cards) ---------- */
.tbd-body { padding: 28px; }
.tbd-section { display: flex; align-items: center; gap: 10px; margin-bottom: 18px; margin-top: 6px; }
.tbd-section.mt0 { margin-top: 0; }
/* Recuadro de ayuda/aviso dentro de formularios */
.tbd-hint {
    padding: 12px 14px;
    background: #f0f9ff;
    border: 1px dashed #bae6fd;
    border-radius: 10px;
    font-size: 12.5px;
    color: #0369a1;
    margin-bottom: 18px;
}
.tbd-sicon {
    width: 32px; height: 32px; border-radius: 10px;
    background: #dbeafe; color: #1e40af;
    display: flex; align-items: center; justify-content: center;
}
.tbd-stitle {
    font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
    font-weight: 700; font-size: 14px;
    color: #0c4a6e; margin: 0;
}

/* ---------- 11. Inputs personalizados (CreateEdit) ---------- */
.tbd-label {
    font-size: 12.5px; font-weight: 600;
    color: #0c4a6e;
    margin-bottom: 6px; display: block;
}
.tbd-ig {
    display: flex; align-items: stretch;
    border: 1.5px solid #bae6fd; border-radius: 10px;
    overflow: hidden;
    transition: all .15s;
    background: #fff;
}
.tbd-ig:focus-within {
    border-color: #0ea5e9;
    box-shadow: 0 0 0 3px rgba(14, 165, 233, .15);
}
.tbd-pre {
    width: 42px;
    background: #f0f9ff; color: #0369a1;
    display: flex; align-items: center; justify-content: center;
    border-right: 1px solid #bae6fd;
    flex-shrink: 0;
}
.tbd-inp {
    flex: 1; border: none; outline: none;
    padding: 9px 12px;
    font-size: 14px; color: #0c4a6e;
    background: transparent;
    min-width: 0;
}
.tbd-inp[readonly] { background: #f0f9ff; color: #64748b; cursor: not-allowed; }
/* Selector de color (input type=color) en formularios */
.tbd-color {
    width: 54px; height: 40px;
    padding: 4px;
    border: 1.5px solid #bae6fd; border-radius: 10px;
    background: #fff; cursor: pointer;
}
.tbd-sel {
    border: 1.5px solid #bae6fd; border-radius: 10px;
    padding: 9px 12px; width: 100%;
    font-size: 14px; color: #0c4a6e;
    background: #fff;
    transition: all .15s;
}
.tbd-sel:focus {
    border-color: #0ea5e9; outline: none;
    box-shadow: 0 0 0 3px rgba(14, 165, 233, .15);
}

/* Select2 alineado al estilo .tbd-sel — mismo alto, color, borde y focus. */
.select2-container--default .select2-selection--single {
    height: 42px;
    border: 1.5px solid #bae6fd;
    border-radius: 10px;
    background: #fff;
    transition: all .15s;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #0c4a6e;
    font-size: 14px;
    line-height: 38px;
    padding-left: 12px;
    padding-right: 32px;
    /* Trunca el texto largo con puntos suspensivos en vez de desbordar. */
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* El contenedor de select2 nunca debe exceder su columna. */
.select2-container { max-width: 100%; }
/* En layouts flex (combo select2 + botón "+"), el item flex debe poder encoger
   por debajo del ancho de su contenido; sin esto (min-width:auto por defecto)
   el texto largo empuja/superpone el botón horizontalmente. */
#formEntrevista .flex-grow-1 { min-width: 0; }
.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 40px;
}
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--single {
    border-color: #0ea5e9;
    box-shadow: 0 0 0 3px rgba(14, 165, 233, .15);
}
.select2-container--default .select2-search--dropdown .select2-search__field {
    border: 1.5px solid #bae6fd;
    border-radius: 8px;
    padding: 7px 10px;
    font-size: 14px;
    color: #0c4a6e;
}
.select2-container--default .select2-search--dropdown .select2-search__field:focus {
    border-color: #0ea5e9;
    outline: none;
    box-shadow: 0 0 0 3px rgba(14, 165, 233, .15);
}
.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #0ea5e9;
}
.tbd-toggle {
    background: transparent; border: none;
    border-left: 1px solid #bae6fd;
    padding: 0 14px;
    color: #0369a1; font-size: 12.5px; font-weight: 600;
    cursor: pointer;
    transition: background .15s;
}
.tbd-toggle:hover { background: #e0f2fe; }
.tbd-err { display: block; font-size: 12px; color: #dc2626; margin-top: 4px; }

/* Contenedor del switch (.form-check.form-switch).
   NO usar `padding: 7px 0` porque Bootstrap requiere el padding-left
   (1.5em para checkbox, 2.5em para switch) — el input flota a la izquierda
   con margin-left negativo. Sin ese padding, el switch sale del contenedor. */
.tbd-switch-wrap {
    margin-top: 6px;
    padding-top: 7px;
    padding-bottom: 7px;
}
.tbd-switch-wrap .form-check-label {
    color: #0c4a6e;
    font-weight: 500;
    cursor: pointer;
    user-select: none;
}
.tbd-switch-wrap .form-check-input:checked {
    background-color: #0ea5e9;
    border-color: #0ea5e9;
}
.tbd-switch-wrap .form-check-input:focus {
    border-color: #0ea5e9;
    box-shadow: 0 0 0 3px rgba(14, 165, 233, .15);
}

/* ---------- 12. Hero (Details) ---------- */
.tbd-hero {
    background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
    border: 1px solid #bae6fd; border-radius: 16px;
    padding: 28px;
    display: flex; align-items: center; gap: 22px;
    margin-bottom: 18px;
    box-shadow: 0 4px 14px rgba(14, 165, 233, .08);
}
.tbd-hero-av {
    width: 84px; height: 84px; border-radius: 50%;
    background: linear-gradient(135deg, #3b82f6, #0ea5e9);
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-weight: 800; font-size: 30px;
    box-shadow: 0 8px 22px rgba(14, 165, 233, .35);
    flex-shrink: 0;
}
.tbd-hero-av-foto {
    width: 84px; height: 84px; border-radius: 50%;
    object-fit: cover;
    box-shadow: 0 8px 22px rgba(14, 165, 233, .35);
    flex-shrink: 0;
    border: 2px solid #fff;
}
.tbd-hero-info { flex: 1; min-width: 0; }
.tbd-hero-nm {
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-weight: 800; font-size: 22px;
    color: #0c4a6e; margin: 0 0 4px;
}
.tbd-hero-em { font-size: 14px; color: #0369a1; margin: 0 0 10px; }
.tbd-hero-tags { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }

/* ---------- 13. Estado activo/inactivo (Details) ---------- */
.tbd-st-act {
    background: #dcfce7; color: #15803d;
    padding: 5px 12px; border-radius: 8px;
    font-size: 12.5px; font-weight: 600;
    display: inline-flex; align-items: center; gap: 6px;
}
.tbd-st-ina {
    background: #fee2e2; color: #b91c1c;
    padding: 5px 12px; border-radius: 8px;
    font-size: 12.5px; font-weight: 600;
    display: inline-flex; align-items: center; gap: 6px;
}

/* ---------- 14. Tarjetas de información (Details) ---------- */
.tbd-card-hdr {
    display: flex; align-items: center; gap: 10px;
    padding: 16px 22px;
    background: linear-gradient(180deg, #f0f9ff, #e0f2fe);
    border-bottom: 1px solid #bae6fd;
}
.tbd-card-icon {
    width: 32px; height: 32px; border-radius: 10px;
    background: #dbeafe; color: #1e40af;
    display: flex; align-items: center; justify-content: center;
}
.tbd-card-title {
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-weight: 700; font-size: 14px;
    color: #0c4a6e; margin: 0; flex: 1;
}
.tbd-card-badge {
    background: #0ea5e9; color: #fff;
    padding: 2px 10px; border-radius: 999px;
    font-size: 11.5px; font-weight: 700;
}
.tbd-card-body { padding: 22px; }

/* ---------- 15. Lista de definiciones (Details) ---------- */
.tbd-dl { margin: 0; }
.tbd-dl-row {
    display: grid; grid-template-columns: 160px 1fr;
    gap: 10px;
    padding: 11px 0;
    border-bottom: 1px dashed #e0f2fe;
}
.tbd-dl-row:last-child { border-bottom: none; padding-bottom: 0; }
.tbd-dl-row:first-child { padding-top: 0; }
.tbd-dt {
    font-size: 12.5px; font-weight: 600; color: #0369a1;
    text-transform: uppercase; letter-spacing: .5px;
}
.tbd-dd { font-size: 14px; color: #0c4a6e; font-weight: 500; margin: 0; }
.tbd-dd-strong { font-weight: 700; }

/* ---------- 16. Chips de permisos (Details) ---------- */
.tbd-perm-empty {
    text-align: center; padding: 24px 8px;
    color: #64748b; font-size: 13.5px;
}
.tbd-perm-empty svg { margin-bottom: 8px; color: #bae6fd; }
.tbd-perm-chip {
    display: inline-flex; align-items: center; gap: 6px;
    background: #f0f9ff; color: #0c4a6e;
    border: 1px solid #bae6fd;
    padding: 6px 12px; border-radius: 999px;
    font-size: 12.5px; font-weight: 600;
}
.tbd-perm-chip::before {
    content: ''; width: 6px; height: 6px; border-radius: 50%;
    background: #0ea5e9;
}

/* ============================================================
   Importaciones (Estudiantes / Trazabilidades)
   ============================================================ */
.imp-step { display:flex; gap:16px; padding:22px 24px; border-bottom:1px solid #e0f2fe; }
.imp-step:last-child { border-bottom:none; }
.imp-num {
    width:38px; height:38px; border-radius:50%; flex-shrink:0;
    background:linear-gradient(135deg,#0ea5e9,#0c4a6e); color:#fff;
    display:flex; align-items:center; justify-content:center;
    font-weight:800; font-size:16px;
    font-family:'Plus Jakarta Sans','Inter',sans-serif;
}
.imp-step-body { flex:1; min-width:0; }
.imp-step-title { font-weight:700; font-size:15px; color:#0c4a6e; margin:0 0 3px; }
.imp-step-desc  { font-size:13px; color:#5d6680; margin:0 0 12px; }
.imp-file {
    border:1.6px dashed #7dd3fc; border-radius:11px;
    padding:9px 12px; font-size:14px; color:#0c4a6e; background:#f0f9ff;
    width:100%; max-width:440px;
}
.imp-btn {
    border:none; border-radius:10px; padding:9px 20px;
    font-weight:600; font-size:14px; cursor:pointer;
    display:inline-flex; align-items:center; gap:8px; transition:all .18s;
    text-decoration:none;
}
.imp-btn-plantilla { background:#dbeafe; color:#1e40af; }
.imp-btn-plantilla:hover { background:#2563eb; color:#fff; }
.imp-btn-cargar {
    background:linear-gradient(135deg,#38bdf8,#0284c7); color:#fff;
    box-shadow:0 6px 14px rgba(2,132,199,.32);
}
.imp-btn-cargar:hover { color:#fff; transform:translateY(-2px); }
.imp-btn-agregar {
    background:linear-gradient(135deg,#34d399,#059669); color:#fff;
    box-shadow:0 6px 14px rgba(5,150,105,.34);
}
.imp-btn-agregar:hover { color:#fff; transform:translateY(-2px); }
.imp-resumen {
    background:#ecfdf5; border:1px solid #a7f3d0; border-radius:11px;
    padding:10px 14px; font-size:13.5px; color:#065f46; margin-bottom:14px;
    display:flex; align-items:center; gap:8px;
}
#tablaPreview th { font-size:11px; }
#tablaPreview td { font-size:12.5px; }

/* ---- Overlay de procesamiento (loader) ---- */
.imp-overlay {
    position:fixed; inset:0; z-index:2000;
    background:rgba(15,23,42,.55); backdrop-filter:blur(2px);
    display:flex; align-items:center; justify-content:center;
}
.imp-overlay-card {
    background:#fff; border-radius:14px; padding:22px 30px;
    box-shadow:0 18px 46px rgba(2,132,199,.28);
    display:flex; align-items:center; gap:16px; max-width:380px;
}
.imp-overlay-spinner {
    width:38px; height:38px; border-radius:50%;
    border:4px solid #e0f2fe; border-top-color:#0284c7;
    animation:impSpin .85s linear infinite;
    flex-shrink:0;
}
@keyframes impSpin { to { transform:rotate(360deg); } }
.imp-overlay-text { font-size:14.5px; color:#0c4a6e; font-weight:600; line-height:1.35; }
.imp-overlay-sub  { font-size:12.5px; color:#5d6680; font-weight:400; margin-top:3px; }

/* ---- Chip de color de riesgo en grilla de estudiantes ---- */
.tbd-riesgo-chip {
    display:inline-block;
    width:22px; height:22px; border-radius:6px;
    box-shadow:0 0 0 1px rgba(15,23,42,.10), inset 0 -1px 0 rgba(15,23,42,.08);
    cursor:help;
    vertical-align:middle;
}

/* ============================================================
   Buscador de estudiante (compartido por Entrevista Inicial y Consultas)
   ============================================================ */
.ent-search       { display: flex; flex-direction: column; gap: 10px; margin-bottom: 16px; }
.ent-criteria     { display: flex; gap: 14px; flex-wrap: wrap; }
.ent-radio        { display: inline-flex; gap: 6px; align-items: center; padding: 6px 12px; border-radius: 10px; background: #f0f9ff; border: 1.5px solid #bae6fd; cursor: pointer; font-size: 13px; color: #0c4a6e; }
.ent-radio:has(input:checked) { background: #0ea5e9; color: #fff; border-color: #0ea5e9; }
.ent-buscar-row   { display: flex; gap: 8px; align-items: stretch; }
.ent-msg          { padding: 8px 12px; border-radius: 8px; font-size: 13px; }
.ent-msg.error    { background: #fee2e2; color: #b91c1c; }

/* ---- Autocomplete del buscador de estudiantes (Entrevista Inicial) ----
   Usa position:fixed (no absolute) para que el dropdown se renderice
   relativo al viewport y NO sea recortado por contenedores ancestros
   con overflow:hidden (p.ej. .tbd-card). Las coordenadas top/left/width
   las calcula el JS desde el rect del input al abrir el dropdown. */
.ent-autocomplete-wrap { position: relative; }
.ent-autocomplete {
    position: fixed;
    z-index: 1080;
    background: #fff;
    border: 1px solid #bae6fd;
    border-radius: 10px;
    box-shadow: 0 12px 28px rgba(2, 132, 199, .18);
    max-height: 320px; overflow-y: auto;
    padding: 4px 0;
}
.ent-autocomplete-item {
    padding: 8px 12px;
    cursor: pointer;
    transition: background .12s;
    border-bottom: 1px solid #f1f5f9;
}
.ent-autocomplete-item:last-child { border-bottom: none; }
.ent-autocomplete-item:hover,
.ent-autocomplete-item.is-active   { background: #f0f9ff; }
.ent-autocomplete-name             { font-size: 13.5px; font-weight: 600; color: #0c4a6e; }
.ent-autocomplete-meta             { font-size: 11.5px; color: #64748b; margin-top: 2px; display: flex; gap: 8px; flex-wrap: wrap; }
.ent-autocomplete-meta span        { display: inline-flex; align-items: center; gap: 4px; }
.ent-autocomplete-meta strong      { color: #0369a1; font-weight: 600; }
.ent-autocomplete-empty            { padding: 12px; text-align: center; color: #94a3b8; font-size: 12.5px; }

/* ---- Banner de borrador recuperado (autoguardado del form de entrevista) ---- */
.ent-borrador-banner {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    padding: 10px 14px;
    background: #eff6ff; border: 1px solid #93c5fd; border-radius: 10px;
    color: #1e40af; font-size: 13px;
    margin-bottom: 12px;
}
.ent-borrador-banner strong { color: #1e3a8a; }
.ent-borrador-banner .ent-borrador-actions { display: flex; gap: 6px; flex-shrink: 0; }
.ent-borrador-btn { padding: 5px 12px; border-radius: 8px; font-size: 12.5px; font-weight: 600; cursor: pointer; border: none; transition: background .15s; }
.ent-borrador-btn-primary    { background: #2563eb; color: #fff; }
.ent-borrador-btn-primary:hover    { background: #1e40af; }
.ent-borrador-btn-secondary  { background: #fff; color: #475569; border: 1px solid #cbd5e1; }
.ent-borrador-btn-secondary:hover  { background: #f1f5f9; }

/* Flash visual al restaurar un campo desde el autoguardado. */
@keyframes entBorradorFlash {
    0%   { background-color: #fef9c3; box-shadow: 0 0 0 3px rgba(253, 224, 71, .65); }
    100% { background-color: transparent; box-shadow: 0 0 0 0 transparent; }
}
.ent-borrador-flash { animation: entBorradorFlash 1.1s ease-out; }

/* ============================================================
   Consultas (lista de actividades + detalle de entrevista)
   ============================================================ */

/* Body padding compartido */
.cons-card .tbd-body,
.det-card .tbd-body { padding: 18px 24px 24px; }

/* ---- Ficha del estudiante (mismo bloque en lista y en detalle) ---- */
.cons-ficha,
.det-ficha { display: flex; gap: 16px; padding: 14px 16px; border-radius: 14px; background: linear-gradient(135deg, #f0f9ff, #ede9fe); border: 1px solid #bae6fd; }
.cons-ficha-avatar { flex-shrink: 0; }
.cons-iniciales { width: 64px; height: 64px; border-radius: 50%; background: linear-gradient(135deg, #0ea5e9, #8b5cf6); color: #fff; font-size: 22px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.cons-ficha-body { flex: 1; min-width: 0; }
.cons-ficha-row,
.det-ficha-row  { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 6px; flex-wrap: wrap; }
.cons-ficha-name,
.det-ficha-name { font-size: 18px; font-weight: 700; color: #0c4a6e; }
.cons-riesgo-tag,
.det-riesgo-tag { padding: 3px 10px; border-radius: 999px; font-size: 11.5px; font-weight: 600; }
.cons-ficha-meta,
.det-ficha-meta { display: flex; flex-wrap: wrap; gap: 14px; font-size: 12.5px; color: #475569; margin-top: 4px; }
.cons-ficha-meta strong,
.det-ficha-meta strong { color: #0c4a6e; font-weight: 600; }

/* ---- KPIs (lista) ---- */
.cons-kpis     { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; }
.cons-kpi      { display: flex; align-items: center; gap: 12px; padding: 14px; background: #fff; border: 1px solid #e2e8f0; border-radius: 14px; }
.cons-kpi-icon { width: 38px; height: 38px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.cons-kpi-num  { font-size: 22px; font-weight: 800; color: #0c4a6e; line-height: 1; }
.cons-kpi-lbl  { font-size: 12.5px; color: #64748b; margin-top: 2px; }

/* ---- Filtros (lista) ---- */
.cons-filtros       { padding: 14px 16px; border-radius: 14px; background: #f8fbff; border: 1px solid #e0f2fe; }
.cons-filtros-title { font-size: 13px; font-weight: 700; color: #0c4a6e; margin-bottom: 8px; }
.cons-filtros-row   { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; }
.cons-filtros-row .tbd-label { font-size: 11.5px; color: #475569; margin-bottom: 3px; }

/* ---- Timeline horizontal (lista) ---- */
.cons-timeline-hdr   { margin-bottom: 8px; }
.cons-timeline-title { font-size: 15px; font-weight: 700; color: #0c4a6e; margin: 0; }
.cons-timeline-sub   { font-size: 12px; color: #64748b; margin: 2px 0 0 0; }
.cons-timeline {
    display: flex; gap: 12px;
    overflow-x: auto; overflow-y: hidden;
    padding: 8px 4px 14px;
    scrollbar-width: thin;
    scroll-behavior: smooth;
}
.cons-timeline::-webkit-scrollbar { height: 8px; }
.cons-timeline::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 8px; }
.cons-timeline::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

.cons-card-act {
    --card-color: #0ea5e9;
    flex: 0 0 220px;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-left: 4px solid var(--card-color);
    border-radius: 12px;
    padding: 12px 14px;
    display: flex; flex-direction: column; gap: 6px;
    transition: transform .12s, box-shadow .12s;
}
.cons-card-act:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(15, 23, 42, .08); }
.cons-card-act.is-clickable { cursor: pointer; }
.cons-card-act.is-clickable:hover { border-color: var(--card-color); }
.cons-card-top       { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.cons-card-top-right { display: inline-flex; align-items: center; gap: 6px; }
.cons-chip           { font-size: 10.5px; font-weight: 800; letter-spacing: .5px; color: #fff; padding: 3px 8px; border-radius: 999px; }
.cons-pendiente      { font-size: 10.5px; font-weight: 700; color: #92400e; background: #fef3c7; padding: 2px 8px; border-radius: 999px; }
.cons-card-pdf       { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 7px; background: #fff; border: 1.4px solid #bae6fd; color: #0369a1; text-decoration: none; transition: all .15s; }
.cons-card-pdf:hover { background: #0ea5e9; border-color: #0ea5e9; color: #fff; transform: translateY(-1px); }
.cons-card-tipo   { font-size: 14px; font-weight: 700; color: #0c4a6e; }
.cons-card-fecha  { font-size: 12.5px; color: #475569; }
.cons-card-hora   { color: #64748b; }
.cons-card-prof   { display: flex; align-items: center; gap: 6px; font-size: 12px; color: #1e293b; }
.cons-card-prof small { color: #94a3b8; }
.cons-card-mat    { display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: #4338ca; }
.cons-card-mat svg { color: #6366f1; flex: 0 0 auto; }
.cons-card-solic  { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; color: #5b21b6; background: #ede9fe; padding: 2px 8px; border-radius: 999px; align-self: flex-start; }
.cons-card-obs    { font-size: 11.5px; color: #64748b; max-height: 36px; overflow: hidden; line-height: 1.4; }

.cons-empty { padding: 24px; text-align: center; color: #64748b; font-size: 13px; background: #f8fafc; border-radius: 12px; border: 1px dashed #cbd5e1; }

/* ---- Detalle de entrevista ---- */
.det-actions               { display: flex; gap: 8px; align-items: center; }
.det-actions .tbd-btn-save { display: inline-flex; align-items: center; gap: 6px; }
.det-section { display: flex; align-items: center; gap: 8px; padding: 6px 0 4px; border-bottom: 1.5px solid #e0f2fe; margin-bottom: 6px; }
.det-stitle  { margin: 0; font-size: 14px; font-weight: 700; color: #0c4a6e; }

/* ---- Consulta de Entrevistas (filtros + grilla) ---- */
.cons-ent-form { width: 100%; }
.cons-ent-filtros {
    display: flex;
    flex-wrap: wrap;          /* en pantallas angostas los filtros bajan de línea */
    gap: 12px;
    align-items: end;         /* alinea inputs y el botón Limpiar por su base */
}
/* Anchos por filtro: Año/Mes/Tipo compactos; Estudiante crece para que el box
   de búsqueda quede ancho. Limpiar queda al final, en la misma fila. */
.cons-f { min-width: 0; }
.cons-f-entrevistador { flex: 0 0 210px; }
.cons-f-anio          { flex: 0 0 90px; }
.cons-f-mes           { flex: 0 0 140px; }
.cons-f-tipo          { flex: 0 0 165px; }
.cons-ent-estudiante  { position: relative; min-width: 0; flex: 1 1 300px; }
.cons-f-acciones      { flex: 0 0 auto; display: flex; align-items: center; gap: 10px; }

/* Loader de "Descargar Carpetas": overlay a pantalla completa mientras el
   servidor genera y comprime los PDF. */
.descarga-loader {
    position: fixed; inset: 0; z-index: 1080;
    display: flex; align-items: center; justify-content: center;
    background: rgba(15, 23, 42, .45); backdrop-filter: blur(2px);
}
.descarga-loader-box {
    display: flex; flex-direction: column; align-items: center; gap: 14px;
    background: #fff; border: 1px solid #bae6fd; border-radius: 14px;
    padding: 26px 34px; box-shadow: 0 14px 40px rgba(15, 23, 42, .25);
    max-width: 340px; text-align: center;
}
.descarga-loader-spin { width: 2.6rem; height: 2.6rem; color: #0ea5e9; }
.descarga-loader-txt  { font-size: 14px; font-weight: 700; color: #0c4a6e; }
.descarga-loader-txt small { display: block; margin-top: 4px; font-weight: 500; color: #64748b; }

/* ===================== Histórico / trazabilidad del estudiante ===================== */
.hist-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; }
.hist-card { display: flex; align-items: center; gap: 12px; background: #fff; border: 1px solid #e2e8f0; border-left: 4px solid var(--c, #0ea5e9); border-radius: 12px; padding: 14px 16px; box-shadow: 0 2px 8px rgba(15, 23, 42, .04); }
.hist-card-ic { flex: 0 0 auto; width: 38px; height: 38px; border-radius: 10px; display: flex; align-items: center; justify-content: center; background: #f1f5f9; background: color-mix(in srgb, var(--c) 15%, #fff); color: var(--c); }
.hist-card-ic svg { width: 20px; height: 20px; }
.hist-card-num { font-size: 19px; font-weight: 800; color: #0f172a; line-height: 1.1; }
.hist-card-lbl { font-size: 12px; color: #64748b; font-weight: 600; margin-top: 2px; }

.hist-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 860px) { .hist-grid { grid-template-columns: 1fr; } }
.hist-panel { background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; padding: 14px 16px; }
.hist-panel-hdr { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; color: #0c4a6e; }
.hist-panel-hdr svg { width: 17px; height: 17px; }
.hist-panel-hdr h3 { font-size: 14px; font-weight: 700; margin: 0; }
.hist-empty { font-size: 13px; color: #94a3b8; padding: 8px 0; }

.hist-sem-track { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 6px; }
.hist-sem-hito { flex: 0 0 auto; display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 92px; padding: 8px; border: 1px solid #f1f5f9; border-radius: 10px; background: #f8fafc; }
.hist-sem-dot { width: 18px; height: 18px; border-radius: 50%; box-shadow: 0 0 0 3px rgba(0, 0, 0, .05); }
.hist-sem-nom { font-size: 12px; font-weight: 700; color: #334155; text-align: center; }
.hist-sem-fec { font-size: 11px; color: #64748b; }

.hist-bars { display: flex; flex-direction: column; gap: 8px; }
.hist-bar-row { display: grid; grid-template-columns: 130px 1fr 28px; align-items: center; gap: 8px; }
.hist-bar-lbl { font-size: 12px; color: #334155; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hist-bar-track { height: 12px; background: #eef2ff; border-radius: 999px; overflow: hidden; }
.hist-bar-fill { display: block; height: 100%; background: linear-gradient(90deg, #6366f1, #818cf8); border-radius: 999px; }
.hist-bar-num { font-size: 12px; font-weight: 700; color: #4338ca; text-align: right; }

.hist-tl-hdr { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.hist-tl-hdr h3 { font-size: 15px; font-weight: 800; color: #0f172a; margin: 0; }
.hist-tl-sub { font-size: 12px; color: #64748b; }
.hist-mes { border: 1px solid #e2e8f0; border-radius: 12px; margin-top: 10px; overflow: hidden; background: #fff; }
.hist-mes-sum { display: flex; align-items: center; gap: 10px; padding: 12px 14px; cursor: pointer; list-style: none; user-select: none; font-weight: 700; color: #0c4a6e; }
.hist-mes-sum::-webkit-details-marker { display: none; }
.hist-mes-chev { display: inline-flex; transition: transform .2s; color: #0ea5e9; }
.hist-mes-chev svg { width: 16px; height: 16px; }
.hist-mes[open] .hist-mes-chev { transform: rotate(90deg); }
.hist-mes-nom { flex: 1 1 auto; }
.hist-mes-cnt { font-size: 12px; font-weight: 600; color: #0369a1; background: #e0f2fe; padding: 2px 10px; border-radius: 999px; }
.hist-mes-body { padding: 4px 14px 12px; display: flex; flex-direction: column; gap: 6px; }

/* Sub-acordeones por categoría dentro de cada mes. */
.hist-sub { border: 1px solid #eef2f7; border-radius: 10px; background: #fff; overflow: hidden; }
.hist-sub-sum { display: flex; align-items: center; gap: 9px; padding: 9px 12px; cursor: pointer; list-style: none; user-select: none; }
.hist-sub-sum::-webkit-details-marker { display: none; }
.hist-sub-chev { display: inline-flex; transition: transform .2s; color: #94a3b8; }
.hist-sub-chev svg { width: 14px; height: 14px; }
.hist-sub[open] .hist-sub-chev { transform: rotate(90deg); }
.hist-sub-dot { width: 10px; height: 10px; border-radius: 50%; flex: 0 0 auto; }
.hist-sub-nom { flex: 1 1 auto; font-size: 13px; font-weight: 700; color: #334155; }
.hist-sub-cnt { font-size: 11px; font-weight: 700; color: #fff; background: var(--c, #64748b); padding: 1px 9px; border-radius: 999px; }
.hist-sub-body { padding: 0 10px 10px; display: flex; flex-direction: column; gap: 6px; }

/* ===== Tarjetas clicables + modales de detalle del histórico ===== */
.hist-card-click { cursor: pointer; position: relative; transition: transform .12s ease, box-shadow .12s ease; }
.hist-card-click:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(2,6,23,.10); }
.hist-card-click:focus-visible { outline: 2px solid var(--c); outline-offset: 2px; }
.hist-card-more { position: absolute; top: 8px; right: 8px; width: 22px; height: 22px; display: flex; align-items: center; justify-content: center; border-radius: 7px; color: var(--c); background: rgba(255,255,255,.75); box-shadow: 0 0 0 1px rgba(2,6,23,.06); }
.hist-card-more svg { width: 13px; height: 13px; }

.hist-modal .modal-content { border: none; border-radius: 16px; overflow: hidden; }
.hist-modal .modal-header { border-bottom: 1px solid #eef2f7; padding: 14px 18px 14px 22px; position: relative; }
.hist-modal .modal-header::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px; background: var(--c, #6366f1); }
.hist-modal .modal-title { font-size: 15px; font-weight: 800; color: #0f172a; }
.hist-modal .modal-body { padding: 14px 18px; background: #f8fafc; display: flex; flex-direction: column; gap: 10px; }
.hd-item { background: #fff; border: 1px solid #eef2f7; border-radius: 12px; padding: 12px 14px; }
.hd-item-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 7px; }
.hd-fecha { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 800; color: #334155; }
.hd-fecha svg { width: 15px; height: 15px; color: #64748b; }
.hd-tag { font-size: 11.5px; font-weight: 700; color: #3730a3; background: #eef2ff; border-radius: 999px; padding: 2px 10px; }
.hd-tag-cambio { color: #92400e; background: #fef3c7; }
.hd-prof { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; color: #475569; margin-bottom: 6px; }
.hd-prof svg { width: 15px; height: 15px; color: #94a3b8; }
.hd-obs { font-size: 12.5px; color: #475569; line-height: 1.45; white-space: pre-line; }
.hd-cambio { font-size: 13px; font-weight: 700; color: #0f172a; margin-bottom: 6px; }
.hd-mat { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: #4338ca; margin-bottom: 6px; }
.hd-mat svg { width: 15px; height: 15px; color: #6366f1; flex: 0 0 auto; }
.hd-mat-vacia { color: #94a3b8; }
.hd-mat-vacia svg { color: #cbd5e1; }
.hd-mat-vacia strong { font-weight: 600; }

.hist-evo-banner { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: #92400e; background: #fffbeb; border: 1px solid #fde68a; border-radius: 10px; padding: 9px 12px; margin-bottom: 10px; }
.hist-evo-banner svg { width: 16px; height: 16px; flex: 0 0 auto; }
.hist-evo-table { display: flex; flex-direction: column; gap: 6px; }
.hist-evo-row { display: grid; grid-template-columns: 1fr 1fr 2fr 1.2fr 1fr; gap: 10px; align-items: center; padding: 9px 12px; border-radius: 10px; background: #fff; border: 1px solid #eef2f7; font-size: 12.5px; color: #334155; }
.hist-evo-head { background: #f1f5f9; border: none; font-weight: 800; color: #475569; font-size: 11px; text-transform: uppercase; letter-spacing: .3px; }
.hist-evo-cambio { border-color: #fcd34d; background: #fffbeb; }
.hist-evo-chip { font-size: 10.5px; font-weight: 700; color: #92400e; background: #fde68a; border-radius: 999px; padding: 1px 8px; margin-left: 4px; }
@media (max-width: 700px) {
    .hist-evo-head { display: none; }
    .hist-evo-row { grid-template-columns: 1fr; gap: 3px; }
    .hist-evo-row span::before { content: attr(data-lbl) ": "; font-weight: 700; color: #94a3b8; }
}

/* ===================== Análisis con IA (DeepSeek) ===================== */
.ia-panel { border: 1px solid #ddd6fe; border-radius: 14px; padding: 16px; background: linear-gradient(180deg, #faf5ff, #f5f3ff); }
.ia-hdr { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.ia-hdr-l { display: flex; align-items: center; gap: 12px; }
.ia-hdr-ic { flex: 0 0 auto; width: 40px; height: 40px; border-radius: 11px; display: flex; align-items: center; justify-content: center; background: #ede9fe; color: #7c3aed; }
.ia-hdr-ic svg { width: 22px; height: 22px; }
.ia-title { font-size: 15px; font-weight: 800; color: #5b21b6; margin: 0; }
.ia-sub { font-size: 12px; color: #6d28d9; margin: 0; opacity: .85; }
.ia-btn { background: linear-gradient(90deg, #7c3aed, #a855f7); border: none; }
.ia-loader { margin-top: 12px; display: flex; align-items: center; gap: 10px; font-size: 13px; font-weight: 600; color: #6d28d9; }
.ia-loader .spinner-border { color: #7c3aed; }
.ia-error { margin-top: 12px; font-size: 13px; color: #b91c1c; background: #fee2e2; border: 1px solid #fca5a5; border-radius: 8px; padding: 8px 12px; }
.ia-result { margin-top: 14px; }
.ia-bars { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 18px; }
@media (max-width: 720px) { .ia-bars { grid-template-columns: 1fr; } }
.ia-bar-row { background: #fff; border: 1px solid #ede9fe; border-radius: 10px; padding: 10px 12px; }
.ia-bar-lbl { display: block; font-size: 12.5px; font-weight: 700; color: #334155; margin-bottom: 7px; }
.ia-bar-line { display: flex; align-items: center; gap: 8px; }
.ia-bar-track { flex: 1 1 auto; height: 12px; background: #eef2ff; border-radius: 999px; overflow: hidden; }
.ia-bar-fill { display: block; height: 100%; border-radius: 999px; background: #64748b; transition: width .5s ease; }
.ia-bar-num { flex: 0 0 auto; min-width: 40px; text-align: right; font-size: 12.5px; font-weight: 800; color: #475569; }
.ia-malo  .ia-bar-fill { background: linear-gradient(90deg, #ef4444, #f87171); }
.ia-bueno .ia-bar-fill { background: linear-gradient(90deg, #16a34a, #4ade80); }
.ia-aviso .ia-bar-fill { background: linear-gradient(90deg, #f59e0b, #fbbf24); }
.ia-bar-just { display: block; margin-top: 6px; font-size: 11.5px; color: #64748b; line-height: 1.35; }
.ia-acciones { margin-top: 14px; background: #fff7ed; border: 1px solid #fed7aa; border-radius: 10px; padding: 12px 14px; }
.ia-acciones-tit { display: flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 800; color: #9a3412; margin-bottom: 6px; }
.ia-acciones-tit svg { width: 16px; height: 16px; }
.ia-acciones ul { margin: 0; padding-left: 20px; }
.ia-acciones li { font-size: 12.5px; color: #7c2d12; margin: 3px 0; }
.ia-resumen { margin-top: 12px; font-size: 13px; color: #4c1d95; background: #f5f3ff; border: 1px solid #ddd6fe; border-radius: 10px; padding: 10px 12px; }

.hist-ev { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 10px; border-left: 3px solid var(--c, #94a3b8); background: #f8fafc; }
.hist-ev-ic { flex: 0 0 auto; width: 30px; height: 30px; border-radius: 8px; display: flex; align-items: center; justify-content: center; background: #f1f5f9; background: color-mix(in srgb, var(--c) 15%, #fff); color: var(--c); }
.hist-ev-ic svg { width: 16px; height: 16px; }
.hist-ev-body { flex: 1 1 auto; min-width: 0; }
.hist-ev-tit { font-size: 13px; font-weight: 700; color: #1e293b; }
.hist-ev-det { font-size: 12px; color: #64748b; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hist-ev-right { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; }
.hist-ev-fec { font-size: 12px; color: #475569; font-weight: 600; white-space: nowrap; }
.hist-ev-pdf { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 7px; background: #fee2e2; color: #b91c1c; border: 1px solid #fca5a5; }
.hist-ev-pdf svg { width: 14px; height: 14px; }
.hist-ev-pdf:hover { background: #b91c1c; color: #fff; }
@media (max-width: 991px) {
    /* En móvil, el entrevistador y el buscador ocupan toda la fila. */
    .cons-f-entrevistador,
    .cons-ent-estudiante { flex: 1 1 100%; }
}

.cons-ent-result        { width: 100%; }
.cons-ent-result-hdr    { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; padding: 0 4px; }
.cons-ent-result-count  { font-size: 12.5px; color: #475569; font-weight: 600; }

.cons-ent-tabla-wrap    { overflow-x: auto; border: 1px solid #e0f2fe; border-radius: 12px; background: #fff; }
.cons-ent-tabla         { width: 100%; border-collapse: collapse; font-size: 13px; }
.cons-ent-tabla thead th {
    text-align: left; padding: 10px 12px;
    background: linear-gradient(180deg, #f0f9ff, #e0f2fe);
    color: #0c4a6e; font-weight: 700; font-size: 12px;
    border-bottom: 1px solid #bae6fd;
    white-space: nowrap;
}
.cons-ent-tabla tbody td { padding: 9px 12px; border-bottom: 1px solid #f1f5f9; vertical-align: middle; color: #334155; }
.cons-ent-tabla tbody tr:hover { background: #f8fbff; }
.cons-ent-tabla tbody tr:last-child td { border-bottom: 0; }
.cons-ent-tabla .cons-ent-obs { max-width: 320px; }
.cons-ent-tabla .cons-ent-obs span { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cons-ent-tabla .cons-ent-acc { width: 1%; white-space: nowrap; text-align: center; }
.cons-ent-dash { color: #94a3b8; }

.cons-ent-link { color: #0c4a6e; font-weight: 600; text-decoration: none; }
.cons-ent-link:hover { text-decoration: underline; }
.cons-ent-cod { display: inline-block; margin-left: 6px; padding: 1px 6px; border-radius: 999px; background: #e0f2fe; color: #0369a1; font-size: 11px; font-weight: 700; }

.cons-ent-tag { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 11.5px; font-weight: 700; background: #e2e8f0; color: #475569; }
.cons-ent-tag-ini { background: #dbeafe; color: #1e40af; }
.cons-ent-tag-seg { background: #dcfce7; color: #166534; }
.cons-ent-tag-tut { background: #fef3c7; color: #92400e; }
.cons-ent-tag-otr { background: #f3e8ff; color: #6b21a8; }

.cons-ent-btn-pdf {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 5px 10px; border-radius: 8px;
    background: #fee2e2; color: #b91c1c;
    border: 1px solid #fca5a5;
    font-size: 11.5px; font-weight: 700; text-decoration: none;
    transition: background .15s, color .15s;
}
.cons-ent-btn-pdf:hover { background: #b91c1c; color: #fff; border-color: #b91c1c; }

.cons-ent-acciones {
    display: inline-flex; gap: 6px; flex-wrap: wrap; justify-content: center;
}
.cons-ent-btn-edit {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 5px 10px; border-radius: 8px;
    background: #e0f2fe; color: #0369a1;
    border: 1px solid #7dd3fc;
    font-size: 11.5px; font-weight: 700; text-decoration: none;
    transition: background .15s, color .15s;
}
.cons-ent-btn-edit:hover { background: #0369a1; color: #fff; border-color: #0369a1; }

/* Header de la tabla con orden — el TH es clickable (data-col en JS). */
.cons-ent-tabla thead th[data-col] { cursor: pointer; }
.cons-ent-tabla thead th[data-col]:hover { background: linear-gradient(180deg, #e0f2fe, #bae6fd); }

.det-fotos      { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
/* La foto se muestra COMPLETA dentro del cuadro (object-fit: contain), nunca
   recortada. El cuadro tiene altura fija para que dos o tres fotos queden
   uniformes en la grilla y el fondo neutro rellena los márgenes que sobren
   cuando la relación de aspecto de la foto no coincide con la del cuadro. */
.det-foto       { display: block; border-radius: 12px; overflow: hidden; border: 1px solid #e2e8f0; height: 260px; background: #f1f5f9; padding: 6px; }
.det-foto img   { width: 100%; height: 100%; object-fit: contain; display: block; transition: transform .2s; }
.det-foto:hover img { transform: scale(1.02); }

.det-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 10px; }
.det-qr   { padding: 10px 12px; background: #fff; border: 1px solid #e2e8f0; border-radius: 10px; }
.det-q    { font-size: 11.5px; font-weight: 600; color: #475569; margin-bottom: 4px; }
.det-r    { font-size: 13.5px; color: #0c4a6e; white-space: pre-wrap; }

/* ---------- Entrevista Inicial (form): contenedor, fotos, ficha y semáforo ---------- */
/* Las clases del buscador (.ent-search/.ent-criteria/.ent-radio/.ent-buscar-row/.ent-msg)
   están más arriba en este mismo archivo y se comparten con Consultas/Estudiantes. */
.ent-card .tbd-body { padding: 18px 24px 24px; }

.ent-flat { border: 1.5px solid #bae6fd; border-radius: 10px; padding: 9px 12px; width: 100%; font-size: 14px; color: #0c4a6e; background: #fff; transition: all .15s; }
.ent-flat:focus { border-color: #0ea5e9; outline: none; box-shadow: 0 0 0 3px rgba(14,165,233,.15); }
.ent-area { resize: vertical; min-height: 78px; line-height: 1.5; }

/* Foto cards */
.ent-foto-card { display: flex; flex-direction: column; gap: 8px; padding: 10px; border: 1.5px dashed #bae6fd; border-radius: 12px; background: #f8fbff; }
.ent-foto-prev { width: 100%; height: 160px; border-radius: 10px; background: #fff; border: 1px solid #e0f2fe; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; color: #94a3b8; overflow: hidden; padding: 4px; }
/* contain (no cover) para que la foto se vea completa sin recortes; padding deja un margen pequeño. */
.ent-foto-prev img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.ent-foto-empty { font-size: 12px; }
.ent-foto-ctrls { display: flex; gap: 6px; }
.ent-foto-btn { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 7px 10px; background: #fff; border: 1.5px solid #bae6fd; border-radius: 8px; color: #0369a1; cursor: pointer; font-size: 12.5px; font-weight: 600; transition: background .15s; margin: 0; }
.ent-foto-btn:hover { background: #f0f9ff; }
.ent-foto-del { padding: 7px 10px; background: #fff; border: 1.5px solid #fca5a5; border-radius: 8px; color: #b91c1c; cursor: pointer; transition: background .15s; }
.ent-foto-del:hover { background: #fee2e2; }
.ent-bool { width: 100%; }
.ent-label-warn { color: #b91c1c; }

/* Ficha del estudiante */
.ent-ficha { display: flex; gap: 16px; padding: 16px; border-radius: 14px; background: linear-gradient(135deg, #f0f9ff, #ede9fe); border: 1px solid #bae6fd; margin-bottom: 8px; }
.ent-ficha-avatar { flex-shrink: 0; }
.ent-iniciales { width: 64px; height: 64px; border-radius: 50%; background: linear-gradient(135deg, #0ea5e9, #8b5cf6); color: #fff; font-size: 22px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.ent-ficha-body { flex: 1; min-width: 0; }
.ent-ficha-row { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 6px; flex-wrap: wrap; }
.ent-ficha-name { font-size: 18px; font-weight: 700; color: #0c4a6e; }
.ent-riesgo-tag { padding: 5px 14px; border-radius: 999px; font-size: 12px; font-weight: 800; letter-spacing: .3px; text-transform: uppercase; box-shadow: inset 0 0 0 1px rgba(0,0,0,.06); }
.ent-ficha-meta { display: flex; flex-wrap: wrap; gap: 14px; font-size: 12.5px; color: #475569; margin-top: 4px; }
.ent-ficha-meta strong { color: #0c4a6e; font-weight: 600; }

/* Comparativo de créditos dentro de la ficha del estudiante */
.ent-creditos { margin-top: 10px; padding: 10px 12px; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 10px; }
.ent-creditos-hd { font-size: 11px; font-weight: 700; letter-spacing: .3px; text-transform: uppercase; color: #64748b; margin-bottom: 8px; }
.ent-creditos-sub { font-weight: 500; text-transform: none; letter-spacing: 0; color: #94a3b8; font-size: 10.5px; }
.ent-creditos-stats { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.ent-cred-item { display: flex; flex-direction: column; align-items: center; min-width: 78px; }
.ent-cred-num { font-size: 26px; font-weight: 800; line-height: 1; color: #0c4a6e; font-variant-numeric: tabular-nums; }
.ent-cred-num.ent-cred-ok { color: #16a34a; }
.ent-cred-num.ent-cred-falt { color: #dc2626; }
.ent-cred-lbl { font-size: 11px; font-weight: 600; color: #64748b; margin-top: 3px; text-transform: uppercase; letter-spacing: .2px; }
.ent-cred-estado-wrap { display: flex; flex-direction: column; gap: 5px; min-width: 130px; flex: 1; }
.ent-cred-bar { height: 8px; border-radius: 999px; background: #e2e8f0; overflow: hidden; }
.ent-cred-bar > span { display: block; height: 100%; width: 0; background: #94a3b8; border-radius: 999px; transition: width .3s ease, background .3s ease; }
.ent-cred-estado { align-self: flex-start; font-size: 12px; font-weight: 700; padding: 2px 10px; border-radius: 999px; background: #94a3b822; color: #64748b; }
.ent-cred-pct { font-size: 11px; color: #64748b; font-weight: 600; }

/* Buscador del modal "Agregar materias al catálogo" — input con icono
   de lupa, estilo similar al de Select2 que se usa en el resto del form. */
.mat-seg-buscador { position: relative; margin-bottom: 8px; }
.mat-seg-buscador .mat-seg-buscador-ico { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); color: #64748b; pointer-events: none; }
.mat-seg-buscador input { width: 100%; padding: 6px 10px 6px 30px; border: 1px solid #bae6fd; border-radius: 8px; font-size: 13px; background: #fff; transition: border-color .15s, box-shadow .15s; }
.mat-seg-buscador input:focus { outline: none; border-color: #0ea5e9; box-shadow: 0 0 0 3px rgba(14, 165, 233, .15); }

/* Botón "Agregar materias" — slate medio compacto, tono profesional sin
   gritar. Padding pequeño para no dominar la fila de inputs. */
.ent-btn-add-materias {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 5px 12px;
    background: #64748b; color: #fff;
    border: none; border-radius: 6px;
    font-size: 12.5px; font-weight: 600; letter-spacing: .2px;
    cursor: pointer;
    transition: background .15s, transform .05s;
    white-space: nowrap;
    height: 32px;
}
.ent-btn-add-materias:hover  { background: #475569; }
.ent-btn-add-materias:active { transform: translateY(1px); }

/* Sub-grupo dentro de una sección de entrevista (p. ej. "Materias perdidas"
   vs "Materias retiradas" en Situación académica) — caja sutil con título. */
.ent-grupo { border: 1.5px solid #cbd5e1; border-radius: 12px; padding: 14px 16px 12px; background: #f8fafc; margin-top: 14px; }
.ent-grupo-title { font-size: 12.5px; font-weight: 700; letter-spacing: .4px; text-transform: uppercase; color: #0c4a6e; margin-bottom: 10px; display: flex; align-items: center; gap: 6px; }
.ent-grupo-title::before { content: ''; display: inline-block; width: 3px; height: 14px; background: #0ea5e9; border-radius: 2px; }

/* Listado de errores por-bloque en el detalle del Mantenimiento BD */
.mnt-script-errores { margin: 6px 0 0; padding-left: 18px; font-family: 'Consolas', 'Menlo', monospace; font-size: 12px; color: #991b1b; }
.mnt-script-errores li { margin-bottom: 4px; word-break: break-word; }

/* Selector visual de nivel de riesgo */
.ent-riesgo-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; margin-top: 4px; }
.ent-riesgo-opt {
    --rg-color: #94a3b8;
    position: relative;
    display: flex; align-items: center; gap: 10px;
    padding: 12px 14px;
    background: #fff;
    border: 1.5px solid #e2e8f0;
    border-radius: 12px;
    cursor: pointer;
    text-align: left;
    transition: border-color .15s, box-shadow .15s, background .15s, transform .1s;
}
.ent-riesgo-opt:hover { border-color: var(--rg-color); background: #f8fafc; }
.ent-riesgo-opt:active { transform: translateY(1px); }
.ent-riesgo-opt.is-selected {
    border-color: var(--rg-color);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--rg-color) 18%, transparent);
    background: color-mix(in srgb, var(--rg-color) 8%, #fff);
}
.ent-riesgo-dot { width: 16px; height: 16px; border-radius: 50%; flex-shrink: 0; box-shadow: inset 0 0 0 2px rgba(255,255,255,.55); }
.ent-riesgo-text { display: flex; flex-direction: column; line-height: 1.15; flex: 1; min-width: 0; }
.ent-riesgo-name { font-size: 14px; font-weight: 700; color: #0c4a6e; }
.ent-riesgo-sub  { font-size: 11.5px; color: #64748b; margin-top: 2px; }
.ent-riesgo-check { color: var(--rg-color); opacity: 0; transform: scale(.6); transition: opacity .15s, transform .15s; flex-shrink: 0; }
.ent-riesgo-opt.is-selected .ent-riesgo-check { opacity: 1; transform: scale(1); }
.ent-riesgo-clear .ent-riesgo-name { color: #475569; }


/* ==================================================================
   DASHBOARDS — estilos consolidados desde los <style> inline de
   Dashboard/{Master,Tutor,Psicologo,Estudiante}.cshtml y
   Shared/_ProximasTutoriasWidget.cshtml. Componentes compartidos
   (.dash-card, .card-hd, .btn-ghost, .prox-*) definidos una sola vez.
   ================================================================== */

/* --- Componentes compartidos --- */
.dash-card { background: #fff; border: 1px solid #e0f2fe; border-radius: 16px; padding: 18px; display: flex; flex-direction: column; gap: 14px; box-shadow: 0 1px 3px rgba(15, 23, 42, .04); }
.card-hd { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.card-hd h3 { font-size: 15px; font-weight: 700; color: #0c4a6e; margin: 0; }
.btn-ghost { font-size: 12.5px; font-weight: 600; color: #4f46e5; text-decoration: none; background: none; border: none; padding: 0; }
.btn-ghost:hover { text-decoration: underline; color: #4f46e5; }

/* Widget proximas tutorias / sesiones de apoyo (Tutor + Estudiante) */
.prox-tut { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.prox-tut-row { display: flex; gap: 12px; align-items: center; padding: 10px 12px; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 10px; }
.prox-fec { flex-shrink: 0; text-align: center; padding: 6px 10px; background: #dbeafe; color: #1e40af; border-radius: 8px; min-width: 50px; }
.prox-dia { font-size: 20px; font-weight: 800; line-height: 1; }
.prox-mes { font-size: 10.5px; font-weight: 700; letter-spacing: 1px; margin-top: 2px; }
.prox-body { flex-grow: 1; min-width: 0; }
.prox-titulo { font-weight: 700; color: #0c4a6e; font-size: 14px; }
.prox-meta { display: flex; gap: 12px; margin-top: 4px; font-size: 12px; color: #64748b; flex-wrap: wrap; }
.prox-btn-conectar { flex-shrink: 0; background: #10b981; color: #fff; padding: 8px 14px; border-radius: 8px; font-weight: 600; font-size: 12.5px; text-decoration: none; white-space: nowrap; }
.prox-btn-conectar:hover { background: #059669; color: #fff; }
.prox-btn-vencido { flex-shrink: 0; background: #e2e8f0; color: #94a3b8; padding: 8px 14px; border-radius: 8px; font-weight: 600; font-size: 12.5px; white-space: nowrap; cursor: not-allowed; }
.prox-link { display: flex; gap: 5px; align-items: baseline; margin-top: 4px; font-size: 11.5px; }
.prox-link a { color: #0284c7; text-decoration: none; word-break: break-all; }
.prox-link a:hover { text-decoration: underline; }
.prox-acc { flex-shrink: 0; display: flex; flex-direction: column; gap: 6px; align-items: stretch; margin-left: auto; }
.prox-btn-edit { background: #fff; border: 1px solid #e2e8f0; color: #475569; border-radius: 8px; padding: 6px 12px; font-size: 12px; font-weight: 600; cursor: pointer; white-space: nowrap; }
.prox-btn-edit:hover { border-color: #0ea5e9; color: #0369a1; }
.prox-btn-del { background: #fff; border: 1px solid #fecaca; color: #b91c1c; border-radius: 8px; padding: 6px 12px; font-size: 12px; font-weight: 600; cursor: pointer; white-space: nowrap; }
.prox-btn-del:hover { background: #fef2f2; border-color: #ef4444; color: #991b1b; }
.prox-btn-del:disabled { opacity: .6; cursor: not-allowed; }

/* ============== Dashboard Master ============== */
.dash-wrap { padding: 6px 4px 32px; display: grid; gap: 18px; }
.dash-hero { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; padding: 6px 2px 8px; }
.dash-crumb { font-size: 12px; color: #64748b; text-transform: uppercase; letter-spacing: .08em; font-weight: 600; margin-bottom: 4px; }
.dash-title { font-size: 26px; font-weight: 700; color: #0c4a6e; letter-spacing: -.01em; margin: 0; }
.dash-sub { font-size: 13.5px; color: #64748b; margin: 2px 0 0; }
.dash-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.dash-btn { display: inline-flex; align-items: center; gap: 6px; padding: 9px 16px; border-radius: 10px; font-size: 13.5px; font-weight: 600; text-decoration: none; transition: transform .12s, box-shadow .15s; }
.dash-btn-primary { background: linear-gradient(135deg, #0ea5e9, #0284c7); color: #fff; box-shadow: 0 4px 12px rgba(14, 165, 233, .25); }
.dash-btn-primary:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(14, 165, 233, .35); color: #fff; }
.dash-btn-secondary { background: #fff; color: #0369a1; border: 1.5px solid #bae6fd; }
.dash-btn-secondary:hover { background: #f0f9ff; color: #0369a1; }
.dash-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
@media (max-width: 1100px) { .dash-kpis { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px)  { .dash-kpis { grid-template-columns: 1fr; } }
.kpi-card { position: relative; display: flex; gap: 14px; align-items: flex-start; padding: 18px; border-radius: 16px; background: #fff; border: 1px solid #e0f2fe; box-shadow: 0 1px 3px rgba(15, 23, 42, .04); transition: transform .15s, box-shadow .15s; overflow: hidden; }
.kpi-card::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--accent); }
.kpi-card:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(15, 23, 42, .07); }
.kpi-icon { width: 44px; height: 44px; border-radius: 12px; display: flex; align-items: center; justify-content: center; background: var(--accent-bg); color: var(--accent); flex-shrink: 0; }
.kpi-data { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.kpi-label { font-size: 12px; color: #64748b; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
.kpi-value { font-size: 30px; font-weight: 700; color: #0c4a6e; line-height: 1.1; letter-spacing: -.02em; }
.kpi-foot { font-size: 12px; color: #64748b; margin-top: 4px; display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.kpi-blue   { --accent: #0ea5e9; --accent-bg: #e0f2fe; }
.kpi-violet { --accent: #8b5cf6; --accent-bg: #ede9fe; }
.kpi-teal   { --accent: #14b8a6; --accent-bg: #ccfbf1; }
.kpi-amber  { --accent: #f59e0b; --accent-bg: #fef3c7; }
.badge-pill { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 11px; font-weight: 600; }
.badge-ok   { background: #dcfce7; color: #166534; }
.badge-mut  { background: #f1f5f9; color: #64748b; }
.dash-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 1000px) { .dash-grid-2 { grid-template-columns: 1fr; } }
.dash-card-hd { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
.dash-card-title { font-size: 15px; font-weight: 700; color: #0c4a6e; margin: 0; }
.dash-card-sub { font-size: 12px; color: #64748b; margin: 2px 0 0; }
.dash-link { font-size: 12.5px; font-weight: 600; color: #0284c7; text-decoration: none; white-space: nowrap; }
.dash-link:hover { color: #0369a1; text-decoration: underline; }
.empty-state { padding: 18px 6px; text-align: center; color: #94a3b8; font-size: 13.5px; }
.riesgo-flex { display: flex; gap: 22px; align-items: center; flex-wrap: wrap; }
.donut { width: 150px; height: 150px; border-radius: 50%; position: relative; flex-shrink: 0; }
.donut-hole { position: absolute; inset: 22px; background: #fff; border-radius: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.donut-num { font-size: 28px; font-weight: 700; color: #0c4a6e; line-height: 1; }
.donut-cap { font-size: 11px; color: #64748b; text-transform: uppercase; letter-spacing: .06em; margin-top: 2px; }
.riesgo-lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; flex: 1; min-width: 180px; }
.riesgo-lista li { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #334155; }
.riesgo-lista strong { color: #0c4a6e; font-weight: 700; margin-left: 4px; }
.riesgo-lista em { color: #94a3b8; font-style: normal; font-size: 12px; }
.dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; flex-shrink: 0; }
.bar-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.bar-row { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; font-size: 13px; color: #334155; margin-bottom: 4px; }
.bar-name { font-weight: 600; color: #0c4a6e; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bar-num { font-size: 12.5px; color: #64748b; font-weight: 600; }
.bar-track { height: 8px; background: #e0f2fe; border-radius: 999px; overflow: hidden; }
.bar-fill  { height: 100%; background: linear-gradient(90deg, #0ea5e9, #8b5cf6); border-radius: 999px; transition: width .4s ease; }
.dash-table { width: 100%; border-collapse: collapse; }
.dash-table thead th { text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: #64748b; font-weight: 600; padding: 8px 6px; border-bottom: 1px solid #e0f2fe; }
.dash-table td { padding: 10px 6px; border-bottom: 1px solid #f1f5f9; font-size: 13px; color: #334155; vertical-align: middle; }
.dash-table tr:last-child td { border-bottom: 0; }
.t-right { text-align: right; }
.t-univ { color: #475569; }
.t-who { display: flex; align-items: center; gap: 10px; }
.t-av { width: 34px; height: 34px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 11.5px; font-weight: 700; color: #fff; flex-shrink: 0; }
.t-av[data-lvl="alto"]  { background: linear-gradient(135deg, #ef4444, #b91c1c); }
.t-av[data-lvl="medio"] { background: linear-gradient(135deg, #f59e0b, #b45309); }
.t-av[data-lvl="bajo"]  { background: linear-gradient(135deg, #10b981, #047857); }
.t-av[data-lvl="sc"]    { background: linear-gradient(135deg, #94a3b8, #475569); }
.t-nm { font-weight: 600; color: #0c4a6e; }
.t-sub { font-size: 11.5px; color: #94a3b8; }
.riesgo-tag { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 11.5px; font-weight: 600; }
.riesgo-tag[data-lvl="alto"]  { background: #fee2e2; color: #b91c1c; }
.riesgo-tag[data-lvl="medio"] { background: #fef3c7; color: #b45309; }
.riesgo-tag[data-lvl="bajo"]  { background: #dcfce7; color: #166534; }
.riesgo-tag[data-lvl="sc"]    { background: #f1f5f9; color: #64748b; }
.quick-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 600px) { .quick-grid { grid-template-columns: 1fr; } }
.quick-card { display: flex; gap: 12px; padding: 14px; border-radius: 12px; background: var(--qc-bg); border: 1px solid var(--qc-bd); text-decoration: none; color: #0c4a6e; transition: transform .15s, box-shadow .15s, border-color .15s; }
.quick-card:hover { transform: translateY(-2px); border-color: var(--qc-accent); box-shadow: 0 6px 14px rgba(15, 23, 42, .06); color: #0c4a6e; }
.quick-ico { width: 38px; height: 38px; border-radius: 10px; background: #fff; color: var(--qc-accent); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.quick-card b { display: block; font-size: 13.5px; font-weight: 700; }
.quick-card span { display: block; font-size: 12px; color: #64748b; margin-top: 1px; }
.quick-blue   { --qc-bg: #f0f9ff; --qc-bd: #bae6fd; --qc-accent: #0ea5e9; }
.quick-violet { --qc-bg: #f5f3ff; --qc-bd: #ddd6fe; --qc-accent: #8b5cf6; }
.quick-teal   { --qc-bg: #f0fdfa; --qc-bd: #99f6e4; --qc-accent: #14b8a6; }
.quick-amber  { --qc-bg: #fffbeb; --qc-bd: #fde68a; --qc-accent: #f59e0b; }
.dash-ag { padding: 18px 20px; }
.ag-kpi-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-top: 8px; }
@media (max-width: 800px) { .ag-kpi-grid { grid-template-columns: repeat(2, 1fr); } }
.ag-kpi { background: #f0f9ff; border: 1px solid #bae6fd; border-radius: 12px; padding: 12px; text-align: center; }
.ag-kpi b { display: block; font-size: 24px; font-weight: 800; color: #0c4a6e; line-height: 1; }
.ag-kpi span { display: block; font-size: 11.5px; color: #64748b; margin-top: 4px; font-weight: 600; letter-spacing: .3px; }
.ag-tops { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 16px; }
@media (max-width: 700px) { .ag-tops { grid-template-columns: 1fr; } }
.ag-top { background: #fafbff; border: 1px solid #e0e7ff; border-radius: 12px; padding: 12px 14px; }
.ag-top h4 { margin: 0 0 8px; color: #0c4a6e; font-size: 13px; font-weight: 700; }
.ag-empty { color: #94a3b8; font-size: 12.5px; margin: 0; }
.ag-rank { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.ag-rank li { display: flex; gap: 10px; align-items: center; font-size: 13px; color: #0c4a6e; }
.ag-rk { flex-shrink: 0; width: 24px; height: 24px; border-radius: 50%; background: #0ea5e9; color: #fff; font-weight: 700; font-size: 12px; display: inline-flex; align-items: center; justify-content: center; }
.ag-lbl { flex-grow: 1; }
.ag-tot { font-weight: 700; color: #0369a1; }
.ag-chart { margin-top: 16px; background: #fafbff; border: 1px solid #e0e7ff; border-radius: 12px; padding: 12px 14px; }
.ag-chart-hdr { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 8px; }
.ag-chart-hdr h4 { margin: 0; color: #0c4a6e; font-size: 13px; font-weight: 700; }
.ag-chart-tot { font-size: 12px; color: #64748b; font-weight: 600; }
.ag-chart-bars { display: grid; grid-template-columns: repeat(30, 1fr); gap: 3px; height: 80px; align-items: flex-end; }
.ag-chart-col { display: flex; align-items: flex-end; height: 100%; }
.ag-chart-bar { width: 100%; min-height: 1px; background: linear-gradient(180deg, #0ea5e9, #0369a1); border-radius: 3px 3px 0 0; transition: opacity .15s; }
.ag-chart-col:hover .ag-chart-bar { opacity: .75; }
.ag-chart-axis { display: flex; justify-content: space-between; margin-top: 6px; font-size: 11px; color: #94a3b8; font-weight: 600; }
.ag-proximas { margin-top: 16px; }
.ag-proximas h4 { color: #0c4a6e; font-size: 13px; font-weight: 700; margin: 0 0 8px; }
.ag-prox-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.ag-prox-table th { text-align: left; color: #64748b; padding: 8px; border-bottom: 1.5px solid #e0f2fe; font-weight: 600; }
.ag-prox-table td { padding: 8px; border-bottom: 1px solid #f1f5f9; color: #0c4a6e; }
.ag-prox-table tr:last-child td { border-bottom: none; }
.ag-prox-vc { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ag-prox-plat { font-size: 12px; color: #64748b; white-space: nowrap; }
.ag-prox-join { background: #0ea5e9; color: #fff; padding: 4px 10px; border-radius: 7px; font-weight: 600; font-size: 12px; text-decoration: none; }
.ag-prox-join:hover { background: #0284c7; color: #fff; }
.ag-prox-edit { background: #fff; border: 1px solid #e2e8f0; color: #475569; border-radius: 7px; padding: 3px 9px; font-size: 12px; font-weight: 700; cursor: pointer; line-height: 1.4; }
.ag-prox-edit:hover { border-color: #0ea5e9; color: #0369a1; }
.ag-prox-del { background: #fff; border: 1px solid #fecaca; color: #b91c1c; border-radius: 7px; padding: 3px 9px; font-size: 12px; font-weight: 700; cursor: pointer; line-height: 1.4; }
.ag-prox-del:hover { background: #fef2f2; border-color: #ef4444; color: #991b1b; }
.ag-prox-del:disabled { opacity: .6; cursor: not-allowed; }

/* ============== Dashboard Tutor (KPIs y lista simples) ============== */
.kpi-l { font-size: 11px; text-transform: uppercase; letter-spacing: .07em; color: #9aa1b6; font-weight: 600; }
.kpi { font-size: 32px; font-weight: 700; color: #27304A; letter-spacing: -.02em; }
.sub { font-size: 12px; color: #9aa1b6; }
.list { display: flex; flex-direction: column; gap: 2px; }
.list .li { display: flex; align-items: center; gap: 11px; padding: 10px 4px; border-bottom: 1px solid rgba(39,48,74,.06); }
.list .li:last-child { border-bottom: 0; }
.list .li .who { flex: 1; min-width: 0; }
.list .li .nm { color: #27304A; font-weight: 600; font-size: 13px; }
.list .li .sub { color: #9aa1b6; font-size: 11.5px; }
.list .time { font-size: 12.5px; font-weight: 600; color: #5b63ad; width: 46px; }

/* ============== Dashboard Psicologo ============== */
.psi-wrap { padding: 6px 4px 32px; display: grid; gap: 18px; }
.psi-hero { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; padding: 22px 24px; background: linear-gradient(135deg, #ede9fe, #e0f2fe); border: 1px solid #c7d2fe; border-radius: 18px; }
.psi-crumb { font-size: 12px; color: #7c3aed; text-transform: uppercase; letter-spacing: .1em; font-weight: 700; margin-bottom: 4px; }
.psi-hello { font-size: 26px; font-weight: 700; color: #3b0764; margin: 0; letter-spacing: -.01em; }
.psi-sub { font-size: 14px; color: #475569; margin: 4px 0 0; max-width: 560px; }
.psi-cta-grp { display: flex; gap: 10px; flex-wrap: wrap; }
.psi-cta { display: inline-flex; align-items: center; gap: 8px; padding: 11px 20px; border-radius: 12px; font-size: 14px; font-weight: 600; text-decoration: none; transition: transform .12s, box-shadow .15s; }
.psi-cta-primary { background: linear-gradient(135deg, #8b5cf6, #6d28d9); color: #fff; box-shadow: 0 6px 16px rgba(139,92,246,.35); }
.psi-cta-primary:hover { transform: translateY(-1px); color: #fff; }
.psi-cta-secondary { background: #fff; color: #6d28d9; border: 1.5px solid #ddd6fe; }
.psi-cta-secondary:hover { background: #f5f3ff; color: #6d28d9; }
.psi-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
@media (max-width: 1100px) { .psi-kpis { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px)  { .psi-kpis { grid-template-columns: 1fr; } }
.psi-kpis-3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 1100px) { .psi-kpis-3 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px)  { .psi-kpis-3 { grid-template-columns: 1fr; } }
.psi-kpi { background: #fff; border: 1px solid #e2e8f0; border-radius: 16px; padding: 16px 18px; display: flex; gap: 12px; align-items: center; position: relative; overflow: hidden; transition: transform .12s, box-shadow .15s; }
.psi-kpi::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--a); }
.psi-kpi:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(15,23,42,.08); }
.psi-kpi-ico { font-size: 26px; width: 48px; height: 48px; background: var(--bg); border-radius: 14px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.psi-kpi-val { font-size: 28px; font-weight: 800; color: #0c4a6e; line-height: 1; }
.psi-kpi-lbl { font-size: 13px; font-weight: 700; color: #334155; margin-top: 3px; }
.psi-kpi-sub { font-size: 11.5px; color: #94a3b8; margin-top: 1px; }
.psi-kpi-blue   { --a: #0ea5e9; --bg: #e0f2fe; }
.psi-kpi-violet { --a: #8b5cf6; --bg: #ede9fe; }
.psi-kpi-teal   { --a: #14b8a6; --bg: #ccfbf1; }
.psi-kpi-amber  { --a: #f59e0b; --bg: #fef3c7; }
.psi-quick { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
@media (max-width: 1000px) { .psi-quick { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px)  { .psi-quick { grid-template-columns: 1fr; } }
.psi-q { display: flex; gap: 12px; align-items: center; padding: 14px; border-radius: 14px; text-decoration: none; border: 1px solid var(--qb); background: var(--qbg); color: #0c4a6e; transition: transform .12s, box-shadow .15s; }
.psi-q:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(15,23,42,.07); color: #0c4a6e; }
.psi-q-ico { font-size: 24px; width: 42px; height: 42px; background: #fff; border-radius: 12px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.psi-q b { display: block; font-size: 14px; font-weight: 700; }
.psi-q span { display: block; font-size: 11.5px; color: #64748b; margin-top: 1px; }
.psi-q-blue   { --qbg: #f0f9ff; --qb: #bae6fd; }
.psi-q-green  { --qbg: #f0fdf4; --qb: #bbf7d0; }
.psi-q-violet { --qbg: #f5f3ff; --qb: #ddd6fe; }
.psi-q-amber  { --qbg: #fffbeb; --qb: #fde68a; }
.psi-card { background: #fff; border: 1px solid #e2e8f0; border-radius: 16px; padding: 18px; }
.psi-card-hd { display: flex; justify-content: space-between; align-items: center; }
.psi-card-titulo { font-size: 15px; font-weight: 700; color: #0c4a6e; margin: 0; }
.psi-link { font-size: 12.5px; font-weight: 600; color: #7c3aed; text-decoration: none; }
.psi-link:hover { text-decoration: underline; }
.psi-sesiones { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.psi-sesiones li { display: flex; gap: 12px; align-items: center; padding: 10px 12px; background: #faf5ff; border: 1px solid #e9d5ff; border-radius: 10px; }
.psi-ses-fecha { flex-shrink: 0; text-align: center; padding: 6px 10px; background: #ede9fe; color: #5b21b6; border-radius: 8px; min-width: 50px; }
.psi-ses-dia { font-size: 20px; font-weight: 800; line-height: 1; }
.psi-ses-mes { font-size: 10.5px; font-weight: 700; letter-spacing: 1px; margin-top: 2px; }
.psi-ses-info { flex-grow: 1; min-width: 0; }
.psi-ses-est { font-weight: 700; color: #3b0764; font-size: 14px; }
.psi-ses-meta { display: flex; gap: 12px; margin-top: 4px; font-size: 12px; color: #64748b; flex-wrap: wrap; }
.psi-ses-btn { flex-shrink: 0; background: #8b5cf6; color: #fff; padding: 8px 14px; border-radius: 8px; font-weight: 600; font-size: 12.5px; text-decoration: none; text-align: center; }
.psi-ses-btn:hover { background: #7c3aed; color: #fff; }
.psi-ses-link { display: flex; gap: 5px; align-items: baseline; margin-top: 4px; font-size: 11.5px; }
.psi-ses-link a { color: #0284c7; text-decoration: none; word-break: break-all; }
.psi-ses-link a:hover { text-decoration: underline; }
.psi-ses-acc { flex-shrink: 0; display: flex; flex-direction: column; gap: 6px; align-items: stretch; margin-left: auto; }
.psi-ses-edit { background: #fff; border: 1px solid #e2e8f0; color: #475569; border-radius: 8px; padding: 6px 12px; font-size: 12px; font-weight: 600; cursor: pointer; white-space: nowrap; }
.psi-ses-edit:hover { border-color: #8b5cf6; color: #7c3aed; }
.sesion-sin-enlace { display: inline-block; font-size: 10.5px; line-height: 1.3; color: #94a3b8; font-style: italic; max-width: 180px; white-space: normal; text-align: right; }
.psi-ses-del { background: #fff; border: 1px solid #fecaca; color: #b91c1c; border-radius: 8px; padding: 6px 12px; font-size: 12px; font-weight: 600; cursor: pointer; white-space: nowrap; }
.psi-ses-del:hover { background: #fef2f2; border-color: #ef4444; color: #991b1b; }
.psi-ses-del:disabled { opacity: .6; cursor: not-allowed; }

/* ============== Dashboard Estudiante ============== */
.est-wrap { padding: 6px 4px 32px; display: grid; gap: 18px; }
.est-hero { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; padding: 22px 24px; background: linear-gradient(135deg, #e0f2fe, #ede9fe); border: 1px solid #c7d2fe; border-radius: 18px; }
.est-crumb { font-size: 12px; color: #6366f1; text-transform: uppercase; letter-spacing: .1em; font-weight: 700; margin-bottom: 4px; }
.est-hello { font-size: 26px; font-weight: 700; color: #312e81; margin: 0; letter-spacing: -.01em; }
.est-sub { font-size: 14px; color: #475569; margin: 4px 0 0; max-width: 540px; }
.est-cta-grp { display: flex; gap: 10px; flex-wrap: wrap; }
.est-cta { display: inline-flex; align-items: center; gap: 8px; padding: 11px 22px; border-radius: 12px; font-size: 14px; font-weight: 600; text-decoration: none; transition: transform .12s, box-shadow .15s; }
.est-cta-primary { background: linear-gradient(135deg, #6366f1, #4f46e5); color: #fff; box-shadow: 0 6px 16px rgba(99, 102, 241, .35); }
.est-cta-primary:hover { transform: translateY(-1px); box-shadow: 0 10px 22px rgba(99, 102, 241, .45); color: #fff; }
.est-cta-secondary { background: #fff; color: #4f46e5; border: 1.5px solid #c7d2fe; }
.est-cta-secondary:hover { background: #eef2ff; color: #4f46e5; }
.est-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
@media (max-width: 1100px) { .est-kpis { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px)  { .est-kpis { grid-template-columns: 1fr; } }
.est-kpis-3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 1100px) { .est-kpis-3 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px)  { .est-kpis-3 { grid-template-columns: 1fr; } }
.est-kpi { background: #fff; border: 1px solid #e2e8f0; border-radius: 16px; padding: 16px 18px; display: flex; gap: 12px; align-items: center; transition: transform .12s, box-shadow .15s; position: relative; overflow: hidden; }
.est-kpi::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--est-acc); }
.est-kpi:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(15, 23, 42, .08); }
.est-kpi-ico { font-size: 28px; width: 50px; height: 50px; background: var(--est-bg); border-radius: 14px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.est-kpi-val { font-size: 28px; font-weight: 800; color: #0c4a6e; line-height: 1; letter-spacing: -.02em; }
.est-kpi-lbl { font-size: 13px; font-weight: 700; color: #334155; margin-top: 3px; }
.est-kpi-sub { font-size: 11.5px; color: #94a3b8; margin-top: 1px; }
.est-kpi-blue   { --est-acc: #0ea5e9; --est-bg: #e0f2fe; }
.est-kpi-green  { --est-acc: #10b981; --est-bg: #d1fae5; }
.est-kpi-amber  { --est-acc: #f59e0b; --est-bg: #fef3c7; }
.est-kpi-violet { --est-acc: #8b5cf6; --est-bg: #ede9fe; }
.est-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 900px) { .est-grid-2 { grid-template-columns: 1fr; } }
.est-card { background: #fff; border: 1px solid #e2e8f0; border-radius: 16px; padding: 18px; }
.est-card-hd { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.est-card-titulo { font-size: 15px; font-weight: 700; color: #0c4a6e; margin: 0 0 10px; }
.est-link { font-size: 12.5px; font-weight: 600; color: #4f46e5; text-decoration: none; }
.est-link:hover { text-decoration: underline; }
.est-resumen-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-top: 10px; }
@media (max-width: 1100px) { .est-resumen-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 700px)  { .est-resumen-grid { grid-template-columns: 1fr 1fr; } }
.est-res-item { display: flex; gap: 10px; align-items: center; padding: 12px; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 12px; }
.est-res-ico { flex-shrink: 0; width: 40px; height: 40px; border-radius: 11px; display: flex; align-items: center; justify-content: center; font-size: 19px; }
.est-res-num { font-size: 22px; font-weight: 800; color: #0c4a6e; line-height: 1; }
.est-res-cap { font-size: 12.5px; font-weight: 700; color: #334155; margin-top: 3px; }
.est-res-det { font-size: 11px; color: #94a3b8; margin-top: 1px; }
.est-tip-link { display: block; margin-top: 14px; padding: 10px 12px; background: #fef3c7; color: #92400e; border-radius: 10px; font-size: 12.5px; font-weight: 600; text-decoration: none; border: 1px solid #fde68a; }
.est-tip-link:hover { background: #fde68a; color: #92400e; }
.est-historial { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.est-historial li { display: flex; justify-content: space-between; align-items: center; padding: 10px 12px; background: #f8fafc; border-radius: 10px; border: 1px solid #e2e8f0; }
.est-hist-tutor { font-weight: 700; color: #0c4a6e; font-size: 14px; }
.est-hist-meta { font-size: 12px; color: #64748b; display: flex; gap: 10px; margin-top: 3px; flex-wrap: wrap; }
.est-stars { font-size: 16px; color: #f59e0b; }
.est-hist-cta { font-size: 12.5px; font-weight: 600; color: #b45309; background: #fef3c7; padding: 6px 12px; border-radius: 8px; text-decoration: none; }
.est-hist-cta:hover { background: #fde68a; color: #92400e; }


/* ============== Tarjetas de tutoria/sesion (Mis tutorias + Mis sesiones) ============== */
.tutorias-list { display: flex; flex-direction: column; gap: 12px; }
.tut-card { padding: 14px 16px; }
.tut-hdr { display: flex; gap: 16px; align-items: center; }
.tut-fecha { flex-shrink: 0; text-align: center; padding: 6px 10px; background: #dbeafe; color: #1e40af; border-radius: 10px; min-width: 60px; }
.tut-dia  { font-size: 22px; font-weight: 800; line-height: 1; }
.tut-mes  { font-size: 11px; font-weight: 700; letter-spacing: 1px; margin-top: 2px; }
.tut-info { flex-grow: 1; min-width: 0; }
.tut-titulo { font-weight: 700; color: #0c4a6e; font-size: 15px; }
.tut-meta   { display: flex; gap: 12px; margin-top: 4px; font-size: 12.5px; color: #64748b; flex-wrap: wrap; }
.tut-actions { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.tut-btn-conectar, .tut-btn-finalizar, .tut-btn-evaluar, .tut-btn-secundario {
    padding: 8px 14px; border-radius: 8px; border: none; font-weight: 600; font-size: 13px; cursor: pointer;
    text-decoration: none; display: inline-flex; align-items: center; gap: 6px;
}
.tut-btn-conectar  { background: #10b981; color: #fff; }
.tut-btn-conectar:hover { background: #059669; color: #fff; }
.tut-btn-finalizar { background: #ef4444; color: #fff; }
.tut-btn-finalizar:hover { background: #dc2626; }
.tut-btn-evaluar   { background: #f59e0b; color: #fff; }
.tut-btn-evaluar:hover { background: #d97706; }
.tut-btn-secundario { background: #e0f2fe; color: #0c4a6e; }
.tut-btn-secundario:hover { background: #bae6fd; }
.tut-btn-cancelar { background: #fee2e2; color: #991b1b; }
.tut-btn-cancelar:hover { background: #fecaca; }
.tut-btn-cumplida { background: #10b981; color: #fff; }
.tut-btn-cumplida:hover { background: #059669; }
.tut-enlace { margin-top: 8px; font-size: 13px; background: #f0f9ff; border: 1px solid #bae6fd; border-radius: 8px; padding: 6px 10px; display: inline-block; }
.tut-enlace-link { color: #0284c7; font-weight: 600; text-decoration: none; word-break: break-all; }
.tut-enlace-link:hover { text-decoration: underline; color: #0369a1; }
.tut-notas, .tut-eval { margin-top: 10px; padding: 8px 10px; background: #f8fafc; border-radius: 8px; font-size: 13px; color: #475569; }
.tut-eval span { font-size: 16px; color: #f59e0b; }


/* ============== Agendamiento: combo de duración (MiAgenda + MiDisponibilidad) ============== */
.dur-combo-box { display: flex; align-items: center; gap: 8px; flex-shrink: 0; font-size: 13.5px; font-weight: 700; color: #0c4a6e; }
.dur-combo-box select { font-weight: 700; }

/* ============== Modal genérico (MisTutorias, Tutores) ============== */
.modal-overlay { position: fixed; inset: 0; background: rgba(15,23,42,.55); z-index: 1050; display: flex; align-items: center; justify-content: center; }
.modal-overlay.d-none { display: none !important; }
.modal-box { background: #fff; padding: 24px; border-radius: 14px; min-width: 340px; max-width: 480px; width: 90%; box-shadow: 0 20px 60px rgba(0,0,0,.25); }
.modal-box h3 { margin: 0 0 8px; color: #0c4a6e; font-size: 18px; font-weight: 700; }
.modal-actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 18px; }

/* Selector de estrellas (evaluación de tutoría) */
.stars-input { display: inline-flex; gap: 4px; font-size: 34px; cursor: pointer; }
.stars-input .star { color: #cbd5e1; transition: transform .15s; user-select: none; }
.stars-input .star.is-on { color: #f59e0b; }
.stars-input .star:hover { transform: scale(1.18); }

/* Modal "asignar materias" del tutor (Tutores/Index) */
.mat-row { display: flex; justify-content: space-between; align-items: center; padding: 6px 8px; border-bottom: 1px solid #f1f5f9; font-size: 13.5px; color: #334155; }
.mat-row:last-child { border-bottom: none; }
.mat-row button { background: #fee2e2; color: #991b1b; border: none; border-radius: 6px; padding: 3px 10px; font-weight: 600; font-size: 12px; cursor: pointer; }
.mat-row button:hover { background: #fecaca; }
.mat-vacio { color: #94a3b8; font-style: italic; padding: 6px; }
.tbd-act-mat { color: #0369a1; }
.tbd-act-mat:hover { background: #bae6fd; }

/* ============================================================
   Mi Agenda (tutor) — generación de disponibilidad + calendario
   semanal. Prefijo .mag-* exclusivo de Views/MiAgenda/Index.cshtml.
   ============================================================ */

/* ---- Panel de generación ---- */
/* Fondo suave del panel; borde exterior tenue. */
.mag-gen { background: linear-gradient(180deg, #f0f9ff, #f8fcff); border: 1px solid #bae6fd; }
/* Recuadro INTERNO que enmarca los campos (inset dentro del panel azul).
   Fondo un punto más marcado que el panel para que resalte un poco. */
.mag-gen .tbd-body { margin: 18px; padding: 18px 20px; border: 1.5px solid #7dd3fc; border-radius: 12px; background: #e0f2fe; }
/* Campos sueltos (fecha/hora/selects) con recuadro y relleno suave para que no
   se vean "pelados" sobre el fondo azul. El input dentro de .tbd-ig (enlace)
   conserva su caja propia, así que se restablece transparente. */
.mag-gen .tbd-inp { background: #fbfdff; border: 1px solid #cfe8fb; border-radius: 8px; }
.mag-gen .tbd-inp:focus { border-color: #0ea5e9; box-shadow: 0 0 0 3px rgba(14, 165, 233, .12); outline: none; }
.mag-gen .tbd-ig .tbd-inp { background: transparent; border: none; box-shadow: none; }
.mag-tabs { display: flex; gap: 6px; flex-wrap: wrap; }
.mag-tab { border: 1px solid #cbd5e1; background: #fff; color: #475569; border-radius: 8px; padding: 7px 14px; font-size: 13px; font-weight: 600; cursor: pointer; transition: all .12s; }
.mag-tab:hover { border-color: #0ea5e9; color: #0c4a6e; }
.mag-tab.active { background: #0c4a6e; border-color: #0c4a6e; color: #fff; }
.mag-when { display: none; }
.mag-when.is-active { display: block; }

/* Botón "Generar turnos" con loader */
.mag-btn-spin { display: none; width: 15px; height: 15px; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .45); border-top-color: #fff; animation: impSpin .8s linear infinite; flex-shrink: 0; }
#btnGenerar.is-loading { opacity: .85; cursor: progress; }
#btnGenerar.is-loading .mag-btn-spin { display: inline-block; }
#btnGenerar.is-loading .mag-btn-ico { display: none; }
.mag-dows { display: flex; gap: 6px; flex-wrap: wrap; }
.mag-dow { display: inline-flex; align-items: center; gap: 6px; border: 1px solid #e2e8f0; border-radius: 8px; padding: 6px 11px; font-size: 13px; cursor: pointer; user-select: none; }
.mag-dow input { width: 15px; height: 15px; }
.mag-preview { font-size: 13px; font-weight: 600; color: #0c4a6e; }

/* ---- Calendario semanal ---- */
.mag-cal-toolbar { display: flex; align-items: center; gap: 16px; padding: 14px 18px; border-bottom: 1px solid #e2e8f0; flex-wrap: wrap; }
.mag-nav { display: flex; gap: 6px; }
.mag-navbtn { display: inline-flex; align-items: center; justify-content: center; min-width: 34px; height: 34px; padding: 0 10px; border: 1px solid #cbd5e1; border-radius: 8px; color: #0c4a6e; font-weight: 700; text-decoration: none; font-size: 18px; line-height: 1; }
.mag-navbtn:hover { background: #f0f9ff; border-color: #0ea5e9; }
.mag-goto { display: flex; align-items: center; gap: 8px; }
.mag-goto label { font-size: 12.5px; font-weight: 600; color: #64748b; white-space: nowrap; }
.mag-goto input[type=date] { border: 1px solid #cbd5e1; border-radius: 8px; padding: 6px 10px; font-size: 13px; color: #0c4a6e; background: #fff; cursor: pointer; }
.mag-goto input[type=date]:hover { border-color: #0ea5e9; }
.mag-goto input[type=date]:focus { outline: none; border-color: #0ea5e9; box-shadow: 0 0 0 3px rgba(14,165,233,.15); }
.mag-navhoy { font-size: 13px; }
.mag-cal-title { margin: 0; font-size: 15px; font-weight: 700; color: #0c4a6e; flex-grow: 1; }
.mag-legend { display: flex; gap: 14px; font-size: 12px; color: #475569; }
.mag-legend i { display: inline-block; width: 11px; height: 11px; border-radius: 3px; margin-right: 5px; vertical-align: middle; }

.mag-cal-scroll { overflow: auto; max-height: 560px; }
.mag-cal { display: grid; grid-template-columns: 58px repeat(7, minmax(96px, 1fr)); position: relative; min-width: 740px; }
.mag-corner { grid-column: 1; grid-row: 1; position: sticky; top: 0; left: 0; z-index: 5; background: #f8fafc; border-bottom: 1px solid #e2e8f0; }
.mag-dayhdr { position: sticky; top: 0; z-index: 4; background: #f8fafc; border-bottom: 1px solid #e2e8f0; border-left: 1px solid #eef2f7; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; }
.mag-dayhdr-n { font-size: 12px; font-weight: 700; color: #0c4a6e; text-transform: uppercase; }
.mag-dayhdr-d { font-size: 11px; color: #64748b; }
.mag-dayhdr-hoy { background: #e0f2fe; }
.mag-dayhdr-hoy .mag-dayhdr-n { color: #0369a1; }

.mag-col { border-left: 1px solid #eef2f7; }
.mag-col-hoy { background: #f0f9ff; }
.mag-time { font-size: 11px; color: #94a3b8; text-align: right; padding-right: 8px; transform: translateY(-8px); }
.mag-time-h { color: #64748b; font-weight: 600; }
.mag-line { border-top: 1px solid #f1f5f9; }
.mag-line-h { border-top: 1px solid #e2e8f0; }

.mag-turno { position: relative; margin: 1px 3px; border-radius: 7px; padding: 3px 6px; font-size: 11px; color: #fff; overflow: hidden; z-index: 2; box-shadow: 0 1px 2px rgba(0, 0, 0, .12); }
.mag-turno-h { font-weight: 700; font-size: 11px; line-height: 1.2; }
.mag-turno-m { font-size: 10.5px; opacity: .95; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mag-turno-e { font-size: 10px; opacity: .95; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mag-turno-cat { font-size: 9.5px; font-weight: 600; opacity: .95; text-transform: uppercase; letter-spacing: .2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mag-turno-u { font-size: 9.5px; opacity: .9; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ============================================================
   Gráfico "Sesiones por mes" — Views/Shared/_GraficoSesionesMes.cshtml
   ============================================================ */
.gsm-card { background: #fff; border: 1px solid #e2e8f0; border-radius: 14px; padding: 18px 20px; box-shadow: 0 1px 2px rgba(15, 23, 42, .04); }
.gsm-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.gsm-title { margin: 0; font-size: 15px; font-weight: 700; color: #0c4a6e; }
.gsm-total { font-size: 12px; color: #64748b; white-space: nowrap; }
.gsm-svg { width: 100%; height: auto; max-height: 260px; display: block; }
.gsm-grid { stroke: #eef2f7; stroke-width: 1; }
.gsm-axis { stroke: #cbd5e1; stroke-width: 1.5; }
.gsm-val { fill: #334155; font-size: 13px; font-weight: 700; }
.gsm-val-zero { fill: #cbd5e1; }
.gsm-xlab { fill: #64748b; font-size: 12px; }
.gsm-bar-rect { transform-box: fill-box; transform-origin: bottom; transition: opacity .15s, filter .15s; animation: gsm-grow .5s cubic-bezier(.22,1,.36,1) both; filter: drop-shadow(0 2px 4px rgba(15, 23, 42, .12)); }
.gsm-bar:hover .gsm-bar-rect { opacity: .85; filter: drop-shadow(0 4px 8px rgba(15, 23, 42, .2)); }
@keyframes gsm-grow { from { transform: scaleY(0); } to { transform: scaleY(1); } }
@media (prefers-reduced-motion: reduce) { .gsm-bar-rect { animation: none; } }
.gsm-empty { padding: 34px 10px; text-align: center; color: #94a3b8; font-size: 13.5px; }
.gsm-legend { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 2px 0 12px; }
.gsm-legend-item { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: #475569; font-weight: 600; }
.gsm-legend-sw { width: 12px; height: 12px; border-radius: 3px; flex: none; }
.gsm-ymax { fill: #94a3b8; font-size: 11px; }
.gsm-xtick { fill: #64748b; font-size: 10.5px; font-weight: 600; }
.gsm-tick { stroke: #cbd5e1; stroke-width: 1; }
.gsm-mbar { transform-box: fill-box; transform-origin: bottom; transition: opacity .15s; animation: gsm-grow .5s cubic-bezier(.22,1,.36,1) both; }
.gsm-mbar:hover { opacity: .8; }
@media (prefers-reduced-motion: reduce) { .gsm-mbar { animation: none; } }
.gsm-svg-tall { max-height: none; }
.gsm-hbar { transform-box: fill-box; transform-origin: left; transition: opacity .15s; animation: gsm-grow-x .5s cubic-bezier(.22,1,.36,1) both; }
.gsm-hbar:hover { opacity: .8; }
@keyframes gsm-grow-x { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@media (prefers-reduced-motion: reduce) { .gsm-hbar { animation: none; } }

/* Actividad por profesional (barras apiladas horizontales) */
.apf-mes { font-size: 12.5px; color: #334155; border: 1px solid #cbd5e1; border-radius: 8px; padding: 4px 8px; background: #fff; cursor: pointer; }
.apf-body { display: flex; flex-direction: column; gap: 10px; margin-top: 4px; }
.apf-row { display: grid; grid-template-columns: minmax(96px, 150px) 1fr 34px; align-items: center; gap: 10px; }
.apf-name { font-size: 12.5px; font-weight: 600; color: #0f172a; line-height: 1.2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.apf-name .apf-rol { display: block; font-size: 10.5px; font-weight: 500; color: #94a3b8; }
.apf-track { display: flex; height: 18px; background: #f1f5f9; border-radius: 6px; overflow: hidden; }
.apf-seg { height: 100%; transition: opacity .15s; }
.apf-seg:first-child { border-top-left-radius: 6px; border-bottom-left-radius: 6px; }
.apf-seg:last-child { border-top-right-radius: 6px; border-bottom-right-radius: 6px; }
.apf-seg:hover { opacity: .82; }
.apf-tot { font-size: 12.5px; font-weight: 700; color: #334155; text-align: right; font-variant-numeric: tabular-nums; }
.mag-libre { background: linear-gradient(135deg, #10b981, #059669); }
.mag-reservado { background: linear-gradient(135deg, #f59e0b, #d97706); }
.mag-pasado { background: #cbd5e1; color: #475569; box-shadow: none; }
/* Resultado del turno: azul = se realizó · rojo = el estudiante no asistió */
.mag-realizada { background: linear-gradient(135deg, #3b82f6, #2563eb); }
.mag-noasistio { background: linear-gradient(135deg, #ef4444, #dc2626); }
.mag-turno-x { position: absolute; top: 2px; right: 3px; width: 17px; height: 17px; border: none; border-radius: 5px; background: rgba(255, 255, 255, .25); color: #fff; font-size: 13px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.mag-turno-x:hover { background: rgba(255, 255, 255, .45); }
.mag-pasado .mag-turno-x { display: none; }
/* …salvo cuando el turno pasado aún se puede marcar (registrar el resultado). */
.mag-pasado.mag-marcable .mag-turno-x { display: flex; background: rgba(71, 85, 105, .18); color: #475569; }
.mag-pasado.mag-marcable .mag-turno-x:hover { background: rgba(71, 85, 105, .32); }

/* ============================================================
   Agendar (hub del estudiante) — Views/Agendar/Index.cshtml
   ============================================================ */
.agendar-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; max-width: 860px; margin-top: 8px; }
@media (max-width: 760px) { .agendar-grid { grid-template-columns: 1fr; } }
.agendar-card { display: flex; flex-direction: column; gap: 10px; background: #fff; border: 2px solid #e2e8f0; border-radius: 18px; padding: 28px 26px; text-decoration: none; color: #0c4a6e; transition: transform .15s, border-color .15s, box-shadow .15s; }
.agendar-card:hover { transform: translateY(-3px); color: #0c4a6e; }
.agendar-tutoria:hover { border-color: #0ea5e9; box-shadow: 0 14px 32px rgba(14, 165, 233, .18); }
.agendar-apoyo:hover { border-color: #8b5cf6; box-shadow: 0 14px 32px rgba(139, 92, 246, .18); }
.agendar-ico { font-size: 42px; line-height: 1; }
.agendar-card h2 { font-size: 19px; font-weight: 800; margin: 4px 0 0; }
.agendar-card p { font-size: 13.5px; color: #64748b; margin: 0; line-height: 1.5; }
.agendar-cta { margin-top: auto; padding-top: 10px; font-weight: 700; font-size: 14px; }
.agendar-tutoria .agendar-cta { color: #0284c7; }
.agendar-apoyo .agendar-cta { color: #7c3aed; }

/* ============================================================
   Agendar tutoría (estudiante) — Views/BuscarTutor/Index.cshtml
   Tabs (materia/tutor) + buscador + acordeón materia→tutor→día.
   ============================================================ */
.ag-tabs { display: flex; gap: 6px; margin-bottom: 14px; max-width: 980px; }
.ag-tab { border: 1.5px solid #e0f2fe; background: #fff; color: #475569; border-radius: 10px; padding: 9px 18px; font-size: 13.5px; font-weight: 700; cursor: pointer; transition: all .12s; }
.ag-tab:hover { background: #f0f9ff; color: #0c4a6e; }
.ag-tab.active { background: #0c4a6e; border-color: #0c4a6e; color: #fff; }
.ag-search { display: flex; align-items: center; gap: 8px; max-width: 980px; background: #fff; border: 1.5px solid #bae6fd; border-radius: 10px; padding: 8px 12px; margin-bottom: 12px; color: #94a3b8; }
.ag-search:focus-within { border-color: #0ea5e9; box-shadow: 0 0 0 3px rgba(14, 165, 233, .15); }
.ag-search-inp { flex: 1; border: none; outline: none; background: transparent; font-size: 14px; color: #0c4a6e; }

.cat-list { display: flex; flex-direction: column; gap: 10px; max-width: 980px; }
.cat-tutor-avatar-sm { width: 34px; height: 34px; font-size: 13px; }
.cat-tutor-hd .cat-tutor-avatar-sm img { width: 100%; height: 100%; object-fit: cover; }

.cat-materia { background: #fff; border: 1.5px solid #e0f2fe; border-radius: 14px; overflow: hidden; transition: border-color .15s; }
.cat-materia.abierta { border-color: #0ea5e9; }
.cat-materia-hd { display: flex; align-items: center; gap: 12px; width: 100%; background: none; border: none; padding: 16px 18px; cursor: pointer; text-align: left; }
.cat-materia-hd:hover { background: #f0f9ff; }
.cat-materia-ico { font-size: 22px; line-height: 1; }
.cat-materia-nombre { font-weight: 700; color: #0c4a6e; font-size: 15.5px; flex-grow: 1; }
.cat-materia-meta { display: flex; gap: 6px; flex-wrap: wrap; }
.cat-pill { font-size: 11.5px; font-weight: 600; padding: 3px 10px; border-radius: 999px; white-space: nowrap; }
.cat-pill-tutores { background: #e0f2fe; color: #0369a1; }
.cat-pill-turnos { background: #dcfce7; color: #15803d; }
.cat-pill-vacio { background: #f1f5f9; color: #94a3b8; }
.cat-chevron { color: #94a3b8; transition: transform .2s; flex-shrink: 0; }
.cat-materia.abierta .cat-chevron { transform: rotate(180deg); color: #0ea5e9; }

.cat-materia-body { display: none; padding: 0 18px 16px; border-top: 1px solid #f1f5f9; }
.cat-materia.abierta .cat-materia-body { display: block; }

.cat-tutor { padding: 14px 0; border-bottom: 1px dashed #e2e8f0; }
.cat-tutor:last-child { border-bottom: none; padding-bottom: 0; }
.cat-tutor-info { display: flex; gap: 12px; align-items: center; margin-bottom: 10px; }
.cat-tutor-avatar { width: 44px; height: 44px; border-radius: 50%; overflow: hidden; flex-shrink: 0; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #3b82f6, #0ea5e9); color: #fff; font-weight: 800; font-size: 16px; }
.cat-tutor-avatar img { width: 100%; height: 100%; object-fit: cover; }
.cat-tutor-nombre { font-weight: 700; color: #0c4a6e; font-size: 14.5px; }
.cat-tutor-meta { display: flex; gap: 12px; font-size: 12px; color: #64748b; margin-top: 2px; flex-wrap: wrap; }
.cat-eval { background: #fef3c7; color: #a16207; padding: 1px 8px; border-radius: 8px; font-weight: 600; }
.cat-eval-vacia { color: #94a3b8; }
.cat-sin-turnos { margin: 0; font-size: 12.5px; color: #94a3b8; font-style: italic; }

.cat-dia { border: 1px solid #e2e8f0; border-radius: 10px; margin-top: 8px; overflow: hidden; }
.cat-dia-hd { display: flex; align-items: center; gap: 10px; width: 100%; background: #f8fafc; border: none; padding: 9px 12px; cursor: pointer; text-align: left; }
.cat-dia-hd:hover { background: #f0f9ff; }
.cat-dia-nombre { font-weight: 700; color: #0c4a6e; font-size: 13px; flex-grow: 1; text-transform: capitalize; }
.cat-dia-count { font-size: 11px; font-weight: 600; color: #15803d; background: #dcfce7; padding: 2px 9px; border-radius: 999px; white-space: nowrap; }
.cat-dia-chevron { color: #94a3b8; transition: transform .2s; flex-shrink: 0; }
.cat-dia.abierta .cat-dia-chevron { transform: rotate(180deg); color: #0ea5e9; }
.cat-dia-body { display: none; padding: 10px 12px; }
.cat-dia.abierta .cat-dia-body { display: block; }

.cat-turnos { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.cat-turno { background: #fff; border: 1.5px solid #bae6fd; color: #0c4a6e; padding: 9px 12px; border-radius: 10px; font-weight: 600; font-size: 12.5px; text-align: left; cursor: pointer; transition: all .15s; }
.cat-turno-dia { display: block; text-transform: capitalize; font-size: 11.5px; color: #0369a1; }
.cat-turno-hora { display: block; font-size: 13.5px; margin-top: 1px; }
.cat-turno small { display: block; font-weight: 500; font-size: 11px; color: #64748b; margin-top: 2px; }
.cat-turno:hover { background: #0ea5e9; border-color: #0ea5e9; color: #fff; }
.cat-turno:hover .cat-turno-dia, .cat-turno:hover small { color: #e0f2fe; }
.cat-turno:disabled { opacity: .55; cursor: wait; }

/* ============================================================
   Agendar apoyo psicológico (estudiante) — Views/BuscarPsicologo/Index.cshtml
   .psi-tcard renombrado para no chocar con .psi-card del dashboard.
   ============================================================ */
.psi-search { display: flex; align-items: center; gap: 8px; max-width: 980px; background: #fff; border: 1.5px solid #ddd6fe; border-radius: 10px; padding: 8px 12px; margin-bottom: 12px; color: #a78bfa; }
.psi-search:focus-within { border-color: #8b5cf6; box-shadow: 0 0 0 3px rgba(139, 92, 246, .15); }
.psi-search-inp { flex: 1; border: none; outline: none; background: transparent; font-size: 14px; color: #3b0764; }

.psi-list { display: flex; flex-direction: column; gap: 12px; max-width: 980px; }
.psi-tcard { background: #fff; border: 1.5px solid #ede9fe; border-radius: 14px; padding: 16px 18px; transition: border-color .15s; }
.psi-tcard:hover { border-color: #8b5cf6; }
.psi-info { display: flex; gap: 12px; align-items: center; margin-bottom: 12px; }
.psi-avatar { width: 48px; height: 48px; border-radius: 50%; overflow: hidden; flex-shrink: 0; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #8b5cf6, #6d28d9); color: #fff; font-weight: 800; font-size: 17px; }
.psi-avatar img { width: 100%; height: 100%; object-fit: cover; }
.psi-nombre { font-weight: 700; color: #3b0764; font-size: 15px; }
.psi-meta { display: flex; gap: 12px; font-size: 12.5px; color: #64748b; margin-top: 2px; flex-wrap: wrap; }
.psi-sin-turnos { margin: 0; font-size: 12.5px; color: #94a3b8; font-style: italic; }

.psi-dia { border: 1px solid #ede9fe; border-radius: 10px; margin-top: 8px; overflow: hidden; }
.psi-dia-hd { display: flex; align-items: center; gap: 10px; width: 100%; background: #faf5ff; border: none; padding: 9px 12px; cursor: pointer; text-align: left; }
.psi-dia-hd:hover { background: #f3e8ff; }
.psi-dia-nombre { font-weight: 700; color: #3b0764; font-size: 13px; flex-grow: 1; text-transform: capitalize; }
.psi-dia-count { font-size: 11px; font-weight: 600; color: #6d28d9; background: #ede9fe; padding: 2px 9px; border-radius: 999px; white-space: nowrap; }
.psi-dia-chevron { color: #a78bfa; transition: transform .2s; flex-shrink: 0; }
.psi-dia.abierta .psi-dia-chevron { transform: rotate(180deg); color: #8b5cf6; }
.psi-dia-body { display: none; padding: 10px 12px; }
.psi-dia.abierta .psi-dia-body { display: block; }

.psi-turnos { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.psi-turno { background: #fff; border: 1.5px solid #ddd6fe; color: #3b0764; padding: 9px 12px; border-radius: 10px; font-weight: 600; font-size: 12.5px; text-align: left; cursor: pointer; transition: all .15s; }
.psi-turno-dia { display: block; text-transform: capitalize; font-size: 11.5px; color: #7c3aed; }
.psi-turno-hora { display: block; font-size: 13.5px; margin-top: 1px; }
.psi-turno small { display: block; font-weight: 500; font-size: 11px; color: #64748b; margin-top: 2px; }
.psi-turno:hover { background: #8b5cf6; border-color: #8b5cf6; color: #fff; }
.psi-turno:hover .psi-turno-dia, .psi-turno:hover small { color: #ede9fe; }
.psi-turno:disabled { opacity: .55; cursor: wait; }

/* ============================================================
   Mantenimiento → Base de datos — Views/Mantenimiento/BaseDatos.cshtml
   ============================================================ */
.mnt-card .tbd-body { padding: 18px 24px 24px; }
.mnt-vacio {
    text-align: center; padding: 32px 16px;
    color: #64748b; background: #f8fafc; border: 1.5px dashed #cbd5e1;
    border-radius: 12px;
}
.mnt-vacio p { margin: 8px 0 0; font-size: 14px; }
.mnt-vacio-sub { color: #94a3b8; font-size: 12.5px !important; }
.mnt-scripts { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
.mnt-script-card {
    display: flex; gap: 12px; align-items: flex-start;
    padding: 12px 14px; border: 1.5px solid #e0f2fe; border-radius: 10px;
    background: #f8fbff;
}
.mnt-script-orden {
    flex-shrink: 0; width: 28px; height: 28px;
    display: inline-flex; align-items: center; justify-content: center;
    background: #0ea5e9; color: #fff; border-radius: 50%;
    font-weight: 700; font-size: 13px;
}
.mnt-script-body { flex-grow: 1; min-width: 0; }
.mnt-script-nombre { font-weight: 600; color: #0c4a6e; font-size: 14px; word-break: break-all; }
.mnt-script-meta { display: flex; gap: 12px; margin-top: 4px; font-size: 12px; color: #64748b; }
.mnt-script-tam { color: #94a3b8; }
.mnt-script-estado { font-weight: 600; }
.mnt-script-estado.is-ok { color: #15803d; }
.mnt-script-estado.is-error { color: #b91c1c; }
.mnt-script-estado.is-running { color: #0369a1; }
.mnt-script-detalle {
    margin-top: 8px; padding: 8px 10px; border-radius: 8px;
    font-family: 'Consolas', monospace; font-size: 12px;
    background: #fff; border: 1px solid #e2e8f0; color: #334155;
    white-space: pre-wrap; word-break: break-word; max-height: 200px; overflow-y: auto;
}
.mnt-btn-danger {
    background: #b91c1c; border-color: #b91c1c;
}
.mnt-btn-danger:hover:not(:disabled) { background: #991b1b; border-color: #991b1b; }
.mnt-btn-danger:disabled { background: #cbd5e1; border-color: #cbd5e1; cursor: not-allowed; }
.mnt-script-descarga {
    flex-shrink: 0; align-self: center;
    display: inline-flex; align-items: center; gap: 6px;
    padding: 6px 12px; font-size: 12.5px; font-weight: 600;
    color: #0369a1; background: #fff; border: 1.5px solid #bae6fd;
    border-radius: 8px; text-decoration: none;
    transition: background 0.15s, border-color 0.15s, color 0.15s;
}
.mnt-script-descarga:hover {
    background: #0ea5e9; border-color: #0ea5e9; color: #fff;
    text-decoration: none;
}
.mnt-script-descarga svg { display: block; }

/* ============================================================
   Roles y Permisos — Views/RolesPermisos/Index.cshtml
   ============================================================ */
.rp-tabla-wrap { overflow-x: auto; border: 1px solid #e0f2fe; border-radius: 12px; background: #fff; }
.rp-tabla { width: 100%; border-collapse: collapse; min-width: 800px; }
.rp-tabla thead th {
    background: #0c4a6e; color: #fff;
    padding: 12px 10px; font-size: 13px; font-weight: 600;
    text-align: center; position: sticky; top: 0; z-index: 1;
}
.rp-tabla .rp-col-permiso { text-align: left; min-width: 240px; }
.rp-tabla .rp-col-rol     { min-width: 130px; }

.rp-tabla tbody td {
    padding: 10px; border-bottom: 1px solid #e2e8f0;
    text-align: center; vertical-align: middle;
}
.rp-tabla tbody tr:last-child td { border-bottom: none; }
.rp-tabla tbody tr:hover { background: #f0f9ff; }
.rp-celda-permiso { text-align: left !important; }
.rp-permiso-nombre {
    font-family: 'Consolas', monospace; font-size: 13px;
    color: #0c4a6e; font-weight: 600;
}

.rp-switch { position: relative; display: inline-block; width: 42px; height: 22px; cursor: pointer; }
.rp-switch input { opacity: 0; width: 0; height: 0; }
.rp-slider {
    position: absolute; inset: 0; background: #cbd5e1; border-radius: 22px;
    transition: background .2s;
}
.rp-slider::before {
    content: ""; position: absolute;
    height: 18px; width: 18px; left: 2px; top: 2px;
    background: #fff; border-radius: 50%;
    transition: transform .2s;
}
.rp-switch input:checked + .rp-slider { background: #10b981; }
.rp-switch input:checked + .rp-slider::before { transform: translateX(20px); }
.rp-switch input:disabled + .rp-slider { opacity: .5; cursor: not-allowed; }

.rp-toast {
    position: fixed; bottom: 24px; right: 24px; z-index: 1000;
    padding: 12px 18px; border-radius: 10px;
    font-size: 13.5px; font-weight: 600;
    box-shadow: 0 8px 24px rgba(0,0,0,.15);
}
.rp-toast.is-ok    { background: #dcfce7; color: #166534; border: 1px solid #86efac; }
.rp-toast.is-error { background: #fee2e2; color: #991b1b; border: 1px solid #fca5a5; }

/* ============================================================
   Detalle de tutor (turnos por día) — Views/BuscarTutor/Detalle.cshtml
   Clases .dia-*/.turno-btn/.turnos-grid compartidas (variante azul).
   ============================================================ */
.filtro-materia-bar {
    display:flex; justify-content:space-between; align-items:center; gap:10px;
    background:#e0f2fe; border:1px solid #bae6fd; border-radius:12px;
    padding:10px 16px; margin-bottom:14px; color:#0c4a6e; font-size:13.5px;
}
.ver-todos-link { color:#0284c7; font-weight:700; text-decoration:none; white-space:nowrap; font-size:12.5px; }
.ver-todos-link:hover { text-decoration:underline; }

.dias-list { display:flex; flex-direction:column; gap:18px; }
.dia-bloque { display:flex; gap:14px; align-items:flex-start; }
.dia-titulo {
    flex-shrink:0; min-width:80px; text-align:center; padding:10px;
    background:#dbeafe; color:#1e40af; border-radius:10px;
}
.dia-num    { font-size:24px; font-weight:800; display:block; line-height:1; }
.dia-mes    { font-size:11px; font-weight:700; letter-spacing:1px; display:block; margin-top:2px; }
.dia-nombre { font-size:12px; text-transform:capitalize; color:#64748b; display:block; margin-top:6px; }
.turnos-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:8px; flex-grow:1; }
.turno-btn {
    background:#fff; border:1.5px solid #bae6fd; color:#0c4a6e;
    padding:10px 12px; border-radius:10px; font-weight:600; font-size:13px;
    text-align:left; cursor:pointer; transition:all .15s;
}
.turno-btn small { display:block; font-weight:500; font-size:11.5px; color:#64748b; margin-top:2px; }
.turno-btn:hover { background:#0ea5e9; color:#fff; border-color:#0ea5e9; }
.turno-btn:hover small { color:#fff; }

/* ============================================================
   Detalle de psicólogo (turnos por día) — Views/BuscarPsicologo/Detalle.cshtml
   Clases .psd-* (variante violeta, independiente del detalle de tutor).
   ============================================================ */
.psd-dias-list { display:flex; flex-direction:column; gap:18px; }
.psd-dia-bloque { display:flex; gap:14px; align-items:flex-start; }
.psd-dia-titulo {
    flex-shrink:0; min-width:80px; text-align:center; padding:10px;
    background:#ede9fe; color:#5b21b6; border-radius:10px;
}
.psd-dia-num    { font-size:24px; font-weight:800; display:block; line-height:1; }
.psd-dia-mes    { font-size:11px; font-weight:700; letter-spacing:1px; display:block; margin-top:2px; }
.psd-dia-nombre { font-size:12px; text-transform:capitalize; color:#64748b; display:block; margin-top:6px; }
.psd-turnos-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:8px; flex-grow:1; }
.psd-turno-btn {
    background:#fff; border:1.5px solid #ddd6fe; color:#3b0764;
    padding:10px 12px; border-radius:10px; font-weight:600; font-size:13px;
    text-align:left; cursor:pointer; transition:all .15s;
}
.psd-turno-btn small { display:block; font-weight:500; font-size:11.5px; color:#64748b; margin-top:2px; }
.psd-turno-btn:hover { background:#8b5cf6; color:#fff; border-color:#8b5cf6; }
.psd-turno-btn:hover small { color:#fff; }

/* ===================================================================
   Gestor de catálogos (modales reutilizables: Universidad / Carrera /
   Semestre / Psicólogo). Usados por la entrevista inicial, el alta de
   tutores y cualquier vista que incluya el partial _GestorCatalogos.
   =================================================================== */
.psm-trigger { flex-shrink: 0; width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center; border: none; border-radius: 10px; color: #fff; background: linear-gradient(135deg, #fb923c, #f97316); cursor: pointer; box-shadow: 0 4px 10px rgba(249, 115, 22, .30); transition: all .15s; }
.psm-trigger:hover { background: linear-gradient(135deg, #f97316, #ea580c); transform: translateY(-1px); box-shadow: 0 7px 15px rgba(249, 115, 22, .40); }
.psm-overlay { position: fixed; inset: 0; z-index: 1080; background: rgba(15, 23, 42, .55); display: flex; align-items: flex-start; justify-content: center; padding: 42px 16px; overflow: auto; }
.psm-overlay.d-none { display: none; }
.psm-box { background: #fff; border: 1px solid #bae6fd; border-radius: 16px; max-width: 700px; width: 100%; box-shadow: 0 26px 64px rgba(2, 32, 71, .38); overflow: hidden; }
.psm-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 20px; background: linear-gradient(180deg, #f0f9ff, #e0f2fe); border-bottom: 1px solid #bae6fd; }
.psm-head-title { display: flex; align-items: center; gap: 10px; font-size: 1.1rem; font-weight: 700; color: #0c4a6e; }
.psm-head-ic { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 9px; background: #fff; border: 1px solid #bae6fd; color: #0369a1; }
.psm-close { width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #bae6fd; border-radius: 9px; background: #fff; color: #0c4a6e; cursor: pointer; transition: all .15s; }
.psm-close:hover { background: #e0f2fe; color: #b91c1c; border-color: #fecaca; }
.psm-body { padding: 20px; }
.psm-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.psm-toolbar-sub { font-size: 12.5px; color: #64748b; }
/* Caja de búsqueda dentro del modal */
.psm-search { position: relative; margin-bottom: 12px; }
.psm-search input { width: 100%; border: 1.5px solid #bae6fd; border-radius: 10px; padding: 9px 12px 9px 34px; font-size: 14px; color: #0c4a6e; background: #fff; transition: all .15s; }
.psm-search input:focus { border-color: #0ea5e9; outline: none; box-shadow: 0 0 0 3px rgba(14, 165, 233, .15); }
.psm-search svg { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); color: #94a3b8; pointer-events: none; }
.psm-list { max-height: 340px; overflow: auto; border: 1px solid #bae6fd; border-radius: 12px; background: #f8fbff; }
.psm-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 14px; border-bottom: 1px solid #e0f2fe; }
.psm-row:last-child { border-bottom: none; }
.psm-row:hover { background: #eef7ff; }
.psm-row-name { font-weight: 600; color: #0c4a6e; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.psm-row-sub { font-size: 12px; color: #64748b; }
.psm-row-acts { flex-shrink: 0; display: flex; gap: 6px; }
.psm-mini { padding: 5px 12px; font-size: 12.5px; font-weight: 600; border-radius: 8px; background: #fff; border: 1px solid #bae6fd; color: #0c4a6e; cursor: pointer; transition: all .15s; }
.psm-mini:hover { background: #e0f2fe; }
.psm-mini.psm-del { color: #b91c1c; border-color: #fecaca; }
.psm-mini.psm-del:hover { background: #fef2f2; }
.psm-empty { padding: 26px 14px; text-align: center; color: #64748b; font-size: 13px; }
.psm-inp { width: 100%; border: 1.5px solid #bae6fd; border-radius: 10px; padding: 9px 12px; font-size: 14px; color: #0c4a6e; background: #fff; transition: all .15s; }
.psm-inp:focus { border-color: #0ea5e9; outline: none; box-shadow: 0 0 0 3px rgba(14, 165, 233, .15); }
.psm-inp[readonly] { background: #f0f9ff; color: #64748b; cursor: not-allowed; }
.psm-msg { color: #b91c1c; font-size: 13px; font-weight: 600; margin-top: 12px; min-height: 6px; }
.psm-foot { display: flex; justify-content: flex-end; gap: 10px; padding: 14px 20px; border-top: 1px solid #e0f2fe; background: #f8fbff; }
.psm-foot-grp { display: flex; gap: 10px; }

/* ===== Creación Masiva de Usuarios (cmu-*) ===== */
.cmu-kpi { border: 1px solid #e2e8f0; border-radius: 12px; padding: 14px; text-align: center; background: #f8fafc; }
.cmu-kpi-num { font-size: 26px; font-weight: 800; color: #0f172a; line-height: 1; }
.cmu-kpi-lbl { font-size: 12px; color: #64748b; margin-top: 6px; text-transform: uppercase; letter-spacing: .4px; }
.cmu-ok { background: #f0fdf4; border-color: #bbf7d0; }
.cmu-warn { background: #fefce8; border-color: #fde68a; }
.cmu-err { background: #fef2f2; border-color: #fecaca; }
.cmu-badge { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; }

/* ===== Créditos acumulados: comparativo en vivo (ent-acum-*) ===== */
.ent-acum-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-top: 16px; margin-bottom: 16px; }
.ent-acum-box { border: 1px solid #e2e8f0; border-radius: 12px; padding: 12px 14px; background: #f8fafc; }
.ent-acum-lbl { font-size: 12px; color: #64748b; font-weight: 700; text-transform: uppercase; letter-spacing: .3px; display: block; }
.ent-acum-vals { display: flex; align-items: baseline; gap: 8px; margin-top: 8px; flex-wrap: wrap; }
.ent-acum-base { font-size: 15px; color: #0f172a; font-weight: 700; }
.ent-acum-arrow { color: #94a3b8; font-weight: 700; }
.ent-acum-proj { font-size: 15px; font-weight: 800; color: #0f172a; }
.ent-acum-delta { font-size: 12px; color: #16a34a; font-weight: 700; }
.ent-acum-input { margin-top: 8px; }
.ent-acum-cmp { margin-top: 8px; font-size: 12.5px; color: #64748b; display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
@media (max-width: 720px) { .ent-acum-grid { grid-template-columns: 1fr; } }
