/*
 * Open Agent Documentation Theme
 * Overrides nextra-theme-docs to match Open Agent's design system
 * Supports both light and dark modes - blue accent
 */

/* ============================================
   BASE COLORS & VARIABLES
   ============================================ */

:root {
  --nextra-primary-hue: 217deg; /* Blue */
  --nextra-primary-saturation: 91%;

  /* Premium easing curves */
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-out-quart: cubic-bezier(0.25, 1, 0.5, 1);
  --ease-spring: cubic-bezier(0.22, 1, 0.36, 1);
}

/* ============================================
   LAYOUT & STRUCTURE
   ============================================ */

html,
body {
  background-color: rgb(var(--background));
}

nav.nextra-nav-container {
  background: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.dark nav.nextra-nav-container {
  background: rgba(12, 11, 10, 0.8);
  border-bottom: 1px solid rgba(255, 248, 240, 0.06);
}

.nextra-sidebar-container {
  background: rgba(249, 250, 251, 0.5);
  backdrop-filter: blur(12px) saturate(150%);
  -webkit-backdrop-filter: blur(12px) saturate(150%);
  border-right: 1px solid rgba(0, 0, 0, 0.1);
}

.dark .nextra-sidebar-container {
  background: rgba(24, 23, 22, 0.5);
  border-right: 1px solid rgba(255, 248, 240, 0.1);
}

/* Sidebar ambient tint - blue */
.nextra-sidebar-container::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(59, 130, 246, 0.02) 0%,
    transparent 30%,
    transparent 70%,
    rgba(96, 165, 250, 0.015) 100%
  );
  pointer-events: none;
}

main.nextra-content {
  background-color: rgb(var(--background));
  border-radius: 0 !important;
}

/* Ensure no rounded corners on any layout containers */
main.nextra-content,
.nextra-main-content,
[class*="main-content"],
article {
  border-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}

.nextra-toc {
  border-left: 1px solid rgba(0, 0, 0, 0.06);
}

.dark .nextra-toc {
  border-left: 1px solid rgba(255, 248, 240, 0.06);
}

/* ============================================
   TYPOGRAPHY - Enhanced with Geist
   ============================================ */

.nextra-content h1,
.nextra-content h2,
.nextra-content h3,
.nextra-content h4 {
  color: rgb(var(--foreground));
  font-weight: 600;
  letter-spacing: -0.01em;
}

.nextra-content h1 {
  font-size: 2rem;
  letter-spacing: -0.025em;
}

