#create-wish-list-dialog {
    --horizontal-padding: 12px;
    --vertical-padding: 8px;
    --border-radius: 6px;
    border: none;
    padding: 0;

    h2 {
        --outline-color: black;
        color: white;
        width: 100%;
        background-image: var(--light-blue-gradient);
        border: var(--light-blue-gradient-border);
        margin: 0;
        padding: var(--vertical-padding) var(--horizontal-padding);
        border-radius: var(--border-radius) var(--border-radius) 0 0;
        text-shadow: 
            var(--outline-color) 0px 0px 1px,
            var(--outline-color) 0px 0px 1px,
            var(--outline-color) 0px 0px 1px,
            var(--outline-color) 0px 0px 1px;
    }

    form {
        display: grid;
        grid-template-columns: min-content 1fr;
        gap: var(--vertical-padding) 6px;
        border: 1px solid var(--medium-grey);
        border-top: none;
        border-radius: 0 0 var(--border-radius) var(--border-radius);
        padding: calc(var(--vertical-padding) + 4px) var(--horizontal-padding);

        label {
            white-space: nowrap;
            color: black;
        }

        .controls {
            display: flex;
            gap: 6px;
            grid-column: 1 / -1;

            input[type="submit"] {
                color: #ffc;
            }

            .cancel {
                color: var(--brand-blue);
                background-color: buttonface;
                font-size: 1rem;
                letter-spacing: 0.02rem;
            }
        }

        p,
        .response {
            grid-column: 1 / -1;
        }
    }

    @media (max-width: 600px) {
        form {
            grid-template-columns: 1fr;
        }
    }
}