@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500&family=Space+Grotesk:wght@400;500;600;700&display=swap');

:root {
  color-scheme: light;
  --lg-ink: #0f0f10;
  --lg-ink-soft: #2f3134;
  --lg-muted: #6a6f76;
  --lg-border: rgba(0, 0, 0, 0.14);
  --lg-surface: rgba(255, 255, 255, 0.28);
  --lg-surface-strong: rgba(255, 255, 255, 0.42);
  --lg-shadow: 0 24px 60px rgba(0, 0, 0, 0.12);
  --lg-grid: rgba(0, 0, 0, 0.06);
  --lg-highlight: rgba(255, 255, 255, 0.75);
  --lg-contrast: rgba(0, 0, 0, 0.8);
}

body.lg-body {
  font-family: "Space Grotesk", "IBM Plex Mono", sans-serif;
  color: var(--lg-ink);
  min-height: 100vh;
}

body.lg-body:not(.lg-keep-bg) {
  background-color: #edf0f4;
  background-image:
    linear-gradient(0deg, var(--lg-grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--lg-grid) 1px, transparent 1px),
    radial-gradient(1200px circle at 10% -10%, rgba(255, 255, 255, 0.9), transparent 55%),
    radial-gradient(900px circle at 90% 10%, rgba(255, 255, 255, 0.8), transparent 60%);
  background-size: 28px 28px, 28px 28px, auto, auto;
}

body.lg-body * {
  text-rendering: geometricPrecision;
}

body.lg-body h1,
body.lg-body h2,
body.lg-body h3,
body.lg-body h4,
body.lg-body h5,
body.lg-body h6 {
  letter-spacing: -0.02em;
  color: var(--lg-ink);
}

body.lg-body a {
  color: var(--lg-ink);
  text-decoration: none;
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}

body.lg-body a:hover {
  color: var(--lg-contrast);
  border-bottom-color: rgba(0, 0, 0, 0.55);
}

body.lg-body .lg-panel,
body.lg-body .container,
body.lg-body .card,
body.lg-body .modal-content,
body.lg-body .message,
body.lg-body .invoice,
body.lg-body .content-wrapper,
body.lg-body section,
body.lg-body header,
body.lg-body .hero {
  background: var(--lg-surface);
  border: 1px solid var(--lg-border);
  border-radius: 20px;
  box-shadow: var(--lg-shadow);
  -webkit-backdrop-filter: blur(24px);
  backdrop-filter: blur(24px);
}

body.lg-body .modal-content .modal-header,
body.lg-body .modal-content .modal-footer {
  background: rgba(255, 255, 255, 0.2);
  border-color: var(--lg-border);
}

body.lg-body .modal-content .modal-header {
  border-bottom: 1px solid var(--lg-border);
}

body.lg-body .modal-content .modal-footer {
  border-top: 1px solid var(--lg-border);
}

body.lg-body .modal-content .modal-header.bg-dark,
body.lg-body .modal-content .modal-header.bg-success,
body.lg-body .modal-content .modal-header.bg-primary,
body.lg-body .modal-content .modal-header.bg-secondary,
body.lg-body .modal-content .modal-header.bg-danger,
body.lg-body .modal-content .modal-header.bg-warning,
body.lg-body .modal-content .modal-header.bg-info {
  background: rgba(255, 255, 255, 0.2) !important;
  color: var(--lg-ink) !important;
}

body.lg-body .modal-content .modal-title,
body.lg-body .modal-content .modal-header .text-white {
  color: var(--lg-ink) !important;
}

body.lg-body .modal-content .btn-close,
body.lg-body .modal-content .btn-close-white {
  background-color: rgba(0, 0, 0, 0.08);
  border: 1px solid var(--lg-border);
  border-radius: 999px;
  filter: none;
  opacity: 0.7;
}

body.lg-body .modal-content .btn-close:hover,
body.lg-body .modal-content .btn-close-white:hover {
  opacity: 0.95;
}

body.lg-body .lg-panel {
  padding: 2rem;
}

body.lg-login-clear section.stark-login {
  background: transparent;
  border: 0;
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

body.lg-body nav.navbar,
body.lg-body .navbar {
  background: rgba(255, 255, 255, 0.7) !important;
  border-bottom: 1px solid var(--lg-border);
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
}

body.lg-body .table,
body.lg-body table {
  background: var(--lg-surface-strong);
  border: 1px solid var(--lg-border);
  border-collapse: collapse;
  width: 100%;
}

body.lg-body th,
body.lg-body td {
  border: 1px solid var(--lg-border);
  border-color: var(--lg-border) !important;
}

body.lg-body thead {
  background: rgba(255, 255, 255, 0.85);
}

body.lg-body .alert {
  background: rgba(255, 255, 255, 0.4);
  border: 1px solid var(--lg-border);
  color: var(--lg-ink-soft);
}

body.lg-body .status {
  color: var(--lg-ink);
}

body.lg-body .note,
body.lg-body .refund-policy {
  background: rgba(255, 255, 255, 0.45);
  border: 1px solid var(--lg-border);
  border-radius: 16px;
}

body.lg-body input,
body.lg-body select,
body.lg-body textarea,
body.lg-body .form-control,
body.lg-body .form-select {
  background: rgba(255, 255, 255, 0.4);
  border: 1px solid var(--lg-border);
  color: var(--lg-ink);
  border-radius: 14px;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.35);
}

