/* NWave Cloud console login */
html.page-9999 {
  inline-size: 100%;
  max-inline-size: 100vw;
  min-inline-size: 0;
  overflow-x: clip;
  background: #ffffff !important;
}

html.page-9999 body {
  --nwave-bg: #f7f9ff;
  --nwave-text: #111827;
  --nwave-strong: #050608;
  --nwave-muted: #5b6475;
  --nwave-line: rgba(17, 24, 39, 0.12);
  --nwave-panel: rgba(255, 255, 255, 0.9);
  --nwave-panel-strong: rgba(255, 255, 255, 0.97);
  --nwave-blue: #4f7cff;
  --nwave-cyan: #12b8d7;
  --nwave-pink: #ea4aaa;
  --nwave-shadow: 0 24px 70px rgba(56, 68, 103, 0.16);
  inline-size: 100%;
  max-inline-size: 100vw;
  min-inline-size: 0;
  margin: 0;
  overflow-x: clip;
  border-block-start: 0 !important;
  background:
    radial-gradient(circle at 12% 12%, rgba(18, 184, 215, 0.18), transparent 25rem),
    radial-gradient(circle at 88% 10%, rgba(234, 74, 170, 0.15), transparent 24rem),
    radial-gradient(circle at 50% 105%, rgba(79, 124, 255, 0.12), transparent 28rem),
    linear-gradient(180deg, #ffffff 0%, #f7f9ff 48%, #f4fff9 100%);
  color: var(--nwave-text);
  font-family: "Google Sans", "Product Sans", "Aptos", "Segoe UI", ui-sans-serif, system-ui, sans-serif;
}

html.page-9999 body::before,
html.page-9999 body::after {
  position: fixed;
  inset: 0;
  pointer-events: none;
  content: "";
}

html.page-9999 body::before {
  z-index: -2;
  background-image:
    linear-gradient(rgba(17, 24, 39, 0.044) 1px, transparent 1px),
    linear-gradient(90deg, rgba(17, 24, 39, 0.038) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: linear-gradient(to bottom, black, transparent 78%);
}

html.page-9999 body::after {
  z-index: -1;
  opacity: 0.7;
  background: linear-gradient(120deg, rgba(120, 167, 255, 0.08), rgba(73, 230, 255, 0.04), rgba(255, 122, 217, 0.08));
}

html.page-9999 body .t-Body-content,
html.page-9999 body .t-Body-contentInner,
html.page-9999 body .t-Body-mainContent {
  inline-size: 100% !important;
  max-inline-size: 100vw !important;
  min-inline-size: 0 !important;
  overflow-x: clip;
  background: transparent;
}

html.page-9999 body #wwvFlowForm {
  inline-size: 100%;
  max-inline-size: 100vw;
  min-inline-size: 0;
  overflow-x: clip;
}

html.page-9999 body .t-Footer {
  display: none !important;
}

html.page-9999 body .t-Body-contentInner {
  box-sizing: border-box;
  display: grid;
  min-block-size: 100svh;
  align-items: center;
  justify-items: center;
  padding: 6.5rem 1rem 2.5rem;
}

html.page-9999 body .t-Body-contentInner > .container {
  box-sizing: border-box;
  width: min(calc(100vw - 2rem), 32rem) !important;
  inline-size: min(100% - 2rem, 32rem);
  max-inline-size: none;
  max-width: 32rem !important;
  margin-inline: auto;
  padding-inline: 0 !important;
}

html.page-9999 body .t-Body-contentInner > .container > .row {
  box-sizing: border-box;
  width: 100% !important;
  margin-inline: 0;
  min-inline-size: 0;
}

html.page-9999 body .t-Body-contentInner > .container > .row > .col {
  box-sizing: border-box;
  float: none !important;
  width: 100% !important;
  inline-size: 100%;
  max-inline-size: none;
  max-width: none !important;
  min-inline-size: 0;
  padding-inline: 0;
}

html.page-9999 body .t-Login-container {
  inline-size: 100%;
  max-inline-size: none;
  max-width: none !important;
  margin-inline: auto;
}

html.page-9999 body .t-Login-region {
  box-sizing: border-box;
  position: relative;
  display: block;
  width: 100% !important;
  inline-size: 100%;
  min-inline-size: 0 !important;
  max-inline-size: none;
  max-width: 100% !important;
  margin-inline: auto !important;
  overflow: hidden;
  border: 1px solid rgba(17, 24, 39, 0.1);
  border-radius: 8px;
  background: var(--nwave-panel);
  box-shadow: var(--nwave-shadow);
  backdrop-filter: blur(20px);
}

html.page-9999 body .t-Login-region::before {
  position: absolute;
  inset-block-start: 0;
  inset-inline: 0;
  block-size: 4px;
  content: "";
  background: linear-gradient(90deg, var(--nwave-blue), var(--nwave-cyan) 48%, var(--nwave-pink));
}

html.page-9999 body .t-Login-header,
html.page-9999 body .t-Login-body,
html.page-9999 body .t-Login-buttons {
  box-sizing: border-box;
  position: relative;
  z-index: 1;
  width: 100%;
  inline-size: auto;
  margin-inline: 0;
}

html.page-9999 body .t-Login-header {
  padding: 3rem 3rem 1.25rem;
  text-align: center;
}

html.page-9999 body .t-Login-body {
  display: block;
  padding-inline: 3rem;
}

html.page-9999 body .t-Login-buttons {
  padding: 0.35rem 3rem 3rem;
}

html.page-9999 body .t-Login-logo {
  display: none;
}

html.page-9999 body .t-Login-title {
  margin: 0;
  color: var(--nwave-text);
  font-family: inherit;
  font-size: 2.45rem;
  font-weight: 430;
  line-height: 1.06;
  letter-spacing: 0;
}

html.page-9999 body .t-Login-title::before {
  display: block;
  margin-block-end: 0.7rem;
  color: #3677ff;
  content: "NWave Cloud Console";
  font-size: 0.78rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  line-height: 1.2;
  text-transform: uppercase;
}

html.page-9999 body .t-Login-title::after {
  display: block;
  max-inline-size: 26rem;
  margin: 0.95rem auto 0;
  color: #3f485a;
  content: "Secure access to hosting, subscriptions and support.";
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.55;
}

html.page-9999 body .t-Form-fieldContainer {
  position: relative;
  z-index: 1;
  margin: 0 0 1rem;
}

html.page-9999 body .t-Form-inputContainer,
html.page-9999 body .t-Form-itemWrapper {
  inline-size: 100%;
}

html.page-9999 body .t-Form-labelContainer {
  padding: 0;
}

html.page-9999 body .apex-item-text,
html.page-9999 body .apex-item-password {
  inline-size: 100%;
  min-block-size: 3.3rem;
  border: 1px solid rgba(17, 24, 39, 0.13);
  border-radius: 8px;
  background: var(--nwave-panel-strong);
  color: var(--nwave-text);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.84) inset;
  font-family: inherit;
  font-size: 0.98rem;
  transition: border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

html.page-9999 body .apex-item-text::placeholder,
html.page-9999 body .apex-item-password::placeholder {
  color: #7a8190;
}

html.page-9999 body .apex-item-text:focus,
html.page-9999 body .apex-item-password:focus {
  border-color: rgba(79, 124, 255, 0.74);
  background: #ffffff;
  box-shadow:
    0 0 0 3px rgba(79, 124, 255, 0.16),
    0 1px 0 rgba(255, 255, 255, 0.9) inset;
  outline: none;
}

html.page-9999 body .t-Form-itemWrapper .apex-item-icon {
  color: #6c7688;
}

html.page-9999 body .apex-item-group--password {
  display: flex;
  inline-size: 100%;
}

html.page-9999 body .apex-item-group--password .apex-item-password {
  flex: 1 1 auto;
  min-inline-size: 0;
  border-start-end-radius: 0;
  border-end-end-radius: 0;
}

html.page-9999 body .t-Button--passwordVisibility {
  flex: 0 0 3.1rem;
  inline-size: 3.1rem;
  min-block-size: 3.3rem;
  border-color: rgba(17, 24, 39, 0.13);
  border-start-start-radius: 0;
  border-end-start-radius: 0;
  background: rgba(255, 255, 255, 0.84);
  color: #596273;
}

html.page-9999 body .t-Form-fieldContainer--checkbox {
  margin-block: 0.3rem 1.25rem;
  color: #3f485a;
  font-size: 0.92rem;
}

html.page-9999 body .apex-item-single-checkbox {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
}

html.page-9999 body .u-checkbox {
  color: #3f485a;
}

html.page-9999 body .apex-item-checkbox input:focus-visible + label::before,
html.page-9999 body .u-checkbox:focus-visible::before {
  outline: 3px solid rgba(79, 124, 255, 0.24);
  outline-offset: 2px;
}

html.page-9999 body .apex-item-checkbox input:checked + label::before,
html.page-9999 body .u-checkbox:checked + label::before {
  border-color: var(--nwave-blue);
  background-color: var(--nwave-blue);
}

html.page-9999 body .t-Button--hot {
  inline-size: 100%;
  min-block-size: 3.35rem;
  border: 1px solid #111318;
  border-radius: 999px;
  background: #111318;
  color: #ffffff;
  box-shadow: 0 18px 34px rgba(17, 19, 24, 0.18);
  font-family: inherit;
  font-size: 1rem;
  font-weight: 720;
  transition: transform 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

html.page-9999 body .t-Button--hot:hover,
html.page-9999 body .t-Button--hot:focus-visible {
  background: #050608;
  box-shadow: 0 20px 42px rgba(17, 19, 24, 0.24);
  outline: none;
  transform: translateY(-1px);
}

html.page-9999 body #APEX_ERROR_MESSAGE,
html.page-9999 body #APEX_SUCCESS_MESSAGE {
  inline-size: min(100% - 2rem, 32rem);
  margin: 5.25rem auto -5rem;
}

html.page-9999 body .t-Alert,
html.page-9999 body .t-Alert--danger,
html.page-9999 body .t-Alert--warning {
  border-radius: 8px;
}

html.page-9999 body #APEX_ERROR_MESSAGE .t-Alert {
  border: 1px solid rgba(190, 18, 60, 0.22);
  background: rgba(255, 241, 242, 0.96);
  color: #881337;
  box-shadow: 0 18px 44px rgba(190, 18, 60, 0.12);
}

