/* Schedule - tiles, tools tabs, and the horizontally scrolling Gantt
   (base styles from dashboard.css / projects.css). */

/* the Gantt should use the whole window, not the standard content cap */
main.pj-wrap { max-width: none; }

.sch-tab.active { color: var(--gold-bright); border-color: var(--gold-faint); }

.sch-card { border: 1px solid var(--hair); border-radius: 14px; background: var(--panel); padding: 18px 20px 20px; max-width: 980px; }
.sch-card h2 { margin: 0 0 6px; font-size: 18px; color: var(--text-hi); }
.sch-hint { font-size: 13px; color: var(--text-mid); line-height: 1.55; margin: 0 0 14px; }
.sch-row { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 10px; }
.sch-row input[type="file"] { font-size: 12.5px; color: var(--text-dim); max-width: 300px; }
.sch-row input[type="text"] { flex: 1; min-width: 220px; font: inherit; font-size: 13.5px; color: var(--text-hi); background: rgba(0,0,0,0.2); border: 1px solid var(--hair); border-radius: 10px; padding: 9px 12px; }
.sch-ghost { background: none !important; color: var(--gold-bright) !important; border: 1px solid var(--hair) !important; }
.sch-ghost:hover { border-color: var(--gold-faint) !important; }

/* ---- project tiles with live Gantt previews ---- */
.sch-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 14px; }
.sch-tile {
  display: block; text-decoration: none; color: var(--text-mid);
  border: 1px solid var(--hair); border-radius: 14px; background: var(--panel); padding: 14px 16px;
  transition: transform .15s ease, border-color .15s ease;
}
.sch-tile:hover { transform: translateY(-2px); border-color: var(--gold-faint); }
.sch-tile-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 9px; }
.sch-tile-top b { color: var(--gold-bright); font-size: 15px; }
.sch-tile-tag { font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--text-dim); border: 1px solid var(--hair); border-radius: 8px; padding: 1px 7px; }
.sch-tile-svg { display: block; width: 100%; height: 96px; border: 1px solid var(--hair); border-radius: 8px; background: rgba(0,0,0,0.18); }
.sch-tile-meta { font-size: 11.5px; color: var(--text-dim); margin-top: 8px; }

/* ---- import preview tree ---- */
.sch-summary { font-size: 13px; color: var(--text-mid); margin: 12px 0 8px; }
.sch-summary b { color: var(--gold-bright); }
.sch-tree { border: 1px solid var(--hair); border-radius: 10px; padding: 10px 14px; max-height: 380px; overflow-y: auto; background: rgba(0,0,0,0.14); }
.sch-t { font-size: 12.5px; color: var(--text-mid); padding: 2.5px 0; display: flex; align-items: baseline; gap: 10px; }
.sch-t.sch-phase { font-size: 13.5px; font-weight: 700; color: var(--gold-bright); margin-top: 8px; }
.sch-t.sch-sum { font-weight: 600; color: var(--text-hi); }
.sch-dates { margin-left: auto; font-size: 11px; color: var(--text-dim); white-space: nowrap; }
.sch-runrow { display: flex; align-items: center; gap: 14px; margin-top: 14px; flex-wrap: wrap; }

