/* ---------------------------------------------------- Overriden Default Component Classname Styles ---------------------------------------------------- */

body {
  scrollbar-width: none;
}

button:focus {
  outline: none !important;
}

.email-outbox-expanded-row-unnecessary-sub-row {
  display: none !important;
}

.dashboard-order-tracking-highlighted-col {
  background: var(--main-background-color-primary-low-transparency) !important;
  font-weight: bold !important;
}

html {
  --antd-wave-shadow-color: var(--main-background-color-primary) !important;
}

.antd-table-column-header {
  cursor: pointer !important;
}

.ant-menu-inline .ant-menu-item::after {
  border-right: 3px solid var(--main-background-color-secondary) !important;
}

.ant-popover-inner {
  margin-left: 20px !important;
}

.home-analytics-date-range-picker-popover .ant-popover-inner-content {
  padding: 0 !important;
}

.rdrDefinedRangesWrapper {
  width: 0 !important;
}

.rdrDayHovered,
.rdrDayStartPreview,
.rdrDayEndPreview {
  border-color: var(
    --main-background-color-primary-low-transparency
  ) !important;
  color: var(--main-background-color-primary-low-transparency) !important;
}

.ant-btn:not(
    .ant-btn-primary,
    .ant-btn-danger,
    .ant-btn-link,
    .login-form-button,
    .header-menu-user-icon
  ):hover,
.ant-btn:not(
    .ant-btn-primary,
    .ant-btn-danger,
    .ant-btn-link,
    .login-form-button,
    .header-menu-user-icon
  ):focus,
.page-header-primary-button:hover {
  border-color: var(--main-background-color-primary) !important;
  color: var(--main-background-color-primary) !important;
}

.page-header-primary-button:hover {
  background: unset !important;
}

.header-menu-user-icon:hover,
.header-menu-user-icon:focus {
  color: white !important;
  border-color: white !important;
}

.ant-checkbox:hover .ant-checkbox-inner:hover,
.ant-checkbox-wrapper > .ant-checkbox:hover {
  border-color: var(--main-background-color-primary) !important;
}

.ant-checkbox-checked .ant-checkbox-inner {
  background-color: var(--main-background-color-primary) !important;
  border-color: var(--main-background-color-primary) !important;
}

.ant-checkbox-checked .ant-checkbox-inner {
  background-color: var(--main-background-color-primary) !important;
  border-color: var(--main-background-color-primary) !important;
}

.ant-menu-item {
  margin: 0 !important;
}

.ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected,
.ant-menu-submenu:active .ant-menu-submenu-title, .ant-menu-submenu-active,
.report-type-sub-menu > .ant-menu-submenu-title:hover,
.ant-menu-submenu:hover > .ant-menu-submenu-title > .ant-menu-submenu-arrow,
/*.ant-menu-submenu-active,*/
.ant-menu-item:not(.main-submenu-item, .ant-menu-submenu):hover {
  color: var(--main-background-color-primary) !important;
}

.report-type-sub-menu.ant-menu-submenu-selected > .ant-menu-submenu-title:hover,
.report-type-sub-menu.ant-menu-submenu-selected
  > .ant-menu-submenu-title
  > .ant-menu-submenu-arrow,
.ant-menu-item:active .ant-menu-title-content {
  color: white !important;
}

.ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected,
.ant-menu-submenu:active .ant-menu-submenu-title,
.ant-menu-submenu-selected,
.ant-menu-item:active {
  color: white !important;
  background: var(--main-background-color-primary) !important;
  background-color: var(--main-background-color-primary) !important;
}

.ant-input:not(.patient-group-tag-update-name-input):hover {
  border-color: var(--main-background-color-primary) !important;
}

.ant-input:not(.patient-group-tag-update-name-input):focus {
  box-shadow: 0 0 0 2px var(--main-background-color-primary-low-transparency) !important;
  border-color: var(--main-background-color-primary) !important;
}

.ant-input:focus {
  box-shadow: 0 0 0 0 !important;
}

.ant-menu-submenu-title {
  margin-top: 0px !important;
}

.ant-layout-header {
  padding: 0 20px !important;
}

.ant-menu {
  /* background:--main-background-color-primary !important; */
  /* background: rgb(25, 25, 25) !important; */
}

.ant-menu-inline {
  border-right: 0 !important;
}

.ant-menu-submenu-title {
  margin-bottom: 0 !important;
}

.ant-menu-inline .ant-menu-item {
  width: 100% !important;
}

.ant-select-arrow {
  visibility: hidden !important;
}

.ant-input {
  border-radius: 5px !important;
}

.ant-input-affix-wrapper {
  border-radius: 5px !important;
}

