/* ============================================================
   بيزك — نظام التصميم (Bezeq Design System) v10
   ============================================================ */
:root {
    --bezeq-navy: #0E2A6B;
    --bezeq-navy-2: #16357F;
    --bezeq-navy-deep: #0A1F50;
    --bezeq-cyan: #22D3EE;
    --bezeq-blue: #2563EB;
    --bezeq-blue-2: #1D4ED8;
    --bezeq-bg: #eef2f9;
    --bezeq-card-border: #e6ecf6;
    --bezeq-shadow-sm: 0 1px 2px rgba(16, 42, 107, .04), 0 2px 8px rgba(16, 42, 107, .04);
    --bezeq-shadow: 0 1px 2px rgba(16, 42, 107, .05), 0 10px 28px rgba(16, 42, 107, .08);
    --bezeq-shadow-lg: 0 18px 50px rgba(16, 42, 107, .16);
}

.fi-body, .fi-sidebar, .fi-topbar { letter-spacing: 0; }

/* انتقالات ناعمة */
.fi-btn, .fi-sidebar-item-btn, .fi-wi-stats-overview-stat, .fi-ta-row,
.fi-badge, .fi-input, .fi-link, .fi-dropdown-list-item {
    transition: background-color .16s ease, color .16s ease, box-shadow .16s ease,
        transform .16s ease, border-color .16s ease !important;
}

/* ============================================================
   الشريط الجانبي
   ============================================================ */
