._layout_1ncgp_1 {
  min-height: 100vh;
  isolation: isolate;
}
._iframeContainer_1ao80_1 {
  position: relative;

  display: flex;
  flex-direction: column;

  width: 100%;
  min-height: 100vh;

  isolation: isolate;
}

._iframeContainer_1ao80_1::before {
  content: "";
  position: fixed;
  inset: 0;

  background-image: var(--bg-image);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

  filter: blur(var(--bg-image-blur));
  transform: scale(1.05);

  pointer-events: none;
  z-index: -2;
}

._iframeContainer_1ao80_1::after {
  content: "";
  position: fixed;
  inset: 0;

  background: var(--bg-image-overlay);

  pointer-events: none;
  z-index: -1;
}

/* Hide backgrounds when disabled */
._iframeContainer_1ao80_1[data-show-background="false"]::before,
._iframeContainer_1ao80_1[data-show-background="false"]::after {
  display: none;
}

._scrollArea_1ao80_93 {
  flex: 1;

  width: 100%;
  height: 100%;

  overflow-y: auto;

  display: flex;
  flex-direction: column;

  -webkit-overflow-scrolling: touch;
  padding: 1rem 2rem;
}

._iframeContainer_1ao80_1[data-show-background="true"] {
  --text-on-page-primary: var(--brand-white);
  --text-on-page-secondary: color-mix(
    in srgb,
    var(--brand-white) 75%,
    transparent
  );
}

@media (max-width: 600px) {
  ._scrollArea_1ao80_93 {
    padding: 0.5rem 1rem;
  }
}
._logoButton_79e19_1 {
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}

._logo_79e19_1,
._logoGeneric_79e19_23 {
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

._logo_79e19_1 {
  background-image: var(--header-logo);
}

._logoGeneric_79e19_23 {
  background-image: var(--header-logoGeneric);
}
._overlay_4riuh_1 {
  position: fixed;
  inset: 0;
  background: rgb(0 0 0 / 60%);
  backdrop-filter: blur(4px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}

._modal_4riuh_23 {
  width: min(90vw, 450px);
  background: var(--modal-bg);
  border-radius: var(--border-radius);
  padding: 2rem;
  text-align: center;
  box-shadow: 0 20px 60px rgb(0 0 0 / 30%);
}

._title_4riuh_41 {
  margin: 0 0 1rem;
  color: var(--text-btn-secondary-main);
  font-size: 1.75rem;
  font-weight: 700;
}

._message_4riuh_55 {
  margin: 0 0 2rem;
  color: var(--text-main);
  line-height: 1.6;
}

._actions_4riuh_67 {
  display: flex;
  justify-content: center;
  gap: 1rem;
}
._headerWrapper_114vq_1 {
  display: grid;
  grid-template-columns: 1fr 3fr 1fr;
  align-items: center;
  width: 100%;
  height: 70px;
  padding: 0 2rem;
  background-color: var(--background-secondary);
  border-bottom: 2px solid var(--active-divider);
}

._headerLeft_114vq_23 {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  height: 100%;
}

._logoContainer_114vq_37 {
  height: 60px;
  width: 200px;
}

._headerMiddle_114vq_47 {
  display: flex;
  align-items: center;
  justify-content: center;
}

._title_114vq_59 {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--text-main);
}

._headerRight_114vq_71 {
  display: flex;
  align-items: center;
  gap: 1rem;
}

._userInfo_114vq_83 {
  min-width: 0;
  max-width: 100%;
  white-space: normal;
  text-align: right;
}

._welcomeUser_114vq_97 {
  font-weight: 600;
  white-space: nowrap;
}

._accountBalance_114vq_107 {
  font-size: 0.9rem;
  white-space: nowrap;
}

._balanceLabelMobile_114vq_117 {
  display: none;
}

._menuWrapper_114vq_125 {
  position: relative;
}

._menuButton_114vq_133 {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 40px;
  height: 40px;

  background: var(--btn-secondary-bg);
  color: var(--btn-secondary-text);

  border: 1px solid var(--btn-secondary-border);
  border-radius: 0.5rem;

  cursor: pointer;
}

._menuButton_114vq_133:hover {
  background: var(--btn-secondary-bg-hover);
  color: var(--btn-secondary-text-hover);
  border-color: var(--btn-secondary-border-hover);
}

._menu_114vq_125 {
  position: absolute;
  top: calc(100% + 0.5rem);
  right: 0;
  z-index: 1000;

  display: flex;
  flex-direction: column;

  min-width: 180px;
  padding: 0.25rem;

  background: var(--active-card-surface);
  backdrop-filter: blur(var(--active-card-surface-blur));
  -webkit-backdrop-filter: blur(var(--active-card-surface-blur));

  border: 1px solid var(--active-card-surface-border);
  border-radius: 0.5rem;

  box-shadow: 0 4px 12px var(--box-shadow-color);
}

._menuItem_114vq_223 {
  padding: 0.6rem 0.75rem;

  background: none;
  border: none;
  border-radius: 0.375rem;

  color: var(--active-text-on-card-primary);
  font-size: 1rem;
  text-align: left;

  cursor: pointer;
}

._menuItem_114vq_223:hover {
  background: var(--btn-secondary-bg-hover);
  color: var(--btn-secondary-text-hover);
}

/* ==========================================
   MOBILE
   ========================================== */

@media (max-width: 600px) {
  ._headerWrapper_114vq_1 {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    row-gap: 0.75rem;
    align-items: center;
    height: auto;
    min-height: 0;
    padding: 0.5rem 1rem;
  }

  ._headerLeft_114vq_23 {
    grid-column: 1;
    grid-row: 1 / -1;
    align-self: stretch;
    height: auto;
  }

  ._logoContainer_114vq_37 {
    width: 170px;
    height: 100%;
    min-height: 75px;
  }

  ._headerRight_114vq_71 {
    display: contents;
  }
  ._headerRight_114vq_71 .btnSecondary {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
    align-self: start;

    width: 90px;
    height: 36px;
    padding: 0.2rem 0.5rem;
    font-size: 0.9rem;
  }

  ._userInfo_114vq_83 {
    grid-column: 2;
    grid-row: 2;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-self: end;
    gap: 0;
  }

  ._balanceLabelDesktop_114vq_369 {
    display: none;
  }

  ._balanceLabelMobile_114vq_117 {
    display: inline;
  }

  ._headerMiddle_114vq_47 {
    display: none;
  }

  ._menuWrapper_114vq_125 {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
    align-self: start;
  }
}
._large_1u3t9_1 {
  width: 5rem;
  height: 6rem;
}

._large_1u3t9_1 ._bouncingContainer_1u3t9_11,
._large_1u3t9_1 ._spinningBall_1u3t9_13 {
  width: 5rem;
  height: 5rem;
}

._large_1u3t9_1._ballWrapper_1u3t9_23::after {
  width: 3.25rem; /* scale the ground shadow with the ball */
}

._large_1u3t9_1 ._bouncingBall_1u3t9_31 {
  width: 5rem;
  height: 5rem;
}

._preloadImage_1u3t9_41 {
  position: absolute;
  width: 0;
  height: 0;
  opacity: 0;
  pointer-events: none;
}

._loadingContainer_1u3t9_57 {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
}

._ballWrapper_1u3t9_23 {
  position: relative;
  width: 3rem;
  height: 4rem;
}

._ballWrapper_1u3t9_23::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 9px;
  width: 2rem;
  height: 0.5rem;
  transform: translateX(-50%);

  background: rgba(0, 0, 0, 0.75);
  border-radius: 50%;
  filter: blur(4px);

  animation: _shadowBounce_1u3t9_1 1.2s infinite linear;
}

._bouncingContainer_1u3t9_11 {
  position: relative;
  width: 3rem;
  height: 3rem;

  animation: _bounce_1u3t9_1 1.2s infinite linear;
}

._spinningBall_1u3t9_13 {
  width: 3rem;
  height: 3rem;
  object-fit: contain;
  animation: _spin_1u3t9_13 1.2s infinite linear;
  will-change: transform;
}

._ballLightMask_1u3t9_147 {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  pointer-events: none;

  box-shadow: inset 4px 4px 8px rgb(0 0 0 / 35%);

  background: radial-gradient(
    circle at 30% 30%,
    rgb(255 255 255 / 90%) 0%,
    transparent 20%
  );
}

