:root {
	--color-primary: #0163BA;
}

body{
	font-family: 'Inter' !important;
	font-style: normal !important;
	background-color: #EBEDEF;
}
.error_field{
	/* box-shadow: rgba(247, 3, 3, 0.35) 0px 5px 15px; */
	border : 1px solid red;
}
.error_text{
	color: red;
}

/* Toast Styling */
.toast-info {
	background-color: var(--color-primary);
}

/* Fonts */
.font-1{
	font-family: 'DM Sans';
}
.fs-7{
	font-size: 12px;
}

/* Background */
.bg-primary-color{
	background-color: var(--color-primary) !important;
}
.bg-secondary-color{
	background-color: #d8e8f8;
}
.bg-blue-color
{
	background-color:#F3F7FD;
}
.bg-grey{
	background-color: #E0E0E0;
}
.bg-light-grey {
	background-color: #F0F0F0;
}
.bg-lightest-grey {
	background-color: #FBFBFB;
}
.bg-light-blue {
	background-color: #E6EEFF;
}
.bg-low-risk{
	background-color: #B3DCB8;
}
.bg-high-risk{
	background-color: #F0C7C7;
}
.bg-moderate-risk{
	background-color: #F5E19B;
}
/* TEXT */
.icon-primary-color{
	color: var(--color-primary);
}
.text-primary-color{
	color: #202C3D;
}
.text-secondary-color{
	color: #4A4478;
}
.text-heading-color{
	color: #2B2B2B;
}
.text-brand-color{
	color: var(--color-primary);
}
.text-grey{
	color: #4A4A4A !important;
}
.text-light-blue{
	color: #F3F7FD;
}
.text-dark-blue{
	color: #1c196d;
}
.text-low-risk{
	color: #B3DCB8;
}
.text-high-risk{
	color: #F0C7C7;
}
.text-moderate-risk{
	color: #F5E19B;
}
.text-inactive{
	color: #5B6471 !important;
}
.text-inactive:hover{
		color: var(--color-primary) !important;
}
.text-inactive.active{
	color: var(--color-primary) !important;
}
.nav-pills-font {
	color: var(--color-primary) !important;
}
.nav-pills-font:hover{
	color: white !important;
	background-color: var(--color-primary) !important;
}
.nav-pills-font.active{
	color: white !important;
	background-color: var(--color-primary) !important;
}


.text-processing{
	align-items: center;
	padding: 0px 6px;
	background: #CFE9D3;
	border-radius: 2px;
	font-weight: 400;
	font-size: 8px;
	line-height: 150%;
	letter-spacing: 0.0015em;
	color: #033409;
}
.text-uploading, .text-Uploading, .text-Processing, [class^="text-Moving"][class*="to"][class*="Storage"], [class^="text-Dry-Run"][class*="processing"], [class^="text-Partly"][class*="Processed"]{
	align-items: center;
	padding: 0px 6px;
	background: #F5DFAD;
	border-radius: 2px;
	font-weight: 400;
	font-size: 11px;
	line-height: 150%;
	letter-spacing: 0.0015em;
	color: #382A08;
}
.text-uploaded, .text-Uploaded, .text-Processed, [class^="text-In"][class*="Storage"], [class^="text-Dry-Run"][class*="successful"] {
	align-items: center;
	padding: 0px 6px;
	background: #D3E5F4;
	border-radius: 2px;
	font-weight: 400;
	font-size: 11px;
	line-height: 150%;
	letter-spacing: 0.0015em;
	color: #042D4D;
}
.text-transferring{
	align-items: center;
	padding: 0px 6px;
	background: #F3F4F5;
	border-radius: 2px;
	font-weight: 400;
	font-size: 11px;
	line-height: 150%;
	letter-spacing: 0.0015em;
	color: #202C3D;
}
.text-failed, [class^="text-Failed"][class*="to"][class*="Move"], [class^="text-Dry-Run"][class*="failed"]{
	align-items: center;
	padding: 0px 6px;
	background: #F5DCDC;
	border-radius: 2px;
	font-weight: 400;
	font-size: 11px;
	line-height: 150%;
	letter-spacing: 0.0015em;
	color: #5A0D0D;
}


/* Text Box Design */
.input-wrapper {
	position: relative;
}
  
.input-wrapper .il-upper-dropdown {
	border: 1px solid rgba(0, 0, 0, 0.23);
	position: relative;
	width: 130px;
	margin: 10px; 
	height: 40px;
	background-color: #EBEDEF;
}
  
.input-wrapper label {
	position: absolute;
	top: -1.5ex;
	z-index: 1;
	left: 1em;
	background-color: #EBEDEF;
	padding: 0 5px;
	color: rgba(0, 0, 0, 0.50);
}
.input-wrapper select{
	background: transparent;
	border: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	text-indent: 1px;
	text-overflow: '';
	width: 100%;
	color: rgba(0, 0, 0, 0.87);
}
input:focus {
	outline:none !important;
    box-shadow: none !important;
}

/* BUTTON */
.btn-upload{
	background: white;
	border: 2px solid var(--color-primary);
	color: var(--color-primary);
}
.btn-upload:hover{
	background: var(--color-primary);
	border: 2px solid var(--color-primary);
	color: white;
}
.btn-toggle{
	background: white;
	border: 2px solid var(--color-primary);
	color: var(--color-primary);
}
.btn-toggle.active{
	background: var(--color-primary);
	border: 2px solid var(--color-primary);
	color: white;
}
.btn-toggle:hover{
	background: var(--color-primary);
	border: 2px solid var(--color-primary);
	color: white;
}
.btn-cancel{
	background: white;
	border: 2px solid var(--color-primary);
	color: var(--color-primary);
}
.btn-cancel:hover{
	background-color: var(--color-primary);
	color: #FFFFFF;
}
.btn-icon {
	color: var(--color-primary); /* Default color */
	border: 1px solid var(--color-primary);
}
.btn-icon:hover {
	color: white;
	background: var(--color-primary);	
}

/* Checkbox */
.primary-checkbox{
	border: 2px solid rgba(0, 0, 0, 0.54);
}
.primary-checkbox:checked[type=checkbox]{
	background-color: var(--color-primary);
	border: 2px solid var(--color-primary);
}
.cursor-pointer {
	cursor: pointer;
}

/* Tooltips */
.custom-tooltip {
	--bs-tooltip-bg: var(--color-primary);
}

/* Nav Pills */
.nav-pills .nav-link.active, .nav-pills .show>.nav-link{
	background-color: var(--color-primary);
	color: white !important;
}

/* select2 */
.select2-container--default .select2-results__option--highlighted[aria-selected]{
	background-color: var(--color-primary) !important;
}
/* ============================================
   Lead Styles (Modern Gmail-style)
   ============================================ */
.lead-sidebar{
	width : 70% !important;
}
.lead-sidebar .form-control, .lead-sidebar .form-select{
	font-size: .875em !important;
}

