// Copyright (C) YOOtheme GmbH, YOOtheme Proprietary Use License (http://www.yootheme.com/license) */

//
// Component: Off-canvas
//
// ========================================================================


// Variables
// ========================================================================

@offcanvas-z-index:                             @global-z-index;
@offcanvas-background:                          fade(@global-secondary-background, 50%);

@offcanvas-bar-width:                           280px;
@offcanvas-bar-background:                      darken(@global-secondary-background, 3%);

@offcanvas-panel-color:                         fade(@global-muted-color, 70%);
@offcanvas-panel-title-color:                   @global-contrast-color;
@offcanvas-panel-link-color:                    @global-link-color;
@offcanvas-panel-link-hover-color:              @global-link-hover-color;

//
// New
//

@offcanvas-after-background:                    rgba(0,0,0,0.15);
@offcanvas-after-shadow:                        rgba(0,0,0,0.15);


// Component
// ========================================================================

.hook-offcanvas() {}


// Sub-object `uk-offcanvas-bar`
// ========================================================================

.hook-offcanvas-bar() {}


// Panel in offcanvas
// ========================================================================

.hook-offcanvas-panel() {}


// Miscellaneous
// ========================================================================

.hook-offcanvas-misc() {

    .uk-offcanvas-bar:after {
        content: "";
        display: block;
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        width: 1px;
        background: @offcanvas-after-background;
        box-shadow: 0 0 5px 2px @offcanvas-after-shadow;
    }

    .uk-offcanvas-bar-flip:after {
        right: auto;
        left: 0;
        width: 1px;
        background: @offcanvas-after-background;
        box-shadow: 0 0 5px 2px @offcanvas-after-shadow;
    }

}
