/**
 * Button variants — plain CSS for Tailwind CDN pages (from src/base/base.css)
 * Works with both "btn-secondary" and "btn btn-secondary" class patterns.
 */

.btn,
.btn-default,
.btn-locked,
.btn-primary,
.btn-primary-outline,
.btn-secondary,
.btn-secondary-outline,
.btn-danger,
.btn-danger-outline,
.btn-super,
.btn-super-outline,
.btn-ghost,
.btn-sidebar,
.btn-sidebar-active,
a.btn-sidebar,
a.btn-sidebar-active {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  border-radius: 0.75rem;
  font-size: 0.875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  transition: color 0.15s, background-color 0.15s, border-color 0.15s;
  cursor: pointer;
  text-decoration: none;
  border-style: solid;
  font-family: inherit;
  line-height: 1.25rem;
}

.btn-default {
  background: #fff;
  color: #64748b;
  border-color: #e2e8f0;
  border-width: 2px;
  border-bottom-width: 4px;
  height: 2.75rem;
  padding: 0 1rem;
}
.btn-default:hover { background: #f1f5f9; }
.btn-default:active { border-bottom-width: 2px; }

.btn-locked {
  background: #e5e5e5;
  color: #f8fafc;
  border-color: #a3a3a3;
  border-width: 2px;
  border-bottom-width: 4px;
}
.btn-locked:hover { background: rgba(229, 229, 229, 0.9); }
.btn-locked:active { border-bottom-width: 0; }

.btn-primary {
  background: #38bdf8;
  color: #f8fafc;
  border-color: #0ea5e9;
  border-width: 2px;
  border-bottom-width: 4px;
}
.btn-primary:hover { background: rgba(56, 189, 248, 0.9); }
.btn-primary:active { border-bottom-width: 0; }

.btn-primary-outline {
  background: #fff;
  color: #0ea5e9;
  border-color: transparent;
  border-width: 0;
}
.btn-primary-outline:hover { background: #f1f5f9; }

.btn-secondary {
  background: #22c55e;
  color: #f8fafc;
  border-color: #16a34a;
  border-width: 2px;
  border-bottom-width: 4px;
}
.btn-secondary:hover { background: rgba(34, 197, 94, 0.9); }
.btn-secondary:active { border-bottom-width: 0; }

.btn-secondary-outline {
  background: #fff;
  color: #22c55e;
  border-color: transparent;
  border-width: 0;
}
.btn-secondary-outline:hover { background: #f1f5f9; }

.btn-danger {
  background: #f43f5e;
  color: #f8fafc;
  border-color: #e11d48;
  border-width: 2px;
  border-bottom-width: 4px;
}
.btn-danger:hover { background: rgba(244, 63, 94, 0.9); }
.btn-danger:active { border-bottom-width: 0; }

.btn-danger-outline {
  background: #fff;
  color: #f43f5e;
  border-color: transparent;
  border-width: 0;
}
.btn-danger-outline:hover { background: #f1f5f9; }

.btn-super {
  background: #6366f1;
  color: #f8fafc;
  border-color: #4f46e5;
  border-width: 2px;
  border-bottom-width: 4px;
}
.btn-super:hover { background: rgba(99, 102, 241, 0.9); }
.btn-super:active { border-bottom-width: 0; }

.btn-super-outline {
  background: #fff;
  color: #6366f1;
  border-color: transparent;
  border-width: 0;
}
.btn-super-outline:hover { background: #f1f5f9; }

.btn-ghost {
  background: transparent;
  color: #64748b;
  border-color: transparent;
  border-width: 0;
}
.btn-ghost:hover { background: #f1f5f9; }

.btn-sidebar {
  background: transparent;
  color: #64748b;
  border-color: transparent;
  border-width: 2px;
}
.btn-sidebar:hover { background: #f1f5f9; }

.btn-sidebar-active {
  background: rgba(14, 165, 233, 0.15);
  color: #0ea5e9;
  border-color: #7dd3fc;
  border-width: 2px;
}
.btn-sidebar-active:hover { background: rgba(14, 165, 233, 0.2); }

.btn-sm { height: 2.25rem; padding: 0 0.75rem; }
.btn-lg { height: 3rem; padding: 0 2rem; }
.btn-rounded { border-radius: 9999px; }

.text-primary-foreground { color: #f8fafc; }
.fill-primary-foreground { fill: #f8fafc; }
