#serviceydelser-app{--orange:#ff6500;--line:#e8e8e8;--soft:#fafafa;font-family:Arial,Helvetica,sans-serif;color:#000;background:#fff}
#serviceydelser-app *{box-sizing:border-box}
#serviceydelser-app .wrap{max-width:1480px;margin:auto;display:grid;grid-template-columns:minmax(0,1fr) 500px;gap:30px;padding:28px 30px}
#serviceydelser-app h1{font-size:44px;line-height:1.05;margin:0 0 34px;font-weight:900;letter-spacing:-1px}
#serviceydelser-app .divider{border-top:1px solid var(--line);margin-bottom:16px}
#serviceydelser-app .product{display:flex;align-items:center;gap:18px;margin-bottom:8px}
#serviceydelser-app .thumb{width:122px;height:122px;border:1px solid var(--line);border-radius:4px;display:flex;align-items:center;justify-content:center;background:#fff;font-size:54px}
#serviceydelser-app .product input{font-size:14px;border:0;border-bottom:1px solid #ddd;padding:10px;width:420px;max-width:100%}
#serviceydelser-app .panel{background:var(--soft);padding:20px;border-radius:2px;box-shadow:0 8px 20px rgba(0,0,0,.08)}
#serviceydelser-app h2{font-size:18px;margin:0 0 16px;font-weight:900}
#serviceydelser-app .row{display:flex;align-items:center;gap:18px;background:#fff;border:1.5px solid var(--orange);border-radius:6px;margin:14px 0;padding:16px 12px;box-shadow:0 2px 6px rgba(0,0,0,.12);cursor:pointer}
#serviceydelser-app .row input{display:none}
#serviceydelser-app .check{width:27px;height:27px;border-radius:6px;background:#fff;border:2px solid var(--orange);display:grid;place-items:center;color:#fff;font-weight:900;flex:0 0 auto}
#serviceydelser-app .row input:checked+.check{background:var(--orange)}
#serviceydelser-app .row input:checked+.check:before{content:'✓'}
#serviceydelser-app .service{flex:1;text-transform:uppercase;font-size:14px}
#serviceydelser-app .price{font-weight:900}
#serviceydelser-app .side{background:#f2f2f2;padding:0 0 16px}
#serviceydelser-app .cart{padding:0 14px 18px}
#serviceydelser-app .cart h3{font-size:24px;margin:0 0 24px;font-weight:900}
#serviceydelser-app .cart .item{display:flex;justify-content:space-between;gap:12px;font-size:14px;margin:4px 0}
#serviceydelser-app .cart .item b{display:block}
#serviceydelser-app .delivery{font-weight:900;margin-top:14px}
#serviceydelser-app .total{display:flex;justify-content:space-between;background:#ddd;padding:15px 14px;font-size:18px;font-weight:900}
#serviceydelser-app .vat{font-weight:400;text-align:right;color:#333;font-size:16px;margin-top:6px;padding-right:14px}
#serviceydelser-app .controls{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:12px 0 18px}
#serviceydelser-app .controls label{font-size:13px;font-weight:700}
#serviceydelser-app .controls select,#serviceydelser-app .controls input{width:100%;padding:10px;border:1px solid #ccc;border-radius:4px}
#serviceydelser-app .empty{color:#777;font-size:14px}
#serviceydelser-app .export{margin-top:12px;width:100%;background:var(--orange);color:#fff;border:0;border-radius:5px;padding:12px;font-weight:900;cursor:pointer}
@media(max-width:950px){#serviceydelser-app .wrap{grid-template-columns:1fr}#serviceydelser-app .side{order:-1}#serviceydelser-app h1{font-size:34px}}

(function(){
const allCategories=['Vaskemaskiner','Tørretumblere','Opvaskemaskine','Køleskabe','Køle-/fryseskabe','Fryseskab','Ovn','Kogeplade'];
const services=[
{cats:allCategories,name:'Levering til kantsten',price:149,delivery:true},
{cats:allCategories,name:'Levering med ind og opbæring',price:499,delivery:true},
{cats:allCategories,name:'2-mandsopgave',price:399},
{cats:allCategories,name:'Udpakning af produkt',price:149},
{cats:allCategories,name:'Brugt retur til skrotning',price:299},
{cats:['Vaskemaskiner','Tørretumblere','Opvaskemaskine','Ovn','Kogeplade'],name:'Montering og udpakning',price:449},
{cats:['Opvaskemaskine','Køleskabe','Fryseskab'],name:'Montering af låge på integrerbar',price:999},
{cats:['Køle-/fryseskabe'],name:'Montering af låge på integrerbar (2 låger)',price:1499},
{cats:['Køleskabe','Køle-/fryseskabe','Fryseskab'],name:'Dørvending',price:299}
];
const category=document.getElementById('wpCategory'), servicesEl=document.getElementById('wpServices'), cart=document.getElementById('wpCart');
const total=document.getElementById('wpTotal'), vat=document.getElementById('wpVat'), basePrice=document.getElementById('wpBasePrice'), productName=document.getElementById('wpProductName');
allCategories.forEach(c=>category.add(new Option(c,c))); category.value='Køle-/fryseskabe';
function money(n){return new Intl.NumberFormat('da-DK').format(Math.round(n))+',-'}
function render(){
servicesEl.innerHTML='';
services.filter(s=>s.cats.includes(category.value)).forEach((s,i)=>{
servicesEl.insertAdjacentHTML('beforeend',`${s.name}${money(s.price)}`);
});
servicesEl.querySelectorAll('input[type=checkbox]').forEach(x=>x.addEventListener('change',calc));
calc();
}
function calc(){
const base=+basePrice.value||0;
const picked=[...servicesEl.querySelectorAll('input[type=checkbox]:checked')].map(x=>({name:x.dataset.name,price:+x.dataset.price,delivery:x.dataset.delivery==='true'}));
const pname=productName.value.trim();
let rows=`

`;
picked.forEach(p=>rows+=`

`);
const delivery=picked.find(p=>p.delivery);
if(delivery) rows+=`

`;
if(!picked.length) rows+='

Ingen serviceydelser valgt.

';
const sum=base+picked.reduce((a,b)=>a+b.price,0);
cart.innerHTML=rows; total.textContent=money(sum); vat.textContent=money(sum*0.2);
}
document.getElementById('wpCopySummary').addEventListener('click',()=>navigator.clipboard.writeText(cart.innerText+'\nOrdre total '+total.innerText+'\nMoms '+vat.innerText));
category.addEventListener('change',render); basePrice.addEventListener('input',calc); productName.addEventListener('input',calc); render();
})();