/* =========================================================
   Berlin_Barrierefrei_BerlinCD 2.2 CSS
   Zielbild: Berlin.de / Markenauftritt Land Berlin
   Basis: LimeSurvey CE 6.17 / fruity_twentythree
   ========================================================= */

:root {
  --bb-primary: #E40422;
  --bb-primary-strong: #9D0017;
  --bb-accent: #000000;
  --bb-accent-strong: #000000;
  --bb-accent-soft: #FFF1F3;
  --bb-accent-border: #E40422;
  --bb-page: #F7F7F7;
  --bb-surface: #FFFFFF;
  --bb-surface-muted: #FAFAFA;
  --bb-border: #D6D6D6;
  --bb-border-strong: #8F8F8F;
  --bb-text: #000000;
  --bb-text-muted: #565656;
  --bb-error: #B42318;
  --bb-error-bg: #FFF4F2;
  --bb-success: #287D3C;
  --bb-focus: #000000;
  --bb-focus-ring: rgba(228, 4, 34, .22);

  --bb-font: "Berlin Type", "Berlin Type Office", Arial, "Segoe UI", Aptos, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --bb-fs-small: .875rem;
  --bb-fs-body: 1rem;
  --bb-fs-help: .95rem;
  --bb-fs-question: 1.1875rem;
  --bb-fs-group: 1.625rem;
  --bb-fs-survey: 2rem;

  --bb-space-1: .25rem;
  --bb-space-2: .5rem;
  --bb-space-3: .75rem;
  --bb-space-4: 1rem;
  --bb-space-5: 1.5rem;
  --bb-space-6: 2rem;
  --bb-space-7: 3rem;
  --bb-space-8: 4rem;

  --bb-radius-sm: 8px;
  --bb-radius-md: 12px;
  --bb-radius-lg: 16px;
  --bb-radius-pill: 999px;

  --bb-shadow-sm: 0 1px 2px rgba(15, 23, 42, .06);
  --bb-shadow-card: 0 1px 2px rgba(15, 23, 42, .06), 0 12px 28px rgba(15, 23, 42, .06);
  --bb-shadow-card-hover: 0 2px 4px rgba(15, 23, 42, .07), 0 16px 34px rgba(15, 23, 42, .08);
  --bb-shadow-focus: 0 0 0 4px var(--bb-focus-ring);
}

html,
body {
  font-family: var(--bb-font) !important;
  color: var(--bb-text);
  background: var(--bb-page);
  font-size: 16px;
  line-height: 1.55;
  letter-spacing: 0;
  -webkit-font-smoothing: antialiased;
}

body,
body h1,
body h2,
body h3,
body h4,
body h5,
body h6,
body p,
body span,
body div,
body label,
body legend,
body button,
body input,
body select,
body textarea,
body .btn,
body .navbar,
body .alert,
body .survey-name,
body .survey-title,
body .survey-description,
body .survey-welcome {
  font-family: var(--bb-font) !important;
}

body h1,
body .survey-name,
body .survey-title,
body .survey-welcome h1,
body #welcome-container h1,
body .welcome-container h1 {
  color: var(--bb-primary) !important;
  font-weight: 750;
  letter-spacing: 0;
}

body {
  padding-top: 72px;
}

a {
  color: var(--bb-primary);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

a:hover {
  color: var(--bb-accent-strong);
}

.skip-link {
  position: absolute;
  top: -100%;
  left: var(--bb-space-4);
  z-index: 9999;
  padding: var(--bb-space-3) var(--bb-space-4);
  color: #fff !important;
  background: var(--bb-primary);
  border-radius: 0 0 var(--bb-radius-md) var(--bb-radius-md);
  font-weight: 700;
}

.skip-link:focus {
  top: 0;
}

:focus-visible {
  outline: 2px solid var(--bb-focus) !important;
  outline-offset: 3px;
  box-shadow: var(--bb-shadow-focus) !important;
}

:focus:not(:focus-visible) {
  outline: none !important;
  box-shadow: none !important;
}

/* WCAG/BITV: box-shadow-Fokusindikatoren sind im Windows High Contrast Mode
   (forced-colors) unsichtbar, da nicht-Text-Hintergrundfarben unterdrückt werden.
   Outline bleibt in diesem Modus sichtbar. */
@media (forced-colors: active) {
  :focus,
  :focus-visible,
  .survey-question-block:focus,
  body .form-control:focus,
  body input:focus,
  body textarea:focus,
  body select:focus {
    outline: 2px solid CanvasText !important;
    outline-offset: 2px;
  }
}

/* Header / Utility Navigation */

body .navbar {
  min-height: 64px;
  padding: var(--bb-space-2) 0;
  background: rgba(255, 255, 255, .96);
  border-bottom: 1px solid var(--bb-border);
  box-shadow: var(--bb-shadow-sm);
  backdrop-filter: blur(12px);
}

body .navbar .container-fluid {
  max-width: 920px;
}

body .navbar a,
body .navbar .nav-link {
  color: var(--bb-text) !important;
  font-size: .9375rem;
  font-weight: 600;
  text-decoration: none;
}

body .navbar a:hover,
body .navbar .nav-link:hover {
  color: var(--bb-primary) !important;
  text-decoration: underline;
}

.logo-container img.logo {
  max-height: 52px;
  min-height: 40px;
  width: auto;
}

body .navbar .navbar-toggler {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  color: var(--bb-primary);
  background: var(--bb-surface);
  border: 1px solid var(--bb-border);
  border-radius: var(--bb-radius-md);
}

body .navbar .navbar-toggler:hover {
  background: var(--bb-surface-muted);
  border-color: var(--bb-border-strong);
}

body .navbar .dropdown-menu {
  padding: var(--bb-space-2);
  border: 1px solid var(--bb-border);
  border-radius: var(--bb-radius-md);
  box-shadow: var(--bb-shadow-card);
}

body .navbar .dropdown-item {
  min-height: 40px;
  padding: var(--bb-space-2) var(--bb-space-3);
  border-radius: var(--bb-radius-sm);
  color: var(--bb-text);
}

body .navbar .dropdown-item:hover,
body .navbar .dropdown-item:focus {
  /* WCAG 1.4.3: var(--bb-primary) (#E40422) auf #EEF6E8 liegt bei ~3.9:1, unter AA-Schwelle 4.5:1 */
  color: var(--bb-text);
  background: #EEF6E8;
}

/* Progress */

.ls-progress-container,
[class*="ls-progress"] {
  background: var(--bb-page) !important;
  border-bottom: 0;
}

.bb-progress-wrapper {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--bb-space-3);
  max-width: 920px;
  margin: 0 auto;
  padding: var(--bb-space-5) var(--bb-space-4) var(--bb-space-2);
}

.bb-progress-wrapper .progress {
  height: 8px;
  overflow: hidden;
  background: #E7EBF0;
  border-radius: var(--bb-radius-pill);
}

.bb-progress-wrapper .progress-bar {
  background: linear-gradient(90deg, var(--bb-accent), var(--bb-accent-strong));
  border-radius: var(--bb-radius-pill);
  transition: width 220ms ease;
}

.bb-progress-label {
  color: var(--bb-text-muted);
  font-size: var(--bb-fs-small);
  font-weight: 650;
  white-space: nowrap;
}

/* Main layout */

#main-content {
  max-width: 920px;
  margin: 0 auto;
  padding: var(--bb-space-5) var(--bb-space-4) var(--bb-space-8);
}

.container-fluid .col-xl-8 {
  max-width: 920px;
}

.bb-group-header {
  margin: 0 0 var(--bb-space-5);
  padding: var(--bb-space-2) 0 var(--bb-space-4);
  border-bottom: 1px solid var(--bb-border);
}

.bb-group-header h2,
.bb-group-header h3 {
  margin: 0;
  color: var(--bb-primary) !important;
  font-size: var(--bb-fs-group);
  font-weight: 700;
  line-height: 1.25;
}

.bb-group-header .group-desc {
  max-width: 70ch;
  margin-top: var(--bb-space-2);
  color: var(--bb-text-muted);
  font-size: 1rem;
}

/* Question cards */

body .question-container,
body [class*="questioncontainer"],
body .row.question {
  position: relative;
  overflow: visible;
  margin-bottom: var(--bb-space-5);
  padding: var(--bb-space-6);
  color: var(--bb-text);
  background: var(--bb-surface);
  border: 1px solid var(--bb-border);
  border-radius: var(--bb-radius-lg);
  box-shadow: var(--bb-shadow-card);
}

body .question-container:focus-within,
body [class*="questioncontainer"]:focus-within {
  border-color: #AFCB93;
  box-shadow: var(--bb-shadow-card-hover);
}

body .question-container.mandatory-question,
body [class*="questioncontainer"].mandatory-question {
  border-left: 4px solid var(--bb-accent);
}

body .question-container.input-error,
body [class*="questioncontainer"].input-error {
  border-color: var(--bb-error);
  background: var(--bb-surface);
}

.survey-question-block {
  outline: none;
}

.bb-question-header {
  padding: 0;
  background: transparent;
  border: 0;
}

.bb-question-body {
  padding: 0;
}

body .bb-question-header [class*="questiontitlecontainer"],
body .bb-question-header h2.col-12,
body [class*="questiontitlecontainer"] {
  display: block;
  width: 100%;
  margin: 0 0 var(--bb-space-3);
  padding: 0;
  color: var(--bb-text) !important;
  background: transparent;
  font-size: var(--bb-fs-question);
  font-weight: 650;
  line-height: 1.35;
}

body .bb-question-header [class*="questionnumber"],
body .bb-question-header .ls-label-scale-subq,
[class*="questionnumber"],
.ls-label-scale-subq {
  display: inline-block;
  margin: 0 var(--bb-space-2) var(--bb-space-2) 0;
  color: var(--bb-text-muted) !important;
  font-size: .8125rem;
  font-weight: 650;
  letter-spacing: 0;
  text-transform: none;
}

body .bb-question-header [class*="lsquestiontext"],
body .bb-question-header .ls-question-text-container,
[class*="lsquestiontext"],
.ls-question-text-container {
  color: var(--bb-text) !important;
}

.bb-mandatory-star {
  margin-right: var(--bb-space-1);
  color: var(--bb-error) !important;
  font-weight: 800;
}

[class*="lsquestionhelp"],
.ls-question-help {
  max-width: 72ch;
  margin: 0 0 var(--bb-space-4);
  padding: 0;
  color: var(--bb-text-muted);
  font-size: var(--bb-fs-help);
  line-height: 1.55;
}

.bb-compliance-hint {
  display: flex;
  align-items: flex-start;
  gap: var(--bb-space-2);
  margin: var(--bb-space-2) 0 var(--bb-space-4);
  padding: var(--bb-space-3) var(--bb-space-4);
  color: var(--bb-text-muted);
  background: var(--bb-surface-muted);
  border: 1px solid var(--bb-border);
  border-radius: var(--bb-radius-md);
  font-size: .9rem;
}

.bb-compliance-hint strong {
  color: var(--bb-text);
}

/* Inputs */

body .form-control,
body input[type="text"],
body input[type="email"],
body input[type="number"],
body input[type="url"],
body input[type="date"],
body input[type="datetime-local"],
body textarea,
body select {
  min-height: 48px;
  padding: .75rem .875rem;
  color: var(--bb-text);
  background: var(--bb-surface);
  border: 1px solid var(--bb-border-strong);
  border-radius: var(--bb-radius-md);
  font-family: var(--bb-font) !important;
  font-size: 1rem;
  line-height: 1.4;
  transition: border-color 140ms ease, box-shadow 140ms ease, background 140ms ease;
}

body .form-control:hover,
body input[type="text"]:hover,
body textarea:hover,
body select:hover {
  border-color: var(--bb-accent-strong);
}

body .form-control:focus,
body input:focus,
body textarea:focus,
body select:focus {
  border-color: var(--bb-focus);
  box-shadow: var(--bb-shadow-focus);
  outline: none;
}

body .has-error .form-control,
body .input-error .form-control,
body [aria-invalid="true"] {
  border-color: var(--bb-error);
  background: var(--bb-error-bg);
}

textarea.form-control {
  min-height: 132px;
  resize: vertical;
}

body input[type="date"],
body input[type="datetime-local"],
body .question-answers .input-group input[type="text"].date,
body .question-answers .input-group input[id*="date"],
body .question-answers .input-group input[name*="date"] {
  width: min(100%, 13rem);
  max-width: 13rem;
  min-height: 44px;
  padding-block: .55rem;
}

body .question-answers .input-group:has(input[type="date"]),
body .question-answers .input-group:has(input[type="datetime-local"]),
body .question-answers .input-group:has(input[id*="date"]),
body .question-answers .input-group:has(input[name*="date"]) {
  width: max-content;
  max-width: 100%;
}

body .question-answers .input-group:has(input[type="date"]) .btn,
body .question-answers .input-group:has(input[type="datetime-local"]) .btn,
body .question-answers .input-group:has(input[id*="date"]) .btn,
body .question-answers .input-group:has(input[name*="date"]) .btn {
  width: 48px;
  min-width: 48px;
  min-height: 44px;
  padding-inline: 0;
}

body .question-answers .input-group .input-group-btn .btn,
body .question-answers .input-group .input-group-addon,
body .question-answers .input-group .input-group-text {
  min-height: 44px;
}

body .question-answers .input-group .input-group-btn .btn:has(.ri-calendar-line),
body .question-answers .input-group .input-group-btn .btn:has(.fa-calendar),
body .question-answers .input-group .input-group-text:has(.ri-calendar-line),
body .question-answers .input-group .input-group-text:has(.fa-calendar) {
  width: 48px;
  min-width: 48px;
  padding-inline: 0;
}

/* Radios and checkboxes */

.radio label,
.checkbox label,
.ls-radio label,
.ls-checkbox label {
  display: flex;
  align-items: flex-start;
  gap: var(--bb-space-3);
  min-height: 48px;
  margin-bottom: var(--bb-space-2);
  padding: var(--bb-space-3) var(--bb-space-4);
  color: var(--bb-text);
  background: var(--bb-surface);
  border: 1px solid var(--bb-border);
  border-radius: var(--bb-radius-md);
  cursor: pointer;
  line-height: 1.45;
  transition: border-color 140ms ease, background 140ms ease, box-shadow 140ms ease;
}

.radio label:hover,
.checkbox label:hover,
.ls-radio label:hover,
.ls-checkbox label:hover {
  background: #F6FAF2;
  border-color: var(--bb-accent-border);
}

.radio input[type="radio"],
.ls-radio input[type="radio"],
.checkbox input[type="checkbox"],
.ls-checkbox input[type="checkbox"] {
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  margin-top: .05em;
  accent-color: var(--bb-accent);
  cursor: pointer;
}

.radio input[type="radio"]:checked,
.ls-radio input[type="radio"]:checked,
.checkbox input[type="checkbox"]:checked,
.ls-checkbox input[type="checkbox"]:checked {
  outline: 2px solid transparent;
  accent-color: var(--bb-accent);
}

.radio label:has(input[type="radio"]:checked),
.ls-radio label:has(input[type="radio"]:checked),
.checkbox label:has(input[type="checkbox"]:checked),
.ls-checkbox label:has(input[type="checkbox"]:checked),
.radio label.bb-option-selected,
.ls-radio label.bb-option-selected,
.checkbox label.bb-option-selected,
.ls-checkbox label.bb-option-selected {
  background: var(--bb-accent-soft);
  border-color: var(--bb-accent-border);
  box-shadow: inset 0 0 0 1px var(--bb-accent-border);
}

.radio input[type="radio"]:checked ~ span,
.ls-radio input[type="radio"]:checked ~ span,
.checkbox input[type="checkbox"]:checked ~ span,
.ls-checkbox input[type="checkbox"]:checked ~ span {
  color: var(--bb-accent);
  font-weight: 650;
}

