:root{
  --navy:#062745;--navy2:#062745;--blue:#35b84b;--green:#16a34a;--red:#dc2626;
  --orange:#f97316;--bg:#f4f7fb;--card:#ffffff;--text:#062745;--muted:#667085;--line:#e5e7eb;
  /* Extended palette */
  --blue-light:#eff6ff;--blue-dark:#2fb34a;
  --green-light:#f0fdf4;--green-dark:#15803d;
  --red-light:#fef2f2;--red-dark:#b91c1c;
  --orange-light:#fff7ed;--orange-dark:#ea6c00;
  --yellow-light:#fefce8;--yellow-dark:#a16207;
  --gray-50:#f8fafc;--gray-100:#f1f5f9;--gray-200:#e2e8f0;--gray-600:#475569;--gray-900:#062745;
  /* Semantic */
  --success:var(--green);--success-bg:var(--green-light);
  --error:var(--red);--error-bg:var(--red-light);
  --warning:var(--orange);--warning-bg:var(--orange-light);
  --info:var(--blue);--info-bg:var(--blue-light);
  /* Spacing */
  --radius-sm:10px;--radius-md:16px;--radius-lg:24px;--radius-xl:32px;
  /* Shadows */
  --shadow-sm:0 4px 12px rgba(15,23,42,.06);
  --shadow-md:0 12px 35px rgba(15,23,42,.09);
  --shadow-lg:0 24px 60px rgba(15,23,42,.14);
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Cairo',sans-serif;background:linear-gradient(180deg,#eef4fb,#f8fafc);min-height:100vh;color:var(--text);font-variant-numeric:lining-nums tabular-nums}
.hidden{display:none!important}
button,input,select,textarea{font-family:'Cairo',sans-serif}
button{cursor:pointer;border:0;transition:.18s}
button:hover{transform:translateY(-1px)}
.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:22px}
.login-card{width:100%;max-width:1160px;background:#fff;border-radius:34px;overflow:hidden;display:grid;grid-template-columns:1.05fr .95fr;box-shadow:0 28px 80px rgba(15,23,42,.16)}
.brand-panel{background:linear-gradient(135deg,#031f3a,#062745 55%,#2fb34a);color:#fff;padding:52px}
.brand-logo{width:70px;height:70px;border-radius:24px;background:rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;font-size:30px;margin-bottom:24px}
.brand-panel h1{font-size:42px;line-height:1.25;font-weight:900;margin-bottom:14px}
.brand-panel p{color:rgba(255,255,255,.82);line-height:2}
.qr-preview{margin-top:28px;display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.qr-frame{background:#fff;padding:14px;border-radius:22px;width:224px}
.qr-text{max-width:260px;line-height:2;color:rgba(255,255,255,.82);font-weight:700}
.login-form{padding:52px;display:flex;flex-direction:column;justify-content:center}
.login-form h2{font-size:35px;font-weight:900;margin-bottom:8px}
.login-form .sub{color:var(--muted);margin-bottom:28px}
.field{margin-bottom:16px}
.field label{display:block;font-weight:800;margin-bottom:8px}
.input-wrap{position:relative}
.input-wrap i{position:absolute;right:16px;top:50%;transform:translateY(-50%);color:#94a3b8}
.input-wrap input{width:100%;height:58px;padding:0 48px 0 14px;border:1px solid #d0d5dd;border-radius:18px;outline:none;font-size:15px;font-weight:700}
.input-wrap input:focus,input:focus,select:focus,textarea:focus{border-color:var(--blue);box-shadow:0 0 0 5px rgba(37,99,235,.08);outline:none}
.primary{height:58px;background:linear-gradient(135deg,#35b84b,#2fb34a);color:#fff;border-radius:18px;font-size:17px;font-weight:900;width:100%}
.topbar{background:linear-gradient(135deg,#031f3a,#062745);color:#fff;padding:18px 24px;display:flex;justify-content:space-between;align-items:center;box-shadow:0 10px 35px rgba(15,23,42,.15);width:100%;box-sizing:border-box}
.top-brand{display:flex;gap:14px;align-items:center}
.top-brand .icon{width:56px;height:56px;border-radius:18px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.1);font-size:24px}
.top-brand h1{font-size:24px;font-weight:900}
.top-brand p{font-size:13px;color:rgba(255,255,255,.72)}
.top-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.clock{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:15px;padding:10px 14px;font-weight:900}
.logout{background:#334155;color:#fff;border-radius:15px;padding:10px 16px;font-weight:900}
.layout{display:flex;flex-direction:row;gap:18px;padding:20px;min-height:calc(100vh - 80px);align-items:flex-start}
.sidebar{width:260px;min-width:220px;max-width:280px;background:#fff;border:1px solid rgba(226,232,240,.9);border-radius:28px;padding:16px;box-shadow:0 12px 35px rgba(15,23,42,.07);height:fit-content;position:sticky;top:20px;flex-shrink:0}
.side-title{font-size:15px;color:var(--muted);font-weight:900;margin:8px 8px 14px}
.nav-btn{width:100%;height:48px;border-radius:16px;background:#fff;color:#1e293b;font-weight:900;text-align:right;padding:0 14px;margin-bottom:4px;border:1px solid transparent;display:flex;align-items:center;gap:10px;font-size:14px}
.nav-btn.active,.nav-btn:hover{background:#062745;color:#fff}
.content{flex:1;min-width:0;overflow-x:hidden}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:18px}
.stat{background:#fff;border:1px solid rgba(226,232,240,.9);border-radius:26px;padding:22px;box-shadow:0 12px 35px rgba(15,23,42,.07);position:relative;overflow:hidden}
.stat i{position:absolute;left:20px;top:20px;font-size:32px;color:#062745;opacity:.08}
.stat h2{font-size:36px;font-weight:900;margin-bottom:4px}
.stat p{color:var(--muted);font-weight:800}
.panel{background:#fff;border:1px solid rgba(226,232,240,.9);border-radius:28px;padding:22px;box-shadow:0 12px 35px rgba(15,23,42,.07);margin-bottom:18px}
.panel-title{font-size:22px;font-weight:900;margin-bottom:16px;display:flex;gap:10px;align-items:center}
.grid-form{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:14px}
.grid-form.cols-3{grid-template-columns:repeat(3,1fr)}
.form-card{background:#f8fafc;border:1px solid #e2e8f0;border-radius:24px;padding:18px}
.form-card h3{font-size:18px;font-weight:900;margin-bottom:12px;color:#062745}
.form-item label{display:block;font-weight:900;font-size:13px;margin-bottom:7px;color:#334155}
.form-item input,.form-item select,.form-item textarea{width:100%;height:50px;border:1px solid #d0d5dd;border-radius:15px;padding:0 12px;font-weight:700;background:#fff}
.form-item textarea{height:88px;padding-top:12px;resize:vertical}
.btn-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.btn{height:48px;border-radius:15px;font-weight:900;color:#fff;background:#334155;padding:0 18px}
.btn.blue{background:var(--blue)}.btn.green{background:var(--green)}.btn.red{background:var(--red)}.btn.orange{background:var(--orange)}
.table-wrap{overflow:auto;border-radius:18px;border:1px solid var(--line)}
table{width:100%;border-collapse:collapse;background:#fff}
thead{background:#062745;color:#fff}
th,td{padding:13px 10px;text-align:center;border-bottom:1px solid #edf2f7;white-space:nowrap;font-size:13px}
tbody tr:hover{background:#f8fafc}
.badge{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:6px 12px;font-size:12px;font-weight:900}
.badge.green{background:#dcfce7;color:#166534}.badge.red{background:#fee2e2;color:#991b1b}.badge.blue{background:#dbeafe;color:#1e40af}.badge.orange{background:#ffedd5;color:#9a3412}.badge.gray{background:#f1f5f9;color:#334155}
.mini-btn{padding:7px 10px;border-radius:10px;color:#fff;font-weight:900;background:#475467;margin:2px}
.mini-btn.red{background:var(--red)}.mini-btn.blue{background:var(--blue)}
.employee-qr{width:258px;margin:auto;background:#fff;border:1px solid var(--line);padding:14px;border-radius:24px}
.note{margin-top:15px;line-height:1.9;color:var(--muted);text-align:center;font-size:14px}
.mobile-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:16px}
.phone-card{width:100%;max-width:470px;background:#fff;border-radius:32px;box-shadow:0 24px 70px rgba(15,23,42,.16);border:1px solid rgba(226,232,240,.9);overflow:hidden}
.phone-head{background:linear-gradient(135deg,#031f3a,#2fb34a);color:#fff;padding:26px;text-align:center}
.phone-head .circle{width:72px;height:72px;border-radius:24px;background:rgba(255,255,255,.13);display:flex;align-items:center;justify-content:center;margin:0 auto 14px;font-size:30px}
.phone-body{padding:24px}
.mobile-title{font-size:25px;font-weight:900;margin-bottom:8px}
.mobile-sub{color:var(--muted);line-height:1.8;margin-bottom:18px}
.mobile-form input,.mobile-form select,.mobile-form textarea{width:100%;border:1px solid #d0d5dd;border-radius:18px;padding:0 14px;margin-bottom:12px;font-weight:800;background:#fff}
.mobile-form input,.mobile-form select{height:56px}
.mobile-form textarea{height:90px;padding-top:12px}
.big-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:15px}
.big-actions button{height:74px;border-radius:22px;color:#fff;font-size:22px;font-weight:900;display:flex;align-items:center;justify-content:center;gap:12px;line-height:1}
.big-actions button i{font-size:24px}.big-actions button span{font-size:22px;font-weight:900}
.in-btn{background:linear-gradient(135deg,#16a34a,#15803d)}.out-btn{background:linear-gradient(135deg,#dc2626,#b91c1c)}
.emp-box{background:#f8fafc;border:1px solid #e2e8f0;border-radius:22px;padding:18px;margin-bottom:14px;line-height:2}
.msg{margin-top:14px;padding:14px;border-radius:16px;display:none;font-weight:900;line-height:1.8}
.msg.show{display:block}.msg.ok{background:#dcfce7;color:#166534}.msg.err{background:#fee2e2;color:#991b1b}.msg.info{background:#dbeafe;color:#1e40af}
.report-tabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:18px}
.report-tab-btn{height:48px;padding:0 18px;border-radius:14px;background:#eef2ff;color:#1e293b;font-weight:900}
.report-tab-btn.active{background:#062745;color:#fff}
.report-pane{display:none}.report-pane.active{display:block}
.reply-close-btn{margin-top:10px;height:38px;padding:0 14px;border-radius:12px;background:#062745;color:#fff;font-weight:900}
.report-summary-cards{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin:14px 0}
.report-summary-card{background:linear-gradient(180deg,#fff,#f8fafc);border:1px solid #e2e8f0;border-radius:18px;padding:14px;box-shadow:0 8px 24px rgba(15,23,42,.06);text-align:center}
.report-summary-card b{display:block;font-size:22px;font-weight:900;color:#062745}.report-summary-card span{color:#64748b;font-size:12px;font-weight:900}
.absence-row td{background:#fff1f2!important;color:#991b1b;font-weight:900}.weekly-row td{background:#f8fafc!important;color:#475569}.holiday-row td{background:#eff6ff!important;color:#1e40af;font-weight:900}
.late-cell{color:#b45309;font-weight:900}.overtime-cell{color:#166534;font-weight:900}
.report-status-badge{display:inline-flex;align-items:center;justify-content:center;min-width:72px;border-radius:999px;padding:6px 10px;font-weight:900;font-size:12px}
.report-status-badge.abs{background:#fee2e2;color:#991b1b}.report-status-badge.work{background:#dcfce7;color:#166534}.report-status-badge.off{background:#f1f5f9;color:#334155}
@media(max-width:900px){.layout{flex-direction:column}.sidebar{width:100%;max-width:100%;position:static}.stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.login-card{grid-template-columns:1fr}.grid-form,.grid-form.cols-3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.brand-panel,.login-form{padding:28px}.brand-panel h1{font-size:30px}.topbar{flex-direction:column;text-align:center;gap:12px}.stats{grid-template-columns:1fr}.grid-form,.grid-form.cols-3{grid-template-columns:1fr}.big-actions{grid-template-columns:1fr}.sidebar{border-radius:18px}.layout{padding:12px;gap:12px}}
@media print{
  @page{size:A4 landscape;margin:6mm}
  button,.sidebar,.top-actions,.grid-form,.btn-row,.report-tabs{display:none!important}
  .panel,.stat,.phone-card,.login-card{box-shadow:none}
  #dailyReport .table-wrap{overflow:visible!important;border:0!important}
  #dailyReport table{width:100%!important;table-layout:fixed!important;border-collapse:collapse!important;font-size:8.5px!important}
  #dailyReport th,#dailyReport td{white-space:normal!important;overflow-wrap:break-word!important;padding:4px 3px!important;line-height:1.35!important;vertical-align:middle!important}
  #dailyReport thead{display:table-header-group!important}
  #dailyReport th{background:#062745!important;color:#fff!important;-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important;font-weight:900!important}
}

.dashboard-indicators{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin:0 0 18px}
.indicator-card{background:#fff;border:1px solid #e2e8f0;border-radius:24px;padding:18px;box-shadow:0 12px 35px rgba(15,23,42,.06)}
.indicator-card span{display:block;color:#64748b;font-size:13px;font-weight:900;margin-bottom:8px}
.indicator-card b{font-size:28px;font-weight:900;color:#062745}
.pdf-page{width:210mm;min-height:297mm;background:#fff;margin:0 auto 10mm;padding:10mm;page-break-after:always;color:#062745}
.pdf-head{display:flex;justify-content:space-between;border-bottom:2px solid #062745;padding-bottom:8px;margin-bottom:10px}
.pdf-head h1{font-size:20px;margin:0;font-weight:900}.pdf-meta{text-align:left;font-size:11px;font-weight:800;line-height:1.8}
.pdf-cards{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin:10px 0}
.pdf-card{border:1px solid #e2e8f0;border-radius:12px;padding:7px;text-align:center;background:#f8fafc}.pdf-card b{display:block;font-size:14px;font-weight:900}.pdf-card span{font-size:9px;color:#64748b;font-weight:900}
.pdf-table{width:100%;border-collapse:collapse;font-size:8.3px;table-layout:fixed}.pdf-table th{background:#062745;color:#fff;padding:5px 3px;border:1px solid #062745}.pdf-table td{padding:4px 3px;border:1px solid #cbd5e1;text-align:center;word-break:break-word}
.pdf-signatures{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:18px;font-size:11px;font-weight:900}.pdf-sign{padding-top:24px;border-top:1px solid #062745;text-align:center}
@media(max-width:900px){.dashboard-indicators{grid-template-columns:repeat(2,1fr)}}
@media print{.pdf-page{margin:0;page-break-after:always}.pdf-print-button{display:none!important}}


/* ===== Enterprise Attendance PDF Report ===== */
.pro-pdf-overlay{
  position:fixed;
  inset:0;
  background:rgba(15,23,42,.55);
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:999999;
}
.pro-pdf-loader{
  background:#fff;
  border-radius:24px;
  padding:28px 34px;
  box-shadow:0 30px 90px rgba(15,23,42,.30);
  font-weight:900;
  color:#062745;
  text-align:center;
}
.pro-pdf-loader i{
  font-size:30px;
  color:#35b84b;
  margin-bottom:12px;
}
.pro-report-container{
  direction:rtl;
  font-family:Cairo, Arial, sans-serif;
  color:#062745;
  background:#ffffff;
}
.pro-report-page{
  width:210mm;
  min-height:297mm;
  background:#ffffff;
  padding:7mm;
  box-sizing:border-box;
  position:relative;
  page-break-after:always;
  overflow:hidden;
}
.pro-report-watermark{
  position:absolute;
  inset:auto 0 38mm 0;
  text-align:center;
  font-size:62px;
  font-weight:900;
  color:rgba(15,23,42,.035);
  transform:rotate(-18deg);
  pointer-events:none;
  z-index:0;
}
.pro-report-page > *:not(.pro-report-watermark){
  position:relative;
  z-index:1;
}
.pro-cover{
  background:linear-gradient(180deg,#ffffff 0%,#f8fafc 100%);
}
.pro-cover-hero{
  border-radius:28px;
  padding:24px;
  min-height:90mm;
  background:linear-gradient(135deg,#062745,#1e3a8a);
  color:#fff;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  overflow:hidden;
  position:relative;
}
.pro-cover-hero:after{
  content:"";
  position:absolute;
  width:180mm;
  height:180mm;
  border-radius:50%;
  background:rgba(255,255,255,.06);
  left:-80mm;
  top:-75mm;
}
.pro-cover-brand{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:20px;
}
.pro-cover-company h1{
  margin:0;
  font-size:24px;
  font-weight:900;
}
.pro-cover-company p{
  margin:4px 0 0;
  font-size:12px;
  color:rgba(255,255,255,.75);
}
.pro-cover-logo{
  min-width:74px;
  height:74px;
  border-radius:24px;
  background:#fff;
  color:#062745;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:20px;
  font-weight:900;
  letter-spacing:1px;
}
.pro-cover-title h2{
  margin:0;
  font-size:34px;
  font-weight:900;
}
.pro-cover-title p{
  margin:8px 0 0;
  color:rgba(255,255,255,.82);
  font-size:14px;
}
.pro-cover-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin-top:14mm;
}
.pro-cover-card{
  background:#fff;
  border:1px solid #e2e8f0;
  border-radius:20px;
  padding:16px;
  box-shadow:0 12px 30px rgba(15,23,42,.06);
}
.pro-cover-card span{
  display:block;
  font-size:11px;
  color:#64748b;
  font-weight:900;
  margin-bottom:8px;
}
.pro-cover-card b{
  display:block;
  font-size:26px;
  color:#062745;
  font-weight:900;
}
.pro-cover-footer{
  position:absolute;
  bottom:8mm;
  left:7mm;
  right:7mm;
  border-top:2px solid #062745;
  padding-top:8px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:10px;
  color:#475569;
  font-weight:800;
}
.pro-page-head{
  display:grid;
  grid-template-columns:1fr auto;
  gap:14px;
  align-items:start;
  border-bottom:3px solid #062745;
  padding-bottom:8px;
  margin-bottom:9px;
}
.pro-emp-title h2{
  margin:0;
  font-size:18px;
  font-weight:900;
  color:#062745;
}
.pro-emp-title p{
  margin:3px 0 0;
  font-size:10px;
  color:#64748b;
  font-weight:800;
}
.pro-emp-meta{
  display:grid;
  grid-template-columns:repeat(2,auto);
  gap:4px 14px;
  text-align:left;
  font-size:9.5px;
  font-weight:900;
  color:#334155;
}
.pro-emp-meta span{
  color:#64748b;
  font-weight:800;
}
.pro-summary-cards{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:6px;
  margin:8px 0 9px;
}
.pro-summary-card{
  border:1px solid #cbd5e1;
  background:#f8fafc;
  border-radius:14px;
  padding:7px 5px;
  text-align:center;
}
.pro-summary-card span{
  display:block;
  font-size:8.5px;
  color:#64748b;
  font-weight:900;
  margin-bottom:3px;
}
.pro-summary-card b{
  display:block;
  font-size:14px;
  color:#062745;
  font-weight:900;
}
.pro-att-table{
  width:100%;
  border-collapse:collapse;
  table-layout:fixed;
  font-size:7.9px;
  border:1px solid #cbd5e1;
}
.pro-att-table th{
  background:#062745;
  color:#fff;
  padding:5px 2px;
  border:1px solid #062745;
  font-weight:900;
  line-height:1.25;
}
.pro-att-table td{
  border:1px solid #cbd5e1;
  padding:4px 2px;
  text-align:center;
  line-height:1.25;
  word-break:break-word;
}
.pro-att-table .status-present td{background:#f0fdf4}
.pro-att-table .status-absent td{background:#fef2f2;color:#991b1b;font-weight:900}
.pro-att-table .status-late td{background:#fff7ed}
.pro-att-table .status-holiday td{background:#eff6ff;color:#1e40af;font-weight:900}
.pro-att-table .status-weekly td{background:#f8fafc;color:#475569}
.pro-badge{
  display:inline-block;
  border-radius:999px;
  padding:2px 6px;
  font-size:7.5px;
  font-weight:900;
}
.pro-badge.present{background:#dcfce7;color:#166534}
.pro-badge.absent{background:#fee2e2;color:#991b1b}
.pro-badge.late{background:#ffedd5;color:#9a3412}
.pro-badge.holiday{background:#dbeafe;color:#1e40af}
.pro-signatures{
  position:absolute;
  bottom:17mm;
  left:7mm;
  right:7mm;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  font-size:10px;
  font-weight:900;
}
.pro-sign{
  text-align:center;
  padding-top:18px;
  border-top:1.5px solid #062745;
}
.pro-page-footer{
  position:absolute;
  bottom:7mm;
  left:7mm;
  right:7mm;
  display:flex;
  justify-content:space-between;
  align-items:center;
  border-top:1px solid #cbd5e1;
  padding-top:5px;
  font-size:8.5px;
  color:#64748b;
  font-weight:800;
}
.pro-qr{
  width:34px;
  height:34px;
  border:1px solid #cbd5e1;
  border-radius:6px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:7px;
  color:#64748b;
}
.pro-pdf-source{
  position:absolute;
  left:-99999px;
  top:0;
  width:210mm;
  background:#fff;
}
@media print{
  .pro-report-page{margin:0;page-break-after:always}
}


/* ===== FORCED ENTERPRISE PDF REPORT V2 ===== */
.ent-loading{
  position:fixed;inset:0;background:rgba(15,23,42,.72);z-index:999999;
  display:flex;align-items:center;justify-content:center;font-family:Cairo,Arial,sans-serif;
}
.ent-loading-box{
  width:360px;background:white;border-radius:28px;padding:32px;text-align:center;
  box-shadow:0 35px 120px rgba(0,0,0,.35);color:#062745;font-weight:900;
}
.ent-loading-box .icon{font-size:44px;color:#dc2626;margin-bottom:12px}
.ent-pdf-root{
  direction:rtl;
  font-family:Cairo,Arial,sans-serif;
  width:210mm;
  background:#fff;
  color:#062745;
}
.ent-page{
  width:210mm;
  height:297mm;
  background:#fff;
  padding:8mm;
  box-sizing:border-box;
  position:relative;
  overflow:hidden;
  page-break-after:always;
}
.ent-page::before{
  content:"NAHAM HR";
  position:absolute;
  top:125mm;
  left:-8mm;
  right:-8mm;
  text-align:center;
  font-size:64px;
  font-weight:900;
  color:rgba(15,23,42,.035);
  transform:rotate(-20deg);
  z-index:0;
}
.ent-page > *{position:relative;z-index:1}
.ent-cover-band{
  height:96mm;
  background:linear-gradient(135deg,#06111f,#062745 45%,#2fb34a);
  border-radius:30px;
  color:#fff;
  padding:24px;
  box-sizing:border-box;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  overflow:hidden;
}
.ent-cover-top{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
}
.ent-logo{
  width:76px;height:76px;border-radius:24px;background:#fff;color:#062745;
  display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:900;
}
.ent-company h1{margin:0;font-size:25px;font-weight:900;line-height:1.35}
.ent-company p{margin:4px 0 0;font-size:12px;color:rgba(255,255,255,.78)}
.ent-cover-title h2{margin:0;font-size:36px;font-weight:900;line-height:1.25}
.ent-cover-title p{margin:8px 0 0;font-size:14px;color:rgba(255,255,255,.85)}
.ent-cover-cards{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin-top:16mm;
}
.ent-cover-card{
  background:#fff;
  border:1px solid #e2e8f0;
  border-radius:20px;
  padding:16px;
  box-shadow:0 14px 36px rgba(15,23,42,.08);
}
.ent-cover-card span{display:block;font-size:11px;color:#64748b;font-weight:900;margin-bottom:8px}
.ent-cover-card b{display:block;font-size:25px;color:#062745;font-weight:900}
.ent-header{
  display:grid;
  grid-template-columns:1fr auto;
  gap:18px;
  border-bottom:3px solid #062745;
  padding-bottom:9px;
  margin-bottom:10px;
}
.ent-header h2{margin:0;font-size:19px;font-weight:900;color:#062745}
.ent-header p{margin:3px 0 0;font-size:10px;color:#64748b;font-weight:800}
.ent-meta{
  display:grid;
  grid-template-columns:auto auto;
  gap:4px 14px;
  text-align:left;
  font-size:9.5px;
  color:#334155;
  font-weight:900;
  line-height:1.5;
}
.ent-meta span{color:#64748b;font-weight:800}
.ent-kpis{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:6px;
  margin:8px 0 10px;
}
.ent-kpi{
  background:#f8fafc;
  border:1px solid #cbd5e1;
  border-radius:14px;
  padding:7px 4px;
  text-align:center;
}
.ent-kpi span{display:block;font-size:8.5px;color:#64748b;font-weight:900;margin-bottom:3px}
.ent-kpi b{font-size:14px;color:#062745;font-weight:900}
.ent-table{
  width:100%;
  border-collapse:collapse;
  table-layout:fixed;
  font-size:7.8px;
  border:1px solid #cbd5e1;
}
.ent-table th{
  background:#062745;
  color:#fff;
  border:1px solid #062745;
  padding:5px 2px;
  font-weight:900;
  line-height:1.25;
}
.ent-table td{
  border:1px solid #cbd5e1;
  padding:4px 2px;
  text-align:center;
  line-height:1.25;
  word-break:break-word;
}
.ent-present td{background:#f0fdf4}
.ent-absent td{background:#fef2f2!important;color:#991b1b;font-weight:900}
.ent-late td{background:#fff7ed!important}
.ent-holiday td{background:#eff6ff!important;color:#1e40af;font-weight:900}
.ent-weekly td{background:#f8fafc!important;color:#475569}
.ent-badge{
  border-radius:999px;
  display:inline-block;
  padding:2px 7px;
  font-size:7.5px;
  font-weight:900;
}
.ent-badge.present{background:#dcfce7;color:#166534}
.ent-badge.absent{background:#fee2e2;color:#991b1b}
.ent-badge.late{background:#ffedd5;color:#9a3412}
.ent-badge.holiday{background:#dbeafe;color:#1e40af}
.ent-signatures{
  position:absolute;
  bottom:17mm;
  left:8mm;
  right:8mm;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
  font-size:10px;
  font-weight:900;
}
.ent-sign{border-top:1.5px solid #062745;padding-top:18px;text-align:center}
.ent-footer{
  position:absolute;
  bottom:7mm;
  left:8mm;
  right:8mm;
  border-top:1px solid #cbd5e1;
  padding-top:5px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:8.5px;
  color:#64748b;
  font-weight:800;
}
.ent-qr{
  width:30px;height:30px;border:1px solid #cbd5e1;border-radius:6px;
  display:flex;align-items:center;justify-content:center;font-size:7px;color:#64748b;
}
.ent-source{
  position:fixed;
  left:-10000px;
  top:0;
  width:210mm;
  background:#fff;
}
@media print{
  .ent-page{page-break-after:always;margin:0}
}


/* ===== FINAL ONE-PAGE A4 LANDSCAPE ATTENDANCE PDF ===== */
.final-pdf-loading{
  position:fixed;
  inset:0;
  z-index:9999999;
  background:rgba(15,23,42,.72);
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:Cairo,Arial,sans-serif;
}
.final-pdf-loading-box{
  background:#fff;
  color:#062745;
  border-radius:24px;
  padding:26px 34px;
  width:380px;
  text-align:center;
  font-weight:900;
  box-shadow:0 34px 120px rgba(0,0,0,.35);
}
.final-pdf-source{
  position:fixed;
  left:-12000px;
  top:0;
  width:297mm;
  background:#fff;
}
.final-report-root{
  direction:rtl;
  font-family:Cairo,Arial,sans-serif;
  color:#062745;
  background:#fff;
}
.final-report-page{
  width:297mm;
  height:210mm;
  background:#fff;
  padding:5mm;
  box-sizing:border-box;
  position:relative;
  overflow:hidden;
  page-break-after:always;
}
.final-report-page:before{
  content:"NAHAM HR";
  position:absolute;
  top:82mm;
  left:-25mm;
  width:345mm;
  text-align:center;
  font-size:54px;
  font-weight:900;
  color:rgba(15,23,42,.028);
  transform:rotate(-14deg);
  z-index:0;
}
.final-report-page > *{
  position:relative;
  z-index:1;
}
.final-report-header{
  display:grid;
  grid-template-columns:1.4fr auto 1.4fr;
  align-items:center;
  gap:10px;
  border-bottom:2.5px solid #062745;
  padding-bottom:5px;
  margin-bottom:5px;
}
.final-company{
  text-align:right;
}
.final-company h1{
  margin:0;
  font-size:15px;
  font-weight:900;
  line-height:1.3;
}
.final-company p{
  margin:1px 0;
  font-size:8.5px;
  color:#64748b;
  font-weight:800;
}
.final-title{
  text-align:center;
}
.final-title h2{
  margin:0;
  font-size:16px;
  font-weight:900;
}
.final-title p{
  margin:2px 0 0;
  font-size:8.5px;
  color:#64748b;
  font-weight:800;
}
.final-logo{
  justify-self:left;
  width:48px;
  height:48px;
  border-radius:16px;
  background:linear-gradient(135deg,#062745,#35b84b);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:13px;
  font-weight:900;
}
.final-employee-strip{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:5px;
  margin-bottom:5px;
}
.final-info{
  border:1px solid #cbd5e1;
  background:#f8fafc;
  border-radius:10px;
  padding:5px 6px;
  min-height:25px;
}
.final-info span{
  display:block;
  color:#64748b;
  font-size:7.5px;
  font-weight:900;
  line-height:1.1;
}
.final-info b{
  display:block;
  color:#062745;
  font-size:9.5px;
  font-weight:900;
  line-height:1.2;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.final-kpis{
  display:grid;
  grid-template-columns:repeat(7,1fr);
  gap:5px;
  margin-bottom:5px;
}
.final-kpi{
  border:1px solid #cbd5e1;
  border-radius:10px;
  background:#fff;
  padding:5px 4px;
  text-align:center;
}
.final-kpi span{
  display:block;
  color:#64748b;
  font-size:7.2px;
  font-weight:900;
  margin-bottom:1px;
}
.final-kpi b{
  font-size:12px;
  font-weight:900;
  color:#062745;
}
.final-kpi.green{background:#f0fdf4;border-color:#bbf7d0}
.final-kpi.red{background:#fef2f2;border-color:#fecaca}
.final-kpi.orange{background:#fff7ed;border-color:#fed7aa}
.final-kpi.blue{background:#eff6ff;border-color:#bfdbfe}
.final-att-table{
  width:100%;
  border-collapse:collapse;
  table-layout:fixed;
  font-size:6.7px;
  line-height:1.08;
  border:1px solid #cbd5e1;
}
.final-att-table th{
  background:#062745;
  color:#fff;
  border:1px solid #062745;
  padding:3px 1.5px;
  font-weight:900;
  text-align:center;
}
.final-att-table td{
  border:1px solid #cbd5e1;
  padding:2.3px 1.5px;
  text-align:center;
  vertical-align:middle;
  word-break:break-word;
}
.final-row-present td{background:#f0fdf4}
.final-row-absent td{background:#fef2f2;color:#991b1b;font-weight:900}
.final-row-late td{background:#fff7ed}
.final-row-holiday td{background:#eff6ff;color:#1e40af;font-weight:900}
.final-row-weekly td{background:#f8fafc;color:#475569}
.final-badge{
  display:inline-block;
  border-radius:99px;
  padding:1px 4px;
  font-size:6.3px;
  font-weight:900;
  white-space:nowrap;
}
.final-badge.present{background:#dcfce7;color:#166534}
.final-badge.absent{background:#fee2e2;color:#991b1b}
.final-badge.late{background:#ffedd5;color:#9a3412}
.final-badge.holiday{background:#dbeafe;color:#1e40af}
.final-signatures{
  position:absolute;
  bottom:10mm;
  left:5mm;
  right:5mm;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  font-size:8px;
  font-weight:900;
}
.final-sign{
  text-align:center;
  padding-top:10px;
  border-top:1.2px solid #062745;
}
.final-footer{
  position:absolute;
  bottom:4.5mm;
  left:5mm;
  right:5mm;
  border-top:1px solid #cbd5e1;
  padding-top:3px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:7px;
  color:#64748b;
  font-weight:800;
}
.final-status-note{
  display:flex;
  gap:6px;
  align-items:center;
}
@media print{
  @page{size:A4 landscape;margin:0}
  .final-report-page{margin:0;page-break-after:always}
}


/* ===== PORTRAIT A4 ONE EMPLOYEE MONTH REPORT ===== */
.portrait-report-page{
  width:210mm;
  height:297mm;
  background:#fff;
  box-sizing:border-box;
  padding:6mm;
  position:relative;
  overflow:hidden;
  page-break-after:always;
  font-family:Cairo,Arial,sans-serif;
  color:#062745;
  direction:rtl;
}
.portrait-report-page *{
  box-sizing:border-box;
}
.portrait-report-page:before{
  content:"NAHAM HR";
  position:absolute;
  top:125mm;
  right:-30mm;
  width:270mm;
  text-align:center;
  font-size:46px;
  font-weight:900;
  color:rgba(15,23,42,.027);
  transform:rotate(-22deg);
  z-index:0;
}
.portrait-report-page > *{
  position:relative;
  z-index:1;
}
.portrait-head{
  display:grid;
  grid-template-columns:1fr auto;
  gap:8px;
  align-items:start;
  border-bottom:2.4px solid #062745;
  padding-bottom:5px;
  margin-bottom:5px;
}
.portrait-title h1{
  margin:0;
  font-size:15px;
  line-height:1.25;
  font-weight:900;
}
.portrait-title p{
  margin:1px 0;
  font-size:7.5px;
  color:#64748b;
  font-weight:800;
}
.portrait-logo{
  width:44px;
  height:44px;
  border-radius:13px;
  background:linear-gradient(135deg,#062745,#35b84b);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:11px;
  font-weight:900;
}
.portrait-info-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:4px;
  margin-bottom:4px;
}
.portrait-info{
  border:1px solid #cbd5e1;
  background:#f8fafc;
  border-radius:8px;
  padding:4px 5px;
  min-height:22px;
}
.portrait-info span{
  display:block;
  color:#64748b;
  font-size:6.5px;
  font-weight:900;
  line-height:1;
  margin-bottom:2px;
}
.portrait-info b{
  display:block;
  color:#062745;
  font-size:8.2px;
  font-weight:900;
  line-height:1.15;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.portrait-kpis{
  display:grid;
  grid-template-columns:repeat(7,1fr);
  gap:3.5px;
  margin-bottom:4px;
}
.portrait-kpi{
  border:1px solid #cbd5e1;
  background:#fff;
  border-radius:8px;
  padding:3.5px 2px;
  text-align:center;
}
.portrait-kpi span{
  display:block;
  font-size:5.8px;
  color:#64748b;
  font-weight:900;
  line-height:1.05;
}
.portrait-kpi b{
  display:block;
  font-size:9.4px;
  color:#062745;
  font-weight:900;
  line-height:1.15;
}
.portrait-kpi.green{background:#f0fdf4;border-color:#bbf7d0}
.portrait-kpi.red{background:#fef2f2;border-color:#fecaca}
.portrait-kpi.orange{background:#fff7ed;border-color:#fed7aa}
.portrait-kpi.blue{background:#eff6ff;border-color:#bfdbfe}
.portrait-table{
  width:100%;
  border-collapse:collapse;
  table-layout:fixed;
  font-size:5.75px;
  line-height:1.05;
  border:1px solid #cbd5e1;
}
.portrait-table th{
  background:#062745;
  color:#fff;
  border:1px solid #062745;
  padding:2.35px 1px;
  font-weight:900;
  text-align:center;
}
.portrait-table td{
  border:1px solid #cbd5e1;
  padding:1.85px .8px;
  text-align:center;
  vertical-align:middle;
  word-break:break-word;
  height:5.55mm;
}
.portrait-present td{background:#f0fdf4}
.portrait-absent td{background:#fef2f2;color:#991b1b;font-weight:900}
.portrait-late td{background:#fff7ed}
.portrait-holiday td{background:#eff6ff;color:#1e40af;font-weight:900}
.portrait-weekly td{background:#f8fafc;color:#475569}
.portrait-badge{
  display:inline-block;
  border-radius:99px;
  padding:1px 3px;
  font-size:5.2px;
  font-weight:900;
  white-space:nowrap;
}
.portrait-badge.present{background:#dcfce7;color:#166534}
.portrait-badge.absent{background:#fee2e2;color:#991b1b}
.portrait-badge.late{background:#ffedd5;color:#9a3412}
.portrait-badge.holiday{background:#dbeafe;color:#1e40af}
.portrait-signatures{
  position:absolute;
  bottom:10mm;
  left:6mm;
  right:6mm;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
  font-size:7px;
  font-weight:900;
}
.portrait-sign{
  text-align:center;
  border-top:1px solid #062745;
  padding-top:7px;
}
.portrait-footer{
  position:absolute;
  bottom:4.5mm;
  left:6mm;
  right:6mm;
  display:flex;
  justify-content:space-between;
  border-top:1px solid #cbd5e1;
  padding-top:2.5px;
  color:#64748b;
  font-size:6.2px;
  font-weight:800;
}
.portrait-print-toolbar{
  position:sticky;
  top:0;
  z-index:999;
  background:#062745;
  padding:10px;
  text-align:center;
}
.portrait-print-toolbar button{
  background:#35b84b;
  color:#fff;
  border:0;
  border-radius:10px;
  padding:10px 22px;
  font-family:Cairo,Arial,sans-serif;
  font-weight:900;
  cursor:pointer;
}
@media print{
  @page{size:A4 portrait;margin:0}
  body{margin:0!important;background:#fff!important}
  .portrait-print-toolbar{display:none!important}
  .portrait-report-page{margin:0!important;page-break-after:always}
}


/* ===== EXECUTIVE PORTRAIT HR MONTHLY REPORT ===== */
.exec-report-page{
  width:210mm;
  height:297mm;
  padding:7mm;
  background:#fff;
  box-sizing:border-box;
  overflow:hidden;
  page-break-after:always;
  font-family:Cairo,Arial,sans-serif;
  color:#062745;
  direction:rtl;
  position:relative;
}
.exec-report-page *{box-sizing:border-box}
.exec-report-page:before{
  content:"NAHAM HR";
  position:absolute;
  top:128mm;
  right:-28mm;
  width:270mm;
  text-align:center;
  font-size:44px;
  font-weight:900;
  color:rgba(15,23,42,.026);
  transform:rotate(-22deg);
  z-index:0;
}
.exec-report-page>*{position:relative;z-index:1}
.exec-ribbon{
  height:20mm;
  background:linear-gradient(135deg,#062745,#1e3a8a);
  border-radius:18px;
  color:#fff;
  padding:5mm;
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:4mm;
}
.exec-ribbon h1{
  margin:0;
  font-size:14px;
  line-height:1.25;
  font-weight:900;
}
.exec-ribbon p{
  margin:2px 0 0;
  font-size:7.2px;
  color:rgba(255,255,255,.82);
  font-weight:700;
}
.exec-logo{
  width:33px;
  height:33px;
  border-radius:11px;
  background:#fff;
  color:#062745;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:9px;
  font-weight:900;
}
.exec-section-title{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:3mm;
  border-bottom:1.8px solid #062745;
  padding-bottom:2mm;
}
.exec-section-title h2{
  margin:0;
  font-size:13.5px;
  font-weight:900;
}
.exec-section-title span{
  font-size:7.5px;
  color:#64748b;
  font-weight:900;
}
.exec-info{
  display:grid;
  grid-template-columns:1.2fr .8fr 1fr .75fr;
  gap:3mm;
  margin-bottom:3mm;
}
.exec-info-box{
  border:1px solid #cbd5e1;
  background:#f8fafc;
  border-radius:10px;
  padding:2.5mm;
  min-height:12mm;
}
.exec-info-box label{
  display:block;
  font-size:6.3px;
  color:#64748b;
  font-weight:900;
  margin-bottom:1mm;
}
.exec-info-box b{
  display:block;
  font-size:8.6px;
  color:#062745;
  font-weight:900;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.exec-kpis{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:2mm;
  margin-bottom:3mm;
}
.exec-kpi{
  border:1px solid #cbd5e1;
  background:#fff;
  border-radius:10px;
  padding:2mm 1mm;
  text-align:center;
}
.exec-kpi label{
  display:block;
  font-size:5.8px;
  color:#64748b;
  font-weight:900;
  margin-bottom:.8mm;
}
.exec-kpi b{
  display:block;
  font-size:11px;
  color:#062745;
  font-weight:900;
  line-height:1.1;
}
.exec-kpi.green{background:#f0fdf4;border-color:#bbf7d0}
.exec-kpi.red{background:#fef2f2;border-color:#fecaca}
.exec-kpi.orange{background:#fff7ed;border-color:#fed7aa}
.exec-kpi.blue{background:#eff6ff;border-color:#bfdbfe}
.exec-days-layout{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:3mm;
  margin-top:1mm;
}
.exec-mini-table{
  width:100%;
  border-collapse:collapse;
  table-layout:fixed;
  font-size:6.3px;
  border:1px solid #cbd5e1;
}
.exec-mini-table th{
  background:#062745;
  color:#fff;
  border:1px solid #062745;
  padding:2.4px 1px;
  font-weight:900;
  line-height:1.1;
}
.exec-mini-table td{
  border:1px solid #cbd5e1;
  padding:2.2px 1px;
  text-align:center;
  line-height:1.08;
  height:6.4mm;
  overflow:hidden;
  vertical-align:middle;
}
.exec-present td{background:#f0fdf4}
.exec-absent td{background:#fef2f2;color:#991b1b;font-weight:900}
.exec-late td{background:#fff7ed}
.exec-holiday td{background:#eff6ff;color:#1e40af;font-weight:900}
.exec-weekly td{background:#f8fafc;color:#475569}
.exec-status{
  border-radius:999px;
  padding:1px 3px;
  font-size:5.4px;
  font-weight:900;
  display:inline-block;
  white-space:nowrap;
}
.exec-status.present{background:#dcfce7;color:#166534}
.exec-status.absent{background:#fee2e2;color:#991b1b}
.exec-status.late{background:#ffedd5;color:#9a3412}
.exec-status.holiday{background:#dbeafe;color:#1e40af}
.exec-summary-line{
  margin-top:3mm;
  background:#f8fafc;
  border:1px solid #cbd5e1;
  border-radius:10px;
  padding:2mm 3mm;
  font-size:6.5px;
  color:#334155;
  font-weight:800;
  display:flex;
  justify-content:space-between;
}
.exec-signatures{
  position:absolute;
  bottom:12mm;
  left:7mm;
  right:7mm;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:15mm;
  font-size:7px;
  font-weight:900;
}
.exec-sign{
  border-top:1px solid #062745;
  text-align:center;
  padding-top:2mm;
}
.exec-footer{
  position:absolute;
  bottom:5mm;
  left:7mm;
  right:7mm;
  border-top:1px solid #cbd5e1;
  padding-top:2mm;
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:6.4px;
  color:#64748b;
  font-weight:800;
}
.exec-toolbar{
  position:sticky;
  top:0;
  z-index:9999;
  background:#062745;
  text-align:center;
  padding:10px;
}
.exec-toolbar button{
  background:#35b84b;
  color:#fff;
  border:0;
  border-radius:10px;
  padding:10px 22px;
  font-family:Cairo,Arial,sans-serif;
  font-weight:900;
  cursor:pointer;
}
@media print{
  @page{size:A4 portrait;margin:0}
  body{margin:0!important;background:#fff!important}
  .exec-toolbar{display:none!important}
  .exec-report-page{margin:0!important;page-break-after:always}
}


/* ===== Tabbed UI Enhancement ===== */
.page-tabs,.sub-tabs{display:flex;gap:10px;flex-wrap:wrap;background:#f8fafc;border:1px solid #e2e8f0;border-radius:22px;padding:10px}
.tab-btn,.sub-tab-btn{border:0;border-radius:16px;padding:12px 18px;font-family:Cairo,Arial,sans-serif;font-weight:900;cursor:pointer;background:#fff;color:#334155;box-shadow:0 8px 22px rgba(15,23,42,.05)}
.tab-btn.active,.sub-tab-btn.active{background:#062745;color:#fff}
.tab-panel,.sub-tab-panel{animation:tabFade .18s ease-in-out}
@keyframes tabFade{from{opacity:.3;transform:translateY(4px)}to{opacity:1;transform:none}}
.week-checks{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;background:#f8fafc;border:1px solid #d0d5dd;border-radius:15px;padding:12px}
.week-checks label{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:10px;text-align:center;font-weight:900}
.sticky-actions{position:sticky;bottom:10px;background:rgba(255,255,255,.92);backdrop-filter:blur(8px);border:1px solid #e2e8f0;border-radius:18px;padding:10px;z-index:5}
@media(max-width:900px){.week-checks{grid-template-columns:repeat(2,1fr)}}


/* ===== Full Tabbed Screens + Sidebar Groups ===== */
.nav-group-title{
  margin:14px 10px 6px;
  padding:0 8px;
  color:#94a3b8;
  font-size:11px;
  font-weight:900;
  text-align:right;
}
.sidebar .nav-btn{margin-bottom:6px}
.page-tabs{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  background:#f8fafc;
  border:1px solid #e2e8f0;
  border-radius:22px;
  padding:10px;
}
.tab-btn{
  border:0;
  border-radius:16px;
  padding:12px 18px;
  font-family:Cairo,Arial,sans-serif;
  font-weight:900;
  cursor:pointer;
  background:#fff;
  color:#334155;
  box-shadow:0 8px 22px rgba(15,23,42,.05);
}
.tab-btn.active{
  background:#062745;
  color:#fff;
}
.tab-panel{animation:tabFade .18s ease-in-out}
@keyframes tabFade{from{opacity:.3;transform:translateY(4px)}to{opacity:1;transform:none}}


/* ===== Phase 10 UI Cleanup + Universal Table Filters ===== */
.no-tab-panel{display:block!important}
.table-filter-box{
  display:flex;justify-content:space-between;align-items:center;gap:10px;
  margin:0 0 12px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:18px;padding:10px;
}
.table-filter-input{
  display:flex;align-items:center;gap:8px;background:#fff;border:1px solid #d0d5dd;
  border-radius:14px;padding:0 12px;min-height:42px;flex:1;
}
.table-filter-input i{color:#64748b}
.table-filter-input input{
  border:0;outline:0;width:100%;font-family:Cairo,Arial,sans-serif;font-weight:800;background:transparent;
}
@media(max-width:800px){.table-filter-box{flex-direction:column;align-items:stretch}}


/* ===== Individual Employee Report Tab ===== */
.ind-info-val{
  background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;
  padding:10px 14px;font-weight:900;color:#062745;min-height:44px;
  display:flex;align-items:center;font-size:14px;
}

/* ═══════════════════════════════════════════════
   IMPROVEMENTS — Toast, Modal, PIN, Loading, Roles
   ═══════════════════════════════════════════════ */

/* ── Toast Notifications ── */
#toast-container{position:fixed;top:20px;left:50%;transform:translateX(-50%);z-index:9999;display:flex;flex-direction:column;gap:10px;align-items:center;pointer-events:none;direction:ltr}
.toast{min-width:280px;max-width:480px;padding:14px 20px;border-radius:18px;font-family:'Cairo',sans-serif;font-weight:800;font-size:14px;color:#fff;display:flex;align-items:center;gap:10px;box-shadow:0 8px 30px rgba(0,0,0,.18);pointer-events:all;animation:toastIn .3s ease;transition:opacity .4s,transform .4s}
.toast.hide{opacity:0;transform:translateY(-12px)}
.toast.success{background:linear-gradient(135deg,#16a34a,#15803d)}
.toast.error{background:linear-gradient(135deg,#dc2626,#b91c1c)}
.toast.info{background:linear-gradient(135deg,#35b84b,#2fb34a)}
.toast.warning{background:linear-gradient(135deg,#f97316,#ea6c00)}
.toast i{font-size:18px;flex-shrink:0}
@keyframes toastIn{from{opacity:0;transform:translateY(-16px)}to{opacity:1;transform:translateY(0)}}

/* ── Loading Overlay ── */
#loading-overlay{position:fixed;inset:0;background:rgba(11,18,32,.45);z-index:8888;display:none;align-items:center;justify-content:center;backdrop-filter:blur(3px)}
#loading-overlay.show{display:flex}
.loading-box{background:#fff;border-radius:24px;padding:28px 36px;display:flex;flex-direction:column;align-items:center;gap:14px;box-shadow:0 20px 60px rgba(0,0,0,.2)}
.loading-spinner{width:44px;height:44px;border:4px solid #e2e8f0;border-top-color:#35b84b;border-radius:50%;animation:spin .7s linear infinite}
.loading-box p{font-family:'Cairo',sans-serif;font-weight:900;font-size:15px;color:#062745}
@keyframes spin{to{transform:rotate(360deg)}}

/* ── Confirm Modal ── */
#confirm-modal{position:fixed;inset:0;background:rgba(11,18,32,.5);z-index:9000;display:none;align-items:center;justify-content:center;backdrop-filter:blur(4px);direction:rtl}
#confirm-modal.show{display:flex}
.confirm-box{background:#fff;border-radius:28px;padding:32px;max-width:420px;width:90%;text-align:center;box-shadow:0 24px 70px rgba(0,0,0,.22);animation:toastIn .25s ease;direction:rtl}
.confirm-box .confirm-icon{width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:28px;margin:0 auto 16px}
.confirm-box .confirm-icon.danger{background:#fef2f2;color:#dc2626}
.confirm-box .confirm-icon.warning{background:#fff7ed;color:#f97316}
.confirm-box h3{font-size:20px;font-weight:900;margin-bottom:8px;color:#062745}
.confirm-box p{color:#64748b;font-weight:700;line-height:1.7;margin-bottom:22px;font-size:14px}
.confirm-box .confirm-btns{display:flex;gap:10px;justify-content:center}
.confirm-box .confirm-btns button{height:46px;border-radius:14px;font-weight:900;font-size:14px;padding:0 24px;border:0;cursor:pointer;transition:.18s}
.confirm-box .confirm-btns button:hover{transform:translateY(-1px)}
.confirm-cancel{background:#f1f5f9;color:#334155}
.confirm-danger{background:linear-gradient(135deg,#dc2626,#b91c1c);color:#fff}
.confirm-warning{background:linear-gradient(135deg,#f97316,#ea6c00);color:#fff}

/* ── PIN hidden / shown ── */
.pin-cell{display:flex;align-items:center;gap:6px}
.pin-dots{letter-spacing:2px;color:#94a3b8;font-size:16px}
.pin-toggle{background:none;border:0;color:#94a3b8;cursor:pointer;padding:2px 4px;border-radius:6px;transition:.15s;font-size:13px}
.pin-toggle:hover{color:#35b84b;background:#eff6ff;transform:none}

/* ── Search result count ── */
.search-count{font-size:12px;font-weight:800;color:#64748b;padding:4px 10px;background:#f1f5f9;border-radius:8px;white-space:nowrap}

/* ── Role-based nav badges ── */
.role-badge{font-size:10px;font-weight:900;padding:2px 7px;border-radius:6px;background:#fef3c7;color:#92400e;margin-right:auto}
.nav-btn[data-role-hidden="true"]{display:none!important}

/* ── Button loading state ── */
.btn-loading{opacity:.7;pointer-events:none;position:relative}
.btn-loading::after{content:'';display:inline-block;width:14px;height:14px;border:2px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;animation:spin .6s linear infinite;margin-right:8px;vertical-align:middle}

/* Build22.2 Employee Profile Modal - preserves current design */
.emp-profile-overlay{position:fixed;inset:0;background:rgba(15,23,42,.45);z-index:9999;display:flex;align-items:center;justify-content:center;padding:18px}
.emp-profile-modal{width:min(1180px,96vw);max-height:92vh;overflow:auto;background:#fff;border-radius:28px;box-shadow:0 24px 70px rgba(15,23,42,.30);direction:rtl}
.emp-profile-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 22px;border-bottom:1px solid #e5e7eb;background:linear-gradient(135deg,#f8fafc,#eef2ff);border-radius:28px 28px 0 0}
.emp-profile-title{font-weight:900;color:#062745;font-size:18px;display:flex;align-items:center;gap:10px}
.emp-profile-subtitle{font-size:13px;color:#64748b;margin-top:4px}
.emp-profile-close{border:0;background:#fee2e2;color:#991b1b;border-radius:14px;padding:10px 14px;font-weight:800;cursor:pointer}
.emp-profile-tabs{display:flex;gap:8px;flex-wrap:wrap;padding:14px 18px;border-bottom:1px solid #e5e7eb;background:#fff}
.emp-profile-tab{border:1px solid #e5e7eb;background:#f8fafc;color:#334155;border-radius:14px;padding:10px 14px;font-weight:800;cursor:pointer}
.emp-profile-tab.active{background:#062745;color:#fff;border-color:#062745}
.emp-profile-body{padding:18px}
.emp-profile-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px}
.emp-profile-info{border:1px solid #e5e7eb;border-radius:18px;padding:14px;background:#f8fafc}
.emp-profile-info span{display:block;color:#64748b;font-size:12px;margin-bottom:5px}
.emp-profile-info b{color:#062745;font-size:15px}

/* Build22.3 Employee Profile Report + Clear Stats */
.emp-profile-section-title{display:flex;align-items:center;gap:10px;font-weight:900;color:#062745;font-size:16px;margin-bottom:14px}
.emp-report-controls{display:grid;grid-template-columns:repeat(2,minmax(180px,1fr)) auto auto;gap:10px;align-items:end;background:#f8fafc;border:1px solid #e2e8f0;border-radius:18px;padding:14px;margin-bottom:12px}
.emp-report-controls .form-item{margin:0}.emp-report-controls input{height:42px;border:1px solid #d5dde8;border-radius:12px;padding:0 12px;font-family:inherit;font-weight:800}
.emp-profile-report-employee{display:flex;justify-content:space-between;gap:10px;align-items:center;background:#fff;border:1px solid #e5e7eb;border-radius:16px;padding:12px 14px;margin-bottom:12px}
.emp-profile-report-employee b{font-size:16px;color:#062745}.emp-profile-report-employee span{font-weight:800;color:#64748b;font-size:13px}
.emp-profile-stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-bottom:14px}.emp-profile-stats-grid.compact{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
.emp-profile-stat-card{border-radius:18px;padding:14px;border:1px solid #e2e8f0;background:#fff;box-shadow:0 8px 24px rgba(15,23,42,.06)}
.emp-profile-stat-card span{display:block;font-size:12px;font-weight:900;color:#64748b;margin-bottom:6px}.emp-profile-stat-card b{display:block;font-size:24px;font-weight:900;color:#062745;line-height:1.2}.emp-profile-stat-card small{display:block;margin-top:5px;color:#64748b;font-weight:800;font-size:11px}
.emp-profile-stat-card.green{background:#f0fdf4;border-color:#bbf7d0}.emp-profile-stat-card.red{background:#fef2f2;border-color:#fecaca}.emp-profile-stat-card.orange{background:#fff7ed;border-color:#fed7aa}.emp-profile-stat-card.blue{background:#eff6ff;border-color:#bfdbfe}.emp-profile-stat-card.purple{background:#f5f3ff;border-color:#ddd6fe}.emp-profile-stat-card.navy{background:#f8fafc;border-color:#cbd5e1}
.emp-profile-report-table{max-height:48vh;overflow:auto}.emp-profile-report-table table{min-width:980px}.profile-late-cell{color:#9a3412;font-weight:900}.profile-ot-cell{color:#166534;font-weight:900}.emp-profile-note{margin-top:10px;background:#fff7ed;color:#9a3412;border:1px solid #fed7aa;border-radius:14px;padding:10px 12px;font-weight:800}
@media(max-width:800px){.emp-report-controls{grid-template-columns:1fr}.emp-profile-report-employee{display:block}.emp-profile-report-employee span{display:block;margin-top:6px}}

/* Build23.3 Employee Add/Edit Modal UX */
.employee-form-overlay{position:fixed;inset:0;background:rgba(15,23,42,.45);z-index:9998;display:flex;align-items:center;justify-content:center;padding:18px;direction:rtl}
.employee-form-overlay.hidden{display:none!important}
.employee-form-modal{width:min(1080px,96vw);max-height:92vh;overflow:auto;background:#fff;border-radius:28px;box-shadow:0 24px 70px rgba(15,23,42,.30)}
.employee-form-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 22px;border-bottom:1px solid #e5e7eb;background:linear-gradient(135deg,#f8fafc,#eef2ff);border-radius:28px 28px 0 0}
.employee-form-title{font-weight:900;color:#062745;font-size:18px;display:flex;align-items:center;gap:10px}
.employee-form-close{border:0;background:#fee2e2;color:#991b1b;border-radius:14px;padding:10px 14px;font-weight:900;cursor:pointer}
.employee-form-body{padding:0}.employee-form-body #emp-tab-data{display:block!important}.employee-form-body #emp-tab-data.hidden{display:block!important}.employee-form-body #emp-tab-data>.panel{border-radius:0 0 28px 28px!important;margin-top:0!important;border:0!important;box-shadow:none!important}.employee-form-body #emp-tab-data .panel-title{display:none}.employee-form-body #emp-tab-data>.panel>.btn-row:first-of-type{display:none}
.employee-form-body #emp-tab-data .btn-row{position:sticky;bottom:0;background:rgba(255,255,255,.96);padding:12px 18px;margin:0 -18px -18px;border-top:1px solid #e5e7eb;backdrop-filter:blur(4px)}
@media(max-width:800px){.employee-form-modal{width:98vw;max-height:94vh}.employee-form-header{padding:14px}.employee-form-title{font-size:16px}}

#employeeListActionBar{display:flex;gap:10px;align-items:center;justify-content:flex-start;flex-wrap:wrap;margin-bottom:12px;}

.employee-list-action-bar{display:flex!important;gap:10px!important;align-items:center!important;justify-content:flex-start!important;flex-wrap:wrap!important;margin-bottom:12px!important;}
.employee-list-action-bar .btn{margin:0!important;}

/* ===== Build24_11 Dashboard Motion + Method Badges (UI-only, lightweight) ===== */
.method-badges{display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap;min-width:110px}.method-badge{box-shadow:0 6px 16px rgba(15,23,42,.08)}
#page-overview .dash-card,#page-overview .dash-indicator{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;animation:dashFadeUp .35s ease both;border:1px solid rgba(226,232,240,.95)}
#page-overview .dash-card:hover,#page-overview .dash-indicator:hover{transform:translateY(-3px);box-shadow:0 16px 36px rgba(15,23,42,.12)}
#page-overview .dash-card i{opacity:.16}#page-overview .dash-card h2,#page-overview .dash-indicator b{letter-spacing:.2px}
#page-overview .dash-employees{background:linear-gradient(135deg,#eef2ff 0%,#fff 68%)}#page-overview .dash-employees h2,#page-overview .dash-employees i{color:#3730a3}
#page-overview .dash-departments{background:linear-gradient(135deg,#ecfeff 0%,#fff 68%)}#page-overview .dash-departments h2,#page-overview .dash-departments i{color:#0e7490}
#page-overview .dash-devices{background:linear-gradient(135deg,#eff6ff 0%,#fff 68%)}#page-overview .dash-devices h2,#page-overview .dash-devices i{color:#2fb34a}
#page-overview .dash-moves{background:linear-gradient(135deg,#f5f3ff 0%,#fff 68%)}#page-overview .dash-moves h2,#page-overview .dash-moves i{color:#6d28d9}
#page-overview .dash-in{background:linear-gradient(135deg,#dcfce7 0%,#fff 72%)}#page-overview .dash-in b{color:#15803d}
#page-overview .dash-out{background:linear-gradient(135deg,#fee2e2 0%,#fff 72%)}#page-overview .dash-out b{color:#b91c1c}
#page-overview .dash-absent{background:linear-gradient(135deg,#ffedd5 0%,#fff 72%)}#page-overview .dash-absent b{color:#c2410c}
#page-overview .dash-pending{background:linear-gradient(135deg,#f3e8ff 0%,#fff 72%)}#page-overview .dash-pending b{color:#7e22ce}
#page-overview .dash-inactive{background:linear-gradient(135deg,#f1f5f9 0%,#fff 72%)}#page-overview .dash-inactive b{color:#334155}
#page-overview .dash-live-update{background:linear-gradient(135deg,#e0f2fe 0%,#fff 72%)}#page-overview .dash-live-recent{background:linear-gradient(135deg,#e0e7ff 0%,#fff 72%)}#page-overview .dash-live-last{background:linear-gradient(135deg,#dcfce7 0%,#fff 72%)}
#sTodayIn,#sTodayOut,#sTodayAbsent,#sMoves,#liveRecentCount{animation:softPulse 2.4s ease-in-out infinite}
@keyframes dashFadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes softPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.035)}}
@media (prefers-reduced-motion:reduce){#page-overview .dash-card,#page-overview .dash-indicator,#sTodayIn,#sTodayOut,#sTodayAbsent,#sMoves,#liveRecentCount{animation:none;transition:none}}

/* Build24_11_18_PHASE1_UI_CLEANUP: compact company admin shortcuts */
.top-brand-info{display:flex;flex-direction:column;gap:4px}
.company-title-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.company-title-row p{margin:0}
.company-mini-actions{display:flex!important;align-items:center;gap:6px;margin-inline-start:6px;visibility:visible!important;opacity:1!important}
.company-mini-actions .mini-action{height:30px;min-width:34px;padding:0 10px;border-radius:11px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.14);color:#fff;display:inline-flex!important;align-items:center;justify-content:center;gap:6px;cursor:pointer;transition:.18s ease;font-size:13px;font-weight:900;visibility:visible!important;opacity:1!important}
.company-mini-actions .mini-action span{font-size:11px;font-weight:900;line-height:1;white-space:nowrap}
.company-mini-actions .mini-action:hover{background:rgba(255,255,255,.24);transform:translateY(-1px)}
@media(max-width:900px){.company-title-row{justify-content:center}.company-mini-actions{gap:5px;margin-inline-start:0}.company-mini-actions .mini-action{height:32px;min-width:32px;padding:0 8px;border-radius:10px}.company-mini-actions .mini-action span{display:none}}

/* ══════════════════════════════════════════════════════════
   BUILD25_3 — Dark Mode + Kiosk + Misc
══════════════════════════════════════════════════════════ */

/* Dark Mode */
body.dark-mode {
  --bg:#062745; --text:#f1f5f9; --muted:#94a3b8; --line:#1e293b;
  background:#062745; color:#f1f5f9;
}
body.dark-mode .panel, body.dark-mode .mbox, body.dark-mode .stat,
body.dark-mode .form-card, body.dark-mode .fcard {
  background:#1e293b; border-color:#334155;
}
body.dark-mode .topbar { background:linear-gradient(135deg,#020617,#062745); }
body.dark-mode input, body.dark-mode select, body.dark-mode textarea {
  background:#062745; color:#f1f5f9; border-color:#334155;
}
body.dark-mode table { background:#1e293b; }
body.dark-mode thead { background:#062745; }
body.dark-mode tbody tr:hover { background:#062745; }
body.dark-mode td, body.dark-mode th { border-color:#334155; }
body.dark-mode .note { background:#062745; border-color:#334155; color:#94a3b8; }
body.dark-mode .sidebar { background:#020617; }
body.dark-mode .nav-btn { color:#94a3b8; }
body.dark-mode .nav-btn:hover, body.dark-mode .nav-btn.active { background:#1e293b; color:#f1f5f9; }

/* Kiosk Mode */
body.kiosk-mode .topbar,
body.kiosk-mode .sidebar,
body.kiosk-mode .nav-btn,
body.kiosk-mode .btn-row:not(.kiosk-allow) { display:none !important; }
body.kiosk-mode .main-content { margin:0 !important; padding:0 !important; }
body.kiosk-mode .kiosk-punch-area {
  display:flex !important;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  min-height:100vh;
  background:linear-gradient(135deg,#062745,#1e3a8a);
}

/* Employee Card Print */
@media print {
  body > *:not(.print-card) { display:none !important; }
  .print-card { display:block !important; }
}

/* Status Page */
.status-indicator { width:12px; height:12px; border-radius:50%; display:inline-block; margin-left:8px; }
.status-indicator.green { background:#16a34a; box-shadow:0 0 8px #16a34a; }
.status-indicator.red { background:#dc2626; box-shadow:0 0 8px #dc2626; }
.status-indicator.yellow { background:#f59e0b; box-shadow:0 0 8px #f59e0b; }

/* Keyboard shortcuts tooltip */
.kbd { background:#1e293b; color:#f1f5f9; border-radius:6px; padding:2px 8px; font-size:12px; font-family:monospace; border:1px solid #334155; }

/* ══════════════════════════════════════════════════════════
   Smart Dashboard — BUILD26
══════════════════════════════════════════════════════════ */

/* Hero Row */
.db-hero {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 16px;
  margin-bottom: 16px;
}
@media(max-width:900px){ .db-hero{ grid-template-columns:1fr; } }

/* Score Ring Card */
.db-score-card {
  background: linear-gradient(135deg,#062745,#1e3a8a);
  border-radius: 28px;
  padding: 28px 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  box-shadow: 0 20px 60px rgba(37,99,235,.25);
  position: relative;
  overflow: hidden;
}
.db-score-card::before {
  content:'';position:absolute;top:-40px;right:-40px;width:160px;height:160px;
  border-radius:50%;background:rgba(255,255,255,.05);
}
.db-ring-svg { width: 150px; height: 150px; transform: rotate(-90deg); }
.db-ring-bg  { fill:none; stroke:rgba(255,255,255,.1); stroke-width:10; }
.db-ring-fill{
  fill:none; stroke:#38bdf8; stroke-width:10;
  stroke-linecap:round;
  stroke-dasharray: 326.7;
  stroke-dashoffset: 326.7;
  transition: stroke-dashoffset 1.2s cubic-bezier(.4,0,.2,1), stroke .4s;
}
.db-score-ring { position:relative; display:flex; align-items:center; justify-content:center; }
.db-score-inner {
  position:absolute; display:flex; flex-direction:column; align-items:center;
  transform: rotate(0deg);
}
.db-score-num  { font-size:38px; font-weight:900; color:#fff; line-height:1; }
.db-score-pct  { font-size:16px; font-weight:900; color:#93c5fd; }
.db-score-label{ font-size:11px; color:rgba(255,255,255,.6); font-weight:800; margin-top:2px; }
.db-score-meta { text-align:center; }
.db-score-status{
  display:inline-block; border-radius:999px; padding:6px 16px;
  font-size:13px; font-weight:900; margin-bottom:6px;
}
.db-score-status.green { background:#dcfce7; color:#166534; }
.db-score-status.orange{ background:#ffedd5; color:#9a3412; }
.db-score-status.red   { background:#fee2e2; color:#991b1b; }
.db-score-date { font-size:12px; color:rgba(255,255,255,.5); font-weight:800; }

/* KPIs Grid */
.db-kpis {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 12px;
}
@media(max-width:600px){ .db-kpis{ grid-template-columns:repeat(2,1fr); } }

.db-kpi {
  background:#fff; border-radius:20px; padding:16px;
  display:flex; gap:12px; align-items:center;
  border:1px solid #e2e8f0;
  box-shadow: 0 4px 16px rgba(15,23,42,.06);
  transition:.2s;
  cursor:default;
}
.db-kpi:hover{ transform:translateY(-2px); box-shadow:0 8px 24px rgba(15,23,42,.1); }
.db-kpi-icon {
  width:44px; height:44px; border-radius:14px;
  display:flex; align-items:center; justify-content:center;
  font-size:18px; flex-shrink:0;
}
.db-kpi.green .db-kpi-icon { background:#dcfce7; color:#16a34a; }
.db-kpi.red   .db-kpi-icon { background:#fee2e2; color:#dc2626; }
.db-kpi.orange.db-kpi-icon,
.db-kpi.orange .db-kpi-icon{ background:#ffedd5; color:#f97316; }
.db-kpi.blue  .db-kpi-icon { background:#dbeafe; color:#35b84b; }
.db-kpi.purple.db-kpi-icon,
.db-kpi.purple .db-kpi-icon{ background:#ede9fe; color:#7c3aed; }
.db-kpi.teal  .db-kpi-icon { background:#ccfbf1; color:#0d9488; }

.db-kpi-body { display:flex; flex-direction:column; }
.db-kpi-val  { font-size:26px; font-weight:900; color:#062745; line-height:1.1; }
.db-kpi-lbl  { font-size:11px; font-weight:800; color:#64748b; margin-top:2px; }

/* Alert Bar */
.db-alert-bar {
  background: linear-gradient(135deg,#fef3c7,#fde68a);
  border: 1px solid #f59e0b;
  border-radius: 16px;
  padding: 12px 18px;
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 900;
  color: #92400e;
  animation: pulse-alert 2s infinite;
}
@keyframes pulse-alert {
  0%,100%{ box-shadow:0 0 0 0 rgba(245,158,11,.3); }
  50%{ box-shadow:0 0 0 8px rgba(245,158,11,0); }
}

/* Mid Row */
.db-mid-row {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1.2fr;
  gap: 16px;
  margin-bottom: 16px;
}
@media(max-width:1100px){ .db-mid-row{ grid-template-columns:1fr 1fr; } }
@media(max-width:700px) { .db-mid-row{ grid-template-columns:1fr; } }

/* Panel base */
.db-panel {
  background:#fff; border-radius:24px; padding:18px;
  border:1px solid #e2e8f0;
  box-shadow:0 4px 20px rgba(15,23,42,.06);
}
.db-panel-title {
  font-size:14px; font-weight:900; color:#062745;
  margin-bottom:14px; display:flex; align-items:center; gap:8px;
}
.db-pill {
  background:#dbeafe; color:#1e40af;
  border-radius:999px; padding:2px 10px;
  font-size:12px; font-weight:900;
  margin-right:auto;
}

/* Heatmap */
.db-heatmap {
  display: grid;
  grid-template-columns: repeat(14, 1fr);
  gap: 4px;
  margin-bottom: 8px;
}
.db-heat-cell {
  aspect-ratio:1; border-radius:5px;
  background:#f1f5f9;
  cursor:pointer; position:relative;
  transition:.15s;
}
.db-heat-cell:hover{ transform:scale(1.3); z-index:10; }
.db-heat-cell .db-tooltip {
  position:absolute; bottom:calc(100%+6px); left:50%; transform:translateX(-50%);
  background:#062745; color:#fff; border-radius:8px; padding:4px 8px;
  font-size:11px; font-weight:800; white-space:nowrap;
  opacity:0; pointer-events:none; transition:.15s;
}
.db-heat-cell:hover .db-tooltip{ opacity:1; }
.db-heatmap-legend {
  display:flex; align-items:center; gap:6px; font-size:11px; font-weight:800;
}
.db-legend-dots{ display:flex; gap:3px; }
.db-dot{ width:12px; height:12px; border-radius:3px; display:inline-block; }

/* Present List */
.db-present-list {
  display:flex; flex-direction:column; gap:6px;
  max-height:220px; overflow-y:auto;
}
.db-present-item {
  display:flex; align-items:center; gap:10px;
  padding:8px 10px; border-radius:12px;
  background:#f8fafc; font-size:13px;
  transition:.15s;
}
.db-present-item:hover{ background:#eff6ff; }
.db-avatar {
  width:34px; height:34px; border-radius:11px;
  background:linear-gradient(135deg,#35b84b,#1e40af);
  color:#fff; display:flex; align-items:center; justify-content:center;
  font-size:14px; font-weight:900; flex-shrink:0;
}
.db-present-info { flex:1; }
.db-present-name { font-weight:800; color:#062745; }
.db-present-dept { font-size:11px; color:#94a3b8; font-weight:700; }
.db-present-time { font-size:12px; font-weight:900; color:#16a34a; }

/* Timeline */
.db-timeline { display:flex; flex-direction:column; gap:0; max-height:200px; overflow-y:auto; }
.db-tl-item {
  display:flex; align-items:center; gap:10px;
  padding:8px 4px; position:relative;
  font-size:13px; border-bottom:1px solid #f1f5f9;
}
.db-tl-item:last-child{ border-bottom:0; }
.db-tl-dot {
  width:10px; height:10px; border-radius:50%; flex-shrink:0;
  box-shadow:0 0 0 3px rgba(0,0,0,.06);
}
.db-tl-dot.in  { background:#16a34a; }
.db-tl-dot.out { background:#dc2626; }
.db-tl-dot.break{ background:#f97316; }
.db-tl-body { flex:1; }
.db-tl-name { font-weight:800; color:#062745; }
.db-tl-move { font-size:11px; font-weight:700; }
.db-tl-move.in   { color:#16a34a; }
.db-tl-move.out  { color:#dc2626; }
.db-tl-time { font-size:12px; font-weight:800; color:#64748b; margin-right:auto; }

/* Live dot */
.db-live-dot {
  display:inline-block; width:8px; height:8px; border-radius:50%;
  background:#16a34a; margin-left:6px; margin-bottom:-1px;
  animation:live-blink 1.5s infinite;
}
@keyframes live-blink {
  0%,100%{ opacity:1; box-shadow:0 0 0 0 rgba(22,163,74,.4); }
  50%{ opacity:.6; box-shadow:0 0 0 5px rgba(22,163,74,0); }
}

/* Refresh Button */
.db-refresh-btn {
  margin-right:auto; background:transparent; border:0;
  color:#94a3b8; cursor:pointer; font-size:13px; padding:2px 6px;
  border-radius:8px; transition:.15s;
}
.db-refresh-btn:hover{ background:#f1f5f9; color:#35b84b; }

/* Bottom Row */
.db-bottom-row {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 16px;
  margin-bottom: 16px;
}
@media(max-width:900px){ .db-bottom-row{ grid-template-columns:1fr; } }

/* Rank List */
.db-rank-list{ display:flex; flex-direction:column; gap:8px; }
.db-rank-item {
  display:flex; align-items:center; gap:10px;
  padding:8px 10px; border-radius:12px; background:#f8fafc;
  font-size:13px;
}
.db-rank-num {
  width:24px; height:24px; border-radius:8px;
  background:#062745; color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-size:11px; font-weight:900; flex-shrink:0;
}
.db-rank-name { flex:1; font-weight:800; }
.db-rank-val  { font-weight:900; color:#f97316; font-size:13px; }

/* Dept List */
.db-dept-list{ display:flex; flex-direction:column; gap:8px; }
.db-dept-item{ display:flex; flex-direction:column; gap:4px; }
.db-dept-header{ display:flex; justify-content:space-between; font-size:13px; font-weight:800; }
.db-dept-bar {
  height:8px; background:#f1f5f9; border-radius:999px; overflow:hidden;
}
.db-dept-bar-fill {
  height:100%; border-radius:999px;
  transition: width 1s cubic-bezier(.4,0,.2,1);
}

/* Requests List */
.db-requests-list{ display:flex; flex-direction:column; gap:8px; max-height:220px; overflow-y:auto; }
.db-req-item {
  background:#f8fafc; border-radius:14px; padding:10px 12px;
  border-right:3px solid #7c3aed;
}
.db-req-name { font-weight:800; font-size:13px; color:#062745; }
.db-req-type { font-size:12px; font-weight:700; color:#7c3aed; margin-top:2px; }
.db-req-actions { display:flex; gap:6px; margin-top:8px; }
.db-req-btn {
  border:0; border-radius:8px; padding:5px 12px;
  font-size:12px; font-weight:900; cursor:pointer; font-family:inherit;
}
.db-req-btn.approve{ background:#dcfce7; color:#166534; }
.db-req-btn.reject { background:#fee2e2; color:#991b1b; }

/* Empty State */
.db-empty {
  text-align:center; color:#94a3b8; font-size:13px;
  font-weight:800; padding:20px 0;
}

/* Coming Soon Banner */
.db-coming-soon {
  background:linear-gradient(135deg,#062745,#1e3a8a);
  border-radius:20px; padding:14px 20px;
  display:flex; align-items:center; gap:12px;
  color:#93c5fd; font-weight:800; font-size:14px;
  margin-bottom:8px;
}
.db-coming-soon i { font-size:20px; color:#38bdf8; animation:rocket 1.5s infinite; }
@keyframes rocket {
  0%,100%{ transform:translateY(0) rotate(-10deg); }
  50%     { transform:translateY(-4px) rotate(-10deg); }
}

/* Dark mode overrides */
body.dark-mode .db-kpi,
body.dark-mode .db-panel{ background:#1e293b; border-color:#334155; }
body.dark-mode .db-kpi-val,
body.dark-mode .db-panel-title{ color:#f1f5f9; }
body.dark-mode .db-present-item,
body.dark-mode .db-rank-item,
body.dark-mode .db-dept-item{ background:#062745; }
body.dark-mode .db-tl-name{ color:#f1f5f9; }

/* ══════════════════════════════════════════════════════════
   Announcements Page — BUILD26
══════════════════════════════════════════════════════════ */

/* Nav badge + divider */
.side-divider {
  height: 1px;
  background: var(--line, #e5e7eb);
  margin: 8px 12px;
  opacity: .6;
}
.nav-announce { position: relative; }
.nav-badge {
  position: absolute;
  top: 6px; left: 10px;
  background: #dc2626;
  color: #fff;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 900;
  width: 18px; height: 18px;
  display: flex; align-items: center; justify-content: center;
}

/* Page header */
.ann-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
  flex-wrap: wrap;
  gap: 12px;
}
.ann-title {
  font-size: 22px;
  font-weight: 900;
  color: #062745;
  margin: 0 0 4px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.ann-title i { color: #35b84b; }
.ann-sub { font-size: 13px; color: #64748b; font-weight: 700; margin: 0; }

/* Tabs */
.ann-tabs {
  display: flex;
  gap: 4px;
  background: #f1f5f9;
  border-radius: 16px;
  padding: 5px;
  margin-bottom: 20px;
  width: fit-content;
}
.ann-tab {
  padding: 9px 20px;
  border-radius: 12px;
  border: 0;
  font-weight: 900;
  font-size: 14px;
  cursor: pointer;
  color: #64748b;
  background: transparent;
  display: flex;
  align-items: center;
  gap: 8px;
  transition: .15s;
  font-family: inherit;
}
.ann-tab:hover { color: #062745; }
.ann-tab.active {
  background: #fff;
  color: #35b84b;
  box-shadow: 0 2px 12px rgba(15,23,42,.08);
}

/* Compose Area */
.ann-compose {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 24px;
  padding: 22px;
  margin-bottom: 20px;
  box-shadow: 0 4px 16px rgba(15,23,42,.05);
}
.ann-compose-title {
  font-size: 15px;
  font-weight: 900;
  color: #062745;
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.ann-compose-title i { color: #35b84b; }
.ann-compose-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.ann-field { display: flex; flex-direction: column; gap: 6px; }
.ann-field label { font-size: 13px; font-weight: 900; color: #334155; }
.ann-field input,
.ann-field select,
.ann-field textarea {
  height: 50px;
  border: 1px solid #d0d5dd;
  border-radius: 14px;
  padding: 0 14px;
  font-family: inherit;
  font-weight: 700;
  font-size: 14px;
  color: #062745;
  background: #fff;
  transition: .15s;
}
.ann-field textarea {
  height: 90px;
  padding: 12px 14px;
  resize: vertical;
}
.ann-field input:focus,
.ann-field select:focus,
.ann-field textarea:focus {
  border-color: #35b84b;
  outline: none;
  box-shadow: 0 0 0 4px rgba(37,99,235,.08);
}
.ann-field-full { grid-column: 1 / -1; }

/* Messages List */
.ann-list-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-weight: 900;
  font-size: 15px;
  color: #062745;
  margin-bottom: 12px;
}
.ann-msg-list { display: flex; flex-direction: column; gap: 10px; }
.ann-empty {
  text-align: center;
  color: #94a3b8;
  font-weight: 800;
  font-size: 14px;
  padding: 40px 0;
  line-height: 1.8;
}
.ann-msg-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 18px;
  padding: 16px 18px;
  display: flex;
  align-items: flex-start;
  gap: 14px;
  transition: .15s;
  box-shadow: 0 2px 8px rgba(15,23,42,.04);
}
.ann-msg-card:hover { box-shadow: 0 6px 20px rgba(15,23,42,.08); }
.ann-msg-dot {
  width: 10px; height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
  margin-top: 6px;
}
.ann-msg-dot.info   { background: #35b84b; }
.ann-msg-dot.warning{ background: #f97316; }
.ann-msg-dot.success{ background: #16a34a; }
.ann-msg-body { flex: 1; }
.ann-msg-text {
  font-weight: 800;
  font-size: 14px;
  color: #062745;
  margin-bottom: 6px;
  line-height: 1.5;
}
.ann-msg-meta {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.ann-msg-tag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  border-radius: 999px;
  padding: 3px 10px;
  font-size: 11px;
  font-weight: 900;
}
.ann-msg-tag.info   { background: #dbeafe; color: #1e40af; }
.ann-msg-tag.warning{ background: #ffedd5; color: #9a3412; }
.ann-msg-tag.success{ background: #dcfce7; color: #166534; }
.ann-msg-tag.all    { background: #f1f5f9; color: #475569; }
.ann-msg-time { font-size: 11px; color: #94a3b8; font-weight: 700; }
.ann-msg-actions { display: flex; gap: 6px; flex-shrink: 0; }
.ann-msg-del {
  width: 32px; height: 32px;
  border-radius: 10px;
  border: 1px solid #fecaca;
  background: #fff;
  color: #dc2626;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  font-size: 13px;
  transition: .15s;
}
.ann-msg-del:hover { background: #fee2e2; }

/* Coming Soon */
.ann-coming-hero {
  text-align: center;
  padding: 40px 20px 30px;
}
.ann-coming-rocket {
  font-size: 56px;
  margin-bottom: 16px;
  animation: rocket 1.5s ease-in-out infinite;
}
@keyframes rocket {
  0%,100% { transform: translateY(0) rotate(-5deg); }
  50%      { transform: translateY(-8px) rotate(-5deg); }
}
.ann-coming-hero h3 {
  font-size: 22px;
  font-weight: 900;
  color: #062745;
  margin-bottom: 8px;
}
.ann-coming-hero p {
  font-size: 14px;
  color: #64748b;
  font-weight: 700;
}

.ann-features-grid {
  display: grid;
  grid-template-columns: repeat(2,1fr);
  gap: 14px;
  margin-bottom: 24px;
}
@media(max-width:700px){ .ann-features-grid{ grid-template-columns:1fr; } }

.ann-feature-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 20px;
  padding: 18px;
  display: flex;
  gap: 14px;
  align-items: flex-start;
  transition: .2s;
  box-shadow: 0 2px 8px rgba(15,23,42,.04);
}
.ann-feature-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(15,23,42,.1);
}
.ann-feat-icon {
  width: 48px; height: 48px;
  border-radius: 16px;
  display: flex; align-items: center; justify-content: center;
  font-size: 20px;
  flex-shrink: 0;
}
.ann-feat-body { flex: 1; }
.ann-feat-name {
  font-size: 15px;
  font-weight: 900;
  color: #062745;
  margin-bottom: 4px;
}
.ann-feat-desc {
  font-size: 12px;
  color: #64748b;
  font-weight: 700;
  line-height: 1.6;
  margin-bottom: 8px;
}
.ann-feat-badge {
  display: inline-block;
  border-radius: 999px;
  padding: 3px 10px;
  font-size: 11px;
  font-weight: 900;
}
.ann-feat-badge.blue  { background: #dbeafe; color: #1e40af; }
.ann-feat-badge.purple{ background: #ede9fe; color: #7c3aed; }
.ann-feat-badge.green { background: #dcfce7; color: #166534; }
.ann-feat-badge.yellow{ background: #fef9c3; color: #854d0e; }
.ann-feat-badge.orange{ background: #ffedd5; color: #9a3412; }
.ann-feat-badge.pink  { background: #fce7f3; color: #be185d; }

/* Support Card */
.ann-support-card {
  background: linear-gradient(135deg,#f0fdf4,#dcfce7);
  border: 1px solid #bbf7d0;
  border-radius: 20px;
  padding: 20px 22px;
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
}
.ann-support-icon {
  width: 52px; height: 52px;
  border-radius: 16px;
  background: #16a34a;
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 24px;
  flex-shrink: 0;
}
.ann-support-body { flex: 1; }
.ann-support-title { font-size: 15px; font-weight: 900; color: #062745; }
.ann-support-sub   { font-size: 13px; color: #16a34a; font-weight: 800; margin-top: 2px; }
.btn-whatsapp {
  background: #16a34a;
  color: #fff;
  border: 0;
  border-radius: 14px;
  padding: 12px 20px;
  font-size: 14px;
  font-weight: 900;
  cursor: pointer;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 8px;
  transition: .15s;
  font-family: inherit;
}
.btn-whatsapp:hover { background: #15803d; transform: translateY(-1px); }

/* Shared buttons */
.btn-primary {
  background: #35b84b;
  color: #fff;
  border: 0;
  border-radius: 14px;
  padding: 12px 20px;
  font-size: 14px;
  font-weight: 900;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: .15s;
  font-family: inherit;
}
.btn-primary:hover { background: #2fb34a; transform: translateY(-1px); }
.btn-ghost {
  background: transparent;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 7px 14px;
  font-size: 13px;
  font-weight: 800;
  color: #475569;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: .15s;
  font-family: inherit;
}
.btn-ghost:hover { background: #f8fafc; }

/* Dark mode */
body.dark-mode .ann-compose,
body.dark-mode .ann-msg-card,
body.dark-mode .ann-feature-card { background: #1e293b; border-color: #334155; }
body.dark-mode .ann-title,
body.dark-mode .ann-feat-name,
body.dark-mode .ann-msg-text { color: #f1f5f9; }
body.dark-mode .ann-field input,
body.dark-mode .ann-field select,
body.dark-mode .ann-field textarea { background: #062745; color: #f1f5f9; border-color: #334155; }
body.dark-mode .ann-tab.active { background: #334155; }
body.dark-mode .ann-tabs { background: #062745; }

@media(max-width:600px){
  .ann-compose-grid { grid-template-columns: 1fr; }
  .ann-header { flex-direction: column; align-items: flex-start; }
}

/* Build28 Employee Profile Plus */
#employeeCustomFieldsBox{border:1px solid #e2e8f0;background:#fff}
#employeeCustomFieldsContainer.grid-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.build28-card-btn{background:#16a34a!important;color:#fff!important}
.build28-archive-btn{background:#f97316!important;color:#fff!important}
@media(max-width:900px){#employeeCustomFieldsContainer.grid-form{grid-template-columns:1fr}}

/* Build29 Dynamic Fields Panel Fix */
.modal{position:fixed;inset:0;background:rgba(15,23,42,.55);z-index:9999;display:none;align-items:center;justify-content:center;backdrop-filter:blur(4px);padding:18px;direction:rtl}
.modal.open{display:flex !important}
.modal .mbox{background:#fff;border-radius:24px;box-shadow:0 28px 80px rgba(15,23,42,.35);width:min(760px,96vw);max-height:92vh;overflow:auto;padding:22px}
.modal-title{font-size:20px;font-weight:900;color:#062745;margin-bottom:16px;display:flex;align-items:center;gap:10px}
.build29-custom-fields-empty{padding:24px;text-align:center;color:#94a3b8;font-weight:800}

/* Build30 V3 - ثابت ترتيب أزرار قائمة الموظفين */
#employeeListActionBar,
.employee-list-action-bar{
  display:flex!important;
  flex-direction:row!important;
  direction:rtl!important;
  justify-content:flex-start!important;
  align-items:center!important;
  gap:10px!important;
  flex-wrap:nowrap!important;
  margin-bottom:12px!important;
}
#employeeQuickAddBtn{order:1!important;white-space:nowrap!important;flex:0 0 auto!important;}
#employeeImportBtn{order:2!important;white-space:nowrap!important;flex:0 0 auto!important;}
#employeeExportBtn{order:3!important;white-space:nowrap!important;flex:0 0 auto!important;}
#employeeImportFile{order:4!important;display:none!important;}
@media (max-width: 760px){
  #employeeListActionBar,.employee-list-action-bar{flex-wrap:wrap!important;}
}

/* ===== Professional Unified Reports Center ===== */
.reports-center-pro{display:grid;gap:18px}.report-filter-card{background:#fff;border:1px solid #dbeee0;border-radius:22px;padding:16px;box-shadow:0 12px 30px rgba(15,23,42,.06)}.report-groups-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(310px,1fr));gap:16px}.report-group-card{background:linear-gradient(180deg,#fff,#f8fbff);border:1px solid #dbeee0;border-radius:24px;padding:16px;box-shadow:0 10px 26px rgba(15,23,42,.06)}.report-group-head{display:flex;gap:12px;align-items:flex-start;margin-bottom:12px}.report-group-icon{width:42px;height:42px;border-radius:16px;background:#e8f7f5;color:#07847e;display:flex;align-items:center;justify-content:center;font-size:18px}.report-group-title{font-weight:900;color:#062745;font-size:17px}.report-group-desc{font-weight:700;color:#63748a;font-size:12px;margin-top:4px}.report-actions-grid{display:grid;grid-template-columns:1fr;gap:10px}.report-action-btn{border:1px solid #d8e6f3;background:#fff;border-radius:15px;padding:12px 14px;font-weight:900;color:#062745;display:flex;align-items:center;justify-content:space-between;gap:8px;cursor:pointer;transition:.15s}.report-action-btn:hover{transform:translateY(-1px);border-color:#0f8f86;box-shadow:0 8px 18px rgba(15,143,134,.12)}.report-action-btn i{color:#0f8f86}.report-output-card{background:#fff;border:1px solid #dbeee0;border-radius:24px;padding:16px;box-shadow:0 12px 30px rgba(15,23,42,.06)}.report-output-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.report-output-title h3{margin:0;font-size:18px;color:#062745}.report-badges{display:flex;gap:8px;flex-wrap:wrap}.report-badge{border-radius:999px;padding:6px 10px;background:#eef6ff;color:#0b4b82;font-weight:900;font-size:12px}.report-priority-note{background:#f6faf9;border:1px dashed #b9ddd8;color:#37556a;border-radius:16px;padding:10px 12px;font-weight:800;font-size:12px;margin-bottom:12px}.report-kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:10px 0 14px}.report-kpi{background:#f8fafc;border:1px solid #e2e8f0;border-radius:16px;padding:12px}.report-kpi b{display:block;font-size:22px;color:#062745}.report-kpi span{font-size:12px;font-weight:800;color:#64748b}.report-empty{padding:28px;text-align:center;background:#f8fafc;border:1px dashed #cbd5e1;border-radius:18px;color:#64748b;font-weight:900}.status-dot{width:9px;height:9px;border-radius:50%;display:inline-block;margin-left:6px}.dot-green{background:#16a34a}.dot-red{background:#dc2626}.dot-orange{background:#f59e0b}.dot-blue{background:#35b84b}
/* Unified Reports Center V4 additions */
#page-reports .panel{border-radius:28px}.unified-report-toolbar .cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.report-common-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-start;margin:8px 0 12px}.report-common-actions .btn{border:0;border-radius:14px;padding:10px 14px;font-weight:900;cursor:pointer}.report-common-actions .blue{background:#0b5ed7;color:#fff}.report-common-actions .green{background:#15803d;color:#fff}.report-common-actions .red{background:#b91c1c;color:#fff}.reports-center-pro .table-wrap{max-height:520px;overflow:auto}.reports-center-pro table th{position:sticky;top:0;z-index:2}.reports-center-pro #reportCenterTable td,.reports-center-pro #reportCenterTable th{white-space:nowrap}.report-actions-grid{grid-template-columns:1fr!important}.report-group-card{min-height:unset}@media(max-width:900px){.unified-report-toolbar .cols-4{grid-template-columns:1fr}.report-groups-grid{grid-template-columns:1fr}}
@media print{.nav,.sidebar,.topbar,.report-filter-card,.report-groups-grid,.report-common-actions{display:none!important}.report-output-card{box-shadow:none!important;border:0!important}.reports-center-pro .table-wrap{max-height:none;overflow:visible}.reports-center-pro table th{position:static}}

/* Reports Center V5 refinements */
.reports-center-pro.v5 .unified-report-toolbar .grid-form{grid-template-columns:repeat(4,minmax(0,1fr));}
.reports-center-pro.v5 .report-priority-note{margin-top:10px;}
.reports-center-pro.v5 .report-output-card{border:1px solid #dbeee0;box-shadow:0 10px 26px rgba(15,23,42,.06);}
@media(max-width:900px){.reports-center-pro.v5 .unified-report-toolbar .grid-form{grid-template-columns:1fr!important}.reports-center-pro.v5 .unified-report-toolbar .form-item[style]{grid-column:auto!important}}

/* === FINAL REVIEWED FIX: Dashboard score card + Cairo reports === */
.db-score-card{
  background:#fff!important;
  border:1px solid rgba(226,232,240,.9)!important;
  color:#062745!important;
  box-shadow:0 12px 35px rgba(15,23,42,.07)!important;
  direction:rtl!important;
  text-align:center!important;
}
.db-score-card::before{display:none!important}
.db-score-card .db-score-num{color:#062745!important}
.db-score-card .db-score-pct{color:#35b84b!important}
.db-score-card .db-score-label,.db-score-card .db-score-date{color:#64748b!important}
.db-score-card .db-ring-bg{stroke:#e2e8f0!important}
.db-score-card .db-score-meta{width:100%;text-align:center!important;direction:rtl!important}
.db-score-card .db-score-ring{margin:auto!important}
.reports-center-pro,.report-output-card,.report-group-card,.report-filter-card,.report-kpi,.report-action-btn,.report-badge,.report-priority-note{font-family:'Cairo','Segoe UI',Tahoma,Arial,sans-serif!important}
@media print{
  html,body,.pro-print-page,.pro-print-page *,.report-output-card,.report-output-card *{
    font-family:'Cairo','Segoe UI',Tahoma,Arial,sans-serif!important;
  }
}


/* GAUGE TEXT ROTATION FIX ONLY — keep card/ring as-is, fix rotated text */
.db-score-card .db-score-inner{
  transform: rotate(0deg) !important;
}

/* Employee smart card print button polish */
.build28-card-btn{font-weight:900!important}
.emp-profile-tab[data-tab="card"]{font-weight:900}


/* Build32 FIX23J - Bulk employees editor */
.bulk-emp-table th{white-space:nowrap}
.bulk-emp-table td{padding:6px!important;vertical-align:middle}
.bulk-emp-table input,.bulk-emp-table select{width:100%;min-width:105px;height:36px;border:1px solid #dbe3ef;border-radius:10px;padding:0 8px;font-weight:800;background:#fff;color:#062745}
.bulk-emp-table input.bulk-readonly{background:#f1f5f9;color:#475569;cursor:not-allowed}
.bulk-emp-table textarea{width:100%}


/* === PRODUCTION CLEAN UI PATCH 2026-05-25 ===
   Remove instructional UI blocks and keep employee action buttons stable. */
#page-employees .note,
#page-employees .help,
#page-employees .hint,
#page-employees .muted.help,
#page-employees [data-help],
.report-priority-note,
.debug,
.debug-box,
.dev-note,
.build-note{display:none!important}

#page-employees .panel:first-child{
  position:sticky!important;
  top:0!important;
  z-index:120!important;
  background:#fff!important;
}
#page-employees .page-tabs{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:10px!important;
  align-items:center!important;
}
#employeeListActionBar,.employee-list-action-bar,
#emp-tab-bulk .btn-row,
.employee-form-header{
  position:sticky!important;
  top:74px!important;
  z-index:110!important;
  background:#fff!important;
  padding:10px 0!important;
  border-bottom:1px solid rgba(226,232,240,.7)!important;
}
.employee-form-header{top:0!important;padding:14px!important}
#employeeListActionBar .btn,.employee-list-action-bar .btn,
#emp-tab-bulk .btn-row .btn,
.employee-form-header button{
  visibility:visible!important;
  opacity:1!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  pointer-events:auto!important;
  white-space:nowrap!important;
  flex:0 0 auto!important;
}
#employeeImportFile{display:none!important}
.employee-form-overlay:not(.hidden){display:flex!important}
.employee-form-modal{max-height:94vh!important;overflow:auto!important}
.employee-form-body #emp-tab-data{display:block!important;visibility:visible!important;opacity:1!important}
@media(max-width:760px){
  #employeeListActionBar,.employee-list-action-bar,#emp-tab-bulk .btn-row{top:94px!important;flex-wrap:wrap!important}
}
@media print{
  #page-employees .note,#page-employees .help,#page-employees .hint,.report-priority-note,.debug,.dev-note,.build-note{display:none!important}
}


@import url("/saudi-theme.css?v=dwamna_saudi_exclusive_2030");