//
// Copyright IBM Corp. 2016, 2018
//
// This source code is licensed under the Apache-2.0 license found in the
// LICENSE file in the root directory of this source tree.
//

@import '../../globals/scss/vars';
@import '../../globals/scss/helper-mixins';
@import '../../globals/scss/vendor/@carbon/elements/scss/import-once/import-once';
@import '../../globals/scss/css--reset';
@import '../../globals/scss/css--typography';
@import '../../globals/scss/layer';

@mixin lightbox {
  @include deprecate(
    'The `lightbox` component in `carbon-components` has been deprecated. ' + 'It will be removed in the next major release.'
  ) {
    .#{$prefix}--lightbox {
      width: rem(1056px);
      @include layer('pop-out');
    }
    .#{$prefix}--lightbox__main {
      position: relative;
    }
    .#{$prefix}--lightbox__btn {
      border: 0;
      background: transparent;
      cursor: pointer;
      position: absolute;
      top: 50%;

      &:first-of-type {
        left: rem(-32px);
      }

      &:last-of-type {
        right: rem(-32px);
        transform: rotate(180deg);
      }

      &:focus {
        @include focus-outline;
      }

      svg {
        height: rem(24px);
        fill: $ui-05;
      }
    }
    .#{$prefix}--lightbox__item {
      display: none;
      width: 100%;
    }
    .#{$prefix}--lightbox__item--shown {
      display: block;
    }

    .#{$prefix}--lightbox__footer {
      background: $ui-01;
      overflow: hidden;
    }
  }
}

@include exports('lightbox') {
  @if not(feature-flag-enabled('breaking-changes-x')) {
    @include lightbox;
  }
}