/* Lead Sidebar Header Enhancement */
.lead-sidebar .offcanvas-header {
	background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
	padding: 18px 24px;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.lead-sidebar .offcanvas-title {
	color: #0f172a;
	font-weight: 600;
	letter-spacing: -0.01em;
}

.lead-sidebar .offcanvas-title i {
	color: #0163BA;
}

.lead-sidebar .text-light-grey {
	font-size: 13px;
	color: #64748b;
	font-weight: 500;
}

.lead-sidebar .offcanvas-body {
	background: #ffffff;
	padding: 20px 24px;
}

/* Nav Tabs Enhancement */
.lead-sidebar .nav-tabs {
	border-bottom: 2px solid #f1f5f9;
	margin-bottom: 20px;
}

.lead-sidebar .nav-tabs .nav-link {
	color: #64748b;
	font-weight: 500;
	padding: 10px 20px;
	border: none;
	border-bottom: 3px solid transparent;
	transition: all 0.2s ease;
}

.lead-sidebar .nav-tabs .nav-link:hover {
	color: #0163BA;
	background: #f8fafc;
	border-bottom-color: #bae6fd;
}

.lead-sidebar .nav-tabs .nav-link.active {
	color: #0163BA;
	background: transparent;
	border-bottom-color: #0163BA;
	font-weight: 600;
}

/* Lead Search Bar */
.lead-search-wrapper {
	padding: 16px 18px 12px;
	background: #ffffff;
	border-bottom: 1px solid #f1f5f9;
}

.lead-search-box {
	position: relative;
	display: flex;
	align-items: center;
	background: #ffffff;
	border: 1.5px solid #e2e8f0;
	border-radius: 10px;
	padding: 10px 14px;
	transition: all 0.2s ease;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.lead-search-box:focus-within {
	border-color: #0163BA;
	box-shadow: 0 0 0 3px rgba(1, 99, 186, 0.1), 0 2px 6px rgba(0, 0, 0, 0.08);
}

.lead-search-box i.fa-search {
	color: #94a3b8;
	font-size: 14px;
	margin-right: 10px;
}

.lead-search-box input {
	flex: 1;
	border: none;
	outline: none;
	background: transparent;
	font-size: 14px;
	color: #0f172a;
	padding: 0;
}

.lead-search-box input::placeholder {
	color: #94a3b8;
}

.clear-search-btn {
	background: transparent;
	border: none;
	padding: 4px 8px;
	color: #94a3b8;
	cursor: pointer;
	transition: all 0.2s ease;
	border-radius: 4px;
}

.clear-search-btn:hover {
	background: #f1f5f9;
	color: #64748b;
}

/* Lead List Header */
.lead-list-header {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px 18px;
	background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
	border-bottom: 2px solid #e2e8f0;
	font-size: 11px;
	font-weight: 700;
	color: #64748b;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.lead-header-col {
	display: flex;
	align-items: center;
	min-width: 0;
}

.lead-header-col-name {
	flex: 2;
}

.lead-header-col-contact {
	flex: 1.5;
}

.lead-header-col-pan {
	flex: 1;
}

.lead-header-col-state {
	flex: 1;
}

.lead-header-divider {
	display: none; /* Hidden for cleaner UI */
}

.lead-header-arrow {
	width: 20px;
	flex-shrink: 0;
}

/* Lead Row (Gmail-style horizontal layout) */
.lead-row {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 16px 18px;
	background: #fff;
	border-bottom: 1px solid #f1f5f9;
	cursor: pointer;
	transition: all 0.2s ease;
	position: relative;
	border-left: 3px solid transparent;
}

.lead-row:hover {
	background: linear-gradient(to right, #f8fafc 0%, #ffffff 100%);
	border-left-color: #e2e8f0;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
	transform: translateX(2px);
}

.lead-row-selected {
	background: #eff6ff !important;
	border-left: 3px solid #0163BA;
}

.lead-row-col {
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-width: 0;
}

.lead-row-divider {
	display: none; /* Hidden for cleaner UI */
}

.lead-row-col-name {
	flex: 2;
}

.lead-row-col-contact {
	flex: 1.5;
}

.lead-row-col-pan {
	flex: 1;
}

.lead-row-col-state {
	flex: 1;
}

.lead-row-name {
	font-size: 14.5px;
	font-weight: 600;
	color: #0f172a;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	margin-bottom: 0;
	letter-spacing: -0.01em;
}

.lead-row-contact {
	font-size: 13px;
	color: #64748b;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.lead-row-pan {
	font-size: 13px;
	color: #475569;
	font-family: monospace;
	font-weight: 500;
}

.lead-row-state {
	display: inline-flex;
	align-items: center;
	padding: 5px 14px;
	border-radius: 16px;
	font-size: 11px;
	font-weight: 600;
	white-space: nowrap;
	letter-spacing: 0.02em;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
	transition: all 0.2s ease;
}

.lead-row:hover .lead-row-state {
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12);
	transform: translateY(-1px);
}

.lead-state-open {
	background: #dbeafe;
	color: #1e40af;
}

.lead-state-opportunity {
	background: #e0e7ff;
	color: #4338ca;
}

.lead-state-proposal {
	background: #fef3c7;
	color: #92400e;
}

.lead-state-converted {
	background: #d1fae5;
	color: #065f46;
}

.lead-state-lost {
	background: #fee2e2;
	color: #991b1b;
}

.lead-state-timed-out {
	background: #f3f4f6;
	color: #374151;
}

.lead-state-on-hold {
	background: #fde68a;
	color: #78350f;
}

.lead-row-arrow {
	width: 20px;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #cbd5e1;
	font-size: 12px;
}

/* Empty and Loading States */
.lead-empty-state,
.lead-loading-state {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 3rem 1rem;
	color: #94a3b8;
	font-size: 0.9rem;
}

.lead-empty-state i {
	font-size: 2.5rem;
	margin-bottom: 0.8rem;
	color: #cbd5e1;
}

.lead-empty-state p {
	font-size: 1rem;
	font-weight: 500;
	color: #64748b;
	margin-bottom: 0.25rem;
}

.lead-empty-state span {
	font-size: 0.85rem;
	color: #94a3b8;
}

.lead-loading-state span {
	margin-left: 0.5rem;
}

/* Badge styles for header counts */
.badge-outline-info {
	background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
	color: #1e40af;
	border: 1px solid #93c5fd;
	font-weight: 600;
	transition: all 0.2s ease;
	box-shadow: 0 1px 3px rgba(30, 64, 175, 0.1);
}

.badge-outline-info:hover {
	transform: translateY(-1px);
	box-shadow: 0 3px 8px rgba(30, 64, 175, 0.15);
}

.badge-outline-primary {
	background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
	color: #0163BA;
	border: 1px solid #7dd3fc;
	font-weight: 600;
	transition: all 0.2s ease;
	box-shadow: 0 1px 3px rgba(1, 99, 186, 0.1);
}

.badge-outline-primary:hover {
	transform: translateY(-1px);
	box-shadow: 0 3px 8px rgba(1, 99, 186, 0.15);
}

.badge-outline-success {
	background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);
	color: #16a34a;
	border: 1px solid #86efac;
	font-weight: 600;
	transition: all 0.2s ease;
	box-shadow: 0 1px 3px rgba(22, 163, 74, 0.1);
}

.badge-outline-success:hover {
	transform: translateY(-1px);
	box-shadow: 0 3px 8px rgba(22, 163, 74, 0.15);
}

.badge-outline-danger {
	background: linear-gradient(135deg, #fef2f2 0%, #fee2e2 100%);
	color: #dc2626;
	border: 1px solid #fca5a5;
	font-weight: 600;
	transition: all 0.2s ease;
	box-shadow: 0 1px 3px rgba(220, 38, 38, 0.1);
}

.badge-outline-danger:hover {
	transform: translateY(-1px);
	box-shadow: 0 3px 8px rgba(220, 38, 38, 0.15);
}

/* ============================================
   Lead Detail View - Enhanced Elegant Styling
   ============================================ */

/* Loading State for Lead Details */
.lead-detail-loading {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-height: 400px;
	color: #64748b;
}

.lead-detail-loading .spinner-border {
	width: 3rem;
	height: 3rem;
	border-width: 0.3rem;
}

.lead-detail-loading p {
	font-size: 14px;
	font-weight: 500;
	color: #64748b;
}

.lead-detail-wrapper {
	background: #ffffff;
	min-height: 100vh;
	padding: 0;
}

.lead-detail-inner {
	max-width: 100%;
	padding: 0;
}

/* Lead Content Body */
.lead-detail-content {
	padding: 20px 24px;
}

/* Section Divider */
.lead-section-divider {
	border: 0;
	border-top: 2px solid #e2e8f0;
	margin: 20px 0;
	opacity: 1;
}

/* Lead Title Card */
.lead-title-card {
	background: #ffffff;
	border-radius: 12px;
	padding: 20px;
	margin-bottom: 16px;
	margin-top: 8px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
	border: 1px solid #e2e8f0;
}

/* Back Button Styling - Enhanced */
#btnLeadBack {
	padding: 6px 14px;
	font-size: 12px;
	border-radius: 6px;
	border: 1.5px solid #cbd5e1;
	background: #ffffff;
	color: #475569;
	font-weight: 600;
	transition: all 0.2s ease;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

#btnLeadBack:hover {
	background: #f8fafc;
	border-color: #94a3b8;
	color: #0f172a;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
	transform: translateY(-1px);
}

#btnLeadBack:active {
	transform: translateY(0);
}

#btnLeadBack i {
	font-size: 12px;
}

/* Report Back Button Styling */
.btn-report-back {
	padding: 6px 14px;
	font-size: 12px;
	border-radius: 6px;
	border: 1.5px solid #cbd5e1;
	background: #ffffff;
	color: #202C3D;
	font-weight: 600;
	transition: all 0.2s ease;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

.btn-report-back:hover {
	background: #f8fafc;
	border-color: #94a3b8;
	color: #202C3D;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
	transform: translateY(-1px);
}

.btn-report-back:active {
	transform: translateY(0);
}

.btn-report-back i {
	font-size: 12px;
}

/* Edit Button Styling */
#btnLeadEditFromDetail {
	padding: 6px 16px;
	font-size: 12px;
	border-radius: 6px;
	background: #0163BA;
	border: 1px solid #0163BA;
	color: #ffffff;
	font-weight: 600;
	transition: all 0.2s ease;
	box-shadow: 0 2px 4px rgba(1, 99, 186, 0.2);
}

#btnLeadEditFromDetail:hover {
	background: #014d91;
	border-color: #014d91;
	transform: translateY(-1px);
	box-shadow: 0 4px 8px rgba(1, 99, 186, 0.25);
}

#btnLeadEditFromDetail:active {
	transform: translateY(0);
}

/* Lead Title Section */
.lead-detail-inner h4 {
	font-size: 20px;
	font-weight: 700;
	color: #0f172a;
	letter-spacing: -0.02em;
	margin-bottom: 6px;
	line-height: 1.3;
}

.lead-detail-inner .text-muted.small {
	font-size: 11px;
	color: #64748b;
	font-weight: 500;
	display: inline-flex;
	align-items: center;
	gap: 4px;
}

/* State and Assignment Badges - Enhanced */
.lead-detail-inner .badge {
	padding: 4px 12px;
	font-size: 11px;
	font-weight: 700;
	border-radius: 14px;
	letter-spacing: 0.02em;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
}

.lead-detail-inner .bg-primary-subtle {
	background: linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%);
	color: #1e40af;
	border: 1.5px solid #60a5fa;
}

.lead-detail-inner .bg-secondary-subtle {
	background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%);
	color: #334155;
	border: 1.5px solid #94a3b8;
}

.lead-detail-inner .bg-primary {
	background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
	color: #ffffff;
	border: none;
}

.lead-detail-inner .bg-secondary {
	background: linear-gradient(135deg, #64748b 0%, #475569 100%);
	color: #ffffff;
	border: none;
}

/* Divider - Darker and more prominent */
.lead-detail-divider {
	border: 0;
	border-top: 1.5px solid #94a3b8;
	margin: 14px 0;
	opacity: 1;
}

/* Info Grid - Compact Table Style */
.lead-info-card {
	background: #ffffff;
	border-radius: 12px;
	padding: 0;
	margin-bottom: 14px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
	border: 1px solid #e2e8f0;
	overflow: hidden;
}

.lead-info-table {
	width: 100%;
}

.lead-info-row {
	display: flex;
	align-items: center;
	padding: 11px 20px;
	border-bottom: 1px solid #f1f5f9;
	transition: all 0.2s ease;
}

.lead-info-row:last-child {
	border-bottom: none;
}

.lead-info-row:hover {
	background: #fafbfc;
}

.lead-info-label {
	flex: 0 0 180px;
	font-size: 11px;
	font-weight: 700;
	color: #64748b;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	display: flex;
	align-items: center;
}

.lead-info-label i {
	color: #0163BA;
	font-size: 13px;
	width: 18px;
}

.lead-info-value {
	flex: 1;
	font-size: 14px;
	color: #0f172a;
	font-weight: 600;
	word-break: break-word;
}

/* Legacy Grid Support */
.lead-detail-inner .row .col-md-4 {
	padding: 8px 12px;
	border-left: 2px solid transparent;
	transition: all 0.2s ease;
}

.lead-detail-inner .row .col-md-4:hover {
	background: #f8fafc;
	border-left-color: #0163BA;
	border-radius: 6px;
}

.lead-detail-inner .fw-semibold {
	font-size: 9px;
	font-weight: 800;
	text-transform: uppercase;
	color: #64748b;
	letter-spacing: 0.1em;
	margin-bottom: 5px;
}

.lead-detail-inner .text-secondary {
	font-size: 13px;
	color: #0f172a;
	font-weight: 600;
}

/* Notes Section - Enhanced */
.lead-detail-inner .mb-3 p {
	font-size: 12px;
	color: #334155;
	line-height: 1.5;
	background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
	padding: 10px 12px;
	border-radius: 8px;
	border-left: 3px solid #0163BA;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
	font-weight: 400;
}

/* Section Headers Enhancement */
.lead-detail-inner .fw-semibold {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	font-weight: 700;
	color: #0f172a;
	margin-bottom: 10px;
	padding-bottom: 6px;
	border-bottom: 2px solid #e2e8f0;
}

/* Section Icons */
.lead-detail-inner i.text-primary {
	color: #0163BA !important;
	font-size: 13px;
	margin-right: 4px;
}

.lead-detail-inner i.fa-timeline,
.lead-detail-inner i.fa-file-lines,
.lead-detail-inner i.fa-note-sticky {
	font-size: 12px;
}

/* Transitions Table - Enhanced */
.lead-detail-inner .table {
	border-radius: 8px;
	overflow: hidden;
	border: 1.5px solid #cbd5e1;
	margin-bottom: 0;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
}

.lead-detail-inner .table-light {
	background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%);
}

