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

    Eigene Designanpassungen für LimeSurvey.
    Wird zuletzt geladen und überschreibt dadurch viele Theme-Regeln.
******************/

/* =========================================================
   Farbvariablen
   ========================================================= */

:root {
    --custom-primary: #1D4289;
    --custom-primary-hover: #17356f;
    --custom-text-blue: #30436e;
    --custom-alert-outline: #95818D;
    --custom-focus-shadow: rgba(29, 66, 137, 0.25);
}


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

/* Standard-Buttons, aber ausdrücklich nicht der Alert-X-Button */
.btn-primary,
.btn-success,
.btn-info,
input[type="submit"],
input[type="button"],
button:not(.btn-close):not(.close) {
    background-color: var(--custom-primary) !important;
    border-color: var(--custom-primary) !important;
    color: #ffffff !important;
}

/* Button-Zustände: Hover, Fokus, aktiv */
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-success:hover,
.btn-success:focus,
.btn-success:active,
.btn-info:hover,
.btn-info:focus,
.btn-info:active,
input[type="submit"]:hover,
input[type="submit"]:focus,
input[type="submit"]:active,
input[type="button"]:hover,
input[type="button"]:focus,
input[type="button"]:active,
button:not(.btn-close):not(.close):hover,
button:not(.btn-close):not(.close):focus,
button:not(.btn-close):not(.close):active {
    background-color: var(--custom-primary-hover) !important;
    border-color: var(--custom-primary-hover) !important;
    color: #ffffff !important;
}

/* Popup-/Modal-Buttons */
.modal .btn,
.modal-footer .btn,
.bootbox .btn,
.bootbox .modal-footer .btn {
    border-color: var(--custom-primary) !important;
}

/* Popup-/Modal-Buttons mit Outline-Stil */
.modal .btn-default,
.modal .btn-secondary,
.modal .btn-outline-primary,
.modal .btn-outline-success,
.modal-footer .btn-default,
.modal-footer .btn-secondary,
.modal-footer .btn-outline-primary,
.modal-footer .btn-outline-success,
.bootbox .btn-default,
.bootbox .btn-secondary,
.bootbox .btn-outline-primary,
.bootbox .btn-outline-success {
    background-color: #ffffff !important;
    border-color: var(--custom-primary) !important;
    color: var(--custom-primary) !important;
}

/* Popup-/Modal-Buttons beim Hover/Fokus */
.modal .btn:hover,
.modal .btn:focus,
.modal .btn:active,
.modal-footer .btn:hover,
.modal-footer .btn:focus,
.modal-footer .btn:active,
.bootbox .btn:hover,
.bootbox .btn:focus,
.bootbox .btn:active {
    background-color: var(--custom-primary) !important;
    border-color: var(--custom-primary) !important;
    color: #ffffff !important;
    box-shadow: 0 0 0 0.2rem var(--custom-focus-shadow) !important;
}


/* =========================================================
   Fortschrittsbalken / Ladebalken
   ========================================================= */

.progress-bar,
.ls-progress-bar {
    background-color: var(--custom-primary) !important;
}


/* =========================================================
   Links und Akzenttexte
   ========================================================= */

a,
.text-primary,
.text-success {
    color: var(--custom-primary) !important;
}
/* =========================================================
   Hinweise / Hilfetexte
   ========================================================= */

.text-info,
.help-block,
.ls-questionhelp,
.ls-question-help,
.question-help,
.questionhelp,
.em_default,
.ls-em-tip,
.ls-tip,
.tip,
.hint,
.hint-text {
    color: var(--custom-primary) !important;
}


/* =========================================================
   Begrüßungstext und Umfragenbeschreibung
   ========================================================= */

.survey-welcome,
.survey-welcome *,
.welcome-text,
.welcome-text *,
.welcome-container,
.welcome-container *,
#surveyWelcome,
#surveyWelcome *,
.survey-description,
.survey-description *,
#surveyDescription,
#surveyDescription *,
.ls-survey-description,
.ls-survey-description * {
    color: var(--custom-text-blue) !important;
}


/* =========================================================
   Formulare: Fokus, Radio-Buttons, Checkboxen
   ========================================================= */

/* Fokusrahmen bei Eingabefeldern und normalen Buttons */
.form-control:focus,
.btn:focus {
    border-color: var(--custom-primary) !important;
    box-shadow: 0 0 0 0.2rem var(--custom-focus-shadow) !important;
}

/* Native Radio-Buttons und Checkboxen */
input[type="radio"]:checked,
input[type="checkbox"]:checked {
    accent-color: var(--custom-primary) !important;
}

/* LimeSurvey-/Bootstrap-Markierungen */
.radio-item input[type="radio"]:checked + label::before,
.checkbox-item input[type="checkbox"]:checked + label::before,
.radio-item input[type="radio"]:checked + label::after,
.checkbox-item input[type="checkbox"]:checked + label::after,
.form-check-input:checked,
.form-check-input:checked[type="radio"],
.form-check-input:checked[type="checkbox"] {
    background-color: var(--custom-primary) !important;
    border-color: var(--custom-primary) !important;
    color: #ffffff !important;
}

/* Innerer Punkt bei Radio-Buttons */
.radio-item input[type="radio"]:checked + label::after,
.form-check-input:checked[type="radio"] {
    background-color: var(--custom-primary) !important;
}

/* Fokusrahmen um Checkboxen / Radio-Buttons */
input[type="radio"]:focus,
input[type="checkbox"]:focus,
.form-check-input:focus {
    border-color: var(--custom-primary) !important;
    box-shadow: 0 0 0 0.2rem var(--custom-focus-shadow) !important;
}


