/* =========================================
   High-Fidelity Platinum Disc Styles
   These styles override the base disc styles
   for a more realistic, premium 3D look
   ========================================= */

.metal-disc.css-disc {
    /* Base metallic reflection (sharp 'X' beam pattern typical of vinyl/CDs) */
    background: 
        conic-gradient(
            from 45deg,
            #333333 0deg, #888888 15deg, #e6e6e6 25deg, #ffffff 30deg, #e6e6e6 35deg, #888888 45deg, #333333 60deg,
            #1a1a1a 75deg, #0d0d0d 90deg, #1a1a1a 105deg,
            #333333 120deg, #888888 135deg, #e6e6e6 145deg, #ffffff 150deg, #e6e6e6 155deg, #888888 165deg, #333333 180deg,
            #1a1a1a 195deg, #0d0d0d 210deg, #1a1a1a 225deg,
            #333333 240deg, #888888 255deg, #e6e6e6 265deg, #ffffff 270deg, #e6e6e6 275deg, #888888 285deg, #333333 300deg,
            #1a1a1a 315deg, #0d0d0d 330deg, #1a1a1a 345deg, #333333 360deg
        ) !important;
    box-shadow:
        inset 0 0 0 4px rgba(255, 255, 255, 0.4), /* Outer silver rim */
        inset 0 0 100px rgba(0, 0, 0, 0.8),       /* Outer shadow */
        inset 0 0 250px rgba(0, 0, 0, 0.5),       /* Deep inner shadow */
        0 0 100px rgba(255, 255, 255, 0.05),      /* Soft glow */
        0 0 250px rgba(255, 255, 255, 0.02) !important;
    filter: drop-shadow(0 0 80px rgba(255, 255, 255, 0.08)) !important;
}

/* Micro-grooves for the vinyl texture */
.disc-groove {
    inset: 4px !important; /* Inside the rim */
    /* Tighter, more realistic micro-grooves */
    background:
        repeating-radial-gradient(
            circle at center,
            transparent 0,
            rgba(0, 0, 0, 0.4) 1px,
            transparent 2px,
            rgba(255, 255, 255, 0.03) 3px,
            transparent 4px
        ),
        repeating-radial-gradient(
            circle at center,
            rgba(0,0,0,0.2) 0,
            transparent 10px,
            rgba(0,0,0,0.2) 20px
        ) !important;
    /* Macro track separations */
    mask-image: radial-gradient(
        circle at center,
        transparent 0%, transparent 14%, /* Label area */
        black 14%, black 28%,
        rgba(0,0,0,0.4) 28.5%, black 29%, black 45%,
        rgba(0,0,0,0.4) 45.5%, black 46%, black 65%,
        rgba(0,0,0,0.4) 65.5%, black 66%, black 85%,
        rgba(0,0,0,0.4) 85.5%, black 86%, black 98%,
        transparent 99%
    ) !important;
    -webkit-mask-image: radial-gradient(
        circle at center,
        transparent 0%, transparent 14%,
        black 14%, black 28%,
        rgba(0,0,0,0.4) 28.5%, black 29%, black 45%,
        rgba(0,0,0,0.4) 45.5%, black 46%, black 65%,
        rgba(0,0,0,0.4) 65.5%, black 66%, black 85%,
        rgba(0,0,0,0.4) 85.5%, black 86%, black 98%,
        transparent 99%
    ) !important;
    mix-blend-mode: overlay !important; /* Blends beautifully with the metallic conic background */
}

/* Counter-rotating light reflection for extra realism */
.disc-shine {
    background: conic-gradient(
        from 0deg,
        transparent 0deg, transparent 60deg,
        rgba(255, 255, 255, 0.1) 85deg,
        rgba(255, 255, 255, 0.3) 90deg,
        rgba(255, 255, 255, 0.1) 95deg,
        transparent 120deg, transparent 240deg,
        rgba(255, 255, 255, 0.1) 265deg,
        rgba(255, 255, 255, 0.3) 270deg,
        rgba(255, 255, 255, 0.1) 275deg,
        transparent 300deg, transparent 360deg
    ) !important;
    animation: spin-shine 15s linear infinite reverse !important;
    mix-blend-mode: color-dodge !important;
}

/* Center label hub (The Platinum Sticker) */
.disc-label {
    width: 28% !important;
    height: 28% !important;
    /* Dark elegant label with a subtle radial gradient */
    background: radial-gradient(circle at 30% 30%, #1a1a1a 0%, #0a0a0a 80%, #000000 100%) !important;
    box-shadow: 
        0 0 15px rgba(0, 0, 0, 0.9),              /* Drop shadow onto the vinyl */
        inset 0 2px 10px rgba(255, 255, 255, 0.1),/* Top inner highlight */
        inset 0 0 0 6px #b0b0b8,                  /* Thick platinum inner ring */
        inset 0 0 0 7px #000 !important;          /* Thin separator */
    border: 3px solid #e6e6e6 !important;         /* Outer platinum ring */
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

/* Spindle hole */
.disc-label-inner {
    width: 6% !important;
    height: 6% !important;
    background: #000 !important; /* Hole */
    box-shadow: 
        inset 0 2px 5px rgba(0, 0, 0, 0.8),
        0 0 0 4px #b0b0b8,                        /* Platinum spindle ring */
        0 1px 2px 4px rgba(255,255,255,0.4) !important;
    border: none !important;
}