/* ═══════════════════════════════════════════════════════════════════
   zp-partner-2026.css — هويّة zp26 للوحة الشريك (ZovoHub)
   [جلسة التصميم] 2026-08-13 · فرع feat/design-partner-zp26
   المرجع البنيويّ: public/custom/zp-admin-2026.css (التوكنات وآليّة الغلبة)
   + public/custom/zp-panel-2026.css (رموز custom_color.dart لِلوحتَي
   الوكيل/التاجر — القيم هنا مطابقة حرفيًّا لتناسق الأسرة الفضّيّة عبر
   كلّ اللوحات).
   النطاق: body.zp-p26 حصرًا — لا يمسّ أيّ لوحة أخرى.

   قرار الثيم (موثَّق كما يطلبه التكليف): لوحة الشريك — عبر ماستر واحد
   (partner/layouts/master.blade.php) و١٦ صفحة قائمة بذاتها (auth/employee/
   إلخ) — لا تحمل أيّ مبدّل داكن/فاتح ولا localStorage/data-zp-theme في أيّ
   مكان من الـ27 بليدًا. لذلك هذا الملفّ **فاتح فقط** عمدًا؛ لا قسم داكن
   مكتوب هنا. إن أُضيف مبدّل ثيم مستقبلًا، يُستنسخ نمط `[data-zp-theme="dark"]`
   من zp-admin-2026.css على نفس التوكنات أدناه.

   بنية الصفحات المغطّاة: عشرة بليدات تمتدّ partner.layouts.master
   (تستهلك مفردة zh- و.panel و table المشتركة من الماستر) + ستّ عشرة صفحة
   قائمة بذاتها (auth/employee login وdashboard وinvite/show إلخ) تكرّر
   — بتغيّرات طفيفة — نفس مفردة المكوّنات (.card/.panel/.flash/.badge/
   table/button.primary...). هذا الملفّ يُوحِّد الاثنتين معًا تحت مجموعة
   واحدة من القواعد، فتُطبَّق تلقائيًّا في الصفحتين بالخصوصيّة (كلّ قاعدة
   هنا أعلى خصوصيّة من نظيرتها المضمَّنة بلا بادئة body.zp-p26) دون حاجة
   لحذف الـ<style> المضمَّن في كلّ صفحة قائمة بذاتها.
   ═══════════════════════════════════════════════════════════════════ */

/* ─ تحديث 2026-08-13 (جلسة إصلاح الأزرار) ────────────────────────────
   ١) حُذف المحدِّد الجامع button[type="submit"]:not(...) من قسم ٧: كان
      يمنح أيّ زرّ submit بلا صنف دلاليّ مظهرًا صلبًا كحليًّا بالقوّة —
      فانعكست أدوار: زرّ الخروج يصير الأبرز، وزرّ الرفض يطابق القبول
      حرفيًّا. الآن الدور يُكتب بصنف صريح لا يُستنتج من نوع الوسم.
   ٢) الإتلافيّ (.rbtn/button.danger) تحوّل من غارنيت مخترَع إلى أحمر
      الحالة القائم (--zp26-err/--zp26-err-t) بحكم صريح من المالك.
   ٣) --zp26-warn-t وُحِّد مع public/custom/zp-tokens.css (#b45309).
   ٤) canvas صار مُنطَّقًا تحت body.zp-p26 (كان المحدِّد الوحيد العالميّ
      في هذا الملفّ ويناقض عقد النطاق المكتوب أعلاه).
   ──────────────────────────────────────────────────────────────── */

/* ────────────────────────────────────────────────────────────────
   ١) التوكنات — مطابقة لأسرة zp-panel-2026 (سلامة اللوحات) · فاتح فقط
   ──────────────────────────────────────────────────────────────── */