.lead-detail-inner .table thead th {
	font-size: 9px;
	font-weight: 800;
	text-transform: uppercase;
	color: #475569;
	letter-spacing: 0.08em;
	padding: 8px 10px;
	border-bottom: 2px solid #94a3b8;
}

.lead-detail-inner .table tbody td {
	font-size: 11px;
	color: #334155;
	padding: 8px 10px;
	border-bottom: 1px solid #e2e8f0;
	font-weight: 500;
}

.lead-detail-inner .table tbody tr:last-child td {
	border-bottom: 0;
}

.lead-detail-inner .table tbody tr:hover {
	background: #f8fafc;
	transition: background 0.15s ease;
}

.lead-detail-inner .table tbody tr {
	transition: background 0.15s ease;
}

/* Documents Section - Enhanced */
#leadDocumentsWrapper .d-flex {
	padding: 8px 10px;
	background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
	border: 1.5px solid #cbd5e1;
	border-radius: 8px;
	margin-bottom: 8px;
	transition: all 0.2s ease;
}

#leadDocumentsWrapper .d-flex:hover {
	background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
	border-color: #0163BA;
	box-shadow: 0 3px 8px rgba(1, 99, 186, 0.12);
	transform: translateX(3px);
}

#leadDocumentsWrapper a {
	color: #0163BA;
	text-decoration: none;
	font-size: 12px;
	font-weight: 600;
	transition: all 0.2s ease;
}

#leadDocumentsWrapper a:hover {
	color: #014d91;
	text-decoration: underline;
}

#leadDocumentsWrapper i.fa-file {
	color: #0163BA;
	font-size: 14px;
}

/* Comment Section Improvements - Enhanced */
.lead-comment-input-wrapper {
	background: #ffffff;
	border-radius: 8px;
	padding: 4px;
}

#leadCommentInput {
	border: 1.5px solid #cbd5e1 !important;
	border-radius: 6px !important;
	font-size: 12px !important;
	background: #f8fafc !important;
	transition: all 0.2s ease;
	padding: 8px 10px !important;
	font-weight: 400;
	line-height: 1.4;
}

#leadCommentInput:focus {
	background: #ffffff !important;
	border-color: #0163BA !important;
	box-shadow: 0 0 0 4px rgba(1, 99, 186, 0.12) !important;
}

#btnAddLeadComment {
	padding: 6px 18px;
	font-size: 13px;
	font-weight: 600;
	border-radius: 6px;
	background: #0163BA;
	border: none;
	transition: all 0.2s ease;
}

#btnAddLeadComment:hover {
	background: #014d91;
	transform: translateY(-1px);
	box-shadow: 0 4px 8px rgba(1, 99, 186, 0.2);
}

#btnCancelLeadComment {
	padding: 6px 18px;
	font-size: 13px;
	font-weight: 500;
	border-radius: 6px;
	background: #ffffff;
	border: 1px solid #e2e8f0;
	color: #64748b;
	transition: all 0.2s ease;
}

#btnCancelLeadComment:hover {
	background: #f8fafc;
	border-color: #cbd5e1;
	color: #475569;
}

/* Comment Cards Enhancement - Premium */
.comment-card {
	background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%) !important;
	border-radius: 8px !important;
	padding: 10px !important;
	border: 1.5px solid #cbd5e1 !important;
	border-left: 3px solid var(--avatar-color, #0163BA) !important;
	box-shadow: 0 2px 6px rgba(0,0,0,0.06) !important;
	transition: all 0.2s ease !important;
	margin-bottom: 8px !important;
}

.comment-card:hover {
	box-shadow: 0 6px 16px rgba(0,0,0,0.1) !important;
	transform: translateY(-2px);
	border-color: #94a3b8 !important;
}

.comment-author {
	color: #0163BA !important;
	font-size: 11px !important;
	font-weight: 700 !important;
	letter-spacing: 0.01em !important;
}

.comment-date {
	color: #94a3b8 !important;
	font-size: 10px !important;
	font-weight: 600 !important;
	letter-spacing: 0.02em !important;
}

.comment-body {
	color: #334155 !important;
	font-size: 11px !important;
	line-height: 1.5 !important;
	font-weight: 400 !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
	.lead-detail-inner {
		padding: 16px 20px;
	}

	.lead-detail-inner h4 {
		font-size: 22px;
	}
}

/* ============================================
   Lead Form - Modern & Classy Styling
   ============================================ */

/* Form Container */
.lead-form-container {
	max-width: 100%;
	padding: 0;
}

/* Form Sections */
.lead-form .form-section {
	background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
	border: 1.5px solid #e2e8f0;
	border-radius: 12px;
	padding: 18px 20px;
	margin-bottom: 16px;
	transition: all 0.2s ease;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.lead-form .form-section:hover {
	border-color: #cbd5e1;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}

/* Form Labels */
.lead-form .form-label {
	font-size: 12px;
	font-weight: 700;
	color: #334155;
	margin-bottom: 8px;
	display: flex;
	align-items: center;
	gap: 6px;
	letter-spacing: 0.01em;
}

.lead-form .form-label i {
	color: #0163BA;
	font-size: 13px;
}

.lead-form .form-label .text-danger {
	color: #dc2626;
	font-size: 14px;
}

.lead-form .form-label .text-muted {
	font-weight: 500;
	color: #94a3b8;
	font-size: 11px;
}

/* Form Inputs */
.lead-form .form-control,
.lead-form .form-select {
	border: 1.5px solid #cbd5e1;
	border-radius: 8px;
	padding: 10px 14px;
	font-size: 13px;
	color: #1e293b;
	background: #ffffff;
	transition: all 0.2s ease;
	font-weight: 500;
}

.lead-form .form-control:focus,
.lead-form .form-select:focus {
	border-color: #0163BA;
	box-shadow: 0 0 0 4px rgba(1, 99, 186, 0.1);
	background: #ffffff;
}

.lead-form .form-control::placeholder {
	color: #94a3b8;
	font-weight: 400;
}

.lead-form .form-control.is-invalid {
	border-color: #dc2626;
	box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.1);
}

/* Assigned To Dropdown - Wider */
#assigned_to {
	width: 100% !important;
}

.lead-form .bootstrap-select {
	width: 100% !important;
}

.lead-form .bootstrap-select .dropdown-toggle {
	width: 100% !important;
	min-width: 350px !important;
	text-align: left;
}

.lead-form .bootstrap-select .dropdown-menu {
	min-width: 350px !important;
	width: 100% !important;
}

/* Advanced Toggle Button */
.lead-form .btn-advanced-toggle {
	background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
	border: 1.5px solid #cbd5e1;
	border-radius: 8px;
	padding: 10px 16px;
	font-size: 12px;
	font-weight: 600;
	color: #475569;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	cursor: pointer;
	transition: all 0.2s ease;
}

.lead-form .btn-advanced-toggle:hover {
	background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%);
	border-color: #94a3b8;
	color: #0f172a;
	transform: translateY(-1px);
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

.lead-form .btn-advanced-toggle i {
	font-size: 11px;
	transition: transform 0.2s ease;
}

/* Profile Type Cards */
.profile-type-cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));
	gap: 10px;
	margin-top: 8px;
}

.profile-type-card {
	background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
	border: 2px solid #e2e8f0;
	border-radius: 10px;
	padding: 12px 8px;
	text-align: center;
	cursor: pointer;
	transition: all 0.2s ease;
	font-size: 12px;
	font-weight: 600;
	color: #64748b;
}

.profile-type-card:hover {
	background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
	border-color: #60a5fa;
	color: #1e40af;
	transform: translateY(-2px);
	box-shadow: 0 4px 10px rgba(96, 165, 250, 0.2);
}

.profile-type-card.selected {
	background: linear-gradient(135deg, #0163BA 0%, #014d91 100%);
	border-color: #0163BA;
	color: #ffffff;
	box-shadow: 0 4px 12px rgba(1, 99, 186, 0.3);
}

/* Source Cards */
.source-cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
	gap: 12px;
	margin-top: 8px;
}

.source-card {
	background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
	border: 2px solid #e2e8f0;
	border-radius: 12px;
	padding: 16px 10px;
	text-align: center;
	cursor: pointer;
	transition: all 0.2s ease;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
}

.source-card i {
	font-size: 24px;
	color: #64748b;
	transition: all 0.2s ease;
}

.source-card img {
	max-width: 60px;
	height: auto;
	opacity: 0.7;
	transition: opacity 0.2s ease;
}

.source-card span {
	font-size: 12px;
	font-weight: 600;
	color: #475569;
}

.source-card:hover {
	background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
	border-color: #0163BA;
	transform: translateY(-3px);
	box-shadow: 0 6px 16px rgba(1, 99, 186, 0.15);
}

.source-card:hover i {
	color: #0163BA;
	transform: scale(1.1);
}

.source-card:hover img {
	opacity: 1;
}

.source-card.selected {
	background: linear-gradient(135deg, #0163BA 0%, #014d91 100%);
	border-color: #0163BA;
	box-shadow: 0 6px 20px rgba(1, 99, 186, 0.3);
}

.source-card.selected i,
.source-card.selected span {
	color: #ffffff;
}

.source-card.selected img {
	opacity: 1;
	filter: brightness(0) invert(1);
}

/* Social Media Cards */
.social-media-cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));
	gap: 10px;
	margin-top: 8px;
}

.social-media-cards.source-meta-invalid {
	border: 2px solid #dc3545;
	border-radius: 8px;
	padding: 6px;
}

.social-media-card {
	background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
	border: 2px solid #e2e8f0;
	border-radius: 10px;
	padding: 14px 8px;
	text-align: center;
	cursor: pointer;
	transition: all 0.2s ease;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
}

.social-media-card i {
	font-size: 20px;
	color: #64748b;
	transition: all 0.2s ease;
}

.social-media-card span {
	font-size: 11px;
	font-weight: 600;
	color: #475569;
}

