/** Shopify CDN: Minification failed

Line 21:0 Unexpected "{"
Line 21:1 Expected identifier but found "%"
Line 293:0 Unexpected "{"
Line 293:1 Expected identifier but found "%"

**/
/* Accent Typography Utilities
   Provides utility classes for applying the global accent font
   to elements in sections throughout the theme
*/

/* Debug: Check if CSS variables are available */
:root {
  --accent-debug: var(--font-accent-family, 'ACCENT_FONT_NOT_SET');
}

/* Base accent font class with high specificity */

{% comment %}
.accent-font,
body .accent-font,
html .accent-font,
.shopify-section .accent-font {
  font-family: var(--font-accent-family, var(--font-body-family)) !important;
  font-style: var(--font-accent-style, normal) !important;
  font-weight: var(--font-accent-weight, 400) !important;
  letter-spacing: var(--font-accent-letter-spacing, 0px) !important;
  text-transform: var(--font-accent-text-transform, none) !important;
}

/* Specific targeting for new-hero accent text */
.new-hero-accent-text.accent-font,
.custom-hero .new-hero-accent-text.accent-font,
section .new-hero-accent-text.accent-font {
  font-family: var(--font-accent-family, var(--font-body-family)) !important;
  font-style: var(--font-accent-style, normal) !important;
  font-weight: var(--font-accent-weight, 400) !important;
  letter-spacing: var(--font-accent-letter-spacing, 0px) !important;
  text-transform: var(--font-accent-text-transform, none) !important;
}

/* Accent font sizes with scaling and high specificity */
.accent-font--xs,
body .accent-font--xs,
.shopify-section .accent-font--xs {
  font-family: var(--font-accent-family, var(--font-body-family)) !important;
  font-style: var(--font-accent-style, normal) !important;
  font-weight: var(--font-accent-weight, 400) !important;
  letter-spacing: var(--font-accent-letter-spacing, 0px) !important;
  text-transform: var(--font-accent-text-transform, none) !important;
  font-size: calc(0.75rem * var(--font-accent-scale, 1)) !important;
}

.accent-font--sm,
body .accent-font--sm,
.shopify-section .accent-font--sm {
  font-family: var(--font-accent-family, var(--font-body-family)) !important;
  font-style: var(--font-accent-style, normal) !important;
  font-weight: var(--font-accent-weight, 400) !important;
  letter-spacing: var(--font-accent-letter-spacing, 0px) !important;
  text-transform: var(--font-accent-text-transform, none) !important;
  font-size: calc(0.875rem * var(--font-accent-scale, 1)) !important;
}

.accent-font--base,
body .accent-font--base,
.shopify-section .accent-font--base {
  font-family: var(--font-accent-family, var(--font-body-family)) !important;
  font-style: var(--font-accent-style, normal) !important;
  font-weight: var(--font-accent-weight, 400) !important;
  letter-spacing: var(--font-accent-letter-spacing, 0px) !important;
  text-transform: var(--font-accent-text-transform, none) !important;
  font-size: calc(1rem * var(--font-accent-scale, 1)) !important;
}

.accent-font--lg,
body .accent-font--lg,
.shopify-section .accent-font--lg {
  font-family: var(--font-accent-family, var(--font-body-family)) !important;
  font-style: var(--font-accent-style, normal) !important;
  font-weight: var(--font-accent-weight, 400) !important;
  letter-spacing: var(--font-accent-letter-spacing, 0px) !important;
  text-transform: var(--font-accent-text-transform, none) !important;
  font-size: calc(1.125rem * var(--font-accent-scale, 1)) !important;
}

.accent-font--xl {
  font-family: var(--font-accent-family) !important;
  font-style: var(--font-accent-style);
  font-weight: var(--font-accent-weight);
  letter-spacing: var(--font-accent-letter-spacing);
  text-transform: var(--font-accent-text-transform);
  font-size: calc(1.25rem * var(--font-accent-scale));
}

.accent-font--2xl {
  font-family: var(--font-accent-family) !important;
  font-style: var(--font-accent-style);
  font-weight: var(--font-accent-weight);
  letter-spacing: var(--font-accent-letter-spacing);
  text-transform: var(--font-accent-text-transform);
  font-size: calc(1.5rem * var(--font-accent-scale));
}

.accent-font--3xl {
  font-family: var(--font-accent-family) !important;
  font-style: var(--font-accent-style);
  font-weight: var(--font-accent-weight);
  letter-spacing: var(--font-accent-letter-spacing);
  text-transform: var(--font-accent-text-transform);
  font-size: calc(1.875rem * var(--font-accent-scale));
}

.accent-font--4xl {
  font-family: var(--font-accent-family) !important;
  font-style: var(--font-accent-style);
  font-weight: var(--font-accent-weight);
  letter-spacing: var(--font-accent-letter-spacing);
  text-transform: var(--font-accent-text-transform);
  font-size: calc(2.25rem * var(--font-accent-scale));
}

/* Weight variations */
.accent-font--light {
  font-family: var(--font-accent-family) !important;
  font-style: var(--font-accent-style);
  font-weight: 300;
  letter-spacing: var(--font-accent-letter-spacing);
  text-transform: var(--font-accent-text-transform);
}

.accent-font--normal {
  font-family: var(--font-accent-family) !important;
  font-style: var(--font-accent-style);
  font-weight: 400;
  letter-spacing: var(--font-accent-letter-spacing);
  text-transform: var(--font-accent-text-transform);
}

