/*! ratio-ui · design system for knowledge sharing · https://github.com/losol/ratio-ui · (c) 2026 Losol AS · MPL-2.0 */
//#region src/forms/styles/formStyles.ts
var textStyles = {
	comboBoxInput: "text-(--text)",
	dropdownButton: "text-(--text-subtle) hover:text-(--text)",
	listBoxItemPrimary: "",
	listBoxItemSecondary: "",
	errorText: "text-error-text text-sm mt-1",
	validationText: "text-success-text text-sm mt-1",
	helperText: "text-(--text-muted) text-xs mt-1",
	emptyStateText: "text-(--text-subtle) italic",
	focusedText: "text-(--primary)",
	selectedText: "text-(--text-on-primary)",
	disabledText: "text-(--text-subtle)"
};
var interactionStyles = {
	listBoxItemHover: "hover:bg-card-hover",
	buttonHover: "hover:bg-card-hover",
	listBoxItemFocused: "data-[focused]:bg-primary-100 dark:data-[focused]:bg-primary-900",
	inputFocused: "focus-within:ring-2 focus-within:ring-(--focus-ring)",
	listBoxItemSelected: "data-[selected]:bg-(--primary) data-[selected]:text-(--text-on-primary)",
	disabled: "opacity-50 cursor-not-allowed",
	transition: "transition duration-150 ease-in-out"
};
var layoutStyles = {
	flexCenter: "flex items-center justify-center",
	flexBetween: "flex items-center justify-between",
	flexStart: "flex items-center",
	flexColumn: "flex flex-col",
	gapSm: "gap-1",
	gapMd: "gap-2",
	gapLg: "gap-4",
	paddingSm: "px-2 py-1",
	paddingMd: "px-3 py-2",
	paddingLg: "px-4 py-3",
	widthFull: "w-full",
	widthAuto: "w-auto",
	flexShrink: "flex-shrink-0",
	flexGrow: "flex-1",
	relative: "relative",
	absolute: "absolute",
	zIndex: "z-50"
};
var componentStyles = {
	integratedComboBoxContainer: `w-32 border-border-1 bg-card ${layoutStyles.flexShrink}`,
	comboBoxInputWrapper: `${layoutStyles.flexStart}`,
	comboBoxInputField: `${layoutStyles.widthFull} text-center px-2 py-2 bg-transparent ${textStyles.comboBoxInput}`,
	popover: `w-40 max-h-56 overflow-y-auto border border-border-1 rounded-lg bg-card shadow-lg ${layoutStyles.zIndex}`,
	listBoxItem: `px-3 py-2 ${layoutStyles.flexStart} ${layoutStyles.gapMd} cursor-pointer ${interactionStyles.listBoxItemHover} ${interactionStyles.listBoxItemFocused} ${interactionStyles.listBoxItemSelected}`,
	phoneInputContainer: `bg-card flex items-stretch ${layoutStyles.flexStart} ${layoutStyles.widthFull} overflow-hidden border-2 border-border-1 ${interactionStyles.inputFocused} ${interactionStyles.transition}`
};
var formStyles = {
	defaultInputStyle: `
        appearance-none
        ${layoutStyles.widthFull}
        ${textStyles.comboBoxInput}
        p-4
        rounded-lg
        bg-card
        border-2
        border-border-1
        leading-tight
        focus:outline-hidden
        focus:ring-2
        focus:ring-(--focus-ring)`,
	lightInputStyle: `
        appearance-none
        ${layoutStyles.widthFull}
        p-4
        rounded-lg
        bg-card
        text-(--text)
        border-2
        border-border-2
        focus:outline-hidden
        focus:ring-2
        focus:ring-(--focus-ring)`,
	inputDescription: `${textStyles.comboBoxInput} text-sm mb-2`,
	inputErrorGlow: "border border-error-border ring-2 ring-error-border",
	inputWrapper: "mb-3",
	textarea: "resize-y"
};
//#endregion
export { componentStyles, formStyles, interactionStyles, layoutStyles, textStyles };

//# sourceMappingURL=formStyles.js.map