:root {
    --bg-color1: #181a25;
    --bg-color2: #1e2939;
    --bg-color3: #687181;
    --text1: #e1e3e4;
    --text-light: #fffffe;
    --bg-dark: #08090c;
    --surface: rgba(255, 255, 255, 0.92);
    --surface-strong: rgba(255, 255, 255, 0.65);
    --surface-dark: rgba(15, 23, 42, 0.75);
    --border: rgba(148, 163, 184, 0.28);
    --shadow: rgba(15, 23, 42, 0.4);
    --text: #0f172a;
    --muted: #475569;
    --primary: #2563eb;
    --primary-dark: #1d4ed8;
    --success: #16a34a;
    --danger: #dc2626;
    --radius-lg: 12px;
    --radius-md: 6px;



    --text-muted: rgba(148, 163, 184, 0.85);
    --radius-sm: 8px;

    --shadow-sm: 0 8px 24px -12px rgba(0, 0, 0, 0.25);
    --shadow-md: 0 16px 40px -16px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 32px 64px -24px rgba(0, 0, 0, 0.5);
}



.pointer {
    cursor: pointer;
}

html, body {
    background: var(--bg-color1);
    height: 100%;
    color: var(--text1);
    font-family: 'Poppins', sans-serif;
    font-weight: 300;

    padding: 0px;
    font-size: 0.9em;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

::-webkit-scrollbar {
    width: 5px;
}

/* Track */
::-webkit-scrollbar-track {
    background: var(--bg-color1);

}

/* Handle */
::-webkit-scrollbar-thumb {
    background: var(--bg-color2);
    border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: var(--text1);
}

.noselect {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none;
    /* Non-prefixed version, currently
                                     supported by Chrome, Edge, Opera and Firefox */
}

span {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none;
    /* Non-prefixed version, currently
                                     supported by Chrome, Edge, Opera and Firefox */
}

input[type=text], input[type=password], input[type=email], input[type=tel], input[type=search], input[type=email], input[type=url], select, textarea {
    background: var(--bg-color2) !important;
    border-color: var(--bg-color2) !important;
    border-radius: 8px !important;
    color: white !important;
    height: 30px !important;

}

.icon-hover {
    color: var(--text1) !important;
    transition: all ease-in-out 300ms;
    z-index: 10;
    cursor: pointer;
    margin: 2px;
    padding: 3px;
}


.icon-hover:hover {
    color: var(--text-light) !important;
    background: var(--bg-color2);
    border-radius: 100px;
}

.mini-ico {
    font-size: 1.2em;
    transform: translate(-3px, 3px);
}

.dvh-100{
    height: 100dvh!important;
}