/* ---- shared activity strip (progress + log) ---- */
.sch-activity { margin-top: 14px; }
.sch-prog { flex: 1; min-width: 180px; height: 10px; border-radius: 999px; background: rgba(255,255,255,0.08); overflow: hidden; }
.sch-prog-fill { height: 100%; width: 0; border-radius: 999px; background: linear-gradient(90deg, #b98f3e, #ecc978); transition: width .4s ease; }
.sch-progtxt { font-size: 12px; color: var(--text-dim); white-space: nowrap; }
.sch-log { margin-top: 8px; max-height: 160px; overflow-y: auto; font-size: 11.5px; color: var(--text-dim); }
.sch-logline { padding: 1px 0; }
.sch-logline.dim { color: #e0a84a; }
.sch-done { margin-top: 10px; font-size: 13.5px; color: #8fd8a2; }
.sch-done a { color: var(--gold-bright); }

/* ---- the schedule's own page ---- */
.sch-back { display: inline-block; font-size: 13px; color: var(--gold-bright); text-decoration: none; margin-bottom: 6px; }
.sch-back:hover { text-decoration: underline; }
.sch-viewhead h2 { margin: 2px 0 4px; font-size: 22px; color: var(--text-hi); }
.sch-viewmeta { font-size: 12.5px; color: var(--text-dim); margin-bottom: 10px; }
.sch-g-tools { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin: 4px 0 12px; }
.sch-legend { font-size: 11px; color: var(--text-dim); display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.sch-legend i { display: inline-block; width: 18px; height: 8px; border-radius: 5px; margin-left: 8px; }
.sch-legend .lg-base { background: none; height: 0; border: none; border-top: 2px solid #d4af5f; border-radius: 0; }
.sch-legend .lg-ok { background: none; border: 1.6px solid rgba(212,175,95,0.85); }
.sch-legend .lg-crit { background: linear-gradient(90deg, #d93b36, #ff5a52); }
.sch-legend .lg-done { background: linear-gradient(90deg, #5c8a49, #8fd8a2); }

/* ---- zoom buttons + timeline slide bar ---- */
.sch-zoomctl { display: inline-flex; align-items: center; gap: 5px; }
.sch-zoomctl button {
  width: 26px; height: 26px; border-radius: 8px; border: 1px solid var(--hair); background: none;
  color: var(--gold-bright); font-size: 15px; line-height: 1; cursor: pointer;
}
.sch-zoomctl button:hover { border-color: var(--gold-faint); }
.sch-zoomctl button:disabled { opacity: 0.35; cursor: default; }
.sch-zoom { display: inline-flex; align-items: center; gap: 7px; font-size: 11px; color: var(--text-dim); }
.sch-zoom input[type="range"] { width: 200px; accent-color: #d4af5f; cursor: pointer; }
.sch-zoom input[type="range"]:disabled { opacity: 0.35; cursor: default; }

/* ---- Gantt: fit-to-screen (or zoomed) timeline inside a horizontal scroller ---- */
.sch-gwrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--hair); border-radius: 10px; background: rgba(0,0,0,0.16); scrollbar-width: thin; scrollbar-color: rgba(212,175,95,0.55) rgba(255,255,255,0.06); }
.sch-gwrap::-webkit-scrollbar { height: 11px; }
.sch-gwrap::-webkit-scrollbar-track { background: rgba(255,255,255,0.05); border-radius: 999px; }
.sch-gwrap::-webkit-scrollbar-thumb { background: rgba(212,175,95,0.5); border-radius: 999px; border: 2px solid rgba(0,0,0,0.35); }
.sch-gwrap::-webkit-scrollbar-thumb:hover { background: rgba(212,175,95,0.8); }
.sch-gantt { width: max-content; min-width: 100%; }
.sch-g-head, .sch-g-row { display: flex; align-items: stretch; }
.sch-g-name {
  flex: 0 0 250px; min-width: 0; font-size: 11.5px; color: var(--text-mid); padding: 3px 10px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border-right: 1px solid var(--hair);
  position: sticky; left: 0; z-index: 3; background: #1d2026;
}
.sch-g-lane { position: relative; min-width: 0; }
.sch-g-row .sch-g-lane { overflow: hidden; }   /* keep bubble labels from widening the scroll area */
.sch-g-lbl { position: absolute; top: 6px; padding-left: 7px; font-size: 9.5px; color: var(--text-dim); white-space: nowrap; pointer-events: none; }
.sch-g-lbl.mile { padding-left: 11px; top: 5px; }
.sch-g-head { border-bottom: 1px solid var(--hair); height: 40px; }
.sch-g-head.nod { height: 26px; }
.sch-g-head.nod .sch-g-months::after { display: none; }
.sch-g-head .sch-g-name { background: #1d2026; }
.sch-g-months { overflow: hidden; }
.sch-g-months::after { content: ""; position: absolute; left: 0; right: 0; top: 21px; border-top: 1px solid rgba(255,255,255,0.07); }
.sch-g-tick { position: absolute; top: 0; bottom: 0; border-left: 1px solid rgba(255,255,255,0.07); }
.sch-g-tick span { position: absolute; top: 4px; left: 4px; font-size: 9.5px; color: var(--text-dim); white-space: nowrap; }
.sch-g-tick.day { top: 21px; border-left-color: rgba(255,255,255,0.05); }
.sch-g-tick.day span { top: 3px; left: 3px; font-size: 8.5px; color: var(--text-dim); opacity: 0.85; }
.sch-g-tick.wk { border-left-color: rgba(255,255,255,0.035); }
.sch-g-body { position: relative; }
.sch-g-grid { position: absolute; top: 0; bottom: 0; left: 250px; }
.sch-g-grid .sch-g-tick span { display: none; }
.sch-g-today { position: absolute; top: 0; bottom: 0; border-left: 2px solid #e0524e; z-index: 2; }
.sch-g-row { position: relative; height: 24px; cursor: pointer; }
.sch-g-row.sel { background: rgba(212,175,95,0.16); box-shadow: inset 0 0 0 1px rgba(212,175,95,0.35); }
.sch-g-row.sel .sch-g-name { background: #2e2a1d; color: var(--gold-bright); }
/* crosshair guides that follow the cursor */
.sch-xh { position: absolute; pointer-events: none; display: none; z-index: 2; }
.sch-xh.v { top: 0; bottom: 0; width: 0; border-left: 1px dashed rgba(236,201,120,0.55); }
.sch-xh.h { left: 0; right: 0; height: 0; border-top: 1px dashed rgba(236,201,120,0.55); }
.sch-g-row.phase { background: rgba(212,175,95,0.07); }
.sch-g-row.phase .sch-g-name { color: var(--gold-bright); font-weight: 700; font-size: 12px; background: #262218; }
.sch-g-row.sum .sch-g-name { color: var(--text-hi); font-weight: 600; }
.sch-g-bar { position: absolute; min-width: 3px; }
/* baseline: a golden line with end ticks (MS Project style) on group rows */
.sch-g-bar.bl { top: 11px; height: 0; background: none; border-top: 2px solid #d4af5f; min-width: 4px; }
.sch-g-bar.bl::before, .sch-g-bar.bl::after { content: ""; position: absolute; top: -4px; width: 2px; height: 7px; background: #d4af5f; }
.sch-g-bar.bl::before { left: 0; }
.sch-g-bar.bl::after { right: 0; }
.sch-g-bar.bl.phase { border-top-width: 3px; border-top-color: #ecc978; }
.sch-g-bar.bl.phase::before, .sch-g-bar.bl.phase::after { background: #ecc978; height: 9px; top: -5px; }
.sch-g-mile { position: absolute; top: 1px; color: #ecc978; font-size: 14px; transform: translateX(-50%); }
/* tasks: always bubbles */
.sch-g-abar { position: absolute; top: 6px; height: 11px; border-radius: 7px; min-width: 3px; }
.sch-g-abar.ok { background: none; border: 1.6px solid rgba(212,175,95,0.85); }
.sch-g-abar.crit { background: linear-gradient(90deg, #d93b36, #ff5a52); }
.sch-g-abar.done { background: linear-gradient(90deg, #5c8a49, #8fd8a2); }
.sch-g-mile.base { color: rgba(236,201,120,0.55); }
.sch-g-mile.act.ok { color: #d4af5f; top: 9px; }
.sch-g-mile.act.crit { color: #ff5a52; top: 9px; }
.sch-g-mile.act.done { color: #8fd8a2; top: 9px; }
.sch-var { font-size: 9.5px; font-weight: 700; border-radius: 7px; padding: 0 5px; margin-left: 6px; }
.sch-var.late { color: #f0b1ad; background: rgba(191,54,54,0.3); }
.sch-var.early { color: #a9e3b8; background: rgba(92,138,73,0.3); }
.sch-var.even { color: #e0c274; background: rgba(212,175,95,0.2); font-weight: 500; }
/* task created in ClickUp after the baseline locked - no baseline for it */
.sch-var.nb { color: #ecc978; border: 1px dashed rgba(212,175,95,0.55); background: none; text-transform: uppercase; letter-spacing: .04em; }

@media screen and (max-width: 700px) {
  .sch-card { padding: 14px; }
  .sch-tiles { grid-template-columns: 1fr; }
  .sch-g-name { flex-basis: 140px; font-size: 10px; }
  .sch-g-grid { left: 140px; }
}