@import "../../../style/mixin.scss";

@include export-module('co-image-enhancer-theme') {
  .co-image-enhancer {
    .image-enhancer-container {
      .header {
        .header-icon-container {
          margin-bottom: 10px;
          h2 {
            font-size: var(--co-inphoto-font-size-head);
            color: var(--co-inphoto-color-dark);
          }
        }
      }

      .tabs {
        background: var(--co-inphoto-tab-background-color);
        border-radius: 5px;

        .tab-button {
          border-radius: 5px;
          background: var(--co-inphoto-tab-background-color);
          color: var(--co-inphoto-color-dark);
          font-size: var(--co-inphoto-tab-header-font-size);
          border: 2px solid var(--co-inphoto-tab-border-color);

          &:hover {
            background: var(--co-inphoto-tab-active-background-color);
          }

          &.active {
            background: var(--co-inphoto-tab-active-background-color);
            color: var(--co-inphoto-tab-active-color);
          }
        }
      }
    }
  }
}

