/* ============================================
   Global Base Font Size - Ensures Consistency Across All Pages
   ============================================ */
:root {
  font-size: 16px !important; /* Base 16px for rem calculations */
}

html {
  font-size: 16px !important;
}

body {
  font-size: 0.9375rem !important; /* 15px base text */
  line-height: 1.6 !important;
}

/* Force consistent content width and padding across all pages */
.md-main__inner {
  max-width: 100% !important;
}

.md-content__inner {
  padding-top: 1.5rem !important;
  padding-bottom: 3rem !important;
}

/* ============================================
   Hero Section - Full Width Dark Banner
   ============================================ */
.hero-section {
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  margin-top: -2rem;
  margin-bottom: 3rem;
  padding: 4rem 2rem;
  text-align: center;
  background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%);
  color: #ffffff;
}

[data-md-color-scheme="default"] .hero-section {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
}

.hero-section h1 {
  font-family: "Roboto", -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 2rem; /* 32px - Smaller PyPI hero size */
  font-weight: 700;
  line-height: 1.2;
  margin: 0 auto 0.875rem;
  max-width: 800px;
  color: #ffffff;
}

.hero-section p {
  font-size: 0.9375rem; /* 15px - Smaller PyPI body size */
  line-height: 1.6;
  margin: 0 auto 1.75rem;
  max-width: 700px;
  color: rgba(255, 255, 255, 0.9);
  font-weight: 400;
}

.hero-section .md-button {
  margin: 0.5rem;
  padding: 0.75rem 2rem;
  font-weight: 600;
  border-radius: 6px;
  transition: all 0.2s ease;
}

.hero-section .md-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

@media screen and (max-width: 768px) {
  .hero-section {
    padding: 2.5rem 1.25rem;
  }

  .hero-section h1 {
    font-size: 1.5rem; /* 24px - Mobile PyPI hero */
  }

  .hero-section p {
    font-size: 0.875rem; /* 14px - Mobile body */
  }

  .hero-section .md-button {
    display: block;
    margin: 0.625rem auto;
    max-width: 280px;
    font-size: 0.875rem;
  }
}

/* ============================================
   Typography Enhancements - PyPI Style (ALL pages)
   ============================================ */
.md-typeset h1,
.md-typeset h2,
.md-typeset h3,
.md-typeset h4,
.md-typeset h5,
.md-typeset h6,
.md-content h1,
.md-content h2,
.md-content h3,
.md-content h4,
.md-content h5,
.md-content h6,
article h1,
article h2,
article h3,
article h4,
article h5,
article h6 {
  font-family:
    "Roboto",
    -apple-system,
    BlinkMacSystemFont,
    sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
}

/* Body text font family - ALL pages */
.md-typeset,
.md-typeset p,
.md-typeset li,
.md-content,
.md-content p,
.md-content li,
article,
article p,
article li {
  font-family:
    "Roboto",
    -apple-system,
    BlinkMacSystemFont,
    sans-serif !important;
}

/* Font sizes are defined in the Font hierarchy section below with !important flags */

/* ============================================
   Code Block Enhancements - PyPI Style (ALL pages)
   ============================================ */
.md-typeset code,
.md-content code,
article code {
  font-family: "Roboto Mono", "Consolas", "Monaco", monospace !important;
  font-size: 0.8125rem !important; /* 13px - PyPI inline code */
  padding: 0.2em 0.4em !important;
  border-radius: 3px !important;
}

.md-typeset pre code,
.md-content pre code,
article pre code {
  font-size: 0.8125rem !important; /* 13px - PyPI code block */
  line-height: 1.5 !important;
  padding: 0 !important;
}

.md-typeset .highlight pre {
  padding: 1.25rem;
  border-radius: 8px;
  background-color: #1e293b;
}

[data-md-color-scheme="default"] .md-typeset .highlight pre {
  background-color: #f8fafc;
  border: 1px solid #e2e8f0;
}

/* ============================================
   Navigation Sidebar Refinements
   ============================================ */
.md-nav__item {
  line-height: 1.4;
}

.md-nav__link--active {
  font-weight: 600;
  color: var(--md-accent-fg-color);
}

.md-nav__link:hover {
  color: var(--md-accent-fg-color);
}

/* ============================================
   Table Styling - PyPI Style (ALL pages)
   ============================================ */
.md-typeset table:not([class]),
.md-content table:not([class]),
article table:not([class]) {
  border-radius: 6px;
  overflow: hidden;
  border: 1px solid var(--md-default-fg-color--lightest);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
  font-size: 0.8125rem !important; /* 13px - PyPI table text */
  margin-bottom: 1rem !important;
  width: 100% !important;
}

