:root {
    --border-pop: 1px solid white;
    --padding-root-v: 5%;
    --padding-root-h: 10%;

    --popup-color: #55555f;
}

.wrap-popup {
    height: 100%;
    position: fixed;
    top: 0;
    
    width: 100%;
    background-color: #000000c4;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    z-index: 1000;
    
    backdrop-filter: blur(5px);
    
    display: flex;
    flex-direction: column;
    align-items: center;
    
    padding: var(--padding-root-v) var(--padding-root-h);
    box-sizing: border-box;
    
    /* justify-content: center; */
}

.wrap-popup.relog {
    z-index: 10000 !important;
}

.popup {
    width: 100%;
    height: 100%;
    
    max-height: 100%;
    
    padding: 10px;
    
    color: white;
    /* background-color: rgba(255,255,255,0.6); */
    background-color: var(--popup-color);
    
    box-shadow: 0px 0px 10px black;
    border: 1px solid black;
    border-radius: 3px;
    
    box-sizing: border-box;
}

.popup .header {
    position: relative;
    
    display: flex;
    flex-direction: row;
    align-items: center;
    
    height: 50px;

    font-weight: bold;
    font-size: 1.2em;
    
    background-color: transparent;
}

.popup .footer {
    height: 50px;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    align-items: center;

    background-color: transparent;
}

.popup .footer button {
    background-color: #4b4b4b;
    border: 0px;
    color: white;
    padding: 15px;
    border-radius: 2px;
    box-shadow: var(--bs1);
}

.popup .footer button:hover {
    background-color: var(--c1);
    color: var(--text-color);
}

.popup .footer > * {
    max-height: 100%;
}

.popup .content {
    height: 100%;
    /* max-height: calc(100% - var(--padding-root-v) * 2); */
    max-height: calc(100% - 100px);
    display: flex;

    background-color: transparent;
    
    overflow: auto;
}

.popup .chooseview {
    display: flex;
    flex-direction: column;
}

.popup .chooseview label {
    width: 100%;
    
    display: flex;
    flex-direction: row !important;

    justify-content: center;
    align-items: center;
}

.popup .chooseview label > * {
    flex: 1;

    margin: 0 !important;
    padding: 0 !important;
}

.popup .chooseview label > *:first-child {
    width: 50%;
}

.popup .content.about .maincontent {
    width: 100%;
    
    display: flex;
    flex-direction: column;
    
    justify-content: center;
    align-items: center;

    padding: 20px;
    box-sizing: border-box;
}

.popup .content.about .maincontent .row {
    width: 100%;
    
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    
}

.popup .content.about .maincontent .row > * {
    flex: 1;
}

.popup .content.about .maincontent .row > *:first-child {
    font-weight: bold;
}

.popup button:disabled {
    display: none;
    background-color: black;
    color: pink;
}

.popup form.addword .hgroup {
    margin: 10px 0;
}

.popup form.addword .hgroup label {
    display: flex;
    flex-direction: row;

    align-items: center;
    
    min-width: 200px;
    flex: 1;
}

.popup form.addword .hgroup .tospread {
    display: none;
}

.popup form.addword .hgroup input {
    width: 100%;
}

.popup form.addword footer button {
    padding: 0;
    margin: 15px;
}

.popup form.addword .hgroup input[type="radio"],
.popup form.addword .hgroup input[type="checkbox"] {
    width: 30px;
}

/* POPUP DETAIL */

/* .popup{ */
/*     height: 100%; */
/*     position: fixed; */
/*     top: 0; */
    
/*     width: 100%; */
/*     background-color: #000000c4; */
/*     display: flex; */
/*     flex-direction: column; */
/*     align-items: center; */
/*     z-index:10000000; */

/*     backdrop-filter: blur(2px); */
/* } */

.popup.helplist .footer{
    min-height:10px;
    height:auto;
    max-height:100%;
}

.popup.helplist{
    padding-top:10px;
    box-sizing:border-box;
}

.popup.helplist .header{
    width: 50%;
    height: 60px;
    /* background-color: var(--c1); */

    box-shadow: none;
}

/* .popup .header{ */
/*     background-color: #808080; /\* #808080 *\/ */
    
/*     border-bottom: 0px; */
/*     position: relative; */
/*     width: 70%; */
/*     height: 50px; */
/*     margin-top: 50px /\* 15vh *\/; */
/*     box-shadow: none; */

/*     border: var(--border-pop); */
/*     border-bottom: 0; */
    
/*     font-weight: bold; */
/*     font-size: 18px; */
/* } */


.popup .project-list .header{
    background-color: #808080;
    border-bottom: 0px;
    position: relative;
    width: 50%;
    height: 0px !important;
    margin-top: 0px !important;
    box-shadow: none;
}


/* .popup .footer{ */
/*     /\* background-color: var(--c4); *\/ */
/*     background-color: #808080; */
/*     width: 70%; */
/*     /\* min-width:335px; *\/ */
/*     height: auto; */
/*     box-sizing: border-box; */
/*     padding: 5px 10px 15px; */
/*     display: flex; */
/*     flex-flow: row; */
/*     justify-content: space-evenly; */

/*     border: var(--border-pop); */
/*     border-top: 0; */
/* } */

.popup .footer .bok,
.popup .footer .bvalidate,
.popup .footer .bcancel{
    /* background-color: #4b4b4b; */
    background-color: var(--cimportant);
    
    border: 0px;
    color: var(--text-important);
    padding: 15px;
    border-radius: 2px;
    box-shadow: var(--bs1);
    font-weight: bold;
}

.popup .footer .bcancel:hover {
    background-color: var(--cimportantdark);
    color: var(--text-important);
}

.popup .content .rows .field-row{
    width:100%;
}

.popup .content .rows .field-row input{
    width:100%;
}

.popup .content .rows .field-row textarea{
    margin: 0px;
    max-height: 371px;
    min-width: 100%;
    min-height: 100px;
    height: 100px;
    max-width: 100%;
}

.popup .content .rows .field-row .field-row.warning{
    margin-top: 5px;
}


