.brand-autocomplete {
	position: relative;
}

.brand-suggestions {
	position: absolute;
	top: calc(100% + 4px);
	left: 0;
	right: 0;
	z-index: 1200;
	max-height: 220px;
	overflow-y: auto;
	border: 1px solid var(--bs-border-color, #dee2e6);
	border-radius: 0.375rem;
	background: var(--bs-body-bg, #fff);
	box-shadow: 0 0.375rem 1rem rgba(0, 0, 0, 0.12);
	padding: 0.25rem;
	display: flex;
	flex-direction: column;
	gap: 0.1rem;
}

.brand-suggestion-item {
	display: block;
	width: 100%;
	border: 0;
	border-radius: 0.3rem;
	background: transparent;
	color: var(--bs-body-color, #212529);
	font-size: 0.875rem;
	text-align: left;
	padding: 0.35rem 0.45rem;
	line-height: 1.25;
}

.brand-suggestion-item:hover,
.brand-suggestion-item:focus {
	background: rgba(13, 110, 253, 0.12);
	outline: none;
}

.brand-suggestion-empty {
	padding: 0.4rem 0.45rem;
	font-size: 0.8rem;
	color: var(--bs-secondary-color, #6c757d);
}

.brand-suggestion-group-label {
	font-size: 0.74rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: var(--bs-secondary-color, #6c757d);
	margin-top: 0.15rem;
}

.upload-dropzone-card {
	background: #f6fffb;
	border: 1px solid #2f8f68 !important;
	box-shadow: 0 0 0 1px rgba(47, 143, 104, 0.12);
}

.ecu-file-dropzone {
	border: 2px dashed #1f7a57;
	border-radius: 0.75rem;
	background: #ffffff;
	padding: 1rem;
	cursor: pointer;
	box-shadow: inset 0 0 0 1px rgba(31, 122, 87, 0.18);
	transition: all 0.18s ease;
}

.ecu-file-dropzone:hover,
.ecu-file-dropzone:focus-visible {
	border-color: #0f5132;
	background: #f2fff8;
	box-shadow: inset 0 0 0 1px rgba(15, 81, 50, 0.28), 0 0 0 3px rgba(25, 135, 84, 0.14);
	outline: none;
}

.ecu-file-dropzone.is-dragover {
	border-color: #0b3d26;
	background: #ddf7e9;
	box-shadow: inset 0 0 0 1px rgba(11, 61, 38, 0.28), 0 0 0 4px rgba(25, 135, 84, 0.2);
}

.ecu-file-dropzone.has-file {
	border-style: solid;
	border-color: #0f5132;
	background: #e7f8ef;
}

.ecu-file-dropzone-icon {
	width: 2.1rem;
	height: 2.1rem;
	margin-bottom: 0.35rem;
}

.ecu-file-dropzone-icon svg {
	width: 100%;
	height: 100%;
	stroke: #0c442b;
	stroke-width: 1.6;
	fill: #d3f1e1;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.ecu-file-dropzone-title {
	font-size: 0.95rem;
	font-weight: 700;
	line-height: 1.25;
	color: #0b3d26;
}

.ecu-file-dropzone-subtitle {
	font-size: 0.79rem;
	color: #355648;
	margin-top: 0.2rem;
}

.ecu-file-dropzone-selected {
	margin-top: 0.5rem;
	font-size: 0.82rem;
	font-weight: 700;
	color: #0a3a24;
	word-break: break-word;
}

[data-bs-theme='dark'] .upload-dropzone-card {
	background: #0f1916;
	border-color: #2c7055 !important;
	box-shadow: 0 0 0 1px rgba(44, 112, 85, 0.35);
}

[data-bs-theme='dark'] .ecu-file-dropzone {
	border-color: #3f9a74;
	background: #111f1a;
	box-shadow: inset 0 0 0 1px rgba(63, 154, 116, 0.25);
}

[data-bs-theme='dark'] .ecu-file-dropzone:hover,
[data-bs-theme='dark'] .ecu-file-dropzone:focus-visible {
	border-color: #5ab98f;
	background: #152720;
	box-shadow: inset 0 0 0 1px rgba(90, 185, 143, 0.35), 0 0 0 3px rgba(63, 154, 116, 0.18);
}

[data-bs-theme='dark'] .ecu-file-dropzone.is-dragover {
	border-color: #73cfa7;
	background: #1a3128;
	box-shadow: inset 0 0 0 1px rgba(115, 207, 167, 0.34), 0 0 0 4px rgba(83, 179, 140, 0.24);
}

[data-bs-theme='dark'] .ecu-file-dropzone.has-file {
	border-color: #6cc89f;
	background: #173126;
}

[data-bs-theme='dark'] .ecu-file-dropzone-icon svg {
	stroke: #9fe2c2;
	fill: rgba(108, 200, 159, 0.18);
}

[data-bs-theme='dark'] .ecu-file-dropzone-title {
	color: #d7f3e5;
}

[data-bs-theme='dark'] .ecu-file-dropzone-subtitle {
	color: #98c4b2;
}

[data-bs-theme='dark'] .ecu-file-dropzone-selected {
	color: #bff0d8;
}