/* Isolated MudBlazor theme variables. Theme classes are provided below (.theme-default, .theme-dawn, ...).
   The AppThemeProvider component toggles one of these classes on the <body> element to switch themes.
   Adjust the color hex values below to customize the palette.

   Order List (filter console) colors are driven by --order-filter-* variables.
   Each theme overrides them, so the component rules further down never need to change.
*/

:root {
    /* default to theme-default variables */
    --mud-palette-primary: #1877bd; /* blue */
    --mud-palette-secondary: #f7a400; /* amber */
    --mud-palette-surface: #ffffff;
    --mud-palette-background: #f4f6f8;
    --mud-palette-appbar-background: #0e5275;
    --mud-palette-text-primary: rgba(0,0,0,0.87);
    --mud-palette-text-secondary: rgba(0,0,0,0.6);
    --mud-palette-success: #2e7d32;
    --mud-palette-warning: #ed6c02;
    --mud-palette-error: #d32f2f;
    /* Order List defaults (same as theme-default) */
    --order-filter-border: #1976d2;
    --order-filter-bg-start: #f0f7ff;
    --order-filter-bg-end: #ffffff;
    --order-filter-shadow: 0 2px 8px rgba(25, 118, 210, 0.12);
    --order-filter-header-bg: rgba(25, 118, 210, 0.08);
    --order-filter-header-text: #1565c0;
    --order-filter-pickup-border: rgba(25, 118, 210, 0.25);
    --order-filter-pickup-bg: rgba(255, 255, 255, 0.75);
    /* Order List rows: follow the theme surface by default */
    --order-row-bg: var(--mud-palette-surface);
    --order-row-text: var(--mud-palette-text-primary);
    --order-row-highlight-bg: #ffe5cc; /* peach */
    --order-row-highlight-text: rgba(0,0,0,0.87);
}

/* ---------- Reservation form ---------- */
.reservation-form .mud-table-head .mud-table-cell {
    white-space: nowrap;
    padding: 2px;
    font-size: xx-small;
}

.reservation-form tr.order-row-blset .mud-table-cell,
.reservation-form tr.order-row-blset .mud-table-cell span,
.reservation-form tr.order-row-blset .mud-table-cell b,
.reservation-form tr.order-row-blset .mud-table-cell small,
.reservation-form tr.order-row-blset .mud-table-cell .mud-button-label,
.reservation-form tr.order-row-blset .mud-table-cell .mud-input-slot,
.reservation-form tr.order-row-blset .mud-table-cell .mud-chip-content {
    color: white !important;
}

/* ---------- Order List Styles (theme-aware) ---------- */
.order-filter-console {
    border: 2px solid var(--order-filter-border) !important;
    border-radius: 10px;
    background: linear-gradient(180deg, var(--order-filter-bg-start) 0%, var(--order-filter-bg-end) 100%);
    box-shadow: var(--order-filter-shadow);
    overflow: hidden;
}

    .order-filter-console .mud-expand-panel {
        box-shadow: none !important;
        margin: 0 !important;
        background: transparent !important;
    }

    .order-filter-console .mud-expand-panel-header {
        background-color: var(--order-filter-header-bg);
        min-height: 44px;
    }

        .order-filter-console .mud-expand-panel-header .mud-expand-panel-text {
            color: var(--order-filter-header-text);
            font-weight: 600;
            font-size: 0.95rem;
        }

    .order-filter-console .mud-expand-panel-content {
        padding: 12px 16px 16px;
    }

.order-filter-grid > .mud-grid-item.order-filter-col {
    flex-grow: 0;
    flex-basis: 20%;
    max-width: 20%;
}

.order-filter-grid > .mud-grid-item.filter-full-width {
    flex-basis: 100%;
    max-width: 100%;
}

@media (max-width: 1400px) {
    .order-filter-grid > .mud-grid-item.order-filter-col {
        flex-basis: 25%;
        max-width: 25%;
    }
}

