/*  COMPONENT: NEWSLETTER
//////////////////////////////////////////////////////////////////////////////*/

@layer components {
    .cr_form .editable_content {
        display: grid;
        grid-template-columns: 1fr min-content;
        gap: var(--size-grid-gap);
        place-items: end stretch;
    }
    .cr_ipe_item {
        grid-column: 1 /-1;
        grid-row: 1;
    }
    .cr_form-component--email {
        grid-column: 1 /-1;
        grid-row: 2;
        display: grid;
    }
    .cr_form-inputgroup--typeemail {
        display: grid;
        grid-template-columns: max-content 1fr;
        gap: var(--size-grid-gap);
        place-items: center start;
    }
    .cr_form-component--email label {
        display: block;
        smargin-bottom: var(--spacing-s);
    }
    .cr_form-component--submit {
        grid-column: 2;
        grid-row: 2;
    }
    .cr_form-input {
        outline: none;
        border: 2px solid var(--color-grey-500);
        border-radius: 2rem;
        padding-left: var(--spacing-m);
    }
    .cr_form-input:focus {
        border-color: var(--color-red);
    }
    .cr_button {
        border: 2px solid var(--color-red);
        outline: none;
        padding: 0.5rem 1rem;
        height: 46px;
    }
    .cr_button:hover {
        border: 2px solid var(--color-red-600);
    }
}