@font-face {
	font-weight: normal;
	font-style: normal;
	font-family: "woodmart-font";
	src: url("//prin7.com/wp-content/themes/woodmart/fonts/woodmart-font-3-400.woff2?v=8.3.8") format("woff2");
}

:root {
	--wd-text-font: "Cabin", Arial, Helvetica, sans-serif;
	--wd-text-font-weight: 400;
	--wd-text-color: rgb(55,65,81);
	--wd-text-font-size: 16px;
	--wd-title-font: "Geologica", Arial, Helvetica, sans-serif;
	--wd-title-font-weight: 500;
	--wd-title-color: #111827;
	--wd-entities-title-font: "Geologica", Arial, Helvetica, sans-serif;
	--wd-entities-title-font-weight: 500;
	--wd-entities-title-color: rgb(17,24,39);
	--wd-entities-title-color-hover: rgb(55, 65, 81);
	--wd-alternative-font: "Lato", Arial, Helvetica, sans-serif;
	--wd-widget-title-font: "Geologica", Arial, Helvetica, sans-serif;
	--wd-widget-title-font-weight: 500;
	--wd-widget-title-transform: none;
	--wd-widget-title-color: rgb(17,24,39);
	--wd-widget-title-font-size: 16px;
	--wd-header-el-font: "Geologica", Arial, Helvetica, sans-serif;
	--wd-header-el-font-weight: 500;
	--wd-header-el-transform: capitalize;
	--wd-header-el-font-size: 18px;
	--wd-brd-radius: 20px;
	--wd-otl-style: dotted;
	--wd-otl-width: 2px;
	--wd-primary-color: rgb(226,76,76);
	--wd-alternative-color: #fbbc34;
	--btn-default-bgcolor: rgb(226,76,76);
	--btn-default-bgcolor-hover: rgb(200,56,56);
	--btn-accented-bgcolor: rgb(17,24,39);
	--btn-accented-bgcolor-hover: rgb(0,0,38);
	--btn-font-family: "Geologica", Arial, Helvetica, sans-serif;
	--btn-font-weight: 500;
	--btn-transform: capitalize;
	--btn-color: rgb(255,255,255);
	--btn-bgcolor: rgb(226,76,76);
	--btn-bgcolor-hover: rgb(200,56,56);
	--wd-form-brd-width: 2px;
	--notices-success-bg: rgb(236,253,245);
	--notices-success-color: rgb(6,95,70);
	--notices-warning-bg: rgb(254,242,242);
	--notices-warning-color: rgb(153,27,27);
	--wd-link-color: rgb(17,24,39);
	--wd-link-color-hover: rgb(226,76,76);
}
.wd-age-verify-wrap {
	--wd-popup-width: 500px;
}
.wd-popup.wd-promo-popup {
	background-color: rgb(255,255,255);
	background-image: none;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: left center;
}
.wd-promo-popup-wrap {
	--wd-popup-width: 800px;
}
:is(.woodmart-woocommerce-layered-nav, .wd-product-category-filter) .wd-scroll-content {
	max-height: 223px;
}
.wd-page-title .wd-page-title-bg img {
	object-fit: cover;
	object-position: center top;
}
.wd-footer {
	background-color: rgb(0,0,0);
	background-image: none;
}
html .page-title > .container > .title, html .page-title .wd-title-wrapp > .title {
	font-size: 28px;
}
html table th {
	text-transform: none;
}
.wd-checkout-steps li {
	text-transform: none;
}
html .wd-nav-mobile > li > a, html .wd-nav-mobile .wd-sub-menu li a {
	text-transform: capitalize;
}
.term-description {
	font-family: "Cabin", Arial, Helvetica, sans-serif;
	font-size: 20px;
	color: rgba(255,255,255,0.8);
}
html .wd-page-content .wd-product .product-wrapper .wd-entities-title {
	font-family: "Geologica", Arial, Helvetica, sans-serif;
	font-weight: 500;
	font-size: 24px;
	color: rgb(255,255,255);
}
html .wd-page-content .wd-product .product-wrapper .wd-entities-title a:hover {
	color: rgb(255,255,255);
}
.page .wd-page-content {
	background-color: rgb(243,244,246);
	background-image: none;
}
.woodmart-archive-shop:not(.single-product) .wd-page-content {
	background-color: rgb(243,244,246);
	background-image: none;
}
.single-product .wd-page-content {
	background-color: rgb(243,244,246);
	background-image: none;
}
.woodmart-archive-blog .wd-page-content {
	background-color: rgb(243,244,246);
	background-image: none;
}
.single-post .wd-page-content {
	background-color: rgb(243,244,246);
	background-image: none;
}
.woodmart-archive-portfolio .wd-page-content {
	background-color: rgb(243,244,246);
	background-image: none;
}
.single-portfolio .wd-page-content {
	background-color: rgb(243,244,246);
	background-image: none;
}
html .wd-buy-now-btn {
	color: rgb(255,255,255);
	background: rgb(51,51,51);
}
html .wd-buy-now-btn:hover {
	color: rgb(255,255,255);
	background: rgb(36,36,36);
}
body, [class*=color-scheme-light], [class*=color-scheme-dark], .wd-search-form[class*="wd-header-search-form"] form.searchform, .wd-el-search .searchform {
	--wd-form-color: rgb(55,65,81);
	--wd-form-brd-color: rgb(229,231,235);
	--wd-form-brd-color-focus: rgb(17,24,39);
	--wd-form-bg: F3F4F6;
}
.wd-nav-arrows.wd-pos-sep:not(:where(.wd-custom-style)) {
	--wd-arrow-size: 59px;
	--wd-arrow-icon-size: 28px;
	--wd-arrow-offset-h: 15px;
	--wd-arrow-color: rgb(255,255,255);
	--wd-arrow-color-hover: rgb(255,255,255);
	--wd-arrow-color-dis: rgb(227,227,227);
	--wd-arrow-bg: rgb(226,76,76);
	--wd-arrow-bg-hover: rgb(226,76,76);
	--wd-arrow-bg-dis: rgb(247,247,247);
	--wd-arrow-radius: 50px;
	--wd-arrow-shadow: 0px 0px 32px 0px rgba(0,0,0,0.05);
}
.wd-nav-arrows.wd-pos-together:not(:where(.wd-custom-style)) {
	--wd-arrow-gap: 20px;
	--wd-arrow-size: 50px;
	--wd-arrow-icon-size: 20px;
	--wd-arrow-offset-h: 0px;
	--wd-arrow-offset-v: 15px;
	--wd-arrow-color: rgb(255,255,255);
	--wd-arrow-color-hover: rgb(255,255,255);
	--wd-arrow-color-dis: rgb(206,206,206);
	--wd-arrow-bg: rgb(226,97,97);
	--wd-arrow-bg-hover: rgb(226,76,76);
	--wd-arrow-bg-dis: rgb(255,255,255);
	--wd-arrow-radius: 25px;
	--wd-arrow-shadow: 0px 0px 32px 0px rgba(0,0,0,0.05);
}
.wd-nav-scroll {
	--wd-nscroll-width: 45%;
	--wd-nscroll-drag-bg: rgb(226,76,76);
	--wd-nscroll-drag-bg-hover: rgb(226,97,97);
}
.product-labels .product-label.onsale {
	background-color: rgb(255,255,255);
	color: rgb(51,51,51);
}
.product-labels .product-label.new {
	background-color: rgb(255,255,255);
	color: rgb(51,51,51);
}
.product-labels .product-label.featured {
	background-color: rgb(226,76,76);
	color: rgb(255,255,255);
}
.product-labels .product-label.out-of-stock {
	background-color: rgb(255,255,255);
	color: rgb(51,51,51);
}
.product-labels .product-label.attribute-label:not(.label-with-img) {
	background-color: rgb(221,51,51);
	color: rgb(255,255,255);
}
.mfp-wrap.wd-popup-quick-view-wrap {
	--wd-popup-width: 920px;
}
.woocommerce-product-gallery.thumbs-position-left {
	--wd-thumbs-width: 100px;
}

