/* ====================================================
   Публичная страница ЦЕНЫ (/prices)
   Обёртка над существующим модулем /inc/price (дерево категорий +
   таблица цен), собранным изначально для админки. Здесь только
   стили каркаса страницы и адаптив — стили дерева и таблицы берутся
   из /inc/price/price.css и /inc/price/nomen/price/price.css.
   ==================================================== */

.pub_prc_wrap {
    background: #fff;
    width: 100%;
    box-sizing: border-box;
    padding: 16px;
    text-align: left;
}

/* ── верхний блок фильтра: обёртка та же, что на /enterprises ──────
   (.obr_seach1/.hav_seach/.blok_se_div/.element_scroll/.kn_close_btn —
   все уже приезжают вместе с /css/style_titul.css). Тут только то, чего
   там ещё не было: ряд вкладок типа проката и правый блок поиска. ─── */

/* /enterprises делит .hav_seach 49/49 (фиксированные проценты), но у нас
   слева не короткие кнопки, а набор переменной ширины (Страна/Регион/
   вкладки типа проката) — при разном числе вкладок фиксированный процент
   либо оставлял пустое место, либо резал кнопки. Пробовали
   float:auto + overflow:hidden (классический приём "добрать остаток
   строки") — но когда вкладок много и их суммарная ширина в один ряд
   больше строки, у float срабатывает запасной случай shrink-to-fit:
   он забирает 100% строки целиком, и .pub_prc_search_col проваливался
   на следующую строку. Поэтому на широких экранах ряд — flexbox БЕЗ
   переноса строк (flex-wrap:nowrap — это жёстко запрещает блокам
   расходиться по разным строкам, в отличие от float): .pub_prc_filter_col
   занимает ровно ширину своих кнопок (flex:0 0 auto, max-width —
   подстраховка, чтобы не съесть всю строку при большом числе вкладок —
   тогда вкладки переносятся на 2-ю строку ВНУТРИ него), а
   .pub_prc_search_col гарантированно остаётся в той же строке и
   добирает весь остаток (flex:1 1 0). На узких экранах ниже (@media
   max-width:1279px) всё стандартно складывается в колонку. */
@media (min-width: 1280px) {
    .obr_seach1 { display: flex; flex-wrap: nowrap; align-items: stretch; height:65px; }
    .pub_prc_filter_col {
        float: none;
        width: auto;
        /* было 78% — увеличено, чтобы вкладки типа проката (у которых
           теперь тот же font-size:16px, что у Страна/Регион на этом
           брейкпоинте — см. .pub_prc_typebtn ниже) помещались в один ряд
           и не переносились на 2-ю строку внутри .pub_prc_type_tabs */
        max-width: 85%;
        flex: 0 0 auto;
    }
    .pub_prc_search_col {
        float: none;
        width: auto;
        /* растягивается на весь остаток строки (flex:1 1 0), чтобы правый
           край блока поиска доходил ровно до правого края нижней карточки
           с таблицей (.window_ram) — они в одной сетке #main_page. Ширина
           .pub_prc_filter_col слева задаётся её содержимым (см. max-width
           выше), а не этим блоком, так что сама по себе он безопасен для
           переноса вкладок на 2-ю строку. */
        min-width: 200px;
        flex: 1 1 0;
    }
}

/* .hav_seach в css/style_titul.css задан с фиксированной height:50px —
   рассчитан на короткие ярлыки /enterprises. У нас, особенно на узких
   экранах, вкладки типа проката всё равно переносятся на 2-3 строки
   (не влезают даже при 77%-ширине колонки) и вылезали за эти 50px —
   именно это создавало гигантский разрыв до карточки результата ниже
   (следующий clear:both корректно вставал под РЕАЛЬНОЙ, вылезшей высотой,
   плюс ещё свои отступы поверх). Правим только на этой странице —
   prices_public.css грузится исключительно на /prices, /enterprises
   это не касается. */
.obr_seach1 .hav_seach { height: auto !important; }

/* На /enterprises длинное название города не переносится визуально только
   благодаря побочному эффекту фиксированной height:50px у .hav_seach
   (см. правило выше) — вторая строка обрезается по высоте, но сам перенос
   строки никуда не девается. Раз мы уже сняли эту фиксированную высоту
   (нужно для вкладок типа проката выше), название страны/города нужно
   обрезать по ширине явно — иначе оно перенесётся на 2-ю строку и растянет
   тулбар. */
#country_seach, #region_seach {
    display: block;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pub_prc_filter_clear { clear: both; }
.pub_prc_filter_gap { clear: both; height: 30px; }

