/* openapi-reference (knižnica HelloWebu): vzhľad referencie API v štýle Swagger UI.

   Farby, písmo a odstupy sú premenné webu (--accent, --line, --ink, --mono, --s-*, --t-*…)
   s predvolenou hodnotou za čiarkou: web, ktorý ich má, vyzerá po svojom, iný dostane
   svetlú tému bez vlastného CSS. Tmavú tému dodá web svojimi premennými.

   Pravidlá, ktoré bežne patria webu (tlačidlá, .small, .muted, blok kódu), sú v :where()
   s nulovou váhou: vlastné pravidlo webu vždy vyhrá, nech je načítané kdekoľvek.
   Ostatné pravidlá majú váhu tried; web, ktorý ich chce prebiť, ich dá za knižnicu. */

/* ---- náhradný základ, keď ho web nemá ---- */
:where(.swg) [hidden] { display: none !important; }
:where(.swg) :where(h2, h3, h4, h5, h6, p, ul, ol, dl, dd, pre, table) { margin: 0; }
:where(.swg) :where(code, pre, var) { font-family: var(--mono, ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace); font-style: normal; }
:where(.swg .small) { font-size: var(--t-small, 0.9375rem); }
:where(.swg .muted) { color: var(--ink-3, #6f6f6f); }
:where(.swg .table-wrap) { overflow-x: auto; }
:where(.swg pre.code) { border: 1px solid var(--line, #e3e3e3); border-radius: var(--r-2, 8px); padding: 16px 20px; overflow-x: auto; white-space: pre; }
:where(.swg .btn) { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 20px; border-radius: var(--r-1, 3px); font: 500 var(--t-small, 0.9375rem)/1 var(--sans, "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif); cursor: pointer; border: 1px solid transparent; background: var(--accent, #0b7a3b); color: var(--on-accent, #ffffff); }
:where(.swg .btn-secondary) { background: transparent; color: var(--ink, #111111); border-color: var(--line-strong, #c9c9c9); }
:where(.swg .btn-small) { min-height: 36px; padding: 0 14px; }
:where(.swg .link-quiet, .swg .link-button) { color: var(--ink-3, #6f6f6f); font-size: var(--t-small, 0.9375rem); text-decoration: underline; text-underline-offset: 3px; background: none; border: 0; padding: 0; font-family: inherit; cursor: pointer; }

/* ---- referencia ---- */
.swg { --get: #1f7fd1; --post: #1f9d5a; --put: #d98c1a; --delete: #d93f3f; --patch: #3aa8a0; padding-block: var(--s-6, 32px) var(--s-8, 64px); display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--s-6, 32px); }
.swg-info { display: grid; gap: var(--s-3, 12px); }
.swg-title { display: flex; align-items: center; gap: var(--s-3, 12px); flex-wrap: wrap; }
.swg-title h2 { font-size: var(--t-h3, 1.25rem); }
.pill { display: inline-block; padding: 3px 8px; border-radius: 999px; background: var(--ink-2, #4d4d4d); color: var(--bg, #ffffff); font: 500 var(--t-caption, 0.8125rem)/1 var(--mono, ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace); }
.pill--oas { background: var(--surface, #f6f6f6); color: var(--ink-2, #4d4d4d); border: 1px solid var(--line, #e3e3e3); }
.pill--quiet { background: var(--surface, #f6f6f6); color: var(--ink-3, #6f6f6f); border: 1px solid var(--line, #e3e3e3); font-family: var(--sans, "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif); }
.swg-tools { display: flex; gap: var(--s-4, 16px); flex-wrap: wrap; }
.swg-desc { display: grid; gap: var(--s-3, 12px); color: var(--ink-2, #4d4d4d); max-width: 46rem; }
.swg-desc h4, .swg-desc h5 { font-size: var(--t-body, 1.0625rem); font-weight: 600; color: var(--ink, #111111); margin-top: var(--s-2, 8px); }
.swg-desc ul { padding-left: 1.2em; display: grid; gap: 6px; }
.swg-desc code, .opblock-description code, .parameter__desc code, .response-desc code { background: var(--surface, #f6f6f6); border: 1px solid var(--line, #e3e3e3); border-radius: 3px; padding: 0 5px; }
.swg-desc pre.code code { background: none; border: 0; padding: 0; }
.swg-desc strong { color: var(--ink, #111111); }
.swg-bar { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--s-5, 24px); flex-wrap: wrap; padding: var(--s-4, 16px) var(--s-5, 24px); background: var(--surface, #f6f6f6); border: 1px solid var(--line, #e3e3e3); border-radius: var(--r-1, 3px); }
.swg-servers h3 { font-size: var(--t-small, 0.9375rem); font-weight: 600; margin-bottom: var(--s-2, 8px); }
.swg-server-row { display: flex; align-items: center; gap: var(--s-3, 12px) var(--s-4, 16px); flex-wrap: wrap; }
.swg-server-url { font-size: var(--t-small, 0.9375rem); padding: 8px 10px; background: var(--bg, #ffffff); border: 1px solid var(--line-strong, #c9c9c9); border-radius: var(--r-1, 3px); }
.swg-var { display: inline-flex; align-items: center; gap: 8px; font-size: var(--t-small, 0.9375rem); }
.swg-var span { font-family: var(--mono, ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace); color: var(--ink-2, #4d4d4d); }
.swg-var input { font: 400 var(--t-small, 0.9375rem)/1 var(--mono, ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace); padding: 8px 10px; border: 1px solid var(--line-strong, #c9c9c9); border-radius: var(--r-1, 3px); background: var(--bg, #ffffff); color: var(--ink, #111111); min-width: 12ch; }
.swg-var-help { flex-basis: 100%; font-size: var(--t-caption, 0.8125rem); color: var(--ink-3, #6f6f6f); }
.btn-auth { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 16px; border-radius: var(--r-1, 3px); border: 1px solid var(--accent, #0b7a3b); color: var(--accent, #0b7a3b); background: var(--bg, #ffffff); font: 600 var(--t-small, 0.9375rem)/1 var(--sans, "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif); cursor: pointer; }
.btn-auth.is-authorized { background: var(--accent, #0b7a3b); color: var(--on-accent, #ffffff); }
.lock { display: inline-flex; color: var(--ink-3, #6f6f6f); }
.lock--open { color: var(--ink-3, #6f6f6f); }
.opblock-summary .lock:not(.lock--open) { color: var(--ink, #111111); }
.lock--none { width: 16px; }
.chev { display: inline-flex; color: var(--ink-3, #6f6f6f); transition: transform 150ms; }
.is-open > .opblock-summary .chev, .is-open > .opblock-tag .chev, .model-box.is-open .chev { transform: rotate(180deg); }
/* tags */
.opblock-tag-section { display: grid; gap: var(--s-3, 12px); }
.opblock-tag { border-bottom: 1px solid var(--line, #e3e3e3); }
.opblock-tag-btn { width: 100%; display: flex; align-items: baseline; gap: var(--s-3, 12px); padding: 12px 0; background: none; border: 0; font: 600 var(--t-h3, 1.25rem)/1.3 var(--sans, "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif); color: var(--ink, #111111); cursor: pointer; text-align: left; }
.opblock-tag-btn small { font: 400 var(--t-small, 0.9375rem)/1.4 var(--sans, "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif); color: var(--ink-3, #6f6f6f); flex: 1; }
.opblock-tag-btn .chev { align-self: center; }
.opblock-tag-section:not(.is-open) .opblock-list, .models:not(.is-open) .models-list { display: none; }
.opblock-list { display: grid; gap: var(--s-3, 12px); }
/* operation block */
.opblock { border: 1px solid var(--m); border-radius: var(--r-1, 3px); background: color-mix(in srgb, var(--m) 7%, var(--bg, #ffffff)); scroll-margin-top: 16px; }
.opblock-get { --m: var(--get); } .opblock-post { --m: var(--post); } .opblock-put { --m: var(--put); } .opblock-delete { --m: var(--delete); } .opblock-patch { --m: var(--patch); }
.opblock-summary { width: 100%; display: flex; align-items: center; gap: var(--s-3, 12px); padding: 8px 12px; background: none; border: 0; cursor: pointer; text-align: left; font: inherit; color: var(--ink, #111111); min-height: 48px; }
.opblock-method { display: inline-block; min-width: 72px; text-align: center; padding: 7px 0; border-radius: var(--r-1, 3px); background: var(--m); color: #fff; font: 700 var(--t-caption, 0.8125rem)/1 var(--sans, "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif); letter-spacing: 0.02em; }
.opblock-path { font: 500 var(--t-code, 0.9375rem)/1.3 var(--mono, ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace); color: var(--ink, #111111); }
.opblock-path var { font-weight: 600; }
.opblock-desc { flex: 1; font-size: var(--t-small, 0.9375rem); color: var(--ink-2, #4d4d4d); }
.opblock.is-open > .opblock-summary { border-bottom: 1px solid var(--m); }
.opblock-body { padding: var(--s-4, 16px) var(--s-5, 24px) var(--s-5, 24px); display: grid; gap: var(--s-5, 24px); background: var(--bg, #ffffff); border-radius: 0 0 var(--r-1, 3px) var(--r-1, 3px); }
.opblock-description { display: grid; gap: var(--s-3, 12px); color: var(--ink-2, #4d4d4d); max-width: 46rem; font-size: var(--t-small, 0.9375rem); }
.opblock-description strong { color: var(--ink, #111111); }
.opblock-section { display: grid; gap: var(--s-3, 12px); }
.opblock-section-header { display: flex; align-items: center; gap: var(--s-3, 12px); padding: 8px 0; border-bottom: 1px solid var(--line, #e3e3e3); }
.opblock-section-header h4 { font-size: var(--t-small, 0.9375rem); font-weight: 600; flex: 1; }
.btn-try { min-height: 32px; padding: 0 12px; border-radius: var(--r-1, 3px); border: 1px solid var(--accent, #0b7a3b); color: var(--accent, #0b7a3b); background: var(--bg, #ffffff); font: 600 var(--t-caption, 0.8125rem)/1 var(--sans, "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif); cursor: pointer; }
.btn-try--cancel { border-color: var(--delete); color: var(--delete); }
table.parameters, table.responses-table { width: 100%; border-collapse: collapse; font-size: var(--t-small, 0.9375rem); }
table.parameters th, table.responses-table th { text-align: left; font-weight: 600; font-size: var(--t-caption, 0.8125rem); color: var(--ink-3, #6f6f6f); padding: 6px 10px 6px 0; border-bottom: 1px solid var(--line, #e3e3e3); }
table.parameters td, table.responses-table td { padding: 12px 10px 12px 0; vertical-align: top; border-bottom: 1px solid var(--line, #e3e3e3); }
.parameters-col_name { width: 220px; white-space: nowrap; }
.parameter__name { font-weight: 600; }
.parameter__name .star { color: var(--delete); }
.parameter__type { font-family: var(--mono, ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace); font-size: var(--t-caption, 0.8125rem); color: var(--ink-2, #4d4d4d); margin-top: 2px; }
.parameter__in { font-size: var(--t-caption, 0.8125rem); color: var(--ink-3, #6f6f6f); font-style: italic; }
.parameter__desc { color: var(--ink-2, #4d4d4d); }
.parameter__example { font-size: var(--t-caption, 0.8125rem); color: var(--ink-3, #6f6f6f); margin-top: 4px; }
.parameter__control { margin-top: 8px; }
.parameter__control input, .parameter__control select, .body-param textarea { width: 100%; max-width: 420px; font: 400 var(--t-small, 0.9375rem)/1.4 var(--mono, ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace); padding: 8px 10px; border: 1px solid var(--line-strong, #c9c9c9); border-radius: var(--r-1, 3px); background: var(--bg, #ffffff); color: var(--ink, #111111); }
.body-param textarea { max-width: 100%; min-height: 110px; resize: vertical; }
.parameter__control input:disabled, .parameter__control select:disabled, .body-param textarea:disabled { background: var(--surface, #f6f6f6); color: var(--ink-2, #4d4d4d); border-color: var(--line, #e3e3e3); }
.is-trying .parameter__example { display: none; }
.execute-wrapper { display: flex; gap: var(--s-3, 12px); }
.btn-execute { flex: 1; min-height: 44px; border-radius: var(--r-1, 3px); border: 1px solid var(--accent, #0b7a3b); background: var(--accent, #0b7a3b); color: var(--on-accent, #ffffff); font: 600 var(--t-small, 0.9375rem)/1 var(--sans, "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif); cursor: pointer; }
.btn-execute.is-real { background: var(--ink, #111111); border-color: var(--ink, #111111); color: var(--bg, #ffffff); }
.btn-clear { flex: 1; min-height: 44px; border-radius: var(--r-1, 3px); border: 1px solid var(--line-strong, #c9c9c9); background: var(--bg, #ffffff); color: var(--ink-2, #4d4d4d); font: 600 var(--t-small, 0.9375rem)/1 var(--sans, "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif); cursor: pointer; }
.response-col_status { width: 72px; font-family: var(--mono, ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace); font-weight: 600; }
.response-col_status small { display: block; font-weight: 400; color: var(--ink-3, #6f6f6f); font-size: var(--t-caption, 0.8125rem); white-space: nowrap; }
.response-desc { color: var(--ink-2, #4d4d4d); margin-bottom: 8px; }
.model-example { display: grid; gap: 8px; }
.tabs { display: flex; gap: 2px; }
.tab { font: 600 var(--t-caption, 0.8125rem)/1 var(--sans, "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif); padding: 8px 10px; border: 0; border-bottom: 2px solid transparent; background: none; color: var(--ink-3, #6f6f6f); cursor: pointer; }
.tab.is-active { color: var(--ink, #111111); border-bottom-color: var(--ink, #111111); }
.example-select { font: inherit; padding: 4px 6px; border: 1px solid var(--line-strong, #c9c9c9); border-radius: var(--r-1, 3px); background: var(--bg, #ffffff); color: var(--ink, #111111); }
.swg pre.code { font-size: 0.8125rem; line-height: 1.55; background: #1e1e1e; color: #e8e8e8; border-color: #1e1e1e; }
.swg-desc pre.code { background: var(--code-bg, #fafafa); color: var(--ink, #111111); border-color: var(--line, #e3e3e3); }
.live-responses { display: grid; gap: var(--s-3, 12px); padding: var(--s-4, 16px); border: 1px solid var(--line, #e3e3e3); border-radius: var(--r-1, 3px); background: var(--surface, #f6f6f6); }
.live-responses h5, .server-response h5 { font-size: var(--t-small, 0.9375rem); font-weight: 600; }
.live-responses h6 { font-size: var(--t-caption, 0.8125rem); font-weight: 600; color: var(--ink-3, #6f6f6f); text-transform: uppercase; letter-spacing: 0.05em; margin-top: 8px; }
.live-table { background: var(--bg, #ffffff); }
.live-error, .live-warn { font-size: var(--t-small, 0.9375rem); padding: 10px 12px; border-radius: var(--r-1, 3px); border: 1px solid var(--delete); color: var(--ink, #111111); background: color-mix(in srgb, var(--delete) 6%, var(--bg, #ffffff)); }
.live-warn { border-color: var(--put); background: color-mix(in srgb, var(--put) 8%, var(--bg, #ffffff)); }
table.fields { border-collapse: collapse; width: 100%; font-size: var(--t-caption, 0.8125rem); }
table.fields td { padding: 6px 10px 6px 0; border-bottom: 1px solid var(--line, #e3e3e3); vertical-align: top; }
table.fields .field-type { color: var(--ink-3, #6f6f6f); white-space: nowrap; font-family: var(--mono, ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace); }
table.fields .field-desc { color: var(--ink-2, #4d4d4d); }
table.fields .star { color: var(--delete); margin-left: 2px; }
table.fields .example { color: var(--ink-3, #6f6f6f); }
/* authorize modal */
.swg-modal { position: fixed; inset: 0; z-index: 50; background: rgb(0 0 0 / 45%); display: grid; place-items: center; padding: var(--s-4, 16px); }
.swg-modal[hidden] { display: none; }
.swg-modal-box { width: min(560px, 100%); max-height: 90vh; overflow: auto; background: var(--bg, #ffffff); border: 1px solid var(--line, #e3e3e3); border-radius: var(--r-2, 8px); padding: var(--s-5, 24px); display: grid; gap: var(--s-4, 16px); }
.swg-modal-head { display: flex; justify-content: space-between; align-items: center; }
.swg-modal-head h3 { font-size: var(--t-h3, 1.25rem); }
.swg-close { background: none; border: 0; font-size: 28px; line-height: 1; color: var(--ink-3, #6f6f6f); cursor: pointer; padding: 0 6px; }
.swg-modal-note { font-size: var(--t-small, 0.9375rem); color: var(--ink-2, #4d4d4d); }
.swg-auth-scheme { display: grid; gap: 8px; padding-top: var(--s-4, 16px); border-top: 1px solid var(--line, #e3e3e3); }
.swg-auth-scheme h4 { font-size: var(--t-body, 1.0625rem); }
.swg-auth-row label { display: grid; gap: 4px; }
.swg-auth-row input { font: 400 var(--t-small, 0.9375rem)/1.4 var(--mono, ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace); padding: 9px 10px; border: 1px solid var(--line-strong, #c9c9c9); border-radius: var(--r-1, 3px); background: var(--bg, #ffffff); color: var(--ink, #111111); width: 100%; }
.swg-auth-status { font-size: var(--t-caption, 0.8125rem); color: var(--accent, #0b7a3b); font-weight: 600; }
.swg-auth-btns { display: flex; gap: 8px; }
.swg-modal-foot { display: flex; justify-content: flex-end; }
/* schemas */
.models { display: grid; gap: var(--s-3, 12px); }
.models-list { display: grid; gap: 8px; }
.model-box { border: 1px solid var(--line, #e3e3e3); border-radius: var(--r-1, 3px); background: var(--surface, #f6f6f6); }
.model-toggle { width: 100%; display: flex; align-items: center; gap: var(--s-3, 12px); padding: 10px 12px; background: none; border: 0; cursor: pointer; font: inherit; color: var(--ink, #111111); text-align: left; }
.model-title { font-weight: 600; font-family: var(--mono, ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace); font-size: var(--t-small, 0.9375rem); flex: 0 0 auto; }
.model-toggle .muted { flex: 1; }
.model-pane { padding: 0 12px 12px; display: grid; gap: 8px; }
@media (max-width: 719px) {
  .opblock-summary { flex-wrap: wrap; }
  .opblock-desc { flex-basis: 100%; }
  .parameters-col_name { width: auto; white-space: normal; }
  .swg-bar { flex-direction: column; align-items: stretch; }
}


/* ---- viac súborov v `specs`: záložky ---- */
.swg-specs { display: flex; gap: 2px; flex-wrap: wrap; border-bottom: 1px solid var(--line, #e3e3e3); }
.swg-specs .tab[aria-selected="true"] { color: var(--ink, #111111); border-bottom-color: var(--ink, #111111); }

/* ---- testcasy (x-test-cases) ---- */
.tc-checklist { display: grid; gap: var(--s-3, 12px); padding: var(--s-4, 16px) var(--s-5, 24px); border: 1px solid var(--line, #e3e3e3); border-radius: var(--r-1, 3px); }
.tc-checklist h3 { font-size: var(--t-h3, 1.25rem); }
.tc-table { width: 100%; border-collapse: collapse; font-size: var(--t-small, 0.9375rem); }
.tc-table th, .tc-table td { text-align: left; padding: 6px 8px; border-bottom: 1px solid var(--line, #e3e3e3); vertical-align: top; }
.tc-table th { color: var(--ink-3, #6f6f6f); font-weight: 500; }
.tc-status.is-pass, .tc-verdict.is-pass p { color: var(--post); font-weight: 600; }
.tc-status.is-fail, .tc-verdict.is-fail p { color: var(--delete); font-weight: 600; }
.tc-section { gap: var(--s-4, 16px); }
.tc-section .opblock-section-header { flex-wrap: wrap; }
.tc { border: 1px solid var(--line, #e3e3e3); border-left: 3px solid var(--m, var(--accent, #0b7a3b)); border-radius: var(--r-1, 3px); padding: var(--s-3, 12px) var(--s-4, 16px); display: grid; gap: var(--s-3, 12px); scroll-margin-top: 80px; }
.tc-head { display: flex; align-items: center; gap: var(--s-3, 12px); flex-wrap: wrap; }
.tc-head strong { flex: 1; min-width: 12rem; }
.tc-id { color: var(--ink-3, #6f6f6f); }
.tc-steps { display: grid; grid-template-columns: 8.5rem minmax(0, 1fr); gap: 6px var(--s-4, 16px); font-size: var(--t-small, 0.9375rem); }
.tc-steps dt { color: var(--ink-3, #6f6f6f); font-weight: 500; }
.tc-steps dd { color: var(--ink-2, #4d4d4d); }
.tc-steps dd p { margin: 0; }
.tc-verdict { font-size: var(--t-small, 0.9375rem); padding: 8px 12px; border-radius: var(--r-1, 3px); background: var(--surface, #f6f6f6); }
.tc-verdict ul { margin: 4px 0 0 1.2em; }
@media (max-width: 599px) { .tc-steps { grid-template-columns: minmax(0, 1fr); } .tc-steps dd { margin-bottom: 6px; } }
