 /* Main Adjustments */
 h4 {
     margin-bottom: 0.75rem;
     margin-top: 0.25rem;
 }

 .content {
     padding: 0.5rem 1rem;
 }



 /* Alternative: Override just card-body padding */
 .card-body {
     padding: 0.75rem 1rem !important;
     /* Equivalent to Bootstrap p-2 */
 }

 .col-md-3 {
     padding: 0 0.5rem !important;
 }

 .btn-microsoft {
     color: #fff;
     background-color: #000000;
     border-color: #000000;
     transition: all 0.3s ease;
 }

 .btn-microsoft:hover {
     color: #fff;
     background-color: #4d4d4d;
     border-color: #4d4d4d;
 }

 .btn-microsoft:focus,
 .btn-microsoft.focus {
     color: #fff;
     background-color: #4d4d4d;
     border-color: #4d4d4d;
     box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, .25);
 }

 .btn-microsoft.disabled,
 .btn-microsoft:disabled {
     color: #fff;
     background-color: #000000;
     border-color: #000000;
 }

 .btn-microsoft:not(:disabled):not(.disabled):active,
 .btn-microsoft:not(:disabled):not(.disabled).active,
 .show>.btn-microsoft.dropdown-toggle {
     color: #fff;
     background-color: #333333;
     border-color: #333333;
 }

 .btn-microsoft:not(:disabled):not(.disabled):active:focus,
 .btn-microsoft:not(:disabled):not(.disabled).active:focus,
 .show>.btn-microsoft.dropdown-toggle:focus {
     box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, .25);
 }

 .flag-icon {
     width: 20px;
     height: auto;
 }

 .tab-content {
     background-color: white;
     border: 1px solid #dee2e6;
     padding: 20px;
     margin-bottom: 20px;
 }

 .nav-tabs .nav-link.active {
     background-color: white;
     border-bottom: 0px;
 }

 .nav-tabs .nav-link {
     background-color: #f8f9fa;
 }

 .nav-tabs .nav-link {
     background-color: #f8f9fa;
 }

 .sidebar .sidebar-content {
     background-color: #142A3D;
 }


 /* Call Record Details Page */
 .details-list {
     list-style: none;
     padding: 0;
     margin: 0.5rem 0;
 }

 .detail-item {
     display: flex;
     align-items: center;
     padding: 0.1rem;
     gap: 0.5rem;
 }

 .detail-label {
     flex: 0 0 auto;
     min-width: 70px;
     /* Adjust based on your longest label */
 }

 .detail-value {
     flex: 1;
     font-weight: 500;
     color: #495057;
 }








 .score-list {
     list-style: none;
     padding: 0;
     margin-top: 0.5rem;
 }

 .score-item {
     display: flex;
     align-items: center;
     padding: 0.1rem;
     gap: 0.5rem;
 }

 .score-label {
     flex: 0 0 auto;
     min-width: 165px;
     /* Adjust based on your longest label */
 }

 .score-value {
     display: flex;
     align-items: center;
     justify-content: center;
     padding: 0.1rem 1rem;
     gap: 0.5rem;
     width: 4rem;
     border-radius: 6px;
     text-align: center;
     color: white;
 }




 #datatables-responsive tbody tr {
     cursor: pointer;
 }

 #datatables-responsive tbody tr.table-hover-highlight {
     background-color: #e9ecef !important;
 }





 /* AI Assistant message bubbles */

 .d-flex {
     display: flex;
 }

 .user-message {
     justify-content: flex-end;
 }

 .assistant-message {
     justify-content: flex-start;
 }

 .bg-light {
     background-color: #f8f9fa !important;
 }

 .bg-primary {
     background-color: #0d6efd !important;
 }

 .chat-container {
     height: 100vh;
     display: flex;
     flex-direction: column;
 }

 #chat-messages {
     flex: 1;
     overflow-y: auto;
     padding-bottom: 20px;
     /* Add some padding at the bottom */
 }

 .input-group-container {
     padding: 15px;
     background-color: #f8f9fa;
     border-top: 1px solid #dee2e6;
 }

 .overflow-auto {
     scrollbar-width: thin;
     scrollbar-color: rgba(0, 0, 0, 0.2) transparent;
 }

 .overflow-auto::-webkit-scrollbar {
     width: 6px;
 }

 .overflow-auto::-webkit-scrollbar-thumb {
     background-color: rgba(0, 0, 0, 0.2);
     border-radius: 3px;
 }






 /* Reporting colour bands */
 .sc-bg-0 {
     background-color: #97C5EB !important;
 }

 .sc-c-0 {
     color: #97C5EB !important;
 }

 .sc-bg-1 {
     background-color: #CC6F6F !important;
 }

 .sc-c-1 {
     color: #CC6F6F !important;
 }

 .sc-bg-2 {
     background-color: #CC8B6F !important;
 }

 .sc-c-2 {
     color: #CC8B6F !important;
 }

 .sc-bg-3 {
     background-color: #CCA36F !important;
 }

 .sc-c-3 {
     color: #CCA36F !important;
 }

 .sc-bg-4 {
     background-color: #CCB26F !important;
 }

 .sc-c-4 {
     color: #CCB26F !important;
 }

 .sc-bg-5 {
     background-color: #CCC36F !important;
 }

 .sc-c-5 {
     color: #CCC36F !important;
 }

 .sc-bg-6 {
     background-color: #B9CC6F !important;
 }

 .sc-c-6 {
     color: #B9CC6F !important;
 }

 .sc-bg-7 {
     background-color: #A1CC6F !important;
 }

 .sc-c-7 {
     color: #A1CC6F !important;
 }

 .sc-bg-8 {
     background-color: #89CC6F !important;
 }

 .sc-c-8 {
     color: #89CC6F !important;
 }

 .sc-bg-9 {
     background-color: #6FCC8A !important;
 }

 .sc-c-9 {
     color: #6FCC8A !important;
 }

 .sc-bg-10 {
     background-color: #6FCC94 !important;
 }

 .sc-c-10 {
     color: #6FCC94 !important;
 }


 /* Vector query results */
 .query-results {
     max-width: 800px;
     margin: 0 auto;
     padding: 20px;
     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
 }

 .query-results h2 {
     color: #2c3e50;
     margin-top: 1.5em;
     margin-bottom: 0.5em;
     font-size: 1.5em;
 }

 .query-results h3 {
     color: #34495e;
     margin-top: 1.2em;
     margin-bottom: 0.5em;
     font-size: 1.2em;
 }

 .query-results p {
     line-height: 1.6;
     margin: 0.8em 0;
     color: #333;
 }

 .query-results ul {
     margin: 0.5em 0 1em 0;
     padding-left: 20px;
 }

 .query-results li {
     line-height: 1.5;
     margin: 0.3em 0;
     color: #333;
 }

 .query-results .error {
     color: #e74c3c;
     font-weight: bold;
 }
