/* ══════════════════════════════════════════════
   WikiShoes — Theme Boost
   Profondità, luce ambientale, varietà cromatica
   ══════════════════════════════════════════════ */

/* ── BODY: non più nero piatto ── */
body {
    background: #090C16 !important;
    background-image:
        radial-gradient(ellipse 80% 55% at 8% 0%,  rgba(11,31,58,.45) 0%, transparent 58%),
        radial-gradient(ellipse 55% 40% at 92% 100%, rgba(40,22,6,.3)  0%, transparent 55%) !important;
    background-attachment: fixed !important;
}

/* ── GLASS CARDS più luminose ── */
.glass-card {
    background: rgba(255,255,255,.04) !important;
    border-color: rgba(212,175,55,.12) !important;
    box-shadow: 0 4px 24px rgba(0,0,0,.3),
                inset 0 1px 0 rgba(255,255,255,.05) !important;
}
.glass-card:hover {
    background: rgba(255,255,255,.07) !important;
    border-color: rgba(212,175,55,.25) !important;
}

/* ── NAV più visibile ── */
.nav.scrolled {
    background: rgba(9,12,22,.92) !important;
    border-bottom-color: rgba(212,175,55,.16) !important;
}

/* ── FOOTER ── */
.footer {
    background: linear-gradient(135deg,rgba(16,10,8,.9),rgba(9,12,22,.95)) !important;
    border-top-color: rgba(212,175,55,.1) !important;
}

/* ── TEXT leggermente più chiaro ── */
.body-text, .text-body { color: rgba(245,245,245,.68) !important; }
.body-text strong, .text-body strong { color: rgba(255,255,255,.9) !important; }

/* ── SCROLLBAR ── */
::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: #090C16; }
::-webkit-scrollbar-thumb { background: rgba(212,175,55,.28); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: rgba(212,175,55,.5); }
::selection { background: rgba(212,175,55,.22); color: #fff; }


/* ══════════════════════════════════════════════
   STORIA.HTML — luce ambientale per sezione
   Colori derivati dalle immagini reali analizzate
   ══════════════════════════════════════════════ */

/*
  #antichita    → sandalinilo.jpg    = BEIGE / ORO CALDO / SABBIA
  #era-sportiva → philebill.jpg      = NAVY SCURO + LEGNO MARRONE-ARANCIO
  #esplosione-jordan → michaelejordan.jpg = BLU / BIANCO / AZZURRO
  #era-moderna  → kanyewest.jpg      = GRIGIO BIANCO NEUTRO / SCURO
*/

/* Antichità: calore sabbia-oro della foto dei sandali */
#antichita {
    background:
        radial-gradient(ellipse 60% 55% at 28% 45%,
            rgba(160,115,20,.13) 0%, transparent 68%),
        radial-gradient(ellipse 45% 40% at 72% 80%,
            rgba(120,85,15,.08) 0%, transparent 62%);
}
#antichita .storia-img-frame,
#antichita .j-img-frame {
    box-shadow: 0 20px 50px rgba(0,0,0,.5),
                0 0 55px rgba(155,110,18,.11),
                0 0 0 1px rgba(155,110,18,.08);
}
#antichita .storia-img-frame:hover,
#antichita .j-img-frame:hover {
    box-shadow: 0 24px 60px rgba(0,0,0,.55),
                0 0 75px rgba(170,125,22,.20),
                0 0 0 1px rgba(170,125,22,.12);
}

/* Era Sportiva: navy/marrone-arancio legno (abiti Phil&Bill) */
#era-sportiva {
    background:
        radial-gradient(ellipse 60% 55% at 68% 45%,
            rgba(20,35,75,.14) 0%, transparent 68%),
        radial-gradient(ellipse 45% 40% at 25% 75%,
            rgba(90,50,12,.09) 0%, transparent 62%);
}
#era-sportiva .storia-img-frame,
#era-sportiva .j-img-frame {
    box-shadow: 0 20px 50px rgba(0,0,0,.5),
                0 0 55px rgba(25,45,95,.10),
                0 0 0 1px rgba(90,55,15,.07);
}
#era-sportiva .storia-img-frame:hover,
#era-sportiva .j-img-frame:hover {
    box-shadow: 0 24px 60px rgba(0,0,0,.55),
                0 0 75px rgba(30,55,120,.18),
                0 0 0 1px rgba(30,55,120,.10);
}