body .radio-item input[type="radio"]:checked + label,
body .checkbox-item input[type="checkbox"]:checked + label,
body .answer-item input[type="radio"]:checked + label,
body .answer-item input[type="checkbox"]:checked + label,
body .ls-answers input[type="radio"]:checked + label,
body .ls-answers input[type="checkbox"]:checked + label {
  color: var(--bb-accent) !important;
  font-weight: 650;
}

body .checkbox input[type="checkbox"]:checked + label::before,
body .checkbox input[type="checkbox"]:checked + label::after,
body .ls-checkbox input[type="checkbox"]:checked + label::before,
body .ls-checkbox input[type="checkbox"]:checked + label::after,
body .answer-item input[type="checkbox"]:checked + label::before,
body .answer-item input[type="checkbox"]:checked + label::after,
body .ls-answers input[type="checkbox"]:checked + label::before,
body .ls-answers input[type="checkbox"]:checked + label::after {
  border-color: var(--bb-accent) !important;
  color: var(--bb-accent) !important;
}

body .checkbox input[type="checkbox"]:checked + label,
body .ls-checkbox input[type="checkbox"]:checked + label,
body .answer-item input[type="checkbox"]:checked + label,
body .ls-answers input[type="checkbox"]:checked + label {
  --bs-form-check-bg-image: none;
  --bs-form-check-bg: var(--bb-accent-soft);
}

body .checkbox .ri-check-line,
body .checkbox .ri-check-fill,
body .checkbox .fa-check,
body .ls-checkbox .ri-check-line,
body .ls-checkbox .ri-check-fill,
body .ls-checkbox .fa-check,
body .answer-item .ri-check-line,
body .answer-item .ri-check-fill,
body .answer-item .fa-check,
body .ls-answers .ri-check-line,
body .ls-answers .ri-check-fill,
body .ls-answers .fa-check {
  color: var(--bb-accent) !important;
}

/* Matrix / Array questions */

#limesurvey .question-answers .ls-answers,
#limesurvey .question-answers .answer-container,
#limesurvey .question-answers .array-container {
  width: 100%;
}

#limesurvey .question-answers table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
  font-size: .95rem;
  background: var(--bb-surface);
  border: 1px solid var(--bb-border);
  border-radius: var(--bb-radius-md);
}

#limesurvey .question-answers thead th {
  padding: var(--bb-space-3);
  color: var(--bb-text-muted);
  background: var(--bb-surface-muted);
  border-bottom: 1px solid var(--bb-border);
  font-size: .875rem;
  font-weight: 700;
  text-align: center;
}

#limesurvey .question-answers thead th:first-child {
  text-align: left;
}

#limesurvey .question-answers tbody th,
#limesurvey .question-answers tbody td {
  padding: var(--bb-space-3);
  border-bottom: 1px solid var(--bb-border);
  vertical-align: middle;
}

#limesurvey .question-answers tbody th {
  width: 34%;
  color: var(--bb-text);
  font-weight: 500;
  text-align: left;
}

#limesurvey .question-answers tbody td {
  text-align: center;
}

#limesurvey .question-answers tbody tr:last-child th,
#limesurvey .question-answers tbody tr:last-child td {
  border-bottom: 0;
}

#limesurvey .question-answers tbody tr:hover {
  background: #F8FCFD;
}

#limesurvey .question-answers table input[type="radio"],
#limesurvey .question-answers table input[type="checkbox"] {
  width: 22px;
  height: 22px;
  accent-color: var(--bb-accent);
}

#limesurvey .question-answers table.bb-matrix-table {
  table-layout: fixed;
}

#limesurvey .question-answers table.bb-matrix-table tbody tr.bb-matrix-row-selected {
  background: #F6FAF2;
}

#limesurvey .question-answers table.bb-matrix-table td.bb-matrix-choice-cell {
  position: relative;
}

#limesurvey .question-answers table.bb-matrix-table td.bb-matrix-choice-selected {
  background: var(--bb-accent-soft);
  box-shadow: inset 0 0 0 1px var(--bb-accent-border);
}

#limesurvey .question-answers table.bb-matrix-table td.bb-matrix-choice-selected,
#limesurvey .question-answers table.bb-matrix-table td.bb-matrix-choice-selected * {
  color: var(--bb-primary);
}

#limesurvey .question-answers table.bb-matrix-table td.bb-matrix-side-label {
  color: var(--bb-text-muted);
  font-size: .925rem;
  text-align: right;
}

/* Buttons */

body .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--bb-space-2);
  min-width: max-content;
  min-height: 44px;
  padding: .7rem 1.25rem;
  border-radius: var(--bb-radius-md);
  font-family: var(--bb-font) !important;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
  word-break: keep-all;
  overflow-wrap: normal;
  hyphens: none;
  text-decoration: none;
  transition: background 140ms ease, border-color 140ms ease, box-shadow 140ms ease;
}

body .btn.btn-lg {
  min-width: 108px;
  min-height: 48px;
  padding: .85rem 1.5rem;
  font-size: 1rem;
}

body .btn.btn-primary {
  color: #fff;
  background: var(--bb-primary);
  border: 1px solid var(--bb-primary);
  box-shadow: 0 1px 2px rgba(15, 23, 42, .12);
}

body .btn.btn-primary:hover {
  color: #fff;
  background: var(--bb-primary-strong);
  border-color: var(--bb-primary-strong);
}

body .btn.btn-primary:active {
  background: #071925;
  border-color: #071925;
}

body .btn.btn-primary:disabled,
body .btn.btn-primary.disabled {
  color: #6B7280;
  background: #E5E7EB;
  border-color: #E5E7EB;
  opacity: 1;
  cursor: not-allowed;
}

body .btn.btn-outline-secondary,
body .btn[class*="navigatorbuttonprev"] {
  color: var(--bb-primary);
  background: var(--bb-surface);
  border: 1px solid var(--bb-border-strong);
}

body .btn.btn-outline-secondary:hover,
body .btn[class*="navigatorbuttonprev"]:hover {
  color: var(--bb-primary);
  background: var(--bb-surface-muted);
  border-color: var(--bb-primary);
}

/* Validation and messages */

body .alert-danger,
body [role="alert"],
body [class*="questionvalidcontainer"] {
  margin-top: var(--bb-space-3);
  padding: var(--bb-space-3) var(--bb-space-4);
  color: var(--bb-error);
  background: var(--bb-error-bg);
  border: 1px solid #F2B8B5;
  border-left: 4px solid var(--bb-error);
  border-radius: var(--bb-radius-md);
  font-size: .9375rem;
  font-weight: 600;
}

body [class*="questionvalidcontainer"][aria-hidden="true"],
body [id^="question-file-hint-"][aria-hidden="true"],
body [class*="questionvalidcontainer"]:empty,
body [id^="question-file-hint-"]:empty {
  display: none !important;
}

body .alert-info {
  color: var(--bb-primary) !important;
  background: #EEF6E8 !important;
  border: 1px solid #AFCB93;
}

body .alert-success {
  color: #fff !important;
  background: var(--bb-success) !important;
  border: 0;
}

body .alert-warning {
  color: #2F2200 !important;
  background: #FFF4CC !important;
  border: 1px solid #F4D06F;
}

/* Bottom navigation */

.navigator,
#navigatorcontainer,
[class*="navigatorcontainer"] {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--bb-space-3);
  width: 100%;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-top: var(--bb-space-6);
  padding: var(--bb-space-4) 0 0;
  background: transparent;
  border-top: 1px solid var(--bb-border);
  border-radius: 0;
}

.navigator [class*="navigatorbuttonl"],
.navigator [class*="navigatorbuttonr"] {
  width: auto !important;
  max-width: none !important;
  flex: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.navigator [class*="navigatorbuttonl"]:empty {
  display: none;
}

.navigator .bb-nav-prev {
  grid-column: 1;
  justify-self: start;
  text-align: left !important;
}

.navigator .bb-nav-next {
  grid-column: 2;
  justify-self: end;
}

.navigator [class*="navigatorbuttonr"] {
  display: flex;
  justify-content: flex-end;
  margin-left: 0;
  text-align: right;
  min-width: max-content;
}

.navigator [class*="navigatorbuttonr"] .btn {
  flex: 0 0 auto;
  width: auto !important;
  min-width: 108px;
  white-space: nowrap;
}

/* Footer */

.survey-footer {
  max-width: 920px;
  margin: var(--bb-space-7) auto 0;
  padding: var(--bb-space-4);
  color: var(--bb-text-muted);
  background: transparent;
  border-top: 1px solid var(--bb-border);
  font-size: .8125rem;
  line-height: 1.45;
}

.survey-footer .col-12,
.survey-footer .col-xl-8 {
  width: 100%;
  max-width: none;
  padding-left: 0;
  padding-right: 0;
}

.bb-footer-grid {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: var(--bb-space-5);
}

.bb-footer-brand {
  display: inline-flex;
  align-items: center;
  gap: var(--bb-space-2);
  color: var(--bb-text-muted);
  white-space: nowrap;
}

.bb-footer-brand-name {
  color: var(--bb-primary);
  font-weight: 700;
}

.bb-footer-product,
.bb-footer-separator {
  color: var(--bb-text-muted);
}

.bb-footer-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: var(--bb-space-2) var(--bb-space-4);
  margin: 0;
  padding: 0;
  list-style: none;
}

.bb-footer-links a {
  color: var(--bb-primary);
  font-size: .8125rem;
  font-weight: 600;
  text-decoration-thickness: 1px;
}

.bb-footer-meta {
  margin: var(--bb-space-3) 0 0;
  color: var(--bb-text-muted);
  font-size: .75rem;
}

body .submit-wrapper,
body [class*="submitwrapper"] {
  color: var(--bb-primary);
}

body [class*="submitwrapper"] p,
body [class*="submitwrapper"] div,
body [class*="submitwrappertext"] {
  color: var(--bb-primary) !important;
}

body [class*="submitwrappertextHeading"],
body #survey-completed-heading {
  color: var(--bb-primary) !important;
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 750;
  line-height: 1.15;
}

body [class*="submitwrappertextContent"] {
  color: var(--bb-primary-strong) !important;
  font-size: 1.125rem;
  line-height: 1.5;
}

.bb-ranking-item,
ul.sortable li.bb-ranking-item,
ul.answers-list.sortable li.bb-ranking-item {
  border-color: var(--bb-accent-border);
  background: #FFFFFF;
}

body .question-answers ul.sortable li,
body .question-answers ul.answers-list.sortable li {
  border-color: var(--bb-border);
}

body .question-answers ul.sortable li:hover,
body .question-answers ul.answers-list.sortable li:hover,
body .question-answers ul.sortable li:focus-within,
body .question-answers ul.answers-list.sortable li:focus-within {
  border-color: var(--bb-accent-border);
  background: var(--bb-accent-soft);
}

.bb-ranking-item:focus-within,
ul.sortable li.bb-ranking-item:focus-within {
  outline: 2px solid var(--bb-focus);
  outline-offset: 2px;
}

.bb-ranking-btn {
  background: var(--bb-primary);
  color: #FFFFFF;
}

.bb-ranking-btn:hover {
  background: var(--bb-primary-strong);
}

.bb-ranking-position {
  color: var(--bb-text-muted);
}

.bb-ranking-text {
  color: var(--bb-text);
}

@media (max-width: 575px) {
  .bb-footer-grid {
    grid-template-columns: 1fr;
    gap: var(--bb-space-3);
  }

  .bb-footer-links {
    justify-content: flex-start;
  }
}

/* Responsive */

@media (max-width: 767px) {
  body {
    padding-top: 64px;
  }

  #main-content {
    padding: var(--bb-space-4) var(--bb-space-3) var(--bb-space-7);
  }

  body .question-container,
  body [class*="questioncontainer"],
  body .row.question {
    padding: var(--bb-space-5);
    border-radius: 14px;
  }

  .bb-progress-wrapper {
    grid-template-columns: 1fr;
    gap: var(--bb-space-2);
  }

  .bb-progress-label {
    order: -1;
  }

  .navigator,
  #navigatorcontainer,
  [class*="navigatorcontainer"] {
    display: grid;
    grid-template-columns: 1fr;
  }

  .navigator [class*="navigatorbuttonl"],
  .navigator [class*="navigatorbuttonr"],
  .navigator .btn {
    width: 100%;
    text-align: center;
  }

  .navigator .bb-nav-prev,
  .navigator .bb-nav-next {
    grid-column: 1;
    justify-self: stretch;
  }

  #limesurvey .question-answers .ls-answers,
  #limesurvey .question-answers .answer-container,
  #limesurvey .question-answers .array-container {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  #limesurvey .question-answers table:not(.bb-matrix-table) {
    min-width: 640px;
  }

  #limesurvey .question-answers table.bb-matrix-table {
    display: block;
    border: 0;
    background: transparent;
    table-layout: auto;
  }

  #limesurvey .question-answers table.bb-matrix-table thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
  }

  #limesurvey .question-answers table.bb-matrix-table tbody,
  #limesurvey .question-answers table.bb-matrix-table tr,
  #limesurvey .question-answers table.bb-matrix-table th,
  #limesurvey .question-answers table.bb-matrix-table td {
    display: block;
    width: 100%;
  }

  #limesurvey .question-answers table.bb-matrix-table tbody tr {
    margin-bottom: var(--bb-space-4);
    padding: var(--bb-space-4);
    background: var(--bb-surface);
    border: 1px solid var(--bb-border);
    border-radius: var(--bb-radius-md);
    box-shadow: var(--bb-shadow-sm);
  }

  #limesurvey .question-answers table.bb-matrix-table tbody th {
    position: static;
    min-width: 0;
    margin: 0 0 var(--bb-space-3);
    padding: 0 0 var(--bb-space-3);
    color: var(--bb-text);
    background: transparent;
    border: 0;
    border-bottom: 1px solid var(--bb-border);
    box-shadow: none;
    font-size: 1rem;
    font-weight: 650;
    line-height: 1.4;
  }

  #limesurvey .question-answers table.bb-matrix-table tbody td {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--bb-space-3);
    min-height: 48px;
    margin-top: var(--bb-space-2);
    padding: var(--bb-space-3);
    border: 1px solid var(--bb-border);
    border-radius: var(--bb-radius-md);
    background: var(--bb-surface);
    text-align: left;
  }

  #limesurvey .question-answers table.bb-matrix-table tbody td.bb-matrix-choice-cell::before {
    content: attr(data-bb-col-label);
    color: var(--bb-text);
    font-size: .95rem;
    font-weight: 600;
    line-height: 1.35;
  }

  #limesurvey .question-answers table.bb-matrix-table tbody td.bb-matrix-choice-selected {
    border-color: var(--bb-accent-border);
    background: var(--bb-accent-soft);
    box-shadow: inset 0 0 0 1px var(--bb-accent-border);
  }

  #limesurvey .question-answers table.bb-matrix-table tbody td.bb-matrix-side-label {
    display: block;
    min-height: 0;
    padding: var(--bb-space-2) 0 0;
    color: var(--bb-text-muted);
    background: transparent;
    border: 0;
    text-align: left;
    font-size: .9rem;
  }
}

/* =========================================================
   2.3.1 preliminary Berlin.de UI regression rules
   Removes legacy ITDZ/SaaS styling that can survive on nested LS elements.
   ========================================================= */

:root {
  --bb-radius-sm: 0px;
  --bb-radius-md: 0px;
  --bb-radius-lg: 0px;
  --bb-radius-pill: 0px;
}

