/* =====================================================
   Carrusel de Productos v3 – Frontend CSS
   ===================================================== */

.pc-carousel{
    --pc-primary:#e62c2c;
    --pc-btn-text:#fff;
    --pc-arrow:40px;
    --pc-title:24px;
    --pc-radius:16px;
    --pc-img-h:190px;
    --pc-lines:2;
    font-family:inherit;
    padding:2rem 0 1.5rem;
    box-sizing:border-box;
}

/* ---- Tabs ---- */
.pc-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:1.25rem}
.pc-tab{
    padding:var(--pc-tab-pv,8px) var(--pc-tab-ph,20px);
    border-radius:99px;
    border:1.5px solid #e0e0e0;
    background:#fff;
    font-size:var(--pc-tab-fs,13px);
    font-weight:500;
    cursor:pointer;
    color:#666;
    transition:all .2s;
    line-height:1.3;
    white-space:nowrap;
}
.pc-tab:hover,.pc-tab.active{background:var(--pc-primary);border-color:var(--pc-primary);color:#fff}

/* ---- Header ---- */
.pc-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.1rem}
.pc-title{display:flex!important;align-items:center;gap:10px;font-size:var(--pc-title)!important;font-weight:600!important;margin:0!important;line-height:1.2}
.pc-accent{display:inline-block;width:5px;height:calc(var(--pc-title)*1.1);background:var(--pc-primary);border-radius:3px;flex-shrink:0}
.pc-nav-group{display:flex;align-items:center;gap:8px}
.pc-ap-btn{display:flex;align-items:center;gap:5px;padding:6px 14px;border-radius:99px;border:1.5px solid #e0e0e0;background:#fff;font-size:12px;color:#666;cursor:pointer;transition:all .2s}
.pc-ap-btn.playing{border-color:var(--pc-primary);color:var(--pc-primary)}
/* Arrow: width/height = --pc-arrow, font-size proportional (55% of size) */
.pc-nav{
    width:var(--pc-arrow);
    height:var(--pc-arrow);
    min-width:var(--pc-arrow);
    min-height:var(--pc-arrow);
    border-radius:50%;
    border:1.5px solid #e0e0e0;
    background:#fff;
    cursor:pointer;
    font-size:calc(var(--pc-arrow) * 0.55);
    line-height:1;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#444;
    transition:all .18s;
    padding:0;
    box-sizing:border-box;
    flex-shrink:0;
}
.pc-nav:hover{border-color:var(--pc-primary);color:var(--pc-primary)}
.pc-nav:disabled{opacity:.28;cursor:default}

/* ---- Skeleton loader ---- */
.pc-skeleton{display:flex;gap:16px;padding:4px 0 20px}
@keyframes pc-shimmer{0%{background-position:-400px 0}100%{background-position:400px 0}}
.pc-skel-card{flex:1;background:#fff;border:1.5px solid #ececec;border-radius:16px;overflow:hidden}
.pc-skel-img{height:190px;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);background-size:400px 100%;animation:pc-shimmer 1.4s infinite}
.pc-skel-body{padding:14px 16px}
.pc-skel-line{height:12px;border-radius:6px;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);background-size:400px 100%;animation:pc-shimmer 1.4s infinite;margin-bottom:10px}
.pc-skel-long{width:90%}
.pc-skel-short{width:55%}
.pc-skel-price{width:40%;height:18px}
.pc-skel-btn{height:34px;border-radius:99px;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);background-size:400px 100%;animation:pc-shimmer 1.4s infinite;margin-top:4px}

/* ---- Track ---- */
.pc-overflow{overflow:hidden}
.pc-track{display:flex;gap:16px;transition:transform .4s cubic-bezier(.4,0,.2,1);align-items:stretch}

