/* Avokado E-Ticaret - Ana Stil */

:root {
    /* Avokado Renk Paleti */
    --avocado-dark: #2d5016;
    --avocado-medium: #4a7c2e;
    --avocado-green: #6b9b3a;
    --avocado-light: #8bc34a;
    --avocado-lime: #aed581;
    --avocado-cream: #f1f8e9;
    --avocado-yellow: #c5d86d;
    --avocado-brown: #5d4037;
    
    /* Gradientler */
    --primary-gradient: linear-gradient(135deg, #4a7c2e 0%, #6b9b3a 50%, #8bc34a 100%);
    --secondary-gradient: linear-gradient(135deg, #6b9b3a 0%, #c5d86d 100%);
    --success-gradient: linear-gradient(135deg, #2d5016 0%, #4a7c2e 100%);
    --dark-gradient: linear-gradient(135deg, #1b2e0f 0%, #2d5016 100%);
    --warm-gradient: linear-gradient(135deg, #6b9b3a 0%, #d4a574 100%);
    
    /* Ana Renkler */
    --primary-color: #4a7c2e;
    --primary-light: #6b9b3a;
    --secondary-color: #8bc34a;
    --accent-color: #c5d86d;
    --dark-color: #1b2e0f;
    --light-color: #f1f8e9;
    --gray-100: #f7faf5;
    --gray-200: #e8f5e9;
    --gray-300: #c8e6c9;
    --gray-600: #558b2f;
    --gray-800: #1b5e20;
    
    /* Efektler */
    --shadow-sm: 0 1px 3px 0 rgba(45, 80, 22, 0.1);
    --shadow-md: 0 4px 12px -2px rgba(45, 80, 22, 0.15), 0 2px 6px -1px rgba(45, 80, 22, 0.1);
    --shadow-lg: 0 12px 24px -4px rgba(45, 80, 22, 0.15), 0 6px 12px -2px rgba(45, 80, 22, 0.1);
    --shadow-xl: 0 24px 48px -6px rgba(45, 80, 22, 0.2), 0 12px 24px -4px rgba(45, 80, 22, 0.1);
    --shadow-glow: 0 0 25px rgba(107, 155, 58, 0.4);
    
    /* Border Radius */
    --radius-sm: 10px;
    --radius-md: 16px;
    --radius-lg: 24px;
    --radius-xl: 32px;
    --radius-full: 9999px;
    
    /* Geçişler */
    --transition-fast: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-normal: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-slow: 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    background: #ffffff;
    color: var(--avocado-dark);
    line-height: 1.6;
    overflow-x: hidden;
    margin: 0;
    padding: 0;
}

/* Header */
.header-main {
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-bottom: none;
    position: sticky;
    top: 0;
    z-index: 1000;
    box-shadow: none;
}

.top-banner {
    background: var(--primary-gradient);
    color: white;
    text-align: center;
    padding: 8px 12px;
    font-weight: 500;
    letter-spacing: 0.5px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
}

.top-banner-marquee {
    background: var(--primary-gradient);
    color: white;
}

/* Navbar */
.navbar-brand {
    font-weight: 800;
    font-size: 1.75rem;
    background: var(--primary-gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    letter-spacing: -1px;
}

.navbar-brand::before {
    content: '🥑 ';
    -webkit-text-fill-color: initial;
}

.nav-link {
    font-weight: 600;
    /* Cart and Favorites Badge */
    .cart-count, .favorites-count {
        font-size: 0.7rem !important;
        font-weight: 700 !important;
        padding: 0.3em 0.45em !important;
        min-width: 20px;
        min-height: 20px;
        display: flex !important;
        align-items: center;
        justify-content: center;
        z-index: 1050;
        border: 2px solid white;
        box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    }
    border-radius: var(--radius-md);
    transition: all var(--transition-fast);
    position: relative;
    display: flex;
    align-items: center;
    height: 100%;
}

.nav-link i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

.nav-link:hover {
    color: var(--primary-color) !important;
    background: rgba(74, 124, 46, 0.08);
}

.nav-link::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
    height: 2px;
    background: var(--primary-gradient);
    transition: all var(--transition-fast);
    transform: translateX(-50%);
}

/* Cart Badge */
.cart-count:not(.bg-danger) {
    background: var(--secondary-gradient);
    font-size: 0.65rem;
    min-width: 20px;
}
.cart-count {
    height: 20px;
    line-height: 20px;
    font-weight: 700;
    box-shadow: var(--shadow-md);
    animation: pulse 2s infinite;
    border: 2px solid white;
}

@keyframes pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.1); }
}

/* Main Content */
.main-content {
    min-height: calc(100vh - 400px);
    border: none;
}

/* Product Cards */
.product-card {
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(10px);
    border-radius: var(--radius-lg);
    overflow: hidden;
    transition: all var(--transition-normal);
    border: 1px solid rgba(255, 255, 255, 0.5);
    box-shadow: var(--shadow-md);
    position: relative;
    width: calc(100% - 10px);
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.product-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: var(--primary-gradient);
    transform: scaleX(0);
    transition: transform var(--transition-normal);
}

.product-card:hover {
    transform: translateY(-10px) scale(1.02);
    box-shadow: var(--shadow-xl);
}

.product-card:hover::before {
    transform: scaleX(1);
}

.product-card .product-image {
    position: relative;
    background: linear-gradient(135deg, var(--avocado-cream) 0%, var(--gray-200) 100%);
    height: 300px;
    width: 100%;
    overflow: hidden;
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
}

.product-card .product-image img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    display: block;
    transition: transform var(--transition-slow);
}

.product-card .product-info {
    padding: 1rem;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.product-card:hover .product-image img {
    transform: scale(1.1);
}

.discount-badge {
    position: absolute;
    top: 15px;
    left: 15px;
    background: linear-gradient(135deg, #d84315 0%, #ff5722 100%);
    color: white;
    padding: 8px 16px;
    border-radius: var(--radius-full);
    font-size: 0.8rem;
    font-weight: 700;
    box-shadow: var(--shadow-md);
    z-index: 2;
    animation: bounce 1s ease;
}

.new-badge {
    position: absolute;
    top: 15px;
    right: 15px;
    background: var(--success-gradient);
    color: white;
    padding: 8px 16px;
    border-radius: var(--radius-full);
    font-size: 0.8rem;
    font-weight: 700;
    box-shadow: var(--shadow-md);
    z-index: 2;
    border: 2px solid rgba(255,255,255,0.3);
}

.free-shipping-badge {
    position: absolute;
    right: 15px;
    bottom: 15px;
    background: linear-gradient(135deg, #d84315 0%, #ff5722 100%);
    color: #fff;
    padding: 8px 14px;
    border-radius: var(--radius-full);
    font-size: 0.78rem;
    font-weight: 800;
    box-shadow: var(--shadow-md);
    z-index: 2;
    border: 2px solid rgba(255,255,255,0.28);
    letter-spacing: 0.2px;
}

@keyframes bounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-5px); }
}

.favorite-btn {
    position: absolute;
    top: 15px;
    right: 15px;
    background: rgba(255, 255, 255, 0.95);
    border: none;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all var(--transition-fast);
    box-shadow: var(--shadow-md);
    z-index: 2;
}

.favorite-btn:hover {
    background: var(--secondary-gradient);
    color: white;
    transform: scale(1.1);
}

.favorite-btn.active {
    background: #dc3545;
    color: #fff;
}

.favorite-btn.active:hover {
    background: #c82333;
    color: #fff;
}

.product-card .product-desc {
    font-size: 0.85rem;
    color: var(--gray-600);
    margin: 0.25rem 0 0.75rem;
    line-height: 1.5;
    height: 3em;
    min-height: 3em;
    max-height: 3em;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    flex-shrink: 0;
}

.product-card .product-title {
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 0.75rem;
    color: var(--dark-color);
    text-decoration: none;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: color var(--transition-fast);
}

.product-card .product-title:hover {
    color: var(--avocado-medium);
}

.product-card .product-price {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    margin-bottom: 1rem;
    margin-top: auto;
    position: relative;
    padding-top: 22px;
}

.product-card .current-price {
    font-size: 1.25rem;
    font-weight: 800;
    background: var(--primary-gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.product-card .original-price {
    font-size: 0.9rem;
    color: #dc3545 !important;
    text-decoration: line-through;
    font-weight: 600;
    position: absolute;
    top: 0;
    right: 0;
    background: rgba(255,255,255,0.9);
    padding: 2px 6px;
    border-radius: 4px;
}

.product-card .unit-info {
    font-size: 0.9rem;
    font-weight: 800;
    background: var(--primary-gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    white-space: nowrap;
}

.product-card .add-to-cart {
    width: 100%;
    background: var(--primary-gradient);
    border: none;
    padding: 0.875rem;
    font-weight: 600;
    border-radius: var(--radius-md);
    color: white;
    transition: all var(--transition-fast);
    box-shadow: var(--shadow-md);
    margin-top: auto;
}

.row.g-3 {
    display: flex;
    flex-wrap: wrap;
}

.row.g-3 > [class*="col-"] {
    display: block;
}

.row.g-3 .product-card {
    width: 100%;
}

/* Product Rating - Sabit yükseklik */
.product-card .product-rating {
    min-height: 18px;
    flex-shrink: 0;
}

/* Home Slider */
.home-slider {
    border-radius: 0;
    overflow: hidden;
    box-shadow: none;
    margin: 0;
}

.home-slider .carousel-item {
    height: 500px;
    position: relative;
}

.home-slider .carousel-item img {
    object-fit: cover;
    height: 100%;
    transform: scale(1);
    transition: transform 6s ease;
}

.home-slider .carousel-item.active img {
    transform: scale(1.05);
}

/* Banner Animations */
.banner-fade {
    animation: bannerFade 0.8s ease;
}

.banner-slide-up {
    animation: bannerSlideUp 0.8s ease;
}

.banner-slide-left {
    animation: bannerSlideLeft 0.8s ease;
}

.banner-zoom {
    animation: bannerZoom 0.8s ease;
}

.banner-none {
    animation: none;
}

@keyframes marquee {
    0% { transform: translateX(100%); }
    100% { transform: translateX(-100%); }
}

.banner-marquee {
    animation: marquee 15s linear infinite;
    white-space: nowrap;
    display: inline-block;
}

.banner-marquee:hover {
    animation-play-state: paused;
}

@keyframes bannerSlideUp {
    from { 
        opacity: 0;
        transform: translateY(50px);
    }
    to { 
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes bannerSlideLeft {
    from { 
        opacity: 0;
        transform: translateX(-50px);
    }
    to { 
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes bannerZoom {
    from { 
        opacity: 0;
        transform: scale(1.1);
    }
    to { 
        opacity: 1;
        transform: scale(1);
    }
}

/* Caption Animations */
.caption-fade {
    animation: captionFade 0.6s ease;
}

/* Carousel Caption Base Styles */
.carousel-caption {
    position: absolute !important;
    z-index: 10;
    padding: 0 !important;
    margin: 0 !important;
    top: auto !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
}

/* Button Shine Animation */
.btn-shine {
    position: relative;
    overflow: hidden;
}

.btn-shine::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        90deg,
        transparent,
        rgba(255, 255, 255, 0.4),
        transparent
    );
    animation: shine 2s infinite;
}

@keyframes shine {
    0% { left: -100%; }
    100% { left: 100%; }
}

/* Section Titles */
.section-title {
    font-size: 2rem;
    font-weight: 800;
    position: relative;
    display: inline-block;
}

.section-title::after {
    content: '';
    position: absolute;
    bottom: -8px;
    left: 0;
    width: 60px;
    height: 4px;
    background: var(--primary-gradient);
    border-radius: var(--radius-full);
}

.section-title::before {
    content: '🥑';
    position: absolute;
    bottom: -12px;
    left: 70px;
    font-size: 0.8rem;
}

/* Modern Icon Styles */
.icon-wrapper {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: var(--radius-md);
    background: rgba(74, 124, 46, 0.1);
    transition: all var(--transition-fast);
}

.icon-wrapper:hover {
    background: var(--primary-gradient);
    color: white;
    transform: scale(1.1);
}

.icon-wrapper-lg {
    width: 56px;
    height: 56px;
    border-radius: var(--radius-lg);
}

.icon-pulse {
    animation: iconPulse 2s infinite;
}

@keyframes iconPulse {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.1); opacity: 0.8; }
}

.icon-bounce {
    animation: iconBounce 1s ease infinite;
}

@keyframes iconBounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-5px); }
}

.icon-spin {
    animation: iconSpin 3s linear infinite;
}

@keyframes iconSpin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.icon-glow {
    filter: drop-shadow(0 0 8px rgba(107, 155, 58, 0.5));
}

/* Feature Icons */
.feature-icon {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: var(--primary-gradient);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 2rem;
    margin-bottom: 1.5rem;
    box-shadow: var(--shadow-lg);
    position: relative;
}

.feature-icon::after {
    content: '';
    position: absolute;
    inset: -5px;
    border-radius: 50%;
    border: 2px dashed var(--avocado-lime);
    animation: rotate 20s linear infinite;
}

/* Category Icons */
.category-icon {
    font-size: 2.5rem;
    margin-bottom: 1rem;
    transition: all var(--transition-fast);
}

.category-card:hover .category-icon {
    transform: scale(1.2) rotate(5deg);
}

/* Service Icons */
.service-icon {
    width: 60px;
    height: 60px;
    background: var(--avocado-cream);
    border-radius: var(--radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--avocado-medium);
    font-size: 1.5rem;
    transition: all var(--transition-fast);
}

.service-item:hover .service-icon {
    background: var(--primary-gradient);
    color: white;
    transform: rotateY(360deg);
}

/* Social Icons */
.social-icon {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    transition: all var(--transition-fast);
    border: 2px solid transparent;
}

.social-icon:hover {
    background: var(--avocado-lime);
    color: var(--avocado-dark);
    transform: translateY(-3px);
    border-color: white;
}

/* Payment Icons */
.payment-icon {
    height: 40px;
    filter: grayscale(100%);
    opacity: 0.6;
    transition: all var(--transition-fast);
}

.payment-icon:hover {
    filter: grayscale(0%);
    opacity: 1;
}

/* Animated Menu Icon */
.menu-icon {
    position: relative;
    width: 24px;
    height: 2px;
    background: currentColor;
    transition: all var(--transition-fast);
}

.menu-icon::before,
.menu-icon::after {
    content: '';
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
    background: currentColor;
    transition: all var(--transition-fast);
}

.menu-icon::before { top: -8px; }
.menu-icon::after { top: 8px; }

/* Status Icons */
.status-icon {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
}

.status-icon.success {
    background: var(--success-gradient);
    color: white;
}

.status-icon.pending {
    background: linear-gradient(135deg, #ff9800 0%, #ffc107 100%);
    color: white;
}

.status-icon.error {
    background: linear-gradient(135deg, #d84315 0%, #ff5722 100%);
    color: white;
}

/* Cart Icon Special */
.cart-icon-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: rgba(74, 124, 46, 0.1);
    transition: all var(--transition-fast);
}

.cart-icon-wrapper:hover {
    background: var(--primary-gradient);
    color: white;
}

/* Floating Action Icons */
.fab-icon {
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: var(--primary-gradient);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    box-shadow: 0 8px 30px rgba(74, 124, 46, 0.4);
    cursor: pointer;
    transition: all var(--transition-fast);
    z-index: 999;
}

.fab-icon:hover {
    transform: scale(1.1) rotate(90deg);
    box-shadow: 0 12px 40px rgba(74, 124, 46, 0.5);
}

/* Rating Stars */
.rating-stars {
    color: #ffc107;
    display: flex;
    gap: 2px;
}

.rating-stars .star {
    transition: all var(--transition-fast);
}

.rating-stars .star:hover {
    transform: scale(1.3);
}

/* Product Card Icons */
.product-card .card-icon {
    position: absolute;
    top: 15px;
    right: 15px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.95);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--avocado-medium);
    cursor: pointer;
    transition: all var(--transition-fast);
    box-shadow: var(--shadow-md);
    z-index: 2;
}

.product-card .card-icon:hover {
    background: var(--secondary-gradient);
    color: white;
    transform: scale(1.15);
}

/* Benefit Icons */
.benefit-icon {
    width: 50px;
    height: 50px;
    border-radius: var(--radius-md);
    background: var(--avocado-cream);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--avocado-medium);
    margin-right: 1rem;
    flex-shrink: 0;
}

/* Step Icons */
.step-icon {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: var(--primary-gradient);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    position: relative;
}

.step-icon::before {
    content: '';
    position: absolute;
    inset: -8px;
    border-radius: 50%;
    border: 3px solid var(--avocado-lime);
    opacity: 0.5;
}

/* Empty State Icons */
.empty-state-icon {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: var(--avocado-cream);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.5rem;
    font-size: 3rem;
    color: var(--avocado-medium);
}

/* Notification Icon */
.notification-icon {
    position: relative;
    display: inline-flex;
}

.notification-icon .badge {
    position: absolute;
    top: -5px;
    right: -5px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--secondary-gradient);
    color: white;
    font-size: 0.7rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid white;
    animation: pulse 2s infinite;
}

/* Loading Icon */
.loading-icon {
    animation: iconSpin 1s linear infinite;
}

/* Heart Animation */
.heart-icon {
    transition: all var(--transition-fast);
}

.heart-icon.active {
    color: #e91e63;
    animation: heartBeat 0.5s ease;
}

@keyframes heartBeat {
    0%, 100% { transform: scale(1); }
    25% { transform: scale(1.3); }
    50% { transform: scale(1); }
    75% { transform: scale(1.3); }
}

/* Checkmark Animation */
.checkmark-icon {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: var(--success-gradient);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: checkmarkPop 0.5s ease;
}

@keyframes checkmarkPop {
    0% { transform: scale(0); opacity: 0; }
    50% { transform: scale(1.2); }
    100% { transform: scale(1); opacity: 1; }
}

/* Search Icon Enhancement */
.search-icon-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--primary-gradient);
    color: white;
    cursor: pointer;
    transition: all var(--transition-fast);
}

.search-icon-wrapper:hover {
    transform: scale(1.1);
    box-shadow: var(--shadow-glow);
}

/* Filter Icon */
.filter-icon {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0.5rem 1rem;
    background: var(--avocado-cream);
    border-radius: var(--radius-md);
    color: var(--avocado-medium);
    font-weight: 600;
    transition: all var(--transition-fast);
}

.filter-icon:hover {
    background: var(--primary-gradient);
    color: white;
}

/* Sort Icon */
.sort-icon {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    transition: all var(--transition-fast);
}

.sort-icon:hover {
    color: var(--avocado-medium);
}

/* Delivery Icon */
.delivery-icon {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    background: linear-gradient(135deg, rgba(139, 195, 74, 0.2) 0%, rgba(197, 216, 109, 0.2) 100%);
    border-radius: var(--radius-md);
    color: var(--avocado-medium);
    font-weight: 600;
}

/* Guarantee Icon */
.guarantee-icon {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 600;
    color: var(--avocado-medium);
}

.guarantee-icon i {
    color: var(--avocado-yellow);
}

/* Price Tag Icon */
.price-tag-icon {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.75rem;
    background: var(--secondary-gradient);
    color: white;
    border-radius: var(--radius-full);
    font-size: 0.85rem;
    font-weight: 700;
}

/* Share Icons */
.share-icon {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--gray-200);
    color: var(--gray-600);
    transition: all var(--transition-fast);
}

.share-icon:hover {
    background: var(--primary-gradient);
    color: white;
    transform: translateY(-3px);
}

/* Close Icon */
.close-icon {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.1);
    transition: all var(--transition-fast);
}

.close-icon:hover {
    background: rgba(216, 67, 21, 0.2);
    color: #d84315;
    transform: rotate(90deg);
}

