:root {
    --c2-ui-field-bg: #e0e0e0;
    --c2-ui-field-border: #f7814a;
    --c2-ui-field-focus-bg: #ffffff;
    --c2-ui-field-focus-border: #7a7a7a;
    --c2-ui-field-text: #0f172a;
}

html:not(.dark) body input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="range"]):not([type="hidden"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="image"]),
html:not(.dark) body select,
html:not(.dark) body textarea {
    background-color: var(--c2-ui-field-bg) !important;
    border-color: var(--c2-ui-field-border) !important;
    color: var(--c2-ui-field-text) !important;
    transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
}

html:not(.dark) body input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="range"]):not([type="hidden"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="image"]):focus,
html:not(.dark) body select:focus,
html:not(.dark) body textarea:focus {
    background-color: var(--c2-ui-field-focus-bg) !important;
    border-color: var(--c2-ui-field-focus-border) !important;
    --tw-ring-color: rgba(122, 122, 122, .22) !important;
    box-shadow: 0 0 0 3px rgba(122, 122, 122, .18) !important;
    outline: none;
}

html:not(.dark) body input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="range"]):not([type="hidden"]):not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="image"]):disabled,
html:not(.dark) body select:disabled,
html:not(.dark) body textarea:disabled {
    background-color: #ededed !important;
    border-color: #a3a3a3 !important;
    color: #64748b !important;
    cursor: not-allowed;
}

html:not(.dark) body input:-webkit-autofill,
html:not(.dark) body input:-webkit-autofill:hover {
    -webkit-text-fill-color: var(--c2-ui-field-text) !important;
    -webkit-box-shadow: 0 0 0 1000px var(--c2-ui-field-bg) inset !important;
    border-color: var(--c2-ui-field-border) !important;
    caret-color: var(--c2-ui-field-text);
}

html:not(.dark) body input:-webkit-autofill:focus {
    -webkit-text-fill-color: var(--c2-ui-field-text) !important;
    -webkit-box-shadow: 0 0 0 1000px var(--c2-ui-field-focus-bg) inset, 0 0 0 3px rgba(122, 122, 122, .18) !important;
    border-color: var(--c2-ui-field-focus-border) !important;
}

html:not(.dark) body input:autofill {
    background-color: var(--c2-ui-field-bg) !important;
    border-color: var(--c2-ui-field-border) !important;
}

html:not(.dark) body input:autofill:focus {
    background-color: var(--c2-ui-field-focus-bg) !important;
    border-color: var(--c2-ui-field-focus-border) !important;
}