.elementor-kit-12{--e-global-color-primary:#F5F5F5;--e-global-color-secondary:#101010;--e-global-color-text:#F5F5F5;--e-global-color-accent:#DC2626;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-size:42px;--e-global-typography-primary-font-weight:700;--e-global-typography-secondary-font-family:"Roboto";--e-global-typography-secondary-font-size:24px;--e-global-typography-secondary-font-weight:700;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-size:14px;--e-global-typography-text-font-weight:500;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-size:18px;--e-global-typography-accent-font-weight:700;background-color:#101010;color:var( --e-global-color-primary );}.elementor-kit-12 button,.elementor-kit-12 input[type="button"],.elementor-kit-12 input[type="submit"],.elementor-kit-12 .elementor-button{background-color:#DC2626;color:var( --e-global-color-primary );}.elementor-kit-12 button:hover,.elementor-kit-12 button:focus,.elementor-kit-12 input[type="button"]:hover,.elementor-kit-12 input[type="button"]:focus,.elementor-kit-12 input[type="submit"]:hover,.elementor-kit-12 input[type="submit"]:focus,.elementor-kit-12 .elementor-button:hover,.elementor-kit-12 .elementor-button:focus{background-color:#242424;color:var( --e-global-color-primary );}.elementor-kit-12 e-page-transition{background-color:#FFBC7D;}.elementor-kit-12 h1{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );}.elementor-kit-12 h2{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-size:var( --e-global-typography-secondary-font-size );font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-kit-12 h3{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-size:var( --e-global-typography-secondary-font-size );font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-kit-12 h1{font-size:var( --e-global-typography-primary-font-size );}.elementor-kit-12 h2{font-size:var( --e-global-typography-secondary-font-size );}.elementor-kit-12 h3{font-size:var( --e-global-typography-secondary-font-size );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-12 h1{font-size:var( --e-global-typography-primary-font-size );}.elementor-kit-12 h2{font-size:var( --e-global-typography-secondary-font-size );}.elementor-kit-12 h3{font-size:var( --e-global-typography-secondary-font-size );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* --- СТИЛІЗАЦІЯ ПОВІДОМЛЕНЬ WOOCOMMERCE --- */

/* 1. Загальний блок повідомлення (успіх, інфо, помилка) */
.woocommerce-message, 
.woocommerce-info, 
.woocommerce-error {
    
    background-color: #191919 !important; /* Темний фон */
    color: #f5f5f5 !important; /* Білий текст */
display: flex !important;
    align-items: center !important; /* Центруємо текст і кнопку по вертикалі */
    justify-content: space-between !important; /* Розносимо їх по краях */
    width: 100% !important;
    border: 0px !important;
    border-radius:0px 0px 25px 25px;
    font-size: 16px !important;
    padding: 15px 80px !important;
    margin-bottom: 0px !important;
}

/* 2. Змінюємо колір іконок (галочка або знак оклику) */
/* ::before - це сама іконка */
.woocommerce-message::before,
.woocommerce-info::before {
    color: #DC2626 !important; /* Червона іконка */
}

/* 3. Кнопка всередині повідомлення (наприклад, "Переглянути кошик") */
.woocommerce-message .button, 
.woocommerce-info .button, 
.woocommerce-error .button {
    order: 2 !important; /* Переносимо кнопку в кінець (направо) */
    margin-left: auto !important;
    background-color: #232323 !important; /* Прозорий фон */
    
    color: #f5f5f5 !important; /* Білий текст */
    border-radius: 10px !important;
    
    padding: 10px 15px !important;
    font-weight: bold !important;
    transition: all 0.3s ease !important;
    float: right !important; /* Кнопка праворуч */
}

/* 4. Ефект при наведенні на кнопку */
.woocommerce-message .button:hover, 
.woocommerce-info .button:hover, 
.woocommerce-error .button:hover {
    background-color: #DC2626 !important; /* Заливаємо червоним */
    color: #f5f5f5 !important;
    opacity: 1 !important;
}

/* 5. Посилання всередині тексту (якщо є) */
.woocommerce-message a:not(.button), 
.woocommerce-info a:not(.button) {
    color: #f5f5f5 !important;
    text-decoration: underline !important;
}
/* ВИРІВНЮВАННЯ ІКОНКИ (Галочки) */
.woocommerce-message::before, 
.woocommerce-info::before, 
.woocommerce-error::before {
    /* 1. Робимо її частиною загального рядка */
    position: static !important; 
    float: none !important; 
    display: inline-flex !important;
    align-items: center !important;
    
    /* 2. Скидаємо старі зміщення, які піднімали її вгору */
    margin-top: 0 !important; 
    top: auto !important;
    transform: none !important;
    
    /* 3. Налаштування вигляду */
    margin-right: 15px !important; /* Відступ до тексту */
    color: #D02B2B !important; /* Червоний колір */
    font-size: 18px !important; /* Розмір іконки */
    line-height: 1 !important; /* Щоб не було зайвих відступів зверху/знизу */
    height: auto !important;
}
/* Прибираємо синю рамку/лінію при фокусі на повідомленні */
.woocommerce-message:focus,
.woocommerce-info:focus,
.woocommerce-error:focus,
.woocommerce-message:focus-visible,
.woocommerce-info:focus-visible,
.woocommerce-error:focus-visible {
    outline: none !important; /* Прибирає стандартну обводку */
    border-bottom: none !important; /* На всяк випадок, якщо це бордер */
}
/* Прибираємо стрілочки в Chrome, Safari, Edge, Opera */
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Прибираємо стрілочки в Firefox */
input[type=number] {
    -moz-appearance: textfield;
}/* End custom CSS */