/* 주문서 전용 레이아웃: 레퍼런스의 평평한 섹션 구조를 따르되 기존 동작 ID는 유지한다. */
#checkoutModal {
  --checkout-ink:#151515;
  --checkout-muted:#777;
  --checkout-line:#dedede;
  --checkout-section:#f6f6f6;
  background:#fff;
  color:var(--checkout-ink);
  font-family:Wanted Sans,Pretendard,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
#checkoutModal .co-topbar {
  height:54px;
  padding:env(safe-area-inset-top) 12px 0;
  border-bottom:1px solid #ececec;
  background:#fff;
}

#checkoutModal .co-back { width:38px; height:38px; border:0; border-radius:0; background:transparent; }
#checkoutModal .co-title { font-size:16px; font-weight:800; letter-spacing:-.025em; }
#checkoutModal .co-topbar-spacer { width:38px; height:38px; }
#checkoutModal .co-scroll { padding:0 0 18px; background:#fff; }

#checkoutModal .co-product,
#checkoutModal .co-sec {
  margin:0;
  padding:22px 18px;
  border:0;
  border-bottom:8px solid var(--checkout-section);
  border-radius:0;
  background:#fff;
  box-shadow:none;
  box-sizing:border-box;
}

#checkoutModal .co-product { display:block; }
#checkoutModal .co-product-heading,
#checkoutModal .co-product-main,
#checkoutModal .co-section-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
#checkoutModal .co-product-heading { margin:0 0 16px; }
#checkoutModal .co-product-heading h3,
#checkoutModal .co-sec-title {
  margin:0;
  color:var(--checkout-ink);
  font-size:14px;
  font-weight:800;
  line-height:1.35;
  letter-spacing:-.02em;
}

#checkoutModal .co-product-heading span,
#checkoutModal .co-required-note { color:var(--checkout-muted); font-size:11px; font-weight:600; }
#checkoutModal .co-product-main { justify-content:flex-start; }
#checkoutModal .co-product img {
  width:72px;
  height:72px;
  border:1px solid #e8e8e8;
  border-radius:0;
  background:#f7f7f7;
  object-fit:cover;
}

#checkoutModal .co-product-info { flex:1; min-width:0; }
#checkoutModal .co-brand { margin:0 0 3px; color:#666; font-size:11px; font-weight:600; }
#checkoutModal .co-model { margin:0 0 7px; font-size:13px; font-weight:750; line-height:1.45; }
#checkoutModal .co-listprice { margin:0; color:var(--checkout-ink); font-size:14px; font-weight:850; }

#checkoutModal .co-detail-list { margin-top:16px; border-top:1px solid #e5e5e5; }
#checkoutModal .co-detail-row {
  display:grid;
  grid-template-columns:104px minmax(0,1fr);
  gap:14px;
  padding:11px 0;
  border-bottom:1px solid #ededed;
  font-size:12px;
  line-height:1.55;
}
#checkoutModal .co-detail-row span { color:#777; }
#checkoutModal .co-detail-row strong { color:#222; font-weight:650; text-align:right; overflow-wrap:anywhere; }
#checkoutModal .co-detail-description { margin-top:18px; }
#checkoutModal .co-detail-description h4 { margin:0 0 9px; font-size:12px; font-weight:800; }
#checkoutModal .co-detail-description p {
  margin:0;
  padding:14px;
  background:#f7f7f7;
  color:#555;
  font-size:12px;
  line-height:1.7;
  white-space:pre-line;
}

#checkoutModal .co-sec-desc { margin:7px 0 0; color:#777; font-size:11px; line-height:1.55; }

