.calendar-panel { margin: 40px 0; padding: clamp(20px, 4vw, 36px); border: 1px solid var(--mend-ink); border-top: 8px solid var(--mend-orange-30); border-radius: var(--mend-radius); background: var(--mend-blue-60); color: var(--mend-ink); }
.calendar-panel h2 { margin-top: 6px; }
.calendar-panel p { max-width: 65ch; color: var(--mend-ink); }
.calendar-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 24px; }
.calendar-fields label { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.calendar-fields input, .calendar-fields select { min-width: 0; width: 100%; min-height: 48px; padding: 10px; border: 1px solid var(--mend-ink); border-radius: var(--mend-radius); background: var(--mend-white); color: var(--mend-ink); font: inherit; }
.calendar-panel .actions { flex-wrap: wrap; }
.calendar-panel .button { white-space: normal; text-align: center; }
.calendar-panel .button.primary { background: var(--mend-orange-30); color: var(--mend-ink); }
.calendar-panel .button.primary:hover { background: var(--mend-white); color: var(--mend-ink); }
.calendar-panel :focus-visible { outline: 3px solid var(--mend-ink); outline-offset: 3px; }
.calendar-panel [role="status"]:empty { display: none; }
@media (max-width: 600px) { .calendar-fields { grid-template-columns: 1fr; } .calendar-panel .actions > * { width: 100%; } }
.schedule-dialog { width: min(520px, calc(100% - 32px)); padding: 0; border: 0; border-radius: var(--mend-radius); background: transparent; color: var(--mend-ink); }
.schedule-dialog::backdrop { background: rgba(23, 32, 38, .42); }
.schedule-card { position: relative; display: grid; gap: 14px; padding: 30px; border: 1px solid var(--mend-ink); border-top: 8px solid var(--mend-orange-30); border-radius: var(--mend-radius); background: var(--mend-white); box-shadow: 0 24px 70px rgba(81, 106, 118, .24); }
.schedule-card h2, .schedule-card p { margin: 0; }
.schedule-card h2 { max-width: 16ch; }
.schedule-close { position: absolute; top: 14px; right: 14px; width: 34px; height: 34px; border: 1px solid var(--mend-ink); border-radius: 50%; background: var(--mend-orange-soft); color: var(--mend-ink); cursor: pointer; font: inherit; font-size: 22px; line-height: 1; }
.schedule-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; }
.schedule-actions .button { text-align: center; }