/* SkyLink customer authentication — immersive glass over travel media.
   Loaded independently so the public auth treatment never touches admin screens. */

/* Auth logo inside form — centered white logo above the login/signup form */
.auth-logo-in-form {
  display: flex;
  justify-content: center;
  margin-bottom: 1.5rem;
}
.auth-logo-in-form-img {
  height: 72px;
  width: auto;
  max-width: 300px;
  filter: drop-shadow(0 2px 10px rgba(0, 0, 0, .4));
}
@media (max-width: 480px) {
  .auth-logo-in-form-img {
    height: 56px;
    max-width: 240px;
  }
}

/* Hide the header bar and contact strip entirely on auth pages */
/* Hide the header bar and contact strip entirely on auth pages */
.skylink-auth-body header.skylink-header,
.skylink-auth-body .skylink-contact-bar {
  display: none !important;
}
.skylink-auth-body {
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  height: 100%;
  height: 100dvh;
  width: 100%;
}
/* Hide Services, Company, Blogs, and locale controls on auth pages */
.skylink-auth-body .skylink-control-group,
.skylink-auth-body .skylink-locale-control,
.skylink-auth-body .skylink-mobile-locale-group,
.skylink-auth-body .skylink-mobile-settings {
  display: none !important;
}
/* Hide mobile menu on auth pages */
.skylink-auth-body .skylink-mobile-menu {
  display: none !important;
}

.skylink-auth-page {
  --auth-ink: #F7FBFA;
  --auth-muted: #D4E4E3;
  --auth-soft: #B9CFCE;
  --auth-teal: #75D0C6;
  --auth-deep: #003A47;
  --auth-orange: #FF9F1C;
  --auth-glass: rgba(4, 42, 49, .62);
  --auth-glass-strong: rgba(3, 36, 43, .78);
  --auth-glass-line: rgba(227, 248, 245, .29);
  --auth-field: rgba(2, 31, 39, .40);
  position: relative;
  isolation: isolate;
  display: flex;
  min-height: 100vh;
  min-height: 100dvh;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: 0;
  background: #073943;
  color: var(--auth-ink);
  font-family: var(--font-family, "DG Baysan", "Poppins", "Outfit", Arial, sans-serif);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.skylink-auth-page .auth-glass-shell,
.skylink-auth-page .auth-glass-shell--signup {
  margin-left: -80px;
}


.skylink-auth-page *,
.skylink-auth-page *::before,
.skylink-auth-page *::after { box-sizing: border-box; }
.skylink-auth-page [hidden] { display: none !important; }

.skylink-auth-page .auth-background {
  position: fixed;
  z-index: -2;
  inset: 0;
  overflow: hidden;
  background-color: #073943;
  background-image: var(--auth-poster-image);
  background-position: center;
  background-size: cover;
}
.skylink-auth-page .auth-background-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.skylink-auth-page .auth-background-shade {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(0, 31, 39, .34), rgba(0, 35, 42, .47)),
    linear-gradient(115deg, rgba(0, 58, 71, .43), rgba(0, 58, 71, .08) 55%, rgba(3, 31, 39, .32));
  pointer-events: none;
}
.skylink-auth-page::after {
  position: fixed;
  z-index: -1;
  inset: 0;
  content: "";
  background: radial-gradient(ellipse at 50% 45%, transparent 25%, rgba(0, 23, 30, .23) 100%);
  pointer-events: none;
}

.skylink-auth-page .auth-media-toggle {
  position: fixed;
  z-index: 5;
  right: max(1rem, env(safe-area-inset-right));
  bottom: max(1rem, env(safe-area-inset-bottom));
  display: inline-flex;
  min-width: 44px;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  padding: .65rem .9rem;
  border: 1px solid rgba(245, 255, 253, .36);
  border-radius: 999px;
  background: rgba(0, 39, 47, .62);
  color: #F7FBFA;
  font: inherit;
  font-size: .78rem;
  font-weight: 600;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  cursor: pointer;
  transition: background-color 180ms ease, border-color 180ms ease, transform 180ms ease;
}
.skylink-auth-page .auth-media-toggle:hover { background: rgba(0, 58, 71, .9); border-color: var(--auth-orange); }
.skylink-auth-page .auth-media-toggle:active { transform: translateY(1px); }
.skylink-auth-page :where(a, button, input, [role="button"], [tabindex]):focus-visible {
  outline: 3px solid var(--auth-orange);
  outline-offset: 3px;
}

