/** Sidebar **/

:root {
	--app-sidebar-profile-color: #FFFFFF;
}

.app-header .navbar-brand {
	padding: 5px 5px 1px 20px;
}

.app-header .navbar-brand b {
	padding-left: 10px;
}


.app-sidebar-content {
	padding-top: 36px;
}

@media (max-width: 767.98px) {
	.app-header .navbar-brand {
		padding: 5px 1px 1px 5px;
	}

	.app-sidebar-content {
		padding-top: 20px;
	}

	/* One row: logo, top buttons, toggler */
	.app-header {
		display: flex;
		align-items: center;
	}

	.app-header .navbar-header {
		display: contents;
	}

	.app-header .navbar-brand {
		order: 1;
		flex-shrink: 0;
	}

	.app-header .navbar-nav {
		order: 2;
		flex: 1;
		min-width: 0;
		border-top: 0;
		padding: 0 4px;
		justify-content: flex-end;
	}

	.app-header .navbar-mobile-toggler {
		order: 3;
		flex-shrink: 0;
	}
}

/** Buttons **/
div > span.btn {
	cursor: default;
}

td > span.btn {
	cursor: default;
}

span > span.btn {
	cursor: default;
}

span.btn.disabled {
	opacity: 0.3;
}

/** Print **/

@media print {

	.app-header {
		display: none !important;
	}

	.app-sidebar {
		display: none !important;
	}

	.app-sidebar-bg {
		display: none !important;
	}

	.app-content {
		margin-top: 0 !important;
		margin-left: 0 !important;
		padding: 0 0 !important;
	}

	.breadcrumb {
		display: none !important;
	}

	.row {
		padding: 0 0 !important;
		margin: 0 0 !important;
	}

	.col {
		padding: 0 0 !important;
		margin: 0 0 !important;
	}

	.col-md-12 {
		padding: 0 0 !important;
		margin: 0 0 !important;
	}

	.form-control {
		padding: 2px 2px !important;
		margin: 0 0 !important;
		min-height: 15px !important;
	}
}


/** Search **/
@media only screen and (min-width: 768px) {

	.frq-datatable-search > div {
		margin-bottom: 10px;
	}

	.frq-datatable-search > .col-12.isText {
		min-width: 125px;
		width: auto;
	}

	.frq-datatable-search > .col-12.isDate {
		width: 125px;
	}

	.frq-datatable-search > .col-12.isSelect {
		min-width: 125px;
		width: auto;
	}

	.frq-datatable-search > .col-12.isSearchSelect {
		min-width: 125px;
		width: auto;
	}

	.frq-datatable-search > .col-12.isSearchSelect .select2-selection--single {
		height: calc(1.0em + .875rem + 4px) !important;
	}

	.frq-datatable-search > .col-12.isMultiselect {
		min-width: 125px;
		width: auto;
	}
}

/** Sorting **/

.frq-datatable-hassorting {
	cursor: pointer;
}

.frq-datatable-hassorting.active i {
	color: orangered;
}

/** Datatable **/

.frq-datatable-col-rownumber {
	white-space: nowrap !important;
}

.frq-datatable-col-sortable {
	width: 75px;
}