@keyframes _spin_1u3t9_13 {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

@keyframes _bounce_1u3t9_1 {
  0% {
    transform: translateY(-24px);
  }

  30% {
    transform: translateY(0);
  }

  60% {
    transform: translateY(-10px);
  }

  85% {
    transform: translateY(0);
  }

  100% {
    transform: translateY(-24px);
  }
}

@keyframes _shadowBounce_1u3t9_1 {
  0% {
    opacity: 0.3;
    transform: translateX(-50%) scale(0.7);
  }

  30% {
    opacity: 1;
    transform: translateX(-50%) scale(1);
  }

  60% {
    opacity: 0.5;
    transform: translateX(-50%) scale(0.8);
  }

  85% {
    opacity: 0.9;
    transform: translateX(-50%) scale(0.95);
  }

  100% {
    opacity: 0.3;
    transform: translateX(-50%) scale(0.7);
  }
}
._verificationSection_pe0gw_1 {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 1rem;
  margin-top: 1rem;
  background-color: var(--active-card-surface);
  backdrop-filter: blur(var(--active-card-surface-blur));
  -webkit-backdrop-filter: blur(var(--active-card-surface-blur));
  border: 1px solid var(--active-card-surface-border);
  border-radius: 0.5rem;
}

._verificationSection_pe0gw_1 h3 {
  margin: 0;
  color: var(--text-main);
  font-size: 1.1rem;
  font-weight: 600;
}

._verificationSection_pe0gw_1 p {
  color: var(--text-on-page-secondary);
}

._input_pe0gw_49 {
  width: 100%;

  padding: 0.5rem;

  background: var(--form-background);

  color: var(--text-on-form-primary);

  border: 1px solid var(--input-border-color);
  border-radius: 4px;

  font-size: 1rem;
}

._input_pe0gw_49::placeholder {
  color: var(--text-on-form-secondary);
}

._input_pe0gw_49:focus {
  border-color: var(--input-focus-border-color);
  outline: none;
  box-shadow: 0 0 0 2px var(--input-focus-shadow-color);
}

._input_pe0gw_49:disabled {
  background: var(--input-disabled-bg-color);
  cursor: not-allowed;
}

._buttonGroup_pe0gw_109 {
  display: flex;
  justify-content: space-between;
}

._primaryButton_pe0gw_119 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.875rem 1.25rem;
  border: 1px solid var(--btn-primary-border);
  border-radius: var(--btn-border-radius);
  background: var(--btn-primary-bg);
  color: var(--text-btn-primary);
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
}

._primaryButton_pe0gw_119:hover:not(:disabled) {
  background: var(--btn-primary-bg-hover);
  color: var(--text-btn-primary-hover);
  border-color: var(--btn-primary-border-hover);
}

._primaryButton_pe0gw_119:disabled {
  background: var(--btn-disabled-bg-color);
  border-color: var(--btn-disabled-border-color);
  color: var(--text-btn-disabled-color);
  cursor: not-allowed;
}

._secondaryButton_pe0gw_173 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.875rem 1.25rem;
  border: 1px solid var(--btn-secondary-border);
  border-radius: var(--btn-border-radius);
  background: var(--btn-secondary-bg);
  color: var(--btn-secondary-text);
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
}

._secondaryButton_pe0gw_173:hover {
  background: var(--btn-secondary-bg-hover);
  color: var(--text-btn-secondary-hover);
  border-color: var(--btn-secondary-border-hover);
}

._successMessage_pe0gw_213 {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  color: var(--selected-btn-color);
  font-weight: 600;
}

._preloadImage_pe0gw_229 {
  position: absolute;
  width: 0;
  height: 0;
  opacity: 0;
  pointer-events: none;
}

._editContactButton_pe0gw_245 {
  background: none;
  border: none;
  color: var(--text-on-page-secondary);
  cursor: pointer;
  font-size: 1rem;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
}

._editContactButton_pe0gw_245:hover {
  text-decoration: underline;
}

