/* ==========================================================================
   1. АДАПТИВНОСТЬ И БЕЗОПАСНЫЙ СБРОС ШИРИНЫ ( БЕЗ OVERFLOW-X: HIDDEN )
   ========================================================================== */

/* Убираем жесткий скролл-фильтр, оставляя только контроль ширины */
html, body {
    width: 100% !important;
    max-width: 100% !important;
}

/* Ограничиваем изображения в описании */
body:not(.bx-panel-layout) .detail_text img,
body:not(.bx-panel-layout) .content img,
body:not(.bx-panel-layout) .catalog-detail-desc img {
    max-width: 100% !important;
    height: auto !important;
}

/* Безопасный перенос слов для текста, не затрагивающий JS-теги */
body:not(.bx-panel-layout) .detail_text p, 
body:not(.bx-panel-layout) .detail_text span, 
body:not(.bx-panel-layout) .detail_text a, 
body:not(.bx-panel-layout) .detail_text li, 
body:not(.bx-panel-layout) .detail_text td,
body:not(.bx-panel-layout) .catalog-detail-desc p, 
body:not(.bx-panel-layout) .catalog-detail-desc span, 
body:not(.bx-panel-layout) .catalog-detail-desc a, 
body:not(.bx-panel-layout) .catalog-detail-desc li, 
body:not(.bx-panel-layout) .catalog-detail-desc td,
body:not(.bx-panel-layout) .article,
body:not(.bx-panel-layout) .prod_art,
body:not(.bx-panel-layout) .props_list td,
body:not(.bx-panel-layout) .props_list th,
body:not(.bx-panel-layout) .char_name,
body:not(.bx-panel-layout) .char_value,
body:not(.bx-panel-layout) .catalog-detail-property {
    word-wrap: break-word !important;
    word-break: break-word !important;
}

/* СБРОС ИНЛАЙН-СТИЛЕЙ ШИРИНЫ (Уничтожаем любые жесткие размеры в описании ткани) */
body:not(.bx-panel-layout) .tab-content div,
body:not(.bx-panel-layout) .tab-content table,
body:not(.bx-panel-layout) .tab-content blockquote,
body:not(.bx-panel-layout) .tab-content ul,
body:not(.bx-panel-layout) .tab-content ol,
body:not(.bx-panel-layout) .tab-content p,
body:not(.bx-panel-layout) .catalog-element div,
body:not(.bx-panel-layout) .detail_text div,
body:not(.bx-panel-layout) .detail_text table,
body:not(.bx-panel-layout) .detail_text p,
body:not(.bx-panel-layout) .detail_text ul,
body:not(.bx-panel-layout) .detail_text ol {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
}

/* Исправление жесткой ширины контейнера в описании товара */
body:not(.bx-panel-layout) .detail_text .container,
body:not(.bx-panel-layout) .catalog-detail-desc .container {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
    box-sizing: border-box !important;
}
body:not(.bx-panel-layout) .detail_text .container p,
body:not(.bx-panel-layout) .detail_text .container li,
body:not(.bx-panel-layout) .catalog-detail-desc .container p,
body:not(.bx-panel-layout) .catalog-detail-desc .container li {
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* Решение для больших таблиц на ноутбуках и ПК (MacBook) */
@media (min-width: 768px) {
    body:not(.bx-panel-layout) .detail_text table,
    body:not(.bx-panel-layout) .catalog-detail-desc table,
    body:not(.bx-panel-layout) .char_block table {
        display: block !important;
        max-width: 100% !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
    }
    body:not(.bx-panel-layout) .detail_text table tbody,
    body:not(.bx-panel-layout) .catalog-detail-desc table tbody,
    body:not(.bx-panel-layout) .char_block table tbody {
        display: table !important;
        width: 100% !important;
    }
}

/* --- АДАПТАЦИЯ ТАБЛИЦ ПОД МОБИЛЬНЫЕ (СМАРТФОНЫ) --- */
@media (max-width: 767px) {
    body:not(.bx-panel-layout) .detail_text table tr,
    body:not(.bx-panel-layout) .catalog-detail-desc table tr,
    body:not(.bx-panel-layout) .char_block table tr,
    body:not(.bx-panel-layout) .props_list table tr,
    body:not(.bx-panel-layout) .properties table tr {
        display: flex !important;
        flex-direction: column !important;
        margin-bottom: 10px !important;
        padding-bottom: 10px !important;
        border-bottom: 1px solid #eee !important;
    }

    body:not(.bx-panel-layout) .detail_text table td,
    body:not(.bx-panel-layout) .catalog-detail-desc table td,
    body:not(.bx-panel-layout) .char_block table td,
    body:not(.bx-panel-layout) .props_list table td,
    body:not(.bx-panel-layout) .properties table td,
    body:not(.bx-panel-layout) .detail_text table th,
    body:not(.bx-panel-layout) .catalog-detail-desc table th,
    body:not(.bx-panel-layout) .char_block table th,
    body:not(.bx-panel-layout) .props_list table th,
    body:not(.bx-panel-layout) .properties table th {
        display: block !important;
        width: 100% !important;
        box-sizing: border-box !important;
        padding: 5px 0 !important;
        border: none !important;
    }

    body:not(.bx-panel-layout) .detail_text table tr td:first-child,
    body:not(.bx-panel-layout) .catalog-detail-desc table tr td:first-child,
    body:not(.bx-panel-layout) .char_block table tr td:first-child,
    body:not(.bx-panel-layout) .props_list table tr td:first-child,
    body:not(.bx-panel-layout) .properties table tr td:first-child {
        font-weight: bold !important;
        color: #333 !important;
        padding-bottom: 2px !important;
    }

    body:not(.bx-panel-layout) .detail_text table tr td:not(:first-child),
    body:not(.bx-panel-layout) .catalog-detail-desc table tr td:not(:first-child),
    body:not(.bx-panel-layout) .char_block table tr td:not(:first-child),
    body:not(.bx-panel-layout) .props_list table tr td:not(:first-child),
    body:not(.bx-panel-layout) .properties table tr td:not(:first-child) {
        font-weight: normal !important;
        color: #555 !important;
        padding-top: 0 !important;
    }
}

/* ==========================================================================
   2. СТАБИЛИЗАЦИЯ И РАЗБЛОКИРОВКА ОКРУЖЕНИЯ ДЛЯ ПАНЕЛИ БИТРИКСА
   ========================================================================== */
body.bx-panel-layout, 
html.bx-panel-layout {
    overflow: visible !important;
    overflow-x: visible !important;
}

body.bx-panel-layout #bx-panel,
body.bx-panel-layout .bx-panel-layout,
body.bx-panel-layout .bx-edit-tabs {
    overflow: visible !important;
}
