/* =========================================================
   LAZA-INSPIRED UI REFRESH
   Mục tiêu: giao diện thương mại điện tử sáng, gọn, dễ mua,
   giống tinh thần laza.vn nhưng không copy asset hay source.
   ========================================================= */
:root{
    --lz-red:#c91523;
    --lz-red-dark:#a90f1b;
    --lz-orange:#ff9f1a;
    --lz-text:#1f2937;
    --lz-muted:#6b7280;
    --lz-border:#edf0f3;
    --lz-bg:#f5f6f8;
    --lz-card:#ffffff;
    --lz-shadow:0 8px 24px rgba(15,23,42,.08);
    --lz-radius:12px;
}
html{scroll-behavior:smooth;}
body{
    background:var(--lz-bg)!important;
    color:var(--lz-text)!important;
    font-family:Arial,Helvetica,sans-serif!important;
    line-height:1.45;
}
a{color:var(--lz-red);transition:color .18s ease,background .18s ease,box-shadow .18s ease,transform .18s ease;}
a:hover{color:var(--lz-red-dark);}
.header,.header1,.menu_home,.banner_home,.wrapper_full_1,.footer{max-width:1200px!important;}
#header{
    background:#111827!important;
    border:0!important;
    color:#d1d5db;
}
.header_menu_right>li{padding:8px 16px!important;}
.header_menu_right li a{color:#e5e7eb!important;}
#header1{
    background:#c91523!important;
    padding:14px 0!important;
    border-bottom:1px solid var(--lz-border);
    box-shadow:0 2px 12px rgba(15,23,42,.04);
}
#logo{width:17%!important;}
#logo img{max-height:64px;object-fit:contain;}
.search_heder{
    width:48%!important;
    margin-top:13px!important;
    padding:0 15px!important;
}
#form_search{
    height:42px;
    border:2px solid var(--lz-red);
    border-radius:999px;
    overflow:hidden;
    background:#fff;
    box-shadow:0 6px 18px rgba(201,21,35,.08);
}
.select_search_header{
    height:38px!important;
    border:0!important;
    background:#fff;
    color:#4b5563;
}
.input_search{
    height:38px!important;
    border:0!important;
    font-size:14px;
    color:#111827;
}
.input_search_sm,
.search_heder .fa_search{
    height:38px!important;
    line-height:38px!important;
    background:linear-gradient(135deg,var(--lz-red),var(--lz-red-dark))!important;
    border:0!important;
    color:#fff!important;
}
.search_heder .fa_search{right:15px!important;border-radius:0 999px 999px 0;}
.giohang{margin-top:14px!important;}
.text_gh1{color:var(--lz-red)!important;font-size:13px!important;}
#menu_home{
    background:var(--lz-red)!important;
    border:0!important;
    box-shadow:0 6px 18px rgba(169,15,27,.18);
}
.cate_home{
    background:var(--lz-orange);
    border-radius:8px 8px 0 0;
}
.cate_home p.cate_parent_name{line-height:42px!important;color:#fff!important;}
.menu_li li>a{
    line-height:42px!important;
    padding:0 13px!important;
    color:#fff!important;
    font-weight:600;
}
.menu_li li:hover>a,#menu1 li:hover>a{background:rgba(255,255,255,.12)!important;}
.left_menu_home{
    background:#fff;
    border:0!important;
    border-radius:0 0 var(--lz-radius) var(--lz-radius);
    overflow:hidden;
    box-shadow:var(--lz-shadow);
}
.left_menu_home li{border-bottom:1px solid var(--lz-border)!important;}
.left_menu_home li a{padding:10px 14px!important;}
.left_menu_home li a b{color:#374151!important;font-size:14px!important;}
.left_menu_home li:hover{background:#fff7f7!important;}
.left_menu_home li:hover a b{color:var(--lz-red)!important;}
.wrapper_full_1,.news_home,.banner_home{background:transparent;}
.title_name_cate,.title_name_cate_1,.title_name_cate_2,.title_name_cate_3{
    height:auto!important;
    margin:18px 0 12px!important;
    border-bottom:1px solid var(--lz-border);
}
.title_name_cate p,.title_name_cate_1 p,.title_name_cate_2 p,.title_name_cate_3 p,
.cate_arrangement_pr_list_text p{
    position:static!important;
    display:inline-block;
    background:transparent!important;
    color:var(--lz-text)!important;
    font-size:18px!important;
    font-weight:700!important;
    text-transform:none!important;
    padding:0 0 10px!important;
    border-bottom:3px solid var(--lz-red);
}
.title_name_cate p:after,.title_name_cate_1 p:after,.title_name_cate_2 p:after,.title_name_cate_3 p:after{display:none!important;}
.list_pr_ds,.load_product_list{
    background:#fff;
    border:1px solid var(--lz-border)!important;
    border-radius:var(--lz-radius);
    padding:10px!important;
    overflow:hidden;
}
.child_cate_produc_2,.box_product_v1,.box_product_v2,.box_product_v3,.box_product_v4{
    background:var(--lz-card)!important;
    border:1px solid var(--lz-border)!important;
    border-radius:var(--lz-radius)!important;
    padding:10px!important;
    overflow:hidden;
    box-shadow:0 1px 2px rgba(15,23,42,.04);
}
.child_cate_produc_2:hover,.box_product_v1:hover,.box_product_v2:hover,.box_product_v3:hover,.box_product_v4:hover{
    box-shadow:var(--lz-shadow);
    transform:translateY(-2px);
    z-index:2;
}
.child_cate_produc_2{height:360px!important;margin-top:12px!important;}
.img_pr_home,.box_product_v2_img,.box_product_v3_img,.box_product_v4_img{
    background:#fff;
    border-radius:10px;
    overflow:hidden;
}
.img_pr_home img,.box_product_v2_img img,.box_product_v3_img img,.box_product_v4_img img{
    object-fit:contain;
    transition:transform .25s ease;
}
.child_cate_produc_2:hover .img_pr_home img,.box_product_v2:hover img,.box_product_v3:hover img,.box_product_v4:hover img{transform:scale(1.035);}
.pr_name a,.box_product_v2_name a,.box_product_v3_name a,.box_product_v4_name a{
    color:#111827!important;
    font-size:14px!important;
    font-weight:600!important;
    line-height:19px!important;
}
.pr_name a:hover,.box_product_v2_name a:hover,.box_product_v3_name a:hover,.box_product_v4_name a:hover{color:var(--lz-red)!important;}
.promotion_price,.promotion_price_news,.price_v1,
.box_product_v2_price_num,.box_product_v3_price_num,.box_product_v4_price_num{
    color:var(--lz-red)!important;
    font-weight:700!important;
}
.promotion_price_old,.price_v1_old{
    color:#9ca3af!important;
    text-decoration:line-through;
}
.price_percent{
    background:var(--lz-red)!important;
    color:#fff!important;
    border-radius:999px!important;
    border:2px solid #fff;
    box-shadow:0 4px 10px rgba(201,21,35,.22);
}
.btn_cart,.btn_view_more a,.sm_sp,.submit_letter{
    background:linear-gradient(135deg,var(--lz-red),var(--lz-red-dark))!important;
    color:#fff!important;
    border:0!important;
    border-radius:999px!important;
    font-weight:700!important;
    letter-spacing:.1px;
    box-shadow:0 6px 16px rgba(201,21,35,.18);
}
.btn_cart:hover,.btn_view_more a:hover,.sm_sp:hover,.submit_letter:hover{
    background:linear-gradient(135deg,var(--lz-orange),#ff7a00)!important;
    color:#fff!important;
    transform:translateY(-1px);
}
.btn_cart{height:32px!important;line-height:32px!important;padding:0 13px!important;text-transform:none!important;}
.cate_view_all{
    border:1px solid var(--lz-red)!important;
    color:var(--lz-red)!important;
    border-radius:999px!important;
    background:#fff;
}
.cate_view_all:hover{background:var(--lz-red)!important;color:#fff!important;}
.trademark_price_left,.box_cate_news,.comment_danhgia_v1,.box_other_product,
.left_detail_news,.left_list_product{
    background:#fff!important;
    border:1px solid var(--lz-border)!important;
    border-radius:var(--lz-radius)!important;
    overflow:hidden;
    box-shadow:0 1px 2px rgba(15,23,42,.04);
}
.cate_arrangement_pr_list{
    background:#fff;
    border-radius:var(--lz-radius);
    border:1px solid var(--lz-border);
    padding:10px 12px!important;
    margin-bottom:10px;
}
.selec_arrangementt,.select_manufacturer_small,input[type="text"],input[type="email"],input[type="tel"],textarea,select{
    border:1px solid #d9dee7!important;
    border-radius:8px!important;
}
#footer{background:#111827!important;margin-top:25px;}
#footer1{background:#0b1220!important;}
.right_footer{border-left:1px solid rgba(255,255,255,.12)!important;}
.email_letter_social{border-bottom:1px solid rgba(255,255,255,.12)!important;}
.text_right_ft,.text_right_ft p,#footer1 .footer p{color:#e5e7eb!important;}
.text_right_ft p b{color:var(--lz-orange)!important;}
@media screen and (max-width:1024px){
    .header,.header1,.menu_home,.banner_home,.wrapper_full_1,.footer{width:100%!important;max-width:100%!important;}
    .child_cate_produc_2{height:auto!important;}
}
@media screen and (max-width:991px){
    body{background:#eef1f5!important;}
    #header_mobile,.c-header-mobile{box-shadow:0 2px 14px rgba(15,23,42,.10);}
    #frm_search_mobile form{
        border:2px solid var(--lz-red)!important;
        border-radius:999px!important;
        background:#fff;
        overflow:hidden;
    }
    #frm_search_mobile form button{color:var(--lz-red)!important;}
    .box_product_v2,.child_cate_produc_2{
        border-radius:12px!important;
        margin-bottom:10px!important;
        box-shadow:0 1px 4px rgba(15,23,42,.06);
    }
    .box_product_v2_img img{height:150px!important;}
    .box_product_v2_name a{height:42px!important;font-size:13px!important;line-height:18px!important;}
    .btn_cart{background:none!important;box-shadow:none!important;color:var(--lz-red)!important;padding:0!important;}
    .fixed_phone{background:var(--lz-orange)!important;}
    .fixed_cart{background:var(--lz-red)!important;}
    #fixed_cart_phone{height:44px!important;line-height:44px!important;}
    .wrapper_full_mb,.wrapper_full_2,.box_cate_add,.list_pr_ds,.cate_news_1,.banner_pr_list{border-bottom:8px solid #e8eaee!important;}
}
@media screen and (max-width:600px){
    .title_name_cate p,.title_name_cate_1 p,.title_name_cate_2 p,.title_name_cate_3 p,
    .cate_arrangement_pr_list_text p{font-size:16px!important;}
    .box_product_v2{width:50%!important;padding:8px!important;}
    .box_product_v2_price_num{width:100%!important;}
    .box_product_v2_price_percent{width:100%!important;margin-top:4px!important;}
}

/* =========================================================
   HEADER CSS FIX - ổn định lại layout header sau khi refresh
   Fix lỗi: vỡ hàng do tổng width > 100%, chữ/icon trắng trên nền trắng,
   ô search bị lệch, menu danh mục đè header khi fixed.
   ========================================================= */
#header1 .header1{
    display:flex!important;
    align-items:center!important;
    gap:16px!important;
    width:1200px!important;
    max-width:1200px!important;
    margin:0 auto!important;
    float:none!important;
    position:relative!important;
}
#header1 #logo{
    float:none!important;
    width:170px!important;
    min-width:150px!important;
    max-width:190px!important;
    display:flex!important;
    align-items:center!important;
}
#header1 #logo a{display:block!important;width:100%!important;line-height:0!important;}
#header1 #logo img{
    display:block!important;
    max-width:100%!important;
    width:auto!important;
    height:auto!important;
    max-height:58px!important;
}
#header1 .menu_hide{
    float:none!important;
    width:210px!important;
    min-width:210px!important;
    display:none!important;
    position:relative!important;
}
#header1.fixed .menu_hide,
.fixed #header1 .menu_hide,
.fixed .menu_hide{
    display:block!important;
}
#header1 .search_heder,
#header1.fixed .search_heder,
.fixed #header1 .search_heder,
.fixed .search_heder{
    float:none!important;
    flex:1 1 auto!important;
    width:auto!important;
    min-width:280px!important;
    margin:0!important;
    padding:0!important;
    position:relative!important;
}
#header1 #form_search{
    display:flex!important;
    align-items:center!important;
    width:100%!important;
    height:44px!important;
    margin:0!important;
    box-sizing:border-box!important;
}
#header1 .select_search_header{
    flex:0 0 118px!important;
    width:118px!important;
    height:40px!important;
    padding:0 8px!important;
    border-right:1px solid #edf0f3!important;
    border-radius:999px 0 0 999px!important;
    box-shadow:none!important;
    outline:none!important;
}
#header1 .input_search{
    flex:1 1 auto!important;
    width:auto!important;
    min-width:0!important;
    height:40px!important;
    padding:0 12px!important;
    border-radius:0!important;
    box-shadow:none!important;
    outline:none!important;
}
#header1 #btn_search,
#header1 .input_search_sm{
    flex:0 0 48px!important;
    width:48px!important;
    min-width:48px!important;
    height:44px!important;
    line-height:44px!important;
    margin:0!important;
    padding:0!important;
    border-radius:0 999px 999px 0!important;
    position:static!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    cursor:pointer!important;
}
#header1 .input_search_sm i,
#header1 #btn_search i{
    color:#fff!important;
    font-size:16px!important;
    line-height:1!important;
}
#header1 .header_element_right{
    float:none!important;
    width:auto!important;
    flex:0 0 355px!important;
    max-width:355px!important;
    padding:0!important;
    margin:0!important;
}
#header1 .header_element_right>ul{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:10px!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
}
#header1 .header_element_right>ul>li{
    display:flex!important;
    align-items:center!important;
    margin:0!important;
    color:#374151!important;
    vertical-align:middle!important;
}
#header1 .header_element_right>ul>li>a,
#header1 .header_element_right>ul>li span a,
#header1 .header_element_right>ul>li span{
    color:#374151!important;
}
#header1 .header_element_right>ul>li>p{
    float:none!important;
    width:34px!important;
    height:34px!important;
    min-width:34px!important;
    line-height:34px!important;
    margin:0 6px 0 0!important;
    border:1px solid #f2c2c7!important;
    background:#fff5f6!important;
    color:var(--lz-red)!important;
}
#header1 .header_element_right>ul>li i,
#header1 .header_element_right>ul>li>p>i{
    color:var(--lz-red)!important;
    font-size:15px!important;
    line-height:34px!important;
}
#header1 .header_element_right>ul>li:first-child a{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:38px!important;
    height:38px!important;
    border-radius:50%!important;
    background:#fff5f6!important;
    border:1px solid #f2c2c7!important;
    position:relative!important;
}
#header1 .header_element_right>ul>li:first-child a i{
    line-height:1!important;
    font-size:21px!important;
}
#header1 .header_element_right>ul>li:first-child a span{
    right:-6px!important;
    top:-8px!important;
    background:var(--lz-orange)!important;
    color:#fff!important;
    border:2px solid #fff!important;
    width:21px!important;
    height:21px!important;
    line-height:17px!important;
    font-size:12px!important;
}
#header1 .header_element_right>ul>li:nth-child(2),
#header1 .header_element_right>ul>li:nth-child(3){
    width:auto!important;
    max-width:88px!important;
}
#header1 .header_element_right>ul>li:nth-child(2) span,
#header1 .header_element_right>ul>li:nth-child(3) span,
#header1 .header_element_right>ul>li:nth-child(4) span{
    float:none!important;
    width:auto!important;
    padding-left:0!important;
    font-size:12px!important;
    line-height:15px!important;
}
#header1 .header_element_right>ul>li:nth-child(4) span a{
    color:var(--lz-red)!important;
    font-size:15px!important;
    font-weight:700!important;
}
#header1 .account_header ul{
    background:#fff!important;
    border:1px solid var(--lz-border)!important;
    box-shadow:var(--lz-shadow)!important;
    z-index:9999!important;
}
#header1 .account_header ul li a,
#header1 .account_header ul li a b{
    color:#374151!important;
}
#header1 .hide_ul_menu{
    z-index:9999!important;
    top:44px!important;
    box-shadow:var(--lz-shadow)!important;
}
@media screen and (max-width:1200px){
    #header1 .header1{
        width:100%!important;
        max-width:100%!important;
        padding:0 10px!important;
        box-sizing:border-box!important;
    }
    #header1 .header_element_right{flex-basis:330px!important;max-width:330px!important;}
}
@media screen and (max-width:991px){
    #header1{display:none!important;}
}
@media screen and (min-width:992px) and (max-width:1100px){
    #header1 .header_element_right>ul>li:nth-child(2),
    #header1 .header_element_right>ul>li:nth-child(3){display:none!important;}
    #header1 .header_element_right{flex-basis:185px!important;max-width:185px!important;}
    #header1 .search_heder{min-width:260px!important;}
}