.pub_prc_type_tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    align-items: flex-start;
    width: auto !important;
    padding-top: 3px;
}
.pub_prc_typebtn {
    /* padding сверху/снизу — 3px, как у .kn_top_white/.kn_top_green слева
       (Страна/Регион), чтобы высота кнопок совпадала в точности */
    padding: 3px 9px;
    /* font-size намеренно НЕ задаём здесь: каждая кнопка вкладки уже несёт
       класс .kn_top_green или .kn_top_white (см. prices_main.php) — тот же
       класс, что у кнопок "Страна"/"Регион". Раз font-size у этих классов
       и так меняется по брейкпоинтам в css/style_titul.css (10px/16px),
       достаточно не переопределять его здесь — тогда размер совпадает с
       Страна/Регион автоматически на любой ширине экрана, без дублирования
       чужих брейкпоинтов. */
    white-space: nowrap;
    -webkit-user-select: none;
    user-select: none;
}
/* .kn_top_white/.kn_top_green заданы под ширину:100% в float-обёртке
   (css/style_titul.css) — тут кнопки идут в ряд, ширина по содержимому */
.pub_prc_typebtn.kn_top_white,
.pub_prc_typebtn.kn_top_green { width: auto; }

/* правый блок поиска — часть общего фильтра, а не мелкая деталь сбоку:
   та же рамка/скругление, что у кнопок Страна/Регион/вкладок (.kn_top_white:
   border:1px #bbb solid; border-radius:4px), та же высота ряда, что и у
   левой колонки — так оба hav_seach читаются как единый тулбар, как на
   /enterprises (seach_left + seach_right в одном ряду одинаковой высоты). */
.pub_prc_se_right {
    position: relative;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    height: 100%;
    min-height: 58px;
    background: #fff;
    border: 1px #bbb solid;
    border-radius: 4px;
    padding: 10px 44px 10px 34px;
}
.pub_prc_se_right:focus-within {
    border-color: #2A9E89;
}
/* лупа остаётся у правого края, а крестик — в самом начале строки,
   перед полем ввода (левее текста), по просьбе после первой правки. */
.pub_prc_search_lupa {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
    opacity: 0.9;
    pointer-events: none;
}
.pub_prc_search_input.prc_search_input {
    flex: 1 1 auto;
    width: 100% !important;
    height: auto !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    font-size: 15px !important;
}
.pub_prc_se_right .prc_clear_inp { left: 9px; right: auto; }
/* Базовый .prc_clear_inp (inc/price/nomen/price/price.css) рисует крестик
   бледно-серым (#a0aec0) — в админке рядом с полем ввода он читается, а тут,
   в светлом тулбаре /prices, теряется и выглядит невидимым. Красный —
   как kn_close_btn/red_krestik.svg на /enterprises — виден всегда, не только
   при наведении. */
#prc_clear_search { color: #e53e3e; }

/* ── колонки дерева + область результата ────────────── */
.pub_prc_columns {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    min-height: 300px;
}
.pub_prc_col {
    border-right: 1px solid #eee;
}
/* Правый отступ внутри колонки: у .price_level_col (/inc/price/price.css)
   он 15px — рассчитан на админское дерево, а здесь эти пиксели напрямую
   съедают буквы в пунктах меню (ширину колонки подбирает JS по самому
   длинному пункту, см. pubLayoutCols в prices_main.php, и padding входит
   в неё целиком). Уменьшаем до 7px — в ту же ширину влезает на пару
   символов больше.
   Селектор намеренно от .pub_prc_columns (специфичность 0-2-0): загрузка
   таблицы цен подтягивает /inc/price/price.css повторно, уже ПОСЛЕ этого
   файла (см. weight_public.php), и правило с одним классом он бы перебил
   обратно на 15px. */
.pub_prc_columns .pub_prc_col {
    padding-right: 7px;
}
/* То же и со стрелкой ">" справа от названия: 5px слева + 5px справа
   уходили в пустоту у самого края колонки. Правый отступ убираем совсем
   (колонке и так задан padding-right), левый — минимальный, чтобы стрелка
   не липла к тексту. В колонке со скроллом JS ставит свой margin-right
   инлайном — там нужен зазор под ползунок niceScroll. */
.pub_prc_columns .pub_prc_col .price_item_arrow {
    margin-left: 3px;
    margin-right: 0;
}
/* Колонка без пунктов (например, у дерева всего из двух уровней 2-я
   колонка остаётся пустой — типоразмеры уходят в финальную, см.
   prices_main.php) не должна рисовать посреди меню осиротевшую
   вертикальную черту высотой в 400px. */
