/* design/albait-tokens.css */
/* البيت بيتك · دستور التصميم ١ · الألوان والمقاسات · الإصدار ٢ (ألوان المراحل --stg-1 إلى --stg-8). ملف واحد مشترك: لا تُنسخ قيمه في ملفات الصفحات */
@font-face{font-family:"Sayah Sans";src:url("/assets/fonts/SayahSans-Regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Sayah Sans";src:url("/assets/fonts/SayahSans-Medium.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Sayah Sans";src:url("/assets/fonts/SayahSans-Bold.woff2") format("woff2");font-weight:700;font-display:swap}
:root{--paper:#F6F5F1;--sheet:#FFFFFF;--ink:#1F1A17;--ink-2:#5E554E;--ink-3:#7A6E66;--line:#D9D3CB;--line-2:#B9B0A5;--line-ctl:#8C8177;--terra:#A65338;--on-terra:#FFFFFF;--terra-wash:#F4E3DC;--focus:#1F1A17;--ok:#3F6B4E;--ok-wash:#E7EEE9;--warn:#8F4E1E;--warn-wash:#F5E9DC;--stop:#9B2F22;--stop-wash:#F6E2DE;--room-bayti:#5E6E34;--room-bayti-wash:#EEF0E1;--room-maktabi:#1F1A17;--room-maktabi-wash:#ECE9E5;--room-mashrooi:#2E4A6E;--room-mashrooi-wash:#E5EBF2;--pen:#1F1A17;--shadow-card:0 1px 2px rgba(31,26,23,.04), 0 16px 32px -28px rgba(31,26,23,.30);--shadow-sheet:0 2px 4px rgba(31,26,23,.05), 0 40px 80px -40px rgba(31,26,23,.45);--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:48px;--space-8:72px;--space-9:96px;--radius-sm:6px;--radius-ctl:10px;--radius-card:14px;--radius-sheet:18px;--radius-pill:999px;--ctl-sm:36px;--ctl-md:44px;--ctl-lg:52px;--paper-grid:0.11;--paper-lines:0.12;--paper-dots:0.28;--pen-ink:0.4;--pen-ink-strong:0.56;--font-sans:"Sayah Sans","Noto Kufi Arabic",Tahoma,sans-serif;--font-mono:ui-monospace,Menlo,monospace;--ease:cubic-bezier(.22,1,.36,1);--stg-1:#8F8579;--stg-2:#5E554E;--stg-3:#4F7BA8;--stg-4:#23466F;--stg-5:#8E6FA6;--stg-6:#164F59;--stg-7:#8A6D3B;--stg-8:#1F1A17;color-scheme:light}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--paper:#161311;--sheet:#1E1A17;--ink:#EDE7E0;--ink-2:#B3A89D;--ink-3:#A2968B;--line:#3A332D;--line-2:#5A5048;--line-ctl:#7A6E64;--terra:#D47B58;--on-terra:#1F1A17;--terra-wash:#3A2620;--focus:#EDE7E0;--ok:#7FB08F;--ok-wash:#1F2D24;--warn:#D99A5E;--warn-wash:#3A2A1C;--stop:#E07A6B;--stop-wash:#3D1F1B;--room-bayti:#A9B97A;--room-bayti-wash:#262A1C;--room-maktabi:#EDE7E0;--room-maktabi-wash:#2A2521;--room-mashrooi:#8FA9CC;--room-mashrooi-wash:#1C2430;--pen:#EDE7E0;--shadow-card:0 1px 2px rgba(0,0,0,.30), 0 16px 32px -24px rgba(0,0,0,.60);--shadow-sheet:0 2px 4px rgba(0,0,0,.35), 0 40px 80px -40px rgba(0,0,0,.75);--stg-1:#A79C90;--stg-2:#D6CCC2;--stg-3:#8FB3DA;--stg-4:#5E86B8;--stg-5:#B99AD0;--stg-6:#6FC0CB;--stg-7:#D2AF6E;--stg-8:#EDE7E0;color-scheme:dark}}
:root[data-theme="dark"]{--stg-1:#A79C90;--stg-2:#D6CCC2;--stg-3:#8FB3DA;--stg-4:#5E86B8;--stg-5:#B99AD0;--stg-6:#6FC0CB;--stg-7:#D2AF6E;--stg-8:#EDE7E0;--paper:#161311;--sheet:#1E1A17;--ink:#EDE7E0;--ink-2:#B3A89D;--ink-3:#A2968B;--line:#3A332D;--line-2:#5A5048;--line-ctl:#7A6E64;--terra:#D47B58;--on-terra:#1F1A17;--terra-wash:#3A2620;--focus:#EDE7E0;--ok:#7FB08F;--ok-wash:#1F2D24;--warn:#D99A5E;--warn-wash:#3A2A1C;--stop:#E07A6B;--stop-wash:#3D1F1B;--room-bayti:#A9B97A;--room-bayti-wash:#262A1C;--room-maktabi:#EDE7E0;--room-maktabi-wash:#2A2521;--room-mashrooi:#8FA9CC;--room-mashrooi-wash:#1C2430;--pen:#EDE7E0;--shadow-card:0 1px 2px rgba(0,0,0,.30), 0 16px 32px -24px rgba(0,0,0,.60);--shadow-sheet:0 2px 4px rgba(0,0,0,.35), 0 40px 80px -40px rgba(0,0,0,.75);color-scheme:dark}
.t-display{font-family:var(--font-sans);font-size:56px;line-height:1.2;font-weight:700}
.t-h1{font-family:var(--font-sans);font-size:36px;line-height:1.25;font-weight:700}
.t-h2{font-family:var(--font-sans);font-size:26px;line-height:1.3;font-weight:700}
.t-h3{font-family:var(--font-sans);font-size:20px;line-height:1.35;font-weight:700}
.t-lead{font-family:var(--font-sans);font-size:17px;line-height:1.8;font-weight:400}
.t-body{font-family:var(--font-sans);font-size:15px;line-height:1.75;font-weight:400}
.t-label{font-family:var(--font-sans);font-size:14px;line-height:1.5;font-weight:700}
.t-small{font-family:var(--font-sans);font-size:13px;line-height:1.6;font-weight:400}
.t-caption{font-family:var(--font-sans);font-size:12px;line-height:1.5;font-weight:700}
@media (max-width:860px){.t-display{font-size:38px}.t-h1{font-size:28px}}

/* design/albait-components.css */
/* البيت بيتك · دستور التصميم ١ · المكونات · الإصدار ٢: كل المقاسات على السلّم التسع */

/* مكونات البيت بيتك. كل قيمة من tokens.css */
.ab{font-family:var(--font-sans);color:var(--ink);direction:rtl}
.ab-btn{font-family:var(--font-sans);font-weight:700;font-size:14px;height:var(--ctl-md);padding-inline:20px;border-radius:var(--radius-ctl);border:0;background:var(--terra);color:var(--on-terra);display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);cursor:pointer;text-decoration:none;white-space:nowrap}
.ab-btn:hover{filter:brightness(.95)}
.ab-btn:focus-visible,.ab-chip:focus-visible,.ab-field input:focus-visible{outline:2px solid var(--focus);outline-offset:3px}
.ab-btn--sec{background:var(--sheet);color:var(--ink);border:1.5px solid var(--line-ctl)}
.ab-btn--sm{height:var(--ctl-sm);font-size:14px;padding-inline:14px}
.ab-btn--lg{height:var(--ctl-lg);font-size:17px;padding-inline:24px}
.ab-btn[disabled]{opacity:.45;cursor:not-allowed}
.ab-link{color:var(--terra);font-weight:700;text-decoration:none}
.ab-chip{font-family:var(--font-sans);font-size:13px;height:30px;padding-inline:12px;border-radius:var(--radius-pill);border:1px solid var(--line-ctl);background:var(--sheet);color:var(--ink-2);display:inline-flex;align-items:center;cursor:pointer}
.ab-chip[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--paper);font-weight:700}
.ab-badge{font-family:var(--font-sans);font-size:12px;font-weight:700;border-radius:var(--radius-pill);padding:1px 10px;display:inline-flex;align-items:center;gap:4px}
.ab-badge--ok{background:var(--ok-wash);color:var(--ok)}
.ab-badge--warn{background:var(--warn-wash);color:var(--warn)}
.ab-badge--stop{background:var(--stop-wash);color:var(--stop)}
.ab-badge--bayti{background:var(--room-bayti-wash);color:var(--room-bayti)}
.ab-badge--maktabi{background:var(--room-maktabi-wash);color:var(--room-maktabi)}
.ab-badge--mashrooi{background:var(--room-mashrooi-wash);color:var(--room-mashrooi)}
.ab-field{display:flex;flex-direction:column;gap:6px;font-family:var(--font-sans)}
.ab-field label{font-size:14px;font-weight:700;color:var(--ink)}
.ab-field input{font-family:var(--font-sans);font-size:15px;height:var(--ctl-md);border:1.5px solid var(--line-ctl);border-radius:var(--radius-ctl);padding-inline:14px;background:var(--sheet);color:var(--ink)}
.ab-field input:focus{border-color:var(--ink);box-shadow:0 0 0 3px var(--terra-wash);outline:none}
.ab-field .ab-hint{font-size:12px;color:var(--ink-3)}
.ab-field--err input{border-color:var(--stop)}
.ab-field--err .ab-hint{color:var(--stop)}
.ab-card{background:var(--sheet);border:1px solid var(--line);border-radius:var(--radius-card);padding:var(--space-5);display:flex;flex-direction:column;gap:10px;box-shadow:var(--shadow-card);font-family:var(--font-sans)}
.ab-card__top{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--ink-3)}
.ab-card h3{margin:0;font-size:20px;line-height:1.35}
.ab-card p{margin:0;font-size:15px;color:var(--ink-2);line-height:1.7}
.ab-tile{width:48px;height:48px;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;flex:none}
.ab-tile svg{width:26px;height:26px}
.ab-tile--bayti{background:var(--room-bayti-wash)} .ab-tile--bayti .arch{fill:var(--room-bayti)}
.ab-tile--maktabi{background:var(--room-maktabi-wash)} .ab-tile--maktabi .arch{fill:var(--room-maktabi)}
.ab-tile--mashrooi{background:var(--room-mashrooi-wash)} .ab-tile--mashrooi .arch{fill:var(--room-mashrooi)}
.ab-tile .sill,.ab-mark .sill{fill:var(--terra)} .ab-mark .arch{fill:var(--ink)}
.ab-site{background:var(--paper);border-bottom:1px solid var(--line);font-family:var(--font-sans)}
.ab-site__row{display:flex;align-items:center;gap:22px;height:58px;padding-inline:20px}
.ab-site__logo{display:flex;align-items:center;gap:8px;font-weight:700;font-size:16px;color:var(--ink)}
.ab-site nav{display:flex;gap:18px;font-size:14px;color:var(--ink-2)}
.ab-site nav a{color:inherit;text-decoration:none}
.ab-site nav [aria-current]{color:var(--ink);font-weight:700;box-shadow:inset 0 -2px 0 var(--ink)}
.ab-site__end{margin-inline-start:auto}
.ab-site__sub{display:flex;align-items:center;gap:10px;height:36px;padding-inline:20px;font-size:13px;border-top:1px solid var(--line)}
.ab-site__sub i{width:9px;height:9px;border-radius:2px}
.ab-site__sub span{margin-inline-start:auto;color:var(--ink-2);display:flex;gap:16px}
.ab-app{display:flex;align-items:center;gap:16px;height:56px;padding-inline:16px;background:var(--sheet);border-bottom:1px solid var(--line);font-family:var(--font-sans)}
.ab-app__name{display:flex;align-items:center;gap:10px;font-weight:700;font-size:15px}
.ab-app__name .ab-tile{width:32px;height:32px;border-radius:9px}
.ab-app__name .ab-tile svg{width:18px;height:18px}
.ab-app__search{flex:1;max-width:360px;height:36px;border:1px solid var(--line);border-radius:var(--radius-ctl);display:flex;align-items:center;padding-inline:12px;color:var(--ink-3);font-size:13px;background:var(--paper)}
.ab-app__end{margin-inline-start:auto;display:flex;align-items:center;gap:10px;font-size:13px;color:var(--ink-2)}
.ab-app__ic{width:36px;height:36px;border-radius:var(--radius-ctl);border:1px solid var(--line);display:flex;align-items:center;justify-content:center}
.ab-app__me{width:32px;height:32px;border-radius:50%;background:var(--ink);color:var(--paper);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px}
.ab-paper{position:relative;background:var(--paper);overflow:hidden}
.ab-paper::before{content:"";position:absolute;inset:0;pointer-events:none;color:var(--pen)}
.ab-paper--grid::before{background-image:linear-gradient(currentColor 1px,transparent 1px),linear-gradient(90deg,currentColor 1px,transparent 1px);background-size:24px 24px;opacity:var(--paper-grid);-webkit-mask-image:radial-gradient(120% 90% at 85% 0%,#000 0%,rgba(0,0,0,.5) 35%,transparent 70%);mask-image:radial-gradient(120% 90% at 85% 0%,#000 0%,rgba(0,0,0,.5) 35%,transparent 70%)}
.ab-paper--lines::before{background-image:linear-gradient(currentColor 1px,transparent 1px);background-size:100% 34px;opacity:var(--paper-lines);-webkit-mask-image:linear-gradient(#000,transparent 85%);mask-image:linear-gradient(#000,transparent 85%)}
.ab-paper--dots::before{background-image:radial-gradient(circle,currentColor 1.2px,transparent 1.6px);background-size:22px 22px;opacity:var(--paper-dots);-webkit-mask-image:radial-gradient(closest-side,transparent 25%,#000 60%,transparent 100%);mask-image:radial-gradient(closest-side,transparent 25%,#000 60%,transparent 100%)}
.ab-paper > *{position:relative}
@media (prefers-reduced-motion:reduce){.ab *{transition:none!important;animation:none!important}}

/* ألوان المراحل في مكتبي: المرحلة تملأ، والحالة حلقة، والرقم مع اللون دائماً */
.ab-stage{width:24px;height:24px;border-radius:50%;background:var(--stg,var(--stg-1));color:var(--sheet);font:700 12px/1 var(--font-sans);display:inline-flex;align-items:center;justify-content:center;font-variant-numeric:tabular-nums}
.ab-stage--ok{box-shadow:0 0 0 2px var(--sheet),0 0 0 4px var(--ok)}.ab-stage--warn{box-shadow:0 0 0 2px var(--sheet),0 0 0 4px var(--warn)}.ab-stage--stop{box-shadow:0 0 0 2px var(--sheet),0 0 0 4px var(--stop)}

/* هوية العميل داخل مشروعي (قرار صياح 034، حزمة التصميم ٥): لونه وشعاره في مواضع محددة، والمحرك على الدستور.
   --own يضعه albait-own.js وحده بعد فحص الوضوح، ولا يُكتب في ملف صفحة. بلا لون صالح يبقى نيلي مشروعي. */
.ab-own{--own-c:var(--own,var(--room-mashrooi));--own-on:var(--own-ink,#fff);--own-bg:var(--own-wash,var(--room-mashrooi-wash))}
.ab-app.ab-own{box-shadow:inset 0 4px 0 var(--own-c);height:60px;padding-top:4px}
.ab-own__logo{width:32px;height:32px;border-radius:9px;object-fit:contain;background:var(--sheet);border:1px solid var(--line);flex:none}
.ab-own__mono{width:32px;height:32px;border-radius:9px;background:var(--own-c);color:var(--own-on);display:inline-flex;align-items:center;justify-content:center;font:700 15px/1 var(--font-sans);flex:none}
.ab-own__by{font-size:12px;color:var(--ink-3);display:inline-flex;align-items:center;gap:6px}
.ab-own__by .ab-tile{width:18px;height:18px;border-radius:5px}.ab-own__by .ab-tile svg{width:11px;height:11px}