/*!
 * DWActionBar 1.3.0
 */

.dw-actionbar {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	min-width: 0;
	gap: 7px;
}

.dw-actionbar.dw-actionbar-spacing-compact {
	gap: 3px;
}

.dw-actionbar-align-left {
	justify-content: flex-start;
}

.dw-actionbar-align-center {
	justify-content: center;
}

.dw-actionbar-align-right {
	justify-content: flex-end;
}

.dw-actionbar .dw-actionbar-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
	min-height: 30px;
	padding: 4px 8px;
	margin: 0;
	border: 1px solid #d8dde2;
	border-radius: 5px;
	background: #f3f4f6;
	color: #3f4852;
	font: inherit;
	font-size: 12px;
	font-weight: 500;
	line-height: 18px;
	white-space: nowrap;
	text-decoration: none;
	cursor: pointer;
	box-sizing: border-box;
	outline: 0;
}

.dw-actionbar .dw-actionbar-button:hover,
.dw-actionbar .dw-actionbar-button:focus {
	background: #e9ecef;
	border-color: #c9d0d6;
	color: #2f3740;
}

.dw-actionbar .dw-actionbar-button.is-primary {
	background: #277f89;
	border-color: #277f89;
	color: #fff;
}

.dw-actionbar .dw-actionbar-button.is-primary:hover,
.dw-actionbar .dw-actionbar-button.is-primary:focus {
	background: #226f78;
	border-color: #226f78;
	color: #fff;
}

.dw-actionbar .dw-actionbar-button.is-danger {
	color: #a63c3c;
}

.dw-actionbar .dw-actionbar-button.is-danger:hover,
.dw-actionbar .dw-actionbar-button.is-danger:focus {
	background: #f8eeee;
	border-color: #e1caca;
	color: #8f3030;
}

.dw-actionbar .dw-actionbar-button:disabled,
.dw-actionbar .dw-actionbar-button.is-disabled {
	opacity: .48;
	cursor: default;
	pointer-events: none;
}

.dw-actionbar .dw-actionbar-button i {
	line-height: 1;
}

.dw-actionbar-caret,
.dw-actionbar-toggle-caret {
	display: inline-block;
	width: 0;
	height: 0;
	margin-left: 2px;
	border-left: 4px solid transparent;
	border-right: 4px solid transparent;
	border-top: 4px solid currentColor;
	vertical-align: middle;
	transition: transform .12s ease;
}

.dw-actionbar .dw-actionbar-toggle.is-open .dw-actionbar-toggle-caret {
	transform: rotate(180deg);
}

/* Active toggle: neutral active state, primary keeps its own theme. */
.dw-actionbar .dw-actionbar-toggle.is-active:not(.is-primary) {
	background: #e5eaec;
	border-color: #bcc7cc;
	color: #2f4850;
}

/* =========================================================
   BUTTON GROUPS - 1.1.1 geometry retained
   ========================================================= */

.dw-actionbar .dw-actionbar-button-group {
	display: inline-flex;
	align-items: stretch;
	flex: 0 0 auto;
	gap: 0;
}

.dw-actionbar .dw-actionbar-button-group .dw-actionbar-button {
	margin: 0;
	border-radius: 0;
}

.dw-actionbar .dw-actionbar-button-group .dw-actionbar-button + .dw-actionbar-button {
	margin-left: -1px;
}

.dw-actionbar .dw-actionbar-button-group .dw-actionbar-button:first-child {
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
}

.dw-actionbar .dw-actionbar-button-group .dw-actionbar-button:last-child {
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
}

.dw-actionbar .dw-actionbar-button-group .dw-actionbar-button:only-child {
	border-radius: 5px;
}

.dw-actionbar .dw-actionbar-button-group .dw-actionbar-button:hover,
.dw-actionbar .dw-actionbar-button-group .dw-actionbar-button:focus {
	position: relative;
	z-index: 2;
}

/* =========================================================
   SELECTED COUNT
   ========================================================= */

.dw-actionbar-selected-count {
	display: inline-flex;
	align-items: center;
	min-height: 30px;
	padding: 0 4px;
	border: 0;
	background: transparent;
	color: #55787a;
	font-size: 12px;
	line-height: 30px;
	box-shadow: none;
	white-space: nowrap;
}

