/********************************************************************************
* QuData Chat Builder Plugin.
*
* Bot setup
*
* @copyright Copyright (C) 2021, qudata.com
********************************************************************************/

body{
    padding: 0;
    margin:  0;
    background-color:   var(--console-menu-color) !important;
    /* height: 100vh; */
}

input[type="checkbox"]:checked::before {
    margin: 0 !important;
    height: 100% !important;
    width: 100% !important;
  }
  

.console{
    font-size: 18px;
    line-height: 1.625;
    font-family:        '-apple-system', 'BlinkMacSystemFont',   "San Francisco", "Segoe UI", Arial, sans-serif;
    color:           #1D1D1F;
    margin:             0;
    padding: 0 0 40px 0;
    height: 100%;
}

.console a {
    color:            #0000AA;
    text-decoration:    none;
    cursor:             pointer;
}

.console h2{
    margin-top:         0px;
}

.console .header{
    height: 40px;
    color:            var(--console-menu-font-color);
    background-color: var(--console-menu-color);
    display: flex;
    align-items: center;
    padding: 0 10px;
}    

.console .content {
    display: flex;
    flex-direction: row;
    background:         var(--console-background);
    background-color:   var(--console-menu-color);
    height: calc(100% - 40px);
}    

.console .footer{   
    font-size:       12px; 
    height: 20px;
    display: flex;
    color: var(--console-menu-font-color);
    padding-left: 100px;
    width: 850px;
    background-color: var(--console-menu-color);             
    justify-content: flex-start;    
}    

.console .header .caption{
    font-size:  22px;
    line-height:22px;
    font-weight: 600;
    font-family: Inter,sans-serif;;
}    

/********************************************************************************
                                      Menu
********************************************************************************/

.console .content  .menu{
    background-color:  var(--console-menu-color);
    color:              var(--console-menu-font-color);
    font-family:        "San Francisco", "Segoe UI", Arial, sans-serif;
    font-size: 22px;
    font-weight: 600;
    padding-top: 1em;
}    

.console .content  .menu a {
    color: var(--console-menu-font-color); 
    background-color:var(--console-menu-color);     
    display: block;     
    padding: 8px 8px 8px 24px; 
    text-decoration: none; 
}

.console .content .menu a:hover {
     background-color: rgb(214, 250, 235) ; 
}

.console .content .menu a.active {
    background-color: var(--console-page-color); 
    color: green;
}

.console .content  .pages {
    height: 100%;
    width: 100%;
    background-color: var(--console-page-color);
    display: flex;
    flex-direction: column;
    overflow: auto;
    position: relative;
}