/* QuickFill: flat theme (charcoal & electric blue). Surfaces use 1px borders instead of Material shadows. */

:root {
    --qf-border: #d0d7de;
    --qf-border-muted: #eaeef2;
    --qf-canvas: #f6f8fa;
    --qf-text: #1f2328;
    --qf-muted: #656d76;
    --qf-accent: #2f81f7;
    --qf-accent-strong: #0969da;
    --qf-accent-subtle: #ddf4ff;
    --qf-success: #1a7f37;
    --qf-warning: #9a6700;
    --qf-warning-fill: #d4a72c;
    --qf-danger: #cf222e;
    --qf-overlay-shadow: 0 8px 24px rgba(140, 149, 159, 0.25);
}

html, body {
    font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;
    background-color: var(--qf-canvas);
    color: var(--qf-text);
    -webkit-font-smoothing: antialiased;
    font-feature-settings: "cv11", "ss01";
}

a, .btn-link { color: #1f6feb; }
a:hover { color: var(--qf-accent-strong); }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #d0d7de; border-radius: 10px; border: 2px solid var(--qf-canvas); }
::-webkit-scrollbar-thumb:hover { background: #afb8c1; }

/* ---------- Flat surfaces ---------- */

/* Cards and papers: border, no shadow. Overlays (menus, popovers, dialogs, snackbars) keep one soft shadow. */
.mud-card,
.mud-paper:not(.mud-popover):not(.mud-dialog):not(.mud-snackbar):not(.mud-appbar):not(.mud-table):not(.mud-expand-panel) {
    border: 1px solid var(--qf-border);
    box-shadow: none !important;
}
.mud-table { border-radius: 8px; box-shadow: none !important; }
.mud-table.mud-table-outlined, .mud-table-bordered { border-color: var(--qf-border); }
.mud-popover, .mud-dialog, .mud-snackbar {
    border: 1px solid var(--qf-border);
    box-shadow: var(--qf-overlay-shadow) !important;
}
.mud-dialog { border-radius: 12px !important; }
.mud-dialog .mud-dialog-title { border-bottom: 1px solid var(--qf-border-muted); }
.mud-dialog .mud-dialog-actions { border-top: 1px solid var(--qf-border-muted); padding: 12px 24px; gap: 8px; }

/* App bar: flat charcoal with a hairline, no shadow */
.mud-appbar { box-shadow: none !important; border-bottom: 1px solid #000; }

/* No Material ripple effects anywhere */
.mud-ripple::after, .mud-ripple:after, .mud-ripple-icon::after, .mud-ripple-icon:after,
.mud-ripple-radio::after, .mud-ripple-checkbox::after, .mud-ripple-switch::after { display: none !important; }

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

.mud-button-root.mud-button { border-radius: 6px; font-weight: 500; letter-spacing: normal; }
.mud-button-filled { box-shadow: none !important; }
.mud-button-filled.mud-button-filled-primary:hover { background-color: var(--qf-accent-strong); }
.mud-button-outlined { border-color: var(--qf-border); background: #fff; }
.mud-button-outlined:hover { background: var(--qf-canvas); border-color: #afb8c1; }
.mud-button-outlined.mud-button-outlined-primary { color: var(--qf-accent-strong); }
.mud-icon-button { border-radius: 6px; }
.mud-appbar .mud-icon-button:hover { background: rgba(255, 255, 255, 0.08); }

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

.mud-input.mud-input-outlined .mud-input-outlined-border { border-color: var(--qf-border); border-radius: 6px; }
.mud-input.mud-input-outlined:hover .mud-input-outlined-border { border-color: #afb8c1; }
.mud-input.mud-input-outlined:focus-within > .mud-input-outlined-border,
.mud-input.mud-input-outlined:focus-within .mud-shrink > .mud-input-outlined-border {
    border-color: var(--qf-accent);
    border-width: 1px !important;
    box-shadow: 0 0 0 3px rgba(47, 129, 247, 0.25);
}
.mud-input-control .mud-input-helper-text { color: var(--qf-muted); }

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

.mud-table-head .mud-table-cell, .mud-simple-table thead th {
    background: var(--qf-canvas);
    color: var(--qf-muted);
    font-weight: 600;
    font-size: .75rem;
    text-transform: uppercase;
    letter-spacing: .04em;
}
.mud-table-cell, .mud-simple-table td { border-color: var(--qf-border-muted) !important; }
.mud-simple-table { border-radius: 8px; overflow: hidden; }

/* ---------- Chips, tabs, stepper, expansion panels ---------- */

.mud-chip { border-radius: 999px; font-weight: 500; }
.mud-chip.mud-chip-size-small { font-size: .75rem; }
.mud-tabs-tabbar { border-bottom: 1px solid var(--qf-border); }
.mud-tab { text-transform: none; font-weight: 500; letter-spacing: normal; }
.mud-expand-panel { border-radius: 8px !important; box-shadow: none !important; }
.mud-step-label-icon { box-shadow: none; }
.mud-alert { border-radius: 8px; }

/* ---------- App furniture ---------- */

.tool-card {
    transition: border-color 0.15s ease, background-color 0.15s ease;
    cursor: pointer;
}
.tool-card:hover { border-color: var(--qf-accent) !important; background: #fbfdff; }

.loading-overlay {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(246, 248, 250, 0.7);
    backdrop-filter: blur(2px);
    z-index: 9999;
}

.app-wordmark {
    font-size: 1.125rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: #ffffff;
    white-space: nowrap;
}
.app-wordmark-accent { color: #4493f8; }

#blazor-error-ui {
    background: var(--qf-danger);
    color: white;
    bottom: 0;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 10000;
}
#blazor-error-ui a { color: white; margin-left: 1rem; }
#blazor-error-ui .dismiss { cursor: pointer; position: absolute; right: 0.75rem; top: 0.5rem; }

.blazor-error-boundary { background: var(--qf-danger); padding: 1rem; color: white; }
.blazor-error-boundary::after { content: "An error has occurred." }

/* Static (server-rendered) login and setup forms */
.sq-field { margin-bottom: 16px; }
.sq-field label {
    display: block;
    font-size: .8125rem;
    font-weight: 500;
    color: var(--qf-text);
    margin-bottom: 6px;
}
.sq-input {
    width: 100%;
    box-sizing: border-box;
    font: inherit;
    font-size: .875rem;
    padding: 9px 12px;
    border: 1px solid var(--qf-border);
    border-radius: 6px;
    background: #ffffff;
    color: var(--qf-text);
    outline: none;
}
.sq-input:focus { border-color: var(--qf-accent); box-shadow: 0 0 0 3px rgba(47, 129, 247, 0.25); }
.sq-validation { color: var(--qf-danger); font-size: .75rem; margin-top: 4px; }

.drop-zone {
    border: 1.5px dashed var(--qf-border) !important;
    background: #fff;
    border-radius: 8px;
    cursor: pointer;
    text-align: center;
    transition: border-color 0.15s, background-color 0.15s;
}
.drop-zone:hover { border-color: var(--qf-accent) !important; background: #fbfdff; }

.text-preview { white-space: pre-wrap; font-size: 0.875rem; max-height: 400px; overflow-y: auto; }

.q-row-needs-input { background: #fff8c5; }
.q-text { white-space: pre-wrap; }
.nowrap { white-space: nowrap; }

.stat-value {
    font-size: 1.625rem;
    font-weight: 600;
    letter-spacing: -0.02em;
    line-height: 1.2;
    color: var(--qf-text);
    font-variant-numeric: tabular-nums;
}

/* ---------- Confidence meter ---------- */

.conf-meter {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
    font-size: .75rem;
    color: var(--qf-text);
    font-variant-numeric: tabular-nums;
}
.conf-track {
    position: relative;
    display: inline-block;
    width: 56px;
    height: 6px;
    border-radius: 3px;
    background: var(--qf-border-muted);
    overflow: hidden;
}
.conf-fill { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 3px; }
.conf-text b { font-weight: 600; margin-right: 2px; }
.conf-high .conf-fill { background: var(--qf-success); }
.conf-high .conf-icon { color: var(--qf-success); }
.conf-medium .conf-fill { background: var(--qf-warning-fill); }
.conf-medium .conf-icon { color: var(--qf-warning); }
.conf-low .conf-fill { background: var(--qf-danger); }
.conf-low .conf-icon { color: var(--qf-danger); }
.conf-lg { font-size: .875rem; gap: 8px; }
.conf-lg .conf-track { width: 140px; height: 8px; border-radius: 4px; }

/* ---------- Citations ---------- */

.citation-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 9px;
    background: var(--qf-accent-subtle);
    color: var(--qf-accent-strong);
    font-size: .6875rem;
    font-weight: 600;
    line-height: 1;
}
.citation-marker { cursor: default; vertical-align: super; margin-left: 2px; }
.ask-answer { white-space: pre-wrap; line-height: 1.65; }

/* ---------- Daily cost bar chart ---------- */

.bar-chart { position: relative; }
.bar-chart svg { display: block; width: 100%; height: auto; max-height: 320px; overflow: visible; }
.bar-chart .grid-line { stroke: var(--qf-border-muted); stroke-width: 1; }
.bar-chart .axis-label { fill: var(--qf-muted); font-size: 11px; font-family: 'Inter', system-ui, sans-serif; }
.bar-chart .bar { fill: var(--qf-accent); }
.bar-chart .bar-hit { fill: transparent; cursor: default; }
.bar-chart .bar-group:hover .bar { fill: var(--qf-accent-strong); }
.bar-chart .bar-tip {
    position: absolute;
    transform: translate(-50%, -100%);
    background: #ffffff;
    border: 1px solid var(--qf-border);
    border-radius: 6px;
    box-shadow: var(--qf-overlay-shadow);
    padding: 6px 10px;
    font-size: .75rem;
    color: var(--qf-text);
    pointer-events: none;
    white-space: nowrap;
}

/* Compact source list in table cells: numbered short titles with the page underneath, clipped to the column */
.src-list { display: flex; flex-direction: column; gap: 6px; min-width: 0; max-width: 100%; }
.src-list .mud-tooltip-root { display: block; min-width: 0; max-width: 100%; }
.src-item { display: flex; align-items: flex-start; gap: 6px; min-width: 0; cursor: default; }
.src-item .citation-num { flex: 0 0 auto; margin-top: 1px; }
.src-text { min-width: 0; flex: 1 1 auto; line-height: 1.3; }
.src-title { font-size: .8125rem; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.src-location { font-size: .7rem; color: var(--qf-muted); }
.q-sources-cell { max-width: 220px; overflow: hidden; }