/* Custom styles to match the design */
#fatwas .latest-fatwa {
  background: none;
}
#fatwas .dropdown{
 width: 220px;
}
.main-title {
  font-size: 3rem;
  font-weight: 700;
  color: #333;
}
.form-check-label {
  font-weight: 500;
  color: #4d4d4d;
  font-family: "Markazi Text";
  font-size: 1.5rem;
}
.form-check-input {
  margin: 0px;
}
.form-check-input:focus {
  box-shadow: 0 0 0 0.25rem #c8f1c8;
}
.form-check {
  display: flex;
  gap: 1rem;
  align-items: center;
  padding: 0;
}
.form-switch {
  padding: 0;
}
.form-check .form-check-input {
  float: unset;
  margin-left: 0;
}
/* Custom Toggle Switch */
.form-switch .form-check-input {
  width: 3.5rem;
  height: 1.5rem;
  background: #d9d9d9;
  border-radius: 2rem;
  position: relative;
  transition: all 0.3s;
  border: unset;
  box-shadow: none;
}
.form-switch .form-check-input:checked {
  background-color: #d9d9d9;
}
.form-switch .form-check-input::before {
  content: "";
  position: absolute;
  top: -2px;
  left: 0px;
  width: 1.75rem;
  height: 1.75rem;
  background: #4d4d4d;
  border-radius: 50%;
  transition: transform 0.3s ease;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}
.form-switch .form-check-input:checked::before {
  transform: translateX(2.063rem);
  background: #2c6e49;
}
.form-switch .form-check-input:checked,
.form-switch .form-check-input:focus {
  background-image: none;
}
/* Custom Radio Buttons */
.form-check-input[type="radio"] {
  border: 2px solid #2d6a4f;
  width: 1.563rem;
  height: 1.563rem;
}
.form-check-input[type="radio"]:checked {
  background-color: #2d6a4f;
  background-image: none;
}
 .radio-group{
    gap: 3rem;
   }
