/* ── Header bar ──────────────────────────────────────── */
.fi-topbar {
    background-color: #cc3333 !important;
}

.fi-topbar nav {
    background-color: #cc3333 !important;
}


/* ── Sidebar ─────────────────────────────────────────── */
.fi-sidebar-header {
    background-color: #cc3333 !important;
}

.fi-sidebar {
    background-color: #f8f8f8 !important;
}

/* ── Brand logo area ─────────────────────────────────── */
.fi-topbar .fi-logo,
.fi-topbar a[href*="admin"] {
    background-color: transparent !important;
}

/* ── Row density ─────────────────────────────────────── */
.fi-ta-row td,
.fi-ta-header-cell,
.fi-ta-cell {
    padding-top: 0rem !important;
    padding-bottom: 0rem !important;
}

/* ── General table font size ─────────────────────────── */
.fi-ta-text {
    font-size: 0.8rem;
}

td.fi-ta-cell > div {
    padding-top: 0.1rem !important;
    padding-bottom: 0.1rem !important;
}

.fi-ta-ctn .py-4 {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
}

/* ── Table action buttons left aligned ───────────────── */
.fi-ta-actions {
    justify-content: flex-start !important;
}

/* Form forcing to use 4 columns on edit form */

/* fi-sc  fi-sc-has-gap fi-grid lg:fi-grid-cols 
.fi-sc-form > div > .fi-sc-component > .fi-sc-has-gap.fi-grid.lg\:fi-grid-cols {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

.fi-sc-form > div > .fi-sc-component > .fi-sc-has-gap {
    display: grid;

    gap: 1rem;
}
*/

/* ── Sidebar menu item label colour ─────────────────── */
.fi-page-sub-navigation-sidebar-ctn {
    width: calc(var(--spacing) * 50) !important;
}
.fi-sidebar-item-label {
    color: #111010 !important;
    font-size: 13px;
}

.fi-icon-btn {
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    width: 35px;
    margin-right: 2px;
    height: 30px;
}

.fi-icon-btn:hover {
    background-color: #f3f4f6;
    border-color: #9ca3af;
}