/* This styling is loaded first, because of the limitations in React.
Important tags have to be commonly used, even while it is a bad practise.

This style sheet contains comments referring to where the styles apply, and comments identifying colors from Step oasis.
*/

@import url('https://fonts.googleapis.com/css?family=DM+Sans:400,500,700,900|Ubuntu:400,500,700&display=swap');

h1.ui.header, .ui.menu .item {
    color: #292B2C !important;
}

/* .oa-typography-h1 */
h1, .header {
    font-size: 36px !important;
    font-weight: 600 !important;
    line-height: 42px !important;
    letter-spacing: 0em !important;
    font-family: "DM Sans", "Lato","Helvetica Neue",Arial,Helvetica,sans-serif !important;
    color: #292B2C !important;
}

/* .oa-typography-h2 */
h3, h2 {
    font-size: 18px !important;
    font-weight: 600 !important;
    line-height: 27px !important;
    letter-spacing: 0em !important;
    font-family: "DM Sans", "Lato","Helvetica Neue",Arial,Helvetica,sans-serif !important;
    color: #292B2C !important;
}

/* .oa-typography-sm-body */
p, div {
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 21px !important;
    letter-spacing: 0.02em !important;
    font-family: "DM Sans", "Lato","Helvetica Neue",Arial,Helvetica,sans-serif !important;
    color: #292B2C;
}
a {
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 21px !important;
    letter-spacing: 0.02em !important;
    font-family: "DM Sans", "Lato","Helvetica Neue",Arial,Helvetica,sans-serif !important;
    color: #292B2C !important;
    /* text-decoration: underline !important; */
}
/* ------------------------ */
/* oa-typography-xs-body */
td, th{
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 18px !important;
    letter-spacing: 0.02em !important;
    font-family: "DM Sans", "Lato","Helvetica Neue",Arial,Helvetica,sans-serif !important;
    color: #292B2C !important;
}

/* .oa-typography-sm-button */
/* sharp button edges (border-radius)*/
button {
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 24px !important;
    letter-spacing: 0.02em !important;
    font-family: "DM Sans", "Lato","Helvetica Neue",Arial,Helvetica,sans-serif !important;
    border-radius: 12px !important;
}

.ui.inverted.menu {
    background: white !important;
}
.ui.inverted.menu .active.item {
    background: #adadad !important;
}
.ui.menu .item:hover {
    background: whitesmoke !important;
}

.ui[class*="center aligned"].segment {
    color: black !important;
    background-color: #f8f8f8 !important;
}

.ui.positive.button {
    background: #00915a !important;
}

body {
    font-family: 'DM Sans', sans-serif !important;
    min-height: 100% !important;
}

footer {
    bottom: 0 !important;
    width: 100% !important;
    height: 50px !important;
    position: relative;
    background: #F5F5F5 !important;
    padding-top: 15px !important;
}

div {
    font-family: "DM Sans", "Lato","Helvetica Neue",Arial,Helvetica,sans-serif !important;
}

.whitespace {
    margin: auto;
}

.footer_content {
    color:#000000 !important;
    letter-spacing: .65px !important;
    font-size: 12px !important;
    display: inline-block !important;
}

.flex_container {
    margin:auto !important;
    width:50% !important;
    min-height: 30px !important;
    display:flex !important;
}

#operations-default-options_devices {
    display: none !important;
}

#operations-default-options_token {
    display: none !important;
}

#root .swagger-ui .opblock.opblock-options{ display: none; }

#root {
    max-height: fit-content !important;
    min-height: 100% !important;
    /*padding-bottom: 50px !important;*/
}

.ui celled collapsing table {
    border: 1px solid black !important;
}

/* table styling */
td, th {
    padding: 0.785714em;
    text-align: inherit;
    border: 1px solid rgba(34,36,38,.15);
    overflow: hidden;
}

th {
    font-weight: 500 !important;
    background: #D3E5DD !important;
}

table {
    border-collapse: collapse;
    table-layout: fixed;
    width: 90%;
    word-wrap: break-word;
    overflow: hidden;
}

.scroll-pane {
    width:200%;
}

.ui.borderless.inverted.vertical.attached.left.visible.sidebar.menu {
    position: fixed !important;
}

/*Sidebar menu link hover*/
/*.ui.menu a.active.item.link:hover {
    text-weight: bold !important;
*/

/*link item hover (includes background)*/
#root a.active.item.link:hover {
    background: #EAEAEA !important;
    font-weight: 500 !important;
}

