/*
 * Swagger UI in the Soul design system, for the rendered documentation.
 *
 * Every value is a token of soul.css, so both colour modes follow the page.
 * The ID outweighs the classes of swagger-ui.css without `!important`.
 */

#swagger-ui {
    --swagger-get: var(--text-link);
    --swagger-get-ground: var(--surface-accent-quiet);
    --swagger-get-line: var(--border-accent-quiet);
    --swagger-write: var(--status-ok);
    --swagger-write-ground: var(--surface-ok-quiet);
    --swagger-change: var(--status-warn);
    --swagger-change-ground: var(--surface-warn-quiet);
    --swagger-delete: var(--status-error);
    --swagger-delete-ground: var(--surface-error-quiet);
    --swagger-delete-line: var(--border-error-quiet);

    color: var(--text-primary);
    font-family: var(--font-sans);
}

#swagger-ui .swagger-ui {
    color: inherit;
    font-family: inherit;
}

#swagger-ui .swagger-ui * {
    border-color: var(--border-subtle);
    color: inherit;
    font-family: inherit;
}

#swagger-ui .swagger-ui svg {
    fill: currentColor;
}

#swagger-ui :is(code, pre, .opblock-summary-path, .opblock-summary-path *, .opblock-summary-method,
.parameter__type, .parameter__in, .prop-type, .prop-format, .model, .model *, .response-col_status,
.json-schema-2020-12__attribute, .json-schema-2020-12-keyword, .json-schema-2020-12-keyword *) {
    font-family: var(--font-mono);
}

/* The page: the band already gives the width */
#swagger-ui .swagger-ui .wrapper {
    max-width: none;
    padding: 0;
}

#swagger-ui .swagger-ui :is(a, a *) {
    color: var(--text-link);
}

/* Not every anchor of Swagger UI reads as a link: tags and paths are headings */
#swagger-ui .swagger-ui :is(.opblock-tag a, .opblock-tag a *, .opblock-summary-path a, .opblock-summary-path a *) {
    color: var(--text-primary);
}

/* Title of the document, the page has its own heading */
#swagger-ui .swagger-ui .information-container .info {
    margin: var(--space-6) 0;
}

#swagger-ui .swagger-ui .info .title {
    font-size: var(--font-size-h3);
}

#swagger-ui .swagger-ui .info .title small {
    background: var(--surface-inset);
    border-radius: var(--radius-pill);
    position: static;
    vertical-align: middle;
}

#swagger-ui .swagger-ui .info .title small pre {
    background: none;
    color: var(--text-secondary);
}

#swagger-ui .swagger-ui .info .title small.version-stamp {
    background: var(--surface-ok-quiet);
}

#swagger-ui .swagger-ui .info .title small.version-stamp pre {
    color: var(--status-ok);
}

/* Server selection */
#swagger-ui .swagger-ui .scheme-container {
    background: var(--surface-sunken);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-card);
    box-shadow: none;
    margin: 0 0 var(--space-6);
    padding: var(--space-4) 0;
}

#swagger-ui .swagger-ui .scheme-container .schemes {
    padding: 0 var(--space-4);
}

/* Form controls and buttons */
#swagger-ui .swagger-ui :is(select, input, textarea) {
    background-color: var(--surface-raised);
    border: 1px solid var(--border-strong);
    border-radius: var(--radius-control);
    box-shadow: none;
    color: var(--text-primary);
}

#swagger-ui .swagger-ui select {
    appearance: auto;
    background-image: none;
    padding-right: var(--space-2);
}

#swagger-ui .swagger-ui .btn {
    background: var(--surface-raised);
    border: 1px solid var(--border-strong);
    border-radius: var(--radius-control);
    box-shadow: none;
    color: var(--text-primary);
}

#swagger-ui .swagger-ui .btn:hover {
    border-color: var(--accent);
}

#swagger-ui .swagger-ui .btn.authorize {
    background: var(--accent);
    border-color: var(--accent);
    color: var(--text-on-accent);
}

#swagger-ui .swagger-ui .btn.authorize :is(span, svg) {
    color: var(--text-on-accent);
    fill: var(--text-on-accent);
}

#swagger-ui .swagger-ui .btn.authorize:hover {
    background: var(--accent-hover);
    border-color: var(--accent-hover);
}

#swagger-ui .swagger-ui :is(button, a, select, input, textarea, summary):focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 2px;
}

/* Tags */
#swagger-ui .swagger-ui .opblock-tag {
    border-bottom: 1px solid var(--border-subtle);
    color: var(--text-primary);
    font-size: var(--font-size-h3);
    font-weight: 600;
}

#swagger-ui .swagger-ui .opblock-tag:hover {
    background: var(--surface-sunken);
}

#swagger-ui .swagger-ui .opblock-tag small {
    color: var(--text-secondary);
    font-size: var(--font-size-small);
    font-weight: 400;
}

/* Operations */
#swagger-ui .swagger-ui .opblock {
    background: var(--surface-raised);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-card);
    box-shadow: none;
    margin-bottom: var(--space-2);
}

#swagger-ui .swagger-ui .opblock .opblock-summary {
    border: 0;
    padding: var(--space-2);
}

#swagger-ui .swagger-ui .opblock.is-open .opblock-summary {
    border-bottom: 1px solid var(--border-subtle);
}

#swagger-ui .swagger-ui .opblock .opblock-summary:hover {
    background: var(--surface-sunken);
}

