/*
Theme Name: HieuPham.Vn TT 02
Description: HieuPham.Vn TT 02
Author: HieuPham.Vn
Template: flatsome
Version: 3.0
*/

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

td, th {
    font-size: 1em;
}
.wdr_bulk_table_tr{
	height: 45px;
}
.col_index_3{
	display: flex;
	justify-content: space-around;
    align-items: center;
}
.wdr_bulk_table_td.wdr_bulk_table_discount {
    display: flex;
    justify-content: space-between; /* Đẩy nội dung ra hai phía */
    align-items: center; /* Căn giữa theo chiều dọc nếu có chiều cao khác nhau */
    padding-right: 8px;
	height: 45px;
}
.wdr_bulk_table_td.wdr_bulk_table_discount .awdr-add-btn,
.wdr_bulk_table_td.wdr_bulk_table_discount .awdr-added-btn {
    display: inline-flex !important; /* hoặc inline-block */
    align-items: center; /* Căn giữa nội dung trong button */
    justify-content: center; /* Căn giữa nội dung trong button */
    flex-shrink: 0; /* Ngăn button bị co lại khi không gian hẹp */
}
.wdr_bulk_table_td.wdr_bulk_title{
	padding-left: 8px;
    color: #1b1b1b !important;
}
.awdr-disabled {
	background-color: rgba(150, 150, 150, 0.1) !important;
}
/* Active state styling */
.bulk_table_row.awdr-item-active {
    background-color: rgba(0, 124, 186, 0.1) !important;
    border-left: 4px solid #007cba !important;
    transition: all 0.3s ease !important;
}

/* Disabled state styling */
.bulk_table_row.awdr-disabled {
    opacity: 0.6 !important;
    transition: all 0.3s ease !important;
}

/* Added state styling */
.bulk_table_row.awdr-added {
    background-color: rgba(70, 180, 80, 0.1) !important;
    transition: all 0.3s ease !important;
}

/* Button transitions */
.awdr-add-btn,
.awdr-added-btn {
    transition: all 0.3s ease !important;
}

.awdr-add-btn:hover {
    background-color: #007cba !important;
    color: white !important;
}

/* Loading overlay specific to discount table */
.awdr-bulk-customizable-table {
    position: relative !important;
}

.wpcpq-table .wpcpq-item-active {
    background: #bfe7ff;
}
.wpcpq-item-qty{
	flex: 0 1 9em!important;
}
.wpcpq-item-price{
	font-size: 1em;
	height: 32px;
}
.wpcpq-item-price .wpcpq-item-text{
	font-size: 0.8em;
}
.awdr-add-btn {
  border: 1px solid #2196f3;
  background: #fff;
  color: #007bc6;
  border-radius: 3px;
  padding: 0 15px;
    margin: 0;
  cursor: pointer;
  font-size: 13px;
	width: 86px;
}
.awdr-add-btn:disabled {
  opacity: 0.5;
  pointer-events: none;
}
.awdr-added-btn {
  border: none;
  background: #f5f5f5;
  color: #aaa;
  border-radius: 3px;
  padding: 0 15px;
    margin: 0;
  font-size: 13px;
  cursor: default;
}

.irs--flat .irs-bar {
    background-color: #007bc6;
}
.irs--flat .irs-from, .irs--flat .irs-single, .irs--flat .irs-to {
    background-color: #007bc6;
}
.irs--flat .irs-handle>i:first-child {
    background-color: #007bc6;
}
.irs--flat .irs-handle.state_hover>i:first-child, .irs--flat .irs-handle:hover>i:first-child {
    background-color: #007bc6;
}
.irs--flat .irs-from:before, .irs--flat .irs-single:before, .irs--flat .irs-to:before {
    border-top-color: #007bc6;
}
.bapf_body input{
    margin-bottom: 5px;
}
#reviews .review-form-inner.has-border{
	border: 1px solid #e0e0e0;
	border-radius: 1rem;
	padding: 15px;
}
.row .col.product .col-inner,.row .col.is-selected .col-inner {
    overflow: hidden;
    border: 1px solid #e5e5e5;
    border-radius: 1rem;
}
.row .col.product .col-inner .box-text,.row .col.is-selected .col-inner .box-text {
    padding-left: .5rem;
    padding-right: .5rem;
}
.product-lightbox .wpcpq-wrap{
	display:none;
}
.woocommerce-variation-price {
	font-size: 1.5em;}
