/* Search Results Styling */
.search-results .blog-post-item.type-product {
  max-width: 800px;
}
.search-results
  .blog-post-item.type-product
  .blog-post-content:not(.blog-details-content)
  .post-text {
  margin: 0 0;
}
.search-results .blog-post-item.type-product .blog-post-content .post-text p {
  margin: 0 0;
}
.search-results .blog-post-item.type-product .blog-post-content .title {
  margin-bottom: 15px;
}

/* Sticky Tab Selector */
.tab-selector {
  background: #ffffff;
  z-index: 8; /* Lower than header */
  position: relative;
  width: 100%;
  padding: 15px;
}

/* Container that will maintain the height when tab becomes sticky */
.tab-selector-container {
  position: relative;
  transition: min-height 0.3s ease;
}

.tab-selector.sticky {
  position: fixed;
  top: var(--header-height, 96px); /* Dynamic header height */
  left: 0;
  right: 0;
  background: rgba(255, 255, 255, 0.98);
  backdrop-filter: blur(5px);
  z-index: 8;
  margin: 0 auto !important;
  display: flex;
  align-items: center;
  max-width: var(--content-width);
  padding: 15px;
}

/* Make sure header stays above the sticky tab */
.sticky-header {
  position: relative;
  z-index: 100 !important;
}

/* Adjust content below the tab selector */
.tab-selector + * {
  position: relative;
  z-index: 1;
}

/* Add padding to the content below the sticky element to prevent jump */
.tab-selector-container {
  transition: padding-top 0.3s ease;
  position: relative;
}

.tab-selector-container.sticky-padding {
  padding-top: 60px; /* Adjust this value based on your tab selector's height */
}

.title-highlight {
  position: relative;
  display: inline-block;
  z-index: 1;
  font-size: var(--e-global-typography-primary-font-size);
  font-weight: var(--e-global-typography-primary-font-weight);
  color: var(--e-global-color-primary);
}

.title-highlight::after {
  content: "";
  position: absolute;
  background: #c2ecff;
  width: 100%;
  height: 5px;
  bottom: -8px;
  left: 0;
  z-index: -1;
}

.custom-gradient-background {
  background: linear-gradient(
    116.33deg,
    #c0e5f6 1.12%,
    rgba(215, 239, 249, 0.633663) 9.08%,
    rgba(255, 255, 255, 0) 52.97%,
    #c2ecff 80.02%
  );
}

.custom-view-all a {
  color: var(--tg-primary-color);
  font-size: var(--e-global-typography-accent-font-size);
  font-weight: var(--e-global-typography-accent-font-weight);
}

@keyframes slideDown {
  from {
    transform: translateY(-100%);
  }
  to {
    transform: translateY(0);
  }
}

/* Fix for horizontal scrollbar caused by negative margins on mobile (especially iOS) */
.main-area {
  overflow-x: hidden;
}