/*
Theme Name: BICTweb.vn
Description: This is a child theme for BICTweb.vn
Author: UX Themes
Template: flatsome
Version: 3.0
*/

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


/* Top bar  */
.header-top  span.alt-font {
    font-size: 1.4rem;
	margin-left: 15px;
}
/* scalling logo */
@media(min-width: 1280px) {
	
	.header-wrapper:not(.stuck) .header-top:before {
		content: ' ';
		width: 204px;
		height: 44px;
		background: #fff;
		display: block;
	}
	.header-wrapper:not(.stuck) .header-top:after {
		content: ' ';
		position: absolute;
		top: 0;
		left: 0;
		width: 190px;
		height: 44px;
		background: #fff;
		display: block;
		transform: skewX(-15deg);
	}
	.header-wrapper:not(.stuck) .header-main {
		position: relative;
		z-index: 12;
	}
	.header-wrapper:not(.stuck) .logo-left .logo a {
		transform: translate(-10px, -39px);
		height: 88px;
		position: relative;
		z-index: 9999999;
	}
	.header-wrapper:not(.stuck) .logo-left #logo img {
		max-height: 86px;
        padding-left: 30px !important;
 
	}
}
/* Menu style */
ul.header-nav.header-nav-main {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
	transform: translateX(15px);
}
.header-nav-main > .menu-item .nav-top-link {
    font-weight: bold;
    color: #0A36AF;
    text-transform: uppercase;
    white-space: nowrap;
	flex-wrap: nowrap;
    padding: 1rem
}

.header-nav-main > .menu-item .nav-top-link:hover,
.header-nav-main > .menu-item .nav-top-link:focus {
    color: #29aae1
}

.header-nav-main > .menu-item .nav-top-link.active {
    color: #29aae1
}

@media(min-width: 1280px) {
    .header-nav-main > .menu-item {
        flex-basis: 100%
    }
}

@media(min-width: 1280px) {
	ul.header-nav.header-nav-main {
		display: flex;
		flex-direction: row;
		flex-wrap: nowrap;
		transform: translateX(15px);
		margin-top: -2px;
		height: 48px;
	}
    .header-nav-main > .menu-item {
        text-align: center
    }
}

.header-nav-main > .menu-item:last-child {
    background: #d91e32;
    position: relative;
    text-align: center;
    max-height: 48px;
}

.header-nav-main > .menu-item:last-child::before {
    position: absolute;
    content: "";
    width: 25px;
    top: 0px;
    left: -10px;
    background-color: #fff;
    height: 100%;
    transform: skew(-20deg);
    z-index: 0;
    height: 48px;
}

@media(min-width: 1280px) {
    .header-nav-main > .menu-item:last-child::before {
        width: 20px;
        top: 0;
        left: -10px;
        background: #d91e32
    }
	
}

.header-nav-main > .menu-item:last-child .nav-top-link {
    color: #fff !important;
	display: flex;
    flex-wrap: nowrap;
}

.header-nav-main > .menu-item .nav-top-link {
    font-weight: bold;
    color: #9fc474;
	font-size: 1rem;
    text-transform: uppercase;
    white-space: nowrap !important;
    padding: 1rem
}

.header-nav-main > .menu-item .nav-top-link :hover,
.header-nav-main > .menu-item .nav-top-link :focus {
    color: #29aae1
}

.header-nav-main > .menu-item .nav-top-link .active {
    color: #29aae1
}

/* sidebar menu */
.mobile-sidebar .nav-sidebar > .menu-item.has-icon-left {
    background: #d91e32;
    position: relative;
    text-align: center;
    max-height: 48px;
}

.mobile-sidebar .nav-sidebar > .menu-item.has-icon-left::before {
    position: absolute;
    content: "";
    width: 25px;
    top: 0px;
    left: -10px;
    background-color: #fff;
    height: 100%;
    transform: skew(-20deg);
    z-index: 0;
    height: 48px;
}
.mobile-sidebar .nav-sidebar > .menu-item.has-icon-left::before {
    width: 20px;
    top: 0;
    left: -10px;
    background: #ffffff;
}
.mobile-sidebar .nav-sidebar > .menu-item.has-icon-left a {
    color: #fff;
}

.archive p.from_the_blog_excerpt {
    display: none !important;
}

.woocommerce-shipping-totals shipping {
    display: none !important;
}

.shipping__table{
    display: none !important;
}



