/*
 Theme Name:   Bricks Child Theme
 Theme URI:    https://bricksbuilder.io/
 Description:  Use this child theme to extend Bricks.
 Author:       Bricks
 Author URI:   https://bricksbuilder.io/
 Template:     bricks
 Version:      1.1
 Text Domain:  bricks
*/

/* Basis-Stil mit Übergang */
.brxe-logo img {
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    display: inline-block; /* Wichtig für Transform */
}

/* Einmalige Rotation bei Hover */
.brxe-logo:hover img {
    transform: rotate(360deg);
}

/* Optional: Leichter Zoom-Effekt */
.brxe-logo:hover img {
    transform: rotate(360deg) scale(1.1);
}


.bricks-nav-menu a {
    position: relative;
    text-decoration: none;
    display: inline-block;
    padding: 5px 0 10px;
    color: #333;
    transition: all 0.3s ease;
    overflow: visible;
}

/* Multi-Layer-Effekt */
.bricks-nav-menu a::before,
.bricks-nav-menu a::after {
    content: '';
    position: absolute;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Hauptlinie */
.bricks-nav-menu a::after {
    bottom: 0;
    left: 0;
    width: 0;
    height: 2px;
    background: linear-gradient(90deg, 
        #9ca3af 0%, 
        #374151 50%, 
        #9ca3af 100%);
    background-size: 200% 100%;
    border-radius: 1px;
}

/* Subtiler Glow-Effekt */
.bricks-nav-menu a::before {
    bottom: -3px;
    left: 50%;
    width: 0;
    height: 8px;
    background: radial-gradient(ellipse at center, 
        rgba(55, 65, 81, 0.15) 0%, 
        transparent 70%);
    transform: translateX(-50%);
    opacity: 0;
    filter: blur(4px);
}

.bricks-nav-menu a:hover::after {
    width: 100%;
    animation: subtle-flow 3s linear infinite;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.bricks-nav-menu a:hover::before {
    width: 110%;
    opacity: 1;
}

.bricks-nav-menu a:hover {
    color: #1f2937;
    transform: translateY(-0.5px);
}

@keyframes subtle-flow {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

/* Aktuelle Seite - mit demselben Verlaufseffekt */
.bricks-nav-menu .current-menu-item a::after {
    width: 100%;
    background: linear-gradient(90deg, 
        #9ca3af 0%, 
        #374151 50%, 
        #9ca3af 100%);
    background-size: 200% 100%;
    animation: subtle-flow 4s linear infinite; /* Langsamere Animation für Eleganz */
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

.bricks-nav-menu .current-menu-item a::before {
    width: 110%;
    opacity: 0.5; /* Dezenter als bei Hover */
}

/* Hover-Effekt ausblenden bei anderen Items */
.bricks-nav-menu:hover .current-menu-item a::after {
    width: 0;
    animation: none;
}

.bricks-nav-menu:hover .current-menu-item a::before {
    width: 0;
    opacity: 0;
}

/* Hover auf aktuellem Item wiederherstellen */
.bricks-nav-menu .current-menu-item a:hover::after {
    width: 100% !important;
    animation: subtle-flow 3s linear infinite !important;
}

.bricks-nav-menu .current-menu-item a:hover::before {
    width: 110% !important;
    opacity: 1 !important;
}