/* ============================================================
   ProcureFlow Design System — Filament 3 Override
   Primary: #16A34A | CTA: #15803D | Tag BG: #DCFCE7
   Text: #0F172A | Muted: #64748B | BG: #F8FAFC
   Font: Inter
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:opsz,wght@14..32,300;14..32,400;14..32,500;14..32,600;14..32,700;14..32,800&display=swap');

/* ── Design Tokens ───────────────────────────────────────── */
:root {
    /* Brand */
    --pf-primary:           #16A34A;
    --pf-primary-dark:      #15803D;
    --pf-primary-hover:     #166534;
    --pf-primary-light:     #DCFCE7;
    --pf-primary-ring:      rgba(22, 163, 74, 0.20);

    /* Surfaces */
    --pf-bg:                #F8FAFC;
    --pf-surface:           #FFFFFF;
    --pf-surface-raised:    #FFFFFF;
    --pf-border:            rgba(15, 23, 42, 0.08);
    --pf-border-strong:     rgba(15, 23, 42, 0.15);

    /* Typography */
    --pf-text:              #0F172A;
    --pf-text-muted:        #64748B;
    --pf-text-subtle:       #94A3B8;

    /* Feedback */
    --pf-error:             #DC2626;
    --pf-error-bg:          #FEF2F2;
    --pf-warning:           #D97706;
    --pf-warning-bg:        #FFFBEB;
    --pf-info:              #0284C7;
    --pf-info-bg:           #F0F9FF;

    /* Shape */
    --pf-radius:            0.5rem;
    --pf-radius-sm:         0.375rem;
    --pf-radius-lg:         0.75rem;
    --pf-radius-full:       9999px;

    /* Elevation */
    --pf-shadow-xs:         0 1px 2px 0 rgba(15, 23, 42, 0.05);
    --pf-shadow-sm:         0 1px 3px 0 rgba(15, 23, 42, 0.07), 0 1px 2px -1px rgba(15, 23, 42, 0.05);
    --pf-shadow:            0 4px 6px -1px rgba(15, 23, 42, 0.06), 0 2px 4px -2px rgba(15, 23, 42, 0.04);
    --pf-shadow-md:         0 10px 15px -3px rgba(15, 23, 42, 0.08), 0 4px 6px -4px rgba(15, 23, 42, 0.05);
    --pf-shadow-lg:         0 20px 25px -5px rgba(15, 23, 42, 0.10), 0 8px 10px -6px rgba(15, 23, 42, 0.06);

    /* Motion */
    --pf-duration-fast:     150ms;
    --pf-duration:          200ms;
    --pf-ease:              cubic-bezier(0.4, 0, 0.2, 1);
}

/* ── Reset ───────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }

/* ── Base ────────────────────────────────────────────────── */
body,
.fi-body {
    font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
    background-color: var(--pf-bg) !important;
    color: var(--pf-text) !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
}

/* ── Sidebar ─────────────────────────────────────────────── */
.fi-sidebar {
    background-color: var(--pf-surface) !important;
    border-right: 1px solid var(--pf-border) !important;
    box-shadow: var(--pf-shadow-xs) !important;
}

.fi-sidebar-header {
    padding: 1.25rem 1.5rem 1rem !important;
    border-bottom: 1px solid var(--pf-border) !important;
}

/* Brand name */
.fi-sidebar-header .fi-logo,
.fi-sidebar-header [data-brand],
.fi-brand-name {
    font-size: 1.125rem !important;
    font-weight: 700 !important;
    color: var(--pf-primary) !important;
    letter-spacing: -0.025em !important;
}

/* Nav group labels */
.fi-sidebar-nav-group-label {
    font-size: 0.6875rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    color: var(--pf-text-subtle) !important;
    padding: 1rem 1rem 0.375rem !important;
}

/* Nav items */
.fi-sidebar-nav-item a {
    border-radius: var(--pf-radius-sm) !important;
    font-size: 0.875rem !important;
    font-weight: 500 !important;
    color: var(--pf-text-muted) !important;
    transition: background var(--pf-duration-fast) var(--pf-ease),
                color var(--pf-duration-fast) var(--pf-ease) !important;
    margin: 1px 0 !important;
}

.fi-sidebar-nav-item a:hover {
    background-color: var(--pf-bg) !important;
    color: var(--pf-text) !important;
}

.fi-sidebar-nav-item a[aria-current="page"],
.fi-sidebar-nav-item a.active {
    background-color: var(--pf-primary-light) !important;
    color: var(--pf-primary-dark) !important;
    font-weight: 600 !important;
}