/* Info Icon */
.info-icon {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--primary-gradient);
    color: white;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    cursor: help;
}

/* Menu Icons */
.menu-item-icon {
    width: 24px;
    margin-right: 0.75rem;
    color: var(--avocado-medium);
    transition: all var(--transition-fast);
}

.nav-link:hover .menu-item-icon {
    color: var(--avocado-green);
    transform: scale(1.2);
}

/* User Icon */
.user-icon-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    border-radius: var(--radius-full);
    background: var(--avocado-cream);
    color: var(--avocado-medium);
    transition: all var(--transition-fast);
}

.user-icon-wrapper:hover {
    background: var(--primary-gradient);
    color: white;
}

/* Arrow Icons */
.arrow-icon {
    transition: all var(--transition-fast);
}

.arrow-icon.right {
    transform: translateX(0);
}

.arrow-icon.right:hover {
    transform: translateX(5px);
}

.arrow-icon.left {
    transform: translateX(0);
}

.arrow-icon.left:hover {
    transform: translateX(-5px);
}

/* Badge Icons */
.badge-icon {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.5rem;
    background: var(--avocado-cream);
    border-radius: var(--radius-sm);
    color: var(--avocado-medium);
    font-size: 0.8rem;
    font-weight: 600;
}

/* Verified Icon */
.verified-icon {
    color: #1976d2;
    font-size: 1rem;
}

/* Security Icon */
.security-icon {
    color: var(--avocado-medium);
    font-size: 1.2rem;
}

/* Gift Icon */
.gift-icon {
    color: #e91e63;
    animation: giftWiggle 2s ease-in-out infinite;
}

@keyframes giftWiggle {
    0%, 100% { transform: rotate(-3deg); }
    50% { transform: rotate(3deg); }
}

/* Truck Icon */
.truck-icon {
    color: var(--avocado-medium);
}

.truck-icon.moving {
    animation: truckMove 2s ease-in-out infinite;
}

@keyframes truckMove {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(10px); }
}

/* Clock Icon */
.clock-icon {
    animation: clockTick 2s linear infinite;
}

@keyframes clockTick {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* Fire Icon (Trending) */
.fire-icon {
    color: #ff5722;
    animation: fireFlicker 1s ease-in-out infinite;
}

@keyframes fireFlicker {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.8; transform: scale(1.1); }
}

/* Sparkles Icon (New) */
.sparkles-icon {
    color: #ffc107;
    animation: sparkleShine 2s ease-in-out infinite;
}

@keyframes sparkleShine {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.6; }
}

/* Shield Icon */
.shield-icon {
    color: var(--avocado-medium);
}

/* Thumb Up Icon */
.thumb-icon {
    transition: all var(--transition-fast);
}

.thumb-icon:hover {
    color: var(--avocado-medium);
    transform: scale(1.2);
}

/* Message Icon */
.message-icon {
    position: relative;
}

.message-icon .dot {
    position: absolute;
    top: -2px;
    right: -2px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #ff5722;
    animation: messagePulse 2s infinite;
}

@keyframes messagePulse {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.5); opacity: 0.5; }
}

/* Phone Icon */
.phone-icon {
    animation: phoneShake 3s ease-in-out infinite;
}

@keyframes phoneShake {
    0%, 90%, 100% { transform: rotate(0deg); }
    92% { transform: rotate(10deg); }
    94% { transform: rotate(-10deg); }
    96% { transform: rotate(10deg); }
    98% { transform: rotate(-10deg); }
}

/* Mail Icon */
.mail-icon {
    transition: all var(--transition-fast);
}

.mail-icon:hover {
    color: var(--avocado-medium);
    transform: scale(1.1);
}

/* Location Icon */
.location-icon {
    color: #d84315;
    animation: locationBounce 2s ease-in-out infinite;
}

@keyframes locationBounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-5px); }
}

/* Credit Card Icon */
.card-icon {
    transition: all var(--transition-fast);
}

.card-icon:hover {
    color: var(--avocado-medium);
}

/* Wallet Icon */
.wallet-icon {
    color: var(--avocado-medium);
}

/* Percent Icon (Discount) */
.percent-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: linear-gradient(135deg, #ff5722 0%, #ff9800 100%);
    color: white;
    font-weight: 700;
    font-size: 0.8rem;
}

/* Tag Icon */
.tag-icon {
    display: inline-flex;
    align-items: center;
    color: var(--avocado-medium);
}

/* Award Icon */
.award-icon {
    color: #ffc107;
    font-size: 1.2rem;
}

/* Crown Icon (Premium) */
.crown-icon {
    color: #ffc107;
    animation: crownShine 2s ease-in-out infinite;
}

@keyframes crownShine {
    0%, 100% { filter: brightness(1); }
    50% { filter: brightness(1.3); }
}

/* Zap Icon (Flash Sale) */
.zap-icon {
    color: #ffeb3b;
    animation: zapFlash 0.5s ease-in-out infinite;
}

@keyframes zapFlash {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

/* Leaf Icon (Eco) */
.leaf-icon {
    color: var(--avocado-medium);
    animation: leafSway 3s ease-in-out infinite;
}

@keyframes leafSway {
    0%, 100% { transform: rotate(-5deg); }
    50% { transform: rotate(5deg); }
}

/* Recycle Icon */
.recycle-icon {
    color: var(--avocado-medium);
    animation: recycleSpin 4s linear infinite;
}

@keyframes recycleSpin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* Sun Icon */
.sun-icon {
    color: #ffc107;
    animation: sunRotate 10s linear infinite;
}

@keyframes sunRotate {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* Moon Icon */
.moon-icon {
    color: #9c27b0;
    animation: moonPhase 5s ease-in-out infinite;
}

@keyframes moonPhase {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

/* Star Icon */
.star-icon {
    color: #ffc107;
    transition: all var(--transition-fast);
}

.star-icon:hover {
    transform: scale(1.3) rotate(72deg);
}

/* Bell Icon */
.bell-icon {
    animation: bellRing 2s ease-in-out infinite;
}

@keyframes bellRing {
    0%, 90%, 100% { transform: rotate(0deg); }
    92% { transform: rotate(15deg); }
    94% { transform: rotate(-15deg); }
    96% { transform: rotate(15deg); }
}

/* Camera Icon */
.camera-icon {
    transition: all var(--transition-fast);
}

.camera-icon:hover {
    color: var(--avocado-medium);
    transform: scale(1.1);
}

/* Video Icon */
.video-icon {
    color: #d84315;
}

/* Music Icon */
.music-icon {
    color: #9c27b0;
    animation: musicBounce 1s ease-in-out infinite;
}

@keyframes musicBounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-3px); }
}

/* Mic Icon */
.mic-icon {
    animation: micPulse 2s ease-in-out infinite;
}

@keyframes micPulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.1); }
}

/* Headphones Icon */
.headphones-icon {
    color: var(--avocado-medium);
}

/* Printer Icon */
.printer-icon {
    transition: all var(--transition-fast);
}

.printer-icon:hover {
    color: var(--avocado-medium);
}

/* Scanner Icon */
.scanner-icon {
    animation: scannerMove 2s ease-in-out infinite;
}

@keyframes scannerMove {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(5px); }
}

/* Barcode Icon */
.barcode-icon {
    font-family: monospace;
    letter-spacing: 2px;
}

/* QR Code Icon */
.qr-icon {
    color: var(--avocado-dark);
}

/* Bluetooth Icon */
.bluetooth-icon {
    color: #2196f3;
    animation: bluetoothPulse 2s ease-in-out infinite;
}

@keyframes bluetoothPulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

/* WiFi Icon */
.wifi-icon {
    color: var(--avocado-medium);
    animation: wifiSignal 2s ease-in-out infinite;
}

@keyframes wifiSignal {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

/* Battery Icon */
.battery-icon {
    color: var(--avocado-medium);
}

.battery-icon.low {
    color: #ff5722;
    animation: batteryLow 1s ease-in-out infinite;
}

@keyframes batteryLow {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

/* Thermometer Icon */
.thermometer-icon {
    color: #ff5722;
}

/* Cloud Icon */
.cloud-icon {
    color: #90caf9;
    animation: cloudFloat 3s ease-in-out infinite;
}

@keyframes cloudFloat {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(10px); }
}

/* Rain Icon */
.rain-icon {
    color: #64b5f6;
    animation: rainFall 1s linear infinite;
}

@keyframes rainFall {
    0% { transform: translateY(0); opacity: 1; }
    100% { transform: translateY(10px); opacity: 0; }
}

/* Snow Icon */
.snow-icon {
    color: #90caf9;
    animation: snowFall 3s linear infinite;
}

@keyframes snowFall {
    0% { transform: translateY(0) rotate(0deg); }
    100% { transform: translateY(20px) rotate(360deg); }
}

/* Wind Icon */
.wind-icon {
    color: #90caf9;
    animation: windBlow 2s ease-in-out infinite;
}

@keyframes windBlow {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(5px); }
}

/* Umbrella Icon */
.umbrella-icon {
    color: #2196f3;
}

/* Map Icon */
.map-icon {
    color: #d84315;
}

/* Globe Icon */
.globe-icon {
    color: var(--avocado-medium);
    animation: globeRotate 10s linear infinite;
}

@keyframes globeRotate {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* Flag Icon */
.flag-icon {
    color: #d84315;
    animation: flagWave 2s ease-in-out infinite;
}

@keyframes flagWave {
    0%, 100% { transform: skewX(0deg); }
    50% { transform: skewX(5deg); }
}

/* Bookmark Icon */
.bookmark-icon {
    color: #ffc107;
    transition: all var(--transition-fast);
}

.bookmark-icon:hover {
    transform: scale(1.2);
    color: #ff9800;
}

/* Flag Icon (Pin) */
.pin-icon {
    color: #d84315;
    animation: pinBounce 1s ease-in-out infinite;
}

@keyframes pinBounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-5px); }
}

/* Layers Icon */
.layers-icon {
    color: var(--avocado-medium);
}

/* Grid Icon */
.grid-icon {
    color: var(--avocado-medium);
}

/* List Icon */
.list-icon {
    color: var(--avocado-medium);
}

/* Table Icon */
.table-icon {
    color: var(--avocado-medium);
}

/* Columns Icon */
.columns-icon {
    color: var(--avocado-medium);
}

/* Rows Icon */
.rows-icon {
    color: var(--avocado-medium);
}

/* Split Icon */
.split-icon {
    color: var(--avocado-medium);
}

/* Maximize Icon */
.maximize-icon {
    transition: all var(--transition-fast);
}

.maximize-icon:hover {
    color: var(--avocado-medium);
    transform: scale(1.1);
}

/* Minimize Icon */
.minimize-icon {
    transition: all var(--transition-fast);
}

.minimize-icon:hover {
    color: var(--avocado-medium);
}

/* External Link Icon */
.external-link-icon {
    transition: all var(--transition-fast);
}

.external-link-icon:hover {
    color: var(--avocado-medium);
    transform: translate(2px, -2px);
}

/* Link Icon */
.link-icon {
    color: var(--avocado-medium);
    transition: all var(--transition-fast);
}

.link-icon:hover {
    transform: rotate(45deg);
}

/* Unlink Icon */
.unlink-icon {
    color: #9e9e9e;
}

/* Anchor Icon */
.anchor-icon {
    color: var(--avocado-medium);
    animation: anchorSink 3s ease-in-out infinite;
}

@keyframes anchorSink {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(5px); }
}

/* Feather Icon */
.feather-icon {
    color: var(--avocado-medium);
    animation: featherFloat 3s ease-in-out infinite;
}

@keyframes featherFloat {
    0%, 100% { transform: translateY(0) rotate(-5deg); }
    50% { transform: translateY(-10px) rotate(5deg); }
}

/* Pen Tool Icon */
.pen-tool-icon {
    color: var(--avocado-medium);
    transition: all var(--transition-fast);
}

.pen-tool-icon:hover {
    transform: rotate(-15deg);
}

/* Brush Icon */
.brush-icon {
    color: #9c27b0;
    animation: brushStroke 2s ease-in-out infinite;
}

@keyframes brushStroke {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(10px); }
}

/* Eraser Icon */
.eraser-icon {
    color: #9e9e9e;
    transition: all var(--transition-fast);
}

.eraser-icon:hover {
    transform: scale(0.9);
}

/* Scissors Icon */
.scissors-icon {
    color: var(--avocado-medium);
    animation: scissorsCut 1s ease-in-out infinite;
}

@keyframes scissorsCut {
    0%, 100% { transform: rotate(0deg); }
    50% { transform: rotate(15deg); }
}

/* Ruler Icon */
.ruler-icon {
    color: var(--avocado-medium);
}

/* Compass Icon */
.compass-icon {
    color: var(--avocado-medium);
    animation: compassPoint 4s ease-in-out infinite;
}

@keyframes compassPoint {
    0%, 100% { transform: rotate(0deg); }
    25% { transform: rotate(45deg); }
    50% { transform: rotate(90deg); }
    75% { transform: rotate(45deg); }
}

/* Square Icon */
.square-icon {
    transition: all var(--transition-fast);
}

.square-icon:hover {
    color: var(--avocado-medium);
    transform: rotate(45deg);
}

/* Circle Icon */
.circle-icon {
    transition: all var(--transition-fast);
}

.circle-icon:hover {
    color: var(--avocado-medium);
    transform: scale(1.2);
}

/* Triangle Icon */
.triangle-icon {
    color: #ffc107;
    animation: triangleSpin 3s linear infinite;
}

@keyframes triangleSpin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* Pentagon Icon */
.pentagon-icon {
    color: var(--avocado-medium);
}

/* Hexagon Icon */
.hexagon-icon {
    color: var(--avocado-medium);
    animation: hexagonPulse 3s ease-in-out infinite;
}

@keyframes hexagonPulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.1); }
}

/* Octagon Icon */
.octagon-icon {
    color: var(--avocado-medium);
}

/* Star Icon (Polygon) */
.polygon-icon {
    color: #ffc107;
    animation: polygonMorph 3s ease-in-out infinite;
}

@keyframes polygonMorph {
    0%, 100% { transform: rotate(0deg) scale(1); }
    50% { transform: rotate(180deg) scale(1.1); }
}

/* Command Icon */
.command-icon {
    color: var(--avocado-medium);
}

/* Option Icon */
.option-icon {
    color: var(--avocado-medium);
}

/* Shift Icon */
.shift-icon {
    color: var(--avocado-medium);
}

/* Control Icon */
.control-icon {
    color: var(--avocado-medium);
}

/* Alt Icon */
.alt-icon {
    color: var(--avocado-medium);
}

/* Caps Lock Icon */
.caps-lock-icon {
    color: #ff9800;
}

/* Review Images */
.review-images {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.review-images a {
    display: block;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid #dee2e6;
}

.review-images img {
    width: 80px;
    height: 80px;
    object-fit: cover;
    transition: transform 0.2s;
}

.review-images a:hover img {
    transform: scale(1.05);
}

/* Quantity Selector - Product Detail */
.quantity-wrapper {
    display: inline-flex;
    align-items: center;
    border-radius: 4px;
    overflow: hidden;
}

.quantity-wrapper .btn {
    border: none;
    background: #f8f9fa;
    padding: 0.5rem 0.75rem;
    font-size: 1rem;
    line-height: 1;
    color: #495057;
}

.quantity-wrapper .btn:hover {
    background: #e9ecef;
}

.quantity-wrapper .quantity-input {
    border: none;
    border-left: 1px solid #dee2e6;
    border-right: 1px solid #dee2e6;
    width: 50px !important;
    text-align: center;
    font-weight: 600;
    padding: 0.5rem;
    background: white;
}

.quantity-wrapper .quantity-input:focus {
    outline: none;
    box-shadow: none;
}

/* Remove number input arrows */
.quantity-input::-webkit-outer-spin-button,
.quantity-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.quantity-input[type=number] {
    -moz-appearance: textfield;
    appearance: textfield;
}

/* Product Meta Info */
.product-meta {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #dee2e6;
}

.meta-item {
    margin-bottom: 0.5rem;
    font-size: 0.9rem;
}

.meta-label {
    color: #6c757d;
    font-weight: 500;
}

.meta-value {
    color: #212529;
}

.meta-value a {
    color: var(--avocado-medium);
    text-decoration: none;
}

.meta-value a:hover {
    text-decoration: underline;
}

/* Product Share */
.product-share {
    padding-top: 1rem;
    border-top: 1px solid #dee2e6;
}

.product-share a {
    font-size: 1.2rem;
    transition: color 0.2s;
}

.product-share a:hover {
    color: var(--avocado-medium) !important;
}

/* Num Lock Icon */
.num-lock-icon {
    color: #2196f3;
}

/* Scroll Lock Icon */
.scroll-lock-icon {
    color: #9c27b0;
}

/* Play Icon */
.play-icon {
    color: var(--avocado-medium);
    transition: all var(--transition-fast);
}

.play-icon:hover {
    transform: scale(1.2);
    color: var(--avocado-green);
}

/* Pause Icon */
.pause-icon {
    color: #ff9800;
}

/* Stop Icon */
.stop-icon {
    color: #d84315;
}

/* Skip Forward Icon */
.skip-forward-icon {
    color: var(--avocado-medium);
    transition: all var(--transition-fast);
}

.skip-forward-icon:hover {
    transform: translateX(5px);
}

/* Skip Back Icon */
.skip-back-icon {
    color: var(--avocado-medium);
    transition: all var(--transition-fast);
}

.skip-back-icon:hover {
    transform: translateX(-5px);
}

/* Shuffle Icon */
.shuffle-icon {
    color: #9c27b0;
    animation: shuffleRandom 2s ease-in-out infinite;
}

@keyframes shuffleRandom {
    0%, 100% { transform: rotate(0deg); }
    25% { transform: rotate(10deg); }
    50% { transform: rotate(-10deg); }
    75% { transform: rotate(5deg); }
}

/* Repeat Icon */
.repeat-icon {
    color: #2196f3;
    animation: repeatLoop 3s linear infinite;
}

@keyframes repeatLoop {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* Volume Icon */
.volume-icon {
    color: var(--avocado-medium);
}

.volume-icon.mute {
    color: #9e9e9e;
}

/* Mic Off Icon */
.mic-off-icon {
    color: #9e9e9e;
}

/* Video Off Icon */
.video-off-icon {
    color: #9e9e9e;
}

/* Phone Off Icon */
.phone-off-icon {
    color: #9e9e9e;
}

/* Wifi Off Icon */
.wifi-off-icon {
    color: #9e9e9e;
}

/* Bluetooth Off Icon */
.bluetooth-off-icon {
    color: #9e9e9e;
}

/* Airplane Icon */
.airplane-icon {
    color: var(--avocado-medium);
    animation: airplaneFly 3s ease-in-out infinite;
}

@keyframes airplaneFly {
    0%, 100% { transform: translateX(0) translateY(0); }
    50% { transform: translateX(20px) translateY(-10px); }
}

/* Rocket Icon */
.rocket-icon {
    color: #d84315;
    animation: rocketLaunch 2s ease-in-out infinite;
}

@keyframes rocketLaunch {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-20px); }
}

/* Ship Icon */
.ship-icon {
    color: #2196f3;
    animation: shipSail 4s ease-in-out infinite;
}

@keyframes shipSail {
    0%, 100% { transform: translateX(0) rotate(0deg); }
    25% { transform: translateX(10px) rotate(2deg); }
    50% { transform: translateX(0) rotate(0deg); }
    75% { transform: translateX(-10px) rotate(-2deg); }
}

/* Train Icon */
.train-icon {
    color: var(--avocado-medium);
    animation: trainMove 3s ease-in-out infinite;
}

@keyframes trainMove {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(30px); }
}

