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

    In this file you can add your own custom CSS
    It will be loaded last, so you can override any other property.
    Also, it will never be updated. So if you inheritate a core template and just add here some CSS, you'll still benefit of all the updates
*/

/* deutlichere Wilkommensnachricht */
#welcome-container {
    background-color: #f0f0f0; /* Hellgrauer Hintergrund */
    padding: 20px; /* Optional: etwas Innenabstand hinzufügen */
    border-radius: 8px; /* Optional: abgerundete Ecken hinzufügen */
}

/* Umfragebeschreibung in schwarzer Schrift */
.survey-description p {
    color: #000000; /* Schwarze Schriftfarbe */
}
.privacy.row {
    background-color: #f0f0f0; /* Hellgrauer Hintergrund */
    padding: 20px; /* Optional: etwas Innenabstand hinzufügen */
    border-radius: 8px; /* Optional: abgerundete Ecken hinzufügen */
}

/* Größerer Fragetext mit Rand */
.ls-label-question {
    font-size: 1.5em; /* Schriftgröße anpassen */
    /*padding: 10px;
    /*border: 2px solid #2C3E50; /* Rand hinzufügen */
    /*color: #2C3E50; /* Textfarbe */
    /*background-color: #ffffff; /* Hintergrundfarbe */
}

/* Größerer Antworttext bei Aufzählungen */
.answer-item.radio-item label {
    font-size: 1.2em; /* Schriftgröße anpassen */
    color: #000000; /* Textfarbe */
}


/* Antworttext und Slider mit größerer Schrift */
.control-label {
    font-size: 1.2em;
}


/* Antworttext in einer Matrix-Antwort größer */
.col-responses .ls-table-wrapper label {
    font-size: 1.2em; /* Schriftgröße anpassen */
    color: #000000; /* Textfarbe */
}

/* Bild zentriert darstellen */
.centered-image {
    display: block;
    margin-left: auto;
    margin-right: auto;
    max-width: 100%; /* Optional, um sicherzustellen, dass das Bild nicht größer als der Container ist */
}


/* Standardfarbe für die Buttons */
.btn {
  background-color: #2C3E50; /* Standard Bootstrap Blau */
  border: none;
  color: white;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
  border-radius: 8px;
}

/* Farbe der Buttons bei Auswahl/Hover/Aktiv */
.btn:hover, .btn:focus, .btn:active, .btn.active {
  background-color: #4CAF50 !important; /* Grün */
  border-color: #4CAF50 !important; /* Grün */
  color: white !important;
}

/* Farbe der primären Buttons bei Auswahl/Hover/Aktiv */
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active {
  background-color: #45a049 !important; /* Dunkleres Grün */
  border-color: #45a049 !important; /* Dunkleres Grün */
  color: white !important;
}

/* Spezifische Regel für Label mit btn-primary Klasse, wenn es aktiv oder ausgewählt ist */
label.btn-primary:active, label.btn-primary.active {
  background-color: #45a049 !important; /* Dunkleres Grün */
  border-color: #45a049 !important; /* Dunkleres Grün */
  color: white !important;
}

/* Sicherstellen, dass das Label bei Auswahl grün bleibt */
input[type="radio"]:checked + label.btn, input[type="checkbox"]:checked + label.btn {
  background-color: #4CAF50 !important; /* Grün */
  border-color: #4CAF50 !important; /* Grün */
  color: white !important;
}

input[type="radio"]:checked + label.btn-primary, input[type="checkbox"]:checked + label.btn-primary {
  background-color: #45a049 !important; /* Dunkleres Grün */
  border-color: #45a049 !important; /* Dunkleres Grün */
  color: white !important;
}

/* Hervorhebung bei Tastaturnavigation */
input[type="radio"]:focus + label.btn, input[type="checkbox"]:focus + label.btn {
  outline: 2px solid #FFD700; /* Gelb für bessere Sichtbarkeit */
}

input[type="radio"]:focus + label.btn-primary, input[type="checkbox"]:focus + label.btn-primary {
  outline: 2px solid #FFD700; /* Gelb für bessere Sichtbarkeit */
}

/* Anpassung der Hintergrundfarbe für bessere Lesbarkeit */
body {
  background-color: #FFFFFF; /* Weißer Hintergrund für die gesamte Seite */
}

/* Hintergrundfarbe für den question-container */
.question-container {
  background-color: #F0F0F0 !important; /* Grauer Hintergrund für den question-container */
}

/* Gruppenbeschreibung standardmäßig anzeigen */
.group-description {
    display: block;
}
