/* ============================================================
   Infinity Hartaway — admin theme (QC 1.0, items 2·3·4)
   Filament's styles live in @layer components; this file is
   unlayered, so these rules win regardless of specificity.
   ============================================================ */

:root {
    --ih-navy:      #1E3A8A;   /* brand navy — buttons, headings   */
    --ih-navy-dark: #16296B;   /* button hover                     */
    --ih-navy-deep: #111F4D;   /* sidebar background               */
}

/* ── QC 4 · primary buttons: solid navy, white label ──────────
   Filament dresses them in pastel shade 400 + dark text. Repaint.
   QC 6: scoped to real <button>/<a> — ToggleButtons options are
   <label class="fi-btn"> and must keep their own on/off states. */

button.fi-btn.fi-color-primary,
a.fi-btn.fi-color-primary {
    background-color: var(--ih-navy);
    color: #fff;
}

button.fi-btn.fi-color-primary:hover,
a.fi-btn.fi-color-primary:hover {
    background-color: var(--ih-navy-dark);
}

/* QC3 · icons inside primary buttons were invisible (navy on navy) */
button.fi-btn.fi-color-primary svg,
a.fi-btn.fi-color-primary svg,
button.fi-btn.fi-color-primary .fi-btn-icon,
a.fi-btn.fi-color-primary .fi-btn-icon {
    color: #fff !important;
}

/* ── QC 6 · toggle buttons (Cash / Loan): off = white chip,
   hover = navy tint, on = solid navy. The real state lives on a
   hidden radio, so we key off input:checked → its label. ── */

.fi-fo-toggle-buttons .fi-fo-toggle-buttons-input:not(:checked)+.fi-btn {
    background-color: #fff;
    color: #3f3f46;
    box-shadow: inset 0 0 0 1px #d4d4d8;
}

.fi-fo-toggle-buttons .fi-fo-toggle-buttons-input:not(:checked)+.fi-btn:not(.fi-disabled):hover {
    background-color: #E8EEF9;
    color: var(--ih-navy);
    box-shadow: inset 0 0 0 1px var(--ih-navy);
}

.fi-fo-toggle-buttons .fi-fo-toggle-buttons-input:checked+.fi-btn {
    background-color: var(--ih-navy);
    color: #fff;
    box-shadow: inset 0 0 0 1px var(--ih-navy);
}

.fi-fo-toggle-buttons .fi-fo-toggle-buttons-input:checked+.fi-btn:hover {
    background-color: var(--ih-navy-dark);
}

/* ── QC 2 · sidebar: navy, white text/icons, hover, tighter ── */

.fi-sidebar,
.fi-sidebar-header {
    background-color: var(--ih-navy-deep);
}

.fi-sidebar :is(
    .fi-sidebar-item-label,
    .fi-sidebar-group-label,
    .fi-sidebar-item-icon,
    .fi-sidebar-group-icon,
    svg
):not(.fi-dropdown-panel *) {
    color: #fff;
}

/* hover — group headers (Sales/Projects) keep the soft overlay */
.fi-sidebar :is(.fi-sidebar-group-btn, .fi-sidebar-group-button):hover {
    background-color: rgb(255 255 255 / 0.10);
}

/* EIGHTH · item hover: white pill, navy text + icon */
.fi-sidebar :is(.fi-sidebar-item-btn, .fi-sidebar-item-button):hover {
    background-color: #fff;
}

.fi-sidebar :is(.fi-sidebar-item-btn, .fi-sidebar-item-button):hover :is(.fi-sidebar-item-label, .fi-sidebar-item-icon, svg) {
    color: var(--ih-navy);
}

/* EIGHTH · active pill on the ITEM itself only — the old descendant
   rule also lit every item inside an active group */
.fi-sidebar-item.fi-active :is(.fi-sidebar-item-btn, .fi-sidebar-item-button),
.fi-sidebar :is(.fi-sidebar-item-btn, .fi-sidebar-item-button).fi-active {
    background-color: #fff;
}
/* ── QC 7b · sidebar toggle: real button in the nav flow.
   Replaces the fixed-position hack; stock topbar pair hidden. */

.fi-topbar-collapse-sidebar-btn-ctn {
    display: none;
}

.ih-sidebar-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 0.5rem;
    color: #fff;
    flex-shrink: 0;
}

.ih-sidebar-toggle svg {
    width: 1.25rem;
    height: 1.25rem;
}

.ih-sidebar-toggle:hover {
    background-color: rgb(255 255 255 / 0.12);
}

