/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.11
*/

/*************** ADD CUSTOM CSS HERE.   ***************/

.conten-gioi-thieu {
    color: #111;
    font-size: 14px;
}
.text-custom-detail {
    text-align: right;
    padding-top: 15px;
}
ul.header-nav.header-nav-main {
    justify-content: center !important;
}
.conten-gioi-thieu h3 {
    font-weight: 400;
    color: #000;
    font-size: 30px;
}

a {
    color: #0000ff;
}
.bg-phone {
    background: red !important;
}

.bg-mess {
    background: #f1f1f1 !important;
    border: none !important;
}
.button-dang-ky {
    font-weight: 500;
    background: #fff;
    font-size: 18px;
    border: 1px solid #315a39;
    border-radius: 25px;
    color: #000;
    font-weight: 500;
    transition: all 0.7s ease; 
}
.owl-carousel .item {
  background: #fff;
  border-radius: 25px;
  padding: 20px;
  margin: 10px;
  box-shadow: 0px 1px 4px 0px rgba(44,43,42,.1),0px 1px 4px 0px rgba(44,43,42,.2);
      min-height: unset !important;
}
.radius-custom .col-inner {
    border-radius: 25px;
}

.blog-post-inner a.button.is-outline.is-small.mb-0 {
    transition: all 0.7s ease;
    font-size: 14px;
    font-weight: 500;
    min-height: unset !important;
        line-height: 1.5;
}
.blog-post-inner a.button:hover{
    border-bottom: 1px solid #315a39 !important;
    color: #315a39 !important;
    background: none !important;
}
.title-section h3 {
    color: #000;
    font-size: 30px;
    text-align: center;
    font-weight: 500;
    text-transform: uppercase;
}

.name.product-title {
    color:#315a39;
    font-size: 18px;
}

.name.product-title a {
color: #27272a;
    font-weight: 700;
    font-size: 24px;
    transition: all .3s 
ease;
}
a.plain {
    font-size: 24px;
    color: #27272a;
    font-weight: 700;
}
.name.product-title a:hover{
    color: #315a39;;
}
.conten-testmonial {
    background: #fff;
    padding: 15px;
    margin-top: 15px;
}
.conten-testmonial p {
    margin-bottom: 0;
    color: #111;
}
strong {
    color: #000;
}
.star-rating span:before {
    color: #d8b347 !important;
}
.testimonial-meta.pt-half {
    color: #000;
    display: flex;
    flex-wrap: wrap;
}
.testimonial-company {
    width: 100%;
}

.testimonial-company {
    width: 100%;
}
h5.post-title {
    color: #111;
    text-align: left;
    font-size: 20px;
    font-weight: 500;
}
p.from_the_blog_excerpt {
    text-align: left;
    color: #111;
    margin: 10px 0;
}

.is-divider {
    display: none;
}
.box-text-inner.blog-post-inner {
    text-align: left;
}
.blog-post-inner a.button {
    text-transform: math-auto;
    border: none;
    padding: 0;
    margin-top: 0;
    color: #111;
}