.social-media-card:hover {
	background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
	border-color: #0163BA;
	transform: translateY(-2px);
	box-shadow: 0 4px 12px rgba(1, 99, 186, 0.15);
}

.social-media-card:hover i {
	color: #0163BA;
	transform: scale(1.15);
}

.social-media-card.selected {
	background: linear-gradient(135deg, #0163BA 0%, #014d91 100%);
	border-color: #0163BA;
	box-shadow: 0 4px 14px rgba(1, 99, 186, 0.3);
}

.social-media-card.selected i,
.social-media-card.selected span {
	color: #ffffff;
}

/* File Upload */
.file-upload-wrapper {
	margin-top: 8px;
}

.file-upload-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 20px;
	background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
	border: 2px dashed #cbd5e1;
	border-radius: 10px;
	color: #475569;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.2s ease;
}

.file-upload-btn:hover {
	background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
	border-color: #0163BA;
	color: #0163BA;
	transform: translateY(-1px);
	box-shadow: 0 4px 10px rgba(1, 99, 186, 0.1);
}

.file-upload-btn i {
	font-size: 16px;
}

.file-preview {
	margin-top: 12px;
}

.file-preview ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.file-preview li {
	background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
	border: 1.5px solid #e2e8f0;
	border-radius: 8px;
	padding: 10px 12px;
	margin-bottom: 8px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	transition: all 0.2s ease;
}

.file-preview li:hover {
	border-color: #cbd5e1;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
}

.file-preview li i.fa-file {
	color: #64748b;
	font-size: 14px;
	margin-right: 8px;
}

.file-preview li span {
	font-size: 12px;
	color: #334155;
	font-weight: 500;
	flex: 1;
}

.file-preview .btn-outline-danger {
	padding: 4px 10px;
	font-size: 11px;
	border-radius: 6px;
	border: 1.5px solid #fca5a5;
	color: #dc2626;
	background: #fef2f2;
	transition: all 0.2s ease;
}

.file-preview .btn-outline-danger:hover {
	background: #dc2626;
	color: #ffffff;
	border-color: #dc2626;
	transform: scale(1.05);
}

/* Form Actions */
.form-actions {
	display: flex;
	gap: 12px;
	margin-top: 24px;
	padding-top: 20px;
	border-top: 2px solid #e2e8f0;
}

.form-actions .btn {
	flex: 1;
	padding: 12px 24px;
	font-size: 14px;
	font-weight: 600;
	border-radius: 10px;
	transition: all 0.2s ease;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
}

.form-actions .btn-primary {
	background: linear-gradient(135deg, #0163BA 0%, #014d91 100%);
	border: none;
	color: #ffffff;
	box-shadow: 0 4px 12px rgba(1, 99, 186, 0.3);
}

.form-actions .btn-primary:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(1, 99, 186, 0.4);
}

.form-actions .btn-outline-secondary {
	background: #ffffff;
	border: 2px solid #cbd5e1;
	color: #475569;
}

.form-actions .btn-outline-secondary:hover {
	background: #f8fafc;
	border-color: #94a3b8;
	color: #0f172a;
	transform: translateY(-1px);
}

/* communication */
.communication-messages-sidebar{
	width : 60% !important;
}

/* Task */
.task-sidebar{
	width : 50% !important;
}
.task-sidebar .form-control, .task-sidebar .form-select{
	font-size: .875em;
}

/* Task Category Search Box */
.task-category-search-wrapper {
	padding: 0;
}
.task-category-search-box {
	display: flex;
	align-items: center;
	padding: 8px 14px;
	background: #ffffff;
	border: 1.5px solid #e2e8f0;
	border-radius: 10px;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
	transition: all 0.2s ease;
}
.task-category-search-box:focus-within {
	border-color: #0163BA;
	box-shadow: 0 0 0 3px rgba(1, 99, 186, 0.1), 0 2px 6px rgba(0, 0, 0, 0.08);
}
.task-category-search-box i {
	color: #0163BA;
	font-size: 14px;
}
.task-category-search-box input {
	border: none;
	background: transparent;
	padding: 6px 12px;
	font-size: 13px;
	outline: none;
	width: 100%;
	color: #1e293b;
	font-weight: 500;
}
.task-category-search-box input::placeholder {
	color: #94a3b8;
	font-weight: 400;
}
.task-category-clear-btn {
	background: none;
	border: none;
	padding: 4px 8px;
	cursor: pointer;
	color: #94a3b8;
	transition: color 0.2s ease;
}
.task-category-clear-btn:hover {
	color: #dc2626;
}

/* Task Category Type Items */
.task-category-type-item {
	background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
	border: 2px solid #e2e8f0;
	color: #334155;
	transition: all 0.2s ease;
	cursor: pointer;
	border-radius: 10px;
	font-weight: 500;
}
.task-category-type-item:hover {
	background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
	border-color: #0163BA;
	color: #0163BA;
	transform: translateY(-2px);
	box-shadow: 0 4px 12px rgba(1, 99, 186, 0.15);
}
.task-category-type-search-results {
	background: #fffbeb;
	border: 1.5px solid #fcd34d;
	border-radius: 10px;
	padding: 14px 18px;
	margin-bottom: 16px;
	font-size: 13px;
	color: #92400e;
}
.task-category-type-search-results h5 {
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 4px;
	color: #78350f;
}
.task-category-type-search-results p {
	margin-bottom: 0;
}
.task-category-type-highlight {
	background-color: #fef08a;
	padding: 2px 4px;
	border-radius: 4px;
	font-weight: 600;
}
.task-category-header {
	font-size: 14px;
	font-weight: 700;
	color: #334155;
	letter-spacing: 0.01em;
}
.task-category-header i {
	color: #0163BA;
}
.task-category-divider {
	border: 0;
	border-top: 1.5px solid #e2e8f0;
	margin: 8px 0 12px 0;
	opacity: 1;
}

/* Task Form Container */
.task-form-container {
	max-width: 100%;
	padding: 0;
}

/* Task Form Sections */
.task-form .form-section {
	background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
	border: 1.5px solid #e2e8f0;
	border-radius: 12px;
	padding: 18px 20px;
	margin-bottom: 16px;
	transition: all 0.2s ease;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}
.task-form .form-section:hover {
	border-color: #cbd5e1;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}

/* Task Form Labels */
.task-form .form-label {
	font-size: 12px;
	font-weight: 700;
	color: #334155;
	margin-bottom: 8px;
	display: flex;
	align-items: center;
	gap: 6px;
	letter-spacing: 0.01em;
}
.task-form .form-label i {
	color: #0163BA;
	font-size: 13px;
}
.task-form .form-label .text-danger {
	color: #dc2626;
	font-size: 14px;
}
.task-form .form-label .text-muted {
	font-weight: 500;
	color: #94a3b8;
	font-size: 11px;
}

/* Task Form Inputs */
.task-form .form-control,
.task-form .form-select {
	border: 1.5px solid #cbd5e1;
	border-radius: 8px;
	padding: 10px 14px;
	font-size: 13px;
	color: #1e293b;
	background: #ffffff;
	transition: all 0.2s ease;
	font-weight: 500;
}
.task-form .form-control:focus,
.task-form .form-select:focus {
	border-color: #0163BA;
	box-shadow: 0 0 0 4px rgba(1, 99, 186, 0.1);
	background: #ffffff;
}
.task-form .form-control::placeholder {
	color: #94a3b8;
	font-weight: 400;
}

/* Task Form Back Button */
.task-back-btn {
	padding: 6px 14px;
	font-size: 12px;
	border-radius: 6px;
	border: 1.5px solid #cbd5e1;
	background: #ffffff;
	color: #475569;
	font-weight: 600;
	transition: all 0.2s ease;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
	cursor: pointer;
}
.task-back-btn:hover {
	background: #f8fafc;
	border-color: #94a3b8;
	color: #0f172a;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
	transform: translateY(-1px);
}

/* Task Category/Type Badges */
.task-badge {
	display: inline-flex;
	align-items: center;
	padding: 4px 12px;
	border-radius: 6px;
	font-size: 12px;
	font-weight: 600;
}
.task-badge-category {
	background: #dbeafe;
	color: #1e40af;
	border: 1px solid #93c5fd;
}
.task-badge-type {
	background: #e0e7ff;
	color: #4338ca;
	border: 1px solid #a5b4fc;
}

/* Task Form Advanced Toggle */
.task-form .btn-advanced-toggle {
	background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
	border: 1.5px solid #cbd5e1;
	border-radius: 8px;
	padding: 10px 16px;
	font-size: 12px;
	font-weight: 600;
	color: #475569;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	cursor: pointer;
	transition: all 0.2s ease;
}
.task-form .btn-advanced-toggle:hover {
	background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%);
	border-color: #94a3b8;
	color: #0f172a;
	transform: translateY(-1px);
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}
.task-form .btn-advanced-toggle i {
	font-size: 11px;
	transition: transform 0.2s ease;
}

/* Task Form Checkbox Modern */
.task-checkbox-modern .form-check-label {
	font-size: 13px;
	font-weight: 600;
	color: #334155;
	display: flex;
	align-items: center;
	gap: 4px;
	cursor: pointer;
}
.task-checkbox-modern .form-check-input {
	width: 18px;
	height: 18px;
	cursor: pointer;
	accent-color: #0163BA;
}

/* Task Notify Check */
.task-notify-check .form-check-label {
	font-size: 13px;
	font-weight: 600;
	color: #475569;
}
.task-notify-check .form-check-input {
	width: 16px;
	height: 16px;
	accent-color: #0163BA;
}

