@import "../../src/theme/common/util";

header{
    line-height:px2rem(40);
    background-color:#F1F1F1;
    border-bottom:px2rem(1) solid #DDD;
    margin-bottom:px2rem(8);
    display:flex;
    justify-content:center;
    align-items:center;
    .back-button,.more-button{
        width:px2rem(50);
        text-align:center;
        button{
            background-color:inherit;
            px2px("font-size",14);
            border:0 none;
            color:#999;
        }
    }
    h3{
        flex:1;
        text-align:center;
    }
}

.md-button{
    box-shadow:0 px2rem(2) px2rem(2) 0 rgba(0,0,0,.14),
    0 px2rem(3) px2rem(1) px2rem(-2) rgba(0,0,0,.2),
    0 px2rem(1) px2rem(5) 0 rgba(0,0,0,.12)
    background-color:rgba(158,158,158,.2)
    padding:.4rem .5rem
    border:0 none
}

.md-card{
    background-color:#FFF
    box-shadow:0 px2rem(2) px2rem(2) 0 rgba(0,0,0,.14),
    0 px2rem(3) px2rem(1) px2rem(-2) rgba(0,0,0,.2),
    0 px2rem(1) px2rem(5) 0 rgba(0,0,0,.12)
    .md-card-title{
        background-color:#FEFEFE;
        border-bottom:px2rem(1) solid #DEDEDE;
        line-height:px2rem(28);
        padding:0 0 0 px2rem(8);
    }
}

.md-data-table{
    box-shadow:0 px2rem(2) px2rem(2) 0 rgba(0,0,0,.14),
    0 px2rem(3) px2rem(1) px2rem(-2) rgba(0,0,0,.2),
    0 px2rem(1) px2rem(5) 0 rgba(0,0,0,.12)
    border:px2rem(1) solid rgba(0,0,0,.12)
    border-collapse:collapse
    white-space:no-wrap
    background-color:#FFF
    px2px("font-size",14)
    thead{
        vertical-align:middle
    }
    tbody{
        vertical-align:middle
    }
    th{
        padding:px2rem(8) px2rem(10)
        text-align:center
    }
    td{
        text-align:center
        border-top:px2rem(1) solid rgba(0,0,0,.12)
        border-bottom:px2rem(1) solid rgba(0,0,0,.12)
        padding:px2rem(8) px2rem(10)
        box-sizing:border-box
    }
}