﻿
.t5-orange-button-full,
.t5-orange-button-full:hover {
	color: white !important;
	width: 100% !important;
	background-color: rgba(234,100,26) !important;
}

.t5-orange-button,
.t5-orange-button:hover {
	color: white !important;
	width: 200px !important;
	background-color: rgba(234,100,26) !important;
}

.t5-orange-button-text,
.t5-orange-button-text:hover {
	color: rgba(234,100,26) !important;
	background-color: transparent !important;
}

/* Mobile attribute/relationship rows: name/value stacked on the left, the optional
   history-clock button on the right. Flex (instead of a float) keeps the clock aligned
   and vertically sane even when a row has no value and would otherwise be shorter than
   the button, which previously let the float spill past the row's bottom divider. */
/* The two DropDownTree pickers at the top of the Edit Entity view. On mobile they
   stack full width (col-12); on desktop they sit side by side at a fixed 400px, which
   replaces the old inline width:400px so the fixed width doesn't leak onto mobile. */
.entity-header-combo {
	width: 100%;
}

@media (min-width: 768px) {
	.entity-header-combo {
		width: 400px;
	}
}

.t5-attr-row {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	/* Breathing room below the row content (esp. the history-clock button on rows with
	   no value) so it isn't flush against the divider; mirrors the space above the row. */
	padding-bottom: 10px;
}

	.t5-attr-main {
		flex: 1 1 auto;
		min-width: 0;
	}

.t5-div-highlight:hover {
	background-color: lightgray;
	color: white;
}

.t5-div-highlight:active {
	background-color: darkgray;
	color: white;
}