/* ============================================
   COLORES PERSONALIZADOS HIX
   ============================================ */
/*
| Variable              | Qué controla                       |
| --------------------- | ---------------------------------- |
| --md-primary-fg-color | Header, sidebar activo, links      |
| --md-accent-fg-color  | Hover, selección de texto, botones |
| --md-default-bg-color | Fondo general de la página         |
| --md-default-fg-color | Color del texto principal          |
| --md-typeset-a-color  | Color de los hipervínculos         |
| --md-text-font        | Fuente del cuerpo                  |
| --md-code-font        | Fuente de bloques de código        |
| --md-code-bg-color    | Fondo de bloques de código         |
*/
/* Cargar desde CDN externo (Fontshare) */
@import url("https://api.fontshare.com/v2/css?f[]=satoshi@400,500,700&f[]=jet-brains-mono@400&display=swap");

/* Ocultar el título "Web Server" y usar el botón GitHub en su sitio.
   Orden en el header: logo, GitHub, [espaciador], paleta, idioma, search */
.md-header__title { display: none; }

.md-header__inner .md-header__source {
  order: 1;
  margin-right: auto;
  max-width: none;
}
.md-header__inner [data-md-component="palette"]      { order: 2; }
.md-header__inner .md-header__option:not([data-md-component="palette"]) { order: 3; }
.md-header__inner [for="__search"],
.md-header__inner [data-md-component="search"]       { order: 4; }

/* "Web Server" del menú lateral más grande */
.md-nav--primary > .md-nav__title {
  font-size: 1.1rem;
  font-weight: 700;
  line-height: 1.3;
}

:root {
  --md-text-font:  "Satoshi";       /* Fuente cuerpo */
  --md-code-font:  "JetBrains Mono"; /* Fuente código */
  --hix-font-size-body: 0.95rem;
  --hix-line-height-body: 1.6;  
} 

.md-typeset p,
.md-typeset table,
.md-typeset th,
.md-typeset td {
  font-size: var(--hix-font-size-body);
  line-height: var(--hix-line-height-body);
}

/* Modo claro */
[data-md-color-scheme="default"] {
  /* Color principal (header, sidebar, links activos) */
 
  --md-primary-fg-color:        #20679a;   /* Tu color de marca */  
  --md-primary-fg-color--light: #20679a;  
  --md-primary-fg-color--dark:  #20679a;
  --md-primary-bg-color:        #ffffff;   /* Texto sobre el color primario */

  /* Color de acento (hover, selección, botones) */
  --md-accent-fg-color:         #da7101;
  --md-accent-fg-color--transparent: rgba(218, 113, 1, 0.1);

  /* Fondo general y sidebar */
  --md-default-bg-color:        #f7f6f2;
  --md-default-fg-color:        #1a1a1a;   /* Texto principal */
  --md-default-fg-color--light: #7a7974;   /* Texto secundario */
  --md-default-fg-color--lighter: #bab9b4; /* Texto terciario */

  /* Links */
  --md-typeset-a-color:         #01696f;
}

/* Modo oscuro */
[data-md-color-scheme="slate"] {
  --md-primary-fg-color:        #4f98a3;
  /*--md-primary-fg-color--light: #7dbcc5;*/
  --md-primary-fg-color--light: #1f5c61;
  --md-primary-fg-color--dark:  #227f8b;
  --md-primary-bg-color:        #171614;

  --md-accent-fg-color:         #408dc5;

  --md-default-bg-color:        #171614;
  --md-default-fg-color:        #cdccca;
  --md-default-fg-color--light: #797876;

  --md-typeset-a-color:         #4f98a3;
}

/* ============================================
   TIPOGRAFÍA - DOCUMENTACIÓN TÉCNICA HIX
   ============================================ */

/* --- TÍTULOS --- */
.md-typeset h1 {
  font-size: 1.6rem;          
  font-weight: 700;
  line-height: 1.0;
  margin-bottom: 1rem;
  color: var(--md-primary-fg-color--dark);
  border-bottom: 2px solid var(--md-primary-fg-color--light);
  padding-bottom: 0.4rem;
}


