/*!
 * Copyright 2024 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.
 */

/*!
 * Copyright 2024 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.
 */

@container style(--system: spectrum) {
	.spectrum-Table {
		--spectrum-table-header-background-color: var(--spectrum-transparent-white-25);
		--spectrum-table-border-color: var(--spectrum-gray-200);
		--spectrum-table-divider-color: var(--spectrum-gray-200);
		--spectrum-table-row-background-color: var(--spectrum-gray-25);
		--spectrum-table-summary-row-background-color: var(--spectrum-gray-100);
		--spectrum-table-section-header-background-color: var(--spectrum-gray-100);
		--spectrum-table-icon-color-focus: var(--spectrum-neutral-subdued-content-color-key-focus);
		--spectrum-table-icon-color-focus-hover: var(--spectrum-neutral-subdued-content-color-hover);
	}

	.spectrum-Table--quiet {
		--spectrum-table-header-background-color: var(--spectrum-transparent-white-25);
		--spectrum-table-row-background-color: var(--spectrum-transparent-white-25);
	}
}

/********* HIGH CONTRAST *********/

@media (forced-colors: active) {

		@supports (color: SelectedItem) {
	.spectrum-Table {
			--highcontrast-table-selected-row-background-color: SelectedItem;
			--highcontrast-table-selected-row-text-color: SelectedItemText;
	}
		}
	.spectrum-Table {
		--highcontrast-table-row-background-color: Canvas;
		--highcontrast-table-row-text-color: CanvasText;
		--highcontrast-table-divider-color: CanvasText;
		--highcontrast-table-border-color: CanvasText;
		--highcontrast-table-icon-color: CanvasText;
		--highcontrast-table-icon-color-focus: Highlight;

		--highcontrast-table-selected-row-background-color: Highlight;
		--highcontrast-table-selected-row-text-color: HighlightText;

		--highcontrast-table-selected-row-background-color-focus: Highlight;
		--highcontrast-table-selected-row-text-color-focus: HighlightText;
		--highcontrast-table-row-background-color-hover: Highlight;
		--highcontrast-table-row-text-color-hover: HighlightText;

		--highcontrast-table-section-header-text-color: Canvas;
		--highcontrast-table-section-header-background-color: CanvasText;

		--highcontrast-table-focus-indicator-color: Highlight;
		--highcontrast-table-transition-duration: 0;
	}

	.spectrum-Table-cell {
		/* Removes unstylable readability backplate. */
		forced-color-adjust: none;
	}
			:is(.spectrum-Table-row:hover,.spectrum-Table-row:focus-visible,.spectrum-Table-row.is-focused) .spectrum-Table-checkbox .spectrum-Checkbox-box::before {
				outline: var(--highcontrast-table-row-text-color-hover) 1px solid;
			}

	.spectrum-Table-row.is-selected, .spectrum-Table-row.is-drop-target, .spectrum-Table-body.is-drop-target .spectrum-Table-row {
		/* Ensure negative offset outline contrasts on top of SelectedItem background. */
		--highcontrast-table-cell-focus-indicator-color: var(--highcontrast-table-selected-row-text-color);
		--highcontrast-table-cell-focus-extra-offset: 1px;
	}

		:is(.spectrum-Table-row.is-selected,.spectrum-Table-row.is-drop-target,.spectrum-Table-body.is-drop-target .spectrum-Table-row) .spectrum-Table-checkbox .spectrum-Checkbox-box::before {
			outline: var(--highcontrast-table-selected-row-text-color) 1px solid;
		}
}

.spectrum-Table {
	--spectrum-table-cell-inline-space: var(--spectrum-table-edge-to-content);

	--spectrum-table-border-radius: var(--spectrum-corner-radius-100);
	--spectrum-table-border-width: var(--spectrum-table-border-divider-width);
	--spectrum-table-outer-border-inline-width: var(--spectrum-table-border-divider-width);

	--spectrum-table-default-vertical-align: top;
	--spectrum-table-header-vertical-align: middle;

	--spectrum-table-header-font-weight: var(--spectrum-bold-font-weight);

	--spectrum-table-row-font-family: var(--spectrum-sans-font-family-stack);
	--spectrum-table-row-font-weight: var(--spectrum-regular-font-weight);
	--spectrum-table-row-font-style: var(--spectrum-default-font-style);
	--spectrum-table-row-line-height: var(--spectrum-line-height-100);

	--spectrum-table-border-color: var(--spectrum-gray-300);
	--spectrum-table-divider-color: var(--spectrum-gray-300);
	--spectrum-table-header-background-color: var(--spectrum-transparent-white-100);
	--spectrum-table-header-text-color: var(--spectrum-body-color);
	--spectrum-table-row-background-color: var(--spectrum-gray-50);
	--spectrum-table-row-text-color: var(--spectrum-neutral-content-color-default);

	/* @todo Refactor or remove these properties once the RGB stripped value is available. */
	--spectrum-table-selected-row-background-color: rgb(var(--spectrum-blue-900-rgb), var(--spectrum-table-selected-row-background-opacity));
	--spectrum-table-selected-row-background-color-non-emphasized: rgb(var(--spectrum-gray-700-rgb), var(--spectrum-table-selected-row-background-opacity-non-emphasized));
	--spectrum-table-row-background-color-hover: rgb(var(--spectrum-gray-900-rgb), var(--spectrum-table-row-hover-opacity));
	--spectrum-table-row-active-color: rgb(var(--spectrum-gray-900-rgb), var(--spectrum-table-row-down-opacity));
	--spectrum-table-selected-row-background-color-focus: rgb(var(--spectrum-blue-900-rgb), var(--spectrum-table-selected-row-background-opacity-hover));
	--spectrum-table-selected-row-background-color-non-emphasized-focus: rgb(var(--spectrum-gray-700-rgb), var(--spectrum-table-selected-row-background-opacity-non-emphasized-hover));

	--spectrum-table-icon-color-default: var(--spectrum-neutral-subdued-content-color-default);
	--spectrum-table-icon-color-hover: var(--spectrum-neutral-subdued-content-color-hover);
	--spectrum-table-icon-color-active: var(--spectrum-neutral-subdued-content-color-down);
	--spectrum-table-icon-color-focus: var(--spectrum-neutral-subdued-content-color-key-focus);
	--spectrum-table-icon-color-focus-hover: var(--spectrum-neutral-subdued-content-color-key-focus);
	--spectrum-table-icon-color-key-focus: var(--spectrum-neutral-subdued-content-color-key-focus);

	--spectrum-table-focus-indicator-thickness: var(--spectrum-focus-indicator-thickness);
	--spectrum-table-focus-indicator-color: var(--spectrum-focus-indicator-color);

	--spectrum-table-drop-zone-background-color: rgb(var(--spectrum-drop-zone-background-color-rgb), var(--spectrum-drop-zone-background-color-opacity));
	--spectrum-table-drop-zone-outline-color: var(--spectrum-accent-visual-color);

	--spectrum-table-transition-duration: var(--spectrum-animation-duration-100);

	/* Summary Row and Section Header Row */
	--spectrum-table-summary-row-font-weight: var(--spectrum-bold-font-weight);
	--spectrum-table-summary-row-background-color: var(--spectrum-gray-200);

	--spectrum-table-section-header-font-weight: var(--spectrum-bold-font-weight);
	--spectrum-table-section-header-background-color: var(--spectrum-gray-200);

	/* Collapsible and thumbnails */
	--spectrum-table-collapsible-tier-indent: var(--spectrum-spacing-300);
	--spectrum-table-collapsible-disclosure-inline-spacing: 0px;
	--spectrum-table-collapsible-icon-animation-duration: var(--spectrum-animation-duration-100);

	--spectrum-table-cell-background-color: var(--highcontrast-table-row-background-color, var(--mod-table-row-background-color, var(--spectrum-table-row-background-color)));
	--spectrum-table-selected-cell-background-color: var(--highcontrast-table-selected-row-background-color, var(--mod-table-selected-row-background-color-non-emphasized, var(--spectrum-table-selected-row-background-color-non-emphasized)));
	--spectrum-table-selected-cell-background-color-focus: var(--highcontrast-table-selected-row-background-color-focus, var(--mod-table-selected-row-background-color-non-emphasized-focus, var(--spectrum-table-selected-row-background-color-non-emphasized-focus)));

	/* @passthrough */
	--mod-thumbnail-size: var(--mod-table-thumbnail-size, var(--spectrum-table-thumbnail-size));
}

