/* Documentenmap popup of the groepenscherm: laid over the group form like Opmerkingen, so the
   group stays where it was while the documents are moved. The dialog sticks to the top of the
   scrolled modal, because the Map button that opens it sits in the footer, far down the form. */
.organisation-documents-overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 10;
    background: rgba(0, 0, 0, 0.35);
    padding: 15px;
}

.organisation-documents-dialog {
    position: sticky;
    top: 15px;
    max-height: calc(100vh - 90px);
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: 4px;
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.3);
}

.organisation-documents-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 15px;
    border-bottom: 1px solid #e5e5e5;
}

.organisation-documents-body {
    display: flex;
    gap: 15px;
    flex: 1 1 auto;
    min-height: 0;
    padding: 15px;
}

.organisation-documents-pane {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
}

.organisation-documents-dropbox {
    flex: 3 1 0;
}

.organisation-documents-server {
    flex: 2 1 0;
}

.organisation-documents-pane-title {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 10px;
    margin-bottom: 5px;
}

.organisation-documents-select-all {
    font-weight: normal;
    margin: 0;
}

.organisation-documents-breadcrumb {
    margin-bottom: 8px;
    padding: 6px 10px;
}

/* Each pane scrolls on its own; the dialog itself keeps its height. */
.organisation-documents-list {
    flex: 1 1 auto;
    min-height: 160px;
    overflow-y: auto;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.organisation-documents-row {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 8px;
    border-bottom: 1px solid #f0f0f0;
}

.organisation-documents-row:last-child {
    border-bottom: 0;
}

.organisation-documents-row.is-folder {
    cursor: pointer;
}

.organisation-documents-row.is-folder:hover {
    background: #f5f5f5;
}

.organisation-documents-row input[type="checkbox"] {
    margin: 0;
}

.organisation-documents-name {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.organisation-documents-size,
.organisation-documents-date {
    flex: 0 0 auto;
    color: #777;
    font-size: 0.9em;
    white-space: nowrap;
}

.organisation-documents-notice {
    margin: 5px 0 0;
    min-height: 1.5em;
}

.organisation-documents-footer {
    padding: 10px 15px;
    border-top: 1px solid #e5e5e5;
}

.organisation-documents-conflict {
    margin-bottom: 10px;
}

.organisation-documents-conflict-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 8px;
}

.organisation-documents-progress {
    margin-bottom: 8px;
}

.organisation-documents-progress .progress {
    margin-bottom: 5px;
}

/* The log grows with every file; it scrolls rather than pushing the buttons off screen. */
.organisation-documents-log {
    max-height: 110px;
    overflow-y: auto;
    margin-bottom: 8px;
    font-size: 0.9em;
}

.organisation-documents-log .is-error {
    color: #a94442;
}

.organisation-documents-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 5px;
}
