.elementor-3510 .elementor-element.elementor-element-7eef4ba{--display:flex;--gap:10px 10px;--row-gap:10px;--column-gap:10px;--margin-top:30px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:36px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3510 .elementor-element.elementor-element-d81e190{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;}.elementor-3510 .elementor-element.elementor-element-3c6c267{padding:10px 0px 0px 0px;z-index:0;text-align:end;--flx-min:40;--flx-max:90;}.elementor-3510 .elementor-element.elementor-element-3c6c267.elementor-element{--align-self:flex-start;}.elementor-3510 .elementor-element.elementor-element-3c6c267 .elementor-heading-title{font-family:"TT Norms Pro Expanded", Sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:0.1em;color:#F9F9F9;font-size:clamp(calc(var(--flx-min) * 1px), calc(calc(var(--flx-min) * 1px) + (var(--flx-max) - var(--flx-min)) * ((100vw - calc(var(--flx-min-vw, 320) * 1px)) / (var(--flx-max-vw, 1200) - var(--flx-min-vw, 320)))), calc(var(--flx-max) * 1px)) !important;}.elementor-3510 .elementor-element.elementor-element-c570f1e{padding:10px 0px 0px 0px;z-index:0;text-align:end;--flx-min:26;--flx-max:75;}.elementor-3510 .elementor-element.elementor-element-c570f1e.elementor-element{--align-self:flex-end;}.elementor-3510 .elementor-element.elementor-element-c570f1e .elementor-heading-title{font-family:"TT Norms Pro Expanded", Sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:0.1em;color:#F9F9F9;font-size:clamp(calc(var(--flx-min) * 1px), calc(calc(var(--flx-min) * 1px) + (var(--flx-max) - var(--flx-min)) * ((100vw - calc(var(--flx-min-vw, 320) * 1px)) / (var(--flx-max-vw, 1200) - var(--flx-min-vw, 320)))), calc(var(--flx-max) * 1px)) !important;}.elementor-3510 .elementor-element.elementor-element-1cef98d{margin:-45px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;--flx-min:26;--flx-max:36;}.elementor-3510 .elementor-element.elementor-element-1cef98d.elementor-element{--align-self:flex-start;}.elementor-3510 .elementor-element.elementor-element-1cef98d .elementor-heading-title{font-family:"TT Norms Pro Expanded", Sans-serif;font-weight:600;text-transform:uppercase;color:#C2ACB6;font-size:clamp(calc(var(--flx-min) * 1px), calc(calc(var(--flx-min) * 1px) + (var(--flx-max) - var(--flx-min)) * ((100vw - calc(var(--flx-min-vw, 320) * 1px)) / (var(--flx-max-vw, 1200) - var(--flx-min-vw, 320)))), calc(var(--flx-max) * 1px)) !important;}.elementor-3510 .elementor-element.elementor-element-3fd3195{width:var( --container-widget-width, 70% );max-width:70%;--container-widget-width:70%;--container-widget-flex-grow:0;color:#C2ACB6;--flx-min:14;--flx-max:18;}.elementor-3510 .elementor-element.elementor-element-3fd3195, .elementor-3510 .elementor-element.elementor-element-3fd3195 p, .elementor-3510 .elementor-element.elementor-element-3fd3195 .elementor-widget-container, .elementor-3510 .elementor-element.elementor-element-3fd3195 .elementor-widget-container p{font-size:clamp(calc(var(--flx-min) * 1px), calc(calc(var(--flx-min) * 1px) + (var(--flx-max) - var(--flx-min)) * ((100vw - calc(var(--flx-min-vw, 320) * 1px)) / (var(--flx-max-vw, 1200) - var(--flx-min-vw, 320)))), calc(var(--flx-max) * 1px)) !important;}.elementor-3510 .elementor-element.elementor-element-a394648{--display:flex;}.elementor-3510 .elementor-element.elementor-element-d76d5b4{--display:flex;}.elementor-3510 .elementor-element.elementor-element-b5f2cb1{--display:flex;--border-radius:20px 20px 20px 20px;--margin-top:60px;--margin-bottom:60px;--margin-left:0px;--margin-right:0px;}.elementor-3510 .elementor-element.elementor-element-b5f2cb1:not(.elementor-motion-effects-element-type-background), .elementor-3510 .elementor-element.elementor-element-b5f2cb1 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F9F9F9;}.elementor-3510 .elementor-element.elementor-element-3d207ca{--display:flex;}.elementor-3510 .elementor-element.elementor-element-cc1dca2{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;border-style:none;--border-style:none;--border-radius:20px 20px 20px 20px;--padding-top:40px;--padding-bottom:40px;--padding-left:40px;--padding-right:40px;}.elementor-3510 .elementor-element.elementor-element-cc1dca2:not(.elementor-motion-effects-element-type-background), .elementor-3510 .elementor-element.elementor-element-cc1dca2 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F9F9F9;}.elementor-3510 .elementor-element.elementor-element-0d0dff1{--display:flex;}.elementor-3510 .elementor-element.elementor-element-cf35a93{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--border-radius:20px 20px 20px 20px;--padding-top:40px;--padding-bottom:40px;--padding-left:40px;--padding-right:40px;}.elementor-3510 .elementor-element.elementor-element-cf35a93:not(.elementor-motion-effects-element-type-background), .elementor-3510 .elementor-element.elementor-element-cf35a93 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F9F9F9;}.elementor-3510 .elementor-element.elementor-element-9729c5c{--n-tabs-heading-justify-content:initial;--n-tabs-title-width:100%;--n-tabs-title-height:initial;--n-tabs-title-align-items:center;--n-tabs-title-flex-grow:1;--n-tabs-heading-wrap:wrap;--n-tabs-heading-overflow-x:initial;--n-tabs-title-white-space:initial;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:12px 12px 12px 12px;--n-tabs-title-border-radius:30px 30px 30px 30px;--n-tabs-title-color:var( --e-global-color-primary );--n-tabs-title-color-active:var( --e-global-color-ceeb50d );}.elementor-3510 .elementor-element.elementor-element-9729c5c > .e-n-tabs > .e-n-tabs-heading > .e-n-tab-title[aria-selected='false']:not( :hover ){background:#E19E881A;}.elementor-3510 .elementor-element.elementor-element-9729c5c.elementor-widget-n-tabs > .e-n-tabs[data-touch-mode='false'] > .e-n-tabs-heading > .e-n-tab-title[aria-selected="false"]:hover{background:var( --e-global-color-secondary );}.elementor-3510 .elementor-element.elementor-element-9729c5c.elementor-widget-n-tabs > .e-n-tabs > .e-n-tabs-heading > .e-n-tab-title[aria-selected="true"], .elementor-3510 .elementor-element.elementor-element-9729c5c.elementor-widget-n-tabs > .e-n-tabs[data-touch-mode='true'] > .e-n-tabs-heading > .e-n-tab-title[aria-selected="false"]:hover{background:#E19E88;}.elementor-3510 .elementor-element.elementor-element-9729c5c.elementor-widget-n-tabs > .e-n-tabs > .e-n-tabs-heading > :is( .e-n-tab-title > .e-n-tab-title-text, .e-n-tab-title ){font-family:"Gotham Pro", Sans-serif;font-weight:600;}.elementor-3510 .elementor-element.elementor-element-9729c5c [data-touch-mode="false"] .e-n-tab-title[aria-selected="false"]:hover{--n-tabs-title-color-hover:var( --e-global-color-ceeb50d );}@media(max-width:1366px){.elementor-3510 .elementor-element.elementor-element-7eef4ba{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3510 .elementor-element.elementor-element-3c6c267{padding:5px 0px 0px 0px;}.elementor-3510 .elementor-element.elementor-element-c570f1e{padding:5px 0px 0px 0px;}.elementor-3510 .elementor-element.elementor-element-1cef98d{margin:-35px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}}@media(max-width:1024px){.elementor-3510 .elementor-element.elementor-element-7eef4ba{--margin-top:40px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-3510 .elementor-element.elementor-element-3c6c267 .elementor-heading-title{line-height:1.1em;}.elementor-3510 .elementor-element.elementor-element-c570f1e{width:var( --container-widget-width, 80% );max-width:80%;--container-widget-width:80%;--container-widget-flex-grow:0;}.elementor-3510 .elementor-element.elementor-element-c570f1e .elementor-heading-title{line-height:1.1em;}.elementor-3510 .elementor-element.elementor-element-1cef98d{margin:-90px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-3510 .elementor-element.elementor-element-b5f2cb1{--margin-top:40px;--margin-bottom:40px;--margin-left:0px;--margin-right:0px;}.elementor-3510 .elementor-element.elementor-element-cc1dca2{--padding-top:32px;--padding-bottom:32px;--padding-left:32px;--padding-right:32px;}.elementor-3510 .elementor-element.elementor-element-cf35a93{--padding-top:32px;--padding-bottom:32px;--padding-left:32px;--padding-right:32px;}}@media(max-width:767px){.elementor-3510 .elementor-element.elementor-element-d81e190{--justify-content:space-between;}.elementor-3510 .elementor-element.elementor-element-c570f1e{width:var( --container-widget-width, 80% );max-width:80%;--container-widget-width:80%;--container-widget-flex-grow:0;text-align:end;}.elementor-3510 .elementor-element.elementor-element-1cef98d{margin:-60px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-3510 .elementor-element.elementor-element-3fd3195{--container-widget-width:100%;--container-widget-flex-grow:0;width:var( --container-widget-width, 100% );max-width:100%;}.elementor-3510 .elementor-element.elementor-element-b5f2cb1{--margin-top:32px;--margin-bottom:32px;--margin-left:0px;--margin-right:0px;}.elementor-3510 .elementor-element.elementor-element-cc1dca2{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:24px;--padding-bottom:24px;--padding-left:20px;--padding-right:20px;}.elementor-3510 .elementor-element.elementor-element-cf35a93{--padding-top:24px;--padding-bottom:24px;--padding-left:20px;--padding-right:20px;}}/* Start custom CSS for wd_my_account_register, class: .elementor-element-b9679f3 */.btn.btn-accent {
    font-size: clamp(14px, 13.6296px + 0.1235vw, 16px) !important;
    font-weight: 600 !important;
}






/* ====================================================
   WP FLEXIFIELDS + WOOCOMMERCE: ДИЗАЙН РЕЄСТРАЦІЇ
   ==================================================== */

/* 1. Робимо головну форму Flex-контейнером */
form.woocommerce-form-register {
    display: flex;
    flex-wrap: wrap;
    column-gap: 20px; /* Відстань між колонками */
    row-gap: 20px;    /* Відстань між рядками */
}

/* 2. "Розчиняємо" контейнери плагіна, щоб їхні поля вписалися в загальну сітку */
form.woocommerce-form-register .wpflexi-fields-container {
    display: contents;
}

/* Ховаємо блоки очищення, які ламають гнучку сітку */
form.woocommerce-form-register .clear {
    display: none !important;
}

/* 3. Налаштовуємо всі поля (кастомні і стандартні) на 50% ширини */
form.woocommerce-form-register .wpflexi-field-wrapper,
form.woocommerce-form-register p.woocommerce-form-row {
    width: calc(50% - 10px) !important; /* 10px - це половина нашого column-gap */
    flex: 0 0 calc(50% - 10px) !important;
    margin: 0 !important;  /* Скидаємо стандартні відступи WooCommerce */
    padding: 0 !important; /* Скидаємо відступи плагіна */
}

/* Повертаємо 100% ширини для службових блоків, тексту приватності та кнопки */
form.woocommerce-form-register .woocommerce-privacy-policy-text,
form.woocommerce-form-register p.form-row-btn,
form.woocommerce-form-register wc-order-attribution-inputs {
    width: 100% !important;
    flex: 0 0 100% !important;
    margin-top: 10px !important;
}


/* ====================================================
   ВІЗУАЛЬНА СТИЛІЗАЦІЯ ПІД МАКЕТ КЛІЄНТА
   ==================================================== */

/* Стилізуємо назви полів (лейбли) */
form.woocommerce-form-register label {
    color: #90909c !important; /* Світло-сірий як на макеті */
    font-weight: 600 !important;
    font-size: 15px !important;
    margin-bottom: 8px !important;
    display: block !important;
    font-family: 'Gotham Pro';
}

/* Приховуємо червоні зірочки обов'язкових полів (за бажанням, бо на макеті їх немає) */
form.woocommerce-form-register label .required {
    display: none !important;
}

/* Стилізуємо самі поля вводу (інпути) */
form.woocommerce-form-register input.woocommerce-Input {
    background-color: #ffffff !important;
    border: 1px solid #f2f2f5 !important; /* Майже непомітна рамка */
    border-radius: 40px !important;       /* Округлі форми */
    padding: 0 25px !important;
    height: 54px !important;              /* Висота поля */
    box-shadow: 0 4px 15px rgba(0,0,0,0.02) !important; /* Дуже легка тінь */
    color: #9999A3 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    transition: border-color 0.3s ease, box-shadow 0.3s ease !important;
    font-family: 'Gotham Pro';
    font-weight: 600 !important;
}

/* Змінюємо вигляд поля при натисканні (фокусі) */
form.woocommerce-form-register input.woocommerce-Input:focus {
    border-color: #d1d1db !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05) !important;
    outline: none !important;
}

/* Вирівнюємо іконку ока для паролів по центру полів */
form.woocommerce-form-register .password-input {
    display: block;
    position: relative;
    width: 100%;
}
form.woocommerce-form-register .password-input .show-password-input {
    top: 50% !important;
    transform: translateY(-50%) !important;
    right: 20px !important;
}


/* ====================================================
   АДАПТИВНІСТЬ ДЛЯ СМАРТФОНІВ
   ==================================================== */
@media (max-width: 767px) {
    form.woocommerce-form-register .wpflexi-field-wrapper,
    form.woocommerce-form-register p.woocommerce-form-row {
        width: 100% !important;
        flex: 0 0 100% !important;
    }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-cf35a93 *//*button.woocommerce-Button.woocommerce-button.btn.btn-accent.button {*/
/*    background-color: #c2acb6 !important;*/
/*}*/

/*button.woocommerce-Button.woocommerce-button.btn.btn-accent.button:hover {*/
/*    background-color: #e19e88 !important;*/
/*}*//* End custom CSS */
/* Start custom CSS for wd_my_account_register, class: .elementor-element-b9679f3 */.btn.btn-accent {
    font-size: clamp(14px, 13.6296px + 0.1235vw, 16px) !important;
    font-weight: 600 !important;
}






/* ====================================================
   WP FLEXIFIELDS + WOOCOMMERCE: ДИЗАЙН РЕЄСТРАЦІЇ
   ==================================================== */

/* 1. Робимо головну форму Flex-контейнером */
form.woocommerce-form-register {
    display: flex;
    flex-wrap: wrap;
    column-gap: 20px; /* Відстань між колонками */
    row-gap: 20px;    /* Відстань між рядками */
}

/* 2. "Розчиняємо" контейнери плагіна, щоб їхні поля вписалися в загальну сітку */
form.woocommerce-form-register .wpflexi-fields-container {
    display: contents;
}

/* Ховаємо блоки очищення, які ламають гнучку сітку */
form.woocommerce-form-register .clear {
    display: none !important;
}

/* 3. Налаштовуємо всі поля (кастомні і стандартні) на 50% ширини */
form.woocommerce-form-register .wpflexi-field-wrapper,
form.woocommerce-form-register p.woocommerce-form-row {
    width: calc(50% - 10px) !important; /* 10px - це половина нашого column-gap */
    flex: 0 0 calc(50% - 10px) !important;
    margin: 0 !important;  /* Скидаємо стандартні відступи WooCommerce */
    padding: 0 !important; /* Скидаємо відступи плагіна */
}

/* Повертаємо 100% ширини для службових блоків, тексту приватності та кнопки */
form.woocommerce-form-register .woocommerce-privacy-policy-text,
form.woocommerce-form-register p.form-row-btn,
form.woocommerce-form-register wc-order-attribution-inputs {
    width: 100% !important;
    flex: 0 0 100% !important;
    margin-top: 10px !important;
}


/* ====================================================
   ВІЗУАЛЬНА СТИЛІЗАЦІЯ ПІД МАКЕТ КЛІЄНТА
   ==================================================== */

/* Стилізуємо назви полів (лейбли) */
form.woocommerce-form-register label {
    color: #90909c !important; /* Світло-сірий як на макеті */
    font-weight: 600 !important;
    font-size: 15px !important;
    margin-bottom: 8px !important;
    display: block !important;
    font-family: 'Gotham Pro';
}

/* Приховуємо червоні зірочки обов'язкових полів (за бажанням, бо на макеті їх немає) */
form.woocommerce-form-register label .required {
    display: none !important;
}

/* Стилізуємо самі поля вводу (інпути) */
form.woocommerce-form-register input.woocommerce-Input {
    background-color: #ffffff !important;
    border: 1px solid #f2f2f5 !important; /* Майже непомітна рамка */
    border-radius: 40px !important;       /* Округлі форми */
    padding: 0 25px !important;
    height: 54px !important;              /* Висота поля */
    box-shadow: 0 4px 15px rgba(0,0,0,0.02) !important; /* Дуже легка тінь */
    color: #9999A3 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    transition: border-color 0.3s ease, box-shadow 0.3s ease !important;
    font-family: 'Gotham Pro';
    font-weight: 600 !important;
}

/* Змінюємо вигляд поля при натисканні (фокусі) */
form.woocommerce-form-register input.woocommerce-Input:focus {
    border-color: #d1d1db !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05) !important;
    outline: none !important;
}

/* Вирівнюємо іконку ока для паролів по центру полів */
form.woocommerce-form-register .password-input {
    display: block;
    position: relative;
    width: 100%;
}
form.woocommerce-form-register .password-input .show-password-input {
    top: 50% !important;
    transform: translateY(-50%) !important;
    right: 20px !important;
}


/* ====================================================
   АДАПТИВНІСТЬ ДЛЯ СМАРТФОНІВ
   ==================================================== */
@media (max-width: 767px) {
    form.woocommerce-form-register .wpflexi-field-wrapper,
    form.woocommerce-form-register p.woocommerce-form-row {
        width: 100% !important;
        flex: 0 0 100% !important;
    }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-cf35a93 *//*button.woocommerce-Button.woocommerce-button.btn.btn-accent.button {*/
/*    background-color: #c2acb6 !important;*/
/*}*/

/*button.woocommerce-Button.woocommerce-button.btn.btn-accent.button:hover {*/
/*    background-color: #e19e88 !important;*/
/*}*//* End custom CSS */
/* Start custom CSS for wd_my_account_register, class: .elementor-element-b9679f3 */.btn.btn-accent {
    font-size: clamp(14px, 13.6296px + 0.1235vw, 16px) !important;
    font-weight: 600 !important;
}






/* ====================================================
   WP FLEXIFIELDS + WOOCOMMERCE: ДИЗАЙН РЕЄСТРАЦІЇ
   ==================================================== */

/* 1. Робимо головну форму Flex-контейнером */
form.woocommerce-form-register {
    display: flex;
    flex-wrap: wrap;
    column-gap: 20px; /* Відстань між колонками */
    row-gap: 20px;    /* Відстань між рядками */
}

/* 2. "Розчиняємо" контейнери плагіна, щоб їхні поля вписалися в загальну сітку */
form.woocommerce-form-register .wpflexi-fields-container {
    display: contents;
}

/* Ховаємо блоки очищення, які ламають гнучку сітку */
form.woocommerce-form-register .clear {
    display: none !important;
}

/* 3. Налаштовуємо всі поля (кастомні і стандартні) на 50% ширини */
form.woocommerce-form-register .wpflexi-field-wrapper,
form.woocommerce-form-register p.woocommerce-form-row {
    width: calc(50% - 10px) !important; /* 10px - це половина нашого column-gap */
    flex: 0 0 calc(50% - 10px) !important;
    margin: 0 !important;  /* Скидаємо стандартні відступи WooCommerce */
    padding: 0 !important; /* Скидаємо відступи плагіна */
}

/* Повертаємо 100% ширини для службових блоків, тексту приватності та кнопки */
form.woocommerce-form-register .woocommerce-privacy-policy-text,
form.woocommerce-form-register p.form-row-btn,
form.woocommerce-form-register wc-order-attribution-inputs {
    width: 100% !important;
    flex: 0 0 100% !important;
    margin-top: 10px !important;
}


/* ====================================================
   ВІЗУАЛЬНА СТИЛІЗАЦІЯ ПІД МАКЕТ КЛІЄНТА
   ==================================================== */

/* Стилізуємо назви полів (лейбли) */
form.woocommerce-form-register label {
    color: #90909c !important; /* Світло-сірий як на макеті */
    font-weight: 600 !important;
    font-size: 15px !important;
    margin-bottom: 8px !important;
    display: block !important;
    font-family: 'Gotham Pro';
}

/* Приховуємо червоні зірочки обов'язкових полів (за бажанням, бо на макеті їх немає) */
form.woocommerce-form-register label .required {
    display: none !important;
}

/* Стилізуємо самі поля вводу (інпути) */
form.woocommerce-form-register input.woocommerce-Input {
    background-color: #ffffff !important;
    border: 1px solid #f2f2f5 !important; /* Майже непомітна рамка */
    border-radius: 40px !important;       /* Округлі форми */
    padding: 0 25px !important;
    height: 54px !important;              /* Висота поля */
    box-shadow: 0 4px 15px rgba(0,0,0,0.02) !important; /* Дуже легка тінь */
    color: #9999A3 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    transition: border-color 0.3s ease, box-shadow 0.3s ease !important;
    font-family: 'Gotham Pro';
    font-weight: 600 !important;
}

/* Змінюємо вигляд поля при натисканні (фокусі) */
form.woocommerce-form-register input.woocommerce-Input:focus {
    border-color: #d1d1db !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05) !important;
    outline: none !important;
}

/* Вирівнюємо іконку ока для паролів по центру полів */
form.woocommerce-form-register .password-input {
    display: block;
    position: relative;
    width: 100%;
}
form.woocommerce-form-register .password-input .show-password-input {
    top: 50% !important;
    transform: translateY(-50%) !important;
    right: 20px !important;
}


/* ====================================================
   АДАПТИВНІСТЬ ДЛЯ СМАРТФОНІВ
   ==================================================== */
@media (max-width: 767px) {
    form.woocommerce-form-register .wpflexi-field-wrapper,
    form.woocommerce-form-register p.woocommerce-form-row {
        width: 100% !important;
        flex: 0 0 100% !important;
    }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-cf35a93 *//*button.woocommerce-Button.woocommerce-button.btn.btn-accent.button {*/
/*    background-color: #c2acb6 !important;*/
/*}*/

/*button.woocommerce-Button.woocommerce-button.btn.btn-accent.button:hover {*/
/*    background-color: #e19e88 !important;*/
/*}*//* End custom CSS */
/* Start custom CSS for nested-tabs, class: .elementor-element-9729c5c */.elementor-widget-n-tabs .e-n-tabs-heading {
    padding: 4px !important;
    background-color: #FFFFFF !important;
    border-radius: 30px !important;
}

.elementor-widget-n-tabs .e-n-tab-title-text {
    font-size: clamp(13px, 12.4444px + 0.1852vw, 16px) !important;
}




/* =========================================
   1. ДЕСКТОПНІ ТА ЗАГАЛЬНІ СТИЛІ КОНТЕЙНЕРА
   ========================================= */
.elementor-3510 .elementor-element.elementor-element-9729c5c .e-n-tabs-heading {
    background: #E19E881A;
    border-radius: 50px;
    padding: 6px; /* Відступ для ефекту "пігулки" */
    display: flex;
    gap: 8px; /* Відстань між вкладками */
    align-items: center;
    border: none;
}

/* =========================================
   2. СТИЛІ НЕАКТИВНОЇ ВКЛАДКИ
   ========================================= */
.elementor-3510 .elementor-element.elementor-element-9729c5c .e-n-tab-title {
    background: #E19E881A;
    border-radius: 50px;
    border: none;
    padding: clamp(8px, calc(6.545px + 0.455vw), 12px) clamp(10px, calc(4.909px + 1.591vw), 24px);
    transition: all 0.3s ease;
    justify-content: center;
    white-space: nowrap;
    flex: 1; /* Робить вкладки однакової ширини, за потреби можна видалити */
}

/* =========================================
   2.1. СТИЛІ ПРИ НАВЕДЕННІ (HOVER) ДЛЯ НЕАКТИВНИХ ВКЛАДОК
   ========================================= */

/* 1. Змінюємо фон самої вкладки при наведенні (робимо його синім, як активна) */
.elementor-3510 .elementor-element.elementor-element-9729c5c .e-n-tab-title:not([aria-selected="true"]):hover {
    background: #c2acb6;
}

/* 2. Змінюємо текст всередині вкладки при наведенні (робимо його білим та читабельним) */
.elementor-3510 .elementor-element.elementor-element-9729c5c .e-n-tab-title:not([aria-selected="true"]):hover .e-n-tab-title-text {
    color: #FFFFFF;
    -webkit-text-fill-color: #FFFFFF; /* Обов'язково скидаємо градієнт тексту */
    background: none; /* Скидаємо фон градієнта */
}

/* Текст неактивної вкладки (Градієнт) */
.elementor-3510 .elementor-element.elementor-element-9729c5c .e-n-tab-title[aria-selected="false"] .e-n-tab-title-text {
    font-family: 'TT Norms Pro Expanded', sans-serif;
    font-weight: 500;
    font-size: clamp(14px, 13.6296px + 0.1235vw, 16px);
    line-height: 20px;
    background: #E19E88;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
}

/* =========================================
   3. СТИЛІ АКТИВНОЇ ВКЛАДКИ
   ========================================= */
.elementor-3510 .elementor-element.elementor-element-9729c5c .e-n-tab-title[aria-selected="true"] {
    background: #E19E88;
}

/* Текст активної вкладки (Білий) */
.elementor-3510 .elementor-element.elementor-element-9729c5c .e-n-tab-title[aria-selected="true"] .e-n-tab-title-text {
    font-family: 'TT Norms Pro Expanded', sans-serif;
    font-weight: 500;
    font-size: clamp(14px, 13.6296px + 0.1235vw, 16px);
    line-height: 20px;
    color: #FFFFFF;
    background: none;
    -webkit-text-fill-color: #FFFFFF;
}


@media (max-width: 1024px) {
    /* =========================================
   2. СТИЛІ НЕАКТИВНОЇ ВКЛАДКИ
   ========================================= */
.elementor-3510 .elementor-element.elementor-element-9729c5c .e-n-tab-title {
    white-space: nowrap;
    }
}

/* =========================================
   4. МОБІЛЬНА ВЕРСІЯ (ВИПАДАЮЧЕ МЕНЮ)
   ========================================= */
@media (max-width: 767px) {
    /* Контейнер у закритому стані (виглядає як синя кнопка зі скріншоту) */
    .elementor-3510 .elementor-element.elementor-element-9729c5c .e-n-tabs-heading {
        flex-direction: column;
        background: #E19E881A;
        border-radius: 30px;
        padding: 0;
        cursor: pointer;
        position: relative;
        z-index: 10;
        gap: 5px !important;
    }

    /* Ховаємо неактивні вкладки */
    .elementor-3510 .elementor-element.elementor-element-9729c5c .e-n-tab-title:not([aria-selected="true"]) {
        display: none;
    }

    /* Активна вкладка стає "шапкою" випадаючого меню */
    .elementor-3510 .elementor-element.elementor-element-9729c5c .e-n-tab-title[aria-selected="true"] {
        background: transparent;
        box-shadow: none;
        width: 100%;
        padding: 16px 24px;
    }

    /* Додаємо білу стрілочку (SVG) */
    .elementor-3510 .elementor-element.elementor-element-9729c5c .e-n-tab-title[aria-selected="true"]::after {
        content: '';
        position: absolute;
        right: 24px;
        top: 50%;
        transform: translateY(-50%);
        width: 14px;
        height: 8px;
        background-image: url("data:image/svg+xml,%3Csvg width='14' height='8' viewBox='0 0 14 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L7 7L13 1' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
        background-size: contain;
        background-repeat: no-repeat;
        transition: transform 0.3s ease;
    }

    /* --- СТИЛІ ПРИ ВІДКРИТОМУ МЕНЮ (клас .dropdown-open додається через JS) --- */
    .elementor-3510 .elementor-element.elementor-element-9729c5c .e-n-tabs-heading.dropdown-open {
        background: #F7F9FC;
        padding: 6px;
    }

    .elementor-3510 .elementor-element.elementor-element-9729c5c .e-n-tabs-heading.dropdown-open .e-n-tab-title:not([aria-selected="true"]) {
        display: flex;
        background: #FFFFFF; 
        margin-top: 4px;
        width: 100%;
        padding: 16px 24px;
    }

    .elementor-3510 .elementor-element.elementor-element-9729c5c .e-n-tabs-heading.dropdown-open .e-n-tab-title[aria-selected="true"] {
        background: #e19e88;
    }

    /* Перевертаємо стрілочку при відкритті */
    .elementor-3510 .elementor-element.elementor-element-9729c5c .e-n-tabs-heading.dropdown-open .e-n-tab-title[aria-selected="true"]::after {
        transform: translateY(-50%) rotate(180deg);
    }
}/* End custom CSS */