/* Контейнер для кнопки */
.booksy-widget-container-dialog {
    position: fixed; /* Зробити контейнер кнопки плаваючим */
    bottom: 8%; /* Відстань від нижнього краю у відсотках */
    right: 5%; /* Відстань від правого краю у відсотках */
    z-index: 1000; /* Встановити високий z-index, щоб кнопка була поверх інших елементів */
    opacity: 0.7; /* Встановити прозорість на 70% */
    padding: 10px; /* Внутрішні відступи */
    border-radius: 8px; /* Закруглені кути */
    display: flex; /* Використовуємо flexbox для вирівнювання вмісту */
    align-items: center; /* Вертикальне вирівнювання */
    justify-content: center; /* Горизонтальне вирівнювання */
}

/* Стилі для кнопки */
.custom-button {
    width: 80px; /* Встановіть ширину */
    height: 80px; /* Встановіть висоту */
    border-radius: 50%; /* Зробіть кнопку круглою */
    background-color: #26cbc5; /* Початковий колір фону */
    color: #fff; /* Задайте колір тексту */
    display: flex; /* Використовуйте flex для центрування тексту */
    align-items: center; /* Вертикальне центрування */
    justify-content: center; /* Горизонтальне центрування */
    cursor: pointer; /* Змінити курсор на pointer */
    transition: background-color 0.3s ease, box-shadow 0.3s ease; /* Додати анімацію при наведенні */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Додати тінь */
}

/* Стилі для кнопки Booksy */
.booksy-widget-container-default.booksy-widget-container-pl .booksy-widget-button {
    background: url('https://static.tildacdn.com/tild3264-3165-4339-b634-313730303530/noroot.png') no-repeat center center !important;
    background-size: contain !important; /* Або 'cover', в залежності від ваших потреб */
    width: 100px; /* Ширина кнопки */
    height: 100px; /* Висота кнопки */
    border-radius: 50%; /* Кругла форма */
    padding: 0 !important; /* Відсутність відступів */
    display: flex; /* Для центрування вмісту */
    align-items: center; /* Вертикальне центрування */
    justify-content: center; /* Горизонтальне центрування */
}

/* Сховати елемент */
.booksy-business-link {
    display: none !important; /* Сховати елемент */
}

/* Стилі для кнопки при наведенні */
.booksy-widget-container-default.booksy-widget-container-pl .booksy-widget-button:hover {
    background-color: #1a9a8a; /* Колір фону при наведенні */
    transform: scale(1.05); /* Збільшення кнопки при наведенні */
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4); /* Велика тінь при наведенні */
}

.booksy-widget-container-default.booksy-widget-container-pl .booksy-widget-button:active {
    transform: scale(0.95); /* Зменшення кнопки при натисканні */
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3); /* Менша тінь при натисканні */
}

/* Стилі для мобільних пристроїв */
@media (max-width: 768px) {
    .booksy-widget-container-dialog {
        bottom: 10%; /* Змінити відстань від нижнього краю для мобільних */
        right: -10%; /* Змінити відстань від правого краю для мобільних */
    }      
        



.t-btn.t393__submit {
    position: fixed !important; /* Плаваюча кнопка */
    right: 20px !important; /* Відступ від правого краю */
    top: 80% !important; /* Центрована вертикально */
    transform: translateY(-50%) !important; /* Центрування по вертикалі */
    z-index: 1000 !important; /* Високий пріоритет відображення */
    background-color: #44c3d0 !important; /* Колір кнопки */
    color: #ffffff !important; /* Колір тексту */
    border-radius: 50% !important; /* Кругла форма */
    
    height: 100px !important; /* Висота кнопки */
    display: flex !important; /* Для центрування тексту */
    justify-content: center !important; /* Горизонтальне вирівнювання */
    align-items: center !important; /* Вертикальне вирівнювання */
    font-size: 20px !important; /* Розмір тексту */
    text-decoration: none !important; /* Прибираємо підкреслення */
    opacity: 0.9 !important; /* Непрозорість 90% */
    box-shadow: 0px 10px 20px rgba(0, 11, 48, 0.25) !important; /* Тінь */
    cursor: pointer !important; /* Вказівник при наведенні */
    transition: all 0.3s ease !important; /* Плавні переходи */
}

/* Ефект при наведенні */
.t-btn.t393__submit:hover {
    background-color: #3699a7 !important; /* Темніший колір при наведенні */
    opacity: 1 !important; /* Повна непрозорість */
}
