/*
 Theme Name:   Astra Child
 Description:  My Theme Child Theme
 Template:     astra
 Version:      1.0.0
*/

/* Import стилі з батьківської теми */
@import url("../astra/style.css");

/* Ваші додаткові стилі тут */

/* Контейнер форми вакансії */
.horizontalForm {
    display: flex;
    flex-wrap: wrap;
    margin-left: -10px; /* Виправлене значення */
    margin-right: -10px; /* Виправлене значення */
    align-items: flex-end;
    row-gap: 15px;
    margin-bottom: 40px;
}

/* Поля */
.horizontalField {
    width: 40%;
}

/* Кнопка */
.formSubmit {
    width: 20%;
}

.wpcf7-submit {
    width: 100%;
}

.horizontalField,
.formSubmit {
    padding-right: 10px; /* Виправлене значення */
    padding-left: 10px; /* Виправлене значення */
}

.horizontalField input,
.horizontalField label,
[data-name="acceptance"] {
    width: 100%;
}

/* Подтверждение */
.wpcf7-list-item {
    margin-left: 10px;
}

/* Спиннер */
.wpcf7-spinner {
    display: none;
}

/* Ошибка валидации */
.wpcf7-not-valid-tip {
    position: absolute;
    top: -38px;
    right: 0;
}

input[type="text"].wpcf7-not-valid,
input[type="email"].wpcf7-not-valid,
input[type="tel"].wpcf7-not-valid {
    border-color: #dc3232;
}

@media (max-width: 800px) {
    .horizontalForm {
        flex-direction: column;
    }

    .horizontalField,
    .formSubmit {
        width: 100%;
    }

    .formSubmit {
        order: 1;
    }
}

/* Контейнер групи кнопок категорій */
.menu_kat {
    position: relative;
    top: -2px;
    opacity: 0.8; /* Виправлене значення */
    gap: 3px;
}

.btn-group {
    gap: 3px;
    cursor: pointer;
}

.btn-group button {
    min-width: 150px;
    background-color: #C0C0C0;
    margin: 6px;
    padding: 5px 5px; /* Виправлене значення */
    border: 2px solid #000000; /* Black border */
    color: #000000; /* Black text */
    text-shadow: 1px 1px 1px #ffffff;
    cursor: pointer; /* Pointer/hand icon */
    float: left; /* Float the buttons side by side */
    font-family: Montserrat Alternates;
}

.btn-group button:not(:last-child) {
    border-right: none; /* Prevent double borders */
}

/* Clear floats (clearfix hack) */
.btn-group:after {
    content: "";
    clear: both;
    display: table;
}

/* Add a background color on hover */
.btn-group button:hover {
    background-color: #DCDCDC;
    transform: scale(1.1); /* Збільшення при наведенні */
}

/* Округлення зображень товарів на сторінці з ID 570 */
body.page-id-570 .astra-shop-thumbnail-wrap img {
    width: 150px !important; /* Ширина зображення */
    height: auto !important; /* Встановити висоту для округленого вигляду */
    object-fit: cover !important; /* Забезпечує рівномірне відображення зображення */
    border-radius: 50% !important; /* Робить зображення круглим */
    transition: transform 0.3s ease, box-shadow 0.3s ease !important; /* Додає плавність для анімацій */
}

/* Збільшення зображення при наведенні */
body.page-id-570 .astra-shop-thumbnail-wrap img:hover {
    transform: scale(1.2) !important; /* Збільшення при наведенні */
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.3) !important; /* Тінь при наведенні */
}

/* Відображати короткий опис товарів на сторінці з ID 570 */
body.page-id-570 ul.products li.product .woocommerce-product-details__short-description {
    display: block; /* Зробити видимим блок з коротким описом */
    font-size: 12px; /* Налаштуйте розмір шрифту за потребою */
    color: #333; /* Колір тексту опису */
    margin-top: 5px; /* Відступ зверху */
}

/* Зміна стилів заголовків товарів на сторінці з ID 570 */
body.page-id-570 ul.products li.product .woocommerce-loop-product__title {
    font-weight: 800 !important; /* Використовуємо !important для пріоритетності */
    font-size: 20px; /* Збільшення шрифту */
    color: #ffffff; /* Колір тексту */
}

