/* ============================================================
   CONTROL DE ASISTENCIA · Identidad visual institucional V1.6
   Paleta: azul institucional + turquesa tecnológico + neutros.
   ============================================================ */
:root{
    --sa-primary:#12355B;
    --sa-primary-700:#0E2B4B;
    --sa-primary-600:#174A70;
    --sa-action:#1F6FB2;
    --sa-action-hover:#195C94;
    --sa-secondary:#167D7F;
    --sa-secondary-dark:#116568;
    --sa-accent:#63D4D5;
    --sa-success:#198754;
    --sa-warning:#F59E0B;
    --sa-danger:#DC3545;
    --sa-info:#0E7490;
    --sa-bg:#F5F7FA;
    --sa-surface:#FFFFFF;
    --sa-surface-soft:#F8FAFC;
    --sa-text:#172B4D;
    --sa-text-soft:#344054;
    --sa-muted:#667085;
    --sa-border:#D8E0EA;
    --sa-border-soft:#E8EDF3;
    --sa-shadow:0 14px 34px rgba(16,36,63,.09);
    --sa-shadow-sm:0 5px 16px rgba(16,36,63,.06);
    --sa-shadow-lg:0 24px 60px rgba(16,36,63,.14);
    --sa-radius:14px;
    --sa-radius-sm:10px;
    --sa-content-max:1440px;
}