@media (max-width: 1024px) {
	html .page-title > .container > .title, html .page-title .wd-title-wrapp > .title {
		font-size: 24px;
	}
	html .wd-page-content .wd-product .product-wrapper .wd-entities-title {
		font-size: 20px;
	}
	.wd-nav-arrows.wd-pos-sep:not(:where(.wd-custom-style)) {
		--wd-arrow-offset-h: -50px;
	}

}

@media (max-width: 768.98px) {
	.term-description {
		font-size: 16px;
	}
	html .wd-page-content .wd-product .product-wrapper .wd-entities-title {
		font-size: 18px;
	}
	.wd-nav-arrows.wd-pos-sep:not(:where(.wd-custom-style)) {
		--wd-arrow-offset-h: 60px;
	}
	.wd-nav-arrows.wd-pos-together:not(:where(.wd-custom-style)) {
		--wd-arrow-size: 40px;
	--wd-arrow-icon-size: 14px;
	}

}
:root{
--wd-container-w: 1450px;
--wd-form-brd-radius: 5px;
--btn-default-color: #fff;
--btn-default-color-hover: #fff;
--btn-accented-color: #fff;
--btn-accented-color-hover: #fff;
--btn-default-brd-radius: 35px;
--btn-default-box-shadow: none;
--btn-default-box-shadow-hover: none;
--btn-accented-brd-radius: 35px;
--btn-accented-box-shadow: none;
--btn-accented-box-shadow-hover: none;
}

@media (min-width: 1450px) {
section.elementor-section.wd-section-stretch > .elementor-container {
margin-left: auto;
margin-right: auto;
}
}


.wd-page-title {
background-color: rgb(255,255,255);
}

@font-face {
	font-family: "Geologica";
	src: url("//prin7.com/wp-content/uploads/2024/03/Geologica_Auto-Medium.woff2") format("woff2"), 
url("//prin7.com/wp-content/uploads/2024/03/Geologica_Auto-Medium.woff") format("woff");
	font-weight: 500;
	font-display:swap;
	font-style: normal;
}

/* =========================================
   1. CONFIG: Design System (Variables)
   ========================================= */
:root {
    --cnf-gap: 15px;
    --cnf-radius-card: 20px;
    --cnf-radius-input: 12px;
    --cnf-bg-btn: #F3F4F6;       
    --cnf-border-def: #E5E7EB;   
    --cnf-border-hover: #b2b7c1; 
    --cnf-border-active: #111827;
    --cnf-text-main: #111827;
    --cnf-text-sec: #374151;
    --cnf-text-label: #9CA3AF;
    --cnf-text-disabled: #4B5563;
    --cnf-transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

/* =========================================
   2. GLOBAL RESET (Fixing Plugin Styles)
   ========================================= */
.wapf-wrapper {
    margin: 0 !important;
}

/* =========================================
   2. GLOBAL RESET (Fixing Plugin Styles)
   ========================================= */
.cnf-inputs-row.wapf-section,
.cnf-qty-section.wapf-section,
.cnf-upload-section.wapf-section,
.cnf-inputs-row .wapf-field-container,
.cnf-qty-section .wapf-field-container,
.cnf-upload-section .wapf-field-container,
.cnf-main-card .wapf-field-container,
.cnf-leave-comment.wapf-field-container,
.cnf-final-card .wapf-field-container, 
.cnf-final-card .wapf-field-input {    
    padding: 0 !important;
    width: 100% !important; 
    max-width: 100% !important;
    min-width: 0 !important;
}

.cnf-final-card.wapf-section {
     width: 100% !important;
     box-sizing: border-box !important;
}

/* Скрываем заголовки полей */
.cnf-input-number > .wapf-field-label,
.cnf-measurement-glider .wapf-field-label,
.cnf-qty-swatches > .wapf-field-label,
.cnf-file-upload > .wapf-field-label,
.cnf-price-amount > .wapf-field-label,
.cnf-spec-per > .wapf-field-label,
.cnf-spec-pcs > .wapf-field-label,
.cnf-spec-discount > .wapf-field-label,
.cnf-legal-text > .wapf-field-label { 
    display: none !important; 
}

/* =========================================
   3. COMPONENT: Main Card
   ========================================= */
.cnf-main-card {
    background: white;
    border-radius: var(--cnf-radius-card);
    padding: 20px;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.03), 0 12px 24px -6px rgba(0, 0, 0, 0.06);
    border-top: 1px solid rgba(255, 255, 255, 0.8);
    margin-bottom: var(--cnf-gap);
    display: flex;
    flex-direction: column;
}

.cnf-card-title, 
.cnf-card-title h3 {
    color: var(--cnf-text-main);
    font-size: 18px;
    font-weight: 600;
    margin: 0;
    padding: 0;
    line-height: 1.2;
}

/* =========================================
   4. LAYOUT: Inputs Grid (Mobile Fixed & Stretched)
   ========================================= */
.cnf-inputs-row {
    display: grid !important; 
    /* Десктоп: 3 ровные колонки */
    grid-template-columns: repeat(3, 1fr); 
    gap: var(--cnf-gap);
    align-items: end; /* На ПК прижимаем к низу */
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    height: auto !important; 
}

/* Разрешаем ячейкам сжиматься */
.cnf-inputs-row > div {
    min-width: 0 !important; 
    width: 100% !important;
}

/* ПЛАНШЕТЫ (до 900px): 2 колонки */
@media (max-width: 900px) {
    .cnf-inputs-row {
        grid-template-columns: 1fr 1fr !important; 
        gap: 15px !important;
    }
    .cnf-measurement-glider {
        grid-column: 1 / -1 !important; 
        margin-top: 5px;
    }
}

/* МОБИЛЬНЫЕ (до 600px): FLEXBOX */
@media (max-width: 600px) {
    .cnf-inputs-row {
        display: flex !important; /* Выключаем Grid */
        flex-direction: column !important; /* Строго вертикально */
        align-items: stretch !important; /* ФИКС: Растягиваем на всю ширину! */
        gap: 15px !important;
        height: auto !important;
        padding-bottom: 5px !important;
    }

    /* Сбрасываем Grid настройки */
    .cnf-inputs-row > div,
    .cnf-measurement-glider {
        width: 100% !important;
        grid-column: auto !important;
        margin: 0 !important;
    }
    
    .cnf-measurement-glider {
        order: 3;
        margin-top: 5px !important; /* Отступ сверху для красоты */
    }
}

/* =========================================
   5. COMPONENT: Number Input (Fixed Logic)
   ========================================= */