.dw-actionbar-selected-label-short {
	display: none;
}

/* =========================================================
   MENU POPUP
   ========================================================= */

.dw-actionbar-menu-template {
	display: none;
}

.dw-actionbar-popup {
	min-width: 190px;
	max-width: 320px;
	padding: 5px;
	border: 1px solid #d8dde2;
	border-radius: 6px;
	background: #fff;
	box-shadow: 0 8px 24px rgba(0,0,0,.12);
	box-sizing: border-box;
}

.dw-actionbar-popup .dw-actionbar-menu-item {
	display: flex;
	align-items: center;
	gap: 8px;
	width: 100%;
	padding: 7px 9px;
	border: 0;
	border-radius: 4px;
	background: transparent;
	color: #3f4852;
	font: inherit;
	font-size: 12px;
	line-height: 18px;
	text-align: left;
	cursor: pointer;
	box-sizing: border-box;
	font-weight: 500;
}

.dw-actionbar-popup .dw-actionbar-menu-item:hover,
.dw-actionbar-popup .dw-actionbar-menu-item:focus {
	background: #f1f3f4;
	color: #2f3740;
	outline: 0;
}

.dw-actionbar-popup .dw-actionbar-menu-item.is-danger {
	color: #a63c3c;
}

.dw-actionbar-popup .dw-actionbar-menu-item.is-disabled,
.dw-actionbar-popup .dw-actionbar-menu-item:disabled {
	opacity: .45;
	cursor: default;
	pointer-events: none;
}

.dw-actionbar-popup .dw-actionbar-menu-separator {
	height: 1px;
	margin: 5px 4px;
	background: #e5e8eb;
}

/* =========================================================
   1.2 CUSTOM / TOGGLE PANELS
   ========================================================= */

/*
 * Application-owned panel.
 * It may contain any HTML: filters, export options, dates, etc.
 */
.dw-actionbar-panel {
	display: none;
	box-sizing: border-box;
}

/* Dropdown panel is moved temporarily into this body-level popup. */
.dw-actionbar-panel-popup {
	min-width: 240px;
	max-width: min(520px, calc(100vw - 16px));
	padding: 0;
	border: 1px solid #d8dde2;
	border-radius: 6px;
	background: #fff;
	box-shadow: 0 8px 24px rgba(0,0,0,.12);
	box-sizing: border-box;
}

/* Give common panel content a sensible default inset. */
.dw-actionbar-panel-popup > .dw-actionbar-panel {
	display: block;
	padding: 12px;
}

/*
 * Inline mode: the application decides where the panel lives in the DOM.
 * Usually place it immediately below the bar/layout row.
 */
.dw-actionbar-inline-panel {
	width: 100%;
	margin-top: 8px;
	padding: 12px;
	border: 1px solid #d8dde2;
	border-radius: 6px;
	background: #fff;
	box-sizing: border-box;
}

.dw-actionbar-inline-panel.is-open {
	display: block;
}

/* Optional close control inside application-owned panel. */
.dw-actionbar-panel [data-dw-panel-close] {
	cursor: pointer;
}


/* =========================================================
   1.2.0-dev1 PANEL FORM CONTROLS
   ========================================================= */

.dw-actionbar-panel input[type="text"],
.dw-actionbar-panel input[type="number"],
.dw-actionbar-panel input[type="date"],
.dw-actionbar-panel input[type="email"],
.dw-actionbar-panel select,
.dw-actionbar-panel textarea {
	box-sizing: border-box;
	min-height: 30px;
	padding: 4px 8px;
	border: 1px solid #c9d0d6;
	border-radius: 4px;
	background: #fff;
	color: #34414a;
	font: inherit;
	font-size: 12px;
	line-height: 20px;
	outline: none;
}

.dw-actionbar-panel input[type="text"]:focus,
.dw-actionbar-panel input[type="number"]:focus,
.dw-actionbar-panel input[type="date"]:focus,
.dw-actionbar-panel input[type="email"]:focus,
.dw-actionbar-panel select:focus,
.dw-actionbar-panel textarea:focus {
	border-color: #7fa8ac;
	box-shadow: 0 0 0 2px rgba(39, 127, 137, .10);
}