.col.post-item img {
    border-radius: 6px;
}
.grid-tools a {
    background: #315a39;
    text-transform: capitalize;
}
.button.alt, .button.checkout, .checkout-button, .secondary {
    background: #315a39;
}
a.plain h1 {
    color: #111 !important;
}
.button.alt, .button.checkout, .checkout-button, .secondary {
    background: #315a39;
}
a.plain h1 {
    color: #111 !important;
}
.footer-widgets.footer.footer-2.dark {
    background: rgb(49, 90, 57);
    border-top-left-radius: 60px;
    border-top-right-radius: 60px;
}
.absolute-footer {
    display: none;
}
.image-tools.grid-tools.text-center.hide-for-small.bottom.hover-slide-in.show-on-hover {
    display: flex;
    justify-content: center;
    bottom: 15px !important;
    transition: all 1s ease;
}
.grid-tools a {
    background: #315a39;
    text-transform: capitalize;
    transition: all 1s ease-in-out;
    width: max-content;
    padding: 5px 10px !important;
    border-radius: 25px;
}
.open-popup {
    max-width: max-content;
    border-radius: 25px;
    border: 1px solid #315a39;
    font-size: 16px;
    color: #000;
    padding: 5px 20px;
    font-weight: 500;
    cursor: pointer;
    transition: all 1.2s ease; 
}
.button-nhan-bao-gia {
    /* text-align: center; */
    display: flex;
    justify-content: center;
    margin: 30px 0;
}
.title-section {
    margin-bottom: 25px;
}
.header-nav-main li{
    font-size:18px;
}
.header-nav-main .active {
    border-bottom: 3px solid #315a39;
}
.top-divider.full-width {
    display: none;
}
.header-main {
    height: auto !important;
    padding: 10px 0;
}
body .header.show-on-scroll,body .stuck .header-main {
    height: auto !important;
}
.open-popup:hover {
    background: #315a39; 
    color: #fff;
}
.button-dang-ky:hover {
    background: #315a39;
    box-shadow: none !important;
}
.grid-tools a:hover {
    background: #315a39;
}
.product-small img:hover {
  transform: scale(1.15);
  transition: transform 3s ease;
	
}
.nav-column li.active>a, .nav-column li>a:hover, .nav-dropdown li.active>a, .nav-dropdown>li>a:hover, .nav-vertical-fly-out>li>a:hover, .nav>li.active>a, .nav>li.current>a, .nav>li>a.active, .nav>li>a.current, .nav>li>a:hover {
    color: #315a39;
}
.header-nav-main li a {
    color: #315a39;
	font-size:15px;
}
.header-nav-main li {
    margin: 0 20px;
}
.slider-nav-circle .flickity-prev-next-button:hover .arrow, .slider-nav-circle .flickity-prev-next-button:hover svg {
    background: transparent !important;
    border-color: #fff;
}
/* UL có dấu tích trước mỗi LI */
.tick-list{
  list-style: none;
  margin: 0;
  padding: 0;
}
.tick-list li{
  position: relative;
  padding-left: 1.6rem;  /* khoảng cách cho icon */
  /* margin: .4rem 0; */
  margin-left: 0 !important;
  line-height: 1.6;
}
.tick-list li::before{
  content: "\2713";      /* ký tự ✓ */
  position: absolute;
  left: 0;
  top: 0.1rem;
  color: #22c55e;        /* xanh lá – đổi màu tùy thích */
  font-weight: 700;
  font-size: 1rem;
}
.header-nav-main li a:hover {
    color: #315a39 !important;
}
.testimonial-line li {
    height: 5px;
    background-color:#1ab4ea57;
    display: inline-block;
    margin-right: 3px;
    margin-left: 0px !important;
    border-radius: 50px;
}
.testimonial-line li:nth-of-type(1) {
    width: 40px;
}
.testimonial-line li:nth-of-type(4) {
    width: 5px;
}
.testimonial-line li:nth-of-type(2) {
    width: 15px;
}
.testimonial-line li:nth-of-type(3) {
    width: 10px;
}
ul.testimonial-line {
    text-align: center;
}
.product-small.box {
    border-radius: 32px;
    background: #fff;
    box-shadow: rgba(0, 0, 0, 0.14) 0px 1px 3px 0px, rgba(0, 0, 0, 0.12) 0px 5px 5px 0px, rgba(0, 0, 0, 0.07) 0px 11px 7px 0px, rgba(0, 0, 0, 0.02) 0px 19px 8px 0px, rgba(0, 0, 0, 0) 0px 30px 8px 0px;
}
.box-image {
    border-top-left-radius: 32px;
    border-top-right-radius: 32px;
}
.box-text.box-text-products {
    padding: 15px;
}

