/*  STATUS COLORS */
/* ----------------------------------------------------------------------------- */
:root {

    --color-status-green  : #6a9728;
    --color-status-yellow : #faa21b;
    --color-status-red    : #dd2222;
    --color-status-new    : #fe8d55;

    --color-status-green-bright  : #87b340;
    --color-status-yellow-bright : #fbb549;
    --color-status-red-bright    : #eb5555;
    --color-status-new-bright    : #fe8d55;

    --color-status-green-brighter  : #D2e9b0;
    --color-status-yellow-brighter : #f7cc93;
    --color-status-red-brighter    : #fbd4d4;

}


/*  COLOR PALETTE */
/* ----------------------------------------------------------------------------- */
:root {

    --color-gray-100 : #eeeeee;
    --color-gray-200 : #dcdcdc;
    --color-gray-300 : #cccccc;
    --color-gray-400 : #bbbbbb;
    --color-gray-500 : #999999;
    --color-gray-600 : #808080;
    --color-gray-700 : #666666;
    --color-gray-800 : #4d4d4d;
    --color-gray-900 : #3c3c3c;

    --color-blue-100 : #cdeaf7;
    --color-blue-200 : #9bd5ef;
    --color-blue-300 : #6ac0e7;
    --color-blue-400 : #38abdf;
    --color-blue-500 : #0696d7;
    --color-blue-600 : #007fc6;
    --color-blue-700 : #006EAF;
    --color-blue-800 : #074b78;
    --color-blue-900 : #0a324d;

    --color-red-100 : #faeded;
    --color-red-200 : #f7d6d6;
    --color-red-300 : #f9b4b4;
    --color-red-400 : #f48686;
    --color-red-500 : #eb5555;
    --color-red-600 : #dd2222;
    --color-red-700 : #af1b1b;
    --color-red-800 : #800f0f;
    --color-red-900 : #520404;

    --color-yellow-100 : #feecd1;
    --color-yellow-200 : #fddaa4;
    --color-yellow-300 : #fcc776;
    --color-yellow-400 : #fbb549;
    --color-yellow-500 : #faa21b;
    --color-yellow-600 : #ed8d16;
    --color-yellow-700 : #d9730b;
    --color-yellow-800 : #bf5808;
    --color-yellow-900 : #8c3401;

    --color-green-100 : #e7f2d9;
    --color-green-200 : #cfe4b3;
    --color-green-300 : #b7d78c;
    --color-green-400 : #9fc966;
    --color-green-500 : #87b340;
    --color-green-600 : #6a9728;
    --color-green-700 : #507b16;
    --color-green-800 : #385e08;
    --color-green-900 : #234200;

    --color-turquoise-100 : #d6f2ef;
    --color-turquoise-200 : #ade4de;
    --color-turquoise-300 : #84d7ce;
    --color-turquoise-400 : #5bc9bd;
    --color-turquoise-500 : #32bcad;
    --color-turquoise-600 : #23a597;
    --color-turquoise-700 : #168576;
    --color-turquoise-800 : #0c665b;
    --color-turquoise-900 : #04403d;

    --color-dark-blue-100 : #e1ebf7;
    --color-dark-blue-200 : #bcd3ee;
    --color-dark-blue-300 : #8babdc;
    --color-dark-blue-400 : #5f8bcb;
    --color-dark-blue-500 : #3970b9;
    --color-dark-blue-600 : #1858a8;
    --color-dark-blue-700 : #064285;
    --color-dark-blue-800 : #003163;
    --color-dark-blue-900 : #0c2c54;

}


