.container {
    composes: verticalFlexContainer from './Layout.mcss';
}

.table {
    composes: table         from 'bootstrap/dist/css/bootstrap.css';
    composes: table-striped from 'bootstrap/dist/css/bootstrap.css';
}

.table > tbody > tr > td {
    cursor: pointer;
    vertical-align: middle;
}

.table > thead > tr > th {
    cursor: default;
}

.table > thead > tr > th > span {
    cursor: pointer;
}

.table > tbody > tr {
    transition: all 0.2s ease;
}

.table > tbody > tr:not(.selected):hover {
    background-color: #efefef;
}

.table > tbody > tr > td:first-child {
    text-align: center;
}

.table > tbody > tr > td:last-child {
    text-align: center;
}

.table > tbody > tr > td:last-child:hover {
    /* colorBlue, cannot compose this */
    color: #18e;
}

/* Selection styling rules */
.selected {
    background-color: #aaa;
}

.table > tbody > tr:nth-of-type(odd).selected {
    background-color: #aaa;
}

/* action icons */
.addIcon {
    composes: fa        from 'font-awesome/css/font-awesome.css';
    composes: fa-plus   from 'font-awesome/css/font-awesome.css';
}

.deleteIcon {
    composes: fa        from 'font-awesome/css/font-awesome.css';
    composes: fa-trash  from 'font-awesome/css/font-awesome.css';
}

.sortedDesc {
    composes: fa        from 'font-awesome/css/font-awesome.css';
    composes: fa-fw     from 'font-awesome/css/font-awesome.css';
    composes: fa-sort-desc  from 'font-awesome/css/font-awesome.css';
}

.sortedAsc {
    composes: fa        from 'font-awesome/css/font-awesome.css';
    composes: fa-fw     from 'font-awesome/css/font-awesome.css';
    composes: fa-sort-asc  from 'font-awesome/css/font-awesome.css';
}

.visHidden {
    visibility: hidden;
}