/* ============================================================
   황금곳간 상품 상세 페이지 CSS (gm-item.css)
   - 시안: myfile/greenmall_product.html 의 .pd-* 섹션을
     코어 item.php / 스킨이 출력하는 #sit_* 마크업에 매핑
   - 공통 변수(--point 등)는 gm-shop.css :root 재활용
   - 기본 스킨 style.css 뒤에 로드되어 오버라이드
   ============================================================ */

/* ---------- 전체 레이아웃 ---------- */
#sit{max-width:1200px;margin:0 auto;padding:10px 20px 0;font-family:'Pretendard','Malgun Gothic','Apple SD Gothic Neo',sans-serif;color:var(--txt);}
#sit_hhtml{margin-bottom:14px;}
/* 코어 style.css 의 #sit_ov_from{background;border-bottom} / #sit_ov_wrap{width:1200px;padding:45px;border-top}
   고정폭이 모바일 가로 오버플로우(화면 비틀림)를 유발 → 시안(.pd-top)대로 무력화 */
#sit_ov_from{margin:0;background:transparent;border-bottom:0;}
/* 대표이미지 확대 (원본 썸네일 1000x1000 생성) — 좌측 갤러리 컬럼을 유동폭으로 키우고
   화면폭에 따라 반응형 축소 (1024 이하 1:1, 768 이하 1단) */
#sit_ov_wrap{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(340px,1fr);gap:44px;margin-bottom:40px;width:auto;max-width:100%;padding:0;border-top:0;}

/* ---------- 좌측 갤러리 (시안 .pd-gallery) ---------- */
#sit_pvi{width:auto;float:none;margin:0;min-width:0;}
/* 코어 #sit_pvi_big{float:right} + 내부 링크 전부 absolute → 박스가 내용폭 0으로 수축해
   대표이미지가 작게 보이는 원인. float 해제 + 컬럼 전체폭 강제 */
#sit_pvi_big{float:none;width:100%;position:relative;aspect-ratio:1/1;height:auto;border:1px solid var(--line);border-radius:20px;overflow:hidden;background:#fff;margin-bottom:12px;}
/* 이미지 링크는 겹쳐두고 opacity 로 전환 (자동 슬라이드 크로스페이드).
   확대보기 버튼(#popup_item_image)은 항상 보여야 하므로 제외 */
#sit_pvi_big a{position:absolute;inset:0;align-items:center;justify-content:center;}
#sit_pvi_big a:not(#popup_item_image){display:flex;opacity:0;visibility:hidden;transition:opacity .45s ease;}
#sit_pvi_big a.visible:not(#popup_item_image){opacity:1;visibility:visible;}
#sit_pvi_big img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;}
#sit_pvi_big > img{position:absolute;inset:0;margin:auto;}
/* 확대보기(돋보기) 버튼 */
#sit_pvi_big a#popup_item_image{display:flex;left:auto;top:auto;right:14px;bottom:14px;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.9);border:1px solid var(--line);color:#888;font-size:16px;transition:all .2s;z-index:2;}
#sit_pvi_big a#popup_item_image:hover{background:var(--point);border-color:var(--point);color:#fff;}
/* 썸네일 (시안 .pd-thumbs) */
/* 코어 #sit_pvi_thumb{float:left} 때문에 다음 형제(zip 버튼)가 썸네일 옆으로 흘러붙음 → float 해제 */
#sit_pvi_thumb{float:none;display:flex;flex-wrap:wrap;gap:10px;list-style:none;margin:0;padding:0;}
#sit_pvi_thumb li{float:none;margin:0;}
#sit_pvi_thumb li a{display:flex;align-items:center;justify-content:center;width:90px;height:90px;border:2px solid transparent;border-radius:14px;overflow:hidden;background:#fff;transition:border-color .2s;}
#sit_pvi_thumb li a:hover,
#sit_pvi_thumb li a:focus,
#sit_pvi_thumb li a.on{border-color:var(--point);}
#sit_pvi_thumb img{width:100%;height:100%;object-fit:cover;border-radius:11px;}
/* zip 다운로드 버튼 (개발계획서 6장 — /gm/item_images.php)
   썸네일 목록 바로 아래에 세로 2단([썸네일 다운로드] / [상세 이미지 다운로드]),
   폭은 썸네일 줄(갤러리 컬럼) 가로의 60% (요청: 40% 축소) */
