:root {
    --primary-50: 255 255 255;
    --primary-100: 233 222 252;
    --primary-200: 211 189 249;
    --primary-300: 190 156 246;
    --primary-400: 168 124 243;
    --primary-500: 146 91 240;
    --primary-600: 124 58 237;
    --primary-700: 104 48 203;
    --primary-800: 85 37 169;
    --primary-900: 66 26 135;
    --primary-950: 46 16 101;

    --danger-50: 255 255 255;
    --danger-100: 250 217 224;
    --danger-200: 245 180 194;
    --danger-300: 240 142 164;
    --danger-400: 235 104 133;
    --danger-500: 230 67 102;
    --danger-600: 225 29 72;
    --danger-700: 187 24 60;
    --danger-800: 150 18 47;
    --danger-900: 112 13 34;
    --danger-950: 74 8 22;

    --gray-50: 252 252 253;
    --gray-100: 242 244 248;
    --gray-200: 193 196 205;
    --gray-300: 162 167 180;
    --gray-400: 131 137 155;
    --gray-500: 100 108 130;
    --gray-600: 83 91 112;
    --gray-700: 66 74 95;
    --gray-800: 49 57 77;
    --gray-900: 32 40 60;
    --gray-950: 8 10 18;

    --warning-600: 217 119 6;

    --brand-primary: #7C3AED;
    --brand-primary-hover: #6D28D9;
    --brand-primary-dark: #5B21B6;
    --brand-navy: #0F172A;
    --brand-navy-light: #1E293B;
    --brand-lime: #84CC16;
    --brand-pink: #EC4899;
    --brand-light: #FAFAFA;
    --brand-muted: #F2F4F8;
    --brand-danger: #E11D48;

    --brand-shadow: 0 4px 20px rgba(124, 58, 237, 0.25);
    --brand-transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);

    --fi-radius: 0.75rem;
    --fi-radius-lg: 1.1rem;
    --fi-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.05);
    --fi-shadow-md: 0 8px 20px -10px rgba(15, 23, 42, 0.18);
    --fi-shadow-lg: 0 20px 45px rgba(15, 23, 42, 0.28);
}


html {
    scroll-behavior: smooth;
}

body {
    background-color: var(--brand-light) !important;
    color: rgb(var(--gray-800));
}

.fi-main-ctn {
    background:
        radial-gradient(circle at 8% -5%, rgba(124, 58, 237, 0.08) 0%, transparent 32%),
        radial-gradient(circle at 100% 0%, rgba(236, 72, 153, 0.06) 0%, transparent 28%),
        radial-gradient(circle at 50% 100%, rgba(132, 204, 22, 0.05) 0%, transparent 40%),
        linear-gradient(180deg, #ffffff 0%, var(--brand-light) 100%);
    min-height: 100vh;
}

.fi-section,
.fi-card,
.fi-modal-window,
.fi-wi-stats-overview-stat,
.fi-wi-chart {
    background-color: #ffffff !important;
    border: 1px solid rgb(var(--gray-200));
    border-radius: var(--fi-radius) !important;
    box-shadow: var(--fi-shadow-sm), var(--fi-shadow-md);
    transition: var(--brand-transition);
    position: relative;
}

.fi-section,
.fi-wi-stats-overview-stat {
    overflow: hidden;
}

.fi-section:hover,
.fi-card:hover,
.fi-wi-stats-overview-stat:hover {
    box-shadow: var(--fi-shadow-sm), 0 16px 30px -10px rgba(124, 58, 237, 0.22);
    transform: translateY(-2px);
    border-color: rgba(124, 58, 237, 0.25);
}

.fi-wi-stats-overview-stat::before,
.fi-section::before {
    content: "";
    position: absolute;
    inset-inline: 0;
    top: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--brand-lime), var(--brand-primary), var(--brand-pink));
}

.dark body {
    background-color: var(--brand-navy) !important;
    color: rgb(var(--gray-200));
}

.dark .fi-main-ctn {
    background:
        radial-gradient(circle at 0% 0%, rgba(124, 58, 237, 0.18) 0%, transparent 40%),
        radial-gradient(circle at 100% 100%, rgba(236, 72, 153, 0.08) 0%, transparent 35%),
        radial-gradient(circle at 50% 50%, rgba(132, 204, 22, 0.04) 0%, transparent 45%),
        var(--brand-navy);
}

.dark .fi-section,
.dark .fi-card,
.dark .fi-modal-window,
.dark .fi-wi-stats-overview-stat,
.dark .fi-wi-chart {
    background-color: var(--brand-navy-light) !important;
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
}

