/* ==========================================================================
   HAWKEYE Icon Library - Semantic HTML Tags
   ========================================================================== */

/* Base icon styles - scoped to icon containers */
.ce-icons [class*='icon-']:before,
.ce-icons important:before,
.ce-icons warning:before,
.ce-icons success:before,
.ce-icons error:before,
.ce-icons info:before,
.ce-icons edit:before,
.ce-icons delete:before,
.ce-icons save:before,
.ce-icons cancel:before,
.ce-icons add:before,
.ce-icons remove:before,
.ce-icons home:before,
.ce-icons back:before,
.ce-icons forward:before,
.ce-icons refresh:before,
.ce-icons settings:before,
.ce-icons chart:before,
.ce-icons ganttchart:before,
.ce-icons table:before,
.ce-icons download:before,
.ce-icons upload:before,
.ce-icons export:before,
.ce-icons import:before,
.ce-icons money:before,
.ce-icons time:before,
.ce-icons user:before,
.ce-icons users:before,
.ce-icons calendar:before,
.ce-icons clock:before,
.ce-icons search:before,
.ce-icons filter:before,
.ce-icons sort:before,
.ce-icons view:before,
.ce-icons hide:before,
.ce-icons show:before,
.ce-icons lock:before,
.ce-icons unlock:before,
.ce-icons secure:before,
.ce-icons alert:before,
.ce-icons notification:before,
.ce-icons check:before,
.ce-icons cross:before,
.ce-icons plus:before,
.ce-icons minus:before,
.ce-icons arrow-up:before,
.ce-icons arrow-down:before,
.ce-icons arrow-left:before,
.ce-icons arrow-right:before,
.ce-icons chevron-up:before,
.ce-icons chevron-down:before,
.ce-icons chevron-left:before,
.ce-icons chevron-right:before,
.ce-icons expand:before,
.ce-icons collapse:before,
.ce-icons help:before,
.ce-icons question:before,
.ce-icons support:before,
.ce-icons documentation:before,
.ce-icons guide:before,
.ce-icons database:before,
.ce-icons server:before,
.ce-icons cloud:before,
.ce-icons network:before,
.ce-icons code:before,
.ce-icons bug:before,
.ce-icons fix:before,
.ce-icons test:before,
.ce-icons deploy:before,
.ce-icons build:before,
.ce-icons mail:before,
.ce-icons phone:before,
.ce-icons location:before,
.ce-icons link:before,
.ce-icons file:before,
.ce-icons folder:before,
.ce-icons pointer:before,
.ce-icons pointer-right:before {
  font-family: 'Font Awesome 6 Free', 'Font Awesome 6 Brands';
  font-weight: 900;
  display: inline-block;
  margin-right: 0.5em;
  font-style: normal;
  vertical-align: baseline;
  line-height: 1;
}

/* Status Icons */
.ce-icons important:before {
  content: '\f06a';
  color: var(--accent-color);
}
.ce-icons warning:before {
  content: '\f071';
  color: #ff9800;
}
.ce-icons success:before {
  content: '\f058';
  color: #4caf50;
}
.ce-icons error:before {
  content: '\f057';
  color: #f44336;
}
.ce-icons info:before {
  content: '\f05a';
  color: var(--primary-color);
}
.ce-icons alert:before {
  content: '\f0f3';
  color: #ff5722;
}
.ce-icons notification:before {
  content: '\f0a2';
  color: var(--primary-color);
}

/* Action Icons */
.ce-icons edit:before {
  content: '\f044';
  color: var(--primary-color);
}
.ce-icons delete:before {
  content: '\f2ed';
  color: #f44336;
}
.ce-icons save:before {
  content: '\f0c7';
  color: #4caf50;
}
.ce-icons cancel:before {
  content: '\f00d';
  color: #f44336;
}
.ce-icons add:before {
  content: '\f067';
  color: #4caf50;
}
.ce-icons remove:before {
  content: '\f068';
  color: #f44336;
}
.ce-icons refresh:before {
  content: '\f021';
  color: var(--primary-color);
}
.ce-icons settings:before {
  content: '\f013';
  color: var(--neutral-dark);
}

