/* General Styles */
  /* .sentiment-section {
    border-right: 1px solid #eaeaea;
  } */
  .bodies {
    color: #81D4FA;
    color: #EBEBEB;
  }

  body,
  p,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  input,
  button,
  select,
  optgroup,
  textarea {
    font-family: 'Quicksand', sans-serif !important;
  }

  .cruxx-neg-red {
    color: #EF6265;
  }

  .cruxx-neg-green {
    color: #00CE83;
  }

  .cruxx-fr-yellow {
    color: #F99B0E;
  }

  /* .chartjs-render-monitor {
      font-family: 'Arial', sans-serif;
  } */

  .cruxx-bg-red {
    background-color: #F08787;
  }

  .cruxx-bg-yellow {
    background-color: #FFA500;
  }

  .cruxx-bg-green {
    background-color: #28a745;
  }


  .border-top {
    border-top: 1px solid #EDEDED !important;
  }

  .border-end {
    border-right: 1px solid #EDEDED !important;
  }

  .border-bottom {
    border-bottom: 1px solid #EDEDED !important;
  }

  .border-start {
    border-left: 1px solid #EDEDED !important;
  }


  .sentiment-title {
    color: #4B006E;
    font-weight: bold;
    padding: 20px 15px;
    min-height: 75.5px;
  }

  .sentiment-item {
    position: relative;
    /* Ensure that child elements like the question mark can be positioned relative to the box */
    transition: transform 0.3s ease;
  }

  .sentiment-item:hover {
    transform: scale;
    background-color: #ffffff;
    /* box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); */
  }

  /* Style the question mark */
  .info-link {
    position: absolute;
    top: 10px;
    /* Adjust the position as needed */
    right: 10px;
    /* Adjust the position as needed */
    font-size: 14px;
    text-decoration: none;
    background-color: #fff;
    color: #000;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    /* box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); */
    opacity: 0;
    /* Initially hidden */
    transition: opacity 0.3s ease;
  }

  .sentiment-item:hover .info-link {
    opacity: 1;
    /* Show the question mark */
  }

  .info-link:hover {
    background-color: #f0f0f0;
    color: #007bff;
    /* Change color on hover */
  }

  /* .sentiment-item {
    padding: 5px ;
  } */


  .volume h2 {
    color: #007bff;
  }

  .neutral h2 {
    color: #FFA500;
  }

  .positive h2 {
    color: #28a745;
  }

  .negative h2 {
    color: #F30808;
  }

  .Rating h2 {
    color: black;
  }

  .sentiment-distribution-section {
    padding-left: 0px;
  }

  .sentiment-distribution-section h4 {
    color: #000000;
    font-weight: bold;
  }

  .chart-placeholder {
    height: 300px;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .chart-placeholder p {
    color: #d3d3d3;
    font-size: 20px;
  }


  .insight-tabs-row .nav-link {
    color: #928F8F !important;
    font-weight: 700;
  }

  .insight-container {
    /* margin-top: 20px; */
    padding: 20px;
    border-radius: 8px;
    background-color: #f9f9f9;
    width: 100%;
  }

  .progress-label {
    font-weight: bold;
  }

  .progress {
    height: 7px;
    border-radius: 0 0.75rem 0.75rem 0;
  }

  .progress-bar {
    border-radius: 0 0.75rem 0.75rem 0;
  }

  .tab-content-wrapper {
    border: 1px solid #F08787;
    border-radius: 0px 0px 0px 0px;
    background-color: white;
    padding: 20px;
  }

  .tab-pane.tab-inventory_request.active {
    border: 1px solid #015099;
    border-radius: 0px 0px 0px 0px;
    background-color: white;
    padding: 20px;
  }

  .tab-pane.tab-product.active {
    border: 1px solid #6A0B9B;
    border-radius: 0px 0px 0px 0px;
    background-color: white;
    padding: 20px;
  }

  .tab-pane.tab-negative.active {
    border: 1px solid #F08787;
    border-radius: 0px 0px 0px 0px;
    background-color: white;
    padding: 20px;
  }

  .tab-pane.tab-positive.active {
    border: 1px solid #0CB751;
    border-radius: 0px 0px 0px 0px;
    background-color: white;
    padding: 20px;
  }

  .tab-pane.tab-feature_request.active {
    border: 1px solid #FFA500;
    border-radius: 0px 0px 0px 0px;
    background-color: white;
    padding: 20px;
  }

  .tab-pane.tab-top-cohort.active {
    border: 1px solid #1289ed;
    border-radius: 0px 0px 0px 0px;
    background-color: white;
    padding: 20px;
  }

  /* .nav-tabs {
    margin-bottom: 0;
  }

  .nav-item {
    width: 33.33%;
    text-align: center;
  } */

  .cruxx-container .card {
    border-radius: 5px;
  }

 .inner-side-nav .nav-pills .nav-link.insight-5-category.active {
    color: #fff;
    background-color: #0150991A;
  }

 .inner-side-nav .nav-pills .nav-link.insight-0-category.active {
    color: #fff;
    background-color: #6A0B9B1A;
  }

  .inner-side-nav .nav-pills .nav-link.insight-2-category.active {
    color: #fff;
    background-color: #87C6AF1A;
  }

  .inner-side-nav .nav-pills .nav-link.insight-4-category.active {
    color: #fff;
    background-color: #F99B0E1A;
  }

  .inner-side-nav .nav-pills .nav-link.top-cohort-3-category.active {
    color: #fff;
    background-color: #349AF01A;
  }

  .insight-tabs-row .nav-tabs .active-negative.nav-link.active,
  .insight-tabs-row .nav-tabs .nav-item.show .nav-link {
    color: #495057;
    background-color: #ffffff;
    border-color: #F08787 #F08787 transparent;
  }


  .insight-tabs-row .nav-tabs .active-positive.nav-link.active,
  .insight-tabs-row .nav-tabs .nav-item.show .nav-link {
    /* color: #495057; */
    color: white;
    background-color: #ffffff;
    border-color: #0CB751 #0CB751 transparent;
  }

  .insight-tabs-row .nav-tabs .active-feature_request.nav-link.active,
  .insight-tabs-row .nav-tabs .nav-item.show .nav-link {
    /* color: #495057; */
    color: white;
    background-color: #ffffff;
    border-color: #FFA500 #FFA500 transparent;
  }


  .insight-3-category .progress-bar.bg-info {
    background-color: #F08787 !important;
  }

  .insight-3-category.active .progress-bar.bg-info {
    background-color: #EF6265 !important;
    /*darker color*/
  }

  .insight-nps-plus-3-category .progress-bar.bg-info {
    background-color: #F08787 !important;
  }

  .insight-nps-plus-3-category.active .progress-bar.bg-info {
    background-color: #EF6265 !important;
    /*darker color*/
  }

  .insight-0-category .progress-bar.bg-info {
    background-color: #6A0B9B !important;
  }

  .insight-5-category .progress-bar.bg-info {
    background-color: #015099 !important;
  }

  .insight-2-category .progress-bar.bg-info {
    background-color: #00CE83 !important;
  }

  .insight-2-category.active .progress-bar.bg-info {
    background-color: #0CB751 !important;
    /*darker color*/
  }

  .insight-4-category .progress-bar.bg-info {
    background-color: #FFA500 !important;
  }

  .insight-4-category.active .progress-bar.bg-info {
    background-color: #F99B0E !important;
    /*darker color*/
  }



  .nav-link.active-negative.active {
    /* color: #F30808!important; */
    color: white !important;
  }

  .nav-tabs .nav-link:hover,
  .nav-tabs .nav-link:focus {
    border-color: #e9ecef #e9ecef transparent;
    isolation: isolate;
  }

  .inner-side-nav .nav-link:not(.active):hover {
    background-color: #fbfbfb;
  }

  .header-section {
    padding: 15px;
    padding-top: 0px;
  }

  .header-info {
    font-size: 1.2rem;
    font-weight: bold;
  }

  /* .feedback-card {
      border: 1px solid #ddd;
      border-radius: 5px;
      padding: 15px;
      margin-top: 20px;
      transition: box-shadow 0.3s ease-in-out;
  } */
  /*.feedback-card:hover {
      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  }*/

  #product-insights-tab {
    border: 1px solid #6A0B9B;
    box-shadow: 0px 0px 15px 0px #6A0B9B80;
  }

  #inventory_requests {
    border: 1px solid #015099;
    box-shadow: 0px 0px 15px 0px #01509980;
  }

  #negative {
    border: 1px solid #EF6265;
    box-shadow: 0px 0px 15px 0px #EF626580;
  }

  #positive {
    border: 1px solid #00CE83;
    box-shadow: 0px 0px 15px 0px #00CE8380;
  }

  #features {
    border: 1px solid #F99B0E;
    box-shadow: 0px 0px 15px 0px #F99B0E80;
  }

  #top-cohorts {
    border: 1px solid #349AF0;
    box-shadow: 0px 0px 15px 0px #349AF080;
  }

  .bar {
    height: 10px;
    background-color: #F08787;
    ;
    margin-bottom: 5px;
    border-radius: 5px;
  }

  .light-red {
    background-color: #ffcccc;
  }

  .volume-bar {
    height: 7px;
    width: 100%;
    background-color: #64BDEF;
    border-radius: 3px;
  }

  .category-heading {
    font-weight: bold;
    font-size: 1.1rem;
  }

  .category-analysis {
    text-decoration: underline;
    color: #51005E;
    cursor: pointer;
    text-align: end;
    font-weight: 700;
    font-size: 12px;
  }

  .pain-points {
    font-weight: bold;
    color: #6a1b9a;
    margin-bottom: 10px;
  }

  .bar-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 0.7rem;
    font-size: 13px;
  }

  .inner-section {
    border-top: 1px solid #ddd;
    padding: 10px 0;
    margin: 10px 0;
  }

  .inner-section:first-child {
    border-top: none;
  }

  .header-section .header-info h4 {
    font-size: 1.2rem;
    font-weight: bold;
  }

  .header-section .header-info span {
    font-size: 1.5rem;
    font-weight: bold;
    color: #333;
  }

  .feedback-card-product {
    background-color: #6A0B9B1A;
    border-radius: 0px;
    padding: 0px;
    height: 350px;
    overflow-y: scroll;
  }

  .feedback-card-ir {
    background-color: #0150991A;
    border-radius: 0px;
    padding: 0px;
    height: 350px;
    overflow-y: scroll;
  }

  .feedback-card-negative {
    background-color: #FDEFF0;
    ;
    border-radius: 0px;
    padding: 0px;
    height: 350px;
    overflow-y: scroll;
    /* border-left: 1px solid #F30808; */
  }

  .feedback-card-nps-plus-negative {
    background-color: #FDEFF0;
    ;
    border-radius: 0px;
    padding: 0px;
    height: 350px;
    overflow-y: scroll;
    /* border-left: 1px solid #F30808; */
  }

  .feedback-card-positive {
    background-color: #87C6AF1A;
    border-radius: 0px;
    padding: 0px;
    height: 350px;
    overflow-y: scroll;
  }

  .feedback-card-fr {
    background-color: #F99B0E1A;
    border-radius: 0px;
    padding: 0px;
    height: 350px;
    overflow-y: scroll;
  }

  .feedback-card-cohort {
    background-color: #349AF01A;
    border-radius: 0px;
    padding: 0px;
    height: 350px;
    overflow-y: scroll;
  }

  .category-heading {
    font-weight: bold;
    font-size: 1.3rem;
  }

  .text-muted {
    color: #777;
    font-size: 0.65rem;
  }

  .bg-type-2 {
    background-color: #87C6AF1A;
  }

  .bg-type-3 {
    background-color: #F99B0E1A;
  }

  .bg-default {
    background-color: #ef6265;
  }

  .pain-points {
    font-weight: bold;
    margin-top: 1rem;
  }

  .bar-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 13px;
  }

  .bar {
    background-color: #F08787;
    height: 10px;
    border-radius: 0 5px 5px 0;
    margin-bottom: 10px;
  }

  .bar.light-red {
    background-color: #F08787;
    ;
  }

  .bar-parent {
    padding: 10px 80px;
    cursor: pointer;
    min-height: 75.5px;
  }

  .bar-parent .progress {
    height: 10px;
    border-radius: 0 5px 5px 0;
    /* margin-bottom: 10px; */
  }

  .bar-parent .progress-bar {
    background-color: #F08787;
    border-radius: 0 5px 5px 0;
  }

  #myIRTabContent .bar-parent .progress-bar {
    background-color: #015099;
    border-radius: 0 5px 5px 0;
  }

  #myProductInsightTabContent .bar-parent .progress-bar {
    background-color: #6A0B9B;
    border-radius: 0 5px 5px 0;
  }


  #myPositiveTabContent .bar-parent .progress-bar {
    background-color: #0CB751;
    border-radius: 0 5px 5px 0;
  }

  #myFRTabContent .bar-parent .progress-bar {
    background-color: #FFA500;
    border-radius: 0 5px 5px 0;
  }

  #myCohortTabContent .bar-parent .progress-bar {
    background-color: #349AF0;
    border-radius: 0 5px 5px 0;
  }

  .cruxx-l2-link {
    display: none;
  }

  .bar-parent:hover .cruxx-l2-link {
    display: inline-block;
  }

  .feedback-card .bar {
    transition: width 0.3s ease;
  }

  .header-section {
    padding-bottom: 20px;
  }

  /* .header-section .header-info {
    margin-bottom: 10px;
  } */


  .analysis-title {
    font-weight: bold;
  }

  .analysis-details {
    font-size: 1rem;
    color: grey;
    display: block;
  }

  /* 
  negative-feedback {
    --bs-gutter-x: 30px;
    --bs-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(-1* var(--bs-gutter-y));
    
    margin-left: calc(-.5* var(--bs-gutter-x));
  }
  negative-feedback {
    color: #4B006E;
    font-weight: bold;
    padding: 20px 20px;
    min-height: 70px;
  }
  .unsightful {
    --bs-gutter-x: 30px;
    --bs-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(-1* var(--bs-gutter-y));
    margin-left: calc(-.5* var(--bs-gutter-x));
    text-align: end;
  }
  .unsightful {
    color: #4B006E;
    font-weight: bold;
    padding: 20px 20px;
    min-height: 70px;
  } */

  .inner-side-nav .nav-tabs .nav-link {
    border-radius: 0;
  }

  .inner-side-nav .nav-pills .nav-link {
    border-radius: 0;

  }

  .inner-side-nav .nav-pills .nav-link.active,
  .inner-side-nav .nav-pills .show>.nav-link {
    color: #fff;
    background-color: #FDEFF0;
    /* border-top: 1px solid #F30808 ; 
      border-bottom: 1px solid #F30808 !important ; */

  }


  .inner-side-nav .nav-pills .nav-link.active,
  .inner-side-nav .nav-pills .show>.nav-link {
    box-shadow: none;
  }

  .nav-tabs .nav-link.active-inventory_request.active {
    color: white;
    background-color: #015099;
    border-color: #015099 #015099 transparent;
    transition: 0.3s all;
  }

  .nav-tabs .nav-link.active-product.active {
    color: white;
    background-color: #6A0B9B;
    border-color: #6A0B9B #6A0B9B transparent;
    transition: 0.3s all;
  }

  .nav-tabs .nav-link.active-negative.active {
    color: white;
    background-color: #EF6265;
    border-color: #F30808 #F30808 transparent;
    transition: 0.3s all;
  }

  .nav-tabs .nav-link.active-negative.active {

    /* background-color: #FFFFFF; */
    border-color: #F30808 #F30808 transparent;
    padding: 0.75rem;
    font-weight: bold;
    min-width: 120px;
    text-align: center;
  }

  .nav-tabs .nav-link.active-positive.active {
    color: white !important;
    background-color: #00CE83;
    border-color: #0CB751 #0CB751 transparent;
    padding: 0.75rem;
    font-weight: bold;
    min-width: 120px;
    text-align: center
    transition: 0.3s all;
  }

  .nav-tabs .nav-link.active-cohort.active {
    /* color: #495057; */
    color: white !important;
    background-color: #349AF0;
    border-color: #1289ed #1289ed transparent;
    padding: 0.75rem;
    font-weight: bold;
    min-width: 120px;
    text-align: center
  }

  .nav-tabs .nav-link.active-feature_request.active {
    /* color: #495057; */
    color: white !important;
    background-color: #F99B0E;
    border-color: #EE8100 #EE8100 transparent;
    padding: 0.75rem;
    font-weight: bold;
    min-width: 120px;
    text-align: center
  }

  .nav-tabs .nav-link {
    color: #51005e;
    background-color: #FFFFFF;
    /* border: 1px solid transparent; */
    border-width: 1px, 1px, 0px, 1px;
    border-style: solid;
    border-color: #F8F9FA;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    padding: 0.70rem;
    min-width: 120px;
    text-align: center;
  }

  .sort-by-metric {
    font-size: 0.75rem;
  }

  /*css for the extra dropdowns*/
  #all-categories,
  #customer-support,
  #order-delivery {
    background-color: #F8F8F8;
    /* min-height: 700px; */
  }

  #myProductInsightTabContent .bootstrap-select .btn,
  #myIRTabContent .bootstrap-select .btn,
  #myTabContent .bootstrap-select .btn,
  #myPositiveTabContent .bootstrap-select .btn,
  #myFRTabContent .bootstrap-select .btn,
  #myNPSPlusTabContent .bootstrap-select .btn
  {
    padding: 0px;
    border: 0 !important;
    color: var(--purple) !important;
    width: 50px;
    margin-left: 0.2rem;
    margin-bottom: 0.1rem;
    font-size: 11px;
    font-weight: 600;
  }

  #myTabContent .dropdown-toggle:after,
  #myProductInsightTabContent .dropdown-toggle:after,
  #myIRTabContent .dropdown-toggle:after,
  #myPositiveTabContent .dropdown-toggle:after,
  #myFRTabContent .dropdown-toggle:after,
  #myNPSPlusTabContent .dropdown-toggle:after {
    content: "\f0dd";
    margin-bottom: 0.5rem;
  }

  #myTabContent .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn),
  #myProductInsightTabContent .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn),
  #myIRTabContent .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn),
  #myPositiveTabContent .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn),
  #myFRTabContent .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn)
  #myNPSPlusTabContent .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn)
  {
    width: 55px;
  }

  #myTabContent .dropdown-menu.inner.show li.selected.active {
    display: none;
  }

  .bar-parent-pos .progress-bar {
    background-color: #079c0c;
    /*    border-radius: 0 5px 5px 0;*/
  }

  .cruxx-header {
    font-size: 11px;
    color: #6D6D6D;
    font-weight: 600;
    line-height: 13.5px;
    text-align: left;
    margin-bottom: 0%;
    margin-top: 12px;
  }

  .cruxx-header-category {
    font-size: 11px;
    color: #6D6D6D;
    font-weight: 600;
    line-height: 13.5px;
    text-align: left;
    margin-bottom: 0%;
    margin-top: 12px;
    border-left: 1px solid #F30808;

  }

  .cruxx-header-content {
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
    text-align: left;
  }

  .feedback-header {
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
    /* text-align: left; */
    color: #51005E;
    position: absolute;
    margin-left: -row review-meta align-items-center14px;
    margin-top: 25px;

  }

  .feedback-header-2 {
      font-size: 20px;
      font-weight: 700;
      line-height: 24px;
      /* text-align: left; */
      color: #51005E;
      margin-left: -row review-meta align-items-center14px;
/*      margin-top: 25px;*/
  }

  .cruxx-box {
    padding: 7px 15px;
    min-height: 75.5px;
    border-width: 1px;
    box-sizing: border-box;
  }

  .cruxx-box-ir-category {
    padding: 7px 15px;
    min-height: 75.5px;
    background-color: #0150991A;
  }

  .cruxx-box-prod-category {
    padding: 7px 15px;
    min-height: 75.5px;
    background-color: #6A0B9B1A;
  }

  .cruxx-box-neg-category {
    padding: 7px 15px;
    min-height: 75.5px;
    background-color: #FDEFF0;
  }

  .cruxx-box-pos-category {
    padding: 7px 15px;
    min-height: 75.5px;
    background-color: #87C6AF1A;
  }

  .cruxx-box-fr-category {
    padding: 7px 15px;
    min-height: 75.5px;
    background-color: #F99B0E1A;
  }

  .cruxx-box-cohort {
    padding: 7px 15px;
    min-height: 75.5px;
    background-color: #349AF01A;
  }

  .inner-side-nav .nav-pills .nav-link {
    border-radius: 0;
    padding: 10px 30px;
  }

  .inner-side-nav .nav-link,
  .inner-side-nav .nav-link>* {
    font-size: 13px;
    font-weight: 700 !important;
    line-height: 16.5px;
    text-align: right;
    color: #000000;
  }

  .tab-content-header-negative {
    padding: 1px 80px;
    min-height: 75.5px;
    background-color: #FDEFF0;
  }

  .tab-content-header-nps-plus-negative {
    padding: 1px 80px;
    min-height: 75.5px;
    background-color: #FDEFF0;
  }

  .tab-content-header-ir {
    padding: 10px 80px;
    min-height: 75.5px;
    background-color: #0150991A;
  }

  .tab-content-header-product {
    padding: 10px 80px;
    min-height: 75.5px;
    background-color: #6A0B9B1A;
  }

  .tab-content-header-positive {
    padding: 10px 80px;
    min-height: 75.5px;
    background-color: #87C6AF1A;

  }

  .tab-content-header-fr {
    padding: 10px 80px;
    min-height: 75.5px;
    background-color: #F99B0E1A;

  }

  .tab-content-header-cohort {
    padding: 10px 80px;
    min-height: 75.5px;
    background-color: #349AF01A;

  }

  .cruxx-sub-header {
/*    color: #51005E;*/
    color: #000000;
    font-size: 13px;
    font-weight: 700;
    line-height: 10px;
    text-align: left;
    padding-bottom: 0px;
  }

  .sort-by-select {
    font-size: 11px;
  }

  #myTabContent .dropdown-menu {
    border-radius: 4px;
    background-color: #FDEFF0;
    font-size: 11px;
  }

  #myIRTabContent .dropdown-menu .dropdown-item,
  #myProductInsightTabContent .dropdown-menu .dropdown-item,
  #myPositiveTabContent .dropdown-menu .dropdown-item,
  #myFRTabContent .dropdown-menu .dropdown-item,
  #myTabContent .dropdown-menu .dropdown-item {
    font-size: 11px;
    color: #51005E;
  }

  #pain-point,
  #positive-point,
  #feature_request-point {
    font-size: 11px;
    color: #6D6D6D;
    font-weight: 600;
    line-height: 13.5px;
    text-align: left;
    margin-bottom: 0%;
    margin-top: 0px;
    padding-top: 0px;
  }



  .chart-navbar.cruxx-chart-navbar li:hover>ul {
    display: none;
    position: absolute;
    z-index: 1;
  }

  .chart-navbar.cruxx-chart-navbar.show li:hover>ul {
    display: block;
    position: absolute;
    z-index: 1;
  }

  .cruxx-l2-link {
    position: absolute;
    top: 2rem;
    right: 1.5rem;
  }


  /* css for modals */
  /* .modal.right .modal-dialog {
    position: fixed;
    right: 0;
    top: 0;
    margin: 0;
    width: 100; 
    height: 100%;
    transition: transform 0.3s ease-in-out;
  }

  .modal.right .modal-content {
    height: 100%;
    border: 0;
    border-radius: 0;
    width: 600px;
  }

  .modal.right .modal-dialog-slide-out {
    transform: translateX(100%);
  }

  .modal.right.show .modal-dialog {
    transform: translateX(0);
  } */
  /*#cruxxModal.modal {
    overflow-y: hidden;
  }*/

  #cruxxModal {
    z-index: 1056;
  }
  .btn-xl.btn-default {   /* translate btn */
    font-weight: 700 !important;
    font-size: 1rem;
  }
  #cruxxModal .modal-dialog {
    max-width: 62%;
    border-radius: 20px 0px 0px 20px;
  }

  @media (max-width: 992px) {
    #cruxxModal .modal-dialog {
      max-width: 100%;
    }
  }

  #cruxxModal .modal-dialog-slide-out {
    min-height: 100%;
    margin: 0 0 0 auto;
    background: #fff;
  }

  #cruxxModal.modal.fade .modal-dialog.modal-dialog-slide-out {
    -webkit-transform: translate(100%, 0) scale(1);
    transform: translate(100%, 0) scale(1);
  }

  #cruxxModal.modal.fade.show .modal-dialog.modal-dialog-slide-out {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    display: flex;
    align-items: stretch;
    height: 100%;
  }

  /*#cruxxModal.modal.fade.show .modal-dialog.modal-dialog-slide-out .modal-body {
    overflow-y: hidden;
    overflow-x: hidden;
  }
  */
  #cruxxModal .modal-content {
    height: max-content;
    border: 0px;
  }

  #cruxxModal .append-feedback-v2 {
    overflow-y: scroll;
    overflow-x: hidden;
    /*    height: calc(70% - 30px);*/
    max-height: 540px;
    height: auto;
    padding-bottom: 1rem;
  }
  .review-item {
      min-height: 100px;
  }

  #cruxxModal .modal-dialog-slide-out .modal-content {
    /* border-left: 7px solid #592  2; */
    border-radius: 20px 0px 0px 20px;
  }

  #cruxxModal .modal-dialog-slide-out .modal-header,
  #cruxxModal .modal-dialog-slide-out .modal-footer {
    border-radius: 20px 20px 0px 0px !important;
    padding: 20px 1.875rem;
  }

  #cruxxModal .modal-body,
  #cruxxModal .modal-content {
    border-radius: 0px !important;
  }


  #cruxxFRModal.modal {
    overflow-y: auto;
  }

  #cruxxFRModal .modal-dialog {
    max-width: 62%;
    border-radius: 20px 0px 0px 20px;
  }

  @media (max-width: 992px) {
    #cruxxFRModal .modal-dialog {
      max-width: 100%;
    }
  }

  #cruxxFRModal .modal-dialog-slide-out {
    min-height: 100%;
    margin: 0 0 0 auto;
    background: #fff;
  }

  #cruxxFRModal.modal.fade .modal-dialog.modal-dialog-slide-out {
    -webkit-transform: translate(100%, 0) scale(1);
    transform: translate(100%, 0) scale(1);
  }

  #cruxxFRModal.modal.fade.show .modal-dialog.modal-dialog-slide-out {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    display: flex;
    align-items: stretch;
    height: 100%;
  }

  /*#cruxxFRModal.modal.fade.show .modal-dialog.modal-dialog-slide-out .modal-body {
    overflow-y: hidden;
    overflow-x: hidden;
  }
  */
  #cruxxFRModal .modal-content {
    height: max-content;
    border: 0px;
  }

  #cruxxFRModal .append-feature-request {
    overflow-y: scroll;
    overflow-x: hidden;
    /*    height: calc(70% - 30px);*/
    max-height: 540px;
    height: auto;
    padding-bottom: 1rem;
  }

  #cruxxFRModal .modal-dialog-slide-out .modal-content {
    /* border-left: 7px solid #592  2; */
    border-radius: 20px 0px 0px 20px;
  }

  #cruxxFRModal .modal-dialog-slide-out .modal-header,
  #cruxxFRModal .modal-dialog-slide-out .modal-footer {
    border-radius: 20px 20px 0px 0px !important;
    padding: 20px 1.875rem;
  }

  #cruxxFRModal .modal-body,
  #cruxxFRModal .modal-content {
    border-radius: 0px !important;
  }


  #statsModal .modal-dialog {
    max-width: 80%;
    border-radius: 20px 0px 0px 20px;
  }

  @media (max-width: 992px) {
    #statsModal .modal-dialog {
      max-width: 100%;
    }
  }

  #statsModal .modal-dialog-slide-out {
    min-height: 100%;
    margin: 0 0 0 auto;
    background: #fff;
  }

  #statsModal.modal.fade .modal-dialog.modal-dialog-slide-out {
    -webkit-transform: translate(100%, 0) scale(1);
    transform: translate(100%, 0) scale(1);
  }

  #statsModal.modal.fade.show .modal-dialog.modal-dialog-slide-out {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    display: flex;
    align-items: stretch;
    height: 100%;
  }

  /*#statsModal.modal.fade.show .modal-dialog.modal-dialog-slide-out .modal-body {
    overflow-y: hidden;
    overflow-x: hidden;
  }
  */
  #statsModal .modal-content {
    height: 100%;
    display: flex;
    flex-direction: column;
    border: 0px;
  }

  #statsModal .append-feedback-v2 {
    overflow-y: scroll;
    overflow-x: hidden;
    /*    height: calc(70% - 30px);*/
    max-height: 540px;
    height: auto;
    padding-bottom: 1rem;
  }

  #statsModal .modal-dialog-slide-out .modal-content {
    /* border-left: 7px solid #592  2; */
    border-radius: 20px 0px 0px 20px;
  }

  #statsModal .modal-dialog-slide-out .modal-header,
  #statsModal .modal-dialog-slide-out .modal-footer {
    /*border-radius: 20px 20px 0px 0px !important;*/
    padding: 40px 1.875rem;
    border-radius: 0;
    background-color: #f5f3f8;
    /*box-shadow: 0px 0px 4px #51005ea1;*/
    box-shadow: 0 1px 5px -3px rgba(81, 0, 94, 0.63);
  }

  #statsModal .modal-body {
    overflow-y: auto;
    flex: 1;
    padding-top: 0;
    padding-bottom: 0;
  }

  #statsModal .modal-body,
  #statsModal .modal-content {
    border-radius: 0px !important;
  }

  #statsModal .modal-header {
    position: sticky;
    top: 0;
    z-index: 1031;
    background-color: white;
  }

  #statsModal #breadcrumbFilter {