.md-typeset table:not([class]) th,
.md-content table:not([class]) th,
article table:not([class]) th {
  background-color: var(--md-default-fg-color--lightest);
  font-weight: 600 !important;
  text-align: left;
  padding: 0.625rem 0.875rem !important;
  font-size: 0.8125rem !important; /* 13px */
}

.md-typeset table:not([class]) td,
.md-content table:not([class]) td,
article table:not([class]) td {
  padding: 0.625rem 0.875rem !important;
  border-top: 1px solid var(--md-default-fg-color--lightest);
  font-size: 0.8125rem !important; /* 13px */
}

.md-typeset table:not([class]) tbody tr:nth-child(even) {
  background-color: rgba(0, 0, 0, 0.02);
}

[data-md-color-scheme="slate"]
  .md-typeset
  table:not([class])
  tbody
  tr:nth-child(even) {
  background-color: rgba(255, 255, 255, 0.02);
}

/* ============================================
   Admonitions (ALL pages)
   ============================================ */
.md-typeset .admonition,
.md-content .admonition,
article .admonition {
  border-radius: 6px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  border-left: 4px solid var(--md-accent-fg-color);
  font-size: 0.9375rem !important; /* 15px */
  margin-bottom: 1rem !important;
}

.md-typeset .admonition-title,
.md-content .admonition-title,
article .admonition-title {
  font-weight: 600 !important;
  padding-left: 2.5rem !important;
  font-size: 0.9375rem !important; /* 15px */
}

.md-typeset .admonition p,
.md-content .admonition p,
article .admonition p {
  font-size: 0.9375rem !important; /* 15px */
  margin-bottom: 0.5rem !important;
}

.md-typeset .admonition li,
.md-content .admonition li,
article .admonition li {
  font-size: 0.9375rem !important; /* 15px */
}

/* ============================================
   Footer Adjustments
   ============================================ */
.md-footer-meta__inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.md-footer-meta .md-copyright {
  display: none;
}

/* ============================================
   Smooth Scrolling & Misc
   ============================================ */
html {
  scroll-behavior: smooth;
}

.md-typeset a {
  transition: color 0.15s ease;
}

.md-typeset hr {
  border: none;
  border-top: 1px solid var(--md-default-fg-color--lightest);
  margin: 2.5rem 0;
}

/* Hide keyboard shortcuts modal/overlay if accidentally visible */
.md-dialog,
[data-md-component="dialog"],
.md-typeset kbd,
button[data-md-component="skip"] {
  display: none !important;
}

/* ============================================
   Custom Primary Color — Override Purple
   ============================================ */
:root {
  --md-primary-fg-color: #0f172a;
  --md-primary-fg-color--light: #1e293b;
  --md-primary-fg-color--dark: #020617;
  --md-primary-bg-color: #ffffff;
  --md-primary-bg-color--light: #f8fafc;
}

/* Force navbar text white */
.md-header,
.md-tabs {
  background-color: #0f172a;
  color: #ffffff;
}

.md-tabs__link,
.md-header__title {
  color: #ffffff !important;
}

/* Hero font fix - PyPI Style */
.hero-section h1 {
  font-family: "Roboto", -apple-system, BlinkMacSystemFont, sans-serif !important;
  font-size: 2rem; /* 32px - Smaller hero */
  font-weight: 700;
  color: #0f172a;
  letter-spacing: -0.02em;
}

[data-md-color-scheme="slate"] .hero-section h1 {
  color: #f8fafc;
}

/* Fix hero background for light mode */
[data-md-color-scheme="default"] .hero-section {
  background: #f1f5f9;
}

/* ============================================
   Font hierarchy - PyPI Style (Smaller)
   IMPORTANT: Applied globally to ALL pages
   ============================================ */
   
/* Set base font size for entire content area - ALL PAGES */
.md-content,
.md-content__inner,
.md-typeset,
article.md-content__inner {
  font-size: 0.9375rem !important; /* 15px base */
}

/* Headings - Consistent across ALL pages */
.md-typeset h1,
.md-content h1,
article h1 {
  font-size: 1.75rem !important; /* 28px - PyPI project title */
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
  color: #0f172a;
  margin-bottom: 0.75rem !important;
  margin-top: 0 !important;
  line-height: 1.3 !important;
}

.md-typeset h2,
.md-content h2,
article h2 {
  font-size: 1.375rem !important; /* 22px - PyPI section heading */
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
  color: #1e293b;
  border-bottom: 1px solid #e2e8f0 !important;
  padding-bottom: 0.4rem !important;
  margin-top: 1.75rem !important;
  margin-bottom: 0.75rem !important;
  line-height: 1.3 !important;
}

.md-typeset h3,
.md-content h3,
article h3 {
  font-size: 1.125rem !important; /* 18px - PyPI subsection heading */
  font-weight: 600 !important;
  color: #334155;
  margin-top: 1.25rem !important;
  margin-bottom: 0.625rem !important;
  line-height: 1.4 !important;
}

