/* ------------------------------ Tables and Table Options Menus ------------------------------ */

/* ---------- Basic Table ---------- */
.tableBin1{
    display: flex;

    width: calc(100% - 4px);
    height: fit-content; min-height: 300px; max-height: 400px;

    overflow-y: scroll;

    padding: 0;
    margin: 20px 0;

    /* border: 2px solid red; */
}

.table1{
    table-layout: fixed;
    width: 100%;
    height: fit-content; min-height: fit-content; max-height: fit-content;
    padding: 0;
    margin: 0;
    border-collapse: collapse;
    /* border: 1px solid red; */
    
}
.tableRow1{
    width: 100%;
    height: fit-content;
    padding: 0;
    margin: 0;
}
.tableRow1:hover{
    cursor: default;
    background-color: whitesmoke;
}
.tableCell1{
    font-size: 12px;
    text-align: center;
    height: 40px;

    margin: 0;
    padding: 0;
    
    border-top: 1px solid lightgray;
    border-bottom: 1px solid lightgray;
    
}
.tableOptionsIcon1{
    object-fit: contain;
    max-width: 20px;
    padding: 2px;
    border-radius: 25px;
}
.tableOptionsIcon1:hover{
    cursor: pointer;
    background-color: lightgray;
}


/* ---------- Studio Plan Features Table ---------- */

.studioPlanFeaturesTable{
    table-layout: fixed;
    width: 90%;
    height: fit-content; min-height: fit-content; max-height: fit-content;
    padding: 0;
    margin: 0;
    border-collapse: collapse;
    /* border: 1px solid lightgray; */
    
}
.studioPlanFeaturesTable .titleRow{
    width: 100%;
    height: fit-content;

    background-color: whitesmoke;

    padding: 0;
    margin: 0;
}
.studioPlanFeaturesTable .titleRow .titleCell{
    font-size: 14px;
    text-align: center;
    height: 40px;

    margin: 0;
    padding: 0;
    
    /* color: var(--secondary); */
    background-color: var(--secondary_whisp);

    border: 1px solid lightgray;
}
.studioPlanFeaturesTable .row{
    width: 100%;
    height: fit-content;
    padding: 0;
    margin: 0;
}
.studioPlanFeaturesTable .row:hover{
    cursor: default;
    background-color: whitesmoke;
}
.studioPlanFeaturesTable .titleColumnCell{
    font-size: 12px;
    text-align: left;
    height: 40px;

    margin: 0;
    padding: 0 0 0 20px;

    background-color: whitesmoke;
    
    border: 1px solid lightgray;
    
}
.studioPlanFeaturesTable .cell{
    font-size: 12px;
    text-align: center;
    height: 40px;

    margin: 0;
    padding: 0;
    
    border: 1px solid lightgray;
    
}
.studioPlanFeaturesTable .icon{
    object-fit: contain;
    max-width: 20px;
    padding: 2px;
    border-radius: 25px;
}
.studioPlanFeaturesTable .icon:hover{
    cursor: pointer;
    background-color: lightgray;
}





.studioOptionsMenu{
    position: absolute;
    display: none;
    z-index: 990;
    width: fit-content;
    min-width: 50px;
    max-width: 100px;
    padding: 2px;
    background-color: white;
    border: 1px solid lightgray;
    border-radius: 5px;
}
.menuItem1{
    font-size: 14px;
    display: inline-block;
    width: calc(100% - 8px);
    padding: 4px;
    margin: 4px 0;
}
.menuItem1:hover{
    cursor: pointer;
    background-color: whitesmoke;
}

