.elementor-277 .elementor-element.elementor-element-0bd6355{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:8px 8px;--row-gap:8px;--column-gap:8px;--margin-top:50px;--margin-bottom:50px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-277 .elementor-element.elementor-element-39a6030 .elementor-heading-title{font-family:"Raleway", Sans-serif;font-weight:700;text-transform:uppercase;}.elementor-widget-divider{--divider-color:var( --e-global-color-secondary );}.elementor-widget-divider .elementor-divider__text{color:var( --e-global-color-secondary );font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-divider.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-secondary );}.elementor-widget-divider.elementor-view-framed .elementor-icon, .elementor-widget-divider.elementor-view-default .elementor-icon{color:var( --e-global-color-secondary );border-color:var( --e-global-color-secondary );}.elementor-widget-divider.elementor-view-framed .elementor-icon, .elementor-widget-divider.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-secondary );}.elementor-277 .elementor-element.elementor-element-12df3c4{--divider-border-style:solid;--divider-color:var( --e-global-color-accent );--divider-border-width:2px;}.elementor-277 .elementor-element.elementor-element-12df3c4 .elementor-divider-separator{width:50px;}.elementor-277 .elementor-element.elementor-element-12df3c4 .elementor-divider{padding-block-start:15px;padding-block-end:15px;}.elementor-277 .elementor-element.elementor-element-3a8f63a{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-277 .elementor-element.elementor-element-125ad9b{--display:flex;}@media(max-width:1024px){.elementor-277 .elementor-element.elementor-element-0bd6355{--padding-top:20px;--padding-bottom:20px;--padding-left:20px;--padding-right:20px;}}@media(max-width:767px){.elementor-277 .elementor-element.elementor-element-0bd6355{--padding-top:20px;--padding-bottom:20px;--padding-left:0px;--padding-right:0px;}.elementor-277 .elementor-element.elementor-element-39a6030 > .elementor-widget-container{padding:0px 20px 0px 20px;}.elementor-277 .elementor-element.elementor-element-12df3c4 > .elementor-widget-container{padding:0px 20px 0px 20px;}.elementor-277 .elementor-element.elementor-element-3a8f63a{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-277 .elementor-element.elementor-element-125ad9b{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-277 .elementor-element.elementor-element-5778d78 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-277 .elementor-element.elementor-element-3523d38 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}}/* Start custom CSS for html, class: .elementor-element-5778d78 *//* Contenedor general */
.traductores_contenedor {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    align-items: flex-start;
    justify-content: center;
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
}

/* Filtros */
.traductores_filtros {
    flex: 1;
    min-width: 250px;
    max-width: 300px;
    background: #f8f9fa;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

/* Estilo de los títulos de los filtros */
.traductores_filtros h3 {
    font-size: 18px;
    margin-bottom: 15px;
    color: #333;
    border-bottom: 2px solid #007bff;
    padding-bottom: 5px;
}

/* Inputs y checkboxes */
.traductores_filtros label {
    display: flex;
    align-items: center;
    font-size: 14px;
    margin-block: 10px;
    color: #555;
    cursor: pointer;
}

.traductores_filtros input[type="checkbox"],
.traductores_filtros select {
    margin-right: 10px;
}

/* Botón de aplicar filtros */
.traductores_filtros button {
    background: #007bff;
    color: white;
    border: none;
    padding: 10px;
    width: 100%;
    border-radius: 5px;
    cursor: pointer;
    font-size: 16px;
    transition: background 0.3s;
}

.traductores_filtros button:hover {
    background: #0056b3;
}

/* Tabla de traductores */
.traductores_tabla {
    flex: 2;
    padding: 12px;
    min-width: 500px;
    /*background: white;*/
    border-radius: 10px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

/* Estilo general de la tabla */
.traductores_tabla table {
    width: 100%;
    border-collapse: collapse;
    margin-block-end: 0px;
}

/* Encabezado de la tabla */
.traductores_tabla th {
    background: #007bff;
    color: #9D0400;
    padding: 12px;
    text-align: left;
    font-size: 16px;
}

/* Filas de la tabla */
.traductores_tabla td {
    padding: 10px;
    border-bottom: 1px solid #ddd;
    font-size: 14px;
}

.traductores_tabla td:last-child { 
    text-align: center;
    /*vertical-align: middle;*/
}

/* Alternar colores de fila */
.traductores_tabla tr:nth-child(even) {
    /*background: #f8f9fa;*/
}

/* Botón en la tabla */
.traductores_tabla .ver-tarjeta {
    display: inline-block;
    background: #9d0400;
    color: white;
    padding: 6px 12px;
    border-radius: 5px;
    text-decoration: none;
    font-size: 14px;
    transition: background 0.3s;
}

.traductores_tabla .ver-tarjeta:hover {
    background: #600100;
}

/* Responsive: Celulares */
@media (max-width: 768px) {
    .traductores_contenedor {
        flex-direction: column;
    }

    .traductores_filtros {
        max-width: 100%;
    }

    .traductores_tabla {
        min-width: 100%;
        font-size: 12px;
    }
    
    .traductores_tabla th {
        font-size: 14px;
    }

    #traductores_lista {
        overflow-x: auto;  /* Habilita el scroll horizontal */
        white-space: nowrap; /* Evita que la tabla se rompa en varias líneas */
        max-width: 100%;  /* Se adapta al ancho del contenedor */
    }
    
    /* Opcional: Estiliza la barra de desplazamiento en navegadores WebKit */
    #traductores_lista::-webkit-scrollbar {
        height: 8px;
    }
    
    #traductores_lista::-webkit-scrollbar-thumb {
        background: #9d0400;
        border-radius: 4px;
    }
    
    #traductores_lista::-webkit-scrollbar-track {
        background: #f8f9fa;
    }
    
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-3523d38 *//* Estilos generales del modal */
#modalTarjeta {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

#modalTarjeta .modal-content {
    background: #fff;
    max-width: 400px;
    width: 90%;
    padding: 20px;
    border-radius: 10px;
    position: relative;
    box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.2);
}

/* Botón de cierre */
#cerrarModal {
    position: absolute;
    top: 10px;
    right: 15px;
    cursor: pointer;
    font-size: 20px;
    color: #555;
}

#cerrarModal:hover {
    color: #000;
}

/* Contenedor superior: Imagen + Nombre + Idioma */
.modal-header {
    display: flex;
    align-items: center;
    border-bottom: 2px solid #eee;
    padding-bottom: 10px;
    margin-bottom: 15px;
}

.modal-header img {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    object-fit: cover;
    margin-right: 15px;
    border: 2px solid #ddd;
}

.modal-header .info {
    flex: 1;
}

.modal-header .info h3 {
    margin: 0;
    font-size: 20px;
    color: #333;
}

.modal-header .info p {
    margin: 5px 0 0;
    font-size: 14px;
    color: #777;
}

/* Contenedor inferior: Datos de contacto */
.modal-body {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.modal-body .dato {
    display: flex;
    align-items: center;
    font-size: 14px;
    color: #333;
}

.modal-body .dato i {
    font-size: 16px;
    margin-right: 10px;
    color: #007bff;
}/* End custom CSS */