:root {
/* :root.dark { */
    --theme-color-01: #042021;
    --theme-color-02: #165154;
    --theme-color-03: #206E72;
    --theme-color-04: #20989E;
    
    --supporting-color-01: #242727;
    --supporting-color-02: #3A3D3D;
  
    --gradient-color-01: #000000;
    --gradient-color-02: #333333;
    --gradient-color-03: #555555;
    --gradient-color-04: #777777;
    --gradient-color-05: #888888;
    --gradient-color-06: #999999;
    --gradient-color-07: #D3D3D3;
    --gradient-color-08: #F0F0F0;
    --gradient-color-09: #FFFFFF;
  
    --UI-canvas-border-color: #D3D3D3;
    --UI-zoom-indicator-color: #D3D3D3;
  
    --UI-notification-color: #FF0000;
  
    --UI-handle-color-01: #000000;
    --UI-handle-color-02: #888888;
  
    --UI-toggle-color-01: #3A3D3D;
    --UI-toggle-color-02: #206E72;
    --UI-toggle-color-03: #FFFFFF;
  
    --UI-message-box-color: #FFFFFF;
    --UI-message-box-border-color: #D3D3D3;
    
    --settings-url: url("../img/settings.svg");
    --add-url: url("../img/add.svg");
    --location-url: url("../img/location.svg");
    --exit-url: url("../img/exit.svg");
    --refresh-url: url("../img/refresh.svg");
    --screen-grab-url: url("../img/screen-grab.svg");
    --edit-url: url("../img/edit.svg");
    --copy-url: url("../img/copy.svg");
    --checker-pattern-url: url("../img/checker-pattern.png");
    --checker-pattern-url-webp: url("../img/checker-pattern.png");
    --alpha-slider-pattern-url: url("../img/alpha_slider.png");
    --brush-url: url("../img/brush.svg");
    --eraser-url: url("../img/eraser.svg");
    --eye-dropper-url: url("../img/eye-dropper.svg");
    --protection-stamp-url: url("../img/protection-stamp.svg");
    --zoom-out-url: url("../img/zoom-out.svg");
    --hand-url: url("../img/hand.svg");
    --layers-url: url("../img/layers.svg");
    --chat-url: url("../img/chat.svg");
    --modpanel-url: url("../img/modpanel.svg");
    --feedback-url: url("../img/feedback.svg");
    --share-url: url("../img/share.svg");
    --touch-draw-url: url("../img/touch-draw.svg");
    --seeing-eye-url: url("../img/seeing-eye.svg");
    --blind-eye-url: url("../img/blind-eye.svg");
    --ii-badge-url: url("../img/ii_badge.svg");
    --moderator-badge-url: url("../img/moderator_badge.svg");
    --protect-url: url("../img/protect.svg");
    --unprotect-url: url("../img/unprotect.svg");
    --admin-badge-url: url("../img/admin_badge.svg");
    --banned-badge-url: url("../img/banned_badge.svg");
    --send-url: url("../img/send.svg");
    --feedback-message-url: url("../img/thank-you.svg");
    --facebook-icon-url: url("../img/facebook.svg");
    --twitter-icon-url: url("../img/twitter.svg");
    --reddit-icon-url: url("../img/reddit.svg");
    --logo-url: url("../img/logo.svg");
    --logo-themed-url: url("../img/logo.svg");
    --focus-url: url("../img/focus.svg");
    --info-url: url("../img/info.svg");
    --introducing-focus-url: url("../img/introducing-focus.png");
    --private-key-url: url("../img/private_key.svg");
  }
  :root.dev {
    --theme-color-01: #21002a ;
    --theme-color-02: #3b0049 ;
    --theme-color-03: #8300a3 ;
    --theme-color-04: #a700d1 ;
  
    --UI-toggle-color-01: #3A3D3D;
    --UI-toggle-color-02: #8300a3 ;
    --UI-toggle-color-03: #FFFFFF;
    --private-key-url: url("../img/Dev/private_key.svg");
  }
  :root.light {
    --theme-color-01: #165154;
    --theme-color-02: #206E72;
    --theme-color-03: #20989E;
    --theme-color-04: #20989E;
    
    --supporting-color-01: #D0D4D4;
    --supporting-color-02: #B4BDBD;
  
    --gradient-color-01: #FFFFFF;
    --gradient-color-02: #DDDDDD;
    --gradient-color-03: #BBBBBB;
    --gradient-color-04: #999999;
    --gradient-color-05: #888888;
    --gradient-color-06: #777777;
    --gradient-color-07: #333333;
    --gradient-color-08: #222222;
    --gradient-color-09: #000000;
  
    --UI-canvas-border-color: #D3D3D3;
    --UI-zoom-indicator-color: #D3D3D3;
  
    --UI-notification-color: #FF0000;
  
    --UI-handle-color-01: #333333;
    --UI-handle-color-02: #FFFFFF;
  
    --UI-toggle-color-01: #B4BDBD;
    --UI-toggle-color-02: #20989E;
    --UI-toggle-color-03: #DDDDDD;
  
    --UI-message-box-color: #FFFFFF;
    --UI-message-box-border-color: #BBBBBB;
    
    --settings-url: url("../img/Light/settings.svg");
    --add-url: url("../img/Light/add.svg");
    --location-url: url("../img/Light/location.svg");
    --exit-url: url("../img/Light/exit.svg");
    --refresh-url: url("../img/Light/refresh.svg");
    --screen-grab-url: url("../img/Light/screen-grab.svg");
    --edit-url: url("../img/Light/edit.svg");
    --copy-url: url("../img/Light/copy.svg");
    --checker-pattern-url: url("../img/Light/checker-pattern.png");
    --alpha-slider-pattern-url: url("../img/Light/alpha_slider.png");
    --brush-url: url("../img/Light/brush.svg");
    --eraser-url: url("../img/Light/eraser.svg");
    --eye-dropper-url: url("../img/Light/eye-dropper.svg");
    --protection-stamp-url: url("../img/Light/protection-stamp.svg");
    --zoom-out-url: url("../img/Light/zoom-out.svg");
    --hand-url: url("../img/Light/hand.svg");
    --layers-url: url("../img/Light/layers.svg");
    --chat-url: url("../img/Light/chat.svg");
    --modpanel-url: url("../img/Light/modpanel.svg");
    --feedback-url: url("../img/Light/feedback.svg");
    --share-url: url("../img/Light/share.svg");
    --touch-draw-url: url("../img/Light/touch-draw.svg");
    --seeing-eye-url: url("../img/Light/seeing-eye.svg");
    --blind-eye-url: url("../img/Light/blind-eye.svg");
    --ii-badge-url: url("../img/Light/ii_badge.svg");
    --moderator-badge-url: url("../img/Light/moderator_badge.svg");
    --protect-url: url("../img/Light/protect.svg");
    --unprotect-url: url("../img/Light/unprotect.svg");
    --admin-badge-url: url("../img/Light/admin_badge.svg");
    --banned-badge-url: url("../img/Light/banned_badge.svg");
    --send-url: url("../img/Light/send.svg");
    --feedback-message-url: url("../img/Light/thank-you.svg");
    --facebook-icon-url: url("../img/Light/facebook.svg");
    --twitter-icon-url: url("../img/Light/twitter.svg");
    --reddit-icon-url: url("../img/Light/reddit.svg");
    --logo-url: url("../img/logo.svg");
    --logo-themed-url: url("../img/Light/logo.svg");
    --focus-url: url("../img/Light/focus.svg");
    --info-url: url("../img/Light/info.svg");
    --introducing-focus-url: url("../img/Light/introducing-focus.png");
    --private-key-url: url("../img/Light/private_key.svg");
  }
  :root.light.dev {
    --theme-color-01: #3b0049;
    --theme-color-02: #8300a3;
    --theme-color-03: #a700d1;
    --theme-color-04: #a700d1;
  
    --UI-toggle-color-01: #B4BDBD;
    --UI-toggle-color-02: #a700d1;
    --UI-toggle-color-03: #DDDDDD;
    --private-key-url: url("../img/Dev/private_key.svg");
  }