.nextra-content h2 {
  font-size: 1.5rem;
  margin-top: 2.5rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.dark .nextra-content h2 {
  border-bottom-color: rgba(255, 248, 240, 0.06);
}

/* Override any bright white borders from Nextra */
h2,
.nextra-content h2,
article h2 {
  border-bottom-color: rgba(0, 0, 0, 0.06);
}

.dark h2,
.dark .nextra-content h2,
.dark article h2 {
  border-bottom-color: rgba(255, 248, 240, 0.06);
}

.nextra-content h3 {
  font-size: 1.25rem;
  margin-top: 2rem;
}

.nextra-content p,
.nextra-content li {
  color: rgb(var(--foreground-secondary));
  line-height: 1.75;
}

.nextra-content a {
  color: rgb(59, 130, 246);
  text-decoration: none;
  transition: color 150ms var(--ease-out-quart);
}

.nextra-content a:hover {
  color: rgb(37, 99, 235);
}

.dark .nextra-content a:hover {
  color: rgb(96, 165, 250);
}

.nextra-content strong {
  color: rgb(var(--foreground));
  font-weight: 600;
}

/* ============================================
   NAVIGATION & SIDEBAR - Premium styling
   ============================================ */

.nextra-sidebar-container a,
aside a,
[class*="sidebar"] a,
nav a:not(.nextra-nav-container a) {
  color: rgb(var(--foreground-secondary));
  border-radius: 0.5rem;
  transition: all 150ms var(--ease-out-quart);
  padding: 0.5rem 0.75rem;
  border: none;
  border-left: none;
}

.nextra-sidebar-container a:hover,
aside a:hover,
[class*="sidebar"] a:hover {
  color: rgb(var(--foreground));
  background-color: rgba(0, 0, 0, 0.04);
}

.dark .nextra-sidebar-container a:hover,
.dark aside a:hover,
.dark [class*="sidebar"] a:hover {
  background-color: rgba(255, 248, 240, 0.04);
}

/* Simplified active state - blue */
.nextra-sidebar-container a[data-active="true"],
.nextra-sidebar-container a.active,
aside a[data-active="true"],
aside a.active,
[class*="sidebar"] a[data-active="true"],
[class*="sidebar"] a.active,
li.active > a:only-child,
a[aria-current="page"] {
  color: rgb(59, 130, 246);
  background-color: rgba(59, 130, 246, 0.1);
  border: none;
  border-left: none;
  margin-left: 0;
  box-shadow: none;
  border-radius: 0.5rem;
}

/* Prevent parent containers from inheriting active background */
.nextra-sidebar-container li.active,
.nextra-sidebar-container ul.active,
.nextra-sidebar-container div.active {
  background-color: transparent;
}

.nextra-sidebar-container .nextra-menu-title,
aside .nextra-menu-title {
  color: rgb(var(--foreground-muted));
  font-size: 0.625rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: 500;
}

/* Sidebar section separators - blue */
aside li:not(:has(a)):not(:has(button)),
.nextra-sidebar-container li:not(:has(a)):not(:has(button)),
aside ul > li:only-child:not(:has(a)),
[class*="sidebar"] li:not(:has(a)):not(:has(button)) {
  color: rgb(59, 130, 246);
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  padding: 1rem 0.75rem 0.5rem;
  margin-top: 0.5rem;
  opacity: 1;
}

/* First separator doesn't need top margin */
aside ul > li:first-child:not(:has(a)):not(:has(button)) {
  margin-top: 0;
  padding-top: 0.5rem;
}

/* ============================================
   TABLE OF CONTENTS - Enhanced styling
   ============================================ */

.nextra-toc a {
  font-size: 0.8125rem;
  color: rgb(var(--foreground-muted));
  padding: 0.375rem 0.75rem;
  border-radius: 0.375rem;
  transition: all 150ms var(--ease-out-quart);
  display: block;
}

.nextra-toc a:hover {
  color: rgb(var(--foreground-secondary));
  background: rgba(0, 0, 0, 0.04);
}

.dark .nextra-toc a:hover {
  background: rgba(255, 248, 240, 0.04);
}

.nextra-toc a[data-active="true"],
.nextra-toc a.active {
  color: rgb(59, 130, 246);
  background: rgba(59, 130, 246, 0.1);
}

.nextra-toc-title {
  color: rgb(var(--foreground-muted));
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 0.5rem;
}

/* ============================================
   CODE BLOCKS - Premium styling - blue
   ============================================ */

.nextra-content code:not(pre code) {
  background-color: rgba(0, 0, 0, 0.06);
  color: rgb(37, 99, 235);
  padding: 0.125rem 0.5rem;
  border-radius: 0.375rem;
  font-size: 0.875em;
  font-family: var(--font-mono, ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace);
}

.dark .nextra-content code:not(pre code) {
  background-color: rgba(255, 248, 240, 0.06);
  color: rgb(147, 197, 253);
}

pre {
  background-color: rgba(249, 250, 251, 0.8);
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 0.75rem;
  backdrop-filter: blur(8px);
  box-shadow:
    0 2px 4px rgba(0, 0, 0, 0.04),
    0 4px 12px rgba(0, 0, 0, 0.06);
}

.dark pre {
  background-color: rgba(24, 23, 22, 0.8);
  border: 1px solid rgba(255, 248, 240, 0.06);
  box-shadow:
    0 2px 4px rgba(0, 0, 0, 0.08),
    0 4px 12px rgba(0, 0, 0, 0.12);
}

/* Top edge highlight on code blocks */
pre::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent 5%,
    rgba(0, 0, 0, 0.04) 50%,
    transparent 95%
  );
  pointer-events: none;
  border-radius: 0.75rem 0.75rem 0 0;
}

.dark pre::before {
  background: linear-gradient(
    90deg,
    transparent 5%,
    rgba(255, 255, 255, 0.06) 50%,
    transparent 95%
  );
}

