/** Shopify CDN: Minification failed

Line 683:0 Unexpected "}"

**/
/**
 * EPIC ACCESSIBILITY & SEO FLAT CSS ENGINE
 * ---------------------------------------
 * VERSION: 6.0.0 (Master Production Build)
 * CLIENT: Marek Diagnostics
 * TARGET: WCAG 2.2 Level AA Focus, Contrast, & Structural Layout
 * NOTE: Strictly no FontAwesome pseudo-elements. No Shopify Liquid syntax.
 */

 /* ==========================================================================
   WCAG 2.4.11 / 2.4.12: OBSCURATION SAFETY PROTOCOLS
   ========================================================================== */

/* 1. Clear the Sticky Header (Fixes the cut-off 'Eye' symbol) */
html {
    /* Forces the browser to scroll elements down past the header */
    scroll-padding-top: calc(var(--header-height, 120px) + 30px) !important; 
    scroll-padding-bottom: 120px !important;
}

/* 2. Nuclear Option for Sticky Add-to-Cart Bars */
/* We completely hide the redundant sticky bar for keyboard users 
   so it is mathematically impossible to obscure their focus ring. */
body.epic-is-tabbing .product-sticky-form {
    display: none !important;
}

/* ==========================================================================
   SECTION 1: THE DESIGN TOKEN MATRIX (:root)
   ========================================================================== */
:root {
    /* Global Focus Ring Configurations */
    --epic-focus-color: #1a1b18; /* Dark text color for WCAG 3:1+ contrast */
    --epic-focus-outline: #ffffff; /* Contrast gap color */
    --epic-focus-thickness: 3px;
    --epic-focus-border: 2px solid #8AA0DA !important; /*added inner border to help distinguish focused items with keyboard */
    --epic-focus-radius: 0.75rem; /* Matching the theme's sharp square buttons */

    /* Hybrid Cart Notification & Toast Variables */
    --epic-notify-zindex: 2147483647; 
    --epic-notify-padding: 16px;
    --epic-notify-radius: 0.75rem; /* Matches Marek's var(--inputs-radius) */
    --epic-notify-shadow: 0 10px 30px rgba(0,0,0,0.3);
    --epic-notify-weight-bold: 700;
    --epic-notify-weight-normal: 400;

    /* Toast: Success State */
    --epic-notify-success-bg: rgb(101, 118, 177); 
    --epic-notify-success-text: rgb(255, 255, 255); 
    --epic-notify-success-border: 2px solid #4a5785; 

    /* Toast: Error State */
    --epic-notify-error-bg: rgb(255, 241, 242); 
    --epic-notify-error-text: rgb(190, 18, 60); 
    --epic-notify-error-border: 2px solid #9f0e30;
    
    /* Interactive Component Spacing */
    --epic-svg-spacing: 0.4em;

    /* Theme colors */
    --epic-lime-green: #c8d451;
    --epic-accent-blue: #6576B1;
    --epic-blue-dark: #5C6DA6;
    --epic-accent-blue-light: #8AA0DA;
    --epic-green-dark: #19763A;
}

/* ==========================================================================
   SECTION 2: GLOBAL ACCESSIBILITY UTILITIES
   ========================================================================== */

/**
 * 1. Bulletproof Screen Reader Only Utility (.sr-only)
 * Safely hides text visually while keeping it fully readable by screen readers.
 * Prevents text smash, handles deprecated clip rollbacks, and satisfies WAVE.
 */
.sr-only {
    border: 0 !important;
    clip: rect(1px, 1px, 1px, 1px) !important;
    -webkit-clip-path: inset(50%) !important;
    clip-path: inset(50%) !important;
    height: 1px !important;
    margin: -1px !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: absolute !important;
    width: 1px !important;
    white-space: nowrap !important;
    color: #000000 !important;
    background: #FFFFFF !important;
}

/**
 * 2. Focusable Screen Reader Content
 * Reveals content (like bypass skip-links) cleanly upon receiving tab focus.
 */
.sr-only-focusable:active,
.sr-only-focusable:focus,
.sr-only-focusable:focus-visible {
    clip: auto !important;
    -webkit-clip-path: none !important;
    clip-path: none !important;
    height: auto !important;
    margin: auto !important;
    overflow: visible !important;
    position: static !important;
    width: auto !important;
    white-space: normal !important;
}

