.fa-clickable {
    cursor:pointer;
    outline:none;
}

fieldset {
    background-color: #eeeeee;
    margin-bottom: 5px;
  }

.searchpanezeropill {
  background-color: #fcfafa;
  color: #b1b1b1;
}

.select2, .select2-selection__rendered { line-height: calc(1.5em + 2px) !important; } 
.select2-container .select2-selection--single { height: calc(1.5em + 2px) !important; } 
.select2-selection__arrow { height: calc(1.5em + 2px) !important; }

.textsizerem {
  font-size: 1.5rem ;
}

/* Used to display spacing in org notes */
.orgnotestyle {
  white-space: pre-line
}

.topnav {
  overflow: hidden;
  background-color: #f1f1f1;
}
.topnav a {
  float: left;
  display: block;
  color: black;
  text-align: center;
  padding: 8px 10px;
  /* text-decoration: none; */
  font-size: 17px;
  border-bottom: 3px solid transparent;
}
.topnav a.active {
  border-bottom: 3px solid #192dd8;
  color: #192dd8;
}

.hiddendelete {
  display: none !important;
  cursor: none !important;
}

.analysthidden {
  display: none !important;
  cursor: none !important;
}
/* Green tick - Include */
.checkbox.error-checkbox input[type="checkbox"]:checked~label::before {
  content: "\2705" !important; 
} 

/* Red cross - Exclude */
.checkbox.error-checkbox input[type="checkbox"]:checked+label::before {
  content: "\274C" !important; 
} 

.checkbox-danger input[type="checkbox"]:checked + label::before {
  background-color: #d9534f ;
  accent-color: #d9534f;
  border: 1px solid #d9534f;
}

.checkbox-danger input[type="checkbox"]:checked + label::after  {
  /* color: #fff ; */
  border-color: #d9534f;
  accent-color: #d9534f;
    color: #d9534f !important;
}


/* Excipients Green tick - Include */
.excipientsfilters input[type="checkbox"]:checked~label:nth-of-type(1)::before {
  content: "\2705" !important; 
}

/* Excipients Red cross - Exclude */
.excipientsfilters input[type="checkbox"]:checked+label:nth-of-type(1)::before {
  content: "\274C" !important; 
}

.specialkeyword:hover {
  cursor: pointer;
}

.my-bordered-icon{
  text-shadow: -1px 0 #8b08ac, 0 1px #8f066d, 1px 0 #8f066d, 0 -1px #8f066d;
}

.tooltipinfo:hover {
  cursor: pointer;
}

.tooltip-inner { background-color: #e472d3 !important; } 

.checkbox.error-checkbox input[type="checkbox"]:hover {
  cursor: pointer;
}

input[type="checkbox"]{
  cursor: pointer;
}


.disable-click {
  pointer-events: none;
}

.spinner {
  height: 5rem;
  width: 5rem;
  margin: auto;
  display: flex;
  position: absolute;
  -webkit-animation: rotation .6s infinite linear;
  -moz-animation: rotation .6s infinite linear;
  -o-animation: rotation .6s infinite linear;
  animation: rotation .6s infinite linear;
  border-left: 6px solid rgba(2, 117, 216, 0.15);
  border-right: 6px solid rgba(2, 117, 216, 0.15);
  border-bottom: 6px solid rgba(2, 117, 216, 0.15);
  border-top: 6px solid rgba(2, 117, 216, .8);
  border-radius: 100%;
}

@-webkit-keyframes rotation {
  from {
    -webkit-transform: rotate(0deg);
  }

  to {
    -webkit-transform: rotate(359deg);
  }
}

@-moz-keyframes rotation {
  from {
    -moz-transform: rotate(0deg);
  }

  to {
    -moz-transform: rotate(359deg);
  }
}

@-o-keyframes rotation {
  from {
    -o-transform: rotate(0deg);
  }

  to {
    -o-transform: rotate(359deg);
  }
}

@keyframes rotation {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(359deg);
  }
}

