/* Original payment cards from ERP 2M Bronze app.css, 2026-09-25. Scoped to this checkout. */

#checkout-dialog .pag-op{ padding:10px 12px; }
#checkout-dialog .pag-op{ gap:10px; padding:11px 12px; font-size:14px; border-radius:12px; position:relative;
  flex-direction:row !important; }
#checkout-dialog .pag-op input{ position:absolute; opacity:0; pointer-events:none; }
#checkout-dialog .pag-op .po-ic{ flex:none; width:34px; height:34px; border-radius:8px; background:var(--bg);
  display:flex; align-items:center; justify-content:center; }
#checkout-dialog .pag-op .po-svg{ width:20px; height:20px; display:block; }
#checkout-dialog .pag-op .po-mp{ background:#009ee3; font-size:17px; }
#checkout-dialog .pag-op .po-inf{ background:#111; color:#22e584; font-weight:800; font-size:18px; }
#checkout-dialog .pag-op.pag-logo{ justify-content:center; padding:10px 12px; }
#checkout-dialog .pag-op .po-logo-img{ max-width:100%; max-height:44px; object-fit:contain; display:block; }
#checkout-dialog .pag-op .po-logo-svg{ width:30px; height:30px; display:block; }
#checkout-dialog .pag-op{ justify-content:center; }
#checkout-dialog .pag-op{ height:49px; min-height:49px; box-sizing:border-box; padding:0 12px; overflow:hidden; }
#checkout-dialog .pag-op .po-ic{ width:30px; height:30px; }
#checkout-dialog .pag-op .po-logo-img{ max-height:30px; }
#checkout-dialog .pag-op .po-logo-img[alt="Mercado Pago"]{ max-height:58px; }
#checkout-dialog .pag-op .po-pix{ max-height:36px; }
#checkout-dialog .pag-op.po-apay{ background:#000; border-color:#000; }
#checkout-dialog .pag-op.po-apay .wallet-txt{ color:#fff; font-size:20px; font-weight:600; letter-spacing:.3px;
  display:inline-flex; align-items:center; gap:5px; }
#checkout-dialog .pag-op.po-apay .apay-logo{ width:19px; height:19px; display:block; margin-bottom:2px; }
#checkout-dialog .pag-op.po-gpay{ background:#fff; border:1px solid #dadce0; }
#checkout-dialog .pag-op.po-gpay .wallet-txt{ color:#3c4043; font-size:18px; font-weight:600;
  display:inline-flex; align-items:center; gap:6px; }
#checkout-dialog .pag-op.po-gpay .wallet-txt svg{ width:22px; height:22px; display:block; }
#checkout-dialog .pag-op.po-apay.sel{ background:#000; }
#checkout-dialog .pag-op.po-gpay.sel{ background:#fff; }
#checkout-dialog .pag-op.po-wallet.sel{ box-shadow:0 0 0 2px #1db954; }
#checkout-dialog .pag-op .po-nome{ flex:1; text-align:left; line-height:1.2; }
#checkout-dialog .pag-op .po-nome small{ display:block; color:var(--cinza); font-weight:400; font-size:11px; }
#checkout-dialog .pag-op.so-presencial .po-nome{ flex:0 0 auto; text-align:center; }
#checkout-dialog .pag-op .po-ic{ width:42px; height:42px; border-radius:10px; }
#checkout-dialog .pag-op .po-svg{ width:28px; height:28px; }
#checkout-dialog .pag-op.pv-pay{ height:82px; display:grid; grid-template-columns:104px 1fr auto; align-items:center; gap:8px;
  padding:8px 12px; border:0; border-radius:14px; overflow:hidden; color:#fff; text-align:left; position:relative; isolation:isolate; }
