/**
 * WTW HivePress Customizations — custom.css
 *
 * All site-specific CSS tweaks for HivePress live here, grouped in
 * clearly labeled sections. Add new customizations as a new section
 * below rather than editing the theme's stylesheet.
 */

/* =========================================================================
   1. Stack "Place", "Start Date", "End Date" (and other primary attributes)
      into separate lines instead of side by side.

      HivePress lays out attributes in a Bootstrap-style row/column grid
      (.hp-row > .hp-col-lg-4 / .hp-col-lg-6 / etc). We switch that row to
      a column layout and force each attribute's grid column to take the
      full width, on both the listing cards (view-block) and the single
      listing page (view-page).
   ========================================================================= */

.hp-listing__attributes--primary {
	flex-direction: column;
}

.hp-listing__attributes--primary > [class*="hp-col-"] {
	flex: 0 0 100% !important;
	max-width: 100% !important;
}

.hp-listing__attributes--primary .hp-listing__attribute {
	display: flex;
	align-items: center;
	width: 100%;
	margin-bottom: 6px;
}

.hp-listing__attributes--primary .hp-listing__attribute:last-child {
	margin-bottom: 0;
}

/* =========================================================================
   2. Add right-hand spacing after the "End Date" attribute value.

      Note: this targets the attribute by its slug (enddate). If your
      attribute's machine name is different (e.g. "end_date"), inspect
      the element in your browser and update the class name below to
      match — it will read ".hp-listing__attribute--<your-slug>".

      Kept here as a fallback in case JavaScript is ever disabled —
      Start Date/End Date are normally now merged into one line by
      custom.js (see section 3 below), which makes this rule a no-op
      in the normal case.
   ========================================================================= */

.hp-listing__attribute--enddate {
	margin-right: 1rem;
}

/* =========================================================================
   3. Icon spacing for the location icon and the merged date-range line
      that custom.js adds to each listing.
   ========================================================================= */

.hp-listing__attribute--location .wtw-hpc-icon,
.wtw-hpc-date-range .hp-icon {
	margin-right: 6px;
}

.hp-listing__attribute--weddingtheme .wtw-hpc-icon
{
	margin-right: 6px;
    
}


.hp-listing__attribute--weddingtheme
{
   margin-right:1rem;   
     
}

.wtw-hpc-date-range {
	display: flex;
	align-items: center;
}

.wtw-hpc-icon,
.wtw-hpc-date-range .hp-icon {
	color: #B3161E;
}

/* =========================================================================
   3b. Merged "Contribution" + "Currency" line that custom.js adds to
       each listing (e.g. "INR 5000" on one line with an icon).
   ========================================================================= */

.wtw-hpc-contribution-line {
	display: flex;
	align-items: center;
}

.wtw-hpc-contribution-line .wtw-hpc-icon {
	margin-right: 6px;
}

/* If you'd like the SAME stacked layout for the "secondary" attributes
   area too, uncomment the block below. */

/*
.hp-listing__attributes--secondary {
	flex-direction: column;
}

.hp-listing__attributes--secondary > [class*="hp-col-"] {
	flex: 0 0 100% !important;
	max-width: 100% !important;
}
*/

/* =========================================================================
   4. "I Want To Join" button ([wtw_join_button] shortcode).

      Reuses the theme's own button look (hp-button / hp-button--primary
      classes are added by PHP already) — this just adds spacing/width so
      it sits well in the sidebar. Adjust freely to match the final design.
   ========================================================================= */

.wtw-hpc-join-button {
	display: inline-block;
	width: 100%;
	text-align: center;
	margin-top: 1rem;
	background-color: #B3161E;
	color: #ffffff;
	border: 1px solid #B3161E;
	padding: 10px 20px;
	border-radius: 4px;
	text-decoration: none;
}

.wtw-hpc-join-button:hover,
.wtw-hpc-join-button:focus {
	background-color: #921118;
	color: #ffffff;
}

/* =========================================================================
   5. "Report Listing" link styled to match the Join button above.

      This link is rendered by HivePress core / the theme, not by this
      plugin. Rather than guessing at a CSS selector, custom.js finds the
      link and adds the ".wtw-hpc-report-button" class to it directly
      (see styleReportLink() in custom.js) — this rule then styles that
      class, with !important to reliably override any theme default
      link/button styling already applied to it.

      IMPORTANT: custom.js currently finds the link via
      a[href="#listing_report_modal"]. If your theme's "Report Listing"
      link uses a different href, inspect it in the browser and update
      the selector in custom.js's styleReportLink() function to match.
   ========================================================================= */

.wtw-hpc-report-button {
	display: inline-block;
	background-color: #B3161E !important;
	color: #ffffff !important;
	padding: 10px 20px;
	border-radius: 4px;
	text-decoration: none !important;
	border: 1px solid #B3161E;
}

.wtw-hpc-report-button:hover,
.wtw-hpc-report-button:focus {
	background-color: #921118 !important;
	color: #ffffff !important;
}