/* HEADER בסיסי */
.header {
background: transparent;
padding: 50px 60px 18px 60px; /* מרווח גדול יותר למעלה */
display: flex;
align-items: center;
justify-content: space-between;
position: fixed;
top: 0;
width: 100%;
z-index: 1000;
border-bottom: none;
transition: all 0.4s ease;
}
/* מצב אחרי גלילה */
.header.scroll {
background: #ffffff;
border-bottom: 1px solid #eee;
box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}
/* לוגו */
.header .logo img {
height: 88px;
width: auto;
transition: height 0.3s ease;
}
/* לוגו מוקטן בגלילה */
.header.scroll .logo img {
height: 35px;
}
/* עטיפת תפריט וכפתור */
.nav-wrapper {
display: flex;
align-items: center;
gap: 25px;
}
/* ניווט */
.header nav {
display: flex;
align-items: center;
gap: 40px;
}
/* לינקים */
.header nav a {
color: #111;
font-size: 17px;
font-weight: 500;
text-decoration: none;
transition: color 0.3s ease;
}
.header nav a:hover {
color: #800020;
}
/* כפתור התחברות */
.header .login-btn {
color: #111;
border: 1px solid #111;
padding: 7px 18px;
border-radius: 30px;
font-size: 15px;
font-weight: 500;
text-decoration: none;
transition: all 0.3s ease;
}
.header .login-btn:hover {
background: #800020;
color: #fff;
border: 1px solid #800020;
}
/* תפריט המבורגר */
.menu-toggle {
display: none;
font-size: 30px;
cursor: pointer;
color: #111;
}
/* מובייל */
@media (max-width: 768px) {
.header {
padding: 20px 30px;
}
.nav-wrapper {
flex-direction: column;
}
.header nav {
display: none;
flex-direction: column;
background: #fff;
position: absolute;
top: 70px;
right: 0;
width: 100%;
padding: 20px 0;
box-shadow: 0 8px 20px rgba(0,0,0,0.1);
}
.header nav.active {
display: flex;
animation: slideIn 0.3s forwards;
}
.menu-toggle {
display: block;
}
/* כפתור התחברות במובייל - יותר גדול */
.header .login-btn {
padding: 10px 25px;
font-size: 17px;
}
}
/* אפקט פתיחת תפריט */
@keyframes slideIn {
from { opacity: 0; transform: translateY(-20px); }
to { opacity: 1; transform: translateY(0); }
}
/* אפקט קפיצה לעגלת קניות */
@keyframes cart-bounce {
0%, 100% { transform: translateY(0); }
50% { transform: translateY(-8px); }
}
.cart-bounce {
animation: cart-bounce 0.6s ease;
}
function toggleMenu() {
document.getElementById('nav').classList.toggle('active');
}
// שינוי צבע הדר בגלילה
window.addEventListener('scroll', function() {
const header = document.getElementById('mainHeader');
if (window.scrollY > 10) {
header.classList.add('scroll');
} else {
header.classList.remove('scroll');
}
});
// קפיצה לעגלת קניות
const cartIcon = document.querySelector('#cart-icon');
if(cartIcon){
cartIcon.addEventListener('click', function(e){
cartIcon.classList.add('cart-bounce');
setTimeout(() => {
cartIcon.classList.remove('cart-bounce');
}, 600);
});
}