pre code {
  font-family: var(--font-mono, ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace);
  font-size: 0.875rem;
  line-height: 1.6;
}

.nextra-code-block figcaption {
  background-color: rgba(0, 0, 0, 0.03);
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
  color: rgb(var(--foreground-muted));
  font-size: 0.75rem;
  font-family: var(--font-mono, ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace);
}

.dark .nextra-code-block figcaption {
  background-color: rgba(255, 248, 240, 0.03);
  border-bottom: 1px solid rgba(255, 248, 240, 0.06);
}

/* Copy button */
.nextra-code-block button[aria-label*="Copy"] {
  background: rgba(0, 0, 0, 0.04);
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 0.375rem;
  color: rgb(var(--foreground-muted));
  transition: all 150ms var(--ease-out-quart);
}

.dark .nextra-code-block button[aria-label*="Copy"] {
  background: rgba(255, 248, 240, 0.04);
  border: 1px solid rgba(255, 248, 240, 0.08);
}

.nextra-code-block button[aria-label*="Copy"]:hover {
  background: rgba(0, 0, 0, 0.08);
  border-color: rgba(0, 0, 0, 0.12);
  color: rgb(var(--foreground));
}

.dark .nextra-code-block button[aria-label*="Copy"]:hover {
  background: rgba(255, 248, 240, 0.08);
  border-color: rgba(255, 248, 240, 0.12);
}

/* ============================================
   CALLOUTS / ADMONITIONS - Premium styling
   ============================================ */

.nextra-callout {
  border-radius: 0.75rem;
  border: 1px solid rgba(0, 0, 0, 0.06);
  background-color: rgba(0, 0, 0, 0.02);
  backdrop-filter: blur(8px);
  position: relative;
  overflow: hidden;
}

.dark .nextra-callout {
  border: 1px solid rgba(255, 248, 240, 0.06);
  background-color: rgba(255, 248, 240, 0.02);
}

/* Top edge highlight */
.nextra-callout::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent 5%,
    rgba(0, 0, 0, 0.04) 50%,
    transparent 95%
  );
  pointer-events: none;
}

.dark .nextra-callout::before {
  background: linear-gradient(
    90deg,
    transparent 5%,
    rgba(255, 255, 255, 0.06) 50%,
    transparent 95%
  );
}

.nextra-callout[data-type="info"] {
  border-color: rgba(59, 130, 246, 0.3);
  background-color: rgba(59, 130, 246, 0.05);
}

.nextra-callout[data-type="warning"] {
  border-color: rgba(234, 179, 8, 0.3);
  background-color: rgba(234, 179, 8, 0.05);
}

.nextra-callout[data-type="error"] {
  border-color: rgba(248, 113, 113, 0.3);
  background-color: rgba(248, 113, 113, 0.05);
}

/* ============================================
   TABLES - Premium styling
   ============================================ */

.nextra-content table {
  border-collapse: collapse;
  width: 100%;
  margin: 1.5rem 0;
  border-radius: 0.75rem;
  overflow: hidden;
  border: 1px solid rgba(0, 0, 0, 0.06);
}

.dark .nextra-content table {
  border: 1px solid rgba(255, 248, 240, 0.06);
}