/*    position: sticky;*/
    /* top: -10px; */ /* modal-header height */
    z-index: 1030;
    /*background-color: white;*/
    padding: 8px 16px;
  }

  #statsModal #statsTabs {
    position: sticky;
    top: 45px; /* header + breadcrumb */
    z-index: 1029;
    background-color: white;
    padding: 0 16px;
  }

  /* NPS Plus FB View Modal */
  #cruxxFBModal {
    z-index: 1056;
  }
  .btn-xl.btn-default {   /* translate btn */
    font-weight: 700 !important;
    font-size: 1rem;
  }
  #cruxxFBModal .modal-dialog {
    max-width: 62%;
    border-radius: 20px 0px 0px 20px;
  }

  @media (max-width: 992px) {
    #cruxxFBModal .modal-dialog {
      max-width: 100%;
    }
  }

  #cruxxFBModal .modal-dialog-slide-out {
    min-height: 100%;
    margin: 0 0 0 auto;
    background: #fff;
  }

  #cruxxFBModal.modal.fade .modal-dialog.modal-dialog-slide-out {
    -webkit-transform: translate(100%, 0) scale(1);
    transform: translate(100%, 0) scale(1);
  }

  #cruxxFBModal.modal.fade.show .modal-dialog.modal-dialog-slide-out {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    display: flex;
    align-items: stretch;
    height: 100%;
  }

  /*#cruxxFBModal.modal.fade.show .modal-dialog.modal-dialog-slide-out .modal-body {
    overflow-y: hidden;
    overflow-x: hidden;
  }
  */
  #cruxxFBModal .modal-content {
    height: max-content;
    border: 0px;
  }

  #cruxxFBModal .stats-append-feedback-v2 {
    overflow-y: scroll;
    overflow-x: hidden;
    /*    height: calc(70% - 30px);*/
    max-height: 540px;
    height: auto;
    padding-bottom: 1rem;
  }

  #cruxxFBModal .modal-dialog-slide-out .modal-content {
    /* border-left: 7px solid #592  2; */
    border-radius: 20px 0px 0px 20px;
  }

  #cruxxFBModal .modal-dialog-slide-out .modal-header,
  #cruxxFBModal .modal-dialog-slide-out .modal-footer {
    border-radius: 20px 20px 0px 0px !important;
    padding: 20px 1.875rem;
  }

  #cruxxFBModal .modal-body,
  #cruxxFBModal .modal-content {
    border-radius: 0px !important;
  }


  #cruxxSentenceModal {
    z-index: 1056;
  }
  .btn-xl.btn-default {   /* translate btn */
    font-weight: 700 !important;
    font-size: 1rem;
  }
  #cruxxSentenceModal .modal-dialog {
    max-width: 62%;
    border-radius: 20px 0px 0px 20px;
  }

  @media (max-width: 992px) {
    #cruxxSentenceModal .modal-dialog {
      max-width: 100%;
    }
  }

  #cruxxSentenceModal .modal-dialog-slide-out {
    min-height: 100%;
    margin: 0 0 0 auto;
    background: #fff;
  }

  #cruxxSentenceModal.modal.fade .modal-dialog.modal-dialog-slide-out {
    -webkit-transform: translate(100%, 0) scale(1);
    transform: translate(100%, 0) scale(1);
  }

  #cruxxSentenceModal.modal.fade.show .modal-dialog.modal-dialog-slide-out {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    display: flex;
    align-items: stretch;
    height: 100%;
  }

  /*#cruxxSentenceModal.modal.fade.show .modal-dialog.modal-dialog-slide-out .modal-body {
    overflow-y: hidden;
    overflow-x: hidden;
  }
  */
  #cruxxSentenceModal .modal-content {
    height: max-content;
    border: 0px;
  }

  #cruxxSentenceModal .append-critical-modal-body {
    overflow-y: scroll;
    overflow-x: hidden;
    /*    height: calc(70% - 30px);*/
    max-height: 540px;
    height: auto;
    padding-bottom: 1rem;
  }
  .review-item {
      min-height: 100px;
  }

  #cruxxSentenceModal .modal-dialog-slide-out .modal-content {
    /* border-left: 7px solid #592  2; */
    border-radius: 20px 0px 0px 20px;
  }

  #cruxxSentenceModal .modal-dialog-slide-out .modal-header,
  #cruxxSentenceModal .modal-dialog-slide-out .modal-footer {
    border-radius: 20px 20px 0px 0px !important;
    padding: 20px 1.875rem;
  }

  #cruxxSentenceModal .modal-body,
  #cruxxSentenceModal .modal-content {
    border-radius: 0px !important;
  }

  /* reviews csss */

  .review-header {
    font-size: 12px;
    color: #6D6D6D;
    font-weight: 600;
    line-height: 13.5px;
    text-align: left;
    margin-bottom: 5px;
    margin-top: 12px;
  }

  .review-header-content {
    font-size: 26px;
    color: #51005E;
    font-weight: 700;
    line-height: 24px;
    text-align: left;
  }

  .review-item {
    background-color: white;
    padding: 20px;
  }

  .review-meta {
    font-size: 12px;
    color: #6c757d;
/*    margin-bottom: 10px;*/
  }

  .review-content {
    font-size: 14px;
    line-height: 1.6;
    color: #333;
  }

  .review-border {
    border-bottom: 1px solid #e0e0e0;
    padding-bottom: 16px;
    margin-bottom: 16px;
    /*    margin-left: 30px;*/
    /* margin-right: 100px ; */
  }

  .review-tags {
    margin-top: 10px;
  }

  .fw-600 {
    font-weight: 600px;
  }

  .badge {
    margin-right: 8px;
    padding: 5px 10px;
    font-size: 12px;
    color: #727272;
    background-color: #9E9A9A33;
  }

  /* .reviews-badge{
    background-color: #9E9A9A33;
  } */

  .filter-form-group.no-checkbox label:before {
    display: none;
  }

  .filter-form-group.no-checkbox input:checked+label:after {
    content: none;
  }

  .filter-form-group.no-checkbox.is-checked {
    background-color: #F5F5F5;
  }

  /*  Apache Charts */
  #category-sentiment-chart-container {
    height: 380px;
    width: 100%;
  }

  .parent-row:hover {
    background-color: #f7f7f7;
    cursor: pointer;
  }

  .child-row:hover {
    background-color: rgb(249, 249, 249, 0.7);
    cursor: pointer;
  }

  .parent-row.show {
    color: #000000;
    background-color: #f7f7f7;
  }

  #overview-card .bootstrap-select .btn {
    padding: 8px 15px;
    border-radius: 8px;
    font-size: 12px;
  }

  .parent-row .td-indicator:before {
    font-family: "Font Awesome 6 Free", "FontAwesome";
    content: "\f0fe";
    font-size: 15px !important;
  }

  .parent-row.show .td-indicator:before {
    font-family: "Font Awesome 6 Free", "FontAwesome";
    content: "\f146";
    font-size: 15px !important;
  }

  .parent-row:hover .td-indicator:before {
    font-weight: 600;
  }

  .parent-row.show:hover .td-indicator:before {
    font-weight: 600;
  }

  .parent-row:hover .parent-view {
    color: #007bff;
    text-decoration: underline;
    visibility: visible !important;
  }

  .parent-row:hover .negative-stats-btn {
    color: #007bff;
    text-decoration: underline;
    visibility: visible !important;
  }

  tr.child-row {
    background-color: #fdfdfd;
  }

  .attr-table td:not(:nth-child(1)):not(:nth-child(2)) {
      text-align: center;
  }

  .store_attr_link {
    text-decoration: underline;
    cursor: pointer;
  }

  .my-switch {
    /*    padding-top: 6px;*/
  }

  .my-switch .form-switch {
    margin: -1px 0px 0 15px;
  }

  .my-switch .form-text {
    /*    margin: 0;*/
    margin-top: 0.15rem;
  }

  .append-raw-feedback {
    height: 530px;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 7px 15px;
  }

  #cruxx-score-chart {
    width: 400px;
    height: 100px;
  }

  #cruxx-score-chart2 {
    height: 500px;
  }

  #trends-chart {
    width: 100%;
    height: 450px;
  }

  /* tippy ppover */

  .my-custom-tippy-box {
    background-color: #51005E !important;
    /* border: 1px solid #51005E !important; */
    border-radius: 4px !important;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1) !important;
    /* width: 16px !important; */
    /* height: px !important; */
    /* padding: 8px !important; */
    text-align: center !important;
    box-shadow: #000;
    height: 50px;
    width: 160px ;
    display: flex !important; 
    justify-content: center !important; 
    align-items: center !important;
  }

  .my-custom-tippy-content {
    font-size: 12px !important;
    color: #ffffff !important;
    font-weight: bold;
    margin: 0 !important;

  }

  .my-custom-tippy-arrow {
    color: #51005E !important;
    border: none;
  }



  .unselectable {
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
  }

  @media (min-width: 1024px) and (max-width: 3000px) {
    .nav-control {
      display: none !important;
    }
  }

  #attribute-tables-container {
    width: 100%;
    padding: 10px 15px;
    /*    overflow-x: auto;*/
  }

  .pagination .page-item.active .page-link {
    background-color: #52185b;
    border-color: #52185b;
    color: #fff;
    box-shadow: 0 10px 20px 0px rgba(67, 220, 128, 0.2);
  }

  .pagination .page-item .page-link:hover {
    background: #52185b;
    color: #fff;
    border-color: #52185b;
  }

  /* l2 link */
  .bar-parent {
    transition: background-color 0.3s ease-out;
  }

  /* Read More Link  */

  @keyframes arrowAnimation {
    0% {
      left: 0;
    }

    50% {
      left: 5px;
    }

    100% {
      left: 0;
    }
  }

  .read-more-link {
    display: none;
    position: absolute;
    top: 3.4rem;
    right: 4.5rem;
    font-size: 9px;
    color: #51005E;
    text-decoration: none;
    transition: color 0.3s ease-out;
  }

  .bar-parent:hover .read-more-link {
    display: inline-block;
  }

  /* Arrow animation for Read More */
  .read-more-arrow::after {
    content: "\279E";
    display: inline-block;
    padding-left: 8px;
    position: relative;
    animation: arrowAnimation 1.5s infinite ease-in-out;
    color: inherit;
    transition: color 0.3s ease-out;
  }

  .read-more-link:hover {
    color: #EF6265;
  }

  .read-more-link:hover .read-more-arrow::after {
    color: #EF6265;
  }

  .mom-categories-lost-chips .badge,
  .mom-categories-gained-chips .badge,
  .mom-growing-pp-chips .badge,
  .mom-improved-pp-chips .badge,
  .three-month-categories-lost-chips .badge,
  .three-month-categories-gained-chips .badge,
  .three-month-growing-pp-chips .badge,
  .three-month-improved-pp-chips .badge,
  /* Week Classes */
  .four_week-categories-lost-chips .badge,
  .four_week-categories-gained-chips .badge,
  .four_week-growing-pp-chips .badge,
  .four_week-improved-pp-chips .badge,
  .twelve-week-categories-lost-chips .badge,
  .twelve-week-categories-gained-chips .badge,
  .twelve-week-growing-pp-chips .badge,
  .twelve-week-improved-pp-chips .badge {
    background-color: #ECECEC;
    color: #000000 !important;
    border-radius: 20px;
    line-height: 1;
    font-size: 0.695rem;
    font-weight: 500;
    vertical-align: middle;
  }

  @media (min-width: 992px) {

    .mom-categories-lost-chips .badge,
    .mom-categories-gained-chips .badge,
    .mom-growing-pp-chips .badge,
    .mom-improved-pp-chips .badge,
    .three-month-categories-lost-chips .badge,
    .three-month-categories-gained-chips .badge,
    .three-month-growing-pp-chips .badge,
    .three-month-improved-pp-chips .badge,
    /* Week Classes */
    .four_week-categories-lost-chips .badge,
    .four_week-categories-gained-chips .badge,
    .four_week-growing-pp-chips .badge,
    .four_week-improved-pp-chips .badge,
    .twelve-week-categories-lost-chips .badge,
    .twelve-week-categories-gained-chips .badge,
    .twelve-week-growing-pp-chips .badge,
    .twelve-week-improved-pp-chips .badge {
      font-size: 0.775rem;
    }

  }

  .summary-card .nav-item .nav-link {
    padding: 0.25rem 0.5rem;
    min-width: 90px;
    border: 1px solid #EFEFEF;
    border-radius: 20px;
    font-weight: 600;
    font-size: 11px !important;
  }

  .summary-card .nav-item:first-child .nav-link {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }

  .summary-card .nav-item:nth-child(2) .nav-link {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
  }

  #summary-col .nav-link,
  #weekly-summary-col .nav-link {
    color: black;
  }

  .summary-card .nav-pills .nav-link.active,
  .summary-card .nav-pills .show>.nav-link {
    color: #fff !important;
/*    background-color: #2BBBDE;*/
    background-color: var(--purple);
  }

  .score-decreased .card-title {
    align-items: flex-start !important;
  }

  .thumbs-green {
    color: #16DA1D;
  }

  .thumbs-red {
    color: #FE544A;
  }

  .thumbs-yellow {
    color: #F99B0E;
  }

  .four_week-sentiment-score-accordion.score-decreased i.score-thumbs,
  .mom-sentiment-score-accordion.score-decreased i.score-thumbs {
    color: #FE544A;
    /*content: "\f165"!important;*/
    content: "\f119" !important;
  }

  .four_week-sentiment-score-accordion.score-decreased i.score-thumbs:before,
  .mom-sentiment-score-accordion.score-decreased i.score-thumbs:before {
    /*content: "\f165"!important;*/
    content: "\f119" !important;
  }

  .twelve-week-sentiment-score-accordion.score-decreased i.score-thumbs,
  .three-month-sentiment-score-accordion.score-decreased i.score-thumbs {
    color: #FE544A;
    /*content: "\f165"!important;*/
    content: "\f119" !important;
  }

  .twelve-week-sentiment-score-accordion.score-decreased i.score-thumbs:before,
  .three-month-sentiment-score-accordion.score-decreased i.score-thumbs:before {
    /*content: "\f165"!important;*/
    content: "\f119" !important;
  }


  /* Adjust modal dialog width and height */
  #storyViewModal .modal-dialog {
    max-width: 80%;
    border-radius: 20px 0px 0px 20px;
    height: 100%;
    /* Ensure the modal fills the viewport */
  }

  @media (max-width: 992px) {
    #storyViewModal .modal-dialog {
      max-width: 100%;
    }
  }

  #storyViewModal .modal-dialog-slide-out {
    min-height: 100%;
    margin: 0 0 0 auto;
    background: #fff;
    display: flex;
    flex-direction: column;
  }

  #storyViewModal.modal.fade .modal-dialog.modal-dialog-slide-out {
    -webkit-transform: translate(100%, 0) scale(1);
    transform: translate(100%, 0) scale(1);
  }

  #storyViewModal.modal.fade.show .modal-dialog.modal-dialog-slide-out {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    height: 100%;
  }

  #storyViewModal .modal-content {
    height: 100%;
    display: flex;
    flex-direction: column;
    border-radius: 20px 0px 0px 20px;
  }

  #storyViewModal .modal-body {
    overflow-y: auto;
    overflow-x: hidden;
    flex-grow: 1;
    padding-bottom: 1rem;
  }

  #storyViewModal .modal-header,
  #storyViewModal .modal-footer {
    border-radius: 20px 20px 0px 0px !important;
    padding: 20px 1.875rem;
  }

  #storyViewModal .modal-body::-webkit-scrollbar {
    width: 8px;
  }

  #storyViewModal .modal-body::-webkit-scrollbar-thumb {
    background-color: #d1d1d1;
    border-radius: 8px;
  }

  input#chart-sort {
    background-color: white;
    border-color: #663259;
  }

  .text-1 {
    font-size: 11px;
  }

  .text-2 {
    font-size: 11px;
  }


  #negative-insights-category-wise .bar-parent:hover {
    background-color: #f7cece !important;
  }

  #positive-insights-category-wise .bar-parent:hover {
    background-color: #BBF5D0 !important;
  }

  #feature_request-insights-category-wise .bar-parent:hover {
    background-color: #fcda9c !important;
  }

  #top-cohort-insights-category-wise .bar-parent:hover {
    background-color: #c4e1fb !important;
  }

  #attribute-tables-container .table> :not(:first-child) {
    border-top: 1px solid rgb(233 233 233) !important;
  }

  #attribute-tables-container .dt-search input.form-control-sm {
    height: 30px;
  }

  #attribute-tables-container-2 .dt-search input.form-control-sm {
    height: 30px;
  }

  .top-bottom-box {
    padding: 20px 15px;
    height: 75.5px;
    box-sizing: border-box;
    width: 100%;
    background-color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    cursor: pointer;
  }

  .trends-box {
    font-size: 12px;
    padding: 20px 15px 20px 60px !important;
    min-height: 73.5px;
    box-sizing: border-box;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start; 
    gap: 10px; 
}

  .feedback-only-box {
    font-size: 12px;
    padding: 20px 15px 20px 60px !important;
    min-height: 73.5px;
    max-height: 73.5px !important;
    box-sizing: border-box;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start; 
    gap: 10px; 
  }
  .table-view-box {
    font-size: 12px;
    padding: 20px 15px 20px 60px !important;
    min-height: 73.5px;
    box-sizing: border-box;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start; 
    gap: 10px; 
}

  .btn-check:focus+.btn,
  .btn:focus {
    outline: 0 !important;
    box-shadow: 0 0 0 0.15rem rgba(255, 255, 255, 0.35) !important;
    /*    box-shadow: 0 0 0 0.25rem rgb(99, 0, 90) !important;*/
  }

  .form-check-input:checked[type="checkbox"] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%2351005E' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e") !important;
  }

  .form-check-input:focus {
    border-color: #66325940 !important;
    /* Existing border color */
    outline: 0 !important;
    box-shadow: none !important;
    /* Pure white box shadow */
  }

  .bg-purple {
    background-color: #51005E !important;
  }


  /* styles for scrollable */
  .append-attribute-filter {
    display: flex;
    flex-direction: row;
    width: 100%;
    justify-content: start;
    padding: 0;
  }

  .dropdown-option {
    position: relative;
    margin-right: 20px;
  }

  .dropdown-option ul {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background: var(--cruxx-white);
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 1000;
  }

  .dropdown-option:hover ul {
    display: block;
  }

  .scrollable-dropdown {
    max-height: 100px;
    overflow-y: scroll;
  }


  .scrollable-dropdown::-webkit-scrollbar {
    width: 6px;
  }

  .scrollable-dropdown::-webkit-scrollbar-track {
    background: #f1f1f1;
  }

  .scrollable-dropdown::-webkit-scrollbar-thumb {
    background: var(--purple);
  }

  .scrollable-dropdown::-webkit-scrollbar-thumb:hover {
    background: #555;
  }

  .active-bg {
    background-color: var(--purple);
    /* Ensure --purple is defined */
    color: var(--cruxx-white);
    /* Ensure --cruxx-white is defined */
  }

  .btn2 {
    font-size: 11px;
    background-color: #ffffff !important;
    color: var(--purple) !important;
    min-height: 20px !important;

  }
  .btn2 {
    font-size: 11px;
    background-color: #ffffff !important;
    color: var(--purple) !important;
    min-height: 20px !important;
  }
  
  .btn2:hover {
    background-color: rgba(194, 165, 196, 0.842) !important; 
    color: var(--purple) !important; 
    border-color: var(--purple) !important; 
    transition: all 0.3s ease-in-out; 
    border-radius: 7px !important;
  }
  
  .btn2:focus,
  .btn2.clicked {
    background-color: var(--purple) !important;
    color: #ffffff !important;
    outline: none !important;
  }
  
  .btn2 button:focus,
  .btn2 button.clicked {
    background-color: var(--purple) !important;
    color: #ffffff !important;
    outline: none !important;
  }

  .table-1 {
    font-size: 14px !important;
    color: #020002 !important;
    font-size: 13px !important;
    border: 1px solid #EDEDED !important;
    text-align: center !important;
    vertical-align: middle !important;
    font-weight: bold !important;
  }

  .table-2 {
    border: 1px solid #EDEDED !important;
    text-align: center;
    font-size: 13px !important;
    vertical-align: middle !important;
    text-align: center !important;
    font-weight: 700 !important;
    color: rgb(41, 41, 41) !important;
  }

  .text-sizes {
    color: rgb(41, 41, 41) !important;
    font-weight: 700 !important;
    font-size: 12px !important;
    border: 1px solid #EDEDED !important;
  }

  .text-sizes2 {
    color: rgb(70, 63, 63) !important;
    font-weight: 700 !important;
    font-size: 12px !important;
    border: 1px solid #EDEDED !important;
    text-align: center !important;
    vertical-align: middle !important;
  }

  .tableView2 th {
    color: #000000;
  }
  .text-sizes3 {
    color: #000000;
    font-size: 13px !important;
    font-weight: 600;
/*    text-align: center !important;*/
    vertical-align: middle !important;
  }

  .attribute-bread-crumb {
    font-size: 1.5rem;
    font-weight: bold;
  }

  .attribute-bread-crumb-back-btn {
    font-weight: 600;
    letter-spacing: 0em;
    text-align: left;
    transition: 0.2s;
    color: #007bff;
  }

  .attribute-bread-crumb-back-btn:hover {
    text-decoration: underline;
    color: #007bff;
  }

  .three-month-sentiment-score-accordion .accordion__header--indicator::before,
  .mom-sentiment-score-accordion .accordion__header--indicator::before,
  .four_week-sentiment-score-accordion .accordion__header--indicator::before,
  .twelve-week-sentiment-score-accordion .accordion__header--indicator::before 
 
  {
    content: "" !important;
  }

  .btn-light.apply-template.disabled:hover {
    pointer-events: auto !important;
    cursor: not-allowed !important;
  }

  .dropdown-active-bg {
    background-color: #51005E !important;
    /* Strong background color override */
    color: white !important;
    /* Strong font color override */
    transition: background-color 0.3s ease, color 0.3s ease;
    /* Smooth transitions */
  }



  /* Base styles */
  .new-trends-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px;
    border: 1px solid #ccc;
    border-radius: 5px;
    background-color: #FFFFFF;
    transition: background-color 0.3s ease;
  }

  .new-form-check {
    display: flex;
    align-items: center;
    font-size: 14px;
    font-weight: bold;
  }

  .new-form-check-input {
    width: 1.2em;
    height: 1.2em;
    margin-right: 10px;
    border: 1px solid #ccc;
    border-radius: 0.25em;
    background-color: #F9F9F9;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    appearance: none;
    cursor: pointer;
    transition: background-color 0.3s ease, background-image 0.3s ease;
  }

  .new-form-check-input:checked {
    background-color: #FFFFFF;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='%2351005E' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
  }

  .new-trends-box.active {
    background-color: #51005E;
  }

  .attr-chart-col {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
/*    height: 550px;*/
    height: 450px;
    box-sizing: border-box;
  }

  .attr-chart-empty-message {
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    max-width: 469px !important;
    transform: translateY(0%);
    margin-bottom: 10px;
    color: #6c757d;
    font-size: 16px;
    text-align: center;
    margin: 0 auto;
  }
  .trends-chart-col {
    position: relative;
  }

  .chart-empty-message {
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    max-width: 469px !important;
    transform: translateY(0%);
    margin-bottom: 10px;
    color: #6c757d;
    font-size: 16px;
    text-align: center;
    margin: 0 auto;
  }

  .attr-chart-empty-message .alert,
  .chart-empty-message .aelrt {
    background: #ede5ef!important;
    background-color: #ede5ef!important;
    border-color: #d6c4db;
    color: var(--purple) !important;
  }

  @media (max-width: 991.98px) {

    .attr-chart-col,
    .trends-chart-col {
      height: unset;
    }
  }

  .flash-red-border {
    /*    border: 2px solid red!important;*/
    transition: border 0.2s ease;
    background-color: #EF6265 !important;
    z-index: 1;
  }
  .flash-red-border > * {
    color: #fff!important;
  }
  .flash-red-border.insight-3-category.active .progress-bar.bg-info {
    background-color: #6e6e6e !important;
  }

  .flash-green-border {
    /*    border: 2px solid green!important;*/
    transition: border 0.2s ease;
    background-color: #00CE83 !important;
    z-index: 1;
  }
  .flash-green-border > * {
    color: #fff !important;
  }
  .flash-green-border.insight-2-category.active .progress-bar.bg-info {
    background-color: #6e6e6e !important;
  }

  .form-check-input:checked {
    background-color: white !important;
  }


  .append-source .filter-form-group label:before {
    padding: 5px;
  }

  .append-source .filter-form-group input:checked+label:after {
    top: 12px;
    left: 14px;
    width: 4px;
    height: 8px;
  }

  #attribute-tables-container .form-select {
    color: #000000;
  }

  .dropdown-item.disabled,
  .dropdown-item:disabled,
  .dropdown-item.disabled .filter-form-group label {
    color: #adb5bd !important;
    pointer-events: none;
    background-color: transparent;
  }

