/* ==========================================================================
   RGR Standard — Cloudficient Brand Theme
   Color palette extracted from cloudficient.com landing page
   ========================================================================== */

/* ---------- Light mode overrides ---------- */
[data-md-color-scheme="default"] {
  /* Primary Cloudficient navy */
  --md-primary-fg-color: #191B43;
  --md-primary-fg-color--light: #272A68;
  --md-primary-fg-color--dark: #0B0D1D;
  --md-primary-bg-color: #ffffff;
  --md-primary-bg-color--light: #f8f9fa;

  /* Accent: Cloudficient gold */
  --md-accent-fg-color: #f4bc01;
  --md-accent-fg-color--transparent: rgba(244, 188, 1, 0.15);
  --md-accent-bg-color: #ffffff;

  /* Typeset: links - Cloudficient teal */
  --md-typeset-a-color: #19ad86;

  /* Footer */
  --md-footer-fg-color: #ffffff;
  --md-footer-fg-color--light: rgba(255, 255, 255, 0.7);
  --md-footer-fg-color--lighter: rgba(255, 255, 255, 0.5);
  --md-footer-bg-color: #121430;
  --md-footer-bg-color--dark: #0B0D1D;
}

/* ---------- Dark mode overrides ---------- */
[data-md-color-scheme="slate"] {
  /* Primary Cloudficient indigo */
  --md-primary-fg-color: #272A68;
  --md-primary-fg-color--light: #3a3d8a;
  --md-primary-fg-color--dark: #191B43;
  --md-primary-bg-color: #ffffff;
  --md-primary-bg-color--light: rgba(255, 255, 255, 0.7);

  /* Accent: Cloudficient gold */
  --md-accent-fg-color: #f4bc01;
  --md-accent-fg-color--transparent: rgba(244, 188, 1, 0.15);

  /* Dark backgrounds */
  --md-default-bg-color: #0B0D1D;
  --md-default-bg-color--light: #121430;
  --md-default-bg-color--lighter: #191B43;
  --md-default-bg-color--lightest: #272A68;

  /* Code on dark */
  --md-code-fg-color: #91CA64;
  --md-code-bg-color: #121430;

  /* Links: green */
  --md-typeset-a-color: #91CA64;

  /* Footer */
  --md-footer-fg-color: #ffffff;
  --md-footer-fg-color--light: rgba(255, 255, 255, 0.7);
  --md-footer-fg-color--lighter: rgba(255, 255, 255, 0.5);
  --md-footer-bg-color: #0B0D1D;
  --md-footer-bg-color--dark: #050711;
}

/* ---------- Header / Top nav bar ---------- */
.md-header {
  background: linear-gradient(135deg, #191B43, #272A68) !important;
}

.md-header__title {
  font-family: 'Nunito Sans', sans-serif;
  font-weight: 700;
  letter-spacing: 0.02em;
}

/* ---------- Navigation sidebar ---------- */
.md-nav__title {
  font-family: 'Nunito Sans', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 0.65rem;
  letter-spacing: 0.08em;
}

.md-nav__link {
  font-size: 0.82rem;
}

.md-nav__link--active,
.md-nav__link:hover {
  color: var(--md-accent-fg-color) !important;
}

/* Section labels in nav */
.md-nav__item--section > .md-nav__link {
  font-weight: 700;
  text-transform: uppercase;
  font-size: 0.7rem;
  letter-spacing: 0.06em;
}

[data-md-color-scheme="slate"] .md-nav__item--section > .md-nav__link {
  color: #f4bc01;
}

/* ---------- Content area ---------- */

/* Hero-style H1 */
.md-content h1 {
  font-family: 'Nunito Sans', sans-serif;
  font-size: 2.2rem;
  font-weight: 800;
  border-bottom: 3px solid var(--md-accent-fg-color);
  padding-bottom: 0.5rem;
  margin-bottom: 1rem;
}

/* H2 with subtle left accent */
.md-typeset h2 {
  border-left: 4px solid var(--md-accent-fg-color);
  padding-left: 0.75rem;
  font-weight: 700;
}

/* H3 styling */
[data-md-color-scheme="slate"] .md-typeset h3 {
  color: #91CA64;
}

/* Blockquote styling */
.md-typeset blockquote {
  border-left: 4px solid var(--md-accent-fg-color);
  background: var(--md-default-bg-color--light);
  padding: 1rem 1.5rem;
  border-radius: 0 0.5rem 0.5rem 0;
  font-size: 0.92rem;
}

[data-md-color-scheme="slate"] .md-typeset blockquote {
  background: rgba(39, 42, 104, 0.25);
}

/* ---------- Tables ---------- */
.md-typeset table:not([class]) {
  border: 1px solid rgba(127, 127, 127, 0.3);
  border-radius: 0.5rem;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

/* Wrap tables for horizontal scroll on narrow screens */
.md-typeset .md-typeset__scrollwrap,
.md-content .md-typeset table:not([class]) {
  display: block;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.md-typeset table:not([class]) th {
  background: linear-gradient(135deg, #191B43, #272A68) !important;
  color: #ffffff !important;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  padding: 0.8rem 1rem;
}

.md-typeset table:not([class]) td {
  padding: 0.7rem 1rem;
  border-bottom: 1px solid rgba(127, 127, 127, 0.15);
}

.md-typeset table:not([class]) tr:hover td {
  background: var(--md-accent-fg-color--transparent);
}

/* ---------- Images ---------- */
.md-typeset img {
  border-radius: 0.5rem;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
  margin: 0.5rem auto;
  display: block;
  max-width: 100%;
}

[data-md-color-scheme="slate"] .md-typeset img {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
  border: 1px solid rgba(127, 127, 127, 0.2);
}

/* Figure labels — use figcaption or an explicit .caption class instead;
   the :only-child selector incorrectly matches inline <strong> that is the
   sole element-child of a <p> even when surrounded by text nodes. */

/* ---------- Code ---------- */
.md-typeset code {
  font-size: 0.82em;
  border-radius: 0.25rem;
}

[data-md-color-scheme="slate"] .md-typeset code {
  background: rgba(145, 202, 100, 0.1);
  border: 1px solid rgba(145, 202, 100, 0.2);
}

/* ---------- Footer ---------- */
.md-footer {
  background: linear-gradient(180deg, #121430, #0B0D1D) !important;
}

.md-footer-meta {
  font-size: 0.75rem;
  background: #0B0D1D !important;
}

/* ---------- Links with gold hover ---------- */
.md-typeset a:hover {
  color: var(--md-accent-fg-color) !important;
}

/* ---------- TOC right sidebar ---------- */
.md-sidebar--secondary .md-nav__link--active {
  color: var(--md-accent-fg-color) !important;
  font-weight: 600;
}

/* ---------- Print ---------- */
@media print {
  .md-typeset h1 {
    page-break-before: always;
    border-bottom-color: #191B43;
  }
  .md-typeset h1:first-of-type {
    page-break-before: avoid;
  }
  .md-typeset img {
    box-shadow: none;
    max-width: 90%;
  }
  .md-typeset table th {
    background: #191B43 !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
}
