:root {
    --BlackR028: #1D1D1B;
    --BlueR028: #2E79FD;
    --Gray120R028: #242427;
    --Gray100R028: #29292E;
    --Gray50R028: #4A4A53;
    --Gray30R028: #838394;
    --WhiteR028: #EDF0F4;
    --GreenR028: #3FCD78;
    --RedR028: #DB5151;
    --OrangeR028: #FF7425;
}

body {
    background: var(--BlackR028);
    color: var(--WhiteR028);
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;

    font-family: inter, sans-serif;
}

.main-content {
    width: 100% !important;
    overflow-y: auto;
    overflow-x: hidden;
    min-height: 81vh;
}

a {
    color: var(--WhiteR028);
    outline: none;
}

a:hover {
    color: var(--WhiteR028);
}

.icon {
    font-size: 16px;
    margin-right: 5px;
    padding: 0px 8px;
    display: flex;
    align-items: center;
}

.text {
    white-space: nowrap;
    padding-right: 15px;
    font-size: 18px;
}

.highlight-text {
    color: var(--BlueR028);
}

::-webkit-scrollbar {
    width: 5px;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: var(--Gray120R028);
}

::-webkit-scrollbar-thumb:hover {
    background: var(--Gray30R028);
}

.form-control {
    background: var(--BlackR028);
    border: var(--BlackR028) 1px solid;
    border-radius: 15px;
    width: 100%;
    height: 40px;
    padding: 12px 12px;
    color: var(--WhiteR028);
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
}

.form-control:focus {
    color: var(--WhiteR028);
    background-color: var(--BlackR028);
    border-color: var(--BlackR028);
    outline: 0;
    box-shadow: none;
}

select.form-control {
    border: unset;

    width: 100%;
    max-width: 400px;
    padding: 0.75rem;
    border: 1px solid rgba(0, 0, 0, 0.1);

    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.2759 0.471436H8.7239C8.85573 0.471464 8.9846 0.510578 9.0942 0.583834C9.20381 0.65709 9.28924 0.761199 9.33968 0.882999C9.39013 1.0048 9.40333 1.13882 9.37762 1.26812C9.35191 1.39742 9.28844 1.5162 9.19523 1.60943L5.47123 5.33343C5.34621 5.45841 5.17668 5.52862 4.9999 5.52862C4.82312 5.52862 4.65358 5.45841 4.52857 5.33343L0.804566 1.60943C0.71136 1.5162 0.647889 1.39742 0.622177 1.26812C0.596466 1.13882 0.609668 1.0048 0.660114 0.882999C0.710561 0.761199 0.795987 0.65709 0.905594 0.583834C1.0152 0.510578 1.14407 0.471464 1.2759 0.471436Z' fill='%232E79FD'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: right 0.7rem top 50%;
    background-size: 0.65rem auto;

}

/* dropdown */

.dropdown-toggle::after {
    display: none;
}

.dropdown:not(.custom-dropdown-icon):not(.custom-dropdown) .dropdown-menu {
    transition: top .3s ease-in-out 0s, opacity .3s ease-in-out 0s, visibility .3s ease-in-out 0s;
    opacity: 0;
    visibility: hidden;
    display: block !important;
    transform: none !important;
    left: auto !important;
}

.dropdown:not(.custom-dropdown-icon):not(.custom-dropdown) .dropdown-menu {
    background: var(--Gray100R028);
    border-radius: 15px;
    padding: 0px;
    width: 235px;
    top: -35% !important;
    right: -173%;
}

.dropdown:not(.custom-dropdown-icon):not(.custom-dropdown) .dropdown-menu.show {
    opacity: 1;
    visibility: visible;
    top: -35% !important;
}

.dropdown:not(.custom-dropdown-icon):not(.custom-dropdown) .dropdown-menu a.dropdown-item {
    border-radius: 5px;
    display: block;
    width: 100%;
    padding: 6px 17px;
    clear: both;
    font-weight: 500;
    color: #bfc9d4;
    text-align: inherit;
    white-space: nowrap;
    background-color: transparent;
    border: 0;
    font-size: 13px;
}

.dropdown:not(.custom-dropdown-icon):not(.custom-dropdown) .dropdown-menu a.dropdown-item svg {
    width: 18px;
    height: 18px;
    margin-right: 4px;
    vertical-align: bottom;
    color: #888ea8;
}

/* toggleSwitch */

.toggleSwitch {
    display: inline-block;
    height: 18px;
    position: relative;
    overflow: visible;
    padding: 0;
    cursor: pointer;
    width: 200px;
    background-color: var(--BlackR028);
    border-radius: 20px;
    height: 34px;
    user-select: none;
}

.toggleSwitch * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.toggleSwitch label,
.toggleSwitch>span {
    line-height: 20px;
    height: 20px;
    vertical-align: middle;
}

.toggleSwitch input:focus~a,
.toggleSwitch input:focus+label {
    outline: none;
}

.toggleSwitch label {
    position: relative;
    z-index: 3;
    display: block;
    width: 100%;
}

.toggleSwitch input {
    position: absolute;
    opacity: 0;
    z-index: 5;
}

.toggleSwitch>span {
    position: absolute;
    left: 0;
    width: calc(100% - 6px);
    margin: 0;
    text-align: left;
    white-space: nowrap;
    margin: 0 3px;
}

.toggleSwitch>span span {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 5;
    display: block;
    width: 50%;
    margin-left: 50px;
    text-align: left;
    font-size: 0.9em;
    width: auto;
    left: 0;
    top: -1px;
    opacity: 1;
    width: 40%;
    text-align: center;
    line-height: 34px;
}

.toggleSwitch a {
    position: absolute;
    right: 50%;
    z-index: 4;
    display: block;
    top: 3px;
    bottom: 3px;
    padding: 0;
    left: 3px;
    width: 50%;
    background-color: var(--BlueR028);
    border-radius: 20px;
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

.toggleSwitch>span span:first-of-type {
    color: var(--WhiteR028);
    opacity: 1;
    left: 0;
    margin: 0;
    width: 50%;
    font-weight: bold;
}

.toggleSwitch>span span:last-of-type {
    left: auto;
    right: 0;
    color: var(--WhiteR028);
    margin: 0;
    width: 50%;
    font-weight: bold;
}

.toggleSwitch>span:before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: -2px;
    border-radius: 30px;
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}

.toggleSwitch input:checked~a {
    left: calc(50% - 3px);
}

.toggleSwitch input:checked~span span:first-of-type {
    left: 0;
    color: var(--WhiteR028);
}

.toggleSwitch input:checked~span span:last-of-type {
    color: var(--WhiteR028);
}

.toggleSwitch.large {
    width: 60px;
    height: 27px;
}

.toggleSwitch.large a {
    width: 27px;
}

.toggleSwitch.large>span {
    height: 29px;
    line-height: 28px;
}

.toggleSwitch.large input:checked~a {
    left: 41px;
}

.toggleSwitch.large>span span {
    font-size: 1.1em;
}

.toggleSwitch.large>span span:first-of-type {
    left: 50%;
}

.toggleSwitch.xlarge {
    width: 80px;
    height: 36px;
}

.toggleSwitch.xlarge a {
    width: 36px;
}

.toggleSwitch.xlarge>span {
    height: 38px;
    line-height: 37px;
}

.toggleSwitch.xlarge input:checked~a {
    left: 52px;
}

.toggleSwitch.xlarge>span span {
    font-size: 1.4em;
}

.toggleSwitch.xlarge>span span:first-of-type {
    left: 50%;
}

/* top button */

.top,
button.top,
#top,
button#top {
    display: none;
    position: fixed !important;
    bottom: 100px;
    right: 170px;
    z-index: 999999999 !important;
    border: none;
    outline: none;
    background-color: var(--Gray30R028);
    cursor: pointer;
    border-radius: 15px;
    width: 40px;
    height: 40px;
}

.top svg {
    color: var(--WhiteR028);
    font-size: 24px;
}

/* alerts */

.alerts {
    position: fixed;
    width: 25vw;
    height: max-content;
    z-index: 10000000;
    top: 125px;
    right: 20px;
}

.alerts .alert-timed {
    position: relative;
    padding: 0.75rem 1.25rem;
    margin-bottom: 1rem;
    border-radius: 0.25rem;

    border-radius: 4px;
    border: none;
    background-color: var(--Gray100R028);
    color: var(--WhiteR028);

    transform: scaleX(1);
    transition: transform 5000ms ease-in-out;
    transform-origin: 0% 50%;
}

.alerts .alert-timed::before {
    content: "";
    background: transparent;
    position: absolute;
    width: 4px;
    height: 100%;
    left: 0;
    top: 0;
    border-radius: 4px;
    border-bottom: var(--WhiteR028) 4px solid;
    animation: border_anim var(--delay-anim) linear forwards;
}

@keyframes border_anim {
    0% {
        width: 0%;
    }

    100% {
        width: 100%;
    }
}

.alerts .alert-timed.alert-success {
    color: var(--GreenR028);
}

.alerts .alert-timed.alert-success::before {
    border-bottom: var(--GreenR028) 4px solid;
}

.alerts .alert-timed.alert-danger {
    color: var(--RedR028);
}

.alerts .alert-timed.alert-danger::before {
    border-bottom: var(--RedR028) 4px solid;
}

.alerts .alert-timed.alert-warning {
    color: var(--OrangeR028);
}

.alerts .alert-timed.alert-warning::before {
    border-bottom: var(--OrangeR028) 4px solid;
}

.alerts .alert-timed.alert-info {
    color: var(--BlueR028);
}

.alerts .alert-timed.alert-info::before {
    border-bottom: var(--BlueR028) 4px solid;
}

.alerts .alert-timed.alert-primary {
    color: var(--WhiteR028);
}

.alerts .alert.alert-primary::before {
    border-bottom: var(--WhiteR028) 4px solid;
}

.alerts .alert-timed.alert-secondary {
    color: var(--Gray30R028);
}

.alerts .alert-timed.alert-secondary::before {
    border-bottom: var(--Gray30R028) 4px solid;
}

.alert {
    background: var(--Gray100R028);
    border-radius: 15px;
    min-height: 100px;
    border: none;
    padding: 25px 90px;
    color: var(--WhiteR028);
}

.alert::before {
    content: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 24C14.3734 24 16.6935 23.2962 18.6668 21.9776C20.6402 20.6591 22.1783 18.7849 23.0866 16.5922C23.9948 14.3995 24.2324 11.9867 23.7694 9.65892C23.3064 7.33115 22.1635 5.19295 20.4853 3.51472C18.8071 1.83649 16.6689 0.693605 14.3411 0.230582C12.0133 -0.232441 9.60051 0.00519943 7.4078 0.913451C5.21509 1.8217 3.34094 3.35977 2.02236 5.33316C0.703788 7.30655 0 9.62663 0 12C0.00344108 15.1815 1.26883 18.2318 3.51852 20.4815C5.76821 22.7312 8.81846 23.9966 12 24ZM12 5.00001C12.2967 5.00001 12.5867 5.08798 12.8334 5.2528C13.08 5.41762 13.2723 5.65189 13.3858 5.92598C13.4994 6.20007 13.5291 6.50167 13.4712 6.79264C13.4133 7.08361 13.2704 7.35089 13.0607 7.56067C12.8509 7.77044 12.5836 7.91331 12.2926 7.97118C12.0017 8.02906 11.7001 7.99936 11.426 7.88582C11.1519 7.77229 10.9176 7.58003 10.7528 7.33336C10.588 7.08669 10.5 6.79668 10.5 6.50001C10.5 6.10218 10.658 5.72065 10.9393 5.43934C11.2206 5.15804 11.6022 5.00001 12 5.00001ZM11 10H12C12.5304 10 13.0391 10.2107 13.4142 10.5858C13.7893 10.9609 14 11.4696 14 12V18C14 18.2652 13.8946 18.5196 13.7071 18.7071C13.5196 18.8946 13.2652 19 13 19C12.7348 19 12.4804 18.8946 12.2929 18.7071C12.1054 18.5196 12 18.2652 12 18V12H11C10.7348 12 10.4804 11.8946 10.2929 11.7071C10.1054 11.5196 10 11.2652 10 11C10 10.7348 10.1054 10.4804 10.2929 10.2929C10.4804 10.1054 10.7348 10 11 10Z' fill='%231D1D1B'/%3E%3C/svg%3E%0A");
    display: inline;
    position: absolute;
    width: 50px;
    height: 50px;
    top: 0;
    left: 0;
    background: var(--WhiteR028);
    padding: 13px;
    border-radius: 15px 0px;
}

.alert p {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
    color: var(--WhiteR028);
}

.alert .close:hover {
    color: var(--RedR028);
}

.content-panel .alert-card {
    padding: 1px !important;
    margin: auto !important;
    margin-top: 14% !important;
}

.alert-card {
    width: 318px;
    height: 390px;
    margin: 20px;

    border-radius: 15px;
    background: var(--Gray120R028);
}

.alert-card .icon {
    width: 24px;
    height: 24px;
    margin: 118px 147px 0px;
    padding: 0;
}

.alert-card .title {
    font-family: 'Inter', sans-serif;
    font-size: 24px;
    font-weight: 700;
    color: var(--WhiteR028);
    text-align: center;
    line-height: 29px;
    margin: 16px 10px 0px;
}

.alert-card .description {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 400;
    color: var(--Gray30R028);
    text-align: center;
    line-height: 19px;
    margin: 8px 10px 0px;
}

/* ads */

.ads-side-left {
    position: absolute;
    width: 260px;
    margin-top: 70px;
    left: 40px;
    z-index: 10;
}

.ads-side-right {
    position: absolute;
    width: 260px;
    margin-top: 70px;
    right: 40px;
    z-index: 10;
}

.ads-bottom {
    display: none;
    width: 100%;
    text-align: center;
    margin-top: 20px;
    margin-bottom: 50px;
    z-index: 10;
}

/* buttom */

.btn {
    padding: 10px 37px;
    text-shadow: none;
    font-size: 14px;
    color: var(--WhiteR028);
    font-weight: normal;
    white-space: normal;
    word-wrap: break-word;
    transition: .2s ease-out;
    touch-action: manipulation;
    cursor: pointer;
    background-color: var(--Gray50R028);
    box-shadow: none;
    border-radius: 10px;
    box-shadow: none;
}

.btn-primary {
    background-color: var(--BlueR028);
    box-shadow: none;
}

.btn-primary:hover {
    background-color: var(--BlueR028);
    box-shadow: none;
}

.btn-primary:focus {
    background-color: var(--BlueR028);
    box-shadow: none;
}

.btn-primary:active {
    background-color: var(--BlueR028);
    box-shadow: none;
}

.btn-primary:disabled {
    background-color: var(--BlackR028);
    color: var(--Gray30R028);
    border-color: transparent;
    box-shadow: none;
}

.btn-secondary {
    background-color: var(--Gray100R028);
    box-shadow: none;
    border: none;
}

.btn-secondary:hover {
    background-color: var(--Gray100R028);
    box-shadow: none;
}

.btn-secondary:focus {
    background-color: var(--Gray100R028);
    box-shadow: none;
}

.btn-secondary:not(:disabled):not(.disabled):active {
    background-color: var(--Gray100R028);
    box-shadow: none;
}

.btn-secondary:active {
    background-color: var(--Gray100R028);
    box-shadow: none;
}

.btn-secondary:disabled {
    background-color: var(--BlackR028);
    box-shadow: none;
}

.btn-success {
    color: var(--BlackR028);
    background-color: var(--GreenR028);
    box-shadow: none;
}

.btn-success:hover {
    background-color: var(--GreenR028);
    box-shadow: none;
}

.btn-success:focus {
    background-color: var(--GreenR028);
    box-shadow: none;
}

.btn-success:active {
    background-color: var(--GreenR028);
    box-shadow: none;
}

.btn-success:disabled {
    background-color: var(--BlackR028);
    color: var(--Gray30R028);
    border-color: transparent;
    box-shadow: none;
}

.btn-login {
    padding: 0;
    margin: 0;

    background-color: var(--BlueR028);
    border-radius: 46px;

    width: 60px;
    height: 60px;
}

.btn-login svg {
    width: max-content;
    height: max-content;
    padding: 17px;
}

.btn-outline-primary {
    color: var(--WhiteR028);
    background-color: transparent;
    background-image: none;
    border: var(--BlueR028) solid 2px;
    box-shadow: none;
}

.btn-outline-primary:hover {
    background-color: var(--BlueR028);
    box-shadow: none;
}

.btn-outline-success {
    color: var(--WhiteR028);
    background-color: transparent;
    background-image: none;
    border: var(--GreenR028) solid 2px;
    box-shadow: none;
}

.btn-outline-success:hover {
    background-color: var(--GreenR028);
    box-shadow: none;
}

/* table */

.layout-table {
    background: var(--Gray100R028);
    border-radius: 0 0 15px 15px;
}

.dt--top-section {
    margin: 0 240px;
    padding: 65px 0;
}

.dt-buttons {
    flex: none;
}

.dt-buttons button {
    height: 50px;
    flex: none;
    border-radius: 15px;
}

.dataTables_filter {
    width: 570px;
}

div.dataTables_wrapper div.dataTables_filter input {
    background: rgba(131, 131, 148, 0.15);
    border: 1px solid var(--Gray30R028);
    border-radius: 15px;
    width: 500px;
    margin: 0;
    height: 50px;
    padding: 0;
    padding-left: 14px;
    font-size: 20px;
}

div.dataTables_wrapper div.dataTables_filter svg {
    width: 24px;
    right: 20px;
    top: 12px;
}

.table>thead>tr>th {
    background: transparent;
    text-align: center;
    padding: 10px 0px 47px;
    color: var(--WhiteR028);
    font-size: 16px;
    font-weight: 700;
    line-height: 22px;
    font-family: 'Inter', sans-serif;
}

.table>tbody>tr>td {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 19px;
    color: var(--WhiteR028);
    margin: 0;
    padding: 5px 2px;
    padding-right: 30px;
}

.table.table-hover tbody tr {
    border-bottom: none;
    text-align: center;
}

.dt--bottom-section {
    padding: 25px;
}

div.dataTables_wrapper div.dataTables_info {
    border: none;
    color: var(--BlueR028);
}

