
/* Hader commercial dashboard polish — loaded last, safe visual layer only */
:root{--hader-blue:#0F4D96;--hader-cyan:#00AEEF;--hader-ink:#10233f;--hader-soft:#f4f8fc;--hader-border:#dbe7f3;--hader-radius:20px;}
body{background:linear-gradient(180deg,#f4f8fc 0%,#f8fafc 50%,#ffffff 100%)!important;color:var(--hader-ink)}
.sidebar{box-shadow:-8px 0 30px rgba(15,77,150,.10);border-left:1px solid rgba(15,77,150,.10)}
.nav-section[data-section="hader"] .nav-section-hdr{background:linear-gradient(135deg,rgba(15,77,150,.12),rgba(0,174,239,.12));border:1px solid rgba(15,77,150,.14);border-radius:16px;margin:8px 10px;color:#0F4D96;font-weight:900}
.nav-section[data-section="hader"] .nav-item.active,.nav-section[data-section="hader"] .nav-item:hover{background:linear-gradient(135deg,#0F4D96,#0b74bd)!important;color:#fff!important;box-shadow:0 12px 24px rgba(15,77,150,.20)}
.main-header{backdrop-filter:blur(16px);background:rgba(255,255,255,.82);border-bottom:1px solid rgba(15,77,150,.10)}
.mg-card{border:1px solid var(--hader-border)!important;border-radius:var(--hader-radius)!important;box-shadow:0 14px 34px rgba(15,77,150,.08)!important;overflow:hidden}.mg-card-title{letter-spacing:-.02em}.mg-strip{background:linear-gradient(90deg,#0F4D96,#00AEEF)!important;height:4px!important;border-radius:999px!important}.mg-btn{border-radius:12px!important;font-weight:800!important}.mg-btn--primary{background:linear-gradient(135deg,#0F4D96,#0a79c5)!important;border-color:transparent!important;box-shadow:0 10px 24px rgba(15,77,150,.22)!important}.mg-stat{border-radius:18px!important;border:1px solid var(--hader-border)!important;background:linear-gradient(180deg,#fff,#f8fbff)!important;box-shadow:0 10px 24px rgba(15,77,150,.06)!important}.mg-table-wrap{border-radius:18px!important;border:1px solid var(--hader-border)!important}.mg-table th{background:#f3f8ff!important;color:#0F4D96!important;font-weight:900!important}.mg-table td{vertical-align:middle!important}.hader-admin-page{display:grid;gap:16px}.hader-hero{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px;border-radius:24px;color:#fff;background:radial-gradient(circle at 10% 10%,rgba(0,174,239,.55),transparent 34%),linear-gradient(135deg,#0F4D96,#082d5b);box-shadow:0 22px 40px rgba(15,77,150,.22)}.hader-hero h2{font-size:28px;margin:4px 0 8px;font-weight:1000}.hader-hero p{margin:0;color:rgba(255,255,255,.82);max-width:780px}.hader-kicker{display:inline-flex;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.22);padding:6px 10px;border-radius:999px;font-weight:900;font-size:12px}.hader-hero-actions{display:flex;gap:8px;flex-wrap:wrap}.hader-hero .mg-btn{background:#fff!important;color:#0F4D96!important;border:0!important}.hader-hero .mg-btn--primary{background:#00AEEF!important;color:#fff!important}.hader-card{padding:16px}.hader-stat-grid{margin:16px 0}.hader-employee-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px}.hader-emp-card{background:#fff;border:1px solid var(--hader-border);border-radius:20px;padding:16px;box-shadow:0 12px 28px rgba(15,77,150,.07)}.hader-emp-head{display:flex;align-items:center;gap:12px;margin-bottom:12px}.hader-emp-head h3{margin:0;font-size:17px;color:#10233f}.hader-emp-head p{margin:4px 0 0;color:#64748b}.hader-avatar,.hader-avatar-mini{display:inline-grid;place-items:center;background:linear-gradient(135deg,#0F4D96,#00AEEF);color:#fff;font-weight:1000}.hader-avatar{width:48px;height:48px;border-radius:16px;font-size:20px}.hader-avatar-mini{width:30px;height:30px;border-radius:10px}.hader-emp-cell{display:flex;align-items:center;gap:8px}.hader-emp-head .mg-badge{margin-inline-start:auto}.hader-emp-metrics{display:grid;gap:8px;margin:12px 0}.hader-emp-metrics span{background:#f7fbff;border:1px solid #e3edf8;border-radius:12px;padding:8px 10px;font-weight:800;color:#334155}.hader-emp-actions{display:flex;gap:8px;flex-wrap:wrap}.hader-modal-note{background:#f0f8ff;border:1px solid #cfe4fa;color:#0F4D96;border-radius:14px;padding:10px 12px;font-weight:800;margin-bottom:12px}.hader-settings-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}.hader-policy{padding:18px}.hader-policy h3{margin:0 0 8px;color:#0F4D96}.hader-policy p{color:#64748b;min-height:48px}.view#viewPayroll .mg-card:first-child{border-top:5px solid #0F4D96!important}.view#viewPayroll .mg-stat-grid{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))!important}@media(max-width:800px){.hader-hero{align-items:flex-start;flex-direction:column;padding:18px}.hader-hero h2{font-size:22px}.hader-hero-actions{width:100%}.hader-hero-actions .mg-btn{flex:1}.mg-toolbar{grid-template-columns:1fr!important}.hader-employee-grid{grid-template-columns:1fr}.main-header{position:sticky;top:0;z-index:20}}

/* Hader section logo enhancement */
.hader-hero{display:flex;align-items:center;justify-content:space-between;gap:18px}
.hader-hero-brand{display:flex;align-items:center;gap:14px}
.hader-hero-logo{width:72px;height:72px;border-radius:22px;object-fit:contain;background:#fff;padding:7px;box-shadow:0 12px 28px rgba(6,114,54,.13);flex:0 0 auto}
@media (max-width:700px){.hader-hero{align-items:flex-start}.hader-hero-logo{width:58px;height:58px;border-radius:18px}.hader-hero-brand{gap:10px}}