/* Nav icons */
.fi-sidebar-nav-item [data-icon] svg,
.fi-sidebar-nav-item .fi-icon svg {
    color: currentColor !important;
}

/* Nav badges */
.fi-sidebar-nav-item .fi-badge {
    font-size: 0.625rem !important;
    font-weight: 700 !important;
    padding: 0.125rem 0.5rem !important;
}

/* ── Topbar ──────────────────────────────────────────────── */
.fi-topbar {
    background-color: var(--pf-surface) !important;
    border-bottom: 1px solid var(--pf-border) !important;
    box-shadow: none !important;
}

/* ── Main content ────────────────────────────────────────── */
.fi-main {
    background-color: var(--pf-bg) !important;
}

.fi-main-ctn {
    padding-top: 1.5rem !important;
}

/* ── Page header ─────────────────────────────────────────── */
.fi-page-header {
    background-color: transparent !important;
    border-bottom: none !important;
    padding-bottom: 0.5rem !important;
}

.fi-page-header-heading,
.fi-page-header h1 {
    font-size: 1.5rem !important;
    font-weight: 700 !important;
    color: var(--pf-text) !important;
    letter-spacing: -0.025em !important;
    line-height: 1.25 !important;
}

.fi-page-header-subheading {
    font-size: 0.875rem !important;
    color: var(--pf-text-muted) !important;
    margin-top: 0.25rem !important;
}

/* ── Breadcrumbs ─────────────────────────────────────────── */
.fi-breadcrumbs-item-label {
    font-size: 0.75rem !important;
    color: var(--pf-text-muted) !important;
}

.fi-breadcrumbs-item-separator {
    color: var(--pf-text-subtle) !important;
}

/* ── Cards / Sections ────────────────────────────────────── */
.fi-section,
.fi-card,
[data-fi-section] {
    background-color: var(--pf-surface) !important;
    border: 1px solid var(--pf-border) !important;
    box-shadow: var(--pf-shadow-sm) !important;
    border-radius: var(--pf-radius) !important;
}

.fi-section-header {
    border-bottom: 1px solid var(--pf-border) !important;
    padding-bottom: 1rem !important;
    margin-bottom: 0 !important;
}

.fi-section-header-heading {
    font-size: 0.9375rem !important;
    font-weight: 600 !important;
    color: var(--pf-text) !important;
    letter-spacing: -0.01em !important;
}

.fi-section-content {
    padding-top: 1.25rem !important;
}

/* ── Stats Overview Widget ───────────────────────────────── */
.fi-wi-stats-overview-stat {
    background-color: var(--pf-surface) !important;
    border: 1px solid var(--pf-border) !important;
    box-shadow: var(--pf-shadow-sm) !important;
    border-radius: var(--pf-radius) !important;
    padding: 1.5rem !important;
    transition: transform var(--pf-duration-fast) var(--pf-ease),
                box-shadow var(--pf-duration-fast) var(--pf-ease) !important;
    position: relative !important;
    overflow: hidden !important;
}

.fi-wi-stats-overview-stat::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 3px !important;
    background: var(--pf-primary) !important;
    opacity: 0 !important;
    transition: opacity var(--pf-duration-fast) var(--pf-ease) !important;
}

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

.fi-wi-stats-overview-stat:hover::before {
    opacity: 1 !important;
}

.fi-wi-stats-overview-stat-label {
    font-size: 0.6875rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    color: var(--pf-text-muted) !important;
    margin-bottom: 0.5rem !important;
}

.fi-wi-stats-overview-stat-value {
    font-size: 1.875rem !important;
    font-weight: 800 !important;
    color: var(--pf-text) !important;
    letter-spacing: -0.03em !important;
    line-height: 1.15 !important;
    font-variant-numeric: tabular-nums !important;
}

.fi-wi-stats-overview-stat-description {
    font-size: 0.75rem !important;
    color: var(--pf-text-muted) !important;
    margin-top: 0.375rem !important;
    display: flex !important;
    align-items: center !important;
    gap: 0.25rem !important;
}

.fi-wi-stats-overview-stat-description-icon {
    width: 1rem !important;
    height: 1rem !important;
    flex-shrink: 0 !important;
}

/* Stat color variants */
.fi-wi-stats-overview-stat-color-success .fi-wi-stats-overview-stat-value { color: var(--pf-primary) !important; }
.fi-wi-stats-overview-stat-color-warning .fi-wi-stats-overview-stat-value { color: var(--pf-warning) !important; }
.fi-wi-stats-overview-stat-color-danger  .fi-wi-stats-overview-stat-value { color: var(--pf-error) !important; }

