// Personalization Elements
//================================================== //
.personalize-overlay {
  display: block;
  height: 100%;
  left: 0;
  position: fixed;
  text-align: center;
  top: 0;
  width: 100%;
  z-index: 10000;
}

.is-personalizable .personalize-header,
.is-personalizable.tab-container {
  background-color: $header-default-bg-color;
  border-bottom: 1px solid transparent;

  ::selection {
    background: $ids-color-palette-azure-90;
    color: $inverse-color;
  }
}

.is-personalizable.header {
  background-color: $header-default-bg-color;
  border-bottom: 1px solid $header-default-bg-border-color;
}

.is-personalizable.has-more-button.tab-container.horizontal {
  &::after {
    background-image:
      linear-gradient(to left,
        rgba($header-bg-color, 1),
        rgba($header-bg-color, 0));
    height: 39px;
  }
}

.is-personalizable .personalize-header .instance-count {
  .title,
  .count {
    color: $count-font-color;
  }

  svg.icon {
    background-color: $header-bg-color;
  }
}

.is-personalizable .personalize-subheader {
  background-color: $subhead-bg-color;
}

.is-personalizable .personalize-text,
.is-personalizable.hyperlink:not(.personalize-actionable),
.is-personalizable.hyperlink:not(.personalize-actionable):not([disabled]):not(.personalize-actionable-disabled):hover {
  color: $hyperlinks-personalize-text-color;
}

.is-personalizable .btn-icon.personalize-actionable:hover:not([disabled]) {
  background-color: $button-color-tertiary-hover-background-new;
}

.is-personalizable.subheader .full-searchfield-container .searchfield-wrapper .btn-icon:hover:not([disabled]):not(.btn-primary) svg.icon {
  color: $header-flex-toolbar-close-icon-color-hover;
}

.is-personalizable .label+.personalize-text.data {
  color: $label-personalize-text-color;
}

.is-personalizable .personalize-actionable,
.is-personalizable .personalize-actionable svg {
  color: $header-text-actionable-color
}

.is-personalizable .personalize-actionable.is-focused:not(.hide-focus),
.is-personalizable .personalize-actionable:focus:not(.hide-focus) {
  border-color: $ids-color-palette-white;
  box-shadow: 0 0 4px 3px rgba(0, 0, 0, 0.2);
}

.is-personalizable .personalize-actionable.hyperlink:focus:not(.hide-focus)::after {
  border-color: $ids-color-palette-white;
  box-shadow: 0 0 4px 3px rgba(0, 0, 0, 0.2);
  opacity: 1;
}

.is-personalizable .personalize-vertical-border {
  border-color: $ids-color-palette-white;
}

.is-personalizable .personalize-horizontal-bottom-border {
  border-bottom: 1px solid $module-tabs-y-border-color;
}

.is-personalizable .personalize-horizontal-top-border {
  border-top: 1px solid $module-tabs-y-border-color;
}

.is-personalizable .personalize-chart-targeted .total.bar {
  background-color: rgba(0, 0, 0, 0.3);
}

.is-personalizable .personalize-actionable-disabled,
.is-personalizable .personalize-actionable-disabled:hover {
  cursor: default;
  opacity: 0.4;
}

// Compact versions
.form-layout-compact {
  &.personalize-header.form-layout-compact {
    .row.top-padding {
      padding-top: 15px;
    }

    .row:last-child {
      padding-bottom: 15px;
    }

    .small-bottom-padding {
      padding-bottom: 5px !important;
    }
  }
}

// Classic themes default color personalization
.is-personalizable {
  .personalize-header {
    .personalize-chart-targeted .label,
    .info-message .icon,
    .info-message p,
    .btn-icon .icon {
      color: $header-button-normal-color;
    }
  }

  & .personalize-actionable:not(:hover) {
    opacity: 0.8;
  }

  & .tab-container.horizontal > .tab-list-container .tab:not(.is-selected):not(.is-disabled):hover {
    border-bottom-color: $ids-color-palette-white;
  }
}

.is-personalizable.tab-container.horizontal > .tab-list-container .tab:not(.is-selected):not(.is-disabled):hover,
.is-personalizable.tab-container.header-tabs > .tab-list-container .tab:not(.is-selected):not(.is-disabled):hover {
  border-bottom-color: $ids-color-palette-white;
}