.table-editable thead th {
    background-color: var(--fourth-alpha);
    padding: 0 0.75rem;
    vertical-align: middle;
    border-right: solid 0.031rem var(--inactive);
    border-top: solid 0.031rem var(--inactive);
    height: 4rem;
    color: var(--fifth)
}

.table-editable tbody tr td {
    padding: 0;
}

.table-editable tbody tr:first-child td {
    border-top: unset;
}

.table-editable tbody tr:focus-within td.position-relative {
    background-color: var(--second-alpha);
}

.table-editable tbody tr td:not(input){
    height: 4rem;
    vertical-align: middle;
}



.table-editable tbody tr td textarea {
    height: 64px;
    resize: none;
    padding: 0.75rem 0.75rem !important;
    line-height: 19px;
}

.table-editable tbody tr td input[type=text], .table-editable tbody tr td textarea {
    border: none;
    min-height: 4rem;
    padding: 0 0.75rem;
    font-size: 1rem;
    width: 100%;
    border-radius: unset;
    color: var(--primary);
    font-weight: var(--font-bold);
}

.table-editable tbody tr td input[type=text].has-border{
    border: solid 0.063rem var(--primary-alpha);
    border-radius: 0.5rem;
    padding: 0 0.75rem;
    font-size: 1rem;
    width: 100%;;
}

.dirtylisten .form-outline input.form-control.has-border.dirty:not(:focus,.isError) ~ .has-border .form-notch div {
    border: 1px solid var(--fifth)!important;
}

.table-editable tbody tr td.can-not-edit {
    padding: 0 0.75rem;
}

.table-editable tbody tr td .select-input.form-control[readonly]:not([disabled]) {
    border-radius: unset;
}

/*Focus row table*/
.table-editable tbody tr:focus-within td input[type=text], .table-editable tbody tr:focus-within td textarea,.table-editable tbody tr:focus-within td .select-input.form-control[readonly]:not([disabled]),.table-editable tbody tr:focus-within td div.same-background {
    background-color: var(--second-alpha);
    color: var(--primary);
    outline: none;
}

.table-editable tbody tr td input[type=text]:focus,.table-editable tbody tr td.isCompleted input[type=text]:focus,
.table-editable tbody tr td textarea:focus,.table-editable tbody tr td.isCompleted textarea:focus{
    background-color: var(--second-alpha);
    color: var(--primary);
    border: solid 0.063rem var(--second);
    box-shadow: unset;
}

.table-editable tbody tr td.isCompleted input[type=text]:focus, .table-editable tbody tr td.isCompleted textarea:focus {
    background-color: var(--second-alpha);
}

.table-editable tbody tr td:focus-within.isCompleted:not(.isError) {
    background-color: var(--primary-alpha);
}

.table-editable tbody tr td.isCompleted:not(.isError) {
    background-color: var(--primary-alpha);
}

.table-editable tbody tr td.isCompleted input[type=text], .table-editable tbody tr td.isCompleted textarea,.table-editable tbody tr td.isCompleted .select-input.form-control[readonly]:not([disabled]) {
    border: solid 0.063rem var(--primary);
    background-color: unset;
    color: var(--primary);
    font-weight: var(--font-bold);
}

.table-editable tbody tr td.isError input[type=text], .table-editable tbody tr td.isError textarea {
    border: solid 0.063rem var(--error-solid);
    background-color: var(--error-alpha);
    color: var(--primary)
}

.table-editable tbody tr td.isError .form-outline input.form-control[type=text],.table-editable tbody tr td.isError .form-outline textarea.form-control {
    border: solid 0.063rem var(--error-solid);
    background-color: var(--error-alpha);
    color: var(--primary)
}

.table-editable tbody tr td div.form-notch div {
    border: none !important;
}

.table-editable tbody tr td input[type=text]:disabled,.table-editable tbody tr td textarea:disabled, .table-editable tbody tr td input[type=text]:not(.select-input):read-only,.table-mdb tbody tr td.position-relative input[type=checkbox]:disabled {
    cursor: not-allowed;
    background-color: var(--grey-alpha);
    color: unset;
    border: solid 0.063rem var(--inactive);
}

.table-editable tbody tr td.position-relative input[type=checkbox] {
    position: absolute;
    height: 1rem;
    width: 1rem;
    top: calc(50% - 0.5rem);
    right: calc(50% - 0.5rem);
    accent-color: var(--second);
    cursor: pointer;
}

.table-editable tbody tr td.position-relative.icon-edit-delete i,.table-editable tbody tr td.position-relative.icon-edit-delete i {
    position: absolute;
    height: 1rem;
    width: 1rem;
    top: calc(50% - 0.5rem);
    right: calc(50% - 0.5rem);
}

i.fa-times, i.fa-check, i.fa-plus, i.fa-minus {
    cursor: pointer;
}

.table-editable tbody tr td div.select-wrapper span.select-arrow {
    top: 1.563rem;
    right: 0.625rem;
    cursor: pointer;
}

.table-editable tbody tr td.input-trailing div {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
}

.table-editable tbody tr td.input-trailing div i {
    cursor: pointer;
    position: absolute;
    right: 1rem;
}

.table-editable tbody tr td.input-trailing.isError div i {
    color: var(--error-solid);
}

.table-editable tbody.narrow-row td {
    height: 1rem;
}

.table-editable tbody.narrow-row td input[type=text],.table-editable tbody.narrow-row td textarea {
    min-height: 2.625rem; /* 42px */
}

.table-editable tbody.narrow-row td div.select-wrapper span.select-arrow {
    top: 0.875rem;
}
.table-editable tbody tr td.isError input[type=text]::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: var(--primary);
    opacity: 1; /* Firefox */
}

.table-editable:not(thead) > tr:first-child td{
    border-top: solid 0.031rem var(--inactive);
}

.border-left-table {
    border-left: solid 0.031rem var(--inactive) !important;
}

.table tbody:not(.narrow-row) .total-amount-row td{
    padding: 1.469rem 1.4rem;
}

.table tbody.narrow-row .total-amount-row td{
    padding: 0.781rem 1.4rem;
}
