/* ===== thekraalteeb - CSS =====  */

/* --- Tajawal Font --- */
@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@300;400;500;700;800;900&display=swap');

/* --- Typography --- */
body, h1, h2, h3, h4, h5, h6, p, a, span, div {
  font-family: 'Tajawal', sans-serif !important;
}

/* --- Product Cards Subtle Hover --- */
custom-salla-product-card {
  transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}

custom-salla-product-card:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 8px 25px rgba(0,0,0,0.1) !important;
}

/* --- Product Image Zoom on Hover --- */
custom-salla-product-card .s-product-card-image img {
  transition: transform 0.5s ease !important;
}

custom-salla-product-card:hover .s-product-card-image img {
  transform: scale(1.05) !important;
}

/* --- Smooth Scroll --- */
html {
  scroll-behavior: smooth;
}

/* --- Selection Color --- */
::selection {
  background: rgba(0, 0, 0, 0.15);
}

/* --- Responsive --- */
@media (max-width: 768px) {
  .store-header {
    padding: 8px 0 !important;
  }
}