/*---------- FORMULÄRET -------------*/
.wm-archive-form {padding-bottom: 6vh;}
#wm-title {display: block; width: 100%;}
#wm-note {height: 20vh; width: 100%;}
#wm-archive-btn:hover {background: white;}

/*---------- UPPLADDNING -------------*/
.approved {display: flex; flex-direction: column; align-items: center; padding: 8px; border-radius: 4px;}
.approved img {height: 26px;}

.wm-file-input {display: flex; flex-direction: column; border: 2px dashed #ccc; border-radius: 4px; padding: 20px; min-height: 100px;}
.approved-icons {display: flex; flex-direction: row; justify-content: space-between; padding-top: 40px;}


.wm-archive-form .bkg-dark {display: flex; justify-content: center; padding: 10px;}




/*---------- ARKIVET -------------*/
#wm-archive-list {border: 1px solid #ccc;}
.wm-archive-item {border-bottom: 1px solid #ccc; display: flex; align-items: center; padding: 2px 6px;}

.archive-icon {align-items: center; display: flex; margin-right: 24px;}
.archive-icon svg {width: 25px; height: 32px;}

.wm-item-date, .wm-item-time {font-size: 11px;}
.wm-item-date {margin-right: 10px;}
.wm-item-title {display: block; font-size: 20px; line-height: 22px;}

.date-name {flex: 1;}

.wm-delete-btn {flex: 0 0 auto;}


.archive-icon:hover, .date-name:hover, .wm-delete-btn:hover {cursor: pointer;}




/*---------- OVERLAY -------------*/
.wm-overlay {position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.7); display: flex; justify-content: center; align-items: center;
max-width: unset!important; z-index: 9999;}

.wm-overlay-content {background: white; color: black; max-width: 850px; border-radius: 6px; width: 94%; overflow-y: auto; max-height: 90%; height: auto;}


.wm-overlay-header {position: fixed; width: 94%; max-width: 850px; background: #e7ebf1; padding: 20px; box-sizing: border-box; border-top-left-radius: 6px; border-top-right-radius: 6px;}

.wm-overlay-header .wm-header-top, .wm-overlay-header .wm-header-middle {display: flex; flex-direction: row; justify-content: space-between;}


.wm-overlay-content img {width: 100%;}
.wm-overlay-content.wide {max-width: 90%;}
.wm-note-content {margin-top: 80px; white-space: pre-wrap; padding: 20px;}