/* ==========================================================================
   Cargonerds documentation — brand theme
   Built on Material for MkDocs. Colours derived from the Cargonerds cube logo
   (greens) with a cyan secondary accent from the product UI.
   ========================================================================== */

:root {
  --cn-green-900: #006b46;
  --cn-green-700: #00863a;
  --cn-green-500: #00a73e;
  --cn-green-400: #00b339;
  --cn-green-300: #5aff8a;
  --cn-cyan-500:  #00b6e8;
  --cn-navy-900:  #00152f;
  --cn-navy-700:  #002c61;
}

/* ----- Light scheme ----------------------------------------------------- */
[data-md-color-scheme="default"] {
  --md-primary-fg-color:        var(--cn-green-700);
  --md-primary-fg-color--light: var(--cn-green-500);
  --md-primary-fg-color--dark:  var(--cn-green-900);
  --md-accent-fg-color:         var(--cn-green-500);

  --md-typeset-a-color:         var(--cn-green-700);
}

/* ----- Dark (slate) scheme ---------------------------------------------- */
[data-md-color-scheme="slate"] {
  --md-primary-fg-color:        var(--cn-green-700);
  --md-primary-fg-color--light: var(--cn-green-500);
  --md-primary-fg-color--dark:  var(--cn-green-900);
  --md-accent-fg-color:         var(--cn-green-300);

  --md-typeset-a-color:         #4fe08a;
  --md-default-bg-color:        #0e1117;
}

/* Keep the header text/icons crisp on the green bar. */
.md-header,
.md-tabs {
  background-color: var(--md-primary-fg-color);
}

/* ----- Hero on the landing page ----------------------------------------- */
.cn-hero {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .8rem;
  padding: 2.4rem 2rem;
  margin: 0 0 2rem;
  border-radius: .6rem;
  color: #fff;
  background: linear-gradient(125deg, var(--cn-green-900) 0%, var(--cn-green-500) 60%, var(--cn-cyan-500) 130%);
  box-shadow: 0 .4rem 1.6rem rgba(0, 107, 70, .25);
}

.cn-hero h1 {
  margin: 0;
  color: #fff;
  font-weight: 700;
  font-size: 2.1rem;
  line-height: 1.15;
}

.cn-hero p {
  margin: 0;
  max-width: 46rem;
  font-size: .9rem;
  opacity: .95;
}

.cn-hero .cn-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
  margin-top: .6rem;
}

.cn-hero .md-button {
  margin: 0;
}

.cn-hero .md-button--primary {
  background-color: #fff;
  color: var(--cn-green-900);
  border-color: #fff;
}

.cn-hero .md-button--primary:hover {
  background-color: rgba(255, 255, 255, .85);
  border-color: rgba(255, 255, 255, .85);
  color: var(--cn-green-900);
}

/* ----- Card grid polish ------------------------------------------------- */
.md-typeset .grid.cards > ul > li,
.md-typeset .grid > .card {
  border-radius: .5rem;
  border: .05rem solid var(--md-default-fg-color--lightest);
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.md-typeset .grid.cards > ul > li:hover {
  border-color: var(--md-accent-fg-color);
  box-shadow: 0 .2rem .8rem rgba(0, 0, 0, .08);
  transform: translateY(-.1rem);
}

.md-typeset .grid.cards > ul > li > hr {
  margin: .6rem 0;
}

/* ----- Tables (used heavily on the Releases page) ----------------------- */
.md-typeset table:not([class]) th {
  background-color: var(--md-primary-fg-color);
  color: #fff;
}

[data-md-color-scheme="slate"] .md-typeset table:not([class]) th {
  background-color: var(--cn-green-900);
}

/* ----- Version badge in the header -------------------------------------- */
.md-version__current {
  font-weight: 600;
}