/* about us */
#about-us p {
  max-width: 1200px;
  margin: 30px auto;
  font-family: Cairo;
  font-size: 2rem;
  line-height: 4rem;
  text-align: center;
}
#about-us section {
  margin-top: 90px;
  background-position: top left;
  min-height: calc(90lvh - 140px);
}
#about-us h1 {
  font-size: 3rem;
  font-weight: 700;
}
/* about us */
#profile-page > section {
  margin-top: 90px;
  min-height: calc(90lvh - 140px);
}
.profile-icon {
  position: relative;
  background-color: #e1e1e1;
  width: 147px;
  height: 147px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: auto;
}
.edit-profile-icon {
  position: absolute;
  bottom: 10px;
  left: 0;
}
.profile-name {
  font-family: Cairo;
  font-weight: 700;
  font-size: 2rem;
  line-height: 100%;
}
/* profile tabs */
.underline-tabs .nav-tabs {
  border-bottom: unset;
  justify-content: center;
}
.underline-tabs .nav-link {
  border: none;
  border-bottom: 3px solid transparent;
  padding: 1rem 1.5rem;
  margin-bottom: -2px;
  font-weight: 600;
  font-size: 2rem;
  color: #262c24;
  transition: all 0.3s ease;
}
.underline-tabs .nav-link:hover {
  border-bottom-color: #c8f1c8;
  color: #2c6e49;
}
.underline-tabs .nav-link.active {
  border-bottom-color: #2c6e49;
  color: #2c6e49;
}
.personal-info-form {
  max-width: 936px;
  margin: 0 auto;
  padding-bottom: 100px;
}
.personal-info-form label {
  font-weight: 600;
  font-size: 20px;
  color: #4d4d4d;
  margin-bottom: 16px;
}
.personal-info-form input {
  height: 84px;
  border-color: #e1e1e1;
  border-radius: 12px;
  font-family: 1rem;
  font-weight: 600;
  padding: 24px;
}
.input-group-custom {
  position: relative;
}
.input-group-custom .edit-icon {
  position: absolute;
  right: 24px;
  top: 50%;
  transform: translateY(-50%);
}
/* Content Animation */
.tab-pane.fade {
  transition: all 0.2s ease-out;
}
.tab-pane.fade.show {
  animation: fadeIn 0.5s ease-out;
}
/* questions section  */
.questions-container {
  margin-top: 48px;
  display: flex;
  flex-direction: column;
  gap: 48px;
  margin-bottom: 100px;
}
.question-card {
  box-shadow: 5px 5px 48px 0px #0000001a;
  background: #ffffff;
  border-radius: 24px;
  padding: 28px 24px;
  font-family: "Markazi Text";
}
.question-card h3 {
  font-weight: 500;
  margin-bottom: 0;
}
.question-card button {
  height: 41px;
  width: 133px;
  border-radius: 8px;
  border: unset;
  font-size: 1rem;
  font-weight: 500;
}
.btn-reserved {
  background-color: #ffcece;
  color: #bc4749;
}
.btn-answer {
  background-color: #ceffe1;
  color: #2c6e49;
}
.question-card .question-text {
  color: #4d4d4d;
  font-size: 20px;
  font-weight: 500;
}
.question-card .question-link {
  color: var(--green-dark);
  font-weight: 500;
  font-size: 1rem;
  text-decoration: none;
}
.question-card .question-link:hover {
  text-decoration: underline;
}
/* libaray  */
#libaray-page {
  margin-top: 63px;
  min-height: calc(90lvh - 140px);
}
#fatwa-detail-page {
  margin-top: 28px;
  min-height: calc(90lvh - 140px);
}
/* vide0 cards */
.general-img-card.fatwa-video-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #ffffff;
  gap: 24px;
  padding: 17px 33px;
}
.general-img-card.fatwa-video-card .main-img {
  height: 89px;
  flex-grow: 1;
}
.general-img-card.fatwa-video-card .main-img img {
  object-fit: cover;
  object-position: top;
}
.sub-header {
  border-bottom: 1px solid #e1e1e1;
  padding: 24px 32px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.breadcrumb a,
.sub-header span {
  font-family: "Markazi Text";
  font-weight: 500;
  font-size: 24px;
  color: #2c6e49;
  text-decoration: unset;
}
#conatct-us > section {
  margin-top: 50px;
  min-height: calc(90lvh - 140px);
  text-align: left;
}
#conatct-us h1 {
  font-family: "Cairo";
  font-weight: 700;
  font-size: 32px;
  color: #262c24;
}
#conatct-us .latest-fatwa {
  padding: 0 0 64px;
  background-image: url("../images/contact-use-bg.png");
  background-repeat: no-repeat;
  background-size: auto 500px;
  background-position: center right;
}
.contact-us-from {
  max-width: 978px;
}
.contact-us-p {
  font-family: "Cairo";
  font-weight: 700;
  font-size: 14px;
}
.contact-us-from label {
  font-family: "Markazi Text";
  font-weight: 500;
  font-size: 24px;
  text-transform: capitalize;
  margin-block: 20px;
}
.contact-us-from input {
  height: 84px;
  border-radius: 12px;
  font-size: 20px;
  font-weight: 500;
  padding: 30px 32px;
}
.contact-us-from textarea {
  height: 285px;
  border-radius: 12px;
  font-size: 20px;
  font-weight: 500;
  padding: 30px 32px;
}
.send-btn button {
  margin-top: 24px;
  min-width: 150px;
}
.video-detail-section {
  margin-bottom: 40px;
}
.main-video {
  width: 100%;
  max-height: 662px;
  background: #e1e1e1;
  border-radius: 12px;
  margin-bottom: 78px;
}
.video-section-heading {
  font-family: "Cairo";
  font-weight: 600;
  font-size: 32px;
  margin-bottom: 0;
}
.video-desc {
  color: #4d4d4d;
  font-family: "Markazi Text";
  font-weight: 500;
  font-size: 24px;
}

