/* Filter Tooltip Specific Styles */
.filter-dropdown-tooltip {
  width: 28rem;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  border-radius: 1.25rem;
  border: 1px solid var(--Neutral-Stroke, #e9ebec);
  background: var(--Neutral-White, #fff);
  box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.06);
  z-index: 90;
  display: none;
}

.filter-dropdown-tooltip[data-show] {
  display: flex;
}

.dropdown-wrapper .drop-down.checked {
    border-color: #fdc517;
}

.filter-dropdown-tooltip .tooltip-header {
  display: flex;
  padding: 1.25rem 1.5rem;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  align-self: stretch;
  border-bottom: 1px solid var(--Neutral-Stroke, #e9ebec);
}

.filter-dropdown-tooltip .tooltip-header .title {
  color: var(--Neutral-Black, #1a1a1a);
  font-family: "Inter";
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: -0.0125rem;
  flex: 1 0 0;
}

.tooltip-header .close-btn {
  cursor: pointer;
}

.filter-dropdown-tooltip .filter-section {
  display: flex;
  padding: 0.5rem 0rem;
  flex-direction: column;
  align-items: flex-start;
  align-self: stretch;
}

.filter-dropdown-tooltip .filter-group {
  display: flex;
  padding: 0.75rem 1rem 0.75rem 1.5rem;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 0.5rem;
  align-self: stretch;
}

.filter-dropdown-tooltip .filter-label {
  color: var(--Neutral-Dark-Grey, #4f4f4f);
  font-family: "Inter";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.125rem;
  letter-spacing: -0.00875rem;
}

.filter-dropdown-tooltip .filter-options {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.filter-dropdown-tooltip .filter-option {
  display: flex;
  padding: 0.6875rem 1.25rem;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  border-radius: 0.625rem;
  border: 1px solid var(--Neutral-Border, #d5d8dd);
  background: #fff;
  transition: background 0.2s ease
}

.filter-dropdown-tooltip .filter-option:hover {
  background: #FFFAEB;
  border: 1px solid var(--Primary-Button-Gradient, #FDC517);
}

.filter-dropdown-tooltip .filter-option span {
  color: var(--Neutral-Black, #1a1a1a);
  font-family: "Inter";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 600;
  line-height: 1.125rem;
  letter-spacing: -0.00875rem;
}

.filter-option.active {
  background: #fffaeb;
  border-color: #fdc517;
  color: #1a1a1a;
}

.filter-dropdown-tooltip .filter-actions {
  display: flex;
  padding: 1rem 1.5rem;
  justify-content: space-between;
  align-items: flex-start;
  align-self: stretch;
  border-top: 1px solid var(--Neutral-Stroke, #e9ebec);
}

.filter-dropdown-tooltip .clear-btn {
  display: flex;
  padding: 0.75rem 1.25rem;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  border-radius: 0.75rem;
  background: var(--Neutral-Stroke, #e9ebec);
  cursor: pointer;
  transition: all 0.2s ease;
}

.filter-dropdown-tooltip .clear-btn span {
  color: var(--Neutral-Black, #1a1a1a);
  font-family: "Inter";
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25rem; /* 142.857% */
  letter-spacing: -0.00875rem;
}

.filter-dropdown-tooltip .apply-btn {
  display: flex;
  padding: 0.75rem 1.25rem;
  justify-content: center;
  align-items: center;
  gap: 0.25rem;
  border-radius: 0.75rem;
  background: var(
    --Button-Gradient,
    linear-gradient(0deg, #f9c935 0%, #ffda57 100%)
  );
  cursor: pointer;
  transition: all 0.2s ease;
}

.filter-dropdown-tooltip .apply-btn span {
  color: var(--Neutral-Black, #1a1a1a);
  text-align: center;
  font-family: "Inter";
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25rem;
  letter-spacing: -0.005rem;
}

/* Mobile Responsive Styles */
@media screen and (max-width: 768px) {
  .filter-dropdown-tooltip {
    width: 90vw;
    border-radius: 12px;
    background: white;
    box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.15);
  }
}
