/* ==========================================================
   my-properties.css
   내 매물 목록/상세. 레이아웃·헤더·푸터·카드 기본 틀은 favorite.css 를 그대로 사용하고
   (body.favorite-page), 이 파일에는 내 매물에만 필요한 부분만 둔다.
   ========================================================== */

.mp-state { text-align: center; color: #6b7b8f; padding: 50px 0; font-size: 15px; line-height: 1.7; }
.mp-state:empty { display: none; }
.mp-state a { color: var(--primary); font-weight: 800; }

/* ----- 목록 카드 (favorite-card 확장) ----- */
a.favorite-card { display: block; color: inherit; text-decoration: none; }
.mp-card .favorite-card-price { font-size: 18px; line-height: 1.35; }
.mp-no-photo { position: absolute; inset: 0; display: grid; place-items: center; color: #a6b2c6; font-size: 38px; }
.favorite-card-media .mp-badge { position: absolute; z-index: 3; top: 12px; left: 12px; }
.mp-count { position: absolute; z-index: 3; right: 10px; bottom: 10px; padding: 3px 9px; border-radius: 999px;
            background: rgba(15, 23, 42, 0.65); color: #fff; font-size: 12px; font-weight: 700; }
.mp-empty-icon { background: rgba(30, 136, 255, 0.1); color: var(--primary); font-size: 28px; }

.mp-badge { display: inline-block; padding: 4px 11px; border-radius: 999px; font-size: 12px; font-weight: 800; }
.mp-badge.pending { background: #fff4e0; color: #b7791f; }
.mp-badge.approved { background: #e3f8ee; color: #15803d; }
.mp-badge.rejected { background: #fde8e8; color: #c53030; }

/* ----- 버튼 ----- */
.mp-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; padding: 0 20px;
          border-radius: 13px; border: 1.5px solid #d5d9e0; background: #fff; color: #374151;
          font-size: 14px; font-weight: 850; cursor: pointer; text-decoration: none; transition: 160ms ease; }
.mp-btn:hover { border-color: var(--primary); color: var(--primary); }
.mp-btn.primary { background: var(--primary); border-color: var(--primary); color: #fff;
                  box-shadow: 0 10px 22px rgba(30, 136, 255, 0.2); }
.mp-btn.primary:hover { filter: brightness(0.95); color: #fff; }
.mp-btn.danger { color: #e5484d; border-color: #f3c4c6; }
.mp-btn.danger:hover { background: #e5484d; border-color: #e5484d; color: #fff; }
.mp-btn:disabled { opacity: 0.6; cursor: default; }

/* ----- 상세 ----- */
.mp-detail-inner { max-width: 880px; margin: 0 auto; }
.mp-section { background: #fff; border: 1px solid #e7ecf2; border-radius: 20px; padding: 24px 26px; margin-bottom: 18px;
              box-shadow: 0 9px 28px rgba(29, 52, 80, 0.07); }
.mp-section h2 { margin: 0 0 14px; font-size: 18px; font-weight: 900; color: #172033; }
.mp-title-row { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.mp-deal { font-size: 13px; font-weight: 800; color: #6f7f92; }
.mp-title-price { font-size: 26px; font-weight: 950; color: var(--primary); margin: 4px 0; letter-spacing: -0.025em; }
.mp-addr { font-size: 14px; color: #374151; }
.mp-notice { padding: 12px 16px; border-radius: 14px; background: rgba(30, 136, 255, 0.08);
             color: #1b5fb8; font-size: 13px; font-weight: 700; line-height: 1.6; margin-bottom: 18px; }
.mp-notice.warn { background: #fff4e0; color: #8a5a12; }

.mp-gallery-main { width: 100%; aspect-ratio: 16 / 10; border-radius: 14px; background: #eef0f3 center / contain no-repeat;
                   display: flex; align-items: center; justify-content: center; color: #a6b2c6; font-size: 40px; }
.mp-gallery-thumbs { display: flex; gap: 8px; margin-top: 10px; overflow-x: auto; padding-bottom: 4px; }
.mp-gallery-thumbs button { flex: 0 0 84px; height: 64px; border: 2px solid transparent; border-radius: 10px;
                            background: #eef0f3 center / cover no-repeat; cursor: pointer; padding: 0; }
.mp-gallery-thumbs button.active { border-color: var(--primary); }

.mp-info-row { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0;
               border-bottom: 1px solid #eef0f3; font-size: 15px; }
.mp-info-row:last-child { border-bottom: none; }
.mp-info-row span:first-child { color: #6b7280; flex-shrink: 0; }
.mp-info-row span:last-child { text-align: right; word-break: break-all; }

.mp-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.mp-chips span { padding: 6px 12px; border-radius: 999px; background: #f1f5f9; color: #374151;
                 font-size: 13px; font-weight: 700; }
.mp-sub-title { font-size: 13px; font-weight: 800; color: #6b7280; margin: 14px 0 8px; }
.mp-sub-title:first-of-type { margin-top: 0; }

.mp-doc-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0;
              border-bottom: 1px solid #eef0f3; font-size: 14px; }
.mp-doc-row:last-child { border-bottom: none; }
.mp-doc-row a { color: var(--primary); font-weight: 800; text-decoration: none; flex-shrink: 0; }
.mp-empty { color: #9ca3af; font-size: 14px; }

.mp-actions { display: flex; gap: 10px; justify-content: flex-end; margin-top: 8px; }

@media (max-width: 768px) {
  .mp-section { padding: 20px 18px; }
  .mp-actions .mp-btn { flex: 1; }
}