/* Berlin.de uses square rectangular controls. Radio indicators remain round. */
body .btn,
body button,
body input[type="button"],
body input[type="submit"],
body input[type="reset"],
body .form-control,
body .form-select,
body input:not([type="radio"]),
body select,
body textarea,
body .input-group,
body .input-group-text,
body .dropdown-menu,
body .modal-content,
body .card,
body .list-group,
body .list-group-item,
body .alert,
body .progress,
body .progress-bar,
body .question-container,
body .question-wrapper,
body .question,
body .ls-question,
body .sortable-item,
body .sortable-rank,
body .sortable-block,
body .bb-star-rating-label,
body .bb-widget-star-button {
  border-radius: 0 !important;
}

body input[type="radio"],
body .radio label::before,
body .ls-radio label::before,
body .radio-item label::before,
body .answer-item input[type="radio"] + label::before {
  border-radius: 50% !important;
}

/* Completion page: one calm status panel, not a full green content block. */
body .submit-wrapper,
body [class*="submitwrapper"] {
  max-inline-size: 720px;
  margin-inline: auto;
  color: var(--berlin-black) !important;
  background: var(--berlin-white) !important;
}

body [class*="submitwrappertext"] {
  padding: 24px;
  color: var(--berlin-black) !important;
  background: var(--berlin-white) !important;
  border: 1px solid var(--berlin-grey-300);
  border-left: 6px solid var(--berlin-success);
}

body [class*="submitwrapper"] p,
body [class*="submitwrapper"] div,
body [class*="submitwrappertext"] {
  color: var(--berlin-black) !important;
}

body [class*="submitwrappertextHeading"],
body #survey-completed-heading {
  margin: 8px 0 10px;
  color: var(--berlin-black) !important;
  font-size: clamp(1.75rem, 3vw, 2.25rem);
  font-weight: 700;
  line-height: 1.2;
}

body [class*="submitwrappertextContent"] {
  margin: 0;
  color: var(--berlin-black) !important;
  font-size: 1.125rem;
  line-height: 1.5;
}

body .bb-success-icon {
  display: inline-block;
  color: var(--berlin-success) !important;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
}

/* Ranking: neutral structure, red only for selected/focused items. */
#limesurvey .bb-ranking-color-list *,
body .bb-ranking-color-list *,
#limesurvey .bb-ranking-color-normalized,
body .bb-ranking-color-normalized,
#limesurvey .select-sortable-lists .sortable-item,
body .select-sortable-lists .sortable-item,
#limesurvey .ranking-advanced-style .sortable-rank,
body .ranking-advanced-style .sortable-rank,
#limesurvey .ranking-advanced-style .sortable-block,
body .ranking-advanced-style .sortable-block {
  --ls-success: var(--berlin-red) !important;
  --bs-success: var(--berlin-red) !important;
  --bs-success-rgb: 228, 4, 34 !important;
  border-color: var(--berlin-grey-700) !important;
  outline-color: var(--berlin-focus) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

#limesurvey .bb-ranking-color-list .selector__dragHandle,
body .bb-ranking-color-list .selector__dragHandle,
#limesurvey .bb-ranking-color-list .selector__index_row,
body .bb-ranking-color-list .selector__index_row {
  color: var(--berlin-grey-700) !important;
  border: 0 !important;
}

#limesurvey .bb-ranking-color-normalized:focus,
#limesurvey .bb-ranking-color-normalized:focus-within,
body .bb-ranking-color-normalized:focus,
body .bb-ranking-color-normalized:focus-within,
#limesurvey .sortable-item:focus,
#limesurvey .sortable-item:focus-within,
body .sortable-item:focus,
body .sortable-item:focus-within {
  border-color: var(--berlin-red) !important;
  outline: 3px solid var(--berlin-focus) !important;
  outline-offset: 2px;
}

#limesurvey .ranking-sorted-items .sortable-item,
body .ranking-sorted-items .sortable-item,
#limesurvey .ranking-advanced-sorted-items .sortable-item,
body .ranking-advanced-sorted-items .sortable-item {
  border-color: var(--berlin-red) !important;
}

/* Flat star controls: no comic drop-shadow, gradient, tilt or lift. */
#limesurvey .bb-star-face-svg,
body .bb-star-face-svg,
#limesurvey .bb-widget-star-button .bb-star-face-svg,
body .bb-widget-star-button .bb-star-face-svg {
  filter: none !important;
  transform: none !important;
}

#limesurvey .bb-star-rating-label,
body .bb-star-rating-label,
#limesurvey .bb-widget-star-button,
body .bb-widget-star-button,
#limesurvey .bb-star-rating-label:hover,
body .bb-star-rating-label:hover,
#limesurvey .bb-widget-star-button:hover,
body .bb-widget-star-button:hover {
  background: var(--berlin-white) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}

#limesurvey .bb-star-rating-label.bb-star-rating-label-filled,
body .bb-star-rating-label.bb-star-rating-label-filled,
#limesurvey .bb-widget-star-button-filled,
body .bb-widget-star-button-filled,
#limesurvey .bb-widget-star-button-selected,
body .bb-widget-star-button-selected {
  --bb-star-fill-start: var(--berlin-red) !important;
  --bb-star-fill-mid: var(--berlin-red) !important;
  --bb-star-fill-end: var(--berlin-red) !important;
  box-shadow: inset 0 0 0 2px var(--berlin-red) !important;
}

/* Remove remaining motion and decorative effects from original theme rules. */
body .question-container:hover,
body .question-wrapper:hover,
body .question:hover,
body .ls-question:hover,
body .btn:hover,
body button:hover {
  transform: none !important;
}

body .text-danger {
  color: var(--berlin-error) !important;
}

@media (max-width: 767px) {
  body [class*="submitwrappertext"] {
    padding: 20px 16px;
  }
}

/* 2.3.2: LimeSurvey's concrete completion container.
   `.completed-text` is independent from the submitwrapper class names. */
body .completed-text {
  color: var(--berlin-black) !important;
  background: var(--berlin-white) !important;
  background-image: none !important;
  border: 1px solid var(--berlin-grey-300) !important;
  border-left: 6px solid var(--berlin-success) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body .completed-text p,
body .completed-text div,
body .completed-text h1,
body .completed-text h2,
body .completed-text h3,
body .completed-text #survey-completed-heading {
  color: var(--berlin-black) !important;
  background: transparent !important;
}

body .completed-text .bb-success-icon {
  color: var(--berlin-success) !important;
}

/* 2.3.3 final cascade override. Keep this as the last CSS block. */
body #survey-nav {
  min-height: 76px !important;
  padding-block: 12px !important;
  background: var(--berlin-white) !important;
  border-top: 0 !important;
  border-bottom: 1px solid var(--berlin-black) !important;
}

body #survey-nav .container-fluid {
  max-width: 1060px !important;
}

body #survey-nav .navbar-brand.logo-container {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 52px !important;
  margin: 0 !important;
  padding: 0 !important;
}

body #survey-nav .logo-container img.logo,
body .logo-container img.logo,
body.brand-logo #survey-nav .logo-container img.logo {
  width: auto !important;
  min-width: 0 !important;
  max-width: 220px !important;
  height: auto !important;
  min-height: 42px !important;
  max-height: 52px !important;
  object-fit: contain !important;
}

body .completed-text,
body [class*="submitwrappertext"].completed-text,
body .submit-wrapper .completed-text,
body [class*="submitwrapper"] .completed-text {
  box-sizing: border-box !important;
  max-width: 720px !important;
  margin: 12px auto 0 !important;
  padding: 32px !important;
  color: var(--berlin-black) !important;
  background: var(--berlin-white) !important;
  background-color: var(--berlin-white) !important;
  background-image: none !important;
  border: 1px solid var(--berlin-grey-300) !important;
  border-top: 6px solid var(--berlin-red) !important;
  border-left: 1px solid var(--berlin-grey-300) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body [class*="submitwrapper"] {
  max-width: 720px !important;
  margin-inline: auto !important;
  background: transparent !important;
}

body .bb-completion-message {
  display: grid !important;
  grid-template-columns: 44px minmax(0, 1fr) !important;
  gap: 18px !important;
  align-items: start !important;
}

body .bb-completion-copy {
  min-width: 0 !important;
}

body .completed-text .bb-success-icon,
body .bb-success-icon {
  display: inline-grid !important;
  width: 44px !important;
  height: 44px !important;
  place-items: center !important;
  color: var(--berlin-black) !important;
  font-size: 2rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  border: 2px solid var(--berlin-black) !important;
  border-radius: 0 !important;
  background: var(--berlin-white) !important;
}

body .completed-text p,
body .completed-text div,
body .completed-text h1,
body .completed-text h2,
body .completed-text h3,
body .completed-text #survey-completed-heading,
body .completed-text [class*="submitwrappertextHeading"],
body .completed-text [class*="submitwrappertextContent"] {
  color: var(--berlin-black) !important;
  background: transparent !important;
}

body .completed-text #survey-completed-heading,
body .completed-text [class*="submitwrappertextHeading"] {
  margin: 0 0 10px !important;
  color: var(--berlin-black) !important;
  font-size: clamp(2rem, 4vw, 3rem) !important;
  font-weight: 700 !important;
  line-height: 1.08 !important;
}

body .completed-text [class*="submitwrappertextContent"] {
  margin: 0 !important;
  font-size: 1.25rem !important;
  line-height: 1.45 !important;
}

body .activealert,
body .alert-warning {
  max-width: 720px !important;
  margin-inline: auto !important;
}

@media (max-width: 767px) {
  body {
    padding-top: 84px !important;
  }

  body #survey-nav {
    min-height: 72px !important;
    padding-block: 10px !important;
  }

  body #survey-nav .navbar-brand.logo-container {
    display: inline-flex !important;
    min-height: 48px !important;
  }

  body #survey-nav .logo-container img.logo,
  body .logo-container img.logo {
    max-width: 180px !important;
    min-height: 38px !important;
    max-height: 48px !important;
  }

  body .completed-text,
  body [class*="submitwrappertext"].completed-text,
  body [class*="submitwrapper"] .completed-text {
    padding: 24px 18px !important;
  }

  body .bb-completion-message {
    grid-template-columns: 36px minmax(0, 1fr) !important;
    gap: 14px !important;
  }

  body .completed-text .bb-success-icon,
  body .bb-success-icon {
    width: 36px !important;
    height: 36px !important;
    font-size: 1.5rem !important;
  }
}

/* 2.3.4 final logo sizing override. Keep at EOF. */
body #survey-nav {
  min-height: 96px !important;
  padding-block: 14px !important;
}

body #survey-nav .navbar-brand.logo-container,
body #survey-nav a.navbar-brand.logo-container,
body #survey-nav span.navbar-brand.logo-container {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  min-width: 240px !important;
  min-height: 68px !important;
}

body #survey-nav .navbar-brand.logo-container img,
body #survey-nav .logo-container img.logo,
body .navbar-brand.logo-container img.logo,
body .logo-container img.logo {
  display: block !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: 320px !important;
  height: 64px !important;
  min-height: 64px !important;
  max-height: 64px !important;
  object-fit: contain !important;
}

body #navbar-menu {
  align-self: center !important;
}

@media (max-width: 767px) {
  body {
    padding-top: 104px !important;
  }

  body #survey-nav {
    min-height: 86px !important;
    padding-block: 12px !important;
  }

  body #survey-nav .navbar-brand.logo-container,
  body #survey-nav a.navbar-brand.logo-container,
  body #survey-nav span.navbar-brand.logo-container {
    min-width: 190px !important;
    min-height: 56px !important;
  }

  body #survey-nav .navbar-brand.logo-container img,
  body #survey-nav .logo-container img.logo,
  body .navbar-brand.logo-container img.logo,
  body .logo-container img.logo {
    max-width: 240px !important;
    height: 52px !important;
    min-height: 52px !important;
    max-height: 52px !important;
  }
}

/* 2.3.3 BerlinCD header and completion polish. Keep at EOF. */
body #survey-nav {
  min-height: 76px !important;
  padding-block: 12px !important;
  background: var(--berlin-white) !important;
  border-top: 0 !important;
  border-bottom: 1px solid var(--berlin-black) !important;
}

body #survey-nav .container-fluid {
  max-width: 1060px !important;
}

body #survey-nav .navbar-brand.logo-container {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 52px !important;
  margin: 0 !important;
  padding: 0 !important;
}

body #survey-nav .logo-container img.logo,
body .logo-container img.logo,
body.brand-logo #survey-nav .logo-container img.logo {
  width: auto !important;
  min-width: 0 !important;
  max-width: 220px !important;
  height: auto !important;
  min-height: 42px !important;
  max-height: 52px !important;
  object-fit: contain !important;
}

body .completed-text,
body [class*="submitwrappertext"].completed-text,
body .submit-wrapper .completed-text,
body [class*="submitwrapper"] .completed-text {
  box-sizing: border-box !important;
  max-width: 720px !important;
  margin: 12px auto 0 !important;
  padding: 32px !important;
  color: var(--berlin-black) !important;
  background: var(--berlin-white) !important;
  background-color: var(--berlin-white) !important;
  background-image: none !important;
  border: 1px solid var(--berlin-grey-300) !important;
  border-top: 6px solid var(--berlin-red) !important;
  border-left: 1px solid var(--berlin-grey-300) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body [class*="submitwrapper"] {
  max-width: 720px !important;
  margin-inline: auto !important;
  background: transparent !important;
}

body .bb-completion-message {
  display: grid !important;
  grid-template-columns: 44px minmax(0, 1fr) !important;
  gap: 18px !important;
  align-items: start !important;
}

body .bb-completion-copy {
  min-width: 0 !important;
}

body .completed-text .bb-success-icon,
body .bb-success-icon {
  display: inline-grid !important;
  width: 44px !important;
  height: 44px !important;
  place-items: center !important;
  color: var(--berlin-black) !important;
  font-size: 2rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  border: 2px solid var(--berlin-black) !important;
  border-radius: 0 !important;
  background: var(--berlin-white) !important;
}

body .completed-text p,
body .completed-text div,
body .completed-text h1,
body .completed-text h2,
body .completed-text h3,
body .completed-text #survey-completed-heading,
body .completed-text [class*="submitwrappertextHeading"],
body .completed-text [class*="submitwrappertextContent"] {
  color: var(--berlin-black) !important;
  background: transparent !important;
}

body .completed-text #survey-completed-heading,
body .completed-text [class*="submitwrappertextHeading"] {
  margin: 0 0 10px !important;
  color: var(--berlin-black) !important;
  font-size: clamp(2rem, 4vw, 3rem) !important;
  font-weight: 700 !important;
  line-height: 1.08 !important;
}

body .completed-text [class*="submitwrappertextContent"] {
  margin: 0 !important;
  font-size: 1.25rem !important;
  line-height: 1.45 !important;
}

body .activealert,
body .alert-warning {
  max-width: 720px !important;
  margin-inline: auto !important;
}

@media (max-width: 767px) {
  body {
    padding-top: 84px !important;
  }

  body #survey-nav {
    min-height: 72px !important;
    padding-block: 10px !important;
  }

  body #survey-nav .navbar-brand.logo-container {
    display: inline-flex !important;
    min-height: 48px !important;
  }

  body #survey-nav .logo-container img.logo,
  body .logo-container img.logo {
    max-width: 180px !important;
    min-height: 38px !important;
    max-height: 48px !important;
  }

  body .completed-text,
  body [class*="submitwrappertext"].completed-text,
  body [class*="submitwrapper"] .completed-text {
    padding: 24px 18px !important;
  }

  body .bb-completion-message {
    grid-template-columns: 36px minmax(0, 1fr) !important;
    gap: 14px !important;
  }

  body .completed-text .bb-success-icon,
  body .bb-success-icon {
    width: 36px !important;
    height: 36px !important;
    font-size: 1.5rem !important;
  }
}

/* =========================================================
   2.3.1 duplicated preliminary regression rules
   The authoritative final cascade layer is located at the file end.
   ========================================================= */

:root {
  --bb-radius-sm: 0px;
  --bb-radius-md: 0px;
  --bb-radius-lg: 0px;
  --bb-radius-pill: 0px;
}

