/*!
Copyright 2023 Adobe. All rights reserved.
This file is licensed to you under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License. You may obtain a copy
of the License at http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software distributed under
the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
OF ANY KIND, either express or implied. See the License for the specific language
governing permissions and limitations under the License.
*/

.spectrum{
  --system-spectrum-infieldbutton-spectrum-infield-button-border-width:var(--spectrum-border-width-100);
  --system-spectrum-infieldbutton-spectrum-infield-button-border-color:inherit;
  --system-spectrum-infieldbutton-spectrum-infield-button-border-radius:var(--spectrum-corner-radius-100);
  --system-spectrum-infieldbutton-spectrum-infield-button-border-radius-reset:0;
  --system-spectrum-infieldbutton-spectrum-infield-button-stacked-top-border-radius-start-start:var(--spectrum-infield-button-border-radius-reset);
  --system-spectrum-infieldbutton-spectrum-infield-button-stacked-bottom-border-radius-end-start:var(--spectrum-infield-button-border-radius-reset);
  --system-spectrum-infieldbutton-spectrum-infield-button-background-color:var(--spectrum-gray-75);
  --system-spectrum-infieldbutton-spectrum-infield-button-background-color-hover:var(--spectrum-gray-200);
  --system-spectrum-infieldbutton-spectrum-infield-button-background-color-down:var(--spectrum-gray-300);
  --system-spectrum-infieldbutton-spectrum-infield-button-background-color-key-focus:var(--spectrum-gray-200);
}

.spectrum--express{
  --system-spectrum-infieldbutton-spectrum-infield-button-border-width:0;
  --system-spectrum-infieldbutton-spectrum-infield-button-border-color:transparent;
  --system-spectrum-infieldbutton-spectrum-infield-button-border-radius:var(--spectrum-corner-radius-75);
  --system-spectrum-infieldbutton-spectrum-infield-button-border-radius-reset:var(--spectrum-corner-radius-75);
  --system-spectrum-infieldbutton-spectrum-infield-button-stacked-top-border-radius-start-start:var(--spectrum-corner-radius-75);
  --system-spectrum-infieldbutton-spectrum-infield-button-stacked-bottom-border-radius-end-start:var(--spectrum-corner-radius-75);
  --system-spectrum-infieldbutton-spectrum-infield-button-background-color:var(--spectrum-gray-200);
  --system-spectrum-infieldbutton-spectrum-infield-button-background-color-hover:var(--spectrum-gray-300);
  --system-spectrum-infieldbutton-spectrum-infield-button-background-color-down:var(--spectrum-gray-400);
  --system-spectrum-infieldbutton-spectrum-infield-button-background-color-key-focus:var(--spectrum-gray-300);
}

.spectrum-InfieldButton{
	--spectrum-infield-button-height:var(--spectrum-component-height-100);
	--spectrum-infield-button-width:var(--spectrum-component-height-100);
	--spectrum-infield-button-stacked-border-radius-reset:var(--spectrum-in-field-button-fill-stacked-inner-border-rounding);

	--spectrum-infield-button-edge-to-fill:var(
		--spectrum-in-field-button-edge-to-fill
	);
	--spectrum-infield-button-inner-edge-to-fill:var(
		--spectrum-in-field-button-stacked-inner-edge-to-fill
	);
	--spectrum-infield-button-fill-padding:0px;
	--spectrum-infield-button-stacked-fill-padding-inline:var(--spectrum-in-field-button-edge-to-disclosure-icon-stacked-medium);
	--spectrum-infield-button-stacked-fill-padding-outer:var(--spectrum-in-field-button-outer-edge-to-disclosure-icon-stacked-medium);
	--spectrum-infield-button-stacked-fill-padding-inner:var(--spectrum-in-field-button-inner-edge-to-disclosure-icon-stacked-medium);

	--spectrum-infield-button-animation-duration:var(
		--spectrum-animation-duration-100
	);

	--spectrum-infield-button-icon-color:var(
		--spectrum-neutral-content-color-default
	);
	--spectrum-infield-button-icon-color-hover:var(
		--spectrum-neutral-content-color-hover
	);
	--spectrum-infield-button-icon-color-down:var(
		--spectrum-neutral-content-color-down
	);
	--spectrum-infield-button-icon-color-key-focus:var(
		--spectrum-neutral-content-color-key-focus
	);

	--spectrum-infield-button-fill-justify-content:center;
}

