/* ППЧ — Color tokens
   Source: «ППЧ дизайн система.fig» → Style-Guide / Colors
   Brand character: calm, structured, supportive, rational.
   The teal-green primary gives depth and stability; turquoise is the
   single accent and must stay pointed — never let it dominate. */

:root {
  /* ---- Base palette (raw brand colors) ---- */
  --ppch-ivory:           #FCFDFA; /* основной светлый — фон, воздух, безопасность */
  --ppch-deep:            #2A5459; /* глубокий сине-зелёный — структурный, опорный */
  --ppch-deep-press:      #1F4044; /* darker deep, for pressed/structural depth */
  --ppch-haze:            #D8EBEB; /* серо-голубой — смягчает контраст, вторичный фон */
  --ppch-haze-soft:       #EDF4F4; /* lighter haze, hairline surfaces */
  --ppch-turquoise:       #2F9E9E; /* живой бирюзовый — акцент, CTA, ссылки */
  --ppch-turquoise-press: #248080; /* pressed accent */
  --ppch-turquoise-soft:  #E4F2F1; /* accent tint surface */
  --ppch-teal-light:      #67BCB5; /* light turquoise — secondary accent, charts */
  --ppch-graphite:        #2F2F2D; /* графит — тёмный текст / тёмная поверхность */
  --ppch-tangerine:       #DD8E6E; /* tangerine — тёплый вторичный акцент */
  --ppch-moss:            #6EB370; /* moss — success / живой вторичный */

  /* ---- Neutral ramp (warm-cool grey, leans to ink) ---- */
  --ppch-ink:             #1B2B2D; /* near-black with teal undertone */
  --ppch-grey-700:        #3F4B4D;
  --ppch-grey-600:        #666666;
  --ppch-grey-500:        #999999;
  --ppch-grey-400:        #C4CFCF;
  --ppch-grey-300:        #E0E8E8;
  --ppch-grey-200:        #EDF1F0;
  --ppch-white:           #FFFFFF;

  /* ---- Semantic: surfaces ---- */
  --surface-page:         var(--ppch-ivory);   /* default page background */
  --surface-card:         var(--ppch-white);   /* cards, sheets, raised content */
  --surface-sunken:       var(--ppch-haze-soft);/* sunken / grouped sections */
  --surface-secondary:    var(--ppch-haze);     /* large secondary blocks */
  --surface-structural:   var(--ppch-deep);     /* nav, footers, hero anchors */
  --surface-inverse:      var(--ppch-graphite); /* dark mode-ish blocks */
  --surface-accent-soft:  var(--ppch-turquoise-soft);

  /* ---- Semantic: text ---- */
  --text-primary:         var(--ppch-ink);      /* основной текст на светлом */
  --text-secondary:       var(--ppch-grey-600); /* подписи, вторичный */
  --text-tertiary:        var(--ppch-grey-500); /* подсказки, метки */
  --text-invert:          var(--ppch-white);    /* текст на тёмном/structural */
  --text-invert-soft:     rgba(255,255,255,0.72);
  --text-accent:          var(--ppch-turquoise);/* ссылки, акценты */
  --text-on-structural:   #CFE3E2;              /* muted text on deep teal */

  /* ---- Semantic: accent / interaction ---- */
  --accent:               var(--ppch-turquoise);
  --accent-press:         var(--ppch-turquoise-press);
  --accent-hover:         #36ABAB;
  --accent-contrast:      var(--ppch-white);
  --focus-ring:           rgba(47,158,158,0.40);

  /* ---- Semantic: borders / dividers ---- */
  --border-subtle:        var(--ppch-grey-300);
  --border-default:       var(--ppch-grey-400);
  --border-strong:        var(--ppch-deep);
  --border-on-structural: rgba(255,255,255,0.16);

  /* ---- Status ---- */
  --status-success:       var(--ppch-moss);
  --status-success-soft:  #E7F3E7;
  --status-warning:       var(--ppch-tangerine);
  --status-warning-soft:  #FBEDE5;
  --status-error:         #D7584B;
  --status-error-soft:    #FBE9E7;
  --status-info:          var(--ppch-teal-light);
  --status-info-soft:     var(--ppch-turquoise-soft);
}
