/* Junk Mint Clean Minimalist Light Theme Stylesheet */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Montserrat:wght@700;800;900&family=JetBrains+Mono:wght@500;700&display=swap');

:root,
[data-theme],
[data-theme="junkmint"],
[data-theme="light"] {
  /* Brand Tokens: Clean White Minimalist Canvas + High-Contrast Black & Mint Accent */
  --p: 86.8% 0.19 160;
  --fallback-p: #00F5A0;
  --primary: #00F5A0;
  --primary-content: #000000;
  --pc: 0% 0 0;
  --fallback-pc: #000000;

  /* Surfaces: Crisp White & Subtle Neutral Gray */
  --b1: 100% 0 0;
  --fallback-b1: #FFFFFF;
  --b2: 98% 0.005 160;
  --fallback-b2: #F8FAF9;
  --b3: 94% 0.01 160;
  --fallback-b3: #EBF0ED;
  --bc: 18% 0.01 160;
  --fallback-bc: #0F172A;

  /* Neutral: Deep Slate */
  --n: 18% 0.01 160;
  --fallback-n: #0F172A;
  --nc: 100% 0 0;
  --fallback-nc: #FFFFFF;

  /* High-Contrast Mint for Text / Icons */
  --in: 55% 0.18 160;
  --fallback-in: #059669;
  --inc: 100% 0 0;
  --fallback-inc: #FFFFFF;

  --su: 55% 0.18 140;
  --fallback-su: #16A34A;
  --wa: 70% 0.18 70;
  --fallback-wa: #D97706;
  --er: 60% 0.22 25;
  --fallback-er: #DC2626;

  --rounded-box: 0.75rem;
  --rounded-btn: 0.375rem;
  --rounded-badge: 0.25rem;
}

html {
  scroll-behavior: smooth;
  color-scheme: light;
  background-color: #FFFFFF;
}

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  background-color: #FFFFFF;
  color: #0F172A;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6, .font-heading {
  font-family: 'Montserrat', 'Inter', -apple-system, sans-serif;
  letter-spacing: -0.02em;
  color: #0F172A;
}

.font-mono {
  font-family: 'JetBrains Mono', monospace;
}

/* ==========================================================================
   MINIMALIST LIGHT COMPONENT POLISH
   ========================================================================== */

/* Primary Button: Solid Mint, Bold Black Text */
.btn-primary {
  background-color: #00F5A0 !important;
  border-color: #00DF8F !important;
  color: #000000 !important;
  font-weight: 700 !important;
  letter-spacing: 0.03em;
  transition: all 0.15s ease-in-out;
}
.btn-primary:hover,
.btn-primary:focus {
  background-color: #00DF8F !important;
  border-color: #00C882 !important;
  color: #000000 !important;
  transform: translateY(-1px);
}

/* Secondary / Outline Button */
.btn-outline {
  border-color: #CBD5E1 !important;
  color: #0F172A !important;
  background-color: #FFFFFF !important;
}
.btn-outline:hover {
  background-color: #F8FAF9 !important;
  border-color: #0F172A !important;
  color: #0F172A !important;
}

/* Text Accents on White Background */
.text-primary {
  color: #059669 !important;
}
.text-mint-dark {
  color: #047857 !important;
}

/* Badges */
.badge-primary {
  background-color: #00F5A0 !important;
  border-color: #00DF8F !important;
  color: #000000 !important;
}

/* Stats Container */
.stats {
  background-color: #FFFFFF;
  border: 1px solid #E2E8F0;
}
.stat {
  border-color: #E2E8F0;
}

/* Links */
a.link-mint,
.link {
  color: #059669 !important;
  text-underline-offset: 4px;
}
a.link-mint:hover,
.link:hover {
  color: #047857 !important;
}

/* Input Fields */
.input,
.select,
.textarea {
  background-color: #FFFFFF !important;
  border-color: #CBD5E1 !important;
  color: #0F172A !important;
}
.input:focus,
.select:focus,
.textarea:focus {
  border-color: #059669 !important;
  outline: 2px solid rgba(5, 150, 105, 0.2) !important;
}

/* Range Slider */
.range-primary {
  --range-shdw: #059669 !important;
  accent-color: #059669 !important;
}
.range-primary::-webkit-slider-thumb {
  background-color: #059669 !important;
}
.range-primary::-moz-range-thumb {
  background-color: #059669 !important;
}

/* Steps */
.step-primary::after,
.step-primary::before {
  background-color: #00F5A0 !important;
  color: #000000 !important;
}

/* Minimalist Light Scrollbar */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: #F8FAF9;
}
::-webkit-scrollbar-thumb {
  background: #CBD5E1;
  border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
  background: #059669;
}
