/* PrestaHeroes | Amazzing Filter | Momentum | v1.0.0
   Paste into the module's Custom CSS field, without <style> tags.
   Based on the installed module markup and front.css, 2 October 2026.
   Keeps the module's drawer positioning, visibility and filtering behavior.
*/

#amazzing_filter {
  --ph-af-bg: #081412;
  --ph-af-panel: #10201c;
  --ph-af-line: #294b41;
  --ph-af-text: #f2f7f5;
  --ph-af-muted: #b5cbc3;
  --ph-af-mint: #68edb1;
  color: var(--ph-af-text);
  color-scheme: dark;
  font-family: inherit;
  font-size: 14px;
  line-height: 1.45;
  background: var(--ph-af-panel);
  border: 1px solid var(--ph-af-line);
  border-radius: 8px;
  padding: 16px;
  box-shadow: none;
}

#amazzing_filter.block .title_block {
  color: var(--ph-af-text);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.3;
  margin: 0 0 12px;
}

#amazzing_filter .block_content,
#amazzing_filter .af-form,
#amazzing_filter .af_filter_content {
  background: transparent;
  color: var(--ph-af-text);
}

#amazzing_filter .af_filter {
  border-bottom: 1px solid var(--ph-af-line);
  margin-bottom: 8px;
  padding-bottom: 10px;
}

#amazzing_filter .af_filter:last-of-type { border-bottom: 0; margin-bottom: 0; }

#amazzing_filter .af_subtitle {
  color: var(--ph-af-text);
  padding: 13px 22px 13px 0;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
}

#amazzing_filter .af_subtitle.toggle-content::before {
  border-color: var(--ph-af-mint);
  right: 5px;
}

#amazzing_filter .af_filter li { padding-top: 2px; padding-bottom: 2px; }

#amazzing_filter .af_filter label {
  box-sizing: border-box;
  min-height: 36px;
  width: 100%;
  padding: 7px 6px;
  border-radius: 5px;
  color: var(--ph-af-text);
  font-size: 14px;
  line-height: 1.45;
  align-items: flex-start;
  transition: background-color .15s ease, color .15s ease;
}

#amazzing_filter .af_filter .name {
  color: inherit;
  padding-left: 9px;
  overflow-wrap: anywhere;
  min-width: 0;
}

#amazzing_filter .af_filter input[type="checkbox"],
#amazzing_filter .af_filter input[type="radio"] {
  accent-color: var(--ph-af-mint);
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  min-height: 16px;
  margin: 2px 0 0;
  cursor: pointer;
}

#amazzing_filter .af_filter li.active > label,
#amazzing_filter .af_filter label:has(input:checked) {
  color: var(--ph-af-mint);
  background: #193b2e;
}

#amazzing_filter .af_filter input:checked ~ .name { font-weight: 600; }
#amazzing_filter .af_filter .count { color: var(--ph-af-muted); }

/* Selected filters can also be moved above the results by module settings. */
#amazzing_filter .selectedFilters,
.selectedFilters.af {
  color: #f2f7f5;
  margin-bottom: 12px;
}

#amazzing_filter .selectedFilters .clearAll,
.selectedFilters.af .clearAll {
  background: #162c24;
  border: 1px solid #294b41;
  border-radius: 5px;
  padding: 0;
  margin-bottom: 6px;
}

#amazzing_filter .selectedFilters .clearAll a,
.selectedFilters.af .clearAll a {
  color: #b5cbc3;
  padding: 10px;
  line-height: 1.4;
}

#amazzing_filter .selectedFilters .clearAll .txt,
.selectedFilters.af .clearAll .txt {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .08em;
  line-height: inherit;
  margin-top: 0;
  vertical-align: baseline;
}

#amazzing_filter .selectedFilters .cf,
.selectedFilters.af .cf {
  background: #193b2e;
  border: 1px solid #37654f;
  border-radius: 5px;
  color: #d9ffeb;
  padding: 11px 42px 11px 12px;
  margin-bottom: 6px;
  font-size: 14px;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

#amazzing_filter .selectedFilters .cf a {
  color: #68edb1;
  right: 0;
  top: 0;
  bottom: 0;
  width: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 1;
  text-shadow: none;
  font-size: 18px;
}

.selectedFilters.af.inline .cf { padding: 10px 12px; }
.selectedFilters.af.inline .cf a { color: #68edb1; opacity: 1; text-shadow: none; }

#amazzing_filter .qsInput,
#amazzing_filter .input-text,
#amazzing_filter select {
  color: var(--ph-af-text);
  background: var(--ph-af-bg);
  border: 1px solid var(--ph-af-line);
  border-radius: 5px;
  padding: 9px 10px;
}

#amazzing_filter .qsInput::placeholder { color: var(--ph-af-muted); }
#amazzing_filter .toggle-cut-off span { background: var(--ph-af-panel); color: var(--ph-af-mint); }

#amazzing_filter .viewFilteredProducts,
#amazzing_filter .toggleMoreFilters,
#amazzing_filter .compact-toggle {
  color: #081412 !important;
  background: #68edb1 !important;
  border-color: #68edb1 !important;
  font-weight: 700;
  text-shadow: none;
}

#amazzing_filter .viewFilteredProducts,
#amazzing_filter .toggleMoreFilters {
  border-radius: 5px;
  padding: 13px 16px;
  min-height: 44px;
  white-space: normal;
}

#amazzing_filter :is(a, button, input, select):focus-visible {
  outline: 2px solid var(--ph-af-mint);
  outline-offset: 3px;
}

@media (hover: hover) {
  #amazzing_filter .af_filter li:not(.no-matches) > label:hover { background: #193b2e; }
  #amazzing_filter .selectedFilters a:hover { color: #ffffff; }
}

/* Use the module's compact state rather than a competing breakpoint.
   Its 32px sliding tab and both opening directions remain intact. */
.has-compact-filter #amazzing_filter {
  background: #10201c !important;
  color: #f2f7f5;
  border: 0;
  border-radius: 0;
}

.has-compact-filter #amazzing_filter .block_content {
  background: #10201c !important;
  color: #f2f7f5;
  padding: 18px 14px;
  padding-bottom: max(24px, env(safe-area-inset-bottom));
  overscroll-behavior-y: contain;
  scrollbar-color: #37654f #10201c;
}

.has-compact-filter #amazzing_filter .af_filter label {
  min-height: 44px;
  padding: 11px 8px;
}

.has-compact-filter #amazzing_filter .af_subtitle { padding-top: 16px; padding-bottom: 16px; }
.has-compact-filter #amazzing_filter .selectedFilters .clearAll a { min-height: 44px; padding: 13px 10px; }
.has-compact-filter #amazzing_filter .qsInput,
.has-compact-filter #amazzing_filter .input-text,
.has-compact-filter #amazzing_filter select { font-size: 16px; }

.has-compact-filter #amazzing_filter .btn-holder {
  background: #10201c;
  border-top: 1px solid #294b41;
  padding-bottom: max(15px, env(safe-area-inset-bottom));
}

.has-compact-filter.show-filter .af-compact-overlay { background: #020806; opacity: .72; }

@media (prefers-reduced-motion: reduce) {
  #amazzing_filter .af_filter label,
  .has-compact-filter #amazzing_filter.animation-ready,
  .has-compact-filter .af-compact-overlay { transition: none; }
}