/* Used when the form sits inside the login card. */
._embedded_pe0gw_277 {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

._embedded_pe0gw_277 h3 {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 500;
}

._embedded_pe0gw_277 ._editContactButton_pe0gw_245 {
  color: inherit;
}

._embedded_pe0gw_277 ._buttonGroup_pe0gw_109 {
  flex-direction: column;
  gap: 0.5rem;
  margin-top: 1rem;
}

._embedded_pe0gw_277 ._buttonGroup_pe0gw_109 button {
  width: 100%;
  padding: 0.75rem;
  border-width: 2px;
  border-radius: 4px;
  font-size: 1rem;
}

@media (max-width: 600px) {
  ._buttonGroup_pe0gw_109 {
    flex-direction: column;
    gap: 0.5rem;
  }

  ._buttonGroup_pe0gw_109 button {
    width: 100%;
  }
}
._contentWrapper_zc0o0_1 {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

._footerText_zc0o0_13 {
  font-size: 0.875rem;
  color: var(--text-title);
  text-align: center;
  padding: 1rem 0;
}

._footerLink_zc0o0_27 {
  color: var(--text-title);
  text-decoration: none;
  transition: color 0.2s ease;
}

@media (max-width: 600px) {
  ._footerText_zc0o0_13 {
    padding: 0.5rem 0;
  }
}
._pageWrapper_1w24r_1 {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}

._pageWrapper_1w24r_1 > * {
  position: relative;
  z-index: 2;
}

._pageTitle_1w24r_29 {
  font-size: 2.2rem;
  font-weight: 600;
  color: var(--text-on-page-primary);
  text-align: center;
}

._pageSubtitle_1w24r_43 {
  font-size: 1.25rem;
  color: var(--text-on-page-secondary);
  text-align: center;
  padding-bottom: 1rem;
}

._loginContainer_1w24r_57 {
  display: flex;
  flex-direction: column;
  gap: 1rem;

  width: 100%;
  max-width: 600px;

  padding: 2rem;

  color: var(--active-text-on-card-primary);

  background: var(--active-card-surface);

  backdrop-filter: blur(var(--active-card-surface-blur));
  -webkit-backdrop-filter: blur(var(--active-card-surface-blur));

  border: 1px solid var(--active-card-surface-border);

  border-radius: 0.5rem;

  box-shadow: 0 4px 12px var(--box-shadow-color);
}

._loginContainer_1w24r_57 h1 {
  font-size: 1.5rem;
  font-weight: 500;
}

._loginContainer_1w24r_57 p {
  font-size: 1rem;
  color: var(--active-text-on-card-secondary);
}

._form_1w24r_125 {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

._formGroup_1w24r_137 {
  display: flex;
  flex-direction: column;
}

._formGroup_1w24r_137 label {
  font-weight: 500;
  color: var(--text-on-form-primary);
}

._formGroup_1w24r_137 input {
  padding: 0.5rem;

  background: var(--form-background);

  color: var(--text-on-form-primary);

  border: 1px solid var(--input-border-color);
  border-radius: 4px;

  font-size: 1rem;
}

._formGroup_1w24r_137 input::placeholder {
  color: var(--text-on-form-secondary);
}

._formGroup_1w24r_137 input:focus {
  border-color: var(--input-focus-border-color);
  outline: none;
  box-shadow: 0 0 0 2px var(--input-focus-shadow-color);
}

._formGroup_1w24r_137 input:invalid {
  background: var(--surface-input-invalid);
}

._formGroup_1w24r_137 input:disabled {
  background: var(--input-disabled-bg-color);
  cursor: not-allowed;
}

input:autofill,
textarea:autofill,
select:autofill {
  box-shadow: 0 0 0 1000px var(--brand-lightest) inset !important;
  color: var(--text-on-card-primary) !important;
}

._error_1w24r_235 {
  color: var(--color-error);
  font-size: 0.875rem;
  margin-top: 0.5rem;
}

._buttonGroup_1w24r_247 {
  display: flex;
  flex-direction: column;
  align-items: center;

  gap: 0.5rem;
  margin-top: 1rem;
}

._loginButton_1w24r_265 {
  width: 100%;

  padding: 0.75rem;
  margin-top: 1rem;

  background-color: var(--btn-primary-bg);
  color: var(--btn-primary-text);

  border: 2px solid var(--btn-primary-border);
  border-radius: 4px;

  font-size: 1rem;
  cursor: pointer;

  box-shadow: 0 2px 8px var(--box-shadow-color);
}

._loginButton_1w24r_265:hover:not(:disabled) {
  background-color: var(--btn-primary-bg-hover);
  color: var(--btn-primary-text-hover);
  border-color: var(--btn-primary-border-hover);
}

._loginButton_1w24r_265:disabled {
  background-color: var(--input-disabled-bg-color);
  cursor: not-allowed;
}

._textButton_1w24r_323 {
  width: fit-content;

  background: none;
  border: none;

  color: var(--active-text-on-card-tertiary);

  cursor: pointer;

  padding: 0;
  margin-top: 0.5rem;
}

._textButton_1w24r_323:hover {
  color: var(--brand-primary);
}

._orSeparator_1w24r_359 {
  width: 100%;

  display: grid;
  grid-template-columns: 1fr auto 1fr;

  align-items: center;
  column-gap: 0.75rem;

  margin: 1rem 0;

  font-weight: 500;
  text-align: center;

  color: var(--active-text-on-card-tertiary);
}

._orSeparator_1w24r_359::before,
._orSeparator_1w24r_359::after {
  content: "";

  width: 100%;
  height: 1px;

  background-color: var(--active-text-on-card-tertiary);
}

._guestButton_1w24r_413 {
  width: 100%;

  padding: 0.75rem;
  margin-top: 0.5rem;

  background-color: var(--btn-secondary-bg);
  color: var(--btn-secondary-text);

  border: 2px solid var(--btn-secondary-border);
  border-radius: 4px;

  font-size: 1rem;
  cursor: pointer;

  box-shadow: 0 1px 4px var(--box-shadow-color);
}

._guestButton_1w24r_413:hover {
  background-color: var(--btn-secondary-bg-hover);
  color: var(--btn-secondary-text-hover);
  border-color: var(--btn-secondary-border-hover);
}

/* ==========================================
   MOBILE
   ========================================== */

@media (max-width: 600px) {
  ._pageTitle_1w24r_29 {
    font-size: 1.6rem;
  }

  ._pageSubtitle_1w24r_43 {
    font-size: 1rem;
    padding-bottom: 0.35rem;
  }

  ._pageWrapper_1w24r_1 {
    gap: 0.25rem;
  }

  ._loginContainer_1w24r_57 {
    margin: 0 1rem;
    gap: 0.75rem;
    padding: 1rem;
  }

  ._loginContainer_1w24r_57 h1 {
    font-size: 1.25rem;
  }

  ._loginContainer_1w24r_57 p {
    font-size: 0.9rem;
  }

  ._form_1w24r_125 {
    gap: 0.6rem;
  }

  ._buttonGroup_1w24r_247 {
    gap: 0.25rem;
    margin-top: 0.5rem;
  }

  ._loginButton_1w24r_265,
  ._guestButton_1w24r_413 {
    padding: 0.6rem;
    margin-top: 0.4rem;
  }

  ._textButton_1w24r_323 {
    margin-top: 0;
    min-height: 2.5rem;
  }

  ._orSeparator_1w24r_359 {
    margin: 0;
  }
}

@media (max-width: 340px) {
  ._pageWrapper_1w24r_1 {
    padding: 0 0.75rem;
  }

  ._pageTitle_1w24r_29 {
    font-size: 1.3rem;
  }
}
._dayPickerWrapper_183x3_1 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 0;
}

._calendarWrapper_183x3_17 {
  display: flex;
  min-width: 0;
  min-height: 0;
}

._calendarShell_183x3_29 {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  background: var(--active-card-surface);
  border: 1px solid var(--active-card-surface-border);
  backdrop-filter: blur(var(--active-card-surface-blur));
  -webkit-backdrop-filter: blur(var(--active-card-surface-blur));
  border-radius: 0.5rem;
  padding: 0.75rem;
  width: fit-content;
  min-height: 26.125rem;
  font-family: var(--font-family);
}

/* ==================================================
   React Day Picker Overrides
   ================================================== */

._calendar_183x3_17 {
  width: 100%;
}

._calendar_183x3_17 .rdp-root {
  width: 100%;
}

._calendar_183x3_17 .rdp-months {
  justify-content: center;
}

._calendar_183x3_17 .rdp-month {
  position: relative;
}

/* ==================================================
   Hide Header / Navigation
   ================================================== */

._calendar_183x3_17 .rdp-month_caption {
  display: none;
}

/* ==================================================
   Custom Header / Navigation
   ================================================== */

._calendarHeader_183x3_125 {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  width: 95%;
  margin-bottom: 1.5rem;
}

._calendarHeader_183x3_125 span {
  font-size: 1rem;
  font-weight: 600;
}

._calendarHeader_183x3_125 button {
  width: 1rem;
  height: 1rem;

  color: var(--active-text-on-card-secondary);

  border: none;
  border-radius: 0.5rem;

  background: transparent;
  cursor: pointer;

  font-size: 1rem;
  font-weight: 500;
  transition: background-color 0.2s ease;
}

._calendarHeader_183x3_125 button:hover {
  color: var(--active-text-on-card-primary);
  background: color-mix(in srgb, var(--primary-btn-color) 12%, transparent);
}

/* ==================================================
   Weekday Headings
   ================================================== */

._calendar_183x3_17 .rdp-weekdays {
  margin-bottom: 0.75rem;
}

._calendar_183x3_17 .rdp-weekday {
  font-size: 0.8rem;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--text-muted);
}

/* ==================================================
   Calendar Days
   ================================================== */

._calendar_183x3_17 .rdp-day {
  width: 3rem;
  height: 3rem;
  border: 1px solid transparent;
  border-radius: 0.5rem;
  border: 1px solid var(--active-calendar-hover-border);
  transition: transform 0.15s ease, background-color 0.15s ease,
    color 0.15s ease;
}

._calendar_183x3_17 .rdp-day_button {
  width: 3.2rem;
  height: 3.2rem;

  color: var(--active-text-on-card-primary);

  border: none;
  border-radius: 0.5rem;

  background: transparent;
  cursor: pointer;

  transition: background-color 0.15s ease, color 0.15s ease;
}

/* Hover */

._calendar_183x3_17 .rdp-day:hover:not(.rdp-disabled):not(.rdp-selected) {
  background: var(--active-calendar-hover);
}

._calendar_183x3_17 .rdp-day_button:hover {
  color: var(--active-calendar-hover-text);
}

/* Today */

._calendar_183x3_17 .rdp-today .rdp-day_button {
  background: var(--active-calendar-today-background);
  backdrop-filter: blur(var(--active-calendar-background-blur));
  -webkit-backdrop-filter: blur(var(--active-calendar-background-blur));
  border: 1px solid var(--active-calendar-today-border);
}

._calendar_183x3_17 .rdp-today:hover .rdp-day_button {
  background: var(--active-calendar-today-bg-hover);
  border: 1px solid var(--active-calendar-border);
}

/* Selected Day */

._calendar_183x3_17 .rdp-selected .rdp-day_button {
  color: var(--active-text-on-card-primary);
  background: var(--active-selected-background);
  border: 1px solid var(--active-selected-border);
}

._calendar_183x3_17 .rdp-selected:hover .rdp-day_button {
  border: 1px solid var(--active-selected-border);
  background: var(--active-selected-bg-hover);
}

/* Outside Month */

._calendar_183x3_17 .rdp-outside .rdp-day_button {
  color: var(--text-muted);
}

/* ==================================================
   Disabled Days
   ================================================== */

._calendar_183x3_17 .rdp-disabled {
  opacity: 0.35;
}

._calendar_183x3_17 .rdp-disabled .rdp-day_button {
  color: var(--text-muted);
  cursor: not-allowed;
}

._calendar_183x3_17 .rdp-disabled:hover {
  background: transparent;
  transform: none;
}

._calendar_183x3_17 .rdp-disabled:hover .rdp-day_button {
  background: transparent;
  cursor: not-allowed;
}

/* Optional visual cue */

._calendar_183x3_17 .rdp-disabled .rdp-day_button:hover {
  outline: 1px solid
    color-mix(in srgb, var(--error-color, #d32f2f) 25%, transparent);
}

/* ==================================================
   Focus State
   ================================================== */

._calendar_183x3_17 .rdp-day_button:focus-visible {
  outline: 2px solid var(--primary-btn-color);
  outline-offset: 2px;
}

._hint_183x3_447 {
  text-align: center;
  font-size: 0.9rem;
  color: var(--text-muted);
  padding: 0.5rem;
}

/* ==========================================
   MOBILE
   ========================================== */

@media (max-width: 600px) {
  ._calendarWrapper_183x3_17 {
    width: 100%;
  }

  ._calendarShell_183x3_29 {
    width: 100%;
    min-width: 0;
    padding: 0.5rem;
    min-height: auto;
  }

  ._calendarHeader_183x3_125 {
    margin-bottom: 1rem;
  }

  ._calendarHeader_183x3_125 button {
    width: 2rem;
    height: 2rem;
    font-size: 1.2rem;
  }

  ._calendar_183x3_17 .rdp-month {
    width: 100%;
  }

  ._calendar_183x3_17 .rdp-weeks {
    width: 100%;
  }

  ._calendar_183x3_17 table {
    width: 100%;
    table-layout: fixed;
  }

  ._calendar_183x3_17 .rdp-day {
    width: 100%;
    aspect-ratio: 1;
    height: auto;
  }

  ._calendar_183x3_17 .rdp-day_button {
    width: 100%;
    aspect-ratio: 1;
    height: auto;
  }
}
._accordionWrapper_q7txh_1 {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  width: 100%;
}

/* ==================================================
   Section card (Date / Time) — button + its expanded
   content render as one continuous card
   ================================================== */

._sectionCard_q7txh_25 {
  background: var(--active-card-surface);
  border: 1px solid var(--active-card-surface-border);
  border-radius: 0.5rem;

  backdrop-filter: blur(var(--active-card-surface-blur));
  -webkit-backdrop-filter: blur(var(--active-card-surface-blur));

  overflow: hidden;
}

._sectionToggle_q7txh_47 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 48px;

  padding: 0.875rem 1rem;

  color: var(--active-text-on-card-primary);
  font-size: 1rem;
  font-weight: 600;
  text-align: left;

  background: none;
  border: none;

  cursor: pointer;
}

._sectionToggle_q7txh_47[aria-expanded="true"] {
  display: none;
}

._toggleLabel_q7txh_95 {
  flex: 1;
}

._sectionToggle_q7txh_47::after {
  content: "▾";
  margin-left: 0.75rem;
  transition: transform 0.2s ease;
}

._sectionToggle_q7txh_47[aria-expanded="true"]::after {
  transform: rotate(180deg);
}

._sectionContent_q7txh_123 {
  padding: 0.75rem;
}

/* ==================================================
   Smooth expand/collapse
   Animates a grid row between 0fr and 1fr, which
   CSS can transition smoothly (unlike height: auto).
   overflow: hidden on the inner wrapper clips content
   while collapsed.
   ================================================== */

._collapse_q7txh_147 {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.25s ease;
}

._collapseOpen_q7txh_159 {
  grid-template-rows: 1fr;
}

._collapseInner_q7txh_167 {
  overflow: hidden;
  min-height: 0;
}

/* ==================================================
   Time groups (nested within the Time panel)
   ================================================== */

._groupBlock_q7txh_185 {
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--active-card-surface-border);
}

._groupBlock_q7txh_185:last-child {
  border-bottom: none;
}

._groupToggle_q7txh_203 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 44px;

  padding: 0.75rem;

  color: var(--active-text-on-card-primary);
  font-size: 0.95rem;
  font-weight: 500;
  text-align: left;

  background: color-mix(in srgb, var(--primary-btn-color) 12%, transparent);
  border: 1px solid var(--active-calendar-selected-border);
  border-radius: 0.5rem;

  cursor: pointer;
  transition: all 0.2s ease-in-out;
}