.spectrum-Table:dir(rtl) {
		--spectrum-logical-rotation: matrix(-1, 0, 0, 1, 0, 0);
	}

.spectrum-Table, .spectrum-Table--sizeM {
	--spectrum-table-min-header-height: var(--spectrum-component-height-100);
	--spectrum-table-header-top-to-text: var(--spectrum-table-column-header-row-top-to-text-medium);
	--spectrum-table-header-bottom-to-text: var(--spectrum-table-column-header-row-bottom-to-text-medium);

	--spectrum-table-min-row-height: var(--spectrum-table-row-height-medium-regular);
	--spectrum-table-row-top-to-text: var(--spectrum-table-row-top-to-text-medium-regular);
	--spectrum-table-row-bottom-to-text: var(--spectrum-table-row-bottom-to-text-medium-regular);

	--spectrum-table-icon-to-text: var(--spectrum-text-to-visual-100);

	/* Typography */
	--spectrum-table-row-font-size: var(--spectrum-font-size-100);

	/* Row Selection */
	--spectrum-table-header-checkbox-block-spacing: var(--spectrum-table-header-row-checkbox-to-top-medium);
	--spectrum-table-row-checkbox-block-spacing: var(--spectrum-table-row-checkbox-to-top-medium-regular);

	/* Summary Row and Section Header Row */
	--spectrum-table-section-header-min-height: var(--spectrum-table-section-header-row-height-medium);
	--spectrum-table-section-header-block-start-spacing: var(--spectrum-component-top-to-text-100);
	--spectrum-table-section-header-block-end-spacing: var(--spectrum-component-bottom-to-text-100);

	/* Collapsible and Thumbnails */
	--spectrum-table-disclosure-icon-size: var(--spectrum-component-height-100);

	--spectrum-table-thumbnail-block-spacing: var(--spectrum-table-thumbnail-to-top-minimum-medium-regular);
	--spectrum-table-thumbnail-to-text: var(--spectrum-text-to-visual-100);
	--spectrum-table-thumbnail-size: var(--spectrum-thumbnail-size-300);
}

.spectrum-Table--sizeS {
	/* Size and Spacing */
	--spectrum-table-min-header-height: var(--spectrum-component-height-100);
	--spectrum-table-header-top-to-text: var(--spectrum-table-column-header-row-top-to-text-small);
	--spectrum-table-header-bottom-to-text: var(--spectrum-table-column-header-row-bottom-to-text-small);

	--spectrum-table-min-row-height: var(--spectrum-table-row-height-small-regular);
	--spectrum-table-row-top-to-text: var(--spectrum-table-row-top-to-text-small-regular);
	--spectrum-table-row-bottom-to-text: var(--spectrum-table-row-bottom-to-text-small-regular);

	--spectrum-table-icon-to-text: var(--spectrum-text-to-visual-100);

	/* Typography */
	--spectrum-table-row-font-size: var(--spectrum-font-size-75);

	/* Row Selection */
	--spectrum-table-header-checkbox-block-spacing: var(--spectrum-table-header-row-checkbox-to-top-small);
	--spectrum-table-row-checkbox-block-spacing: var(--spectrum-table-row-checkbox-to-top-small-regular);

	/* Summary Row and Section Header Row */
	--spectrum-table-section-header-min-height: var(--spectrum-table-section-header-row-height-small);
	--spectrum-table-section-header-block-start-spacing: var(--spectrum-component-top-to-text-75);
	--spectrum-table-section-header-block-end-spacing: var(--spectrum-component-bottom-to-text-75);

	/* Collapsible and Thumbnails */
	--spectrum-table-disclosure-icon-size: var(--spectrum-component-height-75);

	--spectrum-table-thumbnail-block-spacing: var(--spectrum-table-thumbnail-to-top-minimum-small-regular);
	--spectrum-table-thumbnail-to-text: var(--spectrum-text-to-visual-100);
	--spectrum-table-thumbnail-size: var(--spectrum-thumbnail-size-200);
}

.spectrum-Table--sizeL {
	/* Size and Spacing */
	--spectrum-table-min-header-height: var(--spectrum-component-height-200);
	--spectrum-table-header-top-to-text: var(--spectrum-table-column-header-row-top-to-text-large);
	--spectrum-table-header-bottom-to-text: var(--spectrum-table-column-header-row-bottom-to-text-large);

	--spectrum-table-min-row-height: var(--spectrum-table-row-height-large-regular);
	--spectrum-table-row-top-to-text: var(--spectrum-table-row-top-to-text-large-regular);
	--spectrum-table-row-bottom-to-text: var(--spectrum-table-row-bottom-to-text-large-regular);

	--spectrum-table-icon-to-text: var(--spectrum-text-to-visual-200);

	/* Typography */
	--spectrum-table-row-font-size: var(--spectrum-font-size-200);

	/* Row Selection */
	--spectrum-table-header-checkbox-block-spacing: var(--spectrum-table-header-row-checkbox-to-top-large);
	--spectrum-table-row-checkbox-block-spacing: var(--spectrum-table-row-checkbox-to-top-large-regular);

	/* Summary Row and Section Header Row */
	--spectrum-table-section-header-min-height: var(--spectrum-table-section-header-row-height-large);
	--spectrum-table-section-header-block-start-spacing: var(--spectrum-component-top-to-text-200);
	--spectrum-table-section-header-block-end-spacing: var(--spectrum-component-bottom-to-text-200);

	/* Collapsible and Thumbnails */
	--spectrum-table-disclosure-icon-size: var(--spectrum-component-height-200);

	--spectrum-table-thumbnail-block-spacing: var(--spectrum-table-thumbnail-to-top-minimum-large-regular);
	--spectrum-table-thumbnail-to-text: var(--spectrum-text-to-visual-200);
	--spectrum-table-thumbnail-size: var(--spectrum-thumbnail-size-500);
}

