/* Rubber Badger — extras theme.json can't express. */

/* Hazard stripe accent */
.rb-stripe {
	height: 10px;
	background: repeating-linear-gradient( -45deg, var(--wp--preset--color--yellow) 0 18px, var(--wp--preset--color--base) 18px 36px );
}

/* Button hover "coin glint": a shine sweeps across, then the button turns cream.
   Done with a background gradient (not ::after) so it also works on <input type=submit> buttons. */
/* Same technique as the Jardines Galleries "raking light": a separate light layer (::after)
   slides across on hover. Brighter + faster here so it reads on yellow. */
.wp-block-button__link, .wp-element-button, .fluentform .ff-btn-submit {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease !important;
}
.wp-block-button__link::after, .wp-element-button::after, .fluentform .ff-btn-submit::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background: linear-gradient( 115deg, transparent 28%, rgba(255,255,255,0.55) 42%, rgba(255,255,255,0.95) 50%, rgba(255,255,255,0.55) 58%, transparent 72% );
	transform: translateX( -120% ); /* parked off the left edge */
	transition: none;               /* snap back invisibly when the mouse leaves */
}
.wp-block-button__link:hover::after, .wp-element-button:hover::after, .fluentform .ff-btn-submit:hover::after,
.wp-block-button__link:focus-visible::after, .wp-element-button:focus-visible::after {
	transform: translateX( 120% );
	transition: transform 550ms cubic-bezier( 0.22, 0.61, 0.36, 1 );
}
/* Turn cream as the light leaves the button. */
.wp-block-button__link:hover, .wp-element-button:hover, .fluentform .ff-btn-submit:hover,
.wp-block-button__link:focus-visible, .wp-element-button:focus-visible {
	transition: background-color 0.15s ease 0.4s, color 0.15s ease 0.4s, border-color 0.15s ease 0.4s !important;
}

/* Newsletter "Subscribe" is an <input>, which can't have ::after, so it sweeps a background gradient instead. */
.rb-newsletter .noptin-form-submit {
	background-image: linear-gradient( 115deg, transparent 28%, rgba(255,255,255,0.55) 42%, rgba(255,255,255,0.95) 50%, rgba(255,255,255,0.55) 58%, transparent 72% ) !important;
	background-size: 300% 100% !important;
	background-repeat: no-repeat !important;
	background-position: 150% 0 !important;
	transition: background-color 0.15s ease !important;
}
.rb-newsletter .noptin-form-submit:hover {
	background-position: -50% 0 !important;
	transition: background-position 550ms cubic-bezier( 0.22, 0.61, 0.36, 1 ), background-color 0.15s ease 0.4s !important;
}

@media ( prefers-reduced-motion: reduce ) {
	.wp-block-button__link::after, .wp-element-button::after, .fluentform .ff-btn-submit::after { display: none; }
	.rb-newsletter .noptin-form-submit { background-image: none !important; }
}

/* Header */
.rb-header { position: sticky; top: 0; z-index: 50; border-bottom: 1px solid var(--wp--preset--color--line); }
.rb-header .wp-block-image { margin: 0; }
.rb-header .wp-block-image img { display: block; border-radius: 4px; }
.rb-brand { font-family: var(--wp--preset--font-family--display); text-transform: uppercase; line-height: 1; margin: 0; }
.rb-brand a { color: var(--wp--preset--color--cream); text-decoration: none; }
/* "Western Cape" under the name: smaller, hand-lettered. Swap the font here to try another. */
.rb-brand-region {
	display: inline-block; margin-top: 0.2em;
	font-family: "Permanent Marker", "Segoe Print", cursive;
	font-size: 0.75em; letter-spacing: 0.03em; text-transform: none;
	color: var(--wp--preset--color--cream);
}
.wp-block-navigation a:hover { color: var(--wp--preset--color--yellow); }

