﻿.dataTable tbody {
  font-size: 12px;
}

/*.dataTable thead {background:#395a99;color:white}
.dataTable tfoot {background:#395a99;color:white}*/
.dataTable th {
  text-align: left;
}

.dataTable th:nth-child(11) {
  text-align: right;
}

.dataTable th:nth-child(12) {
  text-align: right;
}

.dataTable th:nth-child(13) {
  text-align: right;
}

.dataTable td:nth-child(11) {
  text-align: right;
}

.dataTable td:nth-child(12) {
  text-align: right;
}

.dataTable td:nth-child(13) {
  text-align: right;
}

.dataTable td {
  white-space: nowrap;
}

.dataTable th {
  white-space: nowrap;
}

/*
.dataTable tbody tr.selected{background-color:#b0bed9}

/* section for shading of sorted column */

/*.dataTable.hover tbody tr:hover,.dataTable.hover tbody tr.odd:hover,.dataTable.hover tbody tr.even:hover,.dataTable tbody tr:hover,.dataTable tbody tr.odd:hover,.dataTable tbody tr.even:hover{background-color:#f5f5f5} 
.dataTable.hover tbody tr:hover.selected,.dataTable.hover tbody tr.odd:hover.selected,.dataTable.hover tbody tr.even:hover.selected,.dataTable tbody tr:hover.selected,.dataTable tbody tr.odd:hover.selected,.dataTable tbody tr.even:hover.selected{background-color:#a9b7d1}
.dataTable.order-column tbody tr>.sorting_1,.dataTable.order-column tbody tr>.sorting_2,.dataTable.order-column tbody tr>.sorting_3,.dataTable tbody tr>.sorting_1,.dataTable tbody tr>.sorting_2,.dataTable tbody tr>.sorting_3{background-color:#f9f9f9 }
.dataTable.order-column tbody tr.selected>.sorting_1,.dataTable.order-column tbody tr.selected>.sorting_2,.dataTable.order-column tbody tr.selected>.sorting_3,.dataTable tbody tr.selected>.sorting_1,.dataTable tbody tr.selected>.sorting_2,.dataTable tbody tr.selected>.sorting_3{background-color:#acbad4 }*/


