/**
 * Каталог /products — таблица и фильтры (макет v2).
 */

/*#region Каркас страницы */
body.path-products {
  background-color: var(--prut-bg, #f4f5f8);
  color: var(--prut-text, #2a2a33);
}

body.path-products .site-main {
  padding: 1.5rem 0 3rem;
  background-color: var(--prut-bg, #f4f5f8);
}

body.path-products #block-mega-prut-page-title h1,
body.path-products .page-title {
  margin: 0 0 1.5rem;
  font-size: clamp(1.75rem, 4vw, 2.25rem);
  font-weight: 700;
  line-height: 1.2;
  color: var(--prut-text, #2a2a33);
}

body.path-products .test-filter,
body.path-products .test-filter .view-content,
body.path-products .test-filter .view-content.row,
body.path-products .table-views-nostr.table-responsive {
  overflow: visible !important;
  max-height: none !important;
  height: auto !important;
}

body.path-products .test-filter::after {
  content: "";
  display: table;
  clear: both;
}
/*#endregion */

/*#region Сетка: фильтры + таблица */
@media (min-width: 1200px) {
  body.path-products .test-filter .view-filters,
  body.path-products .test-filter > form.views-exposed-form {
    float: left;
    width: 260px;
    max-width: 260px;
    box-sizing: border-box;
  }

  body.path-products .test-filter .view-content {
    float: none !important;
    width: auto !important;
    margin-left: 280px !important;
    margin-top: 0;
  }
}

@media (max-width: 1199px) {
  body.path-products .test-filter .view-filters,
  body.path-products .test-filter > form.views-exposed-form {
    width: 100%;
    margin-bottom: 1rem;
  }

  body.path-products .test-filter .view-content {
    margin-left: 0 !important;
    width: 100% !important;
  }
}
/*#endregion */

/*#region Переключатель фильтров (мобильный) */
body.path-products .views-filter-hide-toggle {
  display: none;
}

@media (max-width: 1199px) {
  body.path-products .views-filter-hide-toggle {
    display: block;
    width: 100%;
    margin-bottom: 0.75rem;
    padding: 0.75rem 1rem;
    text-align: center;
    font-size: 1rem;
    font-weight: 600;
    color: var(--prut-navy, #1b1547);
    background: var(--prut-surface, #fff);
    border: 1px solid var(--prut-border, #e2e5ec);
    border-radius: var(--prut-radius-sm, 8px);
    cursor: pointer;
    transition: background var(--prut-transition, 0.2s ease);
  }

  body.path-products .views-filter-hide-toggle:hover {
    background: var(--prut-primary-soft, rgba(130, 0, 0, 0.08));
  }
}
/*#endregion */

/*#region Боковые фильтры */
body.path-products .test-filter .view-filters,
body.path-products .test-filter > form.views-exposed-form,
body.path-products .test-filter > form.views-exposed-form {
  padding: 1.25rem 1.1rem;
  background: var(--prut-surface, #fff);
  border: 1px solid var(--prut-border, #e2e5ec);
  border-radius: var(--prut-radius, 12px);
  box-shadow: var(--prut-shadow-sm, 0 2px 8px rgba(20, 20, 31, 0.06));
}

body.path-products .test-filter .view-filters fieldset,
body.path-products .test-filter > form.views-exposed-form fieldset,
body.path-products .test-filter > form.views-exposed-form fieldset {
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
}

body.path-products .test-filter .view-filters fieldset + fieldset,
body.path-products .test-filter > form.views-exposed-form fieldset + fieldset,
body.path-products .test-filter > form.views-exposed-form fieldset + fieldset {
  margin-top: 1.25rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--prut-border, #e2e5ec);
}

body.path-products .test-filter .view-filters legend .fieldset-legend,
body.path-products .test-filter > form.views-exposed-form legend .fieldset-legend,
body.path-products .test-filter > form.views-exposed-form legend .fieldset-legend {
  display: block;
  margin-bottom: 0.75rem;
  font-size: 1rem;
  font-weight: 700;
  color: var(--prut-navy, #1b1547);
}

body.path-products .test-filter .view-filters .fieldset-wrapper > div > div,
body.path-products .test-filter > form.views-exposed-form .fieldset-wrapper > div > div,
body.path-products .test-filter > form.views-exposed-form .fieldset-wrapper > div > div {
  max-height: 240px;
  overflow-y: auto;
  overflow-x: hidden;
}

body.path-products .test-filter .view-filters .form-check,
body.path-products .test-filter > form.views-exposed-form .form-check,
body.path-products .test-filter > form.views-exposed-form .form-check {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  margin: 0.35rem 0;
}

body.path-products .test-filter .view-filters .form-check label,
body.path-products .test-filter > form.views-exposed-form .form-check label,
body.path-products .test-filter > form.views-exposed-form .form-check label {
  margin: 0;
  font-size: 0.9375rem;
  color: var(--prut-text, #2a2a33);
  cursor: pointer;
}

body.path-products .test-filter .view-filters .form-check input,
body.path-products .test-filter > form.views-exposed-form .form-check input,
body.path-products .test-filter > form.views-exposed-form .form-check input {
  width: 1rem;
  height: 1rem;
  margin: 0;
  accent-color: var(--prut-primary, #820000);
}

body.path-products .test-filter .view-filters .form-actions,
body.path-products .test-filter > form.views-exposed-form .form-actions,
body.path-products .test-filter > form.views-exposed-form .form-actions {
  display: none;
  margin-top: 1rem;
}

body.path-products .test-filter .view-filters .form-actions.submit-filter,
body.path-products .test-filter .view-filters .form-actions.submit-filter-slider,
body.path-products .test-filter > form.views-exposed-form .form-actions.submit-filter,
body.path-products .test-filter > form.views-exposed-form .form-actions.submit-filter-slider,
body.path-products .test-filter > form.views-exposed-form .form-actions.submit-filter-slider {
  display: flex;
  gap: 0.5rem;
  position: sticky;
  bottom: 0.25rem;
}

body.path-products .test-filter .view-filters .form-actions button,
body.path-products .test-filter > form.views-exposed-form .form-actions button,
body.path-products .test-filter > form.views-exposed-form .form-actions button {
  flex: 1;
  min-height: 40px;
  border-radius: var(--prut-radius-sm, 8px);
  font-weight: 600;
}

body.path-products .test-filter .view-filters .form-actions button[data-drupal-selector="edit-submit-0-prutki-tovar"],
body.path-products .test-filter > form.views-exposed-form .form-actions button[type="submit"]:first-child,
body.path-products .test-filter > form.views-exposed-form .form-actions button[type="submit"]:first-child {
  background: var(--prut-primary, #820000);
  border-color: var(--prut-primary, #820000);
  color: #fff;
}

body.path-products .test-filter .view-filters .form-actions button[data-drupal-selector="edit-reset"],
body.path-products .test-filter > form.views-exposed-form .form-actions button[type="submit"]:last-child,
body.path-products .test-filter > form.views-exposed-form .form-actions button[type="submit"]:last-child {
  background: transparent;
  border: 1px solid var(--prut-border-strong, #c8cdd8);
  color: var(--prut-text, #2a2a33);
}
/*#endregion */

/*#region Таблица */
body.path-products .table-views-nostr.table-responsive {
  display: block;
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-radius: var(--prut-radius, 12px);
  border: 1px solid var(--prut-border, #e2e5ec);
  box-shadow: var(--prut-shadow-sm, 0 2px 8px rgba(20, 20, 31, 0.06));
  background: var(--prut-surface, #fff);
}

body.path-products .table-views-nostr table {
  width: 100%;
  min-width: 920px;
  margin: 0;
  border-collapse: collapse;
}

body.path-products .table-views-nostr table thead th {
  padding: 0.85rem 0.65rem;
  font-size: 0.875rem;
  font-weight: 600;
  text-align: center;
  vertical-align: middle;
  color: #fff;
  background: var(--prut-navy, #1b1547);
  border: 1px solid #2a2270;
  white-space: nowrap;
}

body.path-products .table-views-nostr table tbody tr:nth-child(odd) {
  background: var(--prut-surface, #fff);
}

body.path-products .table-views-nostr table tbody tr:nth-child(even) {
  background: #fafbfc;
}

body.path-products .table-views-nostr table tbody td {
  padding: 0.65rem 0.55rem;
  font-size: 0.9375rem;
  vertical-align: middle;
  border: 1px solid var(--prut-border, #e2e5ec);
  color: var(--prut-text, #2a2a33);
}

body.path-products td.views-field.views-field-title {
  min-width: 220px;
  max-width: 360px;
}

body.path-products td.views-field.views-field-title a {
  color: var(--prut-navy, #1b1547) !important;
  text-decoration: none;
  font-weight: 500;
  line-height: 1.35;
}

body.path-products td.views-field.views-field-title a:hover {
  color: var(--prut-primary, #820000) !important;
  text-decoration: underline;
}

body.path-products td.views-field.views-field-field-img img {
  width: 56px;
  height: auto;
  margin: 0;
  border-radius: 6px;
}

body.path-products td.views-field.views-field-price__number {
  font-weight: 700;
  white-space: nowrap;
}

body.path-products td.views-field.views-field-field-stock-level {
  text-align: center;
  font-variant-numeric: tabular-nums;
}

/* Цветовой кружок */
body.path-products td.views-field-field-cvet.catalog-swatch {
  text-align: center;
}

body.path-products td.views-field-field-cvet.catalog-swatch .catalog-swatch__dot {
  display: inline-block;
  width: 14px;
  height: 14px;
  margin-right: 0.45rem;
  border-radius: 50%;
  border: 1px solid rgba(0, 0, 0, 0.12);
  vertical-align: middle;
}

body.path-products td.views-field-field-cvet.catalog-swatch--rainbow .catalog-swatch__dot {
  background: linear-gradient(135deg, #e11d48, #f59e0b, #22c55e, #3b82f6, #a855f7);
}
/*#endregion */

/*#region Колонка «В корзину» */
body.path-products td.views-cart {
  width: 72px;
  min-width: 72px;
  text-align: center;
}

body.path-products td.views-cart form {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
}

body.path-products td.views-cart .field--name-quantity,
body.path-products td.views-cart .field--name-purchased-entity,
body.path-products td.views-cart .add-to-cart-message,
body.path-products td.views-cart .add-to-cart-message {
  display: none !important;
}

body.path-products td.views-cart .form-actions {
  margin: 0 !important;
}

body.path-products td.views-cart .button--add-to-cart {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  min-width: 40px;
  padding: 0;
  border: none;
  border-radius: 50%;
  background-color: var(--prut-primary, #820000);
  background-image: url(../images/cart-icon-white.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px 18px;
  color: transparent;
  font-size: 0;
  line-height: 0;
  overflow: visible;
  cursor: pointer;
  transition: background-color var(--prut-transition, 0.2s ease), transform var(--prut-transition, 0.2s ease);
}

body.path-products td.views-cart .button--add-to-cart::before {
  content: none;
  display: none;
}

body.path-products td.views-cart .button--add-to-cart:hover:not(.is-disabled) {
  background-color: var(--prut-primary-hover, #a30000);
  transform: scale(1.05);
}

body.path-products td.views-cart .button--add-to-cart.is-disabled {
  opacity: 0.45;
  cursor: not-allowed;
  transform: none;
}

body.path-products .views-cart .ajax-progress.ajax-progress-throbber {
  position: fixed;
  top: 120px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1000;
  padding: 0.75rem 1.25rem;
  font-size: 1rem;
  font-weight: 600;
  color: #fff;
  background: var(--prut-navy, #1b1547);
  border-radius: var(--prut-radius-sm, 8px);
  box-shadow: var(--prut-shadow, 0 8px 32px rgba(20, 20, 31, 0.1));
}
/*#endregion */

/*#region Пагинация и пустой результат */
body.path-products .test-filter > .pager,
body.path-products .test-filter nav.pager,
body.path-products .test-filter nav.pager {
  clear: both;
  width: 100%;
  margin-top: 1.75rem;
  padding-top: 0.25rem;
}

body.path-products .test-filter .pager__items {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  justify-content: center;
  align-items: center;
  list-style: none;
  padding: 0;
  margin: 0;
}

body.path-products .test-filter .pager__item {
  margin: 0;
}

body.path-products .test-filter .pager__item a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.5rem;
  min-height: 2.5rem;
  padding: 0 0.75rem;
  border-radius: var(--prut-radius-sm, 8px);
  border: 1px solid var(--prut-border, #e2e5ec);
  background: var(--prut-surface, #fff);
  color: var(--prut-navy, #1b1547);
  text-decoration: none;
  font-size: 0.9375rem;
  font-weight: 500;
  box-shadow: var(--prut-shadow-sm, 0 2px 8px rgba(20, 20, 31, 0.06));
  transition: border-color var(--prut-transition, 0.2s ease), color var(--prut-transition, 0.2s ease), background var(--prut-transition, 0.2s ease);
}

body.path-products .test-filter .pager__item a span {
  display: inline;
  min-width: 0;
  min-height: 0;
  padding: 0;
  margin: 0;
  border: none;
  background: transparent;
  box-shadow: none;
  font-weight: inherit;
  color: inherit;
}

body.path-products .test-filter .pager__item.is-active a {
  background: var(--prut-primary, #820000);
  border-color: var(--prut-primary, #820000);
  color: #fff;
  font-weight: 600;
}

body.path-products .test-filter .pager__item a:hover {
  border-color: var(--prut-primary, #820000);
  color: var(--prut-primary, #820000);
}

body.path-products .test-filter .pager__item.is-active a:hover {
  background: var(--prut-primary-hover, #a30000);
  border-color: var(--prut-primary-hover, #a30000);
  color: #fff;
}

body.path-products .test-filter .pager__item--next a,
body.path-products .test-filter .pager__item--last a,
body.path-products .test-filter .pager__item--first a,
body.path-products .test-filter .pager__item--previous a,
body.path-products .test-filter .pager__item--previous a {
  min-width: auto;
  padding: 0 1rem;
}

body.path-products .view-empty {
  margin: 2rem auto;
  padding: 1.5rem;
  max-width: 36rem;
  text-align: center;
  font-size: 1.05rem;
  color: var(--prut-primary, #820000);
  background: var(--prut-surface, #fff);
  border: 1px solid var(--prut-border, #e2e5ec);
  border-radius: var(--prut-radius, 12px);
}
/*#endregion */

/*#region Мобильная таблица каталога — только фото, название, корзина */
@media (max-width: 799px) {
  body.path-products .test-filter > .pager,
body.path-products .test-filter nav.pager,
body.path-products .test-filter > .pager,
body.path-products .test-filter nav.pager {
    margin-top: 1.25rem;
  }

  body.path-products .table-views-nostr.table-responsive {
    border: none;
    box-shadow: none;
    background: transparent;
    overflow: visible;
  }

  body.path-products .table-views-nostr table {
    min-width: 0;
    border: none;
  }

  body.path-products .table-views-nostr table thead {
    display: none;
  }

  body.path-products .table-views-nostr table tbody tr {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr) 48px;
    grid-template-areas:
      "img title cart";
    gap: 0.65rem 0.75rem;
    align-items: center;
    margin-bottom: 0.65rem;
    padding: 0.75rem;
    border: 1px solid var(--prut-border, #e2e5ec);
    border-radius: var(--prut-radius, 12px);
    background: var(--prut-surface, #fff);
    box-shadow: var(--prut-shadow-sm, 0 2px 8px rgba(20, 20, 31, 0.06));
  }

  body.path-products .table-views-nostr table tbody tr:nth-child(even) {
    background: var(--prut-surface, #fff);
  }

  body.path-products .table-views-nostr table tbody td {
    display: none;
    padding: 0;
    border: none;
    background: transparent;
  }

  body.path-products .table-views-nostr table tbody td.views-field-field-img {
    display: block;
    grid-area: img;
  }

  body.path-products .table-views-nostr table tbody td.views-field-title {
    display: block;
    grid-area: title;
    min-width: 0;
    max-width: none;
  }

  body.path-products .table-views-nostr table tbody td.views-field-title a {
    font-size: 0.9rem;
    line-height: 1.35;
  }

  body.path-products .table-views-nostr table tbody td.views-field-variations-target-id,
body.path-products .table-views-nostr table tbody td.views-cart,
body.path-products .table-views-nostr table tbody td.views-field-variations-target-id,
body.path-products .table-views-nostr table tbody td.views-cart {
    display: block;
    grid-area: cart;
    width: auto;
    min-width: 0;
    text-align: center;
  }

  body.path-products td.views-field-field-img img {
    width: 56px;
  }

  body.path-products td.views-cart .button--add-to-cart {
    width: 40px;
    height: 40px;
    min-width: 40px;
  }
}
/*#endregion */