/* Menu hover: a yellow outline draws itself around the link (top → right → bottom → left), then glows solid. */
.rb-header .wp-block-navigation__container { gap: 0.15rem; }   /* the outline padding now provides the spacing */
.rb-brand { white-space: nowrap; }
@media ( max-width: 1000px ) {
	.rb-header .wp-block-navigation { font-size: 0.78rem; }
	.rb-header .wp-block-navigation .wp-block-navigation-item__content { padding: 0.4em 0.5em !important; }
}
/* Core only collapses the menu below 600px; ours needs it below 880px so the links never wrap. */
@media ( max-width: 880px ) {
	.rb-header .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex !important; }
	.rb-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none !important; }
	.rb-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close { display: flex !important; }
	.rb-header .wp-block-navigation__responsive-container.is-menu-open { font-size: 1.1rem; }
}
.wp-block-navigation .wp-block-navigation-item__content {
	position: relative;
	padding: 0.45em 0.8em !important;
	border-radius: 2px;
	transition: box-shadow 0.2s ease;
}
.wp-block-navigation .wp-block-navigation-item__content::before,
.wp-block-navigation .wp-block-navigation-item__content::after {
	content: "";
	position: absolute;
	width: 0;
	height: 0;
	box-sizing: border-box;
	border: 2px solid transparent;
	pointer-events: none;
}
.wp-block-navigation .wp-block-navigation-item__content::before { top: 0; left: 0; }     /* draws top, then right */
.wp-block-navigation .wp-block-navigation-item__content::after  { bottom: 0; right: 0; } /* draws bottom, then left */

.wp-block-navigation .wp-block-navigation-item__content:hover::before,
.wp-block-navigation .wp-block-navigation-item__content:focus-visible::before {
	width: 100%;
	height: 100%;
	border-top-color: var(--wp--preset--color--yellow);
	border-right-color: var(--wp--preset--color--yellow);
	transition: width 0.07s linear, height 0.07s linear 0.07s;
}
.wp-block-navigation .wp-block-navigation-item__content:hover::after,
.wp-block-navigation .wp-block-navigation-item__content:focus-visible::after {
	width: 100%;
	height: 100%;
	border-bottom-color: var(--wp--preset--color--yellow);
	border-left-color: var(--wp--preset--color--yellow);
	transition: border-color 0s 0.14s, width 0.07s linear 0.14s, height 0.07s linear 0.21s;
}
/* Once the square closes, it "solidifies" with a soft glow. */
.wp-block-navigation .wp-block-navigation-item__content:hover,
.wp-block-navigation .wp-block-navigation-item__content:focus-visible {
	box-shadow: 0 0 10px rgba(246, 194, 28, 0.35), inset 0 0 6px rgba(246, 194, 28, 0.12);
	transition: box-shadow 0.2s ease 0.28s;
	outline: none;
}
@media ( prefers-reduced-motion: reduce ) {
	.wp-block-navigation .wp-block-navigation-item__content::before,
	.wp-block-navigation .wp-block-navigation-item__content::after { transition: none !important; }
}
.wp-block-navigation__responsive-container.is-menu-open { background: var(--wp--preset--color--base) !important; color: var(--wp--preset--color--cream) !important; }

/* Sections */
.rb-section { padding-top: var(--wp--preset--spacing--60); padding-bottom: var(--wp--preset--spacing--60); }
.rb-eyebrow { color: var(--wp--preset--color--yellow); font-weight: 800; text-transform: uppercase; letter-spacing: 0.12em; font-size: 0.8rem; margin-bottom: 0.25rem; }
.rb-lead { font-size: 1.2rem; color: var(--wp--preset--color--muted); }
.rb-yellow { color: var(--wp--preset--color--yellow); }

/* ---- Flow: one continuous backdrop instead of stacked blocks (after Jardines Galleries) ----
   A fixed, faint yellow glow behind the whole page; sections fade between near-black shades and are
   separated by barely-there yellow hairlines; a ghost badger sits deep in the background. */
