/* ── Offcanvas navigation ───────────────────────────────────────────────────── */

/* Panel width */
#navOffcanvas {
  width: 300px;
}

/* Vertical nav links inside offcanvas */
#navOffcanvas .navbar-nav {
  flex-direction: column;
  width: 100%;
}
#navOffcanvas .navbar-nav .nav-link {
  padding: 0.6rem 0.5rem;
  border-radius: 6px;
  font-size: 1rem;
}
#navOffcanvas .navbar-nav .nav-link:hover,
#navOffcanvas .navbar-nav .nav-link.active {
  background: #f0f4ff;
  color: #0d6efd;
}

/* Dropdowns inside offcanvas — static, no shadow, indented */
#navOffcanvas .dropdown-menu {
  position:   static !important;
  box-shadow: none !important;
  border:     none;
  background: transparent;
  padding:    0 0 0 1rem;
  margin:     0;
}
#navOffcanvas .dropdown-toggle::after {
  float: right;
  margin-top: 0.4em;
}
#navOffcanvas .dropdown-item {
  border-radius: 6px;
  padding: 0.45rem 0.5rem;
  font-size: 0.95rem;
}
#navOffcanvas .dropdown-item:hover,
#navOffcanvas .dropdown-item.active {
  background: #f0f4ff;
  color: #0d6efd;
}

/* Mega menu on mobile — collapse to simple vertical list */
@media (max-width: 991.98px) {
  #navOffcanvas .dropdown-menu > .row {
    display:        flex;
    flex-direction: column;
    gap:            0;
  }
  #navOffcanvas .dropdown-menu > .row > [class*="col"] {
    width: 100%;
    padding: 0;
  }
  #navOffcanvas .dropdown-menu p.fw-semibold {
    font-size: 0.75rem;
    margin: 0.5rem 0 0.2rem;
    padding-left: 0.5rem;
  }
}

/* Auth nav inside offcanvas — stack vertically */
#navOffcanvas .d-flex.gap-2 {
  flex-direction: column;
  align-items:    stretch;
}
#navOffcanvas .d-flex.gap-2 a {
  text-align: center;
}

/*************************************/

#navOffcanvas .offcanvas-body {
  background: #212529; /* same as bg-dark */
}
#navOffcanvas .navbar-nav .nav-link {
  color: rgba(255,255,255,.85);
}
#navOffcanvas .navbar-nav .nav-link:hover,
#navOffcanvas .navbar-nav .nav-link.active {
  background: rgba(255,255,255,.1);
  color: #fff;
}
#navOffcanvas .dropdown-item {
  color: rgba(255,255,255,.75);
}
#navOffcanvas .dropdown-item:hover,
#navOffcanvas .dropdown-item.active {
  background: rgba(255,255,255,.1);
  color: #fff;
}
/***************************************************/
.jp-InputArea {
    margin: 10px;
    padding: 10px;
    border-style: solid;
    border: 1px solid #dddddd;
    border-image: initial;
    border-radius: 0.3rem;
    box-shadow: 0 15px 20px rgb(0 0 0 / 10%);
    transform: translate(0, -4px);
    word-wrap: break-word;
    display: inline-block;
    width: 95%;
    overflow-x:scroll;
}
.jp-OutputArea {
    margin: 10px;
    padding: 10px;
    border-style: solid;
    border: 1px solid #dddddd;
    border-image: initial;
    border-radius: 0.3rem;
    box-shadow: 0 15px 20px rgb(0 0 0 / 10%);
    transform: translate(0, -4px);
    word-wrap: break-word;
    display: inline-block;
    width: 95%;
    overflow-x: scroll;
}
.jp-RenderedHTMLCommon {
    color: var(--jp-content-font-color1);
    font-family: var(--jp-content-font-family);
    font-size: var(--jp-content-font-size1);
    line-height: var(--jp-content-line-height);
    /* Give a bit more R padding on Markdown text to keep line lengths reasonable */
    padding-right: 20px;
}
    .jp-RenderedHTMLCommon em {
        font-style: italic;
    }
    .jp-RenderedHTMLCommon strong {
        font-weight: bold;
    }
    .jp-RenderedHTMLCommon u {
        text-decoration: underline;
    }
    .jp-RenderedHTMLCommon a:link {
        text-decoration: none;
        color: var(--jp-content-link-color);
    }
    .jp-RenderedHTMLCommon a:hover {
        text-decoration: underline;
        color: var(--jp-content-link-color);
    }
    .jp-RenderedHTMLCommon a:visited {
        text-decoration: none;
        color: var(--jp-content-link-color);
    }
    /* Headings */
    .jp-RenderedHTMLCommon h1 {
        font-size: var(--jp-content-font-size5);
        font-weight: bold;
    }
    .jp-RenderedHTMLCommon h2 {
        font-size: var(--jp-content-font-size4);
        font-weight: bold;
    }
    .jp-RenderedHTMLCommon h3 {
        font-size: var(--jp-content-font-size3);
        font-weight: bold;
    }
    .jp-RenderedHTMLCommon h4 {
        font-size: var(--jp-content-font-size2);
    }
    .jp-RenderedHTMLCommon h5 {
        font-size: var(--jp-content-font-size1);
    }
    .jp-RenderedHTMLCommon h6 {
        font-size: var(--jp-content-font-size0);
    }
    .jp-RenderedHTMLCommon h1,
    .jp-RenderedHTMLCommon h2,
    .jp-RenderedHTMLCommon h3,
    .jp-RenderedHTMLCommon h4,
    .jp-RenderedHTMLCommon h5,
    .jp-RenderedHTMLCommon h6 {
        line-height: var(--jp-content-heading-line-height);
        font-weight: var(--jp-content-heading-font-weight);
        font-style: normal;
        margin: var(--jp-content-heading-margin-top) 0 var(--jp-content-heading-margin-bottom) 0;
    }
