/* Swagger UI no visual do WAGO, legível no claro e no escuro.
   O CSS da biblioteca fixa texto escuro, por isso cada superfície é redefinida aqui. */
:root {
    color-scheme: light dark;
    --bg: #f2f2f7;
    --surface: #ffffff;
    --surface-2: #f2f2f7;
    --bar: rgba(249, 249, 249, .86);
    --line: rgba(60, 60, 67, .22);
    --text: #000000;
    --text-2: #4f4f55;
    --link: #007a55;
    --tint: #25d366;
    --on-tint: #06301a;
    --get: #0a6b3c;
    --get-bg: #e4f8e8;
    --post: #0a4f8f;
    --post-bg: #e1f0ff;
    --put: #7a4a00;
    --put-bg: #fff2d6;
    --delete: #a81c12;
    --delete-bg: #ffe3e0;
    --patch: #5b3aa6;
    --patch-bg: #eee8ff;
    --code-bg: #1c1c1e;
    --code-text: #e5e5ea;
    --font: -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --mono: ui-monospace, 'SF Mono', SFMono-Regular, Menlo, Consolas, monospace;
}

@media (prefers-color-scheme: dark) {
    :root {
        --bg: #000000;
        --surface: #1c1c1e;
        --surface-2: #2c2c2e;
        --bar: rgba(22, 22, 24, .86);
        --line: rgba(120, 120, 128, .5);
        --text: #ffffff;
        --text-2: #c7c7cc;
        --link: #4ade80;
        --get: #7ce0a2;
        --get-bg: #103529;
        --post: #8fc7ff;
        --post-bg: #0c2a47;
        --put: #ffd60a;
        --put-bg: #3d2c0a;
        --delete: #ff9d94;
        --delete-bg: #3f1512;
        --patch: #c4b0ff;
        --patch-bg: #2a2150;
        --code-bg: #111113;
    }
}

html { box-sizing: border-box; overflow-y: scroll; }
*, *::before, *::after { box-sizing: inherit; }
body { margin: 0; background: var(--bg); color: var(--text); font-family: var(--font); -webkit-font-smoothing: antialiased; }

/* Cabeçalho próprio no lugar da barra da biblioteca */
.wago-head { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; gap: 12px; padding: 10px 24px; background: var(--bar); -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px); border-bottom: .5px solid var(--line); }
.wago-head strong { font-size: 20px; font-weight: 700; letter-spacing: -.02em; }
.wago-mark { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 8px; background: var(--tint); color: var(--on-tint); }
.wago-mark svg { width: 20px; height: 20px; }
.wago-head nav { margin-left: auto; display: flex; flex-wrap: wrap; gap: 16px; font-size: 14px; }
.wago-head a { color: var(--link); text-decoration: none; font-weight: 500; }
.wago-head a:hover { text-decoration: underline; text-underline-offset: 2px; }

.swagger-ui .topbar { display: none; }
.swagger-ui, .swagger-ui .wrapper { font-family: var(--font); color: var(--text); }
.swagger-ui .wrapper { max-width: 1200px; padding-inline: 24px; }

