/**
 * Moodle file manager.
 *
 */

/* stylelint-disable declaration-no-important*/

.filemanager {
    font-family: $font-family-system;
    max-width: 40em;

    .dndupload-message {
        font-size: small;
    }

    // Hide :
    // pathbar (dir structure),
    // restrictions (max file size etc)
    .fp-pathbar,
    .fp-restrictions {
        display: none;
    }

    .fp-content {
        border: 2px dashed #bbb;
    }
}

// Make sure accepted file type information is on its own row and positioned nicely.
div[data-fieldtype=filemanager] > p:nth-of-type(1) {
    margin-top:1em;
    width: 100%;
}

// Make filenames more reabable.
.fp-filename {
    font-size: small;
    line-height: 1;
}
.fp-icon {
    margin-top: 0;
}

// Code below moved from other scss files.

.chooserdialogue .moodle-dialogue-wrap .moodle-dialogue-bd {
    background: $body-bg;
}

// Fix for file picker in Snap, not showing all the repositories.
.moodle-dialogue-base .moodle-dialogue.filepicker  {
    overflow: scroll;
}

.jschooser .choosercontainer #chooseform .alloptions {
    max-height: calc(100vh - 10rem) !important; // Overules JS caculated value.
}

.choosercontainer #chooseform {
    .moduletypetitle,
    .option,
    .nonoption {
        padding: 0 4%;
    }

    .option .icon {
        padding: 0 .5rem;
    }
}

.fitem_filepicker .fitemtitle label {
    margin-bottom: 0;
}

.felement.ffilepicker {
    margin-top: 0;
}

.filepicker-filelist,
.filemanager-container {
    border: none;
}

.filemanager .fp-navbar {
    background-color: transparent;
    border: none;
}

.filemanager-toolbar {
    padding: 0 0 8px;
}

.dndupload-arrow {
    cursor: pointer;
    background-image: url("[[pix:resource|icon]]");
    background-size: 60px 60px;
    margin-top: 10px;
}

.filepicker-filelist .filepicker-container,
.filemanager .filemanager-container .fm-empty-container,
.filemanager-container.dndupload-over .dndupload-target,
.filemanager-container .dndupload-target {
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    padding-top: 100px;
}

.filemanager-loading {
    border: 2px dashed #bbb;
    padding-top: 45px;
    min-height: 130px;
    background-color: $body-bg;
}

.jsenabled .filemanager-loading {
    margin-top: 0;
}