// /**
//  * Copyright © Magento, Inc. All rights reserved.
//  * See COPYING.txt for license details.
//  */

//
//  Common
//  _____________________________________________

& when (@media-common = true) {
    .block-event {
        .columns & {
            position: relative;
            z-index: 2;
        }

        .block-content {
            position: relative;

            >  .action {
                cursor: pointer;
                margin-top: -6px;
                position: absolute;
                top: 50%;
                z-index: 3;

                &.backward,
                &.forward {
                    opacity: .5;
                    overflow: hidden;
                    width: 20px;

                    .lib-icon-font(
                        @_icon-font-content: @icon-prev,
                        @_icon-font-text-hide: true,
                        @_icon-font-size: 55px,
                        @_icon-font-line-height: 30px
                    );

                    &:before {
                        margin-left: -15px;
                    }
                }

                &.backward {
                    left: 0;
                }

                &.forward {
                    .lib-icon-font-symbol(@icon-next);
                    right: 0;

                    &:before {
                        margin-left: -20px;
                    }
                }

                &.inactive {
                    cursor: default;
                    display: none;
                }

                &:hover {
                    opacity: 1;
                }
            }
        }

        .slider-panel {
            overflow: hidden;
            position: relative;
            z-index: 2;

            .slider {
                &:extend(.abs-reset-list all);
                white-space: nowrap;

                .item {
                    .lib-css(background, @catalog-event-background-color);
                    display: inline-block;
                    text-align: center;
                    vertical-align: top;
                    white-space: normal;
                    width: 16.35%;

                    .sidebar-main &,
                    .sidebar-additional & {
                        width: 100%;
                    }

                    img {
                        max-width: 100%;
                    }

                    .category-name {
                        display: inline-block;
                        .lib-font-size(18);
                        padding: 15px 5px 0;
                        word-break: break-all;
                    }

                    .ticker {
                        .lib-list-reset-styles();

                        li {
                            display: none;
                            margin: 0 5px;
                        }

                        .value {
                            .lib-font-size(26);
                            font-weight: @font-weight__light;
                        }

                        .label {
                            display: block;
                            .lib-font-size(13);
                        }
                    }

                    .dates {
                        font-weight: @font-weight__light;

                        .start,
                        .end,
                        .date {
                            display: block;
                        }

                        .start {
                            &:after {
                                .lib-font-size(18);
                                content: '\2013';
                                display: block;
                            }
                        }

                        .date {
                            .lib-font-size(18);
                            font-weight: @font-weight__light;
                        }

                        .time {
                            .lib-font-size(13);
                        }
                    }

                    .box-event {
                        .box-content {
                            padding: 5px 0 @indent__s;
                        }

                        .box-title {
                            display: block;
                            font-weight: @font-weight__light;
                            margin: @indent__s 0 0;
                        }
                    }

                    .action {
                        &.show {
                            &:extend(.abs-add-box-sizing all);
                            display: block;
                            padding: 0;

                            .category.name {
                                display: inline-block;
                                padding: 30px 10px 0;
                            }

                            img {
                                display: block;
                            }
                        }

                        &.event {
                            .lib-button-primary();
                            &:extend(.abs-action-link-button all);
                            margin-top: 15px;

                            &:hover {
                                text-decoration: none;
                            }
                        }
                    }
                }
            }
        }
    }
}