/* sku-link.css — SKU/артикул как ссылка + переключатель «Режим ссылки» (#32).
 * ====================================================================
 *  Совместно с sku-link.js (window.MA_SkuLink). Только токены theme.css
 *  (0 хардкод-цветов, обе темы через токены). 0 sticky.
 * ==================================================================== */

/* Контейнер ячейки: текст + значок в один ряд, обрезка длинного текста */
.ma-sku-cell {
  display: flex;
  align-items: center;
  gap: var(--space-1);
  overflow: hidden;
}
.ma-sku-cell__text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* === Режим ссылки ВКЛ: SKU-текст = синяя подчёркнутая ссылка + ↗ === */
.ma-sku-link {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  color: var(--accent);
  text-decoration: none;
  overflow: hidden;
}
.ma-sku-link__text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.ma-sku-link:hover .ma-sku-link__text { text-decoration-thickness: 2px; }
.ma-sku-link__icon {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  line-height: 0;
}
.ma-sku-link:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; border-radius: 2px; }

/* === Режим ссылки ВЫКЛ: обычный текст + отдельный ↗-значок === */
.ma-sku-ext {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  line-height: 0;
  color: var(--accent);
  text-decoration: none;
}
.ma-sku-ext:hover { opacity: 0.8; }
.ma-sku-ext:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; border-radius: 2px; }

/* === Переключатель «Режим ссылки» === */
.ma-skulink-toggle {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-size: 12px;
  color: var(--text);
  cursor: pointer;
  user-select: none;
}
.ma-skulink-toggle__cb {
  cursor: pointer;
  accent-color: var(--accent);
}
.ma-skulink-toggle__cb:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }