/*================================================================================
	Item Name: Fastag - WorldLine Theme
	Version: 1
================================================================================

NOTE:
------
PLACE HERE YOUR OWN SCSS CODES AND IF NEEDED, OVERRIDE THE STYLES FROM THE OTHER STYLESHEETS.*/
:root {
	/*
  --main-color: #00A0E4;  
  --table-bg-color: rgba(0, 160, 228, 0.16) !important;  
  --gradient-color: linear-gradient(0deg, rgb(0, 200, 255) 0%, rgb(0, 160,228) 56%);  */
  
  --main-color: #F58220;  
  --table-bg-color: rgba(245,130,32, 0.16) !important;  
  --gradient-color: linear-gradient(0deg, rgba(245,130,32,0.7) 0%, rgba(245,130,32,1) 56%);  

  --body-bg-color:;
}
html {
	/*
  --main-color: #00A0E4;  
  --table-bg-color: rgb(0, 160, 228, 0.16) !important;  
  --gradient-color: linear-gradient(0deg, rgb(0, 200, 255) 0%, rgb(0, 160,228) 56%);  
*/
  --main-color: #F58220;  
  --table-bg-color: rgba(245,130,32, 0.16) !important;  
  --gradient-color: linear-gradient(0deg, rgba(245,130,32,0.7) 0%, rgba(245,130,32,1) 56%);  

  --body-bg-color:;
}
.new-card{
	box-shadow: -9px -9px 18px 0px var(--gradient-color) !important; border: 2px solid var(--main-color);
}


.table-header-custom{
	background: var(--gradient-color); 
	color: #fff;
}
.dropdown-item.active, .dropdown-item:active{
  color: #FFF;
  text-decoration: none;
  background-color: var(--main-color);
}
.main-menu.menu-dark{
	 color: #000;
	 background: #fff;
}
.wl-header-op{
	background: var(--table-bg-color);

}
.form-control:focus{
  border: 2px solid var(--main-color);
}
.fa.fa-times, .fa.fa-check{
  color: var(--main-color) !important;
}
.main-menu.menu-dark .custom-navigation>li.open>a{
	color: #fff;
    background: var(--gradient-color);
}
.main-menu.menu-dark .custom-navigation>li.open{
	border-left: 6px solid var(--main-color);
}
.main-menu.menu-dark .custom-navigation>li ul .active>a{
	color: var(--main-color);
	background: #CCCCCC;
}
.main-menu.menu-dark .navigation li a{
	color: var(--main-color);
}
.navbar-semi-dark .navbar-header{
	background: #fff;
}
.main-menu.menu-dark .custom-navigation{
	background: #fff;
}
.main-menu.menu-dark .navigation>li>ul, .main-menu.menu-dark ul.menu-popout{
	background: #fff;
}
.main-menu.menu-dark .custom-navigation>li.open .hover>a{
	background: var(--gradient-color);
	color: #fff;
}
.main-menu.menu-dark .custom-navigation>li.active>a, .main-menu.menu-dark .custom-navigation>li.hover>a, .main-menu.menu-dark .custom-navigation>li:hover>a{
	background: var(--gradient-color);
	color: #fff;	
}
.main-menu.menu-dark .navigation>li.menu-collapsed-open a{
  background: var(--gradient-color);
  color: #fff;
}
.navbar-header .brand-logo{
	width: 145px;
}
.fileuploader-input .fileuploader-input-button, .fileuploader-popup .fileuploader-popup-header .fileuploader-popup-button.button-success{
    background: var(--gradient-color) !important;
}
.fileuploader-input .fileuploader-input-caption{
  color: var(--main-color) !important;
}
.brand-logo{
	width: 70%;
}
.netc-logo{
	width: 13%;
}
.fastag-logo{
	width: 75%;
}
.wl-btn{
	border-radius: 8px;
}
.wl-btn, .page-item.active .page-link{
	border-color: var(--main-color) !important;
    background: var(--gradient-color) !important;
}
.wl-btn:hover{
	border-color: var(--main-color) !important;
    background: var(--gradient-color) !important;
}
.wl-btn:active{
	border-color: var(--main-color) !important;
    background: #fff !important;
    color: var(--main-color) !important;
}
.wl-btn-clr{
	border-radius: 8px;
	background: #fff !important;
    color: var(--main-color);
    border-color: var(--main-color) !important;
}

