/* Bau-Kunden brand palette: warm paper, ink and one signal accent. */
:root {
    --paper: #f7f3ec;
    --ink: #1f160f;
    --muted: #635950;
    --accent: #ee333e;
    --accent-dark: #a9001a;
    --glass: #fcfaf6;
    --line: rgba(31, 22, 15, .12);
    --surface-soft: #ede7df;
    --surface: var(--glass);
    --sidebar: var(--glass);
    --canvas: var(--paper);
    --primary: var(--accent);
    --primary-dark: var(--accent-dark);
    --green: var(--accent);
    --shadow: 0 14px 34px rgba(31, 22, 15, .07);
}

body,
.app-shell,
.auth-page,
.onboarding-page { background: var(--paper) !important; color: var(--ink) !important; }

body, .nav-item, .btn, input, select, textarea, button { font-family: 'Poppins', sans-serif; }
a, .text-link { color: var(--accent); }
a:hover, .text-link:hover { color: var(--accent-dark); }

.sidebar, .topbar { background: rgba(252, 250, 246, .96) !important; border-color: var(--line) !important; }
.brand-lockup, .auth-brand > span { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 0; }
.auth-brand { gap: 0 !important; }
.auth-brand strong, .brand-name { color: var(--ink) !important; font-family: 'Poppins', sans-serif !important; font-weight: 800 !important; letter-spacing: -.6px; }
.auth-brand strong { font-size: 18px; line-height: 1.05; }
.auth-brand small, .brand-caption { color: var(--muted) !important; font-family: 'Poppins', sans-serif !important; font-size: 9px; letter-spacing: .35px; line-height: 1.35; margin-top: 3px; }
.brand-row { gap: 0 !important; }
.brand-name, .page-heading h1, .panel h2, .metric-value, .admin-hero h2,
.auth-header h2, .pitch-content h1, .onboarding-card h1, .onboarding-card h2 { color: var(--ink) !important; }
.brand-caption, .workspace-type, .page-heading p, .panel-heading p, .metric-label,
.breadcrumb-line, .field-help, .auth-header p, .pitch-content p, .onboarding-intro,
.table-person small, .table-sub { color: var(--muted) !important; }

.workspace-switcher, .metric-card, .panel, .btn-soft, .select-button,
.search-box, .kanban-card, .settings-info-card, .onboarding-card,
.form-control, .form-select, .input-wrap input, .phone-input-group .form-select,
.auth-form-card, .service-catalog-card, .radio-cards span, .budget-cards span,
.verification-card, .document-preview, .city-results { background: var(--glass) !important; border-color: var(--line) !important; }
.metric-card, .panel, .onboarding-card, .auth-form-card { box-shadow: var(--shadow) !important; }