.spectrum-InfieldButton:disabled,
.spectrum-InfieldButton.is-disabled{
		--mod-infield-button-background-color:var(
			--mod-infield-button-background-color-disabled,
			var(--spectrum-disabled-background-color)
		);
		--mod-infield-button-background-color-hover:var(
			--mod-infield-button-background-color-hover-disabled,
			var(--spectrum-disabled-background-color)
		);
		--mod-infield-button-background-color-down:var(
			--mod-infield-button-background-color-down-disabled,
			var(--spectrum-disabled-background-color)
		);
		--mod-infield-button-border-color:var(
			--mod-infield-button-border-color-disabled,
			var(--spectrum-disabled-background-color)
		);

		--mod-infield-button-icon-color:var(
			--mod-infield-button-icon-color-disabled,
			var(--spectrum-disabled-content-color)
		);
		--mod-infield-button-icon-color-hover:var(
			--mod-infield-button-icon-color-hover-disabled,
			var(--spectrum-disabled-content-color)
		);
		--mod-infield-button-icon-color-down:var(
			--mod-infield-button-icon-color-down-disabled,
			var(--spectrum-disabled-content-color)
		);
		--mod-infield-button-icon-color-key-focus:var(
			--mod-infield-button-icon-color-key-focus-disabled,
			var(--spectrum-disabled-content-color)
		);
	}

.spectrum-InfieldButton.spectrum-InfieldButton--sizeS{
		--spectrum-infield-button-height:var(--spectrum-component-height-75);
		--spectrum-infield-button-width:var(--spectrum-component-height-75);
		--spectrum-infield-button-stacked-fill-padding-inline:var(--spectrum-in-field-button-edge-to-disclosure-icon-stacked-small);
		--spectrum-infield-button-stacked-fill-padding-outer:var(--spectrum-in-field-button-outer-edge-to-disclosure-icon-stacked-small);
		--spectrum-infield-button-stacked-fill-padding-inner:var(--spectrum-in-field-button-inner-edge-to-disclosure-icon-stacked-small);

	}

.spectrum-InfieldButton.spectrum-InfieldButton--sizeL{
		--spectrum-infield-button-height:var(--spectrum-component-height-200);
		--spectrum-infield-button-width:var(--spectrum-component-height-200);
		--spectrum-infield-button-stacked-fill-padding-inline:var(--spectrum-in-field-button-edge-to-disclosure-icon-stacked-large);
		--spectrum-infield-button-stacked-fill-padding-outer:var(--spectrum-in-field-button-outer-edge-to-disclosure-icon-stacked-large);
		--spectrum-infield-button-stacked-fill-padding-inner:var(--spectrum-in-field-button-inner-edge-to-disclosure-icon-stacked-large);

	}

.spectrum-InfieldButton.spectrum-InfieldButton--sizeXL{
		--spectrum-infield-button-height:var(--spectrum-component-height-300);
		--spectrum-infield-button-width:var(--spectrum-component-height-300);
		--spectrum-infield-button-stacked-fill-padding-inline:var(--spectrum-in-field-button-edge-to-disclosure-icon-stacked-extra-large);
		--spectrum-infield-button-stacked-fill-padding-outer:var(--spectrum-in-field-button-outer-edge-to-disclosure-icon-stacked-extra-large);
		--spectrum-infield-button-stacked-fill-padding-inner:var(--spectrum-in-field-button-inner-edge-to-disclosure-icon-stacked-extra-large);

	}

.spectrum-InfieldButton.spectrum-InfieldButton--top, .spectrum-InfieldButton.spectrum-InfieldButton--bottom{
		--mod-infield-button-width:var(
			--mod-infield-button-width-stacked,
			var(--spectrum-in-field-button-width-stacked-medium)
		);
	}

.spectrum-InfieldButton.spectrum-InfieldButton--top.spectrum-InfieldButton--sizeS, .spectrum-InfieldButton.spectrum-InfieldButton--bottom.spectrum-InfieldButton--sizeS{
			--mod-infield-button-width:var(
				--mod-infield-button-width-stacked,
				var(--spectrum-in-field-button-width-stacked-small)
			);
		}

.spectrum-InfieldButton.spectrum-InfieldButton--top.spectrum-InfieldButton--sizeL, .spectrum-InfieldButton.spectrum-InfieldButton--bottom.spectrum-InfieldButton--sizeL{
			--mod-infield-button-width:var(
				--mod-infield-button-width-stacked,
				var(--spectrum-in-field-button-width-stacked-large)
			);
		}

