:root {
    --scrollbar-width: 5px;
    --scrollbar-track: 0 0% 95%;
    --scrollbar-thumb: 0 0% 53%;
    --scrollbar-thumb-hover: 0 0% 33%;
    --primary: 262 93% 26%;
    --primary-foreground: 0 0% 100%;
    --secondary: 278 87% 94%;
    --secondary-foreground: 0 0% 0%;
    --background: 0 0% 100%;
    --foreground: 222 14% 29%;
    --border: 200 12% 95%;
    --shadow: 0 4px 7px rgb(0 0 0 / 4%);
    --heading-background: 0 0% 100%;
    --heading-foreground: 213 13% 14%;
    --input-background: 0 0% 100%;
    --input-foreground: 0 0% 0%;
    --input-border: 0 0% 92%;
    --card-background: var(--background);
    --card-foreground: var(--foreground);
    --card-border: var(--border);
    --card-shadow: var(--shadow);
    --table-background: var(--card-background);
    --table-foreground: var(--card-foreground);
    --table-border: var(--card-border);
    --table-shadow: var(--card-shadow);
    --folder-background: 0 0 0% / 6%;
    --folder-foreground: var(--card-foreground);
    --folder-border: var(--card-border);
    --folder-shadow: var(--card-shadow);
    --header-background: var(--background);
    --header-border: var(--border);
    --dropdown-background: var(--background);
    --dropdown-foreground: var(--foreground);
    --dropdown-border: var(--border);
    --dropdown-rounded: .5rem;
    --label: 221 13% 46%;
    --surface: 240 8% 95%;
    --surface-light: 240 8% 98%;
    --clay: 240 8% 95%;
    --font-body: "Inter";
    --font-heading: "Golos Text";
    --headings-font-family: var(--font-heading), ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --headings-line-height: 1.25rem;
    --headings-font-weight: 600;
    --headings-text-transform: ;
    --headings-letter-spacing: ;
    --headings-color: hsl(var(--heading-foreground));
    --h1-font-size: 2.0625rem;
    --h1-line-height: 2rem;
    --h1-font-weight: 700;
    --h2-font-size: 1.625rem;
    --h2-line-height: 1.75rem;
    --h3-font-size: 1.25rem;
    --h3-line-height: 1.25rem;
    --h4-font-size: .9375rem;
    --h4-line-height: 1.25rem;
    --h5-font-size: .875rem;
    --h5-line-height: 1.25rem;
    --h6-font-size: .75rem;
    --h6-line-height: 1.25rem;
    --header-height: 4.8125rem;
    --navbar-fs: .875rem;
    --navbar-pt: 0px;
    --navbar-pe: 3.5rem;
    --navbar-pb: 0px;
    --navbar-ps: .5rem;
    --navbar-mt: 0px;
    --navbar-me: 2.75rem;
    --navbar-mb: 0px;
    --navbar-ms: 0px;
    --navbar-rounded-ss: 0px;
    --navbar-rounded-ee: 0px;
    --navbar-rounded-es: 0px;
    --navbar-background: var(--background);
    --navbar-foreground: 222 9% 37%;
    --navbar-background-hover: var(--primary);
    --navbar-foreground-hover: var(--primary);
    --navbar-background-active: var(--primary);
    --navbar-foreground-active: var(--primary);
    --navbar-link-pt: .5rem;
    --navbar-link-pe: 1.25rem;
    --navbar-link-pb: .5rem;
    --navbar-link-ps: 1.25rem;
    --navbar-icon-background: 0 0% 0% / 0%;
    --navbar-icon-foreground: ;
    --navbar-icon-background-hover: ;
    --navbar-icon-foreground-hover: ;
    --navbar-icon-background-active: ;
    --navbar-icon-foreground-active: ;
    --navbar-border: var(--border);
    --navbar-divider: var(--border);
    --navbar-icon-size: 1.25rem;
    --switcher-ball: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23e6e7e9'/%3e%3c/svg%3e");
    --switcher-ball-active: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23ffffff'/%3e%3c/svg%3e");
    font-size: 16px;
}

.theme-dark {
    --primary: 280 60% 50%;
    --primary-foreground: 0 0% 100%;
    --secondary: 278 29% 85%;
    --secondary-foreground: 0 0% 0%;
    --background: 216 19% 11%;
    --foreground: 210 40% 98%;
    --border: 223 9% 15%;
    --heading-background: 220 8% 15%;
    --heading-foreground: 0 0% 100%;
    --input-background: 216 19% 11%;
    --input-foreground: 216 6% 85%;
    --input-border: 214 10% 14%;
    --card-background: var(--background);
    --card-foreground: var(--foreground);
    --card-border: var(--border);
    --card-shadow: var(--shadow);
    --table-background: var(--card-background);
    --table-foreground: var(--card-foreground);
    --table-border: var(--card-border);
    --table-shadow: var(--card-shadow);
    --folder-background: 0 0 100% / 5%;
    --folder-foreground: var(--card-foreground);
    --folder-border: var(--card-border);
    --folder-shadow: var(--card-shadow);
    --header-background: var(--background);
    --header-border: var(--border);
    --label: 220 10% 55%;
    --surface: 218 14% 13%;
    --surface-light: 217 12% 21%;
    --clay: 218 14% 13%;
    --dropdown-background: var(--surface);
    --dropdown-foreground: var(--foreground);
    --dropdown-border: var(--border);
    --headings-color: hsl(var(--heading-foreground));
    --navbar-background: var(--background);
    --navbar-foreground: 210 1% 74%;
    --navbar-background-hover: var(--primary);
    --navbar-foreground-hover: var(--primary);
    --navbar-background-active: var(--primary);
    --navbar-foreground-active: var(--primary);
    --navbar-border: var(--border);
    --navbar-divider: var(--border);
}


a.site-logo img {
    width: 120px;
}
.lqd-navbar-logo img {
       width: 109px;
    margin: 10px 0px;
}
.lqd-navbar-logo{
        justify-content: center;
}

.site-footer img{
    width:100px;
}

.lqd-nav-link-expander svg {
    color: hsl(var(--primary));
}

.how_to_use_btn{
    background: #1ca685 !important;
}

.export-btn{ 
	margin-right: 5px;;
}

.mt--2{
    margin-top: -2px;;
}
.theme-dark .credit_popup {
    background: #171b21 !important;
    box-shadow: rgb(255 255 255 / 15%) 0px 2px 10px 0px !important;
}

.h-40px {
    height: 40px;
}

.info_div {
    cursor: pointer;
}
div#video_credit {
    color: #320580;
    font-size: 14px;
    font-weight: 600;
}

a.bg-primary:focus, a.bg-primary:hover, button.bg-primary:focus, button.bg-primary:hover {
    background-color: #0062cc!important;
    color: #fff;
    text-decoration: none;
}
.theme-dark .how_to_use_popup, .theme-dark .discord_popup{
    background: #171b21 !important;
    box-shadow: rgb(255 255 255 / 15%) 0px 2px 10px 0px !important;
}

.credit_consumption {
    text-align: right;
    width: 100%;
    color: #320580;
    font-weight: 600;
    margin-top: 12px;
}

.theme-dark .credit_consumption, .theme-dark .credit_message {
    color: #9933cc;
    font-weight: 600;
}
.credit_message{
    color: #320580;
    font-weight: 600;
}

.credit_div {
    width: 100%;
}