@media (prefers-color-scheme: dark) {
  body,
  [data-theme="dark"] {
    /*dark*/
    color-scheme: dark;
    --fgColor-default: #e6edf3;
    --fgColor-muted: #8d96a0;
    --fgColor-accent: #A2BFE6;
    --bgColor-default: #0d1117;
    --bgColor-muted: #161b22;
    --bgColor-neutral-muted: #6e768166;
    }
}

@media (prefers-color-scheme: light) {
  body,
  [data-theme="light"] {
    /*light*/
    color-scheme: light;
    --fgColor-default: #1f2328;
    --fgColor-muted: #636c76;
    --fgColor-accent: #A2BFE6;
    --bgColor-default: #ffffff;
    --bgColor-muted: #f6f8fa;
  }
}

html, body{
    margin: 0;
    background-color: var(--bgColor-default);
    color: var(--fgColor-default);
}

.container{
    margin-bottom: 15px;
    margin-top: 15px;
    display: flex;
    justify-content: center; /* Center horizontally */
    align-items: center; /* Center vertically */
}

.markdown-body h2 a {
    color: var(--fgColor-default) !important;
}
.markdown-body h2 a:hover {
    color: var(--fgColor-accent) !important;
}

.brdr{
    border: solid;
    border-width: 2px;
}

#jumbodiv{
    align-items: center;
}

#jumbo{
    align-self: center;
    max-height: 50vh;
    height: auto;
    width: 80vw;
}

.lazyload{
    object-fit: contain;
    cursor: zoom-in;
    transition: box-shadow 0.2s;
}

#image-viewer {
    display: none;
    position: fixed;
    z-index: 999;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background-color: rgba(0, 0, 0, 0.85);
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

#full-image {
    max-width: 90%;
    max-height: 90%;
    transition: transform 0.3s ease, transform-origin 0.3s ease;
    transform-origin: center center;
    cursor: zoom-in;
}

#full-image-caption {
    position: absolute;
    bottom: 20px;
    transition: transform 0.3s ease, transform-origin 0.3s ease;
    z-index: 1000;
    background: rgba(0,0,0,0.4);
    color: white;
}

#close-btn {
    position: absolute;
    top: 20px;
    right: 30px;
    color: white;
    font-size: 40px;
    font-weight: bold;
    cursor: pointer;
    user-select: none;
    z-index: 1000;
    background: rgba(0,0,0,0.4);
    padding: 8px 14px;
    border-radius: 8px;
}