.simple-collections{
	padding: 10px 0;
    border-top: 0.8px solid #ddd;
	border-bottom: 0.8px solid #ddd;
}
.button {
	padding-top: 5px;
	padding-bottom:5px;
}
.social-icons .button{
	padding:0;
}
.payment-icons .payment-icon {
	background-color: rgb(192 192 192);
}
.input-text.qty{
	height: auto !important;
}
.pre-purchase__footer{
	display:none;
}
#popup-upsells .zplus-auto-upsells{
	max-height: 520px;
	padding: 20px;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}
#popup-upsells .pre-purchase__action-checkout {
    width: 168px;
    line-height: 24px;
    padding: 20px 22px;
	margin:0;
	background-color: #303030;
    border-color: #303030;
    color: #fff;
}
#popup-upsells .upsell-flex {
    display: flex;
	justify-content: space-between;
	flex-direction: row-reverse;
}
#popup-upsells .pre-purchase__footer {
    box-shadow: 0 2px 25px rgba(0, 0, 0, .15);
}
#popup-upsells .upsell-items-center {
    align-items: center;
}

#reviews{
	margin-top:30px;
}
.v-customer-review .testimonial-meta{
	text-align: center;
	text-decoration: underline;
}
.product .custom-product-page .z-product .col-inner .section {
    padding: 30px 0px;
}
.custom-promo-container p, .custom-countdown-timer-container p{
	color: #f20d0d;
	font-size: 16px;
/* 	opacity:0.6; */
}
.custom-countdown-timer-container .countdown{
	display:flex;
	align-items: center;
}
.custom-countdown-timer-container .countdown--timer{
	    font-weight: 700;
}
.opacity-06{
	opacity:0.6;
}
/* .custom-countdown-container .opacity-06{
	opacity:0.6;
} */
.guest-num{
	padding-bottom: 24px;
}
.guest-num span{
	border-radius: 3px;
    line-height: normal;
    font-weight: 600;
    letter-spacing: 0;
    color: #ffffff;
    background-color: #e85244;
    border: #e85244;
    padding: 3px;
}
.slider:hover .flickity-prev-next-button.previous {
    transform: translateX(-50%)!important;
}
.slider:hover .flickity-prev-next-button.next {
    transform: translateX(50%)!important;
}
.flickity-prev-next-button svg{
	    width: 70%;
}
.flickity-button{
	opacity: .75;
    background-color: rgb(23 23 23);
    color: #ffffff;
    border-radius: 9999px;
   	width: 32px;
    height: 32px;
	min-height: 32px;
	top: calc(50% - 18px);
}
.flickity-prev-next-button.previous {
    left: 0%;
    transform: translateX(-50%);
}
.flickity-prev-next-button.next {
    right: 0%;
    transform: translateX(50%);
}
.product-images .image-tools,
.product-thumbnails.thumbnails.slider .flickity-button{
	display:none;
}
.product-thumbnails a {
	border-radius: 0.5rem;
}
.product-thumbnails .is-nav-selected a, .product-thumbnails a:hover {
    border-color: rgb(64 64 64);
    border-radius: 0.5rem;
}
.woocommerce-product-gallery__image img {
  	aspect-ratio: 16/10; /* Đặt tỷ lệ 16:9 */
	object-fit: contain;
    width: 100%; /* Ensure the image takes the full width of its container */
    height: auto;
	border-color: rgb(229 229 229);
    border-style: solid;
    border-width: 1px;
    box-sizing: border-box;
    border-radius: 1rem;
}
.product-thumbnails>.flickity-viewport>.flickity-slider>.col {
	width: 16.6%;
    max-width: 16.6%;
    -ms-flex-preferred-size: 16.6%;
    flex-basis: 16.6%;
}
 .row-small.product-thumbnails>.flickity-viewport>.flickity-slider>.col{
/* 	padding: unset; */
}
.product-thumbnails.small-columns-6>.flickity-viewport{
	height: 150px!important;
    max-height: 150px!important;
}
.product-thumbnails.small-columns-6>.flickity-viewport .attachment-woocommerce_thumbnail{
/* 	height: 130px; */
/*     max-height: 16.6%; */
}

