@import url("variables.css");
@import url("animations.css");
@import url("components/sign-in.css");
@import url("components/registration.css");
@import url("components/guest-call.css");
@import url("components/application-component.css");
@import url("buttons.css");
@import url("reset.css");
@import url("form.css");
@import url("modal.css");
@font-face{
    font-family: "Techno";
    src: url("../fonts/techno.ttf");
}
@font-face{
    font-family: "JetBrains Mono";
    src: url("../fonts/JetBrainsMono-VariableFont_wght.ttf") format("truetype");
}

body.loading * {
    cursor: wait;
}

address{
    display: block;
    text-align: center;
    padding: .75em;
    font-size: 1.1em;
    font-weight: 700;
    /*border: .1em solid #c1abff;*/
    margin: 0 0 1em;
    border-radius: .5em;
    color: #7b3cfc;
    background: lavender;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
fieldset>address{
    display: block;
    width: 100%;
    max-width: 20em;

}

fieldset[name=account_selection]>menu{
    margin: 1em 0;
}
fieldset[name=account_selection]>menu:has(li){
    border-bottom: .15em solid var(--border-color);
}

label:has(select[name=encryption_data_location]>option[value=detach]:checked)+[name=export-key]{
    display: block;
}

dialog[open]{
    border: none;
}



dialog.toast{
    display: block;
    position: fixed;
    z-index: 2;
    bottom: 3em;
    left: 0;
    /*width: 90%;*/
    background: #ec4141;
    border: none;
    margin: auto;
    padding: 1.5em;
    background: #cecece;
    box-shadow: .1em .1em .1em rgba(51, 51, 51, 0.47);
    text-align: center;
    animation: toast 2.5s ease-in-out forwards;
    border-radius: .5em;
}
@keyframes toast{
    0%{
        transform: scale(0);
        opacity: 1;
    }
    7%{
        transform: scale(1.1);
    }
    13%{
        transform: scale(1);
    }
    80%{
        opacity: 1;
    }
    100%{
        opacity: 0;
    }
}

/*figure{
    margin: 0 0 1em;
    background: var(--dialog-background);
    padding: 1em;
    background: var(--details-background);
    border-radius: 1em;
    >ul{
        overflow: auto;
        display: block;
        list-style: none;
        margin: 0;
        padding: .5em 0 .25em;
        >li{
            display: block;
            overflow: auto;
            margin: 0;
            padding: 0;
            >span{
                font-size: .9em;
            }
            >span:nth-child(1){
                float: left;
                width: calc(100% - 6em);
                font-weight: 700;
                white-space: nowrap;
                overflow-x: hidden;
                text-overflow: ellipsis;
            }
            >span:nth-child(2){
                float: right;
                width: 6em;
                text-align: right;
                font-weight: 800;
            }
            &:not(:last-of-type){
                margin: 0 0 1em;
                padding: 0 0 1em;
                border-bottom: .125em solid #ae77ff;

            }
        }
    }
}*/
/*output>a{
    color: var(--link-color);
}
label{
    >textarea{
        display: block;
        width: 100%;
        margin: 0 0 1em;
        padding: .5em;
        border-radius: .5em;
        background: #aaaaaa;
        color: var(--color);
    }
}*/

/*

dialog[is=import-account-dialog]{
    >form{
        >fieldset{
            >label:nth-of-type(-n+2){
                display: block;
                margin: auto auto 1em;
                padding: 1em 2em;
                text-align: center;
                text-transform: uppercase;
                transition: 0.5s;
                background-size: 200% auto;
                background-image: linear-gradient(to right, #02AAB0 0%, #00CDAC  51%, #02AAB0  100%);
                color: white;
                border-radius: 10px;
                border: .1em solid #007a7e;
                box-shadow: .2em .2em .5em rgba(55, 55, 55, 0.49);
                >input{
                    display: none;
                }
                >span{
                    font-family: "JetBrains Mono";
                    font-weight: 700;
                }
                &:hover {
                    background-position: right center; /* change the direction of the change here */
                    color: #fff;
                    text-decoration: none;
                }
                /*&:focus{
                    outline: .05em solid #00ffd7;
                }
            }
            >label{
                >textarea{
                    display: block;
                    width: 100%;
                    height: 0;
                    margin: 0;
                    padding: 0;
                    border-radius: .5em;
                    resize: vertical;
                    scrollbar-width: thin;
                    &:before{
                        content: "PIOOP";
                        display: block;
                    }
                }
                input[type=checkbox]:not(:checked)+textarea{
                    pointer-events: none;
                    opacity: 0;
                }
                input[type=checkbox]:checked+textarea{
                    display: block;
                    opacity: 1;
                    min-height: 4em;
                    margin: 0 0 1em;
                    padding: .5em;

                }
            }
            >label:last-of-type{
                background: var(--details-background);
                border: .15em solid #aa6fff;
                border-radius: .75em;
                padding: 1em;
                overflow: auto;
            }
            >label:has(input+textarea){
                margin: 0;
                >span{
                    margin: 0 0 1em;
                }
            }
            >label:has(#account_data:placeholder-shown)~button[name=import_account]{
                display: none;
            }
        }
    }
}*/*/
