.apr-tradein,
.apr-tradein * {
  box-sizing: border-box;
}

.apr-tradein button,
.apr-tradein a,
.apr-tradein .apr-thumb,
.apr-tradein .apr-link,
.apr-tradein .apr-chip {
  color: #111 !important;
}

.apr-nojs {
  border: 1px solid #e5c28b;
  background: #fff8ee;
  color: #6b4d16;
  border-radius: 12px;
  padding: 10px 12px;
  margin-bottom: 12px;
}

.apr-tradein {
  margin: 16px 0;
}

.apr-tradein__top {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  justify-content: space-between;
}

.apr-tradein__title h3 {
  margin: 0 0 6px 0;
}

.apr-tradein__title p {
  margin: 0;
  opacity: .85;
}

.apr-step {
  margin-top: 10px;
}

.apr-stephead {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  margin: 14px 0 6px;
}

.apr-steptitle {
  font-weight: 900;
  font-size: 24px;
  line-height: 1.2;
  margin: 8px 0 14px;
}

.apr-stepnav {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
  flex-wrap: wrap;
}

.apr-stepnav__dot {
  width: 36px;
  height: 36px;
  border-radius: 999px;
  border: 2px solid #d6d6d6;
  background: #fff;
  font-weight: 900;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.apr-stepnav__dot.is-active {
  border-color: #111;
}

.apr-stepnav__line {
  width: 28px;
  height: 3px;
  background: #e6e6e6;
  border-radius: 999px;
}

.apr-subhead {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 6px 0 6px;
}

.apr-selectedline {
  opacity: .85;
}

.apr-selectedline strong {
  font-weight: 900;
}

.apr-thumbs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 10px 0 14px;
}

