.footer {
  background: #1e293b;
  color: #f8fafc;
  padding: 20px;
  /* background-image: url("1.jpg");  
  background-repeat: no-repeat;  
  background-size: cover;  
  background-position: center; */
  width: 100%;
  font-family: Shabnam;
}

.form-group {
  padding: 1% 10%;
  direction: rtl;
  font-family: Shabnam;
}

/* Container to hide overflowing tags */
.scroll-container {
  overflow: hidden;
  width: 100%;
  display: flex;
}

.social-links {
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  display: flex;
  margin-top: 20px;
}

/* Row of tags */
.scroll-row {
  display: flex;
  animation-duration: 10s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}

/* Tag styling */
.scroll-row span {
  flex: 0 0 20%; /* Ensures 5 tags are visible at a time */
  display: flex;
  justify-content: center;
  align-items: center;
  color: #e2e8f0;
  background-color: #334155;
  margin: 5px;
  border-radius: 3px;
  height: 35px;
  width: 43px;
  box-shadow: 0 0.1rem 0.2rem rgb(0 0 0 / 20%), 0 0.1rem 0.5rem rgb(0 0 0 / 30%),
    0 0.2rem 1.5rem rgb(0 0 0 / 40%);
}

.scroll-row span a {
  text-decoration: none;
  color: #f8fafc;
}

/* Scrolling animations */
@keyframes scroll-left {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}

@keyframes scroll-right {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0);
  }
}

/* Alternate scroll directions */
.scroll-left {
  animation-name: scroll-left;
}

.scroll-right {
  animation-name: scroll-right;
}

.btn {
  color: orange;
  font-size: 1.5rem;
  box-shadow: 0 0.1rem 0.2rem rgb(0 0 0 / 20%), 0 0.1rem 0.5rem rgb(0 0 0 / 30%),
    0 0.2rem 1.5rem rgb(0 0 0 / 40%);
}

.btn:hover {
    color: white;
}

textarea {
    height: auto !important; /* Ensures it adjusts correctly */
    min-height: 80px !important; /* Set a minimum height if needed */
}

i {
    color: white !important;
    font-size: 1.4rem !important;
    padding: 0 10px !important;
}

i:hover {
    color: orange !important;
}