/* ─────────────────────────────────────────────────────────────
   Yogalina · /admin/scheduler (internal, unlisted)
   On top of style.css tokens and admin.css components - see the
   "Admin dashboard" section of DESIGN.md. Logical properties only.
   ───────────────────────────────────────────────────────────── */

/* ── Pause banner, quota, top row ── */
.sch-pause {
  background: var(--highlight);
  color: var(--lilac-t);
  border-radius: var(--radius-m);
  box-shadow: inset 0 0 0 2px var(--btn-rim);
  padding: var(--space-4);
  margin-block-end: var(--space-4);
}
.sch-pause p { margin: 0; }
.sch-pause-title { font-weight: 800; font-size: var(--fs-h3); margin-block-end: var(--space-2) !important; }

.sch-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--space-3) var(--space-5);
  margin-block-end: var(--space-3);
}
.sch-quota { margin: 0; font-size: var(--fs-small); font-weight: 600; text-align: center; }
.sch-quota:empty { display: none; }
.sch-quota--high { color: var(--lilac-t); font-weight: 800; }

/* ── View switch (same pills as the admin tabs) + filters ── */
.sch-views {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-2);
  max-inline-size: 26rem;
  margin: var(--space-5) auto var(--space-4);
}
.sch-views .admin-tab[aria-pressed="true"] {
  background: var(--btn-bg);
  box-shadow: inset 0 0 0 2px var(--btn-rim), var(--shadow-btn);
}
.sch-filters { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.sch-filters label:first-child { grid-column: auto; }
@media (min-width: 45rem) {
  .sch-filters { grid-template-columns: repeat(2, minmax(0, 14rem)); justify-content: center; }
}

/* ── Week ── */
.sch-week-nav {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: var(--space-2);
  margin-block-start: var(--space-5);
}
.sch-week-nav h2 { margin: 0; font-size: var(--fs-h3); text-align: center; }
.sch-week-nav .btn-secondary { padding: 10px 16px; font-size: 1rem; }
.sch-today { margin-block-start: var(--space-2); }
.sch-today:has(> [hidden]) { display: none; }

/* Phones: one day per row. From 60rem: seven columns, Sunday at the start (right). */
.sch-week {
  list-style: none;
  display: grid;
  gap: var(--space-2);
  margin-block-start: var(--space-4);
}
@media (min-width: 60rem) {
  .sch-week { grid-template-columns: repeat(7, minmax(0, 1fr)); }
}
.sch-day {
  background: var(--surface);
  border-radius: var(--radius-s);
  padding: var(--space-3);
  min-block-size: 3.5rem;
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: start;
  gap: var(--space-2) var(--space-3);
}
@media (min-width: 60rem) {
  .sch-day { grid-template-columns: 1fr; min-block-size: 9rem; align-content: start; }
}
.sch-day--today { box-shadow: inset 0 0 0 2px var(--text); }
.sch-day--off { background: transparent; box-shadow: inset 0 0 0 1.5px var(--line); }
.sch-day--today.sch-day--off { box-shadow: inset 0 0 0 2px var(--text); }
/* Day name and date, with the "+" (new post on this day) at the far end. */
.sch-day-top {
  grid-column: 1 / -1;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-2);
}
.sch-day-add, .sch-chip-x {
  flex: none;
  display: inline-grid;
  place-items: center;
  border: none;
  border-radius: 999px;
  background: var(--paper);
  box-shadow: inset 0 0 0 1.5px var(--line);
  color: var(--text);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.sch-day-add { inline-size: 2.25rem; block-size: 2.25rem; }
.sch-day-add svg { inline-size: 1rem; block-size: 1rem; }
.sch-chip-x { inline-size: 2rem; block-size: 2rem; align-self: center; }
.sch-chip-x svg { inline-size: 0.75rem; block-size: 0.75rem; }
.sch-day-add:hover, .sch-chip-x:hover { box-shadow: inset 0 0 0 1.5px var(--btn-rim), var(--shadow-btn); }
.sch-day-add:focus-visible, .sch-chip-x:focus-visible { outline: 3px solid var(--text); outline-offset: 2px; }
/* Seven narrow columns: the "+" moves under the posts, so the day name keeps one line. */
@media (min-width: 60rem) {
  .sch-day-top { display: contents; }
  .sch-day-add { order: 1; justify-self: start; }
  /* ...and the "x" sits on the chip's corner instead of beside it. */
  .sch-chip-row { position: relative; }
  .sch-chip-row:has(.sch-chip-x) .sch-chip { padding-inline-end: var(--space-4); }
  .sch-chip-x { position: absolute; inset-block-start: calc(var(--space-2) * -1); inset-inline-end: calc(var(--space-2) * -1); inline-size: 1.5rem; block-size: 1.5rem; }
  .sch-chip-x svg { inline-size: 0.625rem; block-size: 0.625rem; }
}
.sch-chip-row { display: flex; align-items: stretch; gap: var(--space-1); }
.sch-chip-row .sch-chip { flex: 1; min-inline-size: 0; }
/* Today: where "now" falls among the day's posts. */
.sch-now {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--fs-caption);
  font-weight: 800;
  color: var(--text);
}
.sch-now::after { content: ''; flex: 1; border-block-start: 2px solid currentColor; }
.sch-day-head {
  margin: 0;
  font-size: var(--fs-body);
  display: flex;
  flex-direction: column;
  line-height: 1.25;
  min-inline-size: 4.5rem;
}
.sch-day-name { font-weight: 800; }
.sch-day-date { font-size: var(--fs-small); font-weight: 600; }
.sch-chips { list-style: none; display: flex; flex-direction: column; gap: var(--space-2); grid-column: 1 / -1; }
.sch-chip {
  inline-size: 100%;
  min-block-size: 44px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0 var(--space-2);
  padding: var(--space-2) var(--space-3);
  border: none;
  border-radius: var(--radius-s);
  background: var(--paper);
  box-shadow: inset 0 0 0 1.5px var(--line);
  color: var(--text);
  font: inherit;
  font-size: var(--fs-small);
  text-align: start;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: box-shadow var(--ease), transform var(--ease);
}
.sch-chip:hover { transform: translateY(-1px); box-shadow: inset 0 0 0 1.5px var(--btn-rim), var(--shadow-btn); }
.sch-chip:active { transform: translateY(1px) scale(0.98); }
.sch-chip:focus-visible { outline: 3px solid var(--text); outline-offset: 2px; }
.sch-chip[aria-pressed="true"] { box-shadow: inset 0 0 0 2px var(--text); }
.sch-chip-time { font-weight: 800; }
.sch-chip-status { font-size: var(--fs-caption); margin-inline-start: auto; }
.sch-chip--published { background: var(--green-bg); }
.sch-chip--failed { background: var(--highlight); color: var(--lilac-t); }
.sch-chip--cancelled .sch-chip-time, .sch-chip--cancelled .sch-chip-type { text-decoration: line-through; }
.sch-detail { margin-block-start: var(--space-4); }
.sch-detail:focus { outline: none; }
.sch-detail:focus-visible { outline: 3px solid var(--text); outline-offset: 4px; border-radius: var(--radius-m); }

