/* =====================================================================
   «Раскрытие информации» (raskrytie.html) — стили только этой страницы
   Порядок: site.css → page-raskrytie.css → core/a11y.css. Цвета только var(--c-*), размеры в rem.
   Общие части — в site.css: чипы со счётчиком (.chip__count), ссылка на документ (.doc-link),
   крупная ссылка-контакт (.link-big), скрытие фильтра без JS.
   1. Раскладка: фильтр слева (закреплён на широком экране) + реестр разделов
   2. Фильтр-чипы
   3. Реестр разделов (.doc-list): номер, заголовок, статус, сведения, документы
   4. «Не нашли нужный документ?» (.notfound, .ways)
   5. Версия для слабовидящих, печать
   ===================================================================== */

/* ---------- 1. Раскладка ---------- */
.disclosure { padding-top: clamp(1.75rem, 1rem + 2.75vw, 3.75rem); }
.disclosure__grid { display: grid; gap: 1.25rem; }
.disclosure__side { display: grid; gap: 0.875rem; align-content: start; min-width: 0; }
@media (min-width: 64em) {
  html:not([data-a11y="on"]) .disclosure__grid {
    grid-template-columns: minmax(0, 15rem) minmax(0, 1fr); gap: 0 clamp(2.5rem, 1rem + 3.5vw, 5rem); align-items: start;
  }
  /* --sticky-top = scroll-padding-top: после прокрутки к списку фильтр и список стоят вровень */
  html:not([data-a11y="on"]) .disclosure__side { position: sticky; top: var(--sticky-top); }
}
@media (min-width: 75em) { html:not([data-a11y="on"]) .disclosure__grid { grid-template-columns: minmax(0, 16.5rem) minmax(0, 1fr); } }

/* ---------- 2. Фильтр-чипы ---------- */
/* На телефоне чипы чуть плотнее, промежуток между ними остаётся 8 px */
.disclosure__filter .chip { gap: 0.375rem; padding-inline: 0.875rem 0.75rem; }
/* На широком экране — вертикальный список фильтров; рамки и состояния — как у обычных чипов */
@media (min-width: 64em) {
  html:not([data-a11y="on"]) .disclosure__filter { flex-direction: column; flex-wrap: nowrap; gap: 0.5rem; }
  html:not([data-a11y="on"]) .disclosure__filter .chip { justify-content: flex-start; width: 100%; padding-inline: 1rem 0.75rem; border-radius: var(--radius-m); }
  html:not([data-a11y="on"]) .disclosure__filter .chip__count { margin-left: auto; margin-right: 0; }
}

/* ---------- 3. Реестр разделов ---------- */
.doc-list { border-top: 1px solid var(--c-line-strong); container-type: inline-size; }
.doc-item {
  position: relative; isolation: isolate; display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "num status" "head head" "meta meta" "docs docs";
  gap: 0.75rem 1rem; align-items: start;
  padding-block: 1.25rem 1.5rem; border-bottom: 1px solid var(--c-line);
}
/* Раздел без документов: без пустой строки сетки внизу */
.doc-item:not(:has(.doc-item__docs)) { grid-template-areas: "num status" "head head" "meta meta"; }
.doc-item__num {
  grid-area: num; align-self: center;
  font-family: var(--font-display); font-size: 0.9375rem; font-weight: 600; line-height: 1.2; letter-spacing: -0.01em;
  color: var(--c-ink-2); font-variant-numeric: tabular-nums;
}
.doc-item__head { grid-area: head; }
.doc-item__title { font-size: clamp(1.125rem, 1.05rem + 0.3vw, 1.25rem); line-height: 1.3; }
.doc-item__legal { margin-top: 0.3125rem; font-size: 0.875rem; color: var(--c-ink-2); }
.doc-item__status { grid-area: status; justify-self: end; display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 0.75rem; }
.doc-item__meta { grid-area: meta; display: grid; grid-template-columns: 6rem minmax(0, 1fr); gap: 0.3125rem 1rem; margin: 0; font-size: 0.9375rem; line-height: 1.45; }
.doc-item__meta div { display: contents; }
.doc-item__meta dt { color: var(--c-ink-2); }
.doc-item__meta dd { margin: 0; font-weight: 500; }
.doc-item__docs { grid-area: docs; display: grid; gap: 0.5rem; margin-top: 0.125rem; }
.doc-item__docs .doc-link { height: 100%; } /* карточки в ряду — одной высоты */

@container (min-width: 40rem) {
  .doc-item {
    grid-template-columns: 3rem minmax(0, 1fr) auto;
    grid-template-areas: "num head status" "num meta meta" "num docs docs";
    gap: 0.75rem 1.5rem; padding-block: 1.5rem 1.625rem;
  }
  .doc-item:not(:has(.doc-item__docs)) { grid-template-areas: "num head status" "num meta meta"; }
  .doc-item__num { align-self: start; font-size: 1.0625rem; line-height: 1.625rem; }
  .doc-item__status { padding-top: 0.0625rem; }
  .doc-item__meta { display: flex; flex-wrap: wrap; gap: 0.25rem 2rem; }
  .doc-item__meta div { display: flex; gap: 0 0.5rem; }
  .doc-item__docs { grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr)); gap: 0.625rem; margin-top: 0.25rem; }
}

