:root {
    /* Main Colors */
    --primary: #d11537;
    --background-light: #f6f7f8;
    --background-dark: #101c22;

    /* Surface Colors */
    --surface-light: #ffffff;
    --surface-dark: #1a262e;
    --surface-dark-alt: #101c22;

    /* Text Colors */
    --text-main: #111618;
    --text-muted: #617c89;
    --text-dark-muted: #9ca3af;

    /* Border Colors */
    --border-light: #f0f3f4;
    --border-dark: #2d3a43;
    --border-input: #dbe2e6;

    /* Fonts */
    --font-main: 'Manrope', sans-serif;
}

body {
    font-family: var(--font-main);
}

.custom-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 18px;
    height: 18px;
    background: var(--primary);
    cursor: pointer;
    border-radius: 50%;
    border: 2px solid white;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

.custom-slider::-moz-range-thumb {
    width: 18px;
    height: 18px;
    background: var(--primary);
    cursor: pointer;
    border-radius: 50%;
    border: 2px solid white;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}