/* CSS для таблиц: оформление адаптивной таблицы доставки */

/* Подключение шрифта Manrope */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700&display=swap');

/* Основные переменные таблицы */
:root {
  --table-green-border: #B1E016;
  --table-green-text: #2FA99A;
  --table-text-color: #000000;
  --table-card-bg: #ffffff;
  --table-header-bg: rgba(177, 224, 22, 0.16);
}

/* Обертка таблицы */
.delivery-table-wrap {
  width: 100%;
  max-width: 1160px;
  margin: 0 auto;
}

/* Основная таблица */
.delivery-table {
  width: 100%;
  border-collapse: collapse;
  border: 1.5px solid var(--table-green-border);
  box-shadow: none;
  font-family: "Manrope", sans-serif;
}

/* Границы и базовое оформление ячеек таблицы */
.delivery-table th,
.delivery-table td {
  border: 1.5px solid var(--table-green-border);
  padding: 10px 18px;
  text-align: center;
  vertical-align: middle;
  font-size: 16px;
  line-height: 1.45;
  color: var(--table-text-color);
  font-family: "Manrope", sans-serif;
}

/* Заголовки таблицы на десктопе */
.delivery-table th {
  color: var(--table-green-text);
  font-weight: 700;
  background: var(--table-header-bg);
}

/* Первый столбец таблицы */
.delivery-table td:first-child {
  font-weight: 700;
}

/* Адаптация таблицы под экраны меньше 640px */
@media screen and (max-width: 640px) {
  .delivery-table-wrap {
    max-width: 100%;
  }

  .delivery-table {
    border: none;
  }

  .delivery-table thead {
    display: none;
  }

  .delivery-table,
  .delivery-table tbody,
  .delivery-table tr,
  .delivery-table td {
    display: block;
    width: 100%;
  }

  /* Границы мобильных карточек */
  .delivery-table tr {
    margin-bottom: 14px;
    border: 1.5px solid var(--table-green-border);
    background: var(--table-card-bg);
  }

  /* Ячейки внутри мобильных карточек */
  .delivery-table td {
    border: none;
    border-bottom: 1.5px solid var(--table-green-border);
    padding: 10px 12px;
    text-align: left;
    font-size: 15px;
    line-height: 1.45;
    box-sizing: border-box;
  }

  .delivery-table td:last-child {
    border-bottom: none;
  }

  /* Заголовок мобильной карточки: первый столбец */
  .delivery-table td:first-child {
    color: var(--table-green-text);
    font-weight: 700;
    font-size: 16px;
    text-align: center;
    background: var(--table-header-bg);
  }

  /* Подписи полей внутри мобильной карточки */
  .delivery-table td:not(:first-child)::before {
    content: attr(data-label) ": ";
    display: block;
    margin-bottom: 4px;
    font-weight: 700;
    color: var(--table-green-text);
  }
}
@media screen and (max-width: 960px) {
  .hide-table-mobile {
    display: none !important;
  }
}