/* Hide h2 tag under the quarto-other-links class */
.quarto-other-links h2 {
  display: none;
}

.colab{
  align-items: center;
  gap: 0.5em;
  padding: 0.4em 0.8em;
  background-color: #f9f9f9;
  border: 1px solid #ccc;
  border-radius: 4px;
  text-decoration: none;
  text-align: center;
  /* font-weight: bold; */
  /* color: #333; */
  cursor: pointer;
  transition: background-color 0.2s ease;
}

.column-margin.colab:hover {
  background-color: #eee;
}

/* Add the Colab badge via a pseudo-element */
.colab::before {
  content: "";
  display: inline-block;
  background: url("https://colab.research.google.com/assets/colab-badge.svg") no-repeat center;
  background-size: contain;
  width: 100%;   /* Use a fixed width */
  height: 1.5em;
  margin-right: 0.5em;
}

.margin-note {
    margin-right: calc(var(--margin-width, 2em) + 50px + 20px); /* Adds extra spacing */
}

.marginnote {
    margin-right: calc(var(--margin-width, 2em) + 50px + 20px);
}

.quarto-float-caption-margin.quarto-float-caption {
        color: black !important;
      }
      
/* Neuron colors */
.gray_neuron {
  color: rgb(179, 179, 179); /* 0.7 * 255 = 179 */
}

/* Transformer colors */
.param_color {
  color: rgb(210, 234, 247); /* 0.82352941 * 255 = 210 */
}
.data_color {
  color: rgb(245, 220, 218); /* 0.96078431 * 255 = 245 */
}
.param_color_dark {
  color: rgb(
    51,
    153,
    255
  ); /* 0.2 * 255 = 51, 0.6 * 255 = 153, 1.0 * 255 = 255 */
}
.data_color_dark {
  color: rgb(
    255,
    102,
    97
  ); /* 1.0 * 255 = 255, 0.4 * 255 = 102, 0.38 * 255 = 97 */
}

.param_color_light {
  color: rgb(
    179,
    230,
    255
  ); /* 0.7 * 255 = 179, 0.9 * 255 = 230, 1.0 * 255 = 255 */
}

/* Zero color */
.zero_color {
  color: rgb(77, 77, 77); /* 0.3 * 255 = 77 */
}

/* Computation graph colors */
.comp_graph_param_bcolor {
  background-color: rgb(
    77,
    179,
    255
  ); /* 0.3 * 255 = 77, 0.7 * 255 = 179, 1.0 * 255 = 255 */
}
.comp_graph_node_bcolor {
  background-color: rgb(
    242,
    214,
    158
  ); /* 0.95 * 255 = 242, 0.84 * 255 = 214, 0.62 * 255 = 158 */
}
.comp_graph_loss_node_bcolor {
  background-color: rgb(
    237,
    110,
    87
  ); /* 0.93 * 255 = 237, 0.43 * 255 = 110, 0.34 * 255 = 87 */
}
.comp_graph_data_bcolor {
  background-color: rgb(255, 255, 255); /* 1.0 * 255 = 255 */
}
.comp_graph_param_grad_bcolor {
  background-color: rgb(
    247,
    224,
    89
  ); /* 0.97 * 255 = 247, 0.88 * 255 = 224, 0.35 * 255 = 89 */
}

/* Shared term colors */
.shared_term_color {
  color: rgb(230, 230, 230); /* 0.9 * 255 = 230 */
}

/* Forward and backward propagation colors */
.forwardpropcolor {
  color: rgb(51, 230, 51); /* 0.2 * 255 = 51, 0.9 * 255 = 230 */
}
.backwardpropcolor {
  color: rgb(230, 51, 51); /* 0.9 * 255 = 230, 0.2 * 255 = 51 */
}
.backwardpropcolor_params {
  color: rgb(
    247,
    224,
    89
  ); /* 0.97 * 255 = 247, 0.88 * 255 = 224, 0.35 * 255 = 89 */
}

/* Query, key, and value colors */
.query_color {
  color: rgb(
    240,
    186,
    63
  ); /* 0.94 * 255 = 240, 0.73 * 255 = 186, 0.247 * 255 = 63 */
}
.key_color {
  color: rgb(
    186,
    58,
    121
  ); /* 0.73 * 255 = 186, 0.23 * 255 = 58, 0.474 * 255 = 121 */
}
.value_color {
  color: rgb(
    74,
    165,
    157
  ); /* 0.29 * 255 = 74, 0.647 * 255 = 165, 0.615 * 255 = 157 */
}

/* Bright versions of query, key, and value colors */
.query_color_bright {
  color: rgb(
    26,
    237,
    114
  ); /* 0.1 * 255 = 26, 0.93 * 255 = 237, 0.447 * 255 = 114 */
}
.key_color_bright {
  color: rgb(
    237,
    110,
    172
  ); /* 0.93 * 255 = 237, 0.43 * 255 = 110, 0.674 * 255 = 172 */
}
.value_color_bright {
  color: rgb(
    124,
    216,
    208
  ); /* 0.49 * 255 = 124, 0.847 * 255 = 216, 0.815 * 255 = 208 */
}

/* Cross attention color */
.cross_attn_color {
  color: rgb(168, 168, 168); /* 0.66 * 255 = 168 */
}

.color-pretrained { color: rgb(0, 204, 51); }  /* pretrained_color */
.color-adapted { color: rgb(204, 0, 51); }     /* adapted_color */
.color-both { color: rgb(25, 25, 204); }       /* both_color */