:root{
  --niceso:#ed1c24;
  --niceso-dark:#c90f17;
  --navy:#102238;
  --navy-2:#172f4c;
  --ink:#182436;
  --muted:#748297;
  --bg:#f5f7fb;
  --surface:#ffffff;
  --surface-2:#f8fafc;
  --border:#e4e9f1;
  --shadow-sm:0 1px 3px rgba(16,34,56,.06);
  --shadow-md:0 10px 30px rgba(16,34,56,.08);
  --shadow-lg:0 24px 70px rgba(16,34,56,.18);
  --radius:14px;
  --sidebar-w:280px;
  --topbar-h:72px;
}
*{box-sizing:border-box}
html{min-height:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;-webkit-font-smoothing:antialiased;line-height:1.5}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button,input,select,textarea{font:inherit}
.app-shell{min-height:100vh}

/* fallback utility system */
.container,.container-fluid{width:min(100%, 100% - 32px);margin-inline:auto}
.container{max-width:1140px}
.container-fluid{max-width:1700px}
.row{display:flex;flex-wrap:wrap;margin-inline:-8px}
.row>[class*="col"],.row>.col{padding-inline:8px;width:100%}
.col{flex:1 0 0}
.col-6{width:50%}
.col-12{width:100%}
.w-100{width:100%}.w-auto{width:auto}
.h-100{height:100%}
.d-none{display:none!important}.d-flex{display:flex!important}.d-inline-flex{display:inline-flex!important}.d-block{display:block!important}
.flex-grow-1{flex:1 1 auto}.flex-wrap{flex-wrap:wrap}.align-items-center{align-items:center}.align-items-start{align-items:flex-start}.align-items-end{align-items:flex-end}.justify-content-between{justify-content:space-between}.justify-content-center{justify-content:center}.text-center{text-align:center}.text-end{text-align:right}.text-dark{color:#1f2937!important}.small{font-size:.875em}
.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:1rem}
.g-2{gap:.5rem}.g-3{gap:1rem}
.m-auto{margin:auto}.mx-auto{margin-inline:auto}.ms-auto{margin-left:auto}.me-1{margin-right:.25rem}.me-2{margin-right:.5rem}.ms-1{margin-left:.25rem}.my-2{margin-block:.5rem}
.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:1rem}.mt-5{margin-top:3rem}
.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:1rem}.mb-4{margin-bottom:1.5rem}
.pb-3{padding-bottom:1rem}.p-3{padding:1rem}.py-4{padding-top:1.5rem;padding-bottom:1.5rem}.py-5{padding-top:3rem;padding-bottom:3rem}.px-3{padding-inline:1rem}.py-2{padding-block:.5rem}
.border{border:1px solid var(--border)!important}.border-2{border-width:2px!important}.border-bottom{border-bottom:1px solid var(--border)!important}.rounded{border-radius:12px!important}
.fade{transition:opacity .15s linear}.show{display:block}

/* responsive columns */
@media(min-width:768px){
  .col-md-3{width:25%}.col-md-4{width:33.333%}.col-md-5{width:41.666%}.col-md-6{width:50%}.col-md-8{width:66.666%}
  .d-md-none{display:none!important}.d-md-flex{display:flex!important}
}
@media(min-width:992px){
  .col-lg{flex:1 0 0}.col-lg-4{width:33.333%}.col-lg-5{width:41.666%}.col-lg-7{width:58.333%}.col-lg-8{width:66.666%}
  .d-lg-none{display:none!important}.d-lg-flex{display:flex!important}.ms-lg-auto{margin-left:auto}
}
@media(min-width:1200px){.d-xl-flex{display:flex!important}}
@media(min-width:576px){.d-sm-none{display:none!important}.d-sm-flex{display:flex!important}.d-sm-inline{display:inline!important}}

