/* === WC Envíos Venezuela v1.1.0 – Frontend === */
:root {
    --wcev-bg:     #1a1a2e;
    --wcev-text:   #ffffff;
    --wcev-accent: #e94560;
    --wcev-radius: 16px;
    --wcev-shadow: 0 20px 60px rgba(0,0,0,.45);
    --wcev-dur:    .3s;
}

/* ── Logo – checkout clásico ────────────────────────────────────────────────── */
.wcev-method-logo {
    display:        inline-block;
    vertical-align: middle;
    height:         26px;
    width:          auto;
    max-width:      88px;
    object-fit:     contain;
    margin-right:   8px;
    border-radius:  3px;
}
.wcev-method-label {
    vertical-align: middle;
}

/* ── Logo – checkout de bloques (Gutenberg) ─────────────────────────────────── */
.wcev-block-logo {
    display:        inline-block;
    vertical-align: middle;
    height:         24px;
    width:          auto;
    max-width:      80px;
    object-fit:     contain;
    margin-right:   7px;
    border-radius:  3px;
    flex-shrink:    0;
}

/* Alinear label en bloques para que el logo quede al inicio */
.wc-block-components-radio-control__option label {
    display:     flex !important;
    align-items: center !important;
    flex-wrap:   wrap;
}

/* ── Texto "Cobro a destino" que reemplaza "Gratis" ────────────────────────── */
.wcev-cobro-tag {
    display:          inline-block;
    font-size:        .75rem;
    font-weight:      700;
    color:            #c0392b;
    background:       rgba(192,57,43,.1);
    border:           1px solid rgba(192,57,43,.3);
    border-radius:    4px;
    padding:          1px 6px;
    white-space:      nowrap;
    vertical-align:   middle;
}

/* ── Overlay popup – OCULTO por defecto, JS lo muestra ─────────────────────── */
.wcev-popup-overlay {
    display:         none;        /* ← JS hace display:flex */
    position:        fixed;
    inset:           0;
    z-index:         99999;
    align-items:     center;
    justify-content: center;
    background:      rgba(0,0,0,.6);
    padding:         16px;
    animation:       wcev-fade-in var(--wcev-dur) ease both;
}
.wcev-popup-overlay.wcev-visible {
    display: flex;
}
.wcev-popup-overlay.wcev-hiding {
    animation: wcev-fade-out var(--wcev-dur) ease both;
    pointer-events: none;
}

/* ── Posiciones alternativas ─────────────────────────────────────────────────── */
.wcev-pos-bottom-left,
.wcev-pos-bottom-right {
    background:      transparent;
    align-items:     flex-end;
    pointer-events:  none;
}
.wcev-pos-bottom-left  { justify-content: flex-start; }
.wcev-pos-bottom-right { justify-content: flex-end; }

.wcev-pos-bottom-left .wcev-popup-box,
.wcev-pos-bottom-right .wcev-popup-box {
    pointer-events: all;
    max-width:      340px;
    margin:         0 16px 16px;
}

.wcev-pos-top-bar {
    inset:           0 0 auto 0;
    background:      transparent;
    padding:         0;
}
.wcev-pos-top-bar .wcev-popup-box {
    width:           100%;
    border-radius:   0;
    flex-direction:  row;
    flex-wrap:       wrap;
    justify-content: center;
    padding:         12px 20px;
    gap:             12px;
}
.wcev-pos-top-bar .wcev-popup-close {
    position: relative;
    top: auto; right: auto;
    transform: none;
}
.wcev-pos-top-bar .wcev-popup-message { font-size: 1rem; }
.wcev-pos-top-bar .wcev-popup-cta     { padding: 7px 20px; font-size: .85rem; }

/* ── Caja del popup ──────────────────────────────────────────────────────────── */
.wcev-popup-box {
    position:        relative;
    background:      var(--wcev-bg);
    color:           var(--wcev-text);
    border-radius:   var(--wcev-radius);
    box-shadow:      var(--wcev-shadow);
    padding:         36px 28px 28px;
    max-width:       460px;
    width:           100%;
    display:         flex;
    flex-direction:  column;
    align-items:     center;
    text-align:      center;
    gap:             12px;
    animation:       wcev-slide-up var(--wcev-dur) ease both;
}

/* ── Botón cerrar ────────────────────────────────────────────────────────────── */
.wcev-popup-close {
    position:    absolute;
    top:         12px;
    right:       12px;
    background:  transparent;
    border:      none;
    cursor:      pointer;
    color:       var(--wcev-text);
    opacity:     .65;
    padding:     4px;
    line-height: 1;
    transition:  opacity .2s;
}
.wcev-popup-close:hover { opacity: 1; }

/* ── Icono ───────────────────────────────────────────────────────────────────── */
.wcev-popup-icon {
    font-size:   2.8rem;
    line-height: 1;
}

/* ── Textos ──────────────────────────────────────────────────────────────────── */
.wcev-popup-message {
    font-size:   1.15rem;
    font-weight: 700;
    line-height: 1.4;
    margin:      0;
    color:       var(--wcev-text);
}
.wcev-popup-subtitle {
    font-size:  .88rem;
    opacity:    .78;
    margin:     0;
    color:      var(--wcev-text);
}

/* ── Cuenta regresiva ────────────────────────────────────────────────────────── */
.wcev-countdown {
    display:         flex;
    align-items:     center;
    gap:             6px;
    font-size:       .82rem;
    opacity:         .85;
}
.wcev-countdown-timer {
    font-weight:          700;
    color:                var(--wcev-accent);
    font-variant-numeric: tabular-nums;
    letter-spacing:       .5px;
}

/* ── Botón CTA ───────────────────────────────────────────────────────────────── */
.wcev-popup-cta {
    background:    var(--wcev-accent);
    color:         #fff;
    border:        none;
    border-radius: 50px;
    padding:       11px 30px;
    font-size:     .95rem;
    font-weight:   700;
    cursor:        pointer;
    transition:    transform .2s, box-shadow .2s, opacity .2s;
    box-shadow:    0 4px 14px rgba(0,0,0,.25);
    letter-spacing: .3px;
}
.wcev-popup-cta:hover  { transform: translateY(-2px); box-shadow: 0 7px 22px rgba(0,0,0,.3); }
.wcev-popup-cta:active { transform: translateY(0); }

/* ── Animaciones ─────────────────────────────────────────────────────────────── */
@keyframes wcev-fade-in  { from { opacity:0 } to { opacity:1 } }
@keyframes wcev-fade-out { from { opacity:1 } to { opacity:0 } }
@keyframes wcev-slide-up {
    from { opacity:0; transform: translateY(20px) scale(.97); }
    to   { opacity:1; transform: translateY(0) scale(1); }
}

/* ── Responsive ──────────────────────────────────────────────────────────────── */
@media (max-width: 480px) {
    .wcev-popup-box      { padding: 28px 18px 22px; }
    .wcev-popup-message  { font-size: 1.02rem; }
    .wcev-popup-cta      { width: 100%; }

    .wcev-pos-bottom-left .wcev-popup-box,
    .wcev-pos-bottom-right .wcev-popup-box {
        max-width:     100%;
        margin:        0;
        border-radius: var(--wcev-radius) var(--wcev-radius) 0 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .wcev-popup-overlay, .wcev-popup-box { animation: none; }
}