.frq-datatable-sortableInput {
	width: 40px;
	text-align: center;
	padding: 0.1rem 0.2rem;
	color: var(--app-component-color);
	background-color: var(--app-component-bg);
	background-clip: padding-box;
	border: 1px solid var(--app-component-border-color);
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border-radius: 4px;
	transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.frq-datatable-inline-input {
	width: 50px;
	text-align: center;
	padding: 0.1rem 0.2rem;
	color: var(--app-component-color);
	background-color: var(--app-component-bg);
	background-clip: padding-box;
	border: 1px solid var(--app-component-border-color);
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border-radius: 4px;
	transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.frq-datatable-inline-input:disabled {
	background-color: transparent;
}

.frq-datatable-inline-select {
	min-width: 50px;
	text-align: center;
	padding: 0.1rem 0.2rem;
	color: var(--app-component-color);
	background-color: var(--app-component-bg);
	background-clip: padding-box;
	border: 1px solid var(--app-component-border-color);
	-webkit-appearance: none;
	-moz-appearance: none;
	border-radius: 4px;
	transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

@media (min-width: 1100px) {

	.frq-datatable-col-rownumber {
		width: 50px;
	}

	.frq-datatable-col-id {
		width: 100px;
	}

	.frq-datatable-col-status {
		width: 125px;
	}

	.frq-datatable-col-dateonly {
		width: 130px;
	}

	.frq-datatable-col-datetime {
		width: 160px;
	}

	.frq-datatable-actions-1 {
		width: 50px;
	}

	.frq-datatable-actions-2 {
		width: 80px;
	}

	.frq-datatable-actions-3 {
		width: 100px;
	}

	.frq-datatable-actions-4 {
		width: 120px;
		background-color: red;
	}
}

/** data detail **/
span.form-control {
	min-height: 35px;
	height: auto;
	font-weight: normal;
	background-color: transparent;
}

.frq-topblock-select {
	width: auto!important;
	float:left!important;
	margin-right: 5px;
	padding: 0.3rem 2.0rem 0.3rem 0.5rem;
}

/** navbutton **/
.frq-navbutton-PrevNext-passive {
	color: gray!important;
	border-color: #ced4da;
	cursor: not-allowed !important;
}


.select2-container--default .select2-results__option[aria-disabled=true] {
    display: none!important;
}

/** Theme **/

:root {
	--gw-font: var(--bs-body-font-family);
	--gw-mono: var(--bs-font-monospace);
	--gw-radius: 4px;
}

/** Theme **/

body, .app, .form-control, .form-select, .btn, .dropdown-menu, .modal, .table, .select2-container {
	font-family: var(--gw-font) !important;
}

.app-content {
	padding: 16px 22px;
}

.mono, .gw-mono {
	font-family: var(--gw-mono) !important;
}

a {
	text-decoration: none;
}

/** Page header **/

.app-content > .breadcrumb.float-xl-start {
	font-size: 13px;
	font-weight: 500;
	margin-bottom: 0;
	padding-top: 3px;
}

.app-content > .breadcrumb.float-xl-start .breadcrumb-item:last-child a {
	color: var(--gw-text);
	font-weight: 700;
}

.app-content > .breadcrumb.float-xl-end {
	gap: 6px;
	margin-bottom: 0;
}

.app-content > .breadcrumb.float-xl-end .breadcrumb-item + .breadcrumb-item::before {
	display: none;
}

.app-content > .breadcrumb.float-xl-end .breadcrumb-item {
	padding-left: 0;
}

.app-content > .breadcrumb.float-xl-end .breadcrumb-item > a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 4px 10px;
	line-height: 18px;
	border-radius: 4px;
	border: 1px solid var(--gw-border);
	background: var(--gw-surface-2);
	font-size: 12px;
	white-space: nowrap;
	transition: background .15s, color .15s;
}

.app-content > .breadcrumb.float-xl-end .breadcrumb-item > a:hover {
	background: var(--gw-active);
}

/* Default colors only for buttons without own text-* color */
.app-content > .breadcrumb.float-xl-end .breadcrumb-item > a:not([class*="text-"]) {
	color: var(--gw-text-2) !important;
}

.app-content > .breadcrumb.float-xl-end .breadcrumb-item > a:not([class*="text-"]):hover {
	color: var(--gw-text) !important;
}

.app-content > .breadcrumb.float-xl-end .breadcrumb-item > a:not([class*="text-"]) i {
	color: var(--gw-text-3);
}

.app-content > .breadcrumb.float-xl-end .breadcrumb-item > a[class*="text-"] i {
	color: inherit;
}

/** Filter **/

.frq-datatable-search {
	margin: 14px 0 0 0 !important;
	padding: 10px 12px 0 12px;
	background: var(--gw-surface);
	border: 1px solid var(--gw-border);
	border-radius: var(--gw-radius);
	position: relative;
	--bs-gutter-x: 8px;
}

.frq-datatable-search::before {
	content: "\f0b0";
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	font-size: 11px;
	color: var(--gw-text-3);
	position: absolute;
	left: -1px;
	top: -1px;
	width: 22px;
	height: 22px;
	display: grid;
	place-items: center;
	border-radius: var(--gw-radius) 0 4px 0;
	background: var(--gw-surface-2);
	border-right: 1px solid var(--gw-border);
	border-bottom: 1px solid var(--gw-border);
}

.frq-datatable-search > div:first-child {
	margin-left: 16px;
}

.frq-datatable-search > div {
	margin-bottom: 10px;
}

.frq-datatable-search .form-control-sm,
.frq-datatable-search .form-select-sm {
	height: 28px;
	min-height: 28px;
	font-size: 12px;
	border-radius: 4px;
	background-color: var(--gw-surface-2);
	border-color: var(--gw-border);
	color: var(--gw-text);
}

.frq-datatable-search .form-select-sm {
	padding-right: 28px;
}

.frq-datatable-search .form-control-sm:focus,
.frq-datatable-search .form-select-sm:focus {
	border-color: var(--gw-c1);
	box-shadow: 0 0 0 2px color-mix(in srgb, var(--gw-c1) 25%, transparent);
}

/** Active filter **/
.frq-datatable-search .form-select-sm.gw-filter-on,
.frq-datatable-search .form-control-sm.gw-filter-on {
	background-color: color-mix(in srgb, var(--gw-c1) 22%, var(--gw-surface-2));
	border-color: var(--gw-c1);
	color: var(--gw-text);
	font-weight: 500;
}

.frq-datatable-search .btn-primary {
	height: 28px;
	padding: 0 12px;
	border-radius: 4px;
	background: var(--gw-text);
	border-color: var(--gw-text);
	color: var(--gw-surface);
}

.frq-datatable-search .btn-primary:hover {
	opacity: .85;
}

.frq-datatable-search .select2-container--default .select2-selection--single,
.frq-datatable-search .select2-container--default .select2-selection--multiple {
	background-color: var(--gw-surface-2) !important;
	border-color: var(--gw-border) !important;
	border-radius: 4px !important;
	min-height: 28px;
}

.frq-datatable-search + .clearfix {
	height: 12px;
	line-height: 12px;
	font-size: 0;
}

/** Panels **/

.tab-content.panel {
	border-radius: var(--gw-radius) !important;
	border: 1px solid var(--gw-border) !important;
	background: var(--gw-surface) !important;
	padding: 12px 14px !important;
}

.tab-content.panel:has(> .tab-pane > .gw-page),
.tab-content.panel.gw-bare {
	background: transparent !important;
	border: 0 !important;
	padding: 0 !important;
}

/** Tables **/

.table {
	--bs-table-bg: transparent;
	--bs-table-hover-bg: var(--gw-hover);
	--bs-table-hover-color: var(--gw-text);
	color: var(--gw-text);
	margin-bottom: 4px;
}

.table > thead > tr > th {
	font-size: 10.5px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: .6px;
	color: var(--gw-text-3);
	border-bottom: 1px solid var(--gw-border-2) !important;
	padding: 7px 8px;
	vertical-align: bottom;
	background: transparent;
}

.table > tbody > tr > td {
	padding: 6px 8px;
	border-color: var(--gw-border) !important;
	vertical-align: middle;
	font-size: 12.5px;
}

.table > tbody > tr:last-child > td {
	border-bottom: 0;
}

.frq-datatable-hassorting.active i {
	color: var(--gw-c4) !important;
}

/** Badges, buttons **/

.badge {
	font-weight: 500;
	border-radius: 3px;
	padding: 2px 8px;
}

.btn.btn-xs.px-1.py-0 {
	border-radius: 4px;
	padding: 1px 8px !important;
	font-size: 11px;
	font-weight: 500;
	border: 0;
}

.btn.btn-xs.btn-green, .btn.btn-xs.btn-success {
	background: var(--gw-ok-bg) !important;
	color: var(--gw-ok) !important;
}

.btn.btn-xs.btn-danger, .btn.btn-xs.btn-red {
	background: var(--gw-danger-bg) !important;
	color: var(--gw-danger) !important;
}

.btn.btn-xs.btn-primary, .btn.btn-xs.btn-blue {
	background: var(--gw-info-bg) !important;
	color: var(--gw-info) !important;
}

.btn.btn-xs.btn-warning {
	background: var(--gw-warn-bg) !important;
	color: var(--gw-warn) !important;
}

.btn.btn-xs.btn-default {
	background: var(--gw-surface-2) !important;
	color: var(--gw-text-3) !important;
	box-shadow: inset 0 0 0 1px var(--gw-border);
}

.btn.btn-xs.btn-purple, .btn.btn-xs.btn-indigo {
	background: var(--gw-opp-bg) !important;
	color: var(--gw-opp) !important;
}

/** Row buttons **/
td .btn-group .btn.btn-xs, td > a.btn.btn-xs {
	background: transparent;
	color: var(--gw-text-3);
	border: 0;
}

td .btn-group .btn.btn-xs:hover, td > a.btn.btn-xs:hover {
	color: var(--gw-text);
	background: var(--gw-surface-2);
}

/** Detail form **/

.form_dyncontent_record .col-form-label {
	color: var(--gw-text-3);
	font-size: 12px;
}

.form_dyncontent_record span.form-control {
	border-color: transparent;
	border-radius: 0;
	padding-left: 2px;
	color: var(--gw-text);
	min-height: 30px;
}

/* Detail row: one line under label and value, like a table row */
.form_dyncontent_record .row:has(> .col-form-label + div span.form-control) {
	align-items: center;
	border-bottom: 1px dashed var(--gw-border);
}

.form_dyncontent_record .row:has(> .col-form-label + div span.form-control) span.form-control {
	border-bottom-color: transparent;
}

/* Label column: min width, grows for long labels, value takes the rest */
@media (min-width: 768px) {
	.form_dyncontent_record .row > .col-form-label.col-md-3 {
		flex: 0 0 auto;
		width: auto;
		min-width: clamp(140px, 18%, 235px);
		max-width: 40%;
	}

	.form_dyncontent_record .row > .col-form-label.col-md-3 + .col-md-9 {
		flex: 1 1 0;
		width: auto;
		min-width: 0;
	}
}

/** Modal **/

#sys_modal_info .modal-content,
#sys_modal_confirmation .modal-content {
	background: var(--gw-surface);
	border: 1px solid var(--gw-border-2);
	border-radius: 4px;
	box-shadow: 0 4px 16px rgba(0, 0, 0, .35);
}

#sys_modal_info .modal-header,
#sys_modal_confirmation .modal-header {
	border-bottom: 1px solid var(--gw-border);
	padding: 10px 16px;
}