/* 
.dataTable tbody tr.odd>.sorting_1,.dataTable.order-column.stripe tbody tr.odd>.sorting_1{background-color:#f1f1f1 } 
.dataTable tbody tr.odd>.sorting_2,.dataTable.order-column.stripe tbody tr.odd>.sorting_2{background-color:#f3f3f3 }
.dataTable tbody tr.odd>.sorting_3,.dataTable.order-column.stripe tbody tr.odd>.sorting_3{background-color:#f5f5f5 }

.dataTable tbody tr.odd.selected>.sorting_1,.dataTable.order-column.stripe tbody tr.odd.selected>.sorting_1{background-color:#a6b3cd }
.dataTable tbody tr.odd.selected>.sorting_2,.dataTable.order-column.stripe tbody tr.odd.selected>.sorting_2{background-color:#a7b5ce }
.dataTable tbody tr.odd.selected>.sorting_3,.dataTable.order-column.stripe tbody tr.odd.selected>.sorting_3{background-color:#a9b6d0 }
.dataTable tbody tr.even>.sorting_1,.dataTable.order-column.stripe tbody tr.even>.sorting_1{background-color:#f9f9f9 }
.dataTable tbody tr.even>.sorting_2,.dataTable.order-column.stripe tbody tr.even>.sorting_2{background-color:#fbfbfb }
.dataTable tbody tr.even>.sorting_3,.dataTable.order-column.stripe tbody tr.even>.sorting_3{background-color:#fdfdfd }
.dataTable tbody tr.even.selected>.sorting_1,.dataTable.order-column.stripe tbody tr.even.selected>.sorting_1{background-color:#acbad4 }
.dataTable tbody tr.even.selected>.sorting_2,.dataTable.order-column.stripe tbody tr.even.selected>.sorting_2{background-color:#adbbd6 }
.dataTable tbody tr.even.selected>.sorting_3,.dataTable.order-column.stripe tbody tr.even.selected>.sorting_3{background-color:#afbdd8 }
.dataTable tbody tr:hover>.sorting_1,.dataTable tbody tr.odd:hover>.sorting_1,.dataTable tbody tr.even:hover>.sorting_1,.dataTable.order-column.hover tbody tr:hover>.sorting_1,.dataTable.order-column.hover tbody tr.odd:hover>.sorting_1,.dataTable.order-column.hover tbody tr.even:hover>.sorting_1{background-color:#eaeaea }
.dataTable tbody tr:hover>.sorting_2,.dataTable tbody tr.odd:hover>.sorting_2,.dataTable tbody tr.even:hover>.sorting_2,.dataTable.order-column.hover tbody tr:hover>.sorting_2,.dataTable.order-column.hover tbody tr.odd:hover>.sorting_2,.dataTable.order-column.hover tbody tr.even:hover>.sorting_2{background-color:#ebebeb }
.dataTable tbody tr:hover>.sorting_3,.dataTable tbody tr.odd:hover>.sorting_3,.dataTable tbody tr.even:hover>.sorting_3,.dataTable.order-column.hover tbody tr:hover>.sorting_3,.dataTable.order-column.hover tbody tr.odd:hover>.sorting_3,.dataTable.order-column.hover tbody tr.even:hover>.sorting_3{background-color:#eee }
.dataTable tbody tr:hover.selected>.sorting_1,.dataTable tbody tr.odd:hover.selected>.sorting_1,.dataTable tbody tr.even:hover.selected>.sorting_1,.dataTable.order-column.hover tbody tr:hover.selected>.sorting_1,.dataTable.order-column.hover tbody tr.odd:hover.selected>.sorting_1,.dataTable.order-column.hover tbody tr.even:hover.selected>.sorting_1{background-color:#a1aec7 }
.dataTable tbody tr:hover.selected>.sorting_2,.dataTable tbody tr.odd:hover.selected>.sorting_2,.dataTable tbody tr.even:hover.selected>.sorting_2,.dataTable.order-column.hover tbody tr:hover.selected>.sorting_2,.dataTable.order-column.hover tbody tr.odd:hover.selected>.sorting_2,.dataTable.order-column.hover tbody tr.even:hover.selected>.sorting_2{background-color:#a2afc8 }
.dataTable tbody tr:hover.selected>.sorting_3,.dataTable tbody tr.odd:hover.selected>.sorting_3,.dataTable tbody tr.even:hover.selected>.sorting_3,.dataTable.order-column.hover tbody tr:hover.selected>.sorting_3,.dataTable.order-column.hover tbody tr.odd:hover.selected>.sorting_3,.dataTable.order-column.hover tbody tr.even:hover.selected>.sorting_3{background-color:#a4b2cb }

*/

/*.dataTable.no-footer{border-bottom:1px solid #111}
.dataTable.nowrap th,.dataTable.nowrap td{white-space:nowrap }*/

.table>thead>tr>th {
  border-bottom: 1px solid black;
}

.table2 {
  width: 100%;
  max-width: 100%;
  margin-bottom: 20px;
}

.table2>thead>tr>th,
.table2>tbody>tr>th,
.table2>tfoot>tr>th,
.table2>thead>tr>td,
.table2>tbody>tr>td,
.table2>tfoot>tr>td {
  border-top: 1px solid #e7eaec;
  line-height: 1.42857;
  padding: 8px;
  vertical-align: top;
}

.table_thin {
  width: 100%;
  max-width: 100%;
  font-size: 13px;
}

.table_thin>thead>tr>th,
.table_thin>tbody>tr>th,
.table_thin>tfoot>tr>th,
.table_thin>thead>tr>td,
.table_thin>tbody>tr>td,
.table_thin>tfoot>tr>td {
  border-top: 1px solid #e7eaec;
  line-height: 1.42857;
  padding: 4px;
  vertical-align: top;
}

