:root {
  color-scheme: light;
  --background-main: #DDE2EA !important;
  --background-secondary: #E6E9EF !important;
  --surface-card: #F1F3F7 !important;
  --surface-elevated: #FFFFFF !important;
  --bg: #DDE2EA !important;
  --surface: #FFFFFF !important;
  --surface-hover: #F7F8FA !important;
  --text-primary: #111827 !important;
  --text-secondary: #4B5563 !important;
  --text-muted: #6B7280 !important;
  --text-disabled: #9CA3AF !important;
  --brand-blue: #1900FF !important;
  --brand-purple: #4212A3 !important;
  --accent: #1900FF !important;
  --accent-hover: #1300CC !important;
  --border-soft: #CBD5E1 !important;
  --divider: #D1D5DB !important;
  --success: #16A34A !important;
  --warning: #F59E0B !important;
  --error: #DC2626 !important;
  --danger: #DC2626 !important;
  --info: #2563EB !important;
  --font-main: "Avenir Next", Avenir, Inter, "SF Pro Display", "Helvetica Neue", Arial, sans-serif !important;
  --shadow-sm: 0 1px 2px rgba(15, 23, 42, .05), 0 4px 12px rgba(15, 23, 42, .04) !important;
  --shadow-md: 0 12px 30px rgba(15, 23, 42, .08) !important;
  --shadow-lg: 0 24px 64px rgba(15, 23, 42, .11) !important;
}

* { box-sizing: border-box; }
html { background: var(--background-main); }

body {
  color: var(--text-primary) !important;
  background:
    radial-gradient(circle at 14% 10%, rgba(25, 0, 255, .08), transparent 34%),
    radial-gradient(circle at 88% 18%, rgba(66, 18, 163, .055), transparent 30%),
    var(--background-main) !important;
  font-family: var(--font-main) !important;
  letter-spacing: -.012em;
  -webkit-font-smoothing: antialiased;
}

body::before { display: none !important; }

.main-container,
.login-card,
.register-card,
.users-table,
.modal-content,
.updates-card {
  background: rgba(255, 255, 255, .94) !important;
  border: 1px solid rgba(148, 163, 184, .48) !important;
  box-shadow: var(--shadow-lg) !important;
}

.main-container,
.login-card,
.register-card { border-radius: 20px !important; }

.logo-wrapper {
  background: var(--surface-card) !important;
  border: 1px solid var(--border-soft) !important;
  box-shadow: var(--shadow-sm) !important;
}

h1, h2, h3, .brand-text, .table-title {
  color: var(--text-primary) !important;
  letter-spacing: -.035em;
}

h1 span { color: var(--brand-blue) !important; }
.subtitle, .sub-text, .help-text { color: var(--text-secondary) !important; line-height: 1.65; }

label, .input-group label, .form-group label {
  color: #374151 !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  letter-spacing: .015em;
}

input, select, textarea {
  background: #FFFFFF !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border-soft) !important;
  border-radius: 10px !important;
  min-height: 46px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .03) !important;
}

input::placeholder, textarea::placeholder { color: #9CA3AF !important; }
input:hover, select:hover, textarea:hover { border-color: #94A3B8 !important; }
input:focus, select:focus, textarea:focus {
  border-color: var(--brand-blue) !important;
  box-shadow: 0 0 0 3px rgba(25, 0, 255, .11) !important;
  outline: none !important;
}

button, .btn, a.btn {
  border-radius: 9px !important;
  font-family: inherit !important;
  font-weight: 650 !important;
  letter-spacing: -.005em;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease !important;
}

button:hover:not(:disabled), .btn:hover:not(:disabled), a.btn:hover { transform: translateY(-1px); }

.btn-primary, button[type="submit"], #submitBtn, #finalSubmitBtn, #confirmPackageBtn {
  color: #FFFFFF !important;
  border: 1px solid var(--brand-blue) !important;
  background: var(--brand-blue) !important;
  box-shadow: 0 8px 20px rgba(25, 0, 255, .18) !important;
}

.btn-primary:hover:not(:disabled), button[type="submit"]:hover:not(:disabled), #submitBtn:hover:not(:disabled) {
  background: #1300CC !important;
  border-color: #1300CC !important;
  box-shadow: 0 10px 24px rgba(25, 0, 255, .24) !important;
}