.copt-my24 {
    margin-top: 24px;
    margin-bottom: 24px;
}
.copt-product-countdown .copt-product-countdown__block {
    font-size: 15px;
    line-height: normal;
    font-weight: 700;
    letter-spacing: 0;
    color: #e85244;
}
.copt-items-center {
    align-items: center;
}
.copt-flex {
    display: flex;
}
.copt-product-countdown .copt-product-countdown__icon {
    width: 16px;
    height: 16px;
    fill: #e85244;
}
.copt-mr5 {
    margin-right: 5px;
}
svg {
    overflow: hidden;
    vertical-align: middle;
}
.copt-product-countdown .copt-product-countdown__progress {
    line-height: 0;
}
.copt-my10 {
    margin-top: 10px;
    margin-bottom: 10px;
}

.copt-product-countdown .copt-product-countdown__progress progress[value] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    height: 6px;
    width: 100%;
/*     color: #e85244;
    background: #f2f2f2;
    border-radius: 0; */
    border: none;
}
.copt-product-countdown .copt-product-countdown__progress progress[value]::-webkit-progress-value {
    background: #e85244;
    box-shadow: inset 0 -1px 2px rgba(0,0,0,.1),inset 0 1px 2px rgba(255,255,255,.25);
    border-radius: 0 100px 100px 0
}

.copt-product-countdown .copt-product-countdown__progress progress[value]::-webkit-progress-bar {
    background-color: #f2f2f2;
    border-radius: 0 100px 100px 0
}

.copt-product-countdown .copt-product-countdown__progress progress[value]::-moz-progress-bar {
    background-color: #e85244;
    box-shadow: inset 0 -1px 2px rgba(0,0,0,.1),inset 0 1px 2px rgba(255,255,255,.25);
    border-radius: 0 100px 100px 0
}
.copt-relative {
    position: relative;
}

