/* Global polish — hover states, transitions, toast, mobile nav.
   Loaded after tokens/shell/tasks/modules so it wins on specificity. */

/* Card + row lift on hover — very subtle */
.card, .acc-card, .cost-card, .file-row, .progress-panel, .priority-panel {
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}
.card:hover, .acc-card:hover, .cost-card:hover, .file-row:hover {
  border-color: var(--border-strong);
  box-shadow: 0 1px 3px rgba(20, 20, 19, 0.04);
}

/* Buttons — snappy hover, disabled state, saving spinner text */
.btn { transition: border-color 0.12s ease, background 0.12s ease, transform 0.06s ease; }
.btn:active:not(:disabled) { transform: translateY(1px); }
.btn:disabled { opacity: 0.55; cursor: wait; }

/* Inputs / textareas / selects — consistent focus ring */
input, textarea, select {
  transition: border-color 0.12s ease, box-shadow 0.12s ease;
}
input:focus, textarea:focus, select:focus {
  box-shadow: 0 0 0 3px rgba(216, 90, 48, 0.14);
}

/* Toast */
.toast {
  position: fixed; bottom: 20px; right: 20px;
  background: var(--ink); color: var(--paper);
  padding: 10px 18px; border-radius: var(--radius);
  font-size: 13px; font-family: var(--font-body);
  opacity: 0; transform: translateY(10px);
  transition: opacity 0.18s ease, transform 0.18s ease;
  pointer-events: none;
  z-index: 200;
  box-shadow: 0 8px 24px rgba(20, 20, 19, 0.16);
  max-width: 320px;
}
.toast.show { opacity: 1; transform: translateY(0); }
.toast.toast-err { background: var(--cta); }

/* Hamburger retired — the category menu is now a floating bottom bar. */
.hamburger { display: none; }

/* Skeleton loader */
.skeleton {
  background: linear-gradient(90deg, var(--hover-bg) 0%, var(--border-soft) 50%, var(--hover-bg) 100%);
  background-size: 200% 100%;
  border-radius: var(--radius);
  animation: skeleton 1.2s ease-in-out infinite;
  min-height: 14px;
}
@keyframes skeleton {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}
