/* Sirka demo — Blazor-only additions. The live look comes from the template
   + Nuxt bundled CSS copied from the live snapshot. Do NOT override body or
   typography here — let the template's --uc-text-font (Albert Sans) win. */

/* Fixes surfaced by probe_element_styles.py against the live site. */
.property-grid-2.property-block,
.property-grid-2.property-block.bg-white {
    background-color: #fff !important;
    margin-bottom: 15px;
}

/* Cards need white bg + bottom margin to match live — see probe_element_styles.py
   report that flagged .property-grid-2 as transparent-on-new vs white-on-live. */

/* Post-strip conflict override: Nuxt bundle collapsed scoped .full-row rules
   into competing globals (30/20/60/80 padding). Last-wins landed at 60px; live
   uses 30px for the "full-wide-layout" section (New Properties grid) and the
   footer. Target just those sections — utility-class paddings (py-5, pb-5,
   pt-0) on OTHER .full-rows must not be overridden.
   `strip_scoped_css.py --warn-conflicts` surfaces these post-strip collisions. */
.full-row.full-wide-layout { padding-top: 30px !important; padding-bottom: 30px !important; }
.full-row.bg-footer        { padding-top: 30px !important; padding-bottom: 30px !important; }

/* Top hotspot (find_style_hotspots.py): div.full-row has bg=1.00 divergence.
   Nuxt bundle emits `.full-row { padding:80px 0; background-color:#f8f9fa }`
   as a scoped rule — stripping globalized it so every .full-row on the page
   paints light-gray. Live's .full-rows are transparent. Override. */
.full-row                  { background-color: transparent !important; }
/* Preserve intentional backgrounds on specific variants: */
.full-row.bg-footer        { background-color: #12355b !important; }

/* Hero section: the template expects .full-row base padding 80px; the Nuxt
   bundle overrode to 60px globally. Template CSS already supplies the bridge
   bg; the hero's actual vertical rhythm comes from banner-search internal
   padding (200px top) and on-banner-feature margin (-380px). Zero out the
   outer padding so the overlap geometry works as the template intended. */
.home-banner-background.full-row { padding-top: 0 !important; padding-bottom: 0 !important; }

/* Sell / Purchase / Move feature boxes in the hero.
   find_style_hotspots.py flagged this as the #2 hotspot. Live's boxes are
   transparent overlays on the hero's navy background (no bg, no shadow, no
   radius, white text); mine inherited a white-card treatment from a different
   scoped .box-style-1 rule that got globalised by strip_scoped_css. */
.on-banner-feature .box-style-1 {
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}
/* Iter10 correction: live's .entry-wrapper in the hero features has
   rgb(18,53,91) navy bg (not transparent — I had this wrong). Probe emitted
   these overrides via `probe_element_styles.py --emit-css`. */
.on-banner-feature .entry-wrapper { background-color: rgb(18, 53, 91) !important; }
.on-banner-feature .entry-content { margin: 0 !important; line-height: normal !important; }
.on-banner-feature .entry-footer  { display: block !important; align-items: normal !important; gap: normal !important; }
.on-banner-feature .entry-title,
.on-banner-feature .entry-content p,
.on-banner-feature .entry-content,
.on-banner-feature .btn-link      { color: #fff !important; }
.on-banner-feature .entry-title   { display: block !important; font-weight: 500 !important; }

/* Footer widgets — same hotspot class (div.widget 7×7, bg+shadow+radius diff).
   Live footer widgets are transparent on the navy footer bg, not white cards. */
footer.full-row .widget {
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}

/* Footer full-row itself should be navy, not light. Hotspot #3 flagged bg=0.77. */
footer.full-row.bg-footer { background-color: #12355b !important; }

/* Static hotspots from iter7: h3.main-title font-weight 600 vs live 700,
   color #333 vs live #101010. Section titles. */
h3.main-title { font-weight: 700 !important; color: rgb(16, 16, 16) !important; }

/* Card internals — bbox diagnostic in iter9 found my cards are 35px taller
   than live's. Traced to .entry-content inherited margin-bottom:20px and
   min-height:30px from a scope-strip collision. Reset to match live. */
.property-grid-2 .entry-content       { margin: 0 !important; min-height: auto !important; }
.property-grid-2 .entry-footer        { gap: 0 !important; }
.property-grid-2 .property-info li    { width: auto !important; }
/* Probe (iter11): mine has `margin: 0 5px 0 0` on each Beds/Baths/Sqft label
   span, live has 0. That extra 5px propagates through 4 labels per card ×
   16 cards = 320px of spurious width accumulation. */
.property-grid-2 .property-info li span { margin: 0 !important; }
/* Iter12: live's New Properties cards use .property-info min-height: 24px
   but Featured cards use 0. Different contexts, different expectations.
   Earlier global `min-height: 0 !important` was wrong for New Properties. */
.full-wide-layout .property-grid-2 .property-info { min-height: 24px !important; }
.straight-shape .property-grid-2 .property-info   { min-height: 0 !important; }

/* Interaction tool flagged: live tabs DO change bg from red→transparent on click.
   The .property-type-btn base style is transparent; .active adds red. Good. */

/* find_style_hotspots.py --emit-css (iter11): my buttons have border-radius
   14px; live uses 7-10px depending on variant. Modal fix from hotspot tool. */
a.btn      { border-radius: 7px !important;  }
button.btn { border-radius: 10px !important; }

/* Nav header — solid navy background so text is always readable */
.main-header.header-absolute .main-nav {
    background-color: #12355b !important;
}

.breadcrumb { margin-top: 12px; }

#blazor-error-ui {
    background: #fff6f6; color: #8b0000;
    padding: 1rem; border-top: 2px solid #d50000;
    bottom: 0; left: 0; right: 0; position: fixed;
    z-index: 9999; display: none;
}
#blazor-error-ui[style*="display: block"] { display: block; }