.skylink-auth-page .auth-glass-shell,
.skylink-auth-page .auth-glass-shell--signup {
  position: relative;
  z-index: 1;
  width: min(100%, 452px);
  margin-left: calc(50% - 226px - -650px);
  margin-right: auto;
}
.skylink-auth-page .auth-glass-shell--signup {
  width: min(100%, 540px);
  margin-left: calc(50% - 270px - -650px);
}
.skylink-auth-page .auth-glass-shell > *,
.skylink-auth-page .auth-glass-shell--signup > * { width: 100%; }

.skylink-auth-page .auth-glass-card {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--auth-glass-line) !important;
  border-radius: 24px !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .105), rgba(255, 255, 255, .025) 42%, rgba(0, 40, 48, .16)),
    var(--auth-glass) !important;
  color: var(--auth-ink);
  box-shadow:
    0 30px 90px rgba(0, 20, 27, .37),
    0 8px 24px rgba(0, 28, 35, .22),
    inset 0 1px 0 rgba(255, 255, 255, .20) !important;
  backdrop-filter: blur(24px) saturate(125%);
  -webkit-backdrop-filter: blur(24px) saturate(125%);
  transition: border-color 220ms ease, box-shadow 220ms ease;
}
.skylink-auth-page .auth-glass-card::before {
  position: absolute;
  inset: 0 12% auto;
  height: 1px;
  content: "";
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.6), transparent);
  pointer-events: none;
}
.skylink-auth-page .auth-glass-card:hover {
  border-color: rgba(230, 251, 247, .38) !important;
  box-shadow: 0 34px 92px rgba(0, 20, 27, .42), 0 8px 24px rgba(0, 28, 35, .22), inset 0 1px 0 rgba(255,255,255,.22) !important;
}
.skylink-auth-page .auth-glass-card > .card-body { position: relative; padding: clamp(1.25rem, 4vw, 2rem); }
.skylink-auth-page .auth-glass-header {
  margin: 0 0 1.55rem;
  text-align: center;
}
.skylink-auth-page .auth-glass-brand {
  display: inline-flex;
  width: min(188px, 58%);
  height: auto;
  max-height: 68px;
  margin: 0 auto 1.1rem;
  object-fit: contain;
}
.skylink-auth-page .auth-glass-brand img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}
.skylink-auth-page .auth-glass-heading {
  margin: 0;
  color: #fff !important;
  font-size: clamp(1.55rem, 4vw, 1.9rem);
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: -.035em;
  text-wrap: balance;
}
.skylink-auth-page .auth-glass-subtitle {
  max-width: 38ch;
  margin: .55rem auto 0;
  color: var(--auth-muted) !important;
  font-size: .92rem;
  line-height: 1.55;
  text-wrap: pretty;
}
.skylink-auth-page .auth-glass-footer {
  margin-top: 1.35rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(233, 249, 247, .20) !important;
  color: var(--auth-muted);
  text-align: center;
}

/* Existing auth markup carries Tailwind gray utilities; local overrides keep
   labels and supporting copy legible without flattening semantic status colors. */
.skylink-auth-page :where(.text-gray-900, .text-gray-800, .text-gray-700) { color: #F3FAF9 !important; }
.skylink-auth-page :where(.text-gray-600, .text-gray-500, .text-gray-400) { color: #C2D7D6 !important; }
.skylink-auth-page label {
  display: block;
  margin-bottom: .4rem;
  color: #EAF5F3;
  font-size: .84rem;
  font-weight: 600;
  line-height: 1.4;
}
.skylink-auth-page .form-control { min-width: 0; }
.skylink-auth-page form.space-y-6 { display: grid; gap: 1rem; }
.skylink-auth-page form.space-y-6 > :not([hidden]) ~ :not([hidden]) { margin-top: 0; }
.skylink-auth-page .form-control > .mt-1,
.skylink-auth-page .form-control > .mt-2 { margin-top: .45rem; }
.skylink-auth-page .input-group { position: relative; }
.skylink-auth-page :where(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="submit"]), select, textarea, .input, .input-with-icon, .input-with-icon-right) {
  width: 100%;
  min-width: 0;
  min-height: 48px;
  border: 1px solid rgba(221, 243, 240, .28) !important;
  border-radius: 11px !important;
  background: var(--auth-field) !important;
  color: #F8FCFB !important;
  box-shadow: inset 0 1px 2px rgba(0, 20, 25, .12);
  font: inherit;
  font-size: .94rem;
  line-height: 1.35;
  transition: border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}
