/*Theme Custom EMJ Consulting
Author: Francisco Sánchez
Company: IDEGRÁFICO Consultores WEB
Web: https://idegrafico.com/
Year: 2021
Versión: 1.0/*

/*Config System*/

@import url('https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700;900&family=Manjari:wght@100;400;700&display=swap');

:root {
	--color-0: #0e3469;
	--color-1: #f76f3b; /*--color-1: #1b458a;*/
	--color-2: #f7ac3b; /*--color-2: #1773e2;*/
	--color-3: #eaeaea;
	--color-4: #000000;
	--color-5: #ffffff;
	--color-6: #4d4d4d;
	--color-7: #4e4e54;
	--color-8: #f7f7f7;
	--heading-font: 'Manjari', sans-serif;
	--text-font: 'Lato', sans-serif;
	--alert: #ffc107;
	--info: #7d7d7d;
}

body{font-family: var(--text-font); color: var(--color-6); overflow: hidden;}
body.fixed-nav {padding-top: 50px;}
.content-wrapper{height: calc(100vh - 156px); margin-left: 0 !important}
body.sticky-footer .content-wrapper {min-height: calc(100vh - 50px - 56px)}
.table td, .table th {padding: 0.25rem;}


/*End Config System*/

/*Login*/
.logo{width: 80%; max-width: 260px; display: table; position: relative; margin: 0 auto; padding: 20px 0; margin-top: calc(50vh - 300px)}
.logo img{max-width: 100%}
/*.card-login{top: calc(50vh - 225px)}*/
/*End Login*/

