/* css styles */

/* =========================================
   1. GLOBAL & TYPOGRAPHY
   ========================================= */

/* --- Layout & Structural Fixes --- */

/* Remove margin from the first header inside the first section */
#quarto-document-content.content > section:first-child > h1:first-child {
  margin-top: 0;
}

/* Remove bottom margin from figures */
.quarto-figure {
  margin-bottom: 0;
}

/* --- Base Colors & Visibility --- */
#quarto-margin-sidebar,
.quarto-listing-category-title,
.blockquote,
.nav-footer {
  color: var(--quarto-body-color) !important;
}

.quarto-listing-category-title {
  opacity: 1 !important;
}

caption {
  color: var(--quarto-body-color) !important;
  font-weight: 700 !important;
  font-size: var(--bs-body-font-size) !important;
}

/* --- Heading Sizes & Styles --- */
h1, .h1 { font-size: 2rem !important; }
h2, .h2 { font-size: 1.75rem !important; }
h3, .h3 { font-size: 1.5rem !important; }
h4, .h4 { font-size: 1.25rem !important; }
h5, .h5 { font-size: 1rem !important; }

h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5 {
  opacity: 1 !important;
  margin-bottom: 1rem !important;
  border-bottom: none !important;
  padding-bottom: 0 !important;
}

/* --- Listing Categories --- */
.category {
  color: var(--quarto-body-color) !important;
  opacity: .6 !important;
}

.category.active,
.category:hover {
  opacity: 1 !important;
}

/* --- Code Blocks (Dark Mode Override) --- */
.quarto-dark code {
  color: #ffffff !important;
  background-color: #242424 !important;
}

.quarto-dark div.sourceCode {
  background-color: #242424 !important;
  border: 1px solid #242424 !important;
}

/* --- Back to Top Button --- */
#quarto-back-to-top {
  color: #3b3b3b !important;
  transition: color 0.2s ease-in-out;
  box-shadow: 0 .2rem .5rem #b3b3b3, 0 0 .05rem #b3b3b3 !important;
}

#quarto-back-to-top:hover {
  color: var(--quarto-body-color) !important;
}

.quarto-dark #quarto-back-to-top {
  color: #b3b3b3 !important;
  box-shadow: 0 .2rem .5rem #242424, 0 0 .05rem #242424 !important;
}

.quarto-dark #quarto-back-to-top:hover {
  color: var(--quarto-body-color) !important;
}

/* --- Footer --- */
.quarto-dark .nav-footer {
  border-color: #242424 !important;
}

/* =========================================
   2. NAVBAR STYLING
   ========================================= */

.navbar {
  background-color: var(--quarto-body-bg) !important;
  color: var(--quarto-body-color) !important;
  border-bottom: 1px solid var(--quarto-body-color);
  border-color: var(--quarto-border-color) !important;
}

.quarto-dark .navbar {
  border-color: #242424 !important;
}

.navbar .navbar-brand {
  color: var(--quarto-body-color) !important;
  font-weight: 700 !important;
}

.navbar svg {
  fill: var(--quarto-body-color) !important;
  stroke: var(--quarto-body-color) !important;
}

/* --- Nav Links Interaction --- */
.navbar .nav-link {
  color: var(--quarto-body-color) !important;
  opacity: 0.6 !important;
  transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
}

.navbar .nav-link:hover,
.navbar .nav-link:focus {
  opacity: 1 !important;
  transform: translateY(-2px);
}

.navbar-nav .nav-link.active {
  font-weight: 700 !important;
  opacity: 1 !important;
}

/* Center text links, but ignore icon links */
.navbar-nav .nav-link:not(:has(i)) {
  min-width: 90px;
  text-align: center;
}

/* --- Mobile Menu Toggles --- */
/* Light Mode: Invert to black */
body.quarto-light .navbar-toggler-icon {
  filter: invert(1) grayscale(100%) brightness(0);
}
body.quarto-light .quarto-color-scheme-toggle .bi {
  filter: invert(1) grayscale(100%) contrast(100%);
}

/* Dark Mode: Keep white */
body.quarto-dark .navbar-toggler-icon,
body.quarto-dark .quarto-color-scheme-toggle .bi {
  filter: none;
}

/* =========================================
   3. SIDEBAR & TOC
   ========================================= */

#toc-title {
  font-weight: bold !important;
  margin-bottom: 1rem !important;
  font-size: 1rem !important;
}

