*, *::before, *::after {
    box-sizing: border-box;
    border-width: 0;
    border-style: solid;
}

html {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
    -webkit-tap-highlight-color: transparent;
    font-size: 16px;
}

body {
    margin: 0;
    line-height: inherit;
    overflow-y: auto;
}

h1 {
    font-size: inherit;
    font-weight: inherit;
    margin: 0;
}

a {
    color: inherit;
    text-decoration: inherit;
}

button, input, select {
    font-family: inherit;
    font-size: 100%;
    font-weight: inherit;
    line-height: inherit;
    letter-spacing: inherit;
    color: inherit;
    margin: 0;
    padding: 0;
}

button {
    text-transform: none;
    cursor: pointer;
    background-color: transparent;
    background-image: none;
}

img, svg {
    display: block;
    vertical-align: middle;
    max-width: 100%;
    height: auto;
}

:disabled {
    cursor: default;
}

:root {
    --primary: 227, 57%, 40%;
    --primary-foreground: 0 0% 100%;
    --secondary: 278 87% 94%;
    --background: 0 0% 100%;
    --foreground: 0, 0%, 0.4%;
    --border: 200 12% 95%;
    --heading-foreground: 213 13% 14%;
    --input-background: 0 0% 100%;
    --input-foreground: 0 0% 0%;
    --input-border: 0 0% 92%;
    --lqd-input: #f7f7f7;
    --lqd-input-border: #f4f4f4;
    --lqd-input-hover: #cdcdcd;
    --label: 221 13% 46%;
    --surface: 240 8% 95%;
    --font-body: "Inter";
    --font-heading: "Golos Text";
    --headings-font-family: var(--font-heading), ui-sans-serif, system-ui, sans-serif;
    --headings-font-weight: 600;
    --headings-color: hsl(var(--heading-foreground));
    --h1-font-size: 2.0625rem;
    --h1-line-height: 2rem;
    --h1-font-weight: 700;
    --hover: 0, 0%, 0.4%;
}

