/* Collection contexts only. Native product loop intentionally retains WooCommerce styling. */
body.cm-collection-page { background:#000; color:#fff; }
.cm-col-system { width:100%; min-width:0; }
.cm-col-system *, .cm-col-system *::before, .cm-col-system *::after { box-sizing:border-box; }
.cm-col-system [hidden] { display:none!important; }
.cm-col-system a { color:inherit; }
.cm-col-system :focus-visible { outline:2px solid var(--hover-color,#E50068); outline-offset:4px; }
.cm-col-banner,.cm-col-filters {
 display:var(--visible); position:relative; box-sizing:border-box; min-width:min(240px,100%);
 width:min(var(--width),calc(100% - min(var(--margin-left),15%) - min(var(--margin-right),15%)));
 max-width:var(--max-width); margin:var(--margin-top) auto var(--margin-bottom);
 transform:translateX(calc((min(var(--margin-left),15vw) - min(var(--margin-right),15vw))/2));
 padding:var(--padding-top) min(var(--padding-right),15%) var(--padding-bottom) min(var(--padding-left),15%);
 background:var(--background); border:var(--border-width) solid var(--border-color); border-radius:var(--radius);
}
.cm-col-banner { isolation:isolate; overflow:hidden; min-height:var(--frame-min); aspect-ratio:var(--frame-ratio); }
.cm-col-art { position:absolute; inset:var(--padding-top) min(var(--padding-right),15%) var(--padding-bottom) min(var(--padding-left),15%); z-index:-1; display:block; }
.cm-col-art img { display:block; width:100%; height:100%; object-fit:var(--fit); object-position:var(--position-x) var(--position-y); }
.cm-col-banner-content { min-height:inherit; display:flex; flex-direction:column; }
.cm-col-copy { margin-block:auto; padding-block:clamp(16px,3vw,48px); overflow-wrap:anywhere; }
.cm-col-title,.cm-col-subtitle,.cm-col-description { max-width:100%; overflow-wrap:anywhere; }
.cm-col-title,.cm-col-breadcrumbs {
 display:var(--visible); font-family:var(--font); font-size:var(--size); font-weight:var(--weight);
 letter-spacing:var(--tracking); line-height:var(--leading); text-align:var(--align); color:var(--color);
 padding:var(--padding-top) min(var(--padding-right),15%) var(--padding-bottom) min(var(--padding-left),15%);
 margin:var(--margin-top) min(var(--margin-right),15%) var(--margin-bottom) min(var(--margin-left),15%);
}
.cm-col-subtitle { display:var(--subtitle-visible); font-family:var(--subtitle-font);font-size:var(--subtitle-size);font-weight:var(--subtitle-weight);letter-spacing:var(--subtitle-tracking);line-height:var(--subtitle-leading);text-align:var(--subtitle-align);color:var(--subtitle-color);margin:12px 0 0; }
.cm-col-description { display:var(--description-visible);font-family:var(--description-font);font-size:var(--description-size);font-weight:var(--description-weight);letter-spacing:var(--description-tracking);line-height:var(--description-leading);text-align:var(--description-align);color:var(--description-color);margin:12px 0 0; }
.cm-col-subtitle,.cm-col-description { margin-inline:min(var(--padding-left),15%) min(var(--padding-right),15%); }
.cm-col-description>* { max-width:100%; } .cm-col-description img { height:auto; }
.cm-col-description p { margin-block:0 12px; }
/* Title styles also supply independent optional-copy typography to the common parent. */
.cm-col-copy { font-family:system-ui,sans-serif; container-type:inline-size; }
.cm-col-title { font-size:min(var(--size),30cqi);letter-spacing:min(var(--tracking),3cqi); }
.cm-col-subtitle { font-size:min(var(--subtitle-size),30cqi);letter-spacing:min(var(--subtitle-tracking),3cqi); }
.cm-col-description { font-size:min(var(--description-size),30cqi);letter-spacing:min(var(--description-tracking),3cqi); }
.cm-col-breadcrumbs ol { display:flex; justify-content:var(--align-items); align-items:center; flex-wrap:wrap; gap:var(--gap); list-style:none; margin:0; padding:0; container-type:inline-size; }
.cm-col-breadcrumbs li { display:inline-flex; align-items:center; gap:var(--gap); min-width:0; max-width:100%; overflow-wrap:anywhere; }
.cm-col-breadcrumbs li { font-size:min(var(--size),30cqi);letter-spacing:min(var(--tracking),3cqi); }
.cm-col-breadcrumbs a,.cm-col-breadcrumbs span { min-width:0; }
.cm-col-breadcrumbs li+li::before { content:var(--separator-text); color:var(--separator-color); }
.cm-col-breadcrumbs [aria-current] { color:var(--active-color); }
.cm-col-breadcrumbs a:hover,.cm-col-breadcrumbs a:focus-visible { color:var(--hover-color); }
.cm-col-filters { font-family:var(--font);font-size:var(--size);font-weight:var(--weight);color:var(--color); }
.cm-col-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:var(--gap-y) var(--gap-x); }
.cm-col-count { margin:0; }
.cm-col-sort { margin-left:auto; display:flex;align-items:center;flex-wrap:wrap;gap:var(--gap-y) var(--gap-x);min-width:0;max-width:100%; }
.cm-col-sort label { white-space:nowrap; }
.cm-col-filters select,.cm-col-filters input,.cm-col-button {
 font:inherit; min-height:var(--control-height);max-width:100%;min-width:0;
 padding:8px var(--control-spacing);border:1px solid var(--border-color);border-radius:var(--radius);
}
.cm-col-filters select,.cm-col-filters input { background:var(--background);color:var(--color); }
.cm-col-button { cursor:pointer; background:var(--button-background);color:var(--button-color);display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:normal; }
.cm-col-button:hover,.cm-col-button:focus-visible { background:var(--hover-background);color:var(--hover-color); }
.cm-col-button svg { flex:none;width:var(--icon-size);height:var(--icon-size);color:var(--icon-color); }
.cm-col-chips { display:flex;flex-wrap:wrap;gap:var(--gap-y) var(--gap-x);padding:0;list-style:none;margin:var(--gap-y) 0 0; }
.cm-col-chips a { display:inline-flex;align-items:center;min-height:44px;max-width:100%;padding:6px 10px;border:1px solid var(--border-color);border-radius:var(--radius);overflow-wrap:anywhere; }
.cm-col-chips a:hover { color:var(--hover-color); }
.cm-col-drawer { box-sizing:border-box;color:var(--color);background:var(--drawer-background);font:inherit;max-width:100%;position:static;width:100%;margin:var(--gap-y) 0 0;border:1px solid var(--border-color);padding:var(--drawer-spacing); }
.cm-col-drawer.cm-col-modal { position:fixed;inset:0 0 0 auto;width:min(var(--drawer-width),100vw);max-width:100vw;height:100dvh;max-height:100dvh;margin:0;border:0;border-left:1px solid var(--border-color);overflow:auto;overscroll-behavior:contain; }
.cm-col-drawer::backdrop { background:rgb(0 0 0 / .72); }
.cm-col-drawer-head { display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px; }
.cm-col-drawer h2 { font-size:1.25em;margin:0; }
.cm-col-drawer form { display:grid;gap:var(--drawer-spacing);margin-top:var(--drawer-spacing); }
.cm-col-field { display:grid;gap:8px;min-width:0; }
.cm-col-field select,.cm-col-field input { width:100%; }
.cm-col-price { border:1px solid var(--border-color);min-width:0;padding:12px;display:grid;gap:12px;margin:0; }
.cm-col-price p { margin:0; }
.cm-col-price input:disabled { opacity:.5;cursor:not-allowed; }
@media(max-width:767px) {
 .cm-col-toolbar { align-items:stretch; }
 .cm-col-sort { flex:1 1 165px;gap:8px; }
 .cm-col-sort label { position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%); }
 .cm-col-sort select { flex:1 1 100px;width:100px; }
 .cm-col-count { flex-basis:100%;order:3; }
}
@media(prefers-reduced-motion:no-preference) { .cm-col-button { transition:background-color .15s,color .15s; } }
/* Public empty state; the inactive device copy is absent from the accessibility tree. */
.cm-col-empty,.cm-col-empty * { box-sizing:border-box; }
.cm-col-empty { display:var(--e-visible); min-width:0; max-width:1400px; width:calc(100% - min(var(--e-margin-left),10%) - min(var(--e-margin-right),10%)); margin:var(--e-margin-top) auto var(--e-margin-bottom); padding:var(--e-padding-top) min(var(--e-padding-right),10%) var(--e-padding-bottom) min(var(--e-padding-left),10%); transform:translateX(calc((min(var(--e-margin-left),10vw) - min(var(--e-margin-right),10vw))/2)); background:var(--e-background); text-align:var(--e-align); color:var(--e-color); font-family:var(--e-font); font-weight:var(--e-weight); line-height:var(--e-leading); overflow-wrap:anywhere; container-type:inline-size; }
.cm-col-empty h2 { margin:0; color:var(--e-color); font:inherit; font-size:min(var(--e-size),20cqi); letter-spacing:min(var(--e-tracking),2cqi); }
.cm-col-empty p { margin:12px 0 0; color:var(--e-description-color); font-size:var(--e-description-size); }
.cm-col-empty-action { display:var(--e-action-visible); align-items:center; justify-content:center; max-width:100%; min-height:44px; margin-top:20px; padding:10px min(var(--e-action-padding),10%); border-radius:var(--e-action-radius); background:var(--e-action-background); color:var(--e-action-color); font-size:var(--e-action-size); text-decoration:none; }
.cm-col-empty-action:hover,.cm-col-empty-action:focus-visible { background:var(--e-action-hover-background); color:var(--e-action-hover-color); }
.cm-col-empty-action:focus-visible { outline:2px solid var(--e-action-hover-background); outline-offset:4px; }
.cm-col-empty--mobile { display:none; }
@media(max-width:767px) { .cm-col-empty--desktop { display:none; } .cm-col-empty--mobile { display:block; } }

/* Collection labels may contain intentional repeated spaces. */
.cm-col-title { white-space: pre-wrap; }
