.loading-content .empty-folder-msg{
display:none;
}
.empty-folder-container{
grid-column:1/-1;
width:100%;
display:flex;
justify-content:center;
}
.empty-folder-area{
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
padding:var(--gx1);
width:100%;
margin:0 auto;
border:2.4px dashed #282828;
border-radius:var(--br1);
transition:border-color 0.2s ease,background-color 0.2s ease,transform 0.2s ease;
}
.empty-folder-area.drag-hover{
border-color:var(--ac1);
background-color:rgba(255,193,7,0.12);
transform:scale(1.01);
}
.empty-folder-area.drag-hover .drop-icon svg{
fill:var(--ac1);
}
.empty-folder-area.drag-hover .empty-folder-text{
color:var(--ac1);
}
.empty-folder-area.trash-empty{
border-style:solid;
border-color:transparent;
background-color:transparent;
pointer-events:none;
user-select:none;
}
.empty-folder-area.trash-empty:hover{
border-color:#444;
background-color:rgba(0,0,0,0.3);
}
.drop-icon{
opacity:0.7;
pointer-events:none;
width:80px;
height:80px;
transition:opacity 0.2s ease;
}
.drag-hover .drop-icon{
opacity:1;
}
.drop-icon svg{
width:100%;
height:100%;
fill:#282828;
pointer-events:none;
transition:fill 0.2s ease;
}
.trash-empty .drop-icon svg{
fill:#ff5722;
}
.empty-folder-text{
text-align:center;
margin-bottom:20px;
line-height:1.62;
color:#aaa;
font-weight:300;
pointer-events:none;
font-size:20px;
transition:color 0.2s ease;
}
.trash-empty .empty-folder-text{
color:#ccc;
margin-bottom:0;
}
.empty-folder-upload-btn{
background-color:var(--ac1);
color:#000;
border:none;
border-radius:var(--br0);
font-weight:500;
display:flex;
align-items:center;
gap:8px;
pointer-events:auto;
padding:12px 24px;
font-size:16px;
}
.empty-folder-upload-btn:hover{
background-color:var(--ac2);
}
.empty-folder-upload-btn svg{
width:20px;
height:20px;
}
.clip.placeholder{
pointer-events:none;
z-index:10;
position:relative;
min-height:var(--ch1);
height:var(--ch1);
border-radius:var(--br1);
overflow:hidden;
background-color:#1a1a1a;
border:2px solid #333;
}
.clip.placeholder.uploading{
background-color:#1c1c1c;
border-color:var(--ac1);
}
.clip-vid.placeholder.uploading{
border-color:#9c27b0;
}
.clip-pdf.placeholder.uploading{
border-color:#e53935;
}
.clip-office.placeholder.uploading,
.clip-office-word.placeholder.uploading{
border-color:#2b579a;
}
.clip-office-excel.placeholder.uploading{
border-color:#217346;
}
.clip-office-powerpoint.placeholder.uploading{
border-color:#b7472a;
}
.upload-indicator{
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
height:100%;
width:100%;
gap:12px;
}
.upload-spinner-wrap{
width:40px;
height:40px;
display:flex;
align-items:center;
justify-content:center;
}
.upload-spinner{
width:40px;
height:40px;
display:flex;
align-items:center;
justify-content:center;
animation:spin 1s linear infinite;
}
.upload-spinner svg{
width:100%;
height:100%;
}
.upload-spinner circle{
fill:none;
stroke:var(--ac1);
stroke-width:3;
stroke-linecap:round;
stroke-dasharray:31.4 126;
transform-origin:center;
}
.clip-vid .upload-spinner circle{
stroke:#9c27b0;
}
.clip-pdf .upload-spinner circle{
stroke:#e53935;
}
.clip-office .upload-spinner circle,
.clip-office-word .upload-spinner circle{
stroke:#2b579a;
}
.clip-office-excel .upload-spinner circle{
stroke:#217346;
}
.clip-office-powerpoint .upload-spinner circle{
stroke:#b7472a;
}
@keyframes spin{
from{transform:rotate(0deg);}
to{transform:rotate(360deg);}
}
.upload-text{
color:#888;
font-size:13px;
font-weight:500;
text-align:center;
}