/*
 * ============================================================
 * Copyright (c) 2026 Agile Automate PTY (Ltd)
 * All Rights Reserved. Proprietary and Confidential.
 * ============================================================
 *
 * This software and its source code are the exclusive intellectual
 * property of Agile Automate PTY (Ltd). Unauthorised copying,
 * reproduction, modification, distribution, display, or transmission
 * of this software or any portion thereof is strictly prohibited.
 *
 * This code represents significant intellectual investment and was
 * developed exclusively by Agile Automate PTY (Ltd). No licence is
 * granted to any party to use, copy, modify, merge, publish,
 * distribute, sublicense, or sell copies of this software without
 * the express prior written consent of Agile Automate PTY (Ltd).
 *
 * Any unauthorised use, reverse engineering, or redistribution of
 * this code or its designs — including visual layouts, UI patterns,
 * workflow logic, and system architecture — constitutes an
 * infringement of intellectual property rights and will be pursued
 * to the fullest extent permitted under:
 *
 *   - The Copyright Act 98 of 1978 (Republic of South Africa)
 *   - The Electronic Communications and Transactions Act 25 of 2002
 *   - Applicable international intellectual property treaties
 *
 * Contact: info@agileautomate.co.za
 * ============================================================
 */
/* 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 !important;
  background: #262626 !important;
  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: #333333 !important; }
.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:#262626; color:#ffffff; }
.falcon-btn--black:hover:not(:disabled) { background:#111111; }
.falcon-btn--black:active:not(:disabled) { background:#262626; 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; }

/* Keep button wrapper rows neutral across pages (some pages rely on .btn-row wrappers). */
.btn-row,
.button-row {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* 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; }
}


