/* pages/schedules.css — Schedules (parent console, stage 9).
   Uses the shared webkit tokens (kit.css) so light/dark and WCAG AA come for free.
   Scoped under .page-schedules and the .sched-* classes. */

.page-schedules .sched-head { margin-bottom: var(--gap); }
.sched-back { display: inline-block; color: var(--primary); font-weight: 600; margin-bottom: 6px; }
.sched-back:hover { text-decoration: underline; }
.page-schedules .sched-sub { margin-top: 2px; max-width: 60ch; }

/* child chooser */
.sched-pick-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; }
.sched-pick {
  display: flex; align-items: center; gap: 10px; padding: 12px 14px;
  border: 1px solid var(--border); border-radius: var(--radius-sm);
  background: var(--surface-2); color: var(--text); font-weight: 600;
}
.sched-pick:hover { border-color: var(--border-strong); background: var(--surface-3); }
.sched-pick .nav-ico { width: 20px; height: 20px; color: var(--primary); }

/* timezone note */
.sched-tz { display: flex; gap: 12px; align-items: flex-start; }
.sched-tz .nav-ico { width: 22px; height: 22px; color: var(--accent); flex: none; margin-top: 2px; }
.sched-tz-main { font-size: 0.95rem; }
.sched-tz-sub { margin-top: 3px; font-size: 0.85rem; }
.sched-tz-sub .link-btn { font-size: 0.85rem; }

/* presets ("quick add") */
.sched-preset-intro { margin: -4px 0 12px; }
.sched-presets { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.sched-preset {
  display: flex; flex-direction: column; align-items: stretch; gap: 6px; text-align: left;
  padding: 12px 14px; border: 1px solid var(--border); border-radius: var(--radius-sm);
  background: var(--surface-2); color: var(--text);
}
.sched-preset:hover { border-color: var(--border-strong); background: var(--surface-3); }
.sched-preset-top { display: flex; align-items: center; gap: 8px; }
.sched-preset-label { font-weight: 700; }
.sched-preset-sub { font-size: 0.82rem; }
.sched-preset-add { display: inline-flex; align-items: center; gap: 6px; color: var(--primary); font-weight: 600; font-size: 0.85rem; margin-top: 2px; }
.sched-preset-add .ico-sm { width: 16px; height: 16px; }

/* schedule list cards */
.sched-cards { display: flex; flex-direction: column; gap: 12px; }
.sched-card {
  border: 1px solid var(--border); border-radius: var(--radius-sm);
  background: var(--surface-2); padding: 12px 14px;
}
.sched-card.is-off { opacity: 0.62; }
.sched-card-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.sched-card-id { display: flex; align-items: center; gap: 8px; min-width: 0; }
.sched-card-label { font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sched-kind { flex: none; }
.sched-toggle { display: inline-flex; align-items: center; gap: 6px; flex: none; font-size: 0.82rem; }
.sched-card-when { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 6px; font-size: 0.9rem; }
.sched-card-days { font-weight: 600; }
.sched-card-dot { color: var(--text-faint); }
.sched-card-time { color: var(--text-muted); }
.sched-card-cats { margin-top: 8px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.sched-card-cats-lbl { font-size: 0.82rem; }
.sched-cat-chip { font-size: 0.78rem; }
.sched-card-actions { margin-top: 10px; display: flex; gap: 16px; }
.sched-card-actions .link-btn.danger { color: var(--danger); }

/* add custom */
.sched-add-row { margin-bottom: var(--gap); }
.sched-add-custom { display: inline-flex; align-items: center; gap: 8px; }

/* editor */
.sched-editor .sched-field-label { font-weight: 600; font-size: 0.85rem; margin: 2px 0 8px; }
.sched-kinds { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 14px; }
.sched-kind-opt {
  display: flex; gap: 10px; align-items: flex-start; padding: 12px;
  border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface);
  cursor: pointer;
}
.sched-kind-opt.on { border-color: var(--primary); background: var(--primary-soft); box-shadow: 0 0 0 1px var(--primary) inset; }
.sched-kind-opt input { margin-top: 3px; flex: none; }
.sched-kind-title { font-weight: 700; }
.sched-kind-sub { font-size: 0.8rem; margin-top: 2px; }

.sched-days { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px; }
.sched-day {
  min-width: 46px; padding: 8px 10px; border: 1px solid var(--border);
  border-radius: 999px; background: var(--surface); color: var(--text-muted); font-weight: 600;
}
.sched-day.on { border-color: var(--primary); background: var(--primary-soft); color: var(--primary-strong); }
.sched-day:hover { border-color: var(--border-strong); }

.sched-times { align-items: flex-start; }
.sched-times .field { flex: 1 1 160px; margin-bottom: 0; }
.sched-pause-note { margin: 4px 0 10px; max-width: 60ch; }
.sched-focus-wrap { margin-bottom: 6px; }
.sched-editor-actions { margin-top: 12px; }

@media (max-width: 560px) {
  .sched-kinds { grid-template-columns: 1fr; }
  .sched-card-top { flex-wrap: wrap; }
}
