/*
Theme Name:           Flatsome
Theme URI:            http://flatsome.uxthemes.com
Author:               UX-Themes
Author URI:           https://uxthemes.com
Description:          Multi-Purpose Responsive WooCommerce Theme
Version:              3.19.12
Requires at least:    6.4
Requires PHP:         7.4
WC requires at least: 8.3
Text Domain:          flatsome
License:              https://themeforest.net/licenses
License URI:          https://themeforest.net/licenses
*/


/***************
All custom CSS should be added to Flatsome > Advanced > Custom CSS,
or in the style.css of a Child Theme.
***************/
body,html{
	background-color:#020202!important;
	margin:0 !important;
	padding:0!important;
	
}

.elementor-580 .elementor-element.elementor-element-6379530e .elementor-heading-title,
.elementor-580 .elementor-element.elementor-element-562e379e .elementor-heading-title{
	color:white;
}
.text-white{
	color:white;
}
h1,h2,h3,h4,h5,h6,p,span{
		font-family: "Metropolis", Sans-serif !important;

}
h5 {
    color:white;
}
h6{
	    color:white;
		font-weight:500!important;

}
.home footer  {
margin-top:0!important;
}
.title-customer-high.text-primary{
		color:#C0FF6B!important;

}
	.title-customer-high.text-white{
		color:white!important;
	}
h1{
	font-size:48px!important
}
h1,h2,h3{
/* 	color:#C0FF6B!important; */
	color:white!important;
}

h2{
	font-size:25px!important;
}
h3{
	font-size:20px!important;
}
.title-customer{
	font-size:38px!important;
	margin-bottom:0px!important;
}
.title-customer-high{
	margin-top:-15px!important;
	font-size:48px!important;
	margin-bottom:0px!important;
}
.text-primary h1{
	color:#C0FF6B!important;
}


/* Tablet */
/* Tablet lớn */
@media (max-width: 1024px) {
    .title-customer {
        font-size: 28px !important;
        margin-bottom: 0 !important;
    }

    .title-customer-high {
        margin-top: -15px !important;
        font-size: 38px !important;
        margin-bottom: 0 !important;
        color: #C0FF6B !important;
    }

    h1 {
        font-size: 38px !important;
    }

    h2 {
        font-size: 22px !important;
    }

    h3 {
        font-size: 18px !important;
    }

    h4 {
        color: white !important;
    }

    p {
        font-size: 18px !important;
    }
}


/* Tablet */
@media (max-width: 767px) {
	.home footer  {
margin-top:-80px!important;
}
	.service-detail-commit .elementor-image-box-wrapper{
	display: grid;
    gap: 20px;
    grid-template-columns: 1fr 3fr;
}
    h1 {
        font-size: 22px !important;
    }

    h2 {
        font-size: 20px !important;
    }

    h3 {
        font-size: 16px !important;
    }

    .banner-real .elementor-element-ca73132 .e-con.e-grid > .e-con-inner {
        grid-template-columns: inherit !important;
    }

    .title-customer {
        font-size: 20px !important;
        margin-bottom: 0 !important;
    }
.elementor-grid-mobile-1 .elementor-grid{
		        grid-template-columns: repeat(2, 1fr)!important;
	}
    .title-customer-high {
        margin-top: -15px !important;
        font-size: 25px !important;
        margin-bottom: 0 !important;
    }
	p{
		font-size:14px!important;
	}
}


/* Mobile */
@media (max-width: 480px) {
    .title-customer {
        font-size: 20px !important;
    }
	.button-header .elementor-button-text{
		font-size:10px!important;
	}
    h1 {
        font-size: 22px !important;
    }

    .title-customer-high {
        font-size: 28px !important;
    }

    h2 {
        font-size: 20px !important;
    }

    h3 {
        font-size: 15px !important;
    }

}
@media (max-width:450px){
	#section-customer .customer-item {
		min-height:0px!important;
	}
		.elementor-grid-mobile-1 .elementor-grid{
		        grid-template-columns: repeat(1, 1fr)!important;
	}
}
*{
    /* Thay link ảnh .png 32x32 của bạn vào đây */
    cursor: url('https://demo.innolabs.store/wp-content/uploads/2026/03/0c32e22d-5070-480d-b534-78ffb557ae66.png') 4 4, auto !important;
}

