/* Popup "Spin & Win" (estilo AliExpress/Temu): la ruleta de /landing embebida. */
/* Reset ANTES de las reglas propias: el tema da a todo <button> padding, min-width y line-height 2.4em. */
.cco-spin-overlay .cco-spin-close, .cco-spin-tab { all:unset; box-sizing:border-box; }
.cco-spin-tab { position:fixed; box-sizing:border-box; left:0; bottom:110px; z-index:9990; display:flex; align-items:center; gap:10px; padding:12px 16px 12px 12px; border-radius:0 999px 999px 0; background:linear-gradient(135deg,#1a3050,#0A1626); color:#EED7A8; border:1px solid rgba(238,215,168,.45); border-left:0; box-shadow:0 12px 30px rgba(0,0,0,.35); font:600 12px/1 'Jost',sans-serif; letter-spacing:.14em; text-transform:uppercase; cursor:pointer; transform:translateX(-110%); transition:transform .5s cubic-bezier(.22,1,.36,1), box-shadow .3s; }
.cco-spin-tab.show { transform:translateX(0); }
.cco-spin-tab:hover { box-shadow:0 14px 34px rgba(184,153,104,.35); }
.cco-spin-tab svg { width:34px; height:34px; animation: cco-spin-rot 9s linear infinite; }
@keyframes cco-spin-rot { to { transform: rotate(360deg); } }
.cco-spin-overlay { position:fixed; inset:0; z-index:99999; background:rgba(4,10,20,.72); backdrop-filter:blur(4px); display:flex; align-items:center; justify-content:center; padding:18px; opacity:0; pointer-events:none; transition:opacity .3s; }
.cco-spin-overlay.open { opacity:1; pointer-events:auto; }
.cco-spin-card { position:relative; width:min(520px, 100%); background:#0A1626; border-radius:18px; overflow:hidden; box-shadow:0 30px 80px rgba(0,0,0,.6), 0 0 0 1px rgba(238,215,168,.35); transform:translateY(24px) scale(.97); transition:transform .45s cubic-bezier(.22,1,.36,1); }
.cco-spin-overlay.open .cco-spin-card { transform:none; }
.cco-spin-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 16px 12px 20px; background:linear-gradient(135deg,#EED7A8,#B89968 60%,#93721b); color:#0A1626; }
.cco-spin-head strong { font:700 13px/1.2 'Jost',sans-serif; letter-spacing:.16em; text-transform:uppercase; }
.cco-spin-head small { display:block; font:500 11px/1.3 'Jost',sans-serif; letter-spacing:.04em; opacity:.85; margin-top:3px; text-transform:none; }
/* `all:unset` primero: el tema (Flatsome) da a todo <button> padding, min-width,
   line-height 2.4em y mayúsculas, y la × salía como un cuadrado enorme. */
.cco-spin-overlay .cco-spin-close { flex:none; width:36px; height:36px; min-width:0; margin:0; padding:0; border-radius:50% !important; border:1px solid rgba(10,22,38,.35); background:rgba(255,255,255,.4); color:#0A1626; font:400 22px/1 Arial,sans-serif; cursor:pointer; display:flex; align-items:center; justify-content:center; text-transform:none; letter-spacing:0; transition:background .2s, transform .2s; }
.cco-spin-overlay .cco-spin-close:hover, .cco-spin-overlay .cco-spin-close:focus-visible { background:#fff; transform:rotate(90deg); outline:2px solid #0A1626; outline-offset:2px; }
@media (max-width:560px){ .cco-spin-overlay .cco-spin-close { width:40px; height:40px; font-size:24px; } }
.cco-spin-frame { display:block; width:100%; height:min(680px, calc(100vh - 120px)); border:0; background:#0A1626; }
.cco-spin-foot { padding:8px 16px 10px; text-align:center; font:500 10.5px/1.4 'Jost',sans-serif; letter-spacing:.06em; color:rgba(245,239,227,.5); }
@media (max-width:560px){
  /* Hoja a pantalla completa: la rueda necesita todo el alto del móvil. 100dvh
     descuenta la barra del navegador (Safari/Chrome) para que el botón no quede debajo. */
  .cco-spin-overlay { padding:0; align-items:stretch; }
  .cco-spin-card { width:100%; height:100vh; height:100dvh; border-radius:0; display:flex; flex-direction:column; }
  .cco-spin-head { padding:10px 12px 9px 16px; }
  .cco-spin-head strong { font-size:12px; }
  .cco-spin-head small { font-size:10.5px; margin-top:2px; }
  .cco-spin-frame { flex:1; height:auto; min-height:0; }
  .cco-spin-foot { display:none; }
  .cco-spin-tab { bottom:86px; padding:10px 12px 10px 10px; font-size:11px; }
}
/* El chat (z-index 2147483000) se tapaba el botón de girar en el móvil: se esconde mientras el popup está abierto. */
body.cco-spin-open #cco-chat, body.cco-spin-open .cco-chat { visibility:hidden !important; }