.white-content{

background: $light-bg;
  // .content{
  //   background: $light-bg;
  // }

.navbar.navbar-transparent .navbar-brand{
  color: $black-states;
}

.navbar.navbar-transparent .navbar-toggler-bar{
  background: $black-states;
}
.navbar.navbar-transparent .navbar-nav li a:not(.dropdown-item){
    color: $black-states;
    & i{
      color: $black-states;
    }
}

.navbar.navbar-transparent .navbar-minimize button i{
  color: $black-states;
}

.navbar.navbar-transparent .search-bar.input-group i{
  color: $black-states;
}
.navbar.navbar-transparent .search-bar.input-group .form-control{
  color: $default;
  &::placeholder{
    color: $dark-gray;
  }
}

.sidebar{
  box-shadow: 0 2px 22px 0 rgba(0,0,0,.1), 0 4px 20px 0 rgba(0,0,0,.15);
  p{
    color: $opacity-8;
  }
}

.main-panel{
  background: $light-bg;
  &.main-panel-admin{
    background: $white;
  }
}

h1, h2, h3, h4, h5, h6, p, ol li, ul li, pre {
  color: $black-states;
}

.font-icon-detail i{
  color: $black;
}

.btn:not([data-action]):hover,
.btn:not(.btn-white):hover{
  box-shadow:  0 4px 6px rgba(50,50,93,.11), 0 1px 3px rgba(0,0,0,.08);
}

.btn-neutral.btn-link{
  color: rgba($black, 0.7);
}

//style for inputs

@include form-control-placeholder(rgba($black,0.4), 1);
  .has-danger{
    .form-control, .input-group-prepend .input-group-text{
      border-color: $danger-states;
    }
  }

  .input-group-prepend .input-group-text{
    border-color: rgba($black-states,0.5);
    color: $black-states;
  }

  .form-control{
    color: $black;
    border-color: rgba($black-states,0.5);
    &:focus{
      border-color: $primary;
    }
  }

.form-group.no-border,
.input-group.no-border{
    .form-control,
    .form-control + .input-group-prepend .input-group-text,
    .form-control + .input-group-append .input-group-text,
    .input-group-prepend .input-group-text,
    .input-group-append .input-group-text{
        background-color: $opacity-gray-3;
        &:focus,
        &:active,
        &:active{
            background-color: $opacity-gray-5;
        }
    }

    .form-control{
        &:focus{
            & + .input-group-prepend .input-group-text,
            & + .input-group-append .input-group-text{

                background-color: $transparent-bg;
            }
        }
    }

}

.input-group[disabled]{
    .input-group-prepend .input-group-text,
    .input-group-append .input-group-text{
        background-color: $black;
    }
}

.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control{
  background: $light-gray;
  border-color: rgba($black-states,0.3);
}

.input-group-focus{
    .input-group-prepend .input-group-text,
    .input-group-append .input-group-text,
    .form-control{
      border-color: $primary;
    }

    &.no-border{
        .input-group-prepend .input-group-text,
        .input-group-append .input-group-text{

            background-color: $opacity-gray-5;
        }
    }
}
.input-group-prepend .input-group-text {
    border-right: none;
}

.input-group-append .input-group-text {
    border-left: none;
}

.has-danger .form-control:focus, .has-success.input-group-focus .input-group-append .input-group-text, .has-success.input-group-focus .input-group-prepend .input-group-text {
  border-color: $danger-states;
}

.has-success .form-control:focus, .has-success.input-group-focus .input-group-append .input-group-text, .has-success.input-group-focus .input-group-prepend .input-group-text {
  border-color: darken($success, 10%);
}

.btn.btn-link{
  &:hover,&:active, &:focus{
    color: $dark-gray !important;
  }
}

.btn-group .btn.active{
  box-shadow: 0 4px 6px rgba(50,50,93,.11), 0 1px 3px rgba(0,0,0,.08);
}

.bootstrap-switch.bootstrap-switch-off .bootstrap-switch-label{
  background: darken($light-bg,10%);
}

.bootstrap-switch-off:before{
  background: rgba(darken($light-bg,10%),0.5);

}

.card:not(.card-white){
  &.card-pricing, &.card-login, &.card-register{
    background: $card-black-background;
  }
  &.card-login, &.card-register{
    @include form-control-placeholder(#6c757c, 1);

    .form-control{
      border-color: lighten($black,5%);
    }

    .form-group.no-border,
    .input-group.no-border{
        .form-control,
        .form-control + .input-group-prepend .input-group-text,
        .form-control + .input-group-append .input-group-text{

            background-color: lighten($black,1%);
            &:focus,
            &:active,
            &:active{
                background-color: lighten($black,2%);
            }
        }

        .form-control{
            &:focus{
                & + .input-group-prepend .input-group-text,
                & + .input-group-append .input-group-text{
                    background-color: lighten($black,2%);
                }
            }
        }

        .input-group-prepend .input-group-text,
        .input-group-append .input-group-text{
            background-color: lighten($black,1%);;

        }
    }

    .input-group-append .input-group-text,
    .input-group-prepend .input-group-text {
        border: 1px solid lighten($black,5%);
        border-right: none;
        color: $white;
  }

  .input-group-focus{
    .input-group-prepend .input-group-text,
    .input-group-append .input-group-text,
    .form-control{
      border-color: $primary;
    }
  }

  .form-control{
    color: $white;
  }

  label{
    color: $opacity-6;
  }
}

}

.card:not(.card-white){
  background: $white;
  // box-shadow: 0 1px 15px 0 rgba(123, 123, 123, 0.05);
  box-shadow: 0 12px 40px -12px rgba(56, 40, 77, 0.3);
  .card-header{
    color: $black;
    a[data-toggle="collapse"]{
      color: $black;
    }
  }
  .card-header .card-title, .card-body .card-title{
    color: $black-states;
  }

  .card-body{
    .card-category, .card-description{
      color: $black-states;
    }
  }

  label:not(.btn){
    color: $default;
  }

   .pagination .page-item:not(.active) .page-link{
     color: $black-states;
      &:hover{
        background: rgba($dark-gray,0.1);
      }
   }

   &:not(.card-wizard).nav-pills .nav-item .nav-link {
      color: $nav-gray;
      background-color: hsla(0,0%,87%,.3);
      &:not(.active):hover{
        background: hsla(0,0%,87%,.5);
      }
      &.active{
        color: $white;

      }
  }

  .tab-content .tab-pane {
      color: $nav-gray;
  }

  .card{
    box-shadow: none;
  }

  .card-collapse{
    .card{
      .card-body{
        color: $dark-gray;
      }
    }
  }

  &.card-contributions{
    span{
      color: $dark-gray;
    }
    .bootstrap-switch-container{
      span{
        color: $white;
      }
    }
  }
  &.card-plain{
    background: $transparent-bg;
    box-shadow: none;
  }

  &.card-tasks{
    .card-body{
      i{
        color: rgba(34,42,66,0.7);
        &:hover{
          color: $black;
        }
      }
    }
  }
}

.table{

    > tbody > tr > td {
      color: rgba($black, 0.7) !important;

  }

  > thead > tr > th,
  > tbody > tr > th,
  > tfoot > tr > th,
  > thead > tr > td,
  > tbody > tr > td,
  > tfoot > tr > td{
      border-color: rgba($black, 0.2);
      padding: 12px 7px;
      vertical-align: middle;
  }

  > thead > tr > th, button.btn-neutral.btn-link{
    color: rgba($black, 0.7);
  }
}

.footer ul li a{
  color: $black-states;
}

.footer .copyright{
  color: $black-states;
}

.progress-container, .progress-container.progress.sm{
    .progress{
      background: rgba($black,0.1);
      box-shadow: 0 0 0 3px rgba($black,0.1);
      .progress-value{
        color: $default;
      }
    }

    .progress-badge{
      color: $black-states;
    }
}

.bootstrap-select button.dropdown-toggle{
  border-color: rgba($dark-gray,0.5);
  .filter-option{
    color: $black-states;
  }

  &:after{
    color: $black-states;
  }

}

//style for calendar

.fc-basic-view .fc-day-number, .fc-basic-view .fc-week-number {
    padding: 2px;
    color: $default;
}

.fc-unthemed .fc-today{
  background: darken($light-bg,10%);
}

.fc-unthemed .fc-content, .fc-unthemed .fc-divider, .fc-unthemed .fc-list-heading td, .fc-unthemed .fc-list-view, .fc-unthemed .fc-popover, .fc-unthemed .fc-row, .fc-unthemed tbody, .fc-unthemed td, .fc-unthemed th, .fc-unthemed thead {
      border-color: $calendar-gray;
  }

 .fc-prev-button, .fc-next-button{
   color: $default;
   &:hover{
     color: $default;
   }
 }

 .fc button.btn-primary:not([data-action]):hover, .fc button:not([data-action]):hover {
   box-shadow: 0 4px 6px rgba(50,50,93,.11), 0 1px 3px rgba(0,0,0,.08);
 }

 .full-page{
   background: $light-bg;

   h1, h2, h3, h4, h5, h6, p, ol li, ul li, pre {
     color: $black-states;
   }

   .description{
     color: $dark-gray;
   }

   .footer ul li a{
     color: $black-states;
   }

   .footer .copyright{
     color: $black-states;
   }
 }

 .nav-pills .nav-item .nav-link:not(.active){
   background: darken($light-bg,10%);
   color: $black-states;
   &:hover{
       @include diagonal-gradient($rework, $success);
   }
 }

 .card-pricing:not(.card-white){
   ul li {
      color: $white;
   }
 }

 .card:not(.card-pricing){

   &.card-wizard{
     .card-body{
       background: $white;
     }
     .card-footer{
       background-color: $white !important;
     }

     .nav-pills .nav-item .nav-link p{
       color: $black-states;
     }
   }

   &.card-stats {
     hr{
       border-color: rgba($black-states,0.1);
     }
     .card-title{
       color: $black-states;
     }
     .card-category, .stats{
       color: $card-stats-gray;
     }

   }

 }

 .card-timeline .timeline>li.timeline-inverted>.timeline-panel{
   background: $white;
   .timeline-body p{
     color: $black-states;
   }

   &:after, &:before{
     border-right-color: $white;
     border-left-color: $white;
   }
 }

 .card-timeline .timeline:before{
   background-color: $light-gray;
 }

}