.accent-font--medium {
  font-family: var(--font-accent-family) !important;
  font-style: var(--font-accent-style);
  font-weight: 500;
  letter-spacing: var(--font-accent-letter-spacing);
  text-transform: var(--font-accent-text-transform);
}

.accent-font--semibold {
  font-family: var(--font-accent-family) !important;
  font-style: var(--font-accent-style);
  font-weight: 600;
  letter-spacing: var(--font-accent-letter-spacing);
  text-transform: var(--font-accent-text-transform);
}

.accent-font--bold {
  font-family: var(--font-accent-family) !important;
  font-style: var(--font-accent-style);
  font-weight: 700;
  letter-spacing: var(--font-accent-letter-spacing);
  text-transform: var(--font-accent-text-transform);
}

.accent-font--extrabold {
  font-family: var(--font-accent-family) !important;
  font-style: var(--font-accent-style);
  font-weight: 800;
  letter-spacing: var(--font-accent-letter-spacing);
  text-transform: var(--font-accent-text-transform);
}

/* Style variations */
.accent-font--italic {
  font-family: var(--font-accent-family) !important;
  font-style: italic;
  font-weight: var(--font-accent-weight);
  letter-spacing: var(--font-accent-letter-spacing);
  text-transform: var(--font-accent-text-transform);
}

/* Text transform overrides */
.accent-font--uppercase {
  font-family: var(--font-accent-family) !important;
  font-style: var(--font-accent-style);
  font-weight: var(--font-accent-weight);
  letter-spacing: var(--font-accent-letter-spacing);
  text-transform: uppercase;
}

.accent-font--lowercase {
  font-family: var(--font-accent-family) !important;
  font-style: var(--font-accent-style);
  font-weight: var(--font-accent-weight);
  letter-spacing: var(--font-accent-letter-spacing);
  text-transform: lowercase;
}

.accent-font--capitalize {
  font-family: var(--font-accent-family) !important;
  font-style: var(--font-accent-style);
  font-weight: var(--font-accent-weight);
  letter-spacing: var(--font-accent-letter-spacing);
  text-transform: capitalize;
}

.accent-font--none {
  font-family: var(--font-accent-family) !important;
  font-style: var(--font-accent-style);
  font-weight: var(--font-accent-weight);
  letter-spacing: var(--font-accent-letter-spacing);
  text-transform: none;
}

/* Combination classes for common use cases */
.accent-font--highlight {
  font-family: var(--font-accent-family) !important;
  font-style: var(--font-accent-style);
  font-weight: 600;
  letter-spacing: var(--font-accent-letter-spacing);
  text-transform: var(--font-accent-text-transform);
  font-size: calc(1.125rem * var(--font-accent-scale));
}

.accent-font--badge {
  font-family: var(--font-accent-family) !important;
  font-style: var(--font-accent-style);
  font-weight: 500;
  letter-spacing: var(--font-accent-letter-spacing);
  text-transform: uppercase;
  font-size: calc(0.75rem * var(--font-accent-scale));
}

.accent-font--caption {
  font-family: var(--font-accent-family) !important;
  font-style: var(--font-accent-style);
  font-weight: var(--font-accent-weight);
  letter-spacing: var(--font-accent-letter-spacing);
  text-transform: var(--font-accent-text-transform);
  font-size: calc(0.875rem * var(--font-accent-scale));
  opacity: 0.8;
}

.accent-font--quote {
  font-family: var(--font-accent-family) !important;
  font-style: italic;
  font-weight: var(--font-accent-weight);
  letter-spacing: var(--font-accent-letter-spacing);
  text-transform: none;
  font-size: calc(1.25rem * var(--font-accent-scale));
}

/* Responsive utilities */
@media (max-width: 767px) {
  .accent-font--responsive {
    font-size: calc(0.875rem * var(--font-accent-scale)) !important;
  }
  
  .accent-font--3xl,
  .accent-font--4xl {
    font-size: calc(1.5rem * var(--font-accent-scale)) !important;
  }
}

/* Utility for removing accent font */
.no-accent-font {
  font-family: var(--font-body-family) !important;
  font-style: var(--font-body-style) !important;
  font-weight: var(--font-body-weight) !important;
  letter-spacing: var(--letter-spacing-body) !important;
  text-transform: none !important;
}

/* Force accent font on common accent text elements */
.new-hero-accent-text,
.accent-text,
.global-accent-text,
.custom-accent-text {
  font-family: var(--font-accent-family, var(--font-body-family)) !important;
}

/* Override any JavaScript-generated styles with maximum specificity */
html body .shopify-section .accent-font,
html body .shopify-section .new-hero-accent-text.accent-font {
  font-family: var(--font-accent-family, var(--font-body-family)) !important;
  font-style: var(--font-accent-style, normal) !important;
  font-weight: var(--font-accent-weight, 400) !important;
  letter-spacing: var(--font-accent-letter-spacing, 0px) !important;
  text-transform: var(--font-accent-text-transform, none) !important;
}

{% endcomment %}
/* Debug styles - remove these after testing */
.accent-font::before {
  content: 'ACCENT: ' var(--font-accent-family, 'NOT_SET');
  position: absolute;
  top: -20px;
  left: 0;
  font-size: 10px;
  color: red;
  background: yellow;
  padding: 2px;
  z-index: 9999;
  pointer-events: none;
} 