/* Bus Icon */
.bus-icon {
    color: var(--avocado-medium);
    animation: busBounce 2s ease-in-out infinite;
}

@keyframes busBounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-3px); }
}

/* Car Icon */
.car-icon {
    color: var(--avocado-medium);
    animation: carDrive 4s ease-in-out infinite;
}

@keyframes carDrive {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(50px); }
}

/* Bike Icon */
.bike-icon {
    color: var(--avocado-medium);
    animation: bikePedal 2s ease-in-out infinite;
}

@keyframes bikePedal {
    0%, 100% { transform: rotate(0deg); }
    50% { transform: rotate(10deg); }
}

/* Walk Icon */
.walk-icon {
    color: var(--avocado-medium);
    animation: walkStep 1s ease-in-out infinite;
}

@keyframes walkStep {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(5px); }
}

/* Run Icon */
.run-icon {
    color: #d84315;
    animation: runFast 0.5s ease-in-out infinite;
}

@keyframes runFast {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(10px); }
}

/* Swim Icon */
.swim-icon {
    color: #2196f3;
    animation: swimStroke 2s ease-in-out infinite;
}

@keyframes swimStroke {
    0%, 100% { transform: translateX(0) rotate(0deg); }
    50% { transform: translateX(20px) rotate(10deg); }
}

/* Yoga Icon */
.yoga-icon {
    color: #9c27b0;
    animation: yogaPose 4s ease-in-out infinite;
}

@keyframes yogaPose {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.05); }
}

/* Dumbbell Icon */
.dumbbell-icon {
    color: #607d8b;
    animation: dumbbellLift 2s ease-in-out infinite;
}

@keyframes dumbbellLift {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-10px); }
}

/* Trophy Icon */
.trophy-icon {
    color: #ffc107;
    animation: trophyShine 3s ease-in-out infinite;
}

@keyframes trophyShine {
    0%, 100% { filter: brightness(1); }
    50% { filter: brightness(1.5); }
}

/* Medal Icon */
.medal-icon {
    color: #607d8b;
    animation: medalSwing 2s ease-in-out infinite;
}

@keyframes medalSwing {
    0%, 100% { transform: rotate(-5deg); }
    50% { transform: rotate(5deg); }
}

/* Ribbon Icon */
.ribbon-icon {
    color: #e91e63;
    animation: ribbonWave 3s ease-in-out infinite;
}

@keyframes ribbonWave {
    0%, 100% { transform: skewX(0deg); }
    50% { transform: skewX(10deg); }
}

/* Target Icon */
.target-icon {
    color: #d84315;
    animation: targetFocus 2s ease-in-out infinite;
}

@keyframes targetFocus {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.1); }
}

/* Dart Icon */
.dart-icon {
    color: #d84315;
    animation: dartThrow 1s ease-in infinite;
}

@keyframes dartThrow {
    0% { transform: translateX(0) translateY(0); opacity: 1; }
    100% { transform: translateX(100px) translateY(-50px); opacity: 0; }
}

/* Puzzle Icon */
.puzzle-icon {
    color: var(--avocado-medium);
    animation: puzzleConnect 3s ease-in-out infinite;
}

@keyframes puzzleConnect {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(5px); }
}

/* Chess Icon */
.chess-icon {
    color: #607d8b;
    animation: chessMove 4s ease-in-out infinite;
}

@keyframes chessMove {
    0%, 100% { transform: translate(0, 0); }
    25% { transform: translate(10px, 0); }
    50% { transform: translate(10px, 10px); }
    75% { transform: translate(0, 10px); }
}

/* Dice Icon */
.dice-icon {
    color: #607d8b;
    animation: diceRoll 1s ease-in-out infinite;
}

@keyframes diceRoll {
    0%, 100% { transform: rotate(0deg); }
    50% { transform: rotate(360deg); }
}

/* Cards Icon */
.cards-icon {
    color: #d84315;
    animation: cardsShuffle 2s ease-in-out infinite;
}

@keyframes cardsShuffle {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(10px); }
}

/* Ball Icon */
.ball-icon {
    color: #ff9800;
    animation: ballBounce 1s ease-in-out infinite;
}

@keyframes ballBounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-20px); }
}

/* Flag Icon (Corner) */
.corner-flag-icon {
    color: #d84315;
    animation: cornerFlagWave 2s ease-in-out infinite;
}

@keyframes cornerFlagWave {
    0%, 100% { transform: rotate(0deg); }
    50% { transform: rotate(10deg); }
}

/* Timer Icon */
.timer-icon {
    color: #ff9800;
    animation: timerTick 1s linear infinite;
}

@keyframes timerTick {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

/* Stopwatch Icon */
.stopwatch-icon {
    color: #d84315;
    animation: stopwatchRun 0.1s linear infinite;
}

@keyframes stopwatchRun {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(6deg); }
}

/* Hourglass Icon */
.hourglass-icon {
    color: #607d8b;
    animation: hourglassFlow 3s ease-in-out infinite;
}

@keyframes hourglassFlow {
    0%, 100% { transform: rotate(0deg); }
    50% { transform: rotate(180deg); }
}

/* Watch Icon */
.watch-icon {
    color: var(--avocado-medium);
    animation: watchTick 1s linear infinite;
}

/* Calendar Icon */
.calendar-icon {
    color: var(--avocado-medium);
}

/* Clock Icon (Alarm) */
.alarm-icon {
    color: #d84315;
    animation: alarmRing 0.5s ease-in-out infinite;
}

@keyframes alarmRing {
    0%, 100% { transform: rotate(0deg); }
    25% { transform: rotate(10deg); }
    75% { transform: rotate(-10deg); }
}

/* Calendar Check Icon */
.calendar-check-icon {
    color: var(--avocado-medium);
}

/* Calendar Plus Icon */
.calendar-plus-icon {
    color: #2196f3;
}

/* Calendar Minus Icon */
.calendar-minus-icon {
    color: #ff9800;
}

/* Calendar X Icon */
.calendar-x-icon {
    color: #d84315;
}

/* Clipboard Icon */
.clipboard-icon {
    color: var(--avocado-medium);
}

/* Clipboard Check Icon */
.clipboard-check-icon {
    color: var(--avocado-medium);
}

/* Clipboard Plus Icon */
.clipboard-plus-icon {
    color: #2196f3;
}

/* Clipboard Minus Icon */
.clipboard-minus-icon {
    color: #ff9800;
}

/* Clipboard X Icon */
.clipboard-x-icon {
    color: #d84315;
}

/* File Icon */
.file-icon {
    color: #607d8b;
}

/* File Plus Icon */
.file-plus-icon {
    color: #2196f3;
}

/* File Minus Icon */
.file-minus-icon {
    color: #ff9800;
}

/* File X Icon */
.file-x-icon {
    color: #d84315;
}

/* File Check Icon */
.file-check-icon {
    color: var(--avocado-medium);
}

/* Folder Icon */
.folder-icon {
    color: #ff9800;
}

/* Folder Plus Icon */
.folder-plus-icon {
    color: #2196f3;
}

/* Folder Minus Icon */
.folder-minus-icon {
    color: #ff9800;
}

/* Folder X Icon */
.folder-x-icon {
    color: #d84315;
}

/* Folder Open Icon */
.folder-open-icon {
    color: #ff9800;
    animation: folderOpen 0.5s ease-out;
}

@keyframes folderOpen {
    0% { transform: scale(1); }
    50% { transform: scale(1.1); }
    100% { transform: scale(1); }
}

/* Image Icon */
.image-icon {
    color: #9c27b0;
}

/* Images Icon */
.images-icon {
    color: #9c27b0;
}

/* File Image Icon */
.file-image-icon {
    color: #9c27b0;
}

/* File Text Icon */
.file-text-icon {
    color: #607d8b;
}

/* File Code Icon */
.file-code-icon {
    color: #2196f3;
}

/* File Spreadsheet Icon */
.file-spreadsheet-icon {
    color: #4caf50;
}

/* File Presentation Icon */
.file-presentation-icon {
    color: #ff9800;
}

/* File Video Icon */
.file-video-icon {
    color: #d84315;
}

/* File Audio Icon */
.file-audio-icon {
    color: #9c27b0;
}

/* File Archive Icon */
.file-archive-icon {
    color: #607d8b;
}

/* File Pdf Icon */
.file-pdf-icon {
    color: #d84315;
}

/* File Word Icon */
.file-word-icon {
    color: #2196f3;
}

/* File Excel Icon */
.file-excel-icon {
    color: #4caf50;
}

/* File Powerpoint Icon */
.file-powerpoint-icon {
    color: #ff9800;
}

/* Archive Icon */
.archive-icon {
    color: #607d8b;
}

/* Inbox Icon */
.inbox-icon {
    color: var(--avocado-medium);
    animation: inboxReceive 2s ease-in-out infinite;
}

@keyframes inboxReceive {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-5px); }
}

/* Send Icon */
.send-icon {
    color: #2196f3;
    animation: sendFly 1s ease-in infinite;
}

@keyframes sendFly {
    0% { transform: translateX(0) translateY(0); opacity: 1; }
    100% { transform: translateX(50px) translateY(-50px); opacity: 0; }
}

/* Mail Open Icon */
.mail-open-icon {
    color: var(--avocado-medium);
}

/* Mail Plus Icon */
.mail-plus-icon {
    color: #2196f3;
}

/* Mail Minus Icon */
.mail-minus-icon {
    color: #ff9800;
}

/* Mail X Icon */
.mail-x-icon {
    color: #d84315;
}

/* Mail Check Icon */
.mail-check-icon {
    color: var(--avocado-medium);
}

/* Mail Question Icon */
.mail-question-icon {
    color: #ff9800;
}

/* Mail Warning Icon */
.mail-warning-icon {
    color: #ff9800;
}

/* Mail Info Icon */
.mail-info-icon {
    color: #2196f3;
}

/* Reply Icon */
.reply-icon {
    color: var(--avocado-medium);
    animation: replyBack 1s ease-in-out infinite;
}

@keyframes replyBack {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(-5px); }
}

/* Reply All Icon */
.reply-all-icon {
    color: var(--avocado-medium);
}

/* Forward Icon */
.forward-icon {
    color: #2196f3;
    animation: forwardGo 1s ease-in-out infinite;
}

@keyframes forwardGo {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(5px); }
}

/* Trash Icon */
.trash-icon {
    color: #d84315;
    transition: all var(--transition-fast);
}

.trash-icon:hover {
    color: #b71c1c;
    transform: shake 0.5s ease-in-out;
}

@keyframes shake {
    0%, 100% { transform: rotate(0deg); }
    25% { transform: rotate(-10deg); }
    75% { transform: rotate(10deg); }
}

/* Trash 2 Icon */
.trash-2-icon {
    color: #d84315;
}

/* Delete Icon */
.delete-icon {
    color: #d84315;
    animation: deleteWobble 0.5s ease-in-out;
}

@keyframes deleteWobble {
    0%, 100% { transform: rotate(0deg); }
    25% { transform: rotate(-15deg); }
    75% { transform: rotate(15deg); }
}

/* Edit Icon */
.edit-icon {
    color: #2196f3;
    transition: all var(--transition-fast);
}

.edit-icon:hover {
    color: #1976d2;
    transform: rotate(-15deg);
}

/* Edit 2 Icon */
.edit-2-icon {
    color: #2196f3;
}

/* Edit 3 Icon */
.edit-3-icon {
    color: #2196f3;
}

/* Copy Icon */
.copy-icon {
    color: var(--avocado-medium);
    transition: all var(--transition-fast);
}

.copy-icon:hover {
    transform: scale(1.1);
}

/* Cut Icon */
.cut-icon {
    color: #d84315;
}

/* Paste Icon */
.paste-icon {
    color: var(--avocado-medium);
}

/* Save Icon */
.save-icon {
    color: var(--avocado-medium);
    animation: saveBounce 1s ease-in-out infinite;
}

@keyframes saveBounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-3px); }
}

/* Download Icon */
.download-icon {
    color: #2196f3;
    animation: downloadMove 1s ease-in-out infinite;
}

@keyframes downloadMove {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(5px); }
}

/* Upload Icon */
.upload-icon {
    color: var(--avocado-medium);
    animation: uploadMove 1s ease-in-out infinite;
}

@keyframes uploadMove {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-5px); }
}

/* Cloud Download Icon */
.cloud-download-icon {
    color: #2196f3;
}

/* Cloud Upload Icon */
.cloud-upload-icon {
    color: var(--avocado-medium);
}

/* Import Icon */
.import-icon {
    color: #2196f3;
}

/* Export Icon */
.export-icon {
    color: var(--avocado-medium);
}

/* Log In Icon */
.log-in-icon {
    color: var(--avocado-medium);
    animation: logInDoor 1s ease-in-out infinite;
}

@keyframes logInDoor {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(3px); }
}

/* Log Out Icon */
.log-out-icon {
    color: #d84315;
    animation: logOutDoor 1s ease-in-out infinite;
}

@keyframes logOutDoor {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(-3px); }
}

/* User Icon */
.user-icon {
    color: var(--avocado-medium);
}

/* User Plus Icon */
.user-plus-icon {
    color: #2196f3;
}

/* User Minus Icon */
.user-minus-icon {
    color: #ff9800;
}

/* User X Icon */
.user-x-icon {
    color: #d84315;
}

/* User Check Icon */
.user-check-icon {
    color: var(--avocado-medium);
}

/* Users Icon */
.users-icon {
    color: var(--avocado-medium);
}

/* User Circle Icon */
.user-circle-icon {
    color: var(--avocado-medium);
}

/* User Square Icon */
.user-square-icon {
    color: var(--avocado-medium);
}

/* Contact Icon */
.contact-icon {
    color: var(--avocado-medium);
}

/* Contacts Icon */
.contacts-icon {
    color: var(--avocado-medium);
}

/* Address Book Icon */
.address-book-icon {
    color: var(--avocado-medium);
}

/* Id Card Icon */
.id-card-icon {
    color: var(--avocado-medium);
}

/* Badge Icon */
.badge-icon {
    color: #ffc107;
}

/* Key Icon */
.key-icon {
    color: #ff9800;
    animation: keyTurn 2s ease-in-out infinite;
}

@keyframes keyTurn {
    0%, 100% { transform: rotate(0deg); }
    50% { transform: rotate(45deg); }
}

/* Lock Icon */
.lock-icon {
    color: var(--avocado-medium);
}

/* Unlock Icon */
.unlock-icon {
    color: #d84315;
}

/* Eye Icon */
.eye-icon {
    color: var(--avocado-medium);
}

/* Eye Off Icon */
.eye-off-icon {
    color: #9e9e9e;
}

/* Fingerprint Icon */
.fingerprint-icon {
    color: var(--avocado-medium);
    animation: fingerprintScan 2s ease-in-out infinite;
}

@keyframes fingerprintScan {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

/* Scan Icon */
.scan-icon {
    color: var(--avocado-medium);
    animation: scanLine 2s ease-in-out infinite;
}

@keyframes scanLine {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(10px); }
}

/* Scan Face Icon */
.scan-face-icon {
    color: var(--avocado-medium);
}

/* Scan Line Icon */
.scan-line-icon {
    color: var(--avocado-medium);
    animation: scanMove 2s ease-in-out infinite;
}

/* Shopping Bag Icon */
.shopping-bag-icon {
    color: var(--avocado-medium);
}

/* Shopping Cart Icon */
.shopping-cart-icon {
    color: var(--avocado-medium);
}

/* Store Icon */
.store-icon {
    color: var(--avocado-medium);
}

/* Home Icon */
.home-icon {
    color: var(--avocado-medium);
}

/* Building Icon */
.building-icon {
    color: #607d8b;
}

/* Building 2 Icon */
.building-2-icon {
    color: #607d8b;
}

/* Factory Icon */
.factory-icon {
    color: #607d8b;
}

/* Warehouse Icon */
.warehouse-icon {
    color: #607d8b;
}

/* Hospital Icon */
.hospital-icon {
    color: #d84315;
}

/* Bank Icon */
.bank-icon {
    color: #607d8b;
}

/* Landmark Icon */
.landmark-icon {
    color: #607d8b;
}

/* Castle Icon */
.castle-icon {
    color: #607d8b;
}

/* Church Icon */
.church-icon {
    color: #607d8b;
}

/* School Icon */
.school-icon {
    color: #2196f3;
}

/* University Icon */
.university-icon {
    color: #2196f3;
}

/* Library Icon */
.library-icon {
    color: #607d8b;
}

/* Museum Icon */
.museum-icon {
    color: #607d8b;
}

/* Theater Icon */
.theater-icon {
    color: #9c27b0;
}

/* Cinema Icon */
.cinema-icon {
    color: #9c27b0;
}

/* Stadium Icon */
.stadium-icon {
    color: #4caf50;
}

/* Gym Icon */
.gym-icon {
    color: #d84315;
}

/* Pool Icon */
.pool-icon {
    color: #2196f3;
}

/* Park Icon */
.park-icon {
    color: var(--avocado-medium);
}

/* Garden Icon */
.garden-icon {
    color: var(--avocado-medium);
}

/* Tree Icon */
.tree-icon {
    color: var(--avocado-medium);
    animation: treeSway 4s ease-in-out infinite;
}

@keyframes treeSway {
    0%, 100% { transform: rotate(-2deg); }
    50% { transform: rotate(2deg); }
}

/* Flower Icon */
.flower-icon {
    color: #e91e63;
    animation: flowerBloom 3s ease-in-out infinite;
}

@keyframes flowerBloom {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.1); }
}

/* Sprout Icon */
.sprout-icon {
    color: var(--avocado-medium);
    animation: sproutGrow 3s ease-in-out infinite;
}

@keyframes sproutGrow {
    0%, 100% { transform: scale(1) translateY(0); }
    50% { transform: scale(1.05) translateY(-5px); }
}

/* Seed Icon */
.seed-icon {
    color: #795548;
}

/* Plant Icon */
.plant-icon {
    color: var(--avocado-medium);
    animation: plantGrow 4s ease-in-out infinite;
}

@keyframes plantGrow {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.1); }
}

/* Tree Pine Icon */
.tree-pine-icon {
    color: #1b5e20;
}

/* Tree Deciduous Icon */
.tree-deciduous-icon {
    color: var(--avocado-medium);
}

/* Mountain Icon */
.mountain-icon {
    color: #607d8b;
}

/* Mountain Snow Icon */
.mountain-snow-icon {
    color: #90caf9;
}

/* Volcano Icon */
.volcano-icon {
    color: #d84315;
    animation: volcanoErupt 4s ease-in-out infinite;
}

@keyframes volcanoErupt {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.05); }
}

/* Sunset Icon */
.sunset-icon {
    color: #ff9800;
}

/* Sunrise Icon */
.sunrise-icon {
    color: #ff9800;
}

/* Moon Icon (Crescent) */
.moon-crescent-icon {
    color: #9c27b0;
}

/* Moon Icon (Full) */
.moon-full-icon {
    color: #ffeb3b;
}

/* Star Icon (Shooting) */
.shooting-star-icon {
    color: #ffeb3b;
    animation: shootingStar 2s ease-in infinite;
}

@keyframes shootingStar {
    0% { transform: translateX(0) translateY(0); opacity: 1; }
    100% { transform: translateX(100px) translateY(100px); opacity: 0; }
}

/* Sparkles Icon (Multiple) */
.sparkles-multi-icon {
    color: #ffeb3b;
    animation: sparklesFlash 1s ease-in-out infinite;
}

/* Galaxy Icon */
.galaxy-icon {
    color: #9c27b0;
    animation: galaxySpin 10s linear infinite;
}

@keyframes galaxySpin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* Planet Icon */
.planet-icon {
    color: #2196f3;
    animation: planetOrbit 4s ease-in-out infinite;
}

@keyframes planetOrbit {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(10px); }
}

