{"id":21629,"date":"2026-05-24T11:34:46","date_gmt":"2026-05-24T15:34:46","guid":{"rendered":"https:\/\/blueguard.ca\/?page_id=21629"},"modified":"2026-05-31T17:04:47","modified_gmt":"2026-05-31T21:04:47","slug":"book-online","status":"publish","type":"page","link":"https:\/\/blueguard.ca\/fr\/book-online\/","title":{"rendered":"Book Online"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"21629\" class=\"elementor elementor-21629\" data-elementor-post-type=\"page\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-271ff29 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"271ff29\" data-element_type=\"section\" data-e-type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t\t<div class=\"elementor-background-overlay\"><\/div>\n\t\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-03bb118\" data-id=\"03bb118\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-652794e elementor-widget elementor-widget-icon-box\" data-id=\"652794e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"icon-box.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-icon-box-wrapper\">\n\n\t\t\t\n\t\t\t\t\t\t<div class=\"elementor-icon-box-content\">\n\n\t\t\t\t\t\t\t\t\t<h1 class=\"elementor-icon-box-title\">\n\t\t\t\t\t\t<span  >\n\t\t\t\t\t\t\tBuild Your <span style=\"color:#7ac943;font-size:45px\">Cleaning<\/span> Package\t\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/h1>\n\t\t\t\t\n\t\t\t\t\t\t\t\t\t<p class=\"elementor-icon-box-description\">\n\t\t\t\t\t\tPick exactly the services you need, choose an available date, and we'll confirm within 1 hour. NADCA-certified technicians.\t\t\t\t\t<\/p>\n\t\t\t\t\n\t\t\t<\/div>\n\t\t\t\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t<div class=\"elementor-element elementor-element-9729e69 e-con-full e-flex e-con e-parent\" data-id=\"9729e69\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b0b1cf4 elementor-widget elementor-widget-shortcode\" data-id=\"b0b1cf4\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\"><style>\n.bg-book *, .bg-book *::before, .bg-book *::after { box-sizing: border-box !important; margin: 0 !important; padding: 0 !important; }\n.bg-book { font-family: 'Nunito', sans-serif !important; color: #0B1E3F !important; background: #f4f7fb00 !important; min-height: 100vh !important; padding: 0 !important; }\n\n\/* HERO *\/\n.bg-book__hero { max-width: 1100px !important; margin: 0 auto 36px auto !important; text-align: center !important; }\n.bg-book__eyebrow { display: inline-block !important; background: #7AC943 !important; color: #0B1E3F !important; font-family: 'Barlow Condensed', sans-serif !important; font-weight: 700 !important; font-size: 14px !important; letter-spacing: 2px !important; text-transform: uppercase !important; padding: 8px 16px !important; border-radius: 4px !important; margin-bottom: 16px !important; }\n.bg-book__title { font-family: 'Barlow Condensed', sans-serif !important; font-weight: 800 !important; font-size: clamp(34px, 5vw, 54px) !important; line-height: 1.05 !important; color: #0B1E3F !important; text-transform: uppercase !important; letter-spacing: -0.5px !important; margin-bottom: 12px !important; }\n.bg-book__title span { color: #2B6CD4 !important; }\n.bg-book__subtitle { font-weight: 600 !important; font-size: 17px !important; color: #4B5C7A !important; max-width: 620px !important; margin: 0 auto !important; line-height: 1.5 !important; }\n\n\/* CARD *\/\n.bg-book__card { max-width: 940px !important; margin: 0 auto !important; background: #FFFFFF !important; border-radius: 18px !important; box-shadow: 0 24px 60px rgba(11, 30, 63, 0.10) !important; overflow: hidden !important; }\n\n\/* PROGRESS *\/\n.bg-book__progress { display: flex !important; background: #0B1E3F !important; }\n.bg-book__step { flex: 1 !important; padding: 18px 10px !important; text-align: center !important; font-family: 'Barlow Condensed', sans-serif !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: 1px !important; font-size: 13px !important; color: rgba(255,255,255,0.45) !important; border-bottom: 3px solid transparent !important; transition: all 0.3s ease !important; }\n.bg-book__step--active { color: #FFFFFF !important; border-bottom-color: #7AC943 !important; background: rgba(255,255,255,0.06) !important; }\n.bg-book__step--done { color: #7AC943 !important; border-bottom-color: #7AC943 !important; }\n.bg-book__step-num { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 22px !important; height: 22px !important; border-radius: 50% !important; background: rgba(255,255,255,0.15) !important; color: #fff !important; font-size: 12px !important; font-weight: 800 !important; margin-right: 6px !important; }\n.bg-book__step--active .bg-book__step-num { background: #2B6CD4 !important; }\n.bg-book__step--done .bg-book__step-num { background: #7AC943 !important; color: #0B1E3F !important; }\n\n\/* PANEL *\/\n.bg-book__panel { padding: 40px 15px !important; display: none !important; }\n.bg-book__panel--active { display: block !important; animation: bgFade 0.4s ease !important; }\n@keyframes bgFade { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }\n.bg-book__panel-title { font-family: 'Barlow Condensed', sans-serif !important; font-weight: 800 !important; font-size: 28px !important; text-transform: uppercase !important; color: #0B1E3F !important; margin-bottom: 4px !important; }\n.bg-book__panel-sub { font-size: 15px !important; color: #6B7B97 !important; margin-bottom: 26px !important; }\n\n\/* SERVICE BLOCK *\/\n.bg-book__svc { border: 2px solid #E3EAF3 !important; border-radius: 14px !important; margin-bottom: 16px !important; overflow: hidden !important; transition: all 0.25s ease !important; }\n.bg-book__svc.is-active { border-color: #2B6CD4 !important; box-shadow: 0 10px 26px rgba(43,108,212,0.12) !important; }\n.bg-book__svc-head { display: flex !important; align-items: center !important; gap: 14px !important; padding: 20px !important; cursor: pointer !important; background: #FFFFFF !important; }\n.bg-book__svc.is-active .bg-book__svc-head { background: #F4F8FF !important; }\n.bg-book__svc-check { width: 26px !important; height: 26px !important; border: 2px solid #C5CEDC !important; border-radius: 7px !important; flex-shrink: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; transition: all 0.2s ease !important; }\n.bg-book__svc.is-active .bg-book__svc-check { background: #7AC943 !important; border-color: #7AC943 !important; }\n.bg-book__svc.is-active .bg-book__svc-check::after { content: '\u2713' !important; color: #0B1E3F !important; font-weight: 800 !important; font-size: 15px !important; }\n.bg-book__svc-icon { font-size: 30px !important; flex-shrink: 0 !important; }\n.bg-book__svc-info { flex: 1 !important; }\n.bg-book__svc-name { font-family: 'Barlow Condensed', sans-serif !important; font-weight: 700 !important; font-size: 20px !important; text-transform: uppercase !important; color: #0B1E3F !important; line-height: 1.1 !important; }\n.bg-book__svc-desc { font-size: 13px !important; color: #6B7B97 !important; margin-top: 2px !important; }\n.bg-book__svc-price { font-family: 'Barlow Condensed', sans-serif !important; font-weight: 700 !important; font-size: 16px !important; color: #2B6CD4 !important; white-space: nowrap !important; }\n\n\/* SERVICE BODY (options that expand) *\/\n.bg-book__svc-body { display: none !important; padding: 0 20px 20px 20px !important; border-top: 1px dashed #E3EAF3 !important; }\n.bg-book__svc.is-active .bg-book__svc-body { display: block !important; animation: bgFade 0.3s ease !important; }\n.bg-book__opt-row { display: flex !important; align-items: center !important; justify-content: space-between !important; padding: 14px 0 !important; border-bottom: 1px solid #F0F4F9 !important; }\n.bg-book__opt-row:last-child { border-bottom: none !important; }\n.bg-book__opt-label { font-weight: 700 !important; font-size: 15px !important; color: #0B1E3F !important; }\n.bg-book__opt-hint { font-size: 12px !important; color: #9AA8BD !important; font-weight: 600 !important; margin-top: 2px !important; }\n\n\/* QUANTITY STEPPER *\/\n.bg-book__qty { display: flex !important; align-items: center !important; gap: 0 !important; border: 2px solid #E3EAF3 !important; border-radius: 10px !important; overflow: hidden !important; }\n.bg-book__qty-btn { width: 42px !important; height: 42px !important; border: none !important; background: #F4F7FB !important; color: #2B6CD4 !important; font-size: 22px !important; font-weight: 700 !important; cursor: pointer !important; transition: all 0.15s ease !important; display: flex !important; align-items: center !important; justify-content: center !important; }\n.bg-book__qty-btn:hover { background: #2B6CD4 !important; color: #fff !important; }\n.bg-book__qty-btn:disabled { color: #C5CEDC !important; cursor: not-allowed !important; background: #F4F7FB !important; }\n.bg-book__qty-val { width: 52px !important; text-align: center !important; font-family: 'Barlow Condensed', sans-serif !important; font-weight: 800 !important; font-size: 20px !important; color: #0B1E3F !important; border: none !important; background: #fff !important; outline: none !important; }\n\n\/* FLOOR CHECKBOXES *\/\n.bg-book__floors { display: flex !important; flex-wrap: wrap !important; gap: 10px !important; }\n.bg-book__floor { padding: 9px 16px !important; border: 2px solid #E3EAF3 !important; border-radius: 30px !important; font-weight: 700 !important; font-size: 13px !important; color: #6B7B97 !important; cursor: pointer !important; transition: all 0.2s ease !important; user-select: none !important; }\n.bg-book__floor:hover { border-color: #2B6CD4 !important; }\n.bg-book__floor.is-on { background: #2B6CD4 !important; border-color: #2B6CD4 !important; color: #fff !important; }\n\n\/* TOGGLE SWITCH for simple yes\/no addons *\/\n.bg-book__toggle { position: relative !important; width: 50px !important; height: 28px !important; background: #C5CEDC !important; border-radius: 30px !important; cursor: pointer !important; transition: background 0.25s ease !important; flex-shrink: 0 !important; }\n.bg-book__toggle.is-on { background: #7AC943 !important; }\n.bg-book__toggle::after { content: '' !important; position: absolute !important; top: 3px !important; left: 3px !important; width: 22px !important; height: 22px !important; background: #fff !important; border-radius: 50% !important; transition: transform 0.25s ease !important; box-shadow: 0 2px 5px rgba(0,0,0,0.2) !important; }\n.bg-book__toggle.is-on::after { transform: translateX(22px) !important; }\n\n\/* CALENDAR *\/\n.bg-book__cal-wrap { display: grid !important; grid-template-columns: 1.4fr 1fr !important; gap: 24px !important; }\n.bg-book__cal { background: #FFFFFF !important; border: 2px solid #E3EAF3 !important; border-radius: 14px !important; padding: 20px !important; }\n.bg-book__cal-head { display: flex !important; justify-content: space-between !important; align-items: center !important; margin-bottom: 16px !important; }\n.bg-book__cal-month { font-family: 'Barlow Condensed', sans-serif !important; font-weight: 800 !important; font-size: 21px !important; text-transform: uppercase !important; color: #0B1E3F !important; }\n.bg-book__cal-nav { display: flex !important; gap: 8px !important; }\n.bg-book__cal-btn { width: 36px !important; height: 36px !important; border-radius: 50% !important; background: #F4F7FB !important; border: none !important; cursor: pointer !important; font-size: 16px !important; font-weight: 700 !important; color: #2B6CD4 !important; transition: all 0.2s ease !important; }\n.bg-book__cal-btn:hover { background: #2B6CD4 !important; color: #fff !important; }\n.bg-book__cal-grid { display: grid !important; grid-template-columns: repeat(7, 1fr) !important; gap: 4px !important; }\n.bg-book__cal-dow { text-align: center !important; padding: 6px 0 !important; font-family: 'Barlow Condensed', sans-serif !important; font-weight: 700 !important; font-size: 11px !important; color: #9AA8BD !important; text-transform: uppercase !important; letter-spacing: 1px !important; }\n.bg-book__cal-day { aspect-ratio: 1\/1 !important; display: flex !important; align-items: center !important; justify-content: center !important; border-radius: 8px !important; cursor: pointer !important; font-weight: 700 !important; font-size: 14px !important; color: #0B1E3F !important; background: #F4F7FB !important; transition: all 0.15s ease !important; position: relative !important; }\n.bg-book__cal-day:hover:not(.is-disabled):not(.is-empty) { background: #2B6CD4 !important; color: #fff !important; }\n.bg-book__cal-day.is-available::after { content: '' !important; position: absolute !important; bottom: 4px !important; left: 50% !important; transform: translateX(-50%) !important; width: 5px !important; height: 5px !important; border-radius: 50% !important; background: #7AC943 !important; }\n.bg-book__cal-day.is-selected { background: #2B6CD4 !important; color: #fff !important; }\n.bg-book__cal-day.is-selected::after { background: #fff !important; }\n.bg-book__cal-day.is-disabled { color: #C5CEDC !important; cursor: not-allowed !important; background: transparent !important; }\n.bg-book__cal-day.is-empty { background: transparent !important; cursor: default !important; }\n\n\/* TIME SLOTS *\/\n.bg-book__slots-title { font-family: 'Barlow Condensed', sans-serif !important; font-weight: 700 !important; font-size: 16px !important; text-transform: uppercase !important; color: #0B1E3F !important; margin-bottom: 12px !important; }\n.bg-book__slots { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 8px !important; }\n.bg-book__slot { padding: 12px !important; text-align: center !important; border: 2px solid #E3EAF3 !important; border-radius: 9px !important; font-weight: 700 !important; font-size: 14px !important; color: #0B1E3F !important; cursor: pointer !important; transition: all 0.2s ease !important; }\n.bg-book__slot:hover { border-color: #2B6CD4 !important; }\n.bg-book__slot.is-on { background: #2B6CD4 !important; border-color: #2B6CD4 !important; color: #fff !important; }\n.bg-book__slot-empty { grid-column: 1\/-1 !important; text-align: center !important; color: #9AA8BD !important; font-size: 14px !important; padding: 30px 0 !important; }\n.bg-book__slot { position: relative !important; overflow: hidden !important; }\n.bg-book__slot.is-full { background: #F7F8FA !important; border-color: #EBEEF3 !important; border-style: dashed !important; color: #AEB7C4 !important; cursor: not-allowed !important; }\n.bg-book__slot.is-full:hover { border-color: #EBEEF3 !important; transform: none !important; }\n.bg-book__slot.is-full .bg-book__slot-time { text-decoration: line-through !important; text-decoration-color: #CBD2DC !important; font-weight: 700 !important; }\n.bg-book__slot.is-full .bg-book__slot-tag { display: inline-flex !important; align-items: center !important; gap: 4px !important; margin-top: 4px !important; font-size: 11px !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: 0.5px !important; color: #E04848 !important; }\n.bg-book__slot-cross { position: absolute !important; top: 8px !important; right: 8px !important; width: 20px !important; height: 20px !important; background: #FBE9E9 !important; border-radius: 50% !important; display: flex !important; align-items: center !important; justify-content: center !important; }\n.bg-book__slot-cross svg { width: 11px !important; height: 11px !important; stroke: #E04848 !important; stroke-width: 2.5 !important; }\n.bg-book__slots-title { transition: color 0.3s ease !important; }\n.bg-book__slots-wrap-highlight { animation: bgPulse 1.2s ease 2 !important; border-radius: 12px !important; }\n@keyframes bgPulse {\n  0% { box-shadow: 0 0 0 0 rgba(122,201,67,0.5); }\n  50% { box-shadow: 0 0 0 8px rgba(122,201,67,0.08); }\n  100% { box-shadow: 0 0 0 0 rgba(122,201,67,0); }\n}\n.bg-book__slots-title.is-active { color: #7AC943 !important; } \n  \n  \n\n\/* FORM *\/\n.bg-book__form-grid { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 16px !important; }\n.bg-book__field { display: flex !important; flex-direction: column !important; }\n.bg-book__field--full { grid-column: 1\/-1 !important; }\n.bg-book__label { font-family: 'Barlow Condensed', sans-serif !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: 1px !important; font-size: 13px !important; color: #0B1E3F !important; margin-bottom: 6px !important; }\n.bg-book__label span { color: #E04848 !important; }\n.bg-book__input, .bg-book__textarea { font-family: 'Nunito', sans-serif !important; font-weight: 600 !important; font-size: 15px !important; padding: 12px 14px !important; border: 2px solid #E3EAF3 !important; border-radius: 8px !important; color: #0B1E3F !important; background: #fff !important; transition: border-color 0.2s ease !important; outline: none !important; width: 100% !important; }\n.bg-book__input:focus, .bg-book__textarea:focus { border-color: #2B6CD4 !important; }\n.bg-book__textarea { resize: vertical !important; min-height: 80px !important; }\n\n\/* SUMMARY SIDEBAR (sticky) *\/\n.bg-book__layout { display: grid !important; grid-template-columns: 1fr 300px !important; gap: 28px !important; align-items: start !important; }\n.bg-book__cart { background: #0B1E3F !important; border-radius: 14px !important; padding: 24px !important; position: sticky !important; top: 20px !important; }\n.bg-book__cart-title { font-family: 'Barlow Condensed', sans-serif !important; font-weight: 800 !important; font-size: 20px !important; text-transform: uppercase !important; color: #fff !important; margin-bottom: 16px !important; padding-bottom: 14px !important; border-bottom: 1px solid rgba(255,255,255,0.12) !important; }\n.bg-book__cart-row { display: flex !important; justify-content: space-between !important; gap: 10px !important; padding: 8px 0 !important; font-size: 14px !important; color: rgba(255,255,255,0.85) !important; }\n.bg-book__cart-row strong { color: #7AC943 !important; font-weight: 700 !important; }\n.bg-book__cart-empty { color: rgba(255,255,255,0.5) !important; font-size: 14px !important; text-align: center !important; padding: 20px 0 !important; }\n.bg-book__cart-note { margin-top: 16px !important; padding-top: 14px !important; border-top: 1px solid rgba(255,255,255,0.12) !important; font-size: 12px !important; color: rgba(255,255,255,0.55) !important; line-height: 1.5 !important; }\n\n\/* SUMMARY (final step) *\/\n.bg-book__summary { background: #F4F7FB !important; border-radius: 12px !important; padding: 20px !important; margin-bottom: 20px !important; }\n.bg-book__summary-row { display: flex !important; justify-content: space-between !important; gap: 12px !important; padding: 10px 0 !important; border-bottom: 1px solid #E3EAF3 !important; font-size: 14px !important; }\n.bg-book__summary-row:last-child { border-bottom: none !important; }\n.bg-book__summary-key { color: #6B7B97 !important; font-weight: 600 !important; font-family: 'Barlow Condensed', sans-serif !important; text-transform: uppercase !important; letter-spacing: 1px !important; }\n.bg-book__summary-val { color: #0B1E3F !important; font-weight: 700 !important; text-align: right !important; max-width: 60% !important; }\n\n\/* NAV BUTTONS *\/\n.bg-book__nav { display: flex !important; justify-content: space-between !important; gap: 12px !important; margin-top: 28px !important; }\n.bg-book__btn { font-family: 'Barlow Condensed', sans-serif !important; font-weight: 800 !important; text-transform: uppercase !important; letter-spacing: 1.5px !important; font-size: 15px !important; padding: 14px 30px !important; border-radius: 8px !important; border: none !important; cursor: pointer !important; transition: all 0.25s ease !important; }\n.bg-book__btn--primary { background: #2B6CD4 !important; color: #fff !important; box-shadow: 0 6px 14px rgba(43,108,212,0.25) !important; }\n.bg-book__btn--primary:hover { background: #1F58B3 !important; transform: translateY(-2px) !important; }\n.bg-book__btn--primary:disabled { background: #C5CEDC !important; box-shadow: none !important; cursor: not-allowed !important; transform: none !important; }\n.bg-book__btn--secondary { background: #fff !important; color: #2B6CD4 !important; border: 2px solid #E3EAF3 !important; }\n.bg-book__btn--secondary:hover { border-color: #2B6CD4 !important; }\n.bg-book__btn--success { background: #7AC943 !important; color: #0B1E3F !important; box-shadow: 0 6px 14px rgba(122,201,67,0.30) !important; }\n.bg-book__btn--success:hover { background: #6BB838 !important; transform: translateY(-2px) !important; }\n\n\/* SUCCESS *\/\n.bg-book__success { text-align: center !important; padding: 20px 0 !important; }\n.bg-book__success-icon { width: 80px !important; height: 80px !important; background: #7AC943 !important; border-radius: 50% !important; display: flex !important; align-items: center !important; justify-content: center !important; margin: 0 auto 20px auto !important; font-size: 40px !important; color: #0B1E3F !important; animation: bgPop 0.5s ease !important; }\n@keyframes bgPop { 0% { transform: scale(0); } 60% { transform: scale(1.15); } 100% { transform: scale(1); } }\n.bg-book__success-title { font-family: 'Barlow Condensed', sans-serif !important; font-weight: 800 !important; font-size: 32px !important; text-transform: uppercase !important; color: #0B1E3F !important; margin-bottom: 8px !important; }\n.bg-book__success-sub { font-size: 16px !important; color: #6B7B97 !important; margin-bottom: 24px !important; line-height: 1.5 !important; }\n.bg-book__success-ref { background: #F4F8FF !important; border: 2px dashed #2B6CD4 !important; border-radius: 10px !important; padding: 14px 22px !important; display: inline-block !important; margin-bottom: 28px !important; }\n.bg-book__success-ref small { display: block !important; font-family: 'Barlow Condensed', sans-serif !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: 1px !important; font-size: 11px !important; color: #6B7B97 !important; margin-bottom: 4px !important; }\n.bg-book__success-ref strong { font-family: 'Barlow Condensed', sans-serif !important; font-weight: 800 !important; font-size: 22px !important; color: #2B6CD4 !important; letter-spacing: 2px !important; }\n\n.bg-book__error { display: none !important; background: #FFF0F0 !important; border-left: 4px solid #E04848 !important; padding: 12px 14px !important; border-radius: 6px !important; color: #C03333 !important; font-size: 14px !important; font-weight: 600 !important; margin-bottom: 16px !important; }\n.bg-book__error.is-shown { display: block !important; }\n\n@media (max-width: 820px) {\n  .bg-book__layout { grid-template-columns: 1fr !important; }\n  .bg-book__cart { position: static !important; }\n  .bg-book__cal-wrap { grid-template-columns: 1fr !important; }\n}\n@media (max-width: 600px) {\n  .bg-book { padding: 50px 10px !important; }\n  .bg-book__panel { padding: 24px 18px !important; }\n  .bg-book__form-grid { grid-template-columns: 1fr !important; }\n  .bg-book__step { font-size: 0 !important; padding: 14px 4px !important; }\n  .bg-book__step-num { margin-right: 0 !important; font-size: 12px !important; }\n  .bg-book__slots { grid-template-columns: 1fr !important; }\n  .bg-book__nav { flex-direction: column-reverse !important; }\n  .bg-book__btn { width: 100% !important; }\n  .bg-book__svc-name { font-size: 16px !important;}\n  .bg-book__svc-desc { line-height: 17px; }\n  .bg-book__svc-head { padding: 15px 10px !important; gap: 6px !important; }\n}\n<\/style>\n\n<div class=\"bg-book\">\n\n  \n\n  <div class=\"bg-book__card\">\n\n    <div class=\"bg-book__progress\">\n      <div class=\"bg-book__step bg-book__step--active\" data-step=\"1\"><span class=\"bg-book__step-num\">1<\/span>Services<\/div>\n      <div class=\"bg-book__step\" data-step=\"2\"><span class=\"bg-book__step-num\">2<\/span>Date &amp; Time<\/div>\n      <div class=\"bg-book__step\" data-step=\"3\"><span class=\"bg-book__step-num\">3<\/span>Your Details<\/div>\n      <div class=\"bg-book__step\" data-step=\"4\"><span class=\"bg-book__step-num\">4<\/span>Confirm<\/div>\n    <\/div>\n\n    <!-- ====== STEP 1: SERVICES ====== -->\n    <div class=\"bg-book__panel bg-book__panel--active\" data-panel=\"1\">\n      <div class=\"bg-book__layout\">\n        <div>\n          <h2 class=\"bg-book__panel-title\">Choose Your Services<\/h2>\n          <p class=\"bg-book__panel-sub\">Select one or more. Use the +\/\u2212 to set quantities.<\/p>\n\n                    <div class=\"bg-book__svc\" data-svc-id=\"1\"\n               data-svc-name=\"Air Duct Cleaning\"\n               data-svc-type=\"quantity\">\n            <div class=\"bg-book__svc-head\">\n              <div class=\"bg-book__svc-check\"><\/div>\n              <span class=\"bg-book__svc-icon\">\n                                      <img decoding=\"async\" src=\"https:\/\/blueguard.ca\/wp-content\/uploads\/2025\/10\/piping_3653207.png\" alt=\"\" style=\"width:32px;height:32px;object-fit:contain;display:block;\" title=\"\">\n                                  <\/span>\n              <div class=\"bg-book__svc-info\">\n                <div class=\"bg-book__svc-name\">Air Duct Cleaning<\/div>\n                <div class=\"bg-book__svc-desc\">Complete residential air duct system cleaning<\/div>\n              <\/div>\n            <\/div>\n            <div class=\"bg-book__svc-body\">\n                            <div class=\"bg-book__opt-row\">\n                <div>\n                  <div class=\"bg-book__opt-label\">Number of Vents<\/div>\n                  <div class=\"bg-book__opt-hint\">How many supply &amp; return vents in your home?<\/div>\n                <\/div>\n                <div class=\"bg-book__qty\"\n                     data-qty-key=\"vents\"\n                     data-qty-min=\"1\"\n                     data-qty-max=\"99\">\n                  <button class=\"bg-book__qty-btn\" data-act=\"minus\">\u2212<\/button>\n                  <input class=\"bg-book__qty-val\" value=\"10\" readonly \/>\n                  <button class=\"bg-book__qty-btn\" data-act=\"plus\">+<\/button>\n                <\/div>\n              <\/div>\n                          <\/div>\n          <\/div>\n                    <div class=\"bg-book__svc\" data-svc-id=\"2\"\n               data-svc-name=\"Air Exchanger Cleaning\"\n               data-svc-type=\"none\">\n            <div class=\"bg-book__svc-head\">\n              <div class=\"bg-book__svc-check\"><\/div>\n              <span class=\"bg-book__svc-icon\">\n                                      <img decoding=\"async\" src=\"https:\/\/blueguard.ca\/wp-content\/uploads\/2025\/09\/air-filter.svg\" alt=\"\" style=\"width:32px;height:32px;object-fit:contain;display:block;\" title=\"\">\n                                  <\/span>\n              <div class=\"bg-book__svc-info\">\n                <div class=\"bg-book__svc-name\">Air Exchanger Cleaning<\/div>\n                <div class=\"bg-book__svc-desc\">HRV\/ERV unit, core &amp; filters cleaned<\/div>\n              <\/div>\n            <\/div>\n            <div class=\"bg-book__svc-body\">\n                            <div class=\"bg-book__opt-row\">\n                <div>\n                  <div class=\"bg-book__opt-label\">Air exchanger included<\/div>\n                  <div class=\"bg-book__opt-hint\">Added to your package<\/div>\n                <\/div>\n                <span style=\"color:#7AC943;font-weight:800;font-family:'Barlow Condensed',sans-serif;text-transform:uppercase;\">Added \u2713<\/span>\n              <\/div>\n                          <\/div>\n          <\/div>\n                    <div class=\"bg-book__svc\" data-svc-id=\"3\"\n               data-svc-name=\"Dryer Vent Cleaning\"\n               data-svc-type=\"floors\">\n            <div class=\"bg-book__svc-head\">\n              <div class=\"bg-book__svc-check\"><\/div>\n              <span class=\"bg-book__svc-icon\">\n                                      <img decoding=\"async\" src=\"https:\/\/blueguard.ca\/wp-content\/uploads\/2025\/09\/bathroom_2891110.svg\" alt=\"\" style=\"width:32px;height:32px;object-fit:contain;display:block;\" title=\"\">\n                                  <\/span>\n              <div class=\"bg-book__svc-info\">\n                <div class=\"bg-book__svc-name\">Dryer Vent Cleaning<\/div>\n                <div class=\"bg-book__svc-desc\">Remove lint buildup, prevent fire hazards<\/div>\n              <\/div>\n            <\/div>\n            <div class=\"bg-book__svc-body\">\n                            <div class=\"bg-book__opt-row\">\n                <div>\n                  <div class=\"bg-book__opt-label\">Which floors need service?<\/div>\n                  <div class=\"bg-book__opt-hint\">Select all that apply<\/div>\n                <\/div>\n              <\/div>\n              <div class=\"bg-book__floors\" data-floors-key=\"floors\">\n                                  <div class=\"bg-book__floor\" data-floor=\"Basement\">Basement<\/div>\n                                  <div class=\"bg-book__floor\" data-floor=\"Main Floor\">Main Floor<\/div>\n                                  <div class=\"bg-book__floor\" data-floor=\"Second Floor\">Second Floor<\/div>\n                              <\/div>\n                          <\/div>\n          <\/div>\n                    <div class=\"bg-book__svc\" data-svc-id=\"4\"\n               data-svc-name=\"Main Duct Line Sanitization\"\n               data-svc-type=\"none\">\n            <div class=\"bg-book__svc-head\">\n              <div class=\"bg-book__svc-check\"><\/div>\n              <span class=\"bg-book__svc-icon\">\n                                      <img decoding=\"async\" src=\"https:\/\/blueguard.ca\/wp-content\/uploads\/2025\/09\/wind.png\" alt=\"\" style=\"width:32px;height:32px;object-fit:contain;display:block;\" title=\"\">\n                                  <\/span>\n              <div class=\"bg-book__svc-info\">\n                <div class=\"bg-book__svc-name\">Main Duct Line Sanitization<\/div>\n                <div class=\"bg-book__svc-desc\">Antimicrobial fogging treatment of the main trunk line<\/div>\n              <\/div>\n            <\/div>\n            <div class=\"bg-book__svc-body\">\n                            <div class=\"bg-book__opt-row\">\n                <div>\n                  <div class=\"bg-book__opt-label\">Sanitization included<\/div>\n                  <div class=\"bg-book__opt-hint\">Added to your package<\/div>\n                <\/div>\n                <span style=\"color:#7AC943;font-weight:800;font-family:'Barlow Condensed',sans-serif;text-transform:uppercase;\">Added \u2713<\/span>\n              <\/div>\n                          <\/div>\n          <\/div>\n                    <div class=\"bg-book__svc\" data-svc-id=\"5\"\n               data-svc-name=\"Ventilation Fan Cleaning\"\n               data-svc-type=\"quantity\">\n            <div class=\"bg-book__svc-head\">\n              <div class=\"bg-book__svc-check\"><\/div>\n              <span class=\"bg-book__svc-icon\">\n                                      <img decoding=\"async\" src=\"https:\/\/blueguard.ca\/wp-content\/uploads\/2025\/09\/fan_4236262.svg\" alt=\"\" style=\"width:32px;height:32px;object-fit:contain;display:block;\" title=\"\">\n                                  <\/span>\n              <div class=\"bg-book__svc-info\">\n                <div class=\"bg-book__svc-name\">Ventilation Fan Cleaning<\/div>\n                <div class=\"bg-book__svc-desc\">Bathroom &amp; exhaust fan cleaning<\/div>\n              <\/div>\n            <\/div>\n            <div class=\"bg-book__svc-body\">\n                            <div class=\"bg-book__opt-row\">\n                <div>\n                  <div class=\"bg-book__opt-label\">Number of Fans<\/div>\n                  <div class=\"bg-book__opt-hint\">How many exhaust\/ventilation fans?<\/div>\n                <\/div>\n                <div class=\"bg-book__qty\"\n                     data-qty-key=\"fans\"\n                     data-qty-min=\"1\"\n                     data-qty-max=\"99\">\n                  <button class=\"bg-book__qty-btn\" data-act=\"minus\">\u2212<\/button>\n                  <input class=\"bg-book__qty-val\" value=\"1\" readonly \/>\n                  <button class=\"bg-book__qty-btn\" data-act=\"plus\">+<\/button>\n                <\/div>\n              <\/div>\n                          <\/div>\n          <\/div>\n          \n          <div class=\"bg-book__nav\">\n            <span><\/span>\n            <button class=\"bg-book__btn bg-book__btn--primary\" id=\"bgNext1\" disabled>Continue \u2192<\/button>\n          <\/div>\n        <\/div>\n\n        <!-- LIVE CART -->\n        <div class=\"bg-book__cart\">\n          <div class=\"bg-book__cart-title\">Your Package<\/div>\n          <div id=\"bgCartBody\">\n            <div class=\"bg-book__cart-empty\">No services selected yet<\/div>\n          <\/div>\n          <div class=\"bg-book__cart-note\">Our team will confirm your booking with a quick call. No payment is taken online.<\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n\n    <!-- ====== STEP 2: DATE & TIME ====== -->\n    <div class=\"bg-book__panel\" data-panel=\"2\">\n      <h2 class=\"bg-book__panel-title\">Pick a Date &amp; Time<\/h2>\n      <p class=\"bg-book__panel-sub\">Green dot = available. Choose a day, then an available time slot.<\/p>\n      <div class=\"bg-book__cal-wrap\">\n        <div class=\"bg-book__cal\">\n          <div class=\"bg-book__cal-head\">\n            <button class=\"bg-book__cal-btn\" id=\"bgCalPrev\">\u2039<\/button>\n            <div class=\"bg-book__cal-month\" id=\"bgCalMonth\"><\/div>\n            <button class=\"bg-book__cal-btn\" id=\"bgCalNext\">\u203a<\/button>\n          <\/div>\n          <div class=\"bg-book__cal-grid\" id=\"bgCalGrid\"><\/div>\n        <\/div>\n        <div>\n          <div class=\"bg-book__slots-title\">Available Time Slots<\/div>\n          <div class=\"bg-book__slots\" id=\"bgSlots\">\n            <div class=\"bg-book__slot-empty\">Select a date first<\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n      <div class=\"bg-book__nav\">\n        <button class=\"bg-book__btn bg-book__btn--secondary\" data-back=\"1\">\u2190 Back<\/button>\n        <button class=\"bg-book__btn bg-book__btn--primary\" id=\"bgNext2\" disabled>Continue \u2192<\/button>\n      <\/div>\n    <\/div>\n\n    <!-- ====== STEP 3: DETAILS ====== -->\n    <div class=\"bg-book__panel\" data-panel=\"3\">\n      <h2 class=\"bg-book__panel-title\">Your Details<\/h2>\n      <p class=\"bg-book__panel-sub\">We'll send your confirmation by SMS and email.<\/p>\n      <div class=\"bg-book__form-grid\">\n        <div class=\"bg-book__field\">\n          <label class=\"bg-book__label\">Full Name <span>*<\/span><\/label>\n          <input class=\"bg-book__input\" type=\"text\" id=\"bgName\" placeholder=\"John Smith\" \/>\n        <\/div>\n        <div class=\"bg-book__field\">\n          <label class=\"bg-book__label\">Phone Number <span>*<\/span><\/label>\n          <input class=\"bg-book__input\" type=\"tel\" id=\"bgPhone\" placeholder=\"(613) 555-0123\" \/>\n        <\/div>\n        <div class=\"bg-book__field bg-book__field--full\">\n          <label class=\"bg-book__label\">Email Address <span>*<\/span><\/label>\n          <input class=\"bg-book__input\" type=\"email\" id=\"bgEmail\" placeholder=\"john@example.com\" \/>\n        <\/div>\n        <div class=\"bg-book__field bg-book__field--full\">\n          <label class=\"bg-book__label\">Service Address <span>*<\/span><\/label>\n          <input class=\"bg-book__input\" type=\"text\" id=\"bgAddress\" placeholder=\"123 Main St\" \/>\n        <\/div>\n        <div class=\"bg-book__field\">\n          <label class=\"bg-book__label\">City <span>*<\/span><\/label>\n          <input class=\"bg-book__input\" type=\"text\" id=\"bgCity\" placeholder=\"Ottawa\" \/>\n        <\/div>\n        <div class=\"bg-book__field\">\n          <label class=\"bg-book__label\">Postal Code <span>*<\/span><\/label>\n          <input class=\"bg-book__input\" type=\"text\" id=\"bgPostal\" placeholder=\"K1A 0A1\" \/>\n        <\/div>\n        <div class=\"bg-book__field bg-book__field--full\">\n          <label class=\"bg-book__label\">Additional Notes (Optional)<\/label>\n          <textarea class=\"bg-book__textarea\" id=\"bgNotes\" placeholder=\"Pets, parking, access notes, etc.\"><\/textarea>\n        <\/div>\n      <\/div>\n      <div class=\"bg-book__nav\">\n        <button class=\"bg-book__btn bg-book__btn--secondary\" data-back=\"2\">\u2190 Back<\/button>\n        <button class=\"bg-book__btn bg-book__btn--primary\" id=\"bgNext3\">Review Booking \u2192<\/button>\n      <\/div>\n    <\/div>\n\n    <!-- ====== STEP 4: CONFIRM ====== -->\n    <div class=\"bg-book__panel\" data-panel=\"4\">\n      <h2 class=\"bg-book__panel-title\">Review &amp; Confirm<\/h2>\n      <p class=\"bg-book__panel-sub\">Check everything below, then confirm your booking.<\/p>\n      <div class=\"bg-book__error\" id=\"bgError\"><\/div>\n      <div class=\"bg-book__summary\" id=\"bgSummary\"><\/div>\n      <div style=\"font-size:13px;color:#6B7B97;line-height:1.5;\">\n        By confirming, your booking is submitted as <strong>Pending<\/strong>. One of our team members will reach out within the next 15 minutes to confirm your appointment details. No payment is taken online.\n      <\/div>\n      <div class=\"bg-book__nav\">\n        <button class=\"bg-book__btn bg-book__btn--secondary\" data-back=\"3\">\u2190 Back<\/button>\n        <button class=\"bg-book__btn bg-book__btn--success\" id=\"bgConfirm\">Confirm Booking \u2192<\/button>\n      <\/div>\n    <\/div>\n\n    <!-- ====== SUCCESS ====== -->\n    <div class=\"bg-book__panel\" data-panel=\"5\">\n      <div class=\"bg-book__success\">\n        <div class=\"bg-book__success-icon\">\u2713<\/div>\n        <h2 class=\"bg-book__success-title\">Thank You!<\/h2>\n        <p class=\"bg-book__success-sub\">Your booking request has been received. One of our team members will reach out within the next <strong style=\"color:#0B1E3F;\">15 minutes<\/strong> to confirm your appointment details.<br><br>A copy of your request has also been sent to your phone and email.<\/p>\n        <div class=\"bg-book__success-ref\">\n          <small>Booking Reference<\/small>\n          <strong id=\"bgRefNum\">BG-000000<\/strong>\n        <\/div>\n        <div>\n          <a href=\"tel:18444988364\" class=\"bg-book__btn bg-book__btn--primary\" style=\"text-decoration:none;display:inline-block;\">Call Us: 1-844-498-8364<\/a>\n        <\/div>\n      <\/div>\n    <\/div>\n\n  <\/div>\n<\/div>\n\n<script>\nvar BG_BOOKING = { ajax_url: \"https:\/\/blueguard.ca\/wp-admin\/admin-ajax.php\" };\n<\/script>\n<script>\n(function(){\n  const root = document.querySelector('.bg-book');\n\n  \/\/ ---- BUILD DYNAMIC SERVICE STATE FROM DOM ----\n  const state = {\n    services: {}, \/\/ keyed by svc id\n    date:'', time:'',\n    name:'', phone:'', email:'', address:'', city:'', postal:'', notes:'',\n    step:1\n  };\n\n  root.querySelectorAll('.bg-book__svc').forEach(el=>{\n    const id   = el.dataset.svcId;\n    const name = el.dataset.svcName;\n    const type = el.dataset.svcType;\n    const svc  = { id:id, name:name, type:type, on:false, _el:el };\n\n    if (type === 'quantity') {\n      const q = el.querySelector('.bg-book__qty');\n      svc.key   = q ? q.dataset.qtyKey : 'qty';\n      svc.value = q ? parseInt(q.querySelector('.bg-book__qty-val').value) || 1 : 1;\n    } else if (type === 'floors') {\n      const fl = el.querySelector('.bg-book__floors');\n      svc.key      = fl ? fl.dataset.floorsKey : 'floors';\n      svc.floors   = [];\n    } else if (type === 'text') {\n      const ti = el.querySelector('.bg-book__text-input');\n      svc.key  = ti ? ti.dataset.textKey : 'note';\n      svc.text = '';\n    }\n\n    state.services[id] = svc;\n  });\n\n  \/\/ ---- STEP NAV ----\n  function goToStep(s){\n    state.step=s;\n    root.querySelectorAll('.bg-book__panel').forEach(p=>p.classList.remove('bg-book__panel--active'));\n    root.querySelector('[data-panel=\"'+s+'\"]').classList.add('bg-book__panel--active');\n    root.querySelectorAll('.bg-book__step').forEach(el=>{\n      const n=+el.dataset.step; el.classList.remove('bg-book__step--active','bg-book__step--done');\n      if(n<s) el.classList.add('bg-book__step--done'); else if(n===s) el.classList.add('bg-book__step--active');\n    });\n    \n  }\n  root.querySelectorAll('[data-back]').forEach(b=>b.addEventListener('click',()=>goToStep(+b.dataset.back)));\n\n  \/\/ ---- SERVICE TOGGLE ----\n  root.querySelectorAll('.bg-book__svc').forEach(svcEl=>{\n    const id = svcEl.dataset.svcId;\n    svcEl.querySelector('.bg-book__svc-head').addEventListener('click',(e)=>{\n      if(e.target.closest('.bg-book__qty')||e.target.closest('.bg-book__floors')||e.target.closest('.bg-book__text-input')) return;\n      state.services[id].on=!state.services[id].on;\n      svcEl.classList.toggle('is-active',state.services[id].on);\n      refreshCart();\n    });\n  });\n\n  \/\/ ---- QUANTITY STEPPERS ----\n  root.querySelectorAll('.bg-book__qty').forEach(q=>{\n    const svcEl = q.closest('.bg-book__svc');\n    const id    = svcEl.dataset.svcId;\n    const input = q.querySelector('.bg-book__qty-val');\n    const min   = parseInt(q.dataset.qtyMin) || 1;\n    const max   = parseInt(q.dataset.qtyMax) || 99;\n    q.querySelectorAll('.bg-book__qty-btn').forEach(btn=>{\n      btn.addEventListener('click',(e)=>{\n        e.stopPropagation();\n        let v=parseInt(input.value);\n        v += btn.dataset.act==='plus'?1:-1;\n        if(v<min) v=min; if(v>max) v=max;\n        input.value=v;\n        state.services[id].value = v;\n        refreshCart();\n      });\n    });\n  });\n\n  \/\/ ---- FLOOR CHECKBOXES ----\n  root.querySelectorAll('.bg-book__floors').forEach(fl=>{\n    const svcEl = fl.closest('.bg-book__svc');\n    const id    = svcEl.dataset.svcId;\n    fl.querySelectorAll('.bg-book__floor').forEach(f=>{\n      f.addEventListener('click',(e)=>{\n        e.stopPropagation();\n        f.classList.toggle('is-on');\n        const floors=[...fl.querySelectorAll('.bg-book__floor.is-on')].map(x=>x.dataset.floor);\n        state.services[id].floors = floors;\n        refreshCart();\n      });\n    });\n  });\n\n  \/\/ ---- TEXT INPUTS ----\n  root.querySelectorAll('.bg-book__text-input').forEach(ti=>{\n    const svcEl = ti.closest('.bg-book__svc');\n    const id    = svcEl.dataset.svcId;\n    ti.addEventListener('input',(e)=>{\n      state.services[id].text = e.target.value;\n      refreshCart();\n    });\n    ti.addEventListener('click', e => e.stopPropagation());\n  });\n\n  \/\/ ---- LIVE CART ----\n  function refreshCart(){\n    let rows=''; let any=false;\n    Object.values(state.services).forEach(s=>{\n      if(!s.on) return;\n      any = true;\n      let detail = 'Included';\n      if (s.type === 'quantity') {\n        const unit = s.key === 'vents' ? 'vents' : (s.key === 'fans' ? (s.value>1?'fans':'fan') : s.key);\n        detail = s.value + ' ' + unit;\n      } else if (s.type === 'floors') {\n        detail = s.floors.length ? s.floors.join(', ') : 'Select floors';\n      } else if (s.type === 'text') {\n        detail = s.text ? s.text : 'Enter details';\n      }\n      rows += cartRow(s.name, detail);\n    });\n    document.getElementById('bgCartBody').innerHTML = any?rows:'<div class=\"bg-book__cart-empty\">No services selected yet<\/div>';\n    document.getElementById('bgNext1').disabled = !any;\n  }\n  function cartRow(name,detail){return '<div class=\"bg-book__cart-row\"><span>'+name+'<\/span><strong>'+detail+'<\/strong><\/div>';}\n\n  document.getElementById('bgNext1').addEventListener('click',()=>goToStep(2));\n\n  \/\/ ---- CALENDAR ----\n  const calGrid=document.getElementById('bgCalGrid'), calMonth=document.getElementById('bgCalMonth');\n  const months=['January','February','March','April','May','June','July','August','September','October','November','December'];\n  const dows=['Sun','Mon','Tue','Wed','Thu','Fri','Sat'];\n  let viewDate=new Date(); viewDate.setDate(1);\n\n  \/\/ MOCK availability \u2014 replace with real backend data\n  function isAvailable(d){\n    const today=new Date(); today.setHours(0,0,0,0);\n    if(d<today) return false;\n    const dow=d.getDay();\n    if(dow===0) return false;               \/\/ Sundays closed\n    if(dow===6 && d.getDate()%2!==0) return false; \/\/ some Saturdays\n    return true;\n  }\n  \/\/ Fixed 2-hour windows\n  function slotsFor(d){\n    return ['8:00 AM \u2013 10:00 AM','10:00 AM \u2013 12:00 PM','12:00 PM \u2013 2:00 PM','2:00 PM \u2013 4:00 PM','4:00 PM \u2013 6:00 PM'];\n  }\n\n  function renderCalendar(){\n    calGrid.innerHTML='';\n    dows.forEach(d=>{const e=document.createElement('div');e.className='bg-book__cal-dow';e.textContent=d;calGrid.appendChild(e);});\n    const y=viewDate.getFullYear(), m=viewDate.getMonth();\n    calMonth.textContent=months[m]+' '+y;\n    const first=new Date(y,m,1).getDay(), days=new Date(y,m+1,0).getDate();\n    for(let i=0;i<first;i++){const e=document.createElement('div');e.className='bg-book__cal-day is-empty';calGrid.appendChild(e);}\n    for(let dn=1;dn<=days;dn++){\n      const dd=new Date(y,m,dn); const e=document.createElement('div');\n      e.className='bg-book__cal-day'; e.textContent=dn;\n      if(!isAvailable(dd)){e.classList.add('is-disabled');}\n      else{\n        e.classList.add('is-available');\n        e.addEventListener('click',()=>{\n          calGrid.querySelectorAll('.bg-book__cal-day').forEach(x=>x.classList.remove('is-selected'));\n          e.classList.add('is-selected');\n          state.date=months[m]+' '+dn+', '+y; state.time='';\n          renderSlots(dd);\n          document.getElementById('bgNext2').disabled=true;\n        });\n      }\n      calGrid.appendChild(e);\n    }\n  }\n  function renderSlots(d){\n    const slots=slotsFor(d); const wrap=document.getElementById('bgSlots');\n    if(!slots.length){wrap.innerHTML='<div class=\"bg-book__slot-empty\">No times available<\/div>';return;}\n    wrap.innerHTML='<div class=\"bg-book__slot-empty\">Checking availability...<\/div>';\n\n    \/\/ Ask backend which slots are already full for this date\n    const fd=new FormData();\n    fd.append('action','bg_get_slots');\n    fd.append('date',state.date);\n\n    fetch(BG_BOOKING.ajax_url,{method:'POST',body:fd})\n      .then(r=>r.json())\n      .then(res=>{\n        const full=(res.success && res.data && res.data.full)?res.data.full:[];\n        buildSlots(slots, full, wrap);\n      })\n      .catch(()=>{\n        \/\/ If check fails, show all slots anyway\n        buildSlots(slots, [], wrap);\n      });\n  }\n\n  function buildSlots(slots, full, wrap){\n    const crossSvg='<span class=\"bg-book__slot-cross\"><svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><line x1=\"5\" y1=\"5\" x2=\"19\" y2=\"19\" stroke-linecap=\"round\"\/><line x1=\"19\" y1=\"5\" x2=\"5\" y2=\"19\" stroke-linecap=\"round\"\/><\/svg><\/span>';\n    wrap.innerHTML=slots.map(s=>{\n      const isFull=full.indexOf(s)!==-1;\n      if(isFull){\n        return '<div class=\"bg-book__slot is-full\" data-time=\"'+s+'\">'+crossSvg+'<span class=\"bg-book__slot-time\">'+s+'<\/span><span class=\"bg-book__slot-tag\">Booked<\/span><\/div>';\n      }\n      return '<div class=\"bg-book__slot\" data-time=\"'+s+'\"><span class=\"bg-book__slot-time\">'+s+'<\/span><\/div>';\n    }).join('');\n    wrap.querySelectorAll('.bg-book__slot').forEach(sl=>{\n      if(sl.classList.contains('is-full')) return;\n      sl.addEventListener('click',()=>{\n        wrap.querySelectorAll('.bg-book__slot').forEach(x=>x.classList.remove('is-on'));\n        sl.classList.add('is-on'); state.time=sl.dataset.time;\n        document.getElementById('bgNext2').disabled=false;\n      });\n    });\n   var slotsTitle = document.querySelector('.bg-book__slots-title');\n    if (slotsTitle) {\n      slotsTitle.classList.add('is-active');\n      wrap.classList.add('bg-book__slots-wrap-highlight');\n      setTimeout(function(){\n        slotsTitle.classList.remove('is-active');\n        wrap.classList.remove('bg-book__slots-wrap-highlight');\n      }, 2600);\n\n      \/\/ Mobile only: auto-scroll to the slots section\n      if (window.innerWidth <= 820) {\n        setTimeout(function(){\n          slotsTitle.scrollIntoView({ behavior: 'smooth', block: 'start' });\n      }, 200);\n    }\n  }\n}\n  \n  document.getElementById('bgCalPrev').addEventListener('click',()=>{viewDate.setMonth(viewDate.getMonth()-1);renderCalendar();});\n  document.getElementById('bgCalNext').addEventListener('click',()=>{viewDate.setMonth(viewDate.getMonth()+1);renderCalendar();});\n  renderCalendar();\n  document.getElementById('bgNext2').addEventListener('click',()=>goToStep(3));\n\n  \/\/ ---- DETAILS ----\n  document.getElementById('bgNext3').addEventListener('click',()=>{\n    state.name=val('bgName'); state.phone=val('bgPhone'); state.email=val('bgEmail');\n    state.address=val('bgAddress'); state.city=val('bgCity'); state.postal=val('bgPostal'); state.notes=val('bgNotes');\n    const err=document.getElementById('bgError');\n    if(!state.name||!state.phone||!state.email||!state.address||!state.city||!state.postal){\n      err.textContent='Please complete all required fields.'; err.classList.add('is-shown'); goToStep(4); renderSummary(); return;\n    }\n    if(!\/^[^@]+@[^@]+\\.[^@]+$\/.test(state.email)){err.textContent='Please enter a valid email.'; err.classList.add('is-shown'); goToStep(4); renderSummary(); return;}\n    if(state.phone.replace(\/\\D\/g,'').length<10){err.textContent='Please enter a valid phone number.'; err.classList.add('is-shown'); goToStep(4); renderSummary(); return;}\n    err.classList.remove('is-shown'); renderSummary(); goToStep(4);\n  });\n  function val(id){return document.getElementById(id).value.trim();}\n\n  function renderSummary(){\n    let svc=[];\n    Object.values(state.services).forEach(s=>{\n      if(!s.on) return;\n      let line = s.name;\n      if (s.type === 'quantity') {\n        const unit = s.key === 'vents' ? 'vents' : (s.key === 'fans' ? (s.value>1?'fans':'fan') : s.key);\n        line += ' (' + s.value + ' ' + unit + ')';\n      } else if (s.type === 'floors' && s.floors.length) {\n        line += ' (' + s.floors.join(', ') + ')';\n      } else if (s.type === 'text' && s.text) {\n        line += ' (' + s.text + ')';\n      }\n      svc.push(line);\n    });\n  \n    const html=\n      row('Services', svc.join('<br>')||'\u2014')+\n      row('Date', state.date)+\n      row('Time', state.time)+\n      row('Name', state.name)+\n      row('Phone', state.phone)+\n      row('Email', state.email)+\n      row('Address', state.address+', '+state.city+', '+state.postal)+\n      (state.notes?row('Notes', state.notes):'');\n    document.getElementById('bgSummary').innerHTML=html;\n  }\n  function row(k,v){return '<div class=\"bg-book__summary-row\"><span class=\"bg-book__summary-key\">'+k+'<\/span><span class=\"bg-book__summary-val\">'+v+'<\/span><\/div>';}\n\n  \/\/ ---- CONFIRM (sends to WordPress backend) ----\n  document.getElementById('bgConfirm').addEventListener('click',function(){\n    const btn=this;\n    btn.disabled=true; btn.textContent='Submitting...';\n    const svcPayload={};\n    Object.values(state.services).forEach(s=>{\n      if(!s.on) return;\n      if (s.type === 'quantity') {\n        const obj = {};\n        obj[s.key] = s.value;\n        svcPayload[s.name] = obj;\n      } else if (s.type === 'floors') {\n        svcPayload[s.name] = { floors: s.floors };\n      } else if (s.type === 'text') {\n        const obj = {};\n        obj[s.key] = s.text;\n        svcPayload[s.name] = obj;\n      } else {\n        svcPayload[s.name] = true;\n      }\n    });\n    const fd=new FormData();\n    fd.append('action','bg_create_booking');\n    fd.append('name',state.name);\n    fd.append('phone',state.phone);\n    fd.append('email',state.email);\n    fd.append('address',state.address);\n    fd.append('city',state.city);\n    fd.append('postal',state.postal);\n    fd.append('date',state.date);\n    fd.append('time',state.time);\n    fd.append('notes',state.notes);\n    fd.append('services',JSON.stringify(svcPayload));\n    fetch(BG_BOOKING.ajax_url,{method:'POST',body:fd})\n      .then(r=>r.json())\n      .then(res=>{\n        if(res.success){\n          document.getElementById('bgRefNum').textContent=res.data.ref;\n          goToStep(5);\n          root.querySelector('.bg-book__progress').style.display='none';\n        }else{\n          const err=document.getElementById('bgError');\n          err.textContent=(res.data&&res.data.message)?res.data.message:'Something went wrong. Please try again.';\n          err.classList.add('is-shown');\n          btn.disabled=false; btn.textContent='Confirm Booking \u2192';\n        }\n      })\n      .catch(()=>{\n        const err=document.getElementById('bgError');\n        err.textContent='Network error. Please try again.';\n        err.classList.add('is-shown');\n        btn.disabled=false; btn.textContent='Confirm Booking \u2192';\n      });\n  });\n\n})();\n<\/script>\n    <\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Build Your Cleaning Package Pick exactly the services you need, choose an available date, and we&#8217;ll confirm within 1 hour. NADCA-certified technicians.<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-21629","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/blueguard.ca\/fr\/wp-json\/wp\/v2\/pages\/21629","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blueguard.ca\/fr\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/blueguard.ca\/fr\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/blueguard.ca\/fr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/blueguard.ca\/fr\/wp-json\/wp\/v2\/comments?post=21629"}],"version-history":[{"count":5,"href":"https:\/\/blueguard.ca\/fr\/wp-json\/wp\/v2\/pages\/21629\/revisions"}],"predecessor-version":[{"id":21879,"href":"https:\/\/blueguard.ca\/fr\/wp-json\/wp\/v2\/pages\/21629\/revisions\/21879"}],"wp:attachment":[{"href":"https:\/\/blueguard.ca\/fr\/wp-json\/wp\/v2\/media?parent=21629"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}