/* Navigation Icons */
.ce-icons home:before {
  content: '\f015';
  color: var(--primary-color);
}
.ce-icons back:before {
  content: '\f053';
  color: var(--primary-color);
}
.ce-icons forward:before {
  content: '\f054';
  color: var(--primary-color);
}
.ce-icons arrow-up:before {
  content: '\f062';
  color: var(--primary-color);
}
.ce-icons arrow-down:before {
  content: '\f063';
  color: var(--primary-color);
}
.ce-icons arrow-left:before {
  content: '\f060';
  color: var(--primary-color);
}
.ce-icons arrow-right:before {
  content: '\f061';
  color: var(--primary-color);
}
.ce-icons chevron-up:before {
  content: '\f077';
  color: var(--neutral-dark);
}
.ce-icons chevron-down:before {
  content: '\f078';
  color: var(--neutral-dark);
}
.ce-icons chevron-left:before {
  content: '\f053';
  color: var(--neutral-dark);
}
.ce-icons chevron-right:before {
  content: '\f054';
  color: var(--neutral-dark);
}

/* Data & Analytics Icons */
.ce-icons chart:before {
  content: '\f201';
  color: var(--primary-color);
}
.ce-icons ganttchart:before {
  content: '\f542';
  color: var(--primary-color);
}
.ce-icons table:before {
  content: '\f0ce';
  color: var(--primary-color);
}
.ce-icons download:before {
  content: '\f019';
  color: #4caf50;
}
.ce-icons upload:before {
  content: '\f093';
  color: var(--primary-color);
}
.ce-icons export:before {
  content: '\f56e';
  color: var(--primary-color);
}
.ce-icons import:before {
  content: '\f56f';
  color: var(--primary-color);
}
.ce-icons database:before {
  content: '\f1c0';
  color: var(--primary-color);
}
.ce-icons server:before {
  content: '\f233';
  color: var(--neutral-dark);
}

/* Business Icons */
.ce-icons money:before {
  content: '\f155';
  color: #4caf50;
}
.ce-icons time:before {
  content: '\f017';
  color: var(--neutral-dark);
}
.ce-icons user:before {
  content: '\f007';
  color: var(--primary-color);
}
.ce-icons users:before {
  content: '\f0c0';
  color: var(--primary-color);
}
.ce-icons calendar:before {
  content: '\f073';
  color: var(--primary-color);
}
.ce-icons clock:before {
  content: '\f017';
  color: var(--neutral-dark);
}

/* Interface Icons */
.ce-icons search:before {
  content: '\f002';
  color: var(--neutral-dark);
}
.ce-icons filter:before {
  content: '\f0b0';
  color: var(--neutral-dark);
}
.ce-icons sort:before {
  content: '\f0dc';
  color: var(--neutral-dark);
}
.ce-icons view:before {
  content: '\f06e';
  color: var(--primary-color);
}
.ce-icons hide:before {
  content: '\f070';
  color: var(--neutral-dark);
}
.ce-icons show:before {
  content: '\f06e';
  color: var(--primary-color);
}
.ce-icons expand:before {
  content: '\f065';
  color: var(--neutral-dark);
}
.ce-icons collapse:before {
  content: '\f066';
  color: var(--neutral-dark);
}
.ce-icons pointer:before {
  content: '\f25a';
  color: var(--primary-color);
}
.ce-icons pointer-right:before {
  content: '\f0a4';
  color: orange;
}
.ce-icons pointer-left:before {
  content: '\f0a5';
  color: var(--accent-color);
}

/* Security Icons */
.ce-icons lock:before {
  content: '\f023';
  color: var(--accent-color);
}
.ce-icons unlock:before {
  content: '\f09c';
  color: #ff9800;
}
.ce-icons secure:before {
  content: '\f132';
  color: #4caf50;
}

/* Feedback Icons */
.ce-icons check:before {
  content: '\f00c';
  color: #4caf50;
}
.ce-icons cross:before {
  content: '\f00d';
  color: #f44336;
}
.ce-icons plus:before {
  content: '\f067';
  color: #4caf50;
}
.ce-icons minus:before {
  content: '\f068';
  color: #f44336;
}

/* Help & Support Icons */
.ce-icons help:before {
  content: '\f059';
  color: var(--primary-color);
}
.ce-icons question:before {
  content: '\f128';
  color: var(--primary-color);
}
.ce-icons support:before {
  content: '\f1cd';
  color: var(--primary-color);
}
.ce-icons documentation:before {
  content: '\f02d';
  color: var(--neutral-dark);
}
.ce-icons guide:before {
  content: '\f277';
  color: var(--primary-color);
}

/* Technical Icons */
.ce-icons code:before {
  content: '\f121';
  color: var(--neutral-dark);
}
.ce-icons bug:before {
  content: '\f188';
  color: #f44336;
}
.ce-icons fix:before {
  content: '\f0ad';
  color: #4caf50;
}
.ce-icons test:before {
  content: '\f0e7';
  color: var(--primary-color);
}
.ce-icons deploy:before {
  content: '\f1e6';
  color: var(--primary-color);
}
.ce-icons build:before {
  content: '\f1b3';
  color: var(--neutral-dark);
}
.ce-icons cloud:before {
  content: '\f0c2';
  color: var(--primary-color);
}
.ce-icons network:before {
  content: '\f6ff';
  color: var(--neutral-dark);
}