.dark .fi-section:hover,
.dark .fi-card:hover,
.dark .fi-wi-stats-overview-stat:hover {
    border-color: rgba(124, 58, 237, 0.5);
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.55), 0 0 0 1px rgba(124, 58, 237, 0.3);
}

.fi-sidebar {
    background: linear-gradient(180deg, var(--brand-navy) 0%, var(--brand-navy-light) 100%) !important;
    border-inline-end: 1px solid rgba(124, 58, 237, 0.20) !important;
    box-shadow: 4px 0 24px rgba(15, 23, 42, 0.15);
}

:root:not(.dark) .fi-sidebar {
    background: linear-gradient(180deg, #ffffff 0%, #f8f7fd 100%) !important;
    border-inline-end: 1px solid rgb(var(--gray-200)) !important;
    box-shadow: 4px 0 24px rgba(124, 58, 237, 0.06);
}

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

:root:not(.dark) .fi-sidebar-header {
    border-bottom: 1px solid rgb(var(--gray-200)) !important;
    background: linear-gradient(135deg, rgba(124, 58, 237, 0.05), rgba(236, 72, 153, 0.03)) !important;
}

.fi-sidebar-group-label {
    color: rgba(255, 255, 255, 0.45) !important;
    font-size: 0.72rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

:root:not(.dark) .fi-sidebar-group-label {
    color: rgb(var(--gray-500)) !important;
}

.fi-sidebar-item-button {
    color: rgba(255, 255, 255, 0.75) !important;
    border-radius: 0.6rem !important;
    margin: 2px 0 !important;
    position: relative;
    transition: var(--brand-transition);
}

:root:not(.dark) .fi-sidebar-item-button {
    color: rgb(var(--gray-600)) !important;
}

.fi-sidebar-item-icon {
    color: rgba(255, 255, 255, 0.55) !important;
    transition: var(--brand-transition);
}

:root:not(.dark) .fi-sidebar-item-icon {
    color: rgb(var(--gray-400)) !important;
}

.fi-sidebar-item-button:hover {
    background: rgba(124, 58, 237, 0.18) !important;
    color: #ffffff !important;
    transform: translateX(-3px);
}

:root:not(.dark) .fi-sidebar-item-button:hover {
    background: rgba(124, 58, 237, 0.08) !important;
    color: var(--brand-primary) !important;
    box-shadow: 0 1px 4px rgba(124, 58, 237, 0.1);
}

.fi-sidebar-item-button:hover .fi-sidebar-item-icon {
    color: var(--brand-lime) !important;
}

:root:not(.dark) .fi-sidebar-item-button:hover .fi-sidebar-item-icon {
    color: var(--brand-primary) !important;
}

.fi-sidebar-item-active .fi-sidebar-item-button {
    background: linear-gradient(135deg, var(--brand-primary) 0%, var(--brand-primary-dark) 100%) !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    box-shadow: var(--brand-shadow);
}

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

.fi-sidebar-item-active .fi-sidebar-item-button::before {
    content: '';
    position: absolute;
    inset-inline-start: -8px;
    top: 20%;
    height: 60%;
    width: 4px;
    border-radius: 4px;
    background: var(--brand-lime);
    box-shadow: 0 0 8px rgba(132, 204, 22, 0.7);
}

.fi-sidebar-nav::-webkit-scrollbar {
    width: 6px;
}

.fi-sidebar-nav::-webkit-scrollbar-thumb {
    background: rgba(124, 58, 237, 0.4);
    border-radius: 10px;
}

.fi-sidebar-nav::-webkit-scrollbar-track {
    background: transparent;
}

.fi-topbar > nav {
    background: rgba(255, 255, 255, 0.85) !important;
    backdrop-filter: blur(12px) saturate(160%);
    -webkit-backdrop-filter: blur(12px) saturate(160%);
    border-bottom: 1px solid rgb(var(--gray-200)) !important;
    box-shadow: 0 2px 12px rgba(15, 23, 42, 0.06) !important;
    position: relative;
}

.fi-topbar > nav::after {
    content: "";
    position: absolute;
    inset-inline: 0;
    bottom: -1px;
    height: 2px;
    background: linear-gradient(90deg, var(--brand-primary), var(--brand-pink), var(--brand-lime));
    opacity: .5;
}

.dark .fi-topbar > nav {
    background: rgba(15, 23, 42, 0.85) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.fi-topbar button:hover {
    color: var(--brand-primary) !important;
    transition: var(--brand-transition);
}

.dark .fi-topbar button:hover {
    color: var(--brand-lime) !important;
}

.fi-topbar .fi-breadcrumbs-item-label {
    color: var(--brand-navy) !important;
    font-weight: 600;
}

.dark .fi-topbar .fi-breadcrumbs-item-label {
    color: var(--brand-light) !important;
}

.fi-topbar-item,
.fi-icon-btn {
    color: rgb(var(--gray-500));
    border-radius: 999px;
    transition: var(--brand-transition);
}

.fi-topbar-item:hover,
.fi-icon-btn:hover {
    background-color: rgba(124, 58, 237, 0.1);
    color: var(--brand-primary);
    transform: scale(1.06);
}

.dark .fi-topbar-item,
.dark .fi-icon-btn {
    color: rgba(255, 255, 255, 0.7);
}

.dark .fi-topbar-item:hover,
.dark .fi-icon-btn:hover {
    background-color: rgba(255, 255, 255, 0.1);
    color: var(--brand-lime);
}

.fi-user-avatar img,
.fi-avatar {
    border: 2px solid var(--brand-primary);
    box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.14);
}

.fi-dropdown-panel {
    border-radius: var(--fi-radius) !important;
    box-shadow: var(--fi-shadow-lg) !important;
    border: 1px solid rgb(var(--gray-200));
    overflow: hidden;
}

.dark .fi-dropdown-panel {
    background-color: var(--brand-navy-light) !important;
    border-color: rgba(255, 255, 255, 0.08);
}

.fi-dropdown-list-item {
    transition: var(--brand-transition);
}

.fi-dropdown-list-item:hover {
    background-color: rgba(124, 58, 237, 0.08) !important;
    padding-inline-start: 1.1rem;
}

.dark .fi-dropdown-list-item:hover {
    background-color: rgba(255, 255, 255, 0.06) !important;
}

.fi-btn {
    border-radius: var(--fi-radius) !important;
    font-weight: 600;
    transition: var(--brand-transition);
}

.fi-btn:active {
    transform: translateY(1px) scale(.98);
}

.fi-btn:disabled,
.fi-btn[disabled] {
    opacity: .55;
    filter: grayscale(.3);
}

.fi-btn.fi-color-primary {
    background: linear-gradient(135deg, var(--brand-primary) 0%, var(--brand-primary-dark) 100%) !important;
    border: none !important;
    color: #fff !important;
    box-shadow: 0 4px 12px rgba(124, 58, 237, 0.35);
}

.fi-btn.fi-color-primary:hover {
    filter: brightness(1.1);
    box-shadow: 0 6px 18px rgba(124, 58, 237, 0.5);
    transform: translateY(-1px);
}

.fi-btn.fi-color-danger {
    background: linear-gradient(135deg, #F0436A 0%, var(--brand-danger) 60%, #9d1638 100%) !important;
    border: none !important;
    color: #fff !important;
    box-shadow: 0 4px 12px rgba(225, 29, 72, 0.35);
}

.fi-btn.fi-color-danger:hover {
    filter: brightness(1.08);
    box-shadow: 0 6px 18px rgba(225, 29, 72, 0.45);
    transform: translateY(-1px);
}

.fi-btn.fi-color-success {
    background: linear-gradient(135deg, #a3e635 0%, var(--brand-lime) 100%) !important;
    border: none !important;
    color: #1a2e05 !important;
    box-shadow: 0 4px 12px rgba(132, 204, 22, 0.35);
}

.fi-btn.fi-color-success:hover {
    filter: brightness(1.08);
    transform: translateY(-1px);
}

.fi-btn.fi-color-gray {
    background-color: rgb(var(--gray-100)) !important;
    color: rgb(var(--gray-700)) !important;
}

.fi-btn.fi-color-gray:hover {
    background-color: rgb(var(--gray-200)) !important;
}

.dark .fi-btn.fi-color-gray {
    background-color: var(--brand-navy-light) !important;
    color: var(--brand-light) !important;
}

.dark .fi-btn.fi-color-gray:hover {
    background-color: rgba(255, 255, 255, 0.1) !important;
}

.fi-btn.fi-btn-outlined.fi-color-primary {
    background: transparent !important;
    color: var(--brand-primary) !important;
    border: 1.5px solid var(--brand-primary) !important;
    box-shadow: none;
}

.fi-btn.fi-btn-outlined.fi-color-primary:hover {
    background: rgba(124, 58, 237, 0.08) !important;
}

.fi-btn.fi-btn-outlined.fi-color-danger {
    background: transparent !important;
    color: var(--brand-danger) !important;
    border: 1.5px solid var(--brand-danger) !important;
    box-shadow: none;
}

.fi-btn.fi-btn-outlined.fi-color-danger:hover {
    background: rgba(225, 29, 72, 0.08) !important;
}

.fi-badge {
    border-radius: 999px !important;
    font-weight: 700;
    font-size: .7rem;
    letter-spacing: .02em;
}

.fi-badge.fi-color-primary {
    background-color: rgba(124, 58, 237, 0.10) !important;
    color: var(--brand-primary) !important;
    box-shadow: inset 0 0 0 1px rgba(124, 58, 237, 0.18);
}

.dark .fi-badge.fi-color-primary {
    background-color: rgba(168, 124, 243, 0.18) !important;
    color: #C4B0FA !important;
    box-shadow: none;
}

.fi-badge.fi-color-danger {
    background-color: rgba(225, 29, 72, 0.08) !important;
    color: var(--brand-danger) !important;
    box-shadow: inset 0 0 0 1px rgba(225, 29, 72, 0.18);
}

.dark .fi-badge.fi-color-danger {
    background-color: rgba(225, 29, 72, 0.2) !important;
    color: #FF9AB3 !important;
    box-shadow: none;
}

.fi-badge.fi-color-success {
    background-color: rgba(132, 204, 22, 0.12) !important;
    color: #4d7c0f !important;
    box-shadow: inset 0 0 0 1px rgba(132, 204, 22, 0.2);
}

.dark .fi-badge.fi-color-success {
    background-color: rgba(132, 204, 22, 0.18) !important;
    color: var(--brand-lime) !important;
    box-shadow: none;
}

.fi-badge.fi-color-warning {
    background-color: rgba(217, 119, 6, 0.10) !important;
    color: rgb(var(--warning-600)) !important;
    box-shadow: inset 0 0 0 1px rgba(217, 119, 6, 0.18);
}

.fi-badge.fi-color-gray {
    background-color: rgb(var(--gray-100)) !important;
    color: rgb(var(--gray-600)) !important;
    box-shadow: inset 0 0 0 1px rgb(var(--gray-200));
}

.dark .fi-badge.fi-color-gray {
    background-color: rgba(255, 255, 255, 0.08) !important;
    color: rgb(var(--gray-300)) !important;
    box-shadow: none;
}

.fi-badge.fi-color-pink {
    background-color: rgba(236, 72, 153, 0.12) !important;
    color: var(--brand-pink) !important;
}

.fi-section-header {
    border-bottom: 1px solid rgb(var(--gray-200));
}

.dark .fi-section-header {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.fi-tabs-item {
    transition: var(--brand-transition);
    border-bottom: 2px solid transparent;
}

.fi-tabs-item[aria-selected="true"] {
    color: var(--brand-primary) !important;
    border-color: var(--brand-primary) !important;
    font-weight: 700;
}

.dark .fi-tabs-item[aria-selected="true"] {
    color: #C4B0FA !important;
    border-color: #C4B0FA !important;
}

.fi-wizard-header-step-icon[data-active],
.fi-wizard-header-step[data-active] .fi-wizard-header-step-icon {
    background: linear-gradient(135deg, var(--brand-primary), var(--brand-primary-dark)) !important;
    color: #fff !important;
    box-shadow: 0 0 0 5px rgba(124, 58, 237, 0.15);
}

.fi-wizard-header-step[data-completed] .fi-wizard-header-step-icon {
    background-color: var(--brand-lime) !important;
    color: #1a2e05 !important;
}

.fi-ta-header-cell {
    background: linear-gradient(180deg, #ffffff 0%, rgb(var(--gray-100)) 100%) !important;
    color: rgb(var(--gray-600));
    font-weight: 700;
    font-size: .72rem;
    letter-spacing: .03em;
    text-transform: uppercase;
    border-bottom: 2px solid rgba(124, 58, 237, 0.14) !important;
}

.dark .fi-ta-header-cell {
    background: var(--brand-navy-light) !important;
    color: rgb(var(--gray-300));
    border-bottom: 2px solid rgba(168, 124, 243, 0.18) !important;
}

.fi-ta-row {
    transition: background-color .12s ease;
}

.fi-ta-row:hover {
    background-color: rgba(124, 58, 237, 0.05) !important;
}

.dark .fi-ta-row:hover {
    background-color: rgba(168, 124, 243, 0.08) !important;
}

.fi-ta-row:nth-child(even) {
    background-color: rgba(15, 23, 42, 0.015);
}

.dark .fi-ta-row:nth-child(even) {
    background-color: rgba(255, 255, 255, 0.02);
}

.fi-ta-row[data-selected] {
    background-color: rgba(124, 58, 237, 0.08) !important;
}

.fi-ta-bulk-actions {
    background: linear-gradient(90deg, var(--brand-primary-dark), var(--brand-primary)) !important;
    color: #fff !important;
    border-radius: var(--fi-radius);
    box-shadow: var(--fi-shadow-md);
}

.fi-ta-bulk-actions .fi-btn {
    color: #fff !important;
}

.fi-ta-filters-trigger-active,
.fi-ta-filter-indicator {
    background-color: var(--brand-pink) !important;
    color: #fff !important;
}

.fi-ta-empty-state-icon {
    color: rgb(var(--gray-300));
}

.fi-pagination-item {
    border-radius: 999px !important;
    transition: var(--brand-transition);
}

.fi-pagination-item[aria-current="page"] {
    background: linear-gradient(135deg, var(--brand-primary), var(--brand-primary-dark)) !important;
    color: #fff !important;
    border-color: transparent !important;
    box-shadow: 0 3px 10px rgba(124, 58, 237, 0.4);
}

.fi-pagination-item:hover:not([aria-current="page"]) {
    border-color: var(--brand-primary) !important;
    color: var(--brand-primary) !important;
}

.fi-in-entry-wrp {
    border-bottom: 1px dashed rgb(var(--gray-200));
}

.dark .fi-in-entry-wrp {
    border-bottom: 1px dashed rgba(255, 255, 255, 0.08);
}

.fi-modal-window {
    border-radius: var(--fi-radius-lg) !important;
    box-shadow: var(--fi-shadow-lg) !important;
    border: 1px solid rgb(var(--gray-200));
}

.dark .fi-modal-window {
    border-color: rgba(255, 255, 255, 0.08);
}

.fi-modal-close-btn {
    transition: var(--brand-transition);
}

.fi-modal-close-btn:hover {
    color: var(--brand-danger) !important;
    transform: rotate(90deg);
}

.fi-modal-heading {
    font-weight: 800;
    color: var(--brand-navy);
}

.dark .fi-modal-heading {
    color: var(--brand-light);
}

.fi-slide-over-window {
    box-shadow: var(--fi-shadow-lg) !important;
}

.fi-no-notification {
    border-radius: var(--fi-radius) !important;
    box-shadow: var(--fi-shadow-lg) !important;
    border-inline-start: 4px solid rgb(var(--gray-300));
    backdrop-filter: blur(6px);
}

.fi-no-notification.fi-color-success {
    border-inline-start-color: var(--brand-lime);
}

.fi-no-notification.fi-color-danger {
    border-inline-start-color: var(--brand-danger);
}

.fi-no-notification.fi-color-warning {
    border-inline-start-color: rgb(var(--warning-600));
}

.fi-no-notification.fi-color-info,
.fi-no-notification.fi-color-primary {
    border-inline-start-color: var(--brand-primary);
}

.dark .fi-no-notification {
    background-color: rgba(30, 41, 59, 0.92) !important;
    border-color: rgba(255, 255, 255, 0.08);
}

.fi-tooltip,
[role="tooltip"] {
    background: linear-gradient(135deg, var(--brand-navy), #000) !important;
    color: #fff !important;
    border-radius: 0.5rem !important;
    box-shadow: var(--fi-shadow-md);
}

.fi-breadcrumbs-item {
    transition: var(--brand-transition);
}

.fi-breadcrumbs-item:hover {
    color: var(--brand-primary) !important;
}

.fi-breadcrumbs-item:last-child {
    color: var(--brand-primary) !important;
    font-weight: 700;
}

.dark .fi-breadcrumbs-item:last-child {
    color: #C4B0FA !important;
}

a,
.fi-link {
    color: var(--brand-primary);
    transition: var(--brand-transition);
}

a:hover,
.fi-link:hover {
    color: var(--brand-primary-dark);
}

.dark a,
.dark .fi-link {
    color: #A87CF3;
}

.dark a:hover,
.dark .fi-link:hover {
    color: #C4B0FA;
}

*:focus-visible {
    outline: 2px solid var(--brand-primary) !important;
    outline-offset: 2px;
}

::selection {
    background-color: var(--brand-primary);
    color: #ffffff;
}

::-webkit-scrollbar {
    width: 9px;
    height: 9px;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background-color: rgba(124, 58, 237, 0.35);
    border-radius: 999px;
    border: 2px solid transparent;
    background-clip: content-box;
}

.dark ::-webkit-scrollbar-thumb {
    background-color: rgba(168, 124, 243, 0.3);
}

::-webkit-scrollbar-thumb:hover {
    background-color: rgba(124, 58, 237, 0.6);
}

.fi-simple-layout {
    background:
        radial-gradient(circle at 15% 20%, rgba(236, 72, 153, 0.25) 0%, transparent 30%),
        radial-gradient(circle at 85% 85%, rgba(132, 204, 22, 0.15) 0%, transparent 35%),
        radial-gradient(circle at top, var(--brand-primary) 0%, var(--brand-navy) 60%, #000 100%) !important;
}

.fi-simple-main {
    background-color: rgba(255, 255, 255, 0.97) !important;
    backdrop-filter: blur(8px);
    border-radius: var(--fi-radius-lg);
    box-shadow: var(--fi-shadow-lg);
    border: 1px solid rgba(255, 255, 255, 0.6);
}

.dark .fi-simple-main {
    background-color: rgba(30, 41, 59, 0.92) !important;
    border-color: rgba(255, 255, 255, 0.08);
}

.fi-simple-header {
    color: var(--brand-navy);
    font-weight: 800;
}

.dark .fi-simple-header {
    color: var(--brand-light);
}

.fi-simple-layout .fi-btn.fi-color-primary {
    box-shadow: 0 8px 20px rgba(124, 58, 237, 0.5);
}

#livewire-loading-bar,
.fi-topbar [role="progressbar"] {
    background: linear-gradient(90deg, var(--brand-pink), var(--brand-primary)) !important;
    height: 3px !important;
}

.fi-wi-stats-overview-stat-value {
    color: var(--brand-navy);
    font-weight: 800;
    font-size: 1.6rem;
}

.dark .fi-wi-stats-overview-stat-value {
    color: var(--brand-light);
}

.fi-wi-stats-overview-stat-icon {
    background: linear-gradient(135deg, rgba(124, 58, 237, 0.16), rgba(236, 72, 153, 0.08));
    color: var(--brand-primary);
    border-radius: 999px;
    padding: .5rem;
    box-shadow: 0 2px 6px rgba(124, 58, 237, 0.2);
}

.dark .fi-wi-stats-overview-stat-icon {
    background: linear-gradient(135deg, rgba(168, 124, 243, 0.22), rgba(168, 124, 243, 0.08));
    color: #C4B0FA;
}

.fi-wi-stats-overview-stat-description.fi-color-success {
    color: var(--brand-lime) !important;
}

.fi-wi-stats-overview-stat-description.fi-color-danger {
    color: var(--brand-danger) !important;
}

[disabled],
.fi-disabled {
    opacity: .6;
    cursor: not-allowed;
}

kbd {
    background-color: rgb(var(--gray-100));
    border: 1px solid rgb(var(--gray-300));
    border-radius: .35rem;
    padding: .1rem .4rem;
    font-size: .75rem;
    box-shadow: 0 1px 0 rgb(var(--gray-300));
}

.dark kbd {
    background-color: var(--brand-navy-light);
    border-color: rgba(255, 255, 255, 0.15);
    color: var(--brand-light);
}

code,
pre {
    background-color: rgb(var(--gray-100)) !important;
    border-radius: .4rem;
    color: var(--brand-primary-dark);
}

.dark code,
.dark pre {
    background-color: var(--brand-navy-light) !important;
    color: #C4B0FA;
}

@media print {
    .fi-sidebar,
    .fi-topbar {
        display: none !important;
    }

    .fi-main-ctn {
        background: #fff !important;
    }
}


/* بازگرداندن پس‌زمینه استاندارد به دراپ‌دان‌ها و تقویم فیلامنت */
.fi-dropdown-panel,
.fi-fo-date-time-picker-panel,
[wire\:key*="date-time-picker"] .fi-dropdown-panel {
    background-color: #ffffff !important;
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.15), 0 8px 10px -6px rgba(0, 0, 0, 0.1) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

.dark .fi-dropdown-panel,
.dark .fi-fo-date-time-picker-panel,
.dark [wire\:key*="date-time-picker"] .fi-dropdown-panel {
    background-color: var(--brand-navy-light, #1E293B) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.5) !important;
}