/* Sekcja 8  Typ sekcji Formularz rejestracji Widok Standardowy formularz rejestracji */

#section8 {
&#section8#section8 {
  box-sizing: border-box !important;
  container: mbm-registration / inline-size;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 0 !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 36px max(16px, calc((100% - 1200px) / 2)) 64px !important;
  position: relative !important;
  overflow: visible !important;
  background: #f8f7f5 !important;
  color: #16203c !important;
  font-family: "MBM Inter", Inter, Arial, sans-serif !important;
  scroll-margin-top: 96px;

  * {
    box-sizing: border-box !important;
  }

  /* Nagłówek sekcji */

  > .mbm-newsletter-heading {
    order: 1 !important;
    width: 100% !important;
    margin: 0 !important;
    color: #16203c !important;
    font-family: "Playfair Display", Georgia, serif !important;
    font-size: clamp(30px, 4vw, 44px) !important;
    line-height: 1.2 !important;
    font-weight: 400 !important;
    text-align: center !important;
  }

  > .mbm-newsletter-subtitle {
    order: 2 !important;
    width: 100% !important;
    margin: 14px 0 40px !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
    text-align: center !important;
  }

  /* Oba teksty NAD formularzem, jeden pod drugim */

  > .mbm-newsletter-copy {
    order: 3 !important;
    display: block !important;
    position: static !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  > .mbm-newsletter-copy > div {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }

  > .mbm-newsletter-copy > div + div {
    margin-top: 32px !important;
  }

  > .mbm-newsletter-copy h2 {
    margin: 0 0 14px !important;
    padding: 0 0 18px !important;
    background: linear-gradient(#16203c, #16203c)
      left bottom / 70px 1px no-repeat !important;
    color: #16203c !important;
    font-family: "Playfair Display", Georgia, serif !important;
    font-size: clamp(24px, 3vw, 30px) !important;
    line-height: 1.25 !important;
    font-weight: 400 !important;
  }

  > .mbm-newsletter-copy p {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    font-size: 16px !important;
    line-height: 1.75 !important;
  }

  /* Formularz: pełna szerokość POD tekstami */

  > #RegistrationView.container {
    order: 4 !important;
    display: block !important;
    position: static !important;
    float: none !important;
    transform: none !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 40px 0 0 !important;
    padding: 0 !important;
  }

  #mainCard.card {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid #16203c !important;
    border-radius: 8px !important;
    background: #fff !important;
    color: #16203c !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  #mainCard > .card-header {
    margin: 0 !important;
    padding: 24px 24px 0 !important;
    border: 0 !important;
    background: transparent !important;
    text-align: left !important;
  }

  #mainCard .sectionTitle {
    margin: 0 !important;
    padding: 0 !important;
    color: #16203c !important;
    font-family: "Playfair Display", Georgia, serif !important;
    font-size: 28px !important;
    line-height: 1.3 !important;
    font-weight: 400 !important;
  }

  #mainCard .mbm-newsletter-intro {
    max-width: none !important;
    margin: 8px 0 0 !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
  }

  #mainCard > .card-body {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 24px !important;
    background: transparent !important;
  }

  #MainForm {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .registrationStep,
  [id^="registrationStep"][id$="_View"] {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
  }

  .registrationStepName,
  .registrationStepSeparator {
    display: none !important;
  }

  /* Reset kolumn Coffee / Bootstrap */

  #mainCard .form-group {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    grid-column: auto !important;
  }

  #mainCard .form-group > label,
  #mainCard .form-group > div {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: none !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  #mainCard .form-group > label {
    display: block !important;
    position: static !important;
    color: #16203c !important;
    font: 500 14px/1.5 "MBM Inter", Inter, Arial, sans-serif !important;
    margin-bottom: 6px !important;
    text-align: left !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none !important;
  }

  /* Pola układają się w kolumny zależnie od dostępnej szerokości */

  #PersonalData,
  #InstitutionData,
  #AdditionalData {
    display: grid !important;
    grid-template-columns:
      repeat(auto-fit, minmax(min(100%, 280px), 1fr)) !important;
    gap: 24px !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 24px 0 !important;
    padding: 0 !important;
  }

  #registrationPathSelection {
    width: 100% !important;
    margin: 0 0 24px !important;
    padding: 0 !important;
  }

  /* Wspólny wygląd pól wszystkich kroków */

  #mainCard .form-control {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    height: 44px !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    border: 1px solid #16203c !important;
    border-radius: 5px !important;
    background: #fff !important;
    color: #16203c !important;
    font: 400 16px/26px "MBM Inter", Inter, Arial, sans-serif !important;
    box-shadow: none !important;
  }

  #mainCard .form-control::placeholder {
    color: #8b91a0 !important;
    opacity: 1 !important;
  }

  #mainCard .form-control:focus {
    border-color: #145096 !important;
    outline: 2px solid #145096 !important;
    outline-offset: 2px !important;
  }

  #mainCard .form-control.errors {
    border-color: #c82727 !important;
  }

  #mainCard .form-control.valid {
    border-color: #16203c !important;
  }

  /* Wyłączenie starych ikon walidacji nakładanych na pola */

  #mainCard .form-group > div:has(input.form-control)::after,
  #mainCard input.form-control.errors + label.errors::after {
    content: none !important;
    display: none !important;
  }

  /* Checkboxy i radio */

  #mainCard .form-check {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    padding: 0 !important;
    margin: 0 0 12px !important;
  }

  #mainCard .form-check input[type="checkbox"],
  #mainCard .form-check input[type="radio"] {
    position: static !important;
    inset: auto !important;
    display: inline-block !important;
    appearance: auto !important;
    -webkit-appearance: auto !important;
    opacity: 1 !important;
    width: 22px !important;
    height: 22px !important;
    margin: 0 10px 0 0 !important;
    padding: 0 !important;
    vertical-align: middle !important;
    accent-color: #16203c !important;
    background: none !important;
    box-shadow: none !important;
    cursor: pointer !important;
  }

  #mainCard .form-check > label {
    position: static !important;
    display: inline !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #16203c !important;
    font: 400 14px/1.6 "MBM Inter", Inter, Arial, sans-serif !important;
    cursor: pointer !important;
  }

  #mainCard .form-check > label::before,
  #mainCard .form-check > label::after {
    content: none !important;
    display: none !important;
  }

  #mainCard .form-check input:focus-visible {
    outline: 2px solid #145096 !important;
    outline-offset: 3px !important;
  }

  /* Końcowy ekran zgód */

  #RegistrationTerms {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #RegistrationTerms > .form-group {
    margin-bottom: 20px !important;
  }

  #RegistrationTerms .form-check > p {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 0 20px !important;
    padding: 0 !important;
    color: #16203c !important;
    font: 400 14px/1.6 "MBM Inter", Inter, Arial, sans-serif !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
  }

  #RegistrationTerms label * {
    font: inherit !important;
    line-height: inherit !important;
  }

  #RegistrationTerms label p {
    display: inline !important;
    margin: 0 !important;
  }

  #RegistrationTerms a {
    color: #145096 !important;
    text-decoration: underline !important;
    text-underline-offset: 2px !important;
  }

  /* Komunikaty błędów */

  #mainCard label.errors,
  #mainCard label[id$="-error"] {
    display: block !important;
    width: 100% !important;
    margin: 6px 0 0 !important;
    padding: 0 !important;
    color: #c82727 !important;
    font: 500 12px/1.4 "MBM Inter", Inter, Arial, sans-serif !important;
    cursor: default !important;
  }

  /* Przyciski wszystkich kroków */

  #mainCard .mt-3.text-center {
    width: 100% !important;
    margin: 28px 0 0 !important;
    padding: 0 !important;
  }

  #ControlButtons {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 12px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #ControlButtons button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-height: 48px !important;
    margin: 0 !important;
    padding: 12px 24px !important;
    border: 1px solid #16203c !important;
    border-radius: 30px !important;
    background: #16203c !important;
    color: #fff !important;
    font: 600 14px/1.4 "MBM Inter", Inter, Arial, sans-serif !important;
    text-transform: none !important;
    box-shadow: none !important;
    cursor: pointer !important;
  }

  #ControlButtons button > i {
    display: none !important;
  }

  #ControlButtons #BackButton {
    background: #fff !important;
    color: #16203c !important;
  }

  #ControlButtons button:hover {
    background: #24345d !important;
    color: #fff !important;
  }

  #ControlButtons button:focus-visible {
    outline: 2px solid #145096 !important;
    outline-offset: 3px !important;
  }

  #ControlButtons button:disabled {
    opacity: .6 !important;
    cursor: wait !important;
  }
  
  #InstitutionData .form-group:nth-of-type(4) {
    grid-column: 1 !important;
  }

  /* Zachowanie ukrywania pól przez Coffee */

  #mainCard [hidden],
  #mainCard .d-none,
  #MainForm[style*="display: none"],
  #MainForm[style*="display:none"] {
    display: none !important;
  }

  /* Telefon */

  @media (max-width: 575.98px) {
    #mainCard > .card-header {
      padding: 20px 16px 0 !important;
    }

    #mainCard > .card-body {
      padding: 20px 16px !important;
    }

    #mainCard .sectionTitle {
      font-size: 24px !important;
    }

    #ControlButtons {
      flex-direction: column !important;
      align-items: stretch !important;
    }

    #ControlButtons button {
      width: 100% !important;
    }
  }
}

/* MBM FINAL 2 END */
}