/* ── Base Styles, Variables & Utilities ────────────────────────────────── */
:root {
  --lk-bg-start: #f4f7fb;
  --lk-bg-end: #eef3f9;
  --lk-surface: rgba(255, 255, 255, 0.84);
  --lk-surface-strong: rgba(255, 255, 255, 0.96);
  --lk-surface-soft: rgba(255, 255, 255, 0.66);
  --lk-border: rgba(46, 67, 95, 0.12);
  --lk-shadow: 0 12px 36px rgba(27, 43, 65, 0.08);
  --lk-title-color: #14243a;
  --lk-muted: #5c6f86;
  --lk-accent: #0d6efd;
  --lk-accent-soft: rgba(13, 110, 253, 0.12);
  --lk-accent-strong: #0b5ed7;
  --lk-accent-border: rgba(13, 110, 253, 0.22);
  --lk-active-session-bg: rgba(25, 135, 84, 0.13);
}

[data-bs-theme="dark"] {
  --lk-bg-start: #111720;
  --lk-bg-end: #1a2433;
  --lk-surface: rgba(17, 24, 36, 0.8);
  --lk-surface-strong: rgba(17, 24, 36, 0.94);
  --lk-surface-soft: rgba(17, 24, 36, 0.62);
  --lk-border: rgba(176, 195, 221, 0.2);
  --lk-shadow: 0 16px 38px rgba(0, 0, 0, 0.34);
  --lk-title-color: #e9f0ff;
  --lk-muted: #b2c4de;
  --lk-accent: #6ea8fe;
  --lk-accent-soft: rgba(110, 168, 254, 0.18);
  --lk-accent-strong: #8bb9ff;
  --lk-accent-border: rgba(110, 168, 254, 0.26);
  --lk-active-session-bg: rgba(25, 135, 84, 0.28);
}

/* Global Mobile Tap Highlight Suppression & Smooth Touch Interactions */
*,
*::before,
*::after {
  -webkit-tap-highlight-color: transparent !important;
}

a, button, input, select, textarea, .card, .btn, [role="button"] {
  -webkit-tap-highlight-color: transparent !important;
}

/* Fix dark theme tap/active/focus white flashes on interactive elements */
[data-bs-theme="dark"] a:active,
[data-bs-theme="dark"] button:active,
[data-bs-theme="dark"] .btn:active,
[data-bs-theme="dark"] .btn.active,
[data-bs-theme="dark"] .btn-check:checked + .btn,
[data-bs-theme="dark"] .card:active,
[data-bs-theme="dark"] [role="button"]:active {
  background-color: var(--lk-accent-soft) !important;
  color: var(--lk-title-color) !important;
  border-color: var(--lk-accent-border) !important;
}

/* Smooth theme switching animation */
body.lk-shell,
.lk-navbar,
.lk-glass,
.card,
.lk-mini-card,
.lk-agr-field,
.lk-agr-chip,
.lk-nav-btn,
.lk-agreements-panel,
.modal-content,
.badge {
  transition: background-color 0.35s ease, color 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease;
}

body.lk-shell {
  min-height: 100vh;
  position: relative;
  background:
    radial-gradient(1200px 600px at 60% 0%, rgba(255, 255, 255, 0.55) 0%, rgba(13, 110, 253, 0.10) 60%, transparent 100%),
    radial-gradient(900px 400px at 0% 100%, rgba(13, 110, 253, 0.10) 0%, transparent 80%),
    linear-gradient(160deg, var(--lk-bg-start), var(--lk-bg-end));
  color: var(--lk-title-color);
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  overflow-x: hidden;
}

/* Ambient ISP Network Mesh & Fiber Orbs for Provider Vibe */
body.lk-shell::before,
body.lk-shell::after {
  content: "";
  position: fixed;
  pointer-events: none;
  z-index: -1;
  border-radius: 50%;
  filter: blur(80px);
  opacity: 0.45;
  animation: lkNetworkPulse 12s infinite ease-in-out alternate;
}

body.lk-shell::before {
  width: 520px;
  height: 520px;
  top: -100px;
  right: -80px;
  background: radial-gradient(circle, rgba(13, 110, 253, 0.35) 0%, rgba(13, 202, 240, 0.15) 60%, transparent 100%);
}

