/* 채팅방(FIX44). 휴대폰 360 먼저: 위에 거래 머리, 아래 [대화·시안 | 결과물·결제] 탭. 900px 이상은 두 칸 나란히. */
.d-main { max-width: 1120px; }
.d-head { padding: var(--space-4); background: var(--color-surface); border: var(--border-width) solid var(--color-border); border-radius: var(--radius-lg); }
.d-head__top { display: flex; justify-content: space-between; gap: var(--space-3); align-items: flex-start; }
.d-title { margin: 2px 0 0; font-size: var(--font-size-h3); line-height: 1.35; overflow-wrap: anywhere; }
.d-head__side { text-align: right; flex-shrink: 0; }
.d-amount { margin: 0 0 4px; font-size: 1.125rem; font-weight: var(--font-weight-heavy); }
.d-st--paid, .d-st--done { background: var(--color-success-soft, #e9f3f4); color: var(--color-success, #127b87); }
.d-st--payment_wait, .d-st--delivered { background: var(--color-warning-soft); color: var(--color-warning); }
.d-st--cancelled, .d-st--dispute { background: var(--color-surface-alt); color: var(--color-text-muted); }
.d-steps { display: flex; gap: 4px; margin: var(--space-3) 0 0; padding: 0; list-style: none; counter-reset: s; }
.d-steps li { flex: 1; min-width: 0; padding-top: 8px; border-top: 4px solid var(--color-border); font-size: 12px; color: var(--color-text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.d-steps li.is-done { border-color: var(--color-primary); color: var(--color-text); }
.d-steps li.is-now { border-color: var(--color-primary); color: var(--color-primary); font-weight: var(--font-weight-bold); }
.d-head__acts { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-3); }
.d-why { margin: var(--space-3) 0 0; padding: var(--space-2) var(--space-3); border-radius: var(--radius-md); background: var(--color-primary-soft); font-size: var(--font-size-caption); line-height: 1.6; }
.d-flash { margin-bottom: var(--space-3); }

.d-tabs { display: flex; gap: var(--space-2); margin: var(--space-4) 0 var(--space-3); }
.d-tabs button {
  position: relative; flex: 1; min-height: 44px; border: var(--border-width) solid var(--color-border); border-radius: var(--radius-md);
  background: var(--color-surface); font: inherit; font-weight: var(--font-weight-bold); color: var(--color-text-muted); cursor: pointer;
}
.d-tabs button[aria-selected="true"] { border-color: var(--color-primary); color: var(--color-primary); background: var(--color-primary-soft); }
.d-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--color-error); vertical-align: middle; }

.d-grid[data-show="chat"] .d-side { display: none; }
.d-grid[data-show="deliver"] .d-chat { display: none; }
@media (min-width: 900px) {
  .d-tabs { display: none; }
  .d-grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: var(--space-4); margin-top: var(--space-4); align-items: start; }
  .d-grid[data-show] .d-side, .d-grid[data-show] .d-chat { display: block; }
  .d-side { position: sticky; top: var(--space-4); }
}