/* Bootstrap*/
.bg-dark{background: var(--color-8) !important;}
.card{background: none; box-shadow: 0.1em 1em 1em var(--color-3)}
.modal-dialog{background: none; box-shadow: 0.1em 1em 1em var(--color-4)}
.modal-dialog .card{background: none; box-shadow: none}
.card-header{font-family: var(--heading-font); font-weight: 400; font-size: 1.5rem; line-height: 1.5rem; display: block !important; padding-top: 20px; background: var(--color-2); color: var(--color-5)}
.modal-header{background: var(--color-2); color: var(--color-5); border-radius:  calc(.25rem - 1px) calc(.25rem - 1px) 0 0;}
.modal-title{font-family: var(--heading-font); font-weight: 400; font-size: 1.5rem; line-height: 1.5rem; display: block !important; padding-top: 10px; }
.modal-footer{background: var(--color-3); border-radius:   0 0 calc(.25rem - 1px) calc(.25rem - 1px);}
.card-body{background: var(--color-5); border-radius: 0 0 calc(.25rem - 1px) calc(.25rem - 1px)}
.mt-5 {margin-top: 0 !important;}
.card-body label{color: var(--color-2)}
.cursor-hand{cursor: pointer;padding: 2px 20px !important;margin: -3px 00px 10px 10px;background: var(--color-5) !important;color: var(--color-6) !important;border: solid var(--color-3);border-radius: 0.25rem;font-size: 0.75rem !important;}
.cursor-hand:hover {background: var(--color-3) !important;}
.btn-primary{background: var(--color-2); cursor: pointer}
.btn-primary:hover {background: var(--color-1)}
.btn-secondary{background: var(--color-1); cursor: pointer; border: solid 1px var(--color-1)}
.btn-secondary:hover {background: var(--color-4)}
.btn-info{background: var(--info) !important; border: solid 1px var(--info); color: var(--color-5)}
.btn-info:hover{background: var(--color-4) !important; border: solid 1px var(--color-4); color: var(--color-5)}
button.close{opacity: 0.75; cursor: pointer}
button.close:hover{opacity: 1}
button.close span{background: var(--color-1); color: var(--color-5); text-shadow: none; line-height: 0 !important; margin: 0; padding: 0 6px; border-radius: 0.25rem;}
button.close:hover span{background: var(--color-1); color: var(--color-5); text-shadow: none; line-height: 0 !important; margin: 0; padding: 0 6px; border-radius: 0.25rem;}
.breadcrumb{background: var(--color-3); color: var(--color-0)}
.card-header .alert-info{background: var(--alert); font-size: 1rem; padding: 5px 10px; border-radius: 5px}
.card-header .alert-info:hover{background: var(--color-4); color: var(--color-5); text-decoration: none}
.alert-warning{background: var(--color-5);box-sizing: border-box;color: #ff0000 !important;/* padding: 10px */}
/*End Bootstrap*/

/*Navbar*/
.navbar-expand-lg{box-shadow: 0em 0.2em 0.2em var(--color-3); padding: 0.3rem 1rem}
.navbar-brand{padding-top: 0 !important;padding-bottom: 0;width: fit-content !important;}
.navbar-sidenav{background: var(--color-7) !important;}
#menu .nav-item:hover a:not(.dropdown-item *), #menu .nav-item:hover span{color: var(--color-2) !important;opacity: 1;}
#menu .nav-item a[aria-expanded="true"], #menu .nav-item span[aria-expanded="true"], menu-perfil .nav-item a[aria-expanded="true"], #menu-perfil .nav-item span[aria-expanded="true"]{color: var(--color-1) !important;opacity: 1;}
#menu .nav-item a:not(.dropdown-item *), #menu .nav-link-collapse:after, #menu .nav-item span, #menu-perfil .nav-item a:not(.dropdown-item *), #menu-perfil .nav-link-collapse:after{color: var(--color-1) !important;}
#menu li{display: flex;align-items: center;}
#menu .nav-item:hover{border-bottom: solid 3px var(--color-1); margin-bottom: -3px}
#menu .nav-item i{display: none !important}

#menu {margin-bottom: -2px;}
#menu .nav-item .dropdown-menu{border-radius: 0 0 5px 5px;}
#menu .nav-item .dropdown-menu{background: var(--color-3); top:41px; padding:0; border-top:0}
#menu .nav-item .dropdown-item *{color: var(--color-1) !important; width: 100% !important; margin: 0}
#menu .nav-item .dropdown-item {border-bottom: solid 1px var(--color-5) !important; padding:0 10px; line-height: 35px}
#menu .nav-item .dropdown-item:last-child {border-bottom: 0 !important}
#menu .dropdown-item:hover *{color: var(--color-5) !important; text-decoration: none;}
#menu .dropdown-item:hover{background-color: var(--color-1) !important}
#mainNav .navbar-collapse .navbar-nav > .nav-item.dropdown > .nav-link:after, #menu-user .navbar-collapse .navbar-nav > .nav-item.dropdown > .nav-link:after {content: '\f107' !important;}
.header-perfil-empresa{position: absolute;max-width: 400px;right: 170px;text-align: right;font-size: 0.55rem;line-height: 36px;text-transform: uppercase !important;overflow:hidden;box-sizing: border-box}
.header-menu-perfil {color: var(--color-1) !important;  background:var(--color-3); padding: 10px; font-size: 0.85rem; text-align: center; overflow: hidden; box-sizing: border-box;}
/*End Navbar*/

/*Menu User*/
#menu-user{margin-bottom: -2px}
#menu-user > .nav-item > * {color: var(--color-5);}
#menu-user > .nav-item:hover {border-bottom: solid 2px var(--color-3); margin-bottom: -2px;}
#menu-user li:not(.dropdown-submenu) > .nav-link {background: var(--color-1);  border-radius: 5px; padding-left: 15px}
#menu-user .dropdown-toggle::after{display: none !important}
#menu-user .dropdown-submenu span{display: flex !important; white-space:nowrap;}
#menu-user .nav-link:after {float: right; width: 24px; text-align: center; content: '\f107'; border: none; font-family: 'FontAwesome';}
#menu-user .dropdown-submenu .nav-link{padding: 0; color: var(--color-1) !important}
#menu-user .dropdown-menu li:hover{background: var(--color-1)}
#menu-user .dropdown-menu li:hover .nav-link {color: var(--color-5) !important;}
#menu-user .dropdown-menu{padding: 0; border-radius: 0 0 5px 5px; border-top: var(--color-3)}
#menu-user .dropdown-item, #menu-user .dropdown-submenu, #menu-user .dropdown-submenu {padding: 0}
#menu-user .dropdown-item a, #menu-user .dropdown-submenu a{display: block;padding: 0px 10px;line-height: 35px;color: var(--color-1)}
#menu-user .dropdown-item a:hover, #menu-user .dropdown-submenu a:hover{text-decoration: none; background: var(--color-1); color: var(--color-5)}
#menu-user > .nav-item > .dropdown-menu{top: 41px !important}
#menu-user > .nav-item:hover > .dropdown-menu > .dropdown-submenu:hover > .dropdown-menu{display: block}
#menu-user .dropdown-menu li{border-bottom: solid 1px #d7d7d7 !important;}
#menu-user .dropdown-menu .dropdown-item:last-child{border: 0 !important}
#menu-user .dropdown-submenu > .dropdown-menu {border: solid 1px #d7d7d7; margin-top: -1px; border-radius: 5px;}
/*End Menu user*/

/*jQuery*/
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active{
  border:1px solid var(--color-5) !important;
  background: var(--color-1) !important;
  font-weight:normal;
  color: var(--color-5) !important;}
  
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight{
  border: 1px solid var(--color-5) !important;
    background: var(--color-2) !important;
    font-weight: normal;
    color: var(--color-5) !important;
}

.ui-widget-content, .ui-widget-header {
    border: 1px solid var(--color-1)!important;
    background: var(--color-1) !important;
    color: #fff;
}
/*End jQuery*/

/*Content*/
.content-wrapper{background: var(--color-5)}
.ml-auto .nav-link{background: var(--color-1); color: var(--color-3) !important; border-radius: 0.25rem}
.navbar-nav.ml-auto .fa{background: var(--color-2); color: var(--color-5); width: 30px; height: 30px; line-height: 30px; border-radius: 0.25rem; margin-right: 0.25rem}
.page-header{font-family: var(--heading-font); color: var(--color-1)}
.page-header small{color: var(--color-2); font-size: 1rem}
.page-header small:before{content:">"; margin-right: 0.5rem;}
/*End Content */

/*Footer*/
footer.sticky-footer{background: var(--color-1) !important; color: var(--color-5); box-shadow: 0em 0em 0.2em var(--color-5);}
#sidenavToggler{background: var(--color-7);}
#sidenavToggler .fa{background: var(--color-5); width: 1.5rem; height: 1.5rem; line-height: 1.5rem; border-radius: 0.25rem; color: var(--color-4) !important}
footer.sticky-footer {width: calc(100%) !important;}
/*End Footer*/

/*Media Query*/

@media only screen and (max-width: 991px){
	.navbar-expand-lg{box-shadow: 0em 0.2em 0.2em var(--color-3); padding: 0.5rem 0rem !important;}
	.navbar-brand{padding-left: 1rem }
	#navbarResponsive{margin-top: 0.5rem; margin-bottom: -0.5rem}
	#navbarResponsive .nav-link{padding: 0.5rem 1rem}
}

/* End Media Query */

/*SCROLL BAR*/

::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	border-radius: 0px;
	background-color: #F5F5F5;
}

