[data-role="inputselect"] {
    position:relative;
    display:block;
    overflow:visible;
    min-height:2em;
    box-sizing:border-box; 
    font-size:1rem;
    background-color:transparent !important;
    border-width:0px !important;
    z-index:inherit;
}
[data-role="inputselect"]::before {
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    position:absolute;
    font-size:0.8em;
    content:'\f078';
    right:0.5em;
    bottom:0.5em;
    z-index:0;
}

[data-role="inputselect"] > .description:empty { display:none; }

[data-role="inputselect"] > .selected {
    position:relative;
    display:flex;
    flex-wrap: wrap;
    min-height:3.1em;
    width:100%;
    height:100%;
    z-index:inherit;
    font-size:0.8em;
    border-width:0;
    border-bottom-width:1px !important;
    background-color:transparent !important;
    flex-direction: row;
    align-content: flex-end;
    justify-content: flex-start;
    align-items: baseline;    
}

[data-role="inputselect"] > .selected > .item {
    position:relative; 
    display:inline-block; 
    font-size:0.9em;
    padding:0.5em; 
    border-radius:0.2em;
    padding-right:1.5em;
    margin:0.1em;
    /* white-space:nowrap; */
    /* white-space:wrap; */
}
[data-role="inputselect"] > .selected > .item::before { 
    font-family: "Font Awesome 6 Free";
    font-weight: 900 !important;
    position:absolute !important;
    font-size:1em !important;
    content:'\f00d' !important;
    right:0.5em !important;
    top:0.5em !important;
    cursor:pointer !important;
    text-align:right !important;
}

[data-role="inputselect"] > .selected > .item.required,
[data-role="inputselect"] > .selected.requireone > .item:only-child { padding-right:0.5em; }

[data-role="inputselect"] > .selected > .item.required::before,
[data-role="inputselect"] > .selected.requireone > .item:only-child::before { display:none; }

[data-role="inputselect"] > .placeholder { 
    position:absolute; 
    padding:0.1em 0.5em; 
    border-radius:0.2em;
    padding-right:1.5em;
    bottom:0.5em;
    font-size:0.9em;
    color: grey;
    z-index:inherit;
}

[data-role="inputselect"] > .selected:hover,
[data-role="inputselect"] > .placeholder:hover { cursor:pointer; }

[data-role="inputselect"] > .selected:not(:empty) + .placeholder { display:none; visibility:hidden; }
[data-role="inputselect"] > .selected:empty + .placeholder { display:block; background:transparent !important; }

[data-role="inputselect"] > .selected:empty::before { position:absolute; }

[data-role="inputselect"] > .dropwrap { position:absolute; overflow:visible; }

[data-role="inputselect"] > .dropwrap > .dropdown:not(.hidden) { z-index:100; }
/* [data-role="inputselect"] > .dropwrap > .dropdown.open-left { position:absolute; right:0; }
[data-role="inputselect"] > .dropwrap > .dropdown:not(.open-left) { position:absolute; left:0; } */
[data-role="inputselect"] > .dropwrap > .dropdown {
    background-color:var(--cavelo-white) !important;
    display:block;
    min-width:100%;
    max-width:100%;
    width:max-content;
    margin-top:2px;
    z-index:1;
    box-shadow: rgba(0,0,0,0.2) 0px 5px 10px 0px;    
}


[data-role="inputselect"] > .dropwrap > .dropdown > *:first-child[data-empty]::before { position:relative; display:block; padding:0; }

[data-role="inputselect"] > .dropwrap > .dropdown > .input {
    background-color:transparent !important;
    position:relative; 
    display:block;
    min-height:2em;
    padding:0.5em;
    box-shadow:none !important;
    border-color:inherit;
}

[data-role="inputselect"] > .dropwrap > .dropdown > .menu {
    position:relative; 
    display:block;
    max-height:200px; 
    overflow-y:auto;
    overflow-x:hidden;
}

[data-role="inputselect"] > .dropwrap > .dropdown > .menu > [data-option-group]:before {
    display:block;
    content:attr(data-option-group);
    font-weight:bold;
    padding:0.5em;
}
[data-role="inputselect"] > .dropwrap > .dropdown > .menu > [data-option-group] {
    border-width:2px !important;

}

