/*
    These rules were extracted from the Swagger UI HTML that's included in the
    Swashbuckle.AspNetCore NuGet package (v6.6.2). Authorship belongs to the
    maintainers of the Swashbuckle project.
*/

html {
    box-sizing: border-box;
    overflow: -moz-scrollbars-vertical;
    overflow-y: scroll;
}

*, *:before, *:after {
    box-sizing: inherit;
}

body {
    margin: 0;
    background: #fafafa;
}

/* The rules below this line are authored by us. */

.a2b-head {
    margin: 15px 50px 35px 50px;
    display: flex;
    flex-direction: row;
    align-items: center;
}

@media screen and (width < 750px) {
    .a2b-head {
        margin-left: 10px;
        margin-right: 15px;
    }
}

#a2b-logo {
    max-height: 85px;
    margin-left: 10px;
    flex: 0 0 auto;
}

.a2b-head h1 {
    text-align: right;
    flex: 1 1 auto;
}

.left-right-margin {
    margin-left: 40px;
    margin-right: 40px;
}

.big-bottom-margin {
    margin-bottom: 40px;
}

.scheme-container {
    text-align: center;
}

#input-api-key {
    font-family: Consolas, monospace;
    font-size: 11pt;
    width: 100%;
    min-width: 210px;
    max-width: 420px;
    margin-left: 7px;
}

.a2b-table-wrapper {
    display: flex;
    justify-content: center;
}

.a2b-table {
}

.a2b-table th, .a2b-table td {
    padding: 4px 8px !important;
}

#a2b-error-codes {
    max-width: 950px;
}

#loadline-zones {
    max-width: 900px;
}

#routing-points {
    max-width: 500px;
}

#routing-point-groups {
    max-width: 650px;
}

/* CSS rules that override the ones provided as Swagger's defaults */

/*
    The OpenAPI JSON document doesn't accurately reflect the API, because it
    omits some things (for example, our custom headers) that are mentioned in
    the Swagger UI - we manipulate the data from the JSON document in order to
    arrive at what's displayed on the Swagger page. Since the JSON document
    isn't accurate, I don't want to display links to it.
*/
.swagger-ui div.info a {
    /* In the header for the Swagger content */
    display: none !important;
}
table.model td span.model span.model-hint {
    /* Tooltips in the expandable schema */
    display: none !important;
}

/*
    I don't want to see the version selector drop-down, because at the moment
    we only have one version that can be selected ("v1").
*/
form.download-url-wrapper {
    display: none !important;
}

/* I don't want to see the "cancel" buttons. */
button.try-out__btn.cancel {
    display: none !important;
}

/*
    In the version of Swashbuckle/Swagger we were using in the old
    (.NET Framework 4.8) WebService, it was possible to use inline CSS to style
    runs of text. In this newer version, you can't do that - all attributes are
    removed from HTML elements. It was probably a security risk or something.
    But the elements themselves are still present, and so we can still style
    spans within paragraphs; although not per-instance, or not so easily.
*/
table.parameters td.parameters-col_description > div.renderedMarkdown > p > span {
    font-size: 90% !important;
    font-style: italic !important;
}

.opblock-body .execute-wrapper {
    text-align: center !important;
    padding: 8px 0px 20px 0px !important;
}

.opblock-body .btn-group {
    display: block !important;
    text-align: center !important;
    padding: 8px 0px 20px 0px !important;
}

.btn.opblock-control__btn {
    width: 100px !important;
    margin: 0px 4px !important;
    padding: 8px !important;
}

/*
    We don't have any links to display, so don't show the column.
    (I don't even know what kind of links the column is supposed
    to show, or what you would do to cause them to appear.)
*/
tr.responses-header td.response-col_links, tr.response td.response-col_links {
    display: none !important;
}

tr.response div.model-example {
    margin-top: 7px !important;
}

tr.response div.model-example ul.tab {
    margin-top: 0px !important;
    margin-bottom: 7px !important;
}

/*
    If you don't specify this, then when you select the "Schema"
    tab, the rule below causes the box to only be wide enough to
    fit its contents. This looks a bit silly, especially when
    you switch between tabs, or open and close tree items on the
    "Schema" tab.
*/
tr.response div.model-example .model-box {
    width: 100% !important;
}

/*
    If you don't hide this, then when you switch to the "Schema"
    tab for any response, for certain data types you will see a
    listing of the example value for that data type.

    That might sound harmless, but the presentation of the
    example value is peculiar: it is in the form of
    un-pretty-printed JSON, except that every object is preceded
    by the bare word "OrderedMap" (without quotes).

    I have no idea why it behaves like that, but it's not useful,
    so I'm hiding it. If the user wants to see the example value,
    then the default tab ("Example Value") already shows it to
    them!
*/
tr.response div.model-example .model-box span.property {
    display: none !important;
}

div.headers-wrapper h4.headers__title {
    margin-top: 11px !important;
}

table.headers {
    margin-bottom: 18px !important;
}

table.headers td:first-child {
    width: 215px !important;
}

table.headers td:last-child {
    width: 100px !important;
}

table.responses-table tr:last-child table.headers {
    margin-bottom: 3px !important;
}

table.headers th.header-col {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
}

table.headers td.header-col {
    padding-top: 5px !important;
    padding-bottom: 0px !important;
}

table.model td:first-child, table.model tr.description td:last-child {
    padding-top: 9px !important;
}

table.model td:first-child, table.model tr.description td:last-child p,
table.model span.model .renderedMarkdown p {
    margin-bottom: 3px !important;
}