.popup .content .rows{
    background-color: transparent;
    padding: 20px;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.popup .content .basketlist .basket-item > label {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 2px;
}

.popup .content .basketlist .basket-item > label > div {
    display: flex;
    justify-content: space-between;
    align-items: center;
    display: flex;
}

.popup .content .basketlist .basket-item > input{
    display:none;
}

.popup .content .basketlist .basket-item:hover{
    /* background-color: #eee; */
    /* background-color: grey; */
    /* color: white; */
    background-color: white !important;
    color: black !important;
    box-shadow: var(--bs0);
    
}

.popup .content .basketlist .basket-item {
    /* min-width: 300px; */
    min-height: 100px;
    /* width: calc(20% - 10px); */
    /* width: max-content; */
    /* height: 200px; */
    flex: 1;
    background-color: #444;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    color: white;
    border: 1px solid black;
    box-shadow: 1px 1px 5px black;
    border-radius: 3px;
    
    /* background-color: #444; */
    /* box-shadow: var(--bs1); */
    /* margin-bottom: 5px; */
    /* padding: 5px 5px; */
    /* border-radius: 3px; */
    /* display: flex; */
    /* flex-direction: row; */
    /* align-items: center; */
    /* color: white; */
}

.popup .content .basketlist .basket-item .dynset-desc {
    padding: 10px;
}

.popup .content .basketlist label .text {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;

    padding: 0 5px;
    
    font-weight: bold;
    font-size: 1.2em;
    /* margin-left: 5px; */
    text-transform: capitalize;
    white-space: nowrap;
}

.popup .content .basketlist label > span {
    font-weight: normal !important;
    font-style: italic;
}

.popup .content .basketlist{
    /* padding: 3px 10px; */
    width: 100%;
    height: 100%;
    
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;

    padding: 5px;
}

.popup .content .basketlist > * {
    margin: 5px;
}

.popup .content form label input {
    width:100%;
}


/* .popup .content { */
/*     display: flex; */
/*     flex-direction: column; */
/*     align-items: center; */
/*     width: 70%; /\* 50% *\/ */
/*     background-color: grey; */
/*     padding: 10px; */
/*     max-height: 80%; /\* 100% *\/ */
/*     /\* min-height: 80%; *\/ */

/*     box-sizing: border-box; */

/*     border: var(--border-pop); */
/*     border-bottom: 0; */
/*     border-top: 0; */
/* } */

.popup .content form > div {
    /* height: 100%; */
    /* height: fit-content; */
    /* height: -webkit-fill-available; */
}

.popup .content form > div .vgroup {
    /* height: 100%; */
    /* height: fit-content; */
    /* height: -webkit-fill-available; */
}

.popup .content form > div .vgroup .items {
    height: 100%;
    min-height: 200px;
    margin-top: 10px;
    background-color: white;
    border: 1px solid black;
    padding: 5px;
    max-height: none !important;
}

.popup .newshare .rows .items {
    align-items: flex-start;
    justify-content: flex-start;
}

.popup .content .export_form .format-item:hover{
    background-color:#212121;
}

.popup .content .export_form .format-item{
    box-sizing: border-box;
    padding: 3px 5px;
    text-decoration: none;
    background-color: #4b4b4b;
    width: fit-content;
    box-shadow: var(--bs2);
    border-radius: 3px;
    margin-bottom: 5px;
    width:100%;
}

.popup .content .export_form{
    display:flex;
    flex-direction:column;
}

.popup .content form{
    margin:0;
    padding:0;
    width:100%;
    height: 100%;

    overflow: auto;
    /* min-width: 335px; */
}

.popup .content .newdoc_form .tbname{
    width:50%;
}

.popup .content .newdoc_form select{
    padding: 10px;
    box-sizing: border-box;
}

.popup .content .newdoc_form label{
    padding-top: 10px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.popup .content .newdoc_form label input{
    width: 20%;
    text-align: center;
}


.popup .content .newdoc_form{
    background-color: var(--c4);
    display: flex;
    flex-direction: column;
    padding: 5px 10px 0px 10px;
    box-sizing: border-box;
    width:100%;
    align-items:center;
}

.popup .content .block-explorer{
    width:100%;
    height:100%;
}

.popup .content .block-explorer .toolbar{
    padding: 5px 0px;
    box-sizing: border-box;
    display: flex;
    flex-direction: row;
}

.popup .content .block-explorer .toolbar button{
    justify-content: center;
    margin-right: 2px;
    background-color: #4b4b4b;
    color: white;
    border: 0px;
    display: flex;
    border-radius: 2px;
}

.popup .content .block-explorer .content{
    display: flex;
    flex-direction: column;
    width: 100%;
    background-color: white;
    color: black;
    box-shadow: inset 1px 1px 2px 1px #000000a6;
    overflow:auto;
    border-radius: 3px;
}

.popup .content .block-explorer .content .vgroup.file-item[data-type="directory"]{
    background-color: #e8e8e8;
    margin-top: 2px;
    margin-bottom: 2px;
    border: 1px solid grey;
    border-radius:2px;
}

.popup .content .block-explorer .content .vgroup.file-item[data-type="directory"]:hover{
    background-color: #e8e8e8;
    color:black;
}


.popup .content .block-explorer .content .vgroup{
    display: flex;
    flex-direction: column;
    width:100%;
    padding: 2px 5px;
    align-content: center;
    box-sizing:border-box;
}

.popup .content .block-explorer .content .vgroup:hover{
    background-color:grey;
    color:white;
}

.popup .header .bcancel:before{
    right: 20px;
    
    content: "X";
    visibility: visible;
    width: 30px;
    height: 30px;
    background-color: #960303;
    position: absolute;
    
    max-width: 30px;
    min-height: 30px;
    max-height: 30px;
    
    min-width: 30px;
    text-align: center;
    line-height: 30px;
    
    text-align: center;
    color: white;
    border-radius: 360px;
    box-sizing: border-box;
    
    /* content: "X"; */
    /* visibility: visible; */
    /* width: 25px; */
    /* height: 25px; */
    /* background-color: #960303; */
    /* position: absolute; */
    /* /\* top: 5px; *\/ */
    /* max-width: 25px; */
    /* min-height: 25px; */
    /* max-height: 25px; */
    /* /\* left: 5px; *\/ */
    /* min-width: 25px; */
    /* text-align: center; */
    /* line-height: 25px; */
    
    /* /\* font-weight: bold; *\/ */
    
    /* text-align: center; */
    /* color: white; */
    /* border-radius: 3px; */
    /* box-sizing: border-box; */
}

.popup .header .bcancel:before:hover {
    background-color: red;
}


.popup .header .bcancel{
    visibility:hidden;
}

.popup .content .format-list{
    display: flex;
    flex-direction: column;
    background-color: white;
    padding: 10px;
    box-shadow: inset 0 0 2px 1px black;
    border-radius: 3px;
}

.popup .content .format-list .format-item:hover{
    background-color:#b5b5b5;
    color:black;
}

.popup .content .format-list .format-item{
    background-color: #4b4b4b;
    margin-bottom: 5px;
    padding: 3px 10px;
    text-align: center;
    box-shadow: var(--bs2);
    border-radius: 3px;
    width: max-content;
    box-sizing: border-box;
    width: 100%;
}

.popup .content .format-list .format-item.disabled {
    background-color: #eee;
    color: gray;
    box-shadow: var(--bs2) inset;
}

.popup .content .format-list .format-item.disabled:hover {
    background-color: #eee;
    color: gray;
    box-shadow: var(--bs2) inset;
}

/* .popup.thesaurus .groupitems > *{ */
/*     width: 50%; */

/*     margin-top: 10px; */
/*     padding: 5px; */
/*     box-sizing: border-box; */
/*     background-color: white; */
/*     min-height: 50px; */
/*     /\* box-shadow: inset 0 0 2px 1px black; *\/ */
/*     border: 1px solid black !important; */
/*     box-shadow: none !important; */
/* } */

/* .popup.thesaurus .groupitems { */
/*     border-right: 0px !important; */
/* } */

/* .popup.thesaurus .memstack { */
/*     color: black; */
/* } */

.popup.list,
.popup.thesaurus,
.popup.helplist,
.popup.uniplan {
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    
    width: 100%;
    background-color: #000000c4;
    /* background-color: var(--popup-color); */
    color: white;
    
    display: flex;
    flex-direction: column;
    align-items: center;

    padding: 5% 10%;
    box-sizing: border-box;
    
    z-index: 1100;
}

.popup.list > *,
.popup.thesaurus > *,
.popup.helplist > *,
.popup.uniplan > * {
    /* background-color: var(--c1); */
    background-color: var(--popup-color);
    /* color: var(--text-color); */
}

.popup.list .header,
.popup.thesaurus .header,
.popup.helplist .header,
.popup.uniplan .header {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    height: 50px;
    box-sizing: border-box;
    border: 1px solid black;
    border-bottom: 0;
    padding: 10px 10px;

    box-shadow: none !important;
}

.popup.list .footer,
.popup.thesaurus .footer,
.popup.helplist .footer,
.popup.uniplan .footer {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    height: 50px;
    
    padding: 0 20px;
    
    box-sizing: border-box;
    border: 1px solid black;
    border-top: 0;
}

.popup.list .footer > *,
.popup.thesaurus .footer > *,
.popup.helplist .footer > *,
.popup.uniplan .footer > * {
    flex: 1;
    margin: 0px 5px;
    color: white !important;
    max-width: 20% !important;
}

.popup.list .footer > .bcancel,
.popup.thesaurus .footer > .bcancel,
.popup.helplist .footer > .bcancel,
.popup.uniplan .footer > .bcancel {
    padding: 15px !important;
    border: 1px solid gray !important;
    background-color: #921a22!important;
}

.popup.list .footer > .bcancel:hover,
.popup.thesaurus .footer > .bcancel:hover,
.popup.helplist .footer > .bcancel:hover,
.popup.uniplan .footer > .bcancel:hover {
    background-color: #808080 !important;
    color: black;
}

.popup.list .content,
.popup.thesaurus .content,
.popup.helplist .content,
.popup.uniplan .content {
    height: calc(100% - 10% - 100px);
    width: 100%;
    
    border: 1px solid black;
    border-top: 0;
    border-bottom: 0;

    padding: 10px;
    
    overflow: hidden;

    box-sizing: border-box;
}

.popup.list .content > form,
.popup.list .content > form > div,
.popup.list .content > form > div > .vgroup,
.popup.thesaurus .content > form,
.popup.thesaurus .content > form > div,
.popup.thesaurus .content > form > div > .vgroup,
.popup.helplist .content > form,
.popup.helplist .content > form > div,
.popup.helplist .content > form > div > .vgroup,
.popup.uniplan .content > form,
.popup.uniplan .content > form > div,
.popup.uniplan .content > form > div > .vgroup {
    height: 100%;
    overflow: hidden;
}

.popup.list .groupitems > *,
.popup.thesaurus .groupitems > *,
.popup.helplist .groupitems > *,
.popup.uniplan .groupitems > * {
    /* width: 50%; */
    
    margin-top: 10px;
    
    padding: 5px;
    box-sizing: border-box;
    background-color: white;
    color: black;
    
    /* min-height: 50px; */
    /* /\* box-shadow: inset 0 0 2px 1px black; *\/ */
    /* border: 1px solid black !important; */
    /* box-shadow: none !important; */
    
    flex: 1;
    border: 1px solid black;
    box-shadow: 0px 0px 2px black inset;
}

.popup.list .groupitems,
.popup.thesaurus .groupitems,
.popup.helplist .groupitems,
.popup.uniplan .groupitems {
    height: calc(100% - 100px);
    
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    
    border-right: 0px !important;
}

.popup.list .items,
.popup.thesaurus .items,
.popup.helplist .items,
.popup.uniplan .items {
    height: auto !important;
    
    margin-right: 5px;
    overflow: auto;
}

.popup.list .memstack,
.popup.thesaurus .memstack,
.popup.helplist .memstack,
.popup.uniplan .memstack {
    color: black;
    margin-left: 5px;

    overflow: auto;
}

.popup.list button,
.popup.thesaurus button,
.popup.helplist button,
.popup.uniplan button {
    border: 1px solid black;
    background-color: var(--c1);
    color: var(--text-color);
    text-align: center;
}

.popup.list .bcancel,
.popup.thesaurus .bcancel,
.popup.helplist .bcancel,
.popup.uniplan .bcancel {
    border: 0px !important;
    background-color: transparent !important;
    color: white;
}

.popup.list .bcancel:hover,
.popup.thesaurus .bcancel:hover,
.popup.helplist .bcancel:hover,
.popup.uniplan .bcancel:hover {
    color: red;
}

.popup.list .content .vgroup > .hgroup:first-child input,
.popup.thesaurus .content .vgroup > .hgroup:first-child input,
.popup.helplist .content .vgroup > .hgroup:first-child input,
.popup.uniplan .content .vgroup > .hgroup:first-child input {
    width: 100%;
    height: 25px;

    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.popup.list .content .vgroup > .hgroup:first-child > button,
.popup.thesaurus .content .vgroup > .hgroup:first-child > button,
.popup.helplist .content .vgroup > .hgroup:first-child > button,
.popup.uniplan .content .vgroup > .hgroup:first-child > button {
    display: flex;
    justify-content: center;
    align-items: center;
    
    height: 25px;
    width: 25px;
    min-width: 25px;
    max-width: 25px;
    
    margin: 0px 5px !important;
    border: 1px solid darkgray !important;
    background-color: #4b4b4b;
    color: white;
    
    box-shadow: none !important;

    padding: 2px;
    
    border-radius: 3px;
    box-sizing: border-box;
}

/* .popup.list .content .vgroup > .hgroup:first-child > button:last-child, */
/* .popup.thesaurus .content .vgroup > .hgroup:first-child > button:last-child, */
/* .popup.helplist .content .vgroup > .hgroup:first-child > button:last-child, */
/* .popup.uniplan .content .vgroup > .hgroup:first-child > button:last-child { */
/*     margin-right: 0px !important; */
/* } */

.popup.list .content .vgroup > .hgroup:first-child > button > *,
.popup.thesaurus .content .vgroup > .hgroup:first-child > button > *,
.popup.helplist .content .vgroup > .hgroup:first-child > button > *,
.popup.uniplan .content .vgroup > .hgroup:first-child > button > * {
    font-size: 18px !important;
}

.popup.list .content .vgroup > .hgroup:first-child > button:hover,
.popup.thesaurus .content .vgroup > .hgroup:first-child > button:hover,
.popup.helplist .content .vgroup > .hgroup:first-child > button:hover,
.popup.uniplan .content .vgroup > .hgroup:first-child > button:hover {
    background-color: #212121 !important;
}

.popup.list .values,
.popup.thesaurus .values,
.popup.helplist .values,
.popup.uniplan .values {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
}

.popup.list .values .value-item,
.popup.thesaurus .values .value-item,
.popup.helplist .values .value-item,
.popup.uniplan .values .value-item {
    justify-content: flex-start !important;
}

.popup.list .footer .bvalidate,
.popup.thesaurus .footer .bvalidate,
.popup.helplist .footer .bvalidate,
.popup.uniplan .footer .bvalidate {
    /* display: flex; */
    
    background-color: white;
    color: black;

    border: 1px solid gray;
    padding: 15px;
    
    box-sizing: border-box;
}

.popup.list .footer .bvalidate:hover,
.popup.thesaurus .footer .bvalidate:hover,
.popup.helplist .footer .bvalidate:hover,
.popup.uniplan .footer .bvalidate:hover {
    background-color: #4d4d4d;
    color: white;
}

.popup.list .items .hgroup.selected {
    color: var(--text-color);
    background-color: var(--c0);
}

.popup.list .groupitems > .vgroup {
    height: 100%;
}

.popup.list.uniaffix .groupitems {
    height: 100% !important;
}

.popup.list.uniaffix .groupitems > .vgroup {
    height: calc(100% - 10px);
}

.popup.list.uniaffix .groupitems > .vgroup > .selvalue {
    background-color: #333;
    color: white;
}

.popup.list.uniaffix .groupitems > .vgroup > .pagination {
    height: 30px;
    width: 100%;

    background-color: white;
    color: black;
}

.popup.list.uniaffix .content .items {
    height: calc(100% - 60px);
    padding: 5px;
    box-sizing: border-box;
}

.popup.list.uniaffix .memstack {
    height: 100%;
}

.popup.list.uniaffix .groupitems > * {
    padding: 0 !important;
}

.popup.list.uniaffix .groupitems .words.items > .hgroup {
    width: 100%;
}

.popup.list.uniaffix .groupitems .list-item {
    display: flex;
    width: 100%;
    justify-content: space-between;
}

.popup.list .content form > div .vgroup .items {
    height: 100% !important;
    
    border: 0 !important;
    margin: 0 !important;
}

/* END POPUP DETAIL */

/* POPUP USER SELECT */

.popup .userselect .searchtools,
.popup .userselect .tools .sortlist,
.popup .userselect .tools .sortorder,
.popup .userselect .tools .gallery-icons,
.popup .userselect .selected-item,
.popup .userselect .dspsync
{
    display: none !important;
}

.popup .userselect form > .hgroup {
    height: fit-content;
}

.popup .userselect.doclistpopup .gallery-icons {
    display: flex !important;
}

.popup .userselect {
    overflow: auto;
}

.popup .userselect form {
    overflow: hidden;
}

.popup .userselect .searchresult {
    overflow: hidden;
    height: fit-content;
    
    /* overflow-y: auto; */
}

.popup .userselect .resizebar {
    display: none;
}

.popup .userselect label > input {
    height: 30px;
}

.popup .userselect .hgroup .bsearch {
    width: 100%;
}

.popup .userselect .hgroup .bgosearch {
    width: 32px;
    
    display: flex;
    justify-content: center;
    align-items: center;
}

.popup .userselect .subgroup {
    height: 100%;
}

.popup .userselect .img-container {
    display: none;
}

.popup .userselect .infolist {
    height: 100%;
}

.popup .userselect .items {
    display: flex;
    /* flex-direction: column; */
    overflow: auto;
    height: calc(100% - 40px) !important;
}

.popup .userselect .items .gallery-item {
    /* width: 100%; */
    max-width: none;
}

.popup .userselect .items > .field-item,
.popup .userselect .items .infolist {
    display: flex;
    flex-direction: row !important;
}

.popup .userselect .items .field-header {
    width: 100% !important;
}

.popup .userselect .items .field-header > .fieldheader,
.popup .userselect .items .infolist > .field-item {
    flex: 1;
    width: auto !important;
    min-width: 0px !important;
    max-width: none !important;
}

.popup .userselect .items .field-header > .fieldheader:first-child {
    /* display: none; */
}

.popup .userselect .items .field-item .fieldvalue {
    /* display: flex; */
    /* justify-content: center; */
    /* align-items: center; */
    
    /* white-space: nowrap; */
    /* overflow: hidden; */
    /* text-overflow: ellipsis; */
    
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* END POPUP USER SELECT */

.popup.linkplan .content > .hgroup {
    height: 100%;
    width: 100%;
    
    box-sizing: border-box;
}

.popup.linkplan .content > .hgroup > * {
    margin: 0px 10px;
}

.popup.linkplan .content > .vgroup > .hgroup:not(.curlinks) {
    height: 100%;
}

.popup.linkplan .content .hgroup .pleft {
    height: 100%;
    width: 300px;
    
    box-sizing: border-box;
}

.popup.linkplan .content .hgroup .pleft .columns {
    height: 100%;
    width: 100%;
    
    display: flex;
    flex-direction: column;

    box-sizing: border-box;
    overflow: auto;
}

.popup.linkplan  .content > .hgroup .pleft .columns > * {
    width: 100%;
    
    display: flex;
    flex-direction: row;
    align-items: center;
    
    box-sizing: border-box;
    overflow: hidden;
}

.popup.linkplan  .content > .hgroup .pleft .columns > label > * {
    display: flex;
    flex-direction: row;
    align-items: center;

    margin: 0px 5px;
}   

.popup.linkplan .content .hgroup > .uniplan {
    height: 100%;
    width: -webkit-fill-available;
    
    box-sizing: border-box;
}

.popup.linkplan .content .vgroup.uniplan {
    height: 100%;
}

.popup.linkplan .curlinks > * {
    margin: 0px 5px;
}

.popup.linkplan .link-item {
    display: flex;
    flex-direction: row;
    
    align-items: center;
}

.popup.linkplan .link-item {
    background-color: #333;
    padding: 5px;
}

.popup.linkplan .link-item > * {
    margin: 0px 5px;
}

.popup.linkplan .link-item button {
    background-color: transparent;
    border: 0;
}

.popup .subtoolbar {
    height: 40px;
    
    display: flex;
    align-items: flex-start;
}

.popup .subtoolbar label {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.popup .subtoolbar label > * {
    height: 100%;
    margin: 0 10px;
    display: flex;
    align-items: center;
}

.popup .qrcode {
    flex-direction: row !important;
}

.popup .qrcode_part {
    height: 100%;
    
    align-items: center;
    justify-content: center;

    padding: 15px;
}

.popup .permalink_part {
    height: 100%;
    
    padding: 15px;
}

.popup .permalink_part .permalink {
    width: 100%;
}

.popup .permalink_notif {
    font-style: italic;
    font-weight: bold;
}

.popup #qrcode {
    border: 5px solid white;
}

.popup #qrcode > span {
    padding: 10px;
}

.popup .content.chooseviews .views {
    width: 100%;
    
    display: flex;
    flex-direction: column;
}

.popup .content.chooseviews .views > * {
    margin: 5px 0;
}

.popup .content.chooseviews .views .tabs {
    width: 100%;
    display: flex;
    
    /* justify-content: space-between; */
    
    align-items: center;
}

.popup .content.chooseviews .views .tabs .tab-item {
    height: 30px;
    
    display: flex;
    flex-direction: row;

    align-items: center;
    justify-content: center;
    
    box-sizing: border-box;
    padding: 5px;
    margin: 0px 5px;

    background-color: var(--c0);
    color: var(--text-color);
}

.popup .content.chooseviews .views .tabs .tab-item:hover,
.popup .content.chooseviews .views .tabs .tab-item.selected {
    background-color: var(--cimportant);
    color: var(--text-important);
}

.popup .content.chooseviews .views .tabs-contents {
    width: 100%;
    
    display: flex;
    justify-content: space-between;
    align-items: center;
    
    color: var(--text-color);
    
    box-sizing: border-box;
    padding: 5px;
}

.popup .content.chooseviews .views .tabs-contents .tab-item-content {
    display: none;

    width: 100%;
}

.popup .content.chooseviews .views .tabs-contents .tab-item-content.selected {
    display: flex;
    flex-wrap: wrap;
}

.popup .content.chooseviews .views .tabs-contents .tab-item-content .view-item {
    flex: 1;
    min-width: 350px;
    
    max-height: 200px;
    
    margin: 5px 2.5%;
    padding: 10px;
    
    background-color: var(--c1);
    
    box-shadow: 0px 0px 2px black;
    border-radius: 3px;
}

.popup .content.chooseviews .views .view-item .title {
    font-weight: bold;
    margin: 0;
    margin-bottom: 5px;
}

.popup .content.chooseviews .views .view-item > .hgroup {
    width: 100%;
    height: 100%;
}

.popup .content.chooseviews .views .view-item > .hgroup > .vgroup {
    width: 70%;
}

.popup .content.chooseviews .views .view-item .screenshot {
    max-width: 100%;
    max-height: 100%;
    
    width: 30%;
    
    display: flex;
    justify-content: center;
    align-items: center;
}

.popup .content.chooseviews .views .view-item .screenshot img {
    max-width: 100%;
    max-height: 100%;
}

.popup .auto-form {
    display: flex;
    flex-direction: column;
}

.popup .auto-form label {
    display: flex;
    flex-direction: row;
    
    justify-content: center;
}

.popup .auto-form label > * {
    width: 100%;
}

.popup .auto-form label > span {
    width: 200px;
    height: 100%;
    
    display: flex;
    align-items: center;
    
    text-transform: capitalize;
    font-weight: bold;
    
    font-size: 1.2em;
}

.popup .userselect.doclistpopup .img-container {
    display: flex;
}
.popup .userselect.doclistpopup .gallery-icons {
    display: flex;
}

.popup .userselect.doclistpopup .gallery-icons .bonlymedia,
.popup .userselect.doclistpopup .gallery-icons .bdiapo {
    display: none;
}

.popup .userselect.doclistpopup .searchresult.mosaic .gallery-item {
    min-width: 200px;
    max-width: -webkit-fill-available;
    height: 250px;
    flex: 1;
    flex-grow: 300 !important;
    box-shadow: 0px 0px 1px 0px black;

    background-color: var(--c1);
}

.popup .userselect.doclistpopup .searchresult.mosaic .gallery-item:hover {
    filter: brightness(0.9);
}

.popup .userselect.doclistpopup .searchresult.mosaic .items {
    height: calc(100% - 40px);
    width: calc(100% - 40px);
    flex-flow: row wrap;
}

.popup .userselect.doclistpopup .searchresult.mosaic .maincontent .items .gallery-item .img-container {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    /* background-color: #cdcdcd; */
    height: calc(100% - 60px);
    width: 100%;
    padding: var(--perfect-gallery-gap);
    box-sizing: border-box;
    background-size: contain;
}

.popup .userselect.doclistpopup .searchresult.mosaic .maincontent .items .gallery-item .img-container img {
    max-width: 100%;
    /* max-height: var(--img-size); */
    max-height: 100%;
    filter: var(--img-filter);
    width: auto;
    background-size: contain;
}

.popup .userselect.doclistpopup .searchresult.mosaic .items .field-header {
    display: none;
}

.popup .userselect.doclistpopup .tools {
    height: 40px;
    width: 100%;
}

.popup .userselect.doclistpopup .toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;

    padding: 0 2px;
    box-sizing: border-box;
}

.popup .userselect.doclistpopup .selected-item {
    display: flex !important;
}

/* .popup .userselect.doclistpopup .searchresult.mosaic > .maincontent > .items > .gallery-item.selected .subgroup .img-container, */
/* .popup .userselect.doclistpopup .searchresult.mosaic > .maincontent > .items > .gallery-item.selected .subgroup { */
/*     /\* background-color: var(--c5); *\/ */
/*     /\* filter: contrast(1.1); *\/ */
/* } */

.popup .doclistpopup .block-facets {
    width: 200px;
    background-color: transparent;
    color: white;
}

.popup .doclistpopup .block-facets .maincontent {
    background-color: transparent;
    color: white;
}

.popup .doclistpopup .block-facets .maincontent .facetslist {
    background-color: transparent;
    color: white;
}

.popup .doclistpopup .searchresult {
    height: 100%;
    width: calc(100% - 200px);

    padding: 2px 0px;
    box-sizing: border-box;
}

.popup .doclistpopup .block-facets .maincontent .facetslist {
    padding: 0px 2px;
}

.popup .doclistpopup .searchresult > .hgroup {
    height: 40px;
    width: 100%;
    
    background-color: var(--c4);
}

.popup .doclistpopup .pagination.input {
    height: 100%;
    width: auto;

    background-color: transparent;

    padding: 5px;
    box-sizing: border-box;
}

.popup .doclistpopup .pagination.input .pagelist {
    height: 100%;
    width: max-content;
    display: flex;
    flex-direction: row;
}

.popup .doclistpopup .pagination.input .pagelist input {
    height: 100%;
    width: 50px;
}

.popup .doclistpopup .pagination .firstpage,
.popup .doclistpopup .pagination .prevpage,
.popup .doclistpopup .pagination .nextpage,
.popup .doclistpopup .pagination .lastpage {
    display: none;
}

.popup .doclistpopup .pagelist > label {
    align-items: center;
}

.popup .doclistpopup .res > .hgroup[data-uname="popup_search"] {
    height: calc(100% - 40px);
}

.popup .doclistpopup .res > .hgroup[data-uname="popup_search"] .searchresult .toolbar {
    color: var(--text-color);
}

.popup .res {
    height: 100% !important;
}

.popup .doclistpopup .searchresult.imglist > .maincontent > .items > .gallery-item .img-container {
    height: auto !important;
}

.popup .doclistpopup .items .infolist {
    flex-direction: column !important;
}

.popup .doclistpopup .searchresult.waterfall .items .field-header,
.popup .doclistpopup .searchresult.mosaic .items .field-header,
.popup .doclistpopup .searchresult.list .items .field-header {
    display: none !important;
}

.popup .doclistpopup .searchresult.imglist > .maincontent > .items > .gallery-item > .subgroup {
    display: flex;
}

.popup .doclistpopup .searchresult.imglist .maincontent .items .gallery-item {
    height: max-content;
}

.popup .doclistpopup .searchresult .maincontent .searchtools {
    width: 40px;
    display: flex;
    flex-direction: column;
    /* position: absolute; */
}

.popup .doclistpopup .searchresult .maincontent {
    display: flex;
    flex-direction: row;
    
    width: 100%;
    height: 100%;
}

.popup .doclistpopup .searchresult .maincontent .searchtools .group_index,
.popup .doclistpopup .searchresult .maincontent .searchtools .group_search,
.popup .doclistpopup .searchresult .maincontent .searchtools .group_tools {
    display: none;
}

.popup .doclistpopup .items .field-header > .fieldheader:first-child {
    display: initial !important;
}

.popup .doclistpopup .searchresult.tablelist .items .infolist {
    flex-direction: row !important;
}

.popup form.addword label {
    display: flex;
    flex-direction: column;
}

.popup form.addword label.formbox {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    
    padding: 5px;
}

.popup form.addword input[type="checkbox"] {
    width: auto !important;
    margin-right: 5px;
}

.popup form.addword label span {
    padding: 5px 0;
}

.popup form.addword label.formbox span {
    padding: 0;
}

.popup form.addword .preview {
    color: black;
    border: 2px solid black;
    
    text-align: justify;
    padding: 5px;
    background-color: white;
}

.popup form.addword .preview strong {
    color: red;
    font-weight: 900;
}

.popup .content.player  {
    width: 100%;
    height: 100%;

    display: flex;
    justify-content: center;
    align-items: center;
}

.popup .content.player > * {
    width: 100%;
    height: 100%;
}

.wrap-popup.player_background {
    transition: all 2s ease-in-out;
    
    background-color: black;
}

.wrap-popup.player_background .popup {
    background-color: black;
    
    transition: all 2s ease-in-out;
}

.wrap-popup.player_background .popup .bcancel {
    background-color: black;
    
    transition: all 2s ease-in-out;
}

.popup .databases.edit {
    display: flex;
    flex-direction: column;
    align-items: center;
    
    gap: 10px;

    flex-wrap: nowrap;
}

.popup .databases.edit > * {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.popup .databases.edit > label > span,
.popup .databases.edit .children > label {
    display: flex;
    align-items: center;
    justify-content: center;

    font-weight: bold;
    font-size: 14px;

    margin-bottom: 5px;
}

.popup .databases.edit .children > label {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.popup .databases.edit label > input {
    border-radius: 9px;
}

.popup .databases.edit .children {
    width: 100%;
    
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.popup .databases.edit .children .childrencontent {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;

    gap: 20px;
}

.popup .databases.edit .children .childrencontent > * {
    width: auto;
    
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;

    gap: 5px;
}

.popup .databases.edit .children .childrencontent input {
    width: auto;
    height: auto;
}

.popup div.upload_choices {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    
    height: 100%;
    width: 100%;
}

.popup div.upload_choices > .vgroup {
    height: calc(100% - 50px);
    width: 100%;
}

.popup div.upload_choices .choices {
    height: 50px;
    width: 100%;
}

.popup .content.uploader {
    overflow: hidden;
}

.popup .content.newdoc .choices {
    height: 100%;
    width: 100%;
    
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-around;

    padding: 30px;
    
    gap: 30px;
    
    box-sizing: border-box;
}

.popup .content.newdoc .choices > * {
    flex: 1;
}

.popup .content.newdoc .choices h3 {
    font-weight: bold;
}

.popup .content.newdoc .choices .choice-item {
    height: 100%;
    width: 100%;
    
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    
    background-color: rgba(0,0,0,0.2);
    padding: 15px;
    border: 0px dashed white;
    box-sizing: border-box;

    cursor: pointer;
}

.popup .content.newdoc p {
    height: -webkit-fill-available;
    text-align: justify;
    word-break: break-all;

    font-weight: normal;
}

.popup .content.newdoc button {
    justify-self: flex-end;
    
    background-color: var(--cimportant);
    border: 0px;
    color: var(--text-important);
    padding: 15px;
    border-radius: 2px;
    box-shadow: var(--bs1);
    font-weight: bold;
}

.popup .content.newdoc .choices .choice-item:hover {
    filter: brightness(1.1);
}

.popup .footer .bupload {
    background-color: lightgreen;
    color: black;
}

.popup .footer .bupload:not([disabled]):hover {
    background-color: lightgreen;
    filter: brightness(1.2);
    color: black;
}

.popup .prefs .choices {
    height: 100% !important;
}

/* .popup div.upload_choices div.dropzone { */
/*     height: -webkit-fill-available; */
/*     width: 100%; */
    
/*     background-color: #ffffff; */
/*     color: black; */
    
/*     border: 10px dashed black; */
/*     box-sizing: border-box; */

/*     display: flex; */
/*     flex-direction: column; */
/*     align-items: center; */
/*     justify-content: center; */
/* } */

/* .popup div.upload_choices div.dropzone label { */
/*     display: flex; */
/*     align-items: center; */
/*     justify-content: center; */
/*     font-weight: bold; */
    
/*     width: 80%; */
/*     height: auto; */
/* } */

/* .popup div.upload_choices div.infolist { */
/*     height: 20%; */
/*     max-height: 100px; */
/*     min-height: 30px; */
/* } */

/* .popup .block-import { */
/*     width: auto !important; */
/* } */

/* .popup .block-import { */
/*     /\* background-color: white; *\/ */
/*     /\* color: black; *\/ */
/* } */

.popup .form-detail .models .maincontent .row[data-tabpos="1"] {
    background-color: black !important;
    color: white !important;
}

.popup .form-detail .models .maincontent .row[data-tabpos="0"] {
    background-color: white !important;
    color: black !important;
}

.popup .form-detail .models .toolbar > * {
    flex: 1;
}

.popup .form-detail .maincontent {
    width: 100%;
    
    padding: 0;
    margin: 0;
}

.popup .form-detail .maincontent .fields {
    height: 100%;
}

.popup .form-detail .maincontent .fields .tabs {
    height: 70px;
    display: flex;
    flex-direction: row;

    justify-content: space-between;
}

.popup .form-detail .maincontent .fields .tabs > * {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    /* border: 1px solid white; */
    padding: 0 15px;
    margin: 15px 0;

    background-color: rgba(255,255,255,0.4);
    color: black;
}

.popup .form-detail .maincontent .fields .tabs .tab-item.selected {
    border-bottom: 1px solid black;
    font-weight: bold;
    background-color: #eee;
}

.popup .form-detail .maincontent .fields .tab-content {
    display: none;
}

.popup .form-detail .maincontent .fields .tab-content.selected {
    height: calc(100% - 70px);
    
    display: flex;
    flex-direction: column;

    overflow: auto;
}

.popup .form-detail .maincontent .fields .tab-content.selected .field-item {
    display: flex;
    flex-direction: column;
    margin-bottom: 10px;
}

.popup .form-detail .maincontent .fields .tab-content.selected .field-item > .name {
    width: 100%;
    height: 30px;
    display: flex;
    flex-direction: row;
    /* background-color: #ddd; */
    padding: 0px 5px;
    /* color: black; */
}

.popup .form-detail .maincontent .fields .tab-content.selected .field-item > .name > span {
    display: flex;
    align-items: center;
    text-transform: capitalize;
    font-weight: bold;
    /* text-shadow: 0 0 black; */
}

.popup .form-detail .maincontent .fields .tab-content.selected .field-item > .values {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}

.popup .form-detail .maincontent .fields .tab-content.selected .field-item > .values > * {
    padding: 10px;
    padding-right: 15px;
}

.popup .form-detail .maincontent .fields .tab-content.selected .field-item > .hgroup,
.popup .form-detail .maincontent .fields .tab-content.selected .field-item > .value {
    width: 100%;
    /* height: 45px; */
}

.popup .form-detail .maincontent .fields .tab-content.selected .field-item > .text,
.popup .form-detail .text {
    position: relative;
    border: 0;
    padding: 0;
    margin: 0;

    max-width: none;
    max-height: none;

    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    
    background-color: white;
    color: black;
}

.popup .form-detail .maincontent .fields .tab-content.selected .field-item > .hgroup > * {
    width: 100%;
    height: 35px;
    line-height: 30px;
    margin: 0;
    
    min-width: 100%;
    font-style: italic;
    padding: 0px 5px;
}

.popup .form-detail .maincontent .fields .tab-content.selected .field-item > .hgroup input[type="checkbox"] {
    display: none;
}

.popup .form-detail .maincontent .fields .field-item > button {
    position: absolute;
    right: 0;

    background-color: var(--cimportant);
    color: var(--text-important);
}

.popup[data-view="helplist.helptable.add"] form {
    display: none;
}

.popup[data-view="helplist.helptable.add"] .content.models > .block-import {
    width: 100% !important;
}

.popup .download_choices {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 10px;

    overflow: hidden;
}

.popup .choices-image-items,
.popup .choices-doc-items {
    display: flex;
    height: fit-content;
    width: 100%;
    align-items: center;
    justify-content: space-around;
}

.popup .choices-image-items > .choice-item,
.popup .choices-doc-items > .choice-item {
    display: flex;
    align-items: center;
}

.popup .choices-image-items > .choice-item > *,
.popup .choices-doc-items > .choice-item > *{
    margin: 2px;
}


/* COLS-CONFIG */
/* .popup .cols-config .tbnames { */
/*     display: flex; */
/*     flex-direction: row; */

    
/* } */

.block-utilities[data-loaded="columns"] .utilities-content{
    height:100%;
}

.popup .cols-config {
    display: flex;
    flex-direction: column;

    /* min-height: calc(100vh - var(--header-height)); */
    /* max-height: calc(100vh - var(--header-height)); */
    height: 100%;
    width: 100%;
    
    background-color: var(--c0);
    overflow: auto;
}
 
.popup .cols-config > .header {
    display: flex;
    flex-direction: row;

    align-items: center;
    
    height: 60px;
    min-height: 60px;
    padding: 5px;
    
    box-sizing: border-box;
}

.block-utilities .utilities-content .header > .bsave {
    display: none;
    height: 40px;
    line-height: 40px;
    margin-left: auto;
    background-color: #595959;
    color: white;
    border: 0px;
    border-radius: 5px;
    padding: 0px 10px;
}



.popup .cols-config .content {
    width: 100%;

    background-color: var(--c1);
    color: var(--text-color);
}

.popup .cols-config .content .tabs {
    height: 60px;
    max-height: 60px;
    min-height: 60px;
    width: 100%;
    font-size: 17px;
    display: flex;
    flex-direction: row;
}

.popup .cols-config .content .tabs > * {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    flex: 1;

    background-color: var(--c1);
    color: var(--text-color);
    
    /* border-bottom: 5px inset transparent; */
    box-sizing: border-box;
    cursor: pointer;
}

.popup .cols-config .content .tabs > *:hover,
.popup .cols-config .content .tabs > *.selected {
    /* border-bottom: 1px inset #fff; */
    background-color: var(--cimportant);
    color: var(--text-important);
    
    box-shadow: inset 0 0 2px 2px #000000c2;
}

.popup .cols-config .content .coltools .dspTabs .bnewtab:hover,
.popup .cols-config .content .coltools .dspCols .baddcol:hover,
.popup .cols-config .content .coltools .dspTabs .bremovetab:hover{
	background-color:grey;
}

.popup .cols-config .content .coltools .dspTabs .bnewtab,
.popup .cols-config .content .coltools .dspCols .baddcol,
.popup .cols-config .content .coltools .dspTabs .bremovetab{
    background-color: #424242;
    border: 0px;
    border-radius: 3px;
    color: white;
    box-shadow: var(--bs1);
    height: 100%;
    line-height: 20px;
}
	
.popup .cols-config .content .coltools .dspfilters label{
    border:0px;
}

.popup .cols-config .content .coltools {
    display: flex;
    flex-direction: row;
    height: 60px;
    width: 100%;
    justify-content: space-around;
    padding: 5px 0px;
    box-sizing:border-box;

    background-color: var(--c2);
}

.popup .cols-config .content .coltools > * {
    height: 100%;
    display: flex;
    flex-direction: row;
    font-size: 15px;
    align-items: center;
    /* width: 50%; */
    justify-content: space-around;
}

.popup .cols-config .content .coltools * > * {
    margin: 0px 5px;
}

.popup .cols-config .content .coltools .colsearch{
	display:block;
	width:50%;
}

.popup .cols-config .content .coltools input{
	display:none;
}

.popup .cols-config .content .coltools .coltools-item.selected {
	background-color: grey;
    color: white;
    border: 1px solid #3a3a3a;
    box-sizing: border-box;
    border-radius: 3px;
	cursor: pointer;
}

.popup .cols-config .content .coltools label {
	margin: 3px 2px;
    box-sizing: border-box;
    flex-direction: column;
    display: flex;
    align-items: center;
    line-height: 16px;
    border: 1px solid grey;
    padding: 5px;
    height: 50px;
    justify-content: center;
}

.popup .cols-config .content .cols {
    display: table;
    width: 100%;
    overflow: auto;
}

.popup .cols-config .content .cols .col-row .bdelete {
    /* width: 100%; */
    /* height: 100%; */
    /* display: flex; */
    /* justify-content: center; */
    /* align-items: center; */
    background-color: #960505;
    color: white;
    border: 0px;
    border-radius: 3px;
}

.popup .cols-config .content .cols .col-row span.order-icon .material-icons {
    font-size: inherit;
}

.popup .cols-config .content .cols .col-row .bdelete .material-icons {
    /* border: 1px solid white; */
    border-radius: 90px;
}

.popup .cols-config .content .cols {
    display: table;
    width: 100%;
}

.popup .cols-config .content .cols .col-row {
    display: table-row;
    width: 100%;
}

.popup .cols-config .content .cols .col-row.header {
    height: 50px;
    background-color: white !important;
    color: black;
    font-weight: bold;
    text-transform: capitalize;
}

.popup .cols-config .content .cols .col-row:nth-child(odd) {
    background-color: rgba(255,255,255,0.4);
}

.popup .cols-config .content .cols input[type="checkbox"] {
    
}

.popup .cols-config .content .cols .col-row-item {
    display: table-cell;
    width: auto;
    padding: 3px;
    vertical-align: middle;
    text-align: center;
    /* border-right: 1px solid #a2a2a2; */
}

.popup .cols-config .content .cols input {
    padding: 2px 4px;

    outline: 0;
    border: 0;
    border-radius: 3px;
    
    box-sizing: border-box;
}

.block-utilities[data-loaded="columns"] .utilities-content .maincontent .content .cols select,
.block-utilities[data-loaded="columns"] .utilities-content .header select {
    border: 1px solid var(--cimportant);
    border-radius: 3px;
    background-color: var(--cimportant);
    color: var(--text-important);
}

.popup .cols-config .content .cols input[type="number"] {
    width: 60px;
}

.popup .cols-config .content .cols input[type="text"] {
    width: 100%;
    max-width: 140px;
}

.popup .cols-config .content .cols .col-row.modified {
    background-color: green;
}


.popup .cols-config .content .cols .col-row *[data-cat] {
    background-color: rgba(0,255,255,0.2);
}

.popup .cols-config .content .cols .col-row *[data-cat="general"] {
    background-color: inherit;
}


/* .popup .cols-config .content .cols .col-row *[data-cat="recherche"] { */
/*     background-color: rgba(0,255,255,0.2); */
/* } */

/* .popup .cols-config .content .cols .col-row *[data-cat="automatisme"] { */
/*     background-color: rgba(255,100,255,0.2); */
/* } */

/* .popup .cols-config .content .cols .col-row *[data-cat="liste"] { */
/*     background-color: rgba(0,255,0,0.2); */
/* } */

/* ------------------- */

.block-utilities[data-loaded="columns"] .utilities-content .maincontent .content .cols select, .block-utilities[data-loaded="columns"] .utilities-content .header select {
    max-width: none;
}

.block-utilities[data-loaded="columns"] .coltools-item.notimplemented,
.block-utilities[data-loaded="columns"] .coltools-item.more {
    display: none !important;
}

.block-utilities[data-loaded="columns"] .utilities-content .content .header.col-row > .col-row-item {
}

.block-utilities[data-loaded="columns"] .utilities-content .content .col-row-item > * {
    border: 0;
    margin: 0 5px;
}

.block-utilities[data-loaded="columns"] .utilities-content .tabs .tab-item > button {
    -webkit-appearance: none;
    background-color: transparent;
    border: 0;
}

.popup.newdatatable form {
    display: flex;
    flex-direction: column;

    gap: 15px;
}

.popup.newdatatable form label {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.popup.newdatatable form label span {
    display: flex;
    height: 100%;
    min-width: 200px;
    width: 300px;
    align-items: center;
    
    text-transform: capitalize;
    font-weight: bold;
}











/* TODEL */

:root {
    --menu-w: 250px;
    --menu-item-h: 30px;

    --toolbar-h: 30px;
    --blk-toolbar-h:34px;

    --choice-item-h: 40px;
    --choice-pad: 15px;
    --choice-margin: 15px;

    --dblcol-title-h: 44px;
    --cols-tbname-h: 30px;
    --tabs-h: 50px;
    --bview-h: 30px;
}

.cols-config {
    width: 100%;
    height: 100%;
    
    display: flex;
}

.cols-config .menu {
    height: 100%;
    width: 300px;
    
    background-color: var(--c1);
}

.cols-config .menu .menu-item.selected,
.cols-config .menu .menu-item:hover{
    background-color: var(--c0);
}

.cols-config .menu .menu-item {
    height: var(--menu-item-h);
    cursor:pointer;
    display: block;
    width: 100%;
    height: 30px;
    background-color: var(--c1);
    color: var(--text-color);
    text-decoration: none;
    line-height: 30px;
    margin: 0px;
    padding: 0px 10px;
    box-sizing: border-box;
    border-bottom: 1px solid grey;
}

.cols-config .content .toolbar .bdelacc:hover,
.cols-config .content .toolbar .bsave:hover{
    background-color:grey;
}

.cols-config .content .toolbar .bdelacc,
.cols-config .content .toolbar .bsave{
    border:0;
    height:32px;
    background-color:#4b4b4b;
    color:white;
    border-radius:3px;
}

.cols-config .content .toolbar{
    background-color: var(--c2);
    box-sizing: border-box;
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    height: var(--blk-toolbar-h);
    align-items: center;
}

/* .cols-config .content { */
/*     display: flex; */
/*     flex-direction: column; */
    
/*     height: 100%; */
/*     width: calc(100% - var(--menu-w)); */
    
/*     /\* background-color: darkgrey; *\/ */
/* } */

.cols-config .databases-list .toolbar {
    height: var(--toolbar-h);
    width: 100%;

    display: flex;
}

.cols-config .databases-list .databases {
    width: 100%;
    /* height: calc(100% - var(--toolbar-h)); */
    
    display: flex;
    /* flex-direction: column; */
    flex-wrap: wrap;
    
    /* padding: 5px; */
    box-sizing: border-box;
}

.cols-config .databases .database-item {
    flex: 1;
    min-width: 250px;
    /* height: 20px; */
    
    display: flex;
    flex-direction: row;
    
    justify-content: flex-start;
    align-items: center;
}

.cols-config .databases > * {
    margin: 2px;
}

.cols-config .databases .database-item > * {
    height: 100%;
    
    display: flex;
    align-items: center;
}

.cols-config .content .maincontent .preferences {
    width: 100%;
    height: 100%;

    display: flex;
    flex-direction: column;
}

.cols-config .content .maincontent .preferences .databases-list {
    /* height: 250px; */
}

/* .cols-config .content .maincontent .content { */
/*     width: 100%; */
/*     /\* height: calc(100% - 200px); *\/ */
/*     overflow: auto; */
/* } */

.cols-config .content .maincontent {
    height: calc(100% - var(--blk-toolbar-h));
    width: 100%;
}

.cols-config .content .maincontent .form-account{
	height:100%;
}

.cols-config .content .maincontent .form-account .vgroup .bgroup{
	display:block;
}


.cols-config .content .maincontent .form-account .vgroup .bgroup,
.cols-config .content .maincontent .form-account .vgroup .hgroup{
	height:25%;
}


.cols-config .maincontent .prefcontent {
    width: 100%;
    display: table;
    /* flex-direction: column; */
}

.cols-config .maincontent .header {
    background-color: rgb(50,50,50);
    color: white;

    height: initial;
}

.cols-config .maincontent .row,
.cols-config .maincontent .header {
    display: table-row;
}

.cols-config .maincontent .row > *,
.cols-config .maincontent .header > *{
    display: table-cell;
    
    text-align: center;
}

.cols-config .maincontent .prefcontent .hgroup {
    justify-content: center;
    align-items: center;
}

.cols-config .maincontent .prefcontent .hgroup button,
.cols-config .maincontent .prefcontent .hgroup .bcheckuncheck{
    margin-left:10px;
}

.cols-config .maincontent .row input {
    width: 100px;
}

.cols-config .maincontent .header > *:nth-child(1),
.cols-config .maincontent .row > *:nth-child(1) {
    max-width: 100px;
}

.cols-config .maincontent .row:nth-child(odd){
    background-color: rgba(0,0,0,0.2);
}

.cols-config .maincontent .toolbar .views {
    display: flex;
    flex-direction: row;

    justify-content: center;
    align-items: center;
    
    width: 100%;
    height: 100%;

    background-color: grey;
}

.cols-config .maincontent .toolbar .views label input{
    /* display:none; */
}

/* .cols-config .content .maincontent .form-personal-infos{ */
/*     padding:5px;  */
/*     box-sizing:border-box; */
/* } */

.cols-config .content .maincontent .form-personal-infos {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.cols-config .content .maincontent .form-personal-infos .tabs {
    display: flex;
    flex-direction: row;
    height: 50px;
}

.cols-config .content .maincontent .form-personal-infos .tabs .tab-item {
    flex: 1;
    
    display: flex;
    justify-content: center;
    align-items: center;
    
    background-color: #333;
    
    box-sizing: border-box;
    
    cursor: pointer;
}

.cols-config .content .maincontent .form-personal-infos .tabs .tab-item.selected {
    background-color: #ddd;
    color: var(--text-bcolor);
}

.cols-config .content .maincontent .form-personal-infos .tab-contents {
    height: calc(100% - 50px);
    width: 100%;
    
    padding: 10px;

    background-color: #ddd;
    color: black;
    
    box-sizing: border-box;
}

.cols-config .content .maincontent .form-personal-infos .tab-contents .tab-content-item.selected {
    display: block;
}

.cols-config .content .maincontent .form-personal-infos .tab-contents .tab-content-item {
    display: none;
    
    height: 100%;

    overflow: auto;
}

.cols-config .content .maincontent .form-personal-infos .tab-contents .ptop {
    display: flex;
    /* justify-content: row; */
}

.cols-config .content .maincontent .form-personal-infos .tab-contents .ptop .visual {
    display: flex;
    justify-content: center;
    align-items: center;
    
    background-color: #333;

    padding: 15px;
    margin: 10px;
    
    box-sizing: border-box;
}

.cols-config .content .maincontent .form-personal-infos .tab-contents .rows {
    width: 100%;
}

.cols-config .content .maincontent .form-personal-infos .tab-contents .rows .row-item {
    margin: 10px;
}

.cols-config .content .maincontent .form-personal-infos .tab-contents .rows .row-item label {
    display: flex;
    flex-direction: column;
}

.cols-config .content .maincontent .form-personal-infos .tab-contents .rows .row-item label > span {
    text-transform: capitalize;
    font-weight: bold;
}

.cols-config .content .maincontent .form-personal-infos .tab-contents .rows .row-item label > * {
    flex: 1;
}

/* .cols-config .content .maincontent .form-personal-infos fieldset .rows{ */
/*     width:100%; */
/* } */

/* .cols-config .content .maincontent .form-personal-infos fieldset .rows .row-item label{ */
/*     width: 100%; */
/*     display: flex; */
/*     flex-direction: column; */
/* } */

/* .cols-config .content .maincontent .form-personal-infos fieldset{ */
/*     padding: 5px; */
/*     margin: 0; */
/*     border: 0px; */
/*     width:100%; */
/*     box-sizing:border-box; */
/*     color:black; */
/* } */

/* .cols-config .content .maincontent .form-personal-infos fieldset .row-item{ */
/*     width:100%; */
/* } */

/* .cols-config .content .maincontent .form-personal-infos fieldset .row-item label span{ */
/*     width: 100px; */
/*     display: block; */
/* } */

/* .cols-config .content .maincontent .form-personal-infos fieldset .row-item label input{ */
/*     padding: 3px 5px; */
/*     box-shadow: inset 0 0 2px 1px #000000a3; */
/*     border: 0; */
/*     box-sizing:border-box; */
/* } */

.cols-config .maincontent .toolbar .views > * {
    flex: 1;
    text-align: center;
}

.cols-config .content .maincontent .form-account .vgroup .vgroup .hgroup .form-label{
    width:100%;
    color: var(--text-color);
    box-sizing:border-box;
    padding-left:5px;
}

.cols-config .content .maincontent .form-account .vgroup .vgroup .hgroup .form-label .form-value{
    width: 100%;
    background-color: var(--c0);
    color: var(--text-color);
    padding: 3px 5px;
    display: flex;
    align-items: center;
    height: 50%;
    box-sizing: border-box;
}

.cols-config .content .maincontent .form-account .vgroup .bgroup{
    padding: 10px 5px;
    width: 100%;
    border-bottom: 1px solid white;
    box-sizing:border-box;
}

.cols-config .content .maincontent .form-account .vgroup .vgroup .hgroup{
    padding: 5px;
    width: 100%;
    border-bottom: 1px solid white;
    box-sizing:border-box;
}

.cols-config .content .maincontent .form-account .bresetpassword:hover{
    background-color:#6b6a6a;
}

.cols-config .content .maincontent .form-account .bresetpassword{
    padding: 5px 10px;
    width: max-content;
    text-decoration: none;
    background-color: var(--c3);
    box-sizing:border-box;
}

/* PREFERENCES */

.cols-config fieldset caption {
    display: block;
    width: 100%;
    background-color: var(--c2);
    color: white;
    font-weight: bold;
}

.cols-config .preferences .content .toolbar {
    display: none;
}

.cols-config .content {
    width: 100%;
}

.cols-config .maincontent {
    width: 100%;
    background-color: var(--c0);
}

.cols-config .maincontent .choices {
    height: inherit;
    max-height: -webkit-fill-available;
}

.cols-config .maincontent .choices > p {
    padding: 0;
    margin: 0;
}

.cols-config .maincontent .choices > * {
    padding: var(--choice-pad) !important;
}

.cols-config .maincontent .choices .choice-item {
    margin: 0;
    width: 100%;
    height: var(--choice-item-h);
    
    display: flex;
    align-items: center;
    
    border: 5px solid var(--c0);
    font-weight: bold;
}

.cols-config .maincontent .choices .choice-item:hover {
    background-color: var(--cimportant);
    color: var(--text-important);
    cursor: pointer;
}

.cols-config .maincontent .choices .choice-item.selected:before {
    content: var(--arrow-down); /* "\25BC"; */
}

.cols-config .maincontent .choices .choice-item-content {
    height: 0;
    width: 0;
    max-height: 0px;
    
    box-sizing: border-box;
    
    transition: all 0.665s ease-in-out;
    
    background-color: var(--c1);
    
    overflow: hidden;
    opacity: 0;
    
    margin: 0px !important;
    padding: 0px !important;

    border-radius: 3px;
    box-shadow: 0px 0px 2px black;
}

.cols-config .maincontent .choices .choice-item-content .tbnames,
.cols-config .maincontent .choices .choice-item-content .cols {
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: row;
    
    /* margin: var(--choice-pad) !important; */
}

.cols-config .maincontent .choices .choice-item-content .tbnames > *,
.cols-config .maincontent .choices .choice-item-content .cols > * {
    height: 100%;
    /* width: 75%; */
    width: 60%
}

.cols-config .maincontent .choices .choice-item-content .cols > .col-selected {
    /* width: 25%; */
    width: 40%;
}

.cols-config .maincontent .choices .choice-item-content.selected {
    height: 100%;
    width: calc(100% - var(--choice-margin) * 2) !important;
    opacity: 1;
    max-height: 800px;
    
    margin: var(--choice-margin) !important;
}

.cols-config .maincontent .choices .choice-item:before {
    content: var(--arrow-right); /* "\27A4"; */
    padding: 5px;
}

.cols-config .maincontent .choices h3 {
    height: var(--dblcol-title-h);
    
    display: flex;
    align-items: center;
    
    padding: 10px;
    margin: 0px;
    
    background-color: var(--cimportant);
    color: var(--text-important) !important;
    box-sizing: border-box;
    
    word-break: break-all;
}

.cols-config .maincontent .choices .content {
    height: calc(100% - var(--dblcol-title-h));

    flex-direction: column;
    
    padding: 10px;
    margin: 0;
    box-sizing: border-box;
    overflow: auto;
}

.cols-config .maincontent .choices .cols .content {
    height: calc(100% - var(--dblcol-title-h) - var(--tabs-h));
}

.cols-config .maincontent .choices .cols .col-selected .content {
    height: calc(100% - var(--dblcol-title-h));
}

.cols-config .maincontent .choices .tabs {
    height: var(--tabs-h);
    
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    
    justify-content: flex-start;
    align-items: center;
}

.cols-config .maincontent .tabs .tab-item {
    width: auto !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    
    height: var(--choice-item-h) !important;
    
    background-color: var(--c1) !important;
    padding: 0 5px !important;
    margin: 5px !important;
}

.cols-config .maincontent .choices .tab-col-content {
    height: 100%;
    flex-wrap: wrap;
    flex-direction: column;

    padding: 0;
}

.cols-config .maincontent .choices .tbname-item,
.cols-config .maincontent .choices .col-item {
    cursor: pointer;
    
    padding: 2px;
    
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.cols-config .maincontent .choices .col-all {
    background-color: var(--c0);
}

.cols-config .maincontent .choices .col-all .col-item {
    list-style-type: none;
}

.cols-config .maincontent .choices ol > li {
    list-style-position: inside;
}

.cols-config .maincontent .choices .tbname-item:hover,
.cols-config .maincontent .choices .col-item:hover {
    background-color: var(--cimportant);
    color: var(--text-important);
}

.cols-config .content .toolbar > * {
    color: var(--text-important);
    background-color: var(--cimportant);
    
    box-shadow: 0px 0px 2px black;
}

.cols-config .content .toolbar > .breinit {
    background-color: var(--cimportant);
    color: var(--text-important);
}

.cols-config .content .choices .vgroup {
    height: 100%;
}

.cols-config .content .choices .vgroup > .hgroup {
    height: calc(100% - var(--cols-tbname-h) - var(--bview-h));
}

.cols-config .content .choices .vgroup .tbnames {
    height: var(--cols-tbname-h);
}

.cols-config .content .choices .hgroup .tabnames {
    display: flex;
    flex-direction: column;
    
    background-color: rgba(0,0,0,0.1);
}

.cols-config .content .choices .hgroup .tabnames .tabname-item {
    height: var(--cols-tbname-h);

    display: flex;
    justify-content: center;
    align-items: center;

    width: 100px;
}

.cols-config .content .choices .hgroup .tabnames .tabname-item.selected {
    background-color: var(--cimportantdark);
    color: var(--text-important);
}

.cols-config .content .choices .hgroup .tabnames .tabname-item:hover {
    background-color: var(--cimportant);
    color: var(--text-important);

    cursor: pointer;
}

.cols-config .content .choices .vgroup .tbnames > .tbname-item {
    display: flex;
    justify-content: center;
    align-items: center;

    font-style: italic;
    height: var(--cols-tbname-h);
}

.cols-config .content .choices .vgroup .tbnames > .tbname-item.selected {
    background-color: var(--cimportantdark);
    color: var(--text-important);

    font-weight: bold;
}

.cols-config .tab-col-content {
    display: none;
}

.cols-config .tab-col-content.selected {
    display: flex;
}

.cols-config .tabs .tab-item:hover {
    background-color: var(--cimportantdark) !important;
    color: var(--text-important);
}

.cols-config .tabs .tab-item.selected {
    background-color: var(--cimportantdark) !important;
    color: var(--text-important);
    
    font-weight: bold;
}

.cols-config .tabs-contents .tab-item-content {
    display: none;
}

.cols-config .tabs-contents .tab-item-content.selected {
    display: block;
}

.cols-config .col-selected > .hgroup {
    justify-content: space-between;
    background-color: var(--cimportant);
    color: var(--text-important);
}

.cols-config .col-selected .tools {
    height: var(--dblcol-title-h);
}

.cols-config .col-selected .tools button {
    color: var(--text-important) !important;
    background-color: var(--cimportant);
}

.cols-config .choose_view {
    height: var(--bview-h);
    color: var(--text-important);
    background-color: var(--cimportant);
}

.cols-config .cols .swappers {
    display: flex;
}

.cols-config .choices p {
    transition: all 0.365s ease-in-out;
    height: auto;
    max-height: 400px;

    overflow: hidden;
    
    opacity: 1.0;
}

.cols-config .choices p.fold {
    height: 0px !important;
    max-height: 0px !important;
    opacity: 0 !important;
    
    padding: 0 !important;
}

.cols-config .themes {
    display: flex;
    flex-direction: row;
    
    justify-content: center;
    align-items: center;
}

.cols-config .themes .theme-item {
    display: flex;
    
    flex-direction: row;
    
    flex: 1;
    margin: 10px;
    
    background-color: var(--c5);
    color: var(--text-color);
}

.popup .block-account .maincontent .choices .choice-item-content.selected {
    width: 100% !important;
    margin: 0px !important;
}

.popup .block-account .maincontent .choices .cols .col-selected .content {
    max-height: none;
}

.popup .block-account .maincontent .choices .col-all .content {
    background-color: transparent;
}