/* API menu background color */
#root .active.item.link {
    background: #f5f5f5 !important; /* --oa-neutral-pearl */
}

/*Whole sidebar menu hover*/
.ui.menu .active.item.link:hover {

}

#root a.active.item.link {
    color: black !important;
}

#root div.active.item.link {
    color: black !important;
}
.models.is-open {
    display: none !important;
}

.footer-bar {
    margin-top: 0 !important;
    margin-bottom: 7px !important;
    color:rgb(222,222,223) !important;
    display: none;
}


#root .ui.positive.button {
    border-radius: 12px;
    background: #5A7768 !important; /* --assetiq-cta*/
}
#root .ui.positive.button:hover {
    background : #9CBBAC !important; /* --assetiq-cta-hover */
}

.active.item.link {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
}

.divider-border {
    border-top-style: solid;
    border-color: #EAEAEA;
    border-width: 1px;
}

/* pre and code style, Ivory on Neutral black */
code {
    color: #f7f2e7;
}
pre {
    background: #292b2c;
    border-radius: 3px;
    padding: 8px;
    border: black;
    width: fit-content;
}

/* GET-block */
.swagger-ui .opblock.opblock-get {
    border-color: #2F6BA3 !important;
}
.opblock-summary.opblock-summary-get{
    background: rgba(0, 122, 201, 0.03) !important;
}
.swagger-ui .opblock.opblock-get .opblock-summary-method {
    background: #2F6BA3 !important;
}

/* PUT-block */
.swagger-ui .opblock.opblock-put {
    border-color: #D9822B !important;
}
.opblock-summary.opblock-summary-put{
    background: rgba(232, 130, 0, 0.03) !important;
}
.swagger-ui .opblock.opblock-put .opblock-summary-method {
    background: #D9822B !important;
}

/* POST-block */
.swagger-ui .opblock.opblock-post {
    border-color: #2B9C7F !important;
}
.opblock-summary.opblock-summary-post{
    background: rgba(0, 145, 90, 0.03) !important;
}
.swagger-ui .opblock.opblock-post .opblock-summary-method {
    background: #2B9C7F !important;
}

[label="Import"] {
    margin-left: 50px !important;
}
[label="Export"] {
    margin-left: 50px !important;
}
[label="Postman"] {
    margin-left: 50px !important;
}
[label="SoapUI"] {
    margin-left: 50px !important;
}
[label="Curl"] {
    margin-left: 50px !important;
}

[label="Documentation"] {
    background: #f5f5f5 !important; /* --oa-neutral-pearl */
}
.ui.mini.image {
    width:100px !important;
}

.ui[class*="center aligned"].segment {
    background-color:#F5F5F5 !important;
}

@media only screen and (min-width: 1200px) {
    .ui.container {
        width: 89% !important;
        max-width: 1366px !important; /* This might not work at all */
    }
}

.info-box{
    border-style:solid;
    border-color:#2F6BA3;
    border-width:2px;
    border-radius:8px;
    padding:8px;
    background:white;
}

/* .info-text {
    display: inline-block;
} */

.info-icon {
    float: left;
    margin-top: 4px;
}

.info-box-inline {
    display: inline-block;
}

.warning-box {
    border-style:solid;
    border-color:#D9822B;
    border-width:2px;
    border-radius:8px;
    padding:8px;
    background:white;
}
.warning-icon {
    float: left;
    margin-top: 4px;
}

.alert-box {
    border-style:solid;
    border-color:#B33A3A;
    border-width:2px;
    border-radius:8px;
    padding:8px;
    background:white;
}
.alert-icon {
    float: left;
    margin-top: 4px;
}

.grid {
    display: grid;
    grid-template-columns: 60% 40%;
}

.box-inline-header {
    display: inline-block;
}

.div-115 {
    width: 115% !important;
}

.table-disable-fixed {
    table-layout: auto !important;
}

/* This block is done elsewhere already, but we are redoing it to enforce styling */
.swagger-ui .download-contents {
    position: absolute;
    bottom: 10px;
    right: 10px;
    cursor: pointer;
    background: #747575 !important; /* --oa-neutral-codex */
    text-align: center;
    padding: 5px;
    border-radius: 4px;
    font-family: sans-serif;
    font-weight: 600;
    color: #fff;
    font-size: 14px;
    height: 30px;
    width: 85px !important;
}

.parameters {
    table-layout: auto !important;
}

.wrapper code {
    color: black !important;
}

.div-115 table {
    table-layout: auto !important;
}

.scroll-pane table {
    table-layout: auto !important;
}