.pub_prc_columns .pub_prc_col:empty {
    border-right: 0;
    padding-right: 0;
    min-height: 0;
}
/* Ширину колонки/пункта здесь всегда выставляет JS (pubMeasureCol +
   pubLayoutCols, prices_main.php): по содержимому, пока хватает места в
   ряду, и с пропорциональным ужатием, когда не хватает. Во втором случае
   тексту пункта, без этого правила, было бы некуда деваться, кроме как
   перенестись на вторую строку (у .price_item_text из /inc/price/price.css
   своего white-space:nowrap нет — там расчёта на обрезку по ширине не
   было, только на подгонку под контент). Здесь же всегда нужна ровно одна
   строка — обрезаем многоточием, как и на планшете/мобильном (см.
   медиа-запрос ниже, тот же приём).
   ВАЖНО: финальная колонка (типоразмеры, .pub_prc_col_final) сюда не
   входит — её ширина подбирается тем же расчётом, но текст в ней
   НИКОГДА не обрезается многоточием: там название пункта
   должен быть виден целиком (переносом на вторую строку, если не влез),
   а не прятаться за "…". См. также .pub_prc_col_tiles — плитки
   "Цветного проката" тоже не участвуют, у них своя вёрстка. */
.pub_prc_col:not(.pub_prc_col_final):not(.pub_prc_col_tiles) .price_item_text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* Список пунктов уровня дерева может быть очень длинным (например, все
   типоразмеры) — после 15 пунктов JS (prices_main.php, pubFitColWidth)
   включает скролл внутри колонки вместо растягивания её на всю высоту
   страницы. Реальный узкий ползунок рисует niceScroll (prices_main.php,
   pubFitPageHeight, как и левое дерево ГОСТов в
   /inc/gostkatalog/katalog_main.php) — родной скроллбар браузера не даёт
   сузить полосу меньше нескольких пикселей. Правила ниже — запасной
   вариант на случай, если JS/niceScroll не сработает. */
.pub_prc_col.pub_prc_col_scroll {
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: thin;
}
.pub_prc_col.pub_prc_col_scroll::-webkit-scrollbar {
    width: 1.5px;
    height: 0;
}
.pub_prc_col.pub_prc_col_scroll::-webkit-scrollbar-track {
    background: transparent;
}
.pub_prc_col.pub_prc_col_scroll::-webkit-scrollbar-thumb {
    background: #2A9E89;
    border-radius: 3px;
}
.pub_prc_result {
    flex: 1 1 320px;
    min-width: 280px;
    box-sizing: border-box;
    padding-left: 5px;
}
.pub_prc_result_show { padding-top: 2px; }
.pub_prc_result_title {
    font-size: 16px;
    font-weight: 600;
    color: #222;
    margin: 4px 0 12px;
}
.pub_prc_loading,
.pub_prc_empty {
    padding: 20px 5px;
    color: #999;
    font-size: 13px;
}
/* Подпись вместо пустой колонки, когда пункты меню были, но поиск по лупе
   не оставил среди них совпадений (см. load_level.php, $_pub_lvl_no_match,
   и prices_main.php, pubPrcApplySearch). */
.pub_prc_col_msg {
    padding: 12px 5px;
    color: #999;
    font-size: 12px;
    width: 140px;
}

/* Поле фильтра в самом верху 3-й колонки — на месте, где раньше стоял
   первый пункт списка (см. pubAddColSearch в prices_main.php). Высоту
   ставит JS равной высоте ячейки списка, ширина — вся внутренняя ширина
   колонки. Колонка бывает со скроллом (.pub_prc_col_scroll) — поле
   остаётся прижатым к её верху (sticky), а не уезжает вместе со списком. */
.pub_col_search {
    position: sticky;
    top: 0;
    z-index: 2;
    /* Ширина — рассчитанная ширина колонки плюс 1px (совпадает с пунктами
       списка под ним, у них свои рамки/отступы), не расширяя саму колонку.
       Раньше блок ещё и сдвигался на -2px влево, но в колонке со скроллом
       (.pub_prc_col_scroll, overflow-x:hidden) это уводило левую рамку поля
       за пределы видимой области — она обрезалась (пропадала полоска
       слева). Левый сдвиг убран, отступ вправо (+1px) оставлен. */
    width: calc(100% + 1px);
    min-height: 26px;
    margin-bottom: 4px;
    box-sizing: border-box;
    background: #fff;
}
/* Лупа — фоном справа внутри поля (/images/svg/lupa.svg одноцветная,
   stroke #333, поэтому выглядит как обычный серый значок). Под неё
   отводится padding-right, чтобы вводимый текст на неё не наезжал.
   Отступы намеренно минимальные: ширину колонки задаёт её содержимое
   (pubMeasureCol/pubLayoutCols в prices_main.php), и в узкой колонке
   типоразмеров ("5", "6") каждый пиксель на счету. */
