tags-input .tags .tag-item {
	color: #fff;
	background: #428bca;
	border: 1px solid #357ebd;
	border-radius: 2px;	
}

.table.top-alligned > tbody > tr > td {
	vertical-align: top;
}

.splash-container-sign {
	margin: 50px auto;
}

/* --- Left navigation search -------------------------------------------------
   Filters the navigation tree down to a flat list of matching destinations,
   each shown with the path it lives under.

   The results list deliberately does NOT carry the .sidebar-elements class.
   The p4Menu directive binds its accordion globally by selector -
   $(".sidebar-elements").on("click", "li a", ...) - so anything with that class
   gets slideDown/slideUp applied to it on click. Keeping the results out of
   that selector is what stops the search and the accordion fighting.
   Colours follow the existing sidebar: #FFFFFF ground, dimgray links,
   #f0f0f0 hover. */
.p4-menu-search {
	position: relative;
	padding: 10px 12px 6px;
}

.p4-menu-search__input.form-control {
	height: 32px;
	padding-left: 30px;
	padding-right: 26px;
	font-size: 13px;
}

.p4-menu-search__icon {
	position: absolute;
	left: 22px;
	top: 19px;
	font-size: 12px;
	color: #b0b0b0;
	pointer-events: none;
}

.p4-menu-search__clear {
	position: absolute;
	right: 21px;
	top: 17px;
	font-size: 13px;
	color: #b0b0b0;
}

.p4-menu-search__clear:hover {
	color: #404040;
}

.p4-menu-search__results {
	margin: 0;
	padding: 0;
	list-style: none;
}

.p4-menu-search__results > li > a {
	display: block;
	padding: 7px 12px 7px 14px;
	line-height: 1.25;
	color: dimgray;
	text-decoration: none;
}

.p4-menu-search__results > li > a:hover {
	background-color: #f0f0f0;
	color: #3d3d3d;
}

.p4-menu-search__results .icon {
	width: 20px;
	margin-right: 6px;
	text-align: center;
}

.p4-menu-search__path {
	display: block;
	margin-left: 26px;
	font-size: 11px;
	color: #b0b0b0;
}

.p4-menu-search__empty {
	padding: 10px 14px;
	font-size: 12px;
	color: #b0b0b0;
}
/* ---------------------------------------------------------------------------
   Pick ticket details - match the Bin details layout.

   Bin details groups its fields with plain headings inside a card, and shows
   read-only values as text. Pick ticket details instead nested bordered
   .p4-section fieldsets inside the card - boxes within a box, each with an
   inset legend floating over the border - and rendered every read-only value
   as a filled grey input. That reads as far busier than the same information
   on the Bin screen.

   Scoped to .page--pick-ticket-details so no other screen using .p4-section
   changes. Structural markup is untouched: the collapse behaviour, the
   p4-collapsed directive and every field stay exactly as they were.
   --------------------------------------------------------------------------- */

.page--pick-ticket-details .p4-section {
	border: none;
	border-radius: 0;
	padding: 0;
	margin-bottom: 28px;
}

/* The title was absolutely positioned over the (now removed) border. Put it
   back in flow as a real section heading, sized to match .card-header. */
.page--pick-ticket-details .p4-section > .p4-section-title {
	position: static;
	display: block;
	font-size: 18px;
	font-weight: 400;
	color: #333;
	background: transparent;
	padding: 0 0 10px;
	margin: 0 0 18px;
	border-bottom: 1px solid #e6e6e6;
}

/* Chevron sat at top:-7px to straddle the old border; align it to the heading. */
.page--pick-ticket-details .p4-section > .p4-section__show-hide-button {
	top: 0;
	right: 0;
	padding: 0;
	color: #b0b0b0;
}

/* The base rule fixes collapsed sections at height:3em, which assumed the
   title was out of flow. With the title in flow that clips it. */
.page--pick-ticket-details .p4-section.collapsed {
	height: auto;
	margin-bottom: 18px;
}

.page--pick-ticket-details .p4-section.collapsed > .p4-section-title {
	top: auto;
	margin-bottom: 0;
	padding-bottom: 0;
	border-bottom: none;
}

.page--pick-ticket-details .p4-section.collapsed > .p4-section__show-hide-button {
	top: 0;
}

/* Read-only fields keep their box but fill off-white, so what's editable (white)
   reads at a glance. Covers the closed-order Comments html view too. */
.page--pick-ticket-details .form-control[readonly] {
	background-color: #f8f9fa;
	border-color: #e5e6e8;
	box-shadow: none;
	color: #333;
}

/* Give the label/value rows the same vertical rhythm as the Bin screen. */
.page--pick-ticket-details .form-group.row {
	margin-bottom: 0.5rem;
}

.page--pick-ticket-details .col-form-label {
	color: #707070;
}

/* Closed-order comments render ERP html - let the box grow with the content. */
.page--pick-ticket-details .comments-readonly {
	height: auto;
	min-height: 2.4rem;
}

/* Quantities are typed, not nudged: hide the browser spin buttons on every numeric input
   (order grids, receiving, returns, production, handheld web screens). */
input[type="number"] {
	-moz-appearance: textfield;
	appearance: textfield;
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}