/* expanded: hug the right edge, top of the nav */
.ih-sidebar-toggle.ih-open {
    margin-left: auto;
}

/* collapsed rail: centred above Dashboard, with a clear gap */
.ih-sidebar-toggle.ih-closed {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0.5rem;   /* gap above Dashboard — adjust by eye */
}
/* QC 7b · collapsed rail: group icons are dropdown triggers — give
   them the same hover language as items (white pill, navy icon) */

.fi-sidebar .fi-sidebar-group-dropdown-trigger-btn:hover {
    background-color: #fff;
}

.fi-sidebar .fi-sidebar-group-dropdown-trigger-btn:hover svg {
    color: var(--ih-navy);
}
.fi-sidebar-item.fi-active :is(.fi-sidebar-item-label, .fi-sidebar-item-icon, svg),
.fi-sidebar :is(.fi-sidebar-item-btn, .fi-sidebar-item-button).fi-active :is(.fi-sidebar-item-label, .fi-sidebar-item-icon, svg) {
    color: var(--ih-navy);
    font-weight: 500;
}

/* tighter vertical rhythm */
.fi-sidebar-nav {
    gap: 0.5rem;
}

.fi-sidebar-nav :is(ul, .fi-sidebar-group-items) {
    gap: 0.125rem;
}

/* ── QC 3 · headings & key figures in navy (body text stays
   dark gray — if everything is navy, nothing stands out) ──── */

.fi-header-heading,
.fi-section-header-heading,
.fi-modal-heading,
.fi-wi-stats-overview-stat-value {
    color: var(--ih-navy);
}
/* ── Login: Client / Staff tabs fused to the auth card ── */

.fi-simple-main:has(.ih-login-tabs) {
    position: relative;
    padding-top: 6.5rem;
}

.ih-login-tabs {
    position: absolute;
    top: 0; left: 0; right: 0;
    display: flex;
}

.ih-login-tab {
    flex: 1;
    text-align: center;
    padding: .8rem 0;
    font-weight: 700;
    font-size: .95rem;
    background: #f1f5f9;
    color: #1E3A8A;
    border: none;
    border-radius: 0;
    cursor: pointer;
}

.ih-login-tab:first-child { border-top-left-radius: .5rem; }
.ih-login-tab:last-child  { border-top-right-radius: .5rem; }
.ih-login-tab.ih-active { background: #1E3A8A; color: #fff; }
.ih-login-tab:not(.ih-active):hover { background: #E8EEF9; }

/* mode switch: whole staff page-content ↔ client panel (never hide bare
   `form` — the client panel has its own form) */
.ih-client-panel { display: none; }
.fi-simple-main.ih-client-mode .fi-simple-page-content { display: none; }
.fi-simple-main.ih-client-mode .ih-client-panel { display: block; }

/* client panel: mirror the staff layout */
.ih-cl-logo { display: flex; justify-content: center; }
.ih-cl-logo :is(img, svg) { height: 2.25rem; width: auto; }
.ih-cl-heading { margin-top: 1.25rem; text-align: center; font-size: 1.5rem; font-weight: 800; color: #0f172a; }

.ih-cl-label { display: block; font-size: .875rem; font-weight: 600; color: #334155; margin: 1.1rem 0 .35rem; }
.ih-cl-req   { color: #dc2626; margin-left: .15rem; }
.ih-cl-input {
    width: 100%;
    background: #fff;
    border: 1px solid #cbd5e1;
    border-radius: .5rem;
    padding: .55rem .75rem;
    font-size: .9rem;
}
.ih-cl-input:focus { outline: none; border-color: #1E3A8A; box-shadow: 0 0 0 1px #1E3A8A; }

.ih-cl-remember { display: flex; gap: .5rem; align-items: center; margin-top: 1rem; font-size: .875rem; color: #475569; }
.ih-cl-submit { width: 100%; border: none; cursor: pointer; }
.ih-client-err { margin: .9rem 0 0; padding: .6rem .9rem; border-radius: .5rem; background: #fef2f2; color: #b91c1c; font-size: .85rem; text-align: center; }
.ih-cl-alt { margin-top: 1rem; font-size: .85rem; color: #475569; text-align: center; }
.ih-cl-alt a { color: #1E3A8A; font-weight: 700; text-decoration: underline; }

.ih-client-cta {
    display: block;
    margin-top: 1.5rem;
    background: #1E3A8A;
    color: #fff !important;
    font-weight: 700;
    border-radius: .5rem;
    padding: .7rem;
    text-decoration: none;
    text-align: center;
}
.ih-client-cta:hover { background: #16296B; }