/* Calm, readable checkout with the final amount within reach on phones. */
.mobile-checkout {
  --checkout-paper: #fbfaf7;
  --checkout-ink: #252822;
  --checkout-muted: #62685d;
  --checkout-border: #deded4;
  --checkout-sage: #e6eadf;
  --checkout-primary: #384b3c;
}
.mobile-checkout .checkout-section,
.mobile-checkout .order-summary { border-radius: 16px; }
.mobile-checkout .checkout-choice { min-height: 64px; border-radius: 12px; }
.mobile-checkout .checkout-choice small { color: #62685d; line-height: 1.45; }
.mobile-checkout .checkout-choice b { max-width: 92px; white-space: normal; text-align: right; line-height: 1.35; }
.mobile-checkout .checkout-choice.unavailable { opacity: .68; }
.mobile-checkout .checkout-contact > label:last-child { max-width: none; }
.mobile-checkout .checkout-product-info strong { line-height: 1.45; font-size: 14px; overflow-wrap: anywhere; }
.mobile-checkout .quantity-control { min-width: 130px; border-radius: 999px; }
.mobile-checkout .quantity-control button { min-width: 44px; min-height: 44px; padding: 5px 10px; }
.mobile-checkout .checkout-mobile-overview span { color: var(--checkout-muted); }
.mobile-checkout .checkout-optional summary { min-height: 44px; }
.mobile-checkout .checkout-sticky-action { display: none; }
.mobile-checkout .checkout-calculation-state { font-size: 12px; color: #62685d; margin: 12px 0; }
.mobile-checkout .checkout-calculation-state:empty { display: none; }
.mobile-checkout :is(.checkout-section,.order-summary,.checkout-choice,input,select,textarea) { scroll-margin-bottom: 130px; scroll-margin-top: 24px; }

@media (max-width: 850px) {
  .mobile-checkout header { padding: 18px 16px; gap: 12px; }
  .mobile-checkout header > a:last-child { font-size: 12px; white-space: nowrap; }
  .mobile-checkout main { padding: 22px 14px calc(118px + env(safe-area-inset-bottom, 0px)); }
  .mobile-checkout h1 { font-size: 29px; line-height: 1.2; margin: 12px 0 8px; }
  .mobile-checkout .page-heading > span { display: block; font-size: 13px; line-height: 1.6; max-width: 40ch; }
  .mobile-checkout .page-heading > p { font-size: 9px; letter-spacing: .06em; }
  .mobile-checkout #checkoutForm { gap: 14px; }
  .mobile-checkout .checkout-main { gap: 14px; }
  .mobile-checkout .checkout-mobile-overview { padding: 14px 16px; border-radius: 14px; }
  .mobile-checkout .checkout-mobile-overview strong { font-size: 16px; line-height: 1.4; }
  .mobile-checkout .checkout-section { padding: 18px 16px; }
  .mobile-checkout h4,
  .mobile-checkout legend { font-size: 16px; margin-bottom: 12px; }
  .mobile-checkout .checkout-contact,
  .mobile-checkout .location-grid { grid-template-columns: 1fr; gap: 14px; }
  .mobile-checkout .checkout-contact > label:last-child { grid-column: auto; }
  .mobile-checkout .checkout-choice { gap: 10px; padding: 12px; }
  .mobile-checkout .checkout-choice span { font-size: 13px; }
  .mobile-checkout .checkout-choice small { font-size: 11px; }
  .mobile-checkout .checkout-choice b { font-size: 12px; max-width: 78px; }
  .mobile-checkout .checkout-optional summary { flex-wrap: wrap; gap: 4px 8px; font-size: 14px; }
  .mobile-checkout .checkout-optional summary span { margin-left: 0; font-size: 11px; }
  .mobile-checkout .checkout-optional summary::after { margin-left: auto; }
  .mobile-checkout .age-optional { margin-top: 8px; }
  .mobile-checkout .age-optional summary { font-size: 13px; }
  .mobile-checkout .checkout-summary .checkout-grand { align-items: center; font-size: 16px; }
  .mobile-checkout .checkout-grand b { white-space: normal; text-align: right; font-size: 18px; line-height: 1.35; }
  .mobile-checkout .order-summary { padding: 20px 16px; }
  .mobile-checkout #placeOrder { min-height: 48px; border-radius: 999px; }
  .mobile-checkout .payment-note { margin-top: 14px; padding-top: 14px; line-height: 1.6; }
  .mobile-checkout .checkout-sticky-action {
    position: fixed;
    z-index: 80;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid var(--checkout-border);
    background: var(--checkout-paper);
    box-shadow: 0 -8px 28px #2528220a;
  }
  .mobile-checkout .checkout-sticky-action > div { display: grid; min-width: 0; gap: 3px; }
  .mobile-checkout .checkout-sticky-label { font-size: 11px; color: var(--checkout-muted); }
  .mobile-checkout .checkout-sticky-total { font-size: 19px; font-weight: 750; line-height: 1.25; font-variant-numeric: tabular-nums; }
  .mobile-checkout .checkout-sticky-total[data-pending] { font-size: 13px; max-width: 145px; }
  .mobile-checkout .checkout-sticky-button { flex: 0 1 55%; min-height: 48px; padding: 12px 16px; border: 1px solid var(--checkout-primary); border-radius: 999px; background: var(--checkout-primary); color: #fff; font: 700 13px/1.3 Manrope, Arial, sans-serif; cursor: pointer; }
  .mobile-checkout .checkout-sticky-button:disabled { opacity: .55; cursor: wait; }
  .mobile-checkout .checkout-sticky-button:focus-visible { outline: 3px solid #9abb9e; outline-offset: 3px; }
  .mobile-checkout footer { padding-bottom: calc(108px + env(safe-area-inset-bottom, 0px)); }
  .mobile-checkout:has(.checkout-complete) main { padding-bottom: 30px; }
  .mobile-checkout:has(.checkout-complete) footer { padding-bottom: 24px; }
}
@media (max-width: 350px) {
  .mobile-checkout header .vekstore-mark { max-width: 130px; }
  .mobile-checkout .checkout-sticky-action { padding-left: 12px; padding-right: 12px; gap: 8px; }
  .mobile-checkout .checkout-sticky-button { font-size: 12px; padding: 12px; }
  .mobile-checkout .checkout-choice b { max-width: 62px; font-size: 11px; }
}