/* Đảm bảo khi di chuột vào link nó vẫn hiện icon đó hoặc bàn tay */
a, button, .button {
    cursor: url('https://demo.innolabs.store/wp-content/uploads/2026/03/0c32e22d-5070-480d-b534-78ffb557ae66.png') 0 0, pointer !important;
}
.elementor-post {
    cursor: pointer;
    transition: all 0.3s ease;
}

/* Hover effect */
.elementor-post:hover {
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
	border-color:#C0FF6B;
	cursor: pointer;
}
.swiper-pagination-bullet {
    width: 30px;        /* chiều dài */
    height: 6px;        /* chiều cao */
    border-radius: 2px; /* bo nhẹ, hoặc 0 nếu muốn vuông */
    background: #ccc;   /* màu bullet thường */
    opacity: 1;
    transition: all 0.3s ease;
}

/* Bullet active */
.swiper-pagination-bullet-active {
    background: #00D084; /* màu khi active */
    width: 40px;         /* dài hơn để nổi bật */
}
#swiper-wrapper-45965c68271ed9410.swiper-slide-prev,
#swiper-wrapper-45965c68271ed9410 .swiper-slide-next {
    opacity: 0;
    pointer-events: none;
}
.elementor-post,
.elementor-post * {
  cursor: pointer !important;
}

.floating-contact {
  position: fixed;
  right: 5%;
  bottom: 0%;
  transform: translateY(-50%);
  z-index: 999999;
  display: flex;
  flex-direction: column;
  gap: 12px;
  overflow: visible;
}

.floating-contact .fc-item {
  width: 42px;
  height: 42px;
  border-radius: 999px;
  background: transparent;
  box-shadow: 0 6px 18px rgba(0,0,0,0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  position: relative;
  overflow: visible;

  opacity: 0;
  transform: translateY(-40px) scale(0.8);

  animation:
    floatDrop 0.6s ease forwards,
    btnShake 2s infinite 0.6s,
    btnPulse 2s infinite 0.6s;
}

/* delay từng nút */
.floating-contact .fc-item:nth-child(1) {
  animation-delay: 0.1s, 0.7s, 0.7s;
}
.floating-contact .fc-item:nth-child(2) {
  animation-delay: 0.25s, 0.85s, 0.85s;
}
.floating-contact .fc-item:nth-child(3) {
  animation-delay: 0.4s, 1s, 1s;
}
.floating-contact .fc-item:nth-child(4) {
  animation-delay: 0.55s, 1.15s, 1.15s;
}

.floating-contact .fc-item::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: rgba(0,0,0,0.15);
  animation: btnWave 2s infinite;
  z-index: -1;
}

.floating-contact .fc-item:nth-child(1)::after { animation-delay: 0.7s; }
.floating-contact .fc-item:nth-child(2)::after { animation-delay: 0.85s; }
.floating-contact .fc-item:nth-child(3)::after { animation-delay: 1s; }
.floating-contact .fc-item:nth-child(4)::after { animation-delay: 1.15s; }

.floating-contact .fc-item:hover {
  animation-play-state: paused;
  transform: scale(1.08);
}

.floating-contact img {
  width: 100%;
  height: 100%;
}

.floating-contact .fc-phone {
  font-size: 24px;
  color: #fff;
  background: #ef2b2d;
}

.floating-contact .fc-facebook {
  font-size: 30px;
  font-weight: bold;
  color: #1877f2;
}

