/* ============================================================================
   manualsarea.com — раздел Error Codes / Troubleshooting
   Стили для ec-* классов внутри тела статьи (Content Hub).
   Цвета берутся из переменных темы, если они есть; иначе — нейтральные фолбэки.
   Ничего, кроме .ec-*, не трогаем — базовая типографика темы остаётся как есть.
   ============================================================================ */

.ec-answer,
.ec-causes,
.ec-hub,
.ec-steps,
.ec-related,
.ec-source,
.ec-updated,
.ec-hub-note {
  --ec-border: var(--border-color, var(--stroke, #e2e3e6));
  --ec-soft: var(--bg-subtle, #f6f6f7);
  --ec-ink: var(--text-color, var(--black, #1a1a1a));
  --ec-muted: var(--text-muted, var(--text, #5f6368));
}

/* --- дата обновления под H1 -------------------------------------------- */
.ec-updated {
  font-size: 0.8125rem;
  color: var(--ec-muted);
  margin: -0.25rem 0 1.25rem;
}

/* --- прямой ответ: лид, первый экран ------------------------------------
   Без карточки: крупнее текст + линия снизу.                             */
.ec-answer {
  font-size: 1.25rem;
  line-height: 1.65;
  color: var(--ec-ink);
  margin: 1.25rem 0 2.5rem;
  padding: 0.75rem 0 1.75rem;
  border-bottom: 1px solid var(--ec-border);
}
.ec-answer > p { margin: 0; }
.ec-answer > p + p { margin-top: 0.85rem; }

/* тема сбрасывает strong через * { font: inherit }, восстанавливаем вес */
.ec-answer strong,
.ec-causes strong,
.ec-hub strong,
.ec-steps strong,
.ec-related strong,
.ec-source strong,
.ec-hub-note strong,
.ec-updated strong {
  font-weight: 700;
}

/* --- таблицы: причины (страница кода) и список кодов (хаб бренда) ------- */
/* Обёртка даёт горизонтальный скролл на мобиле вместо разъезда вёрстки.   */
.ec-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin: 0 0 1.75rem;
}

.ec-causes,
.ec-hub {
  border-collapse: collapse;
  width: 100%;
  min-width: 32rem;
  font-size: 0.9375rem;
  line-height: 1.5;
}

.ec-causes th,
.ec-hub th {
  text-align: left;
  font-weight: 600;
  background: var(--ec-soft);
  white-space: nowrap;
}

.ec-causes th, .ec-causes td,
.ec-hub th, .ec-hub td {
  border: 1px solid var(--ec-border);
  padding: 0.625rem 0.75rem;
  vertical-align: top;
}

/* колонка кода на хабе — моноширинно, как на дисплее машины */
.ec-hub td:first-child {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-weight: 600;
  white-space: nowrap;
}

.ec-hub-note {
  font-size: 0.9375rem;
  color: var(--ec-muted);
  margin: -0.75rem 0 1.75rem;
}

/* --- пошаговый фикс ----------------------------------------------------- */
.ec-steps {
  list-style: none;
  counter-reset: ec-step;
  padding: 0;
  margin: 0 0 1.75rem;
}

.ec-steps > li {
  counter-increment: ec-step;
  position: relative;
  padding-left: 2.875rem;
  margin-bottom: 1.5rem;
}
.ec-steps > li:last-child { margin-bottom: 0; }

.ec-steps > li::before {
  content: counter(ec-step);
  position: absolute;
  left: 0;
  top: 0;
  width: 1.875rem;
  height: 1.875rem;
  border-radius: 50%;
  background: var(--ec-ink);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.875rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

.ec-step-title {
  font-weight: 600;
  margin: 0.25rem 0 0.375rem;
  line-height: 1.4;
}
.ec-steps p:last-child { margin-bottom: 0; }

/* --- блок связанных кодов ----------------------------------------------- */
.ec-related {
  border-top: 1px solid var(--ec-border);
  margin: 2rem 0;
  padding-top: 1rem;
}

.ec-related-title {
  font-weight: 600;
  font-size: 0.9375rem;
  margin: 0 0 0.75rem;
}

.ec-related ul {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 0;
  margin: 0;
}

/* сброс .text-page ul li::before (точки темы) */
.ec-related ul li {
  margin: 0;
  padding-left: 0;
}

.ec-related ul li::before {
  content: none;
  display: none;
}

.ec-related a {
  display: inline-block;
  border: 1px solid var(--ec-border);
  border-radius: 999px;
  padding: 0.3125rem 0.75rem;
  font-size: 0.875rem;
  text-decoration: none;
  color: var(--ec-ink);
  transition: background 0.15s ease;
}
.ec-related a:hover { background: var(--ec-soft); }

/* --- источник и дата: E-E-A-T подпись ----------------------------------- */
.ec-source {
  border-top: 1px solid var(--ec-border);
  margin-top: 2.25rem;
  padding-top: 0.875rem;
  font-size: 0.875rem;
  color: var(--ec-muted);
}

/* --- рекламные слоты ----------------------------------------------------- */
/* Пустой слот не занимает места: до подключения AdSense страница выглядит
   ровно так же, как без него.                                              */
.ec-ad { margin: 1.75rem 0; }
.ec-ad:empty { display: none; }
.ec-ad:has(> ins.adsbygoogle[data-ad-status="unfilled"]) { display: none; }

/* --- мобильные ----------------------------------------------------------- */
@media (max-width: 480px) {
  .ec-answer { font-size: 1.125rem; margin: 1rem 0 2rem; padding: 0.5rem 0 1.5rem; }
  .ec-steps > li { padding-left: 2.5rem; }
  .ec-steps > li::before { width: 1.625rem; height: 1.625rem; font-size: 0.8125rem; }
}

/* --- печать: читатель у машины с распечаткой ---------------------------- */
@media print {
  .ec-ad { display: none; }
  .ec-table-wrap { overflow: visible; }
}