/* =========================================================
   HEADER FINAL FIX 2026-05-13
   Mục tiêu: chỉ hiện 1 logo, không chồng link hướng dẫn / đăng ký / đăng nhập,
   giữ header gọn, rõ, dễ bấm trên desktop và tablet.
   ========================================================= */
@media screen and (min-width:992px){
    /* Chỉ dùng logo desktop trong header desktop */
    #header1 #logo .logo_pc{display:flex!important;align-items:center!important;width:100%!important;}
    #header1 #logo .logo_mb{display:none!important;visibility:hidden!important;width:0!important;height:0!important;overflow:hidden!important;}
    #header1 #logo .logo_pc img{display:block!important;max-height:56px!important;max-width:170px!important;object-fit:contain!important;}

    /* Khung header cố định, tránh item tràn đè nhau */
    #header1{background:#c91523!important;border-bottom:1px solid #edf0f3!important;box-shadow:0 2px 10px rgba(0,0,0,.04)!important;padding:10px 0!important;}
    #header1 .header1{height:auto!important;min-height:62px!important;overflow:visible!important;}
    #header1 .header_element_right{flex:0 0 430px!important;max-width:430px!important;min-width:430px!important;overflow:visible!important;}
    #header1 .header_element_right>ul{display:flex!important;flex-wrap:nowrap!important;align-items:center!important;justify-content:flex-end!important;gap:8px!important;overflow:visible!important;}

    /* Reset mạnh các width cũ để không bị chồng chữ */
    #header1 .header_element_right>ul>li,
    #header1 .header_element_right>ul>li:nth-child(2),
    #header1 .header_element_right>ul>li:nth-child(3),
    #header1 .header_element_right>ul>li:nth-child(4){
        float:none!important;
        display:flex!important;
        align-items:center!important;
        position:relative!important;
        width:auto!important;
        max-width:none!important;
        min-width:0!important;
        height:auto!important;
        margin:0!important;
        padding:0!important;
        white-space:normal!important;
        color:#243041!important;
        overflow:visible!important;
    }

    /* Icon tròn nhỏ gọn */
    #header1 .header_element_right>ul>li>p{display:flex!important;align-items:center!important;justify-content:center!important;width:30px!important;height:30px!important;min-width:30px!important;margin:0 5px 0 0!important;border-radius:50%!important;background:#fff4f4!important;border:1px solid #ffd1d1!important;line-height:1!important;}
    #header1 .header_element_right>ul>li>p>i{font-size:14px!important;line-height:1!important;color:#d71920!important;}

    /* Text link rõ ràng, không float, không calc width */
    #header1 .header_element_right>ul>li span,
    #header1 .header_element_right>ul>li:nth-child(2) span,
    #header1 .header_element_right>ul>li:nth-child(3) span,
    #header1 .header_element_right>ul>li:nth-child(4) span{
        float:none!important;
        display:block!important;
        width:auto!important;
        max-width:none!important;
        padding:0!important;
        margin:0!important;
        line-height:16px!important;
        font-size:12px!important;
        color:#243041!important;
        position:relative!important;
    }
    #header1 .header_element_right>ul>li span a{display:inline-block!important;color:#243041!important;font-size:12px!important;line-height:16px!important;font-weight:600!important;text-decoration:none!important;white-space:nowrap!important;}
    #header1 .header_element_right>ul>li span a:hover{color:#d71920!important;}

    /* Hướng dẫn mua hàng thành 1 nút riêng */
    #header1 .header_element_right>ul>li:nth-child(2){padding:6px 8px!important;border:1px solid #edf0f3!important;border-radius:12px!important;background:#fff!important;}

    /* Đăng ký / đăng nhập xếp dọc, không chồng nhau */
    #header1 .header_element_right>ul>li:nth-child(3){padding:6px 8px!important;border:1px solid #edf0f3!important;border-radius:12px!important;background:#fff!important;}
    #header1 .header_element_right>ul>li:nth-child(3)>span{display:block!important;clear:both!important;}
    #header1 .header_element_right>ul>li:nth-child(3)>span+span{margin-top:1px!important;}
    #header1 .header_element_right>ul>li:nth-child(3)>span:first-of-type a:after{content:""!important;}

    /* Hotline nổi bật nhưng không chiếm quá nhiều chỗ */
    #header1 .header_element_right>ul>li:nth-child(4){padding:6px 8px!important;border-radius:12px!important;background:#fff7f0!important;border:1px solid #ffd8b1!important;}
    #header1 .header_element_right>ul>li:nth-child(4) span{font-size:11px!important;color:#6b7280!important;line-height:14px!important;}
    #header1 .header_element_right>ul>li:nth-child(4) span p{display:block!important;margin:0!important;padding:0!important;line-height:16px!important;}
    #header1 .header_element_right>ul>li:nth-child(4) span a{font-size:14px!important;color:#d71920!important;font-weight:800!important;line-height:16px!important;}

    /* Giỏ hàng */
    #header1 .header_element_right>ul>li:first-child{margin-right:2px!important;}
    #header1 .header_element_right>ul>li:first-child>a{width:38px!important;height:38px!important;min-width:38px!important;}

    /* Search co lại đúng khi header cần thêm không gian */
    #header1 .search_heder{min-width:250px!important;}
}

/* Tablet nhỏ: ẩn bớt hướng dẫn để không đè search */
@media screen and (min-width:992px) and (max-width:1160px){
    #header1 .header_element_right{flex-basis:280px!important;max-width:280px!important;min-width:280px!important;}
    #header1 .header_element_right>ul>li:nth-child(2){display:none!important;}
    #header1 .header_element_right>ul>li:nth-child(3){padding:6px!important;}
    #header1 .header_element_right>ul>li:nth-child(4){padding:6px!important;}
    #header1 .header_element_right>ul>li:nth-child(4) span a{font-size:13px!important;}
    #header1 .search_heder{min-width:220px!important;}
}

/* Mobile: header desktop tắt hoàn toàn, tránh trùng logo với menu mobile */
@media screen and (max-width:991px){
    #header1,#header1 .header1,#header1 #logo,#header1 #logo .logo_pc,#header1 #logo .logo_mb{display:none!important;visibility:hidden!important;height:0!important;overflow:hidden!important;}
}
