.costa-payments{--pay-text:var(--text,#10252d);--pay-muted:var(--muted,#52656d);--pay-surface:var(--surface,#fff);--pay-line:var(--line,#d5e1e3);display:grid;gap:20px;width:100%;min-width:0;max-width:1100px;margin:0 auto;color:var(--pay-text);font-size:16px;line-height:1.5}.costa-payments *{box-sizing:border-box}.costa-payments h2,.costa-payments h3,.costa-payments p{margin:0 0 10px}.costa-payments h2{font-size:clamp(1.5rem,4vw,2rem)}.costa-payments h3{font-size:1.15rem}.pay-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.pay-heading p,.pay-note{color:var(--pay-muted)}.pay-environment{display:grid;gap:4px;padding:16px;border:1px solid var(--pay-line);border-left:4px solid var(--ocean,#0f766e);border-radius:12px;background:var(--pay-surface)}.pay-environment span{color:var(--pay-muted);font-size:.9375rem}.pay-panel{padding:24px;border:1px solid var(--pay-line);border-radius:18px;background:var(--pay-surface);min-width:0}.pay-tabs{display:flex;gap:8px;overflow-x:auto}.costa-payments button,.costa-payments input:not([type=checkbox]),.costa-payments select{min-height:48px}.costa-payments button{cursor:pointer;font:inherit;padding:10px 16px;border-radius:12px;border:1px solid var(--pay-line);background:var(--pay-surface);color:var(--pay-text);white-space:normal}.costa-payments button.primary,.pay-tabs [aria-current=page]{background:#0f766e;color:#fff;border-color:transparent}.costa-payments button:disabled{opacity:.65;cursor:wait}.costa-payments :is(button,input,textarea,select):focus-visible{outline:3px solid var(--ocean,#0f766e);outline-offset:3px}.pay-tabs button{flex-shrink:0}.pay-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.pay-metrics section{display:grid;gap:8px;padding:20px;background:var(--pay-surface);border:1px solid var(--pay-line);border-radius:16px}.pay-metrics strong{font-size:clamp(1.3rem,3vw,2rem);overflow-wrap:anywhere}.pay-metrics span,.pay-row small{color:var(--pay-muted)}.pay-breakdown{margin:16px 0}.pay-breakdown>div{display:flex;justify-content:space-between;gap:20px;padding:12px 0;border-bottom:1px solid var(--pay-line)}.pay-breakdown dd{margin:0;font-weight:650;white-space:nowrap}.pay-breakdown>div:last-child{border:0}.pay-list{margin:0;padding:0;list-style:none}.costa-payments .pay-row{display:flex;width:100%;justify-content:space-between;gap:16px;text-align:left;border:0;border-bottom:1px solid var(--pay-line);border-radius:0;padding:18px 0}.pay-row>span{display:grid;gap:5px;min-width:0;overflow-wrap:anywhere}.pay-row>span:last-child{text-align:right}.pay-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}.pay-steps{padding-left:24px}.pay-steps li{padding:6px 0}.costa-payments form{display:grid;gap:12px;margin:16px 0}.costa-payments :is(input:not([type=checkbox]),select,textarea){width:100%;padding:12px;border:1px solid var(--pay-line);border-radius:10px;background:var(--pay-surface);color:var(--pay-text);font:inherit}.pay-check{display:flex;gap:12px;align-items:center;min-height:48px}.pay-check input{width:22px;height:22px;flex-shrink:0}.pay-error{border:1px solid var(--danger,#c83535);padding:16px;border-radius:12px;background:var(--pay-surface)}.pay-confirm{margin-top:20px;border-left:4px solid var(--ocean,#0f766e)}.pay-entry{margin:12px 0}.pay-booking-list{display:grid;gap:20px;padding:0;margin:0;list-style:none}.pay-booking-card{padding:24px;min-width:0;background:var(--pay-surface);border:1px solid var(--pay-line);border-radius:18px;overflow-wrap:anywhere}.pay-booking-heading{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 16px;align-items:center;margin-bottom:16px}.pay-booking-status{display:inline-block;font-size:.9375rem;font-weight:650;color:var(--pay-text);padding:6px 12px;border-radius:8px;background:color-mix(in srgb,var(--ocean,#0f766e) 12%,var(--pay-surface))}.costa-payments .pay-booking-date{margin:0;color:var(--pay-muted)}.costa-payments .pay-booking-card h3{font-size:clamp(1.2rem,3vw,1.5rem);line-height:1.25;margin:0 0 8px}.pay-customer-amounts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;padding:20px 0;margin:20px 0;border-block:1px solid var(--pay-line)}.pay-customer-amounts dt{color:var(--pay-muted);font-size:.9375rem}.pay-customer-amounts dd{margin:6px 0 0;font-size:1.2rem;font-weight:650}.pay-card-actions{display:flex;justify-content:flex-end}.pay-booking-detail{max-width:760px;width:100%;margin-inline:auto;display:grid;gap:24px}.pay-booking-detail>button:first-child{justify-self:start}.pay-booking-detail header .pay-booking-status{margin-bottom:14px}.pay-booking-detail .pay-customer-amounts{margin:0}.pay-booking-detail h4{margin:0 0 12px;font-size:1.0625rem}.pay-booking-detail .pay-detail-secondary{display:flex;gap:12px;flex-wrap:wrap;border-top:1px solid var(--pay-line);padding-top:20px}.pay-receipt{border-left:3px solid var(--ocean,#0f766e);padding:4px 0 4px 14px}.pay-payment-plan{color:var(--text,#10252d);text-align:left;min-width:0}.pay-payment-plan dl{margin:0}.pay-payment-plan dd{margin:0;font-variant-numeric:tabular-nums}.pay-plan-total{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:14px 0;border-bottom:1px solid var(--line,#d5e1e3)}.pay-plan-total dd{font-weight:650}.pay-plan-part{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:start;padding:20px 0;border-bottom:1px solid var(--line,#d5e1e3)}.pay-plan-part dt,.pay-plan-part dd{display:grid;gap:6px}.pay-plan-part dd{text-align:right}.pay-plan-label{font-weight:650}.pay-plan-part strong{font-size:clamp(1.25rem,3vw,1.6rem);line-height:1.25}.pay-plan-part small,.pay-payment-plan .pay-plan-note{color:var(--muted,#52656d);font-size:.875rem;line-height:1.5}.pay-plan-now{margin-top:12px;padding:20px 16px;border:1px solid var(--line,#d5e1e3);border-left:4px solid var(--ocean,#0f766e);border-radius:12px;background:color-mix(in srgb,var(--ocean,#0f766e) 7%,var(--surface,#fff))}.pay-plan-now strong{font-size:clamp(1.5rem,4vw,1.9rem)}.pay-payment-plan .pay-plan-note{margin:12px 0 0}.booking-success .pay-payment-plan{margin:20px 0}@media(max-width:480px){.pay-plan-part{grid-template-columns:1fr;gap:10px}.pay-plan-part dd{text-align:left;display:flex;flex-wrap:wrap;align-items:baseline;gap:10px}.pay-plan-total{flex-wrap:wrap;gap:4px 12px}}.pay-test-note{font-size:.9375rem;color:var(--pay-muted)}.pay-conditions summary{min-height:48px;display:flex;align-items:center;cursor:pointer;text-decoration:underline;text-underline-offset:4px}.pay-conditions summary:focus-visible{outline:3px solid var(--ocean,#0f766e);outline-offset:3px}.pay-customer-empty{padding:24px 0;max-width:560px}.pay-loading{min-height:180px;padding-block:32px}@media(max-width:600px){.pay-booking-card{padding:20px 16px}.costa-payments .pay-customer-heading{flex-direction:row;align-items:center}.pay-customer-heading>div{min-width:0}.pay-customer-heading p{display:none}.pay-customer-heading h2{font-size:1.2rem}.pay-customer-amounts{grid-template-columns:1fr;gap:12px;padding:16px 0}.pay-customer-amounts>div{display:flex;align-items:baseline;justify-content:space-between;gap:16px}.pay-customer-amounts dd{font-size:1.0625rem;margin:0;flex-shrink:0}.pay-card-actions button,.pay-checkout button{width:100%}.pay-detail-secondary button{flex:1 1 140px}}.pay-rewards{border-top:3px solid #0f766e}.pay-reward-month{color:var(--pay-muted);text-transform:capitalize;font-size:.9375rem}.pay-reward-recognition{font-weight:650}.pay-rewards progress{display:block;appearance:none;width:100%;height:12px;border:0;border-radius:20px;overflow:hidden;margin:12px 0 20px;background:var(--pay-line);accent-color:#0f766e}.pay-rewards progress::-webkit-progress-bar{background:var(--pay-line)}.pay-rewards progress::-webkit-progress-value{background:#0f766e;border-radius:20px}.pay-rewards progress::-moz-progress-bar{background:#0f766e}.pay-reward-history{margin-top:16px;border-top:1px solid var(--pay-line)}.pay-reward-history summary{min-height:48px;padding:14px 0;cursor:pointer;font-weight:600}.pay-reward-history summary:focus-visible{outline:3px solid #0f766e;outline-offset:3px}.pay-reward-record{display:grid;gap:6px;padding:16px 0;border-top:1px solid var(--pay-line)}@media(max-width:600px){.pay-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible}.pay-tabs button{padding:10px}}@media(max-width:600px){.pay-panel{padding:16px}.pay-heading{flex-direction:column}.pay-metrics{grid-template-columns:1fr;gap:10px}.pay-metrics section{grid-template-columns:1fr auto;align-items:center}.pay-breakdown>div{gap:12px}.pay-actions>button{flex:1 1 140px}.costa-payments .pay-row{flex-direction:column}.pay-row>span:last-child{text-align:left}}