/*general*/
body {
  background-color: #f1f3f6;
}

.megawp-site-center {
  width: 1250px;
}

aside .megawp-post-tabs-widget ul.megawp-post-tabs-widget-container li,
aside h4.megawp-widget-title {
  color: #485460;
}

aside h4.megawp-widget-title {
  font-size: 16px;
  font-weight: 700;
}

aside .megawp-sidebar-widget-box {
  font-size: 14px;
  font-weight: 400;
  line-height: 25px;
}

::selection {
  background-color: #ff4500;
}

.megawp-load .load-wrap {
  background-image: url("https://tanasobefekri.com/wp-content/uploads/2019/08/273.gif");
}

.megawp-content .megawp-video-post,
.megawp-general-box {
  border-radius: 5px;
  border-width: 1px;
}

.megawp-categories-list-widget ul li a,
.megawp-content .megawp-audio-podcasts-box,
.megawp-image-widget img,
.megawp-user-area-widget,
.megawp-content .megawp-breadcrumbs,
.megawp-course-short-block-info .megawp-course-copyright,
.megawp-course-short-block-info .megawp-course-student-count,
.megawp-course-student-notice,
.megawp-social-networks-widget .megawp-social-network-widget-item {
  border-radius: 5px;
}


/*header*/

header.megawp-header-wrapper .header-separator {
  background-color: #d5d5d5;
}

