/* Icon Font Fixes - Preserve Tabler Icons */

/* ===== CRITICAL ICON FONT PRESERVATION ===== */
/* Override any font-family changes that affect icons */

/* Tabler Icons - Force correct font family */
.ti,
[class*="ti-"]:not(.message-greeting):not(.message-text):not(.system-message-content):not(span):not(div):not(p):not(h1):not(h2):not(h3):not(h4):not(h5):not(h6),
.tabler-icon,
.icon {
  font-family: 'tabler-icons' !important;
  font-style: normal !important;
  font-variant: normal !important;
  font-weight: normal !important;
  font-size: inherit !important;
  line-height: 1 !important;
  text-decoration: none !important;
  text-rendering: optimizeLegibility !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  speak: none !important;
  display: inline-block !important;
  vertical-align: middle !important;
}

/* Specifically exclude text elements from icon font */
.message-greeting,
.message-text,
.system-message-content,
.system-message-content *,
.ai-sidebar span:not([class*="ti-"]),
.ai-sidebar div:not([class*="ti-"]),
.ai-sidebar p:not([class*="ti-"]) {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Segoe UI", "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
  font-style: normal !important;
  font-variant: normal !important;
  text-decoration: none !important;
}

/* Ensure icons in modals use correct font */
.modal .ti,
.modal [class*="ti-"],
.modal .tabler-icon,
.modal .icon {
  font-family: 'tabler-icons' !important;
  font-style: normal !important;
  font-variant: normal !important;
  font-weight: normal !important;
  text-decoration: none !important;
}

/* Ensure icons in cards use correct font */
.card .ti,
.card [class*="ti-"],
.card .tabler-icon,
.card .icon {
  font-family: 'tabler-icons' !important;
  font-style: normal !important;
  font-variant: normal !important;
  font-weight: normal !important;
  text-decoration: none !important;
}

/* Ensure icons in buttons use correct font */
.btn .ti,
.btn [class*="ti-"],
.btn .tabler-icon,
.btn .icon {
  font-family: 'tabler-icons' !important;
  font-style: normal !important;
  font-variant: normal !important;
  font-weight: normal !important;
  text-decoration: none !important;
}

/* Ensure icons in forms use correct font */
.form-control .ti,
.form-label .ti,
.input-group .ti,
label .ti,
[class*="ti-"]:not(.message-greeting):not(.message-text):not(.system-message-content):not(span):not(div):not(p):not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
  font-family: 'tabler-icons' !important;
  font-style: normal !important;
  font-variant: normal !important;
  font-weight: normal !important;
  text-decoration: none !important;
}

/* Ensure icons in dropdowns use correct font */
.dropdown-item .ti,
.dropdown-header .ti,
.dropdown-menu .ti,
.dropdown-menu [class*="ti-"] {
  font-family: 'tabler-icons' !important;
  font-style: normal !important;
  font-variant: normal !important;
  font-weight: normal !important;
  text-decoration: none !important;
}

/* Ensure icons in navigation use correct font */
.nav-link .ti,
.navbar .ti,
.sidebar .ti,
.nav-item .ti,
[class*="ti-"]:not(.message-greeting):not(.message-text):not(.system-message-content):not(span):not(div):not(p):not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
  font-family: 'tabler-icons' !important;
  font-style: normal !important;
  font-variant: normal !important;
  font-weight: normal !important;
  text-decoration: none !important;
}

/* Ensure icons in alerts use correct font */
.alert .ti,
.alert [class*="ti-"] {
  font-family: 'tabler-icons' !important;
  font-style: normal !important;
  font-variant: normal !important;
  font-weight: normal !important;
  text-decoration: none !important;
}

/* Ensure icons in badges use correct font */
.badge .ti,
.badge [class*="ti-"] {
  font-family: 'tabler-icons' !important;
  font-style: normal !important;
  font-variant: normal !important;
  font-weight: normal !important;
  text-decoration: none !important;
}

/* Ensure icons in tables use correct font */
.table .ti,
.table [class*="ti-"] {
  font-family: 'tabler-icons' !important;
  font-style: normal !important;
  font-variant: normal !important;
  font-weight: normal !important;
  text-decoration: none !important;
}

/* Ensure icons in list groups use correct font */
.list-group-item .ti,
.list-group-item [class*="ti-"] {
  font-family: 'tabler-icons' !important;
  font-style: normal !important;
  font-variant: normal !important;
  font-weight: normal !important;
  text-decoration: none !important;
}

/* ===== SPECIFIC ICON ELEMENT FIXES ===== */

/* Icon sizing and positioning */
.ti {
  width: 1em !important;
  height: 1em !important;
  display: inline-block !important;
  vertical-align: middle !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
}

/* Icon spacing in buttons */
.btn .ti {
  margin-right: 0.25rem !important;
}

.btn .ti:last-child {
  margin-right: 0 !important;
}

/* Icon spacing in form labels */
.form-label .ti,
label .ti {
  margin-right: 0.25rem !important;
}

/* Icon spacing in dropdown items */
.dropdown-item .ti {
  margin-right: 0.5rem !important;
  width: 1rem !important;
  text-align: center !important;
}

/* Icon spacing in navigation */
.nav-link .ti {
  margin-right: 0.5rem !important;
}

/* Icon spacing in alerts */
.alert .ti {
  margin-right: 0.5rem !important;
}

/* ===== MODAL SPECIFIC ICON FIXES ===== */

