
.checkout-page{min-height:100vh;padding:108px 20px 70px;background:radial-gradient(circle at 50% -10%,rgba(255,255,255,.07),transparent 35%),linear-gradient(135deg,#050505 0%,#171717 52%,#090909 100%);color:#f5f5f5}
.checkout-shell{width:min(1120px,100%);margin:0 auto}.checkout-back{display:inline-flex;align-items:center;gap:8px;color:#aaa;text-decoration:none;font-size:.82rem;margin-bottom:18px;transition:.2s}.checkout-back:hover{color:#fff;transform:translateX(-2px)}
.checkout-layout{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(320px,.8fr);gap:18px;align-items:start}.checkout-main,.checkout-summary{border:1px solid rgba(255,255,255,.1);border-radius:20px;background:rgba(17,17,17,.88);box-shadow:0 24px 70px rgba(0,0,0,.35);backdrop-filter:blur(14px)}.checkout-main{padding:26px}.checkout-summary{padding:22px;position:sticky;top:90px}
.checkout-head{display:flex;gap:16px;align-items:flex-start;padding-bottom:20px;border-bottom:1px solid rgba(255,255,255,.07)}.checkout-product-icon{width:58px;height:58px;flex:0 0 58px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.13);border-radius:16px;background:#292929;font-size:1.2rem}.checkout-head h1{margin:5px 0 5px;font-size:clamp(1.9rem,4vw,2.8rem);letter-spacing:-.04em}.checkout-head p{margin:0;color:#999;line-height:1.5;font-size:.84rem}.checkout-eyebrow{display:inline-flex;gap:7px;align-items:center;color:#aaa;font-size:.68rem;font-weight:900;letter-spacing:.13em}
.checkout-section{padding:22px 0;border-bottom:1px solid rgba(255,255,255,.07)}.checkout-section:last-child{border-bottom:0}.checkout-section h2{font-size:1rem;margin:0 0 14px}.plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.plan{position:relative;padding:14px;border:1px solid rgba(255,255,255,.09);border-radius:13px;background:rgba(255,255,255,.025);cursor:pointer;text-align:left;transition:.2s}.plan:hover{border-color:rgba(255,255,255,.25);transform:translateY(-2px)}.plan.selected{border-color:rgba(255,255,255,.55);background:rgba(255,255,255,.075);box-shadow:0 0 0 1px rgba(255,255,255,.08)}.plan .tag{position:absolute;right:8px;top:8px;padding:3px 6px;border-radius:99px;background:#eee;color:#111;font-size:.57rem;font-weight:900}.plan-name{display:block;color:#ddd;font-size:.78rem;font-weight:800}.plan-price{display:block;margin-top:8px;font-size:1.12rem;font-weight:900}.plan-period{display:block;margin-top:3px;color:#777;font-size:.65rem}
.methods{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.method{padding:15px;border:1px solid rgba(255,255,255,.09);border-radius:13px;background:rgba(255,255,255,.025);cursor:pointer;transition:.2s}.method:hover{border-color:rgba(255,255,255,.25)}.method.selected{border-color:rgba(255,255,255,.5);background:rgba(255,255,255,.07)}.method i{font-size:1rem}.method strong{display:block;margin-top:9px;font-size:.8rem}.method span{display:block;margin-top:3px;color:#777;font-size:.63rem}
.coupon-row{display:flex;gap:8px}.coupon-row input,.contact-grid input{width:100%;box-sizing:border-box;border:1px solid rgba(255,255,255,.1);border-radius:10px;background:#0c0c0c;color:#eee;padding:11px 12px;outline:none}.coupon-row input:focus,.contact-grid input:focus{border-color:rgba(255,255,255,.35)}.coupon-row button{border:1px solid rgba(255,255,255,.13);border-radius:10px;background:#eee;color:#111;padding:0 15px;font-weight:900;cursor:pointer}.coupon-message{min-height:17px;margin-top:7px;font-size:.68rem;color:#999}.coupon-message.success{color:#7ee2a8}.coupon-message.error{color:#ff9a9a}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.discord-login{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border:1px solid rgba(255,255,255,.09);border-radius:12px;background:rgba(255,255,255,.025)}.discord-user{display:flex;align-items:center;gap:10px;min-width:0}.discord-avatar{width:34px;height:34px;border-radius:50%;object-fit:cover;background:#292929}.discord-user strong{display:block;font-size:.76rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.discord-user span{display:block;margin-top:2px;color:#777;font-size:.63rem}.login-button,.support-button{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:9px 12px;border-radius:9px;text-decoration:none;font-size:.68rem;font-weight:900;white-space:nowrap}.login-button{background:#eee;color:#111}.support-button{border:1px solid rgba(255,255,255,.12);background:#242424;color:#eee}.checkout-summary h2{font-size:1rem;margin:0 0 16px}.summary-product{display:flex;justify-content:space-between;gap:15px;padding-bottom:15px;border-bottom:1px solid rgba(255,255,255,.07)}.summary-product strong{font-size:.82rem}.summary-product span{color:#aaa;font-size:.68rem}.summary-line{display:flex;justify-content:space-between;gap:12px;margin-top:12px;color:#999;font-size:.72rem}.summary-line.discount{color:#76d79c}.summary-total{display:flex;justify-content:space-between;align-items:end;margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.1)}.summary-total span{color:#888;font-size:.7rem}.summary-total strong{font-size:1.55rem}.checkout-button{width:100%;margin-top:18px;border:0;border-radius:11px;padding:13px;background:#eee;color:#111;font-weight:900;cursor:pointer;transition:.2s}.checkout-button:hover{background:#fff;transform:translateY(-1px);box-shadow:0 12px 30px rgba(255,255,255,.1)}.checkout-button:disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}.secure-note{display:flex;gap:8px;align-items:flex-start;margin-top:12px;color:#666;font-size:.62rem;line-height:1.45}.support-box{margin-top:14px;padding-top:14px;border-top:1px solid rgba(255,255,255,.07)}.support-box p{margin:0 0 9px;color:#777;font-size:.66rem;line-height:1.45}
.checkout-legal{margin-top:12px;color:#555;font-size:.58rem;line-height:1.5}.checkout-demo{margin-top:12px;padding:10px;border:1px dashed rgba(255,255,255,.1);border-radius:10px;color:#666;font-size:.61rem;line-height:1.45}
@media(max-width:850px){.checkout-layout{grid-template-columns:1fr}.checkout-summary{position:static}.plans{grid-template-columns:repeat(2,1fr)}}@media(max-width:560px){.checkout-page{padding:92px 12px 45px}.checkout-main,.checkout-summary{padding:18px}.checkout-head{flex-direction:column}.plans,.methods,.contact-grid{grid-template-columns:1fr}.coupon-row{flex-direction:column}.coupon-row button{height:42px}.discord-login{align-items:flex-start;flex-direction:column}.login-button,.support-button{width:100%}}

.checkout-features{display:flex;flex-wrap:wrap;gap:8px}.checkout-features span{display:inline-flex;align-items:center;gap:7px;padding:8px 10px;border:1px solid rgba(255,255,255,.08);border-radius:9px;background:rgba(255,255,255,.025);color:#aaa;font-size:.66rem}.checkout-features i{color:#ddd}


/* Ajustes v6: textos do checkout sempre legíveis */
.checkout-page .plan,
.checkout-page .plan-name,
.checkout-page .plan-price,
.checkout-page .plan-period,
.checkout-page .method,
.checkout-page .method strong,
.checkout-page .method span,
.checkout-page .method i { color: #f1f1f1; }
.checkout-page .plan-period, .checkout-page .method span { color: #a9a9a9; }
.checkout-page .plan-price { color: #fff; }
.checkout-page .method.selected, .checkout-page .plan.selected { color:#fff; }
.checkout-page .contact-grid input::placeholder { color:#777; }
.checkout-page .contact-grid input[required] { border-color:rgba(255,255,255,.16); }
.checkout-page .field-hint { margin:6px 0 0; color:#777; font-size:.62rem; line-height:1.4; }
.checkout-page .required-mark { color:#ffb4b4; }
.checkout-page .checkout-status { margin-top:10px; min-height:18px; font-size:.7rem; line-height:1.45; }
.checkout-page .checkout-status.error { color:#ff9a9a; }
.checkout-page .checkout-status.success { color:#7ee2a8; }



/* Campos de contato — alinhamento e acabamento */
.checkout-field{display:flex;flex-direction:column;gap:7px;min-width:0;color:#f1f1f1;font-size:.76rem;font-weight:700;line-height:1.2}
.checkout-field>span{display:flex;align-items:center;gap:4px;min-height:18px}
.checkout-field>span small{color:#777;font-size:.65rem;font-weight:600}
.checkout-field input{font:inherit;font-weight:500}
.pagbank-tax-field{margin-top:10px;padding:12px 13px;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:rgba(255,255,255,.025);box-sizing:border-box}
.pagbank-tax-field[hidden]{display:none}
.pagbank-tax-field input{background:#0c0c0c}
.field-hint-inline{color:#777;font-size:.62rem;font-weight:500;line-height:1.35}
.contact-grid{align-items:start}
.contact-grid .checkout-field input{min-height:42px}
#checkoutStatus{margin-top:10px}

/* Animações de entrada do checkout — editável nesta página */
.checkout-page .checkout-shell{animation:fade-up .55s ease-out both}
.checkout-page .checkout-head{animation:fade-up .55s ease-out .06s both}
.checkout-page .checkout-section{animation:fade-up .5s ease-out both}
.checkout-page .checkout-section:nth-of-type(1){animation-delay:.10s}
.checkout-page .checkout-section:nth-of-type(2){animation-delay:.16s}
.checkout-page .checkout-section:nth-of-type(3){animation-delay:.22s}
.checkout-page .checkout-section:nth-of-type(4){animation-delay:.28s}
.checkout-page .checkout-section:nth-of-type(5){animation-delay:.34s}
.checkout-page .checkout-summary{animation:fade-up .55s ease-out .18s both}
@keyframes fade-up{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.checkout-page .checkout-shell,.checkout-page .checkout-head,.checkout-page .checkout-section,.checkout-page .checkout-summary{animation:none!important}}

body.modal-open{overflow:hidden}.payment-modal{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;padding:20px;background:rgba(0,0,0,.76);backdrop-filter:blur(8px);animation:modalFade .18s ease}.payment-modal[hidden]{display:none}.payment-modal-card{width:min(680px,100%);max-height:90vh;overflow:auto;border:1px solid rgba(255,255,255,.12);border-radius:22px;background:#111;box-shadow:0 30px 100px rgba(0,0,0,.65);animation:modalUp .22s ease}.payment-modal-head{display:flex;justify-content:space-between;align-items:flex-start;padding:22px 24px;border-bottom:1px solid rgba(255,255,255,.08)}.payment-modal-head h2{margin:5px 0 0;font-size:1.45rem}.payment-modal-close{width:38px;height:38px;border:1px solid rgba(255,255,255,.1);border-radius:12px;background:#1d1d1d;color:#fff;cursor:pointer}.payment-result{padding:24px}.payment-status{display:grid;gap:6px;text-align:center;margin-bottom:20px}.payment-status i{font-size:1.5rem}.payment-status strong{font-size:1.1rem}.payment-status span,.payment-small{color:#999;font-size:.82rem;line-height:1.5}.pix-qr{display:block;width:min(280px,100%);aspect-ratio:1;margin:0 auto 20px;background:#fff;border-radius:16px;padding:10px}.copy-field{display:grid;grid-template-columns:1fr auto;gap:8px}.copy-field input{min-width:0;border:1px solid rgba(255,255,255,.1);border-radius:11px;background:#080808;color:#fff;padding:12px;font-size:.75rem}.copy-field button,.external-payment{border:0;border-radius:11px;background:#fff;color:#111;font-weight:800;padding:0 18px;cursor:pointer}.external-payment{width:100%;height:48px;margin-top:10px}.payment-modal #cardPaymentBrick_container{margin-top:14px;background:#fff;border-radius:14px;padding:12px;color:#111}@keyframes modalFade{from{opacity:0}to{opacity:1}}@keyframes modalUp{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}

/* Navbar: alinhamento idêntico ao restante do CHS Club */
.navbar .nav-container{position:relative;width:min(100%,1050px);height:70px;margin:0 auto;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 10px;box-sizing:border-box}
.navbar .logo{justify-self:start}.navbar .nav-links{justify-self:center;display:flex;align-items:center;gap:29px}.navbar .profile{justify-self:end;display:flex;align-items:center;justify-content:center;margin:0;padding:0}
.navbar .profile-icon{width:30px;height:30px;display:flex;align-items:center;justify-content:center}
@media(max-width:1100px){.navbar .nav-container{padding:0 25px}.navbar .nav-links{gap:20px}.navbar .nav-links a{font-size:13px}}

.card-payment-form{display:flex;flex-direction:column;gap:14px}.card-payment-form label{display:flex;flex-direction:column;gap:7px;text-align:left;font-weight:600}.card-payment-form input,.card-payment-form select{width:100%;box-sizing:border-box;padding:12px 13px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);color:inherit;outline:none}.card-payment-form input:focus,.card-payment-form select:focus{border-color:rgba(255,255,255,.3)}.card-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.card-payment-form .payment-small{min-height:20px}.card-payment-form .success{color:#72e0a0}.card-payment-form .error{color:#ff8585}

.checkout-button,.method{cursor:pointer}.checkout-button:disabled{opacity:.65;cursor:wait}.method.selected{outline:2px solid rgba(255,255,255,.25)}


/* Ajustes do checkout: login Discord e parcelamento */
.discord-login{min-height:58px;box-sizing:border-box}
.discord-login .discord-user{flex:1;min-width:0}
.discord-login .login-button{flex:0 0 auto;height:38px;box-sizing:border-box;padding:0 14px}
.discord-login .login-button i{font-size:15px;line-height:1}
.profile-icon .fa-discord{font-size:18px;line-height:1}
.profile-icon{overflow:hidden}
.card-payment-form select#cardInstallments{appearance:none;-webkit-appearance:none;padding:13px 42px 13px 14px;border:1px solid rgba(255,255,255,.13);border-radius:12px;background:linear-gradient(135deg,rgba(255,255,255,.075),rgba(255,255,255,.035));color:#f5f5f5;font-weight:700;cursor:pointer;background-image:linear-gradient(45deg,transparent 50%,#aaa 50%),linear-gradient(135deg,#aaa 50%,transparent 50%);background-position:calc(100% - 20px) 52%,calc(100% - 14px) 52%;background-size:6px 6px,6px 6px;background-repeat:no-repeat;transition:border-color .2s,box-shadow .2s,transform .2s}
.card-payment-form select#cardInstallments:hover{border-color:rgba(255,255,255,.25);transform:translateY(-1px)}
.card-payment-form select#cardInstallments:focus{border-color:rgba(255,255,255,.42);box-shadow:0 0 0 3px rgba(255,255,255,.06);outline:none}
.card-payment-form select#cardInstallments option{background:#191919;color:#f5f5f5;font-weight:600}
.card-installment-note{margin:-6px 0 0;color:#777;font-size:.62rem;line-height:1.4}

.checkout-page .contact-grid input:-webkit-autofill,
.checkout-page .contact-grid input:-webkit-autofill:hover,
.checkout-page .contact-grid input:-webkit-autofill:focus,
.checkout-page .pagbank-tax-field input:-webkit-autofill,
.checkout-page .pagbank-tax-field input:-webkit-autofill:hover,
.checkout-page .pagbank-tax-field input:-webkit-autofill:focus{
  -webkit-text-fill-color:#eee;
  -webkit-box-shadow:0 0 0 1000px #0c0c0c inset;
  transition:background-color 9999s ease-out 0s;
}
.checkout-page .pagbank-tax-field input{min-height:42px}
.checkout-page .pagbank-tax-field .required-mark{margin-left:1px}


/* Ajuste visual v26 — Contato e Discord */
.checkout-page .discord-login{position:relative;display:flex;align-items:center;min-height:58px;box-sizing:border-box;}
.checkout-page .discord-user{display:flex;align-items:center;gap:10px;min-width:0;}
.checkout-page .discord-avatar{width:36px;height:36px;min-width:36px;flex:0 0 36px;display:flex;align-items:center;justify-content:center;border-radius:50%;object-fit:cover;overflow:hidden;background:#292929;color:#fff;line-height:1;}
.checkout-page .discord-avatar i{display:block;font-size:17px;line-height:1;}
.checkout-page .discord-avatar img{width:100%;height:100%;display:block;object-fit:cover;border-radius:50%;}
.checkout-page .contact-grid{align-items:start;}
.checkout-page .contact-grid .checkout-field{min-width:0;}
.checkout-page .contact-grid .checkout-field input{width:100%;min-height:42px;box-sizing:border-box;}
.checkout-page .contact-grid .field-hint{display:block;margin:6px 0 0;color:#777;font-size:.62rem;line-height:1.4;font-weight:500;}
.checkout-page .pagbank-tax-field{width:100%;margin-top:14px;padding:0;border:0;border-radius:0;background:transparent;box-sizing:border-box;}
.checkout-page .pagbank-tax-field input{width:100%;min-height:42px;box-sizing:border-box;border:1px solid rgba(255,255,255,.1);border-radius:10px;background:#0c0c0c;color:#eee;padding:11px 12px;outline:none;font:inherit;font-weight:500;}
.checkout-page .pagbank-tax-field input:focus{border-color:rgba(255,255,255,.35);}
.checkout-page .pagbank-tax-field .field-hint-inline{display:block;margin-top:6px;color:#777;font-size:.62rem;font-weight:500;line-height:1.4;}
.checkout-page .pagbank-tax-field[hidden]{display:none;}
.checkout-page .discord-login .login-button{margin-left:auto;}
@media(max-width:560px){.checkout-page .discord-login{align-items:center;flex-direction:row;}.checkout-page .discord-login .login-button{width:auto;margin-left:auto;}.checkout-page .discord-user{min-width:0;}}
