/*
Theme Name: Flatsome Child
Description: NamKiem developed for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.11.3
*/


/*************** ADD CUSTOM CSS HERE.   ***************/
/* --- CONTACT FORM --- */
/* form-ever {
  max-width: 760px;
  margin: 20px auto;
  padding: 20px;
  border-radius: 20px;   
  background: transparent; 
  box-shadow: none;        
  border: none;   
}
.form-row {
  display: flex;
  gap: 20px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}
.form-group {
  flex: 1;
  display: flex;
  flex-direction: column;
}
.form-group.full {
  width: 100%;
}
.form-group label {
  margin-bottom: 6px;
  font-weight: 600;
  font-size: 14px;
  color: #333;
}
.form-group input,
.form-group textarea {
  width: 100%;
  padding: 10px 0;
  border: none;
  border-bottom: 2px solid #ccc;
  background: transparent;
  box-shadow: none;
  font-size: 15px;
  outline: none;
}
.icon-field input:focus,
.icon-field textarea:focus {
  border-bottom-color: var(--primary-color);
  outline: none; 
  box-shadow: none; 
} */
/* Responsive */
@media (max-width: 640px) {
  .form-row {
    flex-direction: column;
  }
}
/* .icon-field {
  position: relative;
} */
/* Icon cố định bên trái, luôn hiển thị trên input */
/* .icon-field i {
  position: absolute;
  left: 0px;
  top: 33%;
  transform: translateY(-50%);
  color: #f5b400;
  font-size: 16px;
  pointer-events: none; 
  z-index: 10;           
} */

/* Input và textarea luôn chừa chỗ cho icon */
/* .icon-field input,
.icon-field textarea {
  padding-left: 35px !important; 
  width: 100%;
  box-sizing: border-box;
} */

/* Khi focus, không thay đổi padding, outline hay box-shadow */
/* .icon-field input:focus,
.icon-field textarea:focus {
  outline: none !important;
  box-shadow: none !important;
  border-bottom-color: var(--primary-color) !important;
  padding-left: 35px !important;
} */

/* .icon-field-1 {
  position: relative;
} */

/* Icon cố định bên trái, luôn hiển thị trên input */
/* .icon-field-1 i {
  position: absolute;
  left: 0px;
  top: 17%;
  transform: translateY(-50%);
  color: #f5b400;
  font-size: 16px;
  pointer-events: none;
  z-index: 10;
} */

/* Input và textarea luôn chừa chỗ cho icon */
/* .icon-field-1 input,
.icon-field-1 textarea {
  padding-left: 35px !important;
  width: 100%;
  box-sizing: border-box;
} */

/* Khi focus, không thay đổi padding, outline hay box-shadow */
/* .icon-field-1 input:focus,
.icon-field-1 textarea:focus {
  outline: none !important;
  box-shadow: none !important;
  border-bottom-color: #f5b400 !important;
  padding-left: 35px !important;
} */
/* end*/

/* Button nút gửi*/
body{
    padding:0;
    margin: 0;
    background-color: #6D214F;
}

/* wrapper căn giữa */
.wrapper{
    display:flex;
    align-items:center;
    height:15vh; /* chỉ wrapper chiếm viewport */
}

/* footer*/
.hover-list p, .hover-list a {
  position: relative;
  margin: 10px 0;
  transition: all 0.3s ease;
  padding-left: 0;
  font-size: 15px;
	color: #fff;
}
.hover-list p::before,
.hover-list a::before {
  content: "";
  position: absolute;
  left: -15px;
  top: 50%;
  height: 2px;
  background-color: var(--primary-color);
  opacity: 0;
  transition: all 0.3s ease;
}
.hover-list p:hover,
.menu-footer .hover-list:hover a {
  transform: translateX(15px);
  color: #fff !important;
}
.hover-list p:hover::before,
.hover-list:hover a::before {
  width: 10px;
  opacity: 1;
}

.form-row-1 {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0; /* liền nhau */
    max-width: 500px; /* tuỳ chỉnh chiều rộng */
    margin: 0 auto; /* căn giữa nếu muốn */
}

