{"id":62,"date":"2026-04-30T00:17:54","date_gmt":"2026-04-30T00:17:54","guid":{"rendered":"http:\/\/detmersphotos.com\/?page_id=62"},"modified":"2026-04-30T00:17:54","modified_gmt":"2026-04-30T00:17:54","slug":"book-a-session","status":"publish","type":"page","link":"http:\/\/detmersphotos.com\/?page_id=62","title":{"rendered":"Book a Session"},"content":{"rendered":"        <div id=\"foto-booking-app\" class=\"foto-booking-app\">\n            <!-- Step indicator -->\n            <div class=\"foto-booking-steps\">\n                <div class=\"foto-step active\" data-step=\"1\"><span class=\"step-num\">1<\/span><span class=\"step-label\">Choose Package<\/span><\/div>\n                <div class=\"foto-step-divider\"><\/div>\n                <div class=\"foto-step\" data-step=\"2\"><span class=\"step-num\">2<\/span><span class=\"step-label\">Pick Date &amp; Time<\/span><\/div>\n                <div class=\"foto-step-divider\"><\/div>\n                <div class=\"foto-step\" data-step=\"3\"><span class=\"step-num\">3<\/span><span class=\"step-label\">Your Details<\/span><\/div>\n                <div class=\"foto-step-divider\"><\/div>\n                <div class=\"foto-step\" data-step=\"4\"><span class=\"step-num\">4<\/span><span class=\"step-label\">Confirm<\/span><\/div>\n            <\/div>\n\n            <!-- Step 1: Package Selection -->\n            <div class=\"foto-booking-step-content\" id=\"step-1\">\n                <h2 class=\"foto-booking-heading\">Choose Your Session<\/h2>\n                <p class=\"foto-booking-sub\">Select the package that fits your needs. Not sure? Pick the closest and mention it in your notes.<\/p>\n                <div id=\"foto-packages-grid\" class=\"foto-packages-grid\">\n                    <div class=\"foto-loading\">Loading packages\u2026<\/div>\n                <\/div>\n                <div class=\"foto-booking-nav\">\n                    <span><\/span>\n                    <button class=\"foto-btn-next\" id=\"step1-next\" disabled>Next: Choose Date \u2192<\/button>\n                <\/div>\n            <\/div>\n\n            <!-- Step 2: Calendar -->\n            <div class=\"foto-booking-step-content\" id=\"step-2\" style=\"display:none;\">\n                <h2 class=\"foto-booking-heading\">Pick a Date &amp; Time<\/h2>\n                <p class=\"foto-booking-sub\">Select an available date then choose your preferred time slot.<\/p>\n\n                <div class=\"foto-calendar-wrap\">\n                    <!-- Calendar header -->\n                    <div class=\"foto-cal-header\">\n                        <button id=\"cal-prev\" class=\"foto-cal-nav\">&#8592;<\/button>\n                        <span id=\"cal-month-label\" class=\"foto-cal-month\"><\/span>\n                        <button id=\"cal-next\" class=\"foto-cal-nav\">&#8594;<\/button>\n                    <\/div>\n                    <!-- Day labels -->\n                    <div class=\"foto-cal-grid foto-cal-days-header\">\n                                                <div class=\"foto-cal-day-label\">Sun<\/div>\n                                                <div class=\"foto-cal-day-label\">Mon<\/div>\n                                                <div class=\"foto-cal-day-label\">Tue<\/div>\n                                                <div class=\"foto-cal-day-label\">Wed<\/div>\n                                                <div class=\"foto-cal-day-label\">Thu<\/div>\n                                                <div class=\"foto-cal-day-label\">Fri<\/div>\n                                                <div class=\"foto-cal-day-label\">Sat<\/div>\n                                            <\/div>\n                    <!-- Calendar days -->\n                    <div class=\"foto-cal-grid\" id=\"foto-cal-days\"><\/div>\n\n                    <!-- Legend -->\n                    <div class=\"foto-cal-legend\">\n                        <span><span class=\"leg-dot leg-available\"><\/span> Available<\/span>\n                        <span><span class=\"leg-dot leg-booked\"><\/span> Booked<\/span>\n                        <span><span class=\"leg-dot leg-blocked\"><\/span> Unavailable<\/span>\n                        <span><span class=\"leg-dot leg-selected\"><\/span> Selected<\/span>\n                    <\/div>\n                <\/div>\n\n                <!-- Time slots -->\n                <div id=\"foto-time-wrap\" style=\"display:none;\">\n                    <h3 class=\"foto-time-heading\">Available Times for <span id=\"foto-selected-date-label\"><\/span><\/h3>\n                    <div id=\"foto-time-slots\" class=\"foto-time-grid\"><\/div>\n                <\/div>\n\n                <div class=\"foto-booking-nav\">\n                    <button class=\"foto-btn-back\" id=\"step2-back\">\u2190 Back<\/button>\n                    <button class=\"foto-btn-next\" id=\"step2-next\" disabled>Next: Your Details \u2192<\/button>\n                <\/div>\n            <\/div>\n\n            <!-- Step 3: Client Info -->\n            <div class=\"foto-booking-step-content\" id=\"step-3\" style=\"display:none;\">\n                <h2 class=\"foto-booking-heading\">Your Details<\/h2>\n\n                <div class=\"foto-booking-form\">\n                    <div class=\"foto-form-row\">\n                        <div class=\"foto-form-group\">\n                            <label>First Name *<\/label>\n                            <input type=\"text\" id=\"b-first\" placeholder=\"Jane\" autocomplete=\"given-name\">\n                        <\/div>\n                        <div class=\"foto-form-group\">\n                            <label>Last Name *<\/label>\n                            <input type=\"text\" id=\"b-last\" placeholder=\"Smith\" autocomplete=\"family-name\">\n                        <\/div>\n                    <\/div>\n                    <div class=\"foto-form-row\">\n                        <div class=\"foto-form-group\">\n                            <label>Email Address *<\/label>\n                            <input type=\"email\" id=\"b-email\" placeholder=\"jane@example.com\" autocomplete=\"email\">\n                        <\/div>\n                        <div class=\"foto-form-group\">\n                            <label>Phone Number<\/label>\n                            <input type=\"tel\" id=\"b-phone\" placeholder=\"+1 (555) 000-0000\" autocomplete=\"tel\">\n                        <\/div>\n                    <\/div>\n\n                    <div class=\"foto-form-group\">\n                        <label>Preferred Location &amp; Notes<\/label>\n                        <textarea id=\"b-location\" rows=\"3\" placeholder=\"Where would you like the session? A specific park, your home, our studio, outdoors\u2026 any preferences or ideas you have are helpful!\"><\/textarea>\n                    <\/div>\n\n                    <div class=\"foto-form-group\">\n                        <label>Anything else you'd like me to know?<\/label>\n                        <textarea id=\"b-message\" rows=\"3\" placeholder=\"Number of people, any special requests, vision for the session\u2026\"><\/textarea>\n                    <\/div>\n\n                                        <div class=\"foto-account-option\">\n                        <label class=\"foto-checkbox-label\">\n                            <input type=\"checkbox\" id=\"b-create-account\">\n                            <span>Create an account to track your booking status<\/span>\n                        <\/label>\n                        <div id=\"foto-password-wrap\" style=\"display:none;\" class=\"foto-form-group\" style=\"margin-top:0.75rem;\">\n                            <label>Choose a Password<\/label>\n                            <input type=\"password\" id=\"b-password\" placeholder=\"Minimum 8 characters\" autocomplete=\"new-password\">\n                        <\/div>\n                    <\/div>\n                                    <\/div>\n\n                <div class=\"foto-booking-nav\">\n                    <button class=\"foto-btn-back\" id=\"step3-back\">\u2190 Back<\/button>\n                    <button class=\"foto-btn-next\" id=\"step3-next\">Review Booking \u2192<\/button>\n                <\/div>\n            <\/div>\n\n            <!-- Step 4: Review & Confirm -->\n            <div class=\"foto-booking-step-content\" id=\"step-4\" style=\"display:none;\">\n                <h2 class=\"foto-booking-heading\">Review Your Booking<\/h2>\n                <div id=\"foto-booking-summary\" class=\"foto-booking-summary\"><\/div>\n                <p class=\"foto-booking-disclaimer\">\n                    By submitting, you're requesting this time slot. I'll review your request and email you within 48 hours to confirm the details of your session.\n                <\/p>\n                <div id=\"foto-booking-error\" class=\"foto-booking-error\" style=\"display:none;\"><\/div>\n                <div class=\"foto-booking-nav\">\n                    <button class=\"foto-btn-back\" id=\"step4-back\">\u2190 Back<\/button>\n                    <button class=\"foto-btn-primary\" id=\"step4-submit\">Send Booking Request<\/button>\n                <\/div>\n            <\/div>\n\n            <!-- Success State -->\n            <div class=\"foto-booking-step-content\" id=\"step-success\" style=\"display:none;\">\n                <div class=\"foto-booking-success\">\n                    <div class=\"foto-success-icon\">\u2713<\/div>\n                    <h2>Request Sent!<\/h2>\n                    <p id=\"foto-success-msg\"><\/p>\n                    <p class=\"foto-success-sub\">Check your email for a confirmation. I typically respond within 48 hours.<\/p>\n                <\/div>\n            <\/div>\n        <\/div>\n        \n","protected":false},"excerpt":{"rendered":"","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":2,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-62","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"http:\/\/detmersphotos.com\/index.php?rest_route=\/wp\/v2\/pages\/62","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/detmersphotos.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"http:\/\/detmersphotos.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"http:\/\/detmersphotos.com\/index.php?rest_route=\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"http:\/\/detmersphotos.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=62"}],"version-history":[{"count":0,"href":"http:\/\/detmersphotos.com\/index.php?rest_route=\/wp\/v2\/pages\/62\/revisions"}],"wp:attachment":[{"href":"http:\/\/detmersphotos.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=62"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}