/* ─── Layout & backgrounds ─────────────────────────────────────── */
.fi-body {
    background: #f1f5f9;
}

.fi-main {
    background: #f1f5f9;
}

/* ─── Sidebar ────────────────────────────────────────────────────── */
.fi-sidebar {
    background: #ffffff !important;
    border-right: 1px solid #e2e8f0 !important;
    box-shadow: 2px 0 12px rgba(15, 23, 42, 0.04) !important;
}

.fi-sidebar-header {
    border-bottom: 1px solid #f1f5f9;
    padding: 1.25rem 1rem;
}

.fi-sidebar-item-button {
    border-radius: 10px !important;
    margin: 1px 0;
    transition: all 0.15s ease;
}

.fi-sidebar-item-button:hover {
    background: #eff6ff !important;
}

.fi-active .fi-sidebar-item-button,
.fi-sidebar-item-active .fi-sidebar-item-button {
    background: #dbeafe !important;
    color: #1d4ed8 !important;
    font-weight: 600;
}

.fi-active .fi-sidebar-item-label,
.fi-sidebar-item-active .fi-sidebar-item-label {
    color: #1d4ed8 !important;
}

.fi-active .fi-sidebar-item-icon,
.fi-sidebar-item-active .fi-sidebar-item-icon {
    color: #2563eb !important;
}

.fi-sidebar-group-label {
    color: #94a3b8 !important;
    font-size: 0.65rem !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
}

/* ─── Top bar ────────────────────────────────────────────────────── */
.fi-topbar,
.fi-topbar nav,
.fi-topbar header,
header.fi-topbar,
nav.fi-topbar,
[class*="fi-topbar"] {
    background: #ffffff !important;
    border-bottom: 1px solid #e2e8f0 !important;
    box-shadow: 0 1px 4px rgba(15, 23, 42, 0.04) !important;
    color: #1e293b !important;
}

/* Topbar icons and text */
.fi-topbar .fi-icon-btn,
.fi-topbar button,
.fi-topbar a {
    color: #475569 !important;
}

.fi-topbar .fi-icon-btn:hover,
.fi-topbar button:hover {
    background: #f1f5f9 !important;
    color: #1e293b !important;
}

/* Breadcrumbs in header */
.fi-breadcrumbs,
.fi-breadcrumbs li,
.fi-breadcrumbs a,
.fi-breadcrumbs span {
    color: #64748b !important;
}

/* User avatar / account menu in topbar */
.fi-topbar .fi-avatar {
    ring-color: #e2e8f0 !important;
}

/* ─── Page header ────────────────────────────────────────────────── */
.fi-page-header {
    background: transparent;
}

.fi-page-heading {
    font-size: 1.35rem !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    letter-spacing: -0.02em;
}

/* ─── Cards / Sections ───────────────────────────────────────────── */
.fi-section,
.fi-card {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 14px !important;
    box-shadow: 0 1px 4px rgba(15, 23, 42, 0.05) !important;
}

.fi-section-header {
    border-bottom: 1px solid #f1f5f9 !important;
}

.fi-section-header-heading {
    font-weight: 600 !important;
    color: #1e293b !important;
}

/* ─── Stat cards ─────────────────────────────────────────────────── */
.fi-wi-stats-overview-stat {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 14px !important;
    box-shadow: 0 1px 4px rgba(15, 23, 42, 0.05) !important;
    padding: 1.25rem !important;
}

.fi-wi-stats-overview-stat-label {
    color: #64748b !important;
    font-size: 0.8rem !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
}

.fi-wi-stats-overview-stat-value {
    color: #0f172a !important;
    font-size: 2rem !important;
    font-weight: 700 !important;
    letter-spacing: -0.03em !important;
}

.fi-wi-stats-overview-stat-description {
    color: #64748b !important;
    font-size: 0.8rem !important;
}

/* ─── Tables ─────────────────────────────────────────────────────── */
.fi-ta-table {
    background: #ffffff !important;
    border-radius: 14px !important;
    border: 1px solid #e2e8f0 !important;
    overflow: hidden;
}

.fi-ta-header-row th {
    background: #f8fafc !important;
    color: #64748b !important;
    font-size: 0.72rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.07em !important;
    border-bottom: 1px solid #e2e8f0 !important;
}

.fi-ta-row {
    border-bottom: 1px solid #f1f5f9 !important;
    transition: background 0.1s ease;
}

.fi-ta-row:hover td {
    background: #f8fafc !important;
}

.fi-ta-row:last-child {
    border-bottom: none !important;
}

/* ─── Buttons ────────────────────────────────────────────────────── */
.fi-btn {
    border-radius: 9px !important;
    font-weight: 600 !important;
    transition: all 0.15s ease !important;
}

.fi-btn-color-primary {
    box-shadow: 0 2px 8px rgba(37, 99, 235, 0.25) !important;
}

.fi-btn-color-primary:hover {
    box-shadow: 0 4px 14px rgba(37, 99, 235, 0.35) !important;
    transform: translateY(-1px);
}

/* ─── Form inputs ────────────────────────────────────────────────── */
.fi-input,
.fi-select-input,
.fi-textarea {
    border-radius: 9px !important;
    border-color: #e2e8f0 !important;
    background: #f8fafc !important;
    transition: all 0.15s ease;
}

.fi-input:focus,
.fi-select-input:focus,
.fi-textarea:focus {
    background: #ffffff !important;
    border-color: #93c5fd !important;
    box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.3) !important;
}

/* ─── Badges ─────────────────────────────────────────────────────── */
.fi-badge {
    border-radius: 6px !important;
    font-weight: 600 !important;
    font-size: 0.7rem !important;
    letter-spacing: 0.03em !important;
}

/* ─── Widget containers ──────────────────────────────────────────── */
.fi-wi-chart,
.fi-wi-table {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 14px !important;
    box-shadow: 0 1px 4px rgba(15, 23, 42, 0.05) !important;
}

/* ─── Login page logo ────────────────────────────────────────────── */
.fi-simple-layout .fi-logo img,
.fi-simple-layout .fi-brand-logo,
.fi-simple-header .fi-logo img,
.fi-simple-header img[alt] {
    height: 3.92rem !important;
    width: auto !important;
}

/* ─── Scrollbar ──────────────────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 99px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }