/**
 * NGUYÊN KHOA — brand overrides (logo + green-only UI).
 * Pigment Green #08A045 | Dartmouth #0B6E4F | Mantis #6BBF59 | Midnight #073B3A
 */
@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@400;500;600;700&display=swap');

body .mk-app-shell {
	font-family: "Be Vietnam Pro", Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	-webkit-font-smoothing: antialiased;
}

:root {
	--nk-green: #08a045;
	--nk-green-dark: #0b6e4f;
	--nk-green-light: #6bbf59;
	--nk-green-pale: #ecfdf3;
	--nk-green-hover: #d1fae5;
	--nk-green-deep: #073b3a;

	--mk-primary: var(--nk-green);
	--mk-primary-hover: var(--nk-green-dark);
	--mk-brand-light: var(--nk-green-light);
	--mk-brand-deep: var(--nk-green-deep);
	--mk-btn-primary-bg: var(--nk-green);
	--mk-btn-primary-text: #ffffff;
	--mk-input-focus-border: var(--nk-green);
	--mk-input-focus-ring: rgba(8, 160, 69, 0.22);
	--mk-sidebar-active-bg: var(--nk-green-pale);
	--mk-sidebar-active-border: var(--nk-green);
	--mk-sidebar-active-text: var(--nk-green-dark);
	--mk-sidebar-icon-active: var(--nk-green);
	--mk-sidebar-hover-bg: var(--nk-green-dark);
	--mk-amber: var(--nk-green);
	--mk-amber-border: rgba(8, 160, 69, 0.45);
	--mk-lux-gold-deep: var(--nk-green-dark);
	--mk-chart-secondary: var(--nk-green);
}

html[data-theme="dark"] {
	--mk-primary: var(--nk-green);
	--mk-primary-hover: var(--nk-green-light);
	--mk-border-accent: rgba(8, 160, 69, 0.35);
	--mk-sidebar-active-bg: rgba(8, 160, 69, 0.14);
	--mk-sidebar-active-border: var(--nk-green);
	--mk-sidebar-active-text: var(--nk-green-light);
	--mk-sidebar-icon-active: var(--nk-green-light);
	--mk-input-focus-border: var(--nk-green);
	--mk-input-focus-ring: rgba(8, 160, 69, 0.18);
	--mk-btn-primary-bg: var(--nk-green);
	--mk-btn-primary-text: #ffffff;
	--mk-table-row-hover: rgba(8, 160, 69, 0.08);
	--mk-chart-primary: var(--nk-green);
	--mk-kpi-inventory: var(--nk-green);
	--mk-amber: var(--nk-green);
	--mk-amber-border: rgba(8, 160, 69, 0.45);
	--mk-lux-gold-deep: var(--nk-green-light);
}

/* Logo — centered in sidebar brand area */
.mk-dash-sidebar-brand:has(.nguyenkhoa-logo) {
	align-items: center;
	justify-content: center;
	padding: 12px 14px 10px;
	min-height: 104px;
}

