/* Stili per la Disco Ball Ultra-Realistica */

/* Assicurati che il body permetta la visualizzazione */
body {
    background: #000;
    overflow-x: hidden;
    position: relative;
    min-height: 100vh;
}

/* Main content completamente trasparente per vedere la disco ball */
.main-content {
    background: transparent !important;
    position: relative;
    z-index: 10;
}

/* Hero section con sfondo trasparente */
.hero {
    background: transparent !important;
    position: relative;
    z-index: 10;
}

/* Container con sfondo semi-trasparente per leggibilità */
.container {
    background: rgba(0, 0, 0, 0.2) !important;
    border-radius: 10px;
    padding: 20px !important;
}

/* Canvas Three.js per la disco ball - SFONDO DECORATIVO */
canvas[style*="position: fixed"], 
#disco-ball-canvas {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    pointer-events: none !important;
    z-index: 1 !important;
    background: transparent !important;
    opacity: 0.35 !important;
}

/* Header e navigazione sopra la disco ball - scorre con la pagina */
.header {
    background: rgba(0, 0, 0, 0.9) !important;
    backdrop-filter: blur(10px) !important;
    z-index: 100 !important;
}

/* Menu di navigazione */
.nav-menu {
    z-index: 101 !important;
}

/* Pulsanti e elementi interattivi sopra la disco ball */
.btn-primary,
.btn-primary-lg,
.btn-secondary-lg,
.menu-toggle {
    position: relative !important;
    z-index: 60 !important;
}

/* Sezioni sempre sopra la disco ball */
.featured-events,
.clubs-section,
.newsletter-section {
    position: relative !important;
    z-index: 100 !important;
    background: transparent !important;
}

/* Schede eventi e club sopra tutto - con background opaco */
.event-card {
    position: relative !important;
    z-index: 200 !important;
    background: rgba(0, 0, 0, 0.92) !important;
}

.club-card {
    position: relative !important;
    z-index: 200 !important;
}

/* Titoli e testi sempre visibili */
.hero-title,
.hero-subtitle,
.section-title,
.event-title,
.club-name {
    position: relative !important;
    z-index: 15 !important;
}

/* Hero section */
.hero {
    position: relative;
    z-index: 1;
}

.hero-content {
    position: relative;
    z-index: 2;
    background: transparent !important;
    padding: 30px !important;
}

/* Hero title sempre visibile */
.hero-title {
    color: #000000 !important;
    opacity: 1 !important;
    z-index: 10000 !important;
}

/* Container principale */
.main-content {
    position: relative;
    z-index: 1;
    background: transparent;
}

/* Overlay per testo sopra la disco ball */
.event-info {
    background: rgba(0, 0, 0, 0.92) !important;
    border-radius: 10px;
    padding: 20px !important;
}

.club-overlay {
    background: linear-gradient(to top, rgba(0, 0, 0, 0.95), transparent) !important;
    border-radius: 10px;
    padding: 20px !important;
}

/* Particelle sotto tutto */
.particles-container {
    z-index: 0 !important;
}

/* Footer con sfondo scuro */
.footer {
    background: #000;
    position: relative;
    z-index: 1;
}