/* 상품상세 > 하단 추천상품 목록 (스크롤 로딩) */

/* 하단 당신을 위한 추천 추천 상품 2단 출력 CSS */
.dbprd_add_product_area .title {
    font-size: 18px;
    font-weight: 500;
    padding: 15px 20px;
}

/* 로더 */
.dbprd-loader-container {  position: relative; display: flex;justify-content: center;align-items: center; height: 50px; }
.dbprd-loader-container.hide { display: none;}
.dbprd-loader-item {width: 10px;height: 10px;border-radius: 50%;background-color: #fff;box-shadow: 16px 0 #fff, -16px 0 #fff;position: relative;animation: dbprd-flash 0.5s ease-out infinite alternate;}
@keyframes dbprd-flash {
    0% {background-color: #FFD8CC;box-shadow: 16px 0 #FFD8CC, -16px 0 #FF3D00;}
    50% {background-color: #FF3D00;box-shadow: 16px 0 #FFD8CC, -16px 0 #FFD8CC;}
    100% {background-color: #FFD8CC;box-shadow: 16px 0 #FF3D00, -16px 0 #FFD8CC;}
}

.dbprd_add_product_wrap {position: relative; z-index: 1; display: flex; flex-wrap:wrap; overflow:hidden; width:100%; max-width:480px; /* margin-top: 20px; */ padding: 0 20px; box-sizing: border-box;}
.dbprd_add_product_wrap .cate-thumb {margin-bottom: 20px; width: 48%; display: flex; flex-direction: column;}
.dbprd_add_product_wrap .cate-thumb:nth-child(even) {margin-left: 4%;}
.dbprd_add_product_wrap .cate-thumb img {width: 100%; height: 100%; border-radius: 8px;}
.dbprd_add_product_wrap .cate-thumb video {width: 100%; border-radius: 8px;}
.dbprd_add_product_wrap .cate-thumb .close_img {display: flex; justify-content: flex-end;}
.dbprd_add_product_wrap .cate-thumb .close_img img {width: 24px;}
.dbprd_add_product_wrap .cate-thumb .cate-thumb-txt {text-align: left; padding: 0 3px; height: auto; position: relative;}
@media screen and (max-width: 480px) {
    .dbprd_add_product_wrap .cate-thumb .cate-thumb-txt .prod-title {font-size: 14px;}
}
@media screen and (max-width: 450px){
    .dbprd_add_product_wrap .cate-thumb .cate-thumb-txt h3 {font-size: 16px; height: 50px; word-break: keep-all; overflow: hidden; text-overflow: ellipsis; white-space: normal; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
    .dbprd_add_product_wrap .cate-thumb .price-wrapper .price {font-size: 14px;}
    .dbprd_add_product_wrap .cate-thumb .price-wrapper .dc-rate {font-size: 14px;}
    .dbprd_add_product_wrap .cate-thumb .cate-thumb-txt .review-area {font-size: 12px;}
}

.dbprd_add_product_wrap .review-area {display: inline-block; color: #a8a8a8; /* padding: 6px 0; */ font-size: 13px; float: left; margin-top: 8px;}
.dbprd_add_product_wrap .review-area .review-area-wrap {width: auto;}
.dbprd_add_product_wrap .review-area .review-area-wrap p {float: left;}
.dbprd_add_product_wrap .review-area .review-area-wrap p:first-child {padding-right: 5px;}
.dbprd_add_product_wrap .review-area .review-area-wrap p.rate {display: flex;}
.dbprd_add_product_wrap .review-area .review-area-wrap p em.star {display: inline-block; background-image: url("/image/common/star.png"); width: 15px; height: 15px; background-size: contain; margin: 1px;}
.dbprd_add_product_wrap .review-area .review-area-wrap span {color: #727272; position: relative; padding-left: 16px; font-size: 12px;}
.dbprd_add_product_wrap .review-area .review-area-wrap span::before {content: ''; display: block; background-image: url("/images/common/ico_review.svg"); width: 14px; height: 14px; position: absolute; left: 0; top: 50%; transform: translate(0, -50%); margin-top: 1px;}

.dbprd_add_product_wrap .cate-thumb-txt .prod-title {font-size: 14px; line-height: 1.3; /* height:38px; */ margin: 12px 0 12px 0; font-weight: 400; white-space: normal; overflow: hidden; word-wrap: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.dbprd_add_product_wrap .prod-price-wrap {position: absolute; bottom: 0; width: 100%;}
.dbprd_add_product_wrap .price-wrapper {display: inline-block; line-height: 1; display: flex; /* align-items: baseline; */ position: relative; letter-spacing: -0.21px;}
.dbprd_add_product_wrap .price-wrapper .dc-rate {font-size: 14px; font-weight: 700; color: #FF6B00; display: inline-block; min-width: 40px;}
.dbprd_add_product_wrap .price-wrapper .price {display: inline-block; font-size: 14px; font-weight: 700; letter-spacing: -0.5px; white-space: nowrap;}

.dbprd_add_product_wrap .cate-thumb .cate-thumb-img { position: relative; }
.dbprd_add_product_wrap .cate-thumb .cate-thumb-img .lists_soldout {position: absolute; bottom: 0; left: 0; height: 100%; width: 100%; /* line-height: 30px; */background-color: rgba(0, 0, 0, 0.32); color: #fff; text-align: center; border-radius: 8px}
.dbprd_add_product_wrap .cate-thumb .cate-thumb-img .lists_soldout .limit-soldout-mark {width: 60%; position: absolute; top: calc(100% /2 - 30%); left: calc(100% /2 - 30%);}
.dbprd_add_product_wrap .cate-thumb .cate-thumb-img .lists_soldout .limit-soldout-mark img {width: 100%;}

/* 멤버십 뱃지 */
.dbprd_add_product_wrap .cate-thumb .cate-thumb-img .membership_badge { border-radius: 4px; background: linear-gradient(90deg, #FF8A00 0%, #FF6B00 100%); padding: 0 6px; height: 20px; display: flex; align-items: center; justify-content: center; color: #fff; position: absolute; left: 8px; top: 8px; font-size: 12px; font-weight: 400; }


/* --- 스켈레톤 로딩 애니메이션 --- */
@keyframes skeleton-shimmer {
    0% { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

/* 스켈레톤 전용 클래스 (기존 .cate-thumb와 함께 사용) */
.dbprd_add_product_wrap .cate-thumb.skeleton-loading {
    pointer-events: none; /* 로딩 중 클릭 방지 */
    /* 기존 .cate-thumb 스타일(width: 48%, margin 등)은 그대로 상속받음 */
}

/* 내부 요소 공통 스타일 (회색 배경 + 쉬머링 효과) */
.dbprd_add_product_wrap .cate-thumb.skeleton-loading .cate-thumb-img,
.dbprd_add_product_wrap .cate-thumb.skeleton-loading .prod-title,
.dbprd_add_product_wrap .cate-thumb.skeleton-loading .price-wrapper,
.dbprd_add_product_wrap .cate-thumb.skeleton-loading .review-area {
    background: #f0f0f0;
    background-image: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: skeleton-shimmer 1.5s infinite ease-in-out;
    border: none !important; /* 혹시 모를 테두리 제거 */
}
/* 이미지 영역 재정의 */
.dbprd_add_product_wrap .cate-thumb.skeleton-loading .cate-thumb-img {
    width: 100%;
    height: 0;
    padding-bottom: 100%; /* 1:1 정사각형 비율 강제 (padding-top 대신 bottom 사용이 안전할 때가 있음) */
    border-radius: 8px; /* 기존 CSS 일치 */
    margin-bottom: 0;   /* 기존 img 마진 없음 */
    display: block;
}
/* 이미지 내부의 a태그, img태그 등 숨김 */
.dbprd_add_product_wrap .cate-thumb.skeleton-loading .cate-thumb-img > * {
    display: none;
}
/* 텍스트 영역 재정의 */
.dbprd_add_product_wrap .cate-thumb.skeleton-loading .cate-thumb-txt {
    padding: 0 3px;
    position: relative;
    display: flex;
    flex-direction: column;
}
/* 제목 */
.dbprd_add_product_wrap .cate-thumb.skeleton-loading .prod-title {
    width: 90%;
    height: 18px; /* 폰트 사이즈 14px 고려 */
    margin: 12px 0 12px 0; /* 기존 마진 일치 */
    border-radius: 4px;
}
/* 가격 */
.dbprd_add_product_wrap .cate-thumb.skeleton-loading .price-wrapper {
    width: 60%;
    height: 20px;
    margin-bottom: 8px; /* 가격과 리뷰 사이 간격 */
    border-radius: 4px;
}
/* 리뷰 */
.dbprd_add_product_wrap .cate-thumb.skeleton-loading .review-area {
    width: 30%;
    height: 14px;
    border-radius: 4px;
    margin-top: auto; /* 하단 배치 유도 */
}
