/******************
    User custom CSS
    ---------------

    Loaded last by the copied base_fruity_twentythree survey theme.
*/

:root {
    --qw-question-gap: 1.15rem;
    --qw-question-inner-gap: 0.45rem;
}

#welcome-container {
    max-width: initial;
}

.group-container .group-title,
.large-heading {
    font-size: 2.25rem;
}

/*
 * LimeSurvey/Fruity TwentyThree makes question code/number a block element.
 * With short codes such as K1 this wastes a full line, so keep the code,
 * mandatory asterisk and question title on the same baseline.
 */
.base_fruity_twentythree .question-container [id^="question-text-container-"],
.base_fruity_twentythree .question-container .ls-label-question,
.base_fruity_twentythree .question-container .question-title-container,
.base_fruity_twentythree .question-container .question-text-container,
.base_fruity_twentythree .question-container .ls-question-text-container {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    column-gap: 0.35rem;
    row-gap: 0.15rem;
}

.base_fruity_twentythree .question-container [id^="question-text-container-"] > .asterisk,
.base_fruity_twentythree .question-container [id^="question-text-container-"] > span,
.base_fruity_twentythree .question-container .asterisk,
.base_fruity_twentythree .question-container .ls-question-mandatory,
.base_fruity_twentythree .question-container .question-number,
.base_fruity_twentythree .question-container .ls-question-number,
.base_fruity_twentythree .question-container .question-code,
.base_fruity_twentythree .question-container .ls-question-code {
    float: none;
    display: inline-block;
    margin: 0;
    flex: 0 0 auto;
}

.base_fruity_twentythree .question-container [id^="question-text-container-"] > div,
.base_fruity_twentythree .question-container .question-title,
.base_fruity_twentythree .question-container .ls-question-title,
.base_fruity_twentythree .question-container .question-text,
.base_fruity_twentythree .question-container .ls-question-text,
.base_fruity_twentythree .question-container .questiontext {
    display: inline;
    flex: 1 1 26rem;
    min-width: 16rem;
    margin: 0;
}

/* Avoid tiny inline links inside titles/help/display text. */
.base_fruity_twentythree .question-container [id^="ls-question-text-"] a,
.base_fruity_twentythree .question-container a,
.base_fruity_twentythree #welcome-container a,
.base_fruity_twentythree .group-description a,
.base_fruity_twentythree .completed-wrapper a {
    font-size: inherit;
    line-height: inherit;
}

/*
 * Compact vertical rhythm. The default Fruity spacing is pleasant for short
 * forms, but this questionnaire has many display texts and follow-up blocks.
 */
.base_fruity_twentythree .question-container,
.base_fruity_twentythree .ls-question-container,
.base_fruity_twentythree .ls-question-wrapper,
.base_fruity_twentythree .survey-question {
    margin-top: 0;
    margin-bottom: var(--qw-question-gap);
    padding-top: var(--qw-question-inner-gap);
    padding-bottom: var(--qw-question-inner-gap);
}

.base_fruity_twentythree .question-container + .question-container {
    margin-top: 0.35rem;
}

.base_fruity_twentythree .question-container .question-help-container,
.base_fruity_twentythree .question-container .ls-questionhelp,
.base_fruity_twentythree .question-container .questionhelp,
.base_fruity_twentythree .question-container .emtip {
    margin-top: 0.45rem;
    margin-bottom: 0.55rem;
}

.base_fruity_twentythree .question-container .answer-container,
.base_fruity_twentythree .question-container .answers-list,
.base_fruity_twentythree .question-container .ls-answers {
    margin-top: 0.55rem;
}

.base_fruity_twentythree .radio-item,
.base_fruity_twentythree .checkbox-item,
.base_fruity_twentythree .list-radio .radio,
.base_fruity_twentythree .list-checkbox .checkbox {
    margin-top: 0.35rem;
    margin-bottom: 0.35rem;
}

.brand-logo {
    padding-top: 50px !important;
}

.brand-logo .top-container .top-content {
    padding-top: 0;
}

.navbar-brand {
    display: block !important;
}

.base_fruity_twentythree .checkbox-item input[type=checkbox]:checked + label::after,
.base_fruity_twentythree .checkbox-item input[type=radio]:checked + label::after {
    content: "\eb7b";
}

@media (min-width: 768px) {
    body.brand-logo:has(.completed-wrapper) {
        padding-top: 206px !important;
    }
}

@media (max-width: 575.98px) {
    :root {
        --qw-question-gap: 1rem;
        --qw-question-inner-gap: 0.35rem;
    }

    .base_fruity_twentythree .question-container [id^="question-text-container-"] > div,
    .base_fruity_twentythree .question-container .question-title,
    .base_fruity_twentythree .question-container .ls-question-title,
    .base_fruity_twentythree .question-container .question-text,
    .base_fruity_twentythree .question-container .ls-question-text,
    .base_fruity_twentythree .question-container .questiontext {
        flex-basis: 100%;
        min-width: 0;
    }
}