@use '../../../base/variables' as v;

.catalogo {
    width: fit-content; 
    margin: 0 auto;     

    &__header {
        display: flex;
        justify-content: flex-start;
        margin-bottom: 1rem;
    }

    &__btn {
        display: inline-block;
        font-size: 2rem;
        padding: .4rem 1rem;
        cursor: pointer;
        border-radius: .2rem;
        background-color: v.$negro;
        color: v.$blanco;
        border: 2px solid transparent;
        transition: all .2s ease;
        text-decoration: none;

        &:hover {
            background-color: v.$blanco;
            color: v.$negro;
            border-color: v.$negro;
        }
    }
}

.catalogo-tbl {
    border-collapse: collapse;
    font-size: 2rem;

    &__th {
        padding: .5rem 2rem;
        color: v.$blanco;
        background-color: v.$negro;
    }
    &__td {
        padding-top: 1rem;
        padding-bottom: 1rem;
        text-align: center;
    }
}
.catalogo-tbl__tbl__tbody {
    tr:nth-child(even) {
            background-color: v.$gris-claro;
        }
}

.icono-editar {
    width: 3rem;
    height: 3rem;
    object-fit: contain;
    cursor: pointer;
    transition: transform 0.2s ease;
}

.icono-editar:hover {
    transform: scale(1.2);
}