.pub_col_search_input {
    width: 100%;
    height: 100%;
    min-height: 26px;
    box-sizing: border-box;
    border: 1px solid #ddd;
    border-radius: 3px;
    padding: 0 13px 0 3px;
    font-size: 13px;
    line-height: 24px;
    color: #222;
    background: #fff url('/images/svg/lupa.svg') no-repeat right 2px center;
    background-size: 10px 10px;
    outline: none;
}
.pub_col_search_input:focus {
    border-color: #2A9E89;
}
/* Идёт ввод — лупа убрана, и освободившееся под неё место справа отдано
   тексту (класс вешает JS, см. обработчик .pub_col_search_input). */
.pub_col_search_input.pub_col_search_typing {
    background-image: none;
    padding-right: 3px;
}

/* ── планшет + мобильный (≤ 1279px, как у .obr_seach1 в style_titul.css) ──
   При недостатке ширины строки (много вкладок типа проката) filter_col
   раньше выедал всю строку и .pub_prc_search_col «перескакивал» вниз
   некрасиво (не на всю ширину, а как попало). Вместо этого — принудительно
   складываем оба блока в колонку на этих же брейкпоинтах, что и общий
   .hav_seach{width:100%} в style_titul.css. */
@media (max-width: 1279px) {
    .pub_prc_filter_col,
    .pub_prc_search_col { width: 100% !important; max-width: 100% !important; float: left; }
    .pub_prc_search_col { margin-top: 8px; }
}

/* ── дерево колонок на планшете и мобильном (≤ 1279px) ──────────────
   Как на десктопе: узкие колонки дерева стоят в ряд, финальная колонка
   (типоразмеры — класс .pub_prc_col_final, на неё ведёт клик по
   /prices/<URL>) ВСЕГДА остаётся такой же узкой, как остальные, и
   переносить её на новую строку нельзя. Если весь ряд не помещается по
   ширине экрана — сжимаются более ранние колонки слева (1-й/2-й уровень,
   иногда с вложенным аккордеоном 3-го — см. .price_level_3_inline в
   price.css), а не финальная: им задаётся flex-basis:0 вместо ширины,
   выставленной JS (pubFitColWidth), так что при нехватке места ужимаются
   именно они, а не последний уровень. Плитки "Цветного проката"
   (.pub_prc_col_tiles) в эту логику не попадают — они как были, так и
   остаются на всю ширину отдельной строкой (см. flex-wrap:wrap в базовом
   .pub_prc_columns выше — 100%-ная ширина сама переносит следующий
   элемент на новую строку). Просмотр (таблица цен, #pub_prc_result) —
   всегда отдельным блоком под рядом колонок, на всю ширину, тем же
   приёмом (flex-basis:100%). Сам выбор (клики, AJAX, подсветка) не
   меняется — тот же JS, что и на десктопе (prices_main.php). На десктопе
   (> 1279px) ничего из этого блока не действует. */
