/* Aplica estilo solo a los enlaces dentro del contenido principal */
.entry-content a, 
.post-content a {
    text-decoration: underline !important; /* Subrayado permanente */
    font-weight: bold !important; /* Texto en negrita */
    text-underline-offset: 3px; /* Separa un poquito la línea para que se vea más limpio */
}

/* Efecto al pasar el mouse (opcional pero recomendado) */
.entry-content a:hover { text-decoration: none !important; }


/* Contenedor para centrar el botón */
.contenedor-boton-telegram {
    text-align: center;
    margin: 20px 0;
}

/* Estilo base del botón */
.btn-telegram {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #0088cc; /* Color oficial de Telegram */
    color: #ffffff !important;
    padding: 12px 25px;
    font-size: 18px;
    font-weight: bold;
    text-decoration: none !important;
    border-radius: 50px;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(0, 136, 204, 0.3);
}

/* Espacio para el icono SVG */
.btn-telegram svg {
    margin-right: 10px;
}

/* Efecto al pasar el mouse */
.btn-telegram:hover {
    background-color: #0077b5;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 136, 204, 0.4);
}

/* Ajustes para móviles (Responsive) */
@media (max-width: 600px) {
    .btn-telegram {
        width: 100%; /* El botón ocupa todo el ancho en móviles */
        font-size: 16px;
        padding: 15px 10px;
    }
}

h1, h2, h4, h5  {
    font-size: 18px; 
}
.post-content h3 {
    font-size: 20px; 
}
body::-webkit-scrollbar {
  width: 8px;
}
body::-webkit-scrollbar-track {
  background-color: rgba(0, 0, 0, 0);
  border-radius: 6px;
}
body::-webkit-scrollbar-thumb {
  background-color: #e54e53;
  border-radius: 6px;
}
.fakeButtom {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 20px;
    font-size: 16px;
    font-weight: bold;
    color: #fff;
    background-color: #FF0000;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.fakeButtom:hover {
    background-color: #0056b3;
}

.fakeButtom i {
    margin-right: 10px;
    font-size: 20px;
}

@media (max-width: 600px) {
    .fakeButtom {
        font-size: 14px;
        padding: 8px 16px;
    }

    .fakeButtom i {
        font-size: 18px;
    }
}
.boton-descargar {
    display: inline-block;
    background-color: #4da6ff; /* Color de fondo similar al botón en la imagen */
    color: #ffffff; /* Color del texto */
    padding: 10px 20px;
    font-size: 16px;
    font-weight: bold;
    border-radius: 5px;
    text-decoration: none;
    text-align: center;
    transition: background-color 0.3s ease;
}

.boton-descargar:hover {
    background-color: #357abf; /* Color de fondo al pasar el ratón */
}

.icono-descargar {
    margin-right: 8px;
    font-size: 20px;
    vertical-align: middle;
}
 .telegram-link {
            background-color: blue;
            padding: 5px;
            text-align: center;
            display: block;
            margin-bottom: 11px;
            border-radius: 5px;
            color: #FFFFFF !important; /* Cambiamos a amarillo y añadimos !important */
            text-decoration: none;
            position: relative;
            transition: background-color 0.3s;
        }

        .telegram-link:hover {
            background-color: #ff9900;
        }

        .telegram-icon {
            height: 20px;
            margin-top: -2px;
            margin-right: 2px;
        }

        @media (max-width: 600px) {
            .telegram-link {
                padding: 3px;
                margin-bottom: 5px;
            }
        }
.the-post-meta.cf {
    display: none;
}
.post-title {
    text-align: left;
}

.social-buttons {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 260px;
}

.social-btn {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 18px;
  border-radius: 14px;
  color: #fff;
  text-decoration: none;
  background: #666;
  font-family: system-ui, sans-serif;
  box-shadow: 0 6px 20px rgba(0,0,0,0.35);
  transition: transform .15s ease, box-shadow .15s ease;
}

.social-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 25px rgba(0,0,0,0.45);
}

.social-btn .icon {
  width: 32px;
  height: 32px;
  background: rgba(255,255,255,0.15);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: pulse 1.7s ease-out infinite;
}

.social-btn .icon svg {
  width: 20px;
  height: 20px;
  color: #fff;
}