.fi-sidebar {
    background: linear-gradient(180deg, #102E74 0%, var(--bezeq-navy-deep) 100%) !important;
    border-inline-end: 0 !important;
}

.fi-sidebar-header,
.fi-sidebar-nav { background: transparent !important; }

.fi-sidebar-header {
    box-shadow: none !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.fi-sidebar-group-label {
    color: #7A95CF !important;
    font-size: 0.7rem !important;
    letter-spacing: .04em;
    text-transform: none;
    font-weight: 600 !important;
}

.fi-sidebar-item-label { color: #C9D8F2 !important; font-size: 0.92rem; }
.fi-sidebar-item-icon { color: #8AA6DA !important; }

.fi-sidebar-item-btn {
    border-radius: 11px !important;
    margin: 1px 6px;
    padding-block: 0.5rem !important;
}

.fi-sidebar-item-btn:hover { background-color: rgba(255, 255, 255, 0.08) !important; }

.fi-sidebar-item.fi-active .fi-sidebar-item-btn,
.fi-sidebar-item-active .fi-sidebar-item-btn,
.fi-sidebar-item-btn.fi-active {
    background: linear-gradient(90deg, var(--bezeq-blue), #2f6df0) !important;
    box-shadow: inset 3px 0 0 0 var(--bezeq-cyan), 0 6px 16px rgba(37, 99, 235, 0.4) !important;
}

.fi-sidebar-item.fi-active .fi-sidebar-item-label,
.fi-sidebar-item.fi-active .fi-sidebar-item-icon,
.fi-sidebar-item-active .fi-sidebar-item-label,
.fi-sidebar-item-active .fi-sidebar-item-icon,
.fi-sidebar-item-btn.fi-active .fi-sidebar-item-label,
.fi-sidebar-item-btn.fi-active .fi-sidebar-item-icon {
    color: #ffffff !important;
}

.fi-sidebar-header .fi-icon-btn,
.fi-sidebar-nav .fi-icon-btn { color: #A9BFE6 !important; }

.fi-sidebar-nav { scrollbar-color: #2e4a8a transparent; }

/* ============================================================
   الشريط العلوي
   ============================================================ */
.fi-topbar nav {
    border-bottom: 2px solid transparent !important;
    border-image: linear-gradient(90deg, var(--bezeq-navy), var(--bezeq-cyan)) 1 !important;
    box-shadow: 0 1px 0 rgba(16, 42, 107, .05), 0 8px 22px rgba(16, 42, 107, .05) !important;
}

html:not(.dark) .fi-topbar .fi-input {
    background: #f4f7fc !important;
    border-radius: 10px !important;
}

/* ============================================================
   اللوجو — يظهر بوضوح على كل الخلفيات
   ============================================================ */
.bezeq-brand-text { color: var(--bezeq-navy) !important; }

html.dark .bezeq-brand-text,
.fi-sidebar .bezeq-brand-text,
.fi-simple-layout .bezeq-brand-text { color: #ffffff !important; }

/* ============================================================
   الوضع الداكن — لمسات متناسقة مع الهوية
   ============================================================ */
html.dark .fi-main { background-color: #0B1326 !important; }
html.dark .fi-topbar nav { background-color: #111B30 !important; }

/* ============================================================
   خلفية المحتوى
   ============================================================ */
html:not(.dark) .fi-main {
    background-color: var(--bezeq-bg) !important;
    background-image: radial-gradient(rgba(37, 99, 235, 0.05) 1.1px, transparent 1.1px);
    background-size: 22px 22px;
}

/* ============================================================
   العناوين والمسار
   ============================================================ */
html:not(.dark) .fi-header-heading {
    color: var(--bezeq-navy) !important;
    font-weight: 800 !important;
    letter-spacing: -0.01em;
}

html:not(.dark) .fi-breadcrumbs-item,
html:not(.dark) .fi-breadcrumbs-item a { color: #6b7a99 !important; }

/* ============================================================
   البطاقات: الأقسام / الجداول / المخططات
   ============================================================ */
.fi-section, .fi-ta-ctn, .fi-fieldset, .fi-wi-stats-overview-stat { border-radius: 18px !important; }

html:not(.dark) .fi-section,
html:not(.dark) .fi-ta-ctn,
html:not(.dark) .fi-fieldset {
    background: #ffffff !important;
    border: 1px solid var(--bezeq-card-border) !important;
    box-shadow: var(--bezeq-shadow) !important;
}

/* رأس القسم بخط سماوي مميّز */
html:not(.dark) .fi-section-header-heading,
html:not(.dark) .fi-section-content-heading { color: var(--bezeq-navy) !important; font-weight: 700 !important; }

html:not(.dark) .fi-section > .fi-section-header {
    border-inline-start: 4px solid var(--bezeq-cyan);
    border-start-start-radius: 18px;
}

/* ============================================================
   بطاقات الإحصاء KPI
   ============================================================ */
.fi-wi-stats-overview-stat {
    border-top: 3px solid var(--bezeq-cyan) !important;
}

html:not(.dark) .fi-wi-stats-overview-stat {
    background: #ffffff !important;
    border: 1px solid var(--bezeq-card-border) !important;
    border-top: 3px solid var(--bezeq-cyan) !important;
    box-shadow: var(--bezeq-shadow) !important;
}

.fi-wi-stats-overview-stat:hover {
    transform: translateY(-3px);
    box-shadow: var(--bezeq-shadow-lg) !important;
}

.fi-wi-stats-overview-stat-value { font-size: 1.9rem !important; font-weight: 800 !important; }
html:not(.dark) .fi-wi-stats-overview-stat-value { color: var(--bezeq-navy) !important; }
.fi-wi-stats-overview-stat-label { font-weight: 600 !important; }

/* ============================================================
   الجداول
   ============================================================ */
html:not(.dark) .fi-ta-header-cell {
    background: #f2f6fd !important;
    color: var(--bezeq-navy) !important;
    font-weight: 700 !important;
    letter-spacing: 0;
}

html:not(.dark) .fi-ta-row:hover { background: #f6f9ff !important; }

/* روابط الإجراءات داخل الصف (تعديل/طباعة/إلغاء) */
.fi-ta-actions .fi-link { font-weight: 600 !important; }

/* الترقيم */
html:not(.dark) .fi-pagination .fi-btn,
html:not(.dark) .fi-pagination .fi-pagination-item { border-radius: 9px !important; }

/* ============================================================
   الأزرار
   ============================================================ */
.fi-btn { border-radius: 11px !important; font-weight: 600 !important; }

.fi-btn.fi-color-primary,
.fi-btn:is(.fi-bg-color-400, [class*="bg-color-400"]) {
    box-shadow: 0 4px 14px rgba(37, 99, 235, .3) !important;
}

.fi-btn:hover { transform: translateY(-1px); }

/* ============================================================
   الشارات والمدخلات
   ============================================================ */
.fi-badge {
    border-radius: 9999px !important;
    font-weight: 600 !important;
    padding-inline: 0.6rem !important;
}

.fi-input, .fi-select-input, .fi-input-wrp { border-radius: 11px !important; }

html:not(.dark) .fi-input-wrp:focus-within {
    border-color: var(--bezeq-blue) !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, .16) !important;
}

/* ============================================================
   النوافذ المنبثقة
   ============================================================ */
.fi-modal-window { border-radius: 20px !important; box-shadow: var(--bezeq-shadow-lg) !important; }
html:not(.dark) .fi-modal-heading { color: var(--bezeq-navy) !important; font-weight: 700 !important; }

/* قوائم منسدلة */
.fi-dropdown-panel { border-radius: 14px !important; box-shadow: var(--bezeq-shadow) !important; }

/* ============================================================
   شاشة الدخول — فخمة
   ============================================================ */
.fi-simple-layout {
    background: radial-gradient(120% 120% at 100% 0%, #1b3f95 0%, var(--bezeq-navy) 45%, var(--bezeq-navy-deep) 100%) !important;
    position: relative;
}

.fi-simple-layout::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(127, 176, 255, 0.16) 1.4px, transparent 1.4px);
    background-size: 26px 26px;
    pointer-events: none;
}

.fi-simple-main {
    border-radius: 22px !important;
    box-shadow: 0 30px 80px rgba(3, 10, 30, 0.6) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-top: 3px solid var(--bezeq-cyan) !important;
    position: relative;
    z-index: 1;
}

.fi-simple-layout .fi-logo {
    background: var(--bezeq-navy);
    padding: 0.7rem 1.5rem;
    border-radius: 16px;
    margin-bottom: 0.4rem;
    box-shadow: 0 8px 20px rgba(14, 42, 107, .35);
}

/* ============================================================
   أشرطة التمرير
   ============================================================ */
html:not(.dark) .fi-main ::-webkit-scrollbar { width: 10px; height: 10px; }
html:not(.dark) .fi-main ::-webkit-scrollbar-thumb {
    background: #c3d0e6; border-radius: 9999px; border: 2px solid transparent; background-clip: padding-box;
}
html:not(.dark) .fi-main ::-webkit-scrollbar-thumb:hover { background: #9fb3d6; background-clip: padding-box; }

/* الحالة الفارغة */
html:not(.dark) .fi-ta-empty-state-heading { color: var(--bezeq-navy) !important; }