.nextra-content th {
  background-color: rgba(0, 0, 0, 0.04);
  color: rgb(var(--foreground-secondary));
  font-weight: 500;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 0.75rem 1rem;
  text-align: left;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.dark .nextra-content th {
  background-color: rgba(255, 248, 240, 0.04);
  border-bottom: 1px solid rgba(255, 248, 240, 0.08);
}

.nextra-content td {
  color: rgb(var(--foreground-secondary));
  padding: 0.75rem 1rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
}

.dark .nextra-content td {
  border-bottom: 1px solid rgba(255, 248, 240, 0.04);
}

.nextra-content tr:hover td {
  background-color: rgba(0, 0, 0, 0.02);
}

.dark .nextra-content tr:hover td {
  background-color: rgba(255, 248, 240, 0.02);
}

.nextra-content tr:last-child td {
  border-bottom: none;
}

/* ============================================
   LISTS
   ============================================ */

.nextra-content ul,
.nextra-content ol {
  padding-left: 1.5rem;
}

.nextra-content li {
  margin: 0.5rem 0;
}

.nextra-content li::marker {
  color: rgba(59, 130, 246, 0.6);
}

/* ============================================
   BLOCKQUOTES - Premium styling - blue
   ============================================ */

.nextra-content blockquote {
  border-left: 3px solid rgba(59, 130, 246, 0.4);
  background-color: rgba(59, 130, 246, 0.03);
  padding: 1rem 1.5rem;
  margin: 1.5rem 0;
  border-radius: 0 0.75rem 0.75rem 0;
  position: relative;
}

.nextra-content blockquote::before {
  content: '';
  position: absolute;
  top: 0;
  left: 3px;
  right: 0;
  height: 1px;
  background: linear-gradient(
    90deg,
    rgba(59, 130, 246, 0.2) 0%,
    transparent 100%
  );
  pointer-events: none;
}

.nextra-content blockquote p {
  color: rgb(var(--foreground-secondary));
  font-style: italic;
}

/* ============================================
   SEARCH - Premium styling - blue
   ============================================ */

.nextra-search input {
  background-color: rgba(0, 0, 0, 0.04);
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 0.5rem;
  color: rgb(var(--foreground));
  transition: all 150ms var(--ease-out-quart);
}

.dark .nextra-search input {
  background-color: rgba(255, 248, 240, 0.04);
  border: 1px solid rgba(255, 248, 240, 0.06);
}

.nextra-search input::placeholder {
  color: rgb(var(--foreground-muted));
}

.nextra-search input:focus {
  border-color: rgba(59, 130, 246, 0.5);
  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2);
  outline: none;
}

.nextra-search-results {
  background-color: rgb(255, 255, 255);
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 0.75rem;
  backdrop-filter: blur(20px);
  box-shadow:
    0 4px 8px rgba(0, 0, 0, 0.04),
    0 8px 24px rgba(0, 0, 0, 0.08),
    0 24px 48px rgba(0, 0, 0, 0.1);
}

.dark .nextra-search-results {
  background-color: rgb(24, 23, 22);
  border: 1px solid rgba(255, 248, 240, 0.08);
  box-shadow:
    0 4px 8px rgba(0, 0, 0, 0.08),
    0 8px 24px rgba(0, 0, 0, 0.14),
    0 24px 48px rgba(0, 0, 0, 0.18);
}

/* ============================================
   BREADCRUMBS
   ============================================ */

.nextra-breadcrumb {
  color: rgb(var(--foreground-muted));
}

.nextra-breadcrumb a {
  color: rgb(var(--foreground-muted));
  transition: color 150ms var(--ease-out-quart);
}

.nextra-breadcrumb a:hover {
  color: rgb(var(--foreground-secondary));
}

/* ============================================
   PAGINATION - Premium styling
   ============================================ */

/* Remove the separator line above pagination */
nav:has(.nextra-nav-link),
.nextra-content + nav,
article + nav,
main > nav:last-child {
  border: none !important;
  margin-top: 2rem;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
}

/* When there's only one nav link (first or last page), align appropriately */
nav:has(.nextra-nav-link:only-child) {
  justify-content: flex-end;
}

/* Hide any hr/separator that appears before pagination */
hr:has(+ nav:has(.nextra-nav-link)),
.nextra-content > hr:last-of-type,
article > hr:last-of-type,
[class*="separator"]:has(+ nav),
[class*="divider"]:has(+ nav) {
  display: none;
}

.nextra-nav-link {
  background-color: rgba(0, 0, 0, 0.02);
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 0.75rem;
  padding: 1rem;
  transition: all 150ms var(--ease-out-quart);
  position: relative;
  overflow: hidden;
}

.dark .nextra-nav-link {
  background-color: rgba(255, 248, 240, 0.02);
  border: 1px solid rgba(255, 248, 240, 0.06);
}

/* Top edge highlight */
.nextra-nav-link::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent 5%,
    rgba(0, 0, 0, 0.04) 50%,
    transparent 95%
  );
  pointer-events: none;
}

.dark .nextra-nav-link::before {
  background: linear-gradient(
    90deg,
    transparent 5%,
    rgba(255, 255, 255, 0.04) 50%,
    transparent 95%
  );
}

