/**
 * Copyright © 2021 DataSQRL (contact@datasqrl.com)
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/**
 * 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.
 */

/* You can override the default Infima variables here. */
:root {
  /* Primary (blue) */
  --ifm-color-primary: #365B81;
  --ifm-color-primary-dark: #365B81;
  --ifm-color-primary-darker: #153D65;
  --ifm-color-primary-darkest: #1D3557;
  --ifm-color-primary-light: #7299C1;
  --ifm-color-primary-lighter: #86AACE;
  --ifm-color-primary-lightest: #A0C1E1;

  /* Secondary (purple) */
  --ifm-color-secondary: #a46ee0;
  --ifm-color-secondary-dark: #935cd0;
  --ifm-color-secondary-darker: #814bbd;
  --ifm-color-secondary-darkest: #6d38a3;
  --ifm-color-secondary-light: #b582ec;
  --ifm-color-secondary-lighter: #c89df4;
  --ifm-color-secondary-lightest: #d9b8f8;

  /* Backgrounds and text */
  --ifm-background-color: #ffffff;
  --ifm-background-surface-color: #f8f9fa;
  --ifm-font-color-base: #1a1a1a;
  --ifm-font-color-secondary: #444444;
  --ifm-color-content: #2c2c2c;

  /* Borders and emphasis */
  --ifm-border-color: #e0e0e0;
  --ifm-color-emphasis-100: #f5f5f5;
  --ifm-color-emphasis-300: #e0e0e0;
  --ifm-color-emphasis-600: #b0b0b0;

  /* Navbar and footer */
  --ifm-navbar-background-color: #ffffff;
  --ifm-footer-background-color: #f0f0f0;
  --ifm-footer-color: #222;
  --ifm-footer-link-color: #444;
  --ifm-footer-link-hover-color: var(--ifm-color-primary);

  /* Code blocks */
  --ifm-code-background: #f5f5f5;
  --ifm-code-color: #2a2a2a;
  --ifm-pre-background: #f0f0f0;

  --hover-bg-color: var(--ifm-color-primary-lightest); /* Light blue background on hover */
  --active-link-color: var(--ifm-color-primary); /* Orange color for the active link */
  --active-link-bg-color: var(--ifm-color-secondary-lightest); /* Lightest orange background for active link */

}

html[data-theme='dark'] {
  /* Primary (blue) */
  --ifm-color-primary: #A0C1E1;
  --ifm-color-primary-dark: #86AACE;
  --ifm-color-primary-darker: #7299C1;
  --ifm-color-primary-darkest: #4E759C;
  --ifm-color-primary-light: #B4D0EC;
  --ifm-color-primary-lighter: #CBE1F4;
  --ifm-color-primary-lightest: #D7ECFF;

  /* Secondary (lavender) */
  --ifm-color-secondary: #d4b0ff;
  --ifm-color-secondary-dark: #c89df4;
  --ifm-color-secondary-darker: #b68ae6;
  --ifm-color-secondary-darkest: #a478d3;
  --ifm-color-secondary-light: #dfc1ff;
  --ifm-color-secondary-lighter: #ead5ff;
  --ifm-color-secondary-lightest: #f3e6ff;

  /* Backgrounds and text */
  --ifm-background-color: #1F2A33;
  --ifm-background-surface-color: #26323d;
  --ifm-font-color-base: #e0e6eb;
  --ifm-font-color-secondary: #b0b8bf;
  --ifm-color-content: #d0d5db;

  /* Borders and emphasis */
  --ifm-border-color: #3c4853;
  --ifm-color-emphasis-100: #2a343e;
  --ifm-color-emphasis-300: #3c4853;
  --ifm-color-emphasis-600: #57636d;

  /* Navbar and footer */
  --ifm-navbar-background-color: #1F2A33;
  --ifm-footer-background-color: #1A232A;
  --ifm-footer-color: #ccc;
  --ifm-footer-link-color: #ddd;
  --ifm-footer-link-hover-color: var(--ifm-color-primary);

  /* Code blocks */
  --ifm-code-background: #2c3640;
  --ifm-code-color: #e0e0e0;
  --ifm-pre-background: #2a323c;
}


