.card {
    min-height: 200px;
}

#sidenavHeading {
    font-size: 1.2rem;
}

/* Remove spinner arrows for all browsers */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
input[type=number] {
    -moz-appearance: textfield;
}

.debug-info {
    font-size: 0.625rem;
    color: #666666;
}

.reinforcementImage {
    width: auto;
    height: auto;
    max-height: 30vh;
    max-width: 100%
}

#answer img {
    max-width: 100%;
    max-height: 500px;
    height: auto;
    object-fit: contain;
    display: block;
}

#question img {
    max-width: 100%;
    max-height: 500px;
    height: auto;
    object-fit: contain;
    display: block;
}

.alert-ivory {
    background-color: #FFFFF0; /* Ivory */
    border-color: #e0e0d1;     /* A slightly darker beige for the border */
    color: #383838;            /* A dark gray for readability */
}

/*
 * Fix for code blocks in GPT explanations
 */
#explanation pre {
    background-color: #272822; /* This is the dark background from the Okaidia theme */
    color: #f8f8f2;            /* Light text color for contrast */
    padding: 1em;
    border-radius: 0.3em;
    overflow: auto;
}

/* Fix for inline code snippets as well */
#explanation :not(pre) > code {
    background-color: #eee;
    padding: .2em .4em;
    border-radius: .3em;
    color: #c7254e;
}