.image-uploader{display:flex;flex-direction:column;gap:12px;width:100%}.image-uploader__preview{display:flex;justify-content:center;padding:12px;background-color:#f9fafb;border-radius:8px}.image-uploader__preview img{box-shadow:0 1px 3px #0000001a;animation:fadeIn .3s ease-in}.image-uploader__drop-zone{transition:all .3s ease;position:relative}.image-uploader__drop-zone.drag-over{background-color:#eff6ff!important;border-color:#7239ea!important;box-shadow:0 0 0 3px #7239ea1a}.image-uploader__drop-zone p{line-height:1.5}.image-uploader__button{transition:all .3s ease;font-weight:600}.image-uploader__button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.image-uploader__button:active:not(:disabled){transform:translateY(0)}.image-uploader__button:disabled{opacity:.6;cursor:not-allowed}.image-uploader__progress,.image-uploader__success,.image-uploader__error{animation:slideIn .3s ease}.image-uploader__error button{padding:0;margin-left:8px;font-size:16px;line-height:1}.image-uploader__error button:hover{opacity:.7}.image-uploader__delete-button{transition:all .3s ease}.image-uploader__delete-button:hover{background-color:#fecaca}@keyframes fadeIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes slideIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@media(max-width:640px){.image-uploader{gap:10px}.image-uploader__drop-zone{padding:16px!important}.image-uploader__drop-zone p{font-size:12px}.image-uploader__button{padding:8px 12px!important;font-size:13px}}