@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');
:root{--primary:#0f766e;--primary-dark:#115e59;--accent:#f59e0b;--ink:#172033;--muted:#718096;--line:#e8edf3;--canvas:#f5f7fb;--sidebar:#102a2a}*{box-sizing:border-box}body{margin:0;background:var(--canvas);color:var(--ink);font-family:'Plus Jakarta Sans',sans-serif;font-size:14px}.topbar{position:fixed;z-index:1020;top:0;right:0;left:270px;height:76px;padding:0 30px;background:rgba(255,255,255,.92);backdrop-filter:blur(16px);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.topbar-title span,.topbar-title small,.user-chip span{display:block}.topbar-title span{font-weight:700}.topbar-title small,.user-chip span{font-size:11px;color:var(--muted);margin-top:3px}.user-chip{display:flex;align-items:center;gap:11px;padding:7px 12px;border:1px solid var(--line);border-radius:14px;background:#fff}.avatar{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,var(--primary),#2dd4bf);color:#fff;font-weight:800}.sidebar{position:fixed;z-index:1030;inset:0 auto 0 0;width:270px!important;height:100vh;max-height:100vh;display:flex;flex-direction:column;overflow:hidden;background:linear-gradient(180deg,#123535,#0c2424);color:#fff}.brand{flex:0 0 auto;height:76px;display:flex;align-items:center;gap:12px;padding:0 22px;border-bottom:1px solid rgba(255,255,255,.08)}.brand-icon{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent),#fbbf24);color:#fff;font-size:19px}.brand strong,.brand span{display:block}.brand strong{font-size:20px;letter-spacing:1px}.brand span{font-size:10px;opacity:.65;text-transform:uppercase;letter-spacing:1.4px}.sidebar-body{flex:1 1 auto;min-height:0;padding:15px 14px 30px!important;overflow-y:auto;overflow-x:hidden;height:auto;max-height:none;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.42) transparent}.sidebar-body::-webkit-scrollbar{width:7px}.sidebar-body::-webkit-scrollbar-track{background:transparent}.sidebar-body::-webkit-scrollbar-thumb{background:rgba(255,255,255,.32);border-radius:999px}.sidebar a{display:flex;align-items:center;gap:12px;padding:10px 12px;margin:3px 0;border-radius:10px;color:rgba(255,255,255,.72);text-decoration:none;font-size:13px;font-weight:500;transition:.2s}.sidebar a i{font-size:16px}.sidebar a:hover{background:rgba(255,255,255,.09);color:#fff;transform:translateX(2px)}.menu-label{display:block;margin:19px 12px 7px;color:rgba(255,255,255,.35);font-size:9px;font-weight:800;letter-spacing:1.5px;text-transform:uppercase}.logout-link{color:#fda4af!important}.content{margin-left:270px;padding:106px 30px 40px;min-height:100vh}.page-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:24px}.page-head h2{font-size:25px;font-weight:800;margin:3px 0 4px}.page-head p{margin:0;color:var(--muted)}.eyebrow{font-size:10px;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;color:var(--primary)}.page-actions{display:flex;gap:9px}.btn{border-radius:10px;font-weight:600;font-size:13px;padding:.65rem .9rem}.btn-primary{background:var(--primary);border-color:var(--primary)}.btn-primary:hover{background:var(--primary-dark);border-color:var(--primary-dark)}.btn-soft{background:#e6fffb;color:var(--primary);border:1px solid #ccfbf1}.filter-card,.form-card,.data-card,.modern-card{background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 8px 30px rgba(20,37,63,.04)}.filter-card{padding:14px;display:flex;flex-wrap:wrap;gap:9px;margin-bottom:16px}.filter-card input,.filter-card select,.filter-search{height:40px;border:1px solid var(--line);border-radius:9px;background:#fff;padding:0 10px;color:var(--ink);font-size:12px}.filter-search{display:flex;align-items:center;gap:8px;min-width:220px;flex:1}.filter-search input{border:0;outline:0;width:100%;padding:0}.data-card{overflow:hidden}.data-table{margin:0}.data-table thead th{background:#f8fafc;color:#64748b;border-bottom:1px solid var(--line);padding:13px 15px;font-size:10px;text-transform:uppercase;letter-spacing:.7px;white-space:nowrap}.data-table tbody td{padding:13px 15px;border-color:#f0f3f7;white-space:nowrap;font-size:12px}.data-table tbody tr:hover{background:#fbfefd}.row-number{color:#94a3b8;font-weight:700}.status{display:inline-flex;padding:4px 8px;border-radius:20px;font-size:10px;font-weight:700;text-transform:capitalize}.status-success{background:#dcfce7;color:#15803d}.status-danger{background:#ffe4e6;color:#be123c}.action-cell{display:flex;gap:5px}.icon-btn{width:31px;height:31px;display:inline-grid;place-items:center;border-radius:8px;border:1px solid #dbe3eb;background:#fff;color:var(--primary);text-decoration:none}.icon-btn.danger{color:#e11d48}.pager-wrap{padding:15px 18px;border-top:1px solid var(--line)}.pagination{margin:0;gap:5px}.page-link{border-radius:8px!important;border-color:var(--line);color:var(--primary);font-size:12px}.active>.page-link{background:var(--primary);border-color:var(--primary)}.form-card{padding:24px}.form-label{font-size:11px;font-weight:700;color:#526174;margin-bottom:7px}.form-control,.form-select{border-color:#dfe6ee;border-radius:10px;padding:.72rem .85rem;font-size:13px}.form-control:focus,.form-select:focus{border-color:#5eead4;box-shadow:0 0 0 .2rem rgba(15,118,110,.1)}.form-actions{display:flex;justify-content:flex-end;gap:9px;border-top:1px solid var(--line);padding-top:20px;margin-top:24px}.back-link{color:var(--primary);font-weight:600;text-decoration:none;font-size:12px}.empty-state{padding:60px;display:flex;align-items:center;flex-direction:column;color:var(--muted);gap:7px}.empty-state i{font-size:32px}.floating-alert{border:0;border-radius:12px}.stat-card{position:relative;overflow:hidden;height:100%;padding:21px;border-radius:16px;background:#fff;border:1px solid var(--line);box-shadow:0 8px 30px rgba(20,37,63,.04)}.stat-card span{display:block;color:var(--muted);font-size:11px;font-weight:600}.stat-card strong{display:block;font-size:27px;margin-top:7px}.stat-card:after{content:'';position:absolute;width:80px;height:80px;border-radius:50%;right:-30px;top:-30px;background:#ccfbf1}.announcement{padding:15px 0;border-bottom:1px solid var(--line)}.announcement:last-child{border:0}.announcement span{font-size:11px;color:var(--muted)}.announcement h6{margin:5px 0;font-weight:700}.login-page{min-height:100vh;display:grid;place-items:center;padding:1rem;background:radial-gradient(circle at top,#5eead4,#0f766e 55%,#102a2a)}.login-card{width:min(440px,100%);border-radius:20px}.brand-mark{width:72px;height:72px;display:grid;place-items:center;margin:0 auto 1rem;border-radius:22px;font-size:2rem;color:#fff;background:linear-gradient(135deg,#f59e0b,#fbbf24)}@media(max-width:991.98px){.topbar{left:0;height:66px;padding:0 15px}.topbar-title small,.user-chip div:not(.avatar){display:none}.menu-toggle{border:0;background:#ecfdf5;color:var(--primary);width:38px;height:38px;border-radius:10px}.sidebar{position:fixed!important;height:100dvh;max-height:100dvh}.content{margin-left:0;padding:88px 14px 30px}.page-head{align-items:flex-start;flex-direction:column}.filter-card>*{flex:1;min-width:140px}.filter-search{min-width:100%}.data-card{border-radius:12px}}
