/* ==========================================================================
   IMPL 21 wedding — responsive fixes layered AFTER the Vite wedding.css.
   Every rule is scoped under .wed-scope and wins by specificity; wedding.css is
   not edited. Loaded only by the wedding-events views (see the <link> after
   @vite(['resources/css/wedding.css'])).
   ========================================================================== */

/* WED-001: venue photo (aspect-ratio 16/10 + min-height 220px) was 352px wide inside a 320px
   gutter at 360px (page scrollWidth 372). Keep the 220px height, let the width follow the column. */
@media (max-width: 480px) {
    .wed-scope .wed-vd-main {
        aspect-ratio: auto;
        height: 220px;
        width: 100%;
        max-width: 100%;
    }
}

/* WED-002: text that rendered below 12px */
.wed-scope .wed-main-card__feature-label,
.wed-scope .wed-main-card__cta-arrow,
.wed-scope .wed-garden-card__explore-label,
.wed-scope .wed-vd-360__status,
.wed-scope .wed-s1-venue__label {
    font-size: max(12px, 0.75rem);
}

/* WED-003 / WED-004: invisible >=32x32px hit areas (same pattern as .sys-tap); visible size unchanged */
.wed-scope .wed-hero-crumbs a,
.wed-scope .wed-s5-edit {
    position: relative;
}

.wed-scope .wed-hero-crumbs a::before,
.wed-scope .wed-s5-edit::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    width: max(100%, 32px);
    height: max(100%, 32px);
    transform: translate(-50%, -50%);
}

/* WED-004: consent row (label wraps the checkbox and the sentence) is at least 32px tall */
.wed-scope .legal-policy-acceptance label {
    min-height: 32px;
}

/* WED-006 (Day / Night cards): no rule needed. The 4px reported as clipped is the empty bottom padding of
   .wed-s1-session__body, which sits 5px lower than the card's content box; the text ends at 113px of the
   151px card, so no visible content is clipped. */