/* ============================================================
   Prime Anaesthetics — LimeSurvey Custom Theme v8
   ============================================================ */

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

:root {
    --pa-gold:       #998843;
    --pa-gold-dark:  #7a6c35;
    --pa-gold-light: #f5f0e0;
    --pa-blue:       #057ac2;
    --pa-blue-dark:  #045f99;
    --pa-bg:         #eff9ff;
    --pa-text:       #101010;
    --pa-white:      #ffffff;
    --pa-border:     #dddddd;
    --pa-error:      #c0392b;
}

/* ============================================================
   GLOBAL
   ============================================================ */

* {
    font-family: 'Poppins', sans-serif !important;
    hyphens: none !important;
    -webkit-hyphens: none !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
}

body,
html,
#outerframeDiv,
#wrapper,
.container-fluid,
.survey-container,
#partialsurvey,
#surveycontainer {
    background-color: var(--pa-bg) !important;
    color: var(--pa-text) !important;
    padding-top: 0 !important;
    margin-top: 0 !important;
}

/* ============================================================
   HIDE DEFAULT ELEMENTS
   ============================================================ */

#ls-admin-navigator,
.navbar-brand img,
.ls-logo,
header .navbar,
nav.navbar,
.navbar,
#survey-nav,
.survey-nav {
    display: none !important;
    height: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
}

div.progress,
div.survey-welcome.h5.text-primary,
#welcome-container .privacy.row,
#welcome-container .number-of-questions,
div.asterisk.float-start,
sup.text-danger.fa.fa-asterisk,
div.question-valid-container,
div.question-valid-container.bg-primary {
    display: none !important;
}

/* ============================================================
   OUTER FRAME
   ============================================================ */

#outerframeContainer,
.outerframe.container-md {
    background-color: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin-top: 0 !important;
}

.space-col {
    padding: 0 !important;
    margin: 0 !important;
}

/* ============================================================
   WELCOME / INTRO PAGE
   ============================================================ */

#welcome-container {
    background-color: transparent !important;
    box-shadow: none !important;
    border: none !important;
    padding: 0 !important;
    overflow: visible !important;
}

h1.survey-name {
    font-weight: 600 !important;
    font-size: 2.5rem !important;
    color: var(--pa-text) !important;
    text-align: center !important;
    background: transparent !important;
    border: none !important;
    padding: 24px 0 16px !important;
    margin: 0 !important;
}

#welcome-container .survey-description,
div.survey-description.text-info.text-center {
    background-color: var(--pa-white) !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08) !important;
    padding: 32px 40px !important;
    margin: 0 !important;
    color: var(--pa-text) !important;
    font-size: 1.2rem !important;
    line-height: 1.8 !important;
    text-align: left !important;
}

#welcome-container .survey-description p,
div.survey-description.text-info.text-center p {
    color: var(--pa-text) !important;
    font-size: 1.2rem !important;
    line-height: 1.8 !important;
}

#navigator-container {
    background-color: transparent !important;
    box-shadow: none !important;
    border: none !important;
    padding: 24px 0 40px !important;
    margin: 0 !important;
}

/* ============================================================
   GROUP TITLE — blue header bar
   ============================================================ */

.ls-group-name,
.group-title,
h4.ls-group-name,
div.group-title,
.question-group-title {
    font-weight: 600 !important;
    font-size: 1.1rem !important;
    color: var(--pa-white) !important;
    background-color: var(--pa-blue) !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 14px 24px !important;
    margin: 0 !important;
    text-align: left !important;
}

/* ============================================================
   QUESTION GROUP — white card
   ============================================================ */

div.group-outer-container.space-col {
    background-color: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

div.group-container.space-col {
    background-color: var(--pa-white) !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08) !important;
    padding: 0 !important;
    margin: 24px 0 0 0 !important;
    overflow: hidden !important;
}

/* ============================================================
   INDIVIDUAL QUESTIONS
   ============================================================ */

div[id^="question"] {
    background-color: var(--pa-white) !important;
    border: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 12px 24px !important;
    margin: 0 !important;
    overflow: visible !important;
}

