/**
 * EasyWoo Category Styles CSS
 * 美妝分類專屬樣式
 */

/* 全域分類樣式 */
.easywoo-category-foundation,
.easywoo-category-lipstick,
.easywoo-category-eyeshadow,
.easywoo-category-nail-polish,
.easywoo-category-blush,
.easywoo-category-concealer {
    position: relative;
    display: inline-block;
}

/* 粉底分類樣式 */
.easywoo-category-foundation .easywoo-swatch {
    background: linear-gradient(135deg, #ffeaa7, #fdcb6e);
    border: 2px solid #d4af37;
    box-shadow: 0 2px 4px rgba(212, 175, 55, 0.3);
}

.easywoo-category-foundation .easywoo-swatch:hover {
    border-color: #b8941f;
    box-shadow: 0 4px 8px rgba(212, 175, 55, 0.5);
}

/* 口紅分類樣式 */
.easywoo-category-lipstick .easywoo-swatch {
    background: linear-gradient(135deg, #ff7675, #fd79a8);
    border: 2px solid #ff6b9d;
    box-shadow: 0 2px 4px rgba(255, 107, 157, 0.3);
}

.easywoo-category-lipstick .easywoo-swatch:hover {
    border-color: #e84393;
    box-shadow: 0 4px 8px rgba(255, 107, 157, 0.5);
    transform: translateY(-2px) scale(1.05);
}

/* 眼影分類樣式 */
.easywoo-category-eyeshadow .easywoo-swatch {
    background: linear-gradient(135deg, #a29bfe, #6c5ce7);
    border: 2px solid #8b5cf6;
    box-shadow: 0 2px 4px rgba(139, 92, 246, 0.3);
}

.easywoo-category-eyeshadow .easywoo-swatch:hover {
    border-color: #7c3aed;
    box-shadow: 0 0 15px rgba(139, 92, 246, 0.6);
}

/* 指甲油分類樣式 */
.easywoo-category-nail-polish .easywoo-swatch {
    background: linear-gradient(135deg, #fd79a8, #e84393);
    border: 2px solid #ec4899;
    box-shadow: 0 2px 4px rgba(236, 72, 153, 0.3);
}

.easywoo-category-nail-polish .easywoo-swatch:hover {
    border-color: #db2777;
    box-shadow: 0 4px 8px rgba(236, 72, 153, 0.5);
}

/* 腮紅分類樣式 */
.easywoo-category-blush .easywoo-swatch {
    background: linear-gradient(135deg, #fab1a0, #f472b6);
    border: 2px solid #f472b6;
    box-shadow: 0 2px 4px rgba(244, 114, 182, 0.3);
}

.easywoo-category-blush .easywoo-swatch:hover {
    border-color: #ec4899;
    box-shadow: 0 0 15px rgba(244, 114, 182, 0.6);
}

/* 遮瑕分類樣式 */
.easywoo-category-concealer .easywoo-swatch {
    background: linear-gradient(135deg, #fdcb6e, #f59e0b);
    border: 2px solid #f59e0b;
    box-shadow: 0 2px 4px rgba(245, 158, 11, 0.3);
}

.easywoo-category-concealer .easywoo-swatch:hover {
    border-color: #d97706;
    box-shadow: 0 4px 8px rgba(245, 158, 11, 0.5);
}

/* 色彩方案 */
.easywoo-warm {
    filter: sepia(0.3) saturate(1.2) hue-rotate(15deg);
}

.easywoo-vibrant {
    filter: saturate(1.4) contrast(1.1);
}

.easywoo-neutral {
    filter: saturate(0.8) brightness(1.1);
}

.easywoo-bright {
    filter: saturate(1.5) brightness(1.1) contrast(1.2);
}

.easywoo-soft {
    filter: saturate(0.9) brightness(1.2) blur(0.5px);
}

/* 特殊標記與分類的組合 */
.easywoo-category-foundation .easywoo-badge-hot {
    background: linear-gradient(135deg, #ff6b35, #f7931e);
}

.easywoo-category-lipstick .easywoo-badge-new {
    background: linear-gradient(135deg, #ff6b9d, #c44569);
}

.easywoo-category-eyeshadow .easywoo-badge-trending {
    background: linear-gradient(135deg, #8b5cf6, #5b21b6);
}

.easywoo-category-nail-polish .easywoo-badge-limited {
    background: linear-gradient(135deg, #ec4899, #be185d);
}

.easywoo-category-blush .easywoo-badge-bestseller {
    background: linear-gradient(135deg, #f472b6, #ec4899);
}

/* 響應式設計 */
@media (max-width: 768px) {
    .easywoo-category-foundation .easywoo-swatch,
    .easywoo-category-lipstick .easywoo-swatch,
    .easywoo-category-eyeshadow .easywoo-swatch,
    .easywoo-category-nail-polish .easywoo-swatch,
    .easywoo-category-blush .easywoo-swatch,
    .easywoo-category-concealer .easywoo-swatch {
        width: 35px !important;
        height: 35px !important;
        margin: 3px;
    }
}

@media (max-width: 480px) {
    .easywoo-category-foundation .easywoo-swatch,
    .easywoo-category-lipstick .easywoo-swatch,
    .easywoo-category-eyeshadow .easywoo-swatch,
    .easywoo-category-nail-polish .easywoo-swatch,
    .easywoo-category-blush .easywoo-swatch,
    .easywoo-category-concealer .easywoo-swatch {
        width: 30px !important;
        height: 30px !important;
        margin: 2px;
    }
}

/* 動畫效果 */
@keyframes easywoo-category-pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); }
    100% { transform: scale(1); }
}

.easywoo-category-foundation .easywoo-swatch.selected,
.easywoo-category-lipstick .easywoo-swatch.selected,
.easywoo-category-eyeshadow .easywoo-swatch.selected,
.easywoo-category-nail-polish .easywoo-swatch.selected,
.easywoo-category-blush .easywoo-swatch.selected,
.easywoo-category-concealer .easywoo-swatch.selected {
    animation: easywoo-category-pulse 1s ease-in-out infinite;
}

/* 分類標題樣式 */
.easywoo-category-title {
    font-weight: 600;
    color: #333;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
}

.easywoo-category-title::before {
    content: '';
    width: 4px;
    height: 20px;
    margin-right: 8px;
    border-radius: 2px;
}

.easywoo-category-foundation .easywoo-category-title::before {
    background: linear-gradient(135deg, #d4af37, #b8941f);
}

.easywoo-category-lipstick .easywoo-category-title::before {
    background: linear-gradient(135deg, #ff6b9d, #e84393);
}

.easywoo-category-eyeshadow .easywoo-category-title::before {
    background: linear-gradient(135deg, #8b5cf6, #7c3aed);
}

.easywoo-category-nail-polish .easywoo-category-title::before {
    background: linear-gradient(135deg, #ec4899, #db2777);
}

.easywoo-category-blush .easywoo-category-title::before {
    background: linear-gradient(135deg, #f472b6, #ec4899);
}

.easywoo-category-concealer .easywoo-category-title::before {
    background: linear-gradient(135deg, #f59e0b, #d97706);
}