/* ================================================================ konsola SQL (sqlconsole.js)
   Pełna wysokość widoku: obiekty bazy | edytor + wyniki; rentgen ERP XL nad wynikami (na szerokim ekranie obok).
   Edytor: pole tekstowe z przezroczystym tekstem nad warstwą z kolorowaniem (ta sama czcionka, ta sama wysokość wiersza). */
:root {
  --ed-bg: #fbfaf7;
  --ed-gutter: #f3f1ec;
  --ed-text: #1d1f24;
  --ed-caret: #17181c;
  --sx-k: #3f6212;
  --sx-f: #7c3aed;
  --sx-s: #b45309;
  --sx-c: #8b8a83;
  --sx-n: #0e7490;
  --sx-t: #0f766e;
  --sx-v: #9d174d;
  --sx-q: #374151;
}
@media (prefers-color-scheme: dark) {
  :root {
    --ed-bg: #121316;
    --ed-gutter: #16171b;
    --ed-text: #e6e4dd;
    --ed-caret: #c6f03a;
    --sx-k: #c6f03a;
    --sx-f: #c4b5fd;
    --sx-s: #fdba74;
    --sx-c: #6f7178;
    --sx-n: #67e8f9;
    --sx-t: #5eead4;
    --sx-v: #f9a8d4;
    --sx-q: #d1d5db;
  }
}

body.in-sql .view { display: flex; overflow: hidden; padding: 12px 16px 14px; }
body.in-sql .view > * { max-width: none; }
.sqlc { position: relative; flex: 1; min-width: 0; min-height: 0; display: flex; flex-direction: column; gap: 10px; }
.sqlc-wait { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 48px 16px; text-align: center; }
.sqlc-wait .spinner { border-color: var(--border); border-top-color: var(--focus); }
.sqlc .spacer { flex: 1; }

