/* ==========================================================================
   5열 그리드 - 1400px 이상 (브레이크포인트 낮춤)
   ========================================================================== */

/* 모든 컨테이너 확장 */
body .grid-container,
body .site-content,
body .inside-article,
body.woocommerce .grid-container,
body.woocommerce .site-content,
body.woocommerce .inside-article,
body.woocommerce-page .grid-container,
body.woocommerce-page .site-content,
body.woocommerce-page .inside-article {
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 30px !important;
    padding-right: 30px !important;
}

/* 상품 그리드 5열 - 1400px 이상 */
body .woocommerce ul.products,
body.woocommerce ul.products,
body .woocommerce-page ul.products,
body.woocommerce-page ul.products,
.woocommerce ul.products,
.woocommerce-page ul.products {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    column-gap: 40px !important;
    row-gap: 50px !important;
    padding: 60px 0 !important;
    margin: 0 auto !important;
    max-width: 1800px !important;
    width: 100% !important;
    list-style: none !important;
}

/* 상품 카드 */
body .woocommerce ul.products li.product,
body.woocommerce ul.products li.product,
body .woocommerce-page ul.products li.product,
body.woocommerce-page ul.products li.product,
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 25px !important;
    float: none !important;
    clear: none !important;
    display: flex !important;
    flex-direction: column !important;
    background: #ffffff !important;
    border: 1px solid #f0f0f0 !important;
    border-radius: 15px !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08) !important;
    transition: all 0.3s ease !important;
    position: relative !important;
}

/* 호버 효과 */
.woocommerce ul.products li.product:hover,
.woocommerce-page ul.products li.product:hover {
    transform: translateY(-8px) !important;
    box-shadow: 0 12px 35px rgba(0,0,0,0.15) !important;
    border-color: #00d4ff !important;
}

/* 링크 영역 */
.woocommerce ul.products li.product .woocommerce-loop-product__link,
.woocommerce-page ul.products li.product .woocommerce-loop-product__link {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 !important;
    text-decoration: none !important;
}

/* 이미지 */
.woocommerce ul.products li.product img,
.woocommerce-page ul.products li.product img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1 / 1 !important;
    object-fit: cover !important;
    border-radius: 10px !important;
    margin-bottom: 20px !important;
}

/* 제목 */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce-page ul.products li.product .woocommerce-loop-product__title {
    font-size: 1.05em !important;
    font-weight: 600 !important;
    color: #2d3748 !important;
    margin: 15px 0 !important;
    min-height: 2.4em !important;
    line-height: 1.2 !important;
}

/* 가격 */
.woocommerce ul.products li.product .price,
.woocommerce-page ul.products li.product .price {
    font-size: 1.15em !important;
    font-weight: 700 !important;
    color: #00d4ff !important;
    margin: 15px 0 !important;
}

.woocommerce ul.products li.product .price del,
.woocommerce-page ul.products li.product .price del {
    opacity: 0.5 !important;
    font-size: 0.85em !important;
    margin-right: 8px !important;
}

.woocommerce ul.products li.product .price ins,
.woocommerce-page ul.products li.product .price ins {
    text-decoration: none !important;
    color: #e63946 !important;
}

/* 장바구니 버튼 */
.woocommerce ul.products li.product .button,
.woocommerce-page ul.products li.product .button {
    background: linear-gradient(135deg, #00d4ff 0%, #0077b6 100%) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 50px !important;
    padding: 14px 30px !important;
    font-weight: 700 !important;
    font-size: 0.95em !important;
    transition: all 0.3s ease !important;
    width: 100% !important;
    text-align: center !important;
    margin-top: auto !important;
    display: block !important;
    box-shadow: 0 4px 15px rgba(0, 212, 255, 0.3) !important;
}

.woocommerce ul.products li.product .button:hover,
.woocommerce-page ul.products li.product .button:hover {
    background: linear-gradient(135deg, #0077b6 0%, #00d4ff 100%) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(0, 212, 255, 0.5) !important;
}

/* 배지 */
.woocommerce ul.products li.product .onsale {
    position: absolute !important;
    top: 15px !important;
    right: 15px !important;
    z-index: 10 !important;
    background: #000 !important;
    color: #fff !important;
    padding: 6px 14px !important;
    border-radius: 20px !important;
    font-size: 0.85em !important;
    font-weight: 700 !important;
    margin: 0 !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.3) !important;
}

.product-category-badge {
    position: absolute !important;
    top: 15px !important;
    left: 15px !important;
    z-index: 10 !important;
    background: #ffc107 !important;
    color: #000 !important;
    padding: 6px 14px !important;
    border-radius: 20px !important;
    font-size: 0.85em !important;
    font-weight: 700 !important;
    margin: 0 !important;
    box-shadow: 0 2px 8px rgba(255, 193, 7, 0.3) !important;
}

/* ==========================================================================
   반응형 브레이크포인트 (1400px 기준)
   ========================================================================== */

/* 1400px 이상 = 5열 */
@media (min-width: 1400px) {
    body .woocommerce ul.products,
    body .woocommerce-page ul.products {
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        column-gap: 40px !important;
    }
}

/* 1200-1399px = 4열 */
@media (min-width: 1200px) and (max-width: 1399px) {
    body .woocommerce ul.products,
    body .woocommerce-page ul.products {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        column-gap: 35px !important;
    }
}

/* 1024-1199px = 4열 */
@media (min-width: 1024px) and (max-width: 1199px) {
    body .woocommerce ul.products,
    body .woocommerce-page ul.products {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        column-gap: 30px !important;
    }
}

/* 768-1023px = 3열 */
@media (min-width: 768px) and (max-width: 1023px) {
    body .woocommerce ul.products,
    body .woocommerce-page ul.products {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        column-gap: 25px !important;
        row-gap: 40px !important;
    }
}

/* 768px 미만 = 2열 */
@media (max-width: 767px) {
    body .woocommerce ul.products,
    body .woocommerce-page ul.products {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        column-gap: 20px !important;
        row-gap: 30px !important;
        padding: 40px 0 !important;
    }
    
    body .woocommerce ul.products li.product,
    body .woocommerce-page ul.products li.product {
        padding: 20px !important;
    }
}

/* 480px 미만 = 1열 */
@media (max-width: 479px) {
    body .woocommerce ul.products,
    body .woocommerce-page ul.products {
        grid-template-columns: 1fr !important;
        column-gap: 0 !important;
    }
}