
/* Theme CSS */
:root {
  --primary-color: #C1121F;
  --tint-color: color-mix(in srgb, var(--primary-color) 20%, white 80%);
}
.custom-note-block .note-icon{color: #C1121F !important;}
.custom-note-block .note-card {
  background-color: var(--tint-color);
  border-color: #C1121F !important;
}
.scn-correct-feedback .icon, .scn-incorrect-feedback .icon{ fill: #FFFFFF !important;}
.scenario .card-content h2, .card-content h3{color: #FFFFFF !important;}
.frameindextop#theme-1, .frameindextop#theme-3, .frameindextop#theme-4{ background-color: #C1121F !important;}
.custom-list-block ol li::before, .coursenamemenu{ background-color: #C1121F; }
#pageNewContent h1, .coursenamemenu .logobanner .coursename{color: #FFFFFF !important;}
.coursenamemenu h3, #theme-2 .vcenterdiv .c_title{color: #fff !important;}
.sidebar .active, #landing_page_menu .active{border-left: 3px solid #C1121F !important;}
.course_start{background: #FFFFFF !important; color: #000000 !important;}
body{ font-family: Raleway, sans-serif !important; color: #383838 !important; }
h1, .h1, h2, .h2, h3, .h3, h4, .editor-block h1, .editor-block h2, .editor-block h3, .custom-question-block .question-title, .custom-accordion-block .custom-accordion .card-header .btn-link.custom-collapsed, .custom-step-accordion-block .step-tab.active, .checkbox-header, .checkbox-header:hover, .file-title,  #landing_page_menu .parent_ul_title, .custom-flip-accordion .flip-card-front, #menuContainer .parent_ul_title {color: #383838; font-family: #383838 !important; }
.custom-quote-block::before { background: #C1121F !important; }
.custom-list-block ul li::before { color: #C1121F; }
.btn-blue, .scenario-intro .card-content .btn-blue { background-color: #C1121F !important; border-color: #C1121F !important;  color: #FFFFFF !important;}
.btn-blue:hover, .scenario-intro .card-content .btn-blue:hover {background-color: #C1121F !important; border-color: #C1121F !important;  color: #FFFFFF !important; opacity:0.6; }
.custom-flip-accordion .flip-card-inner { border-top-color: #C1121F !important; }
.checkbox-input { accent-color: #C1121F; }
.custom-step-accordion-block .step-tab.active { border-right-color: #C1121F !important; }
.timeline-content, .custom-statement-block { border-left-color: #C1121F !important; } 
.checkbox-header:hover{color: #C1121F !important; }
.bg-purple-500, .menu-toggle, focus-visible:ring-app-dark-purple { background: #C1121F !important; }
.loader1 span { background:#C1121F};
.custom-checkbox-accordion .checkbox-content h1, .custom-checkbox-accordion .checkbox-content h2, .custom-checkbox-accordion .checkbox-content h3, .custom-checkbox-accordion .checkbox-content h4, .custom-checkbox-accordion .checkbox-content h5, .custom-checkbox-accordion .checkbox-content h6{color: #383838 !important;}
.scenario.card {
  display: flex;
  flex-direction: row;
  background: #C1121F;
  border-radius: 8px;
  overflow: hidden;
  max-width: 98%;
  margin: 0 auto;
  gap:30px;
  padding: 0px 30px;
  color: #FFFFFF;
}.scenario-intro{  display: flex;
      flex-direction: row;
      border-radius: 8px;
      overflow: hidden;
      max-width: 98%;
      margin: 0 auto;
          gap: 30px;
           padding:0px 30px;}
.quiz-options{  padding-left:0px;  display: flex;
    flex-direction: column;
    gap: 10px;}
.scenario.card img, .scenario-intro img {
  width: calc(100% - 0px);
  height: 400px;
  object-fit: cover;
  border-radius:6px !important;

}

.scenario .card-image,.scenario-intro .card-image {
  flex: 1 1 50%;
  padding: 30px 0px;
}

.scenario .card-content,.scenario-intro .card-content {
  flex: 1 1 50%;
  padding: 30px 0px;
}

.scenario .card-content h2 {
  margin-top: 0;
}

.scenario .buttons {
  margin-top: 20px;
  display: flex;
  gap: 10px;
}

.scenario .buttons button {
  padding: 10px 20px;
  border: none;
  border-radius: 4px;
  font-size: 14px;
  cursor: pointer;
}

.scenario .buttons .back {
  background: #333;
  color: #fff;
}

.scenario .buttons .continue {
  background: #fff;
  color: #333;
}

/* Mobile view */
@media (max-width: 768px) {
  .scenario .card {
    flex-direction: column;
  }
  .scenario .card-image,
  .scenario .card-content {
    flex: 1 1 100%;
  }
  .scenario .card img {
    height: 250px;
  }
  .scn-scene, .scn-quiz, .scn-feedback{background: #C1121F; color:  #FFFFFF !important; border-color: #C1121F; padding:30px !important;     float: left;
    width: 100%;}
.card-content  .btn-blue, .card-content  .btn-blue:hover, .scenario .buttons button
{background: #FFFFFF !important; color: #C1121F !important; border-color: #FFFFFF !important;}
.card-content  .btn-transparent-blue,  .card-content .btn-transparent-blue:hover, .scenario .buttons button
{background: #FFFFFF !important; color: #C1121F !important; border-color: #FFFFFF !important;}
.scn-result-title .icon-close{background: #FFFFFF !important; fill: #C1121F !important;}
.scn-result-title .icon-check{background: #FFFFFF !important;}
.scn-result-title .icon-check path{stroke:  #C1121F !important;}
.scn-result-title .icon-check-o{fill:  #FFFFFF !important;}
.scenario .card-content h2, .card-content .result h2, .card-content .result h3,  .card-content h3{color: #FFFFFF !important; align-items:center; display:flex; width:100%;}
.scenario .card-content h2 svg, .card-content .result h2 svg,  .card-content h3 svg, .card-content .icon-check-o, .card-content .icon-close-c  {fill: #FFFFFF !important; }
.card-content .icon-check-o, .card-content .icon-close-c{
    fill: #FFFFFF !important;
      border-radius: 50%;
    width: 38px;
    height: 38px;
    float: left;
    margin: 0px 12px 0px 0px;
}