/* ---------------------------------------------------------------- nagłówek */
.sqlc-head { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.sqlc-icon { flex: none; width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; background: var(--side-bg); color: var(--signal); }
.sqlc-icon .ic { margin: 0; width: 22px; height: 22px; }
.sqlc-icon.small { width: 32px; height: 32px; border-radius: 9px; background: var(--side-2); }
.sqlc-icon.small .ic { width: 18px; height: 18px; }
.sqlc.production .sqlc-head .sqlc-icon { background: var(--danger); color: #fff; }
.sqlc-titles { flex: 1 1 280px; min-width: 0; }
.sqlc-titles h2 { margin: 0; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font: 700 22px/1.15 var(--font-display); letter-spacing: -.01em; }
.sqlc-sub { margin-top: 3px; color: var(--muted); font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sqlc-badges { display: inline-flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.sqlc-prod, .sqlc-ro { font: 700 10.5px/1 var(--font-mono); letter-spacing: .08em; padding: 5px 8px; border-radius: 6px; }
.sqlc-prod { color: #fff; background: var(--danger); box-shadow: 0 0 0 3px color-mix(in srgb, var(--danger) 22%, transparent); }
.sqlc-ro { color: var(--signal-ink); background: var(--signal); }
.sqlc-chip { display: inline-flex; align-items: center; gap: 5px; padding: 4px 9px; border-radius: 99px; border: 1px solid var(--border); background: var(--surface-2);
  color: var(--muted); font: 500 12px/1.2 var(--font); white-space: nowrap; }
.sqlc-chip .ic { margin: 0; width: 13px; height: 13px; }
.sqlc-chip.warn { color: var(--warn); border-color: color-mix(in srgb, var(--warn) 40%, transparent); background: color-mix(in srgb, var(--warn) 10%, transparent); }
.sqlc-actions { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.sqlc-actions .sqlc-db { width: auto; min-width: 140px; max-width: 240px; padding: 7px 10px; }
.sqlc-actions button.active { background: var(--signal); border-color: var(--signal); color: var(--signal-ink); }
.sqlc-notices { display: flex; flex-direction: column; gap: 6px; }
.sqlc-notices:empty { display: none; }
.sqlc-notice { display: flex; align-items: flex-start; gap: 10px; padding: 7px 10px 7px 12px; border-radius: 10px; font-size: 12.5px; border: 1px solid var(--border); background: var(--surface); }
.sqlc-notice > span { flex: 1; }
.sqlc-notice.warn { border-color: color-mix(in srgb, var(--warn) 45%, transparent); background: color-mix(in srgb, var(--warn) 9%, var(--surface)); }
.sqlc-notice.info { border-color: color-mix(in srgb, var(--focus) 45%, transparent); background: color-mix(in srgb, var(--signal) 10%, var(--surface)); }

/* ---------------------------------------------------------------- układ */
.sqlc-body { position: relative; flex: 1; min-height: 0; display: grid; grid-template-columns: 290px minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); gap: 10px; }
.sqlc-side { grid-column: 1; grid-row: 1; }
.sqlc-work { grid-column: 2; grid-row: 1; }
.sqlc-xray { grid-column: 2; grid-row: 1; z-index: 4; }
.sqlc-side-backdrop { display: none; }
.sqlc-phone { display: none; }
@media (min-width: 1640px) {
  .sqlc.xray-open .sqlc-body { grid-template-columns: 260px minmax(0, 1fr) minmax(600px, 46%); }
  .sqlc.xray-open .sqlc-xray { grid-column: 3; box-shadow: none; }
}

/* ---------------------------------------------------------------- obiekty bazy */
.sqlc-side { display: flex; flex-direction: column; min-height: 0; overflow: hidden; background: var(--surface); border: 1px solid var(--border); border-radius: 14px; }
.sqlc-side-head { display: flex; gap: 6px; padding: 8px; border-bottom: 1px solid var(--border); }
.sqlc-side-head .sqlc-search { padding: 6px 10px; font-size: 13px; }
.sqlc-side-head .icon-btn { flex: none; width: 34px; padding: 0; }
.sqlc-objs { flex: 1; min-height: 0; overflow: auto; padding: 4px 4px 12px; scrollbar-width: thin; }
.sqlc-pad { padding: 10px; margin: 0; }
.sqlc-group { display: flex; align-items: center; gap: 6px; width: 100%; justify-content: flex-start; padding: 7px 8px; margin-top: 2px; border: none; background: none;
  border-radius: 8px; font-weight: 650; font-size: 13px; }
.sqlc-group:hover { background: var(--surface-2); }
.sqlc-caret { width: 12px; color: var(--muted); }
.sqlc-count { margin-left: auto; padding: 3px 7px; border-radius: 99px; background: var(--surface-2); color: var(--muted); font: 500 11px/1 var(--font-mono); white-space: nowrap; }
.sqlc-count.err { color: var(--danger); background: color-mix(in srgb, var(--danger) 12%, transparent); }
.sqlc-obj { display: flex; flex-wrap: wrap; align-items: flex-start; border-radius: 8px; }
.sqlc-obj:hover { background: var(--surface-2); }
.sqlc-obj-main { flex: 1; min-width: 0; display: flex; align-items: flex-start; justify-content: flex-start; gap: 8px; padding: 4px 6px; border: none; background: none;
  border-radius: 8px; text-align: left; font-weight: 400; }
.sqlc-obj-main:hover { background: none; }
.sqlc-obj-text { min-width: 0; display: flex; flex-direction: column; }
.sqlc-obj-name { font: 500 12.5px/1.35 var(--font-mono); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sqlc-obj-desc { font-size: 11.5px; line-height: 1.3; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sqlc-obj-tool { flex: none; padding: 4px 7px; margin-top: 1px; }
.sqlc-cols { flex-basis: 100%; display: flex; flex-direction: column; padding: 0 0 6px; }
.sqlc-col { display: flex; justify-content: space-between; gap: 10px; width: 100%; padding: 2px 8px 2px 36px; border: none; background: none; border-radius: 6px;
  font: 500 12px/1.4 var(--font-mono); text-align: left; }
.sqlc-col .muted { font-size: 11px; }
.sqlc-more { margin: 4px 0 4px 34px; }
.sqlc-kind { flex: none; display: inline-grid; place-items: center; min-width: 22px; height: 18px; padding: 0 3px; margin-top: 1px; border-radius: 5px; color: #fff; background: #6b7280;
  font: 700 9.5px/1 var(--font-mono); letter-spacing: .02em; }
.k-T { background: #2f6fd6; }
.k-V { background: #0f8a7e; }
.k-P { background: #8b4fd6; }
.k-F, .k-TF { background: #c27a0e; }
.k-C { background: var(--surface-2); color: var(--text); box-shadow: inset 0 0 0 1px var(--border-strong); }
.k-K { background: var(--side-bg); color: var(--signal); }
.k-Fn { background: #c0397f; }

/* ---------------------------------------------------------------- edytor */
.sqlc-work { --ed-h: 40%; position: relative; min-width: 0; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(90px, var(--ed-h)) 7px minmax(0, 1fr);
  overflow: hidden; background: var(--surface); border: 1px solid var(--border); border-radius: 14px; }
/* wiersze siatki na stałe – ukryty edytor albo uchwyt (telefon) nie przesuwa wyników do innego wiersza */
.sqlc-bar { grid-row: 1; }
.sqlc-editor { grid-row: 2; }
.sqlc-resize { grid-row: 3; }
.sqlc-results { grid-row: 4; }
.sqlc-bar { display: flex; align-items: center; gap: 6px; padding: 8px 10px; border-bottom: 1px solid var(--border); flex-wrap: wrap; min-width: 0; }
.sqlc-bar .sqlc-timeout { width: auto; padding: 6px 8px; font-size: 12.5px; }
.sqlc-status { min-width: 0; color: var(--muted); font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: inline-flex; align-items: center; gap: 7px; }
.sqlc-status::before { content: ""; flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--off); }
.sqlc-status.ok::before { background: var(--ok); }
.sqlc-status.warn::before { background: var(--warn); }
.sqlc-status.err { color: var(--danger); }
.sqlc-status.err::before { background: var(--danger); }
.sqlc-status.busy::before { background: var(--warn); animation: led-pulse 1s ease-in-out infinite; }
.sqlc-editor { position: relative; display: flex; min-height: 0; overflow: hidden; background: var(--ed-bg); }
.sqlc-gutter { flex: none; width: 46px; overflow: hidden; background: var(--ed-gutter); border-right: 1px solid var(--border); color: var(--muted); text-align: right; user-select: none; }
.sqlc-lines { padding: 10px 9px 10px 0; font: 500 12px/20px var(--font-mono); white-space: pre; opacity: .75; }
.sqlc-code { position: relative; flex: 1; min-width: 0; overflow: hidden; }
.sqlc-layer { position: absolute; left: 0; top: 0; min-width: 100%; pointer-events: none; }
.sqlc-hl, .sqlc-editor .sqlc-ta, .sqlc-measure { margin: 0; padding: 10px 14px 10px 12px; font: 500 13px/20px var(--font-mono); letter-spacing: 0; white-space: pre; tab-size: 4;
  font-variant-ligatures: none; }
.sqlc-hl { color: var(--ed-text); background: none; border: none; border-radius: 0; overflow: visible; }
.sqlc-editor .sqlc-ta { position: absolute; inset: 0; width: 100%; height: 100%; resize: none; border: none; border-radius: 0; background: transparent; color: transparent;
  caret-color: var(--ed-caret); overflow: auto; overflow-wrap: normal; box-shadow: none; outline: none; scrollbar-width: thin; }
.sqlc-editor .sqlc-ta:focus { box-shadow: none; border: none; }
.sqlc-editor .sqlc-ta::selection { background: color-mix(in srgb, var(--signal) 45%, transparent); color: transparent; }
.sqlc-measure { position: absolute; left: 0; top: 0; padding: 0; visibility: hidden; pointer-events: none; }
.sqlc-errline { position: absolute; left: 0; width: 100000px; background: color-mix(in srgb, var(--danger) 15%, transparent); box-shadow: inset 3px 0 0 var(--danger); }
.sqlc-hl .k { color: var(--sx-k); }
.sqlc-hl .f { color: var(--sx-f); }
.sqlc-hl .s { color: var(--sx-s); }
.sqlc-hl .c { color: var(--sx-c); font-style: italic; }
.sqlc-hl .n { color: var(--sx-n); }
.sqlc-hl .t { color: var(--sx-t); }
.sqlc-hl .v { color: var(--sx-v); }
.sqlc-hl .q { color: var(--sx-q); }
.sqlc-resize { position: relative; cursor: row-resize; background: var(--surface-2); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.sqlc-resize::after { content: ""; position: absolute; left: 50%; top: 2px; width: 36px; height: 1px; margin-left: -18px; border-top: 1px solid var(--border-strong); border-bottom: 1px solid var(--border-strong); }

/* podpowiedzi */
.sqlc-ac { position: absolute; z-index: 10; max-height: 278px; overflow: auto; padding: 4px; background: var(--surface); border: 1px solid var(--border-strong); border-radius: 10px;
  box-shadow: var(--shadow); scrollbar-width: thin; }
.sqlc-ac-item { display: flex; align-items: center; gap: 8px; height: 30px; padding: 0 8px; border-radius: 7px; cursor: pointer; font-size: 12.5px; min-width: 0; }
.sqlc-ac-item.active { background: color-mix(in srgb, var(--signal) 32%, var(--surface)); }
.sqlc-ac-name { flex: none; max-width: 58%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 500 12.5px/1.5 var(--font-mono); }
.sqlc-ac-detail { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); font-size: 11.5px; text-align: right; }

/* ---------------------------------------------------------------- wyniki */
.sqlc-results { min-height: 0; display: flex; flex-direction: column; }
.sqlc-rtabs { flex: none; display: flex; gap: 2px; padding: 6px 8px 0; border-bottom: 1px solid var(--border); overflow-x: auto; scrollbar-width: none; }
.sqlc-rtab { position: relative; flex: none; gap: 8px; padding: 6px 12px 8px; border: none; border-radius: 8px 8px 0 0; background: none; color: var(--muted); font-weight: 500; font-size: 13px; }
.sqlc-rtab:hover { background: var(--surface-2); color: var(--text); }
.sqlc-rtab.active { color: var(--text); font-weight: 650; }
.sqlc-rtab.active::after { content: ""; position: absolute; left: 8px; right: 8px; bottom: -1px; height: 3px; border-radius: 3px 3px 0 0; background: var(--signal); }
.sqlc-rtab.err { color: var(--danger); }
.sqlc-rbody { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.sqlc-empty { margin: auto; padding: 24px; text-align: center; color: var(--muted); max-width: 520px; }
.sqlc-empty p { margin: 4px 0; }
.sqlc-result { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.sqlc-rtools { flex: none; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding: 6px 10px; border-bottom: 1px solid var(--border); }
.sqlc-rinfo { font-size: 12.5px; color: var(--muted); }
.sqlc-grid { flex: 1; min-height: 0; overflow: auto; outline: none; scrollbar-width: thin; }
.sqlc-grid:focus-visible { box-shadow: inset 0 0 0 2px var(--focus); }
.sqlc-table { table-layout: fixed; border-collapse: separate; border-spacing: 0; }
.sqlc-table th, .sqlc-table td { height: 26px; padding: 0 8px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle;
  border-bottom: 1px solid var(--border); border-right: 1px solid color-mix(in srgb, var(--border) 60%, transparent); }
.sqlc-table th { position: sticky; top: 0; z-index: 2; background: var(--surface-2); color: var(--text); font: 650 12px/26px var(--font); text-transform: none; letter-spacing: 0;
  border-bottom-color: var(--border-strong); }
.sqlc-table td { font: 500 12px/26px var(--font-mono); cursor: cell; }
.sqlc-table .sqlc-rn { position: sticky; left: 0; z-index: 1; background: var(--surface-2); color: var(--muted); text-align: right; font: 500 11px/26px var(--font-mono); cursor: default; }
.sqlc-table th.sqlc-rn { z-index: 3; }
.sqlc-table td.num { text-align: right; font-variant-numeric: tabular-nums; }
.sqlc-table td.null { color: var(--muted); font-style: italic; opacity: .7; }
.sqlc-table tbody tr:hover td { background: color-mix(in srgb, var(--surface-2) 70%, transparent); }
.sqlc-table tr.sel-row td { background: color-mix(in srgb, var(--signal) 8%, transparent); }
.sqlc-table td.sel { background: color-mix(in srgb, var(--signal) 26%, transparent); box-shadow: inset 0 0 0 2px var(--focus); }
.sqlc-table .sqlc-pad-row td { height: auto; padding: 0; border: none; background: none; }
.sqlc-cards { flex: 1; min-height: 0; overflow: auto; padding: 10px; display: flex; flex-direction: column; gap: 8px; }
.sqlc-card { padding: 8px 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); }
.sqlc-card-head { margin-bottom: 4px; color: var(--muted); font: 600 11.5px/1.3 var(--font-mono); }
.sqlc-card dl { display: grid; grid-template-columns: minmax(90px, 38%) minmax(0, 1fr); gap: 2px 10px; margin: 0; font-size: 12.5px; }
.sqlc-card dt { color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sqlc-card dd { margin: 0; font: 500 12px/1.45 var(--font-mono); word-break: break-word; }
.sqlc-card dd.null { color: var(--muted); font-style: italic; }
.sqlc-more-cards { align-self: center; }
.sqlc-messages { flex: 1; min-height: 0; overflow: auto; padding: 10px 12px; display: flex; flex-direction: column; gap: 4px; }
.sqlc-msg { font: 500 12.5px/1.5 var(--font-mono); white-space: pre-wrap; }
.sqlc-msg.count { color: var(--muted); }
.sqlc-msg.warn { color: var(--warn); }
.sqlc-msg.error { color: var(--danger); }
.sqlc-failure { margin: 12px; padding: 12px 14px; border-radius: 12px; border: 1px solid color-mix(in srgb, var(--danger) 40%, transparent);
  background: color-mix(in srgb, var(--danger) 7%, var(--surface)); }
.sqlc-messages .sqlc-failure { margin: 0 0 6px; }
.sqlc-failure strong { color: var(--danger); }
.sqlc-failure p { margin: 6px 0 0; font: 500 12.5px/1.5 var(--font-mono); white-space: pre-wrap; }
.sqlc-failure p.muted { font-family: var(--font); }
.sqlc-failure.blocked { border-color: color-mix(in srgb, var(--danger) 55%, transparent); }
.sqlc-value { min-height: 260px; font-size: 12.5px; white-space: pre-wrap; }

/* ---------------------------------------------------------------- historia, ulubione, opis tabeli */
.sqlc-hist-list { display: flex; flex-direction: column; gap: 8px; max-height: 58vh; overflow: auto; margin-top: 10px; }
.sqlc-hist { padding: 8px 10px; border: 1px solid var(--border); border-radius: 12px; }
.sqlc-hist-meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sqlc-hist-meta .spacer { flex: 1; }
.sqlc-hist-sql { margin: 6px 0 0; max-height: 64px; overflow: hidden; color: var(--muted); font: 500 12px/1.45 var(--font-mono); white-space: pre-wrap; }
.sqlc-doc-tools { display: flex; gap: 8px; margin: 6px 0 10px; }
.sqlc-doc-tools button { flex: none; }
.sqlc-doc-table { max-height: 52vh; overflow: auto; }
.sqlc-doc-table td { padding: 6px 10px; }
.sqlc-doc-desc { white-space: pre-wrap; font-size: 12.5px; min-width: 260px; }
.sqlc-doc-rel { margin-top: 10px; }
.sqlc-doc-rel li { margin: 4px 0; }

/* ---------------------------------------------------------------- konsola zamknięta */
.sqlc-closed { position: absolute; inset: 0; z-index: 20; display: grid; place-items: center; padding: 16px; background: color-mix(in srgb, var(--bg) 72%, transparent); backdrop-filter: blur(2px); }
.sqlc-closed-card { max-width: 440px; padding: 20px 22px; }
.sqlc-closed-card h3 { margin: 0 0 6px; }
.sqlc-closed-card .buttons { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }

/* ---------------------------------------------------------------- rentgen */
.sqlc-xray { display: flex; flex-direction: column; min-height: 0; overflow: hidden; background: var(--surface); border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--shadow); }
.sqlc-xhead { display: flex; align-items: center; gap: 8px; padding: 9px 12px; background: var(--side-bg); color: var(--side-text); }
.sqlc-xhead .muted { color: var(--side-muted); }
.sqlc-xhead button { color: var(--side-text); border-color: var(--side-border); }
.sqlc-xhead button:hover { background: var(--side-2); }
.sqlc-xhead .icon-btn { width: 32px; height: 32px; padding: 0; }
.sqlc-xtitle { flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px; }
.sqlc-xform { display: flex; gap: 6px; padding: 10px 12px; border-bottom: 1px solid var(--border); }
.sqlc-xform button { flex: none; }
.sqlc-xbody { flex: 1; min-height: 0; overflow: auto; padding: 12px 14px 22px; scrollbar-width: thin; }
.sqlc-xempty { max-width: 640px; color: var(--muted); }
.sqlc-xempty p:first-child { color: var(--text); }
.sqlc-xcands { display: flex; flex-direction: column; gap: 4px; }
.sqlc-xcand, .sqlc-xlink { display: flex; align-items: center; justify-content: flex-start; gap: 10px; width: 100%; padding: 7px 9px; border-radius: 9px; text-align: left; font-weight: 400; }
.sqlc-xlink { border: none; background: none; }
.sqlc-xcand .grow, .sqlc-xlink .grow { flex: 1; min-width: 0; display: flex; flex-direction: column; overflow: hidden; }
.sqlc-xlink .grow > * { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sqlc-xchip { flex: none; padding: 4px 7px; border-radius: 6px; background: var(--side-bg); color: var(--signal); font: 700 11px/1 var(--font-mono); letter-spacing: .03em; }
.sqlc-xchip.big { padding: 7px 10px; font-size: 13px; }
.sqlc-xlink .sqlc-xchip, .sqlc-xcand .sqlc-xchip { min-width: 44px; text-align: center; }
.sqlc-xdoc { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; padding: 4px 0 4px 12px; border-left: 4px solid var(--signal); }
.sqlc-xdoc-main { display: flex; align-items: center; gap: 12px; min-width: 0; }
.sqlc-xdoc h3 { margin: 0; font: 700 21px/1.2 var(--font-display); letter-spacing: -.01em; word-break: break-word; }
.sqlc-xdoc-tools { display: flex; gap: 6px; flex-wrap: wrap; }
.sqlc-xfacts { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px 14px; padding: 10px 14px; border: 1px solid var(--border); border-radius: 12px;
  background: var(--surface-2); }
.sqlc-xlabel { color: var(--muted); font: 600 10.5px/1.4 var(--font); text-transform: uppercase; letter-spacing: .05em; }
.sqlc-xvalue { font-weight: 650; font-size: 14px; word-break: break-word; }
.sqlc-xvalue.good { color: var(--ok); }
.sqlc-xvalue.warn { color: var(--warn); }
.sqlc-xvalue.bad { color: var(--danger); }
.sqlc-xtoc { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0 4px; }
.sqlc-xtoc a { padding: 3px 10px; border: 1px solid var(--border); border-radius: 99px; background: var(--surface); font-size: 12px; font-weight: 500; text-decoration: none; }
.sqlc-xtoc a:hover { border-color: var(--focus); }
.sqlc-xtoc i { font-style: normal; font-weight: 650; color: var(--muted); }
.sqlc-xtoc i.err { color: var(--danger); }
.sqlc-xsec { margin-top: 10px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); scroll-margin-top: 8px; }
.sqlc-xsec > summary, .sqlc-xsec > h4 { display: flex; align-items: center; gap: 8px; margin: 0; padding: 9px 12px; font: 650 14px/1.4 var(--font); text-transform: none;
  letter-spacing: 0; color: var(--text); list-style: none; }
.sqlc-xsec > summary { cursor: pointer; }
.sqlc-xsec > summary::-webkit-details-marker { display: none; }
.sqlc-xsec > summary::before { content: "▸"; color: var(--muted); width: 10px; }
.sqlc-xsec[open] > summary::before { content: "▾"; }
.sqlc-xsec > summary .sqlc-count, .sqlc-xsec > h4 .sqlc-count { margin-left: 0; }
.sqlc-xsec .spacer { flex: 1; }
.sqlc-xhint { margin: -4px 12px 8px; }
.sqlc-xsec > p { margin: 0 12px 10px; }
.sqlc-xsec-body { padding: 0 12px 12px; display: flex; flex-direction: column; gap: 8px; align-items: stretch; }
.sqlc-xsec-body > button { align-self: flex-start; }
.sqlc-xlinks { display: flex; flex-direction: column; gap: 1px; padding: 0 6px 8px; }
.sqlc-xlink:hover { background: var(--surface-2); }
.sqlc-xtable { max-height: 460px; overflow: auto; border-radius: 10px; }
.sqlc-xtable th, .sqlc-xtable td { padding: 5px 9px; font-size: 12px; white-space: nowrap; }
.sqlc-xtable td { font-family: var(--font-mono); max-width: 360px; overflow: hidden; text-overflow: ellipsis; }
.sqlc-xcard { padding: 8px 12px; border: 1px solid var(--border); border-radius: 10px; }
.sqlc-xcard-title { margin-bottom: 4px; color: var(--focus); font-weight: 650; font-size: 12.5px; }
.sqlc-xcard dl { display: grid; grid-template-columns: minmax(110px, max-content) minmax(0, 1fr) minmax(110px, max-content) minmax(0, 1fr); gap: 0 14px; margin: 0; font-size: 12px; }
.sqlc-xcard dt, .sqlc-xcard dd { padding: 3px 0; border-bottom: 1px dotted var(--border); min-width: 0; }
.sqlc-xcard dt { color: var(--muted); font-family: var(--font-mono); font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sqlc-xcard dd { margin: 0; font-weight: 600; word-break: break-word; }
.sqlc-xcard dd.num { font-variant-numeric: tabular-nums; }

/* ---------------------------------------------------------------- telefon: przewijana strona, obiekty w szufladzie, edytor zwijany */
@media (max-width: 860px) {
  body.in-sql .view { display: block; overflow: auto; padding: 10px; }
  .sqlc { gap: 8px; }
  .sqlc-titles h2 { font-size: 19px; }
  .sqlc-sub { white-space: normal; }
  .sqlc-head > .sqlc-icon { display: none; }
  .sqlc-actions { width: 100%; }
  .sqlc-actions .sqlc-db { flex: 1 1 100%; max-width: none; min-width: 0; }
  .sqlc-actions button { padding: 6px 10px; font-size: 13px; }
  .sqlc-body { display: flex; flex-direction: column; }
  .sqlc-side { position: fixed; inset: 0 auto 0 0; z-index: 30; width: min(330px, 88vw); border-radius: 0; transform: translateX(-105%); transition: transform .2s; }
  .sqlc.show-side .sqlc-side { transform: none; box-shadow: var(--shadow); }
  .sqlc.show-side .sqlc-side-backdrop { display: block; position: fixed; inset: 0; z-index: 29; background: rgba(0, 0, 0, .35); }
  .sqlc-phone { display: inline-flex; }
  .sqlc-work { grid-template-rows: auto 28vh 0 66vh; }
  .sqlc.ed-collapsed .sqlc-work { grid-template-rows: auto 0 0 70vh; }
  .sqlc.ed-collapsed .sqlc-editor { display: none; }
  .sqlc-resize { display: none; }
  .sqlc-bar .sqlc-status { flex-basis: 100%; }
  .sqlc-rtools { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .sqlc-rtools > * { flex: none; }
  .sqlc-xray { position: fixed; inset: 0; z-index: 40; border-radius: 0; border: none; }
  .sqlc-xbody { padding: 10px 12px 28px; }
  .sqlc-xdoc h3 { font-size: 18px; }
  .sqlc-xfacts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sqlc-xcard dl { grid-template-columns: minmax(90px, 42%) minmax(0, 1fr); }
}