/* styles.css */
/* Custom styles if needed, Bootstrap takes care of most of the responsiveness */
#math-field {
    height: auto;
    min-height: 100px;
    display: flex;
    align-items: center;
}

.mathquill-placeholder {
    color: grey; /* Ou la couleur hexadécimale spécifique que vous préférez, par exemple #808080 */
}


#result {
    border: 1px solid #aaa;
    padding: 10px;
    min-height: 50px;
    overflow-x: auto; /* Makes the content horizontally scrollable */
    word-wrap: break-word; /* Breaks long words to prevent overflow */
    color: grey; /* Black color for text */
    background-color: #fff; /* White background */
    border: 1px solid #aaa; /* Restoring border if it was removed */
}
/* Ajout de défilement horizontal à une colonne spécifique si nécessaire */
.column-scrollable {
    overflow-x: auto;
}

/* styles.css */
#functions-sidebar {
    overflow: auto;
}

/* Activation de l'enveloppement de mots pour les éléments LaTeX */
.mathjax-element {
    word-wrap: break-word;
    overflow-wrap: break-word;
}

/* styles.css */
#function-list span {
    flex: 1; /* Each span will take up equal space */
    text-align: center; /* Center the text within each span */
}

/* Placeholder styling for MathQuill */
.mathquill-placeholder .mq-empty {
    color: #ccc; /* Light grey color for placeholder text */
  }
  


  /* When displaying results, ensure the placeholder style is not applied */
  #result:not(.result-placeholder) {
    color: inherit;
  }

  /* CSS applied for screens less than 600px wide */
@media (max-width: 600px) {
    body {
        font-size: 14px; /* Smaller font size for mobile */
    }

    /* For MathQuill specifically */
    .mq-math-mode {
        font-size: 14px; /* Adjust MathQuill font size */
    }
}