/* Правовые страницы: политика, согласие, оферта, оплата и возврат, правила посещения. Подключается только на них - ключом
   «styles: pravo.css» в файле страницы (content/<страница>.html). Сама книжная страница (поля, колонтитул, буквица, концовка) -
   css/text.css, он встаёт раньше как стиль вида text; здесь то, что нужно документу: заглавие и дата редакции, заголовки
   разделов с линейкой, нумерованные списки с вложенными блоками, якоря разделов и таблицы, читаемые на телефоне.
   Разметку пишет tools/import_pravo.py из текстов v3/pravo/*.md - оформление меняется только здесь. */
.pravo [id]{scroll-margin-top:calc(var(--hd) + 16px)}                 /* раздел, открытый по якорю (#formy, #cookie), не прячется под шапкой */
.pravo h2,.pravo h3,.pravo h4{overflow-wrap:break-word;font-variant-numeric:lining-nums}
.pravo .doc-red{font-style:italic;font-size:.98rem;color:var(--ink2);text-align:right}
.pravo hr{border:0;height:1px;background:var(--pline);margin:1.7em 0;max-width:none}
.pravo ol{padding-left:1.7em}
.pravo ol>li::marker{color:#5b1d0e}
.pravo ol.loose>li+li{margin-top:.85em}
.pravo li>*+*{margin-top:.6em}                                        /* абзацы, списки и таблицы внутри пункта */
.pravo li ul{padding-left:1.2em}

/* заглавие документа (если страница открывается заголовком) - по центру, как заглавие главы */
.pg-text .pravo>h2:first-child{text-align:center;font-weight:600;font-size:clamp(1.6rem,5.6vw,2.2rem);line-height:1.14;text-wrap:balance}
.pg-text .pravo>h2:first-child+.doc-red{text-align:center;margin-top:.7em}
/* разделы документа: заголовок с линейкой над ним. Разделы - это h2, а у страницы с заглавием - h3 */
.pg-text .pravo>h2:not(:first-child),.pg-text .pravo>h2:first-child~h3{margin-top:1.55em;padding-top:1em;border-top:1px solid rgba(90,58,30,.42);font-weight:600;font-size:clamp(1.42rem,5vw,1.9rem);line-height:1.16;color:#160d04}
.pg-text .pravo>h3{font-weight:600;font-size:clamp(1.26rem,4.4vw,1.56rem);line-height:1.2;color:#160d04}
.pg-text .pravo>h2:first-child~h4,.pg-text .pravo>h4{font-size:1.2rem;font-weight:700;line-height:1.24;margin-top:1.3em;color:#2a1a08}
.pg-text .pravo h5{margin-top:1.2em}

/* таблицы: на большом экране - обычная таблица; на телефоне строка складывается в столбик, над значением - подпись своего столбца */
.pravo .doc-tw{max-width:none;overflow-x:auto}                        /* если таблице тесно, прокручивается она сама, а не страница */
.doc{width:100%;border-collapse:collapse;font-size:.98rem;line-height:1.44}
.doc th,.doc td{padding:10px 14px 10px 0;border-top:1px solid var(--pline);vertical-align:top;text-align:left;overflow-wrap:break-word}
.doc th:last-child,.doc td:last-child{padding-right:0}
.doc tr:last-child>*{border-bottom:1px solid var(--pline)}
.doc thead th{border-top:0;border-bottom:1px solid #5a3a1e;font-family:var(--text);font-weight:700;font-size:.92rem;line-height:1.3;color:var(--ink2)}
.doc thead tr:last-child>*{border-bottom:1px solid #5a3a1e}
.doc tbody tr:first-child>*{border-top:0}
.doc-kv th{width:34%;font-weight:400;font-style:italic;color:var(--ink2)}
.doc-4 td:first-child{width:27%}
.doc-4 td:last-child{width:16%}

@media (min-width:700px){
  .pg-text .pravo .doc-tw{padding:2px 14px 4px;background:rgba(255,248,226,.34);border:1px solid rgba(90,58,30,.3)}      /* таблица на вклеенном листке: чуть светлее страницы */
  .pg-text .pravo>.doc-tw{margin-left:-14px;margin-right:-14px}                                                           /* в тексте страницы листок чуть шире набора; внутри пункта списка - по его ширине */
  .pg-text .pravo .doc tr:last-child>*{border-bottom:0}
}
@media (max-width:699px){
  .doc,.doc tbody,.doc tr,.doc th,.doc td{display:block;width:auto}
  .doc thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}      /* шапка остаётся для чтения с экрана */
  .doc tr{padding:11px 0 12px;border-top:1px solid var(--pline)}
  .doc tr:last-child{border-bottom:1px solid var(--pline)}
  .doc th,.doc td,.doc tr:last-child>*,.doc tbody tr:first-child>*{padding:0;border:0}
  .doc td+td,.doc th+td{margin-top:7px}
  .doc td[data-label]::before{content:attr(data-label);display:block;font-size:.86rem;line-height:1.3;font-style:italic;color:var(--ink2)}
  .doc-kv th,.doc-4 td:first-child,.doc-4 td:last-child{width:auto}
  .doc-kv th{font-size:.9rem;line-height:1.3}
  /* на телефоне: шрифт таблицы как у текста; у таблиц в несколько столбцов каждая строка - отдельная запись с чертой слева,
     первое значение строки (о ком или о чём запись) выделено */
  .pg-text .pravo .doc{font-size:1rem;line-height:1.46}
  .pg-text .pravo .doc td[data-label]::before,.pg-text .pravo .doc-kv th{font-size:.9rem;margin-bottom:1px}
  .pg-text .pravo .doc:not(.doc-kv) tr{margin:14px 0;padding:2px 0 3px 13px;border-top:0;border-left:2px solid rgba(122,35,23,.6)}
  .pg-text .pravo .doc:not(.doc-kv) tr:last-child{border-bottom:0}
  .pg-text .pravo .doc:not(.doc-kv) td:first-child{font-weight:700}
  .pg-text .pravo .doc:not(.doc-kv) td:first-child::before{font-weight:400}
  .pg-text .pravo .doc td+td,.pg-text .pravo .doc th+td{margin-top:9px}
}