/* INVOICE */
.invoice-table tbody>tr>td:last-child,
.invoice-table tbody>tr>td:nth-child(8),
.invoice-table tbody>tr>td:nth-child(7),
.invoice-table tbody>tr>td:nth-child(6),
.invoice-table thead>tr>th:last-child,
.invoice-table thead>tr>th:nth-child(8),
.invoice-table thead>tr>th:nth-child(7),
.invoice-table thead>tr>th:nth-child(6) {
  text-align: right;
}

.invoice-table td {
  padding: .5rem .25rem;
}

.invoice-total>tbody>tr>td {
  padding: 8px;
}

.invoice-total>tbody>tr>td:first-child {
  text-align: right;
}

.invoice-total>tbody>tr>td {
  border: 0 none;
}

.invoice-total>tbody>tr>td:last-child {
  border-bottom: 1px solid #DDDDDD;
  text-align: right;
  width: 15%;
}

/* notification bubbles */
#noti_Container {
  position: relative;
  /*border:1px solid blue;*/
  width: 38px;
  height: 16px;
}

.noti_bubble {
  position: absolute;
  top: -6px;
  right: -6px;
  padding: 1px 2px 1px 2px;
  background-color: red;
  color: white;
  font-weight: bold;
  font-size: 0.75em;

  border-radius: 30px;
  box-shadow: 1px 1px 1px gray;
}

/* Custom DataTables styles to match Bootstrap theme * /
table.dataTable {
    width: 100%;
    margin: 0 auto;
    clear: both;
    border-spacing: 0;
}

table.dataTable thead th {
    background-color: #f8f9fa;
	font-size: 13px;
	font-weight: 700;
}

table.dataTable tbody tr {
   background-color: #fff; 
}

table.dataTable tbody tr:nth-of-type(odd) {
    background-color: #f9f9f9;
}	
	
/* Example custom styles to match Phoenix theme */
table.dataTable th,
table.dataTable td {
  padding: 1rem;
  /* Adjust padding to match Phoenix theme */
  text-align: left;
  /* Center align text */
}

/*
table.dataTable th {
    font-weight: bold; /* Make headers bold * /
    background-color: #e9ecef; /* Adjust header background color * /
}
*/

/* Custom DataTables sorting icons */
table.dataTable thead .sorting:before,
table.dataTable thead .sorting:after,
table.dataTable thead .sorting_asc:before,
table.dataTable thead .sorting_desc:before,
table.dataTable thead .sorting_asc_disabled:before,
table.dataTable thead .sorting_desc_disabled:before {
  display: none;
}

table.dataTable thead .sorting:after,
table.dataTable thead .sorting_asc:after,
table.dataTable thead .sorting_desc:after,
table.dataTable thead .sorting_asc_disabled:after,
table.dataTable thead .sorting_desc_disabled:after {
  font-family: FontAwesome;
  display: inline-block;
  padding-right: 8px;
  opacity: 0.5;
}

table.dataTable thead .sorting:after {
  content: "\f0dc";
  /* FontAwesome icon for sorting */
}

table.dataTable thead .sorting_asc:after {
  content: "\f0de";
  /* FontAwesome icon for sorting ascending */
}

table.dataTable thead .sorting_desc:after {
  content: "\f0dd";
  /* FontAwesome icon for sorting descending */
}

/*** add clear x back for search fields ***/
input[type=search] {
  -webkit-appearance: searchfield;
  appearance: searchfield;
}

input[type=search]::-webkit-search-cancel-button {
  -webkit-appearance: none;
  /* Remove default styling */
  height: 14px;
  width: 14px;
  /* background: url('delete-black.png') no-repeat center center; */
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23777' stroke='%23777' stroke-width='2'><path d='M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'/></svg>");

  /* Add other styles as needed */
}


/* PAGINATIN */
.pagination>.active>a,
.pagination>.active>span,
.pagination>.active>a:hover,
.pagination>.active>span:hover,
.pagination>.active>a:focus,
.pagination>.active>span:focus {
  background-color: #f4f4f4;
  border-color: #DDDDDD;
  color: inherit;
  cursor: default;
  z-index: 2;
}


