import {StyleSheet} from 'react-native';
import {INPUT_COLORS, INPUT_SPACING} from '@components/constants';
import {componentStyles} from '@components/styles';

export const styles = StyleSheet.create({
  container: {
    ...componentStyles.inputContainerBase,
    minHeight: INPUT_SPACING.containerHeight,
    paddingHorizontal: INPUT_SPACING.paddingHorizontal,
    paddingVertical: INPUT_SPACING.commonSpacing,
  },
  inputContainer: {
    alignItems: 'center',
    flexDirection: 'row',
    gap: 4,
    justifyContent: 'space-between',
    paddingHorizontal: INPUT_SPACING.paddingHorizontal,
    paddingVertical: INPUT_SPACING.commonSpacing,
  },
  innerLabel: {
    marginHorizontal: INPUT_SPACING.paddingHorizontal,
    position: 'absolute',
    textAlignVertical: 'bottom',
    zIndex: -1,
  },
  error: {borderColor: INPUT_COLORS.error},
  labelLeft: {left: 28},
  input: {
    alignItems: 'center',
    flexDirection: 'row',
    gap: 4,
    justifyContent: 'space-between',
  },
});
