/* static/css/py_panel.css */
.py-wrap { display:grid; grid-template-columns: 1fr 1fr; gap: 1rem; align-items: start; }
@media (max-width: 980px){ .py-wrap { grid-template-columns: 1fr; } }

.py-panel { border: 1px solid #ccc; border-radius: 10px; padding: 12px; background: var(--bg); color: var(--text); }
.py-toolbar { display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; margin-bottom:.5rem; }
.py-btn { padding:.45rem .9rem; border-radius:7px; border:1px solid #bbb; background:#eee; cursor:pointer; }
.py-btn:disabled { opacity:.6; cursor:not-allowed; }

/* keep the general look for all outputs */
.py-out{
  border: 1px dashed #aaa;
  border-radius: 8px;
  padding: 8px;
  overflow: auto;
  background: rgba(0,0,0,0.03);
}

/* ONLY the old 2-column py-wrap pages get a fixed viewport height */
.py-wrap .py-out{ height: 58vh; }

/* Same idea for CodeMirror */
.CodeMirror{
  border: 1px solid #ccc;
  border-radius: 8px;
}
.py-wrap .CodeMirror{ min-height: 50vh; }

.stdout { white-space: pre-wrap; }
.stderr { white-space: pre-wrap; color: #b00020; }
.system { font-style: italic; color: gray; }

/* args input should follow theme */
.argsBox{
  background: var(--panel-bg);
  color: var(--panel-text);
  border: 1px solid var(--panel-border, #d0d7de);
}
.argsBox::placeholder{
  color: var(--muted-text, rgba(127,127,127,.95));
}

/* Allow output panes to fill available space */
.py-panel.out-panel{
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
}

.py-panel.out-panel .py-out{
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  height: auto;
}