@import url('./fonts.css');
@import url('./system.css');
@import url('./smartText.css');
@import url('./shapes.css');
@import url('./choice.css');
@import url('./gaps.css');
@import url('./textSelection.css');
@import url('./sourceLists.css');
@import url('./headers.css');
@import url('./imageIdentification.css');
@import url('./audio.css');
@import url('./table.css');
@import url('./keyboard.css');
@import url('./drawing.css');
@import url('./colorSelector.css');

:root {
    --lessonColor: #ecaa34;
    --accentColor: #1e4592;
    --correctColor:#77B548;
    --correctColorTransparent:#77B54880;
    --correctColorDark:#4d792b;
    --correctColorLight: #9ac07c;
    --correctColorLight2: #b5d0a1;
    --wrongColor:#CB372A;
    --wrongColorTransparent:#CB372A80;
    --wrongColorDark:#851e15;
    --wrongColorLight:#c76b63;
    --wrongColorLight2:#c9938e;
    --errorColor: #ffc933;
    --errorColorDark:#99791F;
    --errorColorLight: #ffefc2;
    --errorColorLight2: #FFDF85;
}

.addon_Draco_word_search {
    --correctColorDark:#4d792b;
    --correctColorLight: #9ac07c;
    --correctColorLight2: #b5d0a1;
    --wrongColor:#851e15;
    --wrongColorDark:#851e15;
    --wrongColorLight:#c76b63;
    --wrongColorLight2:#c9938e;
    --errorColor: #ffc933;
    --errorColorDark:#99791F;
    --errorColorLight: #ffefc2;
    --errorColorLight2: #FFDF85;
}


.ic_player.st_dragging {
  -webkit-user-select: none;
}
.ic_player{
  border: none !important;
  background-color: white;
}
.ic_page {
  overflow: visible !important;   
}
.start {
    background-position: top left, top left;
    background-repeat: no-repeat, no-repeat;
    text-align: center;
    width: 900px, 800px;
    padding: 25px 0;
    color: white;
    font-family: 'Sofia Pro Soft Regular', sans-serif;
    position: relative;
}

.circle-container {
    position: relative;
    display: flex;
    z-index: 2;
    height: 200px;
    left: 25px;
}

.circle {
    width: 200px;
    height: 200px;
    border-radius: 50%;
    margin: 0 5px;
    position: absolute;
}

.upper-circle {
    background-color: #ee7658;
}

.lower-circle {
    background-color: #dd694a;
    margin-top: 5px; 
    margin-left: 10px;
}

h1, h2 {
    margin: 0;
    padding: 0;
}

.chapter-title, .lesson-title {
    font-size: 36px;
    font-weight: bold;
}

.lesson-number {
    font-size: 24px;
}
.chapter-number {
    font-size: 150px;
}
.chapter-name{
    font-size: 30px;
    position: absolute;
    bottom: 17px;
   align-content: end;
}

.lesson-info {
    margin-top: 20px;
}
.upper-cloud{
background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Warstwa_1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 451 216.51'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%2365abb9;stroke-width:0px;%7D%3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='m81.53,0s2.47,9.56-42.23,40.09C17.84,54.74-3.85,93.06.58,118.22c2.92,9.79,4.93,37.28,14.06,47.81,36.53,42.13,106.14,50.24,106.14,50.24,0,0,83.36,5.36,112.38-34.21,29.02-39.57,92.05-5.98,92.05-5.98,0,0,78.37,34.05,104.5-11.98,26.13-46.03,20.85-71.95,20.85-71.95,0,0,3.72-59.54-72.52-66.22'/%3E%3C/svg%3E")
}
.lower-cloud{
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Warstwa_1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 336.52 227.57'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%2350a5ae;stroke-width:0px;%7D%3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='m22.55,98.02C5.55,112.78-3.67,135.06,1.38,156.58c1.89,8.02,5.62,16.37,12.25,24.36,26.5,31.97,58.42,43.38,58.42,43.38,0,0,53.9,15.51,77.63-21.27,23.73-36.78,87.39-19.78,87.39-19.78,0,0,58.92,20.62,80.66-21.35,21.74-41.97,18.64-63.47,18.64-63.47,0,0-1.56-49.53-59.45-56.77-57.89-7.24-62.06-4.79-82.61-21.17C173.76,4.15,149.91,2.01,113.43.05c-36.48-1.96-55.04,53.96-55.04,53.96,0,0-.4,13.25-35.83,44.01'/%3E%3C/svg%3E");
    top: -110px !important;
  width: 665px !important;
  left: -10px !important;
}
.cloud{
    background-position: top left;
    background-repeat: no-repeat;
    position: absolute;
    width: 900px;
    padding: 50px 0;
    overflow: hidden;
    height: 500px;
    top: -140px;
    left: -30px;

}
.cloud-container{
    height: 300px;
  position: absolute;
  top: 0px;
  width: 100%;
}
.chapter-title{
    font-size: 45px;
    font-weight: bold;
    position: relative;
    top: 90px;
}

