body{
    display:flex;flex-direction:column;
    min-height:100vh;height: 100vh;
    margin:0;padding:0;
    width:100%;min-width:800px;
    font-family:Arial, Helvetica, sans-serif;
    font-size:14px;
}
/*span>i.fa,span>i.fas,span>i.far{margin-right:5px;}*/
body>.head-top{height:45px;align-items: center;justify-content:space-between;}
body>.head-top>div{width:fit-content;}
body>.head-top>div{width:fit-content;}
body>.head-top .perusahaan{font-weight: bold;}
body>.body{
    flex:1;overflow:hidden;
}
img.logo-top{height:30px;width:auto;}

.flex-row{display:flex;flex-direction:row;}
.flex-column{display:flex;flex-direction:column;}
.flex-center{display:flex;align-items: center;justify-content: center;}

/*==================================*/
.popmenu {
    position: absolute;
    display: none;
    background: #fff;
    border: 1px solid #ccc;
    min-width: 120px;
    box-shadow: 2px 2px 6px rgba(0,0,0,.2);
    z-index: 1000;
}
.popitem {
    padding: 8px 12px;
    cursor: pointer;
}
.popitem[disabled] {
    cursor:default;
    background-color: #f0f0f0;;
    opacity: 0.45;
}
.popitem:hover {
    background: #f0f0f0;
}
/*==================================*/ 

.body>.menu-kiri{
    flex:1;
    min-width: 320px;max-width:400px;
    margin-right:5px;
    will-change: transform;
}
.body>.menu-kanan{
    flex:4;
    min-width: 450px;
}
.logo{width:64px;height: 64px;}
.profile-header>.logo{
    display:flex;
    width: fit-content;
}
.profile-header>.logo>img{flex:1;}

.menu-kiri>.menu-top{height:40px;display:flex;flex-direction:row;align-items: center;justify-content: space-between;padding-left:5px;padding-right: 5px;}
.menu-kiri>.menu-konten{flex:1;overflow:auto !important;padding:5px;}
.menu-kiri>div.wilayah{padding:5px;}
.menu-kiri>div.wilayah>span{margin-right:5px;}
.menu-kiri>div.wilayah>span:nth-child(2){display: flex;align-items: center;}
.menu-kiri>div.wilayah>select{flex:1;}

.list>.list-item{padding:5px;}
.list>.list-item>span{margin-right:5px;}
.list>.list-item[data-parent]{margin-left:15px;}
.list>.list-item[isform]{cursor:pointer;}
.list>.list-item:not([isform]){background-color: lightgrey;}

.menu-kanan{background-color: rgba(255, 255, 255, 0.089);}

.menu-kanan>.menu-top{height:35px;overflow-x: hidden;overflow-y:hidden;}
.menu-kanan>.menu-konten{flex:1;padding-top:5px;background-color: rgba(255, 255, 255, 0.637);display:flex;overflow:hidden;}
.menu-kanan>.menu-konten>.forms{flex:1;background-color: white;width:100%;height:100%;color:black;overflow: auto;display:flex;}
.menu-kanan>.menu-konten>.forms div[name=pengeluaran]{background-color: rgba(202, 215, 253, 1);}
.menu-kanan>.menu-konten>.forms div[name=pemasukan]{background-color: rgba(202, 215, 253, 1);}
.menu-kanan>.menu-konten>.forms>.form-konten{flex:1;}

.tab-head{
    display:flex;flex-direction:row;align-items: center;justify-content: space-around;
    width:fit-content;padding:5px 15px 5px 5px;border-radius: 0 5px 0 0;
    height:35px;cursor: pointer;position:relative;
    white-space:pre;margin-right:3px;
}

.tab-head>span{margin-right:5px;}
.tab-head>span.close{position:absolute;top:1px;right:1px;font-size:small;}


/*=====================================================*/
button:focus{border:1px solid black;}
/*=====================================================*/


.head-top.tema1{background-color: rgb(103, 155, 8);color:white;}
.body.tema1{background-color: rgb(56, 102, 230);color:white;}
.menu-kiri.tema1>div.wilayah{background-color:rgba(255, 255, 255, 0.637);color:rgb(56, 102, 230);}
.menu-kiri.tema1>.menu-konten{background-color: white;color:black;}

.tab-head.tema1{background-color:rgba(255, 255, 255, 0.07);}
.tab-head.selected.tema1{background-color:rgba(255, 255, 255, 0.637);color:rgb(56, 102, 230);}

.list.tema1>.list-item:hover{background-color: rgba(56, 102, 230, 0.15);}
.list.tema1>.list-item.selected{background-color: rgba(56, 102, 230, 0.28);}

table.tema1>thead{
    background-color: rgb(230, 229, 229);
}

.ffoot .itemtot{position:relative;}
.ffoot .itemtot::before{content:"Rp";font-size:9px;vertical-align: super; color:white;background-color: rgba(0, 0, 255, 0.308);border-radius:50%;padding:3px;}
.simbol-rp::before{content:"Rp";font-size:9px;margin-right:3px;vertical-align: super; color:white;background-color: rgba(0, 0, 255, 0.308);border-radius:50%;padding:3px;}