@import url('https://fonts.cdnfonts.com/css/poppins');
/**
 * Any CSS included here will be global. The classic template
 * bundles Infima by default. Infima is a CSS framework designed to
 * work well for content-centric websites.
 */
@tailwind base;
@tailwind components;
@tailwind utilities;

/* You can override the default Infima variables here. */

:root {
  --ifm-color-primary: #25282d;
  --ifm-color-primary-dark: #212429;
  --ifm-color-primary-darker: #1f2226;
  --ifm-color-primary-darkest: #1a1c1f;
  --ifm-color-primary-light: #292c32;
  --ifm-color-primary-lighter: #2b2e34;
  --ifm-color-primary-lightest: #30343b;
  --ifm-code-font-size: 90%;
  --ifm-font-family-base: 'Poppins';
  --ifm-font-size-base: 105%;
  --ifm-navbar-padding-horizontal: 0.5em;
}

[data-theme='dark'] {
  --ifm-color-primary: #FFFFFF;
  --ifm-color-primary-dark: #e6e6e6;
  --ifm-color-primary-darker: #d9d9d9;
  --ifm-color-primary-darkest: #b3b3b3;
  --ifm-color-primary-light: #ffffff;
  --ifm-color-primary-lighter: #ffffff;
  --ifm-color-primary-lightest: #ffffff;
  background-color: #141419;
}

/* text adjustments */

a {
  color: #FF6C3E;
}

.docusaurus-highlight-code-line {
  background-color: rgba(0, 0, 0, 0.1);
  display: block;
  margin: 0 calc(-1 * var(--ifm-pre-padding));
  padding: 0 var(--ifm-pre-padding);
}

/* badge adjustments */

.theme-doc-version-badge {
  margin-top: 1rem;
  margin-bottom: 1rem;
  background-color: white;
  padding-right: 1.5rem;
  padding-left: 1.5rem;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  letter-spacing: 0.01094rem;
  border-color: #25282d;
}

html[data-theme='dark'] .theme-doc-version-badge {
  background-color: #141419;
  color: white;
  border-color: white;
}

html[data-theme='dark'] .docusaurus-highlight-code-line {
  background-color: rgba(0, 0, 0, 0.3);
}

/* navbar adjustments */

.navbar {
  border-bottom-style: solid;
  border-bottom-width: 2px;
  border-color: rgba(52, 56, 62, 0.3);
}

@media screen and (max-width: 996px) {
  .navbar {
    padding-inline: 1rem;
  }
}

html[data-theme='dark'] .navbar {
  background-color: #141419;
  border-color: rgba(52, 56, 62, 1);
}

.navbar__logo {
  height: 2.3em;
  width: auto;
}

/* footer adjustments */

.footer {
  border-top-style: solid;
  border-top-width: 2px;
  border-color: rgba(52, 56, 62, 0.3);
  padding: 2rem 6rem 1rem 6rem;
  color: #141419;
  background-color: #fff;
}

html[data-theme='dark'] .footer {
  background-color: #141419;
  color: #fff;
}

:root .footer__col {
  text-align: center;
}

.footer__link {
  color: #141419 !important;
}

html[data-theme='dark'] .footer__link {
    color: #DDDDDD !important;
}

html[data-theme='dark'] .footer__svg {
  fill: #DDDDDD;
}

html[data-theme='dark'] .footer {
  border-color: rgba(52, 56, 62, 1);
}

html[data-theme='dark'] .footer__copyright {
  color: rgba(135, 135, 135, 1);
}

/* table of contents adjustments */
.table-of-contents__link {
  font-size: 120%;
}

/* tabs of 03-running-a-full-node 01-overview */
:root .tabs-container {
  border-radius: 5px;
  border-top: 1px solid var(--ifm-color-primary);
  border-bottom: 1px solid var(--ifm-color-primary);
  border-left: 1px solid var(--ifm-color-primary);
  border-right: 1px solid var(--ifm-color-primary);
}

:root .tabs li {
  border-bottom-width: 1px;
}

div[role='tabpanel'] {
  padding: 10px;
}

/* menu adjustments */
.menu {
  border-right-style: solid;
  border-right-width: 2px;
  border-color: rgba(52, 56, 62, 0.3);
}

.menu__list .menu__list {
  margin-top: 0!important;
}

/** In mobile view, reduce the padding */
@media screen and (min-width: 997px) {
  .menu {
    padding: 0!important;
  }
}

html[data-theme='dark'] .menu {
  border-color: rgba(52, 56, 62, 1);
}

.menu__link--active {
  border-left-style: solid;
  border-left-width: 0.25rem;
  border-left-color: #FF6C3E;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.menu .menu__link.menu__link--sublist:after {
  color: #1a1c1f;
}

html[data-theme='dark'] .navbar-sidebar {
  background-color: #141419;
}


.button.button--secondary {
  border-right-style: solid;
  border-right-width: 2px;
  border-bottom-width: 0;
  border-top-width: 0;
  border-color: rgba(52, 56, 62, 0.3);
}

html[data-theme='dark'] .button.button--secondary {
  border-color: rgba(52, 56, 62, 1);
}
