/* Home Page Styles */

/* Banner Carousel */
#homeBannerCarousel {
    height: auto !important;
    min-height: 0 !important;
}
#homeBannerCarousel .carousel-inner {
    height: auto !important;
}
#homeBannerCarousel .carousel-item img {
    height: auto !important;
}

/* Flash Sale Section */
.flash-sale-header {
    background-color: #ffc107;
}
.flash-sale-body {
    background-color: #ffdf7e;
}

/* Product Card Improvements */
.img-square-container {
    aspect-ratio: 1/1;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background-color: #fff;
}
.img-square-container img {
    max-height: 100%;
    width: auto;
    object-fit: contain;
}

/* Typography & Layout */
.text-truncate-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 2.8em;
    line-height: 1.4em;
}

.letter-spacing-1 {
    letter-spacing: 1px;
}

.transition-all {
    transition: all 0.3s ease;
}

.hover-opacity-100:hover {
    opacity: 1 !important;
}

/* Featured Section */
.featured-products-grid img {
    object-fit: contain;
    object-position: center top;
    background: white;
}

/* Showcase Sections */
.category-showcase-banner {
    background: #f8f9fa;
}
.category-showcase-banner img {
    object-fit: contain;
    background: #f8f9fa;
}

/* Blog Section */
.blog-card-img {
    aspect-ratio: 16/9;
    object-fit: cover;
}

.shadow-hover {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.shadow-hover:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.1) !important;
}

/* Specific Home Utilities */
.min-h-400 { min-height: 400px; }
.min-h-200 { min-height: 200px; }
.min-h-160 { min-height: 160px; }
.shadow-inner { box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.06); }
.small-plus { font-size: 0.95rem; }
.mini-badge { font-size: 0.65rem; border-radius: 0 4px 4px 0; }
.super-mini-badge { font-size: 0.6rem; }
.mini-text { font-size: 0.75rem; }
.micro-text { font-size: 0.8rem; }
.super-mini-text { font-size: 0.65rem; }
.op-2 { opacity: 0.2; }
.z-3 { z-index: 3; }
.h-3 { height: 3px; }
.w-60 { width: 60px; }
.ratio-16-9 { aspect-ratio: 16/9; }

.grad-black-transparent {
    background: linear-gradient(0deg, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0.3) 60%, transparent 100%);
}

.shadow-text {
    text-shadow: 0 1px 3px rgba(0,0,0,0.5);
}

.hover-zoom {
    transition: transform 0.3s ease;
}
.hover-zoom:hover {
    transform: scale(1.03);
}

.h-12 { height: 12px; }