/* Task Form Bootstrap-Select overrides */
.task-form .bootstrap-select {
	width: 100% !important;
}
.task-form .bootstrap-select .dropdown-toggle {
	border: 1.5px solid #cbd5e1;
	border-radius: 8px;
	padding: 10px 14px;
	font-size: 13px;
	color: #1e293b;
	background: #ffffff;
	transition: all 0.2s ease;
	font-weight: 500;
}
.task-form .bootstrap-select .dropdown-toggle:focus {
	border-color: #0163BA;
	box-shadow: 0 0 0 4px rgba(1, 99, 186, 0.1);
}
.task-form .bootstrap-select .dropdown-menu {
	border: 1.5px solid #e2e8f0;
	border-radius: 8px;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

/* Dynamic tables within task form */
.task-form .dynamic-tables-container .form-section,
.task-form .dynamic-tables-container {
	margin-bottom: 0;
}
.task-form .dynamic-tables-container .option-table {
	background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
	border: 1.5px solid #e2e8f0;
	border-radius: 12px;
	padding: 18px 16px;
	margin-bottom: 16px;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}
.task-form .dynamic-tables-container .option-table .form-label {
	font-size: 13px;
	font-weight: 700;
	color: #334155;
	margin-bottom: 10px;
}

/* ---- Fixed-width horizontal table for transaction rows ---- */
.task-form .dynamic-tables-container .table {
	table-layout: fixed;
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 8px;
}
.task-form .dynamic-tables-container .table thead th {
	font-size: 11px;
	font-weight: 700;
	color: #475569;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	padding: 8px 6px;
	white-space: nowrap;
	border-bottom: 2px solid #e2e8f0;
	background: #f8fafc;
}
.task-form .dynamic-tables-container .table tbody td {
	padding: 8px 6px;
	vertical-align: middle;
	border-color: #e2e8f0;
	overflow: visible;
}
/* Selectpicker & input compact styling */
.task-form .dynamic-tables-container .table td .bootstrap-select {
	width: 100% !important;
}
.task-form .dynamic-tables-container .table td .bootstrap-select .dropdown-toggle {
	font-size: 12px;
	padding: 4px 8px;
	border: 1.5px solid #cbd5e1;
	border-radius: 6px;
	min-height: 32px;
	width: 100%;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.task-form .dynamic-tables-container .table td .form-control {
	font-size: 12px;
	padding: 4px 8px;
	border: 1.5px solid #cbd5e1;
	border-radius: 6px;
	min-height: 32px;
}
/* Dropdown menu inside table should not be constrained */
.task-form .dynamic-tables-container .table td .bootstrap-select .dropdown-menu {
	min-width: 220px;
}

/* Floating trash icon on row edge — visible on hover */
.task-form .dynamic-tables-container .table tbody tr {
	position: relative;
}
.task-form .dynamic-tables-container .table tbody tr .txn-row-remove-icon {
	position: absolute;
	top: -10px;
	right: -10px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: #fff;
	border: 1.5px solid #fecaca;
	color: #ef4444;
	font-size: 12px;
	cursor: pointer;
	opacity: 0;
	transform: scale(0.8);
	transition: opacity 0.2s ease, transform 0.2s ease, background 0.2s ease;
	z-index: 2;
	box-shadow: 0 1px 4px rgba(0,0,0,0.08);
}
.task-form .dynamic-tables-container .table tbody tr:hover .txn-row-remove-icon {
	opacity: 1;
	transform: scale(1);
}
.task-form .dynamic-tables-container .table tbody tr .txn-row-remove-icon:hover {
	background: #fef2f2;
	border-color: #ef4444;
	transform: scale(1.1);
}
.task-form .dynamic-tables-container .add-row {
	background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
	border: 1.5px solid #cbd5e1;
	border-radius: 6px;
	font-size: 12px;
	font-weight: 600;
	color: #475569;
	padding: 6px 14px;
	transition: all 0.2s ease;
}
.task-form .dynamic-tables-container .add-row:hover {
	background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
	border-color: #0163BA;
	color: #0163BA;
}

#tableTask tbody tr td .task-details-expanded .row{
	text-wrap: auto !important;
}

/* Goals */
.goals-sidebar{
	width : 50% !important;
}
.goals-sidebar .form-control, .goals-sidebar .form-select{
	font-size: .875em !important;
}

/* Emi */
.emi-sidebar{
	width : 45% !important;
}
.emi-sidebar .form-control, .emi-sidebar .form-select{
	font-size: .875em !important;
}

/* Expenses */
.expenses-sidebar{
	width : 45% !important;
}
.expenses-sidebar .form-control, .expenses-sidebar .form-select{
	font-size: .875em !important;
}

/* Assets */
.assets-sidebar{
	width : 45% !important;
}
.assets-sidebar .form-control, .assets-sidebar .form-select{
	font-size: .875em !important;
}

/* User Management */
.user-management-sidebar{
	width : 45% !important;
}
.user-management-sidebar .form-control, .user-management-sidebar .form-select{
	font-size: .875em !important;
}

/* Profile */
.profile-sidebar{
	width : 45% !important;
}
.profile-sidebar .form-control, .profile-sidebar .form-select{
	font-size: .875em !important;
}


/* add logo images*/
.add-logos-sidebar{
	width : 45% !important;
}
.add-logos-sidebar .form-control, .add-logos-sidebar .form-select{
	font-size: .875em !important;
}
.add-logos-sidebar .image-preview {
	width: 60px;
	height: 60px;
	object-fit: cover;
	border-radius: 8px;
}
.add-logos-sidebar .image-item {
	transition: all 0.3s ease;
}
.add-logos-sidebar .image-item:hover {
	transform: translateY(-2px);
	box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}
.add-logos-sidebar .image-size {
	font-size: 0.75rem;
	color: #6c757d;
}

/* Mutual Fund Scheme */
.il-mfs-sidebar{
	width : 50% !important;
}
.il-mfs-sidebar .form-control, .il-mfs-sidebar .form-select{
	font-size: .875em !important;
}

/* Data Management */
.upload-file-sidebar{
	width : 45% !important;
}
.dm-no-file-upload{
	min-height: calc(100vh - 240px);
}
.dm-no-file-upload img{
	width: 85px;
	height: auto;
}
.file-upload-files input {
    outline: 2px dashed #7A818C;
    -webkit-transition: outline-offset .15s ease-in-out, background-color .15s linear;
    transition: outline-offset .15s ease-in-out, background-color .15s linear;
    padding: 19px 0px 64px 35%;
    text-align: center !important;
    margin: 0;
    width: 100% !important;
	content: '';	
}
.file-upload-files input:focus{     
	outline: 2px dashed #202C3D;  
	outline-offset: -7px;
    -webkit-transition: outline-offset .15s ease-in-out, background-color .15s linear;
    transition: outline-offset .15s ease-in-out, background-color .15s linear; border:1px solid #202C3D;
 }
.file-upload-files{ 
	position:relative
}
.file-upload-files:before {
    position: absolute;
    top: 20%;
    left: 0;  
	pointer-events: none;
    width: 100%;
    right: 0;
    height: 43px;
    content: " Drag a file \a or";
	white-space:pre;
    display: block;
    margin: 0 auto;
    color: #202C3D;
    font-weight: 600;
	font-size: 14px;
    text-align: center;
}
.file-upload-files:after {
    position: absolute;
    bottom: -10%;
    left: 0;  pointer-events: none;
    width: 100%;
    right: 0;
    height: 43px;
    content: " Browse ";
    display: block;
    margin: 0 auto;
    color: #0163BA;
    text-transform: capitalize;
    text-align: center;
	font-weight: 400;
	font-size: 12px;
	line-height: 130%;
	letter-spacing: 0.0025em;

	
}
.file-upload-files input {
	color: transparent;
}
.file-upload-files input::-webkit-file-upload-button {
	visibility: hidden;
}
.file-upload-files input:focus {
	color: transparent;
}


/* Investor List */
.il-upper-icons-wrapper .il-upper-icon{
	width: 2.5rem !important;
	height: 2.5rem !important;
	font-size: 1.5rem !important;
}
.il-upper-icons-wrapper .il-upper-icon:hover{
	border-color: var(--color-primary) !important;
	color: var(--color-primary);
	background-color: #bed5fd;
}
.il-upper-icons-wrapper .il-upper-icon.active{
	border-color: var(--color-primary) !important;
	color: var(--color-primary);
	background-color: #bed5fd;
}
.il-filter-sidebar{
	--cui-sidebar-width : 100%;
}
.il-card-name-icons{
	display:none;
}
.il-card-aum{
	display:none;
	position: absolute;
	top:0px;
	right:0px;
	z-index: 2;
}
.il-card-task{
	display:none;
	position:absolute;
	bottom:0px;
	right:0px;
	z-index: 2;
}
.investor-card{
	position: relative;
  	z-index: 1;
}
.il-card-icons-wrapper .il-card-icons .il-change-icon{
	width: 1.5rem !important;
	height: 1.5rem !important;
	font-size: 1.5rem !important;
}
.il-card-icons-wrapper .il-card-icons{
	position: relative;
}
.il-card-wrapper:hover {
	box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2); /* Larger shadow on hover */
	transform: translateY(-2px); /* Slight lift effect */
	cursor: pointer; /* Change cursor to pointer */
	transition: box-shadow 0.5s ease, transform 0.5s ease; /* Softer and slower*/
}
.il-card-wrapper.select-mode-temp:hover {
	box-shadow: rgba(255, 255, 255, 0.2) 0px 2px 8px 0px;
	transform: none; 
	cursor: pointer; 
	transition: none; 
}
.selected-card, .select-mode-temp{
	box-shadow: rgba(255, 255, 255, 0.2) 0px 2px 8px 0px;
	border: 6px solid rgba(1, 99, 186, 0.9);
	border-radius: 0.375rem;
	
}
.btn-bulk button{
	box-shadow: rgba(255, 255, 255, 0.2) 0px 2px 8px 0px;
}
#overlayInvestorList {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.5);
	z-index: 1000;
}

.clickable-div {
	position: relative;
	z-index: 1010; /* Higher than the overlay */
}
/* .family-card-update {
	position: relative;
} */
.family-card:hover {
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2); /* Larger shadow on hover */
	transform: translateY(-2px); /* Slight lift effect */
	cursor: pointer; /* Change cursor to pointer */
	transition: box-shadow 0.1s ease, transform 0.5s ease; /* Softer and slower*/
}
.family-remove:hover {
    color: var(--color-primary);
}
.aum-display {
    font-size: 1.2rem; /* Large font size for AUM */
    font-weight: bold; /* Bold font for AUM */
    color: #343a40; /* Dark color for AUM */
    text-align: right; /* Align text to the right */
}
.aum-label {
    font-size: 1rem; /* Font size for AUM label */
    font-weight: normal; /* Normal font weight for AUM label */
    color: #6c757d; /* Grey color for AUM label */
}
.aum-value {
    font-size: 1rem; /* Large font size for AUM value */
    font-weight: bold; /* Bold font for AUM value */
    color: #343a40; /* Dark color for AUM value */
}
 /* Select 2 */
.select2-container .select2-selection--single {
  height: calc(1.5em + 0.75rem + 2px) !important;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
}
/* Adjust the position of the dropdown arrow */
.select2-container .select2-selection--single .select2-selection__arrow {
  height: calc(1.5em + 0.75rem) !important;
  position: absolute;
  top: 1px;
  right: 1px;
  width: 20px;
}

/* Vertically center the text */
.select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 1.5 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-top: 0.1rem !important;
}

