*{
box-sizing:border-box;
}

body{
margin:0;
background:#020617;
color:white;
font-family:Arial;
transition:.3s;
}

/* HEADER */
.header{
background:#0f172a;
padding:18px 30px;
display:flex;
justify-content:space-between;
align-items:center;
border-bottom:1px solid rgba(255,255,255,0.05);
}

.logo{
font-size:28px;
font-weight:bold;
color:var(--primary);
text-decoration:none;
text-shadow:0 0 12px rgba(var(--primary-rgb),.6);
display:flex;
align-items:center;
gap:10px;
}

.logo-img{
width:36px;
height:36px;
object-fit:contain;
border-radius:8px;
}

.back-btn{
background:var(--primary);
padding:10px 16px;
border-radius:10px;
text-decoration:none;
color:white;
transition:.3s;
}

.back-btn:hover{
box-shadow:0 0 15px var(--primary);
}

.header-links{
display:flex;
gap:10px;
flex-wrap:wrap;
align-items:center;
justify-content:flex-end;
}

.header{background:linear-gradient(135deg,rgba(8,17,30,.94),rgba(15,23,42,.88));border-bottom:1px solid rgba(255,255,255,.08);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}

/* CONTAINER */
.container{
max-width:1100px;
margin:auto;
padding:30px 20px;
}

/* GRID */
.grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:30px;
}

/* CARD */
.card{
background:#0b1220;
padding:20px;
border-radius:16px;
border:1px solid rgba(var(--primary-rgb),0.15);
}

/* SLIDER */
.slider{
position:relative;
overflow:hidden;
border-radius:12px;
aspect-ratio:1/1;
background:#0b1220;
}

/* SLIDES */

.slide{
position:absolute;
inset:0;
opacity:0;
transition:opacity .45s ease;
pointer-events:none;
}

/* ACTIVO */

.slide.active{
opacity:1;
z-index:2;
pointer-events:auto;
}

/* IMAGEN */

.slide img{
width:100%;
height:100%;
object-fit:contain;
display:block;
border-radius:12px;
background:#0b1220;
}

.slider>.prev,
.slider>.next{
position:absolute;
z-index:5;
top:50%;
transform:translateY(-50%);
width:38px;
height:48px;
display:grid;
place-items:center;
padding:0;
border:1px solid rgba(255,255,255,.16);
border-radius:9px;
background:rgba(2,6,23,.58);
color:#fff;
font-size:25px;
line-height:1;
cursor:pointer;
box-shadow:none;
backdrop-filter:blur(5px);
}

.slider>.prev{left:10px}
.slider>.next{right:10px}
.slider>.prev:hover,.slider>.prev:active,.slider>.next:hover,.slider>.next:active{transform:translateY(-50%);background:rgba(2,6,23,.72);box-shadow:none}
.slider>.prev:focus-visible,.slider>.next:focus-visible{outline:2px solid var(--primary-light);outline-offset:2px}

@media(max-width:600px){.slider>.prev,.slider>.next{width:34px;height:44px;font-size:23px}.slider>.prev{left:7px}.slider>.next{right:7px}}

/* INFO */
.price{
color:var(--primary);
font-size:30px;
font-weight:bold;
margin:15px 0;
}

.ok{
color:#22c55e;
font-weight:bold;
}

.no{
color:#ef4444;
font-weight:bold;
}

/* RELACIONADOS */
.related{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
gap:18px;
margin-top:20px;
}

.rel{
background:#0b1220;
padding:12px;
border-radius:14px;
border:1px solid rgba(var(--primary-rgb),0.15);
transition:.3s;
}

.rel:hover{
transform:translateY(-5px);
box-shadow:0 0 15px rgba(var(--primary-rgb),.4);
}

.rel a{
text-decoration:none;
color:inherit;
display:block;
}

.rel img{
width:100%;
border-radius:10px;
display:block;
margin-bottom:10px;
}

/* THEME BUTTON */
#themeToggle{
position:fixed;
right:20px;
bottom:20px;
width:58px;
height:58px;
border-radius:50%;
background:var(--primary);
display:flex;
align-items:center;
justify-content:center;
cursor:pointer;
font-size:24px;
z-index:9999;
box-shadow:0 0 20px rgba(var(--primary-rgb),0.6);
}

