/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/
/* css topbar */
#top-bar .social-icons {
	color: #000;
}
#top-bar .html .social-icons {
    font-size: 1.1em;
}
/* css header menu */
div#masthead {
    background-color: #fff;
    box-shadow: 1px 0px 6px rgb(0 0 0 / 15%);
}
#masthead ul.header-nav.header-nav-main.nav.nav-left.nav-uppercase:before {
    position: absolute;
    left: 10px;
    background: #d91c23;
    content: "";
    width: 992px;
    height: 58px;
    border-radius: 100px 0 0 0;
}
#masthead ul li.menu-item a.nav-top-link {
    color: #fff;
    padding: 0 0 0 12px;
    font-size: 13.5px;
}

/* css section banner */
.ct-banner {
    text-align: left;
    background: #000;
    padding: 8px 5px 10px 18px;
    border-left: 3px solid #d91c23;
}
.ct-banner p {
    margin-bottom: 0;
}
.ct-banner h3 {
    margin-top: 0;
}

.col.col-padding {
	padding-bottom: 0;
}
/* css section giới thiệu ngắn */
.ct-head-ngan p {
	margin-bottom: 6px;
}
.ct-thoigian-1 p  {
    color: rgba(237, 28, 36, 1);
    font-size: 26px;
	margin-top: 36px;
    margin-bottom: 0;
}
.ct-thoigian-2 p:first-child strong {
    color: rgba(237, 28, 36, 1);
    font-size: 20px;
}
.ct-thoigian-2 p:last-child strong {
    font-weight: 300;
    background: #1c1c1c;
    color: #fff;
    padding: 5px 22px;
}
.ct-thoigian-2 p:first-child {
    margin-bottom: 5px;
}

/* css section giới thiệu cá nhân */
.col-canhan>.col-inner {
    border: 1px solid #e3e3e3;
    border-radius: 5px;
    padding: 15px 18px 5px 18px;
    box-shadow: 1px 1px 6px rgb(219 239 205);
    background: #fff;
}

.box-canhan {
    display: flex;
    align-items: center;
}
.box-canhan h5 {
    font-size: 20px;
    margin-bottom: 0;
}
.ct-canhan h3 {
    font-size: 16px;
    margin-top: 18px;
}
.ct-canhan h3:after {
    content: '';
    width: 50px;
    height: 2px;
    background-color: #333;
    display: block;
    margin-top: 5px;
}
a.button.primary.btn-xemthem {
    background: #d2d2d2;
    color: #000;
    font-weight: 300;
    font-size: 15px;
}

/* css section attach */
.st-attach .section-bg {
    background-image: url(/wp-content/uploads/2022/09/Rectangle-16-1.png);
    background-attachment: fixed;
}
.col-attach>.col-inner {
    background-color: #fff;
    padding: 12px 12px 20px 12px;
    border-radius: 4px;
}
.box-attach h4 {
    font-size: 20px;
}
.box-attach p {
    font-size: 15px;
}

/* css section ourr part */
.ct-part h4 {
    margin-bottom: 30px;
}
.ct-part h4:after {
    content: '';
    width: 50px;
    height: 2px;
    background-color: #fff;
    display: block;
    text-align: center;
    margin: auto;
    margin-top: 5px;
}

/* css footer */
.footer-widgets.footer.footer-1 {
    background-image: url(/wp-content/uploads/2022/09/Rectangle-22.png);
}
.ct-foo p {
	margin-bottom: 8px;
}
.ct-foo-bd h4:after {
    content: '';
    width: 50px;
    height: 2px;
    background-color: #fff;
    display: block;
    text-align: center;
    margin-top: 5px;
}
.ct-foo-bd h4 {
    margin-bottom: 30px;
}
/* css form liên hệ */
.form-lienhe input, .form-lienhe textarea {
    box-shadow: 0 0;
    border-radius: 4px;
}
input.wpcf7-form-control.has-spinner.wpcf7-submit {
    background: #d91c23;
}

/* css trang liên  hệ */
.col-shadow>.col-inner {
    box-shadow: 1px 1px 6px #e8e8e0;
    padding: 18px;
    border-radius: 6px;
    border: 1px solid #efefef;
    min-height: 350px;
}

@media (max-width: 768px) {
	/* 	css menu mobile */	
	.off-canvas-left .mfp-content, .off-canvas-right .mfp-content {
		background: #fff;
		width: 90%;
	}
	.sidebar-menu.no-scrollbar {
		padding-top: 0;
	}
	.off-canvas-left .mfp-content li.html.custom.html_nav_position_text {
		padding: 10px 0 0 0;
	}
	.off-canvas:not(.off-canvas-center) .nav-vertical li>a {
		padding-left: 20px;
		color: #000;
		font-weight: 400;
	}
	input.search-field.mb-0 {
		box-shadow: 0 0;
		border: 1px solid #d70018;
		height: 40px;
		border-radius: 4px 0 0 4px;
		font-size: 16px
	}
	input#.search-field.mb-0::placeholder {
		color: #525050;
	}
	button.ux-search-submit.submit-button {
		height: 40px;
		padding: 0 16px;
		border-radius: 0 4px 4px 0;
		background: #d70018;
	}
	/* 	css chi tiết sản phẩm */
	.product-footer ul.product-tabs>li {
		width: 50%;
	}
}

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


}
