/* ── Tables ──────────────────────────────────────────────── */
.fi-ta-ctn,
.fi-ta-header-ctn {
    background-color: var(--pf-surface) !important;
    border: 1px solid var(--pf-border) !important;
    box-shadow: var(--pf-shadow-sm) !important;
    border-radius: var(--pf-radius) !important;
    overflow: hidden !important;
}

.fi-ta-header-cell {
    font-size: 0.6875rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
    color: var(--pf-text-muted) !important;
    background-color: var(--pf-bg) !important;
    border-bottom: 1px solid var(--pf-border) !important;
    padding: 0.75rem 1rem !important;
    white-space: nowrap !important;
}

.fi-ta-cell {
    color: var(--pf-text) !important;
    font-size: 0.875rem !important;
    padding: 0.875rem 1rem !important;
}

.fi-ta-row:hover .fi-ta-cell {
    background-color: rgba(248, 250, 252, 0.8) !important;
}

.fi-ta-row:not(:last-child) .fi-ta-cell {
    border-bottom: 1px solid rgba(15, 23, 42, 0.04) !important;
}

/* Table actions */
.fi-ta-actions {
    gap: 0.375rem !important;
}

/* Empty state */
.fi-ta-empty-state {
    padding: 3rem 2rem !important;
    text-align: center !important;
}

.fi-ta-empty-state-heading {
    font-size: 1rem !important;
    font-weight: 600 !important;
    color: var(--pf-text) !important;
    margin-bottom: 0.375rem !important;
}

.fi-ta-empty-state-description {
    font-size: 0.875rem !important;
    color: var(--pf-text-muted) !important;
}

/* Table search */
.fi-ta-search-field {
    border-radius: var(--pf-radius-sm) !important;
}

/* Table pagination */
.fi-pagination-item {
    border-radius: var(--pf-radius-sm) !important;
    font-size: 0.875rem !important;
    font-weight: 500 !important;
}

/* ── Buttons ─────────────────────────────────────────────── */
.fi-btn {
    border-radius: var(--pf-radius-sm) !important;
    font-weight: 600 !important;
    font-size: 0.875rem !important;
    transition: background-color var(--pf-duration-fast) var(--pf-ease),
                box-shadow var(--pf-duration-fast) var(--pf-ease),
                transform var(--pf-duration-fast) var(--pf-ease) !important;
    letter-spacing: 0.01em !important;
}

.fi-btn:active {
    transform: scale(0.98) !important;
}

/* Primary button */
.fi-btn-color-primary {
    background-color: var(--pf-primary) !important;
    color: #FFFFFF !important;
    box-shadow: var(--pf-shadow-xs) !important;
}

.fi-btn-color-primary:hover {
    background-color: var(--pf-primary-dark) !important;
    box-shadow: var(--pf-shadow-sm) !important;
}

/* High-priority / CTA button (Confirm Order, Deliver, etc.) */
.fi-btn-color-success {
    background-color: var(--pf-primary) !important;
    color: #FFFFFF !important;
}

.fi-btn-color-success:hover {
    background-color: var(--pf-primary-dark) !important;
}

/* Danger */
.fi-btn-color-danger {
    background-color: var(--pf-error) !important;
    color: #FFFFFF !important;
}

/* Gray / Secondary */
.fi-btn-color-gray {
    background-color: var(--pf-bg) !important;
    color: var(--pf-text) !important;
    border: 1px solid var(--pf-border-strong) !important;
}

.fi-btn-color-gray:hover {
    background-color: #F1F5F9 !important;
}

/* ── Forms / Inputs ──────────────────────────────────────── */
.fi-input-wrp,
.fi-fo-field-wrp {
    transition: box-shadow var(--pf-duration-fast) var(--pf-ease) !important;
}

.fi-input,
input[type="text"],
input[type="email"],
input[type="search"],
input[type="number"],
input[type="date"],
select,
textarea {
    border: 1px solid #CBD5E1 !important;
    border-radius: var(--pf-radius-sm) !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 0.875rem !important;
    color: var(--pf-text) !important;
    background-color: var(--pf-surface) !important;
    transition: border-color var(--pf-duration-fast) var(--pf-ease),
                box-shadow var(--pf-duration-fast) var(--pf-ease) !important;
}