body .btn,
body button,
body input[type="button"],
body input[type="submit"],
body input[type="reset"],
body .form-control,
body .form-select,
body input:not([type="radio"]),
body select,
body textarea,
body .input-group,
body .input-group-text,
body .dropdown-menu,
body .modal-content,
body .card,
body .list-group,
body .list-group-item,
body .alert,
body .progress,
body .progress-bar,
body .question-container,
body .question-wrapper,
body .question,
body .ls-question,
body .sortable-item,
body .sortable-rank,
body .sortable-block,
body .bb-star-rating-label,
body .bb-widget-star-button {
  border-radius: 0 !important;
}

body input[type="radio"],
body .radio label::before,
body .ls-radio label::before,
body .radio-item label::before,
body .answer-item input[type="radio"] + label::before {
  border-radius: 50% !important;
}

body .submit-wrapper,
body [class*="submitwrapper"] {
  max-inline-size: 720px;
  margin-inline: auto;
  color: var(--berlin-black) !important;
  background: var(--berlin-white) !important;
}

body [class*="submitwrappertext"] {
  padding: 24px;
  color: var(--berlin-black) !important;
  background: var(--berlin-white) !important;
  border: 1px solid var(--berlin-grey-300);
  border-left: 6px solid var(--berlin-success);
}

body [class*="submitwrapper"] p,
body [class*="submitwrapper"] div,
body [class*="submitwrappertext"] {
  color: var(--berlin-black) !important;
}

body [class*="submitwrappertextHeading"],
body #survey-completed-heading {
  margin: 8px 0 10px;
  color: var(--berlin-black) !important;
  font-size: clamp(1.75rem, 3vw, 2.25rem);
  font-weight: 700;
  line-height: 1.2;
}

body [class*="submitwrappertextContent"] {
  margin: 0;
  color: var(--berlin-black) !important;
  font-size: 1.125rem;
  line-height: 1.5;
}

body .bb-success-icon {
  display: inline-block;
  color: var(--berlin-success) !important;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
}

#limesurvey .bb-ranking-color-list *,
body .bb-ranking-color-list *,
#limesurvey .bb-ranking-color-normalized,
body .bb-ranking-color-normalized,
#limesurvey .select-sortable-lists .sortable-item,
body .select-sortable-lists .sortable-item,
#limesurvey .ranking-advanced-style .sortable-rank,
body .ranking-advanced-style .sortable-rank,
#limesurvey .ranking-advanced-style .sortable-block,
body .ranking-advanced-style .sortable-block {
  --ls-success: var(--berlin-red) !important;
  --bs-success: var(--berlin-red) !important;
  --bs-success-rgb: 228, 4, 34 !important;
  border-color: var(--berlin-grey-700) !important;
  outline-color: var(--berlin-focus) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

#limesurvey .bb-ranking-color-list .selector__dragHandle,
body .bb-ranking-color-list .selector__dragHandle,
#limesurvey .bb-ranking-color-list .selector__index_row,
body .bb-ranking-color-list .selector__index_row {
  color: var(--berlin-grey-700) !important;
  border: 0 !important;
}

#limesurvey .bb-ranking-color-normalized:focus,
#limesurvey .bb-ranking-color-normalized:focus-within,
body .bb-ranking-color-normalized:focus,
body .bb-ranking-color-normalized:focus-within,
#limesurvey .sortable-item:focus,
#limesurvey .sortable-item:focus-within,
body .sortable-item:focus,
body .sortable-item:focus-within {
  border-color: var(--berlin-red) !important;
  outline: 3px solid var(--berlin-focus) !important;
  outline-offset: 2px;
}

#limesurvey .ranking-sorted-items .sortable-item,
body .ranking-sorted-items .sortable-item,
#limesurvey .ranking-advanced-sorted-items .sortable-item,
body .ranking-advanced-sorted-items .sortable-item {
  border-color: var(--berlin-red) !important;
}

#limesurvey .bb-star-face-svg,
body .bb-star-face-svg,
#limesurvey .bb-widget-star-button .bb-star-face-svg,
body .bb-widget-star-button .bb-star-face-svg {
  filter: none !important;
  transform: none !important;
}

#limesurvey .bb-star-rating-label,
body .bb-star-rating-label,
#limesurvey .bb-widget-star-button,
body .bb-widget-star-button,
#limesurvey .bb-star-rating-label:hover,
body .bb-star-rating-label:hover,
#limesurvey .bb-widget-star-button:hover,
body .bb-widget-star-button:hover {
  background: var(--berlin-white) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}

#limesurvey .bb-star-rating-label.bb-star-rating-label-filled,
body .bb-star-rating-label.bb-star-rating-label-filled,
#limesurvey .bb-widget-star-button-filled,
body .bb-widget-star-button-filled,
#limesurvey .bb-widget-star-button-selected,
body .bb-widget-star-button-selected {
  --bb-star-fill-start: var(--berlin-red) !important;
  --bb-star-fill-mid: var(--berlin-red) !important;
  --bb-star-fill-end: var(--berlin-red) !important;
  box-shadow: inset 0 0 0 2px var(--berlin-red) !important;
}

body .question-container:hover,
body .question-wrapper:hover,
body .question:hover,
body .ls-question:hover,
body .btn:hover,
body button:hover {
  transform: none !important;
}

body .text-danger {
  color: var(--berlin-error) !important;
}

@media (max-width: 767px) {
  body [class*="submitwrappertext"] {
    padding: 20px 16px;
  }
}

@media (max-width: 575px) {
  .radio label,
  .checkbox label,
  .ls-radio label,
  .ls-checkbox label {
    padding: var(--bb-space-3);
  }

  body .btn.btn-lg {
    min-height: 50px;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}

@media print {
  body {
    padding-top: 0 !important;
    color: #000 !important;
    background: #fff !important;
  }

  body .navbar,
  .bb-progress-wrapper,
  .navigator,
  .survey-footer {
    display: none !important;
  }

  body .question-container,
  body [class*="questioncontainer"],
  body .row.question {
    box-shadow: none !important;
    border: 1px solid #000 !important;
  }
}

/* 2.1.8: Normalize remaining LimeSurvey/Bootstrap selection colors.
   LimeSurvey ships several question types with their own green states. These
   selectors keep selected answers on the active BerlinCD palette. */

#limesurvey input[type="radio"],
#limesurvey input[type="checkbox"],
body input[type="radio"],
body input[type="checkbox"],
#limesurvey .form-check-input {
  accent-color: var(--bb-accent-strong) !important;
}

#limesurvey .form-check-input:checked,
body .form-check-input:checked {
  background-color: var(--bb-accent-strong) !important;
  border-color: var(--bb-accent-strong) !important;
}

#limesurvey input[type="radio"]:checked,
#limesurvey input[type="checkbox"]:checked,
body input[type="radio"]:checked,
body input[type="checkbox"]:checked {
  accent-color: var(--bb-accent-strong) !important;
  border-color: var(--bb-accent-strong) !important;
}

#limesurvey .radio input[type="radio"]:checked + label,
#limesurvey .ls-radio input[type="radio"]:checked + label,
#limesurvey .answer-item input[type="radio"]:checked + label,
#limesurvey .checkbox input[type="checkbox"]:checked + label,
#limesurvey .ls-checkbox input[type="checkbox"]:checked + label,
#limesurvey .answer-item input[type="checkbox"]:checked + label,
#limesurvey .radio input[type="radio"]:checked ~ label,
#limesurvey .ls-radio input[type="radio"]:checked ~ label,
#limesurvey .checkbox input[type="checkbox"]:checked ~ label,
#limesurvey .ls-checkbox input[type="checkbox"]:checked ~ label {
  color: var(--bb-accent-strong) !important;
}

#limesurvey .question-answers table.bb-matrix-table input[type="radio"],
#limesurvey .question-answers table.bb-matrix-table input[type="checkbox"] {
  accent-color: var(--bb-accent-strong) !important;
}

#limesurvey .question-answers table.bb-matrix-table tbody tr.bb-matrix-row-selected {
  background: var(--bb-surface-muted) !important;
}

#limesurvey .question-answers table.bb-matrix-table td.bb-matrix-choice-selected,
#limesurvey .question-answers table.bb-matrix-table tbody td.bb-matrix-choice-selected {
  background: var(--bb-surface-muted) !important;
  border-color: var(--bb-border-strong) !important;
  box-shadow: inset 0 0 0 2px var(--bb-accent-strong) !important;
}

#limesurvey .question-answers table.bb-matrix-table td.bb-matrix-choice-selected *,
#limesurvey .question-answers table.bb-matrix-table tbody td.bb-matrix-choice-selected * {
  color: var(--bb-primary) !important;
}

#limesurvey .question-answers ul.sortable li,
#limesurvey .question-answers ul.answers-list.sortable li,
#limesurvey .question-answers .sortable-choice,
#limesurvey .question-answers .sortable-rank,
#limesurvey .question-answers .ui-sortable li,
#limesurvey .question-answers .ui-sortable .choice,
#limesurvey .question-answers .ui-sortable .answer-item,
#limesurvey .question-answers .rank-list li,
#limesurvey .question-answers .ranking-list li {
  border-color: var(--bb-border-strong) !important;
  color: var(--bb-text) !important;
  background: var(--bb-surface) !important;
}

#limesurvey .question-answers ul.sortable li:hover,
#limesurvey .question-answers ul.answers-list.sortable li:hover,
#limesurvey .question-answers .ui-sortable li:hover,
#limesurvey .question-answers .sortable-choice:hover,
#limesurvey .question-answers .sortable-rank:hover {
  border-color: var(--bb-primary) !important;
  background: var(--bb-surface-muted) !important;
}

/* 2.1.9/2.1.12: Radio selection states use the defined ITDZ green.
   The color is intentionally aligned to the active BerlinCD palette. */

.logo-container img.logo {
  max-height: 64px;
  min-height: 48px;
}

body .navbar {
  min-height: 76px;
}

body {
  padding-top: 84px;
}

#limesurvey input[type="radio"],
body input[type="radio"] {
  appearance: none !important;
  -webkit-appearance: none !important;
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  border: 2px solid #6B7280 !important;
  border-radius: 50% !important;
  background: #fff !important;
  display: inline-grid !important;
  place-content: center !important;
  accent-color: var(--bb-accent-strong) !important;
}

#limesurvey input[type="radio"]::before,
body input[type="radio"]::before {
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--bb-accent-strong);
  transform: scale(0);
  transition: transform .12s ease-in-out;
}

#limesurvey input[type="radio"]:checked,
body input[type="radio"]:checked {
  border-color: var(--bb-accent-strong) !important;
  background: #fff !important;
  accent-color: var(--bb-accent-strong) !important;
}

#limesurvey input[type="radio"]:checked::before,
body input[type="radio"]:checked::before {
  transform: scale(1);
}

#limesurvey .form-check-input[type="radio"]:checked,
body .form-check-input[type="radio"]:checked {
  background-color: #fff !important;
  border-color: var(--bb-accent-strong) !important;
  background-image: none !important;
}

#limesurvey .radio input[type="radio"]:checked + label,
#limesurvey .ls-radio input[type="radio"]:checked + label,
#limesurvey .answer-item input[type="radio"]:checked + label,
#limesurvey .radio input[type="radio"]:checked ~ label,
#limesurvey .ls-radio input[type="radio"]:checked ~ label,
#limesurvey .radio input[type="radio"]:checked ~ span,
#limesurvey .ls-radio input[type="radio"]:checked ~ span,
#limesurvey .answer-item input[type="radio"]:checked + label span {
  color: var(--bb-accent-strong) !important;
}

#limesurvey .question-answers table.bb-matrix-table td.bb-matrix-choice-selected,
#limesurvey .question-answers table.bb-matrix-table tbody td.bb-matrix-choice-selected {
  background: var(--bb-surface-muted) !important;
  border-color: var(--bb-accent-strong) !important;
  box-shadow: inset 0 0 0 2px var(--bb-accent-strong) !important;
}

#limesurvey .question-answers ul.sortable li,
#limesurvey .question-answers ul.answers-list.sortable li,
#limesurvey .question-answers .ui-sortable li,
#limesurvey .question-answers .ui-sortable .choice,
#limesurvey .question-answers .ui-sortable .answer-item,
#limesurvey .question-answers .rank-list li,
#limesurvey .question-answers .ranking-list li {
  border-color: var(--bb-border-strong) !important;
  box-shadow: none !important;
}

#limesurvey .question-answers ul.sortable li:hover,
#limesurvey .question-answers ul.answers-list.sortable li:hover,
#limesurvey .question-answers .ui-sortable li:hover,
#limesurvey .question-answers .sortable-choice:hover,
#limesurvey .question-answers .sortable-rank:hover,
#limesurvey .question-answers .ui-sortable li:focus-within {
  border-color: var(--bb-primary) !important;
  background: var(--bb-surface-muted) !important;
}

/* 2.1.10: LimeSurvey/awesome-bootstrap-checkbox radio dots.
   Some answer lists hide the native input and paint the radio through label
   pseudo-elements. Override those last so no inherited accent dot remains. */

#limesurvey .radio input[type="radio"]:checked + label::before,
#limesurvey .ls-radio input[type="radio"]:checked + label::before,
#limesurvey .radio-item input[type="radio"]:checked + label::before,
#limesurvey .answer-item input[type="radio"]:checked + label::before,
#limesurvey .ls-answers input[type="radio"]:checked + label::before,
body .radio input[type="radio"]:checked + label::before,
body .ls-radio input[type="radio"]:checked + label::before,
body .radio-item input[type="radio"]:checked + label::before,
body .answer-item input[type="radio"]:checked + label::before,
body .ls-answers input[type="radio"]:checked + label::before {
  border-color: var(--bb-accent-strong) !important;
  background-color: #fff !important;
  background-image: none !important;
}

#limesurvey .radio input[type="radio"]:checked + label::after,
#limesurvey .ls-radio input[type="radio"]:checked + label::after,
#limesurvey .radio-item input[type="radio"]:checked + label::after,
#limesurvey .answer-item input[type="radio"]:checked + label::after,
#limesurvey .ls-answers input[type="radio"]:checked + label::after,
body .radio input[type="radio"]:checked + label::after,
body .ls-radio input[type="radio"]:checked + label::after,
body .radio-item input[type="radio"]:checked + label::after,
body .answer-item input[type="radio"]:checked + label::after,
body .ls-answers input[type="radio"]:checked + label::after {
  background-color: var(--bb-accent-strong) !important;
  border-color: var(--bb-accent-strong) !important;
  color: var(--bb-accent-strong) !important;
}

#limesurvey .radio label::after,
#limesurvey .ls-radio label::after,
#limesurvey .radio-item label::after,
#limesurvey .answer-item label::after,
#limesurvey .ls-answers label::after,
body .radio label::after,
body .ls-radio label::after,
body .radio-item label::after,
body .answer-item label::after,
body .ls-answers label::after {
  background-color: var(--bb-accent-strong) !important;
}

/* 2.1.11: Keep checkbox ticks neutral. The radio pseudo-element override above
   must not color checkbox checkmarks blue. */

#limesurvey .checkbox input[type="checkbox"]:checked + label::before,
#limesurvey .ls-checkbox input[type="checkbox"]:checked + label::before,
#limesurvey .checkbox-item input[type="checkbox"]:checked + label::before,
#limesurvey .answer-item input[type="checkbox"]:checked + label::before,
#limesurvey .ls-answers input[type="checkbox"]:checked + label::before,
body .checkbox input[type="checkbox"]:checked + label::before,
body .ls-checkbox input[type="checkbox"]:checked + label::before,
body .checkbox-item input[type="checkbox"]:checked + label::before,
body .answer-item input[type="checkbox"]:checked + label::before,
body .ls-answers input[type="checkbox"]:checked + label::before {
  border-color: var(--bb-accent-strong) !important;
  background-color: var(--bb-accent-strong) !important;
}

