/* ============================================================
   variables.css – Design tokens for Elnätsfakta.se
   All colors, sizes, and transitions are defined here.
   ============================================================ */

:root {
  /* --- Colors --- */
  --bg:           #382828;
  --accent1:      #78B9FF;   /* Blue – primary accent color */
  --accent2:      #FFC800;   /* Yellow – secondary accent color */
  --accent4:      #DEDEDE;   /* Light grey – border/outline/text */
  --white:        #ffffff;

  /* --- Button colors --- */
  --btn-text:     #1a1010;   /* Dark text on primary/accent buttons */
  --btn-hover-bg: #9fcfff;   /* Lighter blue on primary button hover */

  /* --- Component backgrounds --- */
  --neu-card-bg:  #3e2e2e;   /* Neumorphic card background */

  /* --- Glassmorphism --- */
  --glass-bg:     rgba(56, 40, 40, 0.45);
  --glass-border: rgba(222, 222, 222, 0.18);

  /* --- Neumorphism --- */
  --neu-light:    rgba(255, 255, 255, 0.07);
  --neu-dark:     rgba(0, 0, 0, 0.35);

  /* --- Navigation --- */
  --nav-h:        125px;
  --nav-h-small:  80px;

  /* --- Default transition --- */
  --transition:   0.4s cubic-bezier(.4, 0, .2, 1);
}