@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap');

:root {
  /* Finve Official Visual Tokens from Obsidian Vault */
  --color-bg-main: #ffffff;
  --color-bg-card: #ffffff;
  --color-bg-subtle: #f8fafc;
  --color-bg-dark: #05070B;
  --color-accent: #FF9F1C;        /* Naranja Finve */
  --color-accent-hover: #F5920B;  /* Naranja Hover */
  --color-gold: #FFC247;          /* Resaltado Premium */
  --color-text-main: #0F172A;
  --color-text-muted: #64748B;
  --color-positive: #00C49A;      /* Verde Positivo Finve */
  --color-negative: #FF4D4D;      /* Rojo Negativo Finve */
  --color-border: #E2E8F0;
}

body {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  background-color: #ffffff;
  color: #0f172a;
  -webkit-font-smoothing: antialiased;
}

/* Custom Clean Scrollbars */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: #f8fafc;
}
::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 9999px;
}
::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
}

/* Step transitions */
.step-pane {
  display: none;
  opacity: 0;
  transform: translateY(6px);
  transition: opacity 0.2s ease-out, transform 0.2s ease-out;
}
.step-pane.active {
  display: block;
  opacity: 1;
  transform: translateY(0);
}

/* Signature Canvas */
#sig-canvas {
  touch-action: none;
  background: #ffffff;
  cursor: crosshair;
}

/* Inputs styling */
.form-input {
  width: 100%;
  border-radius: 0.75rem;
  border: 1px solid #e2e8f0;
  padding: 0.75rem 1rem;
  font-size: 0.95rem;
  background-color: #ffffff;
  color: #0f172a;
  transition: all 0.15s ease-in-out;
}
.form-input:focus {
  outline: none;
  border-color: #FF9F1C;
  box-shadow: 0 0 0 3px rgba(255, 159, 28, 0.18);
}

.form-label {
  display: block;
  font-size: 0.8rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #475569;
  margin-bottom: 0.35rem;
}

.form-hint {
  font-size: 0.75rem;
  color: #64748b;
  margin-top: 0.25rem;
}

/* Card highlight (Finve Orange Accent) */
.card-choice {
  transition: all 0.2s ease;
  border: 2px solid #e2e8f0;
  background-color: #ffffff;
}
.card-choice:hover {
  border-color: #cbd5e1;
}
.card-choice.selected {
  border-color: #FF9F1C;
  background-color: #FFFBF5;
  box-shadow: 0 1px 3px rgba(255, 159, 28, 0.1);
}

/* Finve Buttons */
.btn-finve-primary {
  background-color: #FF9F1C;
  color: #05070B;
  font-weight: 700;
  transition: all 0.15s ease;
}
.btn-finve-primary:hover {
  background-color: #F5920B;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(255, 159, 28, 0.25);
}

/* Pulsing submit badge */
@keyframes pulse-soft {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.6; }
}
.animate-pulse-soft {
  animation: pulse-soft 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}