.uploader-container{max-width:1200px;margin:2em auto;padding:1em;border-radius:10px;background-color:var(--md-sys-color-surface-container);box-shadow:#00000059 0 5px 15px}.uploader-dropzone{border-radius:10px;padding:5em 1em;background-color:var(--md-sys-color-surface-container-highest);cursor:pointer;margin-bottom:1em;border:2px dashed var(--md-sys-color-outline);transition:all .2s ease}.dropzone-active{background:var(--md-sys-color-primary-container);border-color:var(--md-sys-color-primary)}.uploader-dropzone p{font-size:var(--font-size-h5);text-align:center;color:var(--md-sys-color-on-surface);font-weight:700}.uploader-toggles-container{display:flex;flex-direction:column;gap:1em}.uploader-input-text{display:flex;gap:1em;background-color:var(--md-sys-color-secondary);padding:.5em 1em;border-radius:10px;align-items:center}.uploader-input-text label{color:var(--md-sys-color-on-secondary)}.uploader-input-text input{border:none;background-color:var(--md-sys-color-on-secondary);border-radius:10px}#uploader-title-input input{width:100%}.uploader-submit-btn{display:block;padding:1em;width:50%;background-color:var(--md-sys-color-tertiary);border-radius:10px;margin:1em auto;font-size:var(--font-size-h6);color:var(--md-sys-color-on-tertiary)}.selected-files-container{border:none;border-radius:12px;padding:1em;display:grid;gap:1em;background:var(--md-sys-color-surface-container-low)}.file-item{display:flex;align-items:center;justify-content:space-between;background:var(--md-sys-color-surface-container);padding:.75em;border-radius:12px;transition:background-color .2s ease}.file-item:hover{background:var(--md-sys-color-surface-container-high)}.file-details{display:flex;align-items:center;gap:1em;min-width:0;flex:1}.file-preview{width:80px;height:80px;border-radius:8px;overflow:hidden;background:var(--md-sys-color-surface-container-highest)}.file-preview-image{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.file-info{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}.file-name{font-weight:500;color:var(--md-sys-color-on-surface);white-space:normal;overflow-wrap:anywhere;word-wrap:break-word;word-break:break-word}.file-size{color:var(--md-sys-color-on-surface-variant);font-size:.875rem}.remove-file-button{width:36px;height:36px;border-radius:18px;border:none;background-color:var(--md-sys-color-surface-container-highest);color:var(--md-sys-color-on-surface-variant);font-size:1.5rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;margin:0;padding:0 0 2.5px}.remove-file-button:hover{background-color:var(--md-sys-color-error-container);color:var(--md-sys-color-on-error-container);transform:scale(1.05)}.uploader-message{margin-bottom:1em;padding:1em;border-radius:8px;display:flex;justify-content:space-between;align-items:center;animation:slideIn .3s ease-out}@keyframes slideIn{0%{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}.uploader-message.error{background-color:var(--md-sys-color-error-container);color:var(--md-sys-color-on-error-container)}.uploader-message.success{background-color:#4caf50;color:#fff}.uploader-message p{margin:0;font-weight:500}.uploader-message a{color:inherit;text-decoration:underline;font-weight:700}.uploader-message a:hover{opacity:.8}.message-close-btn{background:none;border:none;color:inherit;font-size:1.5em;cursor:pointer;padding:0 .5em;opacity:.7;transition:opacity .2s ease}.message-close-btn:hover{opacity:1}.upload-progress-container{width:100%;height:4px;background-color:var(--md-sys-color-surface-container-highest);border-radius:2px;overflow:hidden;position:relative;margin-top:4px}.upload-progress-bar{height:100%;background-color:var(--md-sys-color-primary);transition:width .3s ease}.upload-progress-text{position:absolute;right:0;top:-18px;font-size:.75rem;color:var(--md-sys-color-on-surface-variant)}.file-item.uploading .remove-file-button{display:none}