.text {
  display: flex;
  flex-direction: column;
  line-height: 1.1;
}

.text .small {
  font-size: 11px;
  opacity: 0.85;
}

.text .big {
  font-size: 16px;
  font-weight: bold;
}

.arrow {
  margin-left: auto;
  font-size: 20px;
  opacity: 0.9;
  transition: transform .15s ease;
}

.social-btn:hover .arrow {
  transform: translateX(2px);
}

/* Colores personalizados */
.discord {
  background: linear-gradient(135deg, #5865f2, #4752c4);
}

.telegram {
  background: linear-gradient(135deg, #2ca7e0, #2295cc);
}

/* ANIMACIÓN DE PULSO */
@keyframes pulse {
  0% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(255,255,255,0.5);
  }
  60% {
    transform: scale(1.12);
    box-shadow: 0 0 0 14px rgba(255,255,255,0);
  }
  100% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(255,255,255,0);
  }
}
/* Estilos para el widget de Enlaces de Interés en el Footer */
.enlaces-interes {
    list-style-type: none; /* Quita las viñetas por defecto */
    padding: 0;
    margin: 0;
}

.enlaces-interes li {
    margin-bottom: 12px; /* Espaciado cómodo entre enlaces */
    border-bottom: 1px solid rgba(255, 255, 255, 0.05); /* Línea divisoria muy sutil */
    padding-bottom: 8px;
}

.enlaces-interes li:last-child {
    border-bottom: none; /* Evita que el último enlace tenga línea debajo */
    margin-bottom: 0;
}

.enlaces-interes a {
    text-decoration: none;
    color: #cccccc; /* Color gris claro, ideal para fondos oscuros */
    font-size: 15px;
    transition: all 0.3s ease; /* Hace que la animación sea fluida */
    display: flex;
    align-items: center;
}

/* Símbolo decorativo antes del enlace */
.enlaces-interes a::before {
    content: "\203A"; /* Código para una flecha simple (›) */
    color: #0073aa; /* Cambia este código HEX por el color principal de tu web */
    font-size: 18px;
    margin-right: 8px;
    font-weight: bold;
    transition: margin 0.3s ease;
}

/* Efecto al pasar el cursor por encima (Hover) */
.enlaces-interes a:hover {
    color: #ffffff; /* El texto se vuelve blanco brillante */
}

/* La flechita se mueve un poco a la derecha al hacer hover */
.enlaces-interes a:hover::before {
    margin-right: 12px; 
}


/* Selecciona los títulos de las pestañas del estilo modern-light */
.su-tabs-style-modern-light .su-tabs-nav span {
    transition: all 0.4s ease-in-out;
    position: relative;
    overflow: hidden;
}

/* Efecto de cambio de color y brillo al pasar el mouse */
.su-tabs-style-modern-light .su-tabs-nav span:hover {
    background-color: #f0f0f0 !important; /* Un gris muy claro o el color que prefieras */
    color: #000 !important;
    box-shadow: 0 0 15px rgba(0, 150, 255, 0.4); /* Brillo azulado sutil */
    transform: translateY(-2px); /* Pequeño salto hacia arriba */
}

/* Efecto de destello (brillo blanco que cruza el título) */
.su-tabs-style-modern-light .su-tabs-nav span::after {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 50%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.8), transparent);
    transform: skewX(-25deg);
}

.su-tabs-style-modern-light .su-tabs-nav span:hover::after {
    left: 150%;
    transition: left 0.6s ease-in-out;
}

/* --- BOTONES DESCARGA --- */
.desgratuito, .desvip {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 48%;
    padding: 12px 22px;
    font-family: 'Poppins', sans-serif;
    font-size: 15px;
    font-weight: 600;
    text-transform: uppercase;
    border: none;
    border-radius: 10px; /* ← más cuadrado y elegante */
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none;
    overflow: hidden;
    z-index: 1;
}

/* Íconos usando Máscaras SVG (Mantiene currentColor automáticamente) */
.desgratuito::before, .desvip::before {
    content: "";
    display: inline-block;
    width: 18px;
    height: 18px;
    background-color: currentColor; /* Hereda el color del texto (incluso en hover) */
    transition: transform 0.3s ease;
}

