/* Component helpers matching original shadcn-style classes */
.btn {
  display: inline-flex;
  align-items: center;
  justify-center: center;
  justify-content: center;
  gap: .5rem;
  white-space: nowrap;
  border-radius: calc(var(--radius) - 2px);
  font-size: .875rem;
  line-height: 1.25rem;
  font-weight: 500;
  transition: color .15s, background-color .15s, border-color .15s, box-shadow .15s;
  border: 1px solid transparent;
  cursor: pointer;
  text-decoration: none;
  height: 2.25rem;
  padding: 0 1rem;
}
.btn:focus-visible {
  outline: none;
  box-shadow: 0 0 0 1px hsl(var(--ring));
}
.btn:disabled { pointer-events: none; opacity: .5; }
.btn-default {
  background: hsl(var(--primary));
  color: hsl(var(--primary-foreground));
  box-shadow: var(--shadow-sm);
}
.btn-default:hover { filter: brightness(.95); }
.btn-outline {
  border-color: hsl(var(--input));
  background: hsl(var(--background));
  box-shadow: var(--shadow-sm);
  color: hsl(var(--foreground));
}
.btn-outline:hover { background: hsl(var(--accent)); color: hsl(var(--accent-foreground)); }
.btn-ghost {
  background: transparent;
  color: hsl(var(--foreground));
}
.btn-ghost:hover { background: hsl(var(--accent)); color: hsl(var(--accent-foreground)); }
.btn-lg { height: 2.5rem; padding: 0 2rem; border-radius: calc(var(--radius) - 2px); }
.btn-hero { height: 3.5rem; padding: 0 2rem; font-size: 1.125rem; }
.btn-icon { height: 2.25rem; width: 2.25rem; padding: 0; }
.btn-full { width: 100%; }

.card {
  border-radius: .75rem;
  border: 1px solid hsl(var(--border));
  background: hsl(var(--card));
  color: hsl(var(--card-foreground));
  box-shadow: var(--shadow);
}
.card-header { display: flex; flex-direction: column; gap: .375rem; padding: 1.5rem; }
.card-title { font-weight: 600; letter-spacing: -.025em; line-height: 1; }
.card-desc { font-size: .875rem; color: hsl(var(--muted-foreground)); }
.card-body { padding: 1.5rem; padding-top: 0; }

.input, .select, .textarea {
  display: flex;
  width: 100%;
  border-radius: calc(var(--radius) - 2px);
  border: 1px solid hsl(var(--input));
  background: transparent;
  padding: .25rem .75rem;
  font-size: 1rem;
  box-shadow: var(--shadow-sm);
  color: hsl(var(--foreground));
  transition: box-shadow .15s, border-color .15s;
}
.input, .select { height: 2.25rem; }
.select { height: 2.5rem; padding: .5rem .75rem; background: hsl(var(--background)); }
.textarea { min-height: 60px; padding: .5rem .75rem; resize: vertical; }
.input:focus-visible, .select:focus-visible, .textarea:focus-visible {
  outline: none;
  box-shadow: 0 0 0 1px hsl(var(--ring));
}
.label { font-size: .875rem; font-weight: 500; line-height: 1; }
.form-group { display: flex; flex-direction: column; gap: .5rem; }

.badge-pill {
  display: inline-flex;
  align-items: center;
  border-radius: 9999px;
  border: 1px solid hsl(var(--border));
  background: hsl(var(--muted) / .5);
  padding: .25rem .75rem;
  font-size: .875rem;
  font-weight: 500;
}

.legal-nav a {
  display: block;
  padding: .5rem .75rem;
  border-radius: calc(var(--radius) - 2px);
  color: hsl(var(--muted-foreground));
  text-decoration: none;
  font-size: .875rem;
}
.legal-nav a:hover, .legal-nav a.active {
  background: hsl(var(--muted));
  color: hsl(var(--foreground));
}

.prose-legal h2 {
  font-size: 1.25rem;
  font-weight: 600;
  margin: 2rem 0 .75rem;
  color: hsl(var(--foreground));
}
.prose-legal p {
  color: hsl(var(--muted-foreground));
  margin-bottom: 1rem;
  line-height: 1.7;
}
.prose-legal a { color: hsl(var(--primary)); }

.mobile-nav { display: none; }
.mobile-nav.open { display: flex; }
.mobile-menu-btn { display: none !important; }
.nav-desktop { display: none; }
@media (min-width: 768px) {
  .nav-desktop { display: flex !important; }
  .mobile-menu-btn { display: none !important; }
  .mobile-nav, .mobile-nav.open { display: none !important; }
}
@media (max-width: 767px) {
  .nav-desktop { display: none !important; }
  .auth-desktop-text { display: none !important; }
  .mobile-menu-btn { display: inline-flex !important; }
}

/* Ensure size utilities exist */
.size-5 { width: 1.25rem; height: 1.25rem; }
.size-6 { width: 1.5rem; height: 1.5rem; }
.size-8 { width: 2rem; height: 2rem; }
.size-10 { width: 2.5rem; height: 2.5rem; }
.size-12 { width: 3rem; height: 3rem; }
.shrink-0 { flex-shrink: 0; }
.break-all { word-break: break-all; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
details > summary::-webkit-details-marker { display: none; }

.brand-logo {
  display: block;
  object-fit: contain;
  flex-shrink: 0;
  border-radius: .55rem;
}
.brand-logo-sm { width: 1.5rem; height: 1.5rem; }
.brand-logo-md { width: 2rem; height: 2rem; }
.brand-logo-lg { width: 3rem; height: 3rem; }
.brand-link {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  text-decoration: none;
  color: inherit;
}

.hero-grid {
  background-image:
    linear-gradient(90deg, #80808012 1px, transparent 1px),
    linear-gradient(#80808012 1px, transparent 1px);
  background-size: 24px 24px;
}

.toast {
  position: fixed;
  bottom: 1.5rem;
  right: 1.5rem;
  z-index: 100;
  background: hsl(var(--foreground));
  color: hsl(var(--background));
  padding: 1rem 1.25rem;
  border-radius: .5rem;
  box-shadow: var(--shadow-md);
  max-width: 22rem;
  animation: toast-in .25s ease;
}
.toast strong { display: block; margin-bottom: .25rem; }
.toast p { font-size: .875rem; opacity: .85; margin: 0; }
@keyframes toast-in {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
