@use "../../01-core/external" as *;

$ss-dropzone-config: (
    padding: q(32) q(24),
    gap: q(8),
    border-width: q(2),
    border: var(--ss-color-border-strong),
    bg: var(--ss-color-surface-alt),
    fg: var(--ss-color-text-primary),
    hint-color: var(--ss-color-text-muted),
    hint-font-size: var(--ss-font-size-sm),
    hover-border: var(--ss-color-accent),
    active-border: var(--ss-color-accent),
    active-bg: var(--ss-color-accent-bg),
    invalid-border: var(--ss-color-error),
    invalid-bg: var(--ss-color-error-bg),
    duration: var(--ss-duration-150),
    disabled-opacity: 0.5,
    icon-size: q(32),
    // Upload arrow glyph, used as a mask so it takes the text colour.
    icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='square'%3E%3Cpath d='M12 16V4m-5 5 5-5 5 5M4 15v5h16v-5'/%3E%3C/svg%3E"),
) !default;