@import 'https://sdi.evaluationkit.com/canvas/css';

/*********************************************************************/
/***** BEGIN DESIGNPLUS THEME IMPORT & CUSTOMIZATION  ****************/
/*********************************************************************/
/* Import statements need to be at the top of your CSS file */

/* For Main CSS files */
@import url(https://designplus.ciditools.com/css/content.css);
@import url(https://designplus.ciditools.com/css/editor.css);
/* For Mobile app CSS file */
/*@import url(https://designplus.ciditools.com/css/mobile.css);*/

:root {
    --dt-color-primary: #C8BAAB;
    --dt-color-primary-contrast: #000000;
    --dt-color-primary-dark-text: #C8BAAB;
    --dt-color-secondary: #000000;
    --dt-color-secondary-contrast: #FFFFFF;
    --dt-color-secondary-dark-text: #000000;
    --dt-color-accent: #922E1F;
    --dt-color-accent-contrast: #000000;
    --dt-color-accent-dark-text: #922E1F;
    --dt-color-gray: #CCCCCC;
    --dt-color-gray-contrast: #000000;
    --dt-color-gray-dark-text: #636363;
    --dt-color-white: #FFFFFF;
    --dt-color-white-contrast: #000000;
    --dt-color-white-dark-text: #707070;
};

.cp-bg-tertiary {
  background-color: var(--dt-color-tertiary);
  color: var(--dt-color-tertiary-contrast);
}

.cp-text-tertiary {
  color: var(--dt-color-tertiary);
}

.cp-border-tertiary {
  border: 2px solid var(--dt-color-tertiary);
}

/*********************************************************************/
/***** EdutechLoft Custom CSS  *****************/
/*********************************************************************/

.dp-wrapper .dp-panel-active-color-dp-primary.dp-tabs-buttons>.nav-tabs a.nav-
link.active {
font-weight: bold !important;
}
.dp-wrapper .dp-panel-active-color-dp-primary.dp-tabs-buttons>.nav-tabs a.nav-
link:hover {
font-weight: bold !important;
}
 


/*********************************************************************/
/***** END DESIGNPLUS THEME IMPORT & CUSTOMIZATION   *****************/
/*********************************************************************/

/* === Progress Tracker Tab Styling === */

/* Default gray for all tabs before being clicked */
.dp-panel-heading.tab-not-clicked {
  background-color: #cccccc !important; /* Light gray */
  color: black !important;
}

/* Revert to black when tab is clicked */
.dp-panel-heading.tab-clicked {
  background-color: #000000 !important; /* Black */
  color: white !important;
}

/* hover and active don't override */
.dp-panel-heading.tab-not-clicked:hover {
  background-color: #aaaaaa !important;
}

.dp-panel-heading.tab-clicked:hover {
  background-color: #222222 !important;
}

.dp-tab-not-clicked {
  background-color: #888 !important; /* gray background */
  color: white !important;
}

.dp-tab-clicked {
  background-color: black !important;
  color: white !important;
}
/*Hide Submission Trail*/
/* 1) Hide radio and its label */
.css-1gtanqs input[name="SubmissionTrayRadioInput"][value="excused"],
.css-1gtanqs input[name="SubmissionTrayRadioInput"][value="excused"] + label {
  display: none !important;
}
/* 2) hide the background block */
.SubmissionTray__RadioInput-WithBackground:has(input[name="SubmissionTrayRadioInput"][value="excused"]) {
  display: none !important;
}
/* 3) in case Canvas renders a wrapping <span> around that block */
.css-1sbhkbz-gridCol:has(input[name="SubmissionTrayRadioInput"][value="excused"]) {
  display: none !important;
}