/* TENOV Design Tokens — Dark + Light theme */

/* ---- DARK (default) ---- */
:root,
[data-theme="dark"] {
  --text-xs: clamp(0.75rem, 0.72rem + 0.2vw, 0.875rem);
  --text-sm: clamp(0.875rem, 0.82rem + 0.25vw, 1rem);
  --text-base: clamp(1rem, 0.95rem + 0.2vw, 1.125rem);
  --text-lg: clamp(1.125rem, 1.04rem + 0.45vw, 1.4rem);
  --text-xl: clamp(1.4rem, 1.1rem + 1.2vw, 2.15rem);
  --text-2xl: clamp(2rem, 1.4rem + 2.8vw, 3.8rem);
  --text-hero: clamp(2.8rem, 1.4rem + 5vw, 6rem);

  --space-1: 0.25rem;  --space-2: 0.5rem;   --space-3: 0.75rem;
  --space-4: 1rem;     --space-5: 1.25rem;  --space-6: 1.5rem;
  --space-8: 2rem;     --space-10: 2.5rem;  --space-12: 3rem;
  --space-16: 4rem;    --space-20: 5rem;    --space-24: 6rem;

  /* Surfaces */
  --color-bg:            #070709;
  --color-surface:       #101115;
  --color-surface-2:     #161821;
  --color-surface-3:     #1d2030;
  --color-border:        rgba(255,255,255,0.09);
  --color-divider:       rgba(255,255,255,0.07);

  /* Text */
  --color-text:          #f4f6fb;
  --color-text-muted:    rgba(244,246,251,0.68);
  --color-text-faint:    rgba(244,246,251,0.38);

  /* Brand accents */
  --color-primary:       #626fb5;
  --color-primary-hover: #7a89cc;
  --color-secondary:     #58a8a0;
  --color-secondary-hover: #6fc4bb;
  --color-gradient:      linear-gradient(135deg, #58a8a0 0%, #626fb5 100%);
  --color-gradient-raw-start: #58a8a0;
  --color-gradient-raw-end:   #626fb5;

  /* Semantic */
  --color-success:       #73c692;
  --color-warning:       #e4b75f;
  --color-danger:        #e37a8e;

  /* Bg glow (used inline in body/sections) */
  --glow-primary-rgb:    98,111,181;
  --glow-secondary-rgb:  88,168,160;

  /* Header bg */
  --header-bg:           rgba(7,7,9,0.88);
  --header-border:       rgba(255,255,255,0.08);

  /* Card gradient */
  --card-bg-from:        rgba(22,24,33,0.92);
  --card-bg-to:          rgba(14,15,20,0.92);

  /* Auth panel */
  --auth-bg-from:        rgba(16,17,21,0.97);
  --auth-bg-to:          rgba(7,7,9,0.97);
  --auth-card-bg:        rgba(22,24,33,0.82);
  --auth-input-bg:       rgba(255,255,255,0.03);
  --auth-input-focus-bg: rgba(255,255,255,0.05);

  /* Misc */
  --radius-sm:  0.6rem;  --radius-md:  1rem;
  --radius-lg:  1.4rem;  --radius-xl:  1.8rem;
  --radius-full: 9999px;

  --shadow-sm:  0 4px 16px rgba(0,0,0,0.25);
  --shadow-md:  0 8px 32px rgba(0,0,0,0.30);
  --shadow-lg:  0 20px 60px rgba(0,0,0,0.40);
  --shadow-glow-primary:   0 0 40px rgba(98,111,181,0.22);

  --font-display: 'Montserrat', sans-serif;
  --font-body:    'Montserrat', sans-serif;

  --content-narrow:  640px;
  --content-default: 960px;
  --content-wide:    1280px;

  --transition:      180ms cubic-bezier(0.16, 1, 0.3, 1);
  --transition-slow: 340ms cubic-bezier(0.16, 1, 0.3, 1);
}

/* ---- LIGHT ---- */
[data-theme="light"] {
  /* Surfaces */
  --color-bg:            #f0f2f8;
  --color-surface:       #f7f8fc;
  --color-surface-2:     #ffffff;
  --color-surface-3:     #eef0f7;
  --color-border:        rgba(80,90,160,0.14);
  --color-divider:       rgba(80,90,160,0.10);

  /* Text */
  --color-text:          #1a1c2e;
  --color-text-muted:    rgba(26,28,46,0.62);
  --color-text-faint:    rgba(26,28,46,0.36);

  /* Brand accents — slightly deeper for contrast */
  --color-primary:       #4a58a8;
  --color-primary-hover: #3848921;
  --color-secondary:     #3d8e87;
  --color-secondary-hover: #2e7871;
  --color-gradient:      linear-gradient(135deg, #3d8e87 0%, #4a58a8 100%);
  --color-gradient-raw-start: #3d8e87;
  --color-gradient-raw-end:   #4a58a8;

  /* Semantic */
  --color-success:       #2d9b56;
  --color-warning:       #b87a10;
  --color-danger:        #c4405a;

  /* Glow */
  --glow-primary-rgb:    74,88,168;
  --glow-secondary-rgb:  61,142,135;

  /* Header */
  --header-bg:           rgba(240,242,248,0.88);
  --header-border:       rgba(80,90,160,0.14);

  /* Card */
  --card-bg-from:        rgba(247,248,252,0.97);
  --card-bg-to:          rgba(238,240,247,0.97);

  /* Auth panel */
  --auth-bg-from:        rgba(247,248,252,0.99);
  --auth-bg-to:          rgba(238,240,247,0.99);
  --auth-card-bg:        rgba(255,255,255,0.90);
  --auth-input-bg:       rgba(80,90,160,0.04);
  --auth-input-focus-bg: rgba(80,90,160,0.07);
}

/* ---- Острые углы (data-corners="sharp") ---- */
[data-corners="sharp"] {
  --radius-sm:   0;
  --radius-md:   0;
  --radius-lg:   0;
  --radius-xl:   0;
  --radius-full: 0;
}