@media (min-width: 768px) {
  .apr-thumbs {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.apr-thumb {
  position: relative;
  text-align: left;
  border: 1px solid #e6e6e6;
  border-radius: 14px;
  padding: 12px;
  background: #fff;
  cursor: pointer;
  transition: transform .08s ease, border-color .08s ease, box-shadow .08s ease;
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-height: 72px;
  color: #111 !important;
}

.apr-thumb:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 22px rgba(0,0,0,.06);
}

.apr-thumb.is-selected {
  border-color: #111;
}

.apr-thumb__title {
  font-weight: 800;
  color: #111 !important;
}

.apr-thumb__sub {
  opacity: .75;
  font-size: 13px;
  color: #111 !important;
}

.apr-thumb--missing-model .apr-thumb__title {
  text-transform: none !important;
}

.apr-thumb.is-loading {
  pointer-events: none;
  opacity: .85;
}

.apr-thumb__spinner {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 16px;
  height: 16px;
  border-radius: 999px;
  border: 2px solid rgba(0,0,0,.18);
  border-top-color: rgba(0,0,0,1);
  animation: aprspin .75s linear infinite;
}

.apr-actions {
  margin-top: 12px;
}

.apr-actions--split {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
}

.apr-btn {
  padding: 10px 14px;
  border-radius: 12px;
  border: 1px solid #ddd;
  background: #f5f5f5;
  color: #999 !important;
  cursor: not-allowed;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  gap: 10px;
  transition: all .15s ease;
}

.apr-btn[disabled] {
  background: #f5f5f5;
  color: #999 !important;
  border-color: #ddd;
  cursor: not-allowed;
  opacity: 1;
}

.apr-btn:not([disabled]) {
  background: #ff7a00;
  border-color: #ff7a00;
  color: #fff !important;
  cursor: pointer;
}

.apr-btn:not([disabled]):hover {
  background: #e66e00;
  border-color: #e66e00;
}

.apr-btn--ghost {
  background: #fff;
  color: #111 !important;
  border: 1px solid #d9d9d9;
  cursor: pointer;
}

.apr-btn--ghost:hover {
  background: #f7f7f7;
}

.apr-btn--secondary {
  background: #fff;
  color: #111 !important;
  border: 1px solid #d9d9d9;
  cursor: pointer;
}

.apr-btn--secondary:hover {
  background: #f7f7f7;
}

.apr-link {
  border: none;
  background: transparent;
  cursor: pointer;
  padding: 0;
  text-decoration: underline;
  opacity: .85;
}

.apr-card {
  border: 1px solid #e6e6e6;
  border-radius: 14px;
  padding: 12px;
  background: #fff;
}

.apr-line {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 6px 0;
}

.apr-note {
  margin-top: 10px;
  opacity: .85;
}

.apr-error {
  border: 1px solid #ffb3b3;
  background: #fff5f5;
  padding: 10px 12px;
  border-radius: 12px;
}

.apr-empty {
  opacity: .7;
  padding: 8px 0;
}

.apr-edit {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.apr-chip {
  border: 1px solid #d9d9d9;
  background: #fff;
  border-radius: 999px;
  padding: 8px 10px;
  cursor: pointer;
}

.apr-tipbox {
  border: 1px solid #eee;
  background: #fafafa;
  border-radius: 14px;
  padding: 12px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin: 8px 0 4px;
}

.apr-tipbox p {
  margin: 0;
  opacity: .9;
}

.apr-ghostlink {
  border: none;
  background: transparent;
  padding: 0;
  cursor: pointer;
  text-decoration: underline;
  opacity: .85;
  margin: 4px 0 2px;
}

.apr-whatsapp-help {
  margin-top: 12px;
}

.apr-whatsapp-help .apr-btn {
  width: 100%;
}

.apr-selected-product {
  margin: 12px 0 6px;
  padding: 12px;
  border: 1px solid #eee;
  border-radius: 14px;
  background: #fff;
  display: flex;
  gap: 12px;
  align-items: center;
}

.apr-selected-product__img img {
  border-radius: 10px;
  height: 100px !important;
  width: auto;
}

.apr-selected-product__label {
  font-size: 12px;
  opacity: .75;
  margin-bottom: 2px;
}

.apr-selected-product__title {
  font-weight: 900;
}

.apr-selected-product__price {
  margin-top: 4px;
  opacity: .9;
}

.apr-btn__spinner {
  width: 16px;
  height: 16px;
  border-radius: 999px;
  border: 2px solid rgba(255,255,255,.45);
  border-top-color: rgba(255,255,255,1);
  display: none;
  animation: aprspin .75s linear infinite;
}

.apr-btn--secondary .apr-btn__spinner,
.apr-btn--ghost .apr-btn__spinner {
  border-color: rgba(0,0,0,.25);
  border-top-color: rgba(0,0,0,1);
}

.apr-btn.is-loading .apr-btn__spinner {
  display: inline-block;
}

@keyframes aprspin {
  to {
    transform: rotate(360deg);
  }
}

.apr-tradein-box {
  border: 1px solid #e6e6e6;
  border-radius: 14px;
  padding: 14px;
  background: #fafafa;
  margin-top: 14px;
}

.apr-tradein-box__title {
  margin: 0 0 8px 0;
  font-size: 20px;
  line-height: 1.2;
}

.apr-tradein-box__text {
  margin-bottom: 12px;
  opacity: .9;
}

body.apr-modal-open {
  overflow: hidden !important;
}

.apr-tradein__modal[hidden] {
  display: none !important;
}

.apr-tradein__modal {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.55);
  z-index: 2147483647 !important;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  overflow: auto;
}

.apr-tradein__modal-inner {
  width: min(860px, 100%);
  background: #fff;
  border-radius: 16px;
  position: relative;
  margin: auto;
  max-height: calc(100vh - 32px);
  overflow: auto;
  padding: 14px;
}

.apr-tradein__close {
  position: sticky;
  top: 10px;
  float: right;
  width: 36px;
  height: 36px;
  border-radius: 12px;
  border: 1px solid #d9d9d9;
  background: #fff;
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
  color: #111 !important;
  z-index: 5;
  padding: 0 10px;
}

.indicatie-inruilwaarde {
  background: #dadada;
  border-radius: 10px;
  padding: 10px;
}

.apr-hide-brand-step .apr-step[data-step="1"] {
  display: none !important;
}

/* WhatsApp knop */
.apr-whatsapp-help .apr-btn,
.apr-result .apr-whatsapp-help .apr-btn {
  background: transparent !important;
  border: 1px solid #1A2744 !important;
  color: #1A2744 !important;
}

.apr-whatsapp-help .apr-btn:hover,
.apr-result .apr-whatsapp-help .apr-btn:hover {
  background: transparent !important;
  border-color: #1A2744 !important;
  color: #1A2744 !important;
}

/* Resultaat knoppen */
.apr-step[data-step="result"] .apr-actions .apr-btn {
  background: transparent !important;
  border: 1px solid #ff7a00 !important;
  color: #111 !important;
}

.apr-step[data-step="result"] .apr-actions .apr-btn:hover {
  background: transparent !important;
  border-color: #ff7a00 !important;
  color: #111 !important;
}

/*add card style standalone */
.apr-tradein--standalone {
  border: 1px solid #e6e6e6;
  background: #ffffff;
  border-radius: 18px;
  padding: 22px;
  box-shadow: 0 12px 35px rgba(0,0,0,0.06);
}

/* iets meer ademruimte tussen blokken */
.apr-tradein--standalone .apr-step {
  margin-top: 18px;
}

/* titel iets sterker maken binnen kaart */
.apr-tradein--standalone .apr-tradein__title h3 {
  margin-bottom: 8px;
}

/* subtiele afscheiding boven eerste stap */
.apr-tradein--standalone .apr-step:first-of-type {
  margin-top: 10px;
}

@media (max-width: 640px) {
  .apr-stephead,
  .apr-subhead,
  .apr-tipbox {
    flex-direction: column;
    align-items: flex-start;
  }

  .apr-stepnav {
    width: 100%;
    justify-content: flex-start;
  }

  .apr-line {
    flex-direction: column;
    align-items: flex-start;
  }

  .apr-actions--split {
    flex-direction: column;
    align-items: stretch;
  }

  .apr-selected-product {
    flex-direction: column;
    align-items: flex-start;
  }

  .apr-steptitle {
    font-size: 21px;
  }
}.apr-tradein--json .apr-json-value{font-size:clamp(25px,4vw,36px);margin:18px 0 10px}.apr-tradein--json .apr-json-intents{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0}.apr-tradein--json .apr-json-contact{margin:14px 0;padding:16px;border:1px solid #e6e6e6;border-radius:12px}.apr-tradein--json .apr-json-interest{display:block;width:100%;padding:12px;margin:10px 0;border:1px solid #ccc;border-radius:8px}.apr-tradein--json .apr-json-disclaimer{font-size:14px;opacity:.75}.apr-tradein--json .apr-error{color:#b91c1c}.apr-tradein--json .apr-stepnav{font-size:13px;opacity:.65}

/* 3.1 – rustige, mobielvriendelijke stappenwizard */
.apr-tradein--json{--apr-accent:#ed7600;max-width:780px;margin:20px auto;padding:clamp(18px,4vw,36px);border:1px solid #e7e9ed;border-radius:22px;background:#fff;box-shadow:0 12px 42px rgba(15,23,42,.045);color:#17202c;font-family:inherit}
.apr-tradein--json .apr-tradein__title h3{font-size:clamp(21px,3vw,27px);font-weight:750;letter-spacing:-.035em;color:#151c26}
.apr-tradein--json .apr-tradein__title p{color:#687381;font-size:14px;line-height:1.65}
.apr-tradein--json .apr-stephead{display:block;margin:25px 0 26px}
.apr-stephead__labels{display:flex;justify-content:space-between;gap:12px;margin-bottom:11px;color:#737f8b;font-size:11px;font-weight:750;letter-spacing:.06em}
.apr-tradein--json .apr-stepnav{display:flex;gap:5px;flex-wrap:nowrap;width:100%}
.apr-progress-segment{height:5px;border-radius:10px;flex:1;background:#eceef2;transition:background .2s ease}
.apr-progress-segment.is-complete{background:var(--apr-accent)}
.apr-tradein--json .apr-steptitle{font-size:clamp(21px,3.4vw,27px);line-height:1.22;letter-spacing:-.025em;font-weight:760;color:#17202c;margin:0 0 8px}
.apr-stephelp{margin:0 0 22px;color:#677483;font-size:14px;line-height:1.6}
.apr-tradein--json .apr-selectedline{font-size:12px;color:#6a7581;margin:0 0 14px;line-height:1.5}
.apr-tradein--json .apr-thumbs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0 0 22px}
.apr-tradein--json .apr-thumbs--list{grid-template-columns:1fr}
.apr-tradein--json .apr-thumbs--compact{grid-template-columns:repeat(2,minmax(0,1fr))}
.apr-tradein--json .apr-thumb{display:flex;flex-direction:row;align-items:center;text-align:left;gap:14px;min-height:86px;border:1.5px solid #e4e7eb;background:#fff;border-radius:15px;padding:17px;color:#17202c!important;box-shadow:none;transition:border-color .15s,box-shadow .15s,transform .15s;cursor:pointer}
.apr-tradein--json .apr-thumb:hover,.apr-tradein--json .apr-thumb:focus-visible{border-color:var(--apr-accent);box-shadow:0 5px 16px rgba(15,23,42,.07);transform:translateY(-1px)}
.apr-tradein--json .apr-thumb:focus-visible{outline:3px solid rgba(237,118,0,.22);outline-offset:2px}
.apr-thumb__icon{display:grid;place-items:center;flex:none;width:45px;height:45px;background:#f5f6f8;border-radius:11px;color:#253142;font-size:29px;line-height:1}
.apr-thumb__content{display:flex;flex:1;flex-direction:column;gap:5px;min-width:0}
.apr-tradein--json .apr-thumb__title{font-size:15px;line-height:1.35;font-weight:720;color:#1b2430!important}
.apr-tradein--json .apr-thumb__sub{font-size:12px;line-height:1.4;color:#73808d!important;opacity:1}
.apr-thumb__arrow{font-size:25px;line-height:1;color:#a0a8b2;flex:none}
.apr-tradein--json .apr-actions{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-top:22px;padding-top:17px;border-top:1px solid #edf0f3}
.apr-tradein--json .apr-link{font-size:13px;color:#65717d!important;text-decoration:none;padding:9px 0}
.apr-tradein--json .apr-link:hover{text-decoration:underline}
.apr-tradein--json .apr-link[hidden]{display:none!important}
.apr-tradein--json .apr-result-card{text-align:center;background:#f7f8fa;border:1px solid #edf0f3;border-radius:18px;padding:clamp(20px,4vw,32px);margin:10px 0 18px}
.apr-result-card__eyebrow{font-size:13px;font-weight:700;color:#278257;margin-bottom:14px}
.apr-result-card__model{font-size:14px;color:#677381;line-height:1.5;margin-bottom:10px}
.apr-result-card__value{font-size:clamp(27px,5vw,40px);font-weight:800;line-height:1.22;letter-spacing:-.04em;color:#151c26;overflow-wrap:anywhere}
.apr-result-card__message{font-size:14px;line-height:1.6;color:#505d6a;margin:14px 0 0}
.apr-result-card__disclaimer{font-size:12px;line-height:1.6;color:#7a8591;margin:16px 0 0}
.apr-tradein--json .apr-whatsapp-btn,.apr-tradein--json .apr-whatsapp-btn:not([disabled]){width:100%;display:flex;align-items:center;justify-content:center;padding:16px 20px;min-height:54px;border-radius:12px;border:1px solid #198754;background:#198754;color:#fff!important;font-size:15px;font-weight:750;cursor:pointer}
.apr-tradein--json .apr-whatsapp-btn:hover:not([disabled]){background:#137246;border-color:#137246}
.apr-tradein--json .apr-whatsapp-btn[disabled]{opacity:.7;cursor:wait}
.apr-result-note{text-align:center;font-size:12px;color:#74808c;line-height:1.5;margin:11px 0 0}
.apr-loading{padding:24px 0;color:#687381}
.apr-tradein__modal .apr-tradein--json{margin:12px auto;box-shadow:none;border-color:#edf0f3}
@media(max-width:560px){.apr-tradein--json{border-radius:15px;padding:18px 15px;margin:10px auto}.apr-tradein--json .apr-thumb{padding:14px;min-height:72px;gap:10px}.apr-tradein--json .apr-thumbs{gap:9px}.apr-tradein--json .apr-thumb__title{font-size:14px}.apr-thumb__icon{width:35px;height:35px;font-size:23px}.apr-tradein--json .apr-thumbs--compact{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:370px){.apr-tradein--json .apr-thumbs:not(.apr-thumbs--compact){grid-template-columns:1fr}}

/* 3.1.1: keep modal above Astra/Elementor stacking contexts. */
.apr-tradein__modal{position:fixed!important;inset:0!important;z-index:2147483647!important}
.apr-tradein--json [data-prev]:hover,.apr-tradein--json [data-prev]:focus-visible,
.apr-tradein--json [data-restart]:hover,.apr-tradein--json [data-restart]:focus-visible{
 background:#e87500!important;color:#fff!important;border-color:#e87500!important;text-decoration:none!important;
}
.apr-tradein--json [data-prev]:hover *,.apr-tradein--json [data-restart]:hover *{color:#fff!important}

/* 3.1.2: extra comfortable click targets for navigation actions. */
.apr-tradein--json .apr-actions [data-prev],
.apr-tradein--json .apr-actions [data-restart]{
 padding:12px 17px;
 border-radius:9px;
 min-height:44px;
}
