/**
 * CP Property — site customisations
 *
 * Single source of truth for hand-written CSS on this site.
 * Migrated 2026-08-17 from Customiser > Additional CSS and from the
 * orphaned Microthemer stylesheet. Do not add CSS in the Customiser.
 *
 * NOTE: assets/css/main.css is COMPILED from main.scss — never hand-edit it.
 * This file is plain CSS and is safe to edit directly.
 *
 * Enqueued by functions.php (honeycomb_child_enqueue_custom_css) at a late
 * priority so it lands after the theme and plugin stylesheets.
 */


/* ==========================================================================
   Availability flags — listing pages and homepage property cards
   ==========================================================================
   Property Hive writes the flag colour as an INLINE style on the element
   (Property Hive > Settings > Frontend > Flags, currently #d40000 / #FFF).
   That is a single global style applied to every availability term, so the
   per-state colours have to be layered on here. !important is required to
   beat the inline style.
   -------------------------------------------------------------------------- */

/* LET — yellow. Unchanged behaviour, migrated from Customiser.
   Term "Now Let" has taxonomy slug `let-agreed`, but Property Hive builds the
   flag class from the term NAME, hence .flag-now-let. */
a .flag-now-let {
	background: #f4e200 !important;
	color: #000 !important;
	font-size: 20px !important;
	font-weight: 700;
}

/* AVAILABLE — green. Added 2026-08-17 at the client's request so that
   available properties read green-for-go against let properties.
   #007A33 chosen as a like-for-like swap for the previous #d40000:
     white on #007A33  = 5.48:1  (was 5.53:1 on red)
   Sized to match the LET flag above, which was previously larger. */
a .flag-to-let,
.flag-to-let,
.availability-to-let .flag-to-let {
	background: #007A33 !important;
	color: #FFFFFF !important;
	font-size: 20px !important;
	font-weight: 700 !important;
}


/* ==========================================================================
   Availability text — single property page
   ==========================================================================
   Rendered by two Elementor `property-availability` widgets on theme-builder
   template post 47 (element IDs f1cf4a2 and a1cdde2), both set to #D40000 in
   the widget settings. The output class is identical for every availability
   state, so the term is targeted via the body class instead.
     #007A33 on the #F0F0F0 page background = 4.81:1  (was 4.85:1 on red)
   LET is deliberately left as-is.
   -------------------------------------------------------------------------- */

body.availability-to-let .elementor-widget-availability {
	color: #007A33 !important;
}


/* ==========================================================================
   Button spacing — absorbed from the retired Microthemer stylesheet
   ==========================================================================
   Microthemer previously forced margin-top 24px / margin-bottom 16px on
   .button, over style.css's `margin: 5px 0 0 0`. With Microthemer gone the
   computed result has to be set here rather than in style.css, because
   style.css is enqueued with the WordPress CORE version (?ver=7.0.4) and so
   cannot be cache-busted on demand. This file uses filemtime(), so it can.

   !important is required, and is not decoration: the parent theme's
   propertyhive.css sets `ul.properties li.property .button { margin-bottom:
   0.236em }` at specificity (0,3,2), which outranks a plain `.button` rule
   whatever the load order. Microthemer used !important for the same reason.
   Longhand rather than shorthand, so left/right margins are left to
   style.css exactly as before.
   -------------------------------------------------------------------------- */

.button {
	margin-top: 24px !important;
	margin-bottom: 16px !important;
}


/* ==========================================================================
   Layout fixes — migrated verbatim from Customiser > Additional CSS
   ========================================================================== */

.property_actions {
	margin-bottom: 0 !important;
}

#property_map_canvas {
	z-index: 1;
}

/* Watch this one: it previously sat in the Customiser, which always prints
   after every enqueued stylesheet. It competes with Elementor's generated
   CSS, so if the element loses its full width after migration, raise the
   specificity rather than moving it back. */
.elementor-element-3e6ac50 {
	width: 100%;
}

/* UAEL image grid — crop thumbnails to a consistent height */
.uael-grid-img-thumbnail {
	height: 125px;
	overflow: hidden;
}

.uael-grid-img-thumbnail img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}