/**
 * Styles für den vereinfachten Psychedelischen Tunnel-Effekt
 * Erzeugt pulsierende, farbige Kreise um die Blume herum
 */

/* Grundlegendes Overlay */
#psychedelic-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: transparent;
    z-index: 10010; /* Höher als die Scrolls (10005) */
    overflow: hidden;
    opacity: 0;
    visibility: visible;
    pointer-events: none;
    transition: opacity 2s ease;
}

/* Tunnel-Kreise Basis-Stil */
.tunnel-circle {
    position: absolute;
    border-radius: 50%;
    border-width: 1px;
    border-style: solid;
    opacity: 0.6;
    box-shadow: 0 0 10px rgba(255, 255, 255, 0.4);
    animation-timing-function: linear, ease-in-out !important;
    animation-iteration-count: infinite !important;
    transform-origin: center center;
    pointer-events: none;
    transition: all 0.5s ease;
}

/* Animation für die Rotation der Kreise */
@keyframes rotate-slow {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@keyframes rotate-reverse {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(-360deg); }
}

/* Animation für das Pulsieren der Kreise */
@keyframes pulse-size {
    0% { transform: scale(0.9); }
    50% { transform: scale(1.1); }
    100% { transform: scale(0.9); }
}

/* Aktivierung des Psychedelischen Modus */
body.permanent-psychedelic #psychedelic-overlay {
    opacity: 1 !important;
    visibility: visible !important;
    z-index: 10010 !important;
}

/* Schwarz-Weiß-Hintergrund im Psychedelischen Modus */
body.permanent-psychedelic .bg-image {
    filter: grayscale(80%) !important;
    transition: filter 2s ease !important;
    opacity: 0.7 !important;
}