/* ── الرموز ─────────────────────────────────────────── */
:root {
  --ink: #14233D;
  --ink-2: #1F3354;
  --ink-3: #2E4670;
  --paper: #F5F6F8;
  --surface: #FFFFFF;
  --line: #DDE1E8;
  --line-2: #C9CFDA;
  --text: #1A2230;
  --muted: #5F6878;
  --brass: #A57A2A;
  --brass-soft: #F4ECDC;
  --ok: #1F7A4D;   --ok-bg: #E4F3EA;
  --warn: #B45309; --warn-bg: #FDF1E3;
  --bad: #B42318;  --bad-bg: #FDECEA;
  --wait: #3A5A8C; --wait-bg: #E8EEF7;
  --radius: 6px;
  --font: "IBM Plex Sans Arabic", "Segoe UI", Tahoma, sans-serif;
  --font-display: "Noto Naskh Arabic", "IBM Plex Sans Arabic", serif;
  --shadow: 0 1px 2px rgba(20, 35, 61, .06), 0 4px 16px rgba(20, 35, 61, .06);
}
[lang="en"] { --font-display: "IBM Plex Serif", Georgia, serif; }

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; font-family: var(--font); font-size: 16px; line-height: 1.7;
  color: var(--text); background: var(--paper);
}
a { color: var(--ink-3); text-underline-offset: 3px; }
a:hover { color: var(--ink); }
img { max-width: 100%; }
h1, h2, h3 { line-height: 1.35; margin: 0 0 .5em; color: var(--ink); }
h1 { font-family: var(--font-display); font-weight: 700; font-size: clamp(1.9rem, 4vw, 2.9rem); }
h2 { font-family: var(--font-display); font-weight: 700; font-size: 1.55rem; }
h3 { font-size: 1.1rem; font-weight: 600; }
p { margin: 0 0 1em; }
:focus-visible { outline: 3px solid var(--brass); outline-offset: 2px; }
.container { width: min(1180px, 100% - 2rem); margin-inline: auto; }
.muted { color: var(--muted); }
.small { font-size: .875rem; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* ── الأزرار والنماذج ─────────────────────────────────── */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .4rem;
  min-height: 44px; padding: .55rem 1.2rem; border: 1px solid transparent; border-radius: var(--radius);
  font: inherit; font-weight: 600; font-size: .95rem; cursor: pointer; text-decoration: none;
  background: var(--ink); color: #fff; transition: background .15s;
}
.btn:hover { background: var(--ink-2); color: #fff; }
.btn-ghost { background: transparent; color: var(--ink); border-color: var(--line-2); }
.btn-ghost:hover { background: var(--surface); color: var(--ink); border-color: var(--ink); }
.btn-brass { background: var(--brass); }
.btn-brass:hover { background: #8C6620; }
.btn-danger { background: var(--bad); }
.btn-danger:hover { background: #8F1B12; }
.btn-sm { min-height: 36px; padding: .3rem .8rem; font-size: .85rem; }
.btn-block { width: 100%; }
.btn-link { background: none; border: 0; color: var(--ink-3); padding: 0; min-height: 0; font-weight: 500; text-decoration: underline; cursor: pointer; font: inherit; }

label { display: block; font-weight: 600; font-size: .9rem; margin-bottom: .3rem; color: var(--ink); }
.field { margin-bottom: 1.1rem; }
.hint { font-size: .82rem; color: var(--muted); margin-top: .25rem; }
input[type=text], input[type=email], input[type=password], input[type=number], input[type=tel],
input[type=date], input[type=time], input[type=datetime-local], input[type=search], select, textarea {
  width: 100%; min-height: 44px; padding: .55rem .8rem; font: inherit; font-size: .95rem; color: var(--text);
  background: #fff; border: 1px solid var(--line-2); border-radius: var(--radius);
}
textarea { min-height: 110px; resize: vertical; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--ink-3); box-shadow: 0 0 0 3px rgba(46, 70, 112, .15); }
input[type=file] { font: inherit; font-size: .9rem; max-width: 100%; }
.check { display: flex; align-items: flex-start; gap: .5rem; font-weight: 500; }
.check input { margin-top: .35rem; width: 18px; height: 18px; accent-color: var(--ink); }
.field-error { color: var(--bad); font-size: .85rem; margin: .3rem 0 0; }
.grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 1rem; }
.grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 1rem; }
@media (max-width: 720px) { .grid-2, .grid-3 { grid-template-columns: 1fr; } }