.addon_TrueFalse,
.TrueFalse_with_number {
  min-height: 50px;
  height: auto !important;
}
.addon_TrueFalse table,
.TrueFalse_with_number table {
  border-spacing: 0;
  margin: 0px;
}
.addon_TrueFalse table tr td,
.tf_radio_image.last,
.tf_checkbox_image.last,
.TrueFalse_with_number tr td {
  border: none;
  border-radius: 0px;
  padding: 0px;
  margin: 0px;
}
.addon_TrueFalse table tr:first-of-type,
.TrueFalse_with_number table tr:first-of-type {
  background:var(--bg1);
  font-weight: bold;
  color: white;
  height: fit-content;
  max-height: 0px;
}
.addon_TrueFalse table tr:first-of-type td:not(:first-of-type),
.TrueFalse_with_number table tr:first-of-type td:not(:first-of-type) {
  border-left: 3px solid white;
  padding: 0px 0.8rem;
}
.addon_TrueFalse table tr:first-of-type td,
.TrueFalse_with_number table tr:first-of-type td {
  padding: 4px 0px;
  width: fit-content;
  min-width: 0px;
  height: 0px;
  min-height: max-content;
  max-height: 0px;
}
.addon_TrueFalse table tr,
.TrueFalse_with_number table tr {
  background: var(--bg2);
}
.addon_TrueFalse table tr:not(:first-of-type) td,
.TrueFalse_with_number table tr:not(:first-of-type) td {
  background: white;
  border-bottom: 5px solid var(--bg2);
}
.addon_TrueFalse table tr:not(:first-of-type) td:first-of-type,
.TrueFalse_with_number table tr:not(:first-of-type) td:first-of-type {
  border-left: 16px solid var(--bg2);
  border-right: 5px solid var(--bg2);
  padding-left: 10px;
  opacity: 1;
}
.addon_TrueFalse table tr:nth-of-type(2) td,
.TrueFalse_with_number table tr:nth-of-type(2) td {
  border-top: 16px solid var(--bg2);
}
.addon_TrueFalse table tr:last-of-type td,
.TrueFalse_with_number table tr:last-of-type td {
}
.addon_TrueFalse table tr div,
.TrueFalse_with_number table tr div {
  background-image: none !important;
}
.addon_TrueFalse table tr:not(:first-of-type) td:not(:first-of-type),
.TrueFalse_with_number table tr:not(:first-of-type) td:not(:first-of-type) {
  background: white;
  border-left: 8px solid var(--bg2);
  border-right: 8px solid var(--bg2);
  opacity: 1;
}
.addon_TrueFalse table tr:last-of-type td,
.TrueFalse_with_number table tr:last-of-type td {
  border-width:16px;
}
.addon_TrueFalse table tr .tf_radio_image div,
.addon_TrueFalse table tr .tf_checkbox_image div,
.TrueFalse_with_number table tr .tf_radio_image div,
.TrueFalse_with_number table tr .tf_checkbox_image div {
  width: 100%;
  height: 100%;
}
.tf_radio_image,
.tf_checkbox_image {
  width: auto;
  min-width: auto;
  height: auto;
  min-height: auto;
}
.addon_TrueFalse table tr td:last-of-type,
.TrueFalse_with_number table tr td:last-of-type {
  border-right: 16px solid var(--bg2) !important;
}
.addon_TrueFalse table tr:first-of-type td:last-of-type,
.TrueFalse_with_number table tr:first-of-type td:last-of-type {
  padding: 0px 1.1rem;
  border-right: none !important;
}
.TrueFalse_with_number {
}
.TrueFalse_with_number {
  --listStart:1;
}
.TrueFalse_with_number tbody tr:not(:first-of-type) {
  counter-increment: listCounter;
}
.TrueFalse_with_number tbody tr:nth-of-type(2) {
  counter-reset: listCounter var(--listStart);
  counter-increment: none;
}
.TrueFalse_with_number tbody tr:not(:first-of-type) td:first-of-type {
  padding-left: 25px;
}
.TrueFalse_with_number tbody tr:not(:first-of-type) td:first-of-type::before {
  content: counter(listCounter) '.';
  width: 20px;
  display: inline-block;
  text-align: left;
  margin-left: -25px;
  padding-left: 5px;
  font-weight: bold;
  color: var(--bg1);
}
.tf_radio_image div::before,
.tf_checkbox_image div::before {
  content: 'x';
  font-family: 'Kalam';
  position: relative;
  display: inline-flex;
  left: 0%;
  width: 100%;
  height: calc(100%);
  top: 0px;
  justify-content: center;
  align-items: center;
  color: #3173b3;
  transform: scale(0);
  opacity: 0;
  transition: all 0.3s;
  z-index: 3;
  font-size: 25px;
}
.tf_radio_image.down div::before, 
.tf_checkbox_image.down div::before{
  opacity: 1;
  transform: scale(1);
}
.mouse-hover div::before {
  opacity: 1;
  transform: scale(1.2);
}
:not(.tf_checkbox_question, .tf_radio_question).disabled::before {
  opacity: 0;
  transform: scale(0);
}
.disabled.correct-answer div::before {
  opacity: 1;
  transform: scale(1);
}
:is(.tf_radio_image, .tf_checkbox_image).disabled{
cursor: auto;
}
.down.correct div::before{
  color: var(--correctColor);
  -webkit-text-fill-color: var(--correctColor);
  opacity: 1;
  transform: scale(1);
}
.down.wrong div::before{
  color: var(--wrongColor);
  -webkit-text-fill-color: var(--wrongColor);
  opacity: 1;
  transform: scale(1);
}
.ic_page.ic_main::before{
  content: 'to będzie zasłonięte';
  width: 20px;
  height: 100%;
  background: rgb(233, 126, 126);
  clip-path: polygon(0 100%, 0 0, 51px 0, 51px 100%, calc(100% - 51px) 100%, calc(100% - 51px) 0, 100% 0, 100% 100%);
  position: absolute;
  color: blue;
  font-weight: bold;
  text-transform: uppercase;
  white-space: preserve;
  padding-left: 10px;
  padding-right: 970px;
  writing-mode: vertical-rl;
  text-orientation: upright;
  text-indent: 5%;
  letter-spacing: -5px;
  font-size: 16px;
}

