/*
Theme Name:GORN 2 Дочерняя тема
Theme URI: https://goodwinpress.ru/tema-gorn-2
Author: GoodwinPress
Author URI: https://goodwinpress.ru/
Description: Используем дочернюю тему лишь в тех случаях, когда собрались менять стили, разметку или функции темы. Просто так ее ставить не требуется.
Text Domain: gorn-2
Domain Path: /languages
Template: gorn-2
*/

/* Размещайте ваши стили под этой строкой. */ 




.phone-item {
    position: relative;
}

/* Верхняя строка */
.phone-item__top {
    display: flex;
    align-items: center;
    gap: 7px;
}

/* Стрелочка */
.contacts-item__arrow {
    font-size: 9px;
    transition: transform 0.25s ease;
}

/* Выпадающий блок */
.phone-item__dropdown {
    position: absolute;
    top: calc(100% + 10px);
    left: 0px;

    min-width: 220px;

    padding: 15px 20px 15px 40px;

    background: #fff;
    border-radius: 5px;

    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.2);

    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);

    transition:
        opacity 0.25s ease,
        transform 0.25s ease,
        visibility 0.25s ease;

    z-index: 9999;
}

/* Треугольник сверху */
.phone-item__dropdown::before {
    content: "";

    position: absolute;
    top: -6px;
    left: 15px;

    width: 12px;
    height: 12px;

    background: #fff;

    transform: rotate(45deg);
}

/* Второй телефон */
.phone-item__dropdown > a {
    display: block;

    margin-bottom: 8px;

    white-space: nowrap;

    text-decoration: none;
}

/* Обратный звонок */
.phone-item__dropdown .phone-item__callback {
    margin-top: 10px;
    margin-bottom: 0;

    font-size: 13px;
}

/* НАВЕДЕНИЕ НА ВЕСЬ БЛОК */
.phone-item:hover .phone-item__dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* Поворачиваем стрелку */
.phone-item:hover .contacts-item__arrow {
    transform: rotate(180deg);
}	
	  
	  .phone-item::before {
    background-image: url(https://wabco-knorr.ru/wp-content/themes/gorn-2/assets/img/phone.svg);
}