#checkout-dialog .pv-cash{ --pvac:#22c55e; background:linear-gradient(110deg,#14532d,#16a34a); }
#checkout-dialog .pv-credit{ --pvac:#2563eb; background:linear-gradient(110deg,#111b4d,#17388f); }
#checkout-dialog .pv-debit{ --pvac:#8b5cf6; background:linear-gradient(110deg,#3b176b,#7636b8); }
#checkout-dialog .pag-op.pv-pay.sel{ box-shadow:0 0 0 2px #fff,0 0 0 5px var(--pvac),0 12px 22px #1114; border-color:transparent; }
#checkout-dialog .pv-brand{ position:relative; z-index:5; width:100px; height:62px; display:flex; align-items:center; justify-content:center; gap:4px; background:transparent; }
#checkout-dialog .pv-copy{ position:relative; z-index:5; }
#checkout-dialog .pv-copy strong,#checkout-dialog .pv-copy small{ display:block; }
#checkout-dialog .pv-copy strong{ font-size:14px; font-weight:800; }
#checkout-dialog .pv-copy small{ margin-top:3px; color:#f3f4f6; font-size:11px; font-weight:400; }
#checkout-dialog .pv-side{ position:relative; z-index:5; font-weight:900; white-space:nowrap; }
#checkout-dialog .pv-visa{ font:italic 900 20px Arial; color:#fff; letter-spacing:-1.5px; }
#checkout-dialog .pv-mc{ position:relative; width:44px; height:25px; }
#checkout-dialog .pv-mc::before,#checkout-dialog .pv-mc::after{ content:""; position:absolute; top:0; width:25px; height:25px; border-radius:50%; }
#checkout-dialog .pv-mc::before{ left:0; background:#eb001b; } #checkout-dialog .pv-mc::after{ right:0; background:#f79e1b; mix-blend-mode:screen; }
#checkout-dialog .pv-mcname{ position:absolute; left:0; right:0; bottom:-11px; text-align:center; font:600 6px Arial; color:#fff; font-style:normal; }
#checkout-dialog .pv-ve{ position:relative; font:italic 900 15px Arial; color:#fff; line-height:12px; }
#checkout-dialog .pv-ve small{ display:block; font:700 7px Arial; letter-spacing:1px; color:#4ade80; }
#checkout-dialog .pv-maestro{ position:relative; width:40px; height:28px; }
#checkout-dialog .pv-maestro::before,#checkout-dialog .pv-maestro::after{ content:""; position:absolute; top:0; width:25px; height:25px; border-radius:50%; }
#checkout-dialog .pv-maestro::before{ left:0; background:#ed1c24; } #checkout-dialog .pv-maestro::after{ right:0; background:#00a2e5; mix-blend-mode:screen; }
#checkout-dialog .pv-maestro span{ position:absolute; left:0; right:0; bottom:-8px; text-align:center; font:600 6px Arial; }
#checkout-dialog .pv-elo{ position:relative; font:900 18px Arial; color:#fff; }
#checkout-dialog .pv-elo::before{ content:""; display:inline-block; width:9px; height:9px; margin-right:2px; border-radius:50%; border:3px solid #3ad566; border-top-color:#4d80ff; border-right-color:#ffd033; vertical-align:1px; }
#checkout-dialog .pv-notes{ position:relative; width:90px; height:55px; }
#checkout-dialog .pv-note{ position:absolute; width:55px; height:27px; border-radius:3px; border:1px solid #ffffffaa; box-shadow:0 2px 4px #0005; color:#fff; font:900 11px Arial; padding:3px 5px; font-style:normal; }
#checkout-dialog .pv-note::after{ content:"R$"; position:absolute; right:4px; bottom:3px; font-size:7px; opacity:.9; }
#checkout-dialog .pv-n10{ left:2px; top:22px; background:linear-gradient(135deg,#d9463e,#ef7d74); transform:rotate(-14deg); }
#checkout-dialog .pv-n20{ left:9px; top:17px; background:linear-gradient(135deg,#d89f21,#f6c846); transform:rotate(-8deg); }
#checkout-dialog .pv-n50{ left:16px; top:12px; background:linear-gradient(135deg,#9a6c38,#c4955d); transform:rotate(-2deg); }
#checkout-dialog .pv-n100{ left:23px; top:7px; background:linear-gradient(135deg,#2563a7,#5ca8d8); transform:rotate(5deg); }
#checkout-dialog .pv-n200{ left:30px; top:2px; background:linear-gradient(135deg,#596168,#8a9298); transform:rotate(12deg); }
#checkout-dialog .pv-rain{ position:absolute; z-index:2; left:104px; right:0; inset-block:0; overflow:hidden; }
#checkout-dialog .pv-fall{ position:absolute; top:-28px; width:34px; height:17px; border-radius:2px; color:#fff; font:900 9px Arial; padding:2px 4px; border:1px solid #fff9; font-style:normal; animation:pv-fall 4s linear infinite; }
#checkout-dialog .pv-fall:nth-child(1){ left:7%; background:#d9463e; animation-delay:-.4s; }
#checkout-dialog .pv-fall:nth-child(2){ left:28%; background:#d89f21; animation-delay:-2.6s; }
#checkout-dialog .pv-fall:nth-child(3){ left:49%; background:#9a6c38; animation-delay:-1.4s; }
#checkout-dialog .pv-fall:nth-child(4){ left:52%; background:#2563a7; animation-delay:-3.3s; }
#checkout-dialog .pv-fall:nth-child(5){ left:66%; background:#596168; animation-delay:-2s; }
@keyframes pv-fall{ 0%{ top:-28px; transform:rotate(-10deg); } 50%{ transform:rotate(12deg); } 100%{ top:90px; transform:rotate(-7deg); } }
#checkout-dialog .pv-shine{ position:absolute; z-index:2; top:-20px; bottom:-20px; width:35px; background:linear-gradient(90deg,transparent,#fff4,transparent); transform:skewX(-18deg); animation:pv-shine 3.4s ease-in-out infinite; }
@keyframes pv-shine{ from{ left:100px; } to{ left:calc(100% + 30px); } }
#checkout-dialog .pv-debit .pv-shine{ animation-delay:-1.7s; }
#checkout-dialog .pv-tap{ position:absolute; z-index:2; right:60px; bottom:8px; width:22px; height:22px; border:2px solid #fff; border-left:0; border-bottom:0; border-radius:0 100% 0 0; animation:pv-tap 2.5s ease-out infinite; }
@keyframes pv-tap{ 0%,35%{ opacity:0; transform:scale(.3); } 55%{ opacity:1; } 80%,100%{ opacity:0; transform:scale(1.35); } }
#checkout-dialog .pix-bloco.aberto{ box-shadow:0 0 0 2px #22c55e; border-radius:14px; overflow:hidden; }
#checkout-dialog .pix-bloco.aberto #opPixEntrega{ box-shadow:none; border:none; border-radius:0; background:rgba(34,197,94,.06); }
#checkout-dialog .pix-bloco.aberto #pixEntregaBox{ border:none; border-radius:0; margin:0; background:rgba(34,197,94,.06); }
#checkout-dialog .pag-op.pv-pay{ height:49px !important; min-height:49px !important; padding:0 10px; grid-template-columns:58px 1fr; overflow:hidden; align-items:center; }
#checkout-dialog .pv-pay .pv-brand{ width:56px; height:34px; align-self:center; transform:scale(.55); transform-origin:left center; }
#checkout-dialog .pv-pay .pv-copy{ align-self:center; }
#checkout-dialog .pv-pay .pv-copy strong{ font-size:12.5px; line-height:1.1; }
#checkout-dialog .pv-pay .pv-copy small, #checkout-dialog .pv-pay .pv-onde{ font-size:9.5px; margin-top:0; line-height:1.1; }
#checkout-dialog .pv-pay .pv-rain{ left:58px; }
#checkout-dialog .pag-op.pv-cash.sel{ background:linear-gradient(110deg,#14532d,#16a34a); }
#checkout-dialog .pag-op.pv-credit.sel{ background:linear-gradient(110deg,#111b4d,#17388f); }
#checkout-dialog .pag-op.pv-debit.sel{ background:linear-gradient(110deg,#3b176b,#7636b8); }
#checkout-dialog .pix-bloco.aberto #opPixEntrega .po-pix{ content:url("/storefront/payments/pix.svg?v=20260915"); }
#checkout-dialog .pag-op.pag-logo:has(img[alt="Mercado Pago"]), #checkout-dialog .pag-op.pag-logo.sel:has(img[alt="Mercado Pago"]){ background:linear-gradient(110deg,#0a3d91,#009ee3); border:0; }
#checkout-dialog .pag-op.pag-logo:has(img[alt="Mercado Pago"]) .po-logo-img{ content:url("/storefront/payments/mercado-pago.svg"); }
#checkout-dialog .pag-op.pag-logo:has(img[alt="InfinitePay"]), #checkout-dialog .pag-op.pag-logo.sel:has(img[alt="InfinitePay"]){ background:linear-gradient(110deg,#0b0b14,#232a3a); border:0; }
#checkout-dialog .pag-op.pag-logo:has(img[alt="InfinitePay"]) .po-logo-img{ content:url("/storefront/payments/infinitepay-dark.svg"); }
#checkout-dialog .pag-op.po-gpay, #checkout-dialog .pag-op.po-gpay.sel{ background:linear-gradient(110deg,#202124,#3c4043) !important; border:0; }
#checkout-dialog .pag-op.po-gpay .wallet-txt{ color:#fff; }
#checkout-dialog .pag-op.pv-credit, #checkout-dialog .pag-op.pv-credit.sel{ background:linear-gradient(110deg,#050505,#2b2b2b); }
#checkout-dialog .pv-credit{ --pvac:#f2c14e; }
#checkout-dialog .pv-credit .pv-fall{ font-size:9.5px; width:30px; height:18px; border-radius:3px; border:1px solid #ffffff55; box-shadow:0 2px 5px #0007; }
#checkout-dialog .pv-credit .pv-fall:nth-child(1){ background:linear-gradient(135deg,#1d4ed8,#3b82f6); left:2%;  animation-delay:-.2s;  animation-duration:3.6s; }
#checkout-dialog .pv-credit .pv-fall:nth-child(2){ background:linear-gradient(135deg,#7c3aed,#a855f7); left:18%; animation-delay:-2.1s; animation-duration:4.4s; }
#checkout-dialog .pv-credit .pv-fall:nth-child(3){ background:linear-gradient(135deg,#0f766e,#14b8a6); left:34%; animation-delay:-1.1s; animation-duration:3.1s; }
#checkout-dialog .pv-credit .pv-fall:nth-child(4){ background:linear-gradient(135deg,#b45309,#f59e0b); left:50%; animation-delay:-3.0s; animation-duration:4.9s; }
#checkout-dialog .pv-credit .pv-fall:nth-child(5){ background:linear-gradient(135deg,#be123c,#fb7185); left:64%; animation-delay:-1.7s; animation-duration:3.8s; }
#checkout-dialog .pv-swipe{ position:absolute; z-index:2; right:26px; top:50%; width:30px; height:20px; margin-top:-10px;
  border-radius:3px; background:linear-gradient(135deg,#c084fc,#7e22ce); border:1px solid #ffffff88;
  box-shadow:0 2px 6px #0006; animation:pv-swipe 2.4s ease-in-out infinite; }
#checkout-dialog .pv-swipe::before{ content:""; position:absolute; left:3px; top:4px; width:8px; height:5px; border-radius:1px; background:#fbbf24; }
@keyframes pv-swipe{ 0%,100%{ transform:translateX(6px) rotate(-6deg); opacity:.12; } 45%,62%{ transform:translateX(-8px) rotate(2deg); opacity:1; } }
#checkout-dialog .pag-op.pag-logo:has(img[alt="Mercado Pago"]) .po-logo-img{ content:url("/storefront/payments/mercado-pago-branco.svg?v=2"); }
#checkout-dialog .mp-card{ position:relative; overflow:hidden; }
#checkout-dialog .mp-parc{ position:absolute; inset:0; z-index:1; pointer-events:none; }
#checkout-dialog .mp-parc i{ position:absolute; font:800 8px/1 Arial; color:#fff; background:#ffffff26; border:1px solid #ffffff59;
  border-radius:20px; padding:2px 6px; white-space:nowrap; opacity:0; font-style:normal; }
