/*
xfontuser-ua.css
Stylesheet for Front-end admin/user account area used in xfuUserArea template
by dev.jpdn.net X itchiweb.com
*/
/* 
    Created on : Feb 28, 2020, 4:43:19 PM
    Author     : pkd
*/


/*
body{
    padding-top: 3.5rem;
}
*/
/* nav */
/* fix empecher l'augm. en hauteur SM */
/*
.fixed-top{
    max-height:56px;
}
*/

/* navbar, xFrontUSer menus, button, dropdown  */
.xfu-navbar a.btn:first-child,
.xfu-navbar button:first-child{
    margin-left:0rem;
}
.xfu-navbar a.btn,
.xfu-navbar button{
    margin-left:0.25rem;
}
#xua .brand .list-group-item{
  padding:0.50rem
}

#xua .xua-header{
    margin-bottom:2rem;
} 
#xua .brand img{
    max-height:60px;
    margin:0 auto;
}


/***** Sidebar *****/

#xua #body-row {
    /*
    margin-left: 0;
    margin-right: 0;
    */
    display: flex;
    width: 100%;
}


#xua #sidebar-container {
    min-height: calc(100vh - 3.5rem);/*- body top padding*/
    background-color: #132644;
    padding: 0;
    
    z-index: 999;
    transition: all 0.3s;
    position: fixed;
    top: 3.5rem;
    left: 0;
    /* flex: unset; */
}

/* content (ajax, right side )*/

#xua #ct-content{
    width: calc(100% - 230px);
    min-height: calc(100vh - 3.5rem);/*- body top padding*/
    padding: 0px;
    /*min-height: calc(100vh-3.5rem);*/
    transition: all 0.3s;
    position: absolute;
    top: 3.5rem;
    right: 0;
}

#xua #ct-content.active {
    /*margin-left: -230px;*/
    width: calc(100% - 60px);
    left:60px;
}

#xua .ui-widget.off{
    display:none;
}
#xua .ui-widget.off,
#xua .sidebar-collapsed .ui-widget.on{
    /*display:none;*/
}

#xua .sidebar-expanded {
    width: 230px;
}

#xua .sidebar-collapsed {
    width: 60px;
    /*width: 100px;*/
}


#xua #sidebar-container .brand .list-group{
    height: 80px;
    color: #cacaca;
    background-color: #132644;
    border-radius: 0;
}

#xua .sidebar-collapsed .nav-item{
    width: 60px;
}

#xua ul#xua-tabs.nav-tabs{
    border-bottom:none;
}

/* ----------| Menu item*/    
#xua #sidebar-container .list-group a {
    height: 50px;
    border-radius: 0;
}

#xua #sidebar-container .list-group-item:last-child {
    border-bottom-right-radius: 0rem;
    border-bottom-left-radius: 0rem;
}
#xua #sidebar-container .list-group-item:first-child {
    border-top-left-radius: 0rem;
    border-top-right-radius: 0rem;
}

/* ----------| Submenu item*/    
#xua #sidebar-container .list-group li.list-group-item {
    background-color: #132644;
}

#xua #sidebar-container .list-group .sidebar-submenu a {
    height: 45px;
    padding-left: 30px;
}


/* right margin */
#xua .fa{
    margin-right: 1rem;
    /*fix vertical align if collapsed*/
    line-height:inherit;
}
#xua .sidebar-collapsed  .fa{
    margin-right: 0rem !important;
}

#xua .sidebar-submenu {
    font-size: 0.9rem;
}

/* ----------| Separators */    
#xua .sidebar-separator-title {
    background-color: #132644;
    height: 35px;
}

#xua .sidebar-separator {
    background-color: #132644;
    height: 25px;
}

#xua .logo-separator {
    background-color: #132644;
    height: 60px;
}

#xua a.bg-dark {
    background-color: #343a40;
}

