:root{--app-primary:#0b3d91;--app-primary-2:#1261c9;--app-surface:#f3f6fb;--app-text:#1f2937;--app-muted:#64748b}
html,body{min-height:100%}body{background:var(--app-surface);color:var(--app-text);font-family:"Segoe UI",Arial,sans-serif}.app-navbar{background:linear-gradient(110deg,#082f6d,#0b4da2 62%,#0b5fc2);min-height:76px}.app-brand{display:flex;align-items:center;gap:12px;white-space:normal;line-height:1.15;max-width:980px}.app-brand-mark{width:46px;height:46px;min-width:46px;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.14);border-radius:13px;display:flex;align-items:center;justify-content:center;font-weight:800;letter-spacing:.5px}.app-brand-text{display:flex;flex-direction:column;font-size:.88rem;letter-spacing:.1px}.app-brand-text small{margin-top:5px;font-size:.74rem;opacity:.83;font-weight:500}.app-navbar .nav-link{color:rgba(255,255,255,.83);font-weight:600}.app-navbar .nav-link:hover{color:#fff}.user-name{font-weight:600}.card{border-radius:1rem}.score-pill{background:#fff;border:1px solid #e5e7eb;padding:.7rem 1rem;border-radius:999px;box-shadow:0 2px 10px rgba(0,0,0,.05)}.criterion-card{border-left:4px solid #0d6efd!important}.max-score{white-space:nowrap;background:#eef4ff;padding:.4rem .7rem;border-radius:.6rem;color:#0d6efd;font-weight:600}.sticky-actions{position:sticky;bottom:1rem;z-index:5;background:rgba(245,247,251,.92);padding:.7rem;border-radius:.8rem;backdrop-filter:blur(6px)}
.login-page-shell{padding:2.25rem 0 3rem;min-height:calc(100vh - 76px);display:flex;align-items:center}.login-panel{width:100%;max-width:1050px;margin:0 auto;border-radius:24px;overflow:hidden;background:#fff;min-height:590px}.login-brand-panel{position:relative;background:linear-gradient(145deg,#082f6d,#0b4da2 56%,#1671d9);color:#fff;align-items:center;overflow:hidden}.login-brand-panel:before,.login-brand-panel:after{content:"";position:absolute;border-radius:999px;background:rgba(255,255,255,.07)}.login-brand-panel:before{width:360px;height:360px;right:-160px;top:-120px}.login-brand-panel:after{width:280px;height:280px;left:-135px;bottom:-100px}.login-brand-content{position:relative;z-index:1;padding:4rem}.brand-badge{width:84px;height:84px;border-radius:24px;display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.28);font-weight:800;font-size:1.6rem;letter-spacing:1px;box-shadow:0 14px 35px rgba(0,0,0,.14)}.brand-badge-small{width:62px;height:62px;border-radius:18px;background:linear-gradient(145deg,#0b3d91,#1971d4);color:#fff;border:0;font-size:1.15rem}.login-brand-content h1{font-size:2rem;line-height:1.25;margin:1.75rem 0 1rem;font-weight:750}.school-name{font-size:1.15rem;font-weight:700;margin-bottom:.3rem}.school-address{opacity:.82}.brand-divider{width:72px;height:4px;border-radius:4px;background:#fff;opacity:.75;margin:2rem 0}.brand-description{font-size:1rem;line-height:1.7;max-width:390px;opacity:.88}.login-form-wrap{padding:4rem 4.25rem;height:100%;display:flex;flex-direction:column;justify-content:center}.login-eyebrow{font-size:.75rem;letter-spacing:1.4px;color:var(--app-primary-2);font-weight:800;margin-bottom:.55rem}.login-title{font-weight:750;font-size:2rem;margin-bottom:.5rem}.login-control{border-radius:12px;border-color:#d8e0ea;min-height:52px;font-size:1rem}.login-control:focus{border-color:#4d8bd7;box-shadow:0 0 0 .2rem rgba(13,110,253,.12)}.password-toggle{border-radius:0 12px 12px 0;min-width:74px}.login-submit{border-radius:12px;min-height:52px;font-weight:700;background:linear-gradient(100deg,#0b3d91,#1261c9);border:0;box-shadow:0 10px 22px rgba(11,77,162,.22)}.login-submit:hover{background:linear-gradient(100deg,#082f6d,#0f55b1)}.login-db-alert{background:#fff7e5;color:#7a4b00;border-radius:12px!important}.login-footer-note{font-size:.78rem;color:var(--app-muted);line-height:1.5;margin-top:1.5rem}
@media(max-width:991.98px){.app-navbar{min-height:68px}.app-brand-text strong{font-size:.78rem}.app-brand-text small{font-size:.68rem}.login-page-shell{padding:1.5rem 0;min-height:auto}.login-panel{max-width:610px;min-height:0}.login-form-wrap{padding:3rem}.user-area{padding:.75rem 0 1rem}}@media(max-width:575.98px){.app-brand-mark{width:40px;height:40px;min-width:40px}.app-brand-text strong{font-size:.68rem}.app-brand-text small{display:none}.login-page-shell{padding:.75rem 0}.login-panel{border-radius:16px}.login-form-wrap{padding:2rem 1.25rem}.login-title{font-size:1.65rem}}

/* Phiếu tự đánh giá KPI theo Mẫu 1A */
.quarter-picker{min-width:280px}.dashboard-main-card{background:linear-gradient(135deg,#fff,#f7faff)}.dashboard-score{font-size:2.25rem;font-weight:800;color:var(--app-primary);white-space:nowrap}.dashboard-score span{font-size:1rem;color:var(--app-muted);font-weight:600}.evaluation-header{background:linear-gradient(135deg,#fff,#f4f8ff)}.score-box{display:inline-flex;flex-direction:column;align-items:center;min-width:130px;padding:.8rem 1rem;background:#0b3d91;color:#fff;border-radius:14px}.score-box span{font-size:.72rem;text-transform:uppercase;opacity:.82}.score-box strong{font-size:2rem;line-height:1.1;margin-top:.15rem}.score-box small{opacity:.82}.evaluation-table-card{overflow:hidden}.kpi-table{min-width:1180px}.kpi-table thead th{background:#0b3d91;color:#fff;text-align:center;vertical-align:middle;font-size:.88rem;padding:.9rem .65rem;border-color:#3761a0}.kpi-table td{padding:.8rem .65rem;border-color:#dce3ec}.kpi-table .col-stt{width:55px}.kpi-table .col-max{width:120px}.kpi-table .col-score{width:135px}.kpi-table .col-evidence{width:260px}.kpi-table .col-note{width:240px}.group-row td{background:#eaf1fb!important;color:#0b3d91;font-weight:800;text-transform:uppercase;letter-spacing:.25px}.criterion-title{font-weight:700;color:#1e293b}.criterion-description{font-size:.86rem;color:#64748b;margin-top:.3rem;white-space:pre-line}.scoring-guide{font-size:.78rem;color:#64748b;margin-top:.4rem}.max-score-badge{display:inline-flex;min-width:48px;justify-content:center;background:#eef4ff;color:#0b4da2;border-radius:8px;padding:.4rem .55rem;font-weight:800}.self-score-input{font-weight:700;font-size:1.05rem}.self-note{min-width:210px}.evidence-list{max-height:130px;overflow:auto}.evidence-item{padding:.35rem .45rem;background:#f8fafc;border:1px solid #e5eaf0;border-radius:8px;margin-bottom:.35rem}.evidence-item a{display:block;font-size:.82rem;font-weight:600;text-decoration:none;overflow-wrap:anywhere}.evidence-item small{display:block;color:#64748b;margin-top:.15rem;white-space:pre-wrap}.total-row td{background:#f0f5fc!important;border-top:2px solid #0b3d91!important;font-size:1.05rem}.modal-content{border-radius:16px}
@media(max-width:767.98px){.quarter-picker{min-width:100%;width:100%}.evaluation-header .score-box{width:100%}.sticky-actions{position:static}.kpi-table{font-size:.88rem}}

/* Mẫu 1A - bố cục gần với biểu mẫu giấy đính kèm */
.mau1a-paper{background:#fff}.mau1a-table{font-size:.93rem}.mau1a-table th,.mau1a-table td{border-color:#303030!important;vertical-align:middle}.mau1a-table thead th{background:#fff;text-align:center;font-weight:800}.mau1a-table .stt{width:55px}.mau1a-table .max{width:100px}.mau1a-table .score{width:120px}.mau1a-table .evidence{width:210px}.mau1a-table .note{width:220px}.mau1a-table .section-row td{background:#f5f7fb;font-weight:700}.mau1a-table .total-row td{background:#fafafa;font-weight:700}.criterion-detail{white-space:pre-line;font-size:.9rem;margin-top:.3rem}.classification-table th,.classification-table td{border-color:#303030!important}.classification-table th{text-align:center;vertical-align:middle}.round-card{border-top:4px solid var(--bs-primary)!important}
@media print{.app-navbar,.mau1a-toolbar,.btn,.alert,.modal{display:none!important}.container{max-width:none!important;width:100%!important;padding:0!important}.mau1a-paper{box-shadow:none!important}.mau1a-table{font-size:10pt}.form-control{border:0!important;padding:0!important}.mau1a-table textarea{resize:none}}

/* Thông báo và đơn xin mở lại KPI */
.notification-bell{position:relative;color:#fff;display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;text-decoration:none;background:rgba(255,255,255,.12)}
.notification-bell:hover{color:#fff;background:rgba(255,255,255,.22)}
.notification-count{position:absolute;top:-4px;right:-5px;min-width:19px;height:19px;padding:0 5px;border-radius:10px;background:#dc3545;color:#fff;font-size:11px;font-weight:700;line-height:19px;text-align:center;border:2px solid #0d4777}
.notification-unread{background:#eef6ff}
.notification-bell-large{font-size:2rem}

/* =========================================================
   Giao diện riêng cho tài khoản HIỆU TRƯỞNG
   Menu điều hướng dọc bên trái - các vai trò khác giữ nguyên.
   ========================================================= */
.principal-shell{--principal-sidebar-width:286px;--principal-topbar-height:78px;background:#f3f6fb}
.principal-topbar{position:fixed;z-index:1045;top:0;left:0;right:0;height:var(--principal-topbar-height);display:flex;align-items:center;justify-content:space-between;padding:0 24px;background:linear-gradient(108deg,#082d68 0%,#0b4898 55%,#0968c9 100%);color:#fff}
.principal-topbar-brand{display:flex;align-items:center;gap:13px;min-width:0}.principal-topbar-logo{width:48px;height:48px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 48px;border-radius:15px;background:linear-gradient(145deg,rgba(255,255,255,.22),rgba(255,255,255,.08));border:1px solid rgba(255,255,255,.32);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 8px 22px rgba(0,0,0,.12);font-size:1rem;font-weight:900;letter-spacing:.7px}.principal-topbar-title{font-size:.92rem;font-weight:800;letter-spacing:.15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.principal-topbar-subtitle{margin-top:4px;font-size:.73rem;font-weight:500;letter-spacing:.2px;opacity:.8}.principal-topbar-user{display:flex;align-items:center;gap:10px;flex:0 0 auto}.principal-user-info{line-height:1.18;margin-right:5px}.principal-user-info strong,.principal-user-info small{display:block}.principal-user-info strong{font-size:.88rem}.principal-user-info small{font-size:.71rem;opacity:.72;margin-top:4px}.principal-top-action{border-radius:9px;font-weight:650;white-space:nowrap}.principal-sidebar-toggle{border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.12);width:42px;height:38px;border-radius:9px;padding:8px 9px}.principal-sidebar-toggle span{display:block;height:2px;background:#fff;margin:4px 0;border-radius:2px}
.principal-sidebar{position:fixed!important;z-index:1035;left:0;top:var(--principal-topbar-height);bottom:0;width:var(--principal-sidebar-width)!important;background:#fff;border-right:1px solid #e1e8f1;box-shadow:8px 0 28px rgba(20,48,83,.055);overflow-y:auto;overflow-x:hidden}.principal-sidebar-inner{min-height:100%;padding:20px 15px 18px;display:flex;flex-direction:column}.principal-profile-card{position:relative;display:flex;align-items:center;gap:12px;padding:14px;margin:0 1px 20px;border-radius:16px;background:linear-gradient(135deg,#edf5ff,#f8fbff);border:1px solid #dceaf9;overflow:hidden}.principal-profile-card:after{content:"";position:absolute;width:90px;height:90px;border-radius:50%;background:rgba(18,97,201,.06);right:-35px;top:-38px}.principal-avatar{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;flex:0 0 44px;width:44px;height:44px;border-radius:13px;background:linear-gradient(145deg,#0b3d91,#1672d9);color:#fff;font-weight:900;box-shadow:0 8px 18px rgba(11,61,145,.19)}.principal-profile-text{position:relative;z-index:1;min-width:0}.principal-profile-text strong,.principal-profile-text span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.principal-profile-text strong{font-size:.88rem;color:#102a4b}.principal-profile-text span{font-size:.7rem;color:#70839a;margin-top:4px}.principal-menu-caption{padding:0 11px;margin:10px 0 7px;color:#93a2b5;font-size:.64rem;font-weight:850;letter-spacing:1.35px}.principal-menu{display:flex;flex-direction:column;gap:4px}.principal-menu-item{position:relative;display:flex;align-items:center;gap:12px;min-height:55px;padding:9px 11px;border-radius:13px;color:#40536a;text-decoration:none;transition:all .18s ease}.principal-menu-item:hover{color:#0b4da2;background:#f0f6fd;transform:translateX(2px)}.principal-menu-item.active{background:linear-gradient(105deg,#0b428f,#1264c8);color:#fff;box-shadow:0 8px 20px rgba(11,77,162,.2)}.principal-menu-item.active:before{content:"";position:absolute;left:-15px;top:13px;bottom:13px;width:4px;border-radius:0 4px 4px 0;background:#2b89ea}.principal-menu-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 36px;width:36px;height:36px;border-radius:11px;background:#edf3fa;color:#3f6f9e;transition:all .18s ease}.principal-menu-item:hover .principal-menu-icon{background:#e1effd;color:#0d62bd}.principal-menu-item.active .principal-menu-icon{background:rgba(255,255,255,.15);color:#fff}.principal-menu-icon svg{width:19px;height:19px;fill:currentColor}.principal-menu-item>span:nth-child(2),.principal-menu-label{min-width:0;flex:1}.principal-menu-item strong,.principal-menu-item small{display:block}.principal-menu-item strong{font-size:.83rem;font-weight:760;line-height:1.15}.principal-menu-item small{margin-top:4px;font-size:.68rem;line-height:1.1;color:#8a9bad}.principal-menu-item.active small{color:rgba(255,255,255,.72)}.principal-new-badge{flex:0 0 auto;padding:3px 7px;border-radius:8px;background:#e93b4f;color:#fff;font-size:.62rem;font-weight:850;box-shadow:0 4px 10px rgba(233,59,79,.22)}.principal-sidebar-footer{display:flex;align-items:center;gap:10px;margin:auto 1px 0;padding:13px;border-radius:14px;background:#f7fafc;border:1px solid #e7edf4;color:#55677b}.principal-sidebar-footer-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;flex:0 0 32px;border-radius:50%;background:#e7f8ef;color:#159451;font-weight:900}.principal-sidebar-footer strong,.principal-sidebar-footer small{display:block}.principal-sidebar-footer strong{font-size:.72rem}.principal-sidebar-footer small{font-size:.63rem;color:#95a2b0;margin-top:3px}.principal-content{margin-left:var(--principal-sidebar-width);padding:calc(var(--principal-topbar-height) + 28px) 30px 34px;min-height:100vh;max-width:none;width:auto}.principal-content>.alert{border:0;border-radius:13px}
@media(min-width:992px){.principal-sidebar.offcanvas-lg{visibility:visible!important;transform:none!important}.principal-sidebar .offcanvas-header{display:none!important}}
@media(max-width:1199.98px){.principal-shell{--principal-sidebar-width:264px}.principal-topbar-title{font-size:.83rem}.principal-content{padding-left:24px;padding-right:24px}.principal-menu-item strong{font-size:.8rem}.principal-menu-item small{font-size:.65rem}}
@media(max-width:991.98px){.principal-topbar{height:70px;padding:0 14px}.principal-shell{--principal-topbar-height:70px}.principal-topbar-title{max-width:56vw;font-size:.75rem}.principal-topbar-subtitle{display:none}.principal-topbar-logo{width:42px;height:42px;flex-basis:42px;border-radius:12px}.principal-sidebar{top:0!important;width:286px!important}.principal-content{margin-left:0;padding:calc(var(--principal-topbar-height) + 20px) 16px 26px}.principal-top-action{display:none}.principal-sidebar-inner{padding-top:12px}}
@media(max-width:575.98px){.principal-topbar-title{max-width:57vw;font-size:.68rem;line-height:1.2}.principal-topbar-logo{width:38px;height:38px;flex-basis:38px;font-size:.8rem}.principal-topbar-brand{gap:9px}.principal-content{padding-left:11px;padding-right:11px}.principal-content .card{border-radius:.8rem}}
@media print{.principal-topbar,.principal-sidebar{display:none!important}.principal-content{margin:0!important;padding:0!important}}