/* Import your font if you have one, otherwise default to Roboto */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;700&display=swap');

:root {
  /* --- Brand Palette (From your Design Tokens) --- */
  --bjk-bg-midnight: #0F1A24;     /* Midnight Navy */
  --bjk-bg-slate:    #1C2B3A;     /* Deep Slate Blue */
  --bjk-bg-light:    #F5F7FA;     /* Parchment White */
  
  --bjk-accent-green: #3DFF8E;    /* Electric Core Green */
  --bjk-accent-teal:  #2ED4C6;    /* Circuit Teal */
  --bjk-text-light:   #E6EBF2;    /* Frosted Slate */
  --bjk-text-dark:    #0F1A24;    /* Midnight Navy Text */

  /* --- MkDocs Global Overrides --- */
  
  /* 1. Make the Body Dark (Midnight Navy) */
  --md-default-bg-color: var(--bjk-bg-midnight);
  --md-default-fg-color: var(--bjk-text-light);
  
  /* 2. Make Links "Electric Core Green" so they are visible */
  --md-accent-fg-color: var(--bjk-accent-green);
  --md-typeset-a-color: var(--bjk-accent-teal);
  --md-primary-fg-color: var(--bjk-accent-teal);

  /* 3. Sidebar Colors (Deep Slate) */
  --md-default-bg-color--light: var(--bjk-bg-slate); 
  
  /* 4. Code Block Backgrounds */
  --md-code-bg-color: var(--bjk-bg-slate);
}

/* --- Specific Override for the Header (The "Mullet" Header) --- */
/* Force Header to be Light (Parchment White) with Dark Text */
.md-header {
  background-color: var(--bjk-bg-light) !important;
  color: var(--bjk-text-dark) !important;
}

/* Fix Header Text/Icons to be dark so they show up on the light background */
.md-header__title, 
.md-header__button, 
.md-header__topic {
  color: var(--bjk-text-dark) !important;
}

/* Ensure the Search Bar looks good on the light header */
.md-search__input {
  background-color: rgba(0, 0, 0, 0.05) !important;
  color: var(--bjk-text-dark) !important;
}