.similar-videos h3 {
  font-family: "Cairo";
  font-weight: 600;
  font-size: 32px;
  margin-bottom: 12px;
}
.similar-video-card {
  display: flex;
  gap: 36px;
  border-bottom: 1px solid #e1e1e1;
  padding-block: 16px;
  margin-bottom: 12px;
}
.similar-video-card video {
  max-height: 205px;
  background: #e1e1e1;
  border-radius: 12px;
}
.similar-video-card h4 {
  font-family: " Markazi Text";
  font-weight: 600;
  font-size: 32px;
  margin-bottom: 26px;
}
.similar-video-card p {
  font-family: "Markazi Text";
  font-weight: 500;
  font-size: 24px;
}
.video-date {
  background: #c8f1c8;
  color: #2c6e49;
  font-size: 32px;
  font-family: "Markazi Text";
  font-weight: 500;
  padding: 8px 28px;
  border-radius: 4px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.fatwa-detail-title {
  font-family: "Markazi Text";
  font-weight: 500;
  font-size: 32px;
  margin-bottom: 0;
}
.fatwa-detail-question {
  border-bottom: 1px solid #e1e1e1;
  padding: 24px 32px;
}
.fatwa-detail-btn {
  background: #d6efd5;
  font-family: "Markazi Text";
  font-weight: 500;
  font-size: 24px;
  padding: 10px 38px;
  border-radius: 8px;
}
.fatwa-question {
  font-family: "Markazi Text";
  font-weight: 500;
  font-size: 24px;
}
.fatwa-detail-ans,
.related-fatwa {
  padding: 24px 32px;
}
.related-fatwa h3 {
  font-size: 40px;
}
.related-fatwa-question {
  border-bottom: 1px solid #e1e1e1;
  padding-block: 24px;
  font-family: "Markazi Text";
  font-weight: 500;
  font-size: 24px;
}
.video-title{
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}
#libaray-page .search-icon{
  background-color: unset;
}
@media (max-width: 1199px) {
.video-section-heading{font-size: 28px;}
}
@media (max-width: 1199px) {
  .main-title {
    font-size: 35px;
  }
  .general-img-card.fatwa-video-card {
    padding: 15px 28px 22px;
  }
  .form-check-label{
    font-size: 22px;
  }
  #fatwas .dropdown{
  padding-bottom: 12px;
  }
}
@media (max-width: 991px) {
  .main-title {
    font-size: 32px;
  }
  .general-img-card.fatwa-video-card {
    flex-direction: column;
  }
  .general-img-card.fatwa-video-card .main-img {
    height: unset;
  }
  .similar-video-card {
    display: flex;
    flex-direction: column;
  }
  .sub-header{
    flex-direction: column;
  }
  .video-title{
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
  .video-date{
    font-size: 24px;
    padding: 8px 10px;
  }
  .video-section-heading{font-size: 25px;}
  .contact-us-from label{
    margin-block: 10px;
  }
  .contact-us-from input{
    padding: 10px;
    height: unset;
    font-size: 16px;
    border-radius: 8px;
  }
   .contact-us-from textarea{
    padding: 10px;
    height: 150px;
    font-size: 16px;
    border-radius: 8px;
  }
  #about-us h1{
    font-size: 32px;
  }
}
@media (max-width: 575px) {
  .main-title {
    font-size: 28px;
  }
  #about-us p {
    font-size: 18px;
    line-height: 2rem;
    margin-block: 0;
  }
   .video-section-heading{font-size: 24px;}
   .profile-name,.underline-tabs .nav-link{font-size: 24px;}
   .personal-info-form input{
    height: unset;
    padding: 12px;
   }
   .form-switch,.form-check-input[type="radio"]{
    transform: scale(0.8);
   }
   .radio-group{
    row-gap: 0px;
    column-gap: 16px;
    justify-content: center;
   }
   .sub-header,.fatwa-detail-question,.fatwa-detail-ans,.related-fatwa {
    padding-inline: 0px;
   }
   #fatwas .dropdown button{
    font-size: 18px;
    padding: 5px 10px;
    border-radius: 8px;
   }
}