#limesurvey .checkbox input[type="checkbox"]:checked + label::after,
#limesurvey .ls-checkbox input[type="checkbox"]:checked + label::after,
#limesurvey .checkbox-item input[type="checkbox"]:checked + label::after,
#limesurvey .answer-item input[type="checkbox"]:checked + label::after,
#limesurvey .ls-answers input[type="checkbox"]:checked + label::after,
body .checkbox input[type="checkbox"]:checked + label::after,
body .ls-checkbox input[type="checkbox"]:checked + label::after,
body .checkbox-item input[type="checkbox"]:checked + label::after,
body .answer-item input[type="checkbox"]:checked + label::after,
body .ls-answers input[type="checkbox"]:checked + label::after {
  color: #fff !important;
  background-color: transparent !important;
  border-color: #fff !important;
}

#limesurvey .checkbox .ri-check-line,
#limesurvey .checkbox .ri-check-fill,
#limesurvey .checkbox .fa-check,
#limesurvey .ls-checkbox .ri-check-line,
#limesurvey .ls-checkbox .ri-check-fill,
#limesurvey .ls-checkbox .fa-check,
#limesurvey .answer-item .ri-check-line,
#limesurvey .answer-item .ri-check-fill,
#limesurvey .answer-item .fa-check,
body .checkbox .ri-check-line,
body .checkbox .ri-check-fill,
body .checkbox .fa-check,
body .ls-checkbox .ri-check-line,
body .ls-checkbox .ri-check-fill,
body .ls-checkbox .fa-check,
body .answer-item .ri-check-line,
body .answer-item .ri-check-fill,
body .answer-item .fa-check {
  color: #fff !important;
}

/* 2.1.13: Ranking/sortable item borders use the theme accent, not LimeSurvey defaults. */

#limesurvey ul.sortable li,
#limesurvey ul.answers-list.sortable li,
#limesurvey .ui-sortable li,
#limesurvey .sortable-choice,
#limesurvey .sortable-rank,
#limesurvey .rank-list li,
#limesurvey .ranking-list li,
#limesurvey .ranking-answers li,
#limesurvey .ranking-sorted li,
#limesurvey .dragDropTable .choice,
#limesurvey .dragDropTable .answer-item,
body ul.sortable li,
body ul.answers-list.sortable li,
body .ui-sortable li,
body .sortable-choice,
body .sortable-rank,
body .rank-list li,
body .ranking-list li,
body .ranking-answers li,
body .ranking-sorted li,
body .dragDropTable .choice,
body .dragDropTable .answer-item {
  border: 1px solid var(--bb-accent) !important;
  border-color: var(--bb-accent) !important;
}

#limesurvey ul.sortable li:hover,
#limesurvey ul.answers-list.sortable li:hover,
#limesurvey .ui-sortable li:hover,
#limesurvey .sortable-choice:hover,
#limesurvey .sortable-rank:hover,
#limesurvey .rank-list li:hover,
#limesurvey .ranking-list li:hover,
body ul.sortable li:hover,
body ul.answers-list.sortable li:hover,
body .ui-sortable li:hover,
body .sortable-choice:hover,
body .sortable-rank:hover,
body .rank-list li:hover,
body .ranking-list li:hover {
  border-color: var(--bb-accent) !important;
  background: var(--bb-surface-muted) !important;
}

/* 2.1.14: Fallback for LimeSurvey inline ranking borders. */

#limesurvey .bb-ranking-color-normalized,
body .bb-ranking-color-normalized,
#limesurvey [style*="#00B050"],
#limesurvey [style*="#00b050"],
#limesurvey [style*="#00A650"],
#limesurvey [style*="#00a650"],
#limesurvey [style*="rgb(0, 176, 80)"],
#limesurvey [style*="rgb(0,176,80)"],
body [style*="#00B050"],
body [style*="#00b050"],
body [style*="#00A650"],
body [style*="#00a650"],
body [style*="rgb(0, 176, 80)"],
body [style*="rgb(0,176,80)"] {
  border-color: var(--bb-accent-strong) !important;
}

/* 2.1.15: More aggressive sortable border fallback.
   The visible green line can sit on inner drag handles/items, not only on li. */

#limesurvey .bb-ranking-color-list *,
body .bb-ranking-color-list *,
#limesurvey ul.sortable *,
#limesurvey ul.answers-list.sortable *,
body ul.sortable *,
body ul.answers-list.sortable * {
  --ls-success: var(--bb-accent) !important;
  --bs-success: var(--bb-accent) !important;
  --bs-success-rgb: 228, 4, 34 !important;
}

#limesurvey .bb-ranking-color-list [style*="border"],
#limesurvey ul.sortable [style*="border"],
#limesurvey ul.answers-list.sortable [style*="border"],
body .bb-ranking-color-list [style*="border"],
body ul.sortable [style*="border"],
body ul.answers-list.sortable [style*="border"] {
  border-color: var(--bb-accent) !important;
  outline-color: var(--bb-accent) !important;
}

#limesurvey .bb-ranking-color-list li,
#limesurvey .bb-ranking-color-list li > *,
#limesurvey ul.sortable li,
#limesurvey ul.sortable li > *,
#limesurvey ul.answers-list.sortable li,
#limesurvey ul.answers-list.sortable li > *,
body .bb-ranking-color-list li,
body .bb-ranking-color-list li > *,
body ul.sortable li,
body ul.sortable li > *,
body ul.answers-list.sortable li,
body ul.answers-list.sortable li > * {
  border-color: var(--bb-accent) !important;
}

/* 2.1.16: Direct override for inherited Fruity/LimeSurvey accents. */

#limesurvey .bb-ranking-color-normalized,
#limesurvey .bb-ranking-color-list li,
#limesurvey .bb-ranking-color-list li > *,
#limesurvey ul.sortable li,
#limesurvey ul.sortable li > *,
#limesurvey ul.answers-list.sortable li,
#limesurvey ul.answers-list.sortable li > *,
body .bb-ranking-color-normalized,
body .bb-ranking-color-list li,
body .bb-ranking-color-list li > *,
body ul.sortable li,
body ul.sortable li > *,
body ul.answers-list.sortable li,
body ul.answers-list.sortable li > * {
  border-color: var(--bb-accent) !important;
}

/* 2.1.17: LimeSurvey CE 6 / Fruity TwentyThree ranking question structure.
   Fruity sets its own accent on .select-sortable-lists ... .sortable-item, so target
   the real generated DOM instead of legacy ul.sortable only. */

#limesurvey .select-sortable-lists:not(.ranking-advanced-style) .ranking-sorted-items .sortable-item,
#limesurvey .select-sortable-lists:not(.ranking-advanced-style) .ranking-sorted-items .list-group-item,
#limesurvey .select-sortable-lists:not(.ranking-advanced-style) .ranking-sorted-items .ls-choice,
#limesurvey .select-sortable-lists:not(.ranking-advanced-style) .ranking-sorted-items .sortable-block,
#limesurvey .ranking-advanced-style .sortable-rank,
#limesurvey .ranking-advanced-style .ranking-advanced-sorted-items .sortable-item,
#limesurvey .ranking-advanced-style .ranking-advanced-sorted-items .list-group-item,
#limesurvey .ranking-advanced-style .ranking-advanced-sorted-items .ls-choice,
#limesurvey .ranking-advanced-style .ranking-advanced-sorted-items .sortable-block,
body .select-sortable-lists:not(.ranking-advanced-style) .ranking-sorted-items .sortable-item,
body .select-sortable-lists:not(.ranking-advanced-style) .ranking-sorted-items .list-group-item,
body .select-sortable-lists:not(.ranking-advanced-style) .ranking-sorted-items .ls-choice,
body .select-sortable-lists:not(.ranking-advanced-style) .ranking-sorted-items .sortable-block,
body .ranking-advanced-style .sortable-rank,
body .ranking-advanced-style .ranking-advanced-sorted-items .sortable-item,
body .ranking-advanced-style .ranking-advanced-sorted-items .list-group-item,
body .ranking-advanced-style .ranking-advanced-sorted-items .ls-choice,
body .ranking-advanced-style .ranking-advanced-sorted-items .sortable-block {
  border: 1px solid var(--bb-accent) !important;
  border-color: var(--bb-accent) !important;
  color: var(--bb-text) !important;
  box-shadow: none !important;
}

#limesurvey .ranking-advanced-style .sortable-rank,
#limesurvey .ranking-advanced-style .ranking-advanced-sorted-items .sortable-item,
body .ranking-advanced-style .sortable-rank,
body .ranking-advanced-style .ranking-advanced-sorted-items .sortable-item {
  border-width: 2px !important;
}

#limesurvey .ranking-advanced-style .sortable-rank .selector__dragHandle.d-none,
#limesurvey .ranking-advanced-style .sortable-rank .selector__index_row,
#limesurvey .ranking-advanced-style .ranking-advanced-sorted-items .sortable-item .selector__dragHandle.d-none,
#limesurvey .ranking-advanced-style .ranking-advanced-sorted-items .sortable-item .selector__index_row,
body .ranking-advanced-style .sortable-rank .selector__dragHandle.d-none,
body .ranking-advanced-style .sortable-rank .selector__index_row,
body .ranking-advanced-style .ranking-advanced-sorted-items .sortable-item .selector__dragHandle.d-none,
body .ranking-advanced-style .ranking-advanced-sorted-items .sortable-item .selector__index_row {
  color: var(--bb-accent) !important;
  border: 0 !important;
}

/* 2.1.18: Modern 5-point star rating.
   The native radio inputs remain in the DOM; these rules only replace the
   visual affordance for LimeSurvey's .choice-5-pt-radio question type. */

#limesurvey .bb-star-rating-question .bb-star-rating-list,
body .bb-star-rating-question .bb-star-rating-list,
#limesurvey .choice-5-pt-radio .list-group-horizontal.bb-star-rating-list,
body .choice-5-pt-radio .list-group-horizontal.bb-star-rating-list {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(68px, 1fr)) minmax(128px, 1.25fr);
  gap: 10px;
  align-items: stretch;
  margin-block: 8px 4px;
  padding: 0;
}

#limesurvey .bb-star-rating-item,
body .bb-star-rating-item {
  --bb-rating-color: var(--bb-accent);
  display: block !important;
  position: relative;
  min-width: 0;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

#limesurvey .bb-star-rating-item--1,
body .bb-star-rating-item--1 {
  --bb-rating-color: var(--bb-accent);
}

#limesurvey .bb-star-rating-item--2,
body .bb-star-rating-item--2 {
  --bb-rating-color: var(--bb-accent);
}

#limesurvey .bb-star-rating-item--3,
body .bb-star-rating-item--3 {
  --bb-rating-color: var(--bb-accent);
}

#limesurvey .bb-star-rating-item--4,
body .bb-star-rating-item--4 {
  --bb-rating-color: var(--berlin-red);
}

#limesurvey .bb-star-rating-item--5,
body .bb-star-rating-item--5 {
  --bb-rating-color: var(--bb-accent);
}

#limesurvey .bb-star-rating-item input[type="radio"],
body .bb-star-rating-item input[type="radio"],
#limesurvey .bb-star-rating-label input[type="radio"],
body .bb-star-rating-label input[type="radio"] {
  position: absolute !important;
  inline-size: 1px !important;
  block-size: 1px !important;
  opacity: 0 !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
}

#limesurvey .bb-star-rating-label,
body .bb-star-rating-label {
  --bb-star-fill-start: #f7f8fa;
  --bb-star-fill-mid: #d9dde3;
  --bb-star-fill-end: #a8b0ba;
  --bb-star-stroke: #4a5563;
  display: flex !important;
  min-block-size: 112px;
  inline-size: 100%;
  padding: 10px 8px !important;
  border: 1px solid var(--bb-border) !important;
  border-radius: 12px !important;
  background:
    radial-gradient(circle at 50% 26%, color-mix(in srgb, var(--bb-rating-color) 6%, transparent), transparent 42%),
    #fff !important;
  color: var(--bb-text) !important;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
  cursor: pointer;
  text-align: center;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 8px;
  font-weight: 700;
  line-height: 1.25;
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease, background-color 160ms ease;
}

#limesurvey .bb-star-rating-label::before,
#limesurvey .bb-star-rating-label::after,
body .bb-star-rating-label::before,
body .bb-star-rating-label::after {
  content: none !important;
  display: none !important;
}

#limesurvey .bb-star-rating-label:hover,
body .bb-star-rating-label:hover {
  border-color: var(--bb-rating-color) !important;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.12);
  transform: translateY(-2px);
}

#limesurvey .bb-star-rating-label:has(input[type="radio"]:focus-visible),
#limesurvey .bb-star-rating-item input[type="radio"]:focus-visible + .bb-star-rating-label,
body .bb-star-rating-label:has(input[type="radio"]:focus-visible),
body .bb-star-rating-item input[type="radio"]:focus-visible + .bb-star-rating-label {
  outline: 3px solid rgba(0, 74, 143, 0.34) !important;
  outline-offset: 3px;
  border-color: var(--bb-primary) !important;
}

