/* Redmine Test Case Management — polished, animated UI
   Scoped with tc- prefixes to avoid clashing with core/other plugins. */

:root {
  --tc-pass:    #23a559;
  --tc-fail:    #e0453e;
  --tc-blocked: #f0932b;
  --tc-skipped: #9aa4b2;
  --tc-none:    #cfd6df;
  --tc-blue:    #2f7ed8;
  --tc-purple:  #7b5cff;
  --tc-amber:   #f0932b;
  --tc-slate:   #556070;
  --tc-ink:     #2b3440;
  --tc-muted:   #7a8694;
  --tc-border:  #e3e8ef;
  --tc-bg:      #ffffff;
  --tc-bg-soft: #f6f8fb;
  --tc-radius:  10px;
  --tc-shadow:  0 1px 3px rgba(20,30,50,.08), 0 6px 20px rgba(20,30,50,.05);
  --tc-shadow-hover: 0 6px 16px rgba(20,30,50,.12), 0 14px 40px rgba(20,30,50,.10);
  --tc-ease:    cubic-bezier(.22,.61,.36,1);
}

@media (prefers-color-scheme: dark) {
  :root {
    --tc-ink: #e7ecf3; --tc-muted:#9aa6b4; --tc-border:#2b333f;
    --tc-bg:#1c222b; --tc-bg-soft:#232b36; --tc-none:#3a4250;
    --tc-shadow: 0 1px 3px rgba(0,0,0,.4); --tc-shadow-hover: 0 10px 30px rgba(0,0,0,.5);
  }
}

/* ---------- Layout & typography ---------- */
.tc-page-title { display:flex; align-items:center; gap:.5rem; }
.tc-ref { font-family: ui-monospace, "SFMono-Regular", Menlo, monospace; font-size:.82em;
  background:var(--tc-bg-soft); border:1px solid var(--tc-border); color:var(--tc-muted);
  padding:1px 6px; border-radius:6px; white-space:nowrap; }
.tc-hint { color:var(--tc-muted); font-size:.9em; margin:.2rem 0 1rem; }
.tc-muted { color:var(--tc-muted); }
.tc-sub { color:var(--tc-muted); font-weight:normal; font-size:.85em; }
.tc-mt { margin-top:1.2rem; }
.tc-mono { font-family: ui-monospace, Menlo, monospace; }
.tc-section-title { margin-top:1.6rem; border-bottom:2px solid var(--tc-border); padding-bottom:.3rem; }
.tc-side-heading { margin:1rem 0 .4rem; font-size:.95em; color:var(--tc-muted); text-transform:uppercase; letter-spacing:.04em; }

/* ---------- Buttons ---------- */
.tc-btn { display:inline-flex; align-items:center; gap:.35rem; padding:.4rem .8rem;
  border:1px solid var(--tc-border); border-radius:8px; background:var(--tc-bg); color:var(--tc-ink);
  cursor:pointer; font-size:.88em; text-decoration:none; transition:all .18s var(--tc-ease); }
