import { StyleSheet } from "react-native";
import {
  CONTAINER_BACKGROUND,
  COLOR_ACCENT,
  COLOR_PRIMARY,
  BACKGROUND_COLOR,
} from "../utils/constants";

export default StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: CONTAINER_BACKGROUND,
  },
  contentContainer: {
    paddingBottom: 20,
    flexDirection: "column",
    justifyContent: "flex-start",
  },
  header: {
    alignItems: "center",
    paddingTop: 20,
    paddingBottom: 20,
  },
  profileImage: {
    width: 150,
    height: 150,
    borderRadius: 75,
    borderWidth: 4,
    borderColor: "#ffffff",
  },
  content: {
    paddingHorizontal: 20,
  },
  welcomeText: {
    fontSize: 18,
    fontWeight: "bold",
    marginTop: 50,
    color: COLOR_ACCENT,
    textAlign: "center",
    marginBottom: 30,
    lineHeight: 24,
  },
  bioSection: {
    backgroundColor: BACKGROUND_COLOR,
    borderRadius: 10,
    padding: 20,
    marginBottom: 20,
  },
  bioTitle: {
    fontSize: 24,
    fontWeight: "bold",
    color: COLOR_ACCENT,
    marginBottom: 15,
    textAlign: "center",
  },
  bioText: {
    fontSize: 16,
    color: COLOR_PRIMARY,
    lineHeight: 24,
    textAlign: "justify",
  },
  courseInfo: {
    backgroundColor: BACKGROUND_COLOR,
    borderRadius: 10,
    padding: 15,
  },
  courseText: {
    fontSize: 16,
    color: COLOR_PRIMARY,
    textAlign: "center",
    fontWeight: "600",
  },
});