.mk-dash-sidebar-brand:not(:has(#appnavigator)) .mk-dash-sidebar-logo {
	width: 100%;
	flex: 1 1 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}

.mk-dash-sidebar-brand .mk-dash-sidebar-logo {
	flex: 1 1 auto;
	min-width: 0;
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}

.mk-dash-sidebar-brand .mk-dash-sidebar-logo .company-logo:has(.nguyenkhoa-logo) {
	display: flex !important;
	justify-content: center !important;
	align-items: center !important;
	width: 100% !important;
	height: auto !important;
	max-height: none !important;
	min-height: 88px !important;
	padding: 0 !important;
}

.mk-dash-sidebar-brand .mk-dash-sidebar-logo .company-logo img.nguyenkhoa-logo,
.mk-dash-sidebar-brand .mk-dash-sidebar-logo .company-logo .mk-dash-bace-logo.nguyenkhoa-logo {
	display: block !important;
	width: auto !important;
	max-width: 100% !important;
	height: auto !important;
	max-height: 96px !important;
	min-height: 72px !important;
	margin: 0 auto !important;
	object-fit: contain !important;
	object-position: center center !important;
}

/* Only one logo in sidebar — hide legacy light/dark pair if still present */
.mk-dash-bace-logo--dark.nguyenkhoa-logo {
	display: none !important;
}

html[data-theme="dark"] .mk-dash-bace-logo--light.nguyenkhoa-logo {
	display: none !important;
}

html[data-theme="dark"] .mk-dash-bace-logo--dark.nguyenkhoa-logo {
	display: block !important;
}

.loginPageContainer .user-logo.nguyenkhoa-logo,
.loginPageContainer .nk-split-brand__logo img {
	max-height: none !important;
	max-width: none !important;
	filter: drop-shadow(0 20px 40px rgba(0, 0, 0, 0.35)) !important;
}

body[data-view="Login"] .loginPageContainer .bace-logo-tile {
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
}

html[data-theme="dark"] .mk-dash-sidebar-brand .nguyenkhoa-logo {
	background: #ffffff;
	border-radius: 10px;
	padding: 4px 10px;
	box-sizing: border-box;
}

/* Sidebar — green active states (override any leftover amber) */
.mk-dash-nav-item--active,
.mk-dash-app-group--active > .mk-dash-app-toggle,
.mk-dash-mod-link--active {
	background: var(--nk-green-pale) !important;
	color: var(--nk-green-dark) !important;
	box-shadow: inset -4px 0 0 var(--nk-green) !important;
}

.mk-dash-nav-item--active .mk-dash-nav-label,
.mk-dash-nav-item--active .mk-dash-svg,
.mk-dash-app-group--active > .mk-dash-app-toggle .mk-dash-svg {
	color: var(--nk-green-dark) !important;
}

/* Sidebar — hover: light green (active) → dark green (never yellow) */
.mk-dash-app-toggle:hover,
.mk-dash-app-toggle:focus,
.mk-dash-mod-link:hover,
.mk-dash-nav-item:hover,
.mk-dash-sidebar-brand #appnavigator.mk-dash-appnavigator:hover {
	background: var(--nk-green-dark) !important;
	color: #ffffff !important;
}

.mk-dash-app-toggle:hover .mk-dash-svg,
.mk-dash-app-toggle:focus .mk-dash-svg,
.mk-dash-app-toggle:hover .mk-dash-app-label,
.mk-dash-app-toggle:focus .mk-dash-app-label,
.mk-dash-app-toggle:hover .mk-dash-app-chevron,
.mk-dash-app-toggle:focus .mk-dash-app-chevron,
.mk-dash-nav-item:hover .mk-dash-nav-label,
.mk-dash-nav-item:hover .mk-dash-svg {
	color: #ffffff !important;
}

.mk-dash-app-group--open:not(.mk-dash-app-group--active) > .mk-dash-app-toggle:hover,
.mk-dash-app-group--open:not(.mk-dash-app-group--active) > .mk-dash-app-toggle:focus {
	background: var(--nk-green-dark) !important;
	color: #ffffff !important;
}

.mk-dash-app-group--open:not(.mk-dash-app-group--active) > .mk-dash-app-toggle:hover .mk-dash-svg,
.mk-dash-app-group--open:not(.mk-dash-app-group--active) > .mk-dash-app-toggle:focus .mk-dash-svg {
	color: #ffffff !important;
}

.mk-dash-app-group--active > .mk-dash-app-toggle:hover,
.mk-dash-app-group--active > .mk-dash-app-toggle:focus,
.mk-dash-mod-link--active:hover {
	background: var(--nk-green-dark) !important;
	color: #ffffff !important;
	box-shadow: inset -4px 0 0 var(--nk-green-light) !important;
}

.mk-dash-app-group--active > .mk-dash-app-toggle:hover .mk-dash-svg,
.mk-dash-app-group--active > .mk-dash-app-toggle:focus .mk-dash-svg,
.mk-dash-mod-link--active:hover {
	color: #ffffff !important;
}

.mk-dash-nav-item--active:hover {
	background: var(--nk-green-dark) !important;
	color: #ffffff !important;
}

.mk-dash-nav-item--active:hover .mk-dash-nav-label,
.mk-dash-nav-item--active:hover .mk-dash-svg {
	color: #ffffff !important;
}