#limesurvey .bb-star-rating-label:has(input[type="radio"]:checked),
#limesurvey .bb-star-rating-label.bb-option-selected,
#limesurvey .bb-star-rating-label.bb-star-rating-label-filled,
#limesurvey .bb-star-rating-item input[type="radio"]:checked + .bb-star-rating-label,
body .bb-star-rating-label:has(input[type="radio"]:checked),
body .bb-star-rating-label.bb-option-selected,
body .bb-star-rating-label.bb-star-rating-label-filled,
body .bb-star-rating-item input[type="radio"]:checked + .bb-star-rating-label {
  --bb-star-fill-start: #ffffff;
  --bb-star-fill-mid: #e40422;
  --bb-star-fill-end: #9b0000;
  --bb-star-stroke: #000000;
  border-color: var(--bb-rating-color) !important;
  background: color-mix(in srgb, var(--bb-rating-color) 8%, #fff) !important;
  box-shadow:
    inset 0 0 0 2px var(--bb-rating-color),
    0 8px 18px rgba(15, 23, 42, 0.10);
}

#limesurvey .bb-star-face,
body .bb-star-face {
  display: block;
  color: var(--bb-rating-color);
  line-height: 0;
}

#limesurvey .bb-star-face-svg,
body .bb-star-face-svg {
  display: block;
  inline-size: clamp(50px, 5.4vw, 76px);
  block-size: auto;
  overflow: visible;
  filter: drop-shadow(3px 3px 0 rgba(15, 23, 42, 0.18));
}

#limesurvey .bb-star-outline,
body .bb-star-outline {
  fill: color-mix(in srgb, var(--bb-rating-color) 8%, #fff);
  stroke: currentColor;
  stroke-width: 6.5;
  stroke-linejoin: round;
}

#limesurvey .bb-star-shadow,
body .bb-star-shadow {
  fill: rgba(0, 0, 0, 0.82);
  transform: translate(6px, 6px);
}

#limesurvey .bb-star-white-edge,
body .bb-star-white-edge {
  fill: none;
  stroke: #fff;
  stroke-width: 7;
  stroke-linejoin: round;
}

#limesurvey .bb-star-gradient-fill,
body .bb-star-gradient-fill {
  stroke: var(--bb-star-stroke, #4a5563);
  stroke-width: 2.7;
  stroke-linejoin: round;
}

#limesurvey .bb-star-inner-shine,
body .bb-star-inner-shine {
  mix-blend-mode: screen;
}

#limesurvey .bb-star-spark-line,
body .bb-star-spark-line {
  fill: none;
  stroke: rgba(255, 255, 255, 0.34);
  stroke-width: 1.5;
  stroke-linecap: round;
}

#limesurvey .bb-star-eye,
body .bb-star-eye {
  fill: currentColor;
}

#limesurvey .bb-star-mouth,
body .bb-star-mouth {
  fill: none;
  stroke: currentColor;
  stroke-width: 6;
  stroke-linecap: round;
}

#limesurvey .bb-star-rating-label--no-answer,
body .bb-star-rating-label--no-answer {
  --bb-rating-color: var(--bb-primary);
  gap: 6px;
  min-inline-size: 128px;
  color: var(--bb-primary) !important;
  font-size: 0.9rem;
  font-weight: 800;
  white-space: nowrap;
}

#limesurvey .bb-star-rating-label--no-answer span:last-child,
body .bb-star-rating-label--no-answer span:last-child {
  white-space: nowrap;
}

#limesurvey .bb-star-rating-label--no-answer.bb-star-rating-label-no-answer-selected,
body .bb-star-rating-label--no-answer.bb-star-rating-label-no-answer-selected {
  border-color: var(--bb-primary) !important;
  background: color-mix(in srgb, var(--bb-primary) 7%, #fff) !important;
  box-shadow:
    inset 0 0 0 2px var(--bb-primary),
    0 8px 18px rgba(15, 23, 42, 0.10);
}

@media (max-width: 767px) {
  #limesurvey .bb-star-rating-question .bb-star-rating-list,
  body .bb-star-rating-question .bb-star-rating-list,
  #limesurvey .choice-5-pt-radio .list-group-horizontal.bb-star-rating-list,
  body .choice-5-pt-radio .list-group-horizontal.bb-star-rating-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  #limesurvey .bb-star-rating-label,
  body .bb-star-rating-label {
    min-block-size: 132px;
  }
}

@media (max-width: 420px) {
  #limesurvey .bb-star-rating-question .bb-star-rating-list,
  body .bb-star-rating-question .bb-star-rating-list,
  #limesurvey .choice-5-pt-radio .list-group-horizontal.bb-star-rating-list,
  body .choice-5-pt-radio .list-group-horizontal.bb-star-rating-list {
    grid-template-columns: 1fr;
  }
}

/* 2.1.19: Rendered star widget fallback.
   Some LimeSurvey star questions are delivered by a question theme/plugin and
   do not use .choice-5-pt-radio. In that case JavaScript detects the rendered
   star icons and replaces only the visible widget row. */

#limesurvey .bb-native-star-widget-hidden,
body .bb-native-star-widget-hidden {
  position: absolute !important;
  inline-size: 1px !important;
  block-size: 1px !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
}

#limesurvey .bb-widget-star-rating-list,
body .bb-widget-star-rating-list {
  display: grid;
  grid-template-columns: repeat(5, minmax(68px, 1fr)) minmax(128px, 1.25fr);
  gap: 10px;
  align-items: stretch;
  max-inline-size: 680px;
  margin-block: 18px 6px;
}

#limesurvey .bb-widget-star-button,
body .bb-widget-star-button {
  --bb-rating-color: var(--bb-accent);
  --bb-star-fill-start: #f7f8fa;
  --bb-star-fill-mid: #d9dde3;
  --bb-star-fill-end: #a8b0ba;
  --bb-star-stroke: #4a5563;
  display: flex;
  min-block-size: 112px;
  padding: 10px 8px;
  border: 1px solid var(--bb-border);
  border-radius: 12px;
  background:
    radial-gradient(circle at 50% 28%, color-mix(in srgb, var(--bb-rating-color) 6%, transparent), transparent 42%),
    #fff;
  color: var(--bb-rating-color);
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease, background-color 160ms ease;
}

#limesurvey .bb-widget-star-button:hover,
body .bb-widget-star-button:hover {
  border-color: var(--bb-rating-color);
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.12);
  transform: translateY(-2px) rotate(var(--bb-star-tilt, 0deg));
}

#limesurvey .bb-widget-star-button:focus-visible,
body .bb-widget-star-button:focus-visible {
  outline: 3px solid rgba(0, 74, 143, 0.34);
  outline-offset: 3px;
  border-color: var(--bb-primary);
}

#limesurvey .bb-widget-star-button-selected,
body .bb-widget-star-button-selected,
#limesurvey .bb-widget-star-button-filled,
body .bb-widget-star-button-filled {
  --bb-star-fill-start: #ffffff;
  --bb-star-fill-mid: #e40422;
  --bb-star-fill-end: #9b0000;
  --bb-star-stroke: #000000;
}

#limesurvey .bb-widget-star-button-selected,
body .bb-widget-star-button-selected {
  border-color: var(--bb-rating-color);
  background: color-mix(in srgb, var(--bb-rating-color) 8%, #fff);
  box-shadow:
    inset 0 0 0 2px var(--bb-rating-color),
    0 8px 18px rgba(15, 23, 42, 0.10);
}

#limesurvey .bb-widget-star-button .bb-star-face-svg,
body .bb-widget-star-button .bb-star-face-svg {
  inline-size: clamp(50px, 5.4vw, 76px);
  transform: rotate(var(--bb-star-tilt, 0deg));
  filter: drop-shadow(3px 3px 0 rgba(15, 23, 42, 0.18));
}

#limesurvey .bb-widget-star-button.bb-star-rating-item--1,
body .bb-widget-star-button.bb-star-rating-item--1 {
  --bb-star-tilt: -5deg;
}

#limesurvey .bb-widget-star-button.bb-star-rating-item--2,
body .bb-widget-star-button.bb-star-rating-item--2 {
  --bb-star-tilt: 4deg;
}

#limesurvey .bb-widget-star-button.bb-star-rating-item--3,
body .bb-widget-star-button.bb-star-rating-item--3 {
  --bb-star-tilt: -2deg;
}

#limesurvey .bb-widget-star-button.bb-star-rating-item--4,
body .bb-widget-star-button.bb-star-rating-item--4 {
  --bb-star-tilt: 3deg;
}

#limesurvey .bb-widget-star-button.bb-star-rating-item--5,
body .bb-widget-star-button.bb-star-rating-item--5 {
  --bb-star-tilt: -3deg;
}

#limesurvey .bb-widget-star-no-answer,
body .bb-widget-star-no-answer {
  --bb-rating-color: var(--bb-primary);
  gap: 6px;
  min-inline-size: 116px;
  color: var(--bb-primary);
  font-size: 0.9rem;
  font-weight: 800;
  line-height: 1.1;
  white-space: nowrap;
}

#limesurvey .bb-widget-star-no-answer span:last-child,
body .bb-widget-star-no-answer span:last-child {
  white-space: nowrap;
}

#limesurvey .bb-widget-star-no-answer-icon,
body .bb-widget-star-no-answer-icon {
  display: none !important;
}

#limesurvey .bb-star-rating-label-no-answer-selected .bb-widget-star-no-answer-icon::before,
body .bb-star-rating-label-no-answer-selected .bb-widget-star-no-answer-icon::before,
#limesurvey .bb-widget-star-no-answer.bb-widget-star-button-selected .bb-widget-star-no-answer-icon::before,
body .bb-widget-star-no-answer.bb-widget-star-button-selected .bb-widget-star-no-answer-icon::before {
  content: none;
  display: none;
}

#limesurvey .bb-widget-star-no-answer-icon::after,
body .bb-widget-star-no-answer-icon::after {
  content: none;
  display: none;
}

/* =========================================================
   2.2.0 Berlin CD fork overrides
   Brand basis: Berlin red, black and white; restrained public-service UI.
   ========================================================= */

:root {
  --berlin-red: #E40422;
  --berlin-red-dark: #9D0017;
  --berlin-black: #000000;
  --berlin-white: #FFFFFF;
  --berlin-grey-050: #FAFAFA;
  --berlin-grey-100: #F3F3F3;
  --berlin-grey-300: #D6D6D6;
  --berlin-grey-700: #565656;
}

body {
  background:
    linear-gradient(180deg, var(--berlin-white) 0, var(--berlin-grey-100) 320px, var(--berlin-grey-050) 100%) !important;
}

body .navbar {
  background: var(--berlin-white) !important;
  border-top: 6px solid var(--berlin-red) !important;
  border-bottom: 1px solid var(--berlin-black) !important;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .08) !important;
}

body h1,
body .survey-name,
body .survey-title,
body .survey-welcome h1,
body #welcome-container h1,
body .welcome-container h1,
body .group-title,
body .ls-group-name {
  color: var(--berlin-black) !important;
  font-weight: 800 !important;
}

body h1::after,
body .survey-name::after,
body .group-title::after {
  content: "";
  display: block;
  inline-size: 72px;
  block-size: 5px;
  margin-block-start: .35em;
  background: var(--berlin-red);
}

body .question-container,
body .question-wrapper,
body .question,
body .ls-question {
  border-color: var(--berlin-grey-300) !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .06), 0 16px 32px rgba(0, 0, 0, .06) !important;
}

body .question-container::before,
body .question-wrapper::before,
body .question::before,
body .ls-question::before {
  background: var(--berlin-red) !important;
}

body .btn-primary,
body button.btn-primary,
body input[type="submit"].btn-primary,
body #movenextbtn,
body #movesubmitbtn {
  color: var(--berlin-white) !important;
  background: var(--berlin-red) !important;
  border-color: var(--berlin-red) !important;
  box-shadow: 0 2px 0 var(--berlin-black) !important;
}

body .btn-primary:hover,
body button.btn-primary:hover,
body input[type="submit"].btn-primary:hover,
body #movenextbtn:hover,
body #movesubmitbtn:hover {
  background: var(--berlin-red-dark) !important;
  border-color: var(--berlin-red-dark) !important;
}

body .btn-outline-secondary,
body #moveprevbtn {
  color: var(--berlin-black) !important;
  background: var(--berlin-white) !important;
  border-color: var(--berlin-black) !important;
}

body .progress,
body .progress .progress {
  background: var(--berlin-grey-300) !important;
}

body .progress-bar,
body .ls-progress-bar,
body .progress .progress-bar {
  background: var(--berlin-red) !important;
}

#limesurvey .radio input[type="radio"]:checked + label::before,
#limesurvey .ls-radio input[type="radio"]:checked + label::before,
#limesurvey .radio-item input[type="radio"]:checked + label::before,
#limesurvey .answer-item input[type="radio"]:checked + label::before,
body .radio input[type="radio"]:checked + label::before,
body .ls-radio input[type="radio"]:checked + label::before,
body .radio-item input[type="radio"]:checked + label::before,
body .answer-item input[type="radio"]:checked + label::before,
#limesurvey .checkbox input[type="checkbox"]:checked + label::before,
#limesurvey .ls-checkbox input[type="checkbox"]:checked + label::before,
#limesurvey .checkbox-item input[type="checkbox"]:checked + label::before,
#limesurvey .answer-item input[type="checkbox"]:checked + label::before,
body .checkbox input[type="checkbox"]:checked + label::before,
body .ls-checkbox input[type="checkbox"]:checked + label::before,
body .checkbox-item input[type="checkbox"]:checked + label::before,
body .answer-item input[type="checkbox"]:checked + label::before {
  border-color: var(--berlin-red) !important;
  background-color: var(--berlin-red) !important;
}

#limesurvey .radio input[type="radio"]:checked + label::after,
#limesurvey .ls-radio input[type="radio"]:checked + label::after,
#limesurvey .radio-item input[type="radio"]:checked + label::after,
#limesurvey .answer-item input[type="radio"]:checked + label::after,
body .radio input[type="radio"]:checked + label::after,
body .ls-radio input[type="radio"]:checked + label::after,
body .radio-item input[type="radio"]:checked + label::after,
body .answer-item input[type="radio"]:checked + label::after {
  background-color: var(--berlin-white) !important;
}

#limesurvey .bb-star-rating-label:has(input[type="radio"]:checked),
#limesurvey .bb-star-rating-label.bb-option-selected,
#limesurvey .bb-star-rating-label.bb-star-rating-label-filled,
body .bb-star-rating-label:has(input[type="radio"]:checked),
body .bb-star-rating-label.bb-option-selected,
body .bb-star-rating-label.bb-star-rating-label-filled,
#limesurvey .bb-widget-star-button-selected,
body .bb-widget-star-button-selected,
#limesurvey .bb-widget-star-button-filled,
body .bb-widget-star-button-filled {
  --bb-star-fill-start: #FF5A6A;
  --bb-star-fill-mid: var(--berlin-red);
  --bb-star-fill-end: var(--berlin-red-dark);
  --bb-star-stroke: var(--berlin-black);
}

#limesurvey .bb-star-rating-label--no-answer,
body .bb-star-rating-label--no-answer,
#limesurvey .bb-widget-star-no-answer,
body .bb-widget-star-no-answer {
  --bb-rating-color: var(--berlin-black);
  color: var(--berlin-black) !important;
}

#limesurvey .bb-star-rating-label--no-answer.bb-star-rating-label-no-answer-selected,
body .bb-star-rating-label--no-answer.bb-star-rating-label-no-answer-selected,
#limesurvey .bb-widget-star-no-answer.bb-widget-star-button-selected,
body .bb-widget-star-no-answer.bb-widget-star-button-selected {
  border-color: var(--berlin-black) !important;
  background: var(--berlin-grey-100) !important;
  box-shadow:
    inset 0 0 0 2px var(--berlin-black),
    0 8px 18px rgba(0, 0, 0, .10) !important;
}

#limesurvey .select-sortable-lists:not(.ranking-advanced-style) .ranking-sorted-items .sortable-item,
#limesurvey .ranking-advanced-style .sortable-rank,
#limesurvey .ranking-advanced-style .ranking-advanced-sorted-items .sortable-item,
body .select-sortable-lists:not(.ranking-advanced-style) .ranking-sorted-items .sortable-item,
body .ranking-advanced-style .sortable-rank,
body .ranking-advanced-style .ranking-advanced-sorted-items .sortable-item {
  border-color: var(--berlin-red) !important;
}

/* 2.2.1: Hard override for Berlin CD star ratings.
   The 2.1.27 base still contains ITDZ-green star variables. Keep this last so
   every LimeSurvey star path renders Berlin red. */

#limesurvey .bb-star-rating-item,
body .bb-star-rating-item,
#limesurvey .bb-widget-star-button,
body .bb-widget-star-button {
  --bb-rating-color: var(--berlin-red) !important;
}

#limesurvey .bb-star-rating-item--1,
#limesurvey .bb-star-rating-item--2,
#limesurvey .bb-star-rating-item--3,
#limesurvey .bb-star-rating-item--4,
#limesurvey .bb-star-rating-item--5,
body .bb-star-rating-item--1,
body .bb-star-rating-item--2,
body .bb-star-rating-item--3,
body .bb-star-rating-item--4,
body .bb-star-rating-item--5 {
  --bb-rating-color: var(--berlin-red) !important;
}

#limesurvey .bb-star-rating-label:has(input[type="radio"]:checked),
#limesurvey .bb-star-rating-label.bb-option-selected,
#limesurvey .bb-star-rating-label.bb-star-rating-label-filled,
#limesurvey .bb-star-rating-item input[type="radio"]:checked + .bb-star-rating-label,
body .bb-star-rating-label:has(input[type="radio"]:checked),
body .bb-star-rating-label.bb-option-selected,
body .bb-star-rating-label.bb-star-rating-label-filled,
body .bb-star-rating-item input[type="radio"]:checked + .bb-star-rating-label,
#limesurvey .bb-widget-star-button-selected,
body .bb-widget-star-button-selected,
#limesurvey .bb-widget-star-button-filled,
body .bb-widget-star-button-filled {
  --bb-star-fill-start: #FF5A6A !important;
  --bb-star-fill-mid: var(--berlin-red) !important;
  --bb-star-fill-end: var(--berlin-red-dark) !important;
  --bb-star-stroke: var(--berlin-black) !important;
  border-color: var(--berlin-red) !important;
}