.il-card-icons-wrapper .il-card-icons:hover{
	background-color: rgba(128,128,128,0.25);
	border:1px solid black;
	height: 1.5rem;
	width: 1.5rem;
	border-radius: 50%;		

	.il-change-icon{
		position: absolute;
		top: 50%;   
		left: 50%;  
		transform: translate(-50%, -50%);
		width: 1rem !important;
		height: 1rem !important;
		font-size: 1rem !important;
		color: #7A818C;
		/* font-weight: 500; */
	}	
	.il-icon-diameter {
		position: relative;
		width: 100%;
		height: 1px;
		left: 0;
		top: 50%;
		background: black;
		transform: rotate(30deg);
	}
}

.il-card-icons-wrapper .il-card-icons.active{
	background-color: rgba(128,128,128,0.50);
	border:1px solid black;
	height: 1.5rem;
	width: 1.5rem;
	border-radius: 50%;		

	.il-change-icon{
		position: absolute;
		top: 50%;   
		left: 50%;  
		transform: translate(-50%, -50%);
		width: 1rem !important;
		height: 1rem !important;
		font-size: 1rem !important;
		color: #7A818C;
		/* font-weight: 500; */
	}		
	.il-icon-diameter {
		position: relative;
		width: 100%;
		height: 1px;
		left: 0;
		top: 50%;
		background: black;
		transform: rotate(30deg);
	}
}
.il-communication-sidebar{
	width : 45% !important;
}
.il-communication-sidebar .form-control, .il-communication-sidebar .form-select{
	font-size: .875em !important;
}

/* Investor Details sidebar */
.update-investor-details{
	width : 45% !important;
}
.update-investor-details .form-control, .update-investor-details .form-select{
	font-size: .875em !important;
}

/* Family Details Sidebar */
.update-family-sidebar{
	width : 45% !important;
}
.update-family-sidebar .form-control, .update-family-sidebar .form-select{
	font-size: .875em !important;
}
.family-head-radio-container {
	display: inline-block;
	cursor: pointer;
}

.family-head-radio-container input[type="radio"] {
	display: none;
}

.family-head-icon {
	font-size: 1rem;
	color: #6c757d;
	transition: color 0.3s ease;
}


.family-head-radio-container input[type="radio"]:checked + .family-head-icon, .family-head-radio-container input[type="radio"]:hover + .family-head-icon {
	color: var(--color-primary);
}

/* Investment Philosophy */
.nav-underline-border{
	width: max-content;
}
.selected-mutual-fund{
	align-items: center;
	padding: 0px 8px 0px 16px;
	gap: 4px;
	background: #0163BA;
	border-radius: 9999px;
	color: white;
}
.selected-mutual-fund span{
	cursor: pointer;
}
.fb-no-basket-available{
	min-height: calc(100vh - 40vh);
}
.create-basket-sidebar, .create-fund-sidebar{
	width : 50% !important;
}
.create-basket-sidebar .form-control, .create-basket-sidebar .form-select, .create-fund-sidebar .form-control, .create-fund-sidebar .form-select{
	font-size: .875em !important;
}

/* investor 360 */
.accordion-portfolio-summary:not(.collapsed){
	background-color: white;
	box-shadow: none;
	color: #202C3D;
}
.accordion-quick-reports:not(.collapsed){
	background-color: white !important;
	box-shadow: none  !important;
}
.accordion-portfolio-reviews:not(.collapsed){
	background-color:#F3F7FD !important;
}
.table-portfolio-review tr td{
	background-color: #F2F2F2;
}
/* .portfolio-review-wrapper .meeting-notes-wrapper:hover .edit-icon {
	opacity: 1;
}
.portfolio-review-wrapper .meeting-agenda-wrapper:hover .edit-icon {
	opacity: 1; 
} */
/* schedule-review-meeting */
.schedule-review-meeting-sidebar{
	width : 45% !important;
}
.schedule-review-meeting-sidebar .form-control, .schedule-review-meeting-sidebar .form-select{
	font-size: .875em !important;
}
/* add-points */
.add-points-sidebar{
	width : 45% !important;
}
.add-points-sidebar .form-control, .add-points-sidebar .form-select{
	font-size: .875em !important;
}
/* add-notes */
.add-notes-sidebar{
	width : 45% !important;
}
.add-notes-sidebar .form-control, .add-notes-sidebar .form-select{
	font-size: .875em !important;
}


/* Data Table */
.dt-paging{
	margin-top: 20px !important;
}
.pagination {
	/* width: 100%; */
	justify-content: center;
}
.page-link.disabled, .disabled > .page-link{
	background: unset !important;
	border: none;
}
.page-link{
	/* background: unset !important; */
	border: none;
	color: #0163BA;
}
.page-link.active, .active > .page-link{
	background: #0163BA;
	border-radius: 4px;
}
.page-link:focus {
	outline: none;
	box-shadow : none;
}
.mutual-fund-table tr {
	border: 1px solid #B8BCC1;
}
.mutual-fund-table tr td {
	padding: 15px;
}
table tfoot th{
	background-color: #B8BCC1 !important;
}

/* Table Loader */
@-webkit-keyframes moving-gradient {
    0% { background-position: -250px 0; }
    100% { background-position: 250px 0; }
}

