/*
 0000000  000000000  000   000  000    
000          000      000 000   000    
0000000      000       00000    000    
     000     000        000     000    
0000000      000        000     0000000
*/

frameWidth          = 6px
titlebarHeight      = 30px
titlebarFontSize    = 15px

@font-face 
    font-family     titlebarFont
    font-weight     normal
    font-style      normal
    src             url("../../node_modules/kxk/styl/Bahnschrift.woff")

fill-abs()
    position            absolute
    bottom              0
    right               0
    left                0
    top                 0

// 0000000     0000000   0000000    000   000
// 000   000  000   000  000   000   000 000 
// 0000000    000   000  000   000    00000  
// 000   000  000   000  000   000     000   
// 0000000     0000000   0000000       000   

*
    outline-width       0
    
body
    fill-abs()
    margin              0
    overflow            hidden
    -webkit-user-select none
    
#main
    position            absolute
    bottom              0
    right               0
    left                0
    top                 titlebarHeight
    scroll              none
    overflow            hidden
    pointer-events      auto
            
// 000000000  000  000000000  000      00000000  0000000     0000000   00000000 
//    000     000     000     000      000       000   000  000   000  000   000
//    000     000     000     000      0000000   0000000    000000000  0000000  
//    000     000     000     000      000       000   000  000   000  000   000
//    000     000     000     0000000  00000000  0000000    000   000  000   000

#titlebar
    display             flex
    flex-direction      row
    height              titlebarHeight
    box-sizing          border-box
    font-size           titlebarFontSize
    font-family         titlebarFont
    white-space         nowrap
    cursor              pointer

.titlebar-title
    flex                1 1
    display             inline-block
    flex-direction      row
    padding-top         7px
    padding-left        10px
    padding-right       10px
    font                titlebarFont
    
.titlebar-dot
    display             inline-block
    vertical-align      top
    padding-left        9px
    padding-right       9px
    margin-top          -1px

#titlebar .winicon img
    pointer-events      all
    padding-left        6px
    padding-top         3px
    width               22px
    height              22px
    
#titlebar .winbutton
    flex                0 0 45px
    display             inline-block
    text-align          center
    vertical-align      bottom
    font-size           18px
    padding-top         2px
    pointer-events      all
    &.minimize
        padding-top     5px

#titlebar .topframe
    height              2px
    position            absolute
    left                0
    top                 0
    right               135px
        
// 00     00  00000000  000   000  000   000  
// 000   000  000       0000  000  000   000  
// 000000000  0000000   000 0 000  000   000  
// 000 0 000  000       000  0000  000   000  
// 000   000  00000000  000   000   0000000   
            
.menu
    height              titlebarHeight
    pointer-events      auto
    flex                0 0 0
    display             flex
    flex-direction      row
    
.menuItem
    cursor              pointer
    padding-left        10px
    padding-right       10px
    padding-top         7px
    display             inline-block
    height              titlebarHeight
    overflow            visible
            
// 00000000    0000000   00000000   000   000  00000000
// 000   000  000   000  000   000  000   000  000   000
// 00000000   000   000  00000000   000   000  00000000
// 000        000   000  000        000   000  000
// 000         0000000   000         0000000   000

.popup
    z-index             9999
    position            absolute
    border-radius       3px
    font-size           titlebarFontSize
    font-family         titlebarFont
    &.titlemenu
        border-top-left-radius   0
        border-top-right-radius  0
    
.popupItem
    padding             2px
    padding-left        2 * frameWidth
    padding-right       2 * frameWidth + 70px
    cursor              pointer
    &.separator
        padding         0
        cursor          default
        border          0
        height          0
        margin-top      6px
        margin-bottom   6px
    &:last-child
        padding-bottom  frameWidth
    &:first-child
        padding-top     frameWidth

.popupCombo
    pointer-events      none
    position            absolute
    right               2 * frameWidth
    
//  0000000   0000000  00000000    0000000   000      000      
// 000       000       000   000  000   000  000      000      
// 0000000   000       0000000    000   000  000      000      
//      000  000       000   000  000   000  000      000      
// 0000000    0000000  000   000   0000000   0000000  0000000  

::-webkit-scrollbar
    width                   frameWidth
::-webkit-scrollbar
    height                  frameWidth  
    background-color        transparent
::-webkit-scrollbar-track
    background-color        transparent
    
    