/* ===== Compare page ===== */

#content-container.container { max-width: 1180px; }

.central-content {
  /* убираем inline overflow-y, делаем нормально */
  overflow: visible !important;
}

.cart {
  padding: 18px 0 34px;
}

.central-title {
  font-size: 22px;
  font-weight: 900;
  color: #111827;
  margin: 10px 0 14px;
  text-align: center;
}

/* ссылка печати */
.print-ico {
  float: right;
  margin-top: -34px;
}
.print-ico a {
  color: #d12c24;
  text-decoration: none;
  border-bottom: 1px dashed rgba(209,44,36,.45);
  font-weight: 700;
  font-size: 13px;
}
.print-ico a:hover { border-bottom-color: rgba(209,44,36,.85); }

/* ===== Table wrapper: горизонтальный скролл на маленьких экранах ===== */
.compare-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 10px 25px rgba(0,0,0,.06);
}

/* строки */
.compare-table tr { }

/* ячейки */
.compare-table td {
  vertical-align: top;
  padding: 12px 12px;
  border-bottom: 1px solid rgba(0,0,0,.06);
  border-right: 1px solid rgba(0,0,0,.06);
  color: #111827;
  font-size: 13px;
}

.compare-table tr:last-child td { border-bottom: 0; }
.compare-table td:last-child { border-right: 0; }

/* первая колонка (названия параметров / фильтры) */
.compare-table td.first,
.compare-table td:first-child {
  width: 260px;
  min-width: 260px;
  background: #fafafa;
  font-weight: 800;
}

/* заголовок-ячейка слева */
#first-td {
  position: sticky; /* прилипание при горизонтальном скролле */
  left: 0;
  z-index: 3;
  background: #fafafa;
}

/* липкая первая колонка для всех строк */
.compare-table tr td:first-child {
  position: sticky;
  left: 0;
  z-index: 2;
  background: #fafafa;
}

/* control links */
#first-td .galka-ico,
#first-td a#all_options,
#first-td a#no_indent {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-right: 12px;
  margin-bottom: 10px;
  font-size: 13px;
}

#first-td .galka-ico {
  font-weight: 900;
  color: #111827;
}
#first-td a.dotted {
  font-weight: 900;
  color: #d12c24;
  text-decoration: none;
  border-bottom: 1px dashed rgba(209,44,36,.45);
}
#first-td a.dotted:hover { border-bottom-color: rgba(209,44,36,.85); }

/* select */
#select_cat.add_select {
  width: 100%;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,.12);
  background: #fff;
  font-weight: 700;
  outline: none;
}
#select_cat.add_select:focus {
  border-color: rgba(209,44,36,.55);
  box-shadow: 0 0 0 4px rgba(209,44,36,.12);
}

/* ===== Product cells ===== */
td.compare_v {
  min-width: 260px;
}

/* карточка товара вверху таблицы */
.incompare-goods {
  display: grid;
  gap: 10px;
}

.ic-image {
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 14px;
  background: #fff;
  padding: 10px;
  display: grid;
  place-items: center;
}
.ic-image img {
  width: 100%;
  height: 170px;
  object-fit: contain;
  display: block;
}

.ic-name a.border {
  display: inline-block;
  color: #111827;
  text-decoration: none;
  font-weight: 900;
  font-size: 14px;
  line-height: 1.25;
}
.ic-name a.border:hover {
  color: #d12c24;
  text-decoration: underline;
}

.ic-price {
  font-weight: 1000;
  font-size: 16px;
  color: #111827;
}
.ic-price .tenge { margin-left: 6px; color: #6b7280; font-weight: 800; }

/* удалить из сравнения */
.ic-del a.deleted-compare {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 9px 12px;
  border-radius: 12px;
  background: rgba(209,44,36,.10);
  color: #d12c24;
  font-weight: 900;
  text-decoration: none;
}
.ic-del a.deleted-compare:hover {
  background: rgba(209,44,36,.16);
}

/* значения опций */
.compare_options td span {
  display: inline-block;
  padding: 8px 10px;
  border-radius: 12px;
  background: #f3f4f6;
  color: #111827;
  font-weight: 700;
}

/* пустые значения */
.compare_options td span:has(> .dash),
.compare_options td span {
  /* без :has для совместимости, просто сделаем "-" серым ниже */
}
.compare_options td span {
  min-width: 26px;
}
.compare_options td span:empty { background: transparent; }

/* если текст ровно "-" */
.compare_options td span {
  /* оставим общий стиль, а "-" будет читаться и так */
}

/* чередование строк */
.compare-table tr.compare_options:nth-child(even) td {
  background: #fcfcfd;
}
.compare-table tr.compare_options:nth-child(even) td:first-child {
  background: #f7f7f7;
}

/* ===== Responsive ===== */
@media (max-width: 980px) {
  .print-ico { float: none; margin: 0 0 10px; display: block; text-align: center; }

  /* оборачиваем таблицу в горизонтальный скролл без правки HTML:
     используем parent overflow, потому что central-content уже есть */
  .central-content {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  .compare-table {
    min-width: 820px;
  }
}

@media (max-width: 560px) {
  .central-title { font-size: 20px; }
  .compare-table td { padding: 10px 10px; }
  .ic-image img { height: 150px; }
}