@charset "UTF-8";
.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

.bold {
  font-weight: 600;
}

.hide {
  display: none;
}

.left {
  float: left;
}

.right {
  float: right;
}

.break-word {
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.noBackground {
  background: none;
}

#tour {
  background: #FCF1CD;
  color: #1F2226;
  cursor: pointer;
}

#tour span {
  background: url(https://scoroassets.scoro.com/gfx/message_icon_info.png) left no-repeat;
}

.notFilledError, .notUniqueError, .notEmailError {
  color: #1F2226;
  font-weight: normal;
}

/* this is used for validation error icons; having this wrapper helps us position the icon to the beginning of the erroneous input */
.input-wrapper {
  position: relative;
}

input.changePasswordError,
.notEmailError,
.tox-tinymce.validationError,
input.validationError,
select.validationError,
textarea.validationError,
.doubleDurationContainer.validationError select {
  border: 1px solid #DE1818 !important;
}

span.selectContainer.validationError::before {
  border-left: none !important;
}

.sui-input.validationError {
  border: 1px solid #DE1818;
}
.sui-input .sui-input__field.validationError {
  border: none !important;
}

.auto-suggest-component .validationError .sui-input__action-icon:not(.sui-input__action-icon--clear) {
  display: none;
}

span.radiosContainer.validationError label {
  color: #E43958;
  font-weight: 600;
}

.input-wrapper .validationError + em::before {
  margin-left: 0;
  padding: 0 5px;
  right: 0;
}

/* text in no inputs is aligned to the right; must switch icon to be shown on the left side of the input */
.input-wrapper input[name=no].validationError + em::before {
  right: auto;
  left: 0;
}

.narrow-input.validationError + em::before {
  margin-left: -17px;
}

.narrow-input {
  min-width: 20px;
}

span.radiosContainer.validationError + em::before {
  display: none !important;
}

.validationError + em::before {
  color: #E43958;
  z-index: 1;
  margin-top: 2px;
}

.validationError + em .validationTooltip {
  z-index: 15;
}

.validationTooltip {
  display: none;
  position: absolute;
  max-width: 100% !important;
  left: 0;
  color: #FFFFFF;
  background: #DE1818 !important;
  border-radius: 0.5rem;
  font-size: 1.5rem;
  font-style: normal;
  padding: 1rem;
  line-height: 1.2;
  white-space: normal;
}
.validationTooltip.popper-element .pop-over-arrow:after {
  background: #DE1818;
}

.validationError:hover ~ em .validationTooltip {
  display: block !important;
}

.validation-error-container {
  vertical-align: middle;
}

/* because autosuggests display all kind of icons there */
.validationError:hover + em::before,
.validationError + em.hideBefore::before {
  display: none;
}

.validationTooltip::before {
  content: "";
  display: none;
  width: 0;
  height: 0;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-right: 5px solid #E43958;
}

.validation-error-icon.validation-error-top {
  position: absolute;
  margin-top: 6px;
}

.validation-error-icon.validation-error-bottom {
  position: absolute;
  margin-left: 6px;
  margin-top: -20px;
}

.notPossibleToInsertViaAutosuggestError ~ .asPopNewModalButton {
  border-color: #E43958;
}

.notPossibleToInsertViaAutosuggestError ~ .asPopNewModalButton i.icon {
  color: #E43958;
}

.smallbut {
  border: 1px solid #B4BCCA;
  background: #FFFFFF;
  padding: 5px 9px;
  line-height: 15px;
  display: inline-block;
  color: #1F2226;
  cursor: pointer;
  border-radius: 3px;
  font-weight: 600;
}

.smallbut:hover {
  background: #F0F3FA;
  color: #1F2226;
}

.smallbut.dropdown_arrow {
  padding-right: 18px;
  background: url(https://scoroassets.scoro.com/gfx/arrow_down.png) right no-repeat #FFFFFF;
}

input.smallbut {
  height: 25px;
}

.event-summary-tooltip {
  max-height: 400px;
  overflow-y: auto;
  width: 280px;
  z-index: 1070;
  padding: 1.5em;
}

.position-relative {
  position: relative;
}

.position-absolute {
  position: absolute;
}

#modulefilter-input-submit {
  width: 1px;
  height: 1px;
  border: none;
  opacity: 0;
}

.validation-error {
  pointer-events: none;
}

.validation-error-icon {
  color: #DE1818;
  z-index: 1;
  font-style: normal;
  font-size: 1.2em;
  margin-left: -20px;
  position: absolute;
}

.no-overflow {
  overflow: hidden;
}

