*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--radius:1rem;--background:oklch(98.5% .006 168);--foreground:oklch(25% .03 172);--sidebar-bg:oklch(23% .055 166);--sidebar-foreground:oklch(96% .015 165);--primary:oklch(42% .09 177);--font-sans:"IBM Plex Sans Arabic", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-display:"Alexandria", "IBM Plex Sans Arabic", system-ui, sans-serif}html{scroll-behavior:smooth;direction:rtl}body{font-family:var(--font-sans);color:var(--foreground);background-color:var(--background);-webkit-font-smoothing:antialiased;min-height:100vh;line-height:1.6}.font-display{font-family:var(--font-display)}.app-surface{background:radial-gradient(circle at 12% 8%,oklch(94% .05 165/.72),#0000 30%),radial-gradient(circle at 90% 4%,oklch(94% .04 90/.55),#0000 28%),oklch(98.5% .006 168);min-height:100vh}.soft-card{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#ffffffeb;border:1px solid #ffffffd9;border-radius:1.25rem;box-shadow:0 16px 40px -20px #0a4a4540}.login-page{justify-content:center;align-items:center;width:100%;min-height:100vh;padding:1.5rem;display:flex}.login-card{text-align:center;width:100%;max-width:480px;margin:0 auto;padding:2.25rem 2rem}.supervisor-select-card{cursor:pointer;text-align:right;background:#fff;border:1.5px solid oklch(88% .02 170);border-radius:1.25rem;align-items:center;gap:1rem;width:100%;padding:1rem 1.25rem;transition:all .2s;display:flex;box-shadow:0 2px 8px #00000008}.supervisor-select-card:hover{background:oklch(98.5% .01 170);border-color:oklch(50% .12 177);transform:translateY(-2px);box-shadow:0 8px 20px #0a4a451f}.app-layout{width:100%;min-height:100vh;display:flex;position:relative}.sidebar{background:var(--sidebar-bg);width:260px;color:var(--sidebar-foreground);z-index:50;flex-direction:column;transition:transform .3s;display:flex;position:fixed;top:0;bottom:0;right:0}.sidebar-header{padding:1.25rem 1rem 1rem}.sidebar-brand{align-items:center;gap:.75rem;display:flex}.sidebar-logo-box{background:#fff;border-radius:.75rem;flex-shrink:0;place-items:center;padding:6px 8px;display:grid}.sidebar-brand-text h2{font-family:var(--font-display);color:#fff;font-size:.9rem;font-weight:700;line-height:1.3}.sidebar-brand-text p{color:oklch(79% .09 166);margin-top:.15rem;font-size:.65rem}.sidebar-nav-label{letter-spacing:.05em;color:#ffffff73;text-transform:uppercase;padding:.75rem 1rem .5rem;font-size:.625rem;font-weight:700}.sidebar-nav{flex-direction:column;flex:1;gap:.35rem;padding:0 .5rem;display:flex}.nav-item{color:#ffffffbf;cursor:pointer;text-align:right;width:100%;height:2.75rem;font-size:.875rem;font-weight:600;font-family:var(--font-sans);background:0 0;border:none;border-radius:.75rem;align-items:center;gap:.625rem;padding:0 .85rem;transition:all .15s;display:flex}.nav-item:hover{color:#fff;background:#ffffff1f}.nav-item.active{color:oklch(25% .03 172);background:oklch(93% .04 164);font-weight:700;box-shadow:0 4px 12px #0a4a4533}.nav-badge{color:#fff;background:oklch(58% .2 25);border-radius:9999px;margin-right:auto;padding:.15rem .5rem;font-size:.6875rem;font-weight:700}.sidebar-footer{border-top:1px solid #ffffff1a;padding:.75rem}.sidebar-user{background:#ffffff14;border-radius:.75rem;align-items:center;gap:.75rem;padding:.625rem;display:flex}.sidebar-avatar{color:oklch(25% .03 172);background:oklch(93% .04 164);border-radius:50%;flex-shrink:0;place-items:center;width:36px;height:36px;font-size:.875rem;font-weight:700;display:grid}.sidebar-user-info p:first-child{color:#fff;font-size:.75rem;font-weight:700}.sidebar-user-info p:last-child{color:oklch(79% .09 166);font-size:.625rem}.main-area{flex:1;width:calc(100% - 260px);min-height:100vh;margin-right:260px}.top-bar{z-index:30;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#ffffffd9;border-bottom:1px solid #064e3b14;justify-content:space-between;align-items:center;height:4rem;padding:0 1.5rem;display:flex;position:sticky;top:0}.content{max-width:80rem;margin:0 auto;padding:1.5rem 1.5rem 3rem}.stats-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem;display:grid}.stat-card{border-radius:1.25rem;padding:1.25rem}.stat-card-label{color:#064e3ba6;font-size:.75rem;font-weight:700}.stat-card-value{font-family:var(--font-display);color:oklch(25% .03 172);margin-top:.35rem;font-size:1.75rem;font-weight:800}.badge{white-space:nowrap;border-radius:9999px;align-items:center;gap:.35rem;padding:.3rem .85rem;font-size:.75rem;font-weight:700;display:inline-flex}.badge-green{color:oklch(35% .1 155);background:oklch(93% .05 155)}.badge-red{color:oklch(45% .17 25);background:oklch(93% .04 25)}.badge-amber{color:oklch(40% .12 70);background:oklch(93% .06 85)}.badge-teal{color:oklch(35% .1 177);background:oklch(93% .04 177)}.btn{height:2.5rem;font-size:.875rem;font-weight:700;font-family:var(--font-sans);cursor:pointer;border:none;border-radius:.75rem;justify-content:center;align-items:center;gap:.5rem;padding:0 1.25rem;transition:all .2s;display:inline-flex}.btn-primary{color:#fff;background:oklch(42% .09 177)}.btn-primary:hover{background:oklch(36% .085 177)}.btn-secondary{color:oklch(28% .055 164);background:oklch(95% .025 157);border:1px solid oklch(89% .02 164)}.btn-outline{color:oklch(25% .03 172);background:0 0;border:1.5px solid oklch(89% .02 164)}.option-btn{color:oklch(25% .03 172);cursor:pointer;background:#fff;border:1.5px solid oklch(88% .02 170);border-radius:.875rem;justify-content:center;align-items:center;padding:.75rem 1rem;font-size:.875rem;font-weight:700;transition:all .15s;display:flex}.option-btn.active{color:#fff;background:oklch(42% .09 177);border-color:oklch(42% .09 177);box-shadow:0 4px 12px #0f766e40}.form-control{width:100%;height:2.75rem;font-size:.875rem;font-family:var(--font-sans);color:oklch(25% .03 172);background:#fff;border:1.5px solid oklch(88% .02 170);border-radius:.75rem;padding:0 .85rem}.field-label{color:oklch(35% .05 172);margin-bottom:.4rem;font-size:.75rem;font-weight:700;display:block}.table-wrapper{overflow-x:auto}table{text-align:right;border-collapse:collapse;width:100%}thead{background:oklch(97% .01 165)}th{color:#064e3b99;white-space:nowrap;padding:1rem 1.25rem;font-size:.75rem;font-weight:700}td{border-top:1px solid oklch(94% .01 165);padding:1rem 1.25rem;font-size:.875rem}tbody tr:hover{background:oklch(98% .005 165)}.td-name{color:oklch(25% .03 172);font-weight:700}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:100;background:#0000008c;justify-content:center;align-items:center;padding:1rem;display:flex;position:fixed;inset:0}.modal{width:100%;max-width:540px;max-height:90vh;padding:2rem;overflow-y:auto}@media (width<=1024px){.sidebar{transform:translate(100%)}.sidebar.open{transform:translate(0)}.main-area{width:100%;margin-right:0}}