.full-footer {min-height: 100px;background: #334793;margin-top: 10px;padding-top: 15px;padding-bottom: 15px;}





.full-footer-bottom{

    background: #000000;

}

.content-footer{

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  color: #FFF;

  gap: 30px;

}



.footer-box-1 h2{

    text-transform: uppercase;
    font-size: 24px;
    padding: 0px 10px;
    border-left: 2px solid #F44336;

}

.company-footer h5{

  color: #FFF;

  font-size: 16.6px;

  padding: 12px 0;

  border-bottom: 1px solid #000;

}

.address-footer{

  display: flex;

  gap: 10px;

}

.address-footer i{

  display: flex;

  align-items: center;

  text-align: center;

  justify-content: center;

}



.address-footer p, .mobile-footer p, .email-footer p{

  color: #F1F1F1;

  font-size: 16px;

}





.social-footer {

  display: flex;

  align-items: center;

  gap: 15px; 

  flex-wrap: wrap;

}



.social-footer i {

  padding: 8px;               

  border-radius: 50%;

  font-size: 20px;             

  color: #ffffff;              

  transition: all 0.4s ease;   

  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4); 

}







/* Màu nền thương hiệu (cập nhật và chuẩn hơn) */

.social-footer .fa-facebook-f   { background: #3A589D; } 

.social-footer .fa-instagram    { background: #3b6994; } 

.social-footer .fa-linkedin-in  { background: #2478ba; } 

.social-footer .fa-x-twitter    { background: #111111; } 

.social-footer .far.fa-envelope { background: #0072B7; } 

.social-footer .fa-youtube      { background: #c33223; }



/* Hiệu ứng nổi lên khi hover - làm rõ màu và "bay" lên */

.social-footer i:hover {

  transform: translateY(-8px);          /* nổi lên 8px */

  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.5); /* bóng đậm hơn, sâu hơn */

  filter: brightness(1.15);             /* sáng hơn một chút để màu "pop" */

}



.footer-box-2 h2{

    text-transform: uppercase;
    font-size: 24px;
    padding: 0px 10px;
    border-left: 2px solid #F44336;

}

.footer-box-3 h2{

  font-size: 20px;

  padding: 0px 10px;

  border-left: 2px solid #F44336; 

}



.map iframe{

  height: auto;

  width: 100%;

}





.inner-footer-bottom{

    justify-content: space-between;

    align-items: center;

    text-align: start;

    border-top: 1px solid #000;

    padding-top: 10px;

}



.left-footer-bottom p{

    color: #FFFFFF;

    color: 16px;

    font-family: "Roboto", Arial, Tahoma, sans-serif;

}



.mid-footer-bottom a{

    color: #FF0000;

    font-size: 13.3333px;

    text-decoration: none;

}





.full-footer-bottom {background: #334793;padding: 10px 0;}



.left-footer-bottom {width: 40%;text-align: left;display: inline-block;color: #fff;}



.mid-footer-bottom {display: inline-block;text-align: center;width: 19%;}



.right-footer-bottom {display: inline-block;width: 40%;text-align: right;}



a.design-by {color: #fff;text-decoration: none;}



a.design-by:hover {text-decoration: underline;}



#show-sft, #hide-sft {float: right;font-size: 14px;margin: 0;text-align: right;cursor: pointer;}



#show-sft, .active-sft #hide-sft {display: inline-block;}



#hide-sft, .active-sft #show-sft {display: none;}



#mega-menu-wrap-footer_1 #mega-menu-footer_1 > li.mega-menu-item > a.mega-menu-link {

  line-height: 40px;

  height: 40px;

  padding: 0px 10px 0px 10px;

  vertical-align: baseline;

  width: 255px;

  display: block;

  color: #f1f1f1;

  text-transform: none;

  text-decoration: none;

  text-align: left;

  background: rgba(0, 0, 0, 0);

  border: 0;

  border-radius: 0;

  font-family: inherit;

  font-size: 14px;

  font-weight: normal;

  outline: none;

}



/* ===== FOOTER BOTTOM WRAPPER ===== */

.full-footer-bottom .inner-footer-bottom {

	display: flex;

	align-items: center;

	justify-content: space-between;

	flex-wrap: nowrap;

}



/* ===== MAX MEGA MENU FOOTER ===== */

.full-footer-bottom 

#mega-menu-max_mega_menu_4 {

	display: flex !important;

	flex-wrap: nowrap !important;

	align-items: center;

	white-space: nowrap;

}



/* Menu item */

.full-footer-bottom 

#mega-menu-max_mega_menu_4 > li.mega-menu-item {

	flex: 0 0 auto !important;

	white-space: nowrap;

}



/* Link */

.full-footer-bottom 

#mega-menu-max_mega_menu_4 > li.mega-menu-item > a.mega-menu-link {

	display: inline-flex !important;

	align-items: center;

	white-space: nowrap;

	line-height: 1.2;

}

.full-footer-bottom .inner-footer-bottom {

	display: flex;

	align-items: center;

	gap: 20px;

}



.right-footer-bottom {

	flex: 1;              /* ⬅ chiếm không gian còn lại */

	display: flex;

	justify-content: flex-end;

	min-width: 0;         /* RẤT QUAN TRỌNG */

}



#mega-menu-max_mega_menu_4 {

	display: flex !important;

	flex-wrap: nowrap !important;

	white-space: nowrap;

}



#mega-menu-max_mega_menu_4 > li > a {

	font-size: 14px;

	line-height: 1.2;

	white-space: nowrap;

}







@media (max-width: 768px) {



  /* Footer trên: từ 3 cột → 1 cột */

  .content-footer {

    display: grid;

    grid-template-columns: 1fr;

    gap: 0px;

    padding: 0 20px;

    text-align: left;

  }



  /* Mỗi box footer */

  .footer-box-1,

  .footer-box-2,

  .footer-box-3 {

    width: 100%;

  }



  /* Tiêu đề footer nhỏ lại */

  .footer-box-1 h2,

  .footer-box-2 h2,

  .footer-box-3 h2 {

    font-size: 16px;

  }



  /* Map full width */

  .map iframe {

    width: 100%;

    height: 250px;

  }



  /* ===== FOOTER BOTTOM ===== */

  .inner-footer-bottom {

    display: flex;

    flex-direction: column;

    gap: 8px;

    text-align: center;

    padding: 10px 15px;

  }



  .left-footer-bottom,

  .mid-footer-bottom,

  .right-footer-bottom {

    width: 100%;

    display: block;

    text-align: center;

    align-items: center;

    justify-content: center;

  }



  .right-footer-bottom img {

    max-width: 120px;

    height: auto;

  }



  /* #mega-menu-wrap-max_mega_menu_4{

    display: none;

  } */

  /* #mega-menu-wrap-max_mega_menu_4,

#mega-menu-max_mega_menu_4 {

    display: none !important;

} */





}



/* Xóa dấu + (fa-plus) ở mobile toggle hoặc footer menu */

@media (max-width: 768px) {

  .fa-plus:before,

  .fa-add:before {          /* nếu có class fa-add */

    content: none !important;

  }

}



/* Nếu dấu + nằm trong toggle bar của Max Mega Menu (rất phổ biến) */

.mega-menu-toggle .fa-plus:before,

.mega-toggle-blocks-right .fa-plus:before,

#mega-toggle-block-0 .fa-plus:before {

  content: none !important;

}



/* Fix an toàn hơn: target trực tiếp pseudo ở media query như inspect */

@media (max-width: 768px) {

  .fa-plus:before,

  .fa-plus::before {

    content: none !important;

  }

}