@import url('https://fonts.googleapis.com/css2?family=Kufam:ital@0;1&display=swap');

:root{
  --ig: #E4405F;   /* Instagram */
  --sc: #FFFC00;   /* Snapchat */
  --tt: #25F4EE;   /* TikTok */
   --wa: #25D366;   /* WhatsApp */
   --ph: #007BFF;   /* Phone */
  --em: #FF5722;   /* Email */
}


/* ==============================
   أيقونات التواصل (واتس / فون / إيميل)
============================== */
.s-contacts .s-contacts-icon{
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  color: currentColor;
  transition: color .35s ease, box-shadow .35s ease;
}

/* حجم SVG */
.s-contacts .s-contacts-icon svg{
  width: 24px;
  height: 24px;
}
.s-contacts .s-contacts-icon svg path{
  fill: currentColor !important;
}

/* WhatsApp */
.s-contacts .s-contacts-item[href*="whatsapp"]:hover .s-contacts-icon,
.s-contacts .s-contacts-item[href*="whatsapp"]:focus-visible .s-contacts-icon{
  color: var(--wa);
  box-shadow: 0 0 15px var(--wa), 0 0 25px var(--wa);
}

/* Phone */
.s-contacts .s-contacts-item[href*="tel"]:hover .s-contacts-icon,
.s-contacts .s-contacts-item[href*="tel"]:focus-visible .s-contacts-icon{
  color: var(--ph);
  box-shadow: 0 0 15px var(--ph), 0 0 25px var(--ph);
}

/* Email */
.s-contacts .s-contacts-item[href*="mailto"]:hover .s-contacts-icon,
.s-contacts .s-contacts-item[href*="mailto"]:focus-visible .s-contacts-icon{
  color: var(--em);
  box-shadow: 0 0 15px var(--em), 0 0 25px var(--em);
}



/* Instagram */
.s-social-list .s-social-link a[title="instagram"]:hover,
.s-social-list .s-social-link a[title="instagram"]:focus-visible{
  color: var(--ig);
  box-shadow: 0 0 15px var(--ig);
}
.s-social-list .s-social-link a[title="instagram"]:hover::after,
.s-social-list .s-social-link a[title="instagram"]:focus-visible::after{
  opacity: 1;
  box-shadow: 0 0 25px 8px color-mix(in srgb, var(--ig) 50%, transparent);
}





/* مقاس الشعار */
.main-nav-container.fixed-pinned .navbar-brand img,
.navbar-brand img {
    max-height: 6rem; /* تحديد أقصى ارتفاع للشعار */
}



/* ================== أزرار الشراء والسلة ================== */
.s-button-btn.s-button-primary-outline,
.s-button-btn.s-button-solid,
.s-fast-checkout-button {
  position: relative;
  overflow: hidden;
  border: 2px solid var(--color-primary);
  background-color: var(--color-primary);
  color: #fff;
  font-weight: bold;
  border-radius: 6px;
  padding: 12px 20px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-align: center;
  transition: transform .3s ease, box-shadow .3s ease, background-color .3s ease;
}






/* ==============================
   10- الفوتر (Footer)
============================== */
.store-footer__inner {
    background-color: #ffffff; /* خلفية الفوتر */
}

.store-footer a.flex h3 {
    font-size: 0;                                      /* إخفاء النص */
    background-image: url(https://asas-tools.com/u/uploads/info.aop22%40gmail.com/260.png); /* شعار */
    background-size: contain;                          /* ملاءمة الحجم */
    background-repeat: no-repeat;                      /* منع التكرار */
    background-position: center;                       /* توسيط */
    display: block;
    width: 200px;
    height: 115px;
}
p.max-w-sm.leading-6.mb-6 {
    MARGIN: -22PX;
}
/* ==============================
   12- responsive
============================== */

@media(max-width:767px){
#photos-0-slider > div.swiper.s-slider-container.swiper-initialized.swiper-horizontal.swiper-rtl.swiper-ios.swiper-backface-hidden{
   padding:0;
}
.s-products-slider-card {
    max-width: 195px;
}
.main-nav-container {
    min-height: 56px;
}
  .s-button-element:not(:disabled):not([loading]) {
    font-size: 11px;
}
}



.s-button-btn.s-button-primary-outline {
    background-color: #dbafc8; /* لون الخلفية */
    color: black;             /* لون النص */
}



.s-button-btn.s-button-primary-outline:hover {
    background-color: #fffff;
    color: white;
}




.s-product-card-price {
  display:inline-block;
  transition: transform .4s ease, text-shadow .4s ease, color .4s ease;
}
.s-product-card-content:hover .s-product-card-price {
  transform: translateY(-2px);
  color:#ff9800;
  text-shadow:0 4px 14px rgba(255,152,0,.4);
}



.s-product-card-content {
  background:#fff;
  border-radius:16px;
  padding:16px;
  transition: transform .4s ease, box-shadow .4s ease;
}
.s-product-card-content:hover {
  transform: translateY(-8px);
  box-shadow:0 10px 20px rgba(0,0,0,.12);
}


.s-product-card-content-title a {
  position:relative;
  text-decoration:none;
  transition:color .3s ease;
}
.s-product-card-content-title a::after {
  content:"";
  position:absolute;
  bottom:-.25em; right:0;
  width:100%; height:2px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin:right;
  transition: transform .6s ease;
}
.s-product-card-content:hover .s-product-card-content-title a::after {
  transform: scaleX(1);
  transform-origin:left;
}



salla-mini-checkout-widget:hover,
salla-mini-checkout-widget .s-add-product-button-mini-checkout-content:hover {
  transform: scale(1.05);
  box-shadow: 0 4px 15px rgba(245, 100, 169, .4);
  background-color: #000000;
}




a.banner-entry.square-photos {
    background: transparent; /* خلفية شفافة */
}