.ic_page:not(.ic_main, .ic_footer)::before{
  content: '';
  position: absolute;
  z-index: 1;
  top: 0px;
  left: 0px;
  height: calc(100% + 10px);
  width: calc(100% - 80px);
  background: var(--colorPage1);
  border: 40px solid var(--colorPage2);
  border-top: none;
  clip-path: polygon(0 100%, 0 0, 51px 0, 51px calc(100% - 101px), calc(100% - 51px) calc(100% - 101px), calc(100% - 51px) 0, 100% 0, 100% 100%);
  border-bottom-width: 90px;
}

.headersParent::before, 
.headersParent::after{
  content: '';
  position: absolute;
  z-index: -2;
  background: var(--colorPage2);
  width: 100%;
  top: 0px;
  height: 100%;
}

.headersParent::after{
  background: var(--colorPage1);
  width: calc(100% - 80px);
  height: calc(100% - 25px);
  z-index: -1;
  left: 50%;
  transform: translate(-50%, 25px);
}

.ic_footer{
  height: 100px !important;
}

.lesson0{
  --colorHeader1: #de8528;
  --colorHeader2: #e19436;
  --colorPage1: #f1cba5;
  --colorPage2: #fdf8f2;
}

.lesson1, .lesson6, .lesson11, .lesson16, .lesson21, .lesson26{
  --colorHeader1: #8cb3dd;
  --colorHeader2: #92cce9;
  --colorPage1: #c5daee;
  --colorPage2: #e8f4fa;
}

