/* Punto de color del tipo de árbol administrado (js/Shared/cTipoArbolAdmin.js) */

.puntoTipoArbol {
    display: inline-block;
    position: relative;
    width: 10px;
    height: 10px;
    margin-left: 2px;
    border-radius: 50%;
    vertical-align: middle;
}

    /* Área pulsable de unos 28px aunque el punto se vea de 10px */
    .puntoTipoArbol::before {
        content: '';
        position: absolute;
        top: -9px;
        right: -9px;
        bottom: -9px;
        left: -9px;
    }

/* Posición según el sitio (todos los tamaños). El punto va dentro del nombre (así lo mueve el JS al cambiar de
   árbol) pero se coloca respecto al elemento posicionado que lo contiene, fuera del recorte (overflow) del nombre.
   Menú: lista y cabecera con los puntos en la misma vertical, a 12px del borde derecho (hueco reservado de 30px). */
#menuLateral .misArbolesItem {
    position: relative;
    padding-right: 30px;
}

    #menuLateral .misArbolesItem .puntoTipoArbol {
        position: absolute;
        top: 50%;
        right: 12px;
        margin: -5px 0 0 0;
    }

/* Cabecera "Mi árbol": como en la lista, centrado en vertical y a 12px del borde derecho */
#menuLateral #miArbol {
    position: relative;
    padding-right: 30px;
}

    #menuLateral #miArbol .puntoTipoArbol {
        position: absolute;
        top: 50%;
        right: 12px;
        margin: -5px 0 0 0;
    }

/* "Ver todos": esquina superior derecha del recuadro de cada árbol (.tableCirculo ya es position:relative) */
.tableCirculo .puntoTipoArbol {
    position: absolute;
    top: 8px;
    right: 8px;
    margin: 0;
}

.puntoTipoArbol-propio {
    background-color: #82a542;
}

.puntoTipoArbol-representado {
    background-color: #0377aa;
}

.puntoTipoArbol-delegado {
    background-color: #c0392b;
}

#burbujaTipoArbol {
    display: none;
    position: fixed;
    z-index: 100000;
    box-sizing: border-box;
    max-width: 240px;
    padding: 6px 10px;
    border-radius: 4px;
    background-color: #333;
    color: #fff;
    font-size: 13px;
    font-weight: normal;
    line-height: 1.35;
    text-align: left;
    white-space: normal;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25);
    pointer-events: none;
}