table.dataTable thead .sorting_asc:before {
    opacity: 1 !important;
    background-image: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.1187 7.83942L8.44354 5.16484C8.05468 4.79336 7.53758 4.58606 6.99979 4.58606C6.462 4.58606 5.94491 4.79336 5.55604 5.16484L2.88088 7.83942C2.71673 8.00357 2.62451 8.2262 2.62451 8.45834C2.62451 8.69048 2.71673 8.91311 2.88088 9.07726C3.04502 9.2414 3.26765 9.33362 3.49979 9.33362C3.73193 9.33362 3.95456 9.2414 4.11871 9.07726L6.79388 6.40209C6.84857 6.34741 6.92274 6.31669 7.00008 6.31669C7.07742 6.31669 7.1516 6.34741 7.20629 6.40209L9.88087 9.07726C10.045 9.2414 10.2677 9.33362 10.4998 9.33362C10.7319 9.33362 10.9546 9.2414 11.1187 9.07726C11.2829 8.91311 11.3751 8.69048 11.3751 8.45834C11.3751 8.2262 11.2829 8.00357 11.1187 7.83942Z' fill='%232E79FD'/%3E%3C/svg%3E%0A") !important;
}

table.dataTable thead .sorting_desc:before {
    opacity: 1 !important;
    background-image: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.1187 7.83942L8.44354 5.16484C8.05468 4.79336 7.53758 4.58606 6.99979 4.58606C6.462 4.58606 5.94491 4.79336 5.55604 5.16484L2.88088 7.83942C2.71673 8.00357 2.62451 8.2262 2.62451 8.45834C2.62451 8.69048 2.71673 8.91311 2.88088 9.07726C3.04502 9.2414 3.26765 9.33362 3.49979 9.33362C3.73193 9.33362 3.95456 9.2414 4.11871 9.07726L6.79388 6.40209C6.84857 6.34741 6.92274 6.31669 7.00008 6.31669C7.07742 6.31669 7.1516 6.34741 7.20629 6.40209L9.88087 9.07726C10.045 9.2414 10.2677 9.33362 10.4998 9.33362C10.7319 9.33362 10.9546 9.2414 11.1187 9.07726C11.2829 8.91311 11.3751 8.69048 11.3751 8.45834C11.3751 8.2262 11.2829 8.00357 11.1187 7.83942Z' fill='%234A4A53'/%3E%3C/svg%3E%0A") !important;
}

table.dataTable thead .sorting_asc:after {
    opacity: 1 !important;
    background-image: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.119 4.58149C11.0377 4.50018 10.9412 4.43568 10.8351 4.39167C10.7289 4.34766 10.615 4.32501 10.5001 4.32501C10.3851 4.32501 10.2713 4.34766 10.1651 4.39167C10.0589 4.43568 9.96242 4.50018 9.88116 4.58149L7.20599 7.25608C7.15129 7.31075 7.07712 7.34147 6.99978 7.34147C6.92244 7.34147 6.84827 7.31075 6.79357 7.25608L4.11899 4.58149C3.95492 4.41735 3.73236 4.3251 3.50028 4.32504C3.2682 4.32499 3.0456 4.41713 2.88145 4.5812C2.7173 4.74527 2.62505 4.96783 2.625 5.19991C2.62495 5.43199 2.71709 5.6546 2.88116 5.81874L5.55632 8.49391C5.74591 8.68352 5.97099 8.83392 6.21871 8.93654C6.46643 9.03916 6.73194 9.09197 7.00007 9.09197C7.26821 9.09197 7.53371 9.03916 7.78143 8.93654C8.02915 8.83392 8.25424 8.68352 8.44382 8.49391L11.119 5.81874C11.283 5.65466 11.3752 5.43214 11.3752 5.20012C11.3752 4.9681 11.283 4.74558 11.119 4.58149Z' fill='%234A4A53'/%3E%3C/svg%3E%0A") !important;
}

table.dataTable thead .sorting_desc:after {
    opacity: 1 !important;
    background-image: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.119 4.58149C11.0377 4.50018 10.9412 4.43568 10.8351 4.39167C10.7289 4.34766 10.615 4.32501 10.5001 4.32501C10.3851 4.32501 10.2713 4.34766 10.1651 4.39167C10.0589 4.43568 9.96242 4.50018 9.88116 4.58149L7.20599 7.25608C7.15129 7.31075 7.07712 7.34147 6.99978 7.34147C6.92244 7.34147 6.84827 7.31075 6.79357 7.25608L4.11899 4.58149C3.95492 4.41735 3.73236 4.3251 3.50028 4.32504C3.2682 4.32499 3.0456 4.41713 2.88145 4.5812C2.7173 4.74527 2.62505 4.96783 2.625 5.19991C2.62495 5.43199 2.71709 5.6546 2.88116 5.81874L5.55632 8.49391C5.74591 8.68352 5.97099 8.83392 6.21871 8.93654C6.46643 9.03916 6.73194 9.09197 7.00007 9.09197C7.26821 9.09197 7.53371 9.03916 7.78143 8.93654C8.02915 8.83392 8.25424 8.68352 8.44382 8.49391L11.119 5.81874C11.283 5.65466 11.3752 5.43214 11.3752 5.20012C11.3752 4.9681 11.283 4.74558 11.119 4.58149Z' fill='%232E79FD'/%3E%3C/svg%3E%0A") !important;
}

div.dataTables_wrapper .table-responsive {
    padding: 0 80px;
}

/* modal struture */

.fade {
    -webkit-transition: backdrop-filter 0.15s ease-in-out;
    -moz-transition: backdrop-filter 0.15s ease-in-out;
    -o-transition: backdrop-filter 0.15s ease-in-out;
    transition: backdrop-filter 0.15s ease-in-out;

    backdrop-filter: blur(3px);
    -webkit-transition: opacity 0.15s ease-in-out;
    -moz-transition: opacity 0.15s ease-in-out;
    -o-transition: opacity 0.15s ease-in-out;
    transition: opacity 0.15s ease-in-out;

    opacity: 1;
}

.modal-content {
    background-color: var(--Gray100R028);
    border-radius: 20px;
    border: none;
}

.modal-header {
    background: var(--Gray120R028);
    border-bottom: none;
    border-radius: 20px 20px 0 0;
}

.modal-title {
    flex: 1;
    text-align: center;
    padding-left: 50px;

    font-family: 'Inter', sans-serif;
    font-size: 24px;
    font-weight: 700;
    line-height: 29px;
}

.modal-body {
    padding: 0;
}

.modal-body .button-group {
    display: flex;
    margin: 30px;
}

.modal-body .button-group .left {
    margin-right: 15px;
}

.modal-body .button-group .right {
    margin-left: 15px;
}

.modal-body .button-group .btn {
    width: -webkit-fill-available;
    margin-bottom: 25px;
    height: 40px;

    background-color: var(--Gray120R028);
    border-radius: 10px;

    font-family: 'Inter', sans-serif;
    font-size: 14px;
    font-weight: 600;
    line-height: 19px;
    color: var(--WhiteR028);
}

.modal-body .button-group .btn:hover {
    background-color: var(--BlueR028);
    border: none;
}

.modal-footer {
    border-top: none;
    height: 15px;
    background: var(--Gray120R028);
    border-radius: 0 0 20px 20px;
}

/* Admin "Adicionar dias" / "Remover dias" modals */
.admin-days-modal .modal-dialog {
    max-width: 420px;
    margin: 1rem auto;
}

.admin-days-modal .modal-content {
    border: 1px solid var(--Gray50R028);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4);
}

.admin-days-modal .modal-header {
    padding: 20px 24px;
    align-items: center;
}

.admin-days-modal .modal-title {
    padding-left: 0;
    font-size: 20px;
    font-weight: 600;
}

.admin-days-modal .modal-header .close {
    margin: 0;
    padding: 4px;
    opacity: 0.85;
    color: var(--WhiteR028);
    font-size: 0;
    line-height: 0;
}

.admin-days-modal .modal-header .close:hover {
    opacity: 1;
}

.admin-days-modal .modal-body {
    padding: 24px 24px 20px;
}

.admin-days-modal__label {
    display: block;
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: var(--WhiteR028);
    margin-bottom: 10px;
}

.admin-days-modal__input {
    width: 100%;
    height: 48px;
    padding: 12px 16px;
    font-size: 16px;
    color: var(--WhiteR028);
    background: var(--Gray120R028);
    border: 1px solid var(--Gray50R028);
    border-radius: 12px;
}

.admin-days-modal__input::placeholder {
    color: rgba(237, 240, 244, 0.5);
}

.admin-days-modal__input:focus {
    border-color: var(--BlueR028);
    outline: none;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.25);
}

.admin-days-modal .modal-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    height: auto;
    padding: 16px 24px 20px;
}

.admin-days-modal .modal-footer .btn {
    min-width: 100px;
    padding: 10px 20px;
    font-weight: 600;
    border-radius: 10px;
}

.admin-days-modal .modal-footer .btn-primary {
    background: var(--BlueR028);
    border: none;
}

.admin-days-modal .modal-footer .btn-primary:hover {
    filter: brightness(1.1);
}

.admin-days-modal .modal-footer .btn-secondary {
    background: var(--Gray50R028);
    color: var(--WhiteR028);
    border: none;
}

.admin-days-modal .modal-footer .btn-secondary:hover {
    background: var(--Gray50R028);
    filter: brightness(1.15);
}

/* session expired */

.session-expired {
    padding: 20px;
    text-align: center;
}

.session-expired a {
    color: var(--BlueR028);
    text-decoration: none;
}

/* loading */

.loading {
    display: none;
    position: absolute;
    width: 1220px;
    height: 78vh;
}

.loading .loading-content {
    margin: 32vh 17vw;
    padding-left: 80px;
}

.loading .loading-logo {
    text-align: center;
}

.loading .loading-bar {
    display: flex;
    height: 8px;
    margin-top: 27px;
    margin-bottom: 16px;
}

.loading .loading-bar .bar-blue {
    background: var(--BlueR028);
    height: 8px;
    border-radius: 15px;
    z-index: 1;

    flex: 0;
}

.loading .loading-bar .bar-gray {
    background: var(--Gray50R028);
    height: 8px;
    border-radius: 0px 15px 15px 0px;
    width: calc(100% + 3px);
    margin-left: -3px;

    flex: 100;
}

.loading .loading-text {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 22px;

    color: var(--Gray30R028);

    text-align: center;
}

.guilds-cards .loading {
    position: initial;
    height: 35vh;
}

.guilds-cards .loading .loading-content {
    margin: 10vh 17vw;
    padding-left: 0;
}

/* select 2 */

.card-add-tag .select2 {
    width: -webkit-fill-available !important;
}

.select2-container--default .select2-selection--single {
    height: -webkit-fill-available;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    display: block;
    background: var(--BlackR028);
    border-radius: 30px;
    width: -webkit-fill-available;
    border: 0;
    height: 26px;
    color: var(--Gray30R028);
    font-size: 10px;
    padding: 0;
    padding-left: 10px;
    padding-top: 5px;
    padding-right: 25px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    content: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.2759 6H11.7239C11.8557 6.00003 11.9846 6.03914 12.0942 6.1124C12.2038 6.18565 12.2892 6.28976 12.3397 6.41156C12.3901 6.53336 12.4033 6.66738 12.3776 6.79669C12.3519 6.92599 12.2884 7.04476 12.1952 7.138L8.47123 10.862C8.34621 10.987 8.17668 11.0572 7.9999 11.0572C7.82312 11.0572 7.65358 10.987 7.52857 10.862L3.80457 7.138C3.71136 7.04476 3.64789 6.92599 3.62218 6.79669C3.59647 6.66738 3.60967 6.53336 3.66011 6.41156C3.71056 6.28976 3.79599 6.18565 3.90559 6.1124C4.0152 6.03914 4.14407 6.00003 4.2759 6Z' fill='%232E79FD'/%3E%3C/svg%3E%0A");
    height: 26px;
    position: absolute;
    top: -1px;
    right: 5px;
    width: 20px;
}

span.select2.select2-container.select2-container--default.select2-container--open .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--multiple {
    position: relative;
    width: 260px;
    z-index: 5;
    border: 0;
}

.select2-container.select2-container--open {
    transform: translateX(-141px);
    z-index: 7;
}

.select2-container.select2-container--open:has(> .select2-dropdown--below) {
    transform: translateX(0) !important;
    z-index: 4;
    width: 261px;
}

.select2-container--open .select2-dropdown--below {
    position: relative;
    z-index: 4;
    border: 0;
    overflow-y: auto;
}

.select2-dropdown {
    top: -10px;
    padding-top: 10px;
    background: #29292E;
    border-radius: 0px 0px 15px 15px;
    box-shadow: none;
    height: 207px;
}

.select2-container--default .select2-selection--multiple {
    background: var(--BlackR028);
    border-radius: 30px;
    width: -webkit-fill-available;
    min-height: 26px;
    height: 26px;
    padding: 0;
    padding-left: 10px;
    border: none;
    font-size: 10px;
    text-align: center;
    padding-right: 27px;
    color: var(--Gray30R028);
}

.select2-container--default .select2-selection--multiple::after {
    position: absolute;
    font-size: 19px;
    padding-left: 5px;
    content: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.2759 6H11.7239C11.8557 6.00003 11.9846 6.03914 12.0942 6.1124C12.2038 6.18565 12.2892 6.28976 12.3397 6.41156C12.3901 6.53336 12.4033 6.66738 12.3776 6.79669C12.3519 6.92599 12.2884 7.04476 12.1952 7.138L8.47123 10.862C8.34621 10.987 8.17668 11.0572 7.9999 11.0572C7.82312 11.0572 7.65358 10.987 7.52857 10.862L3.80457 7.138C3.71136 7.04476 3.64789 6.92599 3.62218 6.79669C3.59647 6.66738 3.60967 6.53336 3.66011 6.41156C3.71056 6.28976 3.79599 6.18565 3.90559 6.1124C4.0152 6.03914 4.14407 6.00003 4.2759 6Z' fill='%232E79FD'/%3E%3C/svg%3E%0A");
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    display: none;
}

.select2-container--default.select2-container--open.select2-container--below .select2-selection--single,
.select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple {
    border-radius: 30px;
}

.select2-container--default .select2-search--inline .select2-search__field {
    color: var(--Gray30R028);
}

.select2-results__option[aria-selected] {
    cursor: pointer;
    color: var(--Gray30R028);
    font-weight: 600;
    height: 12px;
    padding: 0;
    margin: 5px 18px;
    font-size: 12px;
    display: inline-flex;
    flex-direction: row;
    align-items: stretch;
    width: -webkit-fill-available;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    color: var(--Gray30R028);
}

.select2-results__option[aria-selected]:hover {
    color: var(--WhiteR028);
}

.select2-results__option[aria-selected]::before {
    content: url('data:image/svg+xml;utf8,<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="0.5" y="0.5" width="14" height="14" rx="4.5" fill="%2329292E"/><rect x="0.5" y="0.5" width="14" height="14" rx="4.5" stroke="%23838394"/></svg>');
    margin-right: 5px;
}

.select2-container--default .select2-results__option[aria-selected=true] {
    background-color: transparent;
    color: var(--Gray30R028);
}

.select2-container--default .select2-results__option[aria-selected=true]::before {
    content: url('data:image/svg+xml;utf8,<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="0.5" y="0.5" width="14" height="14" rx="4.5" fill="%2329292E"/><path d="M11.2761 6.30138L7.81965 9.57609C7.67821 9.71099 7.50989 9.81793 7.32446 9.8907C7.13904 9.96347 6.94021 10.0006 6.73951 9.99999H6.71281C6.50802 9.99702 6.30599 9.95473 6.11894 9.87568C5.9319 9.79662 5.76371 9.68245 5.62457 9.54006L3.75879 7.70034C3.67799 7.62931 3.61336 7.54339 3.56886 7.44785C3.52436 7.35231 3.50094 7.24916 3.50003 7.14474C3.49912 7.04031 3.52074 6.93681 3.56356 6.84059C3.60638 6.74436 3.66951 6.65744 3.74906 6.58516C3.82861 6.51287 3.92291 6.45675 4.02618 6.42024C4.12945 6.38372 4.2395 6.36758 4.34959 6.37281C4.45967 6.37803 4.56747 6.40452 4.66637 6.45063C4.76526 6.49674 4.85317 6.56151 4.9247 6.64096L6.74032 8.4347L10.1288 5.21518C10.2814 5.07555 10.4858 4.99828 10.6979 5.00003C10.9101 5.00178 11.113 5.08239 11.263 5.22452C11.413 5.36664 11.4981 5.5589 11.5 5.75989C11.5018 5.96088 11.4203 6.15451 11.2729 6.29908L11.2761 6.30138Z" fill="%23EDF0F4"/><rect x="0.5" y="0.5" width="14" height="14" rx="4.5" stroke="%23838394"/></svg>');
    margin-right: 5px;
}

.inputs .select2-container {
    width: -webkit-fill-available!important;
    text-align: center;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    background: var(--BlackR028);
    border: var(--BlackR028) 1px solid;
    border-radius: 15px;
    width: 100%;
    height: 40px;
    color: var(--WhiteR028);
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
}

.select2-container--default .select2-results > .select2-results__options {
    max-height: fit-content;
}

/* utils */

.br-15 {
    border-radius: 15px;
}

.mw40 {
    max-width: 40%;
}

.pdl-0 {
    padding-left: 0 !important;
}

.pd-0 {
    padding: 0 !important;
}

.mgt-10 {
    margin-top: 10px !important;
}

.mgr-10 {
    margin-right: 10px !important;
}

.mr-10 {
    margin-right: 10px;
}

.text-align-center {
    text-align: center;
}

.bl-gray30-1 {
    border-left: 1px solid var(--Gray30R028);
}

.flex-1 {
    flex: 1;
}

.flex-2 {
    flex: 2;
}

.text-align-end {
    text-align: end;
}

.fill-available {
    width: -webkit-fill-available!important;
}

.fit-content {
    width: fit-content!important;
}

.dashboard-group-200 {
    width: 200px!important;
}

.dashboard-group-250 {
    width: 250px!important;
}

.dashboard-group-400 {
    width: 400px!important;
}

.dashboard-group-450 {
    width: 450px!important;
}

.dashboard-group-500 {
    width: 500px!important;
}

.dashboard-group-580 {
    width: 580px!important;
}

.dashboard-1-rows {
    height: 80px!important;
}

.dashboard-2-rows {
    height: 198px!important;
}

.dashboard-4-rows {
    height: 432px!important;
}

.dashboard-6-rows {
    height: 576px!important;
}

.mg-0-250 {
    margin: 0 250px!important;
}

.m0 {
    margin: 0!important;
}

/* text colors */

.text-green {
    color: var(--GreenR028) !important;
}

.text-red {
    color: var(--RedR028) !important;
}

.text-blue {
    color: var(--BlueR028) !important;
}

.text-gray30 {
    color: var(--Gray30R028) !important;
}

/* discord */

span.role-mention {
    background-color: rgba(114, 137, 218, .1);
    color: #7289da;
}

span.channel-mention {
    background-color: rgba(114, 137, 218, .1);
    color: #7289da;
}

