:root {

    /* App Colors */
    --activated-color: orange;
    --color-black: black;
    --color-blue: blue;
    --color-green: green;
    --color-orange: orange;
    --color-purple: purple;
    --color-red: red;
    --color-white: white;
    --color-yellow: yellow;

    /* Control */
    --control-background: var(--app-color);
    --control-color: white;

    /* Dashboard */
    --dashboard-body-background: rgba(24, 25, 27, 0.91);
    --dashboard-body-color: var(--main-color);
    --dashboard-heading-background: rgb(68, 68, 68, 0.5 );
    --dashboard-heading-color: var(--main-color);

    /* Description */
    --description-opacity: 0.5;

    /* Dialog */
    --dialog-background: rgb(52 52 52);
    --dialog-body-background: rgb(29 29 29);
    --dialog-color: rgb(200, 200, 200);
    --dialog-tab-background: unset;
    --dialog-tab-color: white;
    --dialog-tab-selected-background-model: var(--app-color);
    --dialog-tab-selected-background: var(--dialog-tab-selected-background-model);
    --dialog-subtab-selected-background: var(--app-color);
    --dialog-tab-selected-color: var(--dialog-tab-color);
    --dialog-tab-selected-render: bottom-bordered;
    --dialog-tab-selected-bottom-width: 3px;
    --dialog-tab-selected-border-color: var(--dialog-tab-color);
    --dialog-tab-selected-border-radius: var(--main-border-radius);

    /* Font */
    --main-font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    --main-font-size: 15;

    /* Input */
    --hover-background: rgba(126, 126, 126, 0.1);
    --input-ace-theme: dark_theme;
    --input-background: rgb(46, 46, 46);
    --input-border-color: rgba(126, 126, 126, 0.2);
    --input-border-radius: 2px;
    --input-color: var(--main-color);
    --input-date-picker-theme: dark_theme;

    /* Layout */
    --main-background: rgb(38 38 38);
    --main-border-radius: 3px;
    --main-color: rgb(193 203 217);
    --main-outline: var(--main-background);
    --secondary-background: rgb(29 29 29);

    /* Notes */
    --note-1-background: rgb(17, 78, 56);
    --note-1-color: rgb(200, 200, 200);
    --note-2-background: rgb(14, 70, 120);
    --note-2-color: rgb(200, 200, 200);
    --note-3-background: rgb(69, 54, 103);
    --note-3-color: rgb(200, 200, 200);
    --note-4-background: rgb(106, 28, 28);
    --note-4-color: rgb(200, 200, 200);
    --note-5-background: rgb(120, 63, 4);
    --note-5-color: rgb(200, 200, 200);

    /* Panel */
    --panel-heading-background: rgb(68 68 68);
    --panel-heading-color: rgb(200, 200, 200);

    /* Resources */
    --resource-background:rgb(51 51 51);
    --resource-color: rgb(255 255 255);
    --resource-border-color: rgb(81 81 81);
    --resources-hub-background: var(--main-background);
    --resources-hub-color: var(--main-color);
    --resources-hub-input-background: var(--input-background);
    --resources-hub-input-color: var(--input-color);
    --resources-hub-items-panel: var(--input-background);

    /* Scrollbar */
    --scrollbar-background: rgba(255, 255, 255, 0);
    --scrollbar-hover-background: var(--app-color);
    --scrollbar-hover-container-background: rgba(255, 255, 255, 0.10);
    --scrollbar-size: 8px;

    /* Sequence */
    --sequence-automate-it-job-background: var(--sequence-ui-job-background);
    --sequence-background: var(--workflow-background);
    --sequence-live-job-background: rgb(14, 97, 162);
    --sequence-selected-border-color: rgb(197 197 197);
    --sequence-state-background: unset;
    --sequence-state-border-radius: 2px;
    --sequence-state-default: var(--state-default);
    --sequence-state-error: var(--state-error);
    --sequence-state-info: var(--state-info);
    --sequence-state-render: filled;
    --sequence-state-success: var(--state-success);
    --sequence-state-text-align: space-around;
    --sequence-state-text-color: white;
    --sequence-state-warning: var(--state-warning);
    --sequence-state-bullet-display: none;
    --sequence-state-bullet-radius: 0;

    --sequence-stop-background: rgb(171, 49, 49);
    --sequence-ui-job-background: rgb(52, 132, 52);
    --sequence-workflow-job-background: rgb(50, 151, 195);

    /* State */
    --state-border-top-width: 2px;
    --state-border-bottom-width: 1px;
    --state-border-left-width: 2px;
    --state-border-right-width: 2px;
    --state-border-default: var(--state-default);
    --state-border-error: var(--state-error);
    --state-border-info: var(--state-info);
    --state-border-success: var(--state-success);
    --state-border-warning: var(--state-warning);
    --state-default: rgb(96, 96, 96);
    --state-error: rgba(171, 49, 49, 1);
    --state-info: rgba(14, 97, 162, 1);
    --state-success: rgba(106, 175, 53, 1);
    --state-warning: rgba(248, 165, 68, 1);

    /* Table */
    --table-background: rgb(46, 46, 46);
    --table-border-radius: 2px;
    --table-color: var(--main-color);
    --table-selection-background: var(--app-color);

    /* Tabs */
    --tab-background: unset;
    --tab-color: white;
    --tab-selected-background-model: var(--app-color);
    --tab-selected-background: var(--tab-selected-background-model);
    --tab-selected-color: var(--tab-color);
    --tab-selected-render: filled;
    --tab-selected-bottom-width: 3px;
    --tab-selected-border-color: var(--dialog-tab-color);
    --tab-selected-border-radius: var(--main-border-radius);

    /* Tags */
    --tag-background: rgb(68 68 68);
    --tag-black-color: black;
    --tag-black-text-color: var(--main-color);
    --tag-blue-color: blue;
    --tag-blue-text-color: var(--main-color);
    --tag-border-black: black;
    --tag-border-bottom-width: 1px;
    --tag-border-green: green;
    --tag-border-left-width: 1px;
    --tag-border-orange: orange;
    --tag-border-purple: purple;
    --tag-border-red: red;
    --tag-border-right-width: 1px;
    --tag-border-top-width: 1px;
    --tag-border-white: white;
    --tag-border-yellow: yellow;
    --tag-bullet-display: none;
    --tag-bullet-radius: 0;
    --tag-color: var(--main-color);
    --tag-green-color: green;
    --tag-green-text-color: var(--main-color);
    --tag-orange-color: orange;
    --tag-orange-text-color: var(--main-color);
    --tag-purple-color: purple;
    --tag-purple-text-color: var(--main-color);
    --tag-red-color: red;
    --tag-red-text-color: var(--main-color);
    --tag-render: left-bullet;
    --tag-white-color: white;
    --tag-white-text-color: black;
    --tag-yellow-color: yellow;
    --tag-yellow-text-color: black;

    /* Workflow */
    --custom-form-background: var(--workflow-background);
    --designer-task-border-radius: 2px;
    --notification-workflow-background: var(--workflow-background);
    --notification-workflow-selected-border-color: rgb(115, 115, 115);
    --notification-workflow-tasks-background: var(--workflow-tasks-background);
    --notification-workflow-tasks-color: var(--workflow-tasks-color);
    --waituntil-workflow-background: var(--workflow-background);
    --waituntil-workflow-selected-border-color: rgb(115, 115, 115);
    --waituntil-workflow-tasks-background: var(--workflow-tasks-background);
    --waituntil-workflow-tasks-color: var(--workflow-tasks-color);
    --workflow-background: rgb(29 29 29);
    --workflow-selected-border-color: rgb(115, 115, 115);
    --workflow-tasks-background: rgb(61, 61, 60);
    --workflow-tasks-color: rgb(173, 173, 173);
}

