﻿.nova-web-component-button {
  --web-component-button-bg-color: #162434;
  --web-component-button-color: #ffffff;
  --web-component-button-hover-bg-color: #162434;
  --web-component-button-hover-color: #ffffff;
  background-color: var(--web-component-button-bg-color);
  color: var(--web-component-button-color);
  min-height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  position: relative;
}
.nova-web-component-button.nova-is-default-button {
  background-color: #808080;
  color: #ffffff;
}
.nova-web-component-button.nova-is-default-button:hover {
  background-color: #6e6e6e;
  color: #ffffff;
}
.nova-web-component-button.nova-disabled {
  opacity: 0.25;
}
.nova-web-component-button.nova-disabled:hover {
  opacity: 0.25;
}
.nova-web-component-button:hover {
  background-color: var(--web-component-button-hover-bg-color);
  color: var(--web-component-button-hover-color);
}
.nova-web-component-button:hover > .nova-web-button-content-container .nova-web-button-text-container {
  color: var(--web-component-button-hover-color);
}
.nova-web-component-button:hover > .nova-web-button-content-container .nova-web-button-icon-container svg {
  fill: var(--web-component-button-hover-color);
}
.nova-web-component-button:hover > .nova-web-button-content-container .nova-web-button-dropdown-icon-container svg {
  fill: var(--web-component-button-hover-color);
}
.nova-web-component-button.nova-web-component-button-dropdown .nova-web-button-content-container.width-icon .nova-web-button-text-container {
  padding: 0;
}
.nova-web-component-button.nova-web-component-button-dropdown .nova-web-button-content-container .nova-web-button-text-container {
  padding: 0;
}
.nova-web-component-button .nova-web-button-content-container {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  min-height: 40px;
  width: 100%;
}
.nova-web-component-button .nova-web-button-content-container.width-icon .nova-web-button-text-container {
  padding: 0 15px 0 0;
}
.nova-web-component-button .nova-web-button-content-container .nova-web-button-text-container {
  padding: 0 15px 0 15px;
  color: var(--web-component-button-color);
  white-space: nowrap;
}
.nova-web-component-button .nova-web-button-content-container .nova-web-button-icon-container {
  width: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.nova-web-component-button .nova-web-button-content-container .nova-web-button-icon-container svg {
  fill: var(--web-component-button-color);
}
.nova-web-component-button .nova-web-button-content-container .nova-web-button-dropdown-icon-container {
  width: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.nova-web-component-button .nova-web-button-content-container .nova-web-button-dropdown-icon-container svg {
  fill: var(--web-component-button-color);
}
.nova-web-component-button-sub-buttons-container {
  position: absolute;
  top: 40px;
  left: 0;
  min-width: 100%;
  background-color: var(--web-component-button-bg-color);
  flex-direction: column;
  z-index: 10;
  display: flex;
  max-height: 70vh;
  overflow-y: auto;
}
.nova-web-component-button-sub-buttons-container.nova-web-is-out-of-screen {
  left: auto;
  right: 0;
}
.nova-web-component-button-sub-buttons-container .nova-web-component-button {
  justify-content: flex-start;
  border: none;
}
.nova-web-component-button-sub-buttons-container .nova-web-component-button .nova-web-button-content-container .nova-web-button-text-container {
  padding: 0 15px 0 0 !important;
}