{
  "nome": "Design System SIMEC",
  "base": "Bootstrap 3",
  "versao": "1.0.0",
  "prefixo": "--simec-",
  "grupos": [
    {
      "nome": "Base colors - Cores base",
      "slug": "base-colors-cores-base",
      "tokens": [
        {
          "nome": "--simec-text",
          "valor": "#333333",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-text-muted",
          "valor": "#777777",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-text-inverse",
          "valor": "#ffffff",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-link",
          "valor": "#2e6db4",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-tab-text",
          "valor": "#2e6db4",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-text-danger",
          "valor": "#d9534f",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-text-halted",
          "valor": "#e67e22",
          "origem": "figma",
          "nota": "status \"Paralisada\""
        },
        {
          "nome": "--simec-bg",
          "valor": "#ffffff",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-bg-surface",
          "valor": "#f5f5f5",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-bg-hover",
          "valor": "#eeeeee",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-border",
          "valor": "#cccccc",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-border-light",
          "valor": "#dddddd",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-border-focus",
          "valor": "#66afe9",
          "origem": "figma",
          "nota": ""
        }
      ]
    },
    {
      "nome": "Buttons - Botões (Bootstrap 3: bg / border / hover)",
      "slug": "buttons-botoes-bootstrap-3-bg-border-hover",
      "tokens": [
        {
          "nome": "--simec-primary",
          "valor": "#2e6db4",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-primary-border",
          "valor": "#295f9f",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-primary-hover",
          "valor": "#24558b",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-success",
          "valor": "#5cb85c",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-success-border",
          "valor": "#4cae4c",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-success-hover",
          "valor": "#47a447",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-danger",
          "valor": "#d9534f",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-danger-border",
          "valor": "#d43f3a",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-danger-hover",
          "valor": "#d2322d",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-warning",
          "valor": "#f0ad4e",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-warning-border",
          "valor": "#ed9c28",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-warning-hover",
          "valor": "#ec971f",
          "origem": "bs3",
          "nota": ""
        },
        {
          "nome": "--simec-info",
          "valor": "#5bc0de",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-info-border",
          "valor": "#39b3d7",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-info-hover",
          "valor": "#31b0d5",
          "origem": "bs3",
          "nota": ""
        },
        {
          "nome": "--simec-neutral-hover",
          "valor": "#ebebeb",
          "origem": "figma",
          "nota": "botão padrão (branco) em hover"
        }
      ]
    },
    {
      "nome": "Alerts - Alertas (text: figma / bg and border: bs3)",
      "slug": "alerts-alertas-text-figma-bg-and-border-bs3",
      "tokens": [
        {
          "nome": "--simec-alert-success-text",
          "valor": "#468847",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-alert-success-bg",
          "valor": "#dff0d8",
          "origem": "bs3",
          "nota": ""
        },
        {
          "nome": "--simec-alert-success-border",
          "valor": "#d6e9c6",
          "origem": "bs3",
          "nota": ""
        },
        {
          "nome": "--simec-alert-warning-text",
          "valor": "#c09853",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-alert-warning-bg",
          "valor": "#fcf8e3",
          "origem": "bs3",
          "nota": ""
        },
        {
          "nome": "--simec-alert-warning-border",
          "valor": "#fbeed5",
          "origem": "bs3",
          "nota": ""
        },
        {
          "nome": "--simec-alert-danger-text",
          "valor": "#b94a48",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-alert-danger-bg",
          "valor": "#f2dede",
          "origem": "bs3",
          "nota": ""
        },
        {
          "nome": "--simec-alert-danger-border",
          "valor": "#eed3d7",
          "origem": "bs3",
          "nota": ""
        },
        {
          "nome": "--simec-alert-info-text",
          "valor": "#3a87ad",
          "origem": "bs3",
          "nota": ""
        },
        {
          "nome": "--simec-alert-info-bg",
          "valor": "#d9edf7",
          "origem": "bs3",
          "nota": ""
        },
        {
          "nome": "--simec-alert-info-border",
          "valor": "#bce8f1",
          "origem": "bs3",
          "nota": ""
        },
        {
          "nome": "--simec-alert-simec",
          "valor": "#e30613",
          "origem": "figma",
          "nota": "faixa vermelha de aviso"
        }
      ]
    },
    {
      "nome": "Field states - Estados de campo (has-success / has-warning / has-error)",
      "slug": "field-states-estados-de-campo-has-success-has-warning-has-error",
      "tokens": [
        {
          "nome": "--simec-field-success",
          "valor": "#3c763d",
          "origem": "bs3",
          "nota": ""
        },
        {
          "nome": "--simec-field-warning",
          "valor": "#8a6d3b",
          "origem": "bs3",
          "nota": ""
        },
        {
          "nome": "--simec-field-error",
          "valor": "#a94442",
          "origem": "bs3",
          "nota": ""
        },
        {
          "nome": "--simec-field-disabled",
          "valor": "#eeeeee",
          "origem": "figma",
          "nota": ""
        }
      ]
    },
    {
      "nome": "Table - Tabela legada SIMEC",
      "slug": "table-tabela-legada-simec",
      "tokens": [
        {
          "nome": "--simec-table-header",
          "valor": "#e6e6e6",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-table-label",
          "valor": "#dfdfdf",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-table-border",
          "valor": "#c0c0c0",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-table-striped",
          "valor": "#f9f9f9",
          "origem": "figma",
          "nota": ""
        }
      ]
    },
    {
      "nome": "Page layout - Estrutura da página SIMEC",
      "slug": "page-layout-estrutura-da-pagina-simec",
      "tokens": [
        {
          "nome": "--simec-environment-bar",
          "valor": "#0f8f0f",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-footer",
          "valor": "#000000",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-footer-stripe",
          "valor": "#5eaf2e",
          "origem": "figma",
          "nota": ""
        }
      ]
    },
    {
      "nome": "Status icons - Ícones de situação",
      "slug": "status-icons-icones-de-situacao",
      "tokens": [
        {
          "nome": "--simec-icon-success",
          "valor": "#3c9a3c",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-icon-help",
          "valor": "#f5c518",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-icon-error",
          "valor": "#d9534f",
          "origem": "figma",
          "nota": ""
        }
      ]
    },
    {
      "nome": "Typography - Tipografia",
      "slug": "typography-tipografia",
      "tokens": [
        {
          "nome": "--simec-font-family",
          "valor": "\"Inter\", \"Helvetica Neue\", Helvetica, Arial, sans-serif",
          "origem": "",
          "nota": ""
        },
        {
          "nome": "--simec-font-mono",
          "valor": "Menlo, Monaco, Consolas, \"Courier New\", monospace",
          "origem": "",
          "nota": ""
        },
        {
          "nome": "--simec-font-size-sm",
          "valor": "12px",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-font-size-base",
          "valor": "14px",
          "origem": "bs3",
          "nota": ""
        },
        {
          "nome": "--simec-font-size-md",
          "valor": "16px",
          "origem": "figma",
          "nota": "título de cartão e do cabeçalho"
        },
        {
          "nome": "--simec-font-size-lg",
          "valor": "18px",
          "origem": "bs3",
          "nota": ""
        },
        {
          "nome": "--simec-font-size-xl",
          "valor": "28px",
          "origem": "figma",
          "nota": "título da página"
        },
        {
          "nome": "--simec-font-weight-normal",
          "valor": "400",
          "origem": "bs3",
          "nota": ""
        },
        {
          "nome": "--simec-font-weight-bold",
          "valor": "700",
          "origem": "bs3",
          "nota": ""
        },
        {
          "nome": "--simec-line-height",
          "valor": "1.428571429",
          "origem": "bs3",
          "nota": ""
        },
        {
          "nome": "--simec-line-height-text",
          "valor": "1.5",
          "origem": "",
          "nota": "Análise Obras 2.0: blocos de texto descritivos"
        }
      ]
    },
    {
      "nome": "Spacing - Espaçamentos",
      "slug": "spacing-espacamentos",
      "tokens": [
        {
          "nome": "--simec-space-xs",
          "valor": "4px",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-space-sm",
          "valor": "6px",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-space-md",
          "valor": "10px",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-space-lg",
          "valor": "12px",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-space-xl",
          "valor": "15px",
          "origem": "figma",
          "nota": ""
        }
      ]
    },
    {
      "nome": "Control heights - Alturas de controles",
      "slug": "control-heights-alturas-de-controles",
      "tokens": [
        {
          "nome": "--simec-button-height-xs",
          "valor": "22px",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-button-height-sm",
          "valor": "30px",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-button-height",
          "valor": "34px",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-button-height-lg",
          "valor": "46px",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-input-height-sm",
          "valor": "30px",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-input-height",
          "valor": "34px",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-input-height-lg",
          "valor": "45px",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-table-header-height",
          "valor": "38px",
          "origem": "figma",
          "nota": ""
        },
        {
          "nome": "--simec-table-condensed-height",
          "valor": "32px",
          "origem": "figma",
          "nota": ""
        }
      ]
    },
    {
      "nome": "Navigation menu - Menu de navegação",
      "slug": "navigation-menu-menu-de-navegacao",
      "tokens": [
        {
          "nome": "--simec-nav-text-hover",
          "valor": "#23527c",
          "origem": "bs3",
          "nota": "link:hover do Bootstrap 3"
        },
        {
          "nome": "--simec-nav-bg-active",
          "valor": "#24558b",
          "origem": "figma",
          "nota": "fundo/primario-ativo (igual ao primário hover)"
        },
        {
          "nome": "--simec-nav-text-active",
          "valor": "#ffffff",
          "origem": "figma",
          "nota": "texto/inverso"
        },
        {
          "nome": "--simec-nav-text-disabled",
          "valor": "#999999",
          "origem": "figma",
          "nota": "texto/desabilitado"
        },
        {
          "nome": "--simec-nav-touch-target",
          "valor": "48px",
          "origem": "figma",
          "nota": "altura mínima do item no mobile"
        },
        {
          "nome": "--simec-nav-item-height",
          "valor": "30px",
          "origem": "figma",
          "nota": "altura do item no desktop (≥ 768px)"
        },
        {
          "nome": "--simec-nav-indent-sub1",
          "valor": "16px",
          "origem": "figma",
          "nota": "recuo do submenu1"
        },
        {
          "nome": "--simec-nav-indent-sub2",
          "valor": "20px",
          "origem": "figma",
          "nota": "recuo adicional do submenu2"
        }
      ]
    },
    {
      "nome": "Radius and modal - Bordas e modais",
      "slug": "radius-and-modal-bordas-e-modais",
      "tokens": [
        {
          "nome": "--simec-radius-sm",
          "valor": "3px",
          "origem": "bs3",
          "nota": ""
        },
        {
          "nome": "--simec-radius",
          "valor": "4px",
          "origem": "bs3",
          "nota": ""
        },
        {
          "nome": "--simec-radius-lg",
          "valor": "6px",
          "origem": "bs3",
          "nota": ""
        },
        {
          "nome": "--simec-modal-width",
          "valor": "600px",
          "origem": "figma",
          "nota": "Modal BS3"
        },
        {
          "nome": "--simec-modal-width-lg",
          "valor": "900px",
          "origem": "figma",
          "nota": "Modal SIMEC (extensão BS3)"
        }
      ]
    },
    {
      "nome": "Elevation - Elevação e sombras",
      "slug": "elevation-elevacao-e-sombras",
      "tokens": [
        {
          "nome": "--simec-shadow-inset",
          "valor": "inset 0 1px 1px rgba(0, 0, 0, 0.075)",
          "origem": "bs3",
          "nota": "campos de texto"
        },
        {
          "nome": "--simec-shadow-sm",
          "valor": "0 1px 1px rgba(0, 0, 0, 0.05)",
          "origem": "bs3",
          "nota": "cartões e painéis"
        },
        {
          "nome": "--simec-shadow-md",
          "valor": "0 6px 12px rgba(0, 0, 0, 0.175)",
          "origem": "bs3",
          "nota": "menus suspensos"
        },
        {
          "nome": "--simec-shadow-lg",
          "valor": "0 5px 15px rgba(0, 0, 0, 0.5)",
          "origem": "bs3",
          "nota": "modal"
        }
      ]
    },
    {
      "nome": "Motion - Movimento e transições",
      "slug": "motion-movimento-e-transicoes",
      "tokens": [
        {
          "nome": "--simec-duration-fast",
          "valor": "150ms",
          "origem": "bs3",
          "nota": "hover, foco e cor"
        },
        {
          "nome": "--simec-duration-normal",
          "valor": "300ms",
          "origem": "bs3",
          "nota": "abrir e fechar menus e painéis"
        },
        {
          "nome": "--simec-easing",
          "valor": "ease-in-out",
          "origem": "bs3",
          "nota": ""
        }
      ]
    },
    {
      "nome": "Grid and breakpoints - Grade e pontos de quebra",
      "slug": "grid-and-breakpoints-grade-e-pontos-de-quebra",
      "tokens": [
        {
          "nome": "--simec-breakpoint-sm",
          "valor": "768px",
          "origem": "bs3",
          "nota": "tablet"
        },
        {
          "nome": "--simec-breakpoint-md",
          "valor": "992px",
          "origem": "bs3",
          "nota": "notebook"
        },
        {
          "nome": "--simec-breakpoint-lg",
          "valor": "1200px",
          "origem": "bs3",
          "nota": "desktop"
        },
        {
          "nome": "--simec-container-sm",
          "valor": "750px",
          "origem": "bs3",
          "nota": "largura do container em sm"
        },
        {
          "nome": "--simec-container-md",
          "valor": "970px",
          "origem": "bs3",
          "nota": "largura do container em md"
        },
        {
          "nome": "--simec-container-lg",
          "valor": "1170px",
          "origem": "bs3",
          "nota": "largura do container em lg"
        },
        {
          "nome": "--simec-grid-columns",
          "valor": "12",
          "origem": "bs3",
          "nota": ""
        },
        {
          "nome": "--simec-grid-gutter",
          "valor": "30px",
          "origem": "bs3",
          "nota": "15px de cada lado da coluna"
        }
      ]
    }
  ]
}