/* yourway-partner/resources: rules added by the site audit. Loads after
   the inline page styles, so equal-specificity rules here win. */

/* The Source column links carry the resource name now, so they may wrap. */
.pg-template-table td:last-child {
  white-space: normal;
}

@media (max-width: 768px) {
  /* The Source link carries the resource name, so on phones the name
     column is the one to drop and the theme tag comes back. */
  .pg-resource-table th:nth-child(1),
  .pg-resource-table td:nth-child(1) {
    display: table-cell;
  }

  .pg-resource-table th:nth-child(2),
  .pg-resource-table td:nth-child(2) {
    display: none;
  }
}

@media (max-width: 620px) {
  /* The timeline stacks: each date heading sits directly above its own
     cell. thead/tbody/tr dissolve (display: contents) so the six cells
     become grid items, and order interleaves heading and cell. */
  .pg-timeline {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    overflow: visible;
  }

  .pg-timeline thead,
  .pg-timeline tbody,
  .pg-timeline tr {
    display: contents;
  }

  .pg-timeline th,
  .pg-timeline td {
    display: block;
    border-left: 0;
    padding-left: 0;
    padding-right: 0;
  }

  .pg-timeline th {
    padding: 20px 0 8px;
    border-bottom: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.18);
  }

  .pg-timeline td {
    padding: 0 0 20px;
    border-top: 0;
  }

  .pg-timeline th:nth-child(1) { order: 1; border-top: 0; padding-top: 0; }
  .pg-timeline td:nth-child(1) { order: 2; }
  .pg-timeline th:nth-child(2) { order: 3; }
  .pg-timeline td:nth-child(2) { order: 4; }
  .pg-timeline th:nth-child(3) { order: 5; }
  .pg-timeline td:nth-child(3) { order: 6; }
}