@media (max-width: 767px) {
  #limesurvey .bb-widget-star-rating-list,
  body .bb-widget-star-rating-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 420px) {
  #limesurvey .bb-widget-star-rating-list,
  body .bb-widget-star-rating-list {
    grid-template-columns: 1fr;
  }
}

/* =========================================================
   2.3.0 Berlin.de digital design system
   Research basis: current berlin.de Foxtrot design tokens.
   The final layer intentionally removes the former SaaS card treatment.
   ========================================================= */

:root {
  --berlin-red: #E40422;
  --berlin-black: #000000;
  --berlin-white: #FFFFFF;
  --berlin-grey-050: #FCFCFC;
  --berlin-grey-100: #F5F5F5;
  --berlin-grey-200: #EAEAEA;
  --berlin-grey-300: #DDDDDD;
  --berlin-grey-700: #454545;
  --berlin-link: #165BE0;
  --berlin-focus: #0076DD;
  --berlin-success: #15846E;
  --berlin-success-bg: #E2F1EB;
  --berlin-error: #9B0000;
  --berlin-error-bg: #FDECEE;
  --berlin-info-bg: #EBF1F7;
  --berlin-warning-bg: #F9F4E4;

  --bb-primary: var(--berlin-red);
  --bb-primary-strong: #B0001A;
  --bb-accent: var(--berlin-black);
  --bb-accent-strong: var(--berlin-black);
  --bb-accent-soft: var(--berlin-grey-100);
  --bb-accent-border: var(--berlin-red);
  --bb-page: var(--berlin-white);
  --bb-surface: var(--berlin-white);
  --bb-surface-muted: var(--berlin-grey-100);
  --bb-border: var(--berlin-grey-300);
  --bb-border-strong: var(--berlin-grey-700);
  --bb-text: var(--berlin-black);
  --bb-text-muted: var(--berlin-grey-700);
  --bb-error: var(--berlin-error);
  --bb-error-bg: var(--berlin-error-bg);
  --bb-success: var(--berlin-success);
  --bb-focus: var(--berlin-focus);
  --bb-focus-ring: rgba(0, 118, 221, .20);

  --bb-font: Arial, sans-serif;
  --bb-radius-sm: 2px;
  --bb-radius-md: 4px;
  --bb-radius-lg: 4px;
  --bb-radius-pill: 4px;
  --bb-shadow-sm: none;
  --bb-shadow-card: none;
  --bb-shadow-card-hover: none;
  --bb-shadow-focus: 0 0 0 3px var(--bb-focus-ring);
}

html,
body {
  color: var(--berlin-black) !important;
  background: var(--berlin-white) !important;
  font-family: var(--bb-font) !important;
  line-height: 1.5;
}

body,
body h1,
body h2,
body h3,
body h4,
body h5,
body h6,
body p,
body span,
body div,
body label,
body legend,
body button,
body input,
body select,
body textarea,
body .btn,
body .navbar,
body .alert,
body .survey-name,
body .survey-title,
body .survey-description,
body .survey-welcome {
  font-family: Arial, sans-serif !important;
}

body a {
  color: var(--berlin-link) !important;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

body a:hover {
  color: #0E428C !important;
  text-decoration-thickness: 2px;
}

body :focus-visible {
  outline: 3px solid var(--berlin-focus) !important;
  outline-offset: 2px !important;
  box-shadow: none !important;
}

body {
  padding-top: 72px;
}

body .navbar {
  min-height: 68px;
  padding-block: 8px;
  background: var(--berlin-white) !important;
  border-top: 6px solid var(--berlin-red) !important;
  border-bottom: 1px solid var(--berlin-black) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

body .navbar .container-fluid {
  max-width: 1120px;
}

body .navbar a,
body .navbar .nav-link {
  color: var(--berlin-black) !important;
  font-weight: 700;
  text-decoration: none;
}

body .navbar a:hover,
body .navbar .nav-link:hover {
  color: var(--berlin-black) !important;
  text-decoration: underline;
  text-decoration-color: var(--berlin-red);
  text-decoration-thickness: 3px;
}

.logo-container img.logo {
  max-height: 60px;
  min-height: 46px;
  inline-size: auto;
}

body h1,
body .survey-name,
body .survey-title,
body .survey-welcome h1,
body #welcome-container h1,
body .welcome-container h1,
body .group-title,
body .ls-group-name {
  color: var(--berlin-black) !important;
  font-weight: 700 !important;
}

body h1::after,
body .survey-name::after,
body .group-title::after {
  inline-size: 64px;
  block-size: 4px;
  margin-block-start: 8px;
  background: var(--berlin-red);
}

body .question-container,
body .question-wrapper,
body .question,
body .ls-question {
  border: 1px solid var(--berlin-grey-300) !important;
  border-radius: var(--bb-radius-lg) !important;
  background: var(--berlin-white) !important;
  box-shadow: none !important;
}

body .question-container:hover,
body .question-wrapper:hover,
body .question:hover,
body .ls-question:hover {
  border-color: var(--berlin-grey-700) !important;
  box-shadow: none !important;
  transform: none !important;
}

body .question-container::before,
body .question-wrapper::before,
body .question::before,
body .ls-question::before {
  inline-size: 4px !important;
  background: var(--berlin-red) !important;
  border-radius: 0 !important;
}

body .form-control,
body input[type="text"],
body input[type="email"],
body input[type="number"],
body input[type="date"],
body input[type="password"],
body select,
body textarea {
  min-block-size: 44px;
  color: var(--berlin-black) !important;
  background: var(--berlin-white) !important;
  border: 1px solid var(--berlin-grey-700) !important;
  border-radius: var(--bb-radius-md) !important;
  box-shadow: none !important;
}

body .form-control:focus,
body input[type="text"]:focus,
body input[type="email"]:focus,
body input[type="number"]:focus,
body input[type="date"]:focus,
body input[type="password"]:focus,
body select:focus,
body textarea:focus {
  border-color: var(--berlin-focus) !important;
  outline: 3px solid var(--berlin-focus) !important;
  outline-offset: 1px !important;
  box-shadow: none !important;
}

body .btn,
body button,
body input[type="submit"],
body input[type="button"] {
  min-block-size: 44px;
  border-radius: var(--bb-radius-md) !important;
  box-shadow: none !important;
  font-weight: 700;
}

body .btn-primary,
body button.btn-primary,
body input[type="submit"].btn-primary,
body #movenextbtn,
body #movesubmitbtn {
  color: var(--berlin-white) !important;
  background: var(--berlin-red) !important;
  border: 2px solid var(--berlin-black) !important;
  box-shadow: none !important;
}

body .btn-primary:hover,
body button.btn-primary:hover,
body input[type="submit"].btn-primary:hover,
body #movenextbtn:hover,
body #movesubmitbtn:hover {
  color: var(--berlin-white) !important;
  background: #B0001A !important;
  border-color: var(--berlin-black) !important;
  transform: none !important;
}

body .btn-outline-secondary,
body .btn-secondary,
body #moveprevbtn {
  color: var(--berlin-black) !important;
  background: var(--berlin-white) !important;
  border: 2px solid var(--berlin-black) !important;
}

body .btn-outline-secondary:hover,
body .btn-secondary:hover,
body #moveprevbtn:hover {
  color: var(--berlin-black) !important;
  background: var(--berlin-grey-200) !important;
  transform: none !important;
}

body .progress,
body .progress .progress {
  block-size: 8px;
  background: var(--berlin-grey-300) !important;
  border-radius: var(--bb-radius-md) !important;
  box-shadow: none !important;
}

body .progress-bar,
body .ls-progress-bar,
body .progress .progress-bar {
  background: var(--berlin-red) !important;
  border-radius: var(--bb-radius-md) !important;
}

body .alert {
  color: var(--berlin-black) !important;
  border: 1px solid var(--berlin-black) !important;
  border-left-width: 6px !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body .alert-danger,
body .alert-error,
body .ls-em-tip,
body .error {
  color: var(--berlin-error) !important;
  background: var(--berlin-error-bg) !important;
  border-color: var(--berlin-error) !important;
}

body .alert-success,
body .success,
body .completed-text {
  color: var(--berlin-black) !important;
  background: var(--berlin-success-bg) !important;
  border-color: var(--berlin-success) !important;
}

body .alert-info {
  background: var(--berlin-info-bg) !important;
}

body .alert-warning {
  background: var(--berlin-warning-bg) !important;
}

#limesurvey .radio input[type="radio"]:checked + label::before,
#limesurvey .ls-radio input[type="radio"]:checked + label::before,
#limesurvey .radio-item input[type="radio"]:checked + label::before,
#limesurvey .answer-item input[type="radio"]:checked + label::before,
body .radio input[type="radio"]:checked + label::before,
body .ls-radio input[type="radio"]:checked + label::before,
body .radio-item input[type="radio"]:checked + label::before,
body .answer-item input[type="radio"]:checked + label::before,
#limesurvey .checkbox input[type="checkbox"]:checked + label::before,
#limesurvey .ls-checkbox input[type="checkbox"]:checked + label::before,
#limesurvey .checkbox-item input[type="checkbox"]:checked + label::before,
#limesurvey .answer-item input[type="checkbox"]:checked + label::before,
body .checkbox input[type="checkbox"]:checked + label::before,
body .ls-checkbox input[type="checkbox"]:checked + label::before,
body .checkbox-item input[type="checkbox"]:checked + label::before,
body .answer-item input[type="checkbox"]:checked + label::before {
  border-color: var(--berlin-red) !important;
  background-color: var(--berlin-red) !important;
}

body table,
body .table,
body .array-flexible-row,
body .ls-answers {
  border-radius: 0 !important;
  box-shadow: none !important;
}

body .table > :not(caption) > * > *,
body table td,
body table th {
  border-color: var(--berlin-grey-300) !important;
}

body .table-striped > tbody > tr:nth-of-type(odd) > *,
body table tbody tr:nth-child(odd) {
  background-color: var(--berlin-grey-050) !important;
}

body .navigation-container,
body .survey-navigation,
body .ls-move-btn {
  box-shadow: none !important;
}

#limesurvey .bb-star-rating-label,
body .bb-star-rating-label,
#limesurvey .bb-widget-star-button,
body .bb-widget-star-button {
  border-radius: var(--bb-radius-md) !important;
  background: var(--berlin-white) !important;
  box-shadow: none !important;
  transform: none !important;
}

#limesurvey .bb-star-rating-label:hover,
body .bb-star-rating-label:hover,
#limesurvey .bb-widget-star-button:hover,
body .bb-widget-star-button:hover {
  border-color: var(--berlin-black) !important;
  box-shadow: none !important;
  transform: none !important;
}

#limesurvey .bb-star-rating-label:has(input[type="radio"]:checked),
#limesurvey .bb-star-rating-label.bb-option-selected,
#limesurvey .bb-star-rating-label.bb-star-rating-label-filled,
#limesurvey .bb-star-rating-item input[type="radio"]:checked + .bb-star-rating-label,
body .bb-star-rating-label:has(input[type="radio"]:checked),
body .bb-star-rating-label.bb-option-selected,
body .bb-star-rating-label.bb-star-rating-label-filled,
body .bb-star-rating-item input[type="radio"]:checked + .bb-star-rating-label,
#limesurvey .bb-widget-star-button-selected,
body .bb-widget-star-button-selected,
#limesurvey .bb-widget-star-button-filled,
body .bb-widget-star-button-filled {
  --bb-rating-color: var(--berlin-red) !important;
  --bb-star-fill-start: #FF5A6A !important;
  --bb-star-fill-mid: var(--berlin-red) !important;
  --bb-star-fill-end: #B0001A !important;
  --bb-star-stroke: var(--berlin-black) !important;
  border-color: var(--berlin-red) !important;
  background: var(--berlin-white) !important;
  box-shadow: inset 0 0 0 2px var(--berlin-red) !important;
}

#limesurvey .select-sortable-lists:not(.ranking-advanced-style) .ranking-sorted-items .sortable-item,
#limesurvey .ranking-advanced-style .sortable-rank,
#limesurvey .ranking-advanced-style .ranking-advanced-sorted-items .sortable-item,
body .select-sortable-lists:not(.ranking-advanced-style) .ranking-sorted-items .sortable-item,
body .ranking-advanced-style .sortable-rank,
body .ranking-advanced-style .ranking-advanced-sorted-items .sortable-item {
  border-color: var(--berlin-red) !important;
  border-radius: var(--bb-radius-md) !important;
  box-shadow: none !important;
}

body footer,
body .footer {
  color: var(--berlin-black) !important;
  background: var(--berlin-grey-100) !important;
  border-top: 1px solid var(--berlin-black) !important;
}

@media (max-width: 767px) {
  body {
    padding-top: 66px;
  }

  .logo-container img.logo {
    max-height: 52px;
    min-height: 40px;
  }

  body .question-container,
  body .question-wrapper,
  body .question,
  body .ls-question {
    border-inline: 0 !important;
    border-radius: 0 !important;
  }
}

/* =========================================================
   2.3.1 Berlin.de UI regression fixes
   Authoritative final cascade layer. Keep this block at EOF.
   ========================================================= */

:root {
  --bb-radius-sm: 0px;
  --bb-radius-md: 0px;
  --bb-radius-lg: 0px;
  --bb-radius-pill: 0px;
}

body .btn,
body button,
body input[type="button"],
body input[type="submit"],
body input[type="reset"],
body .form-control,
body .form-select,
body input:not([type="radio"]),
body select,
body textarea,
body .input-group,
body .input-group-text,
body .dropdown-menu,
body .modal-content,
body .card,
body .list-group,
body .list-group-item,
body .alert,
body .progress,
body .progress-bar,
body .question-container,
body .question-wrapper,
body .question,
body .ls-question,
body .sortable-item,
body .sortable-rank,
body .sortable-block,
body .bb-star-rating-label,
body .bb-widget-star-button {
  border-radius: 0 !important;
}

body input[type="radio"],
body .radio label::before,
body .ls-radio label::before,
body .radio-item label::before,
body .answer-item input[type="radio"] + label::before {
  border-radius: 50% !important;
}

body .submit-wrapper,
body [class*="submitwrapper"] {
  max-inline-size: 720px;
  margin-inline: auto;
  color: var(--berlin-black) !important;
  background: var(--berlin-white) !important;
}

body [class*="submitwrappertext"] {
  padding: 24px;
  color: var(--berlin-black) !important;
  background: var(--berlin-white) !important;
  border: 1px solid var(--berlin-grey-300);
  border-left: 6px solid var(--berlin-success);
}

body [class*="submitwrapper"] p,
body [class*="submitwrapper"] div,
body [class*="submitwrappertext"] {
  color: var(--berlin-black) !important;
}

body [class*="submitwrappertextHeading"],
body #survey-completed-heading {
  margin: 8px 0 10px;
  color: var(--berlin-black) !important;
  font-size: clamp(1.75rem, 3vw, 2.25rem);
  font-weight: 700;
  line-height: 1.2;
}

body [class*="submitwrappertextContent"] {
  margin: 0;
  color: var(--berlin-black) !important;
  font-size: 1.125rem;
  line-height: 1.5;
}

body .bb-success-icon {
  display: inline-block;
  color: var(--berlin-success) !important;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
}