.gm-zip-btns{clear:both;display:flex;flex-direction:column;align-items:center;gap:8px;width:60%;margin:14px auto 0;}
.gm-zip-btn{width:100%;display:flex;align-items:center;justify-content:center;height:38px;border:1.5px dashed #d5d5d0;border-radius:10px;background:#fafaf8;color:#aaa;font-size:12.5px;font-weight:700;font-family:inherit;line-height:1.3;cursor:not-allowed;}
/* 활성(링크) 상태 : 다운로드 가능 */
a.gm-zip-btn{display:flex;align-items:center;justify-content:center;border:1.5px solid var(--point,#5a9422);background:#f4f9ee;color:var(--point-dark,#3e6b15);cursor:pointer;text-decoration:none;transition:background .15s;}
a.gm-zip-btn:hover{background:var(--point,#5a9422);color:#fff;}
/* 잠금(비로그인) 상태 : 빗금 배경 + 자물쇠, 호버 시 "로그인 후 이용 가능" 으로 문구 전환 */
.gm-zip-btn.gm-zip-lock{
  border:1.5px solid #ddd;color:#9a9a94;cursor:not-allowed;
  background:repeating-linear-gradient(45deg,#fafaf8,#fafaf8 7px,#f2f2ee 7px,#f2f2ee 14px);
  transition:border-color .15s,color .15s,background-color .15s;
}
.gm-zip-btn.gm-zip-lock:hover{border-color:#c9c9c2;color:#6f6f68;background:repeating-linear-gradient(45deg,#f2f2ee,#f2f2ee 7px,#e7e7e1 7px,#e7e7e1 14px);}
.gm-zip-btn.gm-zip-lock .gm-zip-t2{display:none;}
.gm-zip-btn.gm-zip-lock:hover .gm-zip-t1{display:none;}
.gm-zip-btn.gm-zip-lock:hover .gm-zip-t2{display:inline;}

/* ---------- 우측 정보 컬럼 ---------- */
#sit_ov{width:auto;float:none;margin:0;min-width:0;}
.gm-pd-cat{font-size:12.5px;color:var(--point-dark);font-weight:700;margin:0 0 8px;}
#sit_title{font-size:25px;font-weight:800;line-height:1.4;letter-spacing:-.5px;margin:0 0 10px;padding:0;border:0;}
#sit_desc{font-size:13.5px;color:var(--txt-sub);margin:0 0 10px;}
#sit_opt_info{display:none;}

/* 평점/후기수/찜/SNS (시안 .pd-review) */
#sit_star_sns{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--txt-sub);margin:0 0 18px;border:0;padding:0;}
#sit_star_sns .sit_star{vertical-align:middle;}
#sit_btn_opt{margin-left:auto;display:flex;align-items:center;gap:4px;position:relative;}
#sit_btn_opt #btn_wish,
#sit_btn_opt .btn_sns_share,
#sit_btn_opt #sit_btn_rec{display:inline-flex;align-items:center;justify-content:center;gap:4px;min-width:34px;height:34px;padding:0 8px;border:1px solid var(--line);border-radius:10px;background:#fff;color:#999;font-size:13px;cursor:pointer;transition:all .2s;}
#sit_btn_opt #btn_wish:hover,
#sit_btn_opt .btn_sns_share:hover{border-color:var(--point);color:var(--point-dark);}
#sit_btn_opt .sns_area{display:none;position:absolute;top:40px;right:0;background:#fff;border:1px solid var(--line);border-radius:12px;padding:8px 10px;box-shadow:0 6px 18px rgba(0,0,0,.08);z-index:20;white-space:nowrap;}
#sit_btn_opt .sns_area a{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;}

/* 가격 박스 (시안 .pd-price-box) */
.gm-price-box{padding:20px 0;border-top:1.5px solid var(--txt);border-bottom:1px solid var(--line);margin-bottom:20px;}
.gm-price-box .og{font-size:14px;color:#bbb;text-decoration:line-through;}
.gm-price-box .now{display:flex;align-items:baseline;gap:10px;margin-top:4px;}
.gm-price-box .now .dc{font-size:26px;font-weight:900;color:var(--point);}
.gm-price-box .now .pr{font-size:28px;font-weight:900;color:var(--txt);}

/* 부가정보 표 (시안 .pd-meta) */
#sit_ov .sit_info{margin:0 0 20px;}
#sit_ov .sit_ov_tbl{width:100%;border-collapse:collapse;font-size:13.5px;color:#666;line-height:2.1;border:0;}
#sit_ov .sit_ov_tbl th{width:84px;padding:2px 0;text-align:left;color:#999;font-weight:600;background:none;border:0;}
#sit_ov .sit_ov_tbl td{padding:2px 0;border:0;background:none;}
#sit_ov .sit_ov_tbl .grn{color:var(--point-dark);font-weight:700;}
#sit_ov .sit_ov_tbl select{height:36px;border:1.5px solid var(--line);border-radius:10px;padding:0 10px;font-size:13px;background:#fff;}

/* 옵션 선택 (시안 .field + select.inp) */
#sit_ov .sit_option{margin:0 0 18px;border:0;padding:0;}
#sit_ov .sit_option h3{font-size:13.5px;font-weight:700;margin:0 0 8px;color:var(--txt);}
#sit_ov .sit_option label{font-size:12.5px;color:var(--txt-sub);display:block;margin:8px 0 4px;}
#sit_ov .sit_option select{width:100%;height:50px;border:1.5px solid var(--line);border-radius:12px;padding:0 38px 0 16px;font-size:14.5px;font-family:inherit;color:var(--txt);background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23888' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 16px center;appearance:none;-webkit-appearance:none;outline:none;cursor:pointer;transition:border-color .2s, box-shadow .2s;}
#sit_ov .sit_option select:focus{border-color:var(--point);box-shadow:0 0 0 4px #eef6e2;}

/* 선택된 옵션 / 수량 (시안 .stepper) */
#sit_sel_option{margin:0;border:0;padding:0;}
#sit_sel_option h3{font-size:13.5px;font-weight:700;margin:0 0 8px;color:var(--txt);}
#sit_opt_added{list-style:none;margin:0;padding:0;}
#sit_opt_added li{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:12px 14px;margin:0 0 8px;border:1px solid var(--line);border-radius:12px;background:#fafaf8;font-size:13.5px;}
#sit_opt_added .opt_name{flex:1;min-width:140px;}
#sit_opt_added .sit_opt_subj{font-weight:600;color:var(--txt);}
#sit_opt_added .sit_opt_prc{font-size:12.5px;color:var(--txt-sub);}
#sit_opt_added .opt_count{display:flex;align-items:center;gap:8px;margin-left:auto;}
#sit_opt_added .sit_qty_minus,
#sit_opt_added .sit_qty_plus{width:34px;height:34px;border:1.5px solid var(--line);border-radius:10px;background:#fff;color:#888;font-size:13px;cursor:pointer;transition:all .15s;}
#sit_opt_added .sit_qty_minus:hover,
#sit_opt_added .sit_qty_plus:hover{background:#f1f6ea;color:var(--point-dark);border-color:var(--point);}
#sit_opt_added .num_input,
#sit_opt_added input[name^="ct_qty"]{width:48px;height:34px;text-align:center;border:1.5px solid var(--line);border-radius:10px;font-size:14px;font-weight:800;font-family:inherit;background:#fff;outline:none;}
/* 삭제 버튼 : 작은 원형으로 줄이고 항목 우상단에 고정 (2026-07-27 요청 7) */
#sit_opt_added li{position:relative;padding-right:36px;}
#sit_opt_added .sit_opt_del{
  position:absolute;right:8px;top:8px;z-index:2;
  width:22px;height:22px;padding:0;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  border:1px solid #e2e2dd;background:#fff;color:#b5b5b0;
  font-size:10px;line-height:1;cursor:pointer;transition:all .15s;
}
#sit_opt_added .sit_opt_del i{font-size:10px;line-height:1;}
#sit_opt_added .sit_opt_del:hover{color:#fff;background:#d4491d;border-color:#d4491d;}

/* 총 상품금액 (시안 .pd-total) — shop.js 가 <span>총 금액 :</span><strong>..</strong> 원 을 출력 */
#sit_tot_price{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding:18px 2px;margin-top:16px;border-top:1px solid var(--line);font-size:14px;font-weight:700;color:var(--txt);}
#sit_tot_price:empty{display:none;}
#sit_tot_price span{font-size:14px;font-weight:700;margin-right:auto;}
#sit_tot_price strong{font-size:26px;font-weight:900;color:var(--point-dark);margin-left:auto;}

/* 품절 안내 */
#sit_ov_soldout{margin:14px 0;padding:14px;border-radius:12px;background:#fdeaea;color:#d4491d;font-size:13.5px;font-weight:700;text-align:center;}

/* 버튼 영역 (시안 .pd-btns)
   [♥ 위시리스트(담고 이동)] [🛒 장바구니 담기] [바로 구매하기]
   이미 담긴 상품(.on)은 빨간색으로 표시 */
#sit_ov_btn{display:flex;align-items:center;gap:10px;margin-top:8px;}
#sit_ov_btn .gm-ic-btn{
  flex:0 0 56px;height:56px;display:flex;align-items:center;justify-content:center;
  border:1.5px solid var(--line);border-radius:12px;background:#fff;color:#b5b5b0;
  cursor:pointer;transition:all .2s;padding:0;
}
#sit_ov_btn .gm-ic-btn svg{width:24px;height:24px;display:block;}
#sit_ov_btn .sit_btn_wish:hover{color:#e0392b;border-color:#f2b3ad;background:#fff7f6;}
#sit_ov_btn .sit_btn_cart.gm-ic-btn:hover{color:var(--point-dark);border-color:var(--point);background:#f1f6ea;}
/* 담긴 상품 표시 (빨간색) */
#sit_ov_btn .gm-ic-btn.on{color:#e0392b;border-color:#e0392b;background:#fff5f4;}
#sit_ov_btn .gm-ic-btn.on::after{content:'';position:absolute;}
#sit_ov_btn .sit_btn_buy{flex:1;height:56px;border:none;border-radius:12px;background:var(--point);color:#fff;font-size:16px;font-weight:800;font-family:inherit;cursor:pointer;transition:background .2s;}
#sit_ov_btn .sit_btn_buy:hover{background:var(--point-dark);}
/* 코어 앵커바(.sanchor) 노출 방지 (리뷰/문의 제거 후 잔여 요소 가드) */
.sanchor{display:none!important;}
#sit_ov_btn #sit_btn_alm{flex:1;height:56px;display:flex;align-items:center;justify-content:center;border:1.5px solid var(--line);border-radius:12px;background:#fff;color:var(--txt);font-size:15px;font-weight:800;transition:all .2s;}
#sit_ov_btn #sit_btn_alm:hover{border-color:var(--point);color:var(--point-dark);}

/* 이전/다음 상품 버튼은 스킨에서 제거됨 (2026-07-25 요청) — 잔여 노출 방지 가드 */
#sit_siblings{display:none;}

/* ---------- 관련상품 ---------- */
#sit_rel{margin:20px 0 30px;}
#sit_rel > h2{font-size:22px;font-weight:900;letter-spacing:-.5px;display:flex;align-items:center;gap:10px;margin-bottom:18px;}
#sit_rel > h2::before{content:'';width:6px;height:20px;border-radius:3px;background:var(--point);}

/* ---------- 하단 탭 (시안 .pd-tabs) ---------- */
/* 코어 style.css 의 #sit_info{display:inline-flex;min-height:600px;border;background} 가
   콘텐츠 겹침/폭 찌그러짐을 유발 → 시안 구조(block)로 완전 무력화 */
#sit_info{display:block;width:auto;min-height:0;margin:10px 0 0;border:0;background:transparent;padding:0;}
/* 코어 .sit_info{border-top/bottom} 이 우측 부가정보 표에 불필요한 선 생성 → 제거 */
#sit_ov .sit_info{border:0;padding:0;}
/* 코어 #sit_tab{width:928px;display:table-cell} 이 내용 폭에 따라 수축 →
   배송/교환 탭에서 레이아웃이 좁아지는 원인. block 으로 무력화 */
#sit_tab{display:block;width:100%;}
#sit_tab .tab_tit{display:flex;list-style:none;margin:0;padding:0;border-bottom:1.5px solid var(--txt);position:sticky;top:53px;background:var(--bg,#fcfcfc);z-index:50;}
#sit_tab .tab_tit li{flex:1;margin:0;float:none;}
#sit_tab .tab_tit li button{width:100%;padding:16px 0;text-align:center;font-size:15px;font-weight:700;color:#999;background:none;border:0;position:relative;cursor:pointer;font-family:inherit;transition:color .2s;}
#sit_tab .tab_tit li button.selected{color:var(--txt);font-weight:900;background:none;}
#sit_tab .tab_tit li button.selected::after{content:'';position:absolute;left:0;right:0;bottom:-1.5px;height:3px;background:var(--point);}
#sit_tab .item_use_count,
#sit_tab .item_qa_count{color:var(--point-dark);font-size:12px;margin-left:3px;background:none;}
#sit_tab .tab_con{list-style:none;margin:0;padding:0;}
#sit_tab .tab_con > li{padding:40px 10px;border:0;}
#sit_tab .tab_con h2{font-size:18px;font-weight:900;letter-spacing:-.5px;margin:0 0 18px;}
#sit_tab .tab_con h2.contents_tit{position:absolute;width:0;height:0;overflow:hidden;margin:0;}
/* 코어 #sit_inf h3{position:absolute;font-size:0} 가 "상품 정보 고시" 제목을
   테이블 위(제품소재)에 겹치게 함 → 정상 흐름으로 복귀시켜 테이블 바로 위에 배치 */
#sit_tab .tab_con h3{position:static;clear:both;font-size:15px;font-weight:800;line-height:1.5;margin:26px 0 12px;}

/* 상세설명 이미지/정보고시 */
#sit_inf_explan{text-align:center;overflow-x:auto;}
#sit_inf_explan img{max-width:100%;height:auto;}
#sit_inf_explan iframe,#sit_inf_explan video{max-width:100%;}
#sit_inf_explan table{max-width:100%;}
#sit_hhtml img{max-width:100%;height:auto;}
#sit_inf_open{width:100%;border-collapse:collapse;font-size:13.5px;color:#666;border-top:1.5px solid var(--txt);}
#sit_inf_open th{width:220px;padding:12px 14px;text-align:left;background:#fafaf8;border-bottom:1px solid var(--line);color:#555;font-weight:700;}
#sit_inf_open td{padding:12px 14px;border-bottom:1px solid var(--line);}

/* 배송/교환 안내 (시안 .box) */
#sit_dvr,#sit_ex{background:#fff;border:1px solid var(--line);border-radius:16px;padding:24px 28px;margin-bottom:14px;font-size:14px;color:#666;line-height:1.9;}
#sit_dvr h3,#sit_ex h3{font-size:16.5px;font-weight:800;margin:0 0 14px;color:var(--txt);}

/* ---------- 사이드 구매패널(#sit_buy) → 모바일 하단 고정바(시안 .sticky-buy) ---------- */
#sit_buy{display:none;}
@media (max-width:768px){
  #sit_buy{display:block;position:fixed;left:0;right:0;bottom:0;top:auto;width:auto;z-index:180;background:#fff;border-top:1px solid var(--line);padding:10px 14px calc(10px + env(safe-area-inset-bottom));box-shadow:0 -6px 20px rgba(0,0,0,.06);}
  #sit_buy .sit_buy_inner{width:auto;}
  /* 하단바에서는 옵션/선택옵션/합계 UI 는 숨기고 버튼만 노출 (시안 .sticky-buy) */
  #sit_buy .sit_side_option,
  #sit_buy .sit_sel_option,
  #sit_buy .sit_tot_price{display:none;}
  #sit_buy .sum_section{display:block;}
  /* [♥][🛒][장바구니][바로구매] 한 줄 구성
     코어 .sit_order_btn button{padding:15px 0} / .sit_btn_cart{margin-bottom:5px} 가
     버튼 높이·정렬을 흐트러뜨림 → 전부 리셋 후 높이 48px 통일 */
  #sit_buy .sit_order_btn{display:flex;gap:8px;align-items:stretch;}
  #sit_buy .sit_order_btn a,
  #sit_buy .sit_order_btn button{margin:0;padding:0;height:48px;box-sizing:border-box;line-height:1;text-decoration:none;}
  #sit_buy .gm-bar-ic{flex:0 0 46px;height:48px;display:flex;align-items:center;justify-content:center;border:1.5px solid var(--line);border-radius:12px;background:#fff;color:#b5b5b0;padding:0;cursor:pointer;}
  #sit_buy .gm-bar-ic svg{width:20px;height:20px;display:block;}
  #sit_buy .gm-bar-ic.on{color:#e0392b;border-color:#e0392b;background:#fff5f4;}
  #sit_buy .sit_order_btn .sit_btn_cart:not(.gm-bar-ic){flex:1;height:48px;border:1.5px solid var(--point);border-radius:12px;background:#fff;color:var(--point-dark);font-size:15px;font-weight:800;font-family:inherit;cursor:pointer;}
  #sit_buy .sit_order_btn .sit_btn_buy{flex:1.2;height:48px;border:none;border-radius:12px;background:var(--point);color:#fff;font-size:15px;font-weight:800;font-family:inherit;cursor:pointer;}
}

/* ---------- 반응형 ---------- */
@media (max-width:1024px){
  #sit_ov_wrap{grid-template-columns:1fr 1fr;gap:30px;}
}
@media (max-width:768px){
  #sit{padding:0 16px;}
  #sit_ov_wrap{grid-template-columns:1fr;gap:24px;margin-bottom:30px;}
  #sit_title{font-size:20px;}
  .gm-price-box .now .pr{font-size:24px;}
  .gm-price-box .now .dc{font-size:22px;}
  #sit_tab .tab_tit{top:49px;}
  #sit_tab .tab_con > li{padding:28px 2px;}
  /* 시안 : 모바일에서는 본문 버튼줄 숨기고 하단 고정바([♥][🛒][장바구니][바로구매])만 사용 */
  #sit_ov_btn .gm-ic-btn,
  #sit_ov_btn .sit_btn_buy{display:none;}
  #sit_ov_btn #sit_btn_alm{flex:1;height:48px;}
  #sit_info{padding-bottom:80px;}
  #sit_inf_open th{width:120px;padding:10px 10px;}
  #sit_inf_open td{padding:10px 10px;}
  #sit_dvr,#sit_ex{padding:18px 16px;border-radius:12px;}
  /* 모바일에서는 좁은 화면 대비 폭을 넓게 (세로 2단 배치는 동일) */
  .gm-zip-btns{width:80%;}
  #sit_pvi_thumb li a{width:76px;height:76px;}
  .gm-zip-btn{height:40px;font-size:12px;padding:0 4px;}
}

/* ============================================================
   엑셀 대량주문용 주문코드(옵션코드) 복사 박스
   extend/gm.item.extend.php → gm_item_order_code_box()
   ============================================================ */
#sit_ov .gm-optcode{
  margin:0 0 18px;padding:16px 16px 14px;
  border:1px solid #dbe8c8;border-radius:14px;background:#f7faf2;
}
#sit_ov .gm-optcode h3{display:flex;align-items:center;gap:8px;margin:0 0 4px;}
#sit_ov .gm-optcode h3 small{
  font-size:11px;font-weight:700;color:#fff;background:var(--point,#6fb02e);
  padding:3px 8px;border-radius:10px;letter-spacing:.2px;
}
.gm-optcode-desc{font-size:12.5px;color:#7d8f6a;margin:0 0 10px;line-height:1.6;}
.gm-optcode-desc b{color:var(--point-dark,#5a9422);font-weight:800;}
.gm-optcode-lock{font-size:12.5px;color:#9aa693;margin:0;line-height:1.6;}

.gm-optcode-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;}
.gm-optcode-list li{
  display:grid;grid-template-columns:1fr auto;grid-template-areas:"name btn" "code btn" "meta btn";
  align-items:center;column-gap:10px;
  background:#fff;border:1px solid #e4ecd8;border-radius:10px;padding:9px 10px 9px 12px;
}
.gm-optcode-list .oc-acts{grid-area:btn;display:flex;align-items:center;gap:6px;flex-shrink:0;}
.gm-optcode-list li.off{opacity:.5;}
.gm-optcode-list .oc-name{grid-area:name;font-size:13px;font-weight:700;color:var(--txt);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.gm-optcode-list .oc-code{grid-area:code;font-size:13px;font-weight:800;color:var(--point-dark,#5a9422);
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.3px;word-break:break-all;}
.gm-optcode-list .oc-meta{grid-area:meta;font-size:11.5px;color:#a5a5a0;}

.oc-copy{
  grid-area:btn;flex-shrink:0;height:34px;padding:0 14px;border-radius:9px;cursor:pointer;
  border:1.5px solid var(--point,#6fb02e);background:#fff;color:var(--point-dark,#5a9422);
  font-size:12.5px;font-weight:800;font-family:inherit;transition:all .15s;white-space:nowrap;
}
.oc-copy:hover{background:var(--point,#6fb02e);color:#fff;}
.oc-copy.done{background:var(--point-dark,#5a9422);border-color:var(--point-dark,#5a9422);color:#fff;}
.oc-copy-all{width:100%;margin-top:8px;height:38px;}

/* 주문코드 옆 카트주문 담기 버튼 (2026-07-27) */
.oc-cart{
  flex-shrink:0;width:38px;height:34px;padding:0;border-radius:9px;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;
  border:1.5px solid var(--point,#6fb02e);background:var(--point,#6fb02e);color:#fff;
  font-size:15px;line-height:1;font-family:inherit;transition:all .15s;
}
.oc-cart:hover{background:var(--point-dark,#5a9422);border-color:var(--point-dark,#5a9422);}
.oc-cart .oc-cart-ico{width:18px;height:18px;display:block;}
#container .oc-cart .oc-cart-ico{height:18px;}

/* 품절/판매중지 : 코드복사·카트담기 모두 잠금 (요청 1) */
.oc-copy[disabled],.oc-cart[disabled]{
  cursor:not-allowed;background:#f2f2f2;border-color:#dcdcdc;color:#aaa;
}
.oc-copy[disabled]:hover,.oc-cart[disabled]:hover{background:#f2f2f2;border-color:#dcdcdc;color:#aaa;}

@media (max-width:768px){
  #sit_ov .gm-optcode{padding:14px 12px 12px;}
  .gm-optcode-list li{padding:9px 8px 9px 10px;}
  .oc-copy{padding:0 11px;font-size:12px;}
  .oc-cart{width:34px;}
}

/* ── 품절 옵션 비활성 표시 (extend/gm.item.extend.php gm_item_soldout_option_script) ── */
select.it_option option.gm-opt-soldout,
select.it_supply option.gm-opt-soldout{
  color:#b6b6b6;background:#f3f3f3;font-style:italic;
}
.sit_option select.gm-sel-soldout{background-image:none;}
.gm-optcode-list li.off .oc-code{color:#a8a8a8;}
.gm-optcode-list li.off .oc-copy{border-color:#d5d5d5;color:#a8a8a8;}
.gm-optcode-list li.off .oc-copy:hover{background:#f0f0f0;color:#8d8d8d;}