#page-selected-attribute {
  max-width: 150px;
  overflow: hidden;
  height: 22px;
  word-break: break-all;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}

.trends-switch-check {
  cursor: pointer;
  margin-bottom: 0;
}

.trends-switch-check.disabled {
  cursor: not-allowed!important;
}

.form-switch #chart-sort {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%2351005E'/%3e%3c/svg%3e")!important;
}

.score-chart-containers {
  height: 150px;
  overflow: hidden;
}

.append-date .dropdown-item,
.append-week-date .dropdown-item {
  padding: 0!important;
}

#feature_request-insights-accordion-col .cruxx-accordion .accordion__header:not(.collapsed) {
    background-color: #fef5e6;
}

#feature_request-insights-accordion-col .cruxx-accordion-bg {
    background: #fffdfa;
}


#positive-insights-accordion-col .cruxx-accordion .accordion__header:not(.collapsed) {
    background-color: #f3f9f7;
}

#positive-insights-accordion-col .cruxx-accordion-bg {
    background: #fafffd;
}

#negative-insights-accordion-col .cruxx-accordion .accordion__header:not(.collapsed) {
    background-color: #fdeff0;
}

#negative-insights-accordion-col .cruxx-accordion-bg {
    background: #fbf7f7;
}

.accordion-header--text i.fas {
    line-height: unset;
}

