/* ===== Tokens de color por tema ===== */
body.quarto-light{
  --brand-accent:#0ea5e9; --paper:#ffffff; --ink:#0f1113; --muted:#4b5563;
  --line:#e5e7eb; --line-strong:#cfd6de;
}
body.quarto-dark{
  --brand-accent:#38bdf8; --paper:#0f1117; --ink:#e9eef2; --muted:#9aa4b2;
  --line:#2a2f37; --line-strong:#3a414c;
}

/* ===== Brandbar ===== */
body.docs .brandbar{background:var(--paper);border-bottom:1px solid var(--line);margin:0 0 .75rem}
body.docs .brandbar__inner{max-width:1200px;margin:0 auto;padding:.5rem .75rem;display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
body.docs .brand-title{font-weight:900;letter-spacing:.2px;font-size:clamp(1.1rem,2.2vw,1.35rem)}
body.docs .brand-nav{display:flex;gap:.4rem;flex-wrap:wrap}
body.docs .brand-nav a{text-decoration:none;border:1px solid var(--line);background:var(--paper);padding:.25rem .5rem;border-radius:.25rem;font-weight:600}
body.docs .brand-nav a:hover{text-decoration:underline}
body.docs #themeToggle{margin-left:auto;border:1px solid var(--line);background:var(--paper);padding:.25rem .5rem;border-radius:.25rem;font-weight:600}

/* ===== Sidebar + layout ===== */
body.docs .page-columns{gap:1.25rem}
body.docs nav.sidebar{
  position:sticky; top:.75rem; max-height:calc(100vh - 1.5rem);
  overflow:auto; border-right:1px solid var(--line); padding-right:.75rem;
}
body.docs .sidebar-title a{font-weight:800; letter-spacing:.1px}
body.docs .sidebar .sidebar-link.active{color:var(--brand-accent)}
body.docs .quarto-title, body.docs .quarto-title-block{display:none!important}

/* ===== Columnas de margen (TOC a la derecha) – evita “franja blanca” ===== */
body.docs .column-margin{background:var(--paper)!important;border-left:1px solid var(--line)}
body.docs .column-margin .toc-actions{background:transparent}

/* ===== Código ===== */
body.docs pre{overflow:auto}
body.quarto-light pre, body.quarto-light code{background:#f6f7f9}
body.quarto-dark  pre, body.quarto-dark  code{background:#0c0f14}

/* ===== Contenedor =====
   No forzamos max-width aquí: dejamos que Bootstrap/Quarto maneje el layout.
   Sólo garantizamos padding estándar por si alguna hoja externa lo alteró. */
body.docs .container{padding-left:var(--bs-gutter-x,.75rem);padding-right:var(--bs-gutter-x,.75rem)}
/* pills en el brandbar: mejor contraste en ambos temas */
body.quarto-light .brand-nav a{
  background:#f8fafc; border-color:#cfd6de; box-shadow: inset 0 -1px 0 rgba(0,0,0,.03);
}
body.quarto-dark .brand-nav a{
  background:#10151b; border-color:#3a414c;
}

/* callouts con relleno sutil para que se vean “rectángulos” */
body.quarto-light .callout { background: #f8fafc; border-color: var(--line-strong); }
body.quarto-dark  .callout { background: #0f141a; border-color: var(--line-strong); }
/* ===== Callouts con franja por tipo ===== */
:root{
  --c-tip:#10b981; --c-note:#0ea5e9; --c-important:#ef4444;
  --c-warning:#f59e0b; --c-caution:#f43f5e;
}
.callout{ border-left:4px solid var(--line-strong); }
.callout-tip       { border-left-color: var(--c-tip); }
.callout-note      { border-left-color: var(--c-note); }
.callout-important { border-left-color: var(--c-important); }
.callout-warning   { border-left-color: var(--c-warning); }
.callout-caution   { border-left-color: var(--c-caution); }

.callout .callout-header { border-bottom: none; }
body.quarto-light .callout-tip       .callout-header{ background: rgba(16,185,129,.10); }
body.quarto-light .callout-note      .callout-header{ background: rgba(14,165,233,.10); }
body.quarto-light .callout-important .callout-header{ background: rgba(239,68,68,.10); }
body.quarto-light .callout-warning   .callout-header{ background: rgba(245,158,11,.12); }
body.quarto-light .callout-caution   .callout-header{ background: rgba(244,63,94,.10); }

body.quarto-dark .callout-tip       .callout-header{ background: rgba(16,185,129,.12); }
body.quarto-dark .callout-note      .callout-header{ background: rgba(14,165,233,.12); }
body.quarto-dark .callout-important .callout-header{ background: rgba(239,68,68,.12); }
body.quarto-dark .callout-warning   .callout-header{ background: rgba(245,158,11,.16); }
body.quarto-dark .callout-caution   .callout-header{ background: rgba(244,63,94,.12); }
/* Oculta mini-toggle de Quarto (dejamos el botón de la brandbar) */
.quarto-color-scheme-toggle { display: none !important; }

:root{
  --c-tip:#10b981; --c-note:#0ea5e9; --c-important:#ef4444;
  --c-warning:#f59e0b; --c-caution:#f43f5e;
}

/* Callouts con franja y header sutil */
.callout{ border-left:4px solid var(--line-strong); }
.callout .callout-header { border-bottom: none; }
.callout-tip       { border-left-color: var(--c-tip); }
.callout-note      { border-left-color: var(--c-note); }
.callout-important { border-left-color: var(--c-important); }
.callout-warning   { border-left-color: var(--c-warning); }
.callout-caution   { border-left-color: var(--c-caution); }
body.quarto-light .callout-tip       .callout-header{ background: rgba(16,185,129,.10); }
body.quarto-light .callout-note      .callout-header{ background: rgba(14,165,233,.10); }
body.quarto-light .callout-important .callout-header{ background: rgba(239,68,68,.10); }
body.quarto-light .callout-warning   .callout-header{ background: rgba(245,158,11,.12); }
body.quarto-light .callout-caution   .callout-header{ background: rgba(244,63,94,.10); }
body.quarto-dark  .callout-tip       .callout-header{ background: rgba(16,185,129,.12); }
body.quarto-dark  .callout-note      .callout-header{ background: rgba(14,165,233,.12); }
body.quarto-dark  .callout-important .callout-header{ background: rgba(239,68,68,.12); }
body.quarto-dark  .callout-warning   .callout-header{ background: rgba(245,158,11,.16); }
body.quarto-dark  .callout-caution   .callout-header{ background: rgba(244,63,94,.12); }

/* Pills del brandbar con color por servicio */
.brand-nav a.pill{
  text-decoration:none; border:1px solid var(--line); background:var(--paper);
  padding:.25rem .5rem; border-radius:.375rem; font-weight:700; line-height:1;
  display:inline-block;
}
.brand-nav a.pill:hover{ text-decoration:underline; }
body.quarto-light .brand-nav a.docs{        background:#f8fafc; }
body.quarto-light .brand-nav a.grafana{     background:#fff7ed; border-color:#fed7aa; }
body.quarto-light .brand-nav a.prometheus{  background:#fff1f2; border-color:#fecdd3; }
body.quarto-light .brand-nav a.netdata{     background:#effdf5; border-color:#bbf7d0; }
body.quarto-light .brand-nav a.estado{      background:#eff6ff; border-color:#bfdbfe; }
body.quarto-dark  .brand-nav a.docs{        background:#0e141b; }
body.quarto-dark  .brand-nav a.grafana{     background:#20150b; border-color:#4a2a12; }
body.quarto-dark  .brand-nav a.prometheus{  background:#1d0b0b; border-color:#4a1717; }
body.quarto-dark  .brand-nav a.netdata{     background:#0b1611; border-color:#113822; }
body.quarto-dark  .brand-nav a.estado{      background:#0c1220; border-color:#1c2a4a; }
/* Chips de color junto al título */
body.docs .brand-title{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
body.docs .brand-chips i{display:inline-block;width:22px;height:6px;border-radius:2px;background:var(--c);margin-right:4px;opacity:.9}

/* Píldoras de navegación con mejor contraste */
body.quarto-light .brand-nav a{background:#f8fafc;border-color:#cfd6de;box-shadow:inset 0 -1px 0 rgba(0,0,0,.03)}
body.quarto-dark  .brand-nav a{background:#10151b;border-color:#3a414c}

/* Callouts con franja de color (rectangulitos) */
:root{
  --c-tip:#10b981; --c-note:#0ea5e9; --c-important:#ef4444;
  --c-warning:#f59e0b; --c-caution:#f43f5e;
}
.callout{ border-left:4px solid var(--line-strong); }
.callout-tip       { border-left-color: var(--c-tip); }
.callout-note      { border-left-color: var(--c-note); }
.callout-important { border-left-color: var(--c-important); }
.callout-warning   { border-left-color: var(--c-warning); }
.callout-caution   { border-left-color: var(--c-caution); }
.callout .callout-header{ border-bottom:none; }
body.quarto-light .callout-tip       .callout-header{ background: rgba(16,185,129,.10); }
body.quarto-light .callout-note      .callout-header{ background: rgba(14,165,233,.10); }
body.quarto-light .callout-important .callout-header{ background: rgba(239,68,68,.10); }
body.quarto-light .callout-warning   .callout-header{ background: rgba(245,158,11,.12); }
body.quarto-light .callout-caution   .callout-header{ background: rgba(244,63,94,.10); }
body.quarto-dark  .callout-tip       .callout-header{ background: rgba(16,185,129,.12); }
body.quarto-dark  .callout-note      .callout-header{ background: rgba(14,165,233,.12); }
body.quarto-dark  .callout-important .callout-header{ background: rgba(239,68,68,.12); }
body.quarto-dark  .callout-warning   .callout-header{ background: rgba(245,158,11,.16); }
body.quarto-dark  .callout-caution   .callout-header{ background: rgba(244,63,94,.12); }

/* Oculta el mini-toggle propio de Quarto para que usemos sólo el nuestro */
.quarto-color-scheme-toggle{ display:none !important; }