.theme-generator-container .auto-shades-label {
  margin-left: 30px;
  margin-right: 10px; }

.theme-generator-container .theme-picklist {
  margin-left: 10px; }

.theme-generator-container .theme-column {
  margin-right: 20px; }

.theme-generator-container .theme-colors-group:not(:last-child) {
  margin-bottom: 20px; }

.theme-generator-container .theme-group-header {
  font-size: 1.125rem;
  margin-bottom: 10px; }

.theme-generator-container .color-prop-row {
  margin-bottom: 4px; }

.theme-generator-container .color-value {
  margin-right: 8px; }

.theme-generator-container .palette-value {
  width: 70px; }
  .theme-generator-container .palette-value input {
    font-family: Consolas, Courier New, monospace;
    padding-left: 2px;
    padding-right: 2px; }

.theme-generator-container .color-revert {
  cursor: pointer;
  margin-left: 10px;
  width: 20px; }

.theme-generator-container .thumbnail {
  height: 28px;
  width: 28px;
  margin-right: 8px;
  box-shadow: 2px 2px rgba( 0, 0, 0 ,  0.2 );
  box-shadow: 2px 2px rgba( var(--palette-neutral-100,0, 0, 0) ,  0.2 ); }

.theme-generator-container .auto-shades .theme-prop-name:not(.disabled) {
  font-weight: bold; }

.theme-generator-container .theme-colors-grid.colors-map .theme-column {
  display: flex;
  flex-grow: 1;
  flex-direction: column; }

.theme-generator-container .theme-colors-grid.colors-map .thumbnail {
  flex-shrink: 0; }

.theme-generator-container .theme-colors-grid.colors-map .color-value {
  min-width: 100px;
  max-width: 500px;
  flex-grow: 1;
  flex-shrink: 0; }

.theme-generator-container .theme-colors-grid.colors-map .theme-prop-name {
  width: 300px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap; }