progress {
    vertical-align: baseline;
}
.stock.in-stock{
	display:none;
}
@media only screen and (min-width: 768px){
	.product .custom-product-page .z-product .col-inner .section {
    padding: 30px 0px;
}
	.product .custom-product-page .z-product .col-inner {
		display: block;
		padding: 0;
   		max-width: 1440px;
	  }
	.product .custom-product-page .z-product .col-inner .section{
		display: block !important; 
      	flex-flow: initial !important; 
      	align-items: initial !important; 
      	min-height: auto !important; /
		margin-bottom: 0;
		flex: none !important;
    	order: unset !important;
	
	}
	.ss-z {
    	width: calc(70% - 15px); 
/* 		min-width: calc(100% - 402px); */
  }
	.product .custom-product-page .z-product .col-inner .section.ss-l7 {    
   		 margin-right: 30px; 
  }
	  .ss-r3 {
  	 	 width: calc(30% - 15px);
/* 		 min-width: 387px; */
   		 margin-right: 0; 
  }
	@media only screen and (max-width: 1370px) {
		.ss-z {width: calc(100% - 448px);}
		.ss-r3 {width: 388px;}
	}

   .product .custom-product-page .z-product .col-inner::after {
       content: "";
       display: table;
       clear: both;
   }
}
@media only screen and (max-width: 48em) {
	.single-product .product-gallery-slider .flickity-slider{left:-10%!important;}
	.vertical-thumbnails, .single-product .product-thumbnails.thumbnails.slider {display: none;}
	.single-product .product-gallery-slider .flickity-slider>div{width:80%!important;background-color:#fff}
	.woocommerce-product-gallery__image img {
    border-radius: 1.6vw !important;
    border: 1px solid #00000014;
    width: 70vw;
    height: 60vw;
    object-fit: contain;
	}
	.product-col-15 {
        flex-flow: unset;
        overflow-x: auto;
    }

    .product-col-15 .col {
        min-width: 75% !important;
        padding: 0 0 10px 10px !important
    }
	
}




/* *** CUSTOM FIELDS - Always full width at top *** */
  form.cart .wapf,
  form.cart .wapf-wrapper,
  form.cart .wapf-field-group {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 20px 0 !important;
    padding: 0 !important;
    order: -1 !important;
  }
  
  .wapf-field-row {
    display: block !important;
    width: 100% !important;
    margin-bottom: 15px !important;
  }
  
  .wapf-field-container {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-bottom: 12px !important;
  }
  
  .wapf-field-label {
    display: block !important;
    margin-bottom: 8px !important;
    font-weight: 600 !important;
    color: #333 !important;
  }
  
  .wapf-field-input {
    display: block !important;
    width: 100% !important;
  }
  
  .wapf-field-input input {
    width: 100% !important;
    max-width: 100% !important;
    padding: 12px 15px !important;
    border: 1px solid #ddd !important;
    border-radius: 4px !important;
    font-size: 16px !important;
    background: white !important;
  }
  
  .wapf-field-description {
    display: block !important;
    margin-top: 6px !important;
    font-size: 16px !important;
    color: #1b1b1b !important;
    line-height: 1.4 !important;
  }
@media (max-width: 600px) {
  /* *** RESET ALL FORM STYLES *** */
  form.cart {
    display: block !important;
  }
  
  
  
  
  /* *** VARIATIONS - Always separate, full width *** */
  form.cart .variations,
  table.variations {
    display: block !important;
    width: 100% !important;
    margin: 0 0 15px 0 !important;
    border: none !important;
    background: transparent !important;
  }
  
  .variations tbody,
  .variations tr {
    display: block !important;
    width: 100% !important;
    margin-bottom: 12px !important;
  }
  
  .variations th,
  .variations td {
    display: block !important;
    width: 100% !important;
    padding: 4px 0 !important;
    border: none !important;
  }
  
  .variations .label {
    font-weight: 600 !important;
    margin-bottom: 8px !important;
    display: block !important;
  }
  
  .variations .value {
    display: block !important;
    width: 100% !important;
  }
  
  /* *** EXACT LAYOUT như hình 5 - Works for both simple & variable products *** */
  
  /* Container for quantity + buttons */
  form.cart .single_variation_wrap .woocommerce-variation-add-to-cart,
  form.cart:not(.variations_form):not(:has(.wapf)) {
    display: grid !important;
    grid-template-columns: 80px 1fr !important; /* Quantity 80px, buttons take rest */
    grid-template-rows: 1fr 1fr !important; /* 2 rows for 2 buttons */
    gap: 8px 12px !important;
    align-items: stretch !important;
    margin-top: 15px !important;
  }
  
  /* For simple products WITH custom fields - use flexbox layout */
/*   form.cart:has(.wapf) {
    display: flex !important;
    flex-direction: column !important;
  } */
  
  form.cart:has(.wapf) .wapf {
    order: 1 !important;
    margin-bottom: 20px !important;
  }
  
  form.cart:has(.wapf) .quantity {
    order: 2 !important;
    position: relative !important;
    float: left !important;
    width: 80px !important;
/*     height: 96px !important; */
    margin: 0 12px 0 0 !important;
  }
  
  form.cart:has(.wapf) .single_add_to_cart_button {
    order: 2 !important;
    width: calc(100% - 92px) !important;
    height: 48px !important;
    margin: 0 0 8px 0 !important;
    float: right !important;
  }
  
  form.cart:has(.wapf) .ux-buy-now-button {
    order: 3 !important;
    width: calc(100% - 92px) !important;
    height: 48px !important;
    margin: 0 !important;
    float: right !important;
    clear: right !important;
  }
  
  form.cart:has(.wapf)::after {
    content: '' !important;
    display: table !important;
    clear: both !important;
  }
  
  /* For simple products WITHOUT custom fields, apply grid directly to form */
  form.cart:not(.variations_form):not(:has(.wapf)) {
    margin-top: 0 !important;
  }
  
  /* *** QUANTITY - Grid position 1,1 spanning 2 rows *** */
  .ux-quantity.quantity {
    grid-column: 1 !important;
    grid-row: 1 / 3 !important; /* Span both rows (1 to 3) */
    margin: 0 !important;
    width: 80px !important;
    height: 100% !important;
    min-height: 96px !important; /* 48px * 2 rows + gap */
    display: flex !important;
    flex-direction: column !important;
    border: 1px solid #ddd !important;
    border-radius: 4px !important;
    overflow: hidden !important;
  }
  
  .ux-quantity.quantity .ux-quantity__button {
    flex: 1 !important;
    height: auto !important;
    min-height: auto !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: none !important;
    background: #f5f5f5 !important;
    cursor: pointer !important;
    font-size: 16px !important;
    color: #666 !important;
    font-weight: bold !important;
  }
  
  .ux-quantity.quantity .qty {
    flex: 1 !important;
    height: auto !important;
    min-height: auto !important;
    max-width: none !important;
    width: 100% !important;
    text-align: center !important;
    border: none !important;
    border-top: 1px solid #ddd !important;
    border-bottom: 1px solid #ddd !important;
    background: white !important;
    font-size: 16px !important;
    color: #333 !important;
    font-weight: 500 !important;
  }
  
  .ux-quantity.quantity .ux-quantity__button:hover {
    background: #e0e0e0 !important;
  }
  
  /* *** ADD TO CART BUTTON - Grid position 2,1 *** */
  .single_add_to_cart_button {
    grid-column: 2 !important;
    grid-row: 1 !important;
    margin: 0 !important;
    min-height: 44px !important;
    width: 100% !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    border-radius: 4px !important;
  }
  
  /* *** BUY NOW BUTTON - Grid position 2,2 *** */
  .ux-buy-now-button {
    grid-column: 2 !important;
    grid-row: 2 !important;
    margin: 0 !important;
    min-height: 44px !important;
    width: 100% !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    border-radius: 4px !important;
  }
  
  /* *** FALLBACK: If structure is different, use alternative approach *** */
  
  /* Alternative method 1: Direct targeting */
  .single_variation_wrap {
    display: block !important;
  }
  
  .woocommerce-variation-add-to-cart {
    display: grid !important;
    grid-template-columns: 80px 1fr !important;
    grid-template-rows: 1fr 1fr !important;
    gap: 8px 12px !important;
    align-items: stretch !important;
  }
  
  /* Alternative method 2: Force layout với flexbox nếu grid không work */
  .cart-buttons-container {
    display: flex !important;
    gap: 12px !important;
    align-items: flex-start !important;
  }
  
  .cart-buttons-container .quantity {
    flex: 0 0 80px !important;
    height: 96px !important;
  }
  
  .cart-buttons-container .buttons-group {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
  }
  
  .cart-buttons-container .buttons-group .single_add_to_cart_button,
  .cart-buttons-container .buttons-group .ux-buy-now-button {
    width: 100% !important;
    min-height: 44px !important;
  }
  
  /* *** ENSURE BUTTONS HAVE PROPER STYLING *** */
  .single_add_to_cart_button,
  .ux-buy-now-button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    line-height: 1.2 !important;
    padding: 12px 16px !important;
    box-sizing: border-box !important;
  }
}