:root {
  --color-bg-base: #111516;
  --color-bg-card: #181E20;
  --color-bg-card-hover: #20272A;
  --color-text-primary: #ffffff;
  --color-text-secondary: #939598;
  --color-statum: #00afef;
  --color-senior: #00aa9e;
  --color-trusth: #af005f;
  --font-main: 'Montserrat', sans-serif;
}

body {
  font-family: var(--font-main);
  background-color: var(--color-bg-base);
  color: var(--color-text-primary);
  margin: 0;
  -webkit-font-smoothing: antialiased;
}

/* Modal Animations */
.modal-overlay {
  background-color: rgba(17, 21, 22, 0.9);
  backdrop-filter: blur(8px);
  transition: opacity 0.3s ease;
}

.modal-content {
  transform: translateY(-20px) scale(0.95);
  opacity: 0;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  background-color: var(--color-bg-card);
  border: 1px solid var(--color-text-secondary);
}

.modal-open .modal-content {
  transform: translateY(0) scale(1);
  opacity: 1;
}

/* Form Wizard Transitions */
.wizard-step {
  display: none;
  animation: fadeInRight 0.4s ease forwards;
}

.wizard-step.active {
  display: block;
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    transform: translateX(20px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* Progress Bar */
.progress-bar-container {
  background-color: #2a3438;
  height: 8px;
  border-radius: 4px;
  overflow: hidden;
}

.progress-bar-fill {
  background: linear-gradient(90deg, var(--color-senior) 0%, var(--color-statum) 100%);
  height: 100%;
  width: 33.33%;
  transition: width 0.4s ease;
}

/* Custom Inputs for Dark Theme */
.input-dark {
  background-color: #1e2528;
  border: 1px solid #333d42;
  color: #fff;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.input-dark:focus {
  border-color: var(--color-senior);
  box-shadow: 0 0 0 2px rgba(0, 170, 158, 0.2);
  outline: none;
}

.input-dark::placeholder {
  color: #5c6468;
}

/* Buttons */
.btn-primary {
  position: relative;
  background-color: transparent;
  color: #fff;
  font-weight: 700;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.05); /* Faint base border */
  z-index: 1;
  transition: transform 0.2s, box-shadow 0.2s;
}

/* O Cometa / Tail Light */
.btn-primary::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 180px; 
  height: 40px;
  /* Centraliza no mouse e rotaciona para onde está indo */
  transform: translate(calc(var(--mouse-x, 0px) - 90px), calc(var(--mouse-y, 0px) - 20px)) rotate(var(--tail-angle, 0deg));
  /* Degradê da cauda transparente até a cabeça brilhante (Magenta -> Azul -> Verde na cauda) */
  background: linear-gradient(
    90deg, 
    transparent 0%, 
    rgba(0, 170, 158, 0.5) 30%,   /* Senior */
    rgba(0, 175, 239, 0.9) 70%,   /* Statum */
    rgba(175, 0, 95, 1) 100%      /* Trusth (Ponto focal) */
  );
  border-radius: 50%;
  filter: blur(6px);
  opacity: 0;
  transition: opacity 0.3s;
  z-index: -2;
  pointer-events: none;
}

/* O Preenchimento Sólido do Botão (Bloqueia a luz no meio) */
.btn-primary::after {
  content: '';
  position: absolute;
  inset: 1.5px; /* Espessura da borda brilhante */
  background-color: #111516; /* Escuro sólido, NUNCA fica transparente */
  border-radius: inherit;
  z-index: -1;
  pointer-events: none;
}

.btn-primary:hover::before {
  opacity: 1;
}

.btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 30px -10px rgba(0, 175, 239, 0.3);
}

.btn-dark-solid {
  position: relative;
  background-color: #111516;
  color: #fff;
  font-weight: 700;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.05); /* Faint base border */
  z-index: 1;
  transition: transform 0.2s, box-shadow 0.2s;
}

.btn-dark-solid:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 20px -10px rgba(0, 0, 0, 0.5);
}

.btn-secondary {
  background-color: #2a3438;
  color: #fff;
  transition: background-color 0.2s;
}

.btn-secondary:hover {
  background-color: #38454a;
}

/* Custom Inputs for Light Theme */
.input-light {
  background-color: #f9fafb;
  border: 1px solid #d1d5db;
  color: #111827;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.input-light:focus {
  border-color: var(--color-senior);
  box-shadow: 0 0 0 2px rgba(0, 170, 158, 0.2);
  outline: none;
}

.input-light::placeholder {
  color: #9ca3af;
}
