/* STYLING THE BREADCRUMBS*/
.md-path {
    display: block;
    font-size: .7rem;
    margin: 0 0.8rem;
    overflow: auto;
    padding-top: 1.2rem;
}

.md-path__list {
    align-items: center;
    display: flex;
    gap: 0.2rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.md-path__item:not(:first-child) {
    display: inline-flex;
    gap: 0.2rem;
    white-space: nowrap;
}

/*add a caret between list items*/
.md-path__item:not(:first-child)::before {
    content: "›";
    /*color: var(--md-default-fg-color--light);*/
    font-size: 0.7rem;
    margin: 0 0.2rem;
}
/*----- END OF BREADCRUMBS STYLING -----*/


/* STYLING THE LOGO*/
#logo_light_mode {
    display: var(--md-footer-logo-light-mode);
}

#logo_dark_mode {
    display: var(--md-footer-logo-dark-mode);
}

[data-md-color-scheme="bodo-light"] {
    --md-footer-logo-dark-mode:         none;
    --md-footer-logo-light-mode:         block;
}

[data-md-color-scheme="bodo-dark"] {
    --md-footer-logo-dark-mode:         block;
    --md-footer-logo-light-mode:         none;
}
/* END OF LOGO STYLING*/

:root {
    /* setting up variables for the color scheme */
    --bodo-green: #0bc500;
    --bodo-teal-green: #47eaaa;
    --bodo-dark-green: #2e6e2b;
    --bodo-blue: #030e1f;

    .md-header__ellipsis {
        /*
        this adjustment is to align the header title (ellipsis) with the bodo logo.
        This needs some tuning.
        */
        top: 3px;
    }
}