.spectrum-Table--sizeXL {
	/* Size and Spacing */
	--spectrum-table-min-header-height: var(--spectrum-component-height-300);
	--spectrum-table-header-top-to-text: var(--spectrum-table-column-header-row-top-to-text-extra-large);
	--spectrum-table-header-bottom-to-text: var(--spectrum-table-column-header-row-bottom-to-text-extra-large);

	--spectrum-table-min-row-height: var(--spectrum-table-row-height-extra-large-regular);
	--spectrum-table-row-top-to-text: var(--spectrum-table-row-top-to-text-extra-large-regular);
	--spectrum-table-row-bottom-to-text: var(--spectrum-table-row-bottom-to-text-extra-large-regular);

	--spectrum-table-icon-to-text: var(--spectrum-text-to-visual-300);

	/* Typography */
	--spectrum-table-row-font-size: var(--spectrum-font-size-300);

	/* Row Selection */
	--spectrum-table-header-checkbox-block-spacing: var(--spectrum-table-header-row-checkbox-to-top-extra-large);
	--spectrum-table-row-checkbox-block-spacing: var(--spectrum-table-row-checkbox-to-top-extra-large-regular);

	/* Summary Row and Section Header Row */
	--spectrum-table-section-header-min-height: var(--spectrum-table-section-header-row-height-extra-large);
	--spectrum-table-section-header-block-start-spacing: var(--spectrum-component-top-to-text-300);
	--spectrum-table-section-header-block-end-spacing: var(--spectrum-component-bottom-to-text-300);

	/* Collapsible and Thumbnails */
	--spectrum-table-disclosure-icon-size: var(--spectrum-component-height-300);

	--spectrum-table-thumbnail-block-spacing: var(--spectrum-table-thumbnail-to-top-minimum-extra-large-regular);
	--spectrum-table-thumbnail-to-text: var(--spectrum-text-to-visual-300);
	--spectrum-table-thumbnail-size: var(--spectrum-thumbnail-size-700);
}

/********* VARIANTS *********/

.spectrum-Table--compact {
	/* Size and Spacing */
	--mod-table-min-row-height: var(--mod-table-min-row-height--compact, var(--spectrum-table-row-height-medium-compact));
	--mod-table-row-top-to-text: var(--mod-table-row-top-to-text--compact, var(--spectrum-table-row-top-to-text-medium-compact));
	--mod-table-row-bottom-to-text: var(--mod-table-row-bottom-to-text--compact, var(--spectrum-table-row-bottom-to-text-medium-compact));

	/* Row Selection */
	--mod-table-row-checkbox-block-spacing: var(--mod-table-row-checkbox-block-spacing--compact, var(--spectrum-table-row-checkbox-to-top-medium-compact));

	/* Collapsible and Thumbnails */
	--mod-table-thumbnail-block-spacing: var(--mod-table-thumbnail-block-spacing-compact, var(--spectrum-table-thumbnail-to-top-minimum-medium-compact));
	--mod-table-thumbnail-size: var(--mod-table-thumbnail-size-compact, var(--spectrum-thumbnail-size-200));
}

.spectrum-Table--compact.spectrum-Table--sizeS {
		/* Size and Spacing */
		--mod-table-min-row-height: var(--mod-table-min-row-height--compact, var(--spectrum-table-row-height-small-compact));
		--mod-table-row-top-to-text: var(--mod-table-row-top-to-text--compact, var(--spectrum-table-row-top-to-text-small-compact));
		--mod-table-row-bottom-to-text: var(--mod-table-row-bottom-to-text--compact, var(--spectrum-table-row-bottom-to-text-small-compact));

		/* Row Selection */
		--mod-table-row-checkbox-block-spacing: var(--mod-table-row-checkbox-block-spacing--compact, var(--spectrum-table-row-checkbox-to-top-small-compact));

		/* Collapsible and Thumbnails */
		--mod-table-thumbnail-block-spacing: var(--mod-table-thumbnail-block-spacing-compact, var(--spectrum-table-thumbnail-to-top-minimum-small-compact));
		--mod-table-thumbnail-size: var(--mod-table-thumbnail-size-compact, var(--spectrum-thumbnail-size-50));
	}

.spectrum-Table--compact.spectrum-Table--sizeL {
		/* Size and Spacing */
		--mod-table-min-row-height: var(--mod-table-min-row-height--compact, var(--spectrum-table-row-height-large-compact));
		--mod-table-row-top-to-text: var(--mod-table-row-top-to-text--compact, var(--spectrum-table-row-top-to-text-large-compact));
		--mod-table-row-bottom-to-text: var(--mod-table-row-bottom-to-text--compact, var(--spectrum-table-row-bottom-to-text-large-compact));

		/* Row Selection */
		--mod-table-row-checkbox-block-spacing: var(--mod-table-row-checkbox-block-spacing--compact, var(--spectrum-table-row-checkbox-to-top-large-compact));

		/* Collapsible and Thumbnails */
		--mod-table-thumbnail-block-spacing: var(--mod-table-thumbnail-block-spacing-compact, var(--spectrum-table-thumbnail-to-top-minimum-large-compact));
		--mod-table-thumbnail-size: var(--mod-table-thumbnail-size-compact, var(--spectrum-thumbnail-size-300));
	}

.spectrum-Table--compact.spectrum-Table--sizeXL {
		/* Size and Spacing */
		--mod-table-min-row-height: var(--mod-table-min-row-height--compact, var(--spectrum-table-row-height-extra-large-compact));
		--mod-table-row-top-to-text: var(--mod-table-row-top-to-text--compact, var(--spectrum-table-row-top-to-text-extra-large-compact));
		--mod-table-row-bottom-to-text: var(--mod-table-row-bottom-to-text--compact, var(--spectrum-table-row-bottom-to-text-extra-large-compact));

		/* Row Selection */
		--mod-table-row-checkbox-block-spacing: var(--mod-table-row-checkbox-block-spacing--compact, var(--spectrum-table-row-checkbox-to-top-extra-large-compact));

		/* Collapsible and Thumbnails */
		--mod-table-thumbnail-block-spacing: var(--mod-table-thumbnail-block-spacing-compact, var(--spectrum-table-thumbnail-to-top-minimum-extra-large-compact));
		--mod-table-thumbnail-size: var(--mod-table-thumbnail-size-compact, var(--spectrum-thumbnail-size-500));
	}

.spectrum-Table--spacious {
	/* Size and Spacing */
	--mod-table-min-row-height: var(--mod-table-min-row-height--spacious, var(--spectrum-table-row-height-medium-spacious));
	--mod-table-row-top-to-text: var(--mod-table-row-top-to-text--spacious, var(--spectrum-table-row-top-to-text-medium-spacious));
	--mod-table-row-bottom-to-text: var(--mod-table-row-bottom-to-text--spacious, var(--spectrum-table-row-bottom-to-text-medium-spacious));

	/* Row Selection */
	--mod-table-row-checkbox-block-spacing: var(--mod-table-row-checkbox-block-spacing--spacious, var(--spectrum-table-row-checkbox-to-top-medium-spacious));

	/* Collapsible and Thumbnails */
	--mod-table-thumbnail-block-spacing: var(--mod-table-thumbnail-block-spacing-spacious, var(--spectrum-table-thumbnail-to-top-minimum-medium-spacious));
	--mod-table-thumbnail-size: var(--mod-table-thumbnail-size-spacious, var(--spectrum-thumbnail-size-500));
}

