/* Add custom CSS styles below */ 
p.text-gray-400.mb-2\.5.md\:mb-0 {
    position: relative;
    color: transparent !important; /* جعل النص الأصلي شفافًا */
}

p.text-gray-400.mb-2\.5.md\:mb-0 > * {
    display: none !important; /* إخفاء النص الأصلي والرابط */
}

p.text-gray-400.mb-2\.5.md\:mb-0::after {
    content: "جمعية الضيافة لخدمة ضيوف الرحمن بمكة المكرمة"; /* النص الجديد */
    color: #9ca3af; /* لون مشابه للنص الأصلي */
    display: block;
    font-size: 14px;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}
/* Instagram icon */
.s-social-link a[href*="instagram"] .s-social-icon svg path {
    fill: #E4405F;
}

/* Twitter/X icon */
.s-social-link a[href*="x.com"] .s-social-icon svg path {
    fill: #000000;
}

/* Snapchat icon */
.s-social-link a[href*="snapchat"] .s-social-icon svg path {
    fill: #FFFC00;
}

/* TikTok icon */
.s-social-link a[href*="tiktok"] .s-social-icon svg path {
    fill: #000000;
}
footer {
  position: relative;
  min-height: 400px;  /* تأكد أن الفوتر عنده مساحة كافية */
  overflow: visible;
  padding: 20px;
}

/* ==== الصورة للديسكتوب ==== */
@media (min-width: 769px) {
  footer::after {
    content: "";
    position: absolute;
    top: 120px;        /* 🔧 عدّل هنا المسافة من الأعلى */
    left: 100px;       /* 🔧 عدّل هنا المسافة من اليسار */
    width: 350px;      /* 🔧 عدّل هنا عرض الصورة */
    height: 350px;     /* 🔧 عدّل هنا ارتفاع الصورة */
    background-image: url('https://i.ibb.co/Kz0YRs3b/image.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 0.9;
    z-index: 0;
  }
}

/* ==== الصورة للجوال ==== */
@media (max-width: 768px) {
  footer::after {
    content: "";
    position: absolute;
    bottom: 20vh;         /* 🔺 رفع الصورة للأعلى (كانت 10vh) */
    left: 5vw;
    width: 40vw;
    height: 40vw;
    background-image: url('https://i.ibb.co/Kz0YRs3b/image.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 0.8;
    z-index: 0;
  }
}



/* تأكد أن المحتوى داخل الفوتر يظهر فوق الصورة */
footer * {
  position: relative;
  z-index: 1;
}
.store-header {
  position: relative;
}

/* صورة QR */
.store-header::after {
  content: "";
  display: block;
  width: 85px;
  height: 85px;
  background-image: url("https://i.ibb.co/xSDPvv98/QR-17677-2-page-0001.jpg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  top: 53px;
  left: 120px;
  z-index: 1000;
  cursor: pointer;
}

/* النص تحت QR */
.store-header::before {
  content: "تبرع بأمان";
  position: absolute;
  top: 140px; /* المسافة من الأعلى بعد QR */
  left:130px;
  font-size: 14px;
  color: #000000; /* غيّره حسب لون الخلفية */
  z-index: 1000;
  white-space: nowrap;
  font-weight: bold;
}

/* على الشاشات الصغيرة */
@media (max-width: 768px) {
  .store-header::after {
    width: 45px;
    height: 65px;
    top: 80px;
    left: 15px;
  }

  .store-header::before {
    top: 130px;
    left: 15px;
    font-size: 10.5px;
  }
}
------------------------
@font-face {
  font-family: 'ReadexPro';
  src: url('https://files.catbox.moe/tqk6cw.ttf') format('truetype');
  font-weight: 800;
  font-style: normal;
}

body, h1, h2, h3, h4, h5, h6, p, a, span, div, input, button {
  font-family: 'ReadexPro', sans-serif !important;
}

body {
  font-size: 25px;
}

h1 {
  font-size: 25px;
}

h2 {
  font-size: 25px;
}

h3 {
  font-size: 25px;
}

p, a, button, input, span, div {
  font-size: 18px;
}
----------------------------