/* ── Post cards (list + week detail) ── */
.sch-list { list-style: none; display: flex; flex-direction: column; gap: var(--space-3); }
.sch-empty { text-align: center; padding-block: var(--space-2); }
.sch-item {
  background: var(--surface);
  border-radius: var(--radius-m);
  box-shadow: var(--shadow-soft);
  padding: var(--space-4);
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}
.sch-item p { margin: 0; }
.sch-item-head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); }
.sch-item-type { font-weight: 800; font-size: var(--fs-h3); line-height: 1.3; }
.sch-item-when { font-weight: 700; }
.sch-item-caption {
  font-size: var(--fs-small);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.sch-muted { font-style: italic; }
.sch-item-notes, .sch-item-meta { font-size: var(--fs-caption); overflow-wrap: anywhere; }
.sch-item-actions { flex-wrap: wrap; gap: var(--space-1) var(--space-4); }
.sch-item-actions a.kw-link-btn { display: inline-flex; align-items: center; }
.sch-item--cancelled .sch-item-type { text-decoration: line-through; text-decoration-thickness: 1.5px; }
.sch-error { background: var(--highlight); color: var(--lilac-t); border-radius: var(--radius-s); padding: var(--space-2) var(--space-3); font-weight: 600; }
.sch-error p + p { font-weight: 400; margin-block-start: var(--space-1); }
.sch-dryrun { font-size: var(--fs-small); font-weight: 600; }
.sch-dryrun:empty { display: none; }

.sch-media { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }
.sch-media:empty { display: none; }
.sch-media img { inline-size: 3.5rem; block-size: 3.5rem; object-fit: cover; border-radius: 8px; background: var(--green-bg); }
.sch-media .sch-media-reel { inline-size: 3rem; block-size: 5.33rem; }
.sch-media-count { font-size: var(--fs-caption); font-weight: 600; }

/* Status pills: queued = soft gold, publishing = vanilla, published = green, failed as in admin.css */
.sch-pill { white-space: nowrap; }
.sch-pill--queued { background: var(--paper); color: var(--text); box-shadow: inset 0 0 0 1px var(--line); }
.sch-pill--publishing { background: var(--btn-bg); color: var(--btn-text); }
.sch-pill--published { background: var(--green-bg); color: var(--green-t); }
.sch-pill--failed { background: var(--highlight); color: var(--lilac-t); }
.sch-pill--failed svg { color: var(--red); }
.sch-pill--cancelled { background: transparent; color: var(--text); box-shadow: inset 0 0 0 1px var(--line); }

/* ── Form ── */
.sch-form { margin-block: var(--space-5); }
.sch-form h2 { margin-block: 0 var(--space-2); }
.sch-form textarea { min-block-size: 9rem; }
.sch-form textarea.kw-short { min-block-size: 4.5rem; }
.sch-form .admin-actions { margin-block-start: var(--space-2); }
.sch-types { border: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); }
.sch-types legend { font-weight: 600; margin-block-end: var(--space-2); padding: 0; }
.sch-types:disabled label { opacity: 1; cursor: default; }
.sch-when { display: grid; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); gap: var(--space-3); }
.sch-when select { inline-size: 100%; min-inline-size: 0; min-block-size: 44px; }
.sch-time { border: none; padding: 0; margin: 0; min-inline-size: 0; display: flex; flex-direction: column; gap: var(--space-2); }
.sch-time legend { font-weight: 600; padding: 0; margin-block-end: var(--space-2); }
.sch-time-fields { display: flex; align-items: center; gap: var(--space-2); }
.sch-time-fields label { flex: 1; }
.sch-time-fields span[aria-hidden] { font-weight: 800; }
.sch-label { font-weight: 600; margin: 0; }
.sch-reel, .sch-carousel { display: flex; flex-direction: column; gap: var(--space-3); }
.sch-actions-start { justify-content: flex-start; margin-block-start: 0; }
.sch-actions-start:has(> [hidden]:only-child) { display: none; }
.sch-actions-start .btn-secondary { padding: 10px 22px; font-size: 1.0625rem; }

