/* ============================================================
   DENVELKOFF STUDIO — ДИЗАЙН ТОКЕНИ
   Фаза 5.0 от PLAN.md. Източник: design-reference/README.md.

   ЕДИНСТВЕНОТО място в темата, където има hex стойност на цвят.
   Всеки друг CSS/PHP файл ползва var(--dv-*). Нов цвят се добавя
   ТУК, не на място в компонента.

   Файлът се зарежда пръв (dv-tokens), преди style.css, и в
   wp-admin - затова и админските цветове са тук.
   ============================================================ */

:root{

  /* --- Бранд ------------------------------------------------ */
  --dv-dark:#151A1A;          /* фон и текст, near-black */
  --dv-teal:#006F75;          /* основен тийл */
  --dv-accent:#0CBABA;        /* акцентен тийл */
  --dv-tint:#EAFCFC;          /* светъл тийл фон */
  --dv-surface:#EFF3F6;       /* светъл фон на секция */
  --dv-white:#FFFFFF;
  --dv-black:#000000;

  /* --- Тъмни панели (README: #1b2121 / #22292a / #0f1414) ---- */
  --dv-dark-950:#0b0e0e;
  --dv-dark-900:#0f1414;
  --dv-dark-880:#131717;
  --dv-dark-860:#161d1d;
  --dv-dark-850:#171d1d;
  --dv-dark-840:#1b2020;
  --dv-dark-800:#1b2121;
  --dv-dark-780:#1d2424;
  --dv-dark-760:#1e2a2a;
  --dv-dark-750:#1e2b2b;
  --dv-dark-700:#22292a;
  --dv-dark-680:#243030;
  --dv-dark-660:#252c2c;
  --dv-dark-650:#262d2d;
  --dv-dark-620:#2a3333;
  --dv-dark-600:#2a3a3a;
  --dv-dark-580:#2c3434;
  --dv-dark-520:#38403f;
  --dv-dark-500:#3a4343;
  --dv-dark-490:#3b4444;
  --dv-dark-470:#3f4749;

  /* --- Тийл скала (мокъпи, барови графики) ------------------- */
  --dv-teal-950:#1b3b3d;
  --dv-teal-850:#0a5f63;
  --dv-teal-800:#0d5f62;
  --dv-teal-700:#0a6d70;
  --dv-teal-600:#0a7f83;
  --dv-tint-300:#cdeceb;
  --dv-tint-200:#d3efef;
  --dv-tint-050:#f6fdfd;

  /* --- Текст ------------------------------------------------ */
  --dv-body:#666666;          /* основен текст */
  --dv-body-strong:#2f3436;   /* параграфи в светли секции */
  --dv-body-soft:#5a6266;
  --dv-on-dark:#cfd4d6;       /* основен текст върху тъмно */
  --dv-on-dark-2:#aab2b4;     /* второстепенен */
  --dv-on-dark-meta:#8a9296;  /* мета */
  --dv-mute-400:#a8b0b3;
  --dv-mute-500:#9aa2a6;
  --dv-mute-510:#9aa3a6;
  --dv-mute-600:#7c8686;
  --dv-mute-650:#6f787c;
  --dv-mute-660:#6f7878;
  --dv-mute-700:#6a7276;

  /* --- Линии и светли повърхности --------------------------- */
  --dv-line:rgba(21,26,26,.13);
  --dv-line-dark:rgba(255,255,255,.14);
  --dv-line-130:#e7edf0;
  --dv-line-140:#e5ebef;
  --dv-line-150:#e2e8ea;
  --dv-line-200:#dbe6ea;
  --dv-line-250:#dde4e8;
  --dv-line-350:#c3ced3;
  --dv-ph-grey:#dfe5e9;       /* плейсхолдър блок */

  /* --- Чернова и състояния ---------------------------------- */
  --dv-draft:#8a9296;
  --dv-draft-2:#7b8487;
  --dv-warn:#F5A623;          /* лента "чернова" + звезди */
  --dv-warn-650:#e6a338;
  --dv-warn-600:#e0a83c;
  --dv-star:#F5A623;
  --dv-star-alt:#f5b800;
  --dv-ok:#4CAF6D;
  --dv-danger:#e05c52;

  /* --- Проектни акценти (README) ---------------------------- */
  --dv-pj-parket:#C08A3E;
  --dv-pj-valyon:#8A5FE0;
  --dv-pj-cyber:#3B6FE0;
  --dv-pj-roof:#E08A3C;

  /* --- Шрифтове --------------------------------------------- */
  --dv-font-head:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;
  --dv-font-body:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;
  --dv-font-mono:'IBM Plex Mono',ui-monospace,'SFMono-Regular',monospace;
  --dv-track-head:-.025em;    /* letter-spacing на заглавия */
  --dv-track-head-loose:-.02em;
  --dv-track-mono:.03em;
  --dv-track-mono-wide:.12em;

  /* --- Отстояния -------------------------------------------- */
  --dv-shell:1240px;                    /* container max-width */
  --dv-gutter:clamp(18px,4vw,32px);     /* странично на контейнера */
  /* Вертикално на секция. ВНИМАНИЕ: HTML експортът в design-reference
     рендира 88px при 1600px, README-то казва clamp(50px,7vw,84px) -
     тоест 84px. Разликата е 4px и е НАРОЧНА: README-то е
     спецификацията от същия експорт и печели. Не го "оправяй"
     обратно на 88px при следваща сверка с макета. */
  --dv-sec-y:clamp(50px,7vw,84px);
  --dv-sec-y-tight:clamp(44px,6vw,72px);/* по-плътни секции */
  --dv-gap:20px;                        /* гридове 16-24px */
  --dv-gap-sm:16px;
  --dv-gap-lg:24px;
  --dv-hit:44px;                        /* мин. hit target мобилно */
  /* Височина на sticky хедъра. Ползва се от .m-nav, за да не излиза
     отвореното мобилно меню под екрана. Стойността тук е фолбек за
     без-JS; app.js я замерва реално и я презаписва, защото лентата е
     различно висока над и под 480px (там CTA-то се крие). */
  --dv-head-h:82px;
  --dv-btn-h:52px;
  --dv-kpi-num:clamp(38px,4.4vw,58px);  /* числото в KPI лентата */

  /* --- Радиуси ---------------------------------------------- */
  --dv-r-btn:9px;
  --dv-r-field:10px;
  --dv-r-card-sm:12px;
  --dv-r-card:14px;
  --dv-r-block-sm:16px;
  --dv-r-block:18px;
  --dv-r-pill:20px;

  /* --- Сенки ------------------------------------------------ */
  --dv-sh-card:0 16px 34px -18px rgba(21,26,26,.28);
  --dv-sh-card-hover:0 22px 46px -24px rgba(21,26,26,.34);
  --dv-sh-mock:0 30px 60px -28px rgba(0,0,0,.9);

  /* --- Цветове на wp-admin ---------------------------------- */
  /* Не са част от дизайна на сайта - палитрата на WordPress е,
     за да не изглеждат нашите полета като чуждо тяло в админа. */
  --dv-wp-ink:#3c3c3c;
  --dv-wp-text:#50575e;
  --dv-wp-text-2:#646970;
  --dv-wp-mute:#8c8f94;
  --dv-wp-line:#ccd0d4;
  --dv-wp-line-2:#dcdcde;
  --dv-wp-line-3:#e6e7e8;
  --dv-wp-bg:#fbfbfc;
  --dv-wp-warn:#dba617;
  --dv-wp-warn-bg:#fff8e5;
  --dv-wp-danger:#b32d2e;

  /* --- Стари имена (не се ползват в нов код) ---------------- */
  /* style.css от Фаза 1-3 ги ползва на много места; сочат към
     токените горе, за да няма два източника на истина. */
  --primary:var(--dv-teal);
  --accent:var(--dv-accent);
  --tint:var(--dv-tint);
  --ink:var(--dv-dark);
  --body:var(--dv-body);
  --surface:var(--dv-surface);
  --white:var(--dv-white);
  --line:var(--dv-line);
  --line-dark:var(--dv-line-dark);
  --ph-grey:var(--dv-ph-grey);
  --shell:var(--dv-shell);
  --font-head:var(--dv-font-head);
  --font-body:var(--dv-font-body);
  --font-mono:var(--dv-font-mono);
}