.cnf-inputs-row .cnf-input-number {
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important; 
    width: 100% !important;
    height: 45px !important;
    background: #FFFFFF !important;
    border: 2px solid var(--cnf-border-def) !important; 
    border-radius: var(--cnf-radius-input) !important;
    overflow: hidden; 
    box-sizing: border-box !important;
    transition: var(--cnf-transition);
    padding: 0 !important;
    /* Фикс от исчезновения на iOS */
    position: relative;
    z-index: 1;
}

.cnf-inputs-row .cnf-input-number:hover {
    border-color: var(--cnf-border-hover) !important;
}

.cnf-inputs-row .cnf-input-number:focus-within {
    border-color: var(--cnf-border-active) !important;
    background: #FFFFFF !important;
}

/* --- ЛЕВАЯ ЧАСТЬ --- */
.cnf-inputs-row .cnf-input-number .wapf-field-label {
    display: flex !important; 
    align-items: center;
    justify-content: center;
    background-color: var(--cnf-bg-btn) !important;
    border-right: 2px solid var(--cnf-border-def) !important;
    padding: 0 15px !important; /* Чуть меньше отступ для безопасности */
    margin: 0 !important;
    height: auto !important; 
    flex-shrink: 0; /* Не сжимать лейбл */
    width: auto !important;
}

.cnf-inputs-row .cnf-input-number .wapf-field-label label {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    cursor: default;
    color: var(--cnf-text-sec); 
}

/* --- ПРАВАЯ ЧАСТЬ --- */
.cnf-inputs-row .cnf-input-number .wapf-field-input {
    flex-grow: 1;
    flex-shrink: 1;
    min-width: 0 !important; /* КРИТИЧНО */
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    height: 100% !important;
    position: relative;
    display: flex !important;
}

.cnf-inputs-row .cnf-input-number .wapf-field-input > div {
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    align-items: center;
}

.cnf-inputs-row .cnf-input-number input.wapf-input[type="number"] {
    width: 100% !important;
    height: 100% !important;
    border: none !important; 
    background: transparent !important;
    border-radius: 0 !important;
    padding: 0 15px !important;
    margin: 0 !important;
    box-shadow: none !important;
    outline: none !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    color: var(--cnf-text-main) !important;
    -moz-appearance: textfield;
    cursor: text;
}

.cnf-input-number input.wapf-input[type="number"]::-webkit-inner-spin-button, 
.cnf-input-number input.wapf-input[type="number"]::-webkit-outer-spin-button { 
    -webkit-appearance: none; 
    margin: 0; 
}

/* ЦВЕТА */
.cnf-inputs-row .field-fe6f755 .wapf-field-label label { color: #ea580c !important; }
.cnf-inputs-row .field-4001e44 .wapf-field-label label { color: #be123c !important; }

/* =========================================
   6. COMPONENT: Glider Switch (Measurement)
   ========================================= */
.cnf-inputs-row .cnf-measurement-glider > .wapf-field-label { display: none !important; }

/* Трек */
.cnf-inputs-row .cnf-measurement-glider .wapf-swatch-wrapper {
    display: flex !important;
    flex-wrap: nowrap !important;
    position: relative;
    height: 45px !important;
    background-color: var(--cnf-bg-btn) !important;
    border-radius: 8px;
    padding: 4px !important;
    box-sizing: border-box !important;
    border: none !important;
    gap: 0 !important;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.02);
    width: 100% !important; /* На всю ширину родителя */
}

/* Белая плашка */
.cnf-inputs-row .cnf-measurement-glider .wapf-swatch-wrapper::before {
    content: "";
    position: absolute;
    top: 4px;
    left: 4px;
    bottom: 4px;
    width: calc(50% - 4px); 
    background-color: #FFFFFF;
    border-radius: 6px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    transition: transform 0.3s cubic-bezier(0.4, 0.0, 0.2, 1);
    z-index: 1;
    pointer-events: none;
}

/* Движение */
.cnf-inputs-row .cnf-measurement-glider .wapf-swatch-wrapper:has(.wapf-swatch:last-child.wapf-checked)::before {
    transform: translateX(100%);
}

/* Кнопки */
.cnf-inputs-row .cnf-measurement-glider .wapf-swatch {
    flex: 1; /* Растягиваем 50/50 */
    z-index: 2;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    margin: 0 !important;
    padding: 0 !important;
    height: 100%;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important; /* Центруем контент */
    text-align: center !important;
    min-width: 0 !important;
}

/* Текст */
.cnf-inputs-row .cnf-measurement-glider .wapf-swatch label {
    width: 100%;
    height: 100%;
    margin: 0 !important;
    padding: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 14px;
    color: #6B7280;
    line-height: 1;
    transition: color 0.2s;
    cursor: pointer;
    white-space: nowrap !important; /* Запрещаем перенос слов */
}

/* Фикс шрифта для узких экранов */
@media (max-width: 400px) {
    .cnf-inputs-row .cnf-measurement-glider .wapf-swatch label {
        font-size: 14px !important;
    }
}

.cnf-inputs-row .cnf-measurement-glider .wapf-swatch.wapf-checked label {
    color: var(--cnf-text-main);
}
.cnf-measurement-glider .wapf-swatch input {
    position: absolute; opacity: 0; pointer-events: none;
}

/* =========================================
   7. LAYOUT: Quantity Section
   ========================================= */
.cnf-qty-section {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
}

/* =========================================
   8. COMPONENT: Quantity Swatches (Grid 3 cols)
   ========================================= */

/* Настройка сетки (Десктоп) */
.cnf-qty-swatches .wapf-swatch-wrapper {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr); 
    gap: 10px !important; 
    margin: 0 !important;
}

/* АДАПТИВ */
@media (max-width: 600px) {
    /* 1. Переключаемся на 2 колонки */
    .cnf-qty-swatches .wapf-swatch-wrapper {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    /* 2. ИСПРАВЛЕННЫЙ МАГИЧЕСКИЙ СЕЛЕКТОР:
       Из-за скрытого input, 1-я кнопка = 2-й элемент.
       Значит, если кнопок 9 (нечетное кол-во), последняя кнопка — это 10-й элемент (EVEN).
       Растягиваем её на 2 колонки. */
    .cnf-qty-swatches .wapf-swatch:last-child:nth-child(even) {
        grid-column: span 2 !important;
    }

    /* 3. Увеличиваем высоту для мобильных */
    .cnf-qty-swatches .wapf-swatch {
        min-height: 70px !important; 
    }

    /* 4. Этажерка (Текст сверху, Цена снизу) */
    .cnf-qty-swatches .wapf-swatch label > span {
        flex-direction: column !important; 
        justify-content: center !important;
        gap: 6px !important;
        text-align: center !important;
    }

    /* 5. Цена */
    .cnf-qty-swatches .wapf-pricing-hint {
        width: 100% !important; 
        max-width: 90%; 
        font-size: 12px !important;
        padding: 3px 6px !important;
    }
}

/* --- ОБЩИЕ СТИЛИ (ОСТАЮТСЯ КАК БЫЛИ) --- */
.cnf-qty-swatches .wapf-swatch {
    background: #F3F4F6 !important; 
    border: 2px solid var(--cnf-border-def) !important;
    border-radius: var(--cnf-radius-input) !important;
    margin: 0 !important;
    padding: 0 !important;
    min-height: 54px; 
    display: flex !important;
    align-items: center;
    justify-content: center;
    transition: var(--cnf-transition);
    position: relative;
    overflow: hidden;
    user-select: none !important;
    -webkit-user-select: none !important;
}

.cnf-qty-swatches .wapf-swatch:hover {
    border-color: var(--cnf-border-hover) !important;
    background: #E5E7EB !important;
}

.cnf-qty-swatches .wapf-swatch.wapf-checked {
    border-color: var(--cnf-border-active) !important;
    background: #FFFFFF !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05) !important;
}

.cnf-qty-swatches .wapf-swatch label {
    width: 100%;
    height: 100%;
    margin: 0 !important;
    padding: 8px 12px !important;
    cursor: pointer;
    display: flex !important;
    align-items: center;
    justify-content: center;
}

.cnf-qty-swatches .wapf-swatch label > span {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center;
    width: 100%;
    font-size: 16px !important;
    font-weight: 700 !important;
    color: var(--cnf-text-main);
}

.cnf-qty-swatches .wapf-pricing-hint {
    font-weight: 600;
    color: var(--cnf-text-main);
    background: #FFFFFF; 
    padding: 4px 8px;
    border-radius: 6px;
    font-size: 13px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.04);
    border: 1px solid rgba(0,0,0,0.02);
    min-width: 60px;
    text-align: center;
}

