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

    In this file you can add your own custom CSS
    It will be loaded last, so you can override any other property.
    Also, it will never be updated. So if you inheritate a core template and just add here some CSS, you'll still benefit of all the updates
*/
/* ================== Buttons Weiter/Zurück ================== */
.ls-move-btn,
.btn-primary,
.btn-info {
  background-color: #f4bf19 !important; /* Orange-Gelb */
  color: #013148 !important;            /* Dunkelblau Text */
  border: none !important;
  border-radius: 4px !important;
  padding: 8px 20px !important;
  font-weight: normal !important;
}
.ls-move-btn:hover,
.btn-primary:hover,
.btn-info:hover {
  background-color: #e0ad15 !important; /* dunkleres Orange */
  color: #013148 !important;
}

/* ================== Schriftfarben neutralisieren ================== */
body, p, span, div {
  color: #333333 !important; /* Dunkelgrau */
}
.text-primary,
.text-info,
.text-success,
.text-muted,
.text-secondary {
  color: #333333 !important; /* Einheitlich dunkelgrau */
}

/* Optional: aktive Hervorhebung in Orange statt Grün */
.text-success,
.bg-success {
  color: #f4bf19 !important;
  background-color: transparent !important;
}

/* ================== Überschriften ================== */
h1, h2, h3, h4, h5, h6 {
  color: #013148 !important;
  font-weight: normal !important;
}

/* ================== Zentrierung entschärfen ================== */
/* Fruity23 macht fast alles centered – wir setzen linksbündig */
.ls-question-title,
.ls-question-text,
.ls-answers,
.group-title,
.survey-title,
.ls-questionhelp {
  text-align: left !important;
}

/* Standard-Hinweis "Bitte wählen Sie..." bei Fragen ausblenden */
.ls-questionhelp {
  display: none !important;
}

/* Farbe des gefüllten Balkens */
.survey-progress .progress-bar,
#progress-wrapper .progress-bar,
.progress .progress-bar {
  background-color: #f4bf19 !important; /* Orange */
}

/* (optional) Track neutral + etwas runder/kompakter */
.survey-progress .progress,
#progress-wrapper .progress {
  background-color: #dfe3e8 !important; /* hellgrauer Track */
  height: 6px !important;               /* dünner Balken */
  border-radius: 4px !important;
}

/* (optional) Abstände ober/unter dem Balken kleiner */
.survey-progress,
#progress-wrapper {
  margin-top: 6px !important;
  margin-bottom: 10px !important;
}
/* === Orange für Checkboxen & Radiobuttons (BS5 / Fruity23) === */
input[type="checkbox"],
input[type="radio"],
.form-check-input {
  /* Randfarbe, wenn UNCHECKED */
  border-color: #f4bf19 !important;
  /* Safari/Chromium: Akzent (Check/Radio) */
  accent-color: #f4bf19;
}

.form-check-input:checked {
  background-color: #f4bf19 !important; /* Füllung */
  border-color: #f4bf19 !important;     /* Rand */
}

/* gut sichtbarer, aber dezenter Fokus */
.form-check-input:focus {
  box-shadow: 0 0 0 .2rem rgba(244,191,25,.25) !important;
  outline: none !important;
}

/* Größe (optional – wenn die Kästchen sehr groß wirken) */
.form-check-input {
  width: 18px !important;
  height: 18px !important;
}

/* === Link "Datenschutzerklärung anzeigen" in Orange === */
a.link-success,
a.text-success,
.link-success,
.text-success {
  color: #f4bf19 !important;
}
a.link-success:hover,
a.text-success:hover,
.link-success:hover,
.text-success:hover {
  color: #e0ad15 !important;
}

/* Dankeseite/Ende: Blockquote mit orange Akzent */
.survey-end blockquote,
.endmessage blockquote,
.thanks-quote {
  border-left: 6px solid #f4bf19;                 /* Orange Leiste */
  padding: 12px 16px;
  margin: 12px 0 18px;
  background: linear-gradient(90deg, rgba(244,191,25,.10), rgba(244,191,25,0));
  color: #013148;                                 /* Dunkelblau Text */
  font-style: italic;
}

/* Datenschutz-Checkbox & Link in Orange (mehrere Varianten abgedeckt) */

/* 2.1: Direkter Input (BS5) */
input[name="datasecurity_accepted"],
#datasecurity_accepted,
.privacy-policy .form-check-input,
.consent .form-check-input {
  accent-color: #f4bf19 !important;        /* moderne Browser */
  border-color: #f4bf19 !important;        /* sichtbarer Rand */
}

.privacy-policy .form-check-input:checked,
.consent .form-check-input:checked,
#datasecurity_accepted:checked {
  background-color: #f4bf19 !important;
  border-color: #f4bf19 !important;
}

.privacy-policy .form-check-input:focus,
.consent .form-check-input:focus,
#datasecurity_accepted:focus {
  box-shadow: 0 0 0 .2rem rgba(244,191,25,.25) !important;
  outline: none !important;
}

