/* Falcon Unified Button Styles */
:root {
  --falcon-font-stack: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif;
  --falcon-btn-height: 44px;
  --falcon-btn-radius: 6px;
  --falcon-btn-fsz: 14px;
  --falcon-btn-fw: 600;
  --falcon-green: #16a34a; /* primary */
  --falcon-green-hover: #15803d;
  --falcon-green-active: #166534;
  --falcon-red: #dc2626; /* danger */
  --falcon-red-hover: #b91c1c;
  --falcon-red-active: #991b1b;
  --falcon-neutral: #334155; /* slate 700 */
  --falcon-neutral-hover: #1e293b;
  --falcon-neutral-active: #0f172a;
  --falcon-action-gray: #404040; /* Falcon Grey for main action buttons */
  --falcon-action-gray-hover: #303030;
  --falcon-action-gray-active: #222222;
  --falcon-outline: #0f172a;
  --falcon-focus-ring: rgba(59,130,246,0.5);
  --falcon-transition: 140ms cubic-bezier(.4,0,.2,1);
}

.falcon-btn {
  -webkit-font-smoothing: antialiased;
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: var(--falcon-btn-height);
  padding: 0 20px;
  border-radius: var(--falcon-btn-radius);
  font-family: var(--falcon-font-stack);
  font-size: var(--falcon-btn-fsz);
  font-weight: var(--falcon-btn-fw);
  line-height: 1;
  letter-spacing: .02em;
  border: none;
  cursor: pointer;
  color: #ffffff;
  background: var(--falcon-neutral);
  position: relative;
  user-select: none;
  text-decoration: none;
  transition: background var(--falcon-transition), box-shadow var(--falcon-transition), transform var(--falcon-transition);
}

.falcon-btn:hover:not(:disabled) { background: var(--falcon-neutral-hover); }
.falcon-btn:active:not(:disabled) { background: var(--falcon-neutral-active); transform: translateY(1px); }
.falcon-btn:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--falcon-focus-ring); }
.falcon-btn:disabled { opacity: .55; cursor: not-allowed; box-shadow: none; }

/* Variants */
.falcon-btn--primary { background: var(--falcon-green); }
.falcon-btn--primary:hover:not(:disabled) { background: var(--falcon-green-hover); }
.falcon-btn--primary:active:not(:disabled) { background: var(--falcon-green-active); }

.falcon-btn--danger { background: var(--falcon-red); }
.falcon-btn--danger:hover:not(:disabled) { background: var(--falcon-red-hover); }
.falcon-btn--danger:active:not(:disabled) { background: var(--falcon-red-active); }

.falcon-btn--neutral { background: var(--falcon-neutral); }

/* Action variant (Falcon Grey) */
.falcon-btn--action { background: var(--falcon-action-gray); color:#ffffff; }
.falcon-btn--action:hover:not(:disabled) { background: var(--falcon-action-gray-hover); }
.falcon-btn--action:active:not(:disabled) { background: var(--falcon-action-gray-active); }

/* Black variant for "Add New" buttons */
.falcon-btn--black { background:#000000; color:#ffffff; }
.falcon-btn--black:hover:not(:disabled) { background:#111111; }
.falcon-btn--black:active:not(:disabled) { background:#000000; transform: translateY(1px); }

.falcon-btn--outline {
  background: #ffffff;
  color: var(--falcon-outline);
  border: 2px solid var(--falcon-outline);
}
.falcon-btn--outline:hover:not(:disabled) { background: var(--falcon-outline); color: #ffffff; }
.falcon-btn--outline:active:not(:disabled) { background: var(--falcon-outline-active, var(--falcon-neutral-active)); }

/* Size modifiers (optional future use) */
.falcon-btn--sm { height: 34px; padding: 0 14px; font-size: 13px; }
.falcon-btn--lg { height: 52px; padding: 0 26px; font-size: 15px; }

/* Icon adjustments */
.falcon-btn svg, .falcon-btn i { width: 18px; height: 18px; flex: 0 0 auto; }

/* Legacy / non-upgraded buttons fallback (ensures uniform font, size, color) */
button:not(.falcon-btn),
.btn:not(.falcon-btn) {
  font-family: var(--falcon-font-stack) !important;
  font-size: var(--falcon-btn-fsz) !important;
  font-weight: var(--falcon-btn-fw) !important;
  height: var(--falcon-btn-height) !important;
  padding: 0 20px !important;
  border-radius: var(--falcon-btn-radius) !important;
  display: inline-flex !important;
  align-items: center; justify-content: center; gap:8px;
  background: var(--falcon-neutral) !important;
  color: #ffffff !important;
  border: none !important;
  cursor: pointer;
  transition: background var(--falcon-transition), transform var(--falcon-transition);
  line-height:1;
}
button:not(.falcon-btn):hover, .btn:not(.falcon-btn):hover { background: var(--falcon-neutral-hover) !important; }
button:not(.falcon-btn):active, .btn:not(.falcon-btn):active { background: var(--falcon-neutral-active) !important; transform: translateY(1px); }
button:not(.falcon-btn):focus-visible, .btn:not(.falcon-btn):focus-visible { outline:none; box-shadow:0 0 0 3px var(--falcon-focus-ring); }
button:not(.falcon-btn)[disabled], .btn:not(.falcon-btn)[disabled] { opacity:.55; cursor:not-allowed; }

/* Loading state (optional) */
.falcon-btn.is-loading { position: relative; color: transparent !important; }
.falcon-btn.is-loading::after { content: ""; position: absolute; width: 18px; height: 18px; border-radius: 50%; border: 2px solid #fff; border-top-color: rgba(255,255,255,0.35); animation: falcon-spin 0.8s linear infinite; }
@keyframes falcon-spin { to { transform: rotate(360deg); } }

/* Group container */
.falcon-btn-group { display: inline-flex; gap: 8px; flex-wrap: wrap; }
.falcon-btn-group .falcon-btn { flex: 0 0 auto; }

/* High contrast mode support */
@media (forced-colors: active) {
  .falcon-btn, .falcon-btn--outline { forced-color-adjust: none; border: 1px solid ButtonText; }
  .falcon-btn { background: ButtonFace; color: ButtonText; }
  .falcon-btn--primary { background: ButtonText; color: ButtonFace; }
  .falcon-btn--danger { background: ButtonText; color: ButtonFace; }
  .falcon-btn--outline { background: Canvas; color: ButtonText; }
}