/* Primary action buttons — dark green hover (override legacy #ffc85c amber) */
body [class*="btn--primary"]:hover,
body .mk-opportunity-btn--primary:hover,
body .mk-projecttask-btn--primary:hover,
body .mk-project-btn--primary:hover,
body .btn.buttonBlue:hover,
body .btn-primary:hover:not(.disabled):not(:disabled) {
	background: var(--nk-green-dark) !important;
	border-color: var(--nk-green-deep) !important;
	color: #ffffff !important;
	text-shadow: none !important;
}

body [class*="btn--primary"]:hover .mk-dash-topbar-svg,
body .mk-opportunity-btn--primary:hover .mk-opportunity-btn__ic {
	color: #ffffff !important;
}

/* Table rows — light green → darker green on hover */
#listview-table tbody tr.listViewEntries:hover,
#listViewContent #listview-table tbody tr.listViewEntries:hover,
.listview-table tbody tr.listViewEntries:hover {
	background: var(--nk-green-pale) !important;
}

#listview-table tbody tr.listViewEntries:hover td,
.listview-table tbody tr.listViewEntries:hover td {
	background: var(--nk-green-pale) !important;
}

#listview-table tbody tr.listViewEntries:hover td:first-child,
.listview-table tbody tr.listViewEntries:hover td:first-child {
	box-shadow: inset 3px 0 0 var(--nk-green) !important;
}

#listview-table tbody tr.listViewEntries:has(.listViewEntriesCheckBox:checked),
#listview-table tbody tr.listViewEntries.mk-project-row-selected {
	background: var(--nk-green-hover) !important;
}

/* Detail related lists */
body[data-app="SALES"][data-view="Detail"] .relatedContents .listview-table tbody tr.listViewEntries:hover td {
	background: var(--nk-green-pale) !important;
}

body[data-app="SALES"][data-view="Detail"] .relatedContents .listview-table tbody tr.listViewEntries td a {
	color: var(--nk-green-dark) !important;
}

body[data-app="SALES"][data-view="Detail"] .relatedContents .listview-table tbody tr.listViewEntries td a:hover {
	color: var(--nk-green) !important;
}

/* Settings — green active nav (override SettingsUi.css yellow accent) */
body[data-parent="Settings"] {
	--mk-settings-accent: var(--nk-green);
	--mk-settings-accent-hover: var(--nk-green-dark);
}

body[data-parent="Settings"] .mk-dash-nav-item--active {
	background: var(--nk-green-pale) !important;
	color: var(--nk-green-dark) !important;
	box-shadow: inset -4px 0 0 var(--nk-green) !important;
}

body[data-parent="Settings"] .mk-dash-nav-item--active .mk-dash-nav-ic,
body[data-parent="Settings"] .mk-dash-nav-item--active .mk-dash-nav-label,
body[data-parent="Settings"] .mk-dash-nav-item--active .mk-dash-svg {
	color: var(--nk-green-dark) !important;
}

body[data-parent="Settings"] .mk-dash-nav-item--active:hover {
	background: var(--nk-green-dark) !important;
	color: #ffffff !important;
}

body[data-parent="Settings"] .mk-dash-nav-item--active:hover .mk-dash-nav-ic,
body[data-parent="Settings"] .mk-dash-nav-item--active:hover .mk-dash-nav-label,
body[data-parent="Settings"] .mk-dash-nav-item--active:hover .mk-dash-svg {
	color: #ffffff !important;
}

body[data-parent="Settings"] .mk-settings-btn--primary,
body[data-parent="Settings"] .mk-settings-subpage .btn-success,
body[data-parent="Settings"] .mk-settings-subpage .saveButton {
	background: var(--nk-green) !important;
	border-color: var(--nk-green) !important;
	color: #ffffff !important;
}

body[data-parent="Settings"] .mk-settings-btn--primary:hover,
body[data-parent="Settings"] .mk-settings-subpage .btn-success:hover,
body[data-parent="Settings"] .mk-settings-subpage .saveButton:hover {
	background: var(--nk-green-dark) !important;
	border-color: var(--nk-green-dark) !important;
	color: #ffffff !important;
}

