/**
 * Shared segmented tabs + order/sort lists for Blockora Morph admin.
 * Matches the branded Gutenberg inspector controls.
 */

.joc-blockora-morph-app .bm-seg-tabs {
	display: grid;
	gap: 4px;
	margin: 0 0 1rem;
	padding: 4px;
	border-radius: 12px;
	background: var(--bm-color-surface-container, #eaedff);
	border: 1px solid color-mix(in srgb, var(--bm-color-outline-variant, #c7c4d8) 70%, transparent);
}

.joc-blockora-morph-app .bm-seg-tabs--2 {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.joc-blockora-morph-app .bm-seg-tabs--3 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.joc-blockora-morph-app .bm-seg-tabs--auto {
	grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
}

/* Inline with page actions (Browse library, etc.) */
.joc-blockora-morph-app .bm-seg-tabs--toolbar {
	margin: 0;
	flex-shrink: 0;
	align-self: center;
}

.joc-blockora-morph-app .bm-seg-tab,
.joc-blockora-morph-app .bm-editor-tab {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 6px !important;
	min-height: 36px !important;
	margin: 0 !important;
	padding: 8px 10px !important;
	border: 0 !important;
	border-radius: 9px !important;
	background: transparent !important;
	color: var(--bm-color-on-surface-variant, #464555) !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	line-height: 1.2 !important;
	cursor: pointer;
	box-shadow: none !important;
	transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

.joc-blockora-morph-app .bm-seg-tab .dashicons,
.joc-blockora-morph-app .bm-editor-tab .dashicons {
	width: 16px;
	height: 16px;
	font-size: 16px;
	line-height: 1;
	opacity: 0.85;
}

.joc-blockora-morph-app .bm-seg-tab:hover,
.joc-blockora-morph-app .bm-editor-tab:hover {
	color: var(--bm-color-on-surface, #131b2e) !important;
	background: color-mix(in srgb, #fff 55%, transparent) !important;
}

.joc-blockora-morph-app .bm-seg-tab.is-active,
.joc-blockora-morph-app .bm-editor-tab.is-active {
	background: var(--bm-color-primary, #3525cd) !important;
	color: var(--bm-color-on-primary, #fff) !important;
	box-shadow: 0 4px 12px color-mix(in srgb, var(--bm-color-primary, #3525cd) 28%, transparent) !important;
}

.joc-blockora-morph-app .bm-seg-tab.is-active .dashicons,
.joc-blockora-morph-app .bm-editor-tab.is-active .dashicons {
	opacity: 1;
}

/* Editor panel tabs use the same segmented look */
.joc-blockora-morph-app .bm-editor-panel__tabs {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
	gap: 4px;
	margin: 0.75rem 0.85rem 0;
	padding: 4px;
	border-radius: 12px;
	background: var(--bm-color-surface-container, #eaedff);
	border: 1px solid color-mix(in srgb, var(--bm-color-outline-variant, #c7c4d8) 70%, transparent);
	flex-shrink: 0;
}
