/* Page-specific overrides — no global patterns here */

/* Elements that start hidden — JS controls visibility */
#tProgress, #tTree, #editPanel, #orphanJobs, #extensionHelpPanel,
#fCourse, #profCard, #profCardShared { display:none; }

/* Toledo header status bar */
#headerStatus { display:flex; justify-content:space-between; align-items:center; gap:8px; flex-wrap:wrap; font-size:12px; }

/* Compact panel padding for Toledo explorer */
#toledoPanel.panel { padding:12px; }

/* URL input — larger type */
#url { font-size:14px; }

/* Add-video form layout columns */
.add-col-title   { flex:2; }
.add-col-sm      { flex:1; min-width:120px; }
.add-col-fixed   { flex:0 0 auto; }
.add-col-fixed-end { flex:0 0 auto; align-self:flex-end; }

/* Advanced settings dropdown area */
.advanced-settings { margin-top:10px; display:grid; gap:10px; }

/* Topbar filter label */
.tb-filter-label { font-size:12px; color:var(--color-text-muted); margin:0; gap:4px; flex-shrink:0; }
.tb-filter-select { padding:4px 8px; font-size:12px; }

/* Submit button sizing in the add-video form */
#go { margin-top:16px; padding:11px 18px; }

/* Toledo connect box — used only inside #toledoPanel */
#toledoPanel .connect-box { display:flex; gap:10px; align-items:flex-end; flex-wrap:wrap; margin-bottom:16px; }
#toledoPanel .connect-box > div { flex:1; min-width:200px; }
#toledoPanel .connect-box label { margin:0 0 4px; }
#toledoPanel .connect-box button { align-self:flex-end; white-space:nowrap; }

/* Toledo tree action bar */
.toledo-actions { display:flex; gap:12px; align-items:center; margin:12px 0; flex-wrap:wrap; }
.toledo-actions .count { font-size:13px; color:var(--color-text-muted); }
.toledo-status { font-size:13px; color:var(--color-text-muted); margin:8px 0; }

/* Toledo status / progress bar (IDs unique to main page) */
#tStatus  { font-size:12px; color:var(--color-text-muted); }
#tActions { display:none; gap:8px; }
#tProgress { margin-bottom:8px; }

/* Extension help panel */
.ext-help { margin:8px 0 0; font-size:12px; }
.ext-help summary { color:var(--color-primary); cursor:pointer; font-size:12px; }
.ext-help .ext-steps { padding:8px 12px; background:var(--color-bg); border:1px solid var(--color-border); border-radius:6px; margin-top:6px; }
.ext-help .ext-steps p { margin:4px 0 8px; color:var(--color-text-muted); }
.ext-help ol { margin:0; padding-left:20px; color:var(--color-text); }
.ext-help ol li { margin:4px 0; }
.ext-help code { background:var(--color-border); padding:1px 5px; border-radius:3px; font-size:11px; }
.ext-help a { color:var(--color-primary); }

/* Summary panel */
#summaryPanel { display:none; }
#summaryPanel .shead { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:8px; flex-wrap:wrap; }
#summaryPanel .dl { display:flex; gap:8px; align-items:center; flex-wrap:wrap; font-size:13px; }
#summaryPanel label.chk { display:flex; align-items:center; gap:5px; color:var(--color-text); margin:0; font-size:13px; }

/* Markdown content renderer (summary view) */
.md h1,.md h2,.md h3 { line-height:1.3; }
.md h1 { font-size:22px; margin:10px 0 6px; }
.md h2 { font-size:19px; margin:18px 0 6px; border-bottom:1px solid var(--color-border); padding-bottom:4px; }
.md h3 { font-size:16px; margin:14px 0 4px; color:var(--color-text-muted); }
.md ul,.md ol { margin:6px 0 6px 22px; } .md li { margin:3px 0; }
.md p { margin:8px 0; } .md strong { color:var(--color-text); }
.md hr { border:0; border-top:1px solid var(--color-border); margin:16px 0; }
.md code { background:var(--color-bg); padding:1px 5px; border-radius:4px; font-size:13px; }

/* UX cleanup (2026-07-10): draw attention to "Verbinden" only while no Toledo session. */
#btnConnect.needs-attention { border-color: var(--color-primary); box-shadow: 0 0 0 2px var(--color-primary); }
/* Global tools moved into the sidebar nav — make them look clickable. */
.sb-nav li[onclick] { cursor: pointer; }
.sb-nav li[onclick]:hover { color: var(--color-primary); }

/* Modern inline-SVG icons (replace the old ▶/▼/▸ triangles). */
.svk-ic { width:1em; height:1em; display:inline-block; vertical-align:-0.14em; flex:none; }
.svk-play { color: var(--color-primary); }
.vc-play .svk-play { color:#fff; }               /* play overlay on a video thumbnail */
/* Chevron rotation — tree carets rotate when their <li> is expanded. */
.svk-cv { transition: transform .18s ease; }
li:not(.collapsed) > .caret .svk-cv { transform: rotate(90deg); }
/* Generic .open toggles (e.g. the document page-coverage button). */
.doc-pages-toggle.open .svk-cv { transform: rotate(90deg); }
#chatSendBtn .svk-ic { width:1.05em; height:1.05em; }
@media (prefers-reduced-motion: reduce){ .svk-cv { transition:none; } }