/*
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.   ***************/
.yith-wcan-filters .yith-wcan-filter .filter-items .filter-item .star-rating{height:1.5rem}.shop_attributes th,td{border-bottom:0}main{padding-top:10px}.flatsome-utils-loading-m svg circle{stroke:#42b348!important}.info>button{background:#2961fa;color:#ffff;border:none;border-radius:8px;font-size:15px;font-weight:500;padding:0 10px 0 48px;text-align:center;margin:15px 0;position:relative}.info>button::before{position:absolute;left:10px;content:url("data:image/svg+xml,%3Csvg id='Video' xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40'%3E%3Ccircle id='Ellipse_708' data-name='Ellipse 708' cx='20' cy='20' r='20' fill='rgba(41,97,250,0)'%3E%3C/circle%3E%3Cpath id='Path_65857' data-name='Path 65857' d='M241.38,19.358a2.76,2.76,0,0,1-2.78-2.731V2.871A2.76,2.76,0,0,1,241.38.14h13.646a2.76,2.76,0,0,1,2.784,2.731V16.627a2.76,2.76,0,0,1-2.784,2.731Zm0-17.686a1.21,1.21,0,0,0-1.217,1.2V16.627a1.206,1.206,0,0,0,1.217,1.2h13.646a1.21,1.21,0,0,0,1.221-1.2V2.871a1.21,1.21,0,0,0-1.221-1.2Zm23.648,16.722a.771.771,0,0,1-.38-.1l-4.317-2.458a.551.551,0,0,1-.205-.747l.205-.351a.588.588,0,0,1,.506-.288.571.571,0,0,1,.289.078l2.8,1.588h.107l.167-.093.053-.093V3.6l-.053-.09-.167-.1h-.107L261.092,5a.576.576,0,0,1-.761-.205l-.217-.374a.537.537,0,0,1-.057-.415.547.547,0,0,1,.259-.332l4.3-2.436a.829.829,0,0,1,.418-.123h.053a.776.776,0,0,1,.73.766V17.572a.806.806,0,0,1-.791.822Z' transform='translate(-232.6 9.911)' fill='%23ffff'%3E%3C/path%3E%3C/svg%3E");top:0}@media screen and (max-width:849px){#footer .col:not(.col-821728723){padding-bottom:5px}main{padding-top:5px}.category-filter-row{padding:10px 0 0}}.m-categories{list-style:none;display:flex;flex-wrap:wrap;gap:5px;justify-content:flex-start;font-size:.9rem;margin:1rem 0;font-weight:600}.m-categories li{padding:5px}.m-categories li a{color:#42b348}.m-categories li.active,.m-categories li:hover{background-color:#42b348}.m-categories li.active a,.m-categories li:hover a{color:#ffff}.page-wrapper .breadcrumbs{font-size:.8rem;margin:1rem 0;text-transform:none}main table{margin:0 0 1.5em;width:100%!important;border-spacing:0;border-width:1px 0 0 1px;border:1px solid rgba(0,0,0,.1)}main table th,table td{padding:12px;font-weight:400;text-align:left}main table td{border-width:0 1px 1px 0;font-weight:400;text-align:left}main table td ul li{line-height:1.5;list-style-type:circle;margin-left:2rem}main table table,main table td,main table th{border:1px solid rgba(0,0,0,.1)}main table tr td:first-child{background:#f1f1f1;white-space:wrap;width:30%;padding-left:15px}main td:first-child,main th:first-child{padding-left:15px!important}.scroll-indicator{position:fixed;z-index:1;top:0;left:0;width:0%;height:4px;background:#42b348}.ywpar_apply_discounts_container{display:none;margin-top:20px}.ywpar-button-message{cursor:pointer}.yith-par-message{display:block}.yith-par-message-variation.hide,.yith-par-message.hide{display:none!important}.theme-yith-proteo .products .yith-par-message{display:inline-block;width:auto;text-decoration:underline;text-transform:lowercase;font-size:.9em}.theme-yith-proteo .summary .yith-par-message,.theme-yith-proteo .summary .yith-par-message-variation{margin-bottom:30px;background:#f5f5f5;width:fit-content;padding:4px 5px}
#ovanic-loadmore {
  display: inline-block;
  background-color: #72d000; /* màu nền nút */
  color: #fff;
  font-weight: bold;
  padding: 15px 30px;
  font-size: 18px;
  border: none;
  border-radius: 12px; /* Boder góc mềm mại */
  cursor: pointer;
  transition: all 0.3s ease;
  margin: 40px auto;
  text-align: center;
}

#ovanic-loadmore:hover {
  background-color: #5bb000; /* Hiệu ứng hover */
}


/* Định dạng nút Nhận tư vấn khi loading */
.form-group.w-100 .btn.btn-submit {
    position: relative;
    transition: background-color 0.3s ease;
}

.form-group.w-100 .btn.btn-submit.loading::after {
    content: '';
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid #fff;
    border-radius: 50%;
    border-top-color: transparent;
    animation: spin 1s linear infinite;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    margin-left: 5px;
}

@keyframes spin {
    0% { transform: translateY(-50%) rotate(0deg); }
    100% { transform: translateY(-50%) rotate(360deg); }
}

