/* Guest house detail page module. Keep object-card-only refinements here. */

.detail-page {
    --detail-card: #fff;
    --detail-line: #dfe7f2;
    --detail-muted: #667085;
}

.detail-page .property-gallery,
.detail-page .content-section,
.detail-page .booking-card,
.detail-page .rating-card,
.detail-page .review-card,
.detail-page .room-card,
.detail-page .map-info-card {
    background: var(--detail-card);
    border-color: var(--detail-line);
}

.detail-page .gallery-open {
    cursor: pointer;
}

.detail-page .gallery-open:focus-visible,
.detail-page .btn:focus-visible {
    outline: 3px solid rgba(11, 124, 255, .22);
    outline-offset: 2px;
}

.detail-page .content-section p,
.detail-page .modal-lead {
    color: var(--detail-muted);
}

.detail-page .content-section {
    padding: 24px;
}

.detail-page .nearby-list div {
    align-items: center;
    grid-template-columns: 34px minmax(0, 1fr) auto;
    padding: 12px 0;
}

.detail-page .nearby-list div strong,
.detail-page .nearby-list div em {
    min-width: 0;
}

.detail-page .contact-actions img,
.detail-page .btn-whatsapp img {
    display: block;
    height: 20px;
    width: 20px;
}

.detail-page .modal-wide {
    max-width: min(1180px, calc(100vw - 32px));
    width: min(1180px, calc(100vw - 32px));
}

.detail-page .lightbox img {
    max-height: 90vh;
    max-width: 96vw;
}

.detail-page .modal-wide .rooms-modal-grid {
    display: block;
}

.detail-page .modal-wide .room-list {
    align-items: stretch;
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
}

.detail-page .modal-wide .room-list > .room-card {
    flex: 1 1 300px;
    max-width: calc(50% - 7px);
    min-width: 280px;
}

.detail-page .modal-wide .room-list > .selected-date {
    flex: 1 1 100%;
}

@media (max-width: 760px) {
    .detail-page .modal-wide .room-list {
        display: grid;
        grid-template-columns: 1fr;
    }

    .detail-page .modal-wide .room-list > .room-card {
        max-width: none;
        min-width: 0;
    }
}

[data-theme="dark"] .detail-page {
    --detail-card: #182235;
    --detail-line: #2a3850;
    --detail-muted: #a8b3c7;
}

[data-theme="dark"] .detail-page .property-gallery,
[data-theme="dark"] .detail-page .content-section,
[data-theme="dark"] .detail-page .booking-card,
[data-theme="dark"] .detail-page .rating-card,
[data-theme="dark"] .detail-page .review-card,
[data-theme="dark"] .detail-page .room-card,
[data-theme="dark"] .detail-page .map-info-card,
[data-theme="dark"] .detail-page .modal-dialog {
    background: var(--detail-card);
    border-color: var(--detail-line);
    color: #e8eef8;
}

[data-theme="dark"] .detail-page .btn-light,
[data-theme="dark"] .detail-page input,
[data-theme="dark"] .detail-page select,
[data-theme="dark"] .detail-page textarea {
    background: #121b2b;
    border-color: var(--detail-line);
    color: #e8eef8;
}