.spectrum-InfieldButton.spectrum-InfieldButton--top.spectrum-InfieldButton--sizeXL, .spectrum-InfieldButton.spectrum-InfieldButton--bottom.spectrum-InfieldButton--sizeXL{
			--mod-infield-button-width:var(
				--mod-infield-button-width-stacked,
				var(--spectrum-in-field-button-width-stacked-extra-large)
			);
		}

.spectrum-InfieldButton.spectrum-InfieldButton--quiet{
		--mod-infield-button-background-color:var(
			--mod-infield-button-background-color-quiet,
			transparent
		);
		--mod-infield-button-background-color-hover:var(
			--mod-infield-button-background-color-hover-quiet,
			transparent
		);
		--mod-infield-button-background-color-down:var(
			--mod-infield-button-background-color-down-quiet,
			transparent
		);
		--mod-infield-button-background-color-key-focus:var(
			--mod-infield-button-background-color-key-focus-quiet,
			transparent
		);

		--mod-infield-border-color:var(
			--mod-infield-border-color-quiet,
			transparent
		);
		--mod-infield-button-border-width:var(
			--mod-infield-button-border-width-quiet,
			0
		);
	}

.spectrum-InfieldButton.spectrum-InfieldButton--quiet:disabled,
.spectrum-InfieldButton.spectrum-InfieldButton--quiet.is-disabled{
			--mod-infield-button-background-color:var(
				--mod-infield-button-background-color-quiet-disabled,
				transparent
			);
			--mod-infield-button-border-color:var(
				--mod-infield-button-border-color-quiet-disabled,
				transparent
			);
		}

@media (forced-colors: active){

.spectrum-InfieldButton:active:not(:disabled), .spectrum-InfieldButton:focus-visible:not(:disabled),
.spectrum-InfieldButton.is-active:not(:disabled),
.spectrum-InfieldButton.is-focus-visible:not(:disabled){
			--highcontrast-infield-button-border-color:Highlight;
	}

@media (hover: hover){

.spectrum-InfieldButton:hover:not(:disabled),
.spectrum-InfieldButton.is-hover:not(:disabled){
			--highcontrast-infield-button-border-color:Highlight;
	}
  }
		}

.spectrum-InfieldButton{
	border-style:none;
	background-color:transparent;
	cursor:pointer;

	display:flex;
	justify-content:center;
	align-items:center;

	block-size:var(
		--mod-infield-button-height,
		var(--spectrum-infield-button-height)
	);
	inline-size:var(
		--mod-infield-button-width,
		var(--spectrum-infield-button-width)
	);

	padding:var(
		--mod-infield-button-edge-to-fill,
		var(--spectrum-infield-button-edge-to-fill)
	);
}

.spectrum-InfieldButton .spectrum-InfieldButton-fill{
		block-size:100%;
		inline-size:100%;

		background-color:var(
			--mod-infield-button-background-color,
			var(--spectrum-infield-button-background-color)
		);

		border-width:var(
			--mod-infield-button-border-width,
			var(--spectrum-infield-button-border-width)
		);
		border-style:solid;
		border-color:var(
			--highcontrast-infield-button-border-color,
			var(--mod-infield-button-border-color,
			var(--spectrum-infield-button-border-color))
		);
		border-end-end-radius:var(
			--mod-infield-button-border-radius,
			var(--spectrum-infield-button-border-radius)
		);
		border-start-end-radius:var(
			--mod-infield-button-border-radius,
			var(--spectrum-infield-button-border-radius)
		);
		border-end-start-radius:var(
			--mod-infield-button-border-radius,
			var(--spectrum-infield-button-border-radius)
		);
		border-start-start-radius:var(
			--mod-infield-button-border-radius,
			var(--spectrum-infield-button-border-radius)
		);

		padding:var(
			--mod-infield-button-fill-padding,
			var(--spectrum-infield-button-fill-padding)
		);
	}

.spectrum-InfieldButton .spectrum-InfieldButton-icon{
		color:var(
			--mod-infield-button-icon-color,
			var(--spectrum-infield-button-icon-color)
		);
	}

.spectrum-InfieldButton.spectrum-InfieldButton--right .spectrum-InfieldButton-fill{
			border-end-start-radius:var(
				--mod-infield-button-border-radius-reset,
				var(--spectrum-infield-button-border-radius-reset)
			);
			border-start-start-radius:var(
				--mod-infield-button-border-radius-reset,
				var(--spectrum-infield-button-border-radius-reset)
			);
		}

