/* ============================================================
   DELTA SHOP — CSS Custom Properties
   Основная тема: тёмная. Переключатель: [data-theme="light"]
   ============================================================ */

:root {
  /* === Акцент: золотой (цвет логотипа) === */
  --accent:        #C9A84C;
  --accent-hover:  #B8952F;
  --accent-light:  rgba(201, 168, 76, 0.12);
  --accent-rgb:    201, 168, 76;

  /* === Тёмная тема (по умолчанию) === */
  --bg:            #0A0A0A;
  --bg-secondary:  #111111;
  --bg-card:       #161616;
  --bg-input:      #1E1E1E;

  --text-primary:  #F0F0F0;
  --text-secondary:#9A9AA0;
  --text-muted:    #555560;
  --text-invert:   #0A0A0A;

  --border:        #232323;
  --border-strong: #303030;

  --shadow-sm:     0 1px 4px rgba(0,0,0,0.4);
  --shadow-md:     0 4px 20px rgba(0,0,0,0.55);
  --shadow-lg:     0 12px 48px rgba(0,0,0,0.7);

  /* === Шапка === */
  --header-bg:     rgba(10,10,10,0.92);
  --header-border: rgba(255,255,255,0.06);

  /* === Кнопки === */
  --btn-primary-bg:   var(--accent);
  --btn-primary-text: #0A0A0A;
  --btn-ghost-border: var(--border-strong);
  --btn-ghost-text:   var(--text-primary);

  /* === Типографика === */
  --font-main:  'Onest', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* === Радиусы — умеренные === */
  --radius-sm:   4px;
  --radius-md:   6px;
  --radius-lg:   8px;
  --radius-xl:   12px;
  --radius-full: 9999px;

  --container:   1280px;
  --header-h:    68px;

  --transition:      0.2s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ============================================================
   СВЕТЛАЯ ТЕМА (переключается)
   ============================================================ */
[data-theme="light"] {
  --bg:            #F8F8F6;
  --bg-secondary:  #F0F0EE;
  --bg-card:       #FFFFFF;
  --bg-input:      #EEEEEC;

  --text-primary:  #121212;
  --text-secondary:#5A5A60;
  --text-muted:    #9A9AA0;
  --text-invert:   #FFFFFF;

  --border:        #E0E0DC;
  --border-strong: #CCCCCA;

  --shadow-sm:     0 1px 4px rgba(0,0,0,0.06);
  --shadow-md:     0 4px 20px rgba(0,0,0,0.09);
  --shadow-lg:     0 12px 48px rgba(0,0,0,0.13);

  --header-bg:     rgba(248,248,246,0.94);
  --header-border: rgba(0,0,0,0.07);

  --btn-primary-text: #FFFFFF;
  --accent:        #B8952F;
  --accent-hover:  #A07C20;
  --accent-light:  rgba(184, 149, 47, 0.1);
  --accent-rgb:    184, 149, 47;

  --btn-ghost-border: var(--border-strong);
  --btn-ghost-text:   var(--text-primary);
}