.wl-btn-clr:hover{
	border-color: var(--main-color)!important;
    background: var(--gradient-color) !important;
	color: #fff;
}
.wl-btn-clr:active, .wl-btn-clr:focus{
	background: #fff !important;
    color: var(--main-color) !important;
    border-color: var(--main-color) !important;
}
.blue{
	color: #0066a1 !important;
}
html body .pace .pace-progress{
	background: var(--gradient-color);
}
.breadcrumb-color {
    background: var(--gradient-color);
    border-radius: 5px;
    margin: 0;
}
.page-item.active .page-link{
	 background: var(--gradient-color);
	 background-color: unset;
}
.breadcrumb-item a {
    color: #fff;
}
.breadcrumb-item.active {
    color: #fff;
}
.ft-eye {
    color: #01D8AF;
}
.ft-trash-2 {
    color: red;
}
.ft-lock {
    color: red;
}
.ft-toggle-right:before{
	color: var(--main-color);
}
.table-hover tbody tr:hover, .table-striped tbody tr:nth-of-type(even){
	background-color: var(--table-bg-color);
}
.table-hover tbody tr:hover, .table-striped tbody tr:nth-of-type(odd){
	background-color: #fff;
}
.select2-container--classic .select2-results__options .select2-results__option[aria-selected=true], .select2-container--default .select2-results__options .select2-results__option[aria-selected=true]{
	background-color: rgb(0, 160, 228) !important;
}
.btn-action:hover {
    background-color: #fff !important;
    color: var(--main-color) !important;
	pointer-events: none;
}
.custom-form .btn-primary {
  background-color: var(--main-color);
  border-color: var(--main-color);
}
.custom-form .form-group {
  position: relative;
  padding-top: 20px;
  margin-bottom: 16px;
}
.custom-form .form-group .animated-label {
  position: absolute;
  top: 0px;
  left: 0;
  bottom: 0;
  z-index: 2;
  width: 100%;
  opacity: 1;
  cursor: text;
  transition: 0.2s ease all;
  margin: 0;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
.custom-form .form-group .animated-label:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 45%;
  height: 2px;
  width: 10px;
  visibility: hidden;
  background-color: var(--main-color);
  transition: 0.2s ease all;
}
.custom-form .form-group.not-empty .animated-label {
  top: 0;
  font-size: 12px;
}
.custom-form .form-group .form-control {
  position: relative;
  z-index: 1;
  border-radius: 0;
  border-width: 0 0 1px;
  border-bottom-color: rgba(0, 0, 0, 0.25);
  height: auto;
  padding: 3px 0 5px;
}
.custom-form .form-group .form-control:focus {
  box-shadow: none;
  border-bottom-color: #fff;
}
.custom-form .form-group .form-control:focus ~ .animated-label {
  top: 0;
  opacity: 1;
  color: var(--main-color);
  font-size: 12px;
}
.custom-form .form-group select:focus{
	border-bottom-color: rgba(0, 0, 0, 0.25) !important;
}
.custom-form .form-group .form-control:focus ~ .animated-label:after {
  visibility: visible;
  width: 100%;
  left: 0;
}
.btn_details {
    position: relative !important;
    background-color: var(--main-color);
    color: #000;
}

.btn-floating {
    box-shadow: 0 5px 11px 0 rgba(0,0,0,.18), 0 4px 15px 0 rgba(0,0,0,.15);
    width: 47px;
    height: 47px;
    position: relative;
    z-index: 1;
    display: inline-block;
    overflow: hidden;
    -webkit-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    margin: 10px;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    padding: 0;
    cursor: pointer;
}
.primary.darken-2{
 color: var(--main-color) !important;
}

.custom-form h4 {
    color: var(--main-color);
    line-height: 3rem;
    margin-bottom: 20px;
    border-bottom: 1px solid var(--main-color);
}

