export const baseStyles = {
	".smartyAddress__base_default": {
		"--smartyAddress__wrapperPosition": "absolute",
		"--smartyAddress__hiddenDisplay": "none",
		"--smartyAddress__dropdownPosition": "relative",
		"--smartyAddress__cursorStyle": "pointer",
		"--smartyAddress__dropdownBoxSizing": "border-box",
		"--smartyAddress__dropdownZIndex": "1000",
		"--smartyAddress__dropdownFontWeight": "normal",
		"--smartyAddress__dropdownOverflowY": "auto",
		"--smartyAddress__suggestionDisplay": "flex",
		"--smartyAddress__suggestionJustifyContent": "space-between",
		"--smartyAddress__poweredByDisplay": "flex",
		"--smartyAddress__poweredByAlignItems": "center",
		"--smartyAddress__poweredByJustifyContent": "flex-end",
		"--smartyAddress__poweredByTextTransform": "uppercase",
		// TODO: Should the logo height be made independent from the "powered by" font-size?
		"--smartyAddress__poweredByLogoHeight": "2.2em",
		"--smartyAddress__suggestionWhitespace": "nowrap",
		"--smartyAddress__suggestionOverflow": "ellipsis",
		"--smartyAddress__suggestionOverflowX": "hidden",
		"--smartyAddress__entriesDisplay": "flex",
		"--smartyAddress__entriesAlignItems": "center",
		"--smartyAddress__chevronTransition": "transform 0.2s ease",
		"--smartyAddress__chevronRotation": "rotate(0deg)",
		"--smartyAddress__chevronRotationExpanded": "rotate(180deg)",
	},
};