/* Textos */
.swagger-ui .info { margin: 24px 0 16px; }
.swagger-ui .info .title { color: var(--text); font-family: var(--font); font-size: 30px; letter-spacing: -.025em; }
.swagger-ui .info .title small { background: var(--surface-2); top: -6px; }
.swagger-ui .info .title small pre { color: var(--text-2); font-family: var(--mono); }
.swagger-ui .info .title small.version-stamp { background: var(--tint); }
.swagger-ui .info .title small.version-stamp pre { color: var(--on-tint); }
.swagger-ui .info p, .swagger-ui .info li, .swagger-ui .info table, .swagger-ui .info .base-url,
.swagger-ui .markdown p, .swagger-ui .markdown li, .swagger-ui .renderedMarkdown p, .swagger-ui .renderedMarkdown li,
.swagger-ui .opblock-description-wrapper, .swagger-ui .opblock-description-wrapper p,
.swagger-ui .opblock-external-docs-wrapper, .swagger-ui .opblock-external-docs-wrapper p,
.swagger-ui .opblock-title_normal, .swagger-ui .opblock-title_normal p,
.swagger-ui .response-col_description, .swagger-ui .response-col_description p,
.swagger-ui .parameter__in, .swagger-ui .parameter__type, .swagger-ui .parameter__deprecated, .swagger-ui .parameter__extension,
.swagger-ui .prop-format, .swagger-ui .prop-type, .swagger-ui .model, .swagger-ui .model-title, .swagger-ui .models-control, .swagger-ui .model-box,
.swagger-ui label, .swagger-ui .tab li, .swagger-ui .tab li button.tablinks, .swagger-ui .response-control-media-type__title, .swagger-ui .responses-inner h4, .swagger-ui .responses-inner h5,
.swagger-ui table thead tr th, .swagger-ui table thead tr td, .swagger-ui .parameters-col_description, .swagger-ui .response-col_status, .swagger-ui .response-col_links, .swagger-ui .scheme-container .schemes > label, .swagger-ui .servers > label, .swagger-ui .servers-title, .swagger-ui .loading-container .loading::after {
    color: var(--text);
    font-family: var(--font);
}
.swagger-ui .opblock-description-wrapper p, .swagger-ui .parameter__in, .swagger-ui .parameter__type, .swagger-ui .prop-format, .swagger-ui .prop-type,
.swagger-ui .response-col_description p, .swagger-ui .response-control-media-type__accept-message { color: var(--text-2); }
.swagger-ui .parameter__name, .swagger-ui .parameter__name.required, .swagger-ui .parameter__name.required span { color: var(--text); font-family: var(--mono); font-size: 14px; }
.swagger-ui .parameter__name.required::after { color: var(--delete); }
.swagger-ui a, .swagger-ui .info a, .swagger-ui .info .link { color: var(--link); }
.swagger-ui h1, .swagger-ui h2, .swagger-ui h3, .swagger-ui h4, .swagger-ui h5, .swagger-ui h6 { color: var(--text); font-family: var(--font); }
.swagger-ui .opblock-section-header h4, .swagger-ui .opblock-title, .swagger-ui .opblock .opblock-section-header h4 { color: var(--text); font-family: var(--font); font-size: 15px; font-weight: 600; }
.swagger-ui hr { border-color: var(--line); }
.swagger-ui table thead tr th, .swagger-ui table thead tr td { border-bottom: 1px solid var(--line); font-size: 13px; }
.swagger-ui svg:not(:root) { fill: currentColor; }
.swagger-ui .arrow, .swagger-ui .expand-operation svg, .swagger-ui .opblock-control-arrow svg, .swagger-ui .expand-methods svg { fill: var(--text-2); }
.swagger-ui .authorization__btn svg, .swagger-ui .authorization__btn.locked svg { fill: var(--text-2); }

/* Superfícies */
.swagger-ui .scheme-container { padding: 12px 0; background: transparent; box-shadow: none; }
.swagger-ui .filter-container { margin: 0 0 8px; }
.swagger-ui .filter .operation-filter-input, .swagger-ui input[type=text], .swagger-ui input[type=password], .swagger-ui input[type=search], .swagger-ui input[type=email], .swagger-ui input[type=file], .swagger-ui textarea, .swagger-ui select {
    background: var(--surface);
    color: var(--text);
    border: 1px solid var(--line);
    border-radius: 10px;
    box-shadow: none;
    font-family: var(--font);
}
.swagger-ui .filter .operation-filter-input { border: 1px solid var(--line); }
.swagger-ui input::placeholder, .swagger-ui textarea::placeholder { color: var(--text-2); opacity: 1; }
.swagger-ui textarea, .swagger-ui .body-param__text { font-family: var(--mono); }
.swagger-ui select option { background: var(--surface); color: var(--text); }
.swagger-ui .opblock-tag { color: var(--text); font-family: var(--font); font-size: 20px; font-weight: 700; letter-spacing: -.015em; border-bottom: .5px solid var(--line); text-transform: capitalize; }
.swagger-ui .opblock-tag small { color: var(--text-2); font-family: var(--font); font-size: 14px; font-weight: 400; letter-spacing: 0; }
.swagger-ui .opblock-tag:hover { background: var(--surface-2); }
.swagger-ui .opblock-tag-section { margin-bottom: 8px; }
.swagger-ui .opblock { background: var(--surface); border: 0; border-radius: 12px; box-shadow: none; margin: 0 0 8px; overflow: hidden; }
.swagger-ui .opblock.opblock-get, .swagger-ui .opblock.opblock-post, .swagger-ui .opblock.opblock-put, .swagger-ui .opblock.opblock-delete, .swagger-ui .opblock.opblock-patch, .swagger-ui .opblock.opblock-head, .swagger-ui .opblock.opblock-options { background: var(--surface); border: 0; }
.swagger-ui .opblock-body, .swagger-ui .responses-wrapper, .swagger-ui .responses-inner, .swagger-ui .parameters-container, .swagger-ui .table-container { background: transparent; }
.swagger-ui .response-control-media-type--accept-controller select, .swagger-ui .response-control-media-type__title { opacity: 1; }
.swagger-ui .opblock .opblock-summary { border: 0; }
.swagger-ui .opblock.is-open .opblock-summary { border-bottom: .5px solid var(--line); }
.swagger-ui .opblock .opblock-section-header { background: var(--surface-2); box-shadow: none; }
.swagger-ui .opblock .opblock-summary-path, .swagger-ui .opblock .opblock-summary-path a, .swagger-ui .opblock .opblock-summary-path__deprecated { color: var(--text); font-family: var(--mono); font-size: 14px; font-weight: 500; }
.swagger-ui .opblock .opblock-summary-description { color: var(--text-2); font-family: var(--font); font-size: 14px; }
.swagger-ui .opblock .opblock-summary-method { border-radius: 7px; font-family: var(--mono); font-size: 12px; min-width: 72px; text-shadow: none; }
.swagger-ui .opblock.opblock-get .opblock-summary-method { background: var(--get-bg); color: var(--get); }
.swagger-ui .opblock.opblock-post .opblock-summary-method { background: var(--post-bg); color: var(--post); }
.swagger-ui .opblock.opblock-put .opblock-summary-method { background: var(--put-bg); color: var(--put); }
.swagger-ui .opblock.opblock-delete .opblock-summary-method { background: var(--delete-bg); color: var(--delete); }
.swagger-ui .opblock.opblock-patch .opblock-summary-method { background: var(--patch-bg); color: var(--patch); }
.swagger-ui .opblock.opblock-get .opblock-summary-path, .swagger-ui .opblock.opblock-post .opblock-summary-path, .swagger-ui .opblock.opblock-put .opblock-summary-path, .swagger-ui .opblock.opblock-delete .opblock-summary-path, .swagger-ui .opblock.opblock-patch .opblock-summary-path { border: 0; }
.swagger-ui section.models, .swagger-ui section.models.is-open { background: var(--surface); border: 0; border-radius: 12px; }
.swagger-ui section.models h4, .swagger-ui section.models h4 span { color: var(--text); font-family: var(--font); }
.swagger-ui section.models .model-container, .swagger-ui .model-box { background: var(--surface-2); }
.swagger-ui .model .property.primitive, .swagger-ui .model-toggle::after { color: var(--text-2); }
.swagger-ui .tab li button.tablinks { background: none; }
.swagger-ui .responses-table .response, .swagger-ui .parameters-col_name, .swagger-ui .parameters-col_description { border-color: var(--line); }