.insights-nav-link-sub {
  display: none;
}

.nav-tabs .nav-link.active-inventory_request.active,
.nav-tabs .nav-link.active-feature_request.active,
.nav-tabs .nav-link.active-product.active,
.nav-tabs .nav-link.active-negative.active,
.nav-tabs .nav-link.active-positive.active,
.nav-tabs .nav-link.active-cohort.active
 {
  min-width: 220px;
  transition: 0.3s all;
}

.nav-tabs .nav-link.active-inventory_request.active .insights-nav-link-sub,
.nav-tabs .nav-link.active-feature_request.active .insights-nav-link-sub,
.nav-tabs .nav-link.active-product.active .insights-nav-link-sub,
.nav-tabs .nav-link.active-negative.active .insights-nav-link-sub,
.nav-tabs .nav-link.active-positive.active .insights-nav-link-sub,
.nav-tabs .nav-link.active-cohort.active .insights-nav-link-sub
 {
  display: inline-block;
}

#summary-col-overall .accordion__header.collapsed .accordion__header--indicator.arrow-indicator::before {
    content: "\e628";
}
.fr-concise-label {
    font-weight: 700!important;
    color: #000000;
}

div.tab-positive.is-empty, 
div.card-sentiment.is-empty, 
div.tab-negative.is-empty, 
div.tab-feature_request.is-empty, 
div.tab-inventory_request.is-empty {
  position: relative;
  overflow: hidden;
}

