/* ============================================================
   Datamoll · Product Content Tabs (13-content-tabs.css) — REDESIGN
   Блок: Описание / Правила / Возврат / FAQ
   Разметка: views/client/product/content-tabs.php
   --------------------------------------------------------------
   Что изменилось vs старой версии:
   1) Чек-лист: голая зелёная «птичка» → ВАРИАНТ D · минимал-рейл
      (маркер-точка с лаймовым кольцом, компактный ритм, без жирных меток).
   2) Шапка табов: добавлен «бегущий» индикатор .pct-runner (едет под
      активный таб). Статичный border-bottom больше не используется.
   3) Переходы: панель — fade+slide, пункты появляются каскадом (stagger),
      всё под @media (prefers-reduced-motion: no-preference).
   Тёмная тема сохранена нашим блоком в конце файла (редизайн её не трогает).
   ============================================================ */

.storefront-autoreg .product-content-tabs {
    background: #fff;
    padding: 6px 0 0;
}

/* ── лента табов (шапка остаётся) ── */
.storefront-autoreg .pct-tablist {
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
    padding: 14px 22px 0;
    position: relative;            /* якорь для бегущего индикатора */
}
.storefront-autoreg .pct-tab {
    appearance: none;
    border: 0;
    background: transparent;
    cursor: pointer;
    font-family: inherit;
    font-size: 14px;
    font-weight: 700;
    color: #64748b;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 16px 13px;
    border-radius: 11px 11px 0 0;
    position: relative;
    transition: color .18s, background-color .18s;
}
.storefront-autoreg .pct-tab i { font-size: 13px; opacity: .85; transition: color .18s, opacity .18s; }
.storefront-autoreg .pct-tab:hover { color: #1e293b; background: #f4f6f9; }
.storefront-autoreg .pct-tab.is-active { color: #1e293b; }
.storefront-autoreg .pct-tab.is-active i { color: #16a34a; opacity: 1; }

/* бегущий индикатор (позиция/ширина задаётся из JS) */
.storefront-autoreg .pct-runner {
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 0;
    height: 3px;
    border-radius: 3px;
    background: linear-gradient(90deg, #16a34a, #8ff451);
    transition: left .34s cubic-bezier(.22,1,.36,1), width .34s cubic-bezier(.22,1,.36,1);
    pointer-events: none;
}
.storefront-autoreg .pct-runner.is-init { transition: none; }  /* без «прыжка» при первой раскладке */

.storefront-autoreg .pct-rule { height: 1px; background: #eef1f5; margin-top: -1px; }

/* ── панель ── */
.storefront-autoreg .pct-panel { padding: 22px; }
.storefront-autoreg .pct-panel[hidden] { display: none; }

@media (prefers-reduced-motion: no-preference) {
    .storefront-autoreg .pct-panel.is-active { animation: pctPaneIn .42s cubic-bezier(.22,1,.36,1) both; }
    @keyframes pctPaneIn {
        from { opacity: 0; transform: translateY(8px); }
        to   { opacity: 1; transform: none; }
    }
    /* каскад пунктов — база видима, эффект только как «плюс» */
    .storefront-autoreg .pct-panel.is-active .product-info-checklist li { animation: pctItemIn .5s cubic-bezier(.22,1,.36,1) both; }
    @keyframes pctItemIn {
        from { opacity: 0; transform: translateY(10px); }
        to   { opacity: 1; transform: none; }
    }
    .storefront-autoreg .product-info-checklist li:nth-child(1){animation-delay:.04s}
    .storefront-autoreg .product-info-checklist li:nth-child(2){animation-delay:.09s}
    .storefront-autoreg .product-info-checklist li:nth-child(3){animation-delay:.14s}
    .storefront-autoreg .product-info-checklist li:nth-child(4){animation-delay:.19s}
    .storefront-autoreg .product-info-checklist li:nth-child(5){animation-delay:.24s}
    .storefront-autoreg .product-info-checklist li:nth-child(6){animation-delay:.29s}
    .storefront-autoreg .product-info-checklist li:nth-child(7){animation-delay:.34s}
    .storefront-autoreg .product-info-checklist li:nth-child(8){animation-delay:.39s}
    .storefront-autoreg .product-info-checklist li:nth-child(n+9){animation-delay:.42s}
}

.storefront-autoreg .pct-content {
    color: #334155;
    font-size: 14.5px;
    line-height: 1.7;
}
.storefront-autoreg .pct-content > *:first-child { margin-top: 0; }
.storefront-autoreg .pct-content > *:last-child { margin-bottom: 0; }
.storefront-autoreg .pct-content p { margin: 0 0 12px; }
.storefront-autoreg .pct-content strong, .storefront-autoreg .pct-content b { font-weight: 500; color: #334155; }
.storefront-autoreg .pct-content a { color: #16a34a; font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }
.storefront-autoreg .pct-content h3, .storefront-autoreg .pct-content h4 { font-size: 16px; font-weight: 800; margin: 18px 0 10px; color: #1e293b; }
/* «Формат: …» — value оборачивается в <span class="product-format-value">
   (см. datamoll_product_content_tab_render_line_html). Зелёный код-чип. */
.storefront-autoreg .product-format-value {
    display: inline;
    font-family: "SF Mono", ui-monospace, "Cascadia Code", Menlo, Consolas, monospace;
    font-size: 13px;
    font-weight: 700;
    color: #16a34a;
    background: #eafcdd;
    border: 1px solid rgba(22, 163, 74, .22);
    border-radius: 7px;
    padding: 3px 9px;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
}

/* ── чек-лист: ВАРИАНТ D · минимал-рейл (маркер-точка + хейрлайны) ── */
.storefront-autoreg .pct-content ul,
.storefront-autoreg .product-info-checklist {
    list-style: none;
    display: grid;
    gap: 6px;
    margin: 0;
    padding: 0;
}
.storefront-autoreg .pct-content li,
.storefront-autoreg .product-info-checklist li {
    position: relative;
    padding: 5px 0 5px 26px;
    font-weight: 500;
    color: #334155;
    line-height: 1.5;
}
/* маркер-точка с лаймовым кольцом */
.storefront-autoreg .pct-content li::before,
.storefront-autoreg .product-info-checklist li::before {
    content: "";
    position: absolute;
    left: 1px;
    top: 12px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #16a34a;
    box-shadow: 0 0 0 4px #eafcdd;
}
.storefront-autoreg .pct-content li::after,
.storefront-autoreg .product-info-checklist li::after { content: none; }

/* нумерованные списки — без маркеров-точек */
.storefront-autoreg .pct-content ol {
    display: block;
    margin: 0 0 12px 20px;
    padding-left: 18px;
    list-style: decimal;
}
.storefront-autoreg .pct-content ol li { padding: 0 0 6px; border-bottom: 0; color: #334155; }
.storefront-autoreg .pct-content ol li:last-child { padding-bottom: 0; }
.storefront-autoreg .pct-content ol li::before,
.storefront-autoreg .pct-content ol li::after { content: none; }

/* инлайн-код формата выдачи (login:password:...) */
.storefront-autoreg .pct-content code {
    font-family: "SF Mono", ui-monospace, "Cascadia Code", Menlo, Consolas, monospace;
    font-size: 13px;
    font-weight: 700;
    color: #16a34a;
    background: #eafcdd;
    padding: 3px 9px;
    border-radius: 7px;
    border: 1px solid rgba(22, 163, 74, .22);
    white-space: nowrap;
}
.storefront-autoreg .pct-content pre {
    background: #f4f6f9;
    border: 1px solid #e6eaf0;
    border-radius: 12px;
    padding: 14px 16px;
    overflow-x: auto;
    margin: 0 0 12px;
}
.storefront-autoreg .pct-content pre code { background: none; border: 0; padding: 0; white-space: pre; color: #1e293b; }

/* FAQ как пары вопрос/ответ */
.storefront-autoreg .pct-panel[data-panel="faq"] .pct-content p strong:first-child {
    display: inline-block;
    color: #0f172a;
}

/* mobile */
@media (max-width: 680px) {
    .storefront-autoreg .pct-tablist { padding: 12px 14px 0; gap: 2px; }
    .storefront-autoreg .pct-tab { padding: 10px 12px 12px; font-size: 13px; }
    .storefront-autoreg .pct-panel { padding: 18px 16px; }
    .storefront-autoreg .pct-content li,
    .storefront-autoreg .product-info-checklist li { padding-left: 24px; }
}

/* ── тёмная тема (редизайн её не трогает — сохраняем наши правила, + маркер-точка) ── */
[data-theme="dark"] .storefront-autoreg .product-content-tabs,
.storefront-autoreg[data-theme="dark"] .product-content-tabs { background: #282828; box-shadow: 0 12px 28px rgba(0,0,0,.3); }
[data-theme="dark"] .storefront-autoreg .pct-tab { color: #afafaf; }
[data-theme="dark"] .storefront-autoreg .pct-tab:hover { background: #333; color: #fff; }
[data-theme="dark"] .storefront-autoreg .pct-tab.is-active { color: #fff; }
[data-theme="dark"] .storefront-autoreg .pct-tab.is-active i { color: #8ff451; }
[data-theme="dark"] .storefront-autoreg .pct-rule { background: #3a3a3a; }
[data-theme="dark"] .storefront-autoreg .pct-content { color: #e8e8e8; }
[data-theme="dark"] .storefront-autoreg .pct-content li,
[data-theme="dark"] .storefront-autoreg .product-info-checklist li { color: #cfcfcf; }
[data-theme="dark"] .storefront-autoreg .pct-content li::before,
[data-theme="dark"] .storefront-autoreg .product-info-checklist li::before { background: #8ff451; box-shadow: 0 0 0 4px rgba(143,244,81,.16); }
[data-theme="dark"] .storefront-autoreg .pct-content code { background: rgba(143,244,81,.14); color: #9ff35e; }
[data-theme="dark"] .storefront-autoreg .product-format-value { background: rgba(143,244,81,.14); color: #9ff35e; border-color: rgba(143,244,81,.25); }
[data-theme="dark"] .storefront-autoreg .pct-content pre { background: #1f1f1f; border-color: #3a3a3a; }
