.main-container:has(.page-container) {
  margin-bottom: calc(var(--nav-clearance) + 7.6rem);
}

.main-container .page-container {
  margin-top: 3rem;
  margin-bottom: 0;
}

@media (max-width: 768px) {
  .main-container .page-container {
    margin-top: 2.8rem;
  }
}

.main-container .page-container > * {
  animation: fade-in-up 0.5s cubic-bezier(0.22, 1, 0.36, 1) backwards;
}

.main-container .page-container > :nth-child(2) {
  animation-delay: .1s;
}

.main-container .page-container > :nth-child(3) {
  animation-delay: .2s;
}

.main-container .page-container > :nth-child(4) {
  animation-delay: .3s;
}

.main-container .page-container > :nth-child(n+5) {
  animation-delay: .4s;
}

.main-container .input-card,
.main-container .condition-fields,
.main-container .external-info-card,
.main-container .market-code-card {
  margin-bottom: 2rem;
}

  .main-container .input-card .input-card {
    margin-bottom: 0;
  }

.main-container .page-container .font-size-14.font-softtec-bold {
  margin: 1rem 0;
}

.main-container .registration-sheet > div:not(:first-child):not(.page-header) > h2.font-size-14.font-softtec-bold {
  margin-top: 0;
}

.main-container .button-container {
  position: fixed;
  left: 1rem;
  right: 1rem;
  bottom: calc(10.4rem + env(safe-area-inset-bottom, 0px));
  margin: 0 !important;
  padding: 0 !important;
  display: flex;
  flex-direction: row !important;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  background-color: transparent !important;
  box-shadow: none;
  width: auto !important;
  pointer-events: none;
}

  .main-container .button-container::before {
    content: none;
  }

  .main-container .button-container > * {
    pointer-events: auto;
  }

  .main-container .button-container > .d-flex:not(:has(*)) {
    display: none !important;
  }

  .main-container .button-container .red {
    display: flex;
    align-items: center;
    gap: .5rem;
    background-color: var(--softtec-white);
    border-radius: 2.4rem;
    box-shadow: var(--floating-shadow);
    padding: 1rem 1.5rem;
    font-size: var(--font-size-12);
    animation: fade-in-up .3s cubic-bezier(0.22, 1, 0.36, 1);
  }

  .main-container .button-container .booking-btn {
    display: inline-flex;
    align-items: center;
    gap: 1rem;
    width: auto !important;
    min-width: 0 !important;
    height: 4.8rem;
    min-height: 4.8rem;
    margin: 0 !important;
    padding: 0 2.4rem;
    border-radius: 2.4rem;
    box-shadow: var(--floating-shadow);
    font-size: var(--font-size-14);
    white-space: nowrap;
  }

    .main-container .button-container .booking-btn::before {
      font-family: "FontAwesome";
      content: "\f00c";
      font-size: 1.4rem;
    }

@media (hover: hover) and (pointer: fine) {
  .main-container .button-container .booking-btn:hover {
    transform: translateY(-2px);
  }
}

  .main-container .button-container:not(:has(.booking-btn)):not(:has(.red, .check-green)) {
    display: none;
  }

@media (max-width: 768px) {
  .main-container .button-container {
    bottom: calc(8.2rem + env(safe-area-inset-bottom, 0px));
  }

  .main-container .button-container .booking-btn {
    height: 4.4rem;
    min-height: 4.4rem;
    padding: 0 2rem;
  }
}

.main-container form:not(.is-dirty) .button-container .booking-btn {
  display: none !important;
}

.main-container form:not(.is-dirty) .button-container:not(:has(.red, .check-green)) {
  display: none !important;
}

.main-container form.is-dirty .button-container .booking-btn {
  animation: fade-in-up .35s cubic-bezier(0.22, 1, 0.36, 1);
}

.main-container .button-container .text-center.d-flex:has(.check-green) {
  display: flex;
  align-items: center;
  box-shadow: var(--floating-shadow);
  animation: none;
  min-height: 4.8rem;
  padding: 0 2.4rem;
  gap: 1rem;
  border-radius: 2.4rem;
  background-color: var(--softtec-dark-blue);
  color: var(--softtec-white);
  font-family: var(--font-medium);
  font-size: var(--font-size-14);
}

  .main-container .button-container .text-center.d-flex:has(.check-green) .check-green {
    display: none;
  }

  .main-container .button-container .text-center.d-flex:has(.check-green)::before {
    font-family: "FontAwesome";
    content: "\f00c";
    font-size: 1.4rem;
    animation: confirm-pop .45s cubic-bezier(0.34, 1.56, 0.64, 1);
  }

@media (max-width: 768px) {
  .main-container .button-container .text-center.d-flex:has(.check-green) {
    min-height: 4.4rem;
    padding: 0 2rem;
  }
}