/**
 * Bristle Up Kit Credit — public stylesheet.
 *
 * Loaded on product, cart, and checkout pages by BU_Kit_Assets::enqueue().
 *
 * v1.9.20: moved from wp_add_inline_style (inline <style> block attached
 * to a dummy stylesheet handle) to a real .css file enqueue. The previous
 * approach was vulnerable to optimisation/caching plugins (WP Rocket,
 * LiteSpeed, Cloudflare APO, Autoptimize, Async JS / Defer JS plugins,
 * etc.) which sometimes strip inline styles attached to handles with no
 * actual src. A real file:
 *   - Survives any minification/combining pass cleanly.
 *   - Is cacheable by browsers (versioned via BU_KIT_VERSION query string
 *     so cache invalidates on plugin upgrade).
 *   - Shows up in DevTools as a real file, easier to debug.
 *   - Is not stripped by optimisation plugins targeting "empty handle"
 *     inline styles.
 *
 * Keep all selectors in this file; do not reintroduce inline styles
 * unless dynamically constructed from server-side data.
 *
 * Class index (alphabetical):
 *   .bu-bundle-credit-box                  — top "Kit Builder Credit" box on product pages
 *   .bu-credit-good                        — green text class for positive credit values
 *   .bu-credit-empty                       — red text class for zero/negative credit values
 *   .bu-credit-row                         — spacing for rows inside .bu-bundle-credit-box
 *   .bu-item-credit-applied                — per-add-on "credit applied" sub-box on bundle pages
 *   .bu-kit-cart-credit-notice             — cart-page credit summary notice
 *   .bu-kit-credit-cart-notice             — alternate cart-credit notice
 *   .bu-kit-eligibility-notice             — v1.9.17 green eligibility-confirmation notice
 *   .bu-kit-leftover-credit-notice         — v1.9.6 yellow "use it before checkout" notice
 *   .bu-kit-price-detail                   — small detail lines in #bu-discounted-bundle-total
 *   .bu-source-credit-notice               — v1.8.0 source-product notice (simple/variable pages)
 *   .bu-trigger-credit-unlocked            — green box on the bundle trigger item
 *   #bu-discounted-bundle-total            — totals box near ADD TO CART on bundle pages
 */