.tc-btn:hover { border-color:var(--tc-blue); box-shadow:0 2px 8px rgba(47,126,216,.18); transform:translateY(-1px); }
.tc-btn:active { transform:translateY(0); }
.tc-btn-primary { background:linear-gradient(180deg,#3a8bea,#2f7ed8); border-color:#2f7ed8; color:#fff; }
.tc-btn-primary:hover { box-shadow:0 4px 14px rgba(47,126,216,.4); }
.tc-btn-ghost { background:transparent; color:var(--tc-muted); }
.tc-btn-sm { padding:.25rem .6rem; font-size:.82em; }
.tc-btn-xs { padding:.15rem .5rem; font-size:.78em; border-radius:6px; }

/* ---------- Badges & chips ---------- */
.tc-badge { display:inline-block; padding:.12rem .55rem; border-radius:999px; font-size:.76em;
  font-weight:600; line-height:1.5; white-space:nowrap; color:#fff; }
.tc-pass, .tc-tstatus-passed, .tc-tstatus-active { background:var(--tc-pass); }
.tc-fail, .tc-tstatus-failed { background:var(--tc-fail); }
.tc-blocked, .tc-tstatus-blocked { background:var(--tc-blocked); }
.tc-skipped { background:var(--tc-skipped); }
.tc-none, .tc-tstatus-not-configured, .tc-tstatus-pending { background:var(--tc-none); color:var(--tc-ink); }
.tc-tstatus-archived { background:var(--tc-slate); }
.tc-draft { background:#9aa4b2; } .tc-review { background:#f0932b; }
.tc-approved { background:#23a559; } .tc-deprecated { background:#8894a5; }
.tc-auto-manual { background:#8894a5; } .tc-auto-automated { background:#2f7ed8; }
.tc-auto-hybrid { background:#7b5cff; } .tc-auto-not-automatable { background:#c0392b; }
.tc-chip { display:inline-block; padding:.1rem .5rem; border-radius:6px; font-size:.78em;
  background:var(--tc-bg-soft); border:1px solid var(--tc-border); color:var(--tc-muted); }
.tc-tag { display:inline-block; padding:.05rem .45rem; border-radius:6px; font-size:.75em;
  background:rgba(47,126,216,.1); color:var(--tc-blue); }
.tc-prio { font-weight:600; font-size:.82em; }
.tc-prio-low { color:#8894a5; } .tc-prio-normal { color:var(--tc-blue); }
.tc-prio-high { color:#f0932b; } .tc-prio-critical { color:var(--tc-fail); }
.tc-case-meta { display:flex; flex-wrap:wrap; gap:.4rem; align-items:center; margin:.5rem 0 1rem; }

/* ---------- Filters ---------- */
.tc-filters { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; margin:.6rem 0 1rem;
  padding:.6rem; background:var(--tc-bg-soft); border:1px solid var(--tc-border); border-radius:var(--tc-radius); }
.tc-search, .tc-mini { padding:.35rem .6rem; border:1px solid var(--tc-border); border-radius:8px;
  background-color:var(--tc-bg); color:var(--tc-ink); height:auto; line-height:1.4; vertical-align:middle;
  transition:border-color .15s, box-shadow .15s; }
.tc-search { min-width:240px; }
.tc-search:focus, .tc-mini:focus { border-color:var(--tc-blue); box-shadow:0 0 0 3px rgba(47,126,216,.15); outline:none; }

/* Redmine sets appearance:none on every <select> and supplies its own chevron via
   background-image; plugin rules set background-color + custom padding, so give selects
   a theme-aware caret and room for it, and override Redmine's fixed 24px height. */
select.tc-mini, select.tc-micro, .tc-form select, .tc-issue-panel select {
  -webkit-appearance:none; -moz-appearance:none; appearance:none;
  height:auto; min-height:2rem; line-height:1.4; padding-right:1.65rem;
  background-color:var(--tc-bg); color:var(--tc-ink);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='7' viewBox='0 0 10 7'%3E%3Cpath d='M1 1.5l4 4 4-4' fill='none' stroke='%2378828f' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right .55rem center; background-size:10px 7px; }
select.tc-micro { min-height:1.6rem; padding-right:1.4rem; }

/* ---------- Lists ---------- */
table.tc-list { width:100%; border-collapse:separate; border-spacing:0; }
/* Contain a wide table's horizontal overflow to itself instead of pushing the
   whole #content area wide (Redmine gives #content overflow-x:auto). */
.tc-table-scroll { overflow-x:auto; max-width:100%; }
/* Redmine's `#content { overflow-x:auto }` implicitly makes overflow-y:auto,
   producing a 2nd (inner) vertical scrollbar on long plugin pages. Wide tables
   are contained by .tc-table-scroll, so let #content grow normally here. */
body.controller-test_cases #content,
body.controller-test_bundles #content,
body.controller-test_plans #content,
body.controller-test_runs #content,
body.controller-test_data_sets #content,
body.controller-test_environments #content { overflow-x:visible; }
table.tc-list thead th { background:var(--tc-bg-soft); font-size:.8em; text-transform:uppercase;
  letter-spacing:.03em; color:var(--tc-muted); padding:.55rem .6rem; border-bottom:2px solid var(--tc-border);
  white-space:normal; }   /* let long headers (e.g. "Automation status") wrap so the table can fit */
table.tc-list tbody td { padding:.5rem .6rem; border-bottom:1px solid var(--tc-border); }
.tc-row { transition:background .15s var(--tc-ease); animation:tcFadeIn .4s var(--tc-ease) both; }
.tc-row:hover { background:var(--tc-bg-soft); }
.tc-row-fail { box-shadow:inset 3px 0 0 var(--tc-fail); }
.tc-row-pass { box-shadow:inset 3px 0 0 var(--tc-pass); }
.tc-row-unmapped { background:rgba(240,147,43,.06); }
.tc-compact td { padding:.35rem .5rem; font-size:.9em; }
.tc-check { width:26px; text-align:center; }
.tc-mode { font-size:.8em; padding:.05rem .4rem; border-radius:5px; }
.tc-mode-manual { background:var(--tc-bg-soft); color:var(--tc-muted); }
.tc-mode-automated { background:rgba(47,126,216,.12); color:var(--tc-blue); }

/* ---------- Empty states ---------- */
.tc-empty { text-align:center; color:var(--tc-muted); }
.tc-empty-state { text-align:center; padding:2.5rem 1rem; color:var(--tc-muted); }
.tc-empty-icon { font-size:2.4rem; display:block; margin-bottom:.5rem; opacity:.7;
  animation:tcFloat 3s ease-in-out infinite; }

/* ---------- Cards ---------- */
.tc-card-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:1rem; margin:1rem 0; }
.tc-card { display:block; padding:1rem; background:var(--tc-bg); border:1px solid var(--tc-border);
  border-radius:var(--tc-radius); box-shadow:var(--tc-shadow); text-decoration:none; color:var(--tc-ink);
  transition:transform .2s var(--tc-ease), box-shadow .2s var(--tc-ease); animation:tcFadeUp .45s var(--tc-ease) both; }
.tc-card:hover { transform:translateY(-4px); box-shadow:var(--tc-shadow-hover); }
.tc-card-archived { opacity:.6; }
.tc-card-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:.4rem; }
.tc-card-title { margin:.2rem 0; font-size:1.05em; }
.tc-card-desc { color:var(--tc-muted); font-size:.85em; min-height:2.2em; }
.tc-card-foot { display:flex; gap:1rem; margin-top:.6rem; padding-top:.6rem; border-top:1px solid var(--tc-border); font-size:.85em; }
.tc-metric strong { color:var(--tc-ink); font-size:1.05em; }
.tc-report-card { text-align:center; }
.tc-report-icon { font-size:2rem; display:block; margin-bottom:.4rem; }

/* ---------- Dashboard ---------- */
.tc-dash-hero { display:flex; gap:1.5rem; align-items:center; flex-wrap:wrap; margin:1rem 0 1.4rem;
  padding:1.2rem; background:var(--tc-bg); border:1px solid var(--tc-border); border-radius:var(--tc-radius); box-shadow:var(--tc-shadow); }
.tc-hero-ring { text-align:center; }
.tc-hero-ring-cap, .tc-sub { color:var(--tc-muted); font-size:.8em; margin-top:.3rem; }
.tc-hero-tiles { display:grid; grid-template-columns:repeat(auto-fit,minmax(110px,1fr)); gap:.7rem; flex:1; min-width:280px; }
.tc-tile { padding:.8rem; border-radius:var(--tc-radius); background:var(--tc-bg-soft);
  border:1px solid var(--tc-border); text-align:center; animation:tcFadeUp .5s var(--tc-ease) both; transition:transform .15s; }
.tc-tile:hover { transform:translateY(-3px); }
.tc-tile-value { font-size:1.7rem; font-weight:700; line-height:1.1; }
.tc-tile-label { font-size:.75em; color:var(--tc-muted); text-transform:uppercase; letter-spacing:.03em; }
.tc-tile-blue .tc-tile-value{color:var(--tc-blue);} .tc-tile-green .tc-tile-value{color:var(--tc-pass);}
.tc-tile-red .tc-tile-value{color:var(--tc-fail);} .tc-tile-amber .tc-tile-value{color:var(--tc-amber);}
.tc-tile-purple .tc-tile-value{color:var(--tc-purple);} .tc-tile-slate .tc-tile-value{color:var(--tc-slate);}
.tc-dash-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:1rem; margin-bottom:1rem; }
.tc-panel { border-radius:var(--tc-radius); box-shadow:var(--tc-shadow); }
.tc-panel h3 { margin-top:0; }

/* ---------- Pass ring (SVG) ---------- */
.tc-ring { position:relative; display:inline-block; }
.tc-ring svg { width:100%; height:100%; transform:rotate(-90deg); }
.tc-ring-track { fill:none; stroke:var(--tc-border); stroke-width:9; }
.tc-ring-fill { fill:none; stroke-width:9; stroke-linecap:round;
  transition:stroke-dashoffset 1.1s var(--tc-ease); }
.tc-ring-good .tc-ring-fill { stroke:var(--tc-pass); }
.tc-ring-warn .tc-ring-fill { stroke:var(--tc-amber); }
.tc-ring-bad  .tc-ring-fill { stroke:var(--tc-fail); }
.tc-ring-label { position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-weight:700; font-size:1.1rem; color:var(--tc-ink); }

/* ---------- Progress bar ---------- */
.tc-progress { display:flex; height:14px; border-radius:8px; overflow:hidden; background:var(--tc-bg-soft);
  border:1px solid var(--tc-border); margin:.6rem 0; }
.tc-progress-empty::after { content:""; flex:1; }
.tc-seg { height:100%; width:0; transition:width 1s var(--tc-ease); }
.tc-legend { list-style:none; display:flex; flex-wrap:wrap; gap:1rem; padding:0; margin:.5rem 0 0; font-size:.85em; }
.tc-legend li { display:flex; align-items:center; gap:.35rem; }
.tc-dot { width:11px; height:11px; border-radius:3px; display:inline-block; }

/* ---------- Trend chart ---------- */
/* Plugin guide */
.tc-guide-toc ol { columns:2; margin:.4rem 0 0; padding-left:1.2rem; }
.tc-guide-toc a { color:var(--tc-blue); text-decoration:none; }
.tc-guide-toc a:hover { text-decoration:underline; }
.box.tc-section[id] { scroll-margin-top:1rem; }
/* Pass/fail line chart (inline SVG) */
.tc-linechart-wrap { margin-top:.4rem; }
.tc-linechart { width:100%; height:auto; display:block; overflow:visible; }
.tc-lc-grid { stroke:var(--tc-border); stroke-width:1; }
.tc-lc-axis { fill:var(--tc-muted); font-size:10px; }
.tc-lc-line-pass { fill:none; stroke:var(--tc-pass); stroke-width:2; stroke-linejoin:round; stroke-linecap:round; }
.tc-lc-line-fail { fill:none; stroke:var(--tc-fail); stroke-width:2; stroke-linejoin:round; stroke-linecap:round; }
.tc-lc-dot-pass { fill:var(--tc-pass); }
.tc-lc-dot-fail { fill:var(--tc-fail); }
.tc-lc-end-pass { fill:var(--tc-pass); font-size:10px; font-weight:700; }
.tc-lc-end-fail { fill:var(--tc-fail); font-size:10px; font-weight:700; }
.tc-lc-legend { display:flex; gap:1.2rem; margin-top:.4rem; font-size:.8em; color:var(--tc-muted); justify-content:center; }
.tc-lc-key { display:inline-flex; align-items:center; gap:.35rem; }
.tc-lc-sw { width:14px; height:3px; border-radius:2px; display:inline-block; }
.tc-lc-sw-pass { background:var(--tc-pass); }
.tc-lc-sw-fail { background:var(--tc-fail); }
.tc-trend { display:flex; align-items:flex-end; gap:4px; height:120px; padding-top:.5rem; }
.tc-trend-col { flex:1; display:flex; flex-direction:column; align-items:center; height:100%; }
.tc-trend-bars { flex:1; width:100%; display:flex; flex-direction:column; justify-content:flex-end; gap:2px; }
.tc-trend-bar { width:100%; border-radius:3px 3px 0 0; min-height:1px; transition:height .8s var(--tc-ease); }
.tc-trend-bar.tc-pass { background:var(--tc-pass); }
.tc-trend-bar.tc-fail { background:var(--tc-fail); }
.tc-trend-label { font-size:.65em; color:var(--tc-muted); margin-top:.2rem; }

/* ---------- Horizontal bar list ---------- */
.tc-hbar-list { list-style:none; padding:0; margin:.5rem 0 0; }
.tc-hbar-list li { display:flex; align-items:center; gap:.6rem; margin:.4rem 0; font-size:.88em; }
.tc-hbar-label { width:120px; text-align:right; color:var(--tc-muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tc-hbar { flex:1; height:10px; background:var(--tc-bg-soft); border-radius:6px; overflow:hidden; }
.tc-hbar-fill { display:block; height:100%; width:0; background:linear-gradient(90deg,var(--tc-blue),var(--tc-purple));
  border-radius:6px; transition:width .9s var(--tc-ease); }
.tc-hbar-val { width:36px; font-weight:600; }

/* ---------- Forms ---------- */
.tc-form-grid { display:grid; grid-template-columns:2fr 1fr; gap:1rem; }
@media (max-width:820px){ .tc-form-grid{ grid-template-columns:1fr; } }
.tc-form .wiki-edit, .tc-input-lg { width:100%; box-sizing:border-box; }
.tc-input-lg { padding:.45rem .6rem; font-size:1.05em; border:1px solid var(--tc-border); border-radius:8px; }

/* Consistent field layout across all plugin forms — label on its own line,
   control fills the column, so field groups line up neatly. */
.tc-form p:not(.tc-inline-check):not(.tc-form-actions),
.tc-automation-fields > p {
  display:flex; flex-direction:column; gap:.25rem; margin:.55rem 0; }
.tc-form p > label:first-child, .tc-automation-fields > p > label:first-child {
  font-size:.82em; font-weight:600; color:var(--tc-muted); }
.tc-form p > br { display:none; }
.tc-form textarea { width:100%; box-sizing:border-box; }
/* Selects size to their content in single-column forms (bundle/run/…); the
   Test Case & Plan grid columns keep full-width selects (override below). */
.tc-form select { width:auto; max-width:100%; align-self:flex-start; box-sizing:border-box; }
.tc-form-side select, .tc-form-main select { width:100%; align-self:stretch; }
.tc-form-side input[type="text"], .tc-form-main input[type="text"],
.tc-automation-fields input[type="text"] { width:100%; box-sizing:border-box; }
.tc-form input[type="text"], .tc-form input[type="number"] { max-width:100%; box-sizing:border-box; }
.tc-form select, .tc-form input[type="text"], .tc-form input[type="number"], .tc-form textarea {
  padding:.4rem .55rem; border:1px solid var(--tc-border); border-radius:7px;
  background:var(--tc-bg); color:var(--tc-ink); font-size:.95em; }
.tc-form select:focus, .tc-form input:focus, .tc-form textarea:focus {
  border-color:var(--tc-blue); box-shadow:0 0 0 3px rgba(47,126,216,.15); outline:none; }
.tc-automation-fields { margin-top:.3rem; padding-top:.3rem; border-top:1px dashed var(--tc-border); }
.tc-inline-empty { display:flex; align-items:center; gap:.6rem; color:var(--tc-muted); font-size:.9em; }
/* Scrollable multi-column grid; !important overrides Redmine's .tabular label
   float so labels don't collapse into a cluttered column when there are many. */
.tc-tracker-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr));
  gap:.1rem .7rem; margin:.3rem 0 .5rem; padding:.6rem .8rem; background:var(--tc-bg-soft);
  border:1px solid var(--tc-border); border-radius:8px; max-height:230px; overflow-y:auto; }
.tc-tracker-list label.tc-tracker-item {
  display:flex !important; align-items:center; gap:.4rem; margin:0 !important; padding:.15rem 0;
  float:none !important; width:auto !important; text-align:left !important;
  font-weight:normal !important; line-height:1.5 !important; font-size:.92em; cursor:pointer; }
.tc-tracker-list label.tc-tracker-item:hover { color:var(--tc-blue); }
.tc-tracker-item input { width:auto !important; float:none !important; margin:0 !important; }
.tc-tracker-item span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tc-tracker-item .tc-trk-id { color:var(--tc-muted); font-size:.85em; font-family:ui-monospace,Menlo,monospace; }
.tc-attach-field .tc-attach-widget { display:block; margin-top:.2rem; }
.tc-attach-hint { display:block; margin-top:.25rem; font-size:.8em; color:var(--tc-muted); }
.tc-shot-grid { display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:.6rem; }
.tc-shot .tc-screenshot { max-width:150px; max-height:120px; object-fit:cover; }
.tc-attr-table { width:100%; font-size:.9em; }
.tc-attr-table th { text-align:left; color:var(--tc-muted); font-weight:500; width:42%; padding:.28rem 0; vertical-align:top; }
.tc-attr-wide th { width:22%; }
.tc-form-actions { margin-top:1rem; display:flex; gap:.6rem; }
.tc-inline-check { display:flex; align-items:center; gap:.4rem; }
.tc-section { margin:1rem 0; }
.tc-log { background:#12161c; color:#d6deea; padding:.8rem; border-radius:8px; overflow:auto; font-size:.82em; max-height:340px; }

/* ---------- Case picker ---------- */
.tc-case-picker { border:1px solid var(--tc-border); border-radius:var(--tc-radius); overflow:hidden; background:var(--tc-bg); }
.tc-picker-search { width:100%; padding:.5rem .7rem; border:none; border-bottom:1px solid var(--tc-border); background:var(--tc-bg-soft); box-sizing:border-box; }
.tc-picker-search:focus { outline:none; box-shadow:inset 0 -2px 0 var(--tc-blue); }
.tc-picker-list { max-height:320px; overflow-y:auto; }
.tc-picker-item { display:flex; align-items:center; gap:.5rem; padding:.4rem .7rem; border-bottom:1px solid var(--tc-border);
  cursor:pointer; transition:background .12s; }
.tc-picker-item:hover { background:var(--tc-bg-soft); }
.tc-picker-item.tc-hidden { display:none; }
.tc-picker-title { flex:1; }
.tc-picker-foot { padding:.4rem .7rem; font-size:.82em; color:var(--tc-muted); background:var(--tc-bg-soft); }

/* ---------- Bulk bar ---------- */
.tc-bulk-bar { position:sticky; bottom:0; display:flex; flex-wrap:wrap; gap:.6rem; align-items:center; padding:.6rem .8rem;
  background:var(--tc-bg); border:1px solid var(--tc-border); border-radius:var(--tc-radius); box-shadow:var(--tc-shadow-hover);
  margin-top:.6rem; transform:translateY(120%); opacity:0; transition:all .25s var(--tc-ease);
  pointer-events:none; }
.tc-bulk-bar.tc-visible { transform:translateY(0); opacity:1; pointer-events:auto; }
.tc-bulk-count { font-weight:600; }
.tc-segregate { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; margin:0 0 1rem; padding:.6rem .8rem; }
.tc-segregate-label { font-weight:700; color:var(--tc-blue); }

/* Tag-chip input on the case form */
.tc-tagbox { display:flex; flex-wrap:wrap; gap:.3rem; align-items:center; border:1px solid var(--tc-border);
  border-radius:8px; padding:.3rem .4rem; background:var(--tc-bg); }
.tc-tagbox:focus-within { border-color:var(--tc-blue); box-shadow:0 0 0 3px rgba(47,126,216,.15); }
.tc-tag-chip { display:inline-flex; align-items:center; gap:.25rem; background:#eef2ff; border:1px solid #c7d2fe;
  color:#3730a3; border-radius:999px; padding:.08rem .5rem; font-size:.8em; white-space:nowrap; }
.tc-tag-x { border:0; background:none; color:#3730a3; cursor:pointer; font-size:1.05em; line-height:1; padding:0; }
.tc-tag-x:hover { color:var(--tc-fail); }
.tc-tagbox .tc-tag-entry { border:0 !important; outline:none; box-shadow:none !important; width:auto !important;
  min-width:110px; flex:1; margin:0 !important; background:transparent; font-size:.9em; padding:.15rem; }

/* Searchable single-select (tag filter) */
.tc-ssel { position:relative; display:inline-block; vertical-align:middle; }
.tc-ssel-trigger { cursor:pointer; text-align:left; min-width:130px; background:var(--tc-bg); }
.tc-ssel-panel { position:absolute; z-index:40; top:calc(100% + 3px); left:0; width:230px; background:var(--tc-bg);
  border:1px solid var(--tc-border); border-radius:8px; box-shadow:var(--tc-shadow-hover); padding:.45rem; }
.tc-ssel-search { width:100%; box-sizing:border-box; margin-bottom:.35rem; padding:.35rem .5rem;
  border:1px solid var(--tc-border); border-radius:6px; font-size:.9em; }
.tc-ssel-search:focus { outline:none; border-color:var(--tc-blue); box-shadow:0 0 0 3px rgba(47,126,216,.15); }
.tc-ssel-list { display:block; max-height:230px; overflow-y:auto; }
.tc-ssel-opt { display:block; padding:.32rem .5rem; border-radius:6px; color:var(--tc-ink); text-decoration:none; font-size:.9em; }
.tc-ssel-opt:hover { background:var(--tc-bg-soft); color:var(--tc-blue); }
.tc-run-ssel .tc-ssel-trigger { max-width:300px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tc-run-ssel .tc-ssel-panel { width:340px; }
/* Searchable multi-select */
.tc-mssel { position:relative; display:inline-block; vertical-align:middle; }
.tc-mssel-trigger { cursor:pointer; text-align:left; min-width:170px; background:var(--tc-bg); }
.tc-mssel-panel { position:absolute; z-index:40; top:calc(100% + 3px); left:0; width:270px; background:var(--tc-bg);
  border:1px solid var(--tc-border); border-radius:8px; padding:.4rem; box-shadow:0 8px 24px rgba(0,0,0,.15); }
.tc-mssel-panel[hidden] { display:none; }
.tc-mssel-search { width:100%; box-sizing:border-box; margin-bottom:.35rem; padding:.35rem .5rem;
  border:1px solid var(--tc-border); border-radius:6px; }
.tc-mssel-search:focus { outline:none; border-color:var(--tc-blue); box-shadow:0 0 0 3px rgba(47,126,216,.15); }
.tc-mssel-list { display:block; max-height:230px; overflow-y:auto; }
.tc-mssel-opt { display:flex; align-items:center; gap:.45rem; padding:.3rem .45rem; border-radius:6px; cursor:pointer; font-weight:400; }
.tc-mssel-opt:hover { background:var(--tc-bg-soft); }
.tc-mssel-opt input { margin:0; }

/* Sidebar link icons */
.tc-nav-ico { display:inline-block; width:1.3em; text-align:center; }

/* ---------- Collapsible ---------- */
.tc-collapse-toggle { cursor:pointer; user-select:none; transition:color .15s; }
.tc-collapse-toggle:hover { color:var(--tc-blue); }
[data-collapse-body] { overflow:hidden; transition:max-height .35s var(--tc-ease), opacity .25s, padding .2s; }
.tc-collapsed [data-collapse-body] { max-height:0 !important; opacity:0; padding-top:0 !important; padding-bottom:0 !important; }

/* ---------- Alerts ---------- */
.tc-alert { padding:.6rem .9rem; border-radius:8px; margin:.6rem 0; font-size:.9em; animation:tcFadeIn .3s; }
.tc-alert-warn { background:rgba(240,147,43,.12); border:1px solid rgba(240,147,43,.4); color:#a35a09; }

/* ---------- Two column ---------- */
.tc-two-col { display:grid; grid-template-columns:2fr 1fr; gap:1.2rem; }
@media (max-width:820px){ .tc-two-col{ grid-template-columns:1fr; } }
.tc-linklist { list-style:none; padding:0; } .tc-linklist li { padding:.25rem 0; border-bottom:1px solid var(--tc-border); }

/* ---------- Release banner ---------- */
.tc-release-banner { display:flex; align-items:center; gap:1rem; padding:1.2rem; border-radius:var(--tc-radius);
  margin:1rem 0; animation:tcFadeUp .4s var(--tc-ease) both; }
.tc-release-go { background:rgba(35,165,89,.12); border:1px solid rgba(35,165,89,.4); }
.tc-release-nogo { background:rgba(224,69,62,.1); border:1px solid rgba(224,69,62,.4); }
.tc-release-icon { font-size:2.4rem; }
.tc-checklist { list-style:none; padding:0; }
.tc-checklist li { padding:.35rem 0 .35rem 1.6rem; position:relative; }
.tc-checklist li::before { position:absolute; left:0; }
.tc-checklist li.ok::before { content:"✅"; } .tc-checklist li.bad::before { content:"⛔"; } .tc-checklist li.warn::before { content:"⚠️"; }

/* ---------- Issue testing panel ---------- */
.tc-issue-panel { border:1px solid var(--tc-border); border-radius:var(--tc-radius); margin-top:1rem;
  background:var(--tc-bg); box-shadow:var(--tc-shadow); overflow:hidden; animation:tcFadeIn .4s var(--tc-ease); }
.tc-issue-panel-head { display:flex; align-items:center; justify-content:space-between; padding:.7rem 1rem;
  cursor:pointer; background:linear-gradient(180deg,var(--tc-bg-soft),var(--tc-bg)); border-bottom:1px solid var(--tc-border); }
.tc-issue-panel-head h3 { margin:0; display:flex; align-items:center; gap:.5rem; font-size:1em; }
.tc-issue-passrate { font-size:.8em; color:var(--tc-muted); font-weight:normal; }
.tc-collapse-caret { transition:transform .3s var(--tc-ease); }
.tc-collapsed .tc-collapse-caret { transform:rotate(-90deg); }
.tc-issue-panel-body { padding:.8rem 1rem; }
.tc-issue-bundles { display:flex; flex-wrap:wrap; gap:.5rem; margin:.5rem 0; }
.tc-bundle-chip { display:inline-flex; align-items:center; gap:.35rem; padding:.2rem .6rem; border-radius:999px;
  background:rgba(47,126,216,.1); border:1px solid rgba(47,126,216,.25); font-size:.85em; }
.tc-chip-x { color:var(--tc-fail); text-decoration:none; font-weight:700; padding:0 .2rem; }
.tc-issue-actions { display:flex; flex-wrap:wrap; gap:.6rem; align-items:center; margin:.6rem 0; }
.tc-inline-form { display:inline-flex; gap:.35rem; align-items:center; }
.tc-issue-cases { width:100%; border-collapse:collapse; margin-top:.6rem; font-size:.9em; }
.tc-issue-cases th { text-align:left; font-size:.75em; text-transform:uppercase; color:var(--tc-muted); padding:.3rem .4rem; border-bottom:1px solid var(--tc-border); }
.tc-issue-cases td { padding:.35rem .4rem; border-bottom:1px solid var(--tc-border); }
/* Inline expand of a case's description + steps on the issue panel */
.tc-case-expand { background:none; border:none; cursor:pointer; color:var(--tc-blue); font-size:.9em; padding:0 .25rem 0 0; line-height:1; }
.tc-case-detail-cell { padding:0 !important; border:0 !important; background:var(--tc-bg-soft,#f7f9fc); }
.tc-cd-wrap { max-height:0; overflow:hidden; transition:max-height .25s ease; }
.tc-case-detail { padding:.6rem .85rem; }
.tc-cd-block { margin-bottom:.6rem; }
.tc-cd-block:last-child { margin-bottom:0; }
.tc-cd-block h5 { margin:0 0 .2rem; font-size:.72em; text-transform:uppercase; letter-spacing:.03em; color:var(--tc-muted); }
.tc-cd-block .wiki { font-size:.92em; }
.tc-cd-block .wiki p { margin:.2rem 0; }
.tc-result-dot { width:10px; height:10px; border-radius:50%; display:inline-block; }
/* Run/environment picker on the issue Testing panel */
.tc-run-bar { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; margin:.6rem 0 .2rem;
  padding:.5rem .6rem; background:var(--tc-soft, #f5f7fa); border:1px solid var(--tc-border); border-radius:8px; }
.tc-run-bar-label { font-weight:600; font-size:.85em; }
.tc-run-bar-hint { font-size:.78em; flex-basis:100%; }
.tc-env-chip { display:inline-block; padding:.1rem .5rem; border-radius:999px; font-size:.78em; font-weight:600;
  background:rgba(47,126,216,.12); color:var(--tc-blue); border:1px solid rgba(47,126,216,.3); }
/* Lightweight modal (inline new-run creation) */
.tc-modal { display:none; position:fixed; inset:0; z-index:1000; align-items:center; justify-content:center; }
.tc-modal:not([hidden]) { display:flex; }
.tc-modal-backdrop { position:absolute; inset:0; background:rgba(20,28,38,.5); backdrop-filter:blur(1px); }
.tc-modal-box { position:relative; width:min(420px,92vw); background:var(--tc-card,#fff); border:1px solid var(--tc-border);
  border-radius:12px; box-shadow:0 12px 40px rgba(0,0,0,.25); overflow:hidden; animation:tc-modal-in .15s ease; }
@keyframes tc-modal-in { from { opacity:0; transform:translateY(8px) scale(.98); } to { opacity:1; transform:none; } }
.tc-modal-head { display:flex; align-items:center; justify-content:space-between; padding:.7rem 1rem; border-bottom:1px solid var(--tc-border); }
.tc-modal-head h4 { margin:0; font-size:1em; }
.tc-modal-x { background:none; border:none; font-size:1.3rem; line-height:1; cursor:pointer; color:var(--tc-muted); }
.tc-modal-x:hover { color:var(--tc-fail,#c0392b); }
.tc-modal-body { padding:1rem; display:flex; flex-direction:column; gap:.7rem; }
.tc-modal-label { display:flex; flex-direction:column; gap:.25rem; font-size:.85em; font-weight:600; }
.tc-modal-label input, .tc-modal-label select { width:100%; }
.tc-modal-err { margin:0; color:var(--tc-fail,#c0392b); font-size:.85em; }
.tc-modal-note { font-weight:400; font-size:.8em; color:var(--tc-muted); }
.tc-env-checks { display:flex; flex-wrap:wrap; gap:.4rem .5rem; margin:.15rem 0; }
.tc-env-check { display:inline-flex; align-items:center; gap:.3rem; font-weight:400; font-size:.9em; cursor:pointer;
  padding:.15rem .55rem; border:1px solid var(--tc-border); border-radius:8px; user-select:none; }
.tc-env-check input { margin:0; }
.tc-env-check:has(input:checked) { border-color:var(--tc-blue); background:rgba(47,126,216,.1); color:var(--tc-blue); font-weight:600; }
.tc-modal-foot { display:flex; justify-content:flex-end; gap:.5rem; padding:.7rem 1rem; border-top:1px solid var(--tc-border); background:var(--tc-soft,#f5f7fa); }
.tc-micro { padding:.1rem .3rem; font-size:.8em; border:1px solid var(--tc-border); border-radius:5px; }
/* Screenshot attach on the record row: 📎 button opens a per-case paste/upload box */
.tc-attach { position:relative; display:inline-block; }
.tc-attach .tc-run-file { display:none; }
.tc-attach-btn { line-height:1; }
.tc-attach-btn.has-file { border-color:var(--tc-blue); background:rgba(47,126,216,.16); }
.tc-attach-required .tc-attach-btn::after { content:'*'; color:var(--tc-fail,#c0392b); font-weight:700; margin-left:.1rem; }
.tc-attach.tc-attach-missing .tc-attach-btn { animation:tc-shake .3s; border-color:var(--tc-fail,#c0392b); }
.tc-attach-pop { position:absolute; z-index:60; top:calc(100% + 4px); right:0; width:250px;
  background:var(--tc-bg,#fff); border:1px solid var(--tc-border); border-radius:10px; padding:.6rem;
  box-shadow:0 10px 30px rgba(0,0,0,.18); display:flex; flex-direction:column; gap:.45rem; }
.tc-attach-pop[hidden] { display:none; }
.tc-attach-cap { font-size:.78em; font-weight:600; color:var(--tc-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.tc-attach-drop { display:flex; align-items:center; justify-content:center; min-height:100px; max-height:220px; overflow:auto;
  padding:.5rem; border:2px dashed var(--tc-border); border-radius:8px; text-align:center; cursor:pointer; color:var(--tc-muted); font-size:.82em; }
.tc-attach-drop:focus { outline:none; border-color:var(--tc-blue); box-shadow:0 0 0 3px rgba(47,126,216,.15); }
.tc-attach-drop.dragover { border-color:var(--tc-blue); background:rgba(47,126,216,.08); }
.tc-attach-thumbs { display:flex; flex-wrap:wrap; gap:.35rem; width:100%; align-content:flex-start; justify-content:flex-start; }
.tc-attach-thumb { position:relative; width:62px; height:62px; }
.tc-attach-thumb img { width:100%; height:100%; object-fit:cover; border-radius:6px; border:1px solid var(--tc-border); display:block; }
.tc-attach-thumb-x { position:absolute; top:-6px; right:-6px; width:18px; height:18px; line-height:16px; text-align:center;
  border-radius:50%; border:none; background:var(--tc-fail,#c0392b); color:#fff; cursor:pointer; font-size:12px; padding:0; }
.tc-attach-foot { display:flex; align-items:center; justify-content:space-between; gap:.4rem; min-height:1.1em; }
.tc-attach-name { font-size:.75em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tc-attach-clear { background:none; border:none; color:var(--tc-fail,#c0392b); cursor:pointer; font-size:.85em; padding:0; }
@keyframes tc-shake { 0%,100%{transform:translateX(0)} 25%{transform:translateX(-3px)} 75%{transform:translateX(3px)} }
.tc-check-row { display:flex; align-items:center; gap:.4rem; flex-wrap:wrap; }
.tc-check-row .info { flex-basis:100%; margin-left:0; }
/* Data set picker on the test case form */
.tc-ds-editor { margin-top:.8rem; }
.tc-ds-list { display:flex; flex-direction:column; gap:.25rem; margin-top:.35rem; max-height:220px; overflow:auto;
  border:1px solid var(--tc-border); border-radius:8px; padding:.5rem .6rem; }
.tc-ds-item { display:flex; align-items:center; gap:.45rem; font-weight:400; cursor:pointer; }
.tc-ds-item input { margin:0; }
.tc-issue-history summary { cursor:pointer; color:var(--tc-blue); margin-top:.6rem; font-size:.9em; }
.tc-issue-data summary { cursor:pointer; color:var(--tc-blue); margin:.5rem 0 .3rem; font-size:.9em; font-weight:600; }
.tc-ds-view { margin:.3rem 0 .7rem; }
.tc-ds-view-head { font-weight:600; font-size:.85em; margin-bottom:.2rem; }
.tc-hist-tools { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem .8rem; margin:.5rem 0 .2rem; font-size:.85em; }
.tc-hist-count:not(:empty)::before { content:'('; }
.tc-hist-count:not(:empty)::after { content:' shown)'; }
.tc-screenshot { max-width:100%; border-radius:8px; border:1px solid var(--tc-border); transition:transform .2s; }
.tc-screenshot:hover { transform:scale(1.02); }

/* ---------- Sidebar nav ---------- */
.tc-side-title { margin:.5rem 0 .3rem; }
.tc-sidenav { list-style:none; padding:0; margin:0; }
.tc-sidenav li a { display:block; padding:.35rem .6rem; border-radius:7px; text-decoration:none; color:var(--tc-ink);
  transition:background .12s, padding-left .12s; }
.tc-sidenav li a:hover { background:var(--tc-bg-soft); padding-left:.85rem; }
.tc-sidenav li.selected a { background:rgba(47,126,216,.12); color:var(--tc-blue); font-weight:600; }

.tc-pagination.pagination { margin-top:1.2rem; display:flex; flex-wrap:wrap; gap:.35rem; align-items:center; }
.tc-pagination a, .tc-pagination span.current {
  display:inline-flex; align-items:center; justify-content:center; min-width:32px; height:32px;
  padding:0 .55rem; border-radius:8px; border:1px solid var(--tc-border); font-size:.9em; line-height:1; text-decoration:none; }
.tc-pagination a { color:var(--tc-blue); background:var(--tc-bg); transition:all .15s var(--tc-ease); }
.tc-pagination a:hover { border-color:var(--tc-blue); background:rgba(47,126,216,.1); transform:translateY(-1px); box-shadow:0 2px 8px rgba(47,126,216,.15); }
.tc-pagination span.current { background:linear-gradient(180deg,#3a8bea,#2f7ed8); border-color:#2f7ed8; color:#fff; font-weight:700; }
.tc-pagination a.tc-page-nav { min-width:auto; padding:0 .75rem; font-weight:600; }
.tc-pagination span.tc-page-nav { display:inline-flex; align-items:center; justify-content:center; height:32px;
  min-width:auto; padding:0 .75rem; border-radius:8px; border:1px solid var(--tc-border); font-size:.9em; color:var(--tc-muted); }
.tc-pagination .tc-disabled { opacity:.45; }
.tc-pagination .tc-page-gap { display:inline-flex; align-items:flex-end; color:var(--tc-muted); border:0; background:none; padding:0 .15rem; }
.tc-ident { font-size:.85em; }

/* ---------- Keyframes ---------- */
@keyframes tcFadeIn { from{ opacity:0; } to{ opacity:1; } }
@keyframes tcFadeUp { from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:translateY(0); } }
@keyframes tcFloat  { 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-6px); } }

@media (prefers-reduced-motion: reduce) {
  * { animation:none !important; transition:none !important; }
}

/* ============================================================
   v2 — Plans, Runs, Steps, Review, Environments, Data Sets,
         Import, Notifications, Reports
   ============================================================ */

/* Stat-tile row */
.tc-tiles { display:grid; grid-template-columns:repeat(auto-fit,minmax(110px,1fr)); gap:.7rem; margin:.6rem 0 1rem; }
.tc-tile-pass .tc-tile-value    { color:var(--tc-pass); }
.tc-tile-fail .tc-tile-value    { color:var(--tc-fail); }
.tc-tile-blocked .tc-tile-value { color:var(--tc-blocked); }

/* Lifecycle status badges (plan/run) — extend existing tc-tstatus set */
.tc-tstatus-completed { background:var(--tc-pass); }
.tc-tstatus-in-progress, .tc-tstatus-review { background:var(--tc-blue); }
.tc-tstatus-planned, .tc-tstatus-draft { background:var(--tc-slate); }
.tc-tstatus-aborted, .tc-tstatus-deprecated { background:var(--tc-none); color:var(--tc-ink); }

/* Environments admin */
.tc-env-row { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; padding:.45rem 0; border-bottom:1px solid var(--tc-border); }
.tc-env-row:last-child { border-bottom:0; }
.tc-env-new { margin-top:.6rem; padding-top:.7rem; border-top:2px solid var(--tc-border); border-bottom:0; }
.tc-env-name { width:170px; }
.tc-env-desc { flex:1; min-width:200px; }
.tc-env-pos  { width:70px; }
.tc-env-active { display:inline-flex; align-items:center; gap:.3rem; color:var(--tc-muted); font-size:.9em; white-space:nowrap; }

/* Structured steps — editor + read-only */
.tc-steps-editor { margin:.4rem 0 1rem; }
.tc-steps-label { display:block; font-weight:600; margin-bottom:.2rem; }
.tc-steps-hint  { display:block; color:var(--tc-muted); font-size:.85em; margin-bottom:.4rem; }
table.tc-steps-table, table.tc-steps-view { width:100%; border-collapse:separate; border-spacing:0; margin:.3rem 0; }
table.tc-steps-table th, table.tc-steps-view th { background:var(--tc-bg-soft); font-size:.76em; text-transform:uppercase;
  letter-spacing:.03em; color:var(--tc-muted); text-align:left; padding:.4rem .5rem; border-bottom:1px solid var(--tc-border); }
table.tc-steps-table td, table.tc-steps-view td { padding:.35rem .5rem; border-bottom:1px solid var(--tc-border); vertical-align:top; }
.tc-step-input { width:100%; box-sizing:border-box; }
.tc-step-num, .tc-step-num-cell { color:var(--tc-muted); font-weight:600; white-space:nowrap; }
.tc-step-handle { width:30px; text-align:center; color:var(--tc-muted); }
.tc-step-actions { white-space:nowrap; width:100px; }
.tc-step-actions button { border:1px solid var(--tc-border); background:var(--tc-bg-soft); border-radius:6px;
  cursor:pointer; padding:.1rem .42rem; margin-left:.12rem; line-height:1; }
.tc-step-actions button:hover { border-color:var(--tc-blue); color:var(--tc-blue); }

/* Version banner + chip + list */
.tc-version-banner { background:#fff8e6; border:1px solid #f3e2b3; border-radius:var(--tc-radius); padding:.5rem .8rem; margin:.5rem 0; font-size:.9em; }
.tc-chip-ver { background:#eef2ff; border:1px solid #c7d2fe; color:#3730a3; }
.tc-version-list td { padding:.22rem .2rem; font-size:.9em; }
.tc-version-list tr.current td { font-weight:600; }

/* Review workflow */
.tc-review-panel { margin:.6rem 0; }
.tc-review-comments { width:100%; box-sizing:border-box; margin-bottom:.4rem; }
.tc-review-actions { display:flex; flex-wrap:wrap; gap:.4rem; }
.tc-review-history { list-style:none; padding:0; margin:0; }
.tc-review-history li { padding:.4rem 0; border-bottom:1px solid var(--tc-border); font-size:.9em; }
.tc-review-comment { color:var(--tc-muted); margin-top:.2rem; }
.tc-review-approved          { background:var(--tc-pass); }
.tc-review-changes-requested { background:var(--tc-fail); }
.tc-review-submitted         { background:var(--tc-blue); }
.tc-review-deprecated        { background:var(--tc-slate); }

/* Advanced search */
.tc-adv-search { margin:0 0 1rem; }
.tc-adv-search summary { cursor:pointer; color:var(--tc-blue); font-size:.9em; padding:.2rem 0; }
.tc-adv-filters { margin-top:.5rem; }

/* Run grid + inline record form */
.tc-run-cell { white-space:nowrap; }
.tc-inline-form { display:inline-flex; gap:.3rem; align-items:center; flex-wrap:wrap; }

/* Bulk bar separators */
.tc-bulk-sep { color:var(--tc-border); margin:0 .15rem; }

/* Import */
.tc-import-result { margin-bottom:1rem; }
.tc-import-errors { margin-top:.5rem; }
.tc-import-errors ul { margin:.3rem 0; padding-left:1.2rem; color:var(--tc-fail); font-size:.88em; }
.tc-sample-links { display:flex; gap:.5rem; flex-wrap:wrap; margin:.3rem 0; }

/* Notifications */
table.tc-notifications td { padding:.5rem .6rem; }
.tc-notifications tr.tc-unread { background:var(--tc-bg-soft); }
.tc-note-dot { width:18px; }
.tc-note-link { font-weight:600; }

/* Dashboard configure */
.tc-widget-toggle { margin:.25rem 0; }
.tc-widget-toggle label { display:inline-flex; gap:.45rem; align-items:center; cursor:pointer; }

/* Multiselect + report toolbar */
select.tc-multiselect { min-width:220px; }
.tc-report-toolbar .tc-print-link { cursor:pointer; }