.floating-contact .fc-calendar {
  font-size: 22px;
}
.elementor-kit-1711 {
    --e-global-color-primary: #C0FF6B;
    --e-global-color-secondary: #020202;
    --e-global-color-text: #7A7A7A;
    --e-global-color-accent: #C0FF6B;

    --e-global-typography-primary-font-family: "Metropolis" !important;
    --e-global-typography-primary-font-weight: 700;

    --e-global-typography-secondary-font-family: "Metropolis" !important;
    --e-global-typography-secondary-font-weight: 600;

    --e-global-typography-text-font-family: "Metropolis" !important;
    --e-global-typography-text-font-weight: 400;

    --e-global-typography-accent-font-family: "Metropolis" !important;
    --e-global-typography-accent-font-weight: 500;
}
@keyframes floatDrop {
  0% {
    opacity: 0;
    transform: translateY(-60px) scale(0.6);
  }
  60% {
    opacity: 1;
    transform: translateY(8px) scale(1.05);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes btnShake {
  0% { transform: translateY(0) scale(1); }
  10% { transform: translateY(-3px) scale(1); }
  20% { transform: translateY(3px) scale(1); }
  30% { transform: translateY(-3px) scale(1); }
  40% { transform: translateY(3px) scale(1); }
  50% { transform: translateY(0) scale(1); }
  100% { transform: translateY(0) scale(1); }
}

@keyframes btnPulse {
  0% { box-shadow: 0 0 0 0 rgba(0,0,0,0.4); }
  70% { box-shadow: 0 0 0 15px rgba(0,0,0,0); }
  100% { box-shadow: 0 0 0 0 rgba(0,0,0,0); }
}

@keyframes btnWave {
  0% {
    transform: scale(1);
    opacity: 0.7;
  }
  100% {
    transform: scale(1.8);
    opacity: 0;
  }
}

@media (max-width: 849px) {
  .floating-contact {
    right: 10px;
  }
/* 
  .floating-contact .fc-item {
    width: 48px;
    height: 48px;
  } */
}
.fc-top {
  position: relative;
   width: 42px;
  height: 42px;
  border-radius: 50%;
  background: #000
	 
}

/* SVG nằm full */
.progress-ring {
	width:100%;
  position: absolute;
  inset: 0;
  transform: rotate(-90deg);
}

/* ICON căn giữa CHUẨN */
.fc-top-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -30%);
  color: #fff;
  font-size: 20px;
  line-height: 1;
  pointer-events: none;
}

.progress-bg,
.progress-bar {
  fill: none;
  stroke-width: 4;
}

.progress-bg {
  stroke: rgba(255,255,255,0.2);
}

.progress-bar {
  stroke: #25d366;
  stroke-linecap: round;
  stroke-dasharray: 150.8;
  stroke-dashoffset: 150.8;
  transition: stroke-dashoffset 0.1s linear;
}

.fc-top:hover {
  transform: translateY(-2px);
  transition: 0.2s;
}
/* Chrome, Edge, Safari */
::-webkit-scrollbar {
  width: 10px;
}

::-webkit-scrollbar-track {
  background: white;
  border-radius: 10px;
}

::-webkit-scrollbar-thumb {
  background: #00D084;
  border-radius: 10px;
  border: 2px solid #f1f1f1;
}

::-webkit-scrollbar-thumb:hover {
  background: #333;
}

.text-primary{
	color:#C0FF6B;
}
.real-ecom-business .swiper-slide-image{
	width:100%;
	height:50px;
}
.real-ecom-business .swiper-pagination{
	display:none;
}

.service-detail-commit .elementor-image-box-img img{
	background:#C0FF6B;
	
}
.no-p-bottom p {
	margin-bottom:0px!important;
}
.live-stream-case-study .swiper-slide-image{
	height:200px;
}
.post{
	margin:0px!important;
}

/* Hiệu ứng menu nhích lên khi hover */
#menu-1-ec0cd91 .elementor-item {
    transition: transform 0.3s ease, color 0.3s ease;
}

#menu-1-ec0cd91 .elementor-item:hover {
	color:white!important;
    transform: translateY(-4px);
}

/* Bỏ toàn bộ trạng thái active */
#menu-1-ec0cd91 .elementor-item.elementor-item-active,
#menu-1-ec0cd91 .current-menu-item > .elementor-item,
#menu-1-ec0cd91 .current_page_item > .elementor-item {
    color: inherit !important;
    background-color: transparent !important;
}
#menu-1-ec0cd91 .elementor-item.elementor-item-active{
	color:white!important;
}
/* Bỏ gạch chân active của Elementor */
#menu-1-ec0cd91 .elementor-item.elementor-item-active::after,
#menu-1-ec0cd91 .current-menu-item > .elementor-item::after,
#menu-1-ec0cd91 .current_page_item > .elementor-item::after {
    opacity: 0 !important;
    width: 0 !important;
}