.md-typeset h2 {
  font-size: 1.5rem;       
  font-weight: 700;
  margin-top: 2rem;
  margin-bottom: 0.75rem;
  color: var(--md-default-fg-color);
}

.md-typeset h3 {
  font-size: 1.2rem;       
  font-weight: 600;
  margin-top: 1.5rem;
  color: var(--md-default-fg-color);
}

.md-typeset h4 {
  font-size: 1rem;        
  font-weight: 600;  
  letter-spacing: 0.05em;
  color: var(--md-default-fg-color);
}

/* --- PÁRRAFO --- */
	
.md-typeset p {
  font-size: 0.95rem;
  line-height: 1.2;
  color: var(--md-default-fg-color);
  text-align: justify;
  margin-bottom: 1rem;
}

/* --- CÓDIGO INLINE --- */
.md-typeset code {
  font-size: 0.85rem;          /* ajusta a tu gusto: 0.90 / 0.92 / 0.95 */
  font-family: var(--md-code-font), monospace;
}

/* --- BLOQUE DE CÓDIGO --- */
.md-typeset pre,
.md-typeset pre code {
  font-size: 0.85rem;          /* mismo valor que inline */ 
}
/* --- TABLAS --- */

.md-typeset table {
  font-size: 0.95rem;    /* igual que p */
  line-height: 1.2;      /* igual que p */
}

/* Primera columna: no partir el contenido (útil para firmas de función,
   rutas, claves de config, etc. que no deben romperse en varias líneas) */
.md-typeset table:not([class]) th:first-child,
.md-typeset table:not([class]) td:first-child {
  white-space: nowrap;
}

.md-typeset th {
  font-size: 0.95rem;    /* igual que p */
  font-weight: 700;  
  letter-spacing: 0.04em;
  background: var(--md-primary-fg-color--light);
  color: var(--md-primary-bg-color);
}

/* --- ALTO DE FILAS DE TABLA --- */
/* Cabecera más compacta */
.md-typeset table th {
  padding: 0.6rem 1rem !important;
}

/* Filas de datos más espaciosas */
.md-typeset table td {
  padding: 0.6rem 1rem !important;
}
/* --- LISTAS --- */

.md-typeset ul,
.md-typeset ol {
  font-size: 0.95rem;
  line-height: 1.8;
  padding-left: 1.5rem;
}

/* --- CITA / BLOCKQUOTE --- */

.md-typeset blockquote {
  font-size: 0.85rem;
  font-style: italic;
  border-left: 4px solid var(--md-accent-fg-color);
  color: var(--md-default-fg-color--light);
  padding-left: 1rem;
  margin: 1.5rem 0;
}

footer {
   border-top:1px solid gray;
}

.myinfo {   
   color: white;
   font-weight:bold;   
}

/* --- OCULTAR TOC (panel derecho) ---
   Para reactivarlo: comentar/eliminar este bloque completo. */
.md-sidebar--secondary { display: none !important; }
@media screen and (min-width: 76.25em) {
  .md-content { margin-right: 0; }
}

/* --- LANDING (home): imagen centrada vertical y horizontalmente --- */
.hix-landing {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: calc(100vh - 12rem);
}
.hix-landing img { max-width: 40%; height: auto; }

/* Ocultar el h1 auto-generado por Material en la landing */
.md-content article:has(.hix-landing) h1 { display: none; }

/* --- FOOTER: logo Harbour alineado a la derecha, centrado verticalmente --- */
.md-copyright {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
  width: 100%;
}
.md-footer-text { flex: 1; }
.md-footer-copy { margin-left: auto; white-space: nowrap; }

/* --- FOOTER FIJO: la barra inferior (copyright) queda pegada al viewport --- */
.md-footer-meta {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 4;
  border-top: 1px solid gray;
  background-color: black;
}

/* Reserva espacio al final del contenido para que no quede tapado por el footer */
.md-main {
  padding-bottom: 3rem;
}