.spectrum-Table--spacious.spectrum-Table--sizeS {
		/* Size and Spacing */
		--mod-table-min-row-height: var(--mod-table-min-row-height--spacious, var(--spectrum-table-row-height-small-spacious));
		--mod-table-row-top-to-text: var(--mod-table-row-top-to-text--spacious, var(--spectrum-table-row-top-to-text-small-spacious));
		--mod-table-row-bottom-to-text: var(--mod-table-row-bottom-to-text--spacious, var(--spectrum-table-row-bottom-to-text-small-spacious));

		/* Row Selection */
		--mod-table-row-checkbox-block-spacing: var(--mod-table-row-checkbox-block-spacing--spacious, var(--spectrum-table-row-checkbox-to-top-small-spacious));

		/* Collapsible and Thumbnails */
		--mod-table-thumbnail-block-spacing: var(--mod-table-thumbnail-block-spacing-spacious, var(--spectrum-table-thumbnail-to-top-minimum-small-spacious));
		--mod-table-thumbnail-size: var(--mod-table-thumbnail-size-spacious, var(--spectrum-thumbnail-size-300));
	}

.spectrum-Table--spacious.spectrum-Table--sizeL {
		/* Size and Spacing */
		--mod-table-min-row-height: var(--mod-table-min-row-height--spacious, var(--spectrum-table-row-height-large-spacious));
		--mod-table-row-top-to-text: var(--mod-table-row-top-to-text--spacious, var(--spectrum-table-row-top-to-text-large-spacious));
		--mod-table-row-bottom-to-text: var(--mod-table-row-bottom-to-text--spacious, var(--spectrum-table-row-bottom-to-text-large-spacious));

		/* Row Selection */
		--mod-table-row-checkbox-block-spacing: var(--mod-table-row-checkbox-block-spacing--spacious, var(--spectrum-table-row-checkbox-to-top-large-spacious));

		/* Collapsible and Thumbnails */
		--mod-table-thumbnail-block-spacing: var(--mod-table-thumbnail-block-spacing-spacious, var(--spectrum-table-thumbnail-to-top-minimum-large-spacious));
		--mod-table-thumbnail-size: var(--mod-table-thumbnail-size-spacious, var(--spectrum-thumbnail-size-700));
	}

.spectrum-Table--spacious.spectrum-Table--sizeXL {
		/* Size and Spacing */
		--mod-table-min-row-height: var(--mod-table-min-row-height--spacious, var(--spectrum-table-row-height-extra-large-spacious));
		--mod-table-row-top-to-text: var(--mod-table-row-top-to-text--spacious, var(--spectrum-table-row-top-to-text-extra-large-spacious));
		--mod-table-row-bottom-to-text: var(--mod-table-row-bottom-to-text--spacious, var(--spectrum-table-row-bottom-to-text-extra-large-spacious));

		/* Row Selection */
		--mod-table-row-checkbox-block-spacing: var(--mod-table-row-checkbox-block-spacing--spacious, var(--spectrum-table-row-checkbox-to-top-extra-large-spacious));

		/* Collapsible and Thumbnails */
		--mod-table-thumbnail-block-spacing: var(--mod-table-thumbnail-block-spacing-spacious, var(--spectrum-table-thumbnail-to-top-minimum-extra-large-spacious));
		--mod-table-thumbnail-size: var(--mod-table-thumbnail-size-spacious, var(--spectrum-thumbnail-size-800));
	}

.spectrum-Table--emphasized {
	--spectrum-table-selected-cell-background-color: var(--highcontrast-table-selected-row-background-color, var(--mod-table-selected-row-background-color, var(--spectrum-table-selected-row-background-color)));
	--spectrum-table-selected-cell-background-color-focus: var(--highcontrast-table-selected-row-background-color-focus, var(--mod-table-selected-row-background-color-focus, var(--spectrum-table-selected-row-background-color-focus)));
}

.spectrum-Table--quiet {
	--mod-table-border-radius: var(--mod-table-border-radius--quiet, 0px);
	--mod-table-outer-border-inline-width: var(--mod-table-outer-border-inline-width--quiet, 0px);
	--mod-table-header-background-color: var(--mod-table-header-background-color--quiet, var(--spectrum-transparent-white-100));
	--mod-table-row-background-color: var(--mod-table-row-background-color--quiet, var(--spectrum-transparent-white-100));
}

/********* REGULAR / DEFAULT *********/

.spectrum-Table:not(.spectrum-Table-scroller), .spectrum-Table-main {
	border-collapse: separate;
	border-spacing: 0;
	display: table;
}

.spectrum-Table-sortedIcon {
	display: none;
	margin-inline-end: var(--mod-table-sort-icon-inline-end-spacing, var(--mod-table-icon-to-text, var(--spectrum-table-icon-to-text)));
	margin-inline-start: var(--mod-table-sort-icon-inline-start-spacing, 0);
	transition: transform var(--highcontrast-table-transition-duration, var(--mod-table-transition-duration, var(--spectrum-table-transition-duration))) ease-in-out;
	vertical-align: baseline;
}

.spectrum-Table-menuIcon {
	margin-inline-start: var(--mod-table-icon-to-text, var(--spectrum-table-icon-to-text));
	vertical-align: middle;
}

.spectrum-Table-headCell {
	--spectrum-table-icon-color: var(--highcontrast-table-icon-color, var(--mod-table-icon-color-default, var(--spectrum-table-icon-color-default)));
	background-color: var(--mod-table-header-background-color, var(--spectrum-table-header-background-color));

	/* block-size functions as min-block-size when using display table-cell. */
	block-size: var(--mod-table-min-header-height, var(--spectrum-table-min-header-height));

	border-radius: 0;

	box-sizing: border-box;

	color: var(--mod-table-header-text-color, var(--spectrum-table-header-text-color));
	cursor: var(--mod-table-cursor-header-default, initial);

	font-family: var(--mod-table-header-font-family, var(--spectrum-table-row-font-family));
	font-size: var(--mod-table-header-font-size, var(--spectrum-table-row-font-size));
	font-weight: var(--mod-table-header-font-weight, var(--spectrum-table-header-font-weight));
	line-height: var(--mod-table-header-line-height, var(--spectrum-table-row-line-height));
	outline: 0;

	padding-block: var(--mod-table-header-top-to-text, var(--spectrum-table-header-top-to-text)) var(--mod-table-header-bottom-to-text, var(--spectrum-table-header-bottom-to-text));
	padding-inline: var(--mod-table-cell-inline-space, var(--spectrum-table-cell-inline-space));
	text-align: start;
	text-transform: var(--mod-table-header-text-transform, none);
	transition: color var(--highcontrast-table-transition-duration, var(--mod-table-transition-duration, var(--spectrum-table-transition-duration))) ease-in-out;
	vertical-align: var(--mod-table-header-vertical-align, var(--spectrum-table-header-vertical-align));
}

