/**
 * Design tokens — the exact palette/typography/shape values from the
 * original design, as CSS custom properties. Set Elementor's own Global
 * Colors and Global Fonts to these same values in Site Settings (see the
 * Elementor build spec) so widgets can use them natively; this file exists
 * for the handful of things Global Colors/Fonts don't cover (custom-code
 * widgets below, and as a copy-paste reference while setting up Site
 * Settings).
 */

:root {
	/* Colors */
	--yb-obsidian:        #12151A; /* dark section backgrounds */
	--yb-text-dark:       #191c20; /* body text on light backgrounds */
	--yb-gold:            #c5a880; /* primary accent */
	--yb-gold-hover:      #d6bb93;
	--yb-gold-hover-alt:  #d4ba94;
	--yb-bronze:          #725b38; /* secondary accent / links / buttons on light bg */
	--yb-bronze-hover:    #59462a;
	--yb-light-bg:        #f8f9fd;
	--yb-border-dark-1:   #252a35;
	--yb-border-dark-2:   #2b3140;
	--yb-border-dark-3:   #262c37;

	/* Typography */
	--yb-font-serif: 'Playfair Display', Georgia, Cambria, serif;
	--yb-font-sans:  'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

	/* Shape */
	--yb-radius-card: 0.75rem;   /* rounded-xl */
	--yb-radius-panel: 1rem;     /* rounded-2xl */
	--yb-shadow-soft: 0 1px 2px 0 rgb(0 0 0 / 0.05);
	--yb-shadow-lift: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
}

/* ---- Elements the custom-code widgets below rely on ---- */

/* Loading state for AJAX-filtered Loop Grids (Projects/Amenities/Gallery) */
.yb-loading { opacity: 0.45; pointer-events: none; transition: opacity 0.15s ease; }

/* Native [hidden] fallback for older browsers, matches every custom widget's show/hide pattern */
[hidden] { display: none !important; }

/* FAQ accordion (dynamic, CPT-driven — see assets/js/faq-accordion.js) */
.ybc-faq-item .ybc-faq-answer { display: none; }
.ybc-faq-item.is-open .ybc-faq-answer { display: block; }
.ybc-faq-item.is-open .ybc-chevron-down { display: none; }
.ybc-faq-item:not(.is-open) .ybc-chevron-up { display: none; }
.ybc-faq-toggle { cursor: pointer; }

/* Floor plan blueprint viewer (see assets/js/floor-plan-viewer.js) */
.yb-blueprint-grid-bg { position: absolute; inset: 0; opacity: 0.15; background-image: radial-gradient(var(--yb-gold) 1px, transparent 1px); background-size: 20px 20px; }

/* Form success/error inline messages (Elementor Form widget already has its
   own; this covers the popup-passthrough / any custom form fallback text) */
.yb-form-msg { display: none; color: #dc2626; font-weight: 600; }
.yb-form-msg.is-visible { display: block; }

/* ---- Filter tabs (Projects status tabs, Amenities/Gallery category tabs,
   Floor Plan BHK tabs) — same active/inactive treatment throughout, see
   assets/js/projects-filter.js, amenities-filter.js, gallery-filter.js,
   floor-plan-viewer.js ---- */
.ybc-filter-status,
.ybc-amenity-filter-btn,
.ybc-gallery-filter-btn,
.ybc-faq-cat-btn,
.ybc-bhk-tab-btn {
	background: rgb(255 255 255 / 0.05);
	color: #d4d4d4; /* neutral-300 */
	border: 1px solid rgb(255 255 255 / 0.1);
	transition: background-color 0.15s ease, color 0.15s ease;
}
.ybc-filter-status:hover,
.ybc-amenity-filter-btn:hover,
.ybc-gallery-filter-btn:hover,
.ybc-bhk-tab-btn:hover {
	background: rgb(255 255 255 / 0.1);
}
.ybc-filter-status.is-active,
.ybc-amenity-filter-btn.is-active,
.ybc-gallery-filter-btn.is-active,
.ybc-faq-cat-btn.is-active,
.ybc-bhk-tab-btn.is-active {
	background: var(--yb-gold);
	color: var(--yb-obsidian);
	border-color: transparent;
	box-shadow: var(--yb-shadow-lift);
}

/* Floor plan variation switcher (assets/js/floor-plan-viewer.js) */
#ybc-plan-variations { display: inline-flex; align-items: center; gap: 0.75rem; }
.ybc-plan-variations-label { font-size: 0.75rem; font-weight: 700; color: #737373; text-transform: uppercase; padding: 0 0.5rem; }
.ybc-plan-variation-btn { padding: 0.375rem 0.875rem; border-radius: 0.375rem; font-size: 0.75rem; font-weight: 600; color: #404040; background: transparent; cursor: pointer; transition: background-color 0.15s ease, color 0.15s ease; }
.ybc-plan-variation-btn:hover { background: #f5f5f5; }
.ybc-plan-variation-btn.is-active { background: var(--yb-bronze); color: #fff; }

/* Floor plan feature/room rows (assets/js/floor-plan-viewer.js) */
.ybc-plan-feature-row { display: flex; align-items: flex-start; gap: 0.5rem; font-size: 0.75rem; color: #525252; }
.ybc-plan-feature-check { color: var(--yb-bronze); flex-shrink: 0; }
.ybc-plan-room-row { display: flex; align-items: center; justify-content: space-between; padding: 0.5rem 0; font-size: 0.75rem; border-bottom: 1px solid #f5f5f5; }
.ybc-plan-room-dim { font-family: ui-monospace, monospace; font-weight: 600; color: #171717; background: #fafafa; padding: 0.125rem 0.5rem; border-radius: 0.25rem; border: 1px solid #e5e5e5; }

/* Signature Highlights / Nearby Landmarks / Layout Highlights lists — output
   by the [ybc_key_highlights] / [ybc_nearby_landmarks] / [ybc_floor_plan_*]
   shortcodes in inc/repeater-meta-boxes.php (the free-ACF replacement for
   what would otherwise be ACF PRO Repeater fields bound via Elementor's
   "ACF Repeater Field" Loop Grid source). Drop the shortcode into an
   Elementor Shortcode widget; these rules make it match the rest of the
   design with zero widget-level styling needed. */
.ybc-highlights-list,
.ybc-landmarks-list,
.ybc-rooms-list,
.ybc-plan-features-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.625rem;
}
.ybc-highlights-item {
	display: flex;
	align-items: flex-start;
	gap: 0.625rem;
	font-family: var(--yb-font-sans);
	font-size: 0.9375rem;
	color: var(--yb-text-dark);
}
.ybc-highlights-check {
	flex-shrink: 0;
	color: var(--yb-bronze);
	font-weight: 700;
}
.ybc-landmarks-item {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.5rem;
	font-family: var(--yb-font-sans);
	font-size: 0.9375rem;
	padding-bottom: 0.625rem;
	border-bottom: 1px solid rgb(0 0 0 / 0.06);
}
.ybc-landmarks-name { font-weight: 600; color: var(--yb-text-dark); }
.ybc-landmarks-distance { color: var(--yb-bronze); font-size: 0.8125rem; }
.ybc-landmarks-category { color: #737373; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.03em; }
.ybc-plan-room-name { color: #404040; }

/* Honeypot anti-spam field (VIP Concierge popup + Contact form) - hidden
   from real visitors via CSS, and checked server-side in
   inc/popup-passthrough.php. */
.ybc-honeypot{position:absolute !important;left:-9999px !important;top:-9999px !important;width:1px !important;height:1px !important;overflow:hidden !important;opacity:0 !important;pointer-events:none !important;}