/* Ben Yüksel Design System & Core Styles */

/* Glassmorphism Header */
.glass-header {
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(13.2px);
    border: 1px solid #FFFFFF4A;
}

/* Hero Background Configuration */
.hero-bg {
    background-image: url('../uploads/silder/hero.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/* Link Transitions */
.nav-link {
    transition: all 0.3s ease;
    position: relative;
}

.nav-link:hover {
    color: #C5A57A;
}

/* Animations */
@keyframes shimmer {
    100% {
        transform: translateY(200%);
    }
}

/* Scrollbar Hiding Utility */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}

.no-scrollbar {
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}

/* ================================================================
   Mobile Bottom Navigation
   ================================================================ */

.mobile-bottom-nav {
    animation: slideUpNav 0.35s cubic-bezier(0.4, 0, 0.2, 1) both;
}

@keyframes slideUpNav {
    from {
        transform: translateY(100%);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.mobile-bottom-nav-bar {
    height: 64px;
}

/* Center button glow pulse — sadece ilk yüklemede */
.mobile-bottom-nav-center {
    animation: centerPulse 2s ease-in-out 1;
    animation-delay: 0.5s;
    animation-fill-mode: backwards;
}

@keyframes centerPulse {
    0% {
        box-shadow: 0 4px 16px rgba(196, 154, 106, 0.45);
    }
    50% {
        box-shadow: 0 4px 28px rgba(196, 154, 106, 0.7);
    }
    100% {
        box-shadow: 0 4px 16px rgba(196, 154, 106, 0.45);
    }
}

/* RTL: bottom nav sıralamasını koru */
[dir="rtl"] .mobile-bottom-nav-bar {
    flex-direction: row;
}

/* Center button icon spin on tap */
.mobile-bottom-nav-center.spinning {
    pointer-events: none;
}
.mobile-bottom-nav-center.spinning i {
    animation: iconSpin 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}
@keyframes iconSpin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}

/* Safe area — iPhone notch / home indicator */
@supports (padding-bottom: env(safe-area-inset-bottom)) {
    .mobile-bottom-nav-bar {
        padding-bottom: max(env(safe-area-inset-bottom), 8px);
    }
}