/* Terminal extension layer - visual locked from V1.2.0. Keep empty unless needed. */

/* v2.2.2 - Linha de comando interativa */
.terminal-input-row{
  display:flex;
  align-items:center;
  gap:10px;
  margin:10px 0 12px 0;
}
.terminal-dollar{
  background:#050505;
  color:#22c55e;
  border:1px solid #222;
  border-radius:10px;
  padding:13px 14px;
  font-family:monospace;
  font-weight:900;
}
.terminal-input{
  flex:1;
  background:#050505;
  color:#f8fafc;
  border:1px solid #222;
  border-radius:10px;
  padding:14px 16px;
  font-family:monospace;
  font-size:15px;
  outline:none;
}
.terminal-input:focus{
  border-color:#ee0000;
  box-shadow:0 0 0 3px rgba(238,0,0,.15);
}
.terminal-send{
  cursor:pointer;
  transition:.15s ease;
}
.terminal-send:hover{
  outline:2px solid rgba(238,0,0,.35);
}
.sim-notice{
  font-size:12px;
  color:#b45309;
  background:#fffbeb;
  border:1px solid #fde68a;
  border-radius:6px;
  padding:8px 12px;
  margin:0 0 10px;
  line-height:1.5;
}

/* Console web mockup */
.browser-mock{margin-top:16px;border-radius:12px;overflow:hidden;border:1px solid #2a2a32;box-shadow:0 8px 24px rgba(0,0,0,.35);background:#0d0d12;transition:opacity .2s ease, transform .2s ease}
.browser-mock.hidden{display:none}
.browser-mock-bar{display:flex;align-items:center;gap:10px;padding:10px 14px;background:#1a1a22;border-bottom:1px solid #2a2a32}
.browser-mock-dots{display:flex;gap:6px}
.browser-mock-dots span{width:11px;height:11px;border-radius:50%;display:inline-block}
.browser-mock-dots span:nth-child(1){background:#ff5f57}
.browser-mock-dots span:nth-child(2){background:#febc2e}
.browser-mock-dots span:nth-child(3){background:#28c840}
.browser-mock-url{flex:1;background:#0d0d12;border:1px solid #2a2a32;border-radius:6px;padding:5px 12px;font-family:monospace;font-size:12px;color:#9aa0a6;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.browser-mock-url b{color:#4ade80}
.browser-mock-close{background:none;border:none;color:#9aa0a6;cursor:pointer;font-size:16px;padding:0 4px}
.browser-mock-close:hover{color:#fff}
.browser-mock-body{background:#f4f4f6;min-height:340px;position:relative}
.browser-mock-body.loading > *{visibility:hidden}
.browser-mock-body.loading:after{content:"Carregando...";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#666;font-size:13px;font-family:monospace}
.browser-mock-body{position:relative}
.oc-console{display:flex;min-height:340px;font-family:'Red Hat Text',Arial,sans-serif}
.oc-console-side{width:150px;background:#151515;color:#d2d2d2;padding:14px 0;flex-shrink:0}
.oc-console-side .oc-item{padding:8px 16px;font-size:12.5px;display:flex;align-items:center;gap:8px;cursor:default}
.oc-console-side .oc-item.active{background:#ee0000;color:#fff;font-weight:700}
.oc-console-main{flex:1;display:flex;flex-direction:column;min-width:0}
.oc-console-top{background:#fff;border-bottom:1px solid #d8dde3;padding:10px 16px;display:flex;justify-content:space-between;align-items:center}
.oc-console-top .proj{font-size:13px;font-weight:700;color:#111}
.oc-console-top .proj span{color:#ee0000}
.oc-console-user{font-size:12px;background:#eef1f4;border-radius:14px;padding:4px 12px;font-weight:700;color:#333;display:flex;align-items:center;gap:6px}
.oc-console-user .dot{width:8px;height:8px;border-radius:50%;background:#22c55e}
.oc-console-body{padding:18px;flex:1;overflow:auto}
.oc-console-body h4{margin:0 0 12px;font-size:15px;color:#111}
.oc-res-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}
.oc-res-card{background:#fff;border:1px solid #d8dde3;border-radius:8px;padding:12px}
.oc-res-card .k{font-size:11px;text-transform:uppercase;color:#888;letter-spacing:.4px}
.oc-res-card .v{font-size:20px;font-weight:800;color:#111;margin:4px 0}
.oc-res-card .s{font-size:11px;color:#16a34a;font-weight:700}
.oc-toast{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);background:#111;color:#fff;font-size:12px;padding:8px 16px;border-radius:20px;opacity:0;transition:opacity .25s ease;pointer-events:none}
.oc-toast.show{opacity:1}

/* Console login screen */
.oc-login-screen{min-height:340px;display:flex;align-items:center;justify-content:center;background:#f4f4f6;background-image:radial-gradient(circle at 20% 20%, #eceef1 0%, #f4f4f6 60%)}
.oc-login-screen.hidden{display:none}
.oc-login-card{width:280px;background:#fff;border:1px solid #d8dde3;border-radius:10px;padding:24px 26px;box-shadow:0 4px 16px rgba(0,0,0,.08);text-align:center}
.oc-login-logo{width:46px;height:46px;border-radius:10px;background:#ee0000;color:#fff;font-weight:900;font-size:16px;display:flex;align-items:center;justify-content:center;margin:0 auto 12px}
.oc-login-card h4{margin:0 0 16px;font-size:15px;color:#111}
.oc-login-idp{background:#eef1f4;border-radius:6px;padding:6px;font-size:12px;font-weight:700;color:#444;margin-bottom:16px}
.oc-login-card label{display:block;text-align:left;font-size:11px;color:#888;margin:10px 0 4px;text-transform:uppercase;letter-spacing:.3px}
.oc-login-input{background:#f4f4f6;border:1px solid #d8dde3;border-radius:6px;padding:8px 10px;font-size:13px;color:#333;text-align:left;font-family:monospace}
.oc-login-btn{width:100%;margin-top:18px;background:#ee0000;color:#fff;border:none;border-radius:6px;padding:10px;font-weight:700;font-size:13px;cursor:pointer}
.oc-login-btn:hover{background:#c81e1e}
.oc-login-hint{font-size:11px;color:#999;margin:14px 0 0;line-height:1.4}

/* Flask app preview */
.app-preview-screen{min-height:300px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px;background:#fff}
.app-preview-badge{background:#dcfce7;color:#15803d;font-weight:800;font-size:11px;padding:4px 12px;border-radius:20px;margin-bottom:18px}
.app-preview-screen h2{margin:0 0 10px;font-size:26px;color:#111}
.app-preview-screen p{color:#555;max-width:380px;line-height:1.5;margin:0 0 16px}
.app-preview-meta{font-family:monospace;font-size:11px;color:#999;background:#f4f4f6;padding:8px 14px;border-radius:6px}

/* Tekton pipeline visualization */
.pipeline-viz{margin-top:16px;border:1px solid #d8dde3;border-radius:12px;padding:20px;background:#fff;box-shadow:0 4px 16px rgba(0,0,0,.06)}
.pipeline-viz.hidden{display:none}
.pipeline-viz-head{font-size:13px;color:#666;margin-bottom:16px}
.pipeline-viz-head b{color:#111}
.pipeline-viz-row{display:flex;align-items:center;gap:8px;overflow-x:auto;padding-bottom:6px}
.pipeline-task{flex:1;min-width:120px;border:2px solid #d8dde3;border-radius:8px;padding:12px 10px;text-align:center;background:#fafafa;transition:.25s ease}
.pipeline-task .task-icon{font-size:20px;margin-bottom:6px;color:#aaa}
.pipeline-task .task-name{font-size:11px;font-weight:700;color:#444;word-break:break-word}
.pipeline-task.running{border-color:#3b82f6;background:#eff6ff}
.pipeline-task.running .task-icon{color:#3b82f6;animation:oea-spin 1s linear infinite}
.pipeline-task.success{border-color:#22c55e;background:#f0fdf4}
.pipeline-task.success .task-icon{color:#22c55e}
.pipeline-arrow{color:#ccc;font-size:16px;flex:0 0 auto}
.pipeline-viz-status{margin-top:14px;font-size:12.5px;font-weight:700;color:#666;text-align:center}
.pipeline-viz-status.done{color:#16a34a}
@keyframes oea-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}

/* Final topology visualization */
.topology-viz{margin-top:16px;border:1px solid #d8dde3;border-radius:12px;padding:20px;background:#fff;box-shadow:0 4px 16px rgba(0,0,0,.06)}
.topology-viz.hidden{display:none}
.topology-viz-head{font-size:13px;color:#666;margin-bottom:16px}
.topology-viz-head b{color:#111}
.topology-viz-row{display:flex;align-items:center;gap:6px;overflow-x:auto;padding-bottom:6px}
.topo-node{flex:1;min-width:88px;border:2px solid #d8dde3;border-radius:10px;padding:12px 6px;text-align:center;background:#fafafa;transition:.25s ease}
.topo-node .topo-icon{font-size:22px;margin-bottom:6px;color:#aaa}
.topo-node .topo-label{font-size:10.5px;font-weight:800;color:#444}
.topo-node.checked{border-color:#22c55e;background:#f0fdf4}
.topo-node.checked .topo-icon{color:#22c55e}
.topo-arrow{color:#ccc;font-size:14px;flex:0 0 auto}
.topology-viz-status{margin-top:14px;font-size:12.5px;font-weight:700;color:#666;text-align:center}
.topology-viz-status.done{color:#16a34a}