/* Переход по ссылке на раздел (#poryadok-podklyucheniya и т. п.) — раздел подсвечен */
.doc-item::before {
  content: ""; position: absolute; inset: 0 -0.75rem; z-index: -1; border-radius: var(--radius-m);
  background: var(--c-accent-soft); opacity: 0; transition: opacity var(--t2o); pointer-events: none;
}
.doc-item:target::before { opacity: 1; }

/* Разделы после смены фильтра появляются мягко (page-raskrytie.js) */
.doc-item.is-appearing { animation: doc-in var(--dur-2) var(--ease-out) both; animation-delay: calc(var(--k, 0) * 30ms); }
@keyframes doc-in { from { opacity: 0; transform: translateY(0.375rem); } }

/* ---------- 4. «Не нашли нужный документ?» ---------- */
.notfound__grid { display: grid; gap: 1.5rem 3rem; align-items: center; }
.notfound__title { max-width: 13em; }
.ways { border-top: 1px solid var(--c-line-strong); }
.way { display: grid; align-items: center; gap: 0.125rem 2rem; padding-block: 1rem 1.125rem; border-bottom: 1px solid var(--c-line-strong); }
.way__label { display: flex; align-items: center; gap: 0.5rem; color: var(--c-ink-2); font-size: 0.9375rem; }
.way__label .icon { width: 1.125rem; height: 1.125rem; color: var(--c-accent); }
/* Ссылка — общий .link-big; e-mail может переноситься на узком экране, телефон — нет */
.way__link { width: fit-content; }
.way__link[href^="mailto:"] { white-space: normal; overflow-wrap: anywhere; }
.way__hint { margin-top: 0.125rem; font-size: 0.875rem; color: var(--c-ink-2); }
@media (min-width: 40em) {
  .way { grid-template-columns: minmax(0, 1fr) auto; }
  .way__link { justify-self: end; }
}
@media (min-width: 64em) { .notfound__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); } }

/* ---------- 5. Вкладка «Все документы» ---------- */
/* Вкладки: полоса переключателя над панелями */
.seg { margin-top: clamp(1.25rem, 0.9rem + 1.4vw, 2rem); }
.docs-all { padding-top: clamp(1.75rem, 1rem + 2.75vw, 3.75rem); }
.disclosure__lead { max-width: 60ch; color: var(--c-ink-2); line-height: 1.6; }

/* Поиск, группы и архив. Без JS эти органы управления ничего не делают — скрываем,
   список при этом показан целиком, включая архив. */
.doc-tools { display: grid; gap: 1rem; margin-top: 1.5rem; }
/* Поле ввода шире своей колонки на очень узких экранах (320 px) — разрешаем ему сжиматься */
.doc-tools > *, .doc-tools .search__field, .doc-tools .search__input { min-width: 0; }
.doc-tools .search__input { width: 100%; }
html:not(.js) .doc-tools { display: none; }
.doc-chips { margin-top: 0.25rem; }
/* Длинные названия групп переносятся: на экране 320 px «Тарифы и плата за подключение» в строку не влезает */
.doc-chips .chip { max-width: 100%; white-space: normal; text-align: left; }
.switch__hint { color: var(--c-ink-2); font-weight: 400; font-size: 0.875rem; }
@media (min-width: 64em) {
  .doc-tools { grid-template-columns: minmax(0, 22rem) minmax(0, 1fr); align-items: start; column-gap: 2rem; }
  .doc-tools .search { grid-row: 1 / span 2; }
  .doc-chips { margin-top: 0; }
}
.doc-count { margin-top: 1.5rem; }
.doc-rows { margin-top: 0.5rem; }
/* Группа документа — тише заголовка, но различима среди чисел строки сведений */
.doc-row__group { font-weight: 500; color: var(--c-ink); }
.doc-row__note, .doc-row__pub { color: var(--c-ink-2); }
/* Длинные сноски переносятся: в site.css у строки сведений по умолчанию nowrap (даты и размеры) */
.doc-row__meta .doc-row__note { white-space: normal; }

/* ---------- 6. Версия для слабовидящих, печать ---------- */
/* Крупный шрифт: сведения раздела — строками «Срок: …» с переносом, без узкой второй колонки */
html[data-a11y="on"] .doc-item__meta { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.375rem; }
html[data-a11y="on"] .doc-item__meta div { display: flex; flex-wrap: wrap; gap: 0 0.5rem; }
html[data-a11y="on"] .doc-item__meta dt::after { content: ":"; }
html[data-a11y="on"] .doc-tools { grid-template-columns: minmax(0, 1fr); }
@media print {
  .disclosure__filter, .disclosure__count, .doc-tools { display: none !important; }
  .doc-item[hidden] { display: grid !important; }
  .doc-row[hidden] { display: grid !important; }
  .doc-link { border: 0; padding: 0; min-height: 0; }
  /* На бумаге адрес файла полезен: по нему документ можно найти */
  .doc-row__open[href]::after { content: " (" attr(href) ")"; font-size: 0.75rem; word-break: break-all; }
}