.post-item .box-image:hover::before{
    -webkit-animation:shine .75s;
    animation:shine .75s}
    @-webkit-keyframes shine{
    100%{left:125%}
    }
    @keyframes shine{
    100%{left:125%}
    }
    .post-item .box-image::before{
    position:absolute;
    top:0;
    left:-75%;
    z-index:2;
    display:block;
    content:'';
    width:50%;
    height:100%;
    background:-webkit-linear-gradient(left,rgba(255,255,255,0) 0,rgba(255,255,255,.3) 100%);
    background:linear-gradient(to right,rgba(255,255,255,0) 0,rgba(255,255,255,.3) 100%);
    -webkit-transform:skewX(-25deg);transform:skewX(-25deg)
    }
    /*sp*/
    .product-small .box-image:hover::before{
        -webkit-animation:shine .75s;animation:shine .75s
        }
        @-webkit-keyframes shine{
        100%{left:125%}
        }
        @keyframes shine{
        100%{left:125%}
        }
        .product-small .box-image::before{
        position:absolute;
        top:0;
        left:-75%;
        z-index:2;
        display:block;
        content:'';
        width:50%;
        height:100%;
        background:-webkit-linear-gradient(left,rgba(255,255,255,0) 0,rgba(255,255,255,.3) 100%);
        background:linear-gradient(to right,rgba(255,255,255,0) 0,rgba(255,255,255,.3) 100%);
        -webkit-transform:skewX(-25deg);transform:skewX(-25deg)
        }


        /* ===== CORE STYLES ===== */
        .cf7-row {
            display: flex;
            flex-wrap: wrap;
            margin-bottom: 15px; /* Khoảng cách giữa các hàng */
        }
        
        .cf7-row > div[class*="col-"] {
            padding-right: 10px;
            padding-left: 10px;
            box-sizing: border-box; /* Đảm bảo padding không làm tăng kích thước */
        }
        
        .col-12 {
            flex: 0 0 100%;
            max-width: 100%;
        }
        
        .col-6 {
            flex: 0 0 50%;
            max-width: 50%;
        }
        
        label {
            display: block;
            margin-bottom: 5px;
            font-family: 'Open Sans', sans-serif; /* Áp dụng font Open Sans */
            font-weight: normal;
            margin-right: 5px; /* Thêm khoảng cách sau label */
        }
        
        input[type="text"],
        input[type="email"],
        input[type="tel"],
        input[type="number"],
        select,
        textarea {
            display: block;
            width: 100%;
            padding: 10px;
            margin-bottom: 10px;
            border: 1px solid #ccc;
            border-radius: 5px; /* Bo tròn góc */
            font-family: 'Open Sans', sans-serif; /* Áp dụng font Open Sans */
            box-sizing: border-box; /* Đảm bảo padding không làm tăng kích thước phần tử */
        }
        
        input[type="number"]::-webkit-inner-spin-button,
        input[type="number"]::-webkit-outer-spin-button {
            -webkit-appearance: none;
            margin: 0;
        }
        
        /* Стиль cho hàng số 4 */
        .row-adults-children {
            display: flex;
            gap: 10px; /* Khoảng cách giữa các cột trong hàng 4 */
        }
        
        .col-adults,
        .col-children,
        .col-infants {
            flex: 1; /* Chia đều không gian cho 3 cột */
            display: flex;
            flex-direction: column; /* Sắp xếp label và input/select theo chiều dọc */
        }
        
        .col-adults label,
        .col-children label,
        .col-infants label {
            margin-bottom: 5px;
        }
        
        .col-adults input[type="number"],
        .col-children select,
        .col-infants select {
            width: 100%; /* Đảm bảo input/select chiếm hết chiều rộng cột */
        }
        
        .wpcf7-submit {
            background-color: red !important;
            color: white;
            padding: 10px 20px;
            border: none;
            border-radius: 5px !important;
            cursor: pointer;
            font-family: 'Open Sans', sans-serif; /* Áp dụng font Open Sans */
            font-size: 16px;
        }
        
        .wpcf7-submit:hover {
            opacity: 0.9;
        }
        
        .text-center {
            text-align: center;
        }
        
        span.wpcf7-form-control-wrap.your-name label::after,
        span.wpcf7-form-control-wrap.your-email label::after,
        span.wpcf7-form-control-wrap.your-phone label::after,
        span.wpcf7-form-control-wrap.departure-month label::after,
        span.wpcf7-form-control-wrap.adults label::after,
        span.wpcf7-form-control-wrap.budget label::after {
            content: " (*)";
            color: red;
        }

        @media (max-width: 767px) {
            .row-adults-children {
                flex-direction: column; /* Chuyển hướng flex thành cột trên mobile */
            }
        
            .row-adults-children > div {
                width: 100%; /* Chiếm toàn bộ chiều rộng trên mobile */
                margin-bottom: 10px; /* Thêm khoảng cách giữa các hàng */
            }
        
            .row-adults-children > div:last-child {
                margin-bottom: 0; /* Loại bỏ margin bottom ở phần tử cuối cùng */
            }
        
            .col-adults label,
            .col-children label,
            .col-infants label {
                margin-right: 0; /* Loại bỏ margin right của label trên mobile */
            }
        }

        @media (max-width: 767px) {
            .wpcf7-submit {
                display: block !important; /* Chuyển nút thành block-level element */
                margin-left: auto !important; /* Đẩy lề trái tự động */
                margin-right: auto !important; /* Đẩy lề phải tự động */
                text-align: center !important; /* Căn giữa chữ bên trong nút (nếu cần) */
                padding: 10px 20px !important; /* Điều chỉnh kích thước nút cho mobile */
            }
        }