.srif-form {
	margin: auto;
	margin-top: 20px;
}

.srif-form--newsletter {
    max-width: 850px;
}


/* =====================================================================
   LABEL
   ===================================================================== */
 
   .srif-form__label {
        margin-left: 15px;
        font-size: 14px;
        font-weight: 500;
        color: var(--color-navy-blue);
    }

    .srif-form__label--hidden {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        white-space: nowrap;
    }


/* =====================================================================
   MESSAGE
   ===================================================================== */

    .srif-form__message {
        margin: 12px 0;
        font-size: 1rem;
        font-weight: 600;
        text-align: start;
    }

    .srif-form__message--success {
        color: #5EC6C6;
        font-weight: 600; 
    }

    .srif-form__message--error   { 
        color: #F28B82;
        font-weight: 600; 
    }
    
/* =====================================================================
   INPUT
   ===================================================================== */

    .srif-form__input {
        display: block;
        width: 100%;
        padding: .75rem 1.25rem;
        font-size: 15px;
        line-height: 1.4;
        color: var(--color-navy-blue);
        background-color: var(--color-white);
        border: 1px solid var(--color-gray);
        border-radius: 8px;
        outline: none;
        appearance: none;
        transition: border-color .15s ease, box-shadow .15s ease;
    }

    .srif-form__input::placeholder {
        color: var(--srif-input-placeholder);
        opacity: 1;
    }

    .srif-form__input:hover,
    .srif-form__input:focus {
        border-color: var(--color-turquoise);
    }

    .srif-form__input:focus {
        box-shadow: 0 0 0 3px rgba(85, 184, 196, .25);
    }

    .srif-form__input:disabled {
        background-color: var(--color-surface);
        cursor: not-allowed;
    }

    /* MODIFIERS */
   
    .srif-form__input--rounded {
        border-radius: 25px;
    }

    .srif-form__input--wide {
        width: 100%;
	    height: 40px;
	    border: 0;
	    border-radius: 25px;
	    font-size: 12px;
	    padding-left: 20px;
    }


/* =====================================================================
   TEXTAREA
   ===================================================================== */

    .srif-form__textarea {
        min-height: 13rem;
        resize: vertical;
    }


/* =====================================================================
   SELECT
   ===================================================================== */

    .srif-form--select {
        padding-right: 3rem;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23999' stroke-width='2'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: right 1.25rem center;
        cursor: pointer;
    }


/* =====================================================================
   OPTION
   ===================================================================== */

    .srif-form__option {
        color: var(--color-navy-blue);
        background-color: var(--color-white);
    }

    .srif-form__option:checked {
        color: var(--color-white);
        background-color: var(--color-turquoise);
    }


/* =====================================================================
   FILEINPUT
   ===================================================================== */
    
    .srif-form__fileinput {
        display: flex;
        align-items: center;
        padding: 0;
        overflow: hidden;
        border-radius: 25px;

    }

    .srif-form__fileinput::file-selector-button {
        height: 55px;
        padding: 0 25px;
        margin-right: 1rem;
        font-size: 16px;
        color: var(--color-dark-gray);
        background-color: var(--color-gray);
        border: none;
        cursor: pointer;
        transition: background-color .2s ease;
    }

    .srif-form--fileinput::file-selector-button:hover {
        background-color: var(--color-surface);
    }


/* =====================================================================
   CONSENT
   ===================================================================== */

    .srif-form__consent {
	    margin-top: 10px;
	    padding-left: 10px;
	    font-size: 11.5px;
	    color: var(--color-navy-blue);
	    text-align: left;
    }

    .srif-form__consent--white {
	    color: var(--color-white);
    }


/* =====================================================================
   CHECKBOX
   ===================================================================== */

       .srif-form__checkbox {
	    accent-color: var(--color-turquoise);
	    width: 14px;
	    height: 14px;
	    margin-right: 5px;
    }


/* =====================================================================
   FOOTNOTE
   ===================================================================== */

    .srif-form__footnote {
        font-size: 12px;
        font-weight: 500;
        color: var(--color-dark-gray);
    }
