:root{
    /* Colors*/
    --bg-gradient: linear-gradient(145deg, #F8F7FF 12.17%, #FAFAFA 50%, rgb(139, 92, 246) 93.83%);
    --new-bg-gradient: linear-gradient(to right, #ede9fe, #efecfe, #f1efff, #f3f1ff, #f5f4ff, #f4f4ff, #f3f3ff, #f2f3ff, #edf1ff, #e8eeff, #e2ecfe, #dbeafe);
    
    /* Purple */
    --primary-soft: rgb(139, 92, 246, 0.28);

    /* Red */
    --danger-surface: #FFE4E6;
    --danger-strong: #BE123C;
    
    /* Green */
    --success-strong: #10B981;
    
    /* Blue */
    --info-bg: #F1F5F9;
    --info-surface: #DBEAFE;
    --info-strong: #3B82F6;

    /* Orange */
    --warning-surface: #FFEDD5;

    /* Teal mint */
    --teal-mint-soft: #CCFBF1;
    --teal-mint-surface: #E8EDF2;
    
    --border-color-subtle: rgba(30, 41, 59, 0.08);

    --detail-surface: #f8fbff;

    /* Overlay layers */

    --z-side-panel: 1300;
    --z-dialog: 1400;
}

/*Chromebook*/
@media screen and (min-width: 1280px) and (max-width: 1366px) and (max-height: 768px) {
}