<!-- Dropdown search -->
      <div class="suma-state-options">
      <div class="option"><div class="information">
      <div class="information-image active-bg">
      <img src="/assets/icons/photo.svg" alt="">
      <span>
      <img src="/assets/icons/blue_rounded_client.svg" alt="">
      </span>
      </div>
      <div class="information-text"><p>Test Company</p>
      <p>TI </p></div></div><div class="state">
      <button class="suma-rounded-btn-orange snack">Pendiente</button>
      </div>
      </div>
      <div class="option">
      <div class="information">
      <div class="information-image">
      <img src="/assets/icons/photo.svg" alt="">
      <span> <img src="/assets/icons/blue_rounded_client.svg" alt=""></span>
      </div>
      <div class="information-text"><p>Client Company</p><p>TI </p>
      </div>
      </div>
      <div class="state">
      <button class="suma-rounded-btn-purple snack">Seguir</button>
      </div>
      </div>
      <div class="option">
      <div class="information">
      <div class="information-image">
      <img src="/assets/icons/photo.svg" alt=""><span> <img src="/assets/icons/purple_rounded_provider.svg" alt="">
      </span>
      </div>
      <div class="information-text"><p>Provider Company  </p><p>TI </p></div></div><div class="state">
      <button class="suma-rounded-btn-green snack checkmark"><img src="/assets/icons/green_checkmark.svg" alt="">
      </button>
      </div>
      </div>
      <button class="options-btn">Ver Todo</button>
      </div>
      
            

                

      <!-- Dropdown profile settings -->


<button class= "suma-btn btn bg-color-primary-cian"
popovertarget="message"
popovertargetaction="toggle">
<p>{{userName}}</p>
</button>


<div id="message" popover class="popover-bottom">

      <div class="suma-profile-settings">
      <div class="suma-profile-settings-header">
      <div class="profile">
      <div class="profile-photo">
      <img src="/assets/logos/logo_without_background.svg" alt=""></div><div class="profile-name">
      <p>User Name</p><p>Ver mi perfil</p>
      </div>
      </div>
      <div class="header-actions">
      <div class="change-role-btn">
      <img class="logo" src="/assets/icons/black_bancolombia.svg">
      <div class="main-btn">
      <i class="icon icon-icons-Suma02 ic-4"></i>

      </div>
      </div>
      <button class="dropdown-btn">
      <i class="icon icon-icons-Suma02 ic-6"></i>

      </button>
      </div>
      </div>

      <div class="suma-profile-settings-body">

      <button class="suma-btn-white">
      <i class="icon icon-icons-icono-suma-blanco ic-4 color-secondary-dry-grey" ></i>
        <p ">Intercambiar</p>
      </button>

    <div class="suma-dropdown-perfil-cian">


      <li class="suma-li-link">
      <i class="icon icon-ic-v1-blue_clock ic-5 "></i>
      <a href="" ><span class="color-primary-cian">Horarios</a>
      </li>

      <li class="suma-li-link">
      <i class="icon icon icon-ic-v1-blue_gear ic-5 "></i>
      <a href="" ><span class="color-primary-cian">Configuración</a>
      </li>

      <li class="suma-li-link">
      <i class="icon icon-ic-v1-blue_floater ic-5 "></i>
      <a href="" ><span class="color-primary-cian">Ayuda</a>
      </li>

    </div>
  </div>

  <div class="suma-dropdown-perfil-grey">

      <li class="suma-li-link bold">
      <i class="icon icon-ic-v1-blue_gear color-secondary-dark-grey ic-5 "></i>
      <a href="" >Guardado</a>
      </li>

      <li class="suma-li-link bold">
      <i class="icon icon-icons-utilities-dashboard-Icon_VinculosON ic-5 color-secondary-dark-grey "></i>
      <a href="">Grupos</a>
      </li>

      <li class="suma-li-link bold">
      <i class="icon icon-ic-v1-blue_clock ic-5 color-secondary-dark-grey "></i>
      <a href="" >Eventos</a>
      </li>

      <li class="suma-li-link bold">
      <i class="icon icon-ic-v1-blue_clock ic-5 "></i>
      <a href=""><span class="color-secondary-dark-grey">Contactos</a>
      </li>

  </div>

      <div class="suma-profile-settings-footer">
      <button class="logout-btn">Cerrar sesión
      <i class="icon icon-icons-utilities-dashboard-Icon-CompartirMuro ic-4"></i>
      </button>
      </div>

      </div>

      
            

                
      <div class="suma-card">
      <div class="card-title">
          <p class="color-primary-indigo">Vinculos</p>
      </div>
      <div class="card-content-row">
          <div class="profile-item-col">
              <div class="profile-media-container">
                  <div class="profile-picture">
                      <!-- Medium-sized image -->
                      <div class="suma-img-circle-medium">
                          <img src="assets/ic-v1/photo.svg">
                      </div>
                      <div class="profile-icon">
                          <!-- Round button with icon -->
                          <button class="suma-btn-circle-sm  bg-color-purple-low-3 color-purple-high-3">
                              <i class="icon icon-ic-v1-grey_home white_normal ic-6"></i>
                          </button>
                      </div>
                  </div>
              </div>

              <div class="profile-label-container">
                  <p class="profile-name">Profile Name</p>
                  <p class="profile-description color-secondary-dry-grey">Description</p>
              </div>
          </div>
          <div class="profile-item-col">
              <div class="profile-media-container">
                  <div class="profile-picture">
                      <!-- Medium-sized image -->
                      <div class="suma-img-circle-medium suma-border-decoration">
                          <img src="assets/ic-v1/photo.svg">
                      </div>
                      <div class="profile-icon">
                          <!-- Round button with icon -->
                          <button class="suma-btn-circle-sm  bg-color-blue-low-3 color-blue-high-3">
                              <i class="icon icon-ic-v1-grey_home white_normal ic-6"></i>
                          </button>
                      </div>
                  </div>
              </div>

              <div class="profile-label-container">
                  <p class="profile-name">Profile Name</p>
                  <p class="profile-description color-secondary-dry-grey">Description</p>
              </div>
          </div>
      </div>
      <div class="card-action">
          <div class="btn-simple">
              <i class="icon-ic-v1-blue_circle_view"></i>
              <p>Ver más</p>
          </div>
      </div>
  </div>
      
            

                
      <div class="suma-card">
    <div class="card-content-row post-actions-container">
        <div class="suma-img-circle-small suma-border-decoration">
            <img src="assets/ic-v1/photo.svg">
        </div>
        <input class="suma-input-gray" type="text" placeholder="¿Que esta pasando?">
    </div>
    <div class="card-content-row post-actions-container">
        <div class="post-actions-buttons-container">
            <div class="btn-icon-simple">
                <i class="fi fi-rr-angle-circle-down color-secondary-purple"></i>
                <span>Ver más</span>
            </div>
            <div class="btn-icon-simple">
                <i class="fi fi-rr-angle-circle-down color-secondary-purple"></i>
                <span>Ver más</span>
            </div>
            <div class="btn-icon-simple">
                <i class="fi fi-rr-angle-circle-down color-secondary-purple"></i>
                <span>Ver más</span>
            </div>
            <div class="btn-icon-simple">
                <i class="fi fi-rr-angle-circle-down color-secondary-purple"></i>
                <span>Ver más</span>
            </div>
        </div>
        
            <button class="suma-btn publish-btn bg-color-purple"><span>Publicar</span></button>
    </div>
</div>