:root{--nav-w:256px;--surface:#ffffff;--canvas:#FCFAF6;--canvas-2:#F2EEE6;--ink:#181715;--muted:#746F68;--gold:#B39A6D;--gold-2:#E8DEC8;--burgundy:#7C193F;--burgundy-dark:#651331;--line:#D8D0C4;--radius:12px;--shadow-sm:0 1px 3px rgba(50,46,41,.05),0 4px 14px rgba(50,46,41,.03);--shadow-lg:0 18px 45px rgba(24,23,21,.12)}
html,body{background:var(--canvas);font-family:"IBM Plex Sans Arabic","Manrope",sans-serif;font-size:14px;line-height:1.65;-webkit-font-smoothing:antialiased}html[dir=ltr] body{font-family:"Manrope","IBM Plex Sans Arabic",sans-serif}body{overflow-x:hidden}.app-shell{display:block;min-height:100vh;direction:inherit}.sidebar{width:var(--nav-w);padding:24px 18px 20px;inset-block:0;inset-inline-start:0;left:auto;right:auto;direction:inherit;background:#322E29;box-shadow:0 0 40px rgba(18,16,14,.25)}.app-shell main{min-height:100vh;margin-inline-start:var(--nav-w);direction:inherit}.brand{padding:0 6px 20px;gap:12px;border-bottom:1px solid rgba(216,208,196,.12)}.brand-mark{width:40px;height:40px;border-radius:10px;background:#24211D;border:1px solid rgba(179,154,109,.4);box-shadow:0 4px 12px rgba(0,0,0,.2)}.brand-mark span{font:700 15px/1 "Manrope",sans-serif;letter-spacing:-1px}.brand strong{font:800 14px/1.3 "Manrope",sans-serif;letter-spacing:1.5px}.brand span{font-size:9px;color:var(--gold)}.sidebar nav{margin-top:16px;gap:3px}.sidebar nav a{min-height:40px;padding:9px 13px;border-radius:8px;font-size:12.5px;font-weight:500;color:#C8C2BA}.sidebar nav a:hover{color:#fff;background:rgba(255,255,255,.06)}.sidebar nav a.active{color:#fff;background:linear-gradient(90deg,rgba(124,25,63,.35),rgba(124,25,63,.12));box-shadow:inset 3px 0 var(--burgundy)}html[dir=rtl] .sidebar nav a.active{box-shadow:inset -3px 0 var(--burgundy)}.nav-icon{font-size:15px;color:var(--gold)}.sidebar nav a.active .nav-icon{color:#fff}.sidebar-card{border-radius:10px;padding:12px;background:#24211D;border:1px solid rgba(216,208,196,.15)}.sidebar-card b{font-size:11px}.sidebar-card small{font-size:9px;color:#A0978D}.topbar{height:72px;padding-inline:36px;justify-content:space-between;gap:16px;background:rgba(252,250,246,.94);border-bottom:1px solid var(--line);backdrop-filter:blur(16px)}.topbar-context{display:flex;flex-direction:column}.topbar-context span{font-size:9.5px;color:var(--muted);text-transform:uppercase;letter-spacing:1.2px}.topbar-context b{font-size:13px;color:var(--ink)}.topbar-actions{display:flex;align-items:center;gap:10px}.profile{background:transparent;border:0;border-inline-start:1px solid var(--line);padding-inline-start:14px;margin:0;cursor:pointer;text-align:inherit;color:inherit}.profile b{font-size:11px}.profile small{font-size:9px}.language,.icon-button{border-radius:8px;background:var(--surface);border:1px solid var(--line);color:var(--ink)}.language:hover,.icon-button:hover{border-color:var(--burgundy);background:var(--canvas-2);color:var(--burgundy)}.popover-anchor{position:relative}.header-popover{position:absolute;inset-block-start:46px;inset-inline-end:0;width:260px;padding:18px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow-lg);z-index:30}.header-popover b{font-size:13px}.header-popover p{margin:8px 0 0;color:var(--muted);font-size:11px}.content{padding:32px 36px 60px;max-width:1560px}.page-heading{align-items:center;margin-bottom:24px}.page-heading h1{font-size:26px;font-weight:700;line-height:1.3;margin:4px 0}.page-heading p{font-size:12.5px;line-height:1.65;color:var(--muted)}.eyebrow{font:800 9.5px/1.4 "Manrope",sans-serif;color:var(--burgundy);letter-spacing:1.8px}.primary-button,.btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:9px 18px;border-radius:8px;font-size:12px;font-weight:600;background:var(--burgundy);color:#fff!important;border:0;box-shadow:0 4px 14px rgba(124,25,63,.18)}.primary-button:hover,.btn-primary:hover{background:var(--burgundy-dark);transform:translateY(-1px);box-shadow:0 6px 18px rgba(101,19,49,.28)}.gold-button,.btn-gold{background:var(--gold);color:#fff;border:0;border-radius:8px;padding:9px 18px;font-size:12px;font-weight:600}.panel,.entity-card{border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);box-shadow:var(--shadow-sm)}.hero-card{border-radius:16px;min-height:300px;background:linear-gradient(135deg,#322E29 0%,#24211D 100%);box-shadow:var(--shadow-lg)}.hero-copy{padding:36px 40px}.hero-copy h2{font-size:30px;line-height:1.35}.hero-copy p{font-size:12px;line-height:1.8}.status-pill{font-size:10px}.text-link{font-size:11px;color:var(--gold)}.metrics{border-radius:12px;overflow:hidden;margin:20px 0;box-shadow:var(--shadow-sm);background:var(--line)}.metrics article{padding:20px;background:var(--surface)}.metrics span{font-size:11px;color:var(--muted)}.metrics strong{font-size:26px;color:var(--ink)}.metrics small{font-size:10px}.dashboard-grid{gap:20px}.panel{padding:24px}.panel-title h3{font-size:15px;color:var(--ink)}.panel-title p{font-size:11px}.panel-title a{font-size:11px;color:var(--burgundy)}.entity-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px}.entity-card{padding:22px}.entity-card:hover{transform:translateY(-2px);box-shadow:0 12px 36px rgba(50,46,41,.08);border-color:var(--gold)}.entity-card h3{font-size:16px}.entity-card>p{font-size:11.5px}.entity-meta{border-radius:8px;background:var(--canvas-2)}.entity-meta span,.entity-footer{font-size:10px}.entity-footer button,.setting-item button,.role-list button{font-size:11px;font-weight:600;color:var(--burgundy)}.table-panel{border-radius:12px}.table-panel th{font-size:11px;background:var(--canvas-2)}.table-panel td{font-size:12px}.person b{font-size:12px}.person small{font-size:10px}.search{border-radius:8px;background:var(--surface);border:1px solid var(--line)}.search input{font-size:12px}.role-layout{gap:20px}.role-list p{font-size:11px}.role-list span{font-size:10px;color:var(--gold)}.settings-grid{grid-template-columns:repeat(auto-fit,minmax(330px,1fr))}.setting-item{min-height:100px}.setting-item h3{font-size:14px}.setting-item p{font-size:11px}.modal-backdrop{z-index:1000}.employee-modal{border-radius:16px;box-shadow:var(--shadow-lg)}.form-grid label>span,.company-selector>span{font-size:11.5px;color:var(--ink)}.form-grid input,.form-grid select,.form-grid textarea{width:100%;min-height:40px;border:1px solid var(--line);border-radius:8px;background:#fff;padding:8px 12px;color:var(--ink);outline:none}.form-grid input:focus,.form-grid select:focus{border-color:var(--burgundy);box-shadow:0 0 0 3px var(--brand-burgundy-subtle)}
html[dir=rtl] .sidebar{right:0;left:auto}html[dir=ltr] .sidebar{left:0;right:auto}html[dir=rtl] .app-shell main,html[dir=ltr] .app-shell main{grid-column:auto;direction:inherit}html[dir=rtl] .table-panel th{text-align:right}html[dir=ltr] .table-panel th{text-align:left}html[dir=rtl] .profile,html[dir=ltr] .profile{border-right:0;margin:0}html[dir=rtl] .profile{border-left:0;border-right:1px solid var(--line);padding-right:15px;padding-left:0}html[dir=ltr] .profile{border-left:1px solid var(--line);padding-left:15px;padding-right:0}
@media(max-width:900px){:root{--nav-w:82px}.brand>div:last-child,.sidebar nav a>span:last-child,.nav-label,.sidebar-card>div{display:none}.brand{justify-content:center;padding-inline:0}.sidebar{padding-inline:12px}.sidebar nav a{justify-content:center}.nav-icon{width:auto}.sidebar-card{justify-content:center}.topbar-context{display:none}.content{padding:28px 24px}.hero-card{grid-template-columns:1fr}.hero-art{display:none}}
@media(max-width:640px){:root{--nav-w:0px}.app-shell main{margin-inline-start:0}.sidebar{position:fixed;inset:auto 0 0 0;width:100%;height:66px;padding:8px 12px;z-index:100}.brand,.sidebar-card,.nav-label{display:none}.sidebar nav{margin:0;display:grid;grid-template-columns:repeat(5,1fr);gap:4px}.sidebar nav a{padding:5px;min-height:50px;flex-direction:column;gap:1px;font-size:8px}.sidebar nav a>span:last-child{display:block}.nav-icon{font-size:15px}.topbar{height:64px;padding-inline:16px}.profile>div:not(.avatar),.profile>span{display:none}.content{padding:22px 15px 92px}.page-heading{align-items:flex-start;gap:14px}.page-heading h1{font-size:24px}.page-heading .primary-button{padding:9px 12px;white-space:nowrap}.hero-copy{padding:28px 24px}.hero-copy h2{font-size:29px}.metrics{grid-template-columns:1fr 1fr}.metrics article{padding:15px}.dashboard-grid{display:block}.dashboard-grid>.panel{margin-bottom:16px}.entity-grid,.settings-grid,.role-layout{grid-template-columns:1fr}.employee-modal{padding:22px}.table-panel{overflow:auto}.topbar-actions{margin-inline-start:auto}}

.page-visual{position:relative;min-height:150px;margin:-4px 0 22px;overflow:hidden;border-radius:16px;background-image:linear-gradient(90deg,rgba(12,21,32,.94),rgba(12,21,32,.5) 48%,rgba(12,21,32,.08)),url('images/corporate-trees.png');background-size:cover;background-position:center 52%;box-shadow:0 12px 34px rgba(20,28,38,.11)}.page-visual:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(7,14,23,.2))}.page-visual>div{position:absolute;z-index:1;inset-inline-start:28px;top:50%;display:flex;flex-direction:column;transform:translateY(-50%);color:#fff}.page-visual span{color:#d2ab62;font:700 9px/1.4 "Manrope",sans-serif;letter-spacing:1.8px}.page-visual strong{max-width:430px;margin-top:7px;font-size:20px;line-height:1.35}.people-visual{background-position:center 62%}.talent-visual{background-position:center 42%}@media(max-width:640px){.page-visual{min-height:120px;margin-bottom:17px;border-radius:13px}.page-visual>div{inset-inline-start:20px}.page-visual strong{font-size:16px}}

.sidebar-card{color:#e8ebef;text-decoration:none}.sidebar-card b{color:#fff;text-decoration:none}.sidebar-card:hover{border-color:rgba(183,146,79,.55);background:#252e3b;transform:translateY(-1px)}.sidebar-card:hover b{color:#d7b66f}.sidebar-card>span{text-decoration:none}
.user-menu-wrapper{position:relative;display:flex;align-items:center}.profile{width:44px;height:44px;padding:0!important;border:0!important;margin:0!important;border-radius:50%;display:grid;place-items:center;background:transparent;cursor:pointer}.profile:hover{background:#f4f1ea}.profile .avatar{width:38px;height:38px}.user-menu-backdrop{position:fixed;inset:0;z-index:40;background:transparent}.user-dropdown-menu{position:absolute;z-index:50;inset-block-start:calc(100% + 12px);inset-inline-end:0;width:320px;padding:8px;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 22px 60px rgba(16,24,35,.18);color:var(--ink);text-align:start}.user-dropdown-header{display:flex;align-items:center;gap:12px;padding:13px}.avatar.large{width:44px;height:44px;flex:none}.user-dropdown-info{min-width:0;display:flex;flex-direction:column}.user-dropdown-info strong{font-size:13px;line-height:1.35}.user-dropdown-info small{overflow:hidden;margin-top:2px;color:var(--muted);font-size:10px;white-space:nowrap;text-overflow:ellipsis}.user-role-badge{align-self:flex-start;margin-top:7px;padding:3px 7px;border-radius:20px;background:#f3eee3;color:#9b742e;font-size:8px;font-weight:700}.user-dropdown-divider{height:1px;margin:3px 8px;background:var(--line)}.user-dropdown-links{display:grid;gap:3px;padding:5px 0}.user-dropdown-item{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:10px;color:var(--ink);text-decoration:none}.user-dropdown-item:hover{background:#f7f5f0}.dropdown-icon{width:30px;height:30px;flex:none;display:grid;place-items:center;border-radius:8px;background:#f1ede4;color:var(--gold);font-size:14px}.dropdown-item-text{min-width:0}.dropdown-item-text b,.dropdown-item-text small{display:block}.dropdown-item-text b{font-size:11px}.dropdown-item-text small{margin-top:2px;color:var(--muted);font-size:9px}.user-dropdown-footer{padding:6px}.user-dropdown-footer form{margin:0}.logout-button{width:100%;display:flex;align-items:center;gap:10px;padding:10px 12px;border:0;border-radius:10px;background:transparent;color:#a3443d;font-size:11px;font-weight:700;cursor:pointer;text-align:start}.logout-button:hover{background:#fbefed}.logout-icon{width:30px;height:30px;display:grid;place-items:center;border-radius:8px;background:#fbefed;font-size:15px}@media(max-width:520px){.user-dropdown-menu{position:fixed;inset-inline:14px;inset-block-start:70px;width:auto}}