/* Tooltips da aplicación: tarxeta branca co texto mariño, borde fino, sombra suave e o filo dourado á
   esquerda. Un só aspecto para os dous tipos que hai:
   - os de Bootstrap (.tooltip, as iconas de acción dos listados): só CSS;
   - os do atributo «title», que o navegador debuxa ao seu xeito e non se poden estilizar: amósaos
     js/tooltips.js cun .nx-tip. */

.tooltip { font-family: Poppins, sans-serif !important; opacity: 1 !important; }
.tooltip .tooltip-inner,
.nx-tip {
    max-width: 280px;
    padding: 7px 11px 7px 13px !important;
    border: 1px solid #e4e7ee;
    border-radius: 8px !important;
    background: #fff !important;
    box-shadow: inset 3px 0 0 #deb64a, 0 8px 22px -8px rgba(22, 28, 49, .35) !important;
    color: #2c3862 !important;
    font: 500 12px/1.45 Poppins, sans-serif !important;
    text-align: left !important;
    white-space: normal;
    overflow-wrap: anywhere;
}
/* As frechas de Bootstrap, en branco coma a tarxeta. */
.tooltip.top .tooltip-arrow { border-top-color: #fff !important; }
.tooltip.bottom .tooltip-arrow { border-bottom-color: #fff !important; }
.tooltip.left .tooltip-arrow { border-left-color: #fff !important; }
.tooltip.right .tooltip-arrow { border-right-color: #fff !important; }
.tooltip .tooltip-arrow { filter: drop-shadow(0 1px 0 #e4e7ee); }

/* O dos «title». Vai fixo na pantalla e non recolle o rato (non pode tapar o que hai debaixo). */
.nx-tip {
    position: fixed;
    z-index: 100000;
    pointer-events: none;
    opacity: 0;
    transform: translateY(3px);
    transition: opacity .12s ease, transform .12s ease;
}
.nx-tip.nx-tip--on { opacity: 1; transform: none; }
.nx-tip::after {
    content: "";
    position: absolute;
    left: var(--nx-tip-frecha, 50%);
    bottom: -6px;
    margin-left: -6px;
    border: 6px solid transparent;
    border-bottom: 0;
    border-top-color: #fff;
    filter: drop-shadow(0 1px 0 #e4e7ee);
}
/* Debaixo do elemento (cando non cabe enriba): a frecha cara arriba. */
.nx-tip.nx-tip--abaixo { transform: translateY(-3px); }
.nx-tip.nx-tip--abaixo.nx-tip--on { transform: none; }
.nx-tip.nx-tip--abaixo::after { bottom: auto; top: -6px; border-top: 0; border-bottom: 6px solid #fff; border-top-color: transparent; filter: drop-shadow(0 -1px 0 #e4e7ee); }
@media (prefers-reduced-motion: reduce) { .nx-tip { transition: none; } }
