/*
 * POS theme: solid navy sidebar, flat light canvas, white cards with small (4px) corners.
 * No gradients or glows; the store brand colour is used only for small accents (active bar, hero KPI, buttons).
 */

:root {
    --pt-nav-1: #0b1530;
    --pt-nav-2: #10204a;
    --pt-nav-text: rgba(226, 232, 240, .78);
    --pt-nav-muted: rgba(148, 163, 184, .62);
    --pt-nav-line: rgba(255, 255, 255, .07);
    --pt-nav-active: #1c2a4d;
    --pt-canvas: #f2f5fa;
    --pt-card-border: #e3e8f0;
    --pt-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 2px 6px -2px rgba(16, 24, 40, .06);
    --pt-shadow-hover: 0 6px 18px -8px rgba(16, 24, 40, .22);
}

/* ── Canvas ─────────────────────────────────────────────────────────────── */
.fi-body { background: var(--pt-canvas) !important; }
.dark .fi-body { background: rgb(9 9 11) !important; }

/* ── Sidebar ────────────────────────────────────────────────────────────── */
.fi-sidebar, .fi-sidebar.fi-sidebar-open { background: var(--pt-nav-1) !important; }
.fi-sidebar-header {
    position: relative;
    background: transparent !important;
    box-shadow: none !important;
    --tw-ring-color: transparent !important;
    border-bottom: 1px solid var(--pt-nav-line);
}
.fi-sidebar-header .fi-logo { color: #fff !important; letter-spacing: -.01em; }
.fi-sidebar-header button, .fi-sidebar-header .fi-icon-btn { color: rgba(226, 232, 240, .7) !important; }
.fi-sidebar-header button:hover, .fi-sidebar-header .fi-icon-btn:hover { background: rgba(255, 255, 255, .08) !important; color: #fff !important; }

.fi-sidebar-nav { position: relative; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.15) transparent; }
.fi-sidebar-nav::-webkit-scrollbar { width: 6px; }
.fi-sidebar-nav::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, .14); border-radius: 3px; }

.fi-sidebar-group-label {
    font-size: 11px !important; font-weight: 600 !important; letter-spacing: .08em; text-transform: uppercase;
    color: var(--pt-nav-muted) !important;
}
.fi-sidebar-group-button { padding-top: .25rem !important; padding-bottom: .25rem !important; }
.fi-sidebar-group-button:hover .fi-sidebar-group-label { color: rgba(226, 232, 240, .9) !important; }
.fi-sidebar-group-icon, .fi-sidebar-group-collapse-button, .fi-sidebar-group-collapse-button svg { color: var(--pt-nav-muted) !important; }
.fi-sidebar-group-collapse-button:hover { background: rgba(255, 255, 255, .06) !important; }

