.wcmm { --wcmm-product-accent: currentColor; --wcmm-columns: 4; margin-block: 1rem; }
/* Divi's module spacing controls own the outside spacing, in both builders. */
:where(.et_pb_module) .wcmm { margin-block: 0; }
:where(.et_pb_module) .wcmm :where(.wcmm-heading) { margin: 0; padding: 0; }
.wcmm ul { list-style: none; padding: 0; margin: 0; }
/* Divi loads its body/header/footer and #left-area list rules after this CSS. */
.wcmm > ul.wcmm-metrics, .wcmm > ul.wcmm-components,
#left-area .wcmm > ul.wcmm-metrics, #left-area .wcmm > ul.wcmm-components { list-style: none; padding: 0; margin: 0; line-height: inherit; }
.wcmm > ul.wcmm-metrics, .wcmm > ul.wcmm-components { display: grid; grid-template-columns: repeat(var(--wcmm-columns), minmax(0,1fr)); gap: 1rem; width: 100%; box-sizing: border-box; }
ul.wcmm-metrics > .wcmm-metric-item { display: flex; min-width: 0; box-sizing: border-box; align-items: center; justify-content: center; flex-direction: column; text-align: center; padding: 1rem; border: 2px solid var(--wcmm-item-accent, var(--wcmm-product-accent)); overflow-wrap: anywhere; }
ul.wcmm-metrics.wcmm-badge > .wcmm-metric-item { aspect-ratio: 1; border-radius: 50%; }
ul.wcmm-metrics.wcmm-list > .wcmm-metric-item { flex-direction: row; flex-wrap: wrap; justify-content: flex-start; text-align: start; gap: .4rem; padding: .75rem; border-width: 0 0 2px; }
.wcmm-metric-value { font-size: 1.8em; line-height: 1.2; color: var(--wcmm-item-accent, var(--wcmm-product-accent)); }
.wcmm-accent-background > .wcmm-metric-item { background-color: var(--wcmm-metric-background, transparent); color: var(--wcmm-metric-foreground, inherit); }
.wcmm-accent-background .wcmm-metric-value { color: var(--wcmm-metric-foreground, var(--wcmm-item-accent, var(--wcmm-product-accent))); }
.wcmm-components > .wcmm-component-item { display: flex; box-sizing: border-box; min-width: 0; align-items: center; gap: .8rem; padding: .75rem; border-inline-start: var(--wcmm-component-accent-width, 3px) solid var(--wcmm-item-accent, var(--wcmm-product-accent)); overflow-wrap: anywhere; }
.wcmm-components.wcmm-grid > :where(.wcmm-component-item) { flex-direction: column; text-align: center; align-items: center; border: var(--wcmm-component-accent-width, 1px) solid var(--wcmm-item-accent, var(--wcmm-product-accent)); padding: 1rem; }
.wcmm-component-content .wcmm-description { display: block; }
.wcmm-component-names { margin: .3rem 0 0; padding: 0; }
.wcmm-component-group-name { color: var(--wcmm-item-accent, var(--wcmm-product-accent)); }
.wcmm .wcmm-icon { width: 2.5rem; height: 2.5rem; object-fit: contain; }
.wcmm-svg-icon { display: inline-block; flex-shrink: 0; background-color: var(--wcmm-icon-colour); -webkit-mask: var(--wcmm-icon-mask) center / contain no-repeat; mask: var(--wcmm-icon-mask) center / contain no-repeat; }
.wcmm-highlight { border-inline-start: var(--wcmm-highlight-accent-width, .3rem) solid var(--wcmm-product-accent); padding: 1rem 1.5rem; background: var(--wcmm-highlight-background, #f7f7f7); color: var(--wcmm-highlight-foreground, inherit); }
.wcmm-highlight-icon-left { display: flex; align-items: center; gap: .8rem; }
.wcmm-highlight-icon-left > .wcmm-icon { flex-shrink: 0; }
.wcmm-highlight-content { min-width: 0; overflow-wrap: anywhere; }
.wcmm-highlight-filled .wcmm-heading { color: var(--wcmm-highlight-foreground, inherit); }
.wcmm-products { display: grid; grid-template-columns: repeat(var(--wcmm-columns),minmax(0,1fr)); gap: 1.5rem; }
.wcmm-product { border-top: .3rem solid var(--wcmm-product-accent); padding: 1rem; }
.wcmm-product img { max-width: 100%; height: auto; }
.wcmm-order_button :where(.wcmm-order-button) { display: inline-block; box-sizing: border-box; padding: .6em 1.2em; border: 2px solid currentColor; border-radius: 3px; font: inherit; text-align: center; text-decoration: none; cursor: pointer; }
.wcmm-order_button :where(.wcmm-order-button[disabled]) { background: #e0e0e0; color: #555; border-color: #ccc; opacity: 1; cursor: default; }
.wcmm-order-button-form { margin: 0; }
.wcmm-feedback label, .wcmm-collection dt { display: block; font-weight: 600; }
.wcmm-feedback textarea, .wcmm-feedback select { display: block; width: 100%; padding: .6rem; }
.wcmm-feedback :where(.wcmm-field, .wcmm-button, .wcmm-feedback-row, .wcmm-feedback-notice) { box-sizing: border-box; max-width: 100%; }
.wcmm-feedback :where(.wcmm-feedback-row) { margin: 0 0 1rem; padding: 0; }
.wcmm-feedback :where(.wcmm-form-label) { margin-bottom: .4rem; }
.wcmm-feedback :where(.wcmm-feedback-notice) { margin: 0 0 1rem; }
.wcmm-feedback-summary { margin: 0 0 1.5rem; }
.wcmm-feedback-summary dl { display: grid; grid-template-columns: auto 1fr; gap: .3rem 1rem; }
.wcmm-feedback-summary dd { margin: 0; }
.wcmm-feedback-product { display: flex; align-items: center; gap: 1rem; padding: .8rem 0; overflow-wrap: anywhere; }
.wcmm-feedback-product .wcmm-feedback-image { width: 80px; height: 80px; object-fit: cover; flex: 0 0 80px; border-radius: 6px; }
.wcmm-feedback-product p { margin: .3rem 0 0; }
.wcmm-feedback-review { min-width: 0; margin: 0 0 1.5rem; padding: 1rem; border: 1px solid #dcdcde; }
.wcmm-feedback-review legend { max-width: 100%; padding: 0 .4rem; font-weight: 600; overflow-wrap: anywhere; }
.wcmm-checkout-control .wcmm-field { display: block; width: 100%; box-sizing: border-box; }
.wcmm-checkout-control .wcmm-checkbox { accent-color: currentColor; }
.wcmm-collection dd { margin: 0 0 .7rem; }
.wcmm-qr svg { width: 180px; max-width: 100%; height: auto; }
.wcmm .screen-reader-text { clip-path: inset(50%); height: 1px; width: 1px; overflow: hidden; position: absolute; white-space: nowrap; }
.wcmm-nutrition-table { width: 100%; table-layout: fixed; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.wcmm-nutrition-table caption { text-align: left; font-weight: 600; margin-bottom: .75rem; }
.wcmm-nutrition-table th, .wcmm-nutrition-table td { padding: .7rem .5rem; border-bottom: 1px solid #dcdcde; text-align: left; vertical-align: top; overflow-wrap: anywhere; }
.wcmm-nutrition-table th:first-child { width: 40%; }
.wcmm-nutrition-table thead th { border-bottom: 2px solid currentColor; }
.wcmm-nutrition-table tbody th { font-weight: 400; }
.wcmm-nutrition-table td span { display: inline-block; }
.wcmm-nutrition-subrow th { padding-inline-start: 1rem; }
.wcmm :focus-visible, .wcmm-feedback :focus-visible { outline: 3px solid currentColor; outline-offset: 3px; }
@media(max-width:600px) { .wcmm > ul.wcmm-metrics, .wcmm > ul.wcmm-components, .wcmm-products { grid-template-columns: repeat(var(--wcmm-mobile-columns, 1),minmax(0,1fr)); } }
@media(prefers-reduced-motion:reduce) { .wcmm * { transition: none !important; } }