/**
 * @name gua
 * @author ClearVision Team
 * @version 6.3.0
 * @description Highly customizable and beautiful theme for BetterDiscord.
 * @source https://github.com/ClearVision/ClearVision-v6
 * @website https://clearvision.github.io
 * @invite 7pNUC9C
 * @BDEditor Clear Vision
*/

@import url('https://clearvision.github.io/ClearVision-v6/main.css');

:root {
  --main-color: #000000;
  --hover-color: #DD9FD6;
  --success-color: #000000;
  --danger-color: #000000;
  --url-color: #D3ADCA;
  --background-image: url('https://clearvision.github.io/images/sapphire.jpg');
  --background-shading: 100%;
  --background-position: center;
  --background-size: 400;
  --background-repeat: no-repeat;
  --background-attachment: fixed;
  --background-brightness: 15%;
  --background-contrast: 119%;
  --background-saturation: 100%;
  --background-grayscale: 0%;
  --background-invert: 0%;
  --background-blur: 0px;
  --background-overlay: rgb(198,193,193,0.6);
  --user-popout-image: url('https://clearvision.github.io/images/sapphire.jpg');
  --user-popout-position: center;
  --user-popout-size: cover;
  --user-popout-repeat: no-repeat;
  --user-popout-attachment: fixed;
  --user-popout-brightness: 100%;
  --user-popout-contrast: 100%;
  --user-popout-saturation: 100%;
  --user-popout-grayscale: 0%;
  --user-popout-invert: 0%;
  --user-popout-blur: 3px;
  --user-modal-image: url('https://clearvision.github.io/images/sapphire.jpg');
  --user-modal-position: top left;
  --user-modal-size: cover;
  --user-modal-repeat: no-repeat;
  --user-modal-attachment: fixed;
  --user-modal-brightness: 0%;
  --user-modal-contrast: 100%;
  --user-modal-saturation: 100%;
  --user-modal-grayscale: 0%;
  --user-modal-invert: 0%;
  --user-modal-blur: 0px;
  --home-icon: url('https://clearvision.github.io/icons/discord.svg');
  --home-position: center;
  --home-size: 40px;
  --main-font: gg sans;
  --code-font: Consolas;
  --channels-width: 220px;
  --members-width: 240px;
  --backdrop-overlay: rgba(0,0,0,0.8);
  --backdrop-image: var(--background-image);
  --backdrop-position: var(--background-position);
  --backdrop-size: var(--background-size);
  --backdrop-repeat: var(--background-repeat);
  --backdrop-attachment: var(--background-attachment);
  --backdrop-brightness: var(--background-brightness);
  --backdrop-contrast: var(--background-contrast);
  --backdrop-saturation: var(--background-saturation);
  --backdrop-invert: var(--background-invert);
  --backdrop-grayscale: var(--background-grayscale);
  --backdrop-sepia: var(--background-sepia);
  --backdrop-blur: var(--background-blur);
  --bd-blue: var(--main-color);
  --bd-blue-hover: var(--hover-color);
  --bd-blue-active: var(--hover-color);
}

/* Any custom CSS below here */

.typeWindows-2-g3UY {
  height: 18px;
  width: 100vw;
  margin: 0;
  padding-top: 2px;
  padding-bottom: 2px;
  background: rgba(0, 0, 0, calc(var(--background-shading) * 0.6));
  box-shadow: 0 0 20px rgba(0, 0, 0, calc(var(--background-shading) * 0.6));
}

.typeWindows-2-g3UY > .wordmark-2u86JB:before {
  content: "defend";
  color: rgba(255, 255, 255, 0.7);
  font-size: 14px;
  text-shadow: 0 0 3px #000;
}

.typeWindows-2-g3UY > .wordmark-2u86JB:after {
  content: "^ー^";
  color: rgba(255, 255, 255, 0.3);
  font-family: var(--code-font);
  font-size: 10px;
}

/*                                      */

.theme-dark .container-YkUktl{
    position:relative;
    background:rgba(0,0,0,0);
    margin-bottom:10px
}
.theme-dark .container-YkUktl:before,.theme-dark .container-YkUktl:after{
    bottom:-8px;
    position:absolute;
    color:rgba(255,255,255,.3);
    font-size:11px;
    font-weight:700;
    transition:all .5s ease-in-out
}
.theme-dark .container-YkUktl:before{
    content:"";
    right:50%;
    text-align:right;
    transform:translateX(50%)
}
.theme-dark .container-YkUktl:after{
    content:"";
    left:50%;
    text-align:left;
    opacity:0;
    transform:translateX(50%) rotateX(90deg)
}
.theme-dark .container-YkUktl:hover:before{
    margin-right:1px;
    transform:none
}
.theme-dark .container-YkUktl:hover:after{
    margin-left:1px;
    opacity:1;
    transform:none
}
.theme-dark .container-YkUktl .withTagAsButton-OsgQ9L,.theme-dark .container-YkUktl .withTagless-10ooWt{
    min-width:calc(100% - 100px);
    width:auto
}
.theme-dark .container-YkUktl .withTagAsButton-OsgQ9L:hover,.theme-dark .container-YkUktl .withTagless-10ooWt:hover{
    background-color:rgba(0,0,0,.3);
    color:#fff
}
.theme-dark .container-YkUktl .avatar-1EWyVD{
    width:32px !important;
    height:32px !important;
    transition:all .15s ease-in-out
}
.theme-dark .container-YkUktl .avatar-1EWyVD:after{
    content:"Status";
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    color:#fff;
    font-size:5px;
    font-weight:700;
    text-align:center;
    line-height:32px;
    text-transform:uppercase;
    opacity:0;
    transition:all .15s ease-in-out;
    pointer-events:none
}
.theme-dark .container-YkUktl .avatar-1EWyVD foreignObject{
    transition:all .15s ease-in-out
}
.theme-dark .container-YkUktl .avatar-1EWyVD:hover{
    width:40px !important;
    height:40px !important;
    opacity:1
}
.theme-dark .container-YkUktl .avatar-1EWyVD:hover:after{
    font-size:10px;
    line-height:40px;
    opacity:1
}
.theme-dark .container-YkUktl .avatar-1EWyVD:hover foreignObject{
    opacity:.5
}
.theme-dark .container-YkUktl .title-338goq{
    color:#fff
}
.theme-dark .container-YkUktl .subtext-2HDqJ7{
    color:rgba(255,255,255,.3)
}
  .wordmarkWindows-2dq6rw.wordmark-2u86JB svg {
    display: none;
  }