{"id":31077,"date":"2026-05-13T21:25:07","date_gmt":"2026-05-13T21:25:07","guid":{"rendered":"https:\/\/www.bwmo.com\/?page_id=31077"},"modified":"2026-05-13T21:25:23","modified_gmt":"2026-05-13T21:25:23","slug":"ced-bathroom-doors","status":"publish","type":"page","link":"https:\/\/www.bwmo.com\/index.php\/ced-bathroom-doors\/","title":{"rendered":"CED Bathroom Doors"},"content":{"rendered":"\n<div id=\"ced-bathroom-configurator\">\n  <section class=\"ced-bath-hero\">\n    <div class=\"ced-bath-copy\">\n      <span>CED Bathroom Door<\/span>\n      <h1>Clean design. Built for everyday living.<\/h1>\n      <p>Choose your bathroom door style and add it directly to cart.<\/p>\n    <\/div>\n    <div class=\"ced-bath-hero-media\">\n      <img decoding=\"async\" id=\"ced-bath-hero-image\" src=\"https:\/\/www.bwmo.com\/wp-content\/uploads\/2026\/05\/7CDF42ED-226C-4AD7-9774-CA26CBC58184.jpg\" alt=\"CED Bathroom Door\">\n    <\/div>\n  <\/section>\n\n  <section class=\"ced-bath-step\" id=\"ced-bath-step-design\">\n    <div class=\"ced-bath-step-head\">\n      <span>Step 1<\/span>\n      <h2>Choose your bathroom door design.<\/h2>\n      <p>Swipe through the collection and preview each style instantly.<\/p>\n    <\/div>\n    <div class=\"ced-bath-preview-card is-empty\">\n      <img decoding=\"async\" id=\"ced-bath-preview\" src=\"https:\/\/via.placeholder.com\/1400x900\/f5f5f7\/1d1d1f?text=CED+Bathroom+Door\" alt=\"Bathroom Door Preview\">\n    <\/div>\n    <div id=\"ced-bath-designs\" class=\"ced-bath-horizontal-scroll\"><\/div>\n  <\/section>\n\n  <section class=\"ced-bath-step ced-bath-summary\">\n    <div class=\"ced-bath-step-head\">\n      <span>Current Build<\/span>\n      <h2>Your CED bathroom door.<\/h2>\n      <p>Review the current bathroom door, then add it to your selection.<\/p>\n    <\/div>\n    <div class=\"ced-bath-delivery-note\">\n      <strong>Free delivery across Ghana.<\/strong>\n      <span>Delivery timelines and measurements will be confirmed before final payment.<\/span>\n    <\/div>\n    <div class=\"ced-bath-summary-card\">\n      <div><span>Design<\/span><strong id=\"bath-sum-design\">-<\/strong><\/div>\n      <div><span>Size<\/span><strong>2050 x 800 mm<\/strong><\/div>\n      <div>\n        <span>Quantity<\/span>\n        <strong class=\"ced-bath-qty-control\">\n          <button type=\"button\" id=\"ced-bath-current-qty-minus\">-<\/button>\n          <b id=\"ced-bath-current-qty\">1<\/b>\n          <button type=\"button\" id=\"ced-bath-current-qty-plus\">+<\/button>\n        <\/strong>\n      <\/div>\n      <div><span>Unit Price<\/span><strong id=\"bath-sum-unit-total\">\u20b50<\/strong><\/div>\n      <div class=\"ced-bath-total\"><span>Current Subtotal<\/span><strong id=\"bath-sum-total\">\u20b50<\/strong><\/div>\n    <\/div>\n  <\/section>\n\n  <div id=\"ced-bath-drawer-backdrop\" class=\"ced-bath-drawer-backdrop\"><\/div>\n\n  <aside id=\"ced-bath-selection-drawer\" class=\"ced-bath-selection-drawer\" aria-hidden=\"true\">\n    <div class=\"ced-bath-drawer-handle\"><\/div>\n    <div class=\"ced-bath-drawer-head\">\n      <div>\n        <span>Your Selection<\/span>\n        <h3>Selected bathroom doors<\/h3>\n        <em id=\"ced-bath-selection-count\">0 item<\/em>\n      <\/div>\n      <button id=\"ced-bath-close-selection\" type=\"button\">\u00d7<\/button>\n    <\/div>\n    <div id=\"ced-bath-selection-items\" class=\"ced-bath-selection-items\">\n      <p class=\"ced-bath-empty-selection\">Your selection is empty. Add a bathroom door to begin.<\/p>\n    <\/div>\n    <div class=\"ced-bath-drawer-footer\">\n      <div class=\"ced-bath-selection-total\">\n        <span>Selection Total<\/span>\n        <strong id=\"ced-bath-selection-total\">\u20b50<\/strong>\n      <\/div>\n      <button id=\"ced-bath-add-cart\" class=\"ced-bath-main-btn\" type=\"button\">Add Selection to Cart<\/button>\n      <button id=\"ced-bath-drawer-continue\" class=\"ced-bath-secondary-btn\" type=\"button\">Continue Choosing<\/button>\n    <\/div>\n  <\/aside>\n\n  <div id=\"ced-bath-sticky-bar\" class=\"ced-bath-bottom-bar\">\n    <div class=\"ced-bath-sticky-info\">\n      <span id=\"ced-bath-sticky-label\">Current Subtotal<\/span>\n      <strong id=\"ced-bath-bottom-total\">\u20b50<\/strong>\n      <em id=\"ced-bath-sticky-meta\">Choose a door design first<\/em>\n    <\/div>\n    <div class=\"ced-bath-sticky-actions\">\n      <button id=\"ced-bath-add-selection\" type=\"button\">Add This Door<\/button>\n      <button id=\"ced-bath-view-selection\" type=\"button\">View Selection<\/button>\n    <\/div>\n  <\/div>\n<\/div>\n\n<style>\n.entry-title,.page-title,.elementor-page-title{display:none!important}\n#ced-bathroom-configurator{--bg:#f5f5f7;--card:#fff;--text:#1d1d1f;--muted:#6e6e73;--line:#d2d2d7;--blue:#0071e3;--orange:#ff6b00;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,\"Segoe UI\",sans-serif;min-height:100vh;padding-bottom:120px}\n#ced-bathroom-configurator *{box-sizing:border-box}\n#ced-bathroom-configurator button{font-family:inherit!important;appearance:none!important;-webkit-appearance:none!important}\n.ced-bath-hero{padding:34px 14px 28px;text-align:center}\n.ced-bath-copy span,.ced-bath-step-head span{display:block;color:var(--muted);font-size:12px;font-weight:700;margin-bottom:8px}\n.ced-bath-copy h1{margin:0 auto 10px;max-width:360px;font-size:34px;line-height:1.05;letter-spacing:-1.2px;font-weight:800}\n.ced-bath-copy p,.ced-bath-step-head p{margin:0 auto;max-width:340px;color:var(--muted);font-size:15px;line-height:1.42}\n.ced-bath-hero-media{margin-top:24px;width:100%;height:390px;border-radius:30px;overflow:hidden;background:#f5f5f7;border:1px solid rgba(0,0,0,.05);display:flex;align-items:center;justify-content:center}\n.ced-bath-hero-media img{width:100%;height:100%;object-fit:contain;border-radius:30px}\n.ced-bath-preview-card.is-empty img{display:none}\n.ced-bath-preview-card.is-empty{background:#f5f5f7}\n.ced-bath-step{padding:34px 14px 38px;background:#fff;border-radius:32px;margin:14px 10px;box-shadow:0 10px 35px rgba(0,0,0,.045)}\n.ced-bath-step-head{margin-bottom:20px;text-align:center}\n.ced-bath-step-head h2{margin:0 auto 10px;max-width:350px;font-size:28px;line-height:1.06;letter-spacing:-.8px;font-weight:800}\n.ced-bath-preview-card{width:100%;height:360px;border-radius:28px;overflow:hidden;background:#f5f5f7;border:1px solid rgba(0,0,0,.06);display:flex;align-items:center;justify-content:center;margin-bottom:22px}\n.ced-bath-preview-card img{width:100%;height:100%;object-fit:contain;object-position:center;border-radius:28px;transition:opacity .3s ease,transform .3s ease,filter .3s ease}\nimg.is-changing{opacity:0;transform:scale(.985);filter:blur(5px)}\n.ced-bath-horizontal-scroll{display:flex;gap:12px;overflow-x:auto;padding:2px 0 14px;-webkit-overflow-scrolling:touch;scrollbar-width:none;scroll-snap-type:x mandatory}\n.ced-bath-horizontal-scroll::-webkit-scrollbar{display:none}\n.ced-bath-design-card{border:none!important;background:transparent!important;padding:0!important;margin:0!important;text-align:center!important;scroll-snap-align:start;cursor:pointer;display:flex!important;flex-direction:column!important;align-items:center!important;gap:8px!important;flex:0 0 36%;min-width:112px}\n.ced-bath-thumb-frame{width:100%;height:124px;border:1.5px solid var(--line);border-radius:24px;overflow:hidden;background:#f5f5f7;display:flex;align-items:center;justify-content:center;position:relative;transition:border-color .22s ease,box-shadow .22s ease,opacity .22s ease}\n.ced-bath-design-card.active .ced-bath-thumb-frame{border-color:var(--blue);box-shadow:0 0 0 1px var(--blue)}\n.ced-bath-design-card.active .ced-bath-thumb-frame:after{content:\"\u2713\";position:absolute;right:8px;bottom:8px;width:20px;height:20px;border-radius:50%;background:var(--orange);color:#fff;font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center}\n.ced-bath-design-card.is-unavailable{opacity:.45;cursor:not-allowed}\n.ced-bath-thumb-frame img{width:100%;height:100%;object-fit:cover;display:block;border-radius:22px}\n.ced-bath-thumb-label{display:block!important;width:100%!important;font-size:12px!important;font-weight:760!important;color:var(--text)!important;line-height:1.2!important;text-align:center!important}\n.ced-bath-delivery-note{background:#f5f5f7;border-radius:22px;padding:16px;margin-bottom:16px;text-align:left}\n.ced-bath-delivery-note strong{display:block;font-size:15px;margin-bottom:4px}\n.ced-bath-delivery-note span{display:block;font-size:12px;color:var(--muted);line-height:1.35}\n.ced-bath-summary-card{background:#f5f5f7;border-radius:26px;padding:18px;margin-bottom:18px}\n.ced-bath-summary-card div{display:flex;justify-content:space-between;gap:14px;padding:13px 0;border-bottom:1px solid rgba(0,0,0,.08)}\n.ced-bath-summary-card div:last-child{border-bottom:none}\n.ced-bath-summary-card span{color:var(--muted);font-size:13px}\n.ced-bath-summary-card strong{font-size:14px;text-align:right}\n.ced-bath-total strong{font-size:22px}\n.ced-bath-qty-control{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:10px!important}\n.ced-bath-qty-control button{width:32px;height:32px;border:none;border-radius:50%;background:#fff;color:#1d1d1f;font-size:20px;font-weight:800;line-height:1;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(0,0,0,.08);cursor:pointer}\n.ced-bath-qty-control b{min-width:26px;text-align:center;font-size:16px;font-weight:800;color:#1d1d1f}\n.ced-bath-main-btn{width:100%;height:52px;border:none;border-radius:999px;background:#1d1d1f;color:#fff;font-size:16px;font-weight:760;cursor:pointer}\n.ced-bath-main-btn:disabled{opacity:.6;cursor:not-allowed}\n.ced-bath-bottom-bar{position:fixed;left:0;right:0;bottom:0;z-index:999999;padding:12px 14px calc(12px + env(safe-area-inset-bottom));background:rgba(255,255,255,.88);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);border-top:1px solid rgba(0,0,0,.08);box-shadow:0 -12px 34px rgba(0,0,0,.08);display:flex;align-items:center;justify-content:space-between;gap:12px}\n.ced-bath-sticky-info{min-width:0;flex:1;text-align:left}\n.ced-bath-bottom-bar span{display:block;font-size:11px;font-weight:750;color:var(--muted);line-height:1.1;margin-bottom:3px}\n.ced-bath-bottom-bar strong{display:block;font-size:20px;line-height:1.05;font-weight:850;color:var(--text);white-space:nowrap}\n.ced-bath-bottom-bar em{display:block;margin-top:3px;color:var(--muted);font-size:11px;line-height:1.15;font-style:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n.ced-bath-sticky-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex:0 0 auto}\n.ced-bath-bottom-bar button,.ced-bath-secondary-btn{height:44px;border-radius:999px;padding:0 16px;font-size:13px;font-weight:800;cursor:pointer;border:1px solid rgba(0,0,0,.12);white-space:nowrap;background:#fff;color:var(--text)}\n#ced-bath-add-selection{border:none;color:#fff;background:var(--orange);box-shadow:0 10px 24px rgba(255,107,0,.23)}\n.ced-bath-bottom-bar.is-added #ced-bath-add-selection{background:#fff;color:var(--text);border:1px solid rgba(0,0,0,.14);box-shadow:none}\n.ced-bath-bottom-bar.is-added #ced-bath-view-selection{background:var(--orange);color:#fff;border:none;box-shadow:0 10px 24px rgba(255,107,0,.23)}\n.ced-bath-drawer-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.28);opacity:0;pointer-events:none;z-index:1000000;transition:opacity .26s ease}\n.ced-bath-drawer-backdrop.open{opacity:1;pointer-events:auto}\n.ced-bath-selection-drawer{position:fixed;left:0;right:0;bottom:0;z-index:1000001;height:min(82svh,720px);background:#fff;border-radius:30px 30px 0 0;box-shadow:0 -24px 70px rgba(0,0,0,.22);transform:translateY(105%);transition:transform .34s cubic-bezier(.2,.85,.25,1);padding:10px 14px calc(16px + env(safe-area-inset-bottom));display:flex;flex-direction:column}\n.ced-bath-selection-drawer.open{transform:translateY(0)}\n.ced-bath-drawer-handle{width:44px;height:5px;border-radius:99px;background:#d2d2d7;margin:4px auto 14px;flex:0 0 auto}\n.ced-bath-drawer-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:0 4px 14px;border-bottom:1px solid rgba(0,0,0,.08);flex:0 0 auto}\n.ced-bath-drawer-head span{display:block;color:var(--muted);font-size:12px;font-weight:750;margin-bottom:6px}\n.ced-bath-drawer-head h3{margin:0;color:var(--text);font-size:24px;line-height:1.05;letter-spacing:-.6px;font-weight:850}\n.ced-bath-drawer-head em{display:block;margin-top:8px;color:var(--muted);font-size:12px;font-weight:750;font-style:normal}\n.ced-bath-drawer-head button{width:34px;height:34px;border-radius:50%;border:none;background:#f5f5f7;color:var(--text);font-size:24px;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer}\n.ced-bath-selection-items{overflow:auto;-webkit-overflow-scrolling:touch;padding:14px 0;flex:1 1 auto}\n.ced-bath-empty-selection{margin:0;color:var(--muted);font-size:13px;line-height:1.35;background:#f5f5f7;padding:16px;border-radius:20px}\n.ced-bath-selection-item{background:#f5f5f7;border-radius:22px;padding:15px;margin-bottom:12px}\n.ced-bath-selection-item-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px}\n.ced-bath-selection-item-title{margin:0;font-size:15px;line-height:1.2;font-weight:800;color:var(--text)}\n.ced-bath-selection-item-meta{display:block;margin-top:5px;color:var(--muted);font-size:12px;line-height:1.35}\n.ced-bath-selection-item-price{font-size:15px;font-weight:850;color:var(--text);white-space:nowrap}\n.ced-bath-selection-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid rgba(0,0,0,.07);padding-top:12px}\n.ced-bath-remove-item{border:none;background:transparent;color:#bf4800;font-size:13px;font-weight:700;cursor:pointer;padding:6px 0}\n.ced-bath-drawer-footer{flex:0 0 auto;background:#fff;border-top:1px solid rgba(0,0,0,.08);padding-top:12px}\n.ced-bath-selection-total{display:flex;align-items:center;justify-content:space-between;padding:0 0 12px}\n.ced-bath-selection-total span{color:var(--muted);font-size:14px;font-weight:650}\n.ced-bath-selection-total strong{color:var(--text);font-size:24px;font-weight:850}\n.ced-bath-drawer-footer .ced-bath-secondary-btn{width:100%;margin-top:10px;height:48px}\n@media(max-width:380px){.ced-bath-bottom-bar{padding-left:10px;padding-right:10px;gap:8px}.ced-bath-bottom-bar button{padding:0 12px;font-size:12px}.ced-bath-bottom-bar strong{font-size:18px}}\n<\/style>\n\n<script>\n(function(){\n  const designs = [{\"code\":\"B01\",\"product\":\"https:\\\/\\\/www.bwmo.com\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/7CDF42ED-226C-4AD7-9774-CA26CBC58184.jpg\",\"scene\":\"https:\\\/\\\/www.bwmo.com\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/7CDF42ED-226C-4AD7-9774-CA26CBC58184.jpg\",\"price\":1200,\"available\":true},{\"code\":\"B02\",\"product\":\"https:\\\/\\\/www.bwmo.com\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/FAD563C1-008D-45EF-9512-C182E9432836.jpg\",\"scene\":\"https:\\\/\\\/www.bwmo.com\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/FAD563C1-008D-45EF-9512-C182E9432836-1.jpg\",\"price\":1200,\"available\":true},{\"code\":\"B03\",\"product\":\"https:\\\/\\\/www.bwmo.com\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/CAA78798-9C6C-45E0-BE35-24394CE76ABA.jpg\",\"scene\":\"https:\\\/\\\/www.bwmo.com\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/CAA78798-9C6C-45E0-BE35-24394CE76ABA-1.jpg\",\"price\":1200,\"available\":true},{\"code\":\"B05\",\"product\":\"https:\\\/\\\/www.bwmo.com\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/66832340-4BBA-4769-9B8D-2076D73D966E.jpg\",\"scene\":\"https:\\\/\\\/www.bwmo.com\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/66832340-4BBA-4769-9B8D-2076D73D966E.jpg\",\"price\":1200,\"available\":true},{\"code\":\"B04\",\"product\":\"https:\\\/\\\/www.bwmo.com\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/CA30B3F4-A291-4329-81B5-14412ED80786.jpg\",\"scene\":\"https:\\\/\\\/www.bwmo.com\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/CA30B3F4-A291-4329-81B5-14412ED80786.jpg\",\"price\":1200,\"available\":true},{\"code\":\"B06\",\"product\":\"https:\\\/\\\/www.bwmo.com\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/DFC966FC-9F74-4C0E-8BE0-0DEFE0059BC5.jpg\",\"scene\":\"https:\\\/\\\/www.bwmo.com\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/DFC966FC-9F74-4C0E-8BE0-0DEFE0059BC5.jpg\",\"price\":1200,\"available\":true},{\"code\":\"B07\",\"product\":\"https:\\\/\\\/www.bwmo.com\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/592B546C-9E8B-4BA0-ADE7-35BEA43AE399.jpg\",\"scene\":\"https:\\\/\\\/www.bwmo.com\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/592B546C-9E8B-4BA0-ADE7-35BEA43AE399-1.jpg\",\"price\":1200,\"available\":true},{\"code\":\"B08\",\"product\":\"https:\\\/\\\/www.bwmo.com\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/A939A2D2-A822-4213-8E4C-57EC1D84E2A1.jpg\",\"scene\":\"https:\\\/\\\/www.bwmo.com\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/A939A2D2-A822-4213-8E4C-57EC1D84E2A1.jpg\",\"price\":1200,\"available\":true}];\n  const fallback = \"https:\/\/via.placeholder.com\/1400x900\/f5f5f7\/1d1d1f?text=CED+Bathroom+Door\";\n  const cedBathCart = {\n    ajaxUrl: \"https:\/\/www.bwmo.com\/wp-admin\/admin-ajax.php\",\n    nonce: \"fa9bd99d87\",\n    productId: 30800  };\n\n  const state = {design:\"\",price:0,selectedDesign:null,size:\"2050 x 800 mm\",quantity:1};\n  let selection = [];\n  let stickyMode = \"current\";\n\n  const heroImage = document.getElementById(\"ced-bath-hero-image\");\n  const previewImage = document.getElementById(\"ced-bath-preview\");\n  const designsWrap = document.getElementById(\"ced-bath-designs\");\n  const sumDesign = document.getElementById(\"bath-sum-design\");\n  const sumTotal = document.getElementById(\"bath-sum-total\");\n  const sumUnitTotal = document.getElementById(\"bath-sum-unit-total\");\n  const currentQty = document.getElementById(\"ced-bath-current-qty\");\n  const currentQtyMinus = document.getElementById(\"ced-bath-current-qty-minus\");\n  const currentQtyPlus = document.getElementById(\"ced-bath-current-qty-plus\");\n  const stickyBar = document.getElementById(\"ced-bath-sticky-bar\");\n  const stickyLabel = document.getElementById(\"ced-bath-sticky-label\");\n  const bottomTotal = document.getElementById(\"ced-bath-bottom-total\");\n  const stickyMeta = document.getElementById(\"ced-bath-sticky-meta\");\n  const addSelectionBtn = document.getElementById(\"ced-bath-add-selection\");\n  const viewSelectionBtn = document.getElementById(\"ced-bath-view-selection\");\n  const drawer = document.getElementById(\"ced-bath-selection-drawer\");\n  const drawerBackdrop = document.getElementById(\"ced-bath-drawer-backdrop\");\n  const closeSelectionBtn = document.getElementById(\"ced-bath-close-selection\");\n  const drawerContinueBtn = document.getElementById(\"ced-bath-drawer-continue\");\n  const selectionItemsWrap = document.getElementById(\"ced-bath-selection-items\");\n  const selectionTotalEl = document.getElementById(\"ced-bath-selection-total\");\n  const selectionCountEl = document.getElementById(\"ced-bath-selection-count\");\n  const addCartBtn = document.getElementById(\"ced-bath-add-cart\");\n\n  function money(num){ return \"\u20b5\" + Number(num || 0).toLocaleString(); }\n  function unitTotal(){ return Number(state.price || 0); }\n  function total(){ return unitTotal() * Number(state.quantity || 1); }\n  function selectionTotal(){ return selection.reduce((sum,item)=>sum+(Number(item.unitPrice||0)*Number(item.quantity||1)),0); }\n  function selectionCount(){ return selection.reduce((sum,item)=>sum+Number(item.quantity||0),0); }\n  function preload(src){ if(src){ const img = new Image(); img.src = src; } }\n\n  function fadeSwap(imgEl, src){\n    if(!imgEl || !src) return;\n    preload(src);\n    imgEl.classList.add(\"is-changing\");\n    setTimeout(()=>{\n      imgEl.src = src;\n      imgEl.onerror = function(){ imgEl.src = fallback; };\n      requestAnimationFrame(()=>imgEl.classList.remove(\"is-changing\"));\n    },160);\n  }\n\n  function updateImages(){\n    if(!state.selectedDesign) return;\n    const src = state.selectedDesign.scene || state.selectedDesign.product;\n    const previewWrap = document.querySelector(\"#ced-bathroom-configurator .ced-bath-preview-card\");\n    if(previewWrap) previewWrap.classList.remove(\"is-empty\");\n    fadeSwap(heroImage, src);\n    fadeSwap(previewImage, src);\n  }\n\n  function updateSummary(){\n    sumDesign.textContent = state.design || \"-\";\n    sumTotal.textContent = money(total());\n    sumUnitTotal.textContent = money(unitTotal());\n    currentQty.textContent = state.quantity;\n    updateStickyBar();\n  }\n\n  function updateStickyBar(){\n    if(stickyMode === \"added\") return;\n    const count = selectionCount();\n    stickyBar.classList.remove(\"is-added\");\n    if(count > 0){\n      stickyLabel.textContent = \"Selection Total\";\n      bottomTotal.textContent = money(selectionTotal());\n      stickyMeta.textContent = count + (count === 1 ? \" door selected\" : \" doors selected\");\n    }else{\n      stickyLabel.textContent = \"Current Subtotal\";\n      bottomTotal.textContent = money(total());\n      stickyMeta.textContent = state.design ? \"Ready to add this door\" : \"Choose a door design first\";\n    }\n    addSelectionBtn.textContent = \"Add This Door\";\n    viewSelectionBtn.textContent = \"View Selection\";\n  }\n\n  function openSelectionDrawer(){\n    drawer.classList.add(\"open\");\n    drawerBackdrop.classList.add(\"open\");\n    drawer.setAttribute(\"aria-hidden\",\"false\");\n  }\n\n  function closeSelectionDrawer(){\n    drawer.classList.remove(\"open\");\n    drawerBackdrop.classList.remove(\"open\");\n    drawer.setAttribute(\"aria-hidden\",\"true\");\n  }\n\n  function continueChoosing(){\n    closeSelectionDrawer();\n    state.quantity = 1;\n    stickyMode = \"current\";\n    updateSummary();\n    setTimeout(()=>{\n      const el = document.getElementById(\"ced-bath-step-design\");\n      if(el) el.scrollIntoView({behavior:\"smooth\",block:\"start\"});\n    },80);\n  }\n\n  function showAddedState(item){\n    stickyMode = \"added\";\n    stickyBar.classList.add(\"is-added\");\n    stickyLabel.textContent = \"Added to Selection\";\n    bottomTotal.textContent = item.design;\n    stickyMeta.textContent = item.size + \" \u00b7 Qty \" + item.quantity + \" \u00b7 \" + money(Number(item.unitPrice || 0) * Number(item.quantity || 1));\n    addSelectionBtn.textContent = \"Continue Choosing\";\n    viewSelectionBtn.textContent = \"View Selection\";\n  }\n\n  function changeDesign(item){\n    if(item.available === false) return;\n    stickyMode = \"current\";\n    state.design = item.code;\n    state.price = Number(item.price || 0);\n    state.selectedDesign = item;\n    updateImages();\n    updateSummary();\n  }\n\n  function addCurrentToSelection(){\n    if(!state.design){ alert(\"Please choose a bathroom door design first.\"); return; }\n    const key = state.design + \"|\" + state.size;\n    let item = selection.find(x => x.key === key);\n    if(item){\n      item.quantity += Number(state.quantity || 1);\n    }else{\n      item = {key:key,design:state.design,size:state.size,quantity:Number(state.quantity || 1),unitPrice:unitTotal()};\n      selection.push(item);\n    }\n    renderSelection();\n    showAddedState(item);\n    state.quantity = 1;\n    currentQty.textContent = state.quantity;\n  }\n\n  function changeSelectionQty(index, delta){\n    if(!selection[index]) return;\n    selection[index].quantity = Math.max(1, Number(selection[index].quantity || 1) + delta);\n    renderSelection();\n  }\n\n  function removeSelectionItem(index){\n    selection.splice(index,1);\n    stickyMode = \"current\";\n    renderSelection();\n  }\n\n  function renderSelection(){\n    if(!selection.length){\n      selectionItemsWrap.innerHTML = '<p class=\"ced-bath-empty-selection\">Your selection is empty. Add a bathroom door to begin.<\/p>';\n    }else{\n      selectionItemsWrap.innerHTML = selection.map((item,index)=>{\n        const subtotal = Number(item.unitPrice || 0) * Number(item.quantity || 1);\n        return `\n          <div class=\"ced-bath-selection-item\">\n            <div class=\"ced-bath-selection-item-top\">\n              <div>\n                <p class=\"ced-bath-selection-item-title\">${item.design}<\/p>\n                <span class=\"ced-bath-selection-item-meta\">${item.size}<\/span>\n                <span class=\"ced-bath-selection-item-meta\">Unit Price: ${money(item.unitPrice)}<\/span>\n              <\/div>\n              <strong class=\"ced-bath-selection-item-price\">${money(subtotal)}<\/strong>\n            <\/div>\n            <div class=\"ced-bath-selection-actions\">\n              <strong class=\"ced-bath-qty-control\">\n                <button type=\"button\" class=\"ced-bath-selection-minus\" data-index=\"${index}\">-<\/button>\n                <b>${item.quantity}<\/b>\n                <button type=\"button\" class=\"ced-bath-selection-plus\" data-index=\"${index}\">+<\/button>\n              <\/strong>\n              <button type=\"button\" class=\"ced-bath-remove-item\" data-index=\"${index}\">Remove<\/button>\n            <\/div>\n          <\/div>`;\n      }).join(\"\");\n    }\n\n    const count = selectionCount();\n    selectionCountEl.textContent = count + (count === 1 ? \" item\" : \" items\");\n    selectionTotalEl.textContent = money(selectionTotal());\n\n    document.querySelectorAll(\"#ced-bathroom-configurator .ced-bath-selection-minus\").forEach(btn=>btn.addEventListener(\"click\",()=>changeSelectionQty(Number(btn.dataset.index),-1)));\n    document.querySelectorAll(\"#ced-bathroom-configurator .ced-bath-selection-plus\").forEach(btn=>btn.addEventListener(\"click\",()=>changeSelectionQty(Number(btn.dataset.index),1)));\n    document.querySelectorAll(\"#ced-bathroom-configurator .ced-bath-remove-item\").forEach(btn=>btn.addEventListener(\"click\",()=>removeSelectionItem(Number(btn.dataset.index))));\n\n    if(stickyMode !== \"added\") updateStickyBar();\n  }\n\n  function renderDesigns(){\n    designsWrap.innerHTML = \"\";\n    if(!designs.length){\n      designsWrap.innerHTML = \"<p style='color:#6e6e73;font-size:13px;'>No bathroom door designs available.<\/p>\";\n      return;\n    }\n\n    designs.forEach((item)=>{\n      preload(item.product);\n      preload(item.scene);\n\n      const card = document.createElement(\"button\");\n      card.type = \"button\";\n      card.className = \"ced-bath-design-card\" + (item.available === false ? \" is-unavailable\" : \"\");\n      card.innerHTML = `<div class=\"ced-bath-thumb-frame\"><img decoding=\"async\" src=\"${item.product}\" alt=\"${item.code}\"><\/div><span class=\"ced-bath-thumb-label\">${String(item.code || '').toUpperCase()}<\/span>`;\n      card.addEventListener(\"click\",()=>{\n        if(item.available === false) return;\n        document.querySelectorAll(\"#ced-bathroom-configurator .ced-bath-design-card\").forEach(el=>el.classList.remove(\"active\"));\n        card.classList.add(\"active\");\n        changeDesign(item);\n      });\n      designsWrap.appendChild(card);\n    });\n  }\n\n  async function addSelectionToCart(){\n    if(!selection.length){\n      alert(\"Your selection is empty. Please add at least one bathroom door.\");\n      return;\n    }\n\n    addCartBtn.disabled = true;\n    addCartBtn.textContent = \"Adding...\";\n\n    const form = new FormData();\n    form.append(\"action\", \"ced_bath_add_to_cart\");\n    form.append(\"nonce\", cedBathCart.nonce);\n    form.append(\"product_id\", cedBathCart.productId);\n    form.append(\"items\", JSON.stringify(selection));\n\n    try{\n      const res = await fetch(cedBathCart.ajaxUrl, {method:\"POST\",credentials:\"same-origin\",body:form});\n      const data = await res.json();\n\n      if(!data.success){\n        alert(data.data && data.data.message ? data.data.message : \"Could not add to cart.\");\n        addCartBtn.disabled = false;\n        addCartBtn.textContent = \"Add Selection to Cart\";\n        return;\n      }\n\n      window.location.href = data.data.cart_url;\n    }catch(e){\n      alert(\"Network error. Please try again.\");\n      addCartBtn.disabled = false;\n      addCartBtn.textContent = \"Add Selection to Cart\";\n    }\n  }\n\n  currentQtyMinus.addEventListener(\"click\",()=>{stickyMode=\"current\";state.quantity=Math.max(1,Number(state.quantity||1)-1);updateSummary();});\n  currentQtyPlus.addEventListener(\"click\",()=>{stickyMode=\"current\";state.quantity=Math.min(99,Number(state.quantity||1)+1);updateSummary();});\n  addSelectionBtn.addEventListener(\"click\",()=>{if(stickyMode === \"added\"){continueChoosing();return;}addCurrentToSelection();});\n  viewSelectionBtn.addEventListener(\"click\",()=>{stickyMode=\"current\";updateStickyBar();openSelectionDrawer();});\n  closeSelectionBtn.addEventListener(\"click\", closeSelectionDrawer);\n  drawerBackdrop.addEventListener(\"click\", closeSelectionDrawer);\n  drawerContinueBtn.addEventListener(\"click\", continueChoosing);\n  addCartBtn.addEventListener(\"click\", addSelectionToCart);\n\n  renderDesigns();\n  renderSelection();\n  updateSummary();\n})();\n<\/script>\n\n\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-31077","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.bwmo.com\/index.php\/wp-json\/wp\/v2\/pages\/31077","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.bwmo.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.bwmo.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.bwmo.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.bwmo.com\/index.php\/wp-json\/wp\/v2\/comments?post=31077"}],"version-history":[{"count":1,"href":"https:\/\/www.bwmo.com\/index.php\/wp-json\/wp\/v2\/pages\/31077\/revisions"}],"predecessor-version":[{"id":31078,"href":"https:\/\/www.bwmo.com\/index.php\/wp-json\/wp\/v2\/pages\/31077\/revisions\/31078"}],"wp:attachment":[{"href":"https:\/\/www.bwmo.com\/index.php\/wp-json\/wp\/v2\/media?parent=31077"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}