.fi-input:focus,
input:focus,
select:focus,
textarea:focus {
    border-color: var(--pf-primary) !important;
    box-shadow: 0 0 0 3px var(--pf-primary-ring) !important;
    outline: none !important;
}

/* Field labels */
.fi-fo-field-wrp-label label,
.fi-fo-label {
    font-size: 0.8125rem !important;
    font-weight: 600 !important;
    color: var(--pf-text) !important;
    letter-spacing: 0.01em !important;
}

/* Helper text */
.fi-fo-helper-text {
    font-size: 0.75rem !important;
    color: var(--pf-text-muted) !important;
    margin-top: 0.25rem !important;
}

/* ── Select / Dropdown ───────────────────────────────────── */
.fi-dropdown-panel {
    background-color: var(--pf-surface) !important;
    border: 1px solid var(--pf-border) !important;
    box-shadow: var(--pf-shadow-md) !important;
    border-radius: var(--pf-radius) !important;
}

.fi-dropdown-list-item {
    font-size: 0.875rem !important;
    color: var(--pf-text) !important;
    border-radius: var(--pf-radius-sm) !important;
    transition: background-color var(--pf-duration-fast) var(--pf-ease) !important;
}

.fi-dropdown-list-item:hover {
    background-color: var(--pf-bg) !important;
}

.fi-dropdown-list-item[aria-selected="true"] {
    background-color: var(--pf-primary-light) !important;
    color: var(--pf-primary-dark) !important;
}

/* ── Badges ──────────────────────────────────────────────── */
.fi-badge {
    border-radius: var(--pf-radius-full) !important;
    font-size: 0.6875rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    padding: 0.1875rem 0.625rem !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.25rem !important;
}

/* Success / Active badge */
.fi-badge-color-success {
    background-color: var(--pf-primary-light) !important;
    color: var(--pf-primary-dark) !important;
}

/* Danger badge */
.fi-badge-color-danger {
    background-color: #FEE2E2 !important;
    color: #991B1B !important;
}

/* Warning badge */
.fi-badge-color-warning {
    background-color: #FEF3C7 !important;
    color: #92400E !important;
}

/* Info badge */
.fi-badge-color-info {
    background-color: #E0F2FE !important;
    color: #075985 !important;
}

/* Gray badge */
.fi-badge-color-gray {
    background-color: #F1F5F9 !important;
    color: var(--pf-text-muted) !important;
}

/* Primary badge */
.fi-badge-color-primary {
    background-color: var(--pf-primary-light) !important;
    color: var(--pf-primary-dark) !important;
}

/* ── Toggle / Checkbox ───────────────────────────────────── */
.fi-fo-toggle input[type="checkbox"]:checked {
    background-color: var(--pf-primary) !important;
    border-color: var(--pf-primary) !important;
}

/* ── Modal ───────────────────────────────────────────────── */
.fi-modal-content {
    background-color: var(--pf-surface) !important;
    border-radius: var(--pf-radius-lg) !important;
    border: 1px solid var(--pf-border) !important;
    box-shadow: var(--pf-shadow-lg) !important;
}

.fi-modal-header {
    border-bottom: 1px solid var(--pf-border) !important;
    padding-bottom: 1rem !important;
}

.fi-modal-header-heading {
    font-size: 1.0625rem !important;
    font-weight: 700 !important;
    color: var(--pf-text) !important;
    letter-spacing: -0.01em !important;
}

.fi-modal-footer {
    border-top: 1px solid var(--pf-border) !important;
    padding-top: 1rem !important;
}

/* Scrim */
.fi-modal-scrim {
    background-color: rgba(15, 23, 42, 0.5) !important;
    backdrop-filter: blur(4px) !important;
}

/* ── Notifications / Toasts ──────────────────────────────── */
.fi-no-notification {
    background-color: var(--pf-surface) !important;
    border: 1px solid var(--pf-border) !important;
    box-shadow: var(--pf-shadow-lg) !important;
    border-radius: var(--pf-radius) !important;
    font-size: 0.875rem !important;
}

.fi-no-notification-title {
    font-weight: 600 !important;
    color: var(--pf-text) !important;
}

.fi-no-notification-body {
    color: var(--pf-text-muted) !important;
}

/* Success notification accent */
.fi-no-notification-color-success {
    border-left: 3px solid var(--pf-primary) !important;
}

/* ── Widget Table (AlertsWidget / LowStockWidget) ────────── */
.fi-wi-table {
    background-color: var(--pf-surface) !important;
    border: 1px solid var(--pf-border) !important;
    box-shadow: var(--pf-shadow-sm) !important;
    border-radius: var(--pf-radius) !important;
}