@media (max-width: 960px) {
    .order-filter-grid > .mud-grid-item.order-filter-col {
        flex-basis: 50%;
        max-width: 50%;
    }
}

@media (max-width: 600px) {
    .order-filter-grid > .mud-grid-item.order-filter-col {
        flex-basis: 100%;
        max-width: 100%;
    }
}

.order-filter-pickup {
    border: 1px solid var(--order-filter-pickup-border);
    border-radius: 8px;
    padding: 8px 12px;
    background: var(--order-filter-pickup-bg);
}

.order-filter-actions {
    gap: 12px;
    padding-top: 8px;
}

.order-filter-plus {
    margin-top: 12px;
}

/* Order List table rows (set via RowClassFunc in the Razor page) */
.mud-table-body tr.order-row {
    background-color: var(--order-row-bg);
}

    .mud-table-body tr.order-row > td.mud-table-cell {
        color: var(--order-row-text);
    }

    .mud-table-body tr.order-row.order-row-highlight {
        background-color: var(--order-row-highlight-bg);
    }

        .mud-table-body tr.order-row.order-row-highlight > td.mud-table-cell {
            color: var(--order-row-highlight-text);
        }

    /* inputs inside rows (e.g. the reference-number box) follow the row text */
    .mud-table-body tr.order-row .mud-input,
    .mud-table-body tr.order-row .mud-input input {
        color: inherit;
    }
/* ---------- /Order List Styles ---------- */


/* ================================================================
   THEMES
   ================================================================ */

/* ---------- Default (light, blue) ---------- */
.theme-default {
    --mud-palette-primary: #1877bd;
    --mud-palette-secondary: #f7a400;
    --mud-palette-surface: #ffffff;
    --mud-palette-background: #f4f6f8;
    --mud-palette-appbar-background: #0e5275;
    --mud-palette-text-primary: rgba(0,0,0,0.87);
    --mud-palette-text-secondary: rgba(0,0,0,0.6);
    --mud-palette-success: #2e7d32;
    --mud-palette-warning: #ed6c02;
    --mud-palette-error: #d32f2f;
    /* Order List */
    --order-filter-border: #1976d2;
    --order-filter-bg-start: #f0f7ff;
    --order-filter-bg-end: #ffffff;
    --order-filter-shadow: 0 2px 8px rgba(25, 118, 210, 0.12);
    --order-filter-header-bg: rgba(25, 118, 210, 0.08);
    --order-filter-header-text: #1565c0;
    --order-filter-pickup-border: rgba(25, 118, 210, 0.25);
    --order-filter-pickup-bg: rgba(255, 255, 255, 0.75);
}

/* ---------- Dawn1 (dark, violet/teal) ---------- */
.theme-dawn1 {
    --mud-palette-primary: #6b4eff; /* violet */
    --mud-palette-secondary: #00bfa5; /* teal */
    --mud-palette-surface: #0f1720; /* dark surface */
    --mud-palette-background: #071025; /* deep blue */
    --mud-palette-appbar-background: #051428;
    --mud-palette-text-primary: rgba(255,255,255,0.95);
    --mud-palette-text-secondary: rgba(255,255,255,0.8);
    --mud-palette-success: #66bb6a;
    --mud-palette-warning: #ffb74d;
    --mud-palette-error: #ff5252;
    /* Order List */
    --order-filter-border: #6b4eff;
    --order-filter-bg-start: #1a1f3a;
    --order-filter-bg-end: #0f1720;
    --order-filter-shadow: 0 2px 10px rgba(107, 78, 255, 0.25);
    --order-filter-header-bg: rgba(107, 78, 255, 0.15);
    --order-filter-header-text: #a99bff;
    --order-filter-pickup-border: rgba(107, 78, 255, 0.35);
    --order-filter-pickup-bg: rgba(255, 255, 255, 0.04);
}