.d-chat { display: flex; flex-direction: column; background: var(--color-surface); border: var(--border-width) solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden; }
.d-chat:focus, .d-side:focus { outline: none; }
.d-log { display: flex; flex-direction: column; gap: var(--space-2); min-height: 280px; max-height: min(64vh, 640px); overflow-y: auto; padding: var(--space-3); background: var(--color-surface-alt); }
.d-sys { align-self: center; max-width: 92%; margin: var(--space-1) 0; padding: 4px 10px; border-radius: 999px; background: var(--color-surface); font-size: 12px; color: var(--color-text-muted); text-align: center; }
.d-msg { align-self: flex-start; max-width: 84%; padding: var(--space-2) var(--space-3); border-radius: 14px 14px 14px 4px; background: var(--color-surface); border: var(--border-width) solid var(--color-border); }
.d-msg--me { align-self: flex-end; border-radius: 14px 14px 4px 14px; background: var(--color-primary-soft); border-color: transparent; }
.d-msg__body { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.d-msg__meta { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; justify-content: flex-end; margin-top: 2px; }
.d-time, .d-read { font-size: 11px; color: var(--color-text-muted); }
.d-read { color: var(--color-primary); font-weight: var(--font-weight-bold); }
.d-masked { font-size: 11px; color: var(--color-warning); }
.d-link { min-height: 28px; padding: 0 4px; border: 0; background: none; color: var(--color-text-muted); font-size: 11px; text-decoration: underline; cursor: pointer; }

.d-draft { align-self: stretch; padding: var(--space-3); border-radius: var(--radius-lg); background: var(--color-surface); border: 2px solid var(--color-primary-soft); }
.d-draft__head, .d-file__head { display: flex; justify-content: space-between; align-items: baseline; gap: var(--space-2); }
.d-draft__media, .d-file__media { margin-top: var(--space-2); }
.d-media { display: block; max-width: 100%; max-height: 420px; margin: 0 auto; border-radius: var(--radius-md); background: #111; -webkit-user-select: none; user-select: none; }
.d-draft__memo { margin: var(--space-2) 0 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.d-feeds { margin: var(--space-2) 0 0; padding: var(--space-2) var(--space-3); list-style: none; border-left: 3px solid var(--color-warning); background: var(--color-warning-soft); border-radius: 0 var(--radius-md) var(--radius-md) 0; }
.d-feeds li { display: flex; justify-content: space-between; gap: var(--space-2); padding: 4px 0; }
.d-feeds__body { white-space: pre-wrap; overflow-wrap: anywhere; }
.d-draft__foot { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; justify-content: space-between; margin-top: var(--space-2); }

.d-compose { padding: var(--space-3); border-top: var(--border-width) solid var(--color-border); background: var(--color-surface); }
.d-compose textarea { width: 100%; min-height: 56px; padding: var(--space-2) var(--space-3); font: inherit; border: var(--border-width) solid var(--color-border); border-radius: var(--radius-md); resize: vertical; }
.d-compose__row { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; margin-top: var(--space-2); }
.d-send { margin-left: auto; }
.d-file { position: relative; overflow: hidden; display: inline-flex; align-items: center; cursor: pointer; }
.d-file input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.d-progress { font-size: var(--font-size-caption); color: var(--color-text-muted); }
.d-warn { margin: 0 0 var(--space-2); padding: var(--space-2) var(--space-3); border-radius: var(--radius-md); background: var(--color-warning-soft); color: var(--color-warning); font-size: var(--font-size-caption); }
.d-feedfor { display: flex; justify-content: space-between; align-items: center; gap: var(--space-2); margin-bottom: var(--space-2); padding: 6px var(--space-3); border-radius: var(--radius-md); background: var(--color-primary-soft); font-size: var(--font-size-caption); font-weight: var(--font-weight-bold); }
.d-x { min-width: 36px; min-height: 36px; border: 0; background: none; font-size: 1.25rem; cursor: pointer; }
.d-tidy { margin-bottom: var(--space-2); padding: var(--space-2) var(--space-3); border: var(--border-width) dashed var(--color-primary); border-radius: var(--radius-md); }
.d-tidy ol { margin: var(--space-1) 0 var(--space-2); padding-left: 1.25em; }

.d-side { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-3); min-width: 0; }
.d-chat, .d-card { min-width: 0; }
.d-card { padding: var(--space-4); background: var(--color-surface); border: var(--border-width) solid var(--color-border); border-radius: var(--radius-lg); }
.d-card h3 { margin: 0 0 var(--space-2); font-size: 1.0625rem; }
.d-card--quiet { background: var(--color-surface-alt); }
.d-card .m-form input[type=file] { width: 100%; min-height: 48px; }
.d-card textarea { width: 100%; font: inherit; padding: var(--space-2); border: var(--border-width) solid var(--color-border); border-radius: var(--radius-md); }
.d-file { margin: 0 0 var(--space-3); }
article.d-file { display: block; padding-bottom: var(--space-3); border-bottom: var(--border-width) solid var(--color-border); }
article.d-file:last-child { border-bottom: 0; }
.d-lock { margin: 0 0 var(--space-3); padding: var(--space-2) var(--space-3); border-radius: var(--radius-md); background: var(--color-surface-alt); font-weight: var(--font-weight-bold); }
.d-sum { display: grid; grid-template-columns: auto 1fr; gap: 4px var(--space-3); margin: 0 0 var(--space-3); }
.d-sum dt { color: var(--color-text-muted); }
.d-sum dd { margin: 0; text-align: right; font-weight: var(--font-weight-bold); }
.d-acct { margin: var(--space-2) 0; padding: var(--space-2) var(--space-3); border-radius: var(--radius-md); background: var(--color-surface); font-weight: var(--font-weight-bold); overflow-wrap: anywhere; }
.d-coupon { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; margin-bottom: var(--space-3); }
.d-coupon select { min-height: 44px; flex: 1; min-width: 0; font: inherit; }
.d-stars { display: flex; gap: 4px; margin: var(--space-2) 0; }
.d-star { min-width: 44px; min-height: 44px; border: 0; background: none; font-size: 1.9rem; color: #D3DCDC; cursor: pointer; }
.d-star.is-on { color: #B87800; } /* 11/09 대표: 별이 안 보이던 것(옅은 청록) → 따뜻한 노랑 */
.d-review input { width: 100%; min-height: 44px; padding: 0 var(--space-3); font: inherit; border: var(--border-width) solid var(--color-border); border-radius: var(--radius-md); margin-bottom: var(--space-2); }
.d-reasons { border: 0; margin: var(--space-3) 0 0; padding: 0; }
.d-reasons legend { font-weight: var(--font-weight-bold); margin-bottom: var(--space-1); }
.d-reasons .m-check { padding: 4px 0; border: 0; }
.m-btn--block { width: 100%; }

/* 관리자 FIX44 */
.adm-warn p { margin: 2px 0; }
.adm-act { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; margin-top: var(--space-2); }
.adm-act select, .adm-act input { min-height: 40px; font: inherit; max-width: 100%; }
.adm-coupon, .adm-settings { max-width: 640px; margin-bottom: var(--space-5); padding: var(--space-4); border: var(--border-width) solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface); }
.adm-settings h3, .adm-coupon h3 { margin: var(--space-4) 0 var(--space-2); }
.adm-settings select, .adm-settings input[type=text], .adm-settings input[type=number], .adm-settings textarea, .adm-coupon select, .adm-coupon input { width: 100%; min-height: 44px; font: inherit; }
.adm-settings input[type=checkbox] { width: auto; min-height: 0; }
.adm-inline { display: inline-flex; gap: 6px; align-items: center; font-weight: 500; }
#tabs { overflow-x: auto; }
/* 좁은 화면: 카드 안 양식이 칸 너비를 넘지 않게(grid 기본 최소 너비 = 내용 너비) */
.d-card .m-form { grid-template-columns: minmax(0, 1fr); min-width: 0; }
.d-card .m-form > * { min-width: 0; overflow-wrap: anywhere; }
.d-card input, .d-card textarea, .d-card select { box-sizing: border-box; max-width: 100%; }

/* 의뢰서 다듬기(FIX44 4-4) */
.rt-box { margin: 0 0 var(--space-5); padding: var(--space-4); border: 2px solid var(--color-primary-soft); border-radius: var(--radius-lg); background: var(--color-surface); }
.rt-title { margin: 0 0 var(--space-2); font-size: 1.125rem; }
.rt-box textarea { width: 100%; box-sizing: border-box; min-height: 96px; padding: var(--space-2) var(--space-3); font: inherit; border: var(--border-width) solid var(--color-border); border-radius: var(--radius-md); }
.rt-ask { margin-top: var(--space-3); padding: var(--space-3); border-radius: var(--radius-md); background: var(--color-primary-soft); }
.rt-q { margin: 0 0 var(--space-2); font-weight: var(--font-weight-bold); }
.rt-opts { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.rt-or { margin: var(--space-3) 0 0; font-size: var(--font-size-caption); color: var(--color-text-muted); }
.rt-check { margin-left: 6px; padding: 1px 8px; border-radius: 999px; background: var(--color-warning-soft); color: var(--color-warning); font-size: 12px; font-weight: var(--font-weight-bold); }
.pt-pre { margin: var(--space-2) 0; white-space: pre-wrap; font: inherit; overflow-wrap: anywhere; }

/* FIX46 상대 말풍선 왼쪽 동그라미 사진(연속된 같은 사람 메시지는 첫 줄만, 카톡식). 누르면 그 사람 프로필 */
.d-row { display: flex; gap: var(--space-2); align-items: flex-start; align-self: flex-start; max-width: 92%; min-width: 0; }
.d-row .d-msg { max-width: 100%; min-width: 0; }
.d-row--cont { margin-top: calc(-1 * var(--space-1)); }
.d-row--draft { align-self: stretch; max-width: 100%; }
.d-row--draft > .d-draft { flex: 1; min-width: 0; }
.d-ava-btn { flex: 0 0 32px; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 50%; background: none; cursor: pointer; }
.d-ava-btn:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.d-ava-gap { flex: 0 0 32px; }
.d-who { display: block; margin: 0 0 2px; font-size: 12px; color: var(--color-text-muted); }

/* FIX46-7 거래 끝난 채팅방: 완료 뒤 3일 안내, 지나면 읽기 전용 + 광고주 [이 제작자에게 다시 의뢰하기] */
.d-chatnote { margin: 0; padding: var(--space-2) var(--space-3); background: var(--color-success-soft, #e9f3f4); color: var(--color-success, #127b87); font-size: var(--font-size-caption); font-weight: var(--font-weight-bold); text-align: center; }
.d-closed { display: grid; gap: var(--space-2); justify-items: center; padding: var(--space-4) var(--space-3); border-top: var(--border-width) solid var(--color-border); background: var(--color-surface); text-align: center; }
.d-closed[hidden] { display: none; }
.d-closed__text { margin: 0; font-weight: var(--font-weight-bold); color: var(--color-text-muted); }

/* 11/07 채팅방 사진: 말풍선 안 작은 사진(가로 240px까지, 누르면 크게) */
.d-msg--photo { padding: 6px; }
.d-photo { display: block; padding: 0; border: 0; border-radius: 10px; overflow: hidden; background: var(--color-sage, #d4e6e8); cursor: zoom-in; max-width: 240px; min-width: 120px; min-height: 80px; }
.d-photo img { display: block; width: 100%; max-height: 320px; object-fit: cover; }
.d-photo .m-help { display: block; padding: 24px 12px; }
.d-msg--photo .d-msg__body { padding: 6px 6px 0; }
.d-msg--photo .d-msg__meta { padding: 0 4px; }
#d-photo-label[hidden] { display: none; }
