/******************
    User custom CSS – Endingen 2026
    Wird zuletzt geladen und überschreibt alle anderen Regeln.
*/

/* ---------- Farben ---------- */
:root {
  --cb-header-bg: #162c4f;
  --cb-primary: #162c4f;   /* = Header-Farbe */
  --cb-light: #d6deeb;     /* helle Variante für Hover-Flächen */
  --cb-accent: #d7b461;    /* Kontrastfarbe für ausgewählte Antworten */
  --cb-hover: #414141;
  --cb-text: #1e1e1e;
}

/* ---------- Links ---------- */
a { color: var(--cb-primary); text-decoration: none; font-weight: 500; }
a:hover { color: var(--cb-primary); text-decoration: underline; }

a:not([href]):not([class]), a:not([href]):not([class]):hover {
  color: inherit;
  text-decoration: none;
}

.dropdown-menu > li > a:hover { background-color: var(--cb-light) !important; }

/* ---------- Header ---------- */
/* theme.js setzt padding-top inline für fixierte Header – unser Header ist nicht fixiert */
body { padding-top: 0 !important; }

#survey-nav.cb-header {
  background: var(--cb-header-bg) none !important;
  padding: 25px 0;
  margin: 0;
  box-shadow: 0 2px 6px rgba(0, 0, 0, .25);
}

#survey-nav .logo-container { display: block !important; padding: 0; margin: 0; }
/* Fallback, falls imageSrc() die SVG nicht liefert: Logo per CSS-Pfad */
#survey-nav .cb-logo.cb-logo-bg {
  display: block;
  height: 100px;
  width: 216px; /* Seitenverhältnis logo.svg 199:92 */
  background: url("../files/logo.svg") left center / contain no-repeat;
}

#survey-nav .cb-logo {
  display: block;
  height: 100px;
  width: auto;
  max-width: 100%;
}
/* theme_apple.css begrenzt Logos auf 90px und gibt 15px Innenabstand */
#survey-nav .logo-container > img.cb-logo { max-height: none; padding: 0; }

/* Menü-Button (drei Punkte) hell auf dunklem Header */
#survey-nav .navbar-toggler,
#survey-nav .navbar-toggler span { color: #fff; border-color: rgba(255,255,255,.5); }
#survey-nav .navbar-toggler:hover { background-color: rgba(255,255,255,.1); }

@media (max-width: 640px) {
  #survey-nav .cb-logo { height: 60px; }
  #survey-nav.cb-header { padding: 15px 0; }
  #survey-nav .cb-logo.cb-logo-bg { height: 60px; width: 130px; }
}

.completed-text { padding-top: 100px; }

/* ---------- Inhalte ---------- */
.answer-item .ls-label-xs-visibility { padding-left: 40px; }

.text-info { color: #000 !important; }

.answer-item label,
.form-change-lang .language-icon,
.form-change-lang .control-label,
.ls-answers .ls-heading th,
.ls-answers th { color: var(--cb-text); }

.top-container .ls-progress-container { padding: 30px 0 0 0; }

.group-container.space-col,
.question-container { margin-bottom: 0; }

.survey-welcome.form-heading h2 {
  font-weight: 600;
  font-size: 2.85rem;
  line-height: 52px;
  font-family: "IBMPlexSerif", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* ---------- Buttons ---------- */
.btn-primary,
.btn-default,
#ls-button-previous {
  color: #fff;
  background-color: var(--cb-primary);
  border: 1px solid var(--cb-primary); /* gleiche Breite wie beim Hover, damit nichts springt */
}
.btn-primary:hover,
.btn-default:hover,
#ls-button-previous:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.btn-default:focus,
#ls-button-previous:focus {
  color: #fff;
  background-color: var(--cb-primary);
  border-color: var(--cb-accent);
  box-shadow: none !important;
}
/* Schimmer nur bei Tastaturbedienung (Barrierefreiheit) */
.btn-primary:focus-visible,
.btn-default:focus-visible,
#ls-button-previous:focus-visible {
  box-shadow: 0 0 0 .2rem rgba(215, 180, 97, .5) !important;
}
.btn-primary:disabled,
.btn-primary.disabled {
  color: #fff;
  background-color: var(--cb-primary);
  border-color: var(--cb-primary);
}

/* ---------- Fortschrittsbalken ---------- */
.progress-bar {
  color: #fff;
  background-color: var(--cb-primary);
}

/* ---------- Ausgewählte Antworten (Einfach- und Mehrfachauswahl) ---------- */
/* LimeSurvey-Stil (Kreis/Kästchen per ::before/::after) */
.radio-item input[type=radio] + label::after,
.radio-item input[type=radio]:checked + label::after {
  background-color: var(--cb-accent) !important;
}
.radio-item input[type=radio]:checked + label::before,
.checkbox-item input[type=checkbox]:checked + label::before {
  border-color: var(--cb-accent) !important;
}
.checkbox-item input[type=checkbox]:checked + label::after {
  color: var(--cb-accent) !important;
  background-color: transparent !important;
}
/* Beschriftung bleibt dunkel (Gold auf Weiß wäre schlecht lesbar), wird aber fett */
.radio-item input[type=radio]:checked + label,
.checkbox-item input[type=checkbox]:checked + label {
  color: var(--cb-text) !important;
  font-weight: 600;
}
/* Tastaturfokus */
.radio-item input[type=radio]:focus-visible + label::before,
.checkbox-item input[type=checkbox]:focus-visible + label::before {
  box-shadow: 0 0 0 3px rgba(215, 180, 97, .4);
}

/* Bootstrap-Stil (form-check-input), überschreibt das Bootstrap-Blau #0d6efd */
.form-check-input:checked,
.form-check-input[type=checkbox]:indeterminate {
  background-color: var(--cb-accent) !important;
  border-color: var(--cb-accent) !important;
}
.form-check-input:focus {
  border-color: var(--cb-accent);
  box-shadow: none !important;
}
/* Schimmer nur bei Tastaturbedienung (Barrierefreiheit) */
.btn-primary:focus-visible,
.btn-default:focus-visible,
#ls-button-previous:focus-visible {
  box-shadow: 0 0 0 .2rem rgba(215, 180, 97, .5) !important;
}

/* Antworten als Button-Liste (z. B. Ja/Nein, Geschlecht) */
.btn-check:checked + .btn,
.btn-check:active + .btn {
  color: var(--cb-primary) !important;
  background-color: var(--cb-accent) !important;
  border-color: var(--cb-accent) !important;
}

/* ---------- Matrixfragen: Text beim Überfahren schwarz lassen ---------- */
/* theme_apple.css färbt den Teilfragen-Text beim Hover grau (#6E748C) */
.table-hover > tbody > tr:hover > th,
.table-hover > tbody > tr:hover > td,
.table-hover > tbody > tr:hover > th label,
.table-hover > tbody > tr:hover > td label,
table.ls-answers > tbody > tr:hover > th,
table.ls-answers > tbody > tr:hover > td {
  color: #000 !important;
}

.group-container .group-title {
  font-weight: 300;
  font-size: 24px;
  line-height: 1.3;
  margin-top: 10px;
  margin-bottom: 10px;
}

/* Abstand zwischen mehreren Fragen auf einer Seite */
.question-container:not(.ls-hidden) + .question-container {
  margin-top: 3em;
}

/* Kein Zeilenumbruch in thead und in der 1. Spalte */
table.radio-array thead th.answer-text,
table.radio-array tbody th.answertext {
    hyphens: none !important;
    -webkit-hyphens: none !important;
    overflow-wrap: normal;
    word-break: normal;
}