/* UnoImobi · Design Tokens · Components (UI primitives)
 * Mockup-only — implementação real vive no repo da plataforma.
 * O bloco :root abaixo é gerado por `npm run build:tokens` a partir de tokens.json.
 */

/* === TOKENS:START (generated) === */
:root {
  /* Spacing scale (base 4px) */
  --space-1:   4px;
  --space-2:   8px;
  --space-3:   12px;
  --space-4:   16px;
  --space-5:   20px;
  --space-6:   24px;
  --space-8:   32px;
  --space-10:  40px;
  --space-12:  48px;
  --space-16:  64px;

  /* Border radius */
  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   12px;
  --radius-xl:   16px;
  --radius-pill: 999px;

  /* Shadows (refined) */
  --shadow-1:  0 1px 2px rgba(14,14,20,.04), 0 1px 1px rgba(14,14,20,.06);
  --shadow-2:  0 4px 12px rgba(14,14,20,.06), 0 2px 4px rgba(14,14,20,.04);
  --shadow-3:  0 12px 30px -12px rgba(14,14,20,.18);

  /* Motion */
  --ease-standard: cubic-bezier(.4, 0, .2, 1);
  --ease-entrance: cubic-bezier(0, 0, .2, 1);
  --duration-fast: .15s;
  --duration-base: .25s;
}
/* === TOKENS:END === */

/* === BUTTON === */
.c-btn {
  display: inline-flex; align-items: center; gap: var(--space-2);
  padding: var(--space-3) var(--space-5);
  font-family: var(--font-body); font-weight: 600; font-size: 14px;
  letter-spacing: -.005em;
  border-radius: var(--radius-md);
  border: none;
  cursor: pointer;
  transition: all var(--duration-fast) var(--ease-standard);
}
.c-btn-primary  { background: var(--primary); color: #fff; }
.c-btn-primary:hover  { background: var(--primary-600); }
.c-btn-secondary { background: var(--ink); color: #fff; }
.c-btn-secondary:hover { background: var(--ink-700); }
.c-btn-ghost   { background: transparent; color: var(--primary); }
.c-btn-ghost:hover  { background: var(--primary-50); }

/* === CARD === */
.c-card {
  background: var(--surface-1);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-lg);
  padding: var(--space-6);
  box-shadow: var(--shadow-1);
}

/* === INPUT === */
.c-input {
  width: 100%;
  padding: var(--space-3) var(--space-4);
  font-family: var(--font-body); font-size: 15px;
  background: var(--surface-1);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-md);
  color: var(--ink);
  transition: border-color var(--duration-fast) var(--ease-standard);
}
.c-input:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-100); }
.c-input::placeholder { color: var(--muted); }

/* === BADGE === */
.c-badge {
  display: inline-flex; align-items: center;
  padding: var(--space-1) var(--space-3);
  font-family: var(--font-body); font-weight: 600; font-size: 11px;
  letter-spacing: .04em; text-transform: uppercase;
  border-radius: var(--radius-pill);
}
.c-badge-urgent  { background: var(--accent); color: #fff; }
.c-badge-soft    { background: var(--accent-soft); color: var(--accent-deep); }
.c-badge-neutral { background: var(--ink-100); color: var(--ink-700); }

/* === LINK === */
.c-link {
  color: var(--primary);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color var(--duration-fast) var(--ease-standard);
}
.c-link:hover { border-bottom-color: var(--primary); }

/* === DIVIDER === */
.c-divider {
  height: 1px; width: 100%;
  background: var(--border-subtle);
  border: none; margin: var(--space-6) 0;
}