*{box-sizing:border-box}
html{min-height:100%;background:var(--sa-bg);scroll-behavior:smooth}
body{
    min-height:100vh;
    margin:0;
    overflow-x:hidden;
    font-family:Inter,"Segoe UI",Roboto,Arial,sans-serif;
    font-size:15px;
    line-height:1.52;
    color:var(--sa-text);
    background:linear-gradient(180deg,#F8FAFC 0%,var(--sa-bg) 100%);
    -webkit-font-smoothing:antialiased;
}
::selection{background:rgba(31,111,178,.18);color:var(--sa-primary)}
a{color:var(--sa-action);text-decoration:none;transition:color .15s ease}
a:hover{color:var(--sa-action-hover)}
hr{border-color:var(--sa-border-soft);opacity:1}

/* ---------- NAVEGACIÓN INSTITUCIONAL ---------- */
.sa-navbar{
    min-height:84px;
    background:linear-gradient(105deg,var(--sa-primary) 0%,#174A70 60%,var(--sa-secondary) 100%);
    border-bottom:1px solid rgba(255,255,255,.10);
    box-shadow:0 7px 24px rgba(16,36,63,.16);
    position:sticky;
    top:0;
    z-index:1030;
    padding:.45rem 0;
}
.sa-navbar .container-fluid{
    width:min(var(--sa-content-max),calc(100% - 72px));
    margin:0 auto;
    padding-inline:0;
}
.sa-navbar .navbar-brand{
    display:flex;align-items:center;gap:.78rem;
    color:#fff;font-size:1.08rem;font-weight:750;letter-spacing:.1px;
    margin-right:1.45rem;white-space:nowrap;
}
.brand-mark{
    width:43px;height:43px;border-radius:12px;display:grid;place-items:center;
    background:linear-gradient(135deg,#7AE2DF,var(--sa-accent));
    color:var(--sa-primary);
    border:1px solid rgba(255,255,255,.46);
    box-shadow:0 5px 14px rgba(0,0,0,.12),inset 0 1px 0 rgba(255,255,255,.45);
    font-size:1.18rem;
}
.brand-copy{line-height:1.05}
.brand-copy small{display:block;font-size:.69rem;font-weight:500;color:#D9EAF5;margin-top:.24rem;letter-spacing:.4px}
.sa-navbar .navbar-nav{gap:.05rem!important}
.sa-navbar .nav-link{
    color:#EAF2F8!important;
    padding:.78rem .72rem!important;
    border-radius:9px;
    font-size:.96rem;font-weight:650;line-height:1.1;white-space:nowrap;
    transition:background .16s ease,color .16s ease,transform .16s ease;
}
.sa-navbar .nav-link:hover,.sa-navbar .nav-link:focus,.sa-navbar .nav-link.show,.sa-navbar .nav-link.active{
    background:rgba(255,255,255,.12);color:#fff!important;
}
.sa-navbar .nav-link.active{box-shadow:inset 0 -2px 0 rgba(99,212,213,.95)}
.sa-navbar .dropdown-menu{
    border:1px solid var(--sa-border);border-radius:12px;padding:.5rem;
    box-shadow:0 18px 44px rgba(16,36,63,.18);min-width:240px;
}
.sa-navbar .dropdown-item{border-radius:8px;padding:.66rem .76rem;color:var(--sa-text-soft);font-size:.94rem;font-weight:500}
.sa-navbar .dropdown-item:hover,.sa-navbar .dropdown-item:focus{background:#EEF5FB;color:var(--sa-primary)}
.sa-user{display:flex;align-items:center;gap:.6rem;color:#ECF5F8;border-left:1px solid rgba(255,255,255,.18);padding-left:1rem;margin-left:.55rem;white-space:nowrap}
.sa-avatar{width:37px;height:37px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.23);color:#fff}
.sa-role{font-size:.70rem;color:#BEE4EA;line-height:1.1;text-transform:uppercase;letter-spacing:.3px}

/* ---------- CONTENIDO ---------- */
.sa-main{width:min(var(--sa-content-max),calc(100% - 72px));margin:0 auto;padding:2rem 0 3.2rem}
.sa-main > h1,.sa-main > h2,.sa-main > h3,.page-title{font-weight:760;color:var(--sa-primary);letter-spacing:-.35px}
.sa-main > h2{font-size:1.72rem;margin:0 0 1.15rem}
.page-title{font-size:1.8rem;margin-bottom:.15rem}
.page-subtitle{color:var(--sa-muted);margin-bottom:1.3rem;font-size:.98rem}
.page-header{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.3rem}
.page-header .actions{display:flex;gap:.55rem;flex-wrap:wrap}
.sa-main > form:not(.card){background:var(--sa-surface);border:1px solid var(--sa-border);border-radius:var(--sa-radius);padding:1.25rem;box-shadow:var(--sa-shadow-sm)}

/* ---------- TARJETAS ---------- */
.card{border:1px solid var(--sa-border);border-radius:var(--sa-radius);box-shadow:var(--sa-shadow-sm);background:var(--sa-surface);overflow:hidden}
.card-header{background:#fff;border-bottom:1px solid var(--sa-border);color:var(--sa-primary);padding:1rem 1.15rem;font-weight:700}
.card-body{padding:1.2rem}
.card-kpi{height:100%;border:1px solid var(--sa-border-soft);box-shadow:var(--sa-shadow);position:relative;overflow:hidden}
.card-kpi::after{content:"";position:absolute;width:78px;height:78px;border-radius:50%;right:-24px;top:-25px;background:rgba(31,111,178,.07)}
.card-kpi .kpi-label{font-size:.77rem;text-transform:uppercase;letter-spacing:.55px;color:var(--sa-muted);font-weight:750}
.card-kpi .kpi-number{font-size:1.85rem;font-weight:800;color:var(--sa-primary);line-height:1.15;margin-top:.3rem}
.card-kpi .kpi-icon{width:43px;height:43px;border-radius:11px;display:grid;place-items:center;background:#EDF5FB;color:var(--sa-action);font-size:1.05rem}
.kpi-teal .kpi-icon{background:#E8F7F5;color:var(--sa-secondary)}
.kpi-amber .kpi-icon{background:#FFF7E8;color:#B76700}
.kpi-red .kpi-icon{background:#FFF0F0;color:#B42318}
.kpi-violet .kpi-icon{background:#F3F0FF;color:#6941C6}

/* ---------- TABLAS ---------- */
.table-responsive{border-radius:0 0 var(--sa-radius) var(--sa-radius);overflow-x:auto}
.table{--bs-table-bg:transparent;--bs-table-striped-bg:#FAFBFC;color:var(--sa-text-soft);margin-bottom:0;font-size:.93rem}
.table thead th{white-space:nowrap;background:#F3F7FB;color:#3E536B;font-size:.77rem;text-transform:uppercase;letter-spacing:.43px;border-bottom:1px solid var(--sa-border);padding:.86rem .8rem;font-weight:750}
.table tbody td{padding:.84rem .8rem;vertical-align:middle;border-color:var(--sa-border-soft)}
.table tbody tr{transition:background .13s ease}
.table tbody tr:hover{background:#F7FBFE}
.sa-main > .table,.sa-main > .table-responsive{background:#fff;border:1px solid var(--sa-border);border-radius:var(--sa-radius);box-shadow:var(--sa-shadow-sm);overflow:hidden}

/* ---------- FORMULARIOS ---------- */
.form-label,label{font-weight:650;color:var(--sa-text-soft);margin-bottom:.4rem;font-size:.92rem}
.form-control,.form-select{
    border:1px solid #C9D4E0;border-radius:9px;min-height:44px;
    color:var(--sa-text);background-color:#fff;font-size:.95rem;box-shadow:none;
    transition:border-color .15s,box-shadow .15s,background-color .15s;
}
.form-control::placeholder{color:#98A2B3}
.form-control:hover,.form-select:hover{border-color:#AEBECD}
.form-control:focus,.form-select:focus{border-color:var(--sa-action);box-shadow:0 0 0 .20rem rgba(31,111,178,.12)}
.form-control:disabled,.form-select:disabled{background:#F2F4F7;color:#98A2B3}
.input-group-text{border-color:#C9D4E0;background:#F7F9FC;color:#667085}
textarea.form-control{min-height:96px}
.form-text,small{color:var(--sa-muted)}
.form-check-input:checked{background-color:var(--sa-action);border-color:var(--sa-action)}

/* ---------- BOTONES ---------- */
.btn{border-radius:9px;font-weight:650;padding:.50rem .86rem;box-shadow:none!important;font-size:.93rem;transition:transform .12s ease,background .15s ease,border-color .15s ease}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn-primary{background:var(--sa-action);border-color:var(--sa-action)}
.btn-primary:hover,.btn-primary:focus{background:var(--sa-action-hover);border-color:var(--sa-action-hover)}
.btn-success{background:var(--sa-success);border-color:var(--sa-success)}
.btn-success:hover{background:#146C43;border-color:#146C43}
.btn-warning{background:var(--sa-warning);border-color:var(--sa-warning);color:#3E2A00}
.btn-warning:hover{background:#DB8805;border-color:#DB8805;color:#fff}
.btn-danger{background:#C93636;border-color:#C93636}
.btn-danger:hover{background:#A92D2D;border-color:#A92D2D}
.btn-secondary{background:#64748B;border-color:#64748B}
.btn-secondary:hover{background:#526176;border-color:#526176}
.btn-outline-primary{border-color:#76A8D0;color:var(--sa-action)}
.btn-outline-primary:hover{background:var(--sa-action);border-color:var(--sa-action);color:#fff}
.btn-outline-secondary{border-color:#A9B6C5;color:#526176}
.btn-outline-secondary:hover{background:#526176;border-color:#526176;color:#fff}
.btn-outline-danger{border-color:#E17B7B;color:#B42318}
.btn-outline-danger:hover{background:#B42318;border-color:#B42318;color:#fff}

/* ---------- ESTADOS / ALERTAS ---------- */
.badge{font-weight:700;border-radius:999px;padding:.42em .70em;letter-spacing:.08px}
.text-bg-primary{background:var(--sa-action)!important}
.text-bg-success{background:var(--sa-success)!important}
.text-bg-warning{background:var(--sa-warning)!important;color:#3E2A00!important}
.alert{border:1px solid transparent;border-radius:11px;box-shadow:none;padding:.85rem 1rem}
.alert-success{background:#ECF8F2;color:#0B6847;border-color:#CDECDD}
.alert-danger{background:#FFF1F1;color:#922626;border-color:#F4CECE}
.alert-warning{background:#FFF8E8;color:#805006;border-color:#F5E0AE}
.alert-info{background:#EAF8FA;color:#155E68;border-color:#C7EBEF}
.alert-primary{background:#EDF5FB;color:#174A70;border-color:#D2E5F5}
.toast{border-radius:12px!important;overflow:hidden}

/* ---------- LOGIN ---------- */
.auth-shell{min-height:calc(100vh - 84px - 4rem);display:grid;place-items:center;padding:1rem 0 2rem}
.auth-card{width:min(100%,420px);border:1px solid var(--sa-border);border-radius:18px;box-shadow:var(--sa-shadow-lg)}
.auth-head{padding:1.42rem 1.45rem 1.18rem;background:linear-gradient(135deg,var(--sa-primary),var(--sa-secondary));color:#fff}
.auth-head h3{font-size:1.5rem;font-weight:750}
.auth-icon{width:48px;height:48px;border-radius:13px;display:grid;place-items:center;background:rgba(99,212,213,.13);border:1px solid rgba(99,212,213,.32);color:#8BE5E4;font-size:1.24rem}
.auth-links{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap;font-size:.90rem}
.auth-links a{font-weight:550}
.login-toast-wrap{z-index:1080;width:min(92vw,460px)}

/* ---------- TERMINAL ---------- */
.terminal-page{min-height:100vh;background:linear-gradient(180deg,#F8FAFC 0%,#F2F6FA 100%)}
.terminal-topbar{background:linear-gradient(100deg,var(--sa-primary),var(--sa-secondary));color:#fff;min-height:76px;display:flex;align-items:center;box-shadow:0 5px 20px rgba(16,36,63,.16)}
.terminal-topbar-inner{width:min(1180px,calc(100% - 48px));margin:0 auto;display:flex;align-items:center;justify-content:space-between}
.terminal-topbar .brand-mark{width:40px;height:40px;margin-right:10px}
.terminal-topbar .brand-title{font-weight:750;line-height:1.05;font-size:1rem}
.terminal-topbar .brand-subtitle{font-size:.70rem;opacity:.78}
.terminal-main{max-width:1120px;margin:0 auto;padding:30px 22px 44px}
.terminal-toast{position:fixed;top:20px;left:50%;transform:translateX(-50%);min-width:320px;max-width:620px;z-index:1080;box-shadow:0 12px 35px rgba(16,36,63,.17)}
.terminal-card{max-width:820px;margin:auto}
.terminal-shell{border:1px solid var(--sa-border);box-shadow:0 22px 55px rgba(16,36,63,.13)}
.terminal-head{text-align:center;color:#fff;padding:1.4rem 1.2rem;background:linear-gradient(135deg,var(--sa-primary),var(--sa-secondary))}
.terminal-head .pulse-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#34D399;margin-right:.35rem;box-shadow:0 0 0 6px rgba(52,211,153,.12)}
.scan-input{font-size:1.28rem;letter-spacing:.045rem;text-align:center;min-height:62px;border:2px solid #8EDBD7;background:#F4FCFB}
.scan-input:focus{border-color:var(--sa-secondary);box-shadow:0 0 0 .22rem rgba(22,125,127,.13)}

/* ---------- QR / CREDENCIALES ---------- */
.foto-carnet{width:78px;height:100px;object-fit:cover;border-radius:9px;border:1px solid var(--sa-border);background:#F1F5F9}
.qr-img{width:180px;height:180px}
.code-token{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:#8E3A5F;font-size:.84rem}.qr-replace-select{min-width:145px}

/* ---------- PORTAL APODERADO ---------- */
.portal-body{min-height:100vh;background:linear-gradient(135deg,#F8FAFC 0%,#EDF5FB 50%,#EEF9F7 100%)}
.portal-header{background:linear-gradient(115deg,var(--sa-primary),var(--sa-secondary));color:#fff;border-radius:16px;box-shadow:var(--sa-shadow);padding:1.25rem 1.4rem}
.portal-kpi{border:1px solid var(--sa-border-soft);box-shadow:var(--sa-shadow-sm)}
.portal-kpi small{text-transform:uppercase;letter-spacing:.45px;color:var(--sa-muted);font-weight:700}
.portal-kpi .fs-3{font-weight:800;color:var(--sa-primary)}
.portal-avatar{width:52px;height:52px;background:#EAF4FB;color:var(--sa-primary);border:1px solid #CFE2F2}

/* ---------- UTILIDADES ---------- */
.search-card{margin-bottom:1rem}
.danger-zone{border:1px solid #F2BDBD;background:#FFFBFB}
.danger-zone .card-body{padding:1rem 1.15rem}
.empty-state{padding:2.25rem;text-align:center;color:var(--sa-muted)}
.text-muted{color:var(--sa-muted)!important}
.pagination{--bs-pagination-color:var(--sa-action);--bs-pagination-active-bg:var(--sa-action);--bs-pagination-active-border-color:var(--sa-action);--bs-pagination-border-color:var(--sa-border)}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1199.98px){
    .sa-navbar .nav-link{font-size:.91rem;padding:.70rem .56rem!important}
    .sa-navbar .navbar-brand{margin-right:.9rem}
}
@media (max-width:991.98px){
    .sa-navbar{min-height:74px}
    .sa-navbar .container-fluid,.sa-main{width:calc(100% - 30px)}
    .sa-navbar .nav-link{margin:.1rem 0;padding:.72rem .75rem!important}
    .sa-user{border-left:0;padding-left:0;margin:1rem 0 .6rem}
    .sa-main{padding:1.35rem 0 2rem}
    .page-header{align-items:flex-start;flex-direction:column}
    .auth-shell{min-height:calc(100vh - 74px - 2.7rem)}
}
@media (max-width:575.98px){
    body{font-size:14px}
    .brand-copy small{display:none}
    .brand-mark{width:39px;height:39px}
    .auth-card{max-width:390px}
    .sa-main > h2,.page-title{font-size:1.52rem}
    .terminal-main{padding:20px 14px 32px}
    .terminal-topbar-inner{width:calc(100% - 28px)}
}
@media print{
    nav,.no-print,.terminal-topbar{display:none!important}
    body{background:#fff!important;color:#000!important}
    main,.sa-main,.terminal-main{width:100%!important;max-width:none!important;margin:0!important;padding:0!important}
    .card{box-shadow:none!important;border-color:#bbb!important}
    .table thead th{background:#eee!important;color:#000!important}
}

/* Accesibilidad y pequeños acabados */
:focus-visible{outline:3px solid rgba(31,111,178,.25);outline-offset:2px}
.btn-outline-success{border-color:#65A883;color:var(--sa-success)}
.btn-outline-success:hover{background:var(--sa-success);border-color:var(--sa-success);color:#fff}
.table-light{--bs-table-bg:#F3F7FB;--bs-table-color:#3E536B}
.text-bg-secondary{background:#667085!important}
code{font-size:.88em}
