.sidebar[data-v-87b01ea6]{width:var(--sidebar-width);background:var(--primary);color:#fff;display:flex;flex-direction:column;height:100vh;position:fixed;top:0;left:0;z-index:200;transition:transform .3s ease;overflow-y:auto;scrollbar-width:thin;scrollbar-color:hsla(0,0%,100%,.15) transparent}.sidebar[data-v-87b01ea6]::-webkit-scrollbar{width:4px}.sidebar[data-v-87b01ea6]::-webkit-scrollbar-thumb{background:hsla(0,0%,100%,.15);border-radius:2px}@media (max-width:991px){.sidebar[data-v-87b01ea6]{transform:translateX(-100%)}.sidebar--open[data-v-87b01ea6]{transform:translateX(0);box-shadow:4px 0 24px rgba(0,0,0,.25)}}.sidebar__brand[data-v-87b01ea6]{display:flex;align-items:center;gap:10px;padding:18px 20px;border-bottom:1px solid hsla(0,0%,100%,.1)}.sidebar__logo img[data-v-87b01ea6]{width:36px;height:36px;border-radius:8px;-o-object-fit:cover;object-fit:cover;background:hsla(0,0%,100%,.15)}.sidebar__brand-name[data-v-87b01ea6]{font-size:1.15rem;font-weight:800;letter-spacing:.5px;flex:1;color:#fff}.sidebar__close[data-v-87b01ea6]{background:none;border:none;color:hsla(0,0%,100%,.6);cursor:pointer;padding:4px;border-radius:6px;font-size:1rem;display:none;transition:color .2s}.sidebar__close[data-v-87b01ea6]:hover{color:#fff}@media (max-width:991px){.sidebar__close[data-v-87b01ea6]{display:flex}}.sidebar__user[data-v-87b01ea6]{display:flex;align-items:center;gap:10px;padding:14px 20px;background:rgba(0,0,0,.15);border-bottom:1px solid hsla(0,0%,100%,.08)}.sidebar__avatar[data-v-87b01ea6]{width:36px;height:36px;border-radius:50%;background:var(--accent);color:var(--primary);font-weight:800;font-size:.8rem;display:flex;align-items:center;justify-content:center;flex-shrink:0}.sidebar__user-info[data-v-87b01ea6]{display:flex;flex-direction:column}.sidebar__user-name[data-v-87b01ea6]{font-size:.875rem;font-weight:600;color:#fff;line-height:1.2}.sidebar__user-role[data-v-87b01ea6]{font-size:.7rem;color:hsla(0,0%,100%,.55)}.sidebar__nav[data-v-87b01ea6]{flex:1;padding:12px 0}.sidebar__group[data-v-87b01ea6]{margin-bottom:8px}.sidebar__group-label[data-v-87b01ea6]{display:block;padding:8px 20px 4px;font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:hsla(0,0%,100%,.4)}.sidebar__link[data-v-87b01ea6]{display:flex;align-items:center;gap:10px;padding:10px 20px;color:hsla(0,0%,100%,.75);text-decoration:none;font-size:.875rem;font-weight:500;border-radius:0;transition:all .18s;margin:1px 8px;border-radius:8px}.sidebar__link[data-v-87b01ea6]:hover{background:hsla(0,0%,100%,.1);color:#fff;text-decoration:none}.sidebar__link--active[data-v-87b01ea6]{background:var(--accent)!important;color:var(--primary)!important;font-weight:700}.sidebar__link-icon[data-v-87b01ea6]{font-size:1rem;width:20px;text-align:center}.sidebar__link-text[data-v-87b01ea6]{flex:1}.sidebar__badge[data-v-87b01ea6]{background:var(--accent);color:var(--primary);font-size:.65rem;font-weight:700;padding:2px 7px;border-radius:10px}.sidebar__footer[data-v-87b01ea6]{padding:14px 16px;border-top:1px solid hsla(0,0%,100%,.1)}.sidebar__logout[data-v-87b01ea6]{width:100%;display:flex;align-items:center;gap:10px;padding:10px 12px;background:hsla(0,0%,100%,.07);border:1px solid hsla(0,0%,100%,.12);border-radius:8px;color:hsla(0,0%,100%,.75);cursor:pointer;font-size:.875rem;font-weight:500;transition:all .18s}.sidebar__logout[data-v-87b01ea6]:hover{background:rgba(229,62,62,.25);border-color:rgba(229,62,62,.4);color:#fff}.topbar[data-v-2c1739aa]{height:var(--topbar-height);background:var(--card-bg);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 24px;gap:16px;position:sticky;top:0;z-index:100;box-shadow:0 1px 6px rgba(0,0,0,.06)}.topbar__menu-btn[data-v-2c1739aa]{background:none;border:none;font-size:1.4rem;color:var(--primary);cursor:pointer;padding:4px 8px;border-radius:6px;transition:background .2s;display:none}.topbar__menu-btn[data-v-2c1739aa]:hover{background:var(--bg)}@media (max-width:991px){.topbar__menu-btn[data-v-2c1739aa]{display:flex;align-items:center}}.topbar__title[data-v-2c1739aa]{font-size:1.1rem;font-weight:700;color:var(--primary);flex:1;text-transform:capitalize}.topbar__right[data-v-2c1739aa]{display:flex;align-items:center;gap:16px}.topbar__date[data-v-2c1739aa]{font-size:.78rem;color:var(--text-muted);text-transform:capitalize}@media (max-width:575px){.topbar__date[data-v-2c1739aa]{display:none}}.topbar__user-chip[data-v-2c1739aa]{display:flex;align-items:center;gap:8px;background:var(--bg);border:1px solid var(--border);border-radius:24px;padding:4px 12px 4px 4px}.topbar__avatar[data-v-2c1739aa]{width:28px;height:28px;border-radius:50%;background:var(--primary);color:#fff;font-size:.7rem;font-weight:700;display:flex;align-items:center;justify-content:center}.topbar__user-name[data-v-2c1739aa]{font-size:.82rem;font-weight:600;color:var(--text)}@media (max-width:575px){.topbar__user-name[data-v-2c1739aa]{display:none}}*,:after,:before{box-sizing:border-box;margin:0;padding:0}:root{--sidebar-width:260px;--topbar-height:60px;--primary:#1e3a5f;--primary-light:#2d5282;--accent:#f59e0b;--accent-hover:#d97706;--bg:#f0f4f8;--card-bg:#fff;--text:#1a202c;--text-muted:#718096;--border:#e2e8f0;--success:#38a169;--danger:#e53e3e;--info:#3182ce;--radius:10px;--shadow:0 2px 12px rgba(0,0,0,.08)}body{font-family:Segoe UI,system-ui,-apple-system,sans-serif;color:var(--text)}body.wb-layout{background:var(--bg)}#app{display:flex;min-height:100vh}#app>.login-page{flex:1}.main-wrapper{margin-left:var(--sidebar-width);min-height:100vh;transition:margin-left .3s ease}.main-wrapper,.page-content{flex:1;display:flex;flex-direction:column}.page-content{padding:28px 32px;width:100%}.page-header{justify-content:space-between;margin-bottom:24px;flex-wrap:wrap;gap:12px}.page-header,.page-title{display:flex;align-items:center}.page-title{font-size:1.6rem;font-weight:700;color:var(--primary);gap:10px}.page-title .title-icon{width:40px;height:40px;border-radius:10px;background:linear-gradient(135deg,var(--primary),var(--primary-light));display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.1rem}.wb-card{width:100%;background:var(--card-bg);border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid var(--border);overflow:hidden}.wb-card-header{padding:16px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.wb-card-body{padding:0}.search-bar{position:relative;flex:1;min-width:200px;max-width:360px}.search-bar input{width:100%;padding:8px 14px 8px 38px;border:1px solid var(--border);border-radius:8px;font-size:.875rem;background:var(--bg);transition:border-color .2s,box-shadow .2s;outline:none;color:var(--text)}.search-bar input:focus{border-color:var(--primary-light);box-shadow:0 0 0 3px rgba(45,82,130,.12)}.search-bar .search-icon{position:absolute;left:11px;top:50%;transform:translateY(-50%);color:var(--text-muted);font-size:.9rem;pointer-events:none}.btn-wb-primary{background:var(--primary);color:#fff;border:none;padding:8px 18px;border-radius:8px;font-size:.875rem;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:background .2s,transform .1s;white-space:nowrap}.btn-wb-primary:hover{background:var(--primary-light);transform:translateY(-1px)}.btn-wb-danger{background:var(--danger);color:#fff;border:none;padding:6px 10px;border-radius:6px;cursor:pointer;font-size:.8rem;transition:opacity .2s}.btn-wb-danger:hover{opacity:.85}.btn-wb-info{background:var(--info);color:#fff;border:none;padding:6px 10px;border-radius:6px;cursor:pointer;font-size:.8rem;transition:opacity .2s}.btn-wb-info:hover{opacity:.85}.btn-wb-success{background:var(--success);color:#fff;border:none;padding:6px 10px;border-radius:6px;cursor:pointer;font-size:.8rem;transition:opacity .2s}.btn-wb-success:hover{opacity:.85}.wb-table{width:100%;border-collapse:collapse;font-size:.875rem}.wb-table th{background:#f7fafc;color:var(--text-muted);font-weight:600;text-transform:uppercase;font-size:.72rem;letter-spacing:.05em;padding:12px 16px;text-align:left;border-bottom:2px solid var(--border)}.wb-table td{padding:12px 16px;border-bottom:1px solid var(--border);vertical-align:middle;color:var(--text)}.wb-table tr:hover td{background:#f7fafc}.wb-table tr:last-child td{border-bottom:none}.wb-table td img{width:44px;height:44px;-o-object-fit:cover;object-fit:cover;border-radius:8px;cursor:pointer;border:2px solid var(--border);transition:transform .2s}.wb-table td img:hover{transform:scale(1.1)}.badge-wb{display:inline-flex;align-items:center;padding:3px 10px;border-radius:20px;font-size:.72rem;font-weight:600}.badge-wb-blue{background:#ebf4ff;color:var(--info)}.badge-wb-green{background:#f0fff4;color:var(--success)}.badge-wb-amber{background:#fffbeb;color:var(--accent-hover)}.badge-wb-red{background:#fff5f5;color:var(--danger)}.modal-content{border-radius:var(--radius)!important;border:none!important;box-shadow:0 20px 60px rgba(0,0,0,.15)!important}.modal-header{background:var(--primary)!important;color:#fff!important;border-radius:var(--radius) var(--radius) 0 0!important;padding:16px 24px!important}.modal-header .modal-title{font-weight:700!important;font-size:1.1rem!important}.modal-header .close{color:#fff!important;opacity:.8}.modal-footer{border-top:1px solid var(--border)!important;background:#f7fafc!important;padding:12px 24px!important}.modal-body{padding:24px!important}.form-control:focus{border-color:var(--primary-light)!important;box-shadow:0 0 0 3px rgba(45,82,130,.12)!important}.sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:199}@media (max-width:991px){.main-wrapper{margin-left:0!important}.page-content{padding:20px 16px}}@media (max-width:767px){.wb-table td,.wb-table th{padding:10px 10px;font-size:.82rem}.modal-body{padding:16px!important}.modal-footer{padding:10px 16px!important}}@media (max-width:575px){.page-content{padding:14px 10px}.page-header{flex-direction:column;align-items:flex-start;gap:10px}.page-header button{width:100%;justify-content:center}.wb-card-header{flex-direction:column;align-items:flex-start;gap:10px}.search-bar{max-width:100%;width:100%}.wb-table td,.wb-table th{padding:8px 8px;font-size:.78rem}.wb-table td img{width:36px;height:36px}.badge-wb{font-size:.68rem;padding:2px 7px}.btn-wb-danger,.btn-wb-info,.btn-wb-primary,.btn-wb-success{font-size:.8rem;padding:7px 12px}.modal-dialog{margin:.5rem}.modal-content{border-radius:10px!important}.modal-header{padding:12px 16px!important}.modal-body{padding:14px!important}.modal-footer{padding:10px 14px!important;gap:8px;flex-wrap:wrap}.modal-footer button{flex:1;min-width:0;justify-content:center}}