.fi-wi-table-heading {
    font-size: 0.9375rem !important;
    font-weight: 700 !important;
    color: var(--pf-text) !important;
    letter-spacing: -0.01em !important;
}

/* ── Chart Widget ────────────────────────────────────────── */
.fi-wi-chart {
    background-color: var(--pf-surface) !important;
    border: 1px solid var(--pf-border) !important;
    box-shadow: var(--pf-shadow-sm) !important;
    border-radius: var(--pf-radius) !important;
}

.fi-wi-chart-heading {
    font-size: 0.9375rem !important;
    font-weight: 700 !important;
    color: var(--pf-text) !important;
}

/* ── Tabs ────────────────────────────────────────────────── */
.fi-tabs-tab {
    font-size: 0.875rem !important;
    font-weight: 500 !important;
    color: var(--pf-text-muted) !important;
    border-radius: var(--pf-radius-sm) !important;
    transition: color var(--pf-duration-fast) var(--pf-ease) !important;
}

.fi-tabs-tab[aria-selected="true"] {
    color: var(--pf-primary) !important;
    font-weight: 600 !important;
}

.fi-tabs-tab-indicator {
    background-color: var(--pf-primary) !important;
}

/* ── Repeater ────────────────────────────────────────────── */
.fi-fo-repeater-item {
    border: 1px solid var(--pf-border) !important;
    border-radius: var(--pf-radius-sm) !important;
    background-color: var(--pf-bg) !important;
}

.fi-fo-repeater-add-action {
    border: 1px dashed var(--pf-border-strong) !important;
    border-radius: var(--pf-radius-sm) !important;
}

.fi-fo-repeater-add-action:hover {
    border-color: var(--pf-primary) !important;
    background-color: var(--pf-primary-light) !important;
}

/* ── Scrollbar ───────────────────────────────────────────── */
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
    background: #CBD5E1;
    border-radius: var(--pf-radius-full);
}
::-webkit-scrollbar-thumb:hover { background: #94A3B8; }

/* ── Custom Utility Classes ──────────────────────────────── */

/* PF Tag (for inline status badges in blade views) */
.pf-tag {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    background-color: var(--pf-primary-light);
    color: var(--pf-primary-dark);
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    padding: 0.1875rem 0.625rem;
    border-radius: var(--pf-radius-full);
}

.pf-tag-warning {
    background-color: #FEF3C7;
    color: #92400E;
}

.pf-tag-danger {
    background-color: #FEE2E2;
    color: #991B1B;
}

.pf-tag-info {
    background-color: #E0F2FE;
    color: #075985;
}

.pf-tag-gray {
    background-color: #F1F5F9;
    color: var(--pf-text-muted);
}

/* PF Alert cards */
.pf-alert {
    background-color: var(--pf-primary-light);
    border: 1px solid rgba(22, 163, 74, 0.25);
    border-left: 4px solid var(--pf-primary);
    border-radius: var(--pf-radius-sm);
    padding: 0.875rem 1rem;
    font-size: 0.875rem;
    color: var(--pf-primary-dark);
}

.pf-alert-warning {
    background-color: var(--pf-warning-bg);
    border-color: rgba(217, 119, 6, 0.25);
    border-left-color: var(--pf-warning);
    color: #92400E;
}

.pf-alert-danger {
    background-color: var(--pf-error-bg);
    border-color: rgba(220, 38, 38, 0.25);
    border-left-color: var(--pf-error);
    color: #991B1B;
}

.pf-alert-info {
    background-color: var(--pf-info-bg);
    border-color: rgba(2, 132, 199, 0.25);
    border-left-color: var(--pf-info);
    color: #075985;
}

/* PF Data table (used in blade page views) */
.pf-table-wrap {
    background: var(--pf-surface);
    border: 1px solid var(--pf-border);
    border-radius: var(--pf-radius);
    box-shadow: var(--pf-shadow-sm);
    overflow: hidden;
}

.pf-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.875rem;
}

.pf-table thead {
    background-color: var(--pf-bg);
}

.pf-table thead th {
    padding: 0.75rem 1rem;
    text-align: left;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--pf-text-muted);
    border-bottom: 1px solid var(--pf-border);
    white-space: nowrap;
}

.pf-table thead th.text-right { text-align: right; }
.pf-table thead th.text-center { text-align: center; }

.pf-table tbody tr {
    border-bottom: 1px solid rgba(15, 23, 42, 0.04);
    transition: background-color var(--pf-duration-fast) var(--pf-ease);
}