.overflow-ellipsis {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.no-pointer-events {
  pointer-events: none;
}

.calendar-event-tooltip {
  font-weight: 400;
}
.calendar-event-tooltip .scoro-icon {
  margin-right: 0.5rem;
}
.calendar-event-tooltip__users, .calendar-event-tooltip__description {
  margin: 1.5rem 0;
}
.calendar-event-tooltip__description {
  -webkit-line-clamp: 20;
  -webkit-box-orient: vertical;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
}
.calendar-event-tooltip__header {
  display: flex;
  justify-content: space-between;
}
.calendar-event-tooltip__event-name {
  font-size: 1.75rem;
  font-weight: 600;
}
.calendar-event-tooltip__item {
  line-height: 2rem;
  display: flex;
  margin: 1rem 0;
  width: -moz-fit-content;
  width: fit-content;
}
.calendar-event-tooltip__duration {
  display: flex;
  margin-left: 1rem;
  white-space: nowrap;
}
.calendar-event-tooltip__resource {
  display: flex;
  flex-wrap: wrap;
  margin: 1.25rem 0;
}
.calendar-event-tooltip__resource-item {
  display: flex;
  padding: 0.5rem 1rem 0.5rem 0.5rem;
  margin: 0.25rem 0.5rem 0.25rem 0;
  background: #F0F3FA;
  border-radius: 0.375rem;
}
.calendar-event-tooltip__resource-item[style*="background-color:#ffffff"] {
  border: solid 1px #F0F3FA;
}
.calendar-event-tooltip__resource-item .scoro-icon {
  fill: rgba(31, 34, 38, 0.4);
}
.calendar-event-tooltip__footer {
  margin-top: 1.5rem;
}

.custom-field-input-container textarea {
  max-width: 100%;
}
.custom-field-input-container input.autoSuggest,
.custom-field-input-container .sui-input {
  width: 150px;
}

.scoro-text-block {
  width: 100%;
  word-wrap: break-word;
  word-break: break-word;
  line-height: 1.5;
  --block-margin: 2rem;
  --block-max-width: 120rem;
  font-size: 13px;
}
.scoro-text-block h1,
.scoro-text-block h2,
.scoro-text-block h3,
.scoro-text-block h4,
.scoro-text-block h5,
.scoro-text-block h6 {
  margin: var(--block-margin) 0;
  font-weight: 600;
  line-height: 1.4;
  color: #1F2226;
  max-width: var(--block-max-width);
}
.scoro-text-block h1 {
  font-size: 2.2em;
}
.scoro-text-block h2 {
  font-size: 1.8em;
}
.scoro-text-block h3 {
  font-size: 1.4em;
}
.scoro-text-block h4 {
  font-size: 1.1em;
}
.scoro-text-block h5,
.scoro-text-block h6 {
  font-size: 1em;
}
.scoro-text-block a {
  color: #0085E0;
  text-decoration: none;
}
.scoro-text-block p,
.scoro-text-block table {
  margin: var(--block-margin) 0;
}
.scoro-text-block p {
  max-width: var(--block-max-width);
}
.scoro-text-block tr,
.scoro-text-block th,
.scoro-text-block td,
.scoro-text-block table {
  border-collapse: collapse;
  border-style: solid;
  border-width: 0;
}
.scoro-text-block th,
.scoro-text-block thead td {
  font-weight: 600;
  background: #F7F9FD;
}
.scoro-text-block td,
.scoro-text-block th {
  padding: 1rem;
  border: solid 1px #E2E6EE;
}
.scoro-text-block .text_infopanel {
  display: block;
  margin: var(--block-margin) 0;
  background: #EBF5FA;
  border-radius: 0.5rem;
  padding: 2rem 2rem 2rem 5rem;
  color: #001429;
  position: relative;
  max-width: var(--block-max-width);
}
.scoro-text-block .text_infopanel:before {
  content: "i";
  position: absolute;
  left: 1.5rem;
  top: 0;
  bottom: 0;
  margin: auto;
  height: 2rem;
  width: 2rem;
  border: solid 1px #0085E0;
  color: #0085E0;
  text-align: center;
  line-height: 2rem;
  font-size: 11px;
  border-radius: 2rem;
  font-weight: 500;
}
.scoro-text-block pre {
  font-family: monospace;
  background: #F7F9FD !important;
  padding: 2rem 2rem 2rem 6rem;
  margin: var(--block-margin) 0;
  color: #494F59;
  position: relative;
  overflow: auto;
  border-radius: 0.5rem;
  line-height: 1.6;
}
.scoro-text-block pre:before {
  content: "1\a 2\a 3\a 4\a 5\a 6\a 7\a 8\a 9\a 10\a 11\a 12\a 13\a 14\a 15\a 16\a 17\a 18\a 19\a 20\a 21\a 22\a 23\a 24\a 25\a 26\a 27\a 28\a 29\a 30\a 31\a 32\a 33\a 34\a 35\a 36\a 37\a 38\a 39\a 40\a 41\a 42\a 43\a 44\a 45\a 46\a 47\a 48\a 49\a 50\a 51\a 52\a 53\a 54\a 55\a 56\a 57\a 58\a 59\a 60\a 61\a 62\a 63\a 64\a 65\a 66\a 67\a 68\a 69\a 70\a 71\a 72\a 73\a 74\a 75\a 76\a 77\a 78\a 79\a 80\a 81\a 82\a 83\a 84\a 85\a 86\a 87\a 88\a 89\a 90\a 91\a 92\a 93\a 94\a 95\a 96\a 97\a 98\a 99\a 100\a…";
  width: 4rem;
  text-align: center;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 2rem;
  background: #F0F3FA;
  overflow: hidden;
  padding-top: 2rem;
  box-shadow: #F0F3FA 0 2rem 0;
  color: #717A89;
}
.scoro-text-block b,
.scoro-text-block strong {
  font-weight: 600;
}
.scoro-text-block ul,
.scoro-text-block ol {
  margin: var(--block-margin) 0;
  padding: 0;
  list-style: none;
}
.scoro-text-block ol {
  counter-reset: list-counter;
  padding-left: 3rem;
}
.scoro-text-block ol ol,
.scoro-text-block ol ul {
  margin: 0.5rem 0;
  padding-left: 2rem;
}
.scoro-text-block ol > li {
  counter-increment: list-counter 1;
}
.scoro-text-block ol li {
  padding-left: 0.5rem;
  position: relative;
}
.scoro-text-block ol li:before {
  content: counter(list-counter) ".";
  font-feature-settings: "tnum";
  white-space: nowrap;
  position: absolute;
  right: 100%;
  top: 0;
}
.scoro-text-block li {
  margin: 0.5rem 0;
  max-width: var(--block-max-width);
}
.scoro-text-block ul {
  padding-left: 2.5rem;
}
.scoro-text-block ul ol,
.scoro-text-block ul ul {
  margin: 0.5rem 0;
  padding-left: 1.5rem;
}
.scoro-text-block ul li {
  position: relative;
  padding-left: 1rem;
}
.scoro-text-block ul li:before {
  content: "•";
  position: absolute;
  right: 100%;
  top: 0;
}
.scoro-text-block blockquote {
  background: #F7F9FD;
  margin: var(--block-margin) 0;
  border-radius: 0.5rem;
  padding: 2rem;
  border-left: solid 0.375rem #E2E6EE;
}
.scoro-text-block img {
  max-width: 100%;
  height: auto !important;
}
.scoro-text-block *:not(li):first-child {
  margin-top: 0;
}
.scoro-text-block *:not(li):last-child {
  margin-bottom: 0;
}

.scoro-subheading {
  border-bottom: solid 1px #F0F3FA;
  margin: 3rem 0 2rem;
  padding-bottom: 1rem;
}
.scoro-subheading__title {
  font-size: 1.75rem;
  font-weight: 600;
  color: #0085E0;
  line-height: 1.3;
  margin: 0;
}
.scoro-subheading__helper {
  font-size: 1.5rem;
  line-height: 1.4;
  color: #717A89;
  margin-top: 0.5rem;
}

.view-expand-button {
  margin-top: 3px;
  padding: 1rem;
  border-radius: 0.5rem;
}
.view-expand-button:hover {
  background: #F0F3FA;
}
.view-expand-button:hover .scoro-icon {
  fill: #717A89;
}
.view-expand-button .view-expand-button__contract-icon {
  display: none;
}

.container--expanded .view-expand-button__contract-icon {
  display: block;
}
.container--expanded .view-expand-button__expand-icon {
  display: none;
}

.action-view .view-expand-button,
.mod-reports.main-mod .view-expand-button,
.action-modify .view-expand-button,
.mod-main .view-expand-button,
.modalPopup .view-expand-button,
.mod-settings .view-expand-button {
  display: none;
}

@media (max-width: 1800px) {
  .view-expand-button {
    display: none;
  }
}
.bread-crumbs {
  display: inline-flex;
  align-items: center;
  gap: 1rem;
  font-size: 2.25rem;
  line-height: 2.75rem;
}
.bread-crumbs__container {
  padding-top: 1rem;
  padding-bottom: 2rem;
  border-bottom: 1px solid #E2E6EE;
}
.bread-crumbs__caret {
  margin-top: 0.25rem;
}
.bread-crumbs__item--secondary {
  margin-top: 0.5rem;
  color: #717A89;
  font-size: 1.75rem;
  line-height: 2rem;
  font-weight: 400;
}

.custom-field-tooltip {
  display: inline-block;
  vertical-align: middle;
}

.tab-nav {
  display: flex;
  flex-wrap: wrap;
  padding: 0 3rem;
  background: #F7F9FD;
  border-bottom: solid 1px #F0F3FA;
}
.tab-nav__item {
  margin-bottom: -1px;
}
.tab-nav__item-target {
  display: block;
  padding: 2rem 1.5rem;
  border-bottom: solid 1px transparent;
}
.tab-nav__item-target:hover {
  color: #E43958;
}
.tab-nav__item.active .tab-nav__item-target {
  color: #E43958;
  border-bottom-color: #E43958;
}