/* Зміна стилів заголовків товарів на сторінці з ID 570 для мобільної версії */
@media only screen and (max-width: 768px) {
    body.page-id-570 ul.products li.product .woocommerce-loop-product__title {
        font-weight: 800 !important; /* Використовуємо !important для пріоритетності */
        font-size: 20px !important; /* Збільшення шрифту */
        color: #ffffff; /* Колір тексту */
    }
}

/* Приховати блок сортування товарів на сторінці з ID 570 */
body.page-id-570 .woocommerce-ordering {
    display: none; /* Сховати блок сортування */
}

/* Встановлює однакову висоту для заголовків товарів */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
    min-height: 60px; /* Встановлює мінімальну висоту */
}

/* Розмір шрифта короткого опису товарів для мобільній версії */
@media only screen and (max-width: 768px) {
    .ast-woo-shop-product-description {
        font-size: 10px; /* Налаштуйте потрібний розмір шрифту */
    }
}

/* Зміна кольору тексту при наведенні миші */
body.page-id-570 .wp-block-navigation-item .wp-block-navigation-link a:hover {
    color: #ff0000 !important; /* Колір тексту при наведенні миші */
    transform: scale(1.1); /* Збільшення на 10% при наведенні */
    transition: transform 0.3s ease; /* Плавний перехід збільшення */
}

body.page-id-570 .more-info-button {
    display: inline-block; /* Зробити кнопку блочним елементом */
    width: 100px; /* Встановіть бажану ширину */
    height: 30px; /* Встановіть бажану висоту */
    padding: 5px 10px; /* Встановіть відступи для кнопки */
    text-align: center; /* Вирівняти текст по центру */
    font-size: 12px; /* Зменште розмір шрифту кнопки */
    margin: 0 auto; /* Центрувати кнопку */
    display: block; /* Зробити кнопку блочним елементом для центрування */
}

/* стилі кнопки гутенберг */
.gutentor-block-button:hover {
    color: #ffffff; 
    background-color: var(--ast-global-color-0);
    background-image: none;
    border-style: solid;
    border-width: 2px 2px 2px 2px;
    border-color: [object Object];
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
}

/* прибирає дату та автора посту на сторінці загальне меню */
.entry-meta, .posted-on, .author-name {
    display: none !important;
}

/* 1. Головна обгортка: ставить Адресу і блок Телефонів у стовпчик */
.header-contacts-wrapper {
    display: flex;
    flex-direction: column;
    gap: 4px; /* ЗМЕНШЕНО: Відступ між Адресою і першим телефоном (було 8px) */
    align-items: flex-start;
}

/* 2. ВИПРАВЛЕННЯ АДРЕСИ: змушує іконку і текст бути в один рядок */
.header-contacts-wrapper .address-link {
    display: flex !important;    /* Критично важливо для вирівнювання */
    align-items: center;         /* Центрує іконку відносно тексту */
    text-decoration: none;
    color: inherit;
}

/* Відступи для іконки адреси */
.header-contacts-wrapper .address-link i {
    margin-right: 8px;
    margin-bottom: 0 !important; /* Прибирає зайві відступи теми */
    width: auto;
}

/* 3. Контейнер телефонів: ставить телефони один під одним */
.phones-container {
    display: flex;
    flex-direction: column;      /* Вертикальний стовпчик */
    gap: 0px;                    /* ЗМІНЕНО: 0px прибирає відступ між телефонами */
    margin: 0;
    padding: 0;
}

/* 4. Окремий рядок телефону: іконка + номер в рядок */
.phone-item {
    display: flex;
    align-items: center;
    margin-bottom: 2px;          /* Мікро-відступ між рядками (можна видалити, якщо треба ще тісніше) */
}

/* Відступи для іконок телефонів */
.phone-item i {
    margin-right: 8px;
    margin-bottom: 0 !important;
}

/* Прибираємо зайві відступи у посилань */
.phone-item a, 
.info-icon-box {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.1;           /* ЗМЕНШЕНО: робить рядки трохи нижчими (було 1.2) */
    text-decoration: none;
}