@font-face {
  font-family: Jura;
  src: url(fonts/Jura-VariableFont_wght.ttf);
}
@font-face {
  font-family: RougeScript;
  src: url(fonts/RougeScript-Regular.ttf);
}
@font-face {
  font-family: Yekan;
  src: url(fonts/IRANYekanXVFaNumVF.ttf);
}
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: Yekan;
  direction: rtl;
  user-select: none;
  -moz-user-select: none;
}
body {
  background: var(--surface-400);
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
}
#app {
  width: 100%;
  max-width: 480px;
  background: var(--surface-500);
  min-height: 100vh;
  position: relative;
  box-shadow: 0 0 30px rgba(0, 0, 0, 0.7);
  display: flex;
  flex-direction: column;
  color: #e0e0e0;
  border-radius: 0;
  overflow: hidden;
}
@media (min-width: 481px) {
  #app {
    border-radius: 32px;
    margin: 20px auto;
    min-height: 90vh;
  }
}
/* Header */
.header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 10px;
  position: sticky;
  top: 0;
  z-index: 20;
  /* backdrop-filter: blur(8px); */
}
.profile-icon {
  font-size: 24px;
  color: var(--surface-100);
  background-image: var(--gradient-2);
  border-top: 1px solid var(--surface-200);
  cursor: pointer;
  transition: 0.2s;
  padding: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-md);
}
.profile-icon:hover {
  background-image: none;
  background-color: var(--surface-200);
  color: var(--surface-50);
}
.profile-icon:focus {
  border: none;
}
.logo {
  font-weight: 800;
  font-size: 26px;
  letter-spacing: 1px;
  /* background: linear-gradient(135deg, #a259ff, #6c63ff); */
  /* -webkit-background-clip: text; */
  -webkit-text-fill-color: transparent;
  cursor: pointer;
}
/* همبرگر منو */
.hamburger-menu {
  position: absolute;
  top: 64px;
  right: 16px;
  background: #1e2430;
  border: 1px solid #333a48;
  border-radius: 20px;
  padding: 16px;
  display: none;
  flex-direction: column;
  gap: 18px;
  z-index: 50;
  min-width: 200px;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(16px);
}
.hamburger-menu.show {
  display: flex;
}
.menu-item {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #cfd4dd;
  cursor: pointer;
  padding: 8px 12px;
  border-radius: 12px;
  transition: 0.2s;
}
.menu-item:hover {
  background: #2b3240;
  color: white;
}
/* محتوای تب */
.tabs-content {
  flex: 1;
  overflow-y: auto;
  padding: 0px 12px 120px;
  display: none;
  
}
.tabs-content.active {
  display: block;
}
/* نوار تب پایین */
.bottom-nav {
  display: flex;
  align-items: center;
  justify-content: space-around;
  background: var(--surface-400);
  border-top: 1px solid var(--surface-200);
  padding: 8px 8px 12px;
  position: fixed;
  width: 100%;
  max-width: 480px;
  bottom: 0;
  z-index: 20;
}
.nav-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  color: var(--surface-200);
  cursor: pointer;
  font-size: 12px;
  gap: 4px;
  transition: 0.2s;
  padding: 6px 12px;
  border-radius: 20px;
}
.nav-item i {
  font-size: 22px;
}
.nav-item.active {
  color: var(--surface-50);
}
/* کارت ها و grid */
.search-box {
  /* background-image: var(--gradient-2); */
  border: 1px solid var(--surface-300);
  border-radius: 24px;
  padding: 10px 18px;
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 20px;
}
.search-box input {
  background: transparent;
  border: none;
  color: white;
  width: 100%;
  font-size: 15px;
  outline: none;
}
.grid-categories {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 20px 10px;
}
.category-card {
  /* background: #1e2530; */
  overflow: hidden;
  cursor: pointer;
  transition: 0.3s;
  /* border: 1px solid #2d3340; */
}
.category-card img {
  width: 100%;
  height: 130px;
  border-radius: 20px;
  object-fit: cover;
  display: block;
  margin-bottom: 8px;
}
.card-title {
  padding: 0 10px;
  font-weight: 600;
  font-size: 14px;
  color: #f1f1f1;
}
.card-words {
  padding: 0 10px;
  font-size: 12px;
  color: var(--surface-100);
}
.story-row {
  display: flex;
  gap: 16px;
  margin: 24px 0 36px 0;
}
.story-circle {
  width: 68px;
  height: 68px;
  border-radius: 50%;
  padding: 3px;
  background: #824dff;
  cursor: pointer;
  flex-shrink: 0;
}
.story-circle.watched {
  background: transparent;
  border: 2px solid #3a3f4a;
}
.story-circle img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid #12161e;
}
.challenge-banner {
  background: linear-gradient(135deg, #2a1e3a, #1b1f2c);
  border-radius: 24px;
  padding: 20px;
  margin: 20px 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.progress-row {
  display: flex;
  gap: 14px;
  overflow-x: auto;
  padding-bottom: 10px;
}
.progress-card {
  display: flex;
  flex-direction: column;
  min-width: 130px;
}
.progress-card img {
  border-radius: 18px;
  max-height: 130px;
  margin-bottom: 8px;
}
.tag-card {
  display: flex;
  background: #252c38;
  flex-direction: column;
  min-width: 130px;
  padding: 8px;
  border-radius: 18px;
}
.word-list-item {
  display: flex;
  justify-content: space-between;
  width: 100%;
  align-items: center;
  padding: 16px 12px;
  background-color: #ffffff08;
  border: 1px solid #2f3644;
  border-radius: var(--radius-sm);
  margin-bottom: 6px;
  cursor: pointer;
}
.small-btn span {
  font-size: 20px;
  line-height: 0px;
  padding: 8px;
  cursor: pointer;
  transition: 0.3s;
}
button {
  background: #643ac4;
  border: none;
  color: white;
  padding: 14px;
  border-radius: 20px;
  cursor: pointer;
}
.fullscreen-story {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  z-index: 100;
  display: none;
}
.empty-state {
  text-align: center;
  padding: 40px 20px;
  color: #888;
}
/* Playlist */
.playlist-hero {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 14px;
}
.playlist-title {
  display: flex;
  justify-content: space-between;
  vertical-align: middle;
  text-align: left;
  margin: 0 14px 18px;
}
.play-song-container {
  background: var(--surface-300);
  border-radius: 20px;
  padding: 14px;
  margin: 0 0 24px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 8px;
}
.play-song {
  display: flex;
  gap: 20px;
  justify-content: center;
  align-items: center;
  vertical-align: middle;
  margin-top: 28px;
}
.play-forward-backward {
  padding: 14px;
  font-size: 24px;
  line-height: 20px;
  height: fit-content;
  border-radius: 100px;
}
.play-btn {
  background-image: var(--gradient-1);
  color: var(--surface-50);
  font-size: 36px;
  line-height: 18px;
  height: fit-content;
  border-radius: 100px;
  padding: 14px;
}
.sort-vocab {
  display: flex;
  justify-content: space-between;
  margin-bottom: 14px;
  margin-top: 8px;
  margin: 8px 8px 14px;
}
.english-text {
  direction: ltr;
}

/* Modal Styles */
.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  backdrop-filter: blur(6px);
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: fadeIn 0.25s ease;
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.modal-content {
  display: flex;
  flex-direction: column;
  gap: 24px;
  background: #1a1f2b;
  border: 1px solid #2f3644;
  width: 100%;
  max-width: 400px;
  height: 90vh;
  overflow-y: auto;
  padding: 72px 24px 40px;
  position: relative;
  color: #e0e0e0;
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.7);
}
.modal-close {
  position: absolute;
  top: 14px;
  right: 16px;
  border: none;
  color: #ccc;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  font-size: 20px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.2s;
}
.modal-close:hover {
  background: #a259ff;
  color: white;
}
.logoinModal {
  position: absolute;
  top: 20px;
  left: 16px;
  width: 80px;
}
.logoinModal img {
  width: 80px;
}
.modal-word-title {
  font-size: 32px;
  font-weight: 700;
  color: var(--surface-50);
  text-align: center;
}
.part-of-speech {
  color: #bcc4d4;
  font-size: 14px;
  display: flex;
  justify-content: center;
  margin: 8px 8px 14px;
}
.modal-button-gp {
  display: flex;
  justify-content: center;
  gap: 20px;
}
.modal-button-gp div {
  font-size: 24px;
  line-height: 12px;
  padding: 12px;
  background-color: #2b3240;
  border-radius: 100px;
  border: 1px solid var(--surface-200);
}
.modal-button-gp-sm {
  display: flex;
  justify-content: center;
  gap: 8px;
}
.modal-button-gp-sm div {
  font-size: 20px;
  line-height: 10px;
  height: fit-content;
  padding: 12px;
  background-color: #ffffff15;
  border-radius: 100px;
}

.modal-section small {
  color: var(--surface-100);
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.modal-tags {
  font-size: 14px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.modal-tag-sy {
  background: #232a36;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 14px;
  color: var(--surface-50);
  border: 1px solid lightgreen;
}
.modal-tag-an {
  background: #232a36;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 14px;
  color: var(--surface-50);
  border: 1px solid lightcoral;
}
.modal-tag {
  background: #232a36;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 14px;
  color: var(--surface-50);
}
.modal-example {
  background: #1e2530;
  padding: 12px 16px;
  border-radius: 30px;
  margin: 6px 0;
  font-style: italic;
  color: var(--surface-50);
  border-bottom: 3px solid #a259ff;
}
.empty-badge {
  color: #5f6b7c;
  font-size: 13px;
}
.progress-container {
  width: 100%;
  margin: 12px 0;
}

.progress-bar {
  width: 100%;
  height: 6px;
  background: #ffffff10;
  border-radius: 3px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  transition: height 0.2s;
}

.progress-bar:hover {
  height: 8px;
}

.progress-fill {
  height: 100%;
  background: linear-gradient(90deg, #a259ff, #6c63ff);
  border-radius: 3px;
  width: 0%;
  transition: width 0.1s linear;
  position: relative;
}

.progress-fill::after {
  content: '';
  position: absolute;
  right: 0;
  top: 50%;
  transform: translate(50%, -50%);
  width: 12px;
  height: 12px;
  background: #fff;
  border-radius: 50%;
  opacity: 0;
  transition: opacity 0.2s;
  box-shadow: 0 0 6px rgba(162, 89, 255, 0.5);
}

.progress-bar:hover .progress-fill::after {
  opacity: 1;
}
.lyrics-section {
  text-align: center;
  height: 80px;
}
.passed-words {
  font-size: 14px;
  color: #ffffff40;
  margin: 6px 0;
}
.singing-words {
  animation: appear 0.8s ease-out forwards;
  font-size: 20px;
  font-weight: 600;
  color: #ffffff;
}
@keyframes appear {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes disappear {
  from {
    opacity: 1;
    transform: translateY(0);
  }
  to {
    opacity: 0;
    transform: translateY(30px);
  }
}
.time-display {
  display: flex;
  justify-content: space-between;
  color: #7f8796;
  font-size: 11px;
  margin-top: 6px;
  font-family: monospace;
}
/* Toast Notification */
.toast-container {
  position: fixed;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 9999;
  display: flex;
  flex-direction: column;
  gap: 10px;
  pointer-events: none;
}
.toast {
  background: #1e2530;
  border: 1px solid #2f3644;
  border-radius: 16px;
  padding: 14px 20px;
  color: #e0e0e0;
  font-size: 14px;
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 10px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
  animation:
    slideInDown 0.4s ease,
    fadeOut 0.3s ease 2.2s forwards;
  pointer-events: auto;
  backdrop-filter: blur(12px);
  min-width: 250px;
  justify-content: center;
}
.toast.success {
  border-right: 4px solid #4ade80;
}
.toast.success i {
  color: #4ade80;
}
.toast.info {
  border-right: 4px solid #60a5fa;
}
.toast.info i {
  color: #60a5fa;
}
@keyframes slideInDown {
  from {
    opacity: 0;
    transform: translateY(-30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    transform: translateY(-10px);
  }
}

:root {
  /* Color */
  --primary-50: #e9eff1;
  --primary-100: #a2aeb4;
  --primary-200: #a259ff;
  --primary-300: #2e424d;

  --secondary-50: #f8f4bf;
  --secondary-200: #fff4575;

  --surface-50: #ffffff;
  --surface-100: #b6bdc5;
  --surface-200: #4c5866;
  --surface-300: #1b2b3d;
  --surface-400: #0d151e;

  --gradient-1: linear-gradient(-45deg, #0f68fe, #7b3ffc);
  --gradient-2: linear-gradient(-45deg, #121d29, #1a2c40);
  --gradient-3: linear-gradient(-45deg, #121d29, #547191);
  --gradient-white: linear-gradient(-45deg, #3b3b3b, #a9a9a9);
  /* Shadow */
  --black-shadow: 0px 0px 20px hsla(0, 0%, 22%, 0.899);
  --grey-shadow: 0px 0px 20px hsla(0, 0%, 36%, 0.575);
  --green-shadow: 0px 0px 10px hsla(201, 12%, 54%, 0.25);
  --bottom-shadow: 0px 3px 4px hsla(0, 0%, 0%, 0.18);

  /* Border */
  --border-sm: 4px solid white;
  --border-lg: 6px solid white;

  /* Radius */
  --radius-sm: 16px;
  --radius-md: 32px;
  --radius-lg: 40px;

  /* Fonts */
  --text-6xl: 48px;
  --height-6xl: 58px;

  --text-5xl: 40px;
  --height-5xl: 52px;

  --text-4xl: 36px;
  --height-4xl: 48px;

  --text-3xl: 24px;
  --height-3xl: 32px;

  --text-2xl: 20px;
  --height-2xl: 24px;

  --text-xl: 18px;
  --height-xl: 24px;

  --text-base: 16px;
  --height-base: 24px;
}

/* ICONS */
@font-face {
  font-family: "icomoon";
  src: url("icons/icomoon.eot?vkd1hh");
  src:
    url("icons/icomoon.eot?vkd1hh#iefix") format("embedded-opentype"),
    url("icons/icomoon.ttf?vkd1hh") format("truetype"),
    url("icons/icomoon.woff?vkd1hh") format("woff"),
    url("icons/icomoon.svg?vkd1hh#icomoon") format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

[class^="icon-"],
[class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "icomoon" !important;
  /* speak: never; */
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-Activity-1:before {
  content: "\e900";
}
.icon-Activity-2:before {
  content: "\e901";
}
.icon-Activity-3:before {
  content: "\e902";
}
.icon-Activity-4:before {
  content: "\e903";
}
.icon-Add-Category:before {
  content: "\e904";
}
.icon-Add-Circle:before {
  content: "\e905";
}
.icon-Add-Square:before {
  content: "\e906";
}
.icon-Add:before {
  content: "\e907";
}
.icon-Arrow-Swap-Horizontal:before {
  content: "\e908";
}
.icon-Arrow-Swap-Vertical:before {
  content: "\e909";
}
.icon-Attachment:before {
  content: "\e90a";
}
.icon-Award-1:before {
  content: "\e90b";
}
.icon-Award-2:before {
  content: "\e90c";
}
.icon-Award-3:before {
  content: "\e90d";
}
.icon-Award-4:before {
  content: "\e90e";
}
.icon-Award-5:before {
  content: "\e90f";
}
.icon-Award-6:before {
  content: "\e910";
}
.icon-Backward-5-Seconds:before {
  content: "\e911";
}
.icon-Backward-10-Seconds:before {
  content: "\e912";
}
.icon-Backward:before {
  content: "\e913";
}
.icon-Bag-1:before {
  content: "\e914";
}
.icon-Bag-2:before {
  content: "\e915";
}
.icon-Bag-3:before {
  content: "\e916";
}
.icon-Bag-4:before {
  content: "\e917";
}
.icon-Bag-5:before {
  content: "\e918";
}
.icon-Bag-6:before {
  content: "\e919";
}
.icon-Bag-7:before {
  content: "\e91a";
}
.icon-Bag-8:before {
  content: "\e91b";
}
.icon-Battery-Charging:before {
  content: "\e91c";
}
.icon-Battery-Fully:before {
  content: "\e91d";
}
.icon-Battery-Low:before {
  content: "\e91e";
}
.icon-Battery-Normal:before {
  content: "\e91f";
}
.icon-Bold:before {
  content: "\e920";
}
.icon-Bookmark-1:before {
  content: "\e921";
}
.icon-Bookmark-2:before {
  content: "\e922";
}
.icon-Bookmark-3:before {
  content: "\e923";
}
.icon-Buy-1:before {
  content: "\e924";
}
.icon-Buy-2:before {
  content: "\e925";
}
.icon-Buy-3:before {
  content: "\e926";
}
.icon-Calender-1:before {
  content: "\e927";
}
.icon-Calender-2:before {
  content: "\e928";
}
.icon-Call-Missed:before {
  content: "\e929";
}
.icon-Call-Silent:before {
  content: "\e92a";
}
.icon-Call:before {
  content: "\e92b";
}
.icon-Calling-1:before {
  content: "\e92c";
}
.icon-Calling-2:before {
  content: "\e92d";
}
.icon-Camera-1:before {
  content: "\e92e";
}
.icon-Camera-2:before {
  content: "\e92f";
}
.icon-Camera-Slash-1:before {
  content: "\e930";
}
.icon-Camera-Slash-2:before {
  content: "\e931";
}
.icon-Card-1:before {
  content: "\e932";
}
.icon-Card-2:before {
  content: "\e933";
}
.icon-Category:before {
  content: "\e934";
}
.icon-Chart:before {
  content: "\e935";
}
.icon-Close-Circle:before {
  content: "\e936";
}
.icon-Close-Square:before {
  content: "\e937";
}
.icon-Close:before {
  content: "\e938";
}
.icon-Color-Picker:before {
  content: "\e939";
}
.icon-Crop-1:before {
  content: "\e93a";
}
.icon-Crop-2:before {
  content: "\e93b";
}
.icon-Crop-3:before {
  content: "\e93c";
}
.icon-Cup-of-Tea:before {
  content: "\e93d";
}
.icon-Cup:before {
  content: "\e93e";
}
.icon-Danger-Circle:before {
  content: "\e93f";
}
.icon-Danger-Triangle:before {
  content: "\e940";
}
.icon-Delete-1:before {
  content: "\e941";
}
.icon-Delete-2:before {
  content: "\e942";
}
.icon-Discount-Circle:before {
  content: "\e943";
}
.icon-Discount-Shape-1:before {
  content: "\e944";
}
.icon-Discount-Shape-2:before {
  content: "\e945";
}
.icon-Discount-Shape-3:before {
  content: "\e946";
}
.icon-Discount-Square:before {
  content: "\e947";
}
.icon-Discovery-1:before {
  content: "\e948";
}
.icon-Discovery-2:before {
  content: "\e949";
}
.icon-Dislike:before {
  content: "\e94a";
}
.icon-Display-1:before {
  content: "\e94b";
}
.icon-Display-2:before {
  content: "\e94c";
}
.icon-Display-3:before {
  content: "\e94d";
}
.icon-Display-4:before {
  content: "\e94e";
}
.icon-Document-Add-1:before {
  content: "\e94f";
}
.icon-Document-Align-Center-2:before {
  content: "\e950";
}
.icon-Document-Align-Left-2:before {
  content: "\e951";
}
.icon-Document-Align-Left-3:before {
  content: "\e952";
}
.icon-Document-Align-Right-1:before {
  content: "\e953";
}
.icon-Document-Justify-Left-1:before {
  content: "\e954";
}
.icon-Document-Minus-3:before {
  content: "\e955";
}
.icon-Document-Upload-1:before {
  content: "\e956";
}
.icon-Document-Add-2:before {
  content: "\e957";
}
.icon-Document-Add-3:before {
  content: "\e958";
}
.icon-Document-Add-4:before {
  content: "\e959";
}
.icon-Document-Align-Center-1:before {
  content: "\e95a";
}
.icon-Document-Align-Center-3:before {
  content: "\e95b";
}
.icon-Document-Align-Center-4:before {
  content: "\e95c";
}
.icon-Document-Align-Center-5:before {
  content: "\e95d";
}
.icon-Document-Align-Center-6:before {
  content: "\e95e";
}
.icon-Document-Align-Center-7:before {
  content: "\e95f";
}
.icon-Document-Align-Left-1:before {
  content: "\e960";
}
.icon-Document-Align-Left-4:before {
  content: "\e961";
}
.icon-Document-Align-Left-5:before {
  content: "\e962";
}
.icon-Document-Align-Left-6:before {
  content: "\e963";
}
.icon-Document-Align-Left-7:before {
  content: "\e964";
}
.icon-Document-Align-Left-8:before {
  content: "\e965";
}
.icon-Document-Align-Left-9:before {
  content: "\e966";
}
.icon-Document-Align-Left-10:before {
  content: "\e967";
}
.icon-Document-Align-Left-11:before {
  content: "\e968";
}
.icon-Document-Align-Left-12:before {
  content: "\e969";
}
.icon-Document-Align-Left-13:before {
  content: "\e96a";
}
.icon-Document-Align-Left-14:before {
  content: "\e96b";
}
.icon-Document-Align-Left-15:before {
  content: "\e96c";
}
.icon-Document-Align-Left-16:before {
  content: "\e96d";
}
.icon-Document-Align-Left-17:before {
  content: "\e96e";
}
.icon-Document-Align-Right-2:before {
  content: "\e96f";
}
.icon-Document-Align-Right-3:before {
  content: "\e970";
}
.icon-Document-Align-Right-4:before {
  content: "\e971";
}
.icon-Document-Align-Right-5:before {
  content: "\e972";
}
.icon-Document-Align-Right-6:before {
  content: "\e973";
}
.icon-Document-Align-Right-7:before {
  content: "\e974";
}
.icon-Document-Align-Right-8:before {
  content: "\e975";
}
.icon-Document-Align-Right-9:before {
  content: "\e976";
}
.icon-Document-Align-Right-10:before {
  content: "\e977";
}
.icon-Document-Align-Right-11:before {
  content: "\e978";
}
.icon-Document-Align-Right-12:before {
  content: "\e979";
}
.icon-Document-Align-Right-13:before {
  content: "\e97a";
}
.icon-Document-Align-Right-14:before {
  content: "\e97b";
}
.icon-Document-Align-Right-15:before {
  content: "\e97c";
}
.icon-Document-Align-Right-16:before {
  content: "\e97d";
}
.icon-Document-Align-Right-17:before {
  content: "\e97e";
}
.icon-Document-Download-1:before {
  content: "\e97f";
}
.icon-Document-Download-2:before {
  content: "\e980";
}
.icon-Document-Download-3:before {
  content: "\e981";
}
.icon-Document-Download-4:before {
  content: "\e982";
}
.icon-Document-Fail-1:before {
  content: "\e983";
}
.icon-Document-Fail-2:before {
  content: "\e984";
}
.icon-Document-Fail-3:before {
  content: "\e985";
}
.icon-Document-Fail-4:before {
  content: "\e986";
}
.icon-Document-Justify-Right-1:before {
  content: "\e987";
}
.icon-Document-Justify-Center-1:before {
  content: "\e988";
}
.icon-Document-Justify-Center-2:before {
  content: "\e989";
}
.icon-Document-Justify-Left-2:before {
  content: "\e98a";
}
.icon-Document-Justify-Right-2:before {
  content: "\e98b";
}
.icon-Document-Minus-1:before {
  content: "\e98c";
}
.icon-Document-Minus-2:before {
  content: "\e98d";
}
.icon-Document-Minus-4:before {
  content: "\e98e";
}
.icon-Document-Upload-2:before {
  content: "\e98f";
}
.icon-Document-Upload-3:before {
  content: "\e990";
}
.icon-Document-Upload-4:before {
  content: "\e991";
}
.icon-Dollar-Circle:before {
  content: "\e992";
}
.icon-Dollar-Square:before {
  content: "\e993";
}
.icon-Down-1:before {
  content: "\e994";
}
.icon-Down-2:before {
  content: "\e995";
}
.icon-Down-3:before {
  content: "\e996";
}
.icon-Down-Circle-1:before {
  content: "\e997";
}
.icon-Down-Circle-2:before {
  content: "\e998";
}
.icon-Down-Square-1:before {
  content: "\e999";
}
.icon-Down-Square-2:before {
  content: "\e99a";
}
.icon-Download:before {
  content: "\e99b";
}
.icon-Drop:before {
  content: "\e99c";
}
.icon-Edit-1:before {
  content: "\e99d";
}
.icon-Edit-2:before {
  content: "\e99e";
}
.icon-Edit-Square:before {
  content: "\e99f";
}
.icon-Education:before {
  content: "\e9a0";
}
.icon-FAQ-Circle:before {
  content: "\e9a1";
}
.icon-Filter-1:before {
  content: "\e9a2";
}
.icon-Filter-2:before {
  content: "\e9a3";
}
.icon-Filter-3:before {
  content: "\e9a4";
}
.icon-Filter-4:before {
  content: "\e9a5";
}
.icon-Filter-5:before {
  content: "\e9a6";
}
.icon-Flash-Disk-1:before {
  content: "\e9a7";
}
.icon-Flash-Disk-2:before {
  content: "\e9a8";
}
.icon-Folder-1:before {
  content: "\e9a9";
}
.icon-Folder-2:before {
  content: "\e9aa";
}
.icon-Folder-Add-1:before {
  content: "\e9ab";
}
.icon-Folder-Add-2:before {
  content: "\e9ac";
}
.icon-Folder-Cross-1:before {
  content: "\e9ad";
}
.icon-Folder-Cross-2:before {
  content: "\e9ae";
}
.icon-Folder-Minus-1:before {
  content: "\e9af";
}
.icon-Folder-Minus-2:before {
  content: "\e9b0";
}
.icon-Foreign:before {
  content: "\e9b1";
}
.icon-Forward-5-Seconds:before {
  content: "\e9b2";
}
.icon-Forward-10-Seconds:before {
  content: "\e9b3";
}
.icon-Forward:before {
  content: "\e9b4";
}
.icon-Gift-1:before {
  content: "\e9b5";
}
.icon-Gift-2:before {
  content: "\e9b6";
}
.icon-Graph:before {
  content: "\e9b7";
}
.icon-Group-1:before {
  content: "\e9b8";
}
.icon-Group-2:before {
  content: "\e9b9";
}
.icon-Group-3:before {
  content: "\e9ba";
}
.icon-Happy-1:before {
  content: "\e9bb";
}
.icon-Happy-2:before {
  content: "\e9bc";
}
.icon-Hashtag:before {
  content: "\e9bd";
}
.icon-Headphone-1:before {
  content: "\e9be";
}
.icon-Headphone-2:before {
  content: "\e9bf";
}
.icon-Heart-1:before {
  content: "\e9c0";
}
.icon-Heart-2:before {
  content: "\e9c1";
}
.icon-Heart-3:before {
  content: "\e9c2";
}
.icon-Hide:before {
  content: "\e9c3";
}
.icon-Home-1:before {
  content: "\e9c4";
}
.icon-Home-2:before {
  content: "\e9c5";
}
.icon-Home-3:before {
  content: "\e9c6";
}
.icon-Home-4:before {
  content: "\e9c7";
}
.icon-Image:before {
  content: "\e9c8";
}
.icon-Information-Circle:before {
  content: "\e9c9";
}
.icon-Information-Square:before {
  content: "\e9ca";
}
.icon-Instagram:before {
  content: "\e9cb";
}
.icon-Italic:before {
  content: "\e9cc";
}
.icon-Keyboard:before {
  content: "\e9cd";
}
.icon-Left-1:before {
  content: "\e9ce";
}
.icon-Left-2:before {
  content: "\e9cf";
}
.icon-Left-3:before {
  content: "\e9d0";
}
.icon-Left-Circle-1:before {
  content: "\e9d1";
}
.icon-Left-Circle-2:before {
  content: "\e9d2";
}
.icon-Left-Square-1:before {
  content: "\e9d3";
}
.icon-Left-Square-2:before {
  content: "\e9d4";
}
.icon-Like-1:before {
  content: "\e9d5";
}
.icon-Like-2:before {
  content: "\e9d6";
}
.icon-Like-3:before {
  content: "\e9d7";
}
.icon-Like:before {
  content: "\e9d8";
}
.icon-Link:before {
  content: "\e9d9";
}
.icon-Linkedin:before {
  content: "\e9da";
}
.icon-Location-Add:before {
  content: "\e9db";
}
.icon-Location-Cross:before {
  content: "\e9dc";
}
.icon-Location-Minus:before {
  content: "\e9dd";
}
.icon-Location-Tick:before {
  content: "\e9de";
}
.icon-Location:before {
  content: "\e9df";
}
.icon-Lock-1:before {
  content: "\e9e0";
}
.icon-Lock-2:before {
  content: "\e9e1";
}
.icon-Lock-3:before {
  content: "\e9e2";
}
.icon-Login:before {
  content: "\e9e3";
}
.icon-Logout:before {
  content: "\e9e4";
}
.icon-Map:before {
  content: "\e9e5";
}
.icon-Menu-Candy-Box:before {
  content: "\e9e6";
}
.icon-Menu-Cheesesburger:before {
  content: "\e9e7";
}
.icon-Menu-Fries:before {
  content: "\e9e8";
}
.icon-Menu-Hamburger:before {
  content: "\e9e9";
}
.icon-Menu-Hamburger-1:before {
  content: "\e9ea";
}
.icon-Menu-Hotdog:before {
  content: "\e9eb";
}
.icon-Menu-Kebab:before {
  content: "\e9ec";
}
.icon-Menu-Meatballs:before {
  content: "\e9ed";
}
.icon-Menu-Strawberry:before {
  content: "\e9ee";
}
.icon-Menu-Veggie-Burger:before {
  content: "\e9ef";
}
.icon-Menu:before {
  content: "\e9f0";
}
.icon-Message-1:before {
  content: "\e9f1";
}
.icon-Message-2:before {
  content: "\e9f2";
}
.icon-Message-3:before {
  content: "\e9f3";
}
.icon-Message-4:before {
  content: "\e9f4";
}
.icon-Message-5:before {
  content: "\e9f5";
}
.icon-Message-6:before {
  content: "\e9f6";
}
.icon-Message-7:before {
  content: "\e9f7";
}
.icon-Message-8:before {
  content: "\e9f8";
}
.icon-Message-9:before {
  content: "\e9f9";
}
.icon-Message-10:before {
  content: "\e9fa";
}
.icon-Message-11:before {
  content: "\e9fb";
}
.icon-Message-12:before {
  content: "\e9fc";
}
.icon-Message-13:before {
  content: "\e9fd";
}
.icon-Message-14:before {
  content: "\e9fe";
}
.icon-Message-15:before {
  content: "\e9ff";
}
.icon-Message-16:before {
  content: "\ea00";
}
.icon-Message-17:before {
  content: "\ea01";
}
.icon-Message-18:before {
  content: "\ea02";
}
.icon-Message-21:before {
  content: "\ea03";
}
.icon-Message-22:before {
  content: "\ea04";
}
.icon-Message-23:before {
  content: "\ea05";
}
.icon-Message-24:before {
  content: "\ea06";
}
.icon-Message-25:before {
  content: "\ea07";
}
.icon-Message-26:before {
  content: "\ea08";
}
.icon-Message-27:before {
  content: "\ea09";
}
.icon-Message-28:before {
  content: "\ea0a";
}
.icon-Message-29:before {
  content: "\ea0b";
}
.icon-Message-30:before {
  content: "\ea0c";
}
.icon-Message-31:before {
  content: "\ea0d";
}
.icon-Message-32:before {
  content: "\ea0e";
}
.icon-Message-33:before {
  content: "\ea0f";
}
.icon-Message-34:before {
  content: "\ea10";
}
.icon-Message-35:before {
  content: "\ea11";
}
.icon-Message-36:before {
  content: "\ea12";
}
.icon-Message-37:before {
  content: "\ea13";
}
.icon-Message-38:before {
  content: "\ea14";
}
.icon-Microphone-1:before {
  content: "\ea15";
}
.icon-Microphone-2:before {
  content: "\ea16";
}
.icon-Microphone-3:before {
  content: "\ea17";
}
.icon-Microphone-4:before {
  content: "\ea18";
}
.icon-Microphone-Off:before {
  content: "\ea19";
}
.icon-Minus-Circle:before {
  content: "\ea1a";
}
.icon-Minus-Square:before {
  content: "\ea1b";
}
.icon-Minus:before {
  content: "\ea1c";
}
.icon-Moon:before {
  content: "\ea1d";
}
.icon-More-Circle:before {
  content: "\ea1e";
}
.icon-More-Square:before {
  content: "\ea1f";
}
.icon-Mouse:before {
  content: "\ea20";
}
.icon-Music-Filter:before {
  content: "\ea21";
}
.icon-Music:before {
  content: "\ea22";
}
.icon-Musicnote:before {
  content: "\ea23";
}
.icon-Next:before {
  content: "\ea24";
}
.icon-Notification-1:before {
  content: "\ea25";
}
.icon-Notification-2:before {
  content: "\ea26";
}
.icon-Notification-3:before {
  content: "\ea27";
}
.icon-Notification-4:before {
  content: "\ea28";
}
.icon-Numerical-Star:before {
  content: "\ea29";
}
.icon-Off:before {
  content: "\ea2a";
}
.icon-Palette:before {
  content: "\ea2b";
}
.icon-Password-1:before {
  content: "\ea2c";
}
.icon-Password-2:before {
  content: "\ea2d";
}
.icon-Password-3:before {
  content: "\ea2e";
}
.icon-Password-4:before {
  content: "\ea2f";
}
.icon-Password-5:before {
  content: "\ea30";
}
.icon-Password-6:before {
  content: "\ea31";
}
.icon-Pause-Circle:before {
  content: "\ea32";
}
.icon-Pause-Octagon:before {
  content: "\ea33";
}
.icon-Pause-Octagon-1:before {
  content: "\ea34";
}
.icon-Pause:before {
  content: "\ea35";
}
.icon-Pen:before {
  content: "\ea36";
}
.icon-Pin:before {
  content: "\ea37";
}
.icon-Play-Circle:before {
  content: "\ea38";
}
.icon-Play-Octagon:before {
  content: "\ea39";
}
.icon-Play-Square:before {
  content: "\ea3a";
}
.icon-Play:before {
  content: "\ea3b";
}
.icon-Poker:before {
  content: "\ea3c";
}
.icon-Previous:before {
  content: "\ea3d";
}
.icon-Profile-1:before {
  content: "\ea3e";
}
.icon-Profile-Accepted-2:before {
  content: "\ea3f";
}
.icon-Profile-Add-1:before {
  content: "\ea40";
}
.icon-Profile-Add-2:before {
  content: "\ea41";
}
.icon-Profile-Circle:before {
  content: "\ea42";
}
.icon-Profile-Delete-1:before {
  content: "\ea43";
}
.icon-Profile-Delete-2:before {
  content: "\ea44";
}
.icon-Profile-Octagon:before {
  content: "\ea45";
}
.icon-Profile-Remove-1:before {
  content: "\ea46";
}
.icon-Profile-Remove-2:before {
  content: "\ea47";
}
.icon-Profile-Square:before {
  content: "\ea48";
}
.icon-PS5-1:before {
  content: "\ea49";
}
.icon-PS5-2:before {
  content: "\ea4a";
}
.icon-Radio:before {
  content: "\ea4b";
}
.icon-Record:before {
  content: "\ea4c";
}
.icon-Redo:before {
  content: "\ea4d";
}
.icon-Refresh-1:before {
  content: "\ea4e";
}
.icon-Refresh-2:before {
  content: "\ea4f";
}
.icon-Repeate-1:before {
  content: "\ea50";
}
.icon-Repeate-3:before {
  content: "\ea51";
}
.icon-Repeate-One-1:before {
  content: "\ea52";
}
.icon-Repeate-One-2:before {
  content: "\ea53";
}
.icon-Repeate-One-3:before {
  content: "\ea54";
}
.icon-Report:before {
  content: "\ea55";
}
.icon-Right-1:before {
  content: "\ea56";
}
.icon-Right-2:before {
  content: "\ea57";
}
.icon-Right-3:before {
  content: "\ea58";
}
.icon-Right-Circle-1:before {
  content: "\ea59";
}
.icon-Right-Circle-2:before {
  content: "\ea5a";
}
.icon-Right-Square-1:before {
  content: "\ea5b";
}
.icon-Right-Square-2:before {
  content: "\ea5c";
}
.icon-Rotate-Left:before {
  content: "\ea5d";
}
.icon-Rotate-Right:before {
  content: "\ea5e";
}
.icon-Sad:before {
  content: "\ea5f";
}
.icon-Scan-1:before {
  content: "\ea60";
}
.icon-Scan-2:before {
  content: "\ea61";
}
.icon-Scan-3:before {
  content: "\ea62";
}
.icon-Scan-4:before {
  content: "\ea63";
}
.icon-Scan-5:before {
  content: "\ea64";
}
.icon-Scan-6:before {
  content: "\ea65";
}
.icon-Scan-7:before {
  content: "\ea66";
}
.icon-Scan-8:before {
  content: "\ea67";
}
.icon-Scan-10:before {
  content: "\ea68";
}
.icon-Scan-11:before {
  content: "\ea69";
}
.icon-Scan-12:before {
  content: "\ea6a";
}
.icon-Scan-13:before {
  content: "\ea6b";
}
.icon-Search-1:before {
  content: "\ea6c";
}
.icon-Search-2:before {
  content: "\ea6d";
}
.icon-Security-Safe:before {
  content: "\ea6e";
}
.icon-Send-1:before {
  content: "\ea6f";
}
.icon-Send-2:before {
  content: "\ea70";
}
.icon-Send-3:before {
  content: "\ea71";
}
.icon-Send-4:before {
  content: "\ea72";
}
.icon-Send-5:before {
  content: "\ea73";
}
.icon-Setting:before {
  content: "\ea74";
}
.icon-Shield-1:before {
  content: "\ea75";
}
.icon-Shield-Cross:before {
  content: "\ea76";
}
.icon-Shield-Plus:before {
  content: "\ea77";
}
.icon-Shield-Star:before {
  content: "\ea78";
}
.icon-Shield-Tick:before {
  content: "\ea79";
}
.icon-Show:before {
  content: "\ea7a";
}
.icon-Shuffle-1:before {
  content: "\ea7b";
}
.icon-Shuffle-2:before {
  content: "\ea7c";
}
.icon-Situation-1:before {
  content: "\ea7d";
}
.icon-Situation-2:before {
  content: "\ea7e";
}
.icon-SMS-1:before {
  content: "\ea7f";
}
.icon-SMS-2:before {
  content: "\ea80";
}
.icon-Speaker-1:before {
  content: "\ea81";
}
.icon-Speaker-2:before {
  content: "\ea82";
}
.icon-Star-1:before {
  content: "\ea83";
}
.icon-Star-2:before {
  content: "\ea84";
}
.icon-Sticker:before {
  content: "\ea85";
}
.icon-Stop-Circle:before {
  content: "\ea86";
}
.icon-Stop:before {
  content: "\ea87";
}
.icon-Sun-1:before {
  content: "\ea88";
}
.icon-Sun-2:before {
  content: "\ea89";
}
.icon-Swap-1:before {
  content: "\ea8a";
}
.icon-Swap-2:before {
  content: "\ea8b";
}
.icon-Tag:before {
  content: "\ea8c";
}
.icon-Telegram:before {
  content: "\ea8d";
}
.icon-Text-Align-Center:before {
  content: "\ea8e";
}
.icon-Text-Align-Justify-Center:before {
  content: "\ea8f";
}
.icon-Text-Align-Justify-Left:before {
  content: "\ea90";
}
.icon-Text-Align-Justify-Right:before {
  content: "\ea91";
}
.icon-Text-Align-Left:before {
  content: "\ea92";
}
.icon-Text-Align-Right:before {
  content: "\ea93";
}
.icon-Text:before {
  content: "\ea94";
}
.icon-Tick-Circle:before {
  content: "\ea95";
}
.icon-Tick-Square:before {
  content: "\ea96";
}
.icon-Tick:before {
  content: "\ea97";
}
.icon-Ticket-1:before {
  content: "\ea98";
}
.icon-Ticket-2:before {
  content: "\ea99";
}
.icon-Ticket-Discount:before {
  content: "\ea9a";
}
.icon-Ticket-Expired:before {
  content: "\ea9b";
}
.icon-Ticket-Star-1:before {
  content: "\ea9c";
}
.icon-Ticket-Star-2:before {
  content: "\ea9d";
}
.icon-Time-Circle-1:before {
  content: "\ea9e";
}
.icon-Time-Circle-2:before {
  content: "\ea9f";
}
.icon-Time-Circle-3:before {
  content: "\eaa0";
}
.icon-Time-Circle-4:before {
  content: "\eaa1";
}
.icon-Time-Circle-5:before {
  content: "\eaa2";
}
.icon-Time-Circle-6:before {
  content: "\eaa3";
}
.icon-TV:before {
  content: "\eaa4";
}
.icon-Undo:before {
  content: "\eaa5";
}
.icon-Unlock-1:before {
  content: "\eaa6";
}
.icon-Unlock-2:before {
  content: "\eaa7";
}
.icon-Unlock-3:before {
  content: "\eaa8";
}
.icon-Up-1:before {
  content: "\eaa9";
}
.icon-Up-2:before {
  content: "\eaaa";
}
.icon-Up-3:before {
  content: "\eaab";
}
.icon-Up-Circle-1:before {
  content: "\eaac";
}
.icon-Up-Circle-2:before {
  content: "\eaad";
}
.icon-Up-Square-1:before {
  content: "\eaae";
}
.icon-Up-Square-2:before {
  content: "\eaaf";
}
.icon-Upload:before {
  content: "\eab0";
}
.icon-User-Tag:before {
  content: "\eab1";
}
.icon-Verified:before {
  content: "\eab2";
}
.icon-Video-1:before {
  content: "\eab3";
}
.icon-Video-2:before {
  content: "\eab4";
}
.icon-Video-Slash:before {
  content: "\eab5";
}
.icon-Virus:before {
  content: "\eab6";
}
.icon-Voice-Circle:before {
  content: "\eab7";
}
.icon-Voice-Shape-1:before {
  content: "\eab8";
}
.icon-Voice-Shape-2:before {
  content: "\eab9";
}
.icon-Voice-Square:before {
  content: "\eaba";
}
.icon-Voice:before {
  content: "\eabb";
}
.icon-Volume-Cross:before {
  content: "\eabc";
}
.icon-Volume-High:before {
  content: "\eabd";
}
.icon-Volume-Low:before {
  content: "\eabe";
}
.icon-Volume-Low-1:before {
  content: "\eabf";
}
.icon-Volume-Mute:before {
  content: "\eac0";
}
.icon-Volume-Off:before {
  content: "\eac1";
}
.icon-Volume-Slash:before {
  content: "\eac2";
}
.icon-Volume-Up:before {
  content: "\eac3";
}
.icon-Wallet:before {
  content: "\eac4";
}
.icon-Warning:before {
  content: "\eac5";
}
.icon-Watch-1:before {
  content: "\eac6";
}
.icon-Watch-2:before {
  content: "\eac7";
}
.icon-Website:before {
  content: "\eac8";
}
.icon-Wifi:before {
  content: "\eac9";
}
.icon-Work:before {
  content: "\eaca";
}
.icon-Zoom-In:before {
  content: "\eacb";
}
.icon-Zoom-Out:before {
  content: "\eacc";
}