/*
  Темы направлений. Каждая тема — только набор токенов.
  Класс темы можно повесить на <body> (через body_class() в WordPress)
  или на отдельный блок: так на главной демонстрация перекрашивается
  под выбранный пример.

  Логика палитры: бренд опирается на сигнальные цвета охраны труда
  (жёлтый, синий, зелёный, красный). Каждое направление берёт свой.
*/

.theme-brand,
:root {
  --bg: #F7F7F2;
  --surface: #FFFFFF;
  --ink: #15151A;
  --muted: #55555D;
  --line: #DEDDD3;
  --primary: #15151A;
  --on-primary: #FFFFFF;
  --accent: #FFD21F;
  --on-accent: #15151A;
  --deep: #15151A;
  --on-deep: #F7F7F2;
  --deep-muted: #C9C8C0;
  --deep-line: rgba(255, 255, 255, 0.16);
  --soft: #EFEEE6;
  --focus: #1B3BD1;
  --focus-on-deep: #FFD21F;

  --font-display: var(--font-brand);
  --font-accent: var(--font-brand);
  --display-weight: 800;
  --display-tracking: -0.035em;
  --display-leading: 0.98;
  --accent-style: normal;

  --s-1: #FFD21F;
  --s-2: #1B3BD1;
  --s-3: #1E7A4C;
  --s-4: #D93A2B;
  --s-5: #15151A;
  --s-6: #8A8980;
  --s-7: #FF9F1C;
  --s-8: #6B6A72;
}

.theme-beauty {
  --bg: #FFF4EF;
  --surface: #FFFFFF;
  --ink: #2A0B1A;
  --muted: #6D4153;
  --line: #EFD3CA;
  --primary: #A8124E;
  --on-primary: #FFFFFF;
  --accent: #FF6A55;
  --on-accent: #2A0B1A;
  --deep: #4A0725;
  --on-deep: #FFF4EF;
  --deep-muted: #F2BFCB;
  --deep-line: rgba(255, 220, 228, 0.2);
  --soft: #FFDFD5;
  --focus: #2A0B1A;
  --focus-on-deep: #FFB3A6;

  --font-display: var(--font-body);
  --font-accent: "Playfair Display", Georgia, "Times New Roman", serif;
  --display-weight: 760;
  --display-tracking: -0.045em;
  --display-leading: 0.96;
  --accent-style: italic;

  --s-1: #A8124E;
  --s-2: #FF6A55;
  --s-3: #6A1E4A;
  --s-4: #E8A33D;
  --s-5: #C95B8A;
  --s-6: #2A0B1A;
  --s-7: #F29E8E;
  --s-8: #8C5A6B;
}

.theme-cosmetology {
  --bg: #F3F7FF;
  --surface: #FFFFFF;
  --ink: #0A1442;
  --muted: #434E78;
  --line: #D3DFF6;
  --primary: #1D3FD6;
  --on-primary: #FFFFFF;
  --accent: #A9DCFF;
  --on-accent: #0A1442;
  --deep: #0B1A63;
  --on-deep: #FFFFFF;
  --deep-muted: #BFD5FF;
  --deep-line: rgba(169, 220, 255, 0.22);
  --soft: #DCEAFF;
  --focus: #0A1442;
  --focus-on-deep: #A9DCFF;

  --font-display: var(--font-body);
  --font-accent: var(--font-body);
  --display-weight: 300;
  --display-tracking: -0.04em;
  --display-leading: 1;
  --accent-style: normal;

  --s-1: #1D3FD6;
  --s-2: #37A0F0;
  --s-3: #0B1A63;
  --s-4: #7B8FE8;
  --s-5: #00A3A3;
  --s-6: #5C6BA8;
  --s-7: #9BB8FF;
  --s-8: #2A2F4F;
}

.theme-vet {
  --bg: #F3F5EA;
  --surface: #FFFFFF;
  --ink: #0B241A;
  --muted: #45594D;
  --line: #D6DEC7;
  --primary: #0F4A35;
  --on-primary: #FFFFFF;
  --accent: #C6F23C;
  --on-accent: #0B241A;
  --deep: #0C3A2A;
  --on-deep: #F3F5EA;
  --deep-muted: #CFE3C0;
  --deep-line: rgba(198, 242, 60, 0.22);
  --soft: #E5F4BA;
  --sand: #EFE4CC;
  --focus: #0B241A;
  --focus-on-deep: #C6F23C;

  --font-display: var(--font-brand);
  --font-accent: var(--font-brand);
  --display-weight: 700;
  --display-tracking: -0.03em;
  --display-leading: 1.02;
  --accent-style: normal;

  --s-1: #0F4A35;
  --s-2: #7FB800;
  --s-3: #D98B2B;
  --s-4: #2E7D5B;
  --s-5: #B5452F;
  --s-6: #3C6E91;
  --s-7: #6F8A3A;
  --s-8: #0B241A;
}

/* Резерв под будущее направление: токены уже есть, страницы пока нет. */
.theme-auto {
  --bg: #F2F2F0;
  --ink: #17181B;
  --primary: #D93A2B;
  --accent: #FF8A1C;
  --deep: #1E2024;
}