/**
 * 상품포털 CSS — 심플·명확·가독성 우선 (v2.0)
 * 원칙: 아이콘 없음 / 그라디언트 없음 / 최소 14px / 단색 버튼
 */

/* ── 변수 ── */
:root {
  --sh-accent:  #2563eb;   /* 주요 액션 (단일 파란색) */
  --sh-text:    #111827;   /* 주요 텍스트 */
  --sh-gray:    #6b7280;   /* 보조 텍스트 */
  --sh-light:   #f3f4f6;   /* 배경·구분선 */
  --sh-border:  #d1d5db;   /* 테두리 */
  --sh-white:   #ffffff;
  --sh-danger:  #dc2626;
  --sh-success: #16a34a;
  --sh-price:   #1d4ed8;   /* 가격 강조 */
  --sh-sale:    #b91c1c;   /* 할인가 */

  --sh-fs-xs:   var(--fs-sm,   15px);
  --sh-fs-sm:   var(--fs-sm,   15px);
  --sh-fs-base: var(--fs-base, 16px);
  --sh-fs-md:   var(--fs-md,   17px);
  --sh-fs-lg:   var(--fs-lg,   18px);
  --sh-fs-xl:   var(--fs-xl,   20px);
  --sh-fs-2xl:  var(--fs-2xl,  24px);
  --sh-fs-3xl:  var(--fs-3xl,  28px);

  /* 하위 호환 — 기존 변수명 유지 */
  --sh-green:   var(--sh-accent);
  --sh-green2:  #1d4ed8;
  --sh-orange:  var(--sh-accent);
  --sh-dark:    var(--sh-text);
  --sh-bg:      var(--sh-light);
  --sh-red:     var(--sh-danger);
  --bl-list:    var(--sh-accent);
  --bl-list2:   #1d4ed8;
  --bl-list-light:  #eff6ff;
  --bl-list-border: #bfdbfe;
  --bl-list-text:   #1e3a8a;
  --bl-detail:      var(--sh-accent);
  --bl-detail2:     #1d4ed8;
  --bl-detail-light:  #eff6ff;
  --bl-detail-border: #bfdbfe;
  --bl-detail-text:   #1e3a8a;
  --bl-form:        #374151;
  --bl-form2:       #4b5563;
  --bl-form-light:  var(--sh-light);
  --bl-form-border: var(--sh-border);
  --bl-form-text:   var(--sh-text);
  --bl-admin:       #374151;
  --bl-admin2:      #4b5563;
  --bl-admin-light: var(--sh-light);
  --bl-admin-border:var(--sh-border);
  --bl-admin-text:  var(--sh-text);
}

