/*
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.   ***************/


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


}


/* Phá khóa giới hạn chiều cao logo của Flatsome */
.header-logo img, #logo img {
    max-height: 90px !important; /* Tăng số này lên 100px hoặc 110px nếu muốn to nữa */
    width: auto !important;
}

/* 1. Đổi màu nền Header Bottom sang vàng (#FCE990) */
.header-bottom {
    background-color: #FCE990 !important;
    padding-bottom: 15px !important;
}

/* 2. Ép thanh menu thành hình viên thuốc */
.header-bottom-nav {
    background-color: #2c2c2c !important;
    border-radius: 50px !important;
    display: inline-flex !important;
    padding: 0 !important;
    overflow: hidden !important;
    margin-top: 10px !important; /* Đẩy menu xuống xíu cho cân đối */
}

/* 3. Chỉnh chữ và khoảng cách cho từng mục menu */
.header-bottom-nav > li > a {
    color: #FCFEFE !important; /* Chữ trắng */
    font-weight: 700 !important;
    font-size: 14px !important;
    padding: 12px 25px !important;
    text-transform: uppercase !important;
    height: auto !important; /* Xóa fix cứng chiều cao của Flatsome */
    line-height: normal !important;
}

/* Hiệu ứng di chuột cho menu thường */
.header-bottom-nav > li:not(.btn-lienhe) > a:hover {
    color: #FCE990 !important; /* Đổi sang chữ vàng */
    background-color: rgba(255, 255, 255, 0.1) !important;
}

/* 4. Style riêng cho nút Liên Hệ chốt đơn (#E64C25) */
.header-bottom-nav > li.btn-lienhe > a {
    background-color: #E64C25 !important;
    color: #FCFEFE !important;
    padding-left: 35px !important;
    padding-right: 35px !important;
}

.header-bottom-nav > li.btn-lienhe > a:hover {
    background-color: #d13d1a !important; /* Chuyển màu cam sậm hơn một chút */
}

/* ==========================================
   1. THANH TÌM KIẾM (SEARCH BAR)
========================================== */
/* Căn chỉnh chiều dài và khoảng cách */
/* ==========================================
   1. THANH TÌM KIẾM (SEARCH BAR) - ĐÃ FIX
========================================== */
/* Căn chỉnh chiều dài thanh search */
.header-main .header-search-form {
    min-width: 450px !important; 
    margin-right: 15px !important;
}

/* Bo tròn nguyên cái khung chứa cả Input và Button */
.header-main .searchform .flex-row {
    border: 2px solid #E64C25 !important; /* Viền màu cam đỏ */
    border-radius: 50px !important;
    background-color: #ffffff !important;
    height: 44px !important;
    overflow: hidden !important; /* Cực kỳ quan trọng: Ép thằng button rụt vào trong */
    align-items: center !important;
}

/* Ô nhập liệu: Xóa viền, xóa nền, cho trong suốt để lọt thỏm vào khung */
.header-main .searchform input.search-field {
    border: none !important;
    background-color: transparent !important;
    box-shadow: none !important;
    height: 100% !important;
    padding-left: 20px !important;
    margin-bottom: 0 !important;
    color: #333 !important;
}

/* Nút tìm kiếm: Xóa nền vàng mặc định, đổi màu kính lúp */
.header-main .searchform button.submit,
.header-main .searchform .ux-search-submit {
    background-color: transparent !important;
    color: #E64C25 !important; /* Kính lúp màu cam đỏ */
    border: none !important;
    height: 100% !important;
    min-width: 45px !important;
    padding: 0 !important;
}

/* Xóa hiệu ứng đổi màu khi rê chuột vào kính lúp */
.header-main .searchform button.submit:hover,
.header-main .searchform .ux-search-submit:hover {
    background-color: transparent !important;
    opacity: 0.7 !important;
}

/* ==========================================
   2. NÚT GIỎ HÀNG (CART ICON)
========================================== */
/* Tạo khối nền cho giỏ hàng */
.header-main .cart-item > a {
    background-color: #4a2c2a !important; /* Nền nâu đậm */
    border-radius: 8px !important; /* Bo góc vuông giống mẫu */
    padding: 8px 15px !important;
    height: 44px !important; /* Cho cao bằng thanh Search để cân đối */
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Tắt chữ giá tiền (Cart Total) hiển thị cạnh giỏ hàng để web trông gọn hơn */
.header-main .cart-item .header-cart-title {
    display: none !important;
}

/* Chỉnh icon giỏ hàng thành màu trắng */
.header-main .cart-item i.icon-shopping-cart {
    color: #ffffff !important;
    font-size: 20px !important;
}

/* Cục chấm tròn thông báo số lượng (Badge) */
.header-main .cart-item .cart-icon strong {
    background-color: #28a745 !important; /* Màu xanh lá chuẩn form Madam Win */
    color: #ffffff !important;
    border-radius: 50% !important;
    width: 20px !important;
    height: 20px !important;
    line-height: 20px !important;
    top: -8px !important;
    right: -10px !important;
    font-size: 12px !important;
    border: 2px solid #ffffff !important; /* Thêm viền trắng để tách biệt với nền nâu */
}