.md-header__button.md-logo {
    max-height: 80px;
  }
/* Estilo personalizado para el buscador */
.md-search__form {
    border-radius: 8px !important;
    overflow: hidden;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1); /* opcional, mejora el borde */
  }
  /* Botón flotante de WhatsApp */
.whatsapp-float {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 999;
  }
  
  .whatsapp-float img {
    width: 60px;
    height: 60px;
    border-radius: 50%;
  }
  .md-footer {
    background-color: #333; /* Cambia el color del footer al gris oscuro */
    color: #fff; /* Cambia el texto del footer a blanco para mejor contraste */
}

.md-footer-nav {
    background-color: #333; /* Asegura que la navegación del footer tenga el mismo color */
}
.md-footer-meta {
    /* Este elemento debe estar visible para que se muestre el footer personalizado */
    background-color: #333;
}

/* Estilos específicos para nuestro footer personalizado */
.md-footer-meta__inner {
    padding: 20px 0;
}

.md-footer img {
    max-width: 140px;
    margin-bottom: 10px;
}

/* Estilos para títulos y encabezados */
h1, .md-typeset h1 {
    color: #333 !important;
    font-weight: 800 !important;
    font-size: 2em !important;
}

h2, .md-typeset h2 {
    color: #333 !important;
    font-weight: 700 !important;
    border-bottom: 2px solid #6c757d;
    padding-bottom: 8px;
}

/* Forzar que los subtítulos h3 no estén en negrita */
h3, 
.md-typeset h3, 
.md-content h3,
h3 strong,
.md-typeset h3 strong,
.md-content h3 strong,
h3 b,
.md-typeset h3 b,
.md-content h3 b {
    color: #333 !important;
    font-weight: 400 !important;
}

/* Quitar asteriscos (markdown para negrita) de los subtítulos directamente */
.md-content h3 strong,
.md-typeset h3 strong {
    font-weight: inherit !important;
}

/* Asegura que los íconos de emoji en títulos tengan el tamaño correcto */
h1 .twemoji, h2 .twemoji, h3 .twemoji {
    vertical-align: middle;
}

/* Estilos responsivos para imágenes flotantes */
.image-right {
    float: right;
    margin-left: 20px;
    margin-bottom: 10px;
}

/* Media query para dispositivos móviles */
@media (max-width: 768px) {
    .image-right {
        float: none !important;
        width: 100% !important;
        margin: 0 0 20px 0 !important;
        clear: both;
    }
    
    .image-right img {
        max-width: 70% !important; /* Limitamos el ancho máximo en móviles */
        height: auto;
        margin: 0 auto;
        display: block;
    }
    
    /* Tamaños específicos para diferentes tipos de imágenes */
    .image-right.image-small img {
        max-width: 50% !important;
    }
    
    .image-right.image-medium img {
        max-width: 70% !important;
    }
    
    .image-right.image-large img {
        max-width: 90% !important;
    }
}

/* Estilos para el footer personalizado */
.custom-footer {
    margin-top: 50px;
    padding: 30px 20px;
    background-color: #f8f9fa;
    border-top: 1px solid #e9ecef;
    text-align: center;
}

.footer-logo {
    max-width: 180px;
    margin-bottom: 20px;
}

.footer-text {
    color: #6c757d;
    font-size: 0.9em;
    margin-bottom: 10px;
}

.footer-links {
    margin-top: 15px;
}

.footer-links a {
    color: #007bff;
    text-decoration: none;
    margin: 0 10px;
}

.footer-links a:hover {
    text-decoration: underline;
}