/* 
  Flash message styles for success and error feedback after form submission. 
  The .flash-message class provides common styling, while .flash-success and 
  .flash-error apply specific colors and borders based on the message type.
*/
.flash-message {
    position: fixed;
    top: 20px;
    right: 20px;
    right: 20px;
    z-index: 1000;
    width: calc(50% - 40px);
    max-width: none;
    padding: 18px 24px;
    border-radius: 10px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
    font-weight: 600;
    font-size: 16px;
    line-height: 1.4;
    box-sizing: border-box;
}

.flash-success {
    color: var(--success-color);
    background-color: var(--bg-success);
    border: 1px solid var(--success-color);
}

.flash-error {
    color: var(--error-color);
    background-color: var(--bg-error);
    border: 1px solid var(--error-color);
}