.field {
    display: grid;
    grid-template-columns: minmax(10px, 1fr);
    grid-template-rows: [label] min-content [main] min-content [email-spellcheck] auto [hints] auto;
    margin-bottom: var(--spacing-4);
}

.field__label {
    color: #2e2e2e;
    font-size: var(--text-sm);
    grid-column: 1 / -1;
    grid-row: label;
    padding: var(--spacing-1);
    padding-top: 0;
}

.field__input {
    grid-column: 1 / -1;
    grid-row: main;
    margin-bottom: 0;
    width: 100%;
}

.field__hints {
    flex: 0 0 auto;
    grid-column: 1 / -1;
    grid-row: hints;
    position: relative;
    width: 100%;
}

    .field__hints :not(:first-child) {
        padding-top: 0;
    }
/*
.field.is-error [type="text"],
.field.is-error [type="email"],
.field.is-error [type="tel"],
.field.is-error [type="password"],
.field.is-error [type="search"],
.field.is-error [type="url"],
.field.is-error [type="number"],
.field.is-error [type="date"],
.field.is-error [type="time"],
.field.is-error [type="week"],
.field.is-error [type="month"],
.field.is-error [type="datetime"],
.field.is-error [type="datetime-local"],
.field.is-error [type="color"],
.field.is-error select,
.field.is-error textarea,
[type="text"].is-error,
[type="email"].is-error,
[type="tel"].is-error,
[type="password"].is-error,
[type="search"].is-error,
[type="url"].is-error,
[type="number"].is-error,
[type="date"].is-error,
[type="time"].is-error,
[type="week"].is-error,
[type="month"].is-error,
[type="datetime"].is-error,
[type="datetime-local"].is-error,
[type="color"].is-error,
select.is-error,
textarea.is-error {
    border-color: #fd5866;
}

    .field.is-error [type="text"]:hover:not([disabled]),
    .field.is-error [type="email"]:hover:not([disabled]),
    .field.is-error [type="tel"]:hover:not([disabled]),
    .field.is-error [type="password"]:hover:not([disabled]),
    .field.is-error [type="search"]:hover:not([disabled]),
    .field.is-error [type="url"]:hover:not([disabled]),
    .field.is-error [type="number"]:hover:not([disabled]),
    .field.is-error [type="date"]:hover:not([disabled]),
    .field.is-error [type="time"]:hover:not([disabled]),
    .field.is-error [type="week"]:hover:not([disabled]),
    .field.is-error [type="month"]:hover:not([disabled]),
    .field.is-error [type="datetime"]:hover:not([disabled]),
    .field.is-error [type="datetime-local"]:hover:not([disabled]),
    .field.is-error [type="color"]:hover:not([disabled]),
    .field.is-error select:hover:not([disabled]),
    .field.is-error textarea:hover:not([disabled]),
    [type="text"].is-error:hover:not([disabled]),
    [type="email"].is-error:hover:not([disabled]),
    [type="tel"].is-error:hover:not([disabled]),
    [type="password"].is-error:hover:not([disabled]),
    [type="search"].is-error:hover:not([disabled]),
    [type="url"].is-error:hover:not([disabled]),
    [type="number"].is-error:hover:not([disabled]),
    [type="date"].is-error:hover:not([disabled]),
    [type="time"].is-error:hover:not([disabled]),
    [type="week"].is-error:hover:not([disabled]),
    [type="month"].is-error:hover:not([disabled]),
    [type="datetime"].is-error:hover:not([disabled]),
    [type="datetime-local"].is-error:hover:not([disabled]),
    [type="color"].is-error:hover:not([disabled]),
    select.is-error:hover:not([disabled]),
    textarea.is-error:hover:not([disabled]) {
        background-color: #fff;
        border-color: #fda1a8;
    }

    .field.is-error [type="text"]:focus,
    .field.is-error [type="text"]:focus-visible,
    .field.is-error [type="email"]:focus,
    .field.is-error [type="email"]:focus-visible,
    .field.is-error [type="tel"]:focus,
    .field.is-error [type="tel"]:focus-visible,
    .field.is-error [type="password"]:focus,
    .field.is-error [type="password"]:focus-visible,
    .field.is-error [type="search"]:focus,
    .field.is-error [type="search"]:focus-visible,
    .field.is-error [type="url"]:focus,
    .field.is-error [type="url"]:focus-visible,
    .field.is-error [type="number"]:focus,
    .field.is-error [type="number"]:focus-visible,
    .field.is-error [type="date"]:focus,
    .field.is-error [type="date"]:focus-visible,
    .field.is-error [type="time"]:focus,
    .field.is-error [type="time"]:focus-visible,
    .field.is-error [type="week"]:focus,
    .field.is-error [type="week"]:focus-visible,
    .field.is-error [type="month"]:focus,
    .field.is-error [type="month"]:focus-visible,
    .field.is-error [type="datetime"]:focus,
    .field.is-error [type="datetime"]:focus-visible,
    .field.is-error [type="datetime-local"]:focus,
    .field.is-error [type="datetime-local"]:focus-visible,
    .field.is-error [type="color"]:focus,
    .field.is-error [type="color"]:focus-visible,
    .field.is-error select:focus,
    .field.is-error select:focus-visible,
    .field.is-error textarea:focus,
    .field.is-error textarea:focus-visible,
    [type="text"].is-error:focus,
    [type="text"].is-error:focus-visible,
    [type="email"].is-error:focus,
    [type="email"].is-error:focus-visible,
    [type="tel"].is-error:focus,
    [type="tel"].is-error:focus-visible,
    [type="password"].is-error:focus,
    [type="password"].is-error:focus-visible,
    [type="search"].is-error:focus,
    [type="search"].is-error:focus-visible,
    [type="url"].is-error:focus,
    [type="url"].is-error:focus-visible,
    [type="number"].is-error:focus,
    [type="number"].is-error:focus-visible,
    [type="date"].is-error:focus,
    [type="date"].is-error:focus-visible,
    [type="time"].is-error:focus,
    [type="time"].is-error:focus-visible,
    [type="week"].is-error:focus,
    [type="week"].is-error:focus-visible,
    [type="month"].is-error:focus,
    [type="month"].is-error:focus-visible,
    [type="datetime"].is-error:focus,
    [type="datetime"].is-error:focus-visible,
    [type="datetime-local"].is-error:focus,
    [type="datetime-local"].is-error:focus-visible,
    [type="color"].is-error:focus,
    [type="color"].is-error:focus-visible,
    select.is-error:focus,
    select.is-error:focus-visible,
    textarea.is-error:focus,
    textarea.is-error:focus-visible {
        border-color: #fda1a8;
    }*/