#sys_modal_info .modal-title,
#sys_modal_confirmation .modal-title {
	font-size: 14.5px;
	font-weight: 700;
	color: var(--gw-text);
}

#sys_modal_info .modal-body .tab-content.panel {
	border: 0 !important;
	padding: 0 !important;
	margin-bottom: 8px !important;
}

#sys_modal_info .modal-body > .clearfix {
	display: none;
}

/** Widgets **/

.gw-t2 { color: var(--gw-text-2); }
.gw-t3 { color: var(--gw-text-3); }
.gw-ok { color: var(--gw-ok); }
.gw-warn { color: var(--gw-warn); }
.gw-danger { color: var(--gw-danger); }
.gw-info { color: var(--gw-info); }

.gw-grid {
	margin-bottom: 16px;
}

/** Card **/
.gw-card {
	background: var(--gw-surface);
	border: 1px solid var(--gw-border);
	border-radius: var(--gw-radius);
	padding: 12px 14px;
	height: 100%;
	position: relative;
	color: var(--gw-text);
}

/* Accent only marks the card; content colors (bars, pills) must stay dominant */
.gw-card.gw-top {
	border-top: 2px solid color-mix(in srgb, var(--c) 60%, var(--gw-border));
}

.gw-card.gw-top > .gw-card-b {
	--c: var(--gw-text-2);
}

.gw-card-h {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 10px;
	min-height: 24px;
}

.gw-card-h h3 {
	font-size: 13px;
	font-weight: 700;
	margin: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	color: var(--gw-text);
}

.gw-card-h h3 a {
	color: inherit;
}

.gw-card-h h3 a:hover {
	color: var(--c);
}

.gw-ico {
	width: 22px;
	height: 22px;
	border-radius: 4px;
	display: grid;
	place-items: center;
	font-size: 11.5px;
	flex-shrink: 0;
	background: color-mix(in srgb, var(--c) 26%, transparent);
	color: var(--c);
}

.gw-meta {
	font-size: 11.5px;
	color: var(--gw-text-3);
	font-family: var(--gw-mono);
	white-space: nowrap;
}

.gw-actions {
	margin-left: auto;
	display: flex;
	gap: 6px;
	align-items: center;
}

.gw-actions a, .gw-btn {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 11.5px;
	padding: 2px 8px;
	border-radius: 4px;
	border: 1px solid var(--gw-border);
	background: var(--gw-surface-2);
	color: var(--gw-text-2);
	white-space: nowrap;
}

