.elementor-238 .elementor-element.elementor-element-ce5353a{--display:flex;--min-height:0px;--background-transition:0.3s;}.elementor-238 .elementor-element.elementor-element-c8705e8{width:initial;max-width:initial;}.elementor-238 .elementor-element.elementor-element-c8705e8.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-238 .elementor-element.elementor-element-63d3978{--display:flex;--background-transition:0.3s;}@media(min-width:768px){.elementor-238 .elementor-element.elementor-element-ce5353a{--width:100%;}}/* Start custom CSS for html, class: .elementor-element-c8705e8 */@import "https://fonts.googleapis.com/css?family=Montserrat:300,300i,400,400i,500,600,700&display=swap";

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Montserrat', sans-serif;
    background-color: #f5f5f5;
}

header {
    background-color: #fff;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    z-index: 100
}

.header-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 20px;
}

.logo img {
    height: 70px;
}

.search-bar {
    display: flex;
    flex-grow: 1;
    margin-left: 20px;
    margin-right: 20px;
}

.search-bar input {
    padding: 10px;
    font-size: 16px;
    border: 1px solid #ccc;
    border-radius: 4px;
    flex-grow: 1;
}

.search-bar button {
    background-color: #00a79d;
    border: none;
    color: white;
    padding: 10px;
    cursor: pointer;
    border-radius: 0 4px 4px 0;
}

.header-icons {
    display: flex;
    align-items: center;
}

.header-icons div, .header-icons a {
    margin: 0 10px;
    color: #00a79d;
}

.phone {
    font-size: 18px;
    font-weight: bold;
    
}

.toggle-menu {
    display: none;
    cursor: pointer;
}

nav.main-menu {
    background-color: #00a79d;
}

ul.list-level-01 {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: center;
}

ul.list-level-01 > li {
    position: relative;
    display: inline-block;
    /* padding: 10px 20px; */
}

li.parent a {
    color: #fff;
    font-weight: 500;
    text-decoration: none;
}

.child, .dropdown-menu {
    display: none;
    background-color: #fff;
    border-radius: 4px;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 9999; /* Increase z-index */
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    min-width: 250px;
}

.child.show, .dropdown-menu.show {
    display: block;
}

ul.child li, ul.dropdown-menu li {
    position: relative;
}

ul.child li a, ul.dropdown-menu li a {
    display: block;
    padding: 10px 20px;
    color: #000;
    text-decoration: none;
}

ul.child li a:hover, ul.dropdown-menu li a:hover {
    background-color: #f1f1f1;
}

.submenu-item {
    position: relative;
}

.submenu-item .dropdown-menu {
    left: 100%;
       top: 0px;
    min-height: 600px;
}

.scrollable {
    max-height: 400px;
    overflow-y: auto;
    width: 300px; /* Increase width as needed */
}
.fas {
    opacity: 70%;
}
.in-nhanh {
    background-color: #FF5733; /* Red background */
    color: white; /* White text */
    font-weight: normal;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
     overflow: hidden;
}
.san-pham-in-an {
    background-color: #FF4500; /* Dark orange background */
    color: white; /* White text */
    font-weight: bold;
    padding: 10px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 4px;
    height: 100%;
}

.san-pham-in-an:hover {
    background-color: #FF6347; /* Lighter dark orange on hover */
}

.san-pham-in-an .caret {
    margin-left: 10px;
    transition: transform 0.3s ease;
}

.san-pham-in-an .caret.rotate {
    transform: rotate(90deg);
}
.fas  {
    margin-right:10px ;
}
/* General menu item styles */
.main-menu ul li a {
    padding: 10px 20px;
    text-decoration: none;
    
    display: flex;
  
 
    border-radius: 4px;
    transition: background-color 0.3s;
}
.caret {
    margin-left: 10px;
}
.main-menu ul li a {
 
    align-items: center;
}
@media (max-width: 768px) {
    .logo {
    width: 100%;
    
}
    .phone {
    font-size: 16px;
    font-weight: bold;
    display: none;
}
    .header-top {
        flex-direction: column;
        align-items: flex-start;
       
    }

    .search-bar {
        width: 100%;
        margin: 10px 0;
    }

    .toggle-menu {
        display: block;
    font-size: 25px;
    }

    nav.main-menu {
        display: none;
        width: 100%;
    }

    nav.main-menu.active {
        display: block;
        position: absolute;
        top: 100px;
        background-color: #00a79d;
        z-index:100;
             margin-top: 120px;
    }

    ul.list-level-01 {
        flex-direction: column;
        width: 100%;
    }

    ul.list-level-01 > li {
        width: 100%;
        text-align: left;
    }

    .child, .dropdown-menu {
        position: relative;
        width: 100%;
        box-shadow: none;
    }

    .submenu-item .dropdown-menu {
        left: 0;
    }
}
ul {
    list-style-type: none; /* This hides the bullets */
}

ul.child, ul.dropdown-menu {
    list-style-type: none; /* This ensures bullets are hidden in nested lists as well */
}/* End custom CSS */