/* Ocultar el botón "Cerrar Ticket" */
button[data-id="closeTicket"] {
    display: none !important; /* Esto oculta el botón */
}
/* Ocultar el <span> con data-id="edit_close" */
span[data-id="edit_close"] {
    display: none !important; /* Esto oculta el <span> */
}
/* Ocultar el ícono SVG con el alt="More" */
svg.Icon__icon[alt="More"] {
    display: none !important; /* Esto oculta el ícono SVG */
}
/* Ocultar el <div> completo con la clase "DottedMenuPopup__displayInB" */
div.DottedMenuPopup__displayInB {
    display: none !important; /* Esto oculta el <div> y todo su contenido */
}
/* Ocultar el <li> con data-id="1002901000044995410_thread" */
li[data-id="1002901000044995410_thread"] {
    display: none !important; /* Esto oculta el <li> y todo su contenido */
}
/* Ocultar el <li> con data-id="1002901000044995410_comment" */
li[data-id="1002901000044995410_comment"] {
    display: none !important; /* Esto oculta el <li> y todo su contenido */
}

/* Ocultar todo el contenido del <ul> con la clase "ConversationForm__replay" */
ul.ConversationForm__replay {
    display: none !important; /* Esto oculta completamente el <ul> y su contenido */
}
/* Ocultar el <div> y todo su contenido */
div.TicketList__mobileFilter.TicketList__filter_channel {
    display: none !important; /* Esto oculta el <div> y todo su contenido */
}



/* /* /* Estilo base para los botones */
.Header__tabs__link,
.LoginDetail__profileLink,
.LoginDetail__logoutLink,
.CustomizeContainer__fontInc,
.CustomizeContainer__fontDec {
    position: relative;
    padding: 10px 20px;
    font-weight: bold;
    border-radius: 4px;
    outline: none;
    box-shadow: none;
    transition: transform 0.3s ease, font-size 0.3s ease;
}

/* Animación para el botón de Inicio */
.Header__tabs__link:hover {
    transform: scale(1.1); /* Aumenta ligeramente al pasar el cursor */
    color: #007bff; /* Cambia el color del texto (solo como ejemplo) */
}

/* Animación para el botón Mi área */
.LoginDetail__profileLink:hover {
    transform: rotate(5deg); /* Gira ligeramente al pasar el cursor */
    color: #28a745; /* Cambia el color del texto */
}

/* Animación para el botón Base de conocimientos */
.LoginDetail__logoutLink:hover {
    transform: scale(1.1) rotate(-5deg); /* Aumenta y rota el texto al pasar el cursor */
    color: #dc3545; /* Cambia el color del texto */
}

/* Animación para el botón Comunidad */
.CustomizeContainer__fontInc:hover {
    transform: translateY(-5px); /* Desplaza el botón hacia arriba */
    color: #ffc107; /* Cambia el color del texto */
}

/* Animación para el botón Cambiar tamaño de fuente */
.CustomizeContainer__fontDec:hover {
    transform: scale(1.2); /* Aumenta el tamaño del botón */
    color: #17a2b8; /* Cambia el color del texto */
}

/* Animación de agrandamiento y rebote al hacer clic */
.Header__tabs__link:active,
.LoginDetail__profileLink:active,
.LoginDetail__logoutLink:active,
.CustomizeContainer__fontInc:active,
.CustomizeContainer__fontDec:active {
    transform: scale(0.95); /* Comprime ligeramente el botón al hacer clic */
    animation: clickBounce 0.3s ease-out;
}

/* Efecto de rebote para todos los botones */
@keyframes clickBounce {
    0% {
        transform: scale(0.95); /* Inicia comprimido */
    }
    50% {
        transform: scale(1.1); /* Se expande un poco */
    }
    100% {
        transform: scale(1); /* Regresa a su tamaño original */
      
    }
}

/* Estilo base para el botón */
.Button__btnFont.Button__primary {
    position: relative;
    padding: 12px 20px;
    font-weight: bold;
    border-radius: 4px;
    outline: none; /* Elimina el contorno */
    box-shadow: none; /* Elimina sombras */
    transition: transform 0.2s ease, background-color 0.3s ease, color 0.3s ease;
}

/* Animación al pasar el mouse (hover) */
.Button__btnFont.Button__primary:hover {
    transform: scale(1.1); /* Agranda el botón ligeramente */
    background-color: #0056b3; /* Cambia el fondo de forma suave */
    color: #fff; /* Cambia el color del texto al hacer hover */
    cursor: pointer; /* Muestra el cursor de pointer */
}