/* 2.2: Falls Fruity23 das Kästchen über Label-Pseudo-Element zeichnet */
input[name="datasecurity_accepted"] + label::before,
#datasecurity_accepted + label::before,
.privacy-policy .form-check-input + label::before,
.consent .form-check-input + label::before {
  border: 2px solid #f4bf19 !important;    /* Rand Orange */
}

input[name="datasecurity_accepted"]:checked + label::before,
#datasecurity_accepted:checked + label::before,
.privacy-policy .form-check-input:checked + label::before,
.consent .form-check-input:checked + label::before {
  background-color: #f4bf19 !important;    /* Füllung Orange */
  border-color: #f4bf19 !important;
}

/* 2.3: Link "Datenschutzerklärung anzeigen" von Grün auf Orange */
.privacy-policy a,
.consent a,
a.link-success,
.link-success,
a.text-success,
.text-success {
  color: #f4bf19 !important;
}
.privacy-policy a:hover,
.consent a:hover,
a.link-success:hover,
.text-success:hover {
  color: #e0ad15 !important;
}

/* ===== Header kompakter: weniger Platz UNTER dem Logo ===== */

/* 2) Abstand direkt NACH der Navbar reduzieren (hr / progress / Container) */
.navbar + hr,
.navbar + .progress,
.navbar + .container,
.navbar + .container-fluid,
.survey-progress { 
  margin-top: 6px !important; 
}

/* 3) Generell den unteren Navbar-Abstand entfernen */
.navbar { margin-bottom: 0 !important; }

/* 4) System-Hinweise direkt unter dem Header (gelbe Box) enger setzen */
.survey-container .alert { 
  margin-top: 8px !important; 
  margin-bottom: 12px !important; 
}

/* === Fruity23: Logo auf Mobil NICHT verstecken === */

/* Falls .navbar-brand/.survey-logo via d-none d-lg-block ausgeblendet wird */
.navbar .navbar-brand,
.survey-logo {
  display: inline-flex !important;
  align-items: center;
}

/* explizit d-none überstimmen (Bootstrap Utilities sind !important) */
.navbar .navbar-brand.d-none,
.survey-logo.d-none {
  display: inline-flex !important;
}

/* falls nur unter LG ausgeblendet wird */
@media (max-width: 991.98px) {
  .navbar .navbar-brand,
  .survey-logo {
    display: inline-flex !important;
  }
}

/* === Datenschutz-Zeile auf Orange/Dunkelgrau bringen (Fruity23 / LS 6.15) === */
.privacy-policy, .consent { --brand-orange:#f4bf19; --brand-orange-hover:#e0ad15; --brand-text:#333; --brand-tick:#013148; }

/* 1) Textfarbe der Label-Zeile neutral, nicht grün */
.privacy-policy .form-check-label,
.consent .form-check-label,
label[for="datasecurity_accepted"] {
  color: var(--brand-text) !important;
}
.privacy-policy .form-check-label a:hover,
.consent .form-check-label a:hover {
  color: var(--brand-orange-hover) !important;
}
/* 2) Checkbox: Kasten + Haken in unseren Farben */
/* Native Input */
#datasecurity_accepted,
.privacy-policy .form-check-input,
.consent .form-check-input {
  accent-color: var(--brand-orange) !important;
  border-color: var(--brand-orange) !important;
}
/* Hakenfarbe (wenn der Haken via ::after gezeichnet wird) */
#datasecurity_accepted:checked + label::after,
.privacy-policy .form-check-input:checked + label::after,
.consent .form-check-input:checked + label::after {
  border-color: var(--brand-tick) !important;   /* Hakenlinien */
  color: var(--brand-tick) !important;          /* Fallback */
  background-image: none !important;            /* falls ein grünes SVG gesetzt wird */
}

/* Link in der Zeile orange */
.privacy-policy .form-check-label a,
.consent .form-check-label a {
  color: var(--brand-orange) !important;
}
.privacy-policy .form-check-label a:hover,
.consent .form-check-label a:hover {
  color: var(--brand-orange-hover) !important;
}

/* ==== Modal-Header sauber ausrichten (LS 6.15 / Fruity23) ==== */
/* Titel zentrieren */
#bootstrap-alert-box-modal .modal-header,
.modal .modal-header {
  position: relative;
  justify-content: center !important;   /* Titel mittig */
}

/* Titel selbst */
#bootstrap-alert-box-modal .modal-title,
.modal .modal-title {
  margin: 0 auto !important;
  text-align: center !important;
}

/* Close-Button absolut in die Ecke (BS5: .btn-close) */
#bootstrap-alert-box-modal .btn-close,
.modal .btn-close {
  position: absolute !important;
  right: 12px;
  top: 12px;
  margin: 0 !important;
}

/* Fallback für ältere Markups (BS4/3: .close mit ×-Span) */
#bootstrap-alert-box-modal .modal-header .close,
.modal .modal-header .close {
  position: absolute !important;
  right: 12px;
  top: 12px;
  float: none !important;
  margin: 0 !important;
}