/* ============================================================
   kfa_shop.css — 영카트 쇼핑 화면 (목록·상세·장바구니·주문·마이페이지)
   영카트 기본 스킨 마크업 위에 시안 톤만 입힘 (PC·모바일 공용)
   ============================================================ */

/* ---------- 상품 목록: 상단 띠 전체 폭, 본문 컨테이너 ---------- */
#wrapper.is_shoplist { max-width: none; padding: 0 0 64px; }
#wrapper.is_shoplist #container, #wrapper.is_shoplist .shop-content { max-width: none; padding: 0; }
#wrapper.is_shoplist #sct > *:not(.kfa-shophead) { max-width: var(--container); margin-left: auto; margin-right: auto; padding-left: 24px; padding-right: 24px; }
#wrapper.is_shoplist #sct > .kfa-shoptabs { margin-top: 28px; padding-left: 24px; padding-right: 24px; }
#wrapper.is_shoplist #sct_location, .sct_admin { display: none; }
#sct_hhtml:empty { display: none; }
#wrapper.is_shoplist #sct_sortlst { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; border: 0; border-top: 2px solid var(--color-navy); border-bottom: 1px solid var(--color-border); padding-top: 6px; padding-bottom: 6px; margin-top: 0; margin-bottom: 24px; background: none; }
#wrapper.is_shoplist #sct_sort ul { display: flex; flex-wrap: wrap; gap: 2px; }
#wrapper.is_shoplist #sct_sort li a, #wrapper.is_shoplist #sct_sort li button { font-size: 14px; color: var(--color-text-muted); padding: 10px 10px; border: 0; background: none; letter-spacing: 0; text-transform: none; }
#wrapper.is_shoplist #sct_sort li a:hover { color: var(--color-accent); }
#sct_lst { display: none; }

