/* 상품 목록 페이지 전용 스타일 - 대문 디자인 톤 맞춤
   주의: 이 파일은 list.php(basic 스킨) 전용이며, default_shop.css와 skin/style.css는 건드리지 않음 */

/* 정렬/뷰전환 바 카드 */
#sct_sortlst {
    background:#fff;
    border:1px solid #EEF0F3;
    border-radius:8px;
    box-shadow:0px 1px 4px rgba(0,0,0,0.06);
    box-sizing:border-box;
    overflow:hidden;
}
#sct_sort li a:hover {
    color:#0080EA;
}
#sct_lst button:hover {
    color:#0080EA;
}

/* 상품 카드 (썸네일+정보) */
.sct_10 .sct_li {
    background:#fff;
    border:1px solid #EEF0F3;
    border-radius:8px;
    box-shadow:0px 1px 4px rgba(0,0,0,0.06);
    box-sizing:border-box;
    padding:14px 14px 18px;
}
/* 전 카테고리가 한 줄 5개(col-row-5)로 통일됨. col-row-5 카드는 서로 맞닿아 있어
   (그리드 열 사이 별도 마진 없음) 카드 자체 padding이 곧 카드 사이 시각적 간격이기도
   함 - 좌우 padding을 늘려 카드 사이를 벌리고, 그만큼 카드 내부(이미지)는 좁아짐
   (이미지는 max-width:100%라 자동 대응) */
.sct_10 .sct_li.col-row-5 {
    padding:20px 20px 24px;
}
.sct_10 .sct_img {
    border-radius:6px;
    overflow:hidden;
}
.sct_10 .sct_img img {
    transition:transform .3s ease;
}
.sct_10 .sct_img:hover img {
    transform:scale(1.03);
}
.sct_10 .sct_txt {
    border-bottom:0;
}
.sct_10 .sct_txt a:hover {
    color:#0080EA;
}
.sct_10 .sct_cost {
    color:#0080EA;
}

/* 장바구니 버튼 */
.sct_10 .btn_cart {
    border-radius:8px;
}

/* 위시리스트/공유 버튼 hover */
.sct_10 .sct_op_btn>button:hover {
    color:#0080EA;
}

/* 정렬 결과 페이지네이션 - 포인트 컬러 통일 */
#sct .pg_current {
    background:#0080EA;
    border-color:#0080EA;
}
#sct .pg_page:hover {
    color:#0080EA;
}

/* 관련 분류 활성 표시 - 포인트 컬러 통일 */
#sct .sct_ct_here {
    color:#0080EA !important;
}

/* 리스트뷰(테이블형, sct_40) 전환 시에도 톤 통일 */
.sct_40 .sct_img {
    border-radius:6px;
    overflow:hidden;
}
.sct_40 .sct_txt a:hover {
    color:#0080EA;
}
.sct_40 .sct_cost {
    color:#0080EA;
}

@media (max-width:768px) {
    .sct_10 .sct_li,
    .sct_10 .sct_li.col-row-5 {
        padding:10px 10px 14px;
    }
}

/* 검색결과 페이지 전용 스타일 - 대문 디자인 톤 맞춤 (search.php 전용)
   주의: #ssch 컨테이너는 search.php에서만 사용되므로 list.php와 충돌 없음 */

/* 검색 폼 영역 */
#ssch {
    margin:0 0 20px;
}

#ssch h2 {
    font-size:1.5em;
    margin:0 0 20px;
    padding-bottom:12px;
    border-bottom:1px solid #D7E1EA;
}

#ssch h2 strong {
    color:#0080EA;
}

#ssch h2 .ssch_result_total {
    display:inline-block;
    margin-left:10px;
    font-size:0.75em;
    color:#999;
    font-weight:normal;
}

/* 상세검색 영역 */
#ssch_frm {
    background:#fff;
    border:1px solid #EEF0F3;
    border-radius:8px;
    box-shadow:0px 1px 4px rgba(0,0,0,0.06);
    padding:20px;
    margin-bottom:20px;
}

#ssch_frm .ssch_option {
    margin-top:15px;
}

/* 검색 분류 필터 */
#ssch_cate {
    background:#fff;
    border:1px solid #EEF0F3;
    border-radius:8px;
    box-shadow:0px 1px 4px rgba(0,0,0,0.06);
    margin:20px 0;
}

#ssch_cate ul {
    margin:0;
    padding:20px;
    list-style:none;
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}

#ssch_cate li {
    margin:0;
}

#ssch_cate a {
    display:inline-block;
    padding:8px 12px;
    border:1px solid #E5E8ED;
    border-radius:6px;
    background:#F5F6F8;
    color:#333;
    text-decoration:none;
    font-size:0.9em;
    transition:all .2s ease;
}

#ssch_cate a:hover {
    color:#0080EA;
    border-color:#0080EA;
}

#ssch_cate a span {
    color:#999;
}

/* 정렬 옵션 */
#ssch_sort_all {
    list-style:none;
    padding:0;
    margin:20px 0;
    display:flex;
    gap:10px;
    flex-wrap:wrap;
}

#ssch_sort_all li {
    margin:0;
}

#ssch_sort_all a {
    display:inline-block;
    padding:10px 14px;
    border:1px solid #EEF0F3;
    border-radius:6px;
    background:#fff;
    color:#333;
    text-decoration:none;
    font-size:0.9em;
    transition:all .2s ease;
}

#ssch_sort_all a:hover,
#ssch_sort_all li.active a {
    color:#0080EA;
    border-color:#0080EA;
    background:#F5FAFF;
}

@media (max-width:768px) {
    #ssch_cate ul {
        padding:15px;
    }
    #ssch_frm {
        padding:15px;
    }
}
