/* Basic reset for margin/padding (optional) */
    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }

      /*****************************
       * Header Bar
       *****************************/
      .header-bar {
        width: 100%;
        height: 100px;
        background: linear-gradient(to right, rgba(173, 182, 220, 0.0), rgba(71, 72, 158, 0.0));
/*        background: linear-gradient(to right, #adb6dc, #47489e); */
        display: flex;
        align-items: flex-end; /* Logo & text align to the bottom of the header */
        justify-content: space-between; /* Logo on left, text on right */
        padding: 0 20px; /* horizontal padding */
      }


      .header-bar img {
        /* Adjust logo size as needed */
        height: 68px;
        width: auto;
        bottom: 50%;           /* vertical center */
        /* By default, it sits on left because we used "justify-content: space-between" */
      }


      .user-info {
        color: #fff;
        margin-bottom: 10px; /* gap from bottom if you want it lower */
        font-family: sans-serif;
        text-align: right;
      }

      .user-info a {
        color: #fff;
        text-decoration: underline;
      }