.cnf-qty-swatches .wapf-swatch.wapf-checked .wapf-pricing-hint {
    background: var(--cnf-text-main);
    color: #FFFFFF;
    border-color: transparent;
}

/* =========================================
   9. COMPONENT: Custom Quantity
   ========================================= */
.cnf-qty-custom {
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important;
    width: 100% !important;
    height: 50px !important;
    background: #FFFFFF !important;
    border: 2px solid var(--cnf-border-def) !important;
    border-radius: var(--cnf-radius-input) !important;
    overflow: hidden;
    box-sizing: border-box !important;
    transition: var(--cnf-transition);
    margin-top: 5px !important;
}

.cnf-qty-custom:hover { border-color: var(--cnf-border-hover) !important; }
.cnf-qty-custom:focus-within { border-color: var(--cnf-border-active) !important; }

.cnf-qty-custom .wapf-field-label {
    display: flex !important;
    align-items: center;
    justify-content: center;
    background-color: var(--cnf-bg-btn) !important;
    border-right: 2px solid var(--cnf-border-def) !important;
    padding: 0 20px !important;
    margin: 0 !important;
    height: auto !important;
    flex-shrink: 0;
    z-index: 2;
}

.cnf-qty-custom .wapf-field-label label {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    color: var(--cnf-text-sec); 
    cursor: default;
}

.cnf-qty-custom .wapf-field-input {
    flex-grow: 1;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    height: 100% !important;
    position: relative;
}

.cnf-qty-custom .apf-plusmin {
    display: flex !important;
    width: 100% !important;
    height: 100% !important;
    border: none !important;
		border-radius: 0 !important;
    background: transparent !important;
}

.cnf-qty-custom .apf-plusmin button {
    height: 100% !important;
    background-color: #f7f8f9 !important;
    border: none !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: var(--cnf-text-main);
    transition: all 0.2s ease;
    user-select: none;
}

