/* Wolf Paint — adapter: biến màu của trang mẫu + phần nối Hello Elementor / Elementor / WooCommerce / CF7.
   CSS của trang mẫu nằm nguyên vẹn trong assets/css/ref/ (không sửa ở đó). */

/* 1. Biến màu (trang mẫu khai báo trong <style> ở <head>). */
:root {
	--main-color: #1f4b3f;
	--price-color: #1f4b3f;
	--second-color: #f05223;
	--main-text-color: #1b1b1b;
	--header-bg-color: #f4f5f7;
	--header-text-color: #1b1b1b;
	--text-header-color: #1b1b1b;
	--footer-bg-color: #081f18;
	--footer-text-color: #a0aab2;
	--footer-hover-color: #9ccc65;
	--color_tag_sale: #801608;
	--deal-border-color: #e5e7eb;
	--voucher-bg-color: #fffbf4;
	--voucher-border-color: #f1f3f5;
	--voucher-text-color: #0f172a;
	--collections-sales-bg-color: #fa5902;
	--collections-sales-title-bg-color: #f05223;
	--popup-color: #1f4b3f;
	--border-color: #E5E7EB;
	--slider-text-color: #1daa5a;
	--flash-bg-color: #204b3f;
	--flash-border-color: #204b3f;
	--flash-text-color: #ffffff;
	--topbar-bg-color: #1f4b3f;
	--topbar-bg-text: #e5b367;
}

/* 2. Elementor: khoảng cách mặc định của widget/container = 0 để markup dựng bằng builder đo giống trang mẫu. */
.elementor .elementor-element{--widgets-spacing:0px;--widgets-spacing-row:0px;--widgets-spacing-column:0px;--container-default-padding-top:0px;--container-default-padding-right:0px;--container-default-padding-bottom:0px;--container-default-padding-left:0px}
.elementor-widget-heading .elementor-heading-title{font-size:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;text-transform:inherit;text-wrap:inherit}
.elementor-widget-heading :is(span,div,p).elementor-heading-title{font-family:inherit;font-weight:inherit}

