/* ============================================
   Grafana Book — Современный дизайн, синяя гамма
   v3 — Inter, JetBrains Mono, Modern Blue
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  --md-primary-fg-color:        #2F66AF;
  --md-accent-fg-color:         #2F66AF;
  --md-primary-fg-color--dark:  #1D4ED8;

  --gb-blue:         #2F66AF;
  --gb-blue-dark:    #1D4ED8;
  --gb-blue-light:   #DBEAFE;
  --gb-grad-start:   #2F66AF;
  --gb-grad-end:     #93C5FD;

  --md-text-font:  "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --md-code-font:  "JetBrains Mono", "Fira Code", monospace;
}

body {
  font-family: var(--md-text-font);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.md-typeset {
  font-size: 0.95rem;
  line-height: 1.75;
}

.md-typeset h1 {
  font-weight: 800;
  font-size: 2.5rem;
  letter-spacing: -0.03em;
  color: var(--gb-blue-dark);
  border-bottom: 4px solid var(--gb-blue);
  padding-bottom: 0.3em;
  margin-bottom: 1rem;
}

.md-typeset h2 {
  font-weight: 700;
  font-size: 1.6rem;
  margin-top: 2.5rem;
  color: var(--gb-blue-dark);
}

.md-typeset h3 {
  font-weight: 600;
  font-size: 1.25rem;
  color: var(--gb-blue);
}

.md-button {
  font-family: var(--md-text-font);
  font-weight: 600;
  border-radius: 8px;
  transition: all 0.2s ease;
}

.md-button--primary {
  background: linear-gradient(135deg, var(--gb-grad-start), var(--gb-grad-end));
  border: none;
  color: #fff;
  padding: 0.8em 2.2em;
  font-size: 1.05rem;
  box-shadow: 0 4px 14px rgba(47,102,175,0.25);
}

.md-button--primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(47,102,175,0.35);
}

.md-typeset code {
  font-family: var(--md-code-font);
  border-radius: 4px;
  padding: 0.2em 0.5em;
}

.md-typeset pre > code {
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}

.md-typeset blockquote {
  border-left: 4px solid var(--md-primary-fg-color);
  background: var(--md-primary-fg-color--transparent);
  border-radius: 0 8px 8px 0;
  padding: 1.2em 1.6em;
  font-style: normal;
}

.md-typeset blockquote p { margin: 0; }

.md-typeset .admonition,
.md-typeset details {
  border-radius: 8px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.04);
  border-left-width: 4px;
}

.md-typeset__table table:not([class]) {
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(0,0,0,0.04);
}

.md-typeset table:not([class]) th {
  background: linear-gradient(135deg, var(--gb-blue), var(--gb-blue-dark));
  color: #fff;
  font-weight: 600;
}

.md-typeset a {
  color: var(--gb-blue-dark);
  font-weight: 500;
}

.md-typeset a:hover { color: var(--gb-blue); }

.md-tabs__link {
  font-weight: 500;
  font-size: 0.82rem;
}

.md-tabs__link--active {
  color: var(--gb-blue-dark) ;
  font-weight: 700;
}

.md-nav__item .md-nav__link--active {
  color: var(--gb-blue-dark) ;
  font-weight: 700;
}

.md-nav__link:is(:focus,:hover) { color: var(--gb-blue); }

.headerlink { display: none; }

.md-main__inner { padding-top: 0; }
.md-content__inner { padding-top: 2rem; }

.md-footer {
  background: linear-gradient(135deg, #0F172A, #1E293B);
  color: rgba(255,255,255,0.7);
}

.md-footer-meta { background: rgba(0,0,0,0.2); }

.md-footer__link {
  color: rgba(255,255,255,0.7);
  text-decoration: none;
}

.md-footer__link:hover { color: #fff; }

.md-content__inner {
  animation: fadeIn 0.3s ease;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(4px); }
  to   { opacity: 1; transform: translateY(0); }
}

::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--md-default-bg-color); }
::-webkit-scrollbar-thumb { background: var(--md-default-fg-color--lighter); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--md-accent-fg-color); }

.md-search__input { border-radius: 8px; }
.md-search-result__link { border-radius: 6px; }
.md-nav__item { border-radius: 4px; }

[data-md-color-scheme="slate"] {
  --md-primary-fg-color--transparent: rgba(47,102,175,0.12);

  .md-typeset h1, .md-typeset h2, .md-typeset h3 { color: var(--gb-blue); }
  .md-typeset table:not([class]) th { background: linear-gradient(135deg, var(--gb-blue-dark), #0F172A); }
}