div[id^="question"]:last-of-type {
    padding-bottom: 24px !important;
}

/* Question label */
.question .ls-label-question,
.question-text,
.question-text-container,
.ls-question-text,
label.ls-label-question,
.ls-label-question {
    display: block !important;
    background-color: var(--pa-white) !important;
    color: var(--pa-text) !important;
    font-weight: 600 !important;
    font-size: 1.1rem !important;
    padding: 0 0 4px 0 !important;
    margin: 0 !important;
    border: none !important;
}

.ls-question-text,
.question-text,
.question-text-container {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

/* Question title container */
.question-title-container,
div.question-title-container {
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    width: auto !important;
    background: transparent !important;
}

/* Answer area */
.answer-container,
.ls-answers,
.question .row.answer-container,
.question-container .ls-answers,
.question-container .answer-container {
    background-color: var(--pa-white) !important;
    border: none !important;
    margin-top: 0 !important;
    padding-top: 2px !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

.answer-container.col-12,
.answer-container[class*="col-"] {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.ls-answers.answer-item.mb-3,
.ls-answers.mb-3,
.answer-item.mb-3,
.row.g-1,
.row.g-2,
.row.g-3 {
    margin-bottom: 0 !important;
}

/* Mandatory star */
.mandatory-marker,
.ls-mandatory-mark,
span.mandatory-marker {
    color: var(--pa-blue) !important;
    font-weight: 700 !important;
}

/* Help text */
div.question-help-container {
    display: block !important;
    visibility: visible !important;
    height: auto !important;
    overflow: visible !important;
    background-color: transparent !important;
    border: none !important;
    margin-top: 4px !important;
    padding: 0 !important;
}

div.ls-questionhelp {
    display: block !important;
    visibility: visible !important;
}

div.ls-questionhelp::before {
    display: none !important;
    content: none !important;
}

.ls-label-question-help,
.question-help,
.help-block,
.ls-questionhelp,
.question-help-container.text-info {
    font-size: 0.8rem !important;
    color: #888 !important;
    font-style: italic !important;
    background: transparent !important;
    border: none !important;
    padding: 2px 0 0 0 !important;
    margin: 0 !important;
    opacity: 1 !important;
}

.question-help-container .fa,
.question-help-container i,
.ls-questionhelp .fa,
.ls-questionhelp i {
    display: none !important;
}

/* ============================================================
   FORM INPUTS — pill shape
   ============================================================ */

input[type="text"],
input[type="email"],
input[type="number"],
input[type="tel"],
input[type="date"],
input[type="password"],
textarea,
select,
select.form-control,
.form-control,
.question-container input,
.question-container textarea,
.question-container select,
.ls-answers input,
.ls-answers textarea,
.ls-answers select {
    font-size: 1rem !important;
    color: var(--pa-text) !important;
    background-color: var(--pa-white) !important;
    border: 1px solid #1010106B !important;
    border-radius: 24px !important;
    padding: 10px 16px !important;
    box-shadow: none !important;
    width: 100% !important;
    transition: border-color 0.2s !important;
}

input[type="text"]:hover,
input[type="email"]:hover,
input[type="number"]:hover,
input[type="tel"]:hover,
input[type="date"]:hover,
textarea:hover,
select:hover,
.form-control:hover,
.question-container input:hover,
.question-container textarea:hover,
.question-container select:hover,
.ls-answers input:hover,
.ls-answers textarea:hover,
.ls-answers select:hover {
    border-color: #045f99 !important;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="date"]:focus,
textarea:focus,
select:focus,
.form-control:focus,
.question-container input:focus,
.question-container textarea:focus,
.question-container select:focus,
.ls-answers input:focus,
.ls-answers textarea:focus,
.ls-answers select:focus {
    border-color: #045f99 !important;
    border-width: 3px !important;
    outline: none !important;
    box-shadow:
        inset 0 0 4px rgba(0,0,0,0.15),
        0 0 6px rgba(5,85,134,0.25) !important;
}

/* ============================================================
   DATE INPUT
   ============================================================ */

.input-group-addon,
.input-group-text {
    display: none !important;
}

.input-group.date {
    width: 100% !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

.input-group.date input.form-control[type="text"],
.input-group.date input.form-control[type="date"] {
    height: 48px !important;
    line-height: 28px !important;
    background-image: url('data:image/svg+xml;utf8,<svg fill="%23055686" height="20" viewBox="0 0 24 24" width="20" xmlns="http://www.w3.org/2000/svg"><path d="M19 4h-1V2h-2v2H8V2H6v2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 16H5V9h14v11z"/></svg>');
    background-repeat: no-repeat !important;
    background-position: right 18px center !important;
    background-size: 20px !important;
    padding-right: 52px !important;
}

/* ============================================================
   SPECIFIC QUESTION WIDTHS
   ============================================================ */

#question4 select,
#question4 .form-control,
#question5 select,
#question5 .form-control,
#question5 input[type="text"],
#question5 input[type="date"],
#question5 .input-group.date .form-control {
    width: 200px !important;
    max-width: 200px !important;
}

#question5 {
    padding-bottom: 6px !important;
}

/* ============================================================
   YES/NO BUTTONS
   ============================================================ */

.ls-answers.yesno-button.btn-group {
    display: flex !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    width: auto !important;
}

.ls-answers.yesno-button .ls-icon,
.ls-answers.yesno-button .fa-check,
.ls-answers.yesno-button .fa {
    display: none !important;
}

.ls-answers.yesno-button .btn.btn-primary.ls-button-label {
    width: 120px !important;
    padding: 8px 16px !important;
    border-radius: 50px !important;
    font-size: 0.9rem !important;
    font-weight: 500 !important;
    background-color: var(--pa-white) !important;
    color: var(--pa-text) !important;
    border: 1px solid var(--pa-blue-dark) !important;
    margin: 0 !important;
}

@media (hover: hover) {
    .ls-answers.yesno-button .btn.btn-primary.ls-button-label:hover {
        background-color: #e8f4fd !important;
        color: var(--pa-text) !important;
        border: 1px solid var(--pa-blue-dark) !important;
    }
}

.ls-answers.yesno-button .btn-check:checked + .btn.ls-button-label,
.ls-answers.yesno-button .btn-check:checked + label {
    background-color: var(--pa-blue-dark) !important;
    color: var(--pa-white) !important;
    border: 1px solid var(--pa-blue-dark) !important;
}

/* ============================================================
   SCALE RADIO BUTTONS — segmented bar
   ============================================================ */

ul.radio-list .radio-item input[type="radio"] {
    display: none !important;
}

ul.radio-list .radio-item::before,
ul.radio-list .radio-item::after,
ul.radio-list .radio-item label.radio-label::before,
ul.radio-list .radio-item label.radio-label::after {
    display: none !important;
}

ul.radio-list {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
    width: 100% !important;
}

ul.radio-list .radio-item {
    display: flex !important;
    flex: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
}

ul.radio-list .radio-item label.radio-label {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    padding: 8px 12px !important;
    font-size: 0.9rem !important;
    font-weight: 500 !important;
    color: var(--pa-text) !important;
    background-color: var(--pa-white) !important;
    border: 1px solid var(--pa-blue-dark) !important;
    border-left: none !important;
    cursor: pointer !important;
    transition: background-color 0.15s !important;
    margin: 0 !important;
    text-align: center !important;
    line-height: 1.5 !important;
}

ul.radio-list .radio-item:first-child label.radio-label {
    border-radius: 50px 0 0 50px !important;
    border-left: 1px solid var(--pa-blue-dark) !important;
}

ul.radio-list .radio-item:last-child label.radio-label {
    border-radius: 0 50px 50px 0 !important;
}

@media (hover: hover) {
    ul.radio-list .radio-item label.radio-label:hover {
        background-color: #e8f4fd !important;
        color: var(--pa-text) !important;
        border: 1px solid var(--pa-blue-dark) !important;
        border-left: none !important;
    }

    ul.radio-list .radio-item:first-child label.radio-label:hover {
        border-left: 1px solid var(--pa-blue-dark) !important;
    }
}

ul.radio-list .radio-item input[type="radio"]:checked + label.radio-label {
    background-color: var(--pa-blue-dark) !important;
    color: var(--pa-white) !important;
    border: 1px solid var(--pa-blue-dark) !important;
    border-left: none !important;
}

ul.radio-list .radio-item:first-child input[type="radio"]:checked + label.radio-label {
    border-left: 1px solid var(--pa-blue-dark) !important;
}

/* ============================================================
   RADIO & CHECKBOX (standard)
   ============================================================ */

.radio label,
.checkbox label,
.ls-answers .radio label,
.ls-answers .checkbox label {
    font-size: 1rem !important;
    color: var(--pa-text) !important;
    cursor: pointer !important;
}

input[type="radio"],
input[type="checkbox"] {
    accent-color: var(--pa-blue) !important;
    cursor: pointer !important;
}

/* ============================================================
   LIKERT / SCALE TABLE
   ============================================================ */

.ls-answers table th {
    font-size: 0.85rem !important;
    color: var(--pa-blue) !important;
    font-weight: 600 !important;
    text-align: center !important;
    background-color: #f0f7fd !important;
    padding: 8px 4px !important;
    border-bottom: 2px solid #b8ddf5 !important;
}

.ls-answers table td {
    text-align: center !important;
    padding: 8px 4px !important;
    border-bottom: 1px solid #eeeeee !important;
}

.ls-answers table tr:hover td {
    background-color: #f0f7fd !important;
}

/* ============================================================
   STAR RATING
   ============================================================ */

.rating label {
    color: #ccc !important;
    font-size: 1.6rem !important;
    cursor: pointer !important;
}

.rating input:checked ~ label,
.rating label:hover,
.rating label:hover ~ label {
    color: var(--pa-gold) !important;
}

/* ============================================================
   CHECKBOX LIST — vertical segmented style
   ============================================================ */

ul.checkbox-list .checkbox-item input[type="checkbox"] {
    display: none !important;
}

ul.checkbox-list .checkbox-item::before,
ul.checkbox-list .checkbox-item::after,
ul.checkbox-list .checkbox-item label::before,
ul.checkbox-list .checkbox-item label::after {
    display: none !important;
}

ul.checkbox-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
    width: 100% !important;
}

ul.checkbox-list .checkbox-item {
    display: flex !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
}

ul.checkbox-list .checkbox-item .row,
ul.checkbox-list .checkbox-item .col-auto {
    width: 100% !important;
    flex: 1 !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

ul.checkbox-list .checkbox-item label,
ul.checkbox-list .checkbox-item label.checkbox-label {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    padding: 10px 16px !important;
    font-size: 0.9rem !important;
    font-weight: 500 !important;
    color: var(--pa-text) !important;
    background-color: var(--pa-white) !important;
    border: 1px solid var(--pa-blue-dark) !important;
    border-bottom: none !important;
    border-radius: 0 !important;
    cursor: pointer !important;
    transition: background-color 0.15s !important;
    margin: 0 !important;
}

ul.checkbox-list .checkbox-item:first-child label {
    border-radius: 12px 12px 0 0 !important;
}

ul.checkbox-list .checkbox-item:last-child label {
    border-bottom: 1px solid var(--pa-blue-dark) !important;
    border-radius: 0 !important;
}

@media (hover: hover) {
    ul.checkbox-list .checkbox-item label:hover,
    ul.checkbox-list .checkbox-item label.checkbox-label:hover {
        background-color: #e8f4fd !important;
        color: var(--pa-text) !important;
        border-color: var(--pa-blue-dark) !important;
    }
}

ul.checkbox-list .checkbox-item input[type="checkbox"]:checked + label,
ul.checkbox-list .checkbox-item input[type="checkbox"]:checked + label.checkbox-label {
    background-color: var(--pa-blue-dark) !important;
    color: var(--pa-white) !important;
    border-color: var(--pa-blue-dark) !important;
}

/* ============================================================
   CHECKBOX LIST — Other free-text item
   ============================================================ */

li.question-item.answer-item.checkbox-text-item {
    display: flex !important;
    margin: 0 !important;
    padding: 0 !important;
}

li.question-item.answer-item.checkbox-text-item .row {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

li.question-item.answer-item.checkbox-text-item .col-auto,
li.question-item.answer-item.checkbox-text-item .col {
    padding: 0 !important;
    margin: 0 !important;
}

li.question-item.answer-item.checkbox-text-item label {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    padding: 10px 16px !important;
    font-size: 0.9rem !important;
    font-weight: 500 !important;
    color: var(--pa-text) !important;
    background-color: var(--pa-white) !important;
    border: 1px solid var(--pa-blue-dark) !important;
    border-top: none !important;
    border-radius: 0 0 12px 12px !important;
    margin: 0 !important;
    cursor: pointer !important;
    transition: background-color 0.15s !important;
}

/* ============================================================
   NAVIGATION BUTTONS
   ============================================================ */

.ls-button-submit,
.btn.btn-default.navigator-button,
.btn-primary,
.btn-default,
.btn.ls-btn,
button[id="ls-button-submit"],
input[type="submit"],
.navigator .btn {
    font-weight: 500 !important;
    font-size: 1rem !important;
    background-color: var(--pa-blue) !important;
    color: var(--pa-white) !important;
    border: none !important;
    border-radius: 50px !important;
    padding: 14px 32px !important;
    cursor: pointer !important;
    transition: background-color 0.2s, transform 0.1s !important;
    letter-spacing: 0.02em !important;
    text-transform: none !important;
}

.ls-button-submit:hover,
.btn-primary:hover,
.btn-default:hover,
.navigator .btn:hover {
    background-color: var(--pa-blue-dark) !important;
    color: var(--pa-white) !important;
    transform: translateY(-1px) !important;
}

.ls-button-submit::after,
.navigator .btn.btn-default::after {
    content: ' →' !important;
}

.btn-navigate-prev,
.ls-button-prev {
    background-color: transparent !important;
    color: var(--pa-blue) !important;
    border: 2px solid var(--pa-blue) !important;
    border-radius: 50px !important;
    font-weight: 500 !important;
    padding: 12px 28px !important;
}

.btn-navigate-prev:hover,
.ls-button-prev:hover {
    background-color: var(--pa-bg) !important;
    color: var(--pa-blue) !important;
}

#ls-button-submit:focus {
    outline: none;
}

/* ============================================================
   ERRORS
   ============================================================ */

.ls-error,
.error,
.has-error .help-block,
.em_num_errors {
    color: var(--pa-error) !important;
    font-size: 0.85rem !important;
    font-weight: 500 !important;
}

.has-error .form-control,
.has-error input,
.has-error textarea {
    border-color: var(--pa-error) !important;
}

div[id^="question"].has-error,
div[id^="question"].ls-error {
    border-left: 4px solid var(--pa-error) !important;
    background-color: #fff5f5 !important;
}

div[id^="question"].has-error .question .ls-label-question,
div[id^="question"].has-error label.ls-label-question {
    color: var(--pa-error) !important;
}

div.pa-unanswered {
    border-left: 4px solid var(--pa-error) !important;
    background-color: #fff5f5 !important;
}

div.pa-unanswered .ls-label-question,
div.pa-unanswered label.ls-label-question {
    color: var(--pa-error) !important;
}

/* ============================================================
   MODAL
   ============================================================ */

#bootstrap-alert-box-modal .modal-footer {
    border-top: none !important;
}

#bootstrap-alert-box-modal .modal-header {
    border-bottom: none !important;
}

#bootstrap-alert-box-modal .modal-dialog {
    visibility: hidden !important;
}

