/* Sekcja 11  Typ sekcji Rejestracja dedykowana Widok Formularz rejestracji */

#section11 {
background-color: #d3f2ff;

h4,
#timer {
  font-family: 'black';
  font-size: 32px;
  color: var(--dark);
  text-align: center;

  @media(max-width: 576px) {
    font-size: 28px;
  }
}

p {
  color: var(--dark);
  font-family: 'bold';
  text-align: center;

  strong {
    font-family: 'black';
  }
}

.row:has(.col-md-6) {
  gap: 4%;
  justify-content: center;
}

.row>.col-md-6 {
  border: 2px solid var(--dark);
  border-radius: 35px;

  @media(max-width: 576px) {
    margin: 0 10px;
  }

  @media(min-width: 768px) {
    max-width: 48%;
    flex: 0 0 48%;
  }

  padding: 2rem;
}

.col-12:has(form) {
  border: 2px solid var(--dark);
  border-radius: 35px;
  padding: 2rem;

  @media(max-width: 576px) {
    margin: 0 10px;
  }
}

.col-md-6:has(#login_form) {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;

  @media(max-width: 768px) {
    margin-top: 2rem;
  }

  i.fa-lock {
    display: block;
    font-size: 7rem;
    padding-top: 1.5rem;
    padding-bottom: 1rem;
  }
}

.form-control {
  height: calc(1.5em + 1.5rem + 2px);
  color: var(--dark);
  border: 0;
  border-radius: 15px;
  font-family: 'bold';

  &:focus {
    color: var(--dark);
    border: 1px solid var(--dark);
    box-shadow: 0 0 0 .2rem rgb(20 30 80 / 25%);
  }
}

.form-group label {
  font-family: 'bold';
  color: var(--dark);
  margin-top: 0px;
  margin-left: 10px;
}

.form-control.is-valid,
.form-control.was-validated,
.form-control.valid,
.form-control.is-invalid,
.was-validated .form-control:invalid {
  border: 1px solid;
}

.form-control.is-invalid,
.was-validated .form-control:invalid {
  border-color: #dc3545 !important;
}

.form-control.is-valid,
.was-validated .form-control:valid {
  border-color: #28a745 !important;
}

.form-group:has(.col-4) .form-control {
  text-indent: 100px;

  @media(max-width: 768px) {
    text-indent: 125px;
  }
}

.abc-checkbox label::after,
.abc-radio label::after {
  width: 22px;
  height: 22px;
  left: -3px;
  top: -3px;
  font-size: 14px;
  color: #206bf5;
}

.abc-checkbox label::before,
.abc-radio label::before {
  width: 24px;
  height: 24px;
  left: -5px;
  top: -4px;
  border: 2px solid #206bf5;
  border-radius: 5px;
  background-color: transparent;
}

.form-group .col-4 {
  position: absolute;
  top: 6px;
  font-family: 'bold';
  color: white !important;
  min-width: 125px;


  .select2-container .select2-selection--single .select2-selection__rendered {
    padding-left: 0;
  }

  .input-group-prepend {
    margin-right: -5px;
  }

  .input-group-text {
    background: #006efa;
    border-radius: 8px 0 0 8px;
    border: 0;

    img {
      border-radius: 50%;
      width: 15px;
      height: 15px;
      object-fit: cover;
    }

  }
}

#warsztaty>.d-flex {
  gap: 20px;
  justify-content: center;
}

#warsztaty .col-12.col-md-3 {
  display: flex;
  flex-direction: column;
  background: #ffffff2e;
  padding: 1rem 1.5rem;
  cursor: pointer;
  border: 1px solid var(--dark);
  border-radius: 20px;
    font-size: 13px;

  input {
    visibility: hidden;
  }

  &:has(input:checked) {
    background: var(--dark);

    p {
      color: white !important;
    }
  }

  p.warsztat-name {
    font-size: 13px;
  }
}

#zgody {
  font-family: 'bold';
  color: var(--dark);
  font-size: 13px;

  strong {
    font-family: 'black';
  }

  .abc-checkbox label::after,
  .abc-radio label::after {
    top: -5px;
  }

  .abc-checkbox label::before,
  .abc-radio label::before {
    top: -6px;
  }

}

.subconsent {
  margin-top: 8px;
}

label.error {
  display: block;
  color: #dc3545 !important;
  font-size: 12px;
  font-family: 'bold';
}

button[type="submit"],
#registerSpinButton,
#loginSpinButton {
  color: white;
  font-family: 'bold';
  background: #206bf5;
  border-radius: 13px;
  padding: 1rem 2rem;
  font-size: 1.275rem;
  transition: 0.3s;
  text-transform: uppercase;

  &:focus {
    background: var(--dark);
  }
}

.abc-checkbox label.error::after,
.abc-checkbox label.error::before {
  display: none;
}

#registration-success {
  border: 2px solid var(--dark);
  border-radius: 35px;
  padding: 3rem;

  @media(max-width: 576px) {
    margin: 0 10px;
  }
}

.select2-container--bootstrap4 {
  font-family: 'bold';
}

.select2-container--bootstrap4 .select2-selection--single .select2-selection__arrow b {
  border-color: white transparent transparent;
  border-width: 9px 5px 0;
  left: 50%;
  margin-left: -5px;
  margin-top: -4px;
}

span.select2-selection.select2-selection--single {
  background: #006efa;
  border: 8px;
  color: white !important;
}

.select2-container--bootstrap4 .select2-selection--single .select2-selection__placeholder {
  color: white !important;
  font-size: 12px;
}

.select2-container:has(#select2-uczelnia-container) {
  width: 100% !important;
  .select2-selection--single {
    height: calc(1.5em + 1.5rem + 2px) !important;
    display: flex;
    align-items: center;
    border-radius: 15px;
  }
}

#consents strong {
  font-size: 14px;
}
}