.md-typeset h4,
.md-content h4,
article h4 {
  font-size: 1rem !important; /* 16px */
  font-weight: 600 !important;
  color: #475569;
  margin-top: 1rem !important;
  margin-bottom: 0.5rem !important;
  line-height: 1.4 !important;
}

.md-typeset h5,
.md-content h5,
article h5 {
  font-size: 0.9375rem !important; /* 15px */
  font-weight: 600 !important;
  color: #475569;
  margin-top: 1rem !important;
  margin-bottom: 0.5rem !important;
  line-height: 1.4 !important;
}

.md-typeset h6,
.md-content h6,
article h6 {
  font-size: 0.875rem !important; /* 14px */
  font-weight: 600 !important;
  color: #64748b;
  margin-top: 0.875rem !important;
  margin-bottom: 0.5rem !important;
  line-height: 1.4 !important;
}

/* Paragraphs and text - ALL pages */
.md-typeset p,
.md-content p,
article p,
.md-typeset div,
.md-content div {
  font-size: 0.9375rem !important; /* 15px - PyPI body text */
  line-height: 1.6 !important;
  color: #475569;
  font-weight: 400 !important;
  margin-bottom: 1rem;
}

/* Lists - ALL pages */
.md-typeset ul,
.md-typeset ol,
.md-content ul,
.md-content ol,
article ul,
article ol {
  font-size: 0.9375rem !important; /* 15px */
  line-height: 1.6 !important;
  margin-bottom: 1rem !important;
}

.md-typeset li,
.md-content li,
article li,
.md-typeset ul li,
.md-typeset ol li,
.md-content ul li,
.md-content ol li {
  margin-bottom: 0.4rem !important;
  font-size: 0.9375rem !important; /* 15px */
  line-height: 1.6 !important;
}

/* Code blocks - ALL pages */
.md-typeset pre,
.md-typeset pre code,
.md-content pre,
.md-content pre code,
article pre,
article pre code {
  font-size: 0.8125rem !important; /* 13px */
  line-height: 1.5 !important;
}

/* Inline code - ALL pages */
.md-typeset code,
.md-content code,
article code {
  font-size: 0.8125rem !important; /* 13px */
}

/* ============================================
   Navigation Font Size Hierarchy - PyPI Style
   ============================================ */

/* Top navbar tabs */
.md-tabs__link {
  font-size: 0.8125rem; /* 13px - PyPI navigation (smaller) */
  font-weight: 500;
  letter-spacing: 0.01em;
}

/* Sidebar nav — top level */
.md-nav--primary .md-nav__link {
  font-size: 0.8125rem; /* 13px */
  font-weight: 500;
}

/* Sidebar nav — section titles */
.md-nav__title {
  font-size: 0.8125rem; /* 13px */
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

/* Sidebar nav — nested items */
.md-nav--secondary .md-nav__link {
  font-size: 0.8125rem; /* 13px */
  font-weight: 400;
}

/* Sidebar nav — active item */
.md-nav__link--active {
  font-size: 0.8125rem; /* 13px */
  font-weight: 600;
}

/* Header title */
.md-header__title {
  font-size: 0.9375rem; /* 15px - PyPI header (smaller) */
  font-weight: 600;
  letter-spacing: -0.01em;
}

/* Dark mode colors - consistent across ALL pages */
[data-md-color-scheme="slate"] .md-typeset h1,
[data-md-color-scheme="slate"] .md-content h1,
[data-md-color-scheme="slate"] article h1 { 
  color: #f1f5f9 !important; 
}

[data-md-color-scheme="slate"] .md-typeset h2,
[data-md-color-scheme="slate"] .md-content h2,
[data-md-color-scheme="slate"] article h2 { 
  color: #e2e8f0 !important;
  border-bottom-color: #334155 !important;
}

[data-md-color-scheme="slate"] .md-typeset h3,
[data-md-color-scheme="slate"] .md-content h3,
[data-md-color-scheme="slate"] article h3 { 
  color: #cbd5e1 !important; 
}

[data-md-color-scheme="slate"] .md-typeset h4,
[data-md-color-scheme="slate"] .md-content h4,
[data-md-color-scheme="slate"] article h4 { 
  color: #94a3b8 !important; 
}

[data-md-color-scheme="slate"] .md-typeset p,
[data-md-color-scheme="slate"] .md-content p,
[data-md-color-scheme="slate"] article p { 
  color: #94a3b8 !important; 
}

[data-md-color-scheme="slate"] .md-typeset li,
[data-md-color-scheme="slate"] .md-content li,
[data-md-color-scheme="slate"] article li { 
  color: #94a3b8 !important; 
}