:root
{   
    --elements:5;
    --enableadd:flex;
    --resgui-icon-height-edit: 1.70375vmin;
    --edititem:flex;
    --multiselect:flex;
    --itemimage:flex;
}

prime-smartlist-multiselect
{
    margin-left: var(--resgui-1vw);
    margin-right: var(--resgui-1vw);
    border-radius: 4px;
    font-family: var(--font-family-main);
    font-size: var(--resgui-font-height-m);
    color: var(--font-light);
    min-width: calc(var(--resgui-7column) + var(--resgui-05vw) * 2);
}

prime-smartlist-multiselect[disabled]
{
    opacity: 0.6;
}

.prime-smartlist-img-icon-flag{
    margin:auto 0px auto 4px;
}

.prime-smartlist-icon-image,
.prime-smartlist-icon-image-button
{
    padding:4px;
    height:var(--resgui-icon-height);
    width:auto;

}

.prime-smartlist-icon-image-button:hover
{
    cursor:pointer;
    background:var(--icon-image-hover);
    transition:background-color 0.3s linear;
    border-radius:4px;
}

.prime-smartlist-selectedContainer
{
    margin: auto 0px;
    color:var(--font-light);
    display:flex;
    flex-wrap: wrap;
    /*padding-left: var(--resgui-05vw);*/
}

.prime-smartlist-reverse {
    top:auto;
    bottom:100%;
    border:1px solid var(--decor-border-light-color);    
    border-bottom: 0;
    border-top-left-radius:4px;
    border-top-right-radius:4px;
}

.prime-smartlist-dropdown
{
    top:var(--resgui-input-text-height);
    bottom: 0;
    border:1px solid var(--decor-border-light-color);    
    border-top: 0;
    border-bottom-left-radius:4px;
    border-bottom-right-radius:4px;
}

.prime-smartlist-item
{
    height: calc( var(--resgui-quarter-row) * 3);
    width: calc(100% - 8px);
    align-items: center;
    flex-direction: row;
    justify-content: space-between;
    padding: 0px 4px;
}

.prime-smartlist-item > span
{
    font-size: var(--resgui-font-height-s);
}

.prime-smartlist-item:hover
{
    background-color: var(--row-list-background-hover);
    cursor: pointer;
}

.prime-smartlist-item:hover > img:nth-child(2)
{
  display: var(--edititem);
}

.prime-smartlist-itemimage
{
    height: var(--resgui-halfrow);
    width : calc(var(--resgui-halfcolumn) + var(--resgui-eighthcolumn));
    padding-right : var(--resgui-quartercolumn);
    margin : auto;
}

.prime-smartlist-icon-image-edit
{
    padding:4px;
    height:var(--resgui-icon-height-edit);
    width:auto;
    display: none;
    margin-top: auto;
    margin-bottom: auto;
}

.prime-smartlist-icon-image-edit:hover
{
    cursor:pointer;
    background:var(--checkbox-background-cursor-hover);
    transition:background-color 0.3s linear;
    border-radius:4px;
}

.prime-smartlist-icon-image-edit-disabled:hover
{
    cursor:default !important;
    background:transparent !important;
}

.prime-smartlist-item-checkbox
{
    display: var(--multiselect);
}

.prime-smartlist-item-image
{
    display: var(--itemimage);
}

.prime-smartlist-selectedTag
{
    margin: 1px 2px;
    background-color: var(--row-list-background-hover);
    border-radius: 4px;
    height : calc(100% - 8px);
    max-width: 100%;
}

.prime-smartlist-editinput
{
    height:calc(var(--resgui-halfrow) - 8px);
    font-size:var(--resgui-font-height-s);
    background-color:var(--input-text-background);
    background: 0;
    margin-left: 0;
    margin-right: 0;
    margin-top: 4px;
    padding-left: 4px;
    padding-right: 0;
    border-radius:4px;
    font-family:var(--font-family-main);
    color:var(--font-light);
}

.prime-smartlist-placeholder-item
{
    margin-left: 4px;
    color:var(--group-header-border-color);
}

#prime-smartlist-container
{
    height: max-content;
    flex-direction: column;
    position: relative;
}

#prime-smartlist-display-value
{
    min-height:var(--resgui-input-text-height);
    width: calc( 100% - 4px );
    justify-content: space-between;
    align-items: end;
    position: absolute;  
    background-color:var(--input-text-background);
    border:1px solid var(--decor-border-light-color);    
    border-radius:4px;
    padding: 0px 2px;
}

#prime-smartlist-nocancel
{
    display: none;
}

#prime-smartlist-container[smartlist-status="compress"] >#prime-smartlist-display-value>div>img:nth-child(2)
{
    transform: rotate(-90deg);
}

#prime-smartlist-container[smartlist-status="exspanded"] >#prime-smartlist-display-value>div>img:nth-child(2)
{
    transform: rotate(90deg);
}

#prime-smartlist-container[smartlist-status="exspanded"] >#prime-smartlist-display-value
{
    position: relative;
}

#prime-smartlist-container[smartlist-status="compress"] >#prime-smartlist-display-value
{
    position: relative;
}

#prime-smartlist-container[smartlist-status="compress"] >#prime-smartlist-container-view
{
    visibility : hidden;
}

#prime-smartlist-container[smartlist-status="exspanded"] >#prime-smartlist-container-view
{
    visibility : visible;
}

#prime-smartlist-container-view
{
    height: max-content;
    width: 100%;
    background-color: var(--input-text-background);
    flex-direction: column;   
    position: absolute;
    z-index:1;
    align-self: end;
    margin-right:-2px;
}

#prime-smartlist-search-row
{
    justify-content: space-between;
    align-items: center; 
    width: 100%;
    top: 4px;
    padding: 4px 0;
}

#prime-smartlist-list-outer
{       
    max-height: calc((var(--resgui-quarter-row) * 3) * var(--elements));
   
    -ms-overflow-style: none; 
    scrollbar-width: none; 
    overflow-y: scroll; 
    width: 100%;
}

#prime-smartlist-list-outer::-webkit-scrollbar 
{
    display: none; 
}

#prime-smartlist-list-inner
{
    width: 100%;
    height: max-content;
    flex-direction: column;
    align-items: center;
}

#prime-smartlist-add-row
{
    height: var(--resgui-input-text-height);
    display: var(--enableadd);
    flex-direction: row;
    align-items: center;
    border-top: 1px solid var(--main-gb-color);
    border-bottom-left-radius:4px;
    border-bottom-right-radius: 4px;   
    margin-top: 4px;
    width: 100%;
}

#prime-smartlist-add-row:hover
{
    background-color: var(--row-list-background-hover);
    cursor: pointer;
}