/*
 * Finasheet look for both Filament panels: navy sidebar, light workspace, quiet cards.
 * Plain CSS loaded after Filament's own stylesheet (no Node build needed on the server).
 */
:root {
    --fs-navy: #0d1b34;
    --fs-navy-raised: #15284a;
    --fs-navy-line: rgba(255, 255, 255, .08);
    --fs-navy-text: #c9d3e5;
    --fs-navy-muted: #7d8aa5;
    --fs-active: #2563eb;
    --fs-bg: #f4f6fa;
    --fs-card: #ffffff;
    --fs-line: #e5e9f0;
    --fs-ink: #0f172a;
    --fs-ink-2: #475569;
    --fs-ink-3: #64748b;
    --fs-blue: #2563eb;
    --fs-good: #15803d;
    --fs-warn: #c2410c;
    --fs-bad: #b91c1c;
}

/* ---- Density ---------------------------------------------------------------- */
/* Filament sizes everything in rem, so a smaller root zooms the whole UI out on desktop.
   Phones keep 16px so inputs stay readable and iOS doesn't zoom into them. */
@media (min-width: 1024px) { html { font-size: 14px; } }

.fi-page-header-main-ctn { row-gap: calc(var(--spacing) * 4) !important; padding-block: calc(var(--spacing) * 5) calc(var(--spacing) * 4) !important; }
.fi-page-main { gap: calc(var(--spacing) * 4) !important; }
.fi-page-content { row-gap: calc(var(--spacing) * 4) !important; }
.fi-sc-has-gap { gap: calc(var(--spacing) * 4) !important; }
.fi-fo-field { row-gap: calc(var(--spacing) * 1.5) !important; }
.fi-section-header { padding-inline: calc(var(--spacing) * 4) !important; padding-block: calc(var(--spacing) * 3) !important; }
.fi-section:not(.fi-section-not-contained):not(.fi-divided) > .fi-section-content-ctn > .fi-section-content,
.fi-section:not(.fi-section-not-contained).fi-divided > .fi-section-content-ctn > .fi-section-content > * { padding: calc(var(--spacing) * 4) !important; }
.fi-section:not(.fi-section-not-contained) > .fi-section-content-ctn > .fi-section-footer { padding-inline: calc(var(--spacing) * 4) !important; padding-block: calc(var(--spacing) * 3) !important; }
.fi-ta-text:not(.fi-inline), .fi-ta-text-input:not(.fi-inline) { padding-block: calc(var(--spacing) * 2.5) !important; }
.fi-ta-header { padding-block: calc(var(--spacing) * 3) !important; }
.fi-wi-stats-overview-stat { padding: calc(var(--spacing) * 4) !important; }
.fi-fo-repeater-item-header { padding-block: calc(var(--spacing) * 2) !important; }
.fi-sidebar-nav { padding-block: calc(var(--spacing) * 3) !important; padding-inline: calc(var(--spacing) * 4) !important; row-gap: calc(var(--spacing) * 2) !important; }
.fi-sidebar-nav-groups { row-gap: calc(var(--spacing) * 2) !important; }
.fi-sidebar-group { row-gap: 0 !important; }
.fi-sidebar-group-items { row-gap: 1px !important; }
.fi-sidebar-group-btn { padding-block: 4px !important; }
.fi-sidebar-item-btn { padding-block: 6px !important; }
.fi-sidebar-header { padding-block: 8px !important; }