#overlay {
  position: absolute;
  display: none;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(112, 105, 105, 0.5);
  z-index: 10;
  /* cursor: pointer; */
}

.table-hover>tbody>tr:hover>* {
  /* box-shadow: inset 0 0 0 9999px #cf8383cc; */
  box-shadow: inset 0 0 0 9999px #c9b3b3cc !important;
  /* background-color: #dfd7d7cc !important; */
  background-color: #c9b3b3cc !important;
  color: #000000 !important;
  z-index:1 !important;
}



td.dtfc-fixed-left {
  z-index:2;
  background-color: white !important;
}


.form-group{
  margin-bottom: .5rem;
}

/* .select2-container .select2-selection--single {
    height: calc(1.5em + 1rem ) !important;
}

.select2-selection__arrow{
      height: calc(1.5em - 1rem ) !important;
} */

.dtsp-search {
  font-weight: bold !important;
}

.dtsp-pill {
  background-color: rgb(216, 213, 213) !important;
}

.selected .dtsp-pill {
  background-color: #d5f1d2 !important;
  color: #0A7619  !important;
  font-weight: bold !important;
  font-size: 1.2rem;
  /* border:  1px solid #000000 !important; */
}

table.dataTable>tbody>tr.selected>*,
table.dataTable>tbody>tr.odd.selected>*,
table.dataTable>tbody>tr.even.selected>*,
table.dataTable>tbody>tr.selected:hover>* {
  /* box-shadow: inset 0 0 0 9999px #cccaca !important; */
  box-shadow: inset 0 0 0 9999px #c9b3b3cc !important;
  /* background-color: #d5f1d2 !important; */
  color: #000000 !important;
  }


  table.dataTable thead>tr>th.sorting::before,
  table.dataTable thead>tr>th.sorting::after
  {
    opacity: 0.3;
  }

  table.dataTable thead>tr>th.sorting_asc::before,
  table.dataTable thead>tr>th.sorting_desc::after
  {
    opacity: 1;
  }

  #repnewprodtablescr>th {
    position: sticky !important;
  }

  #repnewprodtablescr td.select-checkbox::before
  {
    top: 50% !important;
    margin-top: -6px !important;
  }

  #repnewprodtablescr td.select-checkbox::after
  {
    top: 50% !important;
    margin-top: -17px !important;
  }

  table.dataTable.display>tbody>tr.odd.selected>*,
  table.dataTable.display>tbody>tr.even.selected>*,
  table.dataTable.display>tbody>tr.odd.selected>.sorting_1, 
  table.dataTable.order-column.stripe>tbody>tr.odd.selected>.sorting_1,
  table.dataTable.display>tbody>tr.even.selected>.sorting_1, 
  table.dataTable.order-column.stripe>tbody>tr.even.selected>.sorting_1 
  {
    box-shadow: inset 0 0 0 9999px rgba(158, 179, 211, 0.9);
    /* background-color:rgba(134, 172, 230, 0.9) !important; */
    color:#0a0a0a !important;
  }

  #repnewprodtablescr_wrapper > div.dataTables_scroll.dtfc-has-left > div.dataTables_scrollHead > div > table > thead > tr > th
  {
    text-align: center !important;
  }

  .repscr.table.dataTable th.dt-type-numeric, .repscr.table.dataTable th.dt-type-date, .repscr.table.dataTable td.dt-type-numeric, .repscr.table.dataTable td.dt-type-date{
    text-align: left !important;
  }

  /* Added for column and header misaligned after browser zoom  */
  table.dataTable,
  table.dataTable th,
  table.dataTable td {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
  }

  td.highlight {
    background-color: whitesmoke !important;
  }

  .dtportfoliobtn {
    background-color: #702020;
  }

  .dtchartsbtn {
    background-color: #3a8ae6;
  }

  .colvisbtns {
    background-color: whitesmoke;
    color: #000000;
  }

  .tooltip
{
    background-color: green !important;
}