[data-role="inputselect"] > .dropwrap > .dropdown > .menu > [data-option-group] > .item,
[data-role="inputselect"] > .dropwrap > .dropdown > .menu > .item {
    position:relative; 
    display:block;
    padding:0.3em;
    font-size:0.9em;
    border-left-width:0 !important;
    border-right-width:0 !important;
    border-bottom-width:0 !important;
    overflow-x:hidden;
    /* white-space:nowrap; */
}


[data-role="inputselect"] > .dropwrap > .dropdown > .menu > [data-option-group] > .item > i,
[data-role="inputselect"] > .dropwrap > .dropdown > .menu > .item > i { min-width:1.25rem; text-align:center; }
[data-role="inputselect"] > .dropwrap > .dropdown > .menu > [data-option-group] > .item > i + span,
[data-role="inputselect"] > .dropwrap > .dropdown > .menu > .item > i + span { white-space:nowrap; }

[data-role="inputselect"] > .dropwrap > .dropdown > .menu > [data-option-group] > .item:not([disabled]),
[data-role="inputselect"] > .dropwrap > .dropdown > .menu > .item:not([disabled]) { cursor:pointer; }
[data-role="inputselect"] > .dropwrap > .dropdown > .menu > [data-option-group] > .item:active,
[data-role="inputselect"] > .dropwrap > .dropdown > .menu > .item.active { background-color:var(--cavelo-platinum); }
[data-role="inputselect"] > .dropwrap > .dropdown > .menu > [data-option-group] > .item:hover,
[data-role="inputselect"] > .dropwrap > .dropdown > .menu > .item:hover { background-color:var(--cavelo-platinum-60); }


[data-role="inputselect"] > .dropwrap > .dropdown > .menu:empty::before { 
    content:'No items';
    position:relative; 
    display:block;
    opacity:0.5;
    padding:0.5em;
    font-size:0.9em;
    border-left-width:0 !important;
    border-right-width:0 !important;
    border-bottom-width:0 !important;
}

[data-role="inputselect"] > label.title:empty { display:none !important; }

/* [data-role="inputselect"] > .dropwrap > .dropdown > .input:empty { content:'Filter...' } */

.nodropdown [data-role="inputselect"] { position:relative; border-color:transparent !important; }
.nodropdown [data-role="inputselect"]::before { display:none; }
.nodropdown [data-role="inputselect"] > .selected:hover { cursor:default; } 
.nodropdown [data-role="inputselect"] > .selected { display:none !important; padding-bottom:0.4em; }
/* .nodropdown [data-role="inputselect"] > .placeholder { top:0.5em; } */
.nodropdown [data-role="inputselect"] > .placeholder { display:block !important; position:relative; height:0px !important; transform:translateY(-1.5em); }
.nodropdown [data-role="inputselect"] > .dropwrap { display:block !important; position:relative; }
.nodropdown [data-role="inputselect"] > .dropwrap > .dropdown {
    position:relative !important;
    display:block !important;
    box-shadow:none !important;
    margin-top:0px;
}
.nodropdown [data-role="inputselect"] > .dropwrap > .dropdown > .menu { max-height:20rem; }



th > .form-group > [data-role="inputselect"] { height:fit-content; min-height:2rem; }
th > .form-group > [data-role="inputselect"] > .selected { height:fit-content; min-height:2rem; }


[data-role="inputselect"] > .controls { 
    position:absolute !important;
    top:0.5em; right:0em; width:fit-content;
    left:auto;
    text-align:right;
}
[data-role="inputselect"] > .controls > [data-role="button"].active { font-weight:bold; }
[data-role="inputselect"] > .controls > [data-role="button"]:first-child { 
    border-top-left-radius:0.5em; 
    border-bottom-left-radius:0.5em; 
}
[data-role="inputselect"] > .controls > [data-role="button"]:last-child { 
    border-top-right-radius:0.5em; 
    border-bottom-right-radius:0.5em; 
}


