:root {
  /* Page */
  --page-bg: #f3f4f6;

  /* Card */
  --card-bg: #ffffff;
  --card-border: #d1d5db;
  --card-radius: 10px;

  /* Modal */
  --modal-bg: #ffffff;
  --modal-shadow: 0 10px 30px rgba(0,0,0,0.15);

  --overlay-bg: rgba(0,0,0,0.45);

  /* Typography */
  --text-body: #111827;
  --text-muted: #6b7280;
  --text-placeholder: #9ca3af;

  --heading-h1: #111827;
  --heading-h2: #374151;
  --heading-modal: #111827;

  /* Inputs */
  --input-bg: #ffffff;
  --input-text: #111827;
  --input-border: #d1d5db;
  --input-border-focus: #2563eb;
  --input-radius: 6px;

  /* Pickers */
  --picker-bg: #ffffff;
  --picker-text: #111827;
  --picker-border: #d1d5db;
  --picker-radius: 6px;

  --picker-hover-bg: #f3f4f6;
  --picker-hover-border: #9ca3af;

  --picker-active-bg: #2563eb;
  --picker-active-text: #ffffff;
  --picker-active-border: #2563eb;

  /* Submit */
  --submit-bg: #2563eb;
  --submit-text: #ffffff;
  --submit-border: #2563eb;
  --submit-hover-bg: #1d4ed8;

  /* Modal buttons */
  --modal-btn-bg: #ffffff;
  --modal-btn-text: #111827;
  --modal-btn-border: #d1d5db;
  --modal-btn-hover-bg: #f3f4f6;
  --modal-btn-hover-border: #9ca3af;

  /* Feedback */
  --error-text: #dc2626;
  --success-text: #16a34a;
}