/* LIGHT MODE */
body.light{
background:#f1f5f9;
color:#0f172a;
}

body.light .header{
background:#ffffff;
border-bottom:1px solid #e2e8f0;
box-shadow:0 2px 10px rgba(0,0,0,0.05);
}

body.light .card,
body.light .rel{
background:#ffffff;
color:#0f172a;
border:1px solid #e2e8f0;
}

body.light .rel a,
body.light h1,
body.light h2,
body.light h3,
body.light p{
color:#0f172a;
}

body.light .footer{
background:#ffffff !important;
color:#0f172a !important;
border-top:1px solid #e2e8f0;
}

/* MOBILE */
@media(max-width:700px){

.grid{
grid-template-columns:1fr;
}

.header{
flex-direction:row;
gap:12px;
text-align:left;
padding:12px 14px;
min-height:64px;
}

.logo{
font-size:24px;
}

.header-links{
width:100%;
justify-content:center;
}

.back-btn{
padding:8px 12px;
font-size:13px;
}

.header-links{margin-left:auto;flex-wrap:nowrap;width:auto;justify-content:flex-end}
.header-links .back-btn{display:none;box-shadow:none!important;transform:none!important}
.header-links .back-btn:first-child{display:inline-flex;white-space:nowrap;background:rgba(var(--primary-rgb),.1);border:1px solid rgba(var(--primary-rgb),.28)}

}

.description{
line-height:1.8;
word-break:break-word;
}
/* FEATURES */

.features{
display:flex;
flex-wrap:wrap;
gap:10px;
margin:15px 0 20px;
}

.feature-pill{
padding:10px 14px;
border-radius:999px;
background:rgba(var(--primary-rgb),.08);
border:1px solid rgba(var(--primary-rgb),.35);
color:#fff;
font-size:14px;
font-weight:600;
backdrop-filter:blur(10px);
transition:.2s;
}

.feature-pill:hover{
transform:translateY(-2px);
border-color:var(--primary);
box-shadow:0 0 12px rgba(var(--primary-rgb),.35);
}
/* PRODUCT STATS */

.product-stats{
display:flex;
gap:12px;
flex-wrap:wrap;
margin-top:25px;
}

/* PILLS */

.status-pill{
padding:11px 16px;
border-radius:999px;
font-size:14px;
font-weight:600;
backdrop-filter:blur(10px);
border:1px solid rgba(255,255,255,.06);
}

/* DISPONIBLE */

.ok-pill{
background:rgba(34,197,94,.12);
border-color:rgba(34,197,94,.25);
color:#22c55e;
}

/* AGOTADO */

.no-pill{
background:rgba(239,68,68,.12);
border-color:rgba(239,68,68,.25);
color:#ef4444;
}

/* VENDIDOS */

.sold-pill{
background:rgba(var(--primary-rgb),.12);
border-color:rgba(var(--primary-rgb),.25);
color:var(--primary-light);
}

/* RELATED TITLE */

.related-title{
display:inline-flex;
align-items:center;
gap:10px;
padding:12px 18px;
border-radius:999px;
margin-top:40px;
margin-bottom:18px;
background:rgba(var(--primary-rgb),.08);
border:1px solid rgba(var(--primary-rgb),.2);
font-size:16px;
font-weight:700;
backdrop-filter:blur(10px);
}

/* ===== RESEÑAS ===== */

.reviews-summary{
display:flex;
align-items:center;
gap:16px;
flex-wrap:wrap;
margin-bottom:22px;
}

.reviews-avg{
font-size:38px;
font-weight:800;
color:#facc15;
}

.stars{
color:#facc15;
font-size:18px;
letter-spacing:2px;
}

.reviews-count{
color:#94a3b8;
font-size:14px;
}

.review-form{
background:#0b1220;
border:1px solid rgba(var(--primary-rgb),.2);
border-radius:16px;
padding:20px;
margin-bottom:25px;
}

.review-form h4{
margin:0 0 14px;
}

.star-select{
display:flex;
flex-direction:row-reverse;
justify-content:flex-end;
gap:6px;
margin-bottom:14px;
}

.star-select label{
cursor:pointer;
font-size:26px;
color:#334155;
transition:.15s;
}

