@spectrum-web-components/styles
Version:
Spectrum Web Components are a [`LitElement`](https://lit-element.polymer-project.org)-powered web component library of patterns built on top of the [Spectrum CSS](https://opensource.adobe.com/spectrum-css) specification. Styles for these components are ma
1,165 lines (1,164 loc) • 133 kB
CSS
:root,
:host {
--spectrum-global-animation-linear: cubic-bezier(0, 0, 1, 1);
--spectrum-global-animation-duration-0: 0s;
--spectrum-global-animation-duration-100: 0.13s;
--spectrum-global-animation-duration-200: 0.16s;
--spectrum-global-animation-duration-300: 0.19s;
--spectrum-global-animation-duration-400: 0.22s;
--spectrum-global-animation-duration-500: 0.25s;
--spectrum-global-animation-duration-600: 0.3s;
--spectrum-global-animation-duration-700: 0.35s;
--spectrum-global-animation-duration-800: 0.4s;
--spectrum-global-animation-duration-900: 0.45s;
--spectrum-global-animation-duration-1000: 0.5s;
--spectrum-global-animation-duration-2000: 1s;
--spectrum-global-animation-duration-4000: 2s;
--spectrum-global-animation-ease-in-out: cubic-bezier(0.45, 0, 0.4, 1);
--spectrum-global-animation-ease-in: cubic-bezier(0.5, 0, 1, 1);
--spectrum-global-animation-ease-out: cubic-bezier(0, 0, 0.4, 1);
--spectrum-global-animation-ease-linear: cubic-bezier(0, 0, 1, 1);
--spectrum-global-color-status: Verified;
--spectrum-global-color-version: 5.1;
--spectrum-global-color-static-black-rgb: 0, 0, 0;
--spectrum-global-color-static-black: rgb(
var(--spectrum-global-color-static-black-rgb)
);
--spectrum-global-color-static-white-rgb: 255, 255, 255;
--spectrum-global-color-static-white: rgb(
var(--spectrum-global-color-static-white-rgb)
);
--spectrum-global-color-static-blue-rgb: 0, 87, 191;
--spectrum-global-color-static-blue: rgb(
var(--spectrum-global-color-static-blue-rgb)
);
--spectrum-global-color-static-gray-50-rgb: 255, 255, 255;
--spectrum-global-color-static-gray-50: rgb(
var(--spectrum-global-color-static-gray-50-rgb)
);
--spectrum-global-color-static-gray-75-rgb: 255, 255, 255;
--spectrum-global-color-static-gray-75: rgb(
var(--spectrum-global-color-static-gray-75-rgb)
);
--spectrum-global-color-static-gray-100-rgb: 255, 255, 255;
--spectrum-global-color-static-gray-100: rgb(
var(--spectrum-global-color-static-gray-100-rgb)
);
--spectrum-global-color-static-gray-200-rgb: 235, 235, 235;
--spectrum-global-color-static-gray-200: rgb(
var(--spectrum-global-color-static-gray-200-rgb)
);
--spectrum-global-color-static-gray-300-rgb: 217, 217, 217;
--spectrum-global-color-static-gray-300: rgb(
var(--spectrum-global-color-static-gray-300-rgb)
);
--spectrum-global-color-static-gray-400-rgb: 179, 179, 179;
--spectrum-global-color-static-gray-400: rgb(
var(--spectrum-global-color-static-gray-400-rgb)
);
--spectrum-global-color-static-gray-500-rgb: 146, 146, 146;
--spectrum-global-color-static-gray-500: rgb(
var(--spectrum-global-color-static-gray-500-rgb)
);
--spectrum-global-color-static-gray-600-rgb: 110, 110, 110;
--spectrum-global-color-static-gray-600: rgb(
var(--spectrum-global-color-static-gray-600-rgb)
);
--spectrum-global-color-static-gray-700-rgb: 71, 71, 71;
--spectrum-global-color-static-gray-700: rgb(
var(--spectrum-global-color-static-gray-700-rgb)
);
--spectrum-global-color-static-gray-800-rgb: 34, 34, 34;
--spectrum-global-color-static-gray-800: rgb(
var(--spectrum-global-color-static-gray-800-rgb)
);
--spectrum-global-color-static-gray-900-rgb: 0, 0, 0;
--spectrum-global-color-static-gray-900: rgb(
var(--spectrum-global-color-static-gray-900-rgb)
);
--spectrum-global-color-static-red-400-rgb: 237, 64, 48;
--spectrum-global-color-static-red-400: rgb(
var(--spectrum-global-color-static-red-400-rgb)
);
--spectrum-global-color-static-red-500-rgb: 217, 28, 21;
--spectrum-global-color-static-red-500: rgb(
var(--spectrum-global-color-static-red-500-rgb)
);
--spectrum-global-color-static-red-600-rgb: 187, 2, 2;
--spectrum-global-color-static-red-600: rgb(
var(--spectrum-global-color-static-red-600-rgb)
);
--spectrum-global-color-static-red-700-rgb: 154, 0, 0;
--spectrum-global-color-static-red-700: rgb(
var(--spectrum-global-color-static-red-700-rgb)
);
--spectrum-global-color-static-red-800-rgb: 124, 0, 0;
--spectrum-global-color-static-red-800: rgb(
var(--spectrum-global-color-static-red-800-rgb)
);
--spectrum-global-color-static-orange-400-rgb: 250, 139, 26;
--spectrum-global-color-static-orange-400: rgb(
var(--spectrum-global-color-static-orange-400-rgb)
);
--spectrum-global-color-static-orange-500-rgb: 233, 117, 0;
--spectrum-global-color-static-orange-500: rgb(
var(--spectrum-global-color-static-orange-500-rgb)
);
--spectrum-global-color-static-orange-600-rgb: 209, 97, 0;
--spectrum-global-color-static-orange-600: rgb(
var(--spectrum-global-color-static-orange-600-rgb)
);
--spectrum-global-color-static-orange-700-rgb: 182, 80, 0;
--spectrum-global-color-static-orange-700: rgb(
var(--spectrum-global-color-static-orange-700-rgb)
);
--spectrum-global-color-static-orange-800-rgb: 155, 64, 0;
--spectrum-global-color-static-orange-800: rgb(
var(--spectrum-global-color-static-orange-800-rgb)
);
--spectrum-global-color-static-yellow-200-rgb: 250, 237, 123;
--spectrum-global-color-static-yellow-200: rgb(
var(--spectrum-global-color-static-yellow-200-rgb)
);
--spectrum-global-color-static-yellow-300-rgb: 250, 224, 23;
--spectrum-global-color-static-yellow-300: rgb(
var(--spectrum-global-color-static-yellow-300-rgb)
);
--spectrum-global-color-static-yellow-400-rgb: 238, 205, 0;
--spectrum-global-color-static-yellow-400: rgb(
var(--spectrum-global-color-static-yellow-400-rgb)
);
--spectrum-global-color-static-yellow-500-rgb: 221, 185, 0;
--spectrum-global-color-static-yellow-500: rgb(
var(--spectrum-global-color-static-yellow-500-rgb)
);
--spectrum-global-color-static-yellow-600-rgb: 201, 164, 0;
--spectrum-global-color-static-yellow-600: rgb(
var(--spectrum-global-color-static-yellow-600-rgb)
);
--spectrum-global-color-static-yellow-700-rgb: 181, 144, 0;
--spectrum-global-color-static-yellow-700: rgb(
var(--spectrum-global-color-static-yellow-700-rgb)
);
--spectrum-global-color-static-yellow-800-rgb: 160, 125, 0;
--spectrum-global-color-static-yellow-800: rgb(
var(--spectrum-global-color-static-yellow-800-rgb)
);
--spectrum-global-color-static-chartreuse-300-rgb: 176, 222, 27;
--spectrum-global-color-static-chartreuse-300: rgb(
var(--spectrum-global-color-static-chartreuse-300-rgb)
);
--spectrum-global-color-static-chartreuse-400-rgb: 157, 203, 13;
--spectrum-global-color-static-chartreuse-400: rgb(
var(--spectrum-global-color-static-chartreuse-400-rgb)
);
--spectrum-global-color-static-chartreuse-500-rgb: 139, 182, 4;
--spectrum-global-color-static-chartreuse-500: rgb(
var(--spectrum-global-color-static-chartreuse-500-rgb)
);
--spectrum-global-color-static-chartreuse-600-rgb: 122, 162, 0;
--spectrum-global-color-static-chartreuse-600: rgb(
var(--spectrum-global-color-static-chartreuse-600-rgb)
);
--spectrum-global-color-static-chartreuse-700-rgb: 106, 141, 0;
--spectrum-global-color-static-chartreuse-700: rgb(
var(--spectrum-global-color-static-chartreuse-700-rgb)
);
--spectrum-global-color-static-chartreuse-800-rgb: 90, 120, 0;
--spectrum-global-color-static-chartreuse-800: rgb(
var(--spectrum-global-color-static-chartreuse-800-rgb)
);
--spectrum-global-color-static-celery-200-rgb: 126, 229, 114;
--spectrum-global-color-static-celery-200: rgb(
var(--spectrum-global-color-static-celery-200-rgb)
);
--spectrum-global-color-static-celery-300-rgb: 87, 212, 86;
--spectrum-global-color-static-celery-300: rgb(
var(--spectrum-global-color-static-celery-300-rgb)
);
--spectrum-global-color-static-celery-400-rgb: 48, 193, 61;
--spectrum-global-color-static-celery-400: rgb(
var(--spectrum-global-color-static-celery-400-rgb)
);
--spectrum-global-color-static-celery-500-rgb: 15, 172, 38;
--spectrum-global-color-static-celery-500: rgb(
var(--spectrum-global-color-static-celery-500-rgb)
);
--spectrum-global-color-static-celery-600-rgb: 0, 150, 20;
--spectrum-global-color-static-celery-600: rgb(
var(--spectrum-global-color-static-celery-600-rgb)
);
--spectrum-global-color-static-celery-700-rgb: 0, 128, 15;
--spectrum-global-color-static-celery-700: rgb(
var(--spectrum-global-color-static-celery-700-rgb)
);
--spectrum-global-color-static-celery-800-rgb: 0, 107, 15;
--spectrum-global-color-static-celery-800: rgb(
var(--spectrum-global-color-static-celery-800-rgb)
);
--spectrum-global-color-static-green-400-rgb: 29, 169, 115;
--spectrum-global-color-static-green-400: rgb(
var(--spectrum-global-color-static-green-400-rgb)
);
--spectrum-global-color-static-green-500-rgb: 0, 148, 97;
--spectrum-global-color-static-green-500: rgb(
var(--spectrum-global-color-static-green-500-rgb)
);
--spectrum-global-color-static-green-600-rgb: 0, 126, 80;
--spectrum-global-color-static-green-600: rgb(
var(--spectrum-global-color-static-green-600-rgb)
);
--spectrum-global-color-static-green-700-rgb: 0, 105, 65;
--spectrum-global-color-static-green-700: rgb(
var(--spectrum-global-color-static-green-700-rgb)
);
--spectrum-global-color-static-green-800-rgb: 0, 86, 53;
--spectrum-global-color-static-green-800: rgb(
var(--spectrum-global-color-static-green-800-rgb)
);
--spectrum-global-color-static-seafoam-200-rgb: 75, 206, 199;
--spectrum-global-color-static-seafoam-200: rgb(
var(--spectrum-global-color-static-seafoam-200-rgb)
);
--spectrum-global-color-static-seafoam-300-rgb: 32, 187, 180;
--spectrum-global-color-static-seafoam-300: rgb(
var(--spectrum-global-color-static-seafoam-300-rgb)
);
--spectrum-global-color-static-seafoam-400-rgb: 0, 166, 160;
--spectrum-global-color-static-seafoam-400: rgb(
var(--spectrum-global-color-static-seafoam-400-rgb)
);
--spectrum-global-color-static-seafoam-500-rgb: 0, 145, 139;
--spectrum-global-color-static-seafoam-500: rgb(
var(--spectrum-global-color-static-seafoam-500-rgb)
);
--spectrum-global-color-static-seafoam-600-rgb: 0, 124, 118;
--spectrum-global-color-static-seafoam-600: rgb(
var(--spectrum-global-color-static-seafoam-600-rgb)
);
--spectrum-global-color-static-seafoam-700-rgb: 0, 103, 99;
--spectrum-global-color-static-seafoam-700: rgb(
var(--spectrum-global-color-static-seafoam-700-rgb)
);
--spectrum-global-color-static-seafoam-800-rgb: 10, 83, 80;
--spectrum-global-color-static-seafoam-800: rgb(
var(--spectrum-global-color-static-seafoam-800-rgb)
);
--spectrum-global-color-static-blue-200-rgb: 130, 193, 251;
--spectrum-global-color-static-blue-200: rgb(
var(--spectrum-global-color-static-blue-200-rgb)
);
--spectrum-global-color-static-blue-300-rgb: 98, 173, 247;
--spectrum-global-color-static-blue-300: rgb(
var(--spectrum-global-color-static-blue-300-rgb)
);
--spectrum-global-color-static-blue-400-rgb: 66, 151, 244;
--spectrum-global-color-static-blue-400: rgb(
var(--spectrum-global-color-static-blue-400-rgb)
);
--spectrum-global-color-static-blue-500-rgb: 27, 127, 245;
--spectrum-global-color-static-blue-500: rgb(
var(--spectrum-global-color-static-blue-500-rgb)
);
--spectrum-global-color-static-blue-600-rgb: 4, 105, 227;
--spectrum-global-color-static-blue-600: rgb(
var(--spectrum-global-color-static-blue-600-rgb)
);
--spectrum-global-color-static-blue-700-rgb: 0, 87, 190;
--spectrum-global-color-static-blue-700: rgb(
var(--spectrum-global-color-static-blue-700-rgb)
);
--spectrum-global-color-static-blue-800-rgb: 0, 72, 153;
--spectrum-global-color-static-blue-800: rgb(
var(--spectrum-global-color-static-blue-800-rgb)
);
--spectrum-global-color-static-indigo-200-rgb: 178, 181, 255;
--spectrum-global-color-static-indigo-200: rgb(
var(--spectrum-global-color-static-indigo-200-rgb)
);
--spectrum-global-color-static-indigo-300-rgb: 155, 159, 255;
--spectrum-global-color-static-indigo-300: rgb(
var(--spectrum-global-color-static-indigo-300-rgb)
);
--spectrum-global-color-static-indigo-400-rgb: 132, 137, 253;
--spectrum-global-color-static-indigo-400: rgb(
var(--spectrum-global-color-static-indigo-400-rgb)
);
--spectrum-global-color-static-indigo-500-rgb: 109, 115, 246;
--spectrum-global-color-static-indigo-500: rgb(
var(--spectrum-global-color-static-indigo-500-rgb)
);
--spectrum-global-color-static-indigo-600-rgb: 87, 93, 232;
--spectrum-global-color-static-indigo-600: rgb(
var(--spectrum-global-color-static-indigo-600-rgb)
);
--spectrum-global-color-static-indigo-700-rgb: 68, 74, 208;
--spectrum-global-color-static-indigo-700: rgb(
var(--spectrum-global-color-static-indigo-700-rgb)
);
--spectrum-global-color-static-indigo-800-rgb: 68, 74, 208;
--spectrum-global-color-static-indigo-800: rgb(
var(--spectrum-global-color-static-indigo-800-rgb)
);
--spectrum-global-color-static-purple-400-rgb: 178, 121, 250;
--spectrum-global-color-static-purple-400: rgb(
var(--spectrum-global-color-static-purple-400-rgb)
);
--spectrum-global-color-static-purple-500-rgb: 161, 93, 246;
--spectrum-global-color-static-purple-500: rgb(
var(--spectrum-global-color-static-purple-500-rgb)
);
--spectrum-global-color-static-purple-600-rgb: 142, 67, 234;
--spectrum-global-color-static-purple-600: rgb(
var(--spectrum-global-color-static-purple-600-rgb)
);
--spectrum-global-color-static-purple-700-rgb: 120, 43, 216;
--spectrum-global-color-static-purple-700: rgb(
var(--spectrum-global-color-static-purple-700-rgb)
);
--spectrum-global-color-static-purple-800-rgb: 98, 23, 190;
--spectrum-global-color-static-purple-800: rgb(
var(--spectrum-global-color-static-purple-800-rgb)
);
--spectrum-global-color-static-fuchsia-400-rgb: 228, 93, 230;
--spectrum-global-color-static-fuchsia-400: rgb(
var(--spectrum-global-color-static-fuchsia-400-rgb)
);
--spectrum-global-color-static-fuchsia-500-rgb: 211, 63, 212;
--spectrum-global-color-static-fuchsia-500: rgb(
var(--spectrum-global-color-static-fuchsia-500-rgb)
);
--spectrum-global-color-static-fuchsia-600-rgb: 188, 39, 187;
--spectrum-global-color-static-fuchsia-600: rgb(
var(--spectrum-global-color-static-fuchsia-600-rgb)
);
--spectrum-global-color-static-fuchsia-700-rgb: 163, 10, 163;
--spectrum-global-color-static-fuchsia-700: rgb(
var(--spectrum-global-color-static-fuchsia-700-rgb)
);
--spectrum-global-color-static-fuchsia-800-rgb: 135, 0, 136;
--spectrum-global-color-static-fuchsia-800: rgb(
var(--spectrum-global-color-static-fuchsia-800-rgb)
);
--spectrum-global-color-static-magenta-200-rgb: 253, 127, 175;
--spectrum-global-color-static-magenta-200: rgb(
var(--spectrum-global-color-static-magenta-200-rgb)
);
--spectrum-global-color-static-magenta-300-rgb: 242, 98, 157;
--spectrum-global-color-static-magenta-300: rgb(
var(--spectrum-global-color-static-magenta-300-rgb)
);
--spectrum-global-color-static-magenta-400-rgb: 226, 68, 135;
--spectrum-global-color-static-magenta-400: rgb(
var(--spectrum-global-color-static-magenta-400-rgb)
);
--spectrum-global-color-static-magenta-500-rgb: 205, 40, 111;
--spectrum-global-color-static-magenta-500: rgb(
var(--spectrum-global-color-static-magenta-500-rgb)
);
--spectrum-global-color-static-magenta-600-rgb: 179, 15, 89;
--spectrum-global-color-static-magenta-600: rgb(
var(--spectrum-global-color-static-magenta-600-rgb)
);
--spectrum-global-color-static-magenta-700-rgb: 149, 0, 72;
--spectrum-global-color-static-magenta-700: rgb(
var(--spectrum-global-color-static-magenta-700-rgb)
);
--spectrum-global-color-static-magenta-800-rgb: 119, 0, 58;
--spectrum-global-color-static-magenta-800: rgb(
var(--spectrum-global-color-static-magenta-800-rgb)
);
--spectrum-global-color-static-transparent-white-200: #ffffff1a;
--spectrum-global-color-static-transparent-white-300: #ffffff40;
--spectrum-global-color-static-transparent-white-400: #fff6;
--spectrum-global-color-static-transparent-white-500: #ffffff8c;
--spectrum-global-color-static-transparent-white-600: #ffffffb3;
--spectrum-global-color-static-transparent-white-700: #fffc;
--spectrum-global-color-static-transparent-white-800: #ffffffe6;
--spectrum-global-color-static-transparent-white-900-rgb: 255, 255, 255;
--spectrum-global-color-static-transparent-white-900: rgb(
var(--spectrum-global-color-static-transparent-white-900-rgb)
);
--spectrum-global-color-static-transparent-black-200: #0000001a;
--spectrum-global-color-static-transparent-black-300: #00000040;
--spectrum-global-color-static-transparent-black-400: #0006;
--spectrum-global-color-static-transparent-black-500: #0000008c;
--spectrum-global-color-static-transparent-black-600: #000000b3;
--spectrum-global-color-static-transparent-black-700: #000c;
--spectrum-global-color-static-transparent-black-800: #000000e6;
--spectrum-global-color-static-transparent-black-900-rgb: 0, 0, 0;
--spectrum-global-color-static-transparent-black-900: rgb(
var(--spectrum-global-color-static-transparent-black-900-rgb)
);
--spectrum-global-color-sequential-cerulean: #e9fff1, #c8f1e4, #a5e3d7,
#82d5ca, #68c5c1, #54b4ba, #3fa2b2, #2991ac, #2280a2, #1f6d98, #1d5c8d,
#1a4b83, #1a3979, #1a266f, #191264, #180057;
--spectrum-global-color-sequential-forest: #ffffdf, #e2f6ba, #c4eb95,
#a4e16d, #8dd366, #77c460, #5fb65a, #48a754, #36984f, #2c894d, #237a4a,
#196b47, #105c45, #094d41, #033f3e, #00313a;
--spectrum-global-color-sequential-rose: #fff4dd, #ffddd7, #ffc5d2, #feaecb,
#fa96c4, #f57ebd, #ef64b5, #e846ad, #d238a1, #bb2e96, #a3248c, #8a1b83,
#71167c, #560f74, #370b6e, #000968;
--spectrum-global-color-diverging-orange-yellow-seafoam: #580000, #79260b,
#9c4511, #bd651a, #dd8629, #f5ad52, #fed693, #ffffe0, #bbe4d1, #76c7be,
#3ea8a6, #208288, #076769, #00494b, #002c2d;
--spectrum-global-color-diverging-red-yellow-blue: #4a001e, #751232, #a52747,
#c65154, #e47961, #f0a882, #fad4ac, #ffffe0, #bce2cf, #89c0c4, #579eb9,
#397aa8, #1c5796, #163771, #10194d;
--spectrum-global-color-diverging-red-blue: #4a001e, #731331, #9f2945,
#cc415a, #e06e85, #ed9ab0, #f8c3d9, #faf0ff, #c6d0f2, #92b2de, #5d94cb,
#2f74b3, #265191, #163670, #0b194c;
--spectrum-semantic-cta-background-color-default: var(
--spectrum-global-color-static-indigo-600
);
--spectrum-semantic-cta-background-color-hover: var(
--spectrum-global-color-static-indigo-700
);
--spectrum-semantic-cta-background-color-down: var(
--spectrum-global-color-static-indigo-800
);
--spectrum-semantic-cta-background-color-key-focus: var(
--spectrum-global-color-static-indigo-700
);
--spectrum-semantic-emphasized-border-color-default: var(
--spectrum-global-color-indigo-500
);
--spectrum-semantic-emphasized-border-color-hover: var(
--spectrum-global-color-indigo-600
);
--spectrum-semantic-emphasized-border-color-down: var(
--spectrum-global-color-indigo-700
);
--spectrum-semantic-emphasized-border-color-key-focus: var(
--spectrum-global-color-indigo-600
);
--spectrum-semantic-neutral-background-color-default: var(
--spectrum-global-color-static-gray-800
);
--spectrum-semantic-negative-background-color: var(
--spectrum-global-color-static-red-600
);
--spectrum-semantic-negative-color-default: var(
--spectrum-global-color-red-500
);
--spectrum-semantic-negative-color-hover: var(
--spectrum-global-color-red-600
);
--spectrum-semantic-negative-color-dark: var(
--spectrum-global-color-red-600
);
--spectrum-semantic-negative-border-color: var(
--spectrum-global-color-red-400
);
--spectrum-semantic-negative-icon-color: var(
--spectrum-global-color-red-600
);
--spectrum-semantic-negative-status-color: var(
--spectrum-global-color-red-400
);
--spectrum-semantic-negative-text-color-large: var(
--spectrum-global-color-red-500
);
--spectrum-semantic-negative-text-color-small: var(
--spectrum-global-color-red-600
);
--spectrum-semantic-negative-text-color-small-hover: var(
--spectrum-global-color-red-700
);
--spectrum-semantic-negative-text-color-small-down: var(
--spectrum-global-color-red-700
);
--spectrum-semantic-negative-text-color-small-key-focus: var(
--spectrum-global-color-red-600
);
--spectrum-semantic-negative-color-down: var(
--spectrum-global-color-red-700
);
--spectrum-semantic-negative-color-key-focus: var(
--spectrum-global-color-red-400
);
--spectrum-semantic-negative-background-color-default: var(
--spectrum-global-color-static-red-600
);
--spectrum-semantic-negative-background-color-hover: var(
--spectrum-global-color-static-red-700
);
--spectrum-semantic-negative-background-color-down: var(
--spectrum-global-color-static-red-800
);
--spectrum-semantic-negative-background-color-key-focus: var(
--spectrum-global-color-static-red-700
);
--spectrum-semantic-notice-background-color: var(
--spectrum-global-color-static-orange-600
);
--spectrum-semantic-notice-color-default: var(
--spectrum-global-color-orange-500
);
--spectrum-semantic-notice-color-dark: var(
--spectrum-global-color-orange-600
);
--spectrum-semantic-notice-border-color: var(
--spectrum-global-color-orange-400
);
--spectrum-semantic-notice-icon-color: var(
--spectrum-global-color-orange-600
);
--spectrum-semantic-notice-status-color: var(
--spectrum-global-color-orange-400
);
--spectrum-semantic-notice-text-color-large: var(
--spectrum-global-color-orange-500
);
--spectrum-semantic-notice-text-color-small: var(
--spectrum-global-color-orange-600
);
--spectrum-semantic-notice-color-down: var(
--spectrum-global-color-orange-700
);
--spectrum-semantic-notice-color-key-focus: var(
--spectrum-global-color-orange-400
);
--spectrum-semantic-notice-background-color-default: var(
--spectrum-global-color-static-orange-600
);
--spectrum-semantic-notice-background-color-hover: var(
--spectrum-global-color-static-orange-700
);
--spectrum-semantic-notice-background-color-down: var(
--spectrum-global-color-static-orange-800
);
--spectrum-semantic-notice-background-color-key-focus: var(
--spectrum-global-color-static-orange-700
);
--spectrum-semantic-positive-background-color: var(
--spectrum-global-color-static-green-600
);
--spectrum-semantic-positive-color-default: var(
--spectrum-global-color-green-500
);
--spectrum-semantic-positive-color-dark: var(
--spectrum-global-color-green-600
);
--spectrum-semantic-positive-border-color: var(
--spectrum-global-color-green-400
);
--spectrum-semantic-positive-icon-color: var(
--spectrum-global-color-green-600
);
--spectrum-semantic-positive-status-color: var(
--spectrum-global-color-green-400
);
--spectrum-semantic-positive-text-color-large: var(
--spectrum-global-color-green-500
);
--spectrum-semantic-positive-text-color-small: var(
--spectrum-global-color-green-600
);
--spectrum-semantic-positive-color-down: var(
--spectrum-global-color-green-700
);
--spectrum-semantic-positive-color-key-focus: var(
--spectrum-global-color-green-400
);
--spectrum-semantic-positive-background-color-default: var(
--spectrum-global-color-static-green-600
);
--spectrum-semantic-positive-background-color-hover: var(
--spectrum-global-color-static-green-700
);
--spectrum-semantic-positive-background-color-down: var(
--spectrum-global-color-static-green-800
);
--spectrum-semantic-positive-background-color-key-focus: var(
--spectrum-global-color-static-green-700
);
--spectrum-semantic-informative-background-color: var(
--spectrum-global-color-static-blue-600
);
--spectrum-semantic-informative-color-default: var(
--spectrum-global-color-blue-500
);
--spectrum-semantic-informative-color-dark: var(
--spectrum-global-color-blue-600
);
--spectrum-semantic-informative-border-color: var(
--spectrum-global-color-blue-400
);
--spectrum-semantic-informative-icon-color: var(
--spectrum-global-color-blue-600
);
--spectrum-semantic-informative-status-color: var(
--spectrum-global-color-blue-400
);
--spectrum-semantic-informative-text-color-large: var(
--spectrum-global-color-blue-500
);
--spectrum-semantic-informative-text-color-small: var(
--spectrum-global-color-blue-600
);
--spectrum-semantic-informative-color-down: var(
--spectrum-global-color-blue-700
);
--spectrum-semantic-informative-color-key-focus: var(
--spectrum-global-color-blue-400
);
--spectrum-semantic-informative-background-color-default: var(
--spectrum-global-color-static-blue-600
);
--spectrum-semantic-informative-background-color-hover: var(
--spectrum-global-color-static-blue-700
);
--spectrum-semantic-informative-background-color-down: var(
--spectrum-global-color-static-blue-800
);
--spectrum-semantic-informative-background-color-key-focus: var(
--spectrum-global-color-static-blue-700
);
--spectrum-semantic-neutral-background-color-hover: var(
--spectrum-global-color-static-gray-800
);
--spectrum-semantic-neutral-background-color-down: var(
--spectrum-global-color-static-gray-900
);
--spectrum-semantic-neutral-background-color-key-focus: var(
--spectrum-global-color-static-gray-800
);
--spectrum-semantic-presence-color-1: var(
--spectrum-global-color-static-red-500
);
--spectrum-semantic-presence-color-2: var(
--spectrum-global-color-static-orange-400
);
--spectrum-semantic-presence-color-3: var(
--spectrum-global-color-static-yellow-400
);
--spectrum-semantic-presence-color-4-rgb: 75, 204, 162;
--spectrum-semantic-presence-color-4: rgb(
var(--spectrum-semantic-presence-color-4-rgb)
);
--spectrum-semantic-presence-color-5-rgb: 0, 199, 255;
--spectrum-semantic-presence-color-5: rgb(
var(--spectrum-semantic-presence-color-5-rgb)
);
--spectrum-semantic-presence-color-6-rgb: 0, 140, 184;
--spectrum-semantic-presence-color-6: rgb(
var(--spectrum-semantic-presence-color-6-rgb)
);
--spectrum-semantic-presence-color-7-rgb: 126, 75, 243;
--spectrum-semantic-presence-color-7: rgb(
var(--spectrum-semantic-presence-color-7-rgb)
);
--spectrum-semantic-presence-color-8: var(
--spectrum-global-color-static-fuchsia-600
);
--spectrum-global-dimension-static-percent-50: 50%;
--spectrum-global-dimension-static-percent-70: 70%;
--spectrum-global-dimension-static-percent-100: 100%;
--spectrum-global-dimension-static-breakpoint-xsmall: 304px;
--spectrum-global-dimension-static-breakpoint-small: 768px;
--spectrum-global-dimension-static-breakpoint-medium: 1280px;
--spectrum-global-dimension-static-breakpoint-large: 1768px;
--spectrum-global-dimension-static-breakpoint-xlarge: 2160px;
--spectrum-global-dimension-static-grid-columns: 12;
--spectrum-global-dimension-static-grid-fluid-width: 100%;
--spectrum-global-dimension-static-grid-fixed-max-width: 1280px;
--spectrum-global-dimension-static-size-0: 0px;
--spectrum-global-dimension-static-size-10: 1px;
--spectrum-global-dimension-static-size-25: 2px;
--spectrum-global-dimension-static-size-40: 3px;
--spectrum-global-dimension-static-size-50: 4px;
--spectrum-global-dimension-static-size-65: 5px;
--spectrum-global-dimension-static-size-75: 6px;
--spectrum-global-dimension-static-size-85: 7px;
--spectrum-global-dimension-static-size-100: 8px;
--spectrum-global-dimension-static-size-115: 9px;
--spectrum-global-dimension-static-size-125: 10px;
--spectrum-global-dimension-static-size-130: 11px;
--spectrum-global-dimension-static-size-150: 12px;
--spectrum-global-dimension-static-size-160: 13px;
--spectrum-global-dimension-static-size-175: 14px;
--spectrum-global-dimension-static-size-185: 15px;
--spectrum-global-dimension-static-size-200: 16px;
--spectrum-global-dimension-static-size-225: 18px;
--spectrum-global-dimension-static-size-250: 20px;
--spectrum-global-dimension-static-size-275: 22px;
--spectrum-global-dimension-static-size-300: 24px;
--spectrum-global-dimension-static-size-325: 26px;
--spectrum-global-dimension-static-size-350: 28px;
--spectrum-global-dimension-static-size-400: 32px;
--spectrum-global-dimension-static-size-450: 36px;
--spectrum-global-dimension-static-size-500: 40px;
--spectrum-global-dimension-static-size-550: 44px;
--spectrum-global-dimension-static-size-600: 48px;
--spectrum-global-dimension-static-size-700: 56px;
--spectrum-global-dimension-static-size-800: 64px;
--spectrum-global-dimension-static-size-900: 72px;
--spectrum-global-dimension-static-size-1000: 80px;
--spectrum-global-dimension-static-size-1200: 96px;
--spectrum-global-dimension-static-size-1700: 136px;
--spectrum-global-dimension-static-size-2400: 192px;
--spectrum-global-dimension-static-size-2500: 200px;
--spectrum-global-dimension-static-size-2600: 208px;
--spectrum-global-dimension-static-size-2800: 224px;
--spectrum-global-dimension-static-size-3200: 256px;
--spectrum-global-dimension-static-size-3400: 272px;
--spectrum-global-dimension-static-size-3500: 280px;
--spectrum-global-dimension-static-size-3600: 288px;
--spectrum-global-dimension-static-size-3800: 304px;
--spectrum-global-dimension-static-size-4600: 368px;
--spectrum-global-dimension-static-size-5000: 400px;
--spectrum-global-dimension-static-size-6000: 480px;
--spectrum-global-dimension-static-size-16000: 1280px;
--spectrum-global-dimension-static-font-size-50: 11px;
--spectrum-global-dimension-static-font-size-75: 12px;
--spectrum-global-dimension-static-font-size-100: 14px;
--spectrum-global-dimension-static-font-size-150: 15px;
--spectrum-global-dimension-static-font-size-200: 16px;
--spectrum-global-dimension-static-font-size-300: 18px;
--spectrum-global-dimension-static-font-size-400: 20px;
--spectrum-global-dimension-static-font-size-500: 22px;
--spectrum-global-dimension-static-font-size-600: 25px;
--spectrum-global-dimension-static-font-size-700: 28px;
--spectrum-global-dimension-static-font-size-800: 32px;
--spectrum-global-dimension-static-font-size-900: 36px;
--spectrum-global-dimension-static-font-size-1000: 40px;
--spectrum-global-font-family-base: adobe-clean, 'Source Sans Pro',
-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Ubuntu,
'Trebuchet MS', 'Lucida Grande', sans-serif;
--spectrum-global-font-family-serif: adobe-clean-serif, 'Source Serif Pro',
Georgia, serif;
--spectrum-global-font-family-code: 'Source Code Pro', Monaco, monospace;
--spectrum-global-font-weight-thin: 100;
--spectrum-global-font-weight-ultra-light: 200;
--spectrum-global-font-weight-light: 300;
--spectrum-global-font-weight-regular: 400;
--spectrum-global-font-weight-medium: 500;
--spectrum-global-font-weight-semi-bold: 600;
--spectrum-global-font-weight-bold: 700;
--spectrum-global-font-weight-extra-bold: 800;
--spectrum-global-font-weight-black: 900;
--spectrum-global-font-style-regular: normal;
--spectrum-global-font-style-italic: italic;
--spectrum-global-font-letter-spacing-none: 0;
--spectrum-global-font-letter-spacing-small: 0.0125em;
--spectrum-global-font-letter-spacing-han: 0.05em;
--spectrum-global-font-letter-spacing-medium: 0.06em;
--spectrum-global-font-line-height-large: 1.7;
--spectrum-global-font-line-height-medium: 1.5;
--spectrum-global-font-line-height-small: 1.3;
--spectrum-global-font-multiplier-0: 0em;
--spectrum-global-font-multiplier-25: 0.25em;
--spectrum-global-font-multiplier-75: 0.75em;
--spectrum-global-font-font-family-ar: myriad-arabic, adobe-clean,
'Source Sans Pro', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
Ubuntu, 'Trebuchet MS', 'Lucida Grande', sans-serif;
--spectrum-global-font-font-family-he: myriad-hebrew, adobe-clean,
'Source Sans Pro', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
Ubuntu, 'Trebuchet MS', 'Lucida Grande', sans-serif;
--spectrum-global-font-font-family-zh: adobe-clean-han-traditional,
source-han-traditional, 'MingLiu', 'Heiti TC Light', 'sans-serif';
--spectrum-global-font-font-family-zhhans: adobe-clean-han-simplified-c,
source-han-simplified-c, 'SimSun', 'Heiti SC Light', 'sans-serif';
--spectrum-global-font-font-family-ko: adobe-clean-han-korean,
source-han-korean, 'Malgun Gothic', 'Apple Gothic', 'sans-serif';
--spectrum-global-font-font-family-ja: adobe-clean-han-japanese,
'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'Osaka', YuGothic,
'Yu Gothic', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic',
'sans-serif';
--spectrum-global-font-font-family-condensed: adobe-clean-han-traditional,
source-han-traditional, 'MingLiu', 'Heiti TC Light', adobe-clean,
'Source Sans Pro', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
Ubuntu, 'Trebuchet MS', 'Lucida Grande', sans-serif;
--spectrum-alias-border-size-thin: var(
--spectrum-global-dimension-static-size-10
);
--spectrum-alias-border-size-thick: var(
--spectrum-global-dimension-static-size-25
);
--spectrum-alias-border-size-thicker: var(
--spectrum-global-dimension-static-size-50
);
--spectrum-alias-border-size-thickest: var(
--spectrum-global-dimension-static-size-100
);
--spectrum-alias-border-offset-thin: var(
--spectrum-global-dimension-static-size-25
);
--spectrum-alias-border-offset-thick: var(
--spectrum-global-dimension-static-size-50
);
--spectrum-alias-border-offset-thicker: var(
--spectrum-global-dimension-static-size-100
);
--spectrum-alias-border-offset-thickest: var(
--spectrum-global-dimension-static-size-200
);
--spectrum-alias-grid-baseline: var(
--spectrum-global-dimension-static-size-100
);
--spectrum-alias-grid-gutter-xsmall: var(
--spectrum-global-dimension-static-size-200
);
--spectrum-alias-grid-gutter-small: var(
--spectrum-global-dimension-static-size-300
);
--spectrum-alias-grid-gutter-medium: var(
--spectrum-global-dimension-static-size-400
);
--spectrum-alias-grid-gutter-large: var(
--spectrum-global-dimension-static-size-500
);
--spectrum-alias-grid-gutter-xlarge: var(
--spectrum-global-dimension-static-size-600
);
--spectrum-alias-grid-margin-xsmall: var(
--spectrum-global-dimension-static-size-200
);
--spectrum-alias-grid-margin-small: var(
--spectrum-global-dimension-static-size-300
);
--spectrum-alias-grid-margin-medium: var(
--spectrum-global-dimension-static-size-400
);
--spectrum-alias-grid-margin-large: var(
--spectrum-global-dimension-static-size-500
);
--spectrum-alias-grid-margin-xlarge: var(
--spectrum-global-dimension-static-size-600
);
--spectrum-alias-grid-layout-region-margin-bottom-xsmall: var(
--spectrum-global-dimension-static-size-200
);
--spectrum-alias-grid-layout-region-margin-bottom-small: var(
--spectrum-global-dimension-static-size-300
);
--spectrum-alias-grid-layout-region-margin-bottom-medium: var(
--spectrum-global-dimension-static-size-400
);
--spectrum-alias-grid-layout-region-margin-bottom-large: var(
--spectrum-global-dimension-static-size-500
);
--spectrum-alias-grid-layout-region-margin-bottom-xlarge: var(
--spectrum-global-dimension-static-size-600
);
--spectrum-alias-radial-reaction-size-default: var(
--spectrum-global-dimension-static-size-550
);
--spectrum-alias-focus-ring-gap: var(
--spectrum-global-dimension-static-size-25
);
--spectrum-alias-focus-ring-size: var(
--spectrum-global-dimension-static-size-25
);
--spectrum-alias-loupe-entry-animation-duration: var(
--spectrum-global-animation-duration-300
);
--spectrum-alias-loupe-exit-animation-duration: var(
--spectrum-global-animation-duration-300
);
--spectrum-alias-heading-text-font-weight-regular: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-heading-text-font-weight-heavy: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-heading-text-line-height: var(
--spectrum-global-font-line-height-small
);
--spectrum-alias-heading-text-font-weight-regular-strong: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-heading-text-font-weight-light: var(
--spectrum-global-font-weight-light
);
--spectrum-alias-heading-text-font-weight-light-strong: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-heading-text-font-weight-heavy-strong: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-heading-text-font-weight-quiet: var(
--spectrum-global-font-weight-light
);
--spectrum-alias-heading-text-font-weight-quiet-strong: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-heading-text-font-weight-strong: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-heading-text-font-weight-strong-strong: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-heading-margin-bottom: var(
--spectrum-global-font-multiplier-25
);
--spectrum-alias-subheading-text-font-weight: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-subheading-text-font-weight-strong: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-body-text-font-family: var(
--spectrum-global-font-family-base
);
--spectrum-alias-body-text-line-height: var(
--spectrum-global-font-line-height-medium
);
--spectrum-alias-body-text-font-weight: var(
--spectrum-global-font-weight-regular
);
--spectrum-alias-body-text-font-weight-strong: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-body-margin-bottom: var(
--spectrum-global-font-multiplier-75
);
--spectrum-alias-detail-text-font-weight: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-detail-text-font-weight-regular: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-detail-text-font-weight-light: var(
--spectrum-global-font-weight-regular
);
--spectrum-alias-detail-text-font-weight-strong: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-article-heading-text-font-weight: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-article-heading-text-font-weight-strong: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-article-heading-text-font-weight-quiet: var(
--spectrum-global-font-weight-regular
);
--spectrum-alias-article-heading-text-font-weight-quiet-strong: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-article-body-text-font-weight: var(
--spectrum-global-font-weight-regular
);
--spectrum-alias-article-body-text-font-weight-strong: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-article-subheading-text-font-weight: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-article-subheading-text-font-weight-strong: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-article-detail-text-font-weight: var(
--spectrum-global-font-weight-regular
);
--spectrum-alias-article-detail-text-font-weight-strong: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-code-text-font-family: var(
--spectrum-global-font-family-code
);
--spectrum-alias-code-text-font-weight-regular: var(
--spectrum-global-font-weight-regular
);
--spectrum-alias-code-text-font-weight-strong: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-code-text-line-height: var(
--spectrum-global-font-line-height-medium
);
--spectrum-alias-code-margin-bottom: var(
--spectrum-global-font-multiplier-0
);
--spectrum-alias-font-family-ar: var(--spectrum-global-font-font-family-ar);
--spectrum-alias-font-family-he: var(--spectrum-global-font-font-family-he);
--spectrum-alias-font-family-zh: var(--spectrum-global-font-font-family-zh);
--spectrum-alias-font-family-zhhans: var(
--spectrum-global-font-font-family-zhhans
);
--spectrum-alias-font-family-ko: var(--spectrum-global-font-font-family-ko);
--spectrum-alias-font-family-ja: var(--spectrum-global-font-font-family-ja);
--spectrum-alias-font-family-condensed: var(
--spectrum-global-font-font-family-condensed
);
--spectrum-alias-button-text-line-height: var(
--spectrum-global-font-line-height-small
);
--spectrum-alias-component-text-line-height: var(
--spectrum-global-font-line-height-small
);
--spectrum-alias-han-component-text-line-height: var(
--spectrum-global-font-line-height-medium
);
--spectrum-alias-serif-text-font-family: var(
--spectrum-global-font-family-serif
);
--spectrum-alias-han-heading-text-line-height: var(
--spectrum-global-font-line-height-medium
);
--spectrum-alias-han-heading-text-font-weight-regular: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-han-heading-text-font-weight-regular-emphasis: var(
--spectrum-global-font-weight-extra-bold
);
--spectrum-alias-han-heading-text-font-weight-regular-strong: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-han-heading-text-font-weight-quiet-strong: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-han-heading-text-font-weight-light: var(
--spectrum-global-font-weight-light
);
--spectrum-alias-han-heading-text-font-weight-light-emphasis: var(
--spectrum-global-font-weight-regular
);
--spectrum-alias-han-heading-text-font-weight-light-strong: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-han-heading-text-font-weight-heavy: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-han-heading-text-font-weight-heavy-emphasis: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-han-heading-text-font-weight-heavy-strong: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-han-body-text-line-height: var(
--spectrum-global-font-line-height-large
);
--spectrum-alias-han-body-text-font-weight-regular: var(
--spectrum-global-font-weight-regular
);
--spectrum-alias-han-body-text-font-weight-emphasis: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-han-body-text-font-weight-strong: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-han-subheading-text-font-weight-regular: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-han-subheading-text-font-weight-emphasis: var(
--spectrum-global-font-weight-extra-bold
);
--spectrum-alias-han-subheading-text-font-weight-strong: var(
--spectrum-global-font-weight-black
);
--spectrum-alias-han-detail-text-font-weight: var(
--spectrum-global-font-weight-regular
);
--spectrum-alias-han-detail-text-font-weight-emphasis: var(
--spectrum-global-font-weight-bold
);
--spectrum-alias-han-detail-text-font-weight-strong: var(
--spectrum-global-font-weight-black
);
}
:root,
:host {
--spectrum-alias-item-height-s: var(--spectrum-global-dimension-size-300);
--spectrum-alias-item-height-m: var(--spectrum-global-dimension-size-400);
--spectrum-alias-item-height-l: var(--spectrum-global-dimension-size-500);
--spectrum-alias-item-height-xl: var(--spectrum-global-dimension-size-600);
--spectrum-alias-item-rounded-border-radius-s: var(
--spectrum-global-dimension-size-150
);
--spectrum-alias-item-rounded-border-radius-m: var(
--spectrum-global-dimension-size-200
);
--spectrum-alias-item-rounded-border-radius-l: var(
--spectrum-global-dimension-size-250
);
--spectrum-alias-item-rounded-border-radius-xl: var(
--spectrum-global-dimension-size-300
);
--spectrum-alias-item-text-size-s: var(
--spectrum-global-dimension-font-size-75
);
--spectrum-alias-item-text-size-m: var(
--spectrum-global-dimension-font-size-100
);
--spectrum-alias-item-text-size-l: var(
--spectrum-global-dimension-font-size-200
);
--spectrum-alias-item-text-size-xl: var(
--spectrum-global-dimension-font-size-300
);
--spectrum-alias-item-text-padding-top-s: var(
--spectrum-global-dimension-static-size-50
);
--spectrum-alias-item-text-padding-top-m: var(
--spectrum-global-dimension-size-75
);
--spectrum-alias-item-text-padding-top-xl: var(
--spectrum-global-dimension-size-150
);
--spectrum-alias-item-text-padding-bottom-m: var(
--spectrum-global-dimension-size-115
);
--spectrum-alias-item-text-padding-bottom-l: var(
--spectrum-global-dimension-size-130
);
--spectrum-alias-item-text-padding-bottom-xl: var(
--spectrum-global-dimension-size-175
);
--spectrum-alias-item-icon-padding-top-s: var(
--spectrum-global-dimension-size-50
);
--spectrum-alias-item-icon-padding-top-m: var(
--spectrum-global-dimension-size-85
);
--spectrum-alias-item-icon-padding-top-l: var(
--spectrum-global-dimension-size-125
);
--spectrum-alias-item-icon-padding-top-xl: var(
--spectrum-global-dimension-size-160
);
--spectrum-alias-item-icon-padding-bottom-s: var(
--spectrum-global-dimension-size-50
);
--spectrum-alias-item-icon-padding-bottom-m: var(
--spectrum-global-dimension-size-85
);
--spectrum-alias-item-icon-padding-bottom-l: var(
--spectrum-global-dimension-size-125
);
--spectrum-alias-item-icon-padding-bottom-xl: var(
--spectrum-global-dimension-size-160
);
--spectrum-alias-item-padding-s: var(--spectrum-global-dimension-size-115);
--spectrum-alias-item-padding-m: var(--spectrum-global-dimension-size-150);
--spectrum-alias-item-padding-l: var(--spectrum-global-dimension-size-185);
--spectrum-alias-item-padding-xl: var(--spectrum-global-dimension-size-225);
--spectrum-alias-item-rounded-padding-s: var(
--spectrum-global-dimension-size-150
);
--spectrum-alias-item-rounded-padding-m: var(
--spectrum-global-dimension-size-200
);
--spectrum-alias-item-rounded-padding-l: var(
--spectrum-global-dimension-size-250
);
--spectrum-alias-item-rounded-padding-xl: var(
--spectrum-global-dimension-size-300
);
--spectrum-alias-item-icononly-padding-s: var(
--spectrum-global-dimension-size-50
);
--spectrum-alias-item-icononly-padding-m: var(
--spectrum-global-dimension-size-85
);
--spectrum-alias-item-icononly-padding-l: var(
--spectrum-global-dimension-size-125
);
--spectrum-alias-item-icononly-padding-xl: var(
--spectrum-global-dimension-size-160
);
--spectrum-alias-item-control-gap-s: var(
--spectrum-global-dimension-size-115
);
--spe