[data-role="inputselect"].form-error > .selected {
    border-color:var(--cavelo-orange-60) !important;
    background-color:var(--cavelo-orange-20) !important;
}

.inline > .form-group > [data-role="inputselect"], 
.form-group.inline > [data-role="inputselect"] {
    margin-bottom:0px;
    justify-content: start;
    position: relative;

    display:grid !important;
    width: 100%  !important;
    grid-template-areas:
        "label input"
        "desc desc"  !important;
    grid-template-columns: max-content 1fr;
}
.inline > .form-group > [data-role="inputselect"] > .selected, 
.form-group.inline > [data-role="inputselect"] > .selected { grid-area: input; }
/* .form-group.inline > [data-role="inputselect"] > .dropwrap,
.form-group.inline > [data-role="inputselect"] > .controls,
.form-group.inline > [data-role="inputselect"] > select,
.form-group.inline > [data-role="inputselect"]:before { grid-area: input; } */
.inline > .form-group > [data-role="inputselect"] > label, 
.form-group.inline > [data-role="inputselect"] > label { grid-area: label; }
.inline > .form-group > [data-role="inputselect"] > .description, 
.form-group.inline > [data-role="inputselect"] > .description { grid-area: desc; }
.inline > .form-group > [data-role="inputselect"] > .dropwrap, 
.form-group.inline > [data-role="inputselect"] > .dropwrap { grid-area: desc; }

.inline > .form-group > [data-role="inputselect"] > *:not(:last-child), 
.form-group.inline > [data-role="inputselect"] > *:not(:last-child) { 
    width:auto; 
    /* margin-right:1em !important;  */
}
.inline > .form-group > [data-role="inputselect"] > label, 
.form-group.inline > [data-role="inputselect"] > label { 
    white-space:nowrap; width:fit-content;
    margin-right:1em !important; 
}
.inline > .form-group > [data-role="inputselect"] > .description, 
.form-group.inline > [data-role="inputselect"] > .description { 
    padding:5px 0 0 0; 
}
.inline > .form-group > [data-role="inputselect"] > .dropwrap, 
.form-group.inline > [data-role="inputselect"] > .dropwrap { 
    top:100%;
    width:100%;
}

[data-role="inputselect"] > .selected > .item:last-child { margin-right:1em; }


.inline.icon-description > [data-role="inputselect"] { 
    grid-template-columns:2rem 1fr 20rem;
    grid-template-areas: "desc label input" !important;
}




/* [data-role="inputselect"] .menu .item[data-icon]:not(.hidden) { */
    /* display:flex !important; */
    /* align-content: center; */
    /* justify-content: flex-start; */
    /* align-items: center; */
/* } */

/* [data-role="inputselect"] .menu .item[data-icon]:before {  */
    /* position:relative; */
    /* display: block; */
    /* font-family: "Font Awesome 6 Free"; */
    /* font-weight: 600; */
    /* font-size:1em; */
    /* min-width:1.5em; */
    /* min-height:1rem; */
    /* content:" "; */
    /* text-align:left; */
    /* background-size: contain; */
    /* background-position: left; */
    /* background-repeat: no-repeat; */
    /* background-origin: content-box; */
/* } */

/* [data-role="inputselect"] .menu .item[data-icon] > * { width:calc(100% - 1.5em); } */

/* [data-role="inputselect"] .menu .item[data-icon="linux"]:before    { background-image: url("/v3/img/linux-128x128.png"); } */
/* [data-role="inputselect"] .menu .item[data-icon="darwin"]:before   { background-image: url("/v3/img/apple-128x128.png"); } */
/* [data-role="inputselect"] .menu .item[data-icon="windows"]:before  { background-image: url("/v3/img/windows-128x128.png"); } */
/* [data-role="inputselect"] .menu .item[data-icon="Mac OS X"]:before   { background-image: url("/v3/img/apple-128x128.png"); } */
/* [data-role="inputselect"] .menu .item[data-icon="OS x"]:before   { background-image: url("/v3/img/apple-128x128.png"); } */

