/**
 * CBR IDX — Listing Detail styles
 * @since 0.9.0
 */

.cbr-detail-wrap {
	max-width: 1200px;
	margin: 0 auto;
	padding: 24px 20px 60px;
}

/* ---- 갤러리 ---- */
.cbr-gallery { margin-bottom: 28px; position: relative; }
.cbr-gallery-main {
	aspect-ratio: 16 / 9;
	border-radius: 14px;
	overflow: hidden;
	background: var(--cbr-primary, #1B2A4A);
}
.cbr-gallery-main img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.cbr-gallery-thumbs {
	display: flex;
	gap: 8px;
	margin-top: 10px;
	overflow-x: auto;
	padding-bottom: 4px;
}
.cbr-gallery-thumbs button {
	flex: 0 0 96px;
	height: 68px;
	padding: 0;
	border: 2px solid transparent;
	border-radius: 8px;
	overflow: hidden;
	cursor: pointer;
	background: none;
}
.cbr-gallery-thumbs button.is-active { border-color: var(--cbr-secondary, #C9A227); }
.cbr-gallery-thumbs img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cbr-gallery-count {
	position: absolute;
	top: 14px;
	right: 14px;
	background: rgba(0,0,0,.6);
	color: #fff;
	padding: 5px 12px;
	border-radius: 999px;
	font-size: .82rem;
}
.cbr-gallery-empty {
	aspect-ratio: 16 / 7;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(135deg, var(--cbr-primary, #1B2A4A), #2a3d63);
	color: rgba(255,255,255,.8);
	border-radius: 14px;
	font-size: 1.2rem;
}

/* ---- 레이아웃 ---- */
.cbr-detail-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 340px;
	gap: 40px;
	align-items: start;
}
.cbr-detail-side { position: sticky; top: 24px; }

/* ---- 헤더 ---- */
.cbr-detail-price {
	font-size: 2.2rem;
	font-weight: 800;
	color: var(--cbr-primary, #1B2A4A);
	line-height: 1.1;
}
.cbr-detail-addr { font-size: 1.5rem; margin: 8px 0 2px; }
.cbr-detail-citystate { color: #6B7280; font-size: 1.05rem; }
.cbr-detail-badges { margin-top: 10px; display: flex; gap: 8px; }
.cbr-badge-office, .cbr-badge-new {
	font-size: .74rem;
	font-weight: 700;
	padding: 4px 11px;
	border-radius: 999px;
	color: #fff;
}
.cbr-badge-office { background: var(--cbr-secondary, #C9A227); }
.cbr-badge-new { background: #16A34A; }

/* IDX 크레딧 — 가격 인접, 본문 크기 유지 (CRMLS SOP) */
.cbr-detail-credit {
	margin-top: 14px;
	padding-top: 12px;
	border-top: 1px solid #EEF0F3;
	font-size: 1rem;
	color: #4B5563;
}

/* ---- 섹션/스펙 ---- */
.cbr-detail-section { margin-top: 36px; }
.cbr-detail-section h2 {
	font-size: 1.25rem;
	color: var(--cbr-primary, #1B2A4A);
	margin-bottom: 14px;
	padding-bottom: 8px;
	border-bottom: 2px solid #EEF0F3;
}
.cbr-facts {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
	gap: 14px 20px;
	margin: 0;
}
.cbr-fact { border-bottom: 1px solid #F3F4F6; padding-bottom: 8px; }
.cbr-fact dt { font-size: .82rem; color: #9CA3AF; text-transform: uppercase; letter-spacing: .04em; }
.cbr-fact dd { margin: 3px 0 0; font-weight: 600; color: var(--cbr-text, #1F2937); }
.cbr-remarks { line-height: 1.75; color: #374151; white-space: pre-line; }

/* ---- 지도 ---- */
.cbr-map {
	height: 380px;
	border-radius: 12px;
	overflow: hidden;
	z-index: 1;
}

/* ---- 문의 폼 ---- */
.cbr-inquiry {
	background: #fff;
	border: 1px solid #E5E7EB;
	border-radius: 14px;
	padding: 22px;
	box-shadow: 0 4px 20px rgba(27,42,74,.07);
}
.cbr-inquiry-agent { display: flex; gap: 14px; align-items: center; margin-bottom: 18px; }
.cbr-inquiry-photo {
	width: 68px;
	height: 68px;
	border-radius: 50%;
	object-fit: cover;
	flex: 0 0 68px;
}
.cbr-inquiry-name { font-weight: 700; color: var(--cbr-primary, #1B2A4A); }
.cbr-inquiry-title { font-size: .86rem; color: #6B7280; }
.cbr-inquiry-phone {
	display: inline-block;
	margin-top: 3px;
	font-weight: 600;
	color: var(--cbr-secondary, #C9A227);
	text-decoration: none;
}
.cbr-inquiry-dre { font-size: .76rem; color: #9CA3AF; margin-top: 2px; }

.cbr-inquiry-form input,
.cbr-inquiry-form textarea {
	width: 100%;
	padding: 11px 13px;
	margin-bottom: 10px;
	border: 1px solid #D6D9E0;
	border-radius: 8px;
	font-size: .95rem;
	font-family: inherit;
}
.cbr-inquiry-form input:focus,
.cbr-inquiry-form textarea:focus {
	outline: none;
	border-color: var(--cbr-secondary, #C9A227);
	box-shadow: 0 0 0 3px rgba(201,162,39,.15);
}
.cbr-inquiry-submit {
	width: 100%;
	padding: 13px;
	background: var(--cbr-primary, #1B2A4A);
	color: #fff;
	border: none;
	border-radius: 8px;
	font-weight: 700;
	font-size: 1rem;
	cursor: pointer;
	transition: background .15s ease;
}
.cbr-inquiry-submit:hover { background: var(--cbr-secondary, #C9A227); }

.cbr-inquiry-sent {
	background: #ECFDF5;
	border: 1px solid #A7F3D0;
	color: #065F46;
	padding: 12px 14px;
	border-radius: 8px;
	margin-bottom: 14px;
}
.cbr-inquiry-error {
	background: #FEF2F2;
	border: 1px solid #FECACA;
	color: #991B1B;
	padding: 12px 14px;
	border-radius: 8px;
	margin-bottom: 14px;
}

/* ---- 카드 링크 (그리드 카드 전체 클릭) ---- */
.cbr-card-link { text-decoration: none; color: inherit; display: block; }

/* ---- 410 페이지 ---- */
.cbr-gone-box {
	text-align: center;
	padding: 48px 24px;
	background: #F8F9FB;
	border-radius: 14px;
	margin-bottom: 36px;
}
.cbr-gone-box h1 { color: var(--cbr-primary, #1B2A4A); margin-bottom: 10px; }
.cbr-gone-box p { color: #6B7280; margin: 0; }
.cbr-similar-heading { color: var(--cbr-primary, #1B2A4A); margin-bottom: 14px; }

/* ---- IDX 고지문 ---- */
.cbr-idx-disclaimer {
	margin-top: 48px;
	padding-top: 20px;
	border-top: 1px solid #E5E7EB;
	font-size: .8rem;
	color: #9CA3AF;
	line-height: 1.6;
}
.cbr-idx-updated { margin-top: 6px; }

@media (max-width: 900px) {
	.cbr-detail-grid { grid-template-columns: 1fr; gap: 28px; }
	.cbr-detail-side { position: static; }
	.cbr-detail-price { font-size: 1.8rem; }
	.cbr-detail-addr { font-size: 1.25rem; }
	.cbr-map { height: 280px; }
}

/* 지도 로드 실패 시 폴백 */
.cbr-map-fallback {
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 8px;
	background: #F3F4F6;
	color: #6B7280;
}
.cbr-map-fallback a {
	color: var(--cbr-secondary, #C9A227);
	font-weight: 600;
	text-decoration: none;
}

/* ---- 지도: 클릭 시 로드 CTA + 탭 (v0.9.3) ---- */
.cbr-map-wrap { position: relative; }
.cbr-map { position: relative; background: #E8EAED; }

.cbr-map-cta {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 8px;
	border: none;
	cursor: pointer;
	background:
		repeating-linear-gradient(45deg, #EEF1F4 0 12px, #E6EAEF 12px 24px);
	color: var(--cbr-primary, #1B2A4A);
	font-size: 1rem;
	font-weight: 600;
	font-family: inherit;
	border-radius: 12px;
	transition: background .15s ease;
}
.cbr-map-cta:hover { background: #E2E7EC; }
.cbr-map-pin { font-size: 1.8rem; line-height: 1; }

.cbr-street {
	height: 380px;
	border-radius: 12px;
	overflow: hidden;
}

.cbr-map-tabs {
	display: flex;
	gap: 6px;
	margin-top: 10px;
}
.cbr-map-tabs button {
	padding: 8px 18px;
	border: 1px solid #D6D9E0;
	background: #fff;
	border-radius: 999px;
	cursor: pointer;
	font-size: .9rem;
	font-family: inherit;
	color: var(--cbr-text, #1F2937);
	transition: all .15s ease;
}
.cbr-map-tabs button:hover { border-color: var(--cbr-secondary, #C9A227); }
.cbr-map-tabs button.is-active {
	background: var(--cbr-primary, #1B2A4A);
	border-color: var(--cbr-primary, #1B2A4A);
	color: #fff;
}

@media (max-width: 900px) {
	.cbr-street { height: 280px; }
}