/* NewsBridge base styles */
body {
  font-family: 'Inter', sans-serif;
}

/* ===========================================
   Custom Design Tokens as CSS Utility Classes
   These override/supplement Tailwind CDN
   =========================================== */

/* Background colors */
.bg-background-light { background-color: #f8f7fc; }
.bg-background-dark { background-color: #111022; }
.bg-surface-tint { background-color: #f5f4fa; }
.bg-input-bg { background-color: #f8f8fc; }

/* Text colors */
.text-text-main { color: #0e0d1b; }
.text-text-secondary { color: #5a5989; }
.text-text-secondary\/70 { color: rgba(90, 89, 137, 0.7); }

/* Border colors */
.border-border-light { border-color: #e8e7f0; }

/* Gradient colors for illustration */
.from-illustration-from { --tw-gradient-from: #f2f1fa; --tw-gradient-to: transparent; --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to); }
.to-illustration-to { --tw-gradient-to: #e8e6f5; }

/* Placeholder colors */
.placeholder-text-secondary\/60::placeholder { color: rgba(90, 89, 137, 0.6); }
.placeholder\:text-text-secondary\/70::placeholder { color: rgba(90, 89, 137, 0.7); }

/* Primary color (ensure consistency) */
.text-primary { color: #413eef; }
.bg-primary { background-color: #413eef; }
.border-primary { border-color: #413eef; }
.ring-primary { --tw-ring-color: #413eef; }
.shadow-primary\/20 { --tw-shadow-color: rgba(65, 62, 239, 0.2); }
.shadow-primary\/25 { --tw-shadow-color: rgba(65, 62, 239, 0.25); }
.shadow-primary\/30 { --tw-shadow-color: rgba(65, 62, 239, 0.3); }

/* Primary with opacity */
.bg-primary\/10 { background-color: rgba(65, 62, 239, 0.1); }
.bg-primary\/20 { background-color: rgba(65, 62, 239, 0.2); }
.bg-primary\/90 { background-color: rgba(65, 62, 239, 0.9); }
.hover\:bg-primary\/90:hover { background-color: rgba(65, 62, 239, 0.9); }

/* Hide scrollbar for stepper overflow on small screens */
.scrollbar-hide {
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.scrollbar-hide::-webkit-scrollbar {
  display: none;
}