/* ==========================================================================
   ADVANCED SKIP NAVIGATION
   ========================================================================== */
.epic-skip-nav {
    position: absolute;
    top: -100px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 999999;
    background: #ffffff;
    border: 2px solid var(--epic-focus-color);
    border-radius: 0 0 8px 8px;
    padding: 10px 20px;
    display: flex;
    gap: 20px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    transition: top 0.2s ease-in-out;
}

.epic-skip-nav:focus-within {
    top: 0; /* Drops down when any internal link receives focus */
}

.epic-skip-link {
    color: var(--epic-focus-color) !important;
    font-weight: 700 !important;
    text-decoration: underline !important;
    padding: 8px !important;
    white-space: nowrap;
}

.epic-skip-link:focus-visible {
    /* Bold, high-contrast visibility using Marek's brand colors */
    outline: 3px solid var(--epic-focus-color) !important;
    outline-offset: 2px !important;
    background: var(--epic-accent-blue-light) !important; 
    color: #1a1b18 !important; 
    border-radius: 4px;
}

/* ==========================================================================
   SECTION 3: GLOBAL FOCUS ARCHITECTURE
   ========================================================================== */

/**
 * 1. Unified Focus-Visible Normalization
 * Standardizes the browser focus ring to match the brand variables, ensuring
 * a minimum 3:1 contrast ratio against the background per WCAG 2.2 AA.
 */
*:focus-visible {
    outline: var(--epic-focus-thickness) solid var(--epic-focus-color) !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 2px var(--epic-focus-outline) !important;
    border-radius: var(--epic-focus-radius);
    border: var(--epic-focus-border);
}

/**
 * 2. Form Element Focus Resets
 * Prevents double-outlines on natively styled inputs, selects, and textareas.
 */
input:focus-visible, 
textarea:focus-visible, 
select:focus-visible, 
button:focus-visible {
    outline: var(--epic-focus-thickness) solid var(--epic-focus-color) !important;
    outline-offset: 2px !important;
}

/* ==========================================================================
   IMAGE & ICON LINK FOCUS ROUTING
   ========================================================================== */

/* 1. Suppress the default bounding box on the anchor */
a.epic-img-link:focus, 
a.epic-img-link:focus-visible {
    outline: none !important;
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
}

/* 2. Apply the high-visibility focus ring directly to the media element */
a.epic-img-link:focus img, 
a.epic-img-link:focus-visible img,
a.epic-img-link:focus svg, 
a.epic-img-link:focus-visible svg {
    outline: 3px solid var(--epic-focus-color) !important;
    outline-offset: 2px !important;
    border-radius: var(--epic-focus-radius);
    border: var(--epic-focus-border);
    /* Optional: If the image has a transparent background (like a PNG/SVG logo), 
       adding a background color ensures the dark focus ring is always visible *
    background-color: var(--epic-accent-blue-light) !important; */
}

/* ==========================================================================
   SECTION 4: JS MODULE UI SHELLS & OVERRIDES
   ========================================================================== */

/**
 * 1. SVG Icon Spacing & Layout Structure
 */
svg.epic-icon {
    display: inline-block;
    vertical-align: middle;
    fill: currentColor;
    width: 1em;
    height: 1em;
}

/* Flex Container Wrapper (Modern Spacing Strategy) */
.epic-icon-wrapper {
    display: inline-flex !important;
    align-items: center !important;
    gap: var(--epic-svg-spacing) !important;
    text-decoration: inherit;
}

/* Directional Fallbacks (For injected HTML strings) */
svg.epic-icon-left {
    margin-right: var(--epic-svg-spacing) !important;
}

svg.epic-icon-right {
    margin-left: var(--epic-svg-spacing) !important;
}