.mutual-fund-table {
  width: 100%;
  tr {
    border-bottom: 1px solid rgba(0,0,0,.1);
    td {
      height: 50px;
      vertical-align: middle;
      padding: 8px;
      span {
        display: block;
      }
      &.mfstd-1 {
        width: 10%;
        span {
          height: 12px;
          background: linear-gradient(to right, #eee 20%, #ddd 50%, #eee 80%);
          background-size: 500px 100px;
          animation-name: moving-gradient;
          animation-duration: 1s;
          animation-iteration-count: infinite;
          animation-timing-function: linear;
          animation-fill-mode: forwards;
        }
      }
      &.mfstd-2 {
        width: 60%;
        span {
          height: 12px;
          background: linear-gradient(to right, #eee 20%, #ddd 50%, #eee 80%);
          background-size: 500px 100px;
          animation-name: moving-gradient;
          animation-duration: 1s;
          animation-iteration-count: infinite;
          animation-timing-function: linear;
          animation-fill-mode: forwards;
        }
      }
      &.mfstd-3 {
        width: 10%;
        span {
          height: 12px;
          background: linear-gradient(to right, #eee 20%, #ddd 50%, #eee 80%);
          background-size: 500px 100px;
          animation-name: moving-gradient;
          animation-duration: 1s;
          animation-iteration-count: infinite;
          animation-timing-function: linear;
          animation-fill-mode: forwards;
        }
      }
      &.mfstd-4 {
		width: 10%;
        span {
          height: 12px;
          background: linear-gradient(to right, #eee 20%, #ddd 50%, #eee 80%);
          background-size: 500px 100px;
          animation-name: moving-gradient;
          animation-duration: 1s;
          animation-iteration-count: infinite;
          animation-timing-function: linear;
          animation-fill-mode: forwards;
        }
      }
      &.mfstd-5 {
        width: 10%;
        span {
          height: 12px;
          background: linear-gradient(to right, #eee 20%, #ddd 50%, #eee 80%);
          background-size: 500px 100px;
          animation-name: moving-gradient;
          animation-duration: 1s;
          animation-iteration-count: infinite;
          animation-timing-function: linear;
          animation-fill-mode: forwards;
        }
      }
    }
  }
}


/* investor 360 */  

  .timeline {
	background: white; 
	counter-reset: section;
	margin: 20px auto;
	padding-left: 70px;
	padding-top: 50px;
  }
  
  .timeline .col-xs-12 {
	border-left: solid 4px orange;
	padding-bottom: 80px;
	padding-left: 40px;
	padding-right: 60px;
  }
  
  .timeline .col-xs-12:before {
	/* counter */
	counter-increment: section;
	content: counter(section);
	/* position */
	position: absolute;
	left: 140px; /* = (width + border-left) / 2 */
	/* top: -30px; */
	/* form & size */
	border-radius: 50%;
	height: 40px;
	width: 40px;
	/* colors & text */
	background: orange;
	color: white;
	font-size: 22px;
	font-weight: bold;
	line-height: 40px;
	text-align: center;
  }
  
  /* images */
  .timeline img {
	margin-top: 20px;
	width: 100%;
  }
  
  .text-primary {
	color: var(--color-primary) !important;
  }
  
  .bg-primary {
	background-color: var(--color-primary) !important;
  }
  
  .border-primary {
	border-color: var(--color-primary) !important;
  }


  .nav-tabs .nav-link {
	color: #000;
  }

  .nav-tabs .nav-link:hover,
  .nav-tabs .nav-link:focus {
	color: #000;
  }

/* Comment Card Styles */
.comment-card:hover {
	box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
}

#investorCommentInput:focus {
	border-color: #0163BA !important;
	box-shadow: 0 0 0 3px rgba(1, 99, 186, 0.1) !important;
	background: #fff !important;
}

#btnAddInvestorComment:hover {
	background: #014d91 !important;
}

#btnCancelInvestorComment:hover {
	background: #e2e8f0 !important;
}

/* ============================================
   Task List Styles (Gmail-style)
   ============================================ */

/* Filters Section */
.task-filters-section {
	background: #ffffff;
	border-radius: 0.75rem;
	border: 1px solid #e2e8f0;
	padding: 16px 20px;
}

.task-filters-row {
	display: flex;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
}

/* Dotted Separator */
.task-filters-separator {
	border-bottom: 2px dotted #cbd5e1;
	margin: 14px 0;
}

/* Status Checkboxes */
.task-status-checkboxes {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 6px 12px;
	background: #f8fafc;
	border: 1px solid #e2e8f0;
	border-radius: 6px;
}

.task-status-checkbox {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	color: #374151;
	cursor: pointer;
	margin: 0;
	white-space: nowrap;
}

.task-status-checkbox input[type="checkbox"] {
	width: 16px;
	height: 16px;
	cursor: pointer;
	accent-color: #0163BA;
}

/* Priority Filter Buttons (Color-coded) */
.task-priority-filter {
	display: flex;
	align-items: center;
	gap: 4px;
	padding: 4px;
	background: #f8fafc;
	border: 1px solid #e2e8f0;
	border-radius: 6px;
}

.task-priority-btn {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 5px 10px;
	font-size: 12px;
	font-weight: 500;
	color: #64748b;
	background: transparent;
	border: 1px solid transparent;
	border-radius: 4px;
	cursor: pointer;
	transition: all 0.15s ease;
	white-space: nowrap;
}

.task-priority-btn:hover {
	background: #e2e8f0;
}

.task-priority-btn.active {
	background: #fff;
	border-color: #cbd5e1;
	color: #1e293b;
	box-shadow: 0 1px 2px rgba(0,0,0,0.05);
}

.task-priority-btn .priority-dot {
	width: 10px;
	height: 10px;
	border-radius: 3px;
}

.task-priority-btn.priority-high .priority-dot {
	background: #E74C3C;
}

.task-priority-btn.priority-medium .priority-dot {
	background: #F2994A;
}

.task-priority-btn.priority-low .priority-dot {
	background: #4A90E2;
}

.task-priority-btn.priority-high.active {
	background: #fef2f2;
	border-color: #E74C3C;
	color: #E74C3C;
}

.task-priority-btn.priority-medium.active {
	background: #fffbeb;
	border-color: #F2994A;
	color: #b45309;
}

.task-priority-btn.priority-low.active {
	background: #eff6ff;
	border-color: #4A90E2;
	color: #1d4ed8;
}

.task-search-box {
	position: relative;
	display: flex;
	align-items: center;
	background: #ffffff;
	border-radius: 25px;
	padding: 0 16px;
	border: 1px solid #e2e8f0;
	min-height: 40px;
}

.task-search-box i {
	color: #0163BA;
	font-size: 1rem;
}

.task-search-box input {
	border: none;
	background: transparent;
	padding: 8px 12px;
	font-size: 14px;
	outline: none;
	width: 100%;
	min-width: 200px;
}

.task-search-box input::placeholder {
	color: #94a3b8;
}

.task-filter-select {
	height: 40px;
	font-size: 13px;
	padding: 8px 12px;
	border-radius: 6px;
	border: 1px solid #e2e8f0;
	background: #ffffff;
	color: #1e293b;
	min-width: 160px;
	cursor: pointer;
}

.task-filter-date {
	height: 40px;
	font-size: 13px;
	padding: 8px 12px;
	border-radius: 6px;
	border: 1px solid #e2e8f0;
	background: #ffffff;
	color: #1e293b;
	cursor: pointer;
}

.task-filter-select:focus,
.task-filter-date:focus {
	border-color: #0163BA;
	box-shadow: 0 0 0 3px rgba(1, 99, 186, 0.12);
	outline: none;
}

.task-export-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 40px;
	padding: 0 20px;
	border-radius: 6px;
	border: 1px solid #1e293b;
	background: #ffffff;
	color: #1e293b;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.15s ease;
	white-space: nowrap;
}

.task-export-btn:hover {
	background: #1e293b;
	color: #ffffff;
}

.task-txn-checkbox {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 16px;
	font-size: 13px;
	color: #374151;
	background: #f8fafc;
	border: 1px solid #e2e8f0;
	border-radius: 6px;
	cursor: pointer;
	white-space: nowrap;
}

.task-txn-checkbox input {
	width: 16px;
	height: 16px;
	accent-color: #0163BA;
	cursor: pointer;
}

/* List container states */
.task-empty-state,
.task-loading-state {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 3rem 1rem;
	color: #94a3b8;
	font-size: 0.9rem;
}

.task-empty-state i {
	font-size: 1.75rem;
	margin-bottom: 0.5rem;
	color: #cbd5e1;
}

.task-empty-state span {
	font-size: 0.8rem;
	color: #9ca3af;
}

.task-loading-state span {
	margin-left: 0.4rem;
}

/* Task List Header */
.task-list-header {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 16px;
	background: #f8fafc;
	border-bottom: 2px solid #e2e8f0;
	font-size: 11px;
	font-weight: 600;
	color: #64748b;
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.task-header-action {
	flex-shrink: 0;
	width: 32px;
}

.task-header-priority {
	flex-shrink: 0;
	width: 8px;
	margin: 0 6px 0 2px;
}

.task-header-col {
	display: flex;
	align-items: center;
	min-width: 0;
}

.task-header-col-title {
	flex: 2;
}

.task-header-col-investor {
	flex: 1.5;
}

.task-header-col-owner,
.task-header-col-status {
	flex: 1;
}

.task-header-col-due {
	flex: 1.2;
}

.task-header-divider {
	width: 1px;
	height: 16px;
	background: #e2e8f0;
	flex-shrink: 0;
}

.task-header-arrow {
	width: 20px;
	flex-shrink: 0;
}

/* Task Row (Gmail-style horizontal layout) */
.task-row {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 16px;
	background: #fff;
	border-bottom: 1px solid #f1f5f9;
	cursor: pointer;
	transition: all 0.15s ease;
	position: relative;
	overflow: hidden;
}

.task-row:hover {
	background: #f8fafc;
}

.task-row-selected {
	background: #eff6ff !important;
	border-left: 3px solid #0163BA;
}

.task-row-done {
	opacity: 0.6;
	background: #fafafa;
}

/* Priority color strip block near left (as per sketch) */
.task-row-priority-strip {
	flex-shrink: 0;
	width: 8px;
	border-radius: 8px;
	margin: 0 6px 0 2px;
	align-self: stretch;
	background: #e5e7eb; /* default, overridden by priority */
}

.task-row-priority-high .task-row-priority-strip {
	background: #E74C3C;
}

.task-row-priority-medium .task-row-priority-strip {
	background: #F2994A;
}

.task-row-priority-low .task-row-priority-strip {
	background: #4A90E2;
}

/* Task Row Action Button (Mark as Done) */
.task-row-action {
	flex-shrink: 0;
	width: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.btn-task-mark-done {
	width: 24px;
	height: 24px;
	border-radius: 50%;
	border: 2px solid #cbd5e1;
	background: transparent;
	color: #94a3b8;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all 0.15s ease;
	font-size: 11px;
	padding: 0;
}

.btn-task-mark-done:hover {
	border-color: #16A34A;
	color: #16A34A;
	background: #f0fdf4;
}

.btn-task-mark-done:active {
	transform: scale(0.95);
}

.task-done-indicator {
	color: #16A34A;
	font-size: 18px;
}

.task-done-indicator i {
	display: block;
}

.task-row-main {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	flex: 1;
}

.task-row-title {
	font-size: 14px;
	font-weight: 500;
	color: #1e293b;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	margin-bottom: 2px;
}

.task-row-title-done {
	text-decoration: line-through;
	color: #94a3b8;
}

.task-row-sub {
	display: flex;
	align-items: center;
	gap: 4px;
	font-size: 12px;
	color: #64748b;
}

.task-row-col {
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-width: 0;
}

/* Vertical Divider between columns */
.task-row-divider {
	width: 1px;
	align-self: stretch;
	background: #e2e8f0;
	flex-shrink: 0;
	margin: 0 4px;
}

.task-row-col-title {
	flex: 2;
}

.task-row-col-investor {
	flex: 1.5;
	justify-content: center;
}

.task-row-col-investor .task-row-text {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 100%;
	display: block;
	font-size: 13px;
	color: #374151;
}

.task-row-col-owner,
.task-row-col-status {
	flex: 1;
}

.task-row-col-due {
	flex: 1.2;
}

.task-row-label {
	font-size: 10px;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: #9CA3AF;
}

.task-row-text {
	font-size: 12px;
	color: #374151;
}

.task-row-owner-inner {
	display: flex;
	align-items: center;
	gap: 6px;
	min-width: 0;
}

.task-row-avatar {
	flex-shrink: 0;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 600;
	font-size: 11px;
}

.task-row-owner-name {
	max-width: 90px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.task-row-col-due {
	align-items: flex-start;
}

.task-row-due-date {
	font-size: 13px;
	font-weight: 500;
	color: #374151;
	line-height: 1.2;
}

.task-row-due-relative {
	font-size: 10px;
	color: #64748b;
	margin-top: 2px;
	line-height: 1;
}

.task-row-due-overdue {
	color: #DC2626 !important;
	font-weight: 500;
}

.task-row-status-pill {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 2px 10px;
	border-radius: 9999px;
	font-size: 11px;
	font-weight: 500;
	white-space: nowrap;
}

.task-row-status-type {
	margin-top: 2px;
	font-size: 10px;
	color: #9CA3AF;
	white-space: nowrap;
}

.task-row-arrow-col {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 20px;
	color: #cbd5e1;
	font-size: 12px;
}

.task-row:hover .task-row-arrow-col {
	color: #0163BA;
}

/* Task Disable Button (in list row) */
.task-row-delete-col {
	display: flex;
	align-items: center;
	padding: 0 6px;
	opacity: 0;
	transition: opacity 0.2s ease;
}
.task-row:hover .task-row-delete-col {
	opacity: 1;
}
.btn-task-delete {
	background: none;
	border: none;
	color: #94a3b8;
	cursor: pointer;
	padding: 4px 8px;
	border-radius: 4px;
	font-size: 13px;
	transition: all 0.2s ease;
}
.btn-task-delete:hover {
	color: #ef4444;
	background: #fef2f2;
}
/* Activity Log toggle button (subtle icon at right of Comments heading) */
.btn-activity-log-toggle {
	background: none;
	border: 1px solid transparent;
	color: #94a3b8;
	font-size: 13px;
	padding: 3px 7px;
	border-radius: 6px;
	cursor: pointer;
	transition: all 0.2s ease;
	line-height: 1;
}
.btn-activity-log-toggle:hover {
	color: #475569;
	background: #f1f5f9;
	border-color: #e2e8f0;
}
.btn-activity-log-toggle.active {
	color: #3b82f6;
	background: #eff6ff;
	border-color: #bfdbfe;
}

/* Activity Log collapsible panel */
.task-activity-log-collapse {
	background: #f8fafc;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	padding: 12px;
	margin-bottom: 12px;
}
.task-activity-log-wrapper {
	max-height: 350px;
	overflow-y: auto;
	padding-right: 4px;
}
.activity-entry:hover {
	box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

/* Task Disable Button (in detail panel header) */
.btn-task-delete-action {
	color: #ef4444 !important;
	border: 1px solid #fecaca !important;
}
.btn-task-delete-action:hover {
	background: #fef2f2 !important;
	color: #dc2626 !important;
}

/* Task Detail Panel */
.task-detail-wrapper {
	padding: 12px 0;
	height: 100%;
	display: flex;
	flex-direction: column;
	background: #f3f4f6;
}

.task-detail-inner {
	width: 100%;
	max-width: 980px;
	margin: 0 auto;
	background: #ffffff;
	border-radius: 12px;
	box-shadow: 0 8px 20px rgba(15, 23, 42, 0.06);
	overflow: hidden;
	border: 1px solid #e5e7eb;
}

.task-detail-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 10px 18px;
	border-bottom: 1px solid #e2e8f0;
	background: #f9fafb;
	position: sticky;
	top: 0;
	z-index: 5;
}

.btn-task-back {
	background: none;
	border: none;
	padding: 8px 12px;
	color: #64748b;
	cursor: pointer;
	border-radius: 6px;
	transition: all 0.15s ease;
}

.btn-task-back:hover {
	background: #e2e8f0;
	color: #1e293b;
}

.task-detail-header-actions {
	display: flex;
	gap: 8px;
}

.btn-task-action {
	background: #f1f5f9;
	border: none;
	color: #64748b;
	padding: 6px 12px;
	border-radius: 6px;
	font-size: 13px;
}

.btn-task-action:hover {
	background: #e2e8f0;
	color: #1e293b;
}

.btn-task-done-action {
	background: #16A34A;
	color: #fff;
}

.btn-task-done-action:hover {
	background: #15803d;
	color: #fff;
}

.task-detail-title-section {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
	padding: 16px 18px 14px 18px;
	border-bottom: 1px solid #e2e8f0;
}

.task-detail-title-left {
	flex: 1;
	min-width: 0;
}

.task-detail-title-right {
	flex-shrink: 0;
	text-align: right;
}

.task-detail-title {
	font-size: 18px;
	font-weight: 600;
	color: #1e293b;
	margin: 0 0 10px 0;
	line-height: 1.3;
}

.task-detail-title-done {
	text-decoration: line-through;
	color: #94a3b8;
}

.task-detail-title-badges {
	display: flex;
	align-items: center;
	gap: 8px;
}

.task-detail-status-badge,
.task-detail-priority-badge {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 4px 12px;
	border-radius: 20px;
	font-size: 12px;
	font-weight: 500;
}

.task-detail-priority-badge .priority-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
}

.task-detail-created {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 2px;
}

.task-detail-created-label {
	font-size: 11px;
	color: #94a3b8;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

.task-detail-created-value {
	font-size: 13px;
	color: #334155;
	font-weight: 500;
}

.task-detail-created-by {
	font-size: 12px;
	color: #64748b;
}

/* Info Rows */
.task-detail-info-row {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 16px;
	padding: 14px 18px;
	border-bottom: 1px solid #e2e8f0;
}

.task-detail-info-item {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

/* Person with avatar */
.task-detail-person {
	display: flex;
	align-items: center;
	gap: 8px;
}

.task-detail-person-avatar {
	flex-shrink: 0;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 600;
	font-size: 11px;
}

.task-detail-person-name {
	font-size: 13px;
	color: #334155;
}

/* Investor name in blue */
.task-detail-investor-value {
	color: #0163BA !important;
	font-weight: 500;
}

/* Observer names in blue */
.task-detail-observer-name {
	color: #0163BA;
	font-weight: 500;
}

/* Due date with calendar icon */
.task-detail-due {
	display: flex;
	align-items: center;
	gap: 8px;
}

.task-detail-due i {
	color: #64748b;
	font-size: 14px;
}

/* Legacy styles - keep for compatibility */
.task-detail-badges {
	display: flex;
	gap: 8px;
	padding: 10px 18px;
	border-bottom: 1px solid #e2e8f0;
}

.task-detail-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
	padding: 12px 18px 14px 18px;
	border-bottom: 1px solid #e2e8f0;
}

.task-detail-item {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.task-detail-label {
	font-size: 11px;
	color: #94a3b8;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

.task-detail-value {
	font-size: 13px;
	color: #334155;
	font-weight: 500;
}

.task-detail-section {
	padding: 14px 18px;
	border-bottom: 1px solid #e2e8f0;
}

.task-detail-section:last-child {
	border-bottom: none;
	flex: 1;
	overflow-y: auto;
}

.task-detail-section-title {
	font-size: 13px;
	font-weight: 600;
	color: #64748b;
	margin-bottom: 12px;
}

.task-detail-description {
	font-size: 13px;
	color: #475569;
	line-height: 1.6;
	margin: 0;
}

/* Transaction detail table in task detail panel */
.task-detail-txn-table-wrap {
	overflow-x: auto;
}

.task-detail-txn-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 12px;
	color: #334155;
}

.task-detail-txn-table th {
	background: #f8fafc;
	font-weight: 600;
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.3px;
	color: #64748b;
	padding: 8px 10px;
	border: 1px solid #e2e8f0;
	white-space: nowrap;
}

.task-detail-txn-table td {
	padding: 7px 10px;
	border: 1px solid #e2e8f0;
	max-width: 180px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* Task Comments in Detail Panel */
.task-comments-wrapper {
	max-height: 200px;
	overflow-y: auto;
}

.task-comment {
	display: flex;
	gap: 10px;
	margin-bottom: 12px;
}

.task-comment-avatar {
	flex-shrink: 0;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 600;
	font-size: 11px;
}

.task-comment-content {
	flex: 1;
	min-width: 0;
	background: #f8fafc;
	padding: 10px 12px;
	border-radius: 8px;
}

.task-comment-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 4px;
}

.task-comment-author {
	font-size: 12px;
	font-weight: 600;
	color: #0163BA;
}

.task-comment-date {
	font-size: 10px;
	color: #94a3b8;
}

.task-comment-body {
	font-size: 13px;
	color: #475569;
	line-height: 1.5;
}

.task-comment-input-wrapper textarea {
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	font-size: 13px;
	resize: none;
}

.task-comment-input-wrapper textarea:focus {
	border-color: #0163BA;
	box-shadow: 0 0 0 3px rgba(1, 99, 186, 0.1);
}

/* Task comment input focus (mirror investor comments) */
#taskCommentInput:focus {
	border-color: #0163BA !important;
	box-shadow: 0 0 0 3px rgba(1, 99, 186, 0.1) !important;
	background: #fff !important;
}

.task-comment-actions {
	display: flex;
	justify-content: flex-end;
	gap: 8px;
	margin-top: 8px;
}

.btn-cancel-comment {
	background: #f1f5f9;
	color: #64748b;
	border: none;
	padding: 6px 12px;
	border-radius: 6px;
	font-size: 12px;
}

.btn-cancel-comment:hover {
	background: #e2e8f0;
}

.btn-add-comment {
	background: #0163BA;
	color: #fff;
	border: none;
	padding: 6px 12px;
	border-radius: 6px;
	font-size: 12px;
}

.btn-add-comment:hover {
	background: #014d91;
}

/* Task filters container */
.task-filters-container .form-select:focus,
.task-filters-container .form-control:focus {
	border-color: #0163BA;
	box-shadow: 0 0 0 3px rgba(1, 99, 186, 0.1);
}

/* Scrollbar styles */
#taskCardsWrapper {
	scrollbar-width: thin;
	scrollbar-color: #cbd5e1 #f1f5f9;
}

#taskCardsWrapper::-webkit-scrollbar,
#taskDetailContent::-webkit-scrollbar {
	width: 6px;
}

#taskCardsWrapper::-webkit-scrollbar-track,
#taskDetailContent::-webkit-scrollbar-track {
	background: #f1f5f9;
	border-radius: 3px;
}

#taskCardsWrapper::-webkit-scrollbar-thumb,
#taskDetailContent::-webkit-scrollbar-thumb {
	background: #cbd5e1;
	border-radius: 3px;
}

