/* ==========================================================================
   ДВУХКОЛОНОЧНАЯ КАРТОЧКА ТОВАРА (В СТИЛЕ DIXIA)
   ========================================================================== */

/* Контейнер карточки (выстраивает фото и текст в две колонки) */
.rox-product-container {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 40px !important; /* Отступ между фото и текстом */
    margin-bottom: 40px !important;
    align-items: flex-start !important;
}

/* Левая колонка: Фото товара (45% ширины страницы) */
.rox-product-left {
    flex: 0 0 45% !important;
    max-width: 45% !important;
}   

/* Рамка вокруг фотографии (очень тонкая серая рамка, как в Dixia) */
.rox-product-image-wrapper {
    background: #ffffff !important;
    border: 1px solid #f1f1f1 !important;
    border-radius: 4px !important;
    padding: 20px !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.02) !important;
}

/* 
   Сброс жесткой встроенной высоты 520px, которую HikaShop прописывает картинке 
*/
.rox-product-image-wrapper .hikashop_product_main_image,
.rox-product-image-wrapper .hikashop_main_image_div,
.rox-product-image-wrapper .hikashop_global_image_div,
.rox-product-image-wrapper .hikashop_product_main_image_subdiv,
.rox-product-image-wrapper div,
.rox-product-image-wrapper a {
    height: auto !important; /* Сбрасываем 520px на всех внутренних div и a */
    width: 100% !important;
    max-height: 400px !important; /* Ограничиваем максимальную высоту контейнера */
    display: block !important;
    text-align: center !important;
    float: none !important;
    clear: both !important;
}

/* Настройка самой картинки внутри */
.rox-product-image-wrapper img#hikashop_main_image,
.rox-product-image-wrapper img {
    max-width: 100% !important;
    max-height: 350px !important; /* Делаем фото аккуратным по высоте, как в Dixia */
    height: auto !important;
    width: auto !important;
    display: inline-block !important;
    object-fit: contain !important;
    margin: 0 auto !important;
    padding: 0 !important;
}

/* Правая колонка: Описание, артикул, цена (оставшаяся ширина) */
.rox-product-right {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important; /* Аккуратный вертикальный отступ между строками */
    padding-top: 10px !important;
}

/* Заголовок товара (крупный шрифт) */
.rox-product-title {
    font-size: 26px !important;
    font-weight: 700 !important;
    color: #212529 !important;
    margin: 0 0 5px 0 !important;
    line-height: 1.3 !important;
}

/* Мета-данные (Артикул) */
.rox-product-meta {
    font-size: 13px !important;
    color: #8c8c8c !important;
    margin-bottom: 5px !important;
}

/* Стилизация вывода цены (или плашки "Бесплатно") */
.rox-product-price-wrapper {
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #c3121b !important; /* Красный цвет Мастерпласт */
    margin-top: 10px !important;
}

/* Переопределение стилей цены самого HikaShop */
.rox-product-price-wrapper .hikashop_product_price {
    color: #ffffff !important;
    font-weight: bold !important;
    font-size: 20px !important;
}

/* Варианты и характеристики у кнопки покупки */
.rox-product-options {
    margin-top: 10px !important;
}

/* Адаптивность: на телефонах фото и текст встанут друг под друга на 100% ширины */
@media (max-width: 991px) {
    .rox-product-left,
    .rox-product-right {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }
    .rox-product-container {
        gap: 20px !important;
    }
}


/* ==========================================================================
   ВКЛАДКИ (ТАБЫ) В ФИРМЕННОМ КРАСНОМ ЦВЕТЕ MASTERPLAST
   ========================================================================== */

/* Общий контейнер блока вкладок */
.rox-tabs-container {
    margin-top: 40px;
    font-family: inherit;
}

/* Список вкладок (горизонтальная линия) */
.rox-tabs-list.hikashop_tabs_ul {
    display: flex !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 25px 0 !important;
    border-bottom: 2px solid #e9ecef !important; /* Тонкая серая линия под всеми вкладками */
    gap: 10px !important;
}

/* Стили отдельных вкладок (кнопок) */
.rox-tabs-list .hikashop_tabs_li {
    padding: 12px 24px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important; /* Все буквы заглавные */
    letter-spacing: 0.5px !important;
    color: #7a7a7a !important;
    cursor: pointer !important;
    background: none !important;
    border: none !important;
    border-bottom: 3px solid transparent !important;
    margin-bottom: -2px !important; /* Наложение на нижнюю линию списка */
    transition: all 0.2s ease-in-out !important;
}

/* Эффект при наведении на вкладку */
.rox-tabs-list .hikashop_tabs_li:hover {
    color: #c3121b !important; /* Фирменный красный цвет Мастерпласт */
}

/* Активная (выбранная) вкладка */
.rox-tabs-list .hikashop_tabs_li.hikashop_tabs_li_selected {
    color: #c3121b !important; /* Фирменный красный цвет Мастерпласт */
    border-bottom: 3px solid #c3121b !important; /* Красная полоса внизу */
    background: transparent !important;
}

/* 
   СБРОС СТАРЫХ СТИЛЕЙ ИЗ custom.css (строка 2800)
   Убираем серо-фиолетовый фон, рамки и скругления под табами 
*/
.rox-tab-content.hikashop_tabs_content {
    background: transparent !important; /* Делаем фон прозрачным (белым), как в Dixia */
    border: none !important; /* Убираем рамку вкладки */
    border-radius: 0 !important; /* Убираем скругления */
    box-shadow: none !important;
    padding: 15px 0 !important; /* Уменьшаем отступы до аккуратных */
    margin-top: 0 !important;
}