/* Atom Icon */
.atom-icon {
    color: #2196f3;
    animation: atomSpin 3s linear infinite;
}

@keyframes atomSpin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* Dna Icon */
.dna-icon {
    color: #9c27b0;
    animation: dnaTwist 3s ease-in-out infinite;
}

@keyframes dnaTwist {
    0%, 100% { transform: rotate(0deg); }
    50% { transform: rotate(10deg); }
}

/* Microscope Icon */
.microscope-icon {
    color: #607d8b;
}

/* Telescope Icon */
.telescope-icon {
    color: #607d8b;
}

/* Satellite Icon */
.satellite-icon {
    color: #607d8b;
    animation: satelliteOrbit 5s ease-in-out infinite;
}

@keyframes satelliteOrbit {
    0%, 100% { transform: translateX(0) translateY(0); }
    50% { transform: translateX(20px) translateY(-10px); }
}

/* Rocket Launch Icon */
.rocket-launch-icon {
    color: #d84315;
    animation: rocketLaunch 2s ease-in-out infinite;
}

/* UFO Icon */
.ufo-icon {
    color: #9c27b0;
    animation: ufoHover 3s ease-in-out infinite;
}

@keyframes ufoHover {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-15px); }
}

/* Alien Icon */
.alien-icon {
    color: #4caf50;
}

/* Ghost Icon */
.ghost-icon {
    color: #9e9e9e;
    animation: ghostFloat 3s ease-in-out infinite;
}

@keyframes ghostFloat {
    0%, 100% { transform: translateY(0); opacity: 0.7; }
    50% { transform: translateY(-10px); opacity: 1; }
}

/* Pumpkin Icon */
.pumpkin-icon {
    color: #ff9800;
    animation: pumpkinGlow 2s ease-in-out infinite;
}

@keyframes pumpkinGlow {
    0%, 100% { filter: brightness(1); }
    50% { filter: brightness(1.2); }
}

/* Skull Icon */
.skull-icon {
    color: #607d8b;
}

/* Bone Icon */
.bone-icon {
    color: #795548;
}

/* Coffin Icon */
.coffin-icon {
    color: #607d8b;
}

/* Tombstone Icon */
.tombstone-icon {
    color: #607d8b;
}

/* Zombie Icon */
.zombie-icon {
    color: #795548;
    animation: zombieWalk 3s ease-in-out infinite;
}

@keyframes zombieWalk {
    0%, 100% { transform: translateX(0) rotate(0deg); }
    25% { transform: translateX(5px) rotate(2deg); }
    50% { transform: translateX(0) rotate(0deg); }
    75% { transform: translateX(-5px) rotate(-2deg); }
}

/* Vampire Icon */
.vampire-icon {
    color: #d84315;
}

/* Werewolf Icon */
.werewolf-icon {
    color: #795548;
}

/* Mummy Icon */
.mummy-icon {
    color: #795548;
    animation: mummyWalk 3s ease-in-out infinite;
}

@keyframes mummyWalk {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(10px); }
}

/* Witch Icon */
.witch-icon {
    color: #9c27b0;
}

/* Wizard Icon */
.wizard-icon {
    color: #9c27b0;
}

/* Fairy Icon */
.fairy-icon {
    color: #e91e63;
    animation: fairyFly 3s ease-in-out infinite;
}

@keyframes fairyFly {
    0%, 100% { transform: translate(0, 0); }
    25% { transform: translate(10px, -10px); }
    50% { transform: translate(0, -5px); }
    75% { transform: translate(-10px, -10px); }
}

/* Angel Icon */
.angel-icon {
    color: #ffeb3b;
}

/* Devil Icon */
.devil-icon {
    color: #d84315;
}

/* Demon Icon */
.demon-icon {
    color: #d84315;
}

/* Dragon Icon */
.dragon-icon {
    color: #d84315;
    animation: dragonFire 3s ease-in-out infinite;
}

@keyframes dragonFire {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.1); }
}

/* Unicorn Icon */
.unicorn-icon {
    color: #e91e63;
}

/* Pegasus Icon */
.pegasus-icon {
    color: #2196f3;
}

/* Phoenix Icon */
.phoenix-icon {
    color: #ff9800;
    animation: phoenixRise 4s ease-in-out infinite;
}

@keyframes phoenixRise {
    0%, 100% { transform: translateY(0) scale(1); }
    50% { transform: translateY(-20px) scale(1.1); }
}

/* Griffin Icon */
.griffin-icon {
    color: #ff9800;
}

/* Centaur Icon */
.centaur-icon {
    color: #795548;
}

/* Minotaur Icon */
.minotaur-icon {
    color: #795548;
}

/* Cyclops Icon */
.cyclops-icon {
    color: #607d8b;
}

/* Kraken Icon */
.kraken-icon {
    color: #607d8b;
    animation: krakenWave 4s ease-in-out infinite;
}

@keyframes krakenWave {
    0%, 100% { transform: rotate(0deg); }
    50% { transform: rotate(5deg); }
}

/* Yeti Icon */
.yeti-icon {
    color: #90caf9;
}

/* Bigfoot Icon */
.bigfoot-icon {
    color: #795548;
}

/* Loch Ness Icon */
.loch-ness-icon {
    color: #607d8b;
    animation: nessieSwim 5s ease-in-out infinite;
}

@keyframes nessieSwim {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(30px); }
}

/* Robot Icon */
.robot-icon {
    color: #607d8b;
    animation: robotBeep 2s ease-in-out infinite;
}

@keyframes robotBeep {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

/* Android Icon */
.android-icon {
    color: #4caf50;
}

/* Apple Icon (Fruit) */
.apple-fruit-icon {
    color: #d84315;
}

/* Banana Icon */
.banana-icon {
    color: #ffeb3b;
    animation: bananaPeel 3s ease-in-out infinite;
}

@keyframes bananaPeel {
    0%, 100% { transform: rotate(0deg); }
    50% { transform: rotate(5deg); }
}

/* Orange Icon */
.orange-icon {
    color: #ff9800;
}

/* Lemon Icon */
.lemon-icon {
    color: #ffeb3b;
}

/* Lime Icon */
.lime-icon {
    color: #cddc39;
}

/* Strawberry Icon */
.strawberry-icon {
    color: #d84315;
}

/* Blueberry Icon */
.blueberry-icon {
    color: #2196f3;
}

/* Raspberry Icon */
.raspberry-icon {
    color: #e91e63;
}

/* Blackberry Icon */
.blackberry-icon {
    color: #607d8b;
}

/* Cherry Icon */
.cherry-icon {
    color: #d84315;
}

/* Peach Icon */
.peach-icon {
    color: #ffab91;
}

/* Pear Icon */
.pear-icon {
    color: #cddc39;
}

/* Plum Icon */
.plum-icon {
    color: #9c27b0;
}

/* Grape Icon */
.grape-icon {
    color: #9c27b0;
}

/* Watermelon Icon */
.watermelon-icon {
    color: #4caf50;
}

/* Melon Icon */
.melon-icon {
    color: #ffab91;
}

/* Pineapple Icon */
.pineapple-icon {
    color: #ffeb3b;
}

/* Coconut Icon */
.coconut-icon {
    color: #795548;
}

/* Kiwi Icon */
.kiwi-icon {
    color: #8bc34a;
}

/* Mango Icon */
.mango-icon {
    color: #ffab91;
}

/* Papaya Icon */
.papaya-icon {
    color: #ffab91;
}

/* Guava Icon */
.guava-fruit-icon {
    color: #ffab91;
}

/* Pomegranate Icon */
.pomegranate-icon {
    color: #d84315;
}

/* Fig Icon */
.fig-icon {
    color: #9c27b0;
}

/* Date Icon */
.date-icon {
    color: #795548;
}

/* Olive Icon */
.olive-icon {
    color: #8bc34a;
}

/* Carrot Icon */
.carrot-icon {
    color: #ff9800;
    animation: carrotGrow 3s ease-in-out infinite;
}

@keyframes carrotGrow {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-5px); }
}

/* Tomato Icon */
.tomato-icon {
    color: #d84315;
}

/* Cucumber Icon */
.cucumber-icon {
    color: #4caf50;
}

/* Pepper Icon */
.pepper-icon {
    color: #d84315;
}

/* Onion Icon */
.onion-icon {
    color: #9c27b0;
}

/* Garlic Icon */
.garlic-icon {
    color: #ffeb3b;
}

/* Potato Icon */
.potato-icon {
    color: #795548;
}

/* Sweet Potato Icon */
.sweet-potato-icon {
    color: #ff9800;
}

/* Pumpkin Icon (Vegetable) */
.pumpkin-veg-icon {
    color: #ff9800;
}

/* Zucchini Icon */
.zucchini-icon {
    color: #4caf50;
}

/* Eggplant Icon */
.eggplant-icon {
    color: #9c27b0;
}

/* Broccoli Icon */
.broccoli-icon {
    color: #4caf50;
}

/* Cauliflower Icon */
.cauliflower-icon {
    color: #ffeb3b;
}

/* Cabbage Icon */
.cabbage-icon {
    color: #4caf50;
}

/* Lettuce Icon */
.lettuce-icon {
    color: #8bc34a;
}

/* Spinach Icon */
.spinach-icon {
    color: #2e7d32;
}

/* Kale Icon */
.kale-icon {
    color: #4caf50;
}

/* Arugula Icon */
.arugula-icon {
    color: #4caf50;
}

/* Basil Icon */
.basil-icon {
    color: #4caf50;
}

/* Mint Icon */
.mint-icon {
    color: #4caf50;
}

/* Parsley Icon */
.parsley-icon {
    color: #4caf50;
}

/* Cilantro Icon */
.cilantro-icon {
    color: #4caf50;
}

/* Dill Icon */
.dill-icon {
    color: #4caf50;
}

/* Rosemary Icon */
.rosemary-icon {
    color: #4caf50;
}

/* Thyme Icon */
.thyme-icon {
    color: #4caf50;
}

/* Oregano Icon */
.oregano-icon {
    color: #4caf50;
}

/* Sage Icon */
.sage-icon {
    color: #4caf50;
}

/* Chives Icon */
.chives-icon {
    color: #4caf50;
}

/* Tarragon Icon */
.tarragon-icon {
    color: #4caf50;
}

/* Lavender Icon */
.lavender-icon {
    color: #9c27b0;
}

/* Chamomile Icon */
.chamomile-icon {
    color: #ffeb3b;
}

/* Peppermint Icon */
.peppermint-icon {
    color: #4caf50;
}

/* Spearmint Icon */
.spearmint-icon {
    color: #4caf50;
}

/* Lemon Balm Icon */
.lemon-balm-icon {
    color: #8bc34a;
}

/* Wheat Icon */
.wheat-icon {
    color: #ffeb3b;
    animation: wheatSway 4s ease-in-out infinite;
}

@keyframes wheatSway {
    0%, 100% { transform: rotate(-5deg); }
    50% { transform: rotate(5deg); }
}

/* Rice Icon */
.rice-icon {
    color: #ffeb3b;
}

/* Corn Icon */
.corn-icon {
    color: #ffeb3b;
}

/* Soy Icon */
.soy-icon {
    color: #8bc34a;
}

/* Bean Icon */
.bean-icon {
    color: #8bc34a;
}

/* Lentil Icon */
.lentil-icon {
    color: #795548;
}

/* Chickpea Icon */
.chickpea-icon {
    color: #ffeb3b;
}

/* Pea Icon */
.pea-icon {
    color: #8bc34a;
}

/* Peanut Icon */
.peanut-icon {
    color: #795548;
}

/* Cashew Icon */
.cashew-icon {
    color: #ffeb3b;
}

/* Almond Icon */
.almond-icon {
    color: #795548;
}

/* Walnut Icon */
.walnut-icon {
    color: #795548;
}

/* Pecan Icon */
.pecan-icon {
    color: #795548;
}

/* Pistachio Icon */
.pistachio-icon {
    color: #8bc34a;
}

/* Macadamia Icon */
.macadamia-icon {
    color: #ffeb3b;
}

/* Hazelnut Icon */
.hazelnut-icon {
    color: #795548;
}

/* Chestnut Icon */
.chestnut-icon {
    color: #795548;
}

/* Coconut Icon (Nut) */
.coconut-nut-icon {
    color: #795548;
}

/* Brazil Nut Icon */
.brazil-nut-icon {
    color: #795548;
}

/* Pine Nut Icon */
.pine-nut-icon {
    color: #ffeb3b;
}

/* Sunflower Seed Icon */
.sunflower-seed-icon {
    color: #795548;
}

/* Pumpkin Seed Icon */
.pumpkin-seed-icon {
    color: #795548;
}

/* Flax Seed Icon */
.flax-seed-icon {
    color: #795548;
}

/* Chia Seed Icon */
.chia-seed-icon {
    color: #795548;
}

/* Hemp Seed Icon */
.hemp-seed-icon {
    color: #8bc34a;
}

/* Sesame Seed Icon */
.sesame-seed-icon {
    color: #ffeb3b;
}

/* Poppy Seed Icon */
.poppy-seed-icon {
    color: #607d8b;
}

/* Quinoa Icon */
.quinoa-icon {
    color: #ffeb3b;
}

/* Amaranth Icon */
.amaranth-icon {
    color: #795548;
}

/* Millet Icon */
.millet-icon {
    color: #ffeb3b;
}

/* Sorghum Icon */
.sorghum-icon {
    color: #795548;
}

/* Barley Icon */
.barley-icon {
    color: #ffeb3b;
}

/* Oat Icon */
.oat-icon {
    color: #ffeb3b;
}

/* Rye Icon */
.rye-icon {
    color: #795548;
}

/* Spelt Icon */
.spelt-icon {
    color: #ffeb3b;
}

/* Kamut Icon */
.kamut-icon {
    color: #795548;
}

/* Teff Icon */
.teff-icon {
    color: #795548;
}

/* Freekeh Icon */
.freekeh-icon {
    color: #8bc34a;
}

/* Farro Icon */
.farro-icon {
    color: #795548;
}

/* Bulgur Icon */
.bulgur-icon {
    color: #ffeb3b;
}

/* Couscous Icon */
.couscous-icon {
    color: #ffeb3b;
}

/* Polenta Icon */
.polenta-icon {
    color: #ffeb3b;
}

/* Grits Icon */
.grits-icon {
    color: #ffeb3b;
}

/* Tapioca Icon */
.tapioca-icon {
    color: #ffeb3b;
}

/* Arrowroot Icon */
.arrowroot-icon {
    color: #ffeb3b;
}

/* Sago Icon */
.sago-icon {
    color: #ffeb3b;
}

/* Bread Icon */
.bread-icon {
    color: #795548;
}

/* Baguette Icon */
.baguette-icon {
    color: #795548;
}

/* Croissant Icon */
.croissant-icon {
    color: #ffab91;
}

/* Pretzel Icon */
.pretzel-icon {
    color: #795548;
}

/* Bagel Icon */
.bagel-icon {
    color: #795548;
}

/* Muffin Icon */
.muffin-icon {
    color: #795548;
}

/* Donut Icon */
.donut-icon {
    color: #e91e63;
}

/* Cookie Icon */
.cookie-icon {
    color: #795548;
}

/* Cake Icon */
.cake-icon {
    color: #e91e63;
}

/* Pie Icon */
.pie-icon {
    color: #795548;
}

/* Tart Icon */
.tart-icon {
    color: #795548;
}

/* Pudding Icon */
.pudding-icon {
    color: #795548;
}

/* Custard Icon */
.custard-icon {
    color: #ffeb3b;
}

/* Ice Cream Icon */
.ice-cream-icon {
    color: #e91e63;
}

/* Gelato Icon */
.gelato-icon {
    color: #e91e63;
}

/* Sorbet Icon */
.sorbet-icon {
    color: #ff9800;
}

/* Frozen Yogurt Icon */
.frozen-yogurt-icon {
    color: #e91e63;
}

/* Milkshake Icon */
.milkshake-icon {
    color: #795548;
}

/* Smoothie Icon */
.smoothie-icon {
    color: #8bc34a;
}

/* Juice Icon */
.juice-icon {
    color: #ff9800;
}

/* Soda Icon */
.soda-icon {
    color: #d84315;
}

/* Coffee Icon */
.coffee-icon {
    color: #795548;
}

/* Tea Icon */
.tea-icon {
    color: #4caf50;
}

/* Hot Chocolate Icon */
.hot-chocolate-icon {
    color: #795548;
}

/* Cider Icon */
.cider-icon {
    color: #ff9800;
}

/* Kombucha Icon */
.kombucha-icon {
    color: #4caf50;
}

/* Kefir Icon */
.kefir-icon {
    color: #ffeb3b;
}

/* Yogurt Icon */
.yogurt-icon {
    color: #ffeb3b;
}

/* Cheese Icon */
.cheese-icon {
    color: #ffeb3b;
}

/* Butter Icon */
.butter-icon {
    color: #ffeb3b;
}

/* Cream Icon */
.cream-icon {
    color: #ffeb3b;
}

/* Milk Icon */
.milk-icon {
    color: #2196f3;
}

/* Egg Icon */
.egg-icon {
    color: #ffeb3b;
}

/* Honey Icon */
.honey-icon {
    color: #ff9800;
}

/* Jam Icon */
.jam-icon {
    color: #d84315;
}

/* Jelly Icon */
.jelly-icon {
    color: #9c27b0;
}

/* Marmalade Icon */
.marmalade-icon {
    color: #ff9800;
}

/* Nutella Icon */
.nutella-icon {
    color: #795548;
}

/* Peanut Butter Icon */
.peanut-butter-icon {
    color: #795548;
}

/* Almond Butter Icon */
.almond-butter-icon {
    color: #795548;
}

/* Cashew Butter Icon */
.cashew-butter-icon {
    color: #795548;
}

/* Sunflower Butter Icon */
.sunflower-butter-icon {
    color: #795548;
}

/* Tahini Icon */
.tahini-icon {
    color: #795548;
}

/* Hummus Icon */
.hummus-icon {
    color: #8bc34a;
}

/* Guacamole Icon */
.guacamole-icon {
    color: var(--avocado-green);
    animation: guacDip 2s ease-in-out infinite;
}

@keyframes guacDip {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.05); }
}

/* Salsa Icon */
.salsa-icon {
    color: #d84315;
}

/* Pesto Icon */
.pesto-icon {
    color: var(--avocado-green);
}

/* Tzatziki Icon */
.tzatziki-icon {
    color: #ffeb3b;
}

/* Ranch Icon */
.ranch-icon {
    color: #ffeb3b;
}

/* Vinaigrette Icon */
.vinaigrette-icon {
    color: #8bc34a;
}

/* Mayonnaise Icon */
.mayonnaise-icon {
    color: #ffeb3b;
}

/* Mustard Icon */
.mustard-icon {
    color: #ffeb3b;
}

/* Ketchup Icon */
.ketchup-icon {
    color: #d84315;
}

/* BBQ Sauce Icon */
.bbq-sauce-icon {
    color: #d84315;
}

/* Hot Sauce Icon */
.hot-sauce-icon {
    color: #ff5722;
    animation: hotSauceBurn 1s ease-in-out infinite;
}

@keyframes hotSauceBurn {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.1); }
}

/* Soy Sauce Icon */
.soy-sauce-icon {
    color: #795548;
}

/* Teriyaki Icon */
.teriyaki-icon {
    color: #795548;
}

/* Worcestershire Icon */
.worcestershire-icon {
    color: #795548;
}

/* Fish Sauce Icon */
.fish-sauce-icon {
    color: #795548;
}

/* Oyster Sauce Icon */
.oyster-sauce-icon {
    color: #795548;
}

/* Hoisin Sauce Icon */
.hoisin-sauce-icon {
    color: #d84315;
}