.nextra-nav-link:hover {
  background-color: rgba(0, 0, 0, 0.04);
  border-color: rgba(0, 0, 0, 0.1);
  box-shadow:
    0 2px 4px rgba(0, 0, 0, 0.04),
    0 4px 12px rgba(0, 0, 0, 0.06);
  transform: translateY(-1px);
}

.dark .nextra-nav-link:hover {
  background-color: rgba(255, 248, 240, 0.04);
  border-color: rgba(255, 248, 240, 0.1);
  box-shadow:
    0 2px 4px rgba(0, 0, 0, 0.08),
    0 4px 12px rgba(0, 0, 0, 0.12);
}

.nextra-nav-link span {
  color: rgb(var(--foreground-muted));
}

.nextra-nav-link-title {
  color: rgb(var(--foreground));
}

/* ============================================
   THEME TOGGLE
   ============================================ */

.nextra-theme-toggle button {
  background-color: rgba(0, 0, 0, 0.04);
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 0.5rem;
  transition: all 150ms var(--ease-out-quart);
}

.dark .nextra-theme-toggle button {
  background-color: rgba(255, 248, 240, 0.04);
  border: 1px solid rgba(255, 248, 240, 0.06);
}

.nextra-theme-toggle button:hover {
  background-color: rgba(0, 0, 0, 0.08);
  border-color: rgba(0, 0, 0, 0.1);
}

.dark .nextra-theme-toggle button:hover {
  background-color: rgba(255, 248, 240, 0.08);
  border-color: rgba(255, 248, 240, 0.1);
}

/* ============================================
   SCROLLBARS - Premium styling
   ============================================ */

::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.08);
  border-radius: 100px;
  border: 2px solid transparent;
  background-clip: padding-box;
}

::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 0, 0, 0.15);
  border: 2px solid transparent;
  background-clip: padding-box;
}

::-webkit-scrollbar-thumb:active {
  background: rgba(59, 130, 246, 0.25);
  border: 2px solid transparent;
  background-clip: padding-box;
}

.dark ::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.08);
}

.dark ::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.15);
}

::-webkit-scrollbar-corner {
  background: transparent;
}

/* ============================================
   MISC OVERRIDES
   ============================================ */

.nextra-content hr {
  border-color: rgba(0, 0, 0, 0.06);
  margin: 2rem 0;
}

.dark .nextra-content hr {
  border-color: rgba(255, 248, 240, 0.06);
}

::selection {
  background: rgba(59, 130, 246, 0.3);
}

*:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.4);
}

/* Hide the Nextra footer - not needed */
footer {
  display: none;
}

/* ============================================
   AGGRESSIVE NEXTRA OVERRIDES
   ============================================ */

aside a,
aside button,
aside span,
nav:not(.nextra-nav-container) a,
[class*="sidebar"] a,
[class*="menu"] a,
[role="navigation"] a {
  color: rgb(var(--foreground-secondary));
}

aside a[data-active="true"],
aside a[aria-current="page"],
aside a[aria-selected="true"],
aside li.active > a,
[class*="sidebar"] a[data-active="true"],
[class*="sidebar"] a.active {
  color: rgb(59, 130, 246);
  background-color: rgba(59, 130, 246, 0.1);
  border: none;
  border-left: none;
  border-radius: 0.5rem;
}

/* Prevent folder/section containers from getting active background */
aside li.active,
aside div.active,
aside ul.active,
aside details.active,
aside summary.active,
[class*="sidebar"] li.active:not(:has(> a[data-active="true"])),
[class*="sidebar"] div.active,
[class*="sidebar"] ul.active {
  background-color: transparent;
}

aside a:hover,
[class*="sidebar"] a:hover {
  color: rgb(var(--foreground));
  background-color: rgba(0, 0, 0, 0.04);
}

.dark aside a:hover,
.dark [class*="sidebar"] a:hover {
  background-color: rgba(255, 248, 240, 0.04);
}

/* ============================================
   SIDEBAR FOOTER SEPARATOR
   ============================================ */

/* Add top border to sidebar footer section (theme toggle, collapse button area) */
.nextra-sidebar-container > div:last-child,
aside.nextra-sidebar-container > div:last-child {
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  margin-top: auto;
  padding-top: 0.75rem;
}