/* Esplosione Jordan: blu/azzurro (abito blu MJ, sfondo chiaro) */
#esplosione-jordan {
    background:
        radial-gradient(ellipse 60% 55% at 28% 45%,
            rgba(30,65,160,.13) 0%, transparent 68%),
        radial-gradient(ellipse 45% 40% at 75% 75%,
            rgba(15,40,100,.09) 0%, transparent 62%);
}
#esplosione-jordan .storia-img-frame,
#esplosione-jordan .j-img-frame {
    box-shadow: 0 20px 50px rgba(0,0,0,.5),
                0 0 55px rgba(30,70,170,.10),
                0 0 0 1px rgba(30,70,170,.08);
}
#esplosione-jordan .storia-img-frame:hover,
#esplosione-jordan .j-img-frame:hover {
    box-shadow: 0 24px 60px rgba(0,0,0,.55),
                0 0 75px rgba(40,90,200,.20),
                0 0 0 1px rgba(40,90,200,.12);
}

/* Era Moderna: grigio scuro/neutro (Kanye bianco su palco scuro) */
#era-moderna {
    background:
        radial-gradient(ellipse 60% 55% at 68% 45%,
            rgba(60,55,70,.12) 0%, transparent 68%),
        radial-gradient(ellipse 45% 40% at 25% 75%,
            rgba(30,30,40,.09) 0%, transparent 62%);
}
#era-moderna .storia-img-frame,
#era-moderna .j-img-frame {
    box-shadow: 0 20px 50px rgba(0,0,0,.5),
                0 0 55px rgba(80,70,100,.09),
                0 0 0 1px rgba(80,70,100,.07);
}
#era-moderna .storia-img-frame:hover,
#era-moderna .j-img-frame:hover {
    box-shadow: 0 24px 60px rgba(0,0,0,.55),
                0 0 75px rgba(100,90,130,.17),
                0 0 0 1px rgba(100,90,130,.10);
}


/* ══════════════════════════════════════════════
   JORDAN.HTML — luce ambientale per sezione
   Colori dalle scarpe e immagini reali
   ══════════════════════════════════════════════ */

/*
  #origini  → michaelejordan.jpg = BLU / BIANCO AZZURRO
  #anelli   → j1red.jpg (ROSSO) + j11darkblu.jpg (BLU NOTTE)
  #scarpe   → j1red=rosso, j3blu=blu, j4black=nero, j11=blu notte
  #rivalita → nessuna immagine — tono neutro freddo
  #cinema   → j11darkblu = BLU NOTTE / NERO PROFONDO + Space Jam purple
*/

/* Origini: blu/azzurro (abito blu MJ, foto analizzata) */
#origini {
    background:
        radial-gradient(ellipse 60% 55% at 30% 45%,
            rgba(30,65,160,.12) 0%, transparent 68%),
        radial-gradient(ellipse 45% 40% at 70% 75%,
            rgba(15,35,90,.08) 0%, transparent 62%);
}
#origini .j-img-frame {
    box-shadow: 0 20px 50px rgba(0,0,0,.5),
                0 0 55px rgba(30,70,170,.11),
                0 0 0 1px rgba(30,70,170,.08);
}
#origini .j-img-frame:hover {
    box-shadow: 0 24px 60px rgba(0,0,0,.55),
                0 0 75px rgba(40,90,200,.22),
                0 0 0 1px rgba(40,90,200,.13);
}

/* Anelli: AJ1 rossa → AJ11 blu notte, sfumatura bifasica */
#anelli {
    background:
        radial-gradient(ellipse 55% 50% at 25% 40%,
            rgba(140,18,22,.11) 0%, transparent 65%),
        radial-gradient(ellipse 55% 50% at 75% 70%,
            rgba(10,25,80,.12) 0%, transparent 65%);
}
#anelli .j-img-frame:first-of-type {
    box-shadow: 0 20px 50px rgba(0,0,0,.5),
                0 0 48px rgba(140,18,22,.10),
                0 0 0 1px rgba(140,18,22,.07);
}
#anelli .j-img-frame:last-of-type {
    box-shadow: 0 20px 50px rgba(0,0,0,.5),
                0 0 48px rgba(12,30,100,.11),
                0 0 0 1px rgba(12,30,100,.08);
}

