/**
 * Estilos para Tabla Comparativa SI (v0.0.39 - Corrección de borde inferior)
 */

#tcs-plugin-wrapper .tcs-titulo-comparativa {
    font-size: 1.8em;
    text-align: center;
    margin-bottom: 0.5em;
}

#tcs-plugin-wrapper .tcs-subtitulo-movil {
    display: none;
    text-align: center;
    margin-top: 0;
    margin-bottom: 1.5em;
    color: #666;
    font-style: italic;
}

#tcs-plugin-wrapper .tcs-tabla-wrapper {
    width: 100%;
    overflow: hidden; 
    border: none !important;
    border-radius: 4px;
}

#tcs-plugin-wrapper .tcs-tabla-comparativa {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.7em;
    line-height: 1.2em;
}

#tcs-plugin-wrapper .tcs-tabla-comparativa th,
#tcs-plugin-wrapper .tcs-tabla-comparativa td {
    padding: 1em;
    vertical-align: middle;
    border-top: 1px solid #e0e0e0;
}

#tcs-plugin-wrapper .tcs-tabla-comparativa th {
    text-align: left;
    font-weight: bold;
}

#tcs-plugin-wrapper .tcs-tabla-comparativa td {
    text-align: center;
}

#tcs-plugin-wrapper .tcs-tabla-comparativa tr > *:nth-child(2) {
    background-color: #f9f9f9;
}

/* --- Cabecera --- */
#tcs-plugin-wrapper .tcs-tabla-comparativa thead th,
#tcs-plugin-wrapper .tcs-tabla-comparativa thead td {
    /* Esta regla asegura que las filas de la cabecera tengan su borde inferior */
    border-bottom: 1px solid #e0e0e0;
}

#tcs-plugin-wrapper .tcs-tabla-comparativa thead th {
    width: 20%;
    background: #fff;
}

#tcs-plugin-wrapper .tcs-tabla-comparativa thead tr:last-child th {
    background: #f9f9f9;
}

#tcs-plugin-wrapper .tcs-tabla-comparativa thead td img {
    max-width: 120px;
    height: 120px;
    object-fit: contain;
    border-radius: 4px;
    margin: 0 auto;
}

#tcs-plugin-wrapper .tcs-tabla-comparativa .tcs-nombre-producto,
#tcs-plugin-wrapper .tcs-tabla-comparativa a {
    font-weight: bold;
    color: #333;
    text-decoration: none;
}

#tcs-plugin-wrapper .tcs-tabla-comparativa tbody tr th {
    background: #f9f9f9;
}

/* Celdas de las esquinas sin fondo */
#tcs-plugin-wrapper .tcs-tabla-comparativa thead tr:first-child th,
#tcs-plugin-wrapper .tcs-tabla-comparativa tbody tr:last-child th {
    background-color: #fff;
}

#tcs-plugin-wrapper .tcs-tabla-comparativa tr:first-child th,
#tcs-plugin-wrapper .tcs-tabla-comparativa tr:first-child td {
    border-top: none;
}

/* CORRECCIÓN: Regla específica para quitar el borde inferior SOLO a la última fila del CUERPO de la tabla */
#tcs-plugin-wrapper .tcs-tabla-comparativa tbody tr:last-child td,
#tcs-plugin-wrapper .tcs-tabla-comparativa tbody tr:last-child th {
    border-bottom: none;
}

/* --- Estilos para SVG, Precio y Etiqueta Agotado --- */
#tcs-plugin-wrapper .tcs-star-rating-svg-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 2px;
}

#tcs-plugin-wrapper .tcs-star-svg {
    width: 16px;
    height: 16px;
    fill: #ccc;
}

#tcs-plugin-wrapper .tcs-star-svg.tcs-star-filled {
    fill: #ffc107;
}
/*quitando * asterisco */
#tcs-plugin-wrapper .tcs-precio-final,
#tcs-plugin-wrapper .tcs-precio-final  {
    font-weight: bold !important;
    font-size: 14px !important;
    color: inherit !important;
}

#tcs-plugin-wrapper .tcs-agotado-tag {
    display: inline-block;
    padding: 0.5em 1em;
    font-weight: bold;
    color: #777;
    background-color: #eee;
    border-radius: 4px;
    border: 1px solid #ddd;
}


/* --- Vista Móvil --- */
@media (max-width: 768px) {
    #tcs-plugin-wrapper {
        overflow-x: hidden;
    }

    #tcs-plugin-wrapper .tcs-titulo-comparativa {
        font-size: 1.2em;
    }

    #tcs-plugin-wrapper .tcs-subtitulo-movil {
        display: block;
    }

    #tcs-plugin-wrapper .tcs-tabla-wrapper {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        border: none;
        overscroll-behavior-x: contain;
    }

    #tcs-plugin-wrapper .tcs-tabla-comparativa {
        width: auto;
        min-width: 500px;
    }
    
    #tcs-plugin-wrapper .tcs-tabla-comparativa tr > th:first-child {
        position: -webkit-sticky;
        position: sticky;
        left: 0;
        z-index: 2; 
    }
    
    html, body {
        overflow-x: clip !important;
    }
}