/* بوابة SMC — كحلي عميق + ذهبي، ووضع فاتح تلقائي */
:root{
  --bg:#0A0E17; --panel:#121826; --panel2:#171E2E; --line:#222A3C; --line2:#2E3850;
  --fg:#EEF0F4; --muted:#8A93A6; --gold:#D4A84B; --on-gold:#0A0E17;
  --late:#E8907A; --late-bg:#1A1412; --late-line:#4A2E26;
  --ok:#9BC4A8; --ok-line:#2B4A37; --warn:#D4A84B; --warn-line:#5C4A22;
  --radius:16px; color-scheme:dark;
}
@media (prefers-color-scheme: light){
  :root{
    --bg:#F3F4F7; --panel:#FFFFFF; --panel2:#FFFFFF; --line:#E3E6EC; --line2:#D3D8E2;
    --fg:#141A26; --muted:#5D6578; --gold:#A8812F; --on-gold:#FFFFFF;
    --late:#B5543F; --late-bg:#FBEEEA; --late-line:#EBC9BF;
    --ok:#3F7A55; --ok-line:#C7DFCF; --warn:#9A7424; --warn-line:#E6D3A6; color-scheme:light;
  }
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--fg);font-family:"Readex Pro",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
body{min-height:100vh}
button,input,select,textarea{font:inherit;color:inherit}
.wrap{max-width:560px;margin:0 auto;padding:max(18px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) 96px max(16px,env(safe-area-inset-left));display:flex;flex-direction:column;gap:16px}
.wide .wrap{max-width:1200px}
.top{display:flex;justify-content:space-between;align-items:center}
.who{display:flex;align-items:center;gap:10px}
.avatar{width:40px;height:40px;border-radius:50%;background:var(--panel2);border:1px solid var(--line2);display:flex;align-items:center;justify-content:center;color:var(--gold);font-weight:600}
.who b{display:block;font-size:15px;font-weight:600}.who small{color:var(--muted);font-size:11px}
.logo{height:26px;width:auto}
.logo-dark{display:block}.logo-light{display:none}
@media (prefers-color-scheme: light){.logo-dark{display:none}.logo-light{display:block}}
.ask{background:linear-gradient(160deg,var(--panel2),var(--panel));border:1px solid var(--line2);border-radius:22px;padding:16px;display:flex;flex-direction:column;gap:12px}
.ask .label{font-size:13px;color:var(--gold)}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{border:1px solid var(--line2);background:transparent;border-radius:99px;padding:9px 14px;font-size:13px;cursor:pointer;min-height:40px}
.chip.on,.chip:hover{border-color:var(--gold);color:var(--gold)}
.kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.kpi{border:1px solid var(--line);border-radius:var(--radius);padding:12px;display:flex;flex-direction:column;gap:4px;background:var(--panel)}
.kpi span{font-size:11px;color:var(--muted)}.kpi b{font-size:19px;font-weight:600;font-variant-numeric:tabular-nums}
.kpi.late{background:var(--late-bg);border-color:var(--late-line)}.kpi.late span,.kpi.late b{color:var(--late)}
.kpi.gold b{color:var(--gold)}
.sec{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.sec h2{margin:0;font-size:16px;font-weight:600}
.en{font-family:Montserrat,sans-serif;letter-spacing:3px;font-size:9px;color:var(--muted)}
.week{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;text-align:center}
.day{border:1px solid var(--line);border-radius:12px;padding:8px 0;display:flex;flex-direction:column;gap:2px;background:var(--panel)}
.day span{font-size:10px;color:var(--muted)}.day b{font-size:15px;font-weight:600}
.day.today{background:var(--gold);border-color:var(--gold)}.day.today span,.day.today b{color:var(--on-gold)}
.day.late{background:var(--late-bg);border-color:var(--late-line)}.day.late span,.day.late b{color:var(--late)}
.list{display:flex;flex-direction:column;gap:8px}
.row{display:flex;align-items:center;gap:12px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:12px 14px}
.bar{width:4px;align-self:stretch;border-radius:4px;background:var(--line2)}
.row.late .bar{background:var(--late)}.row.soon .bar{background:var(--gold)}.row.done .bar{background:var(--ok)}
.row .main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.row .main b{font-size:14px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.row .main small{font-size:11px;color:var(--muted)}
.pill{font-size:11px;border:1px solid var(--line2);border-radius:99px;padding:3px 10px;white-space:nowrap}
.pill.late{color:var(--late);border-color:var(--late-line)}.pill.ok{color:var(--ok);border-color:var(--ok-line)}.pill.warn{color:var(--warn);border-color:var(--warn-line)}
.btn{border:0;border-radius:14px;min-height:50px;padding:0 18px;background:var(--gold);color:var(--on-gold);font-weight:600;font-size:16px;cursor:pointer}
.btn.ghost{background:transparent;border:1px solid var(--line2);color:var(--fg);font-weight:400}
.btn.small{min-height:38px;font-size:13px;padding:0 12px;border-radius:10px}
.btn:disabled{opacity:.5;cursor:default}
.card{background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:18px;display:flex;flex-direction:column;gap:14px}
label.f{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--muted)}
.f input,.f select,.f textarea{min-height:48px;border:1px solid var(--line2);border-radius:12px;background:var(--bg);padding:0 14px;font-size:16px;color:var(--fg)}
.f input:focus,.f select:focus{outline:2px solid var(--gold);outline-offset:1px}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.seg{display:flex;flex-wrap:wrap;gap:8px}
.seg label{display:flex;align-items:center;gap:6px;border:1px solid var(--line2);border-radius:99px;padding:9px 14px;font-size:14px;cursor:pointer;color:var(--fg);min-height:42px}
.seg input{position:absolute;opacity:0;pointer-events:none}
.seg label:has(input:checked){border-color:var(--gold);background:var(--gold);color:var(--on-gold)}
.check{display:flex;gap:10px;align-items:center;padding:12px;border-radius:12px;border:1px solid var(--warn-line);color:var(--fg);font-size:14px}
.check input{width:20px;height:20px;accent-color:var(--gold)}
.note{font-size:13px;color:var(--muted);line-height:1.6}
.err{color:var(--late);font-size:14px;min-height:20px}
.okmsg{color:var(--ok);font-size:14px}
.nav{position:fixed;bottom:0;left:0;right:0;padding:10px max(16px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(12px);border-top:1px solid var(--line)}
.nav div{max-width:560px;margin:0 auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));text-align:center}
.nav a{color:var(--muted);text-decoration:none;font-size:12px;padding:8px 0}
.nav a.on{color:var(--gold);font-weight:600}
.back{background:none;border:0;color:var(--muted);font-size:14px;cursor:pointer;padding:6px 0;text-align:right}
.empty{padding:22px;text-align:center;color:var(--muted);border:1px dashed var(--line2);border-radius:var(--radius);font-size:14px}
/* شاشة الدخول */
.login{min-height:100vh;position:relative;display:flex;flex-direction:column;align-items:center;padding:56px 28px 40px;background:#05070D;color:#F3EDE0;overflow:hidden;color-scheme:dark}
.login .bgimg{position:absolute;inset:0 0 auto 0;height:62vh;background:url(hero.jpg) center/cover no-repeat;opacity:.9}
.login .shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,7,13,.35) 0%,rgba(5,7,13,.6) 40%,#05070D 64%)}
.login .corner{position:absolute;width:26px;height:26px;border-color:#D4A84B;border-style:solid;border-width:0}
.login .tl{top:18px;left:18px;border-top-width:1px;border-left-width:1px}.login .tr{top:18px;right:18px;border-top-width:1px;border-right-width:1px}
.login .bl{bottom:18px;left:18px;border-bottom-width:1px;border-left-width:1px}.login .br{bottom:18px;right:18px;border-bottom-width:1px;border-right-width:1px}
.login .inner{position:relative;width:100%;max-width:380px;flex:1;display:flex;flex-direction:column;align-items:center}
.login .brand{margin-top:16vh;display:flex;flex-direction:column;align-items:center;gap:10px}
.login .brand img{width:210px;height:auto}
.login .rule{width:40px;height:1px;background:#D4A84B;margin-top:8px}
.login form{margin-top:auto;width:100%;display:flex;flex-direction:column;gap:12px;padding-top:40px}
.login .f input{background:rgba(255,255,255,.05);border-color:#3A3F4C;color:#F3EDE0}
.login .f{color:#CFC6B2}
.login .btn{background:#D4A84B;color:#05070D}
.login .note{color:#8E887C;text-align:center}
/* لوحة المالك على الشاشة العريضة */
@media (min-width:900px){
  .wide .kpis{grid-template-columns:repeat(4,minmax(0,1fr))}
  .wide .cols{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:16px;align-items:start}
}
/* الطباعة: السند الحراري 80 ملم، أبيض دائمًا */
#print{display:none}
@media print{
  @page{size:72mm 297mm;margin:0}
  #app{display:none!important}
  #print{display:block;width:72mm;padding:2mm 1.5mm;color:#000;background:#fff;font-size:12px;line-height:1.55;font-family:"Readex Pro",Tahoma,sans-serif}
  html,body{background:#fff}
}
.rc .c{text-align:center}.rc h1{font-size:20px;margin:0;letter-spacing:1px}.rc .sub{font-size:11px}
.rc hr{border:0;border-top:1px dashed #000;margin:6px 0}
.rc table{width:100%;border-collapse:collapse}.rc td{padding:1px 0;vertical-align:top}
.rc td:last-child{text-align:left;white-space:nowrap;font-variant-numeric:tabular-nums}
.rc .big td{font-size:14px;font-weight:700}.rc .big td:first-child{white-space:nowrap}
.rc svg{width:34mm;height:34mm;display:block;margin:0 auto}
.rc .sig{margin-top:14px;display:flex;justify-content:space-between;font-size:11px}
@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}