/* Tabler Icons Fix for Frontend */
/* Ensure Tabler Icons display properly in the frontend */

/* Font face definitions */
@font-face {
  font-family: "tabler-icons";
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/tabler/tabler-icons.woff2") format("woff2"),
       url("../fonts/tabler/tabler-icons.woff") format("woff"),
       url("../fonts/tabler/tabler-icons.ttf") format("truetype");
}

/* Base icon styles */
.ti {
  font-family: "tabler-icons" !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  vertical-align: middle;
  font-size: 1.25rem;
  line-height: 1;
  display: inline-block;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Specific icon content values - with higher specificity for Telegram */
.ti.ti-brand-telegram:before { content: "\ec26" !important; }
.ti-brand-telegram:before { content: "\ec26" !important; }
.ti-settings:before { content: "\eb4c"; }
.ti-bell:before { content: "\ea5c"; }
.ti-user:before { content: "\ea67"; }
.ti-home:before { content: "\ea6d"; }
.ti-search:before { content: "\eb8c"; }
.ti-plus:before { content: "\ea0b"; }
.ti-minus:before { content: "\e9f3"; }
.ti-check:before { content: "\ea5a"; }
.ti-x:before { content: "\ea69"; }
.ti-arrow-left:before { content: "\ea60"; }
.ti-arrow-right:before { content: "\ea64"; }
.ti-arrow-up:before { content: "\ea65"; }
.ti-arrow-down:before { content: "\ea61"; }
.ti-edit:before { content: "\ea6a"; }
.ti-trash:before { content: "\ea0c"; }
.ti-download:before { content: "\ea6b"; }
.ti-upload:before { content: "\ea0d"; }
.ti-eye:before { content: "\ea6c"; }
.ti-eye-off:before { content: "\ea6e"; }
.ti-lock:before { content: "\ea6f"; }
.ti-unlock:before { content: "\ea70"; }
.ti-mail:before { content: "\ea71"; }
.ti-phone:before { content: "\ea72"; }
.ti-calendar:before { content: "\ea73"; }
.ti-clock:before { content: "\ea74"; }
.ti-map-pin:before { content: "\ea75"; }
.ti-globe:before { content: "\ea76"; }
.ti-link:before { content: "\ea77"; }
.ti-external-link:before { content: "\ea78"; }
.ti-share:before { content: "\ea79"; }
.ti-heart:before { content: "\ea7a"; }
.ti-star:before { content: "\eaa0"; }
.ti-thumb-up:before { content: "\eaa2"; }
.ti-thumb-down:before { content: "\eaa3"; }
.ti-flag:before { content: "\eaa4"; }
.ti-bookmark:before { content: "\eaa5"; }
.ti-tag:before { content: "\eaa6"; }
.ti-folder:before { content: "\eaa7"; }
.ti-file:before { content: "\eaa8"; }
.ti-image:before { content: "\eaa9"; }
.ti-video:before { content: "\eaaa"; }
.ti-music:before { content: "\eaab"; }
.ti-volume:before { content: "\eaac"; }
.ti-volume-off:before { content: "\eaad"; }
.ti-play:before { content: "\eaae"; }
.ti-pause:before { content: "\eaaf"; }
.ti-stop:before { content: "\eab0"; }
.ti-skip-back:before { content: "\eab1"; }
.ti-skip-forward:before { content: "\eab2"; }
.ti-rewind:before { content: "\eab3"; }
.ti-fast-forward:before { content: "\eab4"; }
.ti-repeat:before { content: "\eab5"; }
.ti-shuffle:before { content: "\eab6"; }
.ti-list:before { content: "\eab7"; }
.ti-grid:before { content: "\eab8"; }
.ti-layout:before { content: "\eab9"; }
.ti-sidebar:before { content: "\eaba"; }
.ti-menu:before { content: "\eabb"; }
.ti-menu-2:before { content: "\eabc"; }
.ti-dots:before { content: "\eabd"; }
.ti-dots-vertical:before { content: "\eabe"; }
.ti-circle:before { content: "\eabf"; }
.ti-square:before { content: "\eac0"; }
.ti-triangle:before { content: "\eac1"; }
.ti-diamond:before { content: "\eac2"; }
.ti-hexagon:before { content: "\eac3"; }
.ti-octagon:before { content: "\eac4"; }
.ti-pentagon:before { content: "\eac5"; }

/* Telegram-specific styles */
.rounded-circle .ti-brand-telegram,
.btn .ti-brand-telegram,
.nav-link .ti-brand-telegram {
  font-size: 1.5rem;
  color: #0088cc;
  transition: all 0.3s ease;
}

.ti-brand-telegram:hover,
.rounded-circle:hover .ti-brand-telegram,
.btn:hover .ti-brand-telegram {
  color: #006699;
  transform: scale(1.1);
} 