.bu-bundle-credit-box,
.bu-trigger-credit-unlocked,
#bu-discounted-bundle-total,
.bu-item-credit-applied,
.bu-kit-credit-cart-notice {
	border: var(--bu-border-width, 2px) solid var(--bu-accent, #627D47);
	background: var(--bu-box-bg, #f5fff0);
	border-radius: var(--bu-border-radius, 10px);
}
.bu-bundle-credit-box {
	padding: 14px;
	margin: 16px 0;
	font-size: 16px;
}
.bu-credit-row { margin-top: 6px; }
.bu-credit-good  { color: var(--bu-accent-text, #2f7d32) !important; }
.bu-credit-empty { color: #b20000 !important; }

/* v2.1.5/2.1.7: VISUAL — two hero stats + segmented remaining bar. Pure
   presentation; driven by existing JS values. Falls back gracefully: with the
   bar layer off (no .bu-has-bar) none of this applies and the classic rows
   render exactly as before. */
.bu-credit-heroes {
	display: flex;
	gap: 12px;
	margin: 12px 0;
}
.bu-credit-hero-stat {
	flex: 1;
	background: rgba(255,255,255,0.65);
	border-radius: var(--bu-border-radius, 10px);
	padding: 10px 13px;
}
.bu-credit-hero-label {
	display: block;
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: #777;
	margin-bottom: 2px;
}
.bu-credit-hero-val {
	display: block;
	font-size: var(--bu-hero-size, 40px);
	font-weight: var(--bu-figure-weight, 700);
	line-height: 1.1;
}
.bu-credit-hero-used .bu-credit-hero-val { color: var(--bu-accent-text, #2f7d32); }
.bu-credit-hero-remaining .bu-credit-hero-val { color: #1a1a1a; }

.bu-credit-bar-wrap { margin: 10px 0 4px; }
.bu-credit-bar {
	display: flex;
	height: var(--bu-bar-height, 14px);
	border-radius: 999px;
	overflow: hidden;
	background: rgba(0,0,0,0.08);
	margin-bottom: 8px;
}
.bu-credit-bar-seg {
	display: block;
	height: 100%;
	transition: width 300ms cubic-bezier(0.2,0.8,0.2,1);
}
.bu-credit-bar-kit  { background: var(--bu-accent, #627D47); }
.bu-credit-bar-cart { background: var(--bu-cart-accent, #1f6f8b); }
.bu-credit-segs {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	font-size: 13px;
}
.bu-credit-seg { display: flex; align-items: center; gap: 6px; white-space: nowrap; }
.bu-credit-seg-dot { width: 9px; height: 9px; border-radius: 2px; flex: 0 0 auto; }
.bu-credit-seg-kit  .bu-credit-seg-dot { background: var(--bu-accent, #627D47); }
.bu-credit-seg-cart .bu-credit-seg-dot { background: var(--bu-cart-accent, #1f6f8b); }
.bu-credit-seg-label { color: #555; }
.bu-credit-seg-val { font-weight: var(--bu-figure-weight, 700); }
.bu-credit-seg-kit  .bu-credit-seg-val { color: var(--bu-accent-text, #2f7d32); }
.bu-credit-seg-cart .bu-credit-seg-val { color: var(--bu-cart-accent, #1f6f8b); }

/* When the bar layer is on, the classic rows are kept in the DOM (so the
   existing JS write-targets still exist and the update logic is untouched) but
   hidden from view. The heroes + bar carry the information instead. */
.bu-credit-rows-hidden { display: none !important; }

/* v2.1.6: the responsive "stack the segments" media query is emitted INLINE
   by BU_Kit_Settings::credit_box_css_variables() at the admin-configured
   breakpoint (attached to the real bu-kit-credit handle). It is intentionally
   NOT duplicated here: a hardcoded 480px rule in this file would override a
   smaller admin breakpoint and stop the setting from lowering it. If the inline
   block is ever stripped by an aggressive optimiser, the box still renders
   correctly — segments simply stay side-by-side (they fit; the stack is an
   enhancement, not a requirement). */

.bu-kit-cart-credit-notice {
	padding: 12px 16px;
	margin-bottom: 12px;
	border-radius: 10px;
	font-size: 14px;
}
.bu-kit-cart-credit-notice--available { border: 2px solid #f0a500; background: #fffbef; }
.bu-kit-cart-credit-notice--applied   { border: 2px solid #627D47; background: #f5fff0; }
.bu-kit-cart-credit-notice p { margin: 0; }

.bu-trigger-credit-unlocked {
	margin-top: 10px;
	margin-bottom: 10px;
	padding: 10px;
	font-size: 15px;
	font-weight: 700;
}
.bu-trigger-credit-unlocked span,
.bu-item-credit-applied span,
#bu-discounted-bundle-total span { color: #2f7d32; }
.bu-trigger-credit-unlocked small {
	display: block;
	margin-top: 4px;
	font-size: 13px;
	font-weight: 500;
	color: #333;
}

#bu-discounted-bundle-total,
.bu-item-credit-applied {
	margin-top: 10px;
	padding: 10px;
	font-size: 15px;
	font-weight: 700;
}
.bu-item-credit-applied { margin-bottom: 10px; }

.bu-kit-credit-cart-notice {
	padding: 14px 16px;
	margin: 0 0 18px 0;
	box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}
.bu-kit-credit-cart-notice__title {
	font-size: 14px;
	font-weight: 800;
	color: #2f7d32;
	text-transform: uppercase;
	margin-bottom: 5px;
}
.bu-kit-credit-cart-notice__amount {
	font-size: 22px;
	font-weight: 900;
	color: #111;
	line-height: 1.2;
}
.bu-kit-credit-cart-notice__line {
	font-size: 15px;
	margin-top: 8px;
	color: #111;
}
.bu-kit-credit-cart-notice__line strong { color: #2f7d32; }
.bu-kit-credit-cart-notice__line-total {
	border-top: 1px solid #b7c9a6;
	padding-top: 8px;
	font-weight: 800;
}
.bu-kit-credit-cart-notice__text {
	font-size: 14px;
	margin-top: 6px;
	color: #333;
}

/* After-credit price display on product page */
#bu-discounted-bundle-total { margin-top: 4px; }
.bu-kit-price-detail {
	font-size: 14px;
	color: #555;
	margin-top: 2px;
}
.bu-kit-price-detail span {
	color: #2f7d32;
	font-weight: 700;
}

/* v1.8.0 source-product notice (simple & variable product pages) */
.bu-source-credit-notice {
	border: 2px solid #627D47;
	background: #f5fff0;
	border-radius: 10px;
	padding: 12px 14px;
	margin: 14px 0;
	font-size: 15px;
	line-height: 1.4;
}
.bu-source-credit-notice .bu-source-amount {
	font-weight: 700;
	color: #2f7d32;
}

/* v1.9.6 leftover-credit notice (yellow — "use it before checkout") */
.bu-kit-leftover-credit-notice {
	border: 2px solid #d4a017;
	background: #fff8e5;
	border-radius: 10px;
	padding: 12px 14px;
	margin: 14px 0;
	font-size: 15px;
	line-height: 1.4;
	color: #5a4a00;
}
.bu-kit-leftover-credit-notice .woocommerce-Price-amount {
	font-weight: 700;
	color: #8a6c00;
}

/* v1.9.17 eligibility confirmation notice (green — pairs below yellow) */
.bu-kit-eligibility-notice {
	border: 2px solid #627D47;
	background: #f5fff0;
	border-radius: 10px;
	padding: 12px 14px;
	margin: 14px 0;
	font-size: 15px;
	line-height: 1.4;
	color: #2f4f22;
	font-weight: 700;
}
/* When the green notice immediately follows the yellow one we want a
   small tightening of the gap so the pair reads as one unit. The
   adjacent-sibling selector lets us avoid double margin without
   reaching for !important or layout JS. */
.bu-kit-leftover-credit-notice + .bu-kit-eligibility-notice {
	margin-top: -6px;
}

/* ============================================================================
   v2.2.0: multi-view product-page credit box.
   The wrapper carries a view class (bu-view-combined-bar / bu-view-segmented-bar
   / bu-view-basic-text). Each view reads its OWN CSS-variable namespace so the
   three views are fully independent:
     - segmented bar : --bu-*   (legacy, defined above)
     - combined bar  : --buc-*
     - basic text    : --but-*
   ========================================================================== */

/* --- Combined-bar view box chrome (overrides the legacy --bu-* box rule) --- */
.bu-bundle-credit-box.bu-view-combined-bar {
	border: var(--buc-border-width, 2px) solid var(--buc-box-border, #27ae60);
	background: var(--buc-box-bg, #ffffff);
	border-radius: var(--buc-border-radius, 10px);
}
.bu-combined-heroes {
	display: flex;
	gap: 16px;
	margin: 14px 0 10px;
}
.bu-combined-hero { flex: 1; }
.bu-combined-hero-label {
	display: block;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: #777;
	margin-bottom: 2px;
}
.bu-combined-hero-val {
	display: block;
	font-size: var(--buc-hero-size, 40px);
	font-weight: var(--buc-figure-weight, 800);
	line-height: 1.1;
}
.bu-combined-hero-used .bu-combined-hero-val { color: var(--buc-used-color, #2f7d32); }
.bu-combined-hero-remaining .bu-combined-hero-val { color: var(--buc-remaining-color, #111111); }

.bu-combined-bar-wrap { margin: 6px 0 4px; }
.bu-combined-bar {
	position: relative;
	height: var(--buc-bar-height, 18px);
	border-radius: 999px;
	overflow: hidden;
	background: var(--buc-bar-track, #e6e6e6);
}
.bu-combined-bar-fill {
	display: block;
	height: 100%;
	width: 100%;
	background: var(--buc-bar-fill, #27ae60);
	border-radius: 999px;
	transition: width 300ms cubic-bezier(0.2,0.8,0.2,1);
}

/* --- Basic-text view box chrome (overrides the legacy --bu-* box rule) --- */
.bu-bundle-credit-box.bu-view-basic-text {
	border: var(--but-border-width, 1px) solid var(--but-box-border, #cfe8c2);
	background: var(--but-box-bg, #f5fff0);
	border-radius: var(--but-border-radius, 8px);
}
.bu-bundle-credit-box.bu-view-basic-text .bu-credit-good {
	color: var(--but-good-color, #2f7d32) !important;
}
.bu-bundle-credit-box.bu-view-basic-text #bu-credit-cart-available {
	color: var(--but-cart-color, #2f7d32);
}