/**
 * Module: Rooms Variant Composition Layer
 * Target: src/core_apps/frontend/static/frontend/themes/_shared/sections/rooms/rooms-variants.css
 * 
 * Specifications (HMS-Grade):
 * - Rule A: Zero sibling positional dependence
 * - Rule B: Rigid Static Weight Budget (Limit: 15 KB uncompressed)
 * - Rule C: Absolute scoping containment
 * - Rule D: Mandatory tenant-safe media aspect-ratio enforcement
 */

/* =============================================================================
   1. CONTAINER & COMPOSABLE LAYOUT BASICS
   ============================================================================= */
.page-home .home-composer .section-rooms {
    position: relative;
    width: 100%;
    padding: var(--spacing-xl, 4rem) 0;
    overflow: hidden;
}

/* Aspect-ratio guardrail safeguarding from chaotic tenant file uploads */
.page-home .home-composer .section-rooms .room-media-box img {
    aspect-ratio: 3 / 2;
    object-fit: cover;
    overflow: hidden;
    width: 100%;
    height: auto;
    display: block;
}


/* =============================================================================
   2. VARIANT: SHOWCASE (Alternating High-Impact Horizontal Strip)
   ============================================================================= */
.page-home .home-composer .section-rooms--showcase .showcase-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--spacing-lg, 2rem);
    margin-bottom: var(--spacing-xl, 3rem);
    align-items: center;
}

@media (min-width: 768px) {
    .page-home .home-composer .section-rooms--showcase .showcase-row {
        grid-template-columns: 1fr 1fr;
    }
    
    /* Strict Positional Alternating Logic using sibling order, NOT position dependencies */
    .page-home .home-composer .section-rooms--showcase .showcase-row:nth-child(even) .showcase-media-pane {
        order: 2;
    }
}

.page-home .home-composer .section-rooms--showcase .showcase-content-pane {
    padding: var(--spacing-lg, 2rem);
}


/* =============================================================================
   3. VARIANT: MINIMALIST (High-Density Vertical Grid Cards)
   ============================================================================= */
.page-home .home-composer .section-rooms--minimalist .minimalist-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--spacing-lg, 2rem);
    padding: 0 var(--spacing-md, 1rem);
}

.page-home .home-composer .section-rooms--minimalist .room-card-minimal {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--border-color, #eeeeee);
    background-color: var(--bg-surface, #ffffff);
    overflow: hidden;
}

.page-home .home-composer .section-rooms--minimalist .room-card-minimal .card-meta {
    padding: var(--spacing-md, 1.5rem);
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}