/* BASE */
*{box-sizing:border-box}
body{margin:0;background:#000;color:#fff;font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}

/* PAGE */
.shop-page{max-width:1300px;margin:auto;padding:44px 22px 90px}
.shop-hero{text-align:center;margin-bottom:42px}
.shop-hero h1{margin:0 0 14px;font-size:52px;letter-spacing:2px}
.shop-hero p{margin:0;color:#ccc;font-size:18px}

/* LAYOUT */
.shop-layout{display:grid;grid-template-columns:1fr 360px;gap:28px;align-items:start}
.shop-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}
.shop-toolbar h2{margin:0;font-size:26px}
.cart-open-btn{display:none;padding:10px 18px;background:#b00000;color:#fff;border:1px solid #fff;border-radius:8px;font-weight:900;cursor:pointer}
.cart-open-btn span{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:24px;margin-left:8px;background:#fff;color:#000;border-radius:50%}

/* PRODUCTS */
.products-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:22px}
.loading-box{grid-column:1/-1;padding:30px;text-align:center;color:#aaa;border:1px solid #333;border-radius:12px;background:#080808}
.product-card{display:flex;flex-direction:column;min-height:100%;background:linear-gradient(180deg,#161616,#060606);border:1px solid #333;border-radius:14px;overflow:hidden;transition:.25s;box-shadow:0 0 18px #000}
.product-card:hover{transform:translateY(-4px);border-color:#5a0000;box-shadow:0 0 25px rgba(255,0,0,.22)}
.product-image{width:100%;height:245px;background:#050505;display:flex;align-items:center;justify-content:center;border-bottom:1px solid #222;position:relative;overflow:hidden}
.product-image img{width:100%;height:100%;object-fit:contain;display:block;cursor:zoom-in;transition:.25s}
.product-image:hover img{transform:scale(1.04);filter:brightness(1.12)}
.product-image::after{content:"🔍";position:absolute;right:10px;bottom:10px;width:34px;height:34px;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.65);color:#fff;border:1px solid #555;border-radius:50%;font-size:15px;pointer-events:none}
.product-body{flex:1;display:flex;flex-direction:column;padding:18px}
.product-body h3{margin:0 0 8px;font-size:21px}
.product-desc{color:#cfcfcf;font-size:14px;line-height:1.45;margin:0 0 14px}
.product-price{margin-top:auto;color:#ff3333;font-size:22px;font-weight:900}
.product-controls{margin-top:16px;display:grid;gap:10px}
.product-controls select,.product-controls input{width:100%;padding:10px;background:#050505;color:#fff;border:1px solid #555;border-radius:8px}
.product-controls select option{background:#111;color:#fff}
.add-cart-btn{width:100%;padding:12px;background:transparent;color:#fff;border:1px solid #666;border-radius:6px;text-transform:uppercase;font-weight:900;letter-spacing:.8px;cursor:pointer;transition:.25s}
.add-cart-btn:hover{background:#b00000;border-color:#fff;box-shadow:0 0 14px rgba(255,0,0,.5)}
.add-cart-btn:disabled{opacity:.45;cursor:not-allowed}
.out-stock{opacity:.45;filter:grayscale(1)}

/* IMAGE VIEWER */
#imageViewer{position:fixed;inset:0;display:none;align-items:center;justify-content:center;flex-direction:column;background:rgba(0,0,0,.94);z-index:9999999;padding:28px;backdrop-filter:blur(6px);overflow:hidden}
#imageViewer.open{display:flex}
#imageViewerImg{width:auto;height:auto;max-width:90vw;max-height:78vh;object-fit:contain;background:#050505;border-radius:12px;box-shadow:0 0 35px rgba(255,255,255,.35);transform:scale(2.4)}
#imageViewerTitle{position:absolute;bottom:45px;font-size:26px;font-weight:900;text-align:center;color:#fff;text-shadow:0 0 10px #000}
#imageViewerClose{position:absolute;top:24px;right:30px;width:46px;height:46px;background:#fff;color:#000;border:0;border-radius:50%;font-size:28px;font-weight:900;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.25s;z-index:2}
#imageViewerClose:hover{background:#ff0000;color:#fff;box-shadow:0 0 18px #f00}

/* CART */
.cart-panel{position:sticky;top:20px;background:linear-gradient(180deg,#171717,#060606);border:1px solid #333;border-radius:14px;padding:18px;box-shadow:0 0 18px #000}
.cart-header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #2a2a2a;padding-bottom:12px}
.cart-header h2{margin:0}
.cart-header button{display:none;width:36px;height:36px;border:0;border-radius:50%;font-size:24px;font-weight:900;cursor:pointer}
.cart-items{padding:14px 0;max-height:420px;overflow:auto}
.cart-empty{color:#aaa;text-align:center}
.cart-item{display:grid;grid-template-columns:58px 1fr auto;gap:10px;align-items:center;padding:12px 0;border-bottom:1px solid #202020}
.cart-item img{width:58px;height:58px;object-fit:contain;background:#000;border-radius:8px;cursor:zoom-in}
.cart-item-title{font-weight:800;font-size:14px}
.cart-item-meta{color:#aaa;font-size:12px;margin-top:3px}
.cart-item-actions{display:flex;align-items:center;gap:6px;margin-top:8px}
.cart-item-actions button{width:26px;height:26px;border:1px solid #555;background:#000;color:#fff;border-radius:4px;cursor:pointer}
.cart-remove{border:0!important;color:#ff4444!important;background:transparent!important;font-size:18px}
.summary-line{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #333;padding-top:16px;font-size:18px}
.summary-note{margin:14px 0;color:#bbb;font-size:13px;line-height:1.45}
.checkout-btn,.checkout-pay-btn{width:100%;padding:14px;background:#b00000;color:#fff;border:2px solid #fff;border-radius:8px;font-weight:900;cursor:pointer;transition:.25s}
.checkout-btn:hover,.checkout-pay-btn:hover{background:#e00000;box-shadow:0 0 16px #f00}

/* CHECKOUT */
#checkoutOverlay{position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.92);z-index:999999;padding:20px;backdrop-filter:blur(6px)}
#checkoutBox{position:relative;width:92%;max-width:560px;background:radial-gradient(circle at top,#3a0000,#090909 60%);border:2px solid #c00;border-radius:14px;box-shadow:0 0 30px #900;padding:28px;text-align:center}
#checkoutClose{position:absolute;top:-15px;right:-15px;width:42px;height:42px;border:0;background:#fff;color:#000;border-radius:50%;font-size:24px;font-weight:900;cursor:pointer}
.checkout-intro{color:#ddd;line-height:1.45}
#checkoutForm{display:grid;gap:12px}
#checkoutForm input,#checkoutForm select,#checkoutForm textarea{width:100%;padding:12px;background:rgba(0,0,0,.85);color:#fff;border:1px solid #555;border-radius:8px;resize:vertical}
#checkoutForm textarea{min-height:80px}
#checkoutForm option{background:#111;color:#fff}
.checkout-total{margin:8px 0;font-size:20px}
#checkoutMsg{margin-top:14px;min-height:20px;color:#ddd;font-size:14px}

/* FOOTER */
footer{width:100%;text-align:center;padding:26px 0;border-top:1px solid #222;color:#aaa;font-size:14px;background:#050505}

/* RESPONSIVE */
@media(max-width:980px){.shop-layout{grid-template-columns:1fr}.cart-open-btn{display:inline-flex;align-items:center}.cart-panel{position:fixed;top:0;right:-390px;width:360px;max-width:90vw;height:100vh;z-index:99999;border-radius:0;transition:.25s;overflow:auto}.cart-panel.open{right:0}.cart-header button{display:block}#cartOverlay{position:fixed;inset:0;background:rgba(0,0,0,.65);display:none;z-index:99998}#cartOverlay.open{display:block}}
@media(max-width:650px){.shop-hero h1{font-size:38px}.products-grid{grid-template-columns:1fr}#imageViewerImg{transform:scale(1.8);max-width:95vw;max-height:70vh}#imageViewerTitle{font-size:18px;bottom:35px}}

.mensaje-despacho{
  display:none;
  margin-top:4px;
  padding:12px;
  background:#220000;
  border:1px solid #b00000;
  border-radius:8px;
  color:#fff;
  font-size:13px;
  line-height:1.45;
  text-align:left;
}