.ant-input-affix-wrapper > input.ant-input {
  border-radius: 0px !important;
}

.ant-select-selector {
  border-radius: 5px !important;
}

.ant-picker {
  border-radius: 5px !important;
}

.ant-tabs-tab {
  border-radius: 5px 5px 0 0 !important;
}

.ant-btn {
  border-radius: 5px;
}

.ant-btn-primary:not(.ant-btn-primary[disabled]) {
  background: var(--main-background-color-primary) !important;
  border-color: var(--main-background-color-primary) !important;
}

.ant-layout-sider {
  width: unset !important;
  min-width: unset !important;
  max-width: unset !important;
  margin: 0 !important;
}

.ant-layout-sider-children {
  background: var(--main-background-color-primary) !important;
}

.site-layout-background {
  background: rgb(255, 255, 255);
}

.ant-modal-header {
  border-radius: 5px 5px 0 0;
}

.ant-modal-content {
  border-radius: 5px;
}

.ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected {
  background-color: #e6f7ff;
}

.ant-tooltip-inner {
  padding: 5px !important;
}

.patient-documents-report-preview-iframe {
  width: 100% !important;
  height: 40vh !important;
}

.ReactModal__Content,
.ReactModal__Content--after-open {
  height: 85% !important;
}

.message-attachment-container {
  position: relative;
}

.message-attachment-image {
  opacity: 1;
  display: block;
  transition: 0.5s ease;
  backface-visibility: hidden;
}

.message-attachment-download {
  transition: 0.5s ease;
  opacity: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
}

.message-attachment-container:hover .message-attachment-image {
  opacity: 0.3;
}

.message-attachment-container:hover .message-attachment-download {
  opacity: 1;
}

/* ---------------------------------------------------- Custom Component Classnames Styles ---------------------------------------------------- */

/* ---------------------------------------------------- On Each Page ---------------------------------------------------- */

.individual-page-container {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
  scrollbar-width: none;
  overflow-y: hidden;
}

.individual-page {
  height: 100%;
  margin: 0 !important;
  padding: 0 !important;
  overflow: auto;
  background: #dddddd !important;
  scrollbar-width: none;
}

.individual-page-header {
  background: rgb(255, 255, 255) !important;
  color: black !important;
  width: 100%;
  padding: 5px 24px !important;
  margin: 0 !important;
}

.individual-page-header-title {
  color: black !important;
}

.individual-page-card {
  margin: 10px !important;
  border-radius: 5px;
}

.individual-page-row {
  border: 1px solid #eeeeee;
  background: #ffffff !important;
  cursor: pointer;
  margin: 5px 15px;
  max-width: 100%;
}

.individual-page-row:hover {
  background: #f9f9f9 !important;
}

.individual-page-footer {
  background: var(--main-background-color-primary) !important;
  color: white !important;
  text-align: center;
}

.secondary-button-primary:not(
    .ant-btn[disabled],
    .ant-popover,
    .ant-popover-disabled-compatible-wrapper
  ):hover,
.secondary-button-primary:not(
    .ant-btn[disabled],
    .ant-popover,
    .ant-popover-disabled-compatible-wrapper
  ):focus {
  color: var(--main-background-color-primary) !important;
  border: 1px solid var(--main-background-color-primary) !important;
}

.secondary-button-secondary:not(
    .ant-btn[disabled],
    .ant-popover,
    .ant-popover-disabled-compatible-wrapper
  ):hover,
.secondary-button-secondary:not(
    .ant-btn[disabled],
    .ant-popover,
    .ant-popover-disabled-compatible-wrapper
  ):focus {
  color: var(--main-background-color-secondary) !important;
  border: 1px solid var(--main-background-color-secondary) !important;
}

.patient-group-color-picker-card > .ant-card-head {
  background: var(--color-picker-selected-color) !important;
  color: var(--color-picker-contrasting-text-color) !important;
}

.patient-group-tag-action-button {
  border: 1px solid white !important;
  border-radius: 5px !important;
  padding: 4px !important;
  background: rgba(255, 255, 255, 0.1) !important;
  transition: all 0.2s ease-in-out !important;
}

.patient-group-tag-action-button:hover,
.patient-group-tag-action-button:focus {
  background: rgba(255, 255, 255, 0.3) !important;
  transition: all 0.2s ease-in-out !important;
}

/* ---------------------------------------------------- Generic Components ---------------------------------------------------- */

.main-submenu-item {
  background: var(--main-background-color-primary) !important;
}

.page-header-primary-button {
  background: white;
  border: 1px solid white;
  color: #40a9ff;
}

.page-header-primary-button:hover {
  background: #40a9ff;
  border: 1px solid white;
  color: white;
}

