.hp-search {
  --hp-red: #e10613;
  --hp-red-dark: #b9000a;
  --hp-yellow: #ffd438;
  --hp-ink: #f8fafc;
  --hp-muted: #c7ced8;
  --hp-line: #343b46;
  --hp-soft: #1a2029;
  --hp-white: #111720;
  color: var(--hp-ink);
  font-family: inherit;
  width: min(1180px, calc(100% - 28px));
  margin: 28px auto;
}

.hp-app-shell {
  width: 100%;
}

.hp-search * {
  box-sizing: border-box;
}

.hp-search-auto-heading,
.hp-product-catalog {
  width: min(1180px, calc(100% - 28px));
  margin: 28px auto;
}

.hp-search-auto-heading h1,
.hp-product-catalog h2 {
  color: var(--hp-yellow);
  margin: 0 0 16px;
  letter-spacing: 0;
}

.hp-product-catalog p {
  color: var(--hp-muted);
  margin: 0 0 18px;
}

.hp-product-catalog .hp-no-products {
  margin: 0;
  border: 1px solid #343b46;
  border-radius: 8px;
  background: #111720;
  color: #ffd438;
  font-weight: 800;
  padding: 18px 20px;
  text-align: center;
}

.hp-product-catalog__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
  border: 1px solid #343b46;
  border-radius: 6px;
  background: #111720;
  color: #ffd438;
  padding: 12px 16px;
}

.hp-product-catalog__bar strong {
  color: #ffd438;
  font-size: 15px;
}

.hp-product-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}

.hp-product-card {
  overflow: hidden;
  border-radius: 6px;
  background: #111720;
  color: #ffd438;
}

.hp-product-card__media {
  display: block;
  aspect-ratio: 1 / 1;
  background: #eef2f5;
}

.hp-product-card__image,
.hp-product-card__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hp-product-card__body {
  display: grid;
  gap: 10px;
  padding: 16px;
}

.hp-product-card__title {
  margin: 0;
  font-size: 18px;
  line-height: 1.2;
  letter-spacing: 0;
}

.hp-product-card__title a {
  color: #ffd438;
  text-decoration: none;
}

.hp-product-card__price {
  color: #ffd438;
  font-weight: 800;
}

.hp-product-card__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  width: fit-content;
  border-radius: 5px;
  background: #ffd438;
  color: #111720 !important;
  font-weight: 800;
  padding: 0 18px;
  text-decoration: none;
}

.hp-product-card__button:hover,
.hp-product-card__button:focus {
  background: #f5c400;
}

#hp-catalog-fallback > a:first-child,
#hp-catalog-fallback > p:first-child,
.hp-product-catalog > a:first-child,
.hp-product-catalog > p:first-child:has(a[href*="handlopon.pl"]) {
  display: none !important;
}

.woocommerce-ordering,
form.woocommerce-ordering,
.wp-block-woocommerce-sort-select {
  display: none !important;
}

.hp-search__benefits {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  border: 1px solid var(--hp-line);
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
  background: var(--hp-line);
  font-size: 13px;
  font-weight: 700;
}

.hp-search__benefits span {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 8px 12px;
  background: #151b24;
  color: var(--hp-yellow);
  text-align: center;
}

.hp-search__panel {
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--hp-line);
  border-radius: 8px;
  background: var(--hp-white);
  box-shadow: 0 18px 34px rgba(0, 0, 0, .28);
}

.hp-search__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 22px;
  border-bottom: 1px solid var(--hp-line);
}

.hp-search__head h2 {
  margin: 0;
  color: var(--hp-yellow);
  font-size: clamp(24px, 3vw, 32px);
  line-height: 1.08;
  letter-spacing: 0;
}

.hp-search__head p {
  margin: 8px 0 0;
  color: var(--hp-muted);
  font-size: 14px;
  line-height: 1.45;
}

.hp-search__actions {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 0 0 auto;
}

.hp-search__tabs {
  display: flex;
  align-items: center;
}

.hp-search__tabs {
  flex: 0 0 auto;
  overflow: hidden;
  border: 1px solid var(--hp-line);
  border-radius: 6px;
  background: #0f141c;
}

.hp-search button {
  font: inherit;
}

.hp-search__tabs button {
  min-height: 46px;
  border: 0;
  border-right: 1px solid var(--hp-line);
  background: transparent;
  color: var(--hp-ink);
  cursor: pointer;
  font-weight: 800;
}

.hp-search__tabs button {
  min-width: 96px;
  padding: 0 18px;
}

.hp-search__tabs button:last-child,
.hp-search__tabs button:last-child {
  border-right: 0;
}

.hp-search__tabs button.is-active {
  background: var(--hp-red);
  color: #fff;
}

.hp-search__cart {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  border-radius: 6px;
  background: #ffd438;
  color: #111720 !important;
  font-weight: 900;
  padding: 0 16px;
  text-decoration: none;
  white-space: nowrap;
}

