/* KNDev Search Pro frontend styles.
   Canonical v1.4.46: module-owned width, viewport-safe cart-style panel and native product listing result page. */

.knd-search-shell,
.knd-search,
.knd-search__form {
  box-sizing: border-box;
  min-width: 0;
  max-width: 100%;
}

.knd-search-shell {
  display: inline-flex;
  align-items: center;
  vertical-align: middle;
  --knd-search-input-max-width: var(--knd-search-input-width, 320px);
}

.knd-search-shell--desktop { display: inline-flex; }
.knd-search-shell--mobile { display: none !important; }
.knd-search-shell--align-left { margin-inline: 0; }
.knd-search-shell--align-center { margin-inline: auto; }
.knd-search-shell--align-right { margin-inline-start: auto; margin-inline-end: 0; }

.knd-search-shell--width-fixed,
.knd-search--width-fixed {
  width: var(--knd-search-input-width, 320px) !important;
  max-width: 100% !important;
  flex: 0 1 auto !important;
}

.knd-search-shell--width-fluid,
.knd-search--width-fluid {
  width: 100% !important;
  max-width: var(--knd-search-input-max-width, var(--knd-search-input-width, 320px)) !important;
  flex: 1 1 auto !important;
}


/* Inline fields use the configured fixed/fluid width. Icon-overlay triggers
   always remain compact so they cannot consume the mobile action row. */
.knd-search-shell--mode-overlay,
.knd-search-shell--mode-overlay .knd-search--mode-overlay {
  width: auto !important;
  max-width: none !important;
  flex: 0 0 auto !important;
}

.knd-hf-slot > .knd-search-shell--desktop.knd-search-shell--mode-inline.knd-search-shell--width-fluid {
  width: 100% !important;
  max-width: var(--knd-search-input-max-width, var(--knd-search-input-width, 100%)) !important;
  flex: 1 1 0 !important;
}
.knd-hf-slot > .knd-search-shell--desktop.knd-search-shell--mode-inline.knd-search-shell--width-fluid > .knd-search--width-fluid {
  width: 100% !important;
  max-width: 100% !important;
  flex: 1 1 0 !important;
}

.knd-theme-header .knd-hf-slot,
#header .knd-hf-slot,
.knd-hf-slot { min-width: 0; }

.knd-hf-slot:has(.knd-search-shell--width-fluid),
.knd-theme-header .knd-hf-slot:has(.knd-search-shell--width-fluid),
#header .knd-hf-slot:has(.knd-search-shell--width-fluid) {
  flex: 1 1 auto;
  min-width: 0;
}

.knd-hf-slot .knd-search-shell {
  margin-inline: 0 !important;
}

.knd-search {
  position: relative;
  display: inline-block;
  --knd-search-input-max-width: var(--knd-search-input-width, 320px);
}

.knd-search__form {
  display: inline-flex;
  align-items: stretch;
  gap: 0;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0;
}

