/* Diagnostic workspace: shared visual language with Projects. */
.energisa-step-dialog.diagnostic-layout {
 padding:0!important; background:#f4f7fa; color:#193047; font:14px "Open Sans",Arial,sans-serif;
 width:100vw; height:100dvh; max-width:none; max-height:none; margin:0; border-radius:0;
}
.diagnostic-layout *, .diagnostic-layout *::before { box-sizing:border-box; }
.diagnostic-layout > header {
 display:flex; align-items:center; justify-content:space-between; gap:16px;
 padding:14px 22px; min-height:78px; background:#0095b5; color:white;
}
.diag-brand { display:flex; align-items:center; gap:22px; min-width:0; }
.diag-brand img { width:130px; height:40px; object-fit:contain; }
.diagnostic-layout .diag-brand h2 { color:white; font-size:22px; margin:0; line-height:1.3; }
.diag-brand p { margin:3px 0 0; font-size:12px; color:white; }
.diagnostic-layout > header > button {
 background:transparent; color:white; border:1px solid #c4edf6; min-width:82px;
}
.diagnostic-layout button, .diagnostic-layout select {
 min-height:38px; border:1px solid #becedb; padding:8px 13px;
 border-radius:6px; background:white; color:#193047; font:600 13px "Open Sans",Arial,sans-serif;
 cursor:pointer; display:inline-flex; align-items:center; justify-content:center; gap:8px;
}
.diagnostic-layout button:focus-visible, .diagnostic-layout summary:focus-visible {
 outline:3px solid #f47719; outline-offset:2px;
}
.diagnostic-layout [hidden] { display:none!important; }
.diagnostic-layout .diagnostic-mode-tabs {
 display:flex; align-items:stretch; gap:20px; padding:0 20px; margin:0;
 border:0; border-bottom:1px solid #d3dfe8; background:white;
}
.diagnostic-layout .diagnostic-mode-tabs button {
 border:0; border-bottom:3px solid transparent; border-radius:0;
 background:white; padding:12px 16px; min-height:46px; color:#53657b;
}
.diagnostic-layout .diagnostic-mode-tabs button[aria-current] { color:#e97013; border-bottom-color:#f47719; }
.diag-context { padding:10px 20px 0; }
.diag-context-line { display:flex; align-items:center; flex-wrap:wrap; gap:8px 18px; }
.diag-context-line p { margin:0; font-size:12px; color:#60758b; }
.diag-session-badge { font-size:11px; padding:5px 9px; border-radius:20px; background:#edf0f4; color:#617080; }
.diag-session-badge[data-state=active] { background:#e0f2e4; color:#1c753c; }
.diagnostic-layout .diag-context > p { font-size:12px; margin:6px 0; line-height:1.5; }
.diagnostic-layout .diag-context > p:empty { display:none; }
.diagnostic-layout .diagnostic-general-notice { color:#52667b; }
.diagnostic-layout .energisa-step-controls {
 display:flex; flex-wrap:wrap; gap:8px; padding:12px 16px; margin:8px 18px 12px;
 border:1px solid #dbe4ed; border-radius:8px; background:white;
}
.diagnostic-layout .diag-primary { color:white; background:#f47719; border-color:#f47719; }
.diagnostic-layout .diag-stop { color:#c52a39; border-color:#edb6be; }
.diag-button-icon { font-size:16px; line-height:1; }
.diag-more { margin-left:auto; position:relative; }
.diag-more > summary {
 cursor:pointer; padding:10px 14px; border:1px solid #becedb; border-radius:6px; font-size:13px;
}
.diag-more[open] { flex:1 0 100%; margin:0; }
.diag-more[open] > summary { margin-bottom:8px; }
.diag-more > button { margin:0 6px 4px 0; }
.diag-layout-grid {
 display:grid; grid-template-columns:minmax(280px,.8fr) minmax(0,1.2fr);
 align-items:start; gap:16px; margin:0 18px 14px;
}
.diag-steps-card, .diagnostic-layout .energisa-step-preview, .diag-query-card {
 min-width:0; border:1px solid #d8e2ec; border-radius:9px; background:white;
 box-shadow:0 2px 5px #173a5410;
}
.diag-card-heading {
 display:flex; align-items:center; justify-content:space-between; gap:12px;
 padding:14px 16px; border-bottom:1px solid #e1e7ef;
}
.diag-card-heading h3, .diag-query-card > h3 { margin:0; font-size:16px; }
.diag-card-heading > span { color:#60758b; font-size:12px; white-space:nowrap; }
.diagnostic-layout .diag-steps-card > ol {
 display:block; margin:0; padding:6px 12px; background:white; max-height:62dvh; overflow:auto;
}
.diagnostic-layout .diag-steps-card > ol > li {
 display:grid; grid-template-columns:30px minmax(0,1fr) auto; gap:3px 10px;
 padding:12px 0; border-bottom:1px solid #e8edf3; align-items:center; background:white;
}
.diagnostic-layout .diag-steps-card > ol > li:last-child { border:0; }
.diagnostic-layout .diag-steps-card .energisa-step-action {
 grid-column:2; min-width:0; padding:0; min-height:28px; text-decoration:none;
 justify-content:flex-start; font-size:13px; color:#193047; font-weight:600; border:0; background:none;
}
.diagnostic-layout .diag-steps-card li > span:not(.diag-step-marker) { grid-column:3; font-size:11px; text-align:right; }
.diagnostic-layout .diag-steps-card li > small { grid-column:2 / -1; color:#6e8095; font-size:11px; }
.diagnostic-layout .diag-step-marker {
 grid-column:1; grid-row:1 / span 2; display:flex; justify-content:center; align-items:center;
 width:28px; height:28px; border-radius:50%; font-size:12px; background:#e6eaf0; color:#64768a;
}
.diagnostic-layout li[data-status=DONE] > .diag-step-marker { background:#25994c; color:white; }
.diagnostic-layout li[data-status=CLAIMED] > .diag-step-marker,
.diagnostic-layout li[data-status=QUEUED] > .diag-step-marker { background:#0095b5; color:white; }
.diagnostic-layout li[data-status=FAILED] > .diag-step-marker { background:#ce4055; color:white; }
.diagnostic-layout .energisa-step-preview { margin:0; padding:14px 16px; border-top:1px solid #d8e2ec; }
.diagnostic-layout .diagnostic-preview-tools { display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.diagnostic-layout .diagnostic-preview-tools h3 { font-size:16px; margin:0 auto 0 0; }
.diagnostic-layout .diagnostic-preview-tools button { font-size:11px; padding:7px 9px; }
.diagnostic-layout .energisa-step-preview-frame { max-height:58dvh; border-radius:7px; background:#e8f2f8; }
.diagnostic-layout .energisa-step-preview img { max-width:100%; object-fit:contain; }
.diag-preview-placeholder {
 display:grid; place-items:center; min-height:300px; margin-top:14px; padding:30px;
 border-radius:8px; color:#50799d; background:linear-gradient(130deg,#e9f5ff,#d8ebf9);
 font-size:16px; text-align:center;
}
.energisa-step-preview[data-collapsed=false] .diag-preview-placeholder { display:none!important; }
.diagnostic-layout .energisa-remote-toolbar { margin-top:8px; }
.diagnostic-layout .energisa-remote-toolbar span { color:#60758b; line-height:1.4; }
.diag-query-card { margin:0 18px 12px; padding:14px 16px; }
.diag-query-card > h3 { margin-bottom:10px; }
.diag-query-card section > div:first-child { display:flex; flex-wrap:wrap; gap:8px; }
.diag-query-card input { flex:1; min-width:150px; min-height:40px; padding:9px 12px; border:1px solid #becedb; border-radius:6px; font:inherit; }
.diag-query-card p:empty { display:none; }
.diag-layout-footer { display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:6px 20px 16px; }
.diagnostic-layout .diag-layout-footer > small { flex:1 0 100%; font-size:11px; color:#60758b; }
.diagnostic-layout .diag-layout-footer > p { font-size:12px; color:#60758b; }
.diagnostic-layout .diagnostic-logout { border:0; background:transparent; color:#007f9e; }
.diagnostic-layout.send-workspace-mode .diag-layout-grid { grid-template-columns:minmax(0,1fr); }
.diagnostic-layout.send-workspace-mode .diag-layout-footer { display:none; }
.diagnostic-layout .submission-workspace { margin:12px 18px; }
.diagnostic-layout.remote-window .energisa-step-preview { position:fixed; inset:0; margin:0; border-radius:0; z-index:2; }
@media(max-width:750px) {
 .diagnostic-layout > header { padding:12px; min-height:70px; gap:8px; }
 .diag-brand { gap:10px; }
 .diag-brand img { width:84px; height:32px; }
 .diagnostic-layout .diag-brand h2 { font-size:17px; }
 .diag-brand p { display:none; }
 .diagnostic-layout > header > button { min-width:54px; padding:7px; }
 .diagnostic-layout .diagnostic-mode-tabs { padding:0 8px; gap:6px; }
 .diagnostic-layout .diagnostic-mode-tabs button { flex:1; font-size:12px; padding:10px 6px; }
 .diag-context { padding:10px 10px 0; }
 .diag-context-line { gap:7px; }
 .diagnostic-layout .energisa-step-controls { margin:8px 10px 10px; padding:10px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
 .diagnostic-layout .energisa-step-controls > button { min-width:0; min-height:44px; padding:7px; font-size:12px; }
 .diag-more { grid-column:1 / -1; margin:0; }
 .diag-more > summary { min-height:40px; }
 .diag-layout-grid { grid-template-columns:minmax(0,1fr); margin:0 10px 10px; gap:10px; }
 .diagnostic-layout .diag-steps-card > ol { max-height:360px; }
 .diagnostic-layout .diag-steps-card > ol > li { grid-template-columns:28px minmax(0,1fr); }
 .diagnostic-layout .diag-steps-card li > span:not(.diag-step-marker) { grid-column:2; text-align:left; }
 .diagnostic-layout .diag-steps-card li > small { grid-column:2; }
 .diag-preview-placeholder { min-height:190px; font-size:14px; padding:20px; }
 .diag-query-card { margin:0 10px 10px; padding:12px; }
 .diag-layout-footer { padding:6px 12px 16px; }
}
