/* sg24-aa.css — “minimal overrides” clean version */

/* Base z-index variable */
:root {
  --aa-base-z-index: 100000 !important;
  --aa-detached-modal-max-width: none !important;
  --aa-primary-color-rgb: 207, 123, 165;
  --aa-detached-modal-max-height: 80vh !important;
}

/* Panel above UI */
#aa-global .aa-Panel,
#aa-global-portal .aa-Panel {
  z-index: calc(var(--aa-base-z-index) + 1) !important;
}



/* Prevent clipping inside Astra header */
.ast-header-search,
.ast-header-search .ast-search-menu-icon,
.ast-header-search .search-box,
.ast-header-search .search-form {
  overflow: visible !important;
}

/* Lower Swiper if overlapping */
.swiper,
.swiper-container {
  z-index: 5 !important;
}

/* Keep detached button visible */
#aa-global .aa-DetachedSearchButton {
  display: inline-flex;
}

/* Left-align everything */
#aa-global .aa-Panel,
#aa-global-portal .aa-Panel,
#aa-global .aa-Panel *,
.aa-DetachedContainer,
.aa-DetachedContainer * {
  text-align: left !important;
}

/* Item layout */
#aa-global .aa-ItemContent,
.aa-DetachedContainer .aa-ItemContent {
  display: grid !important;
  grid-template-columns: 50px auto;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0.75rem !important;
}
#aa-global .aa-ItemContent:has(.aa-ItemIcon--noBorder),
.aa-DetachedContainer .aa-ItemContent:has(.aa-ItemIcon--noBorder) {
  grid-template-columns: 0 auto;
}

#aa-global .aa-ItemIcon,
.aa-DetachedContainer .aa-ItemIcon {
  width: 100%;
  height: 100%;
  aspect-ratio: 1 / 1;
  padding: 0;
  border-radius: 4px;
  border: 0;
  box-shadow: none;
}

/* No border/padding for items without icon */
#aa-global .aa-ItemIcon--noBorder,
.aa-DetachedContainer .aa-ItemIcon--noBorder {
  border: 0;
  width: 0;
  padding: 0;
}

#aa-global .aa-ItemIcon img,
.aa-DetachedContainer .aa-ItemIcon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  max-width: 100%;
  max-height: 100%;
}

#aa-global .aa-ItemContentBody,
.aa-DetachedContainer .aa-ItemContentBody,
#aa-global .aa-ItemContentTitle,
.aa-DetachedContainer .aa-ItemContentTitle,
#aa-global .aa-ItemContentDescription,
.aa-DetachedContainer .aa-ItemContentDescription {
  text-align: left !important;
  width: 100%;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: anywhere !important;
}

.aa-ItemContentBody {
  gap: 0 !important;
}
.aa-ItemContentDescription {
  color: rgba(var(--aa-text-color-rgb), 0.6);
}

/* Footer centered */
#aa-global .aa-SourceFooter,
.aa-DetachedContainer .aa-SourceFooter {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

/* Styling footer text "See all [number] results" */
.aa-SourceFooter {
  padding: 5px 10px 5px;
  font-size: .75rem;
  text-transform: uppercase;
}
.aa-SourceFooter.deleteSearchHistory {
  padding: 0;
}


/* Make the AA button clickable */
#aa-root-singleton,
#aa-root-singleton .aa-DetachedSearchButton {
  position: relative;
  z-index: 100020 !important;
  pointer-events: auto;
}
#aa-root-singleton .aa-DetachedSearchButton {
  display: none !important;
}

/* Prevent Spectra link overlays from blocking clicks */
.ast-primary-header-bar .spectra-container-link-overlay,
.header-widget-area .spectra-container-link-overlay {
  pointer-events: none !important;
}

/* Restore for icons */
.header-widget-area .d-account-icon .spectra-container-link-overlay,
.header-widget-area .d-wishlist-icon .spectra-container-link-overlay {
  pointer-events: auto !important;
}

/* Trigger always clickable */
[data-aa-trigger],
.sg24-aa-trigger,
#aa-root-singleton .aa-DetachedSearchButton {
  position: relative;
  z-index: 100030 !important;
  pointer-events: auto !important;
}

/* Prevent clipping in all header bars */
.ast-above-header-bar,
.ast-primary-header-bar,
.ast-below-header-bar {
  overflow: visible !important;
}