.dw-actionbar-panel select {
	height: 30px;
	padding-right: 26px;
}

.dw-actionbar-panel textarea {
	min-height: 70px;
	resize: vertical;
}

.dw-actionbar-panel .formstyle {
	margin: 0;
	border: 0;
}

.dw-actionbar-panel .formstyle th,
.dw-actionbar-panel .formstyle td {
	padding: 4px 5px;
	border: 0;
	background: transparent;
	vertical-align: middle;
}

.dw-actionbar-panel .formstyle th {
	color: #4b5861;
	font-size: 12px;
	font-weight: 600;
	white-space: nowrap;
}

.dw-actionbar-panel-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	min-height: 30px;
	padding: 5px 11px;
	border: 1px solid #d8dde2;
	border-radius: 4px;
	background: #f3f4f6;
	color: #3f4852;
	font: inherit;
	font-size: 12px;
	line-height: 18px;
	white-space: nowrap;
	text-decoration: none;
	cursor: pointer;
	box-sizing: border-box;
	outline: 0;
}

.dw-actionbar-panel-button:hover,
.dw-actionbar-panel-button:focus {
	background: #e9ecef;
	border-color: #c9d0d6;
	color: #2f3740;
}

.dw-actionbar-panel-button.is-primary {
	background: #277f89;
	border-color: #277f89;
	color: #fff;
}

.dw-actionbar-panel-button.is-primary:hover,
.dw-actionbar-panel-button.is-primary:focus {
	background: #226f78;
	border-color: #226f78;
	color: #fff;
}

.dw-actionbar-panel-button.is-danger {
	color: #a63c3c;
}

.dw-actionbar-panel-button.is-danger:hover,
.dw-actionbar-panel-button.is-danger:focus {
	background: #f8eeee;
	border-color: #e1caca;
	color: #8f3030;
}

.dw-actionbar-panel-button:disabled,
.dw-actionbar-panel-button.is-disabled {
	opacity: .48;
	cursor: default;
	pointer-events: none;
}




/* =========================================================
   1.3 ADAPTIVE OVERFLOW / RUNTIME STATE / BADGES
   ========================================================= */

.dw-actionbar[data-dw-overflow="auto"] {
	flex-wrap: nowrap;
}

/*
 * Before the first overflow calculation, avoid a temporary wrapped/spilled
 * layout. Once JavaScript calculates the bar it adds .is-overflow-ready.
 */
.dw-actionbar[data-dw-overflow="auto"]:not(.is-overflow-ready) {
	overflow: hidden;
}

.dw-actionbar[data-dw-overflow="auto"].is-overflow-ready {
	overflow: visible;
}

.dw-actionbar [data-dw-overflow-unit="1"] {
	flex: 0 0 auto;
}

.dw-actionbar [data-dw-overflow-unit="1"].is-overflowed,
.dw-actionbar .is-runtime-hidden {
	display: none !important;
}

.dw-actionbar-overflow-trigger {
	flex: 0 0 auto;
}

.dw-actionbar-overflow-trigger.is-visible {
	display: inline-flex !important;
}

.dw-actionbar-overflow-submenu-icon {
	margin-left: auto;
	padding-left: 12px;
	color: #8a949c;
}

/* Runtime group geometry when first/last physical buttons are hidden. */
.dw-actionbar .dw-actionbar-button-group .dw-actionbar-button.is-first-visible {
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
}

.dw-actionbar .dw-actionbar-button-group .dw-actionbar-button.is-last-visible {
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
}

/* Small neutral status badge usable on buttons, menus and overflow items. */
.dw-actionbar-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 16px;
	height: 16px;
	padding: 0 4px;
	border-radius: 8px;
	background: rgba(53, 65, 74, .12);
	color: inherit;
	font-size: 10px;
	font-weight: 700;
	line-height: 16px;
	box-sizing: border-box;
}

.dw-actionbar-button.is-primary .dw-actionbar-badge {
	background: rgba(255,255,255,.20);
	color: #fff;
}

.dw-actionbar-popup .dw-actionbar-badge {
	margin-left: auto;
}

