/* Auntie Jay's ERP -- premium admin theme overlay.
   Pure CSS, no build step: loaded directly via a Filament render hook so it
   ships with a plain `git pull` on cPanel (no npm/vite on the server).
   Targets Filament v3.3's own stable `fi-*` classes -- nothing here touches
   PHP/Blade logic, only how the existing markup is painted. */

:root {
    --aj-radius-sm: 0.5rem;
    --aj-radius-md: 0.75rem;
    --aj-radius-lg: 1rem;
    --aj-shadow-soft: 0 1px 2px rgba(15, 15, 15, 0.04), 0 6px 20px -6px rgba(15, 15, 15, 0.10);
    --aj-shadow-softer: 0 1px 2px rgba(15, 15, 15, 0.03), 0 3px 10px -3px rgba(15, 15, 15, 0.06);
    --aj-shadow-lift: 0 4px 14px -2px rgba(160, 24, 24, 0.18), 0 2px 6px -2px rgba(15, 15, 15, 0.10);
    --aj-ease: cubic-bezier(0.4, 0, 0.2, 1);
}

/* ---------- Global feel ---------- */

.fi-body {
    -webkit-font-smoothing: antialiased;
    letter-spacing: -0.006em;
}

.fi-body,
.fi-body * {
    scrollbar-width: thin;
    scrollbar-color: rgba(160, 24, 24, 0.25) transparent;
}

.fi-body::-webkit-scrollbar,
.fi-sidebar-nav::-webkit-scrollbar,
.fi-ta-ctn::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.fi-body::-webkit-scrollbar-thumb,
.fi-sidebar-nav::-webkit-scrollbar-thumb,
.fi-ta-ctn::-webkit-scrollbar-thumb {
    background-color: rgba(160, 24, 24, 0.22);
    border-radius: 999px;
}

.fi-body::-webkit-scrollbar-track,
.fi-sidebar-nav::-webkit-scrollbar-track,
.fi-ta-ctn::-webkit-scrollbar-track {
    background: transparent;
}

a, button, .fi-btn, .fi-sidebar-item-button, .fi-ta-row, .fi-badge, .fi-input-wrp {
    transition-timing-function: var(--aj-ease);
}

/* ---------- Sidebar ---------- */

.fi-sidebar {
    border-inline-end: 1px solid rgba(15, 15, 15, 0.06);
}

.dark .fi-sidebar {
    border-inline-end: 1px solid rgba(255, 255, 255, 0.06);
}

.fi-sidebar-header {
    border-bottom: 1px solid rgba(15, 15, 15, 0.06);
}

