@import "~scss/variables";

$sw-media-add-thumbnail-form-lock-color-default: $color-darkgray-200;
$sw-media-add-thumbnail-form-lock-color-locked: $color-shopware-brand-500;

.sw-media-add-thumbnail-form {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-column-gap: 20px;
    margin: 4px 0 16px;

    .sw-media-add-thumbnail-form__form-container {
        display: grid;
        grid-template-columns: 1fr 30px 1fr;
        align-items: end;

        .sw-field {
            margin-bottom: 0;
        }

        input {
            height: 32px;
        }

        .sw-media-add-thumbnail-form__lock {
            height: 32px;
            background: none;
            border: none;
            color: $sw-media-add-thumbnail-form-lock-color-default;
            outline: none;
            cursor: pointer;

            &.is--locked {
                color: $sw-media-add-thumbnail-form-lock-color-locked;
            }
        }
    }

    .sw-button {
        height: 32px;
        margin-top: 24px;
        padding: 0 16px;

        .sw-button__content {
            height: 24px;
            line-height: 0;
        }
    }
}