html.page-9999 body .a-Form-error,
html.page-9999 body .t-Form-error {
  color: #be123c;
  font-size: 0.86rem;
  line-height: 1.35;
}

@media (max-width: 560px) {
  html.page-9999 body .t-Body-contentInner {
    align-items: start;
    padding: 6rem 0.75rem 1.2rem;
  }

  html.page-9999 body .t-Body-contentInner > .container {
    width: min(calc(100vw - 1.5rem), 23rem) !important;
    inline-size: min(100%, 23rem);
    max-width: calc(100vw - 1.5rem) !important;
  }

  html.page-9999 body .t-Body-contentInner > .container > .row > .col {
    display: flex !important;
    justify-content: center !important;
    width: 100vw !important;
    max-width: 100vw !important;
  }

  html.page-9999 body .t-Login-region {
    flex: 0 1 auto;
    width: min(calc(100vw - 1.5rem), 23rem) !important;
    inline-size: min(calc(100vw - 1.5rem), 23rem) !important;
    max-width: calc(100vw - 1.5rem) !important;
    transform: none !important;
  }

  html.page-9999 body .t-Login-header {
    padding: 2rem 1.4rem 1.1rem;
  }

  html.page-9999 body .t-Login-body {
    padding-inline: 1.4rem;
  }

  html.page-9999 body .t-Login-buttons {
    padding: 0.25rem 1.4rem 2rem;
  }

  html.page-9999 body .t-Login-title {
    font-size: 2rem;
  }

  html.page-9999 body .t-Login-title::after {
    font-size: 0.96rem;
  }

  html.page-9999 body .apex-item-text,
  html.page-9999 body .apex-item-password,
  html.page-9999 body .t-Button--hot {
    min-block-size: 3.2rem;
  }

  html.page-9999 body .t-Button--passwordVisibility {
    min-block-size: 3.2rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  html.page-9999 body *,
  html.page-9999 body *::before,
  html.page-9999 body *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}
