/* ICONIC COMPONENT FRAMEWORK */
@media screen {
:root {
    --ig-bg:#f4f2ee;
    --ig-paper:#fff;
    --ig-ink:#2e2822;
    --ig-muted:#83796f;
    --ig-line:#e6dfd5;
    --ig-soft:#faf7f2;
    --ig-orange:#ee7d28;
    --ig-link:#a6531d;
    --ig-sidebar:#30231c;
    --ig-shadow:0 2px 4px #34201003,0 12px 30px #34201006;
}

:is(html.dark,html[data-theme=dark]) {
    --ig-bg:#181614;
    --ig-paper:#24201c;
    --ig-ink:#f0e8de;
    --ig-muted:#b6a999;
    --ig-line:#40362c;
    --ig-soft:#2c261f;
    --ig-link:#f6aa73;
    --ig-shadow:0 12px 30px #00000020;
}

body {
    background:var(--ig-bg)!important;
    color:var(--ig-ink)!important;
    font:13px/1.6 Inter,system-ui,sans-serif!important;
    --bg:var(--ig-bg);
    --paper:var(--ig-paper);
    --ink:var(--ig-ink);
    --muted:var(--ig-muted);
    --line:var(--ig-line);
    --soft:var(--ig-soft);
    --accent:var(--ig-link);
}

.ic-dashboard,.ic-calendar {
    --ic-surface:var(--ig-paper)!important;
    --ic-bg:var(--ig-paper)!important;
    --ic-text:var(--ig-ink)!important;
    --ic-muted:var(--ig-muted)!important;
    --ic-line:var(--ig-line)!important;
    --ic-soft:var(--ig-soft)!important;
    --ic-event:var(--ig-soft)!important;
    --ic-accent:var(--ig-link)!important;
}

.ic-profile {
    --ip-bg:var(--ig-paper)!important;
    --ip-fg:var(--ig-ink)!important;
    --ip-muted:var(--ig-muted)!important;
    --ip-line:var(--ig-line)!important;
    --ip-soft:var(--ig-soft)!important;
    --ip-accent:var(--ig-link)!important;
}

.br {
    --bg:var(--ig-paper)!important;
    --text:var(--ig-ink)!important;
    --line:var(--ig-line)!important;
    --muted:var(--ig-muted)!important;
    --soft:var(--ig-soft)!important;
    --accent:var(--ig-link)!important;
}

.fi-header-heading,.ic-dashboard h2,.pf-header h2,main h1 {
    font-size:24px!important;
    font-weight:500!important;
    letter-spacing:-.65px!important;
    line-height:1.3!important;
}

.fi-section-header-heading,.ic-dashboard h3,
.pf-heading h3,.ic-profile h3,main .section h2 {
    font-size:14px!important;
    font-weight:600!important;
    letter-spacing:-.1px!important;
}

.fi-main {padding-top:24px!important}

.fi-section,.fi-ta,.fi-sc-tabs,.ic-panel,
.ic-profile-panel,.br-panel,.pf-panel,main .section {
    background:var(--ig-paper)!important;
    color:var(--ig-ink)!important;
    border:1px solid var(--ig-line)!important;
    border-radius:12px!important;
    box-shadow:var(--ig-shadow)!important;
}

.fi-section-header,.ic-heading,.ic-profile-heading,.pf-heading {
    padding:16px 20px!important;
    border-bottom:1px solid var(--ig-line)!important;
}

.fi-section-content,.ic-body,.fi-sc-tabs-tab {
    padding:20px!important;
}

.fi-sc-tabs>.fi-tabs {
    padding:12px!important;
    gap:6px;
    border-bottom:1px solid var(--ig-line)!important;
}

.fi-tabs-item {
    border-radius:7px!important;
    font-size:12px!important;
    font-weight:500!important;
}

.fi-tabs-item.fi-active {
    background:var(--ig-soft)!important;
    color:var(--ig-link)!important;
}

.ic-top,.pf-header {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
    flex-wrap:wrap;
    margin-bottom:24px;
    padding-bottom:20px;
    border-bottom:1px solid var(--ig-line);
}

.pf-eyebrow {
    color:var(--ig-link);
    font-size:10px;
    letter-spacing:1.4px;
    text-transform:uppercase;
    margin-bottom:5px;
}

.pf-header h2,.pf-heading h3 {margin:0}
.pf-header p,.pf-muted {
    margin:6px 0 0;
    color:var(--ig-muted);
    font-size:12px;
}

.ic-dashboard .ic-metrics,.pf-metrics {
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:14px!important;
    background:none!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    margin:0 0 24px!important;
    overflow:visible!important;
}

.ic-metric,.pf-metric,.br-kpi,
.fi-wi-stats-overview-stat,main .metric {
    padding:18px!important;
    background:var(--ig-paper)!important;
    border:1px solid var(--ig-line)!important;
    border-radius:12px!important;
    box-shadow:var(--ig-shadow)!important;
    transition:border-color .2s ease,box-shadow .2s ease!important;
}

.pf-metric>span,.ic-metric>.ic-muted {
    font-size:11px!important;
    font-weight:500;
    color:var(--ig-muted);
}

.ic-value,.pf-metric strong,.br-value,
.fi-wi-stats-overview-stat-value {
    display:block;
    font-size:25px!important;
    font-weight:500!important;
    letter-spacing:-.75px!important;
    margin:8px 0!important;
    font-variant-numeric:tabular-nums;
}

.pf-metric small {font-size:10px;color:var(--ig-muted)}

.ic-metric:hover,.pf-metric:hover,.br-kpi:hover {
    border-color:var(--ig-orange)!important;
    box-shadow:0 8px 24px #34201012!important;
}

.ic-layout {
    display:grid!important;
    grid-template-columns:minmax(0,1.8fr) minmax(280px,1fr)!important;
    gap:20px!important;
}

.ic-panel,.pf-panel,.ic-profile-panel {
    margin-bottom:20px!important;
    overflow:hidden;
}

.ic-heading,.pf-heading {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
}

.ic-row {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:14px 20px!important;
    border-bottom:1px solid var(--ig-line);
    transition:background .16s ease;
}
.ic-row:hover {background:var(--ig-soft)!important}

.ic-chart-svg {
    display:block;
    width:100%;
    height:235px!important;
    background:var(--ig-soft);
    border-radius:8px;
}

.ic-legend {
    display:flex;
    gap:18px;
    color:var(--ig-muted);
    font-size:11px;
    margin:14px 0;
}
.ic-dot {
    display:inline-block;
    width:8px;
    height:8px;
    border-radius:50%;
    margin-right:5px;
}

.ic-actions,.pf-actions {
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
}

.ic-table-wrap,.pf-scroll,.ic-profile-scroll {overflow:auto}

.ic-small,.ic-muted,.ic-profile-caption,
.fi-section-header-description {
    color:var(--ig-muted)!important;
    font-size:11px!important;
    line-height:1.6!important;
}

.ic-pill,.pf-badge {
    display:inline-block;
    border:1px solid var(--ig-line);
    background:var(--ig-soft);
    color:var(--ig-ink);
    border-radius:6px;
    padding:3px 8px;
    font-size:10px;
    white-space:nowrap;
}

.ic-empty,.pf-empty {
    padding:28px!important;
    color:var(--ig-muted);
    text-align:center;
}
.ic-bottom {font-size:11px;color:var(--ig-muted);padding:12px 0}
.ic-due {color:var(--ig-link);font-weight:500}

.ic-dashboard table,.pf-table {
    width:100%;
    border-collapse:collapse;
    white-space:nowrap;
    font-size:12px;
    text-align:left;
}

.ic-dashboard td,.ic-dashboard th,.pf-table td,.pf-table th,
.br td,.br th,main td,main th {
    padding:12px 16px!important;
    border-bottom:1px solid var(--ig-line)!important;
    font-variant-numeric:tabular-nums;
}

.ic-dashboard th,.pf-table th,.br th,
main th,.fi-ta-header-cell {
    background:var(--ig-soft)!important;
    color:var(--ig-muted)!important;
    font-size:11px!important;
    font-weight:500!important;
    text-transform:none!important;
    letter-spacing:0!important;
}

.fi-ta-text-item-label {font-size:12px!important}
.pf-table tr:hover,.ic-dashboard tr:hover,.fi-ta-row:hover {
    background:var(--ig-soft)!important;
}

.fi-input-wrp,.pf-header input,.ic-dashboard select,
main select,main textarea,
main input:not([type=checkbox]):not([type=radio]):not([type=range]) {
    border-color:var(--ig-line)!important;
    background:var(--ig-paper)!important;
    color:var(--ig-ink)!important;
    border-radius:8px!important;
    font-size:13px!important;
}

.fi-input-wrp:focus-within {
    outline:1px solid var(--ig-orange);
    box-shadow:0 0 0 3px #ee7d281c!important;
}

.fi-fo-field-label,.fi-fo-field-wrp-label {
    font-size:12px!important;
    font-weight:500!important;
}

.fi-btn,.ic-button,.pf-button,.br-btn,main .button {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    border-radius:8px!important;
    font-size:12px!important;
    font-weight:500!important;
    transition:background .18s ease,box-shadow .18s ease,
               transform .18s ease!important;
}

.ic-button,.pf-button {
    padding:9px 13px;
    border:1px solid var(--ig-line);
    background:var(--ig-paper);
    color:var(--ig-ink);
    text-decoration:none;
}
.ic-primary,.pf-primary {
    background:var(--ig-orange)!important;
    color:#2c190b!important;
    border-color:var(--ig-orange)!important;
}
.fi-btn:hover,.pf-button:hover,.ic-button:hover {
    transform:translateY(-1px);
    box-shadow:0 4px 12px #34201016;
}
.fi-btn:disabled {transform:none;box-shadow:none}

.fi-dropdown-panel,.fi-modal-window {border-radius:12px!important}
.fi-sidebar,.fi-sidebar .fi-sidebar-header {
    background:var(--ig-sidebar)!important;
}
.fi-sidebar .fi-sidebar-item-label {
    color:#eaddce!important;
    font-size:12px!important;
    font-weight:400!important;
}
.fi-sidebar .fi-sidebar-group-label,.fi-sidebar .fi-sidebar-item-icon {
    color:#bba38e!important;
}
.fi-sidebar .fi-sidebar-item a {border-radius:8px!important}
.fi-sidebar .fi-sidebar-item a:hover {background:#ffffff0c!important}
.fi-sidebar .fi-sidebar-item.fi-active a {
    background:#ee7d281f!important;
    box-shadow:inset 3px 0 var(--ig-orange);
}
.fi-sidebar .fi-logo {background:#fff;padding:5px;border-radius:6px}

.ic-calendar-event {
    border-radius:7px!important;
    transition:box-shadow .18s ease,transform .18s ease;
}
.ic-calendar-event:hover {
    transform:translateY(-1px);
    box-shadow:0 4px 12px #34201016;
}

main .hero {
    background:var(--ig-paper)!important;
    color:var(--ig-ink)!important;
    border:1px solid var(--ig-line)!important;
    border-left:3px solid var(--ig-orange)!important;
    border-radius:12px!important;
}
main .hero p {color:var(--ig-muted)!important}
:focus-visible {outline:2px solid var(--ig-orange);outline-offset:3px}

.fi-body:has(.ic-dashboard) .fi-header {display:none}

@media(max-width:1050px) {
    .ic-layout {grid-template-columns:1fr!important}
    .ic-dashboard .ic-metrics,.pf-metrics {
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
    }
}
@media(max-width:550px) {
    .ic-dashboard .ic-metrics,.pf-metrics {
        grid-template-columns:1fr!important;
    }
    .ic-chart-svg {height:180px!important}
    .pf-header h2 {font-size:21px!important}
}
@media(prefers-reduced-motion:reduce) {
    .fi-btn,.pf-button,.ic-button,.ic-calendar-event,
    .ic-metric,.pf-metric,.br-kpi {
        transition:none!important;
        transform:none!important;
    }
}
}
/* ICONIC-INTERACTIVE-START */
@media screen {
    :root {
        --iu-paper: #fff;
        --iu-soft: #f8f5f1;
        --iu-ink: #302820;
        --iu-muted: #82776c;
        --iu-line: #e5ded5;
        --iu-accent: #b96020;
    }

    html.dark,
    html[data-theme="dark"] {
        --iu-paper: #24201c;
        --iu-soft: #302921;
        --iu-ink: #f1e9df;
        --iu-muted: #b8aa9b;
        --iu-line: #463a2f;
        --iu-accent: #f5a267;
    }

    .ig-control {
        appearance: none;
        background: var(--iu-paper) !important;
        color: var(--iu-ink) !important;
        border: 1px solid var(--iu-line) !important;
        border-radius: 8px !important;
        padding: 8px 12px !important;
        font: 500 12px/1.5 inherit;
        font-size: 12px !important;
        cursor: pointer;
        transition: background .18s ease, border-color .18s ease,
                    box-shadow .18s ease !important;
    }

    .ig-control:hover {
        background: var(--iu-soft) !important;
        border-color: var(--iu-accent) !important;
        box-shadow: 0 3px 10px rgb(40 25 10 / 7%);
    }

    .ig-control[aria-pressed="true"] {
        background: var(--iu-soft) !important;
        border-color: var(--iu-accent) !important;
        color: var(--iu-accent) !important;
    }

    .ig-control:focus-visible,
    .ig-command a:focus-visible {
        outline: 2px solid var(--iu-accent);
        outline-offset: 3px;
    }

    .ig-section-nav {
        display: flex;
        gap: 8px;
        flex-wrap: wrap;
        padding: 12px;
        margin: 0 0 18px;
        background: var(--iu-paper);
        border: 1px solid var(--iu-line);
        border-radius: 12px;
    }

    .ig-table-tools,
    .ig-chart-controls {
        display: flex;
        align-items: center;
        gap: 12px;
        flex-wrap: wrap;
        padding: 12px 16px;
        background: var(--iu-soft);
        color: var(--iu-muted);
        font-size: 11px;
        border-bottom: 1px solid var(--iu-line);
    }

    .ig-table-tools label,
    .ig-command label {
        display: grid;
        gap: 6px;
        margin: 0;
        font-size: 11px;
        flex: 1;
        min-width: 180px;
        color: var(--iu-muted);
    }

    .ig-table-tools input,
    .ig-command input {
        width: 100%;
        background: var(--iu-paper) !important;
        color: var(--iu-ink) !important;
        border: 1px solid var(--iu-line) !important;
        padding: 9px 12px !important;
        border-radius: 8px !important;
        font-size: 12px !important;
    }

    .ig-chart-controls {
        margin-top: 10px;
        border: 0;
        border-radius: 8px;
    }

    .ig-chart-controls input[type="range"] {
        flex: 1;
        min-width: 100px;
        padding: 0 !important;
        accent-color: var(--iu-accent);
    }

    .ig-chart-readout {
        padding: 12px 4px;
        color: var(--iu-ink);
        font-size: 12px;
        font-variant-numeric: tabular-nums;
    }

    .ig-command {
        width: min(520px, calc(100vw - 32px));
        max-height: 80vh;
        padding: 24px;
        color: var(--iu-ink);
        background: var(--iu-paper);
        border: 1px solid var(--iu-line);
        border-radius: 16px;
        box-shadow: 0 24px 80px rgb(0 0 0 / 22%);
    }

    .ig-command::backdrop {
        background: rgb(25 18 12 / 45%);
        backdrop-filter: blur(4px);
    }

    .ig-command h2 {
        margin: 0 0 18px;
        font-size: 18px;
        font-weight: 500;
    }

    .ig-command-list {
        display: grid;
        gap: 5px;
        margin: 16px 0;
        max-height: 40vh;
        overflow: auto;
    }

    .ig-command-list a {
        padding: 11px 12px;
        border-radius: 8px;
        color: var(--iu-ink);
        text-decoration: none;
        font-size: 13px;
    }

    .ig-command-list a:hover {
        background: var(--iu-soft);
        color: var(--iu-accent);
    }

    .ig-open-navigation {
        margin: 4px 12px;
        white-space: nowrap;
    }

    .ic-panel,
    .ic-profile-panel,
    .fi-section {
        transition: box-shadow .2s ease, border-color .2s ease !important;
    }

    .ic-panel:hover,
    .ic-profile-panel:hover {
        box-shadow: 0 8px 26px rgb(40 25 10 / 7%) !important;
    }

    .fi-dropdown-panel,
    .fi-modal-window {
        border-radius: 12px !important;
    }

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

    .fi-ta-row:hover {
        background: var(--iu-soft) !important;
    }

    .ic-profile-panel[hidden],
    body > main > .section[hidden],
    table tr[hidden] {
        display: none !important;
    }

    @media (max-width: 650px) {
        .ig-open-navigation {
            font-size: 10px !important;
            padding: 7px 9px !important;
            margin: 4px;
        }

        .ig-section-nav {
            flex-wrap: nowrap;
            overflow-x: auto;
        }

        .ig-section-nav button {
            white-space: nowrap;
        }
    }

    @media (prefers-reduced-motion: reduce) {
        .ig-control,
        .ic-panel,
        .ic-profile-panel,
        .fi-section {
            transition: none !important;
        }
    }
}

@media print {
    .ig-section-nav,
    .ig-table-tools,
    .ig-chart-controls,
    .ig-chart-readout,
    .ig-open-navigation,
    .ig-command {
        display: none !important;
    }

    .ic-profile-panel[hidden],
    body > main > .section[hidden] {
        display: block !important;
    }

    table tr[hidden] {
        display: table-row !important;
    }
}
/* ICONIC-INTERACTIVE-END */