/*
Theme Name: Electro Child
Theme URI: https://budgetaudiophile.com
Description: Child theme for Electro — safe customizations (CSS, template overrides, functions). Managed by Media Express.
Author: Media Express LLC
Template: electro
Version: 1.0.0
*/

/* ===== Custom CSS below (survives Electro updates) ===== */

/* ---- TEST: 1:1 white-bg square gallery for Onkyo TX-RZ50 (postid=93) ----
   Container gets aspect-ratio 1/1 (not the img). Img fills container with
   object-fit: contain so portrait/landscape imgs both render inside a square
   letterbox on white. If Arek approves visual on RZ50 we scale globally. */
/* Viewport (parent of all FlexSlider slides) gets aspect-ratio 1/1.
   All child slides + images fill 100% height, letting FlexSlider translateX
   between them without touching display: none/block. */
body.single-product .woocommerce-product-gallery .flex-viewport {
    aspect-ratio: 1 / 1 !important;
    height: auto !important;
    background: #ffffff !important;
    overflow: hidden !important;
    border: 1px solid #eee;
    border-radius: 4px;
}
body.single-product .woocommerce-product-gallery__wrapper {
    height: 100% !important;
}
body.single-product .woocommerce-product-gallery__image {
    height: 100% !important;
    background: #ffffff;
}
body.single-product .woocommerce-product-gallery__image > a {
    display: block;
    width: 100%;
    height: 100%;
}
body.single-product .woocommerce-product-gallery__image img:not(.zoomImg) {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    background: #ffffff !important;
    padding: 12px !important;
    box-sizing: border-box !important;
    aspect-ratio: auto !important;
}
/* Small thumbs BELOW main gallery (Electro's secondary thumb carousel).
   These are img.attachment-shop_thumbnail — Amazon-scraped photos come in
   varied aspect ratios so force each thumb into a 70×70 white square. */
body.single-product .electro-wc-product-gallery img.attachment-shop_thumbnail,
body.single-product .electro-wc-product-gallery img[class*="shop_thumbnail"] {
    width: 70px !important;
    height: 70px !important;
    aspect-ratio: 1 / 1 !important;
    object-fit: contain !important;
    background: #ffffff !important;
    padding: 4px !important;
    box-sizing: border-box !important;
    border: 1px solid #eee;
    border-radius: 3px;
    display: block !important;
}
/* NOTE: intentionally NOT touching .flex-control-nav li — those are the tiny
   pagination dots ("kreseczki") — they must stay as-is. Any aspect-ratio here
   makes them look broken. */

/* ---- Product CTA buttons stacked vertically (global) ----
   Amazon, AliExpress, Abt secondary CTAs always render one-below-the-other
   with the primary WC "Buy on X" button, full-width, consistent spacing. */
.ba-cta-extras {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    margin-top: 10px !important;
    width: 100% !important;
}
.ba-cta-extras > a,
.ba-cta-extras > .ba-amazon-secondary,
.ba-cta-extras > .ba-ali-secondary,
.ba-cta-extras > .ba-abt-secondary,
.ba-cta-extras > .ba-coupon {
    width: 100% !important;
    display: block !important;
    text-align: center !important;
    margin: 0 !important;
    float: none !important;
}
/* Also apply to primary WC add-to-cart / external-buy button on product page */
body.single-product .single_add_to_cart_button {
    width: 100% !important;
    display: block !important;
    text-align: center !important;
    margin-bottom: 0 !important;
    float: none !important;
}

/* ---- SHOP GRID / HOMEPAGE TILES: 1:1 white background ----
   WooCommerce ships cropped 300×300 thumbnails already, but with no white
   letterbox — irregular product photos look inconsistent. Add white bg +
   padding + border so every tile reads as "product-on-white". Also covers
   homepage sliders + widget product lists. */
.woocommerce ul.products li.product img.attachment-woocommerce_thumbnail,
.woocommerce ul.products li.product .product-thumbnail img,
.woocommerce ul.products li.product .product-item__thumbnail img,
.products li.product img.attachment-woocommerce_thumbnail,
.products li.product .product-thumbnail img,
.products li.product .product-item__thumbnail img,
.related.products img.attachment-woocommerce_thumbnail,
.upsells.products img.attachment-woocommerce_thumbnail,
.cross-sells img.attachment-woocommerce_thumbnail,
.widget_products .product_list_widget img,
.widget-product-thumbnails img {
    aspect-ratio: 1 / 1 !important;
    object-fit: contain !important;
    background: #ffffff !important;
    padding: 8px !important;
    box-sizing: border-box !important;
    border: 1px solid #eee !important;
    border-radius: 4px !important;
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    display: block !important;
}


/* Sticky header — desktop nav follows the scroll (Electro marks header .stick-this). */
@media (min-width: 992px) {
	#masthead.stick-this {
		position: -webkit-sticky;
		position: sticky;
		top: 0;
		z-index: 1000;
		background: #0a1533;
		box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
	}
	.admin-bar #masthead.stick-this { top: 32px; }
}
/* Mobile: keep the handheld header pinned too. */
@media (max-width: 991.98px) {
	.handheld-header-v2.handheld-stick-this {
		position: -webkit-sticky;
		position: sticky;
		top: 0;
		z-index: 1000;
		background: #0a1533;
		box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
	}
	.admin-bar .handheld-header-v2.handheld-stick-this { top: 46px; }
}

/* Shop / homepage left sidebar — breathing room so widgets don't touch the department (yellow) bar. */
.woocommerce-shop .sidebar,
.post-type-archive-product .sidebar { margin-top: 1.75rem; }

/* Small breathing room above the homepage/shop SEO intro. */
.woocommerce-shop .page-description,
.home .page-description { margin-top: 1.25rem; }

/* (Product-grid button reverted to native Electro dark styling — no overrides.) */

