/* -------------------------------------------START---------------------------------------------------*/
/* Global error handlers and success/error displays for form submissions                              */
/* ---------------------------------------------------------------------------------------------------*/

.message-container {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.message-display {
    display: none; /* Hidden by default */
    color: #FFCC33;
    font-family: 'Averia Serif Libre', serif;
    font-size: calc(10px + (16 - 10) * ((100vw - 300px) / (1600 - 300)));
    padding: 1em;
    margin: 1em;
    border-radius: 4px;
    background-color: #E0E0E0;
    opacity: 1;
    z-index: 1003; /* Make sure it's above the overlay */
}

/* Success, error, and warning styles */
.message-display.success {
    display: block !important;
    background-color: #d4edda !important;
    color: #446344;
    border: 1px solid #c3e6cb;
    text-align: center;
}

.message-display.error {
    display: block !important;
    background-color: #f8d7da !important;
    color: #721c24;
    border: 1px solid #f5c6cb;
    text-align: center;
}

.message-display.warning {
    display: block !important;
    background-color: #fff3cd !important;
    color: #856404;
    border: 1px solid #ffeeba;
    text-align: center;
}

@keyframes colorAlternate {
    0%, 100% { color: #A3C586; }
    50% { color: #FFCC33; }
}

.message-display-progress-indicator {
    animation: colorAlternate 2s infinite;
    font-family: 'Averia Serif Libre', serif;
    font-size: calc(10px + (16 - 10) * ((100vw - 300px) / (1600 - 300)));
    font-weight: 600;
    z-index: 1004;
}

.admonition {
    font-family: 'Karma', sans-serif;
    font-weight: 600;
    font-size: calc(10px + (16 - 10) * ((100vw - 300px) / (1600 - 300)));
    background-color: rgba(228, 255, 188, 0.7); /* Soft green background */
    color: #446344; /* Muted green text */
    border: 1px solid #B6D7A8; /* Light green border */
    border-color: rgba(228, 255, 188, 0.7);
    padding: 1em !important;
    margin: 2em !important;
    border-radius: 4px; /* Rounded corners */
    max-width: calc(250px + (400 - 250) * ((100vw - 300px) / (1600 - 300))) !important;
    text-align: center;
}

.admonition.show { display: block; }
.admonition.hide { display: none; }

.help-button {
    background-image: url('https://theworldcanbeyours.com/staging/wp-content/uploads/2024/10/yellow-question-mark-100.png') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    height: 50px !important;
    width: 50px !important;
}

/* --------------------------------------------END----------------------------------------------------*/
/* Global error handlers and success/error displays for form submissions                              */
/* ---------------------------------------------------------------------------------------------------*/

/* Remaining CSS unchanged */
.spacer {
    width: 100%;
    display: block;
}

.spacer img {
    width: 100%;
    height: auto;
    display: block;
}

.logged-in-user-info {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.user-links {
    text-align: center;
    margin-top: 5px;
}

.username-logout {
    margin: 0;
}

.logout-link {
    margin-left: 5px;
}

#logged-in-user-avatar {
    border-radius: 50%;
    object-fit: cover;
    width: 60px;
    height: 60px;
}

.user-login {
    text-align: center;
    font-family: 'Averia Serif Libre', serif !important;
    font-size: calc(14px + (20 - 14) * ((100vw - 300px) / (1600 - 300))) !important;
    color: #0275BD;
    text-decoration: underline;
}

.user-login:hover {
    color: var(--e-global-color-7620581) !important;
}

.logged-in-user-info .user-links,
.logged-in-user-info .user-links *,
.open-previous-page-link {
    text-align: center;
    font-family: 'Averia Serif Libre', serif !important;
    font-size: calc(11px + (16 - 11) * ((100vw - 300px) / (1600 - 300))) !important;
    font-weight: 400;
}

.logged-in-user-info .user-links a,
.open-previous-page-link a {
    color: #0275BD;
}

.logged-in-user-info .user-links a:hover,
.open-previous-page-link a:hover {
    color: var(--e-global-color-7620581) !important;
}

body:not(.logged-in) .wpd-sbs-toggle {
    display: none !important;
}

#site-logo img {
    height: calc(125px + (200 - 125) * ((100vw - 300px) / (1600 - 300))) !important;
    width: calc(125px + (200 - 125) * ((100vw - 300px) / (1600 - 300))) !important;
}