/* ===== FONDO PREMIUM ===== */

.product-detail {
padding: 150px 6% 100px;
background: radial-gradient(circle at top left, #1e293b 0%, #0f172a 60%);
min-height: 100vh;
color: white;
}

/* ===== CONTENEDOR ===== */

.product-container {
display: flex;
gap: 90px;
align-items: flex-start;
flex-wrap: wrap;
max-width: 1300px;
margin: auto;
}

/* ===== GALERÍA ===== */

.product-gallery {
flex: 1;
position: relative;
}

/* WRAPPER */

.image-wrapper {
position: relative;
overflow: hidden;
border-radius: 20px;
box-shadow: 0 30px 80px rgba(0,0,0,0.6);
}

/* IMAGEN PRINCIPAL */

.main-image {
width: 100%;
display: block;
transition: transform 0.2s ease;
cursor: zoom-in;
}

/* LUPA */

.zoom-lens {
position: absolute;
width: 180px;
height: 180px;
border-radius: 50%;
border: 3px solid rgba(45,91,255,0.8);
background-repeat: no-repeat;
display: none;
pointer-events: none;
box-shadow: 0 0 30px rgba(45,91,255,0.6);
}

/* MINIATURAS */

.thumbnails {
display: flex;
gap: 20px;
margin-top: 30px;
}

.thumbnails img {
width: 90px;
border-radius: 14px;
cursor: pointer;
transition: 0.3s;
border: 2px solid transparent;
}

.thumbnails img:hover {
transform: scale(1.1);
border-color: #2d5bff;
}

/* ===== INFO ===== */

.product-info {
flex: 1;
padding-top: 20px;
}

.product-info h1 {
font-size: 34px;
font-weight: 700;
margin-bottom: 20px;
color: #ffffff;
line-height: 1.3;
}

.price-detail {
font-size: 36px;
font-weight: bold;
color: #2d5bff;
margin-bottom: 25px;
}

/* BOTÓN */

.product-actions .btn {
padding: 16px 40px;
font-size: 16px;
border-radius: 14px;
background: linear-gradient(135deg,#2563eb,#4f46e5);
box-shadow: 0 15px 35px rgba(45,91,255,0.4);
transition: 0.3s;
border: none;
color: white;
cursor: pointer;
}

.product-actions .btn:hover {
transform: translateY(-4px);
box-shadow: 0 20px 45px rgba(45,91,255,0.6);
}

/* ESPECIFICACIONES */

.product-specs {
margin-top: 35px;
background: rgba(255,255,255,0.05);
backdrop-filter: blur(10px);
padding: 30px;
border-radius: 18px;
border: 1px solid rgba(255,255,255,0.1);
}

.product-specs h3 {
margin-bottom: 18px;
font-size: 18px;
color: #60a5fa;
}

.product-specs li {
padding: 12px 0;
border-bottom: 1px solid rgba(255,255,255,0.08);
font-size: 15px;
color: #cbd5e1;
}

.product-specs li:last-child {
border-bottom: none;
}

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

@media(max-width:992px){

.product-container {
flex-direction: column;
gap: 60px;
}

.product-info h1 {
font-size: 26px;
}

.price-detail {
font-size: 28px;
}

}

@media(max-width:600px){

.product-detail {
padding: 120px 5% 60px;
}

.zoom-lens {
display: none !important;
}

}
/* ===== GALERÍA PREMIUM ===== */

.product-gallery{
    flex:1;
}

.image-wrapper{
    position:relative;
    width:100%;
    max-width:520px;
    border-radius:18px;
    overflow:hidden;
    background:#0f172a;
    box-shadow:0 20px 60px rgba(0,0,0,0.35);
}

.main-image{
    width:100%;
    display:block;
    transition:transform 0.4s ease;
}

/* Zoom suave al hacer hover */
.image-wrapper:hover .main-image{
    transform:scale(1.05);
}

/* ===== LUPA REAL ===== */

.zoom-lens{
    position:absolute;
    width:160px;
    height:160px;
    border-radius:50%;
    border:3px solid #2563eb;
    display:none;
    pointer-events:none;
    background-repeat:no-repeat;
    box-shadow:
        0 0 25px rgba(37,99,235,0.6),
        0 0 50px rgba(37,99,235,0.3);
    backdrop-filter:blur(2px);
}

/* ===== MINIATURAS ===== */

.thumbnails{
    display:flex;
    gap:12px;
    margin-top:18px;
}

.thumbnails img{
    width:85px;
    height:85px;
    object-fit:cover;
    border-radius:12px;
    cursor:pointer;
    transition:all 0.3s ease;
    border:2px solid transparent;
}

.thumbnails img:hover{
    transform:scale(1.08);
    border:2px solid #2563eb;
}

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

@media(max-width:768px){

    .zoom-lens{
        display:none !important;
    }

    .image-wrapper:hover .main-image{
        transform:none;
    }

}

.extra-option{
    margin:20px 0;
}

.support-option{
    display:flex;
    align-items:center;
    gap:10px;
    font-weight:500;
    background:#f1f5f9;
    padding:12px 15px;
    border-radius:10px;
    cursor:pointer;
    transition:0.3s;
}

.support-option:hover{
    background:#e0e7ff;
}

.support-option input{
    width:18px;
    height:18px;
    cursor:pointer;
}

/* ===== BADGE PRO ===== */
.product-badge{
    display:inline-block;
    background:linear-gradient(135deg,#2563eb,#4f46e5);
    color:white;
    padding:6px 14px;
    font-size:12px;
    border-radius:30px;
    margin-bottom:15px;
    box-shadow:0 0 15px rgba(37,99,235,0.6);
    letter-spacing:1px;
}

/* ===== PRECIO PRO ===== */
.price-detail{
    font-size:32px;
    font-weight:800;
    margin:15px 0;
}

.animated-price{
    display:inline-block;
    transition:0.3s ease;
}

.price-update{
    animation:pricePop 0.4s ease;
    color:#2563eb;
}

@keyframes pricePop{
    0%{transform:scale(1);}
    50%{transform:scale(1.15);}
    100%{transform:scale(1);}
}

/* ===== SOPORTE ESTILO TECH ===== */
.support-option{
    display:flex;
    align-items:center;
    gap:12px;
    background:#0f172a;
    color:white;
    padding:16px 20px;
    border-radius:14px;
    cursor:pointer;
    border:1px solid rgba(37,99,235,0.4);
    transition:0.3s;
}

.support-option:hover{
    background:#1e293b;
    box-shadow:0 0 20px rgba(37,99,235,0.4);
}

.support-option input{
    width:18px;
    height:18px;
    cursor:pointer;
}

/* ===== GALERÍA PRO ===== */
.product-gallery{
    flex:1;
}

.image-wrapper{
    position:relative;
    overflow:hidden;
    border-radius:20px;
    box-shadow:0 25px 60px rgba(0,0,0,0.2);
}

.main-image{
    width:100%;
    display:block;
    transition:0.3s ease;
}

.zoom-lens{
    position:absolute;
    width:120px;
    height:120px;
    border-radius:50%;
    border:3px solid #2563eb;
    display:none;
    pointer-events:none;
    background-repeat:no-repeat;
    box-shadow:0 0 25px rgba(37,99,235,0.6);
}

.thumbnails{
    margin-top:15px;
}

.thumbnails img{
    width:70px;
    border-radius:10px;
    cursor:pointer;
    transition:0.3s;
}

.thumbnails img:hover{
    transform:scale(1.1);
}