._groupToggle_q7txh_203[aria-expanded="true"] {
  background: var(--active-selected-background);
  border-color: var(--active-selected-border);
}

._groupToggle_q7txh_203::after {
  content: "▾";
  margin-left: 0.75rem;
  transition: transform 0.2s ease;
}

._groupToggle_q7txh_203[aria-expanded="true"]::after {
  transform: rotate(180deg);
}

._slotGrid_q7txh_277 {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(90px, 1fr));
  gap: 0.5rem;

  margin-top: 0.5rem;
  padding: 0 0.25rem;
}

._timeSlotButton_q7txh_295 {
  min-height: 44px;
  padding: 0.6rem;

  color: var(--active-text-on-card-primary);
  font-size: 0.9rem;

  background: color-mix(in srgb, var(--primary-btn-color) 12%, transparent);
  border: 1px solid var(--active-calendar-selected-border);
  border-radius: 0.5rem;

  cursor: pointer;
  transition: all 0.2s ease-in-out;
}

._timeSlotButton_q7txh_295[aria-pressed="true"] {
  background: var(--active-selected-background);
  border-color: var(--active-selected-border);
}

._loadingText_q7txh_335 {
  padding: 1rem;
  color: var(--active-text-on-card-secondary);
  text-align: center;
}
._timeGroupSelectorWrapper_nkna3_1 {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-width: clamp(14rem, 20vw, 18rem);
  background: var(--active-card-surface);
  border: 1px solid var(--active-card-surface-border);
  backdrop-filter: blur(var(--active-card-surface-blur));
  -webkit-backdrop-filter: blur(var(--active-card-surface-blur));
  border-radius: 0.5rem;
  padding: 0.75rem;
}

._timeGroupSelectorLabel_nkna3_27 {
  font-size: 1rem;
  font-weight: 600;
  color: var(--text-main);
}

._timeGroupSelectorGrid_nkna3_39 {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
  gap: 0.75rem;
  margin-top: 1rem;
  padding: 0 0.5rem;
}

._timeGroupSelectorButton_nkna3_55 {
  padding: 12px;
  color: var(--active-text-on-card-primary);
  background: color-mix(in srgb, var(--primary-btn-color) 12%, transparent);
  border: 1px solid var(--active-calendar-selected-border);
  border-radius: 0.5rem;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}

._timeGroupSelectorButton_nkna3_55:hover {
  color: var(--active-calendar-hover-text);
  background: var(--active-calendar-hover);
  border: 1px solid var(--active-calendar-hover-border);
}

._timeGroupSelectorButton_nkna3_55[aria-pressed="true"] {
  background: var(--active-selected-background);
  border: 1px solid var(--active-selected-border);
}

._timeGroupSelectorButton_nkna3_55[aria-pressed="true"]:hover {
  background: var(--active-selected-bg-hover);
  color: var(--text-secondary);
}

._timeGroupSelectorButton_nkna3_55:focus-visible {
  outline: 2px solid var(--primary-btn-color);
  outline-offset: 2px;
}

._active_nkna3_117,
._inactive_nkna3_119 {
  transition: opacity 250ms ease, transform 250ms ease;
}

._active_nkna3_117 {
  opacity: 1;
  transform: translateY(0);
}

._inactive_nkna3_119 {
  opacity: 0;
  transform: translateY(8px);
  pointer-events: none;
}
._timeWrapper_1nnim_1 {
  display: flex;
  flex-direction: column;
  background: var(--active-card-surface);
  border: 1px solid var(--active-card-surface-border);
  backdrop-filter: blur(var(--active-card-surface-blur));
  -webkit-backdrop-filter: blur(var(--active-card-surface-blur));
  border-radius: 0.5rem;
  padding: 0.75rem;
  min-height: 0;
  min-width: clamp(15rem, 20vw, 18rem);
  height: 100%;
}

._timeShell_1nnim_29 {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
}

._label_1nnim_43 {
  font-size: 1rem;
  font-weight: 600;
  color: var(--text-main);
}

._timeGrid_1nnim_55 {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;

  flex: 1;
  min-height: 0;
  overflow-y: auto;

  padding: 0 0.5rem;
}

._timeGrid_1nnim_55::-webkit-scrollbar-thumb {
  background: transparent;
}

._timeGrid_1nnim_55:hover::-webkit-scrollbar-thumb {
  background: var(--primary-btn-color);
}

._timeButton_1nnim_95 {
  padding: 12px;
  color: var(--active-text-on-card-primary);
  background: color-mix(in srgb, var(--primary-btn-color) 12%, transparent);
  border: 1px solid var(--active-calendar-selected-border);
  border-radius: 0.5rem;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}

._timeButton_1nnim_95:hover {
  background: var(--active-calendar-hover);
  color: var(--text-secondary);
}

._timeButton_1nnim_95[aria-pressed="true"] {
  background: var(--active-selected-background);
  border: 1px solid var(--active-selected-border);
}

._timeButton_1nnim_95[aria-pressed="true"]:hover {
  background: var(--active-selected-bg-hover);
  color: var(--text-secondary);
}

._active_1nnim_145,
._inactive_1nnim_147 {
  transition: opacity 250ms ease, transform 250ms ease;
}

._active_1nnim_145 {
  opacity: 1;
  transform: translateY(0);
}

._inactive_1nnim_147 {
  opacity: 0;
  transform: translateY(8px);
  pointer-events: none;
}
/* Main page layout wrapper */
._pageWrapper_wkwgm_3 {
  display: flex;
  flex-direction: column;
  flex: 1;
  flex-direction: column;
  justify-content: space-between;
}