body.lg-body input:focus,
body.lg-body select:focus,
body.lg-body textarea:focus,
body.lg-body .form-control:focus,
body.lg-body .form-select:focus {
  border-color: rgba(0, 0, 0, 0.4);
  box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.08);
}

body.lg-body button,
body.lg-body .btn {
  background: rgba(0, 0, 0, 0.82);
  color: #f5f5f5;
  border: 1px solid rgba(0, 0, 0, 0.7);
  border-radius: 999px;
  padding: 0.6rem 1.4rem;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

body.lg-body button:hover,
body.lg-body .btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15);
  background: rgba(0, 0, 0, 0.9);
}

body.lg-body .btn-outline-secondary,
body.lg-body .btn-outline-primary,
body.lg-body .btn-outline-success,
body.lg-body .btn-outline-danger {
  background: transparent;
  color: var(--lg-ink);
  border: 1px solid rgba(0, 0, 0, 0.4);
}

body.lg-body .btn-primary,
body.lg-body .btn-success,
body.lg-body .btn-danger,
body.lg-body .btn-secondary {
  background: rgba(0, 0, 0, 0.82);
  border-color: rgba(0, 0, 0, 0.7);
  color: #f5f5f5;
}

body.lg-body .badge,
body.lg-body .tag,
body.lg-body .trial-dialog-tag {
  background: rgba(0, 0, 0, 0.8);
  color: #f5f5f5;
  border-radius: 999px;
  padding: 0.2rem 0.8rem;
}

body.lg-body .modal-backdrop.show {
  background-color: rgba(0, 0, 0, 0.4);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}

body.lg-body .text-muted,
body.lg-body .muted,
body.lg-body .small-muted,
body.lg-body .footer-note,
body.lg-body .legal {
  color: var(--lg-muted) !important;
}

body.lg-body .bg-white,
body.lg-body .dark\:bg-black,
body.lg-body .dark\:bg-white {
  background-color: rgba(255, 255, 255, 0.35) !important;
  border: 1px solid var(--lg-border);
  -webkit-backdrop-filter: blur(22px);
  backdrop-filter: blur(22px);
}

body.lg-body .bg-black {
  background-color: rgba(10, 10, 10, 0.7) !important;
  color: #f5f5f5;
}

body.lg-body .text-black {
  color: var(--lg-ink) !important;
}

body.lg-body .text-white {
  color: #f5f5f5 !important;
}

body.lg-body .shadow,
body.lg-body .shadow-lg,
body.lg-body .shadow-xl {
  box-shadow: var(--lg-shadow) !important;
}

body.lg-body .rounded,
body.lg-body .rounded-lg,
body.lg-body .rounded-xl,
body.lg-body .rounded-4,
body.lg-body .rounded-5 {
  border-radius: 20px !important;
}

body.lg-body .main-container {
  padding: 1.5rem;
}

body.lg-body .review-frame {
  background: rgba(255, 255, 255, 0.35);
  border: 1px solid var(--lg-border);
  border-radius: 18px;
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
}

body.lg-body .file-upload-section {
  background: rgba(255, 255, 255, 0.3);
  border: 1px solid var(--lg-border);
  border-radius: 18px;
  padding: 1.5rem;
  box-shadow: var(--lg-shadow);
}

body.lg-body .lang-toggle select,
body.lg-body .lang-switch select {
  background: rgba(255, 255, 255, 0.7);
  border: 1px solid var(--lg-border);
  border-radius: 999px;
  padding: 0.4rem 0.8rem;
}

body.lg-body .navbar-brand,
body.lg-body .nav-link {
  color: var(--lg-ink) !important;
}

body.lg-body hr {
  border-color: rgba(0, 0, 0, 0.2);
}

body.lg-body .glass {
  background: var(--lg-surface);
  border: 1px solid var(--lg-border);
  -webkit-backdrop-filter: blur(22px);
  backdrop-filter: blur(22px);
}

@keyframes lg-fade-up {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

body.lg-body section,
body.lg-body .container,
body.lg-body .card,
body.lg-body .content-wrapper {
  animation: lg-fade-up 0.5s ease both;
}