/* custom styles */

.hero {
  width: 67%;
  max-height: 300px;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

#roadmap {
  border:2px solid black;
  table-layout:fixed;
}

#roadmap td {
  border-top:0;
  border-bottom:0;
  border-left:2px solid black;
  border-right:2px solid black;
}

#roadmap th {
  border-top:0;
  border-bottom:0;
  border-left:2px solid black;
  border-right:2px solid black;
}

.reveal h2 {
  margin-bottom: 0.75em !important;
}

.reveal h4 {
  margin-top: 0.5em !important;
}

.reveal .footer {
  font-size: 0.5em !important;
}

.canvas_ss img {
  width: 90%;
  border: 1px solid grey;
}

.reveal .slide-number {
  position: absolute;
  top: 15px !important;
  right: 15px !important;
  bottom: auto !important;
  left: auto !important;
  background: transparent;
  color: inherit !important;
  pointer-events: none !important;
}

/* Style for inline code */
.reveal p code, .reveal li code, .reveal td code {
  padding: 2px 9px;
  background-color: #333333;
  border-radius: 4px;
}

.vcc {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 90%;
}


lord-icon.rc {
  width: 300px;
  height: 300px;
}

.mytable td {
  border: none !important;
}

iframe.slide-deck {
  border: 3px solid #dee2e6;
  width: 100%;
  height: 475px;
}

.my-title h1 {
  font-size: 1.8em !important;
  line-height: 1.1em;
}

.my-subtitle {
  font-size: 0.8em !important;
}

.my-grey {
  padding-top: 0.5em !important;
  color: #CCCCCC;
  font-size: 1.0em !important;
  line-height: 0.5em !important;
}

.table-bad td {
  border: 2px solid #F92F60 !important;
  background-color: #F4F4F4;
}

.table-good td {
  border: 2px solid #635994 !important;
  background-color: #F4F4F4;
}

.table-small td {
  font-size: 80%;
}

.bg-yellow {
  background-color: #FFFF00;
}

.bg-teal {
  background-color: #33FCFF;
}

/* From Tachyons */

.br-100 {     border-radius: 100%; }
.ba { border-style: solid; border-width: 1px; }
.b      { font-weight: bold; }
.tc  { text-align: center; }
.tr  { text-align: right; }

.pv4 {
  padding-top: 2rem;
  padding-bottom: 2rem;
}

.pv5 {
  padding-top: 4rem;
  padding-bottom: 4rem;
}

.danger code {
  color: #FF725C !important;
}

.mt1 {  margin-top: .25rem; }
.mt4 {  margin-top: 1rem; }

