/* Canonical public site theme — restored richer slate-blue (not pure black) */

:root,
body.lux-public {
  /* Previous prettier palette (CMS / slate-blue era) */
  --lp-bg: #0f172a;
  --lp-bg-deep: #0b1220;
  --lp-surface: rgba(15, 23, 42, 0.72);
  --lp-surface-2: rgba(255, 255, 255, 0.04);
  --lp-border: rgba(148, 163, 184, 0.16);
  --lp-text: #f8fafc;
  --lp-muted: #94a3b8;
  --lp-primary: #2563eb;
  --lp-primary-2: #3b82f6;
  --lp-accent: #6366f1;
  --lp-glow: rgba(37, 99, 235, 0.32);
  --lp-font: Outfit, system-ui, -apple-system, sans-serif;
  --lp-font-ar: "Noto Sans Arabic", Outfit, system-ui, sans-serif;
  /* Soft layered glow — same spirit as the nicer previous look */
  --lp-bg-image:
    radial-gradient(ellipse 90% 55% at 50% -12%, rgba(37, 99, 235, 0.22), transparent 55%),
    radial-gradient(ellipse 55% 45% at 100% 15%, rgba(99, 102, 241, 0.14), transparent 50%),
    radial-gradient(ellipse 50% 40% at 0% 75%, rgba(14, 165, 233, 0.1), transparent 52%),
    linear-gradient(165deg, #0f172a 0%, #0b1220 48%, #0a1020 100%);
}

body.lux-public,
body.lux-landing.lux-public,
body.lux-device-ext.lux-public,
body.lux-device-match.lux-public,
body.lux-license-page.lux-public,
body.lux-login-page.lux-public {
  margin: 0;
  min-height: 100vh;
  font-family: var(--lp-font);
  color: var(--lp-text) !important;
  background-color: var(--lp-bg) !important;
  background-image: var(--lp-bg-image) !important;
  background-attachment: fixed !important;
  -webkit-font-smoothing: antialiased;
}

body.lux-public[dir="rtl"] {
  font-family: var(--lp-font-ar);
}

/* Shared top bar — same height/width on all public pages */
body.lux-public .lp-nav,
body.lux-public .ldx-top {
  --lp-nav-bar-h: 56px;
  height: var(--lp-nav-bar-h) !important;
  min-height: var(--lp-nav-bar-h) !important;
  max-height: var(--lp-nav-bar-h) !important;
  width: min(96%, 1120px) !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  box-sizing: border-box !important;
  background: rgba(15, 23, 42, 0.78) !important;
  border: 1px solid rgba(148, 163, 184, 0.16) !important;
  box-shadow: 0 8px 32px rgba(2, 6, 23, 0.4) !important;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  color: var(--lp-text);
  flex-wrap: nowrap !important;
  align-items: center !important;
}

body.lux-public .lp-brand,
body.lux-public .ldx-brand {
  color: var(--lp-text) !important;
}

body.lux-public .lp-btn-soft,
body.lux-public .lp-btn-ghost,
body.lux-public .ldx-btn:not(.ldx-btn-primary) {
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(148, 163, 184, 0.18) !important;
  color: var(--lp-text) !important;
}

body.lux-public .lp-btn-soft:hover,
body.lux-public .lp-btn-ghost:hover,
body.lux-public .ldx-btn:not(.ldx-btn-primary):hover {
  background: rgba(37, 99, 235, 0.14) !important;
  border-color: rgba(96, 165, 250, 0.35) !important;
}

body.lux-public .lp-btn-primary,
body.lux-public .ldx-btn-primary {
  background: linear-gradient(135deg, var(--lp-primary), var(--lp-accent)) !important;
  border-color: transparent !important;
  color: #fff !important;
  box-shadow: 0 8px 22px var(--lp-glow) !important;
}

/* Keep public top bars a stable height with the logo */
body.lux-public .lp-nav {
  height: 56px;
  min-height: 56px;
  max-height: 56px;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  align-items: center;
}
body.lux-public .lp-nav-actions .lp-btn {
  height: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
}

/* Defeat pure-black / login-lite overrides */
body.lux-public.lux-login-page,
body.lux-public.lux-landing,
body.lux-public.lux-device-ext,
body.lux-public.lux-device-match,
body.lux-public.lux-license-page {
  background-color: var(--lp-bg) !important;
  background-image: var(--lp-bg-image) !important;
}

/* Shared nav height token */
body.lux-public {
  --lp-nav-bar-h: 56px;
}
body.lux-public .lp-nav {
  height: var(--lp-nav-bar-h) !important;
  min-height: var(--lp-nav-bar-h) !important;
  max-height: var(--lp-nav-bar-h) !important;
  width: min(96%, 1120px);
  box-sizing: border-box;
}