/* 3. Contact Form 7 trong markup Bootstrap của trang mẫu. */
.wpcf7-form-control-wrap{display:block}
.wpcf7-spinner{position:absolute;margin:0}
.wpcf7-not-valid-tip{font-size:12px;font-weight:500;margin-top:4px}
textarea.wpcf7-textarea{display:block}
.wpcf7 form .wpcf7-response-output{margin:12px 0 0;padding:8px 12px;border-radius:8px;font-size:14px}
.input-group-custom .wpcf7-form-control-wrap{flex:1 1 auto;width:100%}
.check-box-btn .wpcf7-list-item,
.wpcf7-checkbox .wpcf7-list-item{margin:0}
.wolf-cf7-form .wpcf7-acceptance .wpcf7-list-item{margin:0}
.wolf-cf7-form .wpcf7-acceptance label{display:flex;gap:.5rem;align-items:flex-start;cursor:pointer}
.wolf-cf7-form .wpcf7-acceptance .wpcf7-list-item-label{color:var(--bs-secondary-color);font-size:.875em}
/* Ô "Bạn quan tâm đến" của popup: checkbox CF7 hiện như nút .check-box-btn của trang mẫu. */
.wolf-modal-consult .checkbox-group .wpcf7-checkbox{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}
@media (max-width:767.98px){.wolf-modal-consult .checkbox-group .wpcf7-checkbox{grid-template-columns:repeat(2,1fr)}}
.wolf-modal-consult .checkbox-group .wpcf7-list-item label{display:block;width:100%;cursor:pointer;margin:0}
.wolf-modal-consult .checkbox-group .wpcf7-list-item input[type="checkbox"]{display:none}
.wolf-modal-consult .checkbox-group .wpcf7-list-item-label{display:block;width:100%;padding:10px;text-align:center;border:1px solid #dee2e6;border-radius:6px;font-size:13px;color:#495057;transition:all .2s ease}
.wolf-modal-consult .checkbox-group .wpcf7-list-item-label::before{content:"";display:inline-block;width:14px;height:14px;border:1px solid #adb5bd;border-radius:50%;margin-right:8px;vertical-align:middle;transition:all .2s ease}
.wolf-modal-consult .checkbox-group input[type="checkbox"]:checked+.wpcf7-list-item-label{border-color:var(--modal-text-green);color:var(--modal-text-green);font-weight:600;background-color:#f4f8f5}
.wolf-modal-consult .checkbox-group input[type="checkbox"]:checked+.wpcf7-list-item-label::before{background-color:var(--modal-text-green);border-color:var(--modal-text-green);box-shadow:inset 0 0 0 2px #f4f8f5}
.wolf-consent input[type="checkbox"]{width:1em;height:1em;margin-top:.25em;flex-shrink:0;cursor:pointer;accent-color:var(--modal-text-green,var(--main-color))}
.btn-submit-consult .wpcf7-spinner,
.btn-submit-contact .wpcf7-spinner{display:none}

/* 4. WordPress / Hello. */
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute!important;width:1px;word-wrap:normal!important}
.wolf-sprite{position:absolute;width:0;height:0;overflow:hidden}
.logo-wrapper .custom-logo,
.logo-wrapper img{height:auto}
.topbar-tiny-text{font-size:.75rem}
.btn-consult-text{font-size:15px}
.smart-search-hint{font-size:13px}
.modal-lead{font-size:15px}
.wp-site-blocks,.site-main{max-width:none}

/* 5. Footer: phương thức thanh toán bằng chữ (không dùng logo ví của trang mẫu). */
.pay-icon.pay-text{width:auto;min-width:45px;padding:0 8px;background:#fff;color:var(--main-color);font-size:11px;font-weight:700;line-height:1;white-space:nowrap}
.footer-menu .menu-item a{text-decoration:none}

/* 6. Thanh admin WordPress không đè menu/header dính. */
.admin-bar .smart-search-wrapper{scroll-margin-top:32px}

/* 7. Trang dựng bằng Elementor theo markup Bootstrap của trang mẫu (container mang class .row/.col/.card…).
   Container Elementor về hành vi của thẻ div thường; Bootstrap + CSS trang mẫu (nạp sau frontend.css) lo phần còn lại. */
.elementor .e-con.e-con.e-con{--display:block;--flex-direction:row;--flex-wrap:nowrap;--align-items:normal;--align-content:normal;--justify-content:normal;--width:auto;--flex-grow:0;--flex-shrink:1;--flex-basis:auto;--position:static}
.elementor .e-con.e-con.e-con.card{--flex-direction:column}
.elementor .e-con.e-con.e-con.card-body{--flex-grow:1}
.elementor .e-con.row>.e-con.e-con.e-con{--flex-shrink:0}
.elementor a.e-con{color:inherit}
/* Widget: không thêm khoảng cách, chữ/màu theo class Bootstrap trên widget. */
.elementor .elementor-element.elementor-widget-heading .elementor-heading-title.elementor-heading-title{margin:0;font-family:inherit;font-weight:inherit;font-size:inherit;line-height:inherit;color:inherit;letter-spacing:inherit;text-transform:inherit}
.elementor .elementor-widget-heading:has(:is(h1,h2,h3,h4,h5,h6).elementor-heading-title){font-weight:500;line-height:1.2;color:var(--bs-heading-color)}
.elementor .elementor-widget-heading:has(h1.elementor-heading-title){font-size:calc(1.375rem + 1.5vw)}
.elementor .elementor-widget-heading:has(h2.elementor-heading-title){font-size:calc(1.325rem + .9vw)}
.elementor .elementor-widget-heading:has(h3.elementor-heading-title){font-size:calc(1.3rem + .6vw)}
@media (min-width:1200px){
	.elementor .elementor-widget-heading:has(h1.elementor-heading-title){font-size:2.5rem}
	.elementor .elementor-widget-heading:has(h2.elementor-heading-title){font-size:2rem}
	.elementor .elementor-widget-heading:has(h3.elementor-heading-title){font-size:1.75rem}
}
.elementor .elementor-widget-heading .elementor-heading-title a{color:inherit;text-decoration:none}
.elementor .elementor-widget-text-editor.elementor-widget-text-editor{font-family:inherit;font-weight:inherit;color:inherit}
.wolf-color-collection .color-info-wrapper .elementor-element.elementor-element{color:#000!important}
.elementor-widget-text-editor p{margin-bottom:1rem}
.elementor-widget-text-editor p:last-child{margin-bottom:0}
.elementor-widget-text-editor.line-clamp-2{display:block}
.elementor-widget-text-editor.line-clamp-2 p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.wolf-title-article .elementor-heading-title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* Ảnh: class của thẻ <img> trang mẫu nằm trên widget → chuyển xuống ảnh. */
.elementor .elementor-widget-image{text-align:inherit}
.elementor .elementor-widget-image img{display:block}
.elementor .elementor-widget-image a{display:block}
.elementor .elementor-widget-image:is(.w-100,.img-fluid.w-100) img{width:100%!important}
.elementor .elementor-widget-image.h-100 :is(a,img){height:100%!important}
.elementor .elementor-widget-image.h-100 .elementor-widget-container{height:100%}
.elementor .elementor-widget-image.object-fit-cover img{object-fit:cover!important}
.elementor .elementor-widget-image.object-fit-contain img{object-fit:contain!important}
.elementor .elementor-widget-image.rounded-circle img{border-radius:50%!important}
.elementor .elementor-widget-image.rounded-3 img{border-radius:var(--bs-border-radius-lg)!important}
.elementor .elementor-widget-image.wimg-20 img{width:20px;height:20px}
.elementor .elementor-widget-image.wimg-25 img{width:25px;height:25px}
.wolf-news-module .elementor-widget-image.wolf-small-article-img img{width:100%!important;height:100%!important}
.wolf-paint-calculator .elementor-widget-image.img-paint-bucket{height:auto;opacity:.15}
.wolf-paint-calculator .elementor-widget-image.img-paint-bucket img{height:80px;width:auto}
/* Nút/link: class của thẻ <a> trang mẫu nằm trên widget (.wbtn); thẻ <a> của Elementor phủ kín widget. */
.elementor .elementor-element.wbtn .elementor-button.elementor-button{background:none;border:0;border-radius:0;padding:0;margin:0;font:inherit;color:inherit;line-height:inherit;letter-spacing:inherit;text-transform:inherit;fill:currentColor;transition:none;position:static}
.elementor .wbtn .elementor-button-content-wrapper{gap:0}
.wbtn .elementor-button::before{content:"";position:absolute;inset:0;z-index:1}
.wbtn.btn,.wbtn.btn-calc{cursor:pointer}
/* Icon nhỏ của trang mẫu (svg nội tuyến) → pseudo-element. */
.wlink-arrow::after,.wlink-file::before,.wdate::before,.action-btn::after{content:"";flex-shrink:0;display:inline-block;background-color:currentColor;-webkit-mask:var(--wicon) center/contain no-repeat;mask:var(--wicon) center/contain no-repeat}
.wlink-arrow,.action-btn{--wicon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h14'/%3E%3Cpath d='M14 6l6 6-6 6'/%3E%3C/svg%3E")}
.wlink-arrow::after,.action-btn::after{width:16px;height:16px}
.wlink-arrow.wlink-arrow-18::after{width:18px;height:18px}
.wlink-file{--wicon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/%3E%3Cpolyline points='14 2 14 8 20 8'/%3E%3Cline x1='16' y1='13' x2='8' y2='13'/%3E%3Cline x1='16' y1='17' x2='8' y2='17'/%3E%3Cpolyline points='10 9 9 9 8 9'/%3E%3C/svg%3E")}
.wlink-file::before{width:20px;height:20px}
.wdate{--wicon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'/%3E%3Cline x1='16' y1='2' x2='16' y2='6'/%3E%3Cline x1='8' y1='2' x2='8' y2='6'/%3E%3Cline x1='3' y1='10' x2='21' y2='10'/%3E%3C/svg%3E")}
.wdate-15::before{width:15px;height:15px}
.wdate-13::before{width:13px;height:13px}
.wolf-paint-calculator .wlink-file::before{background-color:currentColor}
/* Vòng tròn mũi tên "Xem tất cả" (.view-all-icon của trang mẫu). */
.wlink-view-all::after{content:"";flex-shrink:0;width:32px;height:32px;border-radius:50%;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f4b3f' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h14'/%3E%3Cpath d='M14 6l6 6-6 6'/%3E%3C/svg%3E") center/14px no-repeat;border:1px solid var(--bs-border-color);box-shadow:0 .125rem .25rem rgba(0,0,0,.075);transition:transform .3s ease,background-color .3s ease}
.wlink-view-all:hover::after{background-color:var(--main-color);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h14'/%3E%3Cpath d='M14 6l6 6-6 6'/%3E%3C/svg%3E");transform:translateX(4px)}
.wolf-space-selector .hover-main-color:hover,.wolf-color-collection .hover-main-color:hover{color:var(--main-color)!important}
/* Máy tính lượng sơn: ô số hiển thị như input của trang mẫu. */
.wolf-paint-calculator .calc-controls .calc-input{display:flex;align-items:center;justify-content:center;flex:1 1 auto;width:auto;font-size:1rem;line-height:1.5}
.wolf-paint-calculator .btn-calc{flex-shrink:0;user-select:none}
/* Lưới sản phẩm WooCommerce ([products]) trong markup trang mẫu. */
.elementor-widget-shortcode .woocommerce::before,.elementor-widget-shortcode .woocommerce::after{content:none}
.added_to_cart{display:none!important}
.add-to-cart-btn.loading{opacity:.6;pointer-events:none}
