/* Header Icons Styles */
.header-icons { display: flex; gap: 18px; align-items: center; }
.header-icons a { font-size: 22px; position: relative; cursor: pointer; transition: transform 0.2s; }
.header-icons a:hover { transform: scale(1.1); color: var(--pink); }

[data-nav="cart"], [data-nav="wishlist"] {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.cart-badge, .wishlist-badge {
  position: absolute;
  top: -6px;
  left: -8px; /* physical RIGHT in RTL */
  right: auto;
  color: white;
  font-size: 10px;
  font-weight: 800;
  padding: 0 5px;
  border-radius: 10px;
  min-width: 18px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  border: 2px solid white;
  box-shadow: 0 2px 4px rgba(0,0,0,0.15);
  letter-spacing: 0;
  line-height: 1;
}
.cart-badge { background: var(--pink); animation: badgePop 0.3s ease; }
.wishlist-badge { background: var(--purple); }

@keyframes badgePop {
  0% { transform: scale(0); }
  50% { transform: scale(1.3); }
  100% { transform: scale(1); }
}

.header-icons a.header-directions-btn {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  background: linear-gradient(135deg, #FF1B6B 0%, #7B2CBF 100%) !important;
  color: white !important;
  padding: 10px 16px !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  letter-spacing: 0.5px;
  border-radius: 50px;
  transition: all 0.25s ease;
  text-decoration: none !important;
  margin-left: 4px;
  box-shadow: 0 2px 10px rgba(255, 27, 107, 0.35);
}
.header-icons a.header-directions-btn:hover {
  background: linear-gradient(135deg, #FF6B00 0%, #FF1B6B 100%) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 18px rgba(255, 27, 107, 0.5);
}
.header-icons a.header-directions-btn svg { flex-shrink: 0; stroke: white; }
.header-directions-label { white-space: nowrap; color: white; }

@media (max-width: 768px) {
  .header-icons a.header-directions-btn { padding: 9px 11px !important; }
  .header-directions-label { display: none; }
}
