/* =========================================================================
 * 운영 페이지 「쿠폰」 탭(/ops/coupons/) — 2026-10-07. 이 탭에서만 싣는다(functions.php).
 * 틀(알림·목록 카드·배지·입력칸·버튼)은 ops.css 와 사이트 공용 .tabs/.btn 을 그대로 쓰고,
 * 여기에는 쿠폰 탭만의 것만 둔다.
 *   .ops-coupons-search  검색 줄(입력칸이 남는 폭을 다 쓴다)
 *   .ops-coupons-count   건수·상한 안내
 *   .ops-coupon-*        한 줄 안의 코드·회원·상태
 * 390px(아이폰 기본 폭)에서 쿠폰 코드(DALSHIM-CHECKIN-XXXX)가 가로로 넘치지 않아야 한다 —
 * 코드는 줄바꿈을 허락하고, 버튼 묶음은 ops.css 의 600px 이하 규칙으로 아래로 내려간다.
 * ========================================================================= */

.ops-coupons-search{display:flex; gap:6px; flex:1 1 260px; min-width:0}
.ops-coupons-search .ops-field{flex:1 1 auto; width:100%}

.ops-coupons-count{margin:0 0 10px}

.ops-coupon-code{font-family:var(--mono); letter-spacing:.5px}
.ops-coupon-member{margin:0 0 4px; font-size:14px; font-weight:700; color:var(--ink); overflow-wrap:anywhere}
.ops-coupon-status{margin:8px 0 0}
/* 상태 문구가 길다(「이미 사용됨(일시 · 매장) · 취소이력(일시)」) — 배지가 한 줄을 고집하면 넘친다. */
.ops-coupon-status .ops-badge{white-space:normal; overflow-wrap:anywhere; line-height:1.5}

/* 만료 쿠폰은 할 일이 없는 줄이라 한 단계 가라앉힌다. */
.ops-coupon.is-expired{border-color:var(--card-line)}

/* 「매장 쿠폰 / 온라인 쿠폰」 나눔(2026-10-07) — 사이트 공용 .tabs 그대로, 아래 한 줄 설명. */
.ops-coupons-kinds{margin:0 0 6px}
.ops-coupons-kind-help{margin:0 0 14px}

/* 온라인 쿠폰(ops-coupons-online.js) */
.ops-oc.is-paused, .ops-oc.is-expired{border-color:var(--card-line)}
.ops-oc-form{margin-top:12px}
.ops-oc-form .ops-item-main{display:flex; flex-direction:column; gap:12px}
.ops-oc-field{display:flex; flex-direction:column; gap:5px; min-width:0}
.ops-oc-label{font-size:13.5px; font-weight:800; color:var(--ink)}
.ops-oc-field .ops-field{width:100%}
.ops-oc-row{display:grid; grid-template-columns:1fr 1fr; gap:12px}
.ops-oc-acts{display:flex; justify-content:flex-end; gap:8px}

/* 매장 쿠폰 발급 칸(2026-10-07) */
.ops-coupon-issue{margin:0 0 14px}
.ops-coupon-issue-form{border-color:var(--action)}
.ops-coupon-issue-form .ops-item-main{display:flex; flex-direction:column; gap:12px}
.ops-coupon-issue-who{display:flex; gap:18px; font-size:15px; font-weight:700}
.ops-coupon-issue-radio{display:inline-flex; align-items:center; gap:4px; cursor:pointer}
.ops-coupon-issue-results{display:flex; flex-wrap:wrap; gap:6px}
.ops-coupon-issue-picked, .ops-coupon-issue-all{margin:0; font-weight:800; color:var(--action)}
.ops-coupon-issue-exp{display:flex; flex-direction:column; gap:5px; max-width:260px}

@media (max-width:600px){
  .ops-coupon-issue-exp{max-width:none}
  .ops-oc-row{grid-template-columns:1fr}
  .ops-oc-field .ops-field{min-height:44px; font-size:16px}
  .ops-coupons-toolbar{flex-direction:column; align-items:stretch}
  .ops-coupons-search{flex:0 0 auto}
  .ops-coupons-search .btn{flex:0 0 auto; min-height:44px}
  .ops-coupons-search .ops-field{min-height:44px; font-size:16px} /* 16px 미만이면 iOS 가 확대한다 */
  .ops-coupon .ops-actions .btn{flex:1 1 auto; min-height:44px}
}