/* External Link Warning Wrapper */
.epic-ext-warning {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    font-size: 78%;
    
    /* 1. Sever any native text-decoration just in case */
    text-decoration: none !important;
    
    /* 2. The CSS Mask: Visually paints over the parent's gradient line */
    /* Update this hex/variable to match Marek's primary page background */
    background-color: var(--color-background, #ffffff); 
    
    /* 3. Pull it slightly over the line to ensure a clean break *
    padding-left: 4px; 
    margin-left: 2px;*/
}

/* ==========================================================================
   2. HYBRID CART NOTIFICATION & ALERT CARD (IN-FLOW)
   ========================================================================== */
.epic-hybrid-toast {
    position: relative; /* WCAG 2.4.11 Compliant */
    display: flex;
    align-items: stretch; /* Forces the icon band to stretch full height */
    width: 100%;
    margin-bottom: 24px;
    border-radius: var(--epic-notify-radius);
    overflow: hidden; /* Clips the dark background band to the border radius */
}

/* Modifier: Success State */
.epic-toast--success {
    background-color: var(--epic-notify-success-bg);
    color: var(--epic-notify-success-text);
    border: var(--epic-notify-success-border);
}

/* Modifier: Error State */
.epic-toast--error {
    background-color: var(--epic-notify-error-bg);
    color: var(--epic-notify-error-text);
    border: var(--epic-notify-error-border);
}

/* The Left-Hand Icon Band */
.epic-hybrid-toast .epic-toast-icon-band {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px 20px;
    background-color: rgba(0, 0, 0, 0.15); /* Subtle dark band */
    flex-shrink: 0;
}

/* Enlarged SVG inside the band */
.epic-hybrid-toast .epic-toast-icon-band svg {
    width: 32px;
    height: 32px;
    color: currentColor; /* Inherits text color of active modifier */
}

/* The Message Content */
.epic-hybrid-toast .epic-toast-content {
    flex-grow: 1;
    display: flex;
    align-items: center;
    padding: 16px 20px;
    font-size: 1rem;
    line-height: 1.4;
}

/* Typography */
.epic-hybrid-toast strong {
    font-weight: var(--epic-notify-weight-bold) !important;
}

/* Dynamic Close Button */
.epic-hybrid-toast .epic-toast-close {
    background: transparent !important;
    border: none !important;
    color: currentColor !important;
    cursor: pointer !important;
    padding: 16px 20px !important; /* Matches the left-hand band padding */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0;
    transition: opacity 0.2s ease;
}

.epic-hybrid-toast .epic-toast-close:hover {
    opacity: 0.7;
}

/* Keyboard Focus: Matches text color. Inset so it isn't clipped by overflow:hidden */
.epic-hybrid-toast .epic-toast-close:focus-visible {
    outline: 2px solid currentColor !important;
    outline-offset: -4px !important; 
    border-radius: 4px;
}
/**
 * 3. Tooltip & Custom Combobox Enhancements
 */
.epic-tooltip-trigger,
.epic-pseudo-select-trigger {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    color: inherit !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    text-decoration: underline !important;
    text-decoration-style: dotted !important;
}


/* ==========================================================================
   TRANSCRIPT ACCORDION (WCAG 1.2.8 - RESPONSIVE OVERLAY)
   ========================================================================== */
.epic-transcript-overlay {
    position: absolute;
    bottom: 30px;
    left: 20px;
    /* FIX 1: Dropped from 100 to 2 to prevent nav overlap */
    z-index: 2; 
    background-color: rgba(0, 0, 0, 0.85); 
    border: 1px solid rgba(255, 255, 255, 0.2);
    
    /* FIX 2: Default to the 44x44 circle on ALL breakpoints */
    border-radius: 50%;
    padding: 10px;
    width: 44px;
    height: 44px;
    max-height: calc(100% - 40px);
    
    display: flex;
    flex-direction: column;
    overflow: hidden; 
    
    transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1), border-radius 0.3s ease, padding 0.3s ease;
}

/* Desktop Positioning Adjustments */
@media (min-width: 768px) {
    .epic-transcript-overlay {
        bottom: 40px;
        left: 40px;
    }
}

/* When the accordion is opened (clicked) */
.epic-transcript-overlay[open] {
    width: calc(100% - 40px);
    max-width: 450px; /* Caps the width so it doesn't stretch too far on large screens */
    height: auto; 
    border-radius: var(--epic-notify-radius, 8px); 
    padding: 12px;
}

/* Hide default browser arrow */
.epic-transcript-overlay .epic-transcript-summary {
    color: #ffffff;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    width: 100%;
    height: 22px; 
    outline-offset: 4px;
    list-style: none;
    user-select: none;
}

.epic-transcript-overlay .epic-transcript-summary::-webkit-details-marker {
    display: none;
}

/* Center the SVG perfectly inside the circle */
.epic-transcript-overlay .epic-transcript-summary svg {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    margin: 0 auto; 
    transition: margin 0.3s ease;
}