/* =========================================================
   GTranslate – nút chọn ngôn ngữ (kiểu nổi)
   Màu chủ đạo đổi ở biến --gt-mau
   ========================================================= */
#gt_float_wrapper {
    --gt-mau: #d9262b;          /* đỏ menu */
    --gt-mau-nhat: #fdecec;
    --gt-chu: #1f2937;
    --gt-vien: #e5e7eb;
}

/* Khung chung: bỏ nền xám + bóng mặc định, xổ danh sách xuống dưới */
#gt_float_wrapper .gt_float_switcher {
    display: inline-flex !important;
    flex-direction: column-reverse;   /* danh sách nằm DƯỚI nút */
    gap: 6px;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
    border-radius: 0 !important;
    font-family: inherit !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
}

/* Nút đang chọn */
#gt_float_wrapper .gt_float_switcher .gt-selected {
    background: #fff !important;
    border: 1px solid var(--gt-vien);
    border-radius: 999px;
    box-shadow: 0 6px 18px -8px rgba(15, 23, 42, .35);
    transition: border-color .2s, box-shadow .2s;
}

#gt_float_wrapper .gt_float_switcher .gt-selected:hover {
    border-color: var(--gt-mau);
    box-shadow: 0 8px 22px -8px rgba(217, 38, 43, .45);
}

#gt_float_wrapper .gt_float_switcher .gt-selected .gt-current-lang {
    display: flex !important;
    align-items: center;
    gap: 8px;
    padding: 7px 12px 7px 7px !important;
    color: var(--gt-chu) !important;
    font-weight: 700 !important;
    letter-spacing: .04em;
}

/* Cờ tròn */
#gt_float_wrapper .gt_float_switcher img {
    width: 26px !important;
    height: 26px !important;
    margin: 0 !important;
    border-radius: 50% !important;
    object-fit: cover;
    box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--gt-vien);
}

#gt_float_wrapper .gt-lang-code {
    font-size: 14px;
    text-transform: uppercase;
}

/* Mũi tên: vẽ bằng CSS, xoay khi mở */
#gt_float_wrapper .gt_float_switcher-arrow {
    width: 8px !important;
    height: 8px !important;
    margin: -3px 0 0 2px;
    background: none !important;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg) !important;
    transition: transform .25s, margin .25s !important;
}

#gt_float_wrapper .gt_float_switcher-arrow.gt_arrow_rotate {
    margin-top: 4px;
    transform: rotate(-135deg) !important;
}

/* Danh sách ngôn ngữ */
#gt_float_wrapper .gt_float_switcher .gt_options {
    min-width: 180px;
    padding: 6px !important;
    background: #fff;
    border: 1px solid var(--gt-vien);
    border-radius: 12px;
    box-shadow: 0 18px 36px -14px rgba(15, 23, 42, .35);
    max-height: 300px;
}

#gt_float_wrapper .gt_float_switcher .gt_options a {
    display: flex !important;
    align-items: center;
    gap: 10px;
    padding: 9px 10px !important;
    border-radius: 8px;
    color: var(--gt-chu) !important;
    font-size: 14px !important;
    font-weight: 500;
    text-decoration: none !important;
    transition: background-color .15s, color .15s !important;
}

#gt_float_wrapper .gt_float_switcher .gt_options a img {
    width: 22px !important;
    height: 22px !important;
}

#gt_float_wrapper .gt_float_switcher .gt_options a:hover {
    background: #f3f4f6 !important;
    color: var(--gt-mau) !important;
}

/* Ngôn ngữ đang dùng: nền đỏ nhạt + dấu tích */
#gt_float_wrapper .gt_float_switcher .gt_options a.gt-current {
    background: var(--gt-mau-nhat) !important;
    color: var(--gt-mau) !important;
    font-weight: 700;
}

#gt_float_wrapper .gt_float_switcher .gt_options a.gt-current::after {
    content: "✓";
    margin-left: auto;
    font-weight: 800;
}

/* Điện thoại: thu nhỏ một chút */
@media (max-width: 549px) {
    #gt_float_wrapper .gt_float_switcher .gt-selected .gt-current-lang {
        padding: 5px 10px 5px 5px !important;
        gap: 6px;
    }

    #gt_float_wrapper .gt_float_switcher img {
        width: 22px !important;
        height: 22px !important;
    }
}