.nav.nav-tabs.nav-top-border .nav-item a.nav-link.active{
	border-top:3px solid var(--main-color) !important;
}
.nav.nav-tabs.nav-top-border .nav-item a {
    color: var(--main-color) !important;
}
.wl-calendar-btn{
	border-color: var(--main-color) !important;
    background: var(--gradient-color) !important;
	color:#fff;
}
.dropzone{
  border: 2px dashed var(--main-color)!important;
}
.dropzone .dz-message, .dropzone .dz-message:before{
  color: var(--main-color)!important;
}

.nav.nav-tabs.nav-iconfall .nav-item a.active {
    color: var(--main-color)!important;
    border: none;
    background-color: transparent;
	font-weight: bold;
}
.nav.nav-tabs.nav-iconfall .nav-item a:hover {
    color: var(--main-color)!important;
    border: none;
}
.nav.nav-tabs.nav-underline .nav-item a.nav-link:before{
	background: var(--main-color);
}
.icon-wl{
	color: var(--main-color) !important;
}
.nav.nav-tabs.nav-linetriangle .nav-item a.nav-link.active{
    border-bottom: 1px solid var(--main-color);
    border-bottom-color: var(--main-color);
    color: var(--main-color);
}
.nav.nav-tabs.nav-linetriangle {
    border-bottom-color: var(--main-color);
}
.nav.nav-tabs.nav-linetriangle .nav-item a.nav-link.active:before {
    margin-left: -12px;
    border-width: 12px;
    border-top-color: var(--main-color);
}
#selected{
  color:var(--main-color);
  border-radius: 4px;
  padding:4px 6px;
  border: 1px solid grey;
}
.wl-btn-upload {
  background:var(--gradient-color);
  cursor:pointer;
  font-family: inherit !important;
  color:white;
  border-radius: 4px;
  padding:.75rem 1rem;
  font-family:inherit;
  border:0;
}
[data-menu=vertical-menu-modern] .navbar-dark .navbar-header .navbar-nav .nav-link, [data-menu=vertical-menu-modern] .navbar-semi-dark .navbar-header .navbar-nav .nav-link{
  color:var(--main-color);
}

.custom-header a {
  color: var(--main-color);
}
.app-content .wizard>.steps>ul>li.done .step{
	background-color: var(--main-color);
    border-color: var(--main-color);
    color: #FFF;
}
.app-content .wizard>.steps>ul>li.current .step{
	border-color: var(--main-color);
    background-color: #FFF;
    color: var(--main-color);
}
.app-content .wizard.wizard-circle>.steps>ul>li:after, .app-content .wizard.wizard-circle>.steps>ul>li:before{
  background-color: var(--main-color);
}
.app-content .wizard>.actions>ul>li>a{
  border-color: var(--main-color) !important;
    background: var(--gradient-color) !important;
    color: #fff !important;
    font-weight: 400 !important;
  display: inline-block;
    text-align: center;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    padding: .75rem 1rem;
    font-size: 1rem;
    line-height: 1.25;
    border-radius: .25rem;
    -webkit-transition: background-color .15s ease-in-out,border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
    -o-transition: background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    -moz-transition: background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    transition: background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    transition: background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
    min-width: 8.5rem;
    border-radius: 8px;
}
.main_content_holder{
  border: 2px solid var(--main-color);
  border-radius: 6px;
}
.modal-content{
	border: none;
}
.modal-header{
	background: var(--gradient-color);
}
.modal-title{
	color: #fff;
}
.main-menu-text span{
    font-size: 16px;
    font-weight: bold;
    font-family: inherit;
    color: var(--main-color);
}
.navigation-header span{
      font-size: 16px;
    font-weight: bold !important;
    font-family: inherit;
    color: var(--main-color);
}
.kt-aside__brand .kt-aside__brand-tools .kt-aside__brand-aside-toggler span {
    background: var(--main-color);
}
.kt-aside__brand .kt-aside__brand-tools .kt-aside__brand-aside-toggler span::before, .kt-aside__brand .kt-aside__brand-tools .kt-aside__brand-aside-toggler span::after {
    background: var(--main-color);
}
.form-section-modal
{
	color: var(--main-color);
    line-height: 3rem;
    margin-bottom: 20px;
    border-bottom: 1px solid var(--main-color);
}
.custom-control-input:checked~.custom-control-label::before{
	background-color: var(--main-color) !important;
}
.page-link{
	color: var(--main-color);
}