.spectrum-Table-headCell .spectrum-Table-sortedIcon,.spectrum-Table-headCell .spectrum-Table-menuIcon {
		color: var(--spectrum-table-icon-color);
	}

.spectrum-Table-headCell.is-sortable {
		cursor: var(--mod-table-cursor-header-sortable, pointer);
	}

.spectrum-Table-headCell.is-sortable:hover {
			--spectrum-table-icon-color: var(--highcontrast-table-icon-color-focus, var(--mod-table-icon-color-hover, var(--spectrum-table-icon-color-hover)));
		}

.spectrum-Table-headCell.is-sortable:active {
			--spectrum-table-icon-color: var(--highcontrast-table-icon-color-focus, var(--mod-table-icon-color-active, var(--spectrum-table-icon-color-active)));
		}

.spectrum-Table-headCell.is-sortable:focus {
			--spectrum-table-icon-color: var(--highcontrast-table-icon-color-focus, var(--mod-table-icon-color-focus, var(--spectrum-table-icon-color-focus)));
		}

.spectrum-Table-headCell.is-sortable:focus:hover {
			--spectrum-table-icon-color: var(--highcontrast-table-icon-color-focus, var(--mod-table-icon-color-focus-hover, var(--spectrum-table-icon-color-focus-hover)));
		}

.spectrum-Table-headCell.is-sortable:focus-visible,.spectrum-Table-headCell.is-sortable.is-keyboardFocused {
			--spectrum-table-icon-color: var(--highcontrast-table-icon-color-focus, var(--mod-table-icon-color-key-focus, var(--spectrum-table-icon-color-key-focus)));
		}

:is(.spectrum-Table-headCell.is-sorted-asc,.spectrum-Table-headCell.is-sorted-desc) .spectrum-Table-sortedIcon {
			display: inline-block;
		}

.spectrum-Table-headCell.is-sorted-asc .spectrum-Table-sortedIcon {
			transform: rotateZ(-90deg);
		}

.spectrum-Table-columnTitle {
	display: inline-block;
}

.spectrum-Table-cell--alignCenter {
	text-align: center;
}

.spectrum-Table-cell--alignRight {
	text-align: end;
}

.spectrum-Table-body {
	border: none;
	border-radius: var(--mod-table-border-radius, var(--spectrum-table-border-radius));
	display: table-row-group;
	position: relative;
}

.spectrum-Table-body.is-drop-target {
		/* Make sure negative offset outline is not covered by borders. */
		--mod-table-border-color: transparent;
		outline-color: var(--highcontrast-table-focus-indicator-color, var(--mod-table-drop-zone-outline-color, var(--spectrum-table-drop-zone-outline-color)));
		outline-style: solid;

		outline-width: var(--mod-table-focus-indicator-thickness, var(--spectrum-table-focus-indicator-thickness));
	}

/* Outside border, row divider lines, and rounded corners:
    The tbody tag doesn't allow setting a border or border-radius. To make them work, border styles are
    instead applied to the individual cells around the outside, while using border-collapse: separate. */

/* Row divider lines */

.spectrum-Table-cell {
	background-color: var(--spectrum-table-cell-background-color);

	/* block-size functions as min-block-size when using display table-cell. */
	block-size: var(--mod-table-min-row-height, var(--spectrum-table-min-row-height));
	border-block-start: var(--mod-table-border-width, var(--spectrum-table-border-width)) solid var(--highcontrast-table-divider-color, var(--mod-table-divider-color, var(--spectrum-table-divider-color)));

	/* Cells within table body */
	box-sizing: border-box;
	color: var(--highcontrast-table-row-text-color, var(--mod-table-row-text-color, var(--spectrum-table-row-text-color)));
	font-size: var(--mod-table-row-font-size, var(--spectrum-table-row-font-size));
	font-weight: var(--mod-table-row-font-weight, var(--spectrum-table-row-font-weight));
	line-height: var(--mod-table-row-line-height, var(--spectrum-table-row-line-height));
	padding-block-end: var(--mod-table-row-bottom-to-text, var(--spectrum-table-row-bottom-to-text));

	padding-block-start: calc(var(--mod-table-row-top-to-text, var(--spectrum-table-row-top-to-text)) - var(--mod-table-border-width, var(--spectrum-table-border-width)));
	padding-inline: calc(var(--mod-table-edge-to-content, var(--spectrum-table-edge-to-content)) - var(--mod-table-outer-border-inline-width, var(--spectrum-table-outer-border-inline-width)));
	vertical-align: var(--mod-table-default-vertical-align, var(--spectrum-table-default-vertical-align));
}

/* Outside border */

:is(.spectrum-Table-body .spectrum-Table-row):first-child .spectrum-Table-cell {
		border-block-start: var(--mod-table-border-width, var(--spectrum-table-border-width)) solid var(--highcontrast-table-border-color, var(--mod-table-border-color, var(--spectrum-table-border-color)));
	}

:is(.spectrum-Table-body .spectrum-Table-row):last-child .spectrum-Table-cell {
		border-block-end: var(--mod-table-border-width, var(--spectrum-table-border-width)) solid var(--highcontrast-table-border-color, var(--mod-table-border-color, var(--spectrum-table-border-color)));
	}

:is(.spectrum-Table-body .spectrum-Table-row) .spectrum-Table-cell:first-child {
		border-inline-start: var(--mod-table-outer-border-inline-width, var(--spectrum-table-outer-border-inline-width)) solid var(--highcontrast-table-border-color, var(--mod-table-border-color, var(--spectrum-table-border-color)));
	}

:is(.spectrum-Table-body .spectrum-Table-row) .spectrum-Table-cell:last-child {
		border-inline-end: var(--mod-table-outer-border-inline-width, var(--spectrum-table-outer-border-inline-width)) solid var(--highcontrast-table-border-color, var(--mod-table-border-color, var(--spectrum-table-border-color)));
	}

/* Rounded corners */

.spectrum-Table-row {
	border-block-start: none;
	cursor: var(--mod-table-cursor-row-default, pointer);
	/* Rows within table body */
	position: relative;
	transition: background-color var(--highcontrast-table-transition-duration, var(--mod-table-transition-duration, var(--spectrum-table-transition-duration))) ease-in-out;
}

.spectrum-Table-row:first-child .spectrum-Table-cell:first-child {
		border-start-start-radius: var(--mod-table-border-radius, var(--spectrum-table-border-radius));
	}

.spectrum-Table-row:first-child .spectrum-Table-cell:last-child {
		border-start-end-radius: var(--mod-table-border-radius, var(--spectrum-table-border-radius));
	}

.spectrum-Table-row:last-child .spectrum-Table-cell:first-child {
		border-end-start-radius: var(--mod-table-border-radius, var(--spectrum-table-border-radius));
	}

.spectrum-Table-row:last-child .spectrum-Table-cell:last-child {
		border-end-end-radius: var(--mod-table-border-radius, var(--spectrum-table-border-radius));
	}

.spectrum-Table-row:first-child {
		border-start-end-radius: var(--mod-table-border-radius, var(--spectrum-table-border-radius));
		/* Ensure that 'outline' will match the border-radius, when used on rows. */
		border-start-start-radius: var(--mod-table-border-radius, var(--spectrum-table-border-radius));
	}