div.card-sentiment.is-empty::before,
div.tab-positive.is-empty::before,
div.tab-negative.is-empty::before, 
div.tab-feature_request.is-empty::before, 
div.tab-inventory_request.is-empty::before {
  background-color: rgb(221 221 221 / 0%);
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  z-index: 1;
}

.insight-empty-message {
  display: none;
  background: #ede5ef;
  border-color: #d6c4db;
  color: var(--purple) !important;
  max-width: 555px;
  position: absolute;
  left: 0;
  right: 0;
  z-index: 2;
  margin: 0 auto;
  transform: translateY(300%);
}

div.card-sentiment .insight-empty-message {
    max-width: 480px;
    transform: translateY(98%);
}


div.card-sentiment.is-empty .insight-empty-message, 
div.tab-positive.is-empty .insight-empty-message, 
div.tab-negative.is-empty .insight-empty-message, 
div.tab-feature_request.is-empty .insight-empty-message, 
div.tab-inventory_request.is-empty .insight-empty-message {
  display: flex;
}

.insight-empty-message-2 {
  display: none;
  background: #ede5ef;
  border-color: #d6c4db;
  color: var(--purple) !important;
  max-width: 300px;
  z-index: 2;
  margin: 0 auto;
}


#positive-insights-accordion-col.is-empty .insight-empty-message-2, 
#negative-insights-accordion-col.is-empty .insight-empty-message-2, 
#feature_request-insights-accordion-col.is-empty .insight-empty-message-2, 
#inventory_request-insights-accordion-col.is-empty .insight-empty-message-2 {
  display: block!important;
  margin-top: 2rem;
}


