/* Shared support feedback + test-case experience, tenant-theme aware. */
.sup-feedback-widget{
 position:fixed;right:14px;bottom:12px;z-index:99999;
 font-family:var(--brand-body-font,Arial,sans-serif);font-size:13px
}
.sup-feedback-launcher{
 border:0;
 background:var(--brand-primary,#111);
 color:var(--brand-button-text,#fff);
 border-radius:16px;padding:6px 10px;font-size:11px;cursor:pointer;
 box-shadow:0 2px 8px rgba(0,0,0,.22)
}
.sup-feedback-panel{
 position:absolute;right:0;bottom:36px;width:min(360px,calc(100vw - 28px));
 background:var(--brand-surface,#fff);
 border:1px solid var(--brand-border,#d8d8d8);
 border-radius:var(--brand-radius,10px);
 padding:14px;box-shadow:0 12px 36px rgba(0,0,0,.24);
 color:var(--brand-text,#222)
}
.sup-feedback-panel-head,.sup-card-head,.sup-row-actions,
.sup-toolbar,.sup-test-meta{display:flex;align-items:center;gap:10px}
.sup-feedback-panel-head,.sup-card-head{justify-content:space-between}
.sup-feedback-close{border:0;background:transparent;font-size:24px;cursor:pointer;color:var(--brand-text,#222)}
.sup-feedback-page{font-size:11px;color:var(--brand-muted,#666);margin:8px 0;word-break:break-all}
.sup-feedback-panel label,.sup-feedback-card label,.sup-test-case label{
 display:block;font-weight:600;margin-top:10px
}
.sup-feedback-panel textarea,.sup-support-notes,.sup-test-notes,
.sup-executed-by{
 box-sizing:border-box;width:100%;margin-top:5px;
 border:1px solid var(--brand-border,#ccc);
 border-radius:var(--brand-radius,6px);
 padding:8px;font:inherit;
 background:var(--brand-surface,#fff);
 color:var(--brand-text,#111)
}
.sup-feedback-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:10px}
.sup-feedback-actions button,.sup-row-actions button,.sup-toolbar button{
 border:1px solid var(--brand-border,#bbb);
 background:var(--brand-button-background);
 color:var(--brand-button-text);
 border-radius:var(--brand-radius,6px);
 padding:7px 10px;cursor:pointer
}
.sup-feedback-save,.sup-pass-button{
 background:var(--brand-button-background)!important;
 color:var(--brand-button-text)!important
}
.sup-fail-button{
 border-color:var(--brand-error,#a00)!important;
 color:var(--brand-error,#a00)!important
}
.sup-feedback-status,.sup-message{
 min-height:18px;margin-top:8px;font-size:12px;color:var(--brand-muted,#555)
}
.support-experience-page{}
.sup-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin:18px 0}
.sup-stat{
 background:var(--brand-surface,#fff);
 border:1px solid var(--brand-border,#ddd);
 border-radius:var(--brand-radius,9px);
 padding:14px;color:var(--brand-text,#111)
}
.sup-stat strong{display:block;font-size:24px}
.sup-stat span{color:var(--brand-muted,#666)}
.sup-toolbar{justify-content:space-between;margin:12px 0}
.sup-toolbar select{
 padding:7px;border:1px solid var(--brand-border,#bbb);
 border-radius:var(--brand-radius,6px)
}
.sup-list,.sup-test-list{display:grid;gap:12px}
.sup-feedback-card,.sup-test-case{
 background:var(--brand-button-background);
 color:var(--brand-button-text);
 border:1px solid var(--brand-border,#ddd);
 border-radius:var(--brand-radius,10px);
 padding:16px;box-shadow:0 2px 8px rgba(0,0,0,.04)
}
.sup-badge,.sup-result,.sup-priority{
 display:inline-block;padding:3px 7px;border-radius:999px;
 font-size:11px;font-weight:700;margin-right:6px
}
/* Semantic workflow/result colours intentionally remain distinct. */
.sup-open{background:#fff0c2}.sup-wip{background:#dcecff}
.sup-actioned{background:#e5e1ff}.sup-closed{background:#e7e7e7}
.sup-result-pass{background:#dff5e5;color:#145c2b}
.sup-result-fail{background:#ffe1e1;color:#8a1414}
.sup-result-none{background:#eee;color:#555}
.sup-priority{background:#f1f1f1;color:#333}
.sup-context{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:6px;margin:12px 0}
.sup-context div{
 background:color-mix(in srgb,var(--brand-surface,#fff) 84%,var(--brand-background,#f4f5f7));
 border:1px solid var(--brand-border,#ddd);
 border-radius:var(--brand-radius,6px);
 padding:8px
}
.sup-context dt{font-size:11px;color:var(--brand-muted,#666)}
.sup-context dd{margin:3px 0 0;word-break:break-word}
.sup-feedback-copy{font-size:15px;white-space:pre-wrap}
.sup-row-actions{flex-wrap:wrap;margin-top:10px}
.sup-row-actions button[disabled]{opacity:.45;cursor:default}
.sup-test-meta{flex-wrap:wrap;color:var(--brand-muted,#666);font-size:12px}
.sup-start-url,.sup-outcome,.sup-last-run{
 margin:12px 0;padding:10px;
 background:color-mix(in srgb,var(--brand-surface,#fff) 84%,var(--brand-background,#f4f5f7));
 border:1px solid var(--brand-border,#ddd);
 border-radius:var(--brand-radius,7px);
 word-break:break-word
}
.sup-steps{list-style:none;padding:0;margin:12px 0;display:grid;gap:8px}
.sup-steps li{
 display:grid;grid-template-columns:30px 1fr;gap:10px;
 border-top:1px solid var(--brand-border,#eee);padding-top:10px
}
.sup-step-number{
 width:26px;height:26px;border-radius:50%;
 background:var(--brand-primary,#111);
 color:var(--brand-button-text,#fff);
 display:flex;align-items:center;justify-content:center;font-size:12px
}
.sup-steps p{margin:0 0 5px}
.sup-expected{margin-top:5px;color:var(--brand-muted,#555)}
.sup-step-url{font-size:12px}
.sup-empty{
 padding:20px;background:var(--brand-surface,#fff);
 border:1px solid var(--brand-border,#ddd);
 border-radius:var(--brand-radius,8px);
 color:var(--brand-text,#111)
}
@media(max-width:600px){
 .support-experience-page{padding:10px}
 .sup-card-head{align-items:flex-start;flex-direction:column}
}