button.empty_fill {
  display: inline-block !important;
  overflow: hidden;
  width: 100% !important;
  height: 100% !important;
  border: none !important;
  border-radius: 1rem !important;
  cursor: pointer !important;
  pointer-events: none !important;
}

.bggray300 {
  background-color: #f3f7fa !important;
  font-weight: bold !important;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.4), 0 6px 12px 0 rgba(0, 0, 0, 0.3);
}

.bggray300 .card-title{
  font-weight: bold !important;
}

.dthighlight {
  background-color: #dee2e6 !important;
}

 .repscr.table.dataTable th,
 .repscr.table.dataTable td {
   font-size: 0.8em !important;
 }


 #orgnewprodtable thead th {
  text-align: center;
 }

 #orgnewprodtable tbody td {
  text-align: center;
  vertical-align:middle;
}
 
 .searchpromotions {
    background-color: #c8BBAD !important;
    color: white !important;
 }

 div.dtsp-searchPanes div.dt-container div.dt-paging,
    div.dtsp-searchPanes div.dt-container div.dt-info {
        width: fit-content;
        margin: 0 auto;
        min-height: 3em;
        max-height: 60px; 
        /* // Chrome and Bulma workaround */
  }
  
  .longcontentwidth{
      min-width: 350px ;
  }

  #repnewprodtablescr * p {
    margin-bottom: 0;
  }

  .repscrfontsize{
    /* font-size:small !important; */
    font-size:0.8rem !important;
  }

  .nope{
    display: none;
  }

  .pdtselect{
    font-size: small;
  }

  .empty-fill {
    /* display: inline-block !important; */
    /* height: 100% !important; */
    width: 100% !important;
    border: none !important;
    border-radius: 1rem !important;
    cursor: pointer !important;
    pointer-events: none !important;
  }

  /* For add to play area */
  .swal2-radio {
    display: grid !important;
    text-align: left !important;
  }

 .required:after{
  content:" *";
  font-weight:bold;
  color:red;
}
 
  .dashboard-row1 {
   box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.4), 0 6px 16px 0 rgba(0, 0, 0, 0.3);
   background-color: whitesmoke;
   color: rgb(10, 9, 9) !important;
   /* font-size: 2rem; */
   font-size: 1rem !important;
   font-weight: 500;
  }

.bg-indication {
  background-color: #9c543c !important;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.4), 0 6px 20px 0 rgba(0, 0, 0, 0.3);
    background-image: linear-gradient(to right, #9c543c, #CA826A) !important;
    color: #f0f3f7 !important;
    font-weight: 600;
}

.bg-dosage {
  background-color: #CA826A !important;
    background-image: linear-gradient(to right, #CA826A, #F8B098) !important;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.4), 0 6px 20px 0 rgba(0, 0, 0, 0.3);
    /* color: #070707 !important; */
    color: #f0f3f7 !important;
    font-weight: 600;
}

.bg-countries {
  background-color: #F8B098 !important;
    /* background-image: linear-gradient(to right, #F8B098, #FFDEC6) !important; */
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.4), 0 6px 20px 0 rgba(0, 0, 0, 0.3);
    /* color: #070707 !important; */
    color: #6E260E !important;
    font-weight: 600;
}

#newproductslist .disable-select > p {
margin-bottom : 0 !important;
}

#newproductslist .disable-select {
  padding-top : 1rem !important;
  padding-bottom : 1rem !important;
}

#newproductslist > tr > td:nth-child(9) > p {
  padding-bottom : 0rem !important;
  margin-bottom: 0rem !important;
}

.carousel-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  background: rgba(0,0,0,0.5);
  color: #fff;
  border-radius: 50%;
  width: 32px;
  height: 32px;
  cursor: pointer;
}

  .carousel-btn:hover {
    background: #363636;
  }