/*.chart-navbar li ul {
    width: 220px !important;
    background: #fff !important;
    margin-top: 0 !important;
    left: auto !important;
    right: -220px !important;
    position: absolute !important;
    top: 0 !important;
    z-index: 1000 !important;
}*/

/* responsive change */
.responsive-margin {
  margin-top: 0; 
}

@media (max-width: 575.98px) {
  .responsive-margin {
    margin-top: 5rem; 
  }
}

@media (min-width: 576px) and (max-width: 767.98px) {
  .responsive-margin {
    margin-top: 5rem; 
  }
}

@media (min-width: 768px) and (max-width: 991.98px) {
  .responsive-margin {
    margin-top: 5rem; 
  }
}
/* new toolyip for text feedback */
.my-custom-tippy-box2 {
  background-color: #51005E !important;
  /* border: 1px solid #51005E !important; */
  border-radius: 4px !important;
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1) !important;
  /* width: 16px !important; */
  /* height: px !important; */
  /* padding: 8px !important; */
  text-align: center !important;
  box-shadow: #000;
  height: 65px;
  width: 200px ;
  display: flex !important; 
  justify-content: center !important; 
  align-items: center !important;
}

.my-custom-tippy-content2 {
  font-size: 11px !important;
  color: #ffffff !important;
  font-weight: bold;
  margin: 0 !important;

}