._dateAndTimeSelectWrapper_wkwgm_19 {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/* Container holding the date and time selection components */
._dateAndTimeSelectorContainer_wkwgm_33 {
  display: flex;
  gap: 0.5rem;
  align-items: stretch;
}

._column_wkwgm_45 {
  display: flex;
  align-items: flex-start;
}

._timeGroupHeightWrapper_wkwgm_55,
._timeSelectorHeightWrapper_wkwgm_57 {
  width: 100%;
}

._timeGroupSelectorWrapper_wkwgm_65,
._timeWrapper_wkwgm_67 {
  height: 100%;
}

/* Primary page heading */
._title_wkwgm_77 {
  color: var(--text-main);
  font-size: 1rem;
  padding: 0.5rem 0;
}

/* Container for action buttons such as navigation or form actions */
._buttonContainer_wkwgm_91 {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

@media (max-width: 600px) {
  ._pageWrapper_wkwgm_3 {
    gap: 1rem;
  }
}
._bayConfigurationWrapper_8zjpn_1 {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  flex: 1;
}

._bayConfigurationTitle_8zjpn_15 {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  color: var(--text-main);
  font-size: 2rem;
  font-weight: 550;
  padding-bottom: 2rem;
}

._selectedDateAndTime_8zjpn_37 {
  color: var(--text-main);
  font-size: 1.25rem;
}

._countdownTimerWrapper_8zjpn_47 {
  display: flex;
  justify-content: center;
  align-items: center;
  padding-bottom: 1rem;
}

._groupSwitcher_8zjpn_61 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}

._groupSwitcherLabel_8zjpn_75 {
  min-width: 8rem;
  text-align: center;

  color: var(--text-main);
  font-size: 1.1rem;
  font-weight: 600;
}

._groupSwitcherButton_8zjpn_93 {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 2.25rem;
  height: 2.25rem;

  color: var(--active-text-on-card-secondary);

  border: none;
  border-radius: 0.5rem;

  background: transparent;
  cursor: pointer;

  font-size: 1rem;
  transition: background-color 0.2s ease;
}

._groupSwitcherButton_8zjpn_93:hover {
  color: var(--active-text-on-card-primary);
  background: color-mix(in srgb, var(--primary-btn-color) 12%, transparent);
}

._stackedFloors_8zjpn_143 {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;

  padding-bottom: 1rem;
}

._stackedFloorItem_8zjpn_159 {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;

  border-radius: 0.5rem;
  cursor: pointer;

  opacity: 0.6;
  transition: opacity 0.2s ease, background-color 0.2s ease;
}

._stackedFloorItem_8zjpn_159:hover {
  opacity: 1;
  background: color-mix(in srgb, var(--primary-btn-color) 8%, transparent);
}

._stackedFloorLabel_8zjpn_193 {
  text-align: center;

  color: var(--text-main);
  font-size: 0.85rem;
  font-weight: 500;
}

._buttonContainer_8zjpn_209 {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

._floorAccordion_8zjpn_225 {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

._floorAccordionItem_8zjpn_237 {
  background: var(--active-card-surface);
  backdrop-filter: blur(var(--active-card-surface-blur));
  -webkit-backdrop-filter: blur(var(--active-card-surface-blur));
  border: 1px solid var(--active-card-surface-border);
  border-radius: 0.5rem;
  overflow: hidden;
}

._floorAccordionToggle_8zjpn_255 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 48px;
  padding: 0.875rem 1rem;
  color: var(--active-text-on-card-primary);
  font-size: 1rem;
  font-weight: 600;
  background: none;
  border: none;
  cursor: pointer;
}

._floorAccordionToggle_8zjpn_255::after {
  content: "▾";
  margin-left: 0.75rem;
  transition: transform 0.2s ease;
}

._floorAccordionToggle_8zjpn_255[aria-expanded="true"]::after {
  transform: rotate(180deg);
}

._floorAccordionContent_8zjpn_305 {
  padding: 0.5rem 0.75rem 0.75rem;
}

@media (max-width: 600px) {
  ._bayConfigurationTitle_8zjpn_15 {
    flex-direction: column;
    padding: 0.5rem 0;
  }
  ._selectedDateAndTime_8zjpn_37 {
    display: flex;
    flex-direction: column;
    text-wrap: nowrap;
    gap: 0.5rem;
    padding: 0.5rem 0;
  }

  ._mobileLegend_8zjpn_339 {
    padding-bottom: 0.75rem;
  }

  ._floorAccordion_8zjpn_225 {
    width: calc(100% + 2rem);
    margin: 0 -1rem;
  }
}
._legend_12m9x_1 {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1.5rem;
}

._legendItem_12m9x_15 {
  display: flex;
  align-items: center;
  gap: 0.5rem;

  color: var(--text-main);
  font-size: 0.9rem;
}

._swatch_12m9x_33 {
  width: 1rem;
  height: 1rem;

  border-radius: 0.25rem;
  flex-shrink: 0;
}

._available_12m9x_49 {
  background: var(--active-range-bay-available);

  border: 1px solid var(--active-range-border-color);
}

._selected_12m9x_61 {
  background: var(--active-range-bay-selected);
}

._booked_12m9x_69 {
  background: var(--active-range-bay-booked);
  border: 1px solid var(--active-range-border-color);
}
._filters_ednfu_1 {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.5rem 0;
}

._filterButton_ednfu_17 {
  padding: 0.35rem 0.75rem;

  border: 1px solid var(--active-selected-border);
  border-radius: 1rem;

  background: var(--active-card-surface);
  backdrop-filter: blur(var(--active-card-surface-blur));
  -webkit-backdrop-filter: blur(var(--active-card-surface-blur));

  color: var(--text-main);

  font-size: 0.875rem;
  font-weight: 500;

  cursor: pointer;
  transition: all 0.2s ease;
}

._active_ednfu_55 {
  background: var(--active-selected-background);
  color: var(--text-btn-primary);
  border-color: var(--active-selected-border);
}

._active_ednfu_55:hover {
  background: var(--active-selected-bg-hover);
  color: var(--text-secondary);
}

@media (max-width: 600px) {
  ._filters_ednfu_1 {
    flex-wrap: nowrap;
    justify-content: flex-start;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    padding: 0.5rem 1rem;

    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* old Edge */
  }

  ._filters_ednfu_1::-webkit-scrollbar {
    display: none; /* Chrome, Safari, most mobile browsers */
  }

  ._filterButton_ednfu_17 {
    flex-shrink: 0;
  }
}
._rangeBayMapWrapper_fiqpf_1 {
  width: 100%;
}

._scrollContainer_fiqpf_9 {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  padding: 0.25rem 0;
}

._scrollContainer_fiqpf_9 svg {
  max-width: none;
}

@media (max-width: 600px) {
  ._scrollContainer_fiqpf_9 {
    width: calc(100% + 2rem);
    margin: 0 -1rem;
    padding: 0.25rem -1rem;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* old Edge */
  }

  ._scrollContainer_fiqpf_9::-webkit-scrollbar {
    display: none; /* Chrome, Safari, most mobile browsers */
  }

  ._noBleed_fiqpf_57 {
    margin: 0;
    padding: 0.25rem 0;
    width: 100%;
  }
}
._rangeMap_1hhdz_1 {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: auto;
}

._rangeMap_1hhdz_1 svg {
  flex-shrink: 0;
}

._bay_1hhdz_25 {
  fill: var(--active-range-bay-available);

  cursor: pointer;
  transition: fill 0.2s ease;
}

._label_1hhdz_39 {
  fill: var(--active-text-on-card-primary);
  font-family: var(--font-family);
  font-size: 1rem;
  font-weight: 700;
  user-select: none;
  pointer-events: none;
}

/* .bay:hover {
  fill: var(--active-range-bay-hover);
} */

._selected_1hhdz_65 {
  fill: var(--active-range-bay-selected);
  stroke-width: 3;
  stroke: var(--active-range-border-color);
}

/* .selected:hover {
  fill: var(--active-selected-bg-hover);
} */

._selectedLabel_1hhdz_85 {
  fill: var(--active-text-on-card-primary);
  font-family: var(--font-family);
  font-size: 1rem;
  font-weight: 700;
}

._booked_1hhdz_99 {
  fill: var(--active-range-bay-booked);
  cursor: not-allowed;
}

/* .booked:hover {
  fill: var(--active-range-bay-booked);
} */

._filteredOut_1hhdz_117 {
  cursor: not-allowed;
  fill: var(--active-range-bay-booked);
}

._filteredLabel_1hhdz_127 {
  fill: var(--active-text-on-card-primary);
  font-family: var(--font-family);
  font-size: 1rem;
  font-weight: 700;
  user-select: none;
  pointer-events: none;
}

._bookedLabel_1hhdz_145 {
  fill: var(--active-text-on-card-primary);
  font-family: var(--font-family);
  font-size: 1rem;
  font-weight: 700;
  user-select: none;
  pointer-events: none;
}

._divider_1hhdz_163 {
  stroke: var(--active-range-divider-color);
  stroke-width: 1.5;
  stroke-linecap: round;
  pointer-events: none;
}

._border_1hhdz_177 {
  fill: none;
  stroke: var(--active-range-border-color);
  stroke-width: 2.5;
  stroke-linecap: round;
  pointer-events: none;
}

._gradientTop_1hhdz_193 {
  stop-color: var(--active-range-bay-gradient-top);
}

._gradientBottom_1hhdz_201 {
  stop-color: var(--active-range-bay-gradient-bottom);
}

@media (max-width: 600px) {
  ._rangeMap_1hhdz_1 {
    justify-content: flex-start;
  }
}

@media (hover: hover) {
  ._bay_1hhdz_25:hover {
    fill: var(--active-range-bay-hover);
  }

  ._selected_1hhdz_65:hover {
    fill: var(--active-selected-bg-hover);
  }

  ._booked_1hhdz_99:hover {
    fill: var(--active-range-bay-booked);
  }
}
._selectedBaysSummary_z41pj_1 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  gap: 0.75rem;
}
._selectedBaysSummary_d1sxq_1 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0.75rem;
}

