/* ============================================================
   Marketplace-Assist — Help Section («Про раздел») styles
   Подключать ПОСЛЕ theme.css.
   Все цвета/размеры — через CSS-переменные из theme.css.
   Никаких hardcoded hex/rgba (failure-taxonomy 1.x).
   ============================================================ */

.ma-help {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  margin: var(--space-4) 0;   /* симметричные отступы сверху/снизу (равное расстояние вокруг блока) */
  overflow: hidden;
}

/* Заголовок-кнопка (нативный <summary>) */
.ma-help-summary {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-4);
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
  list-style: none;             /* убрать дефолтный маркер */
  user-select: none;
}
/* Скрыть нативный треугольник <summary> в WebKit/Blink */
.ma-help-summary::-webkit-details-marker { display: none; }

.ma-help-summary:hover { background: var(--accent-light); }

.ma-help-icon { flex-shrink: 0; font-size: 14px; }
.ma-help-title { flex: 1; }

/* Собственный шеврон (CSS-стрелка), поворачивается при раскрытии */
.ma-help-chevron {
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  border-right: 2px solid var(--text2);
  border-bottom: 2px solid var(--text2);
  transform: rotate(-45deg);        /* «вправо» — свёрнуто */
  transition: transform .18s ease;
  margin-right: 2px;
}
.ma-help[open] .ma-help-chevron {
  transform: rotate(45deg);         /* «вниз» — раскрыто */
}

/* Тело */
.ma-help-body {
  padding: 0 var(--space-4) var(--space-4);
  font-size: 13px;
  line-height: 1.6;
  color: var(--text2);
  border-top: 1px solid var(--border);
  padding-top: var(--space-3);
}
.ma-help-body p { margin: 0 0 var(--space-2); }
.ma-help-body p:last-child { margin-bottom: 0; }
.ma-help-body a { color: var(--accent); }
.ma-help-body strong { color: var(--text); }
.ma-help-body ul, .ma-help-body ol { margin: 0 0 var(--space-2) var(--space-5); }