.my-custom-tippy-arrow2 {
  color: #51005E !important;
  border: none;
}

.blank-switch-check {
  cursor: pointer;
  margin-bottom: 0;
}

.blank-switch-check.disabled {
  cursor: not-allowed!important;
}

.cruxx-source-select-navbar.has-changes > ul {
  display: block;
  position: absolute;
  z-index: 1;
}
.cruxx-source-select-navbar.has-changes li{
  background-color: var(--cruxx-white);
  float: none;
}


#options-section {
  display: none;
  transition: max-height 0.3s ease-in-out;
}
#options-section.show {
  display: block;
}


.vertical-navbar {
  position: fixed;
  top: 0;
  right: -100%;
  height: 100%;
  width: 50%;
  background-color: #fff;
  box-shadow: -2px 0 5px rgba(0, 0, 0, 0.2);
  overflow-y: auto;
  transition: right 0.3s ease;
  z-index: 1050;
}

.vertical-navbar.active {
  right: 0;
}

.navbar-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px;
  border-bottom: 1px solid #ddd;
}

.navbar-body {
  padding: 10px;
}

.btn-close {
/*  background: none;*/
  border: none;
/*  font-size: 20px;*/
  cursor: pointer;
}

.form-switch .form-check-input {
  max-width: 2.5rem !important ;
  min-width: 2.0 rem !important;
}

.table-view-btn {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 12px !important;
  font-weight: bold;
  color: #51005E;
  background-color: #FFFFFF;
  border: 1px solid #51005E !important;
  padding: 6px 14px;
  border-radius: 50px;
  transition: all 0.3s ease-in-out;
}

.table-view-btn:hover {
  background-color: #D9B3E6;
  border-radius: 50px;
  
}

.table-view-btn:active,
.table-view-btn.clicked {
  background-color: #51005E;
  color: #FFFFFF;
}


@media (max-width: 767px) {
    .attr-chart-col {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

.nav-tabs .nav-link.active-feature_request.active .insights-nav-link-sub-s {
  display: none!important;
}

li a.inner-a {
  height: 34px !important;
  min-height: 34px !important;
}

.filter-by-l3, .l3-chip {
  background-color: #E9E1E9 !important;
  border-color: transparent !important;
  color: #000!important;
  font-weight: 600;
  font-size: 0.9rem!important;
}

.filter-by-l3:hover,
.l3-chip:hover {
  border-color: #51005e !important;
}

.btn-check:checked + .filter-by-l3.btn-light,
.btn-check:active + .filter-by-l3.btn-light,
.filter-by-l3.btn-light:active,
.filter-by-l3.btn-light.active,
.show > .filter-by-l3.btn-light.dropdown-toggle 
.filter-by-l3:active,
.filter-by-l3.btn-light:active,
.btn-check:checked + .l3-chip.btn-light,
.btn-check:active + .l3-chip.btn-light,
.l3-chip.btn-light:active,
.l3-chip.btn-light.active,
.show > .l3-chip.btn-light.dropdown-toggle 
.l3-chip:active,
.l3-chip.btn-light:active,
{
  background: #51005E !important;
  background-color: #51005E !important;
  color: #fff!important;
}

.btn-check:checked + .filter-by-l3, .btn-check:active + .filter-by-l3, .filter-by-l3:active, .filter-by-l3.active, .show > .filter-by-l3.dropdown-toggle,
.btn-check:checked + .l3-chip, .btn-check:active + .l3-chip, .l3-chip:active, .l3-chip.active, .show > .l3-chip.dropdown-toggle
{
  background: #51005E !important;
  background-color: #51005E !important;
  color: #fff!important;
}

.btn-check:checked + label.filter-by-l3,
.btn-check:checked + label.l3-chip
{
  background: #51005E !important;
  background-color: #51005E !important;
  color: #fff !important;
}

span.l3-count-circle {
    border-radius: 50%;
    border: 0.5px solid;
    border-color: #51005E;
    padding: 0rem;
    height: 20px;
    width: 20px;
    display: inline-block;
    font-size: 0.7rem;
    line-height: 1.75;
}

.btn-check:checked + label.filter-by-l3 span.l3-count-circle,
.btn-check:checked + label.l3-chip span.l3-count-circle
{
    border-radius: 50%;
    border-color: #fff;
/*    color: #51005E;*/
}

#summary-col .nav-link.disabled, #weekly-summary-col .nav-link.disabled {
    color: #b5b5b5!important;
    cursor: not-allowed!important;
}

#summary-col .nav-link.disabled:hover, #weekly-summary-col .nav-link.disabled:hover {
    cursor: not-allowed!important;
}
#L3Toast.show {
  z-index: 1060;
  width: 375px;
}

