/* Kaarten verkopen: breder dan de smalle tekstkolom van een pagina */
.sd-ik { position: relative; box-sizing: border-box; width: min(1180px, calc(100vw - 2rem)); max-width: none !important; margin-left: 50% !important; margin-right: 0 !important; translate: -50% 0; }
.sd-ik-hero { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 1.4rem 2.4rem; align-items: center; padding: 1.6rem 1.8rem; border-radius: 16px; background-color: var(--sd-night); background-image: var(--sd-stars); color: rgba(244,246,250,.86); }
.sd-ik-kicker { display: block; font-size: .75rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--sd-gold); }
.sd-ik-hero h2 { margin: .3rem 0 .6rem; color: var(--sd-gold-light); font-size: clamp(1.6rem, 3.2vw, 2.2rem); line-height: 1.15; }
.sd-ik-hero p { margin: 0; max-width: 52ch; line-height: 1.55; }
.sd-ik-hero strong { color: #fff; }
.sd-ik-hero .wp-element-button { display: inline-block; margin-top: 1.1rem; background: var(--sd-gold) !important; color: var(--sd-night) !important; font-weight: 800; }
.sd-ik-hero-sm h2 { font-size: clamp(1.8rem, 4vw, 2.6rem); }
.sd-ik-steps { list-style: none; margin: 0; padding: .4rem 1.1rem; display: grid; border-radius: 12px; background: rgba(255,255,255,.06); border: 1px solid rgba(242,218,155,.18); }
.sd-ik-steps li { display: flex; gap: .7rem; align-items: center; padding: .55rem 0; }
.sd-ik-steps li + li { border-top: 1px solid rgba(242,218,155,.12); }
.sd-ik-steps b { flex: none; display: grid; place-items: center; width: 1.8rem; height: 1.8rem; border-radius: 50%; background: var(--sd-gold); color: var(--sd-night); font-weight: 900; font-size: .9rem; }
.sd-ik-steps span { display: flex; flex-direction: column; font-weight: 800; color: #fff; line-height: 1.3; }
.sd-ik-steps small { font-weight: 600; color: rgba(244,246,250,.7); }

/* De paginatitel herhaalt de kop van het blok: verbergen (blijft voor schermlezers) en minder ruimte erboven. */
main:has(#sd-ik) { margin-top: 0 !important; }
main:has(#sd-ik) > .wp-block-group { padding-top: clamp(1rem, 3vw, 1.8rem) !important; }
main:has(#sd-ik) .wp-block-post-title { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.sd-ik-grid { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 1.5rem; margin-top: 1.5rem; align-items: start; }
.sd-ik-label { display: block; margin-bottom: .4rem; font-weight: 800; }
.sd-ik-add { position: relative; padding: 1rem 1.1rem 1.1rem; border-radius: 14px; background: #fff; border: 1px solid var(--wp--preset--color--accent-6); }
.sd-ik-tabs { display: inline-flex; gap: .25rem; margin-bottom: .9rem; padding: .25rem; border-radius: 99px; background: #EEF1F8; }
.sd-ik-tabs button { padding: .45rem 1rem; border: 0; border-radius: 99px; background: none; font: inherit; font-size: .9rem; font-weight: 800; color: var(--wp--preset--color--accent-4); cursor: pointer; }
.sd-ik-tabs button[aria-selected="true"] { background: var(--sd-night); color: #fff; }
.sd-ik-pane[hidden] { display: none; }
.sd-ik-main textarea { width: 100%; box-sizing: border-box; padding: .7rem .8rem; border: 1px solid var(--wp--preset--color--accent-6); border-radius: 10px; font: inherit; background: #fff; }
#sd-ik-pane-plak .wp-element-button { margin-top: .6rem; }
.sd-ik-search { position: relative; }
.sd-ik-search input { width: 100%; box-sizing: border-box; min-height: 48px; padding: 0 .9rem 0 2.6rem; border: 1.5px solid var(--wp--preset--color--accent-6); border-radius: 10px; font: inherit; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='%236B7280' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='8' cy='8' r='6'/%3E%3Cpath d='m13 13 4 4'/%3E%3C/svg%3E") no-repeat .85rem 50%; }
.sd-ik-search input:focus { outline: none; border-color: var(--sd-gold); box-shadow: 0 0 0 3px rgba(212,162,58,.22); }
.sd-ik-sugg { position: absolute; z-index: 20; left: 0; right: 0; top: calc(100% + .35rem); max-height: min(420px, 60vh); overflow-y: auto; margin: 0; padding: .3rem; list-style: none; border-radius: 12px; background: #fff; border: 1px solid var(--wp--preset--color--accent-6); box-shadow: 0 18px 40px -12px rgba(15,22,48,.35); }
.sd-ik-sugg[hidden] { display: none; }
.sd-ik-s-head { padding: .55rem .6rem .2rem; font-size: .78rem; font-weight: 900; letter-spacing: .02em; color: var(--sd-night); }
.sd-ik-s-opt { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; gap: .65rem; align-items: center; padding: .35rem .6rem; border-radius: 8px; cursor: pointer; }
.sd-ik-s-opt img { width: 30px; height: 42px; object-fit: cover; border-radius: 3px; background: #EEF1F8; }
.sd-ik-s-opt span { font-size: .86rem; line-height: 1.3; }
.sd-ik-s-opt i { display: block; font-style: normal; font-size: .75rem; font-weight: 800; color: var(--wp--preset--color--emerald, #1F7A4D); }
.sd-ik-s-opt em { font-style: normal; font-weight: 800; font-size: .9rem; white-space: nowrap; }
.sd-ik-s-opt:hover, .sd-ik-s-opt.is-active { background: #EEF1F8; }
.sd-ik-s-none { padding: .8rem; font-size: .88rem; color: var(--wp--preset--color--accent-4); }
.sd-ik-tip { margin: .45rem 0 0; font-size: .8rem; color: var(--wp--preset--color--accent-4); }
.sd-ik-cond { display: inline-flex; align-items: center; gap: .5rem; margin-top: .9rem; font-size: .85rem; font-weight: 700; }
.sd-ik-cond select, .sd-ik-r select, .sd-ik-r input[type=number], .sd-ik-bulk input { min-height: 40px; padding: 0 .5rem; border: 1px solid var(--wp--preset--color--accent-6); border-radius: 8px; background: #fff; font: inherit; font-size: .9rem; }
.sd-ik-error { margin: .6rem 0 0; color: var(--wp--preset--color--ruby, #9B1C31); font-weight: 700; }
.sd-ik-error:empty { display: none; }

.sd-ik-listhead { display: flex; align-items: baseline; gap: .6rem; margin: 1.3rem 0 .5rem; }
.sd-ik-listhead strong { font-size: 1.1rem; }
.sd-ik-listhead span { color: var(--wp--preset--color--accent-4); font-size: .9rem; }
.sd-ik-listhead .sd-ik-link { margin-left: auto; font-size: .85rem; font-weight: 700; color: var(--wp--preset--color--accent-4); }
.sd-ik-empty { margin: 1rem 0 0; padding: 1.4rem 1rem; border: 1px dashed var(--wp--preset--color--accent-6); border-radius: 12px; text-align: center; color: var(--wp--preset--color--accent-4); }
.sd-ik-r.is-new { animation: sd-ik-new 1.4s ease-out; }
@keyframes sd-ik-new { from { background: #FBF0D4; } to { background: transparent; } }
.sd-ik-rows { list-style: none; margin: 0; padding: 0; border: 1px solid var(--wp--preset--color--accent-6); border-radius: 12px; background: #fff; }
.sd-ik-r { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto 7.5rem 2rem; gap: .5rem .9rem; align-items: center; padding: .65rem .9rem; border-bottom: 1px solid var(--wp--preset--color--accent-6); }
.sd-ik-r:last-child { border-bottom: 0; }
.sd-ik-img { width: 48px; height: 67px; object-fit: cover; border-radius: 4px; background: #EEF1F8; }
.sd-ik-name { display: flex; flex-direction: column; gap: .25rem; min-width: 0; }
.sd-ik-name small { font-size: .8rem; color: var(--wp--preset--color--accent-4); }
.sd-ik-name select { max-width: 100%; font-size: .82rem; min-height: 34px; }
.sd-ik-name select.is-check { border-color: var(--sd-gold); box-shadow: 0 0 0 2px rgba(212,162,58,.25); }
.sd-ik-hint { color: #8E6418 !important; font-weight: 700; }
.sd-ik-opts { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; justify-content: flex-end; }
.sd-ik-opts input[type=number] { width: 4rem; }
.sd-ik-foil { display: inline-flex; gap: .25rem; align-items: center; font-size: .85rem; font-weight: 700; }
.sd-ik-offer { display: flex; flex-direction: column; align-items: flex-end; text-align: right; }
.sd-ik-offer b { font-size: 1.05rem; }
.sd-ik-offer small { font-size: .75rem; color: var(--wp--preset--color--accent-4); }
.sd-ik-r.is-low .sd-ik-img { opacity: .5; }
.sd-ik-r.is-unknown { grid-template-columns: 48px minmax(0, 1fr) 2rem; }
.sd-ik-x { width: 2rem; height: 2rem; padding: 0; border: 0; border-radius: 50%; background: none; font-size: 1.3rem; line-height: 1; color: var(--wp--preset--color--accent-4); cursor: pointer; }
.sd-ik-x:hover { background: #EEF1F8; color: var(--wp--preset--color--ruby); }
.sd-ik-link { padding: 0; border: 0; background: none; font: inherit; font-weight: 800; color: #8E6418; text-decoration: underline; cursor: pointer; }
.sd-ik-bulk { margin-top: 1rem; padding: .9rem 1rem; border: 1px dashed var(--wp--preset--color--accent-6); border-radius: 12px; background: #fff; font-size: .9rem; }
.sd-ik-bulk label { display: block; margin-bottom: .4rem; }
.sd-ik-bulk input { width: 6rem; }

.sd-ik-side { position: sticky; top: 1rem; padding: 1.2rem; border-radius: 16px; background: #fff; border: 1px solid var(--wp--preset--color--accent-6); box-shadow: 0 10px 30px rgba(15,22,48,.08); }
.sd-ik-side h3 { margin: 0 0 .8rem; }
.sd-ik-pay { display: grid; gap: .5rem; }
.sd-ik-opt { display: grid; grid-template-columns: auto 1fr auto; gap: .6rem; align-items: center; padding: .7rem .8rem; border: 1.5px solid var(--wp--preset--color--accent-6); border-radius: 12px; cursor: pointer; }
.sd-ik-opt.is-on { border-color: var(--sd-gold); background: #FBF6EA; }
.sd-ik-opt span { display: flex; flex-direction: column; line-height: 1.2; }
.sd-ik-opt small { font-size: .78rem; color: var(--wp--preset--color--accent-4); }
.sd-ik-opt strong { font-size: 1.2rem; }
.sd-ik-free { list-style: none; margin: .8rem 0; padding: .8rem .9rem; display: grid; gap: .65rem; border-radius: 12px; background: #F4F6FA; border: 1px solid var(--wp--preset--color--accent-6, #E1E5EE); }
.sd-ik-free li { display: flex; gap: .6rem; align-items: flex-start; font-size: .84rem; line-height: 1.45; color: var(--wp--preset--color--accent-4); }
.sd-ik-free b { flex: none; display: grid; place-items: center; width: 1.5rem; height: 1.5rem; border-radius: 50%; background: var(--sd-night); color: var(--sd-gold-light, #F2DA9B); font-size: .8rem; }
.sd-ik-free strong { display: block; color: var(--sd-night); font-size: .9rem; }
.sd-ik-note { margin: .7rem 0; font-size: .88rem; color: var(--wp--preset--color--accent-4); }
#sd-ik-form { display: flex; flex-direction: column; gap: .6rem; }
#sd-ik-form[hidden] { display: none; }
#sd-ik-form > label { display: flex; flex-direction: column; gap: .25rem; font-size: .85rem; font-weight: 700; }
#sd-ik-form input[type=text], #sd-ik-form textarea { padding: .5rem .6rem; border: 1px solid var(--wp--preset--color--accent-6); border-radius: 8px; font: inherit; font-weight: 400; }
#sd-ik-form label[hidden] { display: none; }
#sd-ik-form .sd-ik-check { flex-direction: row; align-items: flex-start; gap: .45rem; font-weight: 600; }
#sd-ik-form .wp-element-button { background: var(--sd-gold) !important; color: var(--sd-night) !important; font-weight: 800; text-align: center; }
.sd-ik-small { margin: 1rem 0 0; font-size: .75rem; line-height: 1.45; color: var(--wp--preset--color--accent-4); }

/* Mijn account > Verkopen & tegoed */
.sd-ik-acc h3 { margin-top: 1.6rem; }
.sd-ik-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; }
.sd-ik-item details { border: 1px solid var(--wp--preset--color--accent-6); border-radius: 12px; background: #fff; }
.sd-ik-item summary { display: grid; grid-template-columns: auto auto 1fr auto; gap: .8rem; align-items: center; padding: .8rem 1rem; cursor: pointer; }
.sd-ik-nr { font-weight: 900; }
.sd-ik-st { padding: .15rem .55rem; border-radius: 99px; background: #E1E5EE; font-size: .78rem; font-weight: 800; }
.is-aangemeld .sd-ik-st, .is-tegenbod .sd-ik-st, .is-opsturen .sd-ik-st { background: #FCF0D0; color: #6B4A0E; }
.is-afgerond .sd-ik-st { background: #D7F0DD; color: #14532D; }
.sd-ik-amt { justify-self: end; font-weight: 800; }
.sd-ik-amt small { font-weight: 600; color: var(--wp--preset--color--accent-4); }
.sd-ik-date { font-size: .8rem; color: var(--wp--preset--color--accent-4); }
.sd-ik-body { padding: 0 1rem 1rem; }
.sd-ik-body table { font-size: .88rem; }
.sd-ik-actions { margin-top: .8rem; display: flex; gap: 1rem; align-items: center; }
.sd-ik-log { width: 100%; font-size: .9rem; }
.sd-ik-log td { padding: .45rem .3rem; border-bottom: 1px solid var(--wp--preset--color--accent-6); }
.sd-ik-log .is-plus { color: var(--wp--preset--color--emerald); font-weight: 800; text-align: right; }
.sd-ik-log .is-min { text-align: right; }

/* Tegoed bij winkelwagen en afrekenen */
.sd-tg-note { display: flex; flex-wrap: wrap; gap: .5rem .8rem; align-items: center; margin: 0 0 1.2rem; padding: .8rem 1rem; border-radius: 12px; border: 1px solid var(--wp--preset--color--accent-6); background: #EEF1F8; }
.sd-tg-note.is-on { border-color: var(--sd-gold); background: #FBF6EA; }
.sd-tg-ico { display: grid; place-items: center; width: 1.8rem; height: 1.8rem; border-radius: 50%; background: var(--sd-gold); color: var(--sd-night); font-weight: 900; }
.sd-tg-note > span:nth-child(2) { flex: 1; min-width: 12rem; }
.sd-tg-note a { font-weight: 800; color: #8E6418; }

@media (max-width: 900px) {
	.sd-ik-grid { grid-template-columns: 1fr; }
	.sd-ik-side { position: static; }
	.sd-ik-hero { grid-template-columns: 1fr; }
	.sd-ik-steps { grid-template-columns: repeat(2, 1fr); gap: 0 1rem; }
	.sd-ik-steps li + li { border-top: 0; }
}
@media (max-width: 600px) {
	.sd-ik-hero { padding: 1.3rem; }
	.sd-ik-steps { grid-template-columns: 1fr; padding: .2rem .9rem; }
	.sd-ik-steps li { padding: .45rem 0; }
	.sd-ik-steps li + li { border-top: 1px solid rgba(242,218,155,.12); }
	.sd-ik-add { padding: .9rem; }
	.sd-ik-r { grid-template-columns: 48px minmax(0, 1fr) 2rem; }
	.sd-ik-opts { grid-column: 2 / 4; justify-content: flex-start; }
	.sd-ik-offer { grid-column: 2 / 4; align-items: flex-start; text-align: left; }
	.sd-ik-r .sd-ik-x { grid-column: 3; grid-row: 1; }
	.sd-ik-item summary { grid-template-columns: auto 1fr auto; }
	.sd-ik-date { display: none; }
}

/* Homepageblok [sd_inkoop_promo]: opmaak van het Deck checken-blok, met een eigen streep */
.sd-ik-promo-points { list-style: none; margin: 0 0 1.4rem; padding: 0; display: grid; gap: .45rem; }
.sd-ik-promo-points li { position: relative; padding-left: 1.5rem; color: rgba(244,246,250,.9); font-weight: 700; }
.sd-ik-promo-points li::before { content: "✦"; position: absolute; left: 0; color: var(--sd-gold); }
.sd-ik-promo .sd-dc-promo-card .n small { font-weight: 600; color: var(--wp--preset--color--accent-4); }
.sd-ik-promo .sd-dc-promo-card li { grid-template-columns: 2.6rem 1fr auto; }
.sd-ik-promo .sd-dc-promo-card .s { white-space: nowrap; font-size: .85rem; }
.sd-ik-promo .sd-dc-promo-card .s * { display: inline; color: inherit; }
.sd-ik-promo .sd-dc-promo-card { transform: rotate(2deg); }
@media (max-width: 760px) { .sd-ik-promo .sd-dc-promo-card { transform: none; } }

/* Uitleg onderaan: eerst ons bod, dan opsturen */
.sd-ik-first { margin: .2rem 0 .1rem; padding: .65rem .8rem; border-left: 3px solid var(--sd-gold); border-radius: 0 8px 8px 0; background: #F4F6FA; font-size: .85rem; line-height: 1.45; }
.sd-ik-how { margin-top: 2.5rem; padding: clamp(1.4rem, 3vw, 2.2rem); border-radius: 16px; background: #fff; border: 2px solid var(--sd-gold); box-shadow: 0 14px 34px -24px rgba(15,22,48,.5); }
.sd-ik-how h2 { margin: 0 0 .6rem; font-size: clamp(1.4rem, 3vw, 1.9rem); color: var(--sd-night); }
.sd-ik-how-lead { margin: 0 0 1.4rem; max-width: 68ch; font-size: 1.05rem; line-height: 1.55; }
.sd-ik-timeline { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, 1fr); gap: 1rem; counter-reset: none; }
.sd-ik-timeline li { position: relative; display: flex; flex-direction: column; gap: .6rem; padding: 1rem; border-radius: 12px; background: #F4F6FA; }
.sd-ik-timeline li b { display: grid; place-items: center; width: 2.2rem; height: 2.2rem; border-radius: 50%; background: var(--sd-night); color: #F2DA9B; font-weight: 900; }
.sd-ik-timeline li strong { display: block; margin-bottom: .25rem; color: var(--sd-night); }
.sd-ik-timeline li span { font-size: .9rem; line-height: 1.45; color: var(--wp--preset--color--accent-4); }
.sd-ik-timeline li.is-key { background: var(--sd-night); background-image: var(--sd-stars); }
.sd-ik-timeline li.is-key b { background: var(--sd-gold); color: var(--sd-night); }
.sd-ik-timeline li.is-key strong { color: var(--sd-gold-light); }
.sd-ik-timeline li.is-key span { color: rgba(244,246,250,.88); }
@media (max-width: 1180px) { .sd-ik-timeline { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 900px) {
	.sd-ik-timeline { grid-template-columns: 1fr; }
	.sd-ik-timeline li { flex-direction: row; align-items: flex-start; }
	.sd-ik-timeline li b { flex: none; }
}

/* Promotie bij de losse kaarten */
.sd-ik-bar .sd-dc-promo-icon { font-weight: 800; }
.sd-ik-line svg { vertical-align: -.12em; }

/* Duurste kaarten (waardegids) */
.sd-ik-top { overflow-x: auto; margin: 1rem 0 1.5rem; }
.sd-ik-top table { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid var(--wp--preset--color--accent-6); border-radius: 8px; font-size: .95rem; }
.sd-ik-top th, .sd-ik-top td { padding: .55rem .7rem; text-align: left; border-bottom: 1px solid var(--wp--preset--color--accent-6); }
.sd-ik-top th { font-weight: 800; color: var(--wp--preset--color--contrast); }
.sd-ik-top td:first-child, .sd-ik-top th:first-child { width: 2rem; color: var(--wp--preset--color--accent-4); }
.sd-ik-top td:last-child, .sd-ik-top th:last-child { text-align: right; font-weight: 800; white-space: nowrap; }
.sd-ik-top tr:last-child td { border-bottom: 0; }
.sd-ik-top small { font-weight: 400; opacity: .75; }
.sd-ik-top-note { font-size: .82rem; opacity: .75; margin: .5rem 0 0 !important; }
@media (max-width: 600px) {
	.sd-ik-top th:nth-child(3), .sd-ik-top td:nth-child(3) { display: none; }
	.sd-ik-top th, .sd-ik-top td { padding: .5rem .45rem; }
}