span.user-mention {
    background-color: rgba(114, 137, 218, .1);
    color: #7289da;
}

.emoji img {
    width: 22px !important;
    height: 22px !important;
}

/* header and navbar */

.header-container {
    margin: 50px auto 0 auto;
    width: fit-content;
    min-width: 1220px;
}

.navbar {
    padding: 0;
}

.navbar-expand-sm .navbar-item {
    display: flex;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
    align-items: center;
    margin: 0;
}

.menu-top-bar {
    background-color: var(--Gray100R028);
    border-radius: 15px;
    margin: 0 auto;
}

.nav-item {
    margin: 0px 20px;
}

.nav-item.theme-logo {
    margin: 0;
    margin-right: 35px;
}

.theme-logo img {
    width: 155px !important;
    height: 40px !important;
    border-radius: 0 !important;
}

.menu-title {
    color: var(--Gray30R028);
    font-size: 18px;
    font-weight: 500;
    line-height: 22px;

    padding-left: 10px;
}

.nav-item.selected {
    border-bottom: var(--BlueR028) 5px solid;
    height: 54px;
}

.navbar-expand-sm .navbar-item .nav-link {
    line-height: 2.75rem;
    padding: 6.24px 9.6px;
    text-transform: initial;
    position: unset;
}

.button-extend {
    background-color: var(--BlueR028);
    border-radius: 15px;
    color: var(--WhiteR028);
    font-size: 18px;
    font-weight: 500;
    line-height: 22px;
    display: inline-flex;
    align-items: center;
    overflow: hidden;
    position: relative;
    width: 50px;
    min-width: 50px;
    transition: width 0.5s ease;
    padding: 0px !important;
}

.button-extend:hover {
    width: auto;
}

.button-extend .icon {
    flex-shrink: 0;
}

.button-extend .text {
    opacity: 0;
    width: 0;
    overflow: hidden;
    white-space: nowrap;
    transition: opacity 0.3s ease 0.2s, width 0s ease 0.5s;
    padding-right: 15px;
}

.button-extend:hover .text {
    opacity: 1;
    width: auto;
    transition: opacity 0.3s ease 0.2s, width 0s ease 0s;
}

.button-extend.btn-secondary {
    margin: auto;
    background-color: var(--Gray100R028);
}

.menu-top-bar2>li {
    margin: 0 10px;
    position: relative;
    flex-shrink: 0;
}

.menu-top-bar2 {
    overflow: visible;
}

.navbar .navbar-item .nav-item.user-profile-dropdown {
    margin: 0;
    margin-left: 40px;
}

.navbar .navbar-item .nav-item.user-profile-dropdown .nav-link.user {
    padding: 0;
    position: relative;
}

.navbar .navbar-item .nav-item.user-profile-dropdown .dropdown-menu {
    max-width: 13rem;
}

.navbar .navbar-item .nav-item.user-profile-dropdown .dropdown-menu .dropdown-item a {
    display: block;
    color: var(--WhiteR028);
    padding: 4px 14px;

    font-family: 'Inter', sans-serif;
    font-style: normal;
    font-size: 12px;
    font-weight: 500;
    line-height: 15px;

    text-align: center;
}

.navbar .navbar-item .nav-item.user-profile-dropdown .dropdown-menu .dropdown-item a:hover {
    text-decoration: none;
}

.navbar .navbar-item .nav-item.user-profile-dropdown .dropdown-menu .dropdown-item {
    padding: 0;
    background: 0 0;
}

.header-container .navbar .dropdown-item {
    line-height: 1.8;
    font-size: .96rem;
    padding: 15px 0;
    word-wrap: normal;
}

.header-container .navbar .navbar-item .nav-item.dropdown .dropdown-user-menu::after {
    position: absolute;
    content: '';
    top: -10px;
    margin-left: -7px;
    height: 0;
    width: 0;
    border-left: 9px solid transparent;
    border-right: 9px solid transparent;
    border-bottom: 15px solid #fff;
    left: auto;
    border-bottom-color: var(--Gray100R028);
    right: 42%;
}

.header-container .navbar .navbar-item .nav-item.dropdown .dropdown-user-menu {
    background: var(--Gray100R028);
    top: 113% !important;
    right: -110%;
    border: none;
    border-radius: 7px;
    padding: 10px;
}

.header-container .navbar .navbar-item .nav-item.dropdown .dropdown-user-menu.show {
    background: var(--Gray100R028);
    top: 113% !important;
    right: -110%;
}

.header-container .navbar .language-dropdown a.nav-link {
    position: relative;
    font-size: 24px;
    padding: 0;
}

.header-container .navbar .language-dropdown .dropdown-menu a span {
    color: #bfc9d4;
    font-weight: 500;
}

.user img {
    width: 60px !important;
    height: 60px !important;
    border-radius: 50% !important;
}

/* home */

.content-home {
    display: flex;
    max-width: 1220px;
    margin: 84px auto 96px;
}

.content-home .content-left {
    flex: 1;
}

.content-home .content-right {
    flex: 1;
    margin-left: 35px;
}

.content-home .content-left h1 {
    color: var(--WhiteR028);
    font-size: 48px;
    font-weight: 700;
    line-height: 58px;
    margin-bottom: 20px;
}

.content-home .content-left p {
    color: var(--Gray30R028);
    font-size: 18px;
    font-weight: 400;
    line-height: 22px;
    margin-bottom: 20px;
}

.content-client {
    background-color: var(--Gray100R028);
    padding: 95px 0;
    height: 410px;
}

.content-client .title {
    font-family: 'Noto Sans', sans-serif;
    font-size: 48px;
    font-weight: 700;
    line-height: 156.5%;
    margin-bottom: 0;
}

.content-client .description {
    font-family: 'Noto Sans', sans-serif;
    color: var(--Gray30R028);
    font-size: 18px;
    font-weight: 400;
    line-height: 156.5%;
    margin-bottom: 0;
}

.content-client-list {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    background: var(--Gray100R028);
    padding-top: 41px;
    padding-bottom: 93px;

    animation-timing-function: linear;
    animation-iteration-count: infinite;

    float: right;
    animation-name: content-client-list;
}

@-webkit-keyframes content-client-list {
    to {
        -webkit-transform: translateX(50%);
        transform: translateX(50%)
    }
}

@keyframes content-client-list {
    to {
        -webkit-transform: translateX(50%);
        transform: translateX(50%)
    }
}

.content-client-item {
    margin: 0 15px;
    width: 350px;
    height: 80px;
    display: flex;

    background: var(--BlackR028);
    border-radius: 15px;

    flex: none;
    flex-grow: 0;
}

.content-client-item .guild-icon img {
    margin-left: 9px;
    margin-top: 9px;
    width: 60px;
    height: 60px;
    border-radius: 50%;
}

.content-client-item .guild-info {
    margin-left: 21px;
    margin-top: 18px;
    width: max-content;
}

