.locationsTable td {
    grid-template-columns: 1fr 1fr !important;
}
table.responsiveTable tr td{
  padding: 3px;
}
table.responsiveTable{
    font-size: 15px;
}
th.tableCounter,
.tableCounter:before {
    font-family: 'Font Awesome 5 Free';
    font-weight: 600;
}
table.responsiveTable a{
  color: var(--aquaBlue);
}

@media screen and (max-width: 750px) {
    table.responsiveTable td:before {
        content: attr(data-title);
        display: flex;
        align-items: center;
        justify-content: left;
    }
    table.responsiveTable tbody {
        display: grid;
        grid-gap: 20px;
    }
    table.responsiveTable tr {
        border: 1px solid #ddd;
        border-radius: 2px;
        padding: 10px;
        display: block;
    }
    /* Don't display the first item, since it is used to display the header for tabular layouts*/
    table.responsiveTable thead {
        display: none;
    }
    /* Attribute name for first column, and attribute value for second column. */
    table.responsiveTable td {
        display: grid;
        grid-template-columns: minmax(0, 30%) 1fr;
        grid-gap: 0.5em;
        margin-top: 0.5em;
    }
    table.responsiveTable tr td:first-child {
        margin-top: 0;
    }
}

.locationsTable {
    border-top: solid 1px #ddd;
    border-right: solid 1px #ddd;
}

/* Tabular Layout */

@media screen and (min-width: 750px) {
    .tableCounter {
        text-align: center;
        width: 3em;
    }
    table.responsiveTable td[data-title="QTY"] {
        min-width: 5em;
    }
    table.responsiveTable td[data-title="Nume"],
    table.responsiveTable td[data-title="DENUMIRE"],
    table.responsiveTable td[data-title="COD"],
    table.responsiveTable td[data-title="Cod"] {
        word-break: break-all;
    }
    /* The maximum column width, that can wrap */
    table.responsiveTable tr {
        grid-template-columns: repeat(auto-fit, minmax(60px, 1fr));
        border-left: solid 1px #ddd;
        border-right: solid 1px #ddd;
        border-bottom: solid 1px #ddd;
    }
    .locationsTable tr td:nth-child(2) {
        text-align: right;
    }
    /* In order to maximize row lines, only display one line for a cell */
    table.responsiveTable td {
        border-left: 1px solid #ddd;
        overflow: hidden;
        text-overflow: ellipsis;
        vertical-align: middle;
    }
    .locationsTable tr {
        display: table-row !important;
    }
    .locatiiTable tr {
        grid-template-columns: 0.2fr 1.5fr 1.2fr 1fr 0.5fr !important;
    }
    table.responsiveTable tr td.centered {
        vertical-align: middle;
        align-items: center;
        justify-content: center;
        text-align: center;
    }
    table.responsiveTable tr td:first-child {
        border: none;
    }
    table.responsiveTable th {
        background-color: var(--darkBlue);
        color: #fff;
        border: 1px solid #ddd;
        padding: 0.5rem 0.2rem;
        vertical-align: middle;
    }
    table.responsiveTable {
        border-collapse: collapse;
    }
    table.responsiveTable tbody tr:hover {
        background-color: var(--grey);
    }
    /* Center header labels */
}

.full-width {
    width: 100%;
}

.half-width {
    width: 50%;
}

.redBg {
    background-color: rgb(224, 80, 80);
}
.responsiveTable .datepicker{
  max-width: 80px;
}