.spectrum-InfieldButton.spectrum-InfieldButton--left .spectrum-InfieldButton-fill{
			border-end-end-radius:var(
				--mod-infield-button-border-radius-reset,
				var(--spectrum-infield-button-border-radius-reset)
			);
			border-start-end-radius:var(
				--mod-infield-button-border-radius-reset,
				var(--spectrum-infield-button-border-radius-reset)
			);
		}

.spectrum-InfieldButton:disabled,
.spectrum-InfieldButton.is-disabled{
		cursor:auto;
	}

@media (hover: hover){

.spectrum-InfieldButton:hover .spectrum-InfieldButton-fill,
.spectrum-InfieldButton.is-hover .spectrum-InfieldButton-fill{
			background-color:var(
				--mod-infield-button-background-color-hover,
				var(--spectrum-infield-button-background-color-hover)
			);
		}

.spectrum-InfieldButton:hover .spectrum-InfieldButton-icon,
.spectrum-InfieldButton.is-hover .spectrum-InfieldButton-icon{
			color:var(
				--mod-infield-button-icon-color-hover,
				var(--spectrum-infield-button-icon-color-hover)
			);
		}
}

.spectrum-InfieldButton:active .spectrum-InfieldButton-fill,
.spectrum-InfieldButton.is-active .spectrum-InfieldButton-fill{
			background-color:var(
				--mod-infield-button-background-color-down,
				var(--spectrum-infield-button-background-color-down)
			);
		}

.spectrum-InfieldButton:active .spectrum-InfieldButton-icon,
.spectrum-InfieldButton.is-active .spectrum-InfieldButton-icon{
			color:var(
				--mod-infield-button-icon-color-down,
				var(--spectrum-infield-button-icon-color-down)
			);
		}

.spectrum-InfieldButton:focus-visible,
.spectrum-InfieldButton.is-focus-visible{
		outline:none;
	}

.spectrum-InfieldButton:focus-visible .spectrum-InfieldButton-fill,
.spectrum-InfieldButton.is-focus-visible .spectrum-InfieldButton-fill{
			background-color:var(
				--mod-infield-button-background-color-key-focus,
				var(--spectrum-infield-button-background-color-key-focus)
			);
		}

.spectrum-InfieldButton:focus-visible .spectrum-InfieldButton-icon,
.spectrum-InfieldButton.is-focus-visible .spectrum-InfieldButton-icon{
			color:var(
				--mod-infield-button-icon-color-key-focus,
				var(--spectrum-infield-button-icon-color-key-focus)
			);
		}

.spectrum-InfieldButton-fill{
  display:flex;
  align-items:center;
  justify-content:var(
		--mod-infield-button-fill-justify-content,
		var(--spectrum-infield-button-fill-justify-content)
	);

  transition:border-color var(--spectrum-global-animation-duration-100) ease-in-out;
}

.spectrum-InfieldButton--top, .spectrum-InfieldButton--bottom{
	block-size:calc(
		var(--mod-infield-button-height, var(--spectrum-infield-button-height)) / 2
	);
}

.spectrum-InfieldButton--top .spectrum-InfieldButton-fill, .spectrum-InfieldButton--bottom .spectrum-InfieldButton-fill{
		box-sizing:border-box;
		padding-inline-start:calc(var(--mod-infield-button-stacked-fill-padding-inline, var(--spectrum-infield-button-stacked-fill-padding-inline)) - var(--mod-infield-button-edge-to-fill, var(--spectrum-infield-button-edge-to-fill)) - var(--mod-infield-button-border-width, var(--spectrum-infield-button-border-width)));
		padding-inline-end:calc(var(--mod-infield-button-stacked-fill-padding-inline, var(--spectrum-infield-button-stacked-fill-padding-inline)) - var(--mod-infield-button-edge-to-fill, var(--spectrum-infield-button-edge-to-fill)) - var(--mod-infield-button-border-width, var(--spectrum-infield-button-border-width)));
	}

.spectrum-InfieldButton--top{
	padding-block-end:var(
		--mod-infield-button-inner-edge-to-fill,
		var(--spectrum-infield-button-inner-edge-to-fill)
	);
}

