/**
 * Styles for the reusable chart-config form controls (dropdown, toggle, color,
 * number/text inputs, segmented buttons, collapsible sections, reorderable
 * list). Token-driven — no hardcoded colors, spacing or fonts.
 */
export declare const chartControlsCss = "\n.pg-chart-ctrl__row {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 8px;\n  margin: 8px 0;\n}\n.pg-chart-ctrl__label {\n  font-size: 12px;\n  color: var(--pg-colors-text-secondary, #64748b);\n  flex: 1;\n}\n.pg-chart-ctrl__select,\n.pg-chart-ctrl__input {\n  min-width: 0;\n  max-width: 140px;\n  flex: 1 1 auto;\n  padding: 5px 8px;\n  border: 1px solid var(--pg-colors-border, #e2e8f0);\n  border-radius: 5px;\n  background: var(--pg-colors-surface, #fff);\n  color: var(--pg-colors-text-primary, #0f172a);\n  font-size: 12px;\n  font-family: inherit;\n}\n.pg-chart-ctrl__select:focus,\n.pg-chart-ctrl__input:focus {\n  outline: none;\n  border-color: var(--pg-colors-primary, #2563eb);\n}\n.pg-chart-ctrl__color {\n  width: 34px;\n  height: 24px;\n  padding: 0;\n  border: 1px solid var(--pg-colors-border, #e2e8f0);\n  border-radius: 5px;\n  background: var(--pg-colors-surface, #fff);\n  cursor: pointer;\n}\n.pg-chart-ctrl__toggle {\n  position: relative;\n  width: 34px;\n  height: 18px;\n  border: none;\n  border-radius: 9px;\n  background: var(--pg-colors-border, #cbd5e1);\n  cursor: pointer;\n  transition: background 120ms;\n  flex: 0 0 auto;\n}\n.pg-chart-ctrl__toggle--on { background: var(--pg-colors-primary, #2563eb); }\n.pg-chart-ctrl__toggle-knob {\n  position: absolute;\n  top: 2px;\n  left: 2px;\n  width: 14px;\n  height: 14px;\n  border-radius: 50%;\n  background: #fff;\n  transition: transform 120ms;\n}\n.pg-chart-ctrl__toggle--on .pg-chart-ctrl__toggle-knob { transform: translateX(16px); }\n.pg-chart-ctrl__segmented {\n  display: inline-flex;\n  border: 1px solid var(--pg-colors-border, #e2e8f0);\n  border-radius: 5px;\n  overflow: hidden;\n}\n.pg-chart-ctrl__segment {\n  padding: 4px 9px;\n  border: none;\n  background: var(--pg-colors-surface, #fff);\n  color: var(--pg-colors-text-secondary, #64748b);\n  font-size: 11px;\n  cursor: pointer;\n  font-family: inherit;\n}\n.pg-chart-ctrl__segment--active {\n  background: var(--pg-colors-primary, #2563eb);\n  color: #fff;\n}\n.pg-chart-ctrl__section { border-top: 1px solid var(--pg-colors-border, #e2e8f0); }\n.pg-chart-ctrl__section:first-child { border-top: none; }\n.pg-chart-ctrl__section-header {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  width: 100%;\n  padding: 9px 2px;\n  border: none;\n  background: transparent;\n  color: var(--pg-colors-text-primary, #0f172a);\n  font-size: 12px;\n  font-weight: 600;\n  cursor: pointer;\n  font-family: inherit;\n}\n.pg-chart-ctrl__section-chevron {\n  display: inline-flex;\n  color: var(--pg-colors-text-secondary, #64748b);\n  transition: transform 120ms;\n  transform: rotate(-90deg);\n}\n.pg-chart-ctrl__section--open .pg-chart-ctrl__section-chevron { transform: rotate(0deg); }\n.pg-chart-ctrl__section-body { display: none; padding: 0 2px 8px; }\n.pg-chart-ctrl__section--open .pg-chart-ctrl__section-body { display: block; }\n.pg-chart-ctrl__list { display: flex; flex-direction: column; gap: 4px; }\n.pg-chart-ctrl__list-item {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 5px 6px;\n  border: 1px solid var(--pg-colors-border, #e2e8f0);\n  border-radius: 5px;\n  background: var(--pg-colors-surface, #fff);\n}\n.pg-chart-ctrl__list-item--dragging { opacity: 0.6; }\n.pg-chart-ctrl__list-handle {\n  display: inline-flex;\n  color: var(--pg-colors-text-secondary, #94a3b8);\n  cursor: grab;\n}\n.pg-chart-ctrl__list-swatch {\n  width: 12px;\n  height: 12px;\n  border-radius: 3px;\n  background: var(--pg-chart-swatch, var(--pg-colors-primary, #2563eb));\n  flex: 0 0 auto;\n}\n.pg-chart-ctrl__list-label {\n  flex: 1;\n  font-size: 12px;\n  color: var(--pg-colors-text-primary, #0f172a);\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.pg-chart-ctrl__list-remove {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 20px;\n  height: 20px;\n  border: none;\n  background: transparent;\n  color: var(--pg-colors-text-secondary, #94a3b8);\n  border-radius: 4px;\n  cursor: pointer;\n}\n.pg-chart-ctrl__list-remove:hover {\n  background: var(--pg-colors-background-alt, #f1f5f9);\n  color: var(--pg-colors-danger, #dc2626);\n}\n.pg-chart-panel__dots-item--disabled {\n  opacity: 0.4;\n  pointer-events: none;\n}\n";
//# sourceMappingURL=chart-controls.css.d.ts.map