/* --- Left Sidebar / Main TOC (Light/Default) --- */
.sidebar nav[role="doc-toc"] ul > li > a {
  border-left: 2px solid #e9ecef !important;
}

.sidebar nav[role="doc-toc"] ul > li > a.active {
  border-left: 2px solid #2780e3 !important;
  font-weight: bold !important;
}

/* --- Dark Mode TOC Overrides --- */
.quarto-dark #TOC a {
  color: #b3b3b3 !important;
  border-left-color: #b3b3b3 !important;
  transition: all 0.2s ease-in-out;
}

.quarto-dark #TOC a:hover {
  color: #ffffff !important;
}

.quarto-dark #TOC a.active {
  color: #ffffff !important;
}

.quarto-dark #TOC .nav-link.active {
  border-left-color: #ffffff !important;
}

/* =========================================
   4. CONTENT LINKS (Body Text)
   ========================================= */

/* --- Light Mode --- */
.anchorjs-link {
  color: rgba(var(--bs-link-color-rgb)) !important;
  opacity: 0 !important;
}

#quarto-document-content p a,
#quarto-document-content ul a,
#quarto-document-content ol a,
.footer a,
.anchored:hover .anchorjs-link {
  color: rgba(var(--bs-link-color-rgb)) !important;
  opacity: 1 !important;
}

#quarto-document-content p a:hover,
#quarto-document-content ul a:hover,
#quarto-document-content ol a:hover,
.footer a:hover,
.anchored:hover .anchorjs-link:hover {
  color: rgba(var(--bs-link-hover-color-rgb)) !important;
}

/* --- Dark Mode --- */
.quarto-dark .anchorjs-link {
  color: var(--quarto-body-color) !important;
  opacity: 0 !important;
}

.quarto-dark #quarto-document-content p a,
.quarto-dark #quarto-document-content ul a,
.quarto-dark #quarto-document-content ol a,
.quarto-dark .footer a,
.quarto-dark .anchored:hover .anchorjs-link {
  color: var(--quarto-body-color) !important;
  opacity: .6 !important;
}

.quarto-dark #quarto-document-content p a:hover,
.quarto-dark #quarto-document-content ul a:hover,
.quarto-dark #quarto-document-content ol a:hover,
.quarto-dark .footer a:hover,
.quarto-dark .anchored:hover .anchorjs-link:hover {
  color: var(--quarto-body-color) !important;
  opacity: 1 !important;
}

/* =========================================
   5. COMPONENTS (Buttons & Categories)
   ========================================= */

.listing-categories {
  margin-top: 5px !important;
}

/* Shared styles for About Links, Categories, and Buttons */
.about-link,
div.quarto-post .listing-categories .listing-category,
div.quarto-title .quarto-categories .quarto-category,
#quarto-document-content a.btn,
/* Dark mode specifics included to override potential specific theme defaults */
body.quarto-dark .about-link,
body.quarto-dark div.quarto-post .listing-categories .listing-category,
body.quarto-dark div.quarto-title .quarto-categories .quarto-category,
.quarto-dark #quarto-document-content a.btn {
  border-radius: 6px;
  text-decoration: none !important;
  color: var(--quarto-body-color) !important;
  border-color: var(--quarto-body-color) !important;
  opacity: .6 !important;
  transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
}

/* Hover Effects */
.about-link:hover,
div.quarto-post .listing-categories .listing-category:hover,
div.quarto-title .quarto-categories .quarto-category:hover,
#quarto-document-content a.btn:hover,
body.quarto-dark .about-link:hover,
body.quarto-dark div.quarto-post .listing-categories .listing-category:hover,
body.quarto-dark div.quarto-title .quarto-categories .quarto-category:hover,
.quarto-dark #quarto-document-content a.btn:hover {
  color: var(--quarto-body-color) !important;
  border-color: var(--quarto-body-color) !important;
  opacity: 1 !important;
  transform: translateY(-2px);
}

/* =========================================
   6. MOBILE RESPONSIVE FIXES
   ========================================= */

@media (max-width: 991.98px) {
  /* Social Icons Alignment */
  .navbar-collapse .navbar-nav:last-of-type {
    flex-direction: row !important;
    justify-content: center !important;
    gap: 1.5rem;
    margin-top: 10px;
    margin-bottom: 20px;
  }

  /* Text Links Alignment */
  .navbar-collapse .navbar-nav:first-of-type {
    align-items: center !important;
  }
}