@layer components {
    div.setup-checklist {
        margin-bottom: var(--space-xl);
        padding: var(--space-xl) var(--space-xl);

        & h2 {
            font-family: var(--font--title--family--large);
            font-size: var(--font--title--size--large);
            font-weight: var(--font--title--weight--large);
            line-height: var(--font--title--line-height--large);
            letter-spacing: var(--font--title--letter-spacing--large);
            text-transform: var(--font--title--casing--large);
        }

        & p {
            font-family: "Just Saying";
            font-size: 2rem;
            font-weight: 400;
            line-height: 1.15;
            letter-spacing: 0;
        }

        & .inline-field {
            & input:disabled:checked {
                background-color: var(--color--brand--highlight);
            }

            & label {
                font-family: var(--font--title--family--xsmall);
                font-size: var(--font--title--size--xsmall);
                font-weight: var(--font--title--weight--xsmall);
                line-height: var(--font--title--line-height--xsmall);
                letter-spacing: var(--font--title--letter-spacing--xsmall);
                text-transform: var(--font--title--casing--xsmall);
            }
        }
    }
}