/* Custom CSS Variables for Easy Color and Font Customization */

:root {
  /* Custom Color Palette - Dark Mode (Default) */
  --md-primary-fg-color: #00bcd4;          /* Primary color - Cyan */
  --md-primary-fg-color--light: #4dd0e1;   /* Light cyan */
  --md-primary-fg-color--dark: #0097a7;    /* Dark cyan */
  --md-accent-fg-color: #7b7830;           /* Accent color - Brown/olive */
  --md-accent-fg-color--transparent: #7b78301a; /* Transparent accent */
  
  /* Custom Background Colors */
  --md-default-bg-color: #1a1a1a;        
  --md-default-bg-color--light: #2d2d2d;  
  --md-default-bg-color--lighter: #404040; 
  --md-default-bg-color--lightest: #525252;
  
  --md-default-fg-color: #ffffffde;        
  --md-default-fg-color--light: #ffffff99; 
  --md-default-fg-color--lighter: #ffffff61; 
  --md-default-fg-color--lightest: #ffffff1f; 
  
  --md-typeset-a-color: #00bcd4;           
  --md-typeset-a-color--hover: #4dd0e1;    
  
  --md-code-bg-color: #2d2d2d;             
  --md-code-fg-color: #ffffffde;          
  
  /* Custom Fonts */
  --md-text-font: "Gotham Bold", "Gotham", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --md-code-font: "JetBrains Mono", "Roboto Mono", "SF Mono", Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  
  /* Custom Spacing */
  --md-content-max-width: 1200px;          /* Max content width */
  --md-sidebar-width: 300px;               /* Sidebar width */
  
  /* Custom Border Radius */
  --md-border-radius: 8px;                 /* Border radius */
  
  /* Custom Shadows */
  --md-shadow-z1: 0 1px 3px rgba(0,0,0,.12), 0 1px 2px rgba(0,0,0,.24);
  --md-shadow-z2: 0 3px 6px rgba(0,0,0,.16), 0 3px 6px rgba(0,0,0,.23);
  --md-shadow-z3: 0 10px 20px rgba(0,0,0,.19), 0 6px 6px rgba(0,0,0,.23);
  --md-content-h1-border-color: #9ad6f5;    /* Cyan for H1 in dark mode */
  --md-content-h2-border-color: #7b7830;    /* Brown/olive for H2 in dark mode */
  --md-content-blockquote-border-color: #00bcd4; /* Cyan for blockquotes */
  --md-content-hr-gradient: linear-gradient(90deg, transparent, #00bcd4, transparent); /* Cyan gradient */

  /* Navigation Elements */
  --md-nav-link-border-color: #7b7830;     /* Brown/olive for nav links */
  --md-nav-active-border-color: #00bcd4;   /* Cyan for active nav */
  --md-sidebar-title-border-color: #7b7830; /* Brown/olive for sidebar titles */
  --md-tabs-border-color: #7b7830;         /* Brown/olive for tabs */
  --md-tabs-active-border-color: #00bcd4;  /* Cyan for active tabs */

  /* Data Elements */
  --md-table-border-color: #7b7830;        /* Brown/olive for tables */
  --md-code-border-color: #7b7830;         /* Brown/olive for code blocks */
  --md-admonition-border-color: #7b7830;   /* Brown/olive for admonitions */

  /* Layout Elements */
  --md-footer-border-color: #7b7830;       /* Brown/olive for footer */
  --md-sidebar-border-color: #7b7830;      /* Brown/olive for sidebar */
  --md-search-border-color: #7b7830;       /* Brown/olive for search */
  --md-content-border-color: #7b7830;      /* Brown/olive for content areas */
}

/* Apply Custom Fonts */
.md-content {
  font-family: var(--md-text-font);
}

/* Custom Header/Navbar Styling */
.md-header {
  background-color: #70a058 !important;
}

.md-header[data-md-state=shadow] {
  box-shadow: 0 0 0.2rem rgba(0,0,0,.1), 0 0.2rem 0.4rem rgba(0,0,0,.2);
}

/* Ensure header text remains readable */
.md-header__title {
  color: white !important;
}

.md-header__button {
  color: white !important;
}

.md-header__button:hover {
  color: rgba(255, 255, 255, 0.8) !important;
}

/* Header navigation links */
.md-header__source {
  color: white !important;
}

/* Search bar in header */
.md-search__input {
  background-color: rgba(255, 255, 255, 0.1) !important;
  color: white !important;
}

.md-search__input::placeholder {
  color: rgba(255, 255, 255, 0.7) !important;
}

/* Search suggestions */
.md-search__suggest {
  background-color: #70a058 !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.md-content code {
  font-family: var(--md-code-font);
}

.md-header {
  font-family: var(--md-text-font);
}

.md-nav {
  font-family: var(--md-text-font);
}

/* Custom Styling for Better Obsidian-like Appearance */
.md-content {
  line-height: 1.6;
  font-size: 16px;
}

.md-content h1,
.md-content h2,
.md-content h3,
.md-content h4,
.md-content h5,
.md-content h6 {
  font-weight: 600;
  line-height: 1.3;
  margin-top: 2em;
  margin-bottom: 1em;
}

.md-content h1 {
  font-size: 2.25em;
  color: var(--md-default-fg-color);
  border-bottom: 2px solid var(--md-primary-fg-color) !important;
  padding-bottom: 0.3em;
}

.md-content h2 {
  font-size: 1.8em;
  color: var(--md-default-fg-color);
  border-bottom: 1px solid var(--md-content-h2-border-color) !important; 
  padding-bottom: 0.2em;
}

.md-content h3 {
  font-size: 1.5em;
}

.md-content h4 {
  font-size: 1.25em;
}

/* Custom Code Block Styling */
.md-content pre {
  border-radius: var(--md-border-radius);
  box-shadow: var(--md-shadow-z1);
  border: 1px solid var(--md-accent-fg-color);
}

.md-content code {
  background-color: var(--md-code-bg-color);
  color: var(--md-code-fg-color);
  padding: 0.2em 0.4em;
  border-radius: 4px;
  font-size: 0.9em;
}

/* Custom Blockquote Styling */
.md-content blockquote {
  border-left: 4px solid var(--md-primary-fg-color);
  background-color: var(--md-default-bg-color--light);
  padding: 1em;
  margin: 1.5em 0;
  border-radius: 0 var(--md-border-radius) var(--md-border-radius) 0;
}

/* Custom Table Styling */
.md-content table {
  border-radius: var(--md-border-radius);
  overflow: hidden;
  box-shadow: var(--md-shadow-z1);
}

.md-content th {
  background-color: var(--md-accent-fg-color);
  color: white;
  font-weight: 600;
}

/* Custom Link Styling */
.md-content a {
  color: var(--md-typeset-a-color);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: all 0.2s ease;
}

.md-content a:hover {
  color: var(--md-typeset-a-color--hover);
  border-bottom-color: var(--md-typeset-a-color--hover);
}

/* Custom List Styling */
.md-content ul,
.md-content ol {
  padding-left: 1.5em;
}

.md-content li {
  margin: 0.5em 0;
}

/* Custom Horizontal Rule - All use olive green */
.md-content hr,
.md-typeset hr {
  border: none !important;
  height: 2px !important;
  background: linear-gradient(90deg, transparent, var(--md-accent-fg-color), transparent) !important;
  margin: 2em 0 !important;
}

/* Override Material theme green color with olive green */
[data-md-color-primary="custom"] {
  --md-primary-fg-color: #00bcd4;
  --md-primary-fg-color--light: #4dd0e1;
  --md-primary-fg-color--dark: #0097a7;
  --md-accent-fg-color: #7b7830;
  --md-accent-fg-color--transparent: #7b78301a;
}

/* Override any Material theme green colors */
[data-md-color-primary="green"] {
  --md-primary-fg-color: #7b7830;
  --md-primary-fg-color--light: #8b8840;
  --md-primary-fg-color--dark: #6b6830;
  --md-accent-fg-color: #7b7830;
  --md-accent-fg-color--transparent: #7b78301a;
}

/* Force olive green override for all Material theme states */
[data-md-color-primary="green"],
[data-md-color-primary="custom"],
[data-md-color-scheme="slate"] {
  --md-accent-fg-color: #7b7830 !important;
  --md-accent-fg-color--transparent: #7b78301a !important;
}

/* Override Material theme's default green color variables */
:root {
  --md-default-fg-color--lightest: #7b7830 !important;
}

/* Force all accent colors to use olive green */
* {
  --md-accent-fg-color: #7b7830 !important;
}

/* Override any Material theme color overrides */
[data-md-color-scheme] {
  --md-accent-fg-color: #7b7830 !important;
}

/* Force dark mode colors immediately to prevent flash */
html, body {
  background-color: #1a1a1a !important;
  color: #ffffffde !important;
}

/* Force all text to be light color except links and highlights */
.md-content,
.md-content p,
.md-content div,
.md-content span,
.md-content li,
.md-content td,
.md-content th,
.md-content blockquote,
.md-content pre,
.md-content code,
.md-content h1,
.md-content h2,
.md-content h3,
.md-content h4,
.md-content h5,
.md-content h6,
.md-nav__title,
.md-nav__link,
.md-sidebar,
.md-header,
.md-footer,
.md-search,
.md-tabs,
.md-typeset,
.md-typeset p,
.md-typeset div,
.md-typeset span,
.md-typeset li,
.md-typeset td,
.md-typeset th,
.md-typeset blockquote,
.md-typeset pre,
.md-typeset code,
.md-typeset h1,
.md-typeset h2,
.md-typeset h3,
.md-typeset h4,
.md-typeset h5,
.md-typeset h6 {
  color: #ffffffde !important;
}

/* Keep links and highlighted elements with their specific colors */
.md-content a,
.md-typeset a {
  color: var(--md-typeset-a-color) !important;
}

/* Sidebar and navigation links use light color */
.md-nav__link[href],
.md-search__input,
.md-search__suggest a,
.md-tabs__link,
.md-footer__link {
  color: #ffffffde !important;
}

/* Prevent any light mode flash */
[data-md-color-scheme="default"] {
  --md-default-bg-color: #1a1a1a !important;
  --md-default-fg-color: #ffffffde !important;
  --md-primary-fg-color: #00bcd4 !important;
  --md-accent-fg-color: #7b7830 !important;
}

/* Custom Border and Line Colors - Light Mode */
.md-content h1 {
  border-bottom-color: var(--md-content-h1-border-color) !important;
}

.md-content h2 {
  border-bottom-color: var(--md-accent-fg-color) !important;
}

/* Navigation borders and dividers */
.md-nav__link {
  border-left-color: var(--md-accent-fg-color) !important;
}

.md-nav__link--active {
  border-left-color: var(--md-primary-fg-color) !important;
}

/* Sidebar navigation borders */
.md-nav__title {
  color: var(--md-default-fg-color) !important;
  border-bottom-color: var(--md-accent-fg-color) !important;
}

/* Table borders */
.md-content table {
  border-color: var(--md-accent-fg-color) !important;
}

.md-content th {
  border-color: var(--md-accent-fg-color) !important;
}

.md-content td {
  border-color: var(--md-accent-fg-color) !important;
}

/* Code block borders */
.md-content pre {
  border-color: var(--md-accent-fg-color) !important;
}

/* Blockquote borders */
.md-content blockquote {
  border-left-color: var(--md-primary-fg-color) !important;
}

/* Admonition borders */
.md-typeset .admonition {
  border-color: var(--md-accent-fg-color) !important;
}

.md-typeset .admonition-title {
  border-bottom-color: var(--md-accent-fg-color) !important;
}

/* Tab navigation borders */
.md-tabs {
  border-bottom-color: var(--md-accent-fg-color) !important;
}

.md-tabs__link {
  border-bottom-color: var(--md-accent-fg-color) !important;
}

.md-tabs__link--active {
  border-bottom-color: var(--md-primary-fg-color) !important;
}

/* Footer borders */
.md-footer {
  border-top-color: var(--md-accent-fg-color) !important;
}

/* Search result borders */
.md-search__suggest {
  border-color: var(--md-accent-fg-color) !important;
}

/* Sidebar borders */
.md-sidebar {
  border-right-color: var(--md-accent-fg-color) !important;
}

/* Content area borders */
.md-content__inner {
  border-color: var(--md-primary-fg-color) !important;
}



/* Responsive Design */
@media (max-width: 768px) {
  :root {
    --md-sidebar-width: 250px;
  }
  
  .md-content {
    font-size: 14px;
  }
  
  .md-content h1 {
    font-size: 1.8em;
  }
  
  .md-content h2 {
    font-size: 1.5em;
  }
}

/* Print Styles */
@media print {
  :root {
    --md-primary-fg-color: #000000;
    --md-accent-fg-color: #000000;
    --md-default-bg-color: #ffffff;
    --md-default-fg-color: #000000;
  }
}
