/* =========================
   DARK THEME VARIABLES
========================= */
:root {
    --bg-main: #0f172a;
    --bg-card: #020617;
    --bg-ad: #020617;
    --bg-trust: #020617;
  
    --text-main: #e5e7eb;
    --text-muted: #9ca3af;
  
    --primary: #38bdf8;
    --primary-soft: #0f172a;
  
    --border-color: #1e293b;
    --shadow-soft: 0 10px 30px rgba(0, 0, 0, 0.6);
  }
  
  /* =========================
     APPLY COLORS
  ========================= */
  body {
    background: var(--bg-main);
    color: var(--text-main);
  }
  
  a {
    color: var(--primary);
  }
  
  .calculator-card {
    background: var(--bg-card);
    box-shadow: var(--shadow-soft);
  }
  
  input {
    background: #020617;
    border-color: var(--border-color);
    color: var(--text-main);
  }
  
  input:focus {
    outline: none;
    border-color: var(--primary);
  }
  
  /* =========================
     BUTTONS
  ========================= */
  button {
    background: var(--primary-soft);
    color: var(--primary);
  }
  
  #resetBtn {
    background: #3f1d1d;
    color: #fecaca;
  }
  
  /* =========================
     THEME BUTTONS
  ========================= */
  .theme-btn {
    background: transparent;
    border-color: var(--border-color);
    color: var(--text-muted);
  }
  
  .theme-btn.active {
    border-color: var(--primary);
    color: var(--primary);
  }
  
  /* =========================
     TRUST BAR
  ========================= */
  .trust-bar {
    background: var(--bg-trust);
    border: 1px solid var(--border-color);
    color: var(--text-muted);
  }
  
  /* =========================
     ADS
  ========================= */
  .ad-slot {
    background: var(--bg-ad);
    border: 1px dashed var(--border-color);
    color: var(--text-muted);
  }
  
  /* =========================
     FOOTER
  ========================= */
  .site-footer {
    color: var(--text-muted);
  }