.dark_theme {

    /* Custom Form */
    --custom-form-background: var(--workflow-background);

    /* Notification Workflow */
    --notification-workflow-background: var(--workflow-background);
    --notification-workflow-selected-border-color: rgb(115, 115, 115);
    --notification-workflow-tasks-background: var(--workflow-tasks-background);
    --notification-workflow-tasks-color: var(--workflow-tasks-color);

    /* Sequence */
    --sequence-automate-it-job-background: var(--sequence-ui-job-background);
    --sequence-background: var(--workflow-background);
    --sequence-live-job-background: rgb(14, 97, 162);
    --sequence-selected-border-color: rgb(197 197 197);
    --sequence-state-default: var(--state-default);
    --sequence-state-error: var(--state-error);
    --sequence-state-info: var(--state-info);
    --sequence-state-success: var(--state-success);
    --sequence-state-text-color: white;
    --sequence-state-warning: var(--state-warning);
    --sequence-stop-background: rgb(171, 49, 49);
    --sequence-ui-job-background: rgb(52, 132, 52);
    --sequence-workflow-job-background: rgb(50, 151, 195);

    /* WaitUntil Workflow */
    --waituntil-workflow-background: var(--workflow-background);
    --waituntil-workflow-selected-border-color: rgb(115, 115, 115);
    --waituntil-workflow-tasks-background: var(--workflow-tasks-background);
    --waituntil-workflow-tasks-color: var(--workflow-tasks-color);

    /* Workflow */
    --workflow-background: rgb(29 29 29);
    --workflow-selected-border-color: rgb(115, 115, 115);
    --workflow-tasks-background: rgb(61, 61, 60);
    --workflow-tasks-color: rgb(173, 173, 173);
}