/* Modal title icons */
.modal-title .ti,
.modal-header .ti {
  font-family: 'tabler-icons' !important;
  margin-right: 0.5rem !important;
  font-size: 1rem !important;
}

/* Modal body icons */
.modal-body .ti {
  font-family: 'tabler-icons' !important;
  margin-right: 0.25rem !important;
}

/* Modal footer icons */
.modal-footer .ti {
  font-family: 'tabler-icons' !important;
  margin-right: 0.25rem !important;
}

/* ===== CARD SPECIFIC ICON FIXES ===== */

/* Card header icons */
.card-header .ti,
.card-title .ti {
  font-family: 'tabler-icons' !important;
  margin-right: 0.5rem !important;
  font-size: 1rem !important;
}

/* Card body icons */
.card-body .ti {
  font-family: 'tabler-icons' !important;
  margin-right: 0.25rem !important;
}

/* Avatar icons */
.avatar .ti {
  font-family: 'tabler-icons' !important;
  font-size: 1rem !important;
}

/* ===== FORM SPECIFIC ICON FIXES ===== */

/* Input group icons */
.input-group-text .ti {
  font-family: 'tabler-icons' !important;
  font-size: 0.875rem !important;
}

/* Form floating icons */
.form-floating .ti {
  font-family: 'tabler-icons' !important;
}

/* ===== BUTTON SPECIFIC ICON FIXES ===== */

/* Button icons - all sizes */
.btn-sm .ti {
  font-size: 0.8125rem !important;
  margin-right: 0.25rem !important;
}

.btn-lg .ti {
  font-size: 1.125rem !important;
  margin-right: 0.375rem !important;
}

/* Icon-only buttons */
.btn .ti:only-child {
  margin-right: 0 !important;
}

/* ===== OVERRIDE FONT FAMILY INHERITANCE ===== */

/* Prevent system font inheritance on icons */
.modal *:not(.ti):not([class*="ti-"]) {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Segoe UI", "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

.card *:not(.ti):not([class*="ti-"]) {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Segoe UI", "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

/* ===== ICON FALLBACK FIXES ===== */

/* Fix for missing icon fonts - fallback to ensure visibility */
.ti:not([class*="ti-"])::before {
  content: "⚙️" !important;
  font-family: system-ui, sans-serif !important;
}

/* Fix for double ti- prefixes */
.ti[class*="ti-ti-"]::before {
  content: attr(data-icon) !important;
}

/* ===== SPECIFIC ICON CLASS FIXES ===== */

/* Common icon classes that might be affected */
.ti-plus,
.ti-edit,
.ti-trash,
.ti-eye,
.ti-x,
.ti-check,
.ti-search,
.ti-filter,
.ti-download,
.ti-upload,
.ti-settings,
.ti-user,
.ti-users,
.ti-home,
.ti-dashboard,
.ti-menu,
.ti-dots,
.ti-dots-vertical,
.ti-chevron-down,
.ti-chevron-up,
.ti-chevron-left,
.ti-chevron-right,
.ti-arrow-left,
.ti-arrow-right,
.ti-calendar,
.ti-clock,
.ti-mail,
.ti-phone,
.ti-world,
.ti-building,
.ti-folder,
.ti-file,
.ti-image,
.ti-video,
.ti-music,
.ti-star,
.ti-heart,
.ti-bookmark,
.ti-tag,
.ti-flag,
.ti-bell,
.ti-notification,
.ti-message,
.ti-chat,
.ti-comment,
.ti-share,
.ti-link,
.ti-external-link,
.ti-download,
.ti-upload,
.ti-cloud,
.ti-server,
.ti-database,
.ti-code,
.ti-terminal,
.ti-git,
.ti-github,
.ti-gitlab,
.ti-bitbucket,
.ti-npm,
.ti-yarn,
.ti-docker,
.ti-kubernetes {
  font-family: 'tabler-icons' !important;
  font-style: normal !important;
  font-variant: normal !important;
  font-weight: normal !important;
  text-decoration: none !important;
  speak: none !important;
}

/* ===== RESPONSIVE ICON FIXES ===== */

@media (max-width: 768px) {
  .ti {
    font-size: 0.875rem !important;
  }
  
  .btn .ti {
    font-size: 0.8125rem !important;
  }
  
  .modal-title .ti {
    font-size: 0.9375rem !important;
  }
}

/* ===== PRINT MEDIA ICON FIXES ===== */

@media print {
  .ti {
    font-family: 'tabler-icons' !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }
}

/* ===== FINAL CATCH-ALL ICON PRESERVATION ===== */

/* Ensure all icon elements preserve their font family */
i[class*="ti"],
span[class*="ti"],
em[class*="ti"],
strong[class*="ti"],
b[class*="ti"] {
  font-family: 'tabler-icons' !important;
  font-style: normal !important;
  font-variant: normal !important;
  font-weight: normal !important;
  text-decoration: none !important;
}

/* Override any inline styles that might affect icons */
[style*="font-family"][class*="ti"] {
  font-family: 'tabler-icons' !important;
}

/* Ensure icon pseudo-elements work correctly */
.ti::before,
[class*="ti-"]::before {
  font-family: 'tabler-icons' !important;
  font-style: normal !important;
  font-variant: normal !important;
  font-weight: normal !important;
  text-decoration: none !important;
  text-rendering: optimizeLegibility !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
}