.required-input-highlighted {
  border: 1px solid rgba(206, 100, 100, 0.8);
}

.required-input:hover,
.required-input-highlighted:hover {
  border-color: rgba(200, 10, 10, 0.8) !important;
  border-right-width: 1px !important;
}

.required-input:focus,
.required-input-highlighted:focus {
  border-color: rgba(200, 10, 10, 0.8) !important;
  border-right-width: 1px !important;
  outline: 0 !important;
  box-shadow: 0 0 0 2px rgba(200, 10, 10, 0.2) !important;
}

.columns-displayed > .ant-checkbox-group-item {
  display: flex;
}

tr.row-color-one {
  background-color: #ffffff;
}

tr.row-color-two {
  background-color: #ebf2fa;
}

.table-header > button {
  padding: 1px 5px;
}

.blue-title {
  color: rgb(25, 118, 210);
  font-size: 16px;
  font-weight: 400;
  padding: 20px 0 5px 0;
}

/* ---------------------------------------------------- Login ---------------------------------------------------- */

.login-form-container {
  background: white;
  padding: 25px;
  max-width: 375px;
  margin: auto;
  border: 1px solid #ebedf0;
  width: 100%;
}

.login-form-button {
  background: rgb(58, 86, 143) !important;
  border-color: rgb(58, 86, 143) !important;
}

.login-form-button:hover {
  background: #5c7cbc !important;
  border-color: #5c7cbc !important;
}

/* ---------------------------------------------------- User Management ---------------------------------------------------- */

.user-edit-button {
  font-size: 18px !important;
}

.user-edit-button:hover {
  color: rgb(128, 128, 128) !important;
  transition: color 0.2s ease-in;
}

.user-delete-button {
  font-size: 18px !important;
}

.user-delete-button:hover {
  color: rgb(133, 12, 12) !important;
  transition: color 0.2s ease-in;
}

.user-group-action-buttons-container * {
  font-size: 14px !important;
}

.user-group-modal {
  width: 50vw !important;
}

/* ---------------------------------------------------- Header ---------------------------------------------------- */

.header-right {
  float: right;
  width: fit-content;
  height: 100%;
}

.ant-menu.ant-menu-dark {
  background: var(--main-background-color-primary) !important;
}

.main-header {
  background: var(--main-background-color-primary) !important;
  justify-content: center !important;
}

.main-menu {
  margin-left: 20vw !important;
}

.main-menu-item {
  color: white !important;
}

.main-submenu {
  background: var(--main-background-color-primary) !important;
  margin-bottom: 0 !important;
}

.main-submenu-selected {
  color: white !important;
}

.header-logout-button {
  background: white;
  color: #ff8282 !important;
  margin-right: 5px;
}

.header-logout-button:hover {
  border-color: #ff8282 !important;
}

/* ---------------------------------------------------- Administrator Tools / Settings ---------------------------------------------------- */

.settings-menu {
  width: 100% !important;
}

.settings-submenu {
  border: 1px solid rgba(0, 0, 0, 0.6) !important;
  background: rgb(0, 0, 0) !important;
  border-top: 0 !important;
  margin-top: 0 !important;
}

.settings-submenu-item {
  border: 0 !important;
  border-top: 1px solid rgba(0, 0, 0, 0.6) !important;
  margin: 0 !important;
}

.settings-menu-item {
  margin: 0 !important;
  /* border: 1px solid rgba(0, 0, 0, 0.6) !important; */
  /*  background: white !important; */
  border-top: 0 !important;
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
}

.settings-menu-item:nth-child(1) {
  /* border-top: 1px solid rgba(0, 0, 0, 0.6) !important; */
}

.add-edit-button {
  margin: 0 3px 0 3px !important;
}

.sub-page-card {
  /*margin: 0px 10px !important;*/
  border: 0px !important;
}

.sketch-picker {
  box-shadow: none !important;
  border: 1px solid #dfdfdf !important;
}
/* ----------------------------------------------------- Macros --------------------------------------------------------*/

.ant-menu.macros-menu {
  background: unset !important;
  overflow-x: hidden !important;
}

.macros-menu {
  width: 100% !important;
  background: white !important;
}

.macros-submenu {
  background: rgb(0, 0, 0) !important;
  border-top: 0 !important;
  margin-top: 0 !important;
}

.macros-submenu-item {
  border: 0 !important;
  /*border-top: 1px solid rgba(0, 0, 0, 0.6) !important;*/
  margin: 0 !important;
}

.macros-menu-item,
.macros-menu-can-delete-item {
  margin: 0 !important;
  background: white !important;
  border-top: 0 !important;
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
}

