 .cl-head {
     color: white;
     background-color: black;
 }

 .down-btn,
 .up-btn {
     padding-top: 24px;
 }

 #loading-overlay {
     background: rgb(255 255 255 / 80%);
     display: flex;
     align-items: center;
     justify-content: center;
     text-align: center;
     z-index: 9999;
 }

 .tableFixHead {
     overflow-y: auto;
     height: 500px;
 }

 .tableFixHead .table {
     border-collapse: separate;
     border-spacing: 0px;
 }

 .tableFixHead thead {
     position: sticky;
     top: 0;
     z-index: 1;
 }

 .tableFixHead thead th {
     border-top: 0.1px solid #fff;
 }

 table .custom-table {
     display: table;
     font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
     border-collapse: collapse;
     width: 100%;
 }

 .custom-table td,
 .custom-table th {
     border: 1px solid #ddd;
     padding: 8px;
 }

 .custom-table tr:nth-child(even) {
     background-color: #f2f2f2;
 }

 .custom-table tr:hover {
     background-color: #ddd;
 }

 .custom-table th {
     padding-top: 12px;
     padding-bottom: 12px;
     text-align: left;
     background-color: #2C3B49;
     color: white;
 }

 .modal-fullscreen {
     width: 100vw;
     max-width: none;
     height: 100%;
     margin: 0;
 }

 .disableddiv {
     pointer-events: none;
     opacity: 0.4;
 }

 .fileinput {
     width: 150px;
     text-align: center;
 }

 .left-col {
     float: left;
     width: 25%;
 }

 .center-col {
     float: left;
     width: 50%;
 }

 .right-col {
     float: left;
     width: 25%;
 }

 .disable {
     pointer-events: none;
     opacity: 0.5;
 }

 select[readonly] {
     pointer-events: none;
 }

 select[readonly].select2-hidden-accessible+.select2-container {
     pointer-events: none;
     touch-action: none;
 }

 select[readonly].select2-hidden-accessible+.select2-container .select2-selection {
     background: #eee;
     box-shadow: none;
 }

 select[readonly].select2-hidden-accessible+.select2-container .select2-selection__arrow,
 select[readonly].select2-hidden-accessible+.select2-container .select2-selection__clear {
     display: none;
 }

 .nav-main .nav-main-heading {
     padding: 3px 18px 2px 18px;
     background: #0a2b55;
     color: #fff;
 }

 .nav-main a {
     position: relative;
     display: block;
     padding: 6px 18px 6px 40px;
     font-weight: 600;
     color: rgba(87, 87, 87, .9);
 }
 
.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #448fd9 !important ; /* light background */
}

.section-box {
        background: #f8f9fa;
        padding: 15px;
        border-radius: 8px;
        margin-bottom: 20px;
    }

    .section-title {
        font-weight: bold;
        margin-bottom: 10px;
        color: #333;
        border-bottom: 1px solid #ccc;
        padding-bottom: 5px;
    }

    .highlight-box {
        background: #fdecec;
        padding: 10px;
        text-align: center;
        border-radius: 5px;
    }

    .highlight-box h5 {
        margin: 0;
        font-size: 24px;
        color: #d63384;
    }

    .info-label {
        font-weight: 600;
        color: #333;
    }

 .incentive-container {
  display: flex;
  justify-content: center;
  margin-top: 20px;
}

.incentive-section {
  display: flex;
  align-items: center;
  gap: 5px;
  /* flex-wrap: wrap; ✅ ensures boxes wrap instead of overflow */
}

.incentive-box {
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  padding: 15px 20px;
  min-width: 180px;
  max-width: 220px; /* ✅ controls max box width */
  text-align: center;
  box-shadow: 0 2px 6px rgba(0,0,0,0.08);
  word-wrap: break-word; /* ✅ break long words */
  overflow-wrap: break-word; /* ✅ modern browser support */
  white-space: normal; /* ✅ allow multi-line wrapping */
}

.incentive-box h5 {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 8px;
  color: #4f46e5;
}

.incentive-box p {
  font-size: 14px;
  color: #111827;
  margin: 0;
  word-break: break-word; /* ✅ prevent overflow text */
  overflow: hidden;
  text-overflow: ellipsis;
}

.arrow {
  display: flex;
  align-items: center;
}


    .border-red {
        border: 1px solid red !important;
    }

    .fa-spin-loader {
        animation: spin 1s linear infinite;
    }

    @keyframes spin {
        100% {
            transform: rotate(360deg);
        }
    }