/* ---------- Dawn2 (light, forest/copper) ---------- */
.theme-dawn2 {
    --mud-palette-primary: #2f6b4f; /* forest green */
    --mud-palette-secondary: #b5652a; /* copper */
    --mud-palette-surface: #fbfaf6; /* off-white */
    --mud-palette-background: #eef1ea; /* sage mist */
    --mud-palette-appbar-background: #24503c; /* deep pine */
    --mud-palette-text-primary: rgba(28,36,30,0.87);
    --mud-palette-text-secondary: rgba(28,36,30,0.6);
    --mud-palette-success: #2e7d32;
    --mud-palette-warning: #d97706;
    --mud-palette-error: #c0392b;
    --mud-palette-appbar-text: #ffffff;
    --mud-palette-drawer-background: #f6f7f2;
    --mud-palette-drawer-text: rgba(28,36,30,0.87);
    --mud-palette-lines-default: rgba(28,36,30,0.12);
    --mud-palette-primary-text: #ffffff;
    --mud-palette-secondary-text: #ffffff;
    /* Order List */
    --order-filter-border: #2f6b4f;
    --order-filter-bg-start: #e6efe8;
    --order-filter-bg-end: #fbfaf6;
    --order-filter-shadow: 0 2px 8px rgba(47, 107, 79, 0.14);
    --order-filter-header-bg: rgba(47, 107, 79, 0.08);
    --order-filter-header-text: #24503c;
    --order-filter-pickup-border: rgba(47, 107, 79, 0.28);
    --order-filter-pickup-bg: rgba(251, 250, 246, 0.8);
}

/* ---------- Arctic (dark, violet/teal) ---------- */
.theme-arctic {
    --mud-palette-primary: #7c6cff; /* bright violet */
    --mud-palette-secondary: #26c6b0; /* bright teal */
    --mud-palette-surface: #4f5c60; /*#1b1e2e cards, menus */
    --mud-palette-background: #12141f; /* page */
    --mud-palette-appbar-background: #252a47;
    --mud-palette-text-primary: rgba(255,255,255,0.92);
    --mud-palette-text-secondary: rgba(255,255,255,0.66);
    --mud-palette-success: #66bb6a;
    --mud-palette-warning: #ffb74d;
    --mud-palette-error: #f26b6b;
    /* extras so drawers, dividers and filled buttons match */
    --mud-palette-appbar-text: rgba(255,255,255,0.92);
    --mud-palette-drawer-background: #252a47;
    --mud-palette-drawer-text: rgba(255,255,255,0.92);
    --mud-palette-lines-default: rgba(255,255,255,0.12);
    --mud-palette-primary-text: #ffffff;
    --mud-palette-secondary-text: #0b1f1c; /* dark text reads better on the bright teal */
    /* Order List */
    --order-filter-border: #7c6cff;
    --order-filter-bg-start: #3a3d63;
    --order-filter-bg-end: #4f5c60;
    --order-filter-shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
    --order-filter-header-bg: rgba(124, 108, 255, 0.18);
    --order-filter-header-text: #c3baff;
    --order-filter-pickup-border: rgba(124, 108, 255, 0.4);
    --order-filter-pickup-bg: rgba(255, 255, 255, 0.05);
}

/* ---------- Sunset (light, warm) ---------- */
.theme-sunset {
    --mud-palette-primary: #d9480f; /* burnt orange */
    --mud-palette-secondary: #c2255c; /* rose */
    --mud-palette-surface: #fffaf5;
    --mud-palette-background: #fff1e6; /* apricot */
    --mud-palette-appbar-background: #8a2c0d; /* deep ember */
    --mud-palette-text-primary: rgba(51,28,17,0.87);
    --mud-palette-text-secondary: rgba(51,28,17,0.6);
    --mud-palette-success: #2e7d32;
    --mud-palette-warning: #b45309;
    --mud-palette-error: #b91c1c;
    --mud-palette-appbar-text: #ffffff;
    --mud-palette-drawer-background: #fff6ee;
    --mud-palette-drawer-text: rgba(51,28,17,0.87);
    --mud-palette-lines-default: rgba(51,28,17,0.12);
    --mud-palette-primary-text: #ffffff;
    --mud-palette-secondary-text: #ffffff;
    /* Order List */
    --order-filter-border: #d9480f;
    --order-filter-bg-start: #ffe8d9;
    --order-filter-bg-end: #fffaf5;
    --order-filter-shadow: 0 2px 8px rgba(217, 72, 15, 0.14);
    --order-filter-header-bg: rgba(217, 72, 15, 0.08);
    --order-filter-header-text: #8a2c0d;
    --order-filter-pickup-border: rgba(217, 72, 15, 0.28);
    --order-filter-pickup-bg: rgba(255, 250, 245, 0.8);
}