/* When open, push the SVG to the left so it sits next to the text */
.epic-transcript-overlay[open] .epic-transcript-summary svg {
    margin: 0; 
}

/* The Expanding Text Span */
.epic-transcript-overlay .epic-summary-text {
    display: inline-block;
    overflow: hidden;
    white-space: nowrap;
    opacity: 0;
    max-width: 0;
    transition: max-width 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.3s ease, margin-left 0.3s ease;
}

/* Show text ONLY when [open] across ALL breakpoints */
.epic-transcript-overlay[open] .epic-summary-text {
    max-width: 300px;
    opacity: 1;
    margin-left: 8px;
}

/* 1. Strip the ugly default focus ring from the inner summary text */
.epic-transcript-overlay .epic-transcript-summary:focus-visible {
    outline: none !important;
}

/* 2. Route a clean, unified focus ring to the outer wrapper when active */
.epic-transcript-overlay:focus-within {
    outline: 2px solid #ffffff !important;
    outline-offset: 3px !important;
    /* Adds a dark secondary border so the white ring doesn't vanish against light videos */
    box-shadow: 0 0 0 7px rgba(0,0,0,0.6) !important; 
}

.epic-transcript-overlay .epic-transcript-content {
    overflow-y: auto; 
    padding-top: 12px;
    color: #ffffff;
    font-size: 0.9rem;
    line-height: 1.5;
}
/* ==========================================================================
   DAWN DEFERRED-MEDIA PLAY BUTTON FOCUS ROUTING
   ========================================================================== */
/* 1. Prevent the massive full-width button from drawing an off-screen focus ring */
.deferred-poster:focus, 
.deferred-poster:focus-visible {
    outline: none !important;
    box-shadow: none !important;
}

/* 2. Route the high-contrast focus ring directly onto the visible circular icon */
.deferred-poster:focus-visible .play-button {
    outline: 3px solid var(--epic-focus-outline, #ffffff) !important;
    outline-offset: 4px !important;
    box-shadow: 0 0 0 6px var(--epic-focus-color, #1a1b18) !important;
}

/* WAVE Report: Force strict mathematical contrast on hidden live regions */
.sr-only,
#epic-live-region,
#epic-universal-announcer,
.epic-complex-desc.sr-only {
    color: #000000 !important;
    background-color: #ffffff !important;
    background-image: none !important;
}

/* ==========================================================================
   SECTION 5: SITE-SPECIFIC OVERRIDES (MAREK DIAGNOSTICS)
   ========================================================================== */

/* * Marek Specific App Resets (e.g., Judge.me, Stamped.io, Nosto)
 * Strip inner focus boundaries so only the outer interactive wrapper shows the ring.
 */
.jdgm-carousel-item__full-review-link:focus, 
.jdgm-carousel-item__full-review-link:focus-visible,
.stamped-review:focus-visible {
    border: none !important;
    outline: none !important;
}

/* Marek Site Adjustments go below this line */

/* ==========================================================================
   MAREK AXE REPORT HOTFIXES (June 20, 2026)
   ========================================================================== */

/* 1. Color Contrast: Darken text elements to meet 4.5:1 ratio against white */
.in-cart, 
.hlb-card, 
.hlb-card[data-variant-id] {
  /*  color: #1a1b18 !important; /* Forces dark charcoal over the non-compliant lime green */
}

/* If the lime green is a background, ensure the text on it is dark, not white */
.bg-lime-custom { /* Adjust this class if they use a utility class for the green bg */
  /*  color: #1a1b18 !important; */
}

/* 2. Target Size (WCAG 2.5.8): Ensure small text links are at least 24px tall/wide */
.article-card__content .link.text-sm {
    display: inline-block !important;
    min-height: 24px !important;
    min-width: 24px !important;
    padding: 4px 8px !important; /* Expands the clickable footprint */
}

.header__navigation summary[data-link] {
     display: inline-block !important;
    min-height: 24px !important;
    min-width: 24px !important;
    padding-left: 6px !important;
    padding-right: 6px !important;
    margin-left: 4px !important;
    margin-right: 4px !important;
}
.faqs.with-background .highlighted-text.animate[data-style=text] {
    color: var(--epic-accent-blue-light);
}
/* dark background */
#shopify-section-template--25122327200018__timeline_G9QX9L .highlighted-text.animate[data-style=text] {
    color: var(--epic-accent-blue-light);
}

/* light background */
#shopify-section-template--25122327593234__faq .highlighted-text.animate[data-style=text] {
    color: var(--epic-blue-dark);
}

