/*
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.   ***************/
.img img, .img .img-inner
{
	border-radius: 10px;
}
/* Container bọc ngoài cùng */
.price-tag {
  display: inline-flex; /* Dùng inline-flex để thẻ bọc vừa vặn với nội dung */
  align-items: center;  /* Căn giữa theo chiều dọc */
  color: var(--fs-color-primary);       /* Mã màu bạn yêu cầu */
  font-family: system-ui, -apple-system, sans-serif; /* Font chữ cơ bản, bạn có thể đổi theo font web của bạn */
}

/* Phần chữ "CHỈ VỚI" */
.price-prefix {
  display: flex;
  flex-direction: column; /* Xếp dọc 2 chữ */
  text-transform: uppercase; /* Viết hoa toàn bộ */
  font-size: 20px;        /* Kích thước chữ nhỏ */
  font-weight: 700;       /* In đậm */
  line-height: 1;         /* Giảm khoảng cách giữa 2 dòng */
  margin-right: 12px;     /* Khoảng cách với số tiền */
  text-align: center;
}

/* Phần số tiền "499.000" */
.price-amount {
  font-size: 80px;        /* Kích thước chữ lớn */
  font-weight: 800;       /* In cực đậm */
  line-height: 1;
  letter-spacing: -2px;   /* Khoảng cách giữa các số hơi sát lại giống trong hình */
  display: flex;
}

/* Chữ "Đ" */
.price-currency {
  font-size: 40px;        /* Nhỏ hơn số tiền */
  font-weight: 800;
  margin-top: 6px;        /* Đẩy xuống một chút để căn mí trên cho đẹp */
  margin-left: 2px;
}
/* Styling cho toàn bộ khung chữ */
.promo-badge {
  display: inline-flex; /* Để khung ôm sát theo chiều dài nội dung */
  align-items: center;  /* Căn giữa icon và chữ theo chiều dọc */
  background-color: var(--fs-color-primary); /* Màu nền bạn yêu cầu */
  color: #ffffff;       /* Màu chữ trắng */
  padding: 6px 16px;    /* Khoảng cách từ nội dung ra viền trên dưới, trái phải */
  border-radius: 9999px; /* Tạo hình dạng viên thuốc (pill shape) bo tròn hoàn toàn 2 đầu */
  font-size: 15px;      /* Kích thước chữ */
  text-transform: uppercase; /* Tự động viết hoa toàn bộ chữ */
  gap: 3px;             /* Khoảng cách giữa icon và chữ */

}

/* Styling cho kích thước của Icon */
.gift-icon {
  width: 18px; 
  height: 18px;
}
/* Đường line dài, mỏng (Màu xanh) */
.custom-divider {
  width: 150px;       /* Thay đổi thông số này để đường xanh ngắn/dài theo ý muốn */
  max-width: 90%;     /* Đảm bảo không bị tràn màn hình trên điện thoại */
  height: 1px;        
  background-color: #00aeef; 
  
  display: flex;
  justify-content: center;
  align-items: center;
  
  /* Phần quan trọng: 'auto' giúp tự động căn giữa toàn bộ khối line này */
  margin: 10px auto; 
}

.custom-divider::after {
  content: "";
  display: block;
  width: 60px;        /* Chiều dài của đoạn màu hồng */
  height: 3px;        /* Độ dày đoạn đè lên */
  background-color: #e30d76; 
}

.hdev-col-hero-left .icon-box-left .icon-box-img+.icon-box-text
{
	padding-left: 0.5em;
}
.hdev-col-hero-left .icon-box-img svg
{
	padding-top: 0;
}
.hdev-row-tamsoatsom .col-inner
{
	border: 1px solid var(--fs-color-secondary);
}