/* input placeholders */
#xua .form-control::-webkit-input-placeholder { color: #ef100e; opacity: 0.5; text-transform: uppercase; text-align: right; font-size: 0.8rem;}
#xua .form-control::-moz-placeholder { color: #ef100e; opacity: 0.5; text-transform: uppercase; text-align: right; font-size: 0.8rem;}
#xua .form-control:-ms-input-placeholder { color: #ef100e; opacity: 0.5; text-transform: uppercase; text-align: right; font-size: 0.8rem;}
#xua .form-control::-ms-input-placeholder { color: #ef100e; opacity: 0.5; text-transform: uppercase; text-align: right; font-size: 0.8rem;}
#xua .form-control::placeholder { color: #ef100e; opacity: 0.5; text-transform: uppercase; text-align: right; font-size: 0.8rem;}


/* by dev.jpdn.net*/
/* ----------| Menu item*/
#xua #sidebar-container .list-group a.list-group-item{
    color: #fff;
    background-color:#ff0404;
    border-color: #343a40;
}
#xua #sidebar-container .list-group a.list-group-item.active{
    color: #fff;
    /*background-color:#ff0404;*/
    border-color: #464646;
    /*background-color: #1d2124 !important;*/
}

/* arrow sign for active */
.list-group-item.active::after {
    display: inline-block;
    margin-right: -1px;
    vertical-align: .255em;
    position: absolute;
    right:0;
    top:1rem;
    content: "";
 /*
    border-top: 0.5em solid;
    border-right: 0.5em solid transparent;
    border-bottom: 0.5em;
    border-left:   0.5em solid transparent;
*/
  width: 0; 
  height: 0; 
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent; 
  border-right:10px solid #fff; 
  
}



/* Filed profile/avatar */
.custom-file.x-preview img{
    height: 38px;
    z-index: 20;
    position: absolute;
    display: inline-block;
    left: 0px;
    top: 0px;
    border-left: 1px solid #ced4da;
    border-top: 1px solid #ced4da;
    border-bottom: 1px solid #ced4da;
}
.x-preview .custom-file-label{
    margin-left: 37px;
    
}

/*******************
Select2 overrides
*/
/* field height */
.select2-container .select2-selection--single{
    height: calc(1.5em + .75rem + 2px);
    padding: .375rem .75rem;
    font-size: 1rem; 
}
/* arrow pos. */
.select2-container--default .select2-selection--single .select2-selection__arrow{
    height: calc(1.5em + .75rem + 2px);
    width:2rem;
}
/* arrow size*/
.select2-container--default .select2-selection--single .select2-selection__arrow b {
    margin-top: -4px;
    border-width: 8px 6px 0 6px;
}
/* selected text vert.center */
.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: inherit;
}
/* align. avec les champs text */
.select2-container .select2-selection--single .select2-selection__rendered{
    padding-left:0;
}

/*******************
b4 overrides
*/

/* disable roubd borders */
form.x-noborder * {
  -webkit-border-radius: 0 !important;
     -moz-border-radius: 0 !important;
          border-radius: 0 !important;
}
/* form control */
.form-control:focus {
    color: #495057;
    background-color: #fff;
    border-color: #343a40;
    /*inset: -5px;*/
    box-shadow: 0px 0 0px .1rem rgba(52, 58, 64, 0.2);
}


/*
.custom-control.custom-switch:hover{
    cursor:pointer !important;
}
*/
/* clock */
#for_ext_uiclock {
    color: #a2a2a2;
    /*right: 0;*/
    display: inline-block;
    /*position: absolute;*/
    padding: 0 15px;
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    font-size: 1.25rem;
}


/**************************************
Bootstrap 4 default responsive queries
*/

/* XS  Extra small devices (portrait phones, less than 576px) No media query since this is the default in Bootstrap */

/* SM Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
}

/* MD  Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
    #xua .brand img{
        margin: 0 0px 0 5px;
    }
}

/*LG  Large devices (desktops, 992px and up) */
@media (min-width: 992px) { 
    
}

/* XL Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 
}