/* Sriracha Icon */
.sriracha-icon {
    color: #ff5722;
}

/* Cholula Icon */
.cholula-icon {
    color: #ff5722;
}

/* Tabasco Icon */
.tabasco-icon {
    color: #ff5722;
}

/* Sambal Icon */
.sambal-icon {
    color: #d84315;
}

/* Gochujang Icon */
.gochujang-icon {
    color: #d84315;
}

/* Harissa Icon */
.harissa-icon {
    color: #d84315;
}

/* Chimichurri Icon */
.chimichurri-icon {
    color: var(--avocado-green);
}

/* Romesco Icon */
.romesco-icon {
    color: #d84315;
}

/* Aioli Icon */
.aioli-icon {
    color: #ffeb3b;
}

/* Hollandaise Icon */
.hollandaise-icon {
    color: #ffeb3b;
}

/* Bechamel Icon */
.bechamel-icon {
    color: #ffeb3b;
}

/* Veloute Icon */
.veloute-icon {
    color: #ffeb3b;
}

/* Espagnole Icon */
.espagnole-icon {
    color: #795548;
}

/* Tomato Sauce Icon */
.tomato-sauce-icon {
    color: #d84315;
}

/* Alfredo Icon */
.alfredo-icon {
    color: #ffeb3b;
}

/* Carbonara Icon */
.carbonara-icon {
    color: #795548;
}

/* Arrabbiata Icon */
.arrabbiata-icon {
    color: #d84315;
}

/* Puttanesca Icon */
.puttanesca-icon {
    color: #d84315;
}

/* Amatriciana Icon */
.amatriciana-icon {
    color: #d84315;
}

/* Bolognese Icon */
.bolognese-icon {
    color: #795548;
}

/* Marinara Icon */
.marinara-icon {
    color: #d84315;
}

/* Pesto Icon (Pasta) */
.pesto-pasta-icon {
    color: var(--avocado-green);
}

/* Aglio e Olio Icon */
.aglio-e-olio-icon {
    color: #ffeb3b;
}

/* Cacio e Pepe Icon */
.cacio-e-pepe-icon {
    color: #ffeb3b;
}

/* Vongole Icon */
.vongole-icon {
    color: #607d8b;
}

/* Frutti di Mare Icon */
.frutti-di-mare-icon {
    color: #607d8b;
}

/* Lasagna Icon */
.lasagna-icon {
    color: #795548;
}

/* Ravioli Icon */
.ravioli-icon {
    color: #ffeb3b;
}

/* Tortellini Icon */
.tortellini-icon {
    color: #ffeb3b;
}

/* Gnocchi Icon */
.gnocchi-icon {
    color: #795548;
}

/* Risotto Icon */
.risotto-icon {
    color: #ffeb3b;
}

/* Polenta Icon (Italian) */
.polenta-italian-icon {
    color: #ffeb3b;
}

/* Bruschetta Icon */
.bruschetta-icon {
    color: #d84315;
}

/* Caprese Icon */
.caprese-icon {
    color: #ffeb3b;
}

/* Antipasto Icon */
.antipasto-icon {
    color: #d84315;
}

/* Calzone Icon */
.calzone-icon {
    color: #795548;
}

/* Focaccia Icon */
.focaccia-icon {
    color: #795548;
}

/* Ciabatta Icon */
.ciabatta-icon {
    color: #795548;
}

/* Panini Icon */
.panini-icon {
    color: #795548;
}

/* Piadina Icon */
.piadina-icon {
    color: #795548;
}

/* Arancini Icon */
.arancini-icon {
    color: #ffeb3b;
}

/* Suppli Icon */
.suppli-icon {
    color: #795548;
}

/* Olive Ascolane Icon */
.olive-ascolane-icon {
    color: #8bc34a;
}

/* Zeppole Icon */
.zeppole-icon {
    color: #795548;
}

/* Cannoli Icon */
.cannoli-icon {
    color: #795548;
}

/* Tiramisu Icon */
.tiramisu-icon {
    color: #795548;
}

/* Panna Cotta Icon */
.panna-cotta-icon {
    color: #ffeb3b;
}

/* Gelato Icon (Italian) */
.gelato-italian-icon {
    color: #e91e63;
}

/* Sorbetto Icon */
.sorbetto-icon {
    color: #ff9800;
}

/* Affogato Icon */
.affogato-icon {
    color: #795548;
}

/* Granita Icon */
.granita-icon {
    color: #2196f3;
}

/* Semifreddo Icon */
.semifreddo-icon {
    color: #ffeb3b;
}

/* Spumoni Icon */
.spumoni-icon {
    color: #e91e63;
}

/* Tartufo Icon */
.tartufo-icon {
    color: #795548;
}

/* Biscotti Icon */
.biscotti-icon {
    color: #795548;
}

/* Amaretti Icon */
.amaretti-icon {
    color: #795548;
}

/* Pizzelle Icon */
.pizzelle-icon {
    color: #795548;
}

/* Struffoli Icon */
.struffoli-icon {
    color: #ffeb3b;
}

/* Panettone Icon */
.panettone-icon {
    color: #795548;
}

/* Colomba Icon */
.colomba-icon {
    color: #ffeb3b;
}

/* Pandoro Icon */
.pandoro-icon {
    color: #ffeb3b;
}

/* Torrone Icon */
.torrone-icon {
    color: #ffeb3b;
}

/* Nougat Icon */
.nougat-icon {
    color: #ffeb3b;
}

/* Marzipan Icon */
.marzipan-icon {
    color: #ffeb3b;
}

/* Gianduja Icon */
.gianduja-icon {
    color: #795548;
}

/* Nutella Icon (Italian) */
.nutella-italian-icon {
    color: #795548;
}

/* Ovomaltine Icon */
.ovomaltine-icon {
    color: #795548;
}

/* Baci Icon */
.baci-icon {
    color: #795548;
}

/* Ferrero Rocher Icon */
.ferrero-rocher-icon {
    color: #795548;
}

/* Raffaello Icon */
.raffaello-icon {
    color: #ffeb3b;
}

/* Kinder Egg Icon */
.kinder-egg-icon {
    color: #795548;
}

/* Kinder Bueno Icon */
.kinder-bueno-icon {
    color: #795548;
}

/* Kinder Chocolate Icon */
.kinder-chocolate-icon {
    color: #795548;
}

/* Lindt Icon */
.lindt-icon {
    color: #795548;
}

/* Ghirardelli Icon */
.ghirardelli-icon {
    color: #795548;
}

/* Godiva Icon */
.godiva-icon {
    color: #795548;
}

/* Hershey Icon */
.hershey-icon {
    color: #795548;
}

/* Cadbury Icon */
.cadbury-icon {
    color: #673ab7;
}

/* Nestle Icon */
.nestle-icon {
    color: #2196f3;
}

/* Mars Icon */
.mars-icon {
    color: #d84315;
}

/* Snickers Icon */
.snickers-icon {
    color: #795548;
}

/* Twix Icon */
.twix-icon {
    color: #795548;
}

/* Kit Kat Icon */
.kit-kat-icon {
    color: #d84315;
}

/* Milky Way Icon */
.milky-way-icon {
    color: #673ab7;
}

/* 3 Musketeers Icon */
.three-musketeers-icon {
    color: #d84315;
}

/* Milky Bar Icon */
.milky-bar-icon {
    color: #ffeb3b;
}

/* Galaxy Icon (Chocolate) */
.galaxy-chocolate-icon {
    color: #673ab7;
}

/* Maltesers Icon */
.maltesers-icon {
    color: #795548;
}

/* M&M Icon */
.m-and-m-icon {
    color: #d84315;
}

/* Skittles Icon */
.skittles-icon {
    color: #ffeb3b;
}

/* Starburst Icon */
.starburst-icon {
    color: #ff9800;
}

/* Haribo Icon */
.haribo-icon {
    color: #d84315;
}

/* Jelly Belly Icon */
.jelly-belly-icon {
    color: #ffeb3b;
}

/* Gummy Bear Icon */
.gummy-bear-icon {
    color: #e91e63;
    animation: gummyWiggle 1s ease-in-out infinite;
}

@keyframes gummyWiggle {
    0%, 100% { transform: rotate(0deg); }
    25% { transform: rotate(5deg); }
    75% { transform: rotate(-5deg); }
}

/* Licorice Icon */
.licorice-icon {
    color: #212121;
}

/* Taffy Icon */
.taffy-icon {
    color: #ffeb3b;
}

/* Caramel Icon */
.caramel-icon {
    color: #ff9800;
}

/* Toffee Icon */
.toffee-icon {
    color: #ff9800;
}

/* Fudge Icon */
.fudge-icon {
    color: #795548;
}

/* Brittle Icon */
.brittle-icon {
    color: #ff9800;
}

/* Praline Icon */
.praline-icon {
    color: #ff9800;
}

/* Truffle Icon */
.truffle-icon {
    color: #795548;
}

/* Bonbon Icon */
.bonbon-icon {
    color: #e91e63;
}

/* Chocolate Bar Icon */
.chocolate-bar-icon {
    color: #795548;
}

/* White Chocolate Icon */
.white-chocolate-icon {
    color: #ffeb3b;
}

/* Dark Chocolate Icon */
.dark-chocolate-icon {
    color: #3e2723;
}

/* Milk Chocolate Icon */
.milk-chocolate-icon {
    color: #5d4037;
}

/* Ruby Chocolate Icon */
.ruby-chocolate-icon {
    color: #e91e63;
}

/* Cacao Icon */
.cacao-icon {
    color: #3e2723;
}

/* Cacao Nibs Icon */
.cacao-nibs-icon {
    color: #3e2723;
}

/* Cacao Powder Icon */
.cacao-powder-icon {
    color: #3e2723;
}

/* Cacao Butter Icon */
.cacao-butter-icon {
    color: #ffeb3b;
}

/* Vanilla Icon */
.vanilla-icon {
    color: #ffeb3b;
}

/* Cinnamon Icon */
.cinnamon-icon {
    color: #795548;
}

/* Nutmeg Icon */
.nutmeg-icon {
    color: #795548;
}

/* Cloves Icon */
.cloves-icon {
    color: #795548;
}

/* Cardamom Icon */
.cardamom-icon {
    color: #8bc34a;
}

/* Ginger Icon */
.ginger-icon {
    color: #ffeb3b;
}

/* Turmeric Icon */
.turmeric-icon {
    color: #ffeb3b;
}

/* Saffron Icon */
.saffron-icon {
    color: #ff9800;
}

/* Paprika Icon */
.paprika-icon {
    color: #d84315;
}

/* Cumin Icon */
.cumin-icon {
    color: #795548;
}

/* Coriander Icon */
.coriander-icon {
    color: #8bc34a;
}

/* Fennel Icon */
.fennel-icon {
    color: #8bc34a;
}

/* Anise Icon */
.anise-icon {
    color: #8bc34a;
}

/* Star Anise Icon */
.star-anise-icon {
    color: #8bc34a;
}

/* Bay Leaf Icon */
.bay-leaf-icon {
    color: #2e7d32;
}

/* Juniper Icon */
.juniper-icon {
    color: #2e7d32;
}

/* Peppercorn Icon */
.peppercorn-icon {
    color: #212121;
}

/* Mustard Seed Icon */
.mustard-seed-icon {
    color: #ffeb3b;
}

/* Fenugreek Icon */
.fenugreek-icon {
    color: #8bc34a;
}

/* Asafoetida Icon */
.asafoetida-icon {
    color: #ffeb3b;
}

/* Sumac Icon */
.sumac-icon {
    color: #d84315;
}

/* Za'atar Icon */
.zaatar-icon {
    color: #8bc34a;
}

/* Baharat Icon */
.baharat-icon {
    color: #795548;
}

/* Garam Masala Icon */
.garam-masala-icon {
    color: #795548;
}

/* Curry Powder Icon */
.curry-powder-icon {
    color: #ff9800;
}

/* Turmeric Icon (Spice) */
.turmeric-spice-icon {
    color: #ffeb3b;
}

/* Chili Powder Icon */
.chili-powder-icon {
    color: #d84315;
}

/* Cayenne Icon */
.cayenne-icon {
    color: #d84315;
}

/* Chipotle Icon */
.chipotle-icon {
    color: #d84315;
}

/* Ancho Icon */
.ancho-icon {
    color: #d84315;
}

/* Guajillo Icon */
.guajillo-icon {
    color: #d84315;
}

/* Pasilla Icon */
.pasilla-icon {
    color: #3e2723;
}

/* Mulato Icon */
.mulato-icon {
    color: #3e2723;
}

/* Cascabel Icon */
.cascabel-icon {
    color: #d84315;
}

/* Pequin Icon */
.pequin-icon {
    color: #d84315;
}

/* Habanero Icon */
.habanero-icon {
    color: #ff9800;
}

/* Scotch Bonnet Icon */
.scotch-bonnet-icon {
    color: #ff9800;
}

/* Jalapeno Icon */
.jalapeno-icon {
    color: #4caf50;
}

/* Serrano Icon */
.serrano-icon {
    color: #4caf50;
}

/* Poblano Icon */
.poblano-icon {
    color: #4caf50;
}

/* Anaheim Icon */
.anaheim-icon {
    color: #4caf50;
}

/* Bell Pepper Icon */
.bell-pepper-icon {
    color: #ffeb3b;
}

/* Banana Pepper Icon */
.banana-pepper-icon {
    color: #ffeb3b;
}

/* Cherry Pepper Icon */
.cherry-pepper-icon {
    color: #d84315;
}

/* Pimento Icon */
.pimento-icon {
    color: #d84315;
}

/* Pepperoncini Icon */
.pepperoncini-icon {
    color: #ffeb3b;
}

/* Cubanelle Icon */
.cubanelle-icon {
    color: #ffeb3b;
}

/* Shishito Icon */
.shishito-icon {
    color: #4caf50;
}

/* Padron Icon */
.padron-icon {
    color: #4caf50;
}

/* Thai Chili Icon */
.thai-chili-icon {
    color: #d84315;
}

/* Bird's Eye Icon */
.birds-eye-icon {
    color: #d84315;
}

/* Ghost Pepper Icon */
.ghost-pepper-icon {
    color: #d84315;
    animation: ghostPepperFlame 1s ease-in-out infinite;
}

@keyframes ghostPepperFlame {
    0%, 100% { filter: brightness(1); }
    50% { filter: brightness(1.3); }
}

/* Carolina Reaper Icon */
.carolina-reaper-icon {
    color: #d84315;
    animation: reaperBurn 0.5s ease-in-out infinite;
}

@keyframes reaperBurn {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.2); }
}

/* Trinidad Scorpion Icon */
.trinidad-scorpion-icon {
    color: #d84315;
}

/* Komodo Dragon Icon */
.komodo-dragon-icon {
    color: #d84315;
}

/* Pepper X Icon */
.pepper-x-icon {
    color: #212121;
    animation: pepperXHeat 0.3s ease-in-out infinite;
}

@keyframes pepperXHeat {
    0%, 100% { filter: hue-rotate(0deg); }
    50% { filter: hue-rotate(30deg); }
}

/* Salt Icon */
.salt-icon {
    color: #e0e0e0;
}

/* Sugar Icon */
.sugar-icon {
    color: #ffffff;
    text-shadow: 0 0 2px rgba(0,0,0,0.3);
}

/* Brown Sugar Icon */
.brown-sugar-icon {
    color: #795548;
}

/* Powdered Sugar Icon */
.powdered-sugar-icon {
    color: #ffffff;
    text-shadow: 0 0 2px rgba(0,0,0,0.3);
}

/* Cane Sugar Icon */
.cane-sugar-icon {
    color: #ffeb3b;
}

/* Coconut Sugar Icon */
.coconut-sugar-icon {
    color: #795548;
}

/* Maple Syrup Icon */
.maple-syrup-icon {
    color: #8d6e63;
}

/* Agave Icon */
.agave-icon {
    color: #ffeb3b;
}

/* Stevia Icon */
.stevia-icon {
    color: #8bc34a;
}

/* Monk Fruit Icon */
.monk-fruit-icon {
    color: #ffeb3b;
}

/* Erythritol Icon */
.erythritol-icon {
    color: #ffffff;
    text-shadow: 0 0 2px rgba(0,0,0,0.3);
}

/* Xylitol Icon */
.xylitol-icon {
    color: #ffffff;
    text-shadow: 0 0 2px rgba(0,0,0,0.3);
}

/* Maltitol Icon */
.maltitol-icon {
    color: #ffffff;
    text-shadow: 0 0 2px rgba(0,0,0,0.3);
}

/* Sorbitol Icon */
.sorbitol-icon {
    color: #ffffff;
    text-shadow: 0 0 2px rgba(0,0,0,0.3);
}

/* Isomalt Icon */
.isomalt-icon {
    color: #ffffff;
    text-shadow: 0 0 2px rgba(0,0,0,0.3);
}

/* Lactitol Icon */
.lactitol-icon {
    color: #ffffff;
    text-shadow: 0 0 2px rgba(0,0,0,0.3);
}

/* Mannitol Icon */
.mannitol-icon {
    color: #ffffff;
    text-shadow: 0 0 2px rgba(0,0,0,0.3);
}

/* Aspartame Icon */
.aspartame-icon {
    color: #ffffff;
    text-shadow: 0 0 2px rgba(0,0,0,0.3);
}

/* Sucralose Icon */
.sucralose-icon {
    color: #ffffff;
    text-shadow: 0 0 2px rgba(0,0,0,0.3);
}

/* Saccharin Icon */
.saccharin-icon {
    color: #ffffff;
    text-shadow: 0 0 2px rgba(0,0,0,0.3);
}

/* Acesulfame K Icon */
.acesulfame-k-icon {
    color: #ffffff;
    text-shadow: 0 0 2px rgba(0,0,0,0.3);
}

/* Neotame Icon */
.neotame-icon {
    color: #ffffff;
    text-shadow: 0 0 2px rgba(0,0,0,0.3);
}

/* Advantame Icon */
.advantame-icon {
    color: #ffffff;
    text-shadow: 0 0 2px rgba(0,0,0,0.3);
}

/* Sodium Icon */
.sodium-icon {
    color: #e0e0e0;
}

/* Potassium Icon */
.potassium-icon {
    color: #9c27b0;
}

/* Cart Item Image */
.cart-item-image {
    width: 80px;
    height: 80px;
    object-fit: cover;
    border-radius: 8px;
    border: 1px solid #dee2e6;
}

/* Quantity Selector - Cart Page */
.quantity-selector {
    display: inline-flex;
    align-items: center;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    overflow: hidden;
    background: white;
}

.quantity-selector button {
    border: none;
    background: #f8f9fa;
    padding: 0.5rem 0.75rem;
    font-size: 1rem;
    line-height: 1;
    color: #495057;
    cursor: pointer;
    transition: background 0.2s;
}

.quantity-selector button:hover {
    background: #e9ecef;
}

.quantity-selector input {
    border: none;
    border-left: 1px solid #dee2e6;
    border-right: 1px solid #dee2e6;
    width: 50px;
    text-align: center;
    font-weight: 600;
    padding: 0.5rem;
    background: white;
}

.quantity-selector input:focus {
    outline: none;
}

/* Remove number input arrows */
.quantity-selector input::-webkit-outer-spin-button,
.quantity-selector input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.quantity-selector input[type=number] {
    -moz-appearance: textfield;
    appearance: textfield;
}
.calcium-icon {
    color: #e0e0e0;
}

/* Footer Styles */
.footer {
    color: #adb5bd !important;
}

.footer .text-light-emphasis {
    color: #adb5bd !important;
}

.footer a.text-light-emphasis {
    color: #adb5bd !important;
}

.footer a.text-light-emphasis:hover {
    color: #fff !important;
}

.footer h6, .footer h5 {
    color: #fff !important;
}

