/* Imágenes */
.md-typeset img {
  border-radius: 8px;
  box-shadow: 0 0px 14px rgba(0,0,0,0.15);
  margin: 1.5em 0;
  transition: box-shadow 0.3s ease;
}


/* Efecto al hacer clic (resaltado permanente) */
.code-line-highlight {
  transition: background-color 0.2s ease-in-out;
}

.md-nav__link::after,
.md-nav__title::after {
  content: "";
}

.md-nav__link::first-letter,
.md-nav__title::first-letter {
  text-transform: capitalize;
}

/* Ítems con submenús (etiquetas de sección) */
.md-nav__item > label,
.md-nav__link {
  margin-bottom: 6px;
}

/* Tipografía general */
body {
  line-height: 1.7;
  font-weight: 400;
}

/* Espaciado y estilo de títulos */
h1, h2, h3, h4, h5, h6 {
  margin-top: 2em;
  margin-bottom: 1em;
  font-weight: 600;
}

/* Tablas */
table {
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  margin: 2em 0;
}

table th {
  background-color: var(--md-primary-fg-color);
  color: white;
  font-weight: 600;
  padding: 1em;
}

table th.filename {
  color: inherit !important;
}

table td {
  padding: 0.8em 1em;
  border-bottom: 1px solid var(--md-default-fg-color--lightest);
}

table tr:hover {
  background-color: var(--md-default-fg-color--lightest);
}

/* Enlaces */
.md-typeset a {
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-bottom-color 0.4s ease;
}

.md-typeset a:hover {
  border-bottom-color: var(--md-primary-fg-color);
}

/* Eliminar línea azul en enlaces que contienen imágenes */
.md-typeset a:has(img) {
  border-bottom: none !important;
}
.md-typeset a:has(img):hover {
  border-bottom: none !important;
}

.md-typeset span.inline-icon {
  height: auto;
  width: auto;
  vertical-align: middle;
  margin: 0 0.35em;
  object-fit: contain;
  display: inline-block;
  box-shadow: none !important;
}

/* Eliminar estilos de badges - comentar o eliminar estas reglas */

span.title.badge.badge-normal {
  background-color: #dae5fc !important;
  color: #ffffff !important;
  font-size: 0.75rem;
  padding: 0.2em 0.6em;
  border-radius: 0.5rem;
  display: inline-flex;
  align-items: center;
  gap: 0.3em;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

span.title.badge .twemoji {
  border: 1px solid #ffffff;
  border-radius: 4px;
  padding: 1px;
  background-color: rgba(219, 222, 248, 0.2);
}


/* Eliminar estilos especiales de bloques de código si existen */
.md-typeset .highlight {
  background: inherit;
  box-shadow: none;
  border-radius: 0;
  margin: 1em 0;
}

.md-typeset .highlight pre {
  background: inherit;
  border: none;
  box-shadow: none;
}


.version-link {
  display: inline-flex;
  align-items: stretch; /* Estira hijos a la misma altura */
  border: 1.5px solid rgb(225, 229, 253);
  border-radius: 2px;
  font-size: 0.9em;
  overflow: hidden;
}

.version-link t:first-of-type {
  color:#3d5cc2;
  background-color: rgb(225, 229, 253); /* Indigo muy clarito */
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 8px;
  border-right: 1.5px solid rgb(225, 229, 253); /* Línea separadora */
}

.version-link t:last-of-type {
  background-color: white;
  display: flex;
  align-items: center;
  padding: 0 8px;
}

.version-link t:first-of-type img {
  width: 20px;  /* Ajusta al tamaño que quieras */
  height: 20px;
}