/* Add some basic styling here later if you want! */
body { font-family: sans-serif; text-align: center; }
textarea { width: 80%; height: 100px; margin-top: 10px; }
button { padding: 10px 20px; margin: 5px; cursor: pointer; }
#answer-container { margin: 20px auto; width: 80%; text-align: left; background-color: #f0f0f0; padding: 15px; border-radius: 8px; }
.hidden { display: none; }

#questionInput {
    height: 100px; /* You can adjust this value to make it taller or shorter */
    padding: 10px;
    font-size: 16px;
    line-height: 1.5;
    resize: vertical; /* Allows the user to drag the box to make it taller */
    font-family: sans-serif; /* Ensures the font matches the rest of the page */
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box; /* Important for consistent sizing */
}

/* --- Add this for a subtle pulsing animation --- */
@keyframes pulse {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.03);
  }
  100% {
    transform: scale(1);
  }
}

.sponsorship-banner img {
    animation: pulse 5s infinite ease-in-out; /* Applies the animation */
}

/* --- Style for the banner IMAGE --- */
.sponsorship-banner img {
    height: 50px; /* Controls the height of your banner image */
    width: auto;  /* Automatically adjusts the width to maintain aspect ratio */
    margin-right: 15px; /* Adds some space between the image and text */
}

/* --- Version Number Styles --- */
.version {
    position: fixed;
    bottom: 5px;
    left: 10px;
    font-size: 12px;
    color: #6c757d; /* A neutral grey color */
    font-family: sans-serif;
    z-index: 1001; /* Ensures it's on top of the banner */
}

/* --- Changelog Page Styles --- */
.changelog-entry {
    background-color: #ffffff;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 20px;
    border: 1px solid #e0e0e0;
}

.changelog-entry h2 {
    margin-top: 0;
    border-bottom: 1px solid #eee;
    padding-bottom: 10px;
}

.changelog-entry ul {
    padding-left: 20px;
}

.changelog-entry li {
    margin-bottom: 10px;
}

.back-link {
    display: inline-block;
    margin-top: 20px;
    color: #007bff;
    text-decoration: none;
    font-weight: bold;
}

.back-link:hover {
    text-decoration: underline;
}

/* Style for the changelog link in the footer */
.version a {
    color: #007bff;
    text-decoration: none;
}

.version a:hover {
    text-decoration: underline;
}