#limesurvey .bb-ranking-color-list *,
body .bb-ranking-color-list *,
#limesurvey .bb-ranking-color-normalized,
body .bb-ranking-color-normalized,
#limesurvey .select-sortable-lists .sortable-item,
body .select-sortable-lists .sortable-item,
#limesurvey .ranking-advanced-style .sortable-rank,
body .ranking-advanced-style .sortable-rank,
#limesurvey .ranking-advanced-style .sortable-block,
body .ranking-advanced-style .sortable-block {
  --ls-success: var(--berlin-red) !important;
  --bs-success: var(--berlin-red) !important;
  --bs-success-rgb: 228, 4, 34 !important;
  border-color: var(--berlin-grey-700) !important;
  outline-color: var(--berlin-focus) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

#limesurvey .bb-ranking-color-list .selector__dragHandle,
body .bb-ranking-color-list .selector__dragHandle,
#limesurvey .bb-ranking-color-list .selector__index_row,
body .bb-ranking-color-list .selector__index_row {
  color: var(--berlin-grey-700) !important;
  border: 0 !important;
}

#limesurvey .bb-ranking-color-normalized:focus,
#limesurvey .bb-ranking-color-normalized:focus-within,
body .bb-ranking-color-normalized:focus,
body .bb-ranking-color-normalized:focus-within,
#limesurvey .sortable-item:focus,
#limesurvey .sortable-item:focus-within,
body .sortable-item:focus,
body .sortable-item:focus-within {
  border-color: var(--berlin-red) !important;
  outline: 3px solid var(--berlin-focus) !important;
  outline-offset: 2px;
}

#limesurvey .ranking-sorted-items .sortable-item,
body .ranking-sorted-items .sortable-item,
#limesurvey .ranking-advanced-sorted-items .sortable-item,
body .ranking-advanced-sorted-items .sortable-item {
  border-color: var(--berlin-red) !important;
}

#limesurvey .bb-star-face-svg,
body .bb-star-face-svg,
#limesurvey .bb-widget-star-button .bb-star-face-svg,
body .bb-widget-star-button .bb-star-face-svg {
  filter: none !important;
  transform: none !important;
}

#limesurvey .bb-star-rating-label,
body .bb-star-rating-label,
#limesurvey .bb-widget-star-button,
body .bb-widget-star-button,
#limesurvey .bb-star-rating-label:hover,
body .bb-star-rating-label:hover,
#limesurvey .bb-widget-star-button:hover,
body .bb-widget-star-button:hover {
  background: var(--berlin-white) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}

#limesurvey .bb-star-rating-label.bb-star-rating-label-filled,
body .bb-star-rating-label.bb-star-rating-label-filled,
#limesurvey .bb-widget-star-button-filled,
body .bb-widget-star-button-filled,
#limesurvey .bb-widget-star-button-selected,
body .bb-widget-star-button-selected {
  --bb-star-fill-start: var(--berlin-red) !important;
  --bb-star-fill-mid: var(--berlin-red) !important;
  --bb-star-fill-end: var(--berlin-red) !important;
  box-shadow: inset 0 0 0 2px var(--berlin-red) !important;
}

body .question-container:hover,
body .question-wrapper:hover,
body .question:hover,
body .ls-question:hover,
body .btn:hover,
body button:hover {
  transform: none !important;
}

body .text-danger {
  color: var(--berlin-error) !important;
}

@media (max-width: 767px) {
  body [class*="submitwrappertext"] {
    padding: 20px 16px;
  }
}

/* 2.3.2 final completion override. Kept for history; 2.3.3 below is authoritative. */
body .completed-text {
  color: var(--berlin-black) !important;
  background: var(--berlin-white) !important;
  background-image: none !important;
  border: 1px solid var(--berlin-grey-300) !important;
  border-left: 6px solid var(--berlin-success) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body .completed-text p,
body .completed-text div,
body .completed-text h1,
body .completed-text h2,
body .completed-text h3,
body .completed-text #survey-completed-heading {
  color: var(--berlin-black) !important;
  background: transparent !important;
}

body .completed-text .bb-success-icon {
  color: var(--berlin-success) !important;
}

/* 2.3.3 authoritative final cascade override. Kept for history; 2.3.4 below is authoritative. */
body #survey-nav {
  min-height: 76px !important;
  padding-block: 12px !important;
  background: var(--berlin-white) !important;
  border-top: 0 !important;
  border-bottom: 1px solid var(--berlin-black) !important;
}

body #survey-nav .container-fluid {
  max-width: 1060px !important;
}

body #survey-nav .navbar-brand.logo-container {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 52px !important;
  margin: 0 !important;
  padding: 0 !important;
}

body #survey-nav .logo-container img.logo,
body .logo-container img.logo,
body.brand-logo #survey-nav .logo-container img.logo {
  width: auto !important;
  min-width: 0 !important;
  max-width: 220px !important;
  height: auto !important;
  min-height: 42px !important;
  max-height: 52px !important;
  object-fit: contain !important;
}

body .completed-text,
body [class*="submitwrappertext"].completed-text,
body .submit-wrapper .completed-text,
body [class*="submitwrapper"] .completed-text {
  box-sizing: border-box !important;
  max-width: 720px !important;
  margin: 12px auto 0 !important;
  padding: 32px !important;
  color: var(--berlin-black) !important;
  background: var(--berlin-white) !important;
  background-color: var(--berlin-white) !important;
  background-image: none !important;
  border: 1px solid var(--berlin-grey-300) !important;
  border-top: 6px solid var(--berlin-red) !important;
  border-left: 1px solid var(--berlin-grey-300) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body [class*="submitwrapper"] {
  max-width: 720px !important;
  margin-inline: auto !important;
  background: transparent !important;
}

body .bb-completion-message {
  display: grid !important;
  grid-template-columns: 44px minmax(0, 1fr) !important;
  gap: 18px !important;
  align-items: start !important;
}

body .bb-completion-copy {
  min-width: 0 !important;
}

body .completed-text .bb-success-icon,
body .bb-success-icon {
  display: inline-grid !important;
  width: 44px !important;
  height: 44px !important;
  place-items: center !important;
  color: var(--berlin-black) !important;
  font-size: 2rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  border: 2px solid var(--berlin-black) !important;
  border-radius: 0 !important;
  background: var(--berlin-white) !important;
}

body .completed-text p,
body .completed-text div,
body .completed-text h1,
body .completed-text h2,
body .completed-text h3,
body .completed-text #survey-completed-heading,
body .completed-text [class*="submitwrappertextHeading"],
body .completed-text [class*="submitwrappertextContent"] {
  color: var(--berlin-black) !important;
  background: transparent !important;
}

body .completed-text #survey-completed-heading,
body .completed-text [class*="submitwrappertextHeading"] {
  margin: 0 0 10px !important;
  color: var(--berlin-black) !important;
  font-size: clamp(2rem, 4vw, 3rem) !important;
  font-weight: 700 !important;
  line-height: 1.08 !important;
}

body .completed-text [class*="submitwrappertextContent"] {
  margin: 0 !important;
  font-size: 1.25rem !important;
  line-height: 1.45 !important;
}

body .activealert,
body .alert-warning {
  max-width: 720px !important;
  margin-inline: auto !important;
}

@media (max-width: 767px) {
  body {
    padding-top: 84px !important;
  }

  body #survey-nav {
    min-height: 72px !important;
    padding-block: 10px !important;
  }

  body #survey-nav .navbar-brand.logo-container {
    display: inline-flex !important;
    min-height: 48px !important;
  }

  body #survey-nav .logo-container img.logo,
  body .logo-container img.logo {
    max-width: 180px !important;
    min-height: 38px !important;
    max-height: 48px !important;
  }

  body .completed-text,
  body [class*="submitwrappertext"].completed-text,
  body [class*="submitwrapper"] .completed-text {
    padding: 24px 18px !important;
  }

  body .bb-completion-message {
    grid-template-columns: 36px minmax(0, 1fr) !important;
    gap: 14px !important;
  }

  body .completed-text .bb-success-icon,
  body .bb-success-icon {
    width: 36px !important;
    height: 36px !important;
    font-size: 1.5rem !important;
  }
}

/* 2.3.6 authoritative final logo sizing override. Keep this as the last CSS block. */
body #survey-nav {
  min-height: 122px !important;
  padding-block: 16px !important;
}

body #survey-nav .navbar-brand.logo-container,
body #survey-nav a.navbar-brand.logo-container,
body #survey-nav span.navbar-brand.logo-container {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  min-width: 300px !important;
  min-height: 92px !important;
}

body #survey-nav .navbar-brand.logo-container img,
body #survey-nav .logo-container img.logo,
body .navbar-brand.logo-container img.logo,
body .logo-container img.logo {
  display: block !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: 430px !important;
  height: 86px !important;
  min-height: 86px !important;
  max-height: 86px !important;
  object-fit: contain !important;
  image-rendering: auto !important;
  image-rendering: -webkit-optimize-contrast !important;
}

body #navbar-menu {
  align-self: center !important;
}

@media (max-width: 767px) {
  body {
    padding-top: 112px !important;
  }

  body #survey-nav {
    min-height: 98px !important;
    padding-block: 12px !important;
  }

  body #survey-nav .navbar-brand.logo-container,
  body #survey-nav a.navbar-brand.logo-container,
  body #survey-nav span.navbar-brand.logo-container {
    min-width: 220px !important;
    min-height: 68px !important;
  }

  body #survey-nav .navbar-brand.logo-container img,
  body #survey-nav .logo-container img.logo,
  body .navbar-brand.logo-container img.logo,
  body .logo-container img.logo {
    max-width: 300px !important;
    height: 64px !important;
    min-height: 64px !important;
    max-height: 64px !important;
  }
}

/* 2.3.7 Berlin.de-style compact brand header. Keep this as the last CSS block. */
body {
  padding-top: 88px !important;
}

body #survey-nav,
body .navbar#survey-nav {
  min-height: 74px !important;
  height: 74px !important;
  padding: 0 !important;
  background: var(--berlin-white) !important;
  border-top: 0 !important;
  border-bottom: 1px solid var(--berlin-black) !important;
  box-shadow: none !important;
}

body #survey-nav .container-fluid {
  width: 100% !important;
  max-width: 1120px !important;
  min-height: 74px !important;
  margin-inline: auto !important;
  padding-inline: 24px !important;
  display: flex !important;
  align-items: center !important;
}

body #survey-nav .navbar-brand.logo-container,
body #survey-nav a.navbar-brand.logo-container,
body #survey-nav span.navbar-brand.logo-container {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
}

body #survey-nav .navbar-brand.logo-container img,
body #survey-nav .logo-container img.logo,
body .navbar-brand.logo-container img.logo,
body .logo-container img.logo {
  display: block !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 44px !important;
  min-height: 44px !important;
  max-height: 44px !important;
  object-fit: contain !important;
  image-rendering: auto !important;
}

body #navbar-menu {
  align-self: center !important;
}

body #navbar-toggler,
body .navbar-toggler {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

body .progress-container,
body .survey-progress,
body [class*="progress"] {
  margin-top: 0 !important;
}

@media (max-width: 767px) {
  body {
    padding-top: 78px !important;
  }

  body #survey-nav,
  body .navbar#survey-nav {
    min-height: 66px !important;
    height: 66px !important;
  }

  body #survey-nav .container-fluid {
    min-height: 66px !important;
    padding-inline: 16px !important;
  }

  body #survey-nav .navbar-brand.logo-container img,
  body #survey-nav .logo-container img.logo,
  body .navbar-brand.logo-container img.logo,
  body .logo-container img.logo {
    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;
  }
}

/* 2.3.8 BerlinCD final hardening layer. Keep this as the last CSS block. */
:root {
  --bs-primary: var(--berlin-red) !important;
  --bs-success: var(--berlin-red) !important;
  --bs-danger: var(--berlin-error) !important;
  --bs-info: var(--berlin-link) !important;
  --bs-warning: var(--berlin-warning-bg) !important;
  --bs-primary-rgb: 228, 4, 34 !important;
  --bs-success-rgb: 228, 4, 34 !important;
  --bs-body-color: var(--berlin-black) !important;
  --bs-body-bg: var(--berlin-white) !important;
}

body {
  padding-top: 88px !important;
}

body #survey-nav,
body .navbar#survey-nav {
  min-height: 74px !important;
  height: 74px !important;
  padding: 0 !important;
  background: var(--berlin-white) !important;
  border-top: 0 !important;
  border-bottom: 1px solid var(--berlin-black) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body #survey-nav .container-fluid {
  width: 100% !important;
  max-width: 1120px !important;
  min-height: 74px !important;
  margin-inline: auto !important;
  padding-inline: 24px !important;
  display: flex !important;
  align-items: center !important;
}

body #survey-nav .navbar-brand.logo-container,
body #survey-nav a.navbar-brand.logo-container,
body #survey-nav span.navbar-brand.logo-container {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
}

body #survey-nav .navbar-brand.logo-container img,
body #survey-nav .logo-container img.logo,
body .navbar-brand.logo-container img.logo,
body .logo-container img.logo {
  display: block !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 44px !important;
  min-height: 44px !important;
  max-height: 44px !important;
  object-fit: contain !important;
  image-rendering: auto !important;
}

body #navbar-menu {
  align-self: center !important;
}

body #navbar-toggler,
body .navbar-toggler {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 0 !important;
}

body .btn,
body button,
body input[type="button"],
body input[type="submit"],
body input[type="reset"],
body .button-item {
  border-radius: 0 !important;
}

body .btn-primary,
body .btn-success,
body .progress-bar,
body .bg-primary,
body .bg-success,
body .badge.bg-primary,
body .badge.bg-success {
  background-color: var(--berlin-red) !important;
  border-color: var(--berlin-red) !important;
  color: var(--berlin-white) !important;
}

body .text-success,
body .text-primary,
body .fa-check,
body .ri-check-line {
  color: var(--berlin-red) !important;
}

body a,
body .btn-link {
  color: var(--berlin-link) !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 0.16em !important;
}

body .save-container {
  max-width: 720px !important;
  margin-inline: auto !important;
  padding: 24px !important;
  background: var(--berlin-white) !important;
  border: 1px solid var(--berlin-grey-300) !important;
  border-top: 6px solid var(--berlin-red) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body .load-form {
  max-width: 720px !important;
  margin-inline: auto !important;
  padding: 24px !important;
  background: var(--berlin-white) !important;
  border: 1px solid var(--berlin-grey-300) !important;
  border-top: 6px solid var(--berlin-red) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body .register-container {
  max-width: 720px !important;
  margin-inline: auto !important;
  padding: 24px !important;
  background: var(--berlin-white) !important;
  border: 1px solid var(--berlin-grey-300) !important;
  border-top: 6px solid var(--berlin-red) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body #surveys-list-container {
  max-width: 960px !important;
  margin-inline: auto !important;
  padding: 24px !important;
  background: var(--berlin-white) !important;
  border: 1px solid var(--berlin-grey-300) !important;
  border-top: 6px solid var(--berlin-red) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body .modal-content {
  background: var(--berlin-white) !important;
  color: var(--berlin-black) !important;
  border: 1px solid var(--berlin-black) !important;
  border-top: 6px solid var(--berlin-red) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body .savecontainer,
body .loadform,
body .registration-form,
body .survey-list,
body [class*="save-container"],
body [class*="load-form"],
body [class*="register-container"],
body [id*="surveys-list"] {
  border-radius: 0 !important;
  box-shadow: none !important;
}

body .alert,
body .ls-em-tip,
body .em_default,
body .ls-questionhelp,
body .ls-question-message {
  border-radius: 0 !important;
  box-shadow: none !important;
}

body .alert-success {
  background: var(--berlin-white) !important;
  border-color: var(--berlin-red) !important;
  color: var(--berlin-black) !important;
}

@media (max-width: 767px) {
  body {
    padding-top: 78px !important;
  }

  body #survey-nav,
  body .navbar#survey-nav {
    min-height: 66px !important;
    height: 66px !important;
  }

  body #survey-nav .container-fluid {
    min-height: 66px !important;
    padding-inline: 16px !important;
  }

  body #survey-nav .navbar-brand.logo-container img,
  body #survey-nav .logo-container img.logo,
  body .navbar-brand.logo-container img.logo,
  body .logo-container img.logo {
    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;
  }
}