/* Código */
.swagger-ui .highlight-code, .swagger-ui .microlight, .swagger-ui .opblock-body pre.microlight, .swagger-ui .curl-command pre, .swagger-ui .example, .swagger-ui .opblock-body pre { background: var(--code-bg) !important; color: var(--code-text) !important; border-radius: 10px; font-family: var(--mono); }
.swagger-ui .microlight span, .swagger-ui .opblock-body pre span { font-family: var(--mono); }
.swagger-ui code, .swagger-ui .renderedMarkdown code { background: var(--surface-2); color: var(--text); border-radius: 5px; font-family: var(--mono); }

/* Botões */
.swagger-ui .btn { background: var(--surface-2); color: var(--text); border: 0; border-radius: 999px; box-shadow: none; font-family: var(--font); font-weight: 600; }
.swagger-ui .btn:hover { box-shadow: none; opacity: .85; }
.swagger-ui .btn.authorize { background: transparent; color: var(--link); border: 1px solid var(--link); }
.swagger-ui .btn.authorize svg { fill: var(--link); }
.swagger-ui .btn.execute, .swagger-ui .btn.authorize.modal-btn-auth { background: var(--tint); color: var(--on-tint); border: 0; }
.swagger-ui .btn.cancel { background: var(--delete-bg); color: var(--delete); }
.swagger-ui .copy-to-clipboard { background: var(--surface-2); }
.swagger-ui .copy-to-clipboard button { background-color: transparent; }

/* Janela de autorização */
.swagger-ui .dialog-ux .backdrop-ux { background: rgba(0, 0, 0, .4); }
.swagger-ui .dialog-ux .modal-ux { background: var(--surface); color: var(--text); border: 0; border-radius: 16px; box-shadow: 0 10px 40px rgba(0, 0, 0, .3); }
.swagger-ui .dialog-ux .modal-ux-header { border-bottom: .5px solid var(--line); }
.swagger-ui .dialog-ux .modal-ux-header h3, .swagger-ui .dialog-ux .modal-ux-content p, .swagger-ui .dialog-ux .modal-ux-content h4, .swagger-ui .dialog-ux .modal-ux-content h6, .swagger-ui .auth-container h4, .swagger-ui .auth-container p { color: var(--text); font-family: var(--font); }
.swagger-ui .dialog-ux .modal-ux-header .close-modal svg { fill: var(--text); }

@media (max-width: 860px) {
    .wago-head { padding: 8px 12px; }
    .wago-head nav { gap: 10px; font-size: 13px; }
    .swagger-ui .wrapper { padding-inline: 12px; }
    .swagger-ui .opblock .opblock-summary { flex-wrap: wrap; }
    .swagger-ui .opblock .opblock-summary-path { max-width: 100%; word-break: break-all; }
    .swagger-ui .opblock .opblock-summary-description { flex-basis: 100%; }
}