:root {
	--rb-hairline: rgba(246, 194, 28, 0.14);
	--rb-deep: #070707;
	--rb-warm: #12100A;
	--rb-ghost: url("../images/logo-watermark.webp");
}
body {
	background-color: var(--wp--preset--color--base);
	background-image:
		radial-gradient( 140% 90% at 82% -15%, rgba(246, 194, 28, 0.06), transparent 55% ),
		radial-gradient( 100% 70% at 10% 115%, rgba(60, 52, 30, 0.45), transparent 70% );
	background-attachment: fixed;
}
.rb-header {
	background-color: rgba(11, 11, 11, 0.92) !important;
	backdrop-filter: blur(8px);
	border-bottom-color: var(--rb-hairline) !important;
}

/* Ghost badger — big, centred, ~5% opacity. Used on the hero, region band, page heads and footer. */
.rb-hero, .rb-region, .rb-guarantee, .rb-page-head, .rb-footer { position: relative; isolation: isolate; overflow: hidden; }
.rb-hero::before, .rb-region::before, .rb-page-head::before, .rb-footer::before {
	content: "";
	position: absolute;
	z-index: -1;
	pointer-events: none;
	background: var(--rb-ghost) no-repeat center / contain;
	opacity: 0.045;
}
.rb-hero::before { inset: -9% 0; }                             /* centred, ~118% of the hero's height (as the coin site's lion) */
.rb-region::before { inset: -15% 0; }                          /* centred, larger than the band */
.rb-page-head::before { inset: -40% -10% -40% 55%; opacity: 0.05; }
.rb-footer::before { inset: 0 -4% 0 62%; opacity: 0.04; }

