/* =============================================================================
   Planner — tokens do Guia de Estilo da Planner (v1.0, setembro de 2026)
   -----------------------------------------------------------------------------
   Fonte única das cores, da fonte e das medidas da marca. Carregado em todas as
   páginas antes do site.css, que só consome estas variáveis (--ldd-* e --bs-*
   apontam para cá). Para ajustar uma cor no site inteiro, mude-a aqui — e, se
   for uma mudança de marca, também no guia, para os dois não divergirem.

   Os valores das seções "Marca", "Interface", "Estados", "Tipografia" e
   "Layout" são os do guia (v1.1, outubro de 2026: a interface dos sistemas
   passou ao teal, no padrão do FleetScore; azul e verde do logotipo ficam para
   a marca). A seção "Derivados" tem tons que o guia não define (hover, ativo,
   desabilitado, bordas); são calculados a partir das cores do guia e qualquer
   exceção nova deve ser registrada no guia antes de se espalhar.
   ========================================================================== */

/* ----- Fonte (Inter, servida de wwwroot; font-display: swap) ----------------- */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/inter/Inter-Regular.woff2") format("woff2");
}
/* O guia pede só 400, 600 e 700; o 500 continua servido porque telas antigas
   ainda o usam (botões, links) — retirar quando elas migrarem para 600. */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/inter/Inter-Medium.woff2") format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/inter/Inter-SemiBold.woff2") format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/inter/Inter-Bold.woff2") format("woff2");
}

