/* Kaivros UI Kit — shared component styles */
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: var(--font-body); color: var(--fg1); background: var(--cream); min-height: 100vh; }
button { font-family: inherit; }

/* === Buttons === */
.k-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  font-family: var(--font-heading); font-weight: 600;
  border-radius: var(--radius-md); padding: .625rem 1rem;
  font-size: 14px; height: 2.5rem; border: none; cursor: pointer;
  transition: all .2s ease; white-space: nowrap;
}
.k-btn--primary { background: var(--lilla-md); color: #fff; box-shadow: var(--shadow-sm); }
.k-btn--primary:hover { background: var(--lilla-dk); }
.k-btn--secondary { background: var(--cream); color: var(--fg1); border: 1px solid var(--border); }
.k-btn--secondary:hover { background: var(--lilla-lt); }
.k-btn--outline { background: transparent; color: var(--lilla-md); border: 1.5px solid var(--lilla-md); }
.k-btn--outline:hover { background: var(--lilla-lt); }
.k-btn--ghost { background: transparent; color: var(--fg1); }
.k-btn--ghost:hover { background: var(--cream); }
.k-btn--accent { background: var(--orange); color: #fff; }
.k-btn--accent:hover { background: var(--orange-md); }
.k-btn--sm { padding: .5rem .875rem; height: 2.25rem; font-size: 13px; }
.k-btn--lg { padding: .75rem 1.25rem; height: 2.75rem; font-size: 16px; }

/* === Input === */
.k-field { display: flex; flex-direction: column; gap: 6px; }
.k-field label {
  font-family: var(--font-heading); font-weight: 600; font-size: 12px;
  color: var(--fg1); letter-spacing: .02em;
}
.k-input {
  font-family: var(--font-body); color: var(--fg1); background: #fff;
  border: 1.5px solid var(--border-strong); border-radius: var(--radius-md);
  height: 2.75rem; padding: 8px 16px; font-size: 14px; outline: none;
  transition: all .2s ease; width: 100%;
}
.k-input:focus { border-color: var(--lilla-md); box-shadow: 0 0 0 3px rgba(169,143,216,.2); }
.k-field .hint { font-size: 12px; color: var(--fg3); }

/* === Card === */
.k-card {
  background: #fff; border-radius: var(--radius-lg); padding: 20px;
  border: 1px solid var(--border); box-shadow: var(--shadow-card);
  transition: all .2s ease;
}
.k-card--hover:hover { transform: translateY(-4px); box-shadow: var(--shadow-float); }

/* === Badge === */
.k-badge {
  display: inline-flex; align-items: center; gap: 4px;
  font-family: var(--font-heading); font-weight: 600; font-size: 12px;
  border-radius: var(--radius-full); padding: 4px 10px; line-height: 1; height: 1.5rem;
}
.k-badge--primary { background: var(--lilla-lt); color: var(--violet-lt); }
.k-badge--success { background: #E8F0E0; color: #5A7A4A; }
.k-badge--warning { background: #FFF5E0; color: #B8956A; }
.k-badge--accent { background: var(--orange-lt); color: var(--orange-md); }
.k-badge--neutral { background: #F2F0EB; color: var(--fg2); }

/* === Wordmark === */
.k-wm { display: inline-flex; align-items: baseline; line-height: 1; letter-spacing: .05em; }
.k-wm .kk { font-family: var(--font-display); font-weight: 700; }
.k-wm .rr { font-family: var(--font-heading); font-weight: 500; }