/******************
    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
*/

  .table-bordered > thead > tr > th {
    border: 1px solid #dadada;
  }
  .table-bordered > thead > tr > td {
    border: 1px solid #dadada;
  }
  
  .group-container {
    background: #fff;
    padding: 15px;
    border-radius: 5px;
    border: 1px solid #eee;
}

.question-container {
    margin-bottom: 2em;
    border: none;
    background-color: transparent;
}

/* Multiplechoice bootstrap buttons unchecked focus*/
.btn-check .btn-primary:focus, .btn-check:focus+.btn-primary {
    background-color: #6995ca !important;
    border: 1px solid #f3f6fa !important;
    box-shadow: none;
    color: #fff;
}
.btn-check:focus:checked + .btn-primary, .btn-check .btn-primary:focus:checked {
    background-color: #1f4eab !important;
    border-color: #f3f6fa;
    color: #fff;
 }
 
 .btn-primary {
    background-color: #6995ca;
    border: 1px solid #f3f6fa;
    box-shadow: none;
    color: #fff;
 }

.logo-container > img {
    max-height: 130px;
    padding: 15px;
    width: auto;
}

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

.group-title {
    text-align: left !important;
    color: #6995ca !important;
    font-size: 3em;
    padding-left:10px;
    background-color:#f3f6fa;
    padding-top: 30px;
    padding-bottom: 30px;
}

.survey-name {
    text-align: left !important;
    color: #6995ca !important;
    font-size: 3em;
    padding-left:10px;
    background-color:#f3f6fa;
    padding-top: 30px;
    padding-bottom: 30px;
}

.space-col {
    margin-bottom:0em;
}

.well {
    background-color:#ffffff !important;
    border: none !important;
}

 .ls-privacy-body {
     display: none;
 }
 
 .ukb-logo {
  max-width: 450px;
  margin-left:auto;
}

.navbar-collapse{
    flex-grow: 0 !important;
}

/* Footer styling */
.footer {
  background-color: #8daad0; /* Change background color */
  padding: 20px 0;
  color: white;
}

.footerinner {
  max-width: 1300px; /* Set maximum width */
  margin: 0 auto; /* Center the content */
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: 0 20px; /* Optional padding for small screen edges */
}

.footerleft, .footermiddle {
  width: 30%;
}

/* Ensure menu items in left and middle are vertically aligned */
.footerleft ul, .footermiddle ul {
  list-style: none;
  padding: 0;
  margin: 0; /* Ensure no default margins are applied to UL */
}

.footerleft ul li, .footermiddle ul li {
  margin-bottom: 10px;
  display: contents; /* Set to ensure proper vertical list display */
}

.footerleft ul li a, .footermiddle ul li a {
  color: white;
  text-decoration: none;
  display: block; /* Block ensures the links take up full width */
  width: 100%; /* Ensure full width for each link */
}

/* Social media block */
.footerright {
  width: 30%;
  text-align: right; /* Align content to the right */
}

.footerright .socialmedia {
  display: flex;
  justify-content: flex-end;
  width: 100%; /* Make the social media block full width */
  margin-bottom: 10px;
}

.footerright .socialmedia a {
  margin-left: 10px;
  color: white;
  text-decoration: none;
  font-size: 1.5em;
  display: inline-block; /* Ensure inline-block for proper spacing */
}

/* Patientenlotsen and Telefonnummer aligned right, after social media */
.footerright .contact-info {
  text-align: right;
}

.footerright p {
  margin: 0;
}

.footerright p a {
  color: white;
  text-decoration: none;
  font-weight: bold;
}

.footerright strong {
  display: block;
}

body{
    padding-bottom: 0;
}

.progress-bar {
background-color: #ae383a !important;
}

.limit-text-window {
    padding: 15px 0px;
    margin-bottom: 10px;
}

.text-primary {
    color: #000 !important;
    font-weight: bolder;
}

.h4 {
    font-size: 1.1rem;
}

.form-check-input[type=checkbox]{
    margin-right:10px;
}

#welcome-container {
    margin-bottom: 50px;
}

.completed-wrapper {
    margin-bottom: 20px;
}