/* ---- Cards ---- */
/* overflow:visible so the translateY(-5px) hover isn't clipped by parent */
.pc-card{flex-shrink:0;background:#fff;border:1.5px solid #ececec;border-radius:var(--pc-radius);overflow:visible;transition:border-color .2s,transform .2s;display:flex;flex-direction:column}
.pc-card:hover{border-color:var(--pc-primary);transform:translateY(-5px)}

/* Image – keep overflow:hidden only on the image box */
.pc-img-wrap{
    width:100%;
    height:var(--pc-img-h);
    min-height:var(--pc-img-h);
    max-height:var(--pc-img-h);
    background:#f6f6f6;
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
    overflow:hidden;          /* clips the image scale effect */
    cursor:zoom-in;
    flex-shrink:0;
    border-radius:calc(var(--pc-radius) - 2px) calc(var(--pc-radius) - 2px) 0 0; /* match card top radius */
}
.pc-img-wrap img{max-width:85%;max-height:85%;object-fit:contain;transition:transform .3s}
.pc-img-wrap:hover img{transform:scale(1.06)}

/* Hover overlay */
.pc-overlay{position:absolute;inset:0;background:rgba(0,0,0,.42);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;opacity:0;transition:opacity .22s;pointer-events:none}
.pc-img-wrap:hover .pc-overlay{opacity:1;pointer-events:all}
.pc-ov-btn{padding:8px 18px;border-radius:99px;font-size:12px;font-weight:600;cursor:pointer;border:none;transition:all .18s;text-decoration:none;text-align:center;min-width:140px;line-height:1.3}
/* Zoom – blanco, abre lightbox */
.pc-ov-zoom{background:#fff;color:#333;border:none}
.pc-ov-zoom:hover{background:#f0f0f0}
/* Carrito – color primario */
.pc-ov-cart{background:var(--pc-primary);color:var(--pc-btn-text)}
.pc-ov-cart:hover{opacity:.88}
/* Agotado en overlay – gris bloqueado */
.pc-ov-sold{background:#aaa;color:#fff;cursor:not-allowed;pointer-events:none}

/* Badge */
.pc-badge{position:absolute;top:10px;left:10px;font-size:10px;font-weight:600;padding:4px 9px;border-radius:99px;text-transform:uppercase;z-index:2}
.pc-badge-sale{background:var(--pc-primary);color:#fff}
.pc-badge-new{background:#1a7a4a;color:#fff}

/* Stock alert */
.pc-stock-alert{position:absolute;bottom:8px;left:0;right:0;text-align:center;font-size:11px;font-weight:600;color:#fff;background:rgba(180,0,0,.75);padding:3px 6px;z-index:2}
.pc-stock-alert.sold-out{background:rgba(80,80,80,.8)}

/* Wishlist */
.pc-wish{position:absolute;top:10px;right:10px;width:30px;height:30px;min-width:30px;min-height:30px;background:#fff;border-radius:50%;border:1px solid #eee;display:flex;align-items:center;justify-content:center;font-size:15px;color:#ccc;cursor:pointer;transition:color .15s;line-height:1;padding:0;box-sizing:border-box;z-index:3}
.pc-wish:hover{color:var(--pc-primary)}

/* Card body */
.pc-card-body{padding:14px 16px 16px;display:flex;flex-direction:column;flex:1}

/* Fixed-height name */
.pc-prod-name{font-size:13px;font-weight:600;color:inherit;margin:0 0 3px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:var(--pc-lines);-webkit-box-orient:vertical;overflow:hidden;height:calc(1.4em * var(--pc-lines));text-decoration:none;transition:color .15s;word-break:break-word}
.pc-prod-name:hover{color:var(--pc-primary);text-decoration:underline}

.pc-prod-sku{font-size:11px;color:#bbb;margin:0 0 8px}
.pc-stars-row{display:flex;align-items:center;gap:4px;margin-bottom:9px}
.pc-stars{color:#e5a000;font-size:13px;letter-spacing:.5px}
.pc-rcount{font-size:11px;color:#bbb}
.pc-price-row{display:flex;align-items:baseline;gap:8px;margin-bottom:12px}
.pc-price-main{font-size:19px;font-weight:600;color:var(--pc-primary);text-decoration:none}
.pc-price-main:hover{opacity:.8}
.pc-price-old{font-size:12px;color:#ccc;text-decoration:line-through}

.pc-btn-add{width:100%;padding:10px;border-radius:99px;border:1.5px solid var(--pc-primary);background:#fff;color:var(--pc-primary);font-size:12px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;transition:all .18s;text-decoration:none;margin-top:auto;box-sizing:border-box}
.pc-btn-add:hover{background:var(--pc-primary);color:var(--pc-btn-text)}
/* Botón agotado – gris, no clickeable */
.pc-btn-soldout{border-color:#ccc;color:#aaa;cursor:not-allowed;background:#f9f9f9}
.pc-btn-soldout:hover{background:#f9f9f9;color:#aaa;border-color:#ccc}

/* ---- Bottom ---- */
.pc-bottom{display:flex;align-items:center;margin-top:1.25rem;gap:10px}
.pc-dots{display:flex;gap:6px}
.pc-dot{width:8px;height:8px;border-radius:50%;background:#e0e0e0;border:none;cursor:pointer;padding:0;transition:all .22s}
.pc-dot.active{width:24px;border-radius:4px;background:var(--pc-primary)}
.pc-progress-wrap{flex:1;height:3px;background:#f0f0f0;border-radius:2px;overflow:hidden}
.pc-progress-fill{height:100%;background:var(--pc-primary);border-radius:2px;transition:width .4s}
.pc-countdown{font-size:11px;color:#bbb;min-width:26px;text-align:right}

/* ---- Lightbox ---- */
.pc-lightbox{display:none;position:fixed;inset:0;z-index:99999;align-items:center;justify-content:center}
.pc-lightbox.open{display:flex}
.pc-lb-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.82);cursor:pointer}
.pc-lb-box{position:relative;background:#fff;border-radius:14px;padding:20px 24px 24px;max-width:94vw;max-height:94vh;display:flex;flex-direction:column;align-items:center;z-index:1;overflow:hidden}
.pc-lb-close{position:absolute;top:10px;right:14px;font-size:28px;background:none;border:none;cursor:pointer;color:#666;line-height:1;z-index:2}

/* Image container with overflow for zoom/pan */
.pc-lb-img-wrap{
    overflow:hidden;
    width:68vw;
    max-width:68vw;
    height:62vh;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-top:10px;
    cursor:grab;
    position:relative;
    border-radius:6px;
    background:#f8f8f8;
}
.pc-lb-img-wrap.dragging{cursor:grabbing}
.pc-lb-img{
    max-width:100%;
    max-height:100%;
    object-fit:contain;
    border-radius:4px;
    transition:transform .15s ease;
    transform-origin:center center;
    user-select:none;
    -webkit-user-drag:none;
    pointer-events:none; /* drag handled by wrapper */
}

/* Zoom controls bar */
.pc-lb-zoom-bar{display:flex;align-items:center;gap:8px;margin-top:10px}
.pc-lb-zoom-btn{width:32px;height:32px;border-radius:50%;border:1px solid #ddd;background:#fff;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#555;transition:all .15s;padding:0;line-height:1}
.pc-lb-zoom-btn:hover{border-color:#999;color:#222}
.pc-lb-zoom-reset{font-size:12px;color:#aaa;cursor:pointer;padding:4px 8px;border-radius:4px;transition:color .15s}
.pc-lb-zoom-reset:hover{color:#555}

.pc-lb-name{margin-top:10px;font-size:14px;font-weight:600;color:#333;text-align:center}
.pc-lb-actions{display:flex;gap:10px;margin-top:12px}
.pc-lb-view{padding:9px 20px;border-radius:99px;border:1.5px solid #ddd;background:#fff;color:#333;text-decoration:none;font-size:13px;font-weight:500;transition:border-color .15s}
.pc-lb-view:hover{border-color:#999}
.pc-lb-cart{padding:9px 20px;border-radius:99px;background:var(--pc-primary);color:var(--pc-btn-text);text-decoration:none;font-size:13px;font-weight:500;transition:opacity .15s}
.pc-lb-cart:hover{opacity:.85}

@media(max-width:600px){
    .pc-lb-img-wrap{width:90vw;max-width:90vw;height:55vh}
}

/* ---- Error ---- */
.pc-error{padding:12px 16px;background:#fff8f8;border-left:4px solid #e62c2c;border-radius:4px;font-size:14px;color:#555}

/* ---- Elementor compat ---- */
.elementor-widget-shortcode .pc-carousel,.elementor-editor-active .pc-carousel{display:block}