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

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


@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/


}

/* === SOFA: hover overlay like Woo quick info === */
ul.products li.product{position:relative;}
ul.products li.product .sofa-hover-card{
  position:absolute; inset:0;
  display:flex; align-items:stretch; justify-content:stretch;
  opacity:0; pointer-events:none;
  transition:opacity .18s ease;
}
ul.products li.product:hover .sofa-hover-card{opacity:1;}
ul.products li.product .sofa-hover-inner{
  background:rgba(232, 242, 232, .92);
  border:2px solid #c1121f;
  border-radius:12px;
  padding:12px 12px;
  width:100%;
  overflow:auto;
}
ul.products li.product .sofa-hover-title{font-weight:800;color:#1b5e20;margin-bottom:6px;}
ul.products li.product .sofa-hover-heading{font-weight:800;color:#c1121f;margin:8px 0 4px;}
ul.products li.product .sofa-hover-list{margin:0 0 0 18px;padding:0;}
ul.products li.product .sofa-hover-list li{margin:0 0 3px;}
ul.products li.product .sofa-hover-info{font-size:14px;}
ul.products li.product .sofa-hover-price{font-weight:800;color:#c1121f;margin-top:8px;}

/* Slider thumbnails */
.sofa-product-thumbs .swiper-slide{opacity:.7}
.sofa-product-thumbs .swiper-slide-thumb-active{opacity:1}



/* === SOFA FIXES 2026-01-22 === */
/* Price red bold when has price */
.single-san-pham .price .amount.has-price,
.single-san-pham .price .woocommerce-Price-amount.has-price{
  color:#c1121f !important;
  font-weight:800 !important;
}

/* Thumbs: keep row snug */
.sofa-product-thumbs{margin-top:12px}
.sofa-product-thumbs .swiper-slide{width:auto; border-radius:10px; overflow:hidden; border:2px solid transparent; box-sizing:border-box;}
.sofa-product-thumbs .swiper-slide-thumb-active{border-color: var(--primary-color,#446084);}
.sofa-product-thumbs img{width:100%; height:100%; object-fit:cover; display:block}

/* Category grid: 3 cols desktop/tablet, 2 cols mobile, no bullets */
.tax-san-pham-cat ul.products,
.post-type-archive-san-pham ul.products{list-style:none !important; padding-left:0 !important; margin-left:0 !important;}
.tax-san-pham-cat ul.products li.product,
.post-type-archive-san-pham ul.products li.product{list-style:none !important;}
/* Flatsome row classes provide columns; ensure widths fallback */
@media (max-width: 549px){
  .tax-san-pham-cat ul.products li.product,
  .post-type-archive-san-pham ul.products li.product{width:50%;}
}
@media (min-width: 550px){
  .tax-san-pham-cat ul.products li.product,
  .post-type-archive-san-pham ul.products li.product{width:33.333%;}
}

/* Make loop cards look like Flatsome product boxes */
.sofa-loop-box .box-text{
  background:#3f6a37; /* green footer like screenshot */
  color:#fff;
  padding:10px 12px;
}
.sofa-loop-box .box-text a{color:#fff;}
.sofa-loop-box .star-rating{margin:4px 0;}
.sofa-loop-box .price{color:#ffeb3b;font-weight:800;}


/* SOFA FIX v4 */
.woocommerce-Price-amount.amount.has-price{color:#d40000;font-weight:800}
.sofa-product-thumbs .swiper-slide{height:auto !important}
.sofa-product-thumbs img{height:100%;object-fit:cover}

/* === Sofa grid: uniform gaps + centered title/price/rating (v18.2-fix) === */
.products.sofa-products-grid{
  list-style:none !important;
  margin:0 !important;
  padding:0 !important;
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:24px !important; /* row + column spacing */
}
@media (max-width: 849px){
  .products.sofa-products-grid{
    grid-template-columns:repeat(3, minmax(0,1fr));
    gap:20px !important;
  }
}
@media (max-width: 549px){
  .products.sofa-products-grid{
    grid-template-columns:repeat(2, minmax(0,1fr));
    gap:16px !important;
  }
}
/* reset any Flatsome/Woo column paddings inside our grid */
.products.sofa-products-grid > li,
.products.sofa-products-grid > li.col{
  width:auto !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  float:none !important;
}
/* center text */
.products.sofa-products-grid .box-text{
  text-align:center !important;
}

/* Compact title + price block so the overlay doesn't get too tall */
.products.sofa-products-grid .box-text .name,
.products.sofa-products-grid .box-text .product-title,
.products.sofa-products-grid .box-text .woocommerce-loop-product__title{
  font-size:15px !important;
  line-height:1.2 !important;
  margin:0 0 4px 0 !important;
  overflow:hidden;
  display:-webkit-box;
  -webkit-line-clamp:2; /* keep it neat but not too tall */
  -webkit-box-orient:vertical;
}

.products.sofa-products-grid .box-text .price{
  margin-top:2px !important;
  line-height:1.1 !important;
}

/* center stars + keep them close to the price */
.products.sofa-products-grid .star-rating,
.products.sofa-products-grid .box-text .star-rating{
  float:none !important;
  display:block !important;
  margin:2px auto 0 auto !important;
}
/* tighten spacing when product has no rating */
.products.sofa-products-grid li.no-rating .box-text{
  padding-top:8px !important;
  padding-bottom:8px !important;
}
.products.sofa-products-grid li.no-rating .price{
  margin-top:2px !important;
}

/* dynamic columns for shortcode grid */
.products.sofa-products-grid.sofa-cols-4{ grid-template-columns:repeat(4, minmax(0,1fr)); }
.products.sofa-products-grid.sofa-cols-2{ grid-template-columns:repeat(2, minmax(0,1fr)); }
@media (max-width: 849px){
  .products.sofa-products-grid.sofa-cols-4{ grid-template-columns:repeat(3, minmax(0,1fr)); }
}
@media (max-width: 549px){
  .products.sofa-products-grid.sofa-cols-4{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}



/* === Mobile: use Image Box (text below image) to avoid covering product image === */
@media (max-width: 549px){
  .products.sofa-products-grid .sofa-loop-box.box-text-bottom .box-text{
    position:relative !important;
    top:auto !important;
    bottom:auto !important;
    left:auto !important;
    right:auto !important;
    transform:none !important;
    width:100% !important;
  }
  .products.sofa-products-grid .sofa-loop-box.box-text-bottom .box-image{
    margin-bottom:0 !important;
  }
  /* keep bar height compact on mobile */
  .products.sofa-products-grid .sofa-loop-box .box-text{
    padding:6px 8px !important;
  }
}