.ops-xxx {
    color: #000000;
    background-color: #FFCCFF;
    border-color: #FFCCFF;
  }


  .ops-icon-container {
    width: 75px;
    height: 75px;
    background-color: #f8f9fa; /* Bootstrap’in bg-light rengi */
    border-radius: 0.375rem; /* Bootstrap 'rounded' karşılığı */
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  .ops-icon-button {
    width: 75px;
    height: 75px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
  }
  
  .ops-icon-font-2 {
    font-size: 2.5rem;
  }

  .ops-icon-font-1 {
    font-size: 1.5rem;
  }
  


  .ops-75px {
    width: 75px;
    height: 75px;
  }
  .ops-50px {
    width: 50px;
    height: 50px;
  }

  .ops-evapp-btn {
    color: lightseagreen;              /* Normal yazı rengi */
    border: 1px solid lightseagreen;   /* Normal çerçeve rengi */
    transition: all 0.2s ease;
  }
  
  .ops-evapp-btn:hover {
    background-color: lightseagreen;   /* Hover arka plan */
    color: #ffffff;              /* Hover yazı rengi */
    border-color: lightseagreen;       /* Hover çerçeve rengi */
  }
  
  .ops-evapp-btn:active,
  .ops-evapp-btn:focus {
    background-color: #004085;   /* Aktif arka plan */
    color: #ffffff;              /* Aktif yazı rengi */
    border-color: #002752;       /* Aktif çerçeve rengi */
    box-shadow: none;
  }
  

  .ops-text {
    color: lightseagreen; /* Örnek: kırmızımsı renk */
  }
  
  .ops-text-light:hover {
    color: #ffffff;; /* Örnek: kırmızımsı renk */
  }

  .ops-app-text {
    color: lightseagreen; /* Normal */
    transition: color 0.2s ease;
  }
  
  .ops-evapp-text:hover {
    color: #6610f2; /* Hover rengi 6610f2 */
  }
  
  .ops-evapp-text:active {
    color: #198754; /* Aktif tıklama rengi */
  }