/* ---------- Ocean (dark, cool) ---------- */
.theme-ocean {
    --mud-palette-primary: #4fb8e8; /* sky blue */
    --mud-palette-secondary: #ff8a65; /* coral */
    --mud-palette-surface: #22384a;
    --mud-palette-background: #1a2b38; /* deep sea */
    --mud-palette-appbar-background: #172633;
    --mud-palette-text-primary: rgba(255,255,255,0.92);
    --mud-palette-text-secondary: rgba(255,255,255,0.66);
    --mud-palette-success: #66bb6a;
    --mud-palette-warning: #ffca28;
    --mud-palette-error: #ff6b6b;
    --mud-palette-appbar-text: rgba(255,255,255,0.92);
    --mud-palette-drawer-background: #1d3040;
    --mud-palette-drawer-text: rgba(255,255,255,0.92);
    --mud-palette-lines-default: rgba(255,255,255,0.12);
    --mud-palette-primary-text: #0d1f2b; /* dark text on the light blue */
    --mud-palette-secondary-text: #2b120a;
    /* Order List */
    --order-filter-border: #4fb8e8;
    --order-filter-bg-start: #284660;
    --order-filter-bg-end: #22384a;
    --order-filter-shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
    --order-filter-header-bg: rgba(79, 184, 232, 0.14);
    --order-filter-header-text: #8fd3f2;
    --order-filter-pickup-border: rgba(79, 184, 232, 0.35);
    --order-filter-pickup-bg: rgba(255, 255, 255, 0.04);
    /* Order List rows */
    --order-row-bg: #22384a;
    --order-row-text: rgba(255,255,255,0.92);
    --order-row-highlight-bg: #4a3a35; /* coral-tinted dark instead of peach */
    --order-row-highlight-text: #ffe0d6;
    /* Remaining MudBlazor tokens a dark theme needs (otherwise light defaults leak in) */
    --mud-palette-text-disabled: rgba(255,255,255,0.4);
    --mud-palette-action-default: rgba(255,255,255,0.75);
    --mud-palette-action-default-hover: rgba(255,255,255,0.08);
    --mud-palette-action-disabled: rgba(255,255,255,0.3);
    --mud-palette-action-disabled-background: rgba(255,255,255,0.14); /* default chips, e.g. "HC" */
    --mud-palette-background-gray: #1f3344;
    --mud-palette-divider: rgba(255,255,255,0.12);
    --mud-palette-divider-light: rgba(255,255,255,0.06);
    --mud-palette-table-lines: rgba(255,255,255,0.10);
    --mud-palette-table-striped: rgba(255,255,255,0.03);
    --mud-palette-table-hover: rgba(79,184,232,0.10);
    --mud-palette-lines-inputs: rgba(255,255,255,0.3);
    --mud-palette-dark: #10202c;
    --mud-palette-dark-text: rgba(255,255,255,0.92);
}

