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


}
.is-divider {
    background-color: rgb(255 66 26);
    height: 2px;
}
span.ux-menu-link__text {
    color: white;
}
aside#block-7, aside#search-3, aside#woocommerce_product_categories-2, aside#woocommerce_product_search-2, aside#recent-posts-3 {
    box-shadow: 0 1px 1px -2px rgba(0, 0, 0, .12), 0 1px 1px rgb(0 0 0 / 18%);
    padding: 20px;
    font-size: 95%;
    background-color: #b789000a;
}
a.product-contact-link {
    background-color: transparent;
    border: 1px solid;
    padding: 5px 30px;
    border-radius: 4px;
}
a.product-contact-link:hover {
    background-color: #ff421a;
    border: 1px solid #ff421a;
    padding: 5px 30px;
    border-radius: 4px;
	color:white;
}
a.woocommerce-LoopProduct-link.woocommerce-loop-product__link {
    padding-bottom: 15px!important;
    padding-top: 10px!important;
	font-size: 16px;
	
}

.thep-home-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.thep-home {
  display: inline-block;
  background: #ff421a; /* màu nền */
  color: #fff;
  font-weight: bold;
  padding: 8px 45px 8px 25px;
  clip-path: polygon(0 0, 85% 0, 100% 100%, 0% 100%);
}

.btn-xem-them {
  background: #ff421a;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  padding: 8px 16px;
  border-radius: 4px;
  text-decoration: none;
  transition: background 0.3s;
}

.btn-xem-them:hover {
  background: #ff5d3a;
	color:white;
}

/* Đảm bảo container cho phép hiển thị phần tử ngoài */
.product-small .box {
  position: relative;
  overflow: visible; /* quan trọng nếu trước đó là hidden */
}

/* Pseudo-element vẽ viền ở phía ngoài khung */
.product-small .box::before {
  content: "";
  position: absolute;
  top: -8px;    /* khoảng cách viền ra ngoài, chỉnh theo ý bạn */
  left: -8px;
  right: -8px;
  bottom: -8px;
  border: 2px solid #ff421a; /* màu viền */
  border-radius: 4px;        /* bo góc nếu cần */
  box-sizing: border-box;
  transform: scaleX(0);      /* ẩn ban đầu */
  transform-origin: left;
  transition: transform 0.32s ease;
  pointer-events: none;      /* tránh chặn tương tác */
  z-index: 2;
}

/* Khi hover bung viền ra (từ trái sang phải) */
.product-small .box:hover::before,
.product-small:hover .box::before {
  transform: scaleX(1);
}