.modal-backdrop {
    display: none !important;
}

/* ============================================================
   COMPLETION PAGE
   ============================================================ */

#end_group,
.survey-completed {
    text-align: center !important;
    padding: 48px 24px !important;
    background: var(--pa-white) !important;
    border-radius: 8px !important;
    border-top: 4px solid var(--pa-blue) !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08) !important;
}

#end_group h3,
.survey-completed h3 {
    color: var(--pa-text) !important;
    font-weight: 600 !important;
    font-size: 1.4rem !important;
}

/* ============================================================
   FOOTER
   ============================================================ */

#ls-footer,
.survey-footer,
footer {
    text-align: center !important;
    font-size: 0.78rem !important;
    color: #888 !important;
    padding: 16px 0 !important;
    border-top: 1px solid #dddddd !important;
    margin-top: 32px !important;
    background: transparent !important;
}

/* ============================================================
   NAVIGATOR LAYOUT — welcome page (all screen sizes)
   ============================================================ */

#welcome-container ~ #navigator-container .col-6 {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    padding: 0 36px !important;
    text-align: center !important;
    box-sizing: border-box !important;
}

#welcome-container ~ #navigator-container .col-6.text-start {
    display: none !important;
}

/* ============================================================
   NAVIGATOR LAYOUT — survey pages, mobile
   ============================================================ */

