/* Skin CSS custom properties — shared across all mockups */

/* Tenant skin (blue) — default */
:root,
[data-skin="tenant"] {
  --skin-sidebar-bg: 15 23 42;        /* slate-900 */
  --skin-sidebar-active: 30 64 175;   /* blue-800 */
  --skin-sidebar-hover: 30 41 59;     /* slate-800 */
  --skin-primary: 37 99 235;          /* blue-600 */
  --skin-primary-hover: 29 78 216;    /* blue-700 */
  --skin-primary-light: 219 234 254;  /* blue-100 */
  --skin-accent-tint: 37 99 235;      /* blue-600 */
  --skin-header-border: 226 232 240;  /* slate-200 */
  --skin-gunny-indicator: 52 211 153; /* emerald-400 */
}

/* Control Plane skin (charcoal + burnt orange) */
[data-skin="cp"] {
  --skin-sidebar-bg: 55 65 81;        /* gray-700 — charcoal gray */
  --skin-sidebar-active: 194 88 17;   /* #c25811 — burnt orange */
  --skin-sidebar-hover: 75 85 99;     /* gray-600 */
  --skin-primary: 194 88 17;          /* #c25811 — burnt orange */
  --skin-primary-hover: 163 74 14;    /* #a34a0e — darker burnt orange */
  --skin-primary-light: 255 237 213;  /* orange-100 */
  --skin-accent-tint: 194 88 17;      /* #c25811 — burnt orange */
  --skin-header-border: 226 232 240;  /* slate-200 */
  --skin-gunny-indicator: 194 88 17;  /* #c25811 — burnt orange */
}