.dark .nextra-sidebar-container > div:last-child,
.dark aside.nextra-sidebar-container > div:last-child {
  border-top: 1px solid rgba(255, 248, 240, 0.06);
}

/* ============================================
   SIDEBAR COLLAPSED STATE & CORNER FIXES
   ============================================ */

/* Remove all rounded corners from sidebar in any state */
.nextra-sidebar-container,
aside.nextra-sidebar-container,
[class*="sidebar-container"],
aside[class*="nextra"],
.nextra-sidebar-container *,
aside.nextra-sidebar-container * {
  border-radius: 0 !important;
}

/* Fix collapsed sidebar - extend to full height, remove floating box effect */
.nextra-sidebar-container[data-collapsed="true"],
aside[data-collapsed="true"],
.nextra-sidebar-container:has(> div:only-child),
[class*="sidebar"][class*="collapsed"] {
  background: rgba(249, 250, 251, 0.5) !important;
  backdrop-filter: blur(12px) saturate(150%) !important;
  -webkit-backdrop-filter: blur(12px) saturate(150%) !important;
  border-right: 1px solid rgba(0, 0, 0, 0.1) !important;
  height: 100% !important;
  border-radius: 0 !important;
}

.dark .nextra-sidebar-container[data-collapsed="true"],
.dark aside[data-collapsed="true"],
.dark .nextra-sidebar-container:has(> div:only-child),
.dark [class*="sidebar"][class*="collapsed"] {
  background: rgba(24, 23, 22, 0.5) !important;
  border-right: 1px solid rgba(255, 248, 240, 0.1) !important;
}

/* Remove background/border from inner containers in collapsed state to prevent floating box */
.nextra-sidebar-container > div,
aside.nextra-sidebar-container > div {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Keep the footer separator visible */
.nextra-sidebar-container > div:last-child,
aside.nextra-sidebar-container > div:last-child {
  border-top: 1px solid rgba(0, 0, 0, 0.06) !important;
}

.dark .nextra-sidebar-container > div:last-child,
.dark aside.nextra-sidebar-container > div:last-child {
  border-top: 1px solid rgba(255, 248, 240, 0.06) !important;
}

/* Specifically remove the bottom-left radius from the sidebar wrapper */
.nextra-sidebar-container > div,
aside > div {
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

/* Fix any pseudo-elements that might create the corner effect */
.nextra-sidebar-container::after,
.nextra-sidebar-container::before,
aside::after,
aside::before {
  border-radius: 0 !important;
}

/* ============================================
   MOBILE SIDEBAR FIXES
   ============================================ */

@media (max-width: 767px) {
  .nextra-sidebar-container,
  aside.nextra-sidebar-container,
  [class*="sidebar-container"] {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 50;
    width: 280px;
    max-width: 80vw;
    transform: translateX(-100%);
    transition: transform 200ms var(--ease-out-expo);
  }

  .nextra-sidebar-container[data-open="true"],
  aside[data-open="true"],
  body.nextra-menu-active .nextra-sidebar-container,
  body.nextra-menu-active aside.nextra-sidebar-container {
    display: flex;
    transform: translateX(0);
  }

  .nextra-content,
  main.nextra-content,
  article {
    width: 100%;
    max-width: 100%;
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .nextra-toc,
  nav.nextra-toc {
    display: none;
  }

  body.nextra-menu-active::before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(4px);
    z-index: 40;
  }
}

@media (max-width: 480px) {
  .nextra-content h1 {
    font-size: 1.5rem;
  }

  .nextra-content h2 {
    font-size: 1.25rem;
  }

  .nextra-content h3 {
    font-size: 1.1rem;
  }

  pre code {
    font-size: 0.8rem;
  }

  .nextra-callout {
    padding: 0.75rem;
  }
}

/* Force all borders/separators to be subtle */
hr,
[class*="border"],
h2,
article h2,
.nextra-content h2 {
  border-color: rgba(0, 0, 0, 0.06);
}

.dark hr,
.dark [class*="border"],
.dark h2,
.dark article h2,
.dark .nextra-content h2 {
  border-color: rgba(255, 248, 240, 0.06);
}
