/* Later booking steps and their account payment continuation. */
#shadi-app #booking-view:not([data-step="0"]) .booking-hero{display:block;min-height:205px;border-radius:25px;background:#f5eddd url('/assets/guide-sanctuary.webp') center/cover no-repeat;margin-bottom:18px}
#shadi-app #booking-view:not([data-step="0"]) .booking-hero .page-title{width:55%;padding:30px}
#shadi-app #booking-view:not([data-step="0"]) .booking-hero h2{font-size:28px}
#shadi-app #booking-view:not([data-step="0"]) .booking-hero .page-title>p{font-size:13px}
#shadi-app #booking-view:not([data-step="0"]) .booking-hero .overline,#shadi-app #booking-view:not([data-step="0"]) .booking-hero-description,#shadi-app #booking-view:not([data-step="0"]) .booking-chair,#shadi-app #booking-view:not([data-step="0"]) .booking-leaves{display:none}
#shadi-app #booking-view:not([data-step="0"]) .booking-shell{background:#f4faf6c9;border:0;border-radius:24px;padding:20px;margin-top:0}
#shadi-app #booking-view:not([data-step="0"]) .booking{background:transparent;border:0;overflow:visible;grid-template-columns:245px minmax(0,1fr)}
#shadi-app #booking-view:not([data-step="0"]) .flow{padding:24px;background:#ffffffef;border-radius:22px}
#shadi-app #booking-view:not([data-step="0"]) #stage h3{font-size:20px;line-height:1.8;margin-bottom:6px}
#shadi-app #booking-view:not([data-step="0"]) #stage>.muted{font-size:12px;line-height:1.9;margin:0 0 18px}
#shadi-app #booking-view .flow-selection{display:grid;grid-template-columns:1fr auto;gap:6px 12px;background:#e6f5ef;border:1px solid #d5eae1;border-radius:15px;padding:14px 17px;margin:0 0 20px;align-items:center;font-size:13px;color:#285f62}
#shadi-app #booking-view .flow-selection>span{grid-column:1;font-size:12px;color:#597779}
#shadi-app #booking-view .flow-selection>b{grid-column:2;grid-row:1/3;font-size:16px;color:#174b53}
#shadi-app #booking-view:not([data-step="0"]) #stage :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),textarea,select){border:1px solid #cfded9;border-radius:12px;background:#fff;min-height:48px;padding:11px 13px;font-size:14px;color:#244f54;max-width:100%;box-shadow:none}
#shadi-app #booking-view:not([data-step="0"]) #stage input[readonly]{background:#f0f4f3;color:#758887}
#shadi-app #booking-view:not([data-step="0"]) #stage label:not(.choice){font-size:13px;font-weight:550;color:#345b61;margin:15px 0 7px}
#shadi-app #booking-view .flow-field-hint{display:block;font-size:10px;line-height:1.8;margin-top:5px;color:#7b8e8d}
#shadi-app #booking-view:not([data-step="0"]) .choice{display:flex;align-items:flex-start;gap:10px;font-size:12px;line-height:1.9;border-radius:12px;padding:10px 12px;border:1px solid #dce8e2;background:#fafdfb;margin:8px 0}
#shadi-app #booking-view:not([data-step="0"]) .choice:has(input:checked){background:#e4f5ef;border-color:#8bc7b6;color:#1a6b66}
#shadi-app #booking-view:not([data-step="0"]) input:is([type="checkbox"],[type="radio"]){accent-color:#008e8c;flex-shrink:0;width:18px;height:18px;margin:3px 0 0}
#shadi-app #booking-view:not([data-step="0"]) .booking-hint{background:#fff5e5;border:1px solid #f4e4c9;color:#856335;border-radius:12px;padding:12px;font-size:12px;line-height:1.9;margin:14px 0}
#shadi-app #booking-view:not([data-step="0"]) .booking-help{border:1px solid #dfebe5;border-radius:12px;padding:8px 12px;margin:12px 0}
#shadi-app #booking-view:not([data-step="0"]) .booking-help>summary{font-size:12px;min-height:36px}
#shadi-app #booking-view:not([data-step="0"]) .discount-box{margin:15px 0;background:#f8fcfa;border:1px solid #e0eae5;border-radius:14px;padding:0 13px 10px}
#shadi-app #booking-view .discount-tools{display:flex;gap:8px;align-items:center}
#shadi-app #booking-view .discount-tools input{min-width:0;flex:1}
#shadi-app #booking-view .discount-tools button{min-height:46px;white-space:nowrap;font-size:12px}
#shadi-app #booking-view .discount-total{font-size:12px;color:#306c65;margin-top:8px}
#shadi-app #booking-view:not([data-step="0"]) #stage .bottom{display:flex;gap:12px;align-items:center;margin-top:18px;flex-wrap:wrap}
#shadi-app #booking-view:not([data-step="0"]) #stage .bottom>button{min-height:48px;margin:0;font-size:13px;flex:1}
#shadi-app #booking-view .intake-steps{list-style:none;display:flex;gap:10px;padding:0;margin:0 0 20px}
#shadi-app #booking-view .intake-steps li{flex:1;text-align:center;display:flex;flex-direction:column;align-items:center;gap:7px;color:#879391;font-size:11px;line-height:1.9}
#shadi-app #booking-view .intake-steps li>span{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#e7ece9;font-size:14px}
#shadi-app #booking-view .intake-steps li.current,#shadi-app #booking-view .intake-steps li.complete{color:#137d79}
#shadi-app #booking-view .intake-steps li.current>span,#shadi-app #booking-view .intake-steps li.complete>span{background:#118d89;color:#fff}
#shadi-app #booking-view .qprogress{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;font-size:12px;background:#edf7f2;border-radius:12px;padding:11px 14px;margin-bottom:13px;color:#39746c}
#shadi-app #booking-view[data-step="3"] #stage>.info{font-size:12px;padding:12px 14px;background:#e9f5ef;border:1px solid #d7e9df;color:#3f6b64;border-radius:12px;line-height:1.9;margin-bottom:14px}
#shadi-app #booking-view[data-step="3"] .alert{padding:11px 14px;border-radius:12px;background:#fff4df;color:#8b682e;font-size:12px;margin-bottom:14px;line-height:1.9}
#shadi-app #booking-view #questions .question{margin:0 0 15px;padding:16px;background:#fbfdfb;border:1px solid #e4ece6;border-radius:15px}
#shadi-app #booking-view #questions fieldset{border:0;padding:0;margin:0;min-width:0}
#shadi-app #booking-view #questions legend{font-size:13px;color:#2c545b;line-height:1.9;font-weight:550;margin-bottom:10px;padding:0;float:none;width:100%}
#shadi-app #booking-view #questions textarea{min-height:108px;resize:vertical;width:100%}
#shadi-app #booking-view #questions :is(input:not([type="radio"]):not([type="checkbox"]),select){width:100%}
#shadi-app #booking-view .flow-upload{position:relative;border:1px dashed #60b4a7;background:#f1faf6;border-radius:16px;padding:16px;margin:14px 0}
#shadi-app #booking-view .flow-upload input{position:absolute;opacity:0;width:1px;height:1px;left:0;bottom:0;padding:0}
#shadi-app #booking-view .flow-upload:focus-within{outline:3px solid #008e8c;outline-offset:3px}
#shadi-app #booking-view .flow-upload label{cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:7px;min-height:100px;margin:0!important;text-align:center}
#shadi-app #booking-view .flow-upload label>span{font-size:32px;line-height:1;color:#148a82}
#shadi-app #booking-view .flow-upload small{font-size:11px;font-weight:400;color:#738a86}
#shadi-app #booking-view .flow-filename{font-size:12px;overflow-wrap:anywhere;margin:5px 0 0;text-align:center}
#shadi-app #booking-view[data-step="4"] .success{background:transparent;border:0;padding:0;text-align:right}
#shadi-app #booking-view[data-step="4"] .success>h2{font-size:23px;background:#fff2d6;color:#8c6327;border-radius:14px;padding:15px;line-height:1.8;margin-bottom:16px}
#shadi-app #booking-view[data-step="4"] .success>.info{background:#eaf6f0;border:1px solid #d8eae0;border-radius:15px;padding:17px;font-size:13px;line-height:2.1}
#shadi-app #booking-view .tracking-summary{border:1px solid #dfebe5;border-radius:15px;background:white;overflow:hidden;margin:16px 0}
#shadi-app #booking-view .tracking-summary>div{display:flex;justify-content:space-between;gap:16px;padding:13px 16px;border-bottom:1px solid #e6ede8;font-size:12px;line-height:1.9}
#shadi-app #booking-view .tracking-summary>div:last-child{border-bottom:0}
#shadi-app #booking-view .tracking-summary :is(dt,dd){margin:0;float:none;width:auto}
#shadi-app #booking-view .tracking-summary dd{color:#4d786d;text-align:left}
/* Account payment preserves the same IDs and submit handlers. */
#patient-preview:not(.auth-mode) .payment-page-title{font-size:24px;font-weight:700;margin:16px 0}
#patient-preview:not(.auth-mode) .account-detail-card{padding:24px;border-radius:22px;margin:16px 0}
#patient-preview:not(.auth-mode) .account-detail-card .appointment-when{font-size:13px;margin-bottom:16px}
#patient-preview:not(.auth-mode) .payment-bank{display:grid;grid-template-columns:1fr auto;gap:10px;background:#e8f6ef;border:1px solid #cee8dc;border-radius:17px;padding:18px;margin:16px 0;color:#245e60}
#patient-preview:not(.auth-mode) .payment-bank>span{grid-column:1/-1;font-size:12px}
#patient-preview:not(.auth-mode) .payment-bank>strong{grid-column:1/-1;font-size:24px;line-height:1.8;letter-spacing:2px;text-align:center;overflow-wrap:anywhere}
#patient-preview:not(.auth-mode) .payment-bank>small{grid-column:1/-1;font-size:12px}
#patient-preview:not(.auth-mode) .payment-bank .copy-card{width:auto;justify-self:start;font-size:12px;margin:0;min-height:44px;padding:8px 14px;border-color:#9ccdc0;color:#147b74}
#patient-preview:not(.auth-mode) .payment-bank .copy-card-status{grid-column:1/-1;margin:0}
#patient-preview:not(.auth-mode) .payment-bank .copy-card-status:empty{display:none}
#patient-preview:not(.auth-mode) .account-detail-card>.timer{padding:11px 15px;border-radius:12px;background:#fff1d5;color:#986624;font-size:13px;line-height:1.9}
#patient-preview:not(.auth-mode) .payment-upload-form .receipt-picker{display:flex;flex-direction:column;text-align:center;gap:10px;min-height:150px;justify-content:center;background:#f3fbf7;border:1px dashed #62b5a3;margin:17px 0 12px;position:relative}
#patient-preview:not(.auth-mode) .payment-upload-icon{font-size:32px;line-height:1;color:#108e82;flex:none}
#patient-preview:not(.auth-mode) .payment-upload-form #receipt-name{font-size:15px;font-weight:600;overflow-wrap:anywhere;flex:none}
#patient-preview:not(.auth-mode) .payment-upload-form .receipt-pick-label{font-size:11px;padding:5px 12px}
#patient-preview:not(.auth-mode) .payment-upload-form .primary{font-size:15px;font-weight:650;min-height:49px;background:#008b8b;margin-top:12px}
#patient-preview:not(.auth-mode) .payment-review-note{background:#fff3df;color:#8c642f;border:1px solid #f2e2c6;border-radius:12px;padding:11px 14px;font-size:12px;line-height:1.9}
#patient-preview:not(.auth-mode) .payment-progress{margin:18px 0}
#patient-preview:not(.auth-mode) .payment-state-note{font-size:13px;line-height:1.9;padding:14px;background:#eef7f0;border-radius:13px;color:#416f64}
#patient-preview:not(.auth-mode) .payment-progress dl{border:1px solid #e0e9e3;border-radius:14px;overflow:hidden;background:#fff;margin:15px 0 0}
#patient-preview:not(.auth-mode) .payment-progress dl>div{display:flex;align-items:center;justify-content:space-between;gap:18px;border-bottom:1px solid #e4ece5;padding:14px 16px;font-size:13px;line-height:1.9}
#patient-preview:not(.auth-mode) .payment-progress dl>div:last-child{border:0}
#patient-preview:not(.auth-mode) .payment-progress :is(dt,dd){margin:0}
#patient-preview:not(.auth-mode) .payment-progress dd{color:#9b732e;text-align:left}
#patient-preview:not(.auth-mode) .payment-progress dd.complete{color:#168367}
@media(max-width:700px){#shadi-app #booking-view:not([data-step="0"]) .booking-hero{min-height:160px;border-radius:20px;margin-bottom:12px}#shadi-app #booking-view:not([data-step="0"]) .booking-hero .page-title{width:58%;padding:18px 13px}#shadi-app #booking-view:not([data-step="0"]) .booking-hero h2{font-size:22px}#shadi-app #booking-view:not([data-step="0"]) .booking-hero .page-title>p{font-size:11px}#shadi-app #booking-view:not([data-step="0"]) .booking-shell{padding:12px 0;background:transparent}#shadi-app #booking-view:not([data-step="0"]) .booking{grid-template-columns:1fr;gap:12px}#shadi-app #booking-view:not([data-step="0"]) .booking aside{display:none}#shadi-app #booking-view:not([data-step="0"]) .flow{padding:17px 14px;border-radius:20px}#shadi-app #booking-view .flow-selection{padding:12px;gap:5px 10px}#shadi-app #booking-view .flow-selection strong{font-size:12px}#shadi-app #booking-view .flow-selection>b{font-size:13px}#shadi-app #booking-view .flow-selection>span{font-size:10px}#shadi-app #booking-view:not([data-step="0"]) #stage h3{font-size:18px}#shadi-app #booking-view:not([data-step="0"]) #stage .bottom>button{font-size:12px;padding:10px}#shadi-app #booking-view #questions .question{padding:13px;margin-bottom:12px}#shadi-app #booking-view #questions legend{font-size:12px}#shadi-app #booking-view .intake-steps{gap:6px}#shadi-app #booking-view .intake-steps li{font-size:10px}#shadi-app #booking-view .intake-steps li>span{width:30px;height:30px;font-size:13px}#shadi-app #booking-view[data-step="4"] .success>h2{font-size:20px}#patient-preview:not(.auth-mode) .payment-page-title{font-size:20px}#patient-preview:not(.auth-mode) .account-detail-card{padding:16px;border-radius:19px}#patient-preview:not(.auth-mode) .payment-bank{padding:14px}#patient-preview:not(.auth-mode) .payment-bank>strong{font-size:20px;letter-spacing:1px}#patient-preview:not(.auth-mode) .payment-upload-form #receipt-name{font-size:14px}#patient-preview:not(.auth-mode) .payment-progress dl>div{font-size:12px;padding:12px}#patient-preview:not(.auth-mode) .payment-review-note{font-size:11px}}
#shadi-app #booking-view:not([data-step="0"]) #details .formgrid{gap:12px}
#shadi-app #booking-view:not([data-step="0"]) #details .formgrid label{margin-top:6px}
#patient-preview:not(.auth-mode)[data-account-view="detail"] #profile-content>.cancel-button{background:#fffaf7;color:#a45840;border-color:#dab6a5;font-size:12px}
/* Compact actions and receipt controls. */
#shadi-app #booking-view #details>.bottom{display:flex;flex-wrap:nowrap;gap:8px}
#shadi-app #booking-view #details>.bottom>.primary{flex:1 1 auto;width:auto;min-width:0;white-space:nowrap;font-size:12px;padding:11px 10px}
#shadi-app #booking-view #details>.bottom>.secondary{flex:0 0 auto;width:auto;min-width:0;white-space:nowrap;font-size:12px;padding:11px 12px}
#patient-preview:not(.auth-mode) .payment-bank-bottom{grid-column:1/-1;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
#patient-preview:not(.auth-mode) .payment-bank-bottom>small{flex:1;min-width:0;overflow-wrap:anywhere;font-size:12px;line-height:1.8}
#patient-preview:not(.auth-mode) .payment-bank-bottom>.copy-card{flex:0 0 auto;white-space:nowrap;margin:0;font-size:11px;padding:8px 10px}
#patient-preview:not(.auth-mode) .payment-bank-bottom>.copy-card-status{flex-basis:100%;margin:0}
#patient-preview:not(.auth-mode) .payment-upload-form .receipt-picker{flex-direction:row;align-items:center;text-align:right;gap:10px;min-height:72px;padding:12px;margin:14px 0 10px}
#patient-preview:not(.auth-mode) .payment-upload-form .payment-upload-icon{font-size:26px;flex:0 0 22px;width:22px}
#patient-preview:not(.auth-mode) .payment-upload-form #receipt-name{flex:1;min-width:0;font-size:13px;line-height:1.7;overflow-wrap:anywhere}
#patient-preview:not(.auth-mode) .payment-upload-form #receipt-name>small{font-size:10px;font-weight:400;margin-top:3px;line-height:1.8}
#patient-preview:not(.auth-mode) .payment-upload-form .receipt-pick-label{flex:0 0 auto;white-space:nowrap;min-height:38px;display:inline-flex;align-items:center;font-size:11px;padding:7px 10px}
#patient-preview:not(.auth-mode) .timer{font-variant-numeric:tabular-nums}
#shadi-app #booking-view .flow-upload{padding:10px 12px}
#shadi-app #booking-view .flow-upload>label{flex-direction:row;min-height:52px;gap:10px;flex-wrap:wrap;justify-content:flex-start}
#shadi-app #booking-view .flow-upload label>span{font-size:25px}
#shadi-app #booking-view .flow-upload label>strong{font-size:13px}
#shadi-app #booking-view .flow-upload label>small{font-size:10px}
@media(max-width:380px){#shadi-app #booking-view #details>.bottom>.primary{font-size:11px;padding-inline:7px}#shadi-app #booking-view #details>.bottom>.secondary{font-size:11px;padding-inline:8px}#patient-preview:not(.auth-mode) .payment-bank-bottom{gap:7px}#patient-preview:not(.auth-mode) .payment-bank-bottom>small{font-size:11px}#patient-preview:not(.auth-mode) .payment-upload-form .receipt-picker{gap:7px;padding:10px}#patient-preview:not(.auth-mode) .payment-upload-form #receipt-name{font-size:12px}#patient-preview:not(.auth-mode) .payment-upload-form .payment-upload-icon{flex-basis:18px;width:18px}#patient-preview:not(.auth-mode) .payment-upload-form .receipt-pick-label{font-size:10px;padding-inline:7px}}
#shadi-app #booking-view:not([data-step="0"]) #stage #details>.bottom{display:flex;flex-direction:row;flex-wrap:nowrap;gap:8px;align-items:stretch}
#shadi-app #booking-view:not([data-step="0"]) #stage #details>.bottom>.primary{flex:1 1 auto;min-width:0;width:auto;margin:0;font-size:12px;padding:10px 8px;white-space:nowrap}
#shadi-app #booking-view:not([data-step="0"]) #stage #details>.bottom>.secondary{flex:0 0 auto;width:auto;min-width:0;margin:0;font-size:12px;padding:10px;white-space:nowrap}
@media(max-width:380px){#shadi-app #booking-view:not([data-step="0"]) #stage #details>.bottom>button{font-size:11px;padding-inline:7px}}
/* Confirmation: required next step first, routine actions together, cancellation separate. */
:is(#shadi-app #booking-view,#patient-preview:not(.auth-mode)) .confirmation-actions{display:grid;gap:10px;margin:18px 0 12px;padding:15px;background:#ffffffeb;border:1px solid #deebe4;border-radius:17px}
:is(#shadi-app #booking-view,#patient-preview:not(.auth-mode)) .confirmation-primary{display:grid;gap:9px}
:is(#shadi-app #booking-view,#patient-preview:not(.auth-mode)) .confirmation-primary:empty{display:none}
:is(#shadi-app #booking-view,#patient-preview:not(.auth-mode)) .confirmation-primary :is(button,a){display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:48px;margin:0;padding:11px 15px;border:1px solid #00898b;border-radius:12px;background:#00898b;color:#fff;font-family:inherit;font-size:14px;font-weight:650;text-decoration:none;box-shadow:none}
:is(#shadi-app #booking-view,#patient-preview:not(.auth-mode)) .confirmation-secondary{display:grid;grid-template-columns:1fr 1fr;gap:9px}
:is(#shadi-app #booking-view,#patient-preview:not(.auth-mode)) .confirmation-secondary :is(button,a){display:flex;align-items:center;justify-content:center;min-height:44px;width:100%;padding:9px 10px;margin:0;border:1px solid #cee2d8;border-radius:11px;background:#f4faf6;color:#296d6a;font-family:inherit;font-size:12px;font-weight:500;text-decoration:none;box-shadow:none;line-height:1.8;text-align:center}
#shadi-app #booking-view .confirmation-actions .confirmation-cancel{border:0;border-top:1px solid #e9eee9;padding:11px 8px 0;margin-top:2px;min-height:44px;color:#aa614b;background:none;font-family:inherit;font-size:12px;box-shadow:none}
#patient-preview:not(.auth-mode)[data-account-view="detail"] #profile-content>.cancel-button{min-height:44px;width:auto;display:block;margin:5px auto 14px;padding:9px 15px;border:0;background:none;color:#a65c48;font-size:12px}
#shadi-app #booking-view .confirmation-tracking{border:1px solid #dfe8e2;border-radius:12px;padding:8px 13px;margin:18px 0;background:#f8fbf8}
#shadi-app #booking-view .confirmation-tracking summary{font-size:11px;color:#71837f;min-height:36px;cursor:pointer}
#shadi-app #booking-view .confirmation-tracking p{font-size:11px;line-height:1.9;margin:9px 0}
#shadi-app #booking-view .confirmation-code-row{display:flex;gap:8px;align-items:center}
#shadi-app #booking-view .confirmation-code-row input{min-width:0;flex:1;font-size:12px}
#shadi-app #booking-view .confirmation-code-row button{flex:0 0 auto;min-height:44px;font-size:11px;white-space:nowrap}
#shadi-app #booking-view .confirmation-account-note{border-radius:12px;background:#eaf6ef;padding:12px;font-size:12px;line-height:1.9;color:#4a766b}
@media(max-width:600px){:is(#shadi-app #booking-view,#patient-preview:not(.auth-mode)) .confirmation-actions{padding:12px;gap:9px;margin-top:14px}:is(#shadi-app #booking-view,#patient-preview:not(.auth-mode)) .confirmation-primary :is(button,a){font-size:13px}:is(#shadi-app #booking-view,#patient-preview:not(.auth-mode)) .confirmation-secondary :is(button,a){font-size:11px;padding:9px 6px}}