/*sticky header*/
.megawp-sticky-header-wrapper {
  background-image: linear-gradient(to right, #f12711, #f5af19);
}

.megawp-sticky-header-wrapper .megawp-sticky-header .header-logo-area a {
  color: #fff;
}

.megawp-sticky-header-wrapper .megawp-header-menu ul li a {
  color: #fff;
  border-left: 1px solid rgba(255, 255, 255, 0.2);
  padding: 0 15px;
}

.megawp-sticky-header-wrapper .megawp-header-menu ul li:hover > a {
  color: #fff;
}

.megawp-sticky-header-wrapper .megawp-header-menu ul .current-menu-ancestor > a,
.megawp-sticky-header-wrapper .megawp-header-menu ul .current-menu-item > a {
  color: #fff;
}

.megawp-sticky-header-wrapper
  .megawp-header-menu
  ul
  .current-menu-ancestor:hover
  > a,
.megawp-sticky-header-wrapper
  .megawp-header-menu
  ul
  .current-menu-item:hover
  > a {
  color: #fff;
}

.megawp-sticky-header-wrapper .megawp-header-menu ul li ul li a {
  color: #000000;
  border-left: none;
}

.megawp-sticky-header-wrapper .megawp-header-menu ul li ul li:hover > a {
  color: #485460;
}

.megawp-sticky-header-wrapper
  .megawp-header-menu
  ul
  li
  ul
  .current-menu-ancestor
  > a,
.megawp-sticky-header-wrapper
  .megawp-header-menu
  ul
  li
  ul
  .current-menu-item
  > a {
  color: #ff4500;
}

.megawp-sticky-header-wrapper
  .megawp-header-menu
  ul
  li
  ul
  .current-menu-ancestor:hover
  > a,
.megawp-sticky-header-wrapper
  .megawp-header-menu
  ul
  li
  ul
  .current-menu-item:hover
  > a {
  color: #ff4500;
}

.megawp-sticky-header-wrapper .megawp-progress-container .megawp-progress-bar {
  background-color: red;
}

/*posts archive*/
.megawp-archive-classic-posts {
  grid-template-columns: 1fr 1fr 1fr;
  grid-column-gap: 15px;
  grid-row-gap: 20px;
}

.megawp-archive-cards-posts .megawp-post-item,
.megawp-archive-classic-posts .megawp-post-item {
  background-color: #fff;
  border-radius: 5px;
}

.megawp-archive-classic-posts .megawp-post-item {
  height: 100%;
}

.megawp-archive-classic-posts
  .megawp-post-item
  .megawp-classic-posts-thumbnail {
  border-radius: 5px;
  margin-bottom: 15px;
  height: 200px;
}

.megawp-archive-classic-posts .megawp-classic-posts-content {
  padding: 0 15px;
}

.megawp-archive-classic-posts .megawp-post-item .megawp-classic-posts-title a {
  margin-bottom: 15px;
  color: #000000;
  font-size: 15px;
  font-weight: 400;
  text-align: center;
  line-height: 30px;
}

.megawp-archive-classic-posts .megawp-post-item .megawp-classic-posts-meta {
  color: #bdbdbd;
  margin-bottom: 15px;
  font-size: 13px;
  font-weight: 400;
  text-align: center;
  line-height: 25px;
}

.megawp-archive-classic-posts .megawp-post-item .megawp-classic-posts-excerpt {
  margin-bottom: 15px;
  color: #757575;
  font-size: 14px;
  font-weight: 400;
  text-align: justify;
  line-height: 25px;
}

.megawp-archive-classic-posts
  .megawp-post-item
  .megawp-classic-posts-read-more-button {
  background-image: linear-gradient(45deg, #3498db, #276794);
  color: #fff;
  font-size: 15px;
  font-weight: 400;
  line-height: 35px;
}

.megawp-archive-classic-posts
  .megawp-post-item:hover
  > .megawp-classic-posts-read-more-button {
  background-image: linear-gradient(45deg, #ff4500, #b93d30);
}

.megawp-archive-pagination ul li span.current,
.megawp-archive-pagination ul li.megawp-pagination-active a {
  background-color: #485460;
}

@media screen and (max-width: 1023px) {
  .megawp-archive-classic-posts,
  .megawp-archive-products {
    grid-template-columns: 1fr 1fr;
  }
}

@media screen and (max-width: 767px) {
  .megawp-archive-classic-posts,
  .megawp-archive-products {
    grid-template-columns: 1fr;
  }
}

/*single pages*/
.megawp-single-pages-boxes-title,
.megawp-single-pages-boxes-title h1,
.megawp-single-pages-boxes-title h2,
.megawp-single-pages-boxes-title h3,
.megawp-single-pages-boxes-title h4,
.megawp-single-pages-boxes-title h5,
.megawp-single-pages-boxes-title h6,
.woocommerce .megawp-default-single-product-top-box div.product .product_title {
  font-size: 18px;
  font-weight: 400;
}

.megawp-post-content {
  font-size: 15px;
  font-weight: 400;
}

.megawp-comments-box
  .megawp-comments-box-content
  .comment-list
  li.comment
  article.comment-body
  .comment-content,
.woocommerce
  .megawp-product-comments
  #reviews
  #comments
  ol.commentlist
  li
  .comment-text {
  font-size: 15px;
  font-weight: 400;
  line-height: 30px;
}

.megawp-comments-box .megawp-comments-box-title h3,
.megawp-content .megawp-single-page-box .megawp-single-post-title h1,
.megawp-download-box .megawp-download-box-title h3 {
  color: #000;
}

.megawp-post-content {
  color: #000000;
}

.megawp-download-box .megawp-download-box-title span {
  color: #485460;
  border-color: #485460;
}

.megawp-download-box .megawp-download-box-title span:hover {
  background-color: #485460;
}

.megawp-download-files-password {
  background-color: #485460;
}

.megawp-download-box
  .megawp-download-box-links-area
  .download-link-item
  a.download-button {
  background-image: linear-gradient(45deg, #9dcc1e, #86b700);
  color: #ffffff;
}

.megawp-comments-box
  .megawp-comments-box-content
  .comment-list
  li.comment
  article.comment-body
  .comment-content,
.woocommerce
  .megawp-product-comments
  #reviews
  #comments
  ol.commentlist
  li
  .comment-text {
  background-image: linear-gradient(45deg, #f2f2f2, #f2f2f2);
  color: #000000;
}

.megawp-comments-box
  .megawp-comments-box-content
  .comment-list
  li.comment
  article.comment-body
  .comment-content
  a,
.woocommerce
  .megawp-product-comments
  #reviews
  #comments
  ol.commentlist
  li
  .comment-text
  p.meta {
  color: #000000;
}

.megawp-comments-box
  .megawp-comments-box-content
  .comment-list
  .children
  li.comment
  article.comment-body
  .comment-content,
.woocommerce
  .megawp-product-comments
  #reviews
  #comments
  ol.commentlist
  .children
  li
  .comment-text {
  background-image: linear-gradient(45deg, #f1f7ed, #ddf7d7);
  color: #000000;
}

.megawp-comments-box
  .megawp-comments-box-content
  .comment-list
  .children
  li.comment
  article.comment-body
  .comment-content
  a,
.woocommerce
  .megawp-product-comments
  #reviews
  #comments
  ol.commentlist
  .children
  li
  .comment-text
  p.meta {
  color: #000000;
}

.megawp-comments-box .megawp-comment-pagination .page-numbers {
  background-color: #485460;
}

.megawp-content
  .megawp-single-page-box
  .megawp-single-post-title
  span.megawp-single-post-view,
.megawp-download-box
  .megawp-download-box-title
  span.megawp-report-broken-links-button,
.megawp-single-post-modern-template
  .megawp-single-post-title
  span.megawp-single-post-view {
  margin: 3px 0;
}

/*woocommerce*/
.woocommerce .megawp-breadcrumbs .woocommerce-breadcrumb a {
  color: #3498db;
}

.woocommerce .megawp-breadcrumbs .woocommerce-breadcrumb a:hover {
  color: #485460;
}

.megawp-course-summery-box form.cart .button,
.megawp-default-single-product-top-box div.product form.cart .button {
  background-image: linear-gradient(to right, #70f570, #49c628);
  color: #fff !important;
}

.woocommerce .megawp-product-comments nav.woocommerce-pagination li a,
.woocommerce .megawp-product-comments nav.woocommerce-pagination li a:focus,
.woocommerce .megawp-product-comments nav.woocommerce-pagination li a:hover {
  background-color: #485460;
}

.megawp-course-short-block-info .megawp-course-student-count {
  background-color: #ceebff;
  color: #3498db;
}

.megawp-archive-products {
  grid-template-columns: 1fr 1fr 1fr;
  grid-column-gap: 20px;
  grid-row-gap: 30px;
}

.megawp-archive-modern2-products .megawp-product-item {
  height: 100%;
  border-radius: 10px;
  background-color: #fff;
}

.megawp-archive-modern2-products
  .megawp-product-item
  .megawp-modern2-products-thumbnail {
  height: 250px;
  margin-bottom: 15px;
}

.megawp-modern2-products .megawp-product-item .megawp-modern2-products-content {
  padding: 0 15px;
}

.megawp-archive-modern2-products
  .megawp-product-item
  .megawp-modern2-products-content
  .megawp-modern2-products-title {
  margin-bottom: 15px;
}

.megawp-archive-modern2-products
  .megawp-product-item
  .megawp-modern2-products-content
  .megawp-modern2-products-title {
  text-align: center;
  line-height: 25px;
  font-weight: 700;
  font-style: normal;
  font-size: 15px;
}

.megawp-archive-modern2-products
  .megawp-product-item
  .megawp-modern2-products-content
  .megawp-modern2-products-title
  a {
  color: #000000;
}

.megawp-archive-modern2-products
  .megawp-product-item
  .megawp-modern2-products-content
  .megawp-modern2-products-excerpt {
  margin-bottom: 15px;
  color: #474747;
  text-align: center;
  line-height: 25px;
  font-weight: 400;
  font-style: normal;
  font-size: 13px;
}

.megawp-archive-modern2-products
  .megawp-product-item
  .megawp-modern2-products-content
  .megawp-modern2-products-meta {
  color: #bc0000;
}

.megawp-archive-modern2-products
  .megawp-product-item
  .megawp-modern2-products-content
  .megawp-modern2-products-meta
  span {
  line-height: 25px;
  font-weight: 400;
  font-style: normal;
  font-size: 18px;
}

.megawp-archive-modern2-products
  .megawp-product-item
  .megawp-modern2-products-bottom-area {
  border-color: #dfe6e9 !important;
}

.megawp-archive-modern2-products
  .megawp-product-item
  .megawp-modern2-products-rating
  .star-rating,
.megawp-archive-modern2-products
  .megawp-product-item
  .megawp-modern2-products-rating
  .star-rating-empty:before {
  color: #f39c12;
}

.megawp-archive-modern2-products
  .megawp-product-item
  .megawp-modern2-products-bottom-area
  .megawp-modern2-products-price {
  color: #4caf50;
}

.megawp-archive-modern2-products
  .megawp-product-item
  .megawp-modern2-products-bottom-area
  .megawp-modern2-products-price
  del {
  color: #ff4500;
}

.megawp-archive-modern2-products
  .megawp-product-item
  .megawp-modern2-products-bottom-area
  a.megawp-modern2-products-read-more-button {
  border-radius: 5px;
  background-image: linear-gradient(45deg, #43a047, #43a047);
  color: #fff;
}

.megawp-archive-modern2-products
  .megawp-product-item
  .megawp-modern2-products-bottom-area
  a.megawp-modern2-products-read-more-button:hover {
  background-image: linear-gradient(45deg, #388e3c, #388e3c);
  color: #fff;
}

/*account colors*/
h1.megawp-account-page-title {
  font-size: 18px;
  font-weight: 700;
}

body.megawp-login-register-page-body {
  background-color: #3498db;
}

.megawp-login-register-page-container {
  background-color: #fff;
  box-shadow: 0 10px 20px rgba(255, 255, 255, 0.1);
}

.megawp-account-container .megawp-account-menu {
  background-color: #485460;
  border-width: 0;
}

.megawp-account-menu .megawp-account-user-info {
  border-top-right-radius: 5px;
  border-top-left-radius: 5px;
  color: #fff;
  padding-bottom: 20px;
  background-color: #3498db;
}

.megawp-account-menu .megawp-account-menu-items li a {
  color: #fff;
  font-size: 14px;
  font-weight: 400;
}

.megawp-account-menu .megawp-account-menu-items li a:hover {
  color: #fff;
  background-color: #5b6570;
}

.megawp-account-menu .megawp-account-menu-items li.current-menu-item a {
  color: #fff;
  background-color: #3498db;
}

/*responsive*/
.megawp-mobile-header {
  background-color: #fff;
}

.megawp-mobile-header .megawp-mobile-header-content .mobile-header-logo-area a {
  color: #485460;
}

.megawp-hamburger-icon,
.megawp-hamburger-icon:hover {
  color: #485460;
}

.megawp-mobile-menu-wrapper {
  background-color: #fff;
}

#megawp-mobile-menu-items ul ul li a,
.megawp-mobile-menu-buttons a,
.megawp-mobile-menu-search form {
  background-color: rgba(0, 0, 0, 0.06);
}

#megawp-mobile-menu-items > div > ul > li > a {
  border-color: rgba(0, 0, 0, 0.06) !important;
}

#megawp-mobile-menu-items ul li a,
.megawp-mobile-menu-buttons a,
.megawp-mobile-menu-search button,
.megawp-mobile-menu-search input[type="text"],
.megawp-mobile-menu-wrapper {
  color: #000000;
}

.megawp-mobile-menu-search input[type="text"]::placeholder {
  color: #000000;
}

.megawp-mobile-menu-search input[type="text"]:-ms-input-placeholder {
  color: #000000;
}

.megawp-mobile-menu-search input[type="text"]::-ms-input-placeholder {
  color: #000000;
}

.megawp-mobile-menu-buttons a:hover {
  color: #000000;
}

.megawp-mobile-menu-buttons .wp-dark-mode-switch .wp-dark-mode-ignore {
  width: 50px !important;
  height: 50px !important;
}

/*footer*/
footer.megawp-footer-v2 {
  background-color: #3498db;
}

.megawp-footer-wave .main-wave svg path {
  fill: #3498db;
}

footer.megawp-footer .megawp-footer-items-area {
  grid-template-columns: 1fr 1fr 1fr;
}

footer.megawp-footer h4.megawp-widget-title {
  color: #fff;
  font-size: 18px;
  line-height: 35px;
  font-weight: 400;
}

footer.megawp-footer h4.megawp-widget-title-style1 {
  border-color: #fff;
  font-size: 14px;
  line-height: 25px;
  font-weight: 400;
}

footer.megawp-footer .megawp-footer-bottom-area .megawp-copyright,
footer.megawp-footer .megawp-footer-widget-box,
footer.megawp-footer .tml-user-panel .tml-user-links li a,
footer.megawp-footer .widget_archive li a::before,
footer.megawp-footer .widget_categories li a::before,
footer.megawp-footer .widget_display_forums li a::before,
footer.megawp-footer .widget_display_stats dt::before,
footer.megawp-footer .widget_display_views li a::before,
footer.megawp-footer .widget_layered_nav li a::before,
footer.megawp-footer .widget_meta li a::before,
footer.megawp-footer .widget_nav_menu li a::before,
footer.megawp-footer .widget_pages li a::before,
footer.megawp-footer .widget_product_categories li a::before,
footer.megawp-footer .widget_recent_entries li a::before,
footer.megawp-footer .widget_rss li a::before {
  color: #fff;
}

footer.megawp-footer .megawp-footer-widget-box a {
  color: #fff;
}

footer.megawp-footer .megawp-footer-bottom-area .megawp-copyright {
  color: #fff;
}

footer.megawp-footer
  .megawp-footer-bottom-area
  .megawp-footer-social-networks
  a {
  color: #fff;
}

footer.megawp-footer .megawp-minicart .woocommerce-mini-cart,
footer.megawp-footer .megawp-minicart .woocommerce-mini-cart__total,
footer.megawp-footer .megawp-posts-widget .megawp-posts-widget-item,
footer.megawp-footer .megawp-products-widget .megawp-products-widget-item,
footer.megawp-footer .woocommerce ul.cart_list li,
footer.megawp-footer .woocommerce ul.product_list_widget li {
  border-color: #fff;
}

footer.megawp-footer .megawp-minicart .woocommerce-mini-cart__total,
footer.megawp-footer
  .megawp-minicart
  ul.cart_list
  li.woocommerce-mini-cart-item
  .megawp-minicart-item-content,
footer.megawp-footer
  .megawp-minicart
  ul.product_list_widget
  li.woocommerce-mini-cart-item
  .megawp-minicart-item-content,
footer.megawp-footer .megawp-products-widget .megawp-products-widget-item h5,
footer.megawp-footer .megawp-products-widget .megawp-products-widget-item span,
footer.megawp-footer .woocommerce ul.cart_list li .reviewer,
footer.megawp-footer .woocommerce ul.cart_list li .woocommerce-Price-amount,
footer.megawp-footer .woocommerce ul.cart_list li del,
footer.megawp-footer .woocommerce ul.cart_list li del .woocommerce-Price-amount,
footer.megawp-footer .woocommerce ul.product_list_widget li .reviewer,
footer.megawp-footer .woocommerce ul.product_list_widget li del,
footer.megawp-footer
  .woocommerce
  ul.product_list_widget
  li
  del
  .woocommerce-Price-amount,
footer.megawp-footer.woocommerce
  ul.product_list_widget
  li
  .woocommerce-Price-amount {
  color: #fff;
}

.tf-phased-product-sale-btn-scroll {
  width: 100%;
  line-height: 30px;
  padding: 5px 10px;
  font-size: 15px;
  margin: 5px 0;
  text-align: center;
  border-radius: 4px;
  display: block;
  box-sizing: border-box;
  color: #fff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  font-weight: 600;
  transition-duration: 0.2s;
  background-image: linear-gradient(to left, #6c757d, #9da1a5);
}

.tf-phased-product-sale-btn-scroll:hover {
  color: #fff;
  opacity: 0.85;
}

.tf-phased-product-sale-btn-scroll::before {
  margin-right: 0;
  margin-left: 5px;
  float: right;
  border-right: 0;
  border-left: 1px solid rgba(0, 0, 0, 0.1);
  padding-right: 0;
  padding-left: 10px;
  font-family: lineicons;
  content: "\eb06";
}

.tf-phased-product-levels-wrapper {
  margin-bottom: 20px;
}

.tf-phased-product-levels {
  padding: 0 20px 20px 20px;
}

.tf-phased-product-levels > li {
  display: block;
  box-sizing: border-box;
  margin-bottom: 15px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 5px;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.04);
}

.tf-phased-product-levels li:last-child {
  margin-bottom: 0;
}

.tf-phased-product-level-head {
  padding: 15px 20px;
}

.tf-phased-product-level-head .tf-phased-product-level-title {
  float: right;
  line-height: 35px;
  font-weight: 600;
}

.tf-phased-product-level-head i {
  float: right;
  margin-right: 15px;
  font-size: 12px;
  line-height: 35px;
  font-weight: 600;
  transition-duration: 0.4s;
}

.tf-phased-product-levels li .tf-phased-product-level-head.opened i {
  transform: rotate(180deg);
}

.tf-phased-product-level-head .tf-phased-product-price {
  float: left;
  font-size: 14px;
  line-height: 35px;
  font-weight: 600;
}

.tf-phased-product-level-head a {
  float: left;
  box-sizing: border-box;
  margin-right: 15px;
  border-radius: 3px;
  min-width: 105px;
  padding: 0 10px;
  background-color: #49c628;
  font-size: 13px;
  text-align: center;
  line-height: 35px;
  color: #fff;
}

/*.tf-phased-product-level-head a.tf-phased-product-sale-btn-disabled {
    opacity: .5;
}*/

.tf-phased-product-level-head a:hover {
  opacity: 0.85;
  color: #fff;
}

.tf-phased-product-levels li ul {
  display: none;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  background-color: #fff;
}

.tf-phased-product-levels li ul li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  padding: 15px 20px;
}

.tf-phased-product-levels li ul li span:last-child {
  margin-right: 10px;
  border-radius: 60px;
  padding: 5px 20px;
  background-color: #ceebff;
  color: #3498db;
}

.tf-loading {
  position: fixed;
  z-index: 1000;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.7);
}

.tf-loading i {
  position: absolute;
  top: calc(50% - 22px);
  left: calc(50% - 22px);
  width: 44px;
  height: 44px;
  color: #fff;
  background-image: url("../images/loading.png");
  background-repeat: no-repeat;
  background-size: 44px;
  background-position: center;
  animation: tf-spinner 0.5s linear infinite;
}

@keyframes tf-spinner {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}

.home-product-item,
.megawp-product-item {
  position: relative;
}

.tf-phased-product-badge {
  position: absolute;
  top: 10px;
  right: 10px;
  background: #f24413;
  color: #fff;
  padding: 5px 10px;
  border-radius: 5px;
  font-size: 12px;
}

.tf-phased-product-read-more-button {
  display: block;
}

.woocommerce-checkout .woocommerce-additional-fields {
  display: none;
}

body.megawp-login-register-page-body {
  background-image: url("../images/login-register-background.jpg");
  background-position: center;
  background-size: cover;
}

.megawp-login-register-page-container {
  border-radius: 10px;
  border: 2px solid #fff;
}

.megawp-login-register-page-container .digits-form_container {
  padding: 0;
  width: 100%;
  max-width: 100%;
  background-color: transparent;
}

.megawp-login-register-page-container .digits-form_heading {
  display: none;
}

.megawp-login-register-page-container .digits-form_tab-bar {
  justify-content: center;
}

html.wp-dark-mode-active
  .megawp-login-register-page-container
  .digits-form_input
  input:not(.digits_countrycode) {
  border-color: #fff;
}

.megawp-login-register-page-container .digits-form_border.digits-row_active,
.megawp-login-register-page-container .digits-form_input textarea:focus,
.megawp-login-register-page-container .digits-form_input input:focus {
  border-color: #3e297c !important;
}

.digits2_box .digits-form_input input .digits_otp_input-field {
  text-align: right;
}

.megawp-login-register-page-container .digits-form_rememberme {
  display: block;
  margin-bottom: 30px;
}

.megawp-login-register-page-container
  .digits-form_rememberme
  .dig_input_wrapper::before {
  background-color: #eee;
}

.megawp-login-register-page-container
  .digits-form_rememberme
  .dig_input_wrapper::before,
.megawp-login-register-page-container
  .digits-form_rememberme
  .dig_input_wrapper::after {
  right: 0;
}

.megawp-login-register-page-container
  .digits-form_rememberme
  .dig_input_wrapper
  > div {
  margin-left: 0;
}

.megawp-login-register-page-container .digits-form_button {
  display: flex !important;
  justify-content: center;
  align-items: center;
  background-color: #3e297c;
}

.megawp-login-register-page-container .digits-form_button span {
  margin: 0 5px;
}

.megawp-login-register-page-container .dig_login_signup_bar {
  display: block;
  margin-top: 30px;
  font-size: 16px;
  text-align: center;
}

.megawp-login-register-page-container .dig_login_signup_bar span {
  font-weight: 500;
}

.megawp-login-register-page-container .dig_login_signup_bar a {
  margin-right: 5px;
  font-weight: 700;
}

.megawp-login-register-page-container .aiowps-captcha {
  display: none;
}

.megawp-login-register-page-container .digits_site_footer_box {
  margin-top: 0;
}

/* Old Digits */
/*.megawp-login-register-page-container .dig_form {
    letter-spacing: -0.8px;
}

.megawp-login-register-page-container .dig_form label {
    margin-bottom: 5px;
    font-size: 14px;
    letter-spacing: -0.8px;
}

html.wp-dark-mode-active .megawp-login-register-page-container .dig_form label {
    color: #fff;
}

.megawp-login-register-page-container .dig_form input {
    border-radius: 5px !important;
    border: 0;
    background-color: #fff;
    padding: 12px 16px;
}

.megawp-login-register-page-container .dig_form input:focus {
    border: 0;
    background-color: #fff;
}

html.wp-dark-mode-active .megawp-login-register-page-container .dig_form input:focus {
    background-color: rgb(36, 37, 37);
}

.megawp-login-register-page-container .dig_form .dig-login-otp,
.megawp-login-register-page-container .dig_form .dig-register-otp {
    padding: 12px 16px !important;
}

.megawp-login-register-page-container .dig_form .countrycodecontainer input {
    border-radius: 0 !important;
    border-right: 1px solid #e0e0e0 !important;
}

.megawp-login-register-page-container .dig_form button {
    background-color: #FC6B68 !important;
    color: #fff !important;
    border-radius: 5px;
    box-shadow: 0 5px 20px rgba(0,0,0,.2);
    font-size: 15px !important;
}

.megawp-login-register-page-container .dig_form .button {
    background-color: #fff;
    color: #000;
    border-radius: 5px;
    box-shadow: 0 5px 20px rgba(0,0,0,.05);
    font-size: 15px !important;
}

.megawp-login-register-page-container .dig_form .signdesc {
    font-size: 14px;
}

.megawp-login-register-page-container .dig_form .transupbutton {
    background-color: rgba(255,255,255,.5);
    color: #000;
    border: 2px solid #fff;
    border-radius: 5px;
    font-size: 15px;
}

.megawp-login-register-page-container .dig_form .forgotpasswordaContainer,
.megawp-login-register-page-container .dig_form .backtoLoginContainer {
    margin-top: 12px !important;

}

.megawp-login-register-page-container .dig_form .forgotpasswordaContainer a,
.megawp-login-register-page-container .dig_form .backtoLoginContainer a {
    color: #000;
}*/

html.wp-dark-mode-active
  .megawp-login-register-page-container
  .dig_form
  .aiowps-captcha-equation {
  color: #fff;
}

.tf-question-notification-login-btn {
  display: block;
  padding: 10px 17px;
  color: #fff;
}

.tf-question-notification-login-btn:hover {
  color: #fff;
}

.tf-show-comment-raters-btn {
  display: inline-block;
  margin-top: 10px;
  border: 1px solid rgba(0, 0, 0, 0.3);
  border-radius: 5px;
  padding: 5px 15px;
  font-size: 13px;
  text-align: center;
}

.tf-comment-raters-wrapper {
  position: fixed;
  z-index: 10000;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7);
}

.tf-comment-raters-box {
  position: absolute;
  top: 50%;
  right: 50%;
  transform: translate(50%, -50%);
  overflow-y: auto;
  border-radius: 10px;
  box-sizing: border-box;
  width: 800px;
  max-width: calc(100% - 30px);
  max-height: calc(100% - 60px);
  padding: 50px 20px 20px;
  background-color: #fff;
}

.tf-comment-raters-box .lni-close {
  position: absolute;
  top: 5px;
  left: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 5px;
  width: 30px;
  height: 30px;
  background-color: #eb0909;
  cursor: pointer;
  color: #fff;
}

.tf-comment-raters-box > h3 {
  display: block;
  margin-bottom: 10px;
  font-weight: 800;
}

.tf-comment-raters-box ul {
  padding: 0;
  list-style: none;
}

.tf-comment-raters-box ul li {
  display: flex;
  align-items: center;
  gap: 15px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  padding: 15px 0;
}

.tf-comment-raters-box ul li:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.tf-comment-raters-box ul li img {
  border-radius: 100%;
  width: auto;
  height: 50px;
}

.tf-comment-rater-stars {
  display: flex;
  align-items: center;
}

.tf-comment-rater-stars i {
  color: #dadada;
}

.tf-comment-rater-stars i.active {
  color: #d0d003;
}

.tf-comment-rater-register-days {
  display: flex;
  align-items: center;
  gap: 7px;
  color: #f44336;
}

.tf-comment-rater-stars i {
  width: 25px;
  height: 25px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}

.tf-star-fill {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHdpZHRoPSI1MTIiIGhlaWdodD0iNTEyIiB4PSIwIiB5PSIwIiB2aWV3Qm94PSIwIDAgNTExLjk4NyA1MTEiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDUxMiA1MTIiIHhtbDpzcGFjZT0icHJlc2VydmUiIGNsYXNzPSIiPjxnPjxwYXRoIGZpbGw9IiNmZmMxMDciIGQ9Ik01MTAuNjUyIDE4NS45MDJhMjcuMTU4IDI3LjE1OCAwIDAgMC0yMy40MjUtMTguNzFsLTE0Ny43NzQtMTMuNDE5LTU4LjQzMy0xMzYuNzdDMjc2LjcxIDYuOTggMjY2Ljg5OC40OTQgMjU1Ljk5Ni40OTRzLTIwLjcxNSA2LjQ4Ny0yNS4wMjMgMTYuNTM0bC01OC40MzQgMTM2Ljc0Ni0xNDcuNzk3IDEzLjQxOEEyNy4yMDggMjcuMjA4IDAgMCAwIDEuMzQgMTg1LjkwMmMtMy4zNzEgMTAuMzY4LS4yNTggMjEuNzM5IDcuOTU3IDI4LjkwN2wxMTEuNyA5Ny45Ni0zMi45MzggMTQ1LjA5Yy0yLjQxIDEwLjY2OCAxLjczIDIxLjY5NiAxMC41ODIgMjguMDk0IDQuNzU3IDMuNDM4IDEwLjMyNCA1LjE4OCAxNS45MzcgNS4xODggNC44NCAwIDkuNjQtMS4zMDUgMTMuOTUtMy44ODNsMTI3LjQ2OC03Ni4xODQgMTI3LjQyMiA3Ni4xODRjOS4zMjQgNS42MSAyMS4wNzggNS4wOTcgMjkuOTEtMS4zMDVhMjcuMjIzIDI3LjIyMyAwIDAgMCAxMC41ODItMjguMDk0bC0zMi45MzctMTQ1LjA5IDExMS42OTktOTcuOTRhMjcuMjI0IDI3LjIyNCAwIDAgMCA3Ljk4LTI4LjkyN3ptMCAwIiBvcGFjaXR5PSIxIiBkYXRhLW9yaWdpbmFsPSIjZmZjMTA3IiBjbGFzcz0iIj48L3BhdGg+PC9nPjwvc3ZnPg==");
}

.tf-star-empty {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHdpZHRoPSI1MTIiIGhlaWdodD0iNTEyIiB4PSIwIiB5PSIwIiB2aWV3Qm94PSIwIDAgNTExLjk4NyA1MTEiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDUxMiA1MTIiIHhtbDpzcGFjZT0icHJlc2VydmUiIGNsYXNzPSIiPjxnPjxwYXRoIGZpbGw9IiNlM2UzZTMiIGQ9Ik01MTAuNjUyIDE4NS45MDJhMjcuMTU4IDI3LjE1OCAwIDAgMC0yMy40MjUtMTguNzFsLTE0Ny43NzQtMTMuNDE5LTU4LjQzMy0xMzYuNzdDMjc2LjcxIDYuOTggMjY2Ljg5OC40OTQgMjU1Ljk5Ni40OTRzLTIwLjcxNSA2LjQ4Ny0yNS4wMjMgMTYuNTM0bC01OC40MzQgMTM2Ljc0Ni0xNDcuNzk3IDEzLjQxOEEyNy4yMDggMjcuMjA4IDAgMCAwIDEuMzQgMTg1LjkwMmMtMy4zNzEgMTAuMzY4LS4yNTggMjEuNzM5IDcuOTU3IDI4LjkwN2wxMTEuNyA5Ny45Ni0zMi45MzggMTQ1LjA5Yy0yLjQxIDEwLjY2OCAxLjczIDIxLjY5NiAxMC41ODIgMjguMDk0IDQuNzU3IDMuNDM4IDEwLjMyNCA1LjE4OCAxNS45MzcgNS4xODggNC44NCAwIDkuNjQtMS4zMDUgMTMuOTUtMy44ODNsMTI3LjQ2OC03Ni4xODQgMTI3LjQyMiA3Ni4xODRjOS4zMjQgNS42MSAyMS4wNzggNS4wOTcgMjkuOTEtMS4zMDVhMjcuMjIzIDI3LjIyMyAwIDAgMCAxMC41ODItMjguMDk0bC0zMi45MzctMTQ1LjA5IDExMS42OTktOTcuOTRhMjcuMjI0IDI3LjIyNCAwIDAgMCA3Ljk4LTI4LjkyN3ptMCAwIiBvcGFjaXR5PSIxIiBkYXRhLW9yaWdpbmFsPSIjZmZjMTA3IiBjbGFzcz0iIj48L3BhdGg+PC9nPjwvc3ZnPg==");
}

.tf-session-performance-scoring {
  margin-bottom: 20px;
  padding: 25px;
  text-align: center;
  background-color: rgb(255, 253, 241) !important;
}

.tf-session-performance-scoring h4 {
  display: block;
  margin-bottom: 20px;
  font-size: 20px;
  font-weight: 700;
}

.tf-session-performance-scoring-buttons {
  display: flex;
  justify-content: center;
  gap: 20px;
}

.tf-session-performance-scoring-buttons :is(a, span) {
  display: block;
}

.tf-session-performance-scoring-buttons a {
  margin-bottom: 5px;
}

.tf-session-performance-scoring-buttons a svg {
  width: 50px;
  height: 50px;
  transition: all 0.3s ease;
}

.tf-session-performance-scoring-buttons a:hover svg {
  transform: scale(1.1);
}

.tf-session-performance-scoring-buttons span {
  line-height: 1;
}

@media screen and (max-width: 768px) {
  .tf-session-performance-scoring h4 {
    font-size: 18px;
  }

  .tf-session-performance-scoring-buttons a svg {
    width: 40px;
    height: 40px;
  }
}

.tf-session-rated-performance {
  display: block;
  border-radius: 15px;
  padding: 20px;
  background-color: #eee;
  text-align: center;
}

.tf-session-rated-performance h4 {
  font-size: 15px;
  font-weight: 700;
}

.tf-session-rated-performance-subtitle span {
  display: block;
}

.tf-session-rated-performance-battery {
  position: relative;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-column-gap: 3px;
  margin: 15px auto 0;
  border: 4px solid #000;
  border-radius: 13px;
  box-sizing: border-box;
  width: 100%;
  height: 100px;
  padding: 5px;
}

.tf-session-rated-performance-battery-item {
  border-radius: 5px;
  background-color: #000;
  height: 100%;
}

.tf-session-rated-performance-battery-after {
  position: absolute;
  top: 50%;
  right: 100%;
  transform: translateY(-50%);
  border-radius: 3px 0 0 3px;
  width: 9px;
  height: 40px;
  background-color: #000;
}

.tf-session-rated-performance p {
  margin-top: 15px;
}

.tf-edit-profile-pic {
  margin-bottom: 15px;
}

.tf-edit-profile-pic-buttons {
  display: flex;
  align-items: center;
  gap: 10px;
}

.tf-edit-profile-pic-buttons.disable {
  opacity: 0.5;
  pointer-events: none;
}

.tf-edit-profile-pic-buttons
  :is(.tf-edit-profile-pic-btn, .tf-edit-profile-pic-delete-btn) {
  flex-grow: 1;
  border-radius: 3px;
  padding: 5px;
  font-size: 13px;
  line-height: 25px;
  letter-spacing: -0.8px;
  text-align: center;
}

.tf-edit-profile-pic-btn {
  position: relative;
  background-color: #fff;
  color: #000;
}

.tf-edit-profile-pic-btn input {
  position: absolute;
  top: 0;
  right: 0;
  opacity: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
}

.tf-edit-profile-pic-delete-btn {
  background-color: #f4511d;
  color: #fff;
}

.tf-edit-profile-pic-delete-btn:hover {
  color: #fff;
}

.tf-edit-profile-pic-progress {
  display: none;
  overflow: hidden;
  margin-top: 15px;
  border-radius: 5px;
  height: 25px;
  direction: ltr;
  background-color: #d7d7d7;
}

.tf-edit-profile-pic-progress-bar {
  width: 0;
  height: 25px;
  background-color: #3e297c;
  font-size: 11px;
  text-align: center;
  color: #fff;
}

@-webkit-keyframes progress-bar-stripes {
  from {
    background-position: 40px 0;
  }
  to {
    background-position: 0 0;
  }
}

@keyframes progress-bar-stripes {
  from {
    background-position: 25px 0;
  }
  to {
    background-position: 0 0;
  }
}

.tf-edit-profile-pic-progress-bar {
  transition-duration: 0.2s;
  -webkit-animation: progress-bar-stripes 2s linear infinite;
  -o-animation: progress-bar-stripes 2s linear infinite;
  animation: progress-bar-stripes 2s linear infinite;
  background-image: -webkit-linear-gradient(
    45deg,
    rgba(255, 255, 255, 0.15) 25%,
    transparent 25%,
    transparent 50%,
    rgba(255, 255, 255, 0.15) 50%,
    rgba(255, 255, 255, 0.15) 75%,
    transparent 75%,
    transparent
  );
  background-image: -o-linear-gradient(
    45deg,
    rgba(255, 255, 255, 0.15) 25%,
    transparent 25%,
    transparent 50%,
    rgba(255, 255, 255, 0.15) 50%,
    rgba(255, 255, 255, 0.15) 75%,
    transparent 75%,
    transparent
  );
  background-image: linear-gradient(
    45deg,
    rgba(255, 255, 255, 0.15) 25%,
    transparent 25%,
    transparent 50%,
    rgba(255, 255, 255, 0.15) 50%,
    rgba(255, 255, 255, 0.15) 75%,
    transparent 75%,
    transparent
  );
  background-size: 25px 25px;
}

.tf-contact-action-btn {
  position: fixed;
  z-index: 1000;
  right: 30px;
  bottom: 60px;
}

.tf-contact-action-btn a {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  transition-duration: 0.2s;
  border-radius: 100%;
  width: 55px;
  height: 55px;
  font-size: 18px;
}

.tf-contact-action-btn a:hover {
  opacity: 0.85;
  font-size: 20px;
}

.tf-contact-action-btn-toggle {
  z-index: 10;
  bottom: 0;
  background-color: rgb(48, 176, 67);
  color: #fff;
}

.tf-contact-action-btn-toggle:hover {
  color: #fff;
}

.tf-contact-action-btn-toggle i {
  position: absolute;
  top: 50%;
  right: 50%;
  transform: translate(50%, -50%);
  transition-duration: 0.4s;
}

.tf-contact-action-btn.active .tf-contact-action-btn-toggle .lni-comments {
  opacity: 0;
  transform: rotate(180deg);
}

.tf-contact-action-btn-toggle .lni-close {
  opacity: 0;
  transform: rotate(180deg);
}

.tf-contact-action-btn.active .tf-contact-action-btn-toggle .lni-close {
  opacity: 1;
  transform: translate(50%, -50%) rotate(0);
}

.tf-contact-action-btn a:not(.tf-contact-action-btn-toggle) {
  z-index: 1;
}

.tf-contact-action-btn-whatsapp {
  bottom: 65px;
  background-color: #49E670;
  color: #fff;
}

.tf-contact-action-btn-whatsapp:hover {
  color: #fff;
}

.tf-contact-action-btn-telegram {
  bottom: 125px;
  background-color: #0084c6;
  color: #fff;
}

.tf-contact-action-btn-telegram:hover {
  color: #fff;
}

.tf-contact-action-btn:not(.active) a:not(.tf-contact-action-btn-toggle) {
  bottom: 0;
  opacity: 0;
}

/* =========================================
   Home Page Custom Styles
   ========================================= */

/* بنر پادکست */

.tf-podcast-title{
    color:#1a2b4c!important;
    font-size:24px;
    font-weight:bold;
    margin:0;
    line-height:1.5;
}

.tf-podcast-icon{
    width:45px;
    height:45px;
    fill:#1a2b4c;
    animation:tf_podcast_float 3s ease-in-out infinite;
}

@keyframes tf_podcast_float{
    0%{transform:translateY(0);}
    50%{transform:translateY(-4px);}
    100%{transform:translateY(0);}
}

@media (max-width:768px){

    .tf-podcast-wrapper{
        margin:25px 0!important;
    }

    .tf-podcast-banner{
        padding:20px 0;
    }

    .tf-podcast-content{
        flex-direction:column;
        text-align:center;
        gap:12px;
    }

    .tf-podcast-title{
        font-size:19px;
    }

    .tf-podcast-icon{
        width:38px;
        height:38px;
    }
}

/* آرشیو مقالات */

.tf-modern-archives{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:25px!important;
    align-items:stretch!important;
}

@media (max-width:992px){
    .tf-modern-archives{
        grid-template-columns:1fr!important;
    }
}

.tf-modern-archives .home-archive-posts-cat{
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    float:none!important;
    margin:0!important;
}

.tf-modern-archives .home-archive-posts-item{
    display:flex!important;
    flex-direction:row!important;
    gap:15px!important;
    background:#fff!important;
    border-radius:12px!important;
    box-shadow:0 4px 15px rgba(0,0,0,.04)!important;
    padding:12px!important;
    margin-bottom:15px!important;
    transition:transform .3s ease,box-shadow .3s ease!important;
    height:140px!important;
    border:1px solid #f0f0f0!important;
    box-sizing:border-box!important;
    align-items:center!important;
}

.tf-modern-archives .home-archive-posts-item:hover{
    transform:translateY(-4px)!important;
    box-shadow:0 8px 25px rgba(122,88,235,.15)!important;
    border-color:#e5defa!important;
}

.tf-modern-archives .home-archive-posts-item-thumbnail{
    width:100px!important;
    min-width:100px!important;
    height:114px!important;
    border-radius:8px!important;
    background-size:cover!important;
    background-position:center!important;
    background-repeat:no-repeat!important;
    flex-shrink:0!important;
    display:block!important;
    float:none!important;
    margin:0!important;
}

.tf-modern-archives .home-archive-posts-item > div{
    flex:1!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
    height:100%!important;
    padding:0!important;
    float:none!important;
}

.tf-modern-archives .home-archive-posts-item h3{
    font-size:14px!important;
    font-weight:bold!important;
    margin:0 0 6px 0!important;
    line-height:1.5!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
}

.tf-modern-archives .home-archive-posts-item p{
    font-size:12px!important;
    color:#666!important;
    margin:0!important;
    line-height:1.6!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
}

.tf-modern-archives .home-archive-posts-item span{
    font-size:11px!important;
    color:#999!important;
    margin-top:auto!important;
    display:flex!important;
    align-items:center!important;
    gap:5px!important;
}

.tf-modern-archives .home-archive-posts-cat-btn{
    margin-top:auto!important;
    display:block!important;
    text-align:center!important;
    background:#7a58eb!important;
    color:#fff!important;
    border-radius:8px!important;
    padding:12px 0!important;
    font-weight:bold!important;
    transition:all .3s ease!important;
    border:none!important;
    width:100%!important;
    box-sizing:border-box!important;
}

.tf-modern-archives .home-archive-posts-cat-btn:hover{
    background:#6344cc!important;
    box-shadow:0 4px 15px rgba(122,88,235,.4)!important;
}
/* Podcast Banner */

.tf-podcast-banner{
    display:block;
    text-decoration:none !important;
    background:linear-gradient(90deg,#FFD54F 0%,#FF9800 100%);
    width:100%;
    padding:25px 0;
    box-shadow:0 4px 20px rgba(255,152,0,.25);
    transition:all .3s ease;
    cursor:pointer;
}

.tf-podcast-banner:hover{
    background:linear-gradient(90deg,#FFE082 0%,#FFA726 100%);
    box-shadow:0 6px 25px rgba(255,152,0,.4);
}

.tf-podcast-content{
    display:flex;
    align-items:center;
    justify-content:center;
    direction:rtl;
    gap:18px;
    max-width:1200px;
    margin:0 auto;
    padding:0 20px;
}

/* استایل دکمه خرید مدرن و جذاب */
.tf-modern-buy-btn {
    display: block;
    width: 100%;
    padding: 12px 0;
    margin-top: 15px;
    background: linear-gradient(135deg, #00b09b 0%, #96c93d 100%);
    color: #ffffff !important;
    text-align: center;
    border-radius: 8px;
    font-size: 16px;
    font-weight: bold;
    text-decoration: none;
    box-shadow: 0 4px 15px rgba(0, 176, 155, 0.3);
    transition: all 0.3s ease;
    border: none;
}

.tf-modern-buy-btn:hover {
    background: linear-gradient(135deg, #009688 0%, #8bc34a 100%);
    box-shadow: 0 6px 22px rgba(0, 176, 155, 0.5);
    transform: translateY(-3px);
}

.home-product-item {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

/* استایل اختصاصی و تضمینی برای باکس‌های آمار */
.tf-modern-stats-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 25px;
    margin: 60px 0;
    width: 100%;
    max-width: 100%; /* جلوگیری از بیرون زدگی کانتینر اصلی */
    box-sizing: border-box; /* بسیار مهم: محاسبه دقیق حاشیه‌ها در عرض کل */
    direction: rtl;
}

.tf-modern-stat-box {
    background-color: #ffffff !important;
    border-radius: 16px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
    padding: 35px 20px;
    text-align: center;
    flex: 1 1 220px; /* استفاده از flex-basis به جای min-width برای انعطاف بهتر */
    box-sizing: border-box; /* جلوگیری از اضافه شدن پدینگ به عرض باکس */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    border: 1px solid #f0f0f0;
}

.tf-modern-stat-box:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.2);
}

.tf-stat-icon {
    width: 45px;
    height: 45px;
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tf-stat-icon svg {
    width: 100%;
    height: 100%;
    fill: #888888;
    transition: fill 0.3s ease; /* تغییر نرم رنگ آیکون */
}

.tf-stat-title {
    font-size: 17px !important;
    color: #666666 !important;
    font-weight: 600 !important;
    margin: 0 0 15px 0 !important;
    line-height: 1.5;
}

.tf-stat-number {
    font-size: 46px !important;
    font-weight: bold !important;
    color: #222222 !important;
    direction: ltr;
    display: block;
    font-family: Tahoma, !important;
    transition: color 0.3s ease !important; /* تغییر نرم رنگ عدد */
}

/* تغییر رنگ آیکون و عدد به سبز، وقتی موس روی باکس می‌رود */
.tf-modern-stat-box:hover .tf-stat-icon svg {
    fill: #00b09b; 
}

.tf-modern-stat-box:hover .tf-stat-number {
    color: #00b09b !important;
}

/* --- تنظیمات رسپانسیو اصلاح شده --- */

@media (max-width: 768px) {
    .tf-modern-stat-box {
        /* محاسبه عرض دقیق با در نظر گرفتن فاصله (gap: 25px) */
        flex: 1 1 calc(50% - 25px); 
    }
}

@media (max-width: 480px) {
    .tf-modern-stat-box {
        /* در حالت موبایل، باکس کل عرض مجاز را پر می‌کند */
        flex: 1 1 100%; 
        width: 100%;
    }
}

@media only screen and (max-width: 480px) {
    .home-feel-better .megawp-site-center span {
        font-size: 24px; /* یا مقدار دلخواه کمتر */
        white-space: nowrap; /* جلوگیری از شکستن خط */
    }
}

/* مخفی کردن باکس آخرین مطلب در موبایل */
@media screen and (max-width: 768px) {
    .home-last-posts-container {
        display: none !important;
    }
}

/* ==================================================
   استایل‌های اختصاصی اسلایدر شگفتی‌سازان و موبایل
   ================================================== */

/* استایل تصاویر اسلایدر (جایگزین کدهای خطی طولانی) */
.tf-slide-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    transition: opacity 0.5s ease-in-out;
}

/* اصلاح چیدمان، حذف فضای خالی و مربعی شدن قطعی عکس‌های صفحه اصلی در موبایل */
@media screen and (max-width: 768px) {
    .home-course-box {
        display: flex !important;
        flex-direction: column !important;
        margin-bottom: 25px !important;
        height: auto !important; /* رفع مشکل فضای خالی اضافی باکس */
        min-height: 0 !important;
    }
    .home-course-box-thumbnail.tf-responsive-thumb {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        padding: 0 !important; /* خنثی کردن پدینگ‌های مزاحم قالب */
        aspect-ratio: 1 / 1 !important; /* مربعی شدن دقیق و اجباری عکس‌ها */
        border-radius: 10px 10px 0 0 !important;
    }
    .home-course-box > div:not(.home-course-box-thumbnail) {
        width: 100% !important;
        height: auto !important; /* از بین بردن فاصله زیاد بین متن و دکمه */
        padding: 20px 15px !important;
        box-sizing: border-box !important;
    }
}

/* ==================================================
   تبدیل بخش مقالات و نکات طلایی به اسکرول افقی در موبایل
   ================================================== */
@media screen and (max-width: 768px) {
    
    /* محفظه اصلی مقالات */
    .home-archive-posts.tf-modern-archives {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        scroll-snap-type: x mandatory !important; /* فعال‌سازی حالت چسبندگی اسکرول */
        -webkit-overflow-scrolling: touch !important; /* اسکرول نرم در گوشی‌های آیفون */
        gap: 15px !important; /* فاصله بین باکس‌ها */
        padding-bottom: 20px !important;
        margin-right: 0 !important;
        margin-left: 0 !important;
        padding-right: 15px !important; /* فاصله از لبه راست صفحه */
        scrollbar-width: none !important; /* مخفی کردن نوار اسکرول در فایرفاکس */
    }
    
    /* مخفی کردن نوار اسکرول در کروم و سافاری برای ظاهر تمیزتر */
    .home-archive-posts.tf-modern-archives::-webkit-scrollbar {
        display: none !important;
    }

    /* استایل هر ستون (باکس) */
    .home-archive-posts.tf-modern-archives .home-archive-posts-cat {
        flex: 0 0 85% !important; /* عرض 85 درصدی تا باکس بعدی کمی بیرون بماند و کاربر متوجه اسکرول شود */
        max-width: 85% !important;
        scroll-snap-align: center !important; /* توقف دقیق و خودکار روی هر باکس هنگام ورق زدن */
        margin-bottom: 0 !important; 
    }
}

/* ==================================================
   زیباسازی، بزرگ‌نمایی عناوین و گرادیان ستون‌های مطالب
   ================================================== */

/* 1. بزرگ کردن و استایل‌دهی به عنوان هر ستون */
.home-archive-posts.tf-modern-archives .home-archive-posts-cat h2 {
    font-size: 22px !important;
    font-weight: 900 !important;
    text-align: center !important;
    margin-bottom: 25px !important;
    padding-bottom: 15px !important;
    color: #ffffff !important;
    border-bottom: 1px solid rgba(255,255,255,0.1); /* یک خط ظریف زیر عنوان */
}

/* 2. استایل پایه و گرد کردن گوشه‌های هر ستون */
.home-archive-posts.tf-modern-archives .home-archive-posts-cat {
    border-radius: 16px !important;
    padding: 25px 15px !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4) !important;
    border: 1px solid rgba(255, 255, 255, 0.03) !important;
}

/* 3. گرادیان و رنگ اختصاصی ستون اول (نکات طلایی لاغری) */
.home-archive-posts.tf-modern-archives .home-archive-posts-cat:nth-child(1) {
    background: linear-gradient(160deg, rgba(212, 155, 37, 0.12) 0%, rgba(30, 30, 30, 0.95) 100%) !important;
    border-top: 5px solid #d49b25 !important;
}

/* 4. گرادیان و رنگ اختصاصی ستون دوم (قانون جذب) */
.home-archive-posts.tf-modern-archives .home-archive-posts-cat:nth-child(2) {
    background: linear-gradient(160deg, rgba(142, 68, 173, 0.12) 0%, rgba(30, 30, 30, 0.95) 100%) !important;
    border-top: 5px solid #8e44ad !important;
}

/* 5. گرادیان و رنگ اختصاصی ستون سوم (مقالات) */
.home-archive-posts.tf-modern-archives .home-archive-posts-cat:nth-child(3) {
    background: linear-gradient(160deg, rgba(39, 174, 96, 0.12) 0%, rgba(30, 30, 30, 0.95) 100%) !important;
    border-top: 5px solid #27ae60 !important;
}

/* ==================================================
   بهینه‌سازی کامل صفحه اصلی در موبایل (اسکرول، قیمت، شمارنده)
   ================================================== */
@media screen and (max-width: 768px) {
    
    /* --- ۱. اسکرول افقی محصولات --- */
    .home-products-list {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        scroll-snap-type: x mandatory !important;
        -webkit-overflow-scrolling: touch !important;
        gap: 15px !important;
        padding-bottom: 20px !important;
        margin-right: 0 !important;
        margin-left: 0 !important;
        scrollbar-width: none !important; /* فایرفاکس */
    }
    .home-products-list::-webkit-scrollbar {
        display: none !important; /* کروم و سافاری */
    }
    .home-product-item {
        flex: 0 0 75% !important; /* عرض 75 درصدی برای نمایش بخشی از محصول بعدی */
        max-width: 75% !important;
        scroll-snap-align: center !important;
        margin-bottom: 0 !important;
    }

/* --- ۲. افزایش خوانایی قیمت محصولات (هماهنگ با تم روشن و تاریک) --- */
    .home-product-item-price .amount {
        /* دستور رنگ سفید حذف شد تا قالب خودش رنگ مناسب را انتخاب کند */
        font-weight: 900 !important; /* ضخیم‌ترین حالت فونت */
        font-size: 17px !important; /* کمی بزرگ‌تر شدن عدد */
    }
    .home-product-item-price .woocommerce-Price-currencySymbol {
        color: #d49b25 !important; /* رنگ طلایی کلمه تومان */
        font-weight: bold !important;
        font-size: 14px !important;
        margin-right: 3px !important; 
    }

    /* --- ۳. چیدمان شبکه‌ای (جدولی) شمارنده‌ها --- */
    .tf-modern-stats-container {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important; /* تقسیم به دو ستون */
        gap: 12px !important;
        padding: 10px !important;
    }
    .tf-modern-stat-box {
        padding: 15px 10px !important; /* کاهش پدینگ‌های مزاحم */
        margin: 0 !important;
        min-height: auto !important;
    }
    .tf-stat-icon svg {
        width: 35px !important;
        height: 35px !important;
        margin-bottom: 8px !important;
    }
    .tf-stat-number {
        font-size: 22px !important; 
    }
    .tf-stat-title {
        font-size: 12px !important;
        line-height: 1.4 !important;
        margin-bottom: 5px !important;
    }
}

/* ==================================================
   ۴. اسکرول افقی بخش گزارش کاربران (بدون تغییر رنگ و استایل)
   ================================================== */
@media screen and (max-width: 768px) {
    
    /* تبدیل کانتینر به اسکرول افقی */
    .home-report-users {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        scroll-snap-type: x mandatory !important;
        -webkit-overflow-scrolling: touch !important;
        gap: 15px !important;
        padding-bottom: 15px !important;
        margin-right: 0 !important;
        margin-left: 0 !important;
        padding-right: 15px !important; /* فاصله از لبه راست صفحه */
        padding-left: 15px !important; /* فاصله از لبه چپ صفحه */
        scrollbar-width: none !important; /* مخفی کردن اسکرول‌بار در فایرفاکس */
    }

    /* مخفی کردن نوار اسکرول در کروم و سافاری */
    .home-report-users::-webkit-scrollbar {
        display: none !important;
    }

    /* تنظیم عرض هر باکس برای ورق خوردن استاندارد */
    .home-report-users > div {
        flex: 0 0 85% !important; /* نمایش 85 درصد عرض برای دیده شدن باکس بعدی */
        max-width: 85% !important;
        scroll-snap-align: center !important;
        margin-bottom: 0 !important; /* حذف فاصله پایینی که باعث به هم ریختگی می‌شد */
    }
}

/* ==================================================
   یکنواخت کردن فاصله‌ی بین باکس‌های صفحه اصلی
   ================================================== */

/* ایجاد فاصله دقیق از پایین برای باکس محصولات */
.home-products {
    margin-bottom: 40px !important;
}

/* ایجاد فاصله دقیق از پایین برای باکس شمارنده و حذف فاصله‌ی اضافه از بالا */
#tf-stats-section {
    margin-top: 0 !important;
    margin-bottom: 40px !important;
}

/* ایجاد فاصله دقیق از پایین برای اسلایدر نتایج دانشجویان */
.home-student-experiences-slider {
    margin-top: 0 !important;
    margin-bottom: 40px !important;
}

/* اصلاح فاصله کادر پادکست */
.tf-podcast-wrapper {
    margin-top: 0 !important;
    margin-bottom: 40px !important;
}

/* ==================================================
   ۵. فشرده‌سازی و کاهش فاصله عمودی لیست کاربران
   ================================================== */
@media screen and (max-width: 768px) {
    /* هدف قرار دادن آیتم‌های لیست کاربران داخل باکس‌ها */
    .home-report-users ul li,
    .home-report-users ol li,
    .home-report-users .buddypress-members li,
    .home-report-users [class*="leaderboard"] li,
    .home-report-users [class*="item"] {
        padding-top: 1px !important;    /* کاهش فاصله از بالا */
        padding-bottom: 1px !important; /* کاهش فاصله از پایین */
        margin-bottom: 1px !important;  /* کاهش فاصله تا نفر بعدی */
    }

    /* اگر لیست به صورت جدول ساخته شده باشد */
    .home-report-users table tr td,
    .home-report-users table tr th {
        padding: 8px 5px !important;
    }
    
    /* کوچک‌تر کردن آواتار (عکس پروفایل) برای تناسب با لیست فشرده */
    .home-report-users img.avatar {
        width: 35px !important;
        height: 35px !important;
    }
}

/* ==================================================
   ۶. کد نهایی بهینه‌سازی بخش گزارش کاربران (دسکتاپ)
   ================================================== */
@media screen and (min-width: 769px) {
    
    /* ۱. تنظیمات فشرده‌سازی لیست کاربران */
    .home-report-users ul li,
    .home-report-users ol li,
    .home-report-users [class*="item"] {
        padding-top: 2px !important;    
        padding-bottom: 2px !important; 
        margin-bottom: 2px !important;  
        display: flex !important;
        align-items: center !important;
        white-space: nowrap !important;
    }

    /* ۲. تنظیمات آواتار - دایره کامل و جلوگیری از کشیدگی */
    .home-report-users img.avatar {
        width: 25px !important;
        height: 25px !important;
        border-radius: 50% !important; /* دایره‌ای شدن */
        object-fit: cover !important;  /* جلوگیری از بیضی شدن */
        min-width: 25px !important;    
        margin-left: 8px !important;
    }

    /* ۳. جلوگیری از شکستن نام کاربر */
    .home-report-users .user-name, 
    .home-report-users a, 
    .home-report-users span {
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        max-width: 120px;
    }

    /* ۴. اصلاح متن زیر عنوان ستون‌ها (کلاس صحیح: tf-report-box-subtitle) */
     
    .home-report-users .tf-report-box-subtitle {
        display: inline-block !important; /* تبدیل به حالت خطی برای جلوگیری از شکستن */
        text-align: center !important;
        margin: 5px auto 15px auto !important;
        font-size: 13px !important;
        color: #666 !important;
        line-height: 1.4 !important;
        
        /* این دو خط جلوی شکستن متن را می‌گیرند */
        white-space: nowrap !important; 
        width: auto !important;
        
        /* ایجاد فضای تنفس */
        padding: 0 10px !important;
        max-width: 95% !important; /* جلوگیری از بیرون‌زدگی از باکس */
    }

    /* وسط‌چین کردن باکس دربرگیرنده */
    .home-report-users {
        text-align: center !important;
    }

/* اطمینان از وسط‌چین بودن کل ستون */
    .home-report-users {
        text-align: center !important;
    }
}

/* استایل بهینه برای باکس‌های آزمایشگاه */
.tf-labs-section {
    margin: 40px auto;
    padding: 20px;
}

.tf-labs-title {
    text-align: center;
    margin-bottom: 30px !important;
    font-weight: 700 !important;
    color: #333;
}

.tf-labs-grid {
    display: grid;
    grid-template-columns: 1fr 1fr; /* دو ستون مساوی */
    gap: 20px;
}

.tf-lab-box {
    background: #fff;
    padding: 30px;
    border-radius: 15px;
    text-align: center;
    text-decoration: none !important;
    border: 1px solid #e0e0e0;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.tf-lab-box:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.1);
    border-color: #3498db;
}

.tf-lab-icon {
    font-size: 40px;
    margin-bottom: 15px;
}

.tf-lab-box h3 {
    font-size: 18px !important;
    margin: 5px 0 !important;
    color: #000 !important;
}

.tf-lab-box p {
    font-size: 14px !important;
    color: #666 !important;
    margin: 0 !important;
}

/* بهینه‌سازی برای موبایل: تک ستونه شدن */
@media screen and (max-width: 768px) {
    .tf-labs-grid {
        grid-template-columns: 1fr;
    }
}
/* استایل باکس با پس‌زمینه رنگی بسیار ملایم */
.tf-lab-box {
    background: #fdfdfd; /* سفیدِ خیلی گرم */
    border: 1px solid #e0e0e0;
    /* اگر خواستید پس‌زمینه رنگی خیلی ملایم داشته باشد، این خط را جایگزین کنید: */
    /* background: linear-gradient(135deg, #f9fff9 0%, #ffffff 100%); */
}

/* بزرگ‌تر کردن آیکون برای دیده شدن بهتر */
.tf-lab-icon {
    font-size: 45px; 
    margin-bottom: 15px;
    display: block;
}

/* بازگرداندن تایمر افزونه کوییز به بالای نوار پیشرفت */
.wq-quiz-trivia .wq_triviaQuizTimerCtr {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    margin-bottom: 15px !important; /* ایجاد فاصله مناسب با نوار پیشرفت */
    display: inline-block !important;
    z-index: 10 !important;
}

/* برای اطمینان از اینکه نوار پیشرفت زیر تایمر قرار می‌گیرد */
.wq-quiz-wrapper .wq_quizProgressBarCtr {
    clear: both !important;
    margin-top: 10px !important;
}

/* افکت نوری اختصاصی برای باکس آزمون */
.highlight-quiz-box {
    animation: pulse-glow-quiz 2.5s infinite alternate;
    border-radius: 8px; /* اگر باکس‌های شما گوشه‌های گرد دارند */
}

@keyframes pulse-glow-quiz {
    0% {
        box-shadow: 0 0 5px rgba(66, 185, 131, 0.2);
    }
    100% {
        box-shadow: 0 0 20px rgba(66, 185, 131, 0.8);
    }
}
/* جلوگیری از بیرون‌زدگی و اسکرول افقی در کل سایت */
html, body {
    width: 100%;
    max-width: 100vw;
    overflow-x: hidden !important;
    position: relative;
}

/* در صورت استفاده از صفحه‌سازهایی مثل المنتور، اعمال این محدودیت به کانتینر اصلی هم کمک می‌کند */
.elementor-page, 
.site-main, 
#content {
    overflow-x: hidden !important;
}
/* ===================================
   دکمه دارک مود - ظاهر پایه
=================================== */
.dm-toggle-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    border: 2px solid #ddd;
    background: #fff;
    cursor: pointer;
    vertical-align: middle;
    margin: 0 4px;
    padding: 0;
    transition: all 0.3s ease;
    position: relative;
    z-index: 1;
}
.dm-toggle-btn:hover {
    border-color: #f5a623;
    transform: scale(1.08);
}
.dm-toggle-btn svg {
    width: 20px;
    height: 20px;
    color: #f5a623;
}
.dm-icon-moon { display: none; }

/* ===================================
   حالت تاریک - پایه
=================================== */
html[data-theme="dark"] {
    filter: invert(1) hue-rotate(180deg) !important;
    background: #fff;
}

/* ===================================
   معافیت تصاویر و رسانه از افکت دارک مود
=================================== */
/* تگ‌های img با پسوند jpg/png/webp/gif */
html[data-theme="dark"] img[src*=".jpg"],
html[data-theme="dark"] img[src*=".jpeg"],
html[data-theme="dark"] img[src*=".png"],
html[data-theme="dark"] img[src*=".webp"],
html[data-theme="dark"] img[src*=".gif"] {
    filter: invert(1) hue-rotate(180deg) !important;
}
html[data-theme="dark"] a.home-slider-item {
    filter: invert(1) hue-rotate(180deg) !important;
}
html[data-theme="dark"] a.home-slider-item img {
    filter: none !important;
}

/* آواتار کاربران */
html[data-theme="dark"] img.avatar,
html[data-theme="dark"] .avatar {
    filter: invert(1) hue-rotate(180deg) !important;
}

/* عناصری که تصویر رو با background-image inline نشون میدن */
html[data-theme="dark"] [style*="background-image"][style*=".jpg"],
html[data-theme="dark"] [style*="background-image"][style*=".jpeg"],
html[data-theme="dark"] [style*="background-image"][style*=".png"],
html[data-theme="dark"] [style*="background-image"][style*=".webp"],
html[data-theme="dark"] [style*="background-image"][style*=".gif"] {
    filter: invert(1) hue-rotate(180deg) !important;
}

/* ویدیو و آیفریم */
html[data-theme="dark"] video,
html[data-theme="dark"] iframe {
    filter: invert(1) hue-rotate(180deg) !important;
}

html[data-theme="dark"] .dm-icon-sun { display: none; }
html[data-theme="dark"] .dm-icon-moon { display: block; }

/* رنگ‌بندی دسکتاپ در حالت تاریک: خط دور زرد + ماه سفید */
@media (min-width: 783px) {
    html[data-theme="dark"] .dm-toggle-btn {
        background: #1a1a1a !important;
        border-color: #f5a623 !important;
    }
    html[data-theme="dark"] .dm-toggle-btn svg {
        color: #ffffff !important;
    }
}

/* نسخه موبایل - ظاهر پایه هماهنگ با آیکون‌های کناری */
@media (max-width: 782px) {
    .dm-toggle-btn {
        width: 50px;
        height: 50px;
        border-radius: 14px;
        background: #5AC8FA;
        border: none;
    }
    .dm-toggle-btn svg {
        width: 26px;
        height: 26px;
        color: #fff;
    }
    /* در حالت تاریک موبایل: پس‌زمینه آبی بمونه، فقط ماه سفید بشه */
    html[data-theme="dark"] .dm-toggle-btn {
        background: #5AC8FA !important;
        border: none !important;
    }
    html[data-theme="dark"] .dm-toggle-btn svg {
        color: #ffffff !important;
    }
}
/* استثنا کردن کامل هدر و فوتر از افکت دارک مود */
html[data-theme="dark"] .megawp-header-wrapper,
html[data-theme="dark"] .megawp-mobile-header,
html[data-theme="dark"] .megawp-mobile-menu-wrapper,
html[data-theme="dark"] .megawp-footer,
html[data-theme="dark"] .tf-fix-btns,
html[data-theme="dark"] .floating-wheel {
    filter: hue-rotate(180deg) invert(1) !important;
}

/* لغو فیلتر اضافه‌ای که قبلاً برای تصاویر/دکمه سایت‌عام تعریف شده بود، برای عناصر داخل این بخش‌ها */
html[data-theme="dark"] .megawp-header-wrapper img,
html[data-theme="dark"] .megawp-header-wrapper svg,
html[data-theme="dark"] .megawp-header-wrapper .dm-toggle-btn,
html[data-theme="dark"] .megawp-mobile-header img,
html[data-theme="dark"] .megawp-mobile-header svg,
html[data-theme="dark"] .megawp-mobile-menu-wrapper img,
html[data-theme="dark"] .megawp-mobile-menu-wrapper svg,
html[data-theme="dark"] .megawp-footer img,
html[data-theme="dark"] .megawp-footer svg,
html[data-theme="dark"] .tf-fix-btns i,
html[data-theme="dark"] .floating-wheel img {
    filter: none !important;
}

/* رفع مشکل قرارگیری منوی کشویی زیر محتوا در حالت دارک مود */
html[data-theme="dark"] .megawp-header-wrapper {
    position: relative !important;
    z-index: 9999 !important;
}

/* ===================================
   لیست دکمه‌های محافظت‌شده از دارک مود
   (هر دکمه جدید رو طبق آموزش زیر همین‌جا اضافه کن)
=================================== */
html[data-theme="dark"] .tf-comment-link-copy-btn,
html[data-theme="dark"] .tf-comment-filter-author,
html[data-theme="dark"] .comment-reply-link,
html[data-theme="dark"] .tf-comment-item-follow-btn,
html[data-theme="dark"] .tf-comment-item-badges,
html[data-theme="dark"] .tf-comment-text-word-count,
html[data-theme="dark"] .tf-comments-filters,
html[data-theme="dark"] .tf-last-read-comment-btn,
html[data-theme="dark"] .comment-reply-link,
html[data-theme="dark"] .tf-comment-favorites-btn,
html[data-theme="dark"] .tf-comments-filters a,
html[data-theme="dark"] .tf-last-read-comment-btn,
html[data-theme="dark"] .comment-reply-link,
html[data-theme="dark"] .tf-comment-favorites-btn,
html[data-theme="dark"] .tf-comment-read-btn,
html[data-theme="dark"] .technical-comment,
html[data-theme="dark"] .tf-user-score,
html[data-theme="dark"] .tf-comment-user-score-details .level,
html[data-theme="dark"] .tf-comment-user-score-details .tf-user-score,
html[data-theme="dark"] .badge-item active,
html[data-theme="dark"] .badges_wrapper .badge-item img,
html[data-theme="dark"] .play-pause-btn,
html[data-theme="dark"] .tf-comments-filters,
html[data-theme="dark"] .golden-medal {
    filter: invert(1) hue-rotate(180deg) !important;
}