.hp-search__body {
  padding: 22px;
}

.hp-search__kind-panel {
  display: none;
}

.hp-search__kind-panel.is-active {
  display: block;
}

.hp-search__section-title {
  display: grid;
  gap: 4px;
  margin-bottom: 16px;
}

.hp-search__section-title strong {
  font-size: 18px;
  line-height: 1.2;
  color: #fff;
}

.hp-search__section-title span {
  color: var(--hp-muted);
  font-size: 14px;
  line-height: 1.4;
}

.hp-search__grid {
  display: grid;
  gap: 14px;
  align-items: end;
}

.hp-search__grid--tyres {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.hp-search__grid--rims {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.hp-search label {
  display: grid;
  gap: 7px;
  margin: 0;
  color: var(--hp-yellow);
  font-size: 13px;
  font-weight: 800;
}

.hp-search select,
.hp-search input {
  width: 100%;
  min-height: 46px;
  margin: 0;
  border: 1px solid #b8c0cc;
  border-radius: 5px;
  background: #f4f6f9;
  color: #0f172a;
  font: inherit;
  padding: 0 12px;
}

.hp-search select:focus,
.hp-search input:focus {
  border-color: var(--hp-red);
  outline: 3px solid rgba(215, 25, 32, .18);
}

.hp-search__submit {
  width: 100%;
  min-height: 46px;
  align-self: end;
  border: 0;
  border-radius: 5px;
  background: var(--hp-red);
  color: #fff;
  cursor: pointer;
  font-weight: 900;
  padding: 0 18px;
}

.hp-search__submit:hover,
.hp-search__submit:focus {
  background: var(--hp-red-dark);
}

.handlopon-search-error {
  padding: 14px 16px;
  border: 1px solid #fecaca;
  border-radius: 6px;
  background: #fff1f2;
  color: #991b1b;
}

@media (max-width: 980px) {
  .hp-product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .hp-search__benefits {
    grid-template-columns: 1fr;
  }

  .hp-search__head {
    align-items: stretch;
    flex-direction: column;
  }

  .hp-search__actions {
    align-items: stretch;
    flex-direction: column;
  }

  .hp-search__tabs {
    align-self: flex-start;
  }

  .hp-search__grid--tyres,
  .hp-search__grid--rims {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .hp-product-grid {
    grid-template-columns: 1fr;
  }

  .hp-search {
    margin: 18px 0;
  }

  .hp-search__head,
  .hp-search__body {
    padding: 16px;
  }

  .hp-search__grid--tyres,
  .hp-search__grid--rims {
    grid-template-columns: 1fr;
  }

  .hp-search__tabs {
    width: 100%;
  }

  .hp-search__cart {
    width: 100%;
  }

  .hp-search__tabs button {
    flex: 1 1 0;
  }
}

body.woocommerce-shop form:not(.hp-search__panel):has(select),
body.woocommerce-shop form:not(.hp-search__panel):has(input[type="checkbox"]),
body.woocommerce-shop form:not(.hp-search__panel):has(input[type="radio"]),
body.woocommerce-shop .widget_layered_nav,
body.woocommerce-shop .widget_price_filter,
body.woocommerce-shop .wpfMainWrapper,
body.woocommerce-shop .wpfFilterWrapper,
body.woocommerce-shop .berocket_single_filter_widget,
body.woocommerce-shop .prdctfltr_wc,
body.woocommerce-shop .yith-wcan-filters,
body.woocommerce-shop .woof,
body.woocommerce-shop .wp-block-woocommerce-filter-wrapper,
body.woocommerce-shop .wc-block-components-filter-wrapper,
body.woocommerce-shop .wp-block-woocommerce-attribute-filter,
body.woocommerce-shop .wp-block-woocommerce-price-filter,
body.woocommerce-shop .wp-block-woocommerce-active-filters,
body.tax-product_cat form:not(.hp-search__panel):has(select),
body.tax-product_cat form:not(.hp-search__panel):has(input[type="checkbox"]),
body.tax-product_cat form:not(.hp-search__panel):has(input[type="radio"]),
body.tax-product_cat .widget_layered_nav,
body.tax-product_cat .widget_price_filter,
body.tax-product_cat .wpfMainWrapper,
body.tax-product_cat .wpfFilterWrapper,
body.tax-product_cat .berocket_single_filter_widget,
body.tax-product_cat .prdctfltr_wc,
body.tax-product_cat .yith-wcan-filters,
body.tax-product_cat .woof,
body.tax-product_cat .wp-block-woocommerce-filter-wrapper,
body.tax-product_cat .wc-block-components-filter-wrapper,
body.tax-product_cat .wp-block-woocommerce-attribute-filter,
body.tax-product_cat .wp-block-woocommerce-price-filter,
body.tax-product_cat .wp-block-woocommerce-active-filters {
  display: none !important;
}