.carousel-btn.prev { left: 1px; }
.carousel-btn.next { right: 1px; }


.carousel {
      /* max-width: 1200px; */
      margin: auto;
      overflow: hidden;
    }

.carousel-track {
  display: flex;
  gap: 20px;
  transition: transform 0.5s ease-in-out;
}

.card {
  /* flex: 0 0 calc((100% - 60px) / 4); */
  background: white;
  /* border-radius: 16px; */
  /* padding: 24px; */
  /* min-height: 220px; */
  /* box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08); */
}

.card-title{
  margin-left: 0.75rem !important;
  margin-right: 0.75rem !important;
}

.dashboard-row1 {
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
    background: #e9b29f;
    opacity: 0.7;
}

.dashboard-row1:hover{
  transform: translateY(-5px); /* Lifts the card slightly */
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important; /* Adds a Bootstrap-like shadow */
  /* background-color: #e1f08d; */
  background: #e9b29f;
  opacity: 1;
}

/* jQuery UI Datepicker - solid background fix */
.ui-datepicker {
  background: #ffffff !important;
  border: 1px solid #aaa !important;
  z-index: 1100 !important;
}
.ui-datepicker .ui-widget-header {
  background: #f6f6f6 !important;
  border-bottom: 1px solid #ddd !important;
}
.ui-datepicker table {
  background: #ffffff !important;
}
.ui-datepicker td span,
.ui-datepicker td a {
  background: #ffffff !important;
}
.ui-datepicker .ui-state-default {
  background: #ffffff !important;
  border: 1px solid #ddd !important;
}
.ui-datepicker .ui-state-active {
  background: #0d6efd !important;
  color: #ffffff !important;
  border-color: #0d6efd !important;
}
.ui-datepicker .ui-state-highlight {
  background: #e9f0ff !important;
  border-color: #0d6efd !important;
}
.ui-datepicker .ui-datepicker-header {
  background: #ffffff !important;
}

.ui-autocomplete {
  background-color: var(--bs-body-bg, #ffffff) !important;
  border: 1px solid var(--bs-border-color, #dee2e6);
  border-radius: 0.375rem; /* Matches Bootstrap 5 card/input curves */
  z-index: 1050 !important; /* Forces it to sit above Bootstrap modals */
  padding: 0.5rem 0;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}

.ui-menu-item-wrapper {
  padding: 0.5rem 1rem !important;
  color: var(--bs-body-color, #212529);
}

/* Style the hovered/focused item to look like Bootstrap's active state */
.ui-menu-item-wrapper.ui-state-active {
  background-color: var(--bs-primary, #0d6efd) !important;
  color: #ffffff !important;
  border: none !important;
}

/* Hotfix to correctly show the tick instead of garbled content 
Erase the garbled pseudo-content and enforce a standard checkmark box */
table.dataTable tbody td.dt-select-checkbox::before,
table.dataTable tbody th.dt-select-checkbox::before {
    content: " " !important; /* Clears out garbled characters */
}

/* Ensure the checkbox inputs are cleanly centered */
table.dataTable td.ms-0 input[type="checkbox"] {
    transform: scale(1.2);
    margin-left: 0rem !important;
    cursor: pointer;
}

    /* .card h3 {
      margin: 0 0 12px;
      font-size: 20px;
      color: #222;
    }

    .card p {
      margin: 0;
      color: #555;
      line-height: 1.6;
    } */

    /* .controls {
      display: flex;
      justify-content: center;
      gap: 12px;
      margin-top: 20px;
    }

    .controls button {
      border: none;
      background: #222;
      color: #fff;
      padding: 10px 16px;
      border-radius: 8px;
      cursor: pointer;
    }

    .controls button:hover {
      background: #444;
    } */

    @media (max-width: 992px) {
      .card {
        flex: 0 0 calc((100% - 20px) / 2);
      }
    }

    @media (max-width: 576px) {
      .card {
        flex: 0 0 100%;
      }
    }