fix(ui5-select): correct dropdown button height

[NakataCode]

The dropdown button height was set to calc(100% - 0.0625rem) in sap_horizon and sap_horizon_dark themes, causing a 1px vertical misalignment with the input field. According to the Input with Button (Horizon) spec, the button height should match the field height exactly (2.25rem cozy, 1.625rem compact). Set --_ui5_select_icon_wrapper_height and --_ui5_select_icon_wrapper_state_height to 100% to align with the specification.

Additionally, the field's bottom border (inset box-shadow) was covered by the dropdown button's hover background. Per spec, the field's underline must appear on top of the button in all states. Fixed by drawing the bottom border as a background-image gradient on the select root element, spanning the full width including under the button, and setting the button hover background to transparent so the gradient remains visible.

Fixes: #13306

[ui5-webcomponents-bot]

🚀 Deployed on https://pr-13408--ui5-webcomponents-preview.netlify.app

[kgogov]

Code review

Found 1 issue:

1. Icon button bottom border overlaps with the popover — when the dropdown opens, the bottom border of the select field (including the icon button area) visually overlaps with the top edge of the popover. The popover should be offset by 1px (var(--sapField_BorderWidth)) so the field's bottom border remains visible and the two elements do not bleed into each other.

webcomponents/packages/main/src/SelectPopoverTemplate.tsx

Lines 12 to 30 in 10e6682

	<>
	{this.options.length > 0 &&
	<ResponsivePopover
	id={this.responsivePopoverId}
	class={{
	"ui5-select-popover": true,
	...this.classes.popover
	}}
	part="popover"
	style={this.styles.responsivePopover}
	placement="Bottom"
	horizontalAlign="Start"
	hideArrow={true}
	preventInitialFocus={true}
	onOpen={this._afterOpen}
	onBeforeOpen={this._beforeOpen}
	onClose={this._afterClose}
	onKeyDown={this._onkeydown}
	accessibleName={this._isPhone ? this._headerTitleText : undefined}

[kgogov]

Web Components:

SAPUI5:

[kgogov]

Code review

Found 1 issue:

1. Hover background no longer fills the full button area in value states (Fiori and other non-Horizon themes) — --_ui5_select_icon_wrapper_state_height is newly added to base/Select-parameters.css with value calc(100% - 0.125rem). Before this PR it was only defined in sap_horizon/sap_horizon_dark; for Fiori 3 and HC themes it was undefined, so the icon button used the full 100% height in value states. After this PR, the button is 2px shorter in value states for all non-Horizon themes, causing the hover background to leave a visible gap at the bottom of the field.

webcomponents/packages/main/src/themes/base/Select-parameters.css

Lines 1 to 8 in 10e6682

	:host {
	--_ui5_select_hover_icon_left_border: 1px solid transparent;
	--_ui5_select_label_color: var(--sapField_TextColor);
	--_ui5_select_icon_width: 2.25rem;
	--_ui5_select_icon_wrapper_height: 100%;
	--_ui5_select_bottom_border_gradient: none;
	--_ui5_select_icon_wrapper_state_height: calc(100% - 0.125rem);
	}

Before:

After: