/* Seven days form a compact strip with movable controls at either end. */
.card-row[data-section='days-row'] {
  display: grid;
  grid-template-columns: 38px repeat(7, minmax(0, 1fr)) 38px;
  gap: 20px;
  align-items: center;
}
.card-row[data-section='days-row'] .card-slot { width: 100%; }
.card-row[data-section='days-row'] .card-slot[data-kind='token'] { width: 38px; }
.card-slot[data-kind='token'], .card-wrapper.kind-token { width: 38px; height: 36px; aspect-ratio: auto; }
.card-slot[data-id='days-previous'] { grid-column: 1; grid-row: 1; }
.card-slot[data-id='days-next'] { grid-column: 9; grid-row: 1; }
.days-arrow.table-token {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 36px;
  padding: 7px;
}
.days-arrow svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.days-arrow:disabled { opacity: .3; cursor: grab; }
/* Dates keep their printed reading size even when the cards are small. */
.card-wrapper[data-id^='day-'] .tc-title {
  font-size: calc(13px / var(--face-scale, 1));
  letter-spacing: .055em;
  line-height: 1.25;
}
.card-wrapper[data-id^='day-'] .tc-type-line,
.card-wrapper[data-id^='day-'] .card-open { font-size: calc(9px / var(--face-scale, 1)); }

@media (min-width: 761px) and (max-width: 1100px) {
  .card-row[data-section='days-row'] { grid-template-columns: 38px repeat(4, minmax(0, 1fr)) 38px; gap: 30px 20px; }
  .card-slot[data-id='days-previous'] { grid-row: 1 / span 2; }
  .card-slot[data-id='days-next'] { grid-column: 6; grid-row: 1 / span 2; }
}

@media (max-width: 760px) {
  .card-row[data-section='days-row'] { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 26px; }
  .card-slot[data-id='days-previous'], .card-slot[data-id='days-next'] { width: 38px; grid-row: var(--paging-row, 5); }
  .card-slot[data-id='days-previous'] { grid-column: 1; justify-self: end; }
  .card-slot[data-id='days-next'] { grid-column: 2; justify-self: start; }
}