.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'] .tooltip {
  background-color: var(--rt-color-white);
  color: var(--rt-color-dark);
}

.button {
    margin-left: 1rem;
    margin-right: 1rem;
}

img[alt$=">"] {
  float: right;
  margin: 1rem;
}

img[alt$="<"] {
  float: left;
  margin: 1rem;
}

img[alt$="|"] {
  border-style: solid;
  border-width: 2px;
  border-color: var(--ifm-text-color);
}

img[alt$=">|"] {
  float: right;
  margin: 1rem;
  border-style: solid;
  border-width: 2px;
  border-color: var(--ifm-text-color);
}

img[alt$="<|"] {
  float: left;
  margin: 1rem;
  border-style: solid;
  border-width: 2px;
  border-color: var(--ifm-text-color);
}



html[data-theme='dark'] .bg_warning {
  background: var(--ifm-color-secondary-dark);
}

html[data-theme='dark'] .bg_alert {
  background: #A52727;
}

html[data-theme='dark'] .bg_success {
  background: #2B981A;
}


html[data-theme='light'] .bg_warning {
  background: var(--ifm-color-secondary-light);
}

html[data-theme='light'] .bg_alert {
  background: #DC6A6A;
}

html[data-theme='light'] .bg_success {
  background: #7ADC6A;
}


@media screen and (max-width: 996px) {
  .hide-small-screens {
    display: none;
  }
}

.tabs--hero .tabs__item {
    border-bottom-width: 0px;
}

.tabs--hero .tabs__item--active {
    color: var(--ifm-color-secondary);
    border-bottom-color: var(--ifm-color-secondary);
    background: var(--ifm-color-secondary-lightest);
}

html[data-theme='dark'] .tabs--hero .tabs__item--active {
    background: var(--ifm-color-secondary-darker);
}

/* Sidebar link styles */
.menu__link {
    transition: color 0.3s ease; /* Transition only affects color now */
    padding: 10px 15px; /* Slightly larger horizontal padding for better touch */
    font-size: 16px; /* Ensures consistent font size */
    text-decoration: none; /* Removes underline from links */
}

.menu__link:hover {
    color: var(--ifm-color-primary-darkest); /* Slightly darker shade for better visibility */
}

html[data-theme='dark'] .menu__link:hover {
    color: var(--ifm-color-primary-lightest); /* Slightly darker shade for better visibility */
}

/* Active link styling */
.menu__link--active {
    font-weight: bold;
    color: var(--active-link-color); /* More vibrant color for active state */
    background-color: transparent; /* Maintains a clean look without background color change */
}

/* Margin for sidebar items */
.menu__list {
    margin-top: 20px; /* Adds space at the top of the sidebar for better visual separation */
}

/* Hover effect for the entire sidebar */
.menu__list-item:hover {
    border-radius: 5px; /* Soft rounded corners for a modern look */
}

/* Subtle shadows for elevated effect */
.menu__list-item {
}

.menu__list-item:hover {
}

/* Adjusting visual hierarchy and readability */
h1, h2, h3, h4 {
    font-family: 'Roboto', sans-serif; /* Slightly different font for headings to create visual interest */
    margin-top: 20px; /* Ensures adequate spacing above headers */
    margin-bottom: 10px; /* Space below headers to segment sections cleanly */
    color: var(--ifm-color-primary); /* Primary color for headers to draw attention */
}

.menu__list-item:not(:first-child) {
    margin-top: 0rem;
}

.theme-doc-sidebar-item-link-level-2 {
  padding: 0 0 0 13px;
}
.theme-doc-sidebar-item-category-level-2 {
  padding: 0 0 0 13px;
}


.theme-doc-sidebar-item-link-level-3 {
  padding: 0 0 0 20px;
}

.theme-doc-sidebar-item-category-level-3 {
  padding: 0 0 0 20px;
}

.videoWrapper {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 aspect ratio */
  height: 0;
  overflow: hidden;
}

.videoWrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