/* Magnesium Icon */
.magnesium-icon {
    color: #9c27b0;
}

/* Iron Icon */
.iron-icon {
    color: #607d8b;
}

/* Zinc Icon */
.zinc-icon {
    color: #607d8b;
}

/* Selenium Icon */
.selenium-icon {
    color: #ffeb3b;
}

/* Iodine Icon */
.iodine-icon {
    color: #9c27b0;
}

/* Copper Icon */
.copper-icon {
    color: #8d6e63;
}

/* Manganese Icon */
.manganese-icon {
    color: #607d8b;
}

/* Chromium Icon */
.chromium-icon {
    color: #607d8b;
}

/* Molybdenum Icon */
.molybdenum-icon {
    color: #607d8b;
}

/* Fluoride Icon */
.fluoride-icon {
    color: #e0e0e0;
}

/* Chloride Icon */
.chloride-icon {
    color: #e0e0e0;
}

/* Phosphorus Icon */
.phosphorus-icon {
    color: #ffeb3b;
}

/* Vitamin A Icon */
.vitamin-a-icon {
    color: #ff9800;
}

/* Vitamin C Icon */
.vitamin-c-icon {
    color: #ff9800;
}

/* Vitamin D Icon */
.vitamin-d-icon {
    color: #ffeb3b;
}

/* Vitamin E Icon */
.vitamin-e-icon {
    color: #ffeb3b;
}

/* Vitamin K Icon */
.vitamin-k-icon {
    color: #8bc34a;
}

/* Vitamin B1 Icon */
.vitamin-b1-icon {
    color: #ffeb3b;
}

/* Vitamin B2 Icon */
.vitamin-b2-icon {
    color: #ffeb3b;
}

/* Vitamin B3 Icon */
.vitamin-b3-icon {
    color: #ffeb3b;
}

/* Vitamin B5 Icon */
.vitamin-b5-icon {
    color: #ffeb3b;
}

/* Vitamin B6 Icon */
.vitamin-b6-icon {
    color: #ffeb3b;
}

/* Vitamin B7 Icon */
.vitamin-b7-icon {
    color: #ffeb3b;
}

/* Vitamin B9 Icon */
.vitamin-b9-icon {
    color: #ffeb3b;
}

/* Vitamin B12 Icon */
.vitamin-b12-icon {
    color: #ffeb3b;
}

/* Omega-3 Icon */
.omega-3-icon {
    color: #2196f3;
}

/* Omega-6 Icon */
.omega-6-icon {
    color: #ff9800;
}

/* Omega-9 Icon */
.omega-9-icon {
    color: #8bc34a;
}

/* Protein Icon */
.protein-icon {
    color: #795548;
}

/* Carbohydrate Icon */
.carbohydrate-icon {
    color: #ffeb3b;
}

/* Fat Icon */
.fat-icon {
    color: #ffeb3b;
}

/* Fiber Icon */
.fiber-icon {
    color: var(--avocado-green);
}

/* Sugar Icon (Nutrition) */
.sugar-nutrition-icon {
    color: #ffffff;
    text-shadow: 0 0 2px rgba(0,0,0,0.3);
}

/* Cholesterol Icon */
.cholesterol-icon {
    color: #ffeb3b;
}

/* Gluten Icon */
.gluten-icon {
    color: #8d6e63;
}

/* Lactose Icon */
.lactose-icon {
    color: #ffeb3b;
}

/* Caffeine Icon */
.caffeine-icon {
    color: #795548;
}

/* Alcohol Icon */
.alcohol-icon {
    color: #ffeb3b;
}

/* Water Icon */
.water-icon {
    color: #2196f3;
    animation: waterRipple 2s ease-in-out infinite;
}

@keyframes waterRipple {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.05); }
}

/* Sparkling Water Icon */
.sparkling-water-icon {
    color: #2196f3;
    animation: sparkleBubble 1s ease-in-out infinite;
}

@keyframes sparkleBubble {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-3px); }
}

/* Coconut Water Icon */
.coconut-water-icon {
    color: #4caf50;
}

/* Sports Drink Icon */
.sports-drink-icon {
    color: #ff9800;
}

/* Energy Drink Icon */
.energy-drink-icon {
    color: #d84315;
    animation: energyPulse 0.5s ease-in-out infinite;
}

@keyframes energyPulse {
    0%, 100% { filter: brightness(1); }
    50% { filter: brightness(1.2); }
}

/* Protein Shake Icon */
.protein-shake-icon {
    color: #795548;
}

/* Smoothie Icon (Beverage) */
.smoothie-beverage-icon {
    color: #8bc34a;
}

/* Milkshake Icon (Beverage) */
.milkshake-beverage-icon {
    color: #795548;
}

/* Hot Chocolate Icon (Beverage) */
.hot-chocolate-beverage-icon {
    color: #795548;
}

/* Tea Icon (Beverage) */
.tea-beverage-icon {
    color: #4caf50;
}

/* Coffee Icon (Beverage) */
.coffee-beverage-icon {
    color: #795548;
}

/* Espresso Icon */
.espresso-icon {
    color: #3e2723;
}

/* Cappuccino Icon */
.cappuccino-icon {
    color: #8d6e63;
}

/* Latte Icon */
.latte-icon {
    color: #8d6e63;
}

/* Mocha Icon */
.mocha-icon {
    color: #795548;
}

/* Macchiato Icon */
.macchiato-icon {
    color: #8d6e63;
}

/* Americano Icon */
.americano-icon {
    color: #3e2723;
}

/* Flat White Icon */
.flat-white-icon {
    color: #8d6e63;
}

/* Cortado Icon */
.cortado-icon {
    color: #8d6e63;
}

/* Ristretto Icon */
.ristretto-icon {
    color: #3e2723;
}

/* Lungo Icon */
.lungo-icon {
    color: #3e2723;
}

/* Affogato Icon (Beverage) */
.affogato-beverage-icon {
    color: #795548;
}

/* Doppio Icon */
.doppio-icon {
    color: #3e2723;
}

/* Red Eye Icon */
.red-eye-icon {
    color: #d84315;
}

/* Black Eye Icon */
.black-eye-icon {
    color: #212121;
}

/* Dead Eye Icon */
.dead-eye-icon {
    color: #b71c1c;
}

/* Breve Icon */
.breve-icon {
    color: #8d6e63;
}

/* Con Panna Icon */
.con-panna-icon {
    color: #795548;
}

/* Galao Icon */
.galao-icon {
    color: #8d6e63;
}

/* Mezzo Mezzo Icon */
.mezzo-mezzo-icon {
    color: #8d6e63;
}

/* Espresso Romano Icon */
.espresso-romano-icon {
    color: #ff9800;
}

/* Cafe Bombon Icon */
.cafe-bombon-icon {
    color: #795548;
}

/* Cafe Cubano Icon */
.cafe-cubano-icon {
    color: #795548;
}

/* Cafe au Lait Icon */
.cafe-au-lait-icon {
    color: #8d6e63;
}

/* Cafe Miel Icon */
.cafe-miel-icon {
    color: #ff9800;
}

/* Cafe de Olla Icon */
.cafe-de-olla-icon {
    color: #795548;
}

/* Turkish Coffee Icon */
.turkish-coffee-icon {
    color: #795548;
}

/* Greek Coffee Icon */
.greek-coffee-icon {
    color: #795548;
}

/* Arabic Coffee Icon */
.arabic-coffee-icon {
    color: #795548;
}

/* Vietnamese Coffee Icon */
.vietnamese-coffee-icon {
    color: #795548;
}

/* Thai Coffee Icon */
.thai-coffee-icon {
    color: #795548;
}

/* Bulletproof Coffee Icon */
.bulletproof-coffee-icon {
    color: #795548;
}

/* Nitro Coffee Icon */
.nitro-coffee-icon {
    color: #795548;
    animation: nitroBubble 2s ease-in-out infinite;
}

@keyframes nitroBubble {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-5px); }
}

/* Cold Brew Icon */
.cold-brew-icon {
    color: #795548;
}

/* Iced Coffee Icon */
.iced-coffee-icon {
    color: #795548;
}

/* Frappuccino Icon */
.frappuccino-icon {
    color: #795548;
}

/* Frappe Icon */
.frappe-icon {
    color: #795548;
}

/* Milk Icon (Dairy) */
.milk-dairy-icon {
    color: #ffeb3b;
}

/* Cream Icon (Dairy) */
.cream-dairy-icon {
    color: #ffeb3b;
}

/* Half and Half Icon */
.half-and-half-icon {
    color: #ffeb3b;
}

/* Whipped Cream Icon */
.whipped-cream-icon {
    color: #ffffff;
    text-shadow: 0 0 2px rgba(0,0,0,0.3);
}

/* Sour Cream Icon */
.sour-cream-icon {
    color: #ffeb3b;
}

/* Crème Fraîche Icon */
.creme-fraiche-icon {
    color: #ffeb3b;
}

/* Mascarpone Icon */
.mascarpone-icon {
    color: #ffeb3b;
}

/* Ricotta Icon */
.ricotta-icon {
    color: #ffeb3b;
}

/* Cottage Cheese Icon */
.cottage-cheese-icon {
    color: #ffeb3b;
}

/* Cream Cheese Icon */
.cream-cheese-icon {
    color: #ffeb3b;
}

/* Queso Fresco Icon */
.queso-fresco-icon {
    color: #ffeb3b;
}

/* Queso Blanco Icon */
.queso-blanco-icon {
    color: #ffeb3b;
}

/* Panela Icon */
.panela-icon {
    color: #795548;
}

/* Feta Icon */
.feta-icon {
    color: #ffeb3b;
}

/* Halloumi Icon */
.halloumi-icon {
    color: #ffeb3b;
}

/* Mozzarella Icon */
.mozzarella-icon {
    color: #ffeb3b;
}

/* Burrata Icon */
.burrata-icon {
    color: #ffeb3b;
}

/* Provolone Icon */
.provolone-icon {
    color: #ffeb3b;
}

/* Fontina Icon */
.fontina-icon {
    color: #ffeb3b;
}

/* Asiago Icon */
.asiago-icon {
    color: #ffeb3b;
}

/* Pecorino Icon */
.pecorino-icon {
    color: #ffeb3b;
}

/* Parmesan Icon */
.parmesan-icon {
    color: #ffeb3b;
}

/* Romano Icon */
.romano-icon {
    color: #ffeb3b;
}

/* Grana Padano Icon */
.grana-padano-icon {
    color: #ffeb3b;
}

/* Cheddar Icon */
.cheddar-icon {
    color: #ff9800;
}

/* Colby Icon */
.colby-icon {
    color: #ff9800;
}

/* Monterey Jack Icon */
.monterey-jack-icon {
    color: #ffeb3b;
}

/* Pepper Jack Icon */
.pepper-jack-icon {
    color: #ff9800;
}

/* Swiss Icon */
.swiss-icon {
    color: #ffeb3b;
}

/* Gruyere Icon */
.gruyere-icon {
    color: #ffeb3b;
}

/* Emmental Icon */
.emmental-icon {
    color: #ffeb3b;
}

/* Jarlsberg Icon */
.jarlsberg-icon {
    color: #ffeb3b;
}

/* Havarti Icon */
.havarti-icon {
    color: #ffeb3b;
}

/* Gouda Icon */
.gouda-icon {
    color: #ff9800;
}

/* Edam Icon */
.edam-icon {
    color: #ffeb3b;
}

/* Maasdam Icon */
.maasdam-icon {
    color: #ffeb3b;
}

/* Leyden Icon */
.leyden-icon {
    color: #ff9800;
}

/* Beemster Icon */
.beemster-icon {
    color: #ffeb3b;
}

/* Parrano Icon */
.parrano-icon {
    color: #ffeb3b;
}

/* Aged Gouda Icon */
.aged-gouda-icon {
    color: #ff9800;
}

/* Smoked Gouda Icon */
.smoked-gouda-icon {
    color: #795548;
}

/* Comte Icon */
.comte-icon {
    color: #ffeb3b;
}

/* Beaufort Icon */
.beaufort-icon {
    color: #ffeb3b;
}

/* Abondance Icon */
.abondance-icon {
    color: #ffeb3b;
}

/* Reblochon Icon */
.reblochon-icon {
    color: #ffeb3b;
}

/* Tomme Icon */
.tomme-icon {
    color: #ffeb3b;
}

/* Raclette Icon */
.raclette-icon {
    color: #ffeb3b;
}

/* Appenzeller Icon */
.appenzeller-icon {
    color: #ffeb3b;
}

/* Sbrinz Icon */
.sbrinz-icon {
    color: #ffeb3b;
}

/* Berner Alpkase Icon */
.berner-alpkase-icon {
    color: #ffeb3b;
}

/* Challerhocker Icon */
.challerhocker-icon {
    color: #ffeb3b;
}

/* Vacherin Icon */
.vacherin-icon {
    color: #ffeb3b;
}

/* L'Etivaz Icon */
.letivaz-icon {
    color: #ffeb3b;
}

/* Brie Icon */
.brie-icon {
    color: #ffeb3b;
}

/* Camembert Icon */
.camembert-icon {
    color: #ffeb3b;
}

/* Coulommiers Icon */
.coulommiers-icon {
    color: #ffeb3b;
}

/* Chaource Icon */
.chaource-icon {
    color: #ffeb3b;
}

/* Neufchatel Icon */
.neufchatel-icon {
    color: #ffeb3b;
}

/* Pont-l'Eveque Icon */
.pont-leveque-icon {
    color: #ffeb3b;
}

/* Livarot Icon */
.livarot-icon {
    color: #ffeb3b;
}

/* Maroilles Icon */
.maroilles-icon {
    color: #ffeb3b;
}

/* Munster Icon */
.munster-icon {
    color: #ffeb3b;
}

/* Epoisses Icon */
.epoisses-icon {
    color: #ffeb3b;
}

/* Langres Icon */
.langres-icon {
    color: #ffeb3b;
}

/* Soumaintrain Icon */
.soumaintrain-icon {
    color: #ffeb3b;
}

/* Stinking Bishop Icon */
.stinking-bishop-icon {
    color: #ffeb3b;
    animation: stinkingBishopWiggle 2s ease-in-out infinite;
}

@keyframes stinkingBishopWiggle {
    0%, 100% { transform: rotate(0deg); }
    25% { transform: rotate(5deg); }
    75% { transform: rotate(-5deg); }
}

/* Taleggio Icon */
.taleggio-icon {
    color: #ffeb3b;
}

/* Gorgonzola Icon */
.gorgonzola-icon {
    color: #2196f3;
}

/* Roquefort Icon */
.roquefort-icon {
    color: #2196f3;
}

/* Stilton Icon */
.stilton-icon {
    color: #2196f3;
}

/* Cabrales Icon */
.cabrales-icon {
    color: #2196f3;
}

/* Valdeon Icon */
.valdeon-icon {
    color: #2196f3;
}

/* Picos de Europa Icon */
.picos-de-europa-icon {
    color: #2196f3;
}

/* Cashel Blue Icon */
.cashel-blue-icon {
    color: #2196f3;
}

/* Crozier Blue Icon */
.crozier-blue-icon {
    color: #2196f3;
}

/* Dunsyre Blue Icon */
.dunsyre-blue-icon {
    color: #2196f3;
}

/* Bayley Hazen Blue Icon */
.bayley-hazen-blue-icon {
    color: #2196f3;
}

/* Rogue River Blue Icon */
.rogue-river-blue-icon {
    color: #2196f3;
}

/* Point Reyes Blue Icon */
.point-reyes-blue-icon {
    color: #2196f3;
}

/* Maytag Blue Icon */
.maytag-blue-icon {
    color: #2196f3;
}

/* Buttermilk Blue Icon */
.buttermilk-blue-icon {
    color: #2196f3;
}

/* Great Hill Blue Icon */
.great-hill-blue-icon {
    color: #2196f3;
}

/* Westfield Farm Blue Icon */
.westfield-farm-blue-icon {
    color: #2196f3;
}

/* Hook's Blue Icon */
.hooks-blue-icon {
    color: #2196f3;
}

/* Carr Valley Blue Icon */
.carr-valley-blue-icon {
    color: #2196f3;
}

/* Bleu d'Auvergne Icon */
.bleu-dauvergne-icon {
    color: #2196f3;
}

/* Bleu des Causses Icon */
.bleu-des-causses-icon {
    color: #2196f3;
}

/* Bleu de Gex Icon */
.bleu-de-gex-icon {
    color: #2196f3;
}

/* Bleu de Termignon Icon */
.bleu-de-termignon-icon {
    color: #2196f3;
}

/* Bleu du Vercors Icon */
.bleu-du-vercors-icon {
    color: #2196f3;
}

/* Fourme d'Ambert Icon */
.fourme-dambert-icon {
    color: #2196f3;
}

/* Fourme de Montbrison Icon */
.fourme-de-montbrison-icon {
    color: #2196f3;
}

/* Persille de Tignes Icon */
.persille-de-tignes-icon {
    color: #2196f3;
}

/* Persille de Savoie Icon */
.persille-de-savoie-icon {
    color: #2196f3;
}

/* Persille du Beaujolais Icon */
.persille-du-beaujolais-icon {
    color: #2196f3;
}

/* Sassenage Icon */
.sassenage-icon {
    color: #2196f3;
}

/* Bleu de Bresse Icon */
.bleu-de-bresse-icon {
    color: #2196f3;
}

/* Bleu de Laqueuille Icon */
.bleu-de-laqueuille-icon {
    color: #2196f3;
}

/* Bleu de Sassenage Icon */
.bleu-de-sassenage-icon {
    color: #2196f3;
}

/* Bleu de Septmoncel Icon */
.bleu-de-septmoncel-icon {
    color: #2196f3;
}

/* Bleu du Queyras Icon */
.bleu-du-queyras-icon {
    color: #2196f3;
}

/* Bleu de Thiezac Icon */
.bleu-de-thiezac-icon {
    color: #2196f3;
}

/* Bleu de Bassillac Icon */
.bleu-de-bassillac-icon {
    color: #2196f3;
}

/* Bleu de Chaves Icon */
.bleu-de-chaves-icon {
    color: #2196f3;
}

/* Bleu de Cocumont Icon */
.bleu-de-cocumont-icon {
    color: #2196f3;
}

/* Bleu de Lavaldens Icon */
.bleu-de-lavaldens-icon {
    color: #2196f3;
}

/* Bleu de Lignac Icon */
.bleu-de-lignac-icon {
    color: #2196f3;
}

/* Bleu de Parzac Icon */
.bleu-de-parzac-icon {
    color: #2196f3;
}

/* Bleu de Puymartin Icon */
.bleu-de-puymartin-icon {
    color: #2196f3;
}

/* Bleu de Rances Icon */
.bleu-de-rances-icon {
    color: #2196f3;
}

/* Bleu de Sainte-Foy Icon */
.bleu-de-sainte-foy-icon {
    color: #2196f3;
}

/* Bleu de Salers Icon */
.bleu-de-salers-icon {
    color: #2196f3;
}

/* Bleu des Aravis Icon */
.bleu-des-aravis-icon {
    color: #2196f3;
}

/* Bleu des Causses Icon (Duplicate) */
.bleu-des-causses-dup-icon {
    color: #2196f3;
}

/* Bleu des Hautes-Alpes Icon */
.bleu-des-hautes-alpes-icon {
    color: #2196f3;
}

/* Bleu du Haut-Jura Icon */
.bleu-du-haut-jura-icon {
    color: #2196f3;
}

/* Bleu du Languedoc Icon */
.bleu-du-languedoc-icon {
    color: #2196f3;
}

/* Bleu du Mont-Cenis Icon */
.bleu-du-mont-cenis-icon {
    color: #2196f3;
}