/* Section backdrops fade into each other (shared start/end colours, no hard edges). */
.rb-hero {
	background:
		radial-gradient( 60% 70% at 72% 40%, rgba(246, 194, 28, 0.11), transparent 62% ),
		linear-gradient( 180deg, var(--rb-warm) 0%, var(--wp--preset--color--base) 70% );
}
.rb-features { background: transparent !important; }
.rb-region {
	background:
		radial-gradient( 58% 80% at 50% 28%, rgba(246, 194, 28, 0.08), transparent 60% ),
		linear-gradient( 180deg, var(--wp--preset--color--base), var(--rb-deep) 55%, var(--wp--preset--color--base) );
	border-block: 1px solid var(--rb-hairline);
}
.rb-guarantee {
	background:
		radial-gradient( 45% 90% at 14% 50%, rgba(246, 194, 28, 0.20), transparent 62% ),
		linear-gradient( 180deg, var(--wp--preset--color--base), var(--rb-warm) 50%, var(--wp--preset--color--base) );
}
.rb-guarantee__big {
	font-size: clamp(4rem, 12vw, 9rem) !important;
	line-height: 0.9 !important;
	text-shadow: 0 0 40px rgba(246, 194, 28, 0.35);
}
.rb-page-head {
	padding-bottom: 1.5rem !important;
	background: radial-gradient( 70% 120% at 85% 0%, rgba(246, 194, 28, 0.09), transparent 60% );
	border-bottom: 1px solid var(--rb-hairline);
	margin-bottom: 2rem;
}
.rb-footer {
	background: linear-gradient( 180deg, transparent, var(--rb-deep) 40% ) !important;
	border-top: 1px solid var(--rb-hairline) !important;
}
/* Hazard stripe softened: fades out at both ends instead of a hard full-width bar. */
.rb-stripe {
	height: 6px;
	-webkit-mask-image: linear-gradient( 90deg, transparent, #000 20%, #000 80%, transparent );
	mask-image: linear-gradient( 90deg, transparent, #000 20%, #000 80%, transparent );
	opacity: 0.85;
}

/* Hero */
.rb-hero { position: relative; overflow: hidden; }
.rb-hero::after {
	content: ""; position: absolute; right: -10%; top: -20%; width: 55%; height: 140%;
	background: radial-gradient( circle, rgba(246,194,28,0.16), transparent 65% ); pointer-events: none;
}
.rb-hero h1 { max-width: 14ch; }
.rb-hero .wp-block-image img { filter: drop-shadow( 0 24px 48px rgba(0,0,0,0.6) ); }

/* Cards */
.rb-card {
	background: var(--wp--preset--color--surface-2);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 8px;
	padding: var(--wp--preset--spacing--40);
	box-sizing: border-box;
}
/* Equal-height cards in a row — only when the card is alone in its column (otherwise it would spill past it). */
.wp-block-column > .rb-card:only-child { height: 100%; }
.rb-card--accent { border-top: 4px solid var(--wp--preset--color--yellow); }
.rb-card h3 { margin-top: 0; }
.rb-card p:last-child { margin-bottom: 0; }
.rb-step {
	font-family: var(--wp--preset--font-family--display);
	color: var(--wp--preset--color--yellow);
	font-size: 2.5rem; line-height: 1; margin: 0;
}
.rb-spec { color: var(--wp--preset--color--muted); font-size: 0.9rem; }

/* Feature bar */
.rb-features { border-top: 1px solid var(--rb-hairline); border-bottom: 1px solid var(--rb-hairline); }
.rb-features p { margin: 0; font-weight: 800; text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.85rem; }
.rb-features p::before { content: "■ "; color: var(--wp--preset--color--yellow); }

/* Colour swatches */
.rb-swatches { display: flex; flex-wrap: wrap; gap: 0.75rem; list-style: none; padding: 0; }
.rb-swatches li { display: flex; align-items: center; gap: 0.5rem; font-size: 0.9rem; }
.rb-swatches li::before { content: ""; width: 1.4rem; height: 1.4rem; border-radius: 50%; border: 1px solid #555; background: var(--sw); }

/* Tables */
.wp-block-table table { border-collapse: collapse; width: 100%; }
.wp-block-table th { background: var(--wp--preset--color--yellow); color: var(--wp--preset--color--base); text-transform: uppercase; font-size: 0.85rem; letter-spacing: 0.04em; }
.wp-block-table td, .wp-block-table th { border: 1px solid var(--wp--preset--color--line); padding: 0.7rem 0.9rem; text-align: left; }
.wp-block-table tbody tr:nth-child(even) { background: var(--wp--preset--color--surface); }

/* Placeholder blocks (things still to fill in) */
.rb-placeholder {
	border: 2px dashed var(--wp--preset--color--yellow-dark);
	border-radius: 8px;
	padding: var(--wp--preset--spacing--40);
	color: var(--wp--preset--color--muted);
}

/* Map */
.rb-map iframe { width: 100%; height: 420px; border: 0; border-radius: 8px; filter: grayscale(1) invert(0.92) contrast(0.9); }

/* Calculator */
.rb-calc { background: var(--wp--preset--color--surface-2); border: 1px solid var(--wp--preset--color--line); border-top: 4px solid var(--wp--preset--color--yellow); border-radius: 8px; padding: var(--wp--preset--spacing--40); }
.rb-calc__fields { display: grid; grid-template-columns: repeat( auto-fit, minmax( 220px, 1fr ) ); gap: 1rem; }
.rb-calc label { display: flex; flex-direction: column; gap: 0.35rem; font-weight: 600; font-size: 0.9rem; }
.rb-calc select, .rb-calc input[type=number] {
	background: var(--wp--preset--color--base); color: var(--wp--preset--color--cream);
	border: 1px solid var(--wp--preset--color--line); border-radius: 4px; padding: 0.65rem; font: inherit;
}
.rb-calc select:focus, .rb-calc input:focus { outline: 2px solid var(--wp--preset--color--yellow); outline-offset: 1px; }
.rb-calc .rb-calc__check { flex-direction: row; align-items: center; align-self: end; padding-bottom: 0.65rem; }
.rb-calc__result { margin-top: 1.5rem; }
.rb-calc__area { margin: 0 0 0.75rem; color: var(--wp--preset--color--muted); }
.rb-calc__list { list-style: none; padding: 0; margin: 0; counter-reset: step; }
.rb-calc__list li {
	display: flex; justify-content: space-between; align-items: center; gap: 1rem;
	padding: 0.85rem 0; border-top: 1px solid var(--wp--preset--color--line); counter-increment: step;
}
.rb-calc__list li > div::before { content: counter(step) ". "; color: var(--wp--preset--color--yellow); font-weight: 800; }
.rb-calc__list small { display: block; color: var(--wp--preset--color--muted); }
.rb-calc__meta { color: var(--wp--preset--color--muted); font-size: 0.9rem; }
.rb-calc__qty { font-family: var(--wp--preset--font-family--display); color: var(--wp--preset--color--yellow); font-size: 1.4rem; white-space: nowrap; }
.rb-calc__note { font-size: 0.85rem; color: var(--wp--preset--color--muted); margin-bottom: 0; }

/* Western Cape areas */
.rb-areas { list-style: none; padding: 0; display: grid; grid-template-columns: repeat( auto-fit, minmax( 180px, 1fr ) ); gap: 0.75rem; }
.rb-areas li {
	background: var(--wp--preset--color--surface-2); border: 1px solid var(--wp--preset--color--line);
	border-left: 4px solid var(--wp--preset--color--yellow); border-radius: 4px;
	padding: 0.8rem 1rem; font-weight: 800; text-transform: uppercase; letter-spacing: 0.04em; font-size: 0.9rem;
}

/* Fluent Forms — dark theme */
.fluentform .ff-el-input--label label,
.fluentform .ff-el-form-check-label { color: var(--wp--preset--color--cream) !important; font-weight: 600; }
.fluentform .ff-el-form-control {
	background: var(--wp--preset--color--base) !important; color: var(--wp--preset--color--cream) !important;
	border: 1px solid var(--wp--preset--color--line) !important; border-radius: 4px !important;
}
.fluentform .ff-el-form-control:focus { border-color: var(--wp--preset--color--yellow) !important; box-shadow: 0 0 0 2px rgba(246,194,28,0.25) !important; }
.fluentform .ff-el-form-control::placeholder { color: var(--wp--preset--color--muted); }
.fluentform select.ff-el-form-control option { background: var(--wp--preset--color--base); }
.fluentform .ff-el-is-required.asterisk-right label::after { color: var(--wp--preset--color--yellow) !important; }
.fluentform .ff-btn-submit {
	background: var(--wp--preset--color--yellow) !important; color: var(--wp--preset--color--base) !important;
	font-weight: 800; text-transform: uppercase; letter-spacing: 0.04em; border-radius: 4px !important; padding: 0.85rem 1.6rem !important;
}
.fluentform .ff-btn-submit:hover { background: var(--wp--preset--color--cream) !important; }
.fluentform .error, .fluentform .text-danger { color: #FF6B5E !important; }
.ff-message-success {
	background: var(--wp--preset--color--surface-2) !important; color: var(--wp--preset--color--cream) !important;
	border: 1px solid var(--wp--preset--color--line) !important; border-left: 4px solid var(--wp--preset--color--yellow) !important; box-shadow: none !important;
}
.fluentform input[type=date]::-webkit-calendar-picker-indicator { filter: invert(1); }
.fluentform input[type=radio], .fluentform input[type=checkbox] { accent-color: var(--wp--preset--color--yellow); width: 1.1em; height: 1.1em; }
.fluentform .ff-el-form-check-label { font-weight: 400 !important; }
/* POPIA consent box: smaller print, set apart above the submit button. */
.fluentform .ff_gdpr_field, .fluentform .ff-el-tc { font-size: 0.85rem; }
.fluentform .ff-el-group:has(.ff_gdpr_field) {
	margin-top: 1.25rem; padding-top: 1rem; border-top: 1px solid var(--rb-hairline, var(--wp--preset--color--line));
}
.fluentform .ff-el-group:has(.ff_gdpr_field) label { color: var(--wp--preset--color--muted) !important; font-weight: 400 !important; line-height: 1.5; }
.fluentform .ff-el-group:has(.ff_gdpr_field) a { color: var(--wp--preset--color--yellow); }

/* Fluent Forms searchable dropdowns (Choices.js) */
.fluentform .choices__inner,
.fluentform .choices[data-type*=select-one] .choices__inner {
	background: var(--wp--preset--color--base) !important; color: var(--wp--preset--color--cream) !important;
	border: 1px solid var(--wp--preset--color--line) !important; border-radius: 4px !important;
}
.fluentform .choices.is-focused .choices__inner, .fluentform .choices.is-open .choices__inner { border-color: var(--wp--preset--color--yellow) !important; }
.fluentform .choices__list--single .choices__item, .fluentform .choices__placeholder { color: var(--wp--preset--color--cream) !important; opacity: 1; }
.fluentform .choices__list--dropdown, .fluentform .choices__list[aria-expanded] {
	background: var(--wp--preset--color--surface-2) !important; border: 1px solid var(--wp--preset--color--yellow) !important; z-index: 20;
}
.fluentform .choices__list--dropdown .choices__item,
.fluentform .choices__list[aria-expanded] .choices__item { color: var(--wp--preset--color--cream) !important; }
.fluentform .choices__list--dropdown .choices__item--selectable.is-highlighted,
.fluentform .choices__list[aria-expanded] .choices__item--selectable.is-highlighted {
	background: var(--wp--preset--color--yellow) !important; color: var(--wp--preset--color--base) !important;
}
.fluentform .choices__input, .fluentform .choices__list--dropdown .choices__input {
	background: var(--wp--preset--color--base) !important; color: var(--wp--preset--color--cream) !important;
	border-bottom: 1px solid var(--wp--preset--color--line) !important;
}
.fluentform .choices[data-type*=select-one]::after { border-color: var(--wp--preset--color--cream) transparent transparent !important; }
.fluentform .choices[data-type*=select-one].is-open::after { border-color: transparent transparent var(--wp--preset--color--cream) !important; }

/* Directory grids (stores, applicators) */
.rb-grid { display: grid; grid-template-columns: repeat( auto-fill, minmax( 260px, 1fr ) ); gap: 1.25rem; margin-block: 1.5rem; }
.rb-grid .rb-card h3 { margin: 0.25rem 0 0.75rem; }
.rb-grid .rb-card p { margin: 0 0 0.6rem; }
.rb-applicator--join { border-style: dashed; }

/* Stockist map (Leaflet) */
.rb-store-map { height: 420px; border-radius: 8px; border: 1px solid var(--wp--preset--color--line); margin-top: 1rem; z-index: 0; }
.rb-store-map .leaflet-tile-pane { filter: grayscale(1) invert(0.92) contrast(0.9) brightness(0.9); }
.rb-store-map .leaflet-popup-content-wrapper, .rb-store-map .leaflet-popup-tip { background: var(--wp--preset--color--surface-2); color: var(--wp--preset--color--cream); }
.rb-store-map .leaflet-popup-content a { display: inline-block; margin-top: 0.35rem; color: var(--wp--preset--color--yellow); }
.rb-store-map .leaflet-control-attribution { background: rgba(0,0,0,0.6); color: var(--wp--preset--color--muted); }
.rb-store-map .leaflet-control-attribution a { color: var(--wp--preset--color--cream); }

/* Newsletter (Noptin) */
.rb-newsletter { padding-bottom: var(--wp--preset--spacing--50); margin-bottom: var(--wp--preset--spacing--50); border-bottom: 1px solid var(--wp--preset--color--line); gap: 1rem 2rem; }
.rb-newsletter h3 { margin: 0 0 0.25rem; }
.rb-newsletter .rb-small { margin: 0; }
.rb-newsletter .noptin-newsletter-form { flex: 1 1 320px; max-width: 480px; margin: 0; background: none !important; padding: 0 !important; border: 0 !important; }
.rb-newsletter .noptin-form-fields { display: flex; gap: 0.5rem; }
.rb-newsletter .noptin-form-field-email { flex: 1; }
.rb-newsletter .noptin-text {
	width: 100%; background: var(--wp--preset--color--base) !important; color: var(--wp--preset--color--cream) !important;
	border: 1px solid var(--wp--preset--color--line) !important; border-radius: 4px !important; padding: 0.8rem !important; font: inherit;
}
.rb-newsletter .noptin-text:focus { outline: 2px solid var(--wp--preset--color--yellow); outline-offset: 1px; }
.rb-newsletter .noptin-form-submit {
	background: var(--wp--preset--color--yellow) !important; color: var(--wp--preset--color--base) !important; border: 0 !important;
	border-radius: 4px !important; font-weight: 800; text-transform: uppercase; letter-spacing: 0.04em; padding: 0.8rem 1.4rem !important; cursor: pointer;
}
.rb-newsletter .noptin-form-submit:hover { background: var(--wp--preset--color--cream) !important; }
.rb-newsletter .noptin-response { color: var(--wp--preset--color--cream); margin-top: 0.5rem; }
@media ( max-width: 480px ) { .rb-newsletter .noptin-form-fields { flex-direction: column; } }

/* WooCommerce (catalogue) */
.woocommerce-page main, .single-product main { padding-block: var(--wp--preset--spacing--50); }
.wc-block-components-product-price:empty, .wp-block-woocommerce-product-price:empty { display: none; }
.wp-block-woocommerce-product-image img, .wc-block-components-product-image img,
.woocommerce-product-gallery img { background: var(--wp--preset--color--surface-2); border-radius: 8px; }
.wp-block-post-title a, .wc-block-product .wp-block-post-title a { color: var(--wp--preset--color--cream); text-decoration: none; }
.wp-block-post-title a:hover { color: var(--wp--preset--color--yellow); }
.woocommerce-tabs .tabs, .wc-tabs { border-color: var(--wp--preset--color--line) !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li,
.wp-block-woocommerce-product-details ul.tabs li { background: var(--wp--preset--color--surface) !important; border-color: var(--wp--preset--color--line) !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active,
.wp-block-woocommerce-product-details ul.tabs li.active { background: var(--wp--preset--color--surface-2) !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a, .wp-block-woocommerce-product-details ul.tabs li a { color: var(--wp--preset--color--cream) !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li::before, .woocommerce div.product .woocommerce-tabs ul.tabs li::after { display: none !important; }
.woocommerce table.shop_attributes th, .woocommerce table.shop_attributes td { border-color: var(--wp--preset--color--line) !important; background: none !important; color: var(--wp--preset--color--cream); padding: 0.6rem 0.9rem !important; font-style: normal !important; }
.woocommerce table.shop_attributes tr:nth-child(even) th, .woocommerce table.shop_attributes tr:nth-child(even) td { background: var(--wp--preset--color--surface) !important; }
.wp-block-breadcrumbs, .woocommerce-breadcrumb { color: var(--wp--preset--color--muted); font-size: 0.85rem; }
.rb-product-buttons { margin-top: 1.5rem; }

/* Product cards: lift + raking-light glint across the picture on hover (as on Jardines Galleries). */
.wc-block-product {
	transition: transform 0.3s cubic-bezier( 0.22, 0.61, 0.36, 1 ), box-shadow 0.3s ease;
	border-radius: 8px;
}
.wc-block-product:hover, .wc-block-product:focus-within {
	transform: translateY( -6px );
	box-shadow: 0 3px 8px rgba(0,0,0,0.4), 0 26px 56px rgba(0,0,0,0.55);
}
.wc-block-product .wc-block-components-product-image,
.woocommerce-product-gallery__image {
	position: relative;
	overflow: hidden;
	border-radius: 8px;
}
.wc-block-product .wc-block-components-product-image::after,
.woocommerce-product-gallery__image::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background: linear-gradient( 115deg, transparent 30%, rgba(255,255,255,0.18) 42%, rgba(255,240,190,0.45) 50%, rgba(255,255,255,0.18) 58%, transparent 70% );
	transform: translateX( -120% );
	transition: none;
}
.wc-block-product:hover .wc-block-components-product-image::after,
.wc-block-product:focus-within .wc-block-components-product-image::after,
.woocommerce-product-gallery__image:hover::after {
	transform: translateX( 120% );
	transition: transform 800ms cubic-bezier( 0.22, 0.61, 0.36, 1 );
}
@media ( prefers-reduced-motion: reduce ) {
	.wc-block-product, .wc-block-product:hover { transform: none; }
	.wc-block-product .wc-block-components-product-image::after, .woocommerce-product-gallery__image::after { display: none; }
}
.woocommerce-ordering select, .wc-block-components-sort-select select {
	background: var(--wp--preset--color--surface-2); color: var(--wp--preset--color--cream);
	border: 1px solid var(--wp--preset--color--line); border-radius: 4px; padding: 0.4rem 0.6rem; font: inherit; font-size: 0.9rem;
}
.wc-block-components-product-button a.wp-block-button__link { border-radius: 4px; }

/* Social icons (WP Admin → Social Media) */
.rb-social { list-style: none; padding: 0; margin: 0.75rem 0 0; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.rb-social a {
	display: grid; place-items: center; width: 2.4rem; height: 2.4rem; border-radius: 50%;
	color: var(--wp--preset--color--cream); border: 1px solid var(--wp--preset--color--line);
	background: var(--wp--preset--color--surface-2);
	transition: color 0.2s ease, border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}
.rb-social a:hover, .rb-social a:focus-visible {
	color: var(--wp--preset--color--base); background: var(--wp--preset--color--yellow); border-color: var(--wp--preset--color--yellow);
	transform: translateY(-2px); box-shadow: 0 0 12px rgba(246, 194, 28, 0.35);
}
.rb-social svg { width: 1.05rem; height: 1.05rem; fill: currentColor; }
.rb-share { display: flex; align-items: center; gap: 0.75rem; margin-top: 1.5rem; padding-top: 1rem; border-top: 1px solid var(--rb-hairline, var(--wp--preset--color--line)); }
.rb-share__label { font-weight: 800; text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.8rem; color: var(--wp--preset--color--muted); }
.rb-share .rb-social { margin: 0; }

/* Home-page social feed (Smash Balloon) */
.rb-feed { background: radial-gradient( 60% 80% at 50% 0%, rgba(246, 194, 28, 0.07), transparent 60% ); border-top: 1px solid var(--rb-hairline, var(--wp--preset--color--line)); }
.rb-feed[hidden] { display: none !important; }
.rb-feed__inner { max-width: 1200px; margin: 0 auto; padding-inline: 1rem; text-align: center; }
.rb-feed__embed { margin: 1.5rem 0; text-align: left; }
.rb-feed .wp-block-buttons { justify-content: center; }
.rb-feed__embed #sb_instagram, .rb-feed__embed .cff-wrapper, .rb-feed__embed .sbtt-feed, .rb-feed__embed .sb_youtube { background: transparent !important; }
.rb-feed__embed .sbi_header_text h3, .rb-feed__embed .cff-header-text, .rb-feed__embed .cff-text { color: var(--wp--preset--color--cream) !important; }

/* Floating WhatsApp button */
.rb-wa-float {
	position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 60;
	display: flex; align-items: center; gap: 0.55rem; padding: 0.75rem 1.1rem 0.75rem 0.85rem;
	border-radius: 999px; background: #25D366; color: #08260F; font-weight: 800; font-size: 0.9rem; text-decoration: none;
	box-shadow: 0 6px 22px rgba(0, 0, 0, 0.45); transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.rb-wa-float:hover { transform: translateY(-3px); box-shadow: 0 10px 28px rgba(0, 0, 0, 0.55); color: #08260F; }
.rb-wa-float svg { width: 1.5rem; height: 1.5rem; fill: currentColor; }
@media ( max-width: 600px ) { .rb-wa-float span { display: none; } .rb-wa-float { padding: 0.85rem; } }

/* Footer */
.rb-footer { border-top: 1px solid var(--wp--preset--color--line); }
.rb-footer a { color: var(--wp--preset--color--cream); text-decoration: none; }
.rb-footer a:hover { color: var(--wp--preset--color--yellow); }
.rb-footer .wp-block-list { list-style: none; padding: 0; }
.rb-small { font-size: 0.85rem; color: var(--wp--preset--color--muted); }