/* Bot and Risk page. Mobile first; the field grid widens at 640px. Shared
   pieces (help popover, profile editor, risk colours) come from profile.css. */








.panel-bot .sub.small, .panel-bot .small { font-size: 12px; }
.panel-bot .muted { color: var(--muted); }
.panel-bot .mono { font-variant-numeric: tabular-nums; }
.panel-bot .pos { color: var(--ok); }
.panel-bot .neg { color: var(--bad); }

.panel-bot .pill { display: inline-flex; align-items: center; gap: 6px; padding: 3px 9px; border-radius: 999px; font-size: 11px; font-weight: 600; letter-spacing: 0.02em; white-space: nowrap; }
.panel-bot .pill::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; flex: none; }
.panel-bot .pill.plain::before { display: none; }
.panel-bot .pill-paper { background: var(--warn-bg); color: var(--warn); }
.panel-bot .pill-ok { background: var(--ok-bg); color: var(--ok); }
.panel-bot .pill-off { background: var(--muted-bg); color: var(--muted); }
.panel-bot .pill-warn { background: var(--warn-bg); color: var(--warn); }
.panel-bot .pill-bad { background: var(--bad-bg); color: var(--bad); }

.panel-bot .state-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.panel-bot .bot-status { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--border); font-size: 13px; }
.panel-bot .bot-status dl { grid-template-columns: auto 1fr; gap: 4px 12px; }
.panel-bot .bot-status dd { white-space: normal; }
.panel-bot .bot-status .markets { margin-top: 8px; display: flex; flex-direction: column; gap: 6px; }
.panel-bot .bot-status .market { border: 1px solid var(--border); border-radius: 6px; padding: 6px 10px; display: grid; grid-template-columns: 1fr; gap: 2px 12px; }
@media (min-width: 640px) { .panel-bot .bot-status .market { grid-template-columns: auto 1fr; } }
.panel-bot .bot-status .market .sym { font-weight: 700; }
.panel-bot .bot-status .decision-long { color: var(--ok); font-weight: 700; }
.panel-bot .bot-status .decision-short { color: var(--bad); font-weight: 700; }
.panel-bot .bot-status .decision-no_trade { color: var(--muted); font-weight: 700; }
.panel-bot .card h2 { margin-bottom: 4px; }
.panel-bot .card .row h2 { margin: 0; }
.panel-bot .grid { display: grid; grid-template-columns: 1fr; gap: 0 16px; }
@media (min-width: 640px) { .panel-bot .grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .panel-bot .grid { grid-template-columns: 1fr 1fr 1fr 1fr; } }
.panel-bot .field label { margin-top: 12px; }
.panel-bot .field label .hint { color: var(--muted); font-size: 12px; }
.panel-bot .field input.invalid, .panel-bot .field select.invalid { border-color: var(--bad); outline: 1px solid var(--bad); }
.panel-bot .effective { font-size: 12px; margin-top: 4px; min-height: 16px; color: var(--muted); }
.panel-bot .effective:empty { display: none; }
.panel-bot .effective .capped { color: var(--warn); font-weight: 600; }
.panel-bot .effective .same { color: var(--muted); }
.panel-bot details > summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; color: var(--muted); font-weight: 600; margin-top: 8px; }
.panel-bot .account-limits { margin-top: 16px; padding: 10px 12px; border: 1px dashed var(--border); border-radius: 6px; font-size: 13px; }
.panel-bot .account-limits .k { font-size: 10px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--muted); margin-bottom: 4px; }
.panel-bot .account-limits dl { margin-top: 4px; }

.panel-bot .save-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; min-height: 22px; margin-top: 12px; }
.panel-bot .actions button { flex: 1 1 180px; }
.panel-bot #safety-confirm { margin-top: 10px; }
.panel-bot .errors { margin: 8px 0 0; padding-left: 18px; color: var(--bad); font-size: 13px; }
.panel-bot .errors:empty { display: none; }
.panel-bot .message:empty { display: none; }
.panel-bot .message.ok { color: var(--ok); font-weight: 600; }
.panel-bot .message.bad { color: var(--bad); font-weight: 600; }

/* ----- profile panel ----- */
.panel-bot #profile-panel .row { align-items: center; margin-bottom: 8px; }
.panel-bot #profile-panel .row button { min-height: 44px; }

.panel-bot .active-head { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
.panel-bot .active-values { display: grid; grid-template-columns: auto 1fr; gap: 4px 14px; font-size: 13px; }
.panel-bot .active-values dd { white-space: normal; }
.panel-bot .active-values dd.capped { color: var(--warn); font-weight: 600; }
.panel-bot #active-profile .actions button { flex: 0 1 200px; }
.panel .selected-pill { margin-left: 8px; font-size: 10px; vertical-align: middle; }
.panel .pill-accent { background: var(--accent-bg); color: var(--accent); }