.highlight .hll {
    background-color: var(--jp-cell-editor-active-background)
}
.highlight {
    background: var(--jp-cell-editor-background);
    color: var(--jp-mirror-editor-variable-color)
}
    .highlight .c {
        color: var(--jp-mirror-editor-comment-color);
        font-style: italic
    }
    /* Comment */
    .highlight .err {
        color: var(--jp-mirror-editor-error-color)
    }
    /* Error */
    .highlight .k {
        color: var(--jp-mirror-editor-keyword-color);
        font-weight: bold
    }
    /* Keyword */
    .highlight .o {
        color: var(--jp-mirror-editor-operator-color);
        font-weight: bold
    }
    /* Operator */
    .highlight .p {
        color: var(--jp-mirror-editor-punctuation-color)
    }
    /* Punctuation */
    .highlight .ch {
        color: var(--jp-mirror-editor-comment-color);
        font-style: italic
    }
    /* Comment.Hashbang */
    .highlight .cm {
        color: var(--jp-mirror-editor-comment-color);
        font-style: italic
    }
    /* Comment.Multiline */
    .highlight .cp {
        color: var(--jp-mirror-editor-comment-color);
        font-style: italic
    }
    /* Comment.Preproc */
    .highlight .cpf {
        color: var(--jp-mirror-editor-comment-color);
        font-style: italic
    }
    /* Comment.PreprocFile */
    .highlight .c1 {
        color: var(--jp-mirror-editor-comment-color);
        font-style: italic
    }
    /* Comment.Single */
    .highlight .cs {
        color: var(--jp-mirror-editor-comment-color);
        font-style: italic
    }
    /* Comment.Special */
    .highlight .kc {
        color: var(--jp-mirror-editor-keyword-color);
        font-weight: bold
    }
    /* Keyword.Constant */
    .highlight .kd {
        color: var(--jp-mirror-editor-keyword-color);
        font-weight: bold
    }
    /* Keyword.Declaration */
    .highlight .kn {
        color: var(--jp-mirror-editor-keyword-color);
        font-weight: bold
    }
    /* Keyword.Namespace */
    .highlight .kp {
        color: var(--jp-mirror-editor-keyword-color);
        font-weight: bold
    }
    /* Keyword.Pseudo */
    .highlight .kr {
        color: var(--jp-mirror-editor-keyword-color);
        font-weight: bold
    }
    /* Keyword.Reserved */
    .highlight .kt {
        color: var(--jp-mirror-editor-keyword-color);
        font-weight: bold
    }
    /* Keyword.Type */
    .highlight .m {
        color: var(--jp-mirror-editor-number-color)
    }
    /* Literal.Number */
    .highlight .s {
        color: var(--jp-mirror-editor-string-color)
    }
    /* Literal.String */
    .highlight .ow {
        color: var(--jp-mirror-editor-operator-color);
        font-weight: bold
    }
    /* Operator.Word */
    .highlight .pm {
        color: var(--jp-mirror-editor-punctuation-color)
    }
    /* Punctuation.Marker */
    .highlight .w {
        color: var(--jp-mirror-editor-variable-color)
    }
    /* Text.Whitespace */
    .highlight .mb {
        color: var(--jp-mirror-editor-number-color)
    }
    /* Literal.Number.Bin */
    .highlight .mf {
        color: var(--jp-mirror-editor-number-color)
    }
    /* Literal.Number.Float */
    .highlight .mh {
        color: var(--jp-mirror-editor-number-color)
    }
    /* Literal.Number.Hex */
    .highlight .mi {
        color: var(--jp-mirror-editor-number-color)
    }
    /* Literal.Number.Integer */
    .highlight .mo {
        color: var(--jp-mirror-editor-number-color)
    }
    /* Literal.Number.Oct */
    .highlight .sa {
        color: var(--jp-mirror-editor-string-color)
    }
    /* Literal.String.Affix */
    .highlight .sb {
        color: var(--jp-mirror-editor-string-color)
    }
    /* Literal.String.Backtick */
    .highlight .sc {
        color: var(--jp-mirror-editor-string-color)
    }
    /* Literal.String.Char */
    .highlight .dl {
        color: var(--jp-mirror-editor-string-color)
    }
    /* Literal.String.Delimiter */
    .highlight .sd {
        color: var(--jp-mirror-editor-string-color)
    }
    /* Literal.String.Doc */
    .highlight .s2 {
        color: var(--jp-mirror-editor-string-color)
    }
    /* Literal.String.Double */
    .highlight .se {
        color: var(--jp-mirror-editor-string-color)
    }
    /* Literal.String.Escape */
    .highlight .sh {
        color: var(--jp-mirror-editor-string-color)
    }
    /* Literal.String.Heredoc */
    .highlight .si {
        color: var(--jp-mirror-editor-string-color)
    }
    /* Literal.String.Interpol */
    .highlight .sx {
        color: var(--jp-mirror-editor-string-color)
    }
    /* Literal.String.Other */
    .highlight .sr {
        color: var(--jp-mirror-editor-string-color)
    }
    /* Literal.String.Regex */
    .highlight .s1 {
        color: var(--jp-mirror-editor-string-color)
    }
    /* Literal.String.Single */
    .highlight .ss {
        color: var(--jp-mirror-editor-string-color)
    }
    /* Literal.String.Symbol */
    .highlight .il {
        color: var(--jp-mirror-editor-number-color)
    }
/* Literal.Number.Integer.Long */
a.anchor-link {
    display: none;
}
.jp-RenderedImage img {
    width: 98%;
    max-width: 800px !important;
}
.jp-Notebook {
    max-width: 100% !important;
    width: 100%;
    word-wrap: break-word;
    display: inline-block;
}
.section-title {
    margin:5px;
    padding:10px;
    text-align:left;
    font-family:Courier New, Courier, monospace;
    font-size:large;
    font-weight:bold;
}
pre span {
    display: inline-block;
}
.main_title_header {
    color: #3bd671;
    font-size: 55px;
    line-height: 1.096;
    font-family: Roboto, Arial, sans-serif;
    font-weight: 700;
    text-transform: none;
    text-decoration: none;
}
.main_title_header a{
    color: #3bd671;
    font-size: 55px;
    line-height: 1.096;
    font-family: Roboto, Arial, sans-serif;
    font-weight: 700;
    text-transform: none;
    text-decoration: none;
}
.main_title_header a:hover {
    text-decoration: underline;
}
/***************************************************/
.jp-OutputArea img {
  max-width: 50% !important;
}
.img-fluid {
  max-width: 50% !important;
}