/*!
 * Copyright (c) 2015 - 2019 Molkobain.
 *
 * This file is part of licensed extension.
 *
 * Use of this extension is bound by the license you purchased. A license grants you a non-exclusive and non-transferable right to use and incorporate the item in your personal or commercial projects. There are several licenses available (see https://www.molkobain.com/usage-licenses/ for more informations)
 */
/*!
 * Copyright (c) 2015 - 2019 Molkobain.
 *
 * This file is part of licensed extension.
 *
 * Use of this extension is bound by the license you purchased. A license grants you a non-exclusive and non-transferable right to use and incorporate the item in your personal or commercial projects. There are several licenses available (see https://www.molkobain.com/usage-licenses/ for more informations)
 */
/* Variables */
/* |- Helpers */
/* |-- Box shadows */
/* Panel */
/* Toggle buttons */
/* Buttons */
/* Can't put a global CSS class to reset stuff as classes will be used here and there by extensions, so we use this injection */
.mhf-templates, .mhf-panel, .mhf-tooltip, .mhf-toggle-button {
  /* Reset for admin console mostly */
  box-sizing: border-box;
}
.mhf-templates *, .mhf-panel *, .mhf-tooltip *, .mhf-toggle-button * {
  box-sizing: border-box;
}
.mhf-templates *::before, .mhf-panel *::before, .mhf-tooltip *::before, .mhf-toggle-button *::before, .mhf-templates *::after, .mhf-panel *::after, .mhf-tooltip *::after, .mhf-toggle-button *::after {
  box-sizing: border-box;
}
/* Helpers */
.mhf-pull-left {
  float: left;
}
.mhf-pull-left::after {
  clear: both;
}
.mhf-pull-right {
  float: right;
}
.mhf-pull-right::after {
  clear: both;
}
.mhf-hide {
  display: none !important;
}
/* Templates: HTML markup to be cloned for creating elements, always hidden */
.mhf-templates {
  display: none;
}
/* Loader */
.mhf-loader {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  z-index: 5;
  background-color: rgba(0, 0, 0, 0.20);
  /* Alpha channel instead of opacity property, otherwise, content will be transparent too */
  backdrop-filter: blur(2px);
}
.mhf-loader .mhf-loader-text {
  text-align: center;
  font-size: 3em;
  color: #000;
}
.mhf-loader .fa-spin {
  animation-duration: 1s;
}
/* Panels: Simple panel with an header and a body to display content nicely */
.mhf-panel {
  position: relative;
  margin-bottom: 3rem;
}
.mhf-panel .mhf-p-header {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  margin-bottom: 0.5rem;
  padding: 0 0.2rem;
  font-size: 0.9rem;
}
.mhf-panel .mhf-p-header .mhf-ph-icon {
  margin-right: 0.5rem;
}
.mhf-panel .mhf-p-header .mhf-ph-icon img {
  max-width: 38px;
}
.mhf-panel .mhf-p-header .mhf-ph-actions {
  position: absolute;
  right: 0;
}
.mhf-panel .mhf-p-header .mhf-ph-actions .mhf-ph-toggler {
  color: #ea7d1e;
  cursor: pointer;
  transition-property: transform;
  transition-duration: 0.2s;
  transition-timing-function: linear;
}
.mhf-panel .mhf-p-body {
  position: relative;
  /*z-index: 0;*/
  /* Must be below header */
  margin-top: 0;
  padding: 0.3rem;
  background-color: #fff;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
  transition: all 0.2s ease-in-out;
}
.mhf-panel .mhf-p-body:empty {
  display: flex;
  justify-content: center;
  align-items: center;
}
.mhf-panel .mhf-p-body:empty::after {
  content: attr(data-empty-text);
  color: #777;
  font-style: italic;
}
.mhf-panel:last-child {
  margin-bottom: 0;
}
.mhf-panel.mhf-collapsed .mhf-ph-toggler {
  transform: rotateZ(90deg);
}
.mhf-panel.mhf-collapsed .mhf-p-body {
  margin-top: -50px;
  min-height: 50px !important;
  max-height: 50px !important;
}
.mhf-panel.mhf-collapsed .mhf-p-body > * {
  display: none;
}
.mhf-panel.mhf-collapsed .mhf-p-body:empty::after {
  content: "";
}
/* Tooltips */
.mhf-tooltip {
  /* qTip tooltips */
}
.mhf-tooltip.qtip .qtip-tip {
  z-index: 1;
  /* To put tip above wrapper box-shadow */
}
.mhf-tooltip.qtip .qtip-wrapper {
  box-shadow: 0 2px 15px 2px rgba(0, 0, 0, 0.15);
}
.mhf-tooltip.qtip .qtip-wrapper .qtip-contentWrapper {
  border: none !important;
}
.mhf-tooltip.qtip .qtip-wrapper .qtip-contentWrapper .qtip-content {
  padding: 9px 9px !important;
}
.mhf-tooltip.qtip .qtip-wrapper .qtip-contentWrapper .qtip-content img {
  max-width: 100%;
  height: initial !important;
  /* !important to overload the height in the style attribute of the image, otherwise image ratio is wicked */
}
/* Toggle buttons: Inspired by Mauricio Allende @ https://codepen.io/mallendeo/pen/eLIiG */
.mhf-toggle-button {
  font-size: 12pt;
  /* Themes */
  /* - Flat */
}
.mhf-toggle-button .mhf-tb-input {
  display: none;
}
.mhf-toggle-button .mhf-tb-input + .mhf-tb-button {
  outline: 0;
  display: inline-block;
  vertical-align: middle;
  width: 1.8em;
  height: 1em;
  position: relative;
  cursor: pointer;
  user-select: none;
}
.mhf-toggle-button .mhf-tb-input + .mhf-tb-button::after, .mhf-toggle-button .mhf-tb-input + .mhf-tb-button::before {
  position: relative;
  display: block;
  content: "";
  width: 50%;
  height: 100%;
}
.mhf-toggle-button .mhf-tb-input + .mhf-tb-button::after {
  left: 0;
}
.mhf-toggle-button .mhf-tb-input + .mhf-tb-button::before {
  display: none;
}
.mhf-toggle-button .mhf-tb-input:checked + .mhf-tb-button::after {
  left: 50%;
}
.mhf-toggle-button.mhf-tb-flat .mhf-tb-input + .mhf-tb-button {
  padding: 2px;
  border-radius: 2em;
  background-color: #eaeaea;
  box-shadow: inset 0 1px 1px 0px rgba(0, 0, 0, 0.15);
  transition: all 0.4s ease;
}
.mhf-toggle-button.mhf-tb-flat .mhf-tb-input + .mhf-tb-button::after {
  border-radius: 50%;
  background-color: #fff;
  box-shadow: 0 1px 1px 1px rgba(0, 0, 0, 0.12);
  transition: all 0.2s ease;
}
.mhf-toggle-button.mhf-tb-flat .mhf-tb-input:checked + .mhf-tb-button {
  background-color: #ea7d1e;
}
.mhf-toggle-button.mhf-tb-flat .mhf-tb-input:disabled + .mhf-tb-button {
  background-color: #d1d1d1;
}
.mhf-toggle-button.mhf-tb-flat .mhf-tb-input:disabled + .mhf-tb-button::after {
  background-color: #e6e6e6;
}
.mhf-toggle-button.mhf-tb-flat:hover .mhf-tb-input + .mhf-tb-button, .mhf-toggle-button.mhf-tb-flat:focus .mhf-tb-input + .mhf-tb-button {
  background-color: #d6d6d6;
}
.mhf-toggle-button.mhf-tb-flat:hover .mhf-tb-input:checked + .mhf-tb-button, .mhf-toggle-button.mhf-tb-flat:focus .mhf-tb-input:checked + .mhf-tb-button {
  background-color: #cc6913;
}
.mhf-toggle-button.mhf-tb-flat:active .mhf-tb-input + .mhf-tb-button {
  background-color: #c4c4c4;
}
.mhf-toggle-button.mhf-tb-flat:active .mhf-tb-input:checked + .mhf-tb-button {
  background-color: #ab5810;
}
.mhf-toggle-button.mhf-pull-left .mhf-tb-button, .mhf-toggle-button.mhf-pull-right .mhf-tb-button, .mhf-pull-left .mhf-toggle-button .mhf-tb-button, .mhf-pull-right .mhf-toggle-button .mhf-tb-button {
  vertical-align: initial;
  /* Reset vertical alignment if floated */
}
/* Buttons */
.mhf-button {
  padding: 0.35rem 0.5rem;
  border: 1px solid transparent;
  border-radius: 2px;
  cursor: pointer;
  transition-property: background-color;
  transition-duration: 0.1s;
  transition-timing-function: linear;
}
.mhf-button.mhf-button-simple {
  min-width: 2.5rem;
  font-weight: bold;
  background-color: #2d3748;
  color: white;
  border-color: #2d3748;
}
.mhf-button.mhf-button-simple.mhf-button-primary {
  background-color: #ea7d1e;
  color: white;
  border-color: #ea7d1e;
}
.mhf-button.mhf-button-simple.mhf-button-primary:hover {
  background-color: #da7014;
}
.mhf-button.mhf-button-simple.mhf-button-primary:active {
  background-color: #c36412;
}
.mhf-button.mhf-button-simple:hover {
  background-color: #232b38;
}
.mhf-button.mhf-button-simple:active {
  background-color: #191f29;
}
.mhf-button.mhf-button-outline {
  font-weight: bold;
  background-color: white;
  color: #2d3748;
  border-color: #2d3748;
}
.mhf-button.mhf-button-outline.mhf-button-primary {
  background-color: white;
  color: #ea7d1e;
  border-color: #ea7d1e;
}
.mhf-button.mhf-button-outline.mhf-button-primary:hover {
  background-color: #f2f2f2;
}
.mhf-button.mhf-button-outline.mhf-button-primary:active {
  background-color: #e6e6e6;
}
.mhf-button.mhf-button-outline.mhf-button-hyperlink {
  background-color: white;
  color: #1c94c4;
  border-color: #1c94c4;
}
.mhf-button.mhf-button-outline.mhf-button-hyperlink:hover {
  background-color: #f2f2f2;
}
.mhf-button.mhf-button-outline.mhf-button-hyperlink:active {
  background-color: #e6e6e6;
}
.mhf-button.mhf-button-outline:hover {
  background-color: #f2f2f2;
}
.mhf-button.mhf-button-outline:active {
  background-color: #e6e6e6;
}
.mhf-button.mhf-button-text {
  font-weight: bold;
  background-color: transparent;
  color: #2d3748;
  border-color: transparent;
}
.mhf-button.mhf-button-text.mhf-button-primary {
  color: #ea7d1e;
}
.mhf-button.mhf-button-text.mhf-button-primary:hover {
  color: #da7014;
}
.mhf-button.mhf-button-text.mhf-button-primary:active {
  color: #c36412;
}
.mhf-button.mhf-button-text.mhf-button-hyperlink {
  color: #1c94c4;
}
.mhf-button.mhf-button-text.mhf-button-hyperlink:hover {
  color: #1983ae;
}
.mhf-button.mhf-button-text.mhf-button-hyperlink:active {
  color: #167297;
}
.mhf-button.mhf-button-text:hover {
  color: #232b38;
}
.mhf-button.mhf-button-text:active {
  color: #191f29;
}