.macros-menu-item-empty,
.macros-menu-can-delete-item-empty {
  color: #a30000 !important;
  margin: 0 !important;
  background: white !important;
  border-top: 0 !important;
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
}

.macros-menu-can-delete-item:hover,
.macros-menu-can-delete-item-empty:hover {
  background-color: #a300005d !important;
  color: white !important;
}

.macros-menu-can-delete-item:hover .anticon,
.macros-menu-can-delete-item-empty:hover .anticon {
  color: white !important;
  transition: all 0s !important;
}

.macro-input-container-card {
  margin: 25px 25% !important;
}

.macros-menu-item:nth-child(1) {
  /*border-top: 1px solid rgba(0, 0, 0, 0.6) !important;*/
}

.reference-gene-explanations-collapse > .ant-collapse-content {
  border-top: 1px solid #f0f0f0 !important;
}

::-webkit-scrollbar {
  width: 0 !important;
}

::-webkit-scrollbar-track {
  background: white !important;
}

::-webkit-scrollbar-thumb {
  background-color: rgb(0, 0, 0, 0.2) !important;
  border-radius: 10px !important;
}

::-webkit-scrollbar-thumb:hover {
  background-color: rgba(0, 0, 0, 0.18) !important;
}

.ant-menu-vertical.macros-menu {
  border-right: 0 !important;
}

.macro-row-item-name-link {
  color: #007bff !important;
  transition: color 0.5s !important;
}

.macro-row-item-name-link:hover {
  color: #0056b3 !important;
  cursor: pointer !important;
}

.search-input {
  margin-bottom: 15px !important;
}

/* ---------------------------------------------------- Report Sections ---------------------------------------------------- */
.row-dragging {
  background: #fafafa;
  border: 1px solid #ccc;
}

.row-dragging td {
  padding: 16px;
}

.row-dragging .drag-visible {
  visibility: visible;
}

.edit {
  width: 100;
  text-align: "center";
}

/* ---------------------------------------------------- Report Sections ---------------------------------------------------- */
.assigned-template-table {
  margin-bottom: 30px !important;
}

.register-kit-card {
  width: 100% !important;
  max-width: 700px !important;
  padding: 0 20px !important;
}

/* ---------------------------------------------------- Font Family ---------------------------------------------------- */

/* cyrillic-ext */
@font-face {
  font-family: "Source Sans Pro";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local("Source Sans Pro Regular"), local("SourceSansPro-Regular"),
    url(https://fonts.gstatic.com/s/sourcesanspro/v13/6xK3dSBYKcSV-LCoeQqfX1RYOo3qNa7lqDY.woff2)
      format("woff2");
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F,
    U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: "Source Sans Pro";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local("Source Sans Pro Regular"), local("SourceSansPro-Regular"),
    url(https://fonts.gstatic.com/s/sourcesanspro/v13/6xK3dSBYKcSV-LCoeQqfX1RYOo3qPK7lqDY.woff2)
      format("woff2");
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: "Source Sans Pro";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local("Source Sans Pro Regular"), local("SourceSansPro-Regular"),
    url(https://fonts.gstatic.com/s/sourcesanspro/v13/6xK3dSBYKcSV-LCoeQqfX1RYOo3qNK7lqDY.woff2)
      format("woff2");
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: "Source Sans Pro";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local("Source Sans Pro Regular"), local("SourceSansPro-Regular"),
    url(https://fonts.gstatic.com/s/sourcesanspro/v13/6xK3dSBYKcSV-LCoeQqfX1RYOo3qO67lqDY.woff2)
      format("woff2");
  unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
  font-family: "Source Sans Pro";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local("Source Sans Pro Regular"), local("SourceSansPro-Regular"),
    url(https://fonts.gstatic.com/s/sourcesanspro/v13/6xK3dSBYKcSV-LCoeQqfX1RYOo3qN67lqDY.woff2)
      format("woff2");
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1,
    U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: "Source Sans Pro";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local("Source Sans Pro Regular"), local("SourceSansPro-Regular"),
    url(https://fonts.gstatic.com/s/sourcesanspro/v13/6xK3dSBYKcSV-LCoeQqfX1RYOo3qNq7lqDY.woff2)
      format("woff2");
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB,
    U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Source Sans Pro";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local("Source Sans Pro Regular"), local("SourceSansPro-Regular"),
    url(https://fonts.gstatic.com/s/sourcesanspro/v13/6xK3dSBYKcSV-LCoeQqfX1RYOo3qOK7l.woff2)
      format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
    U+FEFF, U+FFFD;
}

.assetPreview {
  width: 100px;
  text-align: center;
  /* border: dashed blue 1px; */
}

.assetPreview img {
  max-height: 100%;
  max-width: 100%;
}