/* Prodex reservation flow — self-contained design system for the booking page.
   Deliberately independent of the legacy .booking-* rules in prodex-hub.css so
   the two can evolve separately. */

.rsv{
    --rsv-bg:#021d17;
    --rsv-surface:rgba(6,34,26,.72);
    --rsv-surface-soft:rgba(3,24,19,.55);
    --rsv-line:rgba(120,190,165,.16);
    --rsv-line-strong:rgba(120,190,165,.32);
    --rsv-accent:#19d69b;
    --rsv-accent-deep:#0aa47f;
    --rsv-accent-soft:rgba(25,214,155,.12);
    --rsv-ink:#f2faf7;
    --rsv-ink-2:#aecbc1;
    --rsv-ink-3:#7f9d93;
    --rsv-danger:#ff8f8f;
    --rsv-radius:20px;

    min-height:100vh;
    padding:64px 0 120px;
    background:
        radial-gradient(circle at 88% 8%,rgba(18,63,112,.22),transparent 38%),
        radial-gradient(circle at 6% 92%,rgba(25,214,155,.09),transparent 42%),
        var(--rsv-bg);
    color:var(--rsv-ink);
    direction:rtl;
}
.rsv-shell{max-width:1240px;margin:0 auto}

/* Every interactive element gets a visible keyboard ring. */
.rsv :is(button,input,select,a):focus-visible{
    outline:2px solid var(--rsv-accent);
    outline-offset:2px;
    border-radius:10px;
}