:root {
  /* ----- Marca (guia: "Sistema de cores") ----------------------------------- */
  --planner-brand-blue: #005d89;      /* logotipo, links, informação, detalhes institucionais */
  --planner-brand-green: #49a142;     /* logotipo, gráficos, destaques NÃO textuais (não usar com texto branco pequeno) */
  --planner-action-green: #2f7d32;    /* site institucional: botão principal — nos sistemas, usar --planner-primary */
  --planner-deep-green: #14532d;      /* site institucional: títulos de marketing, rodapé e faixas */
  --planner-brand-gray: #5b5a5c;      /* assinatura do logotipo, texto secundário sobre branco */
  --planner-ink: #17221b;             /* texto principal */
  --planner-muted: #5f6f65;           /* texto de apoio (especificação técnica do guia) */
  --planner-white: #ffffff;
  --planner-surface: #f0f2f5;         /* fundo neutro da página */
  --planner-soft-green: #edf7ed;      /* destaques e estados positivos (texto Deep Green ou Ink) */
  --planner-soft-blue: #eaf4f8;       /* informações e linhas alternadas (texto Brand Blue ou Ink) */
  --planner-border: #d9e1dc;          /* bordas e divisores discretos */

  --planner-brand-blue-rgb: 0, 93, 137;
  --planner-brand-green-rgb: 73, 161, 66;
  --planner-action-green-rgb: 47, 125, 50;
  --planner-ink-rgb: 23, 34, 27;
  --planner-surface-rgb: 240, 242, 245;

  /* ----- Interface dos sistemas (guia: "Aplicações") ------------------------ */
  --planner-primary: #007b6d;         /* barra superior, botão principal, seleção, contagens — texto branco 5,2:1 */
  --planner-primary-dark: #005a4f;    /* hover do botão, cabeçalho de tabela, títulos de tela — texto branco 8,2:1 */
  --planner-sidebar: #0d2f2a;         /* barra lateral (sólida, sem degradê) */
  --planner-primary-tint: #e8f5f2;    /* linha selecionada, hover de item, fundo de botão contornado */
  --planner-primary-rgb: 0, 123, 109;

  /* ----- Estados (guia: "Cores de estado") ---------------------------------- */
  --planner-status-ok-bg: #e6f5ec;        /* Conforme — condição normal ou concluída (texto 4,8:1) */
  --planner-status-ok-text: #1f7a3a;
  --planner-status-info-bg: #eaf4f8;      /* Informação — contexto e orientação */
  --planner-status-info-text: #005d89;
  --planner-status-warning-bg: #fff5e0;   /* Atenção — situação que exige planejamento (texto 5,5:1) */
  --planner-status-warning-text: #8a5a00;
  --planner-status-critical-bg: #fdecec;  /* Crítico — risco que exige ação imediata */
  --planner-status-critical-text: #b42318;

  /* ----- Tipografia (guia: "Tipografia") ------------------------------------ */
  --planner-font: "Inter", Arial, Helvetica, sans-serif;
  --planner-weight-regular: 400;
  --planner-weight-semibold: 600;
  --planner-weight-bold: 700;
  /* tamanhos desktop / celular e altura de linha */
  --planner-fs-h1: 48px;        --planner-fs-h1-mobile: 36px;        --planner-lh-h1: 1.12;
  --planner-fs-h2: 32px;        --planner-fs-h2-mobile: 28px;        --planner-lh-h2: 1.2;
  --planner-fs-h3: 22px;        --planner-fs-h3-mobile: 20px;        --planner-lh-h3: 1.3;
  --planner-fs-lead: 18px;      --planner-fs-lead-mobile: 17px;      --planner-lh-lead: 1.55;
  --planner-fs-body: 16px;      --planner-fs-body-mobile: 16px;      --planner-lh-body: 1.6;
  --planner-fs-button: 15px;    --planner-fs-button-mobile: 16px;    --planner-lh-button: 1.2;
  --planner-fs-caption: 14px;   --planner-fs-caption-mobile: 14px;   --planner-lh-caption: 1.45;
  --planner-fs-min: 12px;                                            --planner-lh-min: 1.4;
  --planner-measure: 70ch;      /* parágrafos de leitura: 65 a 75 caracteres por linha */

  /* ----- Layout e espaçamento (guia: "Layout e espaçamento") ----------------- */
  --planner-content-width: 1200px;
  --planner-gutter: 24px;               /* entre colunas da grade de 12 */
  --planner-margin-desktop: 32px;       /* 32 a 48 px; aumentar em telas largas */
  --planner-margin-mobile: 20px;        /* 20 a 24 px */
  --planner-space-1: 4px;
  --planner-space-2: 8px;
  --planner-space-3: 12px;
  --planner-space-4: 16px;
  --planner-space-5: 24px;
  --planner-space-6: 32px;
  --planner-space-7: 48px;
  --planner-space-8: 64px;
  --planner-radius: 8px;
  --planner-radius-lg: 12px;            /* cartões maiores */
  --planner-border-width: 1px;
  --planner-shadow: 0 1px 2px rgba(var(--planner-ink-rgb), 0.06);   /* muito discreta: preferir borda */
  --planner-touch-min: 44px;            /* altura mínima de botões e campos */
  --planner-focus-color: rgba(0, 123, 109, 0.30);
  --planner-focus: 0 0 0 3px var(--planner-focus-color);

  /* ----- Derivados (não estão no guia v1.0) ---------------------------------- */
  --planner-primary-active: #004a41;
  --planner-primary-disabled: #8cc5bd;
  --planner-primary-border-soft: #a9d6cf;        /* borda de botão teal contornado em repouso, contagens */
  --planner-primary-tint-strong: #d3ece7;        /* hover sobre o tint */
  --planner-brand-blue-hover: #004f75;
  --planner-brand-blue-active: #003f5e;
  --planner-brand-blue-tint: #dcebf4;            /* seleção/hover em azul, um tom acima do Soft Blue */
  --planner-surface-soft: #f8faf9;               /* cabeçalho de tabela e cartões de apoio, entre o branco e o Surface */
  --planner-row-stripe: #eff3f1;                 /* zebrado das tabelas (linha par), escolhido pelo dono em 2026-10-09; o hover Teal Claro #e8f5f2 fica por cima */
  --planner-border-strong: #c3cec7;              /* cabeçalho de tabela, campos */
  --planner-status-ok-border: #b8e0c5;
  --planner-status-info-border: #bbd6e6;
  --planner-status-warning-border: #f0d59a;
  --planner-status-warning-accent: #e09400;      /* barra lateral de alerta, gráficos (não textual) */
  --planner-status-critical-border: #f4c0bb;
  --planner-status-critical-hover: #9b1e14;
  --planner-status-critical-active: #7f1810;
  /* sobre a barra lateral (#0d2f2a) */
  --planner-on-sidebar: #cad1d0;                 /* texto dos itens (branco a ~78%): 9,3:1 */
  --planner-on-sidebar-muted: #93a29f;           /* rótulos de seção e ícones inativos (branco a ~55%): 5,4:1 */
  --planner-sidebar-accent: #2bb3a0;             /* barra e ícone do item ativo — não textual, 5,5:1 (o teal puro dá só 2,8:1) */
  /* sobre a barra superior (teal) */
  --planner-on-primary-muted: #ecf6f5;           /* texto secundário sobre o teal: 4,7:1 */
}