body.lk-shell::after {
  width: 600px;
  height: 600px;
  bottom: -150px;
  left: -120px;
  background: radial-gradient(circle, rgba(111, 66, 193, 0.25) 0%, rgba(13, 110, 253, 0.15) 60%, transparent 100%);
  animation-delay: -6s;
}

@keyframes lkNetworkPulse {
  0% {
    transform: scale(1) translate(0, 0);
    opacity: 0.35;
  }
  50% {
    transform: scale(1.15) translate(-20px, 20px);
    opacity: 0.55;
  }
  100% {
    transform: scale(0.95) translate(20px, -15px);
    opacity: 0.4;
  }
}

[data-bs-theme="dark"] body.lk-shell::before {
  background: radial-gradient(circle, rgba(110, 168, 254, 0.28) 0%, rgba(13, 202, 240, 0.12) 60%, transparent 100%);
}

[data-bs-theme="dark"] body.lk-shell::after {
  background: radial-gradient(circle, rgba(163, 112, 247, 0.22) 0%, rgba(13, 110, 253, 0.15) 60%, transparent 100%);
}

[data-bs-theme="dark"] body.lk-shell {
  background:
    radial-gradient(1200px 600px at 60% 0%, rgba(13, 110, 253, 0.15) 0%, rgba(110, 168, 254, 0.05) 60%, transparent 100%),
    radial-gradient(900px 400px at 0% 100%, rgba(13, 110, 253, 0.08) 0%, transparent 80%),
    linear-gradient(160deg, var(--lk-bg-start), var(--lk-bg-end));
}

.lk-main-container {
  max-width: 1480px;
}

.lk-glass {
  border: 1px solid var(--lk-border);
  border-radius: 1rem;
  background-color: var(--lk-surface);
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.10);
  backdrop-filter: blur(16px) saturate(1.2);
  -webkit-backdrop-filter: blur(16px) saturate(1.2);
}

.lk-page-title {
  font-family: "Noto Sans", "Segoe UI", sans-serif;
  color: var(--lk-title-color);
  font-weight: 600;
}

.lk-section-title {
  color: var(--lk-title-color);
  font-weight: 600;
}

/* ── Buttons ───────────────────────────────────────────────────────────── */
.lk-btn-mono-accent {
  background: var(--lk-title-color) !important;
  color: var(--lk-bg-start) !important;
  border: 1px solid var(--lk-title-color) !important;
  border-radius: 0.75rem !important;
  font-weight: 600;
  letter-spacing: 0.01em;
  padding: 0.55rem 1.2rem;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.lk-btn-mono-accent:hover,
.lk-btn-mono-accent:focus {
  opacity: 0.92;
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
  color: var(--lk-bg-start) !important;
}

.lk-btn-mono-accent:active {
  transform: translateY(0);
}

.lk-btn-mono-outline {
  border: 1px solid var(--lk-border) !important;
  color: var(--lk-title-color) !important;
  background: transparent !important;
  border-radius: 0.75rem !important;
  font-weight: 500;
  padding: 0.55rem 1.2rem;
  transition: all 0.25s ease !important;
}

.lk-btn-mono-outline:hover,
.lk-btn-mono-outline:focus {
  background: color-mix(in srgb, var(--lk-title-color) 8%, transparent) !important;
  border-color: color-mix(in srgb, var(--lk-border) 50%, var(--lk-title-color)) !important;
  color: var(--lk-title-color) !important;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}

.error-page-wrap {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

.error-code {
  font-size: 6rem;
  font-weight: 700;
  line-height: 1;
  opacity: .15;
}

/* ── Animations & Keyframes ────────────────────────────────────────────── */
@keyframes lkFadeInUp {
  from {
    opacity: 0;
    transform: translateY(16px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes lkPulse {
  0% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(25, 135, 84, 0.6);
  }
  70% {
    transform: scale(1.15);
    box-shadow: 0 0 0 6px rgba(25, 135, 84, 0);
  }
  100% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(25, 135, 84, 0);
  }
}

.lk-animate-fade-in {
  animation: lkFadeInUp 0.5s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.lk-animate-delay-1 {
  animation-delay: 0.1s;
}

.lk-animate-delay-2 {
  animation-delay: 0.2s;
}

.lk-animate-delay-3 {
  animation-delay: 0.3s;
}