/* Shared UI tokens + common component styles */
:root {
    --bg-app: #f7f9fb;
    --bg-surface: #f8f9fa;
    --bg-panel: #ffffff;
    --bg-panel-soft: #fdfdfd;
    --bg-panel-alt: #f1f3f5;
    --bg-canvas-a: #f9fafb;
    --bg-canvas-b: #f3f4f6;
    --bg-modal: #f8fafc;
    --bg-section: #f2f4f8;
    --bg-section-alt: #eef2f7;
    --bg-highlight: #ffff00;
    --bg-success-soft: #b6e2c2;
    --bg-info-soft: #d1ecf1;
    --bg-warning-soft: #fff3cd;
    --bg-annotation-highlight: #d8f5d0;
    --text-dark: #000000;
    --text-body: #212529;
    --text-secondary: #495057;
    --text-strong: #111827;
    --text-heading: #1f2937;
    --text-muted: #6b7280;
    --text-muted-strong: #6c757d;
    --text-on-dark: #ffffff;
    --border-muted: #dee2e6;
    --border-subtle: #e5e7eb;
    --border-dashed: #d1d5db;
    --status-error: #dc3545;
    --status-warning: #ff8b07;
    --status-success-strong: rgba(25, 135, 84, 0.85);
    --status-warning-strong: rgba(255, 193, 7, 0.9);
    --status-danger-strong: rgba(220, 53, 69, 0.9);
    --badge-system: #6c757d;
    --badge-chatbot: #178969;
    --badge-user: #17a2b8;
    --badge-assistant: #ffc107;
    --link: #2563eb;
    --link-hover: #1d4ed8;
    --selection-outline: #f80612;
    --selection-bg: rgba(13, 110, 253, 0.05);
    --overlay-bg: rgba(33, 37, 41, 0.5);
    --shadow-soft: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.08);
    --shadow-card: 0 2px 4px rgba(0, 0, 0, 0.1);
    --radius-sm: 0.35rem;
    --radius-md: 0.5rem;
    --radius-lg: 8px;
    --radius-xs: 3px;
}

/* Compact search toolbar shared across search pages */
.search-toolbar {
    background-color: var(--bg-surface);
    border-radius: var(--radius-md);
    padding: 0.25rem 0.75rem;
    box-shadow: var(--shadow-soft);
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.search-toolbar .form-label {
    font-size: 0.80rem;
    margin-bottom: 0.1rem;
}

.search-toolbar .form-select,
.search-toolbar .form-control {
    padding-top: 0.15rem;
    padding-bottom: 0.15rem;
}

.search-toolbar .btn,
.search-toolbar .btn-sm {
    padding-top: 0.15rem;
    padding-bottom: 0.15rem;
}

.search-toolbar .row {
    --bs-gutter-y: 0.25rem;
    --bs-gutter-x: 0.5rem;
}

.toolbar-group {
    background-color: var(--bg-panel);
    border: 1px solid var(--border-muted);
    border-radius: var(--radius-sm);
    padding: 0.25rem 0.5rem;
}

/* Variant backgrounds for grouped toolbar rows */
#bulk_edit_row .toolbar-group {
    background-color: var(--bg-panel-soft);
}

#selection_actions_row .toolbar-group {
    background-color: var(--bg-panel-alt);
}

.toolbar-group .form-label {
    margin-bottom: 0.1rem;
    font-size: 0.78rem;
}

.toolbar-group .form-select,
.toolbar-group .form-control {
    padding-top: 0.15rem;
    padding-bottom: 0.15rem;
}

/* Shared no-spin utility */
.no-spin {
    -moz-appearance: textfield;
    appearance: textfield;
}

.no-spin::-webkit-inner-spin-button,
.no-spin::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Asset grid sizing defaults used by multiple pages */
.asset-grid {
    --asset-card-size: 320px;
    --asset-card-aspect: 16 / 9;
    --asset-card-gap: 0.5rem;
}