/* Basic, theme-friendly styling */
.ob-wrap{max-width:none;width:100%;margin:24px 0;padding:0 12px}
.ob-section{background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:14px;padding:18px;margin:16px 0;box-shadow:0 3px 10px rgba(0,0,0,.04)}
.ob-muted{opacity:.7;font-size:.95em;margin-bottom:10px}
.ob-notice{padding:12px 14px;border-radius:12px;background:rgba(0,0,0,.04)}
.ob-notice.ob-success{background:rgba(0,150,80,.08)}
.ob-notice.ob-error{background:rgba(200,0,0,.08)}
.ob-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.ob-card{display:flex;gap:14px;border:1px solid rgba(0,0,0,.08);border-radius:14px;overflow:hidden;background:#fff}
.ob-card--small{flex-direction:column;gap:0}
.ob-card__img{width:180px;object-fit:cover}
.ob-card--small .ob-card__img{width:100%;height:130px}
.ob-card__body{padding:14px;flex:1}
.ob-card__title{margin:0 0 6px;font-size:1.1rem;font-weight:700}
.ob-card__meta{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px}
.ob-price{font-weight:700}
.ob-link{font-size:.95em;text-decoration:underline}
.ob-card__actions{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}
.ob-label{display:flex;flex-direction:column;gap:6px;font-size:.95em}
.ob-input{padding:10px 12px;border-radius:10px;border:1px solid rgba(0,0,0,.18);min-width:140px}
.ob-btn{padding:10px 14px;border-radius:12px;border:1px solid rgba(0,0,0,.15);background:#f8f8f8;cursor:pointer;font-weight:700}
.ob-btn:hover{filter:brightness(.98)}
.ob-btn--primary{background:#111;color:#fff;border-color:#111}
.ob-toggle-upsell.is-active{background:rgba(0,0,0,.06)}
.ob-toast{margin-top:10px;padding:10px 12px;border-radius:12px}
.ob-toast.is-ok{background:rgba(0,150,80,.08)}
.ob-toast.is-err{background:rgba(200,0,0,.08)}
.ob-table{width:100%;display:block;border:1px solid rgba(0,0,0,.08);border-radius:14px;overflow:hidden}
.ob-table__head,.ob-table__row{display:grid;grid-template-columns: 2fr 1fr 1fr 1fr auto;gap:10px;align-items:center;padding:12px 12px}
.ob-table__head{background:rgba(0,0,0,.03);font-weight:700}
.ob-table__row{border-top:1px solid rgba(0,0,0,.06)}
.ob-cell--title{display:flex;gap:12px;align-items:center}
.ob-thumb{width:54px;height:54px;object-fit:cover;border-radius:10px}
.ob-title{font-weight:700}
.ob-qty,.ob-upsell-qty{padding:8px 10px;border-radius:10px;border:1px solid rgba(0,0,0,.18);width:110px}
.ob-linkbtn{background:none;border:none;color:#000;text-decoration:underline;cursor:pointer;padding:0}
.ob-summary{margin-top:14px;display:grid;gap:8px}
.ob-summary__row{display:flex;justify-content:space-between;align-items:center}
.ob-summary__row--total{font-size:1.05rem}
.ob-form__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.ob-form__grid label{display:flex;flex-direction:column;gap:6px}
.ob-form__grid input:not([type="checkbox"]):not([type="radio"]),.ob-form__grid textarea{padding:10px 12px;border-radius:10px;border:1px solid rgba(0,0,0,.18);width:100%;box-sizing:border-box}
.ob-form__wide{grid-column:1 / -1}
.ob-checkbox{flex-direction:row!important;align-items:center;gap:10px}
.ob-checkbox input[type="checkbox"]{width:14px;height:14px;flex:0 0 auto;padding:0;border-radius:0;margin:0}
.ob-checkbox .ob-privacy-text{line-height:1.4;flex:1;min-width:0}
.ob-checkbox a{color:#22254e}
.ob-info{margin-top:12px}
@media (max-width:700px){
  .ob-date-field{grid-column:1 / -1}

  .ob-card{flex-direction:column}
  .ob-card__img{width:100%;height:160px}
  .ob-table__head,.ob-table__row{grid-template-columns: 1fr 1fr;grid-auto-rows:auto}
  .ob-table__head div:nth-child(3), .ob-table__head div:nth-child(4), .ob-table__head div:nth-child(5){display:none}
  .ob-table__row > div{padding:4px 0}
  .ob-table__row .ob-linkbtn{justify-self:end}
  .ob-form__grid{grid-template-columns:1fr}
}


/* Minimal product shortcode */
.ob-mini{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}
.ob-title-link{font-weight:700;text-decoration:underline}
.ob-desc{margin-top:4px;font-size:.92em;opacity:.78;line-height:1.35;margin-bottom:6px}

/* Diagonal ribbon for upsells */
.ob-upsell-row, .ob-card--small{position:relative}
.ob-ribbon{position:absolute;top:10px;left:-34px;transform:rotate(-35deg);pointer-events:none}
.ob-ribbon span{display:inline-block;padding:6px 46px;background:#E84E1B;color:#fff;font-weight:700;font-size:.8em;border-radius:10px;box-shadow:0 3px 10px rgba(0,0,0,.18)}
.ob-table--upsells .ob-table__row{position:relative}

.ob-js .ob-upsell-save{display:none;}

.ob-upsells-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
@media (max-width: 980px){.ob-upsells-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width: 640px){.ob-upsells-grid{grid-template-columns:1fr;}}
.ob-card__img img{width:100%;height:160px;object-fit:cover;display:block}
.ob-upsell-save{display:none !important}
.ob-added-msg{margin-top:8px;font-weight:600;}

/* Upsells: fixed max 3 per row without stretching */
.ob-grid{display:grid;grid-template-columns:repeat(3,minmax(0,360px));gap:18px;justify-content:start;align-content:start}
@media (max-width: 1100px){.ob-grid{grid-template-columns:repeat(2,minmax(0,360px));}}
@media (max-width: 720px){.ob-grid{grid-template-columns:1fr;}}
/* Make sure images don't stretch */
.ob-card__img img{width:100%;height:160px;object-fit:cover;display:block}
/* Hide save button text for upsell qty (autosave) */
.ob-upsell-save{display:none !important}

/* Brand styling overrides (buttons/inputs) */
:root{--ob-accent:#B8CC00;--ob-accent-hover:#5ec5ed;}

/* Product shortcode: deelnemers input + button */
.ob-mini .ob-input{border-radius:0}
.ob-mini .ob-btn{background:var(--ob-accent);border-color:var(--ob-accent);color:#fff;border-radius:0}
.ob-mini .ob-btn:hover{background:var(--ob-accent-hover);border-color:var(--ob-accent-hover);filter:none}
.ob-mini .ob-toggle-upsell.is-active{background:#5EC5ED;border-color:#5EC5ED;color:#fff}
.ob-mini .ob-toggle-upsell.is-active:hover{background:#5EC5ED;border-color:#5EC5ED;filter:none;color:#fff}


/* Upsells: toevoegen/verwijder button */
.ob-toggle-upsell{background:var(--ob-accent);border-color:var(--ob-accent);color:#fff;border-radius:0}
.ob-toggle-upsell:hover{background:var(--ob-accent-hover);border-color:var(--ob-accent-hover);filter:none}

/* Form fields: consistent height (incl. email) */
.ob-form__grid input:not([type="checkbox"]):not([type="radio"]),.ob-form__grid textarea{box-sizing:border-box;-webkit-appearance:none;appearance:none;line-height:1.2}
.ob-form__grid input{min-height:42px}

/* Submit: full width + brand */
.ob-form .ob-btn--primary{background:var(--ob-accent);border-color:var(--ob-accent);color:#fff;border-radius:0;width:100%}
.ob-form .ob-btn--primary:hover{background:var(--ob-accent-hover);border-color:var(--ob-accent-hover);filter:none}

/* Color system: use brand text color everywhere */
.ob-wrap{color:#22254e}
.ob-wrap h1,.ob-wrap h2,.ob-wrap h3,.ob-wrap h4,.ob-wrap h5,.ob-wrap h6{color:#22254e}
.ob-link,.ob-title-link,.ob-linkbtn{color:#22254e}
.ob-linkbtn:hover,.ob-link:hover,.ob-title-link:hover{opacity:.9}

/* Upsell cards: a bit more breathing room between description and button */
.ob-card--small .ob-card__actions{margin-top:5px}

/* More space between info text and submit button */
.ob-info{margin-bottom:10px}

.ob-privacy-text{display:inline;}
.ob-privacy-link{color:#22254e;}


/* ===== Custom Remove Button Styling v1.3.20 ===== */

/* Overzicht - Verwijder (activiteiten) */
#ob-overview .ob-linkbtn.ob-remove {
    background: none !important;
    border: none !important;
    color: #22254e !important;
    padding: 0 !important;
    text-decoration: none !important;
    box-shadow: none !important;
}

#ob-overview .ob-linkbtn.ob-remove:hover,
#ob-overview .ob-linkbtn.ob-remove:focus {
    background: none !important;
    border: none !important;
    color: #22254e !important;
    text-decoration: none !important;
    box-shadow: none !important;
}

/* Upsell - Verwijder (alleen wanneer actief) */
#ob-overview .ob-toggle-upsell.is-active {
    background: #b8cc00 !important;
    color: #ffffff !important;
    border-color: #b8cc00 !important;
}

#ob-overview .ob-toggle-upsell.is-active:hover,
#ob-overview .ob-toggle-upsell.is-active:focus {
    background: #5EC5ED !important;
    color: #ffffff !important;
    border-color: #5EC5ED !important;
}


/* ===== Add-to-quote confirmation modal ===== */
html.ob-modal-open{overflow:hidden}
.ob-modal{position:fixed;inset:0;z-index:99999;display:none}
.ob-modal.is-open{display:block}
.ob-modal__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.4)}
.ob-modal__panel{position:relative;max-width:560px;margin:10vh auto 0;background:#fff;border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,.25);padding:18px 18px 16px;width:calc(100% - 28px)}
.ob-modal__close{position:absolute;right:10px;top:10px;border:none;background:transparent;font-size:28px;line-height:1;cursor:pointer;color:#22254e}
.ob-modal__title{font-size:1.2rem;font-weight:800;margin-bottom:6px;color:#22254e}
.ob-modal__msg{font-size:1rem;line-height:1.4;color:#22254e;opacity:.92}
.ob-modal__product{font-weight:800}
.ob-modal__actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:16px}
.ob-modal__actions .ob-btn{border-radius:12px}
.ob-modal__view{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
@media (max-width:520px){
  .ob-modal__panel{margin:12vh auto 0}
  .ob-modal__actions{flex-direction:column}
  .ob-modal__actions .ob-btn, .ob-modal__view{width:100%}
}



/* ===== Floating quote button ===== */
.ob-floating-quote{
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:9998;
  display:flex;
  align-items:center;
  gap:8px;
  background:#b8cc00;
  color:#fff !important;
  text-decoration:none;
  border-radius:999px;
  padding:14px 18px;
  box-shadow:0 10px 24px rgba(0,0,0,.18);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(12px);
  transition:opacity .2s ease, transform .2s ease, visibility .2s ease;
}
.ob-floating-quote.is-visible{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0);
}
.ob-floating-quote:hover,
.ob-floating-quote:focus{
  background:#5EC5ED;
  color:#fff !important;
  text-decoration:none;
}
.ob-floating-quote__icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:22px;
  height:22px;
  flex:0 0 22px;
}
.ob-floating-quote__icon svg{
  width:22px;
  height:22px;
  display:block;
  fill:currentColor;
}
.ob-floating-quote__count{
  font-weight:800;
  line-height:1;
  white-space:nowrap;
  margin-right:2px;
}
.ob-floating-quote__label{
  font-weight:700;
  line-height:1.1;
  white-space:nowrap;
}
@media (max-width:700px){
  .ob-floating-quote{
    right:14px;
    bottom:14px;
    left:auto;
    justify-content:flex-start;
    padding:14px 16px;
  }
}