/* Fancy note box for Markdown blockquotes */
blockquote {
  margin: 1em 0;
  padding: 0.4em 0.8em 0.4em 0.8em;
  border-radius: 4px;
  background: var(--primaryFadedColor, #eafaf3);
  color: var(--primaryColor, #27ae60);
  font-size: 1em;
  border-left: 2px solid var(--primaryColor, #27ae60);
  box-shadow: 0 1px 2px rgba(0,0,0,0.02);
  width: 100%;
  box-sizing: border-box;
}
blockquote a {
  color: var(--primaryColor, #27ae60);
  text-decoration: underline;
  font-weight: 500;
}
body.dark blockquote {
  background: rgba(39, 174, 96, 0.12);
  color: var(--primaryColor, #27ae60);
  border-left-color: var(--primaryColor, #27ae60);
}
/* Default styling with new color palette */
:root {
  /* Green palette */
  --green-lightest: #CDFBDD;
  --green-light: #95EEB4;
  --green-medium: #12CB77;
  --green-primary: #00A45F;
  --green-dark: #1B7C53;
  --green-darkest: #0A3833;
  
  /* Grey palette */
  --white: #FFFFFF;
  --grey-50: #F8F9FA;
  --grey-100: #ECEEF1;
  --grey-200: #E1E4E9;
  --grey-300: #C5CAD5;
  --grey-400: #8C96A8;
  --grey-500: #5A6376;
  --grey-900: #323232;
  
  /* Functional colors */
  --primaryColor: var(--green-primary);
  --primaryFadedColor: var(--green-lightest);
  --primaryHoverColor: var(--green-medium);
  --primaryDarkenedColor: var(--green-dark);
  --secondaryColor: var(--grey-900);
  
  --primaryTextColor: var(--grey-900);
  --secondaryTextColor: var(--grey-500);
  --linkTextColor: var(--green-primary);
  --linkHoverColor: var(--green-medium);
  
  --siteBgColor: var(--white);
  --altBgColor: var(--grey-50);
  --headerBgColor: var(--white);
  --headerTextColor: var(--grey-900);
  --footerBgColor: var(--grey-900);
  --footerTextColor: var(--white);
  
  --dividerColor: var(--grey-200);
  --borderColor: var(--grey-300);
  --codeBlockHighlightColor: var(--grey-50);
  --navBgColor: var(--grey-50);
  --navActiveColor: var(--green-lightest);
}

/* Global Styles */
body {
  font-family: 'Euclid Circular A', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
  font-size: 16px; /* Increased from default */
  color: var(--primaryTextColor);
  background-color: var(--siteBgColor);
  line-height: 1.6;
}

/* Apply font to all text elements */
body, h1, h2, h3, h4, h5, h6, p, a, li, td, th, input, button, textarea, select, .wy-menu-vertical {
  font-family: 'Euclid Circular A', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
}

/* Custom setup link box for deployment guidance */
.setup-link-box {
  margin: 1.5em 0;
  padding: 1em 1.5em;
  border-radius: 8px;
  background: var(--primaryFadedColor, #eafaf3);
  color: var(--primaryColor, #27ae60);
  font-size: 1.08em;
  border: 1px solid var(--primaryColor, #27ae60);
  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}
.setup-link-box a {
  color: var(--primaryColor, #27ae60);
  text-decoration: underline;
  font-weight: 500;
}
body.dark .setup-link-box {
  background: rgba(39, 174, 96, 0.12);
  color: var(--primaryColor, #27ae60);
  border-color: var(--primaryColor, #27ae60);
}

/* Main Layout */
.wy-nav-content {
  max-width: 1100px;
  padding: 2.5em 3.5em;
  background: var(--siteBgColor);
}

.wy-nav-content-wrap {
  background: var(--siteBgColor);
  margin-left: 340px !important;
}

/* Sidebar Layout */
.wy-nav-side {
  background-color: var(--navBgColor);
  border-right: 1px solid var(--dividerColor);
  width: 340px !important; 
}

.wy-side-scroll {
  width: 100% !important; 
  padding: 0 !important;
  overflow-x: hidden !important; 
}

/* Search & Header Area */
.wy-side-nav-search {
  background-color: var(--headerBgColor) !important;
  padding: 1em;
  border-bottom: 3px solid var(--primaryColor);
  width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 !important;
}

.wy-side-nav-search > a {
  color: var(--primaryColor) !important;
  font-weight: 600;
  font-size: 1.5em; /* Increased from 1.3em */
  background: none !important;  
  padding: 0 !important;   
  border: none !important;
  display: flex;
  flex-direction: column; /* Stack items vertically */
  align-items: center; /* Center horizontally */
  width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 0 20px 0 !important; /* Added bottom margin of 20px */
  text-align: center !important; /* Center text */
}

/* Search Input */
.wy-side-nav-search input[type="text"] {
  border: 2px solid var(--dividerColor);
  border-radius: 4px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
  padding: 10px 12px 10px 35px;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="%2300a45f" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line></svg>');
  background-repeat: no-repeat;
  background-position: 10px center;
  transition: all 0.2s ease;
  width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 0 10px 0 !important; /* Removed top margin */
  display: block !important;
  font-size: 1.05em; /* Increased from default */
}

.wy-side-nav-search input[type="text"]:focus {
  border-color: var(--primaryColor);
  outline: none;
}

/* Navigation Menu */
.wy-menu-vertical {
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Section Headers */
.wy-menu-vertical p.caption {
  color: var(--secondaryColor);
  background-color: var(--dividerColor);
  padding: 12px 15px;
  margin: 15px 0 5px 0;
  font-weight: 600;
  letter-spacing: 0.5px;
  border-top: 2px solid var(--primaryColor);  
  text-transform: uppercase;
  font-size: 0.85em;
  text-align: center;  
  display: flex;  
  align-items: center;  
  justify-content: center;  
  min-height: 45px;  
  line-height: 1.2; 
}

.wy-menu-vertical p.caption span {
  padding: 0;
}

/* Navigation Links */
.wy-menu-vertical li a {
  color: var(--secondaryColor);
  background-color: transparent;
  padding: 10px 15px 10px 20px;
  margin: 2px 0;
  margin-left: 10px;
  font-size: 1.05em; /* Increased from 0.95em */
  border-left: 2px solid transparent;
  transition: all 0.2s ease;
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  position: relative;
}

/* Navigation Link Hover & Active States */
.wy-menu-vertical li a:hover {
  background-color: var(--primaryFadedColor);
  color: var(--primaryColor);
  border-left: 2px solid var(--primaryColor);
}

.wy-menu-vertical li.current {
  background-color: transparent;
}

.wy-menu-vertical li.current > a {
  background-color: var(--primaryFadedColor);
  color: var(--primaryColor);
  border-left: 2px solid var(--primaryColor);
  font-weight: 500;
}

/* Hide Navigation Arrows */
.wy-menu-vertical span.toctree-expand {
  display: none !important;
}

/* Add left padding to expand/collapse buttons */
.wy-menu-vertical li button.toctree-expand {
  padding-left: 2px !important;
}

/* Typography */
h1, h2, h3, h4, h5, h6 {
  color: var(--secondaryColor);
  font-weight: 600;
  margin-top: 1.5em;
  margin-bottom: 0.8em;
}

h1 {
  font-size: 2.2em; /* Increased from 2em */
  border-bottom: 2px solid var(--primaryFadedColor);
  padding-bottom: 10px;
}

h2 {
  font-size: 1.8em; /* Increased from 1.6em */
}

h3 {
  font-size: 1.5em; /* Increased from 1.3em */
  font-weight: 500; 
}

/* Links */
a {
  color: var(--primaryColor);
  text-decoration: none;
}

a:hover {
  color: var(--primaryDarkenedColor);
  text-decoration: underline;
}

/* Code Blocks */
.highlight {
  background: var(--codeBlockHighlightColor);
  border-radius: 4px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

.rst-content pre {
  background: var(--codeBlockHighlightColor);
  border-left: 3px solid var(--primaryColor);
  border-radius: 4px;
  padding: 15px;
  font-size: 0.9em;
}

/* Tables */
.rst-content table.docutils {
  border-radius: 4px;
  overflow: hidden;
  border: 1px solid var(--dividerColor);
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

.rst-content table.docutils thead th {
  background-color: var(--primaryColor);
  color: white;
  padding: 10px;
  text-transform: uppercase;
  font-size: 0.9em;
  letter-spacing: 0.5px;
}

.rst-content table.docutils td {
  padding: 10px;
  border: 1px solid var(--dividerColor);
}

/* Admonitions */
.rst-content .admonition {
  border-radius: 4px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
  border-left: 4px solid var(--primaryColor);
}

.rst-content .admonition-title {
  background-color: var(--primaryFadedColor);
  color: var(--primaryColor);
  font-weight: 600;
}

/* Footer */
footer {
  color: var(--secondaryColor);
  font-size: 0.9em;
  border-top: 1px solid var(--dividerColor);
  padding-top: 30px;
  margin-top: 60px;
}


/* Logo Styling */
.custom-logo {
  height: 55px; /* Slightly adjust size if needed */
  margin-right: 0; /* Remove horizontal spacing */
  margin-bottom: 10px; /* Add space below the logo */
  vertical-align: middle;
  max-width: 100%;  
  background: none !important;
  box-shadow: none !important;
  border-radius: 0 !important; 
  object-fit: contain;
  float: none; /* Remove left float */
}

.wy-side-nav-search img {
  display: block;
  margin-left: 0px;
  margin-right: 0px;
  height: 80px; /* Match height for consistency */
  width: auto; /* Allow natural width */
  background-color: transparent; /* Remove blue background */
  padding: 0; /* Remove padding */
  border-radius: 0; /* Remove circular shape */
}

/* Ensure container is left-aligned */
.wy-side-nav-search > a {
  justify-content: flex-start !important;
  text-align: left !important;
}

/* Mobile layout */
@media screen and (max-width: 768px) {
  .wy-nav-content {
    padding: 1.5em;
  }
  
  h1 {
    font-size: 1.8em; /* Increased from 1.6em */
  }
  
  h2 {
    font-size: 1.6em; /* Increased from 1.4em */
  }
  
  .wy-nav-top {
    background-color: var(--primaryColor) !important;
    padding: 10px;
    display: flex;
    align-items: center;
  }

  .wy-nav-top i {
    color: white;
    font-size: 24px;
  }

  .wy-nav-top a {
    color: white !important;
    font-weight: 600;
    margin-left: 10px;
    display: flex;
    flex-direction: row; /* Changed from column to row */
    align-items: center; /* Vertically center icon and text */
    font-size: 1.2em; /* Increased from 1em */
    text-align: left; /* Ensure text is left-aligned */
  }

  .wy-nav-top a::before {
    content: '';
    background-image: url('../img/branding/logo.png');
    background-size: contain;
    background-repeat: no-repeat;
    width: 36px;
    height: 36px;
    display: inline-block; /* Changed from block */
    margin-right: 10px; /* Add spacing between icon and text */
    margin-bottom: 0; /* Remove bottom margin */
  }


  /* Ensure menu items align properly */
  .wy-menu-vertical li a {
    text-align: left;
    justify-content: flex-start;
  }

  .wy-nav-side {
    width: 85% !important; 
    max-width: 300px !important;
    left: -100%; 
    transition: left 0.3s ease;
  }
  
  .wy-nav-side.shift {
    left: 0; 
  }
  
  .wy-nav-content-wrap {
    margin-left: 0 !important;
    width: 100% !important;
  }
  

}

.wy-side-nav-search > a.icon::before {
  display: none;
  content: none !important;
}

.wy-side-nav-search > a {
  display: flex;
  align-items: center;
  color: var(--primaryColor) !important;
}

.wy-side-nav-search > a,
.wy-side-nav-search > a.icon {
  border-radius: 0 !important; 
  overflow: visible !important; 
  background: none !important;
}

.wy-side-nav-search > a > *,
.wy-side-nav-search > a.icon > * {
  border-radius: 0 !important;
  overflow: visible !important;
}

/* Error page styling */
.error-page {
  text-align: center;
  padding: 40px 0;
}

.error-container {
  max-width: 600px;
  margin: 0 auto;
  padding: 40px 20px;
}

.error-logo {
  height: 60px;
  margin-bottom: 30px;
}

.error-title {
  font-size: 32px;
  color: var(--secondaryColor);
  margin-bottom: 20px;
}

.error-divider {
  height: 4px;
  width: 80px;
  background-color: var(--primaryColor);
  margin: 30px auto;
}

.error-message {
  font-size: 18px;
  margin-bottom: 10px;
  color: var(--secondaryColor);
}

.error-details {
  color: #666;
  margin-bottom: 30px;
}

.error-actions {
  margin: 30px 0;
}

.error-actions .btn {
  display: inline-block;
  padding: 10px 20px;
  margin: 0 10px;
  border-radius: 4px;
  text-decoration: none;
  transition: all 0.2s ease;
}

.error-actions .btn-primary {
  background-color: var(--primaryColor);
  color: white;
}

.error-actions .btn-secondary {
  background-color: var(--dividerColor);
  color: var(--secondaryColor);
}

.error-help {
  margin-top: 30px;
  font-size: 14px;
  color: #777;
}

.error-actions .btn:hover {
  transform: translateY(-3px);
  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

/* Hide the version selector navigation */
.rst-versions,
div[role="note"].rst-versions,
.rst-current-version,
span.rst-current-version {
  display: none !important;
  visibility: hidden !important;
}

/* Remove gap at bottom of sidebar */
.wy-nav-side {
  padding-bottom: 0 !important;
}

.wy-side-scroll {
  padding-bottom: 0 !important;
}

.wy-menu-vertical {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* Ensure sidebar content fills available space */
.wy-menu-vertical ul:last-child {
  margin-bottom: 0 !important;
}



/* Ensure current/active items maintain proper padding */
.wy-menu-vertical li.current > a,
.wy-menu-vertical li a.current,
.wy-menu-vertical a.reference.internal.current {
  padding-bottom: 10px !important;
}



.zoomable-image-container {
  position: relative;
  cursor: pointer;
}

.zoomable-image {
  border: 1px solid #ddd;
  border-radius: 4px;
  padding: 5px;
  box-shadow: 0 2px 5px rgba(0,0,0,0.1);
  transition: transform 0.3s;
}

.zoomable-image:hover {
  transform: scale(1.02);
}

.zoomable-image:active {
  transform: scale(1.5);
  z-index: 100;
  position: relative;
}


/* Image styling with border and shadow */
.bordered-image {
  border: 1px solid #ddd;
  border-radius: 4px;
  padding: 5px;
  box-shadow: 0 2px 5px rgba(0,0,0,0.1);
  margin: 10px 0;
  max-width: 100%; /* Prevents extending beyond container */
  display: inline-block; /* Ensures the div only takes up needed space */
}

.bordered-image img {
  max-width: 100%; /* Makes images responsive */
  height: auto; /* Maintains aspect ratio */
  display: block; /* Removes extra space below image */
}

/* Reduce spacing between headers and following content */
.rst-content .toctree-wrapper>p.caption,
.rst-content h1,
.rst-content h2,
.rst-content h3,
.rst-content h4,
.rst-content h5,
.rst-content h6 {
    margin-bottom: 10px !important; /* Reduced from 24px */
}



body {
  font-size: 1rem; 
}

/* Scale up containers for better proportions */
.wy-nav-content {
  max-width: 60vw; 
}
/* Adjust padding and margins for better spacing */
.wy-nav-content-wrap {
  padding: 1.5rem;
}

.rst-content p {
  font-size: 18px;
  margin-bottom: 1.2em;
}

/* Ensure list items match paragraph size */
.rst-content ul li, 
.rst-content ol li {
  font-size: 18px;
  margin-bottom: 0.5em;
}

/* Adjust spacing for better readability with larger text */
.rst-content .section {
  margin-bottom: 1.8em;
}

/* Fix for submenu items getting cut off */
.wy-menu-vertical li.toctree-l2 a, 
.wy-menu-vertical li.toctree-l3 a, 
.wy-menu-vertical li.toctree-l4 a {
  font-size: 0.95em; /* Smaller font for submenu items */
  white-space: normal; /* Allow text wrapping */
  line-height: 1.4; /* Better line spacing for wrapped text */
  padding-right: 10px; /* Ensure text doesn't touch the edge */
  height: auto; /* Allow height to adjust to content */
}

/* Add padding to submenus for better hierarchy */
.wy-menu-vertical li.toctree-l2 > a {
  padding-left: 25px; /* Indent level 2 items */
}

.wy-menu-vertical li.toctree-l3 > a {
  padding-left: 35px; /* Indent level 3 items */
}

.wy-menu-vertical li.toctree-l4 > a {
  padding-left: 45px; /* Indent level 4 items */
}

/* Increase text size in tables */
.rst-content table.docutils td,
.rst-content table.docutils th {
  font-size: 18px !important; /* Increase from default */
  padding: 12px !important; /* Add more padding for better readability */
}

/* Fix potential wrapping issues with larger text */
.rst-content table.docutils {
  table-layout: fixed;
  width: 100%;
}

/* Make sure code blocks within tables are properly sized */
.rst-content table.docutils td code,
.rst-content table.docutils td .highlight {
  font-size: 16px !important; /* Slightly smaller than regular text */
}

/* ---- Dark mode support ---- */
body.dark {
  /* Softer dark palette */
  --primaryTextColor: #EDEFF2;
  --secondaryTextColor: #C3C7CF;
  /* Keep original site greens for links in dark mode */
  --linkTextColor: var(--green-primary);
  --linkHoverColor: var(--green-medium);

  --siteBgColor: #1A1F24;
  --altBgColor: #20262C;
  --headerBgColor: #20262C;
  --headerTextColor: #EDEFF2;
  --footerBgColor: #1A1F24;
  --footerTextColor: #EDEFF2;

  --dividerColor: #2B333B;
  --borderColor: #37414B;
  --codeBlockHighlightColor: #1F262D;
  --navBgColor: #20262C;
  --navActiveColor: rgba(0, 164, 95, 0.15); /* Lighter green for main sections */

  /* Tables in dark */
  --tableHeaderBg: var(--primaryColor);
  --tableHeaderText: #FFFFFF;
  --tableRowBg: #1E252C;
  --tableRowAltBg: #222A32;
}

/* Dark mode navigation highlighting fix - use lighter green for main sections */
body.dark .wy-menu-vertical .toctree-l1.current > a {
    color: var(--primaryColor) !important;
    background-color: rgba(0, 164, 95, 0.15) !important; /* Lighter green for main sections */
    border-left: 2px solid var(--primaryColor) !important;
    font-weight: 500;
}

body.dark .wy-menu-vertical li a:hover {
    background-color: rgba(0, 164, 95, 0.1) !important; /* Lighter green for hover */
    color: var(--primaryColor) !important;
}

/* Dark mode section headers - use lighter green */
body.dark .wy-menu-vertical p.caption {
  color: var(--primaryTextColor) !important;
  background-color: rgba(0, 164, 95, 0.15) !important; /* Lighter green for section headers */
  border-top: 2px solid var(--primaryColor) !important;
}

/* Toggle button styling */
.theme-toggle-btn {
  position: fixed;
  top: 12px;
  right: 12px;
  z-index: 9999;
  padding: 8px 10px;
  font-size: 14px;
  border: 1px solid var(--dividerColor);
  background: var(--altBgColor);
  color: var(--primaryTextColor);
  border-radius: 20px;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(0,0,0,0.2);
}

.theme-toggle-btn:hover {
  border-color: var(--primaryColor);
}

/* Slider-style theme toggle */
.theme-toggle-container {
  position: fixed;
  top: 12px;
  right: 12px;
  z-index: 10000;
}

.theme-switch {
  position: relative;
  display: inline-block;
  width: 64px;
  height: 30px;
}

.theme-switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.theme-slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  /* Use brand green for negative space */
  background-color: var(--green-primary);
  border: 1px solid var(--green-medium);
  transition: .2s;
  border-radius: 999px;
  z-index: 1;
  /* Sun left, moon right as background images */
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23FFC107' stroke='%23FFC107' stroke-width='1.5'><circle cx='12' cy='12' r='4'/><g stroke-linecap='round'><line x1='12' y1='1.5' x2='12' y2='5.5'/><line x1='12' y1='18.5' x2='12' y2='22.5'/><line x1='1.5' y1='12' x2='5.5' y2='12'/><line x1='18.5' y1='12' x2='22.5' y2='12'/><line x1='4.2' y1='4.2' x2='7' y2='7'/><line x1='17' y1='17' x2='19.8' y2='19.8'/><line x1='17' y1='7' x2='19.8' y2='4.2'/><line x1='4.2' y1='19.8' x2='7' y2='17'/></g></svg>"),
                    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23FFFFFF'><path d='M21 12.79A9 9 0 1111.21 3 7 7 0 0021 12.79z'/></svg>");
  background-repeat: no-repeat, no-repeat;
  background-size: 14px 14px, 14px 14px;
  background-position: 8px center, calc(100% - 8px) center;
}

.theme-slider:before {
  position: absolute;
  content: "";
  height: 24px;
  width: 24px;
  left: 3px;
  top: 3px;
  background-color: var(--siteBgColor);
  border: 1px solid var(--dividerColor);
  border-radius: 50%;
  transition: .2s;
  box-shadow: 0 2px 4px rgba(0,0,0,0.15);
  z-index: 2;
}

/* Emoji sits in negative space within the track */
.theme-emoji-left,
.theme-emoji-right {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-size: 14px;
  pointer-events: none;
  z-index: 1;
}

.theme-emoji-left { left: 8px; }
.theme-emoji-right { right: 8px; }

/* Checked state moves the knob to the right */
#theme-toggle-input:checked + .theme-slider:before {
  transform: translateX(32px);
}

/* Hide the opposite emoji to feel like it is covered by the knob */
#theme-toggle-input:checked ~ .theme-emoji-left { opacity: 0; }
#theme-toggle-input:not(:checked) ~ .theme-emoji-right { opacity: 0; }

/* Keep links green in dark mode */
/* Keep links green across docs (higher specificity) */
.rst-content a, .wy-nav-content a, body a { color: var(--linkTextColor) !important; }
.rst-content a:hover, .wy-nav-content a:hover, body a:hover { color: var(--linkHoverColor) !important; }

/* Fix table striping: use consistent background in dark mode */
body.dark .rst-content table.docutils,
body.dark .rst-content table.docutils tbody tr,
body.dark .rst-content table.docutils tbody tr:nth-child(odd),
body.dark .rst-content table.docutils tbody tr:nth-child(even) {
  background-color: var(--altBgColor) !important;
}

body.dark .rst-content table.docutils td,
body.dark .rst-content table.docutils th {
  border-color: var(--dividerColor) !important;
}

/* Ensure header cells remain readable in dark mode */
body.dark .rst-content table.docutils thead th {
  background-color: var(--tableHeaderBg) !important;
  color: var(--tableHeaderText) !important;
}

/* Floating slider-style theme toggle */
.theme-toggle-container {
  position: fixed;
  top: 12px;
  right: 12px;
  z-index: 9999;
  user-select: none;
}

.theme-toggle-container input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.theme-toggle-switch {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid var(--dividerColor);
  background: var(--altBgColor);
  color: var(--primaryTextColor);
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(0,0,0,0.2);
}

.theme-toggle-icon {
  font-size: 14px;
  line-height: 1;
}

.theme-toggle-slider {
  position: relative;
  width: 42px;
  height: 22px;
  border-radius: 999px;
  background: var(--dividerColor);
  transition: background 0.2s ease;
}

.theme-toggle-slider::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--siteBgColor);
  box-shadow: 0 1px 2px rgba(0,0,0,0.25);
  transition: transform 0.2s ease;
}

.theme-toggle-container input:checked + .theme-toggle-switch .theme-toggle-slider {
  background: var(--primaryColor);
}

.theme-toggle-container input:checked + .theme-toggle-switch .theme-toggle-slider::after {
  transform: translateX(20px);
}

@media screen and (max-width: 768px) {
  .theme-toggle-container {
    top: auto;
    bottom: 16px;
    right: 16px;
  }
}

/* Emoji label under the slider */
.theme-toggle-emoji {
  text-align: center;
  font-size: 14px;
  margin-top: 6px;
}

/* Tables: fix dark mode striping and header colors */
body.dark .rst-content table.docutils {
  border-color: var(--dividerColor) !important;
}

body.dark .rst-content table.docutils thead th {
  background-color: var(--tableHeaderBg) !important;
  color: var(--tableHeaderText) !important;
}

body.dark .rst-content table.docutils tbody tr td {
  background-color: var(--tableRowBg) !important;
  border-color: var(--dividerColor) !important;
}

body.dark .rst-content table.docutils tbody tr:nth-child(2n) td {
  background-color: var(--tableRowAltBg) !important;
}

/* Ensure zebra striping from theme doesn’t leak in */
body.dark .wy-table-odd td,
body.dark .rst-content .row-odd td,
body.dark .rst-content .row-even td {
  background: transparent !important;
}

/* Ensure headers and ReadTheDocs bars respect dark variables */
body.dark .wy-side-nav-search,
body.dark .wy-nav-top,
body.dark .wy-nav-content,
body.dark .wy-nav-content-wrap,
body.dark .wy-nav-side,
body.dark .wy-menu-vertical p.caption,
body.dark .rst-content .admonition-title {
  background-color: var(--headerBgColor) !important;
  color: var(--headerTextColor) !important;
}

body.dark .wy-menu-vertical p.caption {
  border-top-color: var(--primaryColor) !important;
}

/* Headings and content colors in dark */
body.dark h1,
body.dark h2,
body.dark h3,
body.dark h4,
body.dark h5,
body.dark h6,
body.dark .rst-content p,
body.dark .rst-content li {
  color: var(--primaryTextColor) !important;
}

/* Sidebar links in dark */
body.dark .wy-menu-vertical li a {
  color: var(--secondaryTextColor) !important;
}

body.dark .wy-menu-vertical li a:hover,
body.dark .wy-menu-vertical li.current > a {
  color: var(--primaryTextColor) !important;
}

/* Fix navigation highlighting - be more specific about levels */
.wy-menu-vertical a {
    color: #404040;
}

.wy-menu-vertical a:hover {
    background-color: #e3e3e3;
    color: #404040;
}

/* Only highlight current page for TOP-LEVEL navigation (toctree-l1) */
.wy-menu-vertical .toctree-l1.current > a {
    color: var(--primaryColor) !important;
    background-color: var(--primaryFadedColor) !important;
    border-left: 2px solid var(--primaryColor) !important;
    font-weight: 500;
}

/* Sub-level navigation - normal state */
.wy-menu-vertical .toctree-l2 > a,
.wy-menu-vertical .toctree-l3 > a,
.wy-menu-vertical .toctree-l4 > a {
    color: #404040 !important;
    background-color: transparent !important;
    border-left: none !important;
    border-right: none !important;
}

/* Sub-level navigation - CURRENT/ACTIVE state (visible highlighting) */
.wy-menu-vertical .toctree-l2.current > a,
.wy-menu-vertical .toctree-l3.current > a,
.wy-menu-vertical .toctree-l4.current > a {
    color: var(--primaryColor) !important;
    background-color: rgba(0, 164, 95, 0.1) !important; /* Light green background */
    border-left: 2px solid var(--primaryColor) !important;
    font-weight: 500 !important;
}

/* Sub-level navigation hover effects */
.wy-menu-vertical .toctree-l2 > a:hover,
.wy-menu-vertical .toctree-l3 > a:hover,
.wy-menu-vertical .toctree-l4 > a:hover {
    background-color: #f5f5f5 !important;
    color: #404040 !important;
    border-left: none !important;
}

/* Dark mode navigation fixes */
body.dark .wy-menu-vertical .toctree-l2 > a,
body.dark .wy-menu-vertical .toctree-l3 > a,
body.dark .wy-menu-vertical .toctree-l4 > a {
    color: var(--secondaryTextColor) !important;
    background-color: transparent !important;
}

/* Dark mode sub-level CURRENT/ACTIVE state (visible highlighting) */
body.dark .wy-menu-vertical .toctree-l2.current > a,
body.dark .wy-menu-vertical .toctree-l3.current > a,
body.dark .wy-menu-vertical .toctree-l4.current > a {
    color: var(--primaryColor) !important;
    background-color: rgba(0, 164, 95, 0.2) !important; /* Slightly more opaque for dark mode */
    border-left: 2px solid var(--primaryColor) !important;
    font-weight: 500 !important;
}

/* Dark mode sub-level hover */
body.dark .wy-menu-vertical .toctree-l2 > a:hover,
body.dark .wy-menu-vertical .toctree-l3 > a:hover,
body.dark .wy-menu-vertical .toctree-l4 > a:hover {
    background-color: rgba(255, 255, 255, 0.05) !important;
    color: var(--primaryTextColor) !important;
}

/* Fix button text contrast - ensure white text on buttons */
.btn, .btn-primary, .btn-secondary, .btn-neutral {
    color: #ffffff !important;
}

.btn:hover, .btn-primary:hover, .btn-secondary:hover, .btn-neutral:hover {
    color: #ffffff !important;
}

.btn:visited, .btn-primary:visited, .btn-secondary:visited, .btn-neutral:visited {
    color: #ffffff !important;
}

/* Dark mode button fixes */
[data-theme="dark"] .btn,
[data-theme="dark"] .btn-primary, 
[data-theme="dark"] .btn-secondary,
[data-theme="dark"] .btn-neutral {
    color: #ffffff !important;
    background-color: var(--primaryColor) !important;
    border-color: var(--primaryColor) !important;
}

[data-theme="dark"] .btn:hover,
[data-theme="dark"] .btn-primary:hover,
[data-theme="dark"] .btn-secondary:hover,
[data-theme="dark"] .btn-neutral:hover {
    color: #ffffff !important;
    background-color: var(--primaryColorHover) !important;
}

/* Dark mode section headers - ensure they get highlighted */
body.dark .wy-menu-vertical p.caption {
  color: var(--primaryTextColor) !important;
  background-color: var(--navActiveColor) !important;
  border-top: 2px solid var(--primaryColor) !important;
}

body.dark .wy-menu-vertical p.caption span {
  color: var(--primaryTextColor) !important;
}