/* The real checkout inside the approved checkout screen (spec 2026-10-15-dinners-own-checkout-p0 §11): Stripe's own
   elements take the places of the drawn card form and the Apple-Pay-style button; nothing else in the layout moves. */
.card-wrap>.card-form.pe-host{display:block;padding:2px}
.card-wrap:not(.open)>.card-form.pe-host{visibility:hidden}
.pay-status{min-height:20px;margin:8px 0 0;text-align:center;font:500 13.5px var(--f);color:var(--lilac-ink)}
.pay-status:empty{min-height:0;margin:0}
.actions .ece{min-height:55px;width:100%}
.actions[data-pay=card] .ece{display:none}
.actions[data-pay=wallet] [data-pay-card]{display:none}
.actions.is-busy .primary{opacity:.55;pointer-events:none}
.method[hidden]{display:none}
.lean-card{display:grid;gap:14px}
.lean-card-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.lean-card-field{display:grid;gap:7px;min-width:0;font:500 13px/1.4 var(--f);color:var(--ink-2)}
.stripe-card-field{min-width:0;padding:14px 12px;border:1px solid var(--line);border-radius:12px;background:var(--white)}
.stripe-card-field.StripeElement--focus{border-color:var(--lilac-deep);box-shadow:0 0 0 1px var(--lilac-deep)}
.stripe-card-field.StripeElement--invalid{border-color:#B42318}
.actions [data-pay-card]:disabled{opacity:.5;cursor:default}
.actions[data-pay=card],.actions[data-pay=wallet]{min-height:128px;padding-top:24px}
.actions .co-meta{flex:none;margin:0;padding:0;gap:6px 16px}
.actions [data-pay-card] svg{width:18px;height:18px;flex:none}
@container (max-width:340px){.actions .co-meta{font-size:13px;gap:6px 12px}.actions .co-meta svg{width:16px;height:16px}}
