/*Misc. Styles*/

.playlists-container {
    height: 100%;
}

#PlaylistsService--place-holder {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}

/* ========================================================================= \\
    $Playlists
\\ ========================================================================= */
.playlists-container .playlists-content-wrapper {
    height: 100%;
    overflow-y: scroll;
    overflow-x: hidden;
    padding-right: 2.95em;
    padding-bottom: 4em;
    padding-left: 1.75em;
}

.playlists-content .lgfe-card-matrix--layout-row .lgfe-cm-keywords {
    display: block;
}

/* - - - - - - - - - - - - - - - - - - - - - - - \\
    $No-Content
\\ - - - - - - - - - - - - - - - - - - - - - - - */

.playlists-container .playlists-no-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #6c6f70;
    font-style: italic;
    font-weight: 700;
}

.playlists-container .pnc-link {
    color: #009fdf;
    text-decoration: underline;
}

/* --------------------------------------------- \\
        $Utility-Bar
    \\ --------------------------------------------- */

.playlists-container .pm-utility-bar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-right: auto;
    margin-left: auto;
    padding: 0em 3.75em 2em 1.75em;
    width: 100%;
}

/* --------------------------------------------- \\
                $Search
            \\ --------------------------------------------- */

.playlists-container .pmub-playlist-search {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.playlists-container .pmubs-field {
    position: relative;
    /*flex: 1;*/
    padding-right: 0.7em;
}

.playlists-container .pmub-playlist-search-wrap::before {
    content: "\f002"; /** fa-search **/
    width: 1em;
    height: 1.2em;
    margin-top: auto;
    margin-bottom: auto;
    font-family: "FontAwesome";
    font-size: 1.25em;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0.8em;
}

.playlists-container .pmubs-field .lgfe-input-text {
    max-width: 25em;
    padding: 0.6em 0.8em 0.6em 3.25em;
    font-size: 1em;
}
.playlists-container .pmubs-field .lgfe-select select {
    padding: 0.8em 43px 0.8em 0.9em;
}

.playlists-container
    .pmubs-field
    .lgfe-select:not(.lgfe-select--multiple)::after {
    margin-top: 14px;
    top: 0px;
}

/* --------------------------------------------- \\
                $Layout-Type
            \\ --------------------------------------------- */

.playlists-container .pmub-layout-type {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.playlists-container .pmublt-field:first-child {
    margin-left: 1.5em;
}

.playlists-container .pmublt-field:not(:last-child) {
    margin-right: 1.5em;
}

.playlists-container .pmubltf-display-button {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    outline: 0;
    width: 2.25em;
    height: 2.25em;
    cursor: pointer;
}

.playlists-container .pmubltf-display-button .fa {
    font-size: 1.75em;
}

.playlists-container
    .pmubltf-display-type-input:checked
    + .pmubltf-display-button {
    color: #47c7fa;
}

.playlists-container .lgfe-cm-keyword-item,
.lgfe-cm-tag-item {
    padding-right: 2px;
}

.playlists-container .lgfe-cm-keyword-item .lgfe-cm-keyword-item-edit {
    color: #54a41d;
}

/* Header */

.playlists-container .layout-row-header .layout-row-header-column-left {
    width: 55%;
}

.playlists-container .layout-row-header .layout-row-header-column-right {
    width: 45%;
}

/*Row View*/

.playlists-container
    .lgfe-card-matrix--layout-row
    .lgfe-cm-information
    .lgfe-cm-playlist-column-left {
    width: 55%;
}

.playlists-container
    .lgfe-card-matrix--layout-row
    .lgfe-cm-information
    .lgfe-cm-playlist-column-right {
    width: 45%;
}

.playlists-content .lgfe-card-matrix--layout-row .lgfe-cm-duration {
    position: relative;
    margin: 3px 0px 3px 3px;
    width: 7em;
    height: 7em;
}

.playlists-container
    .playlists-content
    .lgfe-card-matrix--layout-row
    .lgfe-cm-name {
    width: 100%;
    margin-bottom: 0.2em;
    margin-top: 0.4em;
}

.playlists-container .lgfe-card-matrix--layout-row .lgfe-cm-details {
    width: 100%;
    padding-left: 15px;
    min-width: 0;
}

.playlists-content .lgfe-card-matrix--layout-row .lgfe-cm-utilities {
    padding-right: 1em;
    padding-left: 1em;
}

/*Grid View*/

.playlists-content-wrapper
    .lgfe-card-matrix--layout-grid
    .lgfe-cm-playlist-column-left {
    height: 70%;
}

.playlists-content-wrapper
    .lgfe-card-matrix--layout-grid
    .lgfe-cm-playlist-column-right {
    height: 30%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
}

.playlists-container .lgfe-card-matrix--layout-grid .lgfe-cm-duration {
    top: 0;
    left: 0;
    position: relative;
}

.playlists-container .lgfe-card-matrix--layout-grid .description-tag-item {
    padding: 0.2em 0.5em;
}

.playlists-container .lgfe-card-matrix--layout-grid .lgfe-cm-information {
    height: 100%;
}

.playlists-content-wrapper
    .lgfe-card-matrix--layout-grid
    .lgfe-cm-utilities
    .lgfe-cm-utility-row
    .lgfe-button {
    display: none;
}

.playlists-content-wrapper
    .lgfe-card-matrix--layout-grid
    .lgfe-cm-playlist-column-right
    .lgfe-cm-playlist-column.lgfe-cm-playlist-column-modified {
    display: none;
}

.lgfe-card-matrix--layout-grid
    .lgfe-cm-playlist-column-right
    .lgfe-cm-playlist-column
    .lgfe-cm-playlist-column-day {
    margin-right: 5px;
}

.playlists-container .lgfe-card-matrix--layout-grid .lgfe-cm-keywords {
    max-width: initial;
    height: 4.2728em;
    padding-top: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    font-weight: 700;
}

/*Full grid view*/

.playlists-container
    .lgfe-card-matrix.lgfe-card-matrix--layout-full
    .lgfe-cm-information {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.playlists-container .lgfe-card-matrix--layout-full .lgfe-cm-description,
.playlists-container .lgfe-card-matrix--layout-full .lgfe-cm-keywords,
.playlists-container .lgfe-card-matrix--layout-full .lgfe-cm-spacer,
.playlists-container .lgfe-card-matrix--layout-full .lgfe-cm-keyword-label {
    display: none;
}

.playlists-container .lgfe-card-matrix--layout-full .lgfe-cm-details {
    display: block;
    top: 0;
    position: absolute;
    left: 0;
    width: 100%;
}

.playlists-container .lgfe-card-matrix--layout-full .lgfe-cm-name {
    padding-left: 4px;
    padding-right: 35px;
    white-space: nowrap;
    width: 100%;
    font-size: 0.875em;
    margin-bottom: 0px;
    overflow: hidden;
    position: absolute;
    font-weight: 600;
    color: #fff;
    margin-top: 11px;
    text-align: center;
}

.playlists-container .lgfe-card-matrix--layout-full .lgfe-cm-duration {
    height: 100%;
    top: 0;
    left: 0;
    width: calc(100% - 38px);
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin: 0px 0px 0px 3px;
}

.playlists-container .lgfe-card-matrix--layout-full .lgfe-cm-duration:before {
    font-size: 2.5em;
    margin-bottom: 2px;
    margin-top: 17px;
}

.playlists-container
    .lgfe-card-matrix--layout-full
    .lgfe-cm-utilities
    .lgfe-button {
    display: none;
}

.playlists-container
    .lgfe-card-matrix--layout-full
    .lgfe-cm-duration-time-unit {
    font-size: 0.875em;
}

.pmmub-playlist-search .pmmubs-field {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    vertical-align: middle;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.playlists-container .amubas-field {
    padding-right: 0;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
}

.amubas-field-inner {
    position: relative;
    padding-right: 0;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
}

.pmub-playlist-search .pmmubs-field {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    vertical-align: middle;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    width: 100%;
}

.pmmubs-field .pmmubs-field-filter-row {
    font-size: 0.8em;
    margin-bottom: 0.3em;
    color: #6c6f70;
}

.pmmubs-field-filter-row span.pmmubs-field-filter-row-title {
    font-weight: 700;
}

.amubas-field .amubas-field-filter-options {
    position: absolute;
    z-index: 3;
    background-color: #fff;
    border: 1px solid #d0d0d0;
    padding: 1em;
    top: 44px;
    width: 230px;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.09);
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.09);
}

.amubas-field-filter-field .content-checkbox--left {
    font-size: 0.75em;
    cursor: pointer;
}

.amubas-field-filter-field .content-checkbox--left:hover span {
    background-color: #ccc;
}

.amubas-field-filter-field .content-checkbox--left span {
    margin-right: 5px;
}

/*Media queries*/

@media (max-width: 55em) {
    .playlists-container .pmub-playlist-search {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }
    .playlists-container .amubas-field {
        padding-top: 1em;
        padding-left: 0;
    }
    .playlists-container .pm-utility-bar {
        padding-bottom: 1em;
    }
}

@media (max-width: 41.875em) {
    /** 670px **/
    .playlists-container .playlists-content-wrapper {
        padding-right: 0em;
        padding-left: 0em;
    }
    .playlists-container .pm-utility-bar {
        margin-bottom: 0.9375em;
        padding-right: 0.9375em;
        padding-left: 0.9375em;
    }
    .playlists-container .playlists-content {
        padding-right: 0.9375em;
        padding-left: 0.9375em;
    }
    .playlists-container .pm-function-bar {
        margin-bottom: 0.9375em;
    }
    .playlists-container .pmfb-container {
        padding-right: 0.9375em;
        padding-left: 0.9375em;
    }
    .playlists-container .pmubs-field {
        padding-right: 0.3em;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
}

@media (max-width: 60.625em) {
    /** 970px **/
    .playlists-container .pmublt-field:not(:last-child) {
        margin-right: 1.5em;
        margin-left: 1.5em;
    }
    .playlists-container .pmub-layout-type {
        margin: 0;
    }
    .playlists-container .pmublt-row-layout {
        display: none;
    }
    .playlists-container .pmfb-container {
        padding-left: 1.75em;
    }

    .playlists-container .pmubs-field .lgfe-input-text {
        max-width: none;
    }
}

.select-max-display-for-playlists {
    width: 100%;
}