#checkout-dialog .mp-parc i:nth-child(1){ animation:mp-flut  9s linear infinite; animation-delay:0s;    }
#checkout-dialog .mp-parc i:nth-child(2){ animation:mp-flut2 9s linear infinite; animation-delay:-3s;   }
#checkout-dialog .mp-parc i:nth-child(3){ animation:mp-flut3 9s linear infinite; animation-delay:-6s;   }
#checkout-dialog .mp-parc i:nth-child(4){ animation:mp-flutL  9s linear infinite; animation-delay:-1.5s; }
#checkout-dialog .mp-parc i:nth-child(5){ animation:mp-flutL2 9s linear infinite; animation-delay:-4.5s; }
#checkout-dialog .mp-parc i:nth-child(6){ animation:mp-flutL3 9s linear infinite; animation-delay:-7.5s; }
@keyframes mp-flut{  0%{ left:78%; top:74%; opacity:0; } 10%{ opacity:.55; } 30%{ opacity:.55; } 42%{ opacity:0; } 100%{ left:60%; top:24%; opacity:0; } }
@keyframes mp-flut2{ 0%{ left:72%; top:84%; opacity:0; } 10%{ opacity:.55; } 30%{ opacity:.55; } 42%{ opacity:0; } 100%{ left:56%; top:46%; opacity:0; } }
@keyframes mp-flut3{ 0%{ left:82%; top:62%; opacity:0; } 10%{ opacity:.55; } 30%{ opacity:.55; } 42%{ opacity:0; } 100%{ left:64%; top:20%; opacity:0; } }
@keyframes mp-flutL{  0%{ left:8%;  top:74%; opacity:0; } 10%{ opacity:.55; } 30%{ opacity:.55; } 42%{ opacity:0; } 100%{ left:22%; top:24%; opacity:0; } }
@keyframes mp-flutL2{ 0%{ left:4%;  top:84%; opacity:0; } 10%{ opacity:.55; } 30%{ opacity:.55; } 42%{ opacity:0; } 100%{ left:18%; top:46%; opacity:0; } }
@keyframes mp-flutL3{ 0%{ left:12%; top:62%; opacity:0; } 10%{ opacity:.55; } 30%{ opacity:.55; } 42%{ opacity:0; } 100%{ left:26%; top:20%; opacity:0; } }
#checkout-dialog .pag-op.pv-pay{ display:flex; justify-content:center; align-items:center; gap:6px; }
#checkout-dialog .pv-pay .pv-brand{ width:auto; min-width:0; height:34px; flex:0 0 auto; transform:scale(.5); transform-origin:center; margin:0 -10px; }
#checkout-dialog .pv-pay .pv-copy{ flex:0 0 auto; text-align:left; }
#checkout-dialog .pv-pay .pv-rain{ left:auto; right:8px; width:46%; }
#checkout-dialog .pag-opcoes{ display:flex; flex-direction:column; gap:6px; }
#checkout-dialog .pag-opcoes .pag-op{ height:44px !important; min-height:44px !important; }
#checkout-dialog .pag-opcoes .pag-op.pv-pay{ height:44px !important; min-height:44px !important; }
#checkout-dialog .pag-op{ display:flex; align-items:center; gap:10px; border:1px solid var(--linha); border-radius:10px;
  padding:11px 12px; cursor:pointer; font-size:14px; font-weight:600; }
#checkout-dialog .pag-op.sel{ border-color:#1db954 !important; box-shadow:0 0 0 2px #1db954;
  background:rgba(29,185,84,.07); }
#checkout-dialog .pag-op input{ accent-color:var(--cor); }