/* Kill remaining brand-yellow accents globally */
[class*="--gold"],
.is-gold,
.mk-dashboard-kicker {
	color: var(--nk-green) !important;
}

body[data-view="Login"] .bace-slide h3,
body[data-view="Login"] .bace-brand-title .is-gold,
body[data-view="Login"] .bace-value h4 {
	color: var(--nk-green) !important;
}

/* Opportunity stage pills — early stages use green tints not yellow */
body[data-module="Potentials"][data-view="Detail"][data-app="SALES"] .mk-opportunity-stage-pill--qualification,
body[data-module="Potentials"][data-view="Detail"][data-app="SALES"] .mk-opportunity-stage-pill--prospecting,
body[data-module="Potentials"][data-view="Detail"][data-app="SALES"] .mk-opportunity-stage-pill--needs-analysis {
	background: #dcfce7 !important;
	color: #073b3a !important;
}

body[data-view="Detail"][data-app="SALES"] #detailView td.fieldValue:hover .action,
body[data-view="Detail"][data-app="SALES"] table.summary-table td.fieldValue:hover .action,
body[data-view="Detail"][data-app="SALES"] #detailView td.fieldValue .editAction:hover,
body[data-view="Detail"][data-app="SALES"] table.summary-table td.fieldValue .editAction:hover {
	background: var(--nk-green-pale) !important;
	color: var(--nk-green-dark) !important;
}

/* Green primary buttons — white text, no bootstrap text-shadow halo */
.dashBoardTabContainer .mk-dash-modify-dropdown > .btn,
.dashBoardTabContainer .mk-dashboard-heading--inline .btn.addButton,
body[data-view="DashBoard"] .mk-dashboard-page-header--figma .mk-dash-figma-btn,
body[data-view="DashBoard"] .mk-dashboard-page-header--figma .mk-dash-modify-dropdown > .btn.btn-default,
.btn.buttonBlue,
.mk-opportunity-btn--primary,
.mk-so-btn--primary {
	color: #ffffff !important;
	text-shadow: none !important;
	-webkit-font-smoothing: antialiased;
}

.dashBoardTabContainer .mk-dash-modify-dropdown > .btn:hover,
.dashBoardTabContainer .mk-dashboard-heading--inline .btn.addButton:hover,
body[data-view="DashBoard"] .mk-dashboard-page-header--figma .mk-dash-figma-btn:hover,
body[data-view="DashBoard"] .mk-dashboard-page-header--figma .mk-dash-modify-dropdown > .btn.btn-default:hover {
	color: #ffffff !important;
	text-shadow: none !important;
}

.dashBoardTabContainer .mk-dash-modify-dropdown > .btn .caret,
.dashBoardTabContainer .mk-dashboard-heading--inline .btn.addButton .caret,
body[data-view="DashBoard"] .mk-dashboard-page-header--figma .mk-dash-figma-btn .caret {
	border-top-color: #ffffff !important;
}

/* --------------------------------------------------------------------------
 * Readable text on green buttons + comment fields (detail / list SALES UIs)
 * Fixes gold #6d4d00 on green — unreadable "Gửi" / primary actions
 * -------------------------------------------------------------------------- */
body[data-view="Detail"] .saveComment,
body[data-view="Detail"] .postComment,
body[data-view="Detail"] button[name="saveButton"],
body[data-view="Detail"] .btn-success.saveComment,
body[data-view="Detail"] .btn-success.postComment,
body[data-view="Detail"] .btn-success.detailViewSaveComment,
body[data-view="Detail"] [class*="detail-btn--primary"],
body[data-view="Detail"] [class*="-btn--primary"]:not([class*="--ghost"]):not([class*="--outline"]) {
	color: #ffffff !important;
	text-shadow: none !important;
	-webkit-font-smoothing: antialiased;
}