.box.box-normal.box-text-bottom.box-blog-post.has-hover {
    border-radius: 32px;
    background: #fff;
    box-shadow: rgba(0, 0, 0, 0.14) 0px 1px 3px 0px, rgba(0, 0, 0, 0.12) 0px 5px 5px 0px, rgba(0, 0, 0, 0.07) 0px 11px 7px 0px, rgba(0, 0, 0, 0.02) 0px 19px 8px 0px, rgba(0, 0, 0, 0) 0px 30px 8px 0px;
}

h5.post-title:hover a{
    color:#315a39;
}
.product-small.col.has-hover.product.type-product {
    transition: all 3s 
ease !important;
}
.item_reason h3 {
    color: #09090b;
    font-size: 24px;
}

.item_reason .icon-box-left {
    align-items: center;
    margin-bottom: 20px;
}

.item_reason {
    color: #09090b;
    font-size: 14px;
}

.item_reason .col-inner {
        background-color: #fff;
    box-shadow: 0px 1px 4px 0px rgba(44, 43, 42, .1), 0px 1px 4px 0px rgba(44, 43, 42, .2);
    border: 1px solid #e4e4e7;
    border-radius: 28px;
    padding: 32px 24px;
    transition: all .7s 
ease;
}
.item_reason .col-inner:hover{
    cursor: pointer;
    box-shadow: 0px 4px 4px -4px rgba(44,43,42,.1),0px 16px 32px -4px rgba(44,43,42,.2);
    border: 1px solid #315a39;
    transform: translateY(-16px);
}
.footer-left-custom strong {
    color: #fff;
}
.cta {
    padding: 8px;
    border-radius: 16px;
    background-color: #fff;
    border: 1px solid #fbe5d9;
    position: fixed;
    top: 70%;
    right: 16px;
    z-index: 999;
    transition: all .3s 
ease;
    transform: translateY(-60px);
}
.cta__btn {
    width: 40px;
    height: 40px;
    padding: 8px;
    border-radius: 12px;
    background-color: #fff;
    border: 1px solid #fd811c;
    color: #fd811c;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 0;
    margin-bottom: 0;
}
.cta__btn--description {
    padding: 4px 10px;
    background-color: #fff;
    border: 1px solid #e4e4e7;
    box-shadow: 0px 1px 4px 0px rgba(44, 43, 42, .1);
    border-radius: 8px;
    position: absolute;
    width: fit-content;
    text-wrap-mode: nowrap;
    top: 50%;
    left: -12px;
    transform: translate(-100%, -50%);
    opacity: 0;
    visibility: hidden;
    transition: all .3s 
ease;
}
.mb-2 {
    margin-bottom: .5rem !important;
}
span.woocommerce-Price-amount.amount {
    font-weight: 500;
    color: red;
    font-size:15px;
    margin-top: 15px;
}

.price-wrapper {
    padding-top: 10px;
}
.dg-product-excerpt {
    text-align: left;
    color: #111;
	    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-word;
}
.dg-view-more {
width: max-content;
    transition: all 2s 
ease;
    font-size: 14px;
    font-weight: 500;
    color: #315a39 !important;
    position: relative;
	 border-bottom: 2px solid transparent;
}
a.dg-view-more:hover {
    border-bottom: 1px solid #315a39;
}
.badge-inner.secondary.on-sale {
    display: none;
}
.blog-post-inner a.button:after {
    content: "";
    width: 16px;
    height: 16px;
    display: inline-block;
    position: absolute;
    background: url(https://sistervn.com/wp-content/uploads/2025/11/right-chevron-1.png);
    background-size: 100% 100%;
	top: 2px;
}

@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/
.banner-content h1 {
    font-size: 20px;
}
.conten-left {
    padding-bottom: 0;
}
.conten-right {
    padding-bottom: 0;
    display: flex;
    align-items: center;
}
.conten-right .box-text.text-center {
    padding-bottom:0;
}
	.title-section h3 {
    font-size: 22px;
}
	.conten-gioi-thieu h3{
		font-size:22px;
	}
	.name.product-title a {
    font-size: 16px;
}
}