/* Dark header (logo + top bar + nav) to match electro-dark — was white. */
#masthead,
#masthead .masthead,
.site-header .top-bar,
.header-v2 .top-bar,
.header-v2 { background-color: #0a1533 !important; }
.top-bar, .top-bar a, .top-bar span, #masthead .primary-nav-menu > ul > li > a { color: #e4e4e8 !important; }
.top-bar a:hover, #masthead .primary-nav-menu > ul > li > a:hover { color: #fff !important; }

/* Dark dropdown menus to match the electro-dark theme (were white). */
.dropdown-menu,
.dropdown-menu.yamm,
.primary-nav-menu .dropdown-menu,
.departments-menu-v2 .dropdown-menu {
	background-color: #0a1533 !important;
	border-color: rgba(255, 255, 255, 0.10) !important;
	box-shadow: 0 10px 28px rgba(0, 0, 0, 0.40) !important;
}
.dropdown-menu a,
.dropdown-menu li > a,
.dropdown-menu .menu-item > a,
.dropdown-menu .yamm-content a { color: #d7d7db !important; }
.dropdown-menu a:hover,
.dropdown-menu li > a:hover,
.dropdown-menu .menu-item > a:hover { background-color: rgba(255, 255, 255, 0.06) !important; color: #fff !important; }
.dropdown-menu .dropdown-header,
.dropdown-menu .nav-header,
.dropdown-menu .yamm-content h2 { color: #9a9aa2 !important; }
.dropdown-menu .divider,
.dropdown-menu hr { border-color: rgba(255, 255, 255, 0.08) !important; }

/* =========================================================================
   ROYAL GOLD + DARK NAVY — global luxury palette (2026-07-27)
   Repaints Electro by overriding its own CSS variables + dark chrome to navy.
   ========================================================================= */
:root, body, body.electro-dark {
	--bs-ec-primary: #d4af37 !important;      /* royal gold — repaints yellow accents */
	--bs-ec-primary-rgb: 212, 175, 55 !important;
	--bs-ec-dark: #0b1533 !important;         /* deep navy for dark accents */
}
/* Deep navy page background (electro-dark keeps text light, so this is safe). */
body.electro-dark { background-color: #070f22 !important; }
body.electro-dark .site,
body.electro-dark #page,
body.electro-dark #content,
body.electro-dark .site-content,
body.electro-dark .col-full { background-color: transparent !important; }
/* Navy chrome: breadcrumb, footer. */
.woocommerce-breadcrumb, .breadcrumb-wrap, .breadcrumb { background-color: #0a1533 !important; }
.site-footer, #colophon, .footer-v2, .footer-widgets, .footer-bottom-widgets { background-color: #081026 !important; }
/* Royal-gold price + accents. */
.price .amount, .electro-price .amount, .woocommerce-Price-amount.amount { color: #e8c766 !important; }
/* Gold department/vertical menu title bar text stays legible on navy. */
.departments-menu-v2 .departments-menu-title, .vertical-menu-title { color: #0b1533 !important; }

/* =========================================================================
   MORE PREMIUM — real metallic royal gold (2026-07-27, v1.0.21)
   ========================================================================= */
/* Metallic gold text gradient on all accent headings (about/community/contact). */
.bau-grad, .bac-grad, .bacx-grad {
	background: linear-gradient(100deg,#9e7b16,#fbf3b0 40%,#e6c766 52%,#fdf6bd 62%,#a9801d) !important;
	-webkit-background-clip: text !important; background-clip: text !important;
	-webkit-text-fill-color: transparent !important;
	filter: drop-shadow(0 1px 6px rgba(212,175,55,.25));
}
/* Metallic gold stat / credential numbers. */
.bau-cred-n, .bac-stat-num {
	background: linear-gradient(180deg,#f7e79b,#d4af37 55%,#a9801d) !important;
	-webkit-background-clip: text !important; background-clip: text !important;
	-webkit-text-fill-color: transparent !important;
}
/* Metallic gold buttons with sheen (custom pages + contact form submit only —
   the product-grid button stays native Electro). */
.bau-btn-primary, .bac-btn-primary, .bacx-formcard .wpcf7-submit {
	background: linear-gradient(135deg,#a97d0c,#f9ee8c 42%,#d9b845 58%,#8f6f15) !important;
	color: #20180a !important; border: none !important;
	box-shadow: 0 10px 26px rgba(212,175,55,.35), inset 0 1px 0 rgba(255,255,255,.55), inset 0 -2px 6px rgba(120,90,10,.4) !important;
	text-shadow: 0 1px 0 rgba(255,255,255,.25);
}
.bau-btn-primary:hover, .bac-btn-primary:hover, .bacx-formcard .wpcf7-submit:hover { filter: brightness(1.07); transform: translateY(-2px); }
/* Gold-tinted premium borders on every card / panel. */
.bau-two-card, .bau-quote, .bau-cred, .bau-connect,
.bac-card, .bac-stat, .bac-creator, .bac-rules,
.bacx-formcard, .bacx-method, .bacx-faq details { border-color: rgba(212,175,55,.26) !important; }
/* Richer navy with depth (radial vignette, fixed). */
body.electro-dark {
	background: radial-gradient(1100px 560px at 50% -8%,#16295c 0%,#0a1636 42%,#060d20 100%) !important;
	background-attachment: fixed !important;
}
/* Hero / CTA bands: royal navy gradient + gold hairline ring for that "framed" luxury look. */
.bau-hero, .bac-hero, .bau-cta, .bac-final {
	background: linear-gradient(150deg,#0a1740,#122a63 55%,#1a2f6b) !important;
	box-shadow: 0 20px 60px rgba(0,0,0,.5), inset 0 0 0 1px rgba(212,175,55,.38), inset 0 1px 0 rgba(255,255,255,.06) !important;
}
/* Warmer gold glow behind hero glyphs. */
.bau-glow, .bac-hero-glow { background: radial-gradient(60% 90% at 50% -10%, rgba(212,175,55,.32), transparent 62%) !important; }
/* Gold accent everywhere the pages used bright gold. */
.bau-badge, .bac-badge, .bacx-badge { border-color: rgba(212,175,55,.45) !important; color: #f0d888 !important; background: rgba(212,175,55,.12) !important; }

/* Shop / homepage royal hero (CSS lives here because WooCommerce runs the shop
   description through wp_kses_post, which strips inline <style> tags). */
.bah{position:relative;overflow:hidden;border-radius:22px;padding:2.6rem 1.8rem 2.4rem;margin:0 0 1.8rem;background:linear-gradient(150deg,#0a1740,#122a63 55%,#1a2f6b);box-shadow:0 22px 64px rgba(0,0,0,.5),inset 0 0 0 1px rgba(212,175,55,.45),inset 0 1px 0 rgba(255,255,255,.06)}
.bah-glow{position:absolute;inset:0;background:radial-gradient(65% 95% at 50% -12%,rgba(212,175,55,.3),transparent 62%);pointer-events:none}
.bah-in{position:relative;z-index:1;text-align:center;max-width:900px;margin:0 auto}
.bah-badge{display:inline-block;font-size:.78rem;font-weight:700;letter-spacing:.06em;color:#f0d888;background:rgba(212,175,55,.12);border:1px solid rgba(212,175,55,.45);padding:.34rem .95rem;border-radius:999px;margin-bottom:1rem}
.bah-h1{color:#fff;font-size:clamp(1.25rem,2.6vw,1.75rem);font-weight:800;line-height:1.25;margin:0 0 .8rem}
.bah-grad{background:linear-gradient(100deg,#9e7b16,#fbf3b0 40%,#e6c766 52%,#fdf6bd 62%,#a9801d);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 1px 6px rgba(212,175,55,.3))}
.bah-lead{color:#cfd2de;font-size:.95rem;line-height:1.65;margin:0 auto 1.3rem;max-width:780px}
.bah-lead strong{color:#fff}
.bah-chips{display:flex !important;flex-wrap:wrap;gap:.55rem;justify-content:center}
.bah-chips span{display:inline-block;margin:.28rem;font-size:.85rem;font-weight:600;color:#e9dcae;background:rgba(255,255,255,.05);border:1px solid rgba(212,175,55,.35);padding:.42rem .9rem;border-radius:999px;white-space:nowrap}
@media (max-width: 575.98px){
	.bah{padding:1.4rem 1rem 1.3rem;border-radius:16px}
	.bah-h1{font-size:.92rem;line-height:1.3}
	.bah-lead{font-size:.8rem;line-height:1.55}
	.bah-badge{font-size:.66rem}
	.bah-chips span{font-size:.68rem;padding:.28rem .6rem;margin:.18rem}
}

/* Reusable premium SEO intro for product-category archives (CSS here; category
   descriptions run through wp_kses_post so they can only hold HTML, not <style>). */
.ba-catintro{margin:0 0 2rem;padding:1.6rem 1.8rem;border-radius:18px;background:linear-gradient(150deg,rgba(255,255,255,.05),rgba(255,255,255,.015));border:1px solid rgba(212,175,55,.28);box-shadow:0 12px 34px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.05)}
.ba-catintro-lead{font-size:1.1rem;color:#f0d888;font-weight:600;line-height:1.6;margin:0 0 1rem}
.ba-catintro p{color:#c4c4cf;line-height:1.75;margin:0 0 1rem}
.ba-catintro p:last-child{margin-bottom:0}
.ba-catintro p strong,.ba-catintro li strong{color:#fff}
.ba-catintro h2{color:#fff;font-size:1.25rem;font-weight:800;margin:1.2rem 0 .7rem}
.ba-catintro ul{list-style:none;padding:0;margin:0 0 1rem;display:grid;gap:.6rem}
.ba-catintro li{position:relative;padding-left:1.6rem;color:#c8c8d3;line-height:1.55}
.ba-catintro li::before{content:"\25B8";position:absolute;left:.2rem;color:#d4af37;font-weight:800}
.ba-catintro a{color:#f0d888;font-weight:700;text-decoration:none}
.ba-catintro a:hover{text-decoration:underline}

/* Uniform content width — custom pages fill the same theme column as the homepage/deals
   (they were capped at 1100px, narrower than the full content column). */
.bau, .bac, .bacx { max-width: 100% !important; }

/* Contact form fields — bold gold frames (force over CF7/Electro input styling). */
.bacx-formcard .wpcf7-form-control,
.bacx-formcard input[type=text],
.bacx-formcard input[type=email],
.bacx-formcard input[type=tel],
.bacx-formcard textarea,
.bacx-formcard select {
	border: 2px solid #d4af37 !important;
	box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
	background: rgba(9,17,40,.6) !important;   /* dark navy field, matches the theme */
	color: #eef0f6 !important;
	border-radius: 10px !important;
}
.bacx-formcard .wpcf7-form-control::placeholder,
.bacx-formcard input::placeholder,
.bacx-formcard textarea::placeholder { color: #9aa2b8 !important; opacity: 1; }
.bacx-formcard .wpcf7-form-control:focus,
.bacx-formcard input:focus,
.bacx-formcard textarea:focus {
	border-color: #f5c451 !important;
	box-shadow: 0 0 0 3px rgba(245,196,81,.35) !important;
}
/* Restore the beautiful gold submit button (the field rule above also matches it). */
.bacx-formcard input.wpcf7-submit,
.bacx-formcard .wpcf7-submit {
	background: linear-gradient(135deg,#a97d0c,#f9ee8c 42%,#d9b845 58%,#8f6f15) !important;
	color: #20180a !important;
	border: none !important;
	border-radius: 10px !important;
	box-shadow: 0 10px 26px rgba(212,175,55,.35), inset 0 1px 0 rgba(255,255,255,.55), inset 0 -2px 6px rgba(120,90,10,.4) !important;
	text-shadow: 0 1px 0 rgba(255,255,255,.25);
}
.bacx-formcard input.wpcf7-submit:hover { filter: brightness(1.07); transform: translateY(-2px); }

/* ===== Mobile nav: gold icons (were invisible on navy) + logo flush left ===== */
@media (max-width: 991.98px) {
	.handheld-header-v2 .ec,
	.handheld-header-v2 .navbar-toggler,
	.handheld-header-v2 .navbar-toggler .ec,
	.handheld-header-v2 .handheld-header-links a,
	.handheld-header-v2 .handheld-header-links .ec,
	.handheld-header-bar .ec,
	.electro-handheld-footer-bar a,
	.electro-handheld-footer-bar .ec { color: #f5c451 !important; }
	/* Logo hard against the left edge. */
	.handheld-header-v2 { padding-left: .4rem !important; }
	.handheld-header-v2 .header-logo,
	.handheld-header-v2 .site-branding { margin-left: 0 !important; margin-right: auto !important; text-align: left !important; }
	.handheld-header-v2 .header-logo-link { display: inline-flex !important; justify-content: flex-start !important; margin-left: 0 !important; }
	.handheld-header-v2 .header-logo img, .handheld-header-v2 .img-header-logo { max-height: 42px !important; width: auto !important; }
	/* Hide Electro's category off-canvas — we use our own top-menu drawer (functions.php). */
	.handheld-header-v2 .off-canvas-navigation-wrapper { display: none !important; }
	#ba-burger { display: inline-flex !important; }
	/* Remove the mobile search (magnifier) + account icons (unscoped — this media query is mobile-only). */
	.navbar-search,
	.site-search,
	.handheld-header-links .site-search,
	.header-search,
	.header-icon__user-account,
	.my-account,
	.handheld-header-v2 .ec-search,
	.handheld-header-v2 .ec-user { display: none !important; }
}

/* ===== Custom mobile drawer (top menu) — hidden on desktop ===== */
#ba-burger, #ba-drawer, #ba-overlay { display: none; }
#ba-burger { align-items: center; justify-content: center; position: fixed; top: 10px; right: 12px; z-index: 100000; width: 44px; height: 44px; padding: 0; border: 1px solid rgba(212,175,55,.4); border-radius: 11px; background: rgba(212,175,55,.14); color: #f5c451; font-size: 1.5rem; line-height: 1; cursor: pointer; }
@media (max-width: 991.98px) {
	#ba-drawer { display: block; position: fixed; top: 0; right: -340px; width: 300px; max-width: 86vw; height: 100%; z-index: 100002; background: linear-gradient(160deg,#0a1740,#070f22); border-left: 1px solid rgba(212,175,55,.4); box-shadow: -18px 0 50px rgba(0,0,0,.55); padding: 3.6rem 1.1rem 1.5rem; overflow-y: auto; transition: right .28s ease; }
	#ba-drawer.open { right: 0; }
	#ba-overlay { display: block; position: fixed; inset: 0; z-index: 100001; background: rgba(0,0,0,.55); opacity: 0; visibility: hidden; transition: opacity .28s ease, visibility .28s ease; }
	#ba-overlay.open { opacity: 1; visibility: visible; }
}
#ba-drawer-close { position: absolute; top: 10px; right: 14px; background: none; border: none; color: #f5c451; font-size: 2rem; line-height: 1; cursor: pointer; }
#ba-drawer .ba-drawer-menu { list-style: none; margin: 0; padding: 0; }
#ba-drawer .ba-drawer-menu li { border-bottom: 1px solid rgba(255,255,255,.08); }
#ba-drawer .ba-drawer-menu a { display: block; padding: .95rem .4rem; color: #eef0f6; text-decoration: none; font-weight: 600; font-size: 1.06rem; }
#ba-drawer .ba-drawer-menu a:hover, #ba-drawer .ba-drawer-menu .current-menu-item > a { color: #f5c451; }

/* Footer newsletter form (FluentCRM). */
.footer-newsletter .row{align-items:center}
.ba-newsletter{margin:0}
.ba-newsletter .ba-nl-row{display:flex;gap:.5rem;flex-wrap:wrap}
.ba-newsletter .ba-nl-input{flex:1 1 200px;min-width:0;padding:.7rem .9rem;border:2px solid rgba(212,175,55,.55);border-radius:10px;background:rgba(9,17,40,.6);color:#eef0f6;font-size:.95rem}
.ba-newsletter .ba-nl-input::placeholder{color:#9aa2b8}
.ba-newsletter .ba-nl-input:focus{outline:none;border-color:#f5c451;box-shadow:0 0 0 3px rgba(245,196,81,.3)}
.ba-newsletter .ba-nl-btn{flex:0 0 auto;padding:.7rem 1.4rem;border:none;border-radius:10px;background:linear-gradient(135deg,#a97d0c,#f9ee8c 42%,#d9b845 58%,#8f6f15);color:#20180a;font-weight:800;font-size:.95rem;cursor:pointer;box-shadow:0 8px 22px rgba(212,175,55,.3)}
.ba-newsletter .ba-nl-btn:hover{filter:brightness(1.07)}
.ba-newsletter .ba-nl-btn:disabled{opacity:.6;cursor:default}
.ba-newsletter .ba-nl-msg{margin-top:.5rem;font-size:.88rem;color:#f0d888;min-height:1em}

/* ===== Editor's Take featured review block ===== */
.ba-editor{margin:1.8rem 0;padding:1.7rem 1.8rem;border-radius:18px;background:linear-gradient(150deg,#0a1740,#122a63);border:1px solid rgba(212,175,55,.42);box-shadow:0 18px 48px rgba(0,0,0,.45),inset 0 0 0 1px rgba(212,175,55,.14),inset 0 1px 0 rgba(255,255,255,.06)}
.ba-editor-head{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem;margin-bottom:.5rem}
.ba-editor-stars{color:#f5c451;font-size:1.25rem;letter-spacing:2px;text-shadow:0 2px 10px rgba(212,175,55,.4)}
.ba-editor-badge{font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#f0d888;border:1px solid rgba(212,175,55,.45);border-radius:999px;padding:.25rem .7rem}
.ba-editor h3{color:#fff;font-size:clamp(1.35rem,3.2vw,1.9rem);font-weight:900;margin:.4rem 0 .9rem;line-height:1.2}
.ba-editor h3 .g{background:linear-gradient(100deg,#9e7b16,#fbf3b0 45%,#e6c766 60%,#a9801d);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.ba-editor p{color:#d3d6e2;line-height:1.75;margin:0 0 .95rem}
.ba-editor p strong{color:#fff}
.ba-editor .ba-editor-verdict{border-top:1px solid rgba(212,175,55,.25);padding-top:1rem;margin-top:.4rem}
.ba-editor ul{list-style:none;padding:0;margin:.2rem 0 1rem;display:grid;gap:.55rem}
.ba-editor li{position:relative;padding-left:1.8rem;color:#e4e6f0;line-height:1.55}
.ba-editor li::before{content:"\2665";position:absolute;left:.15rem;color:#ff6f61}
.ba-warn{display:flex;gap:1rem;align-items:flex-start;margin:1.1rem 0;padding:1rem 1.2rem;border-radius:12px;background:linear-gradient(135deg,rgba(224,74,58,.18),rgba(224,74,58,.05));border:1px solid rgba(224,74,58,.55)}
.ba-warn-ico{font-size:1.6rem;line-height:1;flex:0 0 auto}
.ba-warn b{color:#ff9a8a}
.ba-warn p{margin:0;color:#f0d7d3;line-height:1.6}

/* ===== Homepage SEO content block (below the shop tiles) — full-bleed band ===== */
.bah-seo{position:relative;left:50%;right:50%;margin-left:-50vw;margin-right:-50vw;width:100vw;max-width:100vw;box-sizing:border-box;margin-top:2.5rem;padding:2.6rem 1rem;background:linear-gradient(180deg,rgba(212,175,55,.05),transparent 70%);border-top:1px solid rgba(212,175,55,.22)}
.bah-seo > *{max-width:1280px;margin-left:auto;margin-right:auto}
.bah-seo .ba-faq{max-width:1280px}
.bah-seo h2{position:relative;font-weight:800;font-size:clamp(1.3rem,3vw,1.8rem);margin:1.8rem 0 .8rem;padding-left:.9rem}
.bah-seo h2::before{content:"";position:absolute;left:0;top:.15em;bottom:.15em;width:5px;border-radius:4px;background:linear-gradient(180deg,#f7e79b,#d4af37,#a9801d)}
.bah-seo h3{font-weight:800;font-size:1.2rem;margin:1.6rem 0 .8rem}
.bah-seo p{line-height:1.75;margin:0 0 1rem;font-size:1.02rem}
.bah-seo p strong{color:inherit;font-weight:700}
.bah-seo ul{list-style:none;padding:0;display:grid;gap:.6rem;margin:.4rem 0 1.2rem}
.bah-seo li{position:relative;padding-left:1.7rem;line-height:1.6}
.bah-seo li::before{content:"\25B8";position:absolute;left:.2rem;color:#d4af37;font-weight:800}
.bah-seo a{color:#d4af37;font-weight:700;text-decoration:none}
.bah-seo a:hover{text-decoration:underline}

/* ===== Review post premium decorations ===== */
.ba-review h2{position:relative;font-weight:800;margin:2.1rem 0 .9rem;padding-left:.9rem}
.ba-review h2::before{content:"";position:absolute;left:0;top:.15em;bottom:.15em;width:5px;border-radius:4px;background:linear-gradient(180deg,#f7e79b,#d4af37,#a9801d);box-shadow:0 0 14px rgba(212,175,55,.5)}
.ba-review ul{list-style:none;padding:0;display:grid;gap:.5rem;margin:.4rem 0 1.2rem}
.ba-review ul li{position:relative;padding-left:1.6rem}
.ba-review ul li::before{content:"\25B8";position:absolute;left:.2rem;color:#d4af37;font-weight:800}
.ba-chips2{display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 1.7rem}
.ba-chips2 span{font-size:.82rem;font-weight:600;color:#e9dcae;background:rgba(212,175,55,.1);border:1px solid rgba(212,175,55,.35);padding:.4rem .8rem;border-radius:999px}
.ba-spectiles{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem;margin:.5rem 0 1.8rem}
.ba-spectiles div{text-align:center;padding:1rem .5rem;border-radius:14px;background:linear-gradient(180deg,rgba(212,175,55,.1),rgba(212,175,55,.02));border:1px solid rgba(212,175,55,.24)}
.ba-spectiles b{display:block;font-size:1.1rem;font-weight:900;background:linear-gradient(180deg,#f7e79b,#d4af37 55%,#a9801d);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;line-height:1.1}
.ba-spectiles small{display:block;color:#a9a9b6;font-size:.76rem;margin-top:.35rem}
.ba-pullquote{position:relative;margin:1.8rem 0;padding:1.5rem 1.7rem 1.5rem 3rem;border-radius:16px;background:linear-gradient(160deg,rgba(212,175,55,.12),rgba(212,175,55,.03));border:1px solid rgba(212,175,55,.35);border-left:4px solid #d4af37;font-size:clamp(1.15rem,2.6vw,1.5rem);font-weight:800;line-height:1.35;color:#fff}
.ba-pullquote > span{position:absolute;left:.7rem;top:.1rem;font-size:2.6rem;color:#d4af37;opacity:.6;line-height:1}
.ba-pullquote cite{display:block;margin-top:.6rem;font-size:.82rem;font-weight:600;font-style:normal;color:#c9a44a}
.ba-callout{display:flex;gap:1rem;align-items:flex-start;margin:1.5rem 0;padding:1.2rem 1.4rem;border-radius:14px;background:linear-gradient(135deg,rgba(58,166,117,.12),rgba(58,166,117,.03));border:1px solid rgba(58,166,117,.38)}
.ba-callout-ico{font-size:1.6rem;line-height:1}
.ba-callout strong{color:#fff}
.ba-proscons{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.6rem 0}
.ba-proscons > div{padding:1.2rem 1.3rem;border-radius:16px}
.ba-pros{background:linear-gradient(160deg,rgba(58,166,117,.12),rgba(58,166,117,.03));border:1px solid rgba(58,166,117,.38)}
.ba-cons{background:linear-gradient(160deg,rgba(232,90,63,.12),rgba(232,90,63,.03));border:1px solid rgba(232,90,63,.38)}
.ba-proscons h3{margin:0 0 .6rem;color:#fff;font-size:1.15rem}
.ba-proscons ul{margin:0}
.ba-pros li::before{content:"\2713";color:#3fd07a}
.ba-cons li::before{content:"\2715";color:#e8603f}
@media(max-width:600px){.ba-spectiles{grid-template-columns:repeat(2,1fr)}.ba-proscons{grid-template-columns:1fr}}

/* Post navigation (prev/next) links → gold — were invisible on the navy background. */
.post-navigation a, .posts-navigation a, .nav-links a,
.post-navigation .post-title, .post-navigation .meta-nav { color: #f5c451 !important; }
.post-navigation a:hover, .nav-links a:hover, .post-navigation a:hover .post-title { color: #ff9d3d !important; }

/* FAQ accordion (native one-open via <details name>). */
.ba-faq{display:grid;gap:.6rem;margin:.6rem 0 1.4rem}
.ba-faq details{background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.015));border:1px solid rgba(212,175,55,.26);border-radius:12px;padding:.9rem 1.15rem}
.ba-faq summary{cursor:pointer;font-weight:700;color:#fff;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:1rem}
.ba-faq summary::-webkit-details-marker{display:none}
.ba-faq summary::after{content:"+";color:#f5c451;font-weight:800;font-size:1.3rem;line-height:1}
.ba-faq details[open] summary::after{content:"\2013"}
.ba-faq details[open] summary{margin-bottom:.55rem}
.ba-faq p{margin:0;color:#c4c4cf;line-height:1.65}

/* Deal post card (Deals category) — premium price-drop callout. */
.ba-deal{max-width:640px;margin:1.6rem auto;padding:1.7rem;border-radius:18px;background:linear-gradient(150deg,#0a1740,#122a63);border:1px solid rgba(212,175,55,.42);box-shadow:0 16px 44px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.06);text-align:center}
.ba-deal-badge{display:inline-block;background:linear-gradient(135deg,#c0392b,#e74c3c);color:#fff;font-weight:800;font-size:.78rem;letter-spacing:.04em;padding:.32rem .85rem;border-radius:999px;margin-bottom:.8rem}
.ba-deal-name{color:#fff;font-size:1.3rem;font-weight:800;margin:0 0 .5rem;line-height:1.3}
.ba-deal-old{color:#9aa2b8;text-decoration:line-through;font-size:1.15rem;margin-right:.55rem}
.ba-deal-new{color:#f0d888;font-size:2rem;font-weight:900}
.ba-deal-save{color:#3fd07a;font-weight:700;font-size:.95rem;margin:.3rem 0 1rem}
.ba-deal-why{color:#c4c4cf;line-height:1.65;margin:0 auto 1.2rem;max-width:520px}
.ba-deal-btn{display:inline-block;background:linear-gradient(135deg,#a97d0c,#f9ee8c 42%,#d9b845 58%,#8f6f15);color:#20180a;font-weight:800;padding:.8rem 1.7rem;border-radius:10px;text-decoration:none;box-shadow:0 8px 22px rgba(212,175,55,.35)}
.ba-deal-btn:hover{filter:brightness(1.07)}

/* Responsive YouTube embed (16:9) — premium framed. */
.ba-video{margin:2.2rem 0}
.ba-video-frame{max-width:820px;margin:.7rem auto 0;border-radius:16px;overflow:hidden;border:1px solid rgba(212,175,55,.32);box-shadow:0 16px 44px rgba(0,0,0,.42)}
.ba-video-frame iframe{display:block;width:100%;aspect-ratio:16/9;border:0}

/* Result count above the homepage SEO text (below the tiles). */
.bah-resultcount{margin:1.6rem 0 .2rem;padding-top:1.2rem;border-top:1px solid rgba(212,175,55,.18)}
.bah-resultcount .woocommerce-result-count{margin:0;color:#c4c4cf;font-weight:600}

/* Homepage: keep only the result count below the tiles (in .bah-resultcount); hide the top one. */
.home .woocommerce-result-count{display:none !important}
.home .bah-resultcount .woocommerce-result-count{display:block !important}

/* ===== Product CTA extras: coupon callout + secondary Amazon button (meta-driven) ===== */
.ba-cta-extras{display:flex;flex-direction:column;gap:.7rem;margin:.9rem 0 .2rem}
.ba-coupon{display:flex;align-items:center;gap:.9rem;flex-wrap:wrap;
  background:linear-gradient(135deg,rgba(217,184,69,.14),rgba(15,23,42,.35));
  border:1px solid rgba(217,184,69,.55);border-radius:12px;padding:.7rem .9rem}
.ba-coupon-txt{font-weight:700;color:#f3e6b5;font-size:.95rem;line-height:1.25}
.ba-coupon-code{display:inline-flex;align-items:center;gap:.55rem;margin-left:auto;cursor:pointer;
  background:linear-gradient(135deg,#a97d0c,#f9ee8c 42%,#d9b845 58%,#8f6f15);
  color:#20180a;font-weight:800;letter-spacing:.06em;border:none;border-radius:9px;
  padding:.5rem .8rem;font-size:1.02rem;box-shadow:0 2px 10px rgba(217,184,69,.35)}
.ba-coupon-val{border:1px dashed rgba(32,24,10,.55);border-radius:6px;padding:.08rem .45rem}
.ba-coupon-copy{font-size:.72rem;font-weight:700;text-transform:uppercase;opacity:.85}
.ba-coupon-code:hover{filter:brightness(1.06)}
.ba-amazon-btn{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;
  align-self:flex-start;background:#0f172a;color:#f3e6b5;font-weight:800;letter-spacing:.01em;
  border:2px solid rgba(217,184,69,.5);border-radius:10px;padding:.66rem 1.25rem;
  text-decoration:none;font-size:.97rem;
  transition:background .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease}
.ba-amazon-btn:hover{background:#152238;border-color:#f9ee8c;color:#fff8dd;
  transform:translateY(-1px);animation:baAmzGlow 1.15s ease-in-out infinite}
@keyframes baAmzGlow{
  0%,100%{box-shadow:0 0 0 0 rgba(217,184,69,0),0 4px 14px rgba(217,184,69,.22)}
  50%{box-shadow:0 0 0 3px rgba(217,184,69,.38),0 8px 22px rgba(217,184,69,.5)}}
@media(prefers-reduced-motion:reduce){.ba-amazon-btn:hover{animation:none}}
@media(max-width:480px){.ba-coupon-code{margin-left:0}}

/* ===== Single-product buy buttons: premium gold gradient (matches coupon) ===== */
.single-product .single_add_to_cart_button,
.single-product a.button.product_type_external,
.single-product a.button.product_type_simple,
.single-product div.product form.cart button.button,
.single-product div.product form.cart .button{
  background:linear-gradient(135deg,#a97d0c,#f9ee8c 42%,#d9b845 58%,#8f6f15) !important;
  color:#20180a !important;border:none !important;font-weight:800 !important;
  text-shadow:none !important;box-shadow:0 2px 12px rgba(217,184,69,.35) !important;
  transition:filter .15s ease !important}
.single-product .single_add_to_cart_button:hover,
.single-product a.button.product_type_external:hover,
.single-product a.button.product_type_simple:hover,
.single-product div.product form.cart button.button:hover,
.single-product div.product form.cart .button:hover{
  background:linear-gradient(135deg,#b8890f,#fbf3a8 42%,#e3c455 58%,#9a7817) !important;
  color:#1a1408 !important;filter:brightness(1.05) !important}

/* ===== Editorial award badge above product title (our own, meta-driven) ===== */
.single-product .ba-badge{display:inline-flex;align-items:center;gap:.42rem;margin:0 0 .6rem;
  background:linear-gradient(135deg,#a97d0c,#f9ee8c 42%,#d9b845 58%,#8f6f15);
  color:#20180a;font-weight:800;font-size:.8rem;letter-spacing:.07em;text-transform:uppercase;
  padding:.34rem .78rem;border-radius:999px;box-shadow:0 2px 10px rgba(217,184,69,.4);
  vertical-align:middle}
.single-product .ba-badge .ba-badge-star{font-size:.92rem;line-height:1}

/* ===== 300x250 ad, 50px left of the product image — floats while scrolling, releases at
   the "Onsale Products" sidebar. JS (in wp_footer) controls position/top/left/display;
   these are just the base styles. Starts hidden to avoid a flash before JS measures. ===== */
.ba-ad-rail{display:none;position:absolute;z-index:60;width:300px}
.ba-ad-label{display:block;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;
  color:#8a90a6;margin:0 0 .3rem;text-align:center}
.ba-ad-slot{width:300px;height:250px;overflow:hidden;border:1px solid rgba(212,175,55,.28);
  border-radius:10px;background:#0b1226;box-shadow:0 8px 26px rgba(0,0,0,.45)}
.ba-ad-rail .ba-ad-slot + .ba-ad-slot,
.ba-ad-widget .ba-ad-slot + .ba-ad-slot{margin-top:20px}

/* Product-page fallback ad block (below Video Review tabs, before Related Products).
   Visible only when the left rail can't fit (viewport < 1200px). Flex-wrap gives
   auto 2-column on tablet landscape (~620px+ needed), stacked on phones. */
.ba-ad-fallback{display:block;margin:32px 0;text-align:center}
.ba-ad-fallback .ba-ad-label{margin-bottom:12px}
.ba-ad-fallback-row{display:flex;gap:20px;justify-content:center;flex-wrap:wrap}
.ba-ad-fallback-row .ba-ad-slot{margin:0;flex:0 0 300px}
@media (min-width:1200px){.ba-ad-fallback{display:none}}

/* Blog->Product cross-link callout on product short_description (top of summary).
   Premium royal-navy + gold treatment matching .bau-hero / .bac-final aesthetic. */
.ba-featured-callout{
  position:relative;
  background:linear-gradient(150deg,#0a1740 0%,#122a63 55%,#1a2f6b 100%);
  padding:1em 1.2em 1em 4.6em;
  margin:0 0 1.4em;
  border-radius:12px;
  font-size:0.95em;
  color:#e8e9f2;
  box-shadow:
    0 12px 30px rgba(0,0,0,.45),
    inset 0 0 0 1px rgba(212,175,55,.45),
    inset 0 1px 0 rgba(255,255,255,.06);
  overflow:hidden;
}
.ba-featured-callout::before{
  content:"🔥";
  position:absolute;left:1em;top:50%;transform:translateY(-50%);
  font-size:1.5em;line-height:1;
  filter:drop-shadow(0 0 8px rgba(255,180,60,.55));
  animation:ba-fire-pulse 2s ease-in-out infinite;
}
.ba-featured-callout::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(70% 90% at 8% 50%,rgba(255,180,60,.14),transparent 55%);
}
.ba-featured-callout > *{position:relative;z-index:1}
.ba-featured-callout strong{
  color:transparent;font-weight:800;letter-spacing:.02em;
  background:linear-gradient(100deg,#9e7b16,#fbf3b0 40%,#e6c766 52%,#fdf6bd 62%,#a9801d);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 1px 4px rgba(212,175,55,.28));
}
/* (inline plain-text 🔥 was stripped from all product excerpts on 2026-08-03 —
   the ::before pseudo now owns the flame, so no text-indent hack needed.) */
.ba-featured-callout a{
  color:#f5cc4a !important;
  font-weight:700;
  text-decoration:underline;text-decoration-color:rgba(245,204,74,.5);text-underline-offset:3px;
  transition:color .15s ease,text-decoration-color .15s ease;
}
.ba-featured-callout a:hover{
  color:#fff !important;text-decoration-color:#fff;
}
@keyframes ba-fire-pulse{
  0%,100%{transform:translateY(-50%) scale(1);filter:drop-shadow(0 0 8px rgba(255,180,60,.55))}
  50%{transform:translateY(-50%) scale(1.08);filter:drop-shadow(0 0 14px rgba(255,180,60,.75))}
}
/* Day mode: navy stays (it IS the brand callout), but tone contrast on light bg. */
body:not(.electro-dark) .ba-featured-callout{ color:#fff }

/* Product-loop brand badge (above title on shop/category tiles). */
.ba-loop-brand{
  display:inline-block;margin:0 0 .3em;
  font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;
  color:#d4af37;text-decoration:none;
  background:rgba(212,175,55,.10);border:1px solid rgba(212,175,55,.32);
  padding:.15em .55em;border-radius:4px;
  transition:all .12s ease;
}
.ba-loop-brand:hover{
  background:linear-gradient(135deg,#d4af37 0%,#f5cc4a 50%,#b8941f 100%);
  color:#0b1226;
}

/* YITH Compare page — dark theme override to match site royal aesthetic. */
.page-id-14 .site-content,
.page-id-14 #content{background:transparent !important}
.page-id-14 .entry-content h1,
.page-id-14 .entry-title{color:#e6e8ef}
.page-id-14 #yith-woocompare-table,
.page-id-14 .yith-woocompare-table,
.page-id-14 table.compare-list{
  background:rgba(11,18,38,.6);color:#e6e8ef;
  border:1px solid rgba(212,175,55,.28);border-radius:12px;overflow:hidden;
  border-collapse:separate;border-spacing:0;
}
.page-id-14 #yith-woocompare-table th,
.page-id-14 #yith-woocompare-table td,
.page-id-14 .yith-woocompare-table th,
.page-id-14 .yith-woocompare-table td,
.page-id-14 table.compare-list th,
.page-id-14 table.compare-list td{
  background:transparent !important;color:#e6e8ef !important;
  border-color:rgba(212,175,55,.18) !important;
  padding:1em .9em !important;
}
.page-id-14 #yith-woocompare-table tr:nth-child(even) td,
.page-id-14 .yith-woocompare-table tr:nth-child(even) td,
.page-id-14 table.compare-list tr:nth-child(even) td{background:rgba(212,175,55,.04) !important}
.page-id-14 #yith-woocompare-table .title,
.page-id-14 .yith-woocompare-table .title,
.page-id-14 table.compare-list .title,
.page-id-14 table.compare-list tr th:first-child{
  background:linear-gradient(135deg,rgba(212,175,55,.25),rgba(212,175,55,.08)) !important;
  color:#d4af37 !important;font-weight:700;
}
.page-id-14 .remove a,
.page-id-14 a.remove{color:#d4af37 !important;font-weight:600}
.page-id-14 .remove a:hover,.page-id-14 a.remove:hover{color:#fff !important}
.page-id-14 .price ins,.page-id-14 .price bdi{color:#d4af37 !important}
.page-id-14 .price del{color:#7a8090 !important}
.page-id-14 .button,.page-id-14 a.button{
  background:linear-gradient(135deg,#d4af37 0%,#f5cc4a 50%,#b8941f 100%) !important;
  color:#0b1226 !important;border:0 !important;font-weight:700;
  padding:.7em 1.4em !important;border-radius:8px !important;
}
/* Modal / lightbox variant that YITH sometimes uses instead of the page */
#yith-woocompare-modal .content,
.yith_woocompare_colorbox_wrapper{
  background:#0b1226 !important;color:#e6e8ef !important;
  border:1px solid rgba(212,175,55,.35) !important;
}

/* YITH floating preview bar (appears after "Add to Compare" click, bottom of screen). */
#yith-woocompare-preview-bar{
  background:linear-gradient(135deg,rgba(11,18,38,0.98) 0%,rgba(20,30,55,0.98) 100%) !important;
  color:#e6e8ef !important;
  border-top:2px solid rgba(212,175,55,.55) !important;
  box-shadow:0 -8px 30px rgba(0,0,0,.6) !important;
  padding:12px 16px !important;
}
#yith-woocompare-preview-bar *,
#yith-woocompare-preview-bar a,
#yith-woocompare-preview-bar span,
#yith-woocompare-preview-bar strong{color:#e6e8ef !important}
#yith-woocompare-preview-bar h3,
#yith-woocompare-preview-bar .title{color:#d4af37 !important;font-weight:700 !important}
#yith-woocompare-preview-bar img{border:1px solid rgba(212,175,55,.35);border-radius:6px;background:rgba(255,255,255,.05)}
#yith-woocompare-preview-bar .remove,
#yith-woocompare-preview-bar a.remove{
  color:#d4af37 !important;font-weight:600;
  background:rgba(212,175,55,.12) !important;padding:2px 8px;border-radius:4px;
}
#yith-woocompare-preview-bar .remove:hover{color:#fff !important;background:rgba(212,175,55,.3) !important}
#yith-woocompare-preview-bar .yith-woocompare-open,
#yith-woocompare-preview-bar a.compare,
#yith-woocompare-preview-bar .button{
  background:linear-gradient(135deg,#d4af37 0%,#f5cc4a 50%,#b8941f 100%) !important;
  color:#0b1226 !important;border:0 !important;
  padding:.55em 1.2em !important;border-radius:8px !important;font-weight:700 !important;
  text-decoration:none !important;
}
#yith-woocompare-preview-bar .yith-woocompare-open:hover,
#yith-woocompare-preview-bar a.compare:hover{
  transform:translateY(-1px);box-shadow:0 4px 14px rgba(212,175,55,.4);
  color:#0b1226 !important;
}
/* Product name placeholder when empty */
#yith-woocompare-preview-bar .product-empty,
#yith-woocompare-preview-bar .no-product{color:rgba(230,232,239,.5) !important;font-style:italic}

/* Homepage hero category chips — now proper anchors with SEO keyword text. */
.bah-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:1.4em;justify-content:center}
.bah-chips a.bah-chip{
  display:inline-block;padding:.55em 1.05em;
  background:rgba(11,18,38,.55);border:1px solid rgba(212,175,55,.32);
  color:#e6e8ef;font-weight:600;font-size:.95em;
  border-radius:8px;text-decoration:none;
  transition:all .15s ease;
}
.bah-chips a.bah-chip:hover{
  background:linear-gradient(135deg,#d4af37 0%,#f5cc4a 50%,#b8941f 100%);
  color:#0b1226;border-color:#d4af37;
  transform:translateY(-1px);box-shadow:0 4px 14px rgba(212,175,55,.35);
}

/* Hide "Based on 0 reviews" heading + empty star row on products without reviews. */
.woocommerce-Reviews .based-title:has(+ .commentlist:empty),
.woocommerce-Reviews-title.based-title[data-count="0"]{display:none}
/* Fallback: hide any h2.based-title that literally contains "0 reviews" */
.based-title[class*="based-title"]{font-size:1.05em;color:#8a90a6}

/* Prominent WooCommerce shop pagination — gold-bordered, larger click targets */
.woocommerce nav.woocommerce-pagination{margin:2.5em 0 1em;text-align:center}
.woocommerce nav.woocommerce-pagination ul{display:inline-flex;flex-wrap:wrap;gap:6px;border:0;background:transparent;padding:0}
.woocommerce nav.woocommerce-pagination ul li{border:0;margin:0;background:transparent}
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span{
  display:inline-block;min-width:44px;padding:.55em .95em;
  border:1px solid rgba(212,175,55,.35);border-radius:8px;
  background:rgba(11,18,38,.55);color:#e6e8ef;
  font-weight:600;font-size:1.05em;line-height:1.2;
  transition:all .15s ease;
}
.woocommerce nav.woocommerce-pagination ul li a:hover,
.woocommerce nav.woocommerce-pagination ul li a:focus{
  background:linear-gradient(135deg,#d4af37 0%,#f5cc4a 50%,#b8941f 100%);
  color:#0b1226;border-color:#d4af37;
  transform:translateY(-1px);box-shadow:0 4px 14px rgba(212,175,55,.35);
}
.woocommerce nav.woocommerce-pagination ul li span.current{
  background:linear-gradient(135deg,#d4af37 0%,#f5cc4a 50%,#b8941f 100%);
  color:#0b1226;border-color:#d4af37;box-shadow:0 4px 14px rgba(212,175,55,.35);
}

/* Gold CTA button — for blog posts routing readers to product page.
   !important + clear:both because Electro tab panels sometimes wrap content in
   flex/float parents; without this the CTA flows next to the preceding paragraph. */
.ba-cta-gold{
  display:block !important;
  clear:both !important;
  float:none !important;
  width:100% !important;
  margin:2em auto !important;
  text-align:center !important;
}
.ba-cta-gold a,
.ba-cta-gold a:visited,
.ba-cta-gold a:hover,
.ba-cta-gold a:focus,
.ba-cta-gold a *{
  color:#0a0a0a !important;      /* dark near-black — max contrast on gold gradient */
  text-shadow:0 1px 0 rgba(255,255,255,.35) !important;
  text-decoration:none !important;
}
.ba-cta-gold a{
  display:inline-block;
  padding:0.9em 2em;
  background:linear-gradient(135deg,#d4af37 0%,#f5cc4a 50%,#b8941f 100%);
  font-weight:800;               /* bumped from 700 → 800 for extra visibility */
  font-size:1.05em;
  border-radius:8px;
  box-shadow:0 6px 20px rgba(212,175,55,0.35), inset 0 1px 0 rgba(255,255,255,0.35);
  transition:transform .15s ease, box-shadow .15s ease;
  letter-spacing:.02em;
}
.ba-cta-gold a:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 28px rgba(212,175,55,0.5), inset 0 1px 0 rgba(255,255,255,0.4);
}
.ba-ad-slot img{display:block;width:300px;height:250px;object-fit:cover;max-width:100%}
.ba-ad-slot a{display:block;line-height:0}
.ba-ad-slot.ba-ad-google{background:#0b1226}
.ba-ad-slot.ba-ad-google .adsbygoogle{display:inline-block;width:300px;height:250px;max-width:100%}

/* ===== Sidebar + banner width alignment =====
   Banner is fixed 300x250 (AdSense standard). Snap sidebar widgets AND the floating ad
   widget to 300px so column contents look unified. Sidebar column itself gets a small
   padding so its outer edge sits just past the 300px banner. */
@media (min-width: 992px){
	#sidebar,
	.sidebar{ width:300px !important; max-width:300px !important; padding:0 !important; }
	#sidebar > .widget,
	.sidebar > .widget,
	#sidebar > aside.widget,
	.sidebar > aside.widget{ max-width:300px !important; width:100% !important; margin-left:0 !important; margin-right:0 !important; }
	.ba-ad-widget{ max-width:300px !important; width:300px !important; }
	.ba-ad-widget .ba-ad-slot{ max-width:300px; width:300px; margin:0 auto .5rem }
	.ba-ad-anchor{ max-width:300px !important; width:300px !important; }
}

/* ===== 300x250 ad widget at the bottom of the sidebar (JS floats it while scrolling) ===== */
.ba-ad-widget{margin:0 auto;width:300px;border:0;background:none;padding:0;z-index:55}
.ba-ad-widget .ba-ad-slot{margin-left:auto;margin-right:auto}
/* Pull the ad up close to the last widget's links (.widget has a big 3.3-5.1em bottom margin). */
.ba-ad-anchor{margin-top:-4.8em}

/* ===== Community: full-bleed "Community-chosen top video reviews" band ===== */
.bac-vidband{margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);
  padding:2.6rem 1.5rem;margin-top:2.2rem;margin-bottom:2.2rem;
  background:linear-gradient(150deg,#0a1740,#122a63 55%,#1a2f6b);
  box-shadow:inset 0 0 0 1px rgba(212,175,55,.28)}
.bac-vidband-in{max-width:1080px;margin:0 auto;text-align:center}
.bac-vidband-in .bac-h2{margin-top:0}

/* ===== Spec tables (product Specification tab + review posts): kill theme's white cells ===== */
.ba-spec-table,.ba-spec-table tbody,.ba-spec-table tr,.ba-spec-table th,.ba-spec-table td,
.shop_attributes.ba-spec-table th,.shop_attributes.ba-spec-table td{
  background:transparent !important;background-color:transparent !important}
.ba-spec-table th,.ba-spec-table td{
  border:1px solid rgba(212,175,55,.22) !important;padding:.55rem .85rem;color:#d7dae6}
.ba-spec-table th{color:#e8c766 !important;font-weight:700;text-align:left;width:40%}
.ba-spec-table td i,.ba-spec-table td p{margin:0}

/* ===== Header logo desktop size cap ===== */
/* Native WP .custom-logo has no default max-height. Source is 511x511 PNG so without a
   constraint it renders full-size and blows up the header nav. */
.custom-logo-link .custom-logo,
.site-branding .custom-logo,
.header-logo .custom-logo,
.header-logo-link img,
.header-logo img { max-height: 56px !important; width: auto !important; height: auto !important; }
@media (min-width: 992px) {
	.custom-logo-link .custom-logo,
	.site-branding .custom-logo,
	.header-logo .custom-logo,
	.header-logo img { max-height: 60px !important; }
}
@media (max-width: 767px) {
	.custom-logo-link .custom-logo,
	.site-branding .custom-logo,
	.header-logo img { max-height: 42px !important; }
}

/* ===== Electro product tabs — hide non-active panels =====
   Electro renders each tab as a separate <div class="electro-tab" id="tab-*"> with a full
   nav bar on top. Without display:none on inactive ones, all panels stack vertically as
   an accordion (broken on this theme). Ensure only the active panel is visible. */
.electro-tabs .electro-tab { display: none !important; }
.electro-tabs .electro-tab.active { display: block !important; }
.electro-tabs .electro-tab:first-of-type { display: block !important; }
.electro-tabs .electro-tab.active ~ .electro-tab { display: none !important; }
/* Show ec-tabs nav only ONCE (in the first panel; Electro echoes it inside every panel).
   Hide the redundant navs from non-first panels. */
.electro-tabs .electro-tab:not(:first-of-type) > .container > .tab-content > .ec-tabs,
.electro-tabs .electro-tab:not(:first-of-type) .ec-tabs { display: none !important; }

/* ===== Secondary "Also on Amazon" CTA — natural-width to match main WC button ===== */
.ba-cta-extras{display:block;margin-top:.6rem}
.ba-amazon-secondary{
  display:inline-block !important;
  width:auto !important;
  margin-top:.6rem !important;
}

/* ===== ba-vc-grid — replaces vc_basic_grid layout after js_composer deactivation ===== */
.ba-vc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem;margin:2rem 0}
.ba-vc-card{background:rgba(255,255,255,.03);border:1px solid rgba(212,175,55,.22);border-radius:12px;overflow:hidden;transition:transform .15s ease,box-shadow .15s ease}
.ba-vc-card:hover{transform:translateY(-3px);box-shadow:0 12px 32px rgba(0,0,0,.35)}
.ba-vc-card a{display:block;text-decoration:none;color:inherit}
.ba-vc-card img{width:100%;height:180px;object-fit:cover;display:block}
.ba-vc-title{padding:1rem 1.1rem .3rem;font-size:1.05rem;font-weight:700;color:#e8c766;margin:0;line-height:1.35}
.ba-vc-meta{padding:0 1.1rem;color:#9aa2b8;font-size:.82rem;margin-bottom:.5rem}
.ba-vc-excerpt{padding:0 1.1rem 1.1rem;color:#cfd2de;font-size:.9rem;line-height:1.55}
body:not(.electro-dark) .ba-vc-card{background:#fff;border-color:rgba(0,0,0,.1)}
body:not(.electro-dark) .ba-vc-title{color:#8f6f15}
body:not(.electro-dark) .ba-vc-meta{color:#6a6a6a}
body:not(.electro-dark) .ba-vc-excerpt{color:#333}

/* =========================================================================
   LIGHT-MODE RESET — undo our dark customizations when day theme is active.
   Electro adds .electro-dark class to body in night mode; day mode has no class.
   In day mode we roll back all our navy backgrounds, dark dropdowns, dark chrome
   so Electro's original light theme shines through. Layout/positioning rules
   above (logo cap, tab hide, product tile buttons) stay active in both modes.
   ========================================================================= */
body:not(.electro-dark) #masthead,
body:not(.electro-dark) #masthead .masthead,
body:not(.electro-dark) .site-header .top-bar,
body:not(.electro-dark) .header-v2 .top-bar,
body:not(.electro-dark) .header-v2 { background-color: revert !important; }
body:not(.electro-dark) .top-bar,
body:not(.electro-dark) .top-bar span { color: revert !important; }
body:not(.electro-dark) .top-bar a,
body:not(.electro-dark) .top-bar a *,
body:not(.electro-dark) #masthead .primary-nav-menu > ul > li > a { color: #8f6f15 !important; }
body:not(.electro-dark) .top-bar a:hover,
body:not(.electro-dark) #masthead .primary-nav-menu > ul > li > a:hover { color: #a97d0c !important; }
body:not(.electro-dark) .dropdown-menu,
body:not(.electro-dark) .dropdown-menu.yamm,
body:not(.electro-dark) .primary-nav-menu .dropdown-menu,
body:not(.electro-dark) .departments-menu-v2 .dropdown-menu {
    background-color: revert !important;
    border-color: revert !important;
    box-shadow: revert !important;
}
body:not(.electro-dark) .dropdown-menu a,
body:not(.electro-dark) .dropdown-menu li > a,
body:not(.electro-dark) .dropdown-menu .menu-item > a,
body:not(.electro-dark) .dropdown-menu .yamm-content a { color: revert !important; }
body:not(.electro-dark) .dropdown-menu a:hover,
body:not(.electro-dark) .dropdown-menu li > a:hover,
body:not(.electro-dark) .dropdown-menu .menu-item > a:hover { background-color: revert !important; color: revert !important; }
body:not(.electro-dark) .dropdown-menu .dropdown-header,
body:not(.electro-dark) .dropdown-menu .nav-header,
body:not(.electro-dark) .dropdown-menu .yamm-content h2 { color: revert !important; }
body:not(.electro-dark) .dropdown-menu .divider,
body:not(.electro-dark) .dropdown-menu hr { border-color: revert !important; }
body:not(.electro-dark) { background: revert !important; background-color: revert !important; }
body:not(.electro-dark) .woocommerce-breadcrumb,
body:not(.electro-dark) .breadcrumb-wrap,
body:not(.electro-dark) .breadcrumb { background-color: revert !important; }
body:not(.electro-dark) .site-footer,
body:not(.electro-dark) #colophon,
body:not(.electro-dark) .footer-v2,
body:not(.electro-dark) .footer-widgets,
body:not(.electro-dark) .footer-bottom-widgets { background-color: revert !important; }
body:not(.electro-dark) .price .amount,
body:not(.electro-dark) .electro-price .amount,
body:not(.electro-dark) .woocommerce-Price-amount.amount { color: revert !important; }
body:not(.electro-dark) .bacx-formcard .wpcf7-form-control,
body:not(.electro-dark) .bacx-formcard input[type=text],
body:not(.electro-dark) .bacx-formcard input[type=email],
body:not(.electro-dark) .bacx-formcard input[type=tel],
body:not(.electro-dark) .bacx-formcard textarea,
body:not(.electro-dark) .bacx-formcard select {
    border: revert !important;
    box-shadow: revert !important;
    background: revert !important;
    color: revert !important;
    border-radius: revert !important;
}
body:not(.electro-dark) .bacx-formcard .wpcf7-form-control::placeholder,
body:not(.electro-dark) .bacx-formcard input::placeholder,
body:not(.electro-dark) .bacx-formcard textarea::placeholder { color: revert !important; opacity: revert; }
/* Hero/banner premium blocks (bau/bac/bah/ba-catintro) stay branded in both modes — they
   ARE the brand style and were designed to work on light too. If you want them plain
   Electro in day mode, tell me and I'll add reverts here. */

/* Day-mode links: dark gold instead of Electro's default blue.
   Excludes buttons, product tile CTAs, and utility bars where color has semantic meaning. */
body:not(.electro-dark) a,
body:not(.electro-dark) .entry-content a,
body:not(.electro-dark) .woocommerce-product-details__short-description a,
body:not(.electro-dark) .product_meta a,
body:not(.electro-dark) .widget a,
body:not(.electro-dark) .footer-widgets a,
body:not(.electro-dark) .footer-bottom-widgets a,
body:not(.electro-dark) .site-footer a,
body:not(.electro-dark) .breadcrumb a,
body:not(.electro-dark) .woocommerce-breadcrumb a { color: #8f6f15 !important; }
body:not(.electro-dark) a:hover,
body:not(.electro-dark) .entry-content a:hover,
body:not(.electro-dark) .widget a:hover,
body:not(.electro-dark) .footer-widgets a:hover,
body:not(.electro-dark) .site-footer a:hover,
body:not(.electro-dark) .breadcrumb a:hover { color: #a97d0c !important; }
body:not(.electro-dark) a:visited { color: #6d5410 !important; }
/* Product tile title (Electro sets its own blue on .woocommerce-loop-product__title inside
   the .woocommerce-loop-product__link — outer link color inherit doesn't win). */
body:not(.electro-dark) .woocommerce-loop-product__link,
body:not(.electro-dark) .woocommerce-LoopProduct-link,
body:not(.electro-dark) .woocommerce-loop-product__link .woocommerce-loop-product__title,
body:not(.electro-dark) h2.woocommerce-loop-product__title,
body:not(.electro-dark) h3.woocommerce-loop-product__title,
body:not(.electro-dark) .product-item__title,
body:not(.electro-dark) .product-item__title a { color: #8f6f15 !important; }
body:not(.electro-dark) .woocommerce-loop-product__link:hover,
body:not(.electro-dark) .woocommerce-loop-product__link:hover .woocommerce-loop-product__title,
body:not(.electro-dark) h2.woocommerce-loop-product__title:hover,
body:not(.electro-dark) .product-item__title a:hover { color: #a97d0c !important; }
/* Sidebar widget product lists (Onsale Products, Top Rated Products, Recent Products,
   featured/best-selling widgets) — the title span is inside the <a> but Electro colors
   it separately. Also cover blog widgets. */
body:not(.electro-dark) .product_list_widget a,
body:not(.electro-dark) .product_list_widget a *,
body:not(.electro-dark) .product_list_widget .product-title,
body:not(.electro-dark) ul.products li.product a,
body:not(.electro-dark) .widget a,
body:not(.electro-dark) .widget a *,
body:not(.electro-dark) .widget_products a,
body:not(.electro-dark) .widget_top_rated_products a,
body:not(.electro-dark) .widget_recent_reviews a,
body:not(.electro-dark) .widget_shopping_cart a,
body:not(.electro-dark) .widget_recently_viewed_products a,
body:not(.electro-dark) .widget_layered_nav a,
body:not(.electro-dark) .widget_product_categories a,
body:not(.electro-dark) .widget_categories a,
body:not(.electro-dark) .widget_recent_entries a,
body:not(.electro-dark) .widget_pages a,
body:not(.electro-dark) .widget_meta a,
body:not(.electro-dark) .widget_archive a,
body:not(.electro-dark) .cart-name a,
body:not(.electro-dark) .cart-item a { color: #8f6f15 !important; }
body:not(.electro-dark) .widget a:hover,
body:not(.electro-dark) .widget a:hover *,
body:not(.electro-dark) .product_list_widget a:hover,
body:not(.electro-dark) .product_list_widget a:hover * { color: #a97d0c !important; }
/* Spec table in day mode: dark text (was #d7dae6 / #e8c766 — invisible on white bg). */
body:not(.electro-dark) .ba-spec-table th,
body:not(.electro-dark) .ba-spec-table td { color: #2a2a2a !important; border-color: rgba(0,0,0,.12) !important; }
body:not(.electro-dark) .ba-spec-table th { color: #8f6f15 !important; }
/* Preserve original color for buttons and functional elements — do not tint gold. */
body:not(.electro-dark) .button,
body:not(.electro-dark) .btn,
body:not(.electro-dark) a.button,
body:not(.electro-dark) a.btn,
body:not(.electro-dark) .product_type_external,
body:not(.electro-dark) .single_add_to_cart_button,
body:not(.electro-dark) .add_to_cart_button,
body:not(.electro-dark) .ba-cta-gold a,
body:not(.electro-dark) .bau-btn-primary,
body:not(.electro-dark) .bac-btn-primary,
body:not(.electro-dark) .bacx-formcard .wpcf7-submit,
body:not(.electro-dark) .custom-logo-link { color: revert !important; }