#L3Toast.hide {
  z-index: -1;
}

.volume-by-topic-item {
  font-size: 12px !important;
  padding: 8px 30px !important;
  color: #348CBE !important;
  font-weight: bold !important;
  /* text-align: center !important; */
  display: block !important;
  white-space: nowrap !important;
}

.volume-by-topic-item:hover {
  background: #F8EAF7;
  color: #51005E;
}

@media (max-width: 576px) {
  .volume-by-topic-item {
    font-size: 10px !important;
    padding: 6px 10px !important;
  }
}


/* filter description CSS */
.filter-description-box {
/*  background: #f8f9fa;*/
  padding: 10px 20px;
  border-radius: 5px;
  font-size: 14px;
  font-weight: 700;
  color: #333;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding-top: 30px;
  /* border-left: 4px solid #51005E; */
  /* margin-bottom: 10px; */
}

/* Tablet screens (e.g. >= 768px) */
@media (min-width: 768px) {
  .filter-description-box {
    padding: 10px 40px;
    padding-top: 30px;
  }
}

/* Desktop screens (e.g. >= 1024px) */
@media (min-width: 1024px) {
  .filter-description-box {
   font-size: 14px;
    padding: 10px 100px;
    padding-top: 30px;
  }
}

/* Desktop screens (e.g. >= 1024px) */
@media (min-width: 1440px) {
  .filter-description-box {
   font-size: 14px;
    padding: 10px 200px;
    padding-top: 30px;
  }
}

.top-bottom-container.disabled {
  opacity: 0.65;
  cursor: not-allowed!important;
}

#attribute-tables-container table.dataTable thead th {
  vertical-align: top!important;
}

.l1_category-selected .chart-navbar.attribute-switcher>li:hover {
  background: transparent!important;
}

.l1_category-selected .chart-navbar.attribute-switcher>li {
  opacity: 0.3!important;
}

.l1_category-selected .chart-navbar a:-webkit-any-link,
.l1_category-selected .chart-navbar a {
  cursor: not-allowed!important;
}

.topic-fb-trends {
  color: #36a2eb;
}

.backdrop-small {
    z-index: 1055 !important;
}

.backdrop-large {
    z-index: 1050 !important;
}

.card.no-stretch {
    height: auto;
}

#nps-plus-cohorts-card {
  border: 1px solid #7ebaff;
  box-shadow: 0px 0px 15px 0px #7ebaff80;
}

.table-wrapper {
  max-width: 100%;
  background: #fff;
/*  box-shadow: 0 2px 8px rgba(0,0,0,0.08);*/
  border-radius: 12px;
/*  padding: 24px;*/
  padding: 0px;
}

.cohort-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}

.cohort-table col:nth-child(1) { width: 140px; }
.cohort-table col:nth-child(2) { width: auto; }

.cohort-table th,
.cohort-table td {
  font-size: 13px;
  padding: 8px 10px;
  background-color: #fff;
  text-align: left;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #000000;
  font-weight: bold;
}

.cohort-table th {
  border-bottom: 1px solid #ccc;
}

.cohort-table .data-row td:first-child {
  text-align: right;
  padding-right: 16px;
}

.cohort-header {
  border-top: 2px solid #000;
  cursor: pointer;
}

.cohort-header:hover td {
  background-color: #e5f1ff;
}
.cohort-header:hover .clickable-cell-content {
  transform: translateX(5px);
}
.cohort-header:hover .arrow {
  opacity: 1;
  transform: translateX(0);
}

.spacer-row td {
  height: 16px;
  padding: 0;
  background: white;
  border: none;
}

.bar-container {
  width: 100%;
  display: flex;
  align-items: center;
  height: 16px;
  gap: 0;
}

.bar-labels {
  display: flex;
  width: 100%;
  margin-top: 6px;
  flex-wrap: wrap;
}

.bar-labels .label {
  font-size: 12px;
  color: #333;
  text-align: left;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  padding-right: 0px;
  padding-left: 0.5rem;
}

.tooltip.summary-tooltip .tooltip-inner {
  text-align: left;
}


.cohort-bar {
  height: 100%;
  display: inline-block;
  vertical-align: middle;
  border-radius: 0 8px 8px 0;
  animation: growBar 1s ease forwards;
  transform: scaleX(0);
  transform-origin: left;
}

@keyframes growBar {
  to { transform: scaleX(1); }
}

.cohort-label {
  flex-shrink: 0;
  font-size: 12px;
  color: #555;
}

.clickable-cell-content {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: transform 0.3s ease;
}

.arrow {
  opacity: 0;
  transform: translateX(-5px);
  transition: opacity 0.3s ease, transform 0.3s ease;
  font-size: 14px;
  color: #444;
}

.data-row {
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.data-row:hover td {
  background-color: #e5f1ff;
}
.data-row:hover .clickable-cell-content {
  transform: translateX(5px);
}
.data-row:hover .arrow {
  opacity: 1;
  transform: translateX(0);
}
.data-row:hover .pill-links {
  display: flex;
}

.group-color-1 .bar { background-color: #339af0; }
.group-color-2 .bar { background-color: #ff922b; }

.pill-links {
  display: none;
  margin-top: 6px;
  gap: 6px;
}
.pill-links a {
  display: inline-block;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 12px;
  color: #333;
  text-decoration: none;
  margin-right: 6px;
  transition: background-color 0.2s ease;
  font-weight: bold;
}
.pill-links a i {
  margin-right: 3px;
}
.pill-links a:hover {
  text-decoration: underline;
}

.show-more-row a {
  color: #007bff;
  cursor: pointer;
  text-decoration: none;
}
.show-more-row a:hover {
  text-decoration: underline;
}

/* Expanded row background */
.vip-header.expanded td,
.usertype-header.expanded td,
.state-header.expanded td {
  background-color: #f4f4f4;
}

/* Hidden rows for each group */
.hidden-vip,
.hidden-usertype,
.hidden-state {
  display: none;
}

@media (min-width: 1024px){
    .stats-container {
        max-width: 1400px;
    }
}

#breadcrumbCohort .dropdown.bootstrap-select {
  font-size: 13px;
    line-height: 1;
    margin: 0px;
    margin-bottom: 2px;
}
#breadcrumbCohort .bootstrap-select .btn {
    font-size: 13px;
    color: #105099 !important;
    border: 0px !important;
    padding: 0px 0px;
    border-radius: 0;
    background-color: transparent !important;
    font-weight: 400;
}

#breadcrumbCohort .dropdown-toggle:after {
  content: "\f0dd";
  margin-bottom: 4px;
}

#breadcrumbCohort .dropdown-menu .dropdown-item {
    font-size: 13px;
    color: #51005E;
}

.negative-all-stats-btn[data-l1="All Categories"] {
  display: none !important;
}

.alt-row > td {
  background-color: #f7fbff;
}
.alt-row > th {
  background-color: #f7fbff;
}

#nps-plus-insights-card {
    border: 1px solid #EF6265;
    box-shadow: 0px 0px 15px 0px #EF626580;
}

.highlights-table td,
.highlights-table th {
  color: #000000!important;
}

#stats-feedback {
    border: 0.5px solid #51005E;
/*    box-shadow: 0px 0px 15px 0px #51005E80;*/
}

.cohort-header-title {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: transform 0.3s ease;
}

.cohort-header-title .arrow {
  opacity: 0;
  transform: translateX(-5px);
  transition: opacity 0.3s ease, transform 0.3s ease;
  font-size: 14px;
  color: #444;
  margin-bottom: 4px;
}

.cohort-header:hover .cohort-header-title {
  transform: translateX(5px);
}

#highlight-content .card-header:first-child,
#overall-highlight-content .card-header:first-child
{
    border-radius: 0.5rem 0.5rem 0 0!important;
    border-bottom: 1px solid #eeeeee !important;
}

#highlight-content .card,
#overall-highlight-content .card 
{
  border: 1px solid #eeeeee!important;
  color: #000000!important;
    display: flex!important;
    flex-direction: column!important;
    height: 97%!important;
    transition: all 0.1s;
}

/*#highlight-content .card-header,
#overall-highlight-content .card-header
{
  background-color: #f1f8ff!important;
}*/

#highlight-content .card-footer, 
#overall-highlight-content .card-footer
{
  color: #000000!important;
  background-color: #ffffff!important;
  border: 0!important;
    margin-top: auto!important;
}

#highlight-content .card-body,
#overall-highlight-content .card-body
{
    flex: 1 1 auto;
}

#overall-highlight-content td,
#overall-highlight-content th {
  color: #000;
  padding: 5px 6px;
}

#overall-highlight-content .card:hover {
  box-shadow: 0px 0px 10px 0px #349AF0!important;
  cursor: pointer;
  transition: all 0.1s;
  transform: translateX(2px);
}

.table-2.text-cruxx-red > * {
    color: #EF6265!important;
}
.table-2.text-cruxx-green > * {
    color: #20d493!important;
}
.table-2.text-cruxx-yellow > * {
    color: #F99B0E!important;
}