/* TANGORA CSS */
.ts-panel { display:flex; }
.ts-panel > * { flex:var(--ts-panelbox-flex, 1 1 auto); margin:var(--ts-panelbox-margin, 0px); padding:var(--ts-panelbox-padding, 0px); border-top:var(--ts-panelbox-bordertop, none); border-right:var(--ts-panelbox-borderright, none); border-bottom:var(--ts-panelbox-borderbottom, none); border-left:var(--ts-panelbox-borderleft, none) }
/* RESOURCE #11 BEGIN */
.vf__buttons_content a[data-icon="Driftstatus"]
{
    position: relative;
}

.vf__buttons_content a[data-icon="Driftstatus"]:after
{
    content: attr(data-issues);
    display: block;
    padding: 5px;
    box-sizing: border-box;
    width: 30px;
    aspect-ratio: 1/1;
    border-radius: 30px;
    background-color: #800;
    background-image: linear-gradient(45deg, rgba(238,0,0,1) 35%, rgba(136,0,0,1) 100%);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    color: #fff;
    position: absolute;
    top: -10px;
    right: -8px;
    font-size: 14px;
}

.vf__buttons_content a[data-icon="Driftstatus"][data-issues="0"]:after
{
    display: none;
}

dialog
{
    border: none;
    border-radius: 10px;
    padding: 1.6rem;
    max-width: 800px;
    max-height: 500px;
    overflow: hidden;
    margin: auto;
    position: relative;
    /* Firefox */
    scrollbar-width: thin;
}

dialog::-webkit-scrollbar,
dialog .driftstatus_content::-webkit-scrollbar
{
    width: 8px;
    height: 8px;
    background-color: #F0F0F0;
}

dialog::-webkit-scrollbar-thumb,
dialog .driftstatus_content::-webkit-scrollbar-thumb
{
    background-color: #CDCDCD;
}

dialog .driftstatus_content
{
    position: relative;
    z-index: 1;
    box-sizing: border-box;
    width: calc(100% + 12px);
    max-width: calc(800px + 1.6rem);
    margin-top: 45px;
    padding-right: 12px;
    margin-right: 12px;
    max-height: calc(455px - 3.2rem);
    overflow-y: auto;
    overflow-x: hidden;
}
dialog::backdrop
{
    background-color: rgba(0,0,0,0.50);
}

body:has(dialog[open])
{
    filter: blur(10px);
}
dialog .driftstatus_button
{
    background-color: var(--color-white);
    position: absolute;
    z-index: 2;
    top: 20px;
    right: 25px;
    border-radius: 100%;
}
dialog button
{
    --icon-times-circle: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgdmlld0JveD0iMCAwIDE2IDE2Ij4KICA8cGF0aCBpZD0iU3VidHJhY3Rpb25fMSIgZGF0YS1uYW1lPSJTdWJ0cmFjdGlvbiAxIiBkPSJNOCwxNmE4LDgsMCwxLDEsOC04QTguMDA5LDguMDA5LDAsMCwxLDgsMTZaTTUuNDExLDQuOGEuNjExLjYxMSwwLDAsMC0uNDMyLDEuMDQzTDcuMTQsOCw0Ljk3OSwxMC4xNjVBLjYxMS42MTEsMCwwLDAsNS40MTMsMTEuMmguMDA3YS42MDkuNjA5LDAsMCwwLC40MjMtLjE3MUw4LDguODY4bDIuMTYxLDIuMTYxYS42MDcuNjA3LDAsMCwwLC40MjIuMTcxaC4wMDdhLjYxMS42MTEsMCwwLDAsLjQzNS0xLjAzNUw4Ljg2OCw4bDIuMTYxLTIuMTYxYS42MTYuNjE2LDAsMCwwLC4xNzEtLjQzLjYxMi42MTIsMCwwLDAtLjYwNi0uNjA2LjYxMy42MTMsMCwwLDAtLjQyOS4xNzJMOCw3LjE0LDUuODQzLDQuOTc5QS42MTUuNjE1LDAsMCwwLDUuNDExLDQuOFoiIGZpbGw9IiNjYmQ1ZTEiLz4KPC9zdmc+Cg==);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    text-indent: -999em;
    border: none;
    background-image: none;
    background-color: #666666;
    color: #000000;
    -webkit-mask-image: var(--icon-times-circle);
    mask-image: var(--icon-times-circle);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
    width: 30px;
    aspect-ratio: 1/1;
    cursor: pointer;
}
/* RESOURCE #11 END */