.button--secondary, button.shopify-payment-button__button--unbranded, #shopify-pc__banner__btn-decline {
   /* background: rgba(0,0,0,0.2);*/
}

.hlb-card__price-save, .lb-card__price-save {
    color: var(--epic-green-dark) !important;
}

/* ==========================================================================
   WCAG 2.1.1 KEYBOARD: SHOP THE LOOK HOTSPOTS
   ========================================================================== */
/* Force the hidden tooltip to appear when a keyboard user tabs to the hotspot */
hover-element.hotspot:focus-visible .hotspot__content,
hover-element.hotspot:focus-within .hotspot__content {
    display: flex !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important; /* Allows them to interact with the tooltip if needed */
}

/* Give the hotspot dot a highly visible focus ring against the background image */
hover-element.hotspot:focus-visible {
    outline: 3px solid var(--epic-focus-outline) !important;
    box-shadow: 0 0 0 6px var(--epic-focus-color) !important;
    border-radius: 50%; /* Keeps the focus ring circular around the dot */
}

/* ==========================================================================
   WCAG 2.2.2 PAUSE, STOP, HIDE: SCROLLING MARQUEE
   ========================================================================== */
/* Force the CSS animation to pause when hovered by a mouse or focused by a keyboard */
marquee-element:hover .marquee.animate,
marquee-element:focus-visible .marquee.animate,
marquee-element:focus-within .marquee.animate {
    animation-play-state: paused !important;
}

/* Ensure the keyboard user sees exactly what they are pausing */
marquee-element:focus-visible {
    outline: 3px solid var(--epic-focus-color) !important;
    outline-offset: 4px !important;
}

/* ==========================================================================
   WCAG 1.4.3 CONTRAST: HERO & VIDEO BANNER OVERLAYS
   ========================================================================== */
/* Pre-empts WAVE flags by forcing a darker mathematical background 
   and handles any bright video frames by bumping the opacity. */
.video-hero,
.banner,
[data-section-type*="video"],
[id*="video_with_text_overlay"] {
    /* Darken the base overlay color slightly (original was 23 28 45) *
    --color-overlay: 15 18 30 !important; */
    
    /* Bump opacity from 0.65 to 0.8 to ensure 4.5:1 math on the brightest frames *
    --overlay-opacity: 0.8 !important; */
}
/* ==========================================================================
   WCAG 1.4.3 CONTRAST: THE CINEMATIC VIGNETTE
   ========================================================================== */
/* Apply the gradient to the full-width wrapper to eliminate hard bounding-box edges */
.video-hero .banner__content {
    background: radial-gradient(ellipse at center, rgba(15, 18, 30, 0.75) 15%, rgba(15, 18, 30, 0.4) 60%, transparent 100%) !important;
}

/* Ensure the text box inside is completely naked so there are no residual borders */
.video-hero .banner__box {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important; 
    backdrop-filter: none !important;
    box-shadow: none !important;
    padding: 0 !important; /* Reset padding since we don't need to push the gradient out anymore */
}

/* ==========================================================================
   WCAG 1.4.3 CONTRAST: ISOLATED MEDIA CARDS (SPLIT BLOCKS)
   ========================================================================== */

/* ==========================================================================
   WCAG 1.4.3 CONTRAST: ISOLATED MEDIA CARDS (SPLIT BLOCKS)
   ========================================================================== */

/* --------------------------------------------------------
   1. HOMEPAGE CARD ('Build your own panel')
   Requires absolute positioning to stay at the bottom.
-------------------------------------------------------- */
#shopify-block-collection_KydkNb .media-card__content,
a.media-card__link[href*="lab-builder"] .media-card__content {
    background: linear-gradient(to top, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.4) 60%, transparent 100%) !important;
    padding-top: 3.5rem !important; 
    width: 100% !important;
    position: absolute !important; /* Restored to fix the homepage layout! */
    bottom: 0 !important;
}

#shopify-block-collection_KydkNb .media-card__text p,
a.media-card__link[href*="lab-builder"] .media-card__text p {
    color: #ffffff !important;
    opacity: 1 !important;
}


