/* *******************************************************************
  ==== SUMMARY ====
  - BASE
  - LOGO
  - ICONS
  - DISPLAY COUNT FOR ICONS
  - MINI MENU
  - CATEGORY MENU
  - MINI PANEL
  - SCROLLBAR (REWORK TODO?)
  - SLOGAN
  - SOCIAL NETWORK
******************************************************************* */

/* ===================================================================
  BASE
=================================================================== */

.electron-header {
  background-color: #f2f2f2 !important;
}

.electron-header .electron-header-top {
  background-color: #ff5722 !important;
}

.electron-header .electron-header-bottom {
  background-color: #007bff !important;
  border-color: #fff !important;
  border-width: 2px !important;
}

.electron-header .electron-header-sticky {
  background-color: #007bff !important;
}

/* ===================================================================
  LOGO
=================================================================== */

.electron-header .header-text-logo {
  color: #ff8c42 !important;
  font-size: 2rem;
}

.electron-header .header-text-logo:hover {
  color: #007bff !important;
}

.electron-header .electron-header-sticky .header-text-logo:hover {
  color: #fff !important;
}

/* ===================================================================
  ICONS
=================================================================== */

.electron-header .top-action-btn .electron-svg-icon {
  fill: #4f7cac !important;
  z-index: 1;
}

.electron-header .top-action-btn .electron-svg-icon:hover {
  fill: #ff5722 !important;
}

.electron-header .electron-header-sticky .top-action-btn .electron-svg-icon {
  fill: #fff !important;
}

.electron-header
  .electron-header-sticky
  .top-action-btn
  .electron-svg-icon:hover {
  fill: #ff5722 !important;
}

/* ===================================================================
  DISPLAY COUNT FOR ICONS
=================================================================== */

.electron-header .top-action-btn .electron-wc-count {
  background-color: #003366 !important;
  color: #fff !important;
  z-index: 2 !important;
}

/* ===================================================================
  MINI MENU
=================================================================== */

.electron-header .electron-header-top .header-minimenu .nav a,
.electron-header .electron-header-bottom .header-minimenu .nav a,
.electron-header .electron-header-bottom .header-mainmenu .nav a,
.electron-header .electron-header-sticky .header-mainmenu .nav a {
  color: #fff !important;
}

/* ===================================================================
  CATEGORY MENU
=================================================================== */

.electron-header .electron-category-menu .menu-title {
  background-color: #ff5722 !important;
  color: #fff !important;
}

.electron-header .electron-category-menu .submenu {
  background-color: #ff6f00 !important;
}

.electron-header .electron-category-menu .submenu li:hover {
  background-color: inherit !important;
  background-color: rgba(255, 255, 255, 0.25) !important;
}

.electron-header .electron-category-menu .submenu li a {
  color: #fff !important;
}

/* ===================================================================
  MINI PANEL
=================================================================== */

.electron-header .top-action-btn .mini-panel {
  background-color: #f2f2f2 !important;
  border: 3px solid #ff8c42 !important;
}

.electron-header .top-action-btn .mini-panel::before {
  border-color: transparent transparent #ff8c42 transparent !important;
}

.electron-header .top-action-btn .mini-panel svg {
  fill: rgba(0, 0, 0, 0.25) !important;
}

.electron-header .top-action-btn .mini-panel .electron-small-title,
.electron-header .top-action-btn .mini-panel .panel-title,
.electron-header .top-action-btn .mini-panel .navigation .menu-item a {
  color: #000 !important;
}

.electron-header .top-action-btn .mini-panel .panel-title {
  border-color: #ff8c42 !important;
  border-width: 2px;
}

.electron-header
  .top-action-btn
  .mini-panel
  .electron-btn.electron-btn-primary {
  background-color: #007bff !important;
  color: #fff !important;
}

/* ===================================================================
  SCROLLBAR (REWORK TODO?)
=================================================================== */

.electron-header .electron-scrollbar::-webkit-scrollbar-thumb {
  background-color: #ff8c42 !important;
}

.electron-header .electron-scrollbar::-webkit-scrollbar-track {
  background-color: #fff !important;
}

/* ===================================================================
  SLOGAN
=================================================================== */

.electron-header .slogan {
  color: #fff !important;
  font-size: 1.15em !important;
  font-style: italic !important;
  font-weight: 700 !important;
}

/* ===================================================================
  SOCIAL NETWORK
=================================================================== */

.electron-header .electron-header-top .header-shortcode {
  height: 100% !important;
}

.electron-header .electron-header-top .social {
  align-items: center !important;
  display: flex !important;
  height: 100%;
  justify-content: center;
  padding: 0.2rem;
}

.electron-header .electron-header-top .social span {
  color: #fff !important;
}

.electron-header .electron-header-top .social:hover {
  background-color: rgba(255, 255, 255, 0.25) !important;
}

.electron-header .social .nt-icon-facebook:hover {
  color: #1877f2 !important;
}

.electron-header .social .nt-icon-instagram:hover {
  color: #e1306c !important;
}

.electron-header .social .nt-icon-pinterest:hover {
  color: #e60023 !important;
}