.spectrum-Table-row:last-child {
		border-end-end-radius: var(--mod-table-border-radius, var(--spectrum-table-border-radius));
		border-end-start-radius: var(--mod-table-border-radius, var(--spectrum-table-border-radius));
	}

.spectrum-Table-row:focus {
		outline: 0;
	}

.spectrum-Table-row:hover,.spectrum-Table-row:focus-visible,.spectrum-Table-row.is-focused {
		--highcontrast-table-row-text-color: var(--highcontrast-table-row-text-color-hover);
		--highcontrast-table-icon-color: var(--highcontrast-table-row-text-color-hover);
		--spectrum-table-cell-background-color: var(--highcontrast-table-row-background-color-hover, var(--mod-table-row-background-color-hover, var(--spectrum-table-row-background-color-hover)));
	}

.spectrum-Table-row:active {
		--highcontrast-table-row-text-color: var(--highcontrast-table-row-text-color-hover);
		--highcontrast-table-icon-color: var(--highcontrast-table-row-text-color-hover);
		--spectrum-table-cell-background-color: var(--highcontrast-table-row-background-color-hover, var(--mod-table-row-active-color, var(--spectrum-table-row-active-color)));
	}

.spectrum-Table-row.is-selected {
		--highcontrast-table-row-text-color: var(--highcontrast-table-selected-row-text-color);
		--highcontrast-table-icon-color: var(--highcontrast-table-selected-row-text-color);
		--spectrum-table-cell-background-color: var(--highcontrast-table-selected-row-background-color, var(--spectrum-table-selected-cell-background-color));
	}

.spectrum-Table-row.is-selected:hover,.spectrum-Table-row.is-selected:focus-visible,.spectrum-Table-row.is-selected.is-focused {
			--highcontrast-table-row-text-color: var(--highcontrast-table-selected-row-text-color-focus);
			--highcontrast-table-icon-color: var(--highcontrast-table-selected-row-text-color-focus);
			--spectrum-table-cell-background-color: var(--highcontrast-table-selected-row-background-color-focus, var(--spectrum-table-selected-cell-background-color-focus));
		}

.spectrum-Table-row.is-drop-target,.spectrum-Table-body.is-drop-target .spectrum-Table-row {
		--highcontrast-table-row-text-color: var(--highcontrast-table-selected-row-text-color);
		--highcontrast-table-icon-color: var(--highcontrast-table-selected-row-text-color);
		--spectrum-table-cell-background-color: var(--highcontrast-table-selected-row-background-color, var(--mod-table-drop-zone-background-color, var(--spectrum-table-drop-zone-background-color)));
	}

.spectrum-Table-row.is-drop-target {
		/* Make sure negative offset outline is not covered by borders. */
		--mod-table-border-color: var(--highcontrast-table-focus-indicator-color, transparent);
		outline-color: var(--highcontrast-table-focus-indicator-color, var(--mod-table-drop-zone-outline-color, var(--spectrum-table-drop-zone-outline-color)));
		outline-offset: calc(-1 * var(--mod-table-focus-indicator-thickness, var(--spectrum-table-focus-indicator-thickness)));
		outline-style: solid;

		outline-width: var(--mod-table-focus-indicator-thickness, var(--spectrum-table-focus-indicator-thickness));
	}

.spectrum-Table-row.is-drop-target .spectrum-Table-cell {
			border-block-start-color: var(--highcontrast-table-focus-indicator-color, var(--mod-table-drop-zone-outline-color, var(--spectrum-table-drop-zone-outline-color)));
		}

/* Focus Indicator (Ring) */

.spectrum-Table-cell, .spectrum-Table-headCell {
	display: table-cell;
	position: relative;
}

:is(.spectrum-Table-cell,.spectrum-Table-headCell):focus-visible,.is-focused:is(.spectrum-Table-cell,.spectrum-Table-headCell) {
		outline-color: var(--highcontrast-table-cell-focus-indicator-color, var(--highcontrast-table-focus-indicator-color, var(--mod-table-focus-indicator-color, var(--spectrum-table-focus-indicator-color))));
		outline-offset: calc((-1 * var(--mod-table-focus-indicator-thickness, var(--spectrum-table-focus-indicator-thickness))) - var(--highcontrast-table-cell-focus-extra-offset, 0px));
		outline-style: solid;
		outline-width: var(--mod-table-focus-indicator-thickness, var(--spectrum-table-focus-indicator-thickness));
	}

/* Cells that display a column divider (vertical border). */

.spectrum-Table-cell--divider {
	border-inline-end: var(--mod-table-border-width, var(--spectrum-table-border-width)) solid var(--highcontrast-table-divider-color, var(--mod-table-divider-color, var(--spectrum-table-divider-color)));
}

.spectrum-Table-row--summary {
	--spectrum-table-cell-background-color: var(--highcontrast-table-row-background-color, var(--mod-table-summary-row-background-color, var(--spectrum-table-summary-row-background-color)));
}

.spectrum-Table-row--summary .spectrum-Table-cell {
		color: var(--highcontrast-table-row-text-color, var(--mod-table-summary-row-text-color, var(--spectrum-table-row-text-color)));
		font-family: var(--mod-table-summary-row-font-family, var(--spectrum-table-row-font-family));

		/* Make unique summary row mods available to these default row styles: */
		font-size: var(--mod-table-summary-row-font-size, var(--spectrum-table-row-font-size));
		font-style: var(--mod-table-summary-row-font-style, var(--spectrum-table-row-font-style));
		font-weight: var(--mod-table-summary-row-font-weight, var(--spectrum-table-summary-row-font-weight));
		line-height: var(--mod-table-summary-row-line-height, var(--spectrum-table-row-line-height));
	}

.spectrum-Table-row--sectionHeader {
	--spectrum-table-cell-background-color: var(--highcontrast-table-section-header-background-color, var(--mod-table-section-header-background-color, var(--spectrum-table-section-header-background-color)));
	cursor: var(--mod-table-cursor-section-header, initial);
}

.spectrum-Table-row--sectionHeader .spectrum-Table-cell {

		/* block-size functions as min-block-size when using display table-cell. */
		block-size: var(--mod-table-section-header-min-height, var(--spectrum-table-section-header-min-height));
		color: var(--highcontrast-table-section-header-text-color, var(--mod-table-section-header-text-color, var(--spectrum-table-row-text-color)));
		font-family: var(--mod-table-section-header-font-family, var(--spectrum-table-row-font-family));

		/* Make unique section header mods available to these default row styles: */
		font-size: var(--mod-table-section-header-font-size, var(--spectrum-table-row-font-size));
		font-style: var(--mod-table-section-header-font-style, var(--spectrum-table-row-font-style));
		font-weight: var(--mod-table-section-header-font-weight, var(--spectrum-table-section-header-font-weight));
		line-height: var(--mod-table-section-header-line-height, var(--spectrum-table-row-line-height));
		padding-block-end: calc(var(--mod-table-section-header-block-end-spacing, var(--spectrum-table-section-header-block-end-spacing)) - var(--mod-table-border-width, var(--spectrum-table-border-width)));

		padding-block-start: calc(var(--mod-table-section-header-block-start-spacing, var(--spectrum-table-section-header-block-start-spacing)) - var(--mod-table-border-width, var(--spectrum-table-border-width)));
		text-align: start;
	}

