@import colors

$cancel-button-color = tomato

#post-upload
    form
        width: 100%
        max-width: 40em
        margin: 0 auto
        text-align: left

        &.inactive input[type=submit],
        &.inactive .skip-duplicates
        &.uploading input[type=submit],
        &.uploading .skip-duplicates,
        &:not(.uploading) .cancel
            display: none

    .dropper-container
        margin: 0 auto
        .file-dropper
            font-size: 150%
            padding: 2em

    input[type=submit]
        margin-top: 1em

    .cancel
        margin-top: 1em
        background: $cancel-button-color
        border-color: $cancel-button-color
        &:focus
            border: 2px solid $text-color

    .skip-duplicates
        margin-left: 1em

    .messages
        margin-top: 1em

    .uploadables-container
        list-style-type: none
        margin: 0
        padding: 0

        li
            margin: 0 0 1.2em 0

        .uploadable
            .file
                margin: 0.3em 0
                overflow: hidden
                white-space: nowrap
                text-align: left
                text-overflow: ellipsis

            .anonymous
                margin: 0.3em 0

            .safety
                margin: 0.3em 0
                label
                    display: inline-block
                    margin-right: 1em

            .options div
                display: inline-block
                margin: 0 1em 0 0

            .thumbnail-wrapper
                float: left
                width: 12.5em
                height: 7em
                margin: 0.2em 1em 0 0

                .thumbnail
                    width: 100%
                    height: 100%

            .controls
                float: right
                a
                    color: $inactive-link-color
                    margin-left: 0.5em

            div:last-child:after
                display: block
                content: ' '
                height: 1px
                clear: both