::-webkit-scrollbar
{
	width: 5px;
	background-color: #F5F5F5;
}

::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
	background-color: #555;
}

/* END SCROLL BAR*/

/* TABLAS */

table th {color: var(--color-3) !important; background: var(--color-1); border-radius: 5px;}
table {border: 0 !important;}
table tr:nth-child(odd) {background: var(--color-3) !important}
table tr:nth-child(even) {background: var(--color-5) !important;}
table{
  border-collapse: separate;
  border-spacing: 1px 3px;
}

table tr:nth-child(odd) td{border: solid 1px var(--color-5) !important;vertical-align: middle;}
table tr:nth-child(even) td{border: solid 1px var(--color-3) !important;vertical-align: middle;}


td:first-child {
    border-top-left-radius: 5px; 
    border-bottom-left-radius: 5px;
}
td:last-child {
    border-bottom-right-radius: 5px; 
    border-top-right-radius: 5px; 
}

td input[type=button]{border-radius: 2.5px !important; text-transform: capitalize; border: 0; font-size: 0.75rem; padding: 5px; background: var(--color-2) !important; color: var(--color-5); cursor: pointer}
td input[type=button]:hover{background: var(--color-1) !important}
input{font-family: var(--heading-font)}

.navbar-toggler-right.collapsed{background: var(--color-1)!important; padding: 0.5rem; margin-right: 15px}
.navbar-toggler{background: var(--color-2)!important; padding: 0.5rem; margin-right: 15px}
@media only screen and (max-width: 768px){
  .col-1, .col-2, .col-8{width: 100% !important; max-width: none !important; flex: none;}
}

@media (max-width: 991px){
#menu li {display: block !important; box-sizing: border-box !important; border-bottom: solid var(--color-3)}
.header-perfil-empresa {display: block !important; position: relative !important; box-sizing: border-box !important; text-align: center !important; max-width: none !important; right: inherit !important}
#mainNav .navbar-collapse{padding-bottom: 10px; max-height: 85vh !important;}
#mainNav .navbar-collapse .navbar-nav > .nav-item.dropdown > .nav-link:after, #menu-user .navbar-collapse .navbar-nav > .nav-item.dropdown > .nav-link:after {padding: 0 10px;}}

@media (min-width: 1200px){
#menu-user .dropdown-submenu .dropdown-menu{position: absolute !important; right: 100% !important; top: inherit; vertical-align: top; margin-top: -36px !important}
#menu-user .dropdown-submenu li:first-child {overflow: hidden; border-radius: 5px 5px 0 0 !important}
#menu-user .dropdown-submenu li:last-child, #menu-user .dropdown-menu li:last-child {overflow: hidden; border-radius: 0 0 5px 5px !important}
}

@media (max-width: 1199px){
#menu-user .dropdown-submenu .dropdown-menu {
    position: relative !important;
    right: inherit !important;
    top: inherit;
    vertical-align: inherit;
    margin-top: 0 !important;}
#menu-user .dropdown-submenu li, #menu-user .dropdown-submenu > .dropdown-menu {border-radius: 0 !important; border: 0 !important}
}
@media (min-width: 992px) and (max-width: 1550px){
#navbarResponsive{display: block !important; font-size: 0.85rem}
#menu-user{float: right !important;}
body.fixed-nav{padding-top: 80px !important}
body.sticky-footer .content-wrapper {min-height: calc(100vh - 80px - 56px) !important;}
}
@media (max-width: 991px){
body.fixed-nav{padding-top: 65px !important}
body.sticky-footer .content-wrapper {min-height: calc(100vh - 65px - 56px) !important;}
}

.form-group span, .form-group label, .form-group a {
	margin: 0 !important;
}