/* File manager application css */
/*------------------------------*/
.section
{
    position: relative;

    overflow: hidden;

    margin: 2rem 0;
    padding: 0;

    border: 1px solid #e0e0e0;
    border-radius: 4px;
    background: #fff;
    /* Content area overlay */
    /* sidebar left */
    /*-------------*/
    /*App file sidebar info (right sidebar)*/
    /*------------------------------------*/
    /* Content right */
    /*--------------*/
}

.section .app-file-overlay
{
    position: absolute;
    z-index: 7;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;

    visibility: hidden;

    opacity: 0;
    border-radius: 4px;
}

.section .app-file-overlay.show
{
    visibility: visible;

    -webkit-transition: all .3s ease;
            transition: all .3s ease;

    opacity: 1;
    background-color: rgba(0, 0, 0, .2);
}

.section i
{
    font-size: 22px;

    cursor: pointer;
    vertical-align: middle;
}

.section .app-file-label
{
    font-size: .8rem;
    font-weight: 900;

    margin-right: 3px;

    text-transform: uppercase;

    color: #bdbdbd;
}

.section .sidebar-toggle
{
    display: none;

    padding-top: .55rem;
}

.section .sidebar-left
{
    position: relative;

    float: right;

    width: 260px;
    padding: 1rem;
}

.section .sidebar-left .app-file-sidebar .app-file-sidebar-left
{
    width: 100%;
}

.section .sidebar-left .app-file-sidebar .app-file-sidebar-left .app-file-sidebar-close
{
    position: absolute;
    top: 2px;
    left: 5px;
}

.section .sidebar-left .app-file-sidebar .app-file-sidebar-left .app-file-sidebar-close i
{
    font-size: 1.3rem;
}

.section .sidebar-left .app-file-sidebar .app-file-sidebar-left .getfileInput
{
    overflow: hidden;

    width: 0;
    height: 0;
}

.section .sidebar-left .app-file-sidebar .app-file-sidebar-left .file-manager-drive
{
    margin: 1rem 0;

    border: none;
}

.section .sidebar-left .app-file-sidebar .app-file-sidebar-left .file-manager-drive .file-item-action
{
    padding: 10px 0;

    color: #6b6f82;
    border-bottom: none;
}

.section .sidebar-left .app-file-sidebar .app-file-sidebar-left .file-manager-drive .file-item-action.active
{
    color: #3f51b5;
    background: transparent;
}

.section .sidebar-left .app-file-sidebar .app-file-sidebar-left .file-manager-drive .file-item-action .chip
{
    line-height: 22px;

    height: 22px;
    padding: 0 8px;

    border-radius: 50%;
}

.section .sidebar-left .storage-icon
{
    position: relative;
    top: 5px;
}

.section .app-file-sidebar-info
{
    position: absolute;
    z-index: 8;
    top: -1px;
    left: 32px;

    width: 357px;
    height: 100%;

    -webkit-transition: all .3s ease;
            transition: all .3s ease;
    -webkit-transform: translateX(-110%);
        -ms-transform: translateX(-110%);
            transform: translateX(-110%);

    opacity: 0;
    border-radius: .25rem 0 0 .25rem;
    box-shadow: 8px 0 18px 0 rgba(25, 42, 70, .13);
}

.section .app-file-sidebar-info.show
{
    -webkit-transform: translateX(-9%) translateY(1px);
        -ms-transform: translateX(-9%) translateY(1px);
            transform: translateX(-9%) translateY(1px);

    opacity: 1;
    background-color: #fff;
}

.section .app-file-sidebar-info .card-header
{
    padding: 1rem 1.6rem;

    border-bottom: 1px solid #e0e0e0;
}

.section .content-right
{
    float: left;

    width: calc(100% - 260px);
}

.section .content-right .app-file-area
{
    border-right: 1px solid #e0e0e0;
}

.section .content-right .app-file-area .app-file-header
{
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display:         flex;

    padding: .2rem 1rem;

    border-bottom: 1px solid #e0e0e0;
}

.section .content-right .app-file-area .app-file-header .app-file-header-search
{
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -ms-flex-positive: 1;
            flex-grow: 1;
}

.section .content-right .app-file-area .app-file-header .app-file-header-search .input-field .prefix
{
    font-size: 1.6rem;

    top: .7rem;
}

.section .content-right .app-file-area .app-file-header .app-file-header-search input
{
    margin-right: 2.5rem;
    margin-bottom: 0;

    border-bottom: none;
    box-shadow: none;
}

.section .content-right .app-file-area .app-file-header .app-file-header-icons .fonticon-wrap
{
    margin-right: .7rem;
}