/*  SURFACE LEVELS */
/* ----------------------------------------------------------------------------- */
:root {

    --color-surface-level-1 : #ffffff;
    --color-surface-level-2 : #f5f5f5;
    --color-surface-level-3 : #eeeeee;
    --color-surface-level-4 : #d9d9d9;
    --color-surface-level-5 : #cccccc;
    
}
body.dark-theme {

    --color-surface-level-1 : #454f61;
    --color-surface-level-2 : #3b4453;
    --color-surface-level-3 : #2e3440;
    --color-surface-level-4 : #222933;
    --color-surface-level-5 : #1a1f26;

} 
body.black-theme {
    
    --color-surface-level-1 : #535353;
    --color-surface-level-2 : #474747;
    --color-surface-level-3 : #373737;
    --color-surface-level-4 : #2a2a2a;
    --color-surface-level-5 : #202020;

}


/*  HOVERING & SELECTION */
/* ----------------------------------------------------------------------------- */
:root {
    --color-hover-background    : #e1f2fa;
    --color-hover-border        : #76B5D5;
    --color-hover-image         : #76B5D5;
    --color-selected-background : #B9E1F4;
    --color-selected-border     : #76B5D5;
    --color-selected-image      : #76B5D5;
    --color-font                : #000000;
    --color-dark                : #000000;
    color-scheme                : light;
}
.dark-theme {
    --color-hover-border        : var(--color-blue-500);
    --color-hover-background    : var(--color-blue-800);
    --color-hover-image         : var(--color-blue-900);
    --color-selected-background : var(--color-blue-700);
    --color-selected-image      : var(--color-blue-800);
    --color-font                : #ffffff;
    --color-dark                : var(--color-surface-level-4);
    color-scheme                : dark;
}
.black-theme {
    --color-hover-border        : var(--color-blue-500);
    --color-hover-background    : var(--color-blue-800);
    --color-hover-image         : var(--color-blue-900);
    --color-selected-background : var(--color-blue-700);
    --color-selected-image      : var(--color-blue-800);
    --color-font                : #ffffff;
    --color-dark                : #000000;
    color-scheme                : dark;
}



/*  SURFACE COLORS */
/* ----------------------------------------------------------------------------- */
.surface-level-1 { background : var(--color-surface-level-1); border: 0px solid var(--color-surface-level-1); }
.surface-level-2 { background : var(--color-surface-level-2); border: 0px solid var(--color-surface-level-2); }
.surface-level-3 { background : var(--color-surface-level-3); border: 0px solid var(--color-surface-level-3); }
.surface-level-4 { background : var(--color-surface-level-4); border: 0px solid var(--color-surface-level-4); }
.surface-level-5 { background : var(--color-surface-level-5); border: 0px solid var(--color-surface-level-5); }