.spectrum-Table-row--sectionHeader:hover {
		--highcontrast-table-row-text-color: var(--highcontrast-table-section-header-text-color);
		--spectrum-table-cell-background-color: var(--highcontrast-table-section-header-background-color, var(--mod-table-section-header-background-color, var(--spectrum-table-section-header-background-color)));
	}

.spectrum-Table-checkboxCell {
	/* Prevent width expansion with 100% width table. */
	inline-size: var(--spectrum-checkbox-control-size-small);

	/* Block spacing must be moved to calculated margin on the checkbox element. */
	padding-block: 0;

	/* The calc subtraction is because the --spectrum-table-checkbox-to-text spacing value
	includes the inline start padding in the adjacent cell. */
	padding-inline-end: calc(var(--mod-table-checkbox-to-text, var(--spectrum-table-checkbox-to-text)) - var(--mod-table-edge-to-content, var(--spectrum-table-edge-to-content)));
}

.spectrum-Table-checkboxCell .spectrum-Table-checkbox {
		--mod-checkbox-spacing: 0px;

		min-block-size: initial;
	}

.spectrum-Table-checkboxCell.spectrum-Table-cell .spectrum-Table-checkbox {
		margin-block-end: var(--mod-table-row-checkbox-block-spacing, var(--spectrum-table-row-checkbox-block-spacing));
		margin-block-start: calc(var(--mod-table-row-checkbox-block-spacing, var(--spectrum-table-row-checkbox-block-spacing)) - var(--mod-table-border-width, var(--spectrum-table-border-width)));
	}

.spectrum-Table-checkboxCell.spectrum-Table-headCell .spectrum-Table-checkbox {
		margin-block-end: var(--mod-table-header-checkbox-block-spacing, var(--spectrum-table-header-checkbox-block-spacing));
		margin-block-start: calc(var(--mod-table-header-checkbox-block-spacing, var(--spectrum-table-header-checkbox-block-spacing)) - var(--mod-table-border-width, var(--spectrum-table-border-width)));
	}

/********* DIVS *********/

/* Make sure markup that uses divs instead of <table> elements displays like a regular table. */

.spectrum-Table-head {
	display: table-header-group;
}

.spectrum-Table-row, .spectrum-Table-head [role="row"] {
	display: table-row;
}

/********* SCROLLABLE *********/

/* Wrapper that allows a scrollable body and sticky column header. */

.spectrum-Table-scroller {
	--spectrum-table-header-background-color: var(--mod-table-header-background-color-scrollable, var(--spectrum-background-layer-1-color, var(--spectrum-gray-75)));
	border-block: var(--mod-table-border-width, var(--spectrum-table-border-width)) solid var(--highcontrast-table-border-color, var(--mod-table-border-color, var(--spectrum-table-border-color)));
	border-inline: var(--mod-table-outer-border-inline-width, var(--spectrum-table-outer-border-inline-width)) solid var(--highcontrast-table-border-color, var(--mod-table-border-color, var(--spectrum-table-border-color)));

	border-radius: var(--mod-table-border-radius, var(--spectrum-table-border-radius));

	box-sizing: border-box;
	display: inline-block;
	overflow: auto;
	position: relative;

	/* Make sure shift-tab reverse keyboard navigation keeps the whole cell in focus.
     --mod-table-current-header-height should be dynamically updated with JS to match the table header height. */
	scroll-padding-top: var(--mod-table-current-header-height, calc((var(--mod-table-header-line-height, var(--spectrum-table-row-line-height)) * var(--mod-table-header-font-size, var(--spectrum-table-row-font-size))) + var(--mod-table-header-top-to-text, var(--spectrum-table-header-top-to-text)) + var(--mod-table-header-bottom-to-text, var(--spectrum-table-header-bottom-to-text)) + var(--mod-table-border-width, var(--spectrum-table-border-width))));
}

.spectrum-Table-scroller.spectrum-Table--quiet {
		border-block-start: none;
	}

.spectrum-Table-scroller .spectrum-Table-head {
		inset-block-start: 0;
		position: sticky;
		z-index: 2;
	}

.spectrum-Table-scroller .spectrum-Table-headCell {
		border-block-end: var(--mod-table-border-width, var(--spectrum-table-border-width)) solid var(--highcontrast-table-border-color, var(--mod-table-border-color, var(--spectrum-table-border-color)));
	}

/* Remove borders that have been replaced by borders on wrapper or pseudo elements. */

:is(.spectrum-Table-scroller .spectrum-Table-body .spectrum-Table-row):first-child .spectrum-Table-cell {
			border-block-start: none;
			border-radius: 0;
		}

:is(.spectrum-Table-scroller .spectrum-Table-body .spectrum-Table-row):last-child .spectrum-Table-cell {
			border-block-end: none;
			border-radius: 0;
		}

:is(.spectrum-Table-scroller .spectrum-Table-body .spectrum-Table-row) .spectrum-Table-cell:first-child {
			border-inline-start: none;
		}

:is(.spectrum-Table-scroller .spectrum-Table-body .spectrum-Table-row) .spectrum-Table-cell:last-child {
			border-inline-end: none;
		}

/********* COLLAPSIBLE *********/

.spectrum-Table-row--collapsible {
	--spectrum-table-row-tier: 0;
}

.spectrum-Table-row--collapsible[data-tier="1"] {
		--spectrum-table-row-tier: 1;
	}

.spectrum-Table-row--collapsible[data-tier="2"] {
		--spectrum-table-row-tier: 2;
	}

.spectrum-Table-row--collapsible[data-tier="3"] {
		--spectrum-table-row-tier: 3;
	}

.spectrum-Table-row--collapsible[data-tier="4"] {
		--spectrum-table-row-tier: 4;
	}

.spectrum-Table-row--collapsible[data-tier="5"] {
		--spectrum-table-row-tier: 5;
	}

.spectrum-Table-row--collapsible[data-tier="6"] {
		--spectrum-table-row-tier: 6;
	}

.spectrum-Table-row--collapsible .spectrum-Table-checkboxCell {
		padding-inline-end: 0;
	}

.spectrum-Table-row--collapsible.is-last-tier .spectrum-Table-cell--collapsible {
			/* Last tier rows need additional space as wide as the disclosure icon, to be indented from previous tier. */
			padding-inline-start: calc((var(--spectrum-table-row-tier) * var(--spectrum-table-collapsible-tier-indent)) + var(--mod-table-disclosure-icon-size, var(--spectrum-table-disclosure-icon-size)) + (var(--mod-table-collapsible-disclosure-inline-spacing, var(--spectrum-table-collapsible-disclosure-inline-spacing)) * 2));
		}

.spectrum-Table-row--collapsible.is-last-tier .spectrum-Table-disclosureIcon {
			display: none;
		}

.spectrum-Table-row--collapsible .spectrum-Table-disclosureIcon {
		margin-block-start: max(0px, calc((var(--mod-table-min-row-height, var(--spectrum-table-min-row-height)) - var(--mod-table-disclosure-icon-size, var(--spectrum-table-disclosure-icon-size))) / 2));
		margin-inline: var(--mod-table-collapsible-disclosure-inline-spacing, var(--spectrum-table-collapsible-disclosure-inline-spacing));
	}

