/* Font sizes and weights */
body {
  font-size: var(--primary-font-size);
}

h1 {
  font-size: var(--primary-h1-size);
  font-weight: 700;
  color: var(--foreground);
  line-height: normal;
}

h2 {
  font-size: var(--primary-h2-size);
  font-weight: 600;
  color: var(--foreground);
  line-height: normal;
}

p {
  line-height: 1.6;
}

:root {
  /* Font sizes */
  --primary-font-size: 1rem;
  --primary-h1-size: 2.25rem;
  --primary-h2-size: 1.125rem;

  /* Primary colors */
  --primary: #0891b2;

  /* Used in admin left navigation and table headers */
  --primary-tint: #d8ecf1;

  /* Button, element and dropdown borders */
  --light-line: #dcdcdc;
  --dark-line: #bebebe;

  /* Background color for box which has text or something */
  --section-background: #e5f1f5;
  /* Lighter version */
  --section-background2: #F1F5F9;

  /* Voting aid multiselect color */
  --question-lines: #7ccadd;
}

:root {
  /* App background */
  --voting-background: #f1f5f9;
  --admin-background: white;
  --candidate-background: #b0c2d4;
  --content-background: white;
  /* Big header in voting aid */
  --secondary-header: #374151;
  /* 'Vastaa vaalikoneeseen' button in the voting aid */
  --secondary-big-button: #64748b;

  /* Text color */
  --foreground: #1f1f1f;

  /* General colors */
  --primary-foreground: white;
  --accent: #f8f8fa;
  --accent-foreground: #363636;
  --card: #ffffff;
  --card-foreground: #242424;
  --secondary: #f8f8fa;
  --secondary-foreground: #363636;
  --muted: #f8f8fa;
  --muted-foreground: #6b7280;
  --destructive: #d44022;
  --ring: lightgray;
  --popover: #ffffff;
  --popover-foreground: #242424;

  /* Main font */
  --font-sans: "Inter";

  /* Header */
  --header: white;
  --header-border-bottom: var(--light-line);
  --header-dropdown-border: var(--light-line);

  /* Footer */
  --footer: white;
  --footer-border-top: var(--light-line);
  --footer-text-color: var(--primary);

  /* Sidebar */
  --sidebar-border-color: var(--light-line);

  /* Datatable */
  --datatable-header-background: var(--primary-tint);

  /* Elements */
  --ring: var(--primary-tint);
  --border: var(--dark-line);
  --dropdown-arrow-color: var(--primary);
  --dropdown-border-color: var(--dark-line);
  --field-label-size: 1rem;
  --big-card-border-radius: 24px;
  --profile-pic-border-radius: 10%;
  --candidate-card-border-radius: 32px;
  --candidate-card-padding: 32px;
  --disabled-color: #e8e8e8;

  /* Space between element */
  --spacing-element-spacing1: 2rem;
  --spacing-text-spacing1: 0.5rem;
  --spacing-inside-section: 1rem;

  /* Page width */
  --admin-max-page-width1: 1280px;
  --voting-max-page-width1: 800px;
  --admin-form-width: 1024px;
  --admin-max-app-width: 2048px;
  --candidate-max-page-width: 800px;
}