.form-group-1 input[type="email"] {
    padding: 10px 15px;
    border: 2px solid var(--primary-color);
    border-right: none; /* bỏ viền bên phải để liền với button */
    outline: none;
    flex: 1; /* chiếm phần còn lại */
    font-size: 16px;
}

.submit-btn {
    padding: 10px 20px;
    border: 2px solid var(--primary-color);
    background-color: var(--primary-color);
    color: #fff;
    cursor: pointer;
    font-size: 16px;
    transition: background-color 0.3s, transform 0.2s;
}

.submit-btn:hover {
    background-color: #005aa3;
    transform: translateY(-2px);
}

/* Hover effect for back to top */
.back-to-top:hover {
  background-color: var(--primary-color) !important;
/*   box-shadow: 0 8px 20px rgba(0, 116, 217, 0.5) !important; */
}
.back-to-top:hover::before {
  transform: rotate(360deg) scale(1.1);
}

.back-to-top i {
	color: white;
}

.pull-left {
    float: none;
    text-align: center;
}
.button.icon.circle{
	background-color: #005AAB;
	border-color: #fff;
}

/* menu */
@media (min-width: 850px) {
    /* Chỉ hiển thị menu cấp 1 khi mở */
    header#header .nav-dropdown {
        display: flex;
        flex-direction: column !important;
        min-width: 240px;
        background: #fff;
        padding: 10px 0;
        box-shadow: 1px 1px 15px rgb(0 0 0 / 15%);
        border-radius: 5px;
        position: absolute;
    }

    /* Ẩn toàn bộ menu con cấp 2 và cấp 3 */
    header#header .nav-dropdown ul.sub-menu,
    header#header .nav-dropdown ul.sub-menu ul.sub-menu {
       position: absolute;
    left: 100%;
    top: 0;
    background: #fff;
    width: 230px;
    border-radius: 5px;
    box-shadow: 1px 1px 15px rgb(0 0 0 / 15%);
    min-width: 230px;
    padding: 20px 0;
    text-align: left;
    transition: opacity .25s, visibility .25s;
    display: none !important;
    }

    /* Hiển thị menu cấp 2 khi hover cấp 1 */
    header#header .nav-dropdown > li:hover > ul.sub-menu {
        display: block !important;
    }

    /* Hiển thị menu cấp 3 khi hover cấp 2 */
    header#header .nav-dropdown ul.sub-menu > li:hover > ul.sub-menu {
        display: block !important;
    }

    /* Định dạng mục menu */
    header#header .nav-dropdown li {
        position: relative;
        width: 100%;
        text-align: left;
    }

    header#header .nav-dropdown a {
        display: block;
        padding: 10px 15px;
        font-size: 14px;
        font-weight: normal !important;
        color: #333 !important;
        text-decoration: none;
        transition: color 0.2s ease-in-out;
        background: transparent !important;
    }

    /* Hiệu ứng đổi màu chữ khi hover */
    header#header .nav-dropdown a:hover {
        color: #005aab !important;
        background: transparent !important;
    }

    /* Mũi tên submenu (dùng fl-icons của Flatsome) */
    header#header .nav-dropdown li.menu-item-has-children > a {
        padding-right: 30px;
        position: relative;
    }

     /* Icon mũi tên phải mặc định */
    header#header .nav-dropdown li.menu-item-has-children > a::after {
        content: "\f105"; /* icon-angle-right trong Flatsome */
        font-family: "fl-icons" !important;
        font-size: 12px;
        position: absolute;
        right: 15px;
        top: 50%;
        transform: translateY(-50%);
        color: #005aab;
        pointer-events: none;
    }

    /* Đổi màu khi hover */
    header#header .nav-dropdown li.menu-item-has-children:hover > a::after {
        color: #005aab !important;
    }

    /* Khoảng cách menu con */
    .nav-dropdown .nav-dropdown-col .menu-item-has-children {
         margin-top: 0px; 
    }

    /* Hiệu ứng icon xuất hiện khi hover */
    .nav-dropdown.nav-dropdown-default > li > a,
    .nav-dropdown ul.sub-menu > li > a,
    .nav-dropdown ul.sub-menu ul.sub-menu > li > a {
        position: relative;
        padding-left: 15px;
        transition: padding-left 0.3s ease-in-out;
    }

    .nav-dropdown.nav-dropdown-default > li > a:before,
    .nav-dropdown ul.sub-menu > li > a:before,
    .nav-dropdown ul.sub-menu ul.sub-menu > li > a:before {
        content: "\e605"; /* icon mũi tên nhỏ (ví dụ play hoặc chuyển hướng) */
        font-family: "fl-icons" !important;
        font-size: 12px;
        position: absolute;
        top: 50%;
        left: 0px;
        transform: translate(0, -50%);
        transition: all 200ms linear;
        opacity: 0;
    }

    /* Khi hover, icon hiện ra và chữ dịch sang phải */
    .nav-dropdown.nav-dropdown-default > li > a:hover,
    .nav-dropdown ul.sub-menu > li > a:hover,
    .nav-dropdown ul.sub-menu ul.sub-menu > li > a:hover {
        padding-left: 30px !important;
    }

    .nav-dropdown.nav-dropdown-default > li > a:hover:before,
    .nav-dropdown ul.sub-menu > li > a:hover:before,
    .nav-dropdown ul.sub-menu ul.sub-menu > li > a:hover:before {
        opacity: 1;
        transform: translate(10px, -50%);
    }

    /* Giữ màu chữ khi hover vào menu con */
    header#header .nav-dropdown > li:hover > a,
    header#header .nav-dropdown > li:hover > ul.sub-menu > li:hover > a,
    header#header .nav-dropdown ul.sub-menu > li:hover > ul.sub-menu > li:hover > a {
        color: #005aab !important;
    }

    /* Khi menu con hiển thị, giữ màu chữ của menu cha */
    header#header .nav-dropdown > li:hover > ul.sub-menu {
        display: block !important;
    }

    header#header .nav-dropdown > li:hover > ul.sub-menu > li:hover > ul.sub-menu {
        display: block !important;
    }

  .nav-dropdown-default .nav-column li>a,.nav-dropdown.nav-dropdown-default>li>a {
    border-bottom: 1px solid #ececec;
    
   }
	header#header .nav-dropdown a {
    text-transform: none !important;
}
	
	mark{
		display: none;
	}}	