.gray { color: #777777; }
.silver { color: #999999; }
.light-silver { color: #AAAAAA; }
.moon-gray { color: #CCCCCC; }
.light-gray { color: #EEEEEE; }
.near-white { color: #F4F4F4; }
.white { color: #FFFFFF; }
.dark-red { color: #E7040F; }
.red { color: #FF4136; }
.light-red { color: #FF725C; }
.orange { color: #FF6300; }
.gold { color: #FFB700; }
.yellow { color: #FFD700; }
.light-yellow { color: #FBF1A9; }
.light-purple { color: #A463F2; }
.dark-pink { color: #D5008F; }
.hot-pink { color: #FF41B4; }
.pink { color: #FF80CC; }
.light-pink { color: #FFA3D7; }
.dark-green { color: #137752; }
.green { color: #19A974; }
.light-green { color: #9EEBCF; }
.blue { color: #357EDD; }
.light-blue { color: #96CCFF; }
.lightest-blue { color: #CDECFF; }
.washed-blue { color: #F6FFFE; }
.washed-green { color: #E8FDF5; }
.washed-yellow { color: #FFFCEB; }
.washed-red { color: #FFDFDF; }
.black { color: #000000; }
.near-black { color: #111111; }
.dark-gray { color: #333333; }
.mid-gray { color: #555555; }
.gray { color: #777777; }
.dark-red { color: #E7040F; }
.red { color: #FF4136; }
.purple { color: #5E2CA5; }
.light-purple { color: #A463F2; }
.dark-pink { color: #D5008F; }
.dark-green { color: #137752; }
.navy { color: #001B44; }
.dark-blue { color: #00449E; }
.blue { color: #357EDD; }

.f3 { font-size: 20px !important; }
.fsmaller { font-size: 80%; }

.reveal .slide-number {
  position: absolute;
  top: 15px !important;
  right: 15px !important;
  bottom: auto !important;
  left: auto !important;
  background: transparent;
  color: inherit !important;
  pointer-events: none !important;
}

/* Format code output */

.reveal div.sourceCode pre code {
  padding: 10px !important;
  display: block;
}

.reveal div.sourceCode pre {
  padding: 0 !important;
}

.reveal div.sourceCode pre,
.reveal div.sourceCode code {
  margin-bottom: 0 !important;
}

.reveal div.sourceCode {
  margin-bottom: 1rem !important;
  border-radius: 8px !important;
}

.reveal div.sourceCode pre,
.reveal div.sourceCode code {
  border-radius: 8px !important;
}

.reveal .cell:has(.cell-output) div.sourceCode {
  margin-bottom: 0 !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

.reveal .cell:has(.cell-output) div.sourceCode pre,
.reveal .cell:has(.cell-output) div.sourceCode code {
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

.cell-output-stdout pre {
  background-color: transparent !important;
  box-shadow: none !important;
}

.cell-output-stdout pre code {
  color: #3f3f3f !important;
  background-color: #dcdccc;
  border-top-left-radius: 0px !important;
  border-top-right-radius: 0px !important;
  border-bottom-left-radius: 8px !important;
  border-bottom-right-radius: 8px !important;
  padding: 10px;
  display: block;
  margin-bottom: 1rem;
}

.cell-output-error pre {
  background-color: transparent !important;
  box-shadow: none !important;
}

.cell-output-error pre code {
  color: #5c0000 !important;
  background-color: #eec5c5;
  border-top-left-radius: 0px !important;
  border-top-right-radius: 0px !important;
  border-bottom-left-radius: 8px !important;
  border-bottom-right-radius: 8px !important;
  padding: 10px;
  display: block;
  margin-bottom: 1rem;
}

/* Warning styles */
.cell-output-warning pre {
  background-color: transparent !important;
  box-shadow: none !important;
}

.cell-output-warning pre code {
  color: #5c4700 !important;
  background-color: #dcdccc !important;
  border-top-left-radius: 0px !important;
  border-top-right-radius: 0px !important;
  border-bottom-left-radius: 8px !important;
  border-bottom-right-radius: 8px !important;
  padding: 10px !important;
  display: block;
  margin-bottom: 1rem;
}

.cell-output-warning pre code::before {
  content: "\26A0\FE0E";
  color: #5c4700 !important;
  font-size: 1.2em;
  margin-right: 8px;
  vertical-align: middle;
  margin-bottom: 0 !important;
}

/* Message styles */
.cell-output-message pre {
  background-color: transparent !important;
  box-shadow: none !important;
}

.cell-output-message pre code {
  color: #00449E !important;
  background-color: #dcdccc !important;
  border-top-left-radius: 0px !important;
  border-top-right-radius: 0px !important;
  border-bottom-left-radius: 8px !important;
  border-bottom-right-radius: 8px !important;
  padding: 10px !important;
  display: block;
  margin-bottom: 1rem;
}

.cell-output-message pre code::before {
  content: "\2139\FE0E";
  color: #00449E !important;
  font-size: 1.2em;
  margin-right: 8px;
  vertical-align: middle;
  margin-bottom: 0 !important;
}

.reveal .cell-output:has(+ .cell-output) pre code {
  margin-bottom: 0 !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

.reveal .cell-output:has(+ .cell-output) {
  margin-bottom: 0 !important;
}

kbd {
  font-size: 0.8em;
}

.reveal pre.cell-code {
  margin-bottom: 1rem !important;
  border-radius: 8px !important;
  padding: 0 !important;
  background-color: #f4f4f4;
}

.reveal pre.cell-code code {
  padding: 10px !important;
  display: block;
  margin-bottom: 0 !important;
  border-radius: 8px !important;
  color: #3f3f3f;
  background-color: transparent !important;
}

.reveal pre.qmd {
  background-color: #f4f4f4 !important;
  border-radius: 8px !important;
  padding: 0 !important;
  margin-bottom: 1rem !important;
}

.reveal pre.qmd code {
  color: #3f3f3f !important;
  background-color: transparent !important;
  padding: 10px !important;
  display: block;
  border-radius: 8px !important;
}

/* Remove gap and border-radius when code-fold is true */
.reveal .cell:has(.cell-output) details {
  margin-bottom: 0 !important;
}

.reveal .cell:has(.cell-output) details pre.cell-code,
.reveal .cell:has(.cell-output) details div.sourceCode {
  margin-bottom: 0 !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

.reveal .cell:has(.cell-output) details pre.cell-code code,
.reveal .cell:has(.cell-output) details div.sourceCode pre,
.reveal .cell:has(.cell-output) details div.sourceCode code {
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

/* Container to make multiple code/span elements look like one block */
.formula-block {
  background-color: #333333; /* Matches your existing code background */
  padding: 2px 9px;
  border-radius: 4px;
  display: inline-block;
  font-family: monospace; /* Ensures non-code text still looks like code */
  color: #FFFFFF;
}

/* Strip individual styling from code tags inside the container */
.formula-block code {
  background-color: transparent !important;
  padding: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
