/* Sunnyside Auto Repair — Clean Blue theme */
:root {
    --ss-primary: #2563eb;
    --ss-primary-hover: #1d4ed8;
    --ss-primary-light: #eff6ff;
    --ss-background: #f5f8fc;
    --ss-surface: #ffffff;
    --ss-heading: #1e293b;
    --ss-text: #334155;
    --ss-muted: #64748b;
    --ss-border: #dfe7f1;
    --ss-success: #15803d;
    --ss-warning: #a16207;
    --ss-danger: #b42318;
    --ss-radius: 14px;
}
html { min-height: 100%; }
body {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: var(--ss-background);
    color: var(--ss-text);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.55;
}
h1, h2, h3, h4, h5, h6 { color: var(--ss-heading); }
a { color: var(--ss-primary); }
a:hover { color: var(--ss-primary-hover); }
:focus-visible { outline: 3px solid #93c5fd; outline-offset: 2px; }
.skip-link { position: absolute; left: 12px; top: -60px; z-index: 1100; background: white; padding: 8px 12px; }
.skip-link:focus { top: 8px; }
.site-header { position: relative; z-index: 10; }
.site-navbar {
    min-height: 74px;
    background: var(--ss-surface);
    border-bottom: 1px solid var(--ss-border);
    box-shadow: 0 2px 12px rgba(30, 41, 59, .035);
}
.brand-mark { display: inline-flex; align-items: center; gap: 10px; color: var(--ss-heading); padding: 0; }
.brand-mark:hover { color: var(--ss-heading); }
.brand-symbol { display: inline-grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: var(--ss-primary-light); color: var(--ss-primary); font-size: 24px; font-weight: 800; }
.brand-wordmark { display: block; font-size: 16px; font-weight: 800; letter-spacing: .6px; line-height: 1.05; }
.brand-wordmark small { display: block; margin-top: 5px; font-size: 9px; font-weight: 600; letter-spacing: 2px; color: var(--ss-muted); }
.site-navbar .nav-link { color: var(--ss-text); font-weight: 600; padding: 8px 12px !important; border-radius: 9px; }
.site-navbar .nav-link:hover, .site-navbar .nav-link:focus { color: var(--ss-primary); background: var(--ss-primary-light); }
.site-navbar .nav-username { color: var(--ss-muted); font-weight: 500; }
.site-navbar .navbar-toggler { border-color: var(--ss-border); }
.site-navbar .navbar-toggler:focus { box-shadow: 0 0 0 .18rem rgba(37,99,235,.2); }
.site-main { flex: 1 0 auto; width: 100%; }
.site-footer { background: #ffffff; border-top: 1px solid var(--ss-border); color: var(--ss-muted); padding: 23px 0; margin-top: 35px; font-size: 12px; }
.site-footer strong { color: var(--ss-heading); }
.page-heading { padding: 28px 0 20px; }
.page-title { font-size: 28px; font-weight: 750; margin-bottom: 6px; }
.text-muted, .muted { color: var(--ss-muted) !important; }
.dashboard-card, .ss-card, .panel, .form-card, .calendar-panel {
    background: var(--ss-surface);
    border: 1px solid var(--ss-border);
    border-radius: var(--ss-radius);
    padding: 22px;
    box-shadow: 0 2px 12px rgba(30, 41, 59, .025);
}
.section-title { font-size: 19px; font-weight: 700; margin-bottom: 18px; }
.stat-number { font-size: 32px; font-weight: 750; color: var(--ss-heading); }
.btn { border-radius: 9px; font-weight: 600; }
.btn-primary { --bs-btn-bg: #2563eb; --bs-btn-border-color: #2563eb; --bs-btn-hover-bg: #1d4ed8; --bs-btn-hover-border-color: #1d4ed8; --bs-btn-active-bg: #1d4ed8; --bs-btn-active-border-color: #1d4ed8; }
.btn-outline-primary { --bs-btn-color: #2563eb; --bs-btn-border-color: #2563eb; --bs-btn-hover-bg: #2563eb; --bs-btn-hover-border-color: #2563eb; --bs-btn-active-bg: #1d4ed8; }
.form-control, .form-select { border: 1px solid #cfd9e6; border-radius: 9px; padding: 10px 12px; color: var(--ss-text); }
.form-control:focus, .form-select:focus { border-color: var(--ss-primary); box-shadow: 0 0 0 .2rem rgba(37,99,235,.12); }
.form-label { font-weight: 600; color: var(--ss-heading); }
.table { --bs-table-color: #334155; --bs-table-border-color: #e5edf5; }
.table thead th { color: #475569; background: #f8fafc; font-weight: 700; }
.ss-status { display: inline-block; font-size: 12px; font-weight: 650; padding: 5px 9px; border-radius: 7px; background: #f1f5f9; color: #475569; }
.ss-status-requested { background: #fef3c7; color: #92400e; }
.ss-status-active { background: #dbeafe; color: #1d4ed8; }
.ss-status-ready, .ss-status-confirmed, .ss-status-completed { background: #dcfce7; color: #166534; }
.ss-status-cancelled { background: #fee2e2; color: #991b1b; }
@media (max-width: 991.98px) {
    .site-navbar { min-height: 64px; }
    .site-navbar .navbar-collapse { border-top: 1px solid var(--ss-border); margin-top: 12px; padding: 12px 0 5px; }
    .site-navbar .nav-logout { padding: 5px 12px; }
}
@media (max-width: 575.98px) {
    .brand-symbol { width: 36px; height: 36px; font-size: 20px; }
    .brand-wordmark { font-size: 13px; }
    .brand-wordmark small { font-size: 8px; }
    .page-title { font-size: 23px; }
    .dashboard-card, .ss-card, .panel, .form-card, .calendar-panel { padding: 16px; }
    .footer-description { display: block; }
}