/* ---- Layout ---------------------------------------------------------------- */
/* Always reserve the scrollbar's width so short and long pages line up (no sideways jump). */
html { scrollbar-gutter: stable; }
.fi-body { background: var(--fs-bg) !important; }
.fi-topbar { background: #fff !important; box-shadow: 0 1px 0 var(--fs-line) !important; }

.fi-sidebar,
.fi-sidebar-header,
.fi-sidebar-header-ctn { background: var(--fs-navy) !important; box-shadow: none !important; }
.fi-sidebar { border-inline-end: 0 !important; }
.fi-sidebar-header { border-bottom: 1px solid var(--fs-navy-line) !important; }
.fi-sidebar-nav { padding-top: 12px; }

.fi-sidebar .fi-sidebar-item-btn { border-radius: 8px !important; }
.fi-sidebar .fi-sidebar-item-label,
.fi-sidebar .fi-sidebar-item-icon { color: var(--fs-navy-text) !important; }
.fi-sidebar .fi-sidebar-item-btn:hover { background: rgba(255, 255, 255, .06) !important; }
.fi-sidebar .fi-sidebar-item.fi-active > .fi-sidebar-item-btn { background: var(--fs-active) !important; }
.fi-sidebar .fi-sidebar-item.fi-active .fi-sidebar-item-label,
.fi-sidebar .fi-sidebar-item.fi-active .fi-sidebar-item-icon { color: #fff !important; }
.fi-sidebar .fi-sidebar-group-label { color: var(--fs-navy-muted) !important; font-size: 11px !important; letter-spacing: .07em; text-transform: uppercase; }
.fi-sidebar .fi-sidebar-group-collapse-btn,
.fi-sidebar .fi-sidebar-group-btn svg { color: var(--fs-navy-muted) !important; }
.fi-sidebar .fi-sidebar-item-grouped-border-part { background: var(--fs-navy-line) !important; }
.fi-sidebar .fi-sidebar-item-badge-ctn .fi-badge { background: rgba(255, 255, 255, .12) !important; color: #fff !important; box-shadow: none !important; }

/* Thin dark scrollbar inside the navy sidebar */
.fi-sidebar-nav, .fi-sidebar { scrollbar-width: none; scrollbar-color: rgba(255, 255, 255, .18) transparent; }
.fi-sidebar-nav:hover { scrollbar-width: thin; }
.fi-sidebar-nav::-webkit-scrollbar, .fi-sidebar::-webkit-scrollbar { width: 6px; }
.fi-sidebar-nav::-webkit-scrollbar-thumb, .fi-sidebar::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, .18); border-radius: 6px; }
.fi-sidebar-nav::-webkit-scrollbar-track, .fi-sidebar::-webkit-scrollbar-track { background: transparent; }
.fi-sidebar-nav::-webkit-scrollbar-button { display: none; height: 0; }

/* Desktop: the logo block in the top bar continues the navy sidebar, so the sidebar reads full height */
@media (min-width: 1024px) {
    .fi-topbar { padding-block: 0 !important; }
    .fi-topbar-start {
        background: var(--fs-navy);
        align-self: stretch;
        width: var(--sidebar-width, 20rem);
        box-sizing: border-box;
        margin-inline-start: -16px;
        padding-inline: 24px;
        display: flex;
        align-items: center;
        margin-block-end: -1px; /* cover the top bar's bottom rule so the navy is continuous */
    }
    .fi-topbar-start .fs-logo .fs-logo-navy { display: none; }
    .fi-topbar-start .fs-logo .fs-logo-white { display: block; }
    .fi-topbar-start .fs-logo-tag { color: var(--fs-navy-text); }
}

/* Company switcher in the sidebar */
.fi-sidebar .fi-tenant-menu-trigger { background: var(--fs-navy-raised) !important; border: 1px solid var(--fs-navy-line); border-radius: 10px !important; }
.fi-sidebar .fi-tenant-menu-trigger:hover { background: #1b3159 !important; }
.fi-sidebar .fi-tenant-menu-trigger-tenant-name { color: #fff !important; }
.fi-sidebar .fi-tenant-menu-trigger-current-tenant-label { color: var(--fs-navy-muted) !important; }
.fi-sidebar .fi-tenant-menu-trigger svg { color: var(--fs-navy-muted) !important; }

/* Sidebar footer (Powered by / copyright) */
.fi-sidebar-footer { border-top: 1px solid var(--fs-navy-line); }
.fs-sidebar-footer { color: var(--fs-navy-muted) !important; }
.fs-sidebar-footer b { color: var(--fs-navy-text); }

/* ---- Logo: navy on light pages, white inside the navy sidebar ---------------- */
.fs-logo { display: inline-flex; flex-direction: column; line-height: 1; gap: 3px; }
.fs-logo img { height: 28px; width: auto; }
.fs-logo .fs-logo-white { display: none; }
.fs-logo-tag { font-size: 12px; font-weight: 500; color: var(--fs-ink-3); letter-spacing: .02em; }
.fi-sidebar .fs-logo .fs-logo-navy { display: none; }
.fi-sidebar .fs-logo .fs-logo-white { display: block; }
.fi-sidebar .fs-logo-tag { color: var(--fs-navy-text); }

/* ---- Page header & cards ---------------------------------------------------- */
.fi-header-heading { font-size: 1.6rem !important; letter-spacing: -.01em; }
.fi-header-subheading { color: var(--fs-ink-3) !important; }
.fi-section:not(.fi-section-not-contained),
.fi-wi-stats-overview-stat,
.fi-ta-ctn,
.fi-fo-repeater-item,
.fi-fo-table-repeater > table,
.fi-wi-chart .fi-section { border-radius: 10px !important; box-shadow: none !important; border: 1px solid var(--fs-line) !important; background: var(--fs-card); }
.fi-ta-ctn { overflow: hidden; }

/* Section headings match the custom panels; chart cards fill their row */
.fi-section-header-heading { font-size: 15px !important; font-weight: 700 !important; color: var(--fs-ink) !important; }
.fi-section-header-description { color: var(--fs-ink-3) !important; }
.fi-wi-chart .fi-section-content-ctn { border-top: 0 !important; }
.fi-wi-chart .fi-section-header { padding-bottom: 0 !important; }
.fi-wi-chart, .fi-wi-chart > .fi-section { height: 100%; }

/* ---- Environment pill in the top bar --------------------------------------- */
.fs-env { display: inline-flex; align-items: center; gap: 8px; margin-inline-end: 12px; white-space: nowrap; }
.fs-env-pill { background: #fff1d6; color: #8a4b00; border: 1px solid #f6d9a3; border-radius: 999px; padding: 3px 10px; font-size: 12px; font-weight: 600; }
.fs-env-note { font-size: 12px; color: var(--fs-ink-3); }
@media (max-width: 900px) { .fs-env-note { display: none; } }

/* ---- Bottom strip ----------------------------------------------------------- */
.fs-strip { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 4px 4px 16px; font-size: 12px; color: var(--fs-ink-3); }

/* ---- Overview widgets ------------------------------------------------------- */
.fs-panel { background: var(--fs-card); border: 1px solid var(--fs-line); border-radius: 10px; }
.fs-panel-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; padding: 12px 16px 8px; }
.fs-panel-title { font-size: 15px; font-weight: 700; color: var(--fs-ink); display: flex; align-items: center; gap: 8px; }
.fs-panel-sub { font-size: 13px; color: var(--fs-ink-3); margin-top: 2px; }
.fs-link { color: var(--fs-blue); font-weight: 600; font-size: 14px; display: inline-flex; align-items: center; gap: 6px; text-decoration: none; white-space: nowrap; }
.fs-link:hover { text-decoration: underline; }
.fs-link svg { width: 16px; height: 16px; }
.fs-count { background: #fde8e8; color: var(--fs-bad); border-radius: 999px; font-size: 12px; font-weight: 700; padding: 1px 8px; }

.fs-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.fs-kpi { display: flex; gap: 12px; padding: 16px; min-width: 0; container-type: inline-size; text-decoration: none; color: inherit; background: var(--fs-card); border: 1px solid var(--fs-line); border-radius: 10px; box-shadow: 0 1px 2px rgba(15, 23, 42, .04); transition: border-color .15s, box-shadow .15s; }
a.fs-kpi:hover { border-color: #cbd5e1; box-shadow: 0 4px 12px rgba(15, 23, 42, .06); }
.fs-kpi-label { font-size: 14px; color: var(--fs-ink-2); }
.fs-kpi-value { white-space: nowrap; font-size: clamp(16px, 9cqi, 24px); font-weight: 800; color: var(--fs-ink); line-height: 1.15; letter-spacing: -.01em; }
.fs-kpi-sub { font-size: 13px; color: var(--fs-ink-3); }
.fs-kpi > span:last-child { min-width: 0; }
.fs-kpi-cur { font-size: .5em; font-weight: 600; color: var(--fs-ink-3); margin-inline-end: 4px; letter-spacing: .02em; }
.fs-kpi-sub.bad { color: var(--fs-bad); }
@media (max-width: 1100px) { .fs-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .fs-kpis { grid-template-columns: 1fr; gap: 12px; } }

.fs-tile { width: 36px; height: 36px; flex: none; border-radius: 10px; display: grid; place-items: center; }
.fs-tile svg { width: 18px; height: 18px; }
.fs-tile.blue { background: #e8f0fd; color: var(--fs-blue); }
.fs-tile.green { background: #e6f6ec; color: var(--fs-good); }
.fs-tile.amber { background: #fff2dd; color: #c26a00; }
.fs-tile.red { background: #fde8e8; color: var(--fs-bad); }

.fs-rows { padding: 0 16px 4px; }
.fs-row { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto auto; align-items: center; gap: 12px; padding: 9px 0; border-top: 1px solid var(--fs-line); }
.fs-row-title { font-weight: 600; color: var(--fs-ink); }
.fs-row-sub { font-size: 13px; color: var(--fs-ink-3); }
.fs-state { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; white-space: nowrap; }
.fs-state::before { content: ""; width: 8px; height: 8px; border-radius: 999px; background: currentColor; }
.fs-state.bad { color: var(--fs-bad); }
.fs-state.warn { color: var(--fs-warn); }
.fs-state.good { color: var(--fs-good); }
.fs-state.muted { color: var(--fs-ink-3); }
.fs-empty { padding: 18px 16px; color: var(--fs-ink-3); display: flex; align-items: center; gap: 10px; border-top: 1px solid var(--fs-line); }
.fs-empty svg { width: 22px; height: 22px; color: var(--fs-good); }

.fs-kv { padding: 0 16px 10px; }
.fs-kv-row { display: grid; grid-template-columns: 1fr auto; gap: 12px; padding: 8px 0; border-top: 1px solid var(--fs-line); font-size: 13px; color: var(--fs-ink); }

.fs-tabs { display: flex; gap: 18px; padding: 0 16px; border-bottom: 1px solid var(--fs-line); }
.fs-tab { padding: 8px 4px 10px; font-size: 14px; color: var(--fs-ink-2); border-bottom: 2px solid transparent; cursor: pointer; background: none; border-top: 0; border-inline: 0; font-family: inherit; }
.fs-tab.on { color: var(--fs-blue); border-bottom-color: var(--fs-blue); font-weight: 600; }
.fs-doc-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.fs-doc-table th { text-align: left; font-size: 12.5px; font-weight: 600; color: var(--fs-ink-2); padding: 8px 16px; background: #f8fafc; border-bottom: 1px solid var(--fs-line); }
.fs-doc-table td { padding: 8px 16px; border-bottom: 1px solid var(--fs-line); color: var(--fs-ink); vertical-align: middle; }
.fs-doc-table tbody tr { cursor: pointer; }
.fs-doc-table tbody tr:hover td { background: #f8fafc; }
.fs-doc-table .num { text-align: right; font-variant-numeric: tabular-nums; }
.fs-doc-num { font-weight: 600; }
.fs-doc-meta { font-size: 12.5px; color: var(--fs-ink-3); }
.fs-ico-state { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.fs-ico-state svg { width: 18px; height: 18px; }
.fs-ico-state.good { color: var(--fs-good); }
.fs-ico-state.warn { color: var(--fs-warn); }
.fs-ico-state.bad { color: var(--fs-bad); }
.fs-ico-state.muted { color: var(--fs-ink-3); }
.fs-chev { width: 18px; height: 18px; color: var(--fs-ink-3); }

/* ---- Invoice editor ------------------------------------------------------------ */
.fs-party { margin-top: 2px; font-size: 13px; line-height: 1.55; color: var(--fs-ink-2); }
.fs-party div:first-child { color: var(--fs-ink); }
.fs-party-empty { font-size: 13px; color: var(--fs-ink-3); }

/* Line table: scrolls sideways rather than squeezing the inputs */
.fs-lines .fi-fo-table-repeater { overflow-x: auto; }
@media (min-width: 1024px) { .fs-lines .fi-fo-table-repeater > table { table-layout: fixed; min-width: 860px; } }
.fs-lines .fi-fo-table-repeater > table > tbody > tr > td { padding: 6px !important; vertical-align: top; }
.fs-lines .fi-fo-table-repeater > table > thead > tr > th.fi-fo-table-repeater-empty-header-cell { width: 44px; }
.fs-lines .fi-fo-table-repeater > table > thead > tr > th { font-size: 12px !important; color: var(--fs-ink-2) !important; padding-block: 6px !important; }
.fs-cell-stack > .fi-sc, .fs-cell-stack .fi-sc { gap: 4px !important; }
.fs-cell-num { display: block; text-align: right; padding: 7px 4px 0; font-variant-numeric: tabular-nums; white-space: nowrap; color: var(--fs-ink-2); }
.fs-cell-strong { color: var(--fs-ink); font-weight: 600; }

.fs-sum-meta { font-size: 12px; color: var(--fs-ink-3); margin-bottom: 10px; }
.fs-sum { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.fs-sum-item { padding: 2px 16px; min-width: 0; }
.fs-sum-item:first-child { padding-inline-start: 0; }
.fs-sum-item + .fs-sum-item { border-inline-start: 1px solid var(--fs-line); }
.fs-sum-label { font-size: 12.5px; color: var(--fs-ink-2); }
.fs-sum-value { font-size: 22px; font-weight: 700; color: var(--fs-ink); font-variant-numeric: tabular-nums; letter-spacing: -.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fs-sum-due .fs-sum-value { color: var(--fs-blue); }
@media (max-width: 760px) {
    .fs-sum { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 12px; }
    .fs-sum-item:nth-child(3) { border-inline-start: 0; padding-inline-start: 0; }
}

/* ---- List pages (.fs-list-page) ------------------------------------------------ */
/* Desktop: the table toolbar (search, filters, more, New) lifts into the title row, so the table card starts with its column headings. */
.fs-list-page { position: relative; }
.fs-list-page .fi-ta-ctn { position: static !important; }
@media (min-width: 1024px) {
    .fs-list-page .fi-ta-header-toolbar {
        position: absolute; top: calc(var(--spacing) * 5); inset-inline-end: 0;
        flex-direction: row-reverse; gap: 8px; padding: 0 !important; border: 0 !important; background: transparent;
    }
    .fs-list-page .fi-ta-header-toolbar > * { column-gap: 8px; }
    .fs-list-page .fi-ta-search-field { width: 16rem; }
    .fs-list-page .fi-header { min-height: calc(var(--spacing) * 10); }
}
.fs-list-page .fi-ta-header-toolbar .fi-input-wrp,
.fs-list-page .fi-ta-header-toolbar .fi-btn.fi-color-gray { background: #fff; }
.fs-list-page .fi-ta-cell:first-child { padding-inline-start: 12px !important; }
.fs-list-page .fi-ta-header-cell { font-size: 12.5px !important; color: var(--fs-ink-2) !important; white-space: nowrap; }
.fs-list-page .fi-ta-text:not(.fi-inline) { padding-inline: 8px !important; }
.fs-list-page .fi-ta-header-cell { padding-inline: 8px !important; }

/* Filters panel: section labels, pill choices */
.fi-ta-filters-dropdown .fi-dropdown-panel { border-radius: 12px !important; }
.fi-ta-filters { padding: 14px 16px !important; }
.fs-pills .fi-fo-toggle-buttons-btn-ctn { display: contents; }
/* Active filters show as removable chips above the table, so the trigger's count badge (which also shows 0) is dropped */
.fi-ta-filters-dropdown .fi-btn-badge-ctn { display: none; }
.fs-pills { display: flex !important; flex-wrap: wrap; gap: 6px !important; }
.fs-pills .fi-btn { border-radius: 999px !important; padding: 4px 12px !important; font-weight: 500 !important; box-shadow: none !important; border: 1px solid var(--fs-line) !important; background: #fff !important; color: var(--fs-ink-2) !important; }
.fs-pills .fi-btn[aria-pressed="true"] { background: var(--fs-navy) !important; border-color: var(--fs-navy) !important; color: #fff !important; }

/* ---- Customer / supplier form ----------------------------------------------------- */
.fs-relationship { align-items: end; }
.fs-relationship-note { font-size: 13px; color: var(--fs-ink-3); font-style: italic; padding-bottom: 8px; }
/* Segmented control for grouped toggle buttons (relationship switch) */
.fi-fo-toggle-buttons.fi-grouped .fi-btn[aria-pressed="true"],
.fi-fo-toggle-buttons-grouped .fi-btn[aria-pressed="true"] { background: var(--fs-blue) !important; color: #fff !important; }
.fs-check-row { min-height: 0; }
.fs-check-row + * .fs-state { font-size: 13px; margin-top: 6px; }
/* Collapsed sections read as one-line summary rows */
.fi-section.fi-collapsed .fi-section-header { padding-block: calc(var(--spacing) * 2.5) !important; }
.fi-section-header-icon { color: var(--fs-ink-3) !important; }

/* ---- Figures: never truncate or wrap numbers ---------------------------------------- */
.fi-ta-text-item, .fi-ta-cell .fi-ta-text { font-variant-numeric: tabular-nums; }
.fi-ta-cell.fi-align-end .fi-ta-text, .fi-ta-cell.fi-align-right .fi-ta-text { white-space: nowrap; }

/* Document numbering: one card per document type, preview strip, settings in soft boxes. */
.fs-num-head { display: flex; align-items: center; gap: 14px; }
.fs-num-head .fs-tile { width: 44px; height: 44px; border-radius: 12px; }
.fs-num-head .fs-tile svg { width: 22px; height: 22px; }
.fs-num-title { display: block; font-size: 17px; font-weight: 700; color: var(--fs-ink); }
.fs-num-sub { display: block; font-size: 13px; font-weight: 400; color: var(--fs-ink-3); margin-top: 2px; }
.fs-num-preview { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; background: var(--fs-bg); border-radius: 10px; padding: 14px 18px; }
.fs-num-preview-label { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; color: var(--fs-ink-3); }
.fs-num-preview-label svg { width: 18px; height: 18px; }
.fs-num-preview-value { font-size: 22px; font-weight: 700; color: var(--fs-ink); letter-spacing: .02em; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.fs-num-toggle { height: 100%; justify-content: center; background: #f8fafc; border: 1px solid var(--fs-line); border-radius: 10px; padding: 12px 16px; }
.fs-num-toggle .fi-fo-field-label-ctn, .fs-num-toggle .fi-fo-field-label { width: 100%; }
.fs-num-toggle .fi-fo-field-label { display: flex; flex-direction: row-reverse; justify-content: space-between; align-items: center; gap: 12px; }
.fs-num-toggle .fi-fo-field-content-col .fi-sc-text { font-size: 13px; color: var(--fs-ink-3); }
.fs-num-card .fi-section-footer { border-top: 1px solid var(--fs-line); }

/* =====================================================================================
   Enterprise polish: one quiet, consistent system across both panels.
   Slate neutrals, 8px controls, 10px cards, hairline borders, restrained colour.
   ===================================================================================== */
:root {
    --fs-line: #e2e8f0;
    --fs-line-strong: #cbd5e1;
    --fs-surface-2: #f8fafc;
    --fs-radius: 8px;
    --fs-radius-lg: 10px;
    --fs-shadow: 0 1px 2px rgba(15, 23, 42, .04);
    --fs-shadow-pop: 0 8px 24px rgba(15, 23, 42, .12);
    --fs-primary: #1d4ed8;
    --fs-focus: 0 0 0 3px rgba(37, 99, 235, .18);
}

html { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
body { font-feature-settings: "cv11", "ss01", "tnum" 0; color: var(--fs-ink); }

/* ---- Page header ---- */
.fi-header-heading { font-size: 1.55rem !important; font-weight: 700 !important; color: var(--fs-ink) !important; letter-spacing: -.015em !important; line-height: 1.2 !important; }
.fi-header-subheading { font-size: 14px !important; margin-top: 4px !important; max-width: 60rem; }

/* ---- Cards ---- */
.fi-section:not(.fi-section-not-contained),
.fi-ta-ctn,
.fi-wi-stats-overview-stat,
.fs-panel,
.fs-kpi { box-shadow: var(--fs-shadow) !important; border-color: var(--fs-line) !important; border-radius: var(--fs-radius-lg) !important; }
.fi-section-header { border-bottom: 1px solid transparent; }
.fi-section:not(.fi-collapsed) > .fi-section-header + .fi-section-content-ctn { border-top: 1px solid var(--fs-line) !important; }

/* ---- Sidebar: quiet active state with an accent bar, not a solid blue block ---- */
.fi-sidebar .fi-sidebar-item-btn { border-radius: 6px !important; transition: background .12s ease; }
.fi-sidebar .fi-sidebar-item.fi-active > .fi-sidebar-item-btn { background: rgba(255, 255, 255, .09) !important; box-shadow: inset 3px 0 0 #60a5fa; }
.fi-sidebar .fi-sidebar-item.fi-active .fi-sidebar-item-label { font-weight: 600; }
.fi-sidebar .fi-sidebar-item.fi-active .fi-sidebar-item-icon { color: #93c5fd !important; }
.fi-sidebar .fi-sidebar-item-icon { opacity: .85; }
.fi-sidebar .fi-sidebar-group-label { font-size: 10.5px !important; font-weight: 600 !important; letter-spacing: .09em; }
.fi-sidebar .fi-sidebar-item-badge-ctn .fi-badge { border-radius: 999px !important; font-size: 11px !important; min-width: 20px; justify-content: center; }
.fi-sidebar-group + .fi-sidebar-group { border-top: 1px solid var(--fs-navy-line); padding-top: 4px; margin-top: 2px; }

/* ---- Top bar ---- */
.fi-topbar { box-shadow: 0 1px 0 var(--fs-line), 0 1px 3px rgba(15, 23, 42, .03) !important; }
.fs-env-pill { background: #fef3c7; border-color: #fcd34d; color: #92400e; letter-spacing: .01em; }

/* ---- Buttons ---- */
.fi-btn { border-radius: var(--fs-radius) !important; font-weight: 600 !important; transition: background .12s, border-color .12s, box-shadow .12s; }
.fi-btn.fi-color-primary:not(.fi-outlined):not(.fi-btn-outlined):not(.fi-btn-group-btn):not(.fs-pills .fi-btn) { background: var(--fs-blue) !important; box-shadow: 0 1px 2px rgba(29, 78, 216, .35) !important; }
.fi-btn.fi-color-primary:not(.fi-outlined):not(.fi-btn-outlined):not(.fi-btn-group-btn):not(.fs-pills .fi-btn):hover { background: var(--fs-primary) !important; }
.fi-btn.fi-color-gray { border: 1px solid var(--fs-line-strong); box-shadow: var(--fs-shadow) !important; background: #fff; }
.fi-btn.fi-color-gray:hover { background: var(--fs-surface-2) !important; }
.fi-btn:focus-visible, .fi-icon-btn:focus-visible { outline: none !important; box-shadow: var(--fs-focus) !important; }

/* ---- Inputs: Filament draws the border as a 1px ring in box-shadow, so keep that ring ---- */
.fi-input-wrp { border-radius: var(--fs-radius) !important; box-shadow: 0 0 0 1px var(--fs-line-strong), var(--fs-shadow) !important; background: #fff; }
.fi-input-wrp:hover { box-shadow: 0 0 0 1px #94a3b8, var(--fs-shadow) !important; }
.fi-input-wrp:focus-within { box-shadow: 0 0 0 1px var(--fs-blue), var(--fs-focus) !important; }
.fi-input-wrp.fi-invalid { box-shadow: 0 0 0 1px var(--fs-bad), var(--fs-shadow) !important; }
.fi-input-wrp.fi-disabled, .fi-input-wrp:has(:disabled) { background: var(--fs-surface-2); box-shadow: 0 0 0 1px var(--fs-line) !important; }
.fi-fo-field-label-content { font-size: 13px !important; font-weight: 600 !important; color: var(--fs-ink) !important; }
.fi-fo-field-label-required-mark { color: var(--fs-bad); }
.fi-fo-field-wrp-hint, .fi-sc-text.fi-color-gray { color: var(--fs-ink-3); }

/* ---- Badges ---- */
.fi-badge { border-radius: 6px !important; font-weight: 600 !important; font-size: 11.5px !important; letter-spacing: .01em; padding: 2px 8px !important; }

/* ---- Tables: small-caps header band, calm rows ---- */
.fi-ta-header-cell, .fs-list-page .fi-ta-header-cell { font-size: 11.5px !important; font-weight: 600 !important; text-transform: uppercase; letter-spacing: .05em; color: var(--fs-ink-3) !important; background: var(--fs-surface-2) !important; }
.fi-ta-table thead tr { border-bottom: 1px solid var(--fs-line) !important; }
.fi-ta-row { transition: background .1s; }
.fi-ta-row:hover { background: var(--fs-surface-2) !important; }
.fi-ta-table tbody tr + tr, .fi-ta-table tbody tr { border-color: var(--fs-line) !important; }
.fi-ta-empty-state-heading { font-size: 15px !important; color: var(--fs-ink) !important; }
.fi-pagination { padding-block: 10px; }
.fs-doc-table th { text-transform: uppercase; letter-spacing: .05em; font-size: 11.5px; color: var(--fs-ink-3); }

/* ---- Dropdowns, modals, notifications ---- */
.fi-dropdown-panel { border-radius: var(--fs-radius-lg) !important; box-shadow: var(--fs-shadow-pop) !important; border: 1px solid var(--fs-line); }
.fi-modal-window { border-radius: 14px !important; box-shadow: var(--fs-shadow-pop) !important; }
.fi-no-notification { border-radius: var(--fs-radius-lg) !important; box-shadow: var(--fs-shadow-pop) !important; }

/* ---- Overview cards ---- */
.fs-kpi-value { font-weight: 700; }
.fs-kpi-label { font-size: 13px; font-weight: 500; }
.fs-panel-title { font-size: 15px; }
.fs-row { padding-block: 11px; }
.fs-state { font-weight: 500; }

/* ---- Document numbering: setting rows with the switch on the right ---- */
.fs-num-toggle { display: flex; flex-direction: column; justify-content: center; align-items: stretch !important; gap: 2px; }
.fs-num-toggle > .fi-fo-field-label-col, .fs-num-toggle .fi-fo-field-label-ctn { width: 100%; }
.fs-num-toggle .fi-fo-field-label { width: 100%; display: flex; flex-direction: row-reverse; justify-content: space-between; align-items: center; gap: 12px; }
.fs-num-toggle .fi-fo-field-label-content { font-size: 14px !important; }
.fs-num-toggle .fi-fo-field-content-col { width: 100%; }
.fs-num-toggle:has(.fi-toggle-on) { background: #f0f6ff; border-color: #bfdbfe; }
.fs-num-preview-value { color: var(--fs-primary); }

/* ---- Scrollbars in the workspace ---- */
.fi-main { scrollbar-width: thin; scrollbar-color: #cbd5e1 transparent; }

/* ---- Reduced motion ---- */
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }

/* ---- Segmented control (grouped toggle buttons): quiet when off, solid when on ---- */
.fi-btn-group:not(.fs-pills) { display: inline-flex; border-radius: var(--fs-radius); box-shadow: 0 0 0 1px var(--fs-line-strong), var(--fs-shadow); overflow: hidden; background: #fff; }
.fi-btn-group:not(.fs-pills) .fi-btn-group-btn { border-radius: 0 !important; box-shadow: none !important; background: #fff !important; color: var(--fs-ink-2) !important; border: 0; border-inline-start: 1px solid var(--fs-line); font-weight: 500 !important; }
.fi-btn-group:not(.fs-pills) .fi-btn-group-btn:first-child { border-inline-start: 0; }
.fi-btn-group:not(.fs-pills) .fi-btn-group-btn:hover { background: var(--fs-surface-2) !important; color: var(--fs-ink) !important; }
.fi-btn-group:not(.fs-pills) .fi-btn-group-btn[aria-pressed="true"] { background: var(--fs-blue) !important; color: #fff !important; font-weight: 600 !important; }