/*
 * CarHelpMate v7 — SOURCE-FIRST COMPONENT SYSTEM
 * ------------------------------------------------------------
 * БАЗОВЫЙ ФАЙЛ. Не используйте глобальные h1/p/svg/button правила.
 * Каждый визуальный блок настраивается в своём CSS-файле.
 *
 * ВАЖНО:
 * 1) Значения var(--chm-font-...) берутся из admin_forum_appearance.php.
 * 2) Чтобы зафиксировать размер только для конкретного блока, замените
 *    var(--chm-font-..., XXpx) на обычное значение, например 14px.
 * 3) SVG здесь намеренно не стилизуются глобально.
 */

.chm-component-v7 {
  --cmp-font-body: "Inter","Golos Text",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --cmp-font-heading: "Manrope","Inter","Golos Text",sans-serif;
  --cmp-font-display: "DM Serif Display",Georgia,serif;
  --cmp-font-mono: ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace;

  --cmp-text: var(--chm-text,#0f172a);
  --cmp-text-dim: var(--chm-text-dim,#475569);
  --cmp-text-faint: var(--chm-text-faint,#94a3b8);
  --cmp-border: var(--chm-border,#e2e8f0);
  --cmp-primary: var(--chm-primary,#2563eb);
  --cmp-card-bg: var(--chm-card-bg,#fff);

  font-family:var(--cmp-font-body);
  font-size:var(--chm-font-body,15px);
}

/* Generic text helpers only. Component files below own concrete blocks. */
.chm-component-v7 .forum-code,
.chm-component-v7 code,
.chm-component-v7 .v357-dtc { font-family:var(--cmp-font-mono); }

/* v7.2 — unified visual metrics shared by every component. */
.chm-component-v7{
  --chm-ui-page-max:1440px;
  --chm-ui-gutter:24px;
  --chm-ui-gutter-tablet:18px;
  --chm-ui-gutter-phone:10px;
  --chm-ui-radius-card:16px;
  --chm-ui-radius-control:11px;
  --chm-ui-btn-height:40px;
  --chm-ui-btn-compact-height:34px;
  --chm-ui-input-height:42px;
  --chm-ui-logo-size:38px;
  --chm-ui-logo-phone:34px;
  --chm-ui-shadow:0 8px 26px rgba(15,23,42,.045);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
.chm-component-v7 *,
.chm-component-v7 *::before,
.chm-component-v7 *::after{box-sizing:border-box}
.chm-component-v7 :where(main,section,article,aside,nav,header,footer,form,fieldset,div){min-width:0}
.chm-component-v7 :where(img,video,canvas,iframe){max-width:100%}