/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *



 */
 
/* .btn-primary {
  background-color: #b663b4 ;
  border-color: #b663b4 ;
} */


/* .btn-primary:active, .btn-primary:focus, .btn-primary:hover {
  background-color: #9c499b !important ;
  border-color: #9c499b !important;
} */

/* * {
  overflow-wrap: anywhere;
} */

/* badge if it doesnt work */
.text-bg-danger {
background-color: #ffcccc !important ;
color: #660000 !important ;
}


 .text-bg-warning{
  background-color:  #ffe6cc !important ;
  color:   black !important 
 }
 .text-bg-success{
  background-color: #d3f8d3 !important ;
  color: #0e580e !important 
 }
.text-bg-secondary{
  background-color:  #e6e6e6 !important ;
  color: #4d4d4d !important 
} 

.dropdown-menu {
  min-width: 5rem; /* Reduce from default Bootstrap's 10rem to your preference */
  max-width: 15rem; /* Optional, if you want to set a max width */
}

@keyframes spin {
  from {
      transform: rotate(0deg);
  }
  to {
      transform: rotate(360deg);
  }
}

#loader{
  animation: spin 2s linear infinite;

}

#editLoader{
  animation: spin 2s linear infinite;

}

#multieditLoader{
  animation: spin 2s linear infinite;

}

#noteLoader{
  animation: spin 2s linear infinite;

}

.toggler {
  border: 1.25px solid #d1d1d6 ;
  border-radius: 50px;
  margin-right: 10px;
  padding: 3px 0px;
  background-color: #e5e5ea;
  

}


 /* .toggled {
  border: 0px solid #e5e5ea;
  border-radius: 50px;
  background-color: white;
  color: #BE76BD !important;
  padding: 3px 0px;
}  */

/* this works on iphone */
.toggled {
  border: 0px solid #e5e5ea;
  border-radius: 50px;
  background-color: white;
  padding: 2px 0px 2.5px 0px;
}

.ticker-container {


  width: 100%;

  overflow: hidden;


  }

  .ticker{
    animation: ticker 35s linear infinite;
    display: flex;
    padding-right: 2840 px;
  }
  

  
  .ticker-item {
  
  width: 320px;
  
  border-top: 1px solid #dee2e6;

  border-bottom: 1px solid #dee2e6;

  padding: 8px;

  margin: 0px 15px;
  
  }
  
  
  
  @keyframes ticker {
    0% {
      transform: translateX(100%); /* Start from outside the right edge */
    }
    100% {
      transform: translateX(-3000px); /* Move to outside the left edge */
    }
  }