/*
 * PRMIS admin theme - small, static overrides on top of Filament.
 * Loaded once via a <link> (no per-request Blade compilation).
 */

/* ---------- Typography ---------- */
/* Inter (panel font) and JetBrains Mono both come from Google Fonts. */
.font-mono,
.fi-font-mono {
    font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-feature-settings: 'zero' 0;
}

/* Counters and figures line up without jumping while they tick. */
.tabular-nums {
    font-variant-numeric: tabular-nums;
}

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

/* ---------- Sidebar: blue panel, white text ---------- */
/*
 * Light mode: royal-to-navy gradient. Dark mode: deep navy so it does not glare.
 * Selectors use aside.fi-sidebar so they outrank Filament's bg-white / dark:bg-gray-900.
 */
aside.fi-sidebar {
    --sb-bg: linear-gradient(180deg, #1e40af 0%, #1e3a8a 45%, #172554 100%);
    --sb-text: rgb(255 255 255 / 0.86);
    --sb-muted: rgb(219 234 254 / 0.6);
    --sb-icon: rgb(191 219 254 / 0.85);
    --sb-hover: rgb(255 255 255 / 0.1);
    --sb-active-bg: #ffffff;
    --sb-active-text: #1e40af;
    --sb-active-icon: #2563eb;
    --sb-divider: rgb(255 255 255 / 0.1);
    --sb-accent: #fbbf24;

    background: var(--sb-bg) !important;
    box-shadow: 1px 0 0 rgb(15 23 42 / 0.06);
}

.dark aside.fi-sidebar {
    --sb-bg: linear-gradient(180deg, #0f1f4d 0%, #0b1838 55%, #081028 100%);
    --sb-text: rgb(226 232 240 / 0.82);
    --sb-muted: rgb(148 163 184 / 0.75);
    --sb-icon: rgb(147 197 253 / 0.7);
    --sb-hover: rgb(255 255 255 / 0.06);
    --sb-active-bg: rgb(59 130 246 / 0.2);
    --sb-active-text: #ffffff;
    --sb-active-icon: #93c5fd;
    --sb-divider: rgb(255 255 255 / 0.07);
    box-shadow: 1px 0 0 rgb(255 255 255 / 0.06);
}

/* Desktop: Filament makes the sidebar transparent; keep it blue. */
@media (min-width: 1024px) {
    aside.fi-sidebar {
        background: var(--sb-bg) !important;
    }
}

aside.fi-sidebar .fi-sidebar-header {
    background: transparent;
    box-shadow: none;
    --tw-ring-color: transparent;
    border-bottom: 1px solid var(--sb-divider);
}

/* Header buttons (collapse / expand) */
aside.fi-sidebar .fi-sidebar-header .fi-icon-btn,
aside.fi-sidebar .fi-sidebar-group-collapse-button {
    color: var(--sb-muted);
}

aside.fi-sidebar .fi-sidebar-header .fi-icon-btn:hover,
aside.fi-sidebar .fi-sidebar-group-collapse-button:hover {
    color: #ffffff;
    background: var(--sb-hover);
}

/* Brand text in the sidebar */
aside.fi-sidebar .prmis-brand__name { color: #ffffff; }
aside.fi-sidebar .prmis-brand__sub { color: var(--sb-muted); }

/* Group labels */
.fi-sidebar-group-label {
    font-size: 0.6875rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

aside.fi-sidebar .fi-sidebar-group-label { color: var(--sb-muted); }
aside.fi-sidebar .fi-sidebar-group-icon { color: var(--sb-muted); }

aside.fi-sidebar .fi-sidebar-group-button:hover .fi-sidebar-group-label {
    color: #ffffff;
}

/* Items */
aside.fi-sidebar .fi-sidebar-item-button {
    position: relative;
    transition: background-color 140ms ease, color 140ms ease, transform 140ms ease;
}

aside.fi-sidebar .fi-sidebar-item-label { color: var(--sb-text); }
aside.fi-sidebar .fi-sidebar-item-icon { color: var(--sb-icon); }

aside.fi-sidebar .fi-sidebar-item-button:hover,
aside.fi-sidebar .fi-sidebar-item-button:focus-visible {
    background-color: var(--sb-hover);
}

aside.fi-sidebar .fi-sidebar-item-button:hover .fi-sidebar-item-label,
aside.fi-sidebar .fi-sidebar-item-button:hover .fi-sidebar-item-icon {
    color: #ffffff;
}

aside.fi-sidebar .fi-sidebar-item-button:focus-visible {
    outline: 2px solid var(--sb-accent);
    outline-offset: -2px;
}

/* Active item: white pill in light mode, glowing blue in dark mode, gold edge marker. */
aside.fi-sidebar .fi-sidebar-item-active .fi-sidebar-item-button,
aside.fi-sidebar .fi-sidebar-item-active .fi-sidebar-item-button:hover {
    background: var(--sb-active-bg);
    box-shadow: 0 6px 16px -8px rgb(2 6 23 / 0.55);
}

aside.fi-sidebar .fi-sidebar-item-active .fi-sidebar-item-button::before {
    content: '';
    position: absolute;
    inset-block: 0.45rem;
    inset-inline-start: -0.5rem;
    width: 4px;
    border-radius: 9999px;
    background: var(--sb-accent);
}

aside.fi-sidebar .fi-sidebar-item-active .fi-sidebar-item-label,
aside.fi-sidebar .fi-sidebar-item-active .fi-sidebar-item-button:hover .fi-sidebar-item-label {
    color: var(--sb-active-text);
    font-weight: 600;
}

aside.fi-sidebar .fi-sidebar-item-active .fi-sidebar-item-icon,
aside.fi-sidebar .fi-sidebar-item-active .fi-sidebar-item-button:hover .fi-sidebar-item-icon {
    color: var(--sb-active-icon);
}

/* Grouped (child) item connector lines */
aside.fi-sidebar .fi-sidebar-item-grouped-border > div {
    background-color: var(--sb-divider);
}

aside.fi-sidebar .fi-sidebar-item-grouped-border > div.rounded-full {
    background-color: var(--sb-muted);
}

aside.fi-sidebar .fi-sidebar-item-active .fi-sidebar-item-grouped-border > div.rounded-full {
    background-color: var(--sb-active-icon);
}

/* Badges: soft white chips; red stays red so urgent counts pop. */
aside.fi-sidebar .fi-badge {
    background: rgb(255 255 255 / 0.16);
    color: #ffffff;
    --tw-ring-color: rgb(255 255 255 / 0.22);
}

aside.fi-sidebar .fi-badge.fi-color-danger {
    background: #ef4444;
    color: #ffffff;
    --tw-ring-color: transparent;
}

aside.fi-sidebar .fi-sidebar-item-active .fi-badge:not(.fi-color-danger) {
    background: rgb(37 99 235 / 0.12);
    color: #1d4ed8;
    --tw-ring-color: rgb(37 99 235 / 0.25);
}

.dark aside.fi-sidebar .fi-sidebar-item-active .fi-badge:not(.fi-color-danger) {
    background: rgb(255 255 255 / 0.15);
    color: #ffffff;
}

aside.fi-sidebar .fi-badge .fi-badge-label,
aside.fi-sidebar .fi-badge span { color: inherit; }

/* Thin scrollbar on the blue panel */
aside.fi-sidebar .fi-sidebar-nav {
    scrollbar-width: thin;
    scrollbar-color: rgb(255 255 255 / 0.25) transparent;
}

aside.fi-sidebar .fi-sidebar-nav::-webkit-scrollbar { width: 6px; }
aside.fi-sidebar .fi-sidebar-nav::-webkit-scrollbar-thumb { background: rgb(255 255 255 / 0.22); border-radius: 9999px; }

/* Brand mark (seal) */
.prmis-brand__seal {
    width: 2.4rem;
    height: 2.4rem;
    flex-shrink: 0;
    filter: drop-shadow(0 2px 6px rgb(2 6 23 / 0.35));
}

.prmis-brand__name {
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: rgb(var(--gray-950));
}

.prmis-brand__sub {
    font-size: 11px;
    font-weight: 500;
    color: rgb(var(--gray-500));
}

.dark .prmis-brand__name { color: #ffffff; }
.dark .prmis-brand__sub { color: rgb(var(--gray-400)); }

/* ---------- Page transition feedback (SPA mode) ---------- */
/* Livewire's navigate progress bar, in the brand colour and a touch thicker. */
#nprogress .bar {
    background: rgb(var(--primary-600)) !important;
    height: 3px !important;
}

#nprogress .peg {
    box-shadow: 0 0 8px rgb(var(--primary-600)), 0 0 4px rgb(var(--primary-600)) !important;
}

/* ---------- Tables ---------- */
.fi-ta-row {
    transition: background-color 100ms ease;
}

/* ---------- Dashboard ---------- */
/* Layout classes live here because Filament's prebuilt CSS only contains the
   Tailwind utilities Filament itself uses. */
.prmis-overview {
    display: grid;
    gap: 1.5rem;
    grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 1024px) {
    .prmis-overview {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .prmis-overview__main {
        grid-column: span 2 / span 2;
    }
}

.prmis-greeting {
    margin-bottom: 1.25rem;
}

.prmis-greeting h2 {
    font-size: 1.25rem;
    font-weight: 600;
    letter-spacing: -0.015em;
    color: rgb(var(--gray-950));
}

.prmis-greeting p {
    margin-top: 0.25rem;
    font-size: 0.875rem;
    color: rgb(var(--gray-500));
}

.dark .prmis-greeting h2 {
    color: #fff;
}

.dark .prmis-greeting p {
    color: rgb(var(--gray-400));
}

.prmis-actions {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 640px) {
    .prmis-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1280px) {
    .prmis-actions {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.prmis-quick-action__text {
    min-width: 0;
}

.prmis-quick-action__label,
.prmis-quick-action__hint {
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.prmis-quick-action__label {
    font-size: 0.875rem;
    font-weight: 500;
    color: rgb(var(--gray-950));
}

.prmis-quick-action__hint {
    font-size: 0.75rem;
    color: rgb(var(--gray-500));
}

.dark .prmis-quick-action__label {
    color: #fff;
}

.dark .prmis-quick-action__hint {
    color: rgb(var(--gray-400));
}

.prmis-quick-action__ext {
    margin-inline-start: auto;
    flex: none;
    color: rgb(var(--gray-400));
}

.prmis-alerts {
    margin: -0.5rem 0;
}

.prmis-alert-row__icon {
    width: 1.25rem;
    height: 1.25rem;
    flex: none;
}

.prmis-tone-danger .prmis-alert-row__icon { color: rgb(var(--danger-600)); }
.prmis-tone-warning .prmis-alert-row__icon { color: rgb(var(--warning-600)); }
.prmis-tone-gray .prmis-alert-row__icon { color: rgb(var(--gray-500)); }
.dark .prmis-tone-danger .prmis-alert-row__icon { color: rgb(var(--danger-400)); }
.dark .prmis-tone-warning .prmis-alert-row__icon { color: rgb(var(--warning-400)); }

.prmis-alert-row__label {
    flex: 1;
    font-size: 0.875rem;
    color: rgb(var(--gray-700));
}

.dark .prmis-alert-row__label {
    color: rgb(var(--gray-200));
}

.prmis-alert-row__count {
    font-size: 0.875rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: rgb(var(--gray-950));
}

.dark .prmis-alert-row__count {
    color: #fff;
}

.prmis-alert-row__chevron {
    width: 1rem;
    height: 1rem;
    flex: none;
    color: rgb(var(--gray-400));
}

.prmis-alert-row.is-static {
    pointer-events: none;
}

.prmis-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.375rem;
    padding: 1.5rem 0;
    text-align: center;
}

.prmis-empty__icon {
    width: 2rem;
    height: 2rem;
    color: rgb(var(--success-500));
}

.prmis-empty__title {
    font-size: 0.875rem;
    font-weight: 500;
    color: rgb(var(--gray-950));
}

.prmis-empty__text {
    font-size: 0.75rem;
    color: rgb(var(--gray-500));
}

.dark .prmis-empty__title {
    color: #fff;
}

.prmis-quick-action {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 0.875rem;
    border-radius: 0.75rem;
    border: 1px solid rgb(var(--gray-200));
    background: #fff;
    transition: border-color 120ms ease, background-color 120ms ease;
}

.prmis-quick-action:hover {
    border-color: rgb(var(--primary-400));
    background: rgb(var(--primary-50));
}

.prmis-quick-action:focus-visible {
    outline: 2px solid rgb(var(--primary-600));
    outline-offset: 2px;
}

.dark .prmis-quick-action {
    border-color: rgb(255 255 255 / 0.1);
    background: rgb(var(--gray-900));
}

.dark .prmis-quick-action:hover {
    border-color: rgb(var(--primary-500) / 0.6);
    background: rgb(var(--primary-500) / 0.08);
}

.prmis-quick-action__icon {
    display: grid;
    place-items: center;
    flex: none;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 0.5rem;
    background: rgb(var(--primary-50));
    color: rgb(var(--primary-700));
}

.dark .prmis-quick-action__icon {
    background: rgb(var(--primary-500) / 0.12);
    color: rgb(var(--primary-400));
}

.prmis-alert-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.625rem 0.25rem;
    border-radius: 0.5rem;
    transition: background-color 120ms ease;
}

.prmis-alert-row:hover {
    background: rgb(var(--gray-50));
}

.dark .prmis-alert-row:hover {
    background: rgb(255 255 255 / 0.04);
}

.prmis-alert-row + .prmis-alert-row {
    border-top: 1px solid rgb(var(--gray-100));
}

.dark .prmis-alert-row + .prmis-alert-row {
    border-top-color: rgb(255 255 255 / 0.06);
}

/* Stat cards that link somewhere get a hover cue */
a.fi-wi-stats-overview-stat {
    transition: box-shadow 120ms ease, transform 120ms ease;
}

a.fi-wi-stats-overview-stat:hover {
    box-shadow: 0 0 0 1px rgb(var(--primary-400));
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        transition: none !important;
    }
}

/* ---------- Generic page helpers ---------- */
.prmis-stack {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.prmis-stat-row {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
}

.prmis-stat__label {
    font-size: 0.875rem;
    color: rgb(var(--gray-500));
}

.prmis-stat__value {
    margin-top: 0.25rem;
    font-size: 1.75rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: rgb(var(--gray-950));
}

.dark .prmis-stat__value {
    color: #fff;
}

.prmis-enroll-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.prmis-progress {
    margin-top: 1.25rem;
}

.prmis-progress__meta {
    display: flex;
    justify-content: space-between;
    font-size: 0.875rem;
    color: rgb(var(--gray-600));
    margin-bottom: 0.375rem;
}

.dark .prmis-progress__meta {
    color: rgb(var(--gray-300));
}

.prmis-progress__track {
    height: 0.5rem;
    border-radius: 9999px;
    background: rgb(var(--gray-200));
    overflow: hidden;
}

.dark .prmis-progress__track {
    background: rgb(255 255 255 / 0.1);
}

.prmis-progress__bar {
    height: 100%;
    border-radius: 9999px;
    background: rgb(var(--primary-600));
    transition: width 200ms ease;
}

.prmis-progress__current {
    margin-top: 0.375rem;
    font-size: 0.75rem;
    color: rgb(var(--gray-500));
}

[x-cloak] {
    display: none !important;
}

/* ---------- Reports ---------- */
.prmis-reports {
    display: grid;
    gap: 1.5rem;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
}

@media (min-width: 1024px) {
    .prmis-reports {
        grid-template-columns: 17rem minmax(0, 1fr);
    }

    .prmis-reports__nav {
        position: sticky;
        top: 5rem;
    }
}

.prmis-report-list {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.prmis-report-list__item {
    display: flex;
    align-items: flex-start;
    gap: 0.625rem;
    width: 100%;
    padding: 0.5rem 0.625rem;
    border-radius: 0.5rem;
    text-align: left;
    font-size: 0.875rem;
    line-height: 1.3;
    color: rgb(var(--gray-700));
    transition: background-color 120ms ease, color 120ms ease;
}

.prmis-report-list__item:hover {
    background: rgb(var(--gray-50));
}

.prmis-report-list__item.is-active {
    background: rgb(var(--primary-50));
    color: rgb(var(--primary-800));
    font-weight: 500;
}

.dark .prmis-report-list__item { color: rgb(var(--gray-300)); }
.dark .prmis-report-list__item:hover { background: rgb(255 255 255 / 0.05); }
.dark .prmis-report-list__item.is-active { background: rgb(var(--primary-500) / 0.12); color: rgb(var(--primary-300)); }

.prmis-report-list__num {
    flex: none;
    width: 1.25rem;
    font-variant-numeric: tabular-nums;
    color: rgb(var(--gray-400));
}

.prmis-report-filters {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: minmax(0, 1fr);
    align-items: end;
}

@media (min-width: 768px) {
    .prmis-report-filters {
        grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr) auto;
    }
}

.prmis-field {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.prmis-field__label {
    font-size: 0.875rem;
    font-weight: 500;
    color: rgb(var(--gray-950));
}

.dark .prmis-field__label { color: #fff; }

.prmis-report-filters__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.prmis-hint {
    margin-top: 0.75rem;
    font-size: 0.8125rem;
    color: rgb(var(--gray-500));
}

.dark .prmis-hint { color: rgb(var(--gray-400)); }

.prmis-summary {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
    margin-bottom: 1.25rem;
}

.prmis-summary__item {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    padding: 0.75rem 1rem;
    border-radius: 0.75rem;
    border: 1px solid rgb(var(--gray-200));
}

.dark .prmis-summary__item { border-color: rgb(255 255 255 / 0.1); }

.prmis-summary__value {
    font-size: 1.375rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: rgb(var(--gray-950));
}

.dark .prmis-summary__value { color: #fff; }

.prmis-summary__label {
    font-size: 0.8125rem;
    color: rgb(var(--gray-500));
}

.prmis-table-wrap {
    overflow-x: auto;
    border: 1px solid rgb(var(--gray-200));
    border-radius: 0.75rem;
}

.dark .prmis-table-wrap { border-color: rgb(255 255 255 / 0.1); }

.prmis-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8125rem;
}

.prmis-table th {
    position: sticky;
    top: 0;
    padding: 0.625rem 0.75rem;
    text-align: left;
    font-weight: 600;
    white-space: nowrap;
    color: rgb(var(--gray-950));
    background: rgb(var(--gray-50));
    border-bottom: 1px solid rgb(var(--gray-200));
}

.prmis-table td {
    padding: 0.5rem 0.75rem;
    color: rgb(var(--gray-700));
    border-bottom: 1px solid rgb(var(--gray-100));
    white-space: nowrap;
}

.prmis-table tbody tr:hover td { background: rgb(var(--gray-50)); }
.prmis-table tbody tr:last-child td { border-bottom: 0; }

.dark .prmis-table th { color: #fff; background: rgb(255 255 255 / 0.04); border-bottom-color: rgb(255 255 255 / 0.1); }
.dark .prmis-table td { color: rgb(var(--gray-300)); border-bottom-color: rgb(255 255 255 / 0.05); }
.dark .prmis-table tbody tr:hover td { background: rgb(255 255 255 / 0.03); }

.prmis-table__empty {
    padding: 2rem !important;
    text-align: center;
    color: rgb(var(--gray-500)) !important;
}

.prmis-is-loading {
    opacity: 0.5;
    transition: opacity 150ms ease;
    pointer-events: none;
}

/* ---------- Audit log ---------- */
.prmis-audit-meta {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
    font-size: 0.875rem;
}

.prmis-audit-meta dt { color: rgb(var(--gray-500)); font-size: 0.75rem; }
.prmis-audit-meta dd { margin: 0; color: rgb(var(--gray-950)); }
.dark .prmis-audit-meta dd { color: #fff; }
.prmis-audit-url { word-break: break-all; }

.prmis-table--wrap td { white-space: normal; word-break: break-word; }

.prmis-history-item {
    padding: 0.75rem 1rem;
    border-radius: 0.75rem;
    border: 1px solid rgb(var(--gray-200));
    font-size: 0.875rem;
}

.dark .prmis-history-item { border-color: rgb(255 255 255 / 0.1); }

.prmis-history-item__head {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: baseline;
    color: rgb(var(--gray-950));
}

.prmis-history-item__head span { color: rgb(var(--gray-500)); font-size: 0.8125rem; }
.dark .prmis-history-item__head { color: #fff; }

.prmis-history-item__changes {
    margin-top: 0.5rem;
    padding-left: 1rem;
    list-style: disc;
    color: rgb(var(--gray-700));
}

.dark .prmis-history-item__changes { color: rgb(var(--gray-300)); }
.prmis-history-old { text-decoration: line-through; color: rgb(var(--gray-500)); }

/* ---------- Map picker ---------- */
.prmis-map-picker__map {
    height: 18rem;
    border-radius: 0.75rem;
    border: 1px solid rgb(var(--gray-200));
    overflow: hidden;
    z-index: 0;
}

.dark .prmis-map-picker__map { border-color: rgb(255 255 255 / 0.1); }

.prmis-map-picker__bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

.prmis-map-picker__coords {
    font-size: 0.8125rem;
    font-variant-numeric: tabular-nums;
    color: rgb(var(--gray-600));
}

.dark .prmis-map-picker__coords { color: rgb(var(--gray-300)); }

.prmis-map-picker__buttons { display: flex; gap: 0.5rem; }

.prmis-map-picker__error {
    margin-top: 0.375rem;
    font-size: 0.8125rem;
    color: rgb(var(--danger-600));
}

/* ------------------------------------------------ Service requests / For Elimination */

/* Strays past their 3-day claim window: red accent on the row. */
.fi-ta-row.prmis-row-due {
    background-color: rgb(254 242 242 / 0.6);
    box-shadow: inset 3px 0 0 rgb(220 38 38);
}

.dark .fi-ta-row.prmis-row-due {
    background-color: rgb(127 29 29 / 0.15);
}

/* Service picker cards: keep focus ring above neighbours. */
[role="radiogroup"] > button[role="radio"]:focus-visible {
    z-index: 1;
}