@media (max-width: 1279px) {
    .pub_prc_col:not(.pub_prc_col_final):not(.pub_prc_col_tiles) {
        flex: 1 1 0%;
        min-width: 0;
        max-width: 220px;
    }
    .pub_prc_col:not(.pub_prc_col_final):not(.pub_prc_col_tiles) .price_list_item,
    .pub_prc_col:not(.pub_prc_col_final):not(.pub_prc_col_tiles) .price_item_text_wrapper,
    .pub_prc_col:not(.pub_prc_col_final):not(.pub_prc_col_tiles) .price_item_line {
        width: 100% !important;
    }
    .pub_prc_col:not(.pub_prc_col_final):not(.pub_prc_col_tiles) .price_item_text {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    /* Пустая колонка не должна занимать место в строке. У дерева всего из
       двух уровней (категории, у которых сразу типоразмеры — "Круг",
       "Квадрат", "Рельсы") 2-я колонка остаётся пустой: типоразмеры уходят
       в финальную, 3-ю (см. prices_main.php, ветка <!--is_nomen-->). А
       flex:1 1 0% выше растягивал её наравне с 1-й — между меню и списком
       типоразмеров зияла пустая полоса шириной до 220px, и на самой 1-й
       колонке из-за этого оставалась половина места. Схлопываем такую
       колонку в ноль: освободившееся место flex-grow сам отдаёт 1-й
       колонке, и она расширяется вплоть до финальной.
       Только для узких экранов: на десктопе (> 1279px) ширину колонок
       считает JS (pubLayoutCols, prices_main.php), пустая колонка там
       ширины не получает вовсе — и там всё остаётся как есть. */
    .pub_prc_col:not(.pub_prc_col_final):not(.pub_prc_col_tiles):empty {
        flex: 0 0 0;
        max-width: 0;
        margin-left: 0 !important;
    }

    .pub_prc_col.pub_prc_col_final {
        flex: 0 0 auto;
    }

    .pub_prc_result {
        flex: 1 1 100%;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
        padding-left: 0;
    }
}

/* ── описание номенклатуры (load_result.php) ────────────────────────
   Описание позиции (tree_catalog_nomen.opisanie), редактируется в
   админке (inc/price/nomen/tab_desc.php). Показывается только если
   описание заполнено, перед блоком "в других регионах". */
.prc_nomen_desc_wrap {
    margin-top: 24px;
    padding-left: 20px;
    font-size: 12px;
    color: #333;
    line-height: 1.5;
}
.prc_nomen_desc_wrap ul,
.prc_nomen_desc_wrap ol {
    margin: 0;
    padding: 0;
    list-style-position: inside;
}

/* ── превью цен по другим регионам (load_result.php) ────────────────
   Показывается под основной таблицей результата, когда сессия
   отфильтрована на конкретный регион ($_SESSION['prc_region']) и в
   других регионах для того же типоразмера тоже нашлись записи —
   чтобы было видно, что предложения есть и в других местах, не
   переключаясь туда вслепую. Название региона по умолчанию — блёклый
   серый текст, при наведении "проявляется" фирменным зелёным и
   становится кликабельным (клик — см. prices_public.js,
   .prc_other_region_title — меняет регион фильтра и перегружает
   страницу). Сама таблица под названием — только для просмотра,
   монохромно-серая и некликабельная (pointer-events:none): реальный
   переход возможен только явным кликом по названию региона. */
.prc_other_regions_wrap {
    margin-top: 24px;
}
.prc_other_regions_caption {
    font-size: 11px;
    color: #999;
}
.prc_other_region_block {
    margin-top: 18px;
    padding-top: 14px;
    border-top: 1px dashed #e0e0e0;
}
.prc_other_region_title {
    display: inline-block;
    font-size: 14px;
    font-weight: 600;
    color: #bbb;
    cursor: pointer;
    transition: color .15s;
}
.prc_other_region_title:hover {
    color: #2A9E89;
}
.prc_other_region_table_wrap {
    margin-top: 8px;
    pointer-events: none;
    user-select: none;
    filter: grayscale(1);
}
.prc_other_region_table_wrap,
.prc_other_region_table_wrap * {
    color: #bbb !important;
    border-color: #eee !important;
    background: transparent !important;
    box-shadow: none !important;
}
/* Шапка — ещё бледнее самих строк, почти неразличима на белом фоне: это
   не рабочий заголовок (сортировка всё равно отключена pointer-events:none
   у .prc_other_region_table_wrap), а просто структурная подсказка, что
   колонки те же, что и в активной таблице. */
.prc_other_region_table_wrap thead th {
    color: #e4e4e4 !important;
    background: #f2f2f2 !important;
}
.prc_other_region_table_wrap .prc_gost_link,
.prc_other_region_table_wrap .prc_comp_nm {
    text-decoration: none;
    cursor: default;
}
.prc_other_region_table_wrap .prc_toggle_btn {
    display: none;
}
.prc_other_region_table_wrap .prc_detail_row {
    display: none !important;
}

/* ====================================================
   Мобильная адаптация (≤ 767px)
   ==================================================== */
@media (max-width: 767px) {
    .pub_prc_wrap { padding: 10px; }

    .pub_prc_typebtn { padding: 3px 10px; }
    .pub_prc_se_right { min-height: 46px; padding: 10px 36px 10px 36px; }
    .pub_prc_search_lupa { width: 18px; height: 18px; right: 12px; }
    .pub_prc_se_right .prc_clear_inp { left: 10px; right: auto; }
    .pub_prc_filter_gap { height: 14px; }

    /* Ряд колонок дерева (.pub_prc_columns) и раскладка узких/финальной
       колонки — общие для планшета и мобильного правила из блока
       @media (max-width: 1279px) выше, здесь переопределять нечего. */
}