﻿:root {
    --image-spin-button-png: url('/images/themes/spotlight-stage/spin-button.png');
    --image-background-png: url('/images/themes/spotlight-stage/background.jpg');
    --image-wheel-png: url('/images/themes/spotlight-stage/wheel.png');

    /*Nav----------------------------*/
    --background-color-nav: rgba(10,10,30,0.88);
    --border-bottom-nav: 1px solid #ff4db8;
    --background-color-nav-advanced: #14143a;
    --text-color-nav-button: #ffffff;
    --text-color-nav-button-hover: #ffffff;
    --background-color-nav-button-hover: #6a3cff;
    --background-color-toat-upgrade: rgba(255,120,200,1);

    /*Color Management----------------------------*/
    --text-color-management-heading: #ffffff;
    --text-color-tableColorOptions: #ffffff;
    --background-color-color-sticky-tr: #14143a;

    /*Help Page----------------------------*/
    --text-color-help-bg: #00eaff;
    --background-color-help-bg: #14143a;
    --text-color-help-bg-hover: #000000;
    --background-color-help-bg-hover: #00eaff !important;

    /*ProgressBar & Header----------------------------*/
    --text-color-progressBar: #ffffff;
    --text-color-h1-h2-h5: #ffffff;
    --text-shadow-h1-h2-h5: 0px 0px 14px rgba(255,140,200,0.9);

    /*Dropdown Menu----------------------------*/
    --background-color-dropdown-menu: linear-gradient(60deg, #ff4db8, #a64dff);
    --border-color-dropdown-menu: 5px solid #6a3cff;
    --text-color-dropdown-header: #ffffff;
    --border-color-dropdown-divider: 1px solid #00eaff;

    /*Button btn----------------------------*/
    --border-color-btn: 2px solid #ff4db8;
    --background-color-btn: linear-gradient(50deg, #ff4db8, #6a3cff);
    --text-color-btn: #ffffff;

    --border-color-btn-hover: 2px solid #00eaff;
    --background-color-btn-hover: linear-gradient(50deg, #00eaff, #ff4db8);
    --text-color-btn-hover: #000000;

    /*Copyright----------------------------*/
    --text-color-copyright: #ffffff;

    /*Slider----------------------------*/
    --range-thumb-bg: radial-gradient(circle, #ffffff, #ff4db8);
    --range-track-bg: linear-gradient(90deg, #ff4d4d, #ffd24d, #4dff88, #4da6ff, #a64dff);
    --range-track-box-shadow: 0 0 16px #ff4db8;
    --range-thumb-box-shadow: 0 0 16px #ff4db8, 0 0 24px #ff4db8;
}

/* ===== IE / WinJS ===== */

input[type=range]::-ms-track {
    height: 3px;
    border-radius: 10px;
    box-shadow: 0 0 14px #ff4db8;
    background: linear-gradient(90deg, #ff4d4d, #ffd24d, #4dff88, #4da6ff, #a64dff);
    color: transparent;
    padding: 3px 0px;
}

input[type=range]::-ms-thumb {
    height: 22px;
    width: 22px;
    border-radius: 50%;
    background: radial-gradient(circle, #ffffff, #ff4db8);
    box-shadow: 0 0 16px #ff4db8, 0 0 24px #ff4db8;
    margin: 3px;
    border: none;
}