/* BIY payment portal mobile alignment refinement */
.skip{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;transform:none!important}
.skip:focus,.skip:focus-visible{position:fixed;left:16px;top:16px;width:auto;height:auto;padding:10px 14px;overflow:visible;z-index:10000;border-radius:10px;background:#EAF2F8;color:#070C15;text-decoration:none;box-shadow:0 10px 24px rgba(0,0,0,.25)}

@media(max-width:700px){
  .workspace{display:grid;grid-template-columns:1fr;gap:20px}
  .invoice,.routes{width:100%;min-width:0;padding:20px;border-radius:20px}
  .invoice-head,.client,.work,.ledger,.secure{width:100%}
  .invoice-head h2{font-size:28px;line-height:1.1}

  .client{grid-template-columns:44px minmax(0,1fr);gap:12px;align-items:start;padding:22px 0}
  .client .avatar{grid-row:1/3;width:44px;height:44px}
  .client .due{grid-column:2;text-align:left;padding-top:4px}

  .work{grid-template-columns:44px minmax(0,1fr);gap:12px;align-items:start;padding:14px}
  .work-icon{width:44px;height:44px}
  .work code{grid-column:2;justify-self:start;margin-top:4px}

  .ledger{margin-bottom:0}
  .ledger .total{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding-bottom:10px}
  .ledger .total strong{font-size:clamp(34px,12vw,48px);line-height:1;letter-spacing:-.04em}

  /* Keep the support block fully below the large mobile balance amount. */
  .invoice-support{grid-template-columns:1fr;gap:12px;padding:12px;margin-top:42px!important;min-height:0;flex:0 0 auto;position:relative;clear:both}
  .invoice-support-item{display:grid;grid-template-columns:44px minmax(0,1fr);gap:6px 12px;align-items:start;padding:14px}
  .invoice-support-item i{grid-row:1/3;width:44px;height:44px;font-size:11px}
  .invoice-support-item strong,.invoice-support-item span{grid-column:2}
  .invoice-support-item strong{margin:0;line-height:1.25;font-size:14px}
  .invoice-support-item span{margin:0;line-height:1.5;font-size:13px}

  .secure{display:grid;grid-template-columns:52px minmax(0,1fr);gap:14px;align-items:start;margin-top:22px!important;padding-top:22px;min-height:0;justify-content:initial;flex:0 0 auto}
  .secure i{width:52px;height:52px;flex:none;margin:0}
  .secure p{margin:0;line-height:1.5;font-size:13px}

  .route-head{text-align:left;max-width:none;margin:0}
  .route-head h2{font-size:32px!important;line-height:1.08!important;letter-spacing:-.04em!important;max-width:none;text-wrap:pretty}
  .selector{grid-template-columns:1fr;gap:12px}
  .option{width:100%}
  .panel{padding:16px}
  .pay-total strong{font-size:42px;line-height:1}

  .stripe-payment-confirmation{max-width:none;margin-top:20px}
  .confirmation-details{margin:18px 0}
  .confirmation-details div{gap:14px}
}