.experts-page .bg-blue {
  color: #fff !important;
  background-color: #123484fa;
  z-index: 1;
}

.experts-page button.book-btn:hover {
  color: white !important;
  background-color: #000000 !important;
}

.experts-page button.book-btn {
  border: 1px solid #111827 !important;
  color: white !important;
  background-color: #111827 !important;
  width: 100%;
  border-radius: 0.5rem !important;
  font-family: 'General Sans', sans-serif !important;
}

.experts-page button.chat-btn {
  border: 1px solid #111827 !important;
  color: white !important;
  background-color: #111827 !important;
  width: 100%;
  border-radius: 0.5rem !important;
  font-family: 'General Sans', sans-serif !important;
}

.experts-page button.chat-btn:hover {
  color: white !important;
  background-color: #000000 !important;
}

/* Force correct grid layout - maximum 3 cards per row */
.experts-page {
  display: grid !important;
  grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
  gap: 1.5rem !important;
  width: 100% !important;
  padding: 0 0.5rem !important;
}

@media (min-width: 768px) {
  .experts-page {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 2rem !important;
  }
}

@media (min-width: 1280px) {
  .experts-page {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 2.5rem !important;
  }
}

/* Apply General Sans font to all cards */
.experts-page .top-expert-slide {
  font-family: 'General Sans', sans-serif !important;
}

.experts-page .top-expert-slide * {
  font-family: 'General Sans', sans-serif !important;
}

/* Ensure consistent card layout and button positioning */
.experts-page .top-expert-slide {
  display: flex !important;
  flex-direction: column !important;
}

.experts-page .top-expert-slide > div:last-child {
  margin-top: auto !important;
}

.experts-page .top-10 {
  position: relative !important;
  top: -115px;
}

.experts-page .top-expert-slide {
  box-shadow: 0 2px 10px #0000001a;
  border-radius: 0.75rem;
  padding: 0px;
  width: 100%;
  height: 100%;
  position: relative;
  min-height: 500px !important;
}

.experts-page .slider-expert {
  padding-top: 0px !important;
  max-width: 100%;
  padding-bottom: 0px;
  margin-bottom: 0px;
  width: 100%;
}

.experts-page .font-10 {
  font-size: 10px;
}

.experts-page button.book-btn {
  width: 100% !important;
}

.experts-page .bottom-10 {
  bottom: 10px !important;
}

/* Optimized card heights with better proportions */
.experts-page .top-expert-slide {
  min-height: 400px !important;
}

@media (max-width: 768px) {
  .experts-page .top-expert-slide {
    min-height: 380px !important;
  }
}

@media (max-width: 480px) {
  .experts-page .top-expert-slide {
    min-height: 360px !important;
  }
}

.experts-page .blue-color {
  color: #123484;
}

@media (min-width: 768px) {
  .experts-page img.slider-exp-icon {
    width: 100%;
    height: 200px;
    object-fit: cover;
    margin-top: -100px !important;
  }
}

#badgeModal .modal-footer button {
  background-color: #123484;
}

#badgeModal .modal-footer button:hover {
  background-color: transparent !important;
  border: 1px solid #123484;
  color: #123484;
}

.badge {
  /* display: inline-block;
    padding: .35em .65em; */
  font-size: 0.8em;

  background-color: #123484 !important;
}

#badgeModal .badge {
  white-space: break-spaces !important;
}

#badgeModal .modal-header {
  background-color: #123484 !important;
  color: white !important;
  border-radius: 0px !important;
}

#badgeModal .btn-close {
  box-sizing: content-box;
  width: 1em;
  height: 1em;
  padding: 0.25em 0.25em;
  color: #000;
  background: transparent
    url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e")
    center/1em auto no-repeat;
  border: 0;
  border-radius: 0.25rem;
  opacity: 0.5;
}

.badgeModal-close {
  cursor: pointer;
}