@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;1,300;1,400&family=Source+Code+Pro:wght@400;600&display=swap');

html {
    scroll-behavior: smooth;
}

#webappforprogress-container a:not(.btn):not(.nav-link):not(.badge):not(.dropdown-item) {
    background-color: #eff2f3;
}

/* For some reason, btn-default is used by django-two-factor-auth but is
 * not actually a real thing in normal Bootstrap. */
.btn-default {
    color: #ffffff;
    background-color: #515151;
    border-color: #515151;
}


.opacity-50 {
    opacity: 0.5;
}

#site-header {
    position: sticky;
    top: 0;
    z-index: 20;
}

.header-search--container {
    position: relative;


}


.header-search--container label {
    position: absolute;
    top: 50%;
    left: 0.5rem;
    transform: translateY(-50%);
    color: white;
}

.header-search--container label:focus {
    color: green;
}
.header-search--container input {
    background: #203843;
    color: white;
    padding-left: 2rem;
    border: none;
    border-radius: 0;
}

.header-search--container input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
        color: #97A5AB;
    opacity: 1; /* Firefox */
}

.header-search--container input:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #97A5AB;
}

.header-search--container input::-ms-input-placeholder { /* Microsoft Edge */
    color: #97A5AB;
}

.header-search--container input:active,
.header-search--container input:focus,
.header-search--container input:hover,
.header-search--container input:focus-within,
.header-search--container input:focus-visible {
    color: white;
    background: #203843;
    border-radius: 1px solid #203843;
}

.secondary-link {
    background-color: white !important;
}


.navbar-brand {
    font-size: 1rem;
}

.nav-link.dropdown-toggle:after {
    display: none;
}

.nav-link.dropdown-toggle {
    /* z-index: 12; */
    position: relative;
}

.dropdown-menu {
    box-shadow: 0px 4px 4px -1px rgb(0 0 0 / 25%);
    border-radius: 0;
    border: none;
}

.bg-dark {
    background: #02070A !important;
}

.help-link {
    border-radius: 50%;
    color: white;
    background-color: #203843;
    height: 25px;
    width: 25px;
    display: flex;
    align-items: center;
    margin-top: .5rem;
}

.card {
    background: #eff2f3;
    padding: 1.5rem 2rem 1rem 2rem;
    border-radius: 0.25rem;
    border: none;
}

.table .thead-light th {
    background-color: #eff2f3;
    border: none;
}

/* So the two-factor setup method selector is a little less ugly. */
ul#id_method-method {
    list-style-type: none;
}

/* don't let code tags wrapped in anchor tags lose the lovely pink color! */
a code {
    color: var(--pink);
    font-weight: bold;
}

/* The "monotony" Bootstrap theme makes form errors hard to spot; this resets
   to the default Bootstrap color and makes the text bold for visibility. */
.invalid-feedback {
    font-weight: bold;
    color: var(--red);
}

#process-form-container #id_survey_grouping,
#process-form-container #id_mutual_survey_group {
    height: 14em;
}

.related-imports .current code {
    margin-left: -1.25em;
}

.related-imports .current code::before {
    content: "◆ ";
}

.prop-name {
    color: gray;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 0.66em;
    letter-spacing: 0.1em;
    padding-right: 0.5em;
}

.filter-prop-group {
    background-color: #ddd;
    font-size: initial;
}

.question-prop-group {
    position: relative;
    bottom: 0.1rem;
}

.survey-flag {
    color: var(--red) !important;
    cursor: pointer;
    display: block;
    padding: 1rem 0 1rem 1rem;
    margin-left: -1rem;
    margin-top: -1rem;
}

.survey-flag .popover {
    margin-right: -1rem;

}

.survey-no-flags {
    color: var(--green);
    filter: brightness(1.3) saturate(0.6);
}

.survey-flags-list {
    padding-left: 1rem;
    margin-bottom: 0.2rem;
}

.form-group:has(#id_completes_required_override),
.form-group:has(#id_soft_launch_quantity_override) {
    margin-left: 1.2em;
}

.form-group:has(#id_completes_required_override.hidden),
.form-group:has(#id_soft_launch_quantity_override.hidden) {
    display: none;
}