.knd-search__input,
.knd-search__input.form-control {
  flex: 1 1 auto !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  min-inline-size: 0 !important;
  max-inline-size: none !important;
  height: var(--knd-header-search-height, var(--knd-connected-control-height, var(--knd-button-min-height, 44px))) !important;
  min-height: var(--knd-header-search-height, var(--knd-connected-control-height, var(--knd-button-min-height, 44px))) !important;
  padding: 0 var(--knd-connected-input-padding-x, .95rem) !important;
  border: var(--knd-search-input-border-width, 1px) solid var(--knd-search-input-border-color, var(--knd-connected-input-border-color, var(--knd-input-border-color, var(--knd-color-border, #dbe3e8)))) !important;
  border-inline-end-width: 0 !important;
  border-radius: var(--knd-connected-control-radius, var(--knd-button-border-radius, var(--knd-radius-button, 10px))) 0 0 var(--knd-connected-control-radius, var(--knd-button-border-radius, var(--knd-radius-button, 10px))) !important;
  background: var(--knd-search-input-bg, var(--knd-connected-input-bg, var(--knd-input-bg, #ffffff))) !important;
  color: var(--knd-search-input-color, var(--knd-connected-input-color, var(--knd-input-color, var(--knd-color-text, #111827)))) !important;
  line-height: 1.2 !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}

.knd-search__input:focus,
.knd-search__input.form-control:focus {
  border-color: var(--knd-input-focus-border-color, var(--knd-color-primary, #007f79)) !important;
  border-width: 1px !important;
  box-shadow: none !important;
  outline: none !important;
}

.knd-search__submit,
.knd-search__submit.btn {
  appearance: none !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  height: var(--knd-header-search-height, var(--knd-connected-control-height, var(--knd-button-min-height, 44px))) !important;
  min-height: var(--knd-header-search-height, var(--knd-connected-control-height, var(--knd-button-min-height, 44px))) !important;
  min-width: var(--knd-search-submit-min-width, 64px) !important;
  border-radius: 0 var(--knd-button-border-radius, var(--knd-radius-button, 10px)) var(--knd-button-border-radius, var(--knd-radius-button, 10px)) 0 !important;
  white-space: nowrap !important;
}

.knd-search__submit:is(:hover,:focus-visible,:active),
.knd-search__submit.btn:is(:hover,:focus-visible,:active) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

.knd-search__icon-trigger,
.knd-search__icon-trigger.btn,
.knd-search__icon-trigger.btn.btn-primary-outline {
  appearance: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: var(--knd-header-module-icon-size, var(--knd-header-module-button-min-height, 44px)) !important;
  min-width: var(--knd-header-module-icon-size, var(--knd-header-module-button-min-height, 44px)) !important;
  height: var(--knd-header-module-icon-size, var(--knd-header-module-button-min-height, 44px)) !important;
  min-height: var(--knd-header-module-icon-size, var(--knd-header-module-button-min-height, 44px)) !important;
  padding: 0 !important;
  border: var(--knd-header-module-button-border-width, var(--knd-icon-button-border-width, 1px)) solid var(--knd-header-module-button-border-color, var(--knd-icon-button-border-color, var(--knd-color-border, #dbe3e8))) !important;
  border-radius: var(--knd-header-module-button-radius, var(--knd-button-border-radius, var(--knd-radius-button, 10px))) !important;
  background: var(--knd-header-module-button-bg, var(--knd-icon-button-bg, #ffffff)) !important;
  color: var(--knd-header-module-button-color, var(--knd-icon-button-color, currentColor)) !important;
  box-shadow: var(--knd-header-module-button-shadow, var(--knd-icon-button-shadow, none)) !important;
  cursor: pointer !important;
}

.knd-search__icon-trigger:hover,
.knd-search__icon-trigger:focus-visible {
  border-color: var(--knd-header-module-button-hover-border-color, var(--knd-icon-button-hover-border-color, var(--knd-color-border, #dbe3e8))) !important;
  background: var(--knd-header-module-button-hover-bg, var(--knd-icon-button-hover-bg, #f7f8f8)) !important;
  color: var(--knd-header-module-button-hover-color, var(--knd-icon-button-hover-color, currentColor)) !important;
  outline: none !important;
}

.knd-search__icon,
.knd-search__icon svg {
  display: block;
  width: 20px;
  height: 20px;
}
.knd-search__icon svg,
.knd-search__icon svg * {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}


.knd-search__loader,
.knd-search__empty {
  color: var(--knd-color-muted, #64748b);
}

/* Inline loading status is positioned outside normal flow, so typing never
   changes the header row height. Overlay-mode loading stays in its panel body. */
.knd-search:not(.knd-search--mode-overlay) > .knd-search__loader {
  position: absolute;
  inset-inline-start: 0;
  top: calc(100% + .25rem);
  z-index: 3;
  margin: 0;
  padding: .35rem .55rem;
  background: var(--knd-color-background, #ffffff);
  border: 1px solid var(--knd-color-border, #dbe3e8);
  border-radius: var(--knd-radius-sm, 6px);
  box-shadow: var(--knd-shadow-sm, 0 6px 18px rgb(15 23 42 / 8%));
  white-space: nowrap;
  pointer-events: none;
}

.knd-search-overlay {
  position: fixed;
  inset: 0;
  z-index: var(--knd-modal-z, 9999);
}
.knd-search-overlay__backdrop {
  position: absolute;
  inset: 0;
  background: var(--knd-modal-backdrop-bg, var(--knd-modal-overlay, rgba(15, 23, 42, .52)));
}
.knd-search-overlay__panel {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 2;
  width: 100%;
  background: var(--knd-color-background, #ffffff);
  box-shadow: var(--knd-shadow-panel, 0 24px 70px rgb(15 23 42 / 18%));
  overflow: hidden;
}
.knd-search-overlay__header {
  display: flex;
  align-items: stretch;
  gap: 0;
  padding: calc(env(safe-area-inset-top, 0px) + .75rem) clamp(1rem, 4vw, 2rem) .75rem;
  border-bottom: 1px solid var(--knd-color-border, #dbe3e8);
  background: var(--knd-color-background, #ffffff);
}
.knd-search__form--overlay {
  flex: 1 1 auto;
  width: 100% !important;
  max-width: 100% !important;
}
.knd-search-overlay__cancel { display: none !important; }
.knd-search-overlay__body {
  max-height: calc(100dvh - 74px - env(safe-area-inset-top, 0px));
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

/* Live search drawer positioning only. Header, items, close button and footer
   use the exact Cart Dropdown classes and therefore the same KNDev tokens. */
.knd-search__results[hidden] {
  display: none !important;
}
.knd-search__results,
.knd-search--mode-overlay .knd-search__results--overlay {
  position: fixed !important;
  inset: 0 auto 0 0 !important;
  z-index: var(--knd-search-panel-z-index, 10120) !important;
  display: flex !important;
  flex-direction: column !important;
  width: min(var(--knd-cartdrawer-width, 440px), 100dvw) !important;
  max-width: 100dvw !important;
  height: 100dvh !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: var(--knd-cartdrawer-bg, #ffffff) !important;
  color: var(--knd-cartdrawer-text, var(--knd-color-text, #111827)) !important;
  border: 0 !important;
  border-inline-end: 1px solid var(--knd-cartdrawer-border, var(--knd-color-border, #dbe3e8)) !important;
  border-radius: 0 !important;
  box-shadow: 0 0 0 100vmax rgba(15, 23, 42, .48), var(--knd-cartdrawer-shadow, 0 24px 70px rgb(15 23 42 / 18%)) !important;
  text-align: start !important;
  overscroll-behavior: contain;
  box-sizing: border-box !important;
  overflow-x: hidden !important;
}
.knd-search-panel__body {
  flex: 1 1 auto;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  min-height: 0;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
  box-sizing: border-box !important;
}
.knd-search__results .knd-cartdrawer__content {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  min-height: 100%;
  overflow-x: hidden !important;
  box-sizing: border-box !important;
}
.knd-search__results .knd-cartdrawer__items {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}
.knd-search__results .knd-search-result__item,
.knd-search__results .knd-product-thumb,
.knd-search__results .knd-product-thumb__main,
.knd-search__results .knd-product-thumb__actions,
.knd-search__results .knd-search-result__add-form {
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}
.knd-search__results :is(.knd-product-thumb__name,.knd-product-thumb__excerpt) { overflow-wrap: anywhere !important; }
.knd-search__results .knd-search-result__add { max-width: 100% !important; }
.knd-search-panel__footer {
  position: sticky !important;
  bottom: 0 !important;
  z-index: 4 !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  margin: 0 !important;
  padding: var(--knd-cartdrawer-footer-padding, .75rem) !important;
  background: var(--knd-cartdrawer-bg, #ffffff) !important;
  border-top: 1px solid var(--knd-cartdrawer-border, var(--knd-color-border, #dbe3e8)) !important;
  box-shadow: 0 -10px 24px rgb(15 23 42 / 6%) !important;
  box-sizing: border-box !important;
}
.knd-search-panel__view-all {
  position: relative !important;
  z-index: 2 !important;
  width: 100% !important;
  margin: 0 !important;
  pointer-events: auto !important;
}
.knd-search-result__add-form { width: 100% !important; margin: 0 !important; }
.knd-search-result__add {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: var(--knd-button-icon-gap, .45rem) !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

.knd-search__results,.knd-search-overlay{z-index:var(--knd-search-panel-z-index,10080)!important}
body.knd-search-panel-open,body.knd-search-overlay-open{overflow:hidden}
.knd-search-native-tabs__buttons,.knd-search-results-page__tabs{padding:var(--knd-search-tabs-padding,8px)!important;background:var(--knd-shop-page-bg,var(--knd-page-bg,var(--knd-color-surface,#f6f8fb)))!important;border:1px solid var(--knd-color-border,#d7e7e4)!important;border-radius:var(--knd-radius-card,12px)!important}
.knd-search-native-tabs__buttons .btn,.knd-search-results-page__tabs .btn{margin:0!important}

/* Native search-page tabs add only layout. Buttons, lists, headings and
   product cards remain standard KNDev/PrestaShop components. */
.knd-search-native-tabs {
  margin-block: 1rem 1.5rem;
}
.knd-search-native-tabs__buttons {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
}
.knd-search-native-tabs__panel {
  margin-top: 1rem;
}
.knd-search-native-tabs__panel[hidden],
[data-knd-search-products-section][hidden] {
  display: none !important;
}

.knd-search-results-page { padding-block: clamp(1.5rem, 4vw, 3rem); }
.knd-search-results-page .page-header { margin-bottom: clamp(1.25rem, 3vw, 2rem); }
.knd-search-results-page__tabs {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-bottom: clamp(1.25rem, 3vw, 2rem);
}
.knd-search-results-page__tabs .btn {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  border-radius: 999px !important;
}
.knd-search-results-page__tabs .btn span {
  display: inline-flex;
  min-width: 1.6rem;
  height: 1.6rem;
  align-items: center;
  justify-content: center;
  padding-inline: .4rem;
  background: rgb(255 255 255 / 24%);
  border-radius: 999px;
  font-size: .8rem;
}
.knd-search-results-page__panel { margin-top: 0; }
@media (max-width:575.98px){.knd-search-results-page__tabs{flex-wrap:nowrap;overflow-x:auto}.knd-search-results-page__tabs .btn{flex:0 0 auto}}

@media (max-width: 991.98px) {
  .knd-search-shell--desktop,
  .knd-search--desktop { display: none !important; }
  .knd-search-shell--mobile { display: inline-flex !important; background: transparent !important; }
  .knd-search--mobile { display: inline-block !important; background: transparent !important; }
  .knd-search__form--mobile-inline,
  .knd-search--mobile.knd-search--mode-inline .knd-search__form { display: flex !important; align-items: stretch !important; background: transparent !important; }
  .knd-search-shell--mobile.knd-search-shell--mode-inline.knd-search-shell--width-fixed,
  .knd-search-shell--mobile.knd-search-shell--mode-inline.knd-search-shell--width-fluid,
  .knd-search--mobile.knd-search--mode-inline.knd-search--width-fixed,
  .knd-search--mobile.knd-search--mode-inline.knd-search--width-fluid,
  .knd-search__form--mobile-inline,
  .knd-search--mobile.knd-search--mode-inline .knd-search__form {
    width: 100% !important;
    max-width: 100% !important;
  }
  .knd-search-shell--mobile.knd-search-shell--mode-overlay,
  .knd-search--mobile.knd-search--mode-overlay {
    width: auto !important;
    max-width: none !important;
    flex: 0 0 auto !important;
  }
  .knd-search-shell--mobile.knd-search-shell--mode-inline,
  .knd-search-shell--mobile.knd-search-shell--mode-inline > .knd-search,
  .knd-search-shell--mobile.knd-search-shell--mode-inline .knd-search__form {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }
  .knd-search__form--mobile-inline,
  .knd-search--mobile.knd-search--mode-inline .knd-search__form {
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
  }
  .knd-search--mobile .knd-search__input,
  .knd-search-overlay .knd-search__input {
    font-size:16px !important;
    -webkit-text-size-adjust:100%;
  }
  .knd-search__results,
  .knd-search--mode-overlay .knd-search__results--overlay {
    width:100% !important;
    max-width:100dvw !important;
  }
  .knd-search__results .knd-cartdrawer__items { padding:.75rem !important; }
  .knd-search__results .knd-product-thumb { grid-template-columns:minmax(0,72px) minmax(0,1fr) !important; gap:12px !important; padding:12px !important; }
}


/* KNDev Search Pro v1.4.42: neutral product links in every interaction state. */
html body .knd-search__results :is(a.knd-product-thumb__name,a.knd-cartdrawer__item-name):is(:link,:visited,:hover,:focus-visible,:active),
html body .knd-search__results .knd-search-result__item:is(:hover,:focus-within) :is(a.knd-product-thumb__name,a.knd-cartdrawer__item-name),
html body .knd-search__results :is(.knd-product-thumb__name,.knd-cartdrawer__item-name) {
  color: var(--knd-cartdrawer-text, var(--knd-color-text, #111827)) !important;
  -webkit-text-fill-color: currentColor !important;
  text-decoration: none !important;
}
html body .knd-search__results :is(.knd-product-thumb__excerpt,.knd-cartdrawer__item-attributes),
html body .knd-search__results .knd-search-result__item:is(:hover,:focus-within) :is(.knd-product-thumb__excerpt,.knd-cartdrawer__item-attributes) {
  color: var(--knd-color-text-muted, #64748b) !important;
  -webkit-text-fill-color: currentColor !important;
}
html body .knd-search__results .knd-search-result__item:is(:hover,:focus-within) {
  color: var(--knd-cartdrawer-text, var(--knd-color-text, #111827)) !important;
  -webkit-text-fill-color: currentColor !important;
  background: var(--knd-list-card-item-hover-bg, var(--knd-color-surface, #eef6ff)) !important;
}
html body .knd-search__results .knd-search-result__item a:not(.btn):not(.knd-btn):is(:link,:visited,:hover,:focus-visible,:active),
html body .knd-search__results .knd-search-result__item a:not(.btn):not(.knd-btn) * {
  color: var(--knd-cartdrawer-text, var(--knd-color-text, #111827)) !important;
  -webkit-text-fill-color: currentColor !important;
}