.cnf-qty-custom .apf-plusmin button:hover { background-color: #E5E7EB !important; color: #111827; }
.cnf-qty-custom .apf-plusmin button:active { background-color: #D1D5DB !important; }
.cnf-qty-custom .apf-plusmin button svg { width: 14px; height: 14px; fill: currentColor; font-weight: bold; }

.cnf-qty-custom input.wapf-input[type="number"] {
    flex-grow: 1;
    height: 100% !important;
    border: none !important;
    background-color: #FFFFFF !important;
    text-align: center !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    color: var(--cnf-text-main) !important;
    padding: 0 40px 0 0 !important;
    margin: 0 !important;
    -moz-appearance: textfield;
    box-shadow: none !important;
    font-variant-numeric: tabular-nums;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='50'%3E%3Ctext x='50%25' y='53%25' dominant-baseline='middle' text-anchor='middle' font-family='sans-serif' font-weight='600' font-size='12' fill='%239CA3AF'%3Epcs%3C/text%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 15px center;
}
.cnf-qty-custom input.wapf-input[type="number"]:focus { background-color: #FFFFFF !important; }
.cnf-qty-custom input[type=number]::-webkit-inner-spin-button, 
.cnf-qty-custom input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }

/* =========================================
   10. COMPONENT: File Upload (Wide & Clean)
   ========================================= */
.cnf-file-upload {
    width: 100% !important;
    margin-top: 5px !important;
    display: block !important;
}

.cnf-file-upload .dzone {
    background: #F9FAFB !important;
    border: 2px dashed var(--cnf-border-def) !important;
    border-radius: var(--cnf-radius-input) !important;
    min-height: 140px !important; 
    width: 100% !important;
    padding: 20px !important;
    display: flex !important;
    flex-direction: column !important; 
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer;
    transition: var(--cnf-transition);
    position: relative;
    box-sizing: border-box !important;
}

.cnf-file-upload .dzone:hover {
    border-color: var(--cnf-border-hover) !important;
    background: var(--cnf-bg-btn) !important;
}
.cnf-file-upload .dzone.dz-drag-hover { border-style: solid !important; opacity: 0.7; }

.cnf-file-upload .dz-message {
    font-family: inherit;
    color: var(--cnf-text-sec) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 12px;
    width: 100% !important;
}

.cnf-file-upload .dz-message::before {
    content: '';
    display: block;
    width: 48px;
    height: 48px;
    background-color: var(--cnf-text-label);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19.35 10.04C18.67 6.59 15.64 4 12 4 9.11 4 6.6 5.64 5.35 8.04 2.34 8.36 0 10.91 0 14c0 3.31 2.69 6 6 6h13c2.76 0 5-2.24 5-5 0-2.64-2.05-4.78-4.65-4.96zM14 13v4h-4v-4H7l5-5 5 5h-3z'/%3E%3C/svg%3E") no-repeat center / contain;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19.35 10.04C18.67 6.59 15.64 4 12 4 9.11 4 6.6 5.64 5.35 8.04 2.34 8.36 0 10.91 0 14c0 3.31 2.69 6 6 6h13c2.76 0 5-2.24 5-5 0-2.64-2.05-4.78-4.65-4.96zM14 13v4h-4v-4H7l5-5 5 5h-3z'/%3E%3C/svg%3E") no-repeat center / contain;
    opacity: 0.5;
    transition: opacity 0.3s;
}

.cnf-file-upload .dzone:hover .dz-message::before { background-color: var(--cnf-text-main); opacity: 1; }

.cnf-file-upload .dz-message span {
    color: #2563EB !important;
    text-decoration: none !important;
    border-bottom: 1px solid transparent;
    font-weight: 600;
    transition: border-color 0.2s;
}
.cnf-file-upload .dz-message span:hover { border-bottom-color: #2563EB; }

.cnf-file-upload .dzone .dz-preview {
    background: white;
    border: 1px solid var(--cnf-border-def);
    border-radius: 8px;
    padding: 12px !important;
    margin: 10px 0 0 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    gap: 15px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
}

.cnf-file-upload .dz-left {
    flex: 1 !important;
    max-width: 100% !important;
    display: flex !important;
    align-items: center;
}

.cnf-file-upload .dz-image {
    width: 48px !important;
    height: 48px !important;
    flex-shrink: 0;
    margin-right: 15px !important;
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid #eee;
}
.cnf-file-upload .dz-image img { width: 100% !important; height: 100% !important; object-fit: cover; }

.cnf-file-upload .dz-filename {
    font-size: 14px;
    font-weight: 600;
    color: var(--cnf-text-main);
    flex-grow: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 10px !important;
}

.cnf-file-upload .dz-remove {
    margin-left: auto !important;
    padding: 8px !important;
    cursor: pointer;
    color: var(--cnf-text-disabled);
    transition: color 0.2s;
}
.cnf-file-upload .dz-remove:hover { color: #ef4444 !important; }

/* =========================================
   11. COMPONENT: Notification Alert (CSS Icon)
   ========================================= */

.cnf-alert-box {
    display: flex;
    align-items: center !important; /* ВАЖНО: Центрируем иконку по вертикали */
    gap: 14px;
    margin-top: 15px;
    
    /* Цветовая схема: Amber */
    background-color: #FFFBEB; 
    border: 1px solid #FCD34D; 
    border-radius: 12px;
    padding: 10px 16px;
    
    animation: cnfFadeIn 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-sizing: border-box;
    width: 100%;
}

/* Настройки иконки */
.cnf-alert-icon {
    flex-shrink: 0;
    width: 20px !important;  /* Уменьшили размер */
    height: 20px !important; /* Уменьшили размер */
    margin: 0 !important;    /* Убрали отступ сверху, теперь работает align-items */
    
    /* Вставляем SVG через CSS */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D97706' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

/* Контент */
.cnf-alert-content {
    display: flex;
    flex-direction: column;
    gap: 2px; /* Чуть уменьшил расстояние между заголовком и текстом для компактности */
}

.cnf-alert-title {
    font-size: 14px;
    font-weight: 700;
    color: #92400E; 
    line-height: 1.2;
}

.cnf-alert-text {
    font-size: 13px;
    font-weight: 500;
    color: #B45309; 
    line-height: 1.3;
}

/* Анимация */
@keyframes cnfFadeIn {
    from { opacity: 0; transform: translateY(-5px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Адаптив */
@media (max-width: 480px) {
    .cnf-alert-box { padding: 12px; gap: 10px; }
    .cnf-alert-title { font-size: 13px; }
    .cnf-alert-text { font-size: 12px; }
}

/* =========================================
   12. COMPONENT: Leave a Comment
   ========================================= */
div.wapf-field-container.cnf-leave-comment {
    width: 100% !important;
    box-sizing: border-box !important;   
    margin: 15px 0 0 0 !important;     
		padding: 20px !important;
    background-color: #F3F4F6;
    border-radius: 20px;
    animation: cnfSlideUp 0.4s cubic-bezier(0.16, 1, 0.3, 1);	
}

/* 1. ЗАГОЛОВОК С ИКОНКОЙ */
.cnf-leave-comment .wapf-field-label {
    margin-bottom: 12px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center;
    gap: 8px;
}

.cnf-leave-comment .wapf-field-label::before {
    content: '';
    display: block;
    width: 18px;
    height: 18px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239CA3AF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20h9'%3E%3C/path%3E%3Cpath d='M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4L16.5 3.5z'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    opacity: 0.8;
}

.cnf-leave-comment .wapf-field-label label {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: var(--cnf-text-sec) !important;
    line-height: 1.4 !important;
		margin: 0 !important;
}

/* 2. ПОЛЕ ВВОДА */
.cnf-leave-comment .wapf-field-input textarea.wapf-input {
    width: 100% !important;
    min-height: 100px !important;
    padding: 16px !important;
    
    background: #FFFFFF !important;
    border: 2px solid var(--cnf-border-def) !important; 
    border-radius: var(--cnf-radius-input) !important;
    
    color: var(--cnf-text-main) !important;
    font-family: inherit !important;
    font-size: 15px !important;
    
    transition: all 0.2s ease-in-out !important;
    resize: vertical !important;
    box-shadow: none !important;
}

.cnf-leave-comment .wapf-field-input textarea.wapf-input::placeholder {
    color: var(--cnf-text-label) !important;
    font-weight: 400;
}

/* 3. ИНТЕРАКТИВ */
.cnf-leave-comment .wapf-field-input textarea.wapf-input:hover {
    border-color: var(--cnf-border-hover) !important;
}

.cnf-leave-comment .wapf-field-input textarea.wapf-input:focus {
    outline: none !important;
    border-color: var(--cnf-border-active) !important; 
    background-color: #FFFFFF !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05) !important;
}

@keyframes cnfSlideUp {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* =========================================
   13. COMPONENT: Final Price Card (Hero)
   ========================================= */

/* УСИЛЕННЫЙ СЕЛЕКТОР: div + class + class. 
   Это гарантированно перебивает любые дефолтные настройки. */
div.wapf-section.cnf-final-card {
    position: relative;
    width: 100% !important;
    max-width: 640px !important;
    border-radius: 24px;
    
    background: 
      radial-gradient(at 0% 0%, hsla(210, 20%, 96%, 1) 0px, transparent 50%),
      radial-gradient(at 100% 0%, hsla(0, 0%, 98%, 1) 0px, transparent 50%),
      radial-gradient(at 100% 100%, hsla(0, 0%, 98%, 1) 0px, transparent 50%),
      radial-gradient(at 0% 100%, hsla(210, 30%, 97%, 1) 0px, transparent 50%);
    background-color: #FFFFFF;
    background-size: 140% 140%;
    animation: mesh-flow 12s ease-in-out infinite;

    border: 1px solid rgba(0, 0, 0, 0.05) !important;
    box-shadow: 
      0 25px 50px -12px rgba(0, 0, 0, 0.08),
      inset 0 0 0 1px rgba(255, 255, 255, 0.8) !important;
      
    padding: 26px 20px !important;
    box-sizing: border-box !important;
    
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important; 
    overflow: visible !important; 
}

/* Декоративное пятно */
div.wapf-section.cnf-final-card::before {
    content: '';
    position: absolute;
    top: -80px;
    right: -60px;
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, rgba(226,76,76,0.04) 0%, transparent 70%);
    pointer-events: none;
    z-index: 0;
}

/* =========================================
   14. PRICE TYPOGRAPHY
   ========================================= */

.cnf-price-area {
    position: relative;
    z-index: 1;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
		text-align: center;
    width: 100% !important;
    margin-bottom: 28px !important;
}

/* Лейбл "FINAL PRICE" */
.cnf-label-pr .wapf-field-label {
    display: block !important;
    text-align: center !important;
    margin-bottom: 4px !important;
}

.cnf-label-pr .wapf-field-label label {
    font-size: 0.8rem !important;
    color: #6B7280 !important; 
    text-transform: uppercase !important;
    letter-spacing: 1.5px !important;
    font-weight: 700 !important;
}

/* Цифры цены */
.cnf-price-amount .wapf-calc-text {
    font-size: 4.5rem !important;
    font-weight: 800 !important;
    letter-spacing: -2px !important;
    line-height: 1 !important;
		margin-bottom: 24px;
    
    /* Градиент */
    background: linear-gradient(180deg, #111827 0%, #374151 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #111827;
    
    display: inline-block !important;
}

/* Знак $ */
.cnf-price-amount .wapf-calc-text::first-letter {
    font-size: 2.2rem !important; 
    font-weight: 600 !important;
    letter-spacing: normal !important;
    vertical-align: top !important;
    position: relative;
    top: 0.2em; 
    margin-right: 4px; 
}

/* Адаптив цены */
@media (max-width: 480px) {
    .cnf-price-amount .wapf-calc-text { font-size: 3.5rem !important; }
    .cnf-price-amount .wapf-calc-text::first-letter { font-size: 1.8rem !important; top: 0.1em; }
}

/* =========================================
   15. SPECS BAR (Specificity Fix + Mobile Center)
   ========================================= */

/* УСИЛЕНИЕ: Добавили родителя .cnf-final-card */
.cnf-final-card .cnf-specs-bar {
    position: relative;
    z-index: 1;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px !important;
    
    background: #FFFFFF !important;
    padding: 6px !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 12px -2px rgba(0,0,0,0.05) !important;
    border: 1px solid rgba(0,0,0,0.04) !important;
    
    width: auto !important;
    max-width: 100%; 
}

/* Таблетки внутри (Десктоп) */
.cnf-final-card .cnf-specs-bar .wapf-field-container {
    background: #F3F4F6 !important;
    border-radius: 8px !important;
    padding: 6px 12px !important;
    width: auto !important;
    margin: 0 !important;
    /* Добавляем flex здесь тоже, чтобы justify работал всегда */
    display: flex !important; 
    align-items: center !important;
    justify-content: center !important;
}

/* Обертка инпута внутри таблетки (чтобы она не растягивалась криво) */
.cnf-final-card .cnf-specs-bar .wapf-field-input {
    width: auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.cnf-final-card .cnf-specs-bar .wapf-calc-text {
    font-size: 0.9rem !important;
    color: #374151 !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
    display: flex !important;
    align-items: center;
    gap: 6px;
}

/* ИКОНКИ (OUTLINE) */
.cnf-final-card .cnf-spec-per .wapf-calc-text::before {
    content: ''; display: block; width: 16px; height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.59 13.41l-7.17 7.17a2 2 0 0 1-2.83 0L2 12V2h10l8.59 8.59a2 2 0 0 1 0 2.82z'%3E%3C/path%3E%3Cline x1='7' y1='7' x2='7.01' y2='7'%3E%3C/line%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: center; background-size: contain;
}

.cnf-final-card .cnf-spec-pcs .wapf-calc-text::before {
    content: ''; display: block; width: 16px; height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z'%3E%3C/path%3E%3Cpolyline points='3.27 6.96 12 12.01 20.73 6.96'%3E%3C/polyline%3E%3Cline x1='12' y1='22.08' x2='12' y2='12'%3E%3C/line%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: center; background-size: contain;
}

/* Красная плашка */
.cnf-final-card .cnf-spec-discount.wapf-field-container {
    background: linear-gradient(135deg, #EF4444 0%, #B91C1C 100%) !important;
    box-shadow: 0 2px 5px rgba(239, 68, 68, 0.3) !important;
}

.cnf-final-card .cnf-spec-discount .wapf-calc-text {
    color: #FFFFFF !important;
    font-weight: 700 !important;
    font-size: 0.85rem !important;
    letter-spacing: 0.5px;
}

.cnf-final-card .cnf-spec-discount .wapf-calc-text::before {
    content: ''; display: block; width: 14px; height: 14px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23FFFFFF' stroke='none'%3E%3Cpath d='M13 2L3 14h9l-1 8 10-12h-9l1-8z'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: center; background-size: contain;
}

/* Адаптив Specs Bar (Mobile Fix) */
@media (max-width: 480px) {
    .cnf-final-card .cnf-specs-bar {
        display: flex !important; /* Убеждаемся что это flex */
        flex-wrap: wrap !important;
        width: 100% !important;
        justify-content: center !important; /* Центруем сами таблетки в ряду */
    }
    
    .cnf-final-card .cnf-specs-bar .wapf-field-container {
        flex-grow: 1 !important;
        /* ВАЖНО: display flex + center чтобы текст встал по центру */
        display: flex !important; 
        align-items: center !important;
        justify-content: center !important;
    }
    
    .cnf-final-card .cnf-spec-discount {
        width: 100% !important; 
        margin-top: 4px;
    }
}

/* =========================================
   16. BUTTON & SPACER (Delivery Shortcode)
   ========================================= */

/* Умный селектор: Выбираем элемент СРАЗУ ПОСЛЕ Specs Bar.
   Это наше поле с шорткодом доставки. Задаем ему отступы. */
.cnf-final-card .cnf-specs-bar + .wapf-field-container {
    margin: 20px 0 !important; /* Отступ сверху и снизу от доставки */
    width: 100% !important;
    text-align: center !important;
}


/* Юридический текст */
.cnf-final-card .cnf-legal-text { width: 100% !important; text-align: center !important; }
.cnf-final-card .cnf-legal-text .wapf-field-input {
    font-size: 0.75rem !important; color: #6B7280 !important; text-align: center !important; display: block !important; margin-top: 14px;
}

/* =========================================
   17. Add to Card Button
   ========================================= */

/* 1. Main Button Container */
.cnf-smart-btn {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    
    /* Button Appearance */
    background-color: #111827; /* Темный фон (или твой бренд цвет) */
    color: #ffffff;
    border-radius: 12px;
    padding: 14px 24px !important;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
    
    /* Reset defaults */
    border: none;
    text-decoration: none;
    box-sizing: border-box;
}

/* Hover Effect */
.cnf-smart-btn:hover {
    background-color: #1F2937; /* Чуть светлее при наведении */
    transform: translateY(-1px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
}

/* 2. Left Content Wrapper (Title + Details) */
.cnf-btn-content {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;

    width: auto !important; /* Overriding inline width */
    flex-grow: 1; /* Занимает все свободное место */
}

/* 3. Button Title (ADD TO CART) */
.cnf-btn-title {
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
    width: auto !important;
    
}

.cnf-btn-title label,
.cnf-btn-title span {
    font-size: 16px !important;
    margin-bottom: 0 !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    cursor: pointer;
    color: #ffffff !important;
    line-height: 1 !important;
}

/* 4. Details Row Wrapper */
.cnf-btn-pr-detail label,
.cnf-btn-pr-detail span {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
    width: auto !important;
    font-size: 0.8rem; !important;
    font-weight: 500 !important;
    color: rgba(255, 255, 255, 0.8) !important; 
}

/* Сбрасываем отступы внутри полей формы */
.cnf-btn-pr-detail .wapf-field-container,
.cnf-btn-pr-detail .wapf-field-input,
.cnf-btn-pr-detail label {
    margin-bottom: 0 !important;
    margin-top: 4px;
    padding: 0 !important;
    width: auto !important;
    display: inline-flex !important;
    align-items: center;
    line-height: 1 !important;
}

.cnf-smart-btn .wapf-field-label {
    margin: 0 !important;
}

/* --- LOGIC: Строим строку "Total: $249 ($12 x 20 pcs)" --- */

/* A. Subtotal (Total: $249) */
div.cnf-btn-subtotal {
    margin-right: 5px !important;
    font-weight: 600;
}
/* Делаем лейбл "Total:" и сумму в одн.cnf-smart-btn-iconу строку */
.cnf-btn-subtotal .wapf-field-label { margin-right: 4px !important; }

/* B. Per One ($12.45) -> Добавляем скобку ( */
.cnf-btn-perone::before {
    content: "(";
    margin-right: 2px;
	  font-size: 0.8rem;
    font-weight: 500 !important;
    color: rgba(255, 255, 255, 0.8) !important;
    margin-top: 4px !important;
}

/* C. Total PCS (20 pcs) -> Добавляем x и закрываем скобку ) */
.cnf-btn-totalpcs::before {
    content: "×"; /* Знак умножения */
    margin: 0 4px;
	  font-size: 0.8rem;
    font-weight: 500 !important;
    color: rgba(255, 255, 255, 0.8) !important;
    margin-top: 4px !important;
}

.cnf-btn-totalpcs::after {
    content: ")";
    margin-left: 2px;
	  font-size: 0.8rem;
    font-weight: 500 !important;
    color: rgba(255, 255, 255, 0.8) !important;
    margin-top: 4px !important;
}

/* 5. Right Icon (SVG Cart) */
.cnf-smart-btn-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 24px !important;
    height: 24px !important;
    font-size: 0 !important; /* Скрываем текст "123" */
    color: transparent !important; /* Скрываем текст "123" */
    
    /* SVG Icon (Cart - White) */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='21' r='1'%3E%3C/circle%3E%3Ccircle cx='20' cy='21' r='1'%3E%3C/circle%3E%3Cpath d='M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    flex-shrink: 0;
}


/* ---  Smart Button Animations & States --- */

/* Анимация вращения для иконки загрузки */
@keyframes cnfSpin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.cnf-spin {
    animation: cnfSpin 1s linear infinite;
}

/* Состояние: Loading (Загрузка) */
.cnf-smart-btn.cnf-loading {
    opacity: 0.8;
    cursor: wait !important;
    pointer-events: none; /* Блокируем клики */
}

/* Состояние: Success (Успех) */
.cnf-smart-btn.cnf-success {
    background-color: #10B981 !important; /* Зеленый цвет */
    transform: scale(1.02); /* Легкое увеличение */
    box-shadow: 0 0 15px rgba(16, 185, 129, 0.4);
}

/* Эффект нажатия (Active state) */
.cnf-smart-btn:active {
    transform: scale(0.98); /* Кнопка чуть вдавливается */
}




/* =========================================
   18. Otherss...
   ========================================= */

/* Sticky add to cart */
.single-sticky {
    display: none; /* Скрываем элемент по умолчанию */
    opacity: 0;
    transition: opacity 0.5s ease-out, transform 0.5s ease-out;
    transform: translateY(20px);
}
.single-sticky.sticky {
    display: block; /* Показываем элемент, когда он становится липким */
    opacity: 1;
    transform: translateY(0);
}

div#target-element1 {
    font-size: 22px;
    font-weight: 800;
    color: #242424;
}


/* Remove standard quantity */
div.quantity {
    display: none !important;
}
 
/* Remove Standard Add to Cart */
form.cart :where(.single_add_to_cart_button,.wd-buy-now-btn,.quantity) {
    opacity: 0 !important;
    position: absolute !important;
    z-index: -1 !important;
    width: 0 !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
} 






























/* ───────────────────────────────
   Single Page Padding Problem
   ─────────────────────────────── */
.wd-content-layout {
    padding-block: 0px !important;
    padding-block-end: 40px !important;
}

.single-product .whb-overcontent:not(.whb-custom-header) {
        padding-top: 0 !important;
				margin-bottom: 0;
    }

/* ───────────────────────────────
  END Single Page Padding Problem
   ─────────────────────────────── */
.white-bg-shd {
    border: 1px solid rgba(255, 255, 255, 0.4);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03), inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
}

.review-bcard-wrapper::before { /* second block  */
    backdrop-filter: blur(4px);
    mask-image: linear-gradient(to bottom, transparent 0%, black 100%);
    -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 100%);
}



/* ───────────────────────────────
   Video-Tabs
   ─────────────────────────────── */

/* НЕактивные заголовки */
.video-tabs .vtabs-title .title{

  background:none;
  transition:color .25s ease;
}

/* Неактивные Hover  */
.video-tabs .vtabs-title .title:hover {
    color: #242424;
}

/* Контейнеры вкладок: курсор + плавность */
.video-tabs [id^="p-tabs-"]{
  cursor:pointer;
  transition:all .25s ease;
}

/* Тексты-описания по умолчанию скрыты */
.video-tabs .vtabs-text{display:none;}

/* Активный таб целиком */
.video-tabs .tab-active{
  background:#fff;
  box-shadow: 0px 0px 24px 0px rgba(0, 0, 0, 0.1);
  border-radius:20px;
  pointer-events:none;
  cursor:default !important;
}

/* Активный заголовок c «наплывом» */
.video-tabs .tab-active .vtabs-title .title{
  /* нижний слой = #242424 (остаётся всегда),
     верхний слой = #E24C4C (анимируется)          */
  background-image:
      linear-gradient(90deg,#E24C4C 0 100%),
      linear-gradient(90deg,#242424 0 100%);
  background-size:0% 100%,100% 100%;       /* красный = 0 % → 100 % */
  background-repeat:no-repeat;
  background-clip:text;
  -webkit-background-clip:text;
  color:transparent;                       /* прячем исходный текст */
  -webkit-text-fill-color:transparent;
  transition:background-size linear;       /* длительность задаёт JS */
}

/* Hover (только для НЕактивных) */
.video-tabs [id^="p-tabs-"]:not(.tab-active) .vtabs-title .title:hover{
  color:#242424;
}


/* ───────────────────────────────────────────
   End Video Tabs
   ─────────────────────────────────────────── */




/* ───────────────────────────────────────────
   Green BG Title + Lottie caption
   ─────────────────────────────────────────── */


.title-greenbg {
    color: #55E34D;
    background-image: linear-gradient(45deg, #55E34D, #4ca348, #2e752c, #242424);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.e-lottie__caption {
    display: none !important;
}

/* ───────────────────────────────────────────
   End Green BG Title
   ─────────────────────────────────────────── */




/* ───────────────────────────────────────────
   Products card
   ─────────────────────────────────────────── */
.wd-product .product-wrapper:hover {
    transform: scale(1.02);
    box-shadow: 2px 4px 16px rgb(0 0 0 / 25%);
}

.wd-product .product-wrapper {
    box-shadow: 0px 0px 24px 0px rgba(0, 0, 0, 0.1);
    transition: transform 0.4s ease;
}

.wd-add-cart-icon>a:before {
    content: "\f120" !important;
}
.wd-product.wd-hover-info .bottom-information {
	  display: none !important;
}

.product-wrapper .wd-buttons.wd-pos-r-b {
    z-index: 10;
}

.product-wrapper .product-subtitle {
    color: white;
		font-size: 20px;
}

.wd-product.wd-hover-info .top-information {
    top: unset !important;
	  bottom: 0;
		padding: 30px;
		pointer-events: none;
    inset-inline: unset !important;
    width: 90%;
    box-sizing: border-box;
}

.wd-product .product-image-link::before {
    content: "";
    display: block;
    width: 100.5%;
    height: 60%;
    position: absolute;
    bottom: -1px;
    left: 0;
    transition: all .3s ease-in-out;
    backdrop-filter: blur(10px);
    mask: linear-gradient(#0000, #000);
    background-color: rgb(0 0 0 / 70%);
    z-index: 1;
}

.product-element-bottom .star-rating {
    display: none;
}


/* Icons */
.wd-product .wd-buttons {
    border-radius: 150px  !important;
    background: #ffffff73  !important;
    backdrop-filter: blur(10px);
}

.wd-product .wd-buttons:hover {
    background: #e24c4c !important;
}

.wd-product .wd-action-btn>a {
    color: #ffffffc2 !important;
}

.wd-product .wd-action-btn>a:hover {
    color: #fff  !important;
	  transform: rotate(45deg);
}


.wd-product .wd-action-btn.wd-style-icon>a {
    width: 45px !important;
}

/* ───────────────────────────────────────────
   End Products card
   ─────────────────────────────────────────── */




/* ───────────────────────────────────────────
   Filter-archive
   ─────────────────────────────────────────── */

.filter-archive .select2-selection__clear {
    display: none;
}

.filter-archive .select2-container--default .select2-selection {
    border: unset;
		border-radius: 150px !important;
	 	background-color: #fff;
}

.filter-archive .select2-container--default .select2-selection:hover {
    background-color: #E3E3E3;
}

.select2-container--open .select2-selection.select2-selection--single {
    background-color: #E3E3E3;
}

.filter-archive .select2-container .select2-selection--single {
    align-content: center;
		border-radius: 150px !important;
}

.select2-dropdown {
    margin-top: 11.5px;
		border: unset !important;
		border-radius: 20px !important;
		padding: 12px 10px;
	  box-shadow: 0px 0px 24px 0px rgba(0, 0, 0, 0.1);
    overflow: hidden;	
}

.select2-container--default .select2-results__option {
    padding: 6px 10px !important;
    border-radius: 7px;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #e5e5e5 !important;
    color: rgb(226, 76, 76) !important;
}

.select2-container--default .select2-results {
    background-color: #fff !important;
    font-size: 14px;
    color: #242424;
    font-weight: bold;
}

body .select2-container--default .select2-selection--single {
    font-size: 16px !important;
    font-weight: bold;
}

body .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #242424 !important;
}



/* ───────────────────────────────────────────
   End Filter-archive
   ─────────────────────────────────────────── */




/* ───────────────────────────────────────────
   Info Blocks (blog)
   ─────────────────────────────────────────── */

.info-edu .elementor-posts .elementor-post__text {
    align-content: center;
}


/* ───────────────────────────────────────────
   End Info Blocks (blog)
   ─────────────────────────────────────────── */




/* link button */
.btn.btn-style-link:is(.btn,.button,button,[type="submit"],[type="button"]) {
    padding: 0px;
}

.btn.btn-style-link {
    --btn-brd-width: 0;
}

/* Blog */
.post-single-page {
    background: white;
    box-shadow: 0px 0px 24px 0px rgba(0, 0, 0, 0.1);
		border-radius: 20px;
    padding: 20px;
	  margin-bottom: 20px;
}

.comments-area {
    background: white;
    box-shadow: 0px 0px 24px 0px rgba(0, 0, 0, 0.1);
    border-radius: 20px;
    padding: 20px;
}

.comments-area .comment-respond {
    margin-top: 0;
}

/* Blog Carousel*/
.wd-post-date.wd-style-with-bg {
    display: none;
}

.hovered-social-icons.wd-tltp {
    display: none;
}

/* Shopping cart */
th.product-quantity {
	display: none;
}

td.product-quantity {
	display: none;
}


/* Shadows */
.box-style-shadow {
	box-shadow: 0px 0px 24px 0px rgba(0, 0, 0, 0.1);
}




/* Main Block Text Gradient */
   .textgradient .elementor-heading-title {
    background: radial-gradient(circle, rgba(226,76,76,1) 20%, rgba(36,36,36,1) 35%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
   }





/* Feedbacks */
.feedback .banner-mask .wrapper-content-banner {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgb(36 36 36 / 85%) 100%);
}

.elementor-611 .elementor-element.elementor-element-bd48a5d > .elementor-widget-container {
    backdrop-filter: blur(1px);
}

/* Promo Banner Shadow */
.banner-shadow {
    box-shadow: 0px 0px 24px 0px rgba(0, 0, 0, 0.1);
}

/* Promo Banner Text Shadow */
.promo-banner .wrapper-content-banner {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 40%, rgba(36, 36, 36, 1) 100%);
}





/* Latest articles */
.post-date.wd-post-date.wd-style-with-bg {
	display: none;
}

.entry-meta.wd-entry-meta {
    display: none;
}

.hovered-social-icons {
    display: none;
}


/* Customer Reviews */
.wd-rating-summary-wrap {
    max-width: 500px;
}

/* Plawki */
.plawka {
	 transition: transform 0.3s ease;
}

.plawka:hover {
	 transform: scale(1.02);
}

/* Wd-accordion */

.wd-accordion.wd-style-shadow>.wd-accordion-item {
    border: 1px solid rgba(255, 255, 255, 0.4);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03), inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
		transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.wd-accordion.wd-style-shadow>.wd-accordion-item:hover {
    background: rgba(255, 255, 255, 0.8);
    transform: translateY(-2px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
}

.wd-accordion-opener {
    background-color: #F3F4F6;
    padding: 10px;
    border-radius: 150px;
}

.wd-accordion-content.wd-entry-content.wd-active>p {
    border-top: 1px solid rgba(0, 0, 0, 0.05);
    padding-top: 15px;
}

.wd-accordion.wd-opener-style-arrow>.wd-accordion-item>.wd-accordion-title .wd-accordion-opener:before {
    display: flex;
    content: "" !important;
    font-family: unset;
    background-image: url(/wp-content/uploads/2024/07/Arrow_Block.svg);
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center;
    width: 24px;
    height: 24px;
}

/* Конец wd-accordion */




/* Useful tips */

.wd-read-more a {
    color: white !important;
}

.btn-read-more {
    background: var(--wd-primary-color);
    padding: 5px 12px;
    border-radius: 50px;
}

.btn-read-more:hover {
    background: #b70404;
}

/* Buttons size and border */
:root {
		--wd-form-height: 46px;
	  --wd-form-brd-radius: 7px;
	  --wd-form-brd-width: 2px;
		--wd-form-brd-color: #E5E7EB;
}


:is(.btn,.button,button,[type="submit"],[type="button"]) {
    padding: 15px 20px;
}

/* Contact us FAQ */
.poss-answers .elementor-posts .elementor-post__card .elementor-post__text {
    margin-top: 0;
}@media (min-width: 768px) and (max-width: 1024px) {
	

}

@media (min-width: 577px) and (max-width: 767px) {
	

.wd-negative-gap.elementor-element.elementor-element-58a626b.wd-section-stretch.single-sticky.animated-fast.e-flex.e-con-boxed.e-con.e-parent.e-lazyloaded.animated.fadeInDown.elementor-sticky--effects.elementor-sticky.elementor-sticky--active.elementor-section--handles-inside.sticky { /* Sticky Mobile */
    top: unset !important;
    bottom: 55px;
    z-index: 2;
    border-radius: 20px 20px 0 0;
}

}