:root{
  --stellar:#F1FF5C;
  --stellar-deep:#DCEB32;
  --obsidian:#22272D;
  --obsidian-2:#171B1F;
  --obsidian-3:#2D333A;
  --quartz:#AAB0B8;
  --lunar:#F4FAFF;
  --white:#FFFFFF;
  --surface:#F7FAFC;
  --border:#E4E9EE;
  --muted:#68717C;
  --danger:#D64A4A;
  --success:#3BAA73;
  --warning:#E7A62A;
  --shadow:0 16px 40px rgba(34,39,45,.08);
  --shadow-sm:0 8px 24px rgba(34,39,45,.06);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--obsidian);background:var(--surface);-webkit-font-smoothing:antialiased}
a{transition:color .18s ease,background-color .18s ease,border-color .18s ease,transform .18s ease,box-shadow .18s ease}
.app-shell{min-height:100vh;background:linear-gradient(180deg,var(--lunar) 0,#fff 46%,var(--surface) 100%)}

/* Sidebar */
.sidebar{position:fixed;inset:0 auto 0 0;width:284px;background:linear-gradient(180deg,var(--obsidian) 0,var(--obsidian-2) 100%);color:#fff;overflow:hidden;z-index:1040;transition:transform .25s ease;box-shadow:14px 0 40px rgba(15,18,21,.12);display:flex;flex-direction:column}
.sidebar::before{content:"";position:absolute;top:-110px;right:-160px;width:360px;height:360px;border-radius:50%;background:radial-gradient(circle,rgba(241,255,92,.11),transparent 68%);pointer-events:none}
.sidebar-brand-wrap{position:relative;padding:24px 22px 20px;border-bottom:1px solid rgba(244,250,255,.08)}
.brand{display:flex;align-items:center;color:#fff;text-decoration:none;font-weight:800}
.brand-wordmark{display:block;width:208px;height:auto;max-width:100%}
.brand-subtitle{display:block;margin:7px 0 0 2px;color:var(--quartz);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase}
.sidebar-nav{position:relative;padding:10px 14px 24px;flex:1 1 auto;min-height:0;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#49515A transparent}
.menu-label{font-size:.64rem;color:#77808A;letter-spacing:.17em;padding:22px 12px 8px;font-weight:800}
.sidebar a,.sidebar summary{display:flex;align-items:center;gap:12px;color:#E9EEF2;text-decoration:none;padding:11px 12px;border-radius:11px;font-size:.88rem;cursor:pointer;position:relative;list-style:none}
.sidebar a>i:first-child,.sidebar summary>i:first-child{width:20px;text-align:center;color:#939BA5;font-size:.94rem}
.sidebar a:hover,.sidebar summary:hover{background:rgba(244,250,255,.07);color:#fff;transform:translateX(2px)}
.sidebar a:hover>i:first-child,.sidebar summary:hover>i:first-child{color:var(--stellar)}
.sidebar a.active,.sidebar summary.active{background:var(--stellar);color:var(--obsidian);font-weight:750;box-shadow:0 8px 22px rgba(241,255,92,.16)}
.sidebar a.active>i:first-child,.sidebar summary.active>i:first-child{color:var(--obsidian)}
.sidebar details{margin:2px 0}
.sidebar details>a{padding-left:44px;color:#BEC5CC;font-size:.82rem}
.sidebar details>a::before{content:"";width:4px;height:4px;border-radius:50%;background:#68717A;position:absolute;left:28px}
.sidebar details>a.active::before{background:var(--obsidian)}
.sidebar details[open]>.active:not(summary),.sidebar details>a.active{color:var(--obsidian)}
.sidebar summary::-webkit-details-marker{display:none}
.nav-chevron{margin-left:auto;width:auto!important;font-size:.67rem!important;color:#747D87!important;transition:transform .2s ease}
.sidebar details[open] .nav-chevron{transform:rotate(180deg)}
.sidebar-footer{position:relative;left:auto;right:auto;bottom:auto;display:flex;gap:11px;align-items:center;border:1px solid rgba(244,250,255,.08);background:rgba(244,250,255,.04);padding:12px;border-radius:13px;margin:10px 14px 16px;flex:0 0 auto;box-shadow:0 -12px 28px rgba(23,27,31,.24)}
.sidebar-footer img{width:34px;height:32px;object-fit:contain}
.sidebar-footer strong,.sidebar-footer span{display:block}
.sidebar-footer strong{font-size:.76rem;letter-spacing:.05em}
.sidebar-footer span{font-size:.66rem;color:#8D959E;margin-top:2px}
.sidebar-backdrop{display:none}

/* Main and topbar */
.main{margin-left:284px;min-height:100vh}
.topbar{height:78px;background:rgba(255,255,255,.88);backdrop-filter:blur(16px);border-bottom:1px solid rgba(170,176,184,.28);display:flex;align-items:center;justify-content:space-between;padding:0 26px;position:sticky;top:0;z-index:1020}
.topbar-left,.topbar-actions,.topbar-date,.user-chip{display:flex;align-items:center}
.topbar-left{gap:15px}.topbar-actions{gap:10px}.topbar-date{gap:8px;color:var(--muted);font-size:.78rem;padding-right:8px}.topbar-date i{color:var(--obsidian)}
.sidebar-toggle,.icon-button{border:1px solid var(--border);background:#fff;color:var(--obsidian);width:42px;height:42px;border-radius:12px;display:grid;place-items:center;box-shadow:0 3px 10px rgba(34,39,45,.03)}
.sidebar-toggle:hover,.icon-button:hover{background:var(--stellar);border-color:var(--stellar);transform:translateY(-1px)}
.topbar-title span,.topbar-title strong{display:block}.topbar-title span{font-size:.64rem;letter-spacing:.14em;color:var(--quartz);font-weight:800}.topbar-title strong{font-size:.96rem;margin-top:1px}
.notification-badge{position:absolute;top:-5px;right:-5px;display:grid;place-items:center;min-width:19px;height:19px;padding:0 4px;border-radius:10px;background:var(--danger);color:#fff;border:2px solid #fff;font-size:.6rem;font-weight:800}
.user-chip{gap:9px;padding:4px 10px 4px 4px;border:1px solid var(--border);border-radius:13px;background:#fff}
.user-avatar{width:34px;height:34px;border-radius:10px;background:var(--obsidian);color:var(--stellar);display:grid;place-items:center;font-size:.72rem;font-weight:850;letter-spacing:.03em}
.user-chip strong,.user-chip span{display:block}.user-chip strong{font-size:.76rem;line-height:1.2}.user-chip div span{font-size:.63rem;color:var(--quartz);margin-top:2px}
.content{padding:28px}
.app-alert{border-radius:13px;border-width:0;box-shadow:var(--shadow-sm)}

/* Common application components */
.page-header{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px}.page-header h2{font-weight:800;margin:0;font-size:1.58rem}.page-header p{color:var(--muted);margin:5px 0 0;font-size:.89rem}
.btn{border-radius:10px;font-weight:650}.btn-accent{background:var(--stellar);border-color:var(--stellar);color:var(--obsidian);font-weight:800}.btn-accent:hover,.btn-accent:focus{background:var(--stellar-deep);border-color:var(--stellar-deep);color:var(--obsidian);box-shadow:0 8px 20px rgba(220,235,50,.25)}
.btn-dark{background:var(--obsidian);border-color:var(--obsidian)}.btn-outline-dark{border-color:#CAD0D6;color:var(--obsidian)}.btn-outline-dark:hover{background:var(--obsidian);border-color:var(--obsidian)}
.content-card{border:1px solid rgba(170,176,184,.28);box-shadow:var(--shadow-sm);border-radius:18px;overflow:hidden;background:#fff}.content-card .card-header{background:#fff;font-weight:700;padding:18px 20px;border-bottom:1px solid var(--border)}.content-card .card-body{padding:20px}.content-card .card-footer{background:#fff;border-top:1px solid var(--border);padding:15px 20px}
.stat-card{background:#fff;border:1px solid var(--border);border-radius:16px;padding:19px;display:flex;align-items:center;justify-content:space-between;box-shadow:var(--shadow-sm)}.stat-card span{display:block;color:var(--muted);font-size:.82rem}.stat-card strong{display:block;font-size:1.9rem;margin-top:4px}.stat-card i{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:rgba(241,255,92,.55);color:var(--obsidian);font-size:1.2rem}
.filter-bar{display:flex;gap:10px;background:#fff;border:1px solid var(--border);border-radius:15px;padding:13px;margin-bottom:16px;box-shadow:0 6px 18px rgba(34,39,45,.03)}.filter-bar .form-control,.filter-bar .form-select{max-width:330px}
.table{margin-bottom:0}.table thead th{background:var(--lunar);color:#5E6670;font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;white-space:nowrap;border-bottom-color:var(--border)}.table td{font-size:.86rem;vertical-align:middle;border-color:#EDF0F3}.table-hover>tbody>tr:hover>*{--bs-table-bg-state:rgba(241,255,92,.11)}
.form-control,.form-select{border-color:#D8DEE4;min-height:43px;border-radius:10px}.form-control:focus,.form-select:focus{border-color:var(--stellar-deep);box-shadow:0 0 0 .22rem rgba(241,255,92,.28)}.form-label{font-size:.82rem;font-weight:700;color:#3B424A}
.device-card{border:1px solid var(--border);border-radius:16px;overflow:hidden}.device-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:8px;font-size:.83rem}.device-grid span{color:var(--muted)}
.status-dot{width:11px;height:11px;border-radius:50%;display:inline-block;flex:0 0 auto}.status-dot.online{background:var(--success);box-shadow:0 0 0 5px rgba(59,170,115,.12)}.status-dot.offline{background:var(--danger);box-shadow:0 0 0 5px rgba(214,74,74,.1)}
.permission-item{display:flex;gap:7px;align-items:center;padding:8px;border:1px solid var(--border);border-radius:9px;font-size:.79rem}.empty-state{text-align:center;padding:78px 20px}.empty-state i{font-size:3.8rem;color:#CDD3D9;margin-bottom:20px}code{font-size:.76rem;word-break:break-all}

/* Dashboard hero */
.dashboard-hero{position:relative;min-height:250px;border-radius:24px;overflow:hidden;background:linear-gradient(118deg,var(--obsidian) 0,#2D343B 72%,#343B43 100%);padding:38px 42px;color:#fff;display:flex;align-items:center;justify-content:space-between;box-shadow:0 24px 54px rgba(34,39,45,.19)}
.dashboard-hero::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 74% 15%,rgba(241,255,92,.16),transparent 29%),linear-gradient(90deg,transparent 0,rgba(255,255,255,.015) 52%,transparent 100%)}
.dashboard-hero-copy,.dashboard-hero-actions{position:relative;z-index:2}.dashboard-hero-copy{max-width:680px}.hero-kicker{display:flex;align-items:center;gap:9px;color:var(--stellar);font-size:.69rem;font-weight:850;letter-spacing:.16em;text-transform:uppercase}.hero-kicker span{width:26px;height:3px;border-radius:3px;background:var(--stellar)}
.dashboard-hero h1{font-size:clamp(2rem,3vw,3.3rem);font-weight:830;letter-spacing:-.045em;margin:17px 0 11px}.dashboard-hero p{color:#C7CDD3;max-width:650px;font-size:1rem;margin:0;line-height:1.65}
.hero-meta{display:flex;align-items:center;flex-wrap:wrap;gap:18px;margin-top:24px;color:#B5BDC5;font-size:.73rem}.hero-meta span{display:flex;align-items:center;gap:7px}.hero-meta i{color:var(--stellar)}.hero-live{color:#D8E0E5!important}.hero-live i{font-size:.48rem;animation:pulse 1.7s infinite}
.dashboard-hero-actions{display:flex;flex-direction:column;gap:10px;width:220px;margin-right:40px}.hero-action{display:flex;align-items:center;gap:10px;border:1px solid rgba(244,250,255,.14);background:rgba(244,250,255,.07);color:#fff;text-decoration:none;padding:12px 14px;border-radius:13px;backdrop-filter:blur(8px);font-size:.78rem;font-weight:700}.hero-action:hover{background:rgba(244,250,255,.12);color:#fff;transform:translateX(-3px)}.hero-action.primary{background:var(--stellar);border-color:var(--stellar);color:var(--obsidian)}.hero-action.primary:hover{background:var(--stellar-deep);color:var(--obsidian)}.hero-action i{width:28px;height:28px;border-radius:8px;background:rgba(255,255,255,.09);display:grid;place-items:center}.hero-action.primary i{background:rgba(34,39,45,.1)}
.dashboard-hero-mark{position:absolute;right:-72px;bottom:-118px;width:420px;opacity:.055;transform:rotate(-3deg);pointer-events:none}
@keyframes pulse{0%,100%{opacity:.45;transform:scale(.9)}50%{opacity:1;transform:scale(1.2)}}

/* Dashboard metrics */
.dashboard-metrics{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}.metric-card{position:relative;min-width:0;background:#fff;border:1px solid rgba(170,176,184,.3);border-radius:18px;padding:18px;text-decoration:none;color:var(--obsidian);box-shadow:var(--shadow-sm);overflow:hidden}.metric-card::after{content:"";position:absolute;right:-28px;bottom:-38px;width:90px;height:90px;border-radius:50%;background:var(--metric-tint,rgba(241,255,92,.15))}.metric-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);color:var(--obsidian);border-color:rgba(170,176,184,.45)}
.metric-icon{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:var(--metric-bg,var(--lunar));color:var(--metric-color,var(--obsidian));margin-bottom:18px;font-size:1rem}.metric-content{position:relative;z-index:1}.metric-content span,.metric-content strong,.metric-content small{display:block}.metric-content span{font-size:.72rem;color:var(--muted);font-weight:700}.metric-content strong{font-size:1.9rem;letter-spacing:-.04em;margin:5px 0 1px}.metric-content small{font-size:.65rem;color:#9AA2AA}.metric-arrow{position:absolute;right:15px;top:18px;color:#C4CBD1;font-size:.72rem;z-index:1}.metric-card:hover .metric-arrow{color:var(--obsidian)}
.metric-employees{--metric-bg:var(--obsidian);--metric-color:var(--stellar);--metric-tint:rgba(34,39,45,.06)}.metric-present{--metric-bg:rgba(59,170,115,.12);--metric-color:var(--success);--metric-tint:rgba(59,170,115,.08)}.metric-absent{--metric-bg:rgba(214,74,74,.11);--metric-color:var(--danger);--metric-tint:rgba(214,74,74,.07)}.metric-late{--metric-bg:rgba(231,166,42,.14);--metric-color:#B67800;--metric-tint:rgba(231,166,42,.08)}.metric-leave{--metric-bg:rgba(170,176,184,.2);--metric-color:#68717A;--metric-tint:rgba(170,176,184,.11)}.metric-warning{--metric-bg:var(--stellar);--metric-color:var(--obsidian);--metric-tint:rgba(241,255,92,.18)}

/* Dashboard cards */
.dashboard-card-header{display:flex;align-items:center;justify-content:space-between;gap:18px}.dashboard-card-header h3{font-size:1.05rem;margin:3px 0 0;font-weight:800;letter-spacing:-.015em}.dashboard-card-header p{margin:4px 0 0;font-size:.71rem;color:var(--muted);font-weight:500}.dashboard-card-header.compact{padding-top:19px;padding-bottom:17px}.card-eyebrow{display:block;color:#929AA2;font-size:.61rem;letter-spacing:.14em;font-weight:850}.card-link{font-size:.7rem;color:var(--obsidian);text-decoration:none;font-weight:800;white-space:nowrap}.card-link:hover{color:#778000}.card-link i{font-size:.62rem;margin-left:4px}.count-pill{min-width:38px;height:30px;border-radius:10px;background:var(--stellar);display:grid;place-items:center;font-size:.76rem;font-weight:900}.chart-wrap{position:relative;height:300px}.dashboard-chart-card .card-body{padding:16px 18px 20px}
.attendance-ring-wrap{display:grid;place-items:center;padding:2px 0 13px}.attendance-ring{width:190px;height:190px;position:relative}.attendance-ring canvas{position:absolute;inset:0}.attendance-ring-label{position:absolute;inset:0;display:grid;place-content:center;text-align:center;pointer-events:none}.attendance-ring-label strong,.attendance-ring-label span{display:block}.attendance-ring-label strong{font-size:1.78rem;letter-spacing:-.04em}.attendance-ring-label span{font-size:.65rem;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.chart-legend-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding-top:10px;border-top:1px solid var(--border)}.chart-legend-grid>div{text-align:center;position:relative}.chart-legend-grid strong,.chart-legend-grid small{display:block}.chart-legend-grid strong{font-size:.86rem}.chart-legend-grid small{font-size:.61rem;color:var(--muted)}.legend-dot{display:inline-block;width:6px;height:6px;border-radius:50%;margin-bottom:3px}.legend-dot.present{background:var(--obsidian)}.legend-dot.absent{background:var(--danger)}.legend-dot.leave{background:var(--quartz)}.legend-dot.missing{background:var(--stellar-deep)}
.dashboard-list-body{padding-top:8px!important;padding-bottom:10px!important}.approval-row,.device-status-row{display:flex;align-items:center;gap:11px;padding:12px 4px;border-bottom:1px solid #EDF0F3;text-decoration:none;color:var(--obsidian)}.approval-row:last-child,.device-status-row:last-child{border-bottom:0}.approval-row:hover,.device-status-row:hover{color:var(--obsidian);background:var(--lunar);margin-left:-8px;margin-right:-8px;padding-left:12px;padding-right:12px;border-radius:11px}.approval-icon{width:38px;height:38px;border-radius:11px;background:var(--lunar);display:grid;place-items:center;color:var(--obsidian)}.approval-row div,.device-status-row div{min-width:0;flex:1}.approval-row strong,.approval-row small,.device-status-row strong,.device-status-row small{display:block}.approval-row strong,.device-status-row strong{font-size:.77rem}.approval-row small,.device-status-row small{color:var(--muted);font-size:.65rem;margin-top:2px}.approval-row b{width:29px;height:29px;border-radius:9px;background:var(--stellar);display:grid;place-items:center;font-size:.7rem}.device-status-row>span:last-child{font-size:.63rem;color:var(--muted);font-weight:750;text-transform:uppercase;letter-spacing:.04em}
.device-summary-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:3px 0 10px}.device-summary-strip>div{background:var(--lunar);border-radius:12px;padding:10px;text-align:center}.device-summary-strip strong,.device-summary-strip small{display:block}.device-summary-strip strong{font-size:.9rem;margin:3px 0 0}.device-summary-strip small{font-size:.59rem;color:var(--muted)}.device-summary-strip i{font-size:.61rem;color:var(--obsidian)}.device-health{display:inline-block;width:7px;height:7px;border-radius:50%}.device-health.online{background:var(--success)}.device-health.offline{background:var(--danger)}
.payroll-status-card .card-body{position:relative}.payroll-status-card .card-body::after{content:"";position:absolute;right:-58px;bottom:-70px;width:190px;height:190px;border-radius:50%;background:rgba(241,255,92,.16);pointer-events:none}.payroll-badge{display:inline-flex;align-items:center;gap:7px;background:var(--lunar);border:1px solid var(--border);border-radius:20px;padding:7px 11px;font-size:.65rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em}.payroll-badge span{width:7px;height:7px;border-radius:50%;background:var(--success)}.payroll-status-card h4{font-size:1.25rem;margin:18px 0 17px;position:relative;z-index:1}.payroll-period{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding:14px;background:var(--obsidian);color:#fff;border-radius:15px;position:relative;z-index:1}.payroll-period div span,.payroll-period div strong{display:block}.payroll-period div span{color:#9EA7AF;font-size:.58rem;text-transform:uppercase;letter-spacing:.07em}.payroll-period div strong{font-size:.71rem;margin-top:3px}.payroll-period i{color:var(--stellar);font-size:.7rem}.payroll-paydate{display:flex;align-items:center;gap:9px;margin-top:13px;font-size:.68rem;position:relative;z-index:1}.payroll-paydate i{width:32px;height:32px;border-radius:10px;background:var(--stellar);display:grid;place-items:center}.payroll-paydate span{color:var(--muted)}.payroll-paydate strong{margin-left:auto}.dashboard-empty{text-align:center;padding:25px 10px;color:var(--muted)}.dashboard-empty>i{font-size:2rem;color:#CFD5DA;margin-bottom:10px}.dashboard-empty p{font-size:.72rem;margin:5px 0}.payroll-empty{position:relative;z-index:1;padding-top:32px}.empty-x img{width:38px;height:36px;object-fit:contain;opacity:.22}
.birthday-row{display:flex;align-items:center;gap:12px;padding:11px 2px;border-bottom:1px solid var(--border)}.birthday-row:last-child{border-bottom:0}.birthday-avatar{width:38px;height:38px;border-radius:12px;background:var(--obsidian);color:var(--stellar);display:grid;place-items:center;font-size:.74rem;font-weight:900}.birthday-row div{flex:1}.birthday-row strong,.birthday-row small{display:block}.birthday-row strong{font-size:.78rem}.birthday-row small{font-size:.65rem;color:var(--muted);margin-top:2px}.birthday-row>i{width:30px;height:30px;border-radius:9px;background:rgba(241,255,92,.45);display:grid;place-items:center;color:var(--obsidian);font-size:.75rem}
.holiday-row{display:flex;align-items:center;gap:12px;padding:10px 2px;border-bottom:1px solid var(--border)}.holiday-row:last-child{border-bottom:0}.holiday-date{width:43px;height:47px;border-radius:12px;background:var(--lunar);border:1px solid var(--border);display:grid;place-content:center;text-align:center}.holiday-date strong,.holiday-date small{display:block}.holiday-date strong{font-size:.9rem;line-height:1}.holiday-date small{font-size:.53rem;color:var(--muted);margin-top:3px;letter-spacing:.08em}.holiday-row>div{flex:1}.holiday-row>div strong,.holiday-row>div small{display:block}.holiday-row>div strong{font-size:.77rem}.holiday-row>div small{font-size:.64rem;color:var(--muted);margin-top:2px}.holiday-day{font-size:.61rem;color:var(--muted);font-weight:800;text-transform:uppercase}

/* Login */
.login-page{min-height:100vh;display:grid;place-items:center;background:var(--obsidian);padding:28px;position:relative;overflow:hidden}.login-page::before,.login-page::after{content:"";position:absolute;border-radius:50%;pointer-events:none}.login-page::before{width:650px;height:650px;right:-280px;top:-310px;background:radial-gradient(circle,rgba(241,255,92,.16),transparent 66%)}.login-page::after{width:560px;height:560px;left:-300px;bottom:-350px;background:radial-gradient(circle,rgba(244,250,255,.08),transparent 66%)}
.login-shell{position:relative;z-index:1;width:min(980px,100%);min-height:580px;display:grid;grid-template-columns:1.06fr .94fr;background:#fff;border-radius:26px;overflow:hidden;box-shadow:0 36px 100px rgba(0,0,0,.35)}.login-brand-panel{position:relative;background:linear-gradient(145deg,#272D33,var(--obsidian-2));padding:48px;display:flex;flex-direction:column;color:#fff;overflow:hidden}.login-brand-panel::after{content:"";position:absolute;right:-145px;bottom:-125px;width:500px;height:500px;border-radius:50%;background:rgba(241,255,92,.055)}.login-wordmark{width:245px;height:auto;position:relative;z-index:2}.login-brand-content{margin:auto 0;position:relative;z-index:2;max-width:390px}.login-brand-content img{width:96px;height:90px;object-fit:contain;margin-bottom:25px}.login-brand-content span{color:var(--stellar);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;font-weight:850}.login-brand-content h1{font-size:2.35rem;line-height:1.13;letter-spacing:-.04em;margin:12px 0 15px}.login-brand-content p{color:#B8C0C8;line-height:1.7;font-size:.88rem;margin:0}.login-brand-footer{position:relative;z-index:2;color:#7F8993;font-size:.66rem}.login-form-panel{padding:62px 58px;display:flex;align-items:center}.login-card{width:100%}.login-card .login-form-kicker{color:#949CA4;font-size:.65rem;letter-spacing:.14em;text-transform:uppercase;font-weight:850}.login-card h2{font-size:2rem;font-weight:830;letter-spacing:-.035em;margin:9px 0 8px}.login-card>p{color:var(--muted);font-size:.82rem;margin-bottom:27px}.login-card .form-label{font-size:.75rem}.login-card .form-control{height:49px;padding-left:15px}.login-card .btn{height:49px}.login-card .alert{font-size:.75rem;border:0;border-radius:11px}.login-security-note{display:flex;align-items:center;gap:8px;margin-top:18px;color:#9AA1A8;font-size:.63rem}.login-security-note i{color:var(--obsidian)}

/* Responsive */
@media(max-width:1399px){.dashboard-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.dashboard-hero-actions{margin-right:10px}.dashboard-hero-mark{width:350px}}
@media(max-width:1199px){.dashboard-hero{align-items:flex-start;flex-direction:column;gap:24px}.dashboard-hero-actions{width:100%;flex-direction:row;flex-wrap:wrap}.hero-action{min-width:190px}.dashboard-hero-mark{right:-90px;bottom:-130px}.chart-wrap{height:275px}}
@media(max-width:991px){.sidebar{transform:translateX(-100%)}.sidebar.open{transform:translateX(0)}.sidebar-backdrop{position:fixed;inset:0;background:rgba(23,27,31,.58);z-index:1035;backdrop-filter:blur(2px)}.sidebar-backdrop.show{display:block}.main{margin-left:0}.content{padding:20px}.topbar{padding:0 18px}.page-header{align-items:flex-start;flex-direction:column}.filter-bar{flex-wrap:wrap}.dashboard-hero{padding:30px}.login-shell{grid-template-columns:1fr;max-width:560px}.login-brand-panel{min-height:260px;padding:34px}.login-brand-content{margin:38px 0 10px}.login-brand-content img{width:62px;height:58px;margin-bottom:12px}.login-brand-content h1{font-size:1.75rem}.login-brand-content p,.login-brand-footer{display:none}.login-form-panel{padding:42px}}
@media(max-width:767px){.content{padding:15px}.topbar{height:70px}.topbar-title{display:none}.topbar-actions{gap:7px}.user-chip{padding-right:4px}.dashboard-hero{min-height:0;padding:26px 22px;border-radius:20px}.dashboard-hero h1{font-size:2rem}.dashboard-hero p{font-size:.84rem}.hero-meta{gap:10px}.hero-meta span:nth-child(2){display:none}.dashboard-hero-actions{gap:8px}.hero-action{min-width:calc(50% - 4px);flex:1;padding:10px;font-size:.7rem}.dashboard-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.metric-card{padding:15px}.metric-icon{margin-bottom:13px}.metric-content strong{font-size:1.55rem}.chart-wrap{height:245px}.dashboard-card-header{align-items:flex-start}.chart-legend-grid{grid-template-columns:repeat(2,1fr);gap:12px}.login-page{padding:14px}.login-shell{border-radius:20px}.login-brand-panel{min-height:215px;padding:27px}.login-wordmark{width:190px}.login-brand-content{margin:25px 0 5px}.login-brand-content img{display:none}.login-form-panel{padding:32px 26px}.login-card h2{font-size:1.65rem}}
@media(max-width:420px){.dashboard-metrics{grid-template-columns:1fr 1fr}.metric-card{min-height:158px}.metric-content span{font-size:.66rem}.metric-content small{font-size:.59rem}.hero-action{min-width:100%}.topbar-date{display:none!important}.dashboard-hero-mark{width:260px;right:-90px;bottom:-85px}}
@media print{.sidebar,.sidebar-backdrop,.topbar,.page-header .btn,.filter-bar,.dashboard-hero-actions{display:none!important}.main{margin:0}.content{padding:0}.content-card{border:0;box-shadow:none}.dashboard-hero{box-shadow:none}.metric-card{box-shadow:none}}

/* Birthday topbar */
.birthday-topbar-button{height:46px;max-width:360px;display:flex;align-items:center;gap:9px;border:1px solid rgba(170,176,184,.32);background:#fff;border-radius:14px;padding:5px 10px 5px 5px;color:var(--obsidian);box-shadow:0 3px 12px rgba(34,39,45,.035);text-align:left}
.birthday-topbar-button:hover,.birthday-topbar-button[aria-expanded="true"]{border-color:var(--stellar-deep);background:rgba(241,255,92,.12)}
.birthday-topbar-icon{width:35px;height:35px;border-radius:10px;background:var(--stellar);display:grid;place-items:center;flex:0 0 auto;font-size:.78rem}
.birthday-topbar-copy{min-width:0;display:block}.birthday-topbar-copy small,.birthday-topbar-copy strong{display:block}.birthday-topbar-copy small{font-size:.54rem;color:#929AA2;text-transform:uppercase;letter-spacing:.08em;font-weight:850}.birthday-topbar-copy strong{font-size:.67rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:235px;margin-top:2px}
.birthday-topbar-count{min-width:23px;height:23px;padding:0 6px;border-radius:8px;background:var(--obsidian);color:var(--stellar);display:grid;place-items:center;font-size:.62rem;font-weight:900;flex:0 0 auto}
.birthday-dropdown{width:340px;border:1px solid var(--border);border-radius:16px;padding:8px;box-shadow:0 22px 55px rgba(34,39,45,.18);margin-top:8px}
.birthday-dropdown-header{display:flex;align-items:center;gap:10px;padding:10px 11px 13px;border-bottom:1px solid var(--border)}.birthday-dropdown-header>span{width:38px;height:38px;border-radius:11px;background:var(--stellar);display:grid;place-items:center}.birthday-dropdown-header strong,.birthday-dropdown-header small{display:block}.birthday-dropdown-header strong{font-size:.78rem}.birthday-dropdown-header small{font-size:.64rem;color:var(--muted);margin-top:2px}
.birthday-dropdown-row{display:flex;align-items:center;gap:10px;padding:10px 8px;border-bottom:1px solid #EDF0F3}.birthday-dropdown-row:last-child{border-bottom:0}.birthday-dropdown-row.today{background:rgba(241,255,92,.14);border-radius:10px}.birthday-dropdown-avatar{width:34px;height:34px;border-radius:10px;background:var(--obsidian);color:var(--stellar);display:grid;place-items:center;font-size:.68rem;font-weight:900;flex:0 0 auto}.birthday-dropdown-row>div{min-width:0;flex:1}.birthday-dropdown-row strong,.birthday-dropdown-row small{display:block}.birthday-dropdown-row strong{font-size:.72rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.birthday-dropdown-row small{font-size:.6rem;color:var(--muted);margin-top:2px}.birthday-dropdown-date{font-size:.62rem;font-weight:850;color:#7A828B;white-space:nowrap}.birthday-dropdown-row.today .birthday-dropdown-date{color:#687300}.birthday-dropdown-empty{padding:24px 12px;text-align:center;color:var(--muted);font-size:.72rem}

/* Employee dashboard */
.employee-dashboard-hero{min-height:235px}.employee-dashboard-hero .dashboard-hero-copy{max-width:980px}.employee-profile-strip{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:20px}.employee-profile-strip>span{display:inline-flex;align-items:center;gap:7px;background:rgba(244,250,255,.07);border:1px solid rgba(244,250,255,.1);border-radius:20px;padding:7px 10px;color:#D3D9DF;font-size:.68rem;font-weight:650}.employee-profile-strip i{color:var(--stellar)}.employee-leave-summary-chip,.employee-leave-breakdown-chip{display:inline-flex;align-items:center;text-decoration:none;border-radius:20px;transition:transform .18s ease,border-color .18s ease,background .18s ease}.employee-leave-summary-chip{gap:6px;padding:7px 11px;background:rgba(241,255,92,.13);border:1px solid rgba(241,255,92,.38);color:var(--lunar)}.employee-leave-summary-chip strong{font-size:.64rem;font-weight:750}.employee-leave-summary-chip b{font-size:.78rem;color:var(--stellar)}.employee-leave-summary-chip small{font-size:.56rem;color:#D3D9DF}.employee-leave-breakdown-chip{gap:6px;padding:7px 10px;background:rgba(244,250,255,.07);border:1px solid rgba(244,250,255,.1);color:#D3D9DF}.employee-leave-breakdown-chip span{font-size:.58rem;font-weight:850;letter-spacing:.06em;color:var(--stellar)}.employee-leave-breakdown-chip b{font-size:.7rem;color:var(--lunar)}.employee-leave-summary-chip:hover,.employee-leave-breakdown-chip:hover{transform:translateY(-1px);border-color:var(--stellar);background:rgba(241,255,92,.18);color:var(--lunar)}
.employee-dashboard-metrics{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}.employee-dashboard-metrics .metric-card{min-height:185px}.employee-metric-leave{--metric-bg:rgba(241,255,92,.35);--metric-color:var(--obsidian);--metric-tint:rgba(241,255,92,.18)}
.employee-inout-chart{height:320px}.employee-attendance-ring{width:205px;height:205px}.employee-pie-legend{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px;padding-top:14px;border-top:1px solid var(--border)}.employee-pie-legend>div{text-align:center}.employee-pie-legend strong,.employee-pie-legend small{display:block}.employee-pie-legend strong{font-size:.82rem;margin-top:4px}.employee-pie-legend small{font-size:.58rem;color:var(--muted);margin-top:1px}.legend-dot.employee-present{background:#22272D}.legend-dot.employee-late{background:#E7A62A}.legend-dot.employee-absent{background:#D64A4A}.legend-dot.employee-leave{background:#AAB0B8}.legend-dot.employee-missing{background:#F1FF5C;border:1px solid #D7E535}.legend-dot.employee-other{background:#DDE4EA}
.employee-action-footer{display:flex;gap:8px;flex-wrap:wrap}.employee-recent-table thead th{font-size:.65rem}.employee-recent-table td{font-size:.75rem;padding:11px 14px}.employee-recent-table .badge{font-size:.58rem;font-weight:700;padding:6px 8px;border-radius:8px}
.employee-leave-balance-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.employee-leave-balance-item{position:relative;border:1px solid var(--border);background:linear-gradient(145deg,#fff,var(--lunar));border-radius:15px;padding:16px;overflow:hidden}.employee-leave-balance-item::after{content:"";position:absolute;width:72px;height:72px;border-radius:50%;right:-24px;bottom:-30px;background:rgba(241,255,92,.3)}.employee-leave-balance-item>span{display:inline-flex;background:var(--obsidian);color:var(--stellar);border-radius:7px;padding:4px 7px;font-size:.54rem;font-weight:850;letter-spacing:.06em}.employee-leave-balance-item>strong{display:block;font-size:.78rem;margin:10px 0 12px}.employee-leave-balance-item>div{position:relative;z-index:1;display:flex;align-items:flex-end;gap:6px}.employee-leave-balance-item b{font-size:1.55rem;letter-spacing:-.04em}.employee-leave-balance-item small{font-size:.61rem;color:var(--muted);padding-bottom:4px}

@media(max-width:1399px){.birthday-topbar-copy strong{max-width:180px}.employee-dashboard-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.employee-leave-balance-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1199px){.birthday-topbar-copy{display:none}.birthday-topbar-button{padding-right:6px}.employee-dashboard-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}.employee-leave-balance-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:767px){.birthday-topbar-button{height:42px}.birthday-topbar-icon{width:32px;height:32px}.birthday-topbar-count{display:none}.employee-dashboard-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.employee-dashboard-metrics .metric-card{min-height:158px}.employee-inout-chart{height:275px}.employee-pie-legend{grid-template-columns:repeat(3,1fr)}.employee-leave-balance-grid{grid-template-columns:1fr 1fr}.employee-profile-strip span{font-size:.61rem}.employee-recent-table td{padding:9px 10px}}
@media(max-width:420px){.employee-dashboard-metrics{grid-template-columns:1fr 1fr}.employee-leave-balance-grid{grid-template-columns:1fr}.employee-pie-legend{grid-template-columns:repeat(2,1fr)}}

/* Profile menu and employee photos */
.profile-topbar-dropdown{display:block}.profile-menu-toggle{cursor:pointer;color:var(--obsidian);min-width:148px;text-align:left}.profile-menu-toggle:hover,.profile-menu-toggle.active,.profile-menu-toggle[aria-expanded="true"]{border-color:var(--stellar-deep);background:rgba(241,255,92,.12)}.profile-menu-chevron{font-size:.58rem;color:#8B939C;margin-left:auto}.user-avatar.has-photo,.profile-dropdown-avatar.has-photo,.employee-list-avatar.has-photo{background:#E9EEF2;color:transparent;overflow:hidden}.user-avatar img,.profile-dropdown-avatar img,.employee-list-avatar img{width:100%;height:100%;display:block;object-fit:cover}.profile-dropdown-menu{width:270px;border:1px solid var(--border);border-radius:16px;padding:8px;box-shadow:0 22px 55px rgba(34,39,45,.18);margin-top:8px}.profile-dropdown-header{display:flex;align-items:center;gap:11px;padding:10px 10px 13px;border-bottom:1px solid var(--border);margin-bottom:5px}.profile-dropdown-avatar{width:42px;height:42px;border-radius:12px;background:var(--obsidian);color:var(--stellar);display:grid;place-items:center;font-size:.76rem;font-weight:900;flex:0 0 auto}.profile-dropdown-header strong,.profile-dropdown-header small{display:block}.profile-dropdown-header strong{font-size:.78rem}.profile-dropdown-header small{font-size:.63rem;color:var(--muted);margin-top:2px}.profile-dropdown-menu .dropdown-item{display:flex;align-items:center;gap:11px;border-radius:10px;padding:10px 11px;font-size:.74rem;font-weight:650;color:var(--obsidian)}.profile-dropdown-menu .dropdown-item i{width:18px;color:#7C858E;text-align:center}.profile-dropdown-menu .dropdown-item:hover{background:rgba(241,255,92,.18)}.profile-dropdown-menu form{margin:0}.profile-signout{width:100%;border:0;background:transparent;text-align:left}.profile-signout:hover{color:var(--danger)!important;background:rgba(214,74,74,.08)!important}.profile-signout:hover i{color:var(--danger)!important}
.employee-list-identity{display:flex;align-items:center;gap:11px;min-width:220px}.employee-list-avatar{width:42px;height:42px;border-radius:12px;background:var(--obsidian);color:var(--stellar);display:grid;place-items:center;flex:0 0 auto;font-size:.68rem;font-weight:900;box-shadow:inset 0 0 0 1px rgba(170,176,184,.18)}
.attendance-employee-identity{display:flex;align-items:center;gap:10px;min-width:205px}.attendance-employee-avatar{width:38px;height:38px;border-radius:11px;background:var(--obsidian);color:var(--stellar);display:grid;place-items:center;flex:0 0 auto;font-size:.64rem;font-weight:900;box-shadow:inset 0 0 0 1px rgba(170,176,184,.18)}.attendance-employee-avatar.has-photo{background:#E9EEF2;color:transparent;overflow:hidden}.attendance-employee-avatar img{width:100%;height:100%;display:block;object-fit:cover}.attendance-employee-identity strong,.attendance-employee-identity span{display:block}.attendance-employee-identity strong{font-size:.82rem;line-height:1.25;color:var(--obsidian)}.attendance-employee-identity span{font-size:.65rem;color:var(--muted);margin-top:2px}
.profile-photo-card .card-body{padding:30px}.profile-photo-preview{width:156px;height:156px;border-radius:32px;margin:0 auto 20px;background:linear-gradient(145deg,var(--obsidian),#353C44);color:var(--stellar);display:grid;place-items:center;overflow:hidden;box-shadow:0 18px 38px rgba(34,39,45,.18);font-size:2.2rem;font-weight:900;letter-spacing:.02em;border:6px solid #fff;outline:1px solid var(--border)}.profile-photo-preview img{width:100%;height:100%;object-fit:cover;display:block}.profile-photo-card h4{font-size:1.12rem;font-weight:820;margin:0}.profile-role-text{color:var(--muted);font-size:.72rem;margin:6px 0 22px}.profile-photo-form{margin-top:18px}.profile-photo-drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;border:1.5px dashed #C8D0D7;background:var(--lunar);border-radius:14px;padding:18px 12px;margin-bottom:11px;cursor:pointer;transition:.18s ease}.profile-photo-drop:hover{border-color:var(--stellar-deep);background:rgba(241,255,92,.12)}.profile-photo-drop i{width:38px;height:38px;border-radius:11px;background:var(--stellar);display:grid;place-items:center;margin-bottom:3px}.profile-photo-drop strong{font-size:.75rem}.profile-photo-drop small{font-size:.62rem;color:var(--muted)}.profile-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;border:1px solid var(--border);border-radius:15px;overflow:hidden}.profile-detail-grid>div{padding:17px 18px;border-bottom:1px solid var(--border);background:#fff}.profile-detail-grid>div:nth-child(odd){border-right:1px solid var(--border)}.profile-detail-grid>div:nth-last-child(-n+2){border-bottom:0}.profile-detail-grid span,.profile-detail-grid strong{display:block}.profile-detail-grid span{font-size:.61rem;color:#8B949D;text-transform:uppercase;letter-spacing:.07em;font-weight:800}.profile-detail-grid strong{font-size:.78rem;margin-top:5px;word-break:break-word}.profile-security-footer{display:flex;align-items:center;justify-content:space-between;gap:16px}.profile-security-footer>div{display:flex;align-items:center;gap:11px}.profile-security-footer>div>span{width:40px;height:40px;border-radius:11px;background:var(--stellar);display:grid;place-items:center}.profile-security-footer strong,.profile-security-footer small{display:block}.profile-security-footer strong{font-size:.75rem}.profile-security-footer small{font-size:.63rem;color:var(--muted);margin-top:2px}
@media(max-width:991px){.profile-detail-grid{grid-template-columns:1fr}.profile-detail-grid>div:nth-child(odd){border-right:0}.profile-detail-grid>div:nth-last-child(2){border-bottom:1px solid var(--border)}}
@media(max-width:767px){.profile-menu-toggle{min-width:0;padding-right:4px}.profile-menu-chevron{display:none}.profile-dropdown-menu{width:260px}.profile-security-footer{align-items:flex-start;flex-direction:column}.profile-security-footer .btn{width:100%}.employee-list-identity{min-width:185px}.employee-list-avatar{width:38px;height:38px}}

/* Work-from-home attendance controls */
.wfh-user-switch-form{display:inline-flex;align-items:center}.wfh-user-switch{display:flex;align-items:center;gap:8px;min-width:108px}.wfh-user-switch .form-check-input{width:2.5rem;height:1.3rem;margin:0;cursor:pointer;border-color:#AAB0B8;background-color:#DCE2E7}.wfh-user-switch .form-check-input:checked{background-color:#22272D;border-color:#22272D;box-shadow:0 0 0 3px rgba(241,255,92,.34)}.wfh-user-switch-label{font-size:.68rem;font-weight:750;color:#5D6670}
.wfh-clock-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:20px;padding:20px 22px;border:1px solid rgba(34,39,45,.12);border-radius:20px;background:linear-gradient(135deg,#FFFFFF 0%,#F4FAFF 58%,rgba(241,255,92,.16) 100%);box-shadow:0 12px 35px rgba(34,39,45,.07);position:relative;overflow:hidden}.wfh-clock-card:after{content:"";position:absolute;width:140px;height:140px;border-radius:50%;right:-62px;bottom:-75px;background:rgba(241,255,92,.26);pointer-events:none}.wfh-clock-card.is-checked-in{border-color:rgba(45,174,111,.32);background:linear-gradient(135deg,#FFFFFF 0%,rgba(229,248,239,.75) 55%,rgba(241,255,92,.14) 100%)}.wfh-clock-icon{width:58px;height:58px;border-radius:17px;background:#22272D;color:#F1FF5C;display:grid;place-items:center;font-size:1.22rem;box-shadow:0 10px 25px rgba(34,39,45,.17)}.wfh-clock-card.is-checked-in .wfh-clock-icon{background:#2DAE6F;color:#fff}.wfh-clock-copy{min-width:0}.wfh-clock-copy h3{margin:2px 0 5px;font-size:1rem;font-weight:850;color:#22272D}.wfh-clock-copy p{margin:0;color:#68717B;font-size:.72rem;line-height:1.55}.wfh-clock-times{display:flex;align-items:center;gap:10px}.wfh-clock-times div{min-width:82px;padding:10px 12px;border-radius:14px;background:#fff;border:1px solid rgba(34,39,45,.09);text-align:center}.wfh-clock-times span,.wfh-clock-times strong{display:block}.wfh-clock-times span{font-size:.55rem;letter-spacing:.08em;text-transform:uppercase;color:#8B939C;font-weight:800}.wfh-clock-times strong{margin-top:3px;font-size:.9rem;color:#22272D}.wfh-clock-action{display:flex;flex-direction:column;align-items:stretch;gap:5px;min-width:142px;position:relative;z-index:1}.wfh-clock-action .btn{font-size:.74rem;font-weight:850;padding:10px 16px;border-radius:12px}.wfh-clock-action small{text-align:center;font-size:.53rem;color:#7D868F}.wfh-clock-action .btn-dark{background:#22272D;border-color:#22272D;color:#F1FF5C}
@media(max-width:1199px){.wfh-clock-card{grid-template-columns:auto minmax(0,1fr) auto}.wfh-clock-times{grid-column:2/3}.wfh-clock-action{grid-column:3/4;grid-row:1/3}}
@media(max-width:767px){.wfh-clock-card{grid-template-columns:auto minmax(0,1fr);gap:14px;padding:17px}.wfh-clock-icon{width:48px;height:48px;border-radius:14px}.wfh-clock-times{grid-column:1/3;width:100%}.wfh-clock-times div{flex:1}.wfh-clock-action{grid-column:1/3;grid-row:auto;width:100%}.wfh-clock-action .btn{width:100%}}

/* Dashboard metric detail popups */
.dashboard-metric-button{width:100%;text-align:left;font:inherit;cursor:pointer;appearance:none;-webkit-appearance:none}
.dashboard-metric-button:focus-visible{outline:3px solid rgba(241,255,92,.65);outline-offset:3px}
.dashboard-detail-modal .modal-content{border:0;border-radius:22px;overflow:hidden;box-shadow:0 26px 80px rgba(34,39,45,.24)}
.dashboard-detail-modal-header{align-items:flex-start;padding:22px 24px;background:linear-gradient(135deg,#22272D 0%,#30363D 100%);color:#fff;border:0}
.dashboard-detail-modal-header .card-eyebrow{color:#AAB0B8}.dashboard-detail-modal-header h4{margin:4px 0 0;font-size:1.28rem;font-weight:850}.dashboard-detail-modal-header h4 span{display:inline-grid;place-items:center;min-width:32px;height:28px;margin-left:7px;padding:0 9px;border-radius:10px;background:#F1FF5C;color:#22272D;font-size:.76rem}.dashboard-detail-modal-header p{margin:5px 0 0;color:#C6CDD3;font-size:.74rem}.dashboard-detail-modal-header .btn-close{filter:invert(1);opacity:.8}
.dashboard-detail-modal .modal-body{padding:22px 24px;background:#F8FBFD}.dashboard-detail-modal .modal-footer{padding:15px 24px;background:#fff;border-top:1px solid #E6EBEF}
.dashboard-detail-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:16px}.dashboard-detail-toolbar>span{white-space:nowrap;color:#68727C;font-size:.72rem}.dashboard-detail-search{position:relative;flex:1;max-width:520px}.dashboard-detail-search i{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:#8E98A1;font-size:.75rem;pointer-events:none}.dashboard-detail-search .form-control{height:44px;padding-left:40px;border-radius:13px;background:#fff}
.dashboard-detail-table{background:#fff;border:1px solid #E3E8EC;border-radius:16px;overflow:hidden}.dashboard-detail-table thead th{padding:12px 15px;background:#F1F5F8;color:#67717A;font-size:.63rem;text-transform:uppercase;letter-spacing:.06em;border-bottom:1px solid #E1E6EA}.dashboard-detail-table tbody td{padding:13px 15px;border-color:#EDF1F4;font-size:.75rem}.dashboard-detail-table td>strong,.dashboard-detail-table td>small{display:block}.dashboard-detail-table td>small{margin-top:3px;color:#7B858E;font-size:.64rem}.dashboard-detail-employee{display:flex;align-items:center;gap:11px;min-width:220px}.dashboard-detail-employee strong,.dashboard-detail-employee small{display:block}.dashboard-detail-employee strong{font-size:.77rem}.dashboard-detail-employee small{color:#7F8992;font-size:.64rem;margin-top:2px}.dashboard-detail-avatar{width:39px;height:39px;flex:0 0 39px;border-radius:12px;background:#22272D;color:#F1FF5C;display:grid;place-items:center;font-size:.72rem;font-weight:850;overflow:hidden}.dashboard-detail-avatar.has-photo{background:#E9EEF2}.dashboard-detail-avatar img{width:100%;height:100%;object-fit:cover}
.dashboard-detail-status{display:inline-flex;align-items:center;justify-content:center;min-width:82px;padding:6px 9px;border-radius:20px;font-size:.62rem;font-weight:800;text-transform:capitalize;background:#EDF1F4;color:#4E5963}.dashboard-detail-status.status-present,.dashboard-detail-status.status-active{background:#E5F7EE;color:#147A4B}.dashboard-detail-status.status-absent{background:#FDE9EA;color:#B72D34}.dashboard-detail-status.status-late{background:#FFF1D8;color:#A76500}.dashboard-detail-status.status-leave{background:#E9EEF4;color:#52616E}.dashboard-detail-status.status-missing{background:#F1FF5C;color:#22272D}
.dashboard-detail-empty{min-height:245px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#7E8891}.dashboard-detail-empty i{width:58px;height:58px;border-radius:18px;background:#E9F7F0;color:#2C9C68;display:grid;place-items:center;font-size:1.35rem;margin-bottom:13px}.dashboard-detail-empty strong{color:#22272D;font-size:.92rem}.dashboard-detail-empty span{margin-top:5px;font-size:.72rem}.dashboard-detail-no-results{text-align:center;padding:20px;color:#7D8790;font-size:.74rem}
@media(max-width:767px){.dashboard-detail-modal .modal-dialog{margin:10px}.dashboard-detail-modal-header,.dashboard-detail-modal .modal-body,.dashboard-detail-modal .modal-footer{padding-left:16px;padding-right:16px}.dashboard-detail-toolbar{align-items:stretch;flex-direction:column}.dashboard-detail-search{max-width:none;width:100%}.dashboard-detail-toolbar>span{align-self:flex-end}.dashboard-detail-table thead th:nth-child(2),.dashboard-detail-table tbody td:nth-child(2){display:none}.dashboard-detail-employee{min-width:185px}}

@media(max-width:767px){.employee-leave-summary-chip strong{display:none}.employee-leave-summary-chip,.employee-leave-breakdown-chip{padding:6px 9px}.employee-leave-breakdown-chip span{font-size:.54rem}}

/* Employee address field */
.employee-address-cell{min-width:220px;max-width:320px;white-space:normal;line-height:1.35}

.profile-detail-wide{grid-column:1/-1}.profile-detail-wide strong{white-space:normal;line-height:1.5}

/* Employee leave decision updates */
.leave-decision-card{overflow:hidden}.leave-decision-table thead th{background:#F4FAFF;color:#68727C;font-size:.62rem;text-transform:uppercase;letter-spacing:.06em;padding:12px 14px;white-space:nowrap}.leave-decision-table tbody td{padding:14px;border-color:#EDF1F4;font-size:.73rem;vertical-align:top}.leave-decision-table td>strong,.leave-decision-table td>small{display:block}.leave-action-comment{min-width:210px;max-width:360px;padding:9px 11px;border-radius:11px;background:#F4FAFF;border-left:4px solid #F1FF5C;line-height:1.45;color:#3E4851;white-space:normal}
@media(max-width:767px){.leave-decision-table th:nth-child(4),.leave-decision-table td:nth-child(4),.leave-decision-table th:nth-child(6),.leave-decision-table td:nth-child(6){display:none}.leave-action-comment{min-width:180px}}

/* Roles and permissions: keep detailed rights collapsed until requested. */
.role-permission-card .role-toggle .when-expanded{display:none}
.role-permission-card .role-toggle[aria-expanded="true"] .when-collapsed{display:none}
.role-permission-card .role-toggle[aria-expanded="true"] .when-expanded{display:inline}
.role-permission-card .role-toggle i{transition:transform .2s ease}
.role-permission-card .role-toggle[aria-expanded="true"] i{transform:rotate(180deg)}