.is-error .wt-signature-wrap,
.is-error input,
.is-error select,
.is-error textarea {
    border-color: #fd5866;
}

.error-msg,
.warning-msg,
.info-msg {
    display: block;
    width: 100%;
    margin-bottom: 0;
    padding: var(--spacing-1) var(--spacing-2);
    font-size: var(--text-xs);
    font-weight: var(--font-weight-normal);
    line-height: 1.1;
}

.error-msg {
    color: #e00618;
}

.warning-msg {
    color: #5f3811;
    padding-left: 2.25em;
    position: relative;
}

    .warning-msg::before {
        background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%23ebbb2d' d='M4.8 421c-6.7 12.4-6.4 27.4.8 39.5S25.9 480 40 480h432c14.1 0 27.1-7.4 34.4-19.5s7.5-27.1.8-39.5l-216-400c-7-12.9-20.5-21-35.2-21s-28.2 8.1-35.2 21zM288 384a32 32 0 1 1-64 0 32 32 0 1 1 64 0m-63.4-190.3c-1.3-18.2 13.1-33.7 31.4-33.7s32.7 15.5 31.4 33.7l-7.4 104c-1 12.6-11.4 22.3-24 22.3s-23-9.7-23.9-22.3l-7.4-104z' opacity='.8'/%3E%3Cpath fill='%233d260f' d='M256 416a32 32 0 1 1 0-64 32 32 0 1 1 0 64m0-256c18.3 0 32.7 15.5 31.4 33.7l-7.4 104c-1 12.6-11.4 22.3-24 22.3s-23-9.7-23.9-22.3l-7.4-104c-1.4-18.2 13-33.7 31.3-33.7'/%3E%3C/svg%3E");
        background-size: contain;
        content: "";
        height: 1.4em;
        left: 0.25em;
        position: absolute;
        top: 0.1em;
        width: 1.4em;
    }

.info-msg {
    color: #595959;
}