.pagination>li>a,
.pagination>li>span {
  /* background-color: #FFFFFF;
  border: 1px solid #DDDDDD; */
  color: inherit;
  float: left;
  line-height: 1.42857;
  margin-left: -1px;
  padding: 4px 10px;
  position: relative;
  text-decoration: none;
}


div.dataTables_wrapper div.dataTables_paginate {
  float: right;
  font-size: 14px;
}

div.dataTables_wrapper div.dataTables_info {
  margin-top: 10px;
  font-size: 14px;
}

div.dataTables_wrapper div.dataTables_length,
div.dataTables_filter label {
  font-size: 14px;
}

/* Custom CSS to make length menu and search box inline */
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter {
  display: inline-block;
  margin-right: 20px;
}

.dataTables_wrapper .dataTables_filter {
  float: right;
}

.dataTables_wrapper .dataTables_length select {
  display: inline-block;
  width: auto;
}

@media (max-width: 1000px) {

  /* .dataTables_filter, .dataTables_length { display: none; } */
  .dataTables_wrapper .dataTables_filter {
    margin-top: 0px;
    float: none;
    display: block;
    margin-right: 0px;
  }

  .dataTables_wrapper .dataTables_length,
  .DTTT_container,
  #search_box {
    display: none;
  }

  .dataTables_wrapper .dataTable td {
    white-space: normal;
  }

  /*.dataTable tbody {font-size:15px;}*/
}


/* PROFILE */
.profile-content {
  border-top: none !important;
}

.profile-stats {
  margin-right: 10px;
}

.profile-image {
  width: 120px;
  float: left;
}

.profile-image img {
  width: 96px;
  height: 96px;
}

.profile-info {
  margin-left: 120px;
}

/* MICROPHONE ICONE */
.red-color {
  color: red !important;
}


body {
  /*
	font-family: "open sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
	*/
  font-size: 13px;
}

@media (max-width: 1200px) {
  .hide-sm {
    display: none;
  }
}

.float-right {
  float: right !important;
}

.pull-right {
  float: right !important;
}

.label-right {
  text-align: right;
  font-size: 13px;
  font-weight: bold;
  padding-right: 1.5rem;
}



@media (min-width: 900px) {
  .lbl-right {
    text-align: right;
  }
}


.lbl-right {
  font-size: 13px;
  font-weight: bold;
  padding-right: 1.5rem;
  opacity: 0.7;
}




/*
.form-group{
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	margin-bottom: 1rem; 
	/* flex-shrink: 0; * /
	width: 100%;
	max-width: 100%;
	margin-right: -15px;
	margin-left: -15px;
}
*/

@media (min-width: 900px) {
  .control-label {
    text-align: right;
  }
}

.control-label {
  margin-top: 10px;
  font-size: 13px;
  font-weight: bold;
  padding-right: 1.5rem;
  opacity: 0.7;
}


.tab-pane.active {
  border: 1px solid #ddd;
  /* Adjust the color and thickness as needed */
  padding: 20px;
  /* Optional: add padding inside the border */
}

.card-body .nav-link {
  padding: 12px;
  margin-bottom: -1px;
}

.card-body .nav-link.active {
  border-top: 1px solid #ddd;
  /* Border at the top */
  border-left: 1px solid #ddd;
  /* Border on the left */
  border-right: 1px solid #ddd;
  /* Border on the right */
  border-bottom: 1px solid transparent;
  /* Remove the bottom border */
  background-color: #fff;
  /* Optional: Set the background color for the active tab */
}

.table_patient {
  font-size: 13px;
}

.table_patient td {
  white-space: nowrap;
  padding: 8px;
}

h2 {
  font-size: 22px;
}

h2 a {
  color: gray;
}

/*
.table_patient tr{
	border-top: 1px solid lightgray; 
}	
*/

.table_patient a {
  color: gray;
  font-size: 13px;
}


.content {
  padding-left: 20px !important;
  padding-right: 20px !important;
  padding-top: 84px !important;
}

