/* =========================================================
   PHARAON — main.markers template.1
   Метки товаров: Рекомендуем / Новинка / Хит / Акция / С НДС / Под заказ
========================================================= */

.widget.c-markers.c-markers-template-1.ph-main-markers {
    display: block;
    width: 100%;
    height: 100%;
    pointer-events: none;
    box-sizing: border-box;
}

.widget.c-markers.c-markers-template-1.ph-main-markers .ph-main-markers-top,
.widget.c-markers.c-markers-template-1.ph-main-markers .ph-main-markers-bottom {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 5px;
    max-width: 210px;
}

.widget.c-markers.c-markers-template-1.ph-main-markers[data-orientation="vertical"] .ph-main-markers-top,
.widget.c-markers.c-markers-template-1.ph-main-markers[data-orientation="vertical"] .ph-main-markers-bottom {
    flex-direction: column;
    max-width: 170px;
}

.widget.c-markers.c-markers-template-1.ph-main-markers[data-orientation="horizontal"] .ph-main-markers-top,
.widget.c-markers.c-markers-template-1.ph-main-markers[data-orientation="horizontal"] .ph-main-markers-bottom {
    flex-direction: row;
}

/* Обёртка каждой метки */
.widget.c-markers.c-markers-template-1.ph-main-markers .widget-markers-wrap {
    display: inline-flex;
    margin: 0 !important;
    padding: 0 !important;
    width: auto !important;
    height: auto !important;
    line-height: 1 !important;
}

/* Общий стиль всех меток */
.widget.c-markers.c-markers-template-1.ph-main-markers .widget-markers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 20px;
    height: 20px;
    padding: 0 9px;
    border-radius: 3px;
    color: #ffffff;
    font-size: 10.5px;
    line-height: 20px;
    font-weight: 600;
    letter-spacing: 0;
    white-space: nowrap;
    text-transform: none;
    box-sizing: border-box;
    box-shadow: 0 5px 12px rgba(15, 17, 20, 0.12);
}

/* Рекомендуем */
.widget.c-markers.c-markers-template-1.ph-main-markers .widget-markers-recommend {
    background: #12a87c;
}

/* Новинка */
.widget.c-markers.c-markers-template-1.ph-main-markers .widget-markers-new {
    background: #1d63d8;
}

/* Хит */
.widget.c-markers.c-markers-template-1.ph-main-markers .widget-markers-hit {
    background: #ee8215;
}

/* Акция — жёлтая */
.widget.c-markers.c-markers-template-1.ph-main-markers .widget-markers-share {
    background: #f4b000;
}

/* С НДС — бирюзовая */
.widget.c-markers.c-markers-template-1.ph-main-markers .widget-markers-nds {
    background: #0898aa;
}

/* Под заказ — красная */
.widget.c-markers.c-markers-template-1.ph-main-markers .widget-markers-order {
    background: #d83a3a;
}

/* =========================================================
   Позиционирование внутри карточек
========================================================= */

/* Главная / популярные товары */
.c-widget-products-1 .widget-item-image-container {
    position: relative;
}

/* Каталог tile.3 */
.ns-bitrix.c-catalog-section.c-catalog-section-catalog-tile-3 .catalog-section-item-image-block {
    position: relative;
}

/* Каталог tile.2 на всякий случай */
.ns-bitrix.c-catalog-section.c-catalog-section-catalog-tile-2 .catalog-section-item-image-container {
    position: relative;
}

/* Контейнер меток на главной */
.c-widget-products-1 .widget-item-image-container .widget-item-marks {
    position: absolute;
    left: 16px;
    top: 16px;
    right: 16px;
    bottom: 16px;
    z-index: 20;
    pointer-events: none;
}

/* Контейнер меток в catalog.tile.3 */
.ns-bitrix.c-catalog-section.c-catalog-section-catalog-tile-3 .catalog-section-item-marks {
    position: absolute;
    left: 0;
    top: 0;
    right: 40px;
    bottom: 0;
    z-index: 20;
    pointer-events: none;
}

/* Контейнер меток в catalog.tile.2 */
.ns-bitrix.c-catalog-section.c-catalog-section-catalog-tile-2 .catalog-section-item-marks {
    position: absolute;
    left: -15px;
    top: -15px;
    right: 20px;
    z-index: 20;
    pointer-events: none;
}

/* Верхние метки */
.c-widget-products-1 .widget-item-image-container .ph-main-markers-top,
.ns-bitrix.c-catalog-section.c-catalog-section-catalog-tile-3 .catalog-section-item-marks .ph-main-markers-top,
.ns-bitrix.c-catalog-section.c-catalog-section-catalog-tile-2 .catalog-section-item-marks .ph-main-markers-top {
    position: relative;
    left: 0;
    top: 0;
    padding-right: 34px;
}

/* Нижние метки: С НДС / Под заказ */
.c-widget-products-1 .widget-item-image-container .ph-main-markers-bottom {
    position: absolute;
    left: 0;
    bottom: 0;
    padding-right: 34px;
}

/* Для catalog.tile.3 нижние метки НЕ абсолютные, чтобы не ломать карточку */
.ns-bitrix.c-catalog-section.c-catalog-section-catalog-tile-3 .catalog-section-item-marks .ph-main-markers-bottom {
    position: relative;
    left: 0;
    top: 5px;
    padding-right: 34px;
}

/* Для catalog.tile.2 */
.ns-bitrix.c-catalog-section.c-catalog-section-catalog-tile-2 .catalog-section-item-marks .ph-main-markers-bottom {
    position: relative;
    left: 0;
    top: 5px;
    padding-right: 34px;
}

/* =========================================================
   Страховка: если где-то метки выведены без ph-main-markers
========================================================= */

.widget.c-markers.c-markers-template-1 .widget-markers.widget-markers-nds,
.widget.c-markers.c-markers-template-1 .widget-markers.widget-markers-order {
    border-radius: 3px !important;
    height: 20px !important;
    min-height: 20px !important;
    padding: 0 9px !important;
    font-size: 10.5px !important;
    line-height: 20px !important;
    font-weight: 600 !important;
    color: #ffffff !important;
    box-shadow: 0 5px 12px rgba(15, 17, 20, 0.12) !important;
}

.widget.c-markers.c-markers-template-1 .widget-markers.widget-markers-nds {
    background: #0898aa !important;
}

.widget.c-markers.c-markers-template-1 .widget-markers.widget-markers-order {
    background: #d83a3a !important;
}

/* =========================================================
   Мобильная версия
========================================================= */

@media (max-width: 768px) {
    .widget.c-markers.c-markers-template-1.ph-main-markers .ph-main-markers-top,
    .widget.c-markers.c-markers-template-1.ph-main-markers .ph-main-markers-bottom {
        gap: 4px;
        max-width: 160px;
    }

    .widget.c-markers.c-markers-template-1.ph-main-markers .widget-markers {
        min-height: 19px;
        height: 19px;
        padding: 0 8px;
        border-radius: 3px;
        font-size: 9.5px;
        line-height: 19px;
    }

    .c-widget-products-1 .widget-item-image-container .widget-item-marks {
        left: 12px;
        top: 12px;
        right: 12px;
        bottom: 12px;
    }
}