.theme-dark {
    --primary: 227, 57%, 40%;
    --primary-foreground: 0 0% 100%;
    --background: 216 19% 11%;
    --foreground: 210 40% 98%;
    --border: 223 9% 15%;
    --heading-foreground: 0 0% 100%;
    --input-background: 216 19% 11%;
    --input-foreground: 216 6% 85%;
    --input-border: 214 10% 14%;
    --label: 220 10% 55%;
    --surface: 218 14% 13%;
    --secondary: 278 29% 85%;
    --headings-color: hsl(var(--heading-foreground));
    --lqd-input: #1d2027;
    --lqd-input-border: #202327;
    --lqd-input-hover: #14171c;
}
.bg-background  { background-color: hsl(var(--background)); }
.font-body      { font-family: var(--font-body), ui-sans-serif, system-ui, sans-serif; }
.text-foreground { color: hsl(var(--foreground)); }
.antialiased    { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.min-h-screen   { min-height: 100vh; }
.min-h-full     { min-height: 100%; }
.h-full         { height: 100%; }
.w-full         { width: 100%; }
.flex           { display: flex; }
.flex-col       { flex-direction: column; }
.flex-wrap      { flex-wrap: wrap; }
.items-center   { align-items: center; }
.items-stretch  { align-items: stretch; }
.justify-center { justify-content: center; }
.grow           { flex-grow: 1; }
.flex-grow      { flex-grow: 1; }
.relative       { position: relative; }
.absolute       { position: absolute; }
.fixed          { position: fixed; }
.overflow-hidden { overflow: hidden; }
.block          { display: block; }
.inline-flex    { display: inline-flex; }
.text-center    { text-align: center; }
.container-fluid { margin-left: auto; margin-right: auto; width: 100%; }
.px-0           { padding-left: 0; padding-right: 0; }
.px-4           { padding-left: 1rem; padding-right: 1rem; }
.px-5           { padding-left: 1.25rem; padding-right: 1.25rem; }
.px-8           { padding-left: 2rem; padding-right: 2rem; }
.py-2           { padding-top: 0.5rem; padding-bottom: 0.5rem; }
.py-3           { padding-top: 0.75rem; padding-bottom: 0.75rem; }
.pt-8           { padding-top: 2rem; }
.mb-3           { margin-bottom: 0.75rem; }
.mb-11          { margin-bottom: 2.75rem; }
.mt-10          { margin-top: 2.5rem; }
.gap-2          { gap: 0.5rem; }
.gap-1\.5       { gap: 0.375rem; }
.gap-6          { gap: 1.5rem; }
.top-0          { top: 0; }
.left-0         { left: 0; }
.right-0        { right: 0; }
.inset-0        { top: 0; right: 0; bottom: 0; left: 0; }
.top-1\/2       { top: 50%; }
.z-10           { z-index: 10; }
.z-\[999\]      { z-index: 999; }
.pointer-events-none { pointer-events: none; }
.invisible      { visibility: hidden; }
.opacity-0      { opacity: 0; }
.cursor-pointer { cursor: pointer; }
.transition-opacity { transition-property: opacity; transition-timing-function: cubic-bezier(.4,0,.2,1); transition-duration: .15s; }
.transition-all { transition-property: all; transition-timing-function: cubic-bezier(.4,0,.2,1); transition-duration: .15s; }
.transition-bg  { transition-property: background-color; transition-timing-function: cubic-bezier(.4,0,.2,1); transition-duration: .15s; }
.transition-colors { transition-property: color, background-color, border-color, fill, stroke; transition-timing-function: cubic-bezier(.4,0,.2,1); transition-duration: .15s; }

h1{
    margin-bottom:.5rem;
    font-family:var(--headings-font-family);
    font-size:var(--h1-font-size);
    line-height:var(--h1-line-height, var(--headings-line-height));
    font-weight:var(--h1-font-weight, var(--headings-font-weight));
    text-transform:var(--headings-text-transform);
    letter-spacing:var(--h1-letter-spacing, var(--headings-letter-spacing));
    color:var(--headings-color)
}

.text-xs    { font-size: 0.875rem; line-height: 1.25rem; }
.text-sm    { font-size: 0.9375rem; line-height: 1.4375; }
.text-base  { font-size: 1rem; line-height: 1.4285em; }
.text-2xs   { font-size: 0.8125rem; }
.font-medium { font-weight: 500; }
.leading-none { line-height: 1; }
.text-label  { color: hsl(var(--label)); }
.text-indigo-600 { color: rgb(79 70 229); }
.text-primary-foreground { color: hsl(var(--primary-foreground)); }
.text-input-foreground { color: hsl(var(--input-foreground)); }

.navbar-brand {
    display: inline-flex;
    align-items: center;
    font-weight: 700;
    margin: 0;
    line-height: 1;
}

.st0 { fill: #01013a; }
.theme-dark .st0 { fill: #fff; }
.lqd-progress { position: relative; }
.lqd-progress-bar { position: absolute; inset: 0; }
.bg-primary { background-color: hsl(var(--primary)); }
.h-\[3px\]  { height: 3px; }
.bg-foreground\/10 { background-color: hsl(var(--foreground) / .1); }
.dark\:bg-heading-foreground:is(.theme-dark *) { background-color: hsl(var(--heading-foreground)); }

.lqd-auth-content {
    display: flex;
    min-height: 100vh;
    width: 100%;
    flex-wrap: wrap;
    align-items: stretch;
}
.lqd-input, .lqd-chat-form-inputs-container {
    outline: none;
    background-color: #f7f7f7 !important;
}

.theme-dark .lqd-input, .theme-dark .lqd-chat-form-inputs-container {
    background-color: #1d2027 !important;
}

.lqd-input {
    display: block;
    width: 100%;
    padding: 0.5rem 1rem;
    background-color: hsl(var(--input-background));
    color: hsl(var(--input-foreground));
    font-size: 1rem;
    line-height: 1.4285em;
    transition-property: color, background-color, border-color;
    transition-timing-function: cubic-bezier(.4,0,.2,1);
    transition-duration: .15s;
    border:none;
    outline:none;
}

.lqd-input-lg { height: 2.75rem; }
.rounded-xl   { border-radius: 0.75rem; }
.rounded-full { border-radius: 9999px; }
.rounded      { border-radius: 0.25rem; }
.border       { border-width: 1px; }
.border-input-border { border-color: hsl(var(--input-border)); }
.bg-input-background { background-color: hsl(var(--input-background)); }

select.lqd-input option { color: hsl(var(--input-foreground)); }

.lqd-input-label {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1;
    color: hsl(var(--label));
    cursor: pointer;
    margin-bottom: 0.75rem;
}

.form-btn {
    color: #fff !important;
    border: none !important;
    border-radius: 10px !important;
    padding: 0.5rem 1rem !important;
}

.lqd-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    font-weight: 500;
    transition-property: all;
    transition-timing-function: cubic-bezier(.4,0,.2,1);
    transition-duration: .15s;
    cursor: pointer;
}

.lqd-btn:disabled {
    background-color: hsl(var(--foreground) / .1);
    color: hsl(var(--foreground) / .35);
    pointer-events: none;
}

.lqd-btn-primary {
    background-color: hsl(var(--primary));
    color: hsl(var(--primary-foreground));
}

.lqd-btn-primary:hover {
    background-color: hsl(var(--hover));
    transform: translateY(-0.125rem);
    box-shadow: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);
}
.lqd-btn-md  { padding: 0.5rem 1rem; font-size: 0.9375rem; }
.lqd-btn-lg  { padding: 0.75rem 1.25rem; font-size: 0.9375rem; }
.lqd-show-password {
    position: absolute;
    inset-inline-end: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    width: 1.75rem;
    height: 1.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.25rem;
    background: none;
    cursor: pointer;
    transition-property: background-color;
    transition-timing-function: cubic-bezier(.4,0,.2,1);
    transition-duration: .15s;
}

.lqd-show-password:hover {
    background-color: hsl(var(--foreground) / .1);
}

.w-5 { width: 1.25rem; }
.end-3 { inset-inline-end: 0.75rem; }
.size-7 { width: 1.75rem; height: 1.75rem; }
.-translate-y-1\/2 { transform: translateY(-50%); }
.bg-none { background-image: none; }
.disabled {
    color: #74767b !important;
    background-color: #2e3137 !important;
    pointer-events: none;
    cursor: not-allowed;
}
#toast-container {
    top: auto;
    bottom: 45px;
    left: 50%;
    right: auto;
    transform: translate(-50%);
}