#checkoutModal .co-receive-option {
  position:relative;
  display:grid;
  grid-template-columns:38px minmax(0,1fr);
  gap:12px;
  margin-top:10px;
  padding:16px 15px;
  border:1px solid #dedede;
  border-radius:10px;
  background:#fff;
  cursor:pointer;
}
#checkoutModal .co-receive-option.is-selected { border-color:#222; box-shadow:inset 0 0 0 1px #222; background:#fcfcfc; }
#checkoutModal .co-receive-radio { position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
#checkoutModal .co-receive-option:focus-within { outline:2px solid #888; outline-offset:2px; }
#checkoutModal .co-receive-mark {
  display:flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  border-radius:9px;
  background:#f3f3f3;
  color:#222;
}
#checkoutModal .co-receive-mark svg { width:22px; height:22px; }
#checkoutModal .co-receive-option.is-selected .co-receive-mark { background:#222; color:#fff; }
#checkoutModal .co-receive-content { min-width:0; }
#checkoutModal .co-receive-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
#checkoutModal .co-receive-option strong { display:block; min-width:0; color:#222; font-size:13px; font-weight:800; line-height:1.4; word-break:keep-all; overflow-wrap:break-word; }
#checkoutModal .co-receive-badge { flex:0 0 auto; padding:4px 7px; border-radius:999px; background:#222; color:#fff; font-size:9px; font-weight:750; line-height:1; }
#checkoutModal .co-receive-badge.is-muted { background:#f0f0f0; color:#555; }
#checkoutModal .co-receive-option p { margin:7px 0 0; color:#707070; font-size:11px; line-height:1.65; word-break:keep-all; overflow-wrap:break-word; }
#checkoutModal .co-receive-meta { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:10px; padding-top:9px; border-top:1px solid #ededed; color:#777; font-size:10px; }
#checkoutModal .co-receive-meta + .co-receive-meta { margin-top:0; padding-top:6px; border-top:0; }
#checkoutModal .co-receive-meta b { color:#333; font-weight:750; }
#checkoutModal .co-receive-contact { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:12px; padding:10px 11px; border-radius:6px; background:#f5f5f5; font-size:10px; }
#checkoutModal .co-receive-contact b { color:#333; font-weight:750; }
#checkoutModal .co-receive-contact span { color:#777; }

#checkoutModal .co-section-heading { margin-bottom:16px; }
#checkoutModal .co-text-button {
  min-height:30px;
  padding:0 12px;
  border:1px solid #d7d7d7;
  border-radius:999px;
  background:#fff;
  color:#444;
  font-size:11px;
}

#checkoutModal .co-same-buyer {
  display:flex;
  align-items:center;
  width:max-content;
  margin:0 0 15px;
  padding:0;
  border-radius:0;
  background:transparent;
  color:#555;
  font-size:12px;
}

#checkoutModal .co-same-buyer input,
#checkoutModal .co-agree input { accent-color:#171717; }
#checkoutModal .co-field { margin-bottom:13px; }
#checkoutModal .co-field label { margin-bottom:6px; color:#333; font-size:11px; font-weight:700; }
#checkoutModal .co-field input,
#checkoutModal .co-coupon-select {
  height:44px;
  padding:0 13px;
  border:1px solid var(--checkout-line);
  border-radius:0;
  background:#fff;
  color:var(--checkout-ink);
  font-size:13px;
  box-sizing:border-box;
}

#checkoutModal .co-field input:focus,
#checkoutModal .co-coupon-select:focus { outline:0; border-color:#222; box-shadow:none; }
#checkoutModal .co-addr-row { display:grid; grid-template-columns:1fr 100px; gap:7px; margin-bottom:7px; }
#checkoutModal .co-addr-btn {
  min-height:44px;
  padding:0 13px;
  border:1px solid #222;
  border-radius:0;
  background:#fff;
  color:#222;
  font-size:12px;
  font-weight:750;
}

#checkoutModal .co-ship-note,
#checkoutModal .co-agree-summary {
  margin:10px 0 0;
  padding:12px 13px;
  border-radius:0;
  background:#f6f6f6;
  color:#777;
  font-size:11px;
  line-height:1.55;
}

#checkoutModal #coCouponSec .co-sec-title { margin-bottom:14px; }
#checkoutModal .co-coupon-choice { margin:0; }
#checkoutModal .co-coupon-clear { min-height:44px; border-color:#cfcfcf; border-radius:0; color:#333; }
#checkoutModal .co-coupon-msg,
#checkoutModal .co-coupon-msg.ok,
#checkoutModal .co-coupon-msg.err { color:#555; }