/* ==========================================================================
   ТАБЛИЦА ХАРАКТЕРИСТИК В СТИЛЕ DIXIA (ПОЛНЫЙ СБРОС СЕТКИ)
   ========================================================================== */

/* 1. Сбрасываем все внутренние блочные рамки, фоны и скругления */
#hikashop_show_tabular_specification div,
#hikashop_show_tabular_specification span,
#hikashop_show_tabular_specification p,
#hikashop_show_tabular_specification td {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* 2. Настраиваем строки (каждая характеристика как строка) */
#hikashop_show_tabular_specification .hikashop_product_custom_field_div,
#hikashop_show_tabular_specification .row {
    display: flex !important;
    justify-content: space-between !important; /* Название — слева, значение — справа */
    align-items: center !important;
    width: 100% !important;
    padding: 12px 10px !important;
    margin: 0 !important;
    border-bottom: 1px solid #eaeaea !important; /* Тонкая серая линия, как в Dixia */
}

/* Левая часть: Название характеристики */
#hikashop_show_tabular_specification .hikashop_product_custom_field_label,
#hikashop_show_tabular_specification .hikashop_product_custom_field_name,
#hikashop_show_tabular_specification .col-md-6:first-child,
#hikashop_show_tabular_specification .col-xs-6:first-child {
    color: #8c8c8c !important; /* Приглушенный серый */
    font-weight: normal !important;
    font-size: 14px !important;
    text-align: left !important;
    width: auto !important;
}

/* Правая часть: Значение */
#hikashop_show_tabular_specification .hikashop_product_custom_field_value,
#hikashop_show_tabular_specification .col-md-6:last-child,
#hikashop_show_tabular_specification .col-xs-6:last-child {
    color: #212529 !important;
    font-weight: bold !important; /* Жирный шрифт */
    font-size: 14px !important;
    text-align: right !important;
    width: auto !important;
}

/* 3. Дублирующий сброс на случай, если выводится таблицей */
#hikashop_show_tabular_specification table {
    width: 100% !important;
    border-collapse: collapse !important;
    margin-top: 15px !important;
    border: none !important;
}

#hikashop_show_tabular_specification table tr {
    border-bottom: 1px solid #eaeaea !important;
    background: transparent !important;
}

#hikashop_show_tabular_specification table tr:hover {
    background-color: #fcfcfc !important;
}

#hikashop_show_tabular_specification table td {
    padding: 12px 10px !important;
    font-size: 14px !important;
    border: none !important;
}

#hikashop_show_tabular_specification table td:first-child {
    color: #8c8c8c !important;
    text-align: left !important;
    font-weight: normal !important;
}

#hikashop_show_tabular_specification table td:last-child {
    color: #212529 !important;
    font-weight: bold !important;
    text-align: right !important;
}


/* ==========================================================================
   СТИЛИ ДЛЯ СВОБОДНОГО ОПИСАНИЯ В СТИЛЕ DIXIA
   ========================================================================== */

/* Спецификация с красными галочками */
.dixia-check-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 20px 0 !important;
}

.dixia-check-list li {
    position: relative !important;
    padding-left: 28px !important;
    margin-bottom: 12px !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    color: #333 !important;
}

/* Красивая галочка перед элементом */
.dixia-check-list li::before {
    content: "✓" !important;
    position: absolute !important;
    left: 0 !important;
    top: -1px !important;
    color: #c3121b !important; /* Фирменный красный Мастерпласт */
    font-weight: 900 !important;
    font-size: 18px !important;
}

/* Опасное предупреждение "Внимание" с красной чертой слева */
.dixia-warning {
    border-left: 3px solid #c3121b !important;
    padding-left: 15px !important;
    margin: 20px 0 !important;
    font-weight: bold !important;
    color: #c3121b !important;
}

/* Подзаголовки разделов в описании (Инструкция, Референции и т.д.) */
.dixia-sub-title {
    font-size: 15px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    color: #212529 !important;
    margin: 35px 0 15px 0 !important;
    border-bottom: 1px solid #dee2e6 !important;
    padding-bottom: 8px !important;
    letter-spacing: 0.5px !important;
}

/* Сетка для картинок "Референции" */
.dixia-images-grid {
    display: flex !important;
    gap: 20px !important;
    margin-top: 20px !important;
}

.dixia-image-item {
    flex: 1 !important;
}

.dixia-image-item img {
    width: 100% !important;
    height: auto !important;
    border-radius: 4px !important;
}

.dixia-image-item p {
    font-size: 12px !important;
    color: #777 !important;
    margin-top: 8px !important;
    text-align: left !important;
}

/* Адаптивность для мобильных телефонов (картинки встанут друг под друга) */
@media (max-width: 768px) {
    .dixia-images-grid {
        flex-direction: column !important;
    }
}


/* Эффект наведения для кнопок плюс/минус */
.rox-quantity-selector .quantity-btn:hover {
    background-color: #f1f1f1 !important;
}

/* Эффект наведения для кнопки добавления в корзину */
.rox-add-to-cart-btn:hover {
    opacity: 0.9 !important;
}