@import "./../../style-config/colors";

.carbon-pod__block {
  background-color: $white;
  border: 1px solid $border-color;
  border-radius: 4px;
}

.carbon-pod__edit-action {
  background-color: $white;
  border: 1px solid $border-color;
  border-radius: 4px;
  box-sizing: content-box;
  margin-left: 2px;
  display: inline-block;
  width: 15px;
  height: 15px;
  vertical-align: top;
}

.carbon-pod--content-triggers-edit .carbon-pod__block:hover {
  cursor: pointer;
}

.carbon-pod--is-hovered {
  .carbon-pod__block {
    background-color: $grey-dark-blue-15;
  }

  &.carbon-pod--content-triggers-edit .carbon-pod__block,
  .carbon-pod__edit-action {
    background-color: $blue-dark;
    color: $white;

    * {
      color: $white;
    }

    .carbon-portrait .carbon-icon__svg path {
      color: $grey-dark-blue-50;
    }
  }

  .carbon-pod__display-on-hover {
    display: block;
  }
}

.carbon-pod__display-on-hover {
  display: none;
}

.carbon-pod__edit-button-container {
  display: inline-block;
  vertical-align: top;
  cursor: pointer;
}

.carbon-pod__edit-action--no-border,
.carbon-pod__block--no-border {
  border: none;
}

.carbon-pod__edit-action--secondary,
.carbon-pod__block--secondary {
  background-color: $background-alt;
}

.carbon-pod__edit-action--tertiary,
.carbon-pod__block--tertiary {
  background-color: $grey-dark-blue-10;
}

.carbon-pod__edit-action--transparent,
.carbon-pod__block--transparent {
  background-color: transparent;
}

.carbon-pod__block--tile {
  box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.2);
}

.carbon-pod__edit-action--padding-extra-small .carbon-icon__svg--edit {
  height: 13px;
  margin-left: 1px;
  width: 13px;
}

.carbon-pod__edit-action--padding-extra-small,
.carbon-pod__content--padding-extra-small {
  padding: 6px;
}

.carbon-pod__edit-action--padding-small,
.carbon-pod__content--padding-small {
  padding: 10px;
}

.carbon-pod__edit-action--padding-extra-large,
.carbon-pod__edit-action--padding-large,
.carbon-pod__edit-action--padding-medium,
.carbon-pod__content--padding-medium {
  padding: 15px;
}

.carbon-pod__content--padding-large {
  padding: 30px 25px;
}

.carbon-pod__content--padding-extra-large {
  padding: 40px;
}

.carbon-pod__content--footer.carbon-pod__content--tile {
  border-bottom: 1px solid $border-color;
}

.carbon-pod__footer {
  background-color: $pod-footer;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  box-shadow: inset 0px 1px 1px 0 rgba(0, 0, 0, 0.1);
}

.carbon-pod__footer--padding-small {
  padding: 10px;
}

.carbon-pod__footer--padding-medium {
  padding: 10px 15px;
}

.carbon-pod__footer--padding-large {
  padding: 15px 25px;
}

.carbon-pod__footer--padding-extra-large {
  padding: 20px 40px;
}

.carbon-pod__header {
  margin-bottom: 15px;
}

.carbon-pod__header--true {
  margin-bottom: 0;
  cursor: pointer;
}

.carbon-pod__header--false {
  cursor: pointer;
}

.carbon-pod--center,
.carbon-pod__header--center {
  text-align: center;
}

.carbon-pod--right,
.carbon-pod__header--right {
  text-align: right;
}

.carbon-pod__title {
  background: none;
  color: $grey-dark;
  display: inline;
  font-size: 18px;
  font-weight: 600;
}

.carbon-pod__subtitle {
  margin-top: 8px;
  font-size: 14px;
  font-weight: normal;
}

.carbon-pod__description {
  background: none;
  margin-bottom: 10px;
  font-size: 13px;
}

.carbon-pod__arrow {
  display: inline-block;
  position: relative;
  top: -1px;
}

.carbon-pod__arrow--false {
  -ms-transform: rotate(180deg); /* IE 9 */
  -webkit-transform: rotate(180deg); /* Chrome, Safari, Opera */
  transform: rotate(180deg);
}

.carbon-pod--editable .carbon-pod__block {
  display: inline-block;
  max-width: calc(100% - 51px);

  &.carbon-pod__block--full-width {
    width: 100%;
  }

  &.carbon-pod__block--no-border {
    max-width: calc(100% - 47px);
  }

  &.carbon-pod__block--padding-small {
    max-width: calc(100% - 41px);

    &.carbon-pod__block--no-border {
      max-width: calc(100% - 37px);
    }
  }

  &.carbon-pod__block--padding-extra-small {
    max-width: calc(100% - 33px);

    &.carbon-pod__block--no-border {
      max-width: calc(100% - 29px);
    }
  }
}

.carbon-pod__content {
  text-align: left;
}

.carbon-pod--internal-edit-button {
  position: relative;

  &.carbon-pod--editable .carbon-pod__block {
    max-width: 100%;
    width: 100%;
  }

  .carbon-pod__edit-button-container {
    position: absolute;
    right: -1px;
    top: 1px;
    z-index: 10;
  }

  .carbon-pod__edit-action {
    border: none;
  }

  &.carbon-pod--is-hovered.carbon-pod--is-hovered {
    color: $grey-dark-blue;

    * {
      color: $grey-dark-blue;
    }

    .carbon-link__anchor {
      background-color: transparent;
      color: $blue;

      * {
        color: $blue;
      }
    }

    .carbon-pod__block {
      background-color: $white;
      &--secondary {
        background-color: $background-alt;
      }
      &--tertiary {
        background-color: $grey-dark-blue-10;
      }
      &--tile {
        background-color: transparent;
      }
      &--transparent {
        background-color: transparent;
      }
    }
  }
}