.content-client-item .guild-info h2 {
    font-family: 'Inter', sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 22px;
    color: var(--WhiteR028);
    margin-bottom: 4px;

    display: inline-block;
    width: 205px;
    white-space: nowrap;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

.content-client-item .guild-info p {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 19px;
    color: var(--BlueR028);
}

.content-client-item .guild-invite {
    margin-left: auto;
    margin-right: 0;
    margin-top: 20px;
    width: 50px;
    height: 40px;
    background-color: var(--Gray100R028);
    border: 3px solid var(--BlackR028);
    border-radius: 15px 0px 0px 15px;
    cursor: pointer;
}

.content-client-item .guild-invite .icon {
    margin-left: 13px;
    margin-top: 5px;
    padding: 0;
    width: 21px;
}

.content-client-item .guild-invite--disabled {
    display: none;
}

.content-client-item a.guild-invite {
    text-decoration: none;
    color: inherit;
    display: flex;
    align-items: center;
}

.content-store {
    background: var(--BlueR028);
}

.content-store-list {
    background: var(--BlueR028);
    display: flex;
    width: 1220px;
    margin: 0 auto;
    padding: 70px 0;
}

.content-store-card {
    width: 350px;
    min-height: 500px;
    background: var(--BlackR028);
    border-radius: 15px;
}

.content-store-card.disabled {
    background: var(--Gray100R028);
}

.content-store-card.center {
    margin: 0 85px;
}

.no-info {
    margin: 0 auto;
    width: 80%;
    height: 30px;
    background: var(--BlackR028);
    border-radius: 15px;
}

.content-store-title {
    margin: 44px auto 0 auto;
    font-family: 'Inter', sans-serif;
    font-size: 24px;
    font-weight: 700;
    line-height: 29px;
    color: var(--WhiteR028);
    text-align: center;
}

.content-store-price {
    margin: 28px auto;
    width: 100%;
    justify-content: center;
    align-items: center;
}

.content-store-price .buttons {
    margin: 0 auto;
    width: 100%;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.content-store-price .price-container {
    margin-top: 19px;
    width: 100%;
    height: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.content-store-price .price-container .currency {
    font-family: 'Inter', sans-serif;
    font-size: 36px;
    font-weight: 500;
    line-height: 100.02%;
    text-align: right;
    color: var(--Gray30R028);
}

.content-store-price .price-container .price {
    margin: auto 0;
    font-family: 'Inter', sans-serif;
    font-size: 96px;
    font-weight: 900;
    line-height: 100.02%;
    text-align: center;
    color: var(--WhiteR028);
}

.content-store-price h3 {
    margin: 71px auto;
    font-family: 'Inter', sans-serif;
    font-size: 28px;
    font-weight: 700;
    line-height: 24px;
    text-align: center;

    color: var(--Gray30R028);
}

.content-store-features {
    margin: 16px 33px 0 33px;
}

.feature {
    height: 30px;
    background: var(--Gray100R028);
    border-radius: 15px;
    margin-bottom: 10px;
    display: flex;
}

.feature-icon {
    width: 16px;
    height: 16px;
    margin: 0 10px;
}

.feature-text {
    font-family: 'Inter', sans-serif;
    font-size: 12px;
    font-weight: 500;
    line-height: 15px;
    text-align: center;
    color: var(--WhiteR028);
    margin: auto;
    padding-right: 36px;
}

.content-store-button {
    margin: 35px 60px 30px 60px;
}

.content-store-button .btn {
    width: 100%;
    height: 50px;
    border-radius: 15px;

    font-family: 'Inter', sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 22px;
    text-align: center;
    color: var(--WhiteR028);
    padding-top: 13px;
}

.content-store-tag {
    margin-top: -30px;
    padding-top: 15px;
    height: 28px;
}

.tag-popular {
    width: 126px;
    height: 28px;
    background: #FFB800;
    border-radius: 5px;

    margin: 0 auto;
    padding: 6px 29px;
    display: flex;
}

.tag-popular .tag-icon {
    font-size: x-small;
    margin-right: 7px;
}

.tag-popular .tag-text {
    font-family: 'Inter', sans-serif;
    font-size: 12px;
    font-weight: 700;
    line-height: 15px;
    text-align: center;
    color: var(--BlackR028);
}

.discount {
    width: 43px;
    height: 46px;
    background: var(--GreenR028);
    border-radius: 15px;
    padding: 2% 0px;
}

.discount .discount-oldPrice {
    font-family: 'Inter', sans-serif;
    font-size: 12px;
    font-weight: 500;
    line-height: 15px;
    text-align: center;
    color: var(--BlackR028);
    font-weight: bold;
}

.discount .discount-off {
    font-family: 'Inter', sans-serif;
    font-size: 12px;
    font-weight: 500;
    line-height: 15px;
    text-align: center;
    color: var(--BlackR028);
    font-weight: bold;
}

/* Footer */

.content-footer {
    background: var(--BlackR028);
}

.content-footer .footer-info {
    background: var(--Gray100R028);
    width: 1220px;
    margin: 115px auto;
    border-radius: 15px;
    padding: 30px 60px;
    display: flex;
}

.footer-pages {
    flex: 1;
    text-align: center;
}

.footer-policies {
    flex: 1;
    text-align: center;
}

.footer-socials {
    flex: 1;
    text-align: center;
}

.footer-title {
    display: flex;
    margin-bottom: 10px;
    justify-content: center;
}

.footer-title .footer-icon {
    margin-right: 10px;
}

.footer-title h3 {
    font-family: 'Inter', sans-serif;
    font-size: 25px;
    font-weight: 600;
    line-height: 110.5%;
    color: var(--WhiteR028);
}

.footer-pages a {
    font-family: 'Inter', sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 211.5%;
    color: var(--Gray30R028);
}

.footer-policies a {
    font-family: 'Inter', sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 211.5%;
    color: var(--Gray30R028);
}

.footer-socials a {
    font-family: 'Inter', sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 211.5%;
    color: var(--Gray30R028);
}

.footer-bottom {
    background: var(--Gray100R028);
    width: 100%;
    height: 90px;
    display: flex;
}

.footer-bottom .footer-bottom-left {
    flex: 1;
    display: flex;
    align-items: center;
    padding-left: 60px;
}

.footer-bottom .footer-bottom-left p {
    font-family: 'Inter', sans-serif;
    font-size: 12px;
    font-weight: 400;
    line-height: 211.5%;
    color: var(--Gray30R028);
}

.footer-bottom .footer-bottom-right {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 60px;
}

.footer-bottom .footer-bottom-right p {
    font-family: 'Inter', sans-serif;
    font-size: 12px;
    font-weight: 400;
    line-height: 211.5%;
    color: var(--Gray30R028);
}

.footer-bottom .footer-bottom-right span {
    margin: 0 10px;
}

.footer-bottom .footer-bottom-right p a {
    font-family: 'Inter', sans-serif;
    font-size: 12px;
    font-weight: 400;
    line-height: 211.5%;
    color: var(--BlueR028);
}

/* Invoice */

.invoice-card {
    background: var(--Gray120R028);
    border-radius: 15px;
    padding: 50px 50px;
    margin-bottom: 50px;
}

.invoice-card .invoice-header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 30px;
}

.invoice-card .invoice-header .invoice-from {
    flex: 2;
    display: flex;
}

.invoice-card .invoice-header .invoice-from .invoice-logo {
    flex: 1;
    justify-content: left;
    align-items: flex-start;
}

.invoice-card .invoice-header .invoice-from .invoice-address {
    flex: 2;
    justify-content: center;
    align-items: center;
    align-self: center;
    padding-top: 20px;
}

.invoice-card .invoice-header .invoice-from .invoice-address p {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
    color: var(--WhiteR028);
    width: 100%;
    text-align: center;
}

.invoice-card .invoice-header .invoice-to .invoice-address {
    justify-content: right;
    align-items: flex-end;
    align-self: center;
    padding-top: 20px;
}

.invoice-card .invoice-header .invoice-to .invoice-address p {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
    color: var(--WhiteR028);
    width: 100%;
    text-align: right;
}

.invoice-card .invoice-body {
    display: flex;
    margin-bottom: 30px;
}

.invoice-card .invoice-body .invoice-date {
    flex: 1;
    justify-content: left;
    align-items: flex-start;
}

.invoice-card .invoice-body .invoice-date .invoice-detail-title {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
    color: var(--WhiteR028);
    width: 100%;
    text-align: center;
}

.invoice-card .invoice-body .invoice-date .invoice-detail-desc {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
    color: var(--WhiteR028);
    width: 100%;
    text-align: center;
}

.invoice-card .invoice-table {
    width: 100%;
    margin-bottom: 30px;
}

.invoice-card .invoice-table .table {
    width: 100%;
    border-collapse: collapse;
}

.invoice-card .invoice-table .table thead {
    background: var(--Gray80R028);
    border-radius: 15px;
}

.invoice-card .invoice-table .table thead tr {
    border-radius: 15px;
}

.invoice-card .invoice-table .table thead tr th {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
    color: var(--WhiteR028);
    text-align: center;
    padding: 10px 0;
}

.invoice-card .invoice-table .table tbody tr {
    background: var(--Gray120R028);
    border-radius: 15px;
}

.invoice-card .invoice-table .table tbody tr td {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
    color: var(--WhiteR028);
    text-align: center;
    padding: 10px 0;
    border: none !important;
}

.invoice-card .invoice-total {
    display: flex;
    justify-content: space-between;
    margin-bottom: 30px;
}

.invoice-card .invoice-total .invoice-total-item {
    flex: 1;
    justify-content: left;
    align-items: flex-start;
}

.invoice-card .invoice-total .invoice-total-item .invoice-total-title {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
    color: var(--WhiteR028);
    width: 100%;
    text-align: center;
}

.invoice-card .invoice-total .invoice-total-item .invoice-total-amount {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
    color: var(--WhiteR028);
    width: 100%;
    text-align: center;
}

.invoice-card .invoice-payment {
    display: flex;
    justify-content: space-between;
    margin-bottom: 30px;
}

.invoice-card .invoice-payment .invoice-payment-item {
    flex: 1;
    justify-content: left;
    align-items: flex-start;
}

.invoice-card .invoice-payment .invoice-payment-item .invoice-payment-head {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
    color: var(--WhiteR028);
    width: 100%;
    text-align: center;
}

.invoice-card .invoice-payment .invoice-payment-item .invoice-payment-head h6 {
    font-family: 'Inter', sans-serif;
    font-size: 24px;
    font-weight: bold;
    line-height: 19px;
    color: var(--WhiteR028);
    width: 100%;
    text-align: center;

    padding-bottom: 20px;
}

.invoice-card .invoice-payment .invoice-payment-item .invoice-payment-body {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
    color: var(--WhiteR028);
    width: 100%;
    text-align: center;

    padding-bottom: 20px;
}

.invoice-card .invoice-payment .invoice-payment-item .invoice-payment-body .pix {
    display: flex;
    width: 100%;
}

.invoice-card .invoice-payment .invoice-payment-item .invoice-payment-body .pix img {
    padding-right: 30px;
    flex: 1;
}

.invoice-card .invoice-payment .invoice-payment-item .invoice-payment-body .pix .pix-info {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
    color: var(--WhiteR028);
    flex: 1;
    width: 1px;
    text-align: center;
}

.invoice-card .invoice-payment .invoice-payment-item .invoice-payment-body .pix .pix-info .pix-key {
    background: var(--BlackR028);
    overflow-x: scroll;
    border-radius: 15px;
    padding: 10px 20px;
    margin-bottom: 20px;
}

.invoice-card .invoice-payment .invoice-payment-item .invoice-payment-body .pix .pix-info .pix-key span {
    font-family: 'Inter', sans-serif;
    font-size: 12px;
    font-weight: 400;
    line-height: 19px;
    color: var(--WhiteR028);
    width: 100%;
    text-align: center;
}

.pix-key::-webkit-scrollbar {
    width: 2px;
    height: 5px;
}

.invoice-card .invoice-payment .invoice-payment-item .invoice-payment-body .pix .pix-info .invoice-payment-footer {
    font-family: 'Inter', sans-serif;
    font-size: 12px;
    font-weight: 400;
    line-height: 19px;
    color: var(--WhiteR028);
    width: 100%;
    text-align: center;

    padding-top: 50px;
    padding-bottom: 20px;
}

.invoice-card .invoice-payment .invoice-payment-item .invoice-payment-footer {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
    color: var(--WhiteR028);
    width: 100%;
    text-align: center;
}

.invoice-card .invoice-footer {
    justify-content: space-between;
    margin-bottom: 30px;
}

.invoice-card .invoice-footer li a {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
    color: var(--BlueR028);
    width: 100%;
    text-align: center;
}

/* Commands */

.commands-card {
    background: var(--Gray100R028);
    border-radius: 15px;
    display: flex;
    margin-bottom: 80px;
}

.commands-card .sidebar-commands {
    background: var(--Gray120R028);
    border-radius: 15px;
    margin: 94px 35px 94px 94px;
    min-width: 245px;
    padding: 36px 36px 36px 36px;
}

.file-tree .file-tree-folder::after {
    content: url("data:image/svg+xml,%3Csvg width='14' height='9' viewBox='0 0 14 9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.999787 0.707123H12.1718C12.3695 0.707165 12.5628 0.765837 12.7272 0.875721C12.8917 0.985605 13.0198 1.14177 13.0955 1.32447C13.1711 1.50717 13.1909 1.7082 13.1524 1.90215C13.1138 2.0961 13.0186 2.27427 12.8788 2.41412L7.29279 8.00011C7.10526 8.18758 6.85095 8.2929 6.58579 8.2929C6.32062 8.2929 6.06631 8.18758 5.87879 8.00011L0.292787 2.41412C0.152977 2.27427 0.057771 2.0961 0.0192034 1.90215C-0.0193641 1.7082 0.000439122 1.50717 0.0761092 1.32447C0.151779 1.14177 0.279919 0.985605 0.444329 0.875721C0.608738 0.765837 0.802037 0.707165 0.999787 0.707123Z' fill='%232E79FD'/%3E%3C/svg%3E");
    top: 5px;
}

.file-tree .file-tree-folder.open::after {
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    transform: rotate(-90deg);
    top: 3px;
}

.file-tree li.file-tree-folder::before {
    display: none;
}

.file-tree li::before {
    display: none;
}

.file-tree .file-tree-folder {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 19px;
    color: var(--WhiteR028);
}

.file-tree ul {
    padding-left: 0px !important;
}

.file-tree li {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
    color: var(--Gray30R028);

    cursor: pointer;
}

.panel-commands {
    background: var(--Gray100R028);
    border-radius: 15px;

    margin: 94px 94px 94px 35px;
    width: -webkit-fill-available;
}

.panel-commands .panel-visual {
    background: var(--BlackR028);
    border-radius: 15px 15px 0px 0px;
    width: 100%;
    height: 440px;
}

.panel-commands .panel-visual img {
    width: 100%;
    height: 100%;
    border-radius: 15px 15px 0px 0px;
}

.panel-commands .panel-body {
    background: var(--Gray120R028);
    padding: 30px 45px 30px 45px;
    border-radius: 0px 0px 15px 15px;
}

.panel-commands .panel-body .panel-header {
    justify-content: space-between;
    align-items: center;
}

.panel-commands .panel-body .panel-header h1 {
    font-family: 'Inter', sans-serif;
    font-size: 24px;
    font-weight: 700;
    line-height: 29px;
    color: var(--WhiteR028);

    margin: 0 auto;
    text-align: center;
}

.panel-commands .panel-body .panel-header p {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
    color: var(--Gray30R028);

    margin: 0 auto;
    text-align: center;
}

.panel-commands .panel-body .panel-content {
    margin-top: 15px;
}

.panel-commands .panel-body .panel-content .panel-alias h1 {
    font-family: 'Inter', sans-serif;
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
    color: var(--Gray30R028);
}

.panel-commands .panel-body .panel-content .panel-alias p {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 19px;
    color: var(--WhiteR028);
}

.panel-commands .panel-body .panel-content .panel-info {
    margin: 0 80px;
    display: flex;
    margin-top: 15px;
}

.panel-commands .panel-body .panel-content .panel-info h1 {
    flex: 1;
    font-family: 'Inter', sans-serif;
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
    color: var(--Gray30R028);

    text-align: center;
}

.panel-commands .panel-body .panel-content .panel-usage {
    margin-top: 15px;
}

.panel-commands .panel-body .panel-content .panel-usage h1 {
    font-family: 'Inter', sans-serif;
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
    color: var(--Gray30R028);
}

.panel-commands .panel-body .panel-content .panel-usage p {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 19px;
    color: var(--WhiteR028);
}

.panel-commands .panel-body .panel-content .panel-example {
    margin-top: 15px;
}

.panel-commands .panel-body .panel-content .panel-example h1 {
    font-family: 'Inter', sans-serif;
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
    color: var(--Gray30R028);
}

.panel-commands .panel-body .panel-content .panel-example p {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 19px;
    color: var(--WhiteR028);
}

/* Webhook */

.commands-card .sidebar-commands.webhook {
    padding: 36px 12px 36px 20px;
}

.row-webhook {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.webhook-button {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 19px;
    color: var(--Gray30R028);
    padding: 3px 0;
}

.webhook-button::before {
    content: url("data:image/svg+xml,%3Csvg width='11' height='11' viewBox='0 0 11 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M5.5 11C8.53757 11 11 8.53757 11 5.5C11 2.46243 8.53757 0 5.5 0C2.46243 0 0 2.46243 0 5.5C0 8.53757 2.46243 11 5.5 11ZM5.5 9C7.433 9 9 7.433 9 5.5C9 3.567 7.433 2 5.5 2C3.567 2 2 3.567 2 5.5C2 7.433 3.567 9 5.5 9Z' fill='%232E79FD'/%3E%3C/svg%3E%0A");
    display: inline-block;
    width: 20px;
    height: 20px;
}

.webhook-button.active {
    color: var(--WhiteR028);
}

.webhook-button.active::before {
    content: url("data:image/svg+xml,%3Csvg width='11' height='11' viewBox='0 0 11 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11 5.5C11 8.53757 8.53757 11 5.5 11C2.46243 11 0 8.53757 0 5.5C0 2.46243 2.46243 0 5.5 0C8.53757 0 11 2.46243 11 5.5Z' fill='%232E79FD'/%3E%3C/svg%3E%0A");
}

.webhook-button:hover {
    text-decoration: none;
}

.webhook-arcodion {
    background: var(--Gray100R028);
    border-radius: 5px;
    margin-top: 14px;
}

.webhook-arcodion .webhook-header {
    width: 100%;
    text-align: center;
    margin: 10px 0;
}

.webhook-arcodion .webhook-header h1 {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 19px;
    color: var(--BlueR028);
}

.webhook-arcodion .webhook-content {
    width: 100%;
    margin: 0 16px;
}

.webhook-arcodion .webhook-content .webhook-arcodion-content {
    margin: 5px 0;
    background: var(--Gray120R028);
    border-radius: 5px;
    display: flex;
    padding: 4px 8px;
    width: 182px;
}

.webhook-arcodion .webhook-content .webhook-arcodion-content.active {
    background: var(--Gray50R028);
}

.webhook-arcodion .webhook-content .webhook-arcodion-content h2 {
    flex: 1;
    font-family: 'Inter', sans-serif;
    margin: 4px 0;
    font-size: 14px;
    font-weight: 500;
    line-height: 17px;
    color: var(--WhiteR028);

    cursor: pointer;
}

.webhook-arcodion .webhook-content .webhook-arcodion-content .icon {
    cursor: pointer;
    padding: 0;
    margin: 0;
}

.webhook-arcodion .webhook-buttons-footers {
    margin: 10px 16px 16px;
}

.webhook-arcodion .webhook-buttons-footers .webhook-arcodion-button {
    width: 100%;
    border: var(--Gray120R028) 3px solid;
    border-radius: 5px;
    text-align: center;
}

.webhook-arcodion .webhook-buttons-footers .webhook-arcodion-button:hover {
    background: var(--Gray30R028);
}

.webhook-arcodion .webhook-buttons-footers .webhook-arcodion-button svg {
    margin: 2.2px 0;
}

.webhook-buttons-footers {
    flex: 1;
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
}

.panel-visual:has(.profile:not([style*="display: none"])) {
    height: 230px;
}

.panel-visual .profile {
    width: 340px;
    height: 174px;
    display: flex;
    flex-direction: column;

    margin: auto;
    padding: 30px 0;
}

.panel-visual .profile .profile-banner {
    background: var(--WhiteR028);
    width: 340px;
    height: 60px;
    border-radius: 15px 15px 0 0;
}

.panel-visual .profile .profile-banner img {
    width: 0px;
    height: 60px;
}

.panel-visual .profile .profile-avatar {
    width: 80px;
    height: 80px;
    border-radius: 30px;
    position: absolute;
    margin: 20px;
}

.panel-visual .profile .profile-avatar img {
    width: 80px;
    height: 80px;
    border-radius: 30px;
    src: url('https://cdn.discordapp.com/attachments/1041879586314666034/1041879604870254622/unknown.png');
    outline: var(--Gray100R028) 5px solid;
}

.panel-visual .profile .profile-info {
    background: var(--Gray100R028);
    padding: 50px 16px 16px;
    border-radius: 0 0 15px 15px;
}

.panel-visual .profile .profile-info .name {
    background: var(--BlackR028);
    border-radius: 15px;
    padding: 12px;
    display: flex;
}

.panel-visual .profile .profile-info .name h1 {
    font-family: 'Noto Sans', sans-serif;
    font-size: 20px;
    font-weight: 600;
    line-height: 24px;
    color: var(--WhiteR028);
    margin: 0;
}

.panel-visual .profile .profile-info .name .bot-badge {
    background: var(--BlueR028);
    border-radius: 15px;
    padding: 0px 8px;
    margin-left: 12px;
    margin-top: 3px;
    height: 20px;
}

.panel-visual .profile .profile-info .name .bot-badge .bot-badge-text {
    font-family: 'Noto Sans', sans-serif;
    font-size: 12px;
    font-weight: 600;
    line-height: 14px;
    color: var(--WhiteR028);
    position: relative;
    top: -4px;
}

.panel-body .profile-inputs div {
    margin: 0 0 10px;
}

.panel-visual .message {
    padding: 20px;
    overflow-y: auto;
    height: -webkit-fill-available;
}

.panel-visual .message .message-header {
    display: flex;
}

.panel-visual .message .message-header .message-avatar img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    margin-right: 15px;
}

.panel-visual .message .message-header .message-info {
    display: flex;
}

.panel-visual .message .message-header .message-info .message-name {
    display: flex;
}

.panel-visual .message .message-header .message-info .message-name h1 {
    font-family: 'Noto Sans', sans-serif;
    font-size: 20px;
    font-weight: 600;
    line-height: 24px;
    color: var(--WhiteR028);
    margin: 0;
}

.panel-visual .message .message-header .message-info .message-name .bot-badge {
    background: var(--BlueR028);
    border-radius: 15px;
    padding: 0px 8px;
    margin-left: 12px;
    margin-top: 3px;
    height: 20px;
}

.panel-visual .message .message-header .message-info .message-name .bot-badge .bot-badge-text {
    font-family: 'Noto Sans', sans-serif;
    font-size: 12px;
    font-weight: 600;
    line-height: 14px;
    color: var(--WhiteR028);
    position: relative;
    top: -4px;
}

.panel-visual .message .message-content {
    margin: -15px 55px 5px;
}

.panel-visual .message .message-embeds {
    display: flex;
    flex-direction: column;
}

.panel-visual .message .message-embeds .message-embed {
    display: grid;
    background: var(--Gray100R028);
    border-radius: 5px;
    margin: -10px 55px 25px;
}

.panel-visual .message .message-embeds .message-embed::before {
    content: '';
    width: 5px;
    border-radius: 5px 0 0 5px;

    background: var(--BlueR028);
}

.grid-col-2 {
    grid-column: 2;
}

.panel-visual .message .message-embeds .message-embed .message-embed-header {
    padding: 20px 20px 2px;
    display: grid;
}

.panel-visual .message .message-embeds .message-embed .message-embed-header .message-embed-image img {
    width: 80px;
    height: 80px;
    border-radius: 7px;
    left: 86%;
}

.panel-visual .message .message-embeds .message-embed .message-embed-header .message-embed-title h1 {
    font-family: 'Noto Sans', sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 20px;
    color: var(--WhiteR028);
    margin: 0;
}

.panel-visual .message .message-embeds .message-embed .message-embed-header .message-embed-description p {
    font-family: 'Noto Sans', sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    color: var(--WhiteR028);
    margin: 0;
}

.panel-visual .message .message-embeds .message-embed .message-embed-content {
    padding: 10px 20px;
}

.panel-visual .message .message-embeds .message-embed .message-embed-content .message-embed-fields {
    display: grid;
    grid-gap: 8px;
    padding-right: 80px;
}

.message-embed-content .message-embed-fields .message-embed-field {
    flex: 100%;
    margin-right: 10px;

}

.message-embed-content .message-embed-fields .message-embed-field .message-embed-field-name h1 {
    font-family: 'Noto Sans', sans-serif;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    color: var(--WhiteR028);
    margin: 0;
}

.message-embed-content .message-embed-fields .message-embed-field .message-embed-field-value p {
    font-family: 'Noto Sans', sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    color: var(--WhiteR028);
    margin: 0;
}

.message-embed .message-embed-imagedown {
    width: 100%;
    padding: 10px 120px 10px 20px;
}

.message-embed .message-embed-imagedown img {
    width: 100%;
    height: 100%;
    border-radius: 5px;
}

.message-embed .message-embed-footer {
    height: 40px;
    padding-left: 20px;
    display: flex;
}

.message-embed .message-embed-footer .message-embed-footer-image img {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    margin-right: 8px;
}

.message-embed .message-embed-footer .message-embed-footer-text {
    font-family: 'Noto Sans', sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    color: var(--WhiteR028);
    margin: 0;
    margin-top: 5px;
}

.message-inputs .message-content-form #message-content {
    min-height: 200px;
}

.embeds-inputs .embed-color-form {
    display: flex;
}

.embeds-inputs>div {
    margin-bottom: 10px;
}

.embeds-inputs #embed-description {
    min-height: 200px;
}

.embeds-inputs .embed-fields-form {
    display: grid;
}

.embeds-inputs .embed-fields-form .embed-fields {
    grid-column: 1;
    width: 580px;
}

.embeds-inputs .embed-fields-form .embed-fields-add {
    grid-column: 2;
    text-align: center;
}

.embeds-inputs .embed-fields-form .embed-fields-add svg {
    cursor: pointer;
}

.embeds-inputs .embed-fields-form .embed-fields {
    padding: 0 10px;
}

.embeds-inputs .embed-fields-form .embed-fields .embed-field {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 10px;
    margin-bottom: 10px;
}

.embeds-inputs .embed-fields-form .embed-fields .embed-field .embed-field-name-form {
    grid-column: 1;
}

.embeds-inputs .embed-fields-form .embed-fields .embed-field .embed-field-value-form {
    grid-column: 2;
}

.embeds-inputs .embed-fields-form .embed-fields .embed-field .embed-field-options-form {
    grid-column: 3;
    text-align: center;
}

.embed-field-options-form .embed-field-remove {
    margin-bottom: 8px;
}

.embed-field-options-form .embed-field-remove svg {
    cursor: pointer;
}

.embed-field-options-form .embed-field-inline {
    padding-top: 8px;
}

.embed-field-options-form .embed-field-inline .container {
    margin: 0;
}

.embeds-inputs .embed-footers-form {
    display: grid;
    grid-gap: 10px;
}

.embeds-inputs .embed-footers-form .embed-footer-image-form {
    grid-column: 1;
}

.embeds-inputs .embed-footers-form .embed-footer-text-form {
    grid-column: 2;
    width: 380px;
}

/* Admin bar */

.admin-bar .navbar-item {
    width: 1220px;
    margin: 130px auto 0;
    padding: 5px 2.5px 0;
}

.menu-admin {
    background-color: var(--Gray120R028);
    border-radius: 15px 15px 0 0;
}

.menu-admin .nav-item {
    flex: 1;
    text-align: center;
    margin: 0 2.5px;
    height: 55px;
}

.menu-admin .nav-item.selected {
    background-color: var(--Gray100R028);
    border-radius: 15px 15px 0 0;
    border-bottom: none;
}

.menu-admin .nav-item.selected::before {
    content: '';
    position: absolute;
    width: 150px;
    height: 6px;
    bottom: 0;
    background: var(--BlueR028);
    margin-left: -75px;
    border-radius: 15px 15px 0 0;
}

.menu-admin .nav-item .menu-title {
    padding-left: 0;
}

/* page default */

.layout-px-spacing {
    width: 1220px;
    margin: 0 auto;
    margin-bottom: 130px;
}

.layout-content-spacing {
    width: 1220px;
    margin: 60px auto;
}

/* admin page */

.layout-table.admin {
    padding: 50px 95px;
}

.admin-cards {
    justify-content: space-between;
    margin: 0 0 50px;
}

.admin-cards .admin-card {
    display: flex;
    width: 300px;
    height: 50px;
}

.admin-card .icon {
    background: var(--Gray120R028);
    border-radius: 15px 0 0 15px;
    margin-right: 0;
}

.admin-card .text {
    background: var(--Gray120R028);
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 19px;
    text-align: center;
    flex: 2;
    padding: 15.5px 0;
}

.admin-card.card-bots .text {
    color: var(--BlueR028);
}

.admin-card.card-payments .text {
    color: var(--GreenR028);
}

.admin-card.card-expireds .text {
    color: var(--OrangeR028);
}

.admin-cards .value {
    background: var(--BlackR028);
    border-radius: 0 15px 15px 0;
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 19px;
    text-align: center;
    color: var(--WhiteR028);
    flex: 1;
    padding: 15.5px 0;
}

.admin .table {
    border-collapse: separate;
    border-spacing: 0 10px;
}

.admin .table>thead>tr>th {
    padding: 10px 0px 20px;
}

.layout-table.admin tbody tr td:first-child {
    background: var(--Gray120R028);
    border-radius: 30px 0 0 30px;
    border: var(--Gray100R028) 1px solid;
}

.layout-table.admin tbody tr td:last-child {
    background: var(--Gray120R028);
    border-radius: 0 30px 30px 0;
    border: var(--Gray100R028) 1px solid;
}

