.theme-dark {

  /* The accent color is used to draw attention to interactive elements, 
  such as links and primary buttons*/
  --accent-h: 30;
  --accent-s: 61%;
  --accent-l: 50%;

 /* Backgrounds */
  --background-primary: #0F0F0F;
  --background-primary-alt: #141414;
  --background-secondary: #141414;
  --background-secondary-alt: #0F0F0F;
  
  /* All body text */
  --text-normal: #cccccc;

  /* Table styling */
  --table-header-background: #141414;
  --table-background: #141414;
  --table-header-weight: bold;
  --table-header-color: hsl(30, 61%, 50%);
  --table-header-size: 24px;
  --table-text-size: 18px;
  --table-add-button-color: hsl(30, 61%, 50%);
  --table-drag-handle-color: hsl(30, 61%, 50%);
  --table-drag-handle-color-active: #CD7F32;

  /* Headers */
  --h1-color: #CD7F32;
  --h2-color: #b889ff;
  --h3-color: #b889ff;
  --h4-color: #b889ff;
  --h5-color: #b889ff;
  --h6-color: #b889ff;
  --h1-size: 35px;
  --h2-size: 30px;
  --h3-size: 24px;
  --h4-size: 20px;
  --h5-size: 18px;
  --h6-size: 16px;

 /* Link styling*/
 --link-color: #0067A5;
 --link-unresolved-color: #0067A5;
 --link-external-color: #0067A5;

 /* List styling for bullet points */
 --list-marker-color: #CD7F32;

 /* Genreal User Interface */
 --nav-heading-color: #CD7F32;
 --nav-item-color: #CD7F32;
 --nav-item-size: 14px;
 --nav-item-color-active: #CD7F32;
 --nav-item-background-active: #333333;
 --nav-collapse-icon-color: #CD7F32;
 --list-marker-color-collapsed: #CD7F32;

 --caret-color: #CD7F32;

/* Make folder titles bold */
.nav-folder-title {
  font-weight: regular;
  color: inherit; /* Keeping the default color */
}

/* Styling for files in the sidebar */
.nav-file-title {
  font-weight: 300; /* Light font weight */
  color: #CD7F32; /* Off  white colour for contrasting to folder */
  position: relative; /* Allows to use the ::before pseudo-element */
  padding-left: 15px; /* Creates space for better readability */
}

/* Change file hover colour */
.nav-file-title:hover {
  background-color: #CD7F32 !important;
  color: #ffffff !important; /* Optional: changes text colour to white for better contrast */
}

.theme-light {

  /* The accent color is used to draw attention to interactive elements, 
  such as links and primary buttons*/
  --accent-h: 30;
  --accent-s: 61%;
  --accent-l: 40%; /* Slightly adjusted for visibility on a lighter background */

  /* Backgrounds */
  --background-primary: #FFFFFF; /* White background for brightness */
  --background-primary-alt: #F7F7F7; /* Light grey for subtle contrast */
  --background-secondary: #F0F0F0; /* Light grey for secondary areas */
  --background-secondary-alt: #FFFFFF; /* Keeping it white for consistency */
  
  /* All body text */
  --text-normal: #333333; /* Dark grey for readability */

  /* Table styling */
  --table-header-background: #F0F0F0; /* Light grey for table headers */
  --table-background: #FFFFFF; /* White for table body */
  --table-header-weight: bold;
  --table-header-color: hsl(30, 61%, 30%); /* Darker shade of the accent for contrast */
  --table-header-size: 24px;
  --table-text-size: 18px;
  --table-add-button-color: hsl(30, 61%, 30%); /* Darker for visibility */
  --table-drag-handle-color: hsl(30, 61%, 30%);
  --table-drag-handle-color-active: #D69A00; /* Brighter gold for active state */

  /* Code blocks */
  --code-background: #F9F9F9; /* Light background for code blocks */
  --code-normal: #007A33; /* Dark green for code text */

  /* Headers */
  --h1-color: #A24D00; /* Darker orange for headers */
  --h2-color: #A24D00;
  --h3-color: #A24D00;
  --h4-color: #A24D00;
  --h5-color: #A24D00;
  --h6-color: #A24D00;
  --h1-size: 35px;
  --h2-size: 30px;
  --h3-size: 24px;
  --h4-size: 20px;
  --h5-size: 18px;
  --h6-size: 16px;

  /* Link styling */
  --link-color: #0067A5; /* Maintaining the blue link for consistency */
  --link-unresolved-color: #0067A5;
  --link-external-color: #0067A5;

  /* List styling for bullet points */
  --list-marker-color: #A24D00; /* Darker orange for list markers */

  /* General User Interface */
  --nav-heading-color: #A24D00; /* Consistent heading colour */
  --nav-item-color: #A24D00;
  --nav-item-size: 14px;
  --nav-item-color-active: #A24D00;
  --nav-item-background-active: #EAEAEA; /* Light grey for active background */
  --nav-collapse-icon-color: #A24D00;
  --list-marker-color-collapsed: #A24D00;

  --caret-color: #A24D00;

  /* Make folder titles bold */
  .nav-folder-title {
    font-weight: bold; /* Bold for visibility */
    color: inherit; /* Keeping the default color */
  }

  /* Styling for files in the sidebar */
  .nav-file-title {
    font-weight: 300; /* Light font weight */
    color: #A24D00; /* Darker orange for contrast */
    position: relative; /* Allows to use the ::before pseudo-element */
    padding-left: 15px; /* Creates space for better readability */
  }

  /* Change file hover colour */
  .nav-file-title:hover {
    background-color: #A24D00 !important; /* Darker orange for hover */
    color: #FFFFFF !important; /* White text for contrast */
  }
}


/* ========== GLOBAL STYLING FOR PUBLISH ========== */

/* Blockquote styling */
.markdown-rendered blockquote,
.markdown-rendered-wrapper blockquote {
  border-left: 1px solid #CD7F32 !important;
  padding-left: 1.2em;
  margin: 1.5em 0;
  color: #dddddd !important; /* Updated value */
  font-style: italic;
  background-color: rgba(255, 255, 255, 0.02);
}

/* Spacing between list items */
.markdown-rendered ul li,
.markdown-rendered ol li {
  margin-bottom: 0.8em;
}

.markdown-rendered ul li:has(ul),
.markdown-rendered ul li:has(p) {
  position: relative;
  padding-left: 1.5em;
  margin-bottom: 1.2em;
}

.markdown-rendered ul li:has(ul)::before,
.markdown-rendered ul li:has(p)::before {
  content: "";
  position: absolute;
  left: 0.1em;
  top: 0;
  height: 100%;
  width: 2px;
  background-color: #CD7F32;
  border-radius: 1px;
}


/* === PATCHED STYLES TO MATCH MOCKUP === */


/* 7. Improved paragraph separation for readability */
.markdown-rendered p {
  margin-bottom: 1.2em;
}


  .markdown-rendered span.italic-label {
  font-style: italic;
  color: #b889ff;
  font-size: 0.95em;
}

  /* Light pastel blue bolds in normal content */
.markdown-rendered p strong,
.markdown-rendered li strong {
  color: #add8ff !important;  /* Light blue */
  font-weight: bold;
}