input.disabled, input[disabled], select.disabled, select[disabled], textarea.disabled, textarea[disabled] {
        --tw-text-opacity: 1;
        color: rgb(84 59 59 / var(--tw-text-opacity, 1));
        opacity: 0.6;
}

        input[aria-invalid], input.has-error, select[aria-invalid], select.has-error, textarea[aria-invalid], textarea.has-error {
        --tw-border-opacity: 1;
        border-color: rgb(177 25 35 / var(--tw-border-opacity, 1));
        --tw-text-opacity: 1;
        color: rgb(60 42 42 / var(--tw-text-opacity, 1));
}

        input[aria-invalid]::placeholder, input.has-error::placeholder, select[aria-invalid]::placeholder, select.has-error::placeholder, textarea[aria-invalid]::placeholder, textarea.has-error::placeholder {
        --tw-placeholder-opacity: 1;
        color: rgb(60 42 42 / var(--tw-placeholder-opacity, 1));
}

        input[aria-invalid]:focus, input.has-error:focus, select[aria-invalid]:focus, select.has-error:focus, textarea[aria-invalid]:focus, textarea.has-error:focus {
        --tw-border-opacity: 1;
        border-color: rgb(177 25 35 / var(--tw-border-opacity, 1));
        outline: 2px solid transparent;
        outline-offset: 2px;
        --tw-ring-opacity: 1;
        --tw-ring-color: rgb(177 25 35 / var(--tw-ring-opacity, 1));
}

    select.form-multiselect {
        height: auto;
        min-height: 0px;
        background-image: none;
}

    textarea, .form-textarea {
        min-height: 100px;
        line-height: 1.625;
}

    input[name="qty"] {
        width: 70px;
}

    fieldset .field, form .field {
        margin-top: 1rem;
        margin-bottom: 1rem;
}

    form fieldset label {
        margin-bottom: 0.25rem;
}

    .required label:after,
    label.required:after {
        margin-left: 0.125rem;
        --tw-text-opacity: 1;
        color: rgb(177 25 35 / var(--tw-text-opacity, 1));
        content: '*';
}

    input[type="checkbox"] {
        height: 20px;
        width: 20px;
        min-width: 20px;
}

    input[type="checkbox"], input[type="radio"] {
        appearance: none;
        --tw-text-opacity: 1;
        color: rgb(255 255 255 / var(--tw-text-opacity, 1));
        --tw-bg-opacity: 1;
        background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
        background-repeat: no-repeat;
        cursor: pointer;
        border-width: 1px;
        --tw-border-opacity: 1;
        border-color: rgb(210 200 176 / var(--tw-border-opacity, 1));
}

    input[type="checkbox"]:focus, input[type="radio"]:focus {
        outline: 2px solid transparent;
        outline-offset: 2px;
        --tw-border-opacity: 1;
        border-color: rgb(84 59 59 / var(--tw-border-opacity, 1));
        --tw-bg-opacity: 1;
        background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}

    input[type="checkbox"]:hover, input[type="radio"]:hover {
        --tw-bg-opacity: 1;
        background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
        --tw-border-opacity: 1;
        border-color: rgb(197 168 128 / var(--tw-border-opacity, 1));
}

    input[type="checkbox"], input[type="radio"] {
        flex-shrink: 0;
        height: 1.5rem;
        width: 1.5rem;
        padding: 0px;
}

        input[type="checkbox"].disabled, input[type="checkbox"][disabled], input[type="radio"].disabled, input[type="radio"][disabled] {
        --tw-text-opacity: 1;
        color: rgb(84 59 59 / var(--tw-text-opacity, 1));
        opacity: 0.6;
}

    input[type="checkbox"] {
        border-radius: calc(var(--border-radius-input) / 2);
    }

    input[type="checkbox"]:checked {
        --tw-border-opacity: 1;
        border-color: rgb(84 59 59 / var(--tw-border-opacity, 1));
        --tw-bg-opacity: 1;
        background-color: rgb(127 29 29 / var(--tw-bg-opacity, 1));
        --tw-text-opacity: 1;
        color: rgb(154 78 71 / var(--tw-text-opacity, 1));
        background-image: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="%23ffffff" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m5 13 4 4L19 7"/></svg>');
        background-size: 16px;
        background-position: center;
}

    input[type="radio"] {
        border-radius: 9999px;
}

    input[type="radio"]:checked {
        --tw-border-opacity: 1;
        border-color: rgb(84 59 59 / var(--tw-border-opacity, 1));
        background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='%23333333' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='8' cy='8' r='3'/%3e%3c/svg%3e");
        background-position: center;
}
        input[type="checkbox"] ~ label, input[type="radio"] ~ label {
        margin-top: -2px;
        margin-left: 1rem;
        cursor: pointer;
}

    form legend {
        font-weight: 500;
}

    form .field.choice {
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        gap: 1rem;
}

        @media (min-width: 768px) {

        form .field.choice + .field.choice {
                margin-top: -0.25rem;
        }
}
            form .field.choice input[type="checkbox"] ~ label, form .field.choice input[type="radio"] ~ label {
        margin: 0px;
}

    .field .messages {
        margin-top: 0.25rem;
        font-size: 0.875rem;
        --tw-text-opacity: 1;
        color: rgb(177 25 35 / var(--tw-text-opacity, 1));
}
    input::placeholder, select::placeholder, textarea::placeholder {
        font-size: 0px;
}

/*@import "../styles/styleguide/forms-critical.css";*/

input[name="qty"] {
        width: 4rem;
}