/* [data-role="inputselect"] .menu .item[data-icon="o365"]:before, */
/* [data-role="inputselect"] .menu .item[data-icon="o365benchmarkfull"]:before, */
/* [data-role="inputselect"] .menu .item[data-icon="o365benchmarkpartial"]:before { background-image: url("/v3/img/office365-128x128.png"); } */
/* [data-role="inputselect"] .menu .item[data-icon="imanage"]:before { background-image: url("/v3/img/imanage-128x128.png"); } */
/* [data-role="inputselect"] .menu .item[data-icon="google"]:before { background-image: url("/v3/img/google-128x128.png"); } */
/* [data-role="inputselect"] .menu .item[data-icon="salesforce"]:before { background-image: url("/v3/img/salesforce-128x128.png"); } */
/* [data-role="inputselect"] .menu .item[data-icon="boxcloud"]:before { background-image: url("/v3/img/boxcloud-128x128.png"); } */
/* [data-role="inputselect"] .menu .item[data-icon="connectwise"]:before { background-image: url("/v3/img/connectwise-128x128.png"); } */
/* [data-role="inputselect"] .menu .item[data-icon="servicenow"]:before { background-image: url("/v3/img/servicenow-128x128.png"); } */
/* [data-role="inputselect"] .menu .item[data-icon="dattoworkplace"]:before { background-image: url("/v3/img/dattoworkplace-128x128.png"); } */
/* [data-role="inputselect"] .menu .item[data-icon="dropbox"]:before { background-image: url("/v3/img/dropbox-128x128.png"); } */


/* [data-role="inputselect"] .menu .item[data-icon="file"]:before { font-weight: 300; content:"\f15b"; } */
/* [data-role="inputselect"] .menu .item[data-icon="folder"]:before { font-weight: 300; content:"\f07b"; } */

/* [data-role="inputselect"] .menu .item[data-icon="user"]:before { width:1.8em; content:"\f007"; } */
/* [data-role="inputselect"] .menu .item[data-icon="user-group"]:before { width:1.8em; content:"\f500"; } */
/* [data-role="inputselect"] .menu .item[data-icon="user"] > * { width:calc(100% - 1.8em); content:"\f007"; } */
/* [data-role="inputselect"] .menu .item[data-icon="user-group"] > * { width:calc(100% - 1.8em); content:"\f500"; } */

/* [data-role="inputselect"] .menu .item[data-icon="circle-exclamation"]:before { content:"\f06a"; color:var(--cv-accent-red-dark); } */
/* [data-role="inputselect"] .menu .item[data-icon="circle-check"]:before { content:"\f058"; color:var(--cavelo-green); } */
/* [data-role="inputselect"] .menu .item[data-icon="circle-info"]:before { content:"\f058"; color:var(--cavelo-blue); } */
/* [data-role="inputselect"] .menu .item[data-icon="circle-xmark"]:before { content:"\f058"; color:var(--cv-accent-red-dark); } */

/* [data-role="inputselect"] .menu .item[data-icon="computer"]:before { content:"\f390"; } */
/* [data-role="inputselect"] .menu .item[data-icon="network"]:before { content:"\f6ff"; } */


/* [data-role="inputselect"] > .dropwrap > .dropdown > .menu > .item.hidden { display:none !important; } */


[data-role="inputselect"] .selected .item[data-icon]:before { background-image:none; }


.readonly > [data-role="inputselect"]:before { display:none; }
.readonly > [data-role="inputselect"] > .selected {
    color:var(--cavelo-black-80) !important;
    background-color:var(--bg-readonly) !important;
    outline:none !important;
    cursor: default;
}

.readonly > [data-role="inputselect"] > .selected > .item { padding-right:0.5em; }
.readonly > [data-role="inputselect"] > .selected > .item::before { display:none; }


.open-right > [data-role="inputselect"] > .dropwrap,
.open-right > [data-role="inputselect"] > .dropwrap > .dropdown { left:0; right:auto; }

.open-left > [data-role="inputselect"] > .dropwrap,
.open-left > [data-role="inputselect"] > .dropwrap > .dropdown { right:0; left:auto; max-width:50vw }



/* [data-role="inputselect"].nostretch { max-width:fit-content !important; max-height:fit-content !important; } */