@font-face {
  font-family: "AdineuePRO";
  src: url("./fonts/adineue-PRO.woff2") format("woff2");
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: "AdineuePROBold";
  src: url("./fonts/adineue-PRO-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
}

:root {
  --accent: #ffa400;
  --warning: #ff0000;
  --success: #11a43a;
  --success-light: #cfedd7;
  --white: #fff;
  --black: #000;
  --popup-bg: rgba(0, 0, 0, 0.5);
  /* Blue shades */
  --dark-blue: #1b3f99;
  --blue: #0022c6;
  --cib-blue: #1858a8;
  --mobily-blue: #01baeb;
  --opacity-blue: rgba(0, 34, 198, 0.4);
  --light-blue: #32adff;
  --lighter-blue: #dfeaff;
  /* Gray shades */
  --darker-grey: #232f3e;
  --dark-grey: #767676;
  --light-grey: #c2c0c0;

  interpolate-size: allow-keywords;
}

/* ensure html/body fill the viewport */
html,
body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  font-family: "AdineuePRO";
}

@media (prefers-color-scheme: dark) {
  [data-theme="auto"] * {
    color: var(--lighter-blue);
  }

  [data-theme="auto"] .sidebar-tree li a {
    color: var(--lighter-blue) !important;
  }

  [data-theme="auto"] table td:first-of-type * {
    color: var(--darker-grey) !important;
  }

  [data-theme="auto"] .toc-tree a.reference,
  [data-theme="auto"] .toc-tree a.reference strong {
    color: var(--light-grey) !important;
  }

  [data-theme="auto"] :target > h1:first-of-type,
  [data-theme="auto"] :target > h2:first-of-type,
  [data-theme="auto"] :target > h3:first-of-type,
  [data-theme="auto"] :target > h4:first-of-type,
  [data-theme="auto"] :target > h5:first-of-type,
  [data-theme="auto"] :target > h6:first-of-type,
  [data-theme="auto"] span:target ~ h1:first-of-type,
  [data-theme="auto"] span:target ~ h2:first-of-type,
  [data-theme="auto"] span:target ~ h3:first-of-type,
  [data-theme="auto"] span:target ~ h4:first-of-type,
  [data-theme="auto"] span:target ~ h5:first-of-type,
  [data-theme="auto"] span:target ~ h6:first-of-type {
    background-color: var(--blue);
  }

  [data-theme="auto"] h1,
  [data-theme="auto"] h2,
  [data-theme="auto"] h3,
  [data-theme="auto"] h4,
  [data-theme="auto"] h5,
  [data-theme="auto"] h6,
  [data-theme="auto"] b,
  [data-theme="auto"] strong {
    color: var(--lighter-blue);
  }
}

@media (prefers-color-scheme: light) {
  [data-theme="auto"] * {
    color: var(--darker-grey);
  }

  [data-theme="auto"] .sidebar-tree li a {
    color: var(--blue) !important;
  }

  [data-theme="auto"] .toc-tree a.reference,
  [data-theme="auto"] .toc-tree a.reference strong {
    color: var(--dark-grey) !important;
  }

  [data-theme="auto"] :target > h1:first-of-type,
  [data-theme="auto"] :target > h2:first-of-type,
  [data-theme="auto"] :target > h3:first-of-type,
  [data-theme="auto"] :target > h4:first-of-type,
  [data-theme="auto"] :target > h5:first-of-type,
  [data-theme="auto"] :target > h6:first-of-type,
  [data-theme="auto"] span:target ~ h1:first-of-type,
  [data-theme="auto"] span:target ~ h2:first-of-type,
  [data-theme="auto"] span:target ~ h3:first-of-type,
  [data-theme="auto"] span:target ~ h4:first-of-type,
  [data-theme="auto"] span:target ~ h5:first-of-type,
  [data-theme="auto"] span:target ~ h6:first-of-type {
    background-color: var(--lighter-blue);
  }

  [data-theme="auto"] h1,
  [data-theme="auto"] h2,
  [data-theme="auto"] h3,
  [data-theme="auto"] h4,
  [data-theme="auto"] h5,
  [data-theme="auto"] h6,
  [data-theme="auto"] b,
  [data-theme="auto"] strong {
    color: var(--blue);
  }
}

[data-theme="light"] * {
  color: var(--darker-grey);
}

[data-theme="dark"] * {
  color: var(--lighter-blue);
}

* {
  font-family: "AdineuePRO";
}

h1,
h2,
h3,
h4,
h5,
h6,
b,
strong {
  font-family: "AdineuePROBold" !important;
}

[data-theme="light"] h1,
[data-theme="light"] h2,
[data-theme="light"] h3,
[data-theme="light"] h4,
[data-theme="light"] h5,
[data-theme="light"] h6,
[data-theme="light"] b,
[data-theme="light"] strong {
  color: var(--blue);
}

