/**
 * Fallback styles for Real Estate Platform Elementor widgets.
 *
 * These load unless the active theme explicitly declares:
 *   add_theme_support( 'rep-widgets-style' );
 * — meaning it ships its own complete, matching CSS for every class this
 * plugin's widgets render (.rep-grid, .rep-tax-grid, .rep-iconbox-grid,
 * .homelengo-box, .box-agent, etc.). The bundled Homelengo theme does NOT
 * declare that support (it previously did, incorrectly, without actually
 * shipping matching styles — the widgets rendered unstyled as a result),
 * so this file is what actually styles these widgets there.
 */

.rep-widget { margin: 0 0 24px; }
.rep-empty { padding: 24px; text-align: center; opacity: .7; }

/* Listing widgets (Property/Agent/Agency/Hotel/Handyman): the theme's own
   Bootstrap .row/.col-* classes on each card already provide the primary
   responsive behaviour. These rules are a defensive fallback so the grid
   still looks intentional (even spacing, no forced desktop column count on
   narrow screens) on any theme that doesn't ship Bootstrap. */
.rep-grid { display: flex; flex-wrap: wrap; gap: 24px; box-sizing: border-box; }
.rep-grid > [class*="col-"] { box-sizing: border-box; }
.rep-list > [class*="col-"] { width: 100%; }
@media (max-width: 767px) {
    .rep-grid { gap: 16px; }
    .rep-grid > [class*="col-"] { flex: 0 0 100%; max-width: 100%; }
}

/* Taxonomy Grid (Browse by Property Type / Location) and Icon Box Grid
   widgets: column count is set responsively per-breakpoint from the
   Elementor "Columns" control (see includes/Widgets/TaxonomyGridWidget.php
   and IconBoxGridWidget.php), this just establishes the grid + a sane
   fallback for screens narrower than the widget's own "mobile" breakpoint. */
.rep-tax-grid,
.rep-iconbox-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    box-sizing: border-box;
}
@media (max-width: 767px) {
    .rep-tax-grid,
    .rep-iconbox-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
    }
}
@media (max-width: 480px) {
    .rep-tax-grid,
    .rep-iconbox-grid {
        grid-template-columns: 1fr;
    }
}
.rep-tax-card,
.rep-iconbox {
    max-width: 100%;
}
.rep-tax-card__image img,
.rep-iconbox__icon-box {
    max-width: 100%;
}

.rep-widget .homelengo-box,
.rep-widget .box-agent {
    border: 1px solid rgba(0,0,0,.08);
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
}
.rep-widget .homelengo-box .images-style img,
.rep-widget .box-agent .box-img img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    aspect-ratio: 4 / 3;
}
.rep-widget .archive-bottom,
.rep-widget .box-agent .content { padding: 16px; }
.rep-widget .meta-list { display: flex; gap: 16px; list-style: none; margin: 8px 0; padding: 0; }
.rep-widget .content-bottom { display: flex; align-items: center; justify-content: space-between; margin-top: 12px; }
.rep-widget .flag-tag { display: inline-block; padding: 4px 10px; border-radius: 6px; font-size: 12px; background: #222; color: #fff; }
.rep-widget .flag-tag.primary { background: #d3a44a; }

.rep-swiper { overflow: hidden; }
.rep-swiper .swiper-wrapper { display: flex; }
.rep-pagination { display: flex; gap: 6px; list-style: none; padding: 0; margin-top: 24px; }