/* Bundle selector (templates/storefront/_bundle_selector.html.twig). Plain colours with
   custom-property hooks, so a theme restyles it without touching this file. */
.dc-bundles { border: 0; margin: 20px 0 0; padding: 0; min-width: 0; display: grid; gap: 10px; }
.dc-bundles__heading { padding: 0; margin: 0 0 4px; font-weight: 800; font-size: 14px; }
.dc-bundle {
    position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px;
    align-items: center; min-height: 56px; padding: 12px 14px; cursor: pointer;
    border: 1px solid var(--bundle-border, var(--dc-border, #d6d9de)); border-radius: 10px;
    background: transparent; color: inherit;
}
.dc-bundle.is-selected, .dc-bundle:has(.dc-bundle__input:checked) {
    border: 2px solid var(--bundle-selected-border, currentColor);
    padding: 11px 13px;
    background: var(--bundle-surface, var(--dc-surface, #f6f7f9));
}
.dc-bundle:has(.dc-bundle__input:focus-visible) { outline: 2px solid currentColor; outline-offset: 2px; }
.dc-bundle__input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.dc-bundle__main { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; min-width: 0; }
.dc-bundle__name {
    font-weight: 800; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.dc-bundle__badge {
    font-size: 11px; font-weight: 800; line-height: 1; padding: 4px 8px; border-radius: 999px; color: #fff;
    background: var(--bundle-accent, var(--dc-accent, #1d4ed8)); white-space: nowrap;
}
.dc-bundle__badge--success { background: #15803d; }
.dc-bundle__badge--warning { background: #b45309; }
.dc-bundle__badge--danger { background: #b91c1c; }
.dc-bundle__badge--neutral { background: #475569; }
.dc-bundle__note { font-size: 12px; opacity: .75; flex-basis: 100%; }
.dc-bundle__money { display: grid; justify-items: end; white-space: nowrap; }
.dc-bundle__price { font-size: 16px; font-weight: 800; white-space: nowrap; }
.dc-bundle__compare { font-size: 12px; opacity: .65; white-space: nowrap; }
.dc-bundle__sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.dc-bundle__help { grid-column: 1 / -1; font-size: 12px; opacity: .8; }
.dc-bundle.is-unavailable { opacity: .5; cursor: not-allowed; }
@media (max-width: 767px) {
    .dc-bundle__main { align-items: flex-start; }
}