/* Bleu du Vercors-Sassenage Icon */
.bleu-du-vercors-sassenage-icon {
    color: #2196f3;
}

/* Persille de Tarentaise Icon */
.persille-de-tarentaise-icon {
    color: #2196f3;
}

/* Persille de Tignes Icon (Duplicate) */
.persille-de-tignes-dup-icon {
    color: #2196f3;
}

/* Persille des Aravis Icon */
.persille-des-aravis-icon {
    color: #2196f3;
}

/* Persille du Grand-Bornand Icon */
.persille-du-grand-bornand-icon {
    color: #2196f3;
}

/* Persille du Mont-Blanc Icon */
.persille-du-mont-blanc-icon {
    color: #2196f3;
}

/* Persille du Beaufortain Icon */
.persille-du-beaufortain-icon {
    color: #2196f3;
}

/* Persille de la Tarentaise Icon */
.persille-de-la-tarentaise-icon {
    color: #2196f3;
}

/* Persille des Bauges Icon */
.persille-des-bauges-icon {
    color: #2196f3;
}

/* Persille de la Vanoise Icon */
.persille-de-la-vanoise-icon {
    color: #2196f3;
}

/* Persille du Queyras Icon */
.persille-du-queyras-icon {
    color: #2196f3;
}

/* Persille des Ecrins Icon */
.persille-des-ecrins-icon {
    color: #2196f3;
}

/* Persille de l'Ubaye Icon */
.persille-de-lubaye-icon {
    color: #2196f3;
}

/* Persille du Mercantour Icon */
.persille-du-mercantour-icon {
    color: #2196f3;
}

/* Persille du Verdon Icon */
.persille-du-verdon-icon {
    color: #2196f3;
}

/* Persille de l'Izoard Icon */
.persille-de-lizoard-icon {
    color: #2196f3;
}

/* Persille du Galibier Icon */
.persille-du-galibier-icon {
    color: #2196f3;
}

/* Persille de la Meije Icon */
.persille-de-la-meije-icon {
    color: #2196f3;
}

/* Persille du Pelvoux Icon */
.persille-du-pelvoux-icon {
    color: #2196f3;
}

/* Persille de l'Oisans Icon */
.persille-de-loisans-icon {
    color: #2196f3;
}

/* Persille du Soreiller Icon */
.persille-du-soreiller-icon {
    color: #2196f3;
}

/* Persille de la Berarde Icon */
.persille-de-la-berarde-icon {
    color: #2196f3;
}

/* Persille du Rateau Icon */
.persille-du-rateau-icon {
    color: #2196f3;
}

/* Persille de la Muzelle Icon */
.persille-de-la-muzelle-icon {
    color: #2196f3;
}

/* Persille du Sirac Icon */
.persille-du-sirac-icon {
    color: #2196f3;
}

/* Persille de l'Obiou Icon */
.persille-de-lobiou-icon {
    color: #2196f3;
}

/* Persille de l'Ailefroide Icon */
.persille-de-lailefroide-icon {
    color: #2196f3;
}

/* Persille du Bure Icon */
.persille-du-bure-icon {
    color: #2196f3;
}

/* Persille du Gerbier Icon */
.persille-du-gerbier-icon {
    color: #2196f3;
}

/* Persille de la Dora Icon */
.persille-de-la-dora-icon {
    color: #2196f3;
}

/* Persille du Thabor Icon */
.persille-du-thabor-icon {
    color: #2196f3;
}

/* Persille de la Meije Icon (Duplicate) */
.persille-de-la-meije-dup-icon {
    color: #2196f3;
}

/* Persille du Rateau Icon (Duplicate) */
.persille-du-rateau-dup-icon {
    color: #2196f3;
}

/* Persille de la Muzelle Icon (Duplicate) */
.persille-de-la-muzelle-dup-icon {
    color: #2196f3;
}

/* Persille du Sirac Icon (Duplicate) */
.persille-du-sirac-dup-icon {
    color: #2196f3;
}

/* Persille de l'Obiou Icon (Duplicate) */
.persille-de-lobiou-dup-icon {
    color: #2196f3;
}

/* Persille de l'Ailefroide Icon (Duplicate) */
.persille-de-lailefroide-dup-icon {
    color: #2196f3;
}

/* Persille du Bure Icon (Duplicate) */
.persille-du-bure-dup-icon {
    color: #2196f3;
}

/* Persille du Gerbier Icon (Duplicate) */
.persille-du-gerbier-dup-icon {
    color: #2196f3;
}

/* Persille de la Dora Icon (Duplicate) */
.persille-de-la-dora-dup-icon {
    color: #2196f3;
}

/* Persille du Thabor Icon (Duplicate) */
.persille-du-thabor-dup-icon {
    color: #2196f3;
}

/* Avokado Icon (Special) */
.avokado-icon {
    color: var(--avocado-green);
    animation: avokadoWiggle 3s ease-in-out infinite;
}

@keyframes avokadoWiggle {
    0%, 100% { transform: rotate(-5deg); }
    50% { transform: rotate(5deg); }
}

/* Avokado Half Icon */
.avokado-half-icon {
    color: var(--avocado-light);
}

/* Avokado Seed Icon */
.avokado-seed-icon {
    color: #795548;
}

/* Avokado Toast Icon */
.avokado-toast-icon {
    color: var(--avocado-green);
}

/* Avokado Oil Icon */
.avokado-oil-icon {
    color: var(--avocado-light);
}

/* Avokado Leaf Icon */
.avokado-leaf-icon {
    color: var(--avocado-dark);
    animation: leafRustle 4s ease-in-out infinite;
}

@keyframes leafRustle {
    0%, 100% { transform: rotate(0deg); }
    25% { transform: rotate(3deg); }
    75% { transform: rotate(-3deg); }
}

.category-card img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    transition: transform 0.3s;
}

.category-card:hover img {
    transform: scale(1.1);
}

.category-card .category-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(transparent, rgba(0,0,0,0.7));
    padding: 20px;
}

.category-card .category-name {
    color: white;
    font-weight: 600;
    font-size: 1.1rem;
}

/* Full Width Banner */
.fullwidth-banner {
    position: relative;
    border-radius: var(--border-radius);
    overflow: hidden;
    margin: 2rem 0;
}

.fullwidth-banner img {
    width: 100%;
    height: 200px;
    object-fit: cover;
}

/* Product List Page */
.filter-sidebar {
    background: white;
    border-radius: var(--border-radius);
    padding: 20px;
}

.filter-group {
    margin-bottom: 20px;
}

.filter-group h6 {
    font-weight: 600;
    margin-bottom: 10px;
}

.filter-checkbox {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
}

.filter-checkbox input {
    margin-right: 8px;
}

.sort-bar {
    background: white;
    border-radius: var(--border-radius);
    padding: 15px;
    margin-bottom: 20px;
}

/* Product Detail */
.product-gallery {
    background: white;
    border-radius: var(--border-radius);
    padding: 20px;
}

.product-gallery .main-image {
    position: relative;
    padding-top: 100%;
    overflow: hidden;
    border-radius: var(--border-radius);
}

.product-gallery .main-image img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.product-gallery .thumbnail-list {
    display: flex;
    gap: 10px;
    margin-top: 15px;
    overflow-x: auto;
}

.product-gallery .thumbnail {
    width: 80px;
    height: 80px;
    border-radius: 4px;
    cursor: pointer;
    border: 2px solid transparent;
    object-fit: cover;
}

.product-gallery .thumbnail.active {
    border-color: var(--primary-color);
}

.product-info-detail {
    background: white;
    border-radius: var(--border-radius);
    padding: 20px;
}

.product-info-detail .product-name {
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 10px;
}

.product-info-detail .rating {
    color: #ffc107;
    margin-bottom: 15px;
}

.product-info-detail .price-section {
    margin-bottom: 20px;
}

.product-info-detail .current-price {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--primary-color);
}

.product-info-detail .original-price {
    font-size: 1.1rem;
    color: var(--secondary-color);
    text-decoration: line-through;
    margin-left: 10px;
}

.product-info-detail .stock-status {
    margin-bottom: 20px;
}

.product-info-detail .stock-status.in-stock {
    color: var(--primary-color);
}

.product-info-detail .stock-status.out-of-stock {
    color: #dc3545;
}

.variant-group {
    margin-bottom: 15px;
}

.variant-group label {
    font-weight: 600;
    margin-bottom: 8px;
    display: block;
}