.gw-actions a:hover, .gw-btn:hover {
	color: var(--gw-text);
	background: var(--gw-active);
}

.gw-actions select {
	height: 24px;
	font-size: 11.5px;
	padding: 0 24px 0 8px;
	border-radius: 4px;
	background-color: var(--gw-surface-2);
	border: 1px solid var(--gw-border);
	color: var(--gw-text);
}

/** Stat cells **/
.gw-cells {
	display: grid;
	grid-template-columns: repeat(var(--n, 6), minmax(0, 1fr));
	row-gap: 12px;
}

.gw-cell {
	padding: 2px 14px;
	border-left: 1px solid var(--gw-border);
	min-width: 0;
	color: inherit;
	display: block;
}

.gw-cell:first-child {
	border-left: 0;
	padding-left: 2px;
}

/** Stat cells: row start **/
.gw-cells-n2 > .gw-cell:nth-child(2n+1) {
	border-left: 0;
	padding-left: 2px;
}

@media (min-width: 577px) {
	.gw-cells-n3 > .gw-cell:nth-child(3n+1) {
		border-left: 0;
		padding-left: 2px;
	}
}

@media (min-width: 1401px) {
	.gw-cells-n4 > .gw-cell:nth-child(4n+1),
	.gw-cells-n5 > .gw-cell:nth-child(5n+1),
	.gw-cells-n6 > .gw-cell:nth-child(6n+1) {
		border-left: 0;
		padding-left: 2px;
	}
}

a.gw-cell:hover .gw-v {
	color: var(--c);
}