.star-select input{
display:none;
}

.star-select input:checked ~ label,
.star-select label:hover,
.star-select label:hover ~ label{
color:#facc15;
}

.review-form textarea{
width:100%;
min-height:90px;
padding:12px 14px;
border-radius:10px;
border:1px solid rgba(var(--primary-rgb),.2);
background:#020617;
color:white;
font-family:Arial;
font-size:14px;
resize:vertical;
margin-bottom:14px;
}

.review-form textarea:focus{
outline:none;
border-color:var(--primary);
}

.review-form button{
background:var(--primary);
color:white;
border:none;
padding:12px 22px;
border-radius:10px;
font-weight:700;
cursor:pointer;
transition:.25s;
}

.review-form button:hover{
box-shadow:0 0 15px rgba(var(--primary-rgb),.4);
}

.review-photo-picker{
display:flex;
gap:10px;
flex-wrap:wrap;
margin:0 0 14px;
}

.review-photo-option{
display:inline-flex;
align-items:center;
gap:8px;
padding:10px 14px;
border-radius:10px;
border:1px solid rgba(var(--primary-rgb),.25);
background:rgba(var(--primary-rgb),.08);
color:#e2e8f0;
font-size:13px;
font-weight:700;
cursor:pointer;
}

.review-photo-option input{display:none;}
.review-photo-help{color:#94a3b8;font-size:12px;margin:-5px 0 14px;}
.review-upload-error{color:#fecaca;background:rgba(220,38,38,.12);border:1px solid rgba(248,113,113,.35);padding:10px 12px;border-radius:10px;margin-bottom:14px;font-size:13px;}
.guest-intro{color:#94a3b8;font-size:13px;margin:-4px 0 14px}.guest-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-bottom:14px}.guest-choice{position:relative}.guest-choice input{position:absolute;opacity:0;pointer-events:none}.guest-choice label{display:flex;align-items:center;gap:9px;min-height:48px;padding:10px 12px;border-radius:11px;border:1px solid rgba(var(--primary-rgb),.2);background:#020617;color:#cbd5e1;font-size:13px;font-weight:700;cursor:pointer;transition:.18s}.guest-choice input:checked+label{border-color:var(--primary);background:rgba(var(--primary-rgb),.14);color:#fff;box-shadow:0 0 12px rgba(var(--primary-rgb),.16)}.guest-alias{display:none;margin-bottom:14px}.guest-alias.active{display:block}.guest-alias input{width:100%;padding:11px 13px;border-radius:10px;border:1px solid rgba(var(--primary-rgb),.2);background:#020617;color:#fff}.guest-alias input:focus{outline:none;border-color:var(--primary)}.guest-label-note{color:#64748b;font-size:11px;margin:-5px 0 14px}.review-honeypot{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important}@media(max-width:560px){.guest-choices{grid-template-columns:1fr}}
.guest-review-gate{padding:22px;border:1px solid rgba(var(--primary-rgb),.24);border-radius:14px;background:linear-gradient(135deg,rgba(var(--primary-rgb),.1),rgba(2,6,23,.8));text-align:center}.guest-review-gate .gate-icon{font-size:34px;margin-bottom:8px}.guest-review-gate h4{margin:0 0 8px;color:#fff}.guest-review-gate p{margin:0 auto 16px;color:#94a3b8;line-height:1.5;max-width:520px}.guest-review-gate .gate-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.guest-review-gate a{padding:10px 15px;border-radius:9px;background:var(--primary);color:#06101b;text-decoration:none;font-weight:800}.guest-review-gate a.secondary{background:#1e293b;color:#fff}
.review-images{display:flex;gap:9px;flex-wrap:wrap;margin-top:12px;}
.review-images a{display:block;}
.review-images img{width:92px;height:92px;object-fit:cover;border-radius:10px;border:1px solid rgba(var(--primary-rgb),.25);transition:.2s;}
.review-images img:hover{transform:scale(1.03);border-color:var(--primary);}

.review-login-note{
background:rgba(var(--primary-rgb),.08);
border:1px solid rgba(var(--primary-rgb),.2);
border-radius:14px;
padding:16px 18px;
margin-bottom:25px;
font-size:14px;
}

.review-login-note a{
color:var(--primary-light);
font-weight:700;
text-decoration:none;
}

.review-item{
background:#0b1220;
border:1px solid rgba(var(--primary-rgb),.15);
border-radius:14px;
padding:16px 18px;
margin-bottom:14px;
}

.review-head{
display:flex;
align-items:center;
gap:10px;
margin-bottom:8px;
}

.review-avatar{
width:34px;
height:34px;
border-radius:50%;
background:var(--primary);
display:flex;
align-items:center;
justify-content:center;
font-weight:bold;
font-size:14px;
overflow:hidden;
flex-shrink:0;
}

.review-avatar img{
width:100%;
height:100%;
object-fit:cover;
}

.review-name{
font-weight:700;
font-size:14px;
}

.review-admin-badge{display:inline-block;margin-left:7px;padding:2px 7px;border-radius:999px;background:rgba(var(--primary-rgb),.14);border:1px solid rgba(var(--primary-rgb),.28);color:var(--primary-light);font-size:10px;font-weight:700;vertical-align:middle}

.review-date{
font-size:12px;
color:#64748b;
}

.review-stars{
color:#facc15;
font-size:14px;
margin-bottom:6px;
}

.review-comment{
color:#cbd5e1;
font-size:14px;
line-height:1.7;
margin:0;
}

.no-reviews{
color:#64748b;
font-size:14px;
margin-bottom:25px;
}

/* LIGHT MODE */

body.light .feature-pill{
background:#fff;
color:#111827;
border:1px solid rgba(var(--primary-rgb),.2);
}

body.light .review-form,
body.light .review-item{
background:#ffffff;
border:1px solid #e2e8f0;
}

body.light .review-comment{
color:#334155;
}

body.light .review-photo-option{color:#334155;background:#f8fafc;border-color:#cbd5e1;}

/* BUY */

.buy-box{
margin-top:25px;
display:flex;
gap:15px;
align-items:center;
flex-wrap:wrap;
}

.qty-box{
display:flex;
align-items:center;
background:#111827;
border-radius:12px;
overflow:hidden;
border:1px solid rgba(var(--primary-rgb),.2);
}

.qty-box button{
width:45px;
height:45px;
border:none;
background:var(--primary);
color:white;
font-size:22px;
cursor:pointer;
}

.qty-box input{
width:70px;
height:45px;
border:none;
text-align:center;
background:#0b1220;
color:white;
font-size:18px;
outline:none;
}

.buy-btn{
height:45px;
padding:0 25px;
display:flex;
align-items:center;
justify-content:center;
background:#22c55e;
color:white;
text-decoration:none;
border-radius:12px;
font-weight:bold;
transition:.2s;
border:none;
font-size:15px;
cursor:pointer;
font-family:Arial;
}

.buy-btn:hover{
transform:translateY(-2px);
box-shadow:0 0 15px rgba(34,197,94,.4);
}

.buy-btn-alt{
background:var(--primary);
}

.buy-btn-alt:hover{
box-shadow:0 0 15px rgba(var(--primary-rgb),.5);
}

.buy-btn:disabled{
background:#334155;
color:#94a3b8;
cursor:not-allowed;
transform:none;
box-shadow:none;
}
/* PRICE */

.price-box{
display:flex;
align-items:center;
gap:12px;
flex-wrap:wrap;
margin:15px 0;
}

.old-price{
font-size:20px;
opacity:.5;
text-decoration:line-through;
}

.discount-badge{
background:#ef4444;
padding:6px 10px;
border-radius:999px;
font-size:13px;
font-weight:bold;
color:white;
}
.product-description{
margin-top:22px;
color:#cbd5e1;
font-size:15px;
line-height:1.9;
font-weight:400;
letter-spacing:.2px;
opacity:.92;
}

.product-description p{
margin:0 0 14px;
}

.product-description strong{
color:white;
font-weight:600;
}

.product-description br{
content:"";
display:block;
margin-bottom:10px;
}
.product-description{
margin-top:24px;
font-size:15px;
line-height:1.85;
color:#94a3b8;
font-weight:400;
letter-spacing:.3px;
max-width:95%;
}

.product-description strong{
color:#e2e8f0;
font-weight:600;
}