.fi-sidebar-item-button { border-radius: 0 !important; padding-top: .45rem !important; padding-bottom: .45rem !important; transition: background-color .15s, color .15s !important; }
.fi-sidebar-item-button:hover, .fi-sidebar-item-button:focus-visible { background: rgba(255, 255, 255, .06) !important; }
.fi-sidebar-item-icon { color: rgba(148, 163, 184, .85) !important; width: 1.25rem !important; height: 1.25rem !important; }
.fi-sidebar-item-label { color: var(--pt-nav-text) !important; font-weight: 500 !important; }
.fi-sidebar-item-button:hover .fi-sidebar-item-label { color: #fff !important; }
.fi-sidebar-item-button:hover .fi-sidebar-item-icon { color: rgba(226, 232, 240, .95) !important; }

.fi-sidebar-item-active .fi-sidebar-item-button {
    background: var(--pt-nav-active) !important;
    box-shadow: inset 3px 0 0 rgb(var(--primary-500));
}
.fi-sidebar-item-active .fi-sidebar-item-label { color: #fff !important; font-weight: 600 !important; }
.fi-sidebar-item-active .fi-sidebar-item-icon { color: #fff !important; }
.fi-sidebar-item-grouped-border div { background: rgba(255, 255, 255, .14) !important; }
.fi-sidebar-item-active .fi-sidebar-item-grouped-border .rounded-full { background: rgb(var(--primary-300)) !important; }

/* store card at the bottom of the menu */
.pt-side-foot { margin: 8px 12px 14px; padding: 10px 12px; border-radius: 0; background: rgba(255, 255, 255, .05); border: 1px solid var(--pt-nav-line); display: flex; align-items: center; gap: 10px; color: var(--pt-nav-text); text-decoration: none; }
.pt-side-foot:hover { background: rgba(255, 255, 255, .08); }
.pt-side-foot .pt-dot { width: 30px; height: 30px; flex: none; border-radius: 2px; display: grid; place-items: center; font-size: 12px; font-weight: 700; color: #fff; background: rgb(var(--primary-600)); }
.pt-side-foot .pt-name { font-size: 13px; font-weight: 600; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pt-side-foot .pt-sub { display: block; font-size: 11px; color: var(--pt-nav-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pt-side-foot .pt-switch { margin-left: auto; width: 16px; height: 16px; color: var(--pt-nav-muted); flex: none; }

/* ── Top bar ────────────────────────────────────────────────────────────── */
.fi-topbar > nav {
    background: rgba(255, 255, 255, .82) !important;
    backdrop-filter: saturate(160%) blur(10px);
    -webkit-backdrop-filter: saturate(160%) blur(10px);
    box-shadow: 0 1px 0 rgba(15, 23, 42, .06) !important;
    --tw-ring-color: transparent !important;
}
.dark .fi-topbar > nav { background: rgba(24, 24, 27, .82) !important; }

/* ── Page header ────────────────────────────────────────────────────────── */
.fi-header-heading { letter-spacing: -.02em; font-weight: 700 !important; }
.fi-header-subheading { color: rgb(100 116 139) !important; }

/* ── Cards, tables, forms ───────────────────────────────────────────────── */
.fi-section, .fi-ta-ctn, .fi-wi-stats-overview-stat, .fi-fo-tabs, .fi-in-tabs {
    border-radius: 4px !important;
    box-shadow: var(--pt-shadow) !important;
    --tw-ring-color: var(--pt-card-border) !important;
}
.dark .fi-section, .dark .fi-ta-ctn { --tw-ring-color: rgba(255, 255, 255, .08) !important; }
.fi-section-header { border-color: #eef1f6 !important; }
.fi-ta-header-cell { background: #f8fafc; }
.dark .fi-ta-header-cell { background: rgba(255, 255, 255, .02); }
.fi-ta-header-cell-label, .fi-ta-header-cell button span { font-size: 12px !important; font-weight: 600 !important; color: rgb(71 85 105) !important; letter-spacing: .01em; }
.fi-ta-row:hover > td { background: rgba(var(--primary-50), .55); }
.dark .fi-ta-row:hover > td { background: rgba(255, 255, 255, .02); }
.fi-input-wrp { border-radius: 4px !important; }
.fi-btn { border-radius: 4px !important; }
.fi-btn.fi-color-primary:not(.fi-btn-outlined) { box-shadow: none; }
.fi-modal-window, .fi-dropdown-panel { border-radius: 6px !important; }
.fi-tabs { border-radius: 4px !important; box-shadow: var(--pt-shadow) !important; }
.fi-tabs-item-active { box-shadow: 0 1px 2px rgba(16, 24, 40, .08); }

/* ── Dashboard filter bar ───────────────────────────────────────────────── */
.fi-dashboard-page form .fi-section { background: rgba(255, 255, 255, .78); backdrop-filter: blur(6px); }

/* ── Login / simple pages ───────────────────────────────────────────────── */
.fi-simple-layout { background: var(--pt-canvas) !important; }
.fi-simple-main { border-radius: 4px !important; box-shadow: 0 1px 3px rgba(15, 23, 42, .08), 0 8px 24px -16px rgba(15, 23, 42, .25) !important; }

@media print {
    .fi-body, .fi-simple-layout { background: #fff !important; }
}