.dark .fi-sidebar-header {
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.fi-sidebar-group-label {
    text-transform: uppercase;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    opacity: 0.75;
}

.fi-sidebar-item-button {
    border-radius: var(--aj-radius-sm);
    transition-property: background-color, color, transform, box-shadow;
    transition-duration: 150ms;
}

.fi-sidebar-item-button:hover {
    transform: translateX(2px);
}

.fi-sidebar-item.fi-active > .fi-sidebar-item-button {
    background: linear-gradient(90deg, rgba(160, 24, 24, 0.10), rgba(160, 24, 24, 0.04));
    box-shadow: inset 3px 0 0 0 rgb(160, 24, 24);
}

.dark .fi-sidebar-item.fi-active > .fi-sidebar-item-button {
    background: linear-gradient(90deg, rgba(160, 24, 24, 0.22), rgba(160, 24, 24, 0.06));
}

.fi-sidebar-item-label {
    font-weight: 500;
}

/* ---------- Topbar ---------- */

.fi-topbar > nav {
    backdrop-filter: saturate(1.1) blur(6px);
    -webkit-backdrop-filter: saturate(1.1) blur(6px);
}

/* ---------- Page header ---------- */

.fi-header-heading {
    letter-spacing: -0.015em;
}

.fi-header-subheading {
    opacity: 0.85;
}

/* ---------- Cards / sections ---------- */

.fi-section {
    border-radius: var(--aj-radius-lg) !important;
    box-shadow: var(--aj-shadow-soft) !important;
    border: 1px solid rgba(15, 15, 15, 0.055) !important;
}

.dark .fi-section {
    border-color: rgba(255, 255, 255, 0.06) !important;
}

.fi-section-header {
    padding-bottom: 0.25rem;
}

.fi-section-content-ctn {
    border-radius: var(--aj-radius-lg);
}

/* ---------- Buttons ---------- */

.fi-btn {
    border-radius: var(--aj-radius-sm) !important;
    transition-property: transform, box-shadow, background-color, filter;
    transition-duration: 130ms;
}

.fi-btn:not(.fi-btn-outlined):hover {
    transform: translateY(-1px);
}

.fi-btn-color-primary:not(.fi-btn-outlined) {
    box-shadow: var(--aj-shadow-lift);
}

.fi-btn:active {
    transform: translateY(0);
}

/* ---------- Badges ---------- */

.fi-badge {
    border-radius: 999px !important;
    font-weight: 600;
    letter-spacing: 0.01em;
    border-width: 0 !important;
    box-shadow: none !important;
}

/* ---------- Inputs ---------- */

.fi-input-wrp {
    border-radius: var(--aj-radius-sm) !important;
    box-shadow: 0 1px 2px rgba(15, 15, 15, 0.03) !important;
    transition-property: box-shadow, border-color;
    transition-duration: 130ms;
}

.fi-input-wrp:focus-within {
    box-shadow: 0 0 0 3px rgba(160, 24, 24, 0.14) !important;
}

/* Read-only / disabled fields get a visibly distinct "system-generated"
   look, since several fields in this app (batch codes, contract numbers)
   are intentionally locked and derived rather than typed. */
.fi-input-wrp:has(.fi-input:disabled),
.fi-input-wrp:has(.fi-input[readonly]) {
    background-color: rgba(15, 15, 15, 0.025);
}

.dark .fi-input-wrp:has(.fi-input:disabled),
.dark .fi-input-wrp:has(.fi-input[readonly]) {
    background-color: rgba(255, 255, 255, 0.03);
}

/* ---------- Tables ---------- */

.fi-ta-ctn {
    border-radius: var(--aj-radius-lg) !important;
    box-shadow: var(--aj-shadow-soft) !important;
    border: 1px solid rgba(15, 15, 15, 0.055) !important;
}

.dark .fi-ta-ctn {
    border-color: rgba(255, 255, 255, 0.06) !important;
}

.fi-ta-header-cell {
    text-transform: uppercase;
    font-size: 0.68rem;
    letter-spacing: 0.06em;
}

.fi-ta-row {
    transition-property: background-color;
    transition-duration: 120ms;
}

.fi-ta-row:hover {
    background-color: rgba(160, 24, 24, 0.035) !important;
}

.dark .fi-ta-row:hover {
    background-color: rgba(160, 24, 24, 0.08) !important;
}

/* ---------- Stats widgets ---------- */

.fi-wi-stats-overview-stat {
    position: relative;
    border-radius: var(--aj-radius-lg) !important;
    box-shadow: var(--aj-shadow-soft) !important;
    border: 1px solid rgba(15, 15, 15, 0.055) !important;
    border-inline-start-width: 4px !important;
    transition: transform 150ms var(--aj-ease), box-shadow 150ms var(--aj-ease);
}

.fi-wi-stats-overview-stat:hover {
    transform: translateY(-3px);
    box-shadow: var(--aj-shadow-lift) !important;
}

.dark .fi-wi-stats-overview-stat {
    border-color: rgba(255, 255, 255, 0.06) !important;
}

/* Semantic accent -- the description icon carries a real fi-color-* class,
   so :has() lets the whole card (and its main icon badge) pick up the same
   color even though Filament's own Stat::color() isn't actually rendered
   by this version's blade template. */
.fi-wi-stats-overview-stat:has(.fi-color-success) { border-inline-start-color: var(--aj-success, #15803d) !important; }
.fi-wi-stats-overview-stat:has(.fi-color-danger) { border-inline-start-color: var(--aj-danger, #b42318) !important; }
.fi-wi-stats-overview-stat:has(.fi-color-warning) { border-inline-start-color: var(--aj-warning, #b45309) !important; }
.fi-wi-stats-overview-stat:has(.fi-color-info) { border-inline-start-color: #1d4ed8 !important; }
.fi-wi-stats-overview-stat:not(:has(.fi-color-success, .fi-color-danger, .fi-color-warning, .fi-color-info)) {
    border-inline-start-color: rgb(160, 24, 24) !important;
}

.fi-wi-stats-overview-stat-label {
    text-transform: uppercase;
    font-size: 0.68rem;
    letter-spacing: 0.06em;
    font-weight: 700;
}

.fi-wi-stats-overview-stat-value {
    font-size: 1.85rem !important;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.025em;
}

.fi-wi-stats-overview-stat-icon {
    padding: 0.5rem;
    border-radius: 999px;
    background-color: rgba(160, 24, 24, 0.10);
    color: rgb(160, 24, 24);
}

.dark .fi-wi-stats-overview-stat-icon {
    background-color: rgba(160, 24, 24, 0.18);
}

.fi-wi-stats-overview-stat:has(.fi-color-success) .fi-wi-stats-overview-stat-icon { background-color: rgba(21, 128, 61, 0.12); color: var(--aj-success, #15803d); }
.fi-wi-stats-overview-stat:has(.fi-color-danger) .fi-wi-stats-overview-stat-icon { background-color: rgba(180, 35, 24, 0.12); color: var(--aj-danger, #b42318); }
.fi-wi-stats-overview-stat:has(.fi-color-warning) .fi-wi-stats-overview-stat-icon { background-color: rgba(180, 83, 9, 0.14); color: var(--aj-warning, #b45309); }
.fi-wi-stats-overview-stat:has(.fi-color-info) .fi-wi-stats-overview-stat-icon { background-color: rgba(29, 78, 216, 0.12); color: #1d4ed8; }

/* ---------- Bento dashboard grid ---------- */

.fi-dashboard-page .fi-wi {
    gap: 1.5rem !important;
}

.fi-dashboard-page .fi-wi-chart .fi-section,
.fi-dashboard-page .fi-wi-table .fi-section {
    height: 100%;
}

/* ---------- Dropdowns & modals ---------- */

.fi-dropdown-panel {
    border-radius: var(--aj-radius-md) !important;
    box-shadow: var(--aj-shadow-soft) !important;
}

.fi-modal-window {
    border-radius: var(--aj-radius-lg) !important;
    box-shadow: 0 20px 50px -12px rgba(15, 15, 15, 0.25) !important;
}

/* ---------- Login / simple pages ---------- */

.fi-simple-main {
    border-radius: var(--aj-radius-lg) !important;
    box-shadow: var(--aj-shadow-soft) !important;
    position: relative;
    overflow: hidden;
}

.fi-simple-main::before {
    content: '';
    position: absolute;
    inset: 0 0 auto 0;
    height: 4px;
    background: linear-gradient(90deg, rgb(160, 24, 24), rgba(160, 24, 24, 0.35));
}

.fi-simple-header {
    gap: 0.5rem;
}

/* ---------- Financial Report (Cashflow & P&L) ---------- */

:root {
    --aj-success: #15803d;
    --aj-danger: #b42318;
    --aj-warning: #b45309;
    --aj-ink: #0f172a;
    --aj-muted: #64748b;
    --aj-card-bg: #ffffff;
    --aj-card-border: rgba(15, 15, 15, 0.06);
}

.dark {
    --aj-success: #4ade80;
    --aj-danger: #f87171;
    --aj-warning: #fbbf24;
    --aj-ink: #f8fafc;
    --aj-muted: #94a3b8;
    --aj-card-bg: rgb(24, 24, 27);
    --aj-card-border: rgba(255, 255, 255, 0.08);
}

.aj-pl-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    flex-wrap: wrap;
    background: linear-gradient(135deg, #1c1c1f, #0b0b0c);
    border-radius: var(--aj-radius-lg);
    box-shadow: var(--aj-shadow-soft);
    padding: 1.75rem 2rem;
    color: #f4f4f5;
}

.aj-pl-eyebrow {
    text-transform: uppercase;
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    font-weight: 700;
    color: #a1a1aa;
}

.aj-pl-hero-value {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    font-size: 2.4rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    margin-top: 0.35rem;
    font-variant-numeric: tabular-nums;
}

.aj-pl-hero-value.is-up { color: var(--aj-success); }
.aj-pl-hero-value.is-down { color: var(--aj-danger); }

.aj-pl-hero-sub {
    color: #d4d4d8;
    font-size: 0.9rem;
    margin-top: 0.35rem;
}

.aj-pl-gauge {
    --pct: 0;
    width: 128px;
    height: 128px;
    border-radius: 50%;
    background: conic-gradient(rgb(160, 24, 24) calc(var(--pct) * 1%), rgba(255, 255, 255, 0.12) 0);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.aj-pl-gauge-inner {
    width: 98px;
    height: 98px;
    border-radius: 50%;
    background: #0b0b0c;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.aj-pl-gauge-value {
    font-size: 1.35rem;
    font-weight: 800;
    color: #fff;
    font-variant-numeric: tabular-nums;
}

.aj-pl-gauge-label {
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #a1a1aa;
}

.aj-pl-card {
    background: var(--aj-card-bg);
    border: 1px solid var(--aj-card-border);
    border-radius: var(--aj-radius-lg);
    box-shadow: var(--aj-shadow-soft);
    padding: 1.5rem 1.75rem;
}

.aj-pl-card-title {
    font-size: 1rem;
    font-weight: 700;
    color: var(--aj-ink);
    margin-bottom: 1.25rem;
}

.aj-pl-empty {
    color: var(--aj-muted);
    font-size: 0.9rem;
    padding: 1rem 0;
}

.aj-pl-composition {
    display: flex;
    align-items: center;
    gap: 2.5rem;
    flex-wrap: wrap;
}

.aj-pl-donut {
    width: 160px;
    height: 160px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.aj-pl-donut-hole {
    width: 112px;
    height: 112px;
    border-radius: 50%;
    background: var(--aj-card-bg);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-shadow: var(--aj-shadow-softer);
}

.aj-pl-donut-value {
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--aj-ink);
    font-variant-numeric: tabular-nums;
}

.aj-pl-donut-label {
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--aj-muted);
}

.aj-pl-legend {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    flex: 1;
    min-width: 260px;
}

.aj-pl-legend-row {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.aj-pl-dot {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    flex-shrink: 0;
}

.aj-pl-legend-label {
    color: var(--aj-ink);
    font-weight: 600;
    font-size: 0.88rem;
}

.aj-pl-legend-pct {
    color: var(--aj-muted);
    font-size: 0.8rem;
    margin-inline-start: auto;
}

.aj-pl-legend-amt {
    font-weight: 700;
    color: var(--aj-ink);
    font-variant-numeric: tabular-nums;
    min-width: 9.5rem;
    text-align: right;
}

.aj-pl-tile {
    background: var(--aj-card-bg);
    border: 1px solid var(--aj-card-border);
    border-radius: var(--aj-radius-lg);
    box-shadow: var(--aj-shadow-soft);
    padding: 1.4rem 1.5rem;
}

.aj-pl-tile-top {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 0.6rem;
}

.aj-pl-tile-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 999px;
}

.aj-pl-tile-icon.is-success { background: rgba(21, 128, 61, 0.12); color: var(--aj-success); }
.aj-pl-tile-icon.is-danger { background: rgba(180, 35, 24, 0.12); color: var(--aj-danger); }
.aj-pl-tile-icon.is-warning { background: rgba(180, 83, 9, 0.14); color: var(--aj-warning); }

.aj-pl-tile-label {
    text-transform: uppercase;
    font-size: 0.7rem;
    letter-spacing: 0.06em;
    font-weight: 700;
    color: var(--aj-muted);
}

.aj-pl-tile-value {
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--aj-ink);
    letter-spacing: -0.01em;
    font-variant-numeric: tabular-nums;
    margin-bottom: 0.6rem;
}

.aj-pl-bar {
    height: 6px;
    border-radius: 999px;
    background: rgba(15, 15, 15, 0.07);
    overflow: hidden;
    margin-bottom: 0.6rem;
}

.dark .aj-pl-bar {
    background: rgba(255, 255, 255, 0.08);
}

.aj-pl-bar-fill {
    height: 100%;
    border-radius: 999px;
}

.aj-pl-bar-fill.is-success { background: var(--aj-success); }
.aj-pl-bar-fill.is-danger { background: var(--aj-danger); }
.aj-pl-bar-fill.is-warning { background: var(--aj-warning); }

.aj-pl-tile-sub {
    font-size: 0.78rem;
    color: var(--aj-muted);
}

.aj-pl-pictograms {
    display: flex;
    flex-wrap: wrap;
    gap: 0.9rem;
}

.aj-pl-pictogram {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    background: rgba(160, 24, 24, 0.06);
    border-radius: var(--aj-radius-md);
    padding: 0.75rem 1.1rem;
}

.dark .aj-pl-pictogram {
    background: rgba(160, 24, 24, 0.14);
}

.aj-pl-pictogram-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 999px;
    background: rgb(160, 24, 24);
    color: #fff;
}

.aj-pl-pictogram-value {
    font-weight: 800;
    font-size: 1.1rem;
    color: var(--aj-ink);
    font-variant-numeric: tabular-nums;
}

.aj-pl-pictogram-unit {
    font-size: 0.78rem;
    color: var(--aj-muted);
    margin-inline-start: 0.3rem;
    text-transform: capitalize;
}

.aj-pl-breakdown {
    display: flex;
    flex-direction: column;
}

.aj-pl-breakdown-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 0;
    border-bottom: 1px solid var(--aj-card-border);
    color: var(--aj-muted);
    font-size: 0.9rem;
}

.aj-pl-breakdown-row:last-of-type {
    border-bottom: none;
}

.aj-pl-breakdown-value {
    font-weight: 700;
    color: var(--aj-ink);
    font-variant-numeric: tabular-nums;
}

.aj-pl-breakdown-value.is-success { color: var(--aj-success); }
.aj-pl-breakdown-value.is-danger { color: var(--aj-danger); }
.aj-pl-breakdown-value.is-warning { color: var(--aj-warning); }

.aj-pl-breakdown-total {
    background: rgba(160, 24, 24, 0.06);
    border-radius: var(--aj-radius-sm);
    padding: 0.9rem 1rem;
    margin-top: 0.5rem;
    border-bottom: none;
}

.dark .aj-pl-breakdown-total {
    background: rgba(160, 24, 24, 0.14);
}

.aj-pl-breakdown-total span:first-child {
    color: var(--aj-ink);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 0.8rem;
}

.aj-pl-breakdown-total .aj-pl-breakdown-value {
    font-size: 1.2rem;
}

/* ---------- Master Ledger explainer ---------- */

.aj-ml-explainer {
    background: var(--aj-card-bg, #fff);
    border: 1px solid var(--aj-card-border, rgba(15, 15, 15, 0.06));
    border-radius: var(--aj-radius-lg);
    box-shadow: var(--aj-shadow-soft);
    padding: 1.25rem 1.5rem;
}

.aj-ml-explainer-title {
    font-weight: 800;
    font-size: 0.95rem;
    color: var(--aj-ink, #0f172a);
    margin: 0 0 0.4rem;
}

.aj-ml-explainer-body {
    color: var(--aj-muted, #64748b);
    font-size: 0.88rem;
    margin: 0 0 0.9rem;
}

.aj-ml-explainer-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
}

.aj-ml-legend-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
    color: var(--aj-ink, #0f172a);
}

.aj-ml-legend-dot {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    flex-shrink: 0;
}

.aj-ml-legend-dot.is-success { background: var(--aj-success, #15803d); }
.aj-ml-legend-dot.is-danger { background: var(--aj-danger, #b42318); }
.aj-ml-legend-dot.is-info { background: #1d4ed8; }

/* ---------- Financial Report date filter ---------- */

.aj-pl-filter {
    display: flex;
    align-items: end;
    gap: 1rem;
    flex-wrap: wrap;
    background: var(--aj-card-bg, #fff);
    border: 1px solid var(--aj-card-border, rgba(15, 15, 15, 0.06));
    border-radius: var(--aj-radius-lg);
    box-shadow: var(--aj-shadow-softer);
    padding: 1rem 1.25rem;
}

.aj-pl-filter-field {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.aj-pl-filter-field label {
    font-size: 0.68rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: 700;
    color: var(--aj-muted, #64748b);
}

.aj-pl-filter-input {
    border: 1px solid var(--aj-card-border, rgba(15, 15, 15, 0.1));
    border-radius: var(--aj-radius-sm);
    padding: 0.45rem 0.75rem;
    font-size: 0.88rem;
    background: transparent;
    color: var(--aj-ink, #0f172a);
    min-width: 10rem;
}

.aj-pl-filter-input:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(160, 24, 24, 0.14);
}

.aj-pl-filter-submit {
    background: rgb(160, 24, 24);
    color: #fff;
    border: none;
    border-radius: var(--aj-radius-sm);
    padding: 0.55rem 1.4rem;
    font-size: 0.85rem;
    font-weight: 700;
    cursor: pointer;
    transition: transform 130ms ease, box-shadow 130ms ease;
}

.aj-pl-filter-submit:hover {
    transform: translateY(-1px);
    box-shadow: var(--aj-shadow-lift);
}