.section .content-right .app-file-area .app-file-content
{
    padding: 1.6rem;
}

.section .content-right .app-file-area .app-file-content .app-file-recent-access .card,
.section .content-right .app-file-area .app-file-content .app-file-files .card,
.section .content-right .app-file-area .app-file-content .app-file-folder .card
{
    margin-top: .5rem;

    border: 1px solid #e0e0e0;
    border-radius: 4px;
}

.section .content-right .app-file-area .app-file-content .app-file-recent-access .card .app-file-content-logo,
.section .content-right .app-file-area .app-file-content .app-file-files .card .app-file-content-logo,
.section .content-right .app-file-area .app-file-content .app-file-folder .card .app-file-content-logo
{
    overflow: hidden;

    margin-bottom: .5rem;

    cursor: pointer;

    border-radius: 4px;
}

.section .content-right .app-file-area .app-file-content .app-file-recent-access .card .recent-file,
.section .content-right .app-file-area .app-file-content .app-file-files .card .recent-file,
.section .content-right .app-file-area .app-file-content .app-file-folder .card .recent-file
{
    display: block;

    margin: 25px auto;
}

.section .content-right .app-file-area .app-file-content .app-file-recent-access .card .app-file-name,
.section .content-right .app-file-area .app-file-content .app-file-recent-access .card .app-file-size,
.section .content-right .app-file-area .app-file-content .app-file-recent-access .card .app-file-last-access,
.section .content-right .app-file-area .app-file-content .app-file-files .card .app-file-name,
.section .content-right .app-file-area .app-file-content .app-file-files .card .app-file-size,
.section .content-right .app-file-area .app-file-content .app-file-files .card .app-file-last-access,
.section .content-right .app-file-area .app-file-content .app-file-folder .card .app-file-name,
.section .content-right .app-file-area .app-file-content .app-file-folder .card .app-file-size,
.section .content-right .app-file-area .app-file-content .app-file-folder .card .app-file-last-access
{
    font-size: .9rem;

    margin-top: .3rem;

    word-break: break-all;
}

.section .content-right .app-file-area .app-file-content .app-file-recent-access .card .fonticon,
.section .content-right .app-file-area .app-file-content .app-file-files .card .fonticon,
.section .content-right .app-file-area .app-file-content .app-file-folder .card .fonticon
{
    position: absolute;
    left: 5px;
}

.section .content-right .app-file-area .app-file-content .app-file-recent-access .card .app-file-folder-name,
.section .content-right .app-file-area .app-file-content .app-file-recent-access .card .app-file-folder-size,
.section .content-right .app-file-area .app-file-content .app-file-files .card .app-file-folder-name,
.section .content-right .app-file-area .app-file-content .app-file-files .card .app-file-folder-size,
.section .content-right .app-file-area .app-file-content .app-file-folder .card .app-file-folder-name,
.section .content-right .app-file-area .app-file-content .app-file-folder .card .app-file-folder-size
{
    font-size: .9rem;
}

.section .content-right .app-file-area .app-file-content .app-file-recent-access .card .card-content,
.section .content-right .app-file-area .app-file-content .app-file-files .card .card-content,
.section .content-right .app-file-area .app-file-content .app-file-folder .card .card-content
{
    padding: .5rem;
}

@media (max-width: 992px)
{
    .sidebar-left
    {
        position: absolute !important;
        z-index: 8;
        right: -34px;

        width: 260px !important;
        height: 100% !important;

        -webkit-transition: -webkit-transform .25s;
                transition: -webkit-transform .25s;
                transition:         transform .25s;
                transition:         transform .25s, -webkit-transform .25s;
        -webkit-transform: translateX(110%);
            -ms-transform: translateX(110%);
                transform: translateX(110%);

        background-color: #fff;
    }
    .sidebar-left.show
    {
        -webkit-transform: translateX(-13%) translateY(-1px);
            -ms-transform: translateX(-13%) translateY(-1px);
                transform: translateX(-13%) translateY(-1px);
    }
    .content-right
    {
        width: 100% !important;
    }
    .content-right .app-file-area
    {
        border-right: none !important;
    }
}

@media (max-width: 600px)
{
    .app-file-manager-wrapper .sidebar-left .app-file-sidebar .add-new-file
    {
        padding-top: 1rem;
    }
}

@media (max-width: 450px)
{
    .app-file-sidebar-info
    {
        width: 300px !important;
    }
    .app-file-sidebar-info.show
    {
        -webkit-transform: translateX(-11%) translateY(1px) !important;
            -ms-transform: translateX(-11%) translateY(1px) !important;
                transform: translateX(-11%) translateY(1px) !important;
    }
}