body[data-view="Detail"] .saveComment:hover,
body[data-view="Detail"] .postComment:hover,
body[data-view="Detail"] button[name="saveButton"]:hover,
body[data-view="Detail"] .btn-success.saveComment:hover,
body[data-view="Detail"] .btn-success.postComment:hover,
body[data-view="Detail"] .btn-success.detailViewSaveComment:hover,
body[data-view="Detail"] [class*="detail-btn--primary"]:hover,
body[data-view="Detail"] [class*="-btn--primary"]:not([class*="--ghost"]):not([class*="--outline"]):hover {
	color: #ffffff !important;
	text-shadow: none !important;
}

body[data-view="Detail"] .commentTextArea textarea,
body[data-view="Detail"] .commentTextArea .commentcontent,
body[data-view="Detail"] [class*="detail-card--comments"] textarea,
body[data-view="Detail"] [class*="detail-card--comments"] .commentcontent {
	color: #0f172a !important;
	background: #ffffff !important;
	border-color: #cbd5e1 !important;
	font-size: 14px !important;
	line-height: 1.5 !important;
}

body[data-view="Detail"] .commentTextArea textarea::placeholder,
body[data-view="Detail"] [class*="detail-card--comments"] textarea::placeholder {
	color: #64748b !important;
	opacity: 1 !important;
}

body[data-view="Detail"] .commentTextArea:focus-within textarea,
body[data-view="Detail"] [class*="detail-card--comments"] textarea:focus {
	border-color: #16a34a !important;
	box-shadow: 0 0 0 3px rgba(22, 163, 74, 0.18) !important;
	outline: none !important;
}

/* --------------------------------------------------------------------------
 * ProjectMilestone / ProjectTask Edit — modern card UI for sub-module editors
 * These modules use the default Vtiger EditView layout without dashboard shell.
 * -------------------------------------------------------------------------- */
