/*.mdc-tooltip__surface {*/
/*    background-color: var(--mdc-theme-surface,#fff);*/
/*    color: var(--mdc-theme-on-surface,#000);*/
/*    text-decoration: none;*/
/*    border-radius: var(--mdc-card-radius,4px);*/
/*    box-shadow: 0 2px 1px -1px rgb(0 0 0 / 20%), 0 1px 1px 0 rgb(0 0 0 / 14%), 0 1px 3px 0 rgb(0 0 0 / 12%);*/
/*    padding: 0.5em;*/
/*}*/

/*.mdc-tooltip__surface > p {*/
/*    margin: 0 !important;*/
/*}*/


.entry-content [data-title] {
    position: relative;
    --arrow-size: 10px;
    --background-color: var(--palette-common-white);
    cursor: pointer;
}
.entry-content [data-title]:before {
    content: ' ';
    position: absolute;
    top: calc(-1 * var(--arrow-size));
    left: 50%;
    transform: translateX(-50%);
    z-index: 999999;
    opacity: 0;
    visibility: hidden;
    width: 0;
    height: 0;
    border-left: var(--arrow-size) solid transparent;
    border-right: var(--arrow-size) solid transparent;
    border-top: var(--arrow-size) solid var(--background-color);
}
.entry-content [data-title]:after {
    border-radius: 8px;
    content: attr(data-title);
    background: var(--background-color);
    position: absolute;
    padding: 12px;
    box-shadow: 0 1px 2px 0 rgba(60,64,67,.3), 0 2px 6px 2px rgba(60,64,67,.15);
    z-index: 99999;
    opacity: 0;
    visibility: hidden;
    width: max-content;
    bottom: calc(100% + var(--arrow-size));
    left: 0;
    transform: translateX(-50%);
    max-width: 320px;
}
.entry-content [data-title]:hover:before,
.entry-content [data-title]:hover:after
{
    opacity: 1;
    transition: all 0.1s ease 0.5s;
    visibility: visible;
}

.entry-content .tooltip-left [data-title]:after {
    transform: translateX(-10%);
}
.entry-content .tooltip-right [data-title]:after {
    transform: translateX(-90%);
}

.entry-content [data-title] > img.svg-icon {
    width: 18px;
    height: 18px;
    vertical-align: text-bottom;
}