.btn-secondary, .btn-google, .btn:not(.btn-primary) {
  color: var(--text-primary) !important;
  background: #FFFFFF !important;
  border: 1px solid var(--border-soft) !important;
}

.btn-secondary:hover, .btn-google:hover, .btn:not(.btn-primary):hover {
  background: var(--surface-card) !important;
  border-color: #94A3B8 !important;
}

.feature-list, .info-card, .info-box, .stat-card, .package-card, .summary-card, .invite-link-box {
  background: var(--surface-card) !important;
  border: 1px solid var(--border-soft) !important;
  border-radius: 14px !important;
}

.package-card:hover {
  border-color: rgba(25, 0, 255, .55) !important;
  transform: translateY(-2px);
  box-shadow: var(--shadow-md) !important;
}

.package-card.selected {
  border-color: var(--brand-blue) !important;
  background: #FFFFFF !important;
  box-shadow: 0 0 0 3px rgba(25, 0, 255, .09) !important;
}

.trial-badge, .version-tag {
  color: var(--brand-blue) !important;
  background: rgba(25, 0, 255, .07) !important;
  border: 1px solid rgba(25, 0, 255, .16) !important;
}

.feature-icon, .success-icon { color: var(--success) !important; }
.feature-icon:empty {
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  margin-top: .5em;
  border-radius: 50%;
  background: var(--success);
}
.error-message, .error-text { color: var(--error) !important; }
.error-message { background: rgba(220, 38, 38, .06) !important; border-color: rgba(220, 38, 38, .3) !important; }

.step-dot { background: #E5E7EB !important; border-color: #CBD5E1 !important; }
.step-dot.active, .step-dot.completed {
  background: var(--brand-blue) !important;
  border-color: var(--brand-blue) !important;
  box-shadow: 0 0 0 4px rgba(25, 0, 255, .1) !important;
}
.step-line { background: #CBD5E1 !important; }

.top-nav {
  background: rgba(255, 255, 255, .88) !important;
  border-bottom: 1px solid rgba(148, 163, 184, .42) !important;
  backdrop-filter: blur(18px) saturate(140%) !important;
  box-shadow: 0 6px 24px rgba(15, 23, 42, .06) !important;
}

table { color: var(--text-primary) !important; }
thead, .table-header { background: var(--surface-card) !important; border-color: var(--border-soft) !important; }
th { color: var(--text-secondary) !important; font-size: 11px !important; text-transform: uppercase; letter-spacing: .08em; }
td, th { border-color: var(--divider) !important; }
tbody tr:hover { background: rgba(25, 0, 255, .035) !important; }

.modal { background: rgba(15, 23, 42, .42) !important; backdrop-filter: blur(8px) !important; }
.status-bar { color: var(--text-secondary) !important; }
.status-dot { background: var(--success) !important; box-shadow: none !important; }

.trial-cta {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 16px;
  margin-top: 22px;
  padding: 18px;
  background: var(--surface-card);
  border: 1px solid var(--border-soft);
  border-radius: 12px;
}
.trial-cta strong, .trial-cta span { display: block; }
.trial-cta strong { color: var(--text-primary); font-size: 13px; margin-bottom: 4px; }
.trial-cta span { color: var(--text-secondary); font-size: 12px; line-height: 1.5; }
.trial-actions { display: flex; align-items: center; gap: 12px; }
.trial-cta a { color: var(--brand-blue); font-size: 12px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.trial-cta a:hover { color: var(--brand-purple); }
.trial-cta a.secondary-link { color: var(--text-secondary); }

@media (max-width: 760px) {
  body { padding: 18px 14px !important; overflow-y: auto !important; }
  .main-container, .login-card, .register-card { padding: 30px 22px !important; border-radius: 16px !important; }
  .main-wrapper { width: 100% !important; }
  .updates-card { display: none !important; }
  .top-nav { padding: 0 16px !important; }
  .stats-row { grid-template-columns: 1fr !important; }
  h1 { font-size: clamp(27px, 8vw, 36px) !important; }
  .trial-cta { grid-template-columns: 1fr; }
  .trial-actions { align-items: flex-start; flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}