/* ── 리셋 ── */
*, *::before, *::after { box-sizing: border-box; }
body { font-family: 'Apple SD Gothic Neo','Malgun Gothic','맑은 고딕',-apple-system,sans-serif; margin:0; background:#fff; color:var(--sh-text); line-height:1.6; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
img { max-width:100%; display:block; }
button { font-family:inherit; cursor:pointer; }

/* ── 레이아웃 ── */
.sh-page-wrap   { padding:24px 0 48px; }
.sh-breadcrumb  { font-size:var(--sh-fs-sm); color:var(--sh-gray); margin-bottom:20px; }
.sh-breadcrumb a{ text-decoration:none; color:var(--sh-gray); }
.sh-breadcrumb a:hover { color:var(--sh-text); }
.sh-breadcrumb span { margin:0 6px; }

/* ── 버튼 시스템 ── */
.btn-green,.btn-primary,.btn-orange,.btn-list {
  display:inline-flex; align-items:center; justify-content:center;
  border:none; border-radius:6px;
  font-size:var(--sh-fs-base); font-weight:700; padding:10px 20px;
  background:var(--sh-accent); color:#fff;
  transition:background .15s;
}
.btn-green:hover,.btn-primary:hover,.btn-orange:hover,.btn-list:hover { background:#1d4ed8; }
.btn-outline {
  display:inline-flex; align-items:center; justify-content:center;
  border:1.5px solid var(--sh-border); border-radius:6px;
  font-size:var(--sh-fs-sm); font-weight:600; padding:9px 18px;
  background:#fff; color:var(--sh-text);
  transition:border-color .15s,color .15s;
}
.btn-outline:hover { border-color:var(--sh-accent); color:var(--sh-accent); }

/* ── 상품 카드 ── */
.sh-product-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.sh-product-card {
  display:flex; flex-direction:column;
  border:1px solid var(--sh-border); border-radius:8px;
  overflow:hidden; text-decoration:none; color:var(--sh-text);
  background:#fff;
  transition:border-color .15s;
}
.sh-product-card:hover { border-color:#9ca3af; }
.sh-product-img { aspect-ratio:1; overflow:hidden; background:var(--sh-light); }
.sh-product-img img { width:100%; height:100%; object-fit:cover; transition:transform .2s; }
.sh-product-card:hover .sh-product-img img { transform:scale(1.03); }
.sh-product-info { padding:14px; flex:1; display:flex; flex-direction:column; gap:6px; }
.sh-product-cat  { font-size:14px; color:var(--sh-gray); }
.sh-product-name { font-size:var(--sh-fs-base); font-weight:700; line-height:1.4; color:var(--sh-text); }
.sh-product-foot { padding:0 14px 14px; display:flex; flex-direction:column; gap:4px; }
.sh-product-price { font-size:var(--sh-fs-lg); font-weight:800; color:var(--sh-price); }
.sh-product-footer { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.sh-rating { font-size:14px; color:var(--sh-gray); }
.sh-badge-sale { display:inline-block; font-size:14px; font-weight:700; color:var(--sh-sale); }
.sh-badge-best-sm { font-size:14px; font-weight:800; color:var(--sh-accent); }
.sh-empty { text-align:center; padding:60px 20px; color:var(--sh-gray); }
.sh-empty .icon { display:none; }
.sh-empty p { font-size:var(--sh-fs-md); margin:0 0 16px; }

/* ── 필터 바 ── */
.sh-filter-bar { display:flex; flex-wrap:wrap; align-items:center; gap:10px; padding:14px 0; margin-bottom:20px; border-bottom:1px solid var(--sh-border); }
.sh-filter-left { display:flex; flex-wrap:wrap; align-items:center; gap:8px; flex:1; }
.sh-filter-tag  { font-size:14px; font-weight:700; color:var(--sh-text); }
.sh-filter-count{ font-size:14px; color:var(--sh-gray); }
.sh-sort-select { border:1px solid var(--sh-border); border-radius:6px; padding:7px 10px; font-size:14px; outline:none; background:#fff; }

/* ── 장바구니 버튼 ── */
.sh-add-cart-btn {
  border:1.5px solid var(--sh-border); border-radius:6px;
  background:#fff; padding:8px 12px; font-size:14px; font-weight:600;
  color:var(--sh-text); transition:border-color .15s,background .15s;
}
.sh-add-cart-btn:hover { border-color:var(--sh-accent); color:var(--sh-accent); background:var(--sh-light); }

/* ── 페이지네이션 ── */
.sh-pagination { display:flex; justify-content:center; gap:6px; margin-top:32px; flex-wrap:wrap; }
.sh-page-btn {
  min-width:36px; height:36px; padding:0 10px;
  border:1px solid var(--sh-border); border-radius:6px;
  background:#fff; font-size:14px; font-weight:600; color:var(--sh-text);
  transition:all .12s;
}
.sh-page-btn.active { background:var(--sh-accent); color:#fff; border-color:var(--sh-accent); }
.sh-page-btn:hover:not(.active) { border-color:var(--sh-accent); color:var(--sh-accent); }

/* ── 상품 상세 ── */
.sh-detail-wrap { display:grid; grid-template-columns:480px 1fr; gap:40px; align-items:start; }
.sh-detail-img-wrap { position:sticky; top:100px; }
.sh-main-img { border:1px solid var(--sh-border); border-radius:8px; overflow:hidden; aspect-ratio:1; }
.sh-main-img img { width:100%; height:100%; object-fit:cover; }

.sh-detail-side { display:flex; flex-direction:column; gap:20px; }
.sh-detail-cat  { font-size:14px; color:var(--sh-gray); }
.sh-detail-name { font-size:var(--sh-fs-2xl); font-weight:800; line-height:1.35; color:var(--sh-text); margin:0; }
.sh-detail-badges { display:flex; flex-wrap:wrap; gap:6px; }
.sh-badge-best-lg { font-size:14px; font-weight:800; color:var(--sh-accent); padding:3px 10px; border:1.5px solid var(--sh-accent); border-radius:4px; }
.sh-badge-new { font-size:14px; font-weight:700; color:var(--sh-success); padding:3px 10px; border:1.5px solid var(--sh-success); border-radius:4px; }
.sh-detail-rating { display:flex; align-items:center; gap:8px; font-size:14px; color:var(--sh-gray); }

.sh-price-block   { padding:16px 0; border-top:1px solid var(--sh-light); border-bottom:1px solid var(--sh-light); }
.sh-price-origin  { font-size:var(--sh-fs-sm); color:var(--sh-gray); text-decoration:line-through; margin-bottom:4px; }
.sh-price-final   { font-size:var(--sh-fs-3xl); font-weight:900; color:var(--sh-price); }
.sh-price-rate    { font-size:var(--sh-fs-md); font-weight:800; color:var(--sh-sale); margin-left:8px; }
.sh-member-badge  { display:inline-block; font-size:14px; font-weight:700; color:var(--sh-accent); padding:4px 10px; border:1.5px solid var(--sh-accent); border-radius:4px; }
.sh-sale-label    { display:inline-block; font-size:14px; font-weight:700; color:var(--sh-sale); padding:4px 10px; border:1.5px solid var(--sh-sale); border-radius:4px; }
.sh-sale-always   { font-size:14px; color:var(--sh-sale); font-weight:600; padding:6px 0; }
.sh-sale-timer    { font-size:14px; color:var(--sh-sale); font-weight:700; }
.sh-member-icon   { display:none; }

.sh-spec-row { display:flex; gap:8px; flex-wrap:wrap; }
.sh-spec-tag { font-size:14px; color:var(--sh-gray); padding:4px 10px; border:1px solid var(--sh-border); border-radius:4px; }

.sh-delivery-info { font-size:14px; color:var(--sh-gray); display:flex; flex-wrap:wrap; gap:16px; }
.sh-delivery-info span { display:flex; align-items:center; gap:4px; }

.sh-opt-label   { font-size:var(--sh-fs-sm); font-weight:700; margin-bottom:6px; color:var(--sh-text); }
.sh-opt-select  { width:100%; border:1px solid var(--sh-border); border-radius:6px; padding:10px 12px; font-size:var(--sh-fs-sm); outline:none; background:#fff; }
.sh-opt-select:focus { border-color:var(--sh-accent); }

.sh-qty-label { font-size:var(--sh-fs-sm); font-weight:700; color:var(--sh-text); margin-bottom:6px; }
.sh-qty-ctrl  { display:flex; border:1px solid var(--sh-border); border-radius:6px; overflow:hidden; width:120px; }
.sh-qty-ctrl button { background:#fff; border:none; width:40px; height:40px; font-size:20px; font-weight:700; color:var(--sh-text); transition:background .12s; }
.sh-qty-ctrl button:hover { background:var(--sh-light); }
.sh-qty-ctrl input  { width:40px; border:0; border-left:1px solid var(--sh-border); border-right:1px solid var(--sh-border); text-align:center; font-size:var(--sh-fs-sm); font-weight:700; outline:none; }

.sh-buy-btns  { display:flex; gap:10px; }
.sh-btn-buy   { flex:1; background:var(--sh-accent); color:#fff; border:none; padding:14px; border-radius:6px; font-size:var(--sh-fs-md); font-weight:800; }
.sh-btn-buy:hover { background:#1d4ed8; }
.sh-btn-cart  { flex:1; background:#fff; color:var(--sh-text); border:1.5px solid var(--sh-border); padding:14px; border-radius:6px; font-size:var(--sh-fs-md); font-weight:700; }
.sh-btn-cart:hover { border-color:var(--sh-accent); color:var(--sh-accent); }

/* ── 탭 ── */
.sh-tabs { border-bottom:2px solid var(--sh-border); display:flex; gap:0; margin-bottom:28px; }
.sh-tab  { padding:12px 20px; font-size:var(--sh-fs-sm); font-weight:600; color:var(--sh-gray); cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-2px; transition:color .12s; }
.sh-tab.active { color:var(--sh-accent); border-bottom-color:var(--sh-accent); }
.sh-tab-content  { display:none; }
.sh-tab-content.active { display:block; }

/* ── 상품 설명 ── */
.sh-desc { font-size:var(--sh-fs-sm); color:var(--sh-text); line-height:1.8; }
.sh-desc h3 { font-size:var(--sh-fs-md); font-weight:800; margin:24px 0 10px; color:var(--sh-text); }
.sh-desc ul  { padding-left:18px; margin:0 0 16px; }
.sh-desc li  { margin-bottom:6px; color:var(--sh-gray); }
.sh-info-table { width:100%; border-collapse:collapse; font-size:var(--sh-fs-sm); }
.sh-info-table th { background:var(--sh-light); padding:10px 14px; font-weight:600; color:var(--sh-text); width:30%; border-bottom:1px solid var(--sh-border); text-align:left; }
.sh-info-table td { padding:10px 14px; border-bottom:1px solid var(--sh-border); color:var(--sh-gray); }

/* ── 리뷰 ── */
.sh-review-item  { border-bottom:1px solid var(--sh-border); padding:16px 0; }
.sh-review-header{ display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.sh-review-author{ font-size:var(--sh-fs-sm); font-weight:700; color:var(--sh-text); }
.sh-review-rating{ font-size:14px; color:#ca8a04; margin-left:8px; }
.sh-review-date  { font-size:14px; color:var(--sh-gray); }
.sh-review-content{ font-size:var(--sh-fs-sm); color:var(--sh-text); line-height:1.7; margin:0; }
.sh-review-write { background:var(--sh-light); border-radius:8px; border:1px solid var(--sh-border); padding:16px; margin-bottom:20px; }

/* ── 연관 상품 ── */
.sh-related-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }

/* ── 장바구니 ── */
.sh-cart-wrap { display:grid; grid-template-columns:1fr 320px; gap:32px; align-items:start; }
.sh-cart-item { display:flex; gap:16px; padding:20px 0; border-bottom:1px solid var(--sh-border); }
.sh-cart-thumb { width:80px; height:80px; border-radius:6px; object-fit:cover; border:1px solid var(--sh-border); flex-shrink:0; }
.sh-cart-info  { flex:1; }
.sh-cart-name  { font-size:var(--sh-fs-sm); font-weight:700; color:var(--sh-text); margin-bottom:4px; }
.sh-cart-opt   { font-size:14px; color:var(--sh-gray); margin-bottom:8px; }
.sh-cart-price { font-size:var(--sh-fs-md); font-weight:800; color:var(--sh-price); }

/* ── 주문 요약 ── */
.sh-cart-summary { border:1px solid var(--sh-border); border-radius:8px; padding:20px; position:sticky; top:100px; }
.sh-summary-row  { display:flex; align-items:center; justify-content:space-between; font-size:var(--sh-fs-sm); padding:8px 0; border-bottom:1px solid var(--sh-light); }
.sh-summary-total{ display:flex; align-items:center; justify-content:space-between; padding:14px 0 0; }
.sh-summary-total .label  { font-size:var(--sh-fs-sm); font-weight:700; color:var(--sh-text); }
.sh-summary-total .amount { font-size:var(--sh-fs-xl); font-weight:900; color:var(--sh-price); }
.sh-checkout-btn { width:100%; background:var(--sh-accent); color:#fff; border:none; padding:14px; border-radius:6px; font-size:var(--sh-fs-md); font-weight:800; margin-top:14px; }
.sh-checkout-btn:hover { background:#1d4ed8; }

/* ── 주문서 ── */
.sh-order-wrap { display:grid; grid-template-columns:1fr 360px; gap:32px; align-items:start; }
.sh-section-box { border:1px solid var(--sh-border); border-radius:8px; padding:20px; margin-bottom:16px; }
.sh-section-box h2 { font-size:var(--sh-fs-md); font-weight:800; margin:0 0 16px; color:var(--sh-text); padding-bottom:12px; border-bottom:1px solid var(--sh-border); }
.sh-form-group { margin-bottom:14px; }
.sh-form-group label { display:block; font-size:14px; font-weight:600; margin-bottom:6px; color:var(--sh-text); }
.sh-form-group input,
.sh-form-group select,
.sh-form-group textarea { width:100%; border:1px solid var(--sh-border); border-radius:6px; padding:10px 12px; font-size:var(--sh-fs-sm); outline:none; font-family:inherit; }
.sh-form-group input:focus,
.sh-form-group select:focus,
.sh-form-group textarea:focus { border-color:var(--sh-accent); }
.sh-form-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.sh-same-check { display:flex; align-items:center; gap:8px; font-size:14px; font-weight:600; color:var(--sh-accent); cursor:pointer; margin-bottom:14px; }
.sh-invoice-box { margin-top:12px; display:none; }

/* 결제 수단 */
.sh-pay-methods { display:flex; gap:10px; }
.sh-pay-item { flex:1; border:1.5px solid var(--sh-border); border-radius:6px; padding:14px 10px; cursor:pointer; text-align:center; transition:all .15s; }
.sh-pay-item.active { border-color:var(--sh-accent); background:var(--sh-light); }
.sh-pay-item input { display:none; }
.sh-pay-icon { display:none; }
.sh-pay-label { font-size:var(--sh-fs-sm); font-weight:700; color:var(--sh-text); display:block; }

/* 약관 */
.sh-agree-box { display:flex; flex-direction:column; gap:8px; }
.sh-agree-item { display:flex; align-items:center; gap:8px; font-size:var(--sh-fs-sm); cursor:pointer; color:var(--sh-text); }

/* 주문 요약 사이드바 */
.sh-order-summary { border:1px solid var(--sh-border); border-radius:8px; padding:20px; position:sticky; top:100px; }
.sh-order-summary h3 { font-size:var(--sh-fs-md); font-weight:800; margin:0 0 14px; color:var(--sh-text); border-bottom:1px solid var(--sh-border); padding-bottom:12px; }
.sh-order-item { display:flex; gap:12px; padding:10px 0; border-bottom:1px solid var(--sh-light); }
.sh-order-thumb { width:56px; height:56px; border-radius:6px; object-fit:cover; border:1px solid var(--sh-border); flex-shrink:0; }
.sh-order-item-info { flex:1; }
.sh-order-item-name { font-size:14px; font-weight:600; color:var(--sh-text); line-height:1.4; }
.sh-order-item-price { font-size:14px; font-weight:800; color:var(--sh-price); margin-top:4px; }
.sh-summary-divider { border:0; border-top:1px solid var(--sh-border); margin:12px 0; }
.sh-pay-btn { width:100%; background:var(--sh-accent); color:#fff; border:none; padding:14px; border-radius:6px; font-size:var(--sh-fs-md); font-weight:800; margin-top:14px; }
.sh-pay-btn:hover { background:#1d4ed8; }

/* ── 주문 완료 ── */
.sh-complete-wrap { max-width:560px; margin:48px auto; text-align:center; }
.sh-complete-icon { font-size:32px; margin-bottom:16px; display:none; }
.sh-complete-title { font-size:var(--sh-fs-2xl); font-weight:900; color:var(--sh-text); margin:0 0 8px; }
.sh-complete-sub   { font-size:var(--sh-fs-sm); color:var(--sh-gray); margin:0 0 32px; }
.sh-complete-box   { border:1px solid var(--sh-border); border-radius:8px; padding:20px; text-align:left; margin-bottom:24px; }
.sh-complete-row   { display:flex; justify-content:space-between; padding:8px 0; border-bottom:1px solid var(--sh-light); font-size:var(--sh-fs-sm); }
.sh-complete-row:last-child { border-bottom:0; }
.sh-complete-btns  { display:flex; gap:12px; justify-content:center; }
.sh-complete-btns a{ padding:12px 28px; border-radius:6px; font-size:var(--sh-fs-sm); font-weight:700; }

/* ── 포인트/크레딧 충전 ── */
.sh-charge-wrap { max-width:500px; margin:0 auto; }

/* ── 상품포털 홈·공통 (아이콘 없음 · 심플) ── */
.sh-portal-scope { color:var(--sh-text); }
.sh-util-bar { background:#f9fafb; border-bottom:1px solid var(--sh-border); font-size:var(--sh-fs-sm); color:var(--sh-gray); padding:8px 16px; }
.sh-util-bar .inner { max-width:1200px; margin:0 auto; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:8px; }
.sh-util-bar a { color:var(--sh-accent); text-decoration:none; margin-left:12px; font-weight:600; }
.sh-util-bar a:hover { text-decoration:underline; }

.sh-header { background:#fff; border-bottom:1px solid var(--sh-border); position:sticky; top:0; z-index:900; }
.sh-header-inner { max-width:1200px; margin:0 auto; padding:14px 16px; display:flex; flex-wrap:wrap; align-items:center; gap:16px; }
.sh-logo { text-decoration:none; }
.sh-logo-text strong { display:block; font-size:var(--sh-fs-lg); font-weight:800; color:var(--sh-text); }
.sh-logo-text span { font-size:var(--sh-fs-sm); color:var(--sh-gray); }
.sh-header-actions { display:flex; align-items:center; gap:12px; margin-left:auto; }
.sh-header-link { font-size:var(--sh-fs-sm); font-weight:700; color:var(--sh-text); text-decoration:none; padding:8px 14px; border:1px solid var(--sh-border); border-radius:6px; }
.sh-header-link:hover { border-color:var(--sh-accent); color:var(--sh-accent); }
.sh-header-link .count { display:inline-block; min-width:18px; margin-left:4px; padding:0 5px; border-radius:10px; background:var(--sh-accent); color:#fff; font-size:14px; font-weight:800; text-align:center; }

.sh-cat-nav { background:#fff; border-bottom:1px solid var(--sh-border); }
.sh-cat-nav .inner { max-width:1200px; margin:0 auto; padding:0 16px; display:flex; gap:4px; overflow-x:auto; scrollbar-width:none; }
.sh-cat-nav .inner::-webkit-scrollbar { display:none; }
.sh-cat-item { white-space:nowrap; padding:12px 14px; font-size:var(--sh-fs-sm); font-weight:600; color:var(--sh-gray); text-decoration:none; border-bottom:2px solid transparent; }
.sh-cat-item:hover, .sh-cat-item.active { color:var(--sh-accent); border-bottom-color:var(--sh-accent); }

.sh-cta-row { max-width:1200px; margin:16px auto 8px; padding:0 16px; display:flex; flex-wrap:wrap; gap:8px; }
.sh-cta-btn { display:inline-block; padding:10px 18px; border-radius:6px; font-size:var(--sh-fs-sm); font-weight:700; text-decoration:none; }
.sh-cta-btn--primary { background:var(--sh-accent); color:#fff; }
.sh-cta-btn--primary:hover { background:#1d4ed8; }
.sh-cta-btn--outline { background:#fff; color:var(--sh-accent); border:1.5px solid var(--sh-accent); }
.sh-cta-btn--outline:hover { background:#eff6ff; }

.sh-trust-list { max-width:1200px; margin:0 auto 20px; padding:12px 16px; display:flex; flex-wrap:wrap; gap:10px 16px; border:1px solid var(--sh-border); border-radius:8px; background:#f9fafb; }
.sh-trust-list span { font-size:var(--sh-fs-sm); color:var(--sh-text); font-weight:600; }

.sh-section { max-width:1200px; margin:0 auto; padding:28px 16px; }
.sh-section-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; gap:12px; }
.sh-section-title { margin:0; font-size:var(--sh-fs-xl); font-weight:800; color:var(--sh-text); }
.sh-section-more { font-size:var(--sh-fs-sm); color:var(--sh-accent); font-weight:700; text-decoration:none; }
.sh-section-more:hover { text-decoration:underline; }

.sh-cat-chips { display:flex; flex-wrap:wrap; gap:8px; }
.sh-cat-chip { display:inline-block; padding:10px 16px; border:1px solid var(--sh-border); border-radius:6px; font-size:var(--sh-fs-sm); font-weight:700; color:var(--sh-text); text-decoration:none; background:#fff; }
.sh-cat-chip:hover { border-color:var(--sh-accent); color:var(--sh-accent); }

.sh-promo-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:8px; }
.sh-promo-card { border:1px solid var(--sh-border); border-radius:8px; padding:20px; text-decoration:none; color:var(--sh-text); background:#fff; }
.sh-promo-card:hover { border-color:var(--sh-accent); }
.sh-promo-tag { display:inline-block; font-size:14px; font-weight:700; color:var(--sh-accent); margin-bottom:8px; }
.sh-promo-card h3 { margin:0 0 6px; font-size:var(--sh-fs-lg); font-weight:800; }
.sh-promo-card p { margin:0; font-size:var(--sh-fs-sm); color:var(--sh-gray); }

.sh-product-origin { font-size:14px; color:var(--sh-gray); margin:4px 0 8px; }
.sh-product-origin em { font-style:normal; font-weight:600; color:var(--sh-text); }
.sh-price-row { display:flex; align-items:baseline; flex-wrap:wrap; gap:6px; }
.sh-cart-btn, .sh-cart-quick { border:1px solid var(--sh-border); background:#fff; color:var(--sh-text); border-radius:6px; padding:6px 12px; font-size:14px; font-weight:700; }
.sh-cart-btn:hover, .sh-cart-quick:hover { border-color:var(--sh-accent); color:var(--sh-accent); }
.sh-badge-member { font-size:14px; font-weight:700; color:var(--sh-accent); padding:2px 8px; border:1px solid var(--sh-accent); border-radius:4px; }

.sh-footer-portal { margin-top:40px; border-top:1px solid var(--sh-border); background:#f9fafb; padding:32px 16px 20px; }
.sh-footer-portal .inner { max-width:1200px; margin:0 auto; }
.sh-footer-portal h4 { margin:0 0 10px; font-size:var(--sh-fs-sm); font-weight:800; color:var(--sh-text); }
.sh-footer-portal a { display:block; font-size:var(--sh-fs-sm); color:var(--sh-gray); text-decoration:none; margin-bottom:6px; }
.sh-footer-portal a:hover { color:var(--sh-accent); }
.sh-footer-grid { display:grid; grid-template-columns:1.2fr 2fr; gap:24px; margin-bottom:20px; }
.sh-footer-cols { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.sh-footer-bottom { padding-top:16px; border-top:1px solid var(--sh-border); font-size:14px; color:var(--sh-gray); display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px; }

.sh-mini-header { background:#fff; border-bottom:1px solid var(--sh-border); font-size:var(--sh-fs-sm); padding:10px 16px; color:var(--sh-gray); }
.sh-mini-header .inner { max-width:1200px; margin:0 auto; display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; }
.sh-mini-header a { color:var(--sh-accent); text-decoration:none; font-weight:600; }
.sh-mini-header .logo { color:var(--sh-text); font-weight:800; }

.sh-page-head { max-width:1200px; margin:0 auto; padding:20px 16px 8px; }
.sh-page-head h1 { margin:0; font-size:var(--sh-fs-2xl); font-weight:800; color:var(--sh-text); }
.sh-page-head p { margin:6px 0 0; font-size:var(--sh-fs-sm); color:var(--sh-gray); }

/* 아이콘 금지 — 장식용 FA·SVG·이모지 영역 */
.sh-portal-scope i.fas,
.sh-portal-scope i.far,
.sh-portal-scope i.fab,
.sh-portal-scope .sh-logo-icon,
.sh-portal-scope .sh-action-btn svg,
.sh-portal-scope .empty-icon,
.sh-portal-scope .pcc-icon,
.sh-portal-scope .sh-pay-icon { display:none !important; }

/* ── 장바구니 페이지 (cart.php) ── */
.sh-cart-header {
  background: var(--sh-accent);
  color: #fff;
  padding: 24px 16px 20px;
}
.sh-cart-header-inner { max-width: 1200px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
.sh-cart-header h1 { margin: 0; font-size: var(--sh-fs-2xl); font-weight: 800; }
.sh-cart-header-meta { font-size: var(--sh-fs-sm); color: #dbeafe; margin-top: 4px; }
.sh-cart-wrap { max-width: 1200px; margin: 24px auto; padding: 0 16px; display: grid; grid-template-columns: 1fr 320px; gap: 24px; align-items: start; }
.sh-cart-list { display: flex; flex-direction: column; gap: 14px; }
.sh-cart-card {
  background: #fff;
  border: 1px solid var(--sh-border);
  border-radius: 8px;
  padding: 18px 20px;
  display: grid;
  grid-template-columns: 88px 1fr auto 40px;
  gap: 0 20px;
  align-items: center;
}
.sh-cart-card:hover { border-color: #9ca3af; }
.sh-cart-thumb-wrap { position: relative; grid-column: 1; grid-row: 1; }
.sh-cart-thumb { width: 88px; height: 88px; border-radius: 6px; object-fit: cover; border: 1px solid var(--sh-border); display: block; }
.sh-cart-rate-badge {
  position: absolute; bottom: -6px; left: 50%; transform: translateX(-50%);
  background: var(--sh-danger); color: #fff;
  font-size: 14px; font-weight: 800; padding: 2px 6px; border-radius: 10px; white-space: nowrap;
}
.sh-cart-info { min-width: 0; grid-column: 2; grid-row: 1; }
.sh-cart-cat { font-size: 14px; color: var(--sh-accent); font-weight: 600; margin-bottom: 4px; }
.sh-cart-name { font-size: var(--sh-fs-sm); font-weight: 700; color: var(--sh-text); text-decoration: none; line-height: 1.4; display: block; }
.sh-cart-name:hover { color: var(--sh-accent); }
.sh-cart-opt { font-size: var(--sh-fs-sm); color: var(--sh-gray); margin-top: 3px; }
.sh-cart-origin { font-size: 14px; color: var(--sh-gray); margin-top: 3px; }
.sh-cart-controls {
  grid-column: 3; grid-row: 1;
  display: flex; flex-direction: row; align-items: center; gap: 18px;
  white-space: nowrap; flex-wrap: nowrap; flex-shrink: 0;
}
.sh-cart-unit-block, .sh-cart-sub-block { text-align: center; min-width: 72px; }
.sh-cart-unit-label, .sh-cart-sub-label, .sh-qty-label-sm { font-size: 14px; color: var(--sh-gray); margin-bottom: 3px; }
.sh-cart-unit-price { font-size: var(--sh-fs-sm); font-weight: 700; color: var(--sh-text); white-space: nowrap; }
.sh-cart-unit-orig { font-size: 14px; color: #9ca3af; text-decoration: line-through; white-space: nowrap; }
.sh-ctrl-divider { width: 1px; height: 36px; background: var(--sh-border); flex-shrink: 0; }
.sh-qty-row { display: flex; flex-direction: column; align-items: center; gap: 3px; }
.sh-cart-sub-price { font-size: var(--sh-fs-base); font-weight: 800; color: var(--sh-price); white-space: nowrap; }
.sh-del-col { grid-column: 4; grid-row: 1; display: flex; align-items: center; justify-content: center; }
.sh-del-btn {
  background: none; border: 1px solid #fca5a5; color: var(--sh-danger);
  border-radius: 6px; padding: 5px 8px; font-size: var(--sh-fs-sm); font-weight: 700; cursor: pointer;
}
.sh-del-btn:hover { background: #fef2f2; border-color: var(--sh-danger); }
.sh-cart-page-summary {
  background: #fff; border: 1px solid var(--sh-border); border-radius: 8px;
  padding: 24px; position: sticky; top: 90px;
}
.sh-cart-page-summary h3 { font-size: var(--sh-fs-md); font-weight: 800; color: var(--sh-text); margin: 0 0 18px; }
.sh-summary-free { color: var(--sh-success); font-weight: 700; }
.sh-free-bar-wrap { margin: 14px 0; }
.sh-free-bar-text { font-size: var(--sh-fs-sm); color: var(--sh-gray); margin-bottom: 6px; display: flex; justify-content: space-between; }
.sh-free-bar-text .highlight { color: var(--sh-accent); font-weight: 700; }
.sh-free-bar { height: 6px; background: var(--sh-light); border-radius: 10px; overflow: hidden; }
.sh-free-bar-fill { height: 100%; background: var(--sh-accent); border-radius: 10px; transition: width .4s ease; }
.sh-order-btn {
  width: 100%; background: var(--sh-accent); color: #fff; border: none;
  padding: 14px; border-radius: 6px; font-size: var(--sh-fs-md); font-weight: 800; cursor: pointer; margin-top: 18px;
}
.sh-order-btn:hover { background: #1d4ed8; }
.sh-continue-btn {
  width: 100%; background: #fff; color: var(--sh-accent); border: 1.5px solid var(--sh-border);
  padding: 11px; border-radius: 6px; font-size: var(--sh-fs-sm); font-weight: 700;
  cursor: pointer; margin-top: 10px; text-decoration: none; display: block; text-align: center;
}
.sh-continue-btn:hover { border-color: var(--sh-accent); background: #eff6ff; }
.sh-cart-empty { text-align: center; padding: 80px 20px; max-width: 480px; margin: 0 auto; }
.sh-cart-empty h2 { font-size: var(--sh-fs-2xl); font-weight: 800; margin: 0 0 10px; }
.sh-cart-empty p { color: var(--sh-gray); margin-bottom: 24px; font-size: var(--sh-fs-sm); }
.sh-cart-empty .go-btn {
  background: var(--sh-accent); color: #fff; padding: 14px 36px; border-radius: 6px;
  text-decoration: none; font-weight: 700; font-size: var(--sh-fs-base); display: inline-block;
}
.sh-cart-empty .go-btn:hover { background: #1d4ed8; }

/* ── 주문 완료 히어로 ── */
.sh-complete-hero {
  text-align: center; background: var(--sh-accent); color: #fff;
  border-radius: 8px; padding: 40px 24px; margin-bottom: 24px;
}
.sh-complete-hero h1 { font-size: var(--sh-fs-2xl); font-weight: 900; margin: 0 0 10px; }
.sh-complete-hero p { opacity: .9; margin: 0; font-size: var(--sh-fs-base); }
.sh-order-no { display: inline-block; background: rgba(255,255,255,.2); padding: 8px 20px; border-radius: 6px; font-size: var(--sh-fs-sm); font-weight: 700; margin-top: 14px; }
.sh-detail-card { background: #fff; border: 1px solid var(--sh-border); border-radius: 8px; padding: 24px; margin-bottom: 20px; }
.sh-detail-card h2 { font-size: var(--sh-fs-base); font-weight: 800; margin: 0 0 16px; color: var(--sh-text); border-bottom: 1px solid var(--sh-border); padding-bottom: 10px; }
.sh-order-product { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--sh-border); }
.sh-order-product:last-child { border-bottom: none; }
.sh-total-row { display: flex; justify-content: space-between; padding: 10px 0; font-size: var(--sh-fs-sm); border-bottom: 1px solid var(--sh-border); }
.sh-total-final { display: flex; justify-content: space-between; padding-top: 14px; }
.sh-total-final .label { font-size: var(--sh-fs-base); font-weight: 800; }
.sh-total-final .amount { font-size: var(--sh-fs-2xl); font-weight: 900; color: var(--sh-price); }
.sh-action-btns { display: flex; gap: 12px; margin-top: 24px; flex-wrap: wrap; }
.sh-action-btns a { flex: 1; min-width: 140px; text-align: center; padding: 14px; border-radius: 6px; font-size: var(--sh-fs-base); font-weight: 700; text-decoration: none; }
.sh-btn-home { background: var(--sh-accent); color: #fff; }
.sh-btn-receipt { background: #374151; color: #fff; }
.sh-btn-list { background: #fff; color: var(--sh-accent); border: 1.5px solid var(--sh-accent); }
.sh-print-btn { background: #374151; color: #fff; border: none; padding: 8px 16px; border-radius: 6px; font-size: var(--sh-fs-sm); font-weight: 700; cursor: pointer; float: right; }

/* ── 포인트 충전 (point_charge.php) ── */
.pc-wrap { max-width: 600px; margin: 0 auto; padding: 0 16px 40px; }
.pc-wrap h1 { font-size: var(--sh-fs-2xl); font-weight: 900; margin: 0 0 6px; }
.pc-wrap .pc-sub { color: var(--sh-gray); font-size: var(--sh-fs-sm); margin-bottom: 24px; }
.pc-card { background: #fff; border: 1px solid var(--sh-border); border-radius: 8px; padding: 24px; margin-bottom: 20px; }
.pc-card h2 { font-size: var(--sh-fs-base); font-weight: 800; margin: 0 0 16px; color: var(--sh-text); border-bottom: 1px solid var(--sh-border); padding-bottom: 10px; }
.pc-balance-banner { background: var(--sh-accent); color: #fff; border-radius: 8px; padding: 20px 24px; display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.pc-balance-banner .label { font-size: var(--sh-fs-sm); opacity: .85; margin-bottom: 4px; }
.pc-balance-banner .amount { font-size: var(--sh-fs-3xl); font-weight: 900; }
.pc-presets { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 16px; }
.pc-preset-btn { border: 1.5px solid var(--sh-border); border-radius: 6px; padding: 14px 8px; text-align: center; cursor: pointer; font-size: var(--sh-fs-base); font-weight: 700; background: #fff; color: var(--sh-text); }
.pc-preset-btn:hover, .pc-preset-btn.active { border-color: var(--sh-accent); color: var(--sh-accent); background: #eff6ff; }
.pc-amount-wrap { position: relative; margin-bottom: 6px; }
.pc-amount-wrap input { width: 100%; border: 1.5px solid var(--sh-border); border-radius: 6px; padding: 14px 60px 14px 16px; font-size: var(--sh-fs-xl); font-weight: 700; outline: none; box-sizing: border-box; }
.pc-amount-wrap input:focus { border-color: var(--sh-accent); }
.pc-amount-wrap .unit { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); font-size: var(--sh-fs-base); font-weight: 700; color: var(--sh-gray); }
.pc-pay-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.pc-pay-item { border: 1.5px solid var(--sh-border); border-radius: 6px; padding: 14px 10px; cursor: pointer; text-align: center; background: #fff; }
.pc-pay-item.active { border-color: var(--sh-accent); background: #eff6ff; }
.pc-pay-item input { display: none; }
.pc-pay-icon { display: none; }
.pc-pay-label { font-size: var(--sh-fs-sm); font-weight: 700; color: var(--sh-text); }
.pc-submit-btn { width: 100%; padding: 14px; border: none; border-radius: 6px; background: var(--sh-accent); color: #fff; font-size: var(--sh-fs-md); font-weight: 800; cursor: pointer; margin-top: 8px; }
.pc-submit-btn:hover { background: #1d4ed8; }
.pc-submit-btn:disabled { opacity: .5; cursor: not-allowed; }
.pcc-hero.completed { background: var(--sh-success); color: #fff; border-radius: 8px; padding: 32px 24px; text-align: center; }
.pcc-hero.pending { background: #d97706; color: #fff; border-radius: 8px; padding: 32px 24px; text-align: center; }
.pcc-wrap { max-width: 620px; margin: 24px auto; padding: 0 16px 40px; }
.pcc-hero h1 { font-size: var(--sh-fs-2xl); font-weight: 900; margin: 0 0 8px; }
.pcc-hero p { opacity: .9; font-size: var(--sh-fs-sm); margin: 0; }
.pcc-no { display: inline-block; background: rgba(255,255,255,.2); padding: 6px 18px; border-radius: 6px; font-size: var(--sh-fs-sm); font-weight: 700; margin-top: 12px; }
.pcc-card { background: #fff; border: 1px solid var(--sh-border); border-radius: 8px; padding: 24px; margin-bottom: 18px; }
.pcc-card h2 { font-size: var(--sh-fs-base); font-weight: 800; margin: 0 0 16px; color: var(--sh-text); border-bottom: 1px solid var(--sh-border); padding-bottom: 10px; }
.pcc-table { width: 100%; border-collapse: collapse; font-size: var(--sh-fs-sm); }
.pcc-table th { background: var(--sh-light); padding: 10px 16px; font-weight: 700; color: var(--sh-text); border-bottom: 1px solid var(--sh-border); text-align: left; width: 120px; }
.pcc-table td { padding: 10px 16px; border-bottom: 1px solid var(--sh-light); color: var(--sh-text); }
.pcc-btns { display: flex; gap: 12px; margin-top: 24px; flex-wrap: wrap; }
.pcc-btns a { flex: 1; min-width: 140px; text-align: center; padding: 14px; border-radius: 6px; font-size: var(--sh-fs-base); font-weight: 700; text-decoration: none; }
.btn-home { background: var(--sh-accent); color: #fff; }
.btn-charge { background: #fff; color: var(--sh-accent); border: 1.5px solid var(--sh-accent); }
.pcc-icon { display: none; }
.pc-vbank-notice { background: #fffbeb; border: 1px solid #fcd34d; border-radius: 6px; padding: 14px 16px; margin-top: 14px; display: none; font-size: var(--sh-fs-sm); color: #92400e; }
.pc-vbank-notice.show { display: block; }
.pc-bank-form { display: none; margin-top: 14px; }
.pc-bank-form.show { display: block; }
.pc-bank-form input, .pc-bank-form select { width: 100%; border: 1px solid var(--sh-border); border-radius: 6px; padding: 10px 14px; font-size: var(--sh-fs-sm); margin-bottom: 10px; outline: none; box-sizing: border-box; }
.pc-history-table { width: 100%; border-collapse: collapse; font-size: var(--sh-fs-sm); }
.pc-history-table th { background: var(--sh-light); padding: 10px 14px; font-weight: 700; color: var(--sh-text); border-bottom: 2px solid var(--sh-border); text-align: left; }
.pc-history-table td { padding: 10px 14px; border-bottom: 1px solid var(--sh-light); vertical-align: middle; }
.pc-notice-list { padding-left: 18px; margin: 0; color: var(--sh-gray); font-size: var(--sh-fs-sm); line-height: 2; }
.pc-status-badge { display: inline-block; padding: 2px 8px; border-radius: 6px; font-size: 14px; font-weight: 700; }
.sb-pending { background: #fef3c7; color: #92400e; }
.sb-completed { background: #dcfce7; color: #15803d; }
.sb-failed { background: #fee2e2; color: #991b1b; }
.sb-refunded { background: var(--sh-light); color: var(--sh-gray); }
.sh-form-group label .req { color: var(--sh-danger); margin-left: 2px; }
.sh-invoice-box.visible { display: block; }

/* ── 상세 페이지 배지 (그라디언트 없음) ── */
.sh-member-discount-badge {
  display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap;
  margin-top: 8px; padding: 7px 14px;
  background: #eff6ff; border: 1px solid #bfdbfe; border-radius: 6px;
  font-size: var(--sh-fs-sm); color: #1d4ed8;
}
.sh-sale-countdown {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  margin-top: 8px; padding: 8px 14px;
  background: #fff7ed; border: 1px solid #fed7aa; border-radius: 6px; font-size: var(--sh-fs-sm);
}

/* ── 모바일 ── */
@media (max-width: 900px) {
  .sh-product-grid  { grid-template-columns:repeat(2,1fr); gap:14px; }
  .sh-detail-wrap   { grid-template-columns:1fr; }
  .sh-detail-img-wrap { position:static; }
  .sh-cart-wrap     { grid-template-columns:1fr; }
  .sh-order-wrap    { grid-template-columns:1fr; }
  .sh-related-grid  { grid-template-columns:repeat(2,1fr); }
  .sh-pay-methods   { flex-direction:column; }
  .sh-promo-grid    { grid-template-columns:1fr; }
  .sh-footer-grid   { grid-template-columns:1fr; }
  .sh-footer-cols   { grid-template-columns:1fr 1fr; }
  .sh-cart-page-summary { position: static; }
}
@media (max-width: 700px) {
  .sh-cart-card { grid-template-columns: 72px 1fr; grid-template-rows: auto auto; gap: 12px 14px; }
  .sh-cart-controls { grid-column: 1 / -1; grid-row: 2; justify-content: flex-start; gap: 12px; padding-top: 8px; border-top: 1px dashed var(--sh-border); }
  .sh-del-col { grid-column: 1 / -1; grid-row: 3; justify-content: flex-end; }
}
@media (max-width: 480px) {
  .sh-product-grid { grid-template-columns:repeat(2,1fr); gap:10px; }
  .sh-product-info { padding:10px; }
  .sh-product-foot { padding:0 10px 10px; }
  .sh-filter-bar   { flex-direction:column; align-items:stretch; }
  .sh-form-row     { grid-template-columns:1fr; }
}
