/* Uses site.css tokens, panels and buttons shared by the existing tools. */
.schedules { display: grid; gap: 20px; min-width: 0; }
.schedules .panel { min-width: 0; padding: 24px; }
.schedule-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-block: 16px; }
.schedule-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr)); gap: 16px; margin-block: 16px; }
.schedule-field { display: flex; flex-direction: column; gap: 6px; margin-block: 10px; min-width: 0; }
.schedule-field input, .schedule-field select, .schedule-field textarea { width: 100%; min-width: 0; max-width: 100%; font: inherit; font-size: 1rem; min-height: 44px; }
.schedule-field input[type=checkbox] { width: 44px; height: 44px; }
.schedule-field input[type=color] { padding: 4px; }
.schedules details { border: 1px solid var(--line); border-radius: 10px; padding: 12px; margin-block: 16px; }
.schedules summary { min-height: 44px; cursor: pointer; padding: 10px; font-weight: 600; }
.schedule-step { padding: 12px; border-bottom: 1px solid var(--line); }
.schedule-scroll { overflow: auto; max-width: 100%; margin-block: 16px; }
.schedule-table { width: max-content; min-width: 100%; border-collapse: separate; border-spacing: 0; }
.schedule-table th { white-space: nowrap; }
.schedule-table th:first-child { position: sticky; left: 0; background: var(--surface, #fff); z-index: 1; max-width: 200px; white-space: normal; min-width: 120px; overflow-wrap: anywhere; }
.schedule-table td { padding: 2px; text-align: center; }
.schedule-cell { min-width: 52px; min-height: 44px; border: 2px solid transparent; border-radius: 6px; cursor: pointer; font: inherit; color: #172033; touch-action: manipulation; }
.schedule-cell[aria-pressed=true] { border-color: #172033; box-shadow: inset 0 0 0 2px white; font-weight: 700; }
.schedule-cell:focus-visible, .schedule-scroll:focus-visible { outline: 3px solid var(--brand); outline-offset: 2px; }
.schedule-muted { opacity: .55; }
.schedule-week-start { border-left: 2px solid var(--line); }
.schedule-saved-row { border-bottom: 1px solid var(--line); padding-block: 16px; }
.schedule-saved-row .btn { margin: 4px; }
.schedule-saved-row p, .schedules [role=status] { overflow-wrap: anywhere; }
.schedules [data-state=error] { color: var(--err); font-weight: 600; }
.schedule-comparison { border: 2px solid var(--line); padding: 16px; }
@media (max-width: 600px) {
    .schedules .panel { padding: 16px; }
    .schedule-actions .btn { flex: 1 1 160px; white-space: normal; }
    .schedule-table th:first-child { min-width: 100px; max-width: 130px; }
}
@media (hover: hover) { .schedule-cell:hover { border-color: #64748b; } }
@media print { .schedules, [data-schedule-guide] { display: none; } }

.schedule-logo-editor { grid-column: 1 / -1; min-width: 0; }
.schedule-logo-preview { display: block; max-width: 180px; max-height: 90px; object-fit: contain; margin-block: 12px; }
.schedule-logo-preview[hidden], .schedule-logo-editor .btn[hidden] { display: none; }
.schedule-logo-editor p { color: var(--muted); }
.schedule-logo-editor input[type=file]::file-selector-button { min-height: 44px; padding: 8px 12px; margin-right: 8px; font: inherit; color: var(--ink); background: var(--surface); border: 1px solid var(--line-strong); border-radius: var(--radius-sm); cursor: pointer; }