/* Custom styles for resizable sidebar and theme toggle */

/* Sidebar min/max widths */
:root {
  --sidebar-min: 180px;
  --sidebar-max: 520px;
}

/************************
 * Resizable sidebar
 ************************/
@media screen and (min-width: 769px) {
  .wy-side-scroll {
    resize: horizontal; /* visual cue */
    overflow: auto;
  }
  .wy-nav-side {
    min-width: var(--sidebar-min);
    max-width: var(--sidebar-max);
  }
  .wy-nav-content-wrap {
    transition: margin-left 0.1s ease-in-out;
  }
}

/* Theme toggle button */
.theme-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.25rem 0.5rem;
  border: 1px solid var(--toggle-border, #ccc);
  border-radius: 6px;
  cursor: pointer;
  font-size: 0.85rem;
}

/* Light/Dark variables scoped by data-theme attribute */
:root[data-theme='light'] {
  --toggle-border: #bdbdbd;
}
:root[data-theme='dark'] {
  --toggle-border: #666;
  /* Base colors for dark theme */
  --bg: #121212;
  --bg-elev: #1e1e1e;
  --text: #e0e0e0;
  --muted: #b0b0b0;
  --link: #82b1ff;
  --link-visited: #b388ff;
  --border: #2c2c2c;
  --code-bg: #181818;
}

/* Place toggle in header */
.wy-nav-top .theme-toggle-container {
  position: absolute;
  top: 8px;
  right: 12px;
}

/* Dark theme overrides for RTD components */
:root[data-theme='dark'] body,
:root[data-theme='dark'] .wy-body-for-nav,
:root[data-theme='dark'] .wy-nav-content,
:root[data-theme='dark'] .wy-nav-side,
:root[data-theme='dark'] .wy-side-nav-search,
:root[data-theme='dark'] .rst-content {
  background: var(--bg) !important;
  color: var(--text) !important;
}

:root[data-theme='dark'] .wy-nav-side,
:root[data-theme='dark'] .wy-side-nav-search {
  background: var(--bg-elev) !important;
}

:root[data-theme='dark'] .wy-nav-top {
  background: var(--bg-elev) !important;
  color: var(--text) !important;
  border-bottom: 1px solid var(--border);
}

:root[data-theme='dark'] a,
:root[data-theme='dark'] .rst-content a.reference,
:root[data-theme='dark'] .rst-content a.internal {
  color: var(--link) !important;
}

:root[data-theme='dark'] a:visited {
  color: var(--link-visited) !important;
}

:root[data-theme='dark'] .toctree-expand,
:root[data-theme='dark'] .caption-text,
:root[data-theme='dark'] .wy-menu-vertical a {
  color: var(--text) !important;
}

:root[data-theme='dark'] .wy-menu-vertical a:hover,
:root[data-theme='dark'] .wy-menu-vertical a:focus {
  background: #2a2a2a !important;
}

:root[data-theme='dark'] .wy-side-nav-search input[type="text"] {
  background: var(--bg) !important;
  color: var(--text) !important;
  border: 1px solid var(--border) !important;
}

:root[data-theme='dark'] .highlight pre,
:root[data-theme='dark'] code,
:root[data-theme='dark'] .literal-block {
  background: var(--code-bg) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
}


/* --- Width tweaks: widen main content area for RTD theme --- */
.wy-nav-content {
  max-width: 1200px; /* default is ~800px; widen for readability */
}

@media screen and (min-width: 1400px) {
  .wy-nav-content {
    max-width: 1400px;
  }
}

/* Prevent overflow on small screens */
.rst-content .highlight, .rst-content pre {
  overflow-x: auto;
}

:root[data-theme='dark'] .admonition,
:root[data-theme='dark'] .note,
:root[data-theme='dark'] .warning,
:root[data-theme='dark'] .seealso {
  background: var(--bg-elev) !important;
  color: var(--text) !important;
  border-left-color: var(--border) !important;
}

:root[data-theme='dark'] hr,
:root[data-theme='dark'] table,
:root[data-theme='dark'] thead,
:root[data-theme='dark'] td,
:root[data-theme='dark'] th {
  border-color: var(--border) !important;
}