@charset "UTF-8";
/* ru-mobile.css - мобильная адаптация старого kentavr-art.ru (табличная вёрстка 2004 г.).
   Подключается nginx-вставкой перед </head> вместе с <meta name="viewport">.
   ВСЁ под @media: на ширине от 1120 px ни одно правило не действует.
   Правила - только ASCII (страницы сайта в windows-1251). */

/* Планшет в альбомной ориентации: только главная (таблицы 1100 px) не влезала в 1024. */
@media (min-width:1024px) and (max-width:1119px){
  table[width="1100"]{width:100%}
  table[width="1100"] td img{max-width:100%;height:auto}
}

@media (max-width:1023px){
  /* --- основа: одна колонка, таблицы раскладываются в блоки --- */
  html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
  body{margin:0 auto;padding:6px 10px 130px;max-width:720px;overflow-wrap:break-word}
  body,li,table,th,td,small{font-size:15px;line-height:1.45}
  p{font-size:16px;line-height:1.45;text-align:left}
  p.core,p.core-c,p.core-r,p.core-j,p.core-ny,p.autograph{font-size:15px}
  h1{font-size:22px;line-height:1.25;margin:6px 0 10px;padding-top:6px}
  h2{font-size:20px;line-height:1.25}
  .jt,.jm,.jb{text-align:left}
  table,tbody,tr,th,td{display:block;width:auto!important;max-width:100%;box-sizing:border-box}
  img{max-width:100%}
  img.b,a.menu>img,img[name="SlideShow"],img[src*="header_"]{height:auto}
  ul{padding-left:22px}
  td[width="40"],td[width="20"]{display:none}            /* пустые ячейки-отступы */

  /* --- шапка --- */
  table[width="970"]>tbody>tr{display:flex;flex-direction:column}
  table[width="970"]>tbody>tr>td[align]{text-align:center}
  img[src*="header_l."]{display:block;margin:0 auto;width:auto;height:36px}   /* логотип 146x36 вместо 317x78 */
  img[src*="header_m."]{display:none}                    /* декоративное фото интерьера */
  table[width="970"]>tbody>tr>td[align="right"]{padding:5px 0 0;line-height:0}

  /* --- меню (сверху и снизу): одна строка, на самых узких экранах листается вбок --- */
  table[width="400"]{margin-top:0!important}
  table[width="400"]>tbody>tr{display:flex;flex-wrap:nowrap;overflow-x:auto}
  td.menu{flex:none}
  td.menu:first-child{margin-left:auto}
  td.menu:last-child{margin-right:auto}
  td.menu[width]{display:none}                           /* точки-разделители */
  td.menu>a.menu{display:inline-block;padding:10px 1.1vw;font-size:clamp(13px,3.6vw,15px);white-space:nowrap}

  /* --- главная: плитка разделов и слайд-шоу --- */
  table[width="1100"] tr[align="center"]{display:flex;flex-wrap:wrap;justify-content:center}
  table[width="1100"] tr[align="center"]>td{width:50%!important;padding:8px 4px}
  table[width="1100"] tr[align="center"] a.menu{display:block}
  table[width="1100"] tr[align="center"] img{height:130px;width:auto;object-fit:contain}
  img[name="SlideShow"]{display:block;width:100%;max-width:505px;margin:0 auto 12px}

  /* --- листинг: сначала предметы, потом рубрикатор --- */
  td.ct[width="600"]{order:-1}
  td[width="330"]{margin-top:28px;padding-top:16px;border-top:1px solid #4d7a5f}
  td[width="330"] div{margin-top:0!important;padding:8px 0;line-height:1.35}

  /* фильтр свёрнут; раскрывается нажатием на подпись (флажок + label вставляет nginx перед <form>,
     без этого CSS они скрыты атрибутом hidden, а форма видна как раньше) */
  #ru-mobile-f{display:block;position:absolute;opacity:0;pointer-events:none}
  #ru-mobile-fl{display:block;margin:2px 0 4px;padding:11px 14px;border:1px solid #4d7a5f;font-size:16px;text-align:left;cursor:pointer}
  #ru-mobile-fl::after{content:"\0025BE";float:right}
  #ru-mobile-f:checked~#ru-mobile-fl::after{content:"\0025B4"}
  #ru-mobile-f:focus-visible~#ru-mobile-fl{outline:2px solid #b3e4cf}
  #ru-mobile-f:not(:checked)~form>table{display:none}
  #ru-mobile-f:checked~form{padding-top:8px}
  #ru-mobile-f~form+br,#ru-mobile-f~form+br+br{display:none}   /* пустые строки после формы */
  /* фильтр применён (заполнено поле или выбрана сортировка не по умолчанию): подпись выделена и дописано "- применён" */
  #ru-mobile-fl:has(~form input[type="text"]:not([value=""]),~form input[name="o"][checked]:not([value="0"])){background:#34674a;font-weight:bold}
  #ru-mobile-fl:has(~form input[type="text"]:not([value=""]),~form input[name="o"][checked]:not([value="0"]))::before{content:"\002713\0000A0"}
  #ru-mobile-fl:has(~form input[type="text"]:not([value=""]),~form input[name="o"][checked]:not([value="0"]))>span::after{content:"\000020\002014\000020\00043F\000440\000438\00043C\000435\00043D\000451\00043D"}
  form td{padding-bottom:6px}
  input[type="text"],select{font-size:16px;padding:6px;max-width:100%;box-sizing:border-box}
  input[name="p_from"],input[name="p_to"]{width:96px!important}
  select[name="mt"]{width:auto!important}
  input[name="word"]{width:100%!important;margin:4px 0}
  input[type="submit" i]{width:auto!important;min-width:120px;min-height:44px;font-size:16px;margin:6px 0}
  input[type="radio" i]{width:20px;height:20px;margin:7px 8px 7px 0;vertical-align:middle}

  /* пагинация */
  .f_pages{display:inline-block;min-width:26px;padding:9px 8px;margin:3px 1px;border:1px solid #4d7a5f;text-align:center;font-size:16px;text-decoration:none}
  strong.f_pages{background:#34674a}

  /* карточка в списке: фото слева, текст справа (без :has - фото над текстом) */
  td.cm[rowspan]{text-align:center}
  td.cm[rowspan]~td p,td.rt>p{margin:0 0 6px}
  table:has(>tbody>tr>td.cm[rowspan]){border-top:1px solid #4d7a5f;padding-top:16px}
  table:has(>tbody>tr>td.cm[rowspan])>tbody{display:grid;grid-template-columns:42% 1fr;column-gap:14px;align-items:start}
  table:has(>tbody>tr>td.cm[rowspan])>tbody>tr{display:contents}
  table:has(>tbody>tr>td.cm[rowspan]) td{grid-column:2;text-align:left}
  table:has(>tbody>tr>td.cm[rowspan]) td.cm[rowspan]{grid-column:1;grid-row:1/span 6}
  table:has(>tbody>tr>td.cm[rowspan]) p{text-align:left}
  table:has(>tbody>tr>td.cm[rowspan]) td.cm img{width:100%}
  table:has(>tbody>tr>td.cm[rowspan]) td.rt>a[href]{display:inline-block;padding:8px 0}

  /* --- карточка предмета: фото во всю ширину, описание под ним --- */
  td[width="350"]{padding:10px 0;text-align:center}
  td[width="350"] img.b,div[align="center"]>img.b{width:100%;box-sizing:border-box}
  td[width="350"] img.b{max-width:500px}
  td[width="350"] a{display:inline-block;padding:10px 0}

  /* --- контакты: ссылки-телефоны и карта --- */
  div[align="center"]>a[href^="tel:"],div[align="center"]>a[href^="whatsapp:"],div[align="center"]>a[href^="viber:"],div[align="center"]>a[href^="tg:"],div[align="center"]>a[href^="mailto:"]{display:inline-block;padding:9px 0;font-size:16px}
  #YMapsID{width:100%!important;height:380px!important}
  #YMapsID img{max-width:none}
  #YMapsID table{display:table}#YMapsID tbody{display:table-row-group}#YMapsID tr{display:table-row}#YMapsID td{display:table-cell}

  /* --- наш баннер (#kv-new): с viewport его собственное масштабирование выключается само,
     здесь только зона нажатия кнопок --- */
  #kv-new-go{padding:11px 20px!important}
  #kv-new-later{display:inline-block;padding:11px 8px!important;font-size:14px!important}
}

/* планшет: плитка разделов по 4 в ряд */
@media (min-width:600px) and (max-width:1023px){
  table[width="1100"] tr[align="center"]>td{width:25%!important}
}
