/* Custom styles for Chow Gastropub */

/* Smooth focus outlines */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible {
    outline: 2px solid #e05a47;
    outline-offset: 2px;
}

/* Selection color */
::selection {
    background: #f9d0c8;
    color: #75251e;
}

/* Mobile menu animation */
#bar1 {
    transform-origin: center;
}
#bar2 {
    transform-origin: center;
}
#bar3 {
    transform-origin: center;
}

/* Hamburger animation when open */
.menu-open #bar1 {
    transform: translateY(5px) rotate(45deg);
}
.menu-open #bar2 {
    opacity: 0;
}
.menu-open #bar3 {
    transform: translateY(-5px) rotate(-45deg);
}

/* Geometric shape float animation */
@keyframes float {
    0%, 100% { transform: translateY(0px) rotate(var(--rotation, 0deg)); }
    50% { transform: translateY(-12px) rotate(var(--rotation, 0deg)); }
}

.geo-circle,
.geo-square {
    animation: float 6s ease-in-out infinite;
}

.geo-triangle {
    animation: float 7s ease-in-out infinite;
}

/* Stagger animations for geometric shapes */
.geo-circle:nth-child(2) { animation-delay: -1s; }
.geo-square:nth-child(3) { animation-delay: -2s; }
.geo-triangle:nth-child(4) { animation-delay: -3s; }

/* Image hover container */
.h-52 {
    overflow: hidden;
}

/* Subtle pattern overlay for dark sections */
.bg-terracotta-600::before,
.bg-terracotta-700::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: radial-gradient(circle at 20% 80%, rgba(253, 252, 248, 0.03) 0%, transparent 50%),
                      radial-gradient(circle at 80% 20%, rgba(237, 190, 107, 0.05) 0%, transparent 50%);
    pointer-events: none;
}