:root {
  --primary-color: #e30613;
  --primary-color-rgb: 227, 6, 19;
  --secondary-color: #05057a;
  --secondary-color-rgb: 5, 5, 122;
  --tertiary-color: #ffffff;
  --tertiary-color-rgb: 255, 255, 255;
  --quaternary-color: #fff04a;
  --quaternary-color-rgb: 255, 240, 74;
  --hestia-ink: #17172f;
  --hestia-muted: #5a5d72;
  --hestia-soft: #f7f8ff;
  --hestia-paper: #ffffff;
  --hestia-line: #d9dceb;
  --hestia-accent: #e30613;
  --hestia-accent-dark: #a4000c;
  --hestia-warm: #fff04a;
  --hestia-danger: #b0000d;
  --hestia-focus: #fff04a;
  --hestia-shadow: 0 18px 44px rgba(5, 5, 122, .16);
  --hestia-topbar-bg: #f4f6ff;
  --hestia-header-bg: #05057a;
  --hestia-mobile-menu-bg: rgba(5, 5, 85, .97);
  --hestia-chrome-text: #fff;
  --hestia-chrome-muted: rgba(255, 255, 255, .86);
  --hestia-chrome-accent: #fff04a;
  --hestia-chrome-button-bg: #e30613;
  --hestia-chrome-button-hover: #a4000c;
  --hestia-chrome-icon-bg: rgba(255, 255, 255, .14);
  --hestia-chrome-icon-hover-bg: #fff04a;
  --hestia-chrome-icon-hover-text: #05057a;
  --hestia-topbar-text: #17172f;
  --hestia-topbar-icon: #e30613;
  --hestia-topbar-border: rgba(5, 5, 122, .18);
  --hestia-submenu-bg: #fff;
  --hestia-submenu-hover-bg: #f4f6ff;
  --hestia-submenu-shadow: 0 18px 42px rgba(5, 5, 122, .2);
  --hestia-submenu-text: #17172f;
  --hestia-submenu-active-bg: #05057a;
  --hestia-submenu-active-text: #ffffff;
  --hestia-submenu-accent: #fff04a;
}

header.header-light #mainmenu > li > a {
  color: var(--hestia-ink);
}

#mainmenu > li > a:hover,
#mainmenu > li:hover > a,
#mainmenu > li > a.active {
  color: var(--primary-color) !important;
}

#mainmenu li ul {
  background: var(--hestia-submenu-bg);
  border: 1px solid var(--hestia-topbar-border);
  box-shadow: var(--hestia-submenu-shadow);
}

#mainmenu li ul li a,
header.header-light #mainmenu li ul li a.menu-item {
  color: var(--hestia-submenu-text);
}

#mainmenu li ul li a:hover,
#mainmenu ul li:hover > a,
header.header-light #mainmenu li ul li a.menu-item:hover {
  background: var(--hestia-submenu-active-bg);
  color: var(--hestia-submenu-active-text) !important;
}

#mainmenu li ul li a.active {
  background: var(--hestia-submenu-active-bg);
  color: var(--hestia-submenu-active-text) !important;
}

#mainmenu li ul li a.active::before,
#mainmenu li ul li a:hover::before {
  background: var(--hestia-submenu-accent);
}
