import { StyleSheet } from "react-native";

export const defaultStyles = StyleSheet.create({
  container: { 
    flex: 1, 
    padding: 24, 
    marginVertical: 4,
    marginHorizontal: 4,
  },
  buttonContainer: {
    flexDirection: "row",
    gap: 8,
    justifyContent: "center",
    marginHorizontal: 4,
    marginVertical: 4,
  },
  title: {
    fontSize: 24,
    fontWeight: '700',
    textAlign: 'center',
    marginVertical: 4,
    marginHorizontal: 4,
  },
  subtitle: {
    fontSize: 20,
    fontWeight: '600',
    textAlign: 'center',
    marginVertical: 4,
    marginHorizontal: 4,
  },
  body: {
    fontSize: 16,
    fontWeight: '400',
    textAlign: 'left',
    marginVertical: 4,
    marginHorizontal: 4,
  },
  separator: {
    height: 1,
    backgroundColor: '#000000',
    marginVertical: 4,
    marginHorizontal: 4,
  },
  circularButton: {
    width: 40,
    height: 40,
    borderRadius: 20,
    alignItems: 'center',
    justifyContent: 'center',
    marginVertical: 4,
    marginHorizontal: 4,
  },
  linkText: {
    color: "blue",
    textDecorationLine: "underline",
    textAlign: "center",
    marginVertical: 4,
    marginHorizontal: 4,
  },
  inputText: {
    borderWidth: 1,
    borderColor: "#ccc",
    borderRadius: 6,
    fontSize: 16,
    fontWeight: '400',
    textAlign: 'left',
    marginVertical: 4,
    marginHorizontal: 4,
  },
  checkboxContainer: {
    flexDirection: 'row',
    alignItems: 'center',
    gap: 8,
    marginVertical: 4,
    marginHorizontal: 4,
  },
  checkbox: {
    width: 24,
    height: 24,
    borderWidth: 2,
    borderColor: '#666',
    borderRadius: 4,
    alignItems: 'center',
    justifyContent: 'center',
    marginVertical: 4,
    marginHorizontal: 4,
  },
  checkboxMark: {
    fontSize: 14,
    fontWeight: '700',
  },
  checkboxLabel: {
    fontSize: 16,
    color: '#111',
    marginVertical: 4,
    marginHorizontal: 4,
  },
  boldBody: {
    fontSize: 16,
    fontWeight: 'bold',
    textAlign: 'left',
    marginVertical: 4,
    marginHorizontal: 4,
  },
});