// /**
//  * Copyright © 2020 Kemana. All rights reserved.
//  * @author Ashan Gunawardena <agunawardena@kemana.com>
//  * http://www.kemana.com
//  */

//
//  Variables
//  _____________________________________________

@breadcrumb-back-button__icon: @icon-angel-prev;
@breadcrumb-back-button__font-size: 9px;
@breadcrumb-back-button__line-height: 10px;
@breadcrumb-back-button__color: @color-kemana-dark2;
@breadcrumb-back-button__margin: 0 6px 0 0;

//
//  Common
//  _____________________________________________

& when (@media-common = true) {
    .breadcrumbs {
        .lib-breadcrumbs();
        margin-bottom: 0;
        margin-top: 10px;

        .back-btn {
            .lib-icon-font(
                @breadcrumb-back-button__icon,
                @_icon-font-size: @breadcrumb-back-button__font-size,
                @_icon-font-line-height: @breadcrumb-back-button__line-height,
                @_icon-font-color: @breadcrumb-back-button__color,
                @_icon-font-color-hover: @breadcrumb-back-button__color,
                @_icon-font-color-active: @breadcrumb-back-button__color,
                @_icon-font-margin: @breadcrumb-back-button__margin,
                @_icon-font-position: before
            );

            &:after {
                content: '|';
                .lib-font-size(14);
                .lib-line-height(16);
                .lib-css(color, @color-kemana-gray1);
                margin: 2px 6px;
            }
        }
    }
}

//
//  Mobile
//  _____________________________________________

.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__m) {
    .breadcrumbs {
        .items {
            .back-btn {
                &:after {
                    display: none;
                }
            }

            .item {
                display: none;
            }
        }
    }
}

//
//  Desktop
//  _____________________________________________

.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
    .breadcrumbs {
        min-height: 20px;
        margin-bottom: 10px;
        margin-top: 15px;
    }
}