/* House of Bubbles — box configurator */
.hob-cfg{display:grid;grid-template-columns:1fr 340px;gap:clamp(1.5rem,3vw,2.5rem);align-items:start}
.hob-cfg__steps{display:flex;flex-direction:column;gap:1.75rem}
.hob-cfg__step{border:0;margin:0;padding:0;min-inline-size:0}
.hob-cfg__step legend{display:flex;align-items:center;gap:.6rem;font-weight:var(--hob-fw-black,800);font-size:1.2rem;color:var(--hob-espresso,#332B22);margin-bottom:.9rem;padding:0}
.hob-cfg__num{display:inline-flex;align-items:center;justify-content:center;width:1.9rem;height:1.9rem;border-radius:50%;background:var(--hob-olive,#6C673F);color:var(--hob-ivory,#F2F2F2);font-size:.95rem}
.hob-cfg__options{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem}

.hob-option{display:flex;flex-direction:column;gap:.2rem;text-align:left;cursor:pointer;
  background:var(--hob-white,#FFFFFF);border:2px solid var(--hob-border,#E2DED3);
  border-radius:var(--hob-radius-card,20px);padding:1rem 1.1rem;transition:border-color .2s,background .2s,transform .2s;font-family:inherit}
.hob-option:hover{transform:translateY(-2px);border-color:var(--hob-gold,#C1A46D)}
.hob-option.is-selected{border-color:var(--hob-olive,#6C673F);background:#fff;box-shadow:0 0 0 3px rgba(108,103,63,.12)}
.hob-option__row{display:flex;align-items:center;justify-content:space-between;gap:1rem;width:100%}
.hob-option__check{display:none;flex-shrink:0;align-items:center;justify-content:center;width:18px;height:18px}
.hob-option__check svg{display:block;width:100%;height:100%}
.hob-option.is-selected .hob-option__check{display:inline-flex}
.hob-option__title{font-weight:700;color:var(--hob-espresso,#332B22)}
.hob-option__desc{font-size:.85rem;color:var(--hob-text-muted,#6B6457)}

.hob-cfg__af{display:flex;gap:.75rem;align-items:flex-start;background:var(--hob-champagne,#DAD4C2);
  border-radius:var(--hob-radius-card,20px);padding:1rem 1.1rem;cursor:pointer;font-size:.95rem;line-height:1.4}
.hob-cfg__af input{margin-top:.2rem;width:1.1rem;height:1.1rem;accent-color:var(--hob-olive,#6C673F)}

.hob-cfg__summary{position:sticky;top:96px;background:var(--hob-espresso,#332B22);color:var(--hob-ivory,#F2F2F2);
  border-radius:var(--hob-radius-card,20px);padding:1.6rem 1.5rem}
.hob-cfg__summary h3{color:var(--hob-ivory,#F2F2F2);margin:0 0 1rem;font-size:1.25rem}
.hob-cfg__sum-list{list-style:none;margin:0 0 1rem;padding:0;display:flex;flex-direction:column;gap:.6rem}
.hob-cfg__sum-list li{display:flex;justify-content:space-between;gap:1rem;border-bottom:1px solid rgba(242,242,242,.14);padding-bottom:.55rem}
.hob-cfg__sum-list span{color:var(--hob-champagne,#DAD4C2);font-size:.9rem}
.hob-cfg__sum-list strong{color:var(--hob-ivory,#F2F2F2);text-align:right}
.hob-cfg__price{font-size:2rem;font-weight:var(--hob-fw-black,800);color:var(--hob-gold,#C1A46D);line-height:1}
.hob-cfg__price small{display:block;font-size:.85rem;font-weight:400;color:var(--hob-champagne,#DAD4C2);margin-top:.25rem}
.hob-cfg__excl{font-size:.82rem;color:var(--hob-champagne,#DAD4C2);opacity:.85;margin:.25rem 0 0}
.hob-cfg__excl:empty{display:none}
.hob-cfg__note{font-size:.78rem;color:var(--hob-champagne,#DAD4C2);opacity:.75;margin:.75rem 0 1rem}
.hob-cfg__summary .hob-btn--block{margin-top:.25rem}
.hob-cfg__hint{font-size:.8rem;color:var(--hob-champagne,#DAD4C2);text-align:center;margin:.6rem 0 0}
.hob-cfg__hint.is-hidden{display:none}

@media (max-width:820px){
  .hob-cfg{grid-template-columns:1fr}
  .hob-cfg__options{grid-template-columns:1fr 1fr}
  .hob-cfg__summary{position:static}
}
@media (max-width:480px){ .hob-cfg__options{grid-template-columns:1fr} }

/* Hello Elementor's reset.css zet button:hover/:focus op #c36 (roze). Overschrijven
   met hogere specificiteit + !important: hover = neutraal, geselecteerd = donkergroen. */
/* .hob-cfg-prefix (0,2,0) wint van de globale button{border:0 !important} (0,1,0). */
.hob-cfg .hob-option{border:2px solid var(--hob-border,#E2DED3) !important}
.hob-cfg .hob-option:hover, .hob-cfg .hob-option:focus, .hob-cfg .hob-option:focus-visible{background:var(--hob-surface,#FAF9F6) !important;border-color:var(--hob-gold,#C1A46D) !important;outline:none}
.hob-cfg .hob-option.is-selected, .hob-cfg .hob-option.is-selected:hover, .hob-cfg .hob-option.is-selected:focus{background:#5e6040 !important;border-color:#5e6040 !important;color:#eef1f0 !important}
.hob-cfg .hob-option.is-selected .hob-option__title, .hob-cfg .hob-option.is-selected .hob-option__desc{color:#eef1f0 !important}
