/* ═══════════════════════════════════════════════════════
   Tema KeikoPOS Docs — diambil dari snr.my.id/css/app.css
   Design token asli:
   --accent: #2563eb | --accent-cyan: #06b6d4
   --accent-dark: #1d4ed8 | --accent-light: #1e3a5f
   --near-black: #0d0d0d | bg: #f8fafc
   font: Inter
   ═══════════════════════════════════════════════════════ */

:root {
  /* Warna inti SNR */
  --snr-accent: #2563eb;
  --snr-accent-cyan: #06b6d4;
  --snr-accent-dark: #1d4ed8;
  --snr-accent-light: #1e3a5f;
  --snr-near-black: #0d0d0d;
  --snr-bg: #f8fafc;
  --snr-border: rgba(0, 0, 0, 0.08);
  --snr-radius: 16px;

  /* Map ke MkDocs Material */
  --md-primary-fg-color: var(--snr-accent);
  --md-primary-fg-color--light: #60a5fa;
  --md-primary-fg-color--dark: var(--snr-accent-dark);
  --md-accent-fg-color: var(--snr-accent-cyan);
  --md-default-bg-color: var(--snr-bg);
}

/* Font Inter — sama kayak snr.my.id */
body,
.md-typeset {
  font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}

/* ═══ HEADER: gradient accent → cyan, persis snr.my.id ═══ */
.md-header {
  background: linear-gradient(135deg, var(--snr-accent), var(--snr-accent-cyan));
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

/* ═══ SIDEBAR ═══ */
.md-sidebar--primary {
  background-color: var(--snr-bg);
}

.md-nav__item--active > .md-nav__link {
  color: var(--snr-accent);
  font-weight: 600;
}

.md-nav__link:hover {
  color: var(--snr-accent-cyan);
}

/* ═══ TYPOGRAPHY ═══ */
.md-typeset h1 {
  color: var(--snr-accent-light);
  font-weight: 700;
}

.md-typeset h2 {
  color: var(--snr-accent-light);
  font-weight: 650;
}

.md-typeset a {
  color: var(--snr-accent);
}

/* ═══ TABEL — header navy, persis gaya SNR ═══ */
.md-typeset table:not([class]) th {
  background: var(--snr-accent-light);
  color: #fff;
  font-weight: 600;
}

.md-typeset table:not([class]) {
  border-radius: var(--snr-radius);
  overflow: hidden;
  box-shadow: var(--shadow-card, 0 2px 8px rgba(0, 0, 0, 0.05));
}

.md-typeset table:not([class]) tr:nth-child(even) {
  background: #f1f5f9;
}

/* ═══ CARD/ADMONITION ═══ */
.md-typeset .admonition,
.md-typeset details {
  border-radius: var(--snr-radius);
  border-color: var(--snr-border);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.03);
}

.md-typeset .admonition.note > .admonition-title,
.md-typeset details.note > summary {
  background-color: rgba(37, 99, 235, 0.1);
  border-color: var(--snr-accent);
}

.md-typeset .admonition.tip > .admonition-title,
.md-typeset details.tip > summary {
  background-color: rgba(6, 182, 212, 0.1);
  border-color: var(--snr-accent-cyan);
}

.md-typeset .admonition.warning > .admonition-title,
.md-typeset details.warning > summary {
  background-color: rgba(245, 158, 11, 0.1);
  border-color: #f59e0b;
}

/* ═══ CODE ═══ */
.md-typeset code {
  color: var(--snr-accent-light);
  background: #eef2ff;
  border-radius: 6px;
}

.md-typeset pre > code {
  background: #0f172a;
  color: #e2e8f0;
}

/* ═══ FOOTER — dark navy persis SNR ═══ */
.md-footer {
  background: linear-gradient(135deg, #0a0f1a, #1a2332);
}

.md-footer-meta {
  background: #0d0d0d;
}

/* ═══ SEARCH (di atas gradient header) ═══ */
[data-md-color-scheme="default"] .md-search__input {
  background-color: rgba(255, 255, 255, 0.15);
}

[data-md-color-scheme="default"] .md-search__input::placeholder {
  color: rgba(255, 255, 255, 0.7);
}

[data-md-color-scheme="default"] .md-search__form:hover {
  background-color: rgba(255, 255, 255, 0.2);
}

[data-md-color-scheme="default"] .md-search__icon {
  color: #fff;
}

/* ═══ DARK MODE ═══ */
[data-md-color-scheme="slate"] {
  --md-default-bg-color: #0f172a;
  --md-default-fg-color: #e2e8f0;
}

[data-md-color-scheme="slate"] .md-sidebar--primary {
  background-color: #0f172a;
}

[data-md-color-scheme="slate"] .md-typeset h1,
[data-md-color-scheme="slate"] .md-typeset h2 {
  color: #dbeafe;
}

[data-md-color-scheme="slate"] .md-typeset code {
  background: #1e293b;
  color: #93c5fd;
}

[data-md-color-scheme="slate"] .md-typeset table:not([class]) th {
  background: #1e293b;
}

[data-md-color-scheme="slate"] .md-typeset table:not([class]) tr:nth-child(even) {
  background: #111c2e;
}