/*
  Identidade visual padrão do ContAÍ.
  Define as variáveis --sigep-* e os componentes de base (botão, campo,
  cartão) usados em todo o index.css. Substitua os valores abaixo para
  aplicar a identidade visual de uma marca própria — o restante do app
  (index.css) não precisa mudar, pois só consome estas variáveis e classes.
*/

:root {
  /* ===== Cores ===== */
  --sigep-navy: #16233f;
  --sigep-blue: #2f6fed;
  --sigep-blue-dark: #1d4fc4;
  --sigep-blue-soft: #a9c5fb;
  --sigep-blue-tint: #eaf1fe;
  --sigep-slate: #64748b;
  --sigep-success: #1f9d55;
  --sigep-danger: #dc2626;
  --sigep-aviso: #b8791f;
  --sigep-primary: var(--sigep-blue);

  --sigep-bg: #f4f6fb;
  --sigep-surface: #ffffff;
  --sigep-text: #1b2230;
  --sigep-text-muted: #667085;
  --sigep-border: #e2e6ee;

  /* ===== Tipografia ===== */
  --sigep-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --sigep-fs-xs: 0.75rem;
  --sigep-fs-sm: 0.8125rem;
  --sigep-fs-base: 0.9375rem;
  --sigep-fs-lg: 1.125rem;
  --sigep-fw-medium: 500;
  --sigep-fw-semibold: 600;

  /* ===== Espaçamento ===== */
  --sigep-space-1: 4px;
  --sigep-space-2: 8px;
  --sigep-space-3: 12px;
  --sigep-space-4: 16px;
  --sigep-space-5: 24px;
  --sigep-space-6: 32px;

  /* ===== Raios e sombras ===== */
  --sigep-radius-sm: 6px;
  --sigep-radius-md: 10px;
  --sigep-radius: var(--sigep-radius-md);
  --sigep-radius-pill: 999px;
  --sigep-shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.06);
  --sigep-shadow-md: 0 4px 10px rgba(16, 24, 40, 0.08);
  --sigep-shadow-lg: 0 10px 30px rgba(16, 24, 40, 0.16);
}

body.sigep-base {
  font-family: -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: var(--sigep-fs-base);
  color: var(--sigep-text);
  background: var(--sigep-bg);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3 { color: var(--sigep-navy); }

/* ===== Cartão ===== */
.sigep-card {
  background: var(--sigep-surface);
  border: 1px solid var(--sigep-border);
  border-radius: var(--sigep-radius-md);
  box-shadow: var(--sigep-shadow-sm);
  padding: var(--sigep-space-4);
}

/* ===== Campos ===== */
.sigep-input, .sigep-select {
  font: inherit;
  font-size: var(--sigep-fs-sm);
  color: var(--sigep-text);
  background: var(--sigep-surface);
  border: 1px solid var(--sigep-border);
  border-radius: var(--sigep-radius-sm);
  padding: 0.45rem 0.6rem;
  outline: none;
  transition: border-color 120ms ease, box-shadow 120ms ease;
}
.sigep-input:focus, .sigep-select:focus {
  border-color: var(--sigep-blue);
  box-shadow: 0 0 0 3px var(--sigep-blue-tint);
}

/* ===== Botões ===== */
.sigep-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--sigep-space-2);
  font: inherit;
  font-size: var(--sigep-fs-sm);
  font-weight: var(--sigep-fw-medium);
  border-radius: var(--sigep-radius-sm);
  border: 1px solid transparent;
  padding: 0.5rem 0.9rem;
  cursor: pointer;
  transition: background 120ms ease, filter 120ms ease, border-color 120ms ease;
}
.sigep-btn:disabled { opacity: 0.6; cursor: not-allowed; }

.sigep-btn-primary { background: var(--sigep-blue); border-color: var(--sigep-blue); color: #fff; }
.sigep-btn-primary:hover:not(:disabled) { background: var(--sigep-blue-dark); }

.sigep-btn-secondary { background: var(--sigep-surface); border-color: var(--sigep-border); color: var(--sigep-navy); }
.sigep-btn-secondary:hover:not(:disabled) { background: var(--sigep-blue-tint); }

.sigep-btn-ghost { background: transparent; border-color: transparent; color: var(--sigep-blue); }
.sigep-btn-ghost:hover:not(:disabled) { background: var(--sigep-blue-tint); }