/* Colors */
:root {
    --sp-white:#ffffff;
    --sp-black:#222529;
    --sp-gray:#5f5f5f;
    --sp-primary:#0088cc;
    --sp-secondary:#db5555;
    --sp-border-dark:#cccccc;
    --sp-border-light:#4e4e4e;
    --sp-border-extra-light:#f2f2f2;
    --sp-scrollbar-thumb:#c2c2c2;
    --sp-radius: 0.25rem;
    --sp-shadow: 0 0 10px rgb(0 0 0 / 10%);
    --sp-transition: all .3s cubic-bezier(.645,.045,.355,1);
}

/* ---//--- */

/* --- Selection Colors --- */
::-webkit-selection {
    background-color: var(--sp-primary);
    color: #ffffff;-webkit-text-fill-color: #ffffff;
}

::selection {
    background-color: var(--sp-primary);
    color: #ffffff;-webkit-text-fill-color: #ffffff;
}

/* ---//--- */

/* --- Scrollbar Colors --- */

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
    background-color: var(--sp-border-extra-light);
}

::-webkit-scrollbar-thumb {
    background-color: var(--sp-scrollbar-thumb);
    border-radius: 10px;
}

::-webkit-scrollbar-corner {
    background-color: var(--sp-border-extra-light);
}

/* ---//--- */