/* =========================================================
   Navigation und Dropdowns
   ========================================================= */

/* Dropdown-Hover */
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus,
.dropdown-menu .dropdown-item:hover,
.dropdown-menu .dropdown-item:focus,
.navbar-nav .dropdown-menu > li > a:hover,
.navbar-nav .dropdown-menu > li > a:focus,
.navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
.navbar-default .navbar-nav .open .dropdown-menu > li > a:focus,
.navbar .dropdown-menu > li > a:hover,
.navbar .dropdown-menu > li > a:focus,
.ls-language-changer-item:hover,
.ls-language-changer-item:focus {
    background-color: var(--custom-primary) !important;
    color: #ffffff !important;
}

/* Fruity-Hover-Linie unter "Zwischengespeicherte Umfrage laden" / "Später fortfahren" */
@media (min-width: 769px) {
    .fruity .navbar .navbar-nav .nav-item:after {
        background-color: var(--custom-primary) !important;
    }
}


/* =========================================================
   Erfolgs-/Statushinweise
   ========================================================= */

.label-success,
.badge-success,
.alert-success {
    background-color: var(--custom-primary) !important;
    border-color: var(--custom-primary) !important;
    color: #ffffff !important;
}


/* =========================================================
   Warnhinweis: "Diese Umfrage ist momentan nicht aktiv..."
   ========================================================= */

/* Hinweisbalken: nur Outline, schwarze Schrift */
.alert-warning,
.alert.alert-warning,
.alert-dismissible.alert-warning {
    background-color: transparent !important;
    background-image: none !important;
    border: 2px solid var(--custom-alert-outline) !important;
    color: #000000 !important;
}

/* Text im Hinweisbalken schwarz */
.alert-warning,
.alert-warning *,
.alert.alert-warning,
.alert.alert-warning *,
.alert-dismissible.alert-warning,
.alert-dismissible.alert-warning * {
    color: #000000 !important;
}

/* X-Button: Outline, keine Füllung */
.alert-warning .btn-close,
.alert.alert-warning .btn-close,
.alert-dismissible.alert-warning .btn-close {
    background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23000000' d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3E%3C/svg%3E") center / 1em auto no-repeat !important;
    border: 1px solid var(--custom-alert-outline) !important;
    box-shadow: none !important;
    opacity: 1 !important;
    filter: none !important;
}

/* X-Button Hover/Fokus */
.alert-warning .btn-close:hover,
.alert-warning .btn-close:focus,
.alert-warning .btn-close:active,
.alert.alert-warning .btn-close:hover,
.alert.alert-warning .btn-close:focus,
.alert.alert-warning .btn-close:active,
.alert-dismissible.alert-warning .btn-close:hover,
.alert-dismissible.alert-warning .btn-close:focus,
.alert-dismissible.alert-warning .btn-close:active {
    background-color: transparent !important;
    border: 1px solid var(--custom-alert-outline) !important;
    box-shadow: none !important;
    opacity: 1 !important;
    filter: none !important;
}
/* =========================================================
   Pflichtfrage-Sternchen ausblenden
   ========================================================= */

/* Klassisches Sternchen direkt im Fragetitel */
.question-title-container .asterisk,
.question-title-container .mandatory,
.question-title-container .mandatory-star,
.question-title-container .ls-mandatory,
.question-title-container span.required,

/* Alternative LimeSurvey-Strukturen */
.ls-question-title .asterisk,
.ls-question-title .mandatory,
.ls-question-title .mandatory-star,
.ls-question-title .ls-mandatory,
.ls-question-title span.required,

/* Nur einzelne Sternchen-Spans, nicht ganze Fragen */
span.asterisk,
span.mandatory-star,
span.ls-mandatory {
    display: none !important;
}
/* =========================================================
   Single Choice / Radio-Buttons: weißer Innenrand
   ========================================================= */

/* Radio-Button außen blau */
input[type="radio"]:checked,
.form-check-input[type="radio"]:checked {
    background-color: #ffffff !important;
    border-color: var(--custom-primary) !important;
    accent-color: var(--custom-primary) !important;
}

/* Bootstrap-Radio: kleiner blauer Punkt mit weißem Abstand */
.form-check-input[type="radio"]:checked {
    background-image: radial-gradient(
        circle,
        var(--custom-primary) 0%,
        var(--custom-primary) 70%,
        #ffffff 24%,
        #ffffff 100%
    ) !important;
}

/* LimeSurvey/Fruity-Radio: äußerer Kreis */
.radio-item input[type="radio"]:checked + label::before {
    background-color: #ffffff !important;
    border-color: var(--custom-primary) !important;
}

/* LimeSurvey/Fruity-Radio: innerer Punkt kleiner machen */
.radio-item input[type="radio"]:checked + label::after {
    background-color: var(--custom-primary) !important;
    border-color: var(--custom-primary) !important;
    transform: scale(0.55) !important;
}
/* =========================================================
   Freitextfelder: Rahmenfarbe
   ========================================================= */

textarea,
input[type="text"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
.form-control,
.ls-input {
    border-color: #95818D !important;
}

/* Fokus bei Freitextfeldern */
textarea:focus,
input[type="text"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
.form-control:focus,
.ls-input:focus {
    border-color: #95818D !important;
    box-shadow: 0 0 0 0.2rem rgba(149, 129, 141, 0.25) !important;
}

/* Keine zusätzlichen Schatten auf Frage-/Gruppen-/Antwortkästen */
.question-container,
.ls-question-container,
.group-container,
.ls-group-container,
.answer-container {
    box-shadow: none !important;
}
