/* 
 * Custom Product Badges Styles
 * Стили для индивидуальных ярлыков товаров
 */

/* Базовые стили ярлыка */
.cpb-badge {
    position: absolute;
    display: inline-block;
    padding: 8px 16px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: bold;
    color: #ffffff;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    line-height: 1;
    z-index: 10;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
    white-space: nowrap;
    transition: transform 0.2s ease;
}

.cpb-badge:hover {
    transform: scale(1.05);
}

/* Позиционирование */
.cpb-position-top-left {
    top: 10px;
    left: 10px;
}

.cpb-position-top-right {
    top: 10px;
    right: 10px;
}

.cpb-position-bottom-left {
    bottom: 10px;
    left: 10px;
}

.cpb-position-bottom-right {
    bottom: 10px;
    right: 10px;
}

/* Стили для разных типов ярлыков */

/* Распродажа - желтый градиент как на картинке */
.cpb-badge-sale {
    background: linear-gradient(135deg, #FDB913 0%, #F7931E 100%);
}

/* Хит продаж - красный */
.cpb-badge-hit {
    background: linear-gradient(135deg, #e74c3c 0%, #c0392b 100%);
}

/* Новинка - зеленый */
.cpb-badge-new {
    background: linear-gradient(135deg, #27ae60 0%, #229954 100%);
}

/* Рекомендуем - синий */
.cpb-badge-recommend {
    background: linear-gradient(135deg, #3498db 0%, #2980b9 100%);
}

/* Акция - оранжевый */
.cpb-badge-action {
    background: linear-gradient(135deg, #f39c12 0%, #e67e22 100%);
}

/* Эксклюзив - черный */
.cpb-badge-exclusive {
    background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%);
}

/* Пользовательский цвет */
.cpb-badge-custom {
    /* Цвет задается через inline style */
}

/* Контейнеры для позиционирования */
.woocommerce ul.products li.product,
.woocommerce-product-gallery,
.woocommerce div.product div.images {
    position: relative;
}

/* Для совместимости с разными темами */
.product-image-wrapper,
.product-thumbnail,
.attachment-woocommerce_thumbnail {
    position: relative;
}

/* Адаптив для мобильных */
@media (max-width: 768px) {
    .cpb-badge {
        padding: 6px 12px;
        font-size: 10px;
    }
    
    .cpb-position-top-left,
    .cpb-position-bottom-left {
        left: 5px;
    }
    
    .cpb-position-top-right,
    .cpb-position-bottom-right {
        right: 5px;
    }
    
    .cpb-position-top-left,
    .cpb-position-top-right {
        top: 5px;
    }
    
    .cpb-position-bottom-left,
    .cpb-position-bottom-right {
        bottom: 5px;
    }
}

/* Анимация появления */
@keyframes cpbFadeIn {
    from {
        opacity: 0;
        transform: scale(0.8);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.cpb-badge {
    animation: cpbFadeIn 0.3s ease;
}