/* 
Define colors for theme
Color palette as defined here: https://github.com/Imageomics/Collaborative-distributed-science-guide/issues/59
*/
body {
  --color-lm-primary: #245963; /* light mode primary color (teal-9) */
  --color-lm-url: #3c707a; /* light mode URL + note color (teal-11) */
  --color-lm-url-10: #3c707a1a; /* 10% alpha */
  --color-lm-accent: #7eac55; /* light mode accent color (lime-9) */
  --color-lm-accent-10: #7eac551a; /* 10% alpha */
  --color-dm-primary: #174952; /* dark mode primary color (teal-10) */
  --color-dm-url: #7dc7d6; /* dark mode contrast url (teal-11) */
  --color-dm-accent: #73a049; /* dark mode accent color (lime-10) */
  --color-dm-accent-10: #73a0491a; /* 10% alpha */
}

/* Light mode colors */
[data-md-color-scheme="default"] {
  --md-primary-fg-color:        var(--color-lm-primary);
  --md-accent-fg-color:         var(--color-lm-accent);
  --md-accent-fg-color-10:     var(--color-lm-accent-10);
}

/* Dark mode colors */
[data-md-color-scheme="slate"] {
  --md-primary-fg-color:        var(--color-dm-primary);
  --md-accent-fg-color:         var(--color-dm-accent);
  --md-accent-fg-color-10:     var(--color-dm-accent-10);
}

/* Force the header to use dynamically defined primary color
Needs work if implementing. better than switching to classic
.md-header {
  background-color: var(--md-primary-fg-color);
}

/* Ensure header text, titles, and icons are readable against primary color
.md-header, 
.md-header__button, 
.md-header__title,
.md-search__button,
.md-header__topic {
  color: var(--md-primary-bg-color, #ffffff);
}
*/

/*
Make logo larger
*/
.md-header__button.md-logo {
  margin: 0;
  padding: 1;
}

/* logo isn't square: it's wider than it is tall */
.md-header__button.md-logo img, .md-header__button.md-logo svg {
  height: 2.8rem;
  width: 2.8rem;
}

/* Small screen adjustments */
@media screen and (max-width: 76.2344em) {
  .md-nav--primary .md-nav__title {
    background-color: var(--md-primary-fg-color);
    /* bg defined by main theme as #fff */
    color: var(--md-primary-bg-color);
  }

  /* Dark mode custom active parent color (side panel) */
  [data-md-color-scheme="slate"] .md-nav .md-nav__item--active > .md-nav__link {
    color: var(--color-dm-url);
    font-weight: bold;
  }
  
  /* Dark mode custom active parent hover color (side panel) */
  [data-md-color-scheme="slate"] .md-nav .md-nav__item--active:hover > .md-nav__link {
    color: var(--md-accent-fg-color);
  }
}

/* Add borderless table class for syllabus */
.borderless-table table,
.borderless-table th,
.borderless-table td {
  font-weight: normal !important;  /* Remove bold from table header row */
  border: none !important;
}

/* Custom styling for site-wide announcement banner */
.md-banner {
  background-color: #fff0cd; /* Soft alert yellow */
  color: #664d03;           /* High-contrast dark amber text */
  text-align: center;
  font-size: 1rem;
}

/* Style just the warning icon */
.banner-icon {
  font-size: 1.35em;        
  vertical-align: -0.1em;   /* Adjusts vertical position to align with text baseline */
  display: inline-block;    /* Ensures transform and sizing render cleanly */
}