/*
 * Marketplace Core: My Account → Messages, the case page and the "Get help" links on the order
 * page (theme independent, mobile first). Loaded only on the account pages.
 */
.bmp-cases {
	margin: 0;
	padding: 0;
	list-style: none;
}
.bmp-cases__item {
	margin: 0 0 0.75em;
}
.bmp-cases__link {
	display: block;
	padding: 0.75em 1em;
	border: 1px solid rgba(0, 0, 0, 0.15);
	border-radius: 8px;
	color: inherit;
	text-decoration: none;
}
.bmp-cases__link:hover,
.bmp-cases__link:focus-visible {
	border-color: currentColor;
}
.bmp-cases__title {
	display: block;
	font-weight: 600;
	overflow-wrap: anywhere;
}
.bmp-cases__state,
.bmp-case__state {
	display: inline-block;
	margin: 0.25em 0 0;
	font-size: 0.9em;
	font-weight: 600;
}
.bmp-cases__state--you,
.bmp-case__state--you {
	color: #8a5a00;
}
.bmp-cases__state--done,
.bmp-case__state--done {
	color: #127a3e;
}
.bmp-cases__preview,
.bmp-cases__meta {
	display: block;
	overflow: hidden;
	font-size: 0.9em;
	opacity: 0.8;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.bmp-case__title {
	margin: 0.25em 0;
	overflow-wrap: anywhere;
}
.bmp-case__meta,
.bmp-case__helping {
	margin: 0 0 0.25em;
	font-size: 0.9em;
}
.bmp-case__notice {
	padding: 0.75em 1em;
	border-left: 4px solid #8a5a00;
	background: rgba(138, 90, 0, 0.08);
}
.bmp-thread {
	margin: 1em 0;
	padding: 0;
	list-style: none;
}
.bmp-msg {
	margin: 0 0 0.75em;
	padding: 0.75em 1em;
	border: 1px solid rgba(0, 0, 0, 0.15);
	border-radius: 10px;
}
.bmp-msg--you {
	margin-left: 1.5em;
	background: rgba(0, 87, 184, 0.06);
}
.bmp-msg--private {
	border-style: dashed;
}
.bmp-msg--event {
	padding: 0.25em 1em;
	border: 0;
	font-size: 0.85em;
	opacity: 0.75;
	text-align: center;
}
.bmp-msg p {
	margin: 0;
}
.bmp-msg__head {
	margin: 0 0 0.25em !important;
	font-size: 0.9em;
}
.bmp-msg__body {
	overflow-wrap: anywhere;
}
.bmp-msg__time {
	opacity: 0.7;
}
.bmp-msg__tag {
	display: inline-block;
	padding: 0 0.4em;
	border-radius: 4px;
	background: rgba(0, 0, 0, 0.06);
	font-size: 0.85em;
}
.bmp-msg__state {
	font-size: 0.85em;
	font-style: italic;
}
.bmp-proposal,
.bmp-feedback {
	margin: 1em 0;
	padding: 1em;
	border: 2px solid #8a5a00;
	border-radius: 8px;
}
.bmp-proposal p,
.bmp-feedback p {
	margin: 0 0 0.5em;
}
.bmp-feedback form,
.bmp-proposal .bmp-case-form--accept,
.bmp-proposal .bmp-case-form--delay {
	display: inline-block;
	margin: 0 0.5em 0.5em 0;
}
.bmp-case-form--slot fieldset {
	margin: 0 0 0.5em;
	padding: 0;
	border: 0;
}
.bmp-case-form--slot .form-row {
	margin: 0;
}
.bmp-case-form--slot label {
	display: flex;
	gap: 0.5em;
	align-items: center;
	min-height: 44px;
}
.bmp-reply,
.bmp-step-in,
.bmp-help {
	margin: 1.5em 0;
}
.bmp-case-form textarea,
.bmp-case-form select {
	width: 100%;
}
.bmp-case-form__hint,
.bmp-help-link {
	font-size: 0.9em;
}
.bmp-help-link {
	margin: 0.25em 0 0;
}
@media (forced-colors: active) {
	.bmp-msg,
	.bmp-proposal,
	.bmp-feedback,
	.bmp-cases__link {
		border: 1px solid CanvasText;
	}
}
/* Photos and PDFs on messages (Phase 14); thumbnails carry their size, so nothing shifts. */
.bmp-files {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5em;
	margin: 0.5em 0 0;
	padding: 0;
	list-style: none;
}
.bmp-files__item {
	display: flex;
	flex-direction: column;
	gap: 0.15em;
	max-width: 176px;
	margin: 0;
	font-size: 0.85em;
	overflow-wrap: anywhere;
}
.bmp-files__item--pdf,
.bmp-files__item--checking,
.bmp-files__item--removed {
	flex-direction: row;
	flex-wrap: wrap;
	gap: 0.25em 0.5em;
	max-width: 100%;
}
.bmp-files__open {
	display: flex;
	flex-direction: column;
	gap: 0.25em;
	color: inherit;
}
.bmp-files__open img {
	display: block;
	max-width: 160px;
	height: auto;
	border: 1px solid rgba(0, 0, 0, 0.15);
	border-radius: 6px;
}
.bmp-files__name {
	font-weight: 600;
}
.bmp-files__note {
	opacity: 0.75;
}
.bmp-files__item--removed .bmp-files__name {
	text-decoration: line-through;
}
.bmp-attach input[type="file"] {
	display: block;
	max-width: 100%;
	margin: 0.25em 0;
}
.bmp-attach__hint {
	display: block;
	opacity: 0.75;
}

/* The help flow (Phase 16, ADR-0060): large options without script, at least 44 px each. */
.bmp-help__title {
	margin: 0.25em 0;
}
.bmp-help__about,
.bmp-help__back {
	margin: 0 0 0.75em;
	font-size: 0.9em;
}
.bmp-help__what {
	margin: 1em 0 0.5em;
	font-size: 1.1em;
}
.bmp-help-options {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(9.5em, 1fr));
	gap: 0.5em;
	margin: 0 0 1em;
	padding: 0;
	list-style: none;
}
.bmp-help-options--list {
	grid-template-columns: 1fr;
}
.bmp-help-option {
	display: flex;
	gap: 0.6em;
	align-items: center;
	min-height: 44px;
	padding: 0.75em 1em;
	border: 1px solid rgba(0, 0, 0, 0.2);
	border-radius: 8px;
	color: inherit;
	font-weight: 600;
	text-decoration: none;
}
.bmp-help-option:hover,
.bmp-help-option:focus-visible {
	border-color: currentColor;
}
.bmp-help-option__icon {
	flex: none;
}
.bmp-help-answer {
	margin: 0 0 1em;
	padding: 0.75em 1em;
	border-left: 4px solid #127a3e;
	background: rgba(18, 122, 62, 0.06);
}
.bmp-help-answer__go {
	min-height: 44px;
}
.bmp-help-parcels,
.bmp-help-refunds {
	margin: 0 0 0.75em 1.25em;
}
.bmp-help__more a {
	display: inline-block;
	min-height: 44px;
	padding: 0.6em 0;
}
.bmp-help-question label {
	display: inline-flex;
	gap: 0.4em;
	align-items: center;
	min-height: 44px;
	margin-right: 1.25em;
}
/* The buttons of our forms on the customer's pages: at least 44 px high whatever the theme makes of
   ".button" (WCAG 2.5.8 asks for 24 px; fingers need more). */
.bmp-case-form .button,
.bmp-address-cancel .button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
}
/* "Questions about this order?": the help button and the links beside it stay apart and wrap on a
   phone instead of running together in one line. */
.bmp-help__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5em 1.25em;
	align-items: center;
}
.bmp-help__actions .button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
}

/* The notices about an order (an incident that affects it, ADR-0064): first on the page, dark on
   light amber, never colour alone (the title says it). */
.bmp-order-notices {
	margin: 0 0 1.25em;
	padding: 0.75em 1em;
	border-left: 4px solid #8a5a00;
	border-radius: 4px;
	background: #fff8e6;
	color: #1d2327;
	line-height: 1.5;
}
.bmp-order-notices p {
	margin: 0 0 0.35em;
}
.bmp-order-notices p:last-child {
	margin-bottom: 0;
}
.bmp-order-notices__title {
	font-weight: 700;
}
@media (forced-colors: active) {
	.bmp-order-notices {
		border: 1px solid CanvasText;
		border-left-width: 4px;
	}
}