[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3,
[data-theme="dark"] h4,
[data-theme="dark"] h5,
[data-theme="dark"] h6,
[data-theme="dark"] b,
[data-theme="dark"] strong {
  color: var(--lighter-blue) !important;
}

h2 {
  font-size: 1.5rem;
  color: var(--blue);
}

h3 {
  font-size: 1.2rem;
}

[data-theme="light"] :target > h1:first-of-type,
[data-theme="light"] :target > h2:first-of-type,
[data-theme="light"] :target > h3:first-of-type,
[data-theme="light"] :target > h4:first-of-type,
[data-theme="light"] :target > h5:first-of-type,
[data-theme="light"] :target > h6:first-of-type,
[data-theme="light"] span:target ~ h1:first-of-type,
[data-theme="light"] span:target ~ h2:first-of-type,
[data-theme="light"] span:target ~ h3:first-of-type,
[data-theme="light"] span:target ~ h4:first-of-type,
[data-theme="light"] span:target ~ h5:first-of-type,
[data-theme="light"] span:target ~ h6:first-of-type {
  background-color: var(--lighter-blue);
}

[data-theme="dark"] :target > h1:first-of-type,
[data-theme="dark"] :target > h2:first-of-type,
[data-theme="dark"] :target > h3:first-of-type,
[data-theme="dark"] :target > h4:first-of-type,
[data-theme="dark"] :target > h5:first-of-type,
[data-theme="dark"] :target > h6:first-of-type,
[data-theme="dark"] span:target ~ h1:first-of-type,
[data-theme="dark"] span:target ~ h2:first-of-type,
[data-theme="dark"] span:target ~ h3:first-of-type,
[data-theme="dark"] span:target ~ h4:first-of-type,
[data-theme="dark"] span:target ~ h5:first-of-type,
[data-theme="dark"] span:target ~ h6:first-of-type {
  background-color: var(--blue);
}

/* Sidebar */
.sidebar-search-container {
  display: none;
}

.sidebar-tree ul {
  gap: 10px;
}

.sidebar-tree li a {
  font-size: 1.25rem;
  line-height: 1.25rem !important;
}
.sidebar-tree li.toctree-l2 a {
  font-size: 1rem;
  line-height: 1rem !important;
}

[data-theme="light"] .sidebar-tree li a {
  color: var(--blue) !important;
}

[data-theme="dark"] .sidebar-tree li a {
  color: var(--lighter-blue) !important;
}

.sidebar-logo {
  margin: 2rem 0 0;
}

.sidebar-brand {
  padding-block: 0;
}

.sidebar-logo-container {
  margin-block: 0;
}

.headerlink {
  display: none;
}

/* Tables */
table {
  --color-table-border: var(--blue);
  width: 100%;
  border-radius: 8px !important;
  border: 0;
  box-shadow: 0 0.2rem 0.5rem rgba(0, 0, 0, 0.05),
    0 0 0.0625rem rgba(0, 0, 0, 0.1), 0 0 0 1px var(--color-table-border) !important;
}

table th.head {
  background-color: var(--blue);
}

table th.head:first-of-type {
  border-top-left-radius: 8px;
}

table th.head:last-of-type {
  border-top-right-radius: 8px;
}

table th.head p {
  color: var(--white) !important;
}

table tr td:first-of-type {
  background-color: var(--lighter-blue);
}

table tr td img {
  display: block;
  margin: auto;
}

table tr:last-child td:first-child {
  border-bottom-left-radius: 10px;
}

table tr:last-child td {
  border-bottom: 0;
}

[data-theme="dark"] table td:first-of-type * {
  color: var(--darker-grey) !important;
}

/* Code block */
.code-block-caption {
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}

.literal-block-wrapper .highlight-json .highlight {
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}

/* Endpoint */
.api-endpoint {
  border: 1px solid var(--success);
  border-radius: 5px;
  padding: 12px;
  display: flex;
  align-items: center;
}

.api-method-get {
  border: 1px solid var(--light-blue);
}

.api-method-post {
  border: 1px solid var(--success);
}

.api-endpoint code:first-of-type {
  background: var(--success);
  font-weight: 700;
  padding: 8px 20px;
  border-radius: 6px;
  border: 0;
  font-size: 14px;
  color: white;
}

.api-method-get code:first-of-type {
  background: var(--light-blue);
}

.api-method-post code:first-of-type {
  background: var(--success);
}

.api-endpoint code:first-of-type span {
  color: white !important;
}

.api-endpoint code:last-of-type {
  background: transparent;
  border: 0;
  font-size: 14px;
  margin-inline-start: 8px;
  word-break: break-all;
}

/* Table of content */
.toc-tree {
  font-size: 14px;
}

.toc-tree ul ul ul {
  list-style-type: disc;
}

.toc-tree a.reference,
.toc-tree a.reference strong {
  color: var(--dark-grey) !important;
}

[data-theme="dark"] .toc-tree a.reference,
[data-theme="dark"] .toc-tree a.reference strong {
  color: var(--light-grey) !important;
}

/* Response */
#success-http-200 h3,
#success-http-200 h3 * {
  color: var(--success);
}

#error-http-4xx-5xx h3,
#error-http-4xx-5xx h3 *,
#error-http-400-401 h3,
#error-http-400-401 h3 * {
  color: var(--warning);
}

/* Footer */
footer .bottom-of-page .left-details {
  height: 17px;
  overflow: hidden;
}

.reference.external {
  text-decoration: underline;
}
