/**
 * Resort Rooms — fixed-height, object-fit: cover image treatment for
 * the alternating room layout (template-parts/components/room-card.php).
 * New file so main.css stays untouched; nothing else in that layout
 * needs custom CSS (the existing Bootstrap grid + main.css's own
 * pt-36/pt-40/pb-36 utility classes handle everything else).
 *
 * The wrapper owns height + border-radius (via overflow: hidden) so
 * every room's photo fills the same box regardless of its own aspect
 * ratio, cropping from center rather than stretching — independent of
 * how tall the content column next to it grows.
 *
 * Loaded after main.css via an explicit enqueue dependency (inc/enqueue.php).
 */

.tm-room-image-wrap {
    height: 520px;
    overflow: hidden;
    border-radius: var(--radius-sm);
}

.tm-room-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

@media screen and (max-width: 991px) {
    .tm-room-image-wrap {
        height: 420px;
    }
}

@media screen and (max-width: 767px) {
    .tm-room-image-wrap {
        height: 300px;
    }
}