/* R&A Autopeças — sistema de cor
   Base preta (#050505 do manual) + acento vermelho oficial:
   #990100 (vermelho marca) · #050505 (preto) · #FFFFFF (branco). */
:root {
  /* Base — preto/carvão neutro */
  --gray-950: #050505;   /* preto marca (#050505) */
  --gray-900: #0c0c0d;
  --gray-850: #121214;
  --gray-800: #19191c;
  --gray-700: #232327;
  --gray-600: #303036;
  --gray-500: #4a4a52;
  --gray-400: #71717a;
  --gray-300: #9c9ca4;
  --gray-200: #c8c8ce;
  --gray-100: #e6e6e9;
  --gray-50:  #f4f4f6;

  /* Acento — vermelho oficial do manual R&A */
  --red-700: #6b0100;
  --red-600: #7f0100;
  --red-500: #990100;   /* vermelho marca (#990100) */
  --red-400: #bd1a15;
  --red-300: #e84a42;   /* vermelho claro — texto/preços sobre escuro */
  --red-100: #fbdad8;

  /* Semânticas de estado */
  --green-500: #3fa554;
  --amber-500: #e0a52e;

  /* Aliases semânticos — superfícies */
  --bg-page:        var(--gray-900);
  --bg-page-deep:   var(--gray-950);
  --surface-card:   var(--gray-850);
  --surface-raised: var(--gray-800);
  --surface-input:  var(--gray-950);
  --surface-hover:  var(--gray-800);

  /* Aliases semânticos — texto */
  --text-strong:  #f4f4f6;
  --text-body:    #c8c8ce;
  --text-muted:   #8a8a93;
  --text-faint:   #4a4a52;
  --text-on-accent: #ffffff;
  --text-accent:  var(--red-300);

  /* Aliases semânticos — bordas */
  --border-subtle: #26262b;
  --border-strong: #3a3a41;
  --border-focus:  var(--red-400);

  /* Aliases semânticos — ações */
  --accent:         var(--red-500);
  --accent-hover:   var(--red-400);
  --accent-pressed: var(--red-600);
  --accent-bright:  var(--red-300);  /* destaques sobre vermelho/escuro */

  /* Estados de peça
     Nota: "Vendida" é NEUTRA (cinza) — o vermelho é a cor da marca/ação,
     e um badge vermelho leria como CTA. Desvio intencional face ao RC. */
  --state-available:   var(--green-500);
  --state-on-request:  var(--gray-400);  /* "Sob consulta" */
  --state-reserved:    var(--amber-500);
  --state-sold:        var(--gray-500);
}