.spectrum-Table-row--collapsible[hidden] {
		display: none;
	}

.spectrum-Table-cell--collapsible {
	padding-block: 0;
	padding-inline-start: calc(var(--spectrum-table-row-tier, 0px) * var(--spectrum-table-collapsible-tier-indent));
}

.spectrum-Table-collapseInner {
	align-items: flex-start;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start;
}

.spectrum-Table-collapseInner .spectrum-Table-collapseContent {
		padding-block-end: var(--mod-table-row-bottom-to-text, var(--spectrum-table-row-bottom-to-text));
		padding-block-start: calc(var(--mod-table-row-top-to-text, var(--spectrum-table-row-top-to-text)) - var(--mod-table-border-width, var(--spectrum-table-border-width)));
	}

.spectrum-Table-disclosureIcon.spectrum-Table-disclosureIcon {
	--spectrum-table-icon-color: var(--highcontrast-table-icon-color, var(--mod-table-icon-color-default, var(--spectrum-table-icon-color-default)));
	background: transparent;

	block-size: var(--mod-table-disclosure-icon-size, var(--spectrum-table-disclosure-icon-size));
	border: 0;

	border-radius: 0;
	color: var(--spectrum-table-icon-color);
	flex-basis: var(--mod-table-disclosure-icon-size, var(--spectrum-table-disclosure-icon-size));
	flex-grow: 0;
	flex-shrink: 0;

	transform: var(--spectrum-logical-rotation,);
	transition: transform ease var(--mod-table-collapsible-icon-animation-duration, var(--spectrum-table-collapsible-icon-animation-duration));
}

.spectrum-Table-disclosureIcon.spectrum-Table-disclosureIcon[aria-expanded="true"] {
		transform: var(--spectrum-logical-rotation,) rotate(90deg);
	}

.spectrum-Table-disclosureIcon.spectrum-Table-disclosureIcon::after {
		display: none;
	}

.spectrum-Table-disclosureIcon.spectrum-Table-disclosureIcon:hover {
		--spectrum-table-icon-color: var(--highcontrast-table-icon-color, var(--mod-table-icon-color-hover, var(--spectrum-table-icon-color-hover)));
	}

.spectrum-Table-disclosureIcon.spectrum-Table-disclosureIcon:active {
		--spectrum-table-icon-color: var(--highcontrast-table-icon-color, var(--mod-table-icon-color-active, var(--spectrum-table-icon-color-active)));
	}

.spectrum-Table-disclosureIcon.spectrum-Table-disclosureIcon:focus {
		--spectrum-table-icon-color: var(--highcontrast-table-icon-color, var(--mod-table-icon-color-focus, var(--spectrum-table-icon-color-focus)));
	}

.spectrum-Table-disclosureIcon.spectrum-Table-disclosureIcon:focus:hover {
			--spectrum-table-icon-color: var(--highcontrast-table-icon-color, var(--mod-table-icon-color-focus-hover, var(--spectrum-table-icon-color-focus-hover)));
		}

.spectrum-Table-disclosureIcon.spectrum-Table-disclosureIcon:focus-visible,.spectrum-Table-disclosureIcon.spectrum-Table-disclosureIcon.is-keyboardFocused {
		--spectrum-table-icon-color: var(--highcontrast-table-icon-color, var(--mod-table-icon-color-key-focus, var(--spectrum-table-icon-color-key-focus)));
		outline-color: var(--highcontrast-table-focus-indicator-color, var(--mod-table-focus-indicator-color, var(--spectrum-table-focus-indicator-color)));
		outline-offset: calc((-1 * var(--mod-table-focus-indicator-thickness, var(--spectrum-table-focus-indicator-thickness))) - 2px);
		outline-style: solid;

		outline-width: var(--mod-table-focus-indicator-thickness, var(--spectrum-table-focus-indicator-thickness));
	}

/********* THUMBNAILS *********/

.spectrum-Table-row--thumbnail {
	--spectrum-table-thumbnail-cell-block-spacing: var(--mod-table-thumbnail-block-spacing, var(--spectrum-table-thumbnail-block-spacing));
	--spectrum-table-thumbnail-inner-content-block-spacing: max(0px, calc((var(--mod-table-thumbnail-size, var(--spectrum-table-thumbnail-size)) - (var(--mod-table-row-line-height, var(--spectrum-table-row-line-height)) * var(--mod-table-header-font-size, var(--spectrum-table-row-font-size)))) / 2));
}

.spectrum-Table-row--thumbnail .spectrum-Table-cell {
		padding-block: calc(var(--spectrum-table-thumbnail-cell-block-spacing) + var(--spectrum-table-thumbnail-inner-content-block-spacing));
	}

/* Cell that does have a thumbnail has its padding moved within the "Inner" and "Content" alignment wrappers. */

.spectrum-Table-row--thumbnail .spectrum-Table-cell--thumbnail {
		padding-block: 0;
	}

/* Sometimes the padding must be larger to match any extra space created by the disclosure icon (e.g. compact + large ). */

.spectrum-Table-row--thumbnail.spectrum-Table-row--collapsible {
		--spectrum-table-thumbnail-inner-minimum-block-spacing: max(0px, calc((var(--mod-table-disclosure-icon-size, var(--spectrum-table-disclosure-icon-size)) - var(--mod-table-thumbnail-size, var(--spectrum-table-thumbnail-size))) / 2));
		--spectrum-table-thumbnail-cell-block-spacing: max(var(--mod-table-thumbnail-block-spacing, var(--spectrum-table-thumbnail-block-spacing)), var(--spectrum-table-thumbnail-inner-minimum-block-spacing));
	}

.spectrum-Table-thumbnailInner {
	align-items: flex-start;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start;
	padding-block: var(--spectrum-table-thumbnail-cell-block-spacing);
}

.spectrum-Table-thumbnailInner .spectrum-Thumbnail {
		flex-grow: 0;
		flex-shrink: 0;
		line-height: var(--mod-table-row-line-height, var(--spectrum-table-row-line-height));
		margin-inline-end: var(--mod-table-thumbnail-to-text, var(--spectrum-table-thumbnail-to-text));
	}

.spectrum-Table-thumbnailInner .spectrum-Table-thumbnailContent {
		/* Vertically centers text with the middle of the thumbnail. */
		padding-block: var(--spectrum-table-thumbnail-inner-content-block-spacing);
	}

.general-details {
  margin: 0 auto;
  max-width: 800px;
  padding: 20px;
}

.general-info {
  margin-bottom: 2rem;
}

.buff-summaries {
  margin-top: 2rem;
}

.buff-summaries h3 {
  margin-bottom: 0.5rem;
  margin-top: 1.5rem;
}

.spectrum-Table {
  margin-bottom: 2rem;
  width: 100%;
}

/* Highlight the troop type that matches the general's targetType */

.highlight-row {
  background-color: var(--spectrum-global-color-static-blue-200);
}

/* Add some spacing between sections */

.section-divider {
  border-top: 1px solid var(--spectrum-global-color-gray-200);
  margin: 2rem 0;
}