.back-lien-he {
    background-color: #005AAB;
    border-radius: 5px;
    display: flex;
    justify-content: center; /* Căn giữa ngang */
    align-items: center;    /* Căn giữa dọc */
}
.count-up,
.plus-sign{
	font-size: 55px;
	color: #005aab;
}

.img-nl img{
	background: #FCAF17;
	border-radius: 100px;
	filter: invert(1);
	padding: 5px;
}
.back-lv{
	background-color: #FCAF17;
	border-radius: 10px;
	display: flex;
	align-content: center;
	align-items: center;
}
/* .nav > li > a{
	font-weight: 500 !important;
} */
.icon-box-left{
	align-items: center;
}
.lh-icon{
	background-color: #005AAB;
	border-radius: 10px;
	padding: 25px 10px 20px 20px !important;
	height: 580px;
	border: 1px solid #FCAF17;
	 box-shadow: 0 8px 20px rgba(252, 175, 23, 0.6);
}

.button.icon.circle>i:only-child {
    margin: 5px;
}
 .wpcf7-response-output {
  color: #333333;
  
}



@media (max-width: 600px) {
	.custom-page-heading {
		margin-top: 15px;
		margin-bottom: px;
		font-size: 24px !important;
	}
	
	.rank-math-custom-breadcrumb {
		height: auto;
	}
	
	.breadcrumb-custom {
		padding: 0px;
	}
}
.policy{ text-align:center;background-color: rgb(18, 58, 41);}
.policy a:link, .policy a:visited{color: gray; margin-left:5px; margin-right:5px;font-size:0.9em;}
.policy a:hover{color: lightgray ;}

@media (min-width:1024px)
{
	.policy a:link, .policy a:visited{ margin-left:30px; margin-right:30px;}
}

.copyright-footer{text-align:center !important;}
.footer-wrapper{text-align:justify;background-color: rgb(18, 58, 41);}

/* .slider-style-shadow .flickity-slider>:before{background-image:url(../img/shadow@2x.png);background-size:100% 100%;bottom:-6px;content:"";height:100px;left:-10%;position:absolute;right:-10%;z-index:-2} */