﻿:root {
    --circle-menu-dim: 36px;
    --icon-dim: 24px;
    --circle-menu-dim-sm: 20px;
}

/***select action UL list START**/
.entityCTA {
    position: relative;
    /*width: 150px;*/
}

    .entityCTA .entityCTA_wrapper {
        max-width: var(--circle-menu-dim);
        float: right;
    }

        .entityCTA .entityCTA_wrapper.smallabsolute{
            position:absolute;
        }

.entityCTA_dd_trigger, .entityCTA_dd_trigger_sqv {
    /*height: 25px;
    box-shadow: 0px 0px 0px 1px silver;
    background-color: white;
    overflow: hidden;
    position: relative;
    cursor: pointer;*/
    height: var(--circle-menu-dim);
    width: var(--circle-menu-dim);
    float: right;
    box-shadow: 0px 0px 0px 2px #c0c0c0cf;
    background-color: white;
    overflow: hidden;
    position: relative;
    cursor: pointer;
    border-radius: 20px;
    transition: all .5s linear;
    /** these 3 rules help center text created w/in*/
    display: flex;
    justify-content: center;
    align-items: center;
    /******/
}

.entityCTA_dd_trigger_sqv {
    box-shadow: none;
    width: 32px;
    height: 32px;
}


            .entityCTA_dd_trigger.smallversion {
                height: var(--circle-menu-dim-sm);
                width: var(--circle-menu-dim-sm);
                box-shadow: none;
            }
    .entityCTA_dd_trigger:before {
        /*content: '\25BD';*/
        content: '\00B7\00B7\00B7';
        font-size: 1.75rem;
        /* position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);*/
        color: #000000b5;
    }

.entityCTA_dd_trigger_sqv:before {
    content: '\25BD';
    font-size: 1.75rem;
    color: #000000b5;
}

.entityCTA_dd_trigger.smallversion:before {
    font-size: 1rem;
}
    /*    .entityCTA_dd_trigger.open:before {
        content: '\25BD';
        font-size: 1.25rem;
        position: absolute;
        transform: rotate(180deg);
        right: 0px;
        top: 2px;
        color: black;
    }*/
    .entityCTA_dd_trigger:hover {
        background-color: #c0c0c042;
    }


.entityCTA_dd {
    height: 0;
    overflow: hidden;
    background-color: white;
    text-align: left;
}


.entityCTA_dd_conn {
    position: absolute;
    width: 0;
    height: 0;
    border-width: 10px;
    border-style: solid;
    border-color: transparent #ededed transparent transparent;
    top: 8px;
    right: -20px;
    z-index: 16;
    transform: rotate(-180deg);
    opacity: 0;
}

tbody:has(tr:nth-child(2)) tbody tr:last-child .entityCTA_dd.open,
tbody:has(tr:nth-child(3)) tbody tr:nth-last-child(-n+2) .entityCTA_dd.open, 
tbody:has(tr:nth-child(5)) tr:nth-last-child(-n+3) .entityCTA_dd_conn, 
tbody:has(tr:nth-child(5)) tr:nth-last-child(-n+4) .entityCTA_dd_conn {
    top: initial !important;
    bottom: 10px;
}
tbody:has(tr:nth-child(2)) tbody tr:last-child .entityCTA_dd.open, 
tbody:has(tr:nth-child(3)) tbody tr:nth-last-child(-n+2) .entityCTA_dd.open, 
tbody:has(tr:nth-child(5)) tr:nth-last-child(-n+3) .entityCTA_dd.open, 
tbody:has(tr:nth-child(5)) tr:nth-last-child(-n+4) .entityCTA_dd.open {
    bottom: 20px;
}
/* .entityCTA_dd.open {
        width: 92%;
        height: auto;
        overflow: auto;
        position: absolute;
        z-index: 5;
        font-size: .8rem;
        box-shadow: 0px 1px 2px 1px #00000075;
    }*/
.entityCTA_dd.open {
    width: 100%;
    min-width: 150px;
    padding: 5px;
    height: auto;
    overflow: initial;
    z-index: 5;
    font-size: .8rem;
    box-shadow: 0px 2px 2px 1px #8b8b8b82;
    position: absolute;
    border-radius: 10px;
    right: 50px;
} .entityCTA_dd.open .entityCTA_dd_conn, .entityCTA_dd:hover .entityCTA_dd_conn {
        opacity: 1;
    } .entityCTA_dd.smallmenu.open {
        max-width: 30px;
        min-width: 48px;
        padding: 0;
    } .entityCTA_dd.open.minwidth180 {
    min-width: 190px;
} .entityCTA_dd li {
    min-height: 25px;
    padding: 11px;
    cursor: pointer;
    position: relative;
    font-size: .8rem;
    border-bottom: 1px solid #c0c0c04d;
} .notavailable, ul li.notavailable:hover {
    background-color: silver;
    color: gray;
    border-bottom: 1px solid #b5b4b4;
    border-radius: 5px;
} .entityCTA_dd li img {
        max-width: 24px;
        vertical-align: bottom;
    } .entityCTA_dd li:hover {
        background-color: #dedede57;
        box-shadow: 0 0 0 1px silver;
        border-radius: 6px;
    }
/****select action UL List END ****************/
/** select action UI LI Icon****/
.entityCTA_dd li .icon {
        background-size: cover;
        width: var(--icon-dim);
        height: var(--icon-dim);
        padding-right: 25px;
        display: inline-block;
        vertical-align: middle;
        margin-right: 10px;
    } .entityCTA_dd li.li-printbarcode .icon {
    background-image: url(https://assets.apliiq.com/images/icons/print-barcode.png);
} .entityCTA_dd li.li-restock .icon {
    background-image: url(https://assets.apliiq.com/images/icons/restock.png);
} .entityCTA_dd li.li-addtostore .icon {
    background-image: url(https://assets.apliiq.com/images/icons/add-to-store.png);
} .entityCTA_dd li.li-edititem .icon {
        background-image: url(https://assets.apliiq.com/images/icons/artwork-edit.png);
    } .entityCTA_dd li.li-setsafety .icon {
    background-image: url(https://assets.apliiq.com/images/icons/safety-stock.png);
} .entityCTA_dd li.li-inv .icon {
    background-image: url(https://assets.apliiq.com/images/icons/sync-inventory.png);
} .entityCTA_dd li.li-unsync-inv .icon {
    background-image: url(https://assets.apliiq.com/images/icons/unsync-inventory.png);
} .entityCTA_dd li.li-removeitem .icon {
        background-image: url(https://assets.apliiq.com/images/icons/artwork-delete.png);
    } .entityCTA_dd li.li-addnote .icon {
        background-image: url(https://assets.apliiq.com/images/icons/artwork-add-note.png);
    } .entityCTA_dd li.li-attachedfile .icon {
        background-image: url(https://assets.apliiq.com/images/icons/artwork-attach-file.png);
    }

/** select action UI LI Icon END****/


