/* =====================================================
   FLUJOS PÚBLICOS - CHAMOY SPORT
   Recuperación, restablecimiento, carrito y compra final
===================================================== */

/* =====================================================
   RECUPERAR CONTRASEÑA
===================================================== */

.auth-recovery-page{
    display:grid;
    place-items:center;
    width:min(1580px,calc(100% - 40px));
    margin:0 auto;
    padding:42px 0 56px;
}

.recovery-shell{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(400px,.82fr);
    width:min(980px,100%);
    overflow:hidden;
    border:1px solid var(--theme-border);
    border-radius:22px;
    background:var(--theme-card);
    box-shadow:0 26px 70px rgba(0,0,0,.16);
}

.recovery-showcase{
    position:relative;
    display:flex;
    flex-direction:column;
    min-height:560px;
    padding:36px;
    overflow:hidden;
    color:#fff;
    background:
        radial-gradient(circle at 82% 18%,rgba(167,139,250,.34),transparent 18rem),
        linear-gradient(145deg,#24104f 0%,#321273 50%,#1c123f 100%);
}

.recovery-showcase-brand,
.recovery-showcase-copy,
.recovery-steps,
.recovery-showcase-note{
    position:relative;
    z-index:1;
}

.recovery-showcase-brand{
    display:flex;
    align-items:center;
    gap:11px;
}

.recovery-showcase-brand>span{
    display:grid;
    place-items:center;
    width:44px;
    height:44px;
    border-radius:12px;
    background:rgba(255,255,255,.10);
    font-weight:900;
}

.recovery-showcase-brand div{
    display:grid;
    gap:2px;
}

.recovery-showcase-brand small{
    color:rgba(255,255,255,.62);
    font-size:.7rem;
}

.recovery-showcase-copy{
    margin-top:64px;
}

.recovery-showcase-copy .eyebrow{
    color:#67e8f9;
}

.recovery-showcase-copy h2{
    margin:5px 0 14px;
    color:#fff;
    font-size:clamp(2rem,3vw,2.8rem);
    line-height:1.04;
}

.recovery-showcase-copy>p:last-child{
    margin:0;
    color:rgba(255,255,255,.70);
    line-height:1.65;
}

.recovery-steps{
    display:grid;
    gap:10px;
    margin-top:28px;
}

.recovery-steps>div{
    display:grid;
    grid-template-columns:34px minmax(0,1fr);
    gap:10px;
    align-items:center;
    padding:9px;
    border:1px solid rgba(255,255,255,.08);
    border-radius:10px;
    background:rgba(255,255,255,.045);
}

.recovery-steps span{
    display:grid;
    place-items:center;
    width:34px;
    height:34px;
    border-radius:9px;
    color:#ddd6fe;
    background:rgba(255,255,255,.08);
    font-size:.74rem;
    font-weight:900;
}

.recovery-steps p{
    margin:0;
    color:rgba(255,255,255,.72);
    font-size:.76rem;
}

.recovery-showcase-note{
    display:flex;
    align-items:center;
    gap:7px;
    margin-top:auto;
    color:rgba(255,255,255,.62);
    font-size:.72rem;
}

.recovery-showcase-note svg{
    width:16px;
    height:16px;
    color:#fde68a;
}

.recovery-panel{
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:40px;
    background:var(--theme-card);
}

.recovery-panel-icon{
    display:grid;
    place-items:center;
    width:50px;
    height:50px;
    margin-bottom:15px;
    border-radius:14px;
    color:#c4b5fd;
    background:rgba(124,58,237,.12);
}

.recovery-panel-icon svg{
    width:23px;
    height:23px;
}

.recovery-panel-heading h1{
    margin:4px 0 8px;
    color:var(--theme-text);
    font-size:2.25rem;
    line-height:1.05;
}

.recovery-panel-heading>p:last-child{
    margin:0;
    color:var(--theme-text-soft);
    font-size:.84rem;
    line-height:1.55;
}

.recovery-form{
    display:grid;
    gap:15px;
    margin-top:22px;
}

.recovery-field{
    display:grid;
    gap:7px;
}

.recovery-field>span{
    color:var(--theme-text);
    font-size:.84rem;
    font-weight:800;
}

.recovery-input-wrap{
    position:relative;
}

.recovery-input-wrap svg{
    position:absolute;
    top:50%;
    left:13px;
    width:17px;
    height:17px;
    transform:translateY(-50%);
    color:#a78bfa;
}

.recovery-input-wrap input{
    width:100%;
    min-height:50px;
    padding:10px 13px 10px 42px;
    border:1px solid var(--theme-border);
    border-radius:11px;
    outline:0;
    color:var(--theme-text);
    background:var(--theme-input);
}

.recovery-input-wrap input:focus{
    border-color:rgba(139,92,246,.70);
    box-shadow:0 0 0 3px rgba(139,92,246,.12);
}

.recovery-submit{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    min-height:48px;
}

.recovery-submit svg{
    width:16px;
    height:16px;
}

.recovery-local-link{
    display:grid;
    gap:8px;
    margin-top:18px;
    padding:13px;
    border:1px solid rgba(34,197,94,.24);
    border-radius:11px;
    background:rgba(34,197,94,.06);
}

.recovery-local-link>div{
    display:flex;
    align-items:center;
    gap:7px;
    color:#86efac;
}

.recovery-local-link>div svg{
    width:17px;
    height:17px;
}

.recovery-local-link p{
    margin:0;
    color:var(--theme-text-soft);
    font-size:.75rem;
    line-height:1.5;
}

.recovery-local-link .button{
    display:inline-flex;
    gap:7px;
}

.recovery-back{
    margin-top:20px;
    text-align:center;
}

.recovery-back a{
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#a78bfa;
    font-size:.76rem;
    font-weight:800;
}

.recovery-back svg{
    width:15px;
    height:15px;
}

/* =====================================================
   RESTABLECER CONTRASEÑA
===================================================== */

.auth-reset-page{
    display:grid;
    place-items:center;
    width:min(1580px,calc(100% - 40px));
    margin:0 auto;
    padding:42px 0 56px;
}

.reset-password-card{
    width:min(540px,100%);
    padding:34px;
    border:1px solid var(--theme-border);
    border-radius:20px;
    background:
        radial-gradient(circle at 88% 8%,rgba(139,92,246,.10),transparent 16rem),
        var(--theme-card);
    box-shadow:0 24px 60px rgba(0,0,0,.14);
}

.reset-password-icon{
    display:grid;
    place-items:center;
    width:56px;
    height:56px;
    margin-bottom:16px;
    border-radius:15px;
    color:#c4b5fd;
    background:rgba(124,58,237,.12);
}

.reset-password-icon svg{
    width:25px;
    height:25px;
}

.reset-password-heading h1{
    margin:4px 0 8px;
    color:var(--theme-text);
    font-size:2rem;
    line-height:1.08;
}

.reset-password-heading>p:last-child{
    margin:0;
    color:var(--theme-text-soft);
    font-size:.84rem;
    line-height:1.55;
}

.reset-password-errors{
    display:grid;
    gap:5px;
    margin:18px 0 0;
    padding:13px;
    border:1px solid rgba(239,68,68,.28);
    border-radius:11px;
    background:rgba(239,68,68,.07);
}

.reset-password-errors>div{
    display:flex;
    align-items:center;
    gap:7px;
    color:#fca5a5;
}

.reset-password-errors svg{
    width:17px;
    height:17px;
}

.reset-password-errors p{
    margin:0;
    color:var(--theme-text-soft);
    font-size:.76rem;
}

.reset-password-form{
    display:grid;
    gap:15px;
    margin-top:22px;
}

.reset-password-field{
    display:grid;
    gap:7px;
}

.reset-password-field>span{
    color:var(--theme-text);
    font-size:.83rem;
    font-weight:800;
}

.reset-password-input-wrap{
    position:relative;
}

.reset-password-input-wrap>svg{
    position:absolute;
    top:50%;
    left:13px;
    width:17px;
    height:17px;
    transform:translateY(-50%);
    color:#a78bfa;
}

.reset-password-input-wrap input{
    width:100%;
    min-height:50px;
    padding:10px 44px 10px 42px;
    border:1px solid var(--theme-border);
    border-radius:11px;
    outline:0;
    color:var(--theme-text);
    background:var(--theme-input);
}

.reset-password-input-wrap input:focus{
    border-color:rgba(139,92,246,.70);
    box-shadow:0 0 0 3px rgba(139,92,246,.12);
}

.reset-password-eye{
    position:absolute;
    top:50%;
    right:8px;
    display:grid;
    place-items:center;
    width:34px;
    height:34px;
    padding:0;
    transform:translateY(-50%);
    border:0;
    border-radius:8px;
    color:var(--theme-text-soft);
    background:transparent;
}

.reset-password-eye:hover{
    color:#a78bfa;
    background:var(--theme-hover);
}

.reset-password-eye svg{
    width:17px;
    height:17px;
}

.reset-password-requirements{
    display:flex;
    flex-wrap:wrap;
    gap:8px 13px;
    padding:11px 12px;
    border:1px solid var(--theme-border);
    border-radius:10px;
    background:var(--theme-card-soft);
}

.reset-password-requirements span{
    display:inline-flex;
    align-items:center;
    gap:5px;
    color:var(--theme-text-soft);
    font-size:.7rem;
}

.reset-password-requirements svg{
    width:13px;
    height:13px;
    color:#a78bfa;
}

.reset-password-submit{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    min-height:48px;
}

.reset-password-back{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    margin-top:18px;
    color:#a78bfa;
    font-size:.75rem;
    font-weight:800;
}

.reset-password-back svg{
    width:15px;
    height:15px;
}

/* =====================================================
   CARRITO
===================================================== */

.cart-page-modern{
    width:min(1580px,calc(100% - 40px));
    margin:0 auto;
    padding:32px 0 54px;
}

.cart-modern-header{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:20px;
    margin-bottom:20px;
}

.cart-modern-header h1{
    margin:0;
    color:var(--theme-text);
    font-size:clamp(2.2rem,4vw,3.4rem);
}

.cart-modern-header>div>p:last-child{
    margin:6px 0 0;
    color:var(--theme-text-soft);
}

.cart-count-pill{
    display:inline-flex;
    align-items:center;
    gap:7px;
    min-height:38px;
    padding:0 12px;
    border:1px solid var(--theme-border);
    border-radius:999px;
    color:#c4b5fd;
    background:rgba(124,58,237,.10);
    font-size:.78rem;
    font-weight:900;
}

.cart-count-pill svg{
    width:16px;
    height:16px;
}

.cart-modern-layout{
    display:grid;
    grid-template-columns:minmax(0,1.5fr) minmax(320px,.55fr);
    gap:18px;
    align-items:start;
}

.cart-modern-items,
.cart-modern-summary,
.cart-empty-modern{
    border:1px solid var(--theme-border);
    border-radius:16px;
    background:var(--theme-card);
    box-shadow:var(--theme-shadow);
}

.cart-modern-items{
    padding:20px;
}

.cart-section-heading{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:16px;
    margin-bottom:14px;
}

.cart-section-heading h2{
    margin:0;
    color:var(--theme-text);
    font-size:1.3rem;
}

.cart-section-heading>span{
    color:var(--theme-text-muted);
    font-size:.75rem;
}

.cart-items-list{
    display:grid;
    gap:10px;
}

.cart-product-card{
    display:grid;
    grid-template-columns:112px minmax(0,1fr) auto 38px;
    gap:14px;
    align-items:center;
    padding:12px;
    border:1px solid var(--theme-border);
    border-radius:12px;
    background:var(--theme-card-soft);
}

.cart-product-image{
    display:grid;
    place-items:center;
    width:112px;
    height:88px;
    overflow:hidden;
    border:1px solid var(--theme-border);
    border-radius:10px;
    background:var(--theme-bg-soft);
}

.cart-product-image img{
    width:100%;
    height:100%;
    padding:5px;
    object-fit:contain;
}

.cart-product-info{
    min-width:0;
}

.cart-product-info small{
    display:block;
    margin-bottom:4px;
    color:#a78bfa;
    font-size:.69rem;
    font-weight:900;
    text-transform:uppercase;
}

.cart-product-info h3{
    margin:0;
    overflow:hidden;
    color:var(--theme-text);
    font-size:.94rem;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.cart-product-info>span{
    display:inline-flex;
    align-items:center;
    gap:5px;
    margin-top:7px;
    color:var(--theme-text-soft);
    font-size:.7rem;
}

.cart-product-info>span svg{
    width:14px;
    height:14px;
}

.cart-product-price{
    color:var(--theme-text);
    font-size:1rem;
    white-space:nowrap;
}

.cart-remove-button{
    display:grid;
    place-items:center;
    width:38px;
    height:38px;
    padding:0;
    border:1px solid var(--theme-border);
    border-radius:10px;
    color:#fca5a5;
    background:transparent;
    cursor:pointer;
}

.cart-remove-button:hover{
    color:#fff;
    border-color:#dc2626;
    background:#dc2626;
}

.cart-remove-button svg{
    width:16px;
    height:16px;
}

.cart-continue-shopping{
    margin-top:14px;
}

.cart-continue-shopping a{
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#a78bfa;
    font-size:.76rem;
    font-weight:800;
}

.cart-continue-shopping svg{
    width:15px;
    height:15px;
}

/* RESUMEN */
.cart-modern-summary{
    position:sticky;
    top:96px;
    padding:20px;
}

.cart-summary-heading h2{
    margin:0;
    color:var(--theme-text);
    font-size:1.25rem;
}

.cart-coupon-form{
    display:grid;
    gap:7px;
    margin-top:18px;
}

.cart-coupon-form label{
    color:var(--theme-text);
    font-size:.8rem;
    font-weight:800;
}

.cart-coupon-form>div{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:8px;
}

.cart-coupon-form input{
    min-width:0;
    min-height:42px;
    padding:9px 11px;
    border:1px solid var(--theme-border);
    border-radius:9px;
    outline:0;
    color:var(--theme-text);
    background:var(--theme-input);
}

.cart-coupon-form input:focus{
    border-color:rgba(139,92,246,.65);
    box-shadow:0 0 0 3px rgba(139,92,246,.12);
}

.cart-coupon-message{
    display:flex;
    align-items:center;
    gap:6px;
    margin-top:10px;
    padding:9px 10px;
    border-radius:9px;
    font-size:.72rem;
}

.cart-coupon-message svg{
    width:15px;
    height:15px;
}

.cart-coupon-message.is-error{
    color:#fca5a5;
    background:rgba(239,68,68,.08);
}

.cart-coupon-message.is-success{
    color:#86efac;
    background:rgba(34,197,94,.08);
}

.cart-summary-lines{
    display:grid;
    gap:11px;
    margin-top:20px;
}

.cart-summary-lines>div{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.cart-summary-lines span{
    color:var(--theme-text-soft);
    font-size:.8rem;
}

.cart-summary-lines strong{
    color:var(--theme-text);
    font-size:.84rem;
}

.cart-discount{
    color:#86efac !important;
}

.cart-summary-total{
    margin-top:3px;
    padding-top:14px;
    border-top:1px solid var(--theme-border);
}

.cart-summary-total span{
    color:var(--theme-text);
    font-weight:900;
}

.cart-summary-total strong{
    font-size:1.35rem;
}

.cart-checkout-button{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    width:100%;
    min-height:48px;
    margin-top:18px;
}

.cart-checkout-button svg{
    width:16px;
    height:16px;
}

.cart-summary-security{
    display:grid;
    gap:7px;
    margin-top:14px;
}

.cart-summary-security span{
    display:flex;
    align-items:center;
    gap:6px;
    color:var(--theme-text-muted);
    font-size:.7rem;
}

.cart-summary-security svg{
    width:14px;
    height:14px;
    color:#a78bfa;
}

/* VACÍO */
.cart-empty-modern{
    display:grid;
    place-items:center;
    min-height:390px;
    padding:30px;
    text-align:center;
}

.cart-empty-modern>span{
    display:grid;
    place-items:center;
    width:68px;
    height:68px;
    margin-bottom:13px;
    border-radius:19px;
    color:#c4b5fd;
    background:rgba(124,58,237,.12);
}

.cart-empty-modern>span svg{
    width:30px;
    height:30px;
}

.cart-empty-modern h2{
    margin:0;
    color:var(--theme-text);
}

.cart-empty-modern p{
    margin:7px 0 18px;
    color:var(--theme-text-soft);
}

/* =====================================================
   COMPRA EXITOSA
===================================================== */

.purchase-result-page{
    display:grid;
    place-items:center;
    width:min(1580px,calc(100% - 40px));
    margin:0 auto;
    padding:48px 0 60px;
}

.purchase-result-card{
    width:min(720px,100%);
    padding:38px;
    border:1px solid var(--theme-border);
    border-radius:20px;
    text-align:center;
    background:
        radial-gradient(circle at 50% 0%,rgba(139,92,246,.10),transparent 20rem),
        var(--theme-card);
    box-shadow:0 24px 60px rgba(0,0,0,.14);
}

.purchase-result-icon{
    display:grid;
    place-items:center;
    width:72px;
    height:72px;
    margin:0 auto 16px;
    border-radius:20px;
    color:#86efac;
    background:rgba(34,197,94,.10);
}

.purchase-result-card.is-pending .purchase-result-icon{
    color:#fde68a;
    background:rgba(245,158,11,.10);
}

.purchase-result-card.is-cancelled .purchase-result-icon{
    color:#fca5a5;
    background:rgba(239,68,68,.10);
}

.purchase-result-card.is-missing .purchase-result-icon{
    color:#c4b5fd;
    background:rgba(124,58,237,.10);
}

.purchase-result-icon svg{
    width:32px;
    height:32px;
}

.purchase-result-card h1{
    margin:4px 0 9px;
    color:var(--theme-text);
    font-size:clamp(2rem,4vw,3rem);
}

.purchase-result-message{
    max-width:560px;
    margin:0 auto;
    color:var(--theme-text-soft);
    line-height:1.6;
}

.purchase-result-summary{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:24px;
}

.purchase-result-summary>div{
    padding:13px;
    border:1px solid var(--theme-border);
    border-radius:11px;
    background:var(--theme-card-soft);
}

.purchase-result-summary span,
.purchase-result-summary strong{
    display:block;
}

.purchase-result-summary span{
    color:var(--theme-text-soft);
    font-size:.68rem;
    text-transform:uppercase;
}

.purchase-result-summary strong{
    margin-top:4px;
    color:var(--theme-text);
    font-size:.9rem;
}

.purchase-result-actions{
    display:flex;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
    gap:9px;
    margin-top:24px;
}

.purchase-result-actions .button{
    display:inline-flex;
    gap:7px;
}

.purchase-result-actions svg{
    width:16px;
    height:16px;
}

.purchase-result-help{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    margin-top:18px;
    color:var(--theme-text-muted);
    font-size:.72rem;
}

.purchase-result-help svg{
    width:15px;
    height:15px;
    color:#a78bfa;
}

/* =====================================================
   LIGHT
===================================================== */

html[data-theme="light"] .recovery-shell,
html[data-theme="light"] .reset-password-card,
html[data-theme="light"] .cart-modern-items,
html[data-theme="light"] .cart-modern-summary,
html[data-theme="light"] .cart-empty-modern,
html[data-theme="light"] .purchase-result-card{
    box-shadow:0 18px 48px rgba(15,23,42,.08);
}

html[data-theme="light"] .recovery-panel{
    background:#fff;
}

html[data-theme="light"] .recovery-panel-icon,
html[data-theme="light"] .reset-password-icon,
html[data-theme="light"] .cart-empty-modern>span{
    color:#5b21b6;
    background:#f3f0ff;
}

html[data-theme="light"] .cart-product-card,
html[data-theme="light"] .purchase-result-summary>div{
    background:#fff;
}

/* =====================================================
   RESPONSIVE
===================================================== */

@media(max-width:980px){
    .recovery-shell{
        grid-template-columns:1fr;
        width:min(620px,100%);
    }

    .recovery-showcase{
        min-height:auto;
        padding:28px;
    }

    .recovery-showcase-copy{
        margin-top:30px;
    }

    .cart-modern-layout{
        grid-template-columns:1fr;
    }

    .cart-modern-summary{
        position:static;
    }
}

@media(max-width:760px){
    .recovery-showcase{
        display:none;
    }

    .cart-modern-header{
        align-items:flex-start;
        flex-direction:column;
    }

    .cart-product-card{
        grid-template-columns:92px minmax(0,1fr) 38px;
    }

    .cart-product-image{
        width:92px;
        height:74px;
    }

    .cart-product-price{
        grid-column:2;
    }

    .cart-remove-form{
        grid-column:3;
        grid-row:1 / span 2;
    }

    .purchase-result-summary{
        grid-template-columns:1fr;
    }
}

@media(max-width:560px){
    .auth-recovery-page,
    .auth-reset-page,
    .cart-page-modern,
    .purchase-result-page{
        width:min(100% - 20px,1580px);
    }

    .recovery-panel,
    .reset-password-card,
    .purchase-result-card{
        padding:24px;
    }

    .cart-modern-items,
    .cart-modern-summary{
        padding:18px;
    }

    .cart-product-card{
        grid-template-columns:78px minmax(0,1fr) 36px;
        gap:10px;
        padding:10px;
    }

    .cart-product-image{
        width:78px;
        height:66px;
    }

    .cart-product-info h3{
        white-space:normal;
    }

    .cart-coupon-form>div{
        grid-template-columns:1fr;
    }

    .purchase-result-actions{
        display:grid;
        grid-template-columns:1fr;
    }

    .purchase-result-actions .button{
        width:100%;
    }
}