/* static/css/contact-page.css */

.contact-hero {
    background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('https://images.unsplash.com/photo-1522069169874-c58ec4b76259?ixlib=rb-4.0.3&auto=format&fit=crop&w=1470&q=80');
    background-size: cover;
    background-position: center;
}

.section-title {
    font-weight: 700;
    color: var(--bs-primary);
}

.contact-reason-card {
    background-color: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: 0.5rem;
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
	cursor: pointer; 
}

.contact-reason-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

.contact-form-wrapper {
    background-color: var(--bs-body-bg);
    border-radius: 0.75rem;
    border: 1px solid var(--bs-border-color);
    box-shadow: 0 5px 20px rgba(0,0,0, .07);
}

/* Style for floating forms in both light and dark mode */
.contact-form-wrapper .form-control,
.contact-form-wrapper .form-select {
    background-color: var(--bs-tertiary-bg) !important;
    color: var(--bs-body-color) !important;
    border-color: var(--bs-border-color);
}

.contact-form-wrapper .form-control:focus {
    background-color: var(--bs-body-bg);
}

/* --- Tom Select Dark Theme Styling --- */
.ts-control {
    background-color: var(--bs-tertiary-bg) !important;
    border-color: var(--bs-border-color) !important;
    padding: 0.65rem 0.75rem !important;
    border-radius: 0.375rem;
}
.ts-wrapper.single .ts-control .ts-input {
    color: var(--bs-body-color);
}
.ts-dropdown {
    background-color: var(--bs-body-bg);
    border-color: var(--bs-border-color);
}
.ts-dropdown .option {
    color: var(--bs-body-color);
}
.ts-dropdown .option:hover, .ts-dropdown .active {
    background-color: var(--bs-primary);
    color: #fff;
}