.pf-table tbody tr:last-child { border-bottom: none; }

.pf-table tbody tr:hover { background-color: var(--pf-bg); }

.pf-table tbody td {
    padding: 0.875rem 1rem;
    color: var(--pf-text);
    vertical-align: middle;
}

.pf-table tbody td.text-right { text-align: right; }
.pf-table tbody td.text-center { text-align: center; }
.pf-table tbody td.font-medium { font-weight: 500; }
.pf-table tbody td.font-semibold { font-weight: 600; }
.pf-table tbody td.text-muted { color: var(--pf-text-muted); }

/* Progress bar (for spending report) */
.pf-progress-bar {
    height: 0.375rem;
    background-color: #E2E8F0;
    border-radius: var(--pf-radius-full);
    overflow: hidden;
}

.pf-progress-bar-fill {
    height: 100%;
    background-color: var(--pf-primary);
    border-radius: var(--pf-radius-full);
    transition: width 0.6s var(--pf-ease);
}

/* Stat card (for blade pages) */
.pf-stat-card {
    background: var(--pf-surface);
    border: 1px solid var(--pf-border);
    border-radius: var(--pf-radius);
    box-shadow: var(--pf-shadow-sm);
    padding: 1.25rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.pf-stat-card-label {
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--pf-text-muted);
}

.pf-stat-card-value {
    font-size: 1.875rem;
    font-weight: 800;
    color: var(--pf-text);
    letter-spacing: -0.03em;
    line-height: 1.15;
    font-variant-numeric: tabular-nums;
}

.pf-stat-card-value.pf-green { color: var(--pf-primary); }
.pf-stat-card-value.pf-red   { color: var(--pf-error); }

.pf-stat-card-note {
    font-size: 0.75rem;
    color: var(--pf-text-muted);
}

/* Section heading in blade pages */
.pf-section-heading {
    font-size: 1rem;
    font-weight: 700;
    color: var(--pf-text);
    letter-spacing: -0.015em;
    margin: 0;
}

/* Empty state */
.pf-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 2rem;
    text-align: center;
    background: var(--pf-surface);
    border: 1px solid var(--pf-border);
    border-radius: var(--pf-radius);
}

.pf-empty-icon {
    width: 2.5rem;
    height: 2.5rem;
    color: var(--pf-primary);
    margin-bottom: 0.75rem;
}

.pf-empty-title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--pf-text);
    margin-bottom: 0.25rem;
}

.pf-empty-desc {
    font-size: 0.875rem;
    color: var(--pf-text-muted);
}

/* ── Filament actions button row ─────────────────────────── */
.fi-ac-action-btn {
    font-size: 0.8125rem !important;
}

/* Create new record button (page header) */
.fi-btn[wire\:click*="create"],
.fi-page-header-actions .fi-btn-color-primary {
    background-color: var(--pf-primary) !important;
}

.fi-page-header-actions .fi-btn-color-primary:hover {
    background-color: var(--pf-primary-dark) !important;
}

/* ── Icon columns ────────────────────────────────────────── */
.fi-ta-col-icon-boolean svg[data-icon="check-circle"] { color: var(--pf-primary) !important; }
.fi-ta-col-icon-boolean svg[data-icon="x-circle"]     { color: var(--pf-text-subtle) !important; }

/* ── Color column (text colors for status) ───────────────── */
.fi-ta-col-text-color-success { color: var(--pf-primary) !important; font-weight: 600 !important; }
.fi-ta-col-text-color-danger  { color: var(--pf-error) !important; font-weight: 600 !important; }
.fi-ta-col-text-color-warning { color: var(--pf-warning) !important; font-weight: 600 !important; }

/* ── Filters bar ─────────────────────────────────────────── */
.fi-ta-filters-form {
    background: var(--pf-bg) !important;
    border-radius: var(--pf-radius) !important;
    border: 1px solid var(--pf-border) !important;
    padding: 1rem !important;
}

/* ── Pagination ──────────────────────────────────────────── */
.fi-pagination-item-btn[aria-current="page"] {
    background-color: var(--pf-primary) !important;
    color: #FFFFFF !important;
    border-radius: var(--pf-radius-sm) !important;
}

/* ── Focus ring (accessibility) ──────────────────────────── */
:focus-visible {
    outline: 2px solid var(--pf-primary) !important;
    outline-offset: 2px !important;
}

.fi-btn:focus-visible {
    box-shadow: 0 0 0 3px var(--pf-primary-ring) !important;
}