/* Make the fake input expand fully */
.sg24-aa-trigger {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.6rem;

  width: 100%;
  min-width: 220px;
  /* ensures readable area even if container small */
  height: 42px;

  padding: 0 1rem;
  border: 1px solid #ccc;
  border-radius: 9999px;
  background-color: #fff;

  font-size: 1rem;
  color: #828282;
  text-align: left;
  cursor: pointer;

  box-sizing: border-box;
  appearance: none;

  transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;

}
@media screen and (max-width: 600px) {
  .sg24-aa-trigger {
    font-size: 0.9rem;
    padding: 0 1.5rem;
  }

}
/* Stretch fully in Astra header too */
.ast-header-search .sg24-aa-trigger,
.ast-above-header-bar .sg24-aa-trigger,
.ast-primary-header-bar .sg24-aa-trigger {
  width: 100% !important;
  flex: 1 1 auto;
}

/* Icon behavior */
.sg24-aa-trigger svg {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  opacity: 0.7;
  margin-top: 1px;
}

/* Placeholder-like text */
.sg24-aa-trigger span {
  flex: 1;
  color: #777;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Hover + focus states */
.sg24-aa-trigger:hover,
.sg24-aa-trigger:focus,
.sg24-aa-trigger:focus-visible {
  border-color: rgb(var(--aa-primary-color-rgb), 1);
  background-color: #fafafa;
  box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.07);
  outline: none;
}

/* Slight “click” effect */
.sg24-aa-trigger:active {
  background-color: #f0f0f0;
  transform: scale(0.99);
}

/* Repoziționează detached exact peste buton */
.aa-DetachedContainer {
  position: fixed !important;
  top: var(--aa-top, 0px) !important;
  left: var(--aa-left, 0px) !important;
  width: var(--aa-width, 100vw) !important;
  right: auto !important;
  margin: 0 !important;
  z-index: 100060 !important;
}


/* opțional: păstrează aceeași înălțime/feel ca butonul */
.aa-DetachedContainer .aa-Form {
  height: 42px;
  border-radius: 9999px;
}

/* Evită ca textul să devină alb la hover peste “search button-ul” */
.sg24-aa-trigger:hover,
.sg24-aa-trigger:focus {
  color: #333 !important;
}

/* Asigură și textul interior (span) */
.sg24-aa-trigger:hover span,
.sg24-aa-trigger:focus span {
  color: #333 !important;
}

/* (opțional) culoarea iconului la hover */
.sg24-aa-trigger:hover svg path,
.sg24-aa-trigger:focus svg path {
  stroke: currentColor;
  fill: currentColor;
  opacity: 0.8;
}

/* Elimină margin-bottom la paragraful din buton */
.ast-builder-html-element p {
  margin-bottom: 0;
}

/* Elimină spațiile inutile în buton */
.sg24-aa-trigger br {
  display: none;
}

/* Stilizare input în detached container */
.aa-Input {
  border-radius: 9999px !important;
  border: 0 !important;
  background: transparent !important;
  padding-left: 0 !important;
}

/* Elimină shadow pe butoane */
.aa-DetachedContainer button {
  box-shadow: none !important;
}

/* Hover pentru butoanele din detached container */
.aa-DetachedContainer button:hover {
  background-color: inherit;
  border-color: inherit;
}
/* Hover pentru butonul de cancel */
.aa-DetachedContainer .aa-DetachedCancelButton:hover {
  color: rgb(var(--aa-primary-color-rgb), 0.8) !important;
}
/* Hover pentru iconița search */
.aa-DetachedContainer .aa-Label svg:hover {
  color: rgb(var(--aa-primary-color-rgb), 0.8) !important;
}
/* Centrare iconița search */
.aa-SubmitButton {
  display: flex;
  align-items: center;
  justify-content: center;
}

.aa-SourceFooter button {
  color: rgba(var(--aa-muted-color-rgb),var(--aa-muted-color-alpha))!important;
  text-decoration: none !important;
  font-size: 12px;
  text-transform: uppercase;
}
.aa-SourceFooter button[data-aa-clear-recent="true"] {
  margin-top: 0 !important;
}
/* Fix ca detached overlay să fie deasupra butonului de filters pe mobil */
.aa-DetachedOverlay {
  z-index: 2147483001;
}
@media screen and (max-width: 767px) {
  .aa-DetachedContainer {
    max-height: 80vh !important;
  }
  .aa-DetachedContainer .aa-PanelLayout {
    overflow: auto !important;
    -webkit-overflow-scrolling: touch !important;
    /* smooth native scrolling on iOS */
    scrollbar-width: thin !important;
    /* Firefox */
    scrollbar-color: rgba(0, 0, 0, 0.25) transparent !important;
  }

  /* WebKit browsers */
  .aa-DetachedContainer .aa-PanelLayout::-webkit-scrollbar {
    width: 10px;
    height: 10px;
  }
  .aa-DetachedContainer .aa-PanelLayout::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.25);
    border-radius: 8px;
  }
  .aa-DetachedContainer .aa-PanelLayout::-webkit-scrollbar-track {
    background: transparent;
  }
}