.mingcute--contacts-3-fill {
  display: inline-block;
  width: 3em;
  height: 3em;
  --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath d='m12.594 23.258l-.012.002l-.071.035l-.02.004l-.014-.004l-.071-.036q-.016-.004-.024.006l-.004.01l-.017.428l.005.02l.01.013l.104.074l.015.004l.012-.004l.104-.074l.012-.016l.004-.017l-.017-.427q-.004-.016-.016-.018m.264-.113l-.014.002l-.184.093l-.01.01l-.003.011l.018.43l.005.012l.008.008l.201.092q.019.005.029-.008l.004-.014l-.034-.614q-.005-.019-.02-.022m-.715.002a.02.02 0 0 0-.027.006l-.006.014l-.034.614q.001.018.017.024l.015-.002l.201-.093l.01-.008l.003-.011l.018-.43l-.003-.012l-.01-.01z'/%3E%3Cpath fill='%23000' d='M16 3a2 2 0 0 1 1.995 1.85L18 5v14a2 2 0 0 1-1.85 1.995L16 21H6a2 2 0 0 1-1.995-1.85L4 19V5a2 2 0 0 1 1.85-1.995L6 3zm-5 10c-.841 0-1.74.137-2.469.461C7.837 13.77 7 14.404 7 15.5a1 1 0 0 0 1.992.13L9 15.515l.05-.051a1.2 1.2 0 0 1 .294-.175C9.74 15.113 10.34 15 11 15s1.26.113 1.656.289q.163.075.246.137l.047.038l.051.051a1 1 0 0 0 2-.015c0-1.096-.837-1.73-1.531-2.039C12.74 13.137 11.84 13 11 13m0-5a2 2 0 1 0 0 4a2 2 0 0 0 0-4m8.974 11.063l-.974.324V4.613l.974.324A1.5 1.5 0 0 1 21 6.36v11.28a1.5 1.5 0 0 1-1.026 1.423'/%3E%3C/g%3E%3C/svg%3E");
  background-color: #008efb;
  -webkit-mask-image: var(--svg);
  mask-image: var(--svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

.header-top{
  padding: 1em 0 !important;
}
  .logo, .auth-logo{
    display: flex;
    align-items: center;
  }

  .logo h1, .auth-logo h1 {
    margin-bottom: 0 !important;
    margin-left: 0.3em !important;
    font-size: xx-large !important;     
    margin-top: 0.125em;
  }

  .nav-link{
    color:  var(--bs-heading-color) !important;
  }

  .main-navbar{
    display: none;
  }

.n_a {
  color: var(--bs-gray-500);
}

[data-bs-theme="dark"] .n_a {
  color: var(--bs-gray-700);
}

html[data-bs-theme="dark"] ::placeholder {
  color: var(--bs-gray-700) !important; /* Cambia a tu color deseado */
}

  /* [data-bs-theme="dark"] .logo h1,[data-bs-theme="dark"] .auth-logo h1{
    color: #435ebe !important;
  } */


#auth #auth-left{
    padding: 3rem !important;
}

body {
  width: 100% !important;
}

/* Contactos */

.card-contact{
  display: flex;
  flex-direction: column !important;
  justify-content: space-between; 
  padding: 1em !important;  
  margin-bottom: 2em !important;
}

.contact-icon {
  font-size: 3.5rem !important;
}

.card-contact .card-header {
  display: flex;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between;   
  padding: 0 !important;
  height: 4em !important;
}

.card-header{
  z-index: 1;
}

.card-contact .card-body {
  padding: 0 !important;  
}

#addContact, #createList{
  float: right;
  margin-top: 0.75em;
}

/* Listas */

.card-list{
  display: flex;
  flex-direction: column !important;
  justify-content: space-between; 
  padding: 1em !important;
}

.card-list .card-header {
  display: flex;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between;   
  padding: 0 !important;
  height: 4em !important;
}

.card-list .card-body {
  padding: 0 !important;  
}

nav .breadcrumb{
  margin-bottom: 0px !important;
  padding-left: 0.25em !important;
}

.share-list{
  color: #008efb !important;
  border-color: #008efb !important;
}

.share-list:hover{
  color: #fff !important;
  border-color: #008efb !important;
  background-color: #008efb !important;
}

#topbarUserDropdown:after{
  margin-left: 0px !important;
}

.avatar-content {
  padding-top: 0.125em;
}

.icon-btn {
  margin-right: 0.25em;
}

.avatar-initials {
  width: 2em;
  height: 2em;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--bs-primary);
  color: white;
  font-size: 3.75rem;
  font-weight: bold;
  border-radius: 50%;
}
.avatar {
  cursor: pointer;
  transition: opacity 0.2s;
}

.avatar img {
  object-fit: cover !important;
  overflow: hidden !important;
}

.avatar:hover {
  opacity: 0.8;
}

@media screen and (max-width: 1200px) {
    #auth #auth-left {
        padding: 2rem !important;
    }

    
    .mingcute--contacts-3-fill {
      width: 3em;
      height: 3em;
    }

    .navbar {
      padding-left: 0 !important;
      padding-right: 0 !important;
    }

    #nav-web{
      display: none !important;
    }

    .card-contact, .card-list{      
      margin-bottom: 1em !important;
    }
    
    #breadcrumbsMobile {
      display: block !important;
      margin-bottom: 0.5em;
    }

    #breadcrumbsWeb {
      display: none;
    }

    #logoTexto {
      display: none;
    }

    .header-top{
      padding-top: 0.5em !important;
      padding-bottom: 0.5em !important;
    }

    #addContact, #createList{
      margin-top: 0em;
    }

    .text-btn{
      display: none;
    }


    
}