body[data-module="ProjectMilestone"][data-view="Edit"],
body[data-module="ProjectTask"][data-view="Edit"] {
	background: linear-gradient(135deg, #f0fdf4 0%, #f8fafc 40%, #ecfdf5 100%) !important;
	font-family: "Be Vietnam Pro", Inter, system-ui, -apple-system, sans-serif;
	-webkit-font-smoothing: antialiased;
}

body[data-module="ProjectMilestone"][data-view="Edit"] .editViewPageDiv,
body[data-module="ProjectTask"][data-view="Edit"] .editViewPageDiv {
	background: transparent !important;
	padding: 0 24px 40px !important;
}

body[data-module="ProjectMilestone"][data-view="Edit"] .editViewHeader,
body[data-module="ProjectTask"][data-view="Edit"] .editViewHeader {
	padding: 20px 0 8px !important;
}

body[data-module="ProjectMilestone"][data-view="Edit"] .editHeader,
body[data-module="ProjectTask"][data-view="Edit"] .editHeader {
	font-size: 1.25rem !important;
	font-weight: 700 !important;
	color: #0f172a !important;
	letter-spacing: -0.01em;
}

body[data-module="ProjectMilestone"][data-view="Edit"] .fieldBlockContainer,
body[data-module="ProjectTask"][data-view="Edit"] .fieldBlockContainer {
	background: #fff !important;
	border-radius: 16px !important;
	box-shadow: 0 4px 24px rgba(31, 41, 55, 0.06) !important;
	border: none !important;
	padding: 24px 28px 28px !important;
	margin-bottom: 20px !important;
}

body[data-module="ProjectMilestone"][data-view="Edit"] .fieldBlockHeader,
body[data-module="ProjectTask"][data-view="Edit"] .fieldBlockHeader {
	font-size: 1.05rem !important;
	font-weight: 600 !important;
	color: #1e293b !important;
	border: none !important;
	border-bottom: none !important;
	padding: 0 0 16px !important;
	margin: 0 0 16px !important;
}

body[data-module="ProjectMilestone"][data-view="Edit"] .fieldBlockContainer table,
body[data-module="ProjectTask"][data-view="Edit"] .fieldBlockContainer table {
	border: none !important;
}

body[data-module="ProjectMilestone"][data-view="Edit"] .fieldBlockContainer td,
body[data-module="ProjectTask"][data-view="Edit"] .fieldBlockContainer td {
	border: none !important;
	vertical-align: middle !important;
	padding: 8px 10px !important;
}

body[data-module="ProjectMilestone"][data-view="Edit"] td.fieldLabel,
body[data-module="ProjectTask"][data-view="Edit"] td.fieldLabel {
	font-size: 13px !important;
	font-weight: 600 !important;
	color: #475569 !important;
	white-space: nowrap;
}

body[data-module="ProjectMilestone"][data-view="Edit"] td.fieldValue input.inputElement,
body[data-module="ProjectMilestone"][data-view="Edit"] td.fieldValue select.inputElement,
body[data-module="ProjectMilestone"][data-view="Edit"] td.fieldValue textarea.inputElement,
body[data-module="ProjectMilestone"][data-view="Edit"] td.fieldValue .form-control,
body[data-module="ProjectTask"][data-view="Edit"] td.fieldValue input.inputElement,
body[data-module="ProjectTask"][data-view="Edit"] td.fieldValue select.inputElement,
body[data-module="ProjectTask"][data-view="Edit"] td.fieldValue textarea.inputElement,
body[data-module="ProjectTask"][data-view="Edit"] td.fieldValue .form-control {
	border: 1.5px solid #e2e8f0 !important;
	border-radius: 10px !important;
	background: #f8fafc !important;
	padding: 9px 14px !important;
	font-size: 14px !important;
	color: #1e293b !important;
	transition: border-color 0.2s, box-shadow 0.2s !important;
	min-height: 40px !important;
	box-shadow: none !important;
}

body[data-module="ProjectMilestone"][data-view="Edit"] td.fieldValue input.inputElement:focus,
body[data-module="ProjectMilestone"][data-view="Edit"] td.fieldValue select.inputElement:focus,
body[data-module="ProjectMilestone"][data-view="Edit"] td.fieldValue textarea.inputElement:focus,
body[data-module="ProjectMilestone"][data-view="Edit"] td.fieldValue .form-control:focus,
body[data-module="ProjectTask"][data-view="Edit"] td.fieldValue input.inputElement:focus,
body[data-module="ProjectTask"][data-view="Edit"] td.fieldValue select.inputElement:focus,
body[data-module="ProjectTask"][data-view="Edit"] td.fieldValue textarea.inputElement:focus,
body[data-module="ProjectTask"][data-view="Edit"] td.fieldValue .form-control:focus {
	border-color: #08a045 !important;
	box-shadow: 0 0 0 3px rgba(8, 160, 69, 0.1) !important;
	background: #fff !important;
	outline: none !important;
}

body[data-module="ProjectMilestone"][data-view="Edit"] .input-group,
body[data-module="ProjectTask"][data-view="Edit"] .input-group {
	border: 1.5px solid #e2e8f0 !important;
	border-radius: 10px !important;
	background: #f8fafc !important;
	overflow: hidden;
	transition: border-color 0.2s, box-shadow 0.2s !important;
}

body[data-module="ProjectMilestone"][data-view="Edit"] .input-group:focus-within,
body[data-module="ProjectTask"][data-view="Edit"] .input-group:focus-within {
	border-color: #08a045 !important;
	box-shadow: 0 0 0 3px rgba(8, 160, 69, 0.1) !important;
	background: #fff !important;
}

body[data-module="ProjectMilestone"][data-view="Edit"] .input-group input,
body[data-module="ProjectMilestone"][data-view="Edit"] .input-group .form-control,
body[data-module="ProjectTask"][data-view="Edit"] .input-group input,
body[data-module="ProjectTask"][data-view="Edit"] .input-group .form-control {
	border: none !important;
	box-shadow: none !important;
	background: transparent !important;
}

body[data-module="ProjectMilestone"][data-view="Edit"] .input-group .input-group-addon,
body[data-module="ProjectTask"][data-view="Edit"] .input-group .input-group-addon {
	background: transparent !important;
	border: none !important;
	color: #64748b;
}

body[data-module="ProjectMilestone"][data-view="Edit"] .btn-success,
body[data-module="ProjectTask"][data-view="Edit"] .btn-success {
	background: var(--nk-green, #08a045) !important;
	border-color: var(--nk-green, #08a045) !important;
	border-radius: 10px !important;
	padding: 9px 28px !important;
	font-weight: 600 !important;
	font-size: 14px !important;
	color: #fff !important;
	box-shadow: 0 2px 8px rgba(8, 160, 69, 0.18) !important;
	transition: background 0.2s, box-shadow 0.2s !important;
}

body[data-module="ProjectMilestone"][data-view="Edit"] .btn-success:hover,
body[data-module="ProjectTask"][data-view="Edit"] .btn-success:hover {
	background: var(--nk-green-dark, #0b6e4f) !important;
	box-shadow: 0 4px 14px rgba(8, 160, 69, 0.25) !important;
}

body[data-module="ProjectMilestone"][data-view="Edit"] .cancelLink,
body[data-module="ProjectTask"][data-view="Edit"] .cancelLink {
	color: #64748b !important;
	font-weight: 500 !important;
	font-size: 14px !important;
}

body[data-module="ProjectMilestone"][data-view="Edit"] .module-nav,
body[data-module="ProjectTask"][data-view="Edit"] .module-nav {
	display: none !important;
}

body[data-module="ProjectMilestone"][data-view="Edit"] .editViewContainer,
body[data-module="ProjectTask"][data-view="Edit"] .editViewContainer {
	max-width: 960px;
	margin: 0 auto;
}

body[data-module="ProjectMilestone"][data-view="Edit"] hr,
body[data-module="ProjectTask"][data-view="Edit"] hr {
	display: none !important;
}

/* —— Global progress: logo Nguyên Khoa (clean minimal) —— */
#messageBar:not(.hide) {
	position: fixed !important;
	inset: 0 !important;
	z-index: 100060 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	background: rgba(15, 23, 42, 0.32) !important;
	backdrop-filter: blur(10px) saturate(1.05);
	-webkit-backdrop-filter: blur(10px) saturate(1.05);
	pointer-events: all !important;
}

#messageBar .mk-nk-loader {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}

#messageBar .mk-nk-loader__panel {
	position: relative;
	width: 120px;
	height: 120px;
	padding: 0;
	border-radius: 28px;
	background: rgba(255, 255, 255, 0.96);
	box-shadow:
		0 20px 50px rgba(15, 23, 42, 0.22),
		0 0 0 1px rgba(255, 255, 255, 0.65);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0;
	animation: mk-nk-panel-in 0.35s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes mk-nk-panel-in {
	from {
		opacity: 0;
		transform: translateY(10px) scale(0.96);
	}
	to {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

#messageBar .mk-nk-loader__ring {
	position: absolute;
	inset: 10px;
	border-radius: 50%;
	border: 2.5px solid rgba(8, 160, 69, 0.12);
	border-top-color: #08a045;
	animation: mk-nk-spin 0.85s cubic-bezier(0.5, 0.15, 0.5, 0.85) infinite;
	pointer-events: none;
}

#messageBar .mk-nk-loader__ring--delay {
	display: none;
}

@keyframes mk-nk-spin {
	to {
		transform: rotate(360deg);
	}
}

#messageBar .mk-nk-loader__logo {
	position: relative;
	z-index: 1;
	width: 52px;
	height: 52px;
	object-fit: contain;
	border-radius: 14px;
	background: transparent;
	padding: 0;
	box-shadow: none;
	animation: mk-nk-breathe 2s ease-in-out infinite;
}

@keyframes mk-nk-breathe {
	0%,
	100% {
		transform: scale(1);
		opacity: 1;
	}
	50% {
		transform: scale(1.03);
		opacity: 0.92;
	}
}

#messageBar .mk-nk-loader__orbit,
#messageBar .mk-nk-loader__caption {
	display: none !important;
}

#messageBar .mk-nk-loader__msg {
	position: absolute;
	bottom: -32px;
	left: 50%;
	transform: translateX(-50%);
	margin: 0;
	white-space: nowrap;
	font-family: "Be Vietnam Pro", system-ui, sans-serif;
	font-size: 12px;
	font-weight: 500;
	color: #fff;
	text-shadow: 0 1px 8px rgba(15, 23, 42, 0.45);
	max-width: none;
	z-index: 2;
}
