/* 중개 앱 전용 모양 (기본 모양은 style.css = 현장관리 앱과 같은 파일) */
/* 색: 로고(지온 공인중개사사무소)에서 따옴 — 먹색 선, 해 주황, 미색 바탕 */
:root { --c: #2f2b27; --bg: #f6f4ee; --accent: #e46a10; --accent-d: #c2560a; --line: #e2ddd2; }
body { background: var(--bg); color: #26231f; }
.bar { background: var(--c); }
button.primary { background: var(--accent); border-color: var(--accent); color: #fff; font-weight: 600; }
button.primary:active { background: var(--accent-d); }
.bar button.primary { background: var(--accent); border-color: var(--accent); }
input:focus, select:focus, textarea:focus { outline: 2px solid #f3b27a; outline-offset: 0; border-color: var(--accent); }
.fab { background: var(--accent); }
.seg button.on { background: var(--c); border-color: var(--c); }
.cat { border-left-color: var(--accent); background: #faf8f3; }
.cat-group h2, .login-box h1 { color: var(--c); }
.card, .box, .cat-group { box-shadow: 0 1px 3px #3a2a1012; }
.msel-btn.on { border-color: var(--accent); color: var(--accent-d); }
button.link { color: var(--accent-d); }
.chk input { accent-color: var(--accent); }
.brand-logo { display: block; width: min(300px, 80%); margin: 0 auto 4px; }
.bar #home-office { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 16px; }
.bar-logo { width: 30px; height: 30px; border-radius: 50%; background: var(--bg); padding: 1px; flex: none; }
.home-brand { max-width: 640px; margin: 0 auto; padding: 18px 12px 0; text-align: center; }
.home-brand img { width: min(340px, 86%); }
.login-box { margin-top: 10vh; }
.role-tag { font-size: 14px; color: #5f5a52; }
.small-t { font-size: 13px; margin: 0; }
.price { font-weight: 700; color: var(--accent-d); }
.chip { display: inline-block; padding: 2px 8px; border-radius: 10px; font-size: 12px; background: #efebe3; color: var(--c); margin: 2px 2px 0 0; }
.chip.ok { background: #e3f4e8; color: var(--green); }
.chip.warn { background: #fff3bf; color: #8a6d00; }
.chip.bad { background: #fde7e5; color: var(--red); }
.kv { display: grid; grid-template-columns: 92px 1fr; gap: 6px 10px; margin: 8px 0; font-size: 15px; }
.kv dt { color: #6b7380; }
.kv dd { margin: 0; overflow-wrap: anywhere; }
.mini { font-size: 12px; color: #6b7380; }
.lock { color: #6b7380; font-size: 14px; }

/* 매물 상태 색 (목록 배지와 상세 버튼 같은 색) */
[data-s="received"] { --k: #6b7380; --kl: #eceff3; }
[data-s="ad"] { --k: var(--accent-d); --kl: #fde9d8; }
[data-s="nego"] { --k: #a07800; --kl: #fff3bf; }
[data-s="done"] { --k: var(--green); --kl: #e3f4e8; }
[data-s="hold"] { --k: #7a5c3e; --kl: #efe6da; }
[data-s="withdrawn"] { --k: #5f6368; --kl: #eceef1; }
.badge[data-s] { background: var(--kl); color: var(--k); }
.seg button[data-s] { background: var(--kl); color: var(--k); border-color: var(--kl); font-weight: 600; padding: 10px 2px; white-space: nowrap; font-size: 14px; }
.seg button[data-s].on { background: var(--k); color: #fff; border-color: var(--k); box-shadow: 0 2px 6px #0003; }
.seg3 { grid-template-columns: repeat(3, 1fr); }
.seg6 { grid-template-columns: repeat(6, 1fr); gap: 4px; }
@media (max-width: 480px) { .seg6 { grid-template-columns: repeat(3, 1fr); } }

/* 목록 카드 */
.re-list .card { cursor: pointer; }
.card .ci .price { font-size: 16px; }
.card.closed { opacity: .6; }
.card.closed img { filter: grayscale(1); }
.empty { padding: 40px 16px; text-align: center; color: #6b7380; }
#add-btn { width: auto; padding: 0 22px; border-radius: 30px; font-size: 17px; font-weight: 600; }
.filters .f-num { min-width: 0; }

/* 등록 화면 */
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.grid2 > div { display: grid; gap: 4px; min-width: 0; }
.grid2 small, .hint { color: #6b7380; font-size: 12px; }
.sec { margin: 14px 0 0; padding: 0 0 4px; font-size: 16px; color: var(--c); border-bottom: 2px solid var(--accent); }
.ck-row { display: grid; grid-template-columns: 1fr auto; gap: 6px; align-items: center; padding: 8px 0; border-bottom: 1px solid #edf0f4; }
.ck-row b { font-size: 15px; }
.ck-row .ck-btns { display: flex; gap: 4px; }
.ck-row .ck-btns button { padding: 6px 10px; font-size: 13px; }
.ck-row .ck-btns button.on[data-v="ok"] { background: var(--green); color: #fff; border-color: var(--green); }
.ck-row .ck-btns button.on[data-v="warn"] { background: #c99a00; color: #fff; border-color: #c99a00; }
.ck-row .ck-btns button.on[data-v="bad"] { background: var(--red); color: #fff; border-color: var(--red); }
.ck-row input { grid-column: 1 / -1; padding: 6px 10px; font-size: 14px; }
.ck-row input[hidden] { display: none; }
.priv { background: #fff7ee; border: 1px solid #f3c79c; }

/* 설정: 직원 목록 */
.staff { display: grid; grid-template-columns: 1fr 120px auto; gap: 6px; align-items: center; padding: 8px 0; border-top: 1px solid #edf0f4; }
.staff small { display: block; color: #6b7380; }
.staff.wait { background: #fff8e1; margin: 0 -12px; padding: 8px 12px; }
.code { font-size: 26px; font-weight: 700; letter-spacing: 4px; color: var(--accent-d); }
.soon { opacity: .55; }

/* 넓은 화면: 매물장은 카드 여러 줄, 상세는 왼쪽(사진·정보) / 오른쪽(체크·이력) */
@media (min-width: 900px) {
  .filters { grid-template-columns: 2fr repeat(4, 1fr); }
}
@media (min-width: 1024px) {
  .re-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 10px; }
  .re-list .card img, .re-list .card .noimg { width: 110px; height: 96px; }
}
.f-num.bad { border-color: var(--red); background: #fff6f5; }