/*
 * Dasfabri Design System
 * Direção visual: Cirrus (Uiverse)
 * Estrutura de componentes: Flowbite Community / Tailwind
 */

:root {
  /* Primitivos — marca */
  --df-blue-50: #f2f7ff;
  --df-blue-100: #e4efff;
  --df-blue-200: #c9dfff;
  --df-blue-300: #9fc7ff;
  --df-blue-400: #6ca5f4;
  --df-blue-500: #2f7ddd;
  --df-blue-600: #0059c8;
  --df-blue-700: #004aa8;
  --df-blue-800: #003c85;
  --df-blue-900: #002958;
  --df-blue-950: #001833;

  /* Primitivos — neutros Flowbite */
  --df-white: #ffffff;
  --df-slate-50: #f8fafc;
  --df-slate-100: #f1f5f9;
  --df-slate-200: #e2e8f0;
  --df-slate-300: #cbd5e1;
  --df-slate-500: #64748b;
  --df-slate-600: #475569;
  --df-slate-700: #334155;
  --df-slate-900: #0f172a;

  /* Semânticos */
  --df-color-bg: var(--df-white);
  --df-color-bg-soft: var(--df-blue-50);
  --df-color-surface: rgba(255, 255, 255, 0.9);
  --df-color-text: var(--df-slate-900);
  --df-color-muted: var(--df-slate-600);
  --df-color-primary: var(--df-blue-600);
  --df-color-primary-hover: var(--df-blue-800);
  --df-color-border: rgba(148, 163, 184, 0.24);
  --df-color-ring: rgba(0, 89, 200, 0.2);

  /* Tipografia */
  --df-font-sans: "Inter", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --df-font-display: "Poppins", var(--df-font-sans);
  --df-font-accent: Georgia, "Times New Roman", serif;

  /* Forma Cirrus */
  --df-radius-sm: 0.75rem;
  --df-radius-md: 1rem;
  --df-radius-lg: 1.5rem;
  --df-radius-xl: 2rem;
  --df-radius-pill: 9999px;

  /* Elevação leve */
  --df-shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.04);
  --df-shadow-sm: 0 8px 24px -16px rgba(0, 60, 133, 0.2);
  --df-shadow-md: 0 20px 52px -28px rgba(0, 60, 133, 0.28);
  --df-shadow-float: 0 32px 80px -36px rgba(0, 60, 133, 0.32);

  /* Movimento */
  --df-duration-fast: 150ms;
  --df-duration-normal: 240ms;
  --df-ease: cubic-bezier(0.22, 1, 0.36, 1);

  /* Componentes */
  --df-button-radius: var(--df-radius-pill);
  --df-card-radius: var(--df-radius-lg);
  --df-card-bg: var(--df-color-surface);
  --df-card-border: var(--df-color-border);
  --df-card-shadow: var(--df-shadow-sm);
  --df-input-radius: var(--df-radius-md);
  --df-nav-radius: var(--df-radius-pill);
}