.flatpickr-calendar {
  background: transparent;
  opacity: 0;
  display: none;
  text-align: center;
  visibility: hidden;
  padding: 0;
  -webkit-animation: none;
          animation: none;
  direction: ltr;
  border: 0;
  font-size: 14px;
  line-height: 24px;
  border-radius: 5px;
  position: absolute;
  width: 307.875px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -ms-touch-action: manipulation;
      touch-action: manipulation;
  background: #fff;
  -webkit-box-shadow: 1px 0 0 #e6e6e6, -1px 0 0 #e6e6e6, 0 1px 0 #e6e6e6, 0 -1px 0 #e6e6e6, 0 3px 13px rgba(0,0,0,0.08);
          box-shadow: 1px 0 0 #e6e6e6, -1px 0 0 #e6e6e6, 0 1px 0 #e6e6e6, 0 -1px 0 #e6e6e6, 0 3px 13px rgba(0,0,0,0.08);
}
.flatpickr-calendar.open,
.flatpickr-calendar.inline {
  opacity: 1;
  max-height: 640px;
  visibility: visible;
}
.flatpickr-calendar.open {
  display: inline-block;
  z-index: 99999;
}
.flatpickr-calendar.animate.open {
  -webkit-animation: fpFadeInDown 300ms cubic-bezier(0.23, 1, 0.32, 1);
          animation: fpFadeInDown 300ms cubic-bezier(0.23, 1, 0.32, 1);
}
.flatpickr-calendar.inline {
  display: block;
  position: relative;
  top: 2px;
}
.flatpickr-calendar.static {
  position: absolute;
  top: calc(100% + 2px);
}
.flatpickr-calendar.static.open {
  z-index: 999;
  display: block;
}
.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+1) .flatpickr-day.inRange:nth-child(7n+7) {
  -webkit-box-shadow: none !important;
          box-shadow: none !important;
}
.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+2) .flatpickr-day.inRange:nth-child(7n+1) {
  -webkit-box-shadow: -2px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
          box-shadow: -2px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
}
.flatpickr-calendar .hasWeeks .dayContainer,
.flatpickr-calendar .hasTime .dayContainer {
  border-bottom: 0;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.flatpickr-calendar .hasWeeks .dayContainer {
  border-left: 0;
}
.flatpickr-calendar.hasTime .flatpickr-time {
  height: 40px;
  border-top: 1px solid #e6e6e6;
}
.flatpickr-calendar.noCalendar.hasTime .flatpickr-time {
  height: auto;
}
.flatpickr-calendar:before,
.flatpickr-calendar:after {
  position: absolute;
  display: block;
  pointer-events: none;
  border: solid transparent;
  content: '';
  height: 0;
  width: 0;
  left: 22px;
}
.flatpickr-calendar.rightMost:before,
.flatpickr-calendar.arrowRight:before,
.flatpickr-calendar.rightMost:after,
.flatpickr-calendar.arrowRight:after {
  left: auto;
  right: 22px;
}
.flatpickr-calendar.arrowCenter:before,
.flatpickr-calendar.arrowCenter:after {
  left: 50%;
  right: 50%;
}
.flatpickr-calendar:before {
  border-width: 5px;
  margin: 0 -5px;
}
.flatpickr-calendar:after {
  border-width: 4px;
  margin: 0 -4px;
}
.flatpickr-calendar.arrowTop:before,
.flatpickr-calendar.arrowTop:after {
  bottom: 100%;
}
.flatpickr-calendar.arrowTop:before {
  border-bottom-color: #e6e6e6;
}
.flatpickr-calendar.arrowTop:after {
  border-bottom-color: #fff;
}
.flatpickr-calendar.arrowBottom:before,
.flatpickr-calendar.arrowBottom:after {
  top: 100%;
}
.flatpickr-calendar.arrowBottom:before {
  border-top-color: #e6e6e6;
}
.flatpickr-calendar.arrowBottom:after {
  border-top-color: #fff;
}
.flatpickr-calendar:focus {
  outline: 0;
}
.flatpickr-wrapper {
  position: relative;
  display: inline-block;
}
.flatpickr-months {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}
.flatpickr-months .flatpickr-month {
  background: transparent;
  color: rgba(0,0,0,0.9);
  fill: rgba(0,0,0,0.9);
  height: 34px;
  line-height: 1;
  text-align: center;
  position: relative;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  overflow: hidden;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.flatpickr-months .flatpickr-prev-month,
.flatpickr-months .flatpickr-next-month {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  text-decoration: none;
  cursor: pointer;
  position: absolute;
  top: 0;
  height: 34px;
  padding: 10px;
  z-index: 3;
  color: rgba(0,0,0,0.9);
  fill: rgba(0,0,0,0.9);
}
.flatpickr-months .flatpickr-prev-month.flatpickr-disabled,
.flatpickr-months .flatpickr-next-month.flatpickr-disabled {
  display: none;
}
.flatpickr-months .flatpickr-prev-month i,
.flatpickr-months .flatpickr-next-month i {
  position: relative;
}
.flatpickr-months .flatpickr-prev-month.flatpickr-prev-month,
.flatpickr-months .flatpickr-next-month.flatpickr-prev-month {
/*
      /*rtl:begin:ignore*/
/*
      */
  left: 0;
/*
      /*rtl:end:ignore*/
/*
      */
}
/*
      /*rtl:begin:ignore*/
/*
      /*rtl:end:ignore*/
.flatpickr-months .flatpickr-prev-month.flatpickr-next-month,
.flatpickr-months .flatpickr-next-month.flatpickr-next-month {
/*
      /*rtl:begin:ignore*/
/*
      */
  right: 0;
/*
      /*rtl:end:ignore*/
/*
      */
}
/*
      /*rtl:begin:ignore*/
/*
      /*rtl:end:ignore*/
.flatpickr-months .flatpickr-prev-month:hover,
.flatpickr-months .flatpickr-next-month:hover {
  color: #959ea9;
}
.flatpickr-months .flatpickr-prev-month:hover svg,
.flatpickr-months .flatpickr-next-month:hover svg {
  fill: #f64747;
}
.flatpickr-months .flatpickr-prev-month svg,
.flatpickr-months .flatpickr-next-month svg {
  width: 14px;
  height: 14px;
}
.flatpickr-months .flatpickr-prev-month svg path,
.flatpickr-months .flatpickr-next-month svg path {
  -webkit-transition: fill 0.1s;
  transition: fill 0.1s;
  fill: inherit;
}
.numInputWrapper {
  position: relative;
  height: auto;
}
.numInputWrapper input,
.numInputWrapper span {
  display: inline-block;
}
.numInputWrapper input {
  width: 100%;
}
.numInputWrapper input::-ms-clear {
  display: none;
}
.numInputWrapper input::-webkit-outer-spin-button,
.numInputWrapper input::-webkit-inner-spin-button {
  margin: 0;
  -webkit-appearance: none;
}
.numInputWrapper span {
  position: absolute;
  right: 0;
  width: 14px;
  padding: 0 4px 0 2px;
  height: 50%;
  line-height: 50%;
  opacity: 0;
  cursor: pointer;
  border: 1px solid rgba(57,57,57,0.15);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.numInputWrapper span:hover {
  background: rgba(0,0,0,0.1);
}
.numInputWrapper span:active {
  background: rgba(0,0,0,0.2);
}
.numInputWrapper span:after {
  display: block;
  content: "";
  position: absolute;
}
.numInputWrapper span.arrowUp {
  top: 0;
  border-bottom: 0;
}
.numInputWrapper span.arrowUp:after {
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-bottom: 4px solid rgba(57,57,57,0.6);
  top: 26%;
}
.numInputWrapper span.arrowDown {
  top: 50%;
}
.numInputWrapper span.arrowDown:after {
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 4px solid rgba(57,57,57,0.6);
  top: 40%;
}
.numInputWrapper span svg {
  width: inherit;
  height: auto;
}
.numInputWrapper span svg path {
  fill: rgba(0,0,0,0.5);
}
.numInputWrapper:hover {
  background: rgba(0,0,0,0.05);
}
.numInputWrapper:hover span {
  opacity: 1;
}
.flatpickr-current-month {
  font-size: 135%;
  line-height: inherit;
  font-weight: 300;
  color: inherit;
  position: absolute;
  width: 75%;
  left: 12.5%;
  padding: 7.48px 0 0 0;
  line-height: 1;
  height: 34px;
  display: inline-block;
  text-align: center;
  -webkit-transform: translate3d(0px, 0px, 0px);
          transform: translate3d(0px, 0px, 0px);
}
.flatpickr-current-month span.cur-month {
  font-family: inherit;
  font-weight: 700;
  color: inherit;
  display: inline-block;
  margin-left: 0.5ch;
  padding: 0;
}
.flatpickr-current-month span.cur-month:hover {
  background: rgba(0,0,0,0.05);
}
.flatpickr-current-month .numInputWrapper {
  width: 6ch;
  width: 7ch\0;
  display: inline-block;
}
.flatpickr-current-month .numInputWrapper span.arrowUp:after {
  border-bottom-color: rgba(0,0,0,0.9);
}
.flatpickr-current-month .numInputWrapper span.arrowDown:after {
  border-top-color: rgba(0,0,0,0.9);
}
.flatpickr-current-month input.cur-year {
  background: transparent;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  color: inherit;
  cursor: text;
  padding: 0 0 0 0.5ch;
  margin: 0;
  display: inline-block;
  font-size: inherit;
  font-family: inherit;
  font-weight: 300;
  line-height: inherit;
  height: auto;
  border: 0;
  border-radius: 0;
  vertical-align: initial;
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
  appearance: textfield;
}
.flatpickr-current-month input.cur-year:focus {
  outline: 0;
}
.flatpickr-current-month input.cur-year[disabled],
.flatpickr-current-month input.cur-year[disabled]:hover {
  font-size: 100%;
  color: rgba(0,0,0,0.5);
  background: transparent;
  pointer-events: none;
}
.flatpickr-current-month .flatpickr-monthDropdown-months {
  appearance: menulist;
  background: transparent;
  border: none;
  border-radius: 0;
  box-sizing: border-box;
  color: inherit;
  cursor: pointer;
  font-size: inherit;
  font-family: inherit;
  font-weight: 300;
  height: auto;
  line-height: inherit;
  margin: -1px 0 0 0;
  outline: none;
  padding: 0 0 0 0.5ch;
  position: relative;
  vertical-align: initial;
  -webkit-box-sizing: border-box;
  -webkit-appearance: menulist;
  -moz-appearance: menulist;
  width: auto;
}
.flatpickr-current-month .flatpickr-monthDropdown-months:focus,
.flatpickr-current-month .flatpickr-monthDropdown-months:active {
  outline: none;
}
.flatpickr-current-month .flatpickr-monthDropdown-months:hover {
  background: rgba(0,0,0,0.05);
}
.flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month {
  background-color: transparent;
  outline: none;
  padding: 0;
}
.flatpickr-weekdays {
  background: transparent;
  text-align: center;
  overflow: hidden;
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  height: 28px;
}
.flatpickr-weekdays .flatpickr-weekdaycontainer {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
span.flatpickr-weekday {
  cursor: default;
  font-size: 90%;
  background: transparent;
  color: rgba(0,0,0,0.54);
  line-height: 1;
  margin: 0;
  text-align: center;
  display: block;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
  font-weight: bolder;
}
.dayContainer,
.flatpickr-weeks {
  padding: 1px 0 0 0;
}
.flatpickr-days {
  position: relative;
  overflow: hidden;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
      -ms-flex-align: start;
          align-items: flex-start;
  width: 307.875px;
}
.flatpickr-days:focus {
  outline: 0;
}
.dayContainer {
  padding: 0;
  outline: 0;
  text-align: left;
  width: 307.875px;
  min-width: 307.875px;
  max-width: 307.875px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  display: inline-block;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
          flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-around;
          justify-content: space-around;
  -webkit-transform: translate3d(0px, 0px, 0px);
          transform: translate3d(0px, 0px, 0px);
  opacity: 1;
}
.dayContainer + .dayContainer {
  -webkit-box-shadow: -1px 0 0 #e6e6e6;
          box-shadow: -1px 0 0 #e6e6e6;
}
.flatpickr-day {
  background: none;
  border: 1px solid transparent;
  border-radius: 150px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  color: #393939;
  cursor: pointer;
  font-weight: 400;
  width: 14.2857143%;
  -webkit-flex-basis: 14.2857143%;
      -ms-flex-preferred-size: 14.2857143%;
          flex-basis: 14.2857143%;
  max-width: 39px;
  height: 39px;
  line-height: 39px;
  margin: 0;
  display: inline-block;
  position: relative;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  text-align: center;
}
.flatpickr-day.inRange,
.flatpickr-day.prevMonthDay.inRange,
.flatpickr-day.nextMonthDay.inRange,
.flatpickr-day.today.inRange,
.flatpickr-day.prevMonthDay.today.inRange,
.flatpickr-day.nextMonthDay.today.inRange,
.flatpickr-day:hover,
.flatpickr-day.prevMonthDay:hover,
.flatpickr-day.nextMonthDay:hover,
.flatpickr-day:focus,
.flatpickr-day.prevMonthDay:focus,
.flatpickr-day.nextMonthDay:focus {
  cursor: pointer;
  outline: 0;
  background: #e6e6e6;
  border-color: #e6e6e6;
}
.flatpickr-day.today {
  border-color: #959ea9;
}
.flatpickr-day.today:hover,
.flatpickr-day.today:focus {
  border-color: #959ea9;
  background: #959ea9;
  color: #fff;
}
.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.selected.inRange,
.flatpickr-day.startRange.inRange,
.flatpickr-day.endRange.inRange,
.flatpickr-day.selected:focus,
.flatpickr-day.startRange:focus,
.flatpickr-day.endRange:focus,
.flatpickr-day.selected:hover,
.flatpickr-day.startRange:hover,
.flatpickr-day.endRange:hover,
.flatpickr-day.selected.prevMonthDay,
.flatpickr-day.startRange.prevMonthDay,
.flatpickr-day.endRange.prevMonthDay,
.flatpickr-day.selected.nextMonthDay,
.flatpickr-day.startRange.nextMonthDay,
.flatpickr-day.endRange.nextMonthDay {
  background: #569ff7;
  -webkit-box-shadow: none;
          box-shadow: none;
  color: #fff;
  border-color: #569ff7;
}
.flatpickr-day.selected.startRange,
.flatpickr-day.startRange.startRange,
.flatpickr-day.endRange.startRange {
  border-radius: 50px 0 0 50px;
}
.flatpickr-day.selected.endRange,
.flatpickr-day.startRange.endRange,
.flatpickr-day.endRange.endRange {
  border-radius: 0 50px 50px 0;
}
.flatpickr-day.selected.startRange + .endRange:not(:nth-child(7n+1)),
.flatpickr-day.startRange.startRange + .endRange:not(:nth-child(7n+1)),
.flatpickr-day.endRange.startRange + .endRange:not(:nth-child(7n+1)) {
  -webkit-box-shadow: -10px 0 0 #569ff7;
          box-shadow: -10px 0 0 #569ff7;
}
.flatpickr-day.selected.startRange.endRange,
.flatpickr-day.startRange.startRange.endRange,
.flatpickr-day.endRange.startRange.endRange {
  border-radius: 50px;
}
.flatpickr-day.inRange {
  border-radius: 0;
  -webkit-box-shadow: -5px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
          box-shadow: -5px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
}
.flatpickr-day.flatpickr-disabled,
.flatpickr-day.flatpickr-disabled:hover,
.flatpickr-day.prevMonthDay,
.flatpickr-day.nextMonthDay,
.flatpickr-day.notAllowed,
.flatpickr-day.notAllowed.prevMonthDay,
.flatpickr-day.notAllowed.nextMonthDay {
  color: rgba(57,57,57,0.3);
  background: transparent;
  border-color: transparent;
  cursor: default;
}
.flatpickr-day.flatpickr-disabled,
.flatpickr-day.flatpickr-disabled:hover {
  cursor: not-allowed;
  color: rgba(57,57,57,0.1);
}
.flatpickr-day.week.selected {
  border-radius: 0;
  -webkit-box-shadow: -5px 0 0 #569ff7, 5px 0 0 #569ff7;
          box-shadow: -5px 0 0 #569ff7, 5px 0 0 #569ff7;
}
.flatpickr-day.hidden {
  visibility: hidden;
}
.rangeMode .flatpickr-day {
  margin-top: 1px;
}
.flatpickr-weekwrapper {
  float: left;
}
.flatpickr-weekwrapper .flatpickr-weeks {
  padding: 0 12px;
  -webkit-box-shadow: 1px 0 0 #e6e6e6;
          box-shadow: 1px 0 0 #e6e6e6;
}
.flatpickr-weekwrapper .flatpickr-weekday {
  float: none;
  width: 100%;
  line-height: 28px;
}
.flatpickr-weekwrapper span.flatpickr-day,
.flatpickr-weekwrapper span.flatpickr-day:hover {
  display: block;
  width: 100%;
  max-width: none;
  color: rgba(57,57,57,0.3);
  background: transparent;
  cursor: default;
  border: none;
}
.flatpickr-innerContainer {
  display: block;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  overflow: hidden;
}
.flatpickr-rContainer {
  display: inline-block;
  padding: 0;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.flatpickr-time {
  text-align: center;
  outline: 0;
  display: block;
  height: 0;
  line-height: 40px;
  max-height: 40px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  overflow: hidden;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}
.flatpickr-time:after {
  content: "";
  display: table;
  clear: both;
}
.flatpickr-time .numInputWrapper {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
  width: 40%;
  height: 40px;
  float: left;
}
.flatpickr-time .numInputWrapper span.arrowUp:after {
  border-bottom-color: #393939;
}
.flatpickr-time .numInputWrapper span.arrowDown:after {
  border-top-color: #393939;
}
.flatpickr-time.hasSeconds .numInputWrapper {
  width: 26%;
}
.flatpickr-time.time24hr .numInputWrapper {
  width: 49%;
}
.flatpickr-time input {
  background: transparent;
  -webkit-box-shadow: none;
          box-shadow: none;
  border: 0;
  border-radius: 0;
  text-align: center;
  margin: 0;
  padding: 0;
  height: inherit;
  line-height: inherit;
  color: #393939;
  font-size: 14px;
  position: relative;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
  appearance: textfield;
}
.flatpickr-time input.flatpickr-hour {
  font-weight: bold;
}
.flatpickr-time input.flatpickr-minute,
.flatpickr-time input.flatpickr-second {
  font-weight: 400;
}
.flatpickr-time input:focus {
  outline: 0;
  border: 0;
}
.flatpickr-time .flatpickr-time-separator,
.flatpickr-time .flatpickr-am-pm {
  height: inherit;
  float: left;
  line-height: inherit;
  color: #393939;
  font-weight: bold;
  width: 2%;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  -webkit-align-self: center;
      -ms-flex-item-align: center;
          align-self: center;
}
.flatpickr-time .flatpickr-am-pm {
  outline: 0;
  width: 18%;
  cursor: pointer;
  text-align: center;
  font-weight: 400;
}
.flatpickr-time input:hover,
.flatpickr-time .flatpickr-am-pm:hover,
.flatpickr-time input:focus,
.flatpickr-time .flatpickr-am-pm:focus {
  background: #eee;
}
.flatpickr-input[readonly] {
  cursor: pointer;
}
@-webkit-keyframes fpFadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -20px, 0);
            transform: translate3d(0, -20px, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}
@keyframes fpFadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -20px, 0);
            transform: translate3d(0, -20px, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
  }
}
.flatpickr-monthSelect-months {
  margin: 10px 1px 3px 1px;
  flex-wrap: wrap;
}
.flatpickr-monthSelect-month {
  background: none;
  border: 1px solid transparent;
  border-radius: 4px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #393939;
  cursor: pointer;
  display: inline-block;
  font-weight: 400;
  margin: 0.5px;
  justify-content: center;
  padding: 10px;
  position: relative;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  text-align: center;
  width: 33%;
}
.flatpickr-monthSelect-month.flatpickr-disabled {
	color: #eee;
}
.flatpickr-monthSelect-month.flatpickr-disabled:hover,
.flatpickr-monthSelect-month.flatpickr-disabled:focus {
	cursor: not-allowed;
	background: none !important;
}
.flatpickr-monthSelect-theme-dark {
  background: #3f4458;
}
.flatpickr-monthSelect-theme-dark .flatpickr-current-month input.cur-year {
  color: #fff;
}
.flatpickr-monthSelect-theme-dark .flatpickr-months .flatpickr-prev-month,
.flatpickr-monthSelect-theme-dark .flatpickr-months .flatpickr-next-month {
  color: #fff;
  fill: #fff;
}
.flatpickr-monthSelect-theme-dark .flatpickr-monthSelect-month {
  color: rgba(255, 255, 255, 0.95);
}
.flatpickr-monthSelect-month.today {
  border-color: #959ea9;
}
.flatpickr-monthSelect-month.inRange,
.flatpickr-monthSelect-month.inRange.today,
.flatpickr-monthSelect-month:hover,
.flatpickr-monthSelect-month:focus {
  background: #e6e6e6;
  cursor: pointer;
  outline: 0;
  border-color: #e6e6e6;
}
.flatpickr-monthSelect-theme-dark .flatpickr-monthSelect-month.inRange,
.flatpickr-monthSelect-theme-dark .flatpickr-monthSelect-month:hover,
.flatpickr-monthSelect-theme-dark .flatpickr-monthSelect-month:focus {
  background: #646c8c;
  border-color: #646c8c;
}
.flatpickr-monthSelect-month.today:hover,
.flatpickr-monthSelect-month.today:focus {
  background: #959ea9;
  border-color: #959ea9;
  color: #fff;
}
.flatpickr-monthSelect-month.selected,
.flatpickr-monthSelect-month.startRange,
.flatpickr-monthSelect-month.endRange {
  background-color: #569ff7;
  box-shadow: none;
  color: #fff;
  border-color: #569ff7;
}
.flatpickr-monthSelect-month.startRange {
  border-radius: 50px 0 0 50px;
}
.flatpickr-monthSelect-month.endRange {
  border-radius: 0 50px 50px 0;
}
.flatpickr-monthSelect-month.startRange.endRange {
  border-radius: 50px;
}
.flatpickr-monthSelect-month.inRange {
  border-radius: 0;
  box-shadow: -5px 0 0 #e6e6e6, 5px 0 0 #e6e6e6;
}
.flatpickr-monthSelect-theme-dark .flatpickr-monthSelect-month.selected,
.flatpickr-monthSelect-theme-dark .flatpickr-monthSelect-month.startRange,
.flatpickr-monthSelect-theme-dark .flatpickr-monthSelect-month.endRange {
  background: #80cbc4;
  -webkit-box-shadow: none;
  box-shadow: none;
  color: #fff;
  border-color: #80cbc4;
}
/*!
 * Quill Editor v2.0.3
 * https://quilljs.com
 * Copyright (c) 2017-2024, Slab
 * Copyright (c) 2014, Jason Chen
 * Copyright (c) 2013, salesforce.com
 */
.ql-container{box-sizing:border-box;font-family:Helvetica,Arial,sans-serif;font-size:13px;height:100%;margin:0;position:relative}
.ql-container.ql-disabled .ql-tooltip{visibility:hidden}
.ql-container:not(.ql-disabled) li[data-list=checked] > .ql-ui,.ql-container:not(.ql-disabled) li[data-list=unchecked] > .ql-ui{cursor:pointer}
.ql-clipboard{left:-100000px;height:1px;overflow-y:hidden;position:absolute;top:50%}
.ql-clipboard p{margin:0;padding:0}
.ql-editor{box-sizing:border-box;counter-reset:list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;line-height:1.42;height:100%;outline:none;overflow-y:auto;padding:12px 15px;tab-size:4;-moz-tab-size:4;text-align:left;white-space:pre-wrap;word-wrap:break-word}
.ql-editor > *{cursor:text}
.ql-editor p,.ql-editor ol,.ql-editor pre,.ql-editor blockquote,.ql-editor h1,.ql-editor h2,.ql-editor h3,.ql-editor h4,.ql-editor h5,.ql-editor h6{margin:0;padding:0}
@supports (counter-set:none){.ql-editor p,.ql-editor h1,.ql-editor h2,.ql-editor h3,.ql-editor h4,.ql-editor h5,.ql-editor h6{counter-set:list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}
@supports not (counter-set:none){.ql-editor p,.ql-editor h1,.ql-editor h2,.ql-editor h3,.ql-editor h4,.ql-editor h5,.ql-editor h6{counter-reset:list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}
.ql-editor table{border-collapse:collapse}
.ql-editor td{border:1px solid #000;padding:2px 5px}
.ql-editor ol{padding-left:1.5em}
.ql-editor li{list-style-type:none;padding-left:1.5em;position:relative}
.ql-editor li > .ql-ui:before{display:inline-block;margin-left:-1.5em;margin-right:.3em;text-align:right;white-space:nowrap;width:1.2em}
.ql-editor li[data-list=checked] > .ql-ui,.ql-editor li[data-list=unchecked] > .ql-ui{color:#777}
.ql-editor li[data-list=bullet] > .ql-ui:before{content:'\2022'}
.ql-editor li[data-list=checked] > .ql-ui:before{content:'\2611'}
.ql-editor li[data-list=unchecked] > .ql-ui:before{content:'\2610'}
@supports (counter-set:none){.ql-editor li[data-list]{counter-set:list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}
@supports not (counter-set:none){.ql-editor li[data-list]{counter-reset:list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}
.ql-editor li[data-list=ordered]{counter-increment:list-0}
.ql-editor li[data-list=ordered] > .ql-ui:before{content:counter(list-0, decimal) '. '}
.ql-editor li[data-list=ordered].ql-indent-1{counter-increment:list-1}
.ql-editor li[data-list=ordered].ql-indent-1 > .ql-ui:before{content:counter(list-1, lower-alpha) '. '}
@supports (counter-set:none){.ql-editor li[data-list].ql-indent-1{counter-set:list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}
@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-1{counter-reset:list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}
.ql-editor li[data-list=ordered].ql-indent-2{counter-increment:list-2}
.ql-editor li[data-list=ordered].ql-indent-2 > .ql-ui:before{content:counter(list-2, lower-roman) '. '}
@supports (counter-set:none){.ql-editor li[data-list].ql-indent-2{counter-set:list-3 list-4 list-5 list-6 list-7 list-8 list-9}}
@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-2{counter-reset:list-3 list-4 list-5 list-6 list-7 list-8 list-9}}
.ql-editor li[data-list=ordered].ql-indent-3{counter-increment:list-3}
.ql-editor li[data-list=ordered].ql-indent-3 > .ql-ui:before{content:counter(list-3, decimal) '. '}
@supports (counter-set:none){.ql-editor li[data-list].ql-indent-3{counter-set:list-4 list-5 list-6 list-7 list-8 list-9}}
@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-3{counter-reset:list-4 list-5 list-6 list-7 list-8 list-9}}
.ql-editor li[data-list=ordered].ql-indent-4{counter-increment:list-4}
.ql-editor li[data-list=ordered].ql-indent-4 > .ql-ui:before{content:counter(list-4, lower-alpha) '. '}
@supports (counter-set:none){.ql-editor li[data-list].ql-indent-4{counter-set:list-5 list-6 list-7 list-8 list-9}}
@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-4{counter-reset:list-5 list-6 list-7 list-8 list-9}}
.ql-editor li[data-list=ordered].ql-indent-5{counter-increment:list-5}
.ql-editor li[data-list=ordered].ql-indent-5 > .ql-ui:before{content:counter(list-5, lower-roman) '. '}
@supports (counter-set:none){.ql-editor li[data-list].ql-indent-5{counter-set:list-6 list-7 list-8 list-9}}
@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-5{counter-reset:list-6 list-7 list-8 list-9}}
.ql-editor li[data-list=ordered].ql-indent-6{counter-increment:list-6}
.ql-editor li[data-list=ordered].ql-indent-6 > .ql-ui:before{content:counter(list-6, decimal) '. '}
@supports (counter-set:none){.ql-editor li[data-list].ql-indent-6{counter-set:list-7 list-8 list-9}}
@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-6{counter-reset:list-7 list-8 list-9}}
.ql-editor li[data-list=ordered].ql-indent-7{counter-increment:list-7}
.ql-editor li[data-list=ordered].ql-indent-7 > .ql-ui:before{content:counter(list-7, lower-alpha) '. '}
@supports (counter-set:none){.ql-editor li[data-list].ql-indent-7{counter-set:list-8 list-9}}
@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-7{counter-reset:list-8 list-9}}
.ql-editor li[data-list=ordered].ql-indent-8{counter-increment:list-8}
.ql-editor li[data-list=ordered].ql-indent-8 > .ql-ui:before{content:counter(list-8, lower-roman) '. '}
@supports (counter-set:none){.ql-editor li[data-list].ql-indent-8{counter-set:list-9}}
@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-8{counter-reset:list-9}}
.ql-editor li[data-list=ordered].ql-indent-9{counter-increment:list-9}
.ql-editor li[data-list=ordered].ql-indent-9 > .ql-ui:before{content:counter(list-9, decimal) '. '}
.ql-editor .ql-indent-1:not(.ql-direction-rtl){padding-left:3em}
.ql-editor li.ql-indent-1:not(.ql-direction-rtl){padding-left:4.5em}
.ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right{padding-right:3em}
.ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right{padding-right:4.5em}
.ql-editor .ql-indent-2:not(.ql-direction-rtl){padding-left:6em}
.ql-editor li.ql-indent-2:not(.ql-direction-rtl){padding-left:7.5em}
.ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right{padding-right:6em}
.ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right{padding-right:7.5em}
.ql-editor .ql-indent-3:not(.ql-direction-rtl){padding-left:9em}
.ql-editor li.ql-indent-3:not(.ql-direction-rtl){padding-left:10.5em}
.ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right{padding-right:9em}
.ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right{padding-right:10.5em}
.ql-editor .ql-indent-4:not(.ql-direction-rtl){padding-left:12em}
.ql-editor li.ql-indent-4:not(.ql-direction-rtl){padding-left:13.5em}
.ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right{padding-right:12em}
.ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right{padding-right:13.5em}
.ql-editor .ql-indent-5:not(.ql-direction-rtl){padding-left:15em}
.ql-editor li.ql-indent-5:not(.ql-direction-rtl){padding-left:16.5em}
.ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right{padding-right:15em}
.ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right{padding-right:16.5em}
.ql-editor .ql-indent-6:not(.ql-direction-rtl){padding-left:18em}
.ql-editor li.ql-indent-6:not(.ql-direction-rtl){padding-left:19.5em}
.ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right{padding-right:18em}
.ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right{padding-right:19.5em}
.ql-editor .ql-indent-7:not(.ql-direction-rtl){padding-left:21em}
.ql-editor li.ql-indent-7:not(.ql-direction-rtl){padding-left:22.5em}
.ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right{padding-right:21em}
.ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right{padding-right:22.5em}
.ql-editor .ql-indent-8:not(.ql-direction-rtl){padding-left:24em}
.ql-editor li.ql-indent-8:not(.ql-direction-rtl){padding-left:25.5em}
.ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right{padding-right:24em}
.ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right{padding-right:25.5em}
.ql-editor .ql-indent-9:not(.ql-direction-rtl){padding-left:27em}
.ql-editor li.ql-indent-9:not(.ql-direction-rtl){padding-left:28.5em}
.ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right{padding-right:27em}
.ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right{padding-right:28.5em}
.ql-editor li.ql-direction-rtl{padding-right:1.5em}
.ql-editor li.ql-direction-rtl > .ql-ui:before{margin-left:.3em;margin-right:-1.5em;text-align:left}
.ql-editor table{table-layout:fixed;width:100%}
.ql-editor table td{outline:none}
.ql-editor .ql-code-block-container{font-family:monospace}
.ql-editor .ql-video{display:block;max-width:100%}
.ql-editor .ql-video.ql-align-center{margin:0 auto}
.ql-editor .ql-video.ql-align-right{margin:0 0 0 auto}
.ql-editor .ql-bg-black{background-color:#000}
.ql-editor .ql-bg-red{background-color:#e60000}
.ql-editor .ql-bg-orange{background-color:#f90}
.ql-editor .ql-bg-yellow{background-color:#ff0}
.ql-editor .ql-bg-green{background-color:#008a00}
.ql-editor .ql-bg-blue{background-color:#06c}
.ql-editor .ql-bg-purple{background-color:#93f}
.ql-editor .ql-color-white{color:#fff}
.ql-editor .ql-color-red{color:#e60000}
.ql-editor .ql-color-orange{color:#f90}
.ql-editor .ql-color-yellow{color:#ff0}
.ql-editor .ql-color-green{color:#008a00}
.ql-editor .ql-color-blue{color:#06c}
.ql-editor .ql-color-purple{color:#93f}
.ql-editor .ql-font-serif{font-family:Georgia,Times New Roman,serif}
.ql-editor .ql-font-monospace{font-family:Monaco,Courier New,monospace}
.ql-editor .ql-size-small{font-size:.75em}
.ql-editor .ql-size-large{font-size:1.5em}
.ql-editor .ql-size-huge{font-size:2.5em}
.ql-editor .ql-direction-rtl{direction:rtl;text-align:inherit}
.ql-editor .ql-align-center{text-align:center}
.ql-editor .ql-align-justify{text-align:justify}
.ql-editor .ql-align-right{text-align:right}
.ql-editor .ql-ui{position:absolute}
.ql-editor.ql-blank::before{color:rgba(0,0,0,0.6);content:attr(data-placeholder);font-style:italic;left:15px;pointer-events:none;position:absolute;right:15px}
/*!
 * Quill Editor v2.0.3
 * https://quilljs.com
 * Copyright (c) 2017-2024, Slab
 * Copyright (c) 2014, Jason Chen
 * Copyright (c) 2013, salesforce.com
 */
.ql-container{box-sizing:border-box;font-family:Helvetica,Arial,sans-serif;font-size:13px;height:100%;margin:0;position:relative}
.ql-container.ql-disabled .ql-tooltip{visibility:hidden}
.ql-container:not(.ql-disabled) li[data-list=checked] > .ql-ui,.ql-container:not(.ql-disabled) li[data-list=unchecked] > .ql-ui{cursor:pointer}
.ql-clipboard{left:-100000px;height:1px;overflow-y:hidden;position:absolute;top:50%}
.ql-clipboard p{margin:0;padding:0}
.ql-editor{box-sizing:border-box;counter-reset:list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;line-height:1.42;height:100%;outline:none;overflow-y:auto;padding:12px 15px;tab-size:4;-moz-tab-size:4;text-align:left;white-space:pre-wrap;word-wrap:break-word}
.ql-editor > *{cursor:text}
.ql-editor p,.ql-editor ol,.ql-editor pre,.ql-editor blockquote,.ql-editor h1,.ql-editor h2,.ql-editor h3,.ql-editor h4,.ql-editor h5,.ql-editor h6{margin:0;padding:0}
@supports (counter-set:none){.ql-editor p,.ql-editor h1,.ql-editor h2,.ql-editor h3,.ql-editor h4,.ql-editor h5,.ql-editor h6{counter-set:list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}
@supports not (counter-set:none){.ql-editor p,.ql-editor h1,.ql-editor h2,.ql-editor h3,.ql-editor h4,.ql-editor h5,.ql-editor h6{counter-reset:list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}
.ql-editor table{border-collapse:collapse}
.ql-editor td{border:1px solid #000;padding:2px 5px}
.ql-editor ol{padding-left:1.5em}
.ql-editor li{list-style-type:none;padding-left:1.5em;position:relative}
.ql-editor li > .ql-ui:before{display:inline-block;margin-left:-1.5em;margin-right:.3em;text-align:right;white-space:nowrap;width:1.2em}
.ql-editor li[data-list=checked] > .ql-ui,.ql-editor li[data-list=unchecked] > .ql-ui{color:#777}
.ql-editor li[data-list=bullet] > .ql-ui:before{content:'\2022'}
.ql-editor li[data-list=checked] > .ql-ui:before{content:'\2611'}
.ql-editor li[data-list=unchecked] > .ql-ui:before{content:'\2610'}
@supports (counter-set:none){.ql-editor li[data-list]{counter-set:list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}
@supports not (counter-set:none){.ql-editor li[data-list]{counter-reset:list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}
.ql-editor li[data-list=ordered]{counter-increment:list-0}
.ql-editor li[data-list=ordered] > .ql-ui:before{content:counter(list-0, decimal) '. '}
.ql-editor li[data-list=ordered].ql-indent-1{counter-increment:list-1}
.ql-editor li[data-list=ordered].ql-indent-1 > .ql-ui:before{content:counter(list-1, lower-alpha) '. '}
@supports (counter-set:none){.ql-editor li[data-list].ql-indent-1{counter-set:list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}
@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-1{counter-reset:list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9}}
.ql-editor li[data-list=ordered].ql-indent-2{counter-increment:list-2}
.ql-editor li[data-list=ordered].ql-indent-2 > .ql-ui:before{content:counter(list-2, lower-roman) '. '}
@supports (counter-set:none){.ql-editor li[data-list].ql-indent-2{counter-set:list-3 list-4 list-5 list-6 list-7 list-8 list-9}}
@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-2{counter-reset:list-3 list-4 list-5 list-6 list-7 list-8 list-9}}
.ql-editor li[data-list=ordered].ql-indent-3{counter-increment:list-3}
.ql-editor li[data-list=ordered].ql-indent-3 > .ql-ui:before{content:counter(list-3, decimal) '. '}
@supports (counter-set:none){.ql-editor li[data-list].ql-indent-3{counter-set:list-4 list-5 list-6 list-7 list-8 list-9}}
@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-3{counter-reset:list-4 list-5 list-6 list-7 list-8 list-9}}
.ql-editor li[data-list=ordered].ql-indent-4{counter-increment:list-4}
.ql-editor li[data-list=ordered].ql-indent-4 > .ql-ui:before{content:counter(list-4, lower-alpha) '. '}
@supports (counter-set:none){.ql-editor li[data-list].ql-indent-4{counter-set:list-5 list-6 list-7 list-8 list-9}}
@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-4{counter-reset:list-5 list-6 list-7 list-8 list-9}}
.ql-editor li[data-list=ordered].ql-indent-5{counter-increment:list-5}
.ql-editor li[data-list=ordered].ql-indent-5 > .ql-ui:before{content:counter(list-5, lower-roman) '. '}
@supports (counter-set:none){.ql-editor li[data-list].ql-indent-5{counter-set:list-6 list-7 list-8 list-9}}
@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-5{counter-reset:list-6 list-7 list-8 list-9}}
.ql-editor li[data-list=ordered].ql-indent-6{counter-increment:list-6}
.ql-editor li[data-list=ordered].ql-indent-6 > .ql-ui:before{content:counter(list-6, decimal) '. '}
@supports (counter-set:none){.ql-editor li[data-list].ql-indent-6{counter-set:list-7 list-8 list-9}}
@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-6{counter-reset:list-7 list-8 list-9}}
.ql-editor li[data-list=ordered].ql-indent-7{counter-increment:list-7}
.ql-editor li[data-list=ordered].ql-indent-7 > .ql-ui:before{content:counter(list-7, lower-alpha) '. '}
@supports (counter-set:none){.ql-editor li[data-list].ql-indent-7{counter-set:list-8 list-9}}
@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-7{counter-reset:list-8 list-9}}
.ql-editor li[data-list=ordered].ql-indent-8{counter-increment:list-8}
.ql-editor li[data-list=ordered].ql-indent-8 > .ql-ui:before{content:counter(list-8, lower-roman) '. '}
@supports (counter-set:none){.ql-editor li[data-list].ql-indent-8{counter-set:list-9}}
@supports not (counter-set:none){.ql-editor li[data-list].ql-indent-8{counter-reset:list-9}}
.ql-editor li[data-list=ordered].ql-indent-9{counter-increment:list-9}
.ql-editor li[data-list=ordered].ql-indent-9 > .ql-ui:before{content:counter(list-9, decimal) '. '}
.ql-editor .ql-indent-1:not(.ql-direction-rtl){padding-left:3em}
.ql-editor li.ql-indent-1:not(.ql-direction-rtl){padding-left:4.5em}
.ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right{padding-right:3em}
.ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right{padding-right:4.5em}
.ql-editor .ql-indent-2:not(.ql-direction-rtl){padding-left:6em}
.ql-editor li.ql-indent-2:not(.ql-direction-rtl){padding-left:7.5em}
.ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right{padding-right:6em}
.ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right{padding-right:7.5em}
.ql-editor .ql-indent-3:not(.ql-direction-rtl){padding-left:9em}
.ql-editor li.ql-indent-3:not(.ql-direction-rtl){padding-left:10.5em}
.ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right{padding-right:9em}
.ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right{padding-right:10.5em}
.ql-editor .ql-indent-4:not(.ql-direction-rtl){padding-left:12em}
.ql-editor li.ql-indent-4:not(.ql-direction-rtl){padding-left:13.5em}
.ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right{padding-right:12em}
.ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right{padding-right:13.5em}
.ql-editor .ql-indent-5:not(.ql-direction-rtl){padding-left:15em}
.ql-editor li.ql-indent-5:not(.ql-direction-rtl){padding-left:16.5em}
.ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right{padding-right:15em}
.ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right{padding-right:16.5em}
.ql-editor .ql-indent-6:not(.ql-direction-rtl){padding-left:18em}
.ql-editor li.ql-indent-6:not(.ql-direction-rtl){padding-left:19.5em}
.ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right{padding-right:18em}
.ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right{padding-right:19.5em}
.ql-editor .ql-indent-7:not(.ql-direction-rtl){padding-left:21em}
.ql-editor li.ql-indent-7:not(.ql-direction-rtl){padding-left:22.5em}
.ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right{padding-right:21em}
.ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right{padding-right:22.5em}
.ql-editor .ql-indent-8:not(.ql-direction-rtl){padding-left:24em}
.ql-editor li.ql-indent-8:not(.ql-direction-rtl){padding-left:25.5em}
.ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right{padding-right:24em}
.ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right{padding-right:25.5em}
.ql-editor .ql-indent-9:not(.ql-direction-rtl){padding-left:27em}
.ql-editor li.ql-indent-9:not(.ql-direction-rtl){padding-left:28.5em}
.ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right{padding-right:27em}
.ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right{padding-right:28.5em}
.ql-editor li.ql-direction-rtl{padding-right:1.5em}
.ql-editor li.ql-direction-rtl > .ql-ui:before{margin-left:.3em;margin-right:-1.5em;text-align:left}
.ql-editor table{table-layout:fixed;width:100%}
.ql-editor table td{outline:none}
.ql-editor .ql-code-block-container{font-family:monospace}
.ql-editor .ql-video{display:block;max-width:100%}
.ql-editor .ql-video.ql-align-center{margin:0 auto}
.ql-editor .ql-video.ql-align-right{margin:0 0 0 auto}
.ql-editor .ql-bg-black{background-color:#000}
.ql-editor .ql-bg-red{background-color:#e60000}
.ql-editor .ql-bg-orange{background-color:#f90}
.ql-editor .ql-bg-yellow{background-color:#ff0}
.ql-editor .ql-bg-green{background-color:#008a00}
.ql-editor .ql-bg-blue{background-color:#06c}
.ql-editor .ql-bg-purple{background-color:#93f}
.ql-editor .ql-color-white{color:#fff}
.ql-editor .ql-color-red{color:#e60000}
.ql-editor .ql-color-orange{color:#f90}
.ql-editor .ql-color-yellow{color:#ff0}
.ql-editor .ql-color-green{color:#008a00}
.ql-editor .ql-color-blue{color:#06c}
.ql-editor .ql-color-purple{color:#93f}
.ql-editor .ql-font-serif{font-family:Georgia,Times New Roman,serif}
.ql-editor .ql-font-monospace{font-family:Monaco,Courier New,monospace}
.ql-editor .ql-size-small{font-size:.75em}
.ql-editor .ql-size-large{font-size:1.5em}
.ql-editor .ql-size-huge{font-size:2.5em}
.ql-editor .ql-direction-rtl{direction:rtl;text-align:inherit}
.ql-editor .ql-align-center{text-align:center}
.ql-editor .ql-align-justify{text-align:justify}
.ql-editor .ql-align-right{text-align:right}
.ql-editor .ql-ui{position:absolute}
.ql-editor.ql-blank::before{color:rgba(0,0,0,0.6);content:attr(data-placeholder);font-style:italic;left:15px;pointer-events:none;position:absolute;right:15px}
.ql-snow.ql-toolbar:after,.ql-snow .ql-toolbar:after{clear:both;content:'';display:table}
.ql-snow.ql-toolbar button,.ql-snow .ql-toolbar button{background:none;border:none;cursor:pointer;display:inline-block;float:left;height:24px;padding:3px 5px;width:28px}
.ql-snow.ql-toolbar button svg,.ql-snow .ql-toolbar button svg{float:left;height:100%}
.ql-snow.ql-toolbar button:active:hover,.ql-snow .ql-toolbar button:active:hover{outline:none}
.ql-snow.ql-toolbar input.ql-image[type=file],.ql-snow .ql-toolbar input.ql-image[type=file]{display:none}
.ql-snow.ql-toolbar button:hover,.ql-snow .ql-toolbar button:hover,.ql-snow.ql-toolbar button:focus,.ql-snow .ql-toolbar button:focus,.ql-snow.ql-toolbar button.ql-active,.ql-snow .ql-toolbar button.ql-active,.ql-snow.ql-toolbar .ql-picker-label:hover,.ql-snow .ql-toolbar .ql-picker-label:hover,.ql-snow.ql-toolbar .ql-picker-label.ql-active,.ql-snow .ql-toolbar .ql-picker-label.ql-active,.ql-snow.ql-toolbar .ql-picker-item:hover,.ql-snow .ql-toolbar .ql-picker-item:hover,.ql-snow.ql-toolbar .ql-picker-item.ql-selected,.ql-snow .ql-toolbar .ql-picker-item.ql-selected{color:#06c}
.ql-snow.ql-toolbar button:hover .ql-fill,.ql-snow .ql-toolbar button:hover .ql-fill,.ql-snow.ql-toolbar button:focus .ql-fill,.ql-snow .ql-toolbar button:focus .ql-fill,.ql-snow.ql-toolbar button.ql-active .ql-fill,.ql-snow .ql-toolbar button.ql-active .ql-fill,.ql-snow.ql-toolbar .ql-picker-label:hover .ql-fill,.ql-snow .ql-toolbar .ql-picker-label:hover .ql-fill,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-fill,.ql-snow.ql-toolbar .ql-picker-item:hover .ql-fill,.ql-snow .ql-toolbar .ql-picker-item:hover .ql-fill,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-fill,.ql-snow.ql-toolbar button:hover .ql-stroke.ql-fill,.ql-snow .ql-toolbar button:hover .ql-stroke.ql-fill,.ql-snow.ql-toolbar button:focus .ql-stroke.ql-fill,.ql-snow .ql-toolbar button:focus .ql-stroke.ql-fill,.ql-snow.ql-toolbar button.ql-active .ql-stroke.ql-fill,.ql-snow .ql-toolbar button.ql-active .ql-stroke.ql-fill,.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill{fill:#06c}
.ql-snow.ql-toolbar button:hover .ql-stroke,.ql-snow .ql-toolbar button:hover .ql-stroke,.ql-snow.ql-toolbar button:focus .ql-stroke,.ql-snow .ql-toolbar button:focus .ql-stroke,.ql-snow.ql-toolbar button.ql-active .ql-stroke,.ql-snow .ql-toolbar button.ql-active .ql-stroke,.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke,.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke,.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke,.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,.ql-snow.ql-toolbar button:hover .ql-stroke-miter,.ql-snow .ql-toolbar button:hover .ql-stroke-miter,.ql-snow.ql-toolbar button:focus .ql-stroke-miter,.ql-snow .ql-toolbar button:focus .ql-stroke-miter,.ql-snow.ql-toolbar button.ql-active .ql-stroke-miter,.ql-snow .ql-toolbar button.ql-active .ql-stroke-miter,.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-miter,.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter{stroke:#06c}
@media (pointer:coarse){.ql-snow.ql-toolbar button:hover:not(.ql-active),.ql-snow .ql-toolbar button:hover:not(.ql-active){color:#444}.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-fill,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-fill,.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill{fill:#444}.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke,.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter{stroke:#444}}
.ql-snow{box-sizing:border-box}
.ql-snow *{box-sizing:border-box}
.ql-snow .ql-hidden{display:none}
.ql-snow .ql-out-bottom,.ql-snow .ql-out-top{visibility:hidden}
.ql-snow .ql-tooltip{position:absolute;transform:translateY(10px)}
.ql-snow .ql-tooltip a{cursor:pointer;text-decoration:none}
.ql-snow .ql-tooltip.ql-flip{transform:translateY(-10px)}
.ql-snow .ql-formats{display:inline-block;vertical-align:middle}
.ql-snow .ql-formats:after{clear:both;content:'';display:table}
.ql-snow .ql-stroke{fill:none;stroke:#444;stroke-linecap:round;stroke-linejoin:round;stroke-width:2}
.ql-snow .ql-stroke-miter{fill:none;stroke:#444;stroke-miterlimit:10;stroke-width:2}
.ql-snow .ql-fill,.ql-snow .ql-stroke.ql-fill{fill:#444}
.ql-snow .ql-empty{fill:none}
.ql-snow .ql-even{fill-rule:evenodd}
.ql-snow .ql-thin,.ql-snow .ql-stroke.ql-thin{stroke-width:1}
.ql-snow .ql-transparent{opacity:.4}
.ql-snow .ql-direction svg:last-child{display:none}
.ql-snow .ql-direction.ql-active svg:last-child{display:inline}
.ql-snow .ql-direction.ql-active svg:first-child{display:none}
.ql-snow .ql-editor h1{font-size:2em}
.ql-snow .ql-editor h2{font-size:1.5em}
.ql-snow .ql-editor h3{font-size:1.17em}
.ql-snow .ql-editor h4{font-size:1em}
.ql-snow .ql-editor h5{font-size:.83em}
.ql-snow .ql-editor h6{font-size:.67em}
.ql-snow .ql-editor a{text-decoration:underline}
.ql-snow .ql-editor blockquote{border-left:4px solid #ccc;margin-bottom:5px;margin-top:5px;padding-left:16px}
.ql-snow .ql-editor code,.ql-snow .ql-editor .ql-code-block-container{background-color:#f0f0f0;border-radius:3px}
.ql-snow .ql-editor .ql-code-block-container{margin-bottom:5px;margin-top:5px;padding:5px 10px}
.ql-snow .ql-editor code{font-size:85%;padding:2px 4px}
.ql-snow .ql-editor .ql-code-block-container{background-color:#23241f;color:#f8f8f2;overflow:visible}
.ql-snow .ql-editor img{max-width:100%}
.ql-snow .ql-picker{color:#444;display:inline-block;float:left;font-size:14px;font-weight:500;height:24px;position:relative;vertical-align:middle}
.ql-snow .ql-picker-label{cursor:pointer;display:inline-block;height:100%;padding-left:8px;padding-right:2px;position:relative;width:100%}
.ql-snow .ql-picker-label::before{display:inline-block;line-height:22px}
.ql-snow .ql-picker-options{background-color:#fff;display:none;min-width:100%;padding:4px 8px;position:absolute;white-space:nowrap}
.ql-snow .ql-picker-options .ql-picker-item{cursor:pointer;display:block;padding-bottom:5px;padding-top:5px}
.ql-snow .ql-picker.ql-expanded .ql-picker-label{color:#ccc;z-index:2}
.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-fill{fill:#ccc}
.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke{stroke:#ccc}
.ql-snow .ql-picker.ql-expanded .ql-picker-options{display:block;margin-top:-1px;top:100%;z-index:1}
.ql-snow .ql-color-picker,.ql-snow .ql-icon-picker{width:28px}
.ql-snow .ql-color-picker .ql-picker-label,.ql-snow .ql-icon-picker .ql-picker-label{padding:2px 4px}
.ql-snow .ql-color-picker .ql-picker-label svg,.ql-snow .ql-icon-picker .ql-picker-label svg{right:4px}
.ql-snow .ql-icon-picker .ql-picker-options{padding:4px 0}
.ql-snow .ql-icon-picker .ql-picker-item{height:24px;width:24px;padding:2px 4px}
.ql-snow .ql-color-picker .ql-picker-options{padding:3px 5px;width:152px}
.ql-snow .ql-color-picker .ql-picker-item{border:1px solid transparent;float:left;height:16px;margin:2px;padding:0;width:16px}
.ql-snow .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg{position:absolute;margin-top:-9px;right:0;top:50%;width:18px}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-label]:not([data-label=''])::before,.ql-snow .ql-picker.ql-font .ql-picker-label[data-label]:not([data-label=''])::before,.ql-snow .ql-picker.ql-size .ql-picker-label[data-label]:not([data-label=''])::before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-label]:not([data-label=''])::before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-label]:not([data-label=''])::before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-label]:not([data-label=''])::before{content:attr(data-label)}
.ql-snow .ql-picker.ql-header{width:98px}
.ql-snow .ql-picker.ql-header .ql-picker-label::before,.ql-snow .ql-picker.ql-header .ql-picker-item::before{content:'Normal'}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]::before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before{content:'Heading 1'}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]::before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before{content:'Heading 2'}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]::before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before{content:'Heading 3'}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]::before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before{content:'Heading 4'}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]::before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before{content:'Heading 5'}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]::before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before{content:'Heading 6'}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before{font-size:2em}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before{font-size:1.5em}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before{font-size:1.17em}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before{font-size:1em}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before{font-size:.83em}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before{font-size:.67em}
.ql-snow .ql-picker.ql-font{width:108px}
.ql-snow .ql-picker.ql-font .ql-picker-label::before,.ql-snow .ql-picker.ql-font .ql-picker-item::before{content:'Sans Serif'}
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=serif]::before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]::before{content:'Serif'}
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=monospace]::before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before{content:'Monospace'}
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]::before{font-family:Georgia,Times New Roman,serif}
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before{font-family:Monaco,Courier New,monospace}
.ql-snow .ql-picker.ql-size{width:98px}
.ql-snow .ql-picker.ql-size .ql-picker-label::before,.ql-snow .ql-picker.ql-size .ql-picker-item::before{content:'Normal'}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=small]::before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]::before{content:'Small'}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=large]::before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]::before{content:'Large'}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=huge]::before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]::before{content:'Huge'}
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]::before{font-size:10px}
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]::before{font-size:18px}
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]::before{font-size:32px}
.ql-snow .ql-color-picker.ql-background .ql-picker-item{background-color:#fff}
.ql-snow .ql-color-picker.ql-color .ql-picker-item{background-color:#000}
.ql-code-block-container{position:relative}
.ql-code-block-container .ql-ui{right:5px;top:5px}
.ql-toolbar.ql-snow{border:1px solid #ccc;box-sizing:border-box;font-family:'Helvetica Neue','Helvetica','Arial',sans-serif;padding:8px}
.ql-toolbar.ql-snow .ql-formats{margin-right:15px}
.ql-toolbar.ql-snow .ql-picker-label{border:1px solid transparent}
.ql-toolbar.ql-snow .ql-picker-options{border:1px solid transparent;box-shadow:rgba(0,0,0,0.2) 0 2px 8px}
.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label{border-color:#ccc}
.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options{border-color:#ccc}
.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item.ql-selected,.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item:hover{border-color:#000}
.ql-toolbar.ql-snow + .ql-container.ql-snow{border-top:0}
.ql-snow .ql-tooltip{background-color:#fff;border:1px solid #ccc;box-shadow:0 0 5px #ddd;color:#444;padding:5px 12px;white-space:nowrap}
.ql-snow .ql-tooltip::before{content:"Visit URL:";line-height:26px;margin-right:8px}
.ql-snow .ql-tooltip input[type=text]{display:none;border:1px solid #ccc;font-size:13px;height:26px;margin:0;padding:3px 5px;width:170px}
.ql-snow .ql-tooltip a.ql-preview{display:inline-block;max-width:200px;overflow-x:hidden;text-overflow:ellipsis;vertical-align:top}
.ql-snow .ql-tooltip a.ql-action::after{border-right:1px solid #ccc;content:'Edit';margin-left:16px;padding-right:8px}
.ql-snow .ql-tooltip a.ql-remove::before{content:'Remove';margin-left:8px}
.ql-snow .ql-tooltip a{line-height:26px}
.ql-snow .ql-tooltip.ql-editing a.ql-preview,.ql-snow .ql-tooltip.ql-editing a.ql-remove{display:none}
.ql-snow .ql-tooltip.ql-editing input[type=text]{display:inline-block}
.ql-snow .ql-tooltip.ql-editing a.ql-action::after{border-right:0;content:'Save';padding-right:0}
.ql-snow .ql-tooltip[data-mode=link]::before{content:"Enter link:"}
.ql-snow .ql-tooltip[data-mode=formula]::before{content:"Enter formula:"}
.ql-snow .ql-tooltip[data-mode=video]::before{content:"Enter video:"}
.ql-snow a{color:#06c}
.ql-container.ql-snow{border:1px solid #ccc}
@keyframes fadeInFromNone {
  0% {
    display: none;
    opacity: 0;
  }

  1% {
    display: block;
    opacity: 0;
  }

  100% {
    display: block;
    opacity: 1;
  }
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes slideUp {
  0% {
    transform: translateY(0.5rem);
  }
  100% {
    transform: translateY(0rem);
  }
}
@keyframes slideDown {
  0% {
    transform: translateY(0rem);
  }
  100% {
    transform: translateY(-0.5rem);
  }
}
@keyframes slideIn {
  0% {
    transform: translateX(100%);
  }
  100% {
    transform: translateX(0%);
  }
}
@keyframes slideOut {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(120%);
  }
}
@keyframes rotate {
  100% {
    transform: rotate(360deg);
  }
}
@keyframes dash {
  0% {
    stroke-dasharray: 1, 200;
    stroke-dashoffset: 0;
  }
  50% {
    stroke-dasharray: 89, 200;
    stroke-dashoffset: -2.1875rem;
  }
  100% {
    stroke-dasharray: 89, 200;
    stroke-dashoffset: -7.75rem;
  }
}
@keyframes sidebarItemExpand {
  from {
    height: 0;
  }
  to {
    height: 3rem;
  }
}
@keyframes sidebarItemShow {
  from {
    transform: translateY(0.1rem);
    opacity: 0;
  }
  to {
    transform: translateY(0rem);
    opacity: 1;
  }
}
body {
  --dm-color-primary: #2c4fc3;
  --dm-shade-primary-600: #2543a6;
  --dm-color-primary-800: #1d337f;
  --dm-color-primary-1000: #142458;
  --dm-color-primary-2: #2d479e;
  --dm-color-primary-3: #2a59f5;
  --dm-color-primary-4: #f2f7fe;
  --dm-color-secondary: #e77722;
  --dm-color-neu: #596283;
  --dm-shade-neu-600: #4c536f;

  --dm-color-category-1: #169de0;
  --dm-color-category-2: #5654bf;
  --dm-color-category-3: #009e9c;
  --dm-color-category-4: #84329b;
  --dm-color-category-5: #1da858;
  --dm-color-category-6: #db4242;
  --dm-color-category-6-600: #e03131;
  --dm-color-category-7: #edbc47;
  --dm-color-category-7-5: #fdf8ed;
  --dm-color-category-8: #7e8084;

  --dm-color-static: #ffffff;

  --dm-shade-1-static: #20212;
  --dm-shade-5-static: #ced0da;

  --dm-admin-shade-1: #23262f;
  --dm-admin-shade-2: #11151f;
  --dm-admin-shade-3: #00132a;
  --dm-admin-shade-4: #000f21;

  --dm-color-website-section-1: #fffbd7;
  --dm-color-website-section-2: #eb5757;

  &.light {
    --dm-shade-1: #202124;
    --dm-shade-2: #3e3f42;
    --dm-shade-3: #646569;
    --dm-shade-4: #9ea0a5;
    --dm-shade-5: #ced0da;
    --dm-shade-6: #eaedf3;
    --dm-shade-6-600: #dee1e7;
    --dm-shade-7: #f6f9fd;
    --dm-shade-8: #ffffff;
    --dm-shade-9: #f3f3f6;
    --dm-shade-10: #fcfcfd;

    --dm-box-shadow: #f1f2f5;

    --dm-bg-color: #fcfcfd;
    --dm-main-bg-color: #f8f8fa;
    --dm-color-background: #fafafb;
  }

  &.dark {
    --dm-color-primary-2: #181a26;

    --dm-shade-1: #dee4f3;
    --dm-shade-2: #c0c5d3;
    --dm-shade-3: #a1a5b4;
    --dm-shade-4: #7f8db0;
    --dm-shade-5: #4a5469;
    --dm-shade-6: #2e3544;
    --dm-shade-6-600: #222833;
    --dm-shade-7: #242730;
    --dm-shade-8: #20222b;
    --dm-shade-9: #262a35;
    --dm-shade-10: #21242e;

    --dm-box-shadow: #272a36;

    --dm-bg-color: #20222b;
    --dm-main-bg-color: #20222b;
    --dm-color-background: #232630;
  }
}
body {
  --dm-z-index-hidden: -1000;
  --dm-z-index-below: -1;
  --dm-z-index-element: 1;
  --dm-z-index-notification-view: 1;
  --dm-z-index-accent: 2;
  --dm-z-index-exit-fs-button: 4;
  --dm-z-index-wizard-footer: 5;
  --dm-z-index-sidebar-container: 20;
  --dm-z-index-preloader: 30;
  --dm-z-index-mode-label: 70;
  --dm-z-index-overlay: 99;
  --dm-z-index-modal: 100;
  --dm-z-index-global-alerts: 150;
  --dm-z-index-menu-overlay: 199;
  --dm-z-index-menu: 200;
  --dm-z-index-dropdown: 200;
  --dm-z-index-tooltip: 210;
}
body {
  margin: 0;
  padding: 0;
  background: var(--dm-main-bg-color);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

  @supports not selector(::-webkit-scrollbar) {
    .dm-scrollbar {
      scrollbar-color: var(--dm-shade-5) color-mix(in srgb, var(--dm-shade-8) 24%, transparent);
      scrollbar-width: thin;
    }
  }

  ::-webkit-scrollbar {
    width: 0.5rem;
    height: 0.75rem;
  }

  ::-webkit-scrollbar:horizontal {
    height: 0.375rem;
    background-color: var(--dm-shade-8);
    border-left: 1px solid var(--dm-shade-6);
    border-right: 1px solid var(--dm-shade-6);
  }

  ::-webkit-scrollbar-track {
    background: color-mix(in srgb, var(--dm-shade-8) 24%, transparent);
  }

  ::-webkit-scrollbar-thumb {
    background: var(--dm-shade-5);
  }
}
.reset-list-mixin {
  margin: 0;
  padding: 0;
  list-style: none;
}
.reset-button-mixin {
  font-family: inherit;
  padding: 0;
  color: inherit;
  cursor: pointer;
  border: none;
  opacity: inherit;
  background: none;
  pointer-events: inherit;
  &:focus {
    outline: none;
  }
}
.button-base-mixin {
  cursor: pointer;
  border: none;
  opacity: inherit;
  background: none;
  pointer-events: inherit;

  height: 2.5rem;
  padding: 0 2.75rem;
  color: var(--dm-shade-8);
  border-radius: 0.25rem;
  font-size: 1rem;
  font-family: "proxima-nova", sans-serif;
  &:focus {
    outline: none;
  }

  span {
    font-size: 0.9375rem;
  }
  img {
    margin-right: 0.75rem;
  }
}
.primary-btn {
  cursor: pointer;
  border: none;
  opacity: inherit;
  background: none;
  pointer-events: inherit;
  height: 2.5rem;
  padding: 0 2.75rem;
  color: var(--dm-shade-8);
  border-radius: 0.25rem;
  font-size: 1rem;
  font-family: "proxima-nova", sans-serif;
  &:focus {
    outline: none;
  }

  span {
    font-size: 0.9375rem;
  }
  img {
    margin-right: 0.75rem;
  }
  background: var(--dm-color-primary);
}
.secondary-btn {
  cursor: pointer;
  border: none;
  opacity: inherit;
  background: none;
  pointer-events: inherit;
  height: 2.5rem;
  padding: 0 2.75rem;
  border-radius: 0.25rem;
  font-size: 1rem;
  font-family: "proxima-nova", sans-serif;
  &:focus {
    outline: none;
  }

  span {
    font-size: 0.9375rem;
  }
  img {
    margin-right: 0.75rem;
  }
  background: color-mix(in srgb, var(--dm-shade-6) 70%, transparent);
  color: var(--dm-shade-3);
}
.primary-btn.with-icon {
  display: flex;
  align-items: center;
  padding: 0 1.875rem 0 1rem;
}
.txt-btn {
  font-family: inherit;
  cursor: pointer;
  border: none;
  opacity: inherit;
  background: none;
  pointer-events: inherit;
  color: var(--dm-shade-4);
  padding: 0;
  &:focus {
    outline: none;
  }
}
.icn-txt-btn {
  font-family: inherit;
  cursor: pointer;
  border: none;
  opacity: inherit;
  background: none;
  pointer-events: inherit;
  font-size: 0.8125rem;
  color: var(--dm-shade-3);
  padding: 0;
  display: flex;
  align-items: center;
  text-decoration: none;
  &:focus {
    outline: none;
  }
  .icon {
    margin-right: 0.5rem;
  }
}
button {
  font-family: inherit;
  padding: 0;
  color: inherit;
  cursor: pointer;
  border: none;
  opacity: inherit;
  background: none;
  pointer-events: inherit;
  &:focus {
    outline: none;
  }
}
button img {
  display: flex;
}
a {
  color: inherit;
}
input:focus {
  outline: none;
}
*[disabled],
*[clickDisabled] {
  pointer-events: none !important;
  cursor: default !important;
}
.marker-defs {
  position: absolute;
  z-index: var(--dm-z-index-hidden);
}
.link-style {
  cursor: pointer;
  border-bottom: 1px dashed color-mix(in srgb, var(--dm-color-primary) 50%, transparent);
}
*[hidden] {
  display: none !important;
  pointer-events: none !important;
}
.status-label {
  font-weight: 500;
  font-size: 0.875rem;
  line-height: 1.375rem;
  color: var(--dm-shade-4);
}
.primary-btn {
  font-weight: 600;
}
.form-element-frame-mixin {
  height: 2.5rem;
  background: var(--dm-shade-8);
  border: 1px solid var(--dm-shade-5);
  box-sizing: border-box;
  border-radius: 0.25rem;
  &:focus-within {
    border-color: var(--dm-color-primary);
  }
}
.checkbox-mixin {
  width: 1rem;
  height: 1rem;
  position: relative;
  font-size: 1rem;
  margin: 0;
  cursor: pointer;
  outline: none;
  -moz-appearance: initial;
  visibility: hidden;

  :disabled {
    cursor: default;
  }

  &:after {
    content: url(/images/checkbox-unchecked.svg);
    display: inline-block;
    width: 1rem;
    height: 1rem;
    opacity: 1;
    visibility: visible;
  }

  &:checked:after {
    content: url(/images/checkbox-checked.svg);
    visibility: visible;
  }

  &:not(:checked):disabled:after {
    content: url(/images/checkbox-unchecked-disabled.svg);
    visibility: visible;
  }

  &:checked:disabled:after {
    content: url(/images/checkbox-checked-disabled.svg);
    visibility: visible;
  }

  &[indeterminate]:disabled:after {
    content: url(/images/checkbox-indeterminate-disabled.svg);
    visibility: visible;
  }

  &[indeterminate]:after {
    content: url(/images/checkbox-indeterminate.svg);
    visibility: visible;
  }
}
.radio-mixin {
  width: 1rem;
  height: 1rem;
  position: relative;
  font-size: 1rem;
  margin: 0;
  cursor: pointer;
  outline: none;
  -moz-appearance: initial;
  visibility: hidden;

  :disabled {
    cursor: default;
  }

  &:after {
    content: url(/images/radio-off.svg);
    display: inline-block;
    width: 1rem;
    height: 1rem;
    opacity: 1;
    visibility: visible;
  }

  &:checked:after {
    content: url(/images/radio-on.svg);
    visibility: visible;
  }

  &:not(:checked):disabled:after {
    content: url(/images/radio-off-disabled.svg);
    visibility: visible;
  }

  &:checked:disabled:after {
    content: url(/images/radio-on-disabled.svg);
    visibility: visible;
  }
}
/*used by multiselect and multi input select .selected-items-holder*/
.selected-items-multi-mixin {
  width: 100%;
  overflow: hidden;
  position: relative;
  z-index: var(--dm-z-index-accent);
  pointer-events: none;
  display: flex;
  align-items: center;
  gap: 0.5rem;

  .selected-items-line {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
  }

  .selected-item {
    cursor: default;
    pointer-events: all;
    width: auto;
    background: var(--dm-shade-6);
    color: var(--dm-shade-2);
    font-size: 0.75rem;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    text-transform: uppercase;
    border-radius: 0.225rem;
    padding: 0rem 0.225rem;

    word-break: break-all;

    img {
      cursor: pointer;
      margin-left: 0.225rem;

      &:hover {
        transform: scale(1.4);
      }
    }
  }
}
.actions-button {
  cursor: pointer;
}
.sort-control-2 {
  display: grid;
  width: 9rem;
  grid-template-columns: 1fr 1rem;
  .control-display {
    span {
      font-size: 0.875rem;
    }
    .label {
      color: var(--dm-shade-4);
    }
    .selected-option {
      color: var(--dm-shade-2);
    }
  }
}
.select-control.no-frame {
  label {
    display: none;
  }

  .select-button {
    height: 2rem;
    background: none;
    border: none;
    grid-gap: 0.625rem;
    white-space: nowrap;
    padding: 0;

    .placeholder-text {
      font-size: 0.8125rem;
      font-weight: 600;
      color: var(--dm-shade-4);
    }
  }
}
.round-btn {
  cursor: pointer;
  opacity: inherit;
  background: none;
  pointer-events: inherit;
  &:focus {
    outline: none;
  }
  font-size: 1rem;
  font-family: "proxima-nova", sans-serif;

  span {
    font-size: 0.9375rem;
  }
  img {
    margin-right: 0.75rem;
  }
  border-radius: 1rem;
  height: 2rem;
  border: 1px solid var(--dm-shade-5);
  color: var(--dm-shade-4);
  font-weight: 600;
  width: auto;
  padding: 0 1.5rem;
  white-space: nowrap;
  span {
    font-size: 0.8125rem;
  }
  &.active {
    color: var(--dm-color-static);
    background: color-mix(in srgb, var(--dm-color-neu) 70%, transparent);
    border: none;
  }

  &[disabled] {
    background: linear-gradient(0deg, rgba(100, 101, 105, 0.07), rgba(100, 101, 105, 0.07));
    border: 1px solid var(--dm-shade-6);
    color: var(--dm-shade-5);
  }
}
.tab-menu {
  margin: 0;
  list-style: none;
  display: flex;
  align-items: center;
  height: 100%;
  padding: 0 0.5rem;
  li {
    box-sizing: border-box;
    cursor: pointer;
    display: flex;
    align-items: center;
    margin: 0 1rem;
    height: 100%;
    color: var(--dm-shade-3);
    border-bottom: 3px solid transparent;
    span {
      position: relative;
      top: 0.1rem;
      text-transform: uppercase;
      font-size: 0.75rem;
    }
    &.active {
      color: var(--dm-color-primary);
      border-bottom: 3px solid var(--dm-color-primary);
    }
  }
}
body {
  font-family: "proxima-nova", sans-serif;
}
h2 {
  margin: 0;
  font-size: 1.25rem;
  line-height: 1.875rem;
  font-weight: 500;
  color: var(--dm-shade-3);
  display: inline-block;
}
h4 {
  margin: 0;
  color: var(--dm-shade-1);
  font-size: 1rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.875rem;
  letter-spacing: 0.2px;
}
:root {
  --dm-sidebar-width: 15.625rem;
}
.dm-view-layout {
  display: grid;
  grid-template-columns: auto 1fr;
  height: 100vh;

  .component-container {
    display: grid;
    grid-template-rows: auto 1fr;
    height: 100vh;
    position: relative;

    > *:not(div) {
      display: contents;
    }
  }

  .sidebar-container {
    z-index: var(--dm-z-index-sidebar-container);
    height: 100vh;
  }

  #main-viewport {
    overflow: auto;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    padding: 2rem;

    > dm-preloader {
      display: block;
      width: 2rem;
    }
  }
}
dm-adex-file-info-status {
  dm-table-simple {
    display: grid;
    grid-template-rows: 1fr auto;
    overflow: auto;
    width: 100%;
    height: 100%;
    box-sizing: border-box;

    .table-container {
      height: 100%;
      overflow: hidden;

      .dm-table {
        height: 100%;
        overflow: hidden;
      }

      thead tr {
        border-top: 1px solid var(--dm-shade-6);
      }

      thead th:nth-child(2) {
        border-right: none;
      }

      tr {
        border-right: 1px solid var(--dm-shade-6);
      }

      .dm-table tr {
        grid-auto-flow: column;
        grid-template-columns: 3fr repeat(3, 1fr) 0.75fr 0.25fr;
      }
    }
  }
}
.adex-ruleset {
  #main-viewport {
    display: grid;
    grid-template-rows: max-content;
    gap: 0.5rem;
    padding-bottom: 0.5rem !important;
  }

  .adex-ruleset__short-description {
    box-sizing: border-box;
    width: 100%;
    background: var(--dm-shade-6);
    border: 1px solid var(--dm-shade-6);
    border-radius: 0.25rem;

    padding: 1rem;
    color: var(--dm-shade-1);
    font-size: 0.8rem;
    line-height: 130%;
  }

  .adex-ruleset__table {
    display: grid;
    grid-template-rows: 1fr auto;
    overflow: auto;
    width: 100%;
    height: 100%;
    box-sizing: border-box;

    .table-container {
      height: 100%;
      overflow: hidden;

      .dm-table {
        height: 100%;
        overflow: hidden;
      }
    }
  }
}
dm-modal-adex-ruleset {
  .form {
    display: flex;
    flex-flow: column;
    gap: 1.5rem;
  }

  .modal__content {
    min-height: 12rem;
  }
}
dm-advanced-targets {
  #main-viewport {
    display: grid;
    grid-template-rows: 1fr auto;
    padding-bottom: 0.5rem !important;
  }

  .table-container {
    height: 100%;
    overflow: hidden;
  }
}
.dm-table.advanced-targets-table {
  height: 100%;
  tr {
    display: grid;
    grid-template-columns: 1fr 4rem;
    td.col1 {
      padding: 0 1rem;
      .drag-icon {
        margin-right: 0.5rem;
        pointer-events: none;
      }
    }
  }
  .at-item {
  }
  tbody tr.target-row:hover {
    background: none;
  }

  .target-row td.col1 {
    padding-left: 2.2rem;
  }

  .folder-row {
    cursor: pointer;
    background:
      linear-gradient(0deg, rgba(206, 208, 218, 0.05), rgba(206, 208, 218, 0.05)),
      linear-gradient(180deg, rgba(245, 245, 245, 0) 0%, var(--dm-shade-8) 100%);
    box-shadow:
      inset 0 -0.0625rem 0 var(--dm-shade-6),
      inset -0.0625rem 0 0 var(--dm-shade-6),
      inset 0.0625rem 0 0 var(--dm-shade-6);

    &:hover {
      background: var(--dm-shade-6);
    }

    td.col1 {
      padding: 0 0.5rem;
    }

    .expand-control {
      height: 1rem;
      width: 1rem;
      object-fit: scale-down;
      object-position: center;
      margin-right: 0.25rem;
    }
    span {
      font-size: 0.8125rem;
      font-weight: 500;
      color: var(--dm-shade-1);
    }
  }

  .list-item {
    justify-items: left;
  }
}
.modal-container .modal.at-folder-modal {
  width: 50rem;
  .modal-header {
    display: grid;
    gap: 1.5rem;
    padding: 1rem 1.5rem;
    grid-template-columns: auto 1fr auto;

    h3 {
      white-space: nowrap;
    }

    .form-element.text-input {
      position: relative;
      label {
        position: absolute;
        top: 0.65rem;
        left: 0.75rem;
        span {
          text-transform: none;
          font-size: 0.875rem;
          color: var(--dm-shade-4);
        }
      }
      input {
        padding-left: 4.2rem;
        height: 2.86rem;
        font-size: 0.875rem;
      }
    }

    .dm-search {
      margin-left: auto;
    }
    dm-button {
      white-space: nowrap;
    }
  }

  .modal-content {
    background: var(--dm-shade-8);
    padding: 1.5rem 2rem 0 2rem;

    .empty-folder {
      width: 100%;
      height: 100%;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      p {
        color: color-mix(in srgb, var(--dm-shade-2) 60%, transparent);
        font-size: 1.375rem;
        padding-bottom: 1.5rem;
      }
    }

    .table-container {
      height: 100%;
      overflow: hidden;
      box-sizing: border-box;
      border-top: 1px solid var(--dm-shade-6);
      tbody {
        box-sizing: border-box;
        border-right: 1px solid var(--dm-shade-6);
        position: relative;
      }

      .drop-cursor {
        position: absolute;
        width: 100%;
        height: 0.0625rem;
        background: var(--dm-color-primary);
        top: 0;
        left: 0;
      }

      &.drag-disabled .list-item .drag-icn {
        opacity: 0.3;
      }
    }
  }

  .modal-footer {
    gap: 1.5rem;
  }
}
.modal-container .modal.at-folder-popup {
  width: 34rem;
  .modal-content {
    min-height: auto;
    padding: 1rem 3rem 3rem 3rem;
  }
}
dm-global-alerts {
  position: absolute;
  z-index: var(--dm-z-index-global-alerts);
  width: calc(100% - var(--dm-sidebar-width));
  bottom: 1.25rem;
  pointer-events: none;
  margin-left: var(--dm-sidebar-width);

  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;

  .alert-container {
    transition: margin-bottom 0.3s;

    &:not(:last-of-type) {
      margin-bottom: 1.2rem;
      transition: margin-bottom 0.3s;
    }

    dm-alert {
      pointer-events: auto;
    }
  }
}
dm-alert {
  max-width: 47.5rem;
}
dm-alert,
dm-alert-layout-bound {
  display: flex;
  justify-content: center;
  align-items: center;

  .alert {
    background: var(--dm-color-category-5);
    padding: 0.5rem 2rem;
    border-radius: 1rem;
    position: relative;
    top: 1rem;
    opacity: 0;
    transition:
      top 0.3s,
      opacity 0.3s;
    display: flex;
    align-items: center;
    gap: 1.5rem;

    &[visible] {
      top: 0;
      opacity: 1;
    }
  }

  .alert__message {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 1.5rem;
    gap: 1rem;

    font-weight: 600;
    font-size: 0.9375rem;
    color: var(--dm-shade-8);

    a {
      text-decoration: underline;
      cursor: pointer;
    }
  }

  .alert__message--warning {
    color: var(--dm-shade-2);
  }

  .alert__message--general {
    color: var(--dm-shade-1);
  }

  .alert__message--secondary {
    color: var(--dm-shade-1);
  }

  .alert__close {
    cursor: pointer;
  }

  .alert__close--warning {
    filter: brightness(2);
  }

  .alert__close--info {
    filter: brightness(10);
  }

  .alert__button {
    font-size: 0.9375em;
    font-weight: 600;
    color: var(--dm-shade-8);
  }

  .alert__button--warning {
    color: var(--dm-shade-2);
  }

  .alert__separator {
    height: 1.5rem;
    border-left: 1px solid color-mix(in srgb, var(--dm-shade-2) 30%, transparent);
  }

  .alert__separator--success {
    height: 1.5rem;
    border-left: 1px solid color-mix(in srgb, var(--dm-shade-8) 30%, transparent);
  }

  .alert__separator--info {
    height: 1.5rem;
    border-left: 1px solid color-mix(in srgb, var(--dm-shade-3) 30%, transparent);
  }

  .alert--warning {
    background: var(--dm-color-category-7);
  }

  .alert--danger {
    background: var(--dm-color-category-6);
  }

  .alert--secondary {
    background: var(--dm-shade-6);
  }

  .alert--info {
    background: var(--dm-color-neu);
  }

  .alert--general {
    background: color-mix(in srgb, var(--dm-color-primary) 10%, transparent);
  }
}
dm-alert-layout-bound {
  margin-bottom: 1rem;

  .alert {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    border-radius: 0.25rem;
    padding: 0.875rem 1rem 1rem 1rem;

    &[noTitle] {
      padding-top: 1rem;
      padding-right: 0.75rem;

      .alert__header {
        position: absolute;
        right: 0.75rem;
      }

      .alert__message {
        margin-right: 1.875rem;
      }
    }
  }

  .alert__header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
  }

  .alert__title {
    font-weight: 600;
    line-height: 1.375rem;
    font-size: 0.938rem;
    padding: 0;
  }

  .alert__message {
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.375rem;
  }
}
.analytics-data-view {
  &.loading {
    pointer-events: none;
  }

  .filters-section {
    display: flex;
    gap: 2rem;
    padding: 0.5rem 2rem 1.5rem 2rem;

    .l-controls {
      display: flex;
      gap: 1rem 2rem;
      flex-flow: wrap;
      align-items: flex-end;
    }

    .form-element.select-control {
      .select-button .selected-item,
      .form-element.select-control .select-button .placeholder-text {
        font-size: 0.875rem;
      }
    }

    .form-element label span {
      color: var(--dm-shade-4);
    }

    .metric-filter {
      min-width: 14rem;
    }

    .device-filter {
      min-width: 9rem;
    }

    .unverified-limit-control {
      min-width: 7.5rem;
    }

    dm-datepicker {
      margin-left: auto;
      width: 14rem;
      min-width: 14rem;
      .standard-datepicker {
        input {
          height: 2.715rem;
          font-size: 0.875rem;
        }
        .icn {
          top: 0.45rem;
        }
      }
    }
  }

  #main-viewport {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    overflow: hidden !important;
    .inner-wrapper {
      overflow-y: auto;
      max-height: 100%;
      background: var(--dm-shade-8);
      border-radius: 0.25rem;
      border: 1px solid var(--dm-shade-6);

      dm-preloader {
        padding: 2rem 1rem;
      }

      .no-data {
        color: var(--dm-shade-1);
        padding: 1rem;
      }

      .analytics-info {
        height: 3.5rem;
        background: var(--dm-shade-8);
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 1rem;
        .l-cnt {
          display: flex;
          align-items: center;
          gap: 0.5rem;
          .metric-label {
            color: var(--dm-shade-2);
          }
          .date-range-info {
            font-size: 0.8125rem;
            color: var(--dm-shade-4);
            position: relative;
            top: 0.05rem;
          }
        }
        .r-cnt {
          display: flex;
          align-items: center;
          gap: 0.625rem;
          .form-element.switch {
            font-size: 0.7rem;
            span {
              color: var(--dm-shade-4);
              font-size: 1.156rem;
              margin-bottom: 0.31rem;
            }
          }

          .separator {
            height: 2rem;
            width: 0.0625rem;
            background: var(--dm-shade-6);
            margin: 0 0.375rem;
          }

          .dm-search {
            .sc {
              padding: 0.5rem 0.5rem;
              width: 2.5rem;
              height: 2rem;
              .clear-btn {
                width: 1rem;
                height: 1rem;
              }

              input {
                font-size: 0.875rem;
              }

              &.active {
                border: 1px solid var(--dm-color-primary);
                width: 17.5rem;
              }
              &.active .clear-btn {
                opacity: 0.9;
              }
            }
          }
        }
      }

      .dm-graph {
        margin-bottom: 3.4rem;
      }

      .no-graph-items-display {
        height: 30rem;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        p {
          margin-top: 1.5rem;
          color: var(--dm-shade-2);
          font-weight: 500;
          width: 15rem;
          line-height: 1.5rem;
        }
      }
    }

    .dm-table {
      tr th:last-child {
        grid-gap: 1rem;
      }
      .col1 .column-title {
        display: flex;
        align-items: center;
        gap: 1rem;
        .master-checkbox {
          display: block;
          height: 1.375rem;
          input[type="checkbox"] {
            pointer-events: none;
            top: 0.2rem;
            margin-right: 0.75rem;
          }
        }
      }

      .section-row {
        .col1 .icon-plus-label {
          padding-left: 2rem;
          dm-item-type {
            margin-right: 0.75rem;
          }
        }
      }

      dm-item-type {
        width: 1.5rem;
        height: 1rem;
        border-radius: 0.125rem;
        background: color-mix(in srgb, var(--dm-color-primary) 50%, transparent);
        display: flex;
        align-items: center;
        justify-content: center;

        color: var(--dm-shade-8);
        font-size: 0.5625rem;
        text-transform: uppercase;
        font-weight: bold;
      }

      .organization-group-item {
        height: 2rem;
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0 1rem;
        background:
          linear-gradient(0deg, rgba(206, 208, 218, 0.05), rgba(206, 208, 218, 0.05)),
          linear-gradient(180deg, rgba(245, 245, 245, 0) 0%, var(--dm-shade-8) 100%);
        box-shadow:
          inset 0 -0.0625rem 0 var(--dm-shade-6),
          inset 0.0625rem 0 0 var(--dm-shade-6);
        span {
          color: var(--dm-shade-1);
          font-size: 0.8125rem;
          font-weight: 500;
        }
      }

      .show-more-wrapper {
        display: flex;
        align-items: center;
        justify-content: center;
        background: var(--dm-shade-8);
        height: 3rem;
        overflow: hidden;
        border: 1px solid var(--dm-shade-6);
        border-top: none;
        cursor: pointer;

        &:hover {
          background: color-mix(in srgb, var(--dm-shade-6) 50%, transparent);
        }

        .icn-txt-btn {
          font-size: 0.875rem;
          color: var(--dm-shade-2);
          .icon {
            margin-right: auto;
            margin-left: 1rem;
          }
        }
      }
    }

    .dm-table.tags-analytics-table {
      tr {
        display: grid;
        grid-template-columns: 2fr repeat(3, 1fr);
      }
    }

    .dm-table.website-rank-table,
    .dm-table.website-summary-table {
      tr {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
      }
    }
    .dm-table.app-analytics {
      tr {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
      }
    }
  }
}
dm-dropdown-number-range-controls {
  .cover {
    background: rgba(32, 33, 36, 0.05);
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
  }
  .wrapper {
    width: 16rem;
    height: 16rem;
    background: var(--dm-shade-8);
    padding: 1rem;

    background: var(--dm-shade-8);
    border-radius: 0.25rem;
    box-sizing: border-box;

    .title {
      color: var(--dm-shade-2);
      font-size: 0.875rem;
      margin-bottom: 1rem;
    }

    .form-element {
      font-size: 0.795rem;
      margin-bottom: 1rem;
    }
    .popup-footer {
      display: grid;
      grid-template-columns: 1fr 1fr;
      grid-gap: 1rem;
      width: 100%;
      box-sizing: border-box;
      overflow: hidden;
      padding-top: 0.75rem;
      button {
        width: 100%;
        padding: initial;
        font-size: 0.75rem;
      }
    }
  }
}
dm-anomaly-analytics {
  #main-viewport {
    padding: 1.3125rem 8.75rem 0 8.75rem !important;
  }

  .anomaly-header {
    width: 56rem;
    margin: 0 auto;
  }

  .anomaly-header__title {
    font-size: 1rem;
    line-height: 1.875rem;
    letter-spacing: 0.2px;
    color: var(--dm-shade-1);
  }

  .anomaly-content {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    width: 56rem;
    margin: 0 auto;
    padding-top: 1.5rem;

    a {
      color: var(--dm-color-primary);
    }

    .form-holder {
      display: flex;
      flex-direction: column;
      gap: 1.5rem;
      width: 26.25rem;
    }

    .radio-label {
      font-weight: 600;
      font-size: 0.75rem;
      line-height: 1.25rem;
      letter-spacing: 0.5px;
      text-transform: uppercase;
      color: var(--dm-shade-3);
      mix-blend-mode: normal;
    }

    .group {
      margin-top: 1.125rem;
      font-weight: 400;
      font-size: 0.9375rem;
      line-height: 1.5rem;
      color: var(--dm-shade-3);
      padding-bottom: 0.75rem;
    }
  }

  .info-text {
    color: var(--dm-shade-3);
    font-weight: 400;
    font-size: 0.9375rem;
    line-height: 1.5rem;
  }
}
dm-apps {
  #main-viewport {
    display: grid;
    grid-template-rows: 1fr auto;
    padding-bottom: 0.5rem !important;
  }

  .apps-table {
    display: grid;
    grid-template-rows: 1fr auto;
    overflow: auto;
    width: 100%;
    height: 100%;
    box-sizing: border-box;

    .table-container {
      height: 100%;
      overflow: hidden;

      .dm-table {
        height: 100%;
        overflow: hidden;
      }
    }
  }

  .apps-table_apps-name-column {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-left: 0.25rem;
  }

  .apps-table_apps-name-column__icon {
    height: 1rem;
    width: 1rem;
  }

  .apps-table_apps-name-column__name {
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .apps-table_organization-name-column {
    display: flex;
    align-items: center;
    gap: 0.25rem;
  }

  .apps-table_organization-name-column__name {
    overflow: hidden;
    text-overflow: ellipsis;
  }
}
dm-attachments-edit {
  .attachments__document {
    display: flex;
    margin-bottom: 1.5rem;

    height: 2.5rem;
    background: var(--dm-shade-7);
    border: 0.0625rem dashed var(--dm-shade-5);
    box-sizing: border-box;
    border-radius: 0.25rem;
  }

  .attachments__document__image {
    height: 2.5rem;
    width: 3rem;
    box-sizing: border-box;
    object-fit: scale-down;
    border-right: 0.0625rem dashed var(--dm-shade-5);
  }

  .attachments__document__size {
    line-height: 1rem;
    font-size: 0.75rem;
    color: var(--dm-shade-4);
  }

  .attachments__document__content {
    padding: 0 1rem;
    align-items: center;
    width: 100%;

    font-size: 0.875rem;
    line-height: 1rem;
  }

  .attachments__document__uploaded {
    display: grid;
    grid-template-columns: 1fr auto auto;
    grid-gap: 1rem;
  }

  .attachments__document__default {
    display: flex;
    justify-content: center;
    color: var(--dm-shade-3);
  }

  .document__default__preloader {
    margin-right: 0.5rem;
    justify-self: right;
  }

  .attachments__link {
    text-decoration: none;
    color: var(--dm-color-primary);

    &:hover {
      text-decoration: underline;
      text-decoration-color: var(--dm-color-primary);
      text-underline-offset: 0.25rem;
    }
  }

  .attachments__action {
    text-decoration: underline;
    text-decoration-color: var(--dm-shade-5);
    text-underline-offset: 0.25rem;
  }
}
dm-attachments-view-user {
  .documents {
    margin-top: 1rem;
  }

  .documents__title {
    font-weight: bold;
    font-size: 0.9375rem;
    line-height: 1.375rem;
    color: var(--dm-shade-2);
  }

  .documents__list {
    margin-top: 1rem;
  }

  .documents__item {
    display: flex;
  }

  .documents__item:not(:first-of-type) {
    margin-top: 0.5rem;
  }

  .documents__link {
    margin-left: 0.5rem;
    color: var(--dm-color-primary);
    font-size: 0.875rem;
    line-height: 150%;
    font-feature-settings:
      "tnum" on,
      "lnum" on;
    text-decoration: none;

    &:hover {
      text-decoration: underline;
      text-decoration-color: var(--dm-color-primary);
      text-underline-offset: 0.25rem;
    }
  }
}
dm-audience-builder {
  #main-viewport {
    height: auto;
    padding: 0rem 2rem 2rem 2rem !important;
    display: flex;
    flex-direction: column;
  }
}
dm-audit-trails {
  #main-viewport {
    display: grid;
    grid-template-rows: 1fr auto;
    padding-bottom: 0.5rem !important;
    padding-left: 10% !important;
    padding-right: 10% !important;
  }

  .date-picker {
    width: 17.5rem;
  }
}
dm-authorization-login.dm-authorization {
  .title {
    margin-bottom: 2rem;
  }

  .form-element {
    margin-bottom: 2rem;
  }

  .main-form {
    padding-top: 3rem;
  }

  .reset-password-container {
    font-size: 0.875rem;
    margin-top: 1.5rem;
    display: flex;
    justify-content: center;
    line-height: 1.5rem;
  }

  .main-action-button {
    margin-top: 0.5rem;
  }
}
.dm-authorization {
  display: grid;

  .title {
    position: relative;
    margin-bottom: 0.5rem;
    color: var(--dm-shade-2);
    margin-top: 0;
  }

  label {
    color: var(--dm-shade-1) !important;
  }

  .title__image {
    width: 1.5rem;
    position: absolute;
    bottom: 3.5rem;
    left: 0;
  }

  .main-form {
    z-index: var(--dm-z-index-element);
    padding: 6rem 5rem 4rem 5rem;
    justify-self: center;
    box-sizing: border-box;
    margin-top: 7.5%;
    height: fit-content;
    width: 34.375rem;
    position: relative;
    color: var(--dm-shade-1);
    background: var(--dm-shade-8);
    box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.1);
    border-radius: 0.5rem;
  }

  .main-action-button {
    width: 100%;
    margin-top: 1rem;
  }

  .form-element {
    margin-bottom: 1.5rem;
  }

  p {
    opacity: 0.8;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.375rem;
    margin-bottom: 2rem;
    margin-top: 0;
    color: var(--dm-shade-3);
  }

  .password-info {
    margin-left: 0.5rem;
    text-transform: capitalize !important;
    font-weight: 400;
    font-size: 0.75rem;
    line-height: 1.125rem;
    letter-spacing: 0.3px;
    opacity: 0.7;
  }
}
.tooltip-password {
  padding: 0.625rem 0.75rem;
  color: var(--dm-shade-5);
  font-weight: 400;
  font-size: 0.8125rem;
  line-height: 1.375rem;
}
.tooltip-password__content {
  margin-top: 0.6875rem;
}
.tooltip-password__content__list {
  list-style: number;
  margin: 0 0 0 1rem;
  padding: 0;
}
.billing-view {
  grid-template-rows: 1fr auto;

  dm-table-simple {
    display: grid;
    grid-template-rows: 1fr auto;
    overflow: auto;
    width: 100%;
    height: 100%;
    box-sizing: border-box;

    .table-container {
      height: 100%;
      overflow: hidden;

      .dm-table {
        height: 100%;
        overflow: hidden;
      }

      .dm-table tr {
        grid-auto-flow: column;
      }
    }
  }

  .day-select {
    width: 16rem;
  }
}
dm-iababc-blacklists {
  .content-viewport {
    display: grid;
    grid-template-rows: 1fr auto;
    padding-bottom: 0.5rem !important;
    padding-left: 10% !important;
    padding-right: 10% !important;
  }

  .first-import {
    width: 100%;
    height: calc(100% - 5rem);

    display: flex;
    align-items: center;
    justify-content: center;
  }

  .first-import__cover {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .first-import__title {
    font-size: 1.375rem;
    line-height: 1.875rem;
    color: color-mix(in srgb, var(--dm-shade-2) 60%, transparent);

    margin-top: 1.5rem;
    margin-bottom: 2rem;
  }

  .import-logs {
    overflow: hidden;
    display: grid;
    grid-template-rows: max-content auto;
    position: relative;
  }
}
dm-modal-black-list-import {
  .file-input-wrap {
    position: relative;
    input[type="text"] {
      padding-right: 8rem;
    }
    input[type="file"] {
      position: absolute;
      top: 0;
      left: 0;
      opacity: 0;
      cursor: pointer;
    }
    button {
      position: absolute;
      right: 0.5rem;
      top: 0.25rem;
      height: 2rem;
      padding: 0 1rem;
      background: var(--dm-shade-5);
      pointer-events: none;
    }
  }

  .status {
    min-height: 1.5rem;
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 150%;
    margin: 0.75rem 0;
    &.error {
      color: var(--dm-color-category-6);
    }
    &.success {
      color: var(--dm-color-category-5);
    }

    button {
      color: inherit;
      border: none;
      text-decoration: underline;
      font-size: inherit;
      margin-left: 0.5rem;
    }
  }
}
dm-button-copy {
  display: flex;
}
dm-button-icon-page.dm-button-icon {
  .button {
    height: 1.5rem;
    width: 1.5rem;
  }
}
dm-button-icon-with-dropdown-arrow.dm-button-icon {
  display: flex;
  align-items: center;

  &[loading] [invisibleOnLoad] {
    display: none;
  }

  .button__iconDropdown {
    margin-left: -0.25rem;
  }
}
dm-button {
  display: inline-block;
  width: fit-content;
  white-space: nowrap;
  min-width: 6.875rem;

  &[disabled],
  &[loading] {
    pointer-events: none;
  }

  &[loading] [invisibleOnLoad] {
    opacity: 0;
  }

  .button {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    position: relative;

    font-style: normal;
    border-radius: 0.25rem;
    font-weight: 600;
    font-size: 0.9375rem;
    line-height: 1.5rem;
    width: 100%;

    &[disabled] {
      background-color: color-mix(in srgb, var(--dm-shade-6) 70%, transparent);
      color: var(--dm-shade-5);

      .button__icon {
        filter: invert(10%) sepia(7%) saturate(240%) hue-rotate(192deg) brightness(96%)
          contrast(84%);
      }
    }

    &[loading] {
      pointer-events: none;
    }

    &[transparent] {
      background-color: rgba(0, 0, 0, 0);
    }
  }

  .button--size-extra-small {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    height: 1.5rem;
    font-size: 0.8125rem;

    &[has-icon] {
      padding-left: 0.25rem;
    }
  }

  .button--size-small {
    padding-left: 1rem;
    padding-right: 1rem;
    height: 2rem;
    font-size: 0.875rem;

    &[has-icon] {
      padding-left: 0.5rem;
    }
  }

  .button--size-medium {
    padding-left: 2rem;
    padding-right: 2rem;
    height: 2.5rem;

    &[has-icon] {
      padding-left: 1rem;
    }

    &[has-icon-after-label] {
      padding-left: 2.5rem;
      padding-right: 0.75rem;
    }
  }

  .button--size-large {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    height: 3rem;

    &[has-icon] {
      padding-left: 2rem;
    }
  }

  .button__icon--before-label {
    margin-right: 0.75rem;
  }

  .button__icon--after-label {
    margin-left: 1.25rem;
  }

  .button--size-small,
  .button--size-extra-small {
    .button__icon--before-label {
      margin-right: 0.5rem;
    }
  }

  .button--theme-primary {
    background-color: var(--dm-color-primary);
    color: var(--dm-color-static);

    &.button[outline] {
      border: 0.0625rem solid #0753b4;
    }

    &.button[transparent] {
      color: var(--dm-color-primary);
      border: 0.125rem solid color-mix(in srgb, var(--dm-color-primary) 70%, transparent);
    }

    &:hover {
      background-color: var(--dm-shade-primary-600);
    }
  }

  .button--theme-secondary {
    background-color: var(--dm-shade-6);

    color: var(--dm-shade-3);

    &.button[outline] {
      border: 0.0625rem solid var(--dm-shade-5);
    }

    &:hover {
      background-color: var(--dm-shade-6-600);
    }
  }

  .button--theme-danger {
    background-color: var(--dm-color-category-6);
    color: var(--dm-color-static);

    &:hover {
      background-color: var(--dm-color-category-6-600);
    }
  }

  .button--theme-neu {
    background-color: var(--dm-color-neu);
    color: var(--dm-color-static);

    &:hover {
      background-color: var(--dm-shade-neu-600);
    }
  }

  .button__loader {
    position: absolute;
  }
}
.card-metric-trend {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-left: 0.8125rem;
  min-width: 9.1875rem;
  min-height: 4.5625rem;

  .title {
    font-weight: 500;
    font-size: 0.6875rem;
    line-height: 0.875rem;
    letter-spacing: 0.00125rem;
    color: var(--dm-shade-3);
    text-transform: uppercase;
    padding-bottom: 0.4375rem;
  }

  .data {
    font-weight: 400;
    font-size: 1.875rem;
    line-height: 1.875rem;
    color: var(--dm-shade-2);
    padding-bottom: 0.125rem;
  }

  .trend-data {
    font-weight: 500;
    font-size: 0.75rem;
    line-height: 1.25rem;
    color: var(--dm-shade-4);
  }

  .trend-icon {
    width: 1.5rem;
  }

  .trend-icon-element {
    padding-left: 1rem;
  }
}
dm-card-website-section-default.dm-card-website-section {
  background: var(--dm-color-website-section-1);
  margin: 0.25rem 0;
  height: 3rem;
  box-sizing: border-box;

  display: flex;
  justify-content: space-between;
  align-items: center;

  .card-section-item {
    background: none;
    width: 100%;
    grid-template-rows: 1fr auto;
    grid-auto-flow: column;
  }

  .system {
    display: flex;
    align-items: flex-end;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
  }

  .system__label {
    color: var(--dm-color-category-6);
    font-size: 0.75rem;
  }
}
.dm-card-website-section {
  .card-section-item {
    background: color-mix(in srgb, var(--dm-shade-8) 60%, transparent);
    margin: 0.25rem 0;
    box-sizing: border-box;
    padding: 0.375rem 0.75rem;
    display: grid;
    grid-template-columns: 1fr minmax(4rem, auto);
    align-items: center;

    .name {
      font-size: 0.875rem;
      color: var(--dm-shade-1);
    }

    .id-info,
    .tags-info {
      color: var(--dm-shade-4);
      font-size: 0.75rem;
      line-height: 133%;
    }

    .actions-btn,
    .remove-btn {
      height: 1.5rem;
      width: 1.5rem;
      object-fit: scale-down;
      cursor: pointer;
    }

    .remove-btn {
      grid-row: span 3;
      opacity: 0;
      transition: opacity 0.07s;
    }

    &:hover .remove-btn {
      opacity: 1;
    }

    .actions-menu,
    .actions-btn,
    .id-info {
      justify-self: right;
    }
  }

  .status-info {
    color: var(--dm-shade-4);
    font-size: 0.75rem;
    line-height: 133%;

    .active-status {
      color: var(--dm-color-website-section-2);
      &.active {
        color: var(--dm-color-category-5);
      }
    }

    .mode-status {
      font-weight: bold;
    }
  }
}
dm-categories-ems {
  #main-viewport {
    display: grid;
    grid-template-rows: auto 1fr;
  }

  .categories-filters {
    background-color: var(--dm-shade-8);
    box-shadow:
      inset 0 1px 0 var(--dm-shade-6),
      inset 1px 0 0 var(--dm-shade-6),
      inset -1px 0 0 var(--dm-shade-6);
  }
}
dm-category-label-input {
  &[readOnly] {
    pointer-events: none;
  }

  .input-wrapper {
    display: flex;
    align-items: center;
    gap: 1rem;
  }
}
dm-checkbox {
  display: flex;
  align-items: center;

  input {
    width: 1rem;
    height: 1rem;
    position: relative;
    font-size: 1rem;
    top: 0;
    margin: 0;
    cursor: pointer;
    outline: none;
    -moz-appearance: initial;
    visibility: hidden;

    :disabled {
      cursor: default;
    }

    &:after {
      content: url(/images/checkbox-unchecked.svg);
      display: inline-block;
      width: 1rem;
      height: 1rem;
      opacity: 1;
      visibility: visible;
    }

    &:checked:after {
      content: url(/images/checkbox-checked.svg);
      visibility: visible;
    }

    &:not(:checked):disabled:after {
      content: url(/images/checkbox-unchecked-disabled.svg);
      visibility: visible;
    }

    &:checked:disabled:after {
      content: url(/images/checkbox-checked-disabled.svg);
      visibility: visible;
    }

    &[indeterminate]:disabled:after {
      content: url(/images/checkbox-indeterminate-disabled.svg);
      visibility: visible;
    }

    &[indeterminate]:after {
      content: url(/images/checkbox-indeterminate.svg);
      visibility: visible;
    }
  }
}
dm-custom-groups {
  .no-custom-group {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 11.25rem;
  }

  .no-custom-group__image {
    margin-bottom: 1.5rem;
  }

  .no-custom-group__message {
    font-size: 1.375rem;
    font-weight: 400;
    line-height: 1.875rem;
    color: var(--dm-shade-2);
    opacity: 0.6;
    margin-bottom: 2rem;
  }

  .custom-groups-table {
    display: grid;
    grid-template-rows: 1fr auto;
    overflow: auto;
    width: 100%;
    height: 100%;
    box-sizing: border-box;

    .table-container {
      height: 100%;
      overflow: auto;
    }

    .dm-table {
      height: 100%;
      overflow: hidden;
    }

    .dm-table tr {
      grid-auto-flow: column;
      grid-template-columns: 5fr 1fr 1fr 1fr;
    }
  }
}
dm-daily-data-publishing {
  #main-viewport {
    display: grid;
    grid-template-rows: 1fr auto;
    padding-bottom: 0.5rem !important;
  }

  dm-table-simple {
    display: grid;
    grid-template-rows: 1fr auto;
    overflow: auto;
    width: 100%;
    height: 100%;
    box-sizing: border-box;

    .table-container {
      height: 100%;
      overflow: hidden;

      .dm-table {
        height: 100%;
        overflow: hidden;
      }
    }
  }

  .date-input {
    min-width: 16rem;
  }
}
dm-dashboard-monthly-detailed-entity-overview {
  .entity-overview {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
  }

  .entity-overview__first-row {
    display: flex;
    align-items: center;
    gap: 0.625rem;
  }

  .entity-overview__second-row {
    display: flex;
    gap: 1rem;
    align-items: center;
    justify-content: space-between;
    overflow: auto;
  }

  .entity-overview__entity-logo {
    width: 2.625rem;
  }

  .entity-overview__title-holder {
    width: 100%;
  }

  .entity-overview__title-holder__title-date {
    font-weight: 500;
    font-size: 1rem;
    line-height: 1.5rem;
    color: var(--dm-shade-3);
  }

  .entity-overview__title-holder__subtitle {
    font-weight: 500;
    font-size: 0.8125rem;
    line-height: 1.0625rem;
    color: var(--dm-shade-4);
  }

  .entity-overview__metrics-holder {
    display: flex;
  }
}
dm-dashboard-monthly-detailed-key-demographics {
  .key-demographics__toolbar {
    display: flex;
    justify-content: space-between;

    .dm-select {
      height: max-content;
    }
  }
}
dm-dashboard-monthly-detailed-metrics-table {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 100%;
}
dm-dashboard-monthly-detailed-traffic-breakout {
  .traffic-breakout__title {
    font-weight: 500;
    font-size: 1.25rem;
    line-height: 1.5rem;
    color: var(--dm-shade-3);
  }

  .traffic-breakout__sub-title {
    font-weight: 500;
    font-size: 1rem;
    line-height: 1.75rem;
    color: var(--dm-shade-3);
  }

  .traffic-breakout {
    outline: 0.0625rem solid var(--dm-shade-6);
    background-color: var(--dm-bg-color);
    border-radius: 0.25rem;
  }

  .traffic-breakout__section--separator {
    height: 1.5rem;
    background: linear-gradient(180deg, var(--dm-shade-6) 0%, rgba(234, 237, 243, 0) 100%);
    opacity: 0.3;
  }

  .traffic-breakout__section--top-level {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    background-color: var(--dm-shade-8);
    padding: 1.25rem 1.25rem 0;
  }

  .traffic-breakout__section--second-level {
    padding: 1.25rem 1.25rem 0;
  }

  .traffic-breakout__key-demographics {
    padding: 1.25rem 1.25rem 0;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
  }

  .traffic-breakout__toolbar__metric-select {
    width: fit-content;
  }
}
dm-dashboard-monthly-detailed {
  display: grid;
  height: 100%;

  .toolbar__items__left {
    display: flex;
    align-items: center;
    gap: 0.5rem;
  }

  .toolbar__title__entity {
    display: flex;
    align-items: center;
    gap: 0.5rem;
  }

  .toolbar__title__entity__name {
    font-weight: 500;
    font-size: 1rem;
    color: var(--dm-shade-3);
    line-height: 1.625rem;
  }

  .toolbar__items__right__actions {
    display: flex;
    align-items: center;
    gap: 0.25rem;
  }

  .monthly-detailed-main-holder {
    padding: 0rem 2rem 7.5rem 2rem;
    overflow: auto;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
  }

  .section-main-title {
    font-weight: 500;
    font-size: 1.25rem;
    line-height: 1.75rem;
    color: var(--dm-shade-3);
    margin-bottom: 1rem;
  }

  .main-section {
    padding: 1.25rem;
    background-color: var(--dm-shade-8);
    box-shadow:
      inset 0 -0.0625rem 0 var(--dm-shade-6),
      inset 0.0625rem 0 var(--dm-shade-6),
      inset -0.0625rem 0 0 var(--dm-shade-6),
      inset 0 0.0625rem 0 var(--dm-shade-6);
    margin-bottom: 2.3125rem;
    border-radius: 0.25rem;
  }

  .card-decorator {
    box-shadow: -0.0625rem 0 0 0 var(--dm-shade-6);
  }
}
.dm-dashboard-preset {
  height: calc(100% + 20rem);
  width: 100%;
  display: grid;
  grid-template-rows: auto auto auto 1fr;
  overflow: hidden;
  position: relative;

  .dashboard__toolbar {
    display: flex;
    gap: 1rem;
    padding: 1rem;
    background-color: var(--dm-shade-8);
    border: 1px solid var(--dm-shade-6);
  }

  .dashboard__toolbar-table {
    justify-content: space-between;
  }

  .dashboard__toolbar-table-right {
    display: flex;
    gap: 0.5rem;
  }

  .dashboard__graph--container {
    display: contents;
  }

  .dashboard__graph {
    height: 21rem;
    min-height: 21rem;
    background-color: var(--dm-bg-color);
    border-left: 1px solid var(--dm-shade-6);
    border-right: 1px solid var(--dm-shade-6);

    &[hideGraph] {
      display: none;
    }
  }

  .dashboard__graph__metric-filter {
    margin-top: 0.25rem;
    margin-left: 1rem;
  }

  .dashboard__graph__graph-no-items {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-content: center;
  }

  .graph-no-items__text {
    margin-top: 1.5rem;
    color: var(--dm-shade-2);
    font-weight: 500;
    line-height: 1.5rem;
  }

  .dashboard__table {
    height: 100%;
  }
}
.dm-dashboard {
  #main-viewport {
    position: relative;
    padding-top: 0 !important;
    display: grid;
    grid-auto-rows: auto 1fr;
  }

  .dashboard-date {
    width: 13rem;
  }

  .detailed-view-container {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: var(--dm-main-bg-color);
  }

  .toolbar__separator {
    height: 2rem;
  }
}
dm-data-builds {
  #main-viewport {
    padding-top: 1rem;
    display: grid;
    grid-template-rows: 1fr auto;
    padding-bottom: 0.5rem !important;
  }
}
.dm-item-dashboard-cell-data {
  display: contents;
}
dm-item-dashboard-cell-data-metric-simple {
  display: contents;
}
.data-cell-dashboard-item {
  width: 100%;
  height: 100%;
  display: grid;
  grid-template-columns: 2.5fr auto;
  align-items: center;
  padding-left: 0.75rem;
  padding-right: 0.8125rem;

  .value {
    display: flex;
    flex-direction: column;
    line-height: 130%;
    font-weight: 500;
  }

  .value__display {
    font-size: 0.8125rem;
    color: var(--dm-shade-2);
  }

  .value__percentage {
    font-size: 0.75rem;
    color: var(--dm-shade-4);
  }

  .trend {
    gap: 0.75rem;
    display: flex;
    font-size: 0.75rem;
    line-height: 130%;
    font-weight: 500;
    color: var(--dm-shade-3);
    opacity: 0.8;
    font-feature-settings:
      "pnum" on,
      "lnum" on;
  }

  .trend__period {
    display: flex;
    align-items: center;
    justify-content: flex-end;
  }
}
.dashboard-data-cell--unpublished {
  background-color: color-mix(
    in srgb,
    var(--dm-color-category-7),
    var(--dm-shade-8) 95%
  ) !important;
}
dm-item-dashboard-detailed-cell-data-versus {
  grid-template-columns: 1fr 1fr 1fr;

  .trend-container {
    display: grid;
    align-items: center;
    grid-template-columns: 3rem auto;
    font-weight: 500;
    font-size: 0.75rem;
  }
}
.dm-item-dashboard-detailed-cell-data {
  display: grid;
  align-items: center;
  width: 100%;
  height: 100%;
  padding-left: 1.25rem;

  .main-value {
    font-weight: 500;
    font-size: 0.8125rem;
    line-height: 1.0625rem;
  }

  .detail-value {
    font-weight: 500;
    font-size: 0.75rem;
    line-height: 1rem;
    color: var(--dm-shade-4);
  }
}
dm-item-report-list-cell-data-name-scheduled {
  .data-cell-report-item {
    justify-content: space-between;
    background-color: var(--dm-color-background);
  }

  .data-cell-report-item__value {
    align-items: center;
    width: 100%;
    padding-left: 1.75rem;
  }
}
dm-item-report-list-cell-data-name {
  .data-cell-report-item {
    justify-content: space-between;
  }

  .data-cell-report-item__value {
    align-items: center;

    &[add-space] {
      padding-left: 1rem;
    }
  }

  .data-cell-report-item__value__icon {
    position: relative;
    display: flex;
    width: 1.5rem;
    height: 1.5rem;
    margin-left: 0.75rem;
  }
}
dm-item-report-list-cell-data-scheduled {
  .data-cell-report-item {
    background-color: var(--dm-color-background);
  }
}
.dm-item-report-list-cell-data {
  display: contents;

  .data-cell-report-item {
    text-align: left;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    padding: 0 0.75rem;
  }

  .data-cell-report-item__value {
    font-size: 0.875rem;
    font-weight: 400;
    color: var(--dm-shade-2);
    display: flex;
  }

  .data-cell-report-item__value__name {
    display: block;
    margin-left: 0.75rem;
    font-size: 0.875rem;
    font-weight: 400;
    color: var(--dm-shade-2);
  }
}
dm-report-list-menu-cell-scheduled {
  .data-cell-report-item {
    background-color: var(--dm-color-background);
  }
}
.dm-report-list-menu-cell {
  display: contents;

  .data-cell-report-item {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
  }
}
.dm-table {
  display: grid;
  grid-template-rows: auto 1fr;
  width: 100%;
  box-sizing: border-box;
  /*height: 79rem;*/
  height: auto;
  background: var(--dm-shade-8);
  animation: fadeIn 0.8s ease;

  thead {
    animation: fadeIn 0.2s ease;
  }
  tbody {
    animation: fadeIn 0.8s ease;
  }

  thead,
  tbody {
    width: 100%;
  }

  thead tr {
    background: var(--dm-shade-7);
    height: 2.5rem;
    .column-title {
      text-transform: uppercase;
      font-size: 0.75rem;
      color: var(--dm-shade-4);
      font-weight: 500;
      .zeros {
        color: var(--dm-shade-3);
        font-size: 0.9rem;
        text-transform: initial;
      }
    }
  }

  tbody {
    background: var(--dm-shade-8);
    display: block;
    overflow-x: hidden;
    overflow-y: auto;
    tr {
      height: 3.5rem;

      transition: background 0.07s ease;

      &:last-child {
        /*box-shadow: none;*/
      }
      &:hover {
        background: var(--dm-shade-7);
      }
    }
  }

  tr {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    height: 3rem;

    box-shadow:
      inset 0 -0.0625rem 0 var(--dm-shade-6),
      inset 0.0625rem 0 0 var(--dm-shade-6);

    th,
    td {
      overflow: hidden;
      box-sizing: border-box;
      text-align: left;
      display: flex;
      align-items: center;
      padding: 0 0.75rem;
    }
    th {
      border-right: 1px solid var(--dm-shade-6);
    }

    .hidden-border {
      border-right: none;
    }

    th {
      display: grid;
      grid-template-columns: 1fr auto;
      &.sortable {
        cursor: pointer;
      }

      .sort-control {
        display: none;
        transform-origin: center;
      }
    }
    th.active {
      background: var(--dm-shade-6);
      .column-title,
      .zeros {
        color: var(--dm-color-primary);
      }
      .sort-control {
        display: block;
      }
    }
    th.asc {
      .sort-control {
        transform: rotate(180deg);
      }
    }

    td {
      .value,
      .p-value,
      .trend-value {
        font-size: 0.8125rem;
        color: var(--dm-shade-1);
      }
      .p-value {
        color: var(--dm-shade-4);
      }
      .trend-value {
        display: flex;
        align-items: center;
        &:after {
          content: "";
          display: inline-block;
          width: 1rem;
          height: 1rem;
        }
        &.rise:after {
          background: url(/images/ic-arrow-green.svg) center no-repeat;
        }
        &.fall:after {
          background: url(/images/ic-arrow-red.svg) center no-repeat;
        }
      }
    }
  }

  .actions {
    display: flex;
    justify-content: flex-end;
    width: 100%;
    height: 100%;

    .actions-menu {
      display: flex;
      align-items: center;
    }
  }
}
.default {
  color: var(--dm-shade-3);
  font-size: 0.875rem;
  font-weight: 500;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  width: 100%;

  a {
    display: inline;
    line-height: 155%;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    color: var(--dm-shade-3);
    text-decoration: none;
  }
}
.status {
  width: 100%;
  display: flex;
  align-items: center;

  .status-name {
    color: var(--dm-shade-3);
    font-size: 0.875rem;
    font-weight: 500;
    text-transform: capitalize;
  }

  .actions-button {
    cursor: pointer;
    margin-left: auto;
    width: 1.5rem;
    height: 3rem;
    object-fit: scale-down;
  }

  .actions-menu {
    margin-left: auto;
  }

  .status-display {
    display: inline-block;
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    margin-right: 0.5rem;
    box-sizing: border-box;
    &.active {
      background-color: var(--dm-color-category-5);
    }
    &.inactive {
      background-color: var(--dm-color-category-6);
    }
    &.pending {
      background-color: #f2c94c;
    }

    &.stopped {
      background-color: var(--dm-shade-4);
    }

    &.not-available {
      background: none;
      border: 1px solid var(--dm-shade-2);
    }
  }

  .status-sub {
    display: flex;
    align-items: center;
  }
  .mode-display {
    margin-left: 1rem;
    span {
      font-size: 0.8125rem;
      color: var(--dm-shade-4);
      font-weight: 500;
    }
  }
}
.two-rows {
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-weight: 500;
  overflow: hidden;
  span {
    color: var(--dm-shade-3);
    font-size: 0.875rem;

    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }
  & > *:last-child {
    margin-top: 0.25rem;
    color: var(--dm-shade-4);
    font-size: 0.8125rem;
  }
}
.icon-plus-label {
  display: flex;
  align-items: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  span {
    color: var(--dm-shade-3);
    font-size: 0.875rem;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .site-icon {
    margin-right: 1.25rem;
    width: 1rem;
  }
}
.icon-plus-label {
  height: 1.5rem;
  display: flex;
  align-items: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  span {
    color: var(--dm-shade-3);
    font-size: 0.875em;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .site-icon {
    margin-right: 1.25rem;
    width: 1rem;
  }
  .select-chk-box {
    top: 0;
    margin-right: 0.75rem;
  }
  .expand-control {
    margin-right: 0.5rem;
    cursor: pointer;
    height: 1.5rem;
    width: 1.5rem;
    object-fit: scale-down;
    object-position: center;
  }
}
.txt-two-lines {
  white-space: normal;
}
.num {
  font-feature-settings:
    "tnum" on,
    "lnum" on,
    "zero" on;
}
.date {
  font-feature-settings:
    "tnum" on,
    "lnum" on;
}
dm-datasets {
  #main-viewport {
    padding-bottom: 0.5rem !important;
    display: grid;
  }
}
.demography-import {
  #import-coefficients-form {
    width: 56rem;
    margin: 0 auto;

    &.disabled {
      pointer-events: none;
    }

    .file-input-wrap {
      position: relative;
      input[type="text"] {
        padding-right: 8rem;
      }
      input[type="file"] {
        position: absolute;
        top: 0;
        left: 0;
        opacity: 0;
        cursor: pointer;
      }
      button {
        position: absolute;
        right: 0.25rem;
        top: 0.25rem;
        height: 2rem;
        padding: 0 1rem;
        background: var(--dm-shade-5);
        pointer-events: none;
      }
    }

    .status {
      min-height: 1.5rem;
      font-size: 0.75rem;
      font-weight: 500;
      line-height: 150%;
      margin: 0.75rem 0;
      &.error {
        color: var(--dm-color-category-6);
      }
      &.success {
        color: var(--dm-color-category-5);
      }

      button {
        color: inherit;
        border: none;
        text-decoration: underline;
        font-size: inherit;
        margin-left: 0.5rem;
      }
    }
  }
}
.modal-container .modal.demography-validation-errors-modal {
  width: 72rem;

  .modal-content {
    padding: 0 2rem;
    overflow: hidden;
  }
}
.demography-groups {
  padding-top: 1rem;
  display: grid;
  grid-template-rows: 1fr auto;
  padding-bottom: 0.5rem !important;
}
.demography-toolbar {
  .form-element.select-control,
  .form-element.select-control,
  .form-element.select-control {
    label {
      display: none;
    }
    .select-button {
      height: 2.5rem;
      &:focus-within {
        border-color: var(--dm-shade-5);
      }
    }
    .selected-item {
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
  }
}
.demography-table-view {
  padding-top: 0 !important;
  display: grid;
  grid-template-rows: 3.5rem 1fr auto;
  padding-bottom: 0.5rem !important;

  .additional-tools {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    padding: 0 0 0 1rem;

    .l-group {
      label {
        cursor: pointer;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;

        input[type="checkbox"] {
          pointer-events: none;
          top: 0.2rem;
          margin-right: 0.75rem;
        }
        span {
          font-size: 0.75rem;
          color: var(--dm-shade-4);
        }
      }
    }

    .group {
      display: flex;
      align-items: center;
      height: 3.5rem;
    }

    .l-group {
      border-right: 1px solid
        color-mix(in srgb, var(--dm-shade-5) 50%, transparent);
      & > * {
        margin-right: 1rem;
      }
    }

    .c-group {
      padding: 0 1rem;
      button {
        color: var(--dm-shade-1);
      }
      & > * {
        margin-right: 2rem;
      }
    }

    .r-group {
      .icn-txt-btn {
        display: flex;
        align-items: center;
        text-transform: uppercase;
        font-size: 1rem;
        span {
          font-size: 0.75rem;
        }
        .icon {
          position: relative;
          top: -0.04rem;
          opacity: 0.6;
        }
      }

      dm-datepicker {
        width: 13rem;
      }

      & > * {
        margin-left: 1rem;
      }
    }

    .txt-btn {
      display: flex;
      align-items: center;
      margin-left: 1.5rem;
      img {
        margin-right: 0.5rem;
      }
    }
  }
}
dm-breakout-vertical-bars-chart {
  width: 100%;
  box-sizing: border-box;
  display: block;
  padding-top: 3rem;
  padding-bottom: 3rem;

  .chart-wrap {
    box-sizing: border-box;
    margin-left: 3rem;
    position: relative;
    display: flex;
    justify-content: center;

    .categories-wrap {
      display: flex;
      justify-content: space-between;
      min-width: 70%;
    }

    .category-group {
      width: 14.75rem;
      top: 100%;
      height: 0;
      position: relative;
      display: flex;
      gap: 0.625rem;
      justify-content: center;
      cursor: pointer;

      .highlight {
        opacity: 0;
        z-index: 2;
        position: absolute;
        left: 0;
        width: 100%;
        height: 6.25rem;
        background: var(--dm-shade-7);
        border-radius: 0.25rem;
        border: 1px solid rgba(45, 71, 158, 0.4);
        &:after {
          content: "";
          position: absolute;
          left: calc(50% - 4px);
          bottom: -0.5rem;
          width: 0;
          height: 0;
          border-left: 8px solid transparent;
          border-right: 8px solid transparent;
          border-top: 8px solid #a6b2d7;
        }
      }

      &:not(.selected):hover {
        .highlight {
          opacity: 0.7;
          border: none;
          &:after {
            display: none;
          }
        }
      }

      &.selected {
        .highlight {
          opacity: 1;
        }
      }

      &.n:after {
        position: absolute;
        content: "";
        display: block;
        width: 100%;
        height: 1px;
        top: 1px;
        left: 0;
        background: red;
      }
      .bar {
        z-index: 3;
        position: relative;
        width: 2.75rem;
        pointer-events: none;

        span {
          color: var(--dm-shade-3);
          font-size: 0.6875rem;
          position: absolute;
          top: -1.5rem;
          left: 0;
          width: 100%;
          display: flex;
          align-items: center;
          justify-content: center;
        }
      }

      .category-label {
        z-index: 3;
        position: absolute;
        left: 0;
        bottom: -2rem;
        width: 100%;
        text-align: center;
        font-size: 0.8125rem;
        color: var(--dm-shade-3);
        font-weight: 500;
      }
    }

    .line {
      z-index: 1;
      position: absolute;
      left: 0;
      width: 100%;
      border-top: 1px solid var(--dm-shade-7);
      span {
        display: block;
        width: 2rem;
        text-align: right;
        font-size: 0.8125rem;
        color: var(--dm-shade-4);
        position: absolute;
        top: -0.5rem;
        left: -2.5rem;
      }
    }
  }
}
dm-dropdown-select.dm-dropdown {
  .dropdown__item {
    &[selected] {
      background: var(--dm-shade-7);
    }
  }
}
.dm-dropdown {
  cursor: pointer;
  position: absolute;
  z-index: var(--dm-z-index-menu);
  top: 0;
  left: 0;
  font-size: 0.875rem;
  line-height: 1.375rem;
  font-weight: 500;
  display: flex;

  .dropdown {
    min-width: 11rem;
    margin-top: 0.25rem;
    margin-bottom: 0.25rem;
    padding: 0.25rem 0;
    background-color: var(--dm-shade-8);
    box-shadow:
      0 0 0.125rem rgba(0, 0, 0, 0.12),
      0 0.25rem 1rem rgba(0, 0, 0, 0.15);
    border-radius: 0.25rem;

    &:not([open]) {
      display: none;
    }

    &[size="small"] {
      .dropdown__item {
        padding: 0.2525rem 1rem;
      }
    }
  }

  .dropdown__options {
    max-height: 22.5rem;
    overflow: auto;
  }

  .dropdown__group {
    background: color-mix(in srgb, var(--dm-shade-6) 30%, transparent);
  }

  .dropdown__group__label {
    display: flex;
    align-items: center;
    white-space: nowrap;
    padding: 0 1rem;
    background: var(--dm-shade-8);
    text-transform: uppercase;
    height: 1.75rem;
    box-shadow: inset 0 -0.0625rem 0 var(--dm-box-shadow);
    font-size: 0.625rem;
    color: var(--dm-color-primary);
  }

  .dropdown__item {
    white-space: nowrap;
    background: var(--dm-shade-8);
    padding: 0.5625rem 1rem;
    color: var(--dm-shade-2);
    display: flex;
    align-items: center;

    &:not(:last-of-type) {
      box-shadow: inset 0 -0.0625rem 0 var(--dm-box-shadow);
    }

    &:hover {
      background: var(--dm-shade-7);
    }

    &[disabled] {
      opacity: 0.3;
    }
  }

  .dropdown__item__label {
    margin-right: 0.5rem;
  }

  .dropdown__item__rIcon {
    margin-left: auto;
  }

  .dm-search {
    .sc {
      width: 100% !important;
    }
  }
}
dm-horizontal-bars-percent-chart {
  display: block;

  .totals {
    text-align: center;
    margin-bottom: 1rem;
    .metric-title {
      color: var(--dm-shade-3);
      letter-spacing: 0.02rem;
      font-size: 0.6875rem;
      line-height: 130%;
      font-weight: 500;
    }
    .total-value {
      color: var(--dm-shade-2);
      font-size: 2.625rem;
      line-height: 120%;
      font-weight: 500;
    }
    .comparison-text {
      color: var(--dm-shade-4);
      font-size: 0.75rem;
      line-height: 167%;
      font-weight: 500;
      .g-ic {
        position: relative;
        top: 0.27rem;
      }
    }
  }

  .category-item {
    width: 100%;
    display: flex;
    align-items: center;
    margin-bottom: 0.75rem;
    & > div {
      width: 100%;
    }

    .bar-info {
      display: flex;
      align-items: center;
      justify-content: space-between;
      color: var(--dm-shade-2);
      font-size: 0.875rem;
      line-height: 114%;
      font-weight: 500;
    }

    .bar-bg {
      position: relative;
      width: 100%;
      height: 0.25rem;
      margin: 0.25rem 0 0.125rem 0;
      .bar {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
      }
    }

    .history-text {
      text-align: right;
      color: var(--dm-shade-4);
      font-size: 0.75rem;
      line-height: 167%;
      font-weight: 500;
    }

    .g-ic {
      margin-left: 0.5rem;
      position: relative;
      top: -0.075rem;
    }
  }
}
dm-import-export {
  .container {
    width: 55.5rem;
    display: flex;
    gap: 1.5rem;
    flex-direction: column;
    margin: 0 auto;
  }

  .input-file {
    width: 40rem;
  }

  .info-text {
    color: var(--dm-shade-3);
    font-size: 0.9375rem;
    font-weight: 400;
    line-height: 1.5rem;
  }

  .header {
    margin-bottom: 0.75rem;
  }
}
.dm-item-dashboard-cell-data-trend-only {
  .data-cell-dashboard-item {
    justify-items: end;
    padding-right: 0.75rem;
  }
}
.dm-item-dashboard-header-horizontal-trend-only {
  .horizontal-header-middle-dashboard-item {
    padding: 0;
    justify-content: center;
  }
}
dm-modal-edit-app.dm-modal {
  .modal {
    width: 48rem;
  }

  .modal__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .form-element .prefix-input-wrapper {
    position: relative;

    input {
      padding-left: 6rem;
    }

    .schema-prefix {
      position: absolute;
      top: 0.5rem;
      left: 0.75rem;
      font-size: 0.875rem;
      color: var(--dm-shade-4);
    }
  }
}
dm-modal-edit-role.dm-modal {
  .modal {
    width: 48rem;
  }

  .modal__content {
    overflow: hidden;
    height: 60vh;
  }

  #edit-role-form {
    display: grid;
    grid-template-rows: auto 1fr;
    height: 100%;
    .form-section:before {
      background: none;
    }
    .top-section {
      padding-bottom: 1.5rem;
    }
    .permissions-list {
      grid-gap: 0.75rem;
      align-content: start;
      overflow: auto;
    }
    .checkbox-form-item {
      border-bottom: 1px solid var(--dm-shade-6);
      padding-bottom: 0.5rem;
      box-sizing: border-box;

      &.hidden {
        display: none;
      }

      label {
        display: flex;
        align-items: center;
        cursor: pointer;
        span {
          color: var(--dm-shade-3);
          font-weight: 500;
          font-size: 0.9375rem;
          line-height: 160%;
        }
        input[type="checkbox"] {
          margin-right: 0.75rem;
        }
      }

      p {
        color: var(--dm-shade-3);
        font-weight: 500;
        font-size: 0.8125rem;
        line-height: 185%;
        padding-left: 2.2rem;
        margin: 0;
      }
    }

    .search-results-info {
      grid-column: span 2;
      font-size: 0.875rem;
      color: var(--dm-shade-4);
      span {
        color: var(--dm-shade-2);
        font-weight: 500;
      }
    }

    .search-input {
      .input-wrapper {
        position: relative;
        .search-icn {
          position: absolute;
          top: 0;
          left: 0;
          width: 3rem;
          height: 3rem;
          object-fit: scale-down;
        }
        .clear-btn {
          position: absolute;
          top: 0;
          right: 0;
          width: 3rem;
          height: 3rem;
          object-fit: scale-down;
          cursor: pointer;
          &.hidden {
            display: none;
          }
        }
        input {
          padding: 0.75rem 3.25rem;
        }
      }
    }
  }
}
dm-modal-edit-user.dm-modal {
  .modal {
    width: 48rem;
  }

  .add-user-form {
    display: flex;
    flex-direction: column;
    gap: 3rem;
  }
}
dm-modal-survey-answer.dm-modal {
  .modal {
    width: 34rem;
  }

  .modal__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .item-id {
    font-size: 0.875rem;

    .id-label {
      color: var(--dm-shade-4);
    }
    .id-value {
      color: var(--dm-shade-3);
    }
  }

  .form-element.text-input textarea {
    height: 6rem;
  }
}
dm-modal-user-import-job.dm-modal {
  .modal {
    width: 48rem;
  }

  .modal__content {
    border-top: 1px solid #dfdfdf;
    min-height: 14rem;
    padding: 0;
  }

  .description {
    padding: 1rem;
    background: color-mix(in srgb, var(--dm-shade-7) 30%, transparent);
    font-size: 0.75rem;
    color: var(--dm-shade-2);
    box-shadow:
      inset 0 -0.0625rem 0 var(--dm-shade-6),
      inset 0.0625rem 0 0 var(--dm-shade-6);
  }
}
dm-percent-table {
  .table-wrap {
    background: var(--dm-shade-8);
  }
  .item {
    display: grid;
    grid-template-columns: 1fr auto auto;
    grid-gap: 0.5rem;
    align-items: center;
    padding: 0.375rem 1rem;
    min-height: 3rem;
  }

  .category-label {
    color: var(--dm-shade-3);
    font-size: 0.875rem;
    line-height: 130%;
    font-weight: 500;
  }

  .value,
  comparison-info {
    text-align: right;
  }

  .value {
    color: var(--dm-shade-2);
    font-size: 0.875rem;
    line-height: 130%;
    font-weight: 500;
  }

  .comparison-info {
    color: var(--dm-shade-4);
    font-size: 0.75rem;
    line-height: 167%;
    font-weight: 500;
  }
}
dm-pie-rings-chart {
  display: block;
  padding-top: 2rem;
  .layout-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    gap: 15%;
  }

  .info-wrap {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    justify-content: center;
    .tt {
      font-size: 0.875rem;
      line-height: 114%;
      font-weight: 500;
      color: var(--dm-shade-2);
    }
    .bt {
      font-size: 0.75rem;
      line-height: 167%;
      font-weight: 500;
      color: var(--dm-shade-4);
    }
    .g-ic {
      position: relative;
      top: 0.25rem;
    }
    .offset-left {
      position: relative;
      left: -0.21875rem;
    }
  }

  .pie-wrap {
    position: relative;
    height: 13.25rem;

    .ring-label {
      position: absolute;
      display: flex;
      width: 100%;
      justify-content: center;
      span {
        font-size: 0.75rem;
        font-weight: 500;
        color: #414141;
        background: var(--dm-shade-8);
        padding: 0.375rem 0.875rem;
        border-radius: 0.25rem;
        border: 1px solid #e0e3e6;
      }
      &.outer {
        bottom: calc(100% + 0.5rem);
        left: 0;
      }
      &.inner {
        top: 5.875rem;
        left: 0;
      }
    }
  }

  .dot {
    display: inline-block;
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    margin: 0 0.25rem;
    position: relative;
    top: -1px;
  }
}
dm-private-entities-icon {
  display: flex;
  cursor: pointer;

  .icon {
    opacity: 0.7;

    &:hover {
      opacity: 1;
    }
  }
}
.dm-private-entities-icon__tooltip .dm-tooltip__content {
  padding-bottom: 1rem;
}
.dm-report-tab {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  justify-content: center;
  position: relative;

  .reports__table {
    flex-grow: 1;
  }

  .no-reports-view {
    height: 100%;
  }
}
dm-report-wizard-category-entities-category {
  .report-wizard-report-results {
    height: auto;
  }
}
dm-modal-schedule-report.dm-modal {
  .modal {
    width: 40rem;
  }

  .modal-content {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
  }

  .schedule-report-modal__text {
    font-weight: 400;
    font-size: 0.9375rem;
    line-height: 1.5rem;
    color: var(--dm-shade-1);
    padding-bottom: 1.5rem;
  }

  .schedule-report-modal__options {
    padding-top: 1.5rem;

    .group {
      display: inline-block;
    }
  }

  .schedule-report-modal__completed {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  .schedule-report-modal__completed__text {
    padding-top: 2rem;
    font-weight: 400;
    font-size: 1rem;
    line-height: 150%;
    text-align: center;
    color: var(--dm-shade-3);
  }

  .schedule-type-group {
    margin: 1rem 0;
  }
}
.item-group {
  .group {
    border-radius: 0.25rem;
    border: 1px dashed var(--dm-shade-5);

    &[singleChild] {
      margin: 0.5rem 0;

      .list {
        padding: 0;
      }
    }
  }

  .header {
    height: 1.25rem;
    background: color-mix(in srgb, var(--dm-shade-8) 30%, transparent);
    box-shadow: 0 -0.0625rem 0 0 rgba(206, 208, 218, 0.8) inset;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.1875rem 0.5rem;
  }

  .title {
    text-transform: uppercase;
    display: flex;
    align-items: center;
    font-weight: 400;
    font-size: 0.6875rem;
    color: var(--dm-shade-4);
    letter-spacing: 0.01375rem;
    line-height: 130%;
  }

  .actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
  }

  .list {
    padding: 0.5rem 0.5rem 0 0.5rem;
  }

  .count {
    color: var(--dm-color-category-5);
    font-size: 0.75rem;
    font-weight: 600;
  }
}
.list-item.target-item {
  margin-bottom: 0;

  .invert-label {
    background: var(--dm-color-category-6);
    text-transform: uppercase;
    height: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.5625rem;
    font-weight: 700;
    line-height: 0;
    border-radius: 0.125rem;
    color: var(--dm-shade-8);
    width: 1.5rem;
  }

  .invert-button {
    width: 1.5rem;
    height: 1.5rem;
    object-fit: scale-down;
  }
}
.item-target-answer {
  .target-operator-answer {
    margin: 0.25rem 0;
  }
}
dm-toggle-label {
  display: flex;
  align-content: center;
  align-items: center;

  .label-container {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    user-select: none;

    &[formLayout] {
      justify-content: space-between;
    }

    .text-container {
      display: flex;
      flex-direction: column;
    }

    .label-text {
      color: var(--dm-shade-2);
      line-height: 1.375rem;
      font-weight: 500;

      &[size="small"] {
        font-size: 0.8125rem;
        line-height: 1.375rem;
      }

      &[size="medium"] {
        font-size: 0.875rem;
        line-height: initial;
      }
    }

    .sublabel-text {
      color: var(--dm-shade-4);
      font-size: 0.75rem;
      line-height: 100%;
    }
  }
}
.dm-toolbar {
  width: 100%;
  height: 5rem;
  display: flex;
  background: color-mix(in srgb, var(--dm-main-bg-color) 95%, transparent);
  justify-content: space-between;
  align-items: center;
  padding: 0 2rem;
  box-sizing: border-box;
  box-shadow: inset 0 -0.0625rem 0 var(--dm-shade-6);

  &[shadowHidden] {
    box-shadow: none;
  }

  .toolbar__part {
    gap: 1rem;
    display: flex;
    align-items: center;
  }

  .toolbar__title {
    display: flex;
    flex-direction: column;
    align-content: center;
    height: 2.5rem;
  }

  .toolbar__left {
    display: flex;
    gap: 0.5rem;
  }

  .toolbar__center {
    display: flex;
    gap: 0.5rem;
    align-items: center;
  }

  .toolbar__main-icon {
    width: 2.5rem;
  }

  .toolbar__title__caption {
    top: 0.25rem;
    position: relative;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.3px;
    color: var(--dm-color-primary);
    font-weight: 500;
  }
}
dm-vertical-bars-percent-chart {
  box-sizing: border-box;
  display: block;
  padding-top: 3rem;
  padding-bottom: 6rem;
  .chart-wrap {
    box-sizing: border-box;
    margin-left: 3rem;
    position: relative;
    display: flex;
    justify-content: space-between;

    .category-group {
      width: 4.6875rem;
      top: 100%;
      height: 0;
      position: relative;
      display: flex;
      gap: 0.625rem;
      justify-content: center;
      cursor: pointer;

      .highlight {
        opacity: 0;
        z-index: 2;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 6.25rem;
        background: var(--dm-shade-7);
        border-radius: 0.25rem;
        border: 1px solid rgba(45, 71, 158, 0.4);

        .tooltip-wrap {
          position: absolute;
          left: 50%;
          top: -4.25rem;
        }
        .h-tooltip {
          position: relative;
          left: -50%;
          background: var(--dm-shade-1);
          padding: 0.375rem 0.75rem;
          border-radius: 0.25rem;
          &:after {
            content: "";
            position: absolute;
            left: 50%;
            bottom: -0.1875rem;
            background: var(--dm-shade-1);
            display: block;
            width: 0.375rem;
            height: 0.375rem;
            transform-origin: center;
            transform: rotate(45deg);
          }

          & > div {
            display: flex;
            align-items: center;
            gap: 0.25rem;
            label {
              font-size: 0.8125rem;
              line-height: 167%;
              font-weight: 500;
              color: var(--dm-shade-8);
            }
          }
        }
      }

      &:hover {
        .highlight {
          opacity: 1;
        }
      }

      &.n:after {
        position: absolute;
        content: "";
        display: block;
        width: 100%;
        height: 0.0625rem;
        top: 0.0625rem;
        left: 0;
        background: red;
      }
      .bar {
        z-index: 3;
        position: relative;
        width: 1rem;

        span {
          color: var(--dm-shade-3);
          font-size: 0.6875rem;
          position: absolute;
          top: -1.25rem;
          left: -50%;
          width: calc(100% * 2);
          text-align: center;
          display: block;
        }
      }

      .category-label {
        z-index: 3;
        position: absolute;
        left: 0;
        bottom: -2rem;
        width: 100%;
        text-align: center;
        font-size: 0.8125rem;
        color: var(--dm-shade-3);
        font-weight: 500;
      }
    }

    .line {
      z-index: 1;
      position: absolute;
      left: 0;
      width: 100%;
      border-top: 1px solid var(--dm-shade-7);
      span {
        display: block;
        width: 2rem;
        text-align: right;
        font-size: 0.8125rem;
        color: var(--dm-shade-4);
        position: absolute;
        top: -0.5rem;
        left: -2.5rem;
      }
    }

    .legend-group {
      position: absolute;
      left: 0;
      bottom: -5.35rem;
      width: 100%;
      display: flex;
      justify-content: center;
      gap: 1.3125rem;

      label {
        font-size: 0.875rem;
        color: var(--dm-shade-2);
        font-weight: 500;
      }
    }
  }
  .dot {
    display: inline-block;
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    position: relative;
    top: -0.0625rem;
  }
}
dm-dropdown-daypart {
  .dropdown {
    width: 20rem;
  }

  .cover {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: color-mix(in srgb, var(--dm-shade-1) 30%, transparent);
    z-index: var(--dm-z-index-menu);
  }
  .wrapper {
    position: relative;
    background: var(--dm-shade-8);
    z-index: var(--dm-z-index-menu);
    border-radius: 0.25rem;

    .form-element.switch {
      border-bottom: 1px solid var(--dm-box-shadow);
      label {
        justify-content: space-between;
      }
      span {
        color: var(--dm-shade-1);
        font-size: 0.9375rem;
        font-weight: 500;
      }
    }

    .switches-list {
      display: flex;
      flex-direction: column;
      input {
        margin-right: 0.75rem;
      }
      span {
        font-size: 0.875rem;
        font-weight: 500;
        color: var(--dm-shade-3);
      }
    }

    label {
      cursor: pointer;
      padding: 0 1rem;
      height: 3rem;
      display: flex;
      align-items: center;
    }

    .popup-footer {
      height: 4rem;
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 1rem;
      padding: 0 1rem;
      border-top: 1px solid var(--dm-box-shadow);
      .primary-btn,
      .secondary-btn {
        font-size: 0.875rem;
        height: 2.3rem;
        padding: 0 2.3rem;
      }

      .primary-btn:disabled {
        background: color-mix(in srgb, var(--dm-shade-6) 70%, transparent);
        color: var(--dm-shade-5);
        cursor: default;
      }
    }
  }
}
dm-table-groups {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: relative;
  box-sizing: border-box;
  border-right: 1px solid var(--dm-shade-6);
  border-left: 1px solid var(--dm-shade-6);

  --dm-row-height: 3rem;
  --dm-column-width: 7.6rem;
  --dm-header-height: 5rem;

  --dm-table-borders: var(--dm-shade-6) 1px solid;
  --dm-table-group-borders: var(--dm-shade-5) 1px solid;

  .dm-scrollbar {
    &::-webkit-scrollbar {
      width: 0.5rem;
      height: 0.5rem;
    }
    &::-webkit-scrollbar-track {
      background: var(--dm-color-background);
    }
    &::-webkit-scrollbar-thumb {
      background: var(--dm-shade-5);
    }
  }

  .table-wrap {
    display: grid;
    grid-template-columns: 21rem 1fr 3rem;
    background: var(--dm-shade-8);
    height: 100%;
    width: 100%;
    overflow-y: auto;
  }

  .table-header-fixed {
    position: absolute;
    top: 0;
    left: 0;
    height: auto;
    z-index: var(--dm-z-index-accent);
    .m-part {
      overflow: hidden;
    }
  }

  .scroller-helper {
    position: absolute;
    bottom: 0;
    left: 0;
    height: auto;
    z-index: var(--dm-z-index-accent);

    .header-row {
      height: 0.0625rem !important;
      visibility: hidden;
    }
  }

  .l-part {
    background: var(--dm-shade-8);
    position: relative;
    border-right: var(--dm-table-borders);

    &:after {
      content: "";
      display: block;
      background: linear-gradient(90deg, rgba(5, 30, 72, 0.06) 0%, rgba(5, 30, 72, 0) 100%);
      width: 0.5rem;
      height: 100%;
      position: absolute;
      top: 0;
      left: 100%;
      z-index: var(--dm-z-index-accent);
      pointer-events: none;
    }
  }
  .m-part {
    background: var(--dm-shade-8);
    overflow-x: auto;
    overflow-y: hidden;
  }
  .r-part {
    background: var(--dm-shade-8);
    position: relative;
    border-left: 1px solid var(--dm-shade-6);
    border-right: 1px solid var(--dm-shade-6);

    &:before {
      content: "";
      display: block;
      position: absolute;
      left: -0.5rem;
      width: 0.5rem;
      height: 100%;
      background: linear-gradient(270deg, rgba(5, 30, 72, 0.08) 0%, rgba(5, 30, 72, 0) 100%);
    }
  }

  .l-part {
    .header-row {
      height: var(--dm-header-height);
      box-sizing: border-box;
      border-bottom: var(--dm-table-borders);
    }
    .row-group {
      position: relative;

      .row-group-cell {
        overflow: hidden;
        width: 100%;
        height: 100%;
        box-sizing: border-box;
        border-bottom: var(--dm-table-borders);
        border-right: var(--dm-table-borders);
        &.nrb {
          border-right: none;
        }
      }
      .row-cell {
        height: var(--dm-row-height);
        width: 100%;
        display: inline-flex;
        box-sizing: border-box;
        align-items: center;
        padding: 0.25rem 0.75rem;
        overflow: hidden;
        span {
          color: var(--dm-shade-2);
          font-size: 0.8125rem;
          font-weight: 500;

          max-height: 2.3rem;

          overflow: hidden;
          text-overflow: ellipsis;
          -webkit-line-clamp: 2;
          -webkit-box-orient: vertical;
          display: -webkit-box;
        }
      }

      &.total-row-group {
        height: 3rem;
        .row-cell {
          border-right: none;
          display: flex;
          align-items: center;
          gap: 0.5rem;
          width: 100%;
          span {
            text-transform: uppercase;
            font-size: 0.75rem !important;
            color: var(--dm-shade-4) !important;
          }
        }
      }
    }
  }

  .m-part {
    .header-row {
      width: max-content;
      display: flex;
      flex-shrink: 0;
      background: var(--dm-color-background);
    }
    .column-group {
      display: inline-flex;
      position: relative;
      align-items: flex-end;

      &.total-group {
        background: var(--dm-shade-9);
      }

      .header-cell {
        width: 100%;
        height: 100%;
        display: flex;
        box-sizing: border-box;
        align-items: center;
        padding: 0.25rem 0.75rem;
        overflow: hidden;
        border-right: var(--dm-table-borders);
        border-bottom: var(--dm-table-borders);
        color: var(--dm-shade-2);

        &.group-border {
          border-right: var(--dm-table-group-borders);
        }
      }

      .column-group-cell {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        box-sizing: border-box;
        border-bottom: var(--dm-table-borders);
        border-right: var(--dm-table-group-borders);

        padding: 0.25rem 0.75rem;
        display: flex;
        gap: 0.5rem;
        align-items: center;
        overflow: hidden;

        & > span {
          font-size: 0.8125rem;
          font-weight: 600;
          color: var(--dm-shade-2);
          white-space: nowrap;
          text-overflow: ellipsis;
          overflow: hidden;
        }

        .total-img {
          filter: brightness(0.8);
        }
      }

      .default-header-cell {
        display: inline-flex;
        max-width: 100%;
        height: 100%;
        box-sizing: border-box;
        align-items: center;
        overflow: hidden;

        span {
          display: flex !important;
          gap: 0.25rem;
          align-items: center;
          color: var(--dm-shade-2);
          font-size: 0.6875rem;
          max-height: 2.3rem;

          overflow: hidden;
          text-overflow: ellipsis;
          -webkit-line-clamp: 2;
          -webkit-box-orient: vertical;
          display: -webkit-box;
        }

        dm-notification-month-change-icon {
          position: static;
        }
      }
    }

    .data-row {
      width: max-content;
      display: flex;
      flex-shrink: 0;
      .data-cell {
        display: inline-flex;
        width: var(--dm-column-width);
        height: var(--dm-row-height);
        box-sizing: border-box;
        padding: 0.25rem 0.75rem;
        align-items: center;
        overflow: hidden;
        border-bottom: var(--dm-table-borders);
        border-right: var(--dm-table-borders);
        &.lig {
          border-right: var(--dm-table-group-borders);
        }
        span {
          color: var(--dm-shade-3);
          font-size: 0.8125rem;
          font-weight: 500;
        }
      }
    }
  }

  .r-part {
    .header-cell {
      width: 100%;
      height: 2.5rem;
      border-bottom: var(--dm-table-borders);
      box-sizing: border-box;
      background: var(--dm-color-background);
    }
    .action-cell {
      display: flex;
      align-items: center;
      width: 100%;
      height: var(--dm-row-height);
      border-bottom: var(--dm-table-borders);
      justify-content: center;
      box-sizing: border-box;
    }
  }

  .cell__sub-value {
    color: var(--dm-shade-4) !important;
  }
}
.report-results__higlighted-cell--sum {
}
.dm-modal {
  --dm-padding: 3rem;

  .container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: var(--dm-z-index-modal);

    display: flex;
    justify-content: center;
    align-items: center;
    animation: fadeIn 500ms ease;

    &[closing] {
      animation: fadeOut 250ms ease;
      animation-fill-mode: forwards;
    }
  }

  .modal {
    z-index: var(--dm-z-index-modal);
    position: absolute;
    width: 34rem;
    animation:
      fadeIn 300ms,
      slideUp 300ms;
    animation-timing-function: ease;
    animation-fill-mode: forwards;

    border-radius: 0.25rem;
    overflow: auto;
    background-color: var(--dm-main-bg-color);
    filter: drop-shadow(0 0.5rem 1rem rgba(0, 0, 0, 0.25));

    &[closing] {
      animation:
        fadeOut 150ms,
        slideDown 150ms;
      animation-timing-function: ease;
      animation-fill-mode: forwards;
    }
  }

  .modal__content {
    overflow: auto;
    max-height: 60vh;
    padding: 0 var(--dm-padding) var(--dm-padding) var(--dm-padding);
    font-size: 0.9375rem;
    line-height: 1.5rem;
    letter-spacing: 0.2px;
    color: var(--dm-shade-1);
  }

  .modal__header {
    padding: var(--dm-padding) var(--dm-padding) 1.5rem var(--dm-padding);
  }

  .modal__footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 1.5rem;

    background: var(--dm-shade-8);
    padding: 1rem var(--dm-padding);
    box-shadow: inset 0 0.0625rem 0 var(--dm-shade-6);
  }
}
dm-notification-month-change-icon {
  display: flex;
  align-items: center;
  z-index: var(--dm-z-index-element);
  cursor: pointer;
  background-color: var(--dm-shade-8);
  border-radius: 0.625rem;

  .dm-notification-month-change-icon--size--small {
    height: 1rem;
    width: 1rem;
  }

  .dm-notification-month-change-icon--size--medium {
    height: 1.25rem;
    width: 1.25rem;
  }

  .month-change-notification-icon__image-holder {
    opacity: 0.7;
  }

  .month-change-notification-icon__image-holder:hover {
    opacity: 1;
  }
}
.month-change-notification-icon__tooltip {
  .dm-tooltip__content {
    padding: 0 1rem 1rem 1rem;
  }

  h3 {
    color: var(--dm-shade-8);
    font-weight: 700;
    font-size: 0.8125rem;
    line-height: 0.9375rem;
    opacity: 0.9;
  }

  p {
    color: var(--dm-shade-5);
    font-weight: 500;
    font-size: 0.8125rem;
    line-height: 130%;
  }
}
dm-month-select {
  .year-select-holder {
    display: flex;
    justify-content: space-between;
    margin-bottom: 1.5rem;

    .dropdown-with-label {
      width: 10rem;
    }

    .page-controls {
      display: flex;
      gap: 0.5rem;
      align-items: center;
      .months-browser-btn {
        position: relative;
        height: auto;
        display: inline-flex;
        align-items: center;

        &.previous-btn,
        &.next-btn {
          cursor: pointer;
          left: auto;
          right: auto;
          img {
            height: 2rem;
          }
        }
      }
    }
  }

  .months-browser {
    display: flex;
    gap: 1.5rem;
    flex-flow: wrap;
    justify-content: space-between;
    position: relative;
  }

  .month-item {
    cursor: pointer;
    position: relative;
    width: 13.125rem;
    height: 6.5rem;
    background: color-mix(in srgb, var(--dm-shade-8) 50%, transparent);
    border: 1px solid var(--dm-shade-6);
    border-radius: 0.25rem;
    display: flex;
    align-items: center;
    padding: 1rem;
    box-sizing: border-box;
    filter: drop-shadow(0 0.25rem 2rem rgba(0, 0, 0, 0));

    &[disabled] {
      opacity: 0.3;
      pointer-events: none;
    }
    &:hover {
      background: color-mix(in srgb, var(--dm-shade-8) 100%, transparent);
    }
    &.selected {
      filter: drop-shadow(0 0.25rem 2rem rgba(0, 0, 0, 0.12));
      background: color-mix(in srgb, var(--dm-shade-8) 100%, transparent);
      outline: 0.175rem solid var(--dm-color-primary);
    }
    .month {
      font-size: 1rem;
      color: var(--dm-color-neu);
      line-height: 120%;
      font-weight: 500;
      margin-bottom: 0.2rem;
    }
    .year {
      font-size: 0.75rem;
      line-height: 120%;
      color: var(--dm-shade-4);
    }
    .month-graphic {
      position: absolute;
      right: 0;
      bottom: 0;
      img {
        position: absolute;
        bottom: 0;
        right: 0;
      }
      .month-num {
        display: block;
        position: absolute;
        right: 1.3rem;
        bottom: 1.2rem;
        width: 3.1rem;
        height: 2.1rem;
        line-height: 2.5rem;
        text-align: center;
        span {
          color: color-mix(in srgb, var(--dm-color-neu) 50%, transparent);
          font-size: 1.5rem;
        }
      }
    }
  }
  .month-item__notification-month-change {
    position: absolute;
    top: 0.4rem;
    right: 0.28rem;
  }
}
.already-selected-month-item {
  .already-selected__label {
    display: flex;
  }

  .already-selected__label__title {
    color: var(--dm-color-category-6);
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 120%;
    width: 5rem;
    margin-bottom: 1rem;
  }

  .already-selected__label__date {
    position: absolute;
    color: var(--dm-shade-3);
    line-height: 120%;
    font-size: 0.625rem;
    top: 5rem;
  }
}
dm-text {
  display: flex;
  overflow: hidden;

  .dm-text[hidden-overflow] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}
.item-list--draggable {
  &.drag-disabled {
    .drag-icon {
      opacity: 0.3;
    }
  }

  .item--draggable {
    .drag-icon {
      cursor: move;
    }

    &.dragging {
      opacity: 0.5;
    }

    &.drop-target {
      &:after {
        content: "";
        display: block;
        width: 100%;
        position: absolute;
        top: -0.3rem;
        left: 0;
        height: 0.075rem;
        background: var(--dm-color-primary);
      }

      &.drop-after:after {
        top: calc(100% + 0.3rem);
      }
    }
  }
}
dm-editor {
  .editor {
    border: 0.0625rem solid var(--dm-shade-5);
    box-sizing: border-box;
    border-radius: 0.25rem;
    background: var(--dm-shade-8);

    &:focus {
      border-color: var(--dm-color-primary);
    }

    &[readOnly] {
      border: none;
      background: var(--dm-shade-6);
      color: var(--dm-shade-4);
    }

    &[renderOnly] {
      border: none;
    }

    /* VENDOR */
    .editor__quill {
      border: none;
    }

    &[renderOnly] {
      .ql-editor {
        padding: 0;
      }

      .ql-clipboard {
        display: none;
      }
    }

    &[codeFormatting] {
      .ql-editor {
        font-family: "Courier";
      }
    }

    .ql-toolbar {
      background: none;
      padding: 1rem;
      border: none;
      border-bottom: 1px solid var(--dm-shade-5);
    }

    .ql-container {
      border: none;
    }

    .ql-editor {
      background: none;
      font-family: "proxima-nova";
      font-size: 0.9375rem;
      padding: 0.5rem 1rem 3rem 1rem;
      line-height: 150%;
      color: var(--dm-shade-1);

      h1 {
        font-size: 1.125rem;
        line-height: 1.375rem;
        font-weight: 600;
        color: var(--dm-shade-1);
        margin-bottom: 1rem;
      }

      h2 {
        font-size: 0.9375rem;
        line-height: 1.375rem;
        font-weight: bold;
        color: var(--dm-shade-2);
        margin-bottom: 0.5rem;
      }

      p {
        margin-bottom: 0;
        margin-top: 0;
      }

      a {
        color: inherit;
      }
    }

    .ql-formats > button {
      mix-blend-mode: normal;
      background: color-mix(in srgb, var(--dm-shade-8) 70%, transparent);
      border: 0.0625rem solid var(--dm-shade-5);
      box-sizing: border-box;
      border-radius: 0.25rem;

      padding: 0.35rem;
      margin-right: 0.75rem;
      width: 2rem;
      height: 2rem;
    }
  }
}
dm-emails {
  .email-table {
    display: grid;
    grid-template-rows: 1fr auto;
    overflow: auto;
    width: 100%;
    height: 100%;
    box-sizing: border-box;

    .table-container {
      height: 100%;
      overflow: auto;
    }

    .dm-table {
      height: 100%;
      overflow: hidden;
    }

    .dm-table tr {
      grid-auto-flow: column;
      grid-template-columns: 2fr 1fr 2fr 3fr 1fr 0.5fr;
    }
  }
}
dm-entity-deduplications {
  #main-viewport {
    display: grid;
    grid-template-rows: 1fr auto;
  }
}
.dm-filter-by-select__dropdown .dropdown {
  cursor: auto;
  max-height: 35rem;

  .dropdown__footer {
    padding: 0.75rem;
    display: flex;
    justify-content: space-between;
  }

  .dropdown__button {
    width: 50%;

    &:first-of-type {
      margin-right: 1.25rem;
    }
  }
}
.dm-filter-by {
  width: 100%;
  background-color: var(--dm-shade-8);
  display: inline-block;

  .header {
    padding: 1rem 1rem 0.75rem 1rem;
    line-height: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-shadow: inset 0 -0.0625rem 0 var(--dm-box-shadow);
  }

  .header__toggle-all {
    width: 2.375rem;
    height: 1.25rem;
  }

  .options {
    max-height: 27rem;
    overflow: auto;
  }

  .option {
    padding: 0.8125rem 1.1875rem;
    line-height: 1.375rem;
    box-shadow: inset 0 -0.0625rem 0 var(--dm-box-shadow);
    display: grid;
    grid-template-columns: auto auto 1fr;
  }

  .option__input {
    margin-right: 1rem;
  }

  .option__type {
    align-self: center;

    background-color: color-mix(in srgb, var(--dm-shade-4) 80%, transparent);
    height: 1rem;
    width: 2.5rem;
    border-radius: 0.125rem;
    font-size: 0.5625rem;
    line-height: normal;
    color: var(--dm-color-static);
    text-transform: uppercase;
    font-weight: bold;

    display: flex;
    align-items: center;
    justify-content: center;
  }

  .option__label {
    display: flex;
    flex-direction: column;
    margin-left: 0.5rem;
  }

  .option__subLabel {
    font-size: 0.75rem;
    color: var(--dm-shade-3);
    line-height: 0.625rem;
  }

  .uppercase {
    text-transform: uppercase;
  }
}
dm-flow-chart {
  background: var(--dm-shade-8);
  border: 1px solid var(--dm-shade-6);
  box-sizing: border-box;
  border-radius: 0.25rem;
  display: inline-block;

  .flow-chart__element {
    &[dragging="true"] {
      .flow-chart__element__rect {
        stroke: var(--dm-color-secondary);
        stroke-width: 2px;
      }
    }

    cursor: pointer;
  }

  .flow-chart__element__rect--theme-1 {
    fill: #cde1fa;
  }

  .flow-chart__element__rect--theme-2 {
    fill: #d2e7db;
  }

  .flow-chart__element__rect--theme-3 {
    fill: #fff4cc;
  }

  .flow-chart__element__label {
    font-size: 0.875rem;
  }

  .flow-chart__link {
    stroke: var(--dm-shade-4);
    stroke-width: 2px;

    cursor: pointer;
  }

  .flow-chart__link__arrow {
    fill: var(--dm-shade-4);
  }
}
input::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: var(--dm-shade-4);
}
input::-moz-placeholder {
  /* Firefox 19+ */
  color: var(--dm-shade-4);
}
input:-ms-input-placeholder {
  /* IE 10+ */
  color: var(--dm-shade-4);
}
input:-moz-placeholder {
  /* Firefox 18- */
  color: var(--dm-shade-4);
}
input[type="number"] {
  -moz-appearance: textfield;
}
.primary-btn.icon-btn {
  padding: 0 1.875rem 0 1rem;
  display: flex;
  align-items: center;
}
.form-section {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto;
  grid-gap: 1.5rem;
  box-sizing: border-box;
  padding: 1rem 3rem 2rem 3rem;
  &.grid-1 {
    grid-template-columns: 1fr;
  }

  &.grid-3 {
    grid-template-columns: 1fr 1fr 1fr;
  }

  .span-2 {
    grid-column: span 2;
  }

  .span-3 {
    grid-column: span 3;
  }
}
.dm-modal {
  .form-section {
    padding: 0;
  }
}
.form-element {
  z-index: var(--dm-z-index-element);

  &.text-input {
    label {
      display: inline-block;
      color: var(--dm-shade-3);
      margin-bottom: 0.375rem;
      span {
        font-size: 0.75rem;
        font-weight: 500;
        text-transform: uppercase;
        &.sub {
          padding-left: 0.5rem;
          color: var(--dm-shade-4);
          text-transform: initial;
        }
      }
    }
    input,
    textarea {
      background: var(--dm-shade-8);
      border: 1px solid var(--dm-shade-5);
      box-sizing: border-box;
      border-radius: 0.25rem;
      outline: none;
      font-size: 0.875rem;
      padding: 0.75rem 1rem;
      width: 100%;
      height: 2.5rem;
      font-weight: 500;
      color: var(--dm-shade-1);
      font-family: "proxima-nova", sans-serif;
      &:focus-within {
        border-color: var(--dm-color-primary);
      }
      &:focus {
        border-color: var(--dm-color-primary);
      }
      &:disabled {
        background: var(--dm-shade-6);
        border: none;
        color: var(--dm-shade-4);
      }

      &[type="code"] {
        font-family: "Courier";
        font-style: normal;
        font-weight: 400;
        font-size: 0.875rem;
        line-height: 1.125rem;
      }
    }

    input[type="number"]::-webkit-inner-spin-button,
    input[type="number"]::-webkit-outer-spin-button {
      -webkit-appearance: none;
      margin: 0;
    }

    textarea {
      height: 15rem;
      resize: none;
      font-size: 0.875rem;
      &:focus {
        border-color: var(--dm-color-primary);
      }
    }
  }

  &.text-display {
    label {
      display: inline-block;
      color: var(--dm-shade-3);
      margin-bottom: 0.375rem;
      span {
        font-size: 0.75rem;
        font-weight: 500;
        text-transform: uppercase;
        &.sub {
          padding-left: 0.5rem;
          color: var(--dm-shade-4);
          text-transform: initial;
        }
      }
    }
    div {
      height: auto;
      background: var(--dm-shade-8);
      outline: none;
      font-size: 0.9375rem;
      padding: 0.75rem 1rem;
      width: 100%;
      min-height: 16rem;
      color: var(--dm-shade-1);
      font-weight: normal;
      font-family: Courier;
      white-space: pre-wrap;
    }
  }

  &.checkbox-input {
    label {
      cursor: pointer;
      display: flex;
      align-items: center;
      span {
        font-size: 0.9375rem;
        color: var(--dm-shade-1);
      }

      input[type="checkbox"] {
        width: 1rem;
        height: 1rem;
        position: relative;
        font-size: 1rem;
        margin: 0;
        cursor: pointer;
        outline: none;
        -moz-appearance: initial;
        visibility: hidden;

        :disabled {
          cursor: default;
        }

        &:after {
          content: url(/images/checkbox-unchecked.svg);
          display: inline-block;
          width: 1rem;
          height: 1rem;
          opacity: 1;
          visibility: visible;
        }

        &:checked:after {
          content: url(/images/checkbox-checked.svg);
          visibility: visible;
        }

        &:not(:checked):disabled:after {
          content: url(/images/checkbox-unchecked-disabled.svg);
          visibility: visible;
        }

        &:checked:disabled:after {
          content: url(/images/checkbox-checked-disabled.svg);
          visibility: visible;
        }

        &[indeterminate]:disabled:after {
          content: url(/images/checkbox-indeterminate-disabled.svg);
          visibility: visible;
        }

        &[indeterminate]:after {
          content: url(/images/checkbox-indeterminate.svg);
          visibility: visible;
        }
      }
    }
  }

  &.checkbox-group {
    .group-label {
      display: block;
      color: var(--dm-shade-3);
      margin-bottom: 1.375rem;

      span {
        font-size: 0.75rem;
        font-weight: 500;
        text-transform: uppercase;
      }
    }
    .group {
      display: flex;

      &.group-inline {
        display: inline-block;
      }

      &.grid-group {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-gap: 1rem;
      }
      label {
        margin-right: 2.5rem;
        cursor: pointer;
        display: flex;
        align-items: center;
        span {
          font-size: 0.875rem;
          color: var(--dm-shade-1);
        }

        input[type="checkbox"] {
          width: 1rem;
          height: 1rem;
          position: relative;
          font-size: 1rem;
          cursor: pointer;
          margin-right: 0.5rem;
          outline: none;
          -moz-appearance: initial;
          visibility: hidden;

          :disabled {
            cursor: default;
          }

          &:after {
            content: url(/images/checkbox-unchecked.svg);
            display: inline-block;
            width: 1rem;
            height: 1rem;
            opacity: 1;
            visibility: visible;
          }

          &:checked:after {
            content: url(/images/checkbox-checked.svg);
            visibility: visible;
          }

          &:not(:checked):disabled:after {
            content: url(/images/checkbox-unchecked-disabled.svg);
            visibility: visible;
          }

          &:checked:disabled:after {
            content: url(/images/checkbox-checked-disabled.svg);
            visibility: visible;
          }

          &[indeterminate]:disabled:after {
            content: url(/images/checkbox-indeterminate-disabled.svg);
            visibility: visible;
          }

          &[indeterminate]:after {
            content: url(/images/checkbox-indeterminate.svg);
            visibility: visible;
          }
        }

        input[type="radio"] {
          width: 1rem;
          height: 1rem;
          position: relative;
          font-size: 1rem;
          margin: 0;
          cursor: pointer;
          outline: none;
          -moz-appearance: initial;
          visibility: hidden;

          :disabled {
            cursor: default;
          }

          &:after {
            content: url(/images/radio-off.svg);
            display: inline-block;
            width: 1rem;
            height: 1rem;
            opacity: 1;
            visibility: visible;
          }

          &:checked:after {
            content: url(/images/radio-on.svg);
            visibility: visible;
          }

          &:not(:checked):disabled:after {
            content: url(/images/radio-off-disabled.svg);
            visibility: visible;
          }

          &:checked:disabled:after {
            content: url(/images/radio-on-disabled.svg);
            visibility: visible;
          }
          margin-right: 0.5rem;
        }
      }
    }
  }

  &.separator {
    width: 100%;
    display: block;
    border-bottom: 1px solid var(--dm-shade-6);
  }

  &.group-separator {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-gap: 0.75rem;
    align-items: center;

    &.w-icon {
      grid-template-columns: auto 1fr auto;
    }
    span {
      font-size: 0.75rem;
      color: var(--dm-shade-4);
      font-weight: 600;
    }
    .line {
      border-top: 1px solid color-mix(in srgb, var(--dm-shade-5) 50%, transparent);
    }
  }

  &.add-new-control {
    display: flex;
    flex-direction: column;
    .top-label {
      font-size: 0.75rem;
      color: var(--dm-shade-3);
      margin-top: 1.85rem;
      margin-bottom: 0.25rem;
    }
    .add-button {
      display: flex;
      align-items: center;
      img {
        margin-right: 0.5rem;
      }
    }
    .main-label {
      color: var(--dm-shade-3);
      font-weight: 500;
      font-size: 0.875rem;
      border-bottom: 1px solid color-mix(in srgb, var(--dm-shade-3) 50%, transparent);
      padding: 0.2rem 0rem;
    }
  }

  &.select-control {
    position: relative;
    z-index: auto;

    dm-select {
      height: 3rem;
    }

    .label-holder {
      display: flex;
      justify-content: space-between;
      margin-bottom: 0.375rem;
    }

    label {
      display: inline-block;
      color: var(--dm-shade-3);
      span {
        font-size: 0.75rem;
        font-weight: 500;
        text-transform: uppercase;
        &.sub {
          padding-left: 0.5rem;
          color: var(--dm-shade-4);
          text-transform: initial;
        }
      }
    }
    .select-button {
      position: relative;
      cursor: pointer;
      padding: 0 0.75rem;
      display: grid;
      grid-template-columns: 1fr auto;
      align-items: center;
      grid-gap: 1.75rem;
      height: 2.5rem;
      .selected-item,
      .placeholder-text {
        color: var(--dm-shade-1);
        font-size: 0.9375rem;
      }
      .placeholder-text {
        color: var(--dm-shade-4);
      }
      .icon {
        margin-left: auto;
      }
      select {
        cursor: pointer;
        position: absolute;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
      }
    }

    &.disabled {
      .select-button {
        background: var(--dm-shade-6);
        border: none;
        color: var(--dm-shade-4);
        pointer-events: none;
        .selected-item {
          color: var(--dm-shade-4);
        }
      }
    }

    &.multiselect {
      .select-button {
        height: auto;
        min-height: 3rem;
        overflow: hidden;
        grid-gap: 0.5rem;
      }

      .multiselect-output {
        display: none;
      }
    }

    &.small-select {
      width: max-content;

      .select-button:focus-within {
        border-color: var(--dm-shade-5);
      }
      /*font-size: .5rem;*/
      label {
        display: none;
      }
      .select-button {
        height: 1.5rem;
        width: auto;
        grid-gap: 0.5rem;
        padding: 0 0.25rem 0 0.5rem;
      }
      .placeholder-text,
      .selected-item {
        font-size: 0.815rem;
        color: var(--dm-shade-3);
      }
    }
  }

  &.switch {
    label {
      cursor: pointer;
      display: flex;
      align-items: center;

      position: relative;
      top: 0.15rem;
      span {
        font-weight: 500;
        font-size: 0.9375rem;
        color: var(--dm-shade-3);
      }
    }
    input[type="checkbox"] {
      -moz-appearance: initial;
      width: 1rem;
      height: 1rem;
      position: relative;
      font-size: 1rem;
      margin: 0;
      margin-left: 0.75rem;
      cursor: pointer;
      outline: none;
      position: relative;
      top: -0.09375rem;

      width: 2.375rem;
      height: 1.25rem;
      display: inline-flex;
      align-items: center;

      &:before {
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        border-radius: 0.625rem;
        background: var(--dm-shade-5);
      }
      &:after {
        content: "";
        height: 1rem;
        width: 1rem;
        border-radius: 50%;
        background: var(--dm-shade-8);
        position: absolute;
        margin: 0 0.125rem;
        box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.15);
      }
      &:checked:before {
        background: var(--dm-color-category-5);
      }
      &:checked:after {
        left: auto;
        right: 0;
      }
    }
  }

  &.favicon-input {
    label {
      display: inline-block;
      color: var(--dm-shade-3);
      margin-bottom: 0.375rem;
      span {
        font-size: 0.75rem;
        font-weight: 500;
        text-transform: uppercase;
        &.sub {
          padding-left: 0.5rem;
          color: var(--dm-shade-4);
          text-transform: initial;
        }
      }
    }
    input {
      display: none;
    }
    .favicon-controls {
      height: 2.5rem;
      background: var(--dm-shade-7);
      border: 1px dashed var(--dm-shade-5);
      display: grid;
      grid-template-columns: 3rem 1fr;

      .icon-holder {
        background: url(/images/ic-image-upload.svg);
        background-repeat: no-repeat;
        background-position: center;
        border-right: 1px dashed var(--dm-shade-5);
        display: flex;
        justify-content: center;
        align-content: center;
        overflow: hidden;
        img {
          max-width: 100%;
          max-height: 100%;
          object-fit: contain;
        }
        &.no-bg {
          background: none;
        }
      }

      .display {
        width: 100%;
        align-self: center;
        justify-self: center;
        font-size: 0.875rem;
        color: var(--dm-shade-3);
        padding: 0 1.5rem 0 0.75rem;
        box-sizing: border-box;
        button {
          color: var(--dm-shade-3);
          border-bottom: 1px solid var(--dm-shade-5);
          padding: 0.125rem 0;
        }
        input {
          width: 100%;
          background: none;
          border: none;
          height: 2.5rem;
          color: var(--dm-shade-1);
          &:focus {
            outline: none;
          }
        }

        .idle,
        .searching {
          text-align: center;
        }
        .found {
          display: flex;
          justify-content: flex-end;
        }
        .not-found {
          display: flex;
          justify-content: space-between;
          align-items: center;
          .buttons-holder {
            display: grid;
            grid-template-columns: auto auto;
            grid-gap: 1.5rem;
          }
        }
      }
    }
  }
}
.dropdown-with-label {
  cursor: pointer;
  display: grid;
  grid-template-columns: auto 1fr auto;
  grid-gap: 0.5rem;
  align-items: center;
  padding: 0.5rem 1rem 0.5rem 0.75rem;
  position: relative;
  label {
    color: var(--dm-shade-4);
    font-size: 0.875rem;
    white-space: nowrap;
  }
  .selected-item {
    color: var(--dm-shade-1);
    font-size: 0.875rem;
  }

  select {
    cursor: pointer;
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
}
.search-control {
  height: 2.5rem;
  background: var(--dm-shade-8);
  border: 1px solid var(--dm-shade-5);
  box-sizing: border-box;
  border-radius: 0.25rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  padding: 0.5rem 1rem;
  &:focus-within {
    border-color: var(--dm-color-primary);
  }
}
.simple-tools-group {
  display: flex;
  align-items: center;
  & > * {
    margin-right: 0.25rem;
  }
  & > :last-child {
    margin-right: 0;
  }

  &.disabled {
    pointer-events: none;
    opacity: 0.3;
  }
}
.search-select-popup {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(17, 21, 31, 0.2);
  z-index: var(--dm-z-index-menu);
  .search-select-control {
    width: 22rem;
    height: 26.5rem;
    display: grid;
    grid-template-rows: auto 1fr auto;
    position: absolute;
    top: 9rem;
    left: 2rem;
    background: var(--dm-shade-8);
    box-shadow: 0 0.25rem 1rem rgba(0, 0, 0, 0.15);
    border-radius: 0.25rem;
    overflow: hidden;
    .search-control-block {
      height: 4.75rem;
      background: color-mix(in srgb, var(--dm-shade-6) 30%, transparent);
      padding: 0.5rem 1rem 1rem 1rem;
      box-sizing: border-box;
      box-shadow: inset 0 -0.0625rem 0 color-mix(in srgb, var(--dm-shade-5) 30%, transparent);
      .text-input {
        label {
          span {
            color: var(--dm-shade-4);
            font-size: 0.625rem;
          }
        }
        .input-wrap {
          position: relative;
          .icon {
            width: 1rem;
            height: 1rem;
            position: absolute;
            top: 0.5rem;
            left: 0.5rem;
          }
        }

        input {
          font-size: 0.8125rem;
          height: 2.46rem;
          padding-left: 2.46rem;
          background: var(--dm-shade-8);
        }
      }
    }

    .search-results-block {
      position: relative;
      overflow-x: hidden;
      overflow-y: auto;
      ol {
        margin: 0;
        padding: 0;
        list-style: none;
        li {
          font-size: 0.875rem;
          line-height: 157%;
          padding: 0.64rem 1.14rem;
          box-shadow: inset 0 -0.0625rem 0 var(--dm-box-shadow);
        }
      }
    }

    .additional-controls-block {
      position: relative;
      height: 3rem;
      background: color-mix(in srgb, var(--dm-shade-6) 30%, transparent);
      &:after {
        content: "";
        display: block;
        position: absolute;
        background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 100%);
        opacity: 0.05;
        height: 1rem;
        width: 100%;
        top: -1rem;
        left: 0;
      }
    }
  }
}
.paging-controls {
  display: grid;
  grid-template-columns: auto auto auto auto auto;
  margin-top: 0.875rem;
  grid-gap: 1rem;
  align-items: center;
  justify-content: end;
  .paging-label,
  .page-info {
    font-size: 0.8125rem;
    color: var(--dm-shade-3);
  }
  .buttons {
    display: grid;
    grid-template-columns: auto auto auto;
    grid-gap: 0.75rem;
    button {
      font-family: inherit;
      padding: 0;
      color: inherit;
      cursor: pointer;
      opacity: inherit;
      background: none;
      pointer-events: inherit;
      &:focus {
        outline: none;
      }
      background: color-mix(in srgb, var(--dm-shade-8) 50%, transparent);
      border: 1px solid var(--dm-shade-6);
      border-radius: 0.25rem;
      width: 1.5rem;
      height: 1.5rem;
      display: flex;
      align-items: center;
      justify-content: center;
    }
  }

  .separator {
    border-left: 1px solid var(--dm-shade-6);
    height: 1.25rem;
  }
}
dm-datepicker {
  label {
    display: inline-block;
    color: var(--dm-shade-3);
    margin-bottom: 0.375rem;
    span {
      font-size: 0.75rem;
      font-weight: 500;
      text-transform: uppercase;
      &.sub {
        padding-left: 0.5rem;
        color: var(--dm-shade-4);
        text-transform: initial;
      }
    }
  }

  .standard-datepicker {
    position: relative;

    input {
      outline: none;
      font-size: 0.875rem;
      padding: 0.75rem 1rem;
      width: 100%;
      height: 2.5rem;
      color: var(--dm-shade-1);
      font-weight: normal;
      font-family: inherit;
      &:focus {
        border-color: var(--dm-color-primary);
      }
      &:disabled {
        background: var(--dm-shade-6);
        border: none;
        color: var(--dm-shade-4);
      }
      &::placeholder {
        color: var(--dm-shade-2);
        font-weight: 500;
      }
    }

    .icn {
      position: absolute;
      top: 0.5rem;
      right: 0.75rem;
      pointer-events: none;
    }

    .clear-end-date-btn {
      position: absolute;
      top: 0.5rem;
      right: 3rem;
      cursor: pointer;
    }
  }

  .inline-label-datepicker {
    position: relative;
    cursor: pointer;
    display: grid;
    grid-template-columns: auto 1fr auto;
    grid-gap: 0.375rem;
    align-items: center;
    padding: 0 1rem 0 0.75rem;

    label {
      pointer-events: none;
      overflow: initial;
      white-space: nowrap;
      margin: 0;
      span {
        font-size: 0.875rem;
        color: var(--dm-shade-4);
        text-transform: none;
      }
    }

    input {
      font-family: "proxima-nova", sans-serif;
      min-width: 3rem;
      border: none;
      background: none;
      color: var(--dm-shade-1);
      font-size: 0.875rem;
      &:focus {
        outline: none;
        border: none;
      }
      &::placeholder {
        color: var(--dm-shade-2);
        font-weight: 500;
      }
    }

    .clear-end-date-btn {
      position: absolute;
      right: 3.5rem;
      cursor: pointer;
      width: 1rem;
    }
  }
}
.standard-form {
  .std-form-section {
    margin-bottom: 2.5rem;

    h3 {
      font-size: 1rem;
      color: var(--dm-shade-1);
      font-weight: 500;
      line-height: 187%;
      padding: 0.8125rem 0;
      border-bottom: 1px solid var(--dm-shade-6);
      box-sizing: border-box;
      margin: 0;
    }

    p {
      font-size: 0.9375rem;
      margin: 1.6rem 0;
      color: var(--dm-shade-3);
      a {
        color: var(--dm-color-primary);
      }
    }

    .form-element {
      display: block;
      margin-bottom: 1.5rem;
      width: 26rem;
      &.checkbox-group {
        width: 100%;
      }
    }

    button.special {
      background: var(--dm-color-neu);
    }
  }
}
dm-general-settings {
  #main-viewport {
    padding: 0 !important;
    display: grid;
    grid-template-rows: 1fr auto;
  }

  .settings-form-wrapper {
    overflow-y: auto;
  }

  dm-preloader {
    margin: 2rem;
  }
}
.general-settings-controls {
  padding: 1.25rem 3rem;
  background: var(--dm-shade-8);
  display: flex;
  justify-content: flex-end;
  box-shadow: inset 0 0.0625rem 0 var(--dm-shade-6);
}
#general-settings-form {
  width: 56rem;
  margin: 0 auto;

  .form-section {
    grid-gap: 1.5rem 3rem;

    .section-title {
      height: 3.5rem;
      display: flex;
      align-items: center;
      color: var(--dm-shade-1);
      font-weight: 500;
      border-bottom: 1px solid var(--dm-shade-6);
    }

    &:before {
      background: none;
    }

    .switch {
      margin-top: 1rem;
      label {
        height: 3.5rem;
        justify-content: center;
      }
      input {
        margin-left: auto;
      }
    }

    .switch:first-child,
    :not(.switch) + .switch {
      grid-column: 1;
    }

    .form-element.text-input textarea {
      height: auto;
    }

    .form-element:not(.switch),
    .datepicker-wrapper {
      position: relative;
      label {
        overflow: hidden;
        height: 0.875rem;
        padding-bottom: 0.375rem;
        margin-bottom: 0;
      }
    }

    .clear-override-btn {
      font-size: 1rem;
      display: none;
      align-items: center;
      position: absolute;
      top: 0.125rem;
      right: 0;

      span {
        font-size: 0.75rem;
        font-weight: 500;
        color: var(--dm-shade-4);
        pointer-events: none;
      }
      img {
        margin-left: 0.25rem;
        pointer-events: none;
      }
    }

    .switch .clear-override-btn {
      top: -1rem;
      right: -1rem;
    }
  }

  .override {
    &.text-input,
    &.date-input {
      label {
        color: var(--dm-color-primary);

        max-width: 16rem;
        white-space: nowrap;
        text-overflow: ellipsis;
      }
      input,
      textarea {
        background: #fcfae0;
        color: var(--dm-shade-1-static);
      }
    }

    &.switch {
      position: relative;
      label {
        position: relative;
        span {
          color: var(--dm-color-primary);
        }
      }
      &:before {
        content: "";
        display: block;
        background: #fcfae0;
        color: var(--dm-shade-1-static);
        position: absolute;
        width: calc(100% + 1.5rem);
        height: 3rem;
        left: -0.75rem;
        top: 0.25rem;
        border-radius: 0.25rem;
        border: 1px solid var(--dm-shade-5);
      }
    }

    .clear-override-btn {
      display: flex;
    }
  }
}
.error {
  &.text-input,
  &.date-input {
    label {
      color: #ff0000;

      max-width: 16rem;
      white-space: nowrap;
      text-overflow: ellipsis;
    }
    input,
    textarea {
      border: 1px solid #ff0000;
    }
  }
}
dm-global-exclusions {
  #main-viewport {
    display: grid;
    grid-template-rows: 1fr auto;
  }
}
.dm-graph-item-icon-special {
  .icon {
    position: relative;
    overflow: hidden;
    border: 1px solid var(--dm-shade-1);
    background: black;

    &:after {
      content: "";
      display: block;
      height: 100%;
      width: 100%;
      background: var(--dm-shade-8);
      transform: rotate(-45deg) translate(0, 50%);
    }
  }
}
.dm-graph-item-icon-sum {
  .icon {
    background: black;

    &:after {
      content: "";
      display: block;
      height: 100%;
      width: 100%;
      background: var(--dm-shade-8);
      transform: rotate(-135deg) translate(0, 50%);
    }
  }
}
.dm-graph-item-icon {
  .icon {
    display: inline-block;
    width: 0.625rem;
    height: 0.625rem;
    border-radius: 0.312rem;
    margin-right: 0.5rem;
    box-sizing: border-box;
  }
}
.dm-graph-item {
  .item {
    display: flex;
    align-items: center;
    cursor: pointer;
  }

  .item--hidden {
    opacity: 0.4;
  }

  .item__label {
    display: flex;
    gap: 0.5rem;
    color: var(--dm-shade-3);
    font-weight: 500;
    font-size: 0.8125rem;
  }
}
dm-graph-tooltip {
  pointer-events: none;
  position: absolute;
  top: 6rem;
  background: var(--dm-shade-1);
  border-radius: 0.25rem;
  padding: 1rem 1.5rem;
  min-width: 16rem;
  z-index: var(--dm-z-index-tooltip);

  .title {
    margin-bottom: 0.75rem;
    line-height: 150%;
    font-weight: 600;
    display: flex;
    flex-direction: column;
    font-size: 0.8125rem;
    color: var(--dm-shade-8);
  }

  .title__sub-title {
    color: var(--dm-color-category-7);
  }

  .item {
    color: var(--dm-shade-5);
    line-height: 1.375rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 500;
    font-size: 0.8125rem;
  }

  .item__color {
    display: inline-block;
    width: 0.625rem;
    height: 0.625rem;
    border-radius: 50%;
  }

  .item__label {
    display: flex;
    gap: 0.5rem;
    align-items: center;
  }

  .metrics {
    margin-top: 0.5rem;
  }

  .metrics__metric__name {
    color: var(--dm-shade-4);
  }
}
.grouped-alerts__modal .modal {
  width: auto;
  max-width: 80%;
}
.grouped-alerts__alert__message {
  background: var(--dm-shade-8);
  box-shadow:
    inset 0 0.0625rem 0 var(--dm-shade-6),
    inset 0.0625rem 0 0 var(--dm-shade-6),
    inset -0.0625rem 0 0 var(--dm-shade-6),
    inset 0 -0.0625rem 0 var(--dm-shade-6);
  border-radius: 0.25rem;
  padding: 0.625rem 1rem;
  color: var(--dm-shade-2);
  line-height: 130%;
  font-size: 0.8125rem;
}
.grouped-alerts__alert__message:not(:last-of-type) {
  margin-bottom: 0.75rem;
}
.dm-item-dashboard-header-horizontal-trend {
  display: contents;
}
.horizontal-header-middle-dashboard-item {
  width: 100%;
  align-items: center;
  display: flex;
  justify-content: space-between;
  padding-right: 2rem;
  padding-left: 0.75rem;

  .label {
    text-transform: uppercase;
    font-size: 0.75rem;
    line-height: 120%;
    letter-spacing: 0.3px;
    font-weight: 600;
    color: var(--dm-shade-2);
    max-width: 10rem;
  }

  .label__sub-label {
    font-size: 0.6875rem;
    line-height: 0.8125rem;
    font-weight: 500;
    color: var(--dm-shade-3);
    opacity: 0.7;
  }

  .trends {
    display: flex;
    gap: 2rem;
    align-items: center;
  }
}
.table-headers-horizontal__cell[sortactive] {
  .horizontal-header-middle-dashboard-item {
    .label {
      color: var(--dm-color-primary);
    }
  }
}
.dashboard__trend-info-tooltip {
  width: 10rem;
  color: var(--dm-color-static);
  padding: 0.5rem 0.625rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;

  img {
    filter: brightness(2);
  }

  span {
    font-size: 0.8125rem;
  }
}
dm-item-dashboard-header-horizontal-media {
  display: grid;
  grid-template-columns: auto 1fr;
  width: 100%;
  margin-left: 1.0625rem;

  .label {
    font-size: 0.75rem;
    line-height: 1.125rem;
    letter-spacing: 0.3px;
    color: var(--dm-shade-2);
    margin-left: 1.5rem;
    text-transform: uppercase;
  }
}
.dm-item-dashboard-detailed-horizontal-header-middle-date {
  display: grid;
  grid-template-columns: 1fr;
  width: 100%;
  font-weight: 600;
  font-size: 0.75rem;
  line-height: 0.875rem;
  align-items: center;
  letter-spacing: 0.001875rem;
  text-transform: uppercase;
  color: var(--dm-shade-2);
  padding-left: 1.25rem;
}
dm-item-dashboard-detailed-horizontal-header-middle-date-versus.dm-item-dashboard-detailed-horizontal-header-middle-date {
  grid-template-columns: 1fr 1fr 1fr;
}
dm-item-dashboard-detailed-horizontal-header-middle-metric {
  display: flex;
  flex-direction: column;
  font-weight: 600;
  font-size: 0.75rem;
  line-height: 0.875rem;
  justify-content: center;
  letter-spacing: 0.001875rem;
  text-transform: uppercase;
  color: var(--dm-shade-2);
  padding-left: 1.25rem;

  .metric-detail {
    color: var(--dm-shade-3);
    font-weight: 500;
    font-size: 0.6875rem;
    line-height: 0.8125rem;
  }
}
.dm-button-icon {
  display: block;

  &[loading] [invisibleOnLoad] {
    opacity: 0;
  }

  .button {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    position: relative;
    padding: 0;
    width: 2.5rem;
    height: 2.5rem;
    font-size: 0.6875rem;
    font-weight: 600;
    color: var(--dm-shade-3);
    border-radius: 0.25rem;

    &[size="small"] {
      width: 1.5rem;
      height: 1.5rem;
    }

    &[raised] {
      border-radius: 0.25rem;
      border: 0.0625rem solid color-mix(in srgb, var(--dm-shade-5) 70%, transparent);
      background-color: var(--dm-shade-8);
      padding-left: 0.6875rem;
      padding-right: 0.6875rem;
    }

    &[disabled] {
      background-color: var(--dm-shade-8);
      border: 0.0625rem solid color-mix(in srgb, var(--dm-shade-5) 30%, transparent);
      color: color-mix(in srgb, var(--dm-shade-3) 40%, transparent);

      .button_icon {
        opacity: 0.4;
      }
    }

    &[loading] {
      pointer-events: none;
    }

    &:hover:not([active]) {
      background: color-mix(in srgb, var(--dm-color-primary) 5%, transparent);
    }

    &[active] {
      border-color: var(--dm-color-primary);
      background-color: var(--dm-color-primary);
      color: var(--dm-shade-8);
    }
  }

  .button__loader {
    position: absolute;
  }

  .button__loading-template {
    position: absolute;
  }
}
dm-icon-information {
  display: flex;
}
dm-input-file {
  position: relative;

  .file-input {
    display: none;
  }

  .upload-button {
    position: absolute;
    bottom: 0.25rem;
    right: 0.25rem;
  }
}
dm-input-group {
  display: flex;
  flex-direction: column;

  .group__label {
    display: block;
    color: var(--dm-shade-3);
    margin-bottom: 1.375rem;

    span {
      font-size: 0.75rem;
      font-weight: 500;
      text-transform: uppercase;
    }
  }

  .group__content {
    display: flex;

    &.group-inline {
      display: inline-block;
    }

    &.grid-group {
      display: grid;
      grid-template-columns: 1fr 1fr;
      grid-gap: 1rem;
    }
    label {
      margin-right: 2.5rem;
      cursor: pointer;
      display: flex;
      align-items: center;
      span {
        font-size: 0.875rem;
        color: var(--dm-shade-1);
      }

      input[type="checkbox"] {
        width: 1rem;
        height: 1rem;
        position: relative;
        font-size: 1rem;
        cursor: pointer;
        margin-right: 0.5rem;
        outline: none;
        -moz-appearance: initial;
        visibility: hidden;

        :disabled {
          cursor: default;
        }

        &:after {
          content: url(/images/checkbox-unchecked.svg);
          display: inline-block;
          width: 1rem;
          height: 1rem;
          opacity: 1;
          visibility: visible;
        }

        &:checked:after {
          content: url(/images/checkbox-checked.svg);
          visibility: visible;
        }

        &:not(:checked):disabled:after {
          content: url(/images/checkbox-unchecked-disabled.svg);
          visibility: visible;
        }

        &:checked:disabled:after {
          content: url(/images/checkbox-checked-disabled.svg);
          visibility: visible;
        }

        &[indeterminate]:disabled:after {
          content: url(/images/checkbox-indeterminate-disabled.svg);
          visibility: visible;
        }

        &[indeterminate]:after {
          content: url(/images/checkbox-indeterminate.svg);
          visibility: visible;
        }
      }

      input[type="radio"] {
        width: 1rem;
        height: 1rem;
        position: relative;
        font-size: 1rem;
        margin: 0;
        cursor: pointer;
        outline: none;
        -moz-appearance: initial;
        visibility: hidden;

        :disabled {
          cursor: default;
        }

        &:after {
          content: url(/images/radio-off.svg);
          display: inline-block;
          width: 1rem;
          height: 1rem;
          opacity: 1;
          visibility: visible;
        }

        &:checked:after {
          content: url(/images/radio-on.svg);
          visibility: visible;
        }

        &:not(:checked):disabled:after {
          content: url(/images/radio-off-disabled.svg);
          visibility: visible;
        }

        &:checked:disabled:after {
          content: url(/images/radio-on-disabled.svg);
          visibility: visible;
        }
        margin-right: 0.5rem;
      }
    }
  }
}
dm-input-text {
  display: flex;
  flex-direction: column;

  .input {
    align-items: center;
    border: 0.0625rem solid var(--dm-shade-6);
    padding: 0 1rem;
    border-radius: 0.25rem;
    font-size: 0.9375rem;
    font-weight: 400;
    line-height: 1.5rem;
    color: var(--dm-shade-1);
    height: 3rem;

    &:focus {
      border-color: var(--dm-color-primary);
    }

    &:disabled {
      background: var(--dm-shade-6);
      border: none;
      color: var(--dm-shade-4);
    }

    &:read-only {
      color: var(--dm-shade-3);
    }
  }
}
dm-input-textarea {
  display: grid;
  grid-gap: 0.375rem;
  grid-auto-rows: auto 1fr;
  height: 100%;

  .textarea {
    align-items: center;
    border: 0.0625rem solid var(--dm-shade-6);
    outline: none;
    padding: 1rem;
    border-radius: 0.25rem;
    font-family: "proxima-nova", sans-serif;
    font-size: 0.9375rem;
    font-weight: 400;
    line-height: 1.5rem;
    color: var(--dm-shade-2);
    resize: none;

    &:focus {
      border-color: var(--dm-color-primary);
    }

    &:disabled {
      background: var(--dm-shade-6);
      border: none;
      color: var(--dm-shade-4);
    }
  }
}
dm-ipsos-iris-index {
  #main-viewport {
    padding: 0rem 2rem 2rem 2rem !important;
  }

  dm-search-media .sc {
    border-radius: 0.25rem !important;
    height: 2.5rem !important;
  }

  dm-datepicker {
    width: 16rem;
  }

  .main-holder {
    background-color: color-mix(in srgb, var(--dm-shade-8) 50%, transparent);
    border: 1px solid var(--dm-shade-6);
    border-radius: 0.1875rem;
    display: grid;
    grid-template-rows: auto 1fr;
    box-sizing: border-box;
    height: 100%;
  }
}
.item-group-target-question {
  .target-operator {
    margin: 0.5rem 0;
  }
}
.list-item {
  display: flex;
  align-items: center;
  box-sizing: border-box;
  justify-items: center;
  position: relative;

  .hover-action-button {
    display: none;
  }

  &:hover {
    .hover-action-button {
      display: block;
    }
  }

  &.drop-target {
    &:after {
      content: "";
      display: block;
      width: 100%;
      height: 1px;
      position: absolute;
      top: -0.175rem;
      left: 0;
      background: var(--dm-color-primary);
    }

    &.drop-after:after {
      top: calc(100% + 0.175rem);
    }
  }

  &.dragging .list-item__part--hover_toggle > *:nth-child(2) {
    opacity: 0;
  }

  &:hover .list-item__part--hover_toggle > *:nth-child(1) {
    opacity: 0;
    transition: opacity 0.2s;
    transition-delay: 0.2s;
    pointer-events: none;
  }

  &:hover .list-item__part--hover_toggle > *:nth-child(2) {
    transition: opacity 0.2s;
    opacity: 1;
    transition-delay: 0.2s;
  }

  &.dragging {
    opacity: 0.5;
  }

  &:hover {
    background: var(--dm-shade-7);
  }

  &[disabled] {
    pointer-events: all !important;
    background: color-mix(in srgb, var(--dm-shade-6) 30%, transparent);
    opacity: 0.6;
  }
}
.item__highlighted-term {
  background-color: color-mix(in srgb, var(--dm-color-category-7) 70%, transparent);
}
.list-item__part {
  display: flex;
  align-items: center;
}
.list-item__part--faux {
  min-width: 1rem;
}
.list-item__part--end {
  flex-grow: 1;
  justify-content: end;
  gap: 0.5rem;
}
.list-item__part--hover_toggle {
  position: relative;
}
.list-item__part--hover_toggle > *:nth-child(2) {
  opacity: 0;
}
.list-item__part--hover_toggle .list-item__part {
  position: absolute;
  left: 0;
  top: 0;
}
.list-item__count {
  color: var(--dm-color-category-5);
  font-size: 0.75rem;
  font-weight: 600;
}
.list-item__media-tags__tag {
  margin-right: 0.5rem;
}
.list-item__drag {
  cursor: move;
  width: 1.125rem;
  height: 1.125rem;
}
.list-item__number {
  min-width: 1.75rem;
  font-weight: 400;
  justify-content: right;
  font-size: 0.6875rem;
  line-height: 200%;
  font-feature-settings:
    "tnum" on,
    "lnum" on;
  color: var(--dm-shade-4);
}
dm-key-demographics-graphs {
  display: flex;
  flex-direction: column;
  gap: 1rem;

  .key-demographics-graphs__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 2.25rem;
    height: 25rem;
  }

  .key-demographics-graphs__sub-title {
    font-weight: 500;
    font-size: 1rem;
    line-height: 1.1875rem;
    color: var(--dm-shade-3);
    padding-bottom: 1.795rem;
  }

  .key-demographics-graphs__gender {
    display: flex;
    align-items: center;
    justify-content: center;
  }
}
dm-label-input-inline {
  .label-container {
    display: flex;
    gap: 0.5rem;
    align-items: center;
  }
}
dm-label-input-wrapped {
  .label-container {
    display: flex !important;
    gap: 0.5rem;
    align-items: center;
    margin-bottom: 0.375rem;
  }

  .label-container__label {
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1.25rem;
    letter-spacing: 0.0025rem;
    margin-left: 0.125rem;
    text-transform: uppercase;
  }

  .label-container__sub-label {
    font-weight: 500;
    font-size: 0.75rem;
    text-transform: initial !important;
  }

  .label-container--theme-primary {
    .label-container__label {
      color: var(--dm-shade-3);
    }

    .label-container__sub-label {
      color: var(--dm-shade-4);
    }
  }

  .label-container--theme-secondary {
    .label-container__label {
      color: color-mix(in srgb, var(--dm-color-static) 60%, transparent);
    }

    .label-container__sub-label {
      color: color-mix(in srgb, var(--dm-color-static) 60%, transparent);
    }
  }
}
.dm-graph {
  display: block;
  width: 100%;
  overflow: visible;
  position: relative;
  /*border: 1px solid darkgray;*/

  .graph-wrapper {
    /*background: floralwhite;*/
  }

  svg {
    /*border: 1px solid darkgray;*/
    .x-axis,
    .x-month-axis {
      .tick line,
      path {
        display: none;
      }
      .tick {
        text {
          font-family: "proxima-nova", sans-serif;
          font-size: 0.8125rem;
          fill: var(--dm-shade-4);
        }
      }
    }
    .x-month-axis .tick text {
      font-size: 0.75rem;
      fill: var(--dm-shade-3);
      font-weight: 500;
    }

    .y-axis {
      .tick {
        line {
          stroke: var(--dm-shade-6);
        }
        text {
          font-family: "proxima-nova", sans-serif;
          font-size: 0.8125rem;
          fill: var(--dm-shade-4);
        }
      }
      path {
        display: none;
      }
    }

    .cursor-line {
      stroke: var(--dm-color-primary);
      stroke-width: 1px;
      stroke-dasharray: 4;
      opacity: 0.7;
    }
  }

  .legend {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 1.5rem;
    align-items: center;
    justify-content: center;
    width: 80%;
    margin: 0 auto;

    .category {
      cursor: pointer;
    }
  }

  &.category-focus {
    .legend .category:not(.active) {
      opacity: 0.5;
    }
    .line:not(.active) {
      opacity: 0.07 !important;
      stroke-width: 8px !important;
    }
    .bar:not(.active) {
      opacity: 0.07 !important;
    }
  }

  .bar-x-title {
    font-family: "proxima-nova", sans-serif;
    font-size: 0.8125rem;
    fill: var(--dm-shade-4);
  }
  .bar-x-title-2 {
    font-size: 0.75rem;
    fill: var(--dm-shade-3);
    font-weight: 500;
  }
}
dm-list-item-expand {
  height: 100%;

  .list-item__expand {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;

    dm-expand-icon-single {
      height: 100%;
      width: 100%;
    }
  }
}
dm-list-item-select,
dm-list-item-select-event-handler {
  display: flex;

  .list-item__select {
    gap: 0.3125rem;
  }
}
dm-list-item-select {
  .list-item__select__checkbox {
    pointer-events: none;
  }
}
.list-item__select__tooltip .dm-tooltip__content {
  padding: 0.75rem;
  max-width: 20rem;
}
dm-list-item-delete {
  height: 1rem;
  width: 1rem;
}
dm-item-type {
  white-space: nowrap;
  width: 2.5rem;
  min-width: 2.5rem;
  height: 1rem;
  border-radius: 0.125rem;
  background: var(--dm-shade-6);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--dm-shade-3);
  font-size: 0.5625rem;
  font-weight: 700;
  line-height: 0;
  text-transform: uppercase;
}
dm-list-item-name {
  overflow: hidden;

  .list-item__name {
    gap: 0.5rem;
    font-weight: 500;
    line-height: 160%;
    font-size: 0.875rem;
  }

  .list-item__name__icon {
    width: 1rem;
    height: 1rem;
  }

  .list-item__name__display {
    color: var(--dm-shade-2);
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .list-item__name__path {
    font-size: 0.75rem;
    color: var(--dm-shade-4);
    white-space: nowrap;
  }
}
.list-item-source {
  height: 3rem;
  gap: 0.75rem;
  padding: 0 0.75rem 0 0;
  border-bottom: 1px solid var(--dm-shade-6);

  &[highlighted] {
    background-color: color-mix(in srgb, var(--dm-color-primary) 12%, transparent);
  }

  &[invalid] {
    background:
      linear-gradient(0deg, rgba(255, 196, 0, 0.1), rgba(255, 196, 0, 0.1)),
      rgba(255, 255, 255, 0.4) !important;
  }

  .list-item__name {
    font-size: 0.9375rem;
  }

  .list-item__expand {
    width: 2rem;
    background: color-mix(in srgb, var(--dm-shade-7) 80%, transparent);
    border-right: 1px solid var(--dm-shade-6);

    &[expanded] {
      background: color-mix(in srgb, var(--dm-shade-6) 60%, transparent);
    }
  }
}
.list-item-selected {
  padding: 0 0.75rem 0 0.5rem;
  height: 2.5rem;
  gap: 0.5rem;
  border: 1px solid var(--dm-shade-6);
  margin-bottom: 0.5rem;
  border-radius: 0.125rem;
  background: color-mix(in srgb, var(--dm-shade-8) 40%, transparent);

  .list-item__name {
    font-size: 0.875rem;
  }

  .list-item__expand {
    width: 1rem;
    background: none;
    border-right: none;
  }
}
.list-item-selected__metric {
  padding-right: 0.625rem;
}
.list-item-source__metric {
  padding-left: 0.75rem;
}
.list-item__metric-ranking__label {
  text-transform: uppercase;
  color: var(--dm-color-static);
  padding: 0.5rem 0.25rem;
  border-radius: 0.125rem;
  background: color-mix(in srgb, var(--dm-shade-3) 50%, transparent);
  font-weight: 700;
  font-size: 0.5625rem;
  line-height: 0;
}
.list-item__group-select {
  gap: 0.3125rem;
}
.list-item-source__target-flag .list-item__name .list-item__name__display,
.list-item-source__target-advanced .list-item__name .list-item__name__display {
  position: relative;
}
.list-item-source__target,
.target-group-update-item {
  position: relative;
  min-height: 3rem;
  grid-gap: 0.75rem;
  align-items: center;
  border-bottom: 1px solid var(--dm-shade-6);

  .range-control {
    position: absolute;
    right: 0;
    height: 100%;
    top: 0;
    align-items: center;
    display: flex;
    margin-right: 0.75rem;
    cursor: pointer;
    img {
      pointer-events: none;
    }
  }

  &.template-item {
    display: flex;
    cursor: pointer;
    &:hover {
      background:
        linear-gradient(0deg, rgba(234, 237, 243, 0.25), rgba(234, 237, 243, 0.25)),
        rgba(255, 255, 255, 0.4);
    }
  }

  &[level-disabled],
  &[disabled] {
    background: color-mix(in srgb, var(--dm-shade-6) 30%, transparent);
    & .list-item__name,
    & .list-item__select .select-display {
      opacity: 0.6;
    }
  }

  &.l1 {
    margin-left: 0;
  }

  &.l2 {
    margin-left: 1rem;
  }

  &.l3 {
    margin-left: 2rem;
  }
  &.l4 {
    margin-left: 3rem;
  }
  &.l5 {
    margin-left: 4rem;
  }

  .list-item__name {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(0, max-content));
    grid-gap: 0.5rem;
    align-items: center;

    .list-item__name__display {
      color: var(--dm-shade-2);
      font-size: 0.9375rem;
      line-height: 160%;
    }
  }
}
.list-item-source__target[invalid] {
  background:
    linear-gradient(0deg, rgba(255, 196, 0, 0.1), rgba(255, 196, 0, 0.1)), rgba(255, 255, 255, 0.4) !important;
}
dm-list {
  display: flex;
  flex-direction: column;

  .no-selection-text {
    color: var(--dm-shade-4);
    font-size: 0.8125rem;
    padding: 0;
    margin: 0;
    font-weight: 500;
  }

  .loader {
    margin-top: 1rem;
  }

  .bottom {
    height: 0.0625rem;
  }
}
dm-loader {
  display: flex;

  .loader {
    animation: rotate 2s linear infinite;
    transform-origin: center center;
  }

  .loader--size-small {
    height: 1rem;
    width: 1rem;
  }

  .loader--size-medium {
    height: 1.5rem;
    width: 1.5rem;
  }

  .loader--size-large {
    height: 2rem;
    width: 2rem;
  }

  .loader--theme-primary {
    stroke: var(--dm-color-primary);
  }

  .loader--theme-white {
    stroke: var(--dm-color-static);
  }

  .loader__circle {
    stroke-dasharray: 1, 200;
    stroke-dashoffset: 0;
    animation: dash 1s ease-in-out infinite;
    stroke-linecap: round;
  }
}
.locations {
  padding-top: 1rem;
  display: grid;
  grid-template-rows: 1fr auto;
  padding-bottom: 0.5rem !important;
}
dm-manage-private-entities {
  #main-viewport {
    display: grid;
    grid-template-rows: 1fr auto;
    padding-bottom: 0.5rem !important;
  }

  .manage-private-entities-table__name-column {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: 0.25rem;
  }
}
dm-manuals {
  #main-viewport {
    display: grid;
    grid-template-rows: 1fr auto;
    padding-bottom: 0.5rem !important;
  }

  .manuals-table {
    display: grid;
    grid-template-rows: 1fr auto;
    overflow: auto;
    width: 100%;
    height: 100%;
    box-sizing: border-box;

    .table-container {
      height: 100%;
      overflow: hidden;

      .dm-table {
        height: 100%;
        overflow: hidden;
      }

      .dm-table td:nth-child(3) .status__indicator {
        display: none;
      }
    }
  }

  .placeholder {
    display: grid;
    justify-content: center;
    justify-items: center;
    align-content: center;
    margin-bottom: 1.25rem;
    gap: 1.563rem;

    .button {
      margin-top: 0.438rem;
    }
  }

  .placeholder__text {
    font-size: 1.375rem;
    line-height: 1.875rem;
    color: var(--dm-shade-2);
    opacity: 0.6;
  }
}
dm-modal-manual-edit {
  grid-template-columns: 1fr 0.75fr;
  width: 75rem;
  height: 80%;

  .modal__header {
    display: grid;
    grid-template-columns: 1fr auto auto;
    gap: 2rem;

    .id-label {
      display: flex;
      align-items: center;
      gap: 0.375rem;

      color: var(--dm-shade-4);
      font-size: 0.875rem;
      line-height: 1.375rem;

      .id-value {
        color: var(--dm-shade-3);
      }
    }
  }

  .modal__form {
    display: flex;
    flex-flow: column;
    gap: 1.5rem;

    .attachments {
      .filesize-warning {
        text-transform: initial;
        color: var(--dm-shade-4);
        letter-spacing: 0.019rem;
        margin-left: 0.5rem;
      }
    }

    .attachments__document {
      margin-bottom: 0;
    }
  }

  .modal-footer {
    grid-row: 3;
    grid-column: 1 / 3;

    display: grid;
    grid-template-columns: 1fr auto auto;

    dm-button button {
      margin-left: 0;
    }
  }

  .form-section:before {
    background: none;
  }
}
dm-media-ems {
  #main-viewport {
    display: grid;
    grid-template-rows: auto 1fr;
  }

  .ems-media-filters {
    background-color: var(--dm-shade-8);
    box-shadow:
      inset 0 1px 0 var(--dm-shade-6),
      inset 1px 0 0 var(--dm-shade-6),
      inset -1px 0 0 var(--dm-shade-6);
  }
}
.media-filters {
  display: flex;
  padding: 1.375rem 1.5rem;
  align-items: center;
  min-height: 2rem;

  dm-expand-icon-all {
    margin-left: auto;
  }

  .dropdown-with-label {
    height: 2rem;
    margin-right: 1.5rem;
    padding: 0.25rem 1rem 0.25rem 0.75rem;
  }

  .media-filters__control {
    margin-right: 1.5rem;
  }

  .select-helpers-ctr {
    top: -0.5rem;
    right: -0.5rem;
    background: #8b91a8;
    border: none;
    display: flex;
    gap: 0.5rem;
    align-items: center;
    border-radius: 0.25rem;
    padding: 0.375rem 0.5rem;
    margin-right: 1.5rem;
  }

  .dropdown-with-label .selected-item {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .list-tools {
    margin-left: auto;
    display: flex;
    align-items: center;
    img {
      margin-left: 1rem;
      width: 1.5rem;
      height: 1.5rem;
      cursor: pointer;
    }
  }
}
.media-item-tooltip {
  margin: 0.125rem 0.25rem;
}
.media-item-tooltip__name {
  font-size: 0.8125rem;
  line-height: 130%;
  font-weight: bold;
  opacity: 0.9;
}
.media-item-tooltip__tag {
  display: flex;
  align-content: center;
  line-height: 130%;
}
.media-item-tooltip__tag:not(:first-of-type) {
  margin-top: 0.75rem;
}
.media-item-tooltip__tag__icon {
  margin-right: 0.5rem;
}
.media-item-tooltip__tag__name {
  font-size: 0.75rem;
  color: var(--dm-shade-8);
}
.dm-media-search__options {
  margin-right: 0.25rem;
  display: flex;
  align-items: center;
}
.dm-media-search__option {
  display: inline-flex;
  align-items: center;
}
.dm-media-search__checkbox {
}
.dm-media-search__label {
  margin-left: 0.5rem;
  white-space: nowrap;
  font-size: 0.8125rem;
  line-height: 1rem;
  color: var(--dm-shade-3);
}
.modal-container {
  .my-group-modal.modal {
    height: 90%;
    width: 80%;
    display: grid;
    grid-template-rows: auto 1fr auto;

    .my-group-modal__header {
      grid-template-columns: auto 1fr auto;
    }

    .my-group-modal__title {
      padding-top: 0;
    }

    .my-group-modal__name {
      margin-left: 1.5rem;
      min-width: 20rem;
      width: 40%;
      max-width: 40rem;
    }

    .my-group-modal__content {
      display: grid;
      grid-template-rows: auto 1fr;
      background: var(--dm-shade-10);
    }
  }
}
.my-groups__no-groups {
  display: inline-flex;
  width: 100%;
  height: 100%;
  flex-direction: column;
  align-items: center;
  background: var(--dm-shade-8);
  box-shadow:
    inset -0.0625rem 0 0 var(--dm-shade-6),
    inset 0 0.0625rem 0 var(--dm-shade-6),
    inset 0.0625rem 0 0 var(--dm-shade-6),
    inset 0 -0.0625rem 0 var(--dm-shade-6);
}
.my-groups__no-groups__backdrop {
  margin-top: 3.5rem;
}
.my-groups__no-groups__title {
  margin-top: 1.375rem;
  margin-bottom: 2rem;
}
.target-tooltip .tooltip__content {
  padding: 0.625rem 0.75rem;
  line-height: 130%;
  display: inline-flex;
  flex-wrap: wrap;
}
.target-tooltip .tooltip__content {
  padding: 0.625rem 0.75rem;
  line-height: 130%;
  display: inline-flex;
  flex-wrap: wrap;
}
.target-tooltip__question {
  display: contents;
}
.target-tooltip__question__operator {
  color: var(--dm-color-category-5);
}
.target-tooltip__question__name {
  color: var(--dm-shade-4);
  text-transform: uppercase;
}
.target-tooltip__question__part {
  color: var(--dm-shade-4);
}
.target-tooltip__answer__operator {
  color: var(--dm-color-category-5);
}
.target-tooltip__advanced__target {
  color: #6baeff;
}
.target-tooltip__custom__target {
  color: var(--dm-color-secondary);
}
.target-tooltip__operator_not {
  color: var(--dm-color-category-6);
}
dm-metric-permissions {
  #main-viewport {
    padding-bottom: 0.5rem !important;
  }

  dm-table-simple {
    display: grid;
    grid-template-rows: 1fr auto;
    overflow: auto;
    height: 100%;

    .table-container {
      height: 100%;
      overflow: hidden;
    }

    .dm-table {
      height: 100%;
      overflow: hidden;
    }
  }

  .dm-table tr {
    grid-template-columns: 4fr 4fr 4fr 4fr 2fr 1fr;
  }
}
.metrics {
  #main-viewport {
    display: grid;
    gap: 0.5rem;
    padding-bottom: 0.5rem !important;
  }

  .metrics__short-description {
    box-sizing: border-box;
    width: 100%;
    background: var(--dm-shade-6);
    border: 1px solid var(--dm-shade-6);
    border-radius: 0.25rem;

    padding: 1rem;
    color: var(--dm-shade-1);
    font-size: 0.8rem;
    line-height: 130%;
  }

  .metrics__table {
    display: grid;
    grid-template-rows: 1fr auto;
    overflow: auto;
    width: 100%;
    height: 100%;
    box-sizing: border-box;

    .table-container {
      height: 100%;
      overflow: hidden;

      .dm-table {
        height: 100%;
        overflow: hidden;
      }
    }
  }
}
dm-modal-metrics {
  .form {
    display: flex;
    flex-flow: column;
    gap: 1.5rem;
  }

  .modal__content {
    min-height: 12rem;
  }
}
.dm-modal-custom-group.dm-modal {
  .modal {
    width: 80rem;
    height: 90vh;
    max-height: 60rem;
    display: grid;
    grid-template-rows: auto 1fr auto;
  }

  .modal__header {
    padding: 0 3rem 1.5rem 3rem;
    background-color: var(--dm-shade-8);

    .main-title {
      font-weight: 400;
      font-size: 1.25rem;
      line-height: 2rem;
      color: var(--dm-shade-3);
      width: 10.85rem;
    }

    .custom-group-modal__name {
      padding: 0 0.75rem;
      height: 2rem;
      margin-left: 1.5rem;
      margin-right: 0.5rem;
      min-width: 20rem;
      max-width: 29.5rem;
    }

    .custom-group-modal__description {
      height: 5rem;
    }

    .media-search {
      margin-left: 2rem;
    }

    .sub-title {
      font-weight: 600;
      font-size: 0.75rem;
      line-height: 1.25rem;
      letter-spacing: 0.5px;
      text-transform: uppercase;
      color: var(--dm-shade-3);
      width: 10.85rem;
    }

    .header__options__selectors {
      display: flex;
      gap: 2rem;
    }

    .options-selectors {
      display: flex;
      flex-direction: column;
      gap: 1rem;

      .selected-items-holder {
        padding: 0;
      }
    }

    .label-holder {
      display: none;
    }
    .form-element.select-control.multiselect .select-button {
      min-height: 2rem;
    }
  }

  .header__toolbar {
    display: grid;
    grid-template-columns: auto 1fr auto auto;
    align-items: center;
  }

  .header__options {
    display: grid;
    grid-template-columns: auto 1fr 29rem;
    grid-gap: 1.5rem;
  }

  .modal__content {
    display: grid;
    grid-template-rows: auto 1fr;
    max-height: 100%;
    min-height: 20rem;
    padding-bottom: 0;
    background-color: var(--dm-bg-color);

    .media-filters {
      padding: 1.375rem 0;
    }

    .item-selection-section {
      padding-left: 0;
    }
  }
}
dm-modal-sensitive-target.dm-modal {
  .modal {
    width: 80%;
  }

  .modal-header {
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: space-between;
  }

  .modal__content {
    display: flex;
    flex-direction: column;
    padding-bottom: 0;
    height: 75vh;
    max-height: 75vh;
  }

  .tab-menu {
    margin-left: -1rem;
    padding-top: 0.3rem;
  }
}
dm-modal-advanced-target.dm-modal {
  .modal__header {
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: space-between;
  }

  .modal__content {
    display: flex;
    flex-direction: column;
    padding-bottom: 0;
    height: 75vh;
    max-height: 75vh;
  }

  .title-container {
    display: flex;
    align-content: center;
    align-items: center;
    gap: 1.5rem;
  }

  .modal {
    width: 80%;
  }
}
dm-modal-query-log.dm-modal {
  .modal {
    width: 50rem;
  }

  .modal__form {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;

    .code_textarea {
      background: var(--dm-shade-6);
      border: none;
      color: var(--dm-shade-4);
    }

    .error-textarea {
      height: 6.25rem;
    }
  }

  .modal__header {
    padding-top: 1.5rem;
    padding-bottom: 2rem;
  }

  .form-section {
    padding: 0;

    &:before {
      display: none;
    }
  }

  .modal__copy-button img {
    width: 1rem;
  }
}
dm-modal-report-category-entities {
  .header__title {
    margin-bottom: 0.5rem;
  }

  .header__category-item {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    height: 2rem;
  }

  .group-by__title {
    font-weight: 400;
    font-size: 0.9375rem;
    line-height: 160%;
    letter-spacing: 0.2px;
    color: var(--dm-shade-1);
    margin-bottom: 0.5rem;
  }
}
dm-modal-daily-import {
  .standard-datepicker {
    margin-bottom: 1.5rem;
  }
}
.dm-modal-dashboard-preset-manage-entities.dm-modal {
  .modal {
    width: 80rem;
    height: 90vh;
    max-height: 60rem;
    display: grid;
    grid-template-rows: auto 1fr auto;
  }

  .modal__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.5rem;
    background-color: var(--dm-shade-8);
    border-bottom: 1px solid var(--dm-shade-6);
  }

  .modal__header__sub-title {
    color: var(--dm-shade-4);
  }

  .modal__content {
    padding: 0;
    max-height: 100%;
    display: grid;
    grid-template-rows: auto 1fr;

    .item-selection-section {
      grid-row: 2;
    }
  }
}
dm-modal-dashboard-preset-name.dm-modal {
  .modal__header {
    padding: 1.5rem 1.875rem;
  }

  .modal__content {
    padding: 0 1.875rem 2.5rem 1.875rem;
  }

  .modal__footer {
    padding: 1rem 1.875rem;
  }
}
dm-modal-dataset.dm-modal {
  .modal {
    width: 50rem;
  }

  .modal__header {
    display: flex;
    justify-content: space-between;
  }

  .modal-form {
    height: 35rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
  }

  .rules {
    display: flex;
    flex-direction: column;
    overflow-y: scroll;
  }

  .rules__rule {
    display: flex;
    gap: 0.75rem;
    cursor: pointer;
  }

  .rule-separator {
    margin: 0.5rem 0;
  }

  /* TODO: Horrible encapsulation break */
  .dm-search {
    & .sc {
      &[open] {
        width: 100%;
      }
    }
  }
}
dm-modal-edit-private-entities.dm-modal {
  .modal {
    width: 47.75rem;
  }

  .info-message {
    color: var(--dm-shade-4);
    font-size: 0.75rem;
  }

  .form-section {
    margin-bottom: 1rem;

    &:before {
      background: none;
    }
  }

  .build-item {
    display: flex;
    justify-content: space-between;
    background: rgba(var(--dm-shade-8), 0.6);
    padding: 0.75rem 1rem 0.75rem 0.75rem;
    align-items: center;

    &:not(:last-child) {
      margin-bottom: 0.5rem;
    }
  }

  .build-item__left {
    display: flex;
    gap: 0.75rem;
  }

  .build-item__left__name {
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 130%;
    color: var(--dm-shade-2);
  }

  .build-item__right {
    text-align: right;
  }

  .build-item__right__label {
    font-weight: 500;
    font-size: 0.75rem;
    color: var(--dm-shade-4);
    line-height: 1rem;
  }

  .build-item__right__value {
    font-weight: 500;
    font-size: 0.75rem;
    color: var(--dm-shade-2);
    line-height: 1rem;
  }
}
dm-modal-view-email.dm-modal {
  .modal {
    width: 48rem;
    height: 46rem;
    display: grid;
    grid-template-rows: auto 1fr auto;
  }

  .modal__header {
    display: flex;
    justify-content: space-between;
    padding: 1.5rem 3rem;
  }

  .modal__status-holder {
    display: flex;
    gap: 0.5rem;
  }

  .modal__content {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
  }
}
dm-modal-emails-set-status.dm-modal {
  .modal {
    overflow: visible;
  }

  .modal__header {
    padding-top: 1.5rem;
    padding-bottom: 2rem;
  }

  .modal__content {
    overflow: visible;
  }
}
dm-modal-entity-info {
  .modal {
    width: 46.875rem !important;

    header.modal__header {
      padding: 1rem 1.5rem 0 1.5rem;
      border-bottom: 1.5px solid var(--dm-shade-6);
      box-sizing: content-box;
      background-color: var(--dm-shade-8);
    }

    footer.modal__footer {
      padding: 1rem 1.5rem 1.25rem 1rem;
    }
  }

  .category__tier {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    margin-bottom: 0.25rem;
  }

  .category__tier__type {
    font-size: 0.5625rem;
    font-weight: bold;
    height: 1rem;
    width: 2rem;
    min-width: 2rem;
  }

  .category__tier__label {
    font-size: 0.875rem;
    line-height: 130%;
    color: var(--dm-shade-2);
  }

  .category__row__separator {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
    display: block;
  }

  .category__tier[tier="2"] .category__tier__arrow {
    margin-left: 0.625rem;
  }

  .category__tier[tier="3"] .category__tier__arrow {
    margin-left: 3.25rem;
  }

  .source-list__entity-info-modal {
    height: auto;
  }

  .entity-header-title {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0 0 1rem 0;
  }

  .header-item {
    font-size: 1rem;

    .list-item__name {
      gap: 1rem;
    }

    dm-item-type {
      height: 2rem;
      min-width: 3rem;
      font-size: 0.875rem;
      padding: 0 0.5rem;
    }

    .list-item__name__icon {
      height: 2rem;
      width: 2rem;
    }
  }

  .entity-modal-tabs-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

  .entity-checkbox-holder {
    display: none;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.813rem;

    .entity-modal__label {
      margin-top: 0.25rem;
    }
  }

  .entity-checkbox-holder[isPathTabActive] {
    display: flex;
  }

  dm-tab-menu {
    .tab-menu {
      padding: 0;
    }

    .tab-menu li {
      margin: 0.75rem 2.5rem 0 0;

      span {
        padding-bottom: 0.563rem;
      }
    }
  }

  .modal-tab__caption {
    font-size: 0.6875rem;
    line-height: 130%;
    color: var(--dm-shade-3);
    text-transform: uppercase;
    padding-bottom: 0.5rem;
  }

  .modal-tab__content {
    font-size: 0.9375rem;
    font-weight: 400;
    line-height: 130%;
    color: var(--dm-shade-2);
    padding-bottom: 1.5rem;
  }

  .modal-tab__content.entity-content__tags {
    display: flex;
    flex-direction: row;
    gap: 2rem;
    align-items: center;
  }

  .entity_information__tags {
    display: flex;
    gap: 0.5rem;
    flex-direction: row;
    align-items: center;
  }

  .modal .modal__content {
    padding: 1.5rem;
    height: 28rem;
  }

  dm-button.modal-ok__button {
    width: 8rem;
  }

  .modal__arrow-back {
    display: none;
  }

  .modal__arrow-back[isChildModal] {
    display: block;
    cursor: pointer;
  }
}
.import-sections-form {
  display: flex;
  align-items: center;
}
.item-source-modal .modal {
  width: 46rem;
}
dm-modal-loading {
  .modal {
    height: 20rem;
    display: flex;
    justify-content: center;
    align-items: center;
  }
}
.dm-modal-media-ems {
  .title-container {
    display: flex;
    align-content: center;
    align-items: center;
    gap: 0.5rem;
  }
}
dm-modal-media-type-select.dm-modal {
  .modal {
    width: auto;
  }

  .choose-text {
    display: flex;
    margin-bottom: 1rem;
  }

  .cards {
    display: flex;
    gap: 1.5rem;
    align-items: center;
    justify-content: center;
  }
}
dm-modal-metric-all {
  .form {
    display: flex;
    flex-flow: column;
    gap: 1.5rem;
  }

  .modal__content {
    min-height: 12rem;
  }

  .form-section {
    padding: 0;
    background-color: var(--dm-main-bg-color);
  }
}
dm-modal-metric-location-replace-existing-indicator {
  .skip-btn {
    flex-grow: 1;
    cursor: pointer;
  }
}
dm-modal-metric-permission {
  .container {
    .modal {
      width: 47.75rem;
      height: 46.875rem;

      .modal__header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 1.5rem 3rem 2rem 3rem;
      }

      .modal__header__toggle {
        display: flex;
        gap: 0.875rem;
        font-size: 0.875rem;
        line-height: 1.5rem;
      }

      .modal__content {
        min-height: 34rem;
      }

      .modal__form {
        display: flex;
        flex-direction: column;
        gap: 1.5rem;
      }
    }
  }
}
dm-modal-notification-month-change.dm-modal {
  .modal {
    width: 60rem;

    .modal__header {
      padding-top: 1.5rem;
    }
  }

  .notification-modal__content {
    display: flex;
    flex-direction: column;
    padding: 1rem;
    background-color: var(--dm-shade-8);
    box-shadow:
      inset 0 0.0625rem 0 var(--dm-shade-6),
      inset 0.0625rem 0 0 var(--dm-shade-6),
      inset -0.0625rem 0 0 var(--dm-shade-6),
      inset 0 -0.0625rem 0 var(--dm-shade-6);
    border-radius: 0.25rem;
    margin-top: 0.5rem;
  }

  .notification-modal__content__attachments-separator {
    width: 28.75rem;
  }
}
dm-modal-notifications-dashboard.dm-modal {
  .modal {
    width: 50rem;
  }
}
.dm-modal.range-select-popup {
  .modal__content {
    min-height: 6rem;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 1rem;
  }
}
dm-modal-rename-report.dm-modal {
  .modal__header {
    padding: 1.5rem 1.875rem;
  }

  .modal__content {
    padding: 0rem 1.875rem 2.5rem;
  }
}
dm-report-wizard-modal.dm-modal {
  .modal {
    width: 90%;
    height: 90%;
    padding-top: 0.25rem;
    padding-bottom: 1.25rem;
  }
}
dm-modal-report-validation-results.dm-modal {
  .modal {
    width: 54rem;
  }

  .modal__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 0;
  }

  .modal__title__period {
    color: var(--dm-shade-4);
  }

  .modal__tabs {
    margin-left: -1.4rem;
  }

  .modal__content {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding-top: 1.5rem;
  }
}
dm-modal-snapshot-new-ems.dm-modal {
    .modal__footer__button-attachment {
        margin-right: auto;
    }
}
dm-modal-survey-question.dm-modal-split-survey.dm-modal {
  .modal__header__left-side {
    display: flex;
    align-items: center;
    gap: 0.5rem;
  }

  .survey-title {
    color: var(--dm-color-primary);
  }

  .modal-split__right-side {
    margin-top: 5.625rem;
  }

  .modal__footer {
    justify-content: end;
  }
}
.dm-modal-split-survey.dm-modal {
  .modal {
    width: 70rem;
  }

  .modal-split {
    grid-template-columns: 6.5fr 6.5fr;
  }

  .modal__header {
    justify-content: space-between;
  }

  .modal__footer {
    justify-content: space-between;
  }

  .footer-buttons {
    display: flex;
    gap: 1.5rem;
  }

  .status-bar {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    font-size: 0.875rem;
  }

  .status-bar__label-group {
    display: flex;
    align-items: center;
    gap: 0.5rem;
  }

  .status-bar__label {
    color: var(--dm-shade-4);
  }

  .status-bar__value {
    margin-left: 0.375rem;
    color: var(--dm-shade-3);
  }

  .form-section {
    padding-bottom: 0.5rem;
  }

  .form-section:before {
    background: none;
  }

  .sub-section {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    overflow: auto;
  }

  .form-element.text-input textarea {
    font-family: "Courier New", Courier, monospace;
  }

  .reporting-period-section {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    grid-gap: 0.5rem 1.5rem;
    box-sizing: border-box;
    .section-title {
      margin-bottom: 1rem;
    }
    p {
      margin: 0;
      font-size: 0.75rem;
      color: var(--dm-shade-4);
      line-height: 150%;
    }
  }

  .top-controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--dm-shade-5);
    h4 {
      color: var(--dm-shade-3);
      font-size: 1.25rem;
      font-weight: 500;
      margin: 0;
    }

    .create-btn {
      color: var(--dm-color-primary);
      &:disabled {
        opacity: 0.2;
      }
    }
  }

  .no-items {
    color: var(--dm-shade-4);
    font-size: 0.8125rem;
    line-height: 200%;
    .txt-btn {
      font-size: 1rem;
      color: var(--dm-shade-4);
      text-decoration: underline;
    }
  }

  .items-list {
    overflow: auto;
    padding-top: 0.3rem;
    position: relative;
    .list-item {
      position: relative;
      background: color-mix(in srgb, var(--dm-shade-8) 60%, transparent);
      padding: 0.75rem 1rem 0.75rem 0.5rem;
      display: grid;
      grid-template-columns: 1rem auto 1fr auto;
      grid-gap: 0.75rem;
      align-items: center;
      margin-bottom: 0.5rem;

      .drag-icon {
        cursor: move;
      }

      .num {
        height: 1.4rem;
        min-width: 1.4rem;
        border-radius: 0.8rem;
        border: 1px solid var(--dm-shade-6);
        background: var(--dm-shade-8);
        display: inline-block;
        text-align: center;
        line-height: 1.4rem;
        span {
          color: var(--dm-shade-3);
          background: var(--dm-shade-8);
          font-size: 0.75rem;
        }
      }
      .m-sect {
        justify-self: left;

        .main-text {
          font-size: 0.875rem;
          font-weight: 500;
          color: var(--dm-shade-2);
        }
        .secondary-text {
          font-size: 0.75rem;
          font-weight: 500;
          color: var(--dm-shade-4);
          margin-top: 0.25rem;
        }
      }
      .r-sect {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        span {
          font-size: 0.75rem;
          color: var(--dm-shade-1);
          font-weight: 500;
        }
        .actions-button {
          cursor: pointer;
        }
      }

      &.dragging {
        opacity: 0.5;
      }
    }

    .drop-cursor {
      position: absolute;
      width: 100%;
      height: 1px;
      background: var(--dm-color-primary);
      top: 0;
      left: 0;
    }

    &.drag-disabled .list-item .drag-icon {
      opacity: 0.3;
    }
  }
}
.dm-modal-split-websites {
  .modal__header {
    justify-content: space-between;
    align-items: center;
  }

  .top-controls__header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 1.5rem;
  }

  .site-sections-list {
    overflow: auto;
  }

  .site-sections-section {
    display: grid;
    overflow: hidden;
    grid-template-rows: auto auto 1fr;
  }

  .site-sections-section .search-input {
    margin-bottom: 0.3rem;
  }

  .site-sections-section [hidden-section] {
    display: none;
  }

  .create-sections-controls {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--dm-shade-5);
  }

  .dm-search .sc[open] {
    width: 100%;
  }

  .system-section-info {
    .content {
      border: 1px solid var(--dm-color-primary);
      border-radius: 0.4rem;
      padding: 1rem;
      margin: 1rem;
      p {
        font-size: 0.875rem;
        margin: 0;
        padding: 0;
        color: var(--dm-shade-2);
        span {
          color: var(--dm-color-primary);
        }
      }
    }
  }

  .form-element-private {
    padding-bottom: 1rem;
  }
}
.dm-modal-split {
  .modal {
    width: 70rem;
    height: 90vh;
    display: grid;
    grid-template-rows: 1fr auto;
  }

  .modal-split {
    display: grid;
    grid-template-columns: 8fr 6.5fr;
    overflow: hidden;
  }

  .modal__header {
    padding: 1.5rem 3rem;
    display: flex;
    align-items: center;
  }

  .modal-split__right-side {
    padding: 1.5rem 3rem 0.5rem;
    background: color-mix(in srgb, var(--dm-shade-5) 20%, transparent);
    display: grid;
    overflow: hidden;
    box-sizing: border-box;
  }

  .modal-split__left-side {
    display: grid;
    grid-template-rows: auto 1fr;
    overflow: hidden;
  }

  .modal-split__left-side__content {
    padding: 1.5rem 3rem 0.5rem;
    overflow: auto;
  }
}
dm-modal-tag-admin.dm-modal {
  div.modal {
    width: 50rem;
    max-height: 90vh;

    #admin-tag-form {
      display: flex;
      flex-direction: column;
      gap: 1rem;
    }

    .admin-tag__form-section {
      position: relative;
      display: grid;
      grid-template-columns: 1fr 1fr;
      grid-template-rows: auto;
      grid-gap: 1.5rem;
      box-sizing: border-box;
    }

    .modal__header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 1.5rem 3rem;
    }

    .modal__header-switch {
      display: flex;
      gap: 0.875rem;
      align-items: center;
      font-size: 0.875rem;
      line-height: 1.5rem;
      color: var(--dm-shade-3);
    }

    .modal__content {
      padding-bottom: 1.5rem;
    }

    .tag__description {
      height: 27rem;
      font-family: Courier;
      font-style: normal;
      font-weight: normal;
      font-size: 0.9375rem;
      line-height: 1.375rem;
      color: var(--dm-shade-1);
      white-space: pre-wrap;
    }
  }
}
dm-modal-report-history.dm-modal {
  .modal {
    display: grid;
    grid-template-rows: auto 1fr;
    padding-bottom: 0.75rem;
    width: 80%;
    height: 90%;
  }

  .modal__header {
    display: grid;
    grid-template-columns: auto 1fr auto auto;
    grid-gap: 1rem;
    align-items: center;
    padding: 0 1.875rem;
    height: 5rem;

    dm-search {
      margin-right: 1rem;
    }
  }

  .modal__content {
    max-height: 100%;
    overflow: scroll;
    padding: 0 1.875rem 3rem 1.875rem;

    .report-history-table {
      height: 100%;
    }

    .dm-table {
      .actions-button {
        color: var(--dm-shade-5);
        width: 1.25rem;
      }
    }

    .dm-table tr {
      grid-template-columns: 4fr 1.5fr 2fr 1.5fr 0.5fr;
    }

    .table__name-cell {
      display: flex;
      align-items: center;
      gap: 0.75rem;
    }

    .table__report-icon {
      width: 1.5rem;
    }
  }

  .modal__title-holder {
    display: flex;
    flex-direction: column;

    .modal__title {
      font-weight: 500;
      font-size: 0.75rem;
      line-height: 1.125rem;
      letter-spacing: 0.3px;
      text-transform: uppercase;
      color: var(--dm-color-primary);
    }

    .modal__user-email {
      font-weight: 500;
      font-size: 1.25rem;
      line-height: 1.875rem;
      color: var(--dm-shade-3);
    }
  }

  .modal__footer {
    display: none;
  }
}
dm-modal-snapshot-validate-ems.dm-modal {
  .modal {
    width: 90%;
    height: 90%;
    display: flex;
    flex-direction: column;
  }

  .validation-loading {
    width: 100%;
    display: flex;
    height: 100%;
    justify-content: center;
  }

  .validation-cancel-button {
    position: absolute;
    bottom: 0;
    margin-bottom: 1.5rem;
    z-index: var(--dm-z-index-modal);
  }

  .toolbar-left {
    display: flex;
    gap: 0.5rem;
  }

  .toolbar-middle {
    text-align: center;
    margin: 0 2rem;
    color: var(--dm-shade-3);
  }

  .toolbar-right {
    display: flex;
    gap: 1rem;
  }

  .toolbar-middle-period {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    justify-content: center;
  }

  .toolbar-middle-icon {
    opacity: 0.5;
  }

  .toolbar-middle-period-label {
    font-size: 0.875rem;
    font-weight: 500;
  }

  .toolbar-middle-status {
    font-size: 0.8125rem;
    font-weight: 500;
  }

  .validate-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 1;
    overflow: auto;
  }

  .validate-text {
    margin-top: 1.5rem;
    margin-bottom: 2.5rem;
  }

  .validate-actions {
    display: flex;
    justify-content: center;
    gap: 1rem;
  }
}
dm-modal-video-plugin.dm-modal {
  .modal {
    width: 50rem;
  }

  .form-section {
    padding: 0;
  }

  .modal__content {
    background-color: inherit;
  }

  .modal__footer {
    justify-content: space-between;
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;

    & > *:only-child {
      margin-left: auto;
    }
  }

  .text-input__copy-code-button {
    margin-top: 0.5rem;
  }
}
dm-modal-display-alphanumeric-keywords.dm-modal {
  width: 34rem;

  .modal__header {
    padding: 1rem 1.5rem;
  }

  .modal__content {
    padding: 1rem 1.5rem 3rem 1.5rem;
  }

  .modal__footer {
    padding: 1rem 1.5rem;
  }

  .form {
    display: grid;
    grid-gap: 1.5rem;
  }

  .keywords-input .frame {
    height: 3rem;
  }
}
.modal-website-section .modal {
  position: absolute;
  top: 3.5rem;
  right: 20vw;
  width: 30rem;

  .modal__header {
    padding: 2rem 3rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .default-section-title {
    font-size: 0.725rem;
    color: var(--dm-color-category-6);
    font-weight: normal;
  }

  .modal__content {
    .website-section-form {
      display: flex;
      flex-direction: column;
      gap: 1.5rem;
    }
  }

  .system-section-info {
    padding-top: 1rem;
    p {
      font-size: 0.875rem;
      margin: 0;
      padding: 0;
      color: var(--dm-shade-2);
      span {
        color: var(--dm-color-primary);
      }
    }
  }
}
.modal-container {
  --dm-modal-padding: 1rem 3rem;

  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: color-mix(in srgb, var(--dm-shade-1) 70%, transparent);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: var(--dm-z-index-modal);
  animation: fadeIn 0.5s ease;
  animation-fill-mode: forwards;

  .modal {
    position: relative;
    background: var(--dm-main-bg-color);
    width: 48rem;
    max-height: 90vh;
    display: grid;
    grid-template-rows: auto 1fr auto;
    border-radius: 0.25rem;
    overflow: hidden;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.5);

    animation:
      fadeIn 0.3s,
      slideUp 0.3s;
    animation-timing-function: ease;
    animation-fill-mode: forwards;

    &.error-modal {
      .modal-content {
        white-space: break-spaces;
        word-break: break-word;
      }
    }

    .modal-header {
      display: grid;
      grid-template-columns: 1fr auto;
      align-items: center;
      height: 5rem;
      padding: var(--dm-modal-padding);
      box-sizing: border-box;
      h3 {
        color: var(--dm-shade-3);
        font-size: 1.25rem;
        font-weight: 500;
      }

      .dm-search .sc {
        height: 3rem;
      }
    }
    .modal-content {
      overflow-y: auto;
      min-height: 13rem;
      &.blurred {
        filter: blur(0.5rem);
      }
      &.p3 {
        padding: 0 3rem;
      }
    }

    .modal-footer {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      padding: var(--dm-modal-padding);
      box-sizing: border-box;
      height: 5rem;
      background: var(--dm-shade-8);
      box-shadow: inset 0 0.0625rem 0 var(--dm-shade-6);
      button {
        min-width: 8rem;
        &.special {
          background: var(--dm-color-neu);
        }
      }

      dm-button:not(:first-of-type),
      .primary-btn:not(:first-of-type),
      .secondary-btn:not(:first-of-type) {
        margin-left: 1.5rem;
      }
    }
  }

  &.sub {
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(17, 21, 31, 0.2);
  }

  .modal.error-modal {
    width: 30rem;
    .modal-content {
      min-height: 10rem;
    }
  }
}
.loading .modal {
  pointer-events: none;
}
.mode-label {
  pointer-events: none;
  position: fixed;
  z-index: var(--dm-z-index-mode-label);

  padding: 0.1875rem 0.5rem;
  border-radius: 0 0.25rem 0 0;
  font-size: 0.6875rem;
  line-height: 0.875rem;
}
.mode-label--dev {
  color: var(--dm-color-static);
  background: var(--dm-color-primary);
}
.mode-label--demo {
  color: var(--dm-color-static);
  background: rgba(89, 98, 131, 0.7);
}
.mode-label--prod {
  display: none;
}
.mode-label--position-bottom-left {
  bottom: 0;
  left: 0;
}
.mode-label--position-bottom-centre {
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 0);
  border-radius: 0.25rem 0.25rem 0 0;
}
dm-monthly-import {
  .content-viewport {
    display: grid;
    grid-template-rows: 1fr auto;
    padding-bottom: 0.5rem !important;
    padding-left: 10% !important;
    padding-right: 10% !important;
  }

  .first-import {
    width: 100%;
    height: calc(100% - 5rem);

    display: flex;
    align-items: center;
    justify-content: center;
  }

  .first-import__cover {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .first-import__title {
    font-size: 1.375rem;
    line-height: 1.875rem;
    color: color-mix(in srgb, var(--dm-shade-2) 60%, transparent);

    margin-top: 1.5rem;
    margin-bottom: 2rem;
  }

  .import-logs {
    overflow: hidden;
    display: grid;
    grid-template-rows: max-content auto;
    position: relative;
  }
}
dm-modal-monthly-import-import {
  .first-row {
    display: flex;
    margin-bottom: 1.5rem;
  }

  .first-row__select {
    flex: 1;
    margin-right: 1rem;
  }

  .first-row__select:last-of-type {
    margin-right: 0rem;
  }
}
dm-modal-monthly-import-unpublish {
  .first-row {
    display: flex;
    margin-bottom: 1.5rem;
  }
}
dm-input-text-tags {
  label {
    display: inline-block;
    color: var(--dm-shade-3);
    margin-bottom: 0.375rem;
    span {
      font-size: 0.75rem;
      font-weight: 500;
      text-transform: uppercase;
      &.sub {
        padding-left: 0.5rem;
        color: var(--dm-shade-4);
        text-transform: initial;
      }
    }
  }

  .frame {
    height: auto;
    min-height: 2.5rem;
    padding: 0 0.75rem;
    display: flex;
    align-items: center;

    .multi-input-output {
      display: none;
    }

    input {
      width: 0;
      height: 1.7rem;
      font-size: 0.875rem;
      color: var(--dm-shade-1);
      padding: 0;
      border: none;
      background: none;
      position: relative;
      top: 0.1rem;
      &:focus {
        border: 0;
        outline: none;
      }
    }

    .selected-items-holder {
      &:after {
        background: none;
        width: 0;
        height: 0;
      }

      width: 100%;
      .selected-items-line {
        min-height: 1.875rem;
        display: flex;
        flex-wrap: wrap;
        span {
          margin-right: 0.5rem;
          margin-top: 0.25rem;
          margin-bottom: 0.25rem;
          text-transform: none;
        }
      }
    }

    &.edit-mode {
      input {
        width: 10rem;
        padding-left: 0.5rem;
      }
    }
  }

  &[readonly] {
    .selected-items-line {
      span.selected-item {
        padding: 0 0.225rem;
      }
    }
  }
}
dm-notifications-entity-type {
  #main-viewport {
    display: grid;
    grid-template-rows: 1fr auto;
    padding-bottom: 0.5rem !important;
  }
}
dm-notifications-dashboard {
  #main-viewport {
    display: grid;
    grid-template-rows: 1fr auto;
    padding-bottom: 0.5rem !important;
  }

  dm-table-simple {
    display: grid;
    grid-template-rows: 1fr auto;
    overflow: auto;
    width: 100%;
    height: 100%;
    box-sizing: border-box;

    .table-container {
      height: 100%;
      overflow: hidden;

      .dm-table {
        height: 100%;
        overflow: hidden;
      }

      .dm-table tr {
        grid-auto-flow: column;
        grid-template-columns: 3fr 1fr 1fr 0.25fr;
      }
    }
  }
}
dm-notifications-entity {
  #main-viewport {
    display: grid;
    grid-template-rows: 1fr auto;
    padding-bottom: 0.5rem !important;
  }

  dm-table-simple {
    display: grid;
    grid-template-rows: 1fr auto;
    overflow: auto;
    width: 100%;
    height: 100%;
    box-sizing: border-box;

    .table-container {
      height: 100%;
      overflow: hidden;

      .dm-table {
        height: 100%;
        overflow: hidden;
      }

      .dm-table tr {
        grid-auto-flow: column;
        grid-template-columns: 3fr 1fr 1fr 0.25fr;
      }
    }
  }
}
.modal.notification-entity-view-modal {
  grid-template-columns: 1fr 0.75fr;
  width: 75rem;
  height: 80%;

  .entity_notification-modal__report-period {
    display: grid;
    grid-gap: 0.5rem 1.5rem;
  }

  .form-element__info {
    margin: 0;
    font-size: 0.75rem;
    color: var(--dm-shade-4);
    line-height: 150%;
  }

  .modal-header {
    grid-row: 1;
    grid-column: 1;

    .rhs-tools {
      display: flex;
      gap: 2rem;
    }
  }

  .status-bar {
    font-size: 0.875rem;
    display: flex;
    flex-direction: row;
  }

  .status-bar__metric {
    display: flex;
    align-items: center;
    margin-left: 2rem;
  }

  .status-bar__label {
    color: var(--dm-shade-4);
  }

  .status-bar__value {
    margin-left: 0.375rem;
    color: var(--dm-shade-3);
  }

  & > .modal-content {
    grid-row: 2;
    grid-column: 1;
  }

  & > .modal-footer {
    grid-row: 3;
    grid-column: 1 / 3;

    display: grid;
    grid-template-columns: auto auto;

    dm-button button {
      margin-left: 0;
    }
  }

  .form-section:before {
    background: none;
  }

  .sub-section {
    grid-row: 1 / 3;
    grid-column: 2;
    background: color-mix(in srgb, var(--dm-shade-5) 20%, transparent);

    padding: 1.5rem 3rem 0.5rem 3rem;
    display: grid;
    grid-template-rows: auto 1fr;
    grid-gap: 0.5rem;
  }

  .sub-section__content {
    overflow: auto;
  }

  .sub-section__form-section {
    padding: 1.5625rem 0 1.5rem 0;
  }

  .sub-section__title {
    padding-bottom: 0.5rem;
    border-bottom: 0.0625rem solid var(--dm-shade-5);
  }
}
.modal-container {
  .notification-entity-view-modal {
    .notification-entity__media-select .selected__display {
      display: inline-block;
      text-overflow: ellipsis;
      width: calc(80%);
    }
  }

  .notification-entity-media-modal.modal {
    height: 90%;
    width: 80%;
    display: grid;
    grid-template-rows: auto 1fr auto;

    .notification-entity-media-modal__header {
      grid-template-columns: 1fr auto;
    }

    .notification-entity-media-modal__title {
      padding-top: 0;
    }

    .notification-entity-media-modal__content {
      display: grid;
      grid-template-rows: auto 1fr;
      background: var(--dm-shade-10);
    }
  }
}
dm-notifications-general {
  #main-viewport {
    display: grid;
    grid-template-rows: 1fr auto;
    padding-bottom: 0.5rem !important;
  }

  dm-table-simple {
    display: grid;
    grid-template-rows: 1fr auto;
    overflow: auto;
    width: 100%;
    height: 100%;
    box-sizing: border-box;

    .table-container {
      height: 100%;
      overflow: hidden;

      .dm-table {
        height: 100%;
        overflow: hidden;
      }

      .dm-table tr {
        grid-auto-flow: column;
        grid-template-columns: 3fr repeat(3, 1fr) 0.75fr 0.25fr;
      }
    }
  }
}
.modal.notification-general-view-modal {
  grid-template-columns: 1fr 0.75fr;
  width: 75rem;
  height: 80%;

  .modal-header {
    grid-row: 1;
    grid-column: 1;

    .rhs-tools {
      display: flex;
      gap: 2rem;
    }
  }

  .status-bar {
    font-size: 0.875rem;
    display: flex;
    flex-direction: row;
  }

  .status-bar__metric {
    display: flex;
    align-items: center;
    margin-left: 2rem;
  }

  .status-bar__label {
    color: var(--dm-shade-4);
  }

  .status-bar__value {
    margin-left: 0.375rem;
    color: var(--dm-shade-3);
  }

  & > .modal-content {
    grid-row: 2;
    grid-column: 1;
  }

  & > .modal-footer {
    grid-row: 3;
    grid-column: 1 / 3;

    display: grid;
    grid-template-columns: 1fr auto auto;

    dm-button button {
      margin-left: 0;
    }
  }

  .form-section:before {
    background: none;
  }

  .sub-section {
    grid-row: 1 / 3;
    grid-column: 2;
    background: color-mix(in srgb, var(--dm-shade-5) 20%, transparent);

    padding: 1.5rem 3rem 0.5rem 3rem;
    display: grid;
    grid-template-rows: auto 1fr;
    grid-gap: 0.5rem;
  }

  .sub-section__content {
    overflow: auto;
  }

  .sub-section__form-section {
    padding: 1.5625rem 0 1.5rem 0;
  }

  .sub-section__title {
    padding-bottom: 0.5rem;
    border-bottom: 0.0625rem solid var(--dm-shade-5);
  }
}
dm-notifications-global {
  #no-notification {
    width: 100%;
    padding-top: 13rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
  }

  .notification-info-wrap {
    width: 56rem;
    margin: auto;
    .section-title {
      height: 3.5rem;
      display: flex;
      align-items: center;
      color: var(--dm-shade-1);
      font-weight: 500;
      border-bottom: 1px solid var(--dm-shade-6);
    }
    .notification-info {
      background: var(--dm-shade-8);
      border: 1px solid var(--dm-shade-6);
      display: grid;
      grid-template-columns: 1fr 10.5rem 4.5rem;

      label,
      span {
        line-height: 200%;
        font-size: 0.8125rem;
        text-transform: uppercase;
        font-weight: 500;
      }

      .info-item {
        padding: 1rem;
        label {
          color: var(--dm-shade-4);
        }
        p {
          margin: 0;
          color: var(--dm-shade-2);
          font-size: 0.875rem;
          font-weight: 500;
          line-height: 157%;
        }
        .ql-toolbar {
          display: none;
        }
      }

      .date-item {
        padding: 1rem 0;
        span {
          color: var(--dm-shade-3);
        }
      }

      .title {
        grid-row: 1;
      }
      .alert-text {
        grid-row: 2;
      }
      .content {
        grid-row: 3;
      }
      .date-item.from {
        grid-row: 1;
        grid-column: 2;
        label {
          color: var(--dm-color-category-5);
        }
      }
      .date-item.to {
        grid-row: 2;
        grid-column: 2;
        label {
          color: var(--dm-color-category-6);
        }
      }
      .actions-wrap {
        display: flex;
        justify-content: flex-end;
        padding: 1rem;
        .actions-button {
          width: 1.5rem;
          height: 1.5rem;
          grid-row: 1;
          grid-column: 3;
          cursor: pointer;
        }
      }
    }
  }
}
dm-notifications-month-change {
  #main-viewport {
    display: grid;
    grid-template-rows: 1fr auto;
    padding-bottom: 0.5rem !important;
  }

  dm-table-simple {
    display: grid;
    grid-template-rows: 1fr auto;
    overflow: auto;
    width: 100%;
    height: 100%;
    box-sizing: border-box;

    .table-container {
      height: 100%;
      overflow: hidden;

      .dm-table {
        height: 100%;
        overflow: hidden;
      }

      .dm-table tr {
        grid-auto-flow: column;
        grid-template-columns: 2.5fr 1fr 2fr 1fr 1fr 0.5fr;
      }
    }
  }
}
.modal.notification-month-change-view-modal {
  grid-template-columns: 1fr 0.75fr;
  width: 75rem;
  height: 80%;

  .month_change_notification-modal__media-options {
    display: flex;
    gap: 2rem;
    flex-direction: column;
  }

  .form-element__info {
    margin: 0;
    font-size: 0.75rem;
    color: var(--dm-shade-4);
    line-height: 150%;
  }

  .modal-header {
    grid-row: 1;
    grid-column: 1;

    .rhs-tools {
      display: flex;
      gap: 2rem;
    }
  }

  .status-bar {
    font-size: 0.875rem;
    display: flex;
    flex-direction: row;
  }

  .status-bar__metric {
    display: flex;
    align-items: center;
    margin-left: 2rem;
  }

  .status-bar__label {
    color: var(--dm-shade-4);
  }

  .status-bar__value {
    margin-left: 0.375rem;
    color: var(--dm-shade-3);
  }

  & > .modal-content {
    grid-row: 2;
    grid-column: 1;
  }

  & > .modal-footer {
    grid-row: 3;
    grid-column: 1 / 3;

    display: grid;
    grid-template-columns: auto auto;

    dm-button button {
      margin-left: 0;
    }
  }

  .form-section:before {
    background: none;
  }

  .sub-section {
    grid-row: 1 / 3;
    grid-column: 2;
    background: color-mix(in srgb, var(--dm-shade-5) 20%, transparent);

    padding: 1.5rem 3rem 0.5rem 3rem;
    display: grid;
    grid-template-rows: auto 1fr;
    grid-gap: 0.5rem;
  }

  .sub-section__content {
    overflow: auto;
  }

  .sub-section__form-section {
    padding: 1.5625rem 0 1.5rem 0;
  }

  .sub-section__title {
    padding-bottom: 0.5rem;
    border-bottom: 0.0625rem solid var(--dm-shade-5);
  }

  .content-editor .editor {
    height: 25rem;
    display: flex;
    flex-direction: column;

    .ql-toolbar.ql-snow + .ql-container.ql-snow {
      overflow: hidden;
    }
  }
}
dm-notifications-report-type {
  #main-viewport {
    display: grid;
    grid-template-rows: 1fr auto;
    padding-bottom: 0.5rem !important;
  }

  dm-table-simple {
    display: grid;
    grid-template-rows: 1fr auto;
    overflow: auto;
    width: 100%;
    height: 100%;
    box-sizing: border-box;

    .table-container {
      height: 100%;
      overflow: hidden;

      .dm-table {
        height: 100%;
        overflow: hidden;
      }

      .dm-table tr {
        grid-auto-flow: column;
        grid-template-columns: 3fr 1fr 1fr 0.25fr;
      }
    }
  }
}
.modal.notification-report-type-view-modal {
  grid-template-columns: 1fr;
  width: 75rem;
  height: 80%;

  .form-element__info {
    margin: 0;
    font-size: 0.75rem;
    color: var(--dm-shade-4);
    line-height: 150%;
  }

  .modal-header {
    grid-row: 1;
    grid-column: 1;

    .rhs-tools {
      display: flex;
      gap: 2rem;
    }
  }

  .status-bar {
    font-size: 0.875rem;
    display: flex;
    flex-direction: row;
  }

  .status-bar__metric {
    display: flex;
    align-items: center;
    margin-left: 2rem;
  }

  .status-bar__label {
    color: var(--dm-shade-4);
  }

  .status-bar__value {
    margin-left: 0.375rem;
    color: var(--dm-shade-3);
  }

  & > .modal-content {
    grid-row: 2;
    grid-column: 1;
  }

  & > .modal-footer {
    grid-row: 3;
    grid-column: 1 / 3;

    display: grid;
    grid-template-columns: auto auto;

    dm-button button {
      margin-left: 0;
    }
  }

  .form-section:before {
    background: none;
  }
}
dm-notifications-user {
  .notifications__icon {
    height: 2rem;
    width: 2rem;
  }

  .drawer {
    pointer-events: none;
    position: absolute;
    top: 0;
    z-index: var(--dm-z-index-below);
    transition: left 200ms ease-in;
    left: -100%;
    height: 100vh;
    background-color: var(--dm-shade-8);

    &[open] {
      pointer-events: auto;
    }
  }

  .view {
    pointer-events: none;
    position: absolute;
    top: 0;
    left: -1000;
    transition: left 200ms ease-in;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    z-index: var(--dm-z-index-notification-view);

    height: 100%;
    width: 27rem;
    background-color: var(--dm-shade-8);
    padding: 1.312rem 1.5rem 0.0625rem 1.5rem;
    box-shadow:
      0 0 0.125rem rgba(0, 0, 0, 0.12),
      0 -0.125rem 1rem rgba(0, 0, 0, 0.15);
    border-radius: 0 0.25rem 0.25rem 0;

    &[open] {
      pointer-events: auto;
    }
  }

  .view__header {
    display: flex;
    align-content: center;
    flex-direction: column;
    border-bottom: 0.0625rem solid var(--dm-shade-6);
    padding-bottom: 0.25rem;
  }

  .view__group {
    display: flex;
  }

  .view__group > :not(:first-child) {
    margin-left: 1rem;
  }

  .view__row {
    display: flex;
    justify-content: space-between;
  }

  .view__title {
    padding-bottom: 1.0625rem;
  }

  .view__content {
    flex: 1;
    overflow: auto;
    position: relative;

    margin-top: 1rem;
  }

  .view-list__header {
    border-bottom: none;
  }

  .view_list__title {
    padding-bottom: 0.8125rem;
  }

  .view-list__content {
    margin-top: 0;
  }

  .view-list__top-blur {
    height: 1.25rem;
    background: linear-gradient(180deg, var(--dm-shade-8) 0%, rgba(0, 0, 0, 0) 100%);
    position: sticky;
    width: 100%;
    top: 0;
    left: 0;
    z-index: var(--dm-z-index-accent);
  }

  .view-list__message {
    padding-top: 2.75rem;
    text-align: center;
    font-size: 1rem;
    line-height: 1.375rem;
    color: var(--dm-shade-3);
  }

  .view-list__message__empty-image {
    margin-bottom: 1.5rem;
  }

  .view-details {
    width: 32rem;
  }

  .view-details__actions {
    margin-right: 1rem;
  }

  .view-details {
    width: 32rem;
  }

  .view-details__details__subject {
    margin-bottom: 0.5rem;
    font-size: 1rem;
    font-style: normal;
    font-weight: 600;
    line-height: 1.375rem;
    color: var(--dm-shade-1);
  }

  .view-details__details__timestamp {
    font-size: 0.8125rem;
    line-height: 130%;
    font-feature-settings:
      "tnum" on,
      "lnum" on;
    color: var(--dm-shade-4);
  }

  .view-details__details__content {
    margin: 1.5rem 0 1rem 0;
    font-size: 0.875rem;
    line-height: 150%;
    font-feature-settings:
      "tnum" on,
      "lnum" on;
    color: var(--dm-shade-2);
  }

  .view-list__item {
    cursor: pointer;

    padding: 0.8125rem 0.75rem 0.75rem 0.75rem;
    border-radius: 0.25rem;
    position: relative;

    &:not(:last-of-type) {
      margin: 0 0 0.5rem 0;
    }
  }

  .view-list__item--unread {
    background: color-mix(in srgb, var(--dm-color-primary) 5%, transparent);

    &::before {
      content: "";
      position: absolute;
      display: block;
      height: 0.5rem;
      width: 0.5rem;
      top: 0.0625rem;
      left: 0.0625rem;

      border-radius: 50%;
      background-color: var(--dm-color-primary);
    }

    &:hover {
      background: color-mix(in srgb, var(--dm-color-primary) 10%, transparent);
    }
  }

  .view-list__item--read {
    background: color-mix(in srgb, var(--dm-shade-6) 30%, transparent);

    &:hover {
      background: color-mix(in srgb, var(--dm-shade-6) 60%, transparent);
    }
  }

  .view-list__item__header {
    display: flex;
    justify-content: space-between;
    align-items: start;

    font-weight: 600;
    font-size: 0.875rem;
    line-height: 130%;
    color: var(--dm-shade-1);
  }

  .view-list__item__actions {
    width: 1.25rem;
    height: 1.25rem;
  }

  .view-list__item__content {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;

    margin-top: 0.25rem;
    margin-bottom: 0.75rem;
    font-size: 0.8125rem;
    line-height: 130%;
    color: var(--dm-shade-3);
    font-feature-settings:
      "tnum" on,
      "lnum" on;
  }

  .view-list__item__footer {
    font-size: 0.8125rem;
    line-height: 130%;
    color: var(--dm-shade-4);
    font-feature-settings:
      "tnum" on,
      "lnum" on;
  }
}
.organizations {
  padding-top: 1rem;
  display: grid;
  padding-bottom: 0.5rem !important;

  .organizations-table {
    display: grid;
    grid-template-rows: 1fr;
    overflow: auto;
    width: 100%;
    height: 100%;
    box-sizing: border-box;

    .table-container {
      height: 100%;
      overflow: hidden;
    }

    .dm-table {
      height: 100%;
      overflow: hidden;
    }
  }

  .additional-tools {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-bottom: 1rem;
    padding: 0 0.2rem;

    .txt-btn {
      display: flex;
      align-items: center;
      margin-left: 1.5rem;
      img {
        margin-right: 0.5rem;
      }
    }
  }
}
#add-organization-form {
  .group-separator {
    img {
      cursor: pointer;
    }
  }

  .add-contact-element {
    display: flex;
    align-items: flex-end;
    button {
      color: var(--dm-color-primary);
      position: relative;
      bottom: 0.2rem;
    }
  }
}
dm-organization-throttling {
  #main-viewport {
    display: grid;
    grid-template-rows: 1fr auto;
    padding-bottom: 0.5rem !important;
  }

  dm-table-simple {
    display: grid;
    grid-template-rows: 1fr auto;
    overflow: auto;
    width: 100%;
    height: 100%;
    box-sizing: border-box;

    .table-container {
      height: 100%;
      overflow: hidden;

      .dm-table {
        height: 100%;
        overflow: hidden;
      }
    }
  }
}
dm-other-internet {
  #main-viewport {
    display: grid;
    grid-template-rows: 1fr auto;
  }
}
dm-page-not-found {
  #main-viewport {
    display: grid;
    background: var(--dm-shade-6);

    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);

    justify-content: center;
    justify-items: center;
    align-content: center;
  }

  .page-not-found__text {
    font-size: 1.375rem;
    line-height: 1.6875rem;
    color: var(--dm-shade-1);
    font-weight: 600;
    letter-spacing: 0.2px;
  }

  .page-not-found__image-wrapper {
    position: relative;
    margin: 2rem 0 3rem;
  }

  .page-not-found__image {
    height: 30rem;
    filter: drop-shadow(0 1rem 2rem rgba(0, 0, 0, 0.3));
    border-radius: 0.5rem;
  }

  .page-not-found__404-text {
    position: absolute;
    bottom: 2.5rem;
    left: 3.375rem;
  }
}
dm-pagination {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  color: var(--dm-shade-3);
  font-size: 0.75rem;
  font-weight: 500;
  align-items: center;
  padding: 1rem;
  background-color: var(--dm-shade-8);

  .rows-per-page {
    display: flex;
    align-items: center;
    gap: 0.75rem;
  }

  .pages {
    display: flex;
    margin: 0 auto;
    gap: 0.5rem;
  }

  .navigation {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 0.75rem;
  }

  .navigation__buttons {
    display: flex;
    gap: 0.5rem;
  }
}
.permission-overrides {
  padding-top: 1rem;
  display: grid;
  grid-template-rows: 1fr;
  padding-bottom: 0.5rem !important;
}
dm-popup-menu {
  display: block;
  position: fixed;
  z-index: var(--dm-z-index-menu);

  background: var(--dm-shade-8);
  box-shadow: 0 0.25rem 1rem rgba(0, 0, 0, 0.15);
  border-radius: 0.25rem;

  .title {
    display: flex;
    align-items: center;
    padding: 0 1rem;
    text-transform: uppercase;
    height: 1.75rem;
    box-shadow: inset 0 -0.0625rem 0 var(--dm-box-shadow);
    span {
      font-size: 0.625rem;
      color: var(--dm-color-primary);
    }
  }

  ul {
    max-height: 18.75rem;
    overflow-y: auto;
    li {
      display: flex;
      align-items: center;
      height: 2.5rem;
      padding: 0 1rem;
      min-width: 10rem;
      cursor: pointer;
      box-shadow: inset 0 -0.0625rem 0 var(--dm-box-shadow);

      span {
        font-size: 0.875rem;
        color: var(--dm-shade-1);
        white-space: nowrap;
        margin-right: 0.5rem;
      }

      .lIcon {
        margin-right: 0.5rem;
      }

      .rIcon {
        margin-left: auto;
      }

      &:last-child {
        box-shadow: none;
      }
      &:hover {
        background: var(--dm-shade-7);
      }
    }
  }
}
dm-preloader-large {
  display: contents;

  .big-preloader-with-text {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: color-mix(in srgb, var(--dm-shade-8) 75%, transparent);
    backdrop-filter: blur(0.1rem);
    z-index: var(--dm-z-index-preloader);

    @-moz-document url-prefix() {
      backdrop-filter: none;
    }

    .p-inner {
      position: absolute;
      left: 50%;
      top: 50%;
    }

    .shade-circle {
      width: 10rem;
      height: 10rem;
      left: -5rem;
      top: -5rem;
      background: var(--dm-shade-8);
      border-radius: 50%;
      position: absolute;
      box-shadow: 0 0.175rem 1.375rem rgba(0, 0, 0, 0.2);
    }
    span {
      position: absolute;
      font-size: 0.9375rem;
      color: var(--dm-shade-3);
      font-weight: 600;
      line-height: 2rem;
      top: -1rem;
      width: 10rem;
      left: -5rem;
      text-align: center;
    }

    .loader {
      position: relative;
      top: -6.2rem;
      left: -6.2rem;
      width: 12.4rem;
    }
  }
}
dm-preloader {
  .loader {
    position: relative;
    margin: 0 auto;
    width: 2rem;
    &:before {
      content: "";
      display: block;
      padding-top: 100%;
    }
  }

  .circular {
    animation: rotate 2s linear infinite;
    height: 100%;
    transform-origin: center center;
    width: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
  }

  .path {
    stroke-dasharray: 1, 200;
    stroke-dashoffset: 0;
    animation: dash 1s ease-in-out infinite;
    stroke-linecap: round;

    &.blue {
      stroke: var(--dm-color-primary);
    }
    &.red {
      stroke: var(--dm-color-category-6);
    }
    &.white {
      stroke: var(--dm-shade-8);
    }
  }
}
.table-legend-tooltip {
  width: 4rem;
  padding: 0.5rem;
  color: var(--dm-color-static);
  text-align: center;
  span {
    font-weight: 500;
    line-height: 130%;
  }
  & > div {
    margin: 0.125rem;
  }
  .green {
    color: var(--dm-color-category-5);
  }
  .yellow {
    color: var(--dm-color-category-7);
  }
  .red {
    color: var(--dm-color-category-6);
  }
}
.group-table-header-cell-tooltip {
  padding: 0.75rem;
  max-width: 14rem;
  width: max-content;
  .content {
    font-weight: 500;
    line-height: 130%;
  }
}
dm-table-groups {
  .media-group-cell {
    height: 100%;
    width: 100%;
    box-sizing: border-box;

    display: flex;
    gap: 0.5rem;
    align-items: center;
    overflow: hidden;

    & > span {
      font-size: 0.8125rem;
      font-weight: 600;
      color: var(--dm-shade-2);
      white-space: nowrap;
      text-overflow: ellipsis;
      overflow: hidden;

      &.path {
        color: var(--dm-shade-4);
        font-weight: 500;
      }
    }

    .total-img {
      filter: brightness(0.8);
    }
  }

  .row-group-cell .media-group-cell {
    padding: 0 0.75rem;
  }

  .media-value-cell {
    text-align: center;
    width: 100%;
    font-size: 0.8125rem;
    color: var(--dm-shade-3);
  }

  .metric-cell {
    span {
      cursor: pointer;
      text-transform: uppercase;
      max-height: 2.3rem;
      line-height: 120%;
      border-bottom: 1px dashed var(--dm-shade-4);
      font-weight: 600;
    }
  }
  .question-cell {
    span {
      text-transform: uppercase;
      font-size: 0.75rem !important;
      color: var(--dm-shade-4) !important;
    }
  }

  .advanced-target-label-cell {
    span {
      text-transform: uppercase;
      font-size: 0.75rem !important;
      color: var(--dm-color-category-1) !important;
    }
  }
  .custom-target-label-cell {
    span {
      text-transform: uppercase;
      font-size: 0.75rem !important;
      color: var(--dm-color-secondary) !important;
    }
  }
  .complex-target-cell {
    span {
      cursor: pointer;
      border-bottom: 1px dashed color-mix(in srgb, var(--dm-color-primary) 50%, transparent);
    }
  }
}
dm-query-logs {
  .date-range-picker {
    width: 16rem;
  }

  dm-table-simple {
    display: grid;
    grid-template-rows: 1fr auto;
    overflow: auto;
    width: 100%;
    height: 100%;
    box-sizing: border-box;

    .table-container {
      height: 100%;
      overflow: auto;
    }

    .dm-table {
      height: 100%;
      overflow: hidden;
    }

    .dm-table tr {
      grid-template-columns: 0.75fr 0.5fr repeat(2, 1fr) 1.5fr 0.75fr 1fr 0.25fr;
    }
  }
}
.dm-modal.quill-content-modal {
  .modal__content {
    min-height: 5rem;
  }

  .editor {
    background: none;

    .ql-toolbar {
      display: none;
    }
  }
}
dm-range {
  .range__input {
    width: 100%;
  }
}
.report-results {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  display: grid;
  grid-template-rows: auto auto 1fr;

  &[fullScreen] {
    position: fixed;
    z-index: var(--dm-z-index-modal);

    .results__main__wrapper {
      top: 0;
      left: 0;
      height: 100%;
      width: 100%;
      background-color: var(--dm-bg-color);
      z-index: var(--dm-z-index-modal);
      position: fixed;
    }
  }

  .results__loading {
    position: absolute;
    top: 0;
    left: 0;
    display: grid;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background: var(--dm-shade-8);
    z-index: var(--dm-z-index-preloader);
  }

  .results__loading__loader {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
  }

  .results__loader__circle {
    width: 10rem;
    height: 10rem;
    background: var(--dm-shade-8);
    border-radius: 50%;
    box-shadow: 0 0.175rem 1.375rem rgba(0, 0, 0, 0.2);
  }

  .results__loading__cancel-button {
    position: absolute;
    bottom: 0;
    margin-bottom: 1.5rem;
    justify-self: center;
  }

  .results__loader__loader {
    position: absolute;

    .loader {
      position: relative;
      margin: 0 auto;
      width: 12.4rem;
    }
  }

  .results__loader__title {
    position: absolute;
    font-size: 0.9375rem;
    color: var(--dm-shade-3);
    font-weight: 600;
    line-height: 2rem;
    top: 4rem;
    width: 10rem;
    text-align: center;
  }

  .results__toolbar__left {
    display: flex;
    gap: 0.25rem;
  }

  .results__toolbar__middle {
    text-align: center;
    margin: 0 2rem;
    color: var(--dm-shade-3);
  }

  .results__toolbar__right {
    display: flex;
    gap: 1rem;
  }

  .results__toolbar__right__buttons {
    display: flex;
    gap: 0.25rem;
  }

  .toolbar__middle__period {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    justify-content: center;
  }

  .toolbar__middle__period__month-change-notification {
    position: static;
  }

  .toolbar__middle__period__day-parts {
    font-size: 0.8125rem;
    font-weight: 500;
  }

  .toolbar__middle__period__icon {
    opacity: 0.5;
  }

  .toolbar__middle__period__label {
    font-size: 0.875rem;
    font-weight: 500;
  }

  .results__main__wrapper {
    overflow: hidden;
    display: grid;
    grid-template-rows: auto 1fr;

    .main__wrapper__graph {
      box-shadow:
        inset -0.0625rem 0 0 var(--dm-shade-6),
        inset 0.0625rem 0 0 var(--dm-shade-6),
        inset 0 -0.0625rem 0 var(--dm-shade-6);
      padding-bottom: 1.5rem;
      background-color: var(--dm-bg-color);
    }

    .main__wrapper__fullscreen-exit-btn {
      z-index: var(--dm-z-index-exit-fs-button);
      position: absolute;
      top: 0.3rem;
      left: 0.8rem;
      background: #8b91a8;
      padding: 0.375rem 0.5rem;
      border-radius: 0.25rem;
      filter:
        drop-shadow(0 0 0.125rem rgba(0, 0, 0, 0.12)),
        drop-shadow(0 0.125rem 1rem rgba(0, 0, 0, 0.15));
      align-items: center;
      justify-content: center;
    }
  }

  .not-available {
    pointer-events: none;
    opacity: 0.3;
  }

  .action-button {
    cursor: pointer;
  }

  .tools__table-settings {
    display: flex;
    position: relative;
  }

  .tools__table-settings__popup {
    position: absolute;
    width: 13rem;
    z-index: var(--dm-z-index-menu);
    right: -0.8rem;
    top: -0.4rem;
    display: none;
    background: var(--dm-shade-8);
    box-shadow:
      0 0 0.125rem rgba(0, 0, 0, 0.12),
      0 0.25rem 1rem rgba(0, 0, 0, 0.15);
    border-radius: 0.25rem;

    &.active {
      display: grid;
    }

    .tools__table-settings__popup__item {
      cursor: pointer;
      display: flex;
      gap: 0.75rem;
      align-items: center;
      height: 3rem;
      padding: 0 1rem;

      label {
        color: var(--dm-shade-2);
        font-size: 0.875rem;
        cursor: pointer;
      }

      &:first-child {
        border-bottom: 1px solid var(--dm-box-shadow);
      }
    }
  }

  .results__alerts {
    margin: 0 1.65rem;
    grid-template-rows: auto 1fr;
  }

  .results__alerts__alert {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;

    .alert__message {
      font-size: 0.8125rem;
      line-height: 130%;
    }
  }

  .tools__transaction {
    font-size: 0.8rem;
    position: relative;
    top: 0.15rem;
  }

  .tools__transaction__id {
    color: #006aee;
  }

  .results__main {
    margin: 0 1.65rem;
    background: var(--dm-bg-color);
    display: grid;
    grid-template-rows: auto 1fr;
    overflow: hidden;
  }

  .results__main__header {
    height: 3rem;
    border: 1px solid var(--dm-shade-6);
    display: flex;
    justify-content: space-between;
    padding-right: 1rem;
  }

  .main__header__tools {
    display: flex;
    align-items: center;
    gap: 1rem;

    .tools__option {
      display: flex;
      gap: 1rem;
      align-items: center;
    }

    .tools__option__name {
      font-size: 0.8125rem;
      line-height: 1.375rem;
      color: var(--dm-shade-4);
      position: relative;
      top: 0.15rem;
    }
  }

  .main__header__graph-filter {
    display: flex;
    align-items: center;
    margin-left: 0.75rem;
  }
}
dm-modal-report-results-info.dm-modal {
  .info-section {
    border-bottom: 1px solid var(--dm-shade-6);
    padding: 1rem 0;

    h4 {
      color: var(--dm-shade-1);
      font-weight: 500;
      font-size: 0.875rem;
      margin: 0;
      margin-bottom: 0.875rem;
    }

    .info {
      background: var(--dm-shade-1);
      border-radius: 0.25rem;

      color: var(--dm-shade-8);
      padding: 0.375rem 0.625rem;

      span {
        font-size: 0.9rem;
      }
    }
  }
}
.tools__table-legend-tooltip {
  width: 3rem;
  padding: 0.2rem;
  color: var(--dm-color-static);
  text-align: center;

  span {
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 130%;
  }

  .option {
    margin: 0.15rem;
  }

  .option--green {
    color: var(--dm-color-category-5);
  }

  .option--yellow {
    color: var(--dm-color-category-7);
  }

  .option--red {
    color: var(--dm-color-category-6);
  }
}
.report-results-view {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  display: grid;
  grid-template-rows: auto auto 1fr;

  .results-wrapper {
    position: relative;
    height: 100%;
    overflow: hidden;

    display: grid;
    grid-template-rows: auto 1fr;

    #main-view-graph {
      overflow: hidden;
      box-shadow:
        inset -0.0625rem 0 0 var(--dm-shade-6),
        inset 0.0625rem 0 0 var(--dm-shade-6),
        inset 0 -0.0625rem 0 var(--dm-shade-6);
      padding-bottom: 1.5rem;
      background-color: var(--dm-bg-color);
    }

    #main-view-graph[hidden] {
      display: none;
    }

    .exit-fs-button {
      display: none;
      z-index: var(--dm-z-index-exit-fs-button);
      position: absolute;
      top: 1.8rem;
      left: 1rem;
      background: #8b91a8;
      padding: 0.375rem 0.5rem;
      border-radius: 0.25rem;
      filter:
        drop-shadow(0 0 0.125rem rgba(0, 0, 0, 0.12)),
        drop-shadow(0 0.125rem 1rem rgba(0, 0, 0, 0.15));
      align-items: center;
      justify-content: center;
    }
  }

  .results-wrapper.fullscreen {
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: var(--dm-z-index-modal);
    background-color: var(
      --dm-shade-8
    ); /* todo postoji zbog dayparts fullscreen, provjeriti utjece li ovo na category entities report results modal fullscreen */
    .exit-fs-button {
      display: flex;
    }
  }

  .not-available {
    pointer-events: none;
    opacity: 0.3;
  }

  .action-button {
    cursor: pointer;
  }

  .toolbar {
    box-shadow: none;
    justify-content: space-between;
    .tb-r {
      display: flex;
      gap: 1rem;
    }
    .tb-l,
    .tb-r__buttons {
      display: flex;
      align-items: center;
      gap: 0.25rem;
      margin: 0;
    }
    .tb-m {
      text-align: center;
      margin: 0 2rem;
      color: var(--dm-shade-3);
      .period-display {
        position: relative;
        .period-holder {
          display: flex;
          align-items: center;
          gap: 0.5rem;
          dm-notification-month-change-icon {
            position: static;
          }
        }
        span {
          position: relative;
          font-size: 0.875rem;
          font-weight: 500;
        }
        img {
          opacity: 0.5;
        }
      }
      .day-part-display {
        span {
          font-size: 0.8125rem;
          font-weight: 500;
        }
      }
    }
    .primary-btn {
      background: #888ea6;
      .refine-icon {
        position: relative;
        height: 1.1rem;
        &.active:after {
          content: "";
          display: block;
          position: absolute;
          width: 0.375rem;
          height: 0.375rem;
          border-radius: 50%;
          background: var(--dm-color-category-1);
          top: -0.25rem;
          left: 0.75rem;
          border: 2px solid #888ea6;
        }
      }
    }
    .back-btn {
      margin: 0;
      margin-right: 0.25rem;
      cursor: pointer;
    }
    .download-ctr-wrap {
      width: 1.5rem;
      display: flex;
      align-items: center;
      dm-preloader {
        font-size: 0.75rem;
      }
    }
  }

  .table-settings {
    display: flex;
    position: relative;

    .table-settings-popup {
      position: absolute;
      width: 13rem;
      z-index: var(--dm-z-index-menu);
      right: -0.8rem;
      top: -0.4rem;
      display: none;
      background: var(--dm-shade-8);
      box-shadow:
        0 0 0.125rem rgba(0, 0, 0, 0.12),
        0 0.25rem 1rem rgba(0, 0, 0, 0.15);
      border-radius: 0.25rem;

      &.active {
        display: grid;
      }

      .table-settings-popup__item {
        cursor: pointer;
        display: flex;
        gap: 0.75rem;
        align-items: center;
        height: 3rem;
        padding: 0 1rem;
        label {
          color: var(--dm-shade-2);
          font-size: 0.875rem;
          cursor: pointer;
        }
        &:first-child {
          border-bottom: 1px solid var(--dm-box-shadow);
        }
      }
    }
  }

  .report-results__alerts {
    margin: 0 1.65rem;
    grid-template-rows: auto 1fr;
  }

  .report-results__alert {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;

    .alert__message {
      font-size: 0.8125rem;
      line-height: 130%;
    }
  }
  .report-results-main {
    margin: 0 1.65rem;
    background: var(--dm-bg-color);
    display: grid;
    grid-template-rows: auto 1fr;
    overflow: hidden;

    .report-header {
      height: 3rem;
      border: 1px solid var(--dm-shade-6);
      display: flex;
      justify-content: space-between;
      padding-right: 1rem;

      .tools {
        display: flex;
        align-items: center;
        gap: 1rem;
        .tool-btn {
          cursor: pointer;
        }

        .tools__option-name {
          font-size: 0.8125rem;
          line-height: 1.375rem;
          color: var(--dm-shade-4);
          position: relative;
          top: 0.15rem;
        }

        .transactionId {
          font-size: 0.8rem;
          position: relative;
          top: 0.15rem;
        }
      }
    }
  }

  .report-results__compact-graph-filter {
    display: flex;
    align-items: center;
    margin-left: 0.75rem;
  }
}
dm-report-status-icons-row {
  display: flex;
  align-items: center;

  .report-status {
    display: flex;
    align-items: center;
  }

  .report-status__icon {
    display: flex;

    &:not(:first-of-type) {
      margin-left: -0.5rem;
    }
  }

  .report-status[size="large"] {
    .report-status__icon__image {
      height: 2rem;
      width: 2rem;
    }
  }
}
.report-status-tooltip .dm-tooltip__content {
  line-height: 130%;
  padding: 0.625rem 0.75rem;
  max-width: none;
}
.report-status-share__tooltip__title {
  font-weight: bold;
  margin-bottom: 0.5rem;
}
.report-status-share__tooltip__group:not(:last-of-type) {
  margin-bottom: 0.75rem;
}
.report-status-share__tooltip__users {
  color: var(--dm-color-category-5);
}
.report-status-share__tooltip__organizations {
  color: #6baeff;
}
.report-status-paused__tooltip__title {
  margin-bottom: 0.75rem;
}
.report-status-error__tooltip__title {
  margin-bottom: 0.75rem;
}
.report-status-error__tooltip__buttons {
  display: flex;
  gap: 0.5rem;
}
.report-status-missing-entities__tooltip__title {
  margin-bottom: 0.75rem;
}
.dm-report-results-turf-analysis {
  .combination-selection-controls {
    margin-top: 0.5rem;
  }
}
.dm-report-wizard {
  height: 100%;
  display: grid;
}
.report-wizard-report-results {
  height: 100vh;

  overflow: hidden;
}
.report-wizard {
  --dm-border-wizard: 0.0625rem solid var(--dm-shade-6);

  height: 100vh;
  display: grid;
  grid-template-rows: auto 1fr auto;
  position: relative;
  overflow: hidden;

  .header__title {
    display: flex;
    align-items: center;
    gap: 0.25rem;
  }

  .header__actions {
    display: flex;
    gap: 0.25rem;
  }

  .header__title__read-only-label {
    text-transform: lowercase;
    font-size: 1rem;
    color: var(--dm-shade-4);
  }

  .report-wizard__main {
    display: grid;
    grid-auto-rows: auto 1fr;
    background: var(--dm-shade-10);
    margin: 0 1.875rem;
    overflow: hidden;
  }

  .report-wizard__main__navigation-step {
    box-shadow:
      inset 0.0625rem 0 0 var(--dm-shade-6),
      inset -0.0625rem 0 0 var(--dm-shade-6),
      inset 0 0.0625rem 0 var(--dm-shade-6);
    border-left: var(--dm-border-wizard);
    border-right: var(--dm-border-wizard);
    border-top: var(--dm-border-wizard);
    border-radius: 0.25rem 0.25rem 0 0;
    box-sizing: border-box;

    background-color: var(--dm-shade-8);
    padding: 1.375rem 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, 7.75rem);
    justify-content: center;
  }

  .report-wizard__main__steps {
    height: 100%;
    box-shadow:
      inset 0.0625rem 0 0 var(--dm-shade-6),
      inset -0.0625rem 0 0 var(--dm-shade-6);
    border-left: var(--dm-border-wizard);
    border-right: var(--dm-border-wizard);
    box-sizing: border-box;
    overflow: hidden;
  }

  .dm-report-wizard-step {
    height: 100%;
    display: grid;
    grid-template-rows: auto 1fr;
    overflow: auto;

    &.disabled {
      pointer-events: none;
    }
  }

  .navigation-step__step {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;

    &:after {
      content: "";
      position: absolute;
      width: 100%;
      height: 0.0625rem;
      left: 0;
      top: 1.2rem;
      background: var(--dm-shade-6);
    }

    &[active][done] {
      .navigation-step__step__number {
        &:before {
          display: none;
        }

        &:after {
          background: url(/images/ic-step-done-2.svg);
          width: 2rem;
          height: 2rem;
          top: 0.2rem;
          left: 0.25rem;
        }

        span {
          left: -1.65rem;
          background: var(--dm-bg-color);
          padding-left: 0.4rem;
          color: var(--dm-color-primary);
        }
      }

      .navigation-step__step__name {
        color: var(--dm-color-primary);
      }
    }

    &[active]:not([done]) {
      .navigation-step__step__number {
        &:before {
          display: block;
        }

        &:after {
          background: var(--dm-color-primary);
        }

        span {
          color: var(--dm-shade-8);
        }
      }

      .navigation-step__step__name {
        color: var(--dm-color-primary);
      }
    }

    &:not([active])[done] {
      .navigation-step__step__number {
        &:before {
          display: none;
        }

        &:after {
          background: url(/images/ic-step-done.svg);
          width: 2rem;
          height: 2rem;
          top: 0.2rem;
          left: 0.25rem;
        }

        span {
          left: -1.65rem;
          background: var(--dm-bg-color);
          padding-left: 0.4rem;
          color: var(--dm-shade-4);
        }
      }

      .navigation-step__step__name {
        color: var(--dm-shade-4);
      }
    }

    &:not([active]):not([done]) {
      .navigation-step__step__number {
        &:before {
          display: none;
        }

        &:after {
          background: var(--dm-shade-6);
        }

        span {
          color: var(--dm-shade-4);
        }
      }

      .navigation-step__step__name {
        color: var(--dm-shade-4);
      }
    }

    &:first-child:after {
      right: 0;
      left: auto;
      width: 4rem;
    }

    &:last-child:after {
      width: 4rem;
    }
  }

  .navigation-step__step__number {
    z-index: var(--dm-z-index-element);
    width: 2.4rem;
    height: 2.4rem;
    display: flex;
    background-color: var(--dm-shade-8);
    align-items: center;
    justify-content: center;
    position: relative;
    padding-bottom: 0.5rem;
    cursor: pointer;

    &:before {
      content: "";
      display: none;
      position: absolute;
      width: 2rem;
      height: 2rem;
      left: 0.2rem;
      top: 0.2rem;
      border: 1px solid var(--dm-shade-5);
      border-radius: 50%;
      box-sizing: border-box;
    }

    &:after {
      content: "";
      display: block;
      position: absolute;
      width: 1.5rem;
      height: 1.5rem;
      left: 0.45rem;
      top: 0.45rem;
      background: var(--dm-shade-6);
      border-radius: 50%;
    }

    span {
      position: relative;
      z-index: var(--dm-z-index-accent);
      top: 0.01rem;
      font-weight: 600;
    }
  }

  .navigation-step__step__name {
    font-size: 0.875rem;
    line-height: 1.125rem;
    cursor: pointer;
  }

  .navigation-step__step__info {
    margin-top: 0.0625rem;
    font-weight: 600;
    font-size: 0.625rem;
    line-height: 0.75rem;
    letter-spacing: 0.04rem;
    color: var(--dm-shade-3);
    text-transform: uppercase;
  }

  .report-wizard__footer {
    height: 5rem;
    background: var(--dm-shade-8);
    filter: drop-shadow(0 -0.125rem 1rem rgba(0, 0, 0, 0.06));
    box-shadow: inset 0 0.0625rem 0 var(--dm-shade-6);

    padding: 0 1.5rem;
    display: flex;
    gap: 1rem;
    align-items: center;
    justify-content: space-between;
    z-index: var(--dm-z-index-wizard-footer);

    .m-section {
      position: relative;

      .entity-limit-alert {
        background: var(--dm-color-category-7);
        color: #614c0a;
        padding: 0.5rem 2rem;
        border-radius: 1rem;
        text-align: center;
        span {
          font-weight: 600;
          font-size: 0.9375rem;
        }
      }
    }

    .last-step-btn {
      img {
        width: 2.4rem;
        margin: 0 0.85rem 0 0;
      }
      color: var(--dm-color-primary);
      font-size: 0.875rem;
      font-weight: 600;
    }
  }

  .not-available {
    pointer-events: none;
    opacity: 0.3;
  }

  .last-step-btn {
    &.disabled {
      pointer-events: none;
      color: var(--dm-shade-5);
    }
  }

  .report-wizard__main {
    &.dm-scrollbar {
      &::-webkit-scrollbar-track {
        background: #f2f2f2;
      }
    }

    .no-data {
      color: var(--dm-shade-3);
      font-size: 1rem;
      text-align: center;
      text-transform: uppercase;
    }

    .period-step-scheduled__message {
      margin: 3rem 0;
      font-weight: 400;
      font-size: 0.875rem;
      line-height: 1.375rem;
      text-align: center;
      color: var(--dm-shade-1);
    }

    .time-span-display {
      min-width: 15rem;
      border-bottom: 1px solid var(--dm-color-primary);
      width: max-content;
      text-align: center;
      margin: 0 auto;
      padding: 0 3rem;
      box-sizing: border-box;
      margin-top: 2rem;

      h4 {
        margin: 0 0 0.75rem 0;
        font-size: 0.75rem;
        font-weight: 500;
        color: var(--dm-shade-4);
        text-transform: uppercase;
      }
      #selected-time-span {
        font-size: 0.875rem;
        font-weight: 500;
        color: var(--dm-shade-1);
      }
    }

    .time-span-alerts {
      margin: 1rem 12rem 0;
    }

    .day-parts-wrapper {
      display: flex;
      width: 100%;
      justify-content: center;
      margin-bottom: 2rem;
    }

    .calendar-wrapper {
      margin: 4rem 0 2rem 0;
      min-height: 19rem;
      #time-span-calendar {
        display: none;
      }
      .flatpickr-calendar {
        margin: 0 auto;
        box-shadow: none;
        min-width: 58rem;
        background: none;

        dm-notification-month-change-icon {
          position: absolute;
          top: 0.5rem;
          right: 1.5625rem;
        }

        .flatpickr-days {
          min-width: 58rem;
        }

        .flatpickr-current-month span.cur-month,
        .flatpickr-current-month input.cur-year {
          font-weight: 600;
          color: var(--dm-shade-3);
          font-size: 1rem;
        }

        span.flatpickr-weekday {
          font-size: 0.8125rem;
          font-weight: 600;
          color: var(--dm-shade-3);
        }

        .flatpickr-day.selected.startRange,
        .flatpickr-day.startRange.startRange,
        .flatpickr-day.endRange.startRange,
        .flatpickr-day.selected.endRange,
        .flatpickr-day.startRange.endRange,
        .flatpickr-day.endRange.endRange {
          background: var(--dm-color-neu);
          border: none;
        }

        .flatpickr-day.inRange,
        .flatpickr-day.prevMonthDay.inRange,
        .flatpickr-day.nextMonthDay.inRange,
        .flatpickr-day.today.inRange,
        .flatpickr-day.prevMonthDay.today.inRange,
        .flatpickr-day.nextMonthDay.today.inRange,
        .flatpickr-day:hover,
        .flatpickr-day.prevMonthDay:hover,
        .flatpickr-day.nextMonthDay:hover,
        .flatpickr-day:focus,
        .flatpickr-day.prevMonthDay:focus,
        .flatpickr-day.nextMonthDay:focus {
          cursor: pointer;
          outline: 0;
          background: var(--dm-box-shadow);
          border-color: var(--dm-box-shadow);
        }
        .flatpickr-day.inRange {
          border-radius: 0;
          -webkit-box-shadow:
            -0.3125rem 0 0 var(--dm-box-shadow),
            0.3125rem 0 0 var(--dm-box-shadow);
          box-shadow:
            -0.3125rem 0 0 var(--dm-box-shadow),
            0.3125rem 0 0 var(--dm-box-shadow);
        }
        .flatpickr-day {
          color: var(--dm-shade-1);
          font-size: 0.8125rem;
        }
        .flatpickr-day.selected,
        .flatpickr-day.startRange,
        .flatpickr-day.endRange,
        .flatpickr-day.selected.inRange,
        .flatpickr-day.startRange.inRange,
        .flatpickr-day.endRange.inRange,
        .flatpickr-day.selected:focus,
        .flatpickr-day.startRange:focus,
        .flatpickr-day.endRange:focus,
        .flatpickr-day.selected:hover,
        .flatpickr-day.startRange:hover,
        .flatpickr-day.endRange:hover,
        .flatpickr-day.selected.prevMonthDay,
        .flatpickr-day.startRange.prevMonthDay,
        .flatpickr-day.endRange.prevMonthDay,
        .flatpickr-day.selected.nextMonthDay,
        .flatpickr-day.startRange.nextMonthDay,
        .flatpickr-day.endRange.nextMonthDay {
          color: var(--dm-color-static);
        }

        .flatpickr-months {
          margin: 1.5rem 0;
        }

        .flatpickr-day.flatpickr-disabled,
        .flatpickr-day.flatpickr-disabled:hover {
          color: var(--dm-shade-5);
          cursor: default;
        }
      }
    }

    .group-by-presets {
      display: grid;
      grid-template-columns: minmax(auto, 12rem) 1fr minmax(auto, 12rem);
      align-items: center;
      height: 4.125rem;
      border-top: 1px solid var(--dm-shade-6);
      border-bottom: 1px solid var(--dm-shade-6);

      .group-by-label {
        justify-self: right;
        color: var(--dm-shade-3);
        font-weight: 600;
        span {
          font-size: 0.875rem;
        }
      }
      .group-preset-buttons {
        display: flex;
        justify-content: center;
        button {
          margin: 0 1rem;
        }
      }
    }

    .day-part-controls {
      text-align: center;

      h4 {
        margin: 0 0 0.75rem 0;
        font-size: 0.75rem;
        font-weight: 500;
        color: var(--dm-shade-4);
        text-transform: uppercase;
      }
      #selected-day-parts {
        cursor: pointer;
        display: inline-flex;
        align-items: center;
        gap: 0.5rem;
        position: relative;
        span {
          font-size: 0.875rem;
          font-weight: 500;
          color: var(--dm-shade-1);
        }
        img {
          position: absolute;
          right: -1.5rem;
        }
      }

      &.disabled {
        opacity: 0.5;
        pointer-events: none;
      }
    }

    .months-wrapper {
      min-height: 19rem;
      width: 57rem;
      margin: 2rem auto;

      &.two-months-wrapper {
        min-height: 19rem;
        width: 59rem;
        margin: 2rem auto;
      }
      .month-selectors-holder {
        display: grid;
        grid-template-columns: 28rem 0.0625rem 28rem;
        grid-gap: 1.5rem;
        .separator {
          background: var(--dm-shade-6);
        }
      }
    }

    .dm-report-wizard-step-summary {
      grid-template-rows: auto;
      .summary-section {
        border-top: 1px solid var(--dm-shade-6);

        .section-title {
          color: var(--dm-shade-3);
          margin-bottom: 0.375rem;
          span {
            font-size: 0.75rem;
            font-weight: 500;
            text-transform: uppercase;
          }
        }

        .section-title__sub {
          font-size: 0.75rem;
          padding-left: 0.5rem;
          color: var(--dm-shade-4);
          font-weight: 500;
        }

        .content-wrapper {
          min-height: 100%;
          display: grid;
          grid-template-columns: 6fr 4fr;
        }

        .main-summary-content {
          padding: 1.5rem 2rem;

          h1 {
            margin: 0 0 1rem 0;
            text-align: left;
            font-size: 1.875rem;
            color: var(--dm-shade-4);
            font-weight: normal;
          }

          .form-element {
            display: block;
          }

          .form-element:not(:first-of-type) {
            margin-top: 1.5rem;
          }

          .text-input input {
            font-size: 0.875rem;
            height: 2.5rem;
          }

          p {
            margin: 2.375rem 0;
            color: var(--dm-shade-3);
            text-align: center;
            padding: 0 1rem;
            line-height: 160%;
          }

          textarea {
            height: 6.5rem;
            color: var(--dm-shade-2);
            font-size: 0.8125rem;

            &::-webkit-input-placeholder {
              color: var(--dm-shade-4);
            }

            &:-ms-input-placeholder {
              color: var(--dm-shade-4);
            }
            &::placeholder {
              color: var(--dm-shade-4);
            }
          }

          .report-preview-section {
            margin-top: 1.5rem;

            .report-preview {
              margin-top: 0.5rem;
            }
          }
        }

        .steps-summary {
          background: var(--dm-shade-9);

          .section-title {
            margin: 1rem 1rem 0 1rem;
            justify-content: space-between;
            display: flex;
          }
          .summary-items-group {
            box-sizing: border-box;
            padding: 1rem;
            border-bottom: 1px solid color-mix(in srgb, var(--dm-shade-4) 20%, transparent);
            .sub-title {
              color: var(--dm-shade-4);
              line-height: 170%;
              font-size: 0.875rem;
            }

            .day-parts-item {
              margin-top: 0.5rem;
              span {
                font-size: 0.8125rem;
                color: var(--dm-shade-3);
                line-height: 130%;
              }
            }
          }
          .period-summary-item {
            display: flex;
            align-items: center;
            gap: 0.8125rem;
            margin-top: 0.625rem;
            > span {
              border-bottom: 1px solid var(--dm-color-primary);
              line-height: 130%;
              font-size: 0.875rem;
              font-weight: 500;
              color: var(--dm-shade-1);
            }
          }

          .order-by-group,
          .combination-selection-controls,
          .additional-options {
            margin-top: 0.5rem;
          }

          .step-link {
            cursor: pointer;
          }

          .summary-item {
            background: color-mix(in srgb, var(--dm-shade-8) 50%, transparent);
            height: 2.5rem;
            display: grid;
            grid-template-columns: 1fr auto;
            align-items: center;
            padding: 0.625rem 0.5rem 0.625rem 0.75rem;
            box-sizing: border-box;
            border-radius: 0.25rem;
            margin: 0.5rem 0;
            .item-title {
              font-size: 0.875rem;
              font-weight: 500;
              color: var(--dm-shade-1);
            }
            .rhs-controls {
              display: flex;
              align-items: center;
              gap: 0.75rem;
              .items-count {
                color: var(--dm-color-category-5);
                font-size: 0.75rem;
                font-weight: 600;
              }
            }
          }
        }
      }
    }

    .ranking-media-controls {
      .months-wrapper {
        margin: auto;
        width: 62rem;
        margin-top: 6rem;
        margin-bottom: 3rem;
        min-height: auto;
      }

      .months-browser {
        display: flex;
        gap: 1.5rem;
        flex-flow: wrap;
        position: relative;
      }

      .day-part-controls {
        margin-top: 3rem;
        #selected-day-parts {
          .selected-categories-label {
            font-size: 0.75rem;
            font-weight: 600;
            color: var(--dm-shade-1);
            .num {
              color: var(--dm-color-category-5);
            }
          }
        }
      }
    }
  }

  .media-header {
    height: 3rem;
    border-top: 1px solid var(--dm-shade-6);
    border-bottom: 1px solid var(--dm-shade-6);
    background: var(--dm-shade-8);

    display: flex;
    justify-content: space-between;
  }

  #warning-modal-container {
    .modal-header {
      background: none;
      box-shadow: none;
      padding: 1rem 3rem;
    }
    .modal-content {
      padding: 0 3rem 3rem 3rem;
    }

    .modal-footer .primary-btn {
      background: var(--dm-color-neu);
    }

    .dm-table {
      border-top: 1px solid var(--dm-shade-6);
    }

    .dm-table tr {
      grid-template-columns: 1fr 3fr;
    }
    .dm-table tbody tr:hover {
      background: inherit;
    }
    .dm-table thead tr .column-title {
      color: var(--dm-shade-2);
      font-weight: 600;
    }

    .dm-table tbody tr {
      align-items: start;
      padding: 0.5rem 0;
      line-height: 150%;
      height: auto;

      .col1 .default {
        color: var(--dm-shade-2);
        span {
          color: var(--dm-shade-4);
        }
      }

      .col2 .default {
        color: var(--dm-shade-3);
      }

      .default {
        white-space: normal;
      }
    }
  }
}
.modal-container .modal.category-select-modal {
  height: 90%;
  width: 80%;
  .dm-search.blue .sc {
    border-radius: 0.25rem;
  }
  .modal-content {
    display: grid;
    grid-template-rows: auto 1fr;
    background: var(--dm-shade-10);
  }

  .list-item-source {
    grid-template-columns: 2rem 1rem 2.5rem 1fr;
  }
}
.tooltip {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  z-index: var(--dm-z-index-tooltip);
  pointer-events: none;

  .tooltip-bubble {
    background: var(--dm-shade-2);
    width: max-content;
    max-width: 15rem;
    padding: 0.375rem 0.75rem;
    position: absolute;
    bottom: 0.5rem;
    left: 0.5rem;
    border-radius: 0.25rem;
    line-height: 120%;
    span {
      font-size: 0.8125rem;
      font-weight: 500;
      color: var(--dm-shade-8);
    }
    &:after {
      content: "";
      display: block;
      background: var(--dm-shade-2);
      width: 0.375rem;
      height: 0.375rem;
      position: absolute;
      bottom: -0.1875rem;
      transform: rotate(45deg);
    }
  }
}
.target-tooltip .tooltip__content {
  padding: 0.625rem 0.75rem;
  line-height: 130%;
  display: inline-flex;
  flex-wrap: wrap;
}
.target-tooltip__question {
  display: contents;
}
.target-tooltip__question__operator {
  color: var(--dm-color-category-5);
}
.target-tooltip__question__name {
  color: var(--dm-shade-4);
  text-transform: uppercase;
}
.target-tooltip__question__part {
  color: var(--dm-shade-4);
}
.target-tooltip__answer__operator {
  color: var(--dm-color-neu);
}
.target-tooltip__operator_not {
  color: var(--dm-color-category-6);
}
.selected-time-span--muted {
  color: var(--dm-shade-4);
}
.scheduled-report-error-modal .modal {
  width: 60rem;
}
.scheduled-report-error-modal__error {
  background-color: var(--dm-shade-8);
  box-shadow:
    inset 0 0.0625rem 0 var(--dm-shade-6),
    inset 0.0625rem 0 0 var(--dm-shade-6),
    inset -0.0625rem 0 0 var(--dm-shade-6),
    inset 0 -0.0625rem 0 var(--dm-shade-6);
  border-radius: 0.25rem;
  padding: 0.625rem 1rem;
  color: var(--dm-shade-2);
  font-size: 0.9375rem;

  &:not(:last-of-type) {
    margin-bottom: 0.75rem;
  }
}
.scheduled-report-error-modal__error__title {
  font-weight: 700;
}
.scheduled-report-error-modal__error__message {
  line-height: 130%;
  white-space: pre-wrap;
  line-break: anywhere;
  font-weight: 400;
}
.missing-entities__tooltip {
  .dm-tooltip__content {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 0.625rem 0.75rem 0.75rem 0.75rem;
  }
  .tooltip__title {
    font-weight: 500;
    font-size: 0.8125rem;
    line-height: 130%;
    color: var(--dm-shade-8);
    opacity: 0.9;
  }
}
.dm-reporting-usage {
  #main-viewport {
    display: grid;
    grid-template-rows: 1fr auto;
    padding-bottom: 0.5rem !important;
  }

  dm-datepicker {
    width: 14rem;
    min-width: 14rem;

    .standard-datepicker {
      .icn {
        top: 0.45rem;
      }

      input {
        font-family: "proxima-nova";
        height: 2.5rem;
        font-size: 0.875rem;
        background-color: color-mix(in srgb, var(--dm-shade-8) 50%, transparent);
      }
    }
  }

  .label-holder {
    display: none;
  }

  dm-table-simple {
    display: grid;
    grid-template-rows: 1fr auto;
    overflow: auto;
    width: 100%;
    height: 100%;
    box-sizing: border-box;

    .table-container {
      height: 100%;
      overflow: hidden;

      .dm-table {
        height: 100%;
        overflow: hidden;
      }

      .dm-table tr {
        grid-auto-flow: column;
        grid-template-columns: repeat(auto-fit, minmax(1rem, 1fr));
      }
    }
  }
}
dm-reports {
  #main-viewport {
    height: auto;
    padding: 0rem 2rem 2rem 2rem !important;
    display: flex;
    flex-direction: column;
  }

  .report-types-more {
    margin-left: 1.5rem !important;
  }
}
.reports {
  .no-reports-view {
    border: 1px solid var(--dm-shade-6);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 1.5rem 0;
  }

  .report-types-grid {
    display: none;
    gap: 1rem;
    flex-flow: wrap;
    margin-bottom: 2rem;
    overflow: hidden;
    flex-shrink: 0;

    &[visibility] {
      display: flex;
    }

    .not-available {
      opacity: 0.6;
      pointer-events: none;
    }

    .report-type-item {
      width: 13.125rem;
      height: 8.25rem;
      background: color-mix(in srgb, var(--dm-shade-8) 50%, transparent);
      border: 1px solid var(--dm-shade-6);
      border-radius: 0.25rem;
      cursor: pointer;
      position: relative;

      .report-type-inner {
        width: 100%;
        height: 100%;
        overflow: hidden;
        position: relative;

        h2 {
          font-size: 1rem;
          line-height: 120%;
          color: var(--dm-color-neu);
          font-weight: 500;
          margin: 1rem;
          max-width: 7.5rem;
        }

        .rt-image {
          position: absolute;
          bottom: 0;
          right: 0;
        }

        .changes-icon {
          margin: 0.375rem 1.875rem;
          position: absolute;
          top: 0;
          right: 0;
        }

        .info-icn {
          margin: 0.375rem;
          position: absolute;
          top: 0;
          right: 0;
        }

        .rt-num {
          position: absolute;
          top: 4rem;
          left: 0;
          width: 5.125rem;
          text-align: center;
          span {
            font-size: 5.5rem;
            line-height: 124%;
            color: #fbfbfc;
            text-shadow: 0 0 0.0625rem #8b8d92; /* horizontal-offset vertical-offset 'blur' colour */
            -moz-text-shadow: 0 0 0.0625rem #8b8d92;
            -webkit-text-shadow: 0 0 0.0625rem #8b8d92;
          }
        }
      }
    }
  }

  .filters {
    display: flex;
    background-color: var(--dm-shade-8);
    padding: 1rem;
    align-items: center;
    justify-content: space-between;
    border: 1px solid var(--dm-shade-6);

    .filters__left {
      display: flex;
      align-items: center;
      gap: 1rem;
    }
  }
}
.report-info__tooltip {
  .dm-tooltip__content {
    padding: 0 1rem 1rem 1rem;
  }

  /* todo move typography to to separate file and handle it there so it is consistent across the app */
  h3 {
    color: var(--dm-shade-8);
    font-weight: 700;
    font-size: 0.8125rem;
    line-height: 0.9375rem;
    opacity: 0.9;
  }

  p {
    color: var(--dm-shade-5);
    font-weight: 500;
    font-size: 0.8125rem;
    line-height: 130%;
  }
}
.dm-result-item {
  height: 100%;
  width: 100%;
}
.header-media-result-item {
  .icons {
    display: flex;
    gap: 0.25rem;
    flex-direction: row;
  }
}
.dm-result-item--highlighted {
  background-color: var(--dm-color-primary-4) !important;

  :hover {
    background-color: inherit;
  }
}
.result-item {
  height: 100%;
  width: 100%;
  padding-left: 1rem;
  padding-right: 0.375rem;
  overflow: hidden;

  white-space: nowrap;
  gap: 0.75rem;

  .list-item__expand {
    width: 1rem;
  }
}
.vertical-header-result-item {
  .sum-result-item__type {
    min-width: 1.75rem;
    display: flex;
    justify-content: right;
  }
}
.horizontal-header-result-item.horizontal-header-entity-type-result-item {
  padding-left: 4.75rem;
}
.horizontal-header-result-item {
  .list-item__name {
    font-size: 0.75rem;
    font-weight: 600;
  }
}
.horizontal-header-media-result-item,
.horizontal-header-sum-result-item {
  .list-item__name {
    font-weight: 600;
    line-height: 130%;
  }
}
.horizontal-header-entity-type-result-item,
.horizontal-header-metric-result-item {
  .list-item__name {
    text-transform: uppercase;
    letter-spacing: 0.03rem;
    line-height: 1.125rem;
    font-weight: 600;
  }
}
.media-result-item__partial-entity {
  padding-right: 0.375rem;
}
.table-headers-horizontal__cell[sortActive] {
  .horizontal-header-result-item {
    .list-item__name__display {
      color: var(--dm-color-primary);
    }
  }
}
.actions-result-item {
  padding: 0 !important;
  margin-left: 0;
  justify-content: center;
}
.data-cell-result-item__value {
  width: 100%;

  &[hasTrend] {
    justify-content: right;
  }

  &[hasGraph] {
    .data-cell-result-item__value__display {
      min-width: 3rem;
    }
  }
}
.data-cell-result-item__value__percent {
  margin-left: 1.25rem;
  max-width: 5rem;
  height: 0.25rem;
  background: color-mix(in srgb, var(--dm-color-primary) 34%, transparent);
  position: relative;
  border-radius: 0.25rem;
  flex-grow: 1;
}
.data-cell-result-item__value__trend {
  margin-left: 0.25rem;
  display: flex;
  align-items: center;
}
.data-cell-result-item__value__percent__bar {
  background: var(--dm-color-primary);
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 0.25rem;
}
dm-result-item-header-horizontal-period {
  dm-notification-month-change-icon {
    margin-left: 0.25rem;
    position: relative;
    top: 0;
    left: 0;
  }
}
.day-part-result-item__name__time {
  color: var(--dm-shade-4);
}
.roles {
  padding-top: 1rem;
  display: grid;
  grid-template-rows: 1fr;

  .table-container {
    height: 100%;
    overflow: hidden;
    .dm-table {
      height: 100%;

      tr {
        display: grid;
        grid-template-columns: 1fr 1fr;
      }
    }
  }
}
dm-select-scheduled-report {
  display: flex;
  height: 2.375rem;
}
.sdk {
  padding-top: 0 !important;
  display: grid;
  grid-template-rows: 3.5rem 1fr auto;
  padding-bottom: 0.5rem !important;

  .table-container {
    height: 100%;
    overflow: hidden;

    .dm-table {
      height: 100%;

      tr {
        display: grid;
        grid-template-columns: 2fr 1fr 2fr 1fr 1fr;
        &.hasSections {
          cursor: pointer;
        }
      }

      .icon-plus-label {
        .select-chk-box {
          margin-right: 1rem;
        }
        .app-icon {
          margin-right: 0.75rem;
          width: 1rem;
        }
      }

      .group-display {
        cursor: pointer;
        height: 3rem;
        padding: 0 0.5rem;
        display: flex;
        align-items: center;
        background:
          linear-gradient(0deg, rgba(206, 208, 218, 0.05), rgba(206, 208, 218, 0.05)),
          linear-gradient(180deg, rgba(245, 245, 245, 0) 0%, var(--dm-shade-8) 100%);
        box-shadow:
          inset 0 -0.0625rem 0 var(--dm-shade-6),
          inset -0.0625rem 0 0 var(--dm-shade-6),
          inset 0.0625rem 0 0 var(--dm-shade-6);
        .expand-control {
          height: 1.5rem;
          width: 1.5rem;
          object-fit: scale-down;
          object-position: center;
          margin-right: 0.25rem;
        }
        span {
          font-size: 0.8125rem;
          font-weight: 500;
          color: var(--dm-shade-1);
        }
      }
    }
  }

  .additional-tools {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    padding: 0 1rem;

    label {
      cursor: pointer;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
      input[type="checkbox"] {
        pointer-events: none;
        top: 0.2rem;
        margin-right: 0.75rem;
      }
      span {
        font-size: 0.75rem;
        color: var(--dm-shade-4);
      }
    }

    .group {
      display: flex;
      align-items: center;
      height: 3.5rem;
    }

    .l-group {
      border-right: 1px solid color-mix(in srgb, var(--dm-shade-5) 50%, transparent);
      & > * {
        margin-right: 1rem;
      }
    }

    .c-group {
      padding: 0 1rem;
      button {
        color: var(--dm-shade-1);
      }
      & > * {
        margin-right: 2rem;
      }
    }

    .r-group {
      border-left: 1px solid color-mix(in srgb, var(--dm-shade-5) 50%, transparent);
      .icn-txt-btn {
        display: flex;
        align-items: center;
        text-transform: uppercase;
        font-size: 1rem;
        span {
          font-size: 0.75rem;
        }
        .icon {
          position: relative;
          top: -0.04rem;
          opacity: 0.6;
        }
      }
      & > * {
        margin-left: 1rem;
      }
    }

    .txt-btn {
      display: flex;
      align-items: center;
      margin-left: 1.5rem;
      img {
        margin-right: 0.5rem;
      }
    }
  }
}
.email-selected-sdks-modal-container {
  .info-container {
    text-align: center;
    .info {
      background: var(--dm-color-category-5);
      color: var(--dm-shade-8);
      display: inline-flex;
      align-items: center;
      padding: 0 2rem;
      margin: 1rem;
      height: 2.5rem;
      border-radius: 1.25rem;
      span {
        font-size: 0.9375rem;
        font-weight: 600;
      }
      .faded {
        opacity: 0.6;
      }
    }
  }

  .modal-content {
    position: relative;
    .success-display {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: var(--dm-z-index-accent);
      text-align: center;
      padding-top: 5.5rem;
      background: var(--dm-main-bg-color);
      p {
        color: var(--dm-shade-3);
      }
    }
  }
}
.dm-search {
  .sc {
    height: 2.5rem;
    background: var(--dm-shade-8);
    border: 1px solid var(--dm-shade-5);
    box-sizing: border-box;
    border-radius: 0.25rem;

    cursor: pointer;
    display: flex;
    align-items: center;
    padding: 0.5rem 0.5rem;
    width: 2.5rem;
    transition: width 0.1s;

    overflow: hidden;
    box-sizing: border-box;

    .search-icn {
      margin-right: 0.5rem;
      width: 1.5rem;
      height: 1.5rem;
    }

    .clear-btn {
      opacity: 0;
      margin-left: 0.75rem;
      width: 1rem;
      height: 1rem;
      display: block;
      opacity: 0.5;
      :hover {
        opacity: 0.8;
      }
    }

    input {
      opacity: 0;
      width: 100%;
      border: none;
      background: none;
      font-size: 0.875rem;
      color: var(--dm-shade-2);
      font-weight: 500;
      &:focus {
        outline: none;
        border: none;
      }
    }

    &.active,
    &[open] {
      background: var(--dm-color-primary-4);
      background: var(--dm-shade-8);
      width: 20rem;

      .clear-btn,
      input {
        opacity: 1;
      }
    }

    &.active {
      border-bottom: 2px solid var(--dm-color-primary);
    }
  }

  &.blue {
    .sc {
      background: color-mix(in srgb, var(--dm-color-primary) 100%, transparent);
      border: none;

      .search-icn {
        filter: brightness(2);
      }

      &.active {
        background: color-mix(in srgb, var(--dm-color-primary) 5%, transparent);
        .search-icn {
          filter: brightness(0.6);
        }
      }
    }
  }

  &[size="medium"] {
    .sc {
      padding: 0.5rem 0.5rem;
    }

    .search-icn {
      margin-right: 0.5rem;
    }

    input {
      font-size: 0.875rem;
    }
  }
}
dm-select-helper-item-dropdown.dm-select {
  height: 100%;
  position: initial;
  width: 2rem;
  overflow: hidden;

  .selected,
  .selected[active] {
    border: none !important;
    padding: 0 0.5rem 0 0.5rem !important;
  }

  .arrow {
    margin: 0 !important;
  }
}
dm-select-helper-item {
  height: 2rem;
  display: flex;
  align-items: center;
  border: 1px solid var(--dm-shade-5);
  box-sizing: border-box;
  position: relative;
  border-radius: 0.25rem;

  .select-max {
    width: 2rem;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .separator {
    height: 1.5rem;
  }
}
dm-select-multi.dm-select {
  .selected {
    height: auto !important;
    min-height: 2.5rem;
  }
}
dm-select-with-label {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
}
.dm-select {
  cursor: pointer;
  position: relative;
  line-height: 1.375rem;
  font-weight: 500;
  display: flex;
  align-items: flex-end;

  &[disabled] {
    pointer-events: none;
    opacity: 0.3;
  }

  .select[size="small"] {
    font-size: 0.8125rem;

    .selected {
      height: 1.5rem;
    }
  }

  .select[size="medium"] {
    font-size: 0.875rem;

    .selected {
      height: 2rem;
    }
  }

  .select[size="large"] {
    font-size: 0.875rem;
    .selected {
      height: 2.5rem;
    }
  }

  .select {
    width: 100%;
  }

  .label {
    color: var(--dm-shade-4);
    margin-right: 0.375rem;
  }

  .badge-label {
    line-height: 1.125rem;
    font-weight: 600;
    background: var(--dm-color-primary);
    color: var(--dm-shade-8);
    border-radius: 6.25rem;
    padding: 0 0.5rem;
    margin-left: 0.5rem;
  }

  .arrow {
    margin-left: 0.375rem;
  }

  .selected {
    white-space: nowrap;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    height: 100%;

    mix-blend-mode: normal;
    box-sizing: border-box;
    border-radius: 0.25rem;
    padding: 0.25rem 0.4375rem 0.25rem 0.6875rem;

    &[active] {
      border: 0.0625rem solid var(--dm-color-primary);
      background: color-mix(in srgb, var(--dm-shade-7) 70%, transparent);
    }

    &[borderless] {
      border: none !important;
      background-color: transparent !important;
    }
  }

  .selected__display {
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .select--theme-primary {
    .selected {
      background-color: var(--dm-shade-8);
      color: var(--dm-shade-1);

      border: 0.0625rem solid var(--dm-shade-5);

      &:hover {
        background-color: var(--dm-shade-7);
      }
    }
  }

  .select--theme-secondary {
    .selected {
      background-color: transparent;
      color: var(--dm-color-static);
      border: 1px solid color-mix(in srgb, var(--dm-color-static) 30%, transparent);
      &:hover {
        background-color: transparent;
        border: 1px solid color-mix(in srgb, var(--dm-shade-5) 50%, transparent);
      }
    }

    .arrow {
      opacity: 0.8;
    }
  }

  .placeholder-text {
    color: var(--dm-shade-4);
  }

  .clear-button {
    position: absolute;
    right: 1.5rem;
  }

  .clear-button-image {
    width: 1rem;
  }
}
.dm-selected-list {
  height: 100%;
  display: grid;
  overflow: auto;
}
.selected-list {
  box-sizing: border-box;
  background: var(--dm-shade-9);
  border: 1px solid color-mix(in srgb, var(--dm-shade-4) 20%, transparent);
  border-bottom: none;
  overflow: auto;
  height: 100%;
  padding: 1.25rem 1rem 0 1rem;
}
.selected-list__content__label {
  font-size: 0.8125rem;
  color: var(--dm-color-primary);
  line-height: 185%;
  text-align: right;
}
.selected-list__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
}
.selected-list__header__title {
  color: var(--dm-shade-3);
  font-size: 0.75rem;
  text-transform: uppercase;
  font-weight: 500;
}
.selected-list__header__actions {
  display: flex;
  gap: 0.5rem;
}
.selected-list__separator {
  margin: 0.875rem 0 1rem 0;
}
.selected-list__count {
  margin-bottom: 1rem;
  height: 0.375rem;
  position: relative;

  .progress {
    width: 100%;
    height: 100%;
    position: absolute;
    border-radius: 0.25rem;
  }

  .progress-none {
    background: var(--dm-shade-5);
  }

  .progress-complete {
    background: linear-gradient(90deg, rgba(39, 174, 96, 1) 0%, rgba(235, 87, 87, 1) 100%);
  }

  .progress-hidden {
    background: repeating-linear-gradient(
      -45deg,
      var(--dm-color-primary-3),
      var(--dm-color-primary-3) 1px,
      color-mix(in srgb, var(--dm-color-primary-3) 0%, transparent),
      1px,
      color-mix(in srgb, var(--dm-color-primary-3) 0%, transparent),
      2px
    );
  }

  .count {
    position: absolute;
    top: -0.5rem;
    display: flex;
    justify-content: end;
    min-width: 0.75rem;
  }

  .count__label {
    background: var(--dm-shade-9);
    font-weight: 500;
    line-height: 1rem;
    font-size: 0.75rem;
    padding: 0.1875rem;
  }

  .count__label--none {
    color: var(--dm-shade-4);
  }

  .count__label--complete {
    color: var(--dm-color-category-5);
  }

  .count__label--hidden {
    color: var(--dm-color-primary-3);
  }
}
.selection-card-media {
  .selection__img__label-type {
    position: absolute;
    right: 0.875rem;
    bottom: 2.0625rem;
    width: 4rem;
    height: 1.3125rem;
  }
}
.selection-card {
  cursor: pointer;
  display: grid;
  grid-template-columns: 1.3025fr 1fr;
  align-items: center;
  width: 14.375rem;
  height: 6.5rem;
  padding: 1rem;
  background: color-mix(in srgb, var(--dm-shade-8) 100%, transparent);
  outline: 0.0625rem solid var(--dm-shade-6);
  border-radius: 0.25rem;
  box-sizing: border-box;
  filter: drop-shadow(0 0.25rem 2rem rgba(0, 0, 0, 0));

  &:hover {
    background: color-mix(in srgb, var(--dm-shade-7) 100%, transparent);
  }

  &[disabled] {
    opacity: 0.3;
    pointer-events: none;
  }

  &[selected] {
    filter: drop-shadow(0 0.25rem 2rem rgba(0, 0, 0, 0.12));
    background: color-mix(in srgb, var(--dm-shade-8) 100%, transparent);
    outline: 0.175rem solid var(--dm-color-primary);
  }

  .selection-card__title {
    font-weight: 500;
    font-size: 1rem;
    line-height: 1.1875rem;
    color: var(--dm-color-neu);
  }

  .selection-card__sub-title {
    font-weight: 400;
    font-size: 0.75rem;
    line-height: 0.875rem;
    color: var(--dm-shade-4);
  }

  .selection-card__selection {
    position: absolute;
    right: 0;
    bottom: 0;
  }

  .selection-card__selection__img {
    position: absolute;
    bottom: 0;
    right: 0;
  }
}
dm-sensitive-targets {
  .sensitive-targets-table {
    height: 100%;
  }
}
dm-separator {
  display: flex;

  &[strong] {
    .separator {
      background: color-mix(in srgb, var(--dm-shade-5) 50%, transparent);
    }
  }

  .separator {
    background: var(--dm-shade-6);

    &[alignment="horizontal"] {
      height: 0.0625rem;
      width: 100%;
    }

    &[alignment="vertical"] {
      width: 0.0625rem;
      height: 100%;
    }
  }
}
.share-report-modal {
  .info-container {
    text-align: center;
    .info {
      background: var(--dm-color-category-5);
      color: var(--dm-shade-8);
      display: inline-flex;
      align-items: center;
      padding: 0 2rem;
      margin: 1rem;
      height: 2.5rem;
      border-radius: 1.25rem;
      span {
        font-size: 0.9375rem;
        font-weight: 600;
      }
      .faded {
        opacity: 0.6;
      }
    }
  }

  .modal {
    .modal-content {
      position: relative;
      min-height: 20rem;

      .form-section {
        padding-bottom: 3rem;
      }

      .success-display {
        z-index: var(--dm-z-index-accent);
        text-align: center;
        height: 100%;
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        background: var(--dm-main-bg-color);
        overflow: hidden;

        p {
          color: var(--dm-shade-3);
        }
      }
    }
  }
}
.share-report-modal__conclusion__name {
  margin-left: 0.5rem;
  margin-right: 0.5rem;
}
.dm-sidebar {
  position: relative;
  width: var(--dm-sidebar-width);
  height: 100%;
  display: grid;
  grid-template-rows: auto 1fr auto;
  --dm-sidebar-padding-lr: 1.5rem;

  .header {
    padding: 1.25rem 0.5rem 1.25rem 1.5rem;
    display: flex;
    justify-content: space-between;
    align-items: start;
  }

  .header__stripes {
    position: absolute;
    top: 0;
    left: 0;
    width: 4rem;
  }

  .navigation {
    overflow-y: auto;
    font-weight: 400;
    font-size: 0.9375rem;
    line-height: 1.375rem;

    & > .item:last-of-type {
      margin-bottom: 2.5rem;
    }
  }

  .item {
    display: flex;
    align-items: center;
    padding-left: var(--dm-sidebar-padding-lr);
    padding-right: var(--dm-sidebar-padding-lr);
    cursor: pointer;
    position: relative;
    font-size: 0.9375rem;
    line-height: 1.25rem;
    font-weight: 500;
    animation: sidebarItemExpand;
    animation-duration: 0.1s;
    animation-fill-mode: both;

    &.has-children {
      &:after {
        content: "";
        width: 1rem;
        height: 100%;
        display: block;
        position: absolute;
        top: 0;
        right: 1rem;
        background: url("/images/sidebar-arrow-right.svg") center no-repeat;
      }
    }

    &.active {
      pointer-events: none;
      cursor: default;

      &:after {
        background: url("/images/sidebar-arrow-down-active.svg") center no-repeat;
      }
    }

    &.active-border {
      padding-left: calc(var(--dm-sidebar-padding-lr) - 0.25rem);
    }
  }

  .item__label {
    animation: sidebarItemShow;
    animation-duration: 0.2s;
    animation-fill-mode: forwards;
    animation-delay: 0.1s;
    opacity: 0;
    font-weight: 500;
    white-space: nowrap;
  }

  .item__icon {
    width: 1.5rem;
    margin-right: 1rem;
  }

  .item__icon-additional {
    margin-left: 2.25rem;
  }

  .group-label {
    padding: 0.4375rem var(--dm-sidebar-padding-lr);
    color: color-mix(in srgb, var(--dm-color-static) 50%, transparent);
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 150%;
    letter-spacing: 0.3px;
    text-transform: uppercase;
    opacity: 0.5;
    margin-top: 1rem;
  }

  .footer__content {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    padding: var(--dm-sidebar-padding-lr);
  }

  .footer__selects {
    display: flex;
    flex-direction: column;
    gap: 1rem;
  }

  .footer__icons {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .footer__logos {
    display: flex;
    align-items: center;
    gap: 0.75rem;
  }

  .footer__separator {
    height: 0.0625rem;
    width: 100%;
    position: relative;
    background-color: rgba(34, 41, 61, 0.7);

    &::after {
      background: linear-gradient(
        0deg,
        color-mix(in srgb, var(--dm-admin-shade-3) 75%, transparent) 0%,
        rgba(255, 255, 255, 0) 100%
      );
      position: absolute;
      bottom: 0.0625rem;
      left: 0;
      content: "";
      height: 2.5rem;
      width: 100%;
    }
  }

  .main-logo {
    margin-top: 0.25rem;
    cursor: pointer;
    z-index: var(--dm-z-index-accent);
  }

  .main-logo-caption {
    font-size: 0.75rem;
    color: var(--dm-color-static);
    margin-left: 2.5rem;
  }

  .main-logo-caption--opacity {
    opacity: 0.8;
  }

  .main-logo-caption--opacity-adria {
    opacity: 0.7;
  }

  .secondary-logo {
    height: 2.375rem;
  }
}
dm-snapshots {
  #main-viewport {
    display: grid;
    grid-template-rows: 1fr auto;
  }

  .description {
    color: var(--dm-shade-4);
    font-size: 0.8125rem;
    line-height: 1rem;
  }
}
dm-snapshot-toolbar {
  .snapshot-status {
    text-transform: capitalize;
    line-height: 130%;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--dm-shade-3);
    text-align: center;
  }
}
.dm-source-list {
  height: 100%;
  display: grid;
  overflow: auto;
}
.source-list-wrapper {
  overflow: auto;
  background: color-mix(in srgb, var(--dm-shade-8) 40%, transparent);
  border: 1px solid var(--dm-shade-6);
  box-sizing: border-box;
}
.item-selection-section {
  height: 100%;
  display: grid;
  grid-template-columns: 6fr 4fr;
  grid-gap: 1.5rem;
  padding-left: 1.5rem;
  overflow: hidden;
}
.item-selection-section__messages {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  height: 100%;
}
dm-filter-step-period-day {
  .day-part-controls {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;

    h4 {
      margin: 0 0 0.75rem 0;
      font-size: 0.75rem;
      font-weight: 500;
      color: var(--dm-shade-4);
      text-transform: uppercase;
    }

    #selected-day-parts {
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      gap: 0.5rem;
      position: relative;
      span {
        font-size: 0.875rem;
        font-weight: 500;
        color: var(--dm-shade-1);
      }
      img {
        position: absolute;
        right: -1.5rem;
      }
    }

    &.disabled {
      opacity: 0.5;
      pointer-events: none;
    }
  }
}
dm-stress-test {
  .manage-form {
    margin-bottom: 3rem;

    .enable-button {
      background-color: var(--dm-color-category-5);
      border: 1px solid black;
      border-radius: 0.25rem;
      padding: 0.25rem;
    }

    .disable-button {
      background-color: var(--dm-color-category-6-600);
      border: 1px solid black;
      border-radius: 0.25rem;
      padding: 0.25rem;
      margin-left: 0.75rem;
    }

    .manage-form-title {
      font-size: 1.25rem;
      font-weight: bold;
      margin-bottom: 1rem;
    }

    .form-row {
      display: flex;
      align-items: center;
      gap: 0.75rem;
      margin-bottom: 0.75rem;

      .form-row-title {
        font-weight: bold;
      }
    }
  }

  .analysis {
    margin-top: 3rem;

    .analysis-subtitle {
      color: var(--dm-shade-4);
      font-size: 0.8125rem;
      margin-bottom: 0.75rem;
    }

    .analysis-row {
      margin-bottom: 0.75rem;

      .analysis-row-title {
        font-weight: bold;
        margin-right: 0.5rem;
      }

      .analysis-row-data {
        font-weight: normal;
      }
    }
  }
}
#import-ponders-form {
  width: 56rem;
  margin: 0 auto;

  &.disabled {
    pointer-events: none;
  }

  .file-input-wrap {
    position: relative;
    input[type="text"] {
      padding-right: 8rem;
    }
    input[type="file"] {
      position: absolute;
      top: 0;
      left: 0;
      opacity: 0;
      cursor: pointer;
    }
    button {
      position: absolute;
      right: 0.5rem;
      top: 0.25rem;
      height: 2rem;
      padding: 0 1rem;
      background: var(--dm-shade-5);
      pointer-events: none;
    }
  }

  .status {
    min-height: 1.5rem;
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 150%;
    margin: 0.75rem 0;
    &.error {
      color: var(--dm-color-category-6);
    }
    &.success {
      color: var(--dm-color-category-5);
    }

    button {
      color: inherit;
      border: none;
      text-decoration: underline;
      font-size: inherit;
      margin-left: 0.5rem;
    }
  }

  .bq-section {
    margin-top: 4rem;
  }
}
dm-survey-user-count {
  #main-viewport {
    padding-left: 10rem !important;
  }

  .survery {
    width: 26.25rem;
  }

  .survey-user-count-select {
    margin-top: 1.5rem;
  }

  .run-report__btn {
    margin-top: 1.5rem;
  }
}
.surveys-viewport {
  padding-top: 1rem;
  display: grid;
  grid-template-rows: 1fr auto;
  padding-bottom: 0.5rem !important;
  position: relative;

  .table-container {
    height: 100%;
    overflow: hidden;
  }

  .dm-table.surveys-table {
    height: 100%;

    tr {
      display: grid;
      grid-template-columns: 4fr 1fr 2fr 7.6rem 7.6rem 10rem;
    }

    .icon-plus-label span {
      line-height: 160%;
      border-bottom: 1px dashed color-mix(in srgb, var(--dm-color-primary) 50%, transparent);
      cursor: pointer;
    }

    .questions-display {
      .heading {
        height: 1.25rem;
        background:
          linear-gradient(0deg, #f7f8fa, #f7f8fa),
          linear-gradient(180deg, rgba(245, 245, 245, 0) 0%, var(--dm-shade-8) 100%);
        box-shadow:
          inset 0.0625rem 0 0 var(--dm-shade-6),
          inset -0.0625rem 0 0 var(--dm-shade-6),
          inset 0 -0.0625rem 0 var(--dm-shade-6);
        display: flex;
        align-items: center;
        padding: 0 2.75rem;

        span {
          font-weight: 600;
          font-size: 0.6875rem;
          text-transform: uppercase;
          color: var(--dm-shade-4);
        }
      }

      .question-item {
        display: grid;
        grid-template-columns: 1fr 8rem;
        padding: 1rem 1rem;
        border-bottom: 1px solid var(--dm-shade-6);
        align-items: center;
        gap: 2rem;

        .question-holder {
          display: flex;
          gap: 0.75rem;
          .num {
            position: relative;
            top: 0.25rem;
            min-width: 1.6rem;
            font-size: 0.6875rem;
            color: var(--dm-shade-4);
            text-align: right;
          }
          .question {
            font-size: 0.875rem;
            color: var(--dm-shade-3);
          }
        }
        .answers-holder {
          text-align: right;
          .answers-info {
            display: inline-block;
            font-size: 0.875rem;
            color: var(--dm-shade-4);
            line-height: 160%;
            border-bottom: 1px dashed color-mix(in srgb, var(--dm-color-primary) 50%, transparent);
            cursor: pointer;
          }
        }
      }
    }
  }
}
.survey-tooltip {
  .dm-tooltip__content {
    padding: 0.625rem 0.75rem;
    min-width: 9rem;
  }

  span {
    font-weight: 600;
    color: color-mix(in srgb, var(--dm-shade-8) 90%, transparent);
  }

  div {
    &.title {
      margin-bottom: 0.5rem;
    }
    .name {
      color: color-mix(in srgb, var(--dm-shade-4) 90%, transparent);
    }
  }
}
.survey-answers-tooltip {
  .dm-tooltip__content {
    overflow: auto;
    padding: 0.625rem 0.75rem;
    max-width: 30rem;
    max-height: 30rem;
  }
  .title {
    margin-bottom: 0.75rem;
    line-height: 100%;
  }
  span {
    font-weight: 600;
    color: color-mix(in srgb, var(--dm-shade-8) 90%, transparent);
  }
  .answer-item {
    margin: 0.5rem 0;
    display: flex;
    gap: 0.5rem;
    &:last-child {
      margin-bottom: 0;
    }
  }
  .index {
    color: color-mix(in srgb, var(--dm-shade-4) 90%, transparent);
    min-width: 1rem;
    text-align: right;
  }
}
dm-sync-job-log {
  #main-viewport {
    display: grid;
    grid-template-rows: 1fr auto;
    padding-bottom: 0.5rem !important;
    padding-left: 10% !important;
    padding-right: 10% !important;
  }

  .label-holder {
    display: none;
  }
}
.component-container:has(dm-sync-status) {
  @media screen and (max-width: 56.25rem) {
    min-width: 43.75rem;
  }
}
dm-sync-status {
  #main-viewport {
    padding-bottom: 0.5rem !important;
    padding-left: 10% !important;
    padding-right: 10% !important;
  }

  .loader-container {
    display: flex;
    width: 100%;
    margin-top: 1rem;
  }

  dm-loader {
    margin: 0 auto;
  }

  .form-element {
    width: 17rem;
  }

  .gatherer-holder {
    padding: 1rem 2rem;
    height: min-content;
    background-color: var(--dm-shade-8);
    border-radius: 0.25rem;
    border: 1px solid var(--dm-shade-6);

    .gatherer-main {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 2rem;

      .gatherer-title {
        line-height: 1.313rem;
      }

      .gatherer-sub-title {
        font-size: 0.813rem;
        line-height: 1.313rem;
        margin-left: 0.33rem;
        color: var(--dm-shade-4);
      }

      .gatherer-caption[gathererCompleted] {
        color: var(--dm-color-category-5);
      }

      .not-started {
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 1.25rem;
        color: var(--dm-color-category-6);
        line-height: 1.875rem;
        padding-bottom: 2rem;
      }

      .seek-bar-main-holder {
        position: relative;
        background-color: var(--dm-shade-6);
        border-radius: 0.25rem;
        width: 50%;
        margin: 0.75rem 0;
      }

      .seek-bar-main {
        position: relative;
        z-index: 1;
        bottom: 0;
        left: 0;
        border-radius: 0.25rem;
        padding: 0.75rem 0;
      }
    }

    .gatherer-step {
      display: flex;
      flex-direction: column;
      gap: 1rem;
      padding-top: 1rem;
      margin-top: 1rem;
      border-top: 1px solid var(--dm-shade-6);
      justify-content: center;
      align-items: center;

      .seek-bar-secondary-holder {
        position: relative;
        background-color: var(--dm-shade-6);
        border-radius: 0.25rem;
        width: 50%;
        padding: 0.5rem 0;
      }

      .seek-bar-secondary {
        position: absolute;
        z-index: 1;
        bottom: 0;
        background-color: var(--dm-shade-4);
        left: 0;
        border-radius: 0.25rem;
        padding: 0.5rem 0;
      }

      .step-status-percentage {
        position: absolute;
        right: 0.25rem;
        top: 0.1rem;
        color: var(--dm-shade-8);
        font-size: 0.75rem;
        line-height: 0.875rem;
        z-index: 2;
      }
    }

    .gatherer-caption {
      font-size: 0.875rem;
      line-height: 0.875rem;
      color: var(--dm-shade-4);
      padding-bottom: 0.5rem;
    }
  }

  .error-table {
    margin-top: 2rem;
  }

  [completedStatus="low"] {
    background-color: var(--dm-color-category-6);
  }
  [completedStatus="medium"] {
    background-color: var(--dm-color-category-7);
  }
  [completedStatus="high"] {
    background-color: var(--dm-color-category-5);
  }
}
dm-sync-steps-graph {
  .zoom-range {
    margin-right: 0.75rem;
    width: 16rem;
  }

  #main-viewport {
    padding-top: 0.5rem !important;
    display: block;
  }

  .graph {
    margin-right: 1.875rem;
  }
}
dm-sync-timeline-graph {
  * {
    box-sizing: border-box;
  }

  .table-container {
    z-index: var(--dm-z-index-accent);
    overflow-x: auto;
    position: relative;
    display: flex;
    flex-direction: column-reverse;
    justify-content: start;
  }

  .timeline-table {
    border-collapse: separate;
    border-spacing: 0;
    width: fit-content;
  }

  .timeline-table__zoom {
    display: flex;
    align-items: end;
    flex-direction: column;
    gap: 1.25rem;
    margin-right: 0.875rem;
  }

  .timeline-table__zoom__control {
    display: flex;
  }

  .timeline-table__header__cell {
    height: 2.5rem;
  }

  .timeline-table__header-sticky {
    background-color: var(--dm-shade-7);
  }

  .timeline-table__header-hours__cell {
    background-color: var(--dm-shade-7);
    text-align: left;
    font-size: 0.75rem;
    line-height: 130%;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04rem;
    padding-left: 1rem;
    color: var(--dm-shade-2);
    cursor: pointer;

    &:hover {
      background-color: var(--dm-shade-6);
    }
  }

  .timeline-table__header-minutes__cell {
    background-color: var(--dm-shade-8);
    color: var(--dm-shade-3);
    cursor: pointer;
    font-size: 0.875rem;
    line-height: 1.375rem;
    font-weight: 400;
    min-width: 9.375rem;
    max-width: 9.375rem;

    &[zoomLevel="1"] {
      min-width: 25rem;
      max-width: 25rem;
    }

    &[zoomLevel="2"] {
      min-width: 50rem;
      max-width: 50rem;
    }

    &[zoomLevel="3"] {
      min-width: 100rem;
      max-width: 100rem;
    }

    &:hover {
      background-color: var(--dm-shade-6);
    }
  }

  .timeline-table__row {
    position: relative;
  }

  .timeline-table__cell {
    border: 1px solid var(--dm-shade-6);
  }

  .timeline-table__data__cell {
    height: 3rem;
    background-color: var(--dm-shade-8);
  }

  .timeline_table__job {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: start;
    position: absolute;
    bottom: 0.5rem;
    overflow: hidden;
    height: 1.625rem;
    background-color: var(--dm-color-primary);
    border: 1px solid var(--dm-shade-8);
    box-sizing: border-box;
    color: var(--dm-shade-8);
    font-size: 0.8125rem;
    cursor: pointer;
    z-index: var(--dm-z-index-element);

    &:hover {
      background-color: var(--dm-color-neu);
    }

    & span {
      margin-left: 0.5rem;
    }
  }

  .sticky-col {
    position: sticky;
    left: -0.0625rem;
    min-width: 5rem;
    max-width: 5rem;
    z-index: var(--dm-z-index-accent);
    border: 1px solid var(--dm-shade-6);
    color: var(--dm-shade-2);
    text-align: center;
    font-size: 0.875rem;
    line-height: 130%;
  }

  .sticky-col__shadow {
    position: absolute;
    width: 0.5rem;
    height: 100%;
    right: -0.5rem;
    top: 0;

    background: linear-gradient(270deg, rgba(5, 30, 72, 0.08) 0%, rgba(5, 30, 72, 0) 100%);
    mix-blend-mode: multiply;
    opacity: 0.8;
    transform: rotate(-180deg);
  }
}
.timeline-job-tooltip {
  .dm-tooltip__content {
    max-width: none;
  }

  .timeline-job-tooltip__content {
    display: flex;
    flex-direction: column;
    width: fit-content;
    padding: 0.625rem 0.75rem 1.125rem 0.75rem;
  }

  .timeline-job-tooltip__time {
    display: flex;
    flex-direction: row;
    gap: 0.5rem;
  }

  .timeline-job-tooltip__name {
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.375rem;
    color: var(--dm-shade-6);
    padding-bottom: 0.25rem;
  }

  .timeline-job-tooltip__status {
    display: flex;
    flex-direction: row;
    align-items: center;
    font-size: 0.8125rem;
    font-weight: 400;
    line-height: 1.375rem;
    color: var(--dm-shade-6);
    padding-bottom: 1rem;
  }

  .timeline-job-tooltip__caption {
    font-size: 0.8125rem;
    font-weight: 400;
    line-height: 1.375rem;
    color: var(--dm-shade-4);
    min-width: 4rem;
  }

  .timeline-job-tooltip__text {
    font-size: 0.8125rem;
    font-weight: 400;
    line-height: 1.375rem;
    color: var(--dm-shade-5);
  }
}
dm-tab-content {
  display: contents;

  .content {
    display: contents;

    &:not([active]) {
      display: none !important;
    }
  }
}
dm-tab-menu {
  .tab-menu {
    display: flex;
    align-items: center;
    height: 100%;
    padding: 0 0.5rem;

    li {
      box-sizing: border-box;
      cursor: pointer;
      display: flex;
      align-items: center;
      margin: 0 1rem;
      height: 100%;
      color: var(--dm-shade-3);
      border-bottom: 3px solid transparent;

      span {
        position: relative;
        top: 0.1rem;
        text-transform: uppercase;
        font-size: 0.75rem;
        font-weight: 500;
      }

      &[active] {
        color: var(--dm-color-primary);
        border-bottom: 3px solid var(--dm-color-primary);
      }

      &[disabled] {
        opacity: 0.3;
      }
    }
  }
}
.dm-tab-navigation-tab {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  width: max-content;
  max-width: 12.5rem;
  border-right: 1px solid var(--dm-shade-6);
  background-color: var(--dm-shade-8);
  cursor: pointer;
  padding: 0 1rem;

  .tab-navigation-tab__label {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--dm-shade-4);
    line-height: 1rem;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }

  .tab-navigation-tab__options-button {
    margin-left: 0.5rem;
  }

  &[selected] {
    background-color: color-mix(in srgb, var(--dm-color-primary) 50%, transparent);

    .tab-navigation-tab__label {
      color: var(--dm-color-static);
    }
  }
}
dm-tab-navigation {
  width: 100%;
  height: 2rem;

  .tab-navigation {
    display: grid;
    grid-template-columns: auto auto auto auto;
    align-items: center;
    height: 2rem;
    width: fit-content;
    max-width: calc(100% - 2px);
    border: 1px solid var(--dm-shade-6);
    border-radius: 0.25rem 0.25rem 0 0;
    overflow: hidden;
  }

  .tab-navigation__tabs {
    display: flex;
    height: 100%;
    overflow: hidden;
  }

  .tab-navigation__navigation-arrows {
    display: flex;
    justify-content: space-around;
    gap: 0.125rem;
    height: 100%;
    width: 3.625rem;
    border-right: 1px solid var(--dm-shade-6);
    border-left: 1px solid var(--dm-shade-6);
    box-sizing: border-box;
  }

  .tab-navigation__navigation-arrows__arrow {
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
  }

  .tab-navigation__navigation-arrows__arrow--left {
    justify-content: end;
  }

  .tab-navigation__navigation-arrows__arrow--right {
    justify-content: start;
  }

  .tab-navigation__add-more {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 2.25rem;
    height: 100%;
  }
}
dm-table-card-audit-trails {
  .card-column,
  .card-column {
    flex-direction: column;
  }

  .card-column:nth-child(2) {
    .card-heading {
      margin-bottom: 0.25rem;
    }
    .card-heading--bold {
      font-weight: 600;
    }

    .card-content {
      display: block;
      white-space: pre-wrap;
      line-break: anywhere;
      margin-bottom: 0.6rem;
    }
  }
}
dm-table-card-monthly-import {
  &.table-card {
    grid-template-columns: 10rem 1fr 6rem;
  }

  &.card-severity-Warning {
    border: 1px solid var(--dm-color-category-7) !important;
  }

  &.card-severity-Error {
    border: 1px solid var(--dm-color-category-6) !important;
  }

  .card-column,
  .card-column {
    flex-direction: column;
  }

  .card-column:nth-child(3) {
    flex-direction: row;
  }
}
dm-table-card-sync-job-log {
  &.table-card {
    grid-template-columns: 10rem 1fr 6rem;
  }

  &.card-severity-Warning {
    border: 1px solid var(--dm-color-category-7) !important;
  }

  &.card-severity-Error {
    border: 1px solid var(--dm-color-category-6) !important;
  }

  .card-column:nth-child(1),
  .card-column:nth-child(2) {
    flex-direction: column;
  }

  .card-column:nth-child(3) {
    flex-direction: row;
  }
}
dm-table-card-sync-job-log {
  &.table-card {
    grid-template-columns: 10rem 1fr 6rem;
  }

  &.card-severity-Warning {
    border: 1px solid var(--dm-color-category-7) !important;
  }

  &.card-severity-Error {
    border: 1px solid var(--dm-color-category-6) !important;
  }

  .card-column:nth-child(1),
  .card-column:nth-child(2) {
    flex-direction: column;
  }

  .card-column:nth-child(3) {
    flex-direction: row;
  }

  @media only screen and (max-width: 950px) {
    &.table-car {
      grid-template-columns: none !important;
    }
  }
}
.table-card {
  display: grid;
  grid-template-columns: 12rem 1fr;
  grid-gap: 3rem;
  padding: 1rem;
  background: var(--dm-shade-8);
  border-radius: 0.25rem;

  --dm-log-column-border: 0.0625rem var(--dm-shade-6) solid;

  border-top: var(--dm-log-column-border);
  border-bottom: var(--dm-log-column-border);
  border-left: var(--dm-log-column-border);
  border-right: var(--dm-log-column-border);

  .card-column {
    display: flex;
    justify-content: flex-start;
    align-items: start;
  }

  .card-column:nth-child(2) {
    .card-heading {
      margin-bottom: 0.25rem;
    }
    .card-heading--bold {
      font-weight: 600;
    }

    .card-content {
      white-space: pre-wrap;
      line-break: anywhere;
    }
  }

  .card-title {
    text-transform: uppercase;
    font-size: 0.8125rem;
    line-height: 1.375rem;
    color: var(--dm-shade-4);
    padding-right: 0.5rem;
  }

  .card-content {
    font-size: 0.8125rem;
    line-height: 1.375rem;
    color: var(--dm-shade-3);
  }
}
dm-table-cards {
  overflow: hidden;
  display: grid;
  grid-template-rows: auto 1fr auto;
  position: relative;

  .card-header__title {
    font-size: 1rem;
    line-height: 1.875rem;
    letter-spacing: 0.2px;
    color: var(--dm-shade-1);
  }

  .card-container {
    overflow: auto;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
  }

  .card-header__separator {
    margin-top: 0.75rem;
    margin-bottom: 1.5rem;
  }
}
.dm-table-complex-classic {
  --dm-border: 1px solid var(--dm-shade-6);

  ::-webkit-scrollbar:vertical {
    background-color: var(--dm-shade-10);
    border-top: var(--dm-border);
    border-right: var(--dm-border);
  }

  ::-webkit-scrollbar-track:vertical {
    border-right: none;
  }

  ::-webkit-scrollbar:horizontal {
    border-top: var(--dm-border);
  }

  .table__cell {
    border-bottom: var(--dm-border);
    border-right: var(--dm-border);
    display: flex;
  }

  .table-cell {
    display: flex;
    align-content: center;
    align-items: center;
    white-space: nowrap;
    height: 100%;
    width: 100%;
  }

  .table-data__cell {
    font-size: 0.875rem;
    line-height: 130%;
    font-weight: 500;
    color: var(--dm-shade-3);
    background: var(--dm-shade-8);
  }

  .table-headers-vertical__cell {
    font-size: 0.875rem;
    line-height: 130%;
    color: var(--dm-shade-2);
    background: var(--dm-shade-8);

    border-left: var(--dm-border);
    border-right: var(--dm-border);
  }

  .table-headers-horizontal__cell {
    min-height: 2.5rem;
    font-weight: 600;
    font-size: 0.75rem;
    line-height: 130%;
    background: var(--dm-shade-10);
    color: var(--dm-shade-2);
    text-transform: uppercase;

    border-top: var(--dm-border);

    .table-cell {
      padding-left: 0.75rem;
    }
  }

  .table-headers-horizontal__cell[sortActive] {
    background-color: var(--dm-shade-6);
    color: var(--dm-color-primary);
  }

  .table-headers-horizontal__cell[sortable]:hover {
    background-color: var(--dm-shade-9);
  }

  .table__cell[position="right"],
  .table__cell[position="left"] {
    overflow: visible;
  }

  .table__cell[position="left"]:before,
  .table__cell[position="right"]:before {
    background: linear-gradient(270deg, rgba(5, 30, 72, 0.08) 0%, rgba(5, 30, 72, 0) 100%);
    mix-blend-mode: multiply;
    pointer-events: none;
    content: "";
    position: absolute;
    opacity: 0.4;
    height: 100%;
    width: 0.5rem;
  }

  .table__cell[position="left"]:before {
    right: -0.5rem;
    transform: rotate(-180deg);
    opacity: 0.8;
  }

  .table__cell[position="right"]:before {
    left: -0.5rem;
  }

  .table-headers-horizontal__cell,
  .table-headers-horizontal__cell[fixed][intersecting][position="right"] {
    border-right: var(--dm-border);
  }

  .table-headers-horizontal__cell[fixed][intersecting][position="right"] {
    border-left: var(--dm-border);
  }

  .table-headers-horizontal__cell:first-of-type[intersecting][fixed] {
    border-right: var(--dm-border);
  }
}
.dm-table-complex-classic--small {
  .table__cell {
    min-height: 2.5rem;
    height: auto;
  }
}
.dm-table-complex-classic--medium {
  .table__cell {
    min-height: 3rem;
    height: auto;
  }
}
.dm-table-complex-classic--large {
  .table__cell {
    min-height: 4rem;
    height: auto;
  }
}
dm-table-complex {
  --dm-z-index-table-header-fixed: 2;
  --dm-z-index-table-header-intersecting-fixed: 3;

  display: grid;
  box-sizing: border-box;
  overflow: hidden;
  grid-template-rows: 1fr auto;

  * {
    box-sizing: border-box;
  }

  .table-container {
    overflow: auto;
    height: 100%;
    width: 100%;
    background-color: var(--dm-shade-8);
  }

  .table {
    display: grid;
    width: 100%;
    height: 100%;
    grid-template-rows: auto auto 1fr;

    &[resizing] {
      cursor: col-resize;
      moz-user-select: none;
      -webkit-user-select: none;
      -ms-user-select: none;
      user-select: none;
    }
  }

  .table__rows {
    display: grid;
    grid-template-columns: var(--dm-table-complex-col-def);
  }

  .table__rows--fake-bottom {
    .table__cell {
      height: 100%;
    }
  }

  .table__row {
    display: grid;
    grid-template-columns: var(--dm-table-complex-col-def);
  }

  .table__row[fixed] {
    position: sticky;
    position: -webkit-sticky;
    z-index: var(--dm-z-index-table-header-fixed);
  }

  .table-headers-horizontal__row[fixed] {
    top: 0;
  }

  .table-headers-vertical-left__row[fixed] {
    left: 0;
  }

  .table-headers__cell[faux] {
    pointer-events: none;
  }

  .table-headers__cell[fixed] {
    position: sticky;
    position: -webkit-sticky;
    z-index: var(--dm-z-index-table-header-fixed);
  }

  .table-headers__cell[fixed][position="left"] {
    left: 0;
  }

  .table-headers__cell[fixed][position="right"] {
    right: 0;
  }

  .table-headers__cell[fixed][intersecting] {
    z-index: var(--dm-z-index-table-header-intersecting-fixed);
  }

  .resize-handle-w {
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 0.2rem;
    cursor: col-resize;
  }

  .sort-control {
    position: absolute;
    right: 0.5rem;
    top: 0;
    height: 100%;
    display: flex;
    align-items: center;
    align-content: center;
  }

  .table-cell {
    overflow: hidden;
  }

  .table__cell {
    &[hidden] {
      visibility: hidden;
    }

    &[alignment="left"] {
      align-items: start;
    }

    &[alignment="center"] {
      align-items: center;
    }

    &[alignment="right"] {
      align-items: end;
    }
  }

  .table-headers-horizontal__cell[sortable] {
    cursor: pointer;
  }

  .table-headers-horizontal__cell:not([sortActive]) .sort-control {
    visibility: hidden;
  }

  .table-headers-horizontal__cell[sortOrder="asc"] .sort-control {
    transform: rotate(180deg);
  }

  ::-webkit-scrollbar-track {
    background-color: color-mix(in srgb, var(--dm-shade-5) 30%, transparent) !important;
  }

  ::-webkit-scrollbar-track:vertical {
    margin: var(--dm-table-complex-row-headers-horizontal-height) 0 0 0;
  }

  ::-webkit-scrollbar-track:horizontal {
    margin: 0 var(--dm-table-complex-headers-intersecting-right-width) 0
      var(--dm-table-complex-headers-intersecting-left-width);
  }

  ::-webkit-scrollbar-corner {
    background-color: transparent;
  }
}
.dm-table-simple-expand {
  .table__row-parent {
    height: 2rem;
    background:
      linear-gradient(0deg, rgba(206, 208, 218, 0.05), rgba(206, 208, 218, 0.05)),
      linear-gradient(180deg, rgba(245, 245, 245, 0) 0%, var(--dm-shade-8) 100%);
    box-shadow:
      inset 0 -0.0625rem 0 var(--dm-shade-6),
      inset -0.0625rem 0 0 var(--dm-shade-6),
      inset 0.0625rem 0 0 var(--dm-shade-6);
    cursor: pointer;

    .table__row__cell {
      padding-left: 0.5rem;
    }

    .default {
      color: var(--dm-shade-1);
      font-weight: 400;
      font-size: 0.8125rem;
      line-height: 1rem;
    }
  }
}
.dm-table-simple-select {
  .table-simple-select__checkbox {
    padding-right: 1rem;
    padding-left: 0.25rem;
    z-index: var(--dm-z-index-element);
  }

  .table__headers {
    position: relative;
  }

  .table__header__cell_content {
    display: flex;
    align-items: center;
  }

  .selection-actions {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

    display: flex;
    gap: 2rem;
    padding: 0 0.75rem 0 3rem;
    background: var(--dm-color-neu);
  }

  .selection-actions__item {
    display: flex;
    align-items: center;
    font-weight: 500;
    color: var(--dm-shade-8);
    line-height: 1.375rem;
    gap: 0.5rem;
    font-size: 0.8125rem;
    cursor: pointer;
  }

  .selection-actions__icon {
    height: 1.25rem;
    width: 1.25rem;
  }
}
dm-table-simple {
  display: grid;
  overflow: auto;
  grid-template-rows: 1fr auto;

  .table-container {
    overflow: hidden;
  }

  .dm-table {
    height: 100%;
  }

  .table__header__cell_content {
    display: flex;
    align-items: center;
  }

  .drag-icon {
    cursor: move;
    margin-right: 0.5rem;
  }

  .table__row {
    position: relative;

    &[clickable] {
      cursor: pointer;
    }
  }

  .table__header__cell:last-of-type {
    border: none;
  }

  .show-on-hover {
    opacity: 0;
  }

  .table__row:hover .show-on-hover {
    opacity: 1;
  }
}
dm-tags-administration {
  #main-viewport {
    padding-bottom: 0.5rem !important;
  }

  dm-table-simple {
    display: grid;
    grid-template-rows: 1fr auto;
    overflow: auto;
    height: 100%;

    .table-container {
      height: 100%;
      overflow: hidden;
    }

    .dm-table {
      height: 100%;
      overflow: hidden;
      tr {
        grid-template-columns: 6fr 6fr 1fr;
      }
    }
  }
}
.tags-data-view {
  .filters-section {
    display: flex;
    gap: 2rem;
    padding: 1rem 2rem;
  }
}
.tags {
  padding-top: 0 !important;
  display: grid;
  grid-template-rows: 3.5rem 1fr auto;
  padding-bottom: 0.5rem !important;

  .table-container {
    height: 100%;
    overflow: hidden;

    .dm-table {
      height: 100%;

      tr {
        display: grid;
        grid-template-columns: 4fr repeat(2, 1fr);
        &.hasSections {
          cursor: pointer;
        }
      }

      .site-sections-display {
        background:
          linear-gradient(0deg, rgba(234, 237, 243, 0.4), rgba(234, 237, 243, 0.4)),
          var(--dm-shade-8);
        box-shadow:
          inset 0 -0.0625rem 0 var(--dm-shade-6),
          inset -0.0625rem 0 0 var(--dm-shade-6),
          inset 0.0625rem 0 0 var(--dm-shade-6);
        .heading {
          height: 1.25rem;
          background:
            linear-gradient(0deg, rgba(234, 237, 243, 0.4), rgba(234, 237, 243, 0.4)),
            var(--dm-shade-8);
          box-shadow:
            inset 0 -0.0625rem 0 var(--dm-shade-6),
            inset -0.0625rem 0 0 var(--dm-shade-6),
            inset 0.0625rem 0 0 var(--dm-shade-6);
          display: flex;
          align-items: center;
          padding: 0 3.5rem;

          span {
            font-weight: 600;
            font-size: 0.6875rem;
            text-transform: uppercase;
            color: var(--dm-shade-4);
          }
        }
        .site-sections-grid {
          padding: 1.5rem 3.5rem;
          display: grid;
          grid-template-columns: repeat(3, 1fr);
          grid-column-gap: 3.5rem;
          .section-item {
            display: grid;
            overflow: auto;
            grid-template-columns: 1fr 1rem 1.5rem;
            grid-gap: 0.5rem;
            align-items: center;
            box-sizing: border-box;
            padding: 1rem;
            background: color-mix(in srgb, var(--dm-shade-8) 80%, transparent);
            height: 3.5rem;
            box-shadow:
              inset 0 -0.0625rem 0 var(--dm-shade-6),
              inset -0.0625rem 0 0 var(--dm-shade-6),
              inset 0.0625rem 0 0 var(--dm-shade-6),
              inset 0 0 0 var(--dm-shade-6);
            &:nth-child(-n + 3) {
              box-shadow:
                inset 0 -0.0625rem 0 var(--dm-shade-6),
                inset -0.0625rem 0 0 var(--dm-shade-6),
                inset 0.0625rem 0 0 var(--dm-shade-6),
                inset 0 0.0625rem 0 var(--dm-shade-6);
            }
            .section-item-label {
              display: flex;
              flex-grow: 1;
              cursor: pointer;
              overflow: hidden;
              text-overflow: ellipsis;
              input[type="checkbox"] {
                margin-right: 0.75rem;
              }
              span {
                font-size: 0.875rem;
                color: var(--dm-shade-3);
              }
            }

            .btn-actions {
              display: flex;
              flex-basis: 0;
              justify-content: flex-end;
              cursor: pointer;
            }

            .status {
              position: relative;
              display: flex;
              justify-content: flex-end;
              flex-basis: 0;
            }
          }
        }
      }

      .group-display {
        cursor: pointer;
        height: 3rem;
        padding: 0 0.5rem;
        display: flex;
        align-items: center;
        background:
          linear-gradient(0deg, rgba(206, 208, 218, 0.05), rgba(206, 208, 218, 0.05)),
          linear-gradient(180deg, rgba(245, 245, 245, 0) 0%, var(--dm-shade-8) 100%);
        box-shadow:
          inset 0 -0.0625rem 0 var(--dm-shade-6),
          inset -0.0625rem 0 0 var(--dm-shade-6),
          inset 0.0625rem 0 0 var(--dm-shade-6);
        .expand-control {
          height: 1.5rem;
          width: 1.5rem;
          object-fit: scale-down;
          object-position: center;
          margin-right: 0.25rem;
        }
        span {
          font-size: 0.8125rem;
          font-weight: 500;
          color: var(--dm-shade-1);
        }
      }
    }
  }

  .additional-tools {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    padding: 0 1rem;

    label {
      cursor: pointer;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
      input[type="checkbox"] {
        pointer-events: none;
        top: 0.2rem;
        margin-right: 0.75rem;
      }
      span {
        font-size: 0.75rem;
        color: var(--dm-shade-4);
      }
    }

    .group {
      display: flex;
      align-items: center;
      height: 3.5rem;
    }

    .l-group {
      border-right: 1px solid color-mix(in srgb, var(--dm-shade-5) 50%, transparent);
      & > * {
        margin-right: 1rem;
      }
    }

    .c-group {
      padding: 0 1rem;
      button {
        color: var(--dm-shade-1);
      }
      & > * {
        margin-right: 2rem;
      }
    }

    .r-group {
      border-left: 1px solid color-mix(in srgb, var(--dm-shade-5) 50%, transparent);
      .icn-txt-btn {
        display: flex;
        align-items: center;
        text-transform: uppercase;
        font-size: 1rem;
        span {
          font-size: 0.75rem;
        }
        .icon {
          position: relative;
          top: -0.04rem;
          opacity: 0.6;
        }
      }

      .expand-controls {
        cursor: pointer;
        width: 2rem;
        height: 2rem;
        object-fit: scale-down;
      }

      & > * {
        margin-left: 1rem;
      }
    }

    .txt-btn {
      display: flex;
      align-items: center;
      margin-left: 1.5rem;
      img {
        margin-right: 0.5rem;
      }
    }
  }
}
.email-selected-tags-modal-container {
  .info-container {
    text-align: center;
    .info {
      background: var(--dm-color-category-5);
      color: var(--dm-shade-8);
      display: inline-flex;
      align-items: center;
      padding: 0 2rem;
      margin: 1rem;
      height: 2.5rem;
      border-radius: 1.25rem;
      span {
        font-size: 0.9375rem;
        font-weight: 600;
      }
      .faded {
        opacity: 0.6;
      }
    }
  }

  .modal-content {
    position: relative;
    .success-display {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: var(--dm-z-index-accent);
      text-align: center;
      padding-top: 5.5rem;
      background: var(--dm-main-bg-color);
      p {
        color: var(--dm-shade-3);
      }
    }
  }
}
.target-name-modal .modal {
  width: 32rem;
  .modal-header {
    box-shadow: none;
    background: none;
  }
  .modal-content {
    padding: 1rem 3rem;
    min-height: 8rem;

    .form-section:before {
      background: none;
    }
  }
}
.target-update-modal .modal {
  .modal-header {
    box-shadow: none;
    background: none;
  }
  .modal-content {
    padding: 0 3rem;
    max-height: 50vh;
    margin-right: 0.5rem;
  }

  dm-list {
    border: 1px solid var(--dm-shade-6);
    border-bottom: none;
    display: block;
    dm-preloader {
      margin-top: 1rem;
      display: block;
      width: 4rem;
    }
    .list-item:hover {
      background: color-mix(in srgb, var(--dm-shade-8) 25%, transparent);
    }
    .list-item.selected {
      background: color-mix(in srgb, var(--dm-color-primary) 6%, transparent);
    }
  }

  .primary-btn.disabled {
    pointer-events: none;
    background: var(--dm-shade-6);
    color: var(--dm-shade-5);
  }
}
dm-button-text {
  &[disabled],
  &[loading] {
    pointer-events: none;
  }

  .button {
    display: flex;
    font-size: 0.8125rem;
    line-height: 1rem;

    &[disabled] {
      opacity: 0.3;
    }

    &[loading] {
      pointer-events: none;
    }
  }

  .button__icon {
    margin-right: 0.5rem;
  }

  .button--theme-primary {
    color: var(--dm-color-primary);
  }

  .button__loader {
    margin-right: 0.5rem;
  }
}
dm-text-input-inline {
  display: grid;
  grid-template-columns: auto auto 1fr;
  align-items: center;
  border: 0.0625rem solid color-mix(in srgb, var(--dm-shade-5) 70%, transparent);
  padding: 0.3125rem 0.75rem;
  border-radius: 0.25rem;
  background-color: var(--dm-shade-8);

  .icon {
    margin-left: 0.5rem;
  }

  .input {
    border: none;
    font-size: 0.875rem;
    line-height: 1.375rem;
    color: var(--dm-shade-2);
    padding: 0 0.375rem;
    width: 100%;
  }
}
dm-toggle {
  width: 2.375rem;
  height: 1.25rem;

  input[type="checkbox"] {
    -moz-appearance: initial;
    position: relative;
    font-size: 1rem;
    margin: 0;
    cursor: pointer;
    outline: none;
    height: 100%;
    width: 100%;
    display: inline-flex;
    align-items: center;

    &:before {
      content: "";
      position: absolute;
      width: 100%;
      height: 100%;
      border-radius: 0.625rem;
      background: var(--dm-shade-5);
    }

    &:after {
      content: "";
      height: 1rem;
      width: 1rem;
      border-radius: 50%;
      background: var(--dm-shade-8);
      position: absolute;
      margin: 0 0.125rem;
      box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.15);
    }

    &:checked:before {
      background: var(--dm-color-category-5);
    }

    &:checked:after {
      left: auto;
      right: 0;
    }

    &[disabled] {
      opacity: 0.3;
    }
  }

  &[size="small"] {
    height: 1rem;
    width: 1.875rem;

    input::before {
      height: 1rem;
      width: 1.875rem;
    }

    input::after {
      width: 0.7rem;
      height: 0.7rem;
    }
  }
}
dm-tooltip {
  position: absolute;
}
.dm-tooltip {
  position: absolute;
  pointer-events: all;
  opacity: 1;
  left: 0;
  top: 0;
  will-change: transform;
  z-index: var(--dm-z-index-tooltip);

  &:not([visible]) {
    display: none;
    pointer-events: none;
    opacity: 0;
  }
}
.dm-tooltip__content {
  padding: 0.375rem 0.75rem;
  max-width: 16rem;
  cursor: default;
  background: var(--dm-shade-1);
  font-size: 0.8125rem;
  line-height: 1rem;
  color: var(--dm-shade-8);
  border-radius: 0.25rem;
  overflow: hidden;
  box-shadow:
    0 0 0.125rem rgba(0, 0, 0, 0.12),
    0 0.25rem 1rem rgba(0, 0, 0, 0.15);

  p {
    margin: 0.75rem 0;
  }

  h1,
  h2,
  h3,
  h4 {
    color: var(--dm-shade-8);
  }
}
.dm-tooltip__arrow {
  position: absolute;
  will-change: transform;
  padding: 0.5rem;
  z-index: var(--dm-z-index-below);
}
.dm-tooltip__arrow__object {
  background: var(--dm-shade-1);
  width: 0.375rem;
  height: 0.375rem;
  transform-origin: center;
  transform: rotate(45deg);
}
.universal-questions-viewport {
  padding-top: 1rem;
  display: grid;
  grid-template-rows: 1fr auto;
  padding-bottom: 0.5rem !important;

  .table-container {
    height: 100%;
    overflow: hidden;
  }

  .dm-table.universal-questions-table {
    height: 100%;
    tr {
      display: grid;
      grid-template-columns: 1fr 12rem 16rem;
    }

    .answers-display {
      .heading {
        height: 1.25rem;
        background:
          linear-gradient(0deg, #f7f8fa, #f7f8fa),
          linear-gradient(180deg, rgba(245, 245, 245, 0) 0%, var(--dm-shade-8) 100%);
        box-shadow:
          inset 0.0625rem 0 0 var(--dm-shade-6),
          inset -0.0625rem 0 0 var(--dm-shade-6),
          inset 0 -0.0625rem 0 var(--dm-shade-6);
        display: flex;
        align-items: center;
        padding: 0 2.75rem;

        span {
          font-weight: 600;
          font-size: 0.6875rem;
          text-transform: uppercase;
          color: var(--dm-shade-4);
        }
      }

      .answer-item {
        display: grid;
        grid-template-columns: 1fr 32.2rem;
        padding: 1rem 0;
        border-bottom: 1px solid var(--dm-shade-6);
        background:
          linear-gradient(0deg, rgba(234, 237, 243, 0.2), rgba(234, 237, 243, 0.2)),
          var(--dm-shade-8);

        .answer-info {
          display: flex;
          flex-shrink: 0;
          align-items: flex-start;
          justify-content: space-between;
          padding-right: 2rem;

          label {
            margin-left: 2.75rem;
            color: var(--dm-shade-3);
            span {
              font-size: 0.875rem;
            }
          }

          .status {
            justify-content: flex-end;
            width: 11rem;
            position: relative;
            top: 0.15rem;
            .status-label {
              font-weight: 600;
              font-size: 0.75rem;
              color: var(--dm-shade-4);
            }
          }
        }

        .answer-id {
          padding-left: 0.75rem;
        }
      }
    }
  }
}
.modal.edit-universal-question-modal {
  grid-template-columns: 0.5fr 0.5fr;
  width: 70rem;
  height: 80%;

  &.modal-header {
    grid-row: 1;
    grid-column: 1;
  }

  & > .modal-content {
    grid-row: 2;
    grid-column: 1;
    .form-section {
      padding-bottom: 1rem;

      .multi-input-control {
        max-width: 32.375rem;
      }
    }
  }

  & > .modal-footer {
    grid-row: 3;
    grid-column: 1 / 3;
  }

  .form-section:before {
    background: none;
  }

  .answers-section {
    grid-row: 1 / 3;
    grid-column: 2;
    background: color-mix(in srgb, var(--dm-shade-5) 20%, transparent);

    padding: 2.5rem 3rem 0.5rem 3rem;
    display: grid;
    grid-template-rows: auto 1fr;
    grid-gap: 0.5rem;

    .top-controls {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding-bottom: 1rem;
      border-bottom: 1px solid var(--dm-shade-5);
      h4 {
        color: var(--dm-shade-3);
        font-size: 1.25rem;
        font-weight: 500;
        margin: 0;
      }

      .create-answer-btn {
        color: var(--dm-color-primary);
      }
    }

    .no-answers {
      color: var(--dm-shade-4);
      font-size: 0.8125rem;
      line-height: 200%;
      .txt-btn {
        font-size: 1rem;
        color: var(--dm-shade-4);
        text-decoration: underline;
      }
    }

    .answers-list {
      overflow: auto;

      .answer-item {
        position: relative;
        background: color-mix(in srgb, var(--dm-shade-8) 60%, transparent);
        padding: 0.75rem 1rem 0.75rem 0.5rem;
        display: grid;
        grid-template-columns: auto 1fr auto;
        grid-gap: 0.75rem;
        align-items: center;
        margin-bottom: 0.5rem;

        .num {
          height: 1.4rem;
          min-width: 1.4rem;
          border-radius: 0.8rem;
          border: 1px solid var(--dm-shade-6);
          background: var(--dm-shade-8);
          display: inline-block;
          text-align: center;
          line-height: 1.4rem;
          span {
            color: var(--dm-shade-3);
            background: var(--dm-shade-8);
            font-size: 0.75rem;
          }
        }
        .m-sect {
          justify-self: left;

          .answer-text {
            font-size: 0.875rem;
            font-weight: 500;
            color: var(--dm-shade-2);
          }
          .status {
            width: 100%;
            display: flex;
            align-items: center;
            margin-top: 0.25rem;

            .status-name {
              color: var(--dm-shade-4);
              font-size: 0.75rem;
              font-weight: 600;
              text-transform: capitalize;
            }

            .status-display {
              display: inline-block;
              width: 0.5rem;
              height: 0.5rem;
              border-radius: 50%;
              margin-right: 0.5rem;
              box-sizing: border-box;
              &.active {
                background-color: var(--dm-color-category-5);
              }
              &.stopped {
                background-color: var(--dm-shade-4);
              }
            }
          }
        }
        .r-sect {
          display: flex;
          flex-direction: column;
          align-items: flex-end;
          span {
            font-size: 0.75rem;
            color: var(--dm-shade-1);
            font-weight: 500;
          }
          .actions-button {
            cursor: pointer;
          }
        }

        &.dragging {
          opacity: 0.5;
        }

        &.drop-target {
          &:after {
            content: "";
            display: block;
            width: 100%;
            height: 0.0625rem;
            position: absolute;
            top: -0.3rem;
            left: 0;
            background: var(--dm-color-primary);
          }
          &.drop-after:after {
            top: calc(100% + 0.3rem);
          }
        }
      }
    }
  }

  .item-id {
    font-size: 0.875rem;
    .id-label {
      color: var(--dm-shade-4);
    }
    .id-value {
      color: var(--dm-shade-3);
    }
  }

  .universal-answer-modal-container {
    z-index: var(--dm-z-index-accent);
    .modal.universal-answer-modal {
      position: absolute;
      top: 3.5rem;
      right: 3rem;
      width: 34rem;

      .form-element.text-input textarea {
        height: 6rem;
      }
    }
  }
}
dm-user-menu-dropdown {
  cursor: pointer;
  position: absolute;
  z-index: var(--dm-z-index-menu);
  top: 0;
  left: 0;
  font-size: 0.875rem;
  line-height: 1.375rem;
  font-weight: 500;
  display: flex;

  .dropdown {
    margin: 0.5rem 0;
    background: var(--dm-shade-8);
    min-width: 16rem;
    border-radius: 0.25rem;
    box-shadow:
      0 0 0.125rem rgba(var(--dm-color-static), 0.12),
      0 0.25rem 1rem rgba(var(--dm-color-static), 0.15);

    &:not(.open) {
      display: none;
    }
  }

  .user-avatar-popup {
    background: var(--dm-shade-4);
  }

  .user-details {
    gap: 1rem;
    display: flex;
  }

  .user-initials {
    background: var(--dm-shade-4);
    text-transform: uppercase;
    width: 2.375rem;
    height: 2.375rem;
    border-radius: 50%;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--dm-color-static);

    display: flex;
    align-items: center;
    justify-content: center;
  }

  .user-name {
    color: var(--dm-shade-2);
    font-size: 1rem;
    line-height: 150%;
    font-weight: 500;
  }

  .user-email {
    color: var(--dm-shade-4);
    font-size: 0.875rem;
    line-height: 160%;
    font-weight: 500;
  }

  .option {
    white-space: nowrap;
    background: var(--dm-shade-8);
    padding: 0.5625rem 1rem;
    color: var(--dm-shade-2);
    display: flex;
    align-items: center;
    gap: 0.75rem;

    &:not(:last-of-type) {
      box-shadow: inset 0 -0.0625rem 0 var(--dm-box-shadow);
    }

    &:hover {
      background: var(--dm-shade-7);
    }

    &:last-child {
      border-bottom: none;
    }

    &:not(:first-child):hover {
      background-color: color-mix(in srgb, var(--dm-color-primary) 5%, transparent);
    }
  }
}
dm-user-menu {
  .user-button {
    display: flex;
    justify-items: center;
  }

  .initials {
    background: color-mix(in srgb, var(--dm-color-static) 20%, transparent);
    width: 2.375rem;
    height: 2.375rem;
    border-radius: 50%;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--dm-color-static);

    display: flex;
    align-items: center;
    justify-content: center;
  }

  .arrow-icon {
    margin-left: 0.25rem;
  }
}
.users {
  padding-top: 1rem;
  display: grid;
  grid-template-rows: 1fr auto;
  padding-bottom: 0.5rem !important;

  .additional-tools {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-bottom: 1rem;
    padding: 0 0.2rem;

    .txt-btn {
      display: flex;
      align-items: center;
      margin-left: 1.5rem;
      img {
        margin-right: 0.5rem;
      }
    }
  }
}
.modal.user-modal {
  .loader-blocker {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    z-index: var(--dm-z-index-preloader);
    display: none;
  }
}
.modal.user-modal.saving {
  .loader-blocker {
    display: block;
  }
}
.ssc-organisation {
  .additional-controls-block {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 1rem;
    span {
      font-size: 0.6875rem;
      line-height: 118%;
      color: var(--dm-shade-4);
    }
  }
}
.add-organisation-modal-container {
  z-index: var(--dm-z-index-modal);
  justify-content: flex-end;
  .add-organisation-modal {
    width: 32rem;
    height: 100%;
    .form-section:before {
      content: none;
      input {
        background:
          linear-gradient(0deg, var(--dm-shade-8), var(--dm-shade-8)),
          linear-gradient(0deg, #f2f4f7 0%, var(--dm-shade-8) 100%);
      }
    }
  }
}
dm-user-settings {
  #main-viewport {
    padding: 0;
    display: grid;
    grid-template-rows: 1fr auto;
  }

  .organisation-name {
    color: var(--dm-shade-3);
    font-size: 0.875rem;
  }

  .form__wrapper {
    overflow-y: auto;
  }

  .controls {
    padding: 1.25rem 3rem;
    background: var(--dm-shade-8);
    display: flex;
    justify-content: flex-end;
    box-shadow: inset 0 0.0625rem 0 var(--dm-shade-6);
    position: relative;
  }

  .form {
    width: 56rem;
    margin: 0 auto;

    .form-section {
      grid-gap: 1.5rem 3rem;

      .section-title {
        height: 3.5rem;
        display: flex;
        align-items: center;
        color: var(--dm-shade-1);
        font-weight: 500;
        border-bottom: 1px solid var(--dm-shade-6);
      }

      &:before {
        background: none;
      }
    }

    .field-info {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin: 1rem 0;

      .info-wrapper {
        span {
          font-size: 0.9375rem;
          color: var(--dm-shade-1);
        }
      }

      .txt-btn {
        color: var(--dm-color-primary);
        border-bottom: 1px solid var(--dm-shade-5);
        line-height: 160%;
        font-size: 0.9375rem;
        font-weight: 600;
      }
    }

    .error {
      margin: 0.75rem;
      font-size: 0.75rem;
      color: var(--dm-color-category-6);
    }
  }
}
.users-import-view {
  position: relative;

  .import-preloader {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--dm-shade-8);
    z-index: var(--dm-z-index-preloader);

    .p-inner {
      position: absolute;
      left: 50%;
      top: 50%;
    }

    .shade-circle {
      width: 10rem;
      height: 10rem;
      left: -5rem;
      top: -5rem;
      background: var(--dm-shade-8);
      border-radius: 50%;
      position: absolute;
      box-shadow: 0 0.175rem 1.375rem rgba(0, 0, 0, 0.2);
    }
    span {
      position: absolute;
      font-size: 0.9375rem;
      color: var(--dm-shade-3);
      font-weight: 600;
      line-height: 2rem;
      top: -1rem;
      width: 10rem;
      left: -5rem;
      text-align: center;
    }

    dm-preloader {
      position: absolute;
      top: -6.2rem;
      left: -6.2rem;
      .loader {
        position: relative;
        margin: 0 auto;
        width: 12.4rem;
      }
    }
  }
}
dm-users {
  #main-viewport {
    display: grid;
    grid-template-rows: 1fr auto;
    padding-bottom: 0.5rem !important;
  }

  dm-table-simple {
    display: grid;
    grid-template-rows: 1fr auto;
    overflow: auto;
    width: 100%;
    height: 100%;
    box-sizing: border-box;

    .table-container {
      height: 100%;
      overflow: hidden;

      .dm-table {
        height: 100%;
        overflow: hidden;
      }

      .dm-table tr {
        grid-auto-flow: column;
      }
    }
  }
}
.dm-targets {
  #main-viewport {
    display: grid;
    grid-template-rows: 1fr auto;
    padding-bottom: 0.5rem !important;
  }

  dm-table-simple {
    display: grid;
    grid-template-rows: 1fr auto;
    overflow: auto;
    width: 100%;
    height: 100%;
    box-sizing: border-box;

    .table-container {
      height: 100%;
      overflow: hidden;

      .dm-table {
        height: 100%;
        overflow: hidden;
      }

      .dm-table tr {
        grid-auto-flow: column;
      }
    }
  }

  .target-item {
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: center;
    font-size: 1rem;

    .answers-info {
      display: inline-block;
      font-size: 0.875rem;
      color: var(--dm-shade-4);
      line-height: 160%;
      border-bottom: 1px dashed color-mix(in srgb, var(--dm-color-primary) 50%, transparent);
      cursor: pointer;
    }
  }
}
.variables-tooltip {
  overflow: auto;
  margin: 0.4rem;
  padding: 0.225rem 0.35rem;
  max-width: 30rem;
  max-height: 30rem;
  .title {
    margin-bottom: 0.75rem;
    line-height: 100%;
  }
  span {
    font-weight: 600;
    color: color-mix(in srgb, var(--dm-shade-8) 90%, transparent);
  }
  .answer-item {
    margin: 0.5rem 0;
    display: flex;
    gap: 0.5rem;
    &:last-child {
      margin-bottom: 0;
    }
  }
  .index {
    color: color-mix(in srgb, var(--dm-shade-4) 90%, transparent);
    min-width: 1rem;
    text-align: right;
  }
}
.dm-modal.variable-select-modal {
  .form-section:before {
    background: none;
  }

  .checkbox-group .group {
    flex-direction: column;
    gap: 1rem;
  }
}
.modal.edit-variables-modal {
  grid-template-columns: 0.5fr 0.5fr;
  width: 70rem;
  height: 80%;

  .modal-header {
    grid-row: 1;
    grid-column: 1;

    .rhs-tools {
      display: flex;
      gap: 2rem;
    }
  }

  & > .modal-content {
    grid-row: 2;
    grid-column: 1;
  }

  & > .modal-footer {
    grid-row: 3;
    grid-column: 1 / 3;
    gap: 1.5rem;

    button {
      margin-left: 0;
    }
  }

  .var-type {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--dm-shade-4);
    .val {
      color: var(--dm-shade-3);
    }
  }

  #edit-variable-form {
    padding-bottom: 1rem;

    .variable-source-wrap {
      position: relative;
      display: flex;
      flex-direction: column;
      gap: 1.5rem;
      .variable-source-preloader {
        position: absolute;
        top: 2.1rem;
        right: 2.5rem;
        z-index: var(--dm-z-index-preloader);
      }
    }
  }

  .selected-item {
    word-break: break-all;
  }

  .form-section {
    padding-bottom: 0.5rem;
  }
  .form-section:before {
    background: none;
  }

  .sub-section {
    grid-row: 1 / 3;
    grid-column: 2;
    background: color-mix(in srgb, var(--dm-shade-5) 20%, transparent);

    padding: 2.5rem 3rem 0.5rem 3rem;
    display: grid;
    grid-template-rows: auto 1fr;
    grid-gap: 0.5rem;

    .top-controls {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding-bottom: 1rem;
      border-bottom: 1px solid var(--dm-shade-5);
      h4 {
        color: var(--dm-shade-3);
        font-size: 1.25rem;
        font-weight: 500;
        margin: 0;
      }

      .r-group {
        display: flex;
        align-items: center;
        gap: 1rem;
      }

      .more-btn {
        cursor: pointer;
      }

      .create-btn {
        color: var(--dm-color-primary);
        &:disabled {
          opacity: 0.2;
          pointer-events: none;
        }
      }
    }

    .no-items {
      color: var(--dm-shade-4);
      font-size: 0.8125rem;
      line-height: 200%;
      .txt-btn {
        font-size: 1rem;
        color: var(--dm-shade-4);
        text-decoration: underline;
      }
    }

    .items-list {
      overflow: auto;
      padding-top: 0.3rem;
      position: relative;

      .list-item {
        position: relative;
        background: color-mix(in srgb, var(--dm-shade-8) 60%, transparent);
        padding: 0.75rem 1rem 0.75rem 0.5rem;
        display: grid;
        grid-template-columns: auto 1rem auto 1fr auto;
        grid-gap: 0.75rem;
        align-items: center;
        justify-items: flex-start;
        margin-bottom: 0.5rem;

        .select-wrapper {
          cursor: pointer;
          height: 1rem;
        }
        .select-chk-box {
          top: 0;
          margin-right: 0.25rem;
          pointer-events: none;
        }

        .num {
          height: 1.4rem;
          min-width: 1.4rem;
          border-radius: 0.8rem;
          border: 1px solid var(--dm-shade-6);
          background: var(--dm-shade-8);
          display: inline-block;
          text-align: center;
          line-height: 1.4rem;
          span {
            color: var(--dm-shade-3);
            background: var(--dm-shade-8);
            font-size: 0.75rem;
          }
        }
        .m-sect {
          justify-self: left;

          .main-text {
            font-size: 0.875rem;
            font-weight: 500;
            color: var(--dm-shade-2);
          }
          .secondary-text {
            font-size: 0.75rem;
            font-weight: 500;
            color: var(--dm-shade-4);
            margin-top: 0.25rem;
            .group-label {
              color: var(--dm-color-category-5);
            }
          }
        }
        .r-sect {
          display: flex;
          flex-direction: column;
          align-items: flex-end;
          span {
            font-size: 0.75rem;
            color: var(--dm-shade-1);
            font-weight: 500;
          }
          .actions-button {
            cursor: pointer;
          }
        }
      }
    }
  }
}
.modal.edit-variable-answer-modal {
  grid-template-columns: 0.5fr 0.5fr;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: var(--dm-z-index-modal);

  animation: slideIn 0.3s;
  animation-timing-function: ease;
  animation-fill-mode: forwards;

  &.slide-out {
    animation: slideOut 0.3s;
    animation-timing-function: ease;
    animation-fill-mode: forwards;
  }

  & > .modal-header {
    grid-row: 1;
    grid-column: 1 / 3;
    background: var(--dm-shade-8);
    padding-top: 0.75rem;
    border-bottom: 1px solid var(--dm-shade-6);

    h3 {
      display: flex;
      align-items: center;
      gap: 0.5rem;

      .variable-title {
        color: var(--dm-color-primary);
      }
      .status-label {
        color: var(--dm-shade-4);
      }
    }
  }

  & > .modal-content {
    grid-row: 2;
    grid-column: 1;
    h4 {
      color: var(--dm-shade-3);
      font-weight: 500;
      font-size: 1.25rem;
      margin: 0.5rem 0;
    }
  }

  & > .modal-footer {
    grid-row: 3;
    grid-column: 1 / 3;
  }

  .answers-section {
    grid-row: 2;
    grid-column: 2;
    padding-top: 1.5rem;
    overflow: auto;

    .items-list .list-item.link-item {
      grid-template-columns: auto 1fr auto;
    }
  }
}
.dm-item-dashboard-header-vertical {
  display: flex;
  gap: 0.75rem;
  align-items: center;
  margin-left: 1rem;

  .name {
    font-size: 0.875rem;
    line-height: 130%;
    font-weight: 500;
    color: var(--dm-shade-2);
  }

  .index {
    display: flex;
    align-items: center;
    justify-content: right;
    min-width: 1.4rem;
    color: var(--dm-shade-3);
    font-size: 0.75rem;
    font-weight: 400;
    line-height: 1rem;
  }
}
dm-item-dashboard-detailed-vertical-target {
  display: flex;
  align-items: center;
  font-weight: 500;
  font-size: 0.8125rem;
  line-height: 1.0625rem;
  color: var(--dm-shade-2);
  padding-left: 1.25rem;
}
dm-vertical-header-combined-entities-result-item {
  padding: 0.5rem 0;
  overflow: hidden;

  .result-item__holder {
    display: flex;

    .vertical-header-result-item {
      padding-left: 0.75rem;
    }
  }

  .result-item__holder__combined-items-holder {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
  }

  .result-item__combined-item {
    display: flex;
    flex-direction: row;
    gap: 0.5rem;
  }
}
.dm-video-plugins {
  #main-viewport {
    display: grid;
    grid-template-rows: 1fr auto;
    padding-bottom: 0.5rem !important;
  }

  .video-plugins-websites-table {
    display: grid;
    grid-template-rows: 1fr auto;
    overflow: auto;
    width: 100%;
    height: 100%;
    box-sizing: border-box;

    .table-container {
      height: 100%;
      overflow: hidden;

      .dm-table {
        height: 100%;
        overflow: hidden;
      }
    }
  }

  .website-name-column {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-left: 0.25rem;
  }

  .website-name-column__icon {
    height: 1rem;
    width: 1rem;
  }

  .organization-name-column {
    display: flex;
    align-items: center;
    gap: 0.25rem;
  }
}
.dm-view-auth-layout {
  grid-template-columns: 1fr;
  padding: 2rem 3rem 0 3rem;
  grid-template-rows: auto 1fr auto;
  box-sizing: border-box;

  .login-header {
    z-index: var(--dm-z-index-element);
  }

  .background-image {
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none;
  }

  .background-image-slope {
    height: 30vh;
    width: 100%;
  }

  .footer {
    display: flex;
    justify-content: space-between;
    font-size: 0.75rem;
    font-weight: 400;
    line-height: 150%;
    padding: 1rem 0;
  }
}
.dm-table.websites-table {
  tr {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
  }

  .group-display {
    cursor: pointer;
    height: 3rem;
    padding: 0 0.5rem;
    display: flex;
    align-items: center;

    background:
      linear-gradient(0deg, rgba(206, 208, 218, 0.05), rgba(206, 208, 218, 0.05)),
      linear-gradient(180deg, rgba(245, 245, 245, 0) 0%, var(--dm-shade-8) 100%);
    box-shadow:
      inset 0 -0.0625rem 0 var(--dm-shade-6),
      inset -0.0625rem 0 0 var(--dm-shade-6),
      inset 0.0625rem 0 0 var(--dm-shade-6);
    .expand-control {
      height: 1.5rem;
      width: 1.5rem;
      object-fit: scale-down;
      object-position: center;
      margin-right: 0.25rem;
    }
    span {
      font-size: 0.8125rem;
      font-weight: 500;
      color: var(--dm-shade-1);
    }
  }
}
.modal.add-website-modal {
  grid-template-columns: 0.55fr 0.45fr;
  width: 70rem;

  & > .modal-header {
    grid-row: 1;
    grid-column: 1;
  }

  & > .modal-content {
    grid-row: 2;
    grid-column: 1;
    .form-section {
      padding-bottom: 1rem;

      .multi-input-control {
        max-width: 32.375rem;
      }
    }
  }

  & > .modal-footer {
    grid-row: 3;
    grid-column: 1 / 3;
  }

  .site-sections-section {
    grid-row: 1 / 3;
    grid-column: 2;
    background: color-mix(in srgb, var(--dm-shade-5) 20%, transparent);

    padding: 1.5rem 3rem 0.5rem 3rem;
    display: grid;
    grid-template-rows: auto auto 1fr;

    .top-controls {
      h4 {
        color: var(--dm-shade-3);
        font-size: 1.25rem;
        font-weight: 500;
        margin: 0 0 1.6rem 0;
      }

      .sections-switch-control {
        input {
          margin-left: auto;
        }
      }

      .create-sections-controls {
        margin: 1.25rem 0 0.5rem 0;
        padding-bottom: 1.5rem;
        border-bottom: 1px solid var(--dm-shade-5);
        display: flex;
        justify-content: space-between;
        .create-section-btn {
          color: var(--dm-color-primary);
        }
        .icon-2 {
          margin-left: 0.5rem;
        }
      }
    }

    .site-sections-list {
      overflow: auto;

      .status-info {
        color: var(--dm-shade-4);
        font-size: 0.75rem;
        line-height: 133%;

        .active-status {
          color: var(--dm-color-website-section-2);
          &.active {
            color: var(--dm-color-category-5);
          }
        }

        .mode-status {
          font-weight: bold;
        }
      }

      .section-item-2 {
        background: color-mix(in srgb, var(--dm-shade-8) 60%, transparent);
        margin: 0.25rem 0;
        box-sizing: border-box;
        padding: 0.375rem 0.75rem;

        display: grid;
        grid-template-columns: 1fr minmax(4rem, auto);
        align-items: center;

        &.hidden-section {
          display: none;
        }

        .name {
          font-size: 0.875rem;
          color: var(--dm-shade-1);
        }

        .id-info,
        .tags-info {
          color: var(--dm-shade-4);
          font-size: 0.75rem;
          line-height: 133%;
        }

        .actions-btn,
        .remove-btn {
          height: 1.5rem;
          width: 1.5rem;
          object-fit: scale-down;
          cursor: pointer;
        }

        .remove-btn {
          grid-row: span 3;
          opacity: 0;
          transition: opacity 0.07s;
        }

        &:hover .remove-btn {
          opacity: 1;
        }

        .actions-btn,
        .id-info {
          justify-self: right;
        }
      }

      .system-section {
        background: var(--dm-color-website-section-1);
        margin: 0.25rem 0;
        height: 3rem;
        box-sizing: border-box;
        padding: 0.375rem 0.75rem;

        display: flex;
        justify-content: space-between;
        align-items: center;

        .info-wrap {
          display: flex;
          flex-direction: column;
          justify-content: space-between;
          height: 100%;
          .name {
            font-size: 0.875rem;
            color: var(--dm-shade-1);
          }
        }

        .info-wrap-right {
          display: flex;
          align-items: flex-end;
          flex-direction: column;
          justify-content: space-between;
          height: 100%;
          .id {
            color: var(--dm-shade-4);
            font-size: 0.75rem;
            line-height: 133%;
          }
          .system {
            font-size: 0.875rem;
            color: var(--dm-shade-1);
          }
        }

        .system-label {
          color: var(--dm-color-category-6);
          font-size: 0.75rem;
        }
      }

      .system-section-info {
        .content {
          border: 1px solid var(--dm-color-primary);
          border-radius: 0.4rem;
          padding: 1rem;
          margin: 1rem;
          p {
            font-size: 0.875rem;
            margin: 0;
            padding: 0;
            color: var(--dm-shade-2);
            span {
              color: var(--dm-color-primary);
            }
          }
        }
      }
    }

    .search-input {
      margin-bottom: 0.3rem;

      .input-wrapper {
        position: relative;
        .search-icn {
          position: absolute;
          top: 0;
          left: 0;
          width: 3rem;
          height: 3rem;
          object-fit: scale-down;
        }
        .clear-btn {
          position: absolute;
          top: 0;
          right: 0;
          width: 3rem;
          height: 3rem;
          object-fit: scale-down;
          cursor: pointer;
          &.hidden {
            display: none;
          }
        }
        input {
          padding: 0.75rem 3.25rem;
        }
      }
    }
  }

  .add-site-section-modal-container {
    z-index: var(--dm-z-index-accent);
    .add-site-section-modal {
      width: 30rem;
      height: auto;
      max-height: 80%;
      top: 3.5rem;
      right: 3rem;
      position: absolute;

      .keyword-input-wrap {
        position: relative;
        .icn-txt-btn {
          position: absolute;
          right: 0;
          top: 0.2rem;
        }
      }

      &.system-section-modal {
        .system-default-label {
          font-size: 0.6rem;
          color: var(--dm-color-category-6);
          font-weight: normal;
        }
        .system-section-info {
          p {
            font-size: 0.875rem;
            margin: 0;
            padding: 0;
            color: var(--dm-shade-2);
            span {
              color: var(--dm-color-primary);
            }
          }
        }
      }
    }
  }

  .import-site-sections-modal-container {
    z-index: var(--dm-z-index-accent);
    .import-site-sections-modal {
      position: absolute;
      top: 3.5rem;
      right: 3rem;
      width: 34rem;

      textarea {
        height: 22rem;
      }

      .import-instructions {
        font-size: 0.75rem;
        font-weight: 500;
        color: var(--dm-shade-4);
      }
    }
  }
}
dm-websites {
  #main-viewport {
    display: grid;
    grid-template-rows: 1fr auto;
    padding-bottom: 0.5rem !important;
  }

  .websites-table {
    display: grid;
    grid-template-rows: 1fr auto;
    overflow: auto;
    width: 100%;
    height: 100%;
    box-sizing: border-box;

    .table-container {
      height: 100%;
      overflow: hidden;

      .dm-table {
        height: 100%;
        overflow: hidden;
      }
    }
  }

  .websites-table_website-name-column {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-left: 0.25rem;
  }

  .websites-table_website-name-column__name {
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .websites-table_website-name-column__icon {
    height: 1rem;
    width: 1rem;
  }

  .websites-table_organization-name-column {
    display: flex;
    align-items: center;
    gap: 0.25rem;
  }

  .websites-table_organization-name-column__name {
    overflow: hidden;
    text-overflow: ellipsis;
  }
}
@font-face {
  font-family: "proxima-nova";
  src:
    url("../../fonts/ProximaNovaLight.woff2") format("woff2"),
    url("../../fonts/ProximaNovaLight.woff") format("woff"),
    url("../../fonts/ProximaNovaLight.otf") format("opentype");
  font-display: auto;
  font-style: normal;
  font-weight: 300;
  font-stretch: normal;
}
@font-face {
  font-family: "proxima-nova";
  src:
    url("../../fonts/ProximaNovaRegular.woff2") format("woff2"),
    url("../../fonts/ProximaNovaRegular.woff") format("woff"),
    url("../../fonts/ProximaNovaRegular.otf") format("opentype");
  font-display: auto;
  font-style: normal;
  font-weight: 400;
  font-stretch: normal;
}
@font-face {
  font-family: "proxima-nova";
  src:
    url("../../fonts/ProximaNovaMedium.woff2") format("woff2"),
    url("../../fonts/ProximaNovaMedium.woff") format("woff"),
    url("../../fonts/ProximaNovaMedium.otf") format("opentype");
  font-display: auto;
  font-style: normal;
  font-weight: 500;
  font-stretch: normal;
}
@font-face {
  font-family: "proxima-nova";
  src:
    url("../../fonts/ProximaNovaSemiBold.woff2") format("woff2"),
    url("../../fonts/ProximaNovaSemiBold.woff") format("woff"),
    url("../../fonts/ProximaNovaSemiBold.otf") format("opentype");
  font-display: auto;
  font-style: normal;
  font-weight: 600;
  font-stretch: normal;
}
@font-face {
  font-family: "proxima-nova";
  src:
    url("../../fonts/ProximaNovaBold.woff2") format("woff2"),
    url("../../fonts/ProximaNovaBold.woff") format("woff"),
    url("../../fonts/ProximaNovaBold.otf") format("opentype");
  font-display: auto;
  font-style: normal;
  font-weight: 700;
  font-stretch: normal;
}
body {
  --dm-color-category-7: #ffc400;
}
dm-sidebar-reporting.dm-sidebar {
  background: var(--dm-color-primary-2);

  .item {
    color: color-mix(in srgb, var(--dm-color-static) 80%, transparent);

    &.active {
      color: var(--dm-color-static);
    }

    &:not(.has-children).active {
      background: color-mix(in srgb, var(--dm-color-static) 4%, transparent);
    }

    &.has-children.active {
      background: color-mix(in srgb, var(--dm-color-static) 7%, transparent);
    }

    &.active-border {
      border-left: 0.25rem solid var(--dm-color-primary-800);
    }

    &:hover {
      background-color: rgba(var(--dm-color-static), 0.02);
    }
  }
}
.modal-container {
  z-index: var(--dm-z-index-modal);
}
.modal-container .modal {
  .modal-header {
    background: var(--dm-shade-8);
    box-shadow: inset 0 -0.0625rem 0 var(--dm-shade-6);
    padding: 1rem 1.5rem;

    h3 {
      margin: 0;
      padding-top: 0.4rem;
      .sub-title {
        color: var(--dm-shade-4);
        font-size: 0.75rem;
      }
    }
  }

  .form-section {
    padding: 1rem 1.5rem 1.5rem 1.5rem;
  }
  .form-element.text-display div {
    border: 1px solid var(--dm-shade-6);
  }

  .modal-footer {
    padding: 1rem 1.5rem;
  }
}
.modal-container .modal.error-modal .modal-content {
  padding: 1rem 1.5rem;
}
#media-entity-change-modal {
  .modal {
    margin-left: var(--dm-sidebar-width);
    width: 40rem;
    padding: 0;
  }

  .modal-header {
    background: none;
    box-shadow: none;
    padding: 3rem 3rem 1.5rem 3rem;
    color: var(--dm-shade-3);
    line-height: 2rem;
    font-size: 1.25rem;
  }
  .modal-content {
    padding: 0 3rem 3rem 3rem;
    min-height: 0;
    font-size: 0.9375rem;
    line-height: 1.5rem;
    letter-spacing: 0.2px;
    color: var(--dm-shade-1);
  }

  .modal-footer {
    padding: 1rem 3rem;
    height: auto;

    .primary-btn {
      background: var(--dm-color-neu);
      font-size: 0.9375rem;
      line-height: 1.5rem;
    }
  }

  .dm-table {
    border-top: 1px solid var(--dm-shade-6);
  }
}
.mode-label--dev.mode-label--position-bottom-left {
  color: var(--dm-color-primary-2);
  background: rgba(255, 255, 255, 0.7);
}
.sdk {
  grid-template-rows: 3rem 1fr auto;

  dm-preloader {
    margin: 1rem 0;
  }

  .additional-tools {
    background: var(--dm-shade-8);
    box-shadow:
      inset 0 -0.0625rem 0 var(--dm-shade-6),
      inset 0.0625rem 0 0 var(--dm-shade-6);

    .group {
      height: 3rem;
      border: none;
    }
  }

  .dm-table tr th.active {
    background: var(--dm-shade-6);
  }
  .dm-table thead tr {
    background: var(--dm-shade-7);
  }

  .dm-table thead tr .column-title {
    color: var(--dm-shade-2);
  }

  .dm-table tr th.active .column-title,
  .dm-table tr th.active .zeros {
    color: var(--dm-color-primary);
  }

  .dm-table tr th {
    border-right: none;
  }
}
dm-sdk-publisher {
  .simple-tools-group {
    display: none;
  }
}
.dm-search.blue {
  .sc {
    position: relative;
    height: 3rem;
    background: color-mix(in srgb, var(--dm-color-primary) 100%, transparent);
    border-radius: 0;
    border: none;
    width: 3.25rem;
    padding: 0.5rem 0.85rem;

    .search-icn {
      filter: brightness(2);
    }

    &.active {
      width: 28rem;
      background: color-mix(in srgb, var(--dm-color-primary) 5%, transparent);
      .search-icn {
        filter: brightness(0.6);
      }
    }

    &[rounded] {
      border-radius: 0.25rem;
    }
  }

  .bottom-line {
    height: 0.1875rem;
    background-color: var(--dm-color-primary);
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
  }
}
.tags {
  grid-template-rows: 3rem 1fr auto;

  dm-preloader {
    margin: 1rem 0;
  }

  .additional-tools {
    background: var(--dm-shade-8);
    box-shadow:
      inset 0 -0.0625rem 0 var(--dm-shade-6),
      inset 0.0625rem 0 0 var(--dm-shade-6);

    .group {
      height: 3rem;
      border: none;
    }
  }

  .dm-table tr th.active {
    background: var(--dm-shade-6);
  }
  .dm-table thead tr {
    background: var(--dm-shade-7);
  }

  .dm-table thead tr .column-title {
    color: var(--dm-shade-2);
  }

  .dm-table tr th.active .column-title,
  .dm-table tr th.active .zeros {
    color: var(--dm-color-primary);
  }

  .dm-table tr th {
    border-right: none;
  }
}
dm-tags-publisher {
  .simple-tools-group {
    display: none;
  }
}
.dm-view-auth-layout {
  background-color: var(--dm-shade-7);

  .footer {
    color: var(--dm-shade-4);
    border-top: 1px solid color-mix(in srgb, var(--dm-shade-4) 30%, transparent);
  }
}

/*# sourceMappingURL=main.css.map */