:root {
  
  --action-rgb: 0, 91, 196;
  --action: rgba(var(--action-rgb), 1);

  --feature-rgb: 0, 78, 167;
  --feature: rgba(var(--feature-rgb), 1);
}

/*-- _typography.scss --*/

a{ color: var(--action); }
a:hover{
  color: var(--action);
  -webkit-filter: brightness(1.15);
  filter: brightness(1.15);  
}

a.el-section-subheading{
  color: var(--action);
}

a.el-section-subheading:hover{
  color: var(--action);
  -webkit-filter: brightness(1.15);
  filter: brightness(1.15);  
}


/*-- Utillity --*/

.color-action-bg{
  background-color:var(--action);
}

.color-feature-bg{
  background-color:var(--feature);
}


a{
  color:var(--action);
}

/*-- _buttons.scss --*/

.el-btn-high {
  background-color: var(--action);
}

.el-btn-high:hover {
  background-color: var(--action);
  -webkit-filter: brightness(1.15);
  filter: brightness(1.15);
}

.el-btn-high:focus {
  background-color: var(--action);
  -webkit-filter: brightness(1.2);
  filter: brightness(1.2);
}

.el-btn-med {
  border: 1px solid var(--action);
  color: var(--action);
}

.el-btn-med:hover,
.el-btn-low:hover {
  background-color: rgba(var(--action-rgb), 0.15);
  color: var(--action);
}

.el-btn-med:focus,
.el-btn-low:focus {
  background-color: rgba(var(--action-rgb), 0.2);
}

.el-btn-low {
  color: var(--action);
}

/*-- _components.scss --*/

ul.el-tabs .nav-item a.nav-link::before,
ul.el-tabs .nav-link a.nav-link::before {
  background: rgba(var(--action-rgb), 0.3);
}

ul.el-tabs .nav-item a.nav-link.active::before,
ul.el-tabs .nav-link a.nav-link.active::before {
  background: var(--action);
}

.el-tabs.nav-tabs .nav-item.show .nav-link,
.el-tabs.nav-tabs .nav-link.active {
  background: rgba(var(--action-rgb), 0.1);
}

.el-tabs.nav-tabs .nav-link:focus,
.el-tabs.nav-tabs .nav-link:hover {
  background-color: rgba(var(--action-rgb), 0.05);
}

.dropdown-item.active,
.dropdown-item:active {
  background-color: var(--action);
}

/*-- _core.scss --*/

::-moz-selection {
  background: var(--action);
}

::selection {
  background: var(--action);
}

/*-- _dialogs.scss --*/

.el-alert-snackbar .btn,
.el-alert-message>a{
  color: var(--action);
  filter: brightness(1.9)!important;
}

.el-alert-snackbar .btn:hover {
  background-color: rgba(var(--action-rgb), 0.2);
}

.el-dialog-head,
div.modal-header{
  background-color: var(--action);
}


/*-- _input.scss --*/

label.el-input input[type="radio"]:checked ~ span::before,
label.el-input input[type="checkbox"]:checked ~ span::before {
   color: var(--action);
 }

 .flatpickr-months .flatpickr-prev-month:hover svg,
 .flatpickr-months .flatpickr-next-month:hover svg{
   fill: var(--action);
 }

 .flatpickr-day.selected.startRange,
 .flatpickr-day.startRange.startRange,
 .flatpickr-day.endRange.startRange,
 .flatpickr-day.selected.endRange,
 .flatpickr-day.startRange.endRange,
 .flatpickr-day.endRange.endRange {

   background-color: var(--action);
 }
 

  .flatpickr-day.selected,
  .flatpickr-day.startRange,
  .flatpickr-day.endRange,
  .flatpickr-day.selected.inRange,
  .flatpickr-day.startRange.inRange,
  .flatpickr-day.endRange.inRange,
  .flatpickr-day.selected:focus,
  .flatpickr-day.startRange:focus,
  .flatpickr-day.endRange:focus,
  .flatpickr-day.selected:hover,
  .flatpickr-day.startRange:hover,
  .flatpickr-day.endRange:hover,
  .flatpickr-day.selected.prevMonthDay,
  .flatpickr-day.startRange.prevMonthDay,
  .flatpickr-day.endRange.prevMonthDay,
  .flatpickr-day.selected.nextMonthDay,
  .flatpickr-day.startRange.nextMonthDay,
  .flatpickr-day.endRange.nextMonthDay {
    background-color: var(--action);
  }

  .el-text-input:focus,
  .el-textarea-input:focus,
  .form-control:focus{
    border-bottom:3px solid var(--action);
  }

  .el-text-input:focus ~ label,
  .el-textarea-input:focus ~ label{
    color:var(--action);
  }

  .el-text-input:not(:placeholder-shown) ~ label,
  .el-textarea-input:not(:placeholder-shown) ~ label{
      color:var(--action);
  }
  
  .el-select-label.open{
    color:var(--action);
  }


  .el-switch-checkbox:checked + .el-switch-label {
    background-color: rgba(var(--action-rgb), 0.3);
}

.el-switch-checkbox:checked + .el-switch-label:before {
  background-color: var(--action);;   
}