/* --------------------------------------------------------
   2. MEGA MENU CARDS (Dark Image Promos Only)
   Requires relative positioning and z-index to fight the menu.
-------------------------------------------------------- */

/* The 'Shop' Dropdown Card */
a.media-card__link[href*="pre-built-panels"] .media-card__content, a.media-card__link[href*="lab-builder"] .media-card__content,
a.media-card__link[href*="all-lab-panels"] .media-card__content
{
    background: linear-gradient(to top, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.4) 60%, transparent 100%) !important;
    padding-top: 3.5rem !important;
    width: 100% !important;
    position: absolute !important;
    bottom: 0 !important;
}
}

/* Ensure the text is punchy for all targeted Mega Menu cards */
.mega-menu #shopify-block-6c9ab4c4-de5d-4fc7-be6d-ca94d1bf52a2 .media-card__text p,
.mega-menu a.media-card__link[href*="how-it-works"] .media-card__text p,
.mega-menu a.media-card__link[href*="all-lab-panels"] .media-card__text p {
    color: #ffffff !important;
    opacity: 1 !important;
}

#shopify-section-template--25122327200018__image_with_text_overlay_LtJez3 .button {
    background-color: var(--epic-blue-dark);
    color: #FFFFFF;
}
#shopify-section-template--25122327200018__image_with_text_overlay_LtJez3 .button:hover, #shopify-section-template--25122327200018__image_with_text_overlay_LtJez3 .button:focus 
{
    background-color: var(--epic-blue-dark);
    color: #FFFFFF;
}

.timeline-dots button[aria-current=false]
 {
    color: #818181;
}

/* ==========================================================================
   WCAG 2.1.1 KEYBOARD: SCROLLABLE REGIONS
   ========================================================================== */
.hlb-bundle__items:focus-visible {
    outline: 2px solid var(--epic-focus-color) !important;
    outline-offset: -2px !important; /* Inset so it doesn't break the bundle's outer borders */
}
slider-element:focus-visible {
    outline: 2px solid var(--epic-focus-color) !important;
    outline-offset: 2px !important;
}

/* ==========================================================================
   WCAG 1.4.3 CONTRAST: INACTIVE SUBCOLLECTIONS
   ========================================================================== */
/* Strip the lazy opacity trick that causes contrast failures */
.subcollection {
    opacity: 1 !important;
    
    /* Option A: Your solid hex (Uncomment if you are Light Mode only) */
    /* color: #686868 !important; */
    
    /* Option B: The Holy Grail Variable (Passes in both Light & Dark modes) */
    color: rgb(var(--color-foreground) / 0.55) !important;
    
    /* Smoothly transition the text color instead of the full element opacity */
    transition: color var(--animation-primary) !important; 
}

/* Return to full 100% contrast when active, hovered, or focused */
.active .subcollection,
.subcollection[aria-current="page"],
.subcollection:hover,
.subcollection:focus-visible {
    color: rgb(var(--color-foreground)) !important;
}

.unit-price, .price__sale
 {
    color: #686868;
    
}
.unit-price .sr-only, .price__sale .sr-only {
    background: #FFFFFF !important;
    color: #000000 !important;
}
/* ==========================================================================
   WCAG 1.4.3 CONTRAST: LAB BUILDER ACTIVE COUNTS
   ========================================================================== */
/* When the category button is inactive (light background), use the safe 55% variable */
.lb-cat__count {
    color: rgb(var(--color-foreground) / 0.65) !important;
    opacity: 1 !important;
}

/* When the category button becomes ACTIVE (dark background #1a1a1a), the count must flip to a light color! */
.lb-cat.active .lb-cat__count {
    /* Force it to pure white so it safely passes against the dark background.
       The 0.8 opacity keeps it looking like 'secondary' text without failing the math. */
    color: #ffffff !important;
    opacity: 0.8 !important; 
}

/* ==========================================================================
   WCAG 2.1.1 KEYBOARD: LAB BUILDER SCROLLABLE REGIONS
   ========================================================================== */
.lb-bundle__items:focus-visible {
    outline: 2px solid var(--epic-focus-color) !important;
    outline-offset: -2px !important; 
}

.lb-card__add.in-cart {
    color: #171717 !important;
    opacity: 0.85 !important;
}

.drawer__tab[aria-expanded=false]
 {
    opacity: .55;
    
}

.drawer__submenu>button
 {
    
    color: #686868;
    opacity: 1;
}