/* ============================================================
   SaaS Enterprise Admin — UI Override v2.0
   Loaded AFTER all Filament styles via Render Hook
   All rules use !important to guarantee override.
   ============================================================ */

/* SCROLLBARS */
::-webkit-scrollbar       { width: 5px !important; height: 5px !important; }
::-webkit-scrollbar-track { background: transparent !important; }
::-webkit-scrollbar-thumb { background: #d1d5db !important; border-radius: 99px !important; }
::-webkit-scrollbar-thumb:hover { background: #9ca3af !important; }
.dark ::-webkit-scrollbar-thumb { background: #374151 !important; }

/* ROOT LAYOUT */
.fi-layout { background-color: #f8f9fb !important; }
.dark .fi-layout { background-color: #0d0f14 !important; }
.fi-main { background-color: transparent !important; }

/* SIDEBAR */
.fi-sidebar {
    background-color: #ffffff !important;
    border-right: 1px solid #e5e7eb !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}
.dark .fi-sidebar {
    background-color: #111318 !important;
    border-right-color: #1e2028 !important;
}
.fi-sidebar-header {
    padding: 1.125rem 1rem !important;
    border-bottom: 1px solid #f3f4f6 !important;
}
.dark .fi-sidebar-header { border-bottom-color: #1e2028 !important; }
.fi-sidebar-group-label {
    font-size: 0.6875rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    color: #9ca3af !important;
    padding: 1.25rem 1rem 0.375rem 1rem !important;
}
.fi-sidebar-item-button {
    border-radius: 0.5rem !important;
    margin: 1px 0.5rem !important;
    padding: 0.5rem 0.75rem !important;
    font-size: 0.875rem !important;
    font-weight: 500 !important;
    color: #6b7280 !important;
    transition: background-color 0.12s ease, color 0.12s ease !important;
    position: relative !important;
}
.dark .fi-sidebar-item-button { color: #9ca3af !important; }
.fi-sidebar-item-button:hover {
    background-color: #f3f4f6 !important;
    color: #111827 !important;
}
.dark .fi-sidebar-item-button:hover {
    background-color: #1e2028 !important;
    color: #e5e7eb !important;
}
.fi-sidebar-item-button.fi-active,
.fi-sidebar-item-button[aria-current="page"] {
    background-color: #eef2ff !important;
    color: #4f46e5 !important;
    font-weight: 600 !important;
}
.dark .fi-sidebar-item-button.fi-active,
.dark .fi-sidebar-item-button[aria-current="page"] {
    background-color: #1e1b4b !important;
    color: #818cf8 !important;
}

/* TOPBAR */
.fi-topbar {
    background-color: #ffffff !important;
    border-bottom: 1px solid #e5e7eb !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}
.dark .fi-topbar {
    background-color: #111318 !important;
    border-bottom-color: #1e2028 !important;
}

/* PAGE HEADER */
.fi-page-header {
    padding-bottom: 0.75rem !important;
    margin-bottom: 0.75rem !important;
    border-bottom: 1px solid #e5e7eb !important;
}
.dark .fi-page-header { border-bottom-color: #1e2028 !important; }
.fi-page-header-heading {
    font-size: 1.15rem !important;
    font-weight: 700 !important;
    color: #111827 !important;
}
.dark .fi-page-header-heading { color: #f1f5f9 !important; }
.fi-page-header-subheading {
    font-size: 0.75rem !important;
    color: #9ca3af !important;
    margin-top: 0.2rem !important;
}

/* STAT WIDGETS */
.fi-wi-stats-overview-stat {
    background-color: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 0.75rem !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05) !important;
    transition: transform 0.18s ease, box-shadow 0.18s ease !important;
    padding: 0.75rem !important;
}
.dark .fi-wi-stats-overview-stat {
    background-color: #161923 !important;
    border-color: #1e2028 !important;
}
.fi-wi-stats-overview-stat:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 14px rgba(0,0,0,0.08) !important;
}
.fi-wi-stats-overview-stat-label {
    font-size: 0.65rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    color: #9ca3af !important;
}
.fi-wi-stats-overview-stat-value {
    font-size: 1.25rem !important;
    font-weight: 800 !important;
    letter-spacing: -0.01em !important;
    color: #111827 !important;
    line-height: 1.2 !important;
    margin-top: 0.15rem !important;
}
.dark .fi-wi-stats-overview-stat-value { color: #f1f5f9 !important; }
.fi-wi-stats-overview-stat-description {
    font-size: 0.6rem !important;
    margin-top: 0.1rem !important;
    color: #9ca3af !important;
}
.fi-wi-stats-overview-stat-chart {
    height: 28px !important;
    margin-top: 0.25rem !important;
}

/* SECTIONS */
.fi-section {
    background-color: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 1rem !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06) !important;
}
.dark .fi-section {
    background-color: #161923 !important;
    border-color: #1e2028 !important;
}
.fi-section-header {
    padding: 1rem 1.25rem !important;
    border-bottom: 1px solid #f3f4f6 !important;
}
.dark .fi-section-header { border-bottom-color: #1e2028 !important; }
.fi-section-header-heading {
    font-size: 0.9375rem !important;
    font-weight: 700 !important;
    letter-spacing: -0.01em !important;
    color: #111827 !important;
}
.dark .fi-section-header-heading { color: #f1f5f9 !important; }
.fi-section-content { padding: 1.25rem !important; }

/* WIDGET CONTAINER */
.fi-wi {
    gap: 0.5rem !important;
}
.fi-wi-ctn {
    gap: 0.5rem !important;
}

/* STATS OVERVIEW WIDGET INNER */
.fi-wi-stats-overview {
    gap: 0.5rem !important;
}

/* TABLE WIDGET (LatestOrders etc) */
.fi-wi-table {
    border-radius: 0.75rem !important;
}
.fi-wi-table .fi-wi-table-heading {
    font-size: 0.85rem !important;
    font-weight: 700 !important;
    padding: 0.75rem 1rem !important;
}

/* TABLES */
.fi-ta-ctn {
    background-color: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 1rem !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06) !important;
    overflow: hidden !important;
}
.dark .fi-ta-ctn {
    background-color: #161923 !important;
    border-color: #1e2028 !important;
}
.fi-ta-header {
    padding: 1rem 1.25rem !important;
    border-bottom: 1px solid #f3f4f6 !important;
    background-color: #ffffff !important;
}
.dark .fi-ta-header {
    border-bottom-color: #1e2028 !important;
    background-color: #161923 !important;
}
.fi-ta-header-cell {
    background-color: #f9fafb !important;
    padding: 0.75rem 1rem !important;
    font-size: 0.72rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.07em !important;
    text-transform: uppercase !important;
    color: #6b7280 !important;
    border-bottom: 1px solid #e5e7eb !important;
}
.dark .fi-ta-header-cell {
    background-color: #131620 !important;
    color: #6b7280 !important;
    border-bottom-color: #1e2028 !important;
}
.fi-ta-record {
    border-bottom: 1px solid #f3f4f6 !important;
    transition: background-color 0.1s ease !important;
}
.dark .fi-ta-record { border-bottom-color: #1e2028 !important; }
.fi-ta-record:hover { background-color: #f9fafb !important; }
.dark .fi-ta-record:hover { background-color: #1a1e2a !important; }
.fi-ta-record:last-child { border-bottom: none !important; }
.fi-ta-cell {
    padding: 0.875rem 1rem !important;
    font-size: 0.875rem !important;
    color: #374151 !important;
}
.dark .fi-ta-cell { color: #9ca3af !important; }
.fi-pagination {
    padding: 0.875rem 1.25rem !important;
    border-top: 1px solid #f3f4f6 !important;
    background-color: #ffffff !important;
}
.dark .fi-pagination {
    border-top-color: #1e2028 !important;
    background-color: #161923 !important;
}
.fi-ta-search-field .fi-input-wrp {
    border-radius: 9999px !important;
    background-color: #f3f4f6 !important;
    border-color: transparent !important;
    box-shadow: none !important;
}
.dark .fi-ta-search-field .fi-input-wrp {
    background-color: #1e2028 !important;
    border-color: transparent !important;
}

/* CHART WIDGET */
.fi-wi-chart {
    background-color: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 0.75rem !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05) !important;
}
.dark .fi-wi-chart {
    background-color: #161923 !important;
    border-color: #1e2028 !important;
}
.fi-wi-chart .fi-section-header {
    padding: 0.5rem 0.75rem !important;
}
.fi-wi-chart .fi-section-header-heading {
    font-size: 0.85rem !important;
    font-weight: 700 !important;
}
.fi-wi-chart .fi-section-content-ctn {
    padding: 0 !important;
}
.fi-wi-chart .fi-section-content {
    padding: 0.25rem 0.75rem 0.75rem !important;
}
.fi-wi-chart-canvas-ctn {
    max-height: 280px !important;
}
.fi-wi-chart canvas {
    min-height: 240px !important;
    max-height: 280px !important;
}

/* FORMS */
.fi-input-wrp {
    border-radius: 0.625rem !important;
    border: 1px solid #d1d5db !important;
    background-color: #ffffff !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.04) !important;
    transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
}
.dark .fi-input-wrp {
    background-color: #161923 !important;
    border-color: #2d3143 !important;
}
.fi-input-wrp:focus-within {
    border-color: #6366f1 !important;
    box-shadow: 0 0 0 3px rgba(99,102,241,0.12) !important;
}
.fi-input {
    border-radius: 0.625rem !important;
    font-size: 0.9375rem !important;
    color: #111827 !important;
    background-color: transparent !important;
}
.dark .fi-input { color: #e5e7eb !important; }
.fi-input::placeholder { color: #9ca3af !important; }
.fi-fo-field-wrp > label, .fi-fo-label {
    font-size: 0.8125rem !important;
    font-weight: 600 !important;
    color: #374151 !important;
}
.dark .fi-fo-field-wrp > label, .dark .fi-fo-label { color: #9ca3af !important; }

/* BUTTONS */
.fi-btn {
    border-radius: 0.625rem !important;
    font-size: 0.875rem !important;
    font-weight: 600 !important;
    transition: background-color 0.12s ease, box-shadow 0.12s ease, transform 0.12s ease !important;
}
.fi-btn:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 8px rgba(0,0,0,0.10) !important;
}
.fi-btn:active {
    transform: scale(0.97) !important;
    box-shadow: none !important;
}

/* DROPDOWNS */
.fi-dropdown-panel {
    border-radius: 0.75rem !important;
    border: 1px solid #e5e7eb !important;
    box-shadow: 0 10px 25px rgba(0,0,0,0.10), 0 4px 8px rgba(0,0,0,0.06) !important;
    background-color: #ffffff !important;
    padding: 0.375rem !important;
}
.dark .fi-dropdown-panel {
    background-color: #161923 !important;
    border-color: #1e2028 !important;
    box-shadow: 0 20px 40px rgba(0,0,0,0.40) !important;
}
.fi-dropdown-list-item-button {
    border-radius: 0.4rem !important;
    font-size: 0.875rem !important;
    font-weight: 500 !important;
    padding: 0.5rem 0.75rem !important;
}
.fi-dropdown-list-item-button:hover { background-color: #f3f4f6 !important; }
.dark .fi-dropdown-list-item-button:hover { background-color: #1e2028 !important; }

/* MODALS */
.fi-modal-window {
    border-radius: 1.25rem !important;
    border: 1px solid #e5e7eb !important;
    box-shadow: 0 25px 60px rgba(0,0,0,0.15), 0 8px 20px rgba(0,0,0,0.08) !important;
    overflow: hidden !important;
}
.dark .fi-modal-window {
    background-color: #161923 !important;
    border-color: #1e2028 !important;
    box-shadow: 0 30px 70px rgba(0,0,0,0.55) !important;
}
.fi-modal-header {
    padding: 1.125rem 1.5rem !important;
    border-bottom: 1px solid #f3f4f6 !important;
}
.dark .fi-modal-header { border-bottom-color: #1e2028 !important; }
.fi-modal-header-heading {
    font-size: 1.0625rem !important;
    font-weight: 700 !important;
    letter-spacing: -0.015em !important;
    color: #111827 !important;
}
.dark .fi-modal-header-heading { color: #f1f5f9 !important; }
.fi-modal-content { padding: 1.5rem !important; }
.fi-modal-footer {
    padding: 1rem 1.5rem !important;
    border-top: 1px solid #f3f4f6 !important;
    background-color: #f9fafb !important;
}
.dark .fi-modal-footer {
    border-top-color: #1e2028 !important;
    background-color: #131620 !important;
}

/* BADGES */
.fi-badge {
    border-radius: 9999px !important;
    font-size: 0.6875rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.03em !important;
    padding: 0.175rem 0.6rem !important;
}

/* NOTIFICATIONS */
.fi-notifications-notification {
    border-radius: 0.875rem !important;
    border: 1px solid #e5e7eb !important;
    box-shadow: 0 10px 25px rgba(0,0,0,0.10) !important;
    background-color: #ffffff !important;
}
.dark .fi-notifications-notification {
    background-color: #161923 !important;
    border-color: #1e2028 !important;
}

/* EMPTY STATE */
.fi-ta-empty-state { padding: 4rem 2rem !important; }
.fi-ta-empty-state-heading {
    font-size: 1.0625rem !important;
    font-weight: 700 !important;
    color: #374151 !important;
}
.dark .fi-ta-empty-state-heading { color: #9ca3af !important; }

/* AUTH / LOGIN */
.fi-simple-layout {
    background-color: #f8f9fb !important;
    background-image:
        radial-gradient(ellipse 80% 50% at 70% 0%, rgba(99,102,241,0.15) 0%, transparent 60%),
        radial-gradient(ellipse 50% 40% at 0% 80%, rgba(139,92,246,0.10) 0%, transparent 60%) !important;
    min-height: 100vh !important;
}
.dark .fi-simple-layout {
    background-color: #0d0f14 !important;
    background-image:
        radial-gradient(ellipse 80% 50% at 70% 0%, rgba(99,102,241,0.22) 0%, transparent 60%),
        radial-gradient(ellipse 50% 40% at 0% 80%, rgba(139,92,246,0.14) 0%, transparent 60%) !important;
}
.fi-simple-main-ctn {
    background-color: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 1.5rem !important;
    box-shadow: 0 20px 50px rgba(0,0,0,0.10), 0 6px 16px rgba(99,102,241,0.08) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}
.dark .fi-simple-main-ctn {
    background-color: #161923 !important;
    border-color: #1e2028 !important;
    box-shadow: 0 30px 70px rgba(0,0,0,0.50) !important;
}

/* FILTERS */
.fi-ta-filters-form {
    background-color: #f9fafb !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 0.875rem !important;
    padding: 1rem !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.06) !important;
}
.dark .fi-ta-filters-form {
    background-color: #161923 !important;
    border-color: #1e2028 !important;
}


/* ════════════════════════════════════════════════════════════════
   ARABIC / RTL — Reset letter-spacing for Arabic cursive
   letter-spacing breaks Arabic script by separating joined letters.
   ════════════════════════════════════════════════════════════════ */
[dir="rtl"] .fi-sidebar-group-label,
[dir="rtl"] .fi-page-header-heading,
[dir="rtl"] .fi-page-header-subheading,
[dir="rtl"] .fi-wi-stats-overview-stat-label,
[dir="rtl"] .fi-wi-stats-overview-stat-value,
[dir="rtl"] .fi-section-header-heading,
[dir="rtl"] .fi-ta-header-cell,
[dir="rtl"] .fi-badge,
[dir="rtl"] .fi-modal-header-heading,
[dir="rtl"] .fi-fo-field-wrp > label,
[dir="rtl"] .fi-fo-label,
[dir="rtl"] .fi-dropdown-list-item-button {
    letter-spacing: normal !important;
}

.ds-wrap .ds-kpi-label,
.ds-wrap .ds-stat-label,
.ds-wrap .ds-table th,
.ds-wrap .ds-card-title,
.ds-wrap .ds-filters-label,
.ds-wrap .ds-progress-label,
.ds-wrap .ds-info-key,
.ds-wrap .ds-seg-lbl {
    letter-spacing: normal !important;
}

/* Print CSS */
@media print {
    .fi-sidebar, .fi-topbar, .fi-pagination, .fi-ta-header-toolbar, .fi-ta-actions, .fi-modal {
        display: none !important;
    }
    .fi-main {
        margin: 0 !important;
        padding: 0 !important;
    }
    body {
        background: white !important;
    }
    .fi-ta-content {
        box-shadow: none !important;
        border: none !important;
    }
}
