@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Fira+Code:wght@300;400;500;600;700&display=swap');

@tailwind base;
@tailwind components;
@tailwind utilities;

html {
  scroll-behavior: smooth;
  scrollbar-gutter: stable;
}

/* You can override the default Infima variables here. */
/* Pick the relevant colors here: https://docusaurus.io/docs/styling-layout#styling-your-site-with-infima */
:root {
  --ifm-color-primary-lightest: #2c85dd;
  --ifm-color-primary-lighter: #2075ca;
  --ifm-color-primary-light: #1f70c2;
  --ifm-color-primary: #1c66b0;
  --ifm-color-primary-dark: #195c9e;
  --ifm-color-primary-darker: #185796;
  --ifm-color-primary-darkest: #14477b;
  --ifm-link-color: #2e7a99;
  --table-header-color: #f3f4f6;

  --ifm-toc-link-color: #94a3b8;

  --ifm-menu-color: #6b7280;
  --ifm-menu-color-background-active: #e7fdfd;

  --plum-color: #ba0d49;

  --hr-color: #e8f0f7;
  --feedback-yes-color: #2c85dd;
  --feedback-no-color: var(--plum-color);

  --footer-background-color: #fafafa;

  --ifm-line-height-base: 1.75;
  --ifm-font-family-base: 'Inter', sans-serif;
}

/* dark theme variables */
html[data-theme='dark'] {
  --ifm-color-primary-lightest: #ffffff;
  --ifm-color-primary-lighter: #c5e2ff;
  --ifm-color-primary-light: #b1d8ff;
  --ifm-color-primary: #8ac4ff;
  --ifm-color-primary-dark: #63b0ff;
  --ifm-color-primary-darker: #4fa6ff;
  --ifm-color-primary-darkest: #1489ff;

  --ifm-heading-color: #fff;

  /* --ifm-link-color: #ff227e; */

  --ifm-toc-link-color: #ced2d8;

  --ifm-menu-color: #e2dfdf;
  /* --ifm-menu-color-active: #f0287c; */
  --ifm-menu-color-background-active: #383838;

  --ifm-code-background: #605c5c;

  --plum-color: #e4467d;

  --hr-color: #334155;
  --feedback-yes-color: #38b8b1;
}

/* All the relevant class names can be found here: https://docusaurus.io/docs/styling-layout#theme-class-names */

p,
h1,
h2,
h3,
h4,
h5,
h6,
.theme-doc-markdown,
.pagination-nav__label,
.pagination-nav__sublabel,
.theme-edit-this-page,
.theme-last-updated,
.theme-doc-toc-desktop {
  /* @apply !font-inter; */
}

.theme-doc-markdown img,
.theme-doc-markdown video {
  @apply my-5 shadow-lg shadow-teal-800/50;
}

.theme-doc-markdown .feedback-divider {
  border-color: var(--hr-color);
  @apply rounded-lg border border-solid;
}

.theme-doc-markdown .feedback-button,
.cookie-button {
  @apply flex w-full cursor-pointer appearance-none flex-row items-center justify-evenly rounded-lg border-2 border-solid bg-transparent px-6 py-1 text-lg font-semibold transition-all hover:-translate-y-px hover:shadow-md active:translate-y-0 active:shadow-none;
}

.theme-doc-markdown .feedback-button-yes,
.cookie-button-yes {
  @apply border-[color:var(--feedback-yes-color)] text-[color:var(--feedback-yes-color)] hover:shadow-[color:var(--feedback-yes-color)];
}

.theme-doc-markdown .feedback-button-no {
  @apply border-[color:var(--feedback-no-color)] text-[color:var(--feedback-no-color)] hover:shadow-[color:var(--feedback-no-color)];
}

[aria-label='animation'] {
  @apply m-0 !important;
}

.table-of-contents__link--active {
  /* color: var(--plum-color) !important; */
}

.theme-last-updated {
  @apply not-italic;
}

.hero__subtitle {
  color: var(--ifm-heading-color) !important;
}

.hero__title {
  color: var(--ifm-heading-color) !important;
}

