:root {
    --slate: #2C3E50; --slate-dark: #1a252f;
    --navy: #1a252f; 
    --paper: #F8F9FA;
    --text: #333; 
    --border: #E5E7EB; 
    --teal: #16A085; --teal-dark: #138D75;
    --amber: #F59E0B;
}

body { 
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; 
    background: var(--paper); 
    color: var(--text); 
    margin: 0; 
    line-height: 1.6; 
}

.container { max-width: 1140px; margin: 0 auto; padding: 24px; }
a { color: var(--slate); text-decoration: none; transition: color 0.2s ease; }
a:hover { color: var(--teal); }

/* --- ACCESSIBILITY FIX: Contrast Override --- */
/* This forces any grey text to be dark enough to pass Google's audit */
p[style*="color: #777"], .text-muted, .small-text {
    color: #4a4a4a !important; 
}

/* HEADER */
.top-bar { background: var(--navy); color: white; padding: 10px 0; font-size: 0.85rem; }
.top-bar .inner { display: flex; justify-content: space-between; align-items: center; }
.hero { background: white; padding: 40px 0; border-bottom: 1px solid var(--border); }
.hero h1 { margin: 0 0 10px; color: var(--slate); font-size: 1.8rem; }

/* FORMS & CARDS */
/* Updated for Depth (Federal Paper Look) */
.card { 
    background: white; 
    border: 1px solid var(--border); 
    padding: 25px; 
    border-radius: 8px; 
    margin-bottom: 20px; 
    /* Soft shadow to lift paper off desk */
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.03);
    transition: box-shadow 0.3s ease;
}

/* Subtle hover effect for cards to feel tactile */
.card:hover {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.05), 0 4px 6px -2px rgba(0, 0, 0, 0.025);
}

.input-group { display: flex; gap: 10px; }

/* Updated Input Focus States */
input, select { 
    flex: 1; 
    padding: 12px; 
    border: 1px solid #ccc; 
    border-radius: 4px; 
    font-size: 1rem; 
    outline: none; /* Remove default browser glow */
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

input:focus, select:focus {
    border-color: var(--teal);
    box-shadow: 0 0 0 3px rgba(22, 160, 133, 0.15); /* Faint Teal Glow */
}

/* BUTTONS */
.btn { 
    display: inline-block; 
    padding: 12px 20px; 
    border-radius: 4px; 
    font-weight: 600; 
    cursor: pointer; 
    border: none; 
    text-align: center; 
    transition: all 0.2s ease-in-out; /* Smooth transition */
    text-decoration: none; /* Ensures no underline on links */
}

.btn:active {
    transform: scale(0.98); /* Click press effect */
}

.btn-primary { 
    background: var(--slate); 
    color: white; 
    box-shadow: 0 2px 4px rgba(44, 62, 80, 0.2);
}
.btn-primary:hover {
    background: var(--slate-dark);
    color: white !important; /* FIXED: Forces text to stay white */
    box-shadow: 0 4px 8px rgba(44, 62, 80, 0.3);
}

.btn-success { 
    background: var(--teal); 
    color: white; 
    box-shadow: 0 2px 4px rgba(22, 160, 133, 0.2);
}
.btn-success:hover {
    background: var(--teal-dark);
    color: white !important; /* FIXED: Forces text to stay white */
    box-shadow: 0 4px 8px rgba(22, 160, 133, 0.3);
}

.btn-outline { 
    border: 1px solid var(--border); 
    background: white; 
    color: var(--text); 
}
.btn-outline:hover {
    background: #f3f4f6;
    border-color: #cbd5e1;
    color: var(--text) !important; /* Keeps text dark */
}

.badge { display: inline-block; padding: 4px 8px; border-radius: 4px; font-size: 0.8rem; font-weight: bold; }
.badge-red { background: #fee2e2; color: #b91c1c; }
.badge-green { background: #d1fae5; color: #047857; }

/* UTILITY */
.grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
@media(max-width:600px) { .grid, .input-group { grid-template-columns: 1fr; flex-direction: column; } }
.alert { background: #fff3cd; color: #856404; padding: 10px; border-radius: 4px; font-size: 0.9rem; margin-top: 10px; }

/* MOBILE TWEAKS */
@media(max-width: 768px) { 
    .container { padding: 0 16px; } 
    .header-flex, .grid-3, .footer-cols { flex-direction: column; display: flex; } 
    .input-group { flex-direction: column; } 
    input[type="text"] { border-radius: 4px; border-right: 1px solid #999; margin-bottom: 10px; width: 100%; box-sizing: border-box; } 
    button.search-btn { border-radius: 4px; padding: 12px; width: 100%; } 
    
    .search-options { 
        flex-direction: column; 
        gap: 8px; 
        margin-bottom: 15px; 
    }

    /* --- ACCESSIBILITY FIX: Touch Targets --- */
    /* Adds spacing to phone/email links on mobile to pass audit */
    a[href^="tel:"], a[href^="mailto:"] {
        display: inline-block;
        padding: 12px 0;
        min-height: 44px;
    }
}
/* 4-Column Grid Layout */
.grid-4 {
    display: grid;
    grid-template-columns: repeat(4, 1fr); 
    gap: 20px;
}
@media(max-width: 992px) { .grid-4 { grid-template-columns: repeat(2, 1fr); } }
@media(max-width: 768px) { .grid-4 { grid-template-columns: 1fr; } }