/*** new element styles ***/

/* placeholder */
.dropzone .dz-placeholder {
    text-align: center;
    color: #888;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
}

/* inline buttons */
.dropzone .dz-inline-button {
    border: 1px solid rgba(0,0,0,0.15);
    border-radius: 10px;
    height: 80px;
    flex: 1;
    margin: 10px;
    box-sizing: border-box;
    padding: 5px;
    cursor: pointer;
    color: #555;
    font-size: 18px;
    text-align: center;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
    filter: drop-shadow(0 0 2px #fff);
}
.dropzone .dz-inline-button::before {
    font-size: 130px;
    line-height: 1;
    position: absolute;
    color: rgba(0,0,0,0.08);
}
.dropzone .dz-inline-button:hover, .dz-drag-hover .dz-add-buttons .dz-add-button.dz-file-button {
    border-width: 2px;
    padding: 4px;
    color: #333;
    background: rgba(0,0,0,0.01);
}
.dropzone .dz-inline-button:hover::before, .dz-drag-hover .dz-add-buttons .dz-add-button.dz-file-button::before {
    color: rgba(0,0,0,0.12);
}

/* add buttons */
.dropzone .dz-add-buttons {
    display: flex;
    margin: 10px;
}
.dz-max-files-reached .dz-add-buttons {
    display: none;
}
.dropzone .dz-add-button {
    margin: 0 0 0 10px;
}
.dropzone .dz-add-button:first-of-type {
    margin: 0;
}
.dropzone .dz-add-buttons .dz-add-button::before {
    content: '+';
}

/* download links */

.dropzone .dz-download-link, .dropzone .dz-download-link * {
    cursor: pointer;
}




/*** overriding dropzone styles ***/

/* default text */
.dropzone .dz-default {
    display: none;
}

/* dropzone box */
.dropzone {
    padding: 5px 10px 15px 10px;
    min-height: 129px;
    position: relative;
    user-select: none;
}
.dz-drag-hover.dropzone, .dz-drag-hover .dropzone {
    border-color: #0d71bb;
}
.dz-max-files-reached .dropzone.dz-clickable, .dropzone.dz-max-files-reached.dz-clickable {
    cursor: default;
}
.dropzone .dz-preview, .dropzone .dz-add-button, .dropzone .dz-inline-button {
    pointer-events: auto;
}


/* preview */
.dropzone .dz-preview {
    display: block;
    width: auto;
    background: #fff;
    border-radius: 10px;
    border: 1px solid #e8e8e8;
    margin: 10px;
    white-space: nowrap;
    height: 80px;
    min-height: auto;
}
.dropzone .dz-preview > * {
    z-index: 2;
}
.dropzone .dz-preview:hover {
    border-color: #bbb;
    z-index: inherit;
}
.dropzone .dz-preview .dz-details {
    text-align: left;
    margin-left: 80px;
    font-size: inherit;
    line-height: inherit;
    min-width: auto;
    max-width: none;
    width: auto;
    right: 65px;
    padding: 4px 0 4px 6px;
    display: flex;
    flex-direction: column;
    opacity: 1;
    z-index: 0;
}
.dropzone .dz-preview .dz-details .dz-filename {
    overflow: hidden;
    text-overflow: ellipsis;
    padding-left: 0;
    order: 1;
    margin-bottom: 7px;
}
.dropzone .dz-filename SPAN, .dropzone .dz-filename A {
    font-size: 16px;
    font-weight: bold;
    color: black;
}
.dropzone .dz-size {
    order: 2;
    padding-left: 10px;
}
.dropzone .dz-preview .dz-details .dz-filename span, .dropzone .dz-preview .dz-details .dz-size span {
    padding: 0;
}
.dropzone .dz-preview .dz-details .dz-filename:hover span, .dropzone .dz-preview .dz-details .dz-size:hover span {
    border-color: transparent;
}
.dropzone .dz-preview .dz-details .dz-filename span, .dropzone .dz-preview .dz-details .dz-size span, .dropzone .dz-preview .dz-details .dz-filename:hover span, .dropzone .dz-preview .dz-details .dz-size:hover span {
    background: none;
}

/* thumbnail */
.dropzone .dz-preview .dz-image {
    border-right: 1px solid #eee;
    z-index: 0;
    border-radius: 10px 0 0 10px;
    width: 78px;
    height: 78px;
    position: absolute;
}
.dropzone .dz-preview .dz-image IMG {
    width: 78px;
    height: 78px;
    object-fit: cover;
    object-position: left top;
}
.dropzone .dz-preview:hover .dz-image IMG {
    filter: none;
    transform: none;
}


/* remove button */
.dropzone .dz-preview .dz-remove {
    text-align: right;
    display: inline;
    bottom: 0;
    right: 22px;
    padding: 8px;
    position: absolute;
    font-size: 20px;
    border-radius: 10px;
    font-family: "FontAwesome";
    text-decoration: none;
    color: #777;
    background: #fff;
}
.dropzone .dz-preview .dz-remove:hover {
    text-decoration: none;
    color: #222;
}

/* error message */
.dropzone .dz-preview .dz-error-message {
    bottom: 0;
    top: auto;
    left: 80px;
    width: auto;
    opacity: 1;
    white-space: normal;
    z-index: 10;
}
.dropzone .dz-error-mark {
    z-index: 0;
}
.dropzone .dz-preview .dz-error-message:after {
    display: none;
}
.dropzone .dz-preview.dz-error {
    cursor: pointer;
}

/*# sourceMappingURL=/Volumes/Scratch/build/neon/releaseCustomTables/production/neon/WEB-INF/classes/com/pirionsystems/ne/sites/standard/skin/staticContent/style/form/v2/dropzone.local.css.map */
