/* Remarcar: a day, then its free times under each turno. */

@layer components {
  .reschedule-day-nav {
    gap: 8px;
    margin-bottom: var(--section-gap);
  }

  .reschedule-day-form {
    flex: 1;

    .reschedule-date { width: 100%; }
  }

  .reschedule-agenda-chips {
    margin-bottom: var(--section-gap);
  }

  /* The button is the grid's cell, not its form. */
  .reschedule-time-form {
    display: contents;
  }

  .reschedule-time:disabled {
    cursor: default;
  }

  /* What was promised, a section apart from the buttons. */
  .reschedule-confirm-message {
    margin: 0 0 calc(1.5 * var(--section-gap));
    font-size: var(--text-base);
    color: var(--color-text);
  }

  .reschedule-empty {
    color: var(--color-muted);
  }
}