body.zp-p26 {
    --zp26-navy-deep: #061228;
    --zp26-navy-dark: #0d1b3e;
    --zp26-navy-mid: #1b2e5f;
    --zp26-navy-bright: #2d5299;
    --zp26-navy-accent: #3b6fd4;
    --zp26-navy-light: #6b8fd4;
    --zp26-pearl-300: #C9D1DA;
    --zp26-pearl-400: #AEB8C4;
    --zp26-ink: #0e1b39;

    --zp26-page: #eef2f9;
    --zp26-page-alt: #e3ebf6;
    --zp26-card: #ffffff;
    --zp26-card-el: #FAFBFD;
    --zp26-line: rgba(27, 46, 95, .12);
    --zp26-line-mid: rgba(27, 46, 95, .20);

    --zp26-t1: #0e1b39;
    --zp26-t2: #344471;
    --zp26-t3: #5b6b8c;

    --zp26-ok: #16a34a;      --zp26-ok-t: #047857;
    --zp26-warn: #D97706;    --zp26-warn-t: #b45309;
    --zp26-err: #dc2626;     --zp26-err-t: #b91c1c;
    --zp26-info: #0284C7;    --zp26-info-t: #0369A1;

    --zp26-r-lg: 16px;
    --zp26-r-md: 12px;
    --zp26-r-sm: 9px;
    --zp26-shadow-1: 0 1px 2px rgba(27, 46, 95, .05), 0 8px 24px -14px rgba(27, 46, 95, .20);
    --zp26-shadow-2: 0 2px 8px rgba(27, 46, 95, .07), 0 20px 44px -20px rgba(27, 46, 95, .28);
    --zp26-dur: .2s;
    --zp26-ease: cubic-bezier(.33, 1, .68, 1);
    --zp26-thread: linear-gradient(90deg, #C9D1DA 0%, #3b6fd4 50%, #C9D1DA 100%);
}

/* ────────────────────────────────────────────────────────────────
   ٢) أساس · تركيز لوحة المفاتيح · شريط تمرير · تجميد الحركة
   ──────────────────────────────────────────────────────────────── */
body.zp-p26 :focus-visible {
    outline: 2px solid var(--zp26-navy-accent);
    outline-offset: 2px;
    border-radius: 6px;
}
body.zp-p26 ::-webkit-scrollbar { width: 6px; height: 6px; }
body.zp-p26 ::-webkit-scrollbar-track { background: transparent; }
body.zp-p26 ::-webkit-scrollbar-thumb { background: linear-gradient(180deg, var(--zp26-navy-mid), var(--zp26-navy-accent)); border-radius: 6px; }
body.zp-p26 ::-webkit-scrollbar-thumb:hover { background: var(--zp26-navy-bright); }

@media (prefers-reduced-motion: reduce) {
    body.zp-p26 *,
    body.zp-p26 *::before,
    body.zp-p26 *::after {
        animation-duration: .001s !important;
        transition-duration: .001s !important;
    }
}

/* ────────────────────────────────────────────────────────────────
   ٣) القائمة الجانبيّة (zh-side) — التوقيع الكحليّ المشترك مع
   الأدمن/الوكيل/التاجر (كانت بيضاء بحتة قبل هذه الدفعة)
   ──────────────────────────────────────────────────────────────── */
body.zp-p26 .zh-side {
    background:
        radial-gradient(220px 260px at 50% 0%, rgba(59, 111, 212, .20), transparent 70%),
        linear-gradient(180deg, var(--zp26-navy-mid) 0%, #16264e 60%, var(--zp26-navy-dark) 100%) !important;
    border-inline-end: 1px solid rgba(201, 209, 218, .10) !important;
    box-shadow: var(--zp26-shadow-2) !important;
}

body.zp-p26 .zh-brand {
    position: relative;
    overflow: hidden;
    border-radius: var(--zp26-r-md);
    margin: 12px 12px 4px;
    padding: 16px 16px 14px !important;
}
/* لوحة الجواهر (الخيوط الكوكبيّة) — منقولة من zp-panel-2026.js، مفعَّلة
   على هذه اللوحة وحدها بصفتها الواجهة الأولى التي يراها الشريك */
body.zp-p26 .zh-brand[data-zp-cosmic] {
    background: linear-gradient(135deg, var(--zp26-navy-deep), #040D20 38%, var(--zp26-navy-deep) 76%, var(--zp26-ink));
}
body.zp-p26 .zh-brand[data-zp-cosmic] > canvas.zp-cosmic-canvas {
    position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 0;
}
body.zp-p26 .zh-brand[data-zp-cosmic] > *:not(canvas) { position: relative; z-index: 1; }

body.zp-p26 .zh-brand .b { color: #ffffff !important; text-shadow: 0 0 20px rgba(59, 111, 212, .45); }
body.zp-p26 .zh-brand .co { color: rgba(219, 227, 242, .82) !important; }
body.zp-p26 .zh-badges .zh-chip {
    background: rgba(255, 255, 255, .10) !important;
    border-color: rgba(255, 255, 255, .22) !important;
    color: #eef2f9 !important;
    backdrop-filter: blur(6px);
}
body.zp-p26 .zh-badges .zh-chip.green {
    background: rgba(52, 211, 153, .16) !important;
    border-color: rgba(52, 211, 153, .38) !important;
    color: #d7fbe9 !important;
}

body.zp-p26 .zh-nav { padding: 6px 10px; }
body.zp-p26 .zh-nav a {
    color: rgba(219, 227, 242, .78) !important;
    transition: background var(--zp26-dur), color var(--zp26-dur), box-shadow var(--zp26-dur);
}
body.zp-p26 .zh-nav a:hover {
    background: rgba(201, 209, 218, .09) !important;
    color: #ffffff !important;
}
body.zp-p26 .zh-nav a.on {
    background: linear-gradient(90deg, rgba(59, 111, 212, .30), rgba(59, 111, 212, .05) 88%) !important;
    color: #ffffff !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12) !important;
    position: relative;
}
/* خيط اللؤلؤ — مؤشّر العنصر النشط، نفس توقيع الأدمن/الوكيل/التاجر */
body.zp-p26 .zh-nav a.on::before {
    content: '';
    position: absolute; inset-inline-start: 0; top: 22%; height: 56%; width: 3px; border-radius: 3px;
    background: linear-gradient(180deg, var(--zp26-pearl-300), var(--zp26-navy-accent), var(--zp26-pearl-300));
    box-shadow: 0 0 10px rgba(59, 111, 212, .6);
}

body.zp-p26 .zh-side .foot { border-top-color: rgba(201, 209, 218, .12) !important; }
body.zp-p26 .zh-lang a {
    color: rgba(219, 227, 242, .72) !important;
    border-color: rgba(201, 209, 218, .18) !important;
}
body.zp-p26 .zh-lang a.on { background: linear-gradient(135deg, var(--zp26-navy-bright), var(--zp26-navy-accent)) !important; color: #fff !important; }
body.zp-p26 .zh-logout {
    color: rgba(219, 227, 242, .72) !important;
    border-color: rgba(201, 209, 218, .18) !important;
}
body.zp-p26 .zh-logout:hover { color: #ff9ea8 !important; border-color: rgba(220, 38, 38, .4) !important; background: rgba(220, 38, 38, .10) !important; }

/* الشريط المصغّر عند الجوّال */
body.zp-p26 .zh-burger {
    background: var(--zp26-card) !important;
    border-color: var(--zp26-line) !important;
    color: var(--zp26-navy-bright) !important;
}

/* ────────────────────────────────────────────────────────────────
   ٤) الشريط العلويّ للمحتوى (zh-top)
   ──────────────────────────────────────────────────────────────── */
body.zp-p26 .zh-top h1 { color: var(--zp26-t1); font-family: inherit; }
body.zp-p26 .zh-top .sub { color: var(--zp26-t3); }

/* ────────────────────────────────────────────────────────────────
   ٥) بطاقات المؤشّرات (zh-kpi) — زجاج مصقول + خيط علويّ لؤلؤيّ خفيف
   ──────────────────────────────────────────────────────────────── */
body.zp-p26 .zh-kpi {
    background: var(--zp26-card) !important;
    border: 1px solid var(--zp26-line) !important;
    border-radius: var(--zp26-r-lg) !important;
    box-shadow: var(--zp26-shadow-1) !important;
    transition: transform var(--zp26-dur) var(--zp26-ease), box-shadow var(--zp26-dur) var(--zp26-ease), border-color var(--zp26-dur);
}
body.zp-p26 .zh-kpi:hover {
    transform: translateY(-2px);
    box-shadow: var(--zp26-shadow-2), 0 0 0 1px rgba(59, 111, 212, .16) !important;
    border-color: rgba(59, 111, 212, .3) !important;
}
body.zp-p26 .zh-kpi.highlight {
    border-color: rgba(59, 111, 212, .30) !important;
    background: linear-gradient(160deg, #f7faff, #eaf1ff) !important;
}
body.zp-p26 .zh-kpi.highlight .n { color: var(--zp26-navy-bright) !important; }
body.zp-p26 .zh-kpi.alert { border-color: rgba(220, 38, 38, .30) !important; }
body.zp-p26 .zh-kpi.alert .n { color: var(--zp26-err-t) !important; }
body.zp-p26 .zh-kpi .n,
body.zp-p26 .zh-kpi .n .cur {
    font-feature-settings: 'tnum' 1, 'lnum' 1;
    font-variant-numeric: tabular-nums lining-nums;
}

/* ────────────────────────────────────────────────────────────────
   ٦) البطاقات/اللوحات العامّة — .panel (شكل الماستر) و.card (الصفحات
   القائمة بذاتها: تسجيل الدخول، النماذج، العرض) — نفس المعالجة
   ──────────────────────────────────────────────────────────────── */
body.zp-p26 .panel,
body.zp-p26 .card {
    background: var(--zp26-card) !important;
    border: 1px solid var(--zp26-line) !important;
    border-radius: var(--zp26-r-lg) !important;
    box-shadow: var(--zp26-shadow-1) !important;
}
body.zp-p26 .panel h3 {
    color: var(--zp26-navy-bright) !important;
    border-bottom-color: var(--zp26-line) !important;
}
body.zp-p26 .panel h3 .tag { color: var(--zp26-t3) !important; }
body.zp-p26 .brand { color: var(--zp26-navy-bright) !important; }
body.zp-p26 .sub { color: var(--zp26-t3) !important; }
body.zp-p26 .lead { color: var(--zp26-t3) !important; }
body.zp-p26 .hint { color: var(--zp26-t3) !important; }
body.zp-p26 .note { color: var(--zp26-t3) !important; }
body.zp-p26 .foot { color: var(--zp26-t3) !important; }
body.zp-p26 a.back { color: var(--zp26-t3) !important; transition: color var(--zp26-dur); }
body.zp-p26 a.back:hover { color: var(--zp26-navy-bright) !important; }

/* ────────────────────────────────────────────────────────────────
   ٧) الأزرار — الدور يُكتب بصنف صريح لا يُستنتج من نوع الوسم:
   صلب = فعل أساسيّ واحد لكلّ سياق (.btn.solid/.accept/.signin/...)
   شبح = ثانويّ (.btn:not(.solid)/.mini/.cbtn/.decline/.ghost)
   أحمر الحالة = إتلافيّ/رفض لا رجعة فيه (.rbtn/button.danger) —
   بحكم المالك: الغارنيت مرفوض، فالإتلافيّ يُعاد استعمال --zp26-err
   القائم أصلًا لكلّ حالات الخطأ في هذه اللوحة، لا لونًا جديدًا.
   لا محدِّد جامع على [type=submit] — كلّ زرّ بلا صنف دلاليّ يبقى على
   مظهره المحليّ (مثال: زرّ تفعيل/تعطيل 2FA بخلفيّته المضمَّنة).
   ──────────────────────────────────────────────────────────────── */
body.zp-p26 .btn,
body.zp-p26 a.btn,
body.zp-p26 button.btn,
body.zp-p26 button.primary,
body.zp-p26 .btn-submit,
body.zp-p26 .accept,
body.zp-p26 .signin,
body.zp-p26 .hbtn,
body.zp-p26 button.resume {
    border-radius: var(--zp26-r-sm) !important;
    font-weight: 700 !important;
    transition: transform var(--zp26-dur) var(--zp26-ease), box-shadow var(--zp26-dur) var(--zp26-ease), filter var(--zp26-dur) !important;
}
body.zp-p26 .btn.solid,
body.zp-p26 button.primary,
body.zp-p26 .btn-submit,
body.zp-p26 .accept,
body.zp-p26 .signin,
body.zp-p26 .hbtn,
body.zp-p26 button.resume {
    background: linear-gradient(135deg, var(--zp26-navy-bright), var(--zp26-navy-accent)) !important;
    border: none !important;
    color: #ffffff !important;
    box-shadow: 0 8px 20px -8px rgba(45, 82, 153, .5), inset 0 1px 0 rgba(255, 255, 255, .16) !important;
}
body.zp-p26 .btn.solid:hover,
body.zp-p26 button.primary:hover,
body.zp-p26 .btn-submit:hover,
body.zp-p26 .accept:hover,
body.zp-p26 .signin:hover,
body.zp-p26 .hbtn:hover,
body.zp-p26 button.resume:hover {
    transform: translateY(-1px);
    filter: brightness(1.04);
    box-shadow: 0 12px 26px -10px rgba(45, 82, 153, .6), inset 0 1px 0 rgba(255, 255, 255, .16) !important;
}
body.zp-p26 .btn:not(.solid),
body.zp-p26 .cbtn,
body.zp-p26 .mini,
body.zp-p26 .decline,
body.zp-p26 button.ghost,
body.zp-p26 .btn.ghost {
    background: #fff !important;
    border: 1px solid rgba(45, 82, 153, .35) !important;
    color: var(--zp26-navy-bright) !important;
}
body.zp-p26 .btn:not(.solid):hover,
body.zp-p26 .cbtn:hover,
body.zp-p26 .mini:hover {
    background: rgba(45, 82, 153, .08) !important;
}
/* إتلافيّ — أحمر الحالة القائم (حذف/رفض/إلغاء لا رجعة فيه) */
body.zp-p26 .rbtn,
body.zp-p26 button.danger,
body.zp-p26 .mini.danger:hover {
    background: transparent !important;
    border: 1.5px solid rgba(220, 38, 38, .4) !important;
    color: var(--zp26-err-t) !important;
    box-shadow: none !important;
}
body.zp-p26 .rbtn:hover,
body.zp-p26 button.danger:hover {
    background: rgba(220, 38, 38, .08) !important;
    border-color: var(--zp26-err) !important;
    color: var(--zp26-err) !important;
}
body.zp-p26 button:disabled,
body.zp-p26 .btn:disabled { opacity: .55 !important; cursor: not-allowed; transform: none !important; }

/* ────────────────────────────────────────────────────────────────
   ٨) الحقول — نصف قطر موحَّد وحلقة تركيز كحليّة
   ──────────────────────────────────────────────────────────────── */
body.zp-p26 input,
body.zp-p26 select,
body.zp-p26 textarea {
    border-radius: var(--zp26-r-sm) !important;
    transition: border-color var(--zp26-dur), box-shadow var(--zp26-dur), background var(--zp26-dur);
}
body.zp-p26 input:focus,
body.zp-p26 select:focus,
body.zp-p26 textarea:focus {
    border-color: var(--zp26-navy-accent) !important;
    box-shadow: 0 0 0 3px rgba(59, 111, 212, .14) !important;
}
body.zp-p26 label,
body.zp-p26 .form-label {
    color: var(--zp26-t2) !important;
}
body.zp-p26 .auth label,
body.zp-p26 .otp,
body.zp-p26 .codes input {
    border-radius: var(--zp26-r-sm);
}
body.zp-p26 .otp:focus,
body.zp-p26 .codes input:focus {
    border-color: var(--zp26-navy-accent) !important;
    box-shadow: 0 0 0 3px rgba(59, 111, 212, .14) !important;
}
body.zp-p26 .linkbox input {
    border-radius: var(--zp26-r-sm) !important;
}

/* ────────────────────────────────────────────────────────────────
   ٩) التنبيهات — قاعدة سطح خفيف + نصّ داكن دلاليًّا (لا نصّ فاتح على
   سطح فاتح، ولا العكس) لكلّ أصناف .flash/.err/.ok/.alert-*
   ──────────────────────────────────────────────────────────────── */
body.zp-p26 .flash,
body.zp-p26 .flash-err,
body.zp-p26 .err:not(label ~ .err),
body.zp-p26 .ok,
body.zp-p26 .alert-danger,
body.zp-p26 .alert-success {
    border-radius: var(--zp26-r-md) !important;
}
body.zp-p26 .flash.ok,
body.zp-p26 .ok,
body.zp-p26 .alert-success {
    background: rgba(22, 163, 74, .10) !important;
    border-color: rgba(22, 163, 74, .32) !important;
    color: var(--zp26-ok-t) !important;
}
body.zp-p26 .flash.err,
body.zp-p26 .flash-err,
body.zp-p26 div.err,
body.zp-p26 .alert-danger {
    background: rgba(220, 38, 38, .10) !important;
    border-color: rgba(220, 38, 38, .35) !important;
    color: var(--zp26-err-t) !important;
}

/* ────────────────────────────────────────────────────────────────
   ١٠) الجداول — أرقام جدوليّة دائمًا للمبالغ
   ──────────────────────────────────────────────────────────────── */
body.zp-p26 th { color: var(--zp26-t3) !important; }
body.zp-p26 .muted { color: var(--zp26-t3) !important; }
body.zp-p26 .amount,
body.zp-p26 td.r,
body.zp-p26 .price,
body.zp-p26 .plan-name {
    font-feature-settings: 'tnum' 1, 'lnum' 1;
    font-variant-numeric: tabular-nums lining-nums;
}
body.zp-p26 tbody tr { transition: background var(--zp26-dur); }
body.zp-p26 table tbody tr:hover { background: rgba(174, 184, 196, .10); }
body.zp-p26 .empty { color: var(--zp26-t3) !important; }
body.zp-p26 .held,
body.zp-p26 .owe { color: var(--zp26-warn-t) !important; }
body.zp-p26 .cod { color: var(--zp26-ok-t) !important; }

/* ────────────────────────────────────────────────────────────────
   ١١) الشارات وحالات — قاعدة سطح خفيف + حدّ + نصّ دلاليّ (مطبَّقة
   أصلًا بشكل صحيح في أغلب الصفحات؛ هنا توحيد نصف القطر والوزن فقط)
   ──────────────────────────────────────────────────────────────── */
body.zp-p26 .badge,
body.zp-p26 .chip,
body.zp-p26 .mode,
body.zp-p26 .actor {
    border-radius: 999px !important;
    font-weight: 700 !important;
}
body.zp-p26 .status.on { color: var(--zp26-err-t) !important; }
body.zp-p26 .status.off { color: var(--zp26-ok-t) !important; }

/* ────────────────────────────────────────────────────────────────
   ١٢) مودال التأكيد المشترك (zh-modal) — زجاج بدل الصندوق الأبيض العادي
   ──────────────────────────────────────────────────────────────── */
body.zp-p26 .zh-modal-card {
    background: var(--zp26-card) !important;
    border-color: var(--zp26-line) !important;
    box-shadow: var(--zp26-shadow-2), 0 30px 80px rgba(20, 40, 90, .28) !important;
}
body.zp-p26 .zh-modal-msg { color: var(--zp26-t1) !important; }

/* ────────────────────────────────────────────────────────────────
   ١٣) لمسات محتوى متفرّقة (قابلة لإعادة الاستخدام عبر الصفحات القائمة
   بذاتها) — kv/terms/state/reveal/keyrow إلخ — توحيد لون الخطّ فقط
   ──────────────────────────────────────────────────────────────── */
body.zp-p26 .kv > div,
body.zp-p26 .inv > div,
body.zp-p26 .keyrow,
body.zp-p26 .rfrm,
body.zp-p26 .trow {
    border-bottom-color: var(--zp26-line) !important;
}
body.zp-p26 .kv .k,
body.zp-p26 .inv .k,
body.zp-p26 .trow .k {
    color: var(--zp26-t3) !important;
}
body.zp-p26 .terms {
    background: var(--zp26-page) !important;
    border-color: var(--zp26-line-mid) !important;
    border-radius: var(--zp26-r-md) !important;
}
body.zp-p26 .reveal {
    border-color: rgba(59, 111, 212, .35) !important;
    background: linear-gradient(150deg, #f7faff, #eaf1ff) !important;
    border-radius: var(--zp26-r-md) !important;
}
body.zp-p26 .reveal .t { color: var(--zp26-navy-bright) !important; }
body.zp-p26 .reveal .warn { color: var(--zp26-warn-t) !important; }
body.zp-p26 .soon { border-color: rgba(45, 82, 153, .35) !important; color: var(--zp26-t3) !important; }
body.zp-p26 .lock { color: var(--zp26-t3) !important; }

body.zp-p26 canvas { max-width: 100%; }