.layout-table.admin tbody tr td {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 19px;
    text-align: center;
    background: var(--Gray120R028);
    border: var(--Gray100R028) 1px solid;
    padding-right: 0;
}

.layout-table.admin tbody tr td.dashboard-card-info-content-item-bubble-row-status {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 19px;
    text-align: center;
}

.layout-table.admin tbody tr td.dashboard-card-info-content-item-bubble-row-status.status-success::before {
    content: url("data:image/svg+xml,%3Csvg width='10' height='10' viewBox='0 0 10 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='5' cy='5' r='5' fill='%233FCD78'/%3E%3C/svg%3E%0A");
}

.layout-table.admin tbody tr td.dashboard-card-info-content-item-bubble-row-status.status-danger::before {
    content: url("data:image/svg+xml,%3Csvg width='10' height='10' viewBox='0 0 10 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='5' cy='5' r='5' fill='%23DB5151'/%3E%3C/svg%3E%0A");
}

/* admin bot page */

.avatar-lg {
    width: 38px;
    height: 38px;
    border-radius: 15px;
}

.guild-info {
    margin-left: 8px;
    margin-top: 2px;
}

.guild-info h5 {
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 19px;
    color: var(--WhiteR028);

    white-space: nowrap;
    overflow: hidden !important;
    text-overflow: ellipsis;

    width: -webkit-fill-available;
    margin-bottom: 0;
}

.guild-info p {
    font-family: 'Inter', sans-serif;
    font-size: 10px;
    font-weight: 500;
    line-height: 15px;
    color: var(--Gray30R028);
}

.text-truncate {
    font-size: 14px;
    font-weight: 500;
}

.openActions {
    height: 30px;
    padding: 0 37px;
    border-radius: 10px;
}

.page-item.disabled .page-link {
    display: none;
}

#show-hide-col_ellipsis.page-item.disabled .page-link {
    display: block;
    background: transparent;
}

.page-item.active .page-link {
    background-color: var(--BlueR028);
    border-color: var(--BlueR028);
    border-radius: 15px;
    color: var(--WhiteR028);
}

.page-link {
    color: var(--WhiteR028);
    background: transparent;
}

/* Store page */

.search {
    background: rgba(131, 131, 148, .15);
    border: 1px solid var(--Gray30R028);
    border-radius: 15px;
    width: 500px;
    margin: 0;
    height: 50px;
    padding: 0;
    padding-left: 14px;
    font-size: 28px;
}

.search input {
    width: calc(100% - 40px);
    background: transparent;
    border: none;
    display: initial;
    color: var(--WhiteR028);
}

.search input:focus {
    outline: none;
    background: transparent;
    color: var(--WhiteR028);
}

.btn-icon-left {
    height: 100%;
    border-radius: 15px 0 0 15px;
    padding-left: 15px;
    padding-right: 15px;
    margin-right: 0;
    border: none;
}

.btn-icon-right {
    height: 100%;
    border-radius: 0 15px 15px 0;
    padding-left: 15px;
    padding-right: 15px;
    margin-left: -5px;
    border: none;
}

/* ========== Store page ========== */
.store-header {
    margin-bottom: 32px;
}

.store-header .row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 20px;
    margin-bottom: 0;
}

.search-wrapper {
    flex: 1;
    min-width: 260px;
    max-width: 420px;
}

.search-wrapper label.search {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: var(--Gray120R028);
    border: 1px solid var(--Gray50R028);
    border-radius: 12px;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.search-wrapper label.search:focus-within {
    border-color: var(--BlueR028);
    box-shadow: 0 0 0 2px rgba(46, 121, 253, 0.2);
}

.search-wrapper label.search svg {
    flex-shrink: 0;
    opacity: 0.8;
}

.search-wrapper .form-control {
    background: transparent;
    border: none;
    padding: 0;
    height: auto;
}

.cart-btn-wrapper {
    display: flex;
    align-items: center;
    gap: 12px;
}

.cart-btn-wrapper .btn-primary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 20px;
    border-radius: 12px;
    min-height: 48px;
}

.cart-btn-wrapper .btn-secondary {
    min-width: 56px;
    height: 48px;
    padding: 0 16px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 18px;
    background: var(--Gray120R028);
    border: 1px solid var(--Gray50R028);
}

.products-container {
    margin-top: 8px;
}

