/* Checkout */
:root {
    --primary:#2563EB; --primary-2:#4F46E5; --primary-dark:#1D4ED8;
    --positive:#10B981; --title:#1E293B; --text:#64748B; --border:#E2E8F0;
    --bg:#F4F6F9; --radius:14px;
}
* { box-sizing:border-box; margin:0; padding:0; }
/* Reset do atributo hidden: regras como .ck-card-fields{display:grid} e
   .ck-method{display:flex} anulam o display:none padrão do navegador para
   [hidden], fazendo campos de cartão aparecerem com PIX selecionado. */
[hidden] { display:none !important; }
body { font-family:'Inter',Arial,sans-serif; background:var(--bg); color:var(--text); font-size:14px; line-height:1.5; min-height:100vh; overflow-x:hidden; width:100%; }
form, fieldset, input, .ck-form-grid, .ck-card-fields, .ck-methods, .ck-grid, .ck-card { min-width:0; max-width:100%; }
.ck-main, .ck-card, .ck-grid { overflow-wrap:break-word; }
img, iframe, video, embed, object { max-width:100%; }

.ck-header { background:#fff; border-bottom:1px solid var(--border); padding:14px 24px; display:flex; align-items:center; justify-content:space-between; position:sticky; top:0; z-index:20; }
.ck-logo { display:flex; align-items:center; gap:10px; text-decoration:none; }
.ck-logo__mark { width:36px; height:36px; border-radius:10px; background:linear-gradient(135deg,var(--primary),var(--primary-2)); color:#fff; display:grid; place-items:center; font-weight:800; }
.ck-logo__name { font-size:17px; font-weight:800; color:var(--title); }
.ck-header__secure { font-size:12.5px; font-weight:600; color:var(--positive); }

.ck-main { max-width:980px; margin:0 auto; padding:32px 20px 48px; }
.ck-grid { display:grid; grid-template-columns:1.2fr .8fr; gap:24px; align-items:start; }

.ck-card { background:#fff; border:1px solid var(--border); border-radius:var(--radius); padding:28px; box-shadow:0 2px 12px rgba(30,41,59,.05); }
.ck-card h1 { font-size:24px; font-weight:800; color:var(--title); margin-bottom:6px; }
.ck-sub { font-size:13.5px; margin-bottom:20px; }
.ck-card h2 { font-size:18px; font-weight:800; color:var(--title); margin-bottom:16px; }

.ck-alert { background:#FEE2E2; color:#B91C1C; border:1px solid #FECACA; border-radius:8px; padding:10px 14px; font-size:13px; margin-bottom:16px; }

.ck-fieldset { border:none; margin-bottom:22px; }
.ck-fieldset legend { font-size:15px; font-weight:700; color:var(--title); margin-bottom:14px; }
.ck-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.ck-field { display:flex; flex-direction:column; gap:6px; }
.ck-field--full { grid-column:1 / -1; }
.ck-field label { font-size:12.5px; font-weight:600; color:var(--title); }
.ck-field label small { color:var(--text); font-weight:400; }
.ck-field input { border:1px solid var(--border); border-radius:8px; padding:11px 12px; font-size:14px; outline:none; transition:border-color .15s ease, box-shadow .15s ease; }
.ck-field input:focus { border-color:var(--primary); box-shadow:0 0 0 3px rgba(37,99,235,.15); }

/* Containers dos iframes do Mercado Pago (cardForm / security fields).
   Mesma altura e aparência do plugin oficial (mp-custom-checkout.min.js).
   A altura final do iframe é definida pelo style do cardForm (height:40px,
   padding:14px) — o container só precisa hospedar o iframe. */
.ck-mp-field { height:40px; width:100%; box-sizing:border-box; position:relative; background:#fff; }
.ck-mp-field iframe { width:100% !important; height:100% !important; border:0; display:block; box-sizing:border-box; border:1px solid var(--border); border-radius:6px; }
/* Select de tipo de documento (CPF/CNPJ) — replica o input-document do plugin */
.ck-mp-doctype { border:1px solid var(--border); border-radius:8px; padding:11px 12px; font-size:14px; background:#fff; color:var(--title); outline:none; }
.ck-mp-doctype:focus { border-color:var(--primary); box-shadow:0 0 0 3px rgba(37,99,235,.15); }
.ck-mp-error { background:#FEE2E2; color:#B91C1C; border:1px solid #FECACA; border-radius:8px; padding:10px 14px; font-size:13px; margin-top:10px; display:none; }

.ck-methods { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:16px; }
.ck-method { display:flex; align-items:center; gap:12px; border:1.5px solid var(--border); border-radius:10px; padding:14px; cursor:pointer; transition:border-color .15s ease, background .15s ease; }
.ck-method:hover { border-color:var(--primary); }
.ck-method.is-selected { border-color:var(--primary); background:#EEF2FF; }
.ck-method input { position:absolute; opacity:0; }
.ck-method i { font-size:20px; color:var(--primary); }
.ck-method span { display:flex; flex-direction:column; }
.ck-method strong { color:var(--title); font-size:13.5px; }
.ck-method small { font-size:11.5px; color:var(--text); }
.ck-card-fields { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.ck-card-fields .ck-paypal-note,
.ck-card-fields #paypalButtonContainer,
.ck-card-fields #paypalLoading,
.ck-card-fields #paypalDivider,
.ck-card-fields #paypalCardFieldsContainer { grid-column:1 / -1; }
#paypalButtonContainer { min-height:45px; }

.ck-gateways { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px; }
.ck-gateway { display:flex; align-items:center; gap:12px; border:1.5px solid var(--border); border-radius:10px; padding:13px 14px; cursor:pointer; transition:border-color .15s ease, background .15s ease; }
.ck-gateway:hover { border-color:var(--primary); }
.ck-gateway.is-selected { border-color:var(--primary); background:#EEF2FF; }
.ck-gateway input { position:absolute; opacity:0; }
.ck-gateway i { font-size:19px; color:var(--primary); min-width:22px; text-align:center; }
.ck-gateway span { display:flex; flex-direction:column; }
.ck-gateway strong { color:var(--title); font-size:13.5px; }
.ck-gateway small { font-size:11.5px; color:var(--text); }

.ck-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; border:none; border-radius:10px; font-weight:700; cursor:pointer; transition:background .15s ease, transform .1s ease; }
.ck-btn:active { transform:scale(.99); }
.ck-btn--primary { background:var(--primary); color:#fff; }
.ck-btn--primary:hover { background:var(--primary-dark); color:#fff; }
.ck-btn--lg { padding:15px 22px; font-size:16px; }
.ck-btn--block { width:100%; }
.ck-secure-note { display:flex; align-items:center; justify-content:center; gap:8px; margin-top:14px; font-size:12px; color:var(--text); }

.ck-summary { position:sticky; top:90px; }
.ck-plan { background:linear-gradient(135deg,#EEF2FF,#F8FAFC); border:1px solid var(--border); border-radius:10px; padding:18px; margin-bottom:18px; text-align:center; }
.ck-plan__name { font-weight:700; color:var(--title); font-size:15px; }
.ck-plan__price { font-size:32px; font-weight:800; color:var(--title); margin:6px 0 2px; }
.ck-plan__old { text-decoration:line-through; color:#94A3B8; font-size:12.5px; }
.ck-plan__saving { display:inline-block; background:#D1FAE5; color:#059669; font-size:11px; font-weight:700; padding:3px 10px; border-radius:999px; margin-top:8px; }
.ck-summary__list { list-style:none; margin-bottom:18px; }
.ck-summary__list li { display:flex; gap:10px; align-items:flex-start; padding:7px 0; font-size:13.5px; color:var(--title); }
.ck-summary__list i { color:var(--positive); margin-top:2px; }
.ck-guarantee { display:flex; gap:12px; background:#F0FDF4; border:1px solid #BBF7D0; border-radius:10px; padding:14px; }
.ck-guarantee i { font-size:26px; color:var(--positive); }
.ck-guarantee strong { color:var(--title); font-size:13.5px; display:block; }
.ck-guarantee p { font-size:12px; color:var(--text); }

/* Cupom de desconto */
.ck-coupon { background:#fff; border:1px solid var(--border); border-radius:12px; margin-bottom:18px; box-shadow:0 1px 4px rgba(30,41,59,.04); transition:border-color .2s ease, box-shadow .2s ease, background .2s ease; }
.ck-coupon [hidden] { display:none !important; }
.ck-coupon.is-open { border-color:var(--primary); box-shadow:0 0 0 3px rgba(37,99,235,.10); }
.ck-coupon.is-applied { border-color:#A7F3D0; background:#F0FDF4; box-shadow:0 1px 4px rgba(5,150,105,.08); }

.ck-coupon__header { display:flex; align-items:center; gap:12px; padding:13px 14px; cursor:pointer; user-select:none; }
.ck-coupon__header-icon { width:34px; height:34px; flex:none; border-radius:10px; background:linear-gradient(135deg,#EEF2FF,#E0E7FF); color:var(--primary); display:grid; place-items:center; font-size:14px; transition:background .2s ease, color .2s ease; }
.ck-coupon.is-applied .ck-coupon__header-icon { background:#D1FAE5; color:#059669; }
.ck-coupon__header-text { flex:1; display:flex; flex-direction:column; min-width:0; }
.ck-coupon__title { font-size:13.5px; font-weight:700; color:var(--title); }
.ck-coupon.is-applied .ck-coupon__title { color:#065F46; }
.ck-coupon__sub { font-size:11.5px; color:var(--text); }
.ck-coupon__header-right { display:flex; align-items:center; gap:8px; flex:none; }
.ck-coupon__chevron { color:#94A3B8; font-size:11px; transition:transform .2s ease; }
.ck-coupon.is-open .ck-coupon__chevron { transform:rotate(180deg); }
.ck-coupon__pill { font-family:ui-monospace,monospace; font-weight:700; font-size:11px; letter-spacing:.5px; background:#D1FAE5; color:#047857; border:1px dashed #6EE7B7; padding:3px 10px; border-radius:999px; }
.ck-coupon__applied-amount { font-size:13px; font-weight:800; color:#047857; }
.ck-coupon__remove { width:28px; height:28px; flex:none; border:none; border-radius:8px; background:#FEF2F2; color:#DC2626; cursor:pointer; font-size:14px; display:grid; place-items:center; transition:background .15s ease; }
.ck-coupon__remove:hover { background:#FEE2E2; }

.ck-coupon__panel { padding:2px 14px 14px; }
.ck-coupon__row { display:flex; gap:8px; }
.ck-coupon__row input { flex:1; min-width:0; padding:11px 12px; border:1.5px solid var(--border); border-radius:9px; font-size:13.5px; font-weight:600; text-transform:uppercase; font-family:ui-monospace,monospace; letter-spacing:.5px; color:var(--title); background:#fff; transition:border-color .15s ease, box-shadow .15s ease; }
.ck-coupon__row input::placeholder { color:#94A3B8; font-weight:500; }
.ck-coupon__row input:focus { outline:none; border-color:var(--primary); box-shadow:0 0 0 3px rgba(37,99,235,.15); }
.ck-btn--coupon { background:var(--primary); color:#fff; padding:11px 16px; font-size:13px; border-radius:9px; flex:none; }
.ck-btn--coupon:hover { background:var(--primary-dark); color:#fff; }
.ck-btn--coupon:disabled { opacity:.65; cursor:wait; }
.ck-coupon__status { margin-top:10px; font-size:12.5px; font-weight:600; padding:9px 11px; border-radius:8px; display:flex; align-items:center; gap:8px; }
.ck-coupon__status.err { background:#FEF2F2; color:#B91C1C; border:1px solid #FECACA; }
.ck-coupon__hint { margin-top:9px; font-size:11px; color:var(--text); display:flex; gap:6px; align-items:center; }

.ck-coupon__totals { margin:0 14px 14px; padding:12px 14px; background:#ECFDF5; border:1px solid #A7F3D0; border-radius:10px; font-size:13px; }
.ck-coupon__totals-row { display:flex; justify-content:space-between; padding:4px 0; color:var(--title); }
.ck-coupon__totals-discount { color:#047857; font-weight:700; }
.ck-coupon__totals-discount span:last-child { font-weight:800; }
.ck-coupon__totals-total { border-top:1px solid #A7F3D0; margin-top:6px; padding-top:8px; font-size:15px; font-weight:800; color:var(--title); }

.ck-footer { text-align:center; padding:20px; font-size:12px; color:var(--text); }
.ck-footer a { color:var(--primary); text-decoration:none; }

/* PayPal - Advanced Card Fields embutido (cartão sem login) */
.ck-paypal-divider { display:flex; align-items:center; gap:12px; margin:16px 0 4px; color:#64748B; font-size:12.5px; font-weight:600; }
.ck-paypal-divider::before,
.ck-paypal-divider::after { content:""; flex:1; height:1px; background:var(--border); }
.ck-paypal-cardfield { border:1.5px solid var(--border); border-radius:9px; padding:11px 12px; background:#fff; min-height:46px; transition:border-color .15s ease, box-shadow .15s ease; margin-bottom:10px; }
.ck-paypal-cardfield iframe { border:0; width:100%; min-height:22px; }
.ck-paypal-cardfield:focus-within { border-color:var(--primary); box-shadow:0 0 0 3px rgba(37,99,235,.15); }
.ck-paypal-cardfield-row { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.ck-paypal-cardfield-row .ck-paypal-cardfield { margin-bottom:0; }

@media (max-width:820px) {
    .ck-grid { grid-template-columns:1fr; }
    .ck-summary { position:static; }
    .ck-main { padding:20px 16px 40px; }
    .ck-form-grid, .ck-card-fields, .ck-paypal-cardfield-row { grid-template-columns:1fr; }
}
@media (max-width:520px) {
    .ck-form-grid { grid-template-columns:1fr; }
    .ck-card { padding:20px 16px; }
    .ck-card h1 { font-size:20px; }
    .ck-methods { grid-template-columns:1fr; gap:10px; }
    .ck-method { padding:16px; gap:14px; }
    .ck-method i { font-size:22px; }
    .ck-method strong { font-size:14px; }
    .ck-method small { font-size:12px; }
    .ck-btn--lg { padding:16px 20px; font-size:17px; }
    .ck-header { padding:12px 16px; }
    .ck-header__secure { font-size:11.5px; }
    .ck-plan__price { font-size:28px; }
    .ck-guarantee { flex-direction:column; text-align:center; align-items:center; }
    .ck-field input { padding:13px 12px; font-size:15px; }
    .ck-field label { font-size:13px; }
    .ck-fieldset legend { font-size:14.5px; }
    .ck-sub { font-size:13px; }
    .ck-card-fields { grid-template-columns:1fr; }
    .ck-paypal-cardfield-row { grid-template-columns:1fr; }
    #card_number { font-size:16px; } /* evita zoom automático do iOS ao focar */
}

/* MEU DINDIM - Logo enviada pelo admin (marca personalizada) */
.img-logo { background: none !important; }
.img-logo img { width: 100%; height: 100%; object-fit: contain; border-radius: inherit; display: block; }