.sch-messages { list-style: none; display: flex; flex-direction: column; gap: var(--space-1); font-size: var(--fs-small); font-weight: 600; }
.sch-messages:empty { display: none; }
.sch-messages li { padding-inline-start: var(--space-3); border-inline-start: 3px solid var(--btn-rim); }
.sch-messages--error li { color: var(--lilac-t); border-inline-start-color: var(--lilac-t); }

/* Drop zone for carousel images */
.sch-drop {
  align-items: center;
  justify-content: center;
  text-align: center;
  min-block-size: 6rem;
  padding: var(--space-4);
  border-radius: var(--radius-m);
  background: var(--paper);
  box-shadow: inset 0 0 0 2px var(--btn-rim);
  cursor: pointer;
  transition: background-color var(--ease);
}
.sch-drop span:first-of-type { font-weight: 800; }
.sch-drop-hint { font-size: var(--fs-caption); font-weight: 400; }
.sch-drop:hover, .sch-drop--over { background: var(--btn-bg); }
.sch-drop:focus-within { outline: 3px solid var(--text); outline-offset: 3px; }

.sch-images { list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); }
@media (min-width: 45rem) {
  .sch-images { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.sch-images:empty { display: none; }
.sch-image {
  position: relative;
  background: var(--paper);
  border-radius: var(--radius-s);
  box-shadow: inset 0 0 0 1px var(--line);
  padding: var(--space-2);
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
}
.sch-image img { inline-size: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 6px; background: var(--green-bg); }
.sch-image--dragging { box-shadow: inset 0 0 0 2px var(--text), var(--shadow-lift); }
.sch-image--error { box-shadow: inset 0 0 0 2px var(--lilac-t); }
.sch-image-num {
  position: absolute;
  inset-block-start: calc(var(--space-2) + 6px);
  inset-inline-end: calc(var(--space-2) + 6px);
  min-inline-size: 1.75rem;
  block-size: 1.75rem;
  border-radius: var(--radius-btn);
  background: var(--btn-bg);
  color: var(--btn-text);
  font-weight: 800;
  display: grid;
  place-items: center;
}
.sch-handle {
  position: absolute;
  inset-block-start: calc(var(--space-2) + 4px);
  inset-inline-start: calc(var(--space-2) + 4px);
  inline-size: 44px;
  block-size: 44px;
  display: grid;
  place-items: center;
  border: none;
  border-radius: var(--radius-s);
  background: rgba(255, 253, 248, 0.92);
  color: var(--text);
  cursor: grab;
  touch-action: none;
}
.sch-handle svg { inline-size: 12px; block-size: 18px; }
.sch-handle:active { cursor: grabbing; }
.sch-handle:focus-visible { outline: 3px solid var(--text); outline-offset: 1px; }
.sch-image-state { font-size: var(--fs-caption); font-weight: 600; color: var(--lilac-t); }
.sch-image-note { font-size: var(--fs-caption); }
.sch-image-actions { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0 var(--space-2); }
.sch-image-actions .kw-link-btn { font-size: var(--fs-caption); }
.sch-image-actions .kw-link-btn:disabled { opacity: 1; text-decoration: none; color: var(--beige); cursor: default; }

/* Drive picker */
.sch-drive {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  max-block-size: 26rem;
  overflow-y: auto;
  padding: var(--space-1);
}
.sch-drive-item label {
  flex-direction: row !important;
  align-items: center;
  gap: var(--space-3) !important;
  background: var(--paper);
  border-radius: var(--radius-s);
  box-shadow: inset 0 0 0 1px var(--line);
  padding: var(--space-2) var(--space-3);
  cursor: pointer;
}
.sch-drive-item label:has(input:checked) { box-shadow: inset 0 0 0 2px var(--text); }
.sch-drive-item label:has(input:focus-visible) { outline: 3px solid var(--text); outline-offset: 2px; }
.sch-drive-item input { inline-size: 1.25rem; block-size: 1.25rem; flex: none; accent-color: var(--green-t); }
.sch-drive-item img, .sch-drive-nothumb {
  inline-size: 2.75rem;
  block-size: 4.9rem;
  flex: none;
  object-fit: cover;
  border-radius: 6px;
  background: var(--green-bg);
}
.sch-drive-text { display: flex; flex-direction: column; min-inline-size: 0; }
.sch-drive-name { font-weight: 700; overflow-wrap: anywhere; }
.sch-drive-meta { font-size: var(--fs-caption); font-weight: 400; }
.sch-drive-used { font-size: var(--fs-caption); font-weight: 800; color: var(--lilac-t); }
.sch-drive-item--used label { cursor: default; background: transparent; }
.sch-drive-item--used .sch-drive-name { text-decoration: line-through; }

@media (prefers-reduced-motion: reduce) {
  .sch-chip, .sch-drop { transition: none; }
  .sch-chip:hover, .sch-chip:active { transform: none; }
}

/* Video upload (reels) */
.sch-video {
  display: flex;
  gap: var(--space-3);
  align-items: flex-start;
  background: var(--paper);
  border-radius: var(--radius-s);
  box-shadow: inset 0 0 0 1px var(--line);
  padding: var(--space-2);
}
.sch-video video { inline-size: 7.5rem; aspect-ratio: 9 / 16; object-fit: cover; border-radius: 6px; background: var(--green-bg); flex: none; }
.sch-video-info { display: flex; flex-direction: column; gap: var(--space-2); min-inline-size: 0; flex: 1; }
.sch-video-info p { margin: 0; }
.sch-video-name { font-weight: 700; overflow-wrap: anywhere; }
.sch-video progress { inline-size: 100%; block-size: 0.6rem; accent-color: var(--green-t); }
.sch-video .kw-link-btn { align-self: flex-start; }
.sch-media video.sch-media-reel { inline-size: 3rem; block-size: 5.33rem; object-fit: cover; border-radius: 8px; background: var(--green-bg); }