/* ==========================================================
   FONTS
========================================================== */

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

:root {
    --app-font: 'Inter', -apple-system, BlinkMacSystemFont,
        'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}

* {
    font-family: var(--app-font);
}


/* ==========================================================
   SHARED ANIMATIONS
========================================================== */

@keyframes ai-shimmer {
    0%   { background-position: 0% 50%; }
    50%  { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}


/* ==========================================================
   GENERIC SCROLLBARS
========================================================== */

.solid-scrollbar {
    background-color: #f5f5f5;
    overflow: auto;
}

.solid-scrollbar::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}

.solid-scrollbar::-webkit-scrollbar-track {
    background: #ebebeb;
}

.solid-scrollbar::-webkit-scrollbar-thumb {
    background: #c2c2c2;
    border-radius: 6px;
}

.solid-scrollbar::-webkit-scrollbar-thumb:hover {
    background: #a0a0a0;
}

/* Client dashboard: compact, flat, and isolated from internal-page styling. */
.client-dashboard {
    --mantine-color-dimmed: #66727F;
    --client-page: #F4F6F8;
    --client-card: #FFFFFF;
    --client-border: #D9E0E7;
    --client-text: #1F2933;
    --client-text-secondary: #46515D;
    --client-hover: #F1F5F8;
    --client-space-control: 4px;
    --client-space-related: 8px;
    --client-space-section: 12px;
    color: var(--client-text);
    background: var(--client-page);
}

.client-dashboard .mantine-Card-root,
.client-dashboard .mantine-Paper-root {
    border-color: var(--client-border);
    box-shadow: 0 1px 2px rgba(31, 41, 51, 0.04);
}

.client-dashboard table thead th {
    background: #EEF2F5;
    color: var(--client-text-secondary);
    border-color: var(--client-border);
}

.client-dashboard table tbody td {
    color: var(--client-text);
    border-color: var(--client-border);
}

.client-dashboard table tbody tr:hover td {
    background: var(--client-hover);
}

.client-dashboard .ag-theme-quartz,
.client-dashboard .ag-theme-balham {
    --ag-background-color: var(--client-card);
    --ag-foreground-color: var(--client-text);
    --ag-header-background-color: #EEF2F5;
    --ag-header-foreground-color: var(--client-text-secondary);
    --ag-odd-row-background-color: #FAFBFC;
    --ag-row-hover-color: var(--client-hover);
    --ag-selected-row-background-color: #EAF2F8;
    --ag-border-color: var(--client-border);
    --ag-row-border-color: var(--client-border);
}

.client-dashboard .delivered-order-button {
    color: var(--client-text);
    opacity: 1;
    transition: background-color 140ms ease, border-color 140ms ease;
}

.client-dashboard .delivered-order-button:hover:not(:disabled) {
    background: #F8FAFC !important;
    border-color: #C7D0D9 !important;
}

.client-dashboard .delivered-order-button:disabled,
.client-dashboard .delivered-order-button[data-disabled] {
    background: var(--client-card) !important;
    border-color: var(--client-border) !important;
    color: var(--client-text) !important;
    opacity: 1 !important;
    cursor: default !important;
}

.client-dashboard .delivered-order-button:disabled .mantine-Button-label,
.client-dashboard .delivered-order-button[data-disabled] .mantine-Button-label {
    color: var(--client-text) !important;
    opacity: 1 !important;
}

/* Executive summary shares the client dashboard's enterprise visual tokens. */
.client-executive-summary {
    --mantine-color-dimmed: #66727F;
    --client-page: #F4F6F8;
    --client-card: #FFFFFF;
    --client-border: #D9E0E7;
    --client-text: #1F2933;
    --client-text-secondary: #46515D;
    --client-hover: #F1F5F8;
    color: var(--client-text);
    background: var(--client-page);
}

.client-executive-summary .mantine-Card-root,
.client-executive-summary .mantine-Paper-root {
    border-color: var(--client-border);
    box-shadow: 0 1px 2px rgba(31, 41, 51, 0.04);
}

.client-executive-summary table thead th,
.executive-summary-table thead th {
    background: #EEF2F5;
    color: var(--client-text-secondary);
    border-color: var(--client-border);
}

.client-executive-summary table tbody td,
.executive-summary-table tbody td {
    color: var(--client-text);
    border-color: var(--client-border);
}

.client-executive-summary table tbody tr:hover td,
.executive-summary-table tbody tr:hover td {
    background: var(--client-hover);
}