/* ── الشارات والتنبيهات ─────────────────────────────── */
.badge { display: inline-block; padding: .1rem .6rem; border-radius: 99px; font-size: .78rem; font-weight: 600; white-space: nowrap; }
.badge-ok { background: var(--ok-bg); color: var(--ok); }
.badge-warn { background: var(--warn-bg); color: var(--warn); }
.badge-bad { background: var(--bad-bg); color: var(--bad); }
.badge-wait { background: var(--wait-bg); color: var(--wait); }
.badge-neutral { background: #EEF0F4; color: var(--muted); }
.alert { padding: .8rem 1rem; border-radius: var(--radius); margin-bottom: 1rem; border-inline-start: 4px solid; }
.alert-success { background: var(--ok-bg); border-color: var(--ok); color: #14532D; }
.alert-error { background: var(--bad-bg); border-color: var(--bad); color: #7A1A12; }
.alert-info { background: var(--wait-bg); border-color: var(--wait); color: var(--ink); }

/* ختم التوثيق — العنصر المميز للهوية */
.seal {
  display: inline-flex; align-items: center; gap: .35rem; padding: .15rem .6rem .15rem .7rem;
  border: 1.5px solid var(--brass); border-radius: 99px; color: var(--brass);
  font-size: .78rem; font-weight: 700; background: var(--brass-soft);
}
.seal svg { width: 14px; height: 14px; }

/* ── الترويسة العامة ─────────────────────────────────── */
.site-header { background: var(--surface); border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 20; }
.site-header .container { display: flex; align-items: center; gap: 1.5rem; min-height: 68px; }
.brand { display: flex; align-items: center; gap: .6rem; font-family: var(--font-display); font-weight: 700; font-size: 1.25rem; color: var(--ink); text-decoration: none; }
.brand-mark { width: 34px; height: 34px; border-radius: 50%; background: var(--ink); display: grid; place-items: center; }
.brand-mark svg { width: 18px; height: 18px; }
.nav { display: flex; gap: 1.25rem; margin-inline-start: auto; align-items: center; }
.nav a { color: var(--text); text-decoration: none; font-weight: 500; }
.nav a:hover { color: var(--ink-3); }
.nav-toggle { display: none; margin-inline-start: auto; background: none; border: 1px solid var(--line-2); border-radius: var(--radius); width: 44px; height: 44px; cursor: pointer; }
@media (max-width: 860px) {
  .nav-toggle { display: grid; place-items: center; }
  .nav { display: none; position: absolute; inset-inline: 0; top: 68px; background: var(--surface); flex-direction: column; align-items: stretch; padding: 1rem; border-bottom: 1px solid var(--line); gap: .5rem; }
  .nav.open { display: flex; }
  .nav .btn { width: 100%; }
}

/* ── الواجهة الرئيسية ─────────────────────────────────── */
.hero {
  background:
    repeating-linear-gradient(0deg, transparent 0 31px, rgba(255,255,255,.045) 31px 32px),
    linear-gradient(160deg, var(--ink) 0%, #0F1B30 100%);
  color: #fff; padding: 4.5rem 0 5rem;
}
.hero .container { display: grid; grid-template-columns: 1.1fr 1fr; gap: 3rem; align-items: center; }
.hero h1 { color: #fff; margin-bottom: 1rem; }
.hero p.lead { color: #C9D3E4; font-size: 1.1rem; max-width: 46ch; }
.hero-stats { display: flex; gap: 2.2rem; margin-top: 2rem; }
.hero-stats strong { display: block; font-family: var(--font-display); font-size: 1.8rem; color: #fff; line-height: 1.1; }
.hero-stats span { color: #9FB0CB; font-size: .9rem; }
.search-panel { background: var(--surface); color: var(--text); border-radius: 10px; padding: 1.75rem; box-shadow: 0 20px 50px rgba(0,0,0,.25); border-top: 4px solid var(--brass); }
.search-panel h2 { font-size: 1.25rem; margin-bottom: 1.1rem; }
@media (max-width: 900px) { .hero .container { grid-template-columns: 1fr; gap: 2rem; } .hero { padding: 3rem 0; } }

.section { padding: 4rem 0; }
.section-head { display: flex; justify-content: space-between; align-items: end; gap: 1rem; margin-bottom: 1.75rem; flex-wrap: wrap; }
.section-head p { margin: 0; color: var(--muted); }

.areas { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: .75rem; }
.area-link { display: flex; justify-content: space-between; align-items: center; padding: 1rem 1.1rem; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); text-decoration: none; color: var(--ink); font-weight: 600; }
.area-link:hover { border-color: var(--ink-3); color: var(--ink); }
.area-link svg { width: 16px; height: 16px; color: var(--muted); }
[dir="rtl"] .area-link svg { transform: scaleX(-1); }

.steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; counter-reset: step; }
.step { position: relative; padding-top: 3rem; }
.step::before {
  counter-increment: step; content: counter(step); position: absolute; top: 0; inset-inline-start: 0;
  width: 2.2rem; height: 2.2rem; border-radius: 50%; border: 1.5px solid var(--brass); color: var(--brass);
  display: grid; place-items: center; font-weight: 700;
}
@media (max-width: 860px) { .steps { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .steps { grid-template-columns: 1fr; } }

/* ── دليل المحامين: قائمة بنمط سجل القضايا ─────────────── */
.docket { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); }
.docket-row { display: grid; grid-template-columns: 56px 1fr auto; gap: 1.1rem; padding: 1.25rem 1.4rem; border-bottom: 1px solid var(--line); align-items: center; }
.docket-row:last-child { border-bottom: 0; }
.docket-row:hover { background: #FAFBFC; }
.avatar { width: 56px; height: 56px; border-radius: 50%; background: var(--ink); color: #fff; display: grid; place-items: center; font-family: var(--font-display); font-size: 1.35rem; font-weight: 700; }
.avatar-lg { width: 96px; height: 96px; font-size: 2.2rem; }
.docket-name { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; margin-bottom: .15rem; }
.docket-name a { font-weight: 700; font-size: 1.08rem; color: var(--ink); text-decoration: none; }
.docket-name a:hover { text-decoration: underline; }
.docket-meta { color: var(--muted); font-size: .9rem; display: flex; flex-wrap: wrap; gap: .25rem 1rem; }
.docket-side { text-align: end; }
.price { font-weight: 700; color: var(--ink); }
.price small { font-weight: 400; color: var(--muted); display: block; font-size: .8rem; }
.stars { color: var(--brass); letter-spacing: 1px; }
@media (max-width: 640px) {
  .docket-row { grid-template-columns: 48px 1fr; }
  .docket-side { grid-column: 1 / -1; text-align: start; display: flex; justify-content: space-between; align-items: center; }
  .avatar { width: 48px; height: 48px; font-size: 1.1rem; }
}

.layout-filter { display: grid; grid-template-columns: 270px 1fr; gap: 1.75rem; align-items: start; }
.filter-box { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.25rem; position: sticky; top: 88px; }
@media (max-width: 900px) { .layout-filter { grid-template-columns: 1fr; } .filter-box { position: static; } }

/* ── ملف المحامي ─────────────────────────────────────── */
.profile-head { background: var(--surface); border-bottom: 1px solid var(--line); padding: 2.5rem 0; }
.profile-head .container { display: flex; gap: 1.5rem; align-items: center; flex-wrap: wrap; }
.profile-grid { display: grid; grid-template-columns: 1fr 340px; gap: 2rem; align-items: start; padding: 2.5rem 0; }
@media (max-width: 900px) { .profile-grid { grid-template-columns: 1fr; } }
.panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.5rem; margin-bottom: 1.5rem; }
.panel > h2, .panel > h3 { margin-bottom: 1rem; }
.panel-head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.panel-head h2, .panel-head h3 { margin: 0; }
.chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.chip { padding: .2rem .7rem; border: 1px solid var(--line-2); border-radius: 99px; font-size: .85rem; background: var(--paper); }
.service-line { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .85rem 0; border-bottom: 1px dashed var(--line); }
.service-line:last-child { border-bottom: 0; }

/* ── الحجز ─────────────────────────────────────────── */
.days { display: flex; gap: .5rem; overflow-x: auto; padding-bottom: .5rem; margin-bottom: 1rem; }
.day-tab { flex: 0 0 auto; padding: .5rem .9rem; border: 1px solid var(--line-2); border-radius: var(--radius); background: #fff; cursor: pointer; text-align: center; font: inherit; line-height: 1.3; min-width: 84px; }
.day-tab small { display: block; color: var(--muted); font-size: .78rem; }
.day-tab[aria-selected="true"] { background: var(--ink); color: #fff; border-color: var(--ink); }
.day-tab[aria-selected="true"] small { color: #C9D3E4; }
.times { display: grid; grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: .5rem; }
.time-opt input { position: absolute; opacity: 0; }
.time-opt span { display: block; text-align: center; padding: .55rem; border: 1px solid var(--line-2); border-radius: var(--radius); cursor: pointer; background: #fff; font-weight: 600; }
.time-opt input:checked + span { background: var(--brass); border-color: var(--brass); color: #fff; }
.time-opt input:focus-visible + span { outline: 3px solid var(--brass); outline-offset: 2px; }
.summary-row { display: flex; justify-content: space-between; padding: .45rem 0; }
.summary-row.total { border-top: 1px solid var(--line); margin-top: .5rem; padding-top: .8rem; font-weight: 700; }

/* ── المصادقة ─────────────────────────────────────── */
.auth-wrap { min-height: calc(100vh - 68px); display: grid; place-items: center; padding: 3rem 1rem; }
.auth-card { width: min(480px, 100%); background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: 2rem; box-shadow: var(--shadow); border-top: 4px solid var(--ink); }
.auth-card.wide { width: min(720px, 100%); }
.auth-card h1 { font-size: 1.7rem; }

/* ── التذييل ─────────────────────────────────────── */
.site-footer { background: var(--ink); color: #9FB0CB; padding: 2.5rem 0; margin-top: 4rem; font-size: .9rem; }
.site-footer .container { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.site-footer a { color: #C9D3E4; }
.disclaimer { max-width: 60ch; }

/* ── لوحات التحكم ───────────────────────────────────── */
.dash { display: grid; grid-template-columns: 250px 1fr; min-height: 100vh; }
.sidebar { background: var(--ink); color: #C9D3E4; padding: 1.25rem 0; position: sticky; top: 0; height: 100vh; overflow-y: auto; }
.sidebar .brand { color: #fff; padding: 0 1.25rem 1.25rem; border-bottom: 1px solid rgba(255,255,255,.08); margin-bottom: .75rem; font-size: 1.1rem; }
.sidebar .brand-mark { background: var(--brass); }
.side-group { padding: .5rem 1.25rem .25rem; font-size: .75rem; color: #7E90AE; font-weight: 600; }
.side-link { display: flex; align-items: center; gap: .65rem; padding: .6rem 1.25rem; color: #C9D3E4; text-decoration: none; font-size: .93rem; border-inline-start: 3px solid transparent; }
.side-link svg { width: 18px; height: 18px; opacity: .8; flex: 0 0 auto; }
.side-link:hover { background: rgba(255,255,255,.05); color: #fff; }
.side-link.active { background: rgba(255,255,255,.08); color: #fff; border-inline-start-color: var(--brass); }
.side-count { margin-inline-start: auto; background: var(--brass); color: #fff; border-radius: 99px; font-size: .72rem; padding: 0 .45rem; font-weight: 700; }
.main { min-width: 0; }
.topbar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .75rem 1.75rem; background: var(--surface); border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 10; }
.topbar-actions { display: flex; align-items: center; gap: 1rem; }
.content { padding: 1.75rem; max-width: 1280px; }
.page-head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 1.5rem; flex-wrap: wrap; }
.page-head h1 { font-size: 1.65rem; margin: 0; }
.menu-btn { display: none; }
@media (max-width: 960px) {
  .dash { grid-template-columns: 1fr; }
  .sidebar { position: fixed; inset-block: 0; inset-inline-start: 0; width: 270px; z-index: 50; transform: translateX(100%); transition: transform .2s; }
  [dir="ltr"] .sidebar { transform: translateX(-100%); }
  .sidebar.open { transform: none !important; }
  .menu-btn { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--line-2); border-radius: var(--radius); background: #fff; cursor: pointer; }
  .content { padding: 1.1rem; }
  .topbar { padding: .6rem 1rem; }
}

.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 1rem; margin-bottom: 1.5rem; }
.stat { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.1rem 1.25rem; text-decoration: none; color: inherit; display: block; }
.stat strong { display: block; font-size: 1.75rem; font-weight: 700; color: var(--ink); line-height: 1.2; font-variant-numeric: tabular-nums; }
.stat span { color: var(--muted); font-size: .88rem; }
a.stat:hover { border-color: var(--ink-3); }
.stat.alerting { border-inline-start: 4px solid var(--brass); }

.table-wrap { overflow-x: auto; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); }
table { width: 100%; border-collapse: collapse; font-size: .92rem; }
th, td { padding: .75rem 1rem; text-align: start; border-bottom: 1px solid var(--line); vertical-align: middle; }
th { background: #F8F9FB; font-weight: 600; color: var(--muted); font-size: .82rem; white-space: nowrap; }
tr:last-child td { border-bottom: 0; }
td .actions { display: flex; gap: .4rem; flex-wrap: wrap; }
.empty { text-align: center; padding: 2.5rem 1rem; color: var(--muted); }
.empty .btn { margin-top: .75rem; }

.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.side-col { display: grid; grid-template-columns: 1fr 360px; gap: 1.5rem; align-items: start; }
@media (max-width: 1100px) { .two-col, .side-col { grid-template-columns: 1fr; } }

.list-plain { list-style: none; margin: 0; padding: 0; }
.list-plain li { padding: .7rem 0; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; gap: 1rem; align-items: center; }
.list-plain li:last-child { border-bottom: 0; }

.checklist li { justify-content: flex-start !important; gap: .6rem !important; }
.tick { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; font-size: .8rem; flex: 0 0 auto; }
.tick.on { background: var(--ok); color: #fff; }
.tick.off { border: 1.5px solid var(--line-2); }

/* خط زمني للقضية */
.timeline { list-style: none; margin: 0; padding: 0; position: relative; }
.timeline::before { content: ""; position: absolute; top: 6px; bottom: 6px; inset-inline-start: 7px; width: 2px; background: var(--line); }
.timeline li { position: relative; padding-inline-start: 2rem; padding-bottom: 1.25rem; }
.timeline li::before { content: ""; position: absolute; inset-inline-start: 1px; top: 6px; width: 14px; height: 14px; border-radius: 50%; background: #fff; border: 3px solid var(--ink-3); }
.timeline li.internal::before { border-color: var(--line-2); }
.timeline time { font-size: .82rem; color: var(--muted); }
.timeline strong { display: block; }

.kv { display: grid; grid-template-columns: max-content 1fr; gap: .5rem 1.25rem; margin: 0; }
.kv dt { color: var(--muted); font-size: .9rem; }
.kv dd { margin: 0; font-weight: 500; }

details.inline-form { margin-top: .5rem; }
details.inline-form summary { cursor: pointer; color: var(--ink-3); font-weight: 600; font-size: .9rem; }
details.inline-form[open] summary { margin-bottom: .75rem; }

.tabs { display: flex; gap: .25rem; border-bottom: 1px solid var(--line); margin-bottom: 1.25rem; flex-wrap: wrap; }
.tabs a { padding: .6rem 1rem; text-decoration: none; color: var(--muted); border-bottom: 2px solid transparent; margin-bottom: -1px; font-weight: 500; }
.tabs a.active { color: var(--ink); border-bottom-color: var(--brass); font-weight: 600; }

.pagination { display: flex; gap: .35rem; justify-content: center; margin-top: 1.25rem; flex-wrap: wrap; }
.pagination a, .pagination span { min-width: 38px; height: 38px; display: grid; place-items: center; padding: 0 .6rem; border: 1px solid var(--line-2); border-radius: var(--radius); text-decoration: none; background: #fff; }
.pagination .current { background: var(--ink); color: #fff; border-color: var(--ink); }

.bars { display: flex; align-items: end; gap: .75rem; height: 150px; padding-top: 1rem; }
.bar { flex: 1; background: var(--ink-3); border-radius: 4px 4px 0 0; position: relative; min-height: 4px; }
.bar span { position: absolute; top: -1.4rem; inset-inline: 0; text-align: center; font-size: .8rem; font-weight: 600; }
.bar-labels { display: flex; gap: .75rem; }
.bar-labels span { flex: 1; text-align: center; font-size: .78rem; color: var(--muted); }

.notice-box { background: var(--brass-soft); border: 1px solid #E5D3AE; border-radius: var(--radius); padding: 1rem 1.2rem; white-space: pre-line; }
.error-page { text-align: center; padding: 6rem 1rem; }
.error-page .code { font-family: var(--font-display); font-size: 4rem; color: var(--line-2); line-height: 1; }

@media (prefers-reduced-motion: reduce) { * { transition: none !important; scroll-behavior: auto !important; } }

/* ── تصحيحات بعد المراجعة البصرية ── */
.nav a.btn, .nav a.btn:hover { color: #fff; }
.badge { align-self: center; line-height: 1.6; }
.bar { max-width: 72px; margin-inline: auto; }
.bar-labels span { max-width: 72px; margin-inline: auto; }
.filter-toggle { display: none; cursor: pointer; font-weight: 600; color: var(--ink); list-style: none; }
.filter-toggle::-webkit-details-marker { display: none; }
@media (max-width: 900px) {
  .filter-toggle { display: flex; justify-content: space-between; align-items: center; }
  details.filter-box[open] .filter-toggle { margin-bottom: 1rem; }
}

/* ── القطاعات والخدمات ── */
.sector-tabs { display: flex; gap: .25rem; border-bottom: 1px solid var(--line); overflow-x: auto; margin-top: 1.25rem; scrollbar-width: thin; }
.sector-tab { flex: 0 0 auto; display: flex; flex-direction: column; align-items: center; gap: .45rem; padding: .75rem 1.1rem .8rem; color: var(--muted); text-decoration: none; font-weight: 600; font-size: .93rem; border-bottom: 3px solid transparent; margin-bottom: -1px; }
.sector-tab svg { width: 30px; height: 30px; color: var(--ink); opacity: .75; }
.sector-tab:hover { color: var(--ink); }
.sector-tab.active { color: var(--ink); border-bottom-color: var(--ink); }
.sector-tab.active svg { opacity: 1; color: var(--brass); }
.sector-body { padding-top: 1.75rem; }
.sector-body > h2 { margin-bottom: .35rem; }
.svc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 1rem; margin-top: 1.25rem; }
.svc-card { display: grid; grid-template-columns: 56px 1fr 18px; gap: 1rem; align-items: center; padding: 1.25rem; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; text-decoration: none; color: var(--text); transition: border-color .15s; }
.svc-card:hover { border-color: var(--ink-3); color: var(--text); }
.svc-card:first-child .svc-icon { background: var(--ink); color: #fff; }
.svc-icon { width: 56px; height: 56px; border-radius: 50%; background: var(--paper); color: var(--ink); display: grid; place-items: center; }
.svc-icon svg { width: 26px; height: 26px; }
.svc-text strong { display: block; font-size: 1.05rem; color: var(--ink); margin-bottom: .2rem; }
.svc-text span { display: block; font-size: .88rem; color: var(--muted); line-height: 1.6; }
.svc-go svg { width: 18px; height: 18px; color: var(--muted); }
[dir="rtl"] .svc-go svg { transform: scaleX(-1); }

/* ── رحلة الحجز ── */
.wizard { max-width: 880px; padding: 2.25rem 0 3rem; }
.wizard-head { margin-bottom: 1.75rem; }
.wizard-title { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.wizard-title h1 { font-size: 1.6rem; margin: 0; }
.wizard-close { font-size: 1.25rem; color: var(--ink); text-decoration: none; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; }
.wizard-close:hover { background: var(--line); }
.crumbs { color: var(--muted); margin-top: .25rem; }
.crumbs a { text-decoration: none; }
.wizard-bar { height: 5px; background: var(--line); border-radius: 9px; overflow: hidden; }
.wizard-bar span { display: block; height: 100%; background: var(--ink); border-radius: 9px; }
.wizard-actions { position: sticky; bottom: 0; background: linear-gradient(to top, var(--paper) 70%, transparent); padding: 1rem 0; display: flex; justify-content: flex-end; }
.spec-list { display: grid; gap: .75rem; margin-top: 1rem; }
.spec-card { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; transition: border-color .15s; }
.spec-card:hover { border-color: var(--line-2); }
.spec-card.selected, .spec-card:has(> .spec-head input:checked) { border-color: var(--ink); box-shadow: 0 0 0 1px var(--ink); }
.spec-head { display: grid; grid-template-columns: 22px 1fr 40px; gap: 1rem; align-items: center; padding: 1.1rem 1.25rem; cursor: pointer; margin: 0; font-weight: 400; }
.spec-head input { width: 20px; height: 20px; accent-color: var(--ink); margin: 0; }
.spec-text strong { display: block; color: var(--ink); font-size: 1.02rem; }
.spec-text span { display: block; color: var(--muted); font-size: .88rem; line-height: 1.6; margin-top: .15rem; }
.spec-check { width: 40px; height: 40px; border-radius: 10px; background: var(--paper); display: grid; place-items: center; color: var(--line-2); }
.spec-check svg { width: 22px; height: 22px; }
.spec-card.selected .spec-check, .spec-card:has(> .spec-head input:checked) .spec-check { color: #fff; background: var(--ink); }
.subs { display: none; border-top: 1px dashed var(--line); margin: 0 1.25rem; padding: 1rem 0 1.25rem; }
.spec-card.selected .subs, .spec-card:has(> .spec-head input:checked) .subs { display: block; }
.subs-title { font-weight: 700; color: var(--ink); margin: 0 0 .6rem; }
.chips-select { display: flex; flex-wrap: wrap; gap: .5rem; }
.chip-opt { margin: 0; font-weight: 500; display: inline-block; position: relative; }
.chip-opt span { white-space: nowrap; }
.chip-opt input { position: absolute; opacity: 0; pointer-events: none; }
.chip-opt span { display: inline-flex; align-items: center; min-height: 38px; padding: .3rem .95rem; border: 1px solid var(--line-2); border-radius: 99px; background: var(--paper); font-size: .88rem; cursor: pointer; color: var(--text); }
.chip-opt span svg { width: 20px; height: 20px; }
.chip-opt input:checked + span { background: var(--ink); border-color: var(--ink); color: #fff; }
.chip-opt input:focus-visible + span { outline: 3px solid var(--brass); outline-offset: 2px; }
.chip-strong { background: var(--ink); color: #fff; border-color: var(--ink); }
.selection-summary { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; }
.group-row th { background: var(--paper); color: var(--ink); font-size: .9rem; }
.area-group { border-bottom: 1px solid var(--line); padding: .6rem 0; }
.area-group:last-child { border-bottom: 0; }
.area-group summary { cursor: pointer; padding: .25rem 0; }
.icon-pick { display: flex; flex-wrap: wrap; gap: .35rem; }
.icon-pick .chip-opt span { padding: .3rem .55rem; min-width: 40px; justify-content: center; }
.ref-icon svg { width: 22px; height: 22px; color: var(--ink); }
@media (max-width: 640px) {
  .svc-grid { grid-template-columns: 1fr; }
  .spec-head { grid-template-columns: 22px 1fr; }
  .spec-check { display: none; }
  .subs { margin: 0 1rem; }
}

/* ── الشعار والصور ── */
/* الشعار يحل محل الأيقونة ويبقى اسم المنصة بجواره */
/* مساحة الشعار: 330×70 بكسل */
.brand-logo { height: 70px; max-height: 70px; width: auto; max-width: 330px; display: block; object-fit: contain; flex: 0 0 auto; }
.brand-logo-chip { background: #fff; border-radius: 8px; padding: 4px 6px; display: inline-flex; flex: 0 0 auto; }
.sidebar .brand-logo { height: 46px; max-width: 200px; }
@media (max-width: 1024px) { .brand-logo { height: 56px; max-width: 240px; } }
@media (max-width: 520px) { .site-header .brand-logo { height: 42px; max-width: 170px; } .site-header .brand { font-size: 1.05rem; } }
img.avatar { object-fit: cover; background: var(--paper); }
.photo-field { display: flex; gap: 1.25rem; align-items: center; margin-bottom: 1.5rem; padding-bottom: 1.25rem; border-bottom: 1px solid var(--line); flex-wrap: wrap; }

/* ── الفوتر ── */
.site-footer { background: #EEF0F2; color: var(--text); padding: 3.5rem 0 2rem; }
.site-footer .container { display: block; }
.footer-cols { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 2rem; }
.footer-cols h3 { font-family: var(--font-display); font-size: 1.3rem; color: var(--ink); margin-bottom: 1rem; }
.footer-cols a { display: block; color: var(--muted); text-decoration: none; margin-bottom: .55rem; }
.footer-cols a:hover { color: var(--ink); }
.footer-about p { color: var(--muted); max-width: 42ch; }
.socials { display: flex; gap: .6rem; justify-content: center; flex-wrap: wrap; margin: 2.25rem 0 1.75rem; }
.socials a { width: 46px; height: 46px; border-radius: 12px; background: var(--ink); color: #fff; display: grid; place-items: center; }
.socials a:hover { background: var(--ink-3); }
.socials svg { width: 22px; height: 22px; }
.footer-bottom { border-top: 1px solid var(--line-2); padding-top: 1.25rem; display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; font-size: .9rem; color: var(--muted); }
.footer-legal { display: flex; gap: .6rem; align-items: center; }
.footer-legal a, .footer-copy a { color: var(--muted); text-decoration: underline; }
.footer-copy { display: flex; gap: 1rem; flex-wrap: wrap; }
.site-footer .disclaimer { color: var(--muted); margin: 1rem 0 0; max-width: none; }
.wa-float { position: fixed; bottom: 1.5rem; inset-inline-end: 1.5rem; width: 58px; height: 58px; border-radius: 50%; background: #25D366; color: #fff; display: grid; place-items: center; box-shadow: 0 6px 20px rgba(0,0,0,.2); z-index: 40; }
.wa-float svg { width: 30px; height: 30px; }
@media (max-width: 860px) { .footer-cols { grid-template-columns: 1fr 1fr; } .footer-about { grid-column: 1 / -1; } }
@media (max-width: 520px) { .footer-cols { grid-template-columns: 1fr; } .footer-bottom { flex-direction: column; } }

/* ── الجدول الأسبوعي ── */
.week-table th[scope="row"] { color: var(--ink); background: transparent; font-size: .95rem; white-space: nowrap; }
.week-table td { vertical-align: middle; }
.week-table .period { white-space: nowrap; }
.week-table .period input { width: auto; min-width: 104px; display: inline-block; }
.week-row[data-status="BUSY"] .period, .week-row[data-status="OFF"] .period { opacity: .45; }
.week-row.has-error th, .week-row.has-error td { background: var(--bad-bg); }
.status-pick { display: flex; gap: .35rem; flex-wrap: wrap; }
.status-pick .chip-opt span { min-height: 34px; padding: .2rem .8rem; }
.status-pick .st-available input:checked + span { background: var(--ok); border-color: var(--ok); }
.status-pick .st-busy input:checked + span { background: var(--warn); border-color: var(--warn); }
.status-pick .st-off input:checked + span { background: var(--muted); border-color: var(--muted); }
.week-list li span[dir="ltr"] { font-variant-numeric: tabular-nums; }
.day-tab.day-off { background: #F3F4F6; color: var(--muted); cursor: not-allowed; border-style: dashed; }
.day-tab em { display: block; font-style: normal; font-size: .7rem; color: var(--bad); margin-top: .1rem; }

/* ── الإعدادات ── */
.switch { display: flex; align-items: center; gap: .75rem; cursor: pointer; font-weight: 600; }
.switch input { position: absolute; opacity: 0; }
.switch-ui { width: 46px; height: 26px; border-radius: 99px; background: var(--line-2); position: relative; flex: 0 0 auto; transition: background .15s; }
.switch-ui::after { content: ""; position: absolute; top: 3px; inset-inline-start: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; transition: inset-inline-start .15s; }
.switch input:checked + .switch-ui { background: var(--ok); }
.switch input:checked + .switch-ui::after { inset-inline-start: 23px; }
.switch input:focus-visible + .switch-ui { outline: 3px solid var(--brass); outline-offset: 2px; }
.logo-preview { display: flex; align-items: center; gap: 1rem; padding: .75rem; background: var(--paper); border-radius: var(--radius); margin-bottom: .5rem; }
.logo-preview img { max-height: 48px; max-width: 220px; }
.maint-flag { display: block; margin: 0 1.25rem .75rem; padding: .4rem .7rem; background: var(--warn); color: #fff; border-radius: var(--radius); font-size: .82rem; text-decoration: none; text-align: center; }
.prose p { margin: 0 0 1.1em; }

/* ── صفحة الصيانة ── */
body.maintenance { min-height: 100vh; display: grid; place-items: center; background: var(--ink); padding: 1.5rem; }
.maintenance-box { background: var(--surface); border-radius: 14px; padding: 2.5rem 2rem; max-width: 520px; text-align: center; border-top: 5px solid var(--brass); }
.maintenance-box .brand-mark { display: grid; }
.maintenance-logo { max-height: 60px; max-width: 240px; margin: 0 auto 1.25rem; display: block; }

/* أعمدة الشبكة لا تتمدد بسبب محتوى عريض (شريط الأيام، الجداول) */
.profile-grid > *, .side-col > *, .two-col > *, .layout-filter > *, .main { min-width: 0; }
.days { scroll-snap-type: x proximity; }
.day-tab { scroll-snap-align: start; }

/* ── نوع الطلب ووسيلة التواصل ── */
.opt-title { display: block; font-weight: 600; margin-bottom: .5rem; color: var(--ink); }
.opt-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem; }
.opt-card { margin: 0; font-weight: 400; }
.opt-card input { position: absolute; opacity: 0; }
.opt-card > span { display: flex; flex-direction: column; gap: .2rem; height: 100%; padding: .85rem; border: 1.5px solid var(--line-2); border-radius: 10px; cursor: pointer; background: #fff; }
.opt-card svg { width: 22px; height: 22px; color: var(--ink-3); margin-bottom: .2rem; }
.opt-card strong { color: var(--ink); font-size: .95rem; }
.opt-card small { color: var(--muted); font-size: .8rem; line-height: 1.5; }
.opt-card input:checked + span { border-color: var(--ink); box-shadow: 0 0 0 1px var(--ink); background: #F7F9FC; }
.opt-card input:checked + span svg { color: var(--brass); }
.opt-card input:focus-visible + span { outline: 3px solid var(--brass); outline-offset: 2px; }
@media (max-width: 640px) { .opt-cards { grid-template-columns: 1fr; } }

/* ── غرفة الجلسة ── */
.room-banner { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1rem 1.25rem; margin-bottom: 1.25rem; background: var(--ink); color: #fff; border-radius: 10px; text-decoration: none; }
.room-banner:hover { background: var(--ink-2); color: #fff; }
.room-banner svg { width: 20px; height: 20px; vertical-align: -4px; }
.room-banner small { color: #C9D3E4; margin-inline-start: .5rem; }
.call-panel h2 svg { width: 20px; height: 20px; vertical-align: -3px; }
.call-frame { margin-top: 1rem; border-radius: 10px; overflow: hidden; background: #0F1B30; aspect-ratio: 16 / 10; }
.call-frame iframe { width: 100%; height: 100%; border: 0; display: block; }
.chat-log { max-height: 60vh; min-height: 220px; overflow-y: auto; display: flex; flex-direction: column; gap: .75rem; padding: .5rem .25rem 1rem; border-bottom: 1px solid var(--line); }
.msg { max-width: 82%; align-self: flex-start; background: var(--paper); border: 1px solid var(--line); border-radius: 12px; padding: .6rem .85rem; }
.msg.mine { align-self: flex-end; background: #EAF0F8; border-color: #D3DDEB; }
.msg-meta { font-size: .78rem; color: var(--muted); margin-bottom: .2rem; }
.msg-meta strong { color: var(--ink); }
.msg-body { white-space: pre-wrap; word-break: break-word; }
.msg-file { display: flex; align-items: center; gap: .45rem; margin-top: .45rem; padding: .45rem .6rem; background: #fff; border: 1px solid var(--line); border-radius: 8px; text-decoration: none; color: var(--ink); font-size: .88rem; }
.msg-file svg { width: 18px; height: 18px; flex: 0 0 auto; }
.msg-file span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.msg-file small { color: var(--muted); margin-inline-start: auto; }
.chat-form { margin-top: 1rem; }
.chat-form textarea { min-height: 90px; }
.chat-actions { display: flex; align-items: center; gap: .75rem; margin-top: .5rem; flex-wrap: wrap; }
.chat-actions .btn:last-child { margin-inline-start: auto; }
.attach { position: relative; overflow: hidden; }
.attach svg { width: 16px; height: 16px; }
.attach input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.chat-empty { text-align: center; margin: auto; }
.room aside p svg { width: 16px; height: 16px; vertical-align: -3px; }

/* ── عدّاد الاتصال ── */
.call-countdown { display: flex; align-items: baseline; gap: .6rem; flex-wrap: wrap; padding: .9rem 1rem; background: var(--paper); border-radius: 10px; }
.call-countdown .countdown { font-size: 1.6rem; color: var(--ink); font-variant-numeric: tabular-nums; }
.call-countdown small { flex-basis: 100%; }

/* ── الرسائل الصوتية ── */
.rec-state { display: inline-flex; align-items: center; gap: .45rem; color: var(--bad); }
.rec-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--bad); animation: recblink 1s infinite; }
@keyframes recblink { 50% { opacity: .25; } }
@media (prefers-reduced-motion: reduce) { .rec-dot { animation: none; } }
#rec-btn svg { width: 16px; height: 16px; }
.voice-preview { display: flex; align-items: center; gap: .75rem; margin-top: .6rem; padding: .5rem .75rem; background: var(--paper); border-radius: 10px; }
.voice-preview audio, .msg-voice audio { height: 38px; max-width: 100%; }
.msg-voice { display: flex; align-items: center; gap: .45rem; margin-top: .45rem; }
.msg-voice svg { width: 18px; height: 18px; color: var(--brass); flex: 0 0 auto; }

/* ── الأرشيف ── */
.folder-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: .9rem; }
.folder { display: flex; flex-direction: column; gap: .3rem; padding: 1.1rem; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; text-decoration: none; color: var(--ink); }
.folder:hover { border-color: var(--brass); }
.folder svg { width: 30px; height: 30px; color: var(--brass); }
.folder small { color: var(--muted); }
.archive-session summary { cursor: pointer; display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.archive-log { max-height: none; margin-top: 1rem; border-bottom: 0; }
.hash { font-family: ui-monospace, monospace; font-size: .7rem; color: var(--muted); margin-top: .3rem; }

/* ── اختيار طريقة الدفع (HyperPay) ── */
a.opt-card { text-decoration: none; color: inherit; display: block; }
a.opt-card > span:hover { border-color: var(--ink); background: #F7F9FC; }
.hp-panel p svg, .panel > p.small svg { width: 16px; height: 16px; vertical-align: -3px; }
.hp-panel .wpwl-form { max-width: 100%; margin: 0; }

/* ── فحص البوابات ── */
.diag-table { width: 100%; border-collapse: collapse; }
.diag-table th, .diag-table td { padding: .55rem .6rem; border-bottom: 1px solid var(--line); text-align: start; vertical-align: top; background: none; font-size: .92rem; }
.diag-table th { width: 38%; color: var(--ink); font-weight: 600; }
.diag-icon { width: 1.6rem; font-weight: 700; }
.diag-ok .diag-icon { color: var(--ok); } .diag-fail .diag-icon { color: var(--bad); } .diag-warn .diag-icon { color: var(--muted); }
.diag-fail td:last-child { color: var(--bad); }
.diag-log { background: #0F1B30; color: #D6DEEA; padding: 1rem; border-radius: 10px; overflow-x: auto; font-size: .78rem; line-height: 1.6; white-space: pre-wrap; word-break: break-all; }

/* ── مدى أولاً ── */
.mada-first { display: flex; align-items: center; gap: .75rem; padding: .6rem .8rem; margin-bottom: 1rem; background: var(--paper); border-radius: 10px; }
.mada-logo { display: inline-flex; flex-direction: column; align-items: center; line-height: 1; padding: .35rem .6rem; border-radius: 6px; background: #fff; border: 1px solid var(--line); font-weight: 800; color: #0B5DA7; font-family: Arial, sans-serif; letter-spacing: .02em; }
.mada-logo small { font-size: .62rem; color: #84B740; font-weight: 700; margin-top: .1rem; }

/* ── حالة بوابات الدفع ── */
.gw-status { display: flex; flex-wrap: wrap; gap: .5rem; margin: -.25rem 0 1.25rem; }
.gw { display: inline-flex; gap: .4rem; align-items: center; padding: .35rem .75rem; border-radius: 99px; font-size: .85rem; border: 1px solid var(--line); background: var(--paper); color: var(--muted); }
.gw strong { color: var(--ink); }
.gw::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--muted); }
.gw-on { background: #EAF6EF; border-color: #BFE3CD; color: var(--ok); } .gw-on::before { background: var(--ok); }
.gw-incomplete { background: #FDF3E4; border-color: #F1D3A6; color: var(--warn); } .gw-incomplete::before { background: var(--warn); }

/* ── وضع الاختبار وبطاقاته ── */
.gw-live { background: #EAF6EF; border-color: #BFE3CD; color: var(--ok); } .gw-live::before { background: var(--ok); }
.gw-test { background: #FDF3E4; border-color: #F1D3A6; color: var(--warn); } .gw-test::before { background: var(--warn); }
.test-cards { background: #FDF3E4; border: 1px solid #F1D3A6; border-radius: 10px; padding: .8rem 1rem; margin-bottom: 1rem; font-size: .85rem; }
.test-cards pre, .test-cards-mini { white-space: pre-wrap; margin: .5rem 0 0; font-family: inherit; font-size: .82rem; line-height: 1.8; }

/* ── الحساب البنكي ── */
.bank-box { border: 1px solid var(--line); border-radius: 12px; padding: 1.1rem 1.25rem; margin: 1.5rem 0; }
.bank-box legend { font-weight: 700; color: var(--ink); padding: 0 .4rem; }

/* ── الدساتير والأنظمة ── */
.hero-slim { padding: 2.5rem 0 1.5rem; background: var(--paper); }
.laws-search { display: flex; gap: .6rem; flex-wrap: wrap; margin-top: 1rem; }
.laws-search input[type="search"] { flex: 1 1 260px; }
.laws-search select { flex: 0 1 220px; }
.law-list li { display: block; padding: 1rem 0; border-bottom: 1px solid var(--line); }
.law-body { white-space: normal; line-height: 2.1; }
.ai-box textarea { min-height: 110px; }
.ai-box h2 svg { width: 18px; height: 18px; vertical-align: -3px; }
.ai-flag { background: #FDF3E4; border: 1px solid #F1D3A6; color: #8A5A12; border-radius: 10px; padding: .6rem .8rem; font-size: .85rem; margin-bottom: .75rem; }
.ai-text { white-space: pre-wrap; line-height: 2; margin-top: 1rem; border-top: 1px solid var(--line); padding-top: 1rem; }
.ai-sources { display: flex; flex-direction: column; gap: .3rem; margin-top: .75rem; }
.ai-sources a { color: var(--ink-3); }
#ai-form button[data-busy] { opacity: .6; }

/* ── ملفات الأنظمة ── */
.pdf-frame { border: 1px solid var(--line); border-radius: 12px; overflow: hidden; background: var(--paper); height: min(78vh, 900px); }
.pdf-frame iframe { width: 100%; height: 100%; border: 0; display: block; }
.law-list strong svg { width: 16px; height: 16px; vertical-align: -3px; color: var(--brass); }
.doc-row summary { cursor: pointer; display: flex; gap: .6rem; align-items: center; flex-wrap: wrap; }

/* ── حذف ملفات الأنظمة ── */
.bulk-bar { display: flex; align-items: center; gap: 1rem; padding: .6rem .9rem; margin-bottom: .75rem; background: var(--paper); border-radius: 10px; flex-wrap: wrap; }
.bulk-bar .check { margin: 0; }
.doc-row summary .bulk-pick { margin: 0; }
.doc-row summary .row-actions { margin-inline-start: auto; display: flex; gap: .4rem; }
.btn-danger { background: var(--bad); border-color: var(--bad); color: #fff; }
.btn-danger:hover { background: #A32C22; border-color: #A32C22; }
.ai-sources .web-src { color: var(--muted); }
.ai-sources .web-src:hover { color: var(--ink-3); }

/* ── تمييز المحامي ── */
.docket-row.promoted { background: linear-gradient(180deg, #FFFBF0, #FFF7E6); border-inline-start: 4px solid var(--brass); }
.promo-badge { display: inline-flex; align-items: center; gap: .25rem; padding: .12rem .5rem; border-radius: 99px; background: var(--brass); color: #fff; font-size: .72rem; font-weight: 700; }
.promo-badge svg { width: 12px; height: 12px; }
.promo-active { background: linear-gradient(180deg, #FFFBF0, #fff); }
.list-check { list-style: none; padding: 0; margin: .5rem 0 0; }
.list-check li { padding-inline-start: 1.6rem; position: relative; margin-bottom: .45rem; }
.list-check li::before { content: "✔"; position: absolute; inset-inline-start: 0; color: var(--ok); font-weight: 700; }

/* ── محرر النصوص ── */
.rich { border: 1px solid var(--line-2); border-radius: 10px; overflow: hidden; background: #fff; }
.rich-bar { display: flex; flex-wrap: wrap; gap: .25rem; padding: .4rem; background: var(--paper); border-bottom: 1px solid var(--line); }
.rich-bar button { min-width: 34px; height: 32px; padding: 0 .5rem; border: 1px solid var(--line-2); background: #fff; border-radius: 7px; cursor: pointer; font-size: .9rem; color: var(--ink); }
.rich-bar button:hover { border-color: var(--ink); }
.rich-body { min-height: 260px; max-height: 60vh; overflow-y: auto; padding: 1rem 1.1rem; line-height: 2; outline: none; }
.rich-body:focus { box-shadow: inset 0 0 0 2px rgba(165,122,42,.25); }
.rich-body h2 { font-size: 1.3rem; margin: 1rem 0 .5rem; }
.rich-body h3 { font-size: 1.1rem; margin: .9rem 0 .4rem; }
.rich-body ul, .rich-body ol { padding-inline-start: 1.6rem; margin: .5rem 0; }
.rich-body blockquote { border-inline-start: 3px solid var(--brass); margin: .6rem 0; padding: .2rem 1rem; color: var(--muted); }
.rich-body table { width: 100%; border-collapse: collapse; margin: .6rem 0; }
.rich-body th, .rich-body td { border: 1px solid var(--line-2); padding: .4rem .6rem; }
.prose h2 { font-size: 1.4rem; margin: 1.5rem 0 .6rem; }
.prose h3 { font-size: 1.15rem; margin: 1.2rem 0 .5rem; }
.prose ul, .prose ol { padding-inline-start: 1.8rem; margin: .8rem 0; }
.prose blockquote { border-inline-start: 3px solid var(--brass); padding: .4rem 1rem; color: var(--muted); margin: 1rem 0; }
.prose table { width: 100%; border-collapse: collapse; margin: 1rem 0; }
.prose th, .prose td { border: 1px solid var(--line); padding: .5rem .7rem; text-align: start; }

/* ── اللغات والترجمة ── */
.progress { height: 8px; border-radius: 99px; background: var(--line-2); overflow: hidden; max-width: 160px; }
.progress span { display: block; height: 100%; background: var(--ok); }
.trans-table td { vertical-align: middle; }
.trans-table input { min-width: 200px; }
.lang-switch { display: inline-flex; align-items: center; gap: .35rem; padding: .25rem .5rem; border-radius: 8px; border: 1px solid var(--line-2); background: #fff; }
.lang-switch svg { width: 15px; height: 15px; color: var(--muted); flex: 0 0 auto; }
.lang-switch select { border: 0; background: transparent; font: inherit; font-size: .9rem; color: var(--ink); padding: .1rem .15rem; cursor: pointer; outline: none; max-width: 9rem; }
.lang-switch-sm { padding: .15rem .4rem; }
.lang-switch-sm select { font-size: .85rem; }
.site-header .lang-switch { border-color: rgba(255,255,255,.35); background: transparent; }
.site-header .lang-switch select { color: inherit; }
.site-header .lang-switch select option { color: var(--ink); }

/* ── المقابل التقريبي للسعر ── */
.money-approx { display: inline-block; font-size: .78em; color: var(--muted); font-weight: 500; margin-inline-start: .3rem; white-space: nowrap; }

/* ── شريط تبويب القطاعات: تمرير أفقي بلا شريط رأسي ── */
.sector-tabs, .tabs { overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; }
.sector-tabs::-webkit-scrollbar, .tabs::-webkit-scrollbar { height: 6px; }
.sector-tabs::-webkit-scrollbar-thumb, .tabs::-webkit-scrollbar-thumb { background: var(--line-2); border-radius: 99px; }

/* ── هيدر متناسق لكل اللغات ── */
.site-header .container { display: flex; align-items: center; gap: 1rem; flex-wrap: nowrap; }
.brand { display: inline-flex; align-items: center; gap: .55rem; min-width: 0; flex: 0 1 auto; }
.brand-name { font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 16ch; }

@media (min-width: 861px) {
  .nav { display: flex; align-items: center; gap: 1rem; margin-inline-start: auto; min-width: 0; }
  .nav-links { display: flex; align-items: center; gap: 1rem; min-width: 0; }
  .nav-links a { white-space: nowrap; }
  .nav-actions { display: flex; align-items: center; gap: .5rem; flex: 0 0 auto; }
  .nav-actions .btn { white-space: nowrap; }
}
@media (min-width: 861px) and (max-width: 1200px) { .brand-name { max-width: 12ch; } .nav, .nav-links { gap: .7rem; } }
@media (min-width: 861px) and (max-width: 1024px) { .nav-login { display: none; } }

/* القائمة المطوية على الجوال: الروابط في الشريط السفلي، والقائمة للحساب واللغة */
@media (max-width: 860px) {
  .nav-links { display: flex; flex-direction: column; align-items: stretch; gap: .35rem; }
  .nav-actions { display: flex; flex-direction: column; align-items: stretch; gap: .5rem; margin-top: .5rem; padding-top: .75rem; border-top: 1px solid var(--line); }
  .nav-actions .lang-switch { justify-content: center; }
}

/* ── واجهة التطبيق على الجوال ── */
.tabbar { display: none; }
@media (max-width: 860px) {
  .site-header .container { gap: .5rem; }
  .brand-name { max-width: 10ch; font-size: .95rem; }
  .tabbar {
    position: fixed; inset-inline: 0; bottom: 0; z-index: 60;
    display: grid; grid-auto-flow: column; grid-auto-columns: 1fr;
    background: #fff; border-top: 1px solid var(--line);
    padding-bottom: env(safe-area-inset-bottom, 0px);
    box-shadow: 0 -2px 16px rgba(20,35,61,.08);
  }
  .tabbar a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .15rem; padding: .5rem .25rem .45rem; color: var(--muted); font-size: .68rem; font-weight: 600; text-decoration: none; }
  .tabbar a.active { color: var(--brass); }
  .tabbar svg { width: 21px; height: 21px; }
  body { padding-bottom: calc(60px + env(safe-area-inset-bottom, 0px)); }
  .whatsapp-float { bottom: calc(74px + env(safe-area-inset-bottom, 0px)); }
  .site-header { position: sticky; top: 0; z-index: 50; padding-top: env(safe-area-inset-top, 0px); }
}
@media (display-mode: standalone) {
  .site-header { padding-top: max(env(safe-area-inset-top, 0px), .4rem); }
}
.lang-extra { margin-top: .5rem; padding-inline-start: .75rem; border-inline-start: 2px solid var(--line-2); }
.lang-extra label { display: block; font-size: .8rem; color: var(--muted); margin-bottom: .2rem; }

/* ── المحفظة ── */
.panel h2 svg { width: 19px; height: 19px; vertical-align: -3px; }
.panel > p.small svg, aside p.small svg { width: 15px; height: 15px; vertical-align: -2px; }
.alert .btn svg { width: 15px; height: 15px; vertical-align: -2px; margin-inline-end: .25rem; }

/* ── زر الإشعارات ── */
.bell-link { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 9px; color: inherit; flex: 0 0 auto; }
.bell-link:hover { background: rgba(255,255,255,.12); }
.bell-link svg { width: 20px; height: 20px; }
.bell-count { position: absolute; top: -2px; inset-inline-end: -2px; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 99px; background: var(--brass); color: #fff; font-size: .64rem; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.topbar-actions .bell-link:hover { background: var(--paper); }
.site-header .bell-link { color: var(--ink); }
.site-header.is-dark .bell-link { color: #fff; }
@media (max-width: 860px) {
  .site-header .container > .bell-link { margin-inline-start: auto; }
  .nav-actions .bell-link { display: none; }
}
@media (min-width: 861px) { .site-header .container > .bell-link { display: none; } }

/* ── صلاحيات الأدوار ── */
.perm-group { border: 1px solid var(--line); border-radius: 10px; padding: .8rem 1rem; margin: .75rem 0 0; }
.perm-group legend { font-size: .82rem; font-weight: 700; color: var(--muted); padding: 0 .4rem; }
.perm-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: .35rem .9rem; }
.perm-grid .check { margin: 0; font-size: .9rem; }

/* ── مفاتيح الواجهة البرمجية ── */
.key-box { background: #14233D; color: #E9EDF5; border-radius: 10px; padding: .8rem 1rem; overflow-x: auto; }
.key-box code { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: .85rem; white-space: nowrap; }
.api-doc pre { background: #14233D; color: #E9EDF5; padding: 1rem; border-radius: 10px; overflow-x: auto; font-size: .82rem; line-height: 1.7; }
.api-doc code { font-family: ui-monospace, Menlo, Consolas, monospace; }
.api-doc h3 { margin: 1.6rem 0 .5rem; font-size: 1.05rem; }
.api-ep { display: inline-block; background: var(--paper); border: 1px solid var(--line-2); border-radius: 7px; padding: .1rem .5rem; font-family: ui-monospace, monospace; font-size: .82rem; direction: ltr; }
.req-card { border: 1px solid var(--line); border-radius: 12px; padding: 1rem; margin-top: .75rem; background: #fff; }
.req-head { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; align-items: flex-start; }