.footer--dark {
  @apply !bg-black;
}

.footer__title,
.footer__item,
.footer__copyright {
  @apply font-inter;
}

.token-line,
code {
  @apply font-fira-code;
}

.breadcrumbs__link {
  @apply text-sm;
}

.breadcrumbs__item.breadcrumbs__item--active > a {
  @apply bg-green-100;
}

.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);
}

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

html[data-theme='dark'] .hero__title,
html[data-theme='dark'] .hero__subtitle,
html[data-theme='dark'] .snapshot {
  color: #444650 !important;
}
html[data-theme='dark'] .button {
  color: var(--ifm-heading-color);
}

.filterable-table-container {
  z-index: -1;
}
.filterable-table-container .close.clear-filter {
  display: none;
}
.filterable-table-container .row.header-row:nth-child(1) {
  display: flex;
  gap: 10px;
}
.form-control.filter-input,
.form-control.pull-sm-right.pull-md-right.pull-lg-right {
  border: 1px solid rgb(218, 221, 225);
  font-size: medium;
  border-color: #dadde1;
  padding: 0.5rem;
  min-width: 20rem;

  border-radius: 4px;
}
.form-control.pull-sm-right.pull-md-right.pull-lg-right {
  min-width: 10rem;
  height: 40px;
}
.btn-next-page::marker,
.btn-first-page::marker,
.btn-numbered-page::marker,
.btn-last-page::marker,
.btn-prev-more::marker,
.btn-next-more::marker,
.btn-prev-page::marker {
  content: '';
}

.pagination,
.filterable-table-container .row.header-row:nth-child(2) {
  margin-top: 1rem;
  display: flex;
  justify-content: flex-start;
}

nav:nth-child(2) .pagination {
  display: none;
}

.pagination li a {
  color: #777;
  background-color: #fff;
  border: 1px solid #ddd;
  padding: 10px;
}
.pagination li.btn-numbered-page.active a {
  background-color: #337ab7;
  border-color: #337ab7;
}
.pagination li.btn-numbered-page.active a {
  color: #fff;
}
.btn-first-page {
  height: 38px;
}
.row {
  margin: 0;
}
.col-sm-3.filter-container {
  margin-right: 8rem;
}

.text-center.text-muted.record-count {
  padding-top: 10px;
  font-size: small;
  min-width: 20rem;
  text-align: start;
}
.col-sm-5.col-sm-push-4 {
  padding-right: 2rem;
}

.btn-next-page:hover a,
.btn-first-page:hover a,
.btn-numbered-page:hover a,
.btn-last-page:hover a,
.btn-prev-more:hover a,
.btn-next-more:hover a,
.btn-prev-page:hover a {
  background: #e0f2fe;
  cursor: pointer;
}

.filterable-table-container {
  font-size: 0.75rem;
}

/*.omop-filtered-table {*/
/*  display: flex;*/
/*  flex-flow: column nowrap;*/
/*  align-items: stretch;*/
/*  height: 100vh;*/
/*}*/

.filtered-table h1 {
  margin: 2rem;
}

/*.filteredTable {*/
/*  flex-grow: 1;*/
/*  flex-basis: 0;*/
/*  z-index: 100;*/
/*  display: flex;*/
/*  flex-flow: column nowrap;*/
/*  align-items: stretch;*/
/*}*/

.filteredTable div:has(.row.header-row) {
  margin: 2rem;
}

/*.omop-filtered-table .filteredTable .table-container {*/
/*  flex-grow: 1;*/
/*  flex-basis: 0;*/
/*}*/

.table.table-condensed.filterable-table {
  border-collapse: collapse;
  position: relative;
}

.table.table-condensed.filterable-table th {
  position: sticky;
  top: 0;
  background: var(--table-header-color);
}

/*#__docusaurus:has(.main-wrapper .omop-filtered-table) .footer--dark {*/
/*  display: none;*/
/*}*/

.table.table-condensed.filterable-table tbody td {
  width: 16rem !important;
  max-width: 16rem !important;
}

.table.table-condensed.filterable-table td span {
  max-width: 16rem !important;
}
