/* Modal de pago de Whop dentro de la comunidad. Mismo aspecto que el de las páginas de ventas. */
.ccxwm{position:fixed;inset:0;z-index:2147483000;display:flex;align-items:center;justify-content:center;padding:24px 16px;background:rgba(12,9,30,.55);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:ccxwmFade .16s ease-out}
.ccxwm{--ccxwm-bg:#fff}
.ccxwm-dark{--ccxwm-bg:#151515}
.ccxwm[hidden]{display:none}
.ccxwm *,.ccxwm *::before,.ccxwm *::after{box-sizing:border-box}
.ccxwm-wrap{width:100%;max-width:500px;display:flex;flex-direction:column;align-items:flex-end;gap:8px;animation:ccxwmPop .2s ease-out}
.ccxwm-box{width:100%;max-height:calc(100vh - 100px);max-height:calc(100svh - 100px);overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;background-image:linear-gradient(var(--ccxwm-bg),var(--ccxwm-bg));background-repeat:no-repeat;background-position:0 14px;background-size:100% calc(100% - 28px);border-radius:14px;box-shadow:0 30px 80px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.08);outline:0;scrollbar-width:none;-ms-overflow-style:none}
.ccxwm-box{position:relative}
.ccxwm-box::-webkit-scrollbar{display:none;width:0;height:0}
/* Checkout: la caja mide desde el inicio lo mismo que su maximo (el checkout de Whop siempre es mas alto), asi no cambia de tamano al cargar. El iframe espera oculto y fuera del flujo. */
.ccxwm-box.is-checkout{min-height:calc(100vh - 100px);min-height:calc(100svh - 100px)}
.ccxwm-box.is-loading{overflow:hidden}
.ccxwm-box.is-loading .ccxwm-msg{display:flex;align-items:center;justify-content:center;min-height:inherit}
.ccxwm-mount.is-loading{position:absolute;top:0;left:0;width:100%;visibility:hidden;pointer-events:none}
/* El fondo de la caja empieza 14px (el radio) por debajo del borde y acaba 14px antes del final: asi no queda blanco bajo las curvas, donde asomaba como halo alrededor de la cabecera morada de Whop, pero tapa cualquier hueco mientras el iframe crece. */

/* Los temas (Astra) estilizan todos los <button>: se fijan padding, radio y sombra a propósito. */
.ccxwm .ccxwm-x{all:unset;box-sizing:border-box!important;display:flex!important;align-items:center!important;justify-content:center!important;flex:none;width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important;padding:0!important;margin:0!important;border:0!important;border-radius:50%!important;background:#fff!important;color:#222!important;box-shadow:0 2px 10px rgba(0,0,0,.25)!important;text-shadow:none!important;line-height:1!important;cursor:pointer;transition:background .15s}
.ccxwm .ccxwm-x:hover{background:#ece9ff!important;color:#222!important}
.ccxwm .ccxwm-x:focus-visible{outline:2px solid #6e51ff!important;outline-offset:2px}
.ccxwm .ccxwm-x svg{display:block;pointer-events:none}

.ccxwm-msg{font:15px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#555;background:var(--ccxwm-bg);padding:40px 20px;text-align:center}
.ccxwm-dark .ccxwm-msg{background:#151515}
.ccxwm-dark .ccxwm-msg{color:#c9c6d6}
.ccxwm-msg[hidden],.ccxwm-mount[hidden]{display:none}
.ccxwm-msg a{color:#111;font-weight:600}
.ccxwm-dark .ccxwm-msg a{color:#fff}

.ccxwm-ok{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center}
.ccxwm-ok strong{display:block;font:700 20px/1.3 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#111}
.ccxwm-dark .ccxwm-ok strong{color:#fff}
.ccxwm-spin{display:block;width:26px;height:26px;border-radius:50%;border:3px solid rgba(110,81,255,.22);border-top-color:#6e51ff;animation:ccxwmSpin .8s linear infinite}
.ccxwm .ccxwm-btn{all:unset;box-sizing:border-box!important;display:inline-flex!important;align-items:center;justify-content:center;padding:10px 20px!important;border-radius:10px!important;background:#6e51ff!important;color:#fff!important;font:600 14px/1 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif!important;box-shadow:none!important;cursor:pointer}
.ccxwm .ccxwm-btn:hover{background:#5a3fe0!important}
.ccxwm .ccxwm-btn:focus-visible{outline:2px solid #6e51ff!important;outline-offset:2px}

html.ccxwm-lock,html.ccxwm-lock body{overflow:hidden!important}
/* Las páginas de ventas usan scroll con snap: se desactiva mientras el modal está abierto. */
html.ccxwm-lock{scroll-snap-type:none!important;scroll-behavior:auto!important}

@keyframes ccxwmFade{from{opacity:0}to{opacity:1}}
@keyframes ccxwmPop{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
@keyframes ccxwmSpin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.ccxwm,.ccxwm-wrap{animation:none}.ccxwm-spin{animation-duration:2.4s}}
@media (max-width:520px){.ccxwm{align-items:flex-end;padding:0}.ccxwm-wrap{max-width:none}.ccxwm .ccxwm-x{margin-right:12px!important}.ccxwm-box{border-radius:14px 14px 0 0;max-height:calc(88vh - 52px);max-height:calc(100svh - 72px - env(safe-area-inset-top,0px));box-shadow:0 -12px 40px rgba(0,0,0,.35)}.ccxwm-box{background-size:100% calc(100% - 14px)}.ccxwm-box.is-checkout{min-height:calc(88vh - 52px);min-height:calc(100svh - 72px - env(safe-area-inset-top,0px))}}