.light_theme {

    /* Activated */
    --activated-color: rgb(255, 169, 79);

    /* Colors */
    --description-opacity: 0.7;

    /* Custom Form */
    --custom-form-background: var(--main-background);

    /* Dashboard */
    --dashboard-body-background: rgb(255, 255, 255);
    --dashboard-body-color: var(--main-color);
    --dashboard-heading-background: rgb(243, 243, 243);
    --dashboard-heading-color: var(--main-color);

    /* Dialog */
    --dialog-background: rgb(255, 255, 255);
    --dialog-body-background: rgb(238, 238, 238);
    --dialog-color: rgb(55, 55, 55);
    --dialog-tab-background: unset;
    --dialog-tab-color: rgb(0, 0, 0);
    --dialog-tab-selected-background-model: var(--app-color);
    --dialog-tab-selected-background: var(--dialog-tab-selected-background-model);
    --dialog-subtab-selected-background: var(--app-color);
    --dialog-tab-selected-color: rgb(0, 0, 0);
    --dialog-tab-selected-render: bottom-bordered;

    /* Input */
    --hover-background: rgba(126, 126, 126, 0.2);
    --input-ace-theme: light_theme;
    --input-background: white;
    --input-border-color: rgb(126 126 126 / 35%);
    --input-color: rgb(29 29 29);
    --input-date-picker-theme: light_theme;

    /* Layout */
    --main-background: rgb(255, 255, 255);
    --main-color: rgb(103, 103, 103);
    --main-outline: var(--main-background);
    --secondary-background: rgb(238, 238, 238);

    /* Panel */
    --panel-heading-background: rgb(156, 156, 156);
    --panel-heading-color: rgb(255, 255, 255);

    /* Resource */
    --resource-background: rgb(255 255 255);
    --resource-color: rgb(51 51 51);
    --resource-border-color: rgb(81 81 81);
    --resources-hub-items-panel: rgb(233 233 233);

    /* Sequence */
    --sequence-automate-it-job-background: var(--sequence-ui-job-background);
    --sequence-background: var(--workflow-background);
    --sequence-live-job-background: rgb(14, 97, 162);
    --sequence-selected-border-color: orange;
    --sequence-state-default: var(--state-default);
    --sequence-state-error: var(--state-error);
    --sequence-state-info: var(--state-info);
    --sequence-state-success: var(--state-success);
    --sequence-state-text-color: white;
    --sequence-state-warning: var(--state-warning);
    --sequence-stop-background: rgb(171, 49, 49);
    --sequence-ui-job-background: rgb(52, 132, 52);
    --sequence-workflow-job-background: rgb(50, 151, 195);


    /* State */
    --state-default: rgba(61, 61, 60, 1);

    /* Tab */
    --tab-background: var(--panel-heading-background);
    --tab-color: white;
    --tab-selected-background-model: var(--app-color);
    --tab-selected-background: var(--tab-selected-background-model);
    --tab-selected-color: white;
    --tab-selected-render: filled;
    --tab-selected-bottom-width: 3px;

    --table-color: rgb(97, 97, 97);
    --table-background: rgb(243, 243, 243);

    /* Tag */
    --tag-background: rgb(229, 229, 229);
    --tag-color: rgb(0, 0, 0);

    /* Workflow */
    --notification-workflow-background: var(--workflow-background);
    --notification-workflow-selected-border-color: orange;
    --notification-workflow-tasks-background: var(--workflow-tasks-background);
    --notification-workflow-tasks-color: var(--workflow-tasks-color);
    --waituntil-workflow-background: var(--workflow-background);
    --waituntil-workflow-selected-border-color: orange;
    --waituntil-workflow-tasks-background: var(--workflow-tasks-background);
    --waituntil-workflow-tasks-color: var(--workflow-tasks-color);
    --workflow-background: rgb(241, 241, 241);
    --workflow-selected-border-color: orange;
    --workflow-tasks-background: rgb(213, 213, 213);
    --workflow-tasks-color: rgb(92, 92, 92);
}