.products {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 24px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.products .product-item {
    margin: 0;
}

.filters-sort-container {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: center;
    margin-bottom: 24px;
}

.filter-group,
.sort-group {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}

.filter-btn,
.sort-btn {
    padding: 10px 18px;
    border: 1px solid var(--Gray50R028);
    background: var(--Gray120R028);
    color: var(--WhiteR028);
    border-radius: 10px;
    cursor: pointer;
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    font-weight: 500;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.filter-btn:hover,
.sort-btn:hover {
    border-color: var(--Gray30R028);
    background: var(--Gray100R028);
}

.filter-btn.active,
.sort-btn.active {
    background: var(--BlueR028);
    border-color: var(--BlueR028);
    color: var(--WhiteR028);
}

.sort-group select.sort-btn {
    min-height: 42px;
    padding-right: 36px;
    cursor: pointer;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.2759 0.471436H8.7239C8.85573 0.471464 8.9846 0.510578 9.0942 0.583834C9.20381 0.65709 9.28924 0.761199 9.33968 0.882999C9.39013 1.0048 9.40333 1.13882 9.37762 1.26812C9.35191 1.39742 9.28844 1.5162 9.19523 1.60943L5.47123 5.33343C5.34621 5.45841 5.17668 5.52862 4.9999 5.52862C4.82312 5.52862 4.65358 5.45841 4.52857 5.33343L0.804566 1.60943C0.71136 1.5162 0.647889 1.39742 0.622177 1.26812C0.596466 1.13882 0.609668 1.0048 0.660114 0.882999C0.710561 0.761199 0.795987 0.65709 0.905594 0.583834C1.0152 0.510578 1.14407 0.471464 1.2759 0.471436Z' fill='%232E79FD'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 10px 6px;
}

.no-results-message {
    text-align: center;
    padding: 48px 24px;
    color: var(--Gray30R028);
    font-size: 16px;
    display: none;
}

.no-results-message p {
    margin: 0;
}

.shopbox {
    background-color: var(--Gray100R028);
    border-radius: 16px;
    border: 1px solid var(--Gray50R028);
    overflow: hidden;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.shopbox:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
    border-color: var(--Gray30R028);
}

.shopbox .shop-title {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.35;
    color: var(--WhiteR028);
    padding: 18px 18px 12px;
}

.shopbox .shop-title h5 {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.25;
    color: var(--WhiteR028);
    text-align: left;
    padding-top: 0;
    margin-bottom: 0;
}

.shopbox .shop-title p {
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.3;
    color: var(--Gray30R028);
    text-align: left;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    background: transparent;
    border: none;
    padding: 0;
    position: static;
    margin: 4px 0 0 0;
}

.shopbox .shop-icon {
    width: 100%;
    height: 140px;
    background: var(--BlackR028);
    border: none;
    border-radius: 0;
}

.shopbox .shop-icon .avatar {
    height: 100%;
    width: 100%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.shopbox .shop-price {
    display: flex;
    align-items: baseline;
    gap: 4px;
    padding: 0 18px 8px;
}

.shopbox .shop-price span {
    font-family: 'Inter', sans-serif;
    font-size: 18px;
    font-weight: 600;
    color: var(--Gray30R028);
    flex: none;
}

.shopbox .shop-price p {
    font-family: 'Inter', sans-serif;
    font-size: 2rem;
    font-weight: 800;
    line-height: 1.1;
    color: var(--WhiteR028);
    margin: 0;
    flex: none;
}

.shopbox .btn-add-to-cart {
    width: calc(100% - 36px);
    margin: 0 18px 20px;
    height: 44px;
    border-radius: 10px;
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    font-weight: 700;
    padding: 0 20px;
    transition: background-color 0.2s ease, transform 0.15s ease;
}

.shopbox .btn-add-to-cart:hover:not(:disabled) {
    filter: brightness(1.1);
    transform: scale(1.02);
}

.shopbox button {
    height: 44px;
    width: calc(100% - 36px);
    max-width: 240px;
    margin: 0 18px 20px;
    background: var(--BlueR028);
    border-radius: 10px;
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
    color: var(--WhiteR028);
    padding: 0 20px;
}

.close {
    color: var(--WhiteR028);
    opacity: 1;
}

.cartModal .modal-dialog {
    max-width: 560px;
}

.cartModal .modal-content {
    border: 1px solid var(--Gray50R028);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4);
}

.cartModal .modal-header {
    padding: 20px 24px;
    border-bottom: 1px solid var(--Gray50R028);
}

.cartModal .modal-title {
    padding-left: 0;
    font-size: 20px;
}

.cartModal .modal-header .close {
    margin: 0;
    padding: 4px;
    opacity: 0.8;
    font-size: 28px;
    line-height: 1;
}

.cartModal .modal-header .close:hover {
    opacity: 1;
}

.cartModal .modal-body {
    background-color: var(--Gray100R028);
    padding: 0;
}

.cartModal .modal-body .cart {
    border-bottom: 1px solid var(--Gray50R028);
    margin: 0 24px;
    padding: 20px 0;
}

.table {
    background-color: var(--Gray100R028);
    color: var(--WhiteR028);
    border-color: var(--Gray30R028);
}

.table td,
.table th,
.table thead th {
    border-color: transparent !important;
}

.cartModal .table th {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 19px;
    color: var(--WhiteR028);

    text-align: center;
}

.cartModal .table td {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
    color: var(--WhiteR028);

    text-align: center;
}

.cartModal .table>thead>tr>th {
    padding: 10px 0 18px;
    text-transform: none;
}

.cartModal .table>tbody>tr>td {
    padding: 0;
    padding-bottom: 10px;
}

.cartModal .cart-product-qty {
    background: var(--BlueR028);
    border-radius: 30px 0 0 30px;

    height: 40px;
    padding-top: 10px;
}

.cartModal .cart-product-name {
    background: var(--Gray120R028);

    height: 40px;
    padding-top: 10px;
}

.cartModal .cart-product-price {
    background: var(--Gray120R028);

    height: 40px;
    padding-top: 10px;
}

.cartModal .cart-product-remove {
    background: var(--Gray120R028);
    border-radius: 0 30px 30px 0;
    cursor: pointer;
    height: 40px;
    padding-top: 10px;
    padding-right: 8px;
    transition: background-color 0.2s ease;
}

.cartModal .cart-product-remove:hover {
    background: var(--Gray50R028);
}

.total-price {
    background: var(--BlackR028);
    border-radius: 12px;
    margin: 20px 24px 24px;
    padding: 16px 24px;
    display: flex;
    align-items: center;
    border: 1px solid var(--Gray50R028);
}

.total-price .total-price-text {
    flex: 1;
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 16px;
    line-height: 1.25;
    color: var(--WhiteR028);
    padding: 0;
}

.total-price .total-price-text p {
    margin: 0;
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 16px;
    color: var(--WhiteR028);
}

.total-price .total-price-value {
    flex: none;
    font-family: 'Inter', sans-serif;
    font-weight: 800;
    font-size: 20px;
    line-height: 1.2;
    color: var(--BlueR028);
    text-align: right;
    padding: 0;
}

.total-price .total-price-value p {
    margin: 0;
    font-family: inherit;
    font-weight: inherit;
    font-size: inherit;
    color: inherit;
}

.cart-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: flex-end;
    margin: 0 24px 24px;
}

.cart-buttons .btn {
    min-height: 44px;
    padding: 10px 20px;
    border-radius: 10px;
}

.buttons-payment {
    margin: 16px 24px;
    text-align: center;
}

.buttons-payment p {
    margin-bottom: 12px;
    font-weight: 700;
    font-size: 15px;
}

.buttons-payment [role="radiogroup"] {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
    max-width: 400px;
    margin: 0 auto;
}

.buttons-payment .payment-method-btn {
    flex: 1;
    min-width: 120px;
    padding: 12px 16px;
    border-radius: 10px;
    font-weight: 600;
}

.cart-terms {
    padding: 0 24px 16px;
}

.container {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 22px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;

    font-family: 'Inter', sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 19px;
    color: var(--WhiteR028);
    text-align-last: justify;
}

.container a {
    color: var(--BlueR028);
}

.container input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

.checkmark {
    position: absolute;
    top: -5px;
    left: 0;
    background-color: #515365;
    border-color: #515365;
    width: 22px;
    height: 22px;
    border-radius: 5px;
    margin-top: 0.21em;
    transition: background-color 0.15s ease-in-out, background-position 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.container:hover input~.checkmark {
    background-color: #515365;
}

.container input:checked~.checkmark {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 11' width='13' height='11' fill='none'%3e%3cpath d='M11.0426 1.02893C11.3258 0.695792 11.8254 0.655283 12.1585 0.938451C12.4917 1.22162 12.5322 1.72124 12.249 2.05437L5.51985 9.97104C5.23224 10.3094 4.72261 10.3451 4.3907 10.05L0.828197 6.88335C0.50141 6.59288 0.471975 6.09249 0.762452 5.7657C1.05293 5.43891 1.55332 5.40948 1.88011 5.69995L4.83765 8.32889L11.0426 1.02893Z' fill='%23FFFFFF'/%3e%3c/svg%3e");
    background-size: 80% 80%;
    background-repeat: no-repeat;
    border-color: var(--BlueR028);
    background-color: var(--BlueR028);
    background-position: center;
}

/* Terms page */

.terms {
    background: var(--Gray100R028);
    border-radius: 15px;
    padding: 70px 95px 1px !important;
    margin-bottom: 70px;
}

.terms h1 {
    font-family: 'Inter', sans-serif;
    font-size: 40px;
    font-weight: bold;
    line-height: 19px;
    color: var(--WhiteR028);

    text-align: center;
    margin-bottom: 60px;
}

.terms h2 {
    font-family: 'Inter', sans-serif;
    font-size: 30px;
    font-weight: bold;
    line-height: 19px;
    color: var(--WhiteR028);

    margin-bottom: 20px;
}

.terms .intro {
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    font-weight: 500;
    line-height: 19px;
    color: var(--WhiteR028);

    margin-bottom: 60px;
}

.terms .about {
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    font-weight: 500;
    line-height: 19px;
    color: var(--WhiteR028);

    margin-bottom: 60px;
}

.terms .age {
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    font-weight: 500;
    line-height: 19px;
    color: var(--WhiteR028);

    margin-bottom: 60px;
}

.terms .expect {
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    font-weight: 500;
    line-height: 19px;
    color: var(--WhiteR028);

    margin-bottom: 60px;
}

.terms .content {
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    font-weight: 500;
    line-height: 19px;
    color: var(--WhiteR028);

    margin-bottom: 60px;
}

.terms .software {
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    font-weight: 500;
    line-height: 19px;
    color: var(--WhiteR028);

    margin-bottom: 60px;
}

.terms .copyright {
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    font-weight: 500;
    line-height: 19px;
    color: var(--WhiteR028);

    margin-bottom: 60px;
}

.terms .restrictions {
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    font-weight: 500;
    line-height: 19px;
    color: var(--WhiteR028);

    margin-bottom: 60px;
}

.terms .termination {
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    font-weight: 500;
    line-height: 19px;
    color: var(--WhiteR028);

    margin-bottom: 60px;
}

.terms .indemnification {
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    font-weight: 500;
    line-height: 19px;
    color: var(--WhiteR028);

    margin-bottom: 60px;
}

.terms .services {
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    font-weight: 500;
    line-height: 19px;
    color: var(--WhiteR028);

    margin-bottom: 60px;
}

.terms .liability {
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    font-weight: 500;
    line-height: 19px;
    color: var(--WhiteR028);

    margin-bottom: 60px;
}

.terms .disputes {
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    font-weight: 500;
    line-height: 19px;
    color: var(--WhiteR028);

    margin-bottom: 60px;
}

.terms .important {
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    font-weight: 500;
    line-height: 19px;
    color: var(--WhiteR028);

    margin-bottom: 60px;
}

.terms .contact {
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    font-weight: 500;
    line-height: 19px;
    color: var(--WhiteR028);

    margin-bottom: 60px;
}

/* user page */

.user-card {
    background: var(--Gray100R028);
    border-radius: 0 0 15px 15px;
}

.user-card .user-data {
    padding: 55px 0px 0px !important;
    border-bottom: var(--Gray30R028) 1px solid;

    display: flex;
    margin: 0 55px;
}

.user-card .user-data .user-profile {
    flex: 1;
    display: flex;

    margin-bottom: 60px;
}

.user-card .user-data .user-profile .user-avatar img {
    width: 100px;
    height: 100px;
    border-radius: 15px;
}

.user-card .user-data .user-profile .user-name {
    margin-left: 37px;
}

.user-card .user-data .user-profile .user-name h1 {
    font-family: 'Inter', sans-serif;
    font-size: 32px;
    font-weight: bold;
    line-height: 39px;
    color: var(--WhiteR028);
}

.user-card .user-data .user-profile .user-name p {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 19px;
    color: var(--Gray30R028);
}

.user-card .user-data .user-datas {
    flex: 1;
    border-left: var(--Gray30R028) 1px solid;

    margin-bottom: 60px;
}

.user-card .user-data .user-datas h1 {
    font-family: 'Inter', sans-serif;
    font-size: 24px;
    font-weight: bold;
    line-height: 29px;
    color: var(--Gray30R028);
    width: 100%;
    text-align: center;
    margin-bottom: 24px;
}

.user-card .user-data .user-datas .user-email {
    display: flex;
}

.user-card .user-data .user-datas .user-email p {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 19px;
    color: var(--Gray30R028);

    margin-left: 40px;
}

.user-card .user-data .user-datas .user-email span {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
    color: var(--WhiteR028);

    margin-left: 20px;
}

.user-card .user-data .user-datas .user-verified {
    display: flex;
}

.user-card .user-data .user-datas .user-verified p {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 19px;
    color: var(--Gray30R028);

    margin-left: 40px;
}

.user-card .user-data .user-datas .user-verified span {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
    color: var(--WhiteR028);

    margin-left: 20px;
}

.user-card .user-data .user-security {
    flex: 1;
    border-left: var(--Gray30R028) 1px solid;

    margin-bottom: 60px;
}

.user-card .user-data .user-security h1 {
    font-family: 'Inter', sans-serif;
    font-size: 24px;
    font-weight: bold;
    line-height: 29px;
    color: var(--Gray30R028);
    width: 100%;
    text-align: center;
    margin-bottom: 24px;
}

.user-card .user-data .user-security .security-email {
    display: flex;
}

.user-card .user-data .user-security .security-email p {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 19px;
    color: var(--Gray30R028);

    margin-left: 40px;
}

.user-card .user-data .user-security .security-email span {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
    color: var(--WhiteR028);

    margin-left: 20px;
}

.user-card .user-data .user-security .security-2fa {
    display: flex;
}

.user-card .user-data .user-security .security-2fa p {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 19px;
    color: var(--Gray30R028);

    margin-left: 40px;
}

.user-card .user-data .user-security .security-2fa span {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
    color: var(--WhiteR028);

    margin-left: 20px;
}

.user-card .user-buttons {
    padding: 55px 55px 55px !important;
}

.user-card .user-buttons div {
    margin: 0 auto;
    width: max-content;
    display: flex;
}

.user-card .user-buttons div button {
    margin: 0 18px;
}

/* user page payment */

.payment-card {
    background: var(--Gray100R028);
    border-radius: 0 0 15px 15px;
    margin-bottom: 43px;
}

.payment-card h1 {
    font-family: 'Inter', sans-serif;
    font-size: 32px;
    font-weight: bold;
    line-height: 156.5%;
    color: var(--WhiteR028);
    width: 100%;
    text-align: center;
    padding-bottom: 20px;
    padding-top: 80px;
}

.payment-card .payment-data {
    background: var(--Gray120R028);
    border-radius: 15px;
    margin: 0 95px;
}

.payment-card .payment-data .payment-datas {
    display: flex;
    padding: 50px 0;
}

.payment-card .payment-data .payment-datas .payment-basic {
    flex: 1;
    border-right: var(--Gray30R028) 1px solid;
    padding: 0 50px;
}

.payment-card .payment-data .payment-datas .payment-basic h2 {
    font-family: 'Inter', sans-serif;
    font-size: 24px;
    font-weight: 600;
    line-height: 29px;
    color: var(--Gray30R028);
    width: 100%;
    text-align: center;
}

.payment-card .payment-data .payment-datas .payment-basic p {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
    color: var(--Gray30R028);
    width: 100%;
    margin-bottom: 30px;
}

.payment-card .payment-data .payment-datas .payment-basic .payment-form {
    margin-bottom: 26px;
}

.payment-card .payment-data .payment-datas .payment-basic .payment-form label {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
    color: var(--WhiteR028);
    width: 100%;
    margin-bottom: 7px;
}

.payment-card .payment-data .payment-datas .payment-basic .payment-form input {
    background: var(--BlackR028);
    border: var(--BlackR028) 1px solid;
    border-radius: 15px;
    width: 100%;
    height: 40px;
    color: var(--WhiteR028);
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
}

.payment-card .payment-data .payment-datas .payment-address {
    flex: 1;
    padding: 0 50px;
}

.payment-card .payment-data .payment-datas .payment-address h2 {
    font-family: 'Inter', sans-serif;
    font-size: 24px;
    font-weight: 600;
    line-height: 29px;
    color: var(--Gray30R028);
    width: 100%;
    text-align: center;
}

.payment-card .payment-data .payment-datas .payment-address p {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
    color: var(--Gray30R028);
    width: 100%;
    margin-bottom: 30px;
}

.payment-card .payment-data .payment-datas .payment-address .payment-form {
    margin-bottom: 26px;
}

.payment-card .payment-data .payment-datas .payment-address .payment-form label {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 19px;
    color: var(--WhiteR028);
    width: 100%;
    margin-bottom: 7px;
}

.payment-card .payment-data .payment-datas .payment-address .payment-form input {
    background: var(--BlackR028);
    border: var(--BlackR028) 1px solid;
    border-radius: 15px;
    width: 100%;
    height: 40px;
    color: var(--WhiteR028);
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
}

.payment-card .payment-data .payment-datas .payment-address .payment-form-group {
    display: flex;
    justify-content: space-between;
}

.payment-card .payment-data .payment-datas .payment-address .payment-form-group .sz-1 {
    flex: 1;
}

.payment-card .payment-data .payment-datas .payment-address .payment-form-group .sz-2 {
    flex: 2;
}

.payment-card .payment-data .payment-datas .payment-address .payment-form-group .sz-3 {
    flex: 3;
}

.payment-card .payment-data .payment-datas .payment-address .payment-form-group .pd-l-12 {
    padding-left: 12px;
}

.payment-card .payment-data .payment-buttons {
    margin: 0 auto;
    width: max-content;
    padding-bottom: 50px;
}

.payment-card .payment-footer {
    padding: 30px 0 60px;
    margin: 0 auto;
    width: max-content;
}

.payment-card .payment-footer p {
    font-family: 'Inter', sans-serif;
    font-size: 12px;
    font-weight: 400;
    line-height: 15px;
    color: var(--Gray30R028);
    width: 100%;
    text-align: center;
}

.buttons-payment {
    margin: -16px auto 10px;
    width: max-content;
}

/* Guilds */

.guilds-cards {
    background: var(--Gray100R028);
    border-radius: 15px;
    padding: 45px;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-content: stretch;
    align-items: center;
    justify-content: center;
    margin-bottom: 40px;
}

.guilds-cards .guild-card {
    width: 318px;
    height: 390px;
    margin: 20px;
}

.guilds-cards .guild-card .guild-img {
    width: 100%;
    height: 200px;
    border-radius: 15px 15px 0px 0px;
    background: url('https://cdn.discordapp.com/attachments/1041879586314666034/1041879604870254622/unknown.png');
    overflow: hidden;
    background-size: 100%;
    background-position: center;
    background-color: var(--Gray120R028);
}

.guilds-cards .guild-card .bot-avatar {
    position: absolute;
    width: 100px;
    height: 100px;
    border-radius: 30px;
    background: url('https://cdn.discordapp.com/attachments/1041879586314666034/1041879604870254622/unknown.png');
    background-size: 100%;
    background-position: center;
    margin: -50px 109px;
    z-index: 2;

    outline: var(--Gray120R028) 7px solid;
}

.guilds-cards .guild-card .guild-datas {
    background: var(--Gray120R028);
    border-radius: 0px 0px 15px 15px;
    padding: 68px 0px 30px;
}

.guilds-cards .guild-card .guild-datas .guild-name {
    font-family: 'Inter', sans-serif;
    font-size: 20px;
    font-weight: 700;
    color: var(--WhiteR028);
    text-align: center;
    line-height: 156.5%;
}

.guilds-cards .guild-card .guild-datas .guild-expires {
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: var(--Gray30R028);
    text-align: center;
    line-height: 156.5%;
}

.guilds-cards .guild-card .guild-datas .guild-buttons {
    display: flex;
    justify-content: center;
    margin-top: 20px;
}

.guilds-cards .guild-card .guild-datas .guild-buttons .btn {
    width: 180px;
    height: 32px;
    border-radius: 10px;
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    font-weight: 700;
    color: var(--WhiteR028);
    text-align: center;
    line-height: 156.5%;
    margin: 0px 10px;
    cursor: pointer;
    padding-top: 4px;
    width: 90%;
}

/* dashboard */

.dashboard-panel {
    display: flex;
    height: 78vh;
    margin-bottom: 50px;
}

.dashboard-panel .side-menu {
    width: 80px;
    height: inherit;
    background: var(--Gray120R028);
    border-radius: 15px 0px 0px 15px;
    overflow-y: auto;
    position: absolute;
    z-index: 30;
}

.dashboard-panel .side-menu .menu-toggle {
    width: 100%;
    max-width: 80px;
    height: 55px;
    border-radius: 15px 0px 0px 0px;
    background: var(--BlueR028);
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

.dashboard-panel .side-menu .side-menu-inner {
    width: 100%;
    height: fit-content;
    flex-direction: column;
    justify-content: space-between;
}

.dashboard-panel .side-menu .side-menu-inner .search-bar {
    background: rgba(131, 131, 148, .15);
    border: 1px solid var(--Gray30R028);
    border-radius: 15px;
    width: 230px;
    margin: 32px 25px 35px 25px;
    height: 40px;
    padding: 0;
    padding-left: 14px;
    font-size: 28px;

    display: none;
}

.dashboard-panel .side-menu .side-menu-inner .search-bar svg {
    margin-top: 7px;
}

.dashboard-panel .side-menu .side-menu-inner .search-bar input {
    width: calc(100% - 40px);
    background: transparent;
    border: none;
    display: initial;
    color: var(--WhiteR028);
}

.dashboard-panel .side-menu .side-menu-inner .search-bar input:focus {
    outline: none;
    background: transparent;
    color: var(--WhiteR028);
}

.dashboard-panel .side-menu .side-menu-inner .menu-itens {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.dashboard-panel .side-menu .side-menu-inner .menu-itens a {
    margin: 20px 0;
}

.dashboard-panel .side-menu .side-menu-inner .menu-itens .menu-item {
    display: flex;
}

.dashboard-panel .side-menu .side-menu-inner .menu-itens .menu-item .item-icon {
    width: 80px;
    text-align: center;
}

.dashboard-panel .side-menu .side-menu-inner .menu-itens .item-text {
    flex: 1;
    font-family: 'Inter', sans-serif;
    font-size: 20px;
    font-weight: bold;
    color: var(--Gray50R028);
    line-height: 156.5%;

    display: none;
}

.dashboard-panel .side-menu .side-menu-inner .menu-itens .item-text:hover {
    color: var(--Gray30R028);
}

.dashboard-panel .side-menu .side-menu-inner .menu-itens .menu-item.dropdown {
    margin: 20px 0;
    display: block;
}

.dashboard-panel .side-menu .side-menu-inner .menu-itens .menu-item .menu-dropdown {
    display: flex;
}

.dashboard-panel .side-menu .side-menu-inner .menu-itens .menu-item .menu-dropdown .item-icon {
    width: 24px;
    margin-left: 30px;
    margin-right: 12px;
    text-align: center;
}

.menu-dropdown-content {
    display: none;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: flex-start;
}

.menu-dropdown-content a {
    margin: 0 !important;
    margin-left: 64px !important;
    margin-top: 10px !important;

    font-family: 'Inter', sans-serif;
    font-size: 18px;
    font-weight: 500;
    color: var(--Gray50R028);
    line-height: 156.5%;
}

.dashboard-panel .side-menu .side-menu-inner .menu-itens .menu-item.dropdown {
    cursor: pointer;
}

.dashboard-panel .side-menu .side-menu-inner .menu-itens .menu-item.dropdown.active .item-text {
    color: var(--BlueR028) !important;
}

.dashboard-panel .side-menu .side-menu-inner .menu-itens a.active path {
    fill: #2E79FD !important;
}

.dashboard-panel .side-menu .side-menu-inner .menu-itens a.active .item-text {
    color: var(--BlueR028) !important;
}

.dashboard-panel .side-menu .side-menu-inner .menu-itens .menu-item.dropdown.active path {
    fill: #2E79FD !important;
}

.menu-dropdown-content a.active {
    color: var(--WhiteR028);
}

.menu-dropdown-content a.active::before {
    content: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_607_4097)'%3E%3Cpath d='M11.9537 4.64865L6.38984 0.568821C5.95527 0.250603 5.44107 0.058936 4.90424 0.0150639C4.36741 -0.0288083 3.82891 0.0768283 3.34845 0.320265C2.86798 0.563701 2.4643 0.935428 2.18216 1.39424C1.90002 1.85306 1.75044 2.38103 1.75 2.91965V11.0834C1.74917 11.6226 1.89796 12.1514 2.17983 12.611C2.4617 13.0706 2.86559 13.4429 3.34652 13.6866C3.82746 13.9303 4.36659 14.0357 4.9039 13.9911C5.4412 13.9466 5.9556 13.7538 6.38984 13.4342L11.9537 9.35441C12.3229 9.08348 12.6231 8.72943 12.83 8.32092C13.0369 7.91241 13.1447 7.46091 13.1447 7.00299C13.1447 6.54506 13.0369 6.09357 12.83 5.68506C12.6231 5.27655 12.3229 4.9225 11.9537 4.65157V4.64865Z' fill='%23EDF0F4'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_607_4097'%3E%3Crect width='14' height='14' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
    position: absolute;
    left: 35px;
}

.dashboard-panel .content-panel.overlay--open::before {
    content: '';
    position: absolute;
    width: 1130px;
    height: 835px;
    z-index: 10;

    -webkit-transition: backdrop-filter 0.15s ease-in-out;
    -moz-transition: backdrop-filter 0.15s ease-in-out;
    -o-transition: backdrop-filter 0.15s ease-in-out;
    transition: backdrop-filter 0.15s ease-in-out;

    backdrop-filter: blur(3px);

    -webkit-transition: opacity 0.15s ease-in-out;
    -moz-transition: opacity 0.15s ease-in-out;
    -o-transition: opacity 0.15s ease-in-out;
    transition: opacity 0.15s ease-in-out;

    opacity: 1;
}

.dashboard-panel .side-menu .menu-toggle {
    content: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.1003 19.5001C12.8035 19.5003 12.5134 19.4124 12.2666 19.2475C12.0198 19.0827 11.8274 18.8484 11.7138 18.5742C11.6002 18.3001 11.5705 17.9984 11.6285 17.7073C11.6864 17.4162 11.8294 17.1489 12.0393 16.9391L16.6253 12.3541C16.6719 12.3077 16.7088 12.2525 16.734 12.1918C16.7592 12.131 16.7722 12.0659 16.7722 12.0001C16.7722 11.9344 16.7592 11.8692 16.734 11.8085C16.7088 11.7477 16.6719 11.6926 16.6253 11.6461L12.0433 7.06113C11.7619 6.77986 11.6038 6.39834 11.6037 6.00048C11.6036 5.60262 11.7615 5.22102 12.0428 4.93963C12.3241 4.65823 12.7056 4.50009 13.1034 4.5C13.5013 4.49991 13.8829 4.65786 14.1643 4.93913L18.7503 9.52513C19.4055 10.1822 19.7735 11.0722 19.7735 12.0001C19.7735 12.928 19.4055 13.8181 18.7503 14.4751L14.1643 19.0611C14.0246 19.2008 13.8587 19.3114 13.6761 19.3867C13.4935 19.4621 13.2978 19.5006 13.1003 19.5001V19.5001Z' fill='%23EDF0F4'/%3E%3Cpath d='M6.10029 19.5001C5.80352 19.5003 5.51338 19.4124 5.26658 19.2475C5.01978 19.0827 4.82742 18.8484 4.71383 18.5742C4.60024 18.3001 4.57054 17.9984 4.62847 17.7073C4.6864 17.4162 4.82937 17.1489 5.03929 16.9391L9.98229 12.0001L5.04329 7.06113C4.7619 6.77986 4.60376 6.39834 4.60366 6.00048C4.60357 5.60262 4.76153 5.22102 5.04279 4.93963C5.32405 4.65823 5.70558 4.50009 6.10344 4.5C6.50129 4.49991 6.8829 4.65786 7.16429 4.93913L13.1643 10.9391C13.3037 11.0784 13.4143 11.2438 13.4897 11.4259C13.5651 11.6079 13.604 11.8031 13.604 12.0001C13.604 12.1972 13.5651 12.3923 13.4897 12.5744C13.4143 12.7564 13.3037 12.9218 13.1643 13.0611L7.16429 19.0611C7.02458 19.2008 6.85866 19.3114 6.67607 19.3867C6.49348 19.4621 6.29781 19.5006 6.10029 19.5001V19.5001Z' fill='%23EDF0F4'/%3E%3C/svg%3E%0A");
    padding: 13px;
}

.dashboard-panel .side-menu.menu--open .menu-toggle {
    content: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.8997 4.49987C11.1965 4.49974 11.4866 4.58764 11.7334 4.75245C11.9802 4.91726 12.1726 5.15158 12.2862 5.42576C12.3998 5.69993 12.4295 6.00163 12.3715 6.2927C12.3136 6.58376 12.1706 6.85109 11.9607 7.06087L7.37471 11.6459C7.32815 11.6923 7.2912 11.7475 7.266 11.8082C7.24079 11.869 7.22782 11.9341 7.22782 11.9999C7.22782 12.0656 7.24079 12.1308 7.266 12.1915C7.2912 12.2523 7.32815 12.3074 7.37471 12.3539L11.9567 16.9389C12.2381 17.2201 12.3962 17.6017 12.3963 17.9995C12.3964 18.3974 12.2385 18.779 11.9572 19.0604C11.6759 19.3418 11.2944 19.4999 10.8966 19.5C10.4987 19.5001 10.1171 19.3421 9.83571 19.0609L5.24971 14.4749C4.59448 13.8178 4.22652 12.9278 4.22653 11.9999C4.22653 11.072 4.59448 10.1819 5.24971 9.52487L9.83571 4.93887C9.97543 4.79925 10.1413 4.68859 10.3239 4.61326C10.5065 4.53792 10.7022 4.49939 10.8997 4.49987Z' fill='%23EDF0F4'/%3E%3Cpath d='M17.8997 4.49987C18.1965 4.49974 18.4866 4.58764 18.7334 4.75245C18.9802 4.91726 19.1726 5.15158 19.2862 5.42576C19.3998 5.69993 19.4295 6.00163 19.3715 6.2927C19.3136 6.58376 19.1706 6.85109 18.9607 7.06087L14.0177 11.9999L18.9567 16.9389C19.2381 17.2201 19.3962 17.6017 19.3963 17.9995C19.3964 18.3974 19.2385 18.779 18.9572 19.0604C18.6759 19.3418 18.2944 19.4999 17.8966 19.5C17.4987 19.5001 17.1171 19.3421 16.8357 19.0609L10.8357 13.0609C10.6963 12.9216 10.5857 12.7562 10.5103 12.5741C10.4349 12.3921 10.396 12.1969 10.396 11.9999C10.396 11.8028 10.4349 11.6077 10.5103 11.4256C10.5857 11.2436 10.6963 11.0782 10.8357 10.9389L16.8357 4.93887C16.9754 4.79925 17.1413 4.68859 17.3239 4.61326C17.5065 4.53792 17.7022 4.49939 17.8997 4.49987Z' fill='%23EDF0F4'/%3E%3C/svg%3E%0A");
}

.dashboard-panel .side-menu.menu--open {
    width: 280px;
}

.dashboard-panel .side-menu::-webkit-scrollbar {
    width: 3px;
}

.dashboard-panel .side-menu::-webkit-scrollbar-track {
    background: var(--Gray120R028);
}

.dashboard-panel .side-menu.menu--open .side-menu-inner .menu-itens .item-text {
    display: block;
}

.dashboard-panel .side-menu.menu--open .side-menu-inner .search-bar {
    display: flex;
}

.menu-dropdown-content.menu--open {
    display: flex;
}

.dashboard-panel .content-panel {
    flex: 1;
    background: var(--Gray100R028);
    border-radius: 0px 15px 15px 0px;
    margin-left: 80px;
}

/* Dashboard content */

.dashboard-content .dashboard-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 35px 70px;
    border-top-right-radius: 15px;
    background: var(--Gray120R028);
}

.dashboard-content .dashboard-header .dashboard-title {
    flex: 6;
    font-family: 'Noto Sans';
    font-style: normal;
    font-weight: 700;
    font-size: 32px;
    line-height: 39px;

    color: var(--WhiteR028);
}

.dashboard-content .dashboard-header .dashboard-button {
    flex: 3;
    text-align: -webkit-center;
    height: 30px;
}

.dashboard-content .dashboard-header .dashboard-button .toggleSwitch {
    outline: var(--Gray100R028) 10px solid;
    background: var(--Gray120R028);
}

.dashboard-content .dashboard-header .dashboard-button .toggleSwitch:has(> input[type="checkbox"]:checked) a {
    background: var(--RedR028);
}

.dashboard-content .dashboard-header .dashboard-button .toggleSwitch:has(> input[type="checkbox"]:not(:checked)) .left-span {
    color: var(--BlackR028);
}

.dashboard-content .dashboard-header .dashboard-button .toggleSwitch a {
    background: var(--GreenR028);
}

.dashboard-content .dashboard-header .dashboard-button .btn {
    outline: var(--Gray100R028) 10px solid;
    background: var(--BlueR028);
    border-radius: 30px;
    height: 30px;
    padding: 0 37px;
}

/* Dashboard body */

.dashboard-body {
    padding: 24px 24px;
    height: 33vw;
    overflow-y: auto;
}

.dashboard-body .dashboard-cards {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
}

.dashboard-body .dashboard-cards::-webkit-scrollbar {
    width: 3px;
}

.dashboard-body .dashboard-cards::-webkit-scrollbar-thumb {
    background: var(--BlackR028);
}

.dashboard-cards .dashboard-card {
    width: 300px;
    height: 315px;
    background: var(--Gray120R028);
    border-radius: 30px;

    padding: 20px 18px;
    margin: 18px 18px;
}

.dashboard-cards .dashboard-card.success-border {
    border: 5px solid var(--GreenR028);
}

.dashboard-cards .dashboard-card.danger-border {
    border: 5px solid var(--RedR028);
}

.dashboard-cards .dashboard-card-group {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    width: -webkit-fill-available;
}

.dashboard-cards .dashboard-card .card-title {
    text-align: center;
    color: var(--WhiteR028);
    margin-bottom: 0;
}

.dashboard-cards .dashboard-card .card-title>span {
    display: flex;
    justify-content: center;
}

.dashboard-cards .dashboard-card .card-title h1 {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    font-size: 20px;
    line-height: 156.5%;

    width: fit-content;
}

.dashboard-cards .dashboard-card .card-title .card-info {
    width: fit-content;
    margin: 10px;
    cursor: pointer;
    margin-top: 2px;
}

.dashboard-cards .dashboard-card .card-title .card-info:hover .card-text {
    display: block;
    position: absolute;
    background: var(--Gray120R028);
    padding: 7px 22px;
    margin-top: -66px;
    transform: translateX(-50%);
    border-radius: 15px;
    z-index: 30;
}

.dashboard-cards .dashboard-card .card-title .card-info .card-text {
    display: none;
}

.dashboard-cards .dashboard-card .card-body {
    padding: 0;
}

.dashboard-card .card-body .card-inputs {
    display: flex;
    height: 100%;
}

.dashboard-cards .dashboard-card-group-1 {
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
    width: -webkit-fill-available;
    margin: 18px 0;
    gap: 18px;
}

.dashboard-cards .dashboard-card-group-1 .dashboard-card {
    flex: 1;
    min-width: 0;
    max-width: calc(50% - 9px);
    height: auto;
    min-height: fit-content;
}

.dashboard-cards .dashboard-card-group-2 {
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
    width: -webkit-fill-available;
    margin: 18px 0;
    gap: 18px;
}

.dashboard-cards .dashboard-card-group-2 .dashboard-card {
    flex: 1;
    min-width: 0;
    max-width: calc(50% - 9px);
    height: auto;
    min-height: fit-content;
}

.dashboard-cards .dashboard-card-group-3 {
    width: 300px;
    height: 315px;
    margin: 18px 18px;

    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.dashboard-cards .dashboard-card-group-4 {
    width: 300px;
    height: 420px;
    margin: 18px 18px;

    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.dashboard-cards .dashboard-card-group-3 .card {
    width: 300px;
    height: 80px;
    background: var(--Gray120R028);
    border-radius: 30px;

    padding: 26px 29px;
    display: flex;
    flex-direction: row;
}

.dashboard-cards .dashboard-card-group-4 .card {
    width: 300px;
    height: 80px;
    background: var(--Gray120R028);
    border-radius: 30px;

    padding: 26px 29px;
    display: flex;
    flex-direction: row;
}

.dashboard-cards .dashboard-card-group-3 .card .card-title {
    color: var(--WhiteR028);
    margin-bottom: 0;
    width: fit-content;
}

.dashboard-cards .dashboard-card-group-4 .card .card-title {
    color: var(--WhiteR028);
    margin-bottom: 0;
    width: fit-content;
}

.dashboard-cards .dashboard-card-group-3 .card .card-title>span {
    display: flex;
    justify-content: flex-start;
}

.dashboard-cards .dashboard-card-group-4 .card .card-title>span {
    display: flex;
    justify-content: flex-start;
}

.dashboard-cards .dashboard-card-group-3 .card .card-title h1 {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 156.5%;
    margin: 0;

    width: fit-content;
}

.dashboard-cards .dashboard-card-group-4 .card .card-title h1 {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 156.5%;
    margin: 0;

    width: fit-content;
}

.dashboard-cards .dashboard-card-group-3 .card .card-title .card-info {
    width: fit-content;
    margin: 0 10px;
    cursor: pointer;
}

.dashboard-cards .dashboard-card-group-4 .card .card-title .card-info {
    width: fit-content;
    margin: 0 10px;
    cursor: pointer;
}

.dashboard-cards .dashboard-card-group-3 .card .card-title .card-info:hover .card-text {
    display: block;
    position: absolute;
    background: var(--Gray120R028);
    padding: 7px 22px;
    margin-top: -66px;
    transform: translateX(-50%);
    border-radius: 15px;
    z-index: 30;
}

.dashboard-cards .dashboard-card-group-4 .card .card-title .card-info:hover .card-text {
    display: block;
    position: absolute;
    background: var(--Gray120R028);
    padding: 7px 22px;
    margin-top: -66px;
    transform: translateX(-50%);
    border-radius: 15px;
    z-index: 30;
}

.dashboard-cards .dashboard-card-group-3 .card .card-title .card-info .card-text {
    display: none;
}

.dashboard-cards .dashboard-card-group-4 .card .card-title .card-info .card-text {
    display: none;
}

.dashboard-cards .dashboard-card-group-3 .card .inputs {
    width: -webkit-fill-available;
    display: flex;
    margin-left: 5px;
}

.dashboard-cards .dashboard-card-group-4 .card .inputs {
    width: -webkit-fill-available;
    display: flex;
    margin-left: 5px;
}

.dashboard-card-group-3 .card .inputs input {
    height: 26px !important;
    text-align: center;
}

.dashboard-card-group-3 .card .inputs select {
    height: 26px !important;
    text-align: center;
    padding: 0;
    padding-right: 30px;
    padding-left: 10px;
}

.dashboard-card-group-3 .card .inputs select:disabled {
    background-color: var(--BlackR028);
}

.dashboard-card-group-4 .card .inputs input {
    height: 26px !important;
    text-align: center;
}

.dashboard-card-group-4 .card .inputs select {
    height: 26px !important;
    text-align: center;
    padding: 0;
    padding-right: 30px;
    padding-left: 10px;
}

.dashboard-card-group-4 .card .inputs select:disabled {
    background-color: var(--BlackR028);
}

.dashboard-card-group-3 .card .inputs .color-checkbox {
    width: 140px;
    height: 26px;
    padding: 5px;

    background: var(--Gray100R028);
    border-radius: 30px;

    display: flex;
}

.dashboard-card-group-3 .card .inputs .color-checkbox span {
    padding: 0 10px;
    font-family: 'Inter', sans-serif;
    font-style: normal;
    font-weight: 900;
    font-size: 10px;
    line-height: 156.5%;
    color: var(--WhiteR028);
}

.dashboard-card-group-3 .card .inputs .color-checkbox input[type=checkbox] {
    height: 0;
    width: 0;
    visibility: hidden;
}

.dashboard-card-group-3 .card .inputs .color-checkbox input[type=checkbox] {
    height: 0;
    width: 0;
    visibility: hidden;
}

.dashboard-card-group-3 .card .inputs .color-checkbox label {
    cursor: pointer;
    text-indent: -9999px;
    width: 40px;
    height: 18px;
    background: var(--RedR028);
    display: block;
    border-radius: 13px;
    position: relative;
}

.dashboard-card-group-3 .card .inputs .color-checkbox label:after {
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    width: 12px;
    height: 12px;
    background: var(--BlackR028);
    border-radius: 7px;
    transition: 0.3s;
}

.dashboard-card-group-3 .card .inputs .color-checkbox input:checked+label {
    background: var(--GreenR028);
}

.dashboard-card-group-3 .card .inputs .color-checkbox input:checked+label:after {
    left: calc(100% - 5px);
    transform: translateX(-100%);
}

.dashboard-card-group-3 .card .inputs .color-checkbox label:active:after {
    width: 12px;
}

.dashboard-card-group-4 .card .inputs .color-checkbox {
    width: 140px;
    height: 26px;
    padding: 5px;

    background: var(--Gray100R028);
    border-radius: 30px;

    display: flex;
}

.dashboard-card-group-4 .card .inputs .color-checkbox span {
    padding: 0 10px;
    font-family: 'Inter', sans-serif;
    font-style: normal;
    font-weight: 900;
    font-size: 10px;
    line-height: 156.5%;
    color: var(--WhiteR028);
}

.dashboard-card-group-4 .card .inputs .color-checkbox input[type=checkbox] {
    height: 0;
    width: 0;
    visibility: hidden;
}

.dashboard-card-group-4 .card .inputs .color-checkbox label {
    cursor: pointer;
    text-indent: -9999px;
    width: 40px;
    height: 18px;
    background: var(--RedR028);
    display: block;
    border-radius: 13px;
    position: relative;
}

.dashboard-card-group-4 .card .inputs .color-checkbox label:after {
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    width: 12px;
    height: 12px;
    background: var(--BlackR028);
    border-radius: 7px;
    transition: 0.3s;
}

.dashboard-card-group-4 .card .inputs .color-checkbox input:checked+label {
    background: var(--GreenR028);
}

.dashboard-card-group-4 .card .inputs .color-checkbox input:checked+label:after {
    left: calc(100% - 5px);
    transform: translateX(-100%);
}

.dashboard-card-group-4 .card .inputs .color-checkbox label:active:after {
    width: 12px;
}

.color-input input {
    visibility: hidden;
}

.color-input label {
    cursor: pointer;
    width: 26px;
    height: 26px;
    background: var(--BlackR028);
    display: block;
    border-radius: 13px;
    margin-left: 13px;
    position: relative;
    background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.7195 6.93189L6.3856 11.268C5.9166 11.7361 5.28118 11.999 4.61871 11.999C3.95624 11.999 3.32082 11.7361 2.85182 11.268L0.731859 9.14644C0.263257 8.67759 0 8.0417 0 7.37865C0 6.71561 0.263257 6.07972 0.731859 5.61087L3.68042 2.6608L2.25412 1.21427C2.20294 1.1688 2.16164 1.11329 2.13279 1.05119C2.10394 0.989092 2.08814 0.921724 2.08639 0.853265C2.08463 0.784807 2.09694 0.716716 2.12257 0.653216C2.1482 0.589716 2.18659 0.532159 2.23536 0.484114C2.28414 0.43607 2.34226 0.398562 2.40612 0.373915C2.46997 0.349269 2.53821 0.33801 2.6066 0.340836C2.67499 0.343663 2.74207 0.360514 2.80368 0.390346C2.86529 0.420177 2.92012 0.462354 2.96477 0.514259L7.44758 5.05485L7.45208 5.06135C7.54817 5.14737 7.6739 5.19268 7.80274 5.18772C7.93158 5.18277 8.05346 5.12793 8.14267 5.03479C8.23188 4.94164 8.28143 4.81747 8.28089 4.68847C8.28034 4.55947 8.22973 4.43572 8.13974 4.34334L4.5365 0.693263C4.49176 0.586431 4.48547 0.46737 4.51872 0.356416C4.55197 0.245462 4.62269 0.1495 4.7188 0.0849206C4.81491 0.0203414 4.93045 -0.00884824 5.04568 0.0023377C5.16092 0.0135237 5.26869 0.0643912 5.3506 0.146251L11.8474 6.64639C11.8952 6.69251 11.9332 6.74769 11.9594 6.80869C11.9856 6.86969 11.9994 6.9353 12 7.00169C12.0006 7.06809 11.9879 7.13393 11.9628 7.19538C11.9377 7.25683 11.9005 7.31265 11.8536 7.3596C11.8067 7.40655 11.7509 7.44367 11.6895 7.46882C11.6281 7.49396 11.5623 7.50661 11.4959 7.50603C11.4295 7.50545 11.364 7.49166 11.303 7.46546C11.242 7.43925 11.1869 7.40116 11.1408 7.3534L10.7195 6.93189ZM10.3407 9.21544C9.97534 9.74595 9.49508 10.3625 9.49508 10.75C9.49508 11.0815 9.62671 11.3995 9.86102 11.6339C10.0953 11.8683 10.4131 12 10.7445 12C11.0758 12 11.3936 11.8683 11.6279 11.6339C11.8622 11.3995 11.9939 11.0815 11.9939 10.75C11.9939 10.3255 11.5216 9.72795 11.1578 9.21094C11.1113 9.14568 11.0498 9.09256 10.9785 9.05604C10.9072 9.01953 10.8281 9.0007 10.748 9.00115C10.668 9.00159 10.5891 9.02128 10.5182 9.05858C10.4473 9.09587 10.3864 9.14967 10.3407 9.21544Z' fill='%23EDF0F4'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-size: 12px;
    background-position: center;
}

.dashboard-body .dashboard-card-header {
    width: 100%;
    height: max-content;
    text-align: center;
    margin: 50px 0
}

.dashboard-body .dashboard-card-header .dashboard-card-title {
    font-family: 'Inter', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 24px;
    line-height: 156.5%;
    text-align: center;
    color: var(--Gray30R028);
}

.inputs input[type=checkbox] {
    height: 0;
    width: 0;
    visibility: hidden;
}

.inputs input[type=checkbox] {
    height: 0;
    width: 0;
    visibility: hidden;
}

.inputs input[type=checkbox]+label {
    cursor: pointer;
    text-indent: -9999px;
    width: 40px;
    height: 18px;
    background: var(--RedR028);
    display: block;
    border-radius: 13px;
    position: relative;
}

.inputs input[type=checkbox]+label:after {
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    width: 12px;
    height: 12px;
    background: var(--BlackR028);
    border-radius: 7px;
    transition: 0.3s;
}

.inputs input:checked+label {
    background: var(--GreenR028);
}

.inputs input:checked+label:after {
    left: calc(100% - 5px);
    transform: translateX(-100%);
}

.inputs label:active:after {
    width: 12px;
}

.card-inputs .card-add-user {
    display: flex;
    margin-right: 5px;
    width: 130px;
    height: 26px;
}

.card-add-user input {
    background: var(--BlackR028);
    border-radius: 30px;
    width: -webkit-fill-available;
    padding-left: 10px;
    border: none;
    font-size: 10px;
    text-align: center;
    padding-right: 27px;
    color: var(--Gray30R028);
}

.card-add-user svg {
    margin-top: 5px;
    margin-left: -24px;
    cursor: pointer;
}

.card-inputs .card-add-message {
    display: flex;
    margin-right: 5px;
    width: -webkit-fill-available;
    height: 26px;
}

.card-add-message input {
    background: var(--BlackR028);
    border-radius: 30px;
    width: -webkit-fill-available;
    padding-left: 10px;
    border: none;
    font-size: 10px;
    text-align: center;
    padding-right: 27px;
    color: var(--Gray30R028);
}

.card-add-message svg {
    margin-top: 5px;
    margin-left: -24px;
    cursor: pointer;
}

.card-inputs .card-add-tag {
    margin-left: 5px;
    width: 124px;
    height: 26px;
}

.card-add-tag.fill-available {
    margin-left: 0;
    width: -webkit-fill-available;
}

.fill-available .select2-container.select2-container--open {
    transform: none;
}

.card-body .card-tags {
    margin-top: 15px;
    background: var(--BlackR028);
    border-radius: 15px;
    padding: 15px 15px 8px 11px;
    overflow-x: auto;
    height: 180px;
    width: 260px;

    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    align-items: center;
}

.card-tags .tag {
    background: var(--Gray100R028);
    border-radius: 30px;
    padding: 0 10px;
    height: 20px;
    margin: 4px;
    display: flex;
    max-width: 225px;
}

.card-tags .tag .name {
    font-size: 10px;
    color: var(--Gray30R028);
    padding: 2px 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.card-tags.autoh .tag {
    background: var(--Gray100R028);
    border-radius: 30px;
    padding: 0 10px;
    margin: 4px;
    display: flex;
    max-width: 225px;
    height: auto;
}

.card-tags.autoh .tag .name {
    font-size: 10px;
    color: var(--Gray30R028);
    padding: 2px 0;
    overflow: auto;
    text-overflow: initial;
    white-space: normal;
}

.card-tags .tag .icon {
    margin: 0;
    margin-right: -10px;
}

.card-tags .tag .icon svg {
    cursor: pointer;
}

.dashboard-body .dashboard-card-info {
    padding: 0px 25px 40px;
    margin: 0 20px;

    background: var(--Gray120R028);
    border-radius: 30px;
}

.dashboard-body .dashboard-card-info .dashboard-card-info-title {
    font-family: 'Inter', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 24px;
    line-height: 150.5%;
    text-align: center;
    color: var(--BlueR028);

    padding: 32px 0 27px;
}

.dashboard-body .dashboard-card-info .dashboard-card-info-content {
    display: flex;
    justify-content: space-around;
}

.dashboard-body .dashboard-card-info .dashboard-card-info-content .dashboard-card-info-content-item {
    background: var(--Gray100R028);
    border-radius: 10px;
    padding: 0 15px 5px;
}

.dashboard-body .dashboard-card-info .dashboard-card-info-content .dashboard-card-info-content-item .dashboard-card-info-content-item-title {
    font-family: 'Inter', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 19px;
    text-align: center;
    color: var(--Gray30R028);

    padding: 20px 0;
}

.dashboard-body .dashboard-card-info .dashboard-card-info-content .dashboard-card-info-content-item .dashboard-card-info-content-item-bubble {
    display: flex;

    width: fit-content;
    background: var(--BlackR028);
    border-radius: 30px;

    margin: 0 auto 12px;
}

.dashboard-body .dashboard-card-info .dashboard-card-info-content .dashboard-card-info-content-item .dashboard-card-info-content-item-bubble .dashboard-card-info-content-item-bubble-div {
    align-self: center;
    padding: 0 15px;
}

.dashboard-body .dashboard-card-info .dashboard-card-info-content .dashboard-card-info-content-item .dashboard-card-info-content-item-bubble .dashboard-card-info-content-item-bubble-row {
    display: flex;
    padding: 6px 15px;
}

.dashboard-body .dashboard-card-info .dashboard-card-info-content .dashboard-card-info-content-item .dashboard-card-info-content-item-bubble .dashboard-card-info-content-item-bubble-row .dashboard-card-info-content-item-bubble-icon {
    background: url('https://cdn.discordapp.com/attachments/1041879586314666034/1041879604870254622/unknown.png');
    background-position: center;
    background-size: 30px;
    margin: 7px 9px 7px 9px;
    width: 30px;
    height: 30px;
    border-radius: 30px;
}

.dashboard-body .dashboard-card-info .dashboard-card-info-content .dashboard-card-info-content-item .dashboard-card-info-content-item-bubble .dashboard-card-info-content-item-bubble-row .dashboard-card-info-content-item-bubble-row-h1 {
    font-family: 'Inter', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 12px;
    line-height: 15px;
    color: var(--WhiteR028);
}

.dashboard-body .dashboard-card-info .dashboard-card-info-content .dashboard-card-info-content-item .dashboard-card-info-content-item-bubble .dashboard-card-info-content-item-bubble-row .dashboard-card-info-content-item-bubble-row-p {
    font-family: 'Inter', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 10px;
    line-height: 12px;
    color: var(--Gray30R028);
}

.dashboard-card-info-content-item-bubble-row-status {
    font-family: 'Inter', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 15px;
    color: var(--Gray30R028);
}

.dashboard-card-info-content-item-bubble-row-status.status-success {
    color: var(--GreenR028);
}

.dashboard-card-info-content-item-bubble-row-status.status-warning {
    color: var(--YellowR028);
}

.dashboard-card-info-content-item-bubble-row-status.status-danger {
    color: var(--RedR028);
}

.dashboard-card-info-content-item-bubble-row-status.status-info {
    color: var(--BlueR028);
}

.dashboard-card-info-content-item-bubble-row-status::before {
    content: url("data:image/svg+xml,%3Csvg width='7' height='7' viewBox='0 0 7 7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='3.5' cy='3.5' r='3.5' fill='%23838394'/%3E%3C/svg%3E");
}

.dashboard-card-info-content-item-bubble-row-status.status-success::before {
    content: url("data:image/svg+xml,%3Csvg width='7' height='7' viewBox='0 0 7 7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='3.5' cy='3.5' r='3.5' fill='%233FCD78'/%3E%3C/svg%3E");
}

.dashboard-card-info-content-item-bubble-row-status.status-warning::before {
    content: url("data:image/svg+xml,%3Csvg width='7' height='7' viewBox='0 0 7 7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='3.5' cy='3.5' r='3.5' fill='%23FFB800'/%3E%3C/svg%3E");
}

.dashboard-card-info-content-item-bubble-row-status.status-danger::before {
    content: url("data:image/svg+xml,%3Csvg width='7' height='7' viewBox='0 0 7 7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='3.5' cy='3.5' r='3.5' fill='%23FF0000'/%3E%3C/svg%3E");
}

.dashboard-card-info-content-item-bubble-row-status.status-info::before {
    content: url("data:image/svg+xml,%3Csvg width='7' height='7' viewBox='0 0 7 7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='3.5' cy='3.5' r='3.5' fill='%2300B0FF'/%3E%3C/svg%3E");
}

.dashboard-card-history {
    padding: 0px 25px 40px;
    margin: 40px 20px 20px;
    background: var(--Gray120R028);
    border-radius: 30px;
}

.dashboard-card-history .dashboard-card-history-title {
    font-family: 'Inter', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 24px;
    line-height: 150.5%;
    text-align: center;
    color: var(--BlueR028);
    padding: 32px 0 27px;
}

.dashboard-card-history .dashboard-card-history-content {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.dashboard-card-history .dashboard-card-history-content .dashboard-card-history-content-item {
    display: flex;
    background: var(--Gray100R028);
    border-radius: 30px;
    width: 91%;
    margin: 0 63px;
    height: 60px;
    margin-bottom: 10px;
    /*justify-content: space-between;*/
    align-items: center;
}

.dashboard-card-history .dashboard-card-history-content .dashboard-card-history-content-item::before {
    content: url("data:image/svg+xml,%3Csvg width='16' height='76' viewBox='0 0 16 76' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='8' cy='8' r='8' fill='%232E79FD'/%3E%3Cline x1='8' y1='9' x2='8' y2='76' stroke='%232E79FD' stroke-width='2' stroke-dasharray='4 4'/%3E%3C/svg%3E");
    margin: 65px 0px 0px -10px;
}

.dashboard-card-history .dashboard-card-history-content .dashboard-card-history-content-item .icon {
    position: absolute;
    margin-left: -15px;
    margin-top: 60px;
}

.dashboard-card-history .dashboard-card-history-content .dashboard-card-history-content-item .date {
    padding-left: 40px;
    text-align: center;
    width: 150px;
}

.dashboard-card-history .dashboard-card-history-content .dashboard-card-history-content-item .date h2 {
    font-family: 'Inter', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 12px;
    line-height: 15px;
    color: var(--WhiteR028);
    margin: 0;
}

.dashboard-card-history .dashboard-card-history-content .dashboard-card-history-content-item .date p {
    font-family: 'Inter', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 10px;
    line-height: 12px;
    color: var(--WhiteR028);
    margin: 0;
}

.dashboard-card-history .dashboard-card-history-content .dashboard-card-history-content-item .user-info {
    text-align: center;
    width: 200px;
}

.dashboard-card-history .dashboard-card-history-content .dashboard-card-history-content-item .user-info h2 {
    font-family: 'Inter', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 12px;
    line-height: 15px;
    color: var(--WhiteR028);
    margin: 0;
}

.dashboard-card-history .dashboard-card-history-content .dashboard-card-history-content-item .user-info p {
    font-family: 'Inter', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 10px;
    line-height: 12px;
    color: var(--Gray30R028);
    margin: 0;
}

.dashboard-card-history .dashboard-card-history-content .dashboard-card-history-content-item .page {
    display: flex;
    flex: 1;
}

.dashboard-card-history .dashboard-card-history-content .dashboard-card-history-content-item .page .icon {
    position: initial;
    margin: 0;
}

.dashboard-card-history .dashboard-card-history-content .dashboard-card-history-content-item .page h2 {
    font-family: 'Inter', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 12px;
    line-height: 15px;
    color: var(--WhiteR028);
    margin: 0;
}

.dashboard-card-history .dashboard-card-history-content .dashboard-card-history-content-item .page h2 span {
    font-family: 'Inter', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 10px;
    line-height: 15px;
    color: var(--Gray30R028);
    margin: 0;
}

.dashboard-card-history .dashboard-card-history-content .dashboard-card-history-content-item .page h2:has(span) {
    margin-bottom: -10px;
    white-space: nowrap;
    overflow: hidden !important;
    text-overflow: ellipsis;
}

.dashboard-card-history .dashboard-card-history-content .dashboard-card-history-content-item .buttons {
    margin-right: 15px;
}

.dashboard-card-history .dashboard-card-history-content .dashboard-card-history-content-item .buttons button {
    height: 30px;
    border-radius: 30px;
    padding: 0 20px;
}

.content-panel:has(.dashboard-card-history) {
    overflow-y: auto;
}

.content-panel:has(.dashboard-card-history)::-webkit-scrollbar {
    width: 3px;
}

.content-panel:has(.dashboard-card-history)::-webkit-scrollbar-thumb {
    background: var(--BlackR028);
}

.content-panel:has(.dashboard-card-history)::-webkit-scrollbar-track {
    background: transparent;
}

.finance-card {
    margin: 20px;
}

.finance-card .renewal-card {
    background: var(--Gray120R028);
    border-radius: 30px;
    margin-bottom: 40px;
}

.finance-card .renewal-card .title {
    padding: 32px 0;

    font-family: 'Noto Sans', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 24px;
    line-height: 156.5%;
    color: var(--BlueR028);
    text-align: center;
}

.finance-card .renewal-card .buttons {
    display: flex;
    justify-content: space-evenly;
    padding-bottom: 32px;
}

.OFF16::after {
    content: '16% OFF';
    color: var(--BlackR028);

    background: var(--GreenR028);
    border-radius: 15px;
    padding: 3px 8px;

    font-family: 'Inter', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 10px;
    line-height: 12px;

    margin-left: 14px;
}

.finance-card .transaction-card {
    background: var(--Gray120R028);
    border-radius: 30px;
    padding-bottom: 32px;
    height: 320px;
    overflow-y: auto;
}

.finance-card .transaction-card::-webkit-scrollbar {
    width: 3px;
}

.finance-card .transaction-card::-webkit-scrollbar-thumb {
    background: transparent;
}

.finance-card .transaction-card::-webkit-scrollbar-track {
    background: transparent;
}

.finance-card .transaction-card .title {
    padding: 32px 0;

    font-family: 'Noto Sans', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 24px;
    line-height: 156.5%;
    color: var(--BlueR028);
    text-align: center;
}

.finance-card .transaction-card .layout-table {
    margin: 0 70px;
}

.finance-card .transaction-card .table {
    background: var(--Gray120R028);
    border-collapse: separate;
    border-spacing: 0 4px;
}

.finance-card .transaction-card .table>thead>tr>th {
    padding: 10px 0px 30px;
}

.finance-card .table td {
    padding: 0;
}

.finance-card .table td .user-tab {
    display: flex;
}

.finance-card .transaction-card .user-tab img {
    src: url('https://media.discordapp.net/attachments/1041879586314666034/1041879604870254622/unknown.png');
    width: 35px;
    height: 35px;
    border-radius: 15px;
    margin-right: 9px;
}

.finance-card .transaction-card .user-tab .user-info {
    width: 100%;
}

.finance-card .transaction-card .user-tab .user-info .username {
    font-family: 'Inter', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 12px;
    line-height: 15px;
    color: var(--WhiteR028);
    margin-bottom: 2px;
}

.finance-card .transaction-card .user-tab .user-info .userid {
    font-family: 'Inter', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 10px;
    line-height: 12px;
    color: var(--Gray30R028);
}

.finance-card .transaction-card .finance td.date {
    font-family: 'Inter', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 12px;
    line-height: 15px;
    color: var(--WhiteR028);
}

.finance-card .transaction-card .finance td.status {
    font-family: 'Inter', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 12px;
    line-height: 15px;
    color: var(--WhiteR028);
}

.finance-card .transaction-card .finance td.status::before {
    content: url("data:image/svg+xml,%3Csvg width='10' height='11' viewBox='0 0 10 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='5' cy='5.5' r='5' fill='%23838394'/%3E%3C/svg%3E%0A");
    margin-right: 4px;
}

.finance td.status.status-pending::before {
    content: url("data:image/svg+xml,%3Csvg width='10' height='11' viewBox='0 0 10 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='5' cy='5.5' r='5' fill='%23FF7425'/%3E%3C/svg%3E%0A") !important;
}

.finance td.status.status-approved::before {
    content: url("data:image/svg+xml,%3Csvg width='10' height='11' viewBox='0 0 10 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='5' cy='5.5' r='5' fill='%233FCD78'/%3E%3C/svg%3E%0A") !important;
}

.finance-card .transaction-card .finance td.added-time {
    font-family: 'Inter', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 12px;
    line-height: 15px;
    color: var(--BlueR028);
    padding: 0;
}

.collapse-card {
    width: 1000px;
    margin: 10px auto 0;
    height: fit-content;
}

.collapse-card .collapse-card-header {
    background: var(--Gray120R028);
    border-radius: 30px;
    padding: 22px 34px;
    display: flex;
    cursor: pointer;
}

.collapse-card .collapse-card-header .collapse-card-title {
    flex: 1;
    font-family: 'Inter', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 20px;
    line-height: 156.5%;
    color: var(--WhiteR028);
}

.collapse-card .collapse {
    background: var(--BlackR028);
    border-radius: 0 0 30px 30px;
}

.collapse-card .collapsing {
    background: var(--BlackR028);
    border-radius: 0 0 30px 30px;
}

.collapse-card .collapse .card-body {
    padding: 0;
}

.collapse-card .collapsing .card-body {
    padding: 0;
}

.collapse-card-header:not(.collapsed) {
    border-radius: 30px 30px 0 0;
}

.collapse-card-header:not(.collapsed) .collapse-card-icon {
    content: url("data:image/svg+xml,%3Csvg width='18' height='10' viewBox='0 0 18 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.31798 10H16.0455C16.3062 9.99994 16.561 9.9226 16.7778 9.77774C16.9945 9.63289 17.1634 9.42703 17.2632 9.18618C17.3629 8.94534 17.389 8.68032 17.3382 8.42464C17.2874 8.16897 17.1619 7.9341 16.9776 7.74974L9.61377 0.385968C9.36656 0.138834 9.03131 0 8.68176 0C8.33221 0 7.99696 0.138834 7.74975 0.385968L0.385968 7.74974C0.201664 7.9341 0.076157 8.16897 0.025315 8.42464C-0.0255269 8.68032 0.000578876 8.94534 0.100331 9.18618C0.200084 9.42703 0.369005 9.63289 0.585739 9.77774C0.802474 9.9226 1.05729 9.99994 1.31798 10Z' fill='%232E79FD'/%3E%3C/svg%3E%0A");
}

.collapse-card .collapse .panel-visual {
    background: var(--Gray120R028);
    border-radius: 20px;
    margin-bottom: 25px;
    max-height: 350px;
    overflow-y: auto;
}

.collapse-card .collapse .inputs-datas {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    height: auto;
    position: initial;
}

.collapse-card .collapse .inputs-datas .dashboard-card-group-3 {
    margin: 0;
}

.collapse-card .collapsing .panel-visual {
    background: var(--Gray120R028);
    border-radius: 20px;
    margin-bottom: 25px;
    max-height: 100px;
    overflow-y: auto;
}

.collapse-card .collapsing .inputs-datas {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    height: auto;
    position: initial;
}

.collapse-card .collapsing .inputs-datas .dashboard-card-group-3 {
    margin: 0;
}

.dashboard-gray30 {
    width: -webkit-fill-available;
    display: flex;
    background: var(--Gray120R028);
    padding: 25px 40px;
}

.inputs-datas .margin-0-40 {
    margin: 0 40px;
    width: -webkit-fill-available;
    justify-content: space-between;
}

.inputs-datas .margin-10-40 {
    margin: 10px 40px;
    width: -webkit-fill-available;
    justify-content: space-between;
}

.dashboard-gray30.dashboard-gray30 {
    justify-content: space-between;
    height: auto;
}

.collapse-delete {
    width: -webkit-fill-available;
}

.collapse-delete .btn {
    width: -webkit-fill-available;
    border-radius: 0 0 30px 30px;
    background: var(--BlackR028);
}

.gray100 {
    background: var(--Gray100R028)!important;
}

.margin-30-0-110 {
    margin: 30px 0 0;
    padding: 0 46px 110px;
}

.flex-column {
    flex-direction: column!important;
}

.inputs .form-group.textarea {
    width: -webkit-fill-available;
    margin-top: 6px;
}

.inputs .form-group.textarea textarea {
    max-height: 200px;
}

.height-fit-content {
    height: fit-content!important;
}

.dashboard-cards .dashboard-card-group-3 .card .card-title.span-justify-content-center>span {
    justify-content: center!important;
}

.inputs .footer {
    margin: -12px auto;
}

.inputs .footer span {
    font-family: 'Inter', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 10px;
    line-height: 156.5%;
    color: var(--Gray30R028);
}

.panel-visual .channel {
    display: flex;
    height: 48px;
    padding: 12px 8px;
    font-size: 16px;
    line-height: 20px;
    color: var(--WhiteR028);
}

.panel-visual .channel .channel-icon {
    height: 24px;
    flex: 0 0 auto;
    margin: 0 8px;
}

.panel-visual .channel .channel-name {
    margin: 0 8px 0 0;
}

.panel-visual .channel .channel-divider {
    width: 1px;
    height: 24px;
    margin: 0 8px;
    background: var(--Gray30R028);
}

.panel-visual .channel .channel-topic {
    margin: 0 0 0 8px;
    font-weight: 500;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    font-size: 14px;
    line-height: 18px;
    color: #8b949e;
}

.height-40 {
    height: 40px;
}

.align-items-end {
    align-items: end!important;
}

.arcodionChannel {
    height: auto;
    margin-right: 20px;
}

.mb-10 {
    margin-bottom: 10px!important;
}

.emoji-selector {
    position: absolute;
    margin: -30px 80%;
    cursor: pointer;
}

.emoji-div {
    padding: 2px;
    cursor: pointer;
}

.emoji-img {
    width: 42px;
    height: 42px;
}

.counterNumber {
    display: flex;
    padding: 20px 50px;
    justify-content: center;
}

.numberEmoji {
    border: var(--Gray50R028) 2px solid;
    border-radius: 16px;
    margin: 0 5px;
}

.emojiLabel {
    position: absolute;
    font-size: 25px;
    font-weight: 600;
    margin-top: -15px;
    margin-left: -5px;
}

.numberEmoji img {
    width: 64px;
    height: auto;
    cursor: pointer;
}

.warning-card {
    background: var(--BlackR028);
    border: var(--BlackR028) 2px solid;
    border-radius: 10px;
    padding: 0px 30px;
}

.warning-card .form-control {
    width: 100px;
    display: unset;
    border-radius: 5px;
    text-align: center;
}

.warning-card .select2-container--default .select2-selection--single .select2-selection__rendered {
    height: 40px;
    padding-top: 12px;
    min-width: 150px;
    text-align: center;
    border-radius: 5px;
}

.warning-card .select2-container--default .select2-selection--single .select2-selection__arrow {
    top: 6px;
}

.warning-card span.select2.select2-container.mb-4.select2-container--default {
    /*max-width: 270px!important;*/
    width: fit-content!important;
}

#warningdatas {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 12px;
}

.not-clicker {
    cursor: none!important;
}