/*  FONT COLOR */
/* ----------------------------------------------------------------------------- */
 .dark-theme { color : #ffffff; }
.black-theme { color : #ffffff; }
.light-theme { color : #000000; }



/*  VIEWER */
/* ----------------------------------------------------------------------------- */
.adsk-viewing-viewer,
.adsk-viewing-viewer .canvas-wrap,
.adsk-viewing-viewer .canvas-wrap canvas { 
    background : none !important;
}

body.dark-theme  #guiviewer3d-toolbar .adsk-button { background : var(--color-surface-level-4); color : white; }
body.black-theme #guiviewer3d-toolbar .adsk-button { background : var(--color-surface-level-4); color : white;  border-color : var(--color-surface-level-4); }
body.light-theme #guiviewer3d-toolbar .adsk-button { background : white; border-color: #808080 !important;  border-radius : 2px !important }

body.light-theme #guiviewer3d-toolbar .adsk-button .adsk-button-icon::before { color : black; }
body.dark-theme  #guiviewer3d-toolbar .adsk-button .adsk-button-icon::before { color : white; }
body.black-theme #guiviewer3d-toolbar .adsk-button .adsk-button-icon::before { color : white; }

body.dark-theme  #guiviewer3d-toolbar .adsk-button:hover { background : var(--color-surface-level-5) !important; }
body.black-theme #guiviewer3d-toolbar .adsk-button:hover { background : var(--color-surface-level-5) !important; }
body.light-theme #guiviewer3d-toolbar .adsk-button:hover { border-color : var(--color-selected-background) !important; color : var(--color-selected-background) !important;  box-shadow:  0 0 0 3px #e3e3e3; }

body.light-theme #guiviewer3d-toolbar .adsk-button.active { box-shadow : 0 0 0 3px #A1D5EA; }
body.dark-theme  #guiviewer3d-toolbar .adsk-button.active { color : var(--color-blue-500) !important; border-color : var(--color-blue-500) !important; box-shadow : none; }
body.black-theme #guiviewer3d-toolbar .adsk-button.active { color : var(--color-blue-500) !important; border-color : var(--color-blue-500) !important; box-shadow : none; }

body.light-theme #guiviewer3d-toolbar .docking-panel { box-shadow : none !important; background-color : white !important;  border: 1px solid #808080 !important; }
body.dark-theme  #guiviewer3d-toolbar .docking-panel { box-shadow : none !important; background-color : var(--color-surface-level-3) !important;  border-color : var(--color-surface-level-3) !important; }
body.black-theme #guiviewer3d-toolbar .docking-panel { box-shadow : none !important; background-color : var(--color-surface-level-3) !important;  border-color : var(--color-surface-level-3) !important; }

body.dark-theme .adsk-viewing-viewer.dark-theme .docking-panel-title,
body.dark-theme .adsk-viewing-viewer.dark-theme .adsk-filterbox input.filter-box, .adsk-viewing-viewer.dark-theme .adsk-searchbox input.search-box { 
    background-color : rgba(34,41,51,.94) !important; 
    border-bottom : rgba(34,41,51,.8) !important; 
}
body.dark-theme .adsk-viewing-viewer.dark-theme .adsk-control-group,
body.dark-theme .adsk-viewing-viewer.dark-theme .docking-panel-container-solid-color-b {
    background-color : rgba(34,41,51,.94);
}
body.dark-theme .adsk-viewing-viewer.dark-theme .docking-panel-container-solid-color-a {
    background-color : rgba(34,41,51,.9);
}
body.dark-theme .adsk-viewing-viewer.dark-theme .docking-panel-footer {
    background-color : var(--color-surface-level-5);
}


/*  OVERLAY & PROCESSING*/
/* ----------------------------------------------------------------------------- */
 .dark-theme #overlay { background : rgba(26, 31, 38, 0.8); }
.black-theme #overlay { background : rgba(20, 20, 20, 0.7); }
.light-theme #overlay { background : rgba( 0,  0,  0, 0.5); }

 .dark-theme .processing > div { background-color: white; }
.black-theme .processing > div { background-color: black; }
.light-theme .processing > div { background-color: var(--color-blue-500); }

.light-theme #overlay .processing > div { background-color: white; }



/*  DATA TABLES */
/* ----------------------------------------------------------------------------- */
 .dark-theme .dataTables_wrapper .dataTables_length select,
.black-theme .dataTables_wrapper .dataTables_length select {
    background   : var(--color-surface-level-4);
    border-color : var(--color-surface-level-4);
    margin-right : 8px;
    margin-left  : 8px;
}
.dataTables_filter { 
    margin-bottom : 10px; 
}
.dataTables_length label,
.dataTables_filter label {
    color : var(--color-font);
}
.paginate_button.current {
    background  : var(--color-surface-3);
    color       : var(--color-font);
}
.dataTables_wrapper .dataTables_filter input { 
    border-top      : none !important; 
    border-right    : none !important; 
    border-left     : none !important; 
    border-radius   : 0px !important;
    background      : var(--color-surface-level-3) !important; 
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    color: var(--color-font) !important;
    border: 1px solid rgba(0, 0, 0, 0.3);
    background: none !important;
}
.dataTables_wrapper .dataTables_filter input {
    border-color : var(--color-gray-400) !important;
    margin-left  : 12px !important;
}
table.dataTable tbody tr td {
    cursor : pointer;
}
table.dataTable tbody tr:hover td {
    background : var(--color-hover-border); 
}