.skylink-auth-page :where(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="submit"]), select, textarea, .input, .input-with-icon, .input-with-icon-right):hover {
  border-color: rgba(231, 250, 246, .48) !important;
  background-color: rgba(2, 34, 42, .57) !important;
}
.skylink-auth-page :where(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="submit"]), select, textarea, .input, .input-with-icon, .input-with-icon-right):focus {
  border-color: var(--auth-teal) !important;
  background-color: rgba(1, 32, 39, .74) !important;
  box-shadow: 0 0 0 3px rgba(117, 208, 198, .19), inset 0 1px 2px rgba(0, 20, 25, .12) !important;
  outline: none;
}
.skylink-auth-page input::placeholder,
.skylink-auth-page textarea::placeholder { color: #B7CECC !important; opacity: 1; }
.skylink-auth-page .input-icon-left,
.skylink-auth-page .input-icon-right { color: #BDD6D3 !important; }
.skylink-auth-page .input-icon-left { pointer-events: none; }
.skylink-auth-page .input-icon-right {
  display: inline-flex;
  width: 44px;
  height: 44px;
  align-items: center;
  justify-content: center;
  top: 50%;
  right: 2px;
  border-radius: 9px;
  transform: translateY(-50%);
  cursor: pointer;
  border: 0;
  padding: 0;
  background: transparent;
}
.skylink-auth-page .input-icon-right:hover { color: #fff !important; background: rgba(255,255,255,.08); }
.skylink-auth-page .input-icon-right:focus-visible { outline-offset: -1px; }

.skylink-auth-page .checkbox-item { display: flex; min-height: 44px; align-items: center; gap: .55rem; }
.skylink-auth-page .checkbox-container { position: relative; flex: 0 0 20px; width: 20px; height: 20px; }
.skylink-auth-page .checkbox-input { position: absolute; inset: 0; z-index: 1; width: 20px; height: 20px; margin: 0; opacity: 0; cursor: pointer; }
.skylink-auth-page .checkbox-custom {
  display: grid;
  width: 20px;
  height: 20px;
  place-items: center;
  border: 1px solid rgba(225, 245, 242, .58);
  border-radius: 5px;
  background: rgba(0, 26, 34, .38);
  color: transparent;
}
.skylink-auth-page .checkbox-input:checked + .checkbox-custom { border-color: var(--auth-orange); background: var(--auth-orange); color: var(--auth-deep); }
.skylink-auth-page .checkbox-input:focus-visible + .checkbox-custom { outline: 3px solid var(--auth-orange); outline-offset: 3px; }
.skylink-auth-page .checkbox-icon { color: inherit !important; }
.skylink-auth-page .checkbox-item label,
.skylink-auth-page form > .form-control:has(#terms) label {
  margin: 0;
  color: #E4F0EF !important;
  font-weight: 400;
}
.skylink-auth-page .checkbox-item label { cursor: pointer; }
.skylink-auth-page .btn-link,
.skylink-auth-page .auth-glass-footer a,
.skylink-auth-page a.text-blue-600 {
  color: #FFD18F !important;
  font-weight: 600;
  text-decoration-color: rgba(255, 209, 143, .6);
  text-underline-offset: 3px;
}
.skylink-auth-page .btn-link:hover,
.skylink-auth-page .auth-glass-footer a:hover,
.skylink-auth-page a.text-blue-600:hover { color: #fff !important; text-decoration: underline; }
.skylink-auth-page .card-actions { margin-top: .2rem; }
.skylink-auth-page button[type="submit"],
.skylink-auth-page input[type="submit"] {
  display: inline-flex;
  width: 100%;
  min-height: 50px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--auth-orange) !important;
  border-radius: 11px !important;
  background: var(--auth-orange) !important;
  color: #073943 !important;
  box-shadow: 0 8px 20px rgba(255, 159, 28, .19);
  font: inherit;
  font-weight: 700;
  transition: background-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}
.skylink-auth-page button[type="submit"]:hover:not(:disabled),
.skylink-auth-page input[type="submit"]:hover:not(:disabled) {
  border-color: #FFB545 !important;
  background: #FFB545 !important;
  box-shadow: 0 10px 25px rgba(255, 159, 28, .27);
}
.skylink-auth-page button[type="submit"]:active:not(:disabled) { transform: translateY(1px); }
.skylink-auth-page button[type="submit"]:disabled { cursor: wait; opacity: .78; }
.skylink-auth-page button[type="submit"] .material-symbols-outlined { color: inherit; }

/* Status colors remain distinct, but are lifted for contrast on dark glass. */
.skylink-auth-page .text-red-600,
.skylink-auth-page .text-red-500 { color: #FFB7B1 !important; }
.skylink-auth-page input.border-red-300 { border-color: #FFB7B1 !important; }
.skylink-auth-page .text-yellow-600,
.skylink-auth-page .text-yellow-500 { color: #FFE09A !important; }
.skylink-auth-page .text-green-600,
.skylink-auth-page .text-green-500 { color: #A7E9C3 !important; }
.skylink-auth-page .text-blue-600,
.skylink-auth-page .text-blue-500 { color: #A8D9FF !important; }
.skylink-auth-page .bg-gray-200,
.skylink-auth-page .bg-gray-300 { background-color: rgba(226, 245, 242, .24) !important; }
.skylink-auth-page .bg-red-500 { background-color: #FF8177 !important; }
.skylink-auth-page .bg-yellow-500 { background-color: #FFD16F !important; }
.skylink-auth-page .bg-blue-500 { background-color: #72BEF4 !important; }
.skylink-auth-page .bg-green-500 { background-color: #68D69C !important; }
.skylink-auth-page .text-red-600,
.skylink-auth-page .text-yellow-600,
.skylink-auth-page .text-green-600,
.skylink-auth-page .text-blue-600 { font-weight: 600; }

.skylink-auth-page .alert-error,
.skylink-auth-page .alert-danger,
.skylink-auth-page .alert-success,
.skylink-auth-page .alert-warning,
.skylink-auth-page .alert-info {
  display: flex;
  align-items: flex-start;
  gap: .7rem;
  padding: .85rem 1rem;
  border-radius: 14px;
  background-color: rgba(3, 38, 45, .76);
  box-shadow: 0 10px 28px rgba(0, 20, 27, .16);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
.skylink-auth-page .alert-error,
.skylink-auth-page .alert-danger { border-color: rgba(255, 139, 130, .7); color: #FFD3CF; }
.skylink-auth-page .alert-success { border-color: rgba(117, 208, 160, .68); color: #C4F3D9; }
.skylink-auth-page .alert-warning { border-color: rgba(255, 193, 99, .7); color: #FFE4B7; }
.skylink-auth-page .alert-info { border-color: rgba(117, 208, 198, .64); color: #D5F0ED; }
.skylink-auth-page .alert-error p,
.skylink-auth-page .alert-danger p,
.skylink-auth-page .alert-success p,
.skylink-auth-page .alert-warning p,
.skylink-auth-page .alert-info p { margin: 0; color: inherit; }
.skylink-auth-page .alert-error .material-symbols-outlined,
.skylink-auth-page .alert-danger .material-symbols-outlined,
.skylink-auth-page .alert-success .material-symbols-outlined,
.skylink-auth-page .alert-warning .material-symbols-outlined,
.skylink-auth-page .alert-info .material-symbols-outlined { flex: 0 0 auto; color: inherit; }
.skylink-auth-page .auth-agent-notice {
  margin-bottom: .8rem;
  padding: 1rem;
  border: 1px solid rgba(222, 245, 242, .25);
  border-radius: 16px;
  background: rgba(5, 45, 52, .66);
  color: #E5F2F0;
  box-shadow: 0 14px 36px rgba(0, 20, 27, .18);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
.skylink-auth-page .auth-agent-notice :where(h1,h2,h3,h4) { color: #fff !important; }
.skylink-auth-page .auth-agent-notice :where(p) { color: #D0E3E1 !important; }
.skylink-auth-page .auth-agent-notice .bg-blue-100 { background: rgba(117, 208, 198, .18) !important; }
.skylink-auth-page .auth-agent-notice .text-blue-600 { color: #B7EAE4 !important; }

/* Keep generated security prompts distinct from the form while preserving all
   CAPTCHA inputs and error copy produced by the existing renderer. */
.skylink-auth-page .captcha-container,
.skylink-auth-page .captcha-field,
.skylink-auth-page [class*="captcha"] {
  color: #EAF5F3;
}
.skylink-auth-page .captcha-container,
.skylink-auth-page .captcha-field,
.skylink-auth-page [class*="captcha"]:where(div, section, fieldset) {
  border-color: rgba(225, 245, 242, .24);
  border-radius: 12px;
  background-color: rgba(242, 252, 250, .09);
}
.skylink-auth-page .captcha-container input,
.skylink-auth-page .captcha-field input { background: rgba(0, 29, 36, .5) !important; }

.skylink-auth-page .auth-glass-shell--signup .auth-glass-card {
  padding-top: 1.5rem;
}
.skylink-auth-page .auth-glass-shell--signup .auth-glass-card > .card-body { padding: clamp(1.1rem, 3.5vw, 1.65rem); }
.skylink-auth-page .auth-glass-shell--signup .auth-glass-header > :where(.h-\[150px\]) {
  display: block;
  height: auto;
  min-height: 0;
  padding: 0;
}
.skylink-auth-page .auth-glass-shell--signup .auth-glass-header > :where(.h-\[150px\]) > :where(.w-16) { display: none; }
.skylink-auth-page .auth-glass-shell--signup .auth-glass-header .text-gray-600 { color: var(--auth-muted) !important; }
.skylink-auth-page .auth-glass-shell--signup .auth-glass-footer { margin-top: 1rem; }
.skylink-auth-page .auth-glass-shell--signup form { gap: .82rem; }
.skylink-auth-page .auth-glass-shell--signup .form-control > .flex.items-start { gap: .65rem; }
.skylink-auth-page .auth-glass-shell--signup .form-control:has(#terms) { margin-top: .1rem; }
.skylink-auth-page .auth-glass-shell--signup form > .grid.grid-cols-1 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.skylink-auth-page .auth-glass-shell--signup .form-control p { line-height: 1.42; }
.skylink-auth-page .auth-glass-shell--signup .w-full.bg-gray-200 { overflow: hidden; }

@media (max-width: 520px) {
  .skylink-auth-page { align-items: flex-start; padding: 1rem .8rem 4.5rem; }
  .skylink-auth-page .auth-glass-shell { margin-block: auto; }
  .skylink-auth-page .auth-glass-shell--signup { margin-block: .2rem; }
  .skylink-auth-page .auth-glass-shell,
  .skylink-auth-page .auth-glass-shell--signup { width: 100%; }
  .skylink-auth-page .auth-glass-card { border-radius: 19px !important; }
  .skylink-auth-page .auth-glass-card > .card-body,
  .skylink-auth-page .auth-glass-shell--signup .auth-glass-card > .card-body { padding: 1.15rem; }
  .skylink-auth-page .auth-glass-header { margin-bottom: 1.15rem; }
  .skylink-auth-page .auth-glass-brand { width: min(164px, 58%); max-height: 58px; margin-bottom: .8rem; }
  .skylink-auth-page .auth-glass-heading { font-size: 1.55rem; }
  .skylink-auth-page .auth-glass-subtitle { font-size: .86rem; }
  .skylink-auth-page .auth-glass-shell--signup form > .grid.grid-cols-1 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; }
  .skylink-auth-page .auth-glass-shell--signup form { gap: .75rem; }
  .skylink-auth-page .auth-glass-footer { margin-top: 1rem; padding-top: .85rem; }
}
@media (max-width: 360px) {
  .skylink-auth-page { padding-inline: .6rem; }
  .skylink-auth-page .auth-glass-card > .card-body,
  .skylink-auth-page .auth-glass-shell--signup .auth-glass-card > .card-body { padding: .95rem; }
  .skylink-auth-page .auth-glass-shell--signup form > .grid.grid-cols-1 { grid-template-columns: 1fr; }
  .skylink-auth-page .auth-media-toggle { right: .65rem; bottom: .65rem; }
}
@media (prefers-reduced-motion: reduce) {
  .skylink-auth-page *,
  .skylink-auth-page *::before,
  .skylink-auth-page *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
  .skylink-auth-page .auth-background-video { display: none; }
}