:root,
html[data-op-theme="cyberpunk"] {
	--op-shell-bg: radial-gradient(circle at 100% 0%, rgba(0, 168, 255, 0.20), transparent 34%), linear-gradient(135deg, #060b18 0%, #0a1430 48%, #0f2a52 100%);
	--op-shell-bg-solid: #060b18;
	--op-shell-surface: #0a1430;
	--op-shell-surface-raised: #102044;
	--op-shell-surface-hover: #17305f;
	--op-shell-surface-active: #0d3b66;
	--op-shell-surface-active-end: #102a4c;
	--op-shell-text: #f4f8ff;
	--op-shell-text-strong: #ffffff;
	--op-shell-text-soft: #dbeafe;
	--op-shell-text-subtle: #bfd7ff;
	--op-shell-accent: #2563eb;
	--op-shell-accent-strong: #00a8ff;
	--op-shell-accent-icon: #38bdf8;
	--op-shell-accent-line: #22d3ee;
	--op-shell-border: rgba(56, 189, 248, 0.22);
	--op-shell-border-control: rgba(34, 211, 238, 0.28);
	--op-shell-border-soft: rgba(56, 189, 248, 0.16);
	--op-shell-border-icon: rgba(56, 189, 248, 0.32);
	--op-shell-border-hover: rgba(34, 211, 238, 0.42);
	--op-shell-border-focus: rgba(0, 168, 255, 0.48);
	--op-shell-border-active: rgba(37, 99, 235, 0.52);
	--op-shell-accent-muted: rgba(37, 99, 235, 0.18);
	--op-shell-accent-soft: rgba(0, 168, 255, 0.15);
	--op-shell-accent-active: rgba(34, 211, 238, 0.20);
	--op-shell-scrollbar: rgba(56, 189, 248, 0.40);
	--op-shell-scrollbar-strong: rgba(34, 211, 238, 0.52);
	--op-shell-shadow: rgba(2, 6, 23, 0.32);
	--op-shell-shadow-soft: rgba(2, 6, 23, 0.24);
	--op-shell-shadow-medium: rgba(0, 168, 255, 0.16);
	--op-shell-shadow-strong: rgba(2, 6, 23, 0.38);
	--op-shell-shadow-accent: rgba(0, 168, 255, 0.24);
	--op-shell-menu-bg: #ffffff;
	--op-action-primary-bg: linear-gradient(135deg, var(--op-shell-accent), var(--op-shell-accent-strong));
	--op-action-primary-bg-hover: linear-gradient(135deg, var(--op-shell-accent-strong), var(--op-shell-accent-line));
	--op-action-primary-text: #ffffff;
	--op-action-danger-bg: linear-gradient(135deg, #ef4444, #dc2626);
	--op-action-danger-bg-hover: linear-gradient(135deg, #f87171, #ef4444);
	--op-action-danger-text: #ffffff;
	--op-action-neutral-bg: linear-gradient(135deg, #64748b, #475569);
	--op-action-neutral-bg-hover: linear-gradient(135deg, #7a8aa0, #526174);
	--op-action-neutral-text: #ffffff;
	--op-action-warning-bg: linear-gradient(135deg, #f59e0b, #d97706);
	--op-action-warning-bg-hover: linear-gradient(135deg, #fbbf24, #f59e0b);
	--op-action-warning-text: #101827;
	--op-action-download-bg: linear-gradient(135deg, #334155, #475569);
	--op-action-download-bg-hover: linear-gradient(135deg, #475569, #64748b);
	--op-action-download-text: #ffffff;
	--op-icon-primary: var(--op-shell-accent);
	--op-icon-danger: var(--op-status-danger);
	--op-icon-neutral: var(--op-status-muted);
	--op-icon-success: var(--op-status-success);
	--op-icon-warning: var(--op-status-warning);
	--op-icon-info: var(--op-status-info);
	--op-icon-download: #475569;
	--op-icon-section: var(--op-shell-accent);
	--op-status-success: #22c55e;
	--op-status-warning: #f59e0b;
	--op-status-danger: #ef4444;
	--op-status-info: var(--op-shell-accent-strong);
	--op-status-muted: #94a3b8;
	--op-amount-in: #22c55e;
	--op-amount-out: #ef4444;
	--op-wallet-primary: #e07b39;
	--op-wallet-secondary: #f59e0b;
	--op-focus-ring: 0 0 0 3px var(--op-shell-accent-soft);
	--op-selected-border: var(--op-shell-accent-line);
	--op-selected-bg: var(--op-shell-accent-soft);
	--op-table-header-font-size: 12px;
	--op-table-body-font-size: 12px;
	--op-table-header-letter-spacing: 0;
	--op-table-font-header-weight: 650;
	--op-table-font-body-weight: 500;
	--op-table-font-emphasis-weight: 650;
	--o4-action-primary: var(--op-shell-accent);
	--o4-action-neutral: var(--op-status-muted);
	--o4-filter-label: #475569;
	--o4-status-danger: var(--op-status-danger);
	--o4-status-success: var(--op-status-success);
	--o4-table-icon: #536274;
	--o4-table-sort-muted: #9ca8b6;
}

html[data-op-theme="solid"],
html[data-op-theme="gradient"] {
	--op-shell-accent: #4fa3f7;
	--op-shell-accent-strong: #2f80ed;
	--op-shell-accent-line: #9cccf6;
	--op-shell-accent-soft: rgba(79, 163, 247, 0.16);
	--op-shell-shadow-accent: rgba(79, 163, 247, 0.24);
}

html[data-op-theme="bottom-sheet"] {
	--op-shell-accent: #1abc9c;
	--op-shell-accent-strong: #1abc9c;
	--op-shell-accent-line: #e07b39;
	--op-shell-accent-soft: rgba(26, 188, 156, 0.16);
	--op-shell-shadow-accent: rgba(26, 188, 156, 0.24);
}

html[data-op-theme="blue-purple"] {
	--op-shell-accent: #4f46e5;
	--op-shell-accent-strong: #5865f2;
	--op-shell-accent-line: #dbe4ff;
	--op-shell-accent-soft: rgba(255, 255, 255, 0.16);
	--op-shell-shadow-accent: rgba(79, 70, 229, 0.28);
}

html[data-op-theme="cyberpunk-blue"] {
	--op-shell-accent: #0b5cff;
	--op-shell-accent-strong: #00f0ff;
	--op-shell-accent-line: #00f0ff;
	--op-shell-accent-soft: rgba(0, 240, 255, 0.14);
	--op-shell-shadow-accent: rgba(11, 92, 255, 0.24);
}

html[data-op-theme="original-green"] {
	--op-shell-accent: #f6c453;
	--op-shell-accent-strong: #1abc9c;
	--op-shell-accent-line: #ffd166;
	--op-shell-accent-soft: rgba(26, 188, 156, 0.14);
	--op-shell-shadow-accent: rgba(246, 196, 83, 0.22);
}

html[data-op-theme="light"],
html[data-op-theme="light-gradient"] {
	--op-shell-accent: #2f80ed;
	--op-shell-accent-strong: #2f80ed;
	--op-shell-accent-line: #9cccf6;
	--op-shell-accent-soft: #e8f4ff;
	--op-shell-shadow-accent: rgba(47, 128, 237, 0.22);
}

#slide-out li > a > i.material-icons,
#slide-out li > a > .material-icons,
#slide-out .collapsible-header i.material-icons,
#slide-out .collapsible-body li a i.material-icons,
#slide-out .collapsible-body li a .material-icons {
	color: currentColor !important;
}

body.layout-semi-dark #main #left-sidebar-nav #slide-out.side-nav li > a > i.material-icons,
body.layout-semi-dark #main #left-sidebar-nav #slide-out.side-nav li > a > .material-icons,
body.layout-semi-dark #main #left-sidebar-nav #slide-out.side-nav .collapsible-header i.material-icons,
body.layout-semi-dark #main #left-sidebar-nav #slide-out.side-nav .collapsible-body li > a i.material-icons,
body.layout-semi-dark #main #left-sidebar-nav #slide-out.side-nav .collapsible-body li > a .material-icons {
	color: inherit !important;
}

.o4-btn-primary,
.btn.o4-btn-primary,
.btn-large.o4-btn-primary,
.btn-small.o4-btn-primary,
.btn.blue,
.btn-large.blue,
.btn-small.blue,
.btn.teal,
.btn-large.teal,
.btn-small.teal,
.btn.green,
.btn-large.green,
.btn-small.green {
	background: var(--op-action-primary-bg) !important;
	color: var(--op-action-primary-text) !important;
	border-color: transparent !important;
	box-shadow: 0 8px 18px var(--op-shell-shadow-accent);
}

.o4-btn-primary:hover,
.btn.o4-btn-primary:hover,
.btn-large.o4-btn-primary:hover,
.btn-small.o4-btn-primary:hover,
.btn.blue:hover,
.btn-large.blue:hover,
.btn-small.blue:hover,
.btn.teal:hover,
.btn-large.teal:hover,
.btn-small.teal:hover,
.btn.green:hover,
.btn-large.green:hover,
.btn-small.green:hover {
	background: var(--op-action-primary-bg-hover) !important;
	color: var(--op-action-primary-text) !important;
}

.o4-btn-danger,
.btn.o4-btn-danger,
.btn-large.o4-btn-danger,
.btn-small.o4-btn-danger,
.btn.red,
.btn-large.red,
.btn-small.red {
	background: var(--op-action-danger-bg) !important;
	color: var(--op-action-danger-text) !important;
	border-color: transparent !important;
}

.o4-btn-danger:hover,
.btn.o4-btn-danger:hover,
.btn-large.o4-btn-danger:hover,
.btn-small.o4-btn-danger:hover,
.btn.red:hover,
.btn-large.red:hover,
.btn-small.red:hover {
	background: var(--op-action-danger-bg-hover) !important;
	color: var(--op-action-danger-text) !important;
}

.o4-btn-neutral,
.btn.o4-btn-neutral,
.btn-large.o4-btn-neutral,
.btn-small.o4-btn-neutral,
.btn.grey,
.btn-large.grey,
.btn-small.grey {
	background: var(--op-action-neutral-bg) !important;
	color: var(--op-action-neutral-text) !important;
	border-color: transparent !important;
}

.o4-btn-neutral:hover,
.btn.o4-btn-neutral:hover,
.btn-large.o4-btn-neutral:hover,
.btn-small.o4-btn-neutral:hover,
.btn.grey:hover,
.btn-large.grey:hover,
.btn-small.grey:hover {
	background: var(--op-action-neutral-bg-hover) !important;
	color: var(--op-action-neutral-text) !important;
}

.o4-btn-warning,
.btn.o4-btn-warning,
.btn-large.o4-btn-warning,
.btn-small.o4-btn-warning,
.btn.orange,
.btn-large.orange,
.btn-small.orange,
.btn.deep-orange,
.btn-large.deep-orange,
.btn-small.deep-orange,
.btn.amber,
.btn-large.amber,
.btn-small.amber,
.btn.yellow,
.btn-large.yellow,
.btn-small.yellow {
	background: var(--op-action-warning-bg) !important;
	color: var(--op-action-warning-text) !important;
	border-color: transparent !important;
}

.o4-btn-warning:hover,
.btn.o4-btn-warning:hover,
.btn-large.o4-btn-warning:hover,
.btn-small.o4-btn-warning:hover,
.btn.orange:hover,
.btn-large.orange:hover,
.btn-small.orange:hover,
.btn.deep-orange:hover,
.btn-large.deep-orange:hover,
.btn-small.deep-orange:hover,
.btn.amber:hover,
.btn-large.amber:hover,
.btn-small.amber:hover,
.btn.yellow:hover,
.btn-large.yellow:hover,
.btn-small.yellow:hover {
	background: var(--op-action-warning-bg-hover) !important;
	color: var(--op-action-warning-text) !important;
}

.o4-btn-download,
.btn.o4-btn-download,
.btn-large.o4-btn-download,
.btn-small.o4-btn-download {
	background: var(--op-action-download-bg) !important;
	color: var(--op-action-download-text) !important;
	border-color: transparent !important;
	box-shadow: 0 8px 18px rgba(51, 65, 85, 0.22);
}

.o4-btn-download:hover,
.btn.o4-btn-download:hover,
.btn-large.o4-btn-download:hover,
.btn-small.o4-btn-download:hover {
	background: var(--op-action-download-bg-hover) !important;
	color: var(--op-action-download-text) !important;
}

.o4-btn-ghost,
.btn.o4-btn-ghost,
.btn-flat.o4-btn-ghost {
	background: var(--op-shell-accent-soft) !important;
	border: 1px solid var(--op-shell-border-control) !important;
	color: var(--op-shell-accent) !important;
}

.btn i,
.btn .material-icons,
.btn-large i,
.btn-large .material-icons,
.btn-small i,
.btn-small .material-icons,
.btn-flat i,
.btn-flat .material-icons,
button i,
button .material-icons {
	color: currentColor !important;
}

.btn svg,
.btn-large svg,
.btn-small svg,
.btn-flat svg,
button svg {
	color: currentColor !important;
	stroke: currentColor;
}

.swal2-container .swal2-popup,
.swal2-container .my-swal-popup,
.swal2-container .o4-logout-swal {
	width: min(440px, calc(100vw - 32px)) !important;
	padding: 28px 30px 26px !important;
	border: 1px solid var(--op-shell-border-soft, rgba(56, 189, 248, 0.16)) !important;
	border-radius: 18px !important;
	background: #ffffff !important;
	box-shadow:
		0 24px 54px rgba(15, 23, 42, 0.24),
		0 0 0 1px rgba(255, 255, 255, 0.70) inset !important;
}

.swal2-container .swal2-popup:has(.swal2-html-container .btn) {
	width: min(520px, calc(100vw - 32px)) !important;
}

.swal2-container .swal2-icon {
	margin: 0 auto 18px !important;
}

.swal2-container .swal2-title,
.swal2-container .my-swal-title {
	margin: 0 0 10px !important;
	padding: 0 !important;
	color: #172033 !important;
	font-size: 21px !important;
	font-weight: 650 !important;
	line-height: 1.28 !important;
	letter-spacing: 0 !important;
}

.swal2-container .swal2-html-container {
	margin: 0 !important;
	color: #526174 !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	line-height: 1.48 !important;
}

.swal2-container .swal2-actions {
	display: flex !important;
	flex-wrap: wrap !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 12px !important;
	margin: 24px 0 0 !important;
	width: 100% !important;
}

.swal2-container .swal2-actions .btn,
.swal2-container .swal2-actions .swal2-confirm,
.swal2-container .swal2-actions .swal2-cancel {
	align-items: center !important;
	justify-content: center !important;
	min-width: 118px !important;
	max-width: 100% !important;
	min-height: 40px !important;
	height: auto !important;
	margin: 0 !important;
	padding: 9px 18px !important;
	border-radius: 12px !important;
	font-size: 13px !important;
	font-weight: 650 !important;
	line-height: 1.2 !important;
	letter-spacing: 0 !important;
	overflow: visible !important;
	text-overflow: clip !important;
	text-transform: none !important;
	white-space: normal !important;
	box-shadow: 0 10px 20px rgba(15, 23, 42, 0.14) !important;
}

.swal2-container .swal2-actions .btn {
	display: inline-flex !important;
}

.swal2-container .swal2-html-container .btn {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex: 0 0 auto !important;
	gap: 6px !important;
	width: auto !important;
	max-width: 100% !important;
	min-width: max-content !important;
	min-height: 38px !important;
	height: auto !important;
	line-height: 1.2 !important;
	padding: 9px 14px !important;
	white-space: nowrap !important;
	overflow: visible !important;
	text-overflow: clip !important;
	vertical-align: middle !important;
}

.swal2-container .swal2-actions .o4-btn-danger,
.swal2-container .swal2-actions .swal2-confirm {
	background: var(--op-action-danger-bg, linear-gradient(135deg, #ef4444, #dc2626)) !important;
	color: var(--op-action-danger-text, #ffffff) !important;
}

.swal2-container .swal2-actions .o4-btn-neutral,
.swal2-container .swal2-actions .my-swal-cancel,
.swal2-container .swal2-actions .swal2-cancel {
	background: var(--op-action-neutral-bg, linear-gradient(135deg, #64748b, #475569)) !important;
	color: var(--op-action-neutral-text, #ffffff) !important;
}

.swal2-container .swal2-actions .btn:hover,
.swal2-container .swal2-actions .swal2-confirm:hover,
.swal2-container .swal2-actions .swal2-cancel:hover {
	transform: translateY(-1px);
	box-shadow: 0 14px 24px rgba(15, 23, 42, 0.18) !important;
}

.swal2-container .swal2-actions .btn i,
.swal2-container .swal2-html-container .btn i,
.swal2-container .swal2-actions .swal2-confirm i,
.swal2-container .swal2-actions .swal2-cancel i,
.swal2-container .swal2-actions .material-icons {
	float: none !important;
	flex: 0 0 auto !important;
	margin: 0 !important;
	color: currentColor !important;
	line-height: 1 !important;
}

.o4-status-success,
.green-text,
.text-success {
	color: var(--op-status-success) !important;
}

.o4-status-warning,
.orange-text,
.amber-text,
.yellow-text,
.text-warning {
	color: var(--op-status-warning) !important;
}

.o4-status-danger,
.red-text,
.text-danger {
	color: var(--op-status-danger) !important;
}

.o4-status-info,
.blue-text,
.cyan-text,
.text-info {
	color: var(--op-status-info) !important;
}

.deep-orange,
.deep-orange.lighten-1,
.deep-orange.lighten-2,
.deep-orange.lighten-3,
.deep-orange.lighten-4,
.deep-orange.lighten-5,
.deep-orange.darken-1,
.deep-orange.darken-2,
.deep-orange.darken-3,
.deep-orange.darken-4,
.deep-orange.accent-1,
.deep-orange.accent-2,
.deep-orange.accent-3,
.deep-orange.accent-4 {
	background-color: var(--op-shell-accent) !important;
}

.deep-orange-text,
.deep-orange-text.text-lighten-1,
.deep-orange-text.text-lighten-2,
.deep-orange-text.text-lighten-3,
.deep-orange-text.text-lighten-4,
.deep-orange-text.text-lighten-5,
.deep-orange-text.text-darken-1,
.deep-orange-text.text-darken-2,
.deep-orange-text.text-darken-3,
.deep-orange-text.text-darken-4,
.deep-orange-text.text-accent-1,
.deep-orange-text.text-accent-2,
.deep-orange-text.text-accent-3,
.deep-orange-text.text-accent-4 {
	color: var(--op-shell-accent) !important;
}

.o4-status-muted,
.grey-text,
.text-muted {
	color: var(--op-status-muted) !important;
}

.o4-icon-primary {
	color: var(--op-icon-primary) !important;
}

.o4-icon-danger {
	color: var(--op-icon-danger) !important;
}

.o4-icon-neutral {
	color: var(--op-icon-neutral) !important;
}

.o4-icon-success {
	color: var(--op-icon-success) !important;
}

.o4-icon-warning {
	color: var(--op-icon-warning) !important;
}

.o4-icon-info {
	color: var(--op-icon-info) !important;
}

.o4-icon-download {
	color: var(--op-icon-download) !important;
}

.o4-icon-section,
.agent-section-title .material-icons {
	color: var(--op-icon-section) !important;
}

.o4-amount-in {
	color: var(--op-amount-in) !important;
}

.o4-amount-out {
	color: var(--op-amount-out) !important;
}

.o4-wallet-primary {
	color: var(--op-wallet-primary) !important;
}

.agent-section-card.card-panel {
	width: 100%;
	max-width: 100%;
	margin: 0;
	padding: 12px;
	box-sizing: border-box;
	background: #fff;
	border: 1px solid #edf0f5;
	border-radius: 14px;
	box-shadow: 0 12px 28px rgba(15, 23, 42, .08);
}

.agent-section-card .header2 {
	margin: 0;
	color: #1f2937;
	font-size: 18px;
	font-weight: 800;
	line-height: 1.2;
}

.agent-section-card > .divider,
.agent-section-card .agent-section-divider {
	margin: 10px 0;
	background: #eef0f4;
}

.agent-section-card > br,
.agent-section-card .clear + br {
	display: none;
}

.agent-section-card .agent-section-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: 0 0 10px;
}

.agent-section-card .agent-payment-header {
	gap: 12px;
	margin: 0;
}

.agent-payment-page .tutorial-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--op-shell-accent) !important;
	font-size: 12px;
	font-weight: 800;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.agent-payment-page .tutorial-link .header2 {
	color: var(--op-shell-accent) !important;
	font-size: 12px;
	line-height: 1;
}

.agent-payment-page .tutorial-icon {
	width: 22px;
	height: 22px;
	margin: 0;
}

.agent-section-card .filterBox {
	width: 100%;
	margin: 0 0 10px;
	padding: 8px 10px;
	box-sizing: border-box;
	background: #fafbfc;
	border: 1px solid #edf0f5;
	border-radius: 12px;
}

.agent-section-card .filterBox .row,
.agent-section-card .filterBox .margin,
.agent-section-card .filterBox .padding-5px,
.agent-section-card .row.margin.padding-5px {
	margin: 0 !important;
	padding: 0 !important;
}

.agent-section-card .filterBox .col {
	float: none !important;
	width: auto !important;
	padding: 0 !important;
}

.agent-section-card .o4-compact-filter {
	margin: 0 0 10px;
	padding: 10px 12px;
}

.agent-section-card .o4-filter-grid {
	display: flex;
	flex-wrap: wrap;
	align-items: end;
	gap: 10px 12px;
	width: 100%;
}

.agent-section-card .o4-filter-field {
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
	margin: 0;
	color: #111827;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0;
	line-height: 1.2;
	text-transform: none;
	flex: 1 1 180px;
}

.agent-section-card .o4-filter-field > span {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.agent-section-card .o4-filter-field input,
.agent-section-card .o4-filter-field select,
.agent-section-card .o4-filter-field .input-group,
.agent-section-card .o4-filter-actions .btn {
	width: 100%;
	margin: 0;
}

.agent-section-card .o4-keyword-control {
	display: grid;
	grid-template-columns: minmax(96px, 132px) minmax(130px, 1fr);
	gap: 8px;
	align-items: center;
}

.agent-section-card .o4-filter-field-keyword {
	flex-basis: 310px;
}

.agent-section-card .o4-filter-field-date {
	flex: 0 1 290px;
	max-width: 300px;
}

.agent-section-card .o4-filter-field .input-group {
	display: flex;
}

.agent-section-card .o4-filter-field .input-group input {
	border-radius: 8px 0 0 8px;
}

#content .agent-section-card .o4-filter-field-date .input-group input {
	flex: 1 1 auto;
	width: auto !important;
	min-width: 0;
	max-width: none;
	font-size: 11px !important;
	font-weight: 600 !important;
	letter-spacing: 0;
}

.agent-section-card .o4-filter-field .input-group-addon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 32px;
	padding: 0;
	border-radius: 0 8px 8px 0;
}

.agent-section-card .o4-filter-actions {
	display: flex;
	align-items: end;
	flex: 0 0 auto;
	flex-wrap: wrap;
	gap: 8px;
	min-width: 0;
}

.agent-section-card .o4-filter-actions .btn {
	width: auto;
	min-width: 82px;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) {
	width: 100%;
	margin: 0 0 10px;
	padding: 8px 12px;
	box-sizing: border-box;
	background: #fafbfc;
	border: 1px solid #edf0f5;
	border-radius: 12px;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .row,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .margin,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .padding-5px,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .flexrow {
	margin: 0 !important;
	padding: 0 !important;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .col {
	float: none !important;
	flex: 1 1 100%;
	width: 100% !important;
	max-width: 100%;
	min-width: 0;
	margin: 0 !important;
	padding: 0 !important;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .newMaterialTable,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .newMaterialTable tbody {
	display: block;
	width: 100% !important;
	max-width: 100%;
	min-width: 0;
	background: transparent;
	border: 0;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-grid {
	display: flex;
	flex-wrap: wrap;
	align-items: end;
	gap: 5px 12px;
	width: 100%;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .newMaterialTable tr,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-row {
	display: flex;
	flex-wrap: wrap;
	align-items: end;
	gap: 5px 12px;
	width: 100%;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .newMaterialTable td {
	width: auto;
	min-height: 0;
	padding: 0 !important;
	background: transparent;
	border: 0;
	line-height: 1.2;
	white-space: normal;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-cell,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-filter-field {
	display: flex;
	flex: 0 1 180px;
	flex-direction: column;
	align-items: stretch;
	gap: 3px;
	min-width: 170px;
	max-width: 230px;
	margin: 0;
	padding: 0 !important;
	background: transparent;
	border: 0;
	color: #111827;
	font-size: 11px;
	font-weight: 650;
	letter-spacing: 0;
	line-height: 1.2;
	text-align: left !important;
	text-transform: none;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-cell-paired {
	flex-basis: 300px;
	min-width: 280px;
	max-width: 360px;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-label,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-filter-field > span {
	display: block;
	overflow: hidden;
	color: #111827;
	font-size: 11px;
	font-weight: 650;
	line-height: 1.2;
	text-align: left !important;
	text-overflow: ellipsis;
	text-transform: none;
	white-space: nowrap;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-label-placeholder {
	visibility: hidden;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-control,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .input-field.inline {
	display: flex;
	align-items: center;
	width: 100%;
	min-width: 0;
	height: 32px;
	margin: 0 !important;
	line-height: 32px;
	text-align: left !important;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-cell > .input-field,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-control > .input-field,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-control > div {
	display: flex !important;
	align-items: center;
	flex: 1 1 auto;
	width: 100%;
	min-width: 0;
	height: 32px;
	margin: 0 !important;
	padding: 0 !important;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-cell-paired .o4-standard-filter-control {
	gap: 8px;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .select2-container {
	width: 100% !important;
	min-width: 0 !important;
	height: 32px;
	margin: 0 !important;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .select2-container .select2-selection {
	display: flex;
	align-items: center;
	width: 100%;
	height: 32px;
	min-height: 32px;
	border: 1px solid #d7dce5 !important;
	border-radius: 8px;
	background: #fff;
	box-shadow: none !important;
	outline: 0 !important;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .select2-container--default.select2-container--focus .select2-selection,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .select2-container--default.select2-container--open .select2-selection {
	border-color: var(--op-action-primary_bg, #1687f8) !important;
	box-shadow: 0 0 0 2px rgba(22, 135, 248, .12) !important;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) select.select2-hidden-accessible {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	min-width: 1px !important;
	min-height: 1px !important;
	margin: -1px !important;
	padding: 0 !important;
	border: 0 !important;
	overflow: hidden !important;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .select2-container .select2-selection__rendered {
	height: 30px;
	margin: 0;
	padding-left: 10px;
	color: #111827;
	font-size: 12px;
	font-weight: 500;
	line-height: 30px;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .select2-container--default .select2-selection--multiple {
	padding: 0;
	cursor: pointer;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .select2-container--default .select2-selection--multiple .select2-selection__rendered {
	display: flex;
	align-items: center;
	gap: 4px;
	width: 100%;
	overflow: hidden;
	min-height: 30px;
	padding: 2px 8px;
	box-sizing: border-box;
	border: 0;
	line-height: 1;
	flex-wrap: nowrap;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .select2-container--default .select2-selection--multiple .select2-selection__placeholder {
	color: #98a6ba;
	font-size: 12px;
	font-weight: 500;
	line-height: 1;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .select2-container--default .select2-selection--multiple .select2-selection__choice {
	display: inline-flex;
	align-items: center;
	flex: 0 1 auto;
	max-width: 78px;
	overflow: hidden;
	min-height: 22px;
	margin: 0;
	padding: 0 8px 0 6px;
	border: 0;
	border-radius: 999px;
	background: #edf6ff;
	color: #0b4f9d;
	font-size: 11px;
	font-weight: 650;
	line-height: 22px;
	text-overflow: ellipsis;
	white-space: nowrap;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
	flex: 0 0 auto;
	margin-right: 5px;
	color: #0b65d8;
	font-weight: 800;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .select2-container--default .select2-selection--multiple .select2-selection__choice__display,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .select2-container--default .select2-selection--multiple .select2-selection__choice span:not(.select2-selection__choice__remove),
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .select2-container--default .select2-selection--multiple .o4-select2-choice-label {
	display: inline-block;
	flex: 1 1 auto;
	overflow: hidden;
	min-width: 0;
	text-overflow: ellipsis;
	white-space: nowrap;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .select2-container--default .select2-selection--multiple .select2-selection__choice .material-icons:not(.o4-select2-choice-symbol) {
	display: none !important;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .select2-container--default .select2-selection--multiple .select2-selection__choice .o4-select2-choice-symbol {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	flex: 0 0 13px;
	width: 13px;
	height: 13px;
	margin: 0 4px 0 0;
	font-size: 13px;
	line-height: 1;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .select2-container--default .select2-selection--multiple .select2-selection__choice.o4-select2-choice-hidden {
	display: none !important;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .select2-container--default .select2-selection--multiple.o4-select2-has-values .select2-selection__choice:not(.o4-select2-choice-hidden) {
	flex: 1 1 0;
	max-width: none;
	min-width: 0;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .select2-container--default .select2-selection--multiple.o4-select2-single-value .select2-selection__choice:not(.o4-select2-choice-hidden) {
	flex: 0 1 auto;
	max-width: calc(100% - 4px);
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .select2-container--default .select2-selection--multiple .o4-select2-more-choice {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	min-width: 28px;
	height: 22px;
	margin: 0;
	padding: 0 8px;
	border: 1px solid rgba(15, 95, 194, .14);
	border-radius: 999px;
	background: #fff;
	color: #0f5fc2;
	font-size: 11px;
	font-weight: 700;
	line-height: 22px;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .select2-container--default .select2-selection--multiple .select2-search--inline,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .select2-container--default .select2-selection--multiple .select2-search__field {
	flex: 1 1 auto;
	min-width: 0;
	height: 24px !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	line-height: 24px !important;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .select2-container--default .select2-selection--multiple.o4-select2-has-values .select2-search--inline {
	flex: 0 0 2px;
	width: 2px;
	overflow: hidden;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .select2-container--default .select2-selection--multiple.o4-select2-has-values .select2-search__field {
	width: 2px !important;
	min-width: 2px !important;
	color: transparent !important;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-cell-paired .o4-standard-filter-control > select,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-cell-paired .o4-standard-filter-control > input,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-cell-paired .o4-standard-filter-control > textarea,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-cell-paired .o4-standard-filter-control > div,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-cell-paired .o4-standard-filter-control > .input-field {
	flex: 1 1 0;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-cell-paired .o4-standard-filter-control > select:first-child:not(.select2-hidden-accessible),
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-cell-paired .o4-standard-filter-control > .select2-container,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-cell-paired .o4-standard-filter-control > div:first-child {
	flex: 0 0 118px;
	width: 118px !important;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-cell input,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-cell select,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-filter-field input,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-filter-field select,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) input.form-control,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) input.browser-default,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) select.browser-default {
	width: 100% !important;
	min-width: 0;
	height: 32px !important;
	min-height: 32px !important;
	margin: 0 !important;
	padding: 5px 10px;
	box-sizing: border-box;
	border: 1px solid #d7dce5;
	border-radius: 8px;
	background: #fff;
	color: #111827;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0;
	box-shadow: none;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-cell-paired .o4-standard-filter-control > select,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-cell-paired .o4-standard-filter-control > input,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-cell-paired .o4-standard-filter-control > textarea,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-cell-paired .o4-standard-filter-control > div,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-cell-paired .o4-standard-filter-control > .input-field {
	flex: 1 1 0;
	width: auto !important;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-cell-date {
	flex: 0 1 290px;
	min-width: 250px;
	max-width: 320px;
}

#content .filterBox.o4-standard-filter.o4-member-filter:not(.o4-compact-filter) .o4-standard-filter-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	align-items: end;
	gap: 5px 12px;
}

#content .filterBox.o4-standard-filter.o4-member-filter:not(.o4-compact-filter) .o4-standard-filter-cell {
	width: 100%;
	min-width: 0;
	max-width: none;
}

#content .filterBox.o4-standard-filter.o4-member-filter:not(.o4-compact-filter) .o4-standard-filter-cell-date,
#content .filterBox.o4-standard-filter.o4-member-filter:not(.o4-compact-filter) .o4-standard-filter-cell-paired {
	grid-column: span 2;
	min-width: 0;
	max-width: none;
}

#content .filterBox.o4-standard-filter.o4-member-filter:not(.o4-compact-filter) .o4-standard-filter-actions {
	align-self: end;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .input-group {
	display: flex;
	width: 100%;
	min-width: 0;
	margin: 0;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .input-group input {
	flex: 1 1 auto;
	min-width: 0;
	border-radius: 8px 0 0 8px;
	font-size: 11px !important;
	font-weight: 500 !important;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .input-group-addon,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .dateIcon {
	display: inline-flex;
	flex: 0 0 32px;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	margin: 0;
	padding: 0;
	border-radius: 0 8px 8px 0;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-actions,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-filter-actions {
	display: flex;
	flex: 0 0 auto;
	flex-wrap: wrap;
	align-items: end;
	align-self: end;
	gap: 8px;
	min-width: 0;
	margin: 0;
	padding: 0 !important;
	background: transparent;
	border: 0;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .btn,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) button.btn,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) a.btn {
	width: auto;
	min-width: 82px;
	height: 32px;
	margin: 0;
	padding: 0 13px;
	border-radius: 8px;
	font-size: 11px;
	font-weight: 800;
	line-height: 32px;
	letter-spacing: 0;
	box-shadow: none !important;
}

#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .btn i,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) button.btn i,
#content .filterBox.o4-standard-filter:not(.o4-compact-filter) a.btn i {
	height: 32px;
	margin-left: 6px;
	color: currentColor !important;
	font-size: 16px;
	line-height: 32px;
}

@media (max-width: 720px) {
	#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-grid,
	#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .newMaterialTable tr,
	#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-row {
		display: grid;
		grid-template-columns: minmax(0, 1fr);
	}

	#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-cell,
	#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-filter-field,
	#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-cell-date {
		max-width: none;
	}

	#content .filterBox.o4-standard-filter.o4-member-filter:not(.o4-compact-filter) .o4-standard-filter-cell-date,
	#content .filterBox.o4-standard-filter.o4-member-filter:not(.o4-compact-filter) .o4-standard-filter-cell-paired {
		grid-column: auto;
	}

	#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-standard-filter-actions,
	#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .o4-filter-actions {
		align-items: stretch;
	}

	#content .filterBox.o4-standard-filter:not(.o4-compact-filter) .btn {
		width: 100%;
	}
}

@media (max-width: 620px) {
	.agent-section-card .o4-filter-grid {
		display: grid;
		grid-template-columns: minmax(0, 1fr);
	}

	.agent-section-card .o4-keyword-control,
	.agent-section-card .o4-filter-actions {
		grid-template-columns: minmax(0, 1fr);
		flex-direction: column;
		align-items: stretch;
	}

	.agent-section-card .o4-filter-field-date {
		max-width: none;
	}

	.agent-section-card .o4-filter-actions .btn {
		width: 100%;
	}
}

.agent-section-card .filterBox .newMaterialTable,
.agent-section-card .filterBox .newMaterialTable tbody {
	display: block;
	width: 100%;
	background: transparent;
	border: 0;
}

.agent-section-card .filterBox .newMaterialTable tr {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 10px;
	width: 100%;
}

.agent-section-card .filterBox .newMaterialTable td {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: 32px;
	width: auto;
	padding: 0 !important;
	background: transparent;
	border: 0;
	color: #111827;
	font-size: 12px;
	font-weight: 800;
	line-height: 32px;
	white-space: nowrap;
}

.agent-section-card .filterBox .input-field.inline {
	display: inline-flex;
	align-items: center;
	height: 32px;
	margin: 0 !important;
	line-height: 32px;
}

.agent-section-card .filterBox .input-field.inline input {
	margin: 0 !important;
}

.agent-section-card .filterBox input.form-control,
.agent-section-card .filterBox input.browser-default,
.agent-section-card .filterBox select.browser-default {
	height: 32px !important;
	min-height: 32px !important;
	margin: 0 !important;
	padding: 5px 10px;
	box-sizing: border-box;
	border: 1px solid #d7dce5;
	border-radius: 8px;
	background: #fff;
	color: #111827;
	font-size: 12px;
	font-weight: 700;
	box-shadow: none;
}

.agent-section-card .filterBox .btn,
.agent-section-card .agent-section-toolbar .btn,
.agent-section-card .transactiontable .btn,
.agent-section-card .btn-small {
	height: 26px;
	margin: 0;
	padding: 0 9px;
	border-radius: 7px;
	font-size: 10px;
	font-weight: 800;
	line-height: 26px;
	letter-spacing: 0;
	box-shadow: 0 8px 18px var(--op-shell-shadow-accent);
}

.agent-section-card .filterBox .btn {
	height: 32px;
	padding: 0 13px;
	border-radius: 8px;
	font-size: 11px;
	line-height: 32px;
	box-shadow: none !important;
}

.agent-section-card .agent-section-toolbar .btn {
	height: 32px;
	padding: 0 13px;
	border-radius: 8px;
	font-size: 11px;
	line-height: 32px;
	box-shadow: none !important;
}

.agent-section-card .filterBox .btn i,
.agent-section-card .agent-section-toolbar .btn i,
.agent-section-card .transactiontable .btn i {
	height: 26px;
	line-height: 26px;
	font-size: 14px;
}

.agent-section-card .filterBox .btn i {
	height: 32px;
	margin-left: 6px;
	line-height: 32px;
	font-size: 16px;
}

.agent-list-page .filterBox .newMaterialTable tr {
	display: grid;
	grid-template-columns: minmax(150px, 180px) minmax(210px, 240px) auto;
	align-items: end;
	gap: 8px 12px;
	width: auto;
}

.agent-list-page .filterBox .newMaterialTable td {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	align-items: end;
	gap: 5px;
	min-height: 0;
	line-height: 1.2;
}

.agent-list-page .filterBox .newMaterialTable td .input-field.inline {
	display: block;
	height: auto;
	min-height: 0;
	line-height: 1.2;
}

.agent-list-page .filterBox .newMaterialTable td .input-field.inline:first-child {
	color: #475569;
	font-size: 11px;
	font-weight: 800;
	text-transform: uppercase;
}

.agent-list-page .filterBox .newMaterialTable td .input-field.inline + .input-field.inline {
	height: 32px;
	line-height: 32px;
}

.agent-list-page .filterBox input.form-control,
.agent-list-page .filterBox input.browser-default,
.agent-list-page .filterBox select.browser-default {
	width: 100% !important;
	min-width: 0;
}

.agent-list-page .filterBox .btn {
	min-width: 74px;
}

.agent-section-card .agent-section-toolbar .btn i {
	height: 32px;
	margin-left: 6px;
	line-height: 32px;
	font-size: 16px;
}

.agent-section-card .transactiontable .btnAgentFastIn,
.agent-section-card .transactiontable .btnAgentFastOut {
	height: 32px;
	min-width: 42px;
	padding: 0 12px;
	border-radius: 8px;
	font-size: 12px;
	line-height: 32px;
}

.agent-section-card .transactiontable {
	width: 100%;
	margin-top: 10px;
	overflow-x: auto;
	box-sizing: border-box;
	background: #fff;
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	box-shadow: none;
}

.agent-section-card .transactiontable .btn.left {
	float: none !important;
}

.agent-section-card .transactiontable table {
	width: 100%;
	margin: 0;
	border-collapse: separate;
	border-spacing: 0;
	color: #111827;
}

.agent-section-card .transactiontable thead th {
	padding: 7px 9px;
	background: #f8fafc;
	border-bottom: 1px solid #e5e7eb;
	color: #475569;
	font-size: var(--op-table-header-font-size, 12px);
	font-weight: var(--op-table-font-header-weight, 650);
	letter-spacing: var(--op-table-header-letter-spacing, 0);
	line-height: 1.2;
	white-space: nowrap;
}

.agent-section-card .transactiontable thead th a {
	color: inherit;
	font-weight: var(--op-table-font-header-weight, 650);
}

.agent-section-card .transactiontable tbody td {
	padding: 6px 9px;
	border-bottom: 1px solid #eef0f4;
	color: #1f2937;
	font-size: var(--op-table-body-font-size, 12px);
	font-weight: var(--op-table-font-body-weight, 500);
	line-height: 1.2;
	vertical-align: middle;
	white-space: nowrap;
}

.agent-section-card .transactiontable tfoot th {
	padding: 6px 9px;
	border-bottom: 1px solid #eef0f4;
	color: #1f2937;
	font-size: var(--op-table-body-font-size, 12px);
	font-weight: var(--op-table-font-emphasis-weight, 650);
	line-height: 1.2;
	vertical-align: middle;
	white-space: nowrap;
}

.agent-section-card .transactiontable tbody td p {
	margin: 0;
}

.agent-section-card .transactiontable tbody tr[style*="font-weight: bold"] td,
.agent-section-card .transactiontable tbody tr[style*="font-weight:bold"] td {
	font-weight: var(--op-table-font-emphasis-weight, 650);
}

.agent-section-card .transactiontable input.txtAdjust,
.agent-section-card .transactiontable input.txtAgentAdjust {
	height: 28px !important;
	min-height: 28px !important;
	margin: 0 2px !important;
	padding: 3px 7px !important;
	box-sizing: border-box;
	border-radius: 6px;
	font-size: 11px;
	line-height: 28px;
}

.agent-section-card .transactiontable tbody tr:hover {
	background: var(--op-shell-accent-soft, #e8f4ff);
}

.agent-section-card .table-extrafooter {
	margin: 10px 0 0;
	padding: 8px 0 0;
	border-top: 1px solid #eef0f4;
}

.agent-section-card .table-extrafooter .newMaterialTable,
.agent-section-card .table-extrafooter .newMaterialTable tbody {
	background: transparent;
	border: 0;
}

.agent-section-card .table-extrafooter .newMaterialTable td {
	padding: 0 6px !important;
	border: 0;
	font-size: 12px;
	font-weight: 700;
	vertical-align: middle;
}

.agent-section-card .pagination li.active {
	background: var(--op-action-primary-bg) !important;
}

.agent-section-card .pagination li.active a {
	color: var(--op-action-primary-text) !important;
}

.agent-section-card .actionIcon a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	margin: 0 2px;
	border-radius: 7px;
	background: var(--op-shell-accent-soft);
}

.agent-section-card .actionIcon a i {
	font-size: 16px;
	line-height: 24px;
}

.agent-section-card .actionIcon a:hover {
	background: rgba(47, 128, 237, .16);
}

#content .card-panel:not(.agent-section-card),
#content .container > .card-panel:not(.agent-section-card) {
	border: 1px solid #edf0f5;
	border-radius: 14px;
	box-shadow: 0 12px 28px rgba(15, 23, 42, .07);
}

#content .filterBox {
	box-sizing: border-box;
	margin: 0 0 12px;
	padding: 9px 10px;
	background: #fafbfc;
	border: 1px solid #edf0f5;
	border-radius: 12px;
}

#content .filterBox table.newMaterialTable {
	width: 100%;
	margin: 0;
	background: transparent;
	border: 0;
}

#content .filterBox table.newMaterialTable td {
	padding: 0 8px 8px 0;
	border: 0;
	vertical-align: bottom;
}

#content .filterBox .input-field {
	margin-top: 0;
	margin-bottom: 0;
}

#content .filterBox input,
#content .filterBox select.browser-default {
	height: 32px;
	min-height: 32px;
	box-sizing: border-box;
	font-size: 12px;
	font-weight: 700;
}

#content .filterBox .btn,
#content .filterBox .btn-small,
#content .filterBox .btn-large {
	height: 32px;
	min-width: 74px;
	padding: 0 13px;
	border-radius: 8px;
	font-size: 11px;
	font-weight: 800;
	line-height: 32px;
	letter-spacing: 0;
	box-shadow: none !important;
}

#content .filterBox .btn i,
#content .filterBox .btn-small i,
#content .filterBox .btn-large i {
	height: 32px;
	margin-left: 6px;
	line-height: 32px;
	font-size: 16px;
}

#content .transactiontable {
	box-sizing: border-box;
	width: 100%;
	overflow-x: auto;
	background: #fff;
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	box-shadow: none;
}

#content .transactiontable table {
	margin: 0;
	border-collapse: separate;
	border-spacing: 0;
}

#content .transactiontable th {
	padding: 7px 9px;
	background: #f8fafc;
	border-bottom: 1px solid #e5e7eb;
	color: #475569;
	font-size: var(--op-table-header-font-size, 12px);
	font-weight: var(--op-table-font-header-weight, 650);
	letter-spacing: var(--op-table-header-letter-spacing, 0);
	line-height: 1.2;
	white-space: nowrap;
}

#content .transactiontable td {
	padding: 6px 9px;
	border-bottom: 1px solid #eef0f4;
	font-size: var(--op-table-body-font-size, 12px);
	font-weight: var(--op-table-font-body-weight, 500);
	line-height: 1.2;
	vertical-align: middle;
	white-space: nowrap;
}

#content .transactiontable tbody tr:hover {
	background: var(--op-shell-accent-soft, #e8f4ff);
}

#content .transactiontable tbody tr[style*="font-weight: bold"] td,
#content .transactiontable tbody tr[style*="font-weight:bold"] td {
	font-weight: var(--op-table-font-emphasis-weight, 650);
}

#content .o4-compact-table th {
	padding: 7px 9px;
	background: #f8fafc;
	color: #475569;
	font-size: var(--op-table-header-font-size, 12px);
	font-weight: var(--op-table-font-header-weight, 650);
	letter-spacing: var(--op-table-header-letter-spacing, 0);
	line-height: 1.2;
	white-space: nowrap;
}

#content .o4-compact-table td {
	padding: 6px 9px;
	font-size: var(--op-table-body-font-size, 12px);
	font-weight: var(--op-table-font-body-weight, 500);
	line-height: 1.2;
	vertical-align: middle;
	white-space: nowrap;
}

#content .transactiontable .btn,
#content .transactiontable .btn-small,
#content .transactiontable .btn-large {
	letter-spacing: 0;
	box-shadow: none !important;
}

#content .transactiontable .btnAgentFastIn,
#content .transactiontable .btnAgentFastOut {
	height: 32px;
	min-width: 42px;
	padding: 0 12px;
	border-radius: 8px;
	font-size: 12px;
	line-height: 32px;
}

#content .actionIcon a:not(.o4-table-icon),
#content td a.tooltipped:not(.o4-table-icon),
#content td a.btnDelete,
#content td a.btnReject,
#content td a.btnKickSession {
	color: var(--op-icon-primary) !important;
}

#content .actionIcon a:not(.o4-table-icon) i,
#content .actionIcon a:not(.o4-table-icon) .material-icons,
#content td a.tooltipped:not(.o4-table-icon) i,
#content td a.tooltipped:not(.o4-table-icon) .material-icons,
#content td a.btnDelete i,
#content td a.btnDelete .material-icons,
#content td a.btnReject i,
#content td a.btnReject .material-icons,
#content td a.btnKickSession i,
#content td a.btnKickSession .material-icons {
	color: currentColor !important;
}

#content td a:not(.o4-table-icon) > i.material-icons,
#content td a:not(.o4-table-icon) > .material-icons,
#content td a:not(.o4-table-icon) > i.fa,
#content td a:not(.o4-table-icon) > .fa {
	color: var(--op-icon-primary) !important;
}

#content td a:not(.o4-table-icon):hover > i.material-icons,
#content td a:not(.o4-table-icon):hover > .material-icons,
#content td a:not(.o4-table-icon):hover > i.fa,
#content td a:not(.o4-table-icon):hover > .fa {
	color: var(--op-shell-accent-strong, var(--op-icon-primary)) !important;
}

#content td a.btn.o4-btn-primary,
#content td a.btn-small.o4-btn-primary,
#content td a.btn-large.o4-btn-primary,
#content td a.btnAgentFastIn {
	color: var(--op-action-primary-text) !important;
}

#content td a.btn.o4-btn-danger,
#content td a.btn-small.o4-btn-danger,
#content td a.btn-large.o4-btn-danger,
#content td a.btnAgentFastOut {
	color: var(--op-action-danger-text) !important;
}

#content td a.btn.o4-btn-primary i,
#content td a.btn-small.o4-btn-primary i,
#content td a.btn-large.o4-btn-primary i,
#content td a.btnAgentFastIn i,
#content td a.btn.o4-btn-danger i,
#content td a.btn-small.o4-btn-danger i,
#content td a.btn-large.o4-btn-danger i,
#content td a.btnAgentFastOut i {
	color: currentColor !important;
}

#content .actionIcon a:not(.o4-table-icon):hover,
#content td a.tooltipped:not(.o4-table-icon):hover,
#content td a.btnDelete:hover,
#content td a.btnReject:hover,
#content td a.btnKickSession:hover {
	color: var(--op-shell-accent-strong, var(--op-icon-primary)) !important;
}