/* ggplot2 Layer Colors */
--data-color: #E69F00;        /* Orange/Gold */
--mapping-color: #56B4E9;     /* Light Blue */
--layers-color: #009E73;      /* Teal/Green */
--scales-color: #F0E442;      /* Yellow */
--facets-color: #0072B2;      /* Dark Blue */
--coordinates-color: #D55E00; /* Orange-Red */
--theme-color: #CC79A7;       /* Pink/Mauve */

/* ggplot2 Layer Colors for Headings */

/* Step 1: Data & Mapping (Orange-Gold and Light Blue) */
h4:has(+ * :contains("Step 1")) {
  color: #E69F00 !important;
}

/* More specific targeting for Data */
.data-layer {
  color: #E69F00 !important;
  font-weight: bold;
}

/* Mapping */
.mapping-layer {
  color: #56B4E9 !important;
  font-weight: bold;
}

/* Step 2: Geometry/Layers (Teal) */
.layers-layer {
  color: #009E73 !important;
  font-weight: bold;
}

/* Step 3: Statistics (Yellow) */
.statistics-layer {
  color: #F0E442 !important;
  font-weight: bold;
  text-shadow: 1px 1px 2px rgba(0,0,0,0.3); /* Add shadow for yellow readability */
}

/* Step 4: Facets (Dark Blue) */
.facets-layer {
  color: #0072B2 !important;
  font-weight: bold;
}

/* Step 5: Scales (Yellow) */
.scales-layer {
  color: #F0E442 !important;
  font-weight: bold;
  text-shadow: 1px 1px 2px rgba(0,0,0,0.3);
}

/* Theme (Pink) */
.theme-layer {
  color: #CC79A7 !important;
  font-weight: bold;
}

/* Coordinates (Orange-Red) */
.coordinates-layer {
  color: #D55E00 !important;
  font-weight: bold;
}