/* ---------- Plum (dark, moody) ---------- */
.theme-plum {
    --mud-palette-primary: #e07ab8; /* rose pink */
    --mud-palette-secondary: #b39ddb; /* lavender */
    --mud-palette-surface: #2f2538;
    --mud-palette-background: #241c2b; /* dark plum */
    --mud-palette-appbar-background: #1f1825;
    --mud-palette-text-primary: rgba(255,255,255,0.92);
    --mud-palette-text-secondary: rgba(255,255,255,0.66);
    --mud-palette-success: #81c784;
    --mud-palette-warning: #ffb74d;
    --mud-palette-error: #ff7081;
    --mud-palette-appbar-text: rgba(255,255,255,0.92);
    --mud-palette-drawer-background: #281f30;
    --mud-palette-drawer-text: rgba(255,255,255,0.92);
    --mud-palette-lines-default: rgba(255,255,255,0.12);
    --mud-palette-primary-text: #2a1020;
    --mud-palette-secondary-text: #1e1430;
    /* Order List */
    --order-filter-border: #e07ab8;
    --order-filter-bg-start: #3a2c45;
    --order-filter-bg-end: #2f2538;
    --order-filter-shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
    --order-filter-header-bg: rgba(224, 122, 184, 0.14);
    --order-filter-header-text: #f0a8d4;
    --order-filter-pickup-border: rgba(224, 122, 184, 0.35);
    --order-filter-pickup-bg: rgba(255, 255, 255, 0.04);
}

/* ---------- Dawn (light, cool and calm) ---------- */
.theme-dawn {
    --mud-palette-primary: #4c6f9a; /* steel blue */
    --mud-palette-secondary: #88c0d0; /* frost */
    --mud-palette-surface: #ffffff;
    --mud-palette-background: #eceff4; /* snow gray */
    --mud-palette-appbar-background: #3b4252; /* slate */
    --mud-palette-text-primary: rgba(31,42,54,0.9);
    --mud-palette-text-secondary: rgba(31,42,54,0.62);
    --mud-palette-success: #3f7d4e;
    --mud-palette-warning: #c2780a;
    --mud-palette-error: #b0413e;
    --mud-palette-appbar-text: #eceff4;
    --mud-palette-drawer-background: #f5f7fa;
    --mud-palette-drawer-text: rgba(31,42,54,0.9);
    --mud-palette-lines-default: rgba(31,42,54,0.12);
    --mud-palette-primary-text: #ffffff;
    --mud-palette-secondary-text: #1f2a36; /* dark text on the pale frost */
    /* Order List */
    --order-filter-border: #4c6f9a;
    --order-filter-bg-start: #e5ecf4;
    --order-filter-bg-end: #ffffff;
    --order-filter-shadow: 0 2px 8px rgba(76, 111, 154, 0.14);
    --order-filter-header-bg: rgba(76, 111, 154, 0.08);
    --order-filter-header-text: #3b4252;
    --order-filter-pickup-border: rgba(76, 111, 154, 0.28);
    --order-filter-pickup-bg: rgba(255, 255, 255, 0.8);
}

/* ---------- Contrast (light, high-contrast / accessibility) ---------- */
.theme-contrast {
    --mud-palette-primary: #0047b3; /* strong blue */
    --mud-palette-secondary: #b30059; /* strong magenta */
    --mud-palette-surface: #ffffff;
    --mud-palette-background: #ffffff;
    --mud-palette-appbar-background: #000000;
    --mud-palette-text-primary: rgba(0,0,0,1);
    --mud-palette-text-secondary: rgba(0,0,0,0.8);
    --mud-palette-success: #1b5e20;
    --mud-palette-warning: #8a4b00;
    --mud-palette-error: #a50000;
    --mud-palette-appbar-text: #ffffff;
    --mud-palette-drawer-background: #ffffff;
    --mud-palette-drawer-text: rgba(0,0,0,1);
    --mud-palette-lines-default: rgba(0,0,0,0.5); /* visible borders */
    --mud-palette-primary-text: #ffffff;
    --mud-palette-secondary-text: #ffffff;
    /* Order List */
    --order-filter-border: #000000;
    --order-filter-bg-start: #ffffff;
    --order-filter-bg-end: #ffffff;
    --order-filter-shadow: none;
    --order-filter-header-bg: #e6edf8;
    --order-filter-header-text: #002a6b;
    --order-filter-pickup-border: #000000;
    --order-filter-pickup-bg: #ffffff;
}