:global {
  @hmi-carousel-prefix: hmi-carousel;
  @hmi-board-prefix   : hmi-board;

  .@{hmi-carousel-prefix} {
    width  : 100%;
    height : 100%;
    padding: 4px;

    .@{hmi-board-prefix} {
      padding: 0;
    }

    .ant-carousel,
    .ant-carousel .slick-slider,
    .ant-carousel .slick-slider .slick-list,
    .ant-carousel .slick-slider .slick-track,
    .ant-carousel .slick-initialized .slick-slide>div {
      height: 100%;
    }

    .ant-carousel .slick-dots {
      height: 4px;
    }

    .ant-carousel .slick-dots-bottom {
      bottom: 6px;
    }

    .ant-carousel .slick-dots li button {
      height    : 4px;
      background: #5195f7;
    }
  }

  .@{hmi-board-prefix} {
    width   : 100%;
    height  : 100%;
    padding : 4px;
    position: relative;

    &__card {
      height: 100%;
    }

    &__iframe {
      width : 100%;
      height: ~'calc(100% - 16px)';
      border: none;
    }

    &__fullscreen {
      position: absolute;
      top     : 7px;
      right   : 7px;
      cursor  : pointer;
    }
  }
}