.nav-item { color: var(--muted) !important; }
.nav-item .bi { color: var(--muted) !important; }
.nav-item:hover, .nav-item.active { color: var(--accent) !important; background: rgba(238, 51, 62, .09) !important; }
.nav-item:hover .bi, .nav-item.active .bi { color: var(--accent) !important; }
.nav-badge, .nav-dot { background: var(--accent) !important; color: #fff !important; }
.topbar-divider, .user-row, .table-panel .panel-heading, .lead-table th,
.lead-table td, .admin-table th, .admin-table td { border-color: var(--line) !important; }

.btn-primary-custom, .auth-submit, .onboarding-actions .btn-primary-custom {
    background: var(--accent) !important; border-color: var(--accent) !important; color: #fff !important;
    box-shadow: 0 8px 18px rgba(238, 51, 62, .2) !important;
}
.btn-primary-custom:hover, .auth-submit:hover, .onboarding-actions .btn-primary-custom:hover {
    background: var(--accent-dark) !important; border-color: var(--accent-dark) !important;
}
.btn-soft { color: var(--ink) !important; }
.btn-soft:hover, .btn-soft.active { color: var(--accent) !important; background: rgba(238, 51, 62, .08) !important; border-color: rgba(238, 51, 62, .35) !important; }

.metric-icon, .status-blue, .status-purple, .status-amber, .status-green, .status-gray,
.status-red, .workspace-avatar, .help-card, .status-orb, .integration-logo,
.provider-icon, .sparkle-icon, .insight-card, .ad-status, .readonly-note { background: var(--surface-soft) !important; color: var(--accent) !important; }
.status-pill, .live-pill, .source-badge { background: rgba(238, 51, 62, .1) !important; border-color: rgba(238, 51, 62, .2) !important; color: var(--accent-dark) !important; }
.status-select { background: rgba(238, 51, 62, .1) !important; color: var(--accent-dark) !important; }
.text-green, .text-success, .text-warning, .text-muted { color: var(--accent-dark) !important; }
.progress-track span, .budget-bar span { background: var(--accent) !important; }
.form-control:focus, .form-select:focus, .input-wrap input:focus {
    border-color: var(--accent) !important; box-shadow: 0 0 0 4px rgba(238, 51, 62, .12) !important;
}
.form-label, .field-label-row label { color: var(--ink) !important; }
.field-required, .eyebrow, .pitch-kicker, .onboarding-card .eyebrow { color: var(--accent) !important; }
.form-check-input:checked, input[type='checkbox']:checked { background-color: var(--accent); border-color: var(--accent); }

.auth-pitch { background: var(--ink) !important; }
.auth-pitch::before { background-image: linear-gradient(rgba(247, 243, 236, .06) 1px, transparent 1px), linear-gradient(90deg, rgba(247, 243, 236, .06) 1px, transparent 1px) !important; }
.auth-brand, .pitch-proof { color: var(--paper) !important; }
.auth-pitch .auth-brand strong { color: var(--paper) !important; }
.auth-pitch .auth-brand small, .pitch-footer, .pitch-content p { color: rgba(247, 243, 236, .7) !important; }
.mobile-auth-brand .auth-brand, .mobile-auth-brand .auth-brand strong,
.onboarding-header .auth-brand, .onboarding-header .auth-brand strong { color: var(--ink) !important; }
.mobile-auth-brand .auth-brand small, .onboarding-header .auth-brand small { color: var(--muted) !important; }
.pitch-content h1 em, .pitch-footer a { color: var(--accent) !important; }
.proof-icon { background: rgba(238, 51, 62, .16) !important; color: var(--accent) !important; }
.auth-form-wrap { background: var(--paper) !important; }
.auth-language { border-color: var(--line) !important; }
.auth-mobile-footer a, .auth-footer-links a, .field-label-row a { color: var(--accent) !important; }

.onboarding-header { background: rgba(252, 250, 246, .94) !important; border-color: var(--line) !important; }
.progress-track { background: var(--surface-soft) !important; }
.progress-label strong, .step-dot.current small, .step-dot.done span { color: var(--accent) !important; }
.step-dot.done span { background: rgba(238, 51, 62, .1) !important; border-color: rgba(238, 51, 62, .2) !important; }
.service-catalog-card:hover, .service-catalog-card:has(input:checked), .radio-cards input:checked + span, .budget-cards input:checked + span { background: rgba(238, 51, 62, .08) !important; border-color: rgba(238, 51, 62, .45) !important; box-shadow: 0 0 0 4px rgba(238, 51, 62, .08) !important; }
.service-catalog-card strong, .radio-cards span strong, .budget-cards span strong, .hours-row strong { color: var(--ink) !important; }
.service-catalog-card small, .radio-cards span small, .budget-cards span small { color: var(--muted) !important; }
.service-area-summary, .custom-hours-panel, .profile-note, .budget-note { background: var(--surface-soft) !important; border-color: var(--line) !important; }
.city-result:hover, .city-result:focus-visible { background: rgba(238, 51, 62, .08) !important; }
.city-result-icon { background: rgba(238, 51, 62, .1) !important; color: var(--accent) !important; }

/* Keep dark mode available in settings, but use the same brand accent. */
.dark-mode { --primary: var(--accent); --primary-dark: var(--accent-dark); }
.dark-mode .btn-primary-custom { background: var(--accent) !important; }