[data-bs-theme="dark"] .table2>thead>tr>th,
[data-bs-theme="dark"] .table2>tbody>tr>th,
[data-bs-theme="dark"] .table2>tfoot>tr>th,
[data-bs-theme="dark"] .table2>thead>tr>td,
[data-bs-theme="dark"] .table2>tbody>tr>td,
[data-bs-theme="dark"] .table2>tfoot>tr>td {
  border-top: 1px solid var(--phoenix-border-color-translucent);
}

[data-bs-theme="dark"] .table2>thead>tr>th {
  border-bottom: 2px solid var(--phoenix-border-color-translucent);
}

/* Dark mode override */
[data-bs-theme="dark"] .card-body .nav-link.active {
  border-top: 1px solid var(--phoenix-border-color-translucent);
  border-left: 1px solid var(--phoenix-border-color-translucent);
  border-right: 1px solid var(--phoenix-border-color-translucent);
  border-bottom: 1px solid var(--phoenix-card-bg);
}

/* Summernote toolbar styling for light/dark mode - SPECIFIC TARGETING */
/* Target both container-wrapped and direct Summernote instances */
.summernote-container .note-toolbar,
#notes+.note-editor .note-toolbar,
#organization_notes+.note-editor .note-toolbar {
  background-color: #e9ecef;
  border-bottom: 1px solid #dee2e6;
}

/* Dark mode - darker toolbar */
[data-bs-theme="dark"] .summernote-container .note-toolbar,
[data-bs-theme="dark"] #notes+.note-editor .note-toolbar,
[data-bs-theme="dark"] #organization_notes+.note-editor .note-toolbar {
  background-color: #343a40;
  border-bottom: 1px solid #495057;
}

/* Dark mode - white text in editor */
[data-bs-theme="dark"] .summernote-container .note-editable,
[data-bs-theme="dark"] #notes+.note-editor .note-editable,
[data-bs-theme="dark"] #organization_notes+.note-editor .note-editable {
  color: #fff;
}

/* Call log outgoing call styling */
/* Light mode - keep existing light grey */
#callLogsTable .outgoing-call-row {
  background-color: #f5f5f5 !important;
}

/* Dark mode - darker grey for outgoing calls */
[data-bs-theme="dark"] #callLogsTable .outgoing-call-row {
  background-color: #3d4144 !important;
}

/* Dark mode pagination - darker active page background only */
[data-bs-theme="dark"] .dataTables_paginate .paginate_button.active a {
  background-color: #2d3436 !important;
}

/* Dark mode summernote buttons - darker background and white icons */
[data-bs-theme="dark"] .note-btn {
  background-color: #495057 !important;
}

[data-bs-theme="dark"] .note-btn i {
  color: #fff !important;
}

