/* ===== Протокол24 — legal mobile tables cards v1.7 ===== */

/*
  v1.6 делал scroll-таблицу. Для такой широкой тарифной таблицы это неудобно:
  на мобильной она визуально обрезается. v1.7 переводит таблицу в карточки.
*/

@media (max-width: 767px) {
  body.p24-legal-v13-body {
    overflow-x: hidden !important;
  }

  body.p24-legal-v13-body .p24-legal-shell-v13,
  body.p24-legal-v13-body .p24-legal-content-v13 {
    overflow: visible !important;
    max-width: 100% !important;
  }

  body.p24-legal-v13-body .p24-legal-table-hint-v16 {
    display: none !important;
  }

  body.p24-legal-v13-body .p24-legal-table-wrap-v16,
  body.p24-legal-v13-body .p24-legal-table-scroll-v16 {
    width: 100% !important;
    max-width: 100% !important;
    margin: 20px 0 26px !important;
    padding: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  body.p24-legal-v13-body table.p24-legal-table-card-v17 {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    border: 0 !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    margin: 20px 0 26px !important;
    background: transparent !important;
  }

  body.p24-legal-v13-body table.p24-legal-table-card-v17 thead {
    display: none !important;
  }

  body.p24-legal-v13-body table.p24-legal-table-card-v17 tbody {
    display: grid !important;
    gap: 14px !important;
    width: 100% !important;
  }

  body.p24-legal-v13-body table.p24-legal-table-card-v17 tr {
    display: block !important;
    width: 100% !important;
    background: #fff !important;
    border: 1px solid #dce7f7 !important;
    border-radius: 18px !important;
    overflow: hidden !important;
    box-shadow: 0 12px 34px rgba(16,35,79,.06) !important;
  }

  body.p24-legal-v13-body table.p24-legal-table-card-v17 td,
  body.p24-legal-v13-body table.p24-legal-table-card-v17 th {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    border: 0 !important;
    border-bottom: 1px solid #dce7f7 !important;
    padding: 12px 14px !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    word-break: normal !important;
    overflow-wrap: anywhere !important;
    background: #fff !important;
  }

  body.p24-legal-v13-body table.p24-legal-table-card-v17 tr > td:last-child,
  body.p24-legal-v13-body table.p24-legal-table-card-v17 tr > th:last-child {
    border-bottom: 0 !important;
  }

  body.p24-legal-v13-body table.p24-legal-table-card-v17 td::before,
  body.p24-legal-v13-body table.p24-legal-table-card-v17 th::before {
    content: attr(data-label);
    display: block !important;
    margin: 0 0 5px !important;
    color: #155dfc !important;
    font-size: 11px !important;
    line-height: 1.25 !important;
    font-weight: 950 !important;
    text-transform: uppercase !important;
    letter-spacing: .06em !important;
  }

  body.p24-legal-v13-body table.p24-legal-table-card-v17 td[data-label=""]::before,
  body.p24-legal-v13-body table.p24-legal-table-card-v17 th[data-label=""]::before {
    display: none !important;
  }

  /* Первый столбец строки — как заголовок карточки */
  body.p24-legal-v13-body table.p24-legal-table-card-v17 tr > td:first-child,
  body.p24-legal-v13-body table.p24-legal-table-card-v17 tr > th:first-child {
    background: #eef4ff !important;
    color: #10234f !important;
    font-weight: 950 !important;
    font-size: 15px !important;
  }
}