.ccmds-picker { margin: 0 0 1.2em; }
.ccmds-picker__label { margin: 0 0 .5em; }
.ccmds-picker__list { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
.ccmds-picker__item { margin: 0; }
.ccmds-swatch { display: flex; flex-direction: column; align-items: center; gap: 4px; width: 84px; padding: 6px; border: 1px solid #dcdcde; border-radius: 8px; text-decoration: none; color: inherit; text-align: center; transition: border-color .15s, box-shadow .15s; }
.ccmds-swatch:hover, .ccmds-swatch:focus-visible { border-color: currentColor; }
.is-selected .ccmds-swatch { border-color: var(--ccm-ps-accent, #05707A); box-shadow: 0 0 0 1px var(--ccm-ps-accent, #05707A); }
.ccmds-swatch__img { display: block; width: 70px; height: 70px; border-radius: 4px; overflow: hidden; background: #f3f4f6; }
.ccmds-swatch__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ccmds-swatch__name { font-size: 12px; line-height: 1.25; word-break: break-word; }
.ccmds-swatch__price { font-size: 12px; line-height: 1.25; font-weight: 600; }
.ccmds-swatch__price del { font-weight: 400; opacity: .6; }
.ccmds-swatch__price ins { text-decoration: none; }
.ccmds-swatch__note { font-size: 11px; color: #b32d2e; }
.is-out .ccmds-swatch__img { opacity: .5; }
.ccmds-moved { margin: 0 0 1em; }
.ccmds-moved__link { margin-top: .5em; }
@media (max-width: 480px) { .ccmds-swatch { width: 72px; } .ccmds-swatch__img { width: 58px; height: 58px; } }