#checkoutModal .co-amount-rows { margin-top:16px; }
#checkoutModal .co-price-row,
#checkoutModal .co-discount-row {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin:0;
  padding:5px 0;
  color:#666;
  font-size:12px;
}
#checkoutModal .co-discount-row[hidden] { display:none; }
#checkoutModal .co-price-row strong,
#checkoutModal .co-discount-row strong { color:#333; font-weight:650; }
#checkoutModal .co-reward-row { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:8px; padding:10px 11px; border-radius:6px; background:#f6f6f6; color:#555; font-size:11px; }
#checkoutModal .co-reward-row strong { color:#222; font-size:13px; font-weight:800; }
#checkoutModal .co-reward-note { margin:6px 0 0; color:#888; font-size:10px; line-height:1.5; }
#checkoutModal .co-price-total {
  margin-top:10px;
  padding-top:14px;
  border-top:1px solid #e4e4e4;
  color:#222;
  font-size:13px;
  font-weight:750;
}
#checkoutModal .co-price-total strong { color:#111; font-size:18px; font-weight:900; }

#checkoutModal .co-methods { grid-template-columns:1fr; gap:7px; margin-top:16px; }
#checkoutModal .co-method {
  display:grid;
  grid-template-columns:78px minmax(0,1fr) 18px;
  align-items:center;
  gap:11px;
  min-height:62px;
  padding:9px 13px;
  border:1px solid #dedede;
  border-radius:0;
  background:#fff;
  text-align:left;
  box-sizing:border-box;
}

#checkoutModal .co-method-icon {
  display:flex;
  align-items:center;
  justify-content:center;
  width:76px;
  height:36px;
  border-radius:8px;
  background:#fff;
  overflow:hidden;
}
#checkoutModal .co-method-icon img { display:block; width:auto; height:auto; max-width:72px; max-height:30px; object-fit:contain; }
#checkoutModal .co-method-icon.is-card img,
#checkoutModal .co-method-icon.is-virtual img { width:28px; height:28px; }
#checkoutModal .co-method-icon.is-naver img { width:66px; height:auto; }
#checkoutModal .co-method-icon.is-kakao img { width:64px; height:auto; }
#checkoutModal .co-method-icon.is-toss img { width:74px; height:auto; }
#checkoutModal .co-method-copy { display:flex; flex-direction:column; gap:3px; min-width:0; }
#checkoutModal .co-method-copy strong { color:#222; font-size:12px; font-weight:800; }
#checkoutModal .co-method-copy small { color:#888; font-size:10px; font-weight:550; }
#checkoutModal .co-method-radio {
  width:15px;
  height:15px;
  border:1px solid #aaa;
  border-radius:50%;
  box-sizing:border-box;
}

#checkoutModal .co-method.active { border-color:#222; background:#fff; box-shadow:inset 0 0 0 1px #222; color:#111; }
#checkoutModal .co-method.active .co-method-radio { border:4px solid #222; }
@media (max-width:380px) {
  #checkoutModal .co-method { grid-template-columns:68px minmax(0,1fr) 18px; gap:8px; padding-inline:10px; }
  #checkoutModal .co-method-icon { width:66px; }
  #checkoutModal .co-method-icon.is-naver img,
  #checkoutModal .co-method-icon.is-kakao img { max-width:58px; }
  #checkoutModal .co-method-icon.is-toss img { max-width:64px; }
}
#checkoutModal .co-responsibility { margin-top:14px; padding:13px; border:0; border-radius:0; background:#f6f6f6; }
#checkoutModal .co-responsibility strong { color:#222; }
#checkoutModal .co-agree { margin-top:12px; padding:0; color:#555; font-size:12px; }

#checkoutModal .co-bottom {
  padding:11px 14px calc(11px + env(safe-area-inset-bottom));
  border-top:1px solid #e5e5e5;
  background:#fff;
  box-shadow:none;
}

#checkoutModal .co-total { margin-bottom:9px; }
#checkoutModal .co-total span { color:#555; font-size:12px; font-weight:650; }
#checkoutModal .co-total strong { color:#111; font-size:20px; font-weight:900; }
#checkoutModal .co-pay-btn { height:50px; border-radius:0; background:#171717; font-size:14px; font-weight:800; }

@media (min-width:700px) {
  #checkoutModal { max-width:500px; border-left:1px solid #e8e8e8; border-right:1px solid #e8e8e8; }
  #checkoutModal .co-scroll { padding:0 0 24px; }
  #checkoutModal .co-product,
  #checkoutModal .co-sec { padding:24px 20px; }
}

@media (max-width:420px) {
  #checkoutModal .co-product,
  #checkoutModal .co-sec { padding:20px 16px; }
  #checkoutModal .co-product img { width:68px; height:68px; }
  #checkoutModal .co-addr-row { grid-template-columns:1fr 94px; }
}