/* 기존 상세 화면의 색상과 콘텐츠를 유지하면서 좁은 화면의 가독성과 조작성을 보완한다. */
.detail-page-container,
.detail-page-container * { box-sizing: border-box; }
.detail-page-container { min-width: 0; }
.detail-page-container .revealable { opacity: 1; transform: none; }
.detail-page-container .detail-header h1,
.detail-page-container .sub-name,
.detail-page-container .info-value,
.detail-page-container .description-text,
.detail-page-container .massageShop_menu_item { overflow-wrap: anywhere; }
.detail-page-container .info-value { min-width: 0; line-height: 1.7; }
.detail-page-container .detail-header h1 { color: #a94406; line-height: 1.4; }
.detail-page-container :is(a, button):focus-visible { outline: 3px solid #a94406; outline-offset: 3px; }
.detail-page-container .action-btn,
.detail-page-container .copy-btn { min-height: 44px; min-width: 44px; }
.detail-page-container .copy-btn { border-radius: 8px; padding: 8px 12px; }
.detail-page-container .action-btn { display: inline-flex; justify-content: center; align-items: center; margin: 0; }
.detail-page-container .action-btn.btn-primary { background: #a94406; color: #fff; }
.detail-page-container .action-btn.btn-primary:hover { background: #873604; color: #fff; }
.detail-page-container .detail-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.detail-page-container .detail-actions .action-btn + .action-btn { margin: 0; }
.detail-page-container .place-contact { margin: 0 0 20px; padding: 16px; border: 1px solid #eed6c3; border-radius: 10px; background: #fffaf5; }
.detail-page-container .place-contact-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.detail-page-container .place-contact p { margin: 10px 0 0; color: #536174; font-size: 14px; line-height: 1.7; overflow-wrap: anywhere; }
.detail-page-container .place-contact .contact-unavailable { margin: 0; }
.detail-page-container .place-contact-id { color: #273444; font-weight: 700; }
.detail-page-container .place-contact-link { display: inline-flex; align-items: center; min-height: 44px; color: #a94406; text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.detail-page-container .info-section.menu-section .massageShop_menu_grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); }
.detail-page-container .menu-unverified { grid-column: 1 / -1; margin: 0; padding: 12px; color: #536174; background: #f8f9fa; border-radius: 8px; line-height: 1.7; }
.detail-page-container .gallery-grid { min-width: 0; }
.detail-page-container .image-modal-close-btn { min-width: 44px; min-height: 44px; }
@media (max-width: 768px) {
    .detail-page-container { width: 100%; padding: 16px 12px 24px; }
    .detail-page-container .detail-header { padding: 4px 0 16px; margin-bottom: 16px; }
    .detail-page-container .detail-header h1 { font-size: clamp(23px, 6vw, 28px); }
    .detail-page-container .sub-name { font-size: 15px; }
    .detail-page-container :is(.info-section, .gallery-section, .detail-map-wrapper, .no-map-placeholder) { padding: 14px 12px; margin-bottom: 16px; border-radius: 10px; }
    .detail-page-container .info-list li { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 10px 0; font-size: 15px; }
    .detail-page-container .info-list .info-label { margin: 0; font-size: 13px; color: #536174; }
    .detail-page-container .info-list .info-value { margin: 0; width: 100%; }
    .detail-page-container .info-list .address-item { flex-direction: column; align-items: flex-start; }
    .detail-page-container .info-list .address-item .copy-btn { margin: 4px 0 0; }
    .detail-page-container .detail-actions { display: grid; grid-template-columns: minmax(0, 1fr); margin: 20px 0; }
    .detail-page-container .action-btn { padding: 11px 14px; width: 100%; font-size: 15px; line-height: 1.5; }
    .detail-page-container .place-contact-actions { display: grid; grid-template-columns: minmax(0, 1fr); }
    .detail-page-container .detail-map-wrapper iframe,
    .detail-page-container .mobile-map-section iframe { height: 280px; }
    .detail-page-container .info-section .description-text { padding: 12px; line-height: 1.8; }
    .detail-page-container .gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
}
@media (prefers-reduced-motion: reduce) {
    .detail-page-container .revealable { opacity: 1; transform: none; transition: none; }
    .detail-page-container .action-btn,
    .detail-page-container .massageShop_menu_item,
    .detail-page-container .gallery-image { transition: none; transform: none; }
}