.variant-options {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.variant-btn {
    padding: 8px 16px;
    border: 2px solid #dee2e6;
    background: white;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.3s;
}

.variant-btn:hover,
.variant-btn.active {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.variant-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Quantity Header and Selector Alignment */
.quantity-header {
    width: 120px;
    text-align: center;
}

.quantity-selector {
    display: flex;
    align-items: center;
    border: 2px solid #dee2e6;
    border-radius: 4px;
    width: 120px;
    background: white;
    overflow: hidden;
}

.quantity-selector button {
    border: none;
    background: #f8f9fa;
    padding: 0;
    width: 35px;
    height: 35px;
    min-width: 35px;
    min-height: 35px;
    cursor: pointer;
    font-size: 1.2rem;
    line-height: 1;
    color: #495057;
    transition: background 0.2s;
    flex: 0 0 35px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.quantity-selector button i {
    font-size: 1.2rem;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
}

.quantity-selector button:hover {
    background: #e9ecef;
}

.quantity-selector input {
    border: none;
    border-left: 1px solid #dee2e6;
    border-right: 1px solid #dee2e6;
    width: 50px;
    text-align: center;
    font-weight: 600;
    padding: 8px 0;
    background: white;
    flex: 1;
}

/* Cart Page */
.cart-table {
    background: white;
    border-radius: var(--border-radius);
}

.cart-table th {
    background: #f8f9fa;
    font-weight: 600;
}

.cart-table td {
    vertical-align: middle;
}

.cart-item-image {
    width: 80px;
    height: 80px;
    object-fit: cover;
    border-radius: 4px;
}

.cart-summary {
    background: white;
    border-radius: var(--border-radius);
    padding: 20px;
}

.cart-summary .summary-row {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
}

.cart-summary .summary-row.total {
    font-size: 1.2rem;
    font-weight: 700;
    border-top: 2px solid #dee2e6;
    padding-top: 10px;
    margin-top: 10px;
}

/* Checkout Page */
.checkout-section {
    background: white;
    border-radius: var(--border-radius);
    padding: 25px;
    margin-bottom: 20px;
}

.checkout-section h5 {
    font-weight: 700;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid #dee2e6;
}

.address-card {
    border: 2px solid #dee2e6;
    border-radius: var(--border-radius);
    padding: 15px;
    cursor: pointer;
    transition: all 0.3s;
}

.address-card:hover,
.address-card.selected {
    border-color: var(--primary-color);
}

.payment-method {
    border: 2px solid #dee2e6;
    border-radius: var(--border-radius);
    padding: 15px;
    cursor: pointer;
    transition: all 0.3s;
    display: flex;
    align-items: center;
    gap: 10px;
}

.payment-method:hover,
.payment-method.selected {
    border-color: var(--primary-color);
}

/* User Panel */
.user-sidebar {
    background: white;
    border-radius: var(--border-radius);
    padding: 20px;
    position: sticky;
    top: 100px;
    height: fit-content;
    max-height: calc(100vh - 120px);
    overflow-y: auto;
}

.user-sidebar .nav-link {
    color: var(--dark-color);
    padding: 12px 15px;
    border-radius: 4px;
    margin-bottom: 5px;
}

.user-sidebar .nav-link:hover,
.user-sidebar .nav-link.active {
    background: var(--primary-color);
    color: white !important;
}

.user-sidebar .nav-link i {
    margin-right: 10px;
}

.user-content {
    background: white;
    border-radius: var(--border-radius);
    padding: 25px;
}

/* Order List */
.order-card {
    background: white;
    border-radius: var(--border-radius);
    border: 1px solid #dee2e6;
    margin-bottom: 15px;
    overflow: hidden;
}

.order-card .order-header {
    background: #f8f9fa;
    padding: 15px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.order-card .order-body {
    padding: 20px;
}

.order-status {
    padding: 5px 12px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
}

.order-status.pending { background: #fff3cd; color: #856404; }
.order-status.processing { background: #cce5ff; color: #004085; }
.order-status.shipped { background: #d1ecf1; color: #0c5460; }
.order-status.delivered { background: #d4edda; color: #155724; }
.order-status.cancelled { background: #f8d7da; color: #721c24; }

/* Reviews */
.review-card {
    background: white;
    border-radius: var(--border-radius);
    padding: 20px;
    margin-bottom: 15px;
}

.review-card .review-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

.review-card .reviewer-name {
    font-weight: 600;
}

.review-card .review-date {
    color: var(--secondary-color);
    font-size: 0.85rem;
}

.review-card .verified-badge {
    background: var(--primary-color);
    color: white;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 0.7rem;
    margin-left: 10px;
}

.rating-stars {
    color: #ffc107;
}

/* Footer */
/* Footer - Avokado Koyu */
.footer {
    background: linear-gradient(180deg, #1b2e0f 0%, #2d5016 50%, #1b2e0f 100%);
    color: white;
    padding: 4rem 0 2rem;
    margin-top: 4rem;
    position: relative;
}

.footer::before {
    content: '🥑';
    position: absolute;
    top: -25px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 3rem;
    background: white;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: var(--shadow-lg);
}

.footer h5,
.footer h6 {
    font-weight: 700;
    margin-bottom: 1.5rem;
    color: var(--avocado-lime);
}

.footer a {
    color: rgba(255, 255, 255, 0.85);
    text-decoration: none;
    transition: all var(--transition-fast);
}

.footer a:hover {
    color: var(--avocado-yellow);
    padding-left: 5px;
}

.newsletter {
    background: var(--primary-gradient) !important;
    padding: 3rem 0;
    margin-top: 0;
    position: relative;
    overflow: hidden;
}

.newsletter::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: 
        radial-gradient(3px 3px at 15% 25%, rgba(255,255,255,0.9) 50%, transparent 50%),
        radial-gradient(2px 2px at 35% 65%, rgba(255,255,255,0.7) 50%, transparent 50%),
        radial-gradient(4px 4px at 55% 15%, rgba(255,255,255,0.8) 50%, transparent 50%),
        radial-gradient(2px 2px at 75% 45%, rgba(255,255,255,0.6) 50%, transparent 50%),
        radial-gradient(3px 3px at 25% 85%, rgba(255,255,255,0.85) 50%, transparent 50%),
        radial-gradient(2px 2px at 65% 35%, rgba(255,255,255,0.75) 50%, transparent 50%),
        radial-gradient(4px 4px at 85% 75%, rgba(255,255,255,0.7) 50%, transparent 50%),
        radial-gradient(2px 2px at 45% 55%, rgba(255,255,255,0.8) 50%, transparent 50%),
        radial-gradient(3px 3px at 5% 45%, rgba(255,255,255,0.9) 50%, transparent 50%),
        radial-gradient(2px 2px at 95% 15%, rgba(255,255,255,0.6) 50%, transparent 50%),
        radial-gradient(3px 3px at 50% 90%, rgba(255,255,255,0.75) 50%, transparent 50%),
        radial-gradient(2px 2px at 10% 70%, rgba(255,255,255,0.8) 50%, transparent 50%);
    background-size: 250px 250px;
    animation: floatParticles 20s linear infinite;
    pointer-events: none;
}

.newsletter::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: 
        radial-gradient(2px 2px at 20% 30%, rgba(197,216,109,0.6) 50%, transparent 50%),
        radial-gradient(3px 3px at 60% 70%, rgba(197,216,109,0.5) 50%, transparent 50%),
        radial-gradient(2px 2px at 80% 20%, rgba(197,216,109,0.4) 50%, transparent 50%),
        radial-gradient(3px 3px at 40% 80%, rgba(197,216,109,0.6) 50%, transparent 50%);
    background-size: 350px 350px;
    animation: floatParticles 25s linear infinite reverse;
    pointer-events: none;
    opacity: 0.7;
}

@keyframes floatParticles {
    0% {
        background-position: 0 0;
    }
    100% {
        background-position: 250px 250px;
    }
}

/* Alerts - Avokado Stil */
.alert {
    border-radius: var(--radius-md);
    border: none;
    padding: 1rem 1.5rem;
    font-weight: 500;
}

.alert-success {
    background: rgba(139, 195, 74, 0.15);
    color: #2d5016;
    border-left: 4px solid #4a7c2e;
}

.alert-danger {
    background: rgba(216, 67, 21, 0.1);
    color: #d84315;
    border-left: 4px solid #ff5722;
}

/* Buttons - Avokado Stil */
.btn {
    border-radius: var(--radius-md);
    font-weight: 600;
    padding: 0.75rem 1.5rem;
    transition: all var(--transition-fast);
    border: none;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-size: 0.9rem;
}

.btn-success {
    background: var(--success-gradient);
    box-shadow: 0 4px 15px rgba(45, 80, 22, 0.3);
}

.btn-primary {
    background: var(--primary-gradient);
    box-shadow: 0 4px 15px rgba(74, 124, 46, 0.3);
}

.btn-danger {
    background: linear-gradient(135deg, #d84315 0%, #ff5722 100%);
    box-shadow: 0 4px 15px rgba(216, 67, 21, 0.3);
}

.btn:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow-lg);
    filter: brightness(1.05);
}

.btn:active {
    transform: translateY(-1px);
}

/* Forms - Modern */
.form-control,
.form-select {
    border-radius: var(--radius-full);
    border: 3px solid #6b9b3a;
    padding: 0.875rem 1.25rem;
    font-weight: 500;
    background: #ffffff;
    color: #212529;
    transition: all var(--transition-fast);
    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}

.form-control:focus,
.form-select:focus {
    border-color: #4a7c2e;
    box-shadow: 0 0 0 4px rgba(107, 155, 58, 0.25), 0 4px 12px rgba(0,0,0,0.15);
    background: #ffffff;
    color: #212529;
    outline: none;
}

.form-control::placeholder {
    color: #6c757d;
}

.input-group {
    box-shadow: var(--shadow-md);
    border-radius: var(--radius-full);
    overflow: hidden;
    transition: all var(--transition-fast);
}

.input-group:focus-within {
    box-shadow: var(--shadow-glow);
}

.btn-success {
    background: var(--success-gradient);
    border: none;
    padding: 0.75rem 1.5rem;
    font-weight: 600;
    border-radius: 0 var(--radius-full) var(--radius-full) 0;
}

/* Breadcrumb - Modern */
.breadcrumb {
    background: white;
    border-radius: var(--radius-md);
    padding: 1rem 1.5rem;
    box-shadow: var(--shadow-sm);
}

.breadcrumb-item a {
    color: var(--avocado-medium);
    font-weight: 600;
    text-decoration: none;
}

/* Empty State - Modern */
.empty-state {
    text-align: center;
    padding: 4rem 2rem;
    background: white;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-md);
}

.empty-state i {
    font-size: 5rem;
    background: var(--success-gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    margin-bottom: 1.5rem;
}

/* Loading Animation */
.spinner-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(5px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

/* Responsive */
@media (max-width: 991px) {
    .navbar-collapse {
        background: white;
        padding: 1rem;
        border-radius: var(--radius-lg);
        box-shadow: var(--shadow-lg);
        margin-top: 1rem;
    }
    
    .navbar-nav {
        flex-direction: row !important;
        flex-wrap: wrap;
        justify-content: center;
        gap: 0.5rem;
    }
    
    .navbar-nav .nav-item {
        width: auto;
    }
    
    .navbar-nav .nav-link {
        padding: 0.5rem 1rem !important;
        font-size: 0.9rem;
    }
    
    .navbar-nav .btn {
        margin: 0 !important;
    }
    
    .nav-link .fs-4 {
        font-size: 1.5rem !important;
    }
    
    .dropdown-menu {
        position: absolute !important;
        right: 0;
    }
    
    /* Mobile Sidebar Overlay */
    .mobile-sidebar-overlay {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0,0,0,0.5);
        z-index: 1040;
    }
    
    .mobile-sidebar-overlay.active {
        display: block;
    }
}
    
/* Mobile Sidebar Close Button */
.sidebar-close-btn {
    display: none;
}

@media (max-width: 991px) {
    .sidebar-close-btn {
        display: block;
        position: absolute;
        top: 10px;
        right: 10px;
        background: none;
        border: none;
        font-size: 1.5rem;
        color: var(--gray-600);
        z-index: 1060;
        cursor: pointer;
    }
    
    /* Smaller and Centered Search on Mobile */
    .navbar .input-group {
        max-width: 180px;
        margin: 0 auto;
    }
    
    .navbar form.d-flex {
        justify-content: center;
        margin: 0.5rem auto !important;
        width: 100%;
    }
    
    .navbar .form-control {
        padding: 0.5rem 0.75rem;
        font-size: 0.9rem;
    }
    
    .navbar .btn-success {
        padding: 0.5rem 0.75rem;
    }
}

/* Mobile - Small devices (768px and down) */
@media (max-width: 768px) {
    .home-slider .carousel-item {
        height: 250px;
    }
    
    .product-card .product-image {
        height: 150px;
    }
    
    .product-card .product-price {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        justify-content: flex-start;
        gap: 4px;
        margin-bottom: 0.5rem;
        position: relative;
        padding-top: 18px;
    }
    
    .product-card .current-price {
        font-size: 1rem;
        white-space: nowrap;
    }
    
    .product-card .product-price .unit-info {
        white-space: nowrap;
        font-size: 0.82rem;
    }
    
    .product-card .original-price {
        font-size: 0.75rem;
        position: absolute;
        top: 0;
        right: 0;
        text-decoration: line-through;
        color: #dc3545 !important;
        font-weight: 600;
        background: rgba(255,255,255,0.9);
        padding: 2px 4px;
        border-radius: 4px;
    }
    
    .section-title {
        font-size: 1.25rem;
    }
    
    .user-sidebar {
        margin-bottom: 20px;
    }
    
    .cart-table {
        font-size: 0.85rem;
    }
    
    .cart-table th:nth-child(3),
    .cart-table td:nth-child(3) {
        white-space: nowrap;
        min-width: 70px;
    }
    
    .cart-item-image {
        width: 60px;
        height: 60px;
    }
}

/* Animations */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

.fade-in {
    animation: fadeIn 0.3s ease-out;
}

/* Mobile Horizontal Account Nav */
.mobile-account-nav {
    flex-wrap: nowrap;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
}

.mobile-account-nav::-webkit-scrollbar {
    height: 4px;
}

.mobile-account-nav::-webkit-scrollbar-thumb {
    background: var(--avocado-medium);
    border-radius: 2px;
}

.mobile-account-nav .btn-sm {
    flex-shrink: 0;
    border-radius: var(--radius-md);
    font-weight: 500;
    padding: 0.75rem 1rem;
    font-size: 0.95rem;
}

.mobile-account-nav .btn-success {
    background: var(--success-gradient);
    border: none;
}

/* Mobile Sidebar Dropdown - DEPRECATED */
.mobile-sidebar-dropdown {
    display: none;
}

/* Hide sticky sidebar on mobile */
@media (max-width: 991px) {
    .user-sidebar {
        position: static !important;
        max-height: none !important;
        overflow-y: visible !important;
    }
}

/* ============================================
   HOME SLIDER STYLES
   ============================================ */
.home-slider {
    height: 500px;
    min-height: auto;
    background: var(--avocado-dark, #2d5016);
    border: none !important;
    border-radius: 0 !important;
    overflow: hidden;
    position: relative;
}

.home-slider .carousel,
.home-slider .carousel-inner {
    height: 100%;
}

.home-slider .carousel-item {
    height: 100%;
    position: relative;
}

.home-slider .carousel-item img {
    object-fit: cover;
    height: 100%;
    width: 100%;
    transform: scale(1);
    transition: transform 6s ease;
}

.home-slider .carousel-item.active img {
    transform: scale(1.05);
}

/* ============================================
   MOBILE RESPONSIVE STYLES
   ============================================ */

/* Mobile - Small devices (phones, 576px and down) */
@media (max-width: 576px) {
    /* Top Banner */
    .top-banner,
    .top-banner-marquee {
        height: 36px !important;
        line-height: 36px !important;
        font-size: 13px !important;
    }
    
    .marquee-content {
        animation-duration: 12s !important;
        font-size: 12px;
    }
    
    /* Home Slider */
    .home-slider .carousel-caption {
        padding: 15px;
    }
    
    .home-slider .carousel-caption h2 {
        font-size: 1.5rem;
    }
    
    .home-slider .carousel-caption p {
        font-size: 0.9rem;
    }
    
    /* Navbar */
    .navbar-brand {
        font-size: 1.3rem;
    }
    
    .navbar-collapse {
        background: white;
        padding: 15px;
        border-radius: 10px;
        box-shadow: 0 5px 20px rgba(0,0,0,0.1);
        margin-top: 10px;
        z-index: 2000;
        position: relative;
    }
    
    .navbar-nav {
        text-align: center;
    }
    
    .navbar-nav .nav-link {
        padding: 10px 0;
        border-bottom: 1px solid #eee;
    }
    
    /* Search in mobile menu */
    .navbar-collapse form {
        margin: 15px 0;
        justify-content: center;
    }
    
    .navbar-collapse .input-group-sm {
        width: 100%;
        max-width: 250px;
    }
    
    .navbar-collapse .form-control-sm {
        width: 100% !important;
    }
    
    /* Footer */
    .footer .row {
        text-align: center;
    }
    
    .footer .social-links {
        justify-content: center;
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }
    
    .footer .col-auto {
        width: 100%;
        min-width: auto !important;
        margin-bottom: 25px;
    }
    
    .footer h6 {
        margin-bottom: 15px;
    }
    
    /* Products Grid */
    .product-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
        align-items: stretch;
    }
    
    .product-card {
        display: flex;
        flex-direction: column;
        height: 100%;
    }
    
    .product-card .product-info {
        display: flex;
        flex-direction: column;
        flex-grow: 1;
        padding: 0.75rem;
    }
    
    .product-card .card-title {
        font-size: 0.9rem;
        margin-bottom: 0.5rem;
    }
    
    .product-card .price {
        font-size: 1rem;
    }
    
    .product-card .add-to-cart {
        margin-top: auto;
        width: 100%;
    }
    
    /* Cart Table */
    .cart-table {
        font-size: 0.85rem;
    }
    
    .cart-table .product-thumbnail {
        width: 60px;
        height: 60px;
    }
    
    /* Checkout */
    .checkout-container .row {
        flex-direction: column-reverse;
    }
    
    /* Banner Positions */
    .banner-position-home_hero,
    .banner-position-category_top,
    .banner-position-product_bottom {
        margin: 10px 0;
    }
    
    .banner-position-home_hero img,
    .banner-position-category_top img,
    .banner-position-product_bottom img {
        max-height: 200px;
        object-fit: cover;
    }
    
    /* Categories */
    .category-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    
    /* General Container */
    .container {
        padding-left: 10px;
        padding-right: 10px;
    }
    
    /* Newsletter */
    .newsletter h4 {
        font-size: 1.2rem;
        text-align: center;
    }
    
    .newsletter form {
        flex-direction: column;
        gap: 10px;
    }
    
    .newsletter .form-control,
    .newsletter .btn {
        width: 100%;
    }
    
    /* Mobile Menu Icons */
    .navbar-nav .nav-link i {
        font-size: 1.2rem;
        margin-right: 8px;
    }
    
    /* Blog sidebar z-index fix - mobilde menünün altında kalsın */
    .filter-sidebar.sticky-top {
        z-index: 1 !important;
    }
    
    /* User Menu Mobile */
    .dropdown-menu {
        width: 100%;
        text-align: center;
    }
}

/* Mobile - Medium devices (tablets, 768px and down) */
@media (max-width: 768px) {
    /* Home Slider */
    .home-slider {
        height: 300px !important;
        min-height: auto !important;
    }
    
    .home-slider .carousel-caption h2 {
        font-size: 1.8rem;
    }
    
    /* Footer Columns */
    .footer .col-lg-auto .row {
        flex-wrap: wrap;
        justify-content: center;
    }
    
    .footer .col-auto {
        min-width: 140px;
        flex: 0 0 auto;
    }
    
    /* Products */
    .product-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    /* Navbar Center Links */
    .navbar-collapse {
        justify-content: flex-start !important;
    }
    
    .navbar-collapse > div:first-child {
        display: none;
    }
    
    .navbar-nav.mx-auto {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100%;
    }
    
    /* Header Right Menu */
    .navbar-collapse .d-flex.align-items-center {
        flex-direction: column;
        width: 100%;
        gap: 15px;
    }
    
    .navbar-collapse .navbar-nav {
        flex-direction: row;
        justify-content: center;
        gap: 20px;
    }
}

/* Mobile - Large devices (992px and down) */
@media (max-width: 992px) {
    /* Home Slider */
    .home-slider {
        height: 350px !important;
        min-height: auto !important;
    }
    
    /* Top Banner */
    .top-banner,
    .top-banner-marquee {
        font-size: 14px;
    }
    
    /* Footer */
    .footer .col-lg-3 {
        text-align: center;
        margin-bottom: 30px;
    }
    
    .footer .social-links {
        justify-content: center;
    }
    
    /* Banner Positions */
    .banner-grid-2 {
        grid-template-columns: 1fr !important;
    }
    
    .banner-grid-3 {
        grid-template-columns: 1fr !important;
    }
    
    .banner-grid-4 {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

/* General Mobile Optimizations */
@media (max-width: 991px) {
    /* Touch-friendly buttons */
    .btn {
        min-height: 44px;
    }
    
    .nav-link {
        min-height: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    /* Form inputs */
    .form-control {
        min-height: 44px;
        font-size: 16px; /* Prevents zoom on iOS */
    }
    
    /* Prevent horizontal scroll */
    body {
        overflow-x: hidden;
    }
    
    /* Images responsive */
    img {
        max-width: 100%;
        height: auto;
    }
    
    /* Tables scrollable */
    .table-responsive {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    
    /* Better spacing */
    .py-5 {
        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
    }
    
    .my-5 {
        margin-top: 2rem !important;
        margin-bottom: 2rem !important;
    }
}

/* Mobile-specific helper classes */
.mobile-only {
    display: none;
}

.desktop-only {
    display: block;
}

@media (max-width: 768px) {
    .mobile-only {
        display: block;
    }
    
    .desktop-only {
        display: none !important;
    }
    
    .text-center-mobile {
        text-align: center !important;
    }
    
    .w-100-mobile {
        width: 100% !important;
    }
    
    .mb-3-mobile {
        margin-bottom: 1rem !important;
    }
}

/* Fix iOS Safari 100vh issue */
@supports (-webkit-touch-callout: none) {
    .home-slider {
        height: -webkit-fill-available !important;
    }
}

/* Checkout Summary Row */
.summary-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
}

.summary-row span:last-child {
    text-align: right;
    min-width: 100px;
}

/* ============================================================
   MOBİL BANNER DÜZENLEMELERİ
   ============================================================ */

/* Mobil carousel kontrol butonları - ortada ve yatayda */
@media (max-width: 768px) {
    .home-slider {
        height: 280px !important;
        min-height: auto !important;
    }
    
    .home-slider .carousel,
    .home-slider .carousel-inner,
    .home-slider .carousel-item {
        height: 100% !important;
    }
    
    .home-slider .carousel-control-prev,
    .home-slider .carousel-control-next {
        position: absolute;
        top: 50% !important;
        transform: translateY(-50%) !important;
        width: 44px !important;
        height: 44px;
        background: rgba(255, 255, 255, 0.9);
        border-radius: 50%;
        opacity: 0.9;
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 20;
        bottom: auto !important;
    }
    
    .home-slider .carousel-control-prev {
        left: 10px !important;
        right: auto !important;
    }
    
    .home-slider .carousel-control-next {
        right: 10px !important;
        left: auto !important;
    }
    
    /* İkon boyutları */
    .home-slider .carousel-control-prev-icon,
    .home-slider .carousel-control-next-icon {
        width: 20px !important;
        height: 20px !important;
        background-size: 100%;
        filter: invert(1) grayscale(100%) brightness(40%);
    }
    
    /* Alttaki gereksiz boşluğu kaldır */
    .home-slider {
        margin-bottom: 0 !important;
    }
    
    .home-slider .carousel-inner {
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;
    }
    
    /* Carousel indicators pozisyonu */
    .home-slider .carousel-indicators {
        bottom: 10px;
        margin-bottom: 0;
    }
    
    /* Carousel caption mobilde daha kompakt */
    .home-slider .carousel-caption {
        padding: 8px 12px !important;
    }
    
    .home-slider .carousel-caption h2 {
        font-size: 1.2rem !important;
    }
    
    .home-slider .carousel-caption p {
        font-size: 0.9rem !important;
    }
    
    /* Banner butonları mobilde çok daha minimal */
    .home-slider .carousel-caption .btn {
        padding: 3px 8px !important;
        font-size: 0.7rem !important;
        min-height: 24px !important;
        height: auto !important;
        line-height: 1.2 !important;
        border-radius: 4px !important;
    }
    
    .home-slider .carousel-caption .btn-lg {
        padding: 4px 10px !important;
        font-size: 0.75rem !important;
    }
    
    /* Ürün kartı fiyatı mobilde sağa hizalı */
    .product-card .product-price {
        justify-content: flex-end !important;
    }
}

/* Gereksiz boşlukları kaldır - tüm ekran boyutları için */
.home-slider {
    margin: 0 !important;
    padding: 0 !important;
}

.home-slider .carousel-inner {
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
}

.home-slider .carousel-item {
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
}

/* ============================================================
   YENİ TASARIM BLOĞU — Geri almak için style.css.bak kullanın
   ============================================================ */

/* --- Gradient Butonlar --- */
.btn-success {
    background: linear-gradient(135deg, #4a7c2e 0%, #7cb342 100%) !important;
    border: none !important;
    color: #fff !important;
    font-weight: 600;
    letter-spacing: 0.01em;
    box-shadow: 0 4px 14px rgba(74, 124, 46, 0.25);
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}
.btn-success:hover, .btn-success:focus {
    background: linear-gradient(135deg, #3a6422 0%, #689f38 100%) !important;
    box-shadow: 0 6px 20px rgba(74, 124, 46, 0.38);
    transform: translateY(-2px);
    color: #fff !important;
}
.btn-success:active {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(74, 124, 46, 0.2) !important;
}

.btn-primary {
    background: linear-gradient(135deg, #2d5016 0%, #4a7c2e 100%) !important;
    border: none !important;
    color: #fff !important;
    font-weight: 600;
    box-shadow: 0 4px 14px rgba(45, 80, 22, 0.25);
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}
.btn-primary:hover, .btn-primary:focus {
    background: linear-gradient(135deg, #1f3a0f 0%, #3a6422 100%) !important;
    box-shadow: 0 6px 20px rgba(45, 80, 22, 0.38);
    transform: translateY(-2px);
    color: #fff !important;
}
.btn-primary:active {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(45, 80, 22, 0.2) !important;
}

.btn-outline-success {
    border: 2px solid #4a7c2e !important;
    color: #4a7c2e !important;
    font-weight: 600;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    background: transparent !important;
}
.btn-outline-success:hover, .btn-outline-success:focus {
    background: linear-gradient(135deg, #4a7c2e 0%, #7cb342 100%) !important;
    color: #fff !important;
    border-color: transparent !important;
    box-shadow: 0 4px 14px rgba(74, 124, 46, 0.28);
    transform: translateY(-2px);
}

/* Tüm butonlara yuvarlak köşe */
.btn {
    border-radius: 50px !important;
    padding-left: 1.4rem;
    padding-right: 1.4rem;
}
.btn-sm {
    padding-left: 0.85rem;
    padding-right: 0.85rem;
}
.btn-lg {
    padding-left: 2rem;
    padding-right: 2rem;
}

/* --- Kartlar --- */
.card {
    border: 1.5px solid #edf4e6 !important;
    border-radius: 16px !important;
    box-shadow: 0 2px 10px rgba(45, 80, 22, 0.06);
    transition: box-shadow 0.25s ease, transform 0.25s ease, border-color 0.25s ease;
}
.card:hover {
    box-shadow: 0 8px 28px rgba(45, 80, 22, 0.13);
    transform: translateY(-3px);
    border-color: #c5e1a5 !important;
}

/* Ürün kartları — resim zoom */
.product-card .card-img-top,
.product-card img {
    border-radius: 14px 14px 0 0;
    transition: transform 0.35s ease;
    overflow: hidden;
}
.product-card:hover .card-img-top,
.product-card:hover img {
    transform: scale(1.04);
}
.product-card {
    overflow: hidden;
}

/* --- Formlar & Input'lar --- */
.form-control, .form-select {
    border-radius: 10px !important;
    border: 1.5px solid #d4e6c3 !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.form-control:focus, .form-select:focus {
    border-color: #7cb342 !important;
    box-shadow: 0 0 0 3px rgba(124, 179, 66, 0.18) !important;
    outline: none;
}

/* --- Badges --- */
.badge.bg-success {
    background: linear-gradient(135deg, #4a7c2e, #7cb342) !important;
}
.badge.bg-primary {
    background: linear-gradient(135deg, #2d5016, #4a7c2e) !important;
}

/* --- Navbar & Linkler --- */
.nav-link:hover {
    color: #4a7c2e !important;
}

/* --- Breadcrumb --- */
.breadcrumb-item.active {
    color: #4a7c2e;
    font-weight: 500;
}
.breadcrumb-item a {
    color: #7cb342;
    text-decoration: none;
    transition: color 0.2s;
}
.breadcrumb-item a:hover {
    color: #4a7c2e;
}

/* --- Sayfalama --- */
.page-item.active .page-link {
    background: linear-gradient(135deg, #4a7c2e, #7cb342) !important;
    border-color: transparent !important;
    border-radius: 8px;
}
.page-link {
    border-radius: 8px !important;
    margin: 0 2px;
    color: #4a7c2e;
    border-color: #d4e6c3;
    transition: all 0.2s ease;
}
.page-link:hover {
    background: #f4fbec;
    color: #4a7c2e;
    border-color: #7cb342;
    transform: translateY(-1px);
}

/* --- Alert'ler --- */
.alert {
    border-radius: 14px !important;
    border: none !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.07);
}
.alert-success {
    background: linear-gradient(135deg, #f4fbec, #e8f5d9) !important;
    color: #2d5016 !important;
}
.alert-danger {
    background: #fff5f5 !important;
    color: #c0392b !important;
}
.alert-warning {
    background: #fffbf0 !important;
    color: #856404 !important;
}
.alert-info {
    background: #f0f8ff !important;
    color: #0c5460 !important;
}

/* --- Tablo header --- */
.table thead th {
    background: linear-gradient(135deg, #f4fbec, #e8f5d9);
    color: #2d5016;
    font-weight: 600;
    border-color: #c5e1a5;
}

/* --- Card-header'ları --- */
.card-header.bg-white {
    border-bottom: 2px solid #edf4e6 !important;
}

/* --- Genel kaydırma çubuğu --- */
::-webkit-scrollbar { width: 7px; height: 7px; }
::-webkit-scrollbar-track { background: #f4fbec; }
::-webkit-scrollbar-thumb {
    background: linear-gradient(#7cb342, #4a7c2e);
    border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover { background: #4a7c2e; }

/* ============================================================
   YENİ TASARIM BLOĞU SONU
   ============================================================ */