/* Bot page: trading bots editor as a table (pairs-table.js). Dark theme only, tokens from pages.css (.pg) and bot-page.css.
   Source of truth: resources/css/pairs-table.css - keep public/css/pairs-table.css in sync. */
.ptb { --ptb-tone: var(--bot-accent, #2fa89f); --ptb-border: var(--pg-border, #334155); --ptb-muted: var(--pg-muted, #94a3b8); }
.ptb-tone--edvi_m_1 { --ptb-tone: #d9a441; }
.ptb-tone--edvi_m_3 { --ptb-tone: #25c7a0; }
.ptb-tone--edvi_m_4 { --ptb-tone: #e0875a; }
.ptb-tone--edvi_m_2 { --ptb-tone: #57afff; }

.ptb-top { display: flex; flex-direction: column; gap: 12px; margin-bottom: 14px; }
.ptb-lead { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.ptb-name { flex: 1 1 220px; max-width: 340px; border-radius: 10px; font-size: 13px; font-weight: 600; min-height: 38px; }
.ptb-lead-tools { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.ptb-count { font-size: 12px; color: var(--ptb-muted); font-variant-numeric: tabular-nums; padding: 0 6px; }
.ptb-count b { color: var(--bot-accent, #2fa89f); font-size: 14px; }
.ptb-bulk { height: 30px; padding: 0 12px; border-radius: 8px; border: 1px solid color-mix(in srgb, var(--bot-accent, #2fa89f) 40%, transparent); background: color-mix(in srgb, var(--bot-accent, #2fa89f) 14%, transparent); color: var(--bot-accent, #2fa89f); font-size: 11.5px; font-weight: 650; cursor: pointer; white-space: nowrap; }
.ptb-bulk:hover { color: #fff; border-color: var(--bot-accent, #2fa89f); }
.ptb-bulk--clear { background: transparent; border-color: var(--ptb-border); color: var(--ptb-muted); }
.ptb-bulk--clear:hover { border-color: #ec6a87; background: rgba(236,106,135,.12); }
.ptb-cards { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(300px, 1fr); gap: 12px; align-items: stretch; }
.ptb-cards--single { grid-template-columns: 1fr; }
.ptb-card { margin: 0; padding: 14px 16px; border: 1px solid var(--ptb-border); border-radius: 14px; background: var(--pg-panel, rgba(128,145,178,.035)); }
.ptb-card-title { margin: 0 0 10px; font-size: 13px; font-weight: 650; color: var(--ptb-muted); }
.ptb-search-row { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.ptb-search-wrap { position: relative; flex: 1 1 auto; margin: 0; }
.ptb-search-wrap .bi { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); font-size: 12px; color: var(--ptb-muted); pointer-events: none; }
.ptb-search { width: 100%; padding-left: 32px; border-radius: 10px; font-size: 12px; min-height: 34px; }
.ptb-search-row .ptb-chip { height: 34px; border-radius: 10px; }
.ptb-filter { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.ptb-filter + .ptb-filter { margin-top: 8px; padding-top: 8px; border-top: 1px dashed color-mix(in srgb, var(--ptb-border) 70%, transparent); }
.ptb-filter-label { font-size: 11px; font-weight: 600; color: var(--ptb-muted); margin-right: 4px; min-width: 96px; }
.ptb-chip { --chip: var(--bot-accent, #2fa89f); height: 26px; padding: 0 10px; border-radius: 999px; border: 1px solid var(--ptb-border); background: transparent; color: var(--ptb-muted); font-size: 11px; font-weight: 600; line-height: 1; cursor: pointer; white-space: nowrap; transition: color .15s, border-color .15s, background-color .15s; }
.ptb-chip:hover { color: var(--pg-heading, #fff); border-color: color-mix(in srgb, var(--chip) 60%, var(--ptb-border)); }
.ptb-chip[aria-pressed="true"] { color: var(--pg-heading, #fff); border-color: var(--chip); background: color-mix(in srgb, var(--chip) 18%, transparent); }
.ptb-chip:focus-visible { outline: 2px solid var(--chip); outline-offset: 2px; }
.ptb-chip--group::before { content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--chip); margin-right: 6px; vertical-align: 1px; }
.ptb-chip--edvi_m_1 { --chip: #d9a441; } .ptb-chip--edvi_m_3 { --chip: #25c7a0; } .ptb-chip--edvi_m_4 { --chip: #e0875a; } .ptb-chip--edvi_m_2 { --chip: #57afff; }

.ptb-scroll { width: 100%; max-height: 560px; overflow: auto; border: 1px solid var(--ptb-border); border-radius: 14px; scrollbar-width: thin; }
.ptb-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 12px; }
.ptb-table thead th { position: sticky; top: 0; z-index: 2; padding: 9px 8px; background: var(--pg-surface, #111827); color: var(--ptb-muted); font-size: 10.5px; font-weight: 650; text-align: center; border-bottom: 1px solid var(--ptb-border); white-space: nowrap; }
.ptb-table thead th.ptb-pair-head { left: 0; z-index: 3; text-align: center; }
.ptb-pair-head .bi { font-size: 13px; color: color-mix(in srgb, var(--ptb-muted) 70%, transparent); }
/* the pair column is icon-only: the name lives in the tooltip (title + cell tip) and stays in the DOM for screen readers */
.ptb-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.ptb-table td, .ptb-table th.ptb-pair { padding: 5px; border-bottom: 1px solid color-mix(in srgb, var(--ptb-border) 55%, transparent); vertical-align: top; }
.ptb-table th.ptb-pair { vertical-align: middle; }
.ptb-table tbody tr:last-child > * { border-bottom: 0; }
.ptb-table td { min-width: 150px; }
.ptb-pair { position: sticky; left: 0; z-index: 1; background: var(--pg-surface, #111827); min-width: 52px; width: 1%; text-align: center; white-space: nowrap; font-weight: 650; color: var(--pg-heading, #fff); cursor: default; }
.ptb-pair > * { vertical-align: middle; }
.ptb-icon { position: relative; z-index: 1; width: 26px; height: 26px; border-radius: 50%; box-shadow: 0 0 0 2px color-mix(in srgb, var(--ptb-border) 60%, transparent); }
.ptb-grid { position: relative; }
/* links between the enabled bots (pairs-table.js drawLinks): behind the cells, in the colour of the source cell */
.ptb-links { position: absolute; left: 0; top: 0; z-index: 0; pointer-events: none; overflow: visible; }
.ptb-links.is-empty { display: none; }
.ptb-link { fill: none; stroke-width: 1.5; stroke-linecap: round; stroke-dasharray: 5 7; opacity: .55; animation: ptb-flow 1.6s linear infinite; }
.ptb-stub { position: absolute; pointer-events: none; overflow: visible; }
.ptb-spark { opacity: .9; filter: drop-shadow(0 0 4px currentColor); }
@keyframes ptb-flow { to { stroke-dashoffset: -12; } }
.ptb-table { position: relative; z-index: 1; }
.ptb-table td { background: transparent; }
.ptb-none { display: block; text-align: center; color: color-mix(in srgb, var(--ptb-muted) 45%, transparent); padding: 18px 0; }

.ptb-bot { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 7px 8px; border: 1px solid var(--ptb-border); border-radius: 10px; background: var(--pg-panel, rgba(128,145,178,.035)) var(--pg-surface, #111827); color: var(--ptb-muted); cursor: pointer; user-select: none; transition: border-color .15s, background-color .15s, color .15s; }
.ptb-bot + .ptb-bot { margin-top: 5px; }
.ptb--custom .ptb-bot { box-shadow: inset 3px 0 0 color-mix(in srgb, var(--ptb-tone) 55%, transparent); }
.ptb-bot:hover { border-color: color-mix(in srgb, var(--ptb-tone) 60%, var(--ptb-border)); color: var(--pg-heading, #fff); }
.ptb-bot:focus-visible { outline: 2px solid var(--ptb-tone); outline-offset: 1px; }
.ptb-bot.is-on { color: var(--pg-heading, #fff); border-color: color-mix(in srgb, var(--ptb-tone) 70%, var(--ptb-border)); background: color-mix(in srgb, var(--ptb-tone) 16%, var(--pg-surface, #111827)); box-shadow: 0 0 0 1px color-mix(in srgb, var(--ptb-tone) 25%, transparent), 0 6px 18px -10px var(--ptb-tone); }
.ptb--custom .ptb-bot.is-on { box-shadow: inset 3px 0 0 var(--ptb-tone), 0 6px 18px -10px var(--ptb-tone); }
.ptb-bot-head { display: flex; align-items: center; gap: 6px; min-width: 0; }
.ptb-dot { width: 8px; height: 8px; flex-shrink: 0; border-radius: 50%; border: 1px solid var(--ptb-muted); }
.ptb-bot.is-on .ptb-dot { border-color: var(--ptb-tone); background: var(--ptb-tone); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ptb-tone) 22%, transparent); }
.ptb-bot-tf { font-size: 12px; font-weight: 700; }
.ptb-bot-pair { font-size: 9.5px; color: var(--ptb-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.ptb-bot-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 3px; min-width: 0; }
.ptb-side { margin-left: auto; font-size: 9px; color: var(--ptb-muted); }
.ptb-total { font-size: 9.5px; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ptb-total.is-up { color: #2fa89f; } .ptb-total.is-down { color: #ec6a87; }
.ptb-bot:not(.is-on) .ptb-total { opacity: .7; }
.ptb-src { font-style: normal; font-size: 9.5px; font-weight: 700; line-height: 1; padding: 2px 6px; border-radius: 5px; border: 1px solid currentColor; background: color-mix(in srgb, currentColor 12%, transparent); white-space: nowrap; }
.ptb-src--none { color: var(--ptb-muted); font-weight: 600; }
.ptb-src--edvi_m_1 { color: #d9a441; } .ptb-src--edvi_m_3 { color: #25c7a0; } .ptb-src--edvi_m_4 { color: #e0875a; } .ptb-src--edvi_m_2 { color: #57afff; }

.ptb-risk { display: flex; align-items: center; gap: 3px; cursor: default; opacity: .6; }
.ptb-bot.is-on .ptb-risk, .ptb-risk:focus-within { opacity: 1; }
.ptb-risk-label { font-size: 10px; color: var(--ptb-muted); }
.ptb-step { width: 22px; height: 22px; flex-shrink: 0; padding: 0; border-radius: 6px; border: 1px solid var(--ptb-border); background: transparent; color: var(--ptb-muted); font-size: 13px; line-height: 1; cursor: pointer; display: grid; place-items: center; }
.ptb-step:hover { color: var(--pg-heading, #fff); border-color: var(--ptb-tone); }
.ptb-risk-input { width: 44px; height: 22px; padding: 0 2px; border-radius: 6px; border: 1px solid var(--ptb-border); background: var(--pg-surface, #111827); color: var(--ptb-tone); font-size: 11px; font-weight: 650; text-align: center; font-variant-numeric: tabular-nums; -moz-appearance: textfield; }
.ptb-risk-input::-webkit-outer-spin-button, .ptb-risk-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.ptb-risk-input:focus { outline: none; border-color: var(--ptb-tone); }
.ptb-risk.is-high .ptb-risk-input { color: var(--pg-danger, #ec6a87); }

.ptb-limit { margin: 8px 0 0; font-size: 10px; color: var(--ptb-muted); text-align: right; }
.ptb-limit.is-bump { color: var(--pg-danger, #ec6a87); animation: ptb-shake .5s; }
@keyframes ptb-shake { 25% { transform: translateX(-3px); } 75% { transform: translateX(3px); } }

.ptb-tip { position: fixed; z-index: 2000; max-width: 260px; padding: 8px 10px; border-radius: 10px; border: 1px solid rgba(148,163,184,.25); background: rgba(15,23,42,.92); backdrop-filter: blur(6px); color: #e2e8f0; font-size: 11px; line-height: 1.45; pointer-events: none; box-shadow: 0 10px 30px rgba(0,0,0,.35); }
.ptb-tip strong, .ptb-tip span { display: block; }
.ptb-tip strong { color: #fff; font-weight: 650; }
.ptb-tip .is-on { color: #2fa89f; font-weight: 600; }
.ptb-tip .is-off { color: #94a3b8; font-weight: 600; }
.ptb-tip span:last-child { color: #94a3b8; font-size: 10px; margin-top: 2px; }

@media (max-width: 767px) {
    .ptb-name { max-width: none; }
    .ptb-table td { min-width: 132px; }
    .ptb-pair { min-width: 44px; }
    .ptb-icon { width: 22px; height: 22px; }
    .ptb-scroll { max-height: 70vh; }
}
@media (prefers-reduced-motion: reduce) { .ptb-limit.is-bump { animation: none; } .ptb-bot, .ptb-chip { transition: none; } .ptb-link { animation: none; } }

/* the bulk module sits in the right card: drop its own frame */
.ptb-card--bulk.rbk { margin: 0; border-color: color-mix(in srgb, var(--bot-accent, #2fa89f) 35%, var(--ptb-border)); }
@media (max-width: 991px) { .ptb-cards { grid-template-columns: 1fr; } }
@media (max-width: 767px) { .ptb-lead-tools { margin-left: 0; width: 100%; } .ptb-lead-tools .ptb-count { margin-right: auto; padding: 0; } .ptb-filter-label { min-width: 0; flex-basis: 100%; } }
/* "Enabled only" turns into "Select" while a search query is typed: highlighted, enables every bot found */
.ptb-chip--only.is-select { color: #fff; border-color: var(--chip); background: color-mix(in srgb, var(--chip) 85%, #0b1222); box-shadow: 0 0 0 3px color-mix(in srgb, var(--chip) 22%, transparent); }
.ptb-chip--only.is-select:hover { background: var(--chip); }
/* selection card header: title left, counter + "choose all / clear" right */
.ptb-card-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
.ptb-card-head .ptb-card-title { margin: 0; }
.ptb-card-head .ptb-lead-tools { margin-left: auto; gap: 6px; }
.ptb-card-head .ptb-bulk { height: 28px; padding: 0 10px; }
@media (max-width: 767px) { .ptb-card-head .ptb-lead-tools { margin-left: auto; width: auto; } }
.ptb-cards > .ptb-card, .ptb-search-wrap { min-width: 0; }
/* drag-to-scroll with the mouse (desktop) */
@media (hover: hover) and (pointer: fine) {
    .ptb-scroll--grab { cursor: grab; }
    .ptb-scroll--grab.is-dragging { cursor: grabbing; user-select: none; }
    .ptb-scroll--grab.is-dragging .ptb-bot { cursor: grabbing; }
    .ptb-scroll--grab input, .ptb-scroll--grab button { cursor: auto; }
    .ptb-scroll--grab button { cursor: pointer; }
}