/*
 * Страница документации v2 (v2/widget-docs.php). Источник — design/pages/docs-visit-history.html (+ -mobile).
 * Разделы и оглавление строит wx_docs_render() (inc/v2-docs.php), поведение — docs.js.
 */

/* ===== Шапка ===== */
.v2 .wx-dhead{display:flex;flex-direction:column;gap:16px;padding:48px 0 40px;}
.v2 .wx-dhead__kick{display:flex;align-items:center;gap:16px;}
.v2 .wx-dhead__kick .wx-plate{width:56px;height:56px;}
.v2 .wx-dhead .wx-h1{color:var(--text-primary);}
.v2 .wx-dmeta{display:flex;gap:16px;flex-wrap:wrap;font-size:13px;color:var(--text-muted);}
.v2 .wx-dmeta span{display:inline-flex;align-items:center;gap:6px;}

/* ===== Колонки ===== */
.v2 .wx-dlayout{display:flex;gap:48px;align-items:flex-start;padding-bottom:80px;}
.v2 .wx-dside{position:sticky;top:96px;flex:0 0 280px;display:flex;flex-direction:column;gap:16px;max-height:calc(100vh - 112px);overflow:auto;scrollbar-width:thin;}
.v2 .wx-doc{flex:1 1 0;min-width:0;max-width:760px;display:flex;flex-direction:column;gap:56px;}

/* ===== Оглавление ===== */
.v2 .wx-toc{display:flex;flex-direction:column;gap:2px;padding:8px;border-radius:24px;
  background:var(--lg-sheen),var(--lg-fill);-webkit-backdrop-filter:var(--lg-blur);backdrop-filter:var(--lg-blur);box-shadow:var(--lg-edge),var(--lg-drop);}
.v2 .wx-toc__t{padding:10px 14px 6px;font-weight:600;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);}
.v2 .wx-toc__list{display:flex;flex-direction:column;gap:2px;margin:0;padding:0;list-style:none;}
.v2 .wx-toc__list li[hidden]{display:none;}
.v2 .wx-toc__a{display:flex;align-items:center;min-height:40px;padding:8px 14px;border-radius:var(--radius-sm);font-size:15px;line-height:1.35;color:var(--text-muted);
  transition:background .25s var(--ease-standard),color .25s var(--ease-standard),transform .25s var(--ease-standard);}
