/* 2.Шапка и Навигация */

nav { position: -webkit-sticky; position: sticky; top: 0; z-index: 9999; background: rgba(153, 153, 153, 0.75) !important; backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); display:flex; align-items:center; gap:18px; border-top:4px solid var(--accent); padding: 0 10px; margin-bottom: 20px; box-shadow: 0 4px 10px rgba(0,0,0,0.3); }
.main-nav { display: flex; justify-content: space-between; align-items: center; border-top: 3px solid var(--accent); padding: 10px 0; }
.nav-links-container { display: flex; gap: 18px; }
.nav-link { font-weight:700; padding:6px 0; transition: color 0.2s; }
.nav-link:hover, .nav-link.active { color: var(--accent); }
.menu-burger { display: none; flex-direction: column; justify-content: space-around; width: 30px; height: 24px; background: transparent; border: none; cursor: pointer; padding: 0; z-index: 1001; }
.menu-burger span { width: 30px; height: 3px; background: #000; border-radius: 10px; transition: all 0.3s linear; }
.mobile-icon-btn, .mobile-menu-wrapper { display: none; }
.header-cart-block { margin-left: auto; }
#headerCartTotal { border-left: 1px solid rgba(255,255,255,0.3); padding-left: 12px; }
.nav-link-cart { display: flex; align-items: center; gap: 12px; padding: 10px 20px; background: none !important; color: #000 !important; border: none; border-radius: 4px; font-weight: bold; font-size: 16px; text-decoration: none; transition: background 0.2s ease; cursor: pointer; }
.nav-link-cart.active, .nav-link-cart:hover { background: none !important; color: var(--accent) !important; }
.nav-link-cart.active .cart-img-icon, .nav-link-cart:hover .cart-img-icon { filter: invert(85%) sepia(50%) saturate(1000%) hue-rotate(350deg) brightness(100%); }
.cart-img-icon { width: 22px; height: 22px; display: block; transition: filter 0.2s ease; }
.cart-button { display: flex; align-items: center; gap: 8px; background: #fff; border: 1px solid #ddd; padding: 6px 15px; border-radius: 4px; font-weight: 700; font-size: 14px; transition: all 0.2s ease; cursor: pointer; }
.cart-button:hover { border-color: var(--accent); background-color: #fff9e6; }
#site-header { display: contents; }


@media (max-width:768px) {
   .container { overflow: visible !important; }
  /* 1.3.Липкое меню и его мобильное состояние */
  .sticky-nav { display: flex; justify-content: space-between; align-items: center; }
   nav { flex-wrap: wrap; height: auto !important; padding: 8px 5px; justify-content: center;  }
  .nav-link { width: 100%; font-size:12px; padding: 5px 2px; border-bottom: 1px solid rgba(255,255,255,0.1); }
  .nav-links-container { display: none; position: absolute; top: 45px; left: 0; width: 100%; background: rgba(153, 153, 153, 0.75) !important; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(18px); flex-direction: column; padding: 10px 0; box-shadow: 0 5px 10px rgba(0,0,0,0.2); }
  .nav-links-wrapper { position: absolute; top: 50px; left: 0; width: 100%; background: #999; display: none; flex-direction: column; z-index: 1000; }

  /* 1.4.Кнопка «Меню» */
  .burger-menu { display: flex !important; width: 22px; height: 18px; }
  .menu-burger { display: flex; }
  .menu-text-label { color: #000; font-weight: bold; font-size: 14px; text-transform: uppercase; }
  .mobile-menu-wrapper { display: flex; align-items: center; gap: 10px; }
  .nav-links-container.open { display: flex; }
  .nav-links-wrapper.open { display: flex; }

  /* 1.5.Кнопка корзины в углу */
  .header-cart-block { margin: 0 !important; flex: 1; display: flex; justify-content: flex-end; }
  .nav-link-cart { font-size: 14px; padding: 5px 10px; }

  #site-header { display: contents !important; }
}