/* Communication Icons */
.ce-icons mail:before {
  content: '\f0e0';
  color: var(--primary-color);
}
.ce-icons phone:before {
  content: '\f095';
  color: var(--neutral-dark);
}
.ce-icons location:before {
  content: '\f3c5';
  color: var(--accent-color);
}
.ce-icons link:before {
  content: '\f0c1';
  color: var(--primary-color);
}

/* File & Folder Icons */
.ce-icons file:before {
  content: '\f15b';
  color: var(--neutral-dark);
}
.ce-icons folder:before {
  content: '\f07b';
  color: #ff9800;
}

/* Icon Size Modifiers */
.icon-xs {
  font-size: 0.75em;
}
.icon-sm {
  font-size: 0.875em;
}
.icon-lg {
  font-size: 1.25em;
}
.icon-xl {
  font-size: 1.5em;
}
.icon-2x {
  font-size: 2em;
}

/* Icon Color Modifiers */
.icon-primary:before {
  color: var(--primary-color) !important;
}
.icon-accent:before {
  color: var(--accent-color) !important;
}
.icon-success:before {
  color: #4caf50 !important;
}
.icon-warning:before {
  color: #ff9800 !important;
}
.icon-error:before {
  color: #f44336 !important;
}
.icon-muted:before {
  color: var(--neutral-light) !important;
}
.icon-dark:before {
  color: var(--neutral-dark) !important;
}

/* Icon without margin (for tight spacing) */
.ce-icons .icon-no-margin:before,
.ce-icons important.no-margin:before,
.ce-icons warning.no-margin:before,
.ce-icons success.no-margin:before,
.ce-icons error.no-margin:before,
.ce-icons info.no-margin:before,
.ce-icons edit.no-margin:before,
.ce-icons delete.no-margin:before,
.ce-icons save.no-margin:before,
.ce-icons cancel.no-margin:before {
  margin-right: 0;
}

/* Icon only (no text content) */
.ce-icons .icon-only:before,
.ce-icons important.only:before,
.ce-icons warning.only:before,
.ce-icons success.only:before,
.ce-icons error.only:before,
.ce-icons info.only:before,
.ce-icons edit.only:before,
.ce-icons delete.only:before,
.ce-icons save.only:before,
.ce-icons cancel.only:before {
  margin-right: 0;
}

/* Hover effects for clickable icons */
.ce-icons important:hover:before,
.ce-icons warning:hover:before,
.ce-icons success:hover:before,
.ce-icons error:hover:before,
.ce-icons info:hover:before,
.ce-icons edit:hover:before,
.ce-icons delete:hover:before,
.ce-icons save:hover:before,
.ce-icons cancel:hover:before,
.ce-icons add:hover:before,
.ce-icons remove:hover:before,
.ce-icons refresh:hover:before,
.ce-icons settings:hover:before {
  opacity: 0.7;
  transform: scale(1.1);
  transition: all 0.2s ease;
}

/* Spinning animation for refresh and loading icons */
.ce-icons refresh.spinning:before {
  animation: spin 1s linear infinite;
}

/* Pulse animation for notifications and alerts */
.ce-icons notification.pulse:before,
.ce-icons alert.pulse:before {
  animation: pulse 2s infinite;
}

@keyframes pulse {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
  100% {
    opacity: 1;
  }
}

/* Icon in buttons */
.ce-export-button .ce-icons important:before,
.ce-export-button important:before,
.ce-export-button .ce-icons download:before,
.ce-export-button download:before,
.ce-export-button .ce-icons save:before,
.ce-export-button save:before {
  margin-right: 0.5em;
  color: currentColor;
}

/* Icon in table headers */
.ce-magic-table th .ce-icons important:before,
.ce-magic-table th important:before,
.ce-magic-table th .ce-icons warning:before,
.ce-magic-table th warning:before,
.ce-magic-table th .ce-icons info:before,
.ce-magic-table th info:before {
  margin-right: 0.25em;
  font-size: 0.9em;
}

/* Icon in navigation */
.nav-item .ce-icons important:before,
.nav-item important:before,
.nav-item .ce-icons info:before,
.nav-item info:before,
.nav-item .ce-icons settings:before,
.nav-item settings:before,
.nav-item .ce-icons home:before,
.nav-item home:before {
  margin-right: 0.5em;
  color: currentColor;
}

.clickable-icon:hover {
  cursor: pointer;
}