.lesson2, .lesson7, .lesson12, .lesson17, .lesson22, .lesson27{
  --colorHeader1: #a0be8b;
  --colorHeader2: #adce97;
  --colorPage1: #d0dfc4;
  --colorPage2: #eff5ea;
}

.lesson3, .lesson8, .lesson13, .lesson18, .lesson23, .lesson28{
  --colorHeader1: #e5a07b;
  --colorHeader2: #ecbb9d;
  --colorPage1: #f4d8c7;
  --colorPage2: #fefbf9;
}

.lesson4, .lesson9, .lesson14, .lesson19, .lesson24, .lesson29{
  --colorHeader1: #ab97c3;
  --colorHeader2: #b7a9cd;
  --colorPage1: #dbd3e6;
  --colorPage2: #f9f8fb;
}

.lesson5, .lesson10, .lesson15, .lesson20, .lesson25, .lesson30{
  --colorHeader1: #368098;
  --colorHeader2: #3e95a2;
  --colorPage1: #a7c3cf;
  --colorPage2: #e8eef2;
}

.lessonG{
  --colorHeader1: #4460a5;
  --colorHeader2: #5978b4;
  --colorPage1: #7a93c3;
  --colorPage2: #f8fbfe;
}

.lessonD, .lessonA {
  --colorHeader1: #6064a6;
  --colorHeader2: #6f6fb2;
  --colorPage1: #bcbdda;
  --colorPage2: #f5f6fa;
}
.lessonT {
--colorHeader1: #57a6c1;
--colorHeader2: #80bdd4;
--colorPage1: #badae5;
--colorPage2: #e2eef3;
}
.lessonDiccionario {
  --colorHeader1: #cc6f7f;
  --colorHeader2: #ce8090;
  --colorPage1: #dcb6bd;
  --colorPage2: #efdfe2;
}
.lessonV {
  --colorHeader1: #89c29c;
  --colorHeader2: #9dd0b0;
  --colorPage1: #c9dfce;
  --colorPage2: #e9f2ec;
}
.lessonM {
  --colorHeader1: #306db0;
    --colorHeader2: #4582c4;
    --colorPage1: #7cadd9;
    --colorPage2: #d2e6f7;
  }

.addon_Draco_word_search:not(.ice_module) .Magic_Boxes-cell_container .Magic_Boxes-letter{
  z-index: 42 !important;
}

.addon_Draco_word_search .Magic_Boxes-cell_container{
  z-index: unset !important;
}

.Draco_Irregular_Crossword_container {
  filter: drop-shadow(2px 2px 5px #8080809c);
  will-change: filter;
}

.Draco_Irregular_Crossword .Draco_Irregular_Crossword_container .cell_parent.cell_wrong input,
.Draco_Irregular_Crossword .Draco_Irregular_Crossword_container .cell_parent.cell_correct.word_wrong input {
    color: var(--wrongColor);
    -webkit-text-fill-color: var(--wrongColor);
}

.Draco_Irregular_Crossword .Draco_Irregular_Crossword_container .cell_parent.cell_correct:not(.word_wrong) input {
    color: var(--correctColor);
    -webkit-text-fill-color: var(--correctColor);
}

.Draco_Irregular_Crossword .Draco_Irregular_Crossword_container .cell_parent.word_wrong.cell_correct.word_correct input,
.Draco_Irregular_Crossword .Draco_Irregular_Crossword_container .cell_parent.word_wrong.cell_wrong.word_correct input {
    color: var(--errorColor);
    -webkit-text-fill-color: var(--errorColor);
}

.draco-crossword-input-wrong {
color: var(--wrongColor) !important;
-webkit-text-fill-color: var(--wrongColor) !important;
}

.draco-crossword-input-correct{
    color: var(--correctColor) !important;
}