/* ====== Webshop front-end ====== */
body.shop-page{background:var(--bg);color:var(--text)}
.nav--solid{position:sticky;top:0;z-index:40;background:var(--surface);border-bottom:1px solid var(--line)}
.nav--solid .logo img{height:46px;display:block}
.shop-main{min-height:60vh;padding:48px 0 90px}

.shop-head{margin:0 0 36px}
.shop-head .eyebrow{display:inline-block;margin-bottom:10px}
.shop-head h1{font-family:'Cormorant Garamond',serif;font-size:clamp(2.4rem,5vw,3.6rem);color:var(--text);line-height:1.05;margin:0 0 8px}
.shop-head h1 em{font-style:italic;color:var(--accent-text)}
.shop-head p{color:var(--text-soft,#555);max-width:640px}
.shop-filters{display:flex;gap:10px;flex-wrap:wrap;margin:22px 0 8px}
.shop-filters a{font-size:.78rem;letter-spacing:.04em;padding:8px 16px;border:1px solid var(--line);border-radius:999px;color:var(--text);text-decoration:none;transition:.2s}
.shop-filters a:hover,.shop-filters a.active{border-color:var(--accent);background:var(--accent);color:#fff}

/* productrooster */
.prod-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:28px;margin-top:30px}
.prod-card{background:var(--surface);border:1px solid var(--line);border-radius:6px;overflow:hidden;display:flex;flex-direction:column;transition:transform .4s,box-shadow .4s}
.prod-card:hover{transform:translateY(-6px);box-shadow:0 24px 50px rgba(0,0,0,.18)}
.prod-card a.pc-img{display:block;aspect-ratio:3/4;background:#ddd;overflow:hidden}
.prod-card a.pc-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.prod-card:hover a.pc-img img{transform:scale(1.05)}
.prod-card .pc-body{padding:18px 18px 20px;display:flex;flex-direction:column;gap:6px;flex:1}
.prod-card .pc-cat{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--accent-text)}
.prod-card .pc-name{font-family:'Cormorant Garamond',serif;font-size:1.4rem;color:var(--text);line-height:1.15}
.prod-card .pc-name a{color:inherit;text-decoration:none}
.prod-card .pc-price{font-weight:600;color:var(--text);margin-top:auto}
.prod-card .pc-soldout{font-size:.74rem;color:#b3473b;letter-spacing:.06em}

/* productpagina */
.prod-detail{display:grid;grid-template-columns:1fr 1fr;gap:54px;align-items:start}
.prod-detail .pd-img{border:1px solid var(--line);border-radius:6px;overflow:hidden;background:#ddd;aspect-ratio:3/4}
.prod-detail .pd-img img{width:100%;height:100%;object-fit:cover}
.prod-detail .pd-info h1{font-family:'Cormorant Garamond',serif;font-size:clamp(2rem,4vw,3rem);color:var(--text);margin:6px 0 10px;line-height:1.05}
.prod-detail .pd-meta{font-size:.78rem;color:var(--text-soft,#666);letter-spacing:.04em;margin-bottom:14px}
.prod-detail .pd-price{font-size:1.5rem;font-weight:600;color:var(--text);margin:0 0 20px}
.prod-detail .pd-desc{color:var(--text-soft,#555);line-height:1.7;margin-bottom:26px;background:#fff;padding:14px 16px;border-radius:6px}
.size-label{font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--accent-text);display:block;margin-bottom:10px}
.size-opts{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:24px}
.size-opt{position:relative}
.size-opt input{position:absolute;opacity:0;inset:0;cursor:pointer}
.size-opt span{display:inline-flex;min-width:52px;justify-content:center;padding:11px 14px;border:1px solid var(--line);border-radius:4px;background:#fff;cursor:pointer;transition:.2s}
.size-opt input:checked + span{border-color:var(--accent);background:var(--accent);color:#fff}
.size-opt input:disabled + span{opacity:.4;text-decoration:line-through;cursor:not-allowed}
.qty-row{display:flex;align-items:center;gap:16px;margin-bottom:24px}
.qty-ctrl{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:4px;overflow:hidden}
.qty-ctrl button{width:40px;height:42px;border:0;background:transparent;font-size:1.1rem;cursor:pointer;color:var(--text)}
.qty-ctrl input{width:46px;height:42px;border:0;text-align:center;background:transparent;color:var(--text);font-size:1rem}
.pd-note{font-size:.8rem;color:var(--text-soft,#666);margin-top:14px}

/* winkelwagen */
.cart-table{width:100%;border-collapse:collapse;margin-bottom:24px}
.cart-table th{text-align:left;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--text-soft,#666);padding:0 0 12px;border-bottom:1px solid var(--line)}
.cart-table td{padding:18px 0;border-bottom:1px solid var(--line);vertical-align:middle}
.cart-table .ci-prod{display:flex;align-items:center;gap:16px}
.cart-table .ci-prod img{width:64px;height:80px;object-fit:cover;border-radius:4px;background:#ddd}
.cart-table .ci-name{font-family:'Cormorant Garamond',serif;font-size:1.2rem;color:var(--text)}
.cart-table .ci-size{font-size:.78rem;color:var(--text-soft,#666)}
.cart-remove{background:none;border:0;color:#b3473b;cursor:pointer;font-size:.8rem}
.cart-summary{max-width:360px;margin-left:auto}
.code-form{display:flex;gap:8px;margin-bottom:14px}
.code-form input{flex:1;padding:10px 12px;border:1px solid var(--line);border-radius:4px;background:var(--surface);color:var(--text);font:inherit}
.cart-summary .row{display:flex;justify-content:space-between;padding:8px 0}
.cart-summary .row.total{border-top:1px solid var(--line);margin-top:6px;padding-top:14px;font-size:1.2rem;font-weight:600}

/* productfoto-galerij */
.pd-gallery{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}
.pd-gallery img{width:66px;height:84px;object-fit:cover;border-radius:4px;border:1px solid var(--line);cursor:pointer;opacity:.7;transition:.2s}
.pd-gallery img:hover,.pd-gallery img.active{opacity:1;border-color:var(--accent)}
.empty-note{padding:60px 0;text-align:center;color:var(--text-soft,#666)}

/* formulieren */
.shop-form{max-width:560px}
.shop-form .f{margin-bottom:18px}
.shop-form label{display:block;font-size:.8rem;letter-spacing:.04em;margin-bottom:6px;color:var(--text)}
.shop-form input,.shop-form textarea{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:4px;background:var(--surface);color:var(--text);font:inherit}
.shop-form textarea{min-height:90px;resize:vertical}
.form-err{background:rgba(179,71,59,.12);border:1px solid rgba(179,71,59,.4);color:#8c2d22;padding:12px 14px;border-radius:4px;margin-bottom:18px;font-size:.9rem}
.form-ok{background:rgba(90,158,111,.12);border:1px solid rgba(90,158,111,.4);color:#2f6a44;padding:12px 14px;border-radius:4px;margin-bottom:18px;font-size:.9rem}

/* account / bestellingen */
.order-card{border:1px solid var(--line);border-radius:6px;padding:22px 24px;margin-bottom:20px;background:var(--surface)}
.order-card .oc-head{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.order-card .oc-num{font-family:'Cormorant Garamond',serif;font-size:1.3rem;color:var(--text)}
.order-status{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;padding:4px 12px;border-radius:999px;border:1px solid var(--line)}
.order-status.betaald{background:rgba(90,158,111,.15);border-color:rgba(90,158,111,.5);color:#2f6a44}
.order-status.open{background:rgba(201,160,78,.12);border-color:var(--accent);color:var(--accent-text)}
.oi-row{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:10px 0;border-top:1px solid var(--line)}
.oi-row .oi-name{color:var(--text)}
.oi-row .oi-size{font-size:.78rem;color:var(--text-soft,#666)}
.return-tag{font-size:.72rem;color:var(--accent-text)}

.auth-tabs{display:flex;gap:8px;margin-bottom:24px}
.auth-tabs button{flex:1;padding:12px;border:1px solid var(--line);background:var(--surface);border-radius:4px;cursor:pointer;color:var(--text);font:inherit}
.auth-tabs button.active{border-color:var(--accent);background:var(--accent);color:#fff}

@media(max-width:820px){
  .prod-detail{grid-template-columns:1fr;gap:28px}
}
@media(max-width:560px){
  .cart-table .ci-prod img{display:none}
  .nav--solid nav ul{gap:14px}
}

/* actieprijs */
.pc-img{position:relative}
.sale-badge{position:absolute;top:10px;left:10px;z-index:2;background:var(--accent);color:#fff;font-size:.64rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:5px 10px;border-radius:3px}
.prod-card a.pc-img .pc-back{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s ease;z-index:1}
.prod-card:hover a.pc-img .pc-back{opacity:1}
.pc-sale,.pd-sale{color:var(--accent-text);font-weight:600}
.pc-old,.pd-old{color:#8a8a89;text-decoration:line-through;font-weight:400;margin-left:4px}
.pd-old{font-size:1.1rem}
.pd-badge{display:inline-block;margin-left:8px;background:var(--accent);color:#fff;font-size:.6rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:4px 9px;border-radius:3px;vertical-align:middle}

/* aanbiedingen-filter valt op */
.shop-filters a.sale-filter{border-color:var(--accent);color:var(--accent-text)}
.shop-filters a.sale-filter:hover,.shop-filters a.sale-filter.active{background:var(--accent);color:#fff}

/* gesplitste adresvelden + mijn gegevens */
.shop-form .f-row{display:flex;gap:14px}
.shop-form .f-row .f{flex:1}
.profile-box{border:1px solid var(--line,#e4ded2);border-radius:10px;padding:14px 18px;margin-bottom:28px;background:var(--surface,#fff)}
.profile-box>summary{cursor:pointer;font-weight:600;letter-spacing:.02em}
.profile-box[open]>summary{margin-bottom:4px}
@media(max-width:480px){.shop-form .f-row{flex-direction:column;gap:0}}

.muted{color:var(--text-soft,#888)}

/* geen hover-effecten op touch/mobiel (voorkomt 'plakkende' mouseover, bv. de achterfoto) */
@media (hover: none){
  .prod-card:hover{transform:none;box-shadow:none}
  .prod-card:hover a.pc-img img{transform:none}
  .prod-card:hover a.pc-img .pc-back{opacity:0}
}