/******************
   User custom CSS
   LimeSurvey 6.5 – Fruity child theme
   Centered layout + academic color scheme
******************/

/* =========================================================
   Layout: centered, Google Forms–like
   ========================================================= */

html body #main-col,
html body .group-container,
html body .question-container {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}

html body .group-outer-container {
    display: flex;
    justify-content: center;
}

@media (min-width: 992px) {
    html body #main-col,
    html body .group-container,
    html body .question-container {
        max-width: 720px;
    }
}

@media (min-width: 1400px) {
    html body #main-col,
    html body .group-container,
    html body .question-container {
        max-width: 760px;
    }
}

/* =========================================================
   Base colors
   ========================================================= */

html body {
    background-color: #f4f6f8;
    color: #2e2e2e;
}

@media (max-width: 767px) {
    html body {
        background-color: #ffffff;
    }
}

/* =========================================================
   Question cards
   ========================================================= */

html body .question-container {
    background-color: #ffffff;
    border: 1px solid #dcdfe3;
    border-radius: 8px;
    margin-bottom: 24px;
}

html body .question-title-container,
html body .group-title-container {
    color: #1f2933;
    padding-top: 12px;
    padding-bottom: 12px;
}

html body .ls-questionhelp,
html body .questionhelp,
html body .help-block {
    color: #555555;
}

/* =========================================================
   Buttons
   ========================================================= */

html body .btn.btn-primary {
    background-color: #1f5fbf;
    border-color: #1f5fbf;
    color: #ffffff;
    box-shadow: none;
}

html body .btn.btn-primary:hover,
html body .btn.btn-primary:focus {
    background-color: #174a94;
    border-color: #174a94;
    color: #ffffff;
}

html body .btn-group label.btn-primary {
    background-color: #e8eef7;
    border-color: #c7d2e5;
    color: #1f2933;
}

html body .btn-check:checked + .btn-primary {
    background-color: #1f5fbf;
    border-color: #1f5fbf;
    color: #ffffff;
}

html body .btn.btn-secondary,
html body .ls-move-btn,
html body .ls-button-back,
html body .btn.btn-outline-secondary {
    background-color: #e5e7eb;
    border-color: #d1d5db;
    color: #1f2933;
}

html body .btn.btn-secondary:hover,
html body .ls-move-btn:hover,
html body .ls-button-back:hover,
html body .btn.btn-outline-secondary:hover {
    background-color: #d1d5db;
    border-color: #cbd5e1;
    color: #1f2933;
}

/* =========================================================
   Progress bar
   ========================================================= */

html body .progress {
    background-color: #e5e7eb;
}

html body .progress-bar,
html body .progress-bar.bg-success {
    background-color: #1f5fbf;
    color: #ffffff;
}

/* =========================================================
   Form controls and focus
   ========================================================= */

html body .form-control {
    border-color: #cfd4da;
    color: #1f2933;
}

html body .form-control:focus,
html body textarea:focus,
html body input[type="text"]:focus,
html body input[type="number"]:focus {
    border-color: #1f5fbf;
    box-shadow: 0 0 0 0.2rem rgba(31, 95, 191, 0.25);
}

/* =========================================================
   Validation states (neutralised)
   ========================================================= */

html body .form-control.is-valid {
    border-color: #1f5fbf;
    background-image: none;
}

html body .form-control.is-valid:focus {
    border-color: #1f5fbf;
    box-shadow: 0 0 0 0.2rem rgba(31, 95, 191, 0.25);
}

html body .text-danger {
    color: #b91c1c;
}

html body .text-warning {
    color: #92400e;
}


/* =========================================================
   Radios and checkboxes
   ========================================================= */

html body .radio-item input[type="radio"]:checked + label::before {
    border-color: #1f5fbf;
}

html body .radio-item input[type="radio"]:checked + label::after {
    background-color: #1f5fbf;
}

html body .checkbox-item input[type="checkbox"]:checked + label::before,
html body .checkbox-item input[type="checkbox"]:checked + label::after {
    background-color: #1f5fbf;
    border-color: #1f5fbf;
}

/* =========================================================
   Links, tables, misc
   ========================================================= */

html body a {
    color: #1f5fbf;
}

html body a:hover,
html body a:focus {
    color: #174a94;
    text-decoration: underline;
}

html body .ls-answers,
html body .ls-answers table {
    width: 100%;
}

html body hr {
    border-color: #e5e7eb;
}

html body .btn,
html body .btn-group label {
    white-space: normal;
}

/* Progress bar: force academic blue */
html body .progress .progress-bar,
html body .progress .progress-bar.bg-success {
    background-color: #1f5fbf;
}

/* FINAL override: Fruity focus glow */
.fruity .form-control:focus {
    border-color: #1f5fbf !important;
    box-shadow:
        0 0 0 0.2rem rgba(31,95,191,.25) !important;
}

/* This is a fix for a weird padding-top */
html body.fruity {
    padding-top: 20px !important;
}

.survey-welcome.text-primary p {
    color: #000066;
}