/* Pure Woo Commerce Pro: add-on-blok "Maak het compleet".
   Eigen blok onder de extra velden. Breedte-vangnet met !important zodat een
   flex-rij van een theme hem nooit meer platdrukt (CK-les 2026-08-07).
   currentColor-basis voor licht en donker; hover en focus expliciet. */

.pwc-addons {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    flex: 1 1 100% !important;
    box-sizing: border-box;
    margin: 0 0 1em;
    padding: 12px 14px;
    border: 1px solid rgba(128, 128, 128, 0.35);
    border-radius: 8px;
}

.pwc-addons__titel {
    display: block;
    font-weight: 600;
    margin: 0 0 8px;
}

.pwc-addons__optie {
    display: flex;
    align-items: center;
    gap: 8px;
    max-width: 100%;
    margin: 0 0 6px;
    cursor: pointer;
}

.pwc-addons__optie:last-child { margin-bottom: 0; }

.pwc-addons__optie input[type="checkbox"] {
    flex: 0 0 auto;
    margin: 0;
    accent-color: currentColor;
}

.pwc-addons__optie:hover .pwc-addons__naam,
.pwc-addons__optie:focus-within .pwc-addons__naam {
    text-decoration: underline;
}

.pwc-addons__naam {
    min-width: 0;
    overflow-wrap: anywhere;
}

.pwc-addons__prijs {
    font-size: 0.85em;
    opacity: 0.75;
    white-space: nowrap;
}

/* Variant-keuze (klant kiest): ingesprongen onder het vinkje. [hidden] wint
   altijd, ook van theme-display-regels. */
.pwc-addons__varianten {
    margin: 4px 0 8px 26px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
    max-width: 100%;
}

.pwc-addons__varianten[hidden] { display: none !important; }

.pwc-addons__variant {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: 100%;
}

.pwc-addons__variant-label { font-size: 0.9em; }

.pwc-addons__variant select { max-width: 100%; }

.pwc-addons__inbegrepen {
    font-size: 0.85em;
    opacity: 0.75;
    white-space: nowrap;
}

.pwc-addons__item--fout .pwc-addons__fout {
    font-size: 0.9em;
    font-style: italic;
    opacity: 0.85;
}

@media (max-width: 600px) {
    .pwc-addons { padding: 10px 12px; }
    .pwc-addons__varianten { margin-left: 0; }
}

/* Live totaalprijs vlak boven de winkelwagen-knop (addons.js). */
.pwc-totaalprijs {
    flex: 1 1 100%;
    width: 100%;
    margin: 6px 0;
    font-weight: 600;
}