@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap");

/*
    Corona Seventh-day Adventist Church
    Colors and type taken from https://coronasdachurch.com/
    Teal #33BEAD, gold #D9A500, plum #40343D, ink #111111
*/

:root {
    --csdac-teal: #33BEAD;
    --csdac-gold: #D9A500;
    --csdac-plum: #40343D;
    --csdac-ink: #111111;
    --csdac-paper: #f4f3f1;
    --bs-body-font-family: "Poppins", sans-serif;
}

body {
    font-family: "Poppins", sans-serif;
    background: var(--csdac-paper);
    color: #1a1a1a;
}

#survey-nav.navbar {
    background: var(--csdac-ink);
    box-shadow: none;
    min-height: 76px;
    padding-top: 10px;
    padding-bottom: 10px;
}

#survey-nav .csdac-brand {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-right: auto;
    text-decoration: none;
}

#survey-nav .logo {
    height: 52px;
    width: auto;
}

#survey-nav .csdac-wordmark {
    color: rgba(255, 255, 255, 0.72);
    font-family: "Poppins", sans-serif;
    font-size: 1.35rem;
    font-weight: 400;
    letter-spacing: 0.01em;
    line-height: 1;
}

#survey-nav .csdac-wordmark-strong {
    color: #ffffff;
    font-weight: 700;
}

#survey-nav .navbar-toggler {
    color: #ffffff;
    border-color: transparent;
}

#survey-nav .navbar-toggler:focus {
    box-shadow: 0 0 0 2px var(--csdac-gold);
}

body .btn-primary {
    color: #ffffff;
    background-color: var(--csdac-plum);
    border-color: var(--csdac-plum);
    border-radius: 3px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

body .btn-primary:hover,
body .btn-primary:focus,
body .btn-primary:active {
    color: #111111;
    background-color: var(--csdac-gold);
    border-color: var(--csdac-gold);
}

body .btn-outline-secondary {
    border-radius: 3px;
    font-weight: 600;
}

body .progress-bar {
    background-color: var(--csdac-gold);
}

body a {
    color: #0f7d73;
}

body a:hover {
    color: #0a5c55;
}

body .form-check-input:checked,
body .form-range::-webkit-slider-thumb {
    background-color: var(--csdac-plum);
    border-color: var(--csdac-plum);
}

body .form-control:focus,
body .form-select:focus {
    border-color: var(--csdac-teal);
    box-shadow: 0 0 0 0.2rem rgba(51, 190, 173, 0.25);
}

.csdac-footer {
    background: var(--csdac-ink);
    color: rgba(255, 255, 255, 0.78);
    margin-top: 3rem;
    padding: 1.75rem 0 1.5rem;
    text-align: center;
}

.csdac-footer p {
    margin: 0.15rem 0;
}

.csdac-footer-name {
    color: #ffffff;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.csdac-footer a {
    color: var(--csdac-teal);
    text-decoration: none;
}

.csdac-footer a:hover {
    color: #ffffff;
}

#surveys-list-jumbotron {
    text-align: center;
    padding-top: 0.5rem;
}

#surveys-list-jumbotron .h3 {
    display: block;
    color: var(--csdac-plum);
    font-weight: 700;
}

@media (max-width: 576px) {
    #survey-nav .csdac-wordmark {
        font-size: 1rem;
    }

    #survey-nav .logo {
        height: 40px;
    }
}