/* Contact card — light-theme friendly */
.contact-card {
    max-width: 820px;
    margin: 2.25rem auto;
    border: 1px solid var(--card-border, #cbd5e1);
    border-radius: 6px;
    background: var(--card-bg, #ffffff);
    overflow: hidden;
    box-shadow: 0 8px 30px rgba(0,0,0,0.06);
}
.contact-card .titlebar {
    background-color: var(--card-titlebar-bg, #001f3f);
    padding: 0.75rem 1rem;
}
.contact-card .titlebar h2 {
    margin: 0;
    color: var(--card-title-color, #6CA6CD);
    font-size: 1.25rem;
    font-weight: 700;
    text-align: center;
}
.contact-card .card-body {
    padding: 1.5rem;
    color: var(--card-text, #214a5a);
    text-align: left; /* keep form fields left-aligned */
}
.contact-card .form-row { margin-bottom: 0.9rem; text-align: left; }
.contact-card input[type="text"],
.contact-card input[type="email"],
.contact-card textarea,
.contact-card select {
    width: 100%;
    padding: .5rem .75rem;
    border: 1px solid var(--input-border, #ced4da);
    border-radius: 4px;
    box-sizing: border-box;
    font-size: 0.95rem;
    background: var(--input-bg, #ffffff);
    color: var(--input-color, #214a5a);
}
.contact-card textarea { min-height: 140px; resize: vertical; }
.contact-card .submit-row { text-align: center; }
.contact-card .btn-submit {
    background-color: var(--btn-primary-bg, #6CA6CD);
    color: var(--btn-primary-color, #001f3f);
    border: none;
    padding: .55rem 1rem;
    border-radius: 4px;
    font-weight: 700;
    display: inline-block;
    margin: 1rem 0 0;
}
.contact-card .btn-submit:hover { background-color: #5aa0bf; }

@media (max-width: 576px) {
    .contact-card { margin: 1rem; }
}
/* Dark-theme overrides so the contact card adapts when body.dark-theme is active */
body.dark-theme .contact-card {
    background: var(--card-bg) !important;
    border: 1px solid var(--card-border) !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.45) !important;
}
body.dark-theme .contact-card .card-body {
    color: var(--card-text) !important;
}
body.dark-theme .contact-card input[type="text"],
body.dark-theme .contact-card input[type="email"],
body.dark-theme .contact-card textarea,
body.dark-theme .contact-card select {
    background-color: rgba(255,255,255,0.02) !important;
    color: var(--card-text) !important;
    border: 1px solid var(--card-border) !important;
}
body.dark-theme .contact-card .titlebar {
    background-color: var(--card-bg) !important;
}
body.dark-theme .contact-card .titlebar h2 {
    color: var(--card-text, #FFFFFF) !important;
}
body.dark-theme .contact-card .btn-submit {
    background-color: var(--menu-link-color) !important;
    color: var(--card-text) !important;
    border: 1px solid rgba(255,255,255,0.04) !important;
}
body.dark-theme .contact-card .btn-submit:hover {
    background-color: rgba(102,51,153,0.85) !important;
}