.dw-actionbar-popup .dw-actionbar-overflow-item .dw-actionbar-badge +
.dw-actionbar-overflow-submenu-icon {
	margin-left: 4px;
}




/* =========================================================
   1.3.0 BUSY / LOADING STATE
   ========================================================= */

.dw-actionbar [data-dw-action].is-busy {
	cursor: wait;
}

/*
 * Busy is visually distinct from a permanently disabled action.
 * Keep enough contrast so users can see which operation is running.
 */
.dw-actionbar [data-dw-action].is-busy,
.dw-actionbar-popup [data-dw-action].is-busy {
	opacity: .78;
}

.dw-actionbar-busy-spinner {
	display: inline-block;
	flex: 0 0 auto;
	width: 12px;
	height: 12px;
	border: 2px solid currentColor;
	border-right-color: transparent;
	border-radius: 50%;
	box-sizing: border-box;
	animation: dw-actionbar-spin .7s linear infinite;
}

/*
 * While busy, hide the action's normal leading icon. Badges/carets remain
 * untouched and the original icon is restored automatically by class removal.
 */
.dw-actionbar [data-dw-action].is-busy > i:first-child,
.dw-actionbar-popup [data-dw-action].is-busy > i:first-child {
	display: none;
}

.dw-actionbar [data-dw-action].is-busy >
.dw-actionbar-busy-spinner:first-child,
.dw-actionbar-popup [data-dw-action].is-busy >
.dw-actionbar-busy-spinner:first-child {
	display: inline-block;
}

@keyframes dw-actionbar-spin {
	from { transform: rotate(0deg); }
	to   { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
	.dw-actionbar-busy-spinner {
		animation-duration: 1.4s;
	}
}


/* =========================================================
   RESPONSIVE - 1.3.0 compact mobile
   ========================================================= */

@media (max-width: 767px) {
	.dw-actionbar {
		width: 100%;
		gap: 4px;
	}

	/*
	 * Normal 1.2-style bars may still wrap freely.
	 * 1.3 overflow-enabled bars intentionally use at most the configured
	 * number of rows; JavaScript moves lower-priority actions to More.
	 */
	.dw-actionbar[data-dw-overflow="auto"] {
		flex-wrap: wrap;
		align-content: flex-start;
	}

	.dw-actionbar .dw-actionbar-button {
		min-height: 32px;
		padding: 4px 8px;
		gap: 5px;
		font-size: 12px;
		font-weight: 500;
		line-height: 18px;
	}

	.dw-actionbar .dw-actionbar-button-group .dw-actionbar-button {
		padding-left: 7px;
		padding-right: 7px;
	}

	.dw-actionbar .dw-actionbar-button i {
		font-size: 12px;
	}

	/*
	 * Mobile More is intentionally icon-only. This preserves a proper touch
	 * target while consuming only ~34px instead of a full text button.
	 */
	.dw-actionbar .dw-actionbar-overflow-trigger {
		width: 34px;
		min-width: 34px;
		padding-left: 8px;
		padding-right: 8px;
	}

	.dw-actionbar .dw-actionbar-overflow-trigger .dw-actionbar-label,
	.dw-actionbar .dw-actionbar-overflow-trigger .dw-actionbar-caret {
		display: none;
	}

	.dw-actionbar-selected-count {
		min-height: 32px;
		padding: 0 3px;
		font-size: 11px;
		line-height: 32px;
	}

	.dw-actionbar-selected-label-full {
		display: none;
	}

	.dw-actionbar-selected-label-short {
		display: inline;
	}

	.dw-actionbar-badge {
		min-width: 15px;
		height: 15px;
		padding: 0 4px;
		font-size: 9px;
		line-height: 15px;
	}

	.dw-actionbar-panel-popup {
		max-width: calc(100vw - 16px);
	}

	.dw-actionbar-panel-popup > .dw-actionbar-panel {
		padding: 10px;
	}

	.dw-actionbar-inline-panel {
		margin-top: 5px;
		padding: 10px;
	}

	.dw-actionbar-popup {
		max-width: calc(100vw - 16px);
	}

	.dw-actionbar-popup .dw-actionbar-menu-item {
		min-height: 34px;
		padding: 7px 9px;
	}
}