@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@400;500;600;700;800&display=swap');

:root{
  --ath-navy:#003b73;
  --ath-navy-dark:#002b55;
  --ath-gold:#f2b300;
  --ath-bg:#f5f7fb;
  --ath-card:#ffffff;
  --ath-text:#172033;
  --ath-muted:#667085;
  --ath-border:#e6eaf0;
  --ath-shadow:0 8px 22px rgba(0,59,115,.07);
  --ath-radius:18px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0!important;
  padding:0!important;
  direction:rtl;
  font-family:'IBM Plex Sans Arabic',Tahoma,Arial,sans-serif!important;
  background:var(--ath-bg)!important;
  color:var(--ath-text)!important;
  line-height:1.65;
  font-size:15px;
}
a{color:var(--ath-navy);font-weight:700;text-decoration:none}
a:hover{text-decoration:underline}
.ath-shell{width:min(1080px,100%);margin:0 auto;padding:14px}
.ath-header{
  background:linear-gradient(135deg,var(--ath-navy),var(--ath-navy-dark));
  color:#fff;
  border-radius:20px;
  padding:14px;
  margin:0 0 12px;
  box-shadow:var(--ath-shadow);
}
.ath-header-inner{display:flex;align-items:center;gap:12px}
.ath-logo{width:60px;height:60px;object-fit:contain;background:#fff;border-radius:16px;padding:7px;flex:0 0 auto}
.ath-kicker{margin:0 0 1px;color:#dbeafe;font-size:12px;font-weight:600}
.ath-title{margin:0!important;color:#fff!important;font-size:22px!important;line-height:1.25;font-weight:800!important;letter-spacing:-.3px}
.ath-subtitle{margin:3px 0 0;color:#eef6ff;font-size:13px;font-weight:400}
.ath-nav{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 12px}
.ath-nav a{background:#fff;color:var(--ath-navy);border:1px solid var(--ath-border);border-radius:13px;padding:8px 12px;font-size:14px;font-weight:700;box-shadow:0 4px 12px rgba(0,59,115,.04);text-decoration:none}
.ath-nav a.active{background:var(--ath-gold);border-color:var(--ath-gold);color:#172033}
h1,h2,h3{color:var(--ath-text);font-weight:800;letter-spacing:-.35px}
h1{font-size:25px;margin:12px 0 10px}h2{font-size:20px;margin:18px 0 10px}h3{font-size:17px;margin:16px 0 8px}
hr{border:0;border-top:1px solid var(--ath-border);margin:14px 0}
.ath-card,.card,form,table,.note,.top,.page>.note{background:#fff;border:1px solid var(--ath-border);border-radius:var(--ath-radius);box-shadow:var(--ath-shadow)}
.ath-card{padding:16px;margin:10px 0}.top{padding:16px;margin:10px 0}.top h1{margin-top:0}.top p{margin-bottom:0;color:var(--ath-muted)}
.page{max-width:none;margin:0;padding:0}.nav{display:none!important}
.ath-info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:10px 0}
.ath-info{background:#fff;border:1px solid var(--ath-border);border-radius:16px;padding:13px;box-shadow:var(--ath-shadow)}
.ath-info b{display:block;color:var(--ath-muted);font-size:12px;margin-bottom:2px}.ath-info strong{display:block;font-size:17px;color:var(--ath-text)}
.ath-actions-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:10px;margin:12px 0}
.ath-action{display:block;background:#fff;border:1px solid var(--ath-border);border-radius:18px;padding:14px;min-height:90px;box-shadow:var(--ath-shadow);text-decoration:none!important}
.ath-action span{display:block;font-size:23px;margin-bottom:5px}.ath-action strong{display:block;color:var(--ath-text);font-size:15px}.ath-action small{display:block;color:var(--ath-muted);font-weight:500;margin-top:2px;font-size:12px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-top:12px}.card{padding:16px}.card h2{margin-top:0;color:var(--ath-navy)}.card ul{list-style:none;margin:0;padding:0}.card li{padding:8px 0;border-bottom:1px solid #f1f3f7}.card li:last-child{border-bottom:0}.note{background:#fff8e1!important;border-color:#ffe1a0!important;color:#784b00!important;padding:13px;line-height:1.8}
form{padding:14px;margin:10px 0 14px}form br{display:none}label{display:block;margin:8px 0 5px;font-weight:700}
input:not([type=checkbox]):not([type=radio]),select,textarea{width:100%;max-width:520px;padding:11px 12px;margin:3px 0 9px;border-radius:13px;border:1px solid var(--ath-border);font-family:inherit!important;font-size:15px;background:#fff;color:var(--ath-text)}
button,input[type=submit]{width:auto;display:inline-flex;align-items:center;justify-content:center;background:var(--ath-navy);color:#fff;border:0;border-radius:13px;padding:10px 15px;font-family:inherit!important;font-size:14px;font-weight:800;cursor:pointer}
table{width:100%;border-collapse:separate!important;border-spacing:0;margin:10px 0 14px;overflow:hidden}th{background:var(--ath-navy);color:#fff;font-weight:800}th,td{padding:10px;border:0!important;border-bottom:1px solid var(--ath-border)!important;text-align:right;vertical-align:middle}tr:last-child td{border-bottom:0!important}td form{box-shadow:none;border-radius:12px;padding:8px;margin:3px 0}
img{max-width:100%;height:auto}td img{max-width:130px!important}
p[style*="green"],.success{color:#15803d!important;background:#ecfdf5;border:1px solid #bbf7d0;padding:9px 11px;border-radius:13px}p[style*="red"],.error{color:#b91c1c!important;background:#fef2f2;border:1px solid #fecaca;padding:9px 11px;border-radius:13px}
@media(max-width:720px){
 body{font-size:14px;line-height:1.6}.ath-shell{padding:8px}.ath-header{border-radius:0 0 18px 18px;padding:9px 10px;margin:-8px -8px 10px}.ath-header-inner{gap:9px}.ath-logo{width:44px;height:44px;border-radius:13px;padding:5px}.ath-kicker{font-size:11px}.ath-title{font-size:18px!important}.ath-subtitle{font-size:11px;line-height:1.4;white-space:normal}.ath-nav{gap:7px;overflow-x:auto;flex-wrap:nowrap;padding:0 0 3px;margin-bottom:10px;scrollbar-width:none}.ath-nav::-webkit-scrollbar{display:none}.ath-nav a{flex:0 0 auto;padding:8px 11px;border-radius:12px;font-size:13px}h1{font-size:22px;margin:10px 0 8px}h2{font-size:18px}.ath-info-grid{grid-template-columns:1fr 1fr;gap:8px}.ath-actions-grid{grid-template-columns:1fr 1fr;gap:8px}.ath-card,.card,form,.top{border-radius:16px;padding:12px}.ath-action{min-height:80px;padding:12px;border-radius:16px}.ath-action span{font-size:21px}.ath-action strong{font-size:14px}.ath-action small{font-size:11px}input,select,textarea,button,input[type=submit]{max-width:100%;font-size:14px}table{display:block;overflow-x:auto;white-space:nowrap;border-radius:16px}th,td{padding:9px 8px} }
@media(max-width:390px){.ath-info-grid,.ath-actions-grid{grid-template-columns:1fr}.ath-title{font-size:17px!important}.ath-subtitle{display:none}}
@media print{.ath-header,.ath-nav,.no-print{display:none!important}body{background:#fff!important}.ath-shell{padding:0}}


/* v4 fixes */
.ath-section{background:#fff;border:1px solid var(--ath-border);border-radius:var(--ath-radius);box-shadow:var(--ath-shadow);padding:16px;margin:12px 0}
.ath-section h2,.ath-section h3{margin-top:0}
.ath-checks{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:8px;margin:10px 0 12px}
.ath-check{display:flex;align-items:center;gap:8px;background:#f8fafc;border:1px solid var(--ath-border);border-radius:13px;padding:8px 10px;margin:0;font-weight:600}
.ath-check input[type="checkbox"]{width:18px!important;height:18px!important;min-width:18px;margin:0;accent-color:var(--ath-gold)}
.ath-table-wrap{width:100%;overflow-x:auto;border-radius:var(--ath-radius);box-shadow:var(--ath-shadow);background:#fff;border:1px solid var(--ath-border);margin:10px 0 14px}
.ath-table-wrap table{margin:0;box-shadow:none;border:0;border-radius:0;min-width:760px}
.ath-muted-link{display:inline-flex;background:#fff;border:1px solid var(--ath-border);border-radius:12px;padding:8px 12px;margin:0 0 10px;text-decoration:none!important}
@media(max-width:720px){
 .ath-section{padding:12px;border-radius:16px;margin:10px 0}
 .ath-checks{grid-template-columns:1fr;gap:7px}
 .ath-table-wrap table{min-width:720px}
}

/* Supervisor full layout fixes */
form.no-card,
td form.no-card{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  padding:0!important;
  margin:0!important;
  display:flex;
  gap:6px;
  align-items:center;
  flex-wrap:wrap;
}
td form.no-card select{max-width:240px;margin:0!important}
td form.no-card button{padding:9px 12px}
@media(max-width:720px){
  td form.no-card{min-width:260px}
  td form.no-card select{max-width:180px}
}