.gw-l {
	font-size: 10.5px;
	text-transform: uppercase;
	letter-spacing: .7px;
	color: var(--gw-text-3);
	display: flex;
	align-items: center;
	gap: 6px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.gw-l i {
	color: var(--c);
	font-size: 11.5px;
}

.gw-v {
	font-size: 21px;
	font-weight: 700;
	line-height: 1.25;
	margin-top: 3px;
	font-family: var(--gw-mono);
	white-space: nowrap;
	color: var(--gw-text);
}

.gw-v small {
	font-size: 12px;
	font-weight: 400;
	color: var(--gw-text-3);
}

.gw-s {
	font-size: 11px;
	color: var(--gw-text-2);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.gw-rows {
	margin-top: 5px;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.gw-row-i {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 11px;
	color: var(--gw-text-2);
}

.gw-row-i span {
	flex: 1;
	min-width: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.gw-row-i b {
	font-family: var(--gw-mono);
	font-weight: 500;
	color: var(--gw-text);
}

.gw-segbar {
	display: flex;
	height: 4px;
	border-radius: 3px;
	overflow: hidden;
	margin-top: 6px;
	gap: 2px;
	background: var(--gw-surface-2);
}

.gw-segbar span {
	display: block;
	height: 100%;
	border-radius: 2px;
}

@media (max-width: 1400px) {
	.gw-cells {
		grid-template-columns: repeat(min(var(--n, 6), 4), minmax(0, 1fr));
	}
	.gw-cells:not(.gw-cells-n2):not(.gw-cells-n3) > .gw-cell:nth-child(4n+1) {
		border-left: 0;
		padding-left: 2px;
	}
}

@media (max-width: 576px) {
	.gw-cells {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	.gw-cell:nth-child(4n+1) {
		border-left: 1px solid var(--gw-border);
		padding-left: 14px;
	}
	.gw-cell:nth-child(2n+1) {
		border-left: 0;
		padding-left: 2px;
	}
}

/** Gauge **/
.gw-gauges {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
	gap: 10px;
}

.gw-gauge {
	text-align: center;
	position: relative;
	padding: 4px 4px 2px;
}

.gw-gauge svg {
	width: 100%;
	max-width: 150px;
	height: auto;
	display: block;
	margin: 0 auto;
	overflow: visible;
}

.gw-gauge-track {
	fill: none;
	stroke: var(--gw-surface-2);
	stroke-width: 6;
}

.gw-gauge-value {
	fill: none;
	stroke: var(--c);
	stroke-width: 6;
	transition: stroke-dasharray .6s ease;
}

.gw-gauge-num {
	margin-top: -28px;
	font-family: var(--gw-mono);
	font-weight: 600;
	font-size: 18px;
	line-height: 1.2;
	color: var(--gw-text);
}

.gw-gauge-num small {
	font-size: 11px;
	color: var(--gw-text-3);
	font-weight: 400;
}

.gw-gauge-l {
	font-size: 12px;
	font-weight: 500;
	margin-top: 6px;
	color: var(--gw-text);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.gw-gauge-l a {
	color: inherit;
}

.gw-gauge-s {
	font-size: 11px;
	color: var(--gw-text-3);
	font-family: var(--gw-mono);
}

/** Level gauge **/
.gw-level-zone {
	fill: none;
	stroke-width: 3;
	opacity: .85;
}

.gw-level .gw-gauge-track,
.gw-level .gw-gauge-value {
	stroke-linecap: butt;
}

/** Tank level **/
.gw-tanks {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(76px, 1fr));
	gap: 12px;
}

.gw-tank {
	text-align: center;
	min-width: 0;
}

.gw-tank-body {
	position: relative;
	height: 120px;
	max-width: 64px;
	margin: 0 auto;
	border: 1px solid var(--gw-border-2);
	border-radius: 14px 14px 6px 6px;
	background: var(--gw-surface-2);
	overflow: hidden;
}

.gw-tank-body span {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(180deg, var(--c), color-mix(in srgb, var(--c) 60%, transparent));
	transition: height .6s ease;
}

.gw-tank-body i {
	position: absolute;
	left: 0;
	right: 0;
	border-top: 1px dashed var(--gw-danger);
}

.gw-tank-body b {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--gw-mono);
	font-size: 13px;
	color: var(--gw-text);
	text-shadow: 0 1px 2px rgba(0, 0, 0, .5);
}

.gw-tank-l {
	margin-top: 6px;
	font-size: 11.5px;
	font-weight: 500;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.gw-tank-s {
	font-size: 10.5px;
	font-family: var(--gw-mono);
	color: var(--gw-text-3);
}

/** Tank card **/
.gw-tankcards {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
	gap: 12px;
}

.gw-tankcard {
	border: 1px solid var(--gw-border);
	border-top: 2px solid var(--c);
	border-radius: 4px;
	background: var(--gw-surface-2);
	padding: 10px 12px;
	min-width: 0;
}

.gw-tankcard-h {
	display: flex;
	align-items: baseline;
	gap: 8px;
	margin-bottom: 8px;
	white-space: nowrap;
	overflow: hidden;
}

.gw-tankcard-h b {
	font-size: 13px;
}

.gw-tankcard-h span {
	font-size: 11px;
	color: var(--gw-text-3);
	overflow: hidden;
	text-overflow: ellipsis;
}

.gw-tankcard-b {
	display: grid;
	grid-template-columns: 70px 1fr;
	gap: 12px;
	align-items: center;
}

.gw-tankcard .gw-tank-body {
	height: 104px;
	background: var(--gw-surface);
}

.gw-tankcard .gw-info-r {
	display: block;
	padding: 3px 0;
	font-size: 12px;
}

.gw-tankcard .gw-info-l {
	font-size: 10.5px;
	line-height: 1.3;
}

.gw-tankcard .gw-info-v {
	display: block;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	font-family: var(--gw-mono);
}

/** Date value **/
.gw-date {
	display: inline-block;
	font-size: 14px;
	line-height: 1.2;
}

.gw-date small {
	display: table;
	margin-top: 3px;
	padding: 0 6px;
	border-radius: 4px;
	font-size: 14px;
	color: var(--c, var(--gw-c1));
	background: color-mix(in srgb, var(--c, var(--gw-c1)) 16%, transparent);
}

/** Ring **/
.gw-ring-wrap {
	display: flex;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
}

.gw-ring {
	width: 120px;
	height: 120px;
	position: relative;
	flex-shrink: 0;
}

.gw-ring svg {
	width: 100%;
	height: 100%;
}

.gw-ring-track {
	fill: none;
	stroke: var(--gw-surface-2);
	stroke-width: 4;
}

.gw-ring-seg {
	fill: none;
	stroke-width: 4;
}

.gw-ring-c {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.gw-ring-c b {
	font-family: var(--gw-mono);
	font-size: 18px;
	color: var(--gw-text);
}

.gw-ring-c span {
	font-size: 10px;
	color: var(--gw-text-3);
	text-transform: uppercase;
	letter-spacing: .6px;
}

.gw-legend {
	flex: 1;
	min-width: 150px;
	display: flex;
	flex-direction: column;
	gap: 3px;
}

.gw-legend div {
	display: flex;
	align-items: center;
	gap: 7px;
	font-size: 11.5px;
	color: var(--gw-text-2);
}

.gw-legend i {
	width: 9px;
	height: 9px;
	border-radius: 3px;
	flex-shrink: 0;
}

.gw-legend span {
	flex: 1;
	min-width: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.gw-legend b {
	font-family: var(--gw-mono);
	font-weight: 500;
	color: var(--gw-text);
}

.gw-legend em {
	font-style: normal;
	font-family: var(--gw-mono);
	color: var(--gw-text-3);
	width: 48px;
	text-align: right;
}

/** Pie chart **/
.gw-pie {
	display: flex;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
}

.gw-pie-legend-bottom {
	flex-direction: column;
	align-items: stretch;
}

.gw-pie-legend-bottom .gw-pie-c {
	margin: 0 auto;
}

.gw-pie-legend-none {
	justify-content: center;
}

.gw-pie-c {
	position: relative;
	flex-shrink: 0;
}

.gw-pie-c svg {
	width: 100%;
	display: block;
}

.gw-pie-half .gw-ring-c {
	top: auto;
	bottom: -2px;
}

.gw-pie-legend-bottom .gw-legend {
	width: 100%;
}

/** Progress **/
.gw-progress {
	display: flex;
	align-items: center;
	gap: 8px;
	min-width: 110px;
}

.gw-progress-bar {
	flex: 1;
	height: 6px;
	border-radius: 4px;
	background: var(--gw-surface-2);
	overflow: hidden;
}

.gw-progress-bar span {
	display: block;
	height: 100%;
	border-radius: 4px;
}

.gw-progress b {
	font-family: var(--gw-mono);
	font-weight: 500;
	font-size: 11.5px;
	width: 44px;
	text-align: right;
	color: var(--gw-text);
}

/** Horizontal bars **/
.gw-hbars {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.gw-hbar {
	display: grid;
	grid-template-columns: minmax(90px, 34%) 1fr auto;
	align-items: center;
	gap: 10px;
	font-size: 12px;
}

.gw-hbar-l {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	color: var(--gw-text-2);
}

.gw-hbar-l a {
	color: var(--gw-text);
}

.gw-hbar-l a:hover {
	color: var(--c);
}

.gw-hbar-l small {
	color: var(--gw-text-3);
	font-family: var(--gw-mono);
}

.gw-hbar-t {
	height: 8px;
	border-radius: 2px;
	background: var(--gw-surface-2);
	overflow: hidden;
}

.gw-hbar-t span {
	display: block;
	height: 100%;
	border-radius: 2px;
	background: var(--c);
}

.gw-hbar-v {
	font-family: var(--gw-mono);
	font-weight: 500;
	color: var(--gw-text);
	min-width: 48px;
	text-align: right;
}

/** Column chart **/
.gw-cols {
	display: grid;
	grid-template-columns: repeat(var(--n), minmax(0, 1fr));
	gap: 6px;
	align-items: end;
	padding-top: 16px;
}

.gw-col-t {
	height: var(--h);
	position: relative;
	display: flex;
	align-items: flex-end;
	border-bottom: 1px solid var(--gw-border-2);
}

.gw-col-t span {
	display: block;
	width: 100%;
	min-height: 2px;
	border-radius: 2px 2px 0 0;
	background: var(--c);
	transition: height .5s ease;
}

.gw-col:hover .gw-col-t span {
	filter: brightness(1.2);
}

.gw-col-t em {
	position: absolute;
	left: 0;
	right: 0;
	margin-bottom: 2px;
	text-align: center;
	font-style: normal;
	font-family: var(--gw-mono);
	font-size: 10.5px;
	color: var(--gw-text-2);
	white-space: nowrap;
}

.gw-col-l {
	font-size: 10.5px;
	color: var(--gw-text-3);
	text-align: center;
	margin-top: 4px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	font-family: var(--gw-mono);
}

/** Sparkline **/
.gw-spark {
	width: 100%;
	height: 30px;
	display: block;
}

.gw-spark polyline {
	fill: none;
	stroke: var(--c);
	stroke-width: 1.6;
	vector-effect: non-scaling-stroke;
}

.gw-cols-sparse .gw-col-l {
	overflow: visible;
	text-overflow: clip;
	text-align: left;
}

/** Line chart **/
.gw-line {
	position: relative;
	padding-top: 6px;
}

.gw-line svg {
	width: 100%;
	height: var(--h);
	display: block;
	overflow: visible;
	border-bottom: 1px solid var(--gw-border-2);
}

.gw-line line {
	stroke: var(--gw-border);
	stroke-dasharray: 2 3;
	vector-effect: non-scaling-stroke;
}

.gw-line polyline {
	fill: none;
	stroke-width: 2;
	stroke-linejoin: round;
	vector-effect: non-scaling-stroke;
}

.gw-line polygon {
	opacity: .14;
	stroke: none;
}

.gw-line-hover {
	position: absolute;
	top: 6px;
	left: 0;
	right: 0;
	height: var(--h);
	display: grid;
	grid-template-columns: repeat(var(--n), minmax(0, 1fr));
}

.gw-line-hover span:hover {
	background: var(--gw-hover);
}

.gw-line-l {
	display: grid;
	grid-template-columns: repeat(var(--n), minmax(0, 1fr));
	margin-top: 4px;
	font-size: 10.5px;
	font-family: var(--gw-mono);
	color: var(--gw-text-3);
	white-space: nowrap;
}

/** Catalog **/
.gw-code {
	font-family: var(--gw-mono);
	font-size: 12px;
	color: var(--gw-text);
	background: var(--gw-surface-2);
	border: 1px solid var(--gw-border);
	border-radius: 4px;
	padding: 1px 7px;
}

/** Tabs **/
.gw-tabs {
	display: flex;
	gap: 2px;
	border-bottom: 1px solid var(--gw-border);
	margin-bottom: 14px;
	flex-wrap: wrap;
}

.gw-tabs .nav-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 7px 12px;
	font-size: 12.5px;
	color: var(--gw-text-2);
	border: 0;
	border-bottom: 2px solid transparent;
	border-radius: 0;
	margin-bottom: -1px;
	background: transparent;
}

.gw-tabs .nav-link i {
	color: var(--gw-text-3);
	font-size: 12px;
}

.gw-tabs .nav-link:hover {
	color: var(--gw-text);
}

.gw-tabs .nav-link.active {
	color: var(--gw-text);
	font-weight: 500;
	border-bottom-color: var(--gw-c1);
	background: transparent;
}

.gw-tabs .nav-link.active i {
	color: var(--gw-c1);
}

.gw-tab-badge {
	font-family: var(--gw-mono);
	font-size: 10.5px;
	padding: 0 6px;
	border-radius: 4px;
	background: var(--gw-surface-2);
	color: var(--gw-text-3);
	border: 1px solid var(--gw-border);
}

.gw-tab-content > .tab-pane > .form_dyncontent_record {
	max-width: 980px;
}

/** Info list **/
.gw-info {
	display: flex;
	flex-direction: column;
}

.gw-info-r {
	display: grid;
	grid-template-columns: minmax(120px, 40%) 1fr;
	gap: 10px;
	padding: 5px 0;
	border-bottom: 1px solid var(--gw-border);
	font-size: 12.5px;
	align-items: center;
}

.gw-info-r:last-child {
	border-bottom: 0;
}

.gw-info-l {
	color: var(--gw-text-3);
	display: flex;
	align-items: center;
	gap: 7px;
}

.gw-info-l i {
	width: 14px;
	text-align: center;
	font-size: 11.5px;
}

.gw-info-v {
	color: var(--gw-text);
	font-weight: 500;
	min-width: 0;
	overflow-wrap: anywhere;
}

/** Mini table **/
.gw-table {
	margin: 0;
}

.gw-table > thead > tr > th {
	padding: 5px 6px;
}

.gw-table > tbody > tr > td {
	padding: 5px 6px;
	font-size: 12px;
}

.gw-table td.text-end, .gw-table td.text-center {
	font-family: var(--gw-mono);
}

/** Pill **/
.gw-pill {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 10.5px;
	font-weight: 500;
	padding: 1px 8px;
	border-radius: 3px;
	white-space: nowrap;
	line-height: 1.6;
}

.gw-pill.ok { background: var(--gw-ok-bg); color: var(--gw-ok); }
.gw-pill.warn { background: var(--gw-warn-bg); color: var(--gw-warn); }
.gw-pill.danger { background: var(--gw-danger-bg); color: var(--gw-danger); }
.gw-pill.info { background: var(--gw-info-bg); color: var(--gw-info); }
.gw-pill.opp { background: var(--gw-opp-bg); color: var(--gw-opp); }
.gw-pill.mute { background: var(--gw-surface-2); color: var(--gw-text-2); box-shadow: inset 0 0 0 1px var(--gw-border); }

.gw-empty {
	padding: 18px 8px;
	text-align: center;
	color: var(--gw-text-3);
	font-size: 12px;
}

/** Exam cards **/
.gw-exam {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.gw-exam-top {
	display: flex;
	gap: 10px;
	align-items: center;
}

.gw-exam-top .gw-gauge {
	width: 118px;
	flex-shrink: 0;
}

.gw-exam-top .gw-gauge-num {
	font-size: 17px;
	margin-top: -26px;
}

.gw-exam-facts {
	flex: 1;
	min-width: 0;
}

.gw-exam-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
}

/** List summary **/
.gw-listhead {
	margin-bottom: 12px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--gw-border);
}

/** Activity feed **/
.gw-feed {
	display: flex;
	flex-direction: column;
}

.gw-feed-i {
	display: grid;
	grid-template-columns: 18px 1fr auto;
	gap: 8px;
	align-items: center;
	padding: 5px 0;
	border-bottom: 1px solid var(--gw-border);
	font-size: 12px;
}

.gw-feed-i:last-child {
	border-bottom: 0;
}

.gw-feed-i i {
	color: var(--c, var(--gw-text-3));
	text-align: center;
}

.gw-feed-i span {
	min-width: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	color: var(--gw-text);
}

.gw-feed-i span small {
	color: var(--gw-text-3);
}

.gw-feed-i em {
	font-style: normal;
	font-family: var(--gw-mono);
	font-size: 11px;
	color: var(--gw-text-3);
	white-space: nowrap;
}

@media print {
	.gw-actions, .gw-tabs {
		display: none !important;
	}
	.gw-tab-content > .tab-pane {
		display: block !important;
		opacity: 1 !important;
	}
}

/** Filter reset **/
.app-content > .breadcrumb.float-xl-end .breadcrumb-item > a.frq-text-orange {
	background: var(--gw-warn-bg);
	color: var(--gw-warn) !important;
	border-color: color-mix(in srgb, var(--gw-warn) 35%, transparent);
}

.app-content > .breadcrumb.float-xl-end .breadcrumb-item > a.frq-text-orange i {
	color: var(--gw-warn);
}

/** Link tiles **/
.gw-linktiles {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
	gap: 8px;
}

.gw-linktile {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 9px 12px;
	border-radius: 4px;
	border: 1px solid var(--gw-border);
	background: var(--gw-surface-2);
	color: var(--gw-text) !important;
	font-size: 12.5px;
	transition: border-color .15s, background .15s;
}

.gw-linktile > span:nth-child(2) {
	flex: 1;
	min-width: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.gw-linktile:hover {
	border-color: var(--c);
	background: color-mix(in srgb, var(--c) 10%, var(--gw-surface-2));
}

.gw-tab-content .gw-card > .form_dyncontent_record {
	margin: 0;
}

/** Card stack **/
.gw-stack {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.gw-stack > .gw-card {
	height: auto;
}

/** Modal stat cells **/
#sys_modal_info .gw-cells {
	grid-template-columns: repeat(min(var(--n, 6), 3), minmax(0, 1fr));
}

#sys_modal_info .gw-cell {
	border-left: 1px solid var(--gw-border);
	padding-left: 14px;
}

#sys_modal_info .gw-cell:nth-child(3n+1) {
	border-left: 0;
	padding-left: 2px;
}

#sys_modal_info .modal-xl {
	--bs-modal-width: min(1320px, 96vw);
}

/** Mobile **/
@media (max-width: 767.98px) {
	.gw-card-h {
		flex-wrap: wrap;
	}

	.gw-card-h .gw-meta {
		white-space: normal;
	}

	.gw-actions {
		margin-left: 0;
		width: 100%;
	}

	.gw-actions select {
		width: 100%;
		max-width: 100%;
	}

	.gw-cols {
		gap: 3px;
	}

	.gw-col-t em {
		display: none;
	}

	.gw-hbar {
		grid-template-columns: minmax(80px, 38%) 1fr auto;
		gap: 6px;
	}

	.gw-exam-top .gw-gauge {
		width: 100px;
	}

	.app-content {
		padding: 12px 10px;
	}
}

@media (max-width: 767.98px) {
	.frq-datatable-search {
		padding-top: 10px;
	}

	.frq-datatable-search::before {
		display: none;
	}

	/* Filters closed: first filter + buttons in one row */
	.frq-datatable-search:not(.gw-filter-open) > .col-12:not(:first-child) {
		display: none;
	}

	.frq-datatable-search:not(.gw-filter-open) > .col-12:first-child {
		flex: 1 1 0;
		width: auto;
	}

	.frq-datatable-search > .col {
		flex: 0 0 auto;
		width: auto;
		display: flex;
		gap: 6px;
	}

	.frq-datatable-search .gw-filter-toggle {
		position: relative;
		border: 1px solid var(--gw-border-2);
		color: var(--gw-text-2);
		background: transparent;
	}

	.frq-datatable-search.gw-filter-open .gw-filter-toggle {
		color: var(--gw-text);
		border-color: var(--gw-text-3);
	}

	/* Table footer: pagination and per-page in one row */
	.row:has(> div > .pagination) {
		flex-wrap: nowrap;
		align-items: center;
		--bs-gutter-x: 8px;
	}

	.row:has(> div > .pagination) > div {
		width: auto;
		flex: 0 0 auto;
	}

	.row:has(> div > .pagination) > div:first-child {
		flex: 1 1 auto;
		min-width: 0;
	}

	.row:has(> div > .pagination) label {
		margin: 0;
	}

	/* Pagination: current page with neighbours only */
	.pagination {
		flex-wrap: nowrap;
		margin: 0;
	}

	.pagination .page-item + .page-item {
		margin-left: 3px;
	}

	.pagination .page-link {
		min-width: 30px;
		padding: 4px 6px;
		text-align: center;
	}

	.pagination .gw-pg-num:not(.active) {
		display: none;
	}

	.pagination .gw-pg-num.active + .gw-pg-num,
	.pagination .gw-pg-num:has(+ .gw-pg-num.active) {
		display: block;
	}

	/* Detail view as table: label cell | value cell */
	.form_dyncontent_record .row:has(> .col-form-label + div span.form-control) {
		flex-wrap: nowrap;
		align-items: stretch;
		margin: 0 0 -1px;
		border: 1px solid var(--gw-border);
	}

	.form_dyncontent_record .row:has(> .col-form-label + div span.form-control) > .col-form-label {
		flex: 0 0 38%;
		width: 38%;
		display: flex;
		align-items: center;
		padding: 6px 8px;
		background: var(--gw-surface-2);
		border-right: 1px solid var(--gw-border);
		color: var(--gw-text-2);
		font-size: 12px;
		line-height: 1.3;
	}

	.form_dyncontent_record .row:has(> .col-form-label + div span.form-control) > div {
		flex: 1 1 0;
		width: auto;
		min-width: 0;
		display: flex;
		align-items: center;
		padding: 6px 8px;
	}

	.form_dyncontent_record .row:has(> .col-form-label + div span.form-control) > div > .row {
		margin: 0;
		width: 100%;
	}

	.form_dyncontent_record .row:has(> .col-form-label + div span.form-control) > div > .row > div {
		padding: 0 !important;
	}

	.form_dyncontent_record .row:has(> .col-form-label + div span.form-control) span.form-control {
		display: block;
		min-height: 0;
		padding: 0;
		border: 0;
		border-radius: 0;
		background: transparent;
		box-shadow: none;
		line-height: 1.35;
		overflow-wrap: anywhere;
	}

	/* Detail row holding a table: label on top, table full width */
	.form_dyncontent_record .row:has(> .col-form-label + div span.form-control):has(table) {
		flex-wrap: wrap;
	}

	.form_dyncontent_record .row:has(> .col-form-label + div span.form-control):has(table) > .col-form-label {
		flex: 0 0 100%;
		width: 100%;
		border-right: 0;
		border-bottom: 1px solid var(--gw-border);
	}

	.form_dyncontent_record .row:has(> .col-form-label + div span.form-control):has(table) > div {
		flex: 0 0 100%;
		width: 100%;
		display: block;
		overflow-x: auto;
	}

	.form_dyncontent_record .row:has(> .col-form-label + div span.form-control):has(table) span.form-control {
		overflow-wrap: normal;
	}

	/* Only one filter: nothing to open */
	.frq-datatable-search:not(:has(> .col-12 ~ .col-12)) .gw-filter-toggle {
		display: none;
	}

	/* Hidden filter is set: mark the funnel */
	.frq-datatable-search:not(.gw-filter-open):has(> .col-12:not(:first-child) .gw-filter-on) .gw-filter-toggle::after {
		content: "";
		position: absolute;
		top: -3px;
		right: -3px;
		width: 8px;
		height: 8px;
		border-radius: 50%;
		background: var(--gw-warn);
	}

	.frq-datatable-search > div:first-child {
		margin-left: 0;
	}

	/* Filters two per row */
	.frq-datatable-search > .col-12:not(.isMultiselect) {
		width: 50%;
		margin-bottom: 8px;
	}

	/* Spacer under breadcrumb */
	.app-content > .breadcrumb + .clearfix {
		height: 4px;
		line-height: 4px;
		font-size: 0;
	}

	/* Detail: label sits close to its value */
	.app-content .col-form-label {
		padding-top: 6px;
		padding-bottom: 2px;
	}

	/* Tables: tighter cells */
	.app-content .table > :not(caption) > * > * {
		padding: 6px 5px;
	}

	/* Sidebar: bigger touch targets */
	.app-sidebar .menu .menu-item .menu-link {
		padding-top: 8px;
		padding-bottom: 8px;
	}

	/* Sidebar open: dim content and header */
	.app-sidebar-mobile-toggled .app-sidebar-mobile-backdrop:not(.app-sidebar-end) {
		background: rgba(0, 0, 0, .6);
		backdrop-filter: blur(2px);
		animation: none;
	}

	.app-sidebar-mobile-toggled .app-header {
		z-index: 1015;
	}
}

/** Chart label **/
.gw-chartlabel {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 11px;
	color: var(--gw-text-2);
	text-transform: uppercase;
	letter-spacing: .6px;
}

.gw-chartlabel i {
	width: 9px;
	height: 9px;
	border-radius: 3px;
}

/** Sidebar version **/
.app-sidebar .app-sidebar-content > .menu {
	display: flex;
	flex-direction: column;
	min-height: 100%;
}

.gw-version {
	margin: auto 0 6px;
	padding-top: 10px;
	text-align: center;
	font-family: var(--gw-mono);
	font-size: 10px;
	color: var(--gw-text-3);
	opacity: .55;
}

.gw-version b {
	font-weight: 600;
	color: var(--gw-text-2);
	margin-right: 6px;
}

.app-sidebar-minified .gw-version {
	display: none;
}