/* RF_F07_GRAFITE_V100 — paleta neutra, independente das outras seis. */
html[data-rf-palette="grafite"] {
  --color-accent: #424A53;
  --color-accent-hover: #303740;
  --rf-accent-contrast: #FFFFFF;
  --bs-primary-rgb: 66,74,83;
  --bs-link-color-rgb: 66,74,83;
}
html[data-rf-palette="grafite"][data-bs-theme="dark"] {
  --color-accent: #C8CDD3;
  --color-accent-hover: #E0E4E8;
  --rf-accent-contrast: #202326;
  --bs-primary-rgb: 200,205,211;
  --bs-link-color-rgb: 200,205,211;
}
/* Ações primárias (Bootstrap) também seguem Grafite, sem afetar outras paletas. */
html[data-rf-palette="grafite"] .btn-primary {
  background: var(--color-accent) !important;
  border-color: var(--color-accent) !important;
  color: var(--rf-accent-contrast) !important;
}
html[data-rf-palette="grafite"] .btn-primary:hover,
html[data-rf-palette="grafite"] .btn-primary:focus,
html[data-rf-palette="grafite"] .btn-primary:active {
  background: var(--color-accent-hover) !important;
  border-color: var(--color-accent-hover) !important;
  color: var(--rf-accent-contrast) !important;
}
html[data-rf-palette="grafite"] .btn-outline-primary {
  background: transparent !important;
  color: var(--color-accent) !important;
  border-color: var(--color-accent) !important;
}
html[data-rf-palette="grafite"] .btn-outline-primary:is(:hover,:focus,:active) {
  background: var(--color-accent) !important;
  border-color: var(--color-accent) !important;
  color: var(--rf-accent-contrast) !important;
}
html[data-rf-palette="grafite"] .bg-primary {
  background-color: var(--color-accent) !important;
}
html[data-rf-palette="grafite"] .text-primary {
  color: var(--color-accent) !important;
}
html[data-rf-palette="grafite"] .border-primary {
  border-color: var(--color-accent) !important;
}
/* Itens ativos de organizar: manter contraste das duas tonalidades. */
html[data-rf-palette="grafite"] .dropdown-item.active {
  background-color: var(--color-accent) !important;
  color: var(--rf-accent-contrast) !important;
}
/* O swatch precisa continuar discernível no tema escuro. */
html[data-rf-palette="grafite"][data-bs-theme="dark"] .rf-palette-card[for="paleta-grafite"] .rf-palette-swatch {
  outline: 1px solid #A6AEB8;
  outline-offset: 1px;
}