#swagger-ui .swagger-ui .opblock-summary-method {
    border-radius: var(--radius-control);
    font-size: var(--font-size-small);
    text-shadow: none;
}

#swagger-ui .swagger-ui .opblock.opblock-get .opblock-summary-method {
    background: var(--swagger-get-ground);
    box-shadow: inset 0 0 0 1px var(--swagger-get-line);
    color: var(--swagger-get);
}

#swagger-ui .swagger-ui .opblock:is(.opblock-post) .opblock-summary-method {
    background: var(--swagger-write-ground);
    box-shadow: inset 0 0 0 1px var(--swagger-write);
    color: var(--swagger-write);
}

#swagger-ui .swagger-ui .opblock:is(.opblock-put, .opblock-patch) .opblock-summary-method {
    background: var(--swagger-change-ground);
    box-shadow: inset 0 0 0 1px var(--swagger-change);
    color: var(--swagger-change);
}

#swagger-ui .swagger-ui .opblock.opblock-delete .opblock-summary-method {
    background: var(--swagger-delete-ground);
    box-shadow: inset 0 0 0 1px var(--swagger-delete-line);
    color: var(--swagger-delete);
}

#swagger-ui .swagger-ui .opblock .opblock-summary-description {
    color: var(--text-secondary);
}

#swagger-ui .swagger-ui .opblock .opblock-section-header {
    background: var(--surface-sunken);
    box-shadow: none;
}

#swagger-ui .swagger-ui .opblock-description-wrapper,
#swagger-ui .swagger-ui .opblock-external-docs-wrapper,
#swagger-ui .swagger-ui .opblock-title_normal {
    color: var(--text-secondary);
}

/* Parameters and responses */
#swagger-ui .swagger-ui table thead tr :is(td, th) {
    border-bottom: 1px solid var(--border-strong);
    color: var(--text-muted);
}

#swagger-ui .swagger-ui .parameter__name.required::after,
#swagger-ui .swagger-ui .parameter__name.required span {
    color: var(--status-error);
}

#swagger-ui .swagger-ui :is(.parameter__type, .parameter__in, .prop-format) {
    color: var(--text-muted);
}

#swagger-ui .swagger-ui .prop-type {
    color: var(--syntax-key);
}

#swagger-ui .swagger-ui .tab li:first-of-type::after {
    background: var(--border-subtle);
}

#swagger-ui .swagger-ui .opblock-tabs .tab-item.active h4 span::after,
#swagger-ui .swagger-ui .tab-header .tab-item.active h4 span::after {
    background: var(--accent);
}

#swagger-ui .swagger-ui .tab li button.tablinks {
    background: none;
    color: var(--text-secondary);
}

#swagger-ui .swagger-ui .tab li.active button.tablinks {
    color: var(--text-primary);
}

/* Code */
#swagger-ui .swagger-ui :is(.highlight-code, .highlight-code pre, .microlight, .example, pre.example, .curl-command .curl) {
    background: var(--surface-sunken);
    color: var(--syntax-text);
}

#swagger-ui .swagger-ui .highlight-code pre {
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-control);
}

#swagger-ui .swagger-ui .copy-to-clipboard {
    background: var(--surface-inset);
    border-radius: var(--radius-control);
}

#swagger-ui .swagger-ui .markdown code,
#swagger-ui .swagger-ui .renderedMarkdown code {
    background: var(--surface-inset);
    border-radius: var(--radius-control);
    color: var(--text-primary);
}

/* Schemas */
#swagger-ui .swagger-ui section.models {
    background: var(--surface-raised);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-card);
}

#swagger-ui .swagger-ui section.models.is-open h4 {
    border-bottom: 1px solid var(--border-subtle);
}

#swagger-ui .swagger-ui section.models .model-container {
    background: var(--surface-sunken);
    border-radius: var(--radius-control);
}

#swagger-ui .swagger-ui section.models .model-container:hover {
    background: var(--surface-inset);
}

#swagger-ui .swagger-ui .model-box {
    background: none;
}

#swagger-ui .swagger-ui :is(.json-schema-2020-12-accordion, .json-schema-2020-12-expand-deep-button) {
    background: none;
}

#swagger-ui .swagger-ui :is(.json-schema-2020-12-accordion, .json-schema-2020-12-accordion__children, .json-schema-2020-12__title) {
    max-width: 100%;
    min-width: 0;
    overflow-wrap: anywhere;
    white-space: normal;
}

#swagger-ui .swagger-ui .json-schema-2020-12-expand-deep-button {
    color: var(--text-link);
}

/* The authorization dialog */
#swagger-ui .swagger-ui .dialog-ux .backdrop-ux {
    background: var(--surface-overlay);
}

#swagger-ui .swagger-ui .dialog-ux .modal-ux {
    background: var(--surface-raised);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-card);
    box-shadow: var(--shadow-dialog);
}

#swagger-ui .swagger-ui .dialog-ux .modal-ux-header {
    border-bottom: 1px solid var(--border-subtle);
}

/* Messages */
#swagger-ui .swagger-ui .errors-wrapper {
    background: var(--surface-error-quiet);
    border: 1px solid var(--border-error-quiet);
    border-radius: var(--radius-card);
}

#swagger-ui .swagger-ui .loading-container .loading::after {
    color: var(--text-muted);
}

#swagger-ui .swagger-ui .loading-container .loading::before {
    border-color: var(--border-subtle);
    border-top-color: var(--accent);
}