/* Định dạng thông báo phản hồi */
#nds_form_feedback {
  display: block;
  margin-top: 15px;
  text-align: center;
  font-size: 13px;
  opacity: 0;
  transition: opacity 0.3s ease;
  background-color: #74be43;
  /* Giữ màu nền xanh hiện tại */
  color: #fff;
  /* Chữ màu trắng */
  padding: 5px 10px;
  /* Thêm padding để đẹp hơn */
  border-radius: 4px;
  /* Bo góc nhẹ */
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
  /* Bóng chữ để tăng độ tương phản */
}

#nds_form_feedback.success {
  opacity: 1;
}

#nds_form_feedback.error {
  opacity: 1;
}

#nds_form_feedback.error {
    color: #e63946; /* Màu đỏ cho lỗi */
    opacity: 1;
}

/* Ẩn dòng tiết kiệm, nhãn khuyến mãi... */
.product-page .product-summary .woocommerce-price-suffix,
.product-page .product-summary .price-label,
.product-page .product-summary .save-price,
.product-page .product-summary .discount,
.product-page .product-summary .woocommerce-price-savings {
  display: none !important;
}

/* Hiển thị giá và giá gốc trên cùng một hàng */
.product-page .price {
  display: flex;
  align-items: center;
  gap: 8px;
}

/* Giá khuyến mãi (hiện tại) */
.product-page .price ins {
  color: #e63946;
  font-weight: 700;
  text-decoration: none;
  font-size: 18px;
}

/* Giá gốc (có gạch ngang) */
.product-page .price del {
  color: #777;
  font-size: 16px;
  text-decoration: line-through;
}

/* Thêm chữ “Giá:” trước phần giá */
.product-page .price::before {
  content: "Giá: ";
  font-weight: 600;
  color: #222;
  margin-right: 4px;
}

.price-wrapper.price-block {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 18px;
}

.price-wrapper .price_item.is_price {
  margin: 0;
  display: flex;
  align-items: center;
  gap: 8px;
}

.price-wrapper .price-current {
  color: #e63946; /* Màu đỏ hoặc đổi màu thương hiệu */
  font-weight: 700;
}

.price-wrapper .price-old {
  color: #888;
  text-decoration: line-through;
  opacity: 0.8;
  font-size: 16px;
}

/* Apply box-sizing globally */
* {
    box-sizing: border-box;
}

/* ĐÃ SỬA: các rule .shop_info, .commit-* và .detail_info.seach_taget từng bị định nghĩa trùng lặp.
   CSS sản phẩm được quản lý ở assets/detail-product.css và assets/onic-product-final.css. */

/* ===== ONIC - H2 landing-style cho tab content ===== */
.onic-tab-title {
  position: relative;
  display: block;
  font-size: 22px;
  /* cỡ chữ lớn hơn */
  font-weight: 800;
  color: #00BCD4;
  /* màu chủ đạo */
  margin: 16px 0 10px;
  /* khoảng cách trên dưới (giảm so với trước) */
  padding: 12px 18px 12px 22px;
  /* padding: tạo nền nhẹ và chừa chỗ cho thanh trái */
  line-height: 1.15;
  background: rgba(0, 188, 212, 0.04);
  /* nền nhạt */
  border-radius: 8px;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.02) inset;
}

/* Thanh viền trái gradient nhỏ gọn */
.onic-tab-title::before {
  content: "";
  position: absolute;
  left: 10px;
  top: 10px;
  bottom: 10px;
  width: 5px;
  border-radius: 3px;
  background: linear-gradient(180deg, #00BCD4 0%, #008C9E 100%);
}

/* Khoảng cách giữa tab nav và tiêu đề gần hơn */
.onic-tab-section {
  padding: 8px 0 28px;
  /* giảm padding-top để tiêu đề sát nav hơn */
  border-bottom: 1px solid #f3f3f3;
  /* dùng biến offset nếu có (được set bởi JS) */
  scroll-margin-top: calc(var(--onic-sticky-offset, 90px) + 6px);
}

/* Kiểu chữ phần nội dung */
.onic-tab-body {
  color: #333;
  line-height: 1.8;
  font-size: 15px;
}

/* Nhỏ hơn cho mobile */
@media (max-width: 768px) {
  .onic-tab-title {
    font-size: 18px;
    padding: 10px 14px 10px 18px;
  }

.onic-tab-section#tab-hoi_dap .qa-form-container {
    border: 1px solid #e0e0e0;
    padding: 15px;
    border-radius: 8px;
    margin-bottom: 20px;
}
.onic-tab-section#tab-hoi_dap .qa-list .qa-item {
    border-bottom: 1px solid #e0e0e0;
    padding: 10px;
}
.onic-tab-section#tab-hoi_dap .qa-question {
    color: #00BCD4;
    font-weight: bold;
}
.onic-tab-section#tab-hoi_dap .qa-submit-btn {
    background-color: #00BCD4;
    color: #fff;
    border: none;
    padding: 8px 15px;
    border-radius: 4px;
}
@media (max-width: 768px) {
    .onic-tab-section#tab-hoi_dap .qa-form-container {
        padding: 10px;
    }
}
}