/*
 * الملف: assets/app.css
 * الوظيفة: هوية أضواء كمه (أبيض + أسود + برتقالي اللهب) لكل صفحات النظام، بتصميم الجوال أولاً.
 */
@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700&family=Changa:wght@500;700&display=swap');
:root{
  --ak-black:#141414; --ak-orange:#F28C1E; --ak-flame:#E8531F; --ak-amber:#F7B32B;
  --ak-white:#FFFFFF; --ak-gray:#F4F4F2; --ak-line:#E3E2DE; --ak-muted:#6B6B66;
  --ak-red:#C62828; --ak-green:#2E7D32; --ak-orange-deep:#B9650B;
  --ak-flame-gradient:linear-gradient(90deg,#F7B32B 0%,#F28C1E 50%,#E8531F 100%);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ak-white);color:var(--ak-black);font-family:'Cairo',Tahoma,sans-serif;font-size:15px;line-height:1.7}
h1,h2,h3,h4{font-family:'Changa','Cairo',sans-serif;margin:0 0 .5em;line-height:1.35}
h1{font-size:1.35rem} h2{font-size:1.15rem} h3{font-size:1rem}
a{color:var(--ak-orange-deep);text-decoration:none;font-weight:600}
.num{font-variant-numeric:tabular-nums;direction:ltr;unicode-bidi:isolate;display:inline-block}
.omr{display:inline-block;width:1.9em;height:1em;vertical-align:-0.12em;background:currentColor;
  -webkit-mask:url(RO.svg) no-repeat center/contain;mask:url(RO.svg) no-repeat center/contain;-webkit-print-color-adjust:exact;print-color-adjust:exact}
/* رمز الريال كـ SVG داخلي (للتقارير والفواتير وملفات PDF) */
.ro{display:inline-block;width:1.75em;height:.92em;vertical-align:-.1em;fill:currentColor}
.muted{color:var(--ak-muted)} .small{font-size:.85rem} .center{text-align:center}

/* الشريط العلوي */
.topbar{background:var(--ak-black);color:#fff;display:flex;align-items:center;gap:.7rem;padding:.6rem .9rem;position:sticky;top:0;z-index:30}
.topbar::after{content:"";position:absolute;inset-inline:0;bottom:-4px;height:4px;background:var(--ak-flame-gradient)}
.topbar .brand{font-family:'Changa',sans-serif;font-weight:700;font-size:1.05rem;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.topbar .brand img{height:30px;vertical-align:middle;background:#fff;border-radius:6px;padding:2px;margin-inline-end:.4rem}
.topbar .who{font-size:.8rem;opacity:.85;text-align:left}
.menu-btn{background:none;border:1px solid #444;color:#fff;border-radius:8px;font-size:1.25rem;line-height:1;padding:.3rem .6rem;cursor:pointer}

/* الهيكل والقائمة */
.shell{display:flex;min-height:calc(100vh - 52px)}
.side{width:250px;background:var(--ak-gray);border-inline-end:1px solid var(--ak-line);padding:1.1rem .8rem;flex-shrink:0}
.main{flex:1;min-width:0;padding:1.3rem 1rem 3rem;max-width:1100px;margin:0 auto;width:100%}
.nav3d{display:flex;align-items:center;gap:.6rem;background:#fff;color:var(--ak-black);border:1px solid var(--ak-line);border-radius:12px;
  padding:.65rem .8rem;margin-bottom:.65rem;font-weight:700;box-shadow:0 4px 0 #cfcdc6;transition:transform .08s,box-shadow .08s;position:relative}
.nav3d:active{transform:translateY(3px);box-shadow:0 1px 0 #cfcdc6}
.nav3d.on{background:var(--ak-orange);color:#fff;border-color:var(--ak-orange-deep);box-shadow:0 4px 0 var(--ak-orange-deep)}
.nav3d .ic{font-size:1.15rem;width:1.5rem;text-align:center}
.badge-n{background:var(--ak-red);color:#fff;border-radius:999px;font-size:.72rem;padding:0 .45rem;margin-inline-start:auto;min-width:1.4rem;text-align:center}
.side .sep{font-size:.75rem;color:var(--ak-muted);margin:1rem .3rem .4rem}
@media(max-width:860px){
  .side{position:fixed;inset-block:52px 0;inset-inline-start:0;transform:translateX(100%);transition:transform .2s;z-index:25;overflow-y:auto;box-shadow:0 0 30px rgba(0,0,0,.25)}
  body.menu-open .side{transform:none}
  .topbar .who{display:none}
}
@media(min-width:861px){.menu-btn{display:none}}

/* البطاقات */
.card{background:var(--ak-gray);border:1px solid var(--ak-line);border-radius:14px;padding:1rem;margin-bottom:1rem}
.card.white{background:#fff}
.card h2{border-inline-start:5px solid var(--ak-orange);padding-inline-start:.6rem}
.grid{display:grid;gap:.8rem;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.stat{background:#fff;border:1px solid var(--ak-line);border-radius:12px;padding:.8rem;text-align:center}
.stat b{display:block;font-family:'Changa',sans-serif;font-size:1.35rem}
.stat>span{font-size:.82rem;color:var(--ak-muted);display:block}
.tiles{display:grid;gap:.8rem;grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
.tile{display:block;background:#fff;border:1px solid var(--ak-line);border-radius:14px;padding:1rem .6rem;text-align:center;color:var(--ak-black);
  font-weight:700;box-shadow:0 5px 0 #cfcdc6;position:relative}
.tile:active{transform:translateY(4px);box-shadow:0 1px 0 #cfcdc6}
.tile .ic{display:block;font-size:1.8rem;margin-bottom:.2rem}
.tile .badge-n{position:absolute;top:.4rem;inset-inline-end:.4rem}

/* النماذج */
label{display:block;font-weight:700;font-size:.88rem;margin-bottom:.25rem}
input[type=text],input[type=password],input[type=number],input[type=date],input[type=tel],input[type=email],input[type=file],select,textarea{
  width:100%;padding:.6rem .7rem;border:1px solid #cfcdc6;border-radius:10px;font:inherit;background:#fff;color:var(--ak-black)}
input:focus,select:focus,textarea:focus{outline:2px solid var(--ak-orange);outline-offset:1px}
.row{display:grid;gap:.8rem;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));margin-bottom:.8rem}
.btn{display:inline-block;border:0;border-radius:11px;padding:.6rem 1.1rem;font:inherit;font-weight:700;cursor:pointer;background:var(--ak-orange);color:#fff;
  box-shadow:0 4px 0 var(--ak-orange-deep);transition:transform .08s,box-shadow .08s;text-align:center}
.btn:active{transform:translateY(3px);box-shadow:0 1px 0 var(--ak-orange-deep)}
.btn.dark{background:var(--ak-black);box-shadow:0 4px 0 #000}
.btn.ghost{background:#fff;color:var(--ak-black);border:1px solid #cfcdc6;box-shadow:0 4px 0 #cfcdc6}
.btn.red{background:var(--ak-red);box-shadow:0 4px 0 #8e1c1c}
.btn.sm{padding:.3rem .7rem;font-size:.82rem;border-radius:9px;box-shadow:0 3px 0 var(--ak-orange-deep)}
.btn.sm.ghost{box-shadow:0 3px 0 #cfcdc6} .btn.sm.red{box-shadow:0 3px 0 #8e1c1c} .btn.sm.dark{box-shadow:0 3px 0 #000}
.btn.block{display:block;width:100%}
.actions{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}
.checks{display:grid;gap:.4rem;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.checks label{font-weight:600;display:flex;gap:.5rem;align-items:center;background:#fff;border:1px solid var(--ak-line);border-radius:10px;padding:.45rem .6rem;margin:0}
.checks input{width:1.1rem;height:1.1rem;accent-color:var(--ak-orange)}

/* التنبيهات */
.alert{border-radius:11px;padding:.65rem .9rem;margin-bottom:.8rem;font-weight:600;border:1px solid}
.alert.ok{background:#EAF5EA;border-color:#A5D6A7;color:#1B5E20}
.alert.err{background:#FDECEC;border-color:#EF9A9A;color:#8E1C1C}
.alert.warn{background:#FFF6E0;border-color:var(--ak-amber);color:#6B4A00}
.alert.info{background:#fff;border-color:var(--ak-line)}
.secret{font-family:monospace;font-size:1.15rem;background:#fff;border:2px dashed var(--ak-orange);border-radius:8px;padding:.1rem .6rem;direction:ltr;display:inline-block;user-select:all}

/* الجداول */
.table-wrap{overflow-x:auto;border:1px solid var(--ak-line);border-radius:12px;background:#fff}
table{width:100%;border-collapse:collapse;font-size:.9rem}
th,td{padding:.55rem .6rem;border-bottom:1px solid var(--ak-line);text-align:right;white-space:nowrap}
th{background:var(--ak-black);color:#fff;font-weight:700;font-size:.82rem}
tr:last-child td{border-bottom:0}
tfoot td{font-weight:700;background:var(--ak-gray)}
.tag{display:inline-block;border-radius:999px;padding:0 .6rem;font-size:.78rem;font-weight:700;border:1px solid}
.tag.pending{background:#FFF6E0;border-color:var(--ak-amber);color:#6B4A00}
.tag.credit{background:#E3F2FD;border-color:#90CAF9;color:#0D47A1}
.tag.paid{background:#EAF5EA;border-color:#A5D6A7;color:#1B5E20}
.tag.canceled,.tag.replaced,.tag.off{background:#eee;border-color:#ccc;color:#555}
details.inline{display:inline-block;position:relative}
details.inline summary{list-style:none;cursor:pointer}
details.inline summary::-webkit-details-marker{display:none}
details.inline .pop{background:#fff;border:1px solid var(--ak-line);border-radius:12px;padding:.7rem;margin-top:.4rem;min-width:220px;white-space:normal}

/* صفحات الدخول */
.auth{max-width:420px;margin:0 auto;padding:1.5rem 1rem 3rem}
.auth .logo{text-align:center;margin:1rem 0 1.2rem}
.auth .logo img{max-height:90px}
.auth .logo h1{font-size:1.5rem;margin:.3rem 0 0}
.flame-line{height:4px;background:var(--ak-flame-gradient);border-radius:4px;margin:.6rem 0 1rem}
.tabs{display:flex;gap:.5rem;margin-bottom:1rem}
.tabs a{flex:1;text-align:center;padding:.55rem;border-radius:11px;background:#fff;border:1px solid #cfcdc6;color:var(--ak-black);box-shadow:0 4px 0 #cfcdc6}
.tabs a.on{background:var(--ak-black);color:#fff;border-color:#000;box-shadow:0 4px 0 #000}
.foot{text-align:center;font-size:.8rem;color:var(--ak-muted);padding:1.2rem .5rem}
.foot a{color:var(--ak-muted);margin:0 .4rem}

/* الطباعة A4 */
.print-head{display:none}
@media print{
  @page{size:A4;margin:12mm}
  .topbar,.side,.no-print,.foot,.menu-btn{display:none!important}
  .main{padding:0;max-width:none}
  body{font-size:12px}
  .card{background:#fff;border:0;padding:0}
  .table-wrap{border:0;overflow:visible}
  th{background:#eee!important;color:#000!important;border:1px solid #999}
  td{border:1px solid #bbb}
  .print-head{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:center;font-size:11px;padding-bottom:6px;border-bottom:3px solid var(--ak-orange);margin-bottom:10px}
  .print-head .en{text-align:left;direction:ltr}
  .print-head img{max-height:60px}
}

/* تنزيل PDF: نفس شكل الطباعة (assets/export.js) */
.pdf-mode{background:#fff;color:#000;font-size:12px;direction:rtl}
.pdf-mode .print-head{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:center;font-size:11px;padding-bottom:6px;border-bottom:3px solid var(--ak-orange);margin-bottom:10px}
.pdf-mode .print-head .en{text-align:left;direction:ltr}
.pdf-mode .print-head img{max-height:60px}
.pdf-mode .card{background:#fff;border:0;padding:0;box-shadow:none;margin:0 0 10px}
.pdf-mode .table-wrap{border:0;overflow:visible;border-radius:0;max-height:none}
.pdf-mode th{background:#eee!important;color:#000!important;border:1px solid #999}
.pdf-mode td{border:1px solid #bbb}
.pdf-mode .no-print{display:none!important}

/* خلايا الجداول الرقمية تبقى خلايا جدول */
td.num,th.num{display:table-cell}