/* --- GRATUITO --- */
.desgratuito {
    background: linear-gradient(135deg, #ff416c, #ff4b2b);
    color: #fff;
    box-shadow: 0 0 8px rgba(255, 65, 108, 0.3);
}
.desgratuito::before {
    /* Icono de la nube con flecha (cloud-arrow-down) */
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 512'%3E%3Cpath d='M144 480C64.5 480 0 415.5 0 336c0-62.8 40.2-116.2 96.2-135.9c-.1-2.7-.2-5.4-.2-8.1c0-88.4 71.6-160 160-160c59.3 0 111 32.2 138.7 80.2C409.9 102 428.3 96 448 96c53 0 96 43 96 96c0 12.2-2.3 23.8-6.4 34.6C596 238.4 640 290.1 640 352c0 70.7-57.3 128-128 128H144zm79-217c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l39-39V392c0 13.3 10.7 24 24 24s24-10.7 24-24V257.9l39 39c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-80-80c-9.4-9.4-24.6-9.4-33.9 0l-80 80z'/%3E%3C/svg%3E") no-repeat center / contain;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 512'%3E%3Cpath d='M144 480C64.5 480 0 415.5 0 336c0-62.8 40.2-116.2 96.2-135.9c-.1-2.7-.2-5.4-.2-8.1c0-88.4 71.6-160 160-160c59.3 0 111 32.2 138.7 80.2C409.9 102 428.3 96 448 96c53 0 96 43 96 96c0 12.2-2.3 23.8-6.4 34.6C596 238.4 640 290.1 640 352c0 70.7-57.3 128-128 128H144zm79-217c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l39-39V392c0 13.3 10.7 24 24 24s24-10.7 24-24V257.9l39 39c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-80-80c-9.4-9.4-24.6-9.4-33.9 0l-80 80z'/%3E%3C/svg%3E") no-repeat center / contain;
}
.desgratuito:hover {
    background: linear-gradient(135deg, #00e676, #00bfa5);
    box-shadow: 0 0 16px rgba(0, 230, 118, 0.6), 0 0 32px rgba(0, 230, 118, 0.3);
}
.desgratuito:hover::before {
    transform: translateY(-3px);
}

/* --- VIP --- */
.desvip {
    background: linear-gradient(135deg, #ffd700, #ffae00);
    color: #1a1a1a;
    box-shadow: 0 0 8px rgba(255, 215, 0, 0.3);
}
.desvip::before {
    /* Icono del rayo (bolt) */
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M112 48a48 48 0 0 1 89.8-21.6l81.4 149.3c5 9.1 5.4 20.1 1 29.5S271.6 224 261.3 224H208v160c0 18.5-10.6 35.1-27 42.6s-35.3 4.5-48.8-7.7l-96-88c-10.5-9.6-14-24.7-8.9-38.1s18.2-22.8 32.7-22.8H112V48z'/%3E%3C/svg%3E") no-repeat center / contain;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M112 48a48 48 0 0 1 89.8-21.6l81.4 149.3c5 9.1 5.4 20.1 1 29.5S271.6 224 261.3 224H208v160c0 18.5-10.6 35.1-27 42.6s-35.3 4.5-48.8-7.7l-96-88c-10.5-9.6-14-24.7-8.9-38.1s18.2-22.8 32.7-22.8H112V48z'/%3E%3C/svg%3E") no-repeat center / contain;
}
.desvip:hover {
    background: linear-gradient(135deg, #8e2de2, #4a00e0);
    color: #fff;
    box-shadow: 0 0 16px rgba(142, 45, 226, 0.6), 0 0 32px rgba(74, 0, 224, 0.3);
}
.desvip:hover::before {
    transform: translateY(-3px);
}

/* --- EFECTO DE BRILLO DINÁMICO --- */
.desgratuito::after, .desvip::after {
    content: "";
    position: absolute;
    top: 0;
    left: -75%;
    width: 50%;
    height: 100%;
    background: linear-gradient(120deg, rgba(255,255,255,0.3), transparent);
    transform: skewX(-25deg);
    transition: all 0.5s ease;
    z-index: 0;
}
.desgratuito:hover::after, .desvip:hover::after {
    left: 125%;
}

