/* =========================================================
   TOKENS DE TEMA — Calculadora Preço Teto
   Identidade: grafite neutro + teal. O accent marca ação e
   seleção; ouro é reservado ao Preço Teto; verde/laranja/
   vermelho são estados de margem.
   ========================================================= */

:root {
  /* Escala de raio */
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 14px;

  /* Escala de z-index semântica */
  --z-sticky:   40;
  --z-backdrop: 60;
  --z-sidebar:  70;
  --z-modal:    80;
  --z-toast:    90;
  --z-tooltip:  100;

  /* Motion */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --t-fast: 140ms;
  --t-med:  220ms;
}

/* ===== TEMA ESCURO ===== */
:root[data-theme="dark"] {
  color-scheme: dark;

  --bg:            #0d0f13;
  --bg2:           #14171d;
  --bg3:           #1b1f27;
  --surface:       #14171d;
  --surface2:      #1b1f27;
  --border:        rgba(255, 255, 255, 0.08);
  --border2:       rgba(255, 255, 255, 0.14);

  --text:          #e9ecef;
  --text2:         #a3adb8;
  --text3:         #626c78;

  --accent:        #2fd4b5;
  --accent2:       #6ce6cd;
  --accent-glow:   rgba(47, 212, 181, 0.10);
  --accent-border: rgba(47, 212, 181, 0.32);
  --on-accent:     #06231d;

  --gold:          #f2c14e;
  --green:         #55d97e;
  --orange:        #f7a35c;
  --red:           #f47c7c;
  --green-bg:      rgba(85, 217, 126, 0.10);
  --orange-bg:     rgba(247, 163, 92, 0.10);
  --red-bg:        rgba(244, 124, 124, 0.10);
  --green-border:  rgba(85, 217, 126, 0.28);
  --orange-border: rgba(247, 163, 92, 0.28);
  --red-border:    rgba(244, 124, 124, 0.28);
  --row-opp-bg:    rgba(85, 217, 126, 0.16);

  --header-bg:     #101319;
  --topbar-bg:     rgba(13, 15, 19, 0.88);
  --th-bg:         #12151b;
  --tooltip-bg:    #1d222b;
  --shadow-sm:     0 1px 3px rgba(0, 0, 0, 0.35);
  --shadow-md:     0 8px 28px rgba(0, 0, 0, 0.45);
  --shadow-lg:     0 20px 60px rgba(0, 0, 0, 0.6);

  --scroll-track:  transparent;
  --scroll-thumb:  #2c333d;
  --footer-border: rgba(255, 255, 255, 0.06);
  --footer-text:   #79838f;
  --save-time:     #79838f;
}

/* ===== TEMA CLARO ===== */
:root[data-theme="light"] {
  color-scheme: light;

  --bg:            #f4f5f7;
  --bg2:           #ffffff;
  --bg3:           #eceef1;
  --surface:       #ffffff;
  --surface2:      #f4f5f7;
  --border:        rgba(17, 24, 32, 0.10);
  --border2:       rgba(17, 24, 32, 0.18);

  --text:          #171d26;
  --text2:         #4c5866;
  --text3:         #8b96a3;

  --accent:        #0e8074;
  --accent2:       #0b6b61;
  --accent-glow:   rgba(14, 128, 116, 0.08);
  --accent-border: rgba(14, 128, 116, 0.30);
  --on-accent:     #ffffff;

  --gold:          #9a6a08;
  --green:         #157a3c;
  --orange:        #b4500e;
  --red:           #c62828;
  --green-bg:      rgba(21, 122, 60, 0.08);
  --orange-bg:     rgba(180, 80, 14, 0.08);
  --red-bg:        rgba(198, 40, 40, 0.08);
  --green-border:  rgba(21, 122, 60, 0.26);
  --orange-border: rgba(180, 80, 14, 0.26);
  --red-border:    rgba(198, 40, 40, 0.26);
  --row-opp-bg:    rgba(21, 122, 60, 0.09);

  --header-bg:     #ffffff;
  --topbar-bg:     rgba(244, 245, 247, 0.88);
  --th-bg:         #f8f9fa;
  --tooltip-bg:    #ffffff;
  --shadow-sm:     0 1px 3px rgba(17, 24, 32, 0.07);
  --shadow-md:     0 8px 28px rgba(17, 24, 32, 0.10);
  --shadow-lg:     0 20px 60px rgba(17, 24, 32, 0.16);

  --scroll-track:  transparent;
  --scroll-thumb:  #c4cbd3;
  --footer-border: rgba(17, 24, 32, 0.08);
  --footer-text:   #6b7684;
  --save-time:     #6b7684;
}