/* Efecto cuando se hace clic */
.Button__btnFont.Button__primary:active {
    transform: scale(0.95); /* Hace que el botón se encoja ligeramente al hacer clic */
    animation: buttonClick 0.2s ease-out; /* Animación de rebote al hacer clic */
}

/* Animación de rebote */
@keyframes buttonClick {
    0% {
        transform: scale(0.95); /* Empieza comprimido */
    }
    50% {
        transform: scale(1.1); /* Expande ligeramente el botón */
    }
    100% {
        transform: scale(1); /* Regresa al tamaño original */
    }
}

/* Estilo base para el botón */
.Button__btnFont.Button__secondary {
    position: relative;
    padding: 12px 20px; /* Espaciado para mantener el diseño */
    font-weight: bold; /* Texto en negrita */
    border-radius: 4px; /* Bordes redondeados */
    outline: none; /* Eliminar contorno */
    box-shadow: none; /* Eliminar sombra */
    transition: transform 0.3s ease, background-color 0.3s ease; /* Transiciones suaves */
}

/* Animación al pasar el mouse (hover) */
.Button__btnFont.Button__secondary:hover {
    transform: scale(1.05); /* Agranda ligeramente el botón */
    background-color: #6c757d; /* Fondo gris oscuro al hacer hover */
    color: #fff; /* Cambia el color del texto */
    cursor: pointer; /* Muestra el cursor de pointer */
}

/* Efecto cuando se hace clic */
.Button__btnFont.Button__secondary:active {
    transform: scale(0.95); /* Hace que el botón se encoja ligeramente */
    animation: buttonClick 0.2s ease-out; /* Animación de rebote */
}

/* Animación de rebote */
@keyframes buttonClick {
    0% {
        transform: scale(0.95); /* Empieza comprimido */
    }
    50% {
        transform: scale(1.1); /* Se expande un poco */
    }
    100% {
        transform: scale(1); /* Regresa a su tamaño original */
    }
}

/* Estilo base para el botón */
.Button__btnFont.Button__footerBtn {
    position: relative;
    padding: 12px 24px; /* Espaciado adecuado para mantener la estética */
    font-weight: bold; /* Texto en negrita */
    border-radius: 8px; /* Bordes más redondeados para un toque moderno */
    outline: none; /* Elimina el contorno */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Sombra sutil */
    transition: transform 0.3s ease, background-color 0.3s ease, box-shadow 0.3s ease; /* Transición suave */
    color: #fff; /* Color de texto blanco */
    background-color: #007bff; /* Fondo azul (puedes cambiarlo según tu preferencia) */
}

/* Efecto de agrandamiento al pasar el cursor (hover) */
.Button__btnFont.Button__footerBtn:hover {
    transform: scale(1.1); /* Aumenta el tamaño del botón */
    background-color: #0056b3; /* Cambia el color de fondo */
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3); /* Sombra más grande */
    cursor: pointer; /* Cambia el cursor para indicar interactividad */
}

/* Efecto de rebote al hacer clic (active) */
.Button__btnFont.Button__footerBtn:active {
    transform: scale(0.95); /* Comprime ligeramente el botón al hacer clic */
    animation: buttonClickBounce 0.3s ease-out; /* Animación de rebote */
}

/* Animación de rebote (hace que el botón se expanda y luego vuelva a su tamaño original) */
@keyframes buttonClickBounce {
    0% {
        transform: scale(0.95); /* Empieza comprimido */
    }
    50% {
        transform: scale(1.1); /* Se expande un poco */
    }
    100% {
        transform: scale(1); /* Vuelve a su tamaño original */
    }
}

/* Efecto de pulsación al pasar el mouse */
.Button__btnFont.Button__footerBtn:hover {
    animation: pulseEffect 1.5s infinite; /* Efecto de pulsación en loop */
}

/* Efecto de pulsación */
@keyframes pulseEffect {
    0% {
        transform: scale(1); /* Tamaño normal */
    }
    50% {
        transform: scale(1.05); /* Se agranda ligeramente */
    }
    100% {
        transform: scale(1); /* Vuelve a su tamaño normal */
    }
/* Oculta todo el bloque del login del agente */
.Signin__agentlogin {
  display: none !important;
}