.day-accordions {
  display: grid;
  gap: 10px;
}

.day-accordion {
  overflow: hidden;
  border-radius: var(--radius);
  background: var(--panel);
}

.day-accordion__summary {
  display: grid;
  grid-template-columns: minmax(110px, auto) minmax(0, 1fr) auto 24px;
  align-items: center;
  gap: 6px 18px;
  min-height: 62px;
  padding: 12px 16px;
  list-style: none;
  cursor: pointer;
}

.day-accordion__summary::-webkit-details-marker {
  display: none;
}

.day-accordion__summary:hover {
  background: var(--soft);
}

.day-accordion__title {
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 700;
}

.day-accordion__date {
  color: var(--mut);
  font-size: 15px;
}

.day-accordion__result {
  font-size: 15px;
  font-weight: 600;
}

.day-accordion__chevron {
  justify-self: center;
  width: 10px;
  height: 10px;
  border-right: 2px solid currentcolor;
  border-bottom: 2px solid currentcolor;
  transform: rotate(45deg);
  transition: transform 0.25s;
}

.day-accordion[open] .day-accordion__chevron {
  transform: rotate(225deg);
}

.day-accordion__content {
  margin: 0 16px;
  border-top: 1px solid var(--line);
}

.day-accordion[open] .day-accordion__content {
  animation: day-open 0.32s var(--ease-out);
}

@keyframes day-open {
  from {
    opacity: 0;
    transform: translateY(-6px);
  }
}

@media (max-width: 759.98px) {
  .day-accordion__summary {
    grid-template-columns: minmax(0, 1fr) 24px;
    gap: 2px 10px;
    padding: 12px;
  }

  .day-accordion__title,
  .day-accordion__date,
  .day-accordion__result {
    grid-column: 1;
  }

  .day-accordion__date,
  .day-accordion__result {
    font-size: 14px;
  }

  .day-accordion__chevron {
    grid-row: 1 / span 3;
    grid-column: 2;
  }

  .day-accordion__content {
    margin: 0 12px;
  }
}