/* ═══════════════════════════════════════════════════════════════════
   P-Zone Design Tokens — مصدر واحد للتفاصيل المشتركة عبر كل الصفحات:
   خطوط، مقياس مسافات، زوايا، ظلّال، انتقالات، وألوان محايدة متوافقة مع WCAG AA.
   ملاحظة: الألوان الأساسية لكل قسم (أخضر التطبيق / كحلي صفحة الدخول) بتفضل
   زي ما هي — ده بيوحّد "التفاصيل" مش الهوية.
   ═══════════════════════════════════════════════════════════════════ */
:root {
    /* الخطوط */
    --pz-font-ar: 'Tajawal', system-ui, -apple-system, sans-serif;
    --pz-font-en: 'Tajawal', system-ui, -apple-system, sans-serif;

    /* مقياس المسافات (8px scale) */
    --pz-space-1: 4px;
    --pz-space-2: 8px;
    --pz-space-3: 12px;
    --pz-space-4: 16px;
    --pz-space-5: 24px;
    --pz-space-6: 32px;

    /* الزوايا */
    --pz-radius-sm: 8px;
    --pz-radius-md: 10px;
    --pz-radius-lg: 14px;
    --pz-radius-pill: 20px;
    --pz-radius-full: 50%;

    /* الظلّال — سلّم موحّد ناعم */
    --pz-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.04), 0 1px 3px rgba(0, 0, 0, 0.06);
    --pz-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.07), 0 2px 4px -2px rgba(0, 0, 0, 0.05);
    --pz-shadow-lg: 0 10px 20px -6px rgba(0, 0, 0, 0.12), 0 4px 8px -4px rgba(0, 0, 0, 0.06);

    /* الانتقالات */
    --pz-transition: 0.2s ease;

    /* محايدات فاتحة متوافقة مع WCAG AA (تباين ≥ 4.5:1 على الخلفيات الفاتحة) */
    --pz-text-muted: #4b5563;   /* بدل #64748b الخافت */
    --pz-border: #e2e8f0;

    /* ═══ ألوان الهوية القانونية (مصدر واحد لكل الصفحات — فاتح) ═══ */
    --bg-body: #F4F5F7;
    --bg-card: #ffffff;
    --bg-elevated: #f8fafc;   /* سطح مُرتفع لكارت متداخل جوّه كارت (يبان بالحد في الفاتح، وبلون أفتح في الداكن) */
    --text-main: #3A3A3A;
    --text-muted: #4b5563;
    --border-color: #e2e8f0;
    --primary-green: #074237;
    --accent-orange: #EE7A00;
    --danger-color: #ef4444;
}

/* ═══ الوضع الداكن الموحّد للألوان القانونية (prefers + toggle) ═══ */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        --bg-body: #0f172a;
        --bg-card: #1e293b;
        --bg-elevated: #334155;
        --text-main: #f1f5f9;
        --text-muted: #94a3b8;
        --border-color: #334155;
        --primary-green: #074237;
        --accent-orange: #EE7A00;
        --danger-color: #ef4444;
    }
}
:root[data-theme="dark"] {
    --bg-body: #0f172a;
    --bg-card: #1e293b;
    --bg-elevated: #334155;
    --text-main: #f1f5f9;
    --text-muted: #94a3b8;
    --border-color: #334155;
    --primary-green: #074237;
    --accent-orange: #EE7A00;
    --danger-color: #ef4444;
}

/* ═══════════ حالة الفراغ الموحّدة (لا توجد بيانات) ═══════════ */
.pz-empty {
    text-align: center; color: var(--text-muted);
    padding: 40px 24px; background: var(--bg-card);
    border: 1px dashed var(--border-color); border-radius: 16px;
}
.pz-empty .emo, .pz-empty .cv-emoji { font-size: 44px; display: block; margin-bottom: 8px; }
.pz-empty b { font-size: 20px; color: var(--text-main); }

/* ═══════════ اسكرول بار موحّد (شكل واحد لكل الحاويات) ═══════════ */
* { scrollbar-width: thin; scrollbar-color: #cbd5e1 transparent; }   /* Firefox */
*::-webkit-scrollbar { width: 8px; height: 8px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 6px; }
*::-webkit-scrollbar-thumb:hover { background: var(--primary-green, #074237); }
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) * { scrollbar-color: #475569 transparent; }
    :root:not([data-theme="light"]) *::-webkit-scrollbar-thumb { background: #475569; }
}
:root[data-theme="dark"] * { scrollbar-color: #475569 transparent; }
:root[data-theme="dark"] *::-webkit-scrollbar-thumb { background: #475569; }

/* ═══════════ حلقة تركيز واضحة للتنقل بالكيبورد (Accessibility) ═══════════ */
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline: 2px solid #14b8a6;
    outline-offset: 2px;
    border-radius: 4px;
}