/* 상품 카드 */
ul.sct.sct_10 { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 28px 20px !important; }
#wrapper.is_shoplist #sct > ul.sct { max-width: var(--container) !important; margin: 0 auto !important; padding: 0 24px !important; }
ul.sct.sct_10::before, ul.sct.sct_10::after { display: none; }
ul.sct.sct_10 > li.sct_li { width: auto !important; float: none !important; margin: 0 !important; padding: 0 !important; border: 0 !important; clear: none !important; }
.sct_10 .sct_img { position: relative; border-radius: 16px; overflow: hidden; background: var(--color-bg-soft); aspect-ratio: 1 / 1; }
.sct_10 .sct_img img { width: 100% !important; height: 100% !important; object-fit: cover; transition: transform var(--dur-slow) var(--ease); }
.sct_10 .sct_li:hover .sct_img img { transform: scale(1.03); }
.sct_10 .sct_btn { position: absolute; left: 12px; right: 12px; bottom: 12px; opacity: 0; transform: translateY(6px); transition: all var(--dur) var(--ease); }
.sct_10 .sct_li:hover .sct_btn, .sct_10 .sct_btn:focus-within { opacity: 1; transform: none; }
.sct_10 .sct_btn .btn_cart { width: 100%; min-height: 44px; padding: 0; border-radius: 10px; border: 0; background: rgba(27, 34, 51, 0.92); color: #fff; font-size: 14px; font-weight: 700; letter-spacing: 0; text-transform: none; }
.sct_10 .sct_ct_wrap { padding: 12px 2px 0; }
.sct_10 .sct_txt { font-size: 16px; font-weight: 700; line-height: 1.4; margin: 0 0 4px; }
.sct_10 .sct_txt a { color: var(--color-text); }
.sct_10 .sct_basic { font-size: 13px; color: var(--color-text-muted); margin-bottom: 6px; border: 0; padding: 0; }
.sct_10 .sct_bottom { display: flex; align-items: center; justify-content: space-between; border: 0; padding: 0; }
.sct_10 .sct_cost { font-size: 19px; font-weight: 900; color: var(--color-text); }
.sct_10 .sct_dict { margin-left: 6px; font-size: 13px; font-weight: 400; color: var(--color-text-soft); text-decoration: line-through; }
.sct_10 .sct_op_btn button { width: 40px; height: 40px; padding: 0; border: 1px solid var(--color-border-strong); border-radius: 20px; background: #fff; color: var(--color-text); letter-spacing: 0; }
.sct_10 .sct_op_btn .btn_share, .sct_10 .sct_sns_wrap { display: none; }
.sct_noitem { grid-column: 1 / -1; text-align: center; padding: 80px 0; color: var(--color-text-soft); border: 1px dashed var(--color-border-strong); border-radius: 14px; }

/* 상품 아이콘: 영카트 기본 문구를 시안 배지로 */
.sct_icon, .sit_icon { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 8px; }
.shop_icon { display: inline-flex; align-items: center; height: 20px; padding: 0 7px; border-radius: 4px; font-size: 0 !important; font-weight: 700; color: #fff !important; background: var(--color-text-muted); border: 0; line-height: 1; }
.shop_icon::after { font-size: 11px; }
.shop_icon_1 { background: #B42318 !important; } .shop_icon_1::after { content: 'BEST'; }
.shop_icon_2 { background: var(--color-accent) !important; } .shop_icon_2::after { content: '추천'; }
.shop_icon_3 { background: #15803D !important; } .shop_icon_3::after { content: 'NEW'; }
.shop_icon_4 { background: #1D4ED8 !important; } .shop_icon_4::after { content: '인기'; }
.shop_icon_5 { background: var(--color-navy) !important; } .shop_icon_5::after { content: '할인'; }
.shop_icon_coupon::after { content: '쿠폰'; }

/* ---------- 상품 상세 ---------- */
#sit_title { font-family: var(--font-body) !important; font-style: normal !important; font-size: 30px !important; font-weight: 900 !important; letter-spacing: -0.5px; line-height: 1.3; color: var(--color-text); }
#sit_title em, #sit_title i { font-style: normal; }
#sit_desc { font-size: 16px; color: #4A4541; }
#sit_pvi_big img, #sit_pvi_big a { border-radius: 18px; overflow: hidden; }
#sit_pvi { background: none !important; }
#sit_pvi_thumb img { border-radius: 10px; }
.sit_ov_tbl th { font-weight: 500; color: var(--color-text-muted); font-size: 14px; }
.sit_ov_tbl td { font-size: 14px; }
.sit_ov_tbl tr:first-child td strong { font-size: 24px; font-weight: 900; }
#sit_opt_added { border: 0; margin-top: 8px; }
.sit_opt_list { display: flex !important; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; padding: 16px !important; border-radius: 14px; background: var(--color-bg-soft) !important; border: 0 !important; }
.sit_opt_subj { font-weight: 700; font-size: 15px; flex: 1 1 100%; }
.opt_count { display: flex !important; align-items: center; gap: 0; border: 1px solid var(--color-border-strong); border-radius: 10px; background: #fff; overflow: hidden; }
.opt_count .sit_qty_minus, .opt_count .sit_qty_plus { width: 44px !important; height: 44px !important; padding: 0 !important; border: 0 !important; background: #fff !important; color: var(--color-text) !important; letter-spacing: 0; font-size: 14px; }
.opt_count .num_input { width: 52px !important; height: 44px !important; border: 0 !important; border-left: 1px solid var(--color-border) !important; border-right: 1px solid var(--color-border) !important; border-radius: 0 !important; text-align: center; font-size: 16px; font-weight: 700; padding: 0 !important; }
.sit_opt_prc { font-size: 14px; color: var(--color-text-muted); }
#sit_tot_price { display: flex; align-items: baseline; justify-content: space-between; margin: 16px 0; font-size: 15px; font-weight: 700; }
#sit_tot_price strong { font-size: 28px; font-weight: 900; color: var(--color-accent); }
#sit_ov_btn { display: flex !important; gap: 8px; }
#sit_ov_btn button, #sit_ov_btn a { min-height: 56px; border-radius: 10px !important; font-size: 17px !important; font-weight: 700 !important; letter-spacing: 0 !important; text-transform: none !important; }
#sit_ov_btn .sit_btn_cart { flex: 1; background: #fff !important; border: 1px solid var(--color-navy) !important; color: var(--color-navy) !important; }
#sit_ov_btn .sit_btn_buy { flex: 1; background: var(--color-accent) !important; border: 1px solid var(--color-accent) !important; color: #fff !important; }
#sit_ov_btn .sit_btn_wish { flex: none; width: 56px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--color-border-strong) !important; background: #fff; color: var(--color-text); }
#sit_ov_btn .sit_btn_cart:hover { background: var(--color-bg-soft) !important; }
#sit_ov_btn .sit_btn_buy:hover { background: var(--color-accent-hover) !important; }
#sit_siblings a { color: var(--color-text-muted); }
#sit_tab .tab_tit, #sit_inf h3, #sit_rel h2 { font-family: var(--font-body); font-weight: 900; }

/* ---------- 공통: 쇼핑 화면 버튼·표 ---------- */
.shop-content .btn_submit, #sod_frm .btn_submit, #sod_bsk .btn_submit, .btn_confirm .btn_submit { background: var(--color-accent) !important; border-color: var(--color-accent) !important; color: #fff !important; border-radius: 10px; font-weight: 700; letter-spacing: 0; text-transform: none; }
.shop-content .btn01, .shop-content .btn_cancel, .shop-content .btn_frmline { border-radius: 8px; letter-spacing: 0; text-transform: none; }
.shop-content .tbl_head01 thead th, .shop-content .tbl_head03 thead th { background: none; border-top: 2px solid var(--color-navy); border-bottom: 1px solid var(--color-border-strong); color: var(--color-text); font-weight: 700; }
.shop-content .tbl_head01 td, .shop-content .tbl_head03 td { border-bottom: 1px solid var(--color-border); }
#wrapper_title { font-family: var(--font-body); font-weight: 900; font-size: 30px; letter-spacing: -0.5px; }

@media (max-width: 1100px) { ul.sct.sct_10 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } }
@media (max-width: 768px) {
  #wrapper.is_shoplist #sct > *:not(.kfa-shophead) { padding-left: 16px; padding-right: 16px; }
  #wrapper.is_shoplist #sct > ul.sct { padding: 0 16px !important; }
  ul.sct.sct_10, ul.sct_10 { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 20px 12px; }
  .sct_10 .sct_btn { display: none; }
  .sct_10 .sct_txt { font-size: 14px; }
  .sct_10 .sct_cost { font-size: 16px; }
  #sit_title { font-size: 22px !important; }
}

/* ---------- 장바구니·주문서·마이페이지: 고정폭(1200px 기준) → 비율, float 해제 ---------- */
#sod_frm::after, #forderform::after, #smb_my::after, #sod_bsk::after, #sod_fin::after { content: ''; display: table; clear: both; }
.sod_left { width: calc(70% - 20px); }
.sod_right { width: 30%; }
#smb_my_ov { width: 265px; }
#smb_my_list { width: calc(100% - 285px); }
.od_prd_list .td_prd { position: relative; }
.od_prd_list .td_prd .sod_img img { width: 80px; height: 80px; object-fit: cover; border-radius: 10px; }
.sod_right #sod_bsk_tot, .sod_right #od_tot_price, .sod_right .pay_tbl, #sod_frm_pay { border-color: var(--color-border) !important; border-radius: 14px; overflow: hidden; }
.sod_right #sod_bsk_tot { border: 2px solid var(--color-accent) !important; }
#od_tot_price .print_price, #sod_bsk_tot .sod_bsk_cnt strong, .sod_right .sod_info .sod_bsk_cnt strong { color: var(--color-accent) !important; }
#sod_bsk_tot { border-radius: 14px; overflow: hidden; }
#sod_bsk #sod_bsk_tot li { background: var(--color-navy) !important; }
#sod_bsk #sod_bsk_tot .sod_bsk_cnt { background: #111725 !important; }
#sod_frm #sod_bsk_tot li { background: #fff !important; color: var(--color-text); }
#sod_frm #sod_bsk_tot li strong { color: var(--color-text); font-size: 1.1em; }
#sod_frm #sod_bsk_tot .sod_bsk_cnt { background: var(--color-bg-alt, #FFF5EF) !important; }
.sod_right #od_tot_price { background: var(--color-bg-alt, #FFF5EF) !important; border: 1px solid var(--color-border); }
#sod_frm #sod_frm_pt_alert { color: var(--color-text-muted, #6B5E57); }
#sod_frm #sod_frm_pt_alert strong { color: var(--color-accent); }
#sod_frm #order_address { width: auto; padding: 0 12px; white-space: nowrap; }
#display_pay_button .btn01 { display: block; width: 100%; min-height: 48px; line-height: 46px; margin-top: 8px; text-align: center; font-size: 15px; border: 1px solid var(--color-border); border-radius: 10px; background: #fff; color: var(--color-text); }
.sod_left section, #sod_frm_orderer, #sod_frm_taker { border-color: var(--color-border) !important; border-radius: 14px; }
#sod_frm h2, #sod_frm_orderer h2, #sod_frm_taker h2, .sod_left h2, .sod_right h2 { font-family: var(--font-body); font-weight: 900; }
#sod_frm .btn_frmline, #sod_frm .btn_address, .sod_left .btn_frmline { background: var(--color-navy) !important; border-color: var(--color-navy) !important; color: #fff !important; border-radius: 8px; letter-spacing: 0; text-transform: none; }
#sod_frm_paysel .lb_icon, #sod_frm_paysel label { border-radius: 10px; }
#display_pay_button .btn_submit, #sod_frm .btn_submit { min-height: 56px; font-size: 17px; width: 100%; }
#sod_bsk_act .btn_submit, #sod_bsk_act button[type=submit], #sod_bsk_act .btn01 { min-height: 52px; padding: 0 32px; font-size: 16px; border-radius: 10px; }
#sod_bsk_list .chk_box input[type=checkbox] + label span, #sod_bsk .selec_chk + label span { border-radius: 4px; }
#smb_my_ov { border-color: var(--color-border) !important; border-radius: 16px; overflow: hidden; }
#smb_my_ov .my_ov_name { font-weight: 900; }
#smb_my_ov .smb_my_btn a, #smb_my_ov .my_ov_btn a { border-radius: 6px; }
#smb_my_list h2 { font-family: var(--font-body); font-weight: 900; }
.fa { font-family: FontAwesome !important; }
#smb_my_ov .smb_me a { border-radius: 6px; }
#smb_my_ov .withdrawal { display: block; padding: 14px 20px; border-top: 1px solid var(--color-border); color: var(--color-text-muted, #8A7F78); font-size: 13px; text-align: right; }
#smb_my_list .btn_shop_more, .smb_my_more a { color: var(--color-text-muted, #6B5E57); }
@media (max-width: 1100px) {
  .sod_left, .sod_right, #smb_my_list, #smb_my_ov { float: none; width: 100%; margin-right: 0; }
  #smb_my_ov { margin-bottom: 24px; }
}
#wrapper.is_shoplist #sct > #sct_sortlst { max-width: calc(var(--container) - 48px); padding-left: 0; padding-right: 0; }
@media (max-width: 1288px) { #wrapper.is_shoplist #sct > #sct_sortlst { margin-left: 24px; margin-right: 24px; } }
@media (max-width: 768px) { #wrapper.is_shoplist #sct > #sct_sortlst { margin-left: 16px; margin-right: 16px; } }

/* K1PS 카드 결제 — 결제 대기 주문의 [카드로 결제하기] */
.kfa-k1ps-pay { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 16px 0; padding: 16px 20px; border: 1px solid var(--color-accent); border-radius: 14px; background: var(--color-bg-alt, #FFF5EF); }
.kfa-k1ps-pay p { margin: 0; font-weight: 700; color: var(--color-text); }
.kfa-k1ps-pay .btn_submit { display: inline-block; min-height: 46px; line-height: 46px; padding: 0 22px; border-radius: 10px; background: var(--color-accent) !important; color: #fff !important; font-weight: 700; }
#sod_frm_paysel .card_icon, #sod_frm_paysel label[for="od_settle_k1ps"] { font-weight: 700; }
#sod_fin_pay li strong, #sod_fin_orderer th, #sod_fin_receiver th { white-space: nowrap; }
#sod_fin_pay li strong { min-width: 72px; }

/* ---------- KFA 숨김: 기획에 없는 기본 기능 (extend/kfa_hide.extend.php 와 짝) ---------- */
/* 위시리스트(찜)·SNS 공유 */
.sct_op_btn .btn_wish, .sct_op_btn .btn_share, .sct_sns_wrap, .sct_op_btn,
#sit_star_sns, .sit_btn_wish, #sit_btn_wish, #btn_wish, .btn_sns_share, .sns_area { display: none !important; }
/* 상품 사용후기·상품문의 탭과 내용 */
#sit_tab .tab_tit li:has(button[rel="#sit_use"]), #sit_tab .tab_tit li:has(button[rel="#sit_qa"]),
.tab_tit li:has(button[rel="#sit_use"]), .tab_tit li:has(button[rel="#sit_qa"]),
#sit_use, #sit_qa, .sct_star, .sct_review { display: none !important; }
/* 마이페이지 바로가기 (주문내역·내 상담내역) */
#smb_private.kfa-my-links li a { display: flex; align-items: center; gap: 10px; }
#smb_my_consult { margin: 0 0 50px; }
#smb_my_consult h2 { margin: 0 0 10px; font-size: 1.25em; }
.kfa-cs-status { display: inline-block; padding: 2px 10px; border-radius: 99px; background: var(--color-bg-alt, #FFF5EF); color: var(--color-accent); font-size: 12px; font-weight: 700; }
.kfa-my-cs { list-style: none; margin: 0; padding: 0 16px; }
.kfa-my-cs li { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; padding: 12px 0; border-bottom: 1px solid var(--color-border); }
.kfa-my-cs li a { flex: 1 1 60%; font-weight: 700; color: var(--color-text); }
.kfa-my-cs .info_date { flex-basis: 100%; font-size: 12px; color: var(--color-text-muted); }
/* 포인트 사용 안 함 (cf_use_point=0) — 합계 영역의 포인트 줄 */
.sod_bsk_point, .total_point { display: none !important; }
/* PC 상품 상세: 기본 스킨이 숨긴 제목(상품 정보 등)이 글꼴 규칙 때문에 다시 보여 본문과 겹치던 것 — 화면에서 숨김(읽기 도구용으로는 유지) */
#sit_inf > h2, #sit_inf > h3 { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
#sit_tab { width: 100%; }
/* 관련상품이 없으면 빈 상자 대신 영역 숨김 */
#sit_rel:has(.sct_noitem) { display: none; }
/* 모바일 하단 고정 버튼(장바구니 주문하기·상품 구매하기)이 푸터를 가리지 않게 */
body:has(#sod_bsk_act) #ft, body:has(.btn_option_wr) #ft { padding-bottom: 96px; }
/* PC 장바구니 합계줄: 포인트 칸을 뺀 뒤 남는 두 칸을 절반씩 */
#sod_bsk #sod_bsk_tot ul:not(:has(.sod_bsk_pt)) li { width: 50%; }
/* 모바일 마이페이지: 내 정보 펼치기 버튼에 글자 표시 */
.my_ov_btn .btn_op_area { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--color-text-muted); }