/* css/common-feedback-message.css */

/* ==========================================================================
   Animation Helpers
   ========================================================================== */

.form-js-animated-height {
    overflow: hidden;
    opacity: 0;
    height: 0;
    display: none;
    margin: 0;
    padding: 0;
}

.form-js-animated-height.visible-prep {
    display: block !important;
    opacity: 0;
    height: 0;
}

.form-js-animated-height.visible {
    opacity: 1;
    height: auto;
    display: block;
}


/* ==========================================================================
   Main Component Structure & Layout
   ========================================================================== */

.form-feedback-message {
    font-size: 17px;
    text-align: center;
    position: relative;
    margin-top: 25px;
    padding-top: 5px;
    padding-bottom: 5px;
}

.form-feedback-message .loading-spinner {
    display: none;
    padding: 5px 0;
}


/* ==========================================================================
   Global Component Styles (Spinners, Text, etc.)
   ========================================================================== */

/* Spinner Icon */
.daluna-loading-spinner i {
    font-size: 20px;
    color: #b05cfd;
}

/* --- FIX START: Make all text elements self-contained and consistent --- */
/* This ensures the clone and the original render identically, fixing the animation jump. */
.form-feedback-message .feedback-text-content,
.feedback-secondary-notice p {
    font-weight: 400;
    line-height: 1.5;
}
/* --- FIX END --- */

/* Primary Feedback Messages (Simple Text Color for Main Forms) */
.form-feedback-message.form-feedback-success .feedback-text-content {
    color: green;
}
.form-feedback-message.form-feedback-error .feedback-text-content {
    color: red;
}
.form-feedback-message.form-feedback-warning .feedback-text-content {
    color: #ffa500;
}


/* Secondary Notice Text (e.g., login attempts) */
.channel-table-popup-container .common-popup-content .feedback-secondary-notice,
.feedback-secondary-notice {
    font-size: 17px;
    text-align: center;
    margin-top: 12px;
}

.channel-table-popup-container .common-popup-content .feedback-secondary-notice p,
.feedback-secondary-notice p {
    margin: 0;
    padding: 0;
    color: #6c757d; /* Default neutral grey color */
	text-align: center;
}

/* Error state for the secondary notice */
.feedback-secondary-notice p.is-error {
    color: red;
}


/* ==========================================================================
   Popup-Specific Style Overrides
   ========================================================================== */
/* These rules have high specificity to override the global styles
   and restore the original plain-text appearance inside popups. */

.popup-result-container.form-feedback-animation-wrapper .form-feedback-message {
    margin-top: 26px;
}

.popup-result-container .form-feedback-message .feedback-text-content,
.feedback-text-content {
    padding: 0;
    margin: 0;
    font-weight: normal; /* This is equivalent to font-weight: 400 */
    border: none;
    background-color: transparent;
    font-size: 17px;
    text-align: center;
}

/* Override the text color for popups */
.popup-result-container .form-feedback-message.form-feedback-success .feedback-text-content {
    color: green;
}
.popup-result-container .form-feedback-message.form-feedback-error .feedback-text-content {
    color: red;
}
.popup-result-container .form-feedback-message.form-feedback-warning .feedback-text-content,
.popup-result-container .form-feedback-message.form-feedback-info .feedback-text-content {
    color: #777;
}

/* Restore original secondary notice style for popups */
.popup-result-container .feedback-secondary-notice {
    font-size: 17px;
    text-align: center;
    margin-top: 12px;
}
.popup-result-container .feedback-secondary-notice p,
.popup-result-container .feedback-secondary-notice p.is-error {
    margin: 0;
    padding: 0;
    color: #777; /* Always neutral grey in popups */
}