.midnight_curve {

    /* Activated */
    --activated-color: orange;

    /* Base Colors */
    --color-black: black;
    --color-blue: blue;
    --color-green: green;
    --color-orange: orange;
    --color-purple: purple;
    --color-red: red;
    --color-white: white;
    --color-yellow: yellow;

    /* Control */
    --control-background: rgb(101, 163, 13);
    --control-color: white;

    /* Custom Form */
    --custom-form-background: var(--workflow-background);

    /* Dashboard */
    --dashboard-body-background: rgb(23, 28, 39);
    --dashboard-body-color: rgb(193 203 217);
    --dashboard-heading-background: rgb(31, 41, 55);
    --dashboard-heading-color: rgb(193 203 217);

    /* Dialog */
    --designer-task-border-radius: 20px;
    --dialog-background: rgb(31, 39, 55);
    --dialog-body-background: rgb(17, 21, 29);
    --dialog-color: rgb(217, 210, 233);
    --dialog-tab-background: ;
    --dialog-tab-color: white;
    --dialog-tab-selected-background-model: rgb(101, 163, 13);
    --dialog-tab-selected-background: var(--dialog-tab-selected-background-model);
    --dialog-subtab-selected-background: rgb(101, 163, 13);
    --dialog-tab-selected-color: rgb(255, 255, 255);
    --dialog-tab-selected-render: bottom-bordered;

    /* Input */
    --hover-background: rgba(126, 126, 126, 0.1);
    --input-ace-theme: dark_theme;
    --input-background: rgb(23, 28, 39);
    --input-border-color: rgb(53, 60, 82);
    --input-border-radius: 20px;
    --input-color: rgb(204, 204, 204);
    --input-date-picker-theme: dark_theme;

    /* Layout */
    --main-background: rgb(17, 21, 29);
    --main-border-radius: 10px;
    --main-color: rgb(242, 242, 242);
    --main-font-family: Arial,Arial,Helvetica,sans-serif;
    --main-font-size: 15;
    --main-outline: rgb(37, 18, 18);
    --secondary-background: rgb(23, 28, 39);

    /* Notes */
    --note-1-background: rgb(17, 78, 56);
    --note-1-color: rgb(200, 200, 200);
    --note-2-background: rgb(14, 70, 120);
    --note-2-color: rgb(200, 200, 200);
    --note-3-background: rgb(69, 54, 103);
    --note-3-color: rgb(200, 200, 200);
    --note-4-background: rgb(106, 28, 28);
    --note-4-color: rgb(200, 200, 200);
    --note-5-background: rgb(120, 63, 4);
    --note-5-color: rgb(200, 200, 200);

    /* Notification Workflow */
    --notification-workflow-background: rgb(23, 28, 39);
    --notification-workflow-selected-border-color: rgb(204, 204, 204);
    --notification-workflow-tasks-background: rgb(50, 151, 195);
    --notification-workflow-tasks-color: rgb(255, 255, 255);

    /* Panel */
    --panel-heading-background: rgb(31, 41, 55);
    --panel-heading-color: rgb(242, 242, 242);

    /* Resource */
    --resource-background: rgb(31, 39, 55);
    --resource-color: rgb(200, 200, 200);
    --resource-border-color: rgb(81 81 81);
    --resources-hub-background: rgb(17, 21, 29);
    --resources-hub-color: rgb(193 203 217);
    --resources-hub-input-background: rgb(31, 41, 55);
    --resources-hub-input-color: rgb(193 203 217);
    --resources-hub-items-panel: rgb(17, 21, 29);

    /* Scrollbar */
    --scrollbar-background: rgba(255, 255, 255, 0);
    --scrollbar-hover-background: rgb(101, 163, 13);
    --scrollbar-hover-container-background: rgba(255, 255, 255, 0.10);
    --scrollbar-size: 8;

    /* Sequence */
    --sequence-automate-it-job-background: rgb(101, 163, 13);
    --sequence-background: rgb(23, 28, 39);
    --sequence-live-job-background: rgb(14, 97, 162);
    --sequence-selected-border-color: rgb(197 197 197);
    --sequence-state-border-radius: 4px;
    --sequence-state-render: filled;
    --sequence-state-text-color: white;
    --sequence-stop-background: rgb(171, 49, 49);
    --sequence-ui-job-background: rgb(69, 54, 103);
    --sequence-workflow-job-background: rgb(50, 151, 195);

    /* State */
    --state-default: rgb(96, 96, 96);
    --state-error: rgba(171, 49, 49, 1);
    --state-info: rgba(14, 97, 162, 1);
    --state-success: rgba(106, 175, 53, 1);
    --state-warning: rgba(248, 165, 68, 1);

    /* Tab */
    --tab-background: ;
    --tab-color: white;
    --tab-selected-background-model: rgb(101, 163, 13);
    --tab-selected-background: var(--tab-selected-background-model);
    --tab-selected-color: white;
    --tab-selected-render: filled;
    --tab-selected-bottom-width: 3px;

    /* Tag */
    --tag-background: rgb(68 68 68);
    --tag-black-text-color: rgb(193 203 217);
    --tag-blue-text-color: rgb(193 203 217);
    --tag-color: rgb(193 203 217);
    --tag-green-text-color: rgb(193 203 217);
    --tag-orange-text-color: rgb(193 203 217);
    --tag-purple-text-color: rgb(193 203 217);
    --tag-red-text-color: rgb(193 203 217);
    --tag-render: left-bullet;
    --tag-white-text-color: rgb(193 203 217);
    --tag-yellow-text-color: rgb(193 203 217);

    /* Table */
    --table-background: rgb(23, 28, 39);
    --table-border-radius: 20px;
    --table-color: rgb(242, 242, 242);
    --table-selection-background: rgb(101, 163, 13);

    /* WaitUntil Workflow */
    --waituntil-workflow-background: rgb(23, 28, 39);
    --waituntil-workflow-selected-border-color: rgb(204, 204, 204);
    --waituntil-workflow-tasks-background: rgb(50, 151, 195);
    --waituntil-workflow-tasks-color: rgb(255, 255, 255);

    /* Workflow */
    --workflow-background: rgb(23, 28, 39);
    --workflow-selected-border-color: rgb(204, 204, 204);
    --workflow-tasks-background: rgb(50, 151, 195);
    --workflow-tasks-color: rgb(255, 255, 255);
}