:root { --test-green:#20a95a; --test-red:#d92d3d; --test-gold:#d99000; --test-blue:#0f8fb5; --test-ink:#202b3c; }
.test-center-shell { max-width: 1500px; }
.test-center-hero { border-bottom-color:#8bd5eb; }
.test-summary { display:grid; grid-template-columns:150px minmax(260px,1fr) minmax(300px,auto); align-items:center; gap:22px; margin-top:18px; padding:20px; border:3px solid #cfe1ea; border-radius:12px; background:#fff; box-shadow:0 5px 0 rgba(0,0,0,.1); }
.test-progress-ring { --progress:0deg; display:grid; place-content:center; width:130px; height:130px; border-radius:50%; text-align:center; background:radial-gradient(circle at center,#fff 0 55%,transparent 56%),conic-gradient(var(--test-green) var(--progress),#e5ebef 0); }
.test-progress-ring strong { font-size:30px; line-height:1; }.test-progress-ring span { color:#657185; font-size:12px; font-weight:900; text-transform:uppercase; }
.test-summary-copy h2 { margin:0 0 7px; font-size:30px; }.test-summary-copy p:last-child { margin:0; color:#657185; font-weight:700; }
.test-summary-chips { display:grid; grid-template-columns:repeat(3,minmax(90px,1fr)); gap:8px; }
.test-count-chip { padding:12px; border:2px solid #d7dfe7; border-radius:8px; background:#f8fafb; }.test-count-chip strong,.test-count-chip span { display:block; }.test-count-chip strong { font-size:22px; }.test-count-chip span { color:#667286; font-size:11px; font-weight:900; text-transform:uppercase; }
.test-count-chip.is-testing { border-color:#6dcc93; background:#effbf4; }.test-count-chip.is-failed { border-color:#ff9daa; background:#fff3f5; }.test-count-chip.is-blocked,.test-count-chip.is-needs_retest { border-color:#e2b650; background:#fff8e5; }.test-count-chip.is-on_hold { border-color:#f2cf45; background:#fffceb; }.test-count-chip.is-ask_ai { border-color:#ee8a38; background:#fff3e8; }.test-count-chip.is-passed { border-color:#aeb6bf; background:#f1f3f4; }
.automatic-test-panel { margin-top:18px; padding:18px; border:3px solid #a9ddec; border-radius:12px; background:#f2fbfe; box-shadow:0 5px 0 rgba(0,0,0,.1); }
.automatic-test-panel>header { display:flex; align-items:center; justify-content:space-between; gap:18px; }.automatic-test-panel h2 { margin:0 0 5px; }.automatic-test-panel p { margin:0; color:#5d6b7f; font-weight:700; }.automatic-test-panel button { flex:none; background:var(--test-green); }
.automatic-test-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-top:15px; }
.automatic-test-card { min-width:0; padding:13px; border:2px solid #cbd9e1; border-radius:8px; background:#fff; }.automatic-test-card header { display:flex; align-items:center; gap:8px; }.automatic-test-card i { color:#758194; }.automatic-test-card strong,.automatic-test-card small { display:block; }.automatic-test-card small { margin-top:5px; color:#6b7688; overflow-wrap:anywhere; }.automatic-test-card.is-passed { border-color:#67c68a; }.automatic-test-card.is-passed i { color:var(--test-green); }.automatic-test-card.is-failed { border-color:#ef7180; }.automatic-test-card.is-failed i { color:var(--test-red); }.automatic-test-card.is-running { border-color:#50b8d4; }
.automatic-test-card details { margin-top:9px; border-top:1px solid #dbe3e8; padding-top:8px; }.automatic-test-card summary { cursor:pointer; color:#314057; font-size:12px; font-weight:900; }.automatic-test-card ul { margin:7px 0 0; padding-left:18px; color:#5f6c7e; font-size:12px; font-weight:700; }.automatic-test-card li+li { margin-top:5px; }
.test-tools { position:sticky; top:8px; z-index:10; display:grid; grid-template-columns:minmax(220px,1fr) auto auto; gap:10px; margin-top:18px; padding:12px; border:2px solid #d5dde5; border-radius:10px; background:rgba(255,255,255,.96); box-shadow:0 4px 14px rgba(32,43,60,.12); }
.test-tools label { display:flex; align-items:center; gap:8px; }.test-tools input { width:100%; }.test-status-filters { display:flex; flex-wrap:wrap; gap:5px; }.test-status-filters button { padding:9px 11px; background:#65717f; }.test-status-filters button.is-active { background:var(--test-blue); }.test-export-link { display:flex; align-items:center; justify-content:center; border-radius:7px; padding:9px 12px; background:#202b3c; color:#fff; font-weight:900; text-decoration:none; }
.test-order-note { display:flex; align-items:center; gap:14px; margin:0 0 16px; padding:14px 18px; border:2px solid #b8dce8; border-radius:8px; background:#f2fbfe; }.test-order-note>span { display:grid; width:42px; height:42px; flex:0 0 42px; place-items:center; border-radius:50%; background:#dff5fb; color:#08758f; }.test-order-note p { margin:3px 0 0; color:#667085; }.test-catalog { display:grid; gap:14px; margin-top:14px; }.test-group { border:3px solid #d7dee5; border-radius:12px; background:#fff; overflow:hidden; box-shadow:0 5px 0 rgba(0,0,0,.09); }.test-group>summary { display:grid; grid-template-columns:46px minmax(0,1fr) auto; align-items:center; gap:12px; padding:16px; cursor:pointer; list-style:none; }.test-group>summary::-webkit-details-marker { display:none; }.test-group-icon { display:grid; place-items:center; width:42px; height:42px; border-radius:50%; background:#e8f8fc; color:#087894; }.test-group-title small,.test-sequence { display:inline-flex; align-items:center; width:fit-content; color:#ff2d38; font-size:12px; font-weight:900; text-transform:uppercase; }.test-group-title strong,.test-group-title span { display:block; }.test-group-title strong { font-size:20px; }.test-group-title span { margin-top:3px; color:#6a7688; font-size:12px; font-weight:900; text-transform:uppercase; }.test-group-progress { min-width:88px; text-align:right; }.test-group-progress strong,.test-group-progress span { display:block; }.test-group-progress span { color:#6c7788; font-size:11px; font-weight:900; text-transform:uppercase; }
.test-list { display:grid; gap:9px; padding:0 14px 14px; }.test-card { display:grid; grid-template-columns:minmax(260px,1fr) minmax(360px,1.3fr); gap:14px; padding:14px; border:2px solid #dbe2e8; border-left-width:7px; border-radius:8px; background:#fbfcfd; transition:opacity .2s ease,background .2s ease; }.test-card[data-status="testing"] { border-left-color:#20a95a; background:#f1fbf5; }.test-card[data-status="passed"] { border-color:#b8bec5; border-left-color:#8d959e; background:#f0f2f3; opacity:.68; filter:grayscale(.35); }.test-card[data-status="failed"] { border-left-color:var(--test-red); background:#fff5f6; }.test-card[data-status="ask_ai"] { border-left-color:#e86f0c; background:#fff5ec; }.test-card[data-status="on_hold"] { border-left-color:#f2c928; background:#fffceb; }.test-card[data-status="blocked"],.test-card[data-status="needs_retest"] { border-left-color:var(--test-gold); background:#fffaf0; }.test-sequence { min-width:42px; justify-content:center; margin-bottom:7px; padding:4px 8px; border:1px solid #ffc2c7; border-radius:999px; background:#fff2f3; }.test-card-copy h3 { margin:0 0 7px; font-size:17px; }.test-card-copy p { margin:0; color:#5e6b7c; font-weight:700; line-height:1.4; }.test-result-editor { display:grid; gap:8px; }.test-result-buttons { display:grid; grid-template-columns:repeat(auto-fit,minmax(86px,1fr)); gap:5px; }.test-result-buttons button { min-width:0; padding:9px 5px; background:#717b87; font-size:11px; }.test-result-buttons button[data-result="testing"].is-active { background:#20a95a; }.test-result-buttons button[data-result="passed"].is-active { background:#68717b; }.test-result-buttons button[data-result="failed"].is-active { background:var(--test-red); }.test-result-buttons button[data-result="ask_ai"].is-active { background:#e86f0c; }.test-result-buttons button[data-result="on_hold"].is-active { background:#f2c928; color:#202b3c; }.test-result-buttons button[data-result="blocked"].is-active,.test-result-buttons button[data-result="needs_retest"].is-active { background:var(--test-gold); color:#202b3c; }.test-result-buttons button[data-result="not_tested"].is-active { background:#202b3c; }.test-result-fields { display:grid; grid-template-columns:1fr 150px; gap:7px; }.test-result-fields textarea { grid-column:1/-1; min-height:76px; resize:vertical; }.test-result-fields input,.test-result-fields textarea { width:100%; }.test-save-row { display:flex; justify-content:space-between; align-items:center; gap:8px; }.test-save-row small { color:#697587; font-weight:800; }.test-save-row button { padding:9px 13px; background:var(--test-blue); }.test-center-status { position:fixed; right:18px; bottom:18px; z-index:30; max-width:420px; margin:0; padding:12px 15px; border-radius:8px; background:#202b3c; color:#fff; font-weight:800; opacity:0; pointer-events:none; transform:translateY(10px); transition:.2s ease; }.test-center-status.is-visible { opacity:1; transform:none; }
@media(max-width:1050px){.automatic-test-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.test-summary{grid-template-columns:130px 1fr}.test-summary-chips{grid-column:1/-1}.test-tools{grid-template-columns:1fr}.test-card{grid-template-columns:1fr}}
@media(max-width:680px){.test-summary{grid-template-columns:1fr;text-align:center}.test-progress-ring{margin:auto}.test-summary-chips{grid-template-columns:repeat(2,minmax(0,1fr))}.automatic-test-panel>header{align-items:stretch;flex-direction:column}.automatic-test-grid{grid-template-columns:1fr}.test-tools{position:static}.test-status-filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.test-group>summary{grid-template-columns:42px 1fr}.test-group-progress{grid-column:2;text-align:left}.test-result-buttons{grid-template-columns:repeat(2,minmax(0,1fr))}.test-result-fields{grid-template-columns:1fr}.test-result-fields textarea{grid-column:auto}}
.test-count-chip.is-answered { border-color:#9367d8; background:#f6f0ff; }
.test-card[data-status="answered"] { border-left-color:#7b42c3; background:#f7f1ff; }
.test-result-buttons button[data-result="answered"].is-active { background:#7b42c3; }
.test-result-fields textarea[data-result-answer] { border-color:#c9b2eb; background:#fbf8ff; }