#taskCardsWrapper::-webkit-scrollbar-thumb:hover,
#taskDetailContent::-webkit-scrollbar-thumb:hover {
	background: #94a3b8;
}

/* Search input styling */
#taskSearchInput::placeholder {
	color: #94a3b8;
}

/* Task Pagination */
.task-pagination-wrapper {
	margin-top: 16px;
	padding: 12px 16px;
	background: #fff;
	border-radius: 8px;
	border: 1px solid #e2e8f0;
}

.task-pagination {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 12px;
}

.task-pagination-info {
	font-size: 13px;
	color: #64748b;
}

.task-pagination-controls {
	display: flex;
	align-items: center;
	gap: 8px;
}

.task-page-btn {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 6px 12px;
	font-size: 13px;
	font-weight: 500;
	color: #475569;
	background: #f8fafc;
	border: 1px solid #e2e8f0;
	border-radius: 6px;
	cursor: pointer;
	transition: all 0.15s ease;
}

.task-page-btn:hover:not(:disabled) {
	background: #e2e8f0;
	color: #1e293b;
}

.task-page-btn:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

.task-page-numbers {
	display: flex;
	align-items: center;
	gap: 4px;
}

.task-page-num {
	min-width: 32px;
	height: 32px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 13px;
	font-weight: 500;
	color: #475569;
	background: transparent;
	border: 1px solid transparent;
	border-radius: 6px;
	cursor: pointer;
	transition: all 0.15s ease;
}

.task-page-num:hover {
	background: #f1f5f9;
	border-color: #e2e8f0;
}

.task-page-num.active {
	background: #0163BA;
	color: #fff;
	border-color: #0163BA;
}

.task-page-ellipsis {
	padding: 0 4px;
	color: #94a3b8;
}

/* ── Lead Form Read-only Mode (Converted leads) ─────────────── */

.lead-form--readonly .form-section {
	opacity: 0.55;
	pointer-events: none;
	background: #f1f5f9;
	border-color: #e2e8f0;
	box-shadow: none;
	transition: all 0.2s ease;
}

.lead-form--readonly .form-section:hover {
	border-color: #e2e8f0;
	box-shadow: none;
	transform: none;
}

.lead-form--readonly .form-control:disabled,
.lead-form--readonly .form-select:disabled {
	background-color: #f1f5f9;
	color: #64748b;
	border-color: #e2e8f0;
	cursor: not-allowed;
}

/* Cards, toggle, and upload inherit section opacity — only block interaction */
.lead-form--readonly .profile-type-card,
.lead-form--readonly .source-card,
.lead-form--readonly .social-media-card,
.lead-form--readonly .btn-advanced-toggle,
.lead-form--readonly .file-upload-wrapper {
	pointer-events: none;
}

/* PAN info section — visible but non-interactive */
.lead-form--readonly #converted-state-referral-wrapper {
	opacity: 0.85;
	pointer-events: none;
}

/* Investment section stays fully active */
.lead-form--readonly #converted-investment-wrapper {
	opacity: 1;
	pointer-events: auto;
	background: linear-gradient(135deg, #ffffff 0%, #f0f7ff 100%);
	border-color: #0163BA;
	box-shadow: 0 2px 8px rgba(1, 99, 186, 0.12);
	transition: all 0.2s ease;
}

.lead-form--readonly #converted-investment-wrapper:hover {
	border-color: #0163BA;
	box-shadow: 0 4px 14px rgba(1, 99, 186, 0.18);
}