._countdownTimer_d1sxq_17 {
  font-size: 1rem;
  font-weight: 400;
}

._selectedBaysTitle_d1sxq_27 {
  font-size: 1rem;
  color: var(--text-main);
}

._editIcon_d1sxq_37 {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

._baySummaryList_d1sxq_49 {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  max-height: 300px;
  overflow-y: auto;
}

._baySummaryCard_d1sxq_65 {
  padding: 1rem;
  color: var(--text-main);
  background: var(--active-range-bay-selected);
  backdrop-filter: blur(var(--active-card-surface-blur));
  -webkit-backdrop-filter: blur(var(--active-card-surface-blur));
  border: 1px solid var(--active-card-surface-border);
  border-radius: 8px;
  cursor: pointer;
}

._baySummaryCard_d1sxq_65:hover {
  background: var(--active-selected-bg-hover);
}

._baySummaryHeader_d1sxq_95 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: var(--text-btn-selected);
}

._baySummaryPrice_d1sxq_109 {
  font-weight: 600;
}

._baySummaryDetails_d1sxq_117 {
  margin-top: 0.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  flex-wrap: wrap;
  color: var(--text-btn-selected);
  font-size: 0.9rem;
}

._removeBayButton_d1sxq_137 {
  display: flex;
  justify-content: center;
  align-items: center;
  background: var(--btn-remove-bg-color);
  color: var(--btn-remove-text-color);
  border: 1px solid var(--btn-remove-border-color);
  font-weight: 500;
  border-radius: 0.5rem;
  cursor: pointer;
  transition: opacity 0.2s ease-in-out;
  margin-top: 1rem;
  padding: 0.2rem 0.4rem;
  gap: 0.5rem;
}

._removeBayButton_d1sxq_137:hover {
  background: var(--btn-remove-bg-hover);
}

._baySummaryTotal_d1sxq_177 {
  display: flex;
  justify-content: center;
  width: 100%;

  font-weight: 500;
  font-size: 1.25rem;
  border-top: 1px solid var(--input-border-color);
  border-bottom: 1px solid var(--input-border-color);
}

