/* PageHost Stone/Pagar.me - formulário de cartão compartilhado.
   Checkout e fatura herdam daqui o mesmo padrão visual. */

.ph-card-ui{color:#17212b;font-weight:400}
.ph-card-ui .ph-cart-head strong,.ph-card-ui .ph-brand strong{font-weight:600}
.ph-card-ui .ph-cart-head small,.ph-card-ui .ph-brand span,.ph-card-ui .ph-brand small{font-weight:400}
.ph-card-ui .ph-cart-field label,.ph-card-ui .ph-field label{font-weight:500!important;color:#17212b}
.ph-card-ui .ph-cart-field input,.ph-card-ui .ph-cart-field select,.ph-card-ui .ph-field input,.ph-card-ui .ph-field select{font-weight:400!important;border:1px solid #cbd7e1!important;border-radius:8px!important;background:#fff!important;color:#18232c!important;box-shadow:none!important}
.ph-card-ui .ph-cart-field input:focus,.ph-card-ui .ph-cart-field select:focus,.ph-card-ui .ph-field input:focus,.ph-card-ui .ph-field select:focus{outline:0!important;border-color:#2f91c2!important;box-shadow:0 0 0 2px rgba(47,145,194,.12)!important}

/* Total efetivamente cobrado no cartão. O JS atualiza quando a parcela muda. */
.ph-total-display{min-width:118px;text-align:right;white-space:nowrap}
.ph-total-display span{display:block;margin-bottom:2px;color:#7c8b97;font-size:9.5px;font-weight:500;text-transform:uppercase;letter-spacing:.05em}
.ph-total-display strong{display:block!important;color:#101820!important;font-size:20px!important;line-height:1.1!important;font-weight:650!important}

/* Cartão visual canônico: exatamente o mesmo DOM/classes na fatura e checkout. */
.ph-card-ui .ph-shared-card{position:relative!important;display:block!important;width:100%!important;aspect-ratio:1.58/1!important;min-height:0!important;overflow:hidden!important;padding:18px!important;border-radius:17px!important;color:#fff!important;background:linear-gradient(135deg,#15364b 0%,#1c6e9d 48%,#4ca8d3 100%)!important;box-shadow:0 12px 30px rgba(20,89,126,.18)!important}
.ph-card-ui .ph-shared-card:before,.ph-card-ui .ph-shared-card:after{content:""!important;position:absolute!important;z-index:0!important;width:190px!important;height:190px!important;border:34px solid rgba(255,255,255,.07)!important;border-radius:50%!important;pointer-events:none!important}
.ph-card-ui .ph-shared-card:before{left:-95px!important;top:-125px!important}
.ph-card-ui .ph-shared-card:after{right:-120px!important;bottom:-145px!important}

/* Chip com trilhas, igual nas duas telas. */
.ph-card-ui .ph-cart-chip{position:absolute!important;z-index:2!important;left:18px!important;top:18px!important;width:47px!important;height:34px!important;border-radius:8px!important;background:linear-gradient(135deg,#f9d86f,#e8a92c)!important;box-shadow:inset 0 0 0 1px rgba(104,71,10,.25)!important}
.ph-card-ui .ph-cart-chip:before,.ph-card-ui .ph-cart-chip:after,.ph-card-ui .ph-cart-chip i,.ph-card-ui .ph-cart-chip b,.ph-card-ui .ph-cart-chip em{content:"";position:absolute;display:block;background:rgba(147,96,22,.58)}
.ph-card-ui .ph-cart-chip:before{left:14px;top:0;width:1px;height:100%}
.ph-card-ui .ph-cart-chip:after{right:14px;top:0;width:1px;height:100%}
.ph-card-ui .ph-cart-chip i{left:0;top:11px;width:100%;height:1px}
.ph-card-ui .ph-cart-chip b{left:0;bottom:11px;width:100%;height:1px}
.ph-card-ui .ph-cart-chip em{left:14px;top:11px;width:19px;height:12px;border:1px solid rgba(147,96,22,.58);background:transparent}

/* Contactless desenhado por CSS, sem caracteres. */
.ph-card-ui .ph-cart-contactless{position:absolute!important;z-index:2!important;right:18px!important;top:20px!important;width:34px!important;height:30px!important;font-size:0!important;transform:none!important;opacity:1!important}
.ph-card-ui .ph-cart-contactless:before,.ph-card-ui .ph-cart-contactless:after,.ph-card-ui .ph-cart-contactless i,.ph-card-ui .ph-cart-contactless b{content:"";position:absolute;border:3px solid rgba(255,255,255,.92);border-left:0;border-top-color:transparent;border-bottom-color:transparent;border-radius:50%;top:2px;bottom:2px}
.ph-card-ui .ph-cart-contactless:before{right:0;width:30px}.ph-card-ui .ph-cart-contactless:after{right:5px;width:21px}.ph-card-ui .ph-cart-contactless i{right:10px;width:12px}.ph-card-ui .ph-cart-contactless b{right:15px;width:4px}

.ph-card-ui .ph-cart-number{position:absolute!important;z-index:2!important;left:18px!important;right:18px!important;top:78px!important;margin:0!important;color:#fff!important;font-size:18px!important;font-weight:650!important;letter-spacing:1.5px!important;white-space:nowrap!important;text-shadow:0 1px 2px rgba(0,0,0,.15)!important}
.ph-card-ui .ph-cart-number.ph-long{font-size:16px!important;letter-spacing:1px!important}
.ph-card-ui .ph-cart-meta{position:absolute!important;z-index:2!important;left:18px!important;right:88px!important;bottom:15px!important;display:flex!important;align-items:flex-end!important;justify-content:space-between!important;gap:12px!important;color:#fff!important}
.ph-card-ui .ph-cart-meta span{display:block!important;margin-bottom:2px!important;color:rgba(255,255,255,.70)!important;font-size:7.5px!important;font-weight:500!important;text-transform:uppercase!important;letter-spacing:.06em!important}
.ph-card-ui .ph-cart-meta strong{display:block!important;max-width:132px!important;overflow:hidden!important;color:#fff!important;font-size:10.5px!important;font-weight:650!important;line-height:1.15!important;letter-spacing:.03em!important;white-space:nowrap!important;text-overflow:ellipsis!important}
.ph-card-ui .ph-cart-expiry-meta{text-align:right;flex:0 0 auto}
.ph-card-ui .ph-cart-brand-slot{position:absolute!important;z-index:2!important;right:17px!important;bottom:14px!important;width:66px!important;height:28px!important;display:flex!important;align-items:center!important;justify-content:flex-end!important}
.ph-card-ui .ph-cart-brand{display:block;max-width:62px!important;max-height:26px!important;width:auto!important;height:auto!important;object-fit:contain!important;filter:drop-shadow(0 1px 2px rgba(0,0,0,.15))}
.ph-card-ui .ph-cart-pagehost{color:rgba(255,255,255,.86)!important;font-size:9.5px!important;font-weight:700!important;letter-spacing:.07em!important}

/* Bandeiras 25% maiores que o padrão anterior do checkout (188 -> 235px). */
.ph-card-ui .ph-cart-brands,.ph-card-ui .ph-shared-brands{text-align:center!important;margin-top:9px!important;color:#687783!important;font-size:10px!important;font-weight:400!important}
.ph-card-ui .ph-cart-brands span,.ph-card-ui .ph-shared-brands span{display:block!important;margin-bottom:5px!important;color:#687783!important;font-size:10px!important;font-weight:400!important}
.ph-card-ui .ph-cart-brands img,.ph-card-ui .ph-shared-brands img{display:block!important;margin:5px auto 0!important;width:100%!important;max-width:235px!important;height:auto!important;max-height:44px!important;object-fit:contain!important;object-position:center!important}

.ph-card-ui .ph-cart-switch-row,.ph-card-ui .ph-save-toggle{border:1px solid #e4ebef!important;border-radius:9px!important;background:#fbfdfe!important}
.ph-card-ui .ph-cart-security,.ph-card-ui .ph-security-box{border-radius:9px!important;background:#f7fafc!important;color:#63727e!important}
.ph-card-ui .ph-cart-installment-help,.ph-card-ui .ph-installment-help{color:#73818c!important;line-height:1.35!important;font-weight:400!important}

@media(max-width:760px){
  .ph-card-ui .ph-shared-card{padding:16px!important}
  .ph-card-ui .ph-cart-number{font-size:17px!important}
}
@media(max-width:390px){
  .ph-total-display{text-align:left;margin-top:6px}
  .ph-card-ui .ph-cart-number{font-size:16px!important}
  .ph-card-ui .ph-cart-meta{left:15px!important;right:78px!important;bottom:13px!important}
  .ph-card-ui .ph-cart-brand-slot{right:14px!important;bottom:12px!important;width:60px!important}
  .ph-card-ui .ph-cart-brand{max-width:58px!important;max-height:24px!important}
}