/* ============================================================
   Checkout · Recupera tu semana
   Usa los mismos tokens de color y tipografía de la landing.
   ============================================================ */

.co-ov{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(35,58,54,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;transition:opacity .2s ease}
.co-ov.on{opacity:1}
.co-ov[hidden]{display:none}

.co-box{position:relative;width:100%;max-width:520px;max-height:calc(100vh - 48px);overflow:auto;-webkit-overflow-scrolling:touch;background:#fff;border-radius:26px;box-shadow:0 30px 80px rgba(35,58,54,.35);padding:34px 34px 28px;color:var(--pino);transform:translateY(12px);transition:transform .25s ease}
.co-ov.on .co-box{transform:none}

.co-x{position:absolute;top:14px;right:14px;width:40px;height:40px;border:0;border-radius:50%;background:var(--salvia-soft);color:var(--pino);font-size:1.5rem;line-height:1;cursor:pointer;display:grid;place-items:center}
.co-x:hover{background:var(--salvia)}
.co-x:focus-visible{outline:3px solid var(--rosa);outline-offset:2px}

.co-tag{display:inline-flex;align-items:center;gap:8px;background:var(--frambuesa);color:#fff;font-size:.7rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:7px 12px;border-radius:8px}
.co-box h2{font-family:var(--serif);font-weight:700;font-size:2rem;line-height:1.1;letter-spacing:-.015em;margin:14px 0 4px;color:var(--pino)}
.co-date{font-size:.9rem;font-weight:600;color:var(--frambuesa);margin:0}

.co-price{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 10px;margin:18px 0 22px;padding:14px 18px;background:var(--salvia-soft);border-radius:16px}
.co-price b{font-family:var(--serif);font-size:2.2rem;line-height:1;color:var(--pino)}
.co-price .co-cur{font-weight:700;font-size:.95rem}
.co-price small{flex-basis:100%;font-size:.82rem;font-weight:500;color:#4E625E}

.co-f{display:grid;gap:14px}
.co-l{display:grid;gap:6px;font-size:.86rem;font-weight:600}
.co-l input{width:100%;font:500 16px/1.3 var(--sans);color:var(--pino);background:#fff;border:1.5px solid #DCD3DE;border-radius:12px;padding:14px 16px;transition:border-color .15s,box-shadow .15s}
.co-l input::placeholder{color:#9AA7A4}
.co-l input:focus{outline:0;border-color:var(--frambuesa);box-shadow:0 0 0 4px rgba(224,136,183,.22)}
.co-l input[aria-invalid="true"]{border-color:#C0392B}
.co-fe{font-size:.8rem;font-weight:600;color:#B03A2E;min-height:0}
.co-fe:empty{display:none}

.co-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}

.co-m{border:0;margin:6px 0 0;padding:0;display:grid;gap:8px}
.co-m legend{font-size:.86rem;font-weight:600;margin-bottom:8px;padding:0}
.co-opts{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:8px}
.co-opt{position:relative;display:flex;align-items:center;justify-content:center;text-align:center;min-height:52px;padding:10px 12px;border:1.5px solid #DCD3DE;border-radius:12px;font-size:.9rem;font-weight:700;cursor:pointer;transition:border-color .15s,background .15s}
.co-opt input{position:absolute;opacity:0;pointer-events:none}
.co-opt:hover{border-color:var(--malva)}
.co-opt.on{border-color:var(--frambuesa);background:#FBEFF5;color:var(--frambuesa-dk)}
.co-opt:focus-within{outline:3px solid var(--rosa);outline-offset:2px}

.co-card{min-height:0}
.co-card[hidden]{display:none}
.co-load{font-size:.85rem;color:#5B6E6A;padding:8px 0}
.co-note{font-size:.84rem;line-height:1.5;color:#4E625E;margin:0}
.co-note:empty{display:none}

.co-chk{display:flex;gap:10px;align-items:flex-start;font-size:.86rem;line-height:1.45;cursor:pointer}
.co-chk input{flex:none;width:20px;height:20px;margin-top:1px;accent-color:var(--frambuesa)}
.co-chk a{color:var(--frambuesa);font-weight:600}

.co-err{background:#FDECEA;color:#8E2A20;border-radius:12px;padding:12px 14px;font-size:.88rem;font-weight:600;margin:0}
.co-err:empty{display:none}

.co-pay{margin-top:4px;padding:18px 24px;font-size:1.02rem}
.co-pay[disabled]{opacity:.7;cursor:progress;transform:none}
.co-pay .co-spin{width:18px;height:18px;border:2.5px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%;animation:co-s .8s linear infinite;display:none}
.co-pay.busy .co-spin{display:inline-block}
@keyframes co-s{to{transform:rotate(360deg)}}

.co-secure{display:flex;align-items:center;justify-content:center;gap:8px;font-size:.78rem;color:#5B6E6A;text-align:center;margin:2px 0 0}
.co-secure svg{width:14px;height:14px;flex:none}
.co-region{justify-self:center;background:none;border:0;color:var(--frambuesa);font:600 .86rem var(--sans);text-decoration:underline;cursor:pointer;padding:6px}
.co-region:focus-visible{outline:3px solid var(--rosa);outline-offset:2px;border-radius:6px}

html.co-lock,html.co-lock body{overflow:hidden}

footer .legal a{color:rgba(255,249,237,.85);text-underline-offset:3px}

@media (max-width:640px){
  .co-ov{align-items:flex-end;padding:0}
  .co-box{max-width:none;max-height:94vh;border-radius:24px 24px 0 0;padding:28px 20px calc(22px + env(safe-area-inset-bottom,0px));transform:translateY(40px)}
  .co-box h2{font-size:1.7rem;padding-right:40px}
  .co-opt{min-height:48px;padding:8px 6px;font-size:.8rem}
}
@media (prefers-reduced-motion:reduce){
  .co-ov,.co-box{transition:none}
  .co-pay .co-spin{animation:none}
}