@media (max-width: 600px) {
  ._selectedBaysSummary_d1sxq_1 {
    padding-bottom: 0.75rem;
  }
  ._baySummaryList_d1sxq_49 {
    flex-wrap: nowrap;
    max-height: none;
    overflow-y: visible;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;

    width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    padding: 0;

    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  ._baySummaryList_d1sxq_49::-webkit-scrollbar {
    display: none;
  }

  ._baySummaryCard_d1sxq_65 {
    flex-shrink: 0;
  }
}
._componentWrapper_hqsff_1 {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 0.5rem;
  padding-bottom: 2rem;
}

._titleWrapper_hqsff_17 {
  text-align: start;
}

._title_hqsff_17 {
  color: var(--text-main);
  font-size: 1.25rem;
  font-weight: 500;
}

._playersContainer_hqsff_37 {
  display: flex;
  flex-direction: row;
  gap: 1rem;
}

._option_hqsff_49 {
  padding: 0.5rem 1rem;
  border: 1px solid var(--btn-secondary-border);
  border-radius: 0.5rem;
  background: var(--btn-secondary-bg);
  cursor: pointer;
  font-size: 1rem;
}

._option_hqsff_49:hover {
  color: var(--btn-secondary-text-hover);
  background: var(--btn-secondary-bg-hover);
  border-color: var(--btn-secondary-border-hover);
}

._selected_hqsff_79 {
  border-color: var(--btn-selected-border);
  background-color: var(--btn-selected-bg);
  color: var(--btn-selected-text);
}

._selected_hqsff_79:hover {
  background-color: var(--btn-selected-bg-hover);
}
._componentWrapper_v7byc_1 {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  height: 8.5rem;
  gap: 0.5rem;
  padding-bottom: 1rem;
}

._titleWrapper_v7byc_19 {
  text-align: start;
}

._title_v7byc_19 {
  color: var(--text-main);
  font-size: 1.25rem;
  font-weight: 500;
}

._description_v7byc_39 {
  color: var(--text-subtitle-secondary);
}

._durationsContainer_v7byc_47 {
  display: flex;
  flex-direction: row;
  gap: 1rem;
}

._option_v7byc_59 {
  padding: 0.5rem 1rem;
  border: 1px solid var(--btn-secondary-border);
  border-radius: 0.5rem;
  background: var(--btn-secondary-bg);
  cursor: pointer;
  font-size: 1rem;
}

._option_v7byc_59:hover {
  color: var(--btn-secondary-text-hover);
  background: var(--btn-secondary-bg-hover);
  border-color: var(--btn-secondary-border-hover);
}

._selected_v7byc_89 {
  border-color: var(--btn-selected-border);
  background-color: var(--btn-selected-bg);
  color: var(--btn-selected-text);
}

._selected_v7byc_89:hover {
  background-color: var(--btn-selected-bg-hover);
}
._productSelectorWrapper_liyo7_1 {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  height: 13rem;
  gap: 0.5rem;
  padding-bottom: 2rem;
}

._titleWrapper_liyo7_19 {
  text-align: start;
}

._title_liyo7_19 {
  color: var(--text-main);
  font-size: 1.25rem;
  font-weight: 500;
}

._description_liyo7_39 {
  color: var(--text-subtitle-secondary);
}

._productsContainer_liyo7_47 {
  display: flex;
  flex-direction: row;
  gap: 1rem;
}

._productButton_liyo7_59 {
  display: flex;
  flex-direction: row;
  align-items: center;
  min-width: 120px;
  padding: 0.5rem 1rem;
  border: 1px solid var(--btn-secondary-border);
  border-radius: 0.5rem;
  background: var(--btn-secondary-bg);
  cursor: pointer;
  font-size: 1rem;
}

._productButton_liyo7_59:hover {
  color: var(--btn-secondary-text-hover);
  background: var(--btn-secondary-bg-hover);
  border-color: var(--btn-secondary-border-hover);
}

._selected_liyo7_97 {
  border-color: var(--btn-selected-border);
  background-color: var(--btn-selected-bg);
  color: var(--btn-selected-text);
}

._selected_liyo7_97:hover {
  background-color: var(--btn-selected-bg-hover);
}

._productIcon_liyo7_117 {
  width: 48px;
  height: 48px;

  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

._productPrice_liyo7_135 {
  margin-top: 8px;
  font-weight: 600;
}

._productButton_liyo7_59:disabled {
  cursor: not-allowed;
  background-color: var(--btn-disabled-bg-color);
  color: var(--btn-disabled-text-color);
}

._productButton_liyo7_59:disabled:hover {
  cursor: not-allowed;
}

@media (max-width: 600px) {
  ._productsContainer_liyo7_47 {
    flex-wrap: nowrap;
    min-width: 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  ._productsContainer_liyo7_47::-webkit-scrollbar {
    display: none;
  }

  ._productButton_liyo7_59 {
    flex-shrink: 0;
  }
}
._overlay_amxjz_1 {
  position: fixed;
  inset: 0;
  overflow-x: hidden;

  display: flex;
  align-items: center;
  justify-content: center;

  background: var(--modal-overlay);
  backdrop-filter: blur(1px);

  z-index: 1000;
}
._modal_amxjz_29 {
  display: flex;
  flex-direction: column;
  width: min(90vw, 500px);
  min-height: 602px;
  max-height: 90vh;
  overflow-y: auto;
  padding: 1rem;

  color: var(--text-on-frosted-card-primary);
  background: var(--active-modal-surface);

  backdrop-filter: blur(var(--active-modal-surface-blur));
  -webkit-backdrop-filter: blur(var(--active-modal-surface-blur));

  border: 1px solid var(--active-modal-surface-border);
  border-radius: 16px;
  box-shadow: 0 10px 30px var(--box-shadow-color), 0 2px 8px rgb(0 0 0 / 10%);
}

._modalTitle_amxjz_69 {
  text-align: center;

  font-size: 1.25rem;
  font-weight: 500;
}

._selectedDateAndTime_amxjz_83 {
  text-align: center;
  font-size: 1rem;
  font-weight: 400;
  margin-bottom: 1rem;
}

._buttonContainer_amxjz_97 {
  display: flex;
  justify-content: space-between;
}

._cancelButton_amxjz_107 {
  background-color: var(--btn-secondary-bg);
  color: var(--btn-secondary-text);
  border: 1px solid var(--btn-secondary-border);
  padding: 0.3rem 1rem;
  font-weight: 500;
  border-radius: 0.5rem;
  cursor: pointer;
  transition: opacity 0.2s ease-in-out;
}

._cancelButton_amxjz_107:hover {
  background-color: var(--btn-secondary-bg-hover);
  color: var(--btn-secondary-text-hover);
  border-color: var(--btn-secondary-border-hover);
  transition: opacity 0.2s ease-in-out;
}

._confirmButton_amxjz_143 {
  background-color: var(--btn-primary-bg);
  color: var(--btn-primary-text);
  border: 1px solid var(--btn-primary-border);
  padding: 0.3rem 1rem;
  font-weight: 500;
  border-radius: 0.5rem;
  cursor: pointer;
  transition: opacity 0.2s ease-in-out;
}

._confirmButton_amxjz_143:hover:not(:disabled) {
  background-color: var(--btn-primary-bg-hover);
  color: var(--btn-primary-text-hover);
  border-color: var(--btn-primary-border-hover);
  transition: opacity 0.2s ease-in-out;
}

._confirmButton_amxjz_143:disabled {
  background-color: var(--btn-disabled-bg-color);
  color: var(--btn-disabled-text-color);
  border-color: var(--btn-disabled-border-color);
  cursor: not-allowed;
}

._removeButton_amxjz_193 {
  background-color: var(--btn-remove-bg-color);
  color: var(--btn-remove-text-color);
  border: 1px solid var(--btn-remove-border-color);
  padding: 0.3rem 1rem;
  font-weight: 500;
  border-radius: 0.5rem;
  cursor: pointer;
  transition: opacity 0.2s ease-in-out;
}

._removeButton_amxjz_193:hover {
  background-color: var(--btn-remove-bg-hover);
  color: var(--btn-remove-text-hover);
  transition: opacity 0.2s ease-in-out;
}

@media (max-width: 600px) {
  ._modal_amxjz_29 {
    width: min(95vw, 500px);
    min-height: auto; /* removes the conflict entirely on short viewports */
  }
  ._playersContainer_amxjz_237 {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  ._playersContainer_amxjz_237::-webkit-scrollbar {
    display: none;
  }

  ._option_amxjz_261 {
    flex-shrink: 0;
  }

  ._durationsContainer_amxjz_269 {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  ._durationsContainer_amxjz_269::-webkit-scrollbar {
    display: none;
  }

  ._option_amxjz_261 {
    flex-shrink: 0;
  }

  ._productsContainer_amxjz_301 {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  ._productsContainer_amxjz_301::-webkit-scrollbar {
    display: none;
  }

  ._productButton_amxjz_325 {
    flex-shrink: 0;
  }
}
._overlay_8ar17_1 {
  position: fixed;
  inset: 0;
  background: rgb(0 0 0 / 60%);
  backdrop-filter: blur(4px);

  display: flex;

  z-index: 9999;
}

._modal_8ar17_23 {
  width: 100vw;
  height: 100vh;

  display: flex;
  flex-direction: column;
}

._content_8ar17_39 {
  flex: 1;
}

._loaderOverlay_8ar17_47 {
  position: absolute;
  inset: 0;

  display: flex;
  justify-content: center;
  align-items: center;

  background: var(--modal-bg);
  z-index: 1;
}

._iframe_8ar17_71 {
  width: 100%;
  height: 100%;
  border: none;
}

._actions_8ar17_83 {
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
  padding: 0.5rem;
}
._paymentSection_1ir0j_1 {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  height: 100%;
}

._buttonContainer_1ir0j_15 {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr auto 1fr;
  grid-template-rows: auto auto;

  padding: 1rem;
  margin-top: 1rem;
  background-color: var(--active-card-surface);
  backdrop-filter: blur(var(--active-card-surface-blur));
  -webkit-backdrop-filter: blur(var(--active-card-surface-blur));
  border: 1px solid var(--active-card-surface-border);
  border-radius: 0.5rem;
}

/* Button row spans all columns */
._buttons_1ir0j_47 {
  grid-column: 1 / -1;

  display: flex;
  align-items: center;
  width: 100%;
  gap: 0.5rem;
}

._buttons_1ir0j_47 button {
  flex: 1;
}

._buttons_1ir0j_47 span {
  flex-shrink: 0;
}

/* Helper text sits in the left grid column only */
._balanceMessage_1ir0j_83 {
  grid-column: 1;
  justify-self: center;

  margin: 0;
  text-align: center;
  font-size: 0.75rem;
  padding-top: 0.25rem;
}

._loaderContainer_1ir0j_103 {
  grid-column: 1 / -1;

  display: flex;
  justify-content: center;
  align-items: center;

  width: 100%;
  min-height: 80px;
}

/* Terms checkbox spans the full width, above the buttons */
._terms_1ir0j_127 {
  grid-column: 1 / -1;

  display: flex;
  align-items: flex-start;
  gap: 0.5rem;

  margin-bottom: 0.75rem;

  font-size: 0.9rem;
  color: var(--active-text-on-card-primary);
  cursor: pointer;
}

._terms_1ir0j_127 input {
  margin-top: 0.2rem;
  accent-color: var(--btn-primary-bg);
  cursor: pointer;
}

._terms_1ir0j_127 a {
  color: inherit;
  text-decoration: underline;
}

@media (max-width: 600px) {
  ._buttonContainer_1ir0j_15 {
    grid-template-columns: 1fr;
  }

  ._buttons_1ir0j_47 {
    flex-direction: column;
  }

  ._buttons_1ir0j_47 button {
    width: 100%;
  }

  ._balanceMessage_1ir0j_83 {
    grid-column: 1;
  }
}
._reviewBookingWrapper_1cwjh_1 {
  display: flex;
  flex-direction: column;
  flex: 1;
  width: 100%;
  justify-content: space-between;
}

._contentContainer_1cwjh_17 {
  display: flex;
  flex-direction: column;
  flex: 1;
}

._reviewSection_1cwjh_29 {
  display: flex;
  flex-direction: row;
  background-color: var(--active-card-surface);
  backdrop-filter: blur(var(--active-card-surface-blur));
  -webkit-backdrop-filter: blur(var(--active-card-surface-blur));
  border: 1px solid var(--active-card-surface-border);
  border-radius: 0.5rem;
  gap: 1rem;
}

/* Left Section */

._reviewBookingContainer_1cwjh_55 {
  display: flex;
  flex-direction: column;
  padding: 1rem;
}

._reviewTitleContainer_1cwjh_67 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  margin-bottom: 0.5rem;
}

._title_1cwjh_83 {
  color: var(--text-main);
  font-size: 1.25rem;
  font-weight: 550;
}

._subtitle_1cwjh_95 {
  font-size: 0.95rem;
  color: var(--text-on-page-secondary);
}

._bookingDetails_1cwjh_105 {
  display: flex;
  justify-content: space-between;
  gap: 1.5rem;
}

._lineItemsWrapper_1cwjh_117 {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  flex: 1;
}

._lineItem_1cwjh_117 {
  display: grid;
  grid-template-columns: 1.25rem 7rem 1fr;
  column-gap: 0.5rem;
}

._label_1cwjh_143 {
  flex-shrink: 0;
  color: var(--text-muted);
}

._labelTotal_1cwjh_153 {
  font-weight: 500;
}

._value_1cwjh_161 {
  font-weight: 500;
  padding-left: 1rem;
  white-space: nowrap;
}

._noWrap_1cwjh_173 {
  white-space: nowrap;
}

._basketSummary_1cwjh_181 {
  display: flex;
  flex-direction: column;
  padding-left: 1rem;
}

/* Right Section */

._multipleBaySummary_1cwjh_197 {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 1rem;
}

._breakdownRow_1cwjh_211 {
  display: grid;
  grid-template-columns:
    minmax(3rem, 4rem)
    minmax(4rem, 5rem)
    minmax(3.5rem, 4.5rem)
    1fr
    4.5rem;
  gap: 0.5rem;
}
._product_1cwjh_231 {
  margin-left: auto;
}

._amount_1cwjh_239 {
  min-width: 70px;
  text-align: right;
}

._breakdownRow_1cwjh_211 > * {
  white-space: nowrap;
  flex-shrink: 0;
}

._breakdownRow_1cwjh_211:not(:last-of-type) {
  border-bottom: 1px solid var(--input-border-color);
}

._breakdownTotal_1cwjh_267 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 1rem;
  border-top: 2px solid var(--input-border-color);
  font-size: 1.125rem;
  font-weight: 600;
}

/* Footer */

._buttonContainer_1cwjh_291 {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

@media (max-width: 600px) {
  ._reviewSection_1cwjh_29 {
    flex-direction: column;
  }

  ._value_1cwjh_161 {
    white-space: normal;
    min-width: 0;
  }

  ._breakdownScroll_1cwjh_323 {
    display: grid;
    grid-template-columns: repeat(5, max-content);
    column-gap: 1rem;
    row-gap: 0.125rem;

    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  ._breakdownScroll_1cwjh_323::-webkit-scrollbar {
    display: none;
  }

  ._breakdownRow_1cwjh_211 {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: subgrid;

    padding-bottom: 0.125rem;
    border-bottom: 1px solid var(--input-border-color);
  }

  ._breakdownRow_1cwjh_211 > * {
    white-space: nowrap;
  }

  ._breakdownRow_1cwjh_211:last-child {
    border-bottom: none;
  }

  ._product_1cwjh_231,
  ._amount_1cwjh_239 {
    justify-self: end;
    margin-left: 0;
    min-width: auto;
  }

  ._buttonContainer_1cwjh_291 {
    padding-top: 1rem;
  }

  ._bayList_1cwjh_411 {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 0.5rem;
  }
}
._pageWrapper_f4xhu_1 {
  display: flex;
  flex-direction: column;
  flex: 1;
  justify-content: center;
  align-items: center;
}

._contentWrapper_f4xhu_17 {
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: var(--active-card-surface);
  backdrop-filter: blur(var(--active-card-surface-blur));
  -webkit-backdrop-filter: blur(var(--active-card-surface-blur));
  border: 1px solid var(--active-card-surface-border);
  border-radius: 1rem;
  padding: 2rem;
  gap: 2rem;
}

._confirmationMessage_f4xhu_43 {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 1rem;
}

._title_f4xhu_59 {
  display: flex;
}

._inrangeTitle_f4xhu_67 {
  display: flex;
  gap: 0.5rem;
}

._subtitle_f4xhu_77 {
  display: flex;
}

._referenceNumbersWrapper_f4xhu_85 {
  display: flex;

  align-items: stretch;
  justify-content: center;
  gap: 1rem;
}

._referenceContainer_f4xhu_101 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--active-card-surface-border);
  border-radius: 1rem;
  padding: 1rem;
  gap: 1rem;
}

._referenceNumber_f4xhu_85 {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  font-size: 1.5rem;
}

._copyButton_f4xhu_139 {
  color: var(--active-text-on-card-secondary);
  background-color: var(--active-card-surface);
  backdrop-filter: blur(var(--active-card-surface-blur));
  -webkit-backdrop-filter: blur(var(--active-card-surface-blur));
  border: 1px solid var(--active-card-surface-border);
  border-radius: 0.5rem;
  padding: 0.5rem;
}

._copyButton_f4xhu_139:hover {
  cursor: pointer;
  border-color: var(--active-card-surface-border-hover);
}

._bookingSummary_f4xhu_169 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2rem;
}

._bookingDetails_f4xhu_181 {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
}

._icon_f4xhu_193 {
  display: flex;
}

._groupedDetails_f4xhu_201 {
  display: flex;
  flex-direction: column;
}

._date_f4xhu_211 {
  display: flex;
}

._time_f4xhu_219 {
  display: flex;
}

._players_f4xhu_227 {
  display: flex;
}

._bays_f4xhu_235 {
  display: flex;
}

._totalPaid_f4xhu_243 {
  display: flex;
}

._buttonContainer_f4xhu_251 {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding-top: 2rem;
  gap: 2rem;
}

._addToCalendar_f4xhu_271 {
  display: flex;
}

._makeAnotherBooking_f4xhu_279 {
  display: flex;
}

._completeAccountButton_f4xhu_287 {
  width: 100%;
  margin-top: 2rem;
}

._buttonContainer_f4xhu_251._withPrompt_f4xhu_297 {
  padding-top: 0;
}

@media (max-width: 600px) {
  ._contentWrapper_f4xhu_17 {
    padding: 1rem;
    gap: 1rem;
  }

  ._referenceNumbersWrapper_f4xhu_85 {
    flex-direction: column;
  }

  ._bookingSummary_f4xhu_169 {
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
  }

  ._buttonContainer_f4xhu_251 {
    flex-direction: column;
    gap: 1rem;
    padding-top: 0rem;
  }
  ._completeAccountButton_f4xhu_287 {
    margin-top: 0;
  }
}
._form_5e0up_1 {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

._section_5e0up_13 {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

._section_5e0up_13 h3 {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 600;
}

._field_5e0up_37 {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;

  font-size: 0.9rem;
  font-weight: 500;
}

._field_5e0up_37 input {
  padding: 0.5rem;

  background: var(--form-background);
  color: var(--text-on-form-primary);

  border: 1px solid var(--input-border-color);
  border-radius: 4px;

  font-size: 1rem;
}

._field_5e0up_37 input:focus {
  border-color: var(--input-focus-border-color);
  outline: none;
  box-shadow: 0 0 0 2px var(--input-focus-shadow-color);
}

._contact_5e0up_91 {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;

  padding: 0.75rem;

  border: 1px solid var(--input-border-color);
  border-radius: 0.5rem;
}

._contactLabel_5e0up_113 {
  font-size: 0.8rem;
  opacity: 0.75;
}

._contactValue_5e0up_123 {
  font-weight: 500;
  word-break: break-all;
}

._checkbox_5e0up_133 {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;

  font-size: 0.9rem;
  cursor: pointer;
}

._checkbox_5e0up_133 input {
  margin-top: 0.2rem;
  accent-color: var(--btn-primary-bg);
}

._hint_5e0up_161 {
  margin: 0;
  font-size: 0.9rem;
  opacity: 0.75;
}

._success_5e0up_173 {
  margin: 0;
  color: var(--selected-btn-color);
  font-weight: 600;
}

._error_5e0up_185 {
  margin: 0;
  color: var(--color-error);
  font-weight: 600;
}

._actions_5e0up_197 {
  display: flex;
  gap: 0.75rem;
}

._actions_5e0up_197 button {
  flex: 1;
  padding: 0.75rem;
  font-size: 1rem;
}

._contactHeader_5e0up_219 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}

._linkButton_5e0up_233 {
  padding: 0;

  background: none;
  border: none;
  color: inherit;

  font: inherit;
  font-size: 0.9rem;
  font-weight: 600;
  text-decoration: underline;

  cursor: pointer;
}

._linkButton_5e0up_233:disabled {
  opacity: 0.5;
  cursor: default;
}

._contactEditor_5e0up_273 {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;

  margin-top: 0.5rem;
}

._contactEditorActions_5e0up_289 {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

._contactEditorActions_5e0up_289 button {
  flex: 1;
  padding: 0.6rem;
  font-size: 0.95rem;
  white-space: nowrap;
}

@media (max-width: 600px) {
  ._actions_5e0up_197 {
    flex-direction: column;
  }
}
._account_5dedt_1 {
  display: flex;
  align-items: flex-start;
  gap: 2rem;

  width: 100%;
  max-width: 960px;
  margin: 0 auto;
}

._menu_5dedt_21,
._content_5dedt_23 {
  background: var(--active-card-surface);
  border: 1px solid var(--active-card-surface-border);
  border-radius: 0.75rem;
  backdrop-filter: blur(var(--active-card-surface-blur));
  -webkit-backdrop-filter: blur(var(--active-card-surface-blur));
  color: var(--text-main);
}

._menu_5dedt_21 {
  position: sticky;
  top: 0;

  display: flex;
  flex: 0 0 220px;
  flex-direction: column;
  gap: 0.75rem;

  padding: 1rem;
}

._backButton_5dedt_65 {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;

  padding: 0.25rem 0;

  background: none;
  border: none;
  color: inherit;

  font: inherit;
  font-size: 0.9rem;
  opacity: 0.8;

  cursor: pointer;
}

._backButton_5dedt_65:hover {
  opacity: 1;
  text-decoration: underline;
}

._menuList_5dedt_111 {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;

  margin: 0;
  padding: 0;

  list-style: none;
}

._menuItem_5dedt_133 {
  display: block;
  padding: 0.6rem 0.75rem;

  border-radius: 0.375rem;

  color: var(--active-text-on-card-primary);
  text-decoration: none;
}

._menuItem_5dedt_133:hover {
  background: var(--btn-secondary-bg-hover);
  color: var(--btn-secondary-text-hover);
}

._menuItem_5dedt_133._active_5dedt_163 {
  background: var(--btn-primary-bg);
  color: var(--btn-primary-text);
  font-weight: 600;
}

._content_5dedt_23 {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 1.25rem;

  min-width: 0;
  padding: 1.5rem;
}

._content_5dedt_23 h2 {
  margin: 0;
  font-size: 1.5rem;
  font-weight: 600;
}

._content_5dedt_23 > form {
  max-width: 520px;
}

@media (max-width: 600px) {
  ._account_5dedt_1 {
    flex-direction: column;
    gap: 1rem;
  }

  ._menu_5dedt_21 {
    position: static;
    flex: none;

    width: 100%;
    box-sizing: border-box;
  }

  ._menuList_5dedt_111 {
    flex-direction: row;
    overflow-x: auto;
  }

  ._menuItem_5dedt_133 {
    white-space: nowrap;
  }

  ._content_5dedt_23 {
    width: 100%;
    box-sizing: border-box;
    padding: 1rem;
  }
}