.spectrum-InfieldButton--top .spectrum-InfieldButton-fill{
		padding-block-start:calc(var(--mod-infield-button-stacked-fill-padding-outer, var(--spectrum-infield-button-stacked-fill-padding-outer)) - var(--mod-infield-button-edge-to-fill, var(--spectrum-infield-button-edge-to-fill)) - var(--mod-infield-button-border-width, var(--spectrum-infield-button-border-width)));
		padding-block-end:calc(var(--mod-infield-button-stacked-fill-padding-inner, var(--spectrum-infield-button-stacked-fill-padding-inner)) - var(--mod-infield-button-inner-edge-to-fill, var(--spectrum-infield-button-inner-edge-to-fill)));
		border-block-end:none;
		border-start-start-radius:var(
			--mod-infield-button-stacked-top-border-radius-start-start,
			var(--spectrum-infield-button-stacked-top-border-radius-start-start)
		);
		border-end-start-radius:var(
			--mod-infield-button-stacked-border-radius-reset,
			var(--spectrum-infield-button-stacked-border-radius-reset)
		);
		border-end-end-radius:var(
			--mod-infield-button-stacked-border-radius-reset,
			var(--spectrum-infield-button-stacked-border-radius-reset)
		);
	}

.spectrum-InfieldButton--bottom{
	padding-block-start:var(
		--mod-infield-button-inner-edge-to-fill,
		var(--spectrum-infield-button-inner-edge-to-fill)
	);
}

.spectrum-InfieldButton--bottom .spectrum-InfieldButton-fill{
		padding-block-start:calc(var(--mod-infield-button-stacked-fill-padding-inner, var(--spectrum-infield-button-stacked-fill-padding-inner)) - var(--mod-infield-button-edge-to-fill, var(--spectrum-infield-button-edge-to-fill)) - var(--mod-infield-button-border-width, var(--spectrum-infield-button-border-width)));
		padding-block-end:calc(var(--mod-infield-button-stacked-fill-padding-outer, var(--spectrum-infield-button-stacked-fill-padding-outer)) - var(--mod-infield-button-inner-edge-to-fill, var(--spectrum-infield-button-inner-edge-to-fill)) - var(--mod-infield-button-border-width, var(--spectrum-infield-button-border-width)));
		border-end-start-radius:var(
			--mod-infield-button-stacked-bottom-border-radius-end-start,
			var(--spectrum-infield-button-stacked-bottom-border-radius-end-start)
		);
		border-start-start-radius:var(
			--mod-infield-button-stacked-border-radius-reset,
			var(--spectrum-infield-button-stacked-border-radius-reset)
		);
		border-start-end-radius:var(
			--mod-infield-button-stacked-border-radius-reset,
			var(--spectrum-infield-button-stacked-border-radius-reset)
		);
		border-end-end-radius:var(
			--mod-infield-button-stacked-bottom-border-radius-end-end,
			var(--mod-infield-button-border-radius, var(--spectrum-infield-button-border-radius))
		);
		border-block-end-width:var(
			--mod-infield-button-stacked-bottom-border-block-end-width,
			var(--mod-infield-button-border-width, var(--spectrum-infield-button-border-width))
		);
	}

.spectrum-InfieldButton-icon{
	display:initial;
	flex-shrink:0;
	margin:0 !important;
}

.spectrum-InfieldButton{
  --spectrum-infield-button-border-width:var(--system-spectrum-infieldbutton-spectrum-infield-button-border-width);
  --spectrum-infield-button-border-color:var(--system-spectrum-infieldbutton-spectrum-infield-button-border-color);
  --spectrum-infield-button-border-radius:var(--system-spectrum-infieldbutton-spectrum-infield-button-border-radius);
  --spectrum-infield-button-border-radius-reset:var(--system-spectrum-infieldbutton-spectrum-infield-button-border-radius-reset);
  --spectrum-infield-button-stacked-top-border-radius-start-start:var(--system-spectrum-infieldbutton-spectrum-infield-button-stacked-top-border-radius-start-start);
  --spectrum-infield-button-stacked-bottom-border-radius-end-start:var(--system-spectrum-infieldbutton-spectrum-infield-button-stacked-bottom-border-radius-end-start);
  --spectrum-infield-button-background-color:var(--system-spectrum-infieldbutton-spectrum-infield-button-background-color);
  --spectrum-infield-button-background-color-hover:var(--system-spectrum-infieldbutton-spectrum-infield-button-background-color-hover);
  --spectrum-infield-button-background-color-down:var(--system-spectrum-infieldbutton-spectrum-infield-button-background-color-down);
  --spectrum-infield-button-background-color-key-focus:var(--system-spectrum-infieldbutton-spectrum-infield-button-background-color-key-focus);
}