@media (max-width: 768px) {
    #navigator-container .col-6.text-end {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        padding: 0 18px !important;
        text-align: center !important;
    }

    #navigator-container .col-6.text-start {
        display: none !important;
    }

    .ls-button-submit,
    .btn-primary,
    .btn-default,
    .btn-navigate-prev {
        width: 100% !important;
        margin-bottom: 8px !important;
    }
}

/* ============================================================
   NAVIGATOR LAYOUT — survey pages, desktop
   ============================================================ */

@media (min-width: 769px) {
    #navigator-container .col-6.text-end {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        padding: 0 36px !important;
        text-align: center !important;
    }

    #navigator-container .col-6.text-start {
        display: none !important;
    }

    #navigator-container .btn,
    #navigator-container .ls-button-submit,
    #navigator-container .btn-navigate-prev {
        width: 100% !important;
        max-width: 400px !important;
    }
}

/* ============================================================
   RESPONSIVE — misc
   ============================================================ */

@media (max-width: 768px) {
    h1.survey-name {
        font-size: 2.2rem !important;
        font-weight: 700 !important;
        text-align: left !important;
        padding: 16px 18px 24px !important;
    }

    #dynamicReloadContainer > div > p {
        margin-left: 18px !important;
    }

    #welcome-container .survey-description,
    div.survey-description.text-info.text-center {
        padding: 24px 20px !important;
        margin: 0 36px !important;
        font-size: 1rem !important;
    }

    #welcome-container .survey-description p,
    div.survey-description.text-info.text-center p {
        font-size: 1rem !important;
    }

    div.group-outer-container.space-col {
        padding: 0 18px !important;
    }

    div.group-container.space-col {
        margin-top: 0 !important;
    }

    #prime-header {
        height: 70px !important;
        padding: 0 16px !important;
    }

    #prime-header img,
    #prime-header > div:first-child {
        width: 50px !important;
        height: 50px !important;
    }

    #prime-header span {
        font-size: 1.2rem !important;
    }

    ul.radio-list .radio-item label.radio-label {
        padding: 8px 4px !important;
        font-size: 0.9rem !important;
    }

    input[type="text"],
    input[type="date"],
    input[type="email"],
    input[type="number"],
    input[type="tel"],
    select,
    textarea,
    .form-control,
    .question-container input,
    .question-container textarea,
    .question-container select,
    .ls-answers input,
    .ls-answers textarea,
    .ls-answers select {
        font-size: 16px !important;
    }

    div[id^="question"] {
        padding: 12px 18px !important;
    }

    #navigator-container {
        padding: 24px 0 40px !important;
        margin: 0 !important;
    }

    #navigator-container .row {
        margin: 0 !important;
        padding: 0 !important;
    }

    #navigator-container .col-6 {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

@media (min-width: 769px) {
    h1.survey-name {
        font-size: 2.2rem !important;
        font-weight: 700 !important;
        padding: 16px 0 24px !important;
    }
}