﻿.sde_table_responsive {
    position: relative !important;
}

    .sde_table_responsive > thead tr th,
    .sde_table_responsive > tbody tr td {
        padding: 0.2rem 0.4rem !important;
    }

    .sde_table_responsive > thead > tr > th {
        font-weight: bold !important;
    }

    .sde_table_responsive > tbody tr td.hide {
        display: none !important;
    }

    .sde_table_responsive, .sde_table_responsive thead, .sde_table_responsive tfoot, .sde_table_responsive tbody, .sde_table_responsive tr {
        display: block !important;
    }

        .sde_table_responsive thead,
        .sde_table_responsive tbody,
        .sde_table_responsive td,
        .sde_table_responsive tfoot,
        .sde_table_responsive th,
        .sde_table_responsive tr {
            border-style: none;
        }

        /*
    Encabezado
*/

        .sde_table_responsive > thead tr th:not([class*="show"]) {
            display: none !important;
        }
        .sde_table_responsive > thead tr th.show {
            
        }

        /*
    Cuerpo de la tabla
*/

        .sde_table_responsive > tbody tr {
            position: relative !important;
            border-radius: 15px;
            margin-bottom: 5px;
            border: 1px solid #e5e5e5;
        }

        .sde_table_responsive > tbody th, .sde_table_responsive tbody tr td:first-of-type {
            display: inline-block !important;
            width: 100% !important;
            padding: 1rem 1rem !important;
            line-height: 2.9rem !important;
        }

        .sde_table_responsive tbody tr td:nth-of-type(1n+2) {
            border-top: 1px solid #e5e5e5;
        }

        .sde_table_responsive tr td,
        .sde_table_responsive tr td:nth-of-type(1n+2) {
            display: block !important;
        }

        .sde_table_responsive > tbody tr td:first-of-type > label {
            display: none;
        }

        .sde_table_responsive > tbody tr.activeRow td:first-of-type {
            background-color: #ff6600 !important;
            color: #fff;
            border-top-left-radius: 15px;
            border-top-right-radius: 15px;
        }

        .sde_table_responsive > tbody tr td:first-of-type:after {
            content: attr(data-description) !important;
            font-weight: bold;
            top: 0.5rem;
            left: 0.7rem;
        }

        .sde_table_responsive > tbody tr td:nth-of-type(1n+2):before {
            content: attr(title) " " !important;
            font-weight: bold !important;
            /*display: table-caption !important;*/
        }

        .sde_table_responsive > tbody .closed td {
            display: none !important;
        }

        .sde_table_responsive > tbody .no-border:nth-of-type(1){
            border-top-left-radius: 0;
            border-top-right-radius: 0;
        }

/*
    Boton de despliegue
*/
tbody tr td span.ico-grid {
    display: none !important;
}

.sde_table_responsive > tbody tr td span.ico-grid {
    display: block !important;
    visibility: visible;
    position: absolute !important;
    right: 0.5rem !important;
    top: 0.25rem !important;
    width: 1.7rem !important;
    height: 1.7rem !important;
    cursor: pointer !important;
    background-color: #000 !important;
    color: #fff !important;
    border-radius: 25px;
    font-family: 'Font Awesome 5 Free';
}

.sde_table_responsive span.ico-grid::before {
    position: absolute;
    top: 0.354rem;
    left: 0.42rem;
    content: "\f068" !important;
}

.sde_table_responsive > tbody .closed td > span.ico-grid::before {
    content: "\f067" !important;
}

td.text-numeric {
    text-align: right;
}
td.table-text-center {
    text-align: center;
}
.sde_table_responsive > tbody td.text-numeric {
    text-align: left;
}
.sde_table_responsive > tbody td.table-text-center {
    text-align: left;
}


.sde_notify_circle > tbody tr td:first-of-type:before {
    content: '';
    display: inline-block;
    width: 1rem;
    height: 1rem;
    -moz-border-radius: 7.5px;
    -webkit-border-radius: 7.5px;
    border-radius: 7.5px;
    background-color: var(--background-circle);
    vertical-align: middle;
    margin-right: 0.2rem;
}