/* ---------- payment alert ---------- */
.rsv-alert{
    display:flex;gap:16px;align-items:flex-start;
    margin-bottom:24px;padding:20px 22px;
    border:1px solid;border-radius:18px;
}
.rsv-alert > i{flex:0 0 auto;font-size:26px;margin-top:2px}
.rsv-alert strong,.rsv-alert span,.rsv-alert small{display:block}
.rsv-alert strong{font-size:16px;margin-bottom:6px}
.rsv-alert span{font-size:13.5px;line-height:2}
.rsv-alert small{margin-top:10px;font-size:12.5px;opacity:.85}
.rsv-alert.is-success{color:#d9fff0;border-color:#22c78f;background:rgba(12,142,99,.2)}
.rsv-alert.is-failed{color:#ffe1e1;border-color:#d96767;background:rgba(158,36,36,.2)}

/* ---------- empty ---------- */
.rsv-empty{
    display:flex;flex-direction:column;align-items:center;gap:10px;
    padding:64px 28px;border:1px solid var(--rsv-line);border-radius:var(--rsv-radius);
    background:var(--rsv-surface);text-align:center;
}
.rsv-empty i{font-size:34px;color:var(--rsv-ink-3)}
.rsv-empty strong{font-size:17px}
.rsv-empty span{color:var(--rsv-ink-2);font-size:13.5px}

/* ---------- step rail ---------- */
.rsv-rail{
    display:grid;grid-template-columns:repeat(4,1fr);gap:10px;
    margin:0 0 22px;padding:0;list-style:none;counter-reset:none;
}
.rsv-rail li{display:flex}
.rsv-rail button{
    display:flex;align-items:center;gap:11px;width:100%;
    padding:15px 16px;
    border:1px solid var(--rsv-line);border-radius:16px;
    background:var(--rsv-surface-soft);
    color:var(--rsv-ink-3);font-size:13.5px;font-weight:600;
    text-align:right;cursor:default;transition:.22s ease;
}
.rsv-rail button b{
    display:grid;place-items:center;flex:0 0 30px;width:30px;height:30px;
    border:1px solid var(--rsv-line-strong);border-radius:50%;
    font-size:13px;transition:.22s ease;
}
.rsv-rail button.is-done{cursor:pointer;color:var(--rsv-ink-2)}
.rsv-rail button.is-done:hover{border-color:var(--rsv-line-strong);background:var(--rsv-accent-soft)}
.rsv-rail button.is-done b{border-color:var(--rsv-accent);background:var(--rsv-accent-soft);color:var(--rsv-accent)}
.rsv-rail button.is-active{
    color:var(--rsv-ink);
    border-color:rgba(25,214,155,.42);
    background:linear-gradient(135deg,rgba(25,214,155,.14),rgba(18,63,112,.16));
}
.rsv-rail button.is-active b{border-color:var(--rsv-accent);background:var(--rsv-accent);color:#042118}

/* ---------- layout ---------- */
.rsv-layout{display:grid;grid-template-columns:minmax(0,1fr) 356px;gap:20px;align-items:start}
.rsv-main{display:flex;flex-direction:column;gap:20px;min-width:0}

.rsv-card{
    padding:28px;
    border:1px solid var(--rsv-line);border-radius:var(--rsv-radius);
    background:var(--rsv-surface);
    animation:rsvFade .3s ease;
}
@keyframes rsvFade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.rsv-card{animation:none}.rsv *{transition:none!important}}

.rsv-card-head{margin-bottom:22px}
.rsv-card-head h2{margin:0 0 8px;color:var(--rsv-ink);font-size:23px;font-weight:800;line-height:1.6}
.rsv-card-head p{margin:0;color:var(--rsv-ink-2);font-size:14px;line-height:2}

/* ---------- space cards ---------- */
.rsv-spaces{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.rsv-space{
    position:relative;isolation:isolate;overflow:hidden;
    display:flex;align-items:flex-end;
    min-height:210px;padding:20px;
    border:1px solid rgba(255,255,255,.08);border-radius:18px;
    color:var(--rsv-ink);text-align:right;cursor:pointer;transition:.22s ease;
}
.rsv-space::before{
    content:"";position:absolute;inset:0;z-index:-2;
    background-image:var(--space-img);background-size:cover;background-position:center;
    transition:transform .45s ease;
}
.rsv-space::after{
    content:"";position:absolute;inset:0;z-index:-1;
    background:linear-gradient(0deg,rgba(2,20,16,.96) 18%,rgba(2,20,16,.62) 58%,rgba(2,20,16,.24));
    transition:.22s ease;
}
.rsv-space:hover{transform:translateY(-3px);border-color:rgba(25,214,155,.38)}
.rsv-space:hover::before{transform:scale(1.05)}
.rsv-space.is-active{border-color:var(--rsv-accent);box-shadow:0 18px 42px rgba(25,214,155,.18)}
.rsv-space.is-active::after{background:linear-gradient(0deg,rgba(3,32,25,.96) 18%,rgba(10,120,92,.42) 78%,rgba(25,214,155,.22))}
.rsv-space.is-wide{grid-column:1/-1;min-height:180px}

.rsv-space-body{display:flex;flex-direction:column;gap:6px;width:100%}
.rsv-space-tag{
    align-self:flex-start;
    padding:5px 11px;margin-bottom:4px;
    border-radius:999px;background:rgba(2,20,16,.6);
    border:1px solid var(--rsv-line-strong);
    color:#8fe6c6;font-size:11.5px;font-weight:700;
}
.rsv-space strong{font-size:18px;font-weight:800}
.rsv-space em{color:#cfe6dd;font-size:12.5px;font-style:normal;line-height:1.85}
.rsv-space-price{
    display:flex;align-items:baseline;gap:6px;
    margin-top:10px;padding-top:12px;
    border-top:1px solid rgba(255,255,255,.14);
    color:#63e3b7;font-size:13px;font-weight:700;
}
.rsv-space-price b{font-size:19px;font-weight:900}
.rsv-space-price small{color:var(--rsv-ink-3);font-size:12px;font-weight:600}
.rsv-space-check{
    position:absolute;top:16px;left:16px;z-index:1;
    display:grid;place-items:center;width:26px;height:26px;
    border:1.5px solid rgba(255,255,255,.45);border-radius:50%;
    background:rgba(2,20,16,.45);color:transparent;font-size:12px;transition:.2s;
}
.rsv-space.is-active .rsv-space-check{background:var(--rsv-accent);border-color:var(--rsv-accent);color:#042118}

/* ---------- option row (seats / guests / duration) ---------- */
.rsv-option{
    display:flex;align-items:center;justify-content:space-between;gap:20px;
    margin-top:18px;padding:18px 20px;
    border:1px solid rgba(25,214,155,.26);border-radius:16px;
    background:rgba(5,42,32,.42);
}
.rsv-option-copy{display:flex;flex-direction:column;gap:5px;min-width:0}
.rsv-option-copy strong{font-size:15px}
.rsv-option-copy span{color:var(--rsv-ink-2);font-size:12.5px;line-height:1.8}
.rsv-option-copy span b{color:var(--rsv-ink)}

.rsv-stepper{
    display:flex;align-items:center;flex:0 0 auto;overflow:hidden;
    border:1px solid var(--rsv-line-strong);border-radius:14px;background:rgba(2,18,15,.6);
}
.rsv-stepper button{
    width:46px;height:48px;border:0;background:transparent;
    color:#63e3b7;font-size:22px;line-height:1;cursor:pointer;transition:.18s;
}
.rsv-stepper button:hover{background:var(--rsv-accent-soft)}
.rsv-stepper :is(input,strong){
    min-width:56px;height:48px;padding:0;
    display:grid;place-items:center;
    border:0;border-inline:1px solid var(--rsv-line);
    background:transparent;color:var(--rsv-ink);
    font-size:16px;font-weight:800;text-align:center;outline:0;
}
.rsv-stepper input::-webkit-inner-spin-button,
.rsv-stepper input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.rsv-stepper input{-moz-appearance:textfield}

/* ---------- calendar ---------- */
.rsv-calendar-head{
    display:flex;align-items:center;justify-content:space-between;gap:16px;
    flex-wrap:wrap;margin-bottom:14px;
}
.rsv-month-nav{display:flex;align-items:center;gap:10px}
.rsv-month-nav strong{min-width:132px;text-align:center;font-size:16px;font-weight:800}
.rsv-month-nav button{
    display:grid;place-items:center;width:40px;height:40px;
    border:1px solid var(--rsv-line-strong);border-radius:12px;
    background:transparent;color:var(--rsv-ink-2);font-size:13px;cursor:pointer;transition:.2s;
}
.rsv-month-nav button:hover:not(:disabled){border-color:var(--rsv-accent);color:var(--rsv-accent)}
.rsv-month-nav button:disabled{opacity:.32;cursor:not-allowed}

.rsv-quick-picks{display:flex;gap:8px;flex-wrap:wrap}
.rsv-quick-picks button{
    min-height:38px;padding:0 14px;
    border:1px solid var(--rsv-line);border-radius:999px;
    background:rgba(2,18,15,.45);color:var(--rsv-ink-2);
    font-size:12.5px;font-weight:600;cursor:pointer;transition:.2s;
}
.rsv-quick-picks button:hover{border-color:var(--rsv-accent);color:var(--rsv-accent)}

.rsv-calendar{
    padding:18px;border:1px solid var(--rsv-line);border-radius:18px;
    background:rgba(1,15,12,.5);transition:opacity .2s;
}
.rsv-calendar[aria-busy="true"]{opacity:.45;pointer-events:none}
.rsv-weekdays,.rsv-days{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;text-align:center}
.rsv-weekdays{margin-bottom:10px}
.rsv-weekdays span{padding:6px 0;color:var(--rsv-ink-3);font-size:13px;font-weight:700}
.rsv-days button{
    position:relative;
    min-height:52px;border:1px solid transparent;border-radius:13px;
    background:rgba(255,255,255,.02);color:#d6e8e2;
    font-size:15px;font-weight:600;cursor:pointer;transition:.16s;
}
.rsv-days button.is-free::after{
    content:"";position:absolute;bottom:7px;left:50%;transform:translateX(-50%);
    width:4px;height:4px;border-radius:50%;background:var(--rsv-accent);
}
.rsv-days button.is-free:hover{border-color:var(--rsv-accent);background:var(--rsv-accent-soft)}
.rsv-days button.is-today{border-color:var(--rsv-line-strong)}
.rsv-days button.is-picked{
    background:linear-gradient(135deg,var(--rsv-accent),var(--rsv-accent-deep));
    border-color:transparent;color:#032219;font-weight:900;
    box-shadow:0 10px 24px rgba(25,214,155,.26);
}
.rsv-days button.is-picked::after{background:#032219}
.rsv-days button:disabled{color:#3c564f;background:transparent;cursor:not-allowed}
.rsv-days button.is-blank{visibility:hidden}

.rsv-legend{display:flex;flex-wrap:wrap;gap:18px;margin-top:14px;color:var(--rsv-ink-3);font-size:12.5px}
.rsv-legend span{display:flex;align-items:center;gap:7px}
.rsv-legend i{width:8px;height:8px;border-radius:50%}
.rsv-legend .dot-free{background:var(--rsv-accent)}
.rsv-legend .dot-picked{background:linear-gradient(135deg,var(--rsv-accent),var(--rsv-accent-deep))}
.rsv-legend .dot-off{background:#3c564f}

/* ---------- meeting hours ---------- */
.rsv-hours{
    margin-top:18px;padding:20px;
    border:1px solid rgba(25,214,155,.26);border-radius:16px;background:rgba(5,42,32,.42);
}
.rsv-hours-head{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.rsv-hours-head strong{font-size:15px}
.rsv-hours-head span{color:#63e3b7;font-size:12.5px;font-weight:600}
.rsv-hours-note{margin:10px 0 16px;color:var(--rsv-ink-2);font-size:12.5px}
.rsv-hours-note i{color:var(--rsv-accent);margin-left:6px}
.rsv-hours-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}

/* ---------- fields ---------- */
.rsv-field label{display:block;margin-bottom:9px;color:var(--rsv-ink-2);font-size:13px;font-weight:700}
.rsv-field :is(input,select){
    width:100%;height:52px;padding:0 14px;
    border:1px solid var(--rsv-line-strong);border-radius:13px;
    background:rgba(2,18,15,.6);color:var(--rsv-ink);
    font-size:15px;font-family:inherit;outline:0;transition:.18s;
}
.rsv-field select{
    appearance:none;cursor:pointer;
    background-image:linear-gradient(45deg,transparent 50%,#63e3b7 50%),linear-gradient(135deg,#63e3b7 50%,transparent 50%);
    background-position:calc(100% - 20px) 23px,calc(100% - 14px) 23px;
    background-size:6px 6px,6px 6px;background-repeat:no-repeat;
}
.rsv-field select option{background:#04241c;color:var(--rsv-ink)}
.rsv-field :is(input,select):focus{border-color:var(--rsv-accent);background:rgba(2,18,15,.85)}
.rsv-field input::placeholder{color:#5d7a71}

.rsv-mobile-row{display:flex;gap:12px;align-items:stretch}
.rsv-mobile-input{
    display:flex;align-items:center;flex:1;min-width:0;overflow:hidden;
    height:52px;border:1px solid var(--rsv-line-strong);border-radius:13px;
    background:rgba(2,18,15,.6);direction:ltr;transition:.18s;
}
.rsv-mobile-input:focus-within{border-color:var(--rsv-accent)}
.rsv-mobile-input > span{
    padding:0 15px;align-self:stretch;display:grid;place-items:center;
    border-right:1px solid var(--rsv-line);color:#63e3b7;font-size:14px;font-weight:700;
}
.rsv-mobile-input input{
    width:100%;height:100%;padding:0 14px;border:0;outline:0;
    background:transparent;color:var(--rsv-ink);
    font-size:16px;letter-spacing:1px;text-align:left;direction:ltr;
}
.rsv-mobile-row > button{
    flex:0 0 auto;min-height:52px;padding:0 22px;border:0;border-radius:13px;
    background:linear-gradient(135deg,var(--rsv-accent),var(--rsv-accent-deep));
    color:#032119;font-size:14px;font-weight:800;cursor:pointer;white-space:nowrap;transition:.18s;
}
.rsv-mobile-row > button:hover{filter:brightness(1.06)}
.rsv-mobile-row > button:disabled{opacity:.5;cursor:not-allowed}

.rsv-message{min-height:24px;margin:14px 0 0;color:#f3cf8b;font-size:13px;line-height:1.9}
.rsv-message.is-ok{color:#7fe4bd}

/* ---------- OTP ---------- */
.rsv-otp{margin-top:22px}
.rsv-otp > label{display:block;margin-bottom:12px;color:var(--rsv-ink-2);font-size:13px;font-weight:700}
.rsv-otp-inputs{display:flex;gap:12px;direction:ltr}
.rsv-otp-inputs input{
    width:60px;height:64px;
    border:1px solid var(--rsv-line-strong);border-radius:14px;
    background:rgba(2,18,15,.6);color:var(--rsv-ink);
    font-size:24px;font-weight:800;text-align:center;outline:0;transition:.18s;
}
.rsv-otp-inputs input:focus{border-color:var(--rsv-accent);box-shadow:0 0 0 3px var(--rsv-accent-soft)}
.rsv-otp-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px}
.rsv-otp-meta span{color:var(--rsv-ink-3);font-size:12.5px}
.rsv-otp-meta button{border:0;background:none;color:#63e3b7;font-size:12.5px;font-weight:700;cursor:pointer}
.rsv-otp-meta button:disabled{color:#4d6660;cursor:not-allowed}

.rsv-names{margin-top:24px;padding-top:22px;border-top:1px solid var(--rsv-line)}
.rsv-names-title{margin:0 0 14px;color:var(--rsv-ink-2);font-size:13.5px}
.rsv-names-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}

/* ---------- actions ---------- */
.rsv-actions{display:flex;gap:12px;margin-top:28px;padding-top:24px;border-top:1px solid var(--rsv-line)}
.rsv-next{
    display:flex;align-items:center;justify-content:center;gap:10px;
    flex:1;min-height:56px;border:0;border-radius:15px;
    background:linear-gradient(135deg,var(--rsv-accent),var(--rsv-accent-deep));
    color:#032119;font-size:15px;font-weight:800;cursor:pointer;
    box-shadow:0 14px 30px rgba(25,214,155,.2);transition:.18s;
}
.rsv-next:hover:not(:disabled){filter:brightness(1.06);transform:translateY(-1px)}
.rsv-next:disabled{opacity:.4;filter:grayscale(.45);cursor:not-allowed;box-shadow:none;transform:none}
.rsv-back{
    flex:0 0 auto;min-height:56px;padding:0 24px;
    border:1px solid var(--rsv-line-strong);border-radius:15px;
    background:transparent;color:var(--rsv-ink-2);
    font-size:14px;font-weight:700;cursor:pointer;transition:.18s;
}
.rsv-back:hover{border-color:var(--rsv-accent);color:var(--rsv-accent)}

.is-loading{pointer-events:none;opacity:.8}
.is-loading::before{
    content:"";display:inline-block;width:16px;height:16px;
    margin-left:9px;vertical-align:-3px;
    border:2px solid currentColor;border-left-color:transparent;border-radius:50%;
    animation:rsvSpin .65s linear infinite;
}
@keyframes rsvSpin{to{transform:rotate(360deg)}}

/* ---------- summary ---------- */
.rsv-summary{position:sticky;top:24px;align-self:start}
.rsv-summary-inner{
    padding:26px;
    border:1px solid var(--rsv-line);border-radius:var(--rsv-radius);
    background:linear-gradient(165deg,rgba(18,63,112,.3),rgba(4,28,21,.88));
}
.rsv-summary-label{display:block;margin-bottom:20px;color:#63e3b7;font-size:13px;font-weight:800}
.rsv-summary-space{
    display:flex;align-items:center;gap:14px;
    padding:16px;margin-bottom:20px;
    border:1px solid rgba(25,214,155,.18);border-radius:16px;background:rgba(25,214,155,.06);
}
.rsv-summary-thumb{
    position:relative;flex:0 0 52px;width:52px;height:52px;overflow:hidden;
    border-radius:14px;background:var(--rsv-accent-soft);
}
.rsv-summary-thumb::before{
    content:"";position:absolute;inset:0;
    background-image:var(--space-img);background-size:cover;background-position:center;
}
.rsv-summary-space div{display:flex;flex-direction:column;gap:5px;min-width:0}
.rsv-summary-space small{color:var(--rsv-ink-3);font-size:12px}
.rsv-summary-space strong{font-size:16px}

.rsv-summary-lines{margin:0 0 20px}
.rsv-summary-lines div{
    display:flex;align-items:center;justify-content:space-between;gap:14px;
    padding:14px 0;border-bottom:1px solid rgba(120,190,165,.12);
}
.rsv-summary-lines dt{color:var(--rsv-ink-3);font-size:13px;font-weight:500}
.rsv-summary-lines dd{margin:0;color:var(--rsv-ink);font-size:13.5px;font-weight:700;text-align:left}

.rsv-summary-total{
    display:flex;align-items:flex-end;justify-content:space-between;gap:12px;
    padding:18px;margin-bottom:20px;border-radius:16px;
    background:linear-gradient(135deg,rgba(25,214,155,.14),rgba(18,63,112,.24));
}
.rsv-summary-total span{color:var(--rsv-ink-2);font-size:13px}
.rsv-summary-total strong{color:var(--rsv-ink);font-size:13px;font-weight:600;white-space:nowrap}
.rsv-summary-total b{font-size:26px;font-weight:900;letter-spacing:-.5px}

.rsv-trust{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:11px}
.rsv-trust li{display:flex;align-items:flex-start;gap:9px;color:var(--rsv-ink-3);font-size:12.5px;line-height:1.85}
.rsv-trust i{flex:0 0 auto;margin-top:3px;color:#63e3b7;font-size:12px}

/* ---------- invoice ---------- */
.rsv-invoice{display:flex;flex-direction:column;gap:18px}
.rsv-invoice-head{
    display:flex;align-items:center;justify-content:space-between;gap:14px;
    padding-bottom:16px;border-bottom:1px solid var(--rsv-line);
}
.rsv-invoice-head strong{font-size:17px}
.rsv-invoice-head span{color:#63e3b7;font:12px/1 Arial,sans-serif;letter-spacing:1.5px}
.rsv-invoice-lines{margin:0}
.rsv-invoice-lines div{
    display:flex;align-items:center;justify-content:space-between;gap:16px;
    padding:13px 0;border-bottom:1px solid rgba(255,255,255,.06);
}
.rsv-invoice-lines dt{color:var(--rsv-ink-3);font-size:13px;font-weight:500}
.rsv-invoice-lines dd{margin:0;color:var(--rsv-ink);font-size:13.5px;font-weight:700;text-align:left}
.rsv-discount label{display:block;margin-bottom:9px;color:var(--rsv-ink-2);font-size:13px;font-weight:700}
.rsv-discount input{
    width:100%;height:52px;padding:0 14px;
    border:1px solid var(--rsv-line-strong);border-radius:13px;
    background:rgba(2,18,15,.6);color:var(--rsv-ink);font-size:15px;outline:0;
}
.rsv-discount input:focus{border-color:var(--rsv-accent)}
.rsv-invoice-total{
    display:flex;align-items:flex-end;justify-content:space-between;gap:14px;
    padding:18px;border-radius:16px;
    background:linear-gradient(135deg,rgba(25,214,155,.14),rgba(18,63,112,.24));
}
.rsv-invoice-total span{color:var(--rsv-ink-2);font-size:13.5px}
.rsv-invoice-total strong{font-size:22px;font-weight:900}
.rsv-pay{
    display:flex;align-items:center;justify-content:center;gap:11px;
    width:100%;min-height:58px;border:0;border-radius:15px;
    background:linear-gradient(135deg,var(--rsv-accent),var(--rsv-accent-deep));
    color:#032119;font-size:15px;font-weight:800;cursor:pointer;
    box-shadow:0 14px 30px rgba(25,214,155,.2);transition:.18s;
}
.rsv-pay:hover:not(:disabled){filter:brightness(1.06)}
.rsv-invoice-note{margin:0;color:var(--rsv-ink-3);font-size:12px;text-align:center;line-height:1.9}

/* ---------- mobile sticky bar ---------- */
.rsv-bar{display:none}

/* ---------- responsive ---------- */
@media(max-width:1100px){
    .rsv-layout{grid-template-columns:minmax(0,1fr)}
    .rsv-summary{position:static}
    .rsv-summary-inner{padding:22px}
}
@media(max-width:820px){
    .rsv{padding:34px 0 104px}
    .rsv-rail{grid-template-columns:repeat(4,1fr);gap:6px}
    .rsv-rail button{flex-direction:column;gap:7px;padding:12px 6px;text-align:center;font-size:11px}
    .rsv-rail button b{flex-basis:auto}
    .rsv-card{padding:20px 16px}
    .rsv-card-head h2{font-size:19px}
    .rsv-card-head p{font-size:13px}
    .rsv-spaces{grid-template-columns:1fr}
    .rsv-space,.rsv-space.is-wide{min-height:180px}
    .rsv-option{flex-direction:column;align-items:stretch;gap:14px}
    .rsv-stepper{align-self:stretch;justify-content:space-between}
    .rsv-stepper :is(input,strong){flex:1}
    .rsv-calendar{padding:12px}
    .rsv-weekdays,.rsv-days{gap:5px}
    .rsv-days button{min-height:46px;font-size:14px;border-radius:11px}
    .rsv-calendar-head{gap:12px}
    .rsv-month-nav{width:100%;justify-content:space-between}
    .rsv-hours-fields,.rsv-names-fields{grid-template-columns:1fr}
    .rsv-mobile-row{flex-direction:column}
    .rsv-otp-inputs{gap:9px}
    .rsv-otp-inputs input{flex:1;width:auto;height:58px;font-size:21px}
    .rsv-actions{flex-direction:column-reverse}
    .rsv-back{width:100%}

    /* The summary sits far below the fold on phones, so surface price + next action. */
    .rsv-bar{
        position:fixed;inset:auto 0 0 0;z-index:60;
        display:flex;align-items:center;justify-content:space-between;gap:14px;
        padding:12px 16px calc(12px + env(safe-area-inset-bottom));
        border-top:1px solid var(--rsv-line-strong);
        background:rgba(3,24,19,.96);
        backdrop-filter:blur(14px);
        box-shadow:0 -12px 34px rgba(0,0,0,.42);
        direction:rtl;
    }
    .rsv-bar-price{display:flex;flex-direction:column;gap:3px;min-width:0}
    .rsv-bar-price small{color:var(--rsv-ink-3);font-size:11.5px}
    .rsv-bar-price strong{color:var(--rsv-ink);font-size:12px;font-weight:600;white-space:nowrap}
    .rsv-bar-price b{font-size:19px;font-weight:900}
    .rsv-bar-action{
        flex:0 0 auto;min-height:48px;padding:0 26px;border:0;border-radius:14px;
        background:linear-gradient(135deg,var(--rsv-accent),var(--rsv-accent-deep));
        color:#032119;font-size:14px;font-weight:800;cursor:pointer;
    }
    .rsv-bar-action:disabled{opacity:.45;filter:grayscale(.4)}
}
@media(max-width:420px){
    .rsv-rail button span{font-size:10px;line-height:1.4}
    .rsv-days button{min-height:42px;font-size:13px}
    .rsv-quick-picks{width:100%}
    .rsv-quick-picks button{flex:1}
}
