/*See internal documentation in EXM_2_Dev_Docs*/
/*
background/border primary colors:
  - default     #337AB7 | rgb(51,122,183)
  - dark        #204D74
  - light       #296090
  - soft        #79A7CE
plain text colors:
  - primary     #337AB7
*/

/*Classes which are in reseller template*/

/*backgrounds*/
.bg-primary {background-color: #337AB7 !important;}
.bg-primary-dark {background-color: #204D74;}
.bg-primary-light {background-color: #296090;}
.bg-primary-soft {background-color: #79A7CE;}

/*plain text*/
.text-primary {color: #337AB7 !important;}
.primary-hover:hover{color: #337AB7;}

/*buttons*/
.btn-primary {background-color: #337AB7; border-color: #337AB7;}
.btn-primary:hover, .btn-primary.hover {background-color: #296090; border-color: #204D74;}
.btn.btn-primary.disabled, .btn.btn-primary:disabled, .btn.btn-primary[disabled] {background-color: #79A7CE; border-color: #79A7CE;}
.btn-primary:not(:disabled):not(.disabled):not([disabled]).active, .btn-primary:not(:disabled):not(.disabled):not([disabled]):active, .show > .btn-primary.dropdown-toggle {background-color: #204D74; border-color: #204D74;}
.dropdown-item.hover, .dropdown-item:hover {background-color: #337AB7;}

/*link buttons*/
.btn-link:hover, .btn-link.hover, .btn-link.active {color: #337AB7;}

/*Navigation - Vertical pillows*/
.nav-pillow .nav-link {color: #337AB7;}
.nav-pillow .nav-link.active {background-color: #337AB7; border-color: #337AB7;}
.widget-list-pillow tr.active td {background-color: #337AB7; border-color: #337AB7;}

/*Header-General*/
.header-general-wrap {background-color: #FBFBFB; border-top-color: #EAEAEA; border-bottom-color: #EAEAEA; border-top-width: 1px; border-bottom-width: 1px; color: #444444;}
.header-general-wrap .header-general {text-transform: none; font-weight: normal;}
/*.header-general div.select {background-color: #F5F5F5;} /*hover and active are the same*/
.header-general div.select {color: #337AB7;}
.header-general div:hover {background-color: rgba(51,122,183,0.1);}*/
.header-general div.select {background-color: #F5F5F5; color: #337AB7;}
.header-general div:hover {background-color: #F5F5F5; color: #337AB7;/*rgba(51,122,183,0.1)*/;}

/*Header-General-Dropdown*/
.header-general-dropdown > div > div > div > div.h2 {text-transform: none; font-weight: normal;}
.header-general-dropdown {background-color: #FBFBFB; border-top-color: #EAEAEA; border-bottom-color: #337AB7;}
.header-general-dropdown .arrow {border-color: #EAEAEA; background-color: #FBFBFB;}


/*Classes which are NOT in reseller template, but its are can be potentially in there */

/*backgrounds*/
.bg-primary-extrasoft {background-color: rgba(51,122,183,0.1);}

/*plain text*/
.text-primary {color: #337AB7 !important;}
.primary-hover:hover{color: #337AB7;}

/*forms fields*/
.form-control:not(:disabled):not(.disabled):not([disabled]):hover, .form-control:not(:disabled):not(.disabled):not([disabled]).hover {border-color: rgba(51,122,183,0.6); box-shadow: 0 0 4px 0 rgba(51,122,183,0.4);}
.form-control:not(:disabled):not(.disabled):not([disabled]):focus {border-color: rgba(51,122,183,0.6);}

/*select boxes*/
/*hover border looks different with the design, don't change it without asckig Pascal!*/
.btn-light.dropdown-toggle:not(:disabled):not(.disabled).active, .btn-light.dropdown-toggle:not(:disabled):not(.disabled):active, .show > .btn-light.dropdown-toggle {border-color: rgba(51,122,183,0.6);}
.btn-light.dropdown-toggle:not(:disabled):not(.disabled):hover, .btn-light.dropdown-toggle:not(:disabled):not(.disabled).hover {border-color: rgba(51,122,183,0.6); box-shadow: 0 0 4px 0 rgba(51,122,183,0.4);}

/*radio and checkboxes*/
/* fill='%23<background primary default>' - checked*/
/*Material icons - radio_button_checked*/
.custom-radio .custom-control-input:checked ~ .custom-control-label:after {background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' height='17px' width='17px' viewBox='0 0 24 24'%3e%3cpath fill='%23337AB7'  d='M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5zm0-5C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z'/%3e%3c/svg%3e");}
/*Material icons - check_box*/
.custom-checkbox .custom-control-input:checked ~ .custom-control-label:after {background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' height='17px' width='17px' viewBox='0 0 24 24'%3e%3cpath fill='%23337AB7'  d='M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z'/%3e%3c/svg%3e");}

/*slider*/
.ui-slider.ui-slider-horizontal .ui-slider-range{background: #337AB7 !important;}
.ui-slider.ui-slider-horizontal .ui-slider-handle:hover {box-shadow: 0 0 4px 0 rgba(51,122,183,0.4);}

/*Datepicker*/
.daterangepicker td.available:not(.active):hover > span {color: #337AB7;}
.daterangepicker td.available.in-range, .daterangepicker td.available.in-range:hover {background-color: rgba(51,122,183,0.05);}
.daterangepicker .drp-calendar:not(.single) td:not(:last-child).active.start-date {background-image: linear-gradient(90deg, #FFFFFF 50%, rgba(51,122,183,0.05) 50%);}
.daterangepicker .drp-calendar:not(.single) td:not(:first-child).active.end-date {background-image: linear-gradient(90deg, rgba(51,122,183,0.05) 50%, #FFFFFF 50%);}
.daterangepicker .drp-calendar td:first-child.in-range {background-image: linear-gradient(90deg, #FFFFFF 15%, rgba(51,122,183,0.05) 15%);}
.daterangepicker .drp-calendar td:last-child.in-range {background-image: linear-gradient(90deg, rgba(51,122,183,0.05) 85%, #FFFFFF 85%);}
.daterangepicker td.active > span, .daterangepicker td.active:hover > span {background-color: #337AB7;}
/*Material icons - keyboard_arrow_down*/
.daterangepicker .calendar-table .prev:after, .daterangepicker .calendar-table .next:after {background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' %3E%3Cpath d='M0 0h24v24H0V0z' fill='none'/%3E%3Cpath fill='%23337AB7' d='M7.41 8.59L12 13.17l4.59-4.58L18 10l-6 6-6-6 1.41-1.41z'/%3E%3C/svg%3E");}

/*Table/report components*/
.table-report tbody tr:hover {background-color: rgba(51,122,183,0.1);}
.table-report td a:not(.dropdown-item) {color: #337AB7}
.mi.graph {background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24' viewBox='0 0 24 24' width='24'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M1 7h4v14h-4zM7 15h4v6h-4zM13 10h4v11h-4zM19 3h4v18h-4z' fill='%23337AB7'/%3E%3C/svg%3E");}

/*Table/Settings/ColumnSelector*/
.column-selector .ui-state-highlight {background-color: rgba(51,122,183,0.1) !important;}
.column-selector ul > li:hover {background-color: rgba(51,122,183,0.1);}
/*Dropdown Menu*/
.dropdown-style .dropdown-item.hover, .dropdown-style .dropdown-item:hover {background-color: rgba(51,122,183,0.1);}

/*Table in modal*/
.modal-table tr.active td {background-color: rgba(51,122,183,0.1);}

/*Widgets*/
.widget-row.node-drag:hover{background-color: rgba(51,122,183,0.1);}
.dragging-wrap {box-shadow: 0 0 7px rgba(0,0,0,0.13);}
.widget.ui-droppable-hover {border-color: #337AB7;}

/*Dashboard Action List*/
.dash-action-item:hover {border-color: #337AB7;}