/*
 * Vaaleampi pääväri - #e38d87 / rgba(227, 141, 135, 0.5)
 * Pääväri - #e32013
 * Vaalein harmaa - #F7F7F7
 * Toiseksi vaalein harmaa - #ECEEEF;
 * Harmaa - #807679
 * Tummempi harmaa - #575756
 */

.list-group-item.active {
  background-color: #e32013;
  border-color: #e32013;
}
a,
a.page-link,
a.dropdown-item,
a:hover,
a.page-link:hover,
.dropdown-item:hover,
a:focus,
a.page-link:focus,
.dropdown-item:focus {
  color: #e32013;
}
.dropdown-item:focus {
  background-color: #ECEEEF;
}

.btn {
  position: relative;
  overflow: hidden;
}

.btn-direct::after {
  /* slash */
  content: '';
  display: block;
  position: absolute;
  height: 100%;
  width: 20px;
  right: -25px;
  top: -1px;
  transform: skewX(45deg);
}

.special-actions .btn-direct::after {
  width: 20px;
  right: -35px;
}

.btn-primary.btn-direct::after,
.btn-other.btn-direct::after {
  background: white;
}

.btn-secondary.btn-direct::after {
  background: #e38d87;
}

.disabled.btn-direct::after,
.btn-direct:disabled::after {
  background: #ECEEEF !important;
}


.btn-primary {
  background-color: #e32013;
  border-color: #e32013;
}
.btn-primary.focus, .btn-primary:focus {
  box-shadow: 0px 0px 0px 2px rgba(227, 141, 135, 0.5);
}
.btn-primary:hover {
  background-color: #e38d87;
  border-color: #e32013;
}
.btn-primary:active {
  background-color: #e32013;
  color: #FFFFFF;
  border-color: #e32013;
}

.btn-other {
  background-color: #ECEEEF;
  border-color: #ECEEEF;
}
.btn-other.focus, .btn-other:focus {
  box-shadow: 0px 0px 0px 2px rgba(227, 141, 135, 0.5);
}
.btn-other:hover {
  background-color: #e38d87;
  border-color: #e32013;
  color: #FFFFFF;
}
.btn-other:active {
  background-color: #e32013;
  border-color: #e32013;
  color: #FFFFFF;
}

.btn-secondary {
  background-color: #FFFFFF;
  border-color: #e32013;
  color: #e32013;
}
.btn-secondary.focus, .btn-secondary:focus {
  box-shadow: 0px 0px 0px 2px rgba(227, 141, 135, 0.5);
}
.btn-secondary:hover {
  background-color: #e32013;
  border-color: #e32013;
  cursor: pointer;
  color: white;
}
.btn-secondary:active {
  background-color: transparent;
  color: #e32013;
  border-color: #e32013;
}
.btn-secondary.active, .btn-secondary:active, .show > .btn-secondary.dropdown-toggle {
  background-color: #e38d87;
  border-color: #e32013;
}

.btn.disabled, .btn:disabled {
  background-color: white;
  color: #ECEEEF;
  border-color: #ECEEEF;
  cursor: not-allowed;
}

.nav-pills .nav-item.show .nav-link, .nav-pills .nav-link.active {
  background-color: #ECEEEF;
  color: black;
}

.navbar {
  padding: 0.25rem 1rem;
}

:not(.btn) > .fa:not(.fa-spin) {
  width: 20px;
  text-align: center;
}


.badge-primary {
 background-color: #e32013;
}

input[type=submit].form-control {
  width: auto !important;
}

input[type="checkbox"] {
}

button.navbar-toggler {
  z-index: 1;
  top: 0px;
}

.modal.show .modal-dialog {
  box-shadow: 0px 0px 10px #575756;
}

.modal-header {
  background-color: #e38d87;
}
.modal-footer {
  background-color: #ECEEEF;
}
.form-control:focus {
  background-color: #ffffff;
  border-color: #e38d87;
}

.col-form-label {
  font-weight: bold;
  height: 100%;
}

.checkbox label:after {
  content: '';
  display: table;
  clear: both;
}
.checkbox .cr {
  position: relative;
  display: inline-block;
  border: 1px solid #D9D9D9;
  color: #464A4C;
  border-radius: .25em;
  width: 2.1em;
  height: 2.1em;
  float: left;
  margin-right: .5em;
}
.checkbox .cr .cr-icon {
  position: absolute;
  font-size: 1.5em;
  line-height: 0;
  top: 50%;
  left: 20%;
}
.checkbox label input[type="checkbox"] {
  display: none;
}
.checkbox label input[type="checkbox"] + .cr .cr-icon {
  opacity: 0;
}
.checkbox label input[type="checkbox"]:checked + .cr .cr-icon {
  opacity: 1;
}
.checkbox label input[type="checkbox"]:disabled + .cr {
  opacity: .5;
}
.checkbox label span:hover {
  cursor: pointer;
}

.input-group .btn {
  min-width: 2.5rem;
}

.product-rows .form-group {
  margin-bottom: 0;
}