/* Approved elegant service selection; scoped to customer booking. */
body.booking-mode .wrap{max-width:520px;margin:auto;background:#101213}
body.booking-mode .top{position:absolute!important;inset-block-start:0;inset-inline-start:0;z-index:5;width:100%;max-width:520px;padding:18px 20px;background:linear-gradient(#080a0ab3,transparent)}
body.booking-mode .customer-logo{width:157.25px;max-width:54%}
body.booking-mode .top-tools{margin-top:9px}
body.booking-mode #customer{max-width:520px;margin:0;min-height:100svh;padding-top:clamp(250px,62vw,310px);background:linear-gradient(180deg,#0001 0%,#0001 160px,#101213 350px),var(--studio-hero-image, none) center -25px / 100% auto no-repeat}
body.booking-mode .wizard-top{top:100px;inset-inline:20px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;z-index:3}
body.booking-mode .wizard-top #wizardBack{display:grid;place-items:center;width:44px;height:44px;min-height:44px;border-radius:50%;border:1px solid #ffffff35;background:#171b1ce0;color:#edcf96;font-size:34px;line-height:1;padding:0;flex:0 0 44px}
body.booking-mode .wizard-top #wizardCount{font-size:12px;color:#ede7d8;padding:6px 10px;background:#111516a6;border-radius:20px}
body.booking-mode .progress-track{display:block;flex:0 0 100%;height:4px;background:#ffffff25;border-radius:4px;margin-top:2px}
body.booking-mode #wizardProgress{height:100%;background:linear-gradient(90deg,#eacb91,#d2ac6c);border-radius:4px}
body.booking-mode #customer .card{background:linear-gradient(135deg,#222527,#121617);border:1px solid #44484a;border-radius:26px 26px 0 0;padding:25px 20px 32px;min-height:calc(100svh - 270px)}
body.booking-mode #customer #bookTitle{font-size:clamp(27px,7vw,36px);line-height:1.15;font-weight:750;letter-spacing:-.03em;margin:0 0 8px;color:#f6f2e9}
body.booking-mode #bookSub{display:none}
body.booking-mode #customer .selection-hint{font-size:15px;color:#b9bbc0;font-weight:400;line-height:1.5;margin:0 0 24px}
body.booking-mode #customer .services{gap:10px}
body.booking-mode #customer .service{display:flex;align-items:center;gap:13px;min-height:82px;background:linear-gradient(110deg,#23282b,#181d20);border:1px solid #3c4247;border-radius:16px;padding:16px 48px 16px 14px;position:relative;box-sizing:border-box}
body.booking-mode #customer .service.active{border:1px solid #e7c58a;background:linear-gradient(110deg,#302d27,#24231f);padding:16px 48px 16px 14px}
body.booking-mode #customer .service:hover{border-color:#bd9d66;background:#292d2e}
body.booking-mode #customer .service:after{content:'';position:absolute;inset-inline-end:13px;top:50%;transform:translateY(-50%);width:23px;height:23px;border:1.5px solid #858990;border-radius:50%;box-sizing:border-box}
body.booking-mode #customer .service.active:after{content:'✓';display:grid;place-items:center;background:linear-gradient(110deg,#f4d69f,#d6ae70);color:#151713;border:0;font-size:15px;font-weight:700;width:24px;height:24px;inset-inline-end:13px;top:50%;transform:translateY(-50%)}
body.booking-mode #customer .service>.service-icon{flex:0 0 32px;width:32px;height:38px;color:#b9b9b6}
body.booking-mode #customer .service.active>.service-icon{color:#e4be80}
body.booking-mode #customer .service>span{flex:1;min-width:0;overflow-wrap:anywhere}
body.booking-mode #customer .service b{font-size:17px;line-height:1.35;font-weight:650;color:#f1f0e8}
body.booking-mode #customer .service> b{flex:0 0 auto;white-space:nowrap;font-size:18px}
body.booking-mode #customer .service.active> b{color:#eaca92}
body.booking-mode #customer .service small{font-size:14px;color:#afb4b7;line-height:1.4}
body.booking-mode .service-selection-footer{position:sticky;bottom:0;z-index:4;margin:24px -20px -32px;padding:20px 20px max(22px,env(safe-area-inset-bottom));background:linear-gradient(140deg,#242829,#121617);border-top:1px solid #484c4c;border-radius:24px 24px 0 0;box-shadow:0 -12px 25px #0002}
body.booking-mode #customer #serviceSummary{display:flex;justify-content:space-between;align-items:center;gap:16px;background:none;border:0;border-radius:0;padding:0;margin:0 0 17px;line-height:1.5}
body.booking-mode .service-selection-copy{min-width:0;display:grid;gap:5px}
body.booking-mode .service-selection-copy strong{font-size:17px;font-weight:650;color:#f3f0e9}
body.booking-mode .service-selection-copy span{font-size:13px;color:#b6b9b7;overflow-wrap:anywhere}
body.booking-mode #customer .service-selection-total{font-size:30px;font-weight:700;letter-spacing:-.03em;color:#ebc789;white-space:nowrap}
body.booking-mode #customer #serviceStage .wizard-next{margin:0;min-height:54px;border-radius:28px;background:linear-gradient(110deg,#fae1b0,#d4aa6a);color:#141511;font-size:15px;font-weight:650;border:1px solid #ecd2a6;display:flex;align-items:center;justify-content:center;gap:12px;padding:13px 16px}
body.booking-mode #customer #serviceStage .wizard-next:after{content:'→';font-size:24px;line-height:1;font-weight:400}
body.booking-mode #customer #serviceStage .wizard-next:disabled{opacity:.55;cursor:default}
body.booking-mode .service-selection-note{text-align:center;color:#a2a6a5;font-size:12px;line-height:1.5;margin:12px 0 0}
body.booking-mode .wizard-feedback{background:#101213;padding:12px 20px;color:#efcda0}
body.booking-mode #customer :focus-visible{outline:2px solid #f3d39a;outline-offset:4px}
[dir=rtl] body.booking-mode #customer .service{padding:16px 14px 16px 48px}
[dir=rtl] body.booking-mode #customer .service.active{padding:16px 14px 16px 48px}
[dir=rtl] body.booking-mode #customer #serviceStage .wizard-next:after{content:'←'}
@media(max-width:360px){body.booking-mode .top{padding-inline:16px}body.booking-mode .customer-logo{width:144.5px}body.booking-mode .wizard-top{inset-inline:16px}body.booking-mode #customer .card{padding-inline:16px}body.booking-mode #customer .service{gap:9px;padding-inline-start:12px}body.booking-mode #customer .service>.service-icon{width:27px;flex-basis:27px}body.booking-mode #customer .service b{font-size:15px}body.booking-mode #customer .service> b{font-size:16px}body.booking-mode .service-selection-footer{margin-inline:-16px;padding-inline:16px}body.booking-mode #customer #serviceStage .wizard-next{font-size:14px;padding-inline:10px}body.booking-mode #customer .service-selection-total{font-size:26px}}