/* SweetAlert v1 Dark Mode Theming */
[data-bs-theme="dark"] .sweet-alert {
  background-color: var(--phoenix-gray-800, #2c2e33) !important;
  border: 1px solid var(--phoenix-border-color-translucent, #404040) !important;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5) !important;
}

[data-bs-theme="dark"] .sweet-alert h2 {
  color: var(--phoenix-gray-100, #f1f3f6) !important;
}

[data-bs-theme="dark"] .sweet-alert p {
  color: #fff !important;
}

/* SweetAlert buttons dark mode */
[data-bs-theme="dark"] .sweet-alert .sa-button-container button.cancel {
  background-color: var(--phoenix-gray-600, #495057) !important;
  color: #fff !important;
  border: 1px solid var(--phoenix-gray-500, #6c757d) !important;
}

[data-bs-theme="dark"] .sweet-alert .sa-button-container button.cancel:hover {
  background-color: var(--phoenix-gray-700, #3a3d43) !important;
}

[data-bs-theme="dark"] .sweet-alert .sa-button-container button.confirm {
  /* Keep the existing color but ensure text is visible */
  color: #fff !important;
}

/* SweetAlert input field dark mode */
[data-bs-theme="dark"] .sweet-alert input[type="text"] {
  background-color: var(--phoenix-gray-700, #3a3d43) !important;
  color: var(--phoenix-gray-100, #f1f3f6) !important;
  border: 1px solid var(--phoenix-border-color-translucent, #404040) !important;
}

/* SweetAlert error container dark mode */
[data-bs-theme="dark"] .sweet-alert .sa-error-container {
  background-color: var(--phoenix-danger, #e74c3c) !important;
}

[data-bs-theme="dark"] .sweet-alert .sa-error-container p {
  color: #fff !important;
}

/* Nav tabs dark mode theming - targets all nav-link tabs across the site */
[data-bs-theme="dark"] .nav-link.active {
  background-color: var(--phoenix-gray-700, #3a3d43) !important;
  color: #fff !important;
  border-color: var(--phoenix-border-color-translucent, #404040) !important;
}

[data-bs-theme="dark"] .nav-link:hover {
  color: var(--phoenix-gray-100, #f1f3f6) !important;
  background-color: var(--phoenix-gray-600, #495057) !important;
}

/* Tab content border dark mode - more specific targeting */
[data-bs-theme="dark"] .tab-content,
[data-bs-theme="dark"] .tab-pane.active {
  border: 1px solid var(--phoenix-border-color-translucent, #404040) !important;
}

/* Speech recognition results container dark mode */
[data-bs-theme="dark"] #results {
  background-color: transparent !important;
}

[data-bs-theme="dark"] #results .final,
[data-bs-theme="dark"] #results .interim {
  color: #fff !important;
}

/* Nav top callback and incoming call info boxes dark mode */
[data-bs-theme="dark"] #callbackInfo,
[data-bs-theme="dark"] #incomingCallInfo {
  background-color: var(--phoenix-gray-700, #3a3d43) !important;
  border-color: var(--phoenix-border-color-translucent, #404040) !important;
}

/* Summernote x Phoenix theme - Unified styling for all Summernote instances */
.note-editor.note-frame {
  background: var(--phoenix-card-bg);
  border: 1px solid var(--phoenix-border-color-translucent);
  color: var(--bs-body-color);
}

.note-editor .note-toolbar,
.note-editor .note-popover .popover-content {
  background: var(--phoenix-card-bg);
  border-bottom: 1px solid var(--phoenix-border-color-translucent);
}

/* Buttons in toolbar - Phoenix theme with no borders */
.note-editor .note-toolbar .btn,
.note-editor .note-popover .btn {
  padding: var(--phoenix-pagination-padding-y) var(--phoenix-pagination-padding-x);
  font-size: var(--phoenix-pagination-font-size);
  color: var(--phoenix-pagination-color);
  background-color: var(--phoenix-pagination-bg);
  border: none !important;
  /* Remove all button borders for clean Phoenix look */
  border-radius: var(--phoenix-pagination-border-radius);
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

/* Hide dropdown arrows/carets in Summernote toolbar for clean Phoenix look */
.note-editor .note-toolbar .dropdown-toggle::after,
.note-editor .note-popover .dropdown-toggle::after,
.note-editor .note-toolbar .note-btn-group .dropdown-toggle::after {
  display: none !important;
}

/* Additional Summernote button styling */
.note-editor .note-toolbar .note-btn,
.note-editor .note-toolbar .note-btn-group .note-btn {
  border: none !important;
  background: transparent;
  padding: 4px 8px;
  border-radius: var(--phoenix-pagination-border-radius);
  color: #6c757d !important;
  /* Lighter gray icons instead of black */
}

/* Lighter icons for Summernote toolbar */
.note-editor .note-toolbar .note-btn i,
.note-editor .note-toolbar .note-btn-group .note-btn i,
.note-editor .note-toolbar [class*="note-icon"] {
  color: #6c757d !important;
  /* Bootstrap gray-600 - lighter than black */
}

/* Hover state for lighter icons */
.note-editor .note-toolbar .note-btn:hover i,
.note-editor .note-toolbar .note-btn-group .note-btn:hover i,
.note-editor .note-toolbar .note-btn:hover [class*="note-icon"] {
  color: #495057 !important;
  /* Slightly darker on hover for feedback */
}

/* Dark mode - lighter icons for Summernote toolbar */
[data-bs-theme="dark"] .note-editor .note-toolbar .note-btn,
[data-bs-theme="dark"] .note-editor .note-toolbar .note-btn-group .note-btn {
  color: #adb5bd !important;
  /* Lighter gray for dark mode */
}

[data-bs-theme="dark"] .note-editor .note-toolbar .note-btn i,
[data-bs-theme="dark"] .note-editor .note-toolbar .note-btn-group .note-btn i,
[data-bs-theme="dark"] .note-editor .note-toolbar [class*="note-icon"] {
  color: #adb5bd !important;
  /* Bootstrap gray-400 for dark mode */
}

[data-bs-theme="dark"] .note-editor .note-toolbar .note-btn:hover i,
[data-bs-theme="dark"] .note-editor .note-toolbar .note-btn-group .note-btn:hover i,
[data-bs-theme="dark"] .note-editor .note-toolbar .note-btn:hover [class*="note-icon"] {
  color: #dee2e6 !important;
  /* Lighter on hover in dark mode */
}

/* Button states - no borders for clean Phoenix look */
.note-editor .note-toolbar .btn:hover,
.note-editor .note-popover .btn:hover {
  color: var(--phoenix-pagination-hover-color);
  background-color: var(--phoenix-pagination-hover-bg);
  border: none !important;
}

.note-editor .note-toolbar .btn:focus,
.note-editor .note-popover .btn:focus {
  color: var(--phoenix-pagination-focus-color);
  background-color: var(--phoenix-pagination-focus-bg);
  box-shadow: var(--phoenix-pagination-focus-box-shadow);
  border: none !important;
}

.note-editor .note-toolbar .btn.active,
.note-editor .note-toolbar .btn:active,
.note-editor .note-popover .btn.active,
.note-editor .note-popover .btn:active {
  color: var(--phoenix-pagination-active-color);
  background-color: var(--phoenix-pagination-active-bg);
  border: none !important;
}

.note-editor .note-toolbar .btn.disabled,
.note-editor .note-toolbar .btn:disabled,
.note-editor .note-popover .btn.disabled,
.note-editor .note-popover .btn:disabled {
  color: var(--phoenix-pagination-disabled-color);
  background-color: var(--phoenix-pagination-disabled-bg);
  border: none !important;
}

/* Editor surface */
.note-editor .note-editing-area .note-editable {
  background: var(--bs-body-bg);
  color: var(--bs-body-color);
}

.note-editor .note-editing-area .note-placeholder {
  color: var(--bs-secondary-color);
}

/* Code view */
.note-editor .note-codable {
  background: var(--bs-body-bg);
  color: var(--bs-body-color);
  border-color: var(--phoenix-border-color-translucent);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
}

/* Status bar / resizer */
.note-editor .note-statusbar {
  background: transparent;
  border-top: 1px solid var(--phoenix-border-color-translucent);
}

.note-editor .note-resizebar .note-icon-bar {
  background: var(--bs-border-color);
}

/* Dropdown menus */
.note-editor .dropdown-menu {
  background: var(--bs-body-bg);
  color: var(--bs-body-color);
  border-color: var(--phoenix-border-color-translucent);
}

.note-editor .dropdown-menu .dropdown-item {
  color: var(--bs-body-color);
}

.note-editor .dropdown-menu .dropdown-item:hover {
  background: var(--bs-tertiary-bg);
}

/* Trial disabled styling for navigation items */
.trial-disabled {
  opacity: 0.6;
  cursor: pointer !important;
}

.trial-disabled:hover {
  opacity: 0.8;
}

/* Fix for sidebar toggle button - override Bootstrap's navbar-expand .navbar-toggler { display: none; } */
.navbar-top .navbar-toggler.navbar-toggler-humburger-icon {
  display: flex !important;
  margin-left: -0.5rem;
}