/* Header Builder Common */
.site-header {
    position: relative;
    .customify-container {
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
}

.builder-item {
    .item--inner {
        display: inline-block;
        vertical-align: middle;
    }
    &.builder-item--group {
        .item--inner {
            margin-right: ($gl-gutter/2);
            @include for_device( tablet ) {
                margin-right: 1.0em;
            }
            @include for_device( mobile ) {
                margin-right: .4em;
            }
            &:last-child {
                margin-right: 0px;
            }
        }
    }
}

.header--row {
    .customify-grid {
    }
    &.layout-full-contained {
        .customify-container {
            background: transparent !important;
        }
    }
    &.layout-full-contained, &.layout-fullwidth {
        .customify-container {
            border: 0 none !important;
            box-shadow: none !important;
        }
    }
    @include for_device( desktop ){
        &.layout-contained {
            background: transparent !important;
            border: 0 none;
            box-shadow: none !important;
            .customify-container {
                margin-left: 1.5em;
                margin-right: 1.5em;
            }
        }
    }
    &.layout-fullwidth {
        .customify-container {
            max-width: initial;
            box-shadow: none !important;
        }
    }
}

// Titlebar
.page-titlebar {
    padding: 21px 0px 22px;
    border-bottom: 1px solid $color_border;
    word-break: break-all;
    @include for_device( tablet ) {
        padding: 19px 0px 20px;
    }
    @include for_device( mobile ) {
        padding: 18px 0px 20px;
    }
    .page-titlebar-inner {
        width: 100%;
    }
    .titlebar-title {
        margin-bottom: 0px;
    }
    .titlebar-tagline {
        margin-top: 5px;
        font-size: ms(-1);
    }
}

// Breadcrumbs
.page-breadcrumb {
    padding: 7px 0px 8px;
    font-size: 1em;
    border-bottom: 1px solid $color_border;
    color: $color_meta;
    .page-breadcrumb-inner {
        width: 100%;
    }
}
.page-breadcrumb-list {
    list-style: none;
    margin: 0px;
    padding: 0px;
    li {
        display: inline-block;
        position: relative;
        padding-right: 20px;
        font-size: 14px;
        &:after {
            font-family: fontawesome;
            content: "\f105";
            position: absolute;
            right: 5px;
        }
        &:last-child {
            &:after {
                display: none;
            }
        }
        a {
            color: $color_meta;
            font-weight: 500;
            &:hover {
                text-decoration: underline;
            }
        }
    }
}
.page-titlebar, .page-cover {

    .customize-partial-edit-shortcut button {
        left: 0px;
    }
    .page-breadcrumb-inner {
        padding-left: 0;
        padding-right: 0;
    }
    .page-breadcrumb {
        border-bottom: none;
        padding-bottom: 0px;
    }
}


// Header Cover
.page-cover {
    position: relative;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-position: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 200px;
    &:before {
        position: absolute;
        content: "";
        background-color: rgba( 0,0,0,.3 );
        top: 0px;
        left: 0px;
        width: 100%;
        height: 100%;
        display: block;
        z-index: 1;
    }
    .page-cover-inner {
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        z-index: 5;
    }
    .page-breadcrumb-list {
        color: rgba(255, 255, 255, .8);
        a, li:after {
            color: inherit;
        }
    }
}
.page-cover-title {
    margin-bottom: 0px;
}
.page-cover-tagline {
    margin-top: 1em;
}
.page-cover-title, .page-cover-tagline {
    display: inline-block;
    position: relative;
    color: rgba(255, 255, 255, .99);
    z-index: 5;
    p {
        &:last-child {
            margin-bottom: 0px;
        }
    }
}


/* Customizer Shortcut */
#masthead, #header-menu-sidebar {
    .customize-partial-edit-shortcut {
        display: none;
    }
}
#masthead{
    > .customize-partial-edit-shortcut {
        &.customize-partial-edit-shortcut-header_builder_panel {
            display: none;
        }
        button {
            left: 0px;
        }
    }
}