.MuiStack-root.watermark {
    visibility: hidden !important;
}
.MuiStack-root.watermark::before {
    content: "Multivac can make mistakes. Consider checking important information.";
    font-size: x-small;
    color:gray;
    visibility: visible !important;
    /* Other CSS styles for the pseudo-element */
}

/* google pill */
.container {  align-items: center;  border-radius: 8px;  display: flex;  font-family: Google Sans, Roboto, sans-serif;  font-size: 14px;  line-height: 20px;  padding: 8px 12px;}.chip {  display: inline-block;  border: solid 1px;  border-radius: 16px;  min-width: 14px;  padding: 5px 16px;  text-align: center;  user-select: none;  margin: 0 8px;  -webkit-tap-highlight-color: transparent;}.carousel {  overflow: auto;  scrollbar-width: none;  white-space: nowrap;  margin-right: -12px;}.headline {  display: flex;  margin-right: 4px;}.gradient-container {  position: relative;}.gradient {  position: absolute;  transform: translate(3px, -9px);  height: 36px;  width: 9px;}@media (prefers-color-scheme: light) {  .container {    background-color: #fafafa;    box-shadow: 0 0 0 1px #0000000f;  }  .headline-label {    color: #1f1f1f;  }  .chip {    background-color: #ffffff;    border-color: #d2d2d2;    color: #5e5e5e;    text-decoration: none;  }  .chip:hover {    background-color: #f2f2f2;  }  .chip:focus {    background-color: #f2f2f2;  }  .chip:active {    background-color: #d8d8d8;    border-color: #b6b6b6;  }  .logo-dark {    display: none;  }  .gradient {    background: linear-gradient(90deg, #fafafa 15%, #fafafa00 100%);  }}@media (prefers-color-scheme: dark) {  .container {    background-color: #1f1f1f;    box-shadow: 0 0 0 1px #ffffff26;  }  .headline-label {    color: #fff;  }  .chip {    background-color: #2c2c2c;    border-color: #3c4043;    color: #fff;    text-decoration: none;  }  .chip:hover {    background-color: #353536;  }  .chip:focus {    background-color: #353536;  }  .chip:active {    background-color: #464849;    border-color: #53575b;  }  .logo-light {    display: none;  }  .gradient {    background: linear-gradient(90deg, #1f1f1f 15%, #1f1f1f00 100%);  }}

/* Spinner styles */

/* Initially hide the completed message */
.completed {
    display: none;
}

/* When the container has 'show-complete' class:
   - Hide the spinner
   - Show the completed message */
.show-complete .spinner {
    display: none;
}

.show-complete .completed {
    display: inline;
}

/* Spinner styles */
.spinner {
    /* Spinner visual */
    border: 4px solid rgba(0, 0, 0, 0.1);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border-left-color: #09f;
    animation: spin 1s linear infinite;
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

/* Completed message styling */
.completed {
    color: green;
    font-weight: bold;
}

/* Error message styling */
.completed[style*="color: red;"] {
    color: red;
}

/* General container styling */
.container {
    margin: 10px 0; /* Uniform margin for all containers */
    padding: 10px; /* Uniform padding */
    border: 1px solid #ddd; /* Consistent border color */
    border-radius: 5px; /* Uniform border radius */
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); /* Subtle shadow for all containers */
    text-align: center; /* Center text content where applicable */
}

/* Specific container variations */
.task-container, .image-container, .pdf-container {
    max-width: 100%; /* Ensure containers do not overflow their parent */
}

/* Task-specific container adjustments */
.task-container {
    display: flex;
    align-items: center;
    background-color: #f9f9f9; /* Subtle background color */
}

/* Image container specific styles */
.image-container {
    display: inline-block; /* Display images in a row if space permits */
}

/* Image styling */
.image-container img, .pdf-container iframe {
    max-width: 100%; /* Ensure responsive behavior */
    height: auto; /* Maintain aspect ratio */
    border-radius: 5px; /* Rounded corners for all media */
    border: 1px solid #ccc; /* Consistent border for images and PDFs */
}

/* Caption styling for both images and PDFs */
.caption, .pdf-caption {
    margin-top: 8px;
    font-size: 14px;
    color: #555; /* Subtle caption color */
}

/* PDF container specific styling */
.pdf-container iframe {
    max-width: 600px; /* Control the default size */
    max-height: 600px; /* Control the default size */
}

/* Hyperlink styling for PDF caption */
.pdf-caption a, .caption a {
    text-decoration: none;
    color: #0066cc; /* Consistent theme color */
}
.pdf-caption a:hover, .caption a:hover {
    text-decoration: underline;
}

/* Heading styling */
h2 {
    font-size: 24px;
    color: #333;
    margin-bottom: 20px;
    text-align: center;
}