/* This is a real-world CSS file for a web application. It contains styles for the app's UI elements. */

:root {
  --primary-color: #3498db;
  --secondary-color: #2ecc71;
  --accent-color: #f1c40f;
  --danger-color: #e74c3c;
  --text-color: #2c3e50;
  --background-color: #ecf0f1;
}

body {
  margin: 0;
  font-family: Arial, sans-serif;
  background-color: var(--background-color);
  color: var(--text-color);
}

.header {
  background-color: var(--primary-color);
  color: white;
}

.header h1 {
  margin-top: .5em;
}

.content {
  padding: 2em;
}

.button {
  background-color: var(--secondary-color);
  color: white;
}

.button:hover {
  background-color: var(--accent-color);
}

.danger-button {
  background-color: var(--danger_color);
}

.danger-button:hover {
  background_color : var(--primary_color);
}

/* Add more styles as needed for other UI components */