/**
 * Theme Name:     K-Solutions
 * Author:         K-Solutions
 * Template:       flatsome
 * Text Domain:	   k-tech
 * Description:    Theme Build by Dai
 * Theme URI:      https://k-tech.net.vn/
 * Author URI:     https://k-tech.net.vn/
 * Version:        06.2026
 * License:        2NRJM-B46WR-K6VQR-Y4T3D-QRWPX
 * License URI:    https://k-tech.net.vn/
 */



 /*************** ADD CUSTOM CSS HERE.   ***************/


.home-banner .form-group label span {
    display: none !important;
    color: #222;
    height: 100%;
    display: flex;
    align-items: center;
    padding: 0 20px;
    font-weight: 600;
    font-size: 14px;
    border-right: 1px solid #ebebeb;
}


.dev-project-image {
    padding-top: 57%;
}


.single-project .btn-baogia {
	display: block;
}

.btn-baogia {
	display: none;
    background: var(--primary-color);
    color: #fff;
    padding: 6px 30px;
    border-radius: 6px;
    cursor: pointer;
    transition: .3s;
    transform-origin: center;
    animation: attention 1.25s infinite;
}

@keyframes attention {
    0%, 100% {
        transform: scale(1) rotate(0);
    }

    10% {
        transform: scale(1.05) rotate(-8deg);
    }

    20% {
        transform: scale(1.05) rotate(8deg);
    }

    30% {
        transform: scale(1.05) rotate(-8deg);
    }

    40% {
        transform: scale(1.05) rotate(8deg);
    }

    50% {
        transform: scale(1.02);
    }

    60% {
        transform: scale(1);
    }
}



/* ====================================================
   2. CSS CHO NÚT ĐIỀU HƯỚNG (NAVIGATION) CỦA SWIPER
==================================================== */
.dev-project-swiper {
    position: relative;
    padding-bottom: 50px !important; /* Tạo khoảng trống cho Pagination chấm tròn bên dưới */
}

.dev-project-swiper .swiper-button-next,
.dev-project-swiper .swiper-button-prev {
    background-color: #ffffff;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15); /* Đổ bóng cho nổi bật */
    color: #333; /* Màu mũi tên */
    transition: all 0.3s ease;
}

.dev-project-swiper .swiper-button-next::after,
.dev-project-swiper .swiper-button-prev::after {
    font-size: 16px; /* Thu nhỏ icon mũi tên cho tinh tế */
    font-weight: bold;
}

/* Hiệu ứng khi di chuột vào nút */
.dev-project-swiper .swiper-button-next:hover,
.dev-project-swiper .swiper-button-prev:hover {
    background-color: #d1b06b; /* Đổi màu nền khi hover (Sửa lại mã màu theo theme của bạn) */
    color: #ffffff;
}

/* Custom lại cái chấm tròn (pagination) */
.dev-project-swiper .swiper-pagination-bullet {
    background-color: #999;
    opacity: 0.5;
}
.dev-project-swiper .swiper-pagination-bullet-active {
    background-color: #d1b06b; /* Đổi màu theo theme của bạn */
    opacity: 1;
}




.list-gallery .gallery-box {
    border: 1px solid #ddd;
    border-radius: 10px;
    overflow: hidden;
}

.list-gallery .gallery-box .box-image {
    border: 5px solid #fff;
    border-radius: 10px;
}

.dev-project-meta-fields .meta-label {
    font-weight: 600;
}

 
@media only screen and (max-width: 48em) {
    /*************** ADD MOBILE ONLY CSS HERE  ***************/

.home-banner .form-group label span {
    display: none !important;
}
	
	.dev-project-meta-fields .meta-value {
		padding: 5px !important;
		border: none !important;
	}
	
	.dev-project-swiper .swiper-button-next, .dev-project-swiper .swiper-button-prev {
		top: 41% !important;
	}

}