/*
 * Custom Clothing Engine - front-end hooks for Elementor / Yellow Pencil.
 *
 * Every block the plugin prints has a stable class (.cce-widget, .cce-tracker-form, .cce-payment-schedule, .cce-stage,
 * .cce-custom-fields, .cce-option-group--size ...) - target THOSE in Elementor "Custom CSS" or Yellow Pencil, not the
 * Tailwind utility classes (changing "bg-black" would change every black thing on the site).
 *
 * --cce-accent is the brand colour of the plugin's buttons, badges and progress bars. Set it per widget in Elementor
 * (Style > Accent colour) or globally, e.g.:   .cce-widget { --cce-accent: #0f766e; }
 */
.cce-widget { --cce-accent: #000; }
.cce-widget .bg-black { background-color: var(--cce-accent); }
.cce-widget .border-black { border-color: var(--cce-accent); }
.cce-widget .bg-black:hover { filter: brightness(1.15); }
.cce-widget .cce-swatch { background-clip: padding-box; }
.screen-reader-text:not(:focus) { /* keep the visually-hidden helper working even without the theme */
  border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px;
}