/* topbar + sidebar */
.topbar{height:var(--topbar-h);background:rgba(255,255,255,.96);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 24px;position:fixed;left:var(--sidebar-w);right:0;top:0;z-index:1020;backdrop-filter:blur(8px)}
.topbar-menu{width:42px;height:42px;border:1px solid var(--border);border-radius:11px;background:#fff;color:var(--ink);font-size:1.25rem;display:inline-flex;align-items:center;justify-content:center;margin-right:12px;cursor:pointer}
.topbar-title{display:flex;flex-direction:column;line-height:1.15;min-width:0}.topbar-title b{font-size:1.06rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topbar-kicker{font-size:.68rem;letter-spacing:.12em;font-weight:800;color:var(--niceso);margin-bottom:4px}.topbar-company{display:flex;align-items:center;gap:8px;color:#68778c;font-size:.88rem;padding-right:16px;border-right:1px solid var(--border)}
.user-menu{border:0;background:transparent;display:flex;align-items:center;gap:10px;padding:5px 7px;border-radius:12px;color:var(--ink);cursor:pointer}.user-menu:hover{background:#f5f7fa}.user-avatar{width:38px;height:38px;border-radius:11px;background:#fff1f2;color:var(--niceso);border:1px solid #ffd7d9;display:inline-flex;align-items:center;justify-content:center;font-weight:800}.user-meta{display:flex;flex-direction:column;align-items:flex-start;line-height:1.1}.user-meta b{font-size:.85rem;max-width:170px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-meta small{font-size:.67rem;color:var(--muted);margin-top:4px;letter-spacing:.04em}.user-chevron{font-size:.7rem;color:#8995a5}
.dropdown{position:relative}.dropdown-menu{position:absolute;top:calc(100% + 10px);right:0;display:none;min-width:210px;background:#fff;border:1px solid var(--border);border-radius:12px;padding:8px;box-shadow:var(--shadow-md);list-style:none;margin:0}.dropdown:hover .dropdown-menu,.dropdown:focus-within .dropdown-menu{display:block}.dropdown-menu-end{right:0;left:auto}.dropdown-item{display:block;padding:9px 12px;border-radius:10px;color:var(--ink)}.dropdown-item:hover{background:#f5f7fb}.dropdown-divider{height:1px;background:var(--border);border:0;margin:8px 0}.text-danger{color:#c62828!important}.text-secondary{color:var(--muted)!important}
.user-dropdown{min-width:210px;border-radius:12px;padding:8px}

.sidebar{position:fixed;left:0;top:0;bottom:0;width:var(--sidebar-w);background:linear-gradient(180deg,#102238 0%,#0d1c2e 100%);color:#fff;z-index:1040;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;box-shadow:8px 0 24px rgba(15,34,56,.08)}
.sidebar-brand{height:76px;display:flex;gap:12px;align-items:center;padding:14px 18px;border-bottom:1px solid rgba(255,255,255,.08);position:sticky;top:0;background:#102238;z-index:2}.sidebar-logo{width:46px;height:46px;object-fit:cover;border-radius:12px;box-shadow:0 4px 12px rgba(0,0,0,.18)}.sidebar-brand-copy{min-width:0}.sidebar-brand-copy b{display:block;font-size:.96rem;letter-spacing:.03em}.sidebar-brand-copy small{display:block;color:#98abc0;font-size:.72rem;margin-top:2px}.sidebar-close{margin-left:auto;border:0;background:rgba(255,255,255,.08);color:#fff;width:36px;height:36px;border-radius:10px;cursor:pointer}
.sidebar-user-card{margin:14px 14px 4px;padding:12px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.045);border-radius:13px;display:flex;align-items:center;gap:10px}.sidebar-user-icon{width:36px;height:36px;border-radius:10px;background:rgba(237,28,36,.16);color:#ff7a7f;display:flex;align-items:center;justify-content:center;font-size:1.1rem}.sidebar-user-card>div:last-child{min-width:0;display:flex;flex-direction:column}.sidebar-user-card small{font-size:.66rem;color:#8398ad}.sidebar-user-card b{font-size:.78rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px}.sidebar-user-card span{font-size:.61rem;color:#ff878b;font-weight:800;letter-spacing:.07em;margin-top:2px}
.sidebar-nav{padding:8px 12px 16px;flex:1}.sidebar-nav a{display:flex;align-items:center;gap:11px;color:#c7d1dd;text-decoration:none;padding:10px 11px;border-radius:9px;margin:2px 0;font-size:.86rem;transition:background .15s,color .15s,transform .15s}.sidebar-nav a i{width:21px;text-align:center;font-size:1.02rem;color:#8fa4b9}.sidebar-nav a:hover{background:rgba(255,255,255,.055);color:#fff}.sidebar-nav a.active{background:linear-gradient(90deg,rgba(237,28,36,.22),rgba(237,28,36,.08));color:#fff;box-shadow:inset 3px 0 0 var(--niceso)}.sidebar-nav a.active i{color:#ff676d}.nav-group{font-size:.64rem;text-transform:uppercase;letter-spacing:.11em;color:#637b94;margin:17px 10px 6px;font-weight:800}.sidebar-footer{margin:0 14px 14px;border-top:1px solid rgba(255,255,255,.07);padding:14px 3px 2px;color:#748aa0;font-size:.68rem;display:flex;align-items:center;gap:7px}.sidebar-backdrop{display:none}

/* Main app styles */
.content-wrap{margin-left:var(--sidebar-w);padding-top:var(--topbar-h)}.app-main{min-height:calc(100vh - var(--topbar-h))}.page-title{font-size:1.55rem;font-weight:760;margin:0;letter-spacing:-.02em}.section-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:20px}.small-muted{font-size:.83rem;color:var(--muted);margin-top:3px}
.card{border:1px solid var(--border);border-radius:14px;background:#fff;box-shadow:var(--shadow-sm);overflow:hidden}.card-header{background:#fff;border-bottom:1px solid var(--border);padding:1rem 1.15rem;font-weight:700}.card-body{padding:1rem 1.15rem}.metric{border:1px solid #e8edf4;box-shadow:0 5px 18px rgba(21,47,76,.045)}.metric .icon{font-size:1.45rem;width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:#f4f7fb;color:#315d8d}.kpi-number{font-size:1.9rem;font-weight:780;letter-spacing:-.03em}
.table-responsive{width:100%;overflow:auto}.table{width:100%;border-collapse:separate;border-spacing:0;margin-bottom:0;background:#fff}.table thead th{font-size:.72rem;text-transform:uppercase;letter-spacing:.045em;color:#64738a;background:#f8fafc;border-bottom:1px solid #e9edf3;white-space:nowrap}.table td,.table th{vertical-align:middle;padding:.78rem .75rem;border-bottom:1px solid #edf0f4;text-align:left}.table-sm td,.table-sm th{padding:.55rem .6rem}.table-hover tbody tr:hover{background:#fbfcfd}.table-borderless td,.table-borderless th{border:0}
.form-control,.form-select{display:block;width:100%;border:1px solid #dce3ec;border-radius:9px;min-height:42px;padding:.65rem .85rem;background:#fff;color:var(--ink)}textarea.form-control{min-height:110px;resize:vertical}.form-control:focus,.form-select:focus{outline:none;border-color:#f48a8e;box-shadow:0 0 0 .2rem rgba(237,28,36,.1)}.form-label,label{display:inline-block;font-size:.83rem;font-weight:650;color:#48586c;margin-bottom:.42rem}.form-check{display:flex;align-items:center;gap:.5rem}.form-check-input{width:1rem;height:1rem}.form-check-label{margin:0}.input-group{display:flex;align-items:stretch;width:100%}.input-group>.form-control,.input-group>.form-select{position:relative;flex:1 1 auto;min-width:0}.input-group-text{display:inline-flex;align-items:center;padding:.65rem .85rem;background:#fff;border:1px solid #dce3ec;color:#77879a}.hris-input-group .input-group-text{border-radius:10px 0 0 10px}.hris-input-group .form-control{border-left:0;border-radius:0}.hris-input-group .password-toggle{border:1px solid #dce3ec;border-left:0;background:#fff;color:#76869a;border-radius:0 10px 10px 0}.hris-input-group .password-toggle:hover{background:#f4f6f9;color:#34475c}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.35rem;padding:.68rem 1rem;border:1px solid transparent;border-radius:9px;font-weight:650;cursor:pointer;line-height:1.2;background:#fff;color:var(--ink)}.btn:hover{transform:translateY(-1px)}.btn-sm{padding:.45rem .72rem;font-size:.84rem;border-radius:8px}.btn-lg{padding:.9rem 1.15rem;font-size:1rem;border-radius:11px}.btn-primary{background:#243d5a;border-color:#243d5a;color:#fff}.btn-primary:hover{background:#172f4c;border-color:#172f4c;color:#fff}.btn-success{background:#218454;border-color:#218454;color:#fff}.btn-danger{background:#cf3c3c;border-color:#cf3c3c;color:#fff}.btn-outline-primary{background:#fff;border-color:#284b70;color:#284b70}.btn-outline-dark{background:#fff;border-color:#2f3945;color:#2f3945}.btn-outline-danger{background:#fff;border-color:#c44;color:#c44}.btn-outline-secondary{background:#fff;border-color:#d5dde6;color:#526274}.btn-niceso{background:var(--niceso);border-color:var(--niceso);color:#fff}.btn-niceso:hover,.btn-niceso:focus{background:var(--niceso-dark);border-color:var(--niceso-dark);color:#fff}.btn-close{margin-left:auto;background:transparent;border:0;cursor:pointer;opacity:.7;font-size:1rem}
.badge{display:inline-block;padding:.38em .62em;border-radius:999px;font-size:.74rem;font-weight:700}.bg-success,.text-bg-light{background:#eaf7ee!important;color:#207d46!important}.bg-danger{background:#fff0f0!important;color:#b4232a!important}.bg-warning{background:#fff6de!important;color:#89681a!important}.bg-secondary{background:#eef2f6!important;color:#5b6c7c!important}
.alert{position:relative;padding:1rem 1rem;border:1px solid transparent;border-radius:11px;margin-bottom:1rem}.alert-success{background:#edf8f1;border-color:#d6eddd;color:#246d42}.alert-danger{background:#fff0f0;border-color:#f2d4d6;color:#b4232a}.alert-warning{background:#fff7e4;border-color:#f4e2aa;color:#8a6715}.alert-info{background:#eef6ff;border-color:#d5e7fb;color:#1e5d9a}.alert-link{font-weight:700;text-decoration:underline}.alert-dismissible{padding-right:2.75rem}
.list-group{display:flex;flex-direction:column;padding-left:0;margin-bottom:0;border:1px solid var(--border);border-radius:12px;overflow:hidden}.list-group-flush{border-radius:0;border-width:0}.list-group-item{display:block;padding:.85rem 1rem;background:#fff;border-bottom:1px solid var(--border)}.list-group-item:last-child{border-bottom:0}
.modal{position:fixed;inset:0;display:none;overflow-y:auto;background:rgba(15,26,40,.48);padding:1.25rem;z-index:1055}.modal.show{display:block}.modal-dialog{position:relative;max-width:720px;margin:2rem auto}.modal-lg{max-width:980px}.modal-content{border:0;border-radius:16px;background:#fff;box-shadow:var(--shadow-lg)}.modal-header,.modal-footer{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.15rem;border-bottom:1px solid var(--border)}.modal-footer{border-bottom:0;border-top:1px solid var(--border)}.modal-body{padding:1rem 1.15rem}.modal-title{margin:0;font-size:1.08rem;font-weight:760}
.print-letter{background:#fff;max-width:850px;margin:auto;padding:54px;color:#111}

/* HRIS login */
.hris-login-page{background:#edf1f6;min-height:100vh}.hris-login-shell{min-height:100vh;display:grid;grid-template-columns:minmax(410px,46%) 1fr}.hris-login-brand{background:linear-gradient(145deg,#0f2239 0%,#132d49 68%,#0d1c2f 100%);color:#fff;padding:42px clamp(38px,5vw,76px);display:flex;flex-direction:column;position:relative;overflow:hidden}.hris-login-brand:before{content:"";position:absolute;width:380px;height:380px;border-radius:50%;right:-150px;top:-130px;background:rgba(237,28,36,.12)}.hris-login-brand:after{content:"";position:absolute;width:240px;height:240px;border-radius:50%;left:-110px;bottom:90px;border:45px solid rgba(255,255,255,.03)}.login-brand-top{display:flex;align-items:center;gap:15px;position:relative;z-index:1}.login-logo{width:58px;height:58px;object-fit:cover;border-radius:14px;box-shadow:0 10px 28px rgba(0,0,0,.22)}.login-brand-name{font-weight:850;font-size:1.17rem;letter-spacing:.06em}.login-brand-sub{font-size:.76rem;color:#a9bacb;margin-top:2px}.login-brand-copy{margin:auto 0;position:relative;z-index:1;max-width:610px}.login-eyebrow{display:inline-block;font-size:.68rem;font-weight:800;letter-spacing:.14em;color:#ff858a;margin-bottom:18px}.login-brand-copy h1{font-size:clamp(2.2rem,4.3vw,4.2rem);line-height:1.04;letter-spacing:-.045em;font-weight:780;margin:0 0 22px}.login-brand-copy p{font-size:1rem;line-height:1.75;color:#b7c4d1;max-width:560px;margin:0}.login-feature-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:34px;max-width:520px}.login-feature-grid div{border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.045);border-radius:11px;padding:12px 14px;display:flex;align-items:center;gap:10px;color:#d7e0e9;font-size:.82rem}.login-feature-grid i{color:#ff777c;font-size:1.08rem}.login-brand-footer{position:relative;z-index:1;font-size:.67rem;color:#71869b;letter-spacing:.12em;font-weight:700}
.hris-login-form-wrap{background:#f8fafc;display:flex;align-items:center;justify-content:center;padding:40px}.hris-login-form-panel{width:100%;max-width:470px}.login-heading{margin-bottom:28px}.login-pill{display:inline-flex;align-items:center;gap:6px;background:#eef3f8;color:#53677e;border:1px solid #e1e7ee;padding:6px 9px;border-radius:999px;font-size:.7rem;font-weight:750;margin-bottom:16px}.login-heading h2{font-size:2rem;font-weight:780;letter-spacing:-.035em;margin:0 0 7px}.login-heading p{color:var(--muted);margin:0}.login-form .form-label{font-size:.82rem}.login-security-note{margin-top:24px;padding:14px;border-top:1px solid var(--border);display:flex;gap:10px;color:#7d8998;font-size:.74rem;line-height:1.55}.login-security-note i{color:#53708d;font-size:1rem}.mobile-brand{display:none;align-items:center;gap:10px;margin-bottom:28px}.mobile-brand img{width:44px;height:44px;border-radius:10px}.mobile-brand div{display:flex;flex-direction:column}.mobile-brand b{font-size:.92rem}.mobile-brand small{font-size:.68rem;color:var(--muted)}

/* setup page */
.setup-page{min-height:100vh;background:linear-gradient(180deg,#eef2f7 0%,#f6f9fc 100%)}.setup-card{max-width:920px;background:#fff;border:1px solid var(--border);border-radius:18px;padding:30px;box-shadow:0 18px 50px rgba(16,34,56,.08)}.setup-brand{display:flex;align-items:center;gap:14px;margin-bottom:26px}.setup-brand img{width:78px;height:78px;border-radius:18px;object-fit:cover;box-shadow:0 8px 20px rgba(237,28,36,.15)}.setup-brand h1{font-size:1.65rem;margin:0;font-weight:800;letter-spacing:-.02em}.setup-brand p{margin:4px 0 0;color:var(--muted);font-size:.86rem}.setup-status-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:22px 0}.setup-status{border:1px solid var(--border);border-radius:14px;padding:16px;display:flex;align-items:center;gap:12px;min-height:88px}.setup-status>i{font-size:1.35rem}.setup-status div{display:flex;flex-direction:column}.setup-status b{font-size:.85rem}.setup-status span{font-size:.74rem;color:var(--muted)}.setup-status.ok{background:#f4fbf7;border-color:#d9efe0;color:#207d46}.setup-status.wait{background:#fffaf0;border-color:#f3e7c5;color:#8a6b1a}.setup-status.bad{background:#fff4f4;border-color:#f4d6d8;color:#b4232a}.setup-section{margin-top:20px;border-top:1px solid var(--border);padding-top:24px;display:flex;gap:14px;align-items:flex-start}.step-number{flex:0 0 38px;width:38px;height:38px;border-radius:12px;background:#fff1f2;color:var(--niceso);display:flex;align-items:center;justify-content:center;font-weight:850}.setup-section h2,.setup-complete h2{font-size:1.16rem;font-weight:780;margin:2px 0 6px}.setup-section p,.setup-complete p{color:var(--muted);font-size:.9rem;line-height:1.65}.setup-complete{margin-top:22px;border-top:1px solid var(--border);padding-top:24px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}.setup-complete-icon{width:48px;height:48px;border-radius:14px;background:#eaf8ef;color:#23894c;display:flex;align-items:center;justify-content:center;font-size:1.3rem}.setup-note{margin-top:24px;padding:13px 14px;border-radius:10px;background:#f7f9fc;color:#69798e;font-size:.79rem;display:flex;gap:9px;align-items:flex-start}


/* Responsive / collapsible sidebar */
:root{--sidebar-collapsed-w:82px}
.topbar,.content-wrap,.sidebar{transition:left .2s ease,margin-left .2s ease,width .2s ease,transform .22s ease}
.sidebar-nav a{min-height:42px;position:relative}
.topbar-menu{flex:0 0 42px;transition:background .15s ease,border-color .15s ease}
.topbar-menu:hover{background:#f7f9fc;border-color:#d7dee8}

@media(min-width:992px){
  body.sidebar-collapsed .sidebar{width:var(--sidebar-collapsed-w)}
  body.sidebar-collapsed .topbar{left:var(--sidebar-collapsed-w)}
  body.sidebar-collapsed .content-wrap{margin-left:var(--sidebar-collapsed-w)}
  body.sidebar-collapsed .sidebar-brand{padding:14px 12px;justify-content:center;gap:0}
  body.sidebar-collapsed .sidebar-logo{width:44px;height:44px}
  body.sidebar-collapsed .sidebar-brand-copy,
  body.sidebar-collapsed .sidebar-user-card>div:last-child,
  body.sidebar-collapsed .sidebar-nav a span,
  body.sidebar-collapsed .sidebar-footer span{display:none!important}
  body.sidebar-collapsed .sidebar-user-card{margin:12px 10px 4px;padding:10px;justify-content:center}
  body.sidebar-collapsed .sidebar-user-icon{width:40px;height:40px;flex:0 0 40px}
  body.sidebar-collapsed .sidebar-nav{padding:8px 10px 16px}
  body.sidebar-collapsed .sidebar-nav a{padding:10px;justify-content:center;gap:0;border-radius:10px}
  body.sidebar-collapsed .sidebar-nav a i{width:auto;font-size:1.15rem}
  body.sidebar-collapsed .sidebar-nav a.active{box-shadow:inset 3px 0 0 var(--niceso);background:rgba(237,28,36,.18)}
  body.sidebar-collapsed .nav-group{height:1px;margin:14px 9px 9px;background:rgba(255,255,255,.09);font-size:0;color:transparent;overflow:hidden}
  body.sidebar-collapsed .sidebar-footer{justify-content:center;margin:0 10px 12px;padding:12px 0 2px}
  body.sidebar-collapsed .sidebar-footer i{font-size:1.05rem}
  body.sidebar-collapsed .sidebar-nav a:hover::after{content:attr(title);position:fixed;left:calc(var(--sidebar-collapsed-w) + 10px);z-index:1100;background:#0d1c2e;color:#fff;padding:7px 10px;border-radius:8px;font-size:.76rem;font-weight:650;white-space:nowrap;box-shadow:0 8px 24px rgba(0,0,0,.18);pointer-events:none}
}

@media(max-width:991.98px){
  :root{--topbar-h:64px}
  body.sidebar-drawer-open{overflow:hidden}
  .sidebar{width:min(86vw,320px);max-width:320px;transform:translateX(-104%);transition:transform .22s ease;box-shadow:14px 0 38px rgba(6,18,32,.28)}
  .sidebar.show{transform:translateX(0)}
  .sidebar-brand{height:68px;padding:10px 14px}.sidebar-logo{width:42px;height:42px}.sidebar-brand-copy b{font-size:.91rem}.sidebar-brand-copy small{font-size:.68rem}
  .sidebar-close{display:inline-flex!important;align-items:center;justify-content:center;flex:0 0 38px;width:38px;height:38px}
  .sidebar-user-card{margin:10px 12px 2px;padding:10px}.sidebar-nav{padding:6px 10px 14px}.sidebar-nav a{min-height:44px;padding:10px 11px;font-size:.84rem}.nav-group{margin:15px 10px 5px}.sidebar-footer{margin:0 12px 12px}
  .topbar{left:0;padding:0 12px}.topbar-menu{width:40px;height:40px;flex-basis:40px;margin-right:10px}.content-wrap{margin-left:0}
  .sidebar-backdrop{position:fixed;inset:0;background:rgba(7,19,32,.54);z-index:1035;backdrop-filter:blur(2px)}.sidebar-backdrop.show{display:block}
  .hris-login-shell{grid-template-columns:1fr}.hris-login-brand{display:none}.hris-login-form-wrap{min-height:100vh}.mobile-brand{display:flex!important}
}
@media(max-width:575.98px){
  .container,.container-fluid{width:min(100%, 100% - 24px)}
  .hris-login-form-wrap{padding:24px 18px}.hris-login-form-panel{max-width:none}.login-heading h2{font-size:1.65rem}.setup-card{padding:20px;border-radius:14px}.setup-status-grid{grid-template-columns:1fr}.setup-section,.setup-complete{flex-wrap:wrap}.setup-complete .btn{width:100%;margin-left:0!important}.section-head{align-items:flex-start;flex-direction:column}.section-head>.btn,.section-head>.d-flex{width:100%}.section-head>.btn{display:block}.topbar-title b{font-size:.94rem}.topbar-kicker{font-size:.61rem}
}

@media(max-width:575.98px){
  .sidebar{width:min(91vw,304px)}
  .sidebar-nav a{font-size:.82rem}
  .sidebar-user-card b{max-width:180px}
}
@media print{.sidebar,.topbar,.no-print,.sidebar-backdrop{display:none!important}.content-wrap{margin:0;padding:0}body{background:#fff}.print-letter{max-width:none;padding:0}.card{border:0;box-shadow:none}.container-fluid{padding:0!important}}

/* Data tools: filter, export, pagination, upload */
.table-tools{margin:0 0 14px;padding:14px;border:1px solid var(--border);border-radius:14px;background:linear-gradient(180deg,#fff,#fbfcfe);box-shadow:0 3px 12px rgba(16,34,56,.035)}
.table-tools-main{display:grid;grid-template-columns:minmax(210px,1.5fr) minmax(150px,.8fr) minmax(150px,.9fr) repeat(2,minmax(135px,.65fr)) minmax(90px,.4fr);gap:10px;align-items:end}
.table-tools-main .tool-date:only-of-type{display:none}.tool-field{min-width:0}.tool-field label{display:block;margin:0 0 5px;font-size:.69rem;font-weight:800;color:#65758a;text-transform:uppercase;letter-spacing:.055em}.tool-control,.tool-select,.tool-input{height:40px;width:100%;border:1px solid #dce3ec;border-radius:9px;background:#fff;color:var(--ink)}.tool-control,.tool-select{padding:0 10px}.tool-input{display:flex;align-items:center;overflow:hidden}.tool-input span{padding-left:11px;color:#8795a5;font-size:1.1rem}.tool-input input{border:0;outline:0;width:100%;height:100%;padding:0 10px;background:transparent;min-width:0}.tool-control:focus,.tool-select:focus,.tool-input:focus-within{outline:none;border-color:#ee8a8e;box-shadow:0 0 0 3px rgba(237,28,36,.08)}
.table-tools-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:11px;padding-top:11px;border-top:1px dashed #e3e8ef}.tool-btn{min-height:38px;display:inline-flex;align-items:center;justify-content:center;padding:0 12px;border:1px solid #243d5a;border-radius:9px;background:#243d5a;color:#fff!important;font-size:.78rem;font-weight:750;cursor:pointer;text-decoration:none;white-space:nowrap}.tool-btn:hover{filter:brightness(.96)}.tool-btn.secondary{background:#fff;border-color:#d7dfe8;color:#4b5c70!important}.tool-btn.upload{background:var(--niceso);border-color:var(--niceso);margin-left:auto}.tool-btn:disabled{opacity:.45;cursor:not-allowed;filter:none}
.table-pager{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:13px;padding:11px 2px 0;border-top:1px solid #edf0f4}.table-count{font-size:.78rem;color:var(--muted);font-weight:600}.pager-actions{display:flex;align-items:center;gap:8px}.page-info{font-size:.76rem;color:#5d6e81;min-width:95px;text-align:center;font-weight:700}.sortable-head{cursor:pointer;user-select:none;padding-right:24px!important;position:relative}.sortable-head:after{content:'↕';position:absolute;right:8px;color:#aab4bf;font-size:.72rem}.sortable-head[data-sort="asc"]:after{content:'↑';color:var(--niceso)}.sortable-head[data-sort="desc"]:after{content:'↓';color:var(--niceso)}
.table-empty-result tbody:after{content:'Tidak ada data sesuai filter';display:block;padding:22px;color:var(--muted);font-size:.85rem}

/* Import / preview workspace */
.import-page{background:#f4f7fb;min-height:100vh}.import-shell{min-height:100vh}.import-head{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:20px;padding:16px 0}.import-logo{width:58px;height:58px;object-fit:cover;border-radius:14px;box-shadow:0 7px 20px rgba(237,28,36,.14)}.import-section-title{font-size:1rem;font-weight:800;margin:0 0 5px}.import-fields{display:flex;flex-wrap:wrap;gap:6px}.import-fields span{display:inline-flex;align-items:center;gap:2px;background:#f5f7fa;border:1px solid #e3e8ef;border-radius:999px;padding:5px 8px;font-size:.7rem;color:#5b6d80}.import-fields em{font-style:normal;color:var(--niceso);font-weight:900}.import-invalid{background:#fff8f8!important}.import-invalid td{border-color:#f5dfdf!important}.import-page .card-header{padding:14px 16px}.import-page .table-tools{margin-top:0}.import-page .table-responsive{max-height:none}

@media(max-width:1250px){.table-tools-main{grid-template-columns:repeat(3,minmax(0,1fr))}.tool-search{grid-column:span 2}.tool-btn.upload{margin-left:0}}
@media(max-width:767.98px){.table-tools-main{grid-template-columns:1fr 1fr}.tool-search{grid-column:1/-1}.column-value-wrap{grid-column:span 1}.table-tools-actions{display:grid;grid-template-columns:1fr 1fr}.tool-btn.upload{margin-left:0}.table-pager{align-items:flex-start;flex-direction:column}.pager-actions{width:100%;justify-content:space-between}.import-head{align-items:flex-start;flex-direction:column}.import-head>.btn{width:100%}}
@media(max-width:480px){.table-tools-main{grid-template-columns:1fr}.tool-search,.column-value-wrap{grid-column:auto}.table-tools-actions{grid-template-columns:1fr}.tool-btn{width:100%}.page-info{min-width:75px}.pager-actions .tool-btn{width:auto}.import-logo{width:50px;height:50px}}

/* Attendance camera + verification */
.attendance-capture-card{overflow:visible}.attendance-camera-stage{position:relative;overflow:hidden;border-radius:16px;background:#0c1726;aspect-ratio:4/3;min-height:280px;border:1px solid #21344b}.attendance-camera-stage video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1);background:#0b1522}.camera-placeholder{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:28px;color:#dce5ef;background:radial-gradient(circle at 50% 30%,#1b3552 0,#0c1726 72%)}.camera-placeholder i{font-size:2.2rem;color:#ff6f75;margin-bottom:10px}.camera-placeholder b{font-size:1rem}.camera-placeholder span{font-size:.78rem;color:#9eb0c4;max-width:320px;margin-top:5px}.camera-badge{position:absolute;top:12px;left:12px;display:flex;align-items:center;gap:6px;padding:7px 10px;border-radius:999px;background:rgba(7,18,32,.72);color:#fff;font-size:.72rem;font-weight:750;backdrop-filter:blur(5px)}
.attendance-controls{display:flex;gap:8px;flex-wrap:wrap}.captured-photo-wrap{margin-top:12px;padding:10px;border:1px solid #dfe6ee;border-radius:12px;background:#f8fafc;display:flex;gap:12px;align-items:center}.captured-photo-wrap[hidden]{display:none!important}.captured-photo-wrap img{width:82px;height:82px;object-fit:cover;border-radius:10px;transform:scaleX(1)}.captured-photo-wrap div{display:flex;flex-direction:column}.captured-photo-wrap b{font-size:.84rem}.captured-photo-wrap span{font-size:.72rem;color:var(--muted);margin-top:3px}
.attendance-location-box{display:flex;align-items:flex-start;gap:10px;padding:12px;border:1px solid #dfe6ee;border-radius:12px;background:#fbfcfe}.attendance-location-icon{width:38px;height:38px;border-radius:10px;background:#eef5ff;color:#315f93;display:flex;align-items:center;justify-content:center;flex:0 0 38px}.attendance-location-box b{font-size:.82rem}.attendance-address{font-size:.73rem;color:#485b70;margin-top:4px;line-height:1.45;word-break:break-word}.attendance-requirements{display:flex;gap:8px;flex-wrap:wrap}.attendance-requirements span{display:inline-flex;align-items:center;gap:5px;padding:6px 9px;border-radius:999px;background:#f1f4f7;color:#7a8898;font-size:.71rem;font-weight:700}.attendance-requirements span.ok{background:#eaf8ef;color:#267649}.attendance-today{padding:10px 12px;border-radius:11px;background:#f7f9fc;border:1px solid #e7ebf0}.attendance-today>b{font-size:.78rem}.attendance-today>div{display:flex;gap:18px;margin-top:4px;font-size:.75rem;color:#596a7c}
.attendance-policy-list{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.attendance-policy-list>div{display:flex;gap:10px;align-items:flex-start;padding:11px;border:1px solid #e5eaf0;border-radius:11px;background:#fbfcfd}.attendance-policy-list i{width:34px;height:34px;flex:0 0 34px;border-radius:9px;background:#fff1f2;color:var(--niceso);display:flex;align-items:center;justify-content:center}.attendance-policy-list span{display:flex;flex-direction:column}.attendance-policy-list b{font-size:.78rem}.attendance-policy-list small{font-size:.69rem;color:var(--muted);margin-top:2px;line-height:1.4}
.attendance-thumb{display:inline-flex;align-items:center;gap:6px;font-size:.7rem;font-weight:700;color:#315d8d}.attendance-thumb img{width:44px;height:44px;border-radius:8px;object-fit:cover;border:1px solid #dfe6ee}.attendance-location-cell{min-width:260px;max-width:360px;font-size:.72rem;line-height:1.45}.attendance-location-cell div+div{margin-top:5px}.attendance-location-cell b{color:#35495e;margin-right:4px}
.attendance-confirm-grid{display:grid;grid-template-columns:minmax(260px,.9fr) minmax(280px,1.1fr);gap:18px}.attendance-confirm-photo{background:#0d1827;border-radius:14px;overflow:hidden;min-height:270px;display:flex;align-items:center;justify-content:center}.attendance-confirm-photo img{width:100%;height:100%;object-fit:contain}.attendance-confirm-info{display:flex;flex-direction:column;border:1px solid #e4e9ef;border-radius:14px;overflow:hidden}.attendance-confirm-info>div{padding:11px 13px;border-bottom:1px solid #edf0f3;display:flex;flex-direction:column;gap:3px}.attendance-confirm-info>div:last-child{border-bottom:0}.attendance-confirm-info span{font-size:.68rem;text-transform:uppercase;letter-spacing:.06em;color:#8290a0;font-weight:800}.attendance-confirm-info b{font-size:.83rem;line-height:1.45;word-break:break-word}.attendance-confirm-warning{margin-top:14px;padding:11px 13px;border-radius:10px;background:#f5f8fb;color:#5b6c7f;font-size:.76rem;display:flex;gap:8px;align-items:flex-start}.attendance-confirm-warning i{color:#376891}.attendance-submit-choice:disabled,.attendance-controls .btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.spinner-border{display:inline-block;width:1rem;height:1rem;border:.16em solid currentColor;border-right-color:transparent;border-radius:50%;animation:hris-spin .75s linear infinite}.spinner-border-sm{width:.85rem;height:.85rem;border-width:.13em}@keyframes hris-spin{to{transform:rotate(360deg)}}
.page-data-actions{margin-left:auto}

@media(max-width:767.98px){.attendance-policy-list{grid-template-columns:1fr}.attendance-confirm-grid{grid-template-columns:1fr}.attendance-camera-stage{min-height:230px}.attendance-controls .btn{flex:1 1 46%}.attendance-location-box{flex-wrap:wrap}.attendance-location-box .btn{width:100%}.attendance-confirm-photo{min-height:220px}.attendance-location-cell{min-width:220px}.page-data-actions{width:100%;margin-left:0}.page-data-actions .btn{flex:1}}
.camera-placeholder[hidden]{display:none!important}

/* Employee self-service dashboard */
.employee-hero{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:26px 28px;border-radius:20px;background:linear-gradient(135deg,#102238 0%,#183a60 72%,#223f61 100%);color:#fff;position:relative;overflow:hidden;box-shadow:0 14px 34px rgba(16,34,56,.16)}
.employee-hero:after{content:"";position:absolute;width:220px;height:220px;border-radius:50%;right:-80px;top:-110px;background:rgba(237,28,36,.18)}.employee-hero-copy{position:relative;z-index:1}.employee-eyebrow{font-size:.68rem;font-weight:850;letter-spacing:.14em;color:#ff8d92;margin-bottom:8px}.employee-hero h1{margin:0 0 5px;font-size:clamp(1.65rem,3vw,2.35rem);letter-spacing:-.03em}.employee-hero p{margin:0;color:#b9c7d5;font-size:.9rem}.employee-hero-status{position:relative;z-index:1;min-width:235px;padding:15px 17px;border-radius:14px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.08);backdrop-filter:blur(8px);display:flex;flex-direction:column}.employee-hero-status span{font-size:.66rem;text-transform:uppercase;letter-spacing:.08em;color:#9fb0c1;font-weight:800}.employee-hero-status b{font-size:1rem;margin:4px 0}.employee-hero-status small{font-size:.72rem;color:#c5d1dc}.employee-hero-status.done{box-shadow:inset 3px 0 0 #55c680}.employee-hero-status.active{box-shadow:inset 3px 0 0 #54a8ff}.employee-hero-status.wait{box-shadow:inset 3px 0 0 #f3b851}
.employee-quick-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.employee-quick{display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:11px;background:#fff;border:1px solid var(--border);border-radius:14px;padding:14px 15px;box-shadow:var(--shadow-sm);transition:transform .15s ease,border-color .15s ease}.employee-quick:hover{transform:translateY(-2px);border-color:#cad5e1}.employee-quick>i:first-child{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:#f1f5f9;color:#365e89;font-size:1.1rem}.employee-quick.primary>i:first-child{background:#fff0f1;color:var(--niceso)}.employee-quick div{min-width:0;display:flex;flex-direction:column}.employee-quick b{font-size:.82rem}.employee-quick span{font-size:.69rem;color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.employee-quick>i:last-child{color:#9aa6b3;font-size:.75rem}.metric-foot{display:block;color:#8a97a5;margin-top:3px;font-size:.67rem}
.employee-schedule-main{display:flex;align-items:center;gap:16px}.employee-date-box{width:64px;height:70px;border-radius:15px;background:#fff1f2;color:var(--niceso);display:flex;flex-direction:column;align-items:center;justify-content:center;flex:0 0 64px}.employee-date-box b{font-size:1.45rem;line-height:1}.employee-date-box span{font-size:.68rem;text-transform:uppercase;margin-top:4px;font-weight:800}.employee-schedule-main h3{margin:8px 0 2px;font-size:1.24rem}.employee-schedule-main p{margin:0;color:var(--muted);font-size:.76rem}.employee-attendance-times{display:grid;grid-template-columns:1fr 1fr;gap:10px}.employee-attendance-times>div{padding:12px;border-radius:12px;background:#f8fafc;border:1px solid #e8edf3;display:flex;flex-direction:column}.employee-attendance-times span{font-size:.67rem;color:var(--muted);text-transform:uppercase;font-weight:800;letter-spacing:.05em}.employee-attendance-times b{font-size:1.05rem;margin-top:3px}
.employee-upcoming-list{display:grid;grid-template-columns:1fr 1fr;gap:9px}.employee-upcoming-item{display:grid;grid-template-columns:58px 1fr;gap:10px;align-items:center;padding:10px;border:1px solid #e8edf3;border-radius:12px}.employee-upcoming-item>div:first-child{display:flex;flex-direction:column;align-items:center;border-right:1px solid #edf0f4}.employee-upcoming-item>div:first-child b{font-size:.85rem}.employee-upcoming-item>div:first-child span{font-size:.64rem;color:var(--muted)}.employee-upcoming-item>div:last-child{display:flex;flex-direction:column}.employee-upcoming-item strong{font-size:.78rem}.employee-upcoming-item>div:last-child span{font-size:.68rem;color:var(--muted);margin-top:2px}
.employee-request-row,.employee-warning-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid #edf0f4}.employee-request-row:last-child,.employee-warning-row:last-child{border-bottom:0}.employee-request-row>div,.employee-warning-row>div{display:flex;flex-direction:column;min-width:0}.employee-request-row b,.employee-warning-row b{font-size:.8rem}.employee-request-row span,.employee-warning-row span{font-size:.7rem;color:var(--muted);margin-top:2px}.employee-profile-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.employee-profile-grid>div{padding:11px 12px;border-radius:11px;background:#f8fafc;border:1px solid #e9edf3;display:flex;flex-direction:column}.employee-profile-grid span{font-size:.66rem;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-weight:800}.employee-profile-grid b{font-size:.8rem;margin-top:3px}.employee-warning-card{border-color:#f0dfaa}.empty-state-inline{display:flex;align-items:center;gap:12px;color:#6d7d90}.empty-state-inline>i{width:40px;height:40px;border-radius:11px;background:#f2f5f8;display:flex;align-items:center;justify-content:center;color:#7e90a3}.empty-state-inline>div{display:flex;flex-direction:column}.empty-state-inline b{font-size:.82rem}.empty-state-inline span{font-size:.72rem;color:var(--muted);margin-top:2px}

/* Attendance capture page + standalone report */
.attendance-status-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.attendance-status-strip>div{background:#fff;border:1px solid var(--border);border-radius:12px;padding:12px 14px;display:flex;flex-direction:column}.attendance-status-strip span{font-size:.66rem;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-weight:800}.attendance-status-strip b{font-size:.9rem;margin-top:3px}.attendance-primary-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.attendance-primary-actions .btn{min-height:48px}.attendance-report-table .attendance-location-cell span{display:block;margin-top:2px;color:#5f7083}.attendance-report-table td{vertical-align:top}

@media(max-width:1100px){.employee-quick-grid{grid-template-columns:1fr 1fr}.employee-upcoming-list{grid-template-columns:1fr}}
@media(max-width:767.98px){.employee-hero{align-items:flex-start;flex-direction:column;padding:22px 20px}.employee-hero-status{width:100%;min-width:0}.employee-quick-grid{grid-template-columns:1fr}.employee-profile-grid,.employee-attendance-times{grid-template-columns:1fr 1fr}.attendance-status-strip{grid-template-columns:1fr 1fr}.attendance-primary-actions{grid-template-columns:1fr}.attendance-primary-actions .btn{width:100%}}
@media(max-width:430px){.employee-profile-grid{grid-template-columns:1fr}.attendance-status-strip{grid-template-columns:1fr 1fr}.employee-hero h1{font-size:1.55rem}}

.branch-map-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px}.branch-map-item{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--border);border-radius:12px;padding:11px 12px;background:#fff;cursor:pointer}.branch-map-item:hover{border-color:#cbd5e1;background:#f8fafc}.branch-map-item input{margin-top:4px}.branch-map-item span{display:flex;flex-direction:column;min-width:0}.branch-map-item b{font-size:.84rem}.branch-map-item small{font-size:.7rem;color:var(--muted)}.branch-map-grid.map-disabled{opacity:.45;pointer-events:none}hr{border:0;border-top:1px solid var(--border);margin:8px 0}

.branch-map-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;flex-wrap:wrap}.branch-map-search-wrap{max-width:360px;flex:1 1 260px}.branch-selected-count{display:inline-flex;align-items:center;color:var(--muted);font-size:.8rem;font-weight:700;white-space:nowrap}.branch-map-item[hidden]{display:none!important}

/* =========================================================
   Compact Professional HRIS UI v7
   Form, modal, table and filter density improvements
   ========================================================= */
:root{
  --compact-control-h:36px;
  --compact-radius:8px;
}

/* tighter page rhythm */
.app-main>.container-fluid{padding-top:18px!important;padding-bottom:18px!important}
.section-head{margin-bottom:14px;gap:10px}
.page-title{font-size:1.38rem;line-height:1.2}
.small-muted{font-size:.76rem;margin-top:2px;line-height:1.4}
.card{border-radius:12px}
.card-header{padding:.72rem .9rem;font-size:.88rem}
.card-body{padding:.82rem .9rem}

/* fix form grid density while keeping Bootstrap column widths intact */
.row{margin-inline:-5px}
.row>[class*="col"],.row>.col{padding-inline:5px}
.row.g-2,.row.g-3{gap:0;row-gap:.55rem;--bs-gutter-x:.625rem;--bs-gutter-y:.55rem}
.modal-body .row.g-3,.modal-body .row.g-2,.card-body form .row.g-3,.card-body form .row.g-2{row-gap:.5rem}

/* compact controls */
.form-label,label{font-size:.75rem;font-weight:700;margin-bottom:.25rem;line-height:1.25;color:#425267}
.form-control,.form-select{
  min-height:var(--compact-control-h);
  height:var(--compact-control-h);
  padding:.38rem .62rem;
  border-radius:var(--compact-radius);
  font-size:.81rem;
  line-height:1.25;
}
textarea.form-control{height:auto;min-height:68px;padding-top:.5rem;padding-bottom:.5rem;line-height:1.45}
input[type="file"].form-control{height:auto;min-height:36px;padding:.33rem .55rem}
.form-control-sm,.form-select-sm{min-height:31px;height:31px;padding:.25rem .5rem;font-size:.76rem}
.input-group-text{min-height:var(--compact-control-h);padding:.38rem .6rem;font-size:.8rem}
.form-check{gap:.4rem;min-height:28px}
.form-check-input{width:.95rem;height:.95rem;margin-top:0}
.form-check-label{font-size:.76rem;line-height:1.35}

/* compact buttons - special attendance controls keep their explicit min-height */
.btn{padding:.5rem .75rem;border-radius:8px;font-size:.8rem;line-height:1.15;min-height:34px}
.btn-sm{padding:.34rem .55rem;font-size:.73rem;min-height:29px;border-radius:7px}
.btn-lg{padding:.68rem .95rem;font-size:.9rem;min-height:40px;border-radius:9px}

/* modal forms become shorter and easier to scan */
.modal{padding:.7rem}
.modal-dialog{max-width:680px;margin:.8rem auto}
.modal-lg{max-width:900px}
.modal-content{border-radius:13px}
.modal-header{padding:.68rem .9rem}
.modal-body{padding:.72rem .9rem;max-height:calc(100vh - 132px);overflow-y:auto;overscroll-behavior:contain}
.modal-footer{padding:.62rem .9rem;gap:.4rem}
.modal-title{font-size:.96rem}
.modal .small-muted{font-size:.7rem}
.modal hr{margin:3px 0 5px}
.modal .col-12>hr+ b,.modal .col-12>b:first-child{font-size:.78rem}

/* dense forms outside modal, including settings and report filters */
.card-body>form:not(.login-form){font-size:.82rem}
.card-body>form:not(.login-form) .mb-3{margin-bottom:.65rem!important}
.card-body>form:not(.login-form) .mb-2{margin-bottom:.45rem!important}
.card-body>form:not(.login-form) hr{margin:.45rem 0}

/* tables should show more data per screen */
.table thead th{font-size:.66rem;letter-spacing:.04em}
.table td,.table th{padding:.54rem .58rem}
.table tbody td{font-size:.79rem;line-height:1.35}
.table-sm td,.table-sm th{padding:.4rem .48rem}
.badge{font-size:.66rem;padding:.34em .55em}

/* filter/export/import bar */
.table-tools{margin-bottom:10px;padding:10px 11px;border-radius:11px}
.table-tools-main{gap:7px}
.tool-field label{margin-bottom:3px;font-size:.63rem}
.tool-control,.tool-select,.tool-input{height:34px;border-radius:8px;font-size:.76rem}
.tool-control,.tool-select{padding:0 8px}
.tool-input span{padding-left:9px;font-size:.92rem}
.tool-input input{padding:0 8px;font-size:.76rem}
.table-tools-actions{gap:6px;margin-top:8px;padding-top:8px}
.tool-btn{min-height:32px;padding:0 9px;border-radius:7px;font-size:.7rem}
.table-pager{margin-top:9px;padding-top:8px}
.table-count,.page-info{font-size:.7rem}

/* compact branch mapping */
.branch-map-toolbar{margin-bottom:8px;gap:8px}
.branch-map-search-wrap{max-width:330px}
.branch-map-grid{grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:7px}
.branch-map-item{gap:8px;padding:8px 9px;border-radius:9px}
.branch-map-item b{font-size:.77rem}.branch-map-item small{font-size:.65rem}.branch-selected-count{font-size:.72rem}

/* imported preview workspace */
.import-head{margin-bottom:13px;padding:10px 0}
.import-logo{width:48px;height:48px;border-radius:11px}
.import-section-title{font-size:.9rem}
.import-fields span{padding:4px 7px;font-size:.65rem}
.import-page .card-header{padding:10px 12px}

/* keep login generous; only application forms are compact */
.hris-login-form-panel .form-control{height:46px;min-height:46px;font-size:.92rem;padding:.65rem .85rem}
.hris-login-form-panel .input-group-text{min-height:46px;padding:.65rem .85rem}
.hris-login-form-panel .btn-lg{min-height:46px;font-size:.92rem}
.hris-login-form-panel .form-label{font-size:.82rem;margin-bottom:.42rem}

/* setup is administrative but still readable */
.setup-card .form-control,.setup-card .form-select{height:38px;min-height:38px;font-size:.83rem}
.setup-card .form-label{font-size:.78rem}

/* mobile: compact but still comfortable to tap */
@media(max-width:767.98px){
  .app-main>.container-fluid{padding-top:14px!important;padding-bottom:14px!important}
  .page-title{font-size:1.22rem}
  .card-body{padding:.72rem .75rem}
  .section-head{margin-bottom:11px}
  .form-control,.form-select{min-height:38px;height:38px;font-size:.84rem}
  textarea.form-control{height:auto;min-height:76px}
  .btn{min-height:36px}
  .modal{padding:.35rem}
  .modal-dialog{margin:.35rem auto;max-width:100%}
  .modal-body{max-height:calc(100vh - 112px);padding:.7rem .75rem}
  .modal-header,.modal-footer{padding:.65rem .75rem}
  .table td,.table th{padding:.5rem .52rem}
  .tool-control,.tool-select,.tool-input{height:36px}
  .tool-btn{min-height:34px}
}

/* Employee master: optional account creation panel */
.employee-login-panel{border:1px solid #dfe7f0;background:#f8fafc;border-radius:10px;padding:10px 11px}
.employee-login-branch-grid{max-height:210px;overflow:auto;padding-right:2px}
.employee-login-panel .branch-map-item{background:#fff}
@media(max-width:767.98px){.employee-login-branch-grid{max-height:260px}.employee-login-panel{padding:9px}}


/* Role menu permission matrix */
.menu-permission-card{overflow:visible}.menu-matrix-wrap{max-height:calc(100vh - 245px);overflow:auto}.menu-matrix-table{min-width:900px}.menu-matrix-table thead th{position:sticky;top:0;z-index:4;background:#f8fafc}.menu-matrix-table .menu-col{min-width:280px;left:0;z-index:6}.menu-matrix-table tbody .menu-name-cell{position:sticky;left:0;background:#fff;z-index:2;display:flex;align-items:center;gap:10px;min-width:280px}.menu-matrix-table tbody tr:hover .menu-name-cell{background:#fbfcfd}.menu-matrix-table .role-col{min-width:120px}.menu-name-cell b{display:block;font-size:.82rem}.menu-name-cell small{display:block;color:var(--muted);font-size:.64rem;margin-top:2px}.matrix-icon{width:30px;height:30px;border-radius:8px;background:#f3f6fa;color:#415a73;display:inline-flex;align-items:center;justify-content:center;flex:0 0 30px}.matrix-group td{position:sticky;left:0;background:#eef3f8!important;color:#52667b;font-size:.67rem!important;text-transform:uppercase;letter-spacing:.09em;font-weight:800;padding:.55rem .75rem!important;z-index:3}.cell-na{background:#fafbfc!important}.matrix-na{color:#c0c8d2}.matrix-lock{color:#355d84;display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:8px;background:#edf4fb}.menu-switch{display:inline-block;position:relative;width:38px;height:22px;margin:0;vertical-align:middle}.menu-switch input{position:absolute;opacity:0;pointer-events:none}.menu-switch span{position:absolute;inset:0;border-radius:999px;background:#d8dee7;transition:.15s;cursor:pointer}.menu-switch span:after{content:"";position:absolute;width:16px;height:16px;left:3px;top:3px;border-radius:50%;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.18);transition:.15s}.menu-switch input:checked+span{background:var(--niceso)}.menu-switch input:checked+span:after{transform:translateX(16px)}.role-tools{font-size:.6rem;font-weight:500;text-transform:none;letter-spacing:0;margin-top:3px;white-space:nowrap}.mini-link{border:0;background:none;padding:0;color:#53708d;font-size:.6rem;cursor:pointer}.mini-link:hover{text-decoration:underline}.menu-matrix-legend{display:flex;gap:12px;flex-wrap:wrap;font-size:.69rem;color:var(--muted)}.menu-matrix-legend span{display:inline-flex;gap:4px;align-items:center}.matrix-actions{padding:.8rem 1rem}
@media(max-width:767.98px){.menu-matrix-wrap{max-height:none}.menu-matrix-table{min-width:760px}.menu-matrix-table .menu-col,.menu-matrix-table tbody .menu-name-cell{min-width:210px}.menu-matrix-table .role-col{min-width:100px}}

/* Per-branch attendance settings */
.attendance-branch-info{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid #dfe8f1;background:#f8fbfe;border-radius:11px}.attendance-branch-info>i{width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:9px;background:#edf5ff;color:#315f93;flex:0 0 34px}.attendance-branch-info>div{display:flex;flex-direction:column;min-width:0}.attendance-branch-info b{font-size:.8rem}.attendance-branch-info span{font-size:.7rem;color:var(--muted);white-space:normal}.attendance-branch-info.not-configured{background:#fff7e8;border-color:#f1dfb2}.attendance-branch-info.not-configured>i{background:#fff0c8;color:#8a681a}.branch-attendance-settings-table input.form-control{min-width:110px}.branch-attendance-settings-table td{vertical-align:top}.text-success{color:#207d46!important}
@media(max-width:767.98px){.branch-attendance-settings-table{min-width:980px}.attendance-branch-info{align-items:flex-start}}


/* Compact horizontal filter - Attendance Report */
.report-filter-card{overflow:visible}
.report-filter-card .card-body{padding:.72rem .8rem}
.report-filter-form{display:grid;grid-template-columns:minmax(185px,1.35fr) repeat(2,minmax(142px,.9fr)) repeat(3,minmax(132px,.82fr)) auto;gap:7px 8px;align-items:end}
.report-filter-form.report-filter-self{grid-template-columns:repeat(3,minmax(150px,1fr)) auto}
.report-filter-field{min-width:0}
.report-filter-field .form-label{display:block;margin:0 0 3px;font-size:.67rem;white-space:nowrap;color:#425267}
.report-filter-field .form-control,.report-filter-field .form-select{width:100%;height:34px;min-height:34px;font-size:.76rem;padding:.3rem .52rem}
.report-filter-actions{display:flex;gap:6px;align-items:end;white-space:nowrap}
.report-filter-actions .btn{height:34px;min-height:34px;padding:.4rem .65rem;font-size:.74rem}
.report-filter-actions .btn-primary{min-width:92px}
.report-filter-actions .btn-outline-dark{min-width:68px}
@media(max-width:1199.98px){
  .report-filter-form{grid-template-columns:minmax(180px,1.25fr) repeat(2,minmax(145px,1fr)) repeat(2,minmax(135px,.9fr));}
}
@media(max-width:991.98px){
  .report-filter-form,.report-filter-form.report-filter-self{grid-template-columns:repeat(3,minmax(0,1fr))}
  .report-filter-search{grid-column:span 2}
  .report-filter-actions{grid-column:span 1}
  .report-filter-actions .btn{flex:1}
}
@media(max-width:767.98px){
  .report-filter-card .card-body{padding:.65rem}
  .report-filter-form,.report-filter-form.report-filter-self{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .report-filter-search{grid-column:1/-1}
  .report-filter-actions{grid-column:1/-1}
  .report-filter-actions .btn{flex:1;min-width:0}
}
@media(max-width:479.98px){
  .report-filter-form,.report-filter-form.report-filter-self{grid-template-columns:1fr}
  .report-filter-search,.report-filter-actions{grid-column:auto}
}


/* Searchable / type-to-find select: Cabang & Karyawan */
.searchable-select{position:relative;min-width:0;width:100%}
.searchable-select-native{position:absolute!important;left:0!important;bottom:0!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;padding:0!important;border:0!important}
.searchable-select-input{padding-right:34px!important;cursor:text;background:#fff!important}
.searchable-select-toggle{position:absolute;right:2px;top:2px;bottom:2px;width:30px;border:0;background:transparent;color:#718096;border-radius:7px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:16px;z-index:2}
.searchable-select-toggle:hover{background:#f1f5f9;color:#23374f}
.searchable-select-menu{display:none;position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:1095;max-height:260px;overflow:auto;background:#fff;border:1px solid #d9e1eb;border-radius:10px;box-shadow:0 14px 34px rgba(16,34,56,.16);padding:5px}
.searchable-select-menu.show{display:block}
.searchable-select-option{width:100%;border:0;background:#fff;color:#25364b;text-align:left;padding:7px 9px;border-radius:7px;display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:.76rem;line-height:1.3;cursor:pointer}
.searchable-select-option:hover,.searchable-select-option.active{background:#f1f5f9}
.searchable-select-option.selected{background:#fff2f2;color:#9d1c22;font-weight:700}
.searchable-select-option small{font-size:.62rem;font-weight:700;color:#8390a0;white-space:nowrap}
.searchable-select-empty,.searchable-select-more{padding:9px 10px;color:#7b8796;font-size:.72rem;text-align:center}
.searchable-select-more{border-top:1px solid #eef1f5;margin-top:4px}
.table-tools .searchable-select-menu,.report-filter-form .searchable-select-menu{z-index:1100}
@media(max-width:575.98px){.searchable-select-menu{max-height:220px}.searchable-select-option{padding:9px;font-size:.8rem}}

/* Outside-radius attendance reason */
.outside-radius-note{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border:1px solid #f1c4c7;background:#fff4f4;border-radius:10px;color:#9d252b}
.outside-radius-note[hidden]{display:none!important}
.outside-radius-note>i{font-size:1rem;margin-top:1px}
.outside-radius-note>div{display:flex;flex-direction:column;gap:1px;min-width:0}
.outside-radius-note b{font-size:.78rem}
.outside-radius-note span{font-size:.7rem;line-height:1.45;color:#a24a4f}
.outside-radius-modal{max-width:540px}
.outside-distance-box{display:flex;align-items:center;gap:11px;padding:10px 12px;border:1px solid #e6ebf2;background:#f8fafc;border-radius:10px;margin-bottom:12px}
.outside-distance-box>i{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:9px;background:#fff0f0;color:#d62832;font-size:1rem}
.outside-distance-box>div{display:flex;flex-direction:column;min-width:0}
.outside-distance-box span{font-size:.68rem;color:#758397}
.outside-distance-box b{font-size:.82rem;color:#24364b}
.outside-reason-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.outside-reason-options label{display:block;margin:0;cursor:pointer}
.outside-reason-options input{position:absolute;opacity:0;pointer-events:none}
.outside-reason-options span{display:flex;align-items:center;gap:9px;min-height:48px;padding:9px 11px;border:1px solid #dfe6ef;border-radius:10px;background:#fff;color:#314358;transition:border-color .15s,background .15s,box-shadow .15s}
.outside-reason-options span i{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:8px;background:#f2f5f9;color:#50647b;flex:0 0 auto}
.outside-reason-options span b{font-size:.76rem;line-height:1.3}
.outside-reason-options input:checked+span{border-color:#ed1c24;background:#fff5f5;box-shadow:0 0 0 2px rgba(237,28,36,.08)}
.outside-reason-options input:checked+span i{background:#ed1c24;color:#fff}
.outside-reason-error{display:flex;align-items:center;gap:6px;margin-top:9px;padding:8px 10px;border-radius:8px;background:#fff1f1;color:#a62b31;font-size:.72rem}
.outside-reason-error[hidden]{display:none!important}
@media(max-width:575.98px){.outside-reason-options{grid-template-columns:1fr}.outside-radius-modal{margin:.65rem}.outside-reason-options span{min-height:46px}}

/* Attendance report admin actions */
.attendance-actions{align-items:center;min-width:96px}.attendance-actions form{margin:0}.attendance-actions .btn{white-space:nowrap}

/* Attendance branch mapping source */
.attendance-mapping-source{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;background:#fff;border:1px solid var(--border);border-radius:12px;padding:9px 11px}
.attendance-mapping-source>div{min-width:0;display:flex;flex-direction:column;gap:2px}.attendance-mapping-source span{font-size:.66rem;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.04em}.attendance-mapping-source b{font-size:.82rem;color:var(--ink);overflow-wrap:anywhere}.attendance-mapping-source small{font-size:.66rem;color:var(--muted)}
@media(max-width:575.98px){.attendance-mapping-source{grid-template-columns:1fr}}


/* Attendance confirm modal mobile fix */
#attendanceConfirmModal .modal-dialog{max-width:980px}
#attendanceConfirmModal .modal-content{overflow:hidden}
#attendanceConfirmModal .modal-body{padding:.9rem 1rem}
#attendanceConfirmModal .modal-footer{display:flex;justify-content:flex-end;align-items:center;gap:.6rem;flex-wrap:wrap;background:#fff}
#attendanceConfirmModal .modal-footer .btn{min-height:44px;padding:.72rem 1rem;font-weight:700}
#attendanceConfirmModal .modal-footer .btn-outline-dark{min-width:146px}
#attendanceConfirmModal .modal-footer .btn-niceso{min-width:220px}
#attendanceConfirmModal .attendance-confirm-photo{background:#eef2f7;min-height:250px}
#attendanceConfirmModal .attendance-confirm-photo img{object-fit:contain;background:#eef2f7}
@media (max-width:767.98px){
  #attendanceConfirmModal .modal-dialog{margin:.45rem auto;max-width:calc(100vw - .9rem)}
  #attendanceConfirmModal .modal-content{max-height:calc(100vh - .9rem)}
  #attendanceConfirmModal .modal-body{padding:.75rem .8rem}
  #attendanceConfirmModal .modal-footer{position:sticky;bottom:0;z-index:2;padding:.75rem .8rem calc(.75rem + env(safe-area-inset-bottom));background:#fff;border-top:1px solid #e6ebf1}
  #attendanceConfirmModal .modal-footer .btn{width:100%;min-width:0}
  #attendanceConfirmModal .modal-footer .btn-outline-dark{order:2}
  #attendanceConfirmModal .modal-footer .btn-niceso{order:1}
  #attendanceConfirmModal .attendance-confirm-photo{min-height:190px}
}


/* Attendance report: one compact filter only */
.report-filter-card{overflow:visible}
.report-filter-form .searchable-select{width:100%}
.report-filter-form .searchable-select-input{height:34px;min-height:34px;font-size:.76rem;padding:.3rem 2.1rem .3rem .52rem}
.report-filter-form .searchable-select-toggle{height:32px;width:31px}
.report-filter-form .searchable-select-menu{min-width:100%;max-height:280px;z-index:1200}
.simple-table-pager{margin-top:0;border-top:1px solid var(--border)}
.simple-table-pager .pager-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.simple-page-size{display:flex;align-items:center;gap:6px;font-size:.72rem;color:#68788d;font-weight:700;margin:0}
.simple-page-size .page-size{height:34px;min-width:78px;width:auto;padding:0 8px}
.attendance-report-actions{justify-content:flex-end}
@media(max-width:767.98px){
  .attendance-report-actions{width:100%;display:grid!important;grid-template-columns:1fr 1fr}
  .attendance-report-actions .btn{width:100%}
  .simple-table-pager .pager-actions{width:100%;justify-content:space-between}
  .simple-page-size{width:100%;justify-content:flex-end}
}

/* Outside radius duty detail */
.outside-duty-field{margin:14px 0 12px;padding:12px;border:1px solid #e3e9f0;border-radius:11px;background:#f8fafc}
.outside-duty-title{font-size:.75rem;font-weight:800;color:#425267;margin:4px 0 8px}
#outsideRadiusReasonModal .searchable-select-menu{z-index:1300;max-height:230px}
.outside-duty-report-cell span{display:block;color:#66768a;margin-top:2px}
@media(max-width:575.98px){.outside-duty-field{padding:10px}.outside-reason-options{grid-template-columns:1fr}}

/* Contract document auto-fill preview */
.contract-autofill-preview{border:1px solid #e1e7ef;border-radius:12px;background:#f8fafc;padding:.75rem;margin-top:.35rem}.contract-preview-title{display:flex;align-items:center;gap:.6rem;padding-bottom:.55rem;margin-bottom:.55rem;border-bottom:1px solid #e5eaf0}.contract-preview-title>i{width:32px;height:32px;border-radius:9px;background:#fff0f1;color:#ed1c24;display:flex;align-items:center;justify-content:center}.contract-preview-title div{display:flex;flex-direction:column}.contract-preview-title b{font-size:.82rem}.contract-preview-title span{font-size:.68rem;color:#7a8797}.contract-preview-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.45rem}.contract-preview-grid>div{background:#fff;border:1px solid #e7ebf0;border-radius:9px;padding:.5rem .6rem;min-width:0}.contract-preview-grid span{display:block;font-size:.61rem;text-transform:uppercase;letter-spacing:.055em;color:#8290a0;font-weight:800;margin-bottom:.16rem}.contract-preview-grid b{font-size:.73rem;line-height:1.35;display:block;word-break:break-word}@media(max-width:991.98px){.contract-preview-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:575.98px){.contract-preview-grid{grid-template-columns:1fr}}

/* Contract import preview */
.contract-import-preview th,.contract-import-preview td{vertical-align:top}
.import-detail{position:relative;min-width:94px}
.import-detail>summary{list-style:none;cursor:pointer;display:inline-flex}
.import-detail>summary::-webkit-details-marker{display:none}
.import-detail[open] .import-detail-grid{display:grid}
.import-detail-grid{display:none;position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:1080;width:min(920px,calc(100vw - 32px));max-height:min(78vh,720px);overflow:auto;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:18px;background:#fff;border:1px solid #dfe6ef;border-radius:14px;box-shadow:0 24px 80px rgba(10,28,48,.28)}
.import-detail-grid:before{content:"Detail Data Kontrak";grid-column:1/-1;font-size:1rem;font-weight:800;color:#14243a;padding-bottom:8px;border-bottom:1px solid #e8edf3}
.import-detail-grid>div{border:1px solid #e7ecf2;border-radius:9px;padding:8px 10px;background:#fbfcfe;min-width:0}
.import-detail-grid span{display:block;font-size:.65rem;text-transform:uppercase;letter-spacing:.05em;color:#7b899a;font-weight:750;margin-bottom:3px}
.import-detail-grid b{display:block;font-size:.78rem;line-height:1.4;word-break:break-word;color:#1c2a3c}
@media(max-width:767.98px){.import-detail-grid{grid-template-columns:1fr 1fr;width:calc(100vw - 20px);padding:12px}.contract-import-preview{min-width:1080px}}
@media(max-width:479.98px){.import-detail-grid{grid-template-columns:1fr}}


/* Contract monitoring / expiry summary */
.contract-summary-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
.contract-summary-card{background:#fff;border:1px solid var(--border);border-radius:12px;padding:12px 13px;min-width:0;box-shadow:var(--shadow-sm);border-top:3px solid #8b98a8}
.contract-summary-card span{display:block;font-size:.68rem;color:#69798d;font-weight:750;line-height:1.25}.contract-summary-card b{display:block;font-size:1.55rem;line-height:1.1;margin:5px 0 3px;color:#15263b}.contract-summary-card small{display:block;font-size:.62rem;color:#8a96a5;line-height:1.35}
.contract-summary-card.success{border-top-color:#27945b}.contract-summary-card.warning{border-top-color:#d69a1c}.contract-summary-card.danger{border-top-color:#d93b43}.contract-summary-card.expired{border-top-color:#7c3e93}.contract-summary-card.neutral{border-top-color:#708197}
.contract-expiry-badge{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;padding:.34rem .58rem;border-radius:999px;font-size:.68rem;font-weight:800;background:#eef2f6;color:#59697c;border:1px solid #e1e7ee}.contract-expiry-badge.ok{background:#eef8f2;color:#277a4c;border-color:#d8ecdf}.contract-expiry-badge.warning{background:#fff7df;color:#896719;border-color:#f2e3b5}.contract-expiry-badge.urgent{background:#fff0f1;color:#b4232a;border-color:#f2d2d5}.contract-expiry-badge.expired{background:#f6edf9;color:#7b388b;border-color:#ead9ef}.contract-expiry-badge.neutral{background:#f2f5f8;color:#65758a}
.contract-priority-card{border-color:#f0dfaa}.contract-priority-card .card-header{background:#fffcf4}.contract-priority-table td{font-size:.75rem}.contract-priority-table th{font-size:.65rem}
.contract-all-clear{display:flex;align-items:center;gap:10px;background:#f1faf4;border:1px solid #d9ecdf;border-radius:11px;padding:10px 13px;color:#2a7047}.contract-all-clear>i{font-size:1.15rem}.contract-all-clear>div{display:flex;flex-direction:column}.contract-all-clear b{font-size:.78rem}.contract-all-clear span{font-size:.67rem;color:#568169}
.contract-dashboard-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.contract-dash-item{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--border);border-radius:12px;padding:11px 13px;box-shadow:var(--shadow-sm)}.contract-dash-item>i{width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:#f3f6fa;color:#566a82;font-size:1.05rem}.contract-dash-item>div{display:grid;grid-template-columns:1fr auto;column-gap:12px;align-items:center;min-width:0;flex:1}.contract-dash-item span{font-size:.68rem;color:#68798e;font-weight:750}.contract-dash-item b{font-size:1.35rem;grid-column:2;grid-row:1/3;color:#17293e}.contract-dash-item small{font-size:.62rem;color:#8995a4}.contract-dash-item.warning>i{background:#fff7df;color:#a17616}.contract-dash-item.danger>i{background:#fff0f1;color:#c32932}.contract-dash-item.expired>i{background:#f5edf8;color:#7d438b}
.contract-dashboard-list{padding:.25rem 1rem}.contract-dashboard-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px 0;border-bottom:1px solid #edf0f4}.contract-dashboard-row:last-child{border-bottom:0}.contract-dashboard-row>div:first-child{display:flex;flex-direction:column;min-width:0}.contract-dashboard-row b{font-size:.78rem}.contract-dashboard-row span{font-size:.66rem;color:#7d8998}.contract-dashboard-row .text-end{display:flex;flex-direction:column;flex:0 0 auto}.contract-dashboard-row strong{font-size:.82rem}.contract-dashboard-row .text-end span{font-size:.63rem}
.employee-contract-card.warning{border-color:#eadba6}.employee-contract-card.danger{border-color:#efc8cb}.employee-contract-card.expired{border-color:#decbe5}.employee-contract-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.employee-contract-grid>div{background:#f8fafc;border:1px solid #e8edf3;border-radius:10px;padding:9px 10px}.employee-contract-grid span{display:block;font-size:.62rem;text-transform:uppercase;letter-spacing:.05em;color:#8491a0;font-weight:800;margin-bottom:3px}.employee-contract-grid b{display:block;font-size:.76rem;line-height:1.4;color:#22344a;word-break:break-word}.employee-contract-alert{display:flex;gap:9px;align-items:flex-start;margin-top:10px;padding:9px 11px;border-radius:9px;background:#fff8e7;color:#7d6219}.employee-contract-alert.danger{background:#fff0f1;color:#a52930}.employee-contract-alert.expired{background:#f7eef9;color:#743982}.employee-contract-alert i{margin-top:1px}.employee-contract-alert>div{display:flex;flex-direction:column}.employee-contract-alert b{font-size:.74rem}.employee-contract-alert span{font-size:.66rem;line-height:1.45}
@media(max-width:1199.98px){.contract-summary-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:767.98px){.contract-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.contract-dashboard-strip{grid-template-columns:1fr}.employee-contract-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:479.98px){.contract-summary-grid,.employee-contract-grid{grid-template-columns:1fr}.contract-dashboard-row{align-items:flex-start}.contract-dashboard-row .text-end{text-align:left!important}}


/* Professional validation - Leave request */
.leave-request-form .required-star{color:#d92d20;font-weight:800}
.leave-form-alert{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;margin-bottom:12px;border:1px solid #f3b7b2;border-radius:10px;background:#fff5f4;color:#9f251d}
.leave-form-alert[hidden]{display:none!important}
.leave-form-alert>i{font-size:1.05rem;margin-top:1px;color:#d92d20}
.leave-form-alert>div{display:flex;flex-direction:column;gap:2px}
.leave-form-alert b{font-size:.8rem}
.leave-form-alert span{font-size:.72rem;line-height:1.45;color:#a33b34}
.leave-field-help,.leave-type-help{font-size:.68rem;color:#7a8796;margin-top:3px;line-height:1.45}
.leave-request-form .form-control.is-invalid,.leave-request-form .form-select.is-invalid{border-color:#d92d20!important;box-shadow:0 0 0 .16rem rgba(217,45,32,.10)!important;background-color:#fffafa}
.leave-request-form .invalid-feedback{display:none;font-size:.69rem;color:#d92d20;margin-top:4px;font-weight:650}
.leave-request-form .is-invalid~.invalid-feedback{display:block}
.leave-request-form .modal-footer{justify-content:flex-end}
@media(max-width:575.98px){.leave-request-form .modal-footer .btn{flex:1}.leave-form-alert{padding:9px 10px}}

/* Multi-stage Leave Approval */
.leave-stage-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.leave-stage-summary>div{background:#fff;border:1px solid var(--border);border-radius:12px;padding:12px 14px;box-shadow:var(--shadow-sm);display:flex;align-items:center;justify-content:space-between;gap:10px}
.leave-stage-summary span{font-size:.72rem;color:var(--muted);font-weight:700}.leave-stage-summary b{font-size:1.35rem;color:var(--navy)}
.leave-bulk-bar{background:#fff;border:1px solid var(--border);border-radius:12px;padding:10px 12px;display:flex;align-items:center;justify-content:space-between;gap:12px;box-shadow:var(--shadow-sm)}
.leave-bulk-title{display:flex;align-items:center;gap:10px;min-width:250px}.leave-bulk-title>i{width:36px;height:36px;border-radius:10px;background:#eef4fa;color:#23476c;display:flex;align-items:center;justify-content:center}.leave-bulk-title>div{display:flex;flex-direction:column}.leave-bulk-title b{font-size:.83rem}.leave-bulk-title span{font-size:.68rem;color:var(--muted)}
.leave-bulk-controls{display:grid;grid-template-columns:minmax(150px,.8fr) minmax(220px,1.5fr) auto;gap:7px;align-items:center;flex:1;max-width:820px}.leave-bulk-controls .form-control,.leave-bulk-controls .form-select{min-height:36px;height:36px;font-size:.76rem}.leave-bulk-controls .btn{height:36px;white-space:nowrap;font-size:.76rem}
.leave-reason-cell{max-width:260px;white-space:normal;line-height:1.35}.leave-mini-flow{display:flex;gap:7px;align-items:center;white-space:nowrap}.leave-mini-flow>span{display:inline-flex;align-items:center;gap:3px;font-size:.66rem;color:#64748b}.leave-step-dot{width:18px;height:18px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:.62rem;font-weight:900;background:#e9eef4;color:#7c8998}.leave-step-dot.success{background:#e8f7ee;color:#1d8248}.leave-step-dot.danger{background:#fff0f1;color:#c42c36}
.leave-detail-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.leave-detail-grid>div{border:1px solid var(--border);border-radius:10px;padding:10px 12px;display:flex;flex-direction:column;gap:4px}.leave-detail-grid span,.leave-detail-reason>span{font-size:.66rem;text-transform:uppercase;letter-spacing:.06em;color:#8190a2;font-weight:800}.leave-detail-grid b{font-size:.82rem}.leave-detail-reason{border:1px solid var(--border);border-radius:10px;padding:12px}.leave-detail-reason p{margin:6px 0 8px;font-size:.84rem}
.leave-approval-timeline{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.leave-timeline-step{border:1px solid var(--border);border-radius:11px;padding:10px;display:flex;gap:8px;min-height:90px;background:#fafbfd}.leave-timeline-step.done{border-color:#cfe9d8;background:#f4fbf6}.leave-timeline-step.current{border-color:#f0c8ca;background:#fff6f6;box-shadow:inset 3px 0 0 var(--niceso)}.leave-timeline-step.rejected{border-color:#f2d2d5;background:#fff7f7}.leave-timeline-step>div:last-child{display:flex;flex-direction:column;gap:3px;min-width:0}.leave-timeline-step b{font-size:.76rem}.leave-timeline-step span{font-size:.67rem;color:#738398;line-height:1.35}.leave-timeline-step small{font-size:.67rem;color:#4f6072;line-height:1.35}.timeline-mark{padding-top:1px}
.leave-review-box{border:1px solid #dfe6ee;border-radius:12px;background:#f8fafc;padding:12px;display:grid;grid-template-columns:minmax(190px,.8fr) minmax(260px,1.4fr) auto;gap:10px;align-items:center}.leave-review-box textarea{min-height:56px}.leave-review-box .d-flex{white-space:nowrap}
@media(max-width:991.98px){.leave-stage-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.leave-bulk-bar{align-items:flex-start;flex-direction:column}.leave-bulk-controls{width:100%;max-width:none}.leave-detail-grid,.leave-approval-timeline{grid-template-columns:repeat(2,minmax(0,1fr))}.leave-review-box{grid-template-columns:1fr}.leave-review-box .d-flex{justify-content:stretch!important}.leave-review-box .btn{flex:1}}
@media(max-width:575.98px){.leave-stage-summary{grid-template-columns:1fr 1fr}.leave-bulk-controls{grid-template-columns:1fr}.leave-bulk-controls .btn{width:100%}.leave-detail-grid,.leave-approval-timeline{grid-template-columns:1fr}.leave-mini-flow{display:grid;grid-template-columns:1fr 1fr;gap:4px}.leave-review-box .d-flex{flex-direction:column}.leave-review-box .btn{width:100%}}


/* Memo notification & inbox */
.memo-notification-dropdown{position:relative}
.memo-notification-button{position:relative;width:40px;height:40px;border:1px solid var(--border);border-radius:11px;background:#fff;color:#31455d;display:inline-flex;align-items:center;justify-content:center;font-size:1.08rem;cursor:pointer}
.memo-notification-button:hover{background:#f7f9fc;color:var(--niceso)}
.memo-notification-badge{position:absolute;right:-5px;top:-5px;min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:var(--niceso);color:#fff;border:2px solid #fff;font-size:.61rem;font-weight:800;display:flex;align-items:center;justify-content:center}
.memo-notification-menu{width:min(390px,calc(100vw - 24px));padding:0;overflow:hidden;border:1px solid var(--border)!important}
.memo-notification-head{display:flex;align-items:center;justify-content:space-between;padding:13px 15px;border-bottom:1px solid var(--border);background:#fbfcfe}.memo-notification-head>div{display:flex;flex-direction:column}.memo-notification-head b{font-size:.92rem}.memo-notification-head span{font-size:.68rem;color:var(--muted);margin-top:2px}.memo-notification-head>i{width:34px;height:34px;border-radius:10px;background:#fff0f1;color:var(--niceso);display:flex;align-items:center;justify-content:center}
.memo-notification-list{max-height:350px;overflow:auto}.memo-notification-item{display:flex;align-items:center;gap:10px;padding:11px 13px;border-bottom:1px solid #edf1f5;background:#fff}.memo-notification-item:hover{background:#f8fafc}.memo-notification-item.unread{background:#fff9f9}.memo-priority-dot{width:8px;height:8px;border-radius:50%;flex:0 0 8px;background:#9ba8b7}.memo-priority-dot.priority-important{background:#e8ad1a}.memo-priority-dot.priority-urgent{background:var(--niceso)}.memo-notification-copy{display:flex;flex-direction:column;min-width:0;flex:1}.memo-notification-copy b{font-size:.79rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.memo-notification-copy small{font-size:.67rem;color:var(--muted);margin-top:3px}.memo-unread-dot{width:7px;height:7px;border-radius:50%;background:var(--niceso);flex:0 0 7px}.memo-notification-empty{padding:30px 14px;display:flex;flex-direction:column;align-items:center;gap:8px;color:var(--muted);font-size:.78rem}.memo-notification-empty i{font-size:1.5rem}.memo-notification-all{display:flex;align-items:center;justify-content:center;gap:7px;padding:11px;background:#fff;color:#294c71;font-size:.76rem;font-weight:700}.memo-notification-all:hover{background:#f7f9fc}
.memo-inbox-grid{display:grid;gap:10px}.memo-inbox-card{display:flex;align-items:center;gap:13px;padding:14px 16px;border:1px solid var(--border);background:#fff;border-radius:13px;box-shadow:var(--shadow-sm)}.memo-inbox-card:hover{transform:translateY(-1px);box-shadow:var(--shadow-md)}.memo-inbox-card.unread{border-left:4px solid var(--niceso);background:#fffafa}.memo-inbox-icon{width:42px;height:42px;border-radius:12px;background:#fff0f1;color:var(--niceso);display:flex;align-items:center;justify-content:center;font-size:1.1rem;flex:0 0 42px}.memo-inbox-content{min-width:0;flex:1}.memo-inbox-content>b,.memo-inbox-content .d-flex>b{font-size:.91rem}.memo-inbox-content p{margin:4px 0 7px;color:#64758a;font-size:.78rem;line-height:1.5}.memo-inbox-meta{display:flex;gap:13px;flex-wrap:wrap;color:#8391a3;font-size:.67rem}.memo-inbox-meta span{display:flex;gap:5px;align-items:center}.memo-inbox-arrow{color:#9aa7b7}
.memo-detail-card{max-width:980px;margin:auto}.memo-detail-heading{display:flex;justify-content:space-between;gap:20px;padding-bottom:18px;border-bottom:1px solid var(--border)}.memo-detail-kicker{display:block;color:var(--niceso);font-size:.68rem;letter-spacing:.12em;font-weight:850;margin-bottom:7px}.memo-detail-heading h2{font-size:1.45rem;margin:0 0 5px}.memo-detail-heading p{margin:0;color:var(--muted)}.memo-detail-status{display:flex;flex-direction:column;align-items:flex-end;gap:7px}.memo-detail-status small{font-size:.72rem;color:var(--muted)}.memo-detail-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:16px 0}.memo-detail-meta>div{padding:10px 12px;background:#f8fafc;border:1px solid var(--border);border-radius:10px;display:flex;flex-direction:column}.memo-detail-meta span{font-size:.65rem;text-transform:uppercase;color:#8794a4;font-weight:800}.memo-detail-meta b{font-size:.79rem;margin-top:3px}.memo-detail-body{padding:20px 4px;font-size:.9rem;line-height:1.8;color:#27374a}.memo-detail-sign{margin-top:25px;display:flex;flex-direction:column;width:220px}.memo-detail-sign span{font-size:.78rem;color:var(--muted)}.memo-detail-sign b{margin-top:4px}.memo-detail-sign strong{margin-top:45px;font-size:.83rem}
@media(max-width:767.98px){.memo-notification-button{width:38px;height:38px}.memo-detail-heading{flex-direction:column}.memo-detail-status{align-items:flex-start}.memo-detail-meta{grid-template-columns:1fr}.memo-inbox-card{align-items:flex-start;padding:12px}.memo-inbox-meta{gap:7px}.memo-notification-menu{position:fixed!important;left:12px!important;right:12px!important;top:64px!important;width:auto!important;transform:none!important}}

/* Employee lifecycle: Onboarding & Offboarding */
.onboarding-checklist{display:flex;flex-direction:column}
.onboarding-check-item{display:flex;align-items:flex-start;gap:.75rem;padding:.78rem .9rem;border-bottom:1px solid #edf1f5;background:#fff}
.onboarding-check-item:last-child{border-bottom:0}
.onboarding-check-item.done{background:#f8fbf9}
.onboarding-check-state{width:25px;flex:0 0 25px;padding-top:2px;text-align:center;color:#91a0b1;font-size:1.05rem}
.onboarding-check-item.done .onboarding-check-state{color:#198754}
.onboarding-check-item.done b{color:#415466}
.lifecycle-dashboard-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.lifecycle-dash-item{display:flex;align-items:center;gap:12px;min-width:0;padding:13px 14px;background:#fff;border:1px solid #e1e8f0;border-radius:13px;color:#25364b;text-decoration:none;box-shadow:0 4px 15px rgba(15,34,55,.035)}
.lifecycle-dash-item:hover{border-color:#b9c8d9;transform:translateY(-1px)}
.lifecycle-dash-item>i{width:38px;height:38px;border-radius:10px;background:#eef4fb;display:flex;align-items:center;justify-content:center;color:#26496f;font-size:1rem;flex:0 0 38px}
.lifecycle-dash-item.warning>i{background:#fff7e5;color:#b77800}.lifecycle-dash-item.success>i{background:#eaf8ef;color:#198754}
.lifecycle-dash-item div{min-width:0;display:grid;grid-template-columns:1fr auto;column-gap:8px;align-items:center;flex:1}
.lifecycle-dash-item span{font-size:.71rem;color:#6d7b8c;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lifecycle-dash-item b{font-size:1.2rem;color:#17283c}.lifecycle-dash-item small{grid-column:1/-1;font-size:.65rem;color:#8996a5}
@media(max-width:991.98px){.lifecycle-dashboard-strip{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:575.98px){.lifecycle-dashboard-strip{grid-template-columns:1fr 1fr;gap:7px}.lifecycle-dash-item{padding:10px;gap:8px}.lifecycle-dash-item>i{width:32px;height:32px;flex-basis:32px}.lifecycle-dash-item span{font-size:.63rem}.lifecycle-dash-item b{font-size:1rem}.onboarding-check-item{padding:.72rem .75rem;gap:.6rem}}


/* Audit Log timezone */
.audit-time-chip{display:flex;align-items:center;gap:.45rem;padding:.48rem .72rem;border:1px solid #dfe7ef;border-radius:10px;background:#fff;font-size:.72rem;color:#627386;white-space:nowrap}
.audit-time-chip i{font-size:1rem;color:#e51f2b}.audit-time-chip span{font-weight:650}.audit-time-chip b{color:#17263a;font-size:.74rem}
@media(max-width:767.98px){.audit-time-chip{width:100%;justify-content:flex-start;margin-top:.4rem}.section-head{flex-wrap:wrap}}


/* Recruitment detail */
.candidate-detail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid #e4e9ef;border-radius:14px;overflow:hidden}
.candidate-detail-grid>div{padding:12px 14px;border-right:1px solid #edf1f4;border-bottom:1px solid #edf1f4;min-width:0}
.candidate-detail-grid>div:nth-child(3n){border-right:0}
.candidate-detail-grid .wide{grid-column:1/-1;border-right:0}
.candidate-detail-grid span{display:block;font-size:.67rem;text-transform:uppercase;letter-spacing:.055em;color:#8492a2;font-weight:800}
.candidate-detail-grid b{display:block;margin-top:3px;font-size:.82rem;line-height:1.45;word-break:break-word}
@media(max-width:767.98px){.candidate-detail-grid{grid-template-columns:1fr 1fr}.candidate-detail-grid>div:nth-child(3n){border-right:1px solid #edf1f4}.candidate-detail-grid>div:nth-child(2n){border-right:0}.candidate-detail-grid .wide{grid-column:1/-1}}
@media(max-width:479.98px){.candidate-detail-grid{grid-template-columns:1fr}.candidate-detail-grid>div{border-right:0!important}.candidate-detail-grid .wide{grid-column:auto}}


/* Dashboard KPI drill-down links */
.metric-link{display:block;color:inherit;text-decoration:none;cursor:pointer;transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease}
.metric-link:hover{color:inherit;text-decoration:none;transform:translateY(-2px);border-color:#c7d4e2;box-shadow:0 9px 24px rgba(21,47,76,.09)}
.metric-link:focus-visible{outline:3px solid rgba(45,101,157,.18);outline-offset:2px}
.metric-drilldown{display:block;margin-top:3px;font-size:.62rem;color:#7f8ea0;font-weight:650}
.metric-link:hover .metric-drilldown,.dashboard-value-link:hover{color:#234f7d}
.dashboard-value-link{color:inherit;text-decoration:none;font-weight:750;border-bottom:1px dashed #b9c5d2}
.dashboard-row-link{color:inherit;text-decoration:none;margin:0}
.dashboard-row-link:hover{color:inherit;background:#f8fafc}
.employee-hero-status-link{color:inherit;text-decoration:none;transition:transform .15s ease,box-shadow .15s ease}
.employee-hero-status-link:hover{color:inherit;transform:translateY(-1px);box-shadow:0 8px 22px rgba(0,0,0,.10)}


/* Employee self-registration */
.registration-link-card{border-color:#f0d597}.registration-link-card code{font-size:.76rem;color:#b51d28}.registration-detail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.registration-detail-grid>div{padding:10px 12px;border:1px solid #e3e9ef;border-radius:9px;background:#fafbfd;min-width:0}.registration-detail-grid>div.wide{grid-column:span 3}.registration-detail-grid span{display:block;font-size:.66rem;text-transform:uppercase;letter-spacing:.06em;color:#7d8998;font-weight:800;margin-bottom:3px}.registration-detail-grid b{font-size:.78rem;line-height:1.45;word-break:break-word}.stat-card small{display:block;color:#7b899a;font-size:.68rem;margin-top:3px}
@media(max-width:767.98px){.registration-detail-grid{grid-template-columns:1fr}.registration-detail-grid>div.wide{grid-column:auto}}


/* Registration approval follow-up: Account -> PKWT */
.reg-setup-cell{min-width:420px}.reg-setup-flow{display:flex;align-items:stretch;gap:8px;min-width:0}.reg-setup-step{min-width:175px;flex:1;border:1px solid #dfe6ee;border-radius:10px;padding:9px;background:#fff;display:flex;flex-direction:column;gap:7px}.reg-setup-step.done{border-color:#b9dfc8;background:#f6fbf8}.reg-setup-step.pending{border-color:#ead6a8;background:#fffaf0}.reg-setup-step.locked{background:#f7f8fa;color:#7b8794}.reg-setup-top{display:flex;gap:7px;align-items:flex-start}.reg-setup-top>div{min-width:0}.reg-setup-top b{display:block;font-size:.73rem}.reg-setup-top small{display:block;font-size:.64rem;color:#748193;white-space:normal;line-height:1.3}.reg-step-no{width:22px;height:22px;flex:0 0 22px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:#eaf0f6;color:#203a57;font-size:.67rem;font-weight:800}.reg-setup-step.done .reg-step-no{background:#d9f0e2;color:#187044}.reg-setup-step.pending .reg-step-no{background:#f6e8c5;color:#8a5b00}.reg-setup-step .badge{width:max-content;max-width:100%;font-size:.62rem}.reg-setup-step .btn{width:100%;white-space:nowrap}.reg-setup-arrow{display:flex;align-items:center;justify-content:center;color:#8a98a8;flex:0 0 18px}.reg-setup-unavailable{display:flex;align-items:center;gap:6px;color:#8390a0;font-size:.68rem;min-width:185px}.registration-workflow-panel{border-top:1px solid #e1e7ee;padding:14px 16px 2px}.registration-workflow-title{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:10px}.registration-workflow-title>div{display:flex;align-items:center;gap:7px}.registration-workflow-title b{font-size:.8rem}.registration-workflow-title small{font-size:.66rem;color:#778596}
@media(max-width:767.98px){.reg-setup-cell{min-width:300px}.reg-setup-flow{flex-direction:column}.reg-setup-arrow{transform:rotate(90deg);height:15px}.reg-setup-step{min-width:0}.registration-workflow-title{align-items:flex-start;flex-direction:column}}

/* Sidebar menu group collapse */
.nav-collapse-group{margin-top:8px;border-radius:10px;overflow:visible}
.nav-group-toggle{width:100%;border:0;background:transparent;color:#6f879f;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 10px 6px;margin:0;cursor:pointer;text-align:left;border-radius:9px;transition:background .15s ease,color .15s ease}
.nav-group-toggle:hover{background:rgba(255,255,255,.04);color:#9eb1c4}
.nav-group-toggle:focus-visible{outline:2px solid rgba(255,255,255,.38);outline-offset:1px}
.nav-group-title{min-width:0;display:flex;align-items:center;gap:8px;font-size:.64rem;text-transform:uppercase;letter-spacing:.11em;font-weight:800}
.nav-group-title>i{font-size:.78rem;width:16px;text-align:center;color:#718aa2}
.nav-group-title>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nav-group-chevron{font-size:.68rem;transition:transform .18s ease;color:#607990;flex:0 0 auto}
.nav-group-items{overflow:hidden;max-height:900px;opacity:1;transition:max-height .22s ease,opacity .16s ease}
.nav-collapse-group.is-collapsed .nav-group-items{max-height:0;opacity:0;pointer-events:none}
.nav-collapse-group.is-collapsed .nav-group-chevron{transform:rotate(-90deg)}
.nav-collapse-group.has-active>.nav-group-toggle{color:#9eb3c8}
.nav-collapse-group.has-active>.nav-group-toggle .nav-group-title>i{color:#ff676d}

@media (min-width:992px){
  body.sidebar-collapsed .nav-group-toggle{height:1px;min-height:1px;padding:0;margin:14px 9px 9px;background:rgba(255,255,255,.09);border-radius:0;pointer-events:none;overflow:hidden}
  body.sidebar-collapsed .nav-group-toggle>*{display:none!important}
  body.sidebar-collapsed .nav-group-items{max-height:900px!important;opacity:1!important;pointer-events:auto!important;overflow:visible}
  body.sidebar-collapsed .nav-collapse-group{margin-top:0}
}

@media (max-width:991.98px){
  .nav-group-toggle{min-height:38px;padding:9px 10px 5px}
  .nav-group-title{font-size:.62rem}
}

/* Workflow approval 3 tahap: SPV -> MA -> HRD */
.leave-stage-summary.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.leave-approval-timeline.three{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:991.98px){.leave-stage-summary.three,.leave-approval-timeline.three{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:575.98px){.leave-stage-summary.three{grid-template-columns:1fr}.leave-approval-timeline.three{grid-template-columns:1fr}}

/* Dashboard attendance operations summary */
.dashboard-primary-metrics .metric{overflow:hidden}
.dashboard-primary-metrics .kpi-number{line-height:1.05}
.dashboard-metric-danger .icon{background:rgba(220,53,69,.10);color:#b42318}
.dashboard-metric-warning .icon{background:rgba(245,158,11,.12);color:#b54708}
.dashboard-metric-success .icon{background:rgba(25,135,84,.10);color:#067647}
.dashboard-metric-info .icon{background:rgba(13,110,253,.08);color:#175cd3}
.dashboard-status-card .card-header{display:flex;align-items:center;justify-content:space-between}
.dashboard-status-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.dashboard-status-item{min-width:0;display:flex;align-items:center;gap:10px;padding:12px 13px;border:1px solid var(--bs-border-color,#dee2e6);border-radius:12px;text-decoration:none;color:inherit;background:#fff;transition:.16s ease}
.dashboard-status-item:hover{border-color:#a8b7c8;transform:translateY(-1px);box-shadow:0 6px 18px rgba(16,24,40,.06)}
.dashboard-status-item div{min-width:0;display:flex;flex-direction:column}
.dashboard-status-item small{color:#667085;white-space:normal;line-height:1.2}
.dashboard-status-item b{font-size:1.35rem;line-height:1.15;margin-top:3px;color:#172033}
.dashboard-status-icon{width:38px;height:38px;flex:0 0 38px;border-radius:10px;display:grid;place-items:center;background:#f2f4f7;color:#344054;font-size:1.05rem}
.dashboard-branch-table th{white-space:nowrap}
.dashboard-branch-alert{background:rgba(220,53,69,.025)}
.dashboard-missing-count{display:inline-grid;min-width:30px;height:30px;place-items:center;padding:0 8px;border-radius:999px;background:#fee4e2;color:#b42318;font-weight:800;text-decoration:none}
.dashboard-missing-count:hover{background:#fecdca;color:#912018}
.dashboard-status-stack{display:flex;gap:5px;flex-wrap:wrap;min-width:155px}
.dashboard-status-stack a{font-size:.75rem;text-decoration:none;padding:3px 7px;border-radius:999px;background:#f2f4f7;color:#344054;white-space:nowrap}
.dashboard-progress{min-width:105px;display:flex;align-items:center;gap:7px}
.dashboard-progress .progress{height:7px;min-width:65px;flex:1;background:#eef2f6}
.dashboard-progress small{font-weight:700;color:#475467;min-width:38px;text-align:right}
.dashboard-contract-vertical{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;margin:0!important}
.dashboard-contract-vertical .contract-dash-item{min-height:0}
.dashboard-hr-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:1199.98px){.dashboard-status-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.dashboard-hr-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:767.98px){.dashboard-status-grid,.dashboard-hr-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-status-item{padding:10px}.dashboard-status-item b{font-size:1.15rem}.dashboard-status-icon{width:34px;height:34px;flex-basis:34px}.dashboard-branch-table{font-size:.85rem}}
@media(max-width:420px){.dashboard-status-grid,.dashboard-hr-grid{grid-template-columns:1fr 1fr}.dashboard-status-item{align-items:flex-start}.dashboard-status-item small{font-size:.72rem}}

/* =========================================================
   Dashboard HRD Compact Density v2026.09.08
   Scoped to dashboard-specific classes so other modules stay unchanged.
   ========================================================= */
.dashboard-head{margin-bottom:10px}
.dashboard-head .page-title{font-size:1.28rem}
.dashboard-head .small-muted{font-size:.70rem}
.dashboard-filter{align-items:center}
.dashboard-filter .form-control{height:34px;min-height:34px;font-size:.76rem;padding:.28rem .55rem}
.dashboard-filter .btn{min-height:34px;padding:.34rem .72rem;font-size:.75rem}

.dashboard-primary-grid{
  display:grid!important;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:8px;
  margin-inline:0!important;
  row-gap:8px!important;
}
.dashboard-primary-grid>.dashboard-primary-cell{width:auto!important;padding:0!important;min-width:0}
.dashboard-primary-grid .metric{border-radius:10px;min-height:72px}
.dashboard-primary-grid .dashboard-metric-body{padding:.55rem .62rem!important;gap:.55rem!important;min-height:70px}
.dashboard-primary-grid .metric .icon{width:34px;height:34px;flex:0 0 34px;border-radius:9px;font-size:1rem}
.dashboard-primary-grid .small-muted{font-size:.65rem;line-height:1.15;margin:0}
.dashboard-primary-grid .kpi-number{font-size:1.28rem;line-height:1.05;margin-top:2px}
.dashboard-primary-grid .metric-drilldown{font-size:.54rem;line-height:1.05;margin-top:2px;white-space:nowrap}
.dashboard-primary-grid .metric-link:hover{transform:translateY(-1px)}

.dashboard-section-card{margin-bottom:.65rem!important;border-radius:10px}
.dashboard-section-card>.card-header,.dashboard-status-card>.card-header{padding:.55rem .7rem!important;font-size:.79rem}
.dashboard-section-card>.card-body,.dashboard-status-card>.card-body{padding:.58rem .68rem!important}
.dashboard-section-card .small-muted,.dashboard-status-card .small-muted{font-size:.66rem;line-height:1.25}

.dashboard-status-grid{grid-template-columns:repeat(8,minmax(0,1fr));gap:7px}
.dashboard-status-item{gap:7px;padding:7px 8px;border-radius:9px;min-height:54px}
.dashboard-status-item:hover{transform:none;box-shadow:0 3px 10px rgba(16,24,40,.05)}
.dashboard-status-icon{width:30px;height:30px;flex:0 0 30px;border-radius:8px;font-size:.88rem}
.dashboard-status-item small{font-size:.61rem;line-height:1.12}
.dashboard-status-item b{font-size:1.05rem;line-height:1;margin-top:2px}

.dashboard-top-panels,.dashboard-bottom-panels{margin-bottom:.65rem!important;row-gap:.55rem!important}
.dashboard-top-panels .card,.dashboard-bottom-panels .card{border-radius:10px}
.dashboard-top-panels .card-body,.dashboard-bottom-panels .card-body{padding:.62rem .7rem!important}
.dashboard-top-panels h5,.dashboard-bottom-panels h5{font-size:.85rem;margin-bottom:.2rem!important}
.dashboard-top-panels .small-muted,.dashboard-bottom-panels .small-muted{font-size:.65rem}
.dashboard-top-panels .list-group-item{padding:.42rem .1rem;font-size:.72rem}
.dashboard-top-panels .badge{font-size:.62rem}
#attChart{max-height:150px!important}

.dashboard-branch-table,.dashboard-section-card .table{font-size:.72rem;margin-bottom:0}
.dashboard-branch-table th,.dashboard-branch-table td,.dashboard-section-card .table th,.dashboard-section-card .table td{padding:.38rem .42rem;line-height:1.25}
.dashboard-branch-table .small-muted,.dashboard-section-card .table .small-muted{font-size:.61rem}
.dashboard-missing-count{min-width:25px;height:25px;padding:0 6px;font-size:.72rem}
.dashboard-status-stack{min-width:125px;gap:3px}
.dashboard-status-stack a{font-size:.62rem;padding:2px 5px}
.dashboard-progress{min-width:88px;gap:5px}
.dashboard-progress .progress{height:5px;min-width:50px}
.dashboard-progress small{font-size:.62rem;min-width:33px}
.dashboard-section-card .btn-sm{min-height:27px;padding:.2rem .42rem;font-size:.65rem}
.dashboard-section-card .badge{font-size:.62rem;padding:.3em .5em}

.dashboard-hr-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:7px}
.dashboard-contract-vertical{gap:7px!important}
.dashboard-contract-vertical .contract-dash-item{padding:8px 10px!important;border-radius:9px!important;gap:8px!important}
.dashboard-contract-vertical .contract-dash-item>i{width:30px!important;height:30px!important;flex:0 0 30px!important;font-size:.9rem!important}
.dashboard-contract-vertical .contract-dash-item span{font-size:.62rem!important}
.dashboard-contract-vertical .contract-dash-item b{font-size:1.05rem!important}
.dashboard-contract-vertical .contract-dash-item small{font-size:.58rem!important;line-height:1.15!important}
.contract-dashboard-list{padding:.4rem .68rem!important}
.contract-dashboard-row{padding:.45rem 0!important}
.contract-dashboard-row b{font-size:.72rem!important}
.contract-dashboard-row span{font-size:.61rem!important}

@media(max-width:1399.98px){
  .dashboard-primary-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .dashboard-status-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .dashboard-hr-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:991.98px){
  .dashboard-primary-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .dashboard-status-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .dashboard-hr-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:767.98px){
  .dashboard-head{gap:8px}
  .dashboard-head .page-title{font-size:1.16rem}
  .dashboard-filter{width:100%;display:grid!important;grid-template-columns:minmax(0,1fr) auto auto;gap:6px!important}
  .dashboard-filter .form-control{width:100%!important}
  .dashboard-primary-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
  .dashboard-primary-grid .metric{min-height:66px}
  .dashboard-primary-grid .dashboard-metric-body{min-height:64px;padding:.48rem .52rem!important}
  .dashboard-primary-grid .metric .icon{width:31px;height:31px;flex-basis:31px}
  .dashboard-primary-grid .kpi-number{font-size:1.14rem}
  .dashboard-primary-grid .metric-drilldown{display:none}
  .dashboard-status-grid,.dashboard-hr-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
  .dashboard-status-item{min-height:50px;padding:6px 7px}
  .dashboard-section-card>.card-body,.dashboard-status-card>.card-body{padding:.5rem .55rem!important}
  .dashboard-branch-table,.dashboard-section-card .table{font-size:.69rem}
  #attChart{max-height:130px!important}
}
@media(max-width:420px){
  .dashboard-filter{grid-template-columns:1fr 1fr}
  .dashboard-filter .form-control{grid-column:1/-1}
  .dashboard-primary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dashboard-primary-grid .small-muted{font-size:.6rem}
  .dashboard-primary-grid .kpi-number{font-size:1.08rem}
  .dashboard-status-item small{font-size:.58rem}
}
@media(min-width:1200px){
  .dashboard-top-panels>.col-xl-8{width:66.666%!important}
  .dashboard-top-panels>.col-xl-4{width:33.333%!important}
  .dashboard-bottom-panels>.col-xl-7{width:58.333%!important}
  .dashboard-bottom-panels>.col-xl-5{width:41.666%!important}
}

/* Compact employee detail modal */
.employee-detail-modal{max-width:min(1180px,96vw)}
.employee-detail-modal .modal-content{border-radius:14px;overflow:hidden}
.employee-detail-header{padding:11px 14px}
.employee-detail-header .modal-title{font-size:1rem;font-weight:800;line-height:1.15}
.employee-detail-subtitle{font-size:.76rem;color:#718096;margin-top:3px;white-space:normal}
.employee-detail-body{padding:10px 12px;background:#f7f9fc}
.employee-detail-section{background:#fff;border:1px solid #e5eaf1;border-radius:10px;padding:9px 10px;min-width:0}
.employee-detail-section-title{display:flex;align-items:center;gap:6px;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.035em;color:#42526b;padding-bottom:6px;margin-bottom:6px;border-bottom:1px solid #eef2f6}
.employee-detail-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:5px 10px}
.employee-detail-item{min-width:0;padding-bottom:2px}
.employee-detail-item span{display:block;font-size:.66rem;color:#8793a5;line-height:1.15;margin-bottom:1px}
.employee-detail-item strong{display:block;font-size:.77rem;color:#172033;line-height:1.25;font-weight:700;overflow-wrap:anywhere}
.employee-detail-address{font-size:.78rem;line-height:1.35;min-height:76px}
.employee-detail-note{font-size:.78rem;line-height:1.35}
.employee-detail-docs{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.employee-detail-docs .btn{padding:.24rem .45rem;font-size:.7rem}
.employee-doc-missing{display:inline-flex;align-items:center;min-height:26px;padding:3px 7px;border-radius:6px;background:#f1f3f5;color:#7b8491;font-size:.67rem;font-weight:700}
.employee-detail-footer{padding:8px 12px;gap:6px}
.employee-detail-footer .btn{min-height:32px}
@media (max-width:767.98px){
  .employee-detail-modal{max-width:calc(100vw - 16px);margin:8px auto}
  .employee-detail-body{padding:8px}
  .employee-detail-section{padding:8px}
  .employee-detail-grid{grid-template-columns:1fr 1fr;gap:5px 8px}
  .employee-detail-item strong{font-size:.75rem}
}

/* =========================================================
   Compact View / Detail surfaces (global HRIS)
   ========================================================= */
.compact-view-modal{max-width:min(920px,96vw)!important}
.compact-view-modal .modal-content{border-radius:12px;overflow:hidden}
.compact-view-header{padding:.62rem .78rem!important}
.compact-view-header .modal-title{font-size:.94rem!important}
.compact-view-body{padding:.62rem .72rem!important;background:#f7f9fc}
.compact-view-footer{padding:.52rem .72rem!important;gap:.35rem!important;justify-content:flex-end!important}
.compact-view-footer .btn{min-height:30px;padding:.3rem .55rem;font-size:.72rem}
.compact-detail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.compact-detail-item{background:#fff;border:1px solid #e6ebf1;border-radius:8px;padding:7px 8px;min-width:0}
.compact-detail-item span{display:block;font-size:.61rem;text-transform:uppercase;letter-spacing:.045em;color:#8491a1;font-weight:800;line-height:1.15;margin-bottom:2px}
.compact-detail-item b{display:block;font-size:.75rem;line-height:1.25;color:#172033;overflow-wrap:anywhere}
.compact-view-section{background:#fff;border:1px solid #e6ebf1;border-radius:8px;padding:7px 8px}
.compact-view-section-title{display:flex;align-items:center;gap:5px;font-size:.65rem;text-transform:uppercase;letter-spacing:.04em;color:#536273;font-weight:850;margin-bottom:6px;padding-bottom:5px;border-bottom:1px solid #eef2f6}
.user-branch-chip-list{display:flex;flex-wrap:wrap;gap:5px}
.user-branch-chip{display:inline-flex;align-items:center;gap:5px;padding:4px 7px;border-radius:7px;background:#f5f7fa;border:1px solid #e3e8ef;font-size:.7rem;line-height:1.1}
.user-branch-chip b{font-size:.7rem}.user-branch-chip small{font-size:.6rem;color:#7c8898}

/* Existing view/detail modules: denser without changing edit/input forms */
.leave-detail-grid{gap:6px!important}
.leave-detail-grid>div{padding:7px 8px!important;border-radius:8px!important;gap:2px!important}
.leave-detail-grid span,.leave-detail-reason>span{font-size:.61rem!important}
.leave-detail-grid b{font-size:.75rem!important}
.leave-detail-reason{padding:8px 9px!important;border-radius:8px!important}
.leave-detail-reason p{margin:4px 0 5px!important;font-size:.76rem!important;line-height:1.35!important}
.leave-approval-timeline{gap:6px!important}
.leave-timeline-step{padding:7px 8px!important}

.candidate-detail-grid{border-radius:9px!important}
.candidate-detail-grid>div{padding:7px 9px!important}
.candidate-detail-grid span{font-size:.61rem!important}
.candidate-detail-grid b{font-size:.75rem!important;line-height:1.3!important}

.registration-detail-grid{gap:6px!important}
.registration-detail-grid>div{padding:7px 8px!important;border-radius:8px!important}
.registration-detail-grid span{font-size:.61rem!important;margin-bottom:2px!important}
.registration-detail-grid b{font-size:.74rem!important;line-height:1.3!important}

.memo-detail-card{max-width:900px!important}
.memo-detail-card>.card-body{padding:.75rem .85rem!important}
.memo-detail-heading{gap:12px!important;padding-bottom:9px!important}
.memo-detail-kicker{font-size:.61rem!important;margin-bottom:4px!important}
.memo-detail-heading h2{font-size:1.08rem!important;margin-bottom:2px!important}
.memo-detail-heading p{font-size:.76rem!important}
.memo-detail-meta{gap:6px!important;margin:9px 0!important}
.memo-detail-meta>div{padding:7px 8px!important;border-radius:8px!important}
.memo-detail-meta span{font-size:.6rem!important}.memo-detail-meta b{font-size:.74rem!important;margin-top:2px!important}
.memo-detail-body{padding:10px 2px!important;font-size:.8rem!important;line-height:1.55!important}
.memo-detail-sign{margin-top:12px!important}.memo-detail-sign strong{margin-top:26px!important}

#attempt-detail .card-header{padding:.7rem .85rem!important}
#attempt-detail .card-body{padding:.65rem .8rem!important}
#attempt-detail .table td,#attempt-detail .table th{padding:.42rem .5rem!important;font-size:.72rem}

.import-detail-grid{gap:6px!important;padding:12px!important}
.import-detail-grid>div{padding:6px 8px!important;border-radius:7px!important}
.import-detail-grid span{font-size:.6rem!important}.import-detail-grid b{font-size:.72rem!important;line-height:1.3!important}

/* Employee detail was already compact; make it consistent with all other views. */
.employee-detail-body{padding:8px 9px!important}
.employee-detail-section{padding:7px 8px!important;border-radius:8px!important}
.employee-detail-section-title{font-size:.65rem!important;padding-bottom:4px!important;margin-bottom:5px!important}
.employee-detail-grid{gap:4px 8px!important}
.employee-detail-item span{font-size:.61rem!important}.employee-detail-item strong{font-size:.73rem!important}
.employee-detail-address,.employee-detail-note{font-size:.74rem!important;line-height:1.3!important}

@media(max-width:767.98px){
  .compact-view-modal{max-width:calc(100vw - 12px)!important;margin:6px auto!important}
  .compact-detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .compact-view-body{padding:.52rem!important}
}
@media(max-width:479.98px){
  .compact-detail-grid{grid-template-columns:1fr}
  .compact-view-footer{flex-wrap:wrap}
  .compact-view-footer .btn,.compact-view-footer form{flex:1 1 auto}
  .compact-view-footer form .btn{width:100%}
}


/* =========================================================
   Attendance daily recap view + Employee history timeline
   ========================================================= */
.attendance-view-toggle .btn{min-width:104px}
.attendance-recap-card{overflow:hidden}
.attendance-recap-card>.card-header{padding:.55rem .7rem;background:#fff}
.attendance-recap-card>.card-header b{font-size:.82rem}
.attendance-recap-card>.card-header .small-muted{font-size:.65rem}
.attendance-recap-legend{display:flex;gap:5px;flex-wrap:wrap}
.recap-chip{font-size:.61rem;font-weight:750;border-radius:6px;padding:3px 7px;border:1px solid #e5eaf0;background:#fff}
.attendance-recap-scroll{overflow:auto;max-width:100%;position:relative}
.attendance-recap-table{font-size:.68rem;border-collapse:separate;border-spacing:0;white-space:nowrap}
.attendance-recap-table th,.attendance-recap-table td{padding:.3rem .38rem;border-right:1px solid #e7ebf0;border-bottom:1px solid #e7ebf0;vertical-align:middle}
.attendance-recap-table thead th{background:#17365d;color:#fff;text-align:center;font-weight:750;position:sticky;top:0;z-index:4}
.attendance-recap-table thead tr:nth-child(2) th{top:31px;background:#d9eaf7;color:#20354d;font-size:.62rem;z-index:5}
.attendance-recap-table .recap-date-head{min-width:90px;padding:.25rem .3rem}
.attendance-recap-table .recap-date-head span{display:block;font-size:.68rem;line-height:1.05}
.attendance-recap-table .recap-date-head small{display:block;font-size:.56rem;opacity:.82;line-height:1.05;margin-top:2px}
.attendance-recap-table .recap-time{text-align:center;min-width:45px;font-variant-numeric:tabular-nums}
.attendance-recap-table .sticky-col{position:sticky;z-index:3;background:#fff}
.attendance-recap-table thead .sticky-col{z-index:8;background:#17365d}
.attendance-recap-table .recap-nik{left:0;min-width:108px;max-width:108px}
.attendance-recap-table .recap-name{left:108px;min-width:180px;max-width:180px}
.attendance-recap-table .recap-branch{left:288px;min-width:145px;max-width:145px;border-right:2px solid #c7d2df}
.attendance-recap-table td.recap-name,.attendance-recap-table td.recap-branch{overflow:hidden;text-overflow:ellipsis}
.attendance-recap-table td.recap-name a{color:inherit;text-decoration:none}
.attendance-recap-table td.recap-name a:hover{text-decoration:underline}
.attendance-recap-table .recap-late{background:#fff1f0!important;color:#b42318;font-weight:750}
.attendance-recap-table .recap-leave{background:#eaf4ff!important;color:#175cd3;font-weight:750}
.attendance-recap-table .recap-off{background:#f0f2f5!important;color:#667085;font-weight:750}
.recap-chip.recap-late{background:#fff1f0;color:#b42318;border-color:#fecdca}
.recap-chip.recap-leave{background:#eaf4ff;color:#175cd3;border-color:#b2ddff}
.recap-chip.recap-off{background:#f2f4f7;color:#667085;border-color:#d0d5dd}

.employee-detail-tabs-wrap{background:#fff;border-bottom:1px solid #e7ebf0}
.employee-detail-tabs{gap:4px}
.employee-detail-tabs .nav-link{padding:.38rem .65rem;border-radius:7px;font-size:.7rem;font-weight:750;color:#667085}
.employee-detail-tabs .nav-link.active{background:#17365d;color:#fff}
.employee-detail-tabs .nav-link .badge{font-size:.55rem;vertical-align:1px}
.employee-history-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#fff;border:1px solid #e5eaf1;border-radius:8px;padding:7px 9px;margin-bottom:7px}
.employee-history-toolbar>div{display:flex;flex-direction:column;min-width:0}
.employee-history-toolbar b{font-size:.76rem}
.employee-history-toolbar span:not(.badge){font-size:.62rem;color:#7c8797}
.employee-history-timeline{display:flex;flex-direction:column;gap:6px}
.employee-history-event{display:grid;grid-template-columns:30px minmax(0,1fr);gap:7px;align-items:start}
.employee-history-icon{width:30px;height:30px;border-radius:8px;background:#eef3f8;color:#17365d;display:flex;align-items:center;justify-content:center;border:1px solid #dfe6ee;font-size:.8rem}
.employee-history-content{background:#fff;border:1px solid #e5eaf1;border-radius:8px;padding:7px 8px;min-width:0}
.employee-history-top{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}
.employee-history-top>div{min-width:0}
.employee-history-top b{display:block;font-size:.74rem;line-height:1.2;color:#172033}
.employee-history-top span{display:block;font-size:.6rem;color:#8491a1;margin-top:2px}
.employee-history-top .btn{min-height:25px;padding:.18rem .38rem;font-size:.6rem;flex:0 0 auto}
.employee-history-content p{font-size:.68rem;line-height:1.35;color:#536273;margin:5px 0 0;overflow-wrap:anywhere}
.employee-history-empty{background:#fff;border:1px dashed #d7dee8;border-radius:8px;padding:22px;text-align:center;color:#8491a1;display:flex;flex-direction:column;align-items:center;gap:4px}
.employee-history-empty i{font-size:1.2rem}.employee-history-empty b{font-size:.76rem;color:#536273}.employee-history-empty span{font-size:.65rem}
@media(max-width:767.98px){
  .attendance-view-toggle{width:100%}.attendance-view-toggle .btn{flex:1 1 0;min-width:0}
  .attendance-recap-table .recap-nik{min-width:82px;max-width:82px}.attendance-recap-table .recap-name{left:82px;min-width:140px;max-width:140px}.attendance-recap-table .recap-branch{left:222px;min-width:115px;max-width:115px}
  .employee-history-top{gap:5px}.employee-history-top .btn{font-size:0;width:26px}.employee-history-top .btn i{font-size:.68rem}
}