/* Uses the same tokens as chat, Dashboard and all three appearance themes. */
#templates-nav { display:flex; flex:1; align-items:center; gap:9px; min-width:0; min-height:38px; padding:8px 10px; border:1px solid transparent; border-radius:9px; color:var(--sidebar-text); background:transparent; text-align:left; font-size:12px; font-weight:650; }
#templates-nav svg { flex:none; }
#templates-nav:hover, #templates-nav[aria-current="page"] { background:var(--sidebar-active); border-color:var(--sidebar-divider); }
body[data-view="templates"] #messages, body[data-view="templates"] .compose, body[data-view="templates"] #scroll-bottom { display:none; }
#templates-view { flex:1; min-height:0; overflow:auto; padding:28px clamp(16px,2vw,28px) 40px; }
#templates-status { color:var(--muted); font-size:13px; line-height:1.6; margin:0 0 20px; }
#templates-status[data-error="true"], #template-save-error { color:var(--danger); }
.templates-layout { min-width:0; }
.sidebar-library { flex:1; min-height:0; overflow:auto; margin-top:16px; padding-bottom:28px; scrollbar-width:thin; scrollbar-color:var(--sidebar-divider) var(--sidebar); }
.sidebar-section-heading { display:flex; align-items:center; gap:2px; margin-bottom:4px; }
.sidebar-section-toggle, .section-toggle-icon { display:flex; align-items:center; gap:8px; min-height:38px; padding:8px 10px; border:0; border-radius:9px; background:transparent; color:var(--sidebar-text); font-size:12px; font-weight:650; text-align:left; }
.sidebar-section-toggle { width:100%; justify-content:space-between; margin-bottom:8px; }
.sidebar-section-label { display:inline-flex; align-items:center; gap:9px; min-width:0; }
.sidebar-section-symbol { flex:none; color:currentColor; }
.section-toggle-icon { flex:none; }
.sidebar-section-toggle:hover, .section-toggle-icon:hover { background:var(--sidebar-hover); }
.section-chevron { flex:none; transform:rotate(90deg); transition:transform var(--ease); }
[aria-expanded="false"] > .section-chevron { transform:rotate(0); }
#history-section { flex:none; margin-top:16px; }
#history-list { overflow:visible; }
#templates-list { display:grid; gap:3px; }
.template-list-item { flex:1; min-width:0; padding:11px 5px 11px 12px; border:0; border-radius:9px; color:var(--sidebar-muted); background:transparent; text-align:left; font-size:12px; }
.template-list-item[aria-current="true"] { background:var(--sidebar-active); color:var(--sidebar-text); box-shadow:inset 2px 0 var(--sidebar-indicator); font-weight:650; }
.template-list-empty, .sidebar-list-status { margin:6px 12px; color:var(--sidebar-muted); font-size:11px; line-height:1.7; }
.sidebar-list-status:empty { display:none; }
.history-menu.opens-up { top:auto; bottom:100%; }
.table-save-template:disabled { color:var(--success); opacity:1; cursor:default; }
#template-detail { min-width:0; }
.template-detail-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:16px; }
.template-detail-heading h2 { margin:0; font-size:21px; font-weight:600; overflow-wrap:anywhere; }
.template-settings { padding:20px; border:1px solid var(--line); border-radius:14px; background:var(--surface); margin-bottom:22px; }
#template-organization-slot .organization-control { max-width:100%; }
#template-organization-slot #organization-menu { top:calc(100% + 8px); bottom:auto; }
#template-scope-note, #template-organization-hint { color:var(--muted); font-size:12px; line-height:1.6; }
#template-parameters { min-width:0; border:0; padding:0; margin:18px 0; display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr)); gap:16px; }
#template-parameters label, #template-save-form label, #rename-form label { display:flex; flex-direction:column; gap:8px; min-width:0; color:var(--text); font-size:12px; }
#template-parameters input, #template-parameters select, #template-parameters textarea, #template-save-title, #rename-title { width:100%; min-width:0; box-sizing:border-box; min-height:42px; padding:10px 12px; border:1px solid var(--line-strong); border-radius:9px; background:var(--canvas); color:var(--text); font:inherit; }
#template-parameters small { color:var(--muted); font-size:11px; line-height:1.5; overflow-wrap:anywhere; }
.template-advanced { grid-column:1 / -1; padding:12px; border:1px solid var(--line); border-radius:9px; }
.template-advanced summary { cursor:pointer; color:var(--muted); font-size:12px; }
.template-advanced label { margin-top:16px; }
.template-run-actions { display:flex; align-items:center; gap:14px; }
#template-run, #template-save-confirm, #rename-confirm { border:1px solid var(--accent); border-radius:10px; padding:11px 22px; color:var(--accent-ink); background:var(--accent); font-size:13px; font-weight:600; }
#template-run:hover, #template-save-confirm:hover, #rename-confirm:hover { background:var(--accent-hover); }
#template-run:disabled, #template-save-confirm:disabled, #rename-confirm:disabled { opacity:.5; cursor:not-allowed; }
.template-result-caption { color:var(--text); font-size:13px; font-weight:600; margin:0 0 7px; }
.template-result-context { color:var(--muted); font-size:12px; margin:0 0 12px; }
.template-used-parameters { margin-bottom:16px; color:var(--muted); font-size:12px; }
.template-used-parameters summary { cursor:pointer; }
.template-used-parameters dl { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,2fr); gap:8px 16px; }
.template-used-parameters dd { margin:0; overflow-wrap:anywhere; }
#template-save-dialog, #rename-dialog { width:min(460px,calc(100vw - 32px)); max-height:85dvh; box-sizing:border-box; padding:26px; border:1px solid var(--line-strong); border-radius:18px; background:var(--surface); color:var(--text); box-shadow:0 24px 80px #0004; }
#template-save-dialog::backdrop, #rename-dialog::backdrop { background:#0006; backdrop-filter:blur(4px); }
#template-save-heading, #rename-heading { margin:0 0 12px; font-size:23px; letter-spacing:-.03em; }
#rename-error { font-size:13px; color:var(--danger); }
#template-save-form p { font-size:13px; color:var(--muted); line-height:1.6; }
.template-dialog-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:20px; }
#template-save-cancel, #rename-cancel { border:1px solid var(--line); border-radius:10px; background:transparent; color:var(--text); padding:10px 16px; }
@media(min-width:981px) { body.sidebar-collapsed #templates-nav { justify-content:center; padding-inline:0; } body.sidebar-collapsed #templates-nav span, body.sidebar-collapsed #templates-toggle, body.sidebar-collapsed #templates-list-panel { display:none; } }
@media(max-width:850px) { .template-settings { padding:16px; } .template-run-actions { align-items:stretch; flex-direction:column; } .history-more { opacity:1; } }
@media(prefers-reduced-motion:reduce) { #templates-view * { scroll-behavior:auto; } }

.template-date-control { position: relative; display: flex; min-width: 0; }
#template-parameters .template-date-control input { padding-right: 42px; font-variant-numeric: tabular-nums; }
.template-date-control input::-webkit-calendar-picker-indicator { display: none; }
.template-date-trigger { position: absolute; inset: 3px 3px 3px auto; display: grid; place-items: center; width: 34px; padding: 0; border: 0; border-radius: 6px; background: transparent; color: var(--accent); }
.template-date-trigger:hover { background: var(--accent-soft); }
.template-date-trigger:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.template-date-trigger:disabled, fieldset:disabled .template-date-trigger { opacity: .5; cursor: not-allowed; }
