/* ════════════════════════════════════════════════════════════════════════════
   أركان تسعير — نظامُ التصميم (هويّةٌ مستقلّةٌ عن النظام الأمّ)
   وثيقة: AE-UI-001 · الإصدار 1.0 · الجولة 1017أج294
   الفكرة: «الخرسانة وشريطُ القياس» — رمادىُّ الخرسانة للأرضيّة، والجرافيت للهيكل، وأصفرُ شريط المسّاح
   للعنصر الوحيد المميّز (الأرقامُ الحاسمة وزرُّ الإجراء الرئيس). الخطوط: Readex Pro للعناوين والأرقام الكبيرة،
   IBM Plex Sans Arabic للنصّ والجداول (أرقامٌ جدوليّة).
   ════════════════════════════════════════════════════════════════════════════ */
@font-face{font-family:'Readex Pro';font-weight:400;font-display:swap;src:url(../fonts/readex-pro-arabic-400-normal.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F}
@font-face{font-family:'Readex Pro';font-weight:500;font-display:swap;src:url(../fonts/readex-pro-arabic-500-normal.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F}
@font-face{font-family:'Readex Pro';font-weight:600;font-display:swap;src:url(../fonts/readex-pro-arabic-600-normal.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F}
@font-face{font-family:'Readex Pro';font-weight:400;font-display:swap;src:url(../fonts/readex-pro-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+20A0-20CF,U+2190-21FF,U+2212}
@font-face{font-family:'Readex Pro';font-weight:500;font-display:swap;src:url(../fonts/readex-pro-latin-500-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+20A0-20CF,U+2190-21FF,U+2212}
@font-face{font-family:'Readex Pro';font-weight:600;font-display:swap;src:url(../fonts/readex-pro-latin-600-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+20A0-20CF,U+2190-21FF,U+2212}
@font-face{font-family:'Plex Ar';font-weight:400;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-arabic-400-normal.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F}
@font-face{font-family:'Plex Ar';font-weight:500;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-arabic-500-normal.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F}
@font-face{font-family:'Plex Ar';font-weight:600;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-arabic-600-normal.woff2) format('woff2');unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF,U+200C-200F}
@font-face{font-family:'Plex Ar';font-weight:400;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+20A0-20CF,U+2190-21FF,U+2212}
@font-face{font-family:'Plex Ar';font-weight:500;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-latin-500-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+20A0-20CF,U+2190-21FF,U+2212}
@font-face{font-family:'Plex Ar';font-weight:600;font-display:swap;src:url(../fonts/ibm-plex-sans-arabic-latin-600-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+2000-206F,U+20A0-20CF,U+2190-21FF,U+2212}

:root{
  --bg:#E7E9EA; --sheet:#FFFFFF; --sheet-2:#F4F5F6; --ink:#1E2328; --ink-2:#3B434B; --mute:#68727B; --line:#D3D8DC; --line-2:#E3E7EA;
  --rail:#1E2328; --rail-ink:#AEB6BD; --rail-on:#FFFFFF;
  --tape:#F2B705; --tape-2:#FFD34D; --tape-ink:#2B2200; --tape-soft:#FFF4CC;
  --ok:#2E7D5B; --ok-soft:#E3F2EA; --bad:#B8402C; --bad-soft:#FBE7E3; --warn:#9A5B00; --warn-soft:#FDF0DC; --info:#2F5F80; --info-soft:#E4EEF5;
  --r-s:4px; --r-m:8px; --r-l:12px; --shadow:0 1px 0 rgba(30,35,40,.06),0 6px 18px -10px rgba(30,35,40,.25);
  --f-head:'Readex Pro','Plex Ar',system-ui,sans-serif; --f-body:'Plex Ar','Segoe UI',Tahoma,system-ui,sans-serif;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#121518; --sheet:#1B2024; --sheet-2:#22282D; --ink:#E6E9EB; --ink-2:#C3C9CE; --mute:#8D979F; --line:#2F363C; --line-2:#262C31;
  --rail:#0C0F11; --rail-ink:#8D979F; --tape-soft:#3A3110; --ok:#4FB389; --ok-soft:#173327; --bad:#E2735E; --bad-soft:#3A1E19; --warn:#E3A53C; --warn-soft:#352813; --info:#7EB1D4; --info-soft:#18293A;
  --shadow:0 1px 0 rgba(0,0,0,.4),0 8px 22px -12px rgba(0,0,0,.7); color-scheme:dark;}}
:root[data-theme="dark"]{
  --bg:#121518; --sheet:#1B2024; --sheet-2:#22282D; --ink:#E6E9EB; --ink-2:#C3C9CE; --mute:#8D979F; --line:#2F363C; --line-2:#262C31;
  --rail:#0C0F11; --rail-ink:#8D979F; --tape-soft:#3A3110; --ok:#4FB389; --ok-soft:#173327; --bad:#E2735E; --bad-soft:#3A1E19; --warn:#E3A53C; --warn-soft:#352813; --info:#7EB1D4; --info-soft:#18293A;
  --shadow:0 1px 0 rgba(0,0,0,.4),0 8px 22px -12px rgba(0,0,0,.7); color-scheme:dark;}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:14px;line-height:1.6;-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums}
h1,h2,h3,h4{font-family:var(--f-head);font-weight:600;line-height:1.3;margin:0 0 .4em}
h1{font-size:26px} h2{font-size:20px} h3{font-size:16px} h4{font-size:14px}
a{color:var(--info)}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--tape);outline-offset:2px}
.num{font-variant-numeric:tabular-nums;direction:ltr;unicode-bidi:isolate;display:inline-block}
.muted{color:var(--mute)} .small{font-size:12px} .tiny{font-size:11px} .b{font-weight:600}
.ok{color:var(--ok)} .bad{color:var(--bad)} .warn{color:var(--warn)}
.hide{display:none!important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ── الهيكل: قضيبٌ يمينىّ + شريطٌ علوىّ ── */
.shell{display:grid;grid-template-columns:84px 1fr;min-height:100vh}
.rail{background:var(--rail);color:var(--rail-ink);display:flex;flex-direction:column;align-items:stretch;position:sticky;top:0;height:100vh;padding:10px 0;gap:2px;z-index:30}
.rail .mark{display:flex;justify-content:center;padding:6px 0 14px}
.rail a{display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 4px;color:var(--rail-ink);text-decoration:none;font-size:11px;border-inline-start:3px solid transparent;line-height:1.2;text-align:center}
.rail a svg{width:22px;height:22px}
.rail a:hover{color:var(--rail-on)}
.rail a.on{color:var(--rail-on);border-inline-start-color:var(--tape);background:rgba(255,255,255,.04)}
.rail .sp{flex:1}
.main{min-width:0;display:flex;flex-direction:column}
.topbar{height:56px;display:flex;align-items:center;gap:12px;padding:0 20px;background:var(--sheet);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.topbar .co{font-family:var(--f-head);font-weight:600;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.topbar .grow{flex:1}
.search{display:flex;align-items:center;gap:6px;background:var(--sheet-2);border:1px solid var(--line);border-radius:var(--r-m);padding:0 10px;height:34px;min-width:220px;color:var(--mute);cursor:pointer}
.search kbd{font-family:var(--f-body);font-size:11px;border:1px solid var(--line);border-radius:4px;padding:0 5px;margin-inline-start:auto;white-space:nowrap;direction:ltr}
.search span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px}
svg[aria-hidden="true"]{width:18px;height:18px;flex:none;vertical-align:middle}
.search svg{width:16px;height:16px}
.empty > svg{width:34px;height:34px;color:var(--mute)}
.page{padding:22px 24px 120px;max-width:1360px;width:100%;margin:0 auto}
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.page-head h1{margin:0}
.page-head .sub{color:var(--mute);font-size:13px}

/* ── أسطحُ العمل ── */
.panel{background:var(--sheet);border:1px solid var(--line);border-radius:var(--r-l);padding:16px}
.panel + .panel{margin-top:14px}
.panel-h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;flex-wrap:wrap}
.panel-h h3{margin:0}
.grid{display:grid;gap:14px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))} .g3{grid-template-columns:repeat(3,minmax(0,1fr))} .g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.split{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:14px;align-items:start}
@media (max-width:1100px){.split{grid-template-columns:1fr}}
@media (max-width:900px){.g3,.g4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.g2,.g3,.g4{grid-template-columns:1fr}}

/* ── الأرقامُ الحاسمة: بلاطاتٌ بخطٍّ سفلىٍّ كشريط القياس ── */
.stat{background:var(--sheet);border:1px solid var(--line);border-radius:var(--r-m);padding:12px 14px;position:relative;overflow:hidden}
.stat .k{font-size:12px;color:var(--mute)}
.stat .v{font-family:var(--f-head);font-size:22px;font-weight:600;margin-top:2px}
.stat .d{font-size:12px;color:var(--mute)}
.stat.key{border-color:var(--tape)} .stat.key::after{content:"";position:absolute;inset-inline:0;bottom:0;height:6px;background:repeating-linear-gradient(90deg,var(--tape) 0 9px,var(--tape-ink) 9px 10px)}

/* ── الأزرار (بروتوكول 9: 1–3 كلمات + أيقونة + تلميح data-tip، والمجموعاتُ فى ic-bar) ── */
.btn{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 12px;border-radius:var(--r-m);border:1px solid var(--line);background:var(--sheet);color:var(--ink);cursor:pointer;font-size:13px;font-weight:500;white-space:nowrap;text-decoration:none}
.btn svg{width:16px;height:16px;flex:none}
.btn:hover{border-color:var(--ink-2)}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn.pri{background:var(--tape);border-color:var(--tape);color:var(--tape-ink)} .btn.pri:hover{background:var(--tape-2)}
.btn.dark{background:var(--ink);border-color:var(--ink);color:var(--sheet)}
.btn.danger{color:var(--bad)} .btn.danger:hover{border-color:var(--bad)}
.btn.ghost{border-color:transparent;background:transparent}
.btn.sm{height:28px;padding:0 9px;font-size:12px}
.btn.ic{width:34px;padding:0;justify-content:center} .btn.sm.ic{width:28px}
.ic-bar{display:inline-flex;flex-wrap:wrap;gap:6px;align-items:center}
.ic-bar.joined{gap:0} .ic-bar.joined .btn{border-radius:0} .ic-bar.joined .btn:first-child{border-start-start-radius:var(--r-m);border-end-start-radius:var(--r-m)} .ic-bar.joined .btn:last-child{border-start-end-radius:var(--r-m);border-end-end-radius:var(--r-m)} .ic-bar.joined .btn+.btn{margin-inline-start:-1px}
[data-tip]{position:relative}
[data-tip]:hover::after,[data-tip]:focus-visible::after{content:attr(data-tip);position:absolute;bottom:calc(100% + 6px);inset-inline-start:50%;transform:translateX(50%);background:var(--ink);color:var(--sheet);font-size:11.5px;font-weight:400;padding:5px 8px;border-radius:6px;white-space:normal;width:max-content;max-width:240px;z-index:80;pointer-events:none;line-height:1.5}
.rail [data-tip]::after{display:none}

/* ── الحقول ── */
.f{display:flex;flex-direction:column;gap:4px;min-width:0}
.f label{font-size:12px;color:var(--mute)}
.f .hint{font-size:11px;color:var(--mute)}
input[type=text],input[type=email],input[type=password],input[type=number],input[type=date],input[type=tel],input[type=search],input:not([type]),select,textarea{height:34px;border:1px solid var(--line);border-radius:var(--r-s);background:var(--sheet);padding:0 9px;min-width:0;width:100%}
textarea{height:auto;padding:8px 9px;resize:vertical}
input:focus,select:focus,textarea:focus{border-color:var(--ink-2);outline:none;box-shadow:0 0 0 3px var(--tape-soft)}
input[type=number]{direction:ltr;text-align:start}
.row{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}
.row > .f{flex:1;min-width:140px}
.check{display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-size:13px}
.check input{width:16px;height:16px;accent-color:var(--ink)}

/* ── الجداول (كشوفُ المقايسة) ── */
.tbl-wrap{overflow:auto;border:1px solid var(--line);border-radius:var(--r-m);background:var(--sheet)}
table.tbl{width:100%;border-collapse:collapse;font-size:13px}
.tbl th{background:var(--sheet-2);color:var(--ink-2);font-weight:500;font-size:12px;text-align:start;padding:7px 8px;border-bottom:1px solid var(--line);white-space:nowrap;position:sticky;top:0;z-index:1}
.tbl td{padding:5px 8px;border-bottom:1px solid var(--line-2);vertical-align:middle}
.tbl tr:last-child td{border-bottom:0}
.tbl td.n,.tbl th.n{text-align:end;white-space:nowrap}
.tbl tfoot td{background:var(--sheet-2);font-weight:600;border-top:1px solid var(--line)}
.tbl input,.tbl select{height:30px;border-color:transparent;background:transparent;padding:0 6px}
.tbl input:hover,.tbl select:hover{border-color:var(--line)}
.tbl input:focus,.tbl select:focus{border-color:var(--ink-2);background:var(--sheet)}
.tbl tr.click{cursor:pointer} .tbl tr.click:hover td{background:var(--sheet-2)}
.tbl .idx{color:var(--mute);font-size:11px;width:28px}
.w-qty{width:96px} .w-price{width:110px} .w-unit{width:76px} .w-kind{width:112px} .w-pct{width:72px}

/* ── شاراتُ الحالة ── */
.chip{display:inline-flex;align-items:center;gap:4px;height:22px;padding:0 8px;border-radius:11px;font-size:11.5px;font-weight:500;background:var(--sheet-2);color:var(--ink-2);border:1px solid var(--line);white-space:nowrap}
.chip.ok{background:var(--ok-soft);color:var(--ok);border-color:transparent} .chip.bad{background:var(--bad-soft);color:var(--bad);border-color:transparent}
.chip.warn{background:var(--warn-soft);color:var(--warn);border-color:transparent} .chip.info{background:var(--info-soft);color:var(--info);border-color:transparent}
.chip.tape{background:var(--tape);color:var(--tape-ink);border-color:transparent}
.dot{width:8px;height:8px;border-radius:50%;display:inline-block;background:currentColor}

/* ── شريطُ خطوات التحليل (تسلسلٌ حقيقىّ) ── */
.steps{display:flex;gap:0;border:1px solid var(--line);border-radius:var(--r-m);background:var(--sheet);overflow:auto;margin-bottom:14px}
.steps button{flex:1;min-width:120px;display:flex;align-items:center;gap:8px;padding:10px 12px;border:0;background:transparent;cursor:pointer;border-inline-end:1px solid var(--line-2);text-align:start;color:var(--ink-2)}
.steps button:last-child{border-inline-end:0}
.steps .no{width:22px;height:22px;border-radius:50%;border:1.5px solid var(--line);display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-family:var(--f-head);flex:none}
.steps button.on{background:var(--sheet-2);color:var(--ink);font-weight:600}
.steps button.on .no{background:var(--ink);border-color:var(--ink);color:var(--sheet)}
.steps button.lock{opacity:.55}
.steps .lbl{font-size:13px;line-height:1.25}

/* ── الشريطُ الأصفر: الخلاصةُ الحيّة أسفل المحرّر (العنصرُ المميّز للهويّة) ── */
.tape-bar{position:fixed;bottom:0;inset-inline-start:84px;inset-inline-end:0;z-index:25;background:var(--tape);color:var(--tape-ink);box-shadow:0 -6px 18px -12px rgba(0,0,0,.4)}
.tape-bar::before{content:"";display:block;height:7px;background:repeating-linear-gradient(90deg,var(--tape-ink) 0 1px,transparent 1px 10px),repeating-linear-gradient(90deg,var(--tape-ink) 0 1.5px,transparent 1.5px 50px);background-size:auto 4px,auto 7px;background-repeat:repeat-x;opacity:.55}
.tape-bar .in{display:flex;align-items:center;gap:22px;padding:6px 24px 9px;max-width:1360px;margin:0 auto;overflow-x:auto}
.tape-bar .it{display:flex;flex-direction:column;line-height:1.2;white-space:nowrap}
.tape-bar .it .k{font-size:11px;opacity:.75}
.tape-bar .it .v{font-family:var(--f-head);font-weight:600;font-size:18px}
.tape-bar .it.big .v{font-size:22px}
.tape-bar .sep{width:1px;align-self:stretch;background:rgba(43,34,0,.25)}
.tape-bar .grow{flex:1}
.tape-bar .btn{background:var(--tape-ink);color:var(--tape);border-color:var(--tape-ink)}
.tape-bar .neg .v{color:#8B1A0A}

/* ── النوافذ والتنبيهات ── */
.modal-bg{position:fixed;inset:0;background:rgba(18,21,24,.55);display:flex;align-items:flex-start;justify-content:center;padding:6vh 14px 14px;z-index:90;overflow:auto}
.modal{background:var(--sheet);border-radius:var(--r-l);width:100%;max-width:620px;box-shadow:0 20px 60px -20px rgba(0,0,0,.5);display:flex;flex-direction:column;max-height:88vh}
.modal.wide{max-width:980px} .modal.narrow{max-width:440px}
.modal-h{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 18px;border-bottom:1px solid var(--line)}
.modal-h h3{margin:0}
.modal-b{padding:16px 18px;overflow:auto}
.modal-f{display:flex;gap:8px;justify-content:flex-start;padding:12px 18px;border-top:1px solid var(--line);flex-wrap:wrap}
.toasts{position:fixed;bottom:84px;inset-inline-start:100px;display:flex;flex-direction:column;gap:8px;z-index:95}
.toast{background:var(--ink);color:var(--sheet);padding:10px 14px;border-radius:var(--r-m);box-shadow:var(--shadow);font-size:13px;max-width:420px}
.toast.bad{background:var(--bad);color:#fff} .toast.ok{border-inline-start:4px solid var(--tape)}
.banner{display:flex;align-items:center;gap:10px;padding:9px 14px;border-radius:var(--r-m);font-size:13px;margin-bottom:14px;flex-wrap:wrap}
.banner.warn{background:var(--warn-soft);color:var(--warn)} .banner.bad{background:var(--bad-soft);color:var(--bad)} .banner.info{background:var(--info-soft);color:var(--info)} .banner.tape{background:var(--tape-soft);color:var(--ink)}
.empty{padding:36px 16px;text-align:center;color:var(--mute)}
.empty h3{color:var(--ink)}
.empty .btn{margin-top:10px}

/* ── قوائمُ وبطاقاتٌ صغيرة ── */
.list{display:flex;flex-direction:column}
.li{display:flex;align-items:center;gap:12px;padding:10px 4px;border-bottom:1px solid var(--line-2);cursor:pointer;text-decoration:none;color:inherit}
.li:hover{background:var(--sheet-2)}
.li:last-child{border-bottom:0}
.li .t{font-weight:500}
.li .grow{flex:1;min-width:0}
.bars{display:flex;flex-direction:column;gap:6px}
.bar{display:grid;grid-template-columns:110px 1fr 90px;gap:8px;align-items:center;font-size:12px}
.bar .tr{height:10px;background:var(--sheet-2);border-radius:5px;overflow:hidden}
.bar .fl{height:100%;background:var(--ink-2);border-radius:5px}
.bar .fl.t{background:var(--tape)}
.kv{display:grid;grid-template-columns:1fr auto;gap:4px 12px;font-size:13px}
.kv .tot{font-weight:600;border-top:1px solid var(--line);padding-top:4px}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:14px;overflow:auto}
.tabs button{border:0;background:transparent;padding:8px 12px;cursor:pointer;color:var(--mute);border-bottom:2px solid transparent;white-space:nowrap}
.tabs button.on{color:var(--ink);border-bottom-color:var(--ink);font-weight:600}
.tree{font-size:13px}
.tree .cat{font-weight:600;padding:6px 4px;display:flex;gap:6px;align-items:center;cursor:pointer}
.tree .it{padding:4px 4px 4px 0;padding-inline-start:22px;display:flex;gap:6px;align-items:center;cursor:pointer;border-radius:4px}
.tree .it.wk{padding-inline-start:40px;color:var(--ink-2)}
.tree .it:hover{background:var(--sheet-2)}
.tree .it.on{background:var(--tape-soft)}
.code{font-size:11px;color:var(--mute);direction:ltr}
.spark{display:block;width:100%;height:60px}
.timeline{list-style:none;margin:0;padding:0;font-size:12.5px}
.timeline li{padding:4px 0 4px;padding-inline-start:14px;border-inline-start:2px solid var(--line);position:relative}
.timeline li::before{content:"";position:absolute;inset-inline-start:-5px;top:10px;width:8px;height:8px;border-radius:50%;background:var(--ink-2)}

/* ── شاشاتُ الدخول ── */
.auth{min-height:100vh;display:grid;grid-template-columns:1fr minmax(360px,460px)}
.auth .side{background:var(--rail);color:#E6E9EB;padding:48px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}
.auth .side h1{font-size:34px;color:#fff;max-width:14ch}
.auth .side p{color:#AEB6BD;max-width:46ch}
.auth .form{background:var(--sheet);padding:48px 40px;display:flex;flex-direction:column;justify-content:center;gap:12px}
@media (max-width:860px){.auth{grid-template-columns:1fr}.auth .side{display:none}}

/* ── الجوّال ── */
@media (max-width:760px){
  .shell{grid-template-columns:1fr}
  .rail{position:fixed;bottom:0;top:auto;height:62px;width:100%;flex-direction:row;padding:0;overflow-x:auto;z-index:40}
  .rail .mark,.rail .sp{display:none}
  .rail a{flex:1;min-width:64px;border-inline-start:0;border-top:3px solid transparent;font-size:10px}
  .rail a.on{border-top-color:var(--tape)}
  .tape-bar{inset-inline-start:0;bottom:62px}
  .page{padding:16px 16px 170px}
  .search{min-width:0} .search span,.search kbd{display:none}
  .toasts{inset-inline-start:16px;bottom:140px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ── الطباعة (عرضُ السعر والتحليل على A4) ── */
.print-only{display:none}
@media print{
  body{background:#fff;color:#000}
  .rail,.topbar,.tape-bar,.no-print,.modal-bg .modal-f,.toasts{display:none!important}
  .shell{display:block} .page{padding:0;max-width:none}
  .panel{border:0;padding:0} .print-only{display:block}
  .modal-bg{position:static;background:none;padding:0;display:block} .modal{box-shadow:none;max-height:none;max-width:none}
  .modal-h{display:none} .modal-b{overflow:visible;padding:0}
  @page{size:A4;margin:14mm}
}
.doc-print{font-size:12.5px;color:#111}
.doc-print .hd{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:3px solid #1E2328;padding-bottom:10px;margin-bottom:12px}
.doc-print .hd img{max-height:64px;max-width:180px}
.doc-print table{width:100%;border-collapse:collapse;margin:8px 0}
.doc-print th,.doc-print td{border:1px solid #bbb;padding:5px 7px;text-align:start}
.doc-print th{background:#F2F2F2}
.doc-print td.n{text-align:end}
.doc-print .tot td{font-weight:700}
.doc-print .sig{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:40px}
.doc-print .sig div{border-top:1px solid #999;padding-top:6px;text-align:center}