@mixin sc-image-viewer-theme($theme) {
    $primary: map-get($theme, primary);
    $warn: map-get($theme, warn);
    $success: map-get($theme, success);
    $foreground: map-get($theme, foreground);
    $background: map-get($theme, background);
    $is-dark-theme: map-get($theme, is-dark);

    $image-viewer-backdrop: if($is-dark-theme, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.90));

    .image-viewer__backdrop.cdk-overlay-backdrop.cdk-overlay-backdrop-showing {
      background: $image-viewer-backdrop;
    }

    .lightbox {
      &__nav-prev,
      &__nav-next,
      &__nav-close,
      &__description {
        color: rgba(255, 255, 255, 0.8) !important;
      }

      &__description {
        &-text {
          border-color: rgba(#ffffff, 0.3) !important;
          // background-color: #212121;
        }

        &-textarea {
          .mat-form-field-appearance-outline .mat-form-field-outline {
            color: rgba(255, 255, 255, 0.3) !important;
          }

          .mat-form-field.mat-focused {
            color: rgba(255, 255, 255, 1) !important;
          }

          .mat-form-field-flex:hover {
            .mat-form-field-outline-start,
            .mat-form-field-outline-gap,
            .mat-form-field-outline-end {
              border-color: white;
            }
          }
        }
      }

      &__disabled-button {
        background-color: #424242 !important;
        color: rgba(255, 255, 255, 0.3) !important;
      }
    }
  }