.porto-tooltip-wrap .tooltip-inner {
    // max-width: 300px;
    // background-color: rgba(0, 113, 161, .7);
    display: flex;
    max-width: none;
    padding: 0;
    background-color: transparent;
}
.porto-block.has-pb-edit:hover {
    outline: 1px solid rgba(0, 136, 204, 0.4);
}

.porto-tooltip-wrap {
    [data-bs-original-title]:hover &.show {
        z-index: 1000;
    }
    span {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }
    &.bs-tooltip-top {
        margin-bottom: -45px !important;
        .tooltip-inner a::after {
            top: 100%;
            left: 50%;
            transform: translateX(-50%);
            border-top-color: #0071a1;
            border-width: 0.4rem 0.4rem 0;
        }
        .tooltip-inner a:nth-child(2)::after {
            border-top-color: #47a447;
        }
    }
    &.bs-tooltip-bottom {
        margin-top: -45px !important;
        .tooltip-inner a::after {
            bottom: 100%;
            left: 50%;
            transform: translateX(-50%);
            border-width: 0 0.4rem 0.4rem;
            border-bottom-color: #0071a1;
        }
        .tooltip-inner a:nth-child(2)::after {
            border-bottom-color: #47a447;
        }
    }
    &.bs-tooltip-end {
        .tooltip-inner {
            flex-direction: column;
            a::after {
                top: 50%;
                transform: translateY(-50%);
                right: 100%;
                border-right-color: #0071a1;
                border-width: 0.4rem 0.4rem 0.4rem 0;
            }
            a:nth-child(2)::after {
                border-right-color: #47a447;
            }
        }
    }
    &.bs-tooltip-start {
        .tooltip-inner {
            flex-direction: column;
            a::after {
                top: 50%;
                transform: translateY(-50%);
                left: 100%;
                border-left-color: #0071a1;
                border-width: .4rem 0 .4rem .4rem;
            }
            a:nth-child(2)::after {
                border-left-color: #47a447;
            }
        }
    }
    &.empty-tooltip {
        .tooltip-inner {
            margin: 15px;
            border: 2px dotted var(--porto-primary-color);
            border-radius: 4px;
            a {
                flex: 1;
                max-width: none;
                justify-content: center;
                background-color: transparent;
                border-radius: 4px;
                color: var(--porto-primary-color);
                transition: color 0.3s, background-color 0.3s;
            }
            i {
                font-size: 18px;
            }
            &:hover a {
                background-color: var(--porto-primary-color);
                color: #fff;
            }
        }
    }
}
.container,
.container-fluid {
    .porto-tooltip-wrap.empty-tooltip .tooltip-inner {
        margin-left: 0;
        margin-right: 0;
    }
}
.porto-tooltip-wrap .tooltip-inner a {
    display: flex;
    align-items: center;
    position: relative;
    color: #fff;
    font-family: inherit !important;
    font-weight: 600 !important;
    font-size: 0.765625rem !important;
    text-decoration: none !important;
    max-width: 300px;
    margin: 5px;
    background-color: rgba(0,113,161,0.7);
    padding: .25rem .5rem;
    transition: background-color .3s;
    &:hover {
        background-color: #0071a1;
        &::after {
            opacity: 1;
        }
    }
    &:nth-child(2) {
        background-color: rgb(71 164 71 / 70%);
        &:hover {
            background-color: #47a447;
        }
    }
    &::after {
        content: '';
        position: absolute;
        border-color: transparent;
        border-style: solid;   
        opacity: 0.7;
        transition: opacity 0.3s;
    }
}