/* STYLING THE LIGHT MODE COLOR SCHEME */
:root,[data-md-color-scheme=bodo-light] {
    --md-primary-fg-color: var(--bodo-dark-green);
    --md-accent-fg-color: var(--bodo-green);

    --md-hue: 225deg;
    --md-default-fg-color: #000000de;
    --md-default-fg-color--light: #0000008a;
    --md-default-fg-color--lighter: #00000052;
    --md-default-fg-color--lightest: #00000012;
    --md-default-bg-color: #fff;
    --md-default-bg-color--light: #ffffffb3;
    --md-default-bg-color--lighter: #ffffff4d;
    --md-default-bg-color--lightest: #ffffff1f;
    --md-code-fg-color: #36464e;
    --md-code-bg-color: #f5f5f5;
    --md-code-hl-color: #4287ff;
    --md-code-hl-color--light: #4287ff1a;
    --md-code-hl-number-color: #d52a2a;
    --md-code-hl-special-color: #db1457;
    --md-code-hl-function-color: #a846b9;
    --md-code-hl-constant-color: #6e59d9;
    --md-code-hl-keyword-color: #3f6ec6;
    --md-code-hl-string-color: #1c7d4d;
    --md-code-hl-name-color: var(--md-code-fg-color);
    --md-code-hl-operator-color: var(--md-default-fg-color--light);
    --md-code-hl-punctuation-color: var(--md-default-fg-color--light);
    --md-code-hl-comment-color: var(--md-default-fg-color--light);
    --md-code-hl-generic-color: var(--md-default-fg-color--light);
    --md-code-hl-variable-color: var(--md-default-fg-color--light);
    --md-typeset-color: var(--md-default-fg-color);
    --md-typeset-a-color: var(--md-primary-fg-color);
    --md-typeset-del-color: #f5503d26;
    --md-typeset-ins-color: #0bd57026;
    --md-typeset-kbd-color: #fafafa;
    --md-typeset-kbd-accent-color: #fff;
    --md-typeset-kbd-border-color: #b8b8b8;
    --md-typeset-mark-color: #ffff0080;
    --md-typeset-table-color: #0000001f;
    --md-typeset-table-color--light: rgba(0,0,0,.035);
    --md-admonition-fg-color: var(--md-default-fg-color);
    --md-admonition-bg-color: var(--md-default-bg-color);
    --md-warning-fg-color: #000000de;
    --md-warning-bg-color: #ff9;
    --md-footer-fg-color: var(--md-default-fg-color);
    --md-footer-fg-color--light: var(--md-default-fg-color--light);
    --md-footer-fg-color--lighter: var(--md-default-fg-color--lighter);
    --md-footer-bg-color: var(--md-default-bg-color--light);
    --md-footer-bg-color--dark: var(--md-default-bg-color);
    --md-shadow-z1: 0 0.2rem 0.5rem #0000000d,0 0 0.05rem #0000001a;
    --md-shadow-z2: 0 0.2rem 0.5rem #0000001a,0 0 0.05rem #00000040;
    --md-shadow-z3: 0 0.2rem 0.5rem #0003,0 0 0.05rem #00000059;
    --bodo-gradient: linear-gradient(90deg, #ffffff 70%, var(--bodo-teal-green) 150%);

    .md-header {
        background-image: var(--bodo-gradient);
        color: var(--md-default-fg-color);
    }

    .md-tabs {
        background-image: var(--bodo-gradient);
        color: var(--md-default-fg-color--light);
    }

    .tx-hero {
        color : var(--md-default-fg-color);
    }
}

/* STYLING THE DARK MODE COLOR SCHEME */
[data-md-color-scheme=bodo-dark] {
    --md-primary-fg-color: var(--bodo-teal-green);
    --md-accent-fg-color: var(--bodo-green);

    --md-default-fg-color: hsla(var(--md-hue),15%,90%,0.82);
    --md-default-fg-color--light: hsla(var(--md-hue),15%,90%,0.56);
    --md-default-fg-color--lighter: hsla(var(--md-hue),15%,90%,0.32);
    --md-default-fg-color--lightest: hsla(var(--md-hue),15%,90%,0.12);
    --md-default-bg-color: hsla(var(--md-hue),15%,14%,1);
    --md-default-bg-color--light: hsla(var(--md-hue),15%,14%,0.54);
    --md-default-bg-color--lighter: hsla(var(--md-hue),15%,14%,0.26);
    --md-default-bg-color--lightest: hsla(var(--md-hue),15%,14%,0.07);
    --md-code-fg-color: hsla(var(--md-hue),18%,86%,0.82);
    --md-code-bg-color: hsla(var(--md-hue),15%,18%,1);
    --md-code-hl-color: #2977ff;
    --md-code-hl-color--light: #2977ff1a;
    --md-code-hl-number-color: #e6695b;
    --md-code-hl-special-color: #f06090;
    --md-code-hl-function-color: #c973d9;
    --md-code-hl-constant-color: #9383e2;
    --md-code-hl-keyword-color: #6791e0;
    --md-code-hl-string-color: #2fb170;
    --md-code-hl-name-color: var(--md-code-fg-color);
    --md-code-hl-operator-color: var(--md-default-fg-color--light);
    --md-code-hl-punctuation-color: var(--md-default-fg-color--light);
    --md-code-hl-comment-color: var(--md-default-fg-color--light);
    --md-code-hl-generic-color: var(--md-default-fg-color--light);
    --md-code-hl-variable-color: var(--md-default-fg-color--light);
    --md-typeset-color: var(--md-default-fg-color);
    --md-typeset-a-color: var(--md-primary-fg-color);
    --md-typeset-kbd-color: hsla(var(--md-hue),15%,90%,0.12);
    --md-typeset-kbd-accent-color: hsla(var(--md-hue),15%,90%,0.2);
    --md-typeset-kbd-border-color: hsla(var(--md-hue),15%,14%,1);
    --md-typeset-mark-color: #4287ff4d;
    --md-typeset-table-color: hsla(var(--md-hue),15%,95%,0.12);
    --md-typeset-table-color--light: hsla(var(--md-hue),15%,95%,0.035);
    --md-admonition-fg-color: var(--md-default-fg-color);
    --md-admonition-bg-color: var(--md-default-bg-color);
    --md-footer-fg-color: var(--md-default-fg-color);
    --md-footer-fg-color--light: var(--md-default-fg-color--light);
    --md-footer-fg-color--lighter: var(--md-default-fg-color--lighter);
    --md-footer-bg-color: var(--md-default-bg-color--light);
    --md-footer-bg-color--dark: var(--md-default-bg-color);
    --md-shadow-z1: 0 0.2rem 0.5rem #0000000d,0 0 0.05rem #0000001a;
    --md-shadow-z2: 0 0.2rem 0.5rem #00000040,0 0 0.05rem #00000040;
    --md-shadow-z3: 0 0.2rem 0.5rem #0006,0 0 0.05rem #00000059;
    --bodo-gradient: linear-gradient(90deg, var(--md-default-bg-color) 50%, var(--bodo-dark-green) 150%);

    color-scheme: dark;

    .md-header {
        background-image: var(--bodo-gradient);
        color: var(--md-default-fg-color);
    }

    .md-tabs {
        background-image: var(--bodo-gradient);
        color: var(--md-default-fg-color--light);
    }

    .tx-hero {
        color : var(--md-default-fg-color);
    }
}

/* ADDING IMAGE ALIGNMENT OPTIONS*/
img[src*='#left'] {
    float: left;
}

img[src*='#right'] {
    float: right;
}

img[src*='#center'] {
    display: block;
    margin: auto;
}

/* ADDING MODE DEPENDENT IMAGE SOURCES*/
[data-md-color-scheme="bodo-light"] img[src$="#only-dark"],
[data-md-color-scheme="bodo-light"] img[src$="#gh-dark-mode-only"] {
  display: none; /* Hide dark images in light mode */
}

[data-md-color-scheme="bodo-dark"] img[src$="#only-light"],
[data-md-color-scheme="bodo-dark"] img[src$="#gh-light-mode-only"] {
  display: none; /* Hide light images in dark mode */
}


/** add a seealso admonition */
:root {
  --md-admonition-icon--seealso: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M14.184 1.143a1.75 1.75 0 00-2.502-.57L.912 7.916a1.75 1.75 0 00-.53 2.32l.447.775a1.75 1.75 0 002.275.702l11.745-5.656a1.75 1.75 0 00.757-2.451l-1.422-2.464zm-1.657.669a.25.25 0 01.358.081l1.422 2.464a.25.25 0 01-.108.35l-2.016.97-1.505-2.605 1.85-1.26zM9.436 3.92l1.391 2.41-5.42 2.61-.942-1.63 4.97-3.39zM3.222 8.157l-1.466 1a.25.25 0 00-.075.33l.447.775a.25.25 0 00.325.1l1.598-.769-.83-1.436zm6.253 2.306a.75.75 0 00-.944-.252l-1.809.87a.75.75 0 00-.293.253L4.38 14.326a.75.75 0 101.238.848l1.881-2.75v2.826a.75.75 0 001.5 0v-2.826l1.881 2.75a.75.75 0 001.238-.848l-2.644-3.863z"></path></svg>')
}
.md-typeset .admonition.seealso,
.md-typeset details.seealso {
  border-color: rgb(43, 155, 70);
}
.md-typeset .seealso > .admonition-title,
.md-typeset .seealso > summary {
  background-color: rgba(43, 155, 70, 0.1);
}
.md-typeset .seealso > .admonition-title::before,
.md-typeset .seealso > summary::before {
  background-color: rgb(43, 155, 70);
  -webkit-mask-image: var(--md-admonition-icon--seealso);
          mask-image: var(--md-admonition-icon--seealso);
}

/*Add attribute list style for *beta* features */
.beta{
    color: #008DDD
}

.azure{
    color: #008AD7
}

/*Add attribute list and admonition for requirement*/
.requirement{
    color: #ff0707;
    font-size: 0.3rem;
    top: -0.1rem;
}

.md-typeset .admonition.requirement,

.requirement{
    color: #ff0707;
    font-size: 0.3rem;
    top: -0.1rem;
}

.md-nav__item {
    overflow-wrap: anywhere;
}

/*add a border left only if the level of the unordered list is more than top level*/
[data-md-level="1"] .md-nav__list ul {
    border-left: 1px solid var(--md-default-fg-color--lightest);
}

.md-nav--secondary .md-nav__list ul {
    border-left: 1px solid var(--md-default-fg-color--lightest);
}

.md-grid {
  max-width: 70rem;
}

.md-typeset table:not([class]) {
    font-size: 0.75rem;
}

/* For styling Parameter, Rerturn, Example headers in DataFrame Library
API Docs.*/
p.api-header {
    font-size: 1.1em !important;
    font-weight: bold !important;
    margin-top: 1em;
    margin-bottom: 0.5em;
  }