.v2 .wx-toc__a:hover{background:var(--bg-glass);color:var(--text-primary);transform:translateX(3px);}
.v2 .wx-toc__a--sub{padding-left:28px;font-size:14px;}
.v2 .wx-toc__a[aria-current="true"]{background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px var(--line-1);color:var(--text-primary);}
html[data-theme="light"] .v2 .wx-toc__a{color:#5b5568;}
html[data-theme="light"] .v2 .wx-toc__a:hover{color:#17141f;background:rgba(23,20,31,.04);}
html[data-theme="light"] .v2 .wx-toc__a[aria-current="true"]{color:#17141f;background:linear-gradient(160deg,#fff,rgba(255,255,255,.75));box-shadow:inset 0 1px 0 #fff,0 0 0 1px rgba(23,20,31,.08),0 8px 18px -10px rgba(60,30,90,.3);}
.v2 .wx-tocmore{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;min-height:40px;margin-top:6px;padding:8px 14px;border:0;border-radius:var(--radius-pill);
  background:linear-gradient(160deg,rgba(255,255,255,.12),rgba(255,255,255,.03));box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 0 0 1px rgba(255,255,255,.1);
  color:var(--lavender-1);font-family:var(--font-body);font-size:13px;cursor:pointer;transition:color .2s,background .2s;}
.v2 .wx-tocmore:hover{color:var(--text-primary);background:rgba(255,255,255,.12);}
.v2 .wx-tocmore svg{transition:transform .3s var(--ease-standard);}
.v2 .wx-tocmore[aria-expanded="true"] svg{transform:rotate(180deg);}
html[data-theme="light"] .v2 .wx-tocmore{color:#3a3545;background:linear-gradient(160deg,#fff,rgba(255,255,255,.7));box-shadow:inset 0 1px 0 #fff,0 0 0 1px rgba(23,20,31,.1);}

/* ===== Разделы ===== */
.v2 .wx-dsec{display:flex;flex-direction:column;gap:16px;scroll-margin-top:104px;}
.v2 .wx-dh{display:flex;align-items:flex-start;gap:12px;margin:0;font-weight:800;font-size:var(--fs-h2);line-height:1.25;color:var(--text-primary);}
.v2 .wx-dnum{display:flex;align-items:center;justify-content:center;flex:0 0 auto;min-width:34px;height:34px;margin-top:2px;padding:0 9px;border-radius:17px;
  background:var(--accent-gradient);color:var(--white);font-size:14px;font-weight:700;line-height:1;}
.v2 .wx-dnum--sub{background:rgba(255,255,255,.1);box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);}
html[data-theme="light"] .v2 .wx-dnum--sub{background:rgba(23,20,31,.06);color:#17141f;box-shadow:inset 0 0 0 1px rgba(23,20,31,.15);}
.v2 .wx-dnum--ico{padding:0;width:34px;}
.v2 .wx-dh3{margin:8px 0 0;font-weight:700;font-size:18px;color:var(--text-primary);}
/* подраздел 8.1 — мелкий заголовок с маленькой плашкой номера (макет docs-telegram.html, h3.hsub) */
.v2 .wx-dh3--num{display:flex;align-items:center;gap:12px;margin:12px 0 0;font-size:20px;line-height:1.3;scroll-margin-top:104px;}
.v2 .wx-dh3--num .wx-dnum{min-width:44px;width:auto;height:30px;margin-top:0;padding:0 10px;border-radius:15px;font-size:13px;}
.v2 .wx-dsec p{margin:0;font-size:var(--fs-body);line-height:1.7;color:var(--text-secondary);}
.v2 .wx-dsec :is(strong,b){color:var(--text-primary);}
.v2 .wx-dsec>:is(ul,ol){margin:0;display:flex;flex-direction:column;gap:8px;color:var(--text-secondary);font-size:var(--fs-body);line-height:1.6;}
.v2 .wx-dsec>ol{padding-left:24px;}
.v2 .wx-dsec>ol>li::marker{color:var(--orange-1);font-weight:700;}
.v2 .wx-dsec>ul{list-style:none;padding-left:0;}
.v2 .wx-dsec>ul>li{position:relative;padding-left:22px;}
.v2 .wx-dsec>ul>li::before{content:"";position:absolute;left:4px;top:.68em;width:7px;height:7px;border-radius:50%;background:var(--accent-gradient);box-shadow:0 0 0 3px rgba(233,107,59,.15);}
.v2 .wx-dsec li p{display:inline;color:inherit;}
.v2 .wx-dsec a:not([class]){color:var(--link-accent);text-decoration:underline;}
.v2 .wx-dsec .wp-block-image,.v2 .wx-dsec figure.wp-block-image{margin:4px 0 0;border-radius:20px;overflow:hidden;background:#fff;
  box-shadow:var(--lg-edge),0 30px 60px -24px rgba(0,0,0,.7);}
html[data-theme="light"] .v2 .wx-dsec .wp-block-image{box-shadow:0 0 0 1px rgba(23,20,31,.08),0 30px 60px -28px rgba(60,30,90,.35);}
.v2 .wx-dsec .wp-block-image :is(img,video){display:block;width:100%;height:auto;}
/* «Без растягивания» (стиль блока «Изображение», макет .dimg.sm): натуральная ширина, не шире колонки, белая подложка в обеих темах */
.v2 .wx-dsec .wp-block-image.is-style-wx-natural{align-self:flex-start;width:auto;max-width:100%;padding:14px 18px;border-radius:16px;background:#fff;}
.v2 .wx-dsec .wp-block-image.is-style-wx-natural img{max-width:100%;height:auto;} /* ширина — из атрибута width (v2-docs.php) */
/* узкий скриншот (wx-img-fit, макет: figure.dimg с max-width): натуральная ширина в обычной рамке */
.v2 .wx-dsec .wp-block-image.wx-img-fit{align-self:flex-start;width:auto;max-width:100%;}
.v2 .wx-dsec .wp-block-image.wx-img-fit img{max-width:100%;height:auto;}
/* «Код» в тексте документации — рамка, как .kbd в макете */
.v2 .wx-dsec code{display:inline-block;padding:1px 8px;border-radius:6px;box-shadow:inset 0 0 0 1px var(--lavender-3);font-family:inherit;font-size:.92em;color:var(--text-primary);white-space:nowrap;background:none;}
html[data-theme="light"] .v2 .wx-dsec code{color:#17141f;box-shadow:inset 0 0 0 1px rgba(23,20,31,.2);}
.v2 .wx-dsec .wp-block-image figcaption{margin:0;padding:10px 16px;font-size:13px;color:#56636d;background:#fff;}
/* Таблицы: скруглённый контейнер с рамкой, шапка на --bg-subtle, только горизонтальные разделители (сетку WordPress гасим) */
.v2 .wx-dsec figure.wp-block-table{margin:0;overflow-x:auto;border:1px solid var(--border-default);border-radius:var(--radius-lg);}
.v2 .wx-dsec table{width:100%;border:0;border-collapse:collapse;font-size:var(--fs-small);line-height:1.5;color:var(--text-secondary);}
.v2 .wx-dsec :is(thead,tbody,tfoot,tr,th,td){border:0;}
.v2 .wx-dsec :is(th,td){padding:14px 20px;text-align:left;vertical-align:top;}
.v2 .wx-dsec thead th{background:var(--bg-subtle);color:var(--text-primary);font-weight:700;border-bottom:1px solid var(--border-default);}
.v2 .wx-dsec tbody tr+tr td{border-top:1px solid var(--border-default);}
.v2 .wx-dsec td strong{color:var(--text-primary);}
/* до 640 px: строка — карточка, у значения подпись из заголовка столбца (data-label, v2-docs.php) */
@media (max-width:640px){
  .v2 .wx-dsec figure.wx-dtable{overflow:visible;border:0;border-radius:0;}
  .v2 .wx-dsec .wx-dtable :is(table,tbody,tr,td){display:block;width:100%;}
  .v2 .wx-dsec .wx-dtable thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
  .v2 .wx-dsec .wx-dtable tr{border:1px solid var(--border-default);border-radius:var(--radius-lg);padding:6px 0;}
  .v2 .wx-dsec .wx-dtable tr+tr{margin-top:12px;}
  .v2 .wx-dsec .wx-dtable tbody tr td{padding:8px 18px;border-top:0;}
  .v2 .wx-dsec .wx-dtable tbody tr td+td{border-top:1px solid var(--border-default);} /* разделители внутри каждой карточки */
  .v2 .wx-dsec .wx-dtable td[data-label]::before{content:attr(data-label);display:block;margin-bottom:2px;font-size:12px;font-weight:700;color:var(--text-muted);}
}

/* ===== Навигация внизу ===== */
.v2 .wx-pager{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;}
.v2 .wx-pager a{display:flex;flex-direction:column;gap:6px;padding:20px 24px;border-radius:22px;
  background:var(--lg-sheen),var(--lg-fill);-webkit-backdrop-filter:var(--lg-blur);backdrop-filter:var(--lg-blur);box-shadow:var(--lg-edge),var(--lg-drop);}
.v2 .wx-pager a:hover{background:var(--bg-glass);}
.v2 .wx-pager__next{text-align:right;grid-column:2;}
.v2 .wx-pager small{font-size:12px;color:var(--text-muted);}
.v2 .wx-pager b{font-weight:700;font-size:16px;color:var(--text-primary);}

@media (max-width:1023px){
  .v2 .wx-dlayout{flex-direction:column;gap:32px;}
  .v2 .wx-dside{position:static;flex:none;width:100%;max-height:none;overflow:visible;}
  .v2 .wx-doc{max-width:none;}
}
@media (max-width:767px){
  .v2 .wx-dhead{padding:24px 0 24px;}
  .v2 .wx-dhead .wx-lead{font-size:var(--fs-body);}
  .v2 .wx-dlayout{padding-bottom:48px;}
  .v2 .wx-doc{gap:40px;}
  .v2 .wx-dh{font-size:22px;}
  .v2 .wx-dnum{min-width:30px;height:30px;margin-top:0;font-size:13px;}
  .v2 .wx-dnum--ico{width:30px;}
  .v2 .wx-dsec p,.v2 .wx-dsec>:is(ul,ol){font-size:15px;}
  .v2 .wx-pager{grid-template-columns:minmax(0,1fr);}
  .v2 .wx-pager__next{grid-column:auto;}
}