/* Basic Alert Container */
.custom-alert {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    margin: 10px auto;
    max-width: 600px;
    border-radius: 6px;
    font-family: sans-serif;
    color: white;
    z-index: 9999;
    position: fixed;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    box-shadow: 0 4px 8px rgba(0,0,0,0.15);
    animation: slideDown 0.4s ease-out;
  }
  
  /* Color Variants */
  .custom-alert.red { background-color: #e74c3c; }
  .custom-alert.green { background-color: #2ecc71; }
  .custom-alert.blue { background-color: #3498db; }
  .custom-alert.yellow { background-color: #f1c40f; color: #222; }
  
  /* "Go to Top" Button */
  .custom-alert .go-top {
    background: transparent;
    border: none;
    color: inherit;
    font-size: 18px;
    cursor: pointer;
    margin-left: 10px;
    transition: transform 0.2s;
  }
  .custom-alert .go-top:hover {
    transform: scale(1.2);
  }
  
  /* Animation */
  @keyframes slideDown {
    from { opacity: 0; top: 0px; }
    to { opacity: 1; top: 20px; }
  }
  
  /* Responsive (optional, looks good on mobile) */
  @media (max-width: 500px) {
    .custom-alert {
      max-width: 90%;
      font-size: 14px;
    }
  }