@import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300..900;1,300..900&display=swap');
/* //////////////////////////////// */


html{
  direction: ltr;
}

*{
  font-family: "Rubik", serif !important;
}


.textLang{
  font-family: "DINNextLTArabic" !important;
  transform: translateY(-3px);
}


.cardD{
  margin-right: unset;
  margin-left: auto;
}
.titleCardD {
  padding-left: 12px;
}
.titleCardD::before {
  left: 0;
}

.closeBtn {
  right: 20px;
  left: unset;
}

.bi-arrow-left{
  transform: rotate(180deg);
}
.btnHero:hover svg {
  transform: rotate(180deg) translateX(-4px);
}
.btnArrow:hover svg{
  transform: rotate(180deg) translateX(-4px);
}
.btnArrow{
  align-items: center;
}
.btnHero{
  align-items: center;
}

.btnDonation span {
  transform: translateY(0px);
}

.circleSec{
  right: unset;
  left: -50%;
}

.imgBoxS{
  right: unset;
  left: -50px;
}

.scroll-up{
  margin-right: unset;
  margin-left: auto;
}

.arrowH{
  transform: rotateY(180deg);
}
.navMenu {
  transform: translateX(-30px);
  min-width: fit-content;
}

.navMenu ul {
  display: flex;
  align-items: center;
  gap: 1rem;
  white-space: nowrap;
}

/* Better navigation text styling */
.navList a {
  font-weight: 600;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: #000 !important;
  text-shadow: none;
  white-space: nowrap;
  display: inline-block;
}

/* .navList a:hover {
  color: #000 !important;
  text-shadow: none;
  background: rgba(0, 0, 0, 0.1);
} */

/* .navList.active a {
  color: #000 !important;
  text-shadow: none;
  background: rgba(0, 0, 0, 0.15);
} */

/* Language button text improvement */
.langIcon {
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.5px;
}



/* English navbar specific styles */
.navbar {
  background: linear-gradient(145deg, #f7bfd4 0%, #f0a8c5 100%);
}

.navM {
  flex-direction: row;
}

.logo {
  height: 220px;
  min-height: 220px;
}

/* Mobile logo improvements - matching Arabic version */
@media (max-width: 1200px) {
  .logo{
    height: 70px;
    min-height: 70px;
  }
}

@media (max-width: 991px) {
  .logo{
    height: 120px;
    min-height: 120px;
  }
}

@media (max-width: 768px) {
  .logo{
    height: 140px;
    min-height: 140px;
  }
}

@media (max-width: 480px) {
  .logo{
    height: 160px;
    min-height: 160px;
  }
}

.catSs{
  left: 0;
  right: unset;
}

.food-recommendation{
  border-right: unset;
  border-left: 4px solid #B45792;
}


@media (max-width: 991px) {
  .sidebar {
    left: -100%;
    transition: left 0.3s ease-in-out;
    background-color: #C05C8B;
    backdrop-filter: blur(20px);
    color: #fff;
  }
  
  .sidebar.active {
      left: 0;
      right: unset;
  }
  
  /* Mobile menu logo improvements - targeting only the logo inside sidebar flex container */
  .sidebar .flex-1 img[alt="Logo"] {
    height: 180px !important;
    min-height: 180px !important;
    width: auto !important;
    max-width: 300px !important;
  }
}