#toast-container > div {
    width: auto;
    opacity: 1;
    box-shadow: 0 5px 25px #0000000d !important;
    padding: 12px 25px 12px 45px;
    background-size: 22px;
    font-size: 13px;
    font-weight: 500;
    -webkit-backdrop-filter: blur(10px) saturate(120%);
    backdrop-filter: blur(10px) saturate(120%);
    border-radius: 6px;
}

.toast-success { background-color: #065006cc; }
.toast-error   { background-color: #5b1111cc; }
.toast-info    { background-color: #0882abcc; }
.toast-warning { background-color: #f3bb32cc; color: #332606 !important; }
.theme-dark .toast-success { background-color: #0d330dcc; }
.theme-dark .toast-error   { background-color: #3d0707cc; }
.theme-dark .toast-info    { background-color: #074c63cc; }
.theme-dark .toast-warning { background-color: #dca317cc; color: #ece9df !important; }

@media (max-width: 565px) {
    button[type="submit"] { font-size: 16px !important; }
}

@media (max-width: 767px) {
    .lqd-auth-content { padding-bottom: 5rem; padding-top: 8rem; }
}

@media (max-width: 991px) {
    header.absolute { padding-left: 0.25rem; padding-right: 0.25rem; }
}

@media (min-width: 768px) {
    .md\:flex      { display: flex; }
    .md\:w-1\/2    { width: 50%; }
    .md\:flex-col  { flex-direction: column; }
    .md\:items-center  { align-items: center; }
    .md\:justify-center { justify-content: center; }
    .md\:py-20     { padding-top: 5rem; padding-bottom: 5rem; }
    .md\:flex-row  { flex-direction: row; }
}
.hidden  { display: none; }
@media (min-width: 992px) {
    .lg\:w-1\/2 { width: 50%; }
}
@media (min-width: 576px) {
    .sm\:text-2xs { font-size: 0.8125rem; }
}
.form-row {
    display: flex;
    gap: 16px;
}
.form-row .lqd-input-container {
    flex: 1;
}
.form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}
.lqd-input:focus, input:focus {
    outline: none !important;
    box-shadow: none !important;
    border: none !important;
}

.custom-select {
    position: relative;
    width: 100%;
    font-size: 14px;
}

.select-display {
    cursor: pointer;
    position: relative;
    background-color: var(--lqd-input);
    border: 1px solid var(--lqd-input-border);
    color: hsl(var(--input-foreground));
    padding: 10px 40px 10px 14px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    min-height: 44px;
    user-select: none;
    outline: none;
    box-shadow: none;
    transition: all 0.2s ease;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.select-display::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 14px;
    width: 6px;
    height: 6px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: translateY(-50%) rotate(45deg);
    transition: transform 0.2s ease;
}

.custom-select.open .select-display::after {
    transform: translateY(-50%) rotate(-135deg);
}

.select-options {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    margin-top: 6px;
    background-color: var(--lqd-input);
    border: 1px solid var(--lqd-input-border);
    border-radius: 8px;
    z-index: 999;
    list-style: none;
    padding:0;
    max-height: 260px;
    overflow-y: auto;
    opacity: 0;
    transform: translateY(8px);
    pointer-events: none;
    transition: all 0.2s ease;
}

.custom-select.open .select-options {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.custom-select.open-up .select-options {
    top: auto;
    bottom: 100%;
    margin-bottom: 6px;
}

.select-options li {
    padding: 10px 14px;
    cursor: pointer;
    text-align: left;
}

.select-options li:not(:first-child):hover {
    background-color: var(--lqd-input-hover);
}

.select-options li.selected {
    background-color: var(--lqd-input-hover);
}

.select-options::-webkit-scrollbar {
    width: 6px;
}

.select-options::-webkit-scrollbar-thumb {
    background-color: rgba(0,0,0,0.2);
    border-radius: 4px;
}
/* additions only — keep your original CSS untouched */
.select-search {
    position: sticky;
    top: 0;
    padding: 8px;
    background-color: var(--lqd-input);
    border-bottom: 1px solid var(--lqd-input-border);
    z-index: 1;
    list-style: none; /* override li default */
}
.select-search input {
    width: 100%;
    box-sizing: border-box;
    padding: 7px 12px;
    font-size: 13px;
    border: 1px solid var(--lqd-input-border);
    border-radius: 6px;
    background: var(--lqd-input-hover);
    color: hsl(var(--input-foreground));
    outline: none;
    transition: border-color 0.15s;
}

.select-search input:focus { border-color: #94a3b8; }
.select-options li.no-results { opacity: 0.45; pointer-events: none; font-size: 13px; }
.select-display .placeholder-text { opacity: 0.45; }