/* Scarpe: card colorate matching scarpa */
#scarpe {
    background:
        radial-gradient(ellipse 65% 55% at 50% 50%,
            rgba(20,18,30,.15) 0%, transparent 70%);
}
#scarpe .j-card:nth-child(1) {
    border-color: rgba(140,18,22,.18);
    box-shadow: 0 4px 24px rgba(0,0,0,.3), 0 0 28px rgba(140,18,22,.07);
}
#scarpe .j-card:nth-child(2) {
    border-color: rgba(15,45,130,.18);
    box-shadow: 0 4px 24px rgba(0,0,0,.3), 0 0 28px rgba(15,45,130,.07);
}
#scarpe .j-card:nth-child(3) {
    border-color: rgba(35,35,35,.35);
    box-shadow: 0 4px 24px rgba(0,0,0,.35), 0 0 20px rgba(0,0,0,.15);
}
#scarpe .j-card:nth-child(4) {
    border-color: rgba(8,20,80,.22);
    box-shadow: 0 4px 24px rgba(0,0,0,.3), 0 0 28px rgba(8,20,80,.08);
}

/* Rivalità: nessuna immagine — tono parquet freddo neutro */
#rivalita {
    background:
        radial-gradient(ellipse 60% 55% at 50% 40%,
            rgba(12,20,45,.13) 0%, transparent 68%);
}

/* Cinema: blu notte Space Jam + tocco viola cosmico */
#cinema {
    background:
        radial-gradient(ellipse 60% 55% at 30% 45%,
            rgba(12,18,75,.13) 0%, transparent 68%),
        radial-gradient(ellipse 45% 40% at 75% 70%,
            rgba(40,12,80,.09) 0%, transparent 62%);
}
#cinema .j-img-frame {
    box-shadow: 0 20px 50px rgba(0,0,0,.5),
                0 0 55px rgba(15,25,100,.11),
                0 0 0 1px rgba(15,25,100,.08);
}
#cinema .j-img-frame:hover {
    box-shadow: 0 24px 60px rgba(0,0,0,.55),
                0 0 75px rgba(40,15,110,.20),
                0 0 0 1px rgba(40,15,110,.12);
}


/* Fix Product Image Lighting */
.product-image-bg { display: none !important; }
.product-shoe-img { mix-blend-mode: normal !important; filter: drop-shadow(0 15px 25px rgba(0,0,0,0.5)) !important; opacity: 1 !important; transform: scale(1.15) !important; }
.product-image::after { display: none !important; }
.product-image { background: rgba(0,0,0,0.15) !important; }


/* Fix Product Modal Lighting */
.pm-main-img-el { mix-blend-mode: normal !important; filter: drop-shadow(0 20px 40px rgba(0,0,0,0.6)) !important; opacity: 1 !important; transform: scale(1.1) !important; transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important; }
.pm-main-img::after { display: none !important; }


/* Global Horizontal Scroll Lock */
html, body { overflow-x: hidden !important; max-width: 100vw !important; width: 100% !important; margin: 0 !important; padding: 0 !important; }


/* Fix Modal Infinite Rotation Bug */
.product-modal-inner::after { display: none !important; animation: none !important; opacity: 0 !important; }


/* Strict Centering for PNGs */
.product-shoe-img, .pm-main-img-el, .featured-card-img img, .rv-card-img img, .compare-bar-item img { position: relative !important; inset: auto !important; width: 90% !important; height: 90% !important; margin: auto !important; display: block !important; object-fit: contain !important; object-position: center !important; left: 0 !important; top: 0 !important; right: 0 !important; bottom: 0 !important; transform: scale(1.05) translate(0, 0) !important; }
.product-image { display: flex !important; align-items: center !important; justify-content: center !important; }