, which makes no sense
+*/
+.spectrum,
+.spectrum-Body {
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: normal;
+}
+.spectrum-Body--italic {
+ font-style: italic;
+}
+.spectrum-Icon {
+ display: inline-block;
+
+ /* Inherit the text color */
+ color: inherit;
+
+ /* Fill should match the current text color */
+ fill: currentColor;
+
+ /* Don't catch clicks or hover, otherwise they may not escape the SVG */
+ pointer-events: none;
+}
+/* Hide the svg overflow in IE. */
+.spectrum-Icon:not(:root) {
+ overflow: hidden;
+ }
+.spectrum-Icon--sizeXXS,
+ .spectrum-Icon--sizeXXS img,
+ .spectrum-Icon--sizeXXS svg {
+ height: 9px;
+ width: 9px;
+ }
+.spectrum-Icon--sizeXS,
+ .spectrum-Icon--sizeXS img,
+ .spectrum-Icon--sizeXS svg {
+ height: 12px;
+ width: 12px;
+ }
+.spectrum-Icon--sizeS,
+ .spectrum-Icon--sizeS img,
+ .spectrum-Icon--sizeS svg {
+ height: 18px;
+ width: 18px;
+ }
+.spectrum-Icon--sizeM,
+ .spectrum-Icon--sizeM img,
+ .spectrum-Icon--sizeM svg {
+ height: 24px;
+ width: 24px;
+ }
+.spectrum-Icon--sizeL,
+ .spectrum-Icon--sizeL img,
+ .spectrum-Icon--sizeL svg {
+ height: 36px;
+ width: 36px;
+ }
+.spectrum-Icon--sizeXL,
+ .spectrum-Icon--sizeXL img,
+ .spectrum-Icon--sizeXL svg {
+ height: 48px;
+ width: 48px;
+ }
+.spectrum-Icon--sizeXXL,
+ .spectrum-Icon--sizeXXL img,
+ .spectrum-Icon--sizeXXL svg {
+ height: 72px;
+ width: 72px;
+ }
+/* Hide UI icons on older browsers with SVG 1.1 implementations */
+.spectrum--medium .spectrum-UIIcon--large {
+ display: none;
+ }
+.spectrum--medium .spectrum-UIIcon--medium {
+ display: inline;
+ }
+.spectrum--large .spectrum-UIIcon--medium {
+ display: none;
+ }
+.spectrum--large .spectrum-UIIcon--large {
+ display: inline;
+ }
+/* Hide UI icons on browsers that implement SVG 2 correctly (Firefox 56+) */
+.spectrum--large {
+ --ui-icon-large-display: block;
+ --ui-icon-medium-display: none;
+}
+.spectrum--medium {
+ --ui-icon-medium-display: block;
+ --ui-icon-large-display: none;
+}
+.spectrum-UIIcon--large {
+ display: var(--ui-icon-large-display);
+}
+.spectrum-UIIcon--medium {
+ display: var(--ui-icon-medium-display);
+}
+/* UI Icons */
+.spectrum-UIIcon-AlertMedium {
+ width: 18px;
+ height: 18px;
+}
+.spectrum-UIIcon-AlertSmall {
+ width: 14px;
+ height: 14px;
+}
+.spectrum-UIIcon-ArrowDownSmall {
+ width: 8px;
+ height: 10px;
+}
+.spectrum-UIIcon-ArrowLeftMedium {
+ width: 14px;
+ height: 10px;
+}
+.spectrum-UIIcon-Asterisk {
+ width: 8px;
+ height: 8px;
+}
+.spectrum-UIIcon-CheckmarkMedium {
+ width: 12px;
+ height: 12px;
+}
+.spectrum-UIIcon-CheckmarkSmall {
+ width: 10px;
+ height: 10px;
+}
+.spectrum-UIIcon-ChevronDownMedium {
+ width: 10px;
+ height: 6px;
+}
+.spectrum-UIIcon-ChevronDownSmall {
+ width: 8px;
+ height: 6px;
+}
+.spectrum-UIIcon-ChevronLeftLarge {
+ width: 12px;
+ height: 16px;
+}
+.spectrum-UIIcon-ChevronLeftMedium {
+ width: 6px;
+ height: 10px;
+}
+.spectrum-UIIcon-ChevronRightLarge {
+ width: 12px;
+ height: 16px;
+}
+.spectrum-UIIcon-ChevronRightMedium {
+ width: 6px;
+ height: 10px;
+}
+.spectrum-UIIcon-ChevronRightSmall {
+ width: 6px;
+ height: 8px;
+}
+.spectrum-UIIcon-ChevronUpSmall {
+ width: 8px;
+ height: 6px;
+}
+.spectrum-UIIcon-CornerTriangle {
+ width: 5px;
+ height: 5px;
+}
+.spectrum-UIIcon-CrossLarge {
+ width: 12px;
+ height: 12px;
+}
+.spectrum-UIIcon-CrossMedium {
+ width: 8px;
+ height: 8px;
+}
+.spectrum-UIIcon-CrossSmall {
+ width: 8px;
+ height: 8px;
+}
+.spectrum-UIIcon-DashSmall {
+ width: 10px;
+ height: 10px;
+}
+.spectrum-UIIcon-DoubleGripper {
+ width: 16px;
+ height: 4px;
+}
+.spectrum-UIIcon-HelpMedium {
+ width: 18px;
+ height: 18px;
+}
+.spectrum-UIIcon-HelpSmall {
+ width: 14px;
+ height: 14px;
+}
+.spectrum-UIIcon-InfoMedium {
+ width: 18px;
+ height: 18px;
+}
+.spectrum-UIIcon-InfoSmall {
+ width: 14px;
+ height: 14px;
+}
+.spectrum-UIIcon-Magnifier {
+ width: 16px;
+ height: 16px;
+}
+.spectrum-UIIcon-SkipLeft {
+ width: 9px;
+ height: 10px;
+}
+.spectrum-UIIcon-SkipRight {
+ width: 9px;
+ height: 10px;
+}
+.spectrum-UIIcon-Star {
+ width: 18px;
+ height: 18px;
+}
+.spectrum-UIIcon-StarOutline {
+ width: 18px;
+ height: 18px;
+}
+.spectrum-UIIcon-SuccessMedium {
+ width: 18px;
+ height: 18px;
+}
+.spectrum-UIIcon-SuccessSmall {
+ width: 14px;
+ height: 14px;
+}
+.spectrum-UIIcon-TripleGripper {
+ width: 10px;
+ height: 7px;
+}
+/* topdoc
+{{ link/link.yml }}
+*/
+.spectrum-Link {
+ /* Remove the gray background on active links in IE 10. */
+ background-color: transparent;
+ /* Remove gaps in links underline in iOS 8+ and Safari 8+. */
+ -webkit-text-decoration-skip: objects;
+ text-decoration: none;
+ transition: color 130ms ease-in-out;
+ outline: none;
+}
+.spectrum-Link:hover {
+ text-decoration: underline;
+ }
+.spectrum-Link.focus-ring {
+ text-decoration: underline;
+ }
+.spectrum-Link.focus-ring {
+ text-decoration: underline;
+ -webkit-text-decoration-style: double;
+ text-decoration-style: double;
+ }
+.spectrum-Link.is-disabled {
+ cursor: default;
+ pointer-events: none;
+ }
+.spectrum-Link.is-disabled:hover,
+ .spectrum-Link.is-disabled:focus {
+ text-decoration: none;
+ }
+.spectrum-Link--subtle,
+/** @deprecated */.spectrum-Link--quiet {
+ text-decoration: underline;
+}
+.spectrum-Link--overBackground {
+ text-decoration: underline;
+}
+/* topdoc
+{{ label/label-default.yml }}
+*/
+.spectrum-Label {
+ display: inline-block;
+ position: relative;
+
+ width: auto;
+
+ padding: 4px 10px;
+
+ border-radius: 4px;
+
+ font-size: 12px;
+ line-height: 1.5;
+
+ cursor: default;
+
+ -webkit-font-smoothing: subpixel-antialiased;
+ -moz-osx-font-smoothing: auto;
+ font-smoothing: subpixel-antialiased;
+}
+/* topdoc
+{{ label/label-large.yml }}
+*/
+.spectrum-Label--large {
+ font-size: 14px;
+ padding: 8px 12px;
+}
+/* topdoc
+{{ label/label-small.yml }}
+*/
+.spectrum-Label--small {
+ font-size: 11px;
+ padding: 3px 7px;
+}
+.spectrum-Breadcrumbs {
+ display: inline-block;
+ list-style-type: none;
+ margin: 0;
+ padding: 0;
+}
+.spectrum-Breadcrumbs:after {
+ content: "";
+ display: table;
+ clear: both;
+ }
+.spectrum-Breadcrumbs-itemSeparator {
+ position: absolute;
+ top: calc(50% - 3px);
+ right: -19px;
+
+ width: 6px;
+ height: 8px;
+
+ transform: scale(1);
+
+ opacity: 1;
+}
+.spectrum-Breadcrumbs-item {
+ display: block;
+ float: left;
+
+ position: relative;
+
+ margin-right: 32px;
+
+ font-size: 16px;
+ font-weight: 300;
+}
+.spectrum-Breadcrumbs-item .spectrum-Breadcrumbs-itemLink {
+ cursor: default;
+ display: inline;
+ }
+.spectrum-Breadcrumbs-item .spectrum-Breadcrumbs-itemLink[href],
+ .spectrum-Breadcrumbs-item .spectrum-Breadcrumbs-itemLink[tabindex="0"] {
+ cursor: pointer;
+ }
+.spectrum-Breadcrumbs-item:last-of-type .spectrum-Breadcrumbs-itemSeparator {
+ display: none;
+ }
+.spectrum-Breadcrumbs--title .spectrum-Breadcrumbs-item:last-of-type {
+ /* Clear the floats so we drop to a new line */
+ clear: left;
+
+ display: block;
+
+ margin: 0.3em 0;
+
+ font-size: 28px;
+ font-weight: 300;
+ line-height: 32px;
+ }
+.spectrum-Breadcrumbs--title .spectrum-Breadcrumbs-item .spectrum-Heading--pageTitle {
+ margin: 0;
+
+ font-size: inherit;
+ font-weight: inherit;
+ }
+:root {
+ /* Todo: fix in DNA, should have been zero */
+}
+.spectrum-Button,
+.spectrum-ActionButton,
+.spectrum-LogicButton,
+.spectrum-FieldButton,
+.spectrum-ClearButton,
+.spectrum-Tool {
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ box-sizing: border-box;
+
+ -ms-flex-align: center;
+
+ align-items: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+
+ /* Show the button overflow in Edge. */
+ overflow: visible;
+
+ /* Remove button the margin in Firefox and Safari. */
+ margin: 0;
+
+ border-style: solid;
+ white-space: nowrap;
+
+ /* Remove the inheritance of text transform on button in Edge, Firefox, and IE. */
+ text-transform: none;
+ -webkit-font-smoothing: antialiased;
+
+ /* Correct the inability to style clickable types in iOS and Safari. */
+ -webkit-appearance: button;
+
+ /* Adjacent buttons should be aligned correctly */
+ vertical-align: top;
+
+ transition: background 130ms ease-out,
+ border-color 130ms ease-out,
+ color 130ms ease-out,
+ box-shadow 130ms ease-out;
+
+ text-decoration: none;
+ font-family: adobe-clean, "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+
+ cursor: pointer;
+}
+.spectrum-Button:focus,
+.spectrum-ActionButton:focus,
+.spectrum-LogicButton:focus,
+.spectrum-FieldButton:focus,
+.spectrum-ClearButton:focus,
+.spectrum-Tool:focus {
+ outline: none;
+ }
+/* Fix Firefox */
+.spectrum-Button::-moz-focus-inner,
+.spectrum-ActionButton::-moz-focus-inner,
+.spectrum-LogicButton::-moz-focus-inner,
+.spectrum-FieldButton::-moz-focus-inner,
+.spectrum-ClearButton::-moz-focus-inner,
+.spectrum-Tool::-moz-focus-inner {
+ border: 0;
+
+ /* Remove the inner border and padding for button in Firefox. */
+ border-style: none;
+ padding: 0;
+
+ /* Use uppercase PX so values don't get converted to rem */
+ margin-top: -2PX;
+ margin-bottom: -2PX;
+ }
+/* Restore the focus styles unset by the previous rule. */
+.spectrum-Button:-moz-focusring,
+.spectrum-ActionButton:-moz-focusring,
+.spectrum-LogicButton:-moz-focusring,
+.spectrum-FieldButton:-moz-focusring,
+.spectrum-ClearButton:-moz-focusring,
+.spectrum-Tool:-moz-focusring {
+ outline: 1px dotted ButtonText;
+ }
+.spectrum-Button:disabled,
+.spectrum-ActionButton:disabled,
+.spectrum-LogicButton:disabled,
+.spectrum-FieldButton:disabled,
+.spectrum-ClearButton:disabled,
+.spectrum-Tool:disabled {
+ cursor: default;
+ }
+.spectrum-Button .spectrum-Icon,
+.spectrum-ActionButton .spectrum-Icon,
+.spectrum-LogicButton .spectrum-Icon,
+.spectrum-FieldButton .spectrum-Icon,
+.spectrum-ClearButton .spectrum-Icon,
+.spectrum-Tool .spectrum-Icon {
+ max-height: 100%;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ }
+.spectrum-Button {
+
+ border-width: 2px;
+ border-style: solid;
+ border-radius: 16px;
+
+ height: 32px;
+ min-width: 72px;
+
+ padding: 0 14px 0;
+
+ font-size: 15px;
+ font-weight: 700;
+
+ /* Prevent vertical text alignment mismatch between anchor and button in Chrome */
+ line-height: 0;
+}
+.spectrum-Button:hover,
+ .spectrum-Button:active {
+ box-shadow: none;
+ }
+.spectrum-Button .spectrum-Icon + .spectrum-Button-label {
+ margin-left: 8px;
+ }
+.spectrum-Button .spectrum-Button-label + .spectrum-Icon {
+ margin-left: 4px;
+ }
+a.spectrum-Button,
+a.spectrum-ActionButton {
+ /* Remove appearance for clickable types in iOS and Safari. */
+ -webkit-appearance: none;
+ /* Make link text not selectable */
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+}
+.spectrum-ActionButton,
+.spectrum-Tool {
+ position: relative;
+
+ height: 32px;
+ min-width: 32px;
+
+ /* Use icon padding by default as it's smaller */
+ padding: 0 6px;
+
+ border-width: 1px;
+ border-radius: 4px;
+
+ font-size: 14px;
+ font-weight: 400;
+}
+.spectrum-ActionButton .spectrum-Icon + .spectrum-ActionButton-label,
+.spectrum-Tool .spectrum-Icon + .spectrum-ActionButton-label {
+ /* Have icon padding on the left */
+ padding-left: 7px;
+
+ /* Have text padding on the right */
+ padding-right: 5px;
+ }
+.spectrum-ActionButton .spectrum-Icon--sizeS:only-child,
+.spectrum-Tool .spectrum-Icon--sizeS:only-child {
+ /* Position absolutely to avoid layout errors introduced by padding */
+ position: absolute;
+ top: calc(50% - 9px);
+ left: calc(50% - 9px);
+ }
+.spectrum-ActionButton .spectrum-ActionButton-label:only-child,
+.spectrum-Tool .spectrum-ActionButton-label:only-child {
+ /* Add padding for text only buttons */
+ padding: 0 5px;
+ }
+.spectrum-ActionButton-hold {
+ position: absolute;
+ right: 3px;
+ bottom: 3px;
+}
+.spectrum-ActionButton-label,
+.spectrum-Button-label {
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-pack: center;
+ justify-content: center;
+ -ms-flex-align: center;
+ align-items: center;
+}
+.spectrum-ActionButton-label:empty, .spectrum-Button-label:empty {
+ display: none;
+ }
+.spectrum-ActionButton--quiet,
+.spectrum-Tool {
+ border-width: 1px;
+ border-radius: 4px;
+
+ font-size: 14px;
+ font-weight: 400;
+}
+.spectrum-LogicButton {
+
+ height: 24px;
+ padding: 8px;
+
+ border-width: 2px;
+ border-radius: 4px;
+
+ font-size: 14px;
+ font-weight: 700;
+ line-height: 0;
+}
+.spectrum-FieldButton {
+
+ height: 32px;
+
+ padding: 0 12px;
+
+ font-family: inherit;
+ font-weight: normal;
+ font-size: 14px;
+ line-height: normal;
+ -webkit-font-smoothing: initial;
+
+ cursor: pointer;
+ outline: none;
+}
+.spectrum-FieldButton {
+ margin: 0;
+ padding: 0 12px;
+
+ border-width: 1px;
+ border-style: solid;
+ border-radius: 4px;
+
+ transition: background-color 130ms,
+ box-shadow 130ms,
+ border-color 130ms;
+}
+.spectrum-FieldButton:disabled,
+ .spectrum-FieldButton.is-disabled {
+ border-width: 0;
+ cursor: default;
+ }
+.spectrum-FieldButton.is-open {
+ border-width: 1px;
+ }
+.spectrum-FieldButton--quiet {
+ margin: 0;
+ padding: 0;
+
+ border-width: 0;
+ border-radius: 0px;
+}
+.spectrum-ClearButton {
+
+ width: 32px;
+ height: 32px;
+
+ border-radius: 100%;
+
+ padding: 0;
+ margin: 0;
+
+ border: none;
+}
+.spectrum-ClearButton--small {
+ width: 24px;
+ height: 24px;
+}
+/* topdoc
+{{ button/tool.yml }}
+*/
+.spectrum-Tool {
+
+ position: relative;
+
+ -ms-flex-pack: center;
+
+ justify-content: center;
+
+ width: 32px;
+ height: 32px;
+
+ padding: 0;
+}
+.spectrum-Tool-hold {
+ position: absolute;
+ right: 3px;
+ bottom: 3px;
+}
+/* Potentially temporary: Add back default margin between all buttons when adjacent */
+.spectrum-Button + .spectrum-Button {
+ margin-left: 16px;
+}
+.spectrum-ActionButton + .spectrum-ActionButton,
+.spectrum-Tool + .spectrum-Tool {
+ margin-left: 8px;
+}
+.spectrum-Tool + .spectrum-Tool {
+ margin-left: 8px;
+}
+/* topdoc
+{{ buttongroup/buttongroup.yml }}
+*/
+.spectrum-ButtonGroup {
+ display: -ms-flexbox;
+ display: flex;
+}
+.spectrum-ButtonGroup .spectrum-Button,
+.spectrum-ButtonGroup .spectrum-ActionButton,
+.spectrum-ButtonGroup .spectrum-Tool {
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ }
+.spectrum-ButtonGroup .spectrum-Button + .spectrum-Button {
+ margin-left: 16px;
+ }
+.spectrum-ButtonGroup .spectrum-ActionButton + .spectrum-ActionButton,
+.spectrum-ButtonGroup .spectrum-Tool + .spectrum-Tool {
+ margin-left: 8px;
+ }
+.spectrum-ButtonGroup .spectrum-Tool + .spectrum-Tool {
+ margin-left: 8px;
+ }
+/* topdoc
+{{ buttongroup/buttongroup-vertical.yml }}
+*/
+.spectrum-ButtonGroup--vertical {
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-direction: column;
+ flex-direction: column;
+}
+.spectrum-ButtonGroup--vertical .spectrum-ActionButton-label {
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ text-align: left;
+ }
+.spectrum-ButtonGroup--vertical .spectrum-Button + .spectrum-Button {
+ margin-top: 16px;
+ margin-left: 0;
+ }
+.spectrum-ButtonGroup--vertical .spectrum-ActionButton + .spectrum-ActionButton,
+.spectrum-ButtonGroup--vertical .spectrum-Tool + .spectrum-Tool {
+ margin-top: 8px;
+ margin-left: 0;
+ }
+.spectrum-ButtonGroup--vertical .spectrum-Tool + .spectrum-Tool {
+ margin-top: 8px;
+ margin-left: 0;
+ }
+@keyframes pulse {
+ 0% {
+ -webkit-transform: scale(1);
+ opacity: 0;
+ }
+ 50% {
+ -webkit-transform: scale(1.5);
+ opacity: 0.6;
+ }
+ 100% {
+ -webkit-transform: scale(2);
+ opacity: 0;
+ }
+}
+@keyframes pulse--quiet {
+ 0% {
+ -webkit-transform: scale(0.8);
+ opacity: 0;
+ }
+ 50% {
+ -webkit-transform: scale(1.5);
+ opacity: 0.6;
+ }
+ 100% {
+ -webkit-transform: scale(2);
+ opacity: 0;
+ }
+}
+/* topdoc
+{{ coachmark/coachmark.yml }}
+*/
+.spectrum-CoachMarkPopover {
+ position: relative;
+
+ min-width: 272px;
+ max-width: 400px;
+
+ border-radius: 4px;
+ border-width: 1px;
+ border-style: solid;
+
+}
+.spectrum-CoachMarkPopover-image {
+ border-radius: 4px 4px 0 0;
+
+ width: 100%;
+}
+.spectrum-CoachMarkPopover-header,
+.spectrum-CoachMarkPopover-content,
+.spectrum-CoachMarkPopover-footer {
+ padding: 0 24px;
+}
+.spectrum-CoachMarkPopover-header {
+ padding-top: 24px;
+}
+.spectrum-CoachMarkPopover-footer {
+ padding-bottom: 24px;
+}
+.spectrum-CoachMarkPopover-header {
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+ -ms-flex-align: end;
+ align-items: flex-end;
+ margin-bottom: 16px;
+}
+.spectrum-CoachMarkPopover-title {
+ font-size: 16px;
+ font-weight: 700;
+ line-height: 1.3;
+ margin-bottom: 0;
+}
+.spectrum-CoachMarkPopover-step {
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 1.5;
+}
+.spectrum-CoachMarkPopover-content {
+ margin-bottom: 16px;
+}
+.spectrum-CoachMarkPopover-footer {
+ margin-top: 0;
+ text-align: right;
+}
+.spectrum-CoachMarkIndicator {
+ position: relative;
+
+ margin: 6px;
+}
+.spectrum-CoachMarkIndicator-ring {
+ display: block;
+ position: absolute;
+
+ border-style: solid;
+ border-width: 2px;
+ border-radius: 50%;
+}
+.spectrum-CoachMarkIndicator-ring:nth-child(2) {
+ animation-delay: -1980ms;
+ }
+.spectrum-CoachMarkIndicator-ring:nth-child(3) {
+ animation-delay: -3000ms
+ }
+.spectrum-CoachMarkIndicator {
+ min-width: 48px;
+ min-height: 48px;
+}
+.spectrum-CoachMarkIndicator-ring {
+ top: 12px;
+ left: 12px;
+
+ width: 16px;
+ height: 16px;
+ animation: pulse 3000ms linear infinite;
+}
+.spectrum-CoachMarkIndicator-ring:nth-child(1) {
+ animation-delay: -1500ms;
+ }
+.spectrum-CoachMarkIndicator--quiet {
+ min-width: 22px;
+ min-height: 22px;
+}
+.spectrum-CoachMarkIndicator--quiet .spectrum-CoachMarkIndicator-ring {
+ top: 6px;
+ left: 6px;
+
+ width: 8px;
+ height: 8px;
+ animation: pulse--quiet 3000ms linear infinite;
+ }
+.spectrum-CoachMarkIndicator--quiet .spectrum-CoachMarkIndicator-ring:nth-child(1) {
+ animation-delay: -990ms;
+ }
+:root {
+
+ /* DNA */
+}
+/* topdoc
+{{ alert/alert-closeable.yml }}
+*/
+.spectrum-Alert {
+ position: relative;
+
+ display: inline-block;
+ box-sizing: border-box;
+ min-width: 368px;
+ min-height: 38px;
+ margin: 8px 0;
+ padding: 20px 20px;
+
+ border-width: 2px;
+ border-style: solid;
+ border-radius: 4px;
+}
+.spectrum-Alert-icon {
+ position: absolute;
+ display: block;
+ top: 20px;
+ right: 20px;
+}
+.spectrum-Alert-header {
+ display: inline-block;
+ height: auto;
+ min-height: 0;
+ margin: 0;
+ padding: 0;
+
+ /* Leave room for the icon */
+ padding-right: 30px;
+
+ font-size: 14px;
+ font-weight: 700;
+ font-style: normal;
+ line-height: 14px;
+ text-transform: none;
+}
+.spectrum-Alert-content {
+ display: block;
+ margin: 8px 0 0 0;
+ padding: 0;
+
+ font-size: 14px;
+ word-wrap: break-word;
+}
+.spectrum-Alert-footer {
+ display: block;
+
+ text-align: right;
+
+ padding-top: 0.5rem;
+}
+.spectrum-Alert-footer:empty {
+ display: none;
+ }
+.spectrum-Alert-footer .spectrum-Button {
+ margin-right: 0;
+
+ /* Spacing between buttons */
+ margin-left: 0.75rem;
+ }
+/* topdoc
+{{ avatar/avatar-small.yml }}
+*/
+.spectrum-Avatar {
+ width: 16px;
+ height: 16px;
+
+ border-radius: 50%;
+ border-style: none;
+
+ -webkit-user-drag: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+}
+.spectrum-Checkbox {
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-align: center;
+ align-items: center;
+
+ position: relative;
+
+ height: 32px;
+ max-width: 100%;
+
+ margin-right: 16px;
+
+ vertical-align: top;
+}
+.spectrum-Checkbox-input {
+ /* Change the font styles in all browsers for input. */
+ font-family: inherit;
+ font-size: 100%;
+ line-height: 1.15;
+
+ /* Remove the margin for input in Firefox and Safari. */
+ margin: 0;
+
+ /* Show the overflow for input in Edge. */
+ overflow: visible;
+
+ /* Add the correct box sizing for [type="checkbox"] in IE 10-. */
+ box-sizing: border-box;
+
+ /* Remove the padding for [type="checkbox"] in IE 10-. */
+ padding: 0;
+
+ /* Hit area */
+ position: absolute;
+ top: 0;
+ left: -8px;
+ width: calc(100% + 16px);;
+ height: 100%;
+
+ opacity: .0001;
+ z-index: 1;
+
+ cursor: pointer;
+}
+.spectrum-Checkbox-input:disabled {
+ cursor: default;
+ }
+.spectrum-Checkbox-input:checked + .spectrum-Checkbox-box {
+ border-width: 7px;
+ }
+.spectrum-Checkbox-input:checked + .spectrum-Checkbox-box .spectrum-Checkbox-checkmark {
+ transform: scale(1);
+ opacity: 1;
+ }
+.spectrum-Checkbox.is-indeterminate .spectrum-Checkbox-box,
+ .spectrum-Checkbox.is-indeterminate .spectrum-Checkbox-input:checked + .spectrum-Checkbox-box {
+ border-width: 7px;
+ }
+.spectrum-Checkbox.is-indeterminate .spectrum-Checkbox-box .spectrum-Checkbox-checkmark, .spectrum-Checkbox.is-indeterminate .spectrum-Checkbox-input:checked + .spectrum-Checkbox-box .spectrum-Checkbox-checkmark {
+ display: none;
+ }
+.spectrum-Checkbox.is-indeterminate .spectrum-Checkbox-box .spectrum-Checkbox-partialCheckmark, .spectrum-Checkbox.is-indeterminate .spectrum-Checkbox-input:checked + .spectrum-Checkbox-box .spectrum-Checkbox-partialCheckmark {
+ display: block;
+
+ transform: scale(1);
+ opacity: 1;
+ }
+.spectrum-Checkbox-label {
+ margin-left: 10px;
+ font-size: 14px;
+ font-weight: 400;
+ transition: color 130ms ease-in-out;
+
+ white-space: nowrap;
+
+ overflow: hidden;
+ text-overflow: ellipsis;
+}
+.spectrum-Checkbox-box {
+ position: relative;
+ box-sizing: border-box;
+ width: 14px;
+ height: 14px;
+
+ -ms-flex-positive: 0;
+
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+
+ border-radius: 2px;
+ border-width: 2px;
+ border-style: solid;
+
+ transition: border 130ms ease-in-out, box-shadow 130ms ease-in-out;
+}
+.spectrum-Checkbox-checkmark,
+.spectrum-Checkbox-partialCheckmark {
+ position: absolute;
+ top: 50%;
+ left: 50%;
+
+ margin-top: -5px;
+ margin-left: -5px;
+
+ opacity: 0;
+ transform: scale(0);
+
+ transition: opacity 130ms ease-in-out, transform 130ms ease-in-out;
+}
+.spectrum-Checkbox-partialCheckmark {
+ display: none;
+}
+.spectrum-Radio {
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-align: center;
+ align-items: center;
+
+ position: relative;
+
+ height: 32px;
+ max-width: 100%;
+
+ margin-right: 16px;
+
+ vertical-align: top;
+}
+.spectrum-Radio-input {
+ /* Change the font styles in all browsers for input. */
+ font-family: inherit;
+ font-size: 100%;
+ line-height: 1.15;
+
+ /* Remove the margin for input in Firefox and Safari. */
+ margin: 0;
+
+ /* Show the overflow for input in Edge. */
+ overflow: visible;
+
+ /* Add the correct box sizing for [type="radio"] in IE 10-. */
+ box-sizing: border-box;
+
+ /* Remove the padding for [type="radio"] in IE 10-. */
+ padding: 0;
+
+ /* Hit area */
+ position: absolute;
+ top: 0;
+ left: -8px;
+ width: calc(100% + 16px);
+ height: 100%;
+
+ opacity: .0001;
+ z-index: 1;
+
+ cursor: pointer;
+}
+.spectrum-Radio-input:disabled {
+ cursor: default;
+ }
+.spectrum-Radio-input:checked + .spectrum-Radio-button {
+ border-width: 5px;
+ }
+.spectrum-Radio-label {
+ margin-left: 10px;
+ font-size: 14px;
+
+ transition: color 130ms ease-in-out;
+
+ white-space: nowrap;
+
+ overflow: hidden;
+ text-overflow: ellipsis;
+}
+.spectrum-Radio-button {
+ position: relative;
+ box-sizing: border-box;
+ width: 14px;
+ height: 14px;
+
+ -ms-flex-positive: 0;
+
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+
+ border-radius: 7px;
+ border-width: 2px;
+ border-style: solid;
+
+ transition: border 130ms ease-in-out, box-shadow 130ms ease-in-out;
+}
+.spectrum-Radio--labelBelow {
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ -ms-flex-align: center;
+ align-items: center;
+ height: auto;
+}
+.spectrum-Radio--labelBelow .spectrum-Radio-button {
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ }
+.spectrum-Radio--labelBelow .spectrum-Radio-label {
+ margin: 3px 0 0 0;
+ }
+:root {
+ /* Field group */
+}
+/* topdoc
+{{ fieldgroup/fieldgroup-default.yml }}
+*/
+.spectrum-FieldGroup {
+ display: -ms-flexbox;
+ display: flex;
+ vertical-align: top;
+}
+/* topdoc
+{{ fieldgroup/fieldgroup-vertical.yml }}
+*/
+.spectrum-FieldGroup--vertical {
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-direction: column;
+ flex-direction: column;
+}
+/* topdoc
+{{ fieldgroup/fieldgroup-labelsbelow.yml }}
+*/
+:root {
+
+ /* Todo fix in DNA */
+
+ /* Todo: DNA uses incorrect font family "Adobe Clean" */
+}
+.spectrum-Textfield {
+ /* box */
+ box-sizing: border-box;
+ border: 1px solid;
+ border-radius: 4px;
+
+ /* Apply padding by default to center text, giving consistency between input and textfield */
+ padding: 3px 12px 5px 12px;
+ /* Use padding instead of text-indent because text-indent does not left align the text in Edge browser */
+ text-indent: 0;
+
+ min-width: 72px;
+ height: 32px;
+ width: 192px;
+
+ vertical-align: top; /* used to align them correctly in forms. */
+
+ /* Remove the margin for input in Firefox and Safari. */
+ margin: 0;
+
+ /* Show the overflow for input in Edge. */
+ overflow: visible;
+
+ /* Change the input font styles in all browsers */
+ font-family: adobe-clean, Helvetica, Arial, sans-serif;
+ font-size: 14px;
+ line-height: 20px;
+ text-overflow: ellipsis;
+
+ transition: border-color 130ms ease-in-out, box-shadow 130ms ease-in-out;
+
+ outline: none;
+
+ /* removes the native spin buttons in firefox. -mox-appearance: none has no effect */
+ /* http://stackoverflow.com/questions/23372903/hide-spinner-in-input-number-firefox-29 */
+ -moz-appearance: textfield;
+
+ /* Normalize is adding a specific selector that resets this, so be important */
+ -webkit-appearance: none !important;
+}
+.spectrum-Textfield::placeholder {
+ font-weight: 400;
+ font-style: italic;
+ transition: color 130ms ease-in-out;
+ }
+/* added to work with Edge, note, it needs double ::
+ * not single : which is what autoprefixer will add
+ */
+.spectrum-Textfield::-ms-input-placeholder {
+ font-weight: 400;
+ font-style: italic;
+ transition: color 130ms ease-in-out;
+ }
+.spectrum-Textfield:lang(ja)::placeholder, .spectrum-Textfield:lang(zh)::placeholder, .spectrum-Textfield:lang(ko)::placeholder {
+ font-style: normal;
+ }
+.spectrum-Textfield:lang(ja)::-ms-input-placeholder, .spectrum-Textfield:lang(zh)::-ms-input-placeholder, .spectrum-Textfield:lang(ko)::-ms-input-placeholder { /* added to work with Edge, same as above */
+ font-style: normal;
+ }
+.spectrum-Textfield:hover::placeholder {
+ font-weight: 400;
+ }
+.spectrum-Textfield:disabled {
+ /* The opacity must be set to 1 */
+ opacity: 1;
+ }
+.spectrum-Textfield:disabled::placeholder {
+ font-weight: 400;
+ }
+/* http://stackoverflow.com/questions/14007655/remove-ie10s-clear-field-x-button-on-certain-inputs */
+.spectrum-Textfield::-ms-clear {
+ width: 0;
+ height: 0;
+ }
+/* http://stackoverflow.com/questions/23372903/hide-spinner-in-input-number-firefox-29 */
+.spectrum-Textfield::-webkit-inner-spin-button,
+ .spectrum-Textfield::-webkit-outer-spin-button {
+ -webkit-appearance: none;
+ margin: 0;
+ }
+/* removes the red border that appears in Firefox */
+.spectrum-Textfield:-moz-ui-invalid {
+ box-shadow: none;
+ }
+/* removes the native spin buttons */
+.spectrum-Textfield.is-invalid,
+ .spectrum-Textfield:invalid,
+ .spectrum-Textfield.is-valid {
+ background-repeat: no-repeat;
+ }
+/* Remove the native clear button in IE */
+.spectrum-Textfield.is-invalid,
+ .spectrum-Textfield:invalid {
+ background-size: 18px 18px;
+ background-position: calc(100% - 12px) 50%;
+ padding-right: 42px;
+ }
+.spectrum-Textfield.is-valid {
+ background-size: 12px 12px;
+ background-position: calc(100% - 12px) 50%;
+ padding-right: 36px;
+ }
+.spectrum-Textfield--multiline {
+ height: auto;
+ padding: 4px 8px;
+
+ /* Remove the default vertical scrollbar for textarea in IE. */
+ overflow: auto;
+}
+.spectrum-Textfield--multiline.is-invalid,
+ .spectrum-Textfield--multiline:invalid,
+ .spectrum-Textfield--multiline.is-valid {
+ background-position: calc(100% - 9px) calc(100% - 9px);
+ }
+.spectrum-Textfield--quiet {
+ border-radius: 0;
+ border-width: 0 0 1px 0;
+
+ /* removes the side padding to align the text properly */
+ padding-left: 0;
+ padding-right: 0;
+
+ /* Treat all quiet inputs and textareas the same */
+ resize: none;
+ overflow-y: hidden;
+}
+.spectrum-Textfield--quiet.is-invalid,
+ .spectrum-Textfield--quiet:invalid,
+ .spectrum-Textfield--quiet.is-valid {
+ background-position: 100% 50%;
+ }
+/* topdoc
+{{ decoratedtextfield/decoratedtextfield.yml }}
+*/
+.spectrum-DecoratedTextfield {
+ display: inline-block;
+ position: relative;
+}
+.spectrum-DecoratedTextfield-icon {
+ width: 18px;
+ height: 18px;
+
+ position: absolute;
+ bottom: 7px;
+ right: 7px;
+}
+.spectrum-DecoratedTextfield-field {
+ padding-right: 32px;
+}
+/* topdoc
+{{ inputgroup/combobox.yml }}
+*/
+/* topdoc
+{{ inputgroup/combobox-quiet.yml }}
+*/
+/* topdoc
+{{ inputgroup/datepicker.yml }}
+*/
+/* topdoc
+{{ inputgroup/datepicker-quiet.yml }}
+*/
+:root {
+ /* Todo: move to DNA */
+}
+.spectrum-InputGroup {
+ position: relative;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-direction: row;
+ flex-direction: row;
+ -ms-flex-wrap: nowrap;
+ flex-wrap: nowrap;
+ min-width: 192px;
+}
+.spectrum-InputGroup .spectrum-FieldButton {
+ padding: 0 12px;
+ border-top-left-radius: 0;
+ border-bottom-left-radius: 0;
+ }
+.spectrum-InputGroup-field {
+ border-top-right-radius: 0;
+ border-bottom-right-radius: 0;
+ border-right-width: 0;
+ -ms-flex: 1;
+ flex: 1;
+}
+.spectrum-InputGroup--quiet .spectrum-FieldButton {
+ border-radius: 0;
+
+ position: relative;
+ padding-right: 0;
+ border-bottom: 1px solid;
+ }
+/* More hitarea */
+.spectrum-InputGroup--quiet .spectrum-FieldButton:after {
+ content: '';
+ position: absolute;
+ height: 100%;
+ width: 10px;
+ right: -10px;
+ }
+.spectrum-InputGroup--quiet .spectrum-InputGroup-icon {
+ right: 0;
+ }
+.spectrum-Tooltip,
+.spectrum-Underlay,
+.spectrum-Dialog,
+.spectrum-Popover,
+.spectrum-QuickActions {
+ visibility: hidden;
+
+ opacity: 0;
+
+ transition: transform 130ms ease-in-out,
+ opacity 130ms ease-in-out,
+ visibility 0ms linear 130ms;
+
+ pointer-events: none;
+}
+.spectrum-Tooltip.is-open,
+.spectrum-Underlay.is-open,
+.spectrum-Dialog.is-open,
+.spectrum-Popover.is-open,
+.spectrum-QuickActions.is-open {
+ visibility: visible;
+
+ opacity: 1;
+
+ transition-delay: 0ms;
+
+ pointer-events: auto;
+}
+.spectrum-Tooltip--bottom.is-open,
+.spectrum-Popover--bottom.is-open {
+ transform: translateY(6px);
+}
+.spectrum-Tooltip--top.is-open,
+.spectrum-Popover--top.is-open {
+ transform: translateY(-6px);
+}
+.spectrum-Tooltip--right.is-open,
+.spectrum-Popover--right.is-open,
+.spectrum-QuickActions--left.is-open {
+ transform: translateX(6px);
+}
+.spectrum-Tooltip--left.is-open,
+.spectrum-Popover--left.is-open,
+.spectrum-QuickActions--right.is-open {
+ transform: translateX(-6px);
+}
+:root {
+ /* This variable needs to be updated in Spectrum DNA. Using the height variable so it scales to spectrum-large */
+}
+/* topdoc
+{{ tooltip/tooltip.yml }}
+*/
+.spectrum-Tooltip {
+
+ position: relative;
+ left: 0px;
+ top: 0px;
+
+ display: -ms-inline-flexbox;
+
+ display: inline-flex;
+ -ms-flex-direction: row;
+ flex-direction: row;
+ -ms-flex-align: center;
+ align-items: center;
+ box-sizing: border-box;
+
+ vertical-align: top;
+
+ width: auto;
+ padding: 4px 10px;
+ border-radius: 4px;
+ min-height: 24px;
+
+ font-size: 12px;
+ font-weight: 400;
+ line-height: 16px;
+ word-break: break-word;
+ -webkit-font-smoothing: antialiased;
+}
+.spectrum-Tooltip {
+ cursor: default;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ }
+.spectrum-Tooltip-tip {
+ position: absolute;
+
+ height: 0;
+ width: 0;
+
+ border-width: 4px;
+ border-style: solid;
+ border-left-color: transparent;
+ border-right-color: transparent;
+ border-bottom-color: transparent;
+}
+.spectrum-Tooltip--right .spectrum-Tooltip-tip, .spectrum-Tooltip--left .spectrum-Tooltip-tip {
+ top: 50%;
+ margin-top: -4px;
+ }
+.spectrum-Tooltip--right {
+ margin-left: 3px;
+}
+.spectrum-Tooltip--right .spectrum-Tooltip-tip {
+ right: 100%;
+ transform: rotate(90deg);
+ }
+.spectrum-Tooltip--left {
+ margin-right: 3px;
+}
+.spectrum-Tooltip--left .spectrum-Tooltip-tip {
+ left: 100%;
+ transform: rotate(-90deg);
+ }
+.spectrum-Tooltip--top {
+ margin-bottom: 3px;
+}
+.spectrum-Tooltip--top .spectrum-Tooltip-tip {
+ top: 100%;
+ }
+.spectrum-Tooltip--bottom {
+ margin-top: 3px;
+}
+.spectrum-Tooltip--bottom .spectrum-Tooltip-tip {
+ bottom: 100%;
+ transform: rotate(-180deg);
+ }
+.spectrum-Tooltip--bottom .spectrum-Tooltip-tip, .spectrum-Tooltip--top .spectrum-Tooltip-tip {
+ left: 50%;
+ margin-left: -4px;
+ }
+.spectrum-Tooltip-typeIcon {
+ margin-left: -2px;
+ margin-right: 8px;
+ width: 14px;
+ height: 14px;
+ -ms-flex-item-align: start;
+ align-self: flex-start;
+
+ /* Adjusts for weird misalignment */
+ margin-top: 1px;
+}
+.spectrum-Tooltip-label {
+ max-width: 101px;
+
+ /* Make sure line height is correct to prevent problems in Windows */
+ line-height: 16px;
+}
+.u-tooltip-showOnHover {
+ display: inline-block;
+ position: relative;
+}
+.u-tooltip-showOnHover .spectrum-Tooltip {
+ position: absolute;
+ white-space: nowrap;
+ /* Required for animations to work, !important for diff scaling to work */
+ visibility: visible !important;
+ transition: transform 130ms ease-in-out;
+ top: -100%;
+ }
+.u-tooltip-showOnHover .spectrum-Tooltip-label {
+ /* Don't try to wrap as the mechanism used for this helper does not support wrapping */
+ max-width: none;
+ }
+.u-tooltip-showOnHover .spectrum-Tooltip--right,
+ .u-tooltip-showOnHover .spectrum-Tooltip--left {
+ top: 50%;
+ }
+.u-tooltip-showOnHover .spectrum-Tooltip--right .spectrum-Tooltip-tip, .u-tooltip-showOnHover .spectrum-Tooltip--left .spectrum-Tooltip-tip {
+ top: 50%;
+ }
+.u-tooltip-showOnHover .spectrum-Tooltip--right {
+ left: 100%;
+ transform: translate(0, -50%);
+ }
+.u-tooltip-showOnHover .spectrum-Tooltip--left {
+ transform: translate(-100%, -50%);
+ }
+.u-tooltip-showOnHover .spectrum-Tooltip--bottom,
+ .u-tooltip-showOnHover .spectrum-Tooltip--top {
+ left: 50%;
+ }
+.u-tooltip-showOnHover .spectrum-Tooltip--bottom .spectrum-Tooltip-tip, .u-tooltip-showOnHover .spectrum-Tooltip--top .spectrum-Tooltip-tip {
+ left: 50%;
+ }
+.u-tooltip-showOnHover .spectrum-Tooltip--bottom {
+ top: 100%;
+ transform: translate(-50%, -8px);
+ }
+.u-tooltip-showOnHover .spectrum-Tooltip--top {
+ transform: translate(-50%, 8px);
+ }
+.u-tooltip-showOnHover:hover .spectrum-Tooltip {
+ opacity: 1;
+ }
+.u-tooltip-showOnHover:hover .spectrum-Tooltip.spectrum-Tooltip--bottom {
+ transform: translate(-50%, 0);
+ }
+.u-tooltip-showOnHover:hover .spectrum-Tooltip.spectrum-Tooltip--top {
+ transform: translate(-50%, -8px);
+ }
+.u-tooltip-showOnHover:hover .spectrum-Tooltip.spectrum-Tooltip--left {
+ transform: translate(calc(-100% - 8px), -50%);
+ }
+.u-tooltip-showOnHover:hover .spectrum-Tooltip.spectrum-Tooltip--right {
+ transform: translate(8px, -50%);
+ }
+/* topdoc
+{{ barloader/barloader-large.yml }}
+*/
+.spectrum-BarLoader {
+ position: relative;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-flow: row wrap;
+ flex-flow: row wrap;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+ -ms-flex-align: center;
+ align-items: center;
+ width: 192px;
+ vertical-align: top;
+}
+.spectrum-BarLoader-track {
+ /* Visually apply border radius to child elements */
+ overflow: hidden;
+ width: 192px;
+ height: 6px;
+ border-radius: 3px;
+}
+.spectrum-BarLoader-fill {
+ border: none;
+ height: 6px;
+
+ transition: width 1s;
+}
+.spectrum-BarLoader-label,
+.spectrum-BarLoader-percentage {
+ font-size: 12px;
+ font-weight: 400;
+ line-height: 1.3;
+ text-align: left;
+ margin-bottom: 9px;
+
+}
+.spectrum-BarLoader--sideLabel {
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-flow: row;
+ flex-flow: row;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+ width: auto;
+}
+.spectrum-BarLoader--sideLabel .spectrum-BarLoader-label {
+ margin-right: 12px;
+ margin-bottom: 0;
+ }
+.spectrum-BarLoader--sideLabel .spectrum-BarLoader-percentage {
+ -ms-flex-order: 3;
+ order: 3;
+ text-align: right;
+ margin-left: 12px;
+ margin-bottom: 0;
+ }
+/* topdoc
+{{ barloader/barloader-small.yml }}
+*/
+.spectrum-BarLoader--small {
+ height: 4px;
+ min-width: 192px;
+}
+.spectrum-BarLoader--small .spectrum-BarLoader-fill {
+ height: 4px;
+ }
+.spectrum-BarLoader--small .spectrum-BarLoader-track {
+ height: 4px;
+ border-radius: 2px;
+ }
+/* topdoc
+{{ barloader/barloader-large-over-background.yml }}
+*/
+/* topdoc
+{{ barloader/barloader-small-over-background.yml }}
+*/
+/* topdoc
+{{ barloader/barloader-meter.yml }}
+*/
+.spectrum-CircleLoader--indeterminate-fill-submask-2 {
+ animation: 1s infinite linear spectrum-fill-mask-2;
+}
+@keyframes spectrum-fill-mask-1 {
+ 0% {
+ transform: rotate(90deg);
+ }
+
+ 1.69% {
+ transform: rotate(72.3deg);
+ }
+
+ 3.39% {
+ transform: rotate(55.5deg);
+ }
+
+ 5.08% {
+ transform: rotate(40.3deg);
+ }
+
+ 6.78% {
+ transform: rotate(25deg);
+ }
+
+ 8.47% {
+ transform: rotate(10.6deg);
+ }
+
+ 10.17% {
+ transform: rotate(0deg);
+ }
+
+ 11.86% {
+ transform: rotate(0deg);
+ }
+
+ 13.56% {
+ transform: rotate(0deg);
+ }
+
+ 15.25% {
+ transform: rotate(0deg);
+ }
+
+ 16.95% {
+ transform: rotate(0deg);
+ }
+
+ 18.64% {
+ transform: rotate(0deg);
+ }
+
+ 20.34% {
+ transform: rotate(0deg);
+ }
+
+ 22.03% {
+ transform: rotate(0deg);
+ }
+
+ 23.73% {
+ transform: rotate(0deg);
+ }
+
+ 25.42% {
+ transform: rotate(0deg);
+ }
+
+ 27.12% {
+ transform: rotate(0deg);
+ }
+
+ 28.81% {
+ transform: rotate(0deg);
+ }
+
+ 30.51% {
+ transform: rotate(0deg);
+ }
+
+ 32.2% {
+ transform: rotate(0deg);
+ }
+
+ 33.9% {
+ transform: rotate(0deg);
+ }
+
+ 35.59% {
+ transform: rotate(0deg);
+ }
+
+ 37.29% {
+ transform: rotate(0deg);
+ }
+
+ 38.98% {
+ transform: rotate(0deg);
+ }
+
+ 40.68% {
+ transform: rotate(0deg);
+ }
+
+ 42.37% {
+ transform: rotate(5.3deg);
+ }
+
+ 44.07% {
+ transform: rotate(13.4deg);
+ }
+
+ 45.76% {
+ transform: rotate(20.6deg);
+ }
+
+ 47.46% {
+ transform: rotate(29deg);
+ }
+
+ 49.15% {
+ transform: rotate(36.5deg);
+ }
+
+ 50.85% {
+ transform: rotate(42.6deg);
+ }
+
+ 52.54% {
+ transform: rotate(48.8deg);
+ }
+
+ 54.24% {
+ transform: rotate(54.2deg);
+ }
+
+ 55.93% {
+ transform: rotate(59.4deg);
+ }
+
+ 57.63% {
+ transform: rotate(63.2deg);
+ }
+
+ 59.32% {
+ transform: rotate(67.2deg);
+ }
+
+ 61.02% {
+ transform: rotate(70.8deg);
+ }
+
+ 62.71% {
+ transform: rotate(73.8deg);
+ }
+
+ 64.41% {
+ transform: rotate(76.2deg);
+ }
+
+ 66.1% {
+ transform: rotate(78.7deg);
+ }
+
+ 67.8% {
+ transform: rotate(80.6deg);
+ }
+
+ 69.49% {
+ transform: rotate(82.6deg);
+ }
+
+ 71.19% {
+ transform: rotate(83.7deg);
+ }
+
+ 72.88% {
+ transform: rotate(85deg);
+ }
+
+ 74.58% {
+ transform: rotate(86.3deg);
+ }
+
+ 76.27% {
+ transform: rotate(87deg);
+ }
+
+ 77.97% {
+ transform: rotate(87.7deg);
+ }
+
+ 79.66% {
+ transform: rotate(88.3deg);
+ }
+
+ 81.36% {
+ transform: rotate(88.6deg);
+ }
+
+ 83.05% {
+ transform: rotate(89.2deg);
+ }
+
+ 84.75% {
+ transform: rotate(89.2deg);
+ }
+
+ 86.44% {
+ transform: rotate(89.5deg);
+ }
+
+ 88.14% {
+ transform: rotate(89.9deg);
+ }
+
+ 89.83% {
+ transform: rotate(89.7deg);
+ }
+
+ 91.53% {
+ transform: rotate(90.1deg);
+ }
+
+ 93.22% {
+ transform: rotate(90.2deg);
+ }
+
+ 94.92% {
+ transform: rotate(90.1deg);
+ }
+
+ 96.61% {
+ transform: rotate(90deg);
+ }
+
+ 98.31% {
+ transform: rotate(89.8deg);
+ }
+
+ 100% {
+ transform: rotate(90deg);
+ }
+}
+@keyframes spectrum-fill-mask-2 {
+ 0% {
+ transform: rotate(180deg);
+ }
+
+ 1.69% {
+ transform: rotate(180deg);
+ }
+
+ 3.39% {
+ transform: rotate(180deg);
+ }
+
+ 5.08% {
+ transform: rotate(180deg);
+ }
+
+ 6.78% {
+ transform: rotate(180deg);
+ }
+
+ 8.47% {
+ transform: rotate(180deg);
+ }
+
+ 10.17% {
+ transform: rotate(179.2deg);
+ }
+
+ 11.86% {
+ transform: rotate(164deg);
+ }
+
+ 13.56% {
+ transform: rotate(151.8deg);
+ }
+
+ 15.25% {
+ transform: rotate(140.8deg);
+ }
+
+ 16.95% {
+ transform: rotate(130.3deg);
+ }
+
+ 18.64% {
+ transform: rotate(120.4deg);
+ }
+
+ 20.34% {
+ transform: rotate(110.8deg);
+ }
+
+ 22.03% {
+ transform: rotate(101.6deg);
+ }
+
+ 23.73% {
+ transform: rotate(93.5deg);
+ }
+
+ 25.42% {
+ transform: rotate(85.4deg);
+ }
+
+ 27.12% {
+ transform: rotate(78.1deg);
+ }
+
+ 28.81% {
+ transform: rotate(71.2deg);
+ }
+
+ 30.51% {
+ transform: rotate(89.1deg);
+ }
+
+ 32.2% {
+ transform: rotate(105.5deg);
+ }
+
+ 33.9% {
+ transform: rotate(121.3deg);
+ }
+
+ 35.59% {
+ transform: rotate(135.5deg);
+ }
+
+ 37.29% {
+ transform: rotate(148.4deg);
+ }
+
+ 38.98% {
+ transform: rotate(161deg);
+ }
+
+ 40.68% {
+ transform: rotate(173.5deg);
+ }
+
+ 42.37% {
+ transform: rotate(180deg);
+ }
+
+ 44.07% {
+ transform: rotate(180deg);
+ }
+
+ 45.76% {
+ transform: rotate(180deg);
+ }
+
+ 47.46% {
+ transform: rotate(180deg);
+ }
+
+ 49.15% {
+ transform: rotate(180deg);
+ }
+
+ 50.85% {
+ transform: rotate(180deg);
+ }
+
+ 52.54% {
+ transform: rotate(180deg);
+ }
+
+ 54.24% {
+ transform: rotate(180deg);
+ }
+
+ 55.93% {
+ transform: rotate(180deg);
+ }
+
+ 57.63% {
+ transform: rotate(180deg);
+ }
+
+ 59.32% {
+ transform: rotate(180deg);
+ }
+
+ 61.02% {
+ transform: rotate(180deg);
+ }
+
+ 62.71% {
+ transform: rotate(180deg);
+ }
+
+ 64.41% {
+ transform: rotate(180deg);
+ }
+
+ 66.1% {
+ transform: rotate(180deg);
+ }
+
+ 67.8% {
+ transform: rotate(180deg);
+ }
+
+ 69.49% {
+ transform: rotate(180deg);
+ }
+
+ 71.19% {
+ transform: rotate(180deg);
+ }
+
+ 72.88% {
+ transform: rotate(180deg);
+ }
+
+ 74.58% {
+ transform: rotate(180deg);
+ }
+
+ 76.27% {
+ transform: rotate(180deg);
+ }
+
+ 77.97% {
+ transform: rotate(180deg);
+ }
+
+ 79.66% {
+ transform: rotate(180deg);
+ }
+
+ 81.36% {
+ transform: rotate(180deg);
+ }
+
+ 83.05% {
+ transform: rotate(180deg);
+ }
+
+ 84.75% {
+ transform: rotate(180deg);
+ }
+
+ 86.44% {
+ transform: rotate(180deg);
+ }
+
+ 88.14% {
+ transform: rotate(180deg);
+ }
+
+ 89.83% {
+ transform: rotate(180deg);
+ }
+
+ 91.53% {
+ transform: rotate(180deg);
+ }
+
+ 93.22% {
+ transform: rotate(180deg);
+ }
+
+ 94.92% {
+ transform: rotate(180deg);
+ }
+
+ 96.61% {
+ transform: rotate(180deg);
+ }
+
+ 98.31% {
+ transform: rotate(180deg);
+ }
+
+ 100% {
+ transform: rotate(180deg);
+ }
+}
+@keyframes spectrum-fills-rotate {
+ 0% {transform: rotate(-90deg)}
+ 100% {transform: rotate(270deg)}
+}
+/* topdoc
+{{ circleloader/circleloader-medium.yml }}
+*/
+.spectrum-CircleLoader {
+ display: inline-block;
+ width: 32px;
+ height: 32px;
+ position: relative;
+ direction: ltr;
+}
+.spectrum-CircleLoader-track {
+ box-sizing: border-box;
+ width: 32px;
+ height: 32px;
+ border-style: solid;
+ border-width: 3px;
+ border-radius: 32px;
+}
+.spectrum-CircleLoader-fills {
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+}
+.spectrum-CircleLoader-fill {
+ box-sizing: border-box;
+ width: 32px;
+ height: 32px;
+ border-style: solid;
+ border-width: 3px;
+ border-radius: 32px;
+}
+.spectrum-CircleLoader-fillMask1,
+.spectrum-CircleLoader-fillMask2 {
+ width: 50%;
+ height: 100%;
+ transform-origin: 100% center;
+ transform: rotate(180deg);
+ overflow: hidden;
+ position: absolute;
+}
+.spectrum-CircleLoader-fillSubMask1,
+.spectrum-CircleLoader-fillSubMask2 {
+ width: 100%;
+ height: 100%;
+ transform-origin: 100% center;
+ overflow: hidden;
+ transform: rotate(-180deg);
+}
+.spectrum-CircleLoader-fillMask2 {
+ transform: rotate(0deg);
+}
+/* topdoc
+{{ circleloader/circleloader-small.yml }}
+*/
+.spectrum-CircleLoader--small {
+ width: 16px;
+ height: 16px;
+}
+.spectrum-CircleLoader--small .spectrum-CircleLoader-track {
+ width: 16px;
+ height: 16px;
+ border-style: solid;
+ border-width: 2px;
+ border-radius: 16px;
+ }
+.spectrum-CircleLoader--small .spectrum-CircleLoader-fill {
+ width: 16px;
+ height: 16px;
+ border-style: solid;
+ border-width: 2px;
+ border-radius: 16px;
+ }
+/* topdoc
+{{ circleloader/circleloader-large.yml }}
+*/
+.spectrum-CircleLoader--large {
+ width: 64px;
+ height: 64px;
+}
+.spectrum-CircleLoader--large .spectrum-CircleLoader-track {
+ width: 64px;
+ height: 64px;
+ border-style: solid;
+ border-width: 4px;
+ border-radius: 64px;
+ }
+.spectrum-CircleLoader--large .spectrum-CircleLoader-fill {
+ width: 64px;
+ height: 64px;
+ border-style: solid;
+ border-width: 4px;
+ border-radius: 64px;
+ }
+/* topdoc
+{{ circleloader/circleloader-indeterminate-default.yml }}
+*/
+.spectrum-CircleLoader--indeterminate .spectrum-CircleLoader-fills {
+ will-change: transform;
+ transform: translateZ(0);
+ animation: 1s infinite cubic-bezier(.25,.78,.48,.89) spectrum-fills-rotate;
+ transform-origin: center;
+ }
+.spectrum-CircleLoader--indeterminate .spectrum-CircleLoader-fillSubMask1 {
+ will-change: transform;
+ transform: translateZ(0);
+ animation: 1s infinite linear spectrum-fill-mask-1;
+ }
+.spectrum-CircleLoader--indeterminate .spectrum-CircleLoader-fillSubMask2 {
+ will-change: transform;
+ transform: translateZ(0);
+ animation: 1s infinite linear spectrum-fill-mask-2;
+ }
+/* topdoc
+{{ circleloader/circleloader-indeterminate-small.yml }}
+*/
+/* topdoc
+{{ circleloader/circleloader-indeterminate-large.yml }}
+*/
+/* topdoc
+{{ circleloader/circleloader-small-over-background.yml }}
+*/
+/* topdoc
+{{ circleloader/circleloader-medium-over-background.yml }}
+*/
+/* topdoc
+{{ circleloader/circleloader-large-over-background.yml }}
+*/
+/* topdoc
+{{ circleloader/circleloader-indeterminate-over-background.yml }}
+*/
+/* topdoc
+{{ toast/toast.yml }}
+*/
+.spectrum-Toast {
+ box-sizing: border-box;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-direction: row;
+ flex-direction: row;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+
+ border-radius: 4px;
+
+ padding: 8px 8px 8px 16px;
+
+ font-size: 14px;
+ font-weight: 700;
+ -webkit-font-smoothing: antialiased;
+}
+.spectrum-Toast-typeIcon {
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+
+ margin: 7px 12px 7px 0;
+}
+.spectrum-Toast-content {
+ -ms-flex: 1;
+ flex: 1;
+ display: inline-block;
+ box-sizing: border-box;
+ padding: 5px 16px 5px 0;
+ text-align: left;
+}
+.spectrum-Toast-buttons {
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex: 0 0 auto;
+ flex: 0 0 auto;
+ -ms-flex-align: end;
+ align-items: flex-end;
+ -ms-flex-wrap: wrap-reverse;
+ flex-wrap: wrap-reverse;
+}
+.spectrum-Toast-buttons .spectrum-Button + .spectrum-Button,
+ .spectrum-Toast-buttons .spectrum-Button + .spectrum-ClearButton,
+ .spectrum-Toast-buttons .spectrum-ClearButton + .spectrum-Button,
+ .spectrum-Toast-buttons .spectrum-ClearButton + .spectrum-ClearButton {
+ margin-left: 8px;
+ }
+.spectrum-Toast-body {
+ -ms-flex: 1;
+ flex: 1;
+ -ms-flex-item-align: center;
+ -ms-grid-row-align: center;
+ align-self: center;
+}
+.spectrum-Toast-body .spectrum-Button {
+ float: right;
+ margin-right: 11px;
+ }
+.spectrum-Toast-body + .spectrum-Toast-buttons {
+ padding-left: 8px;
+
+ border-left-width: 1px;
+ border-left-style: solid;
+ }
+.spectrum-Underlay {
+
+ position: fixed;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+
+ /* Float above things by default */
+ z-index: 1;
+
+ overflow: hidden;
+}
+:root {
+ /* Distance between top and bottom of dialog and edge of window for fullscreen dialog */
+
+ /* Distance between the edge of the fullscreen dialog and header */
+
+ /* The font-size of the fullscreen dialog header */
+
+ /* The font-weight of the fullscreen dialog header */
+}
+/* topdoc
+{{ dialog/dialog.yml }}
+*/
+.spectrum-Dialog {
+
+ /* Be a flexbox to allow a full sized content area that scrolls */
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-direction: column;
+ flex-direction: column;
+
+ /* Centered by default */
+ position: fixed;
+ left: 50%;
+ top: 50%;
+ transform: translateX(-50%) translateY(-50%) translateY(8px);
+
+ /* Appear above underlay */
+ z-index: 2;
+
+ /* Allow 100% width, taking into account padding */
+ box-sizing: border-box;
+
+ /* Don't be bigger than the screen */
+ max-height: 90%;
+
+ /* Be no bigger than max-width, but also be 90% if the viewport is smaller than max-width */
+ width: -webkit-fit-content;
+ width: -moz-fit-content;
+ width: fit-content;
+ max-width: 90%;
+ min-width: 288px;
+
+ padding: 40px;
+
+ border-radius: 4px;
+ outline: none;
+}
+/* Firefox shows outline */
+.spectrum-Dialog.is-open {
+
+ transform: translate(-50%, -50%);
+ }
+.spectrum-Dialog--alert {
+ /* Smaller dialog for alerts */
+ width: 90%;
+ max-width: 480px;
+}
+.spectrum-Dialog-header {
+ display: -ms-flexbox;
+ display: flex;
+ position: relative;
+ box-sizing: border-box;
+ width: 100%;
+
+ /* Don't get small when the dialog does */
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+
+ border-radius: 4px 4px 0 0;
+ outline: none; /* Hide focus outline around header */
+
+ padding-bottom: 30px;
+}
+/* The rule element */
+.spectrum-Dialog-header::after {
+ position: absolute;
+ bottom: 16px;
+ left: 0;
+ right: 0;
+ content: '';
+
+ height: 2px;
+ }
+.spectrum-Dialog-typeIcon {
+ display: block;
+}
+.spectrum-Dialog-content {
+ display: block;
+ box-sizing: border-box;
+
+ overflow-y: auto;
+ -webkit-overflow-scrolling: touch;
+
+ -ms-flex: 1 1 auto;
+
+ flex: 1 1 auto;
+
+ /* Temporary IE 11 fix */
+ max-height: 70vh;
+
+ outline: none; /* Hide focus outline */
+
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 1.5;
+}
+.spectrum-Dialog-footer {
+ border-radius: 0 0 4px 4px;
+ margin-top: 48px;
+
+ -ms-flex: 0 1 auto;
+
+ flex: 0 1 auto;
+
+ display: -ms-flexbox;
+
+ display: flex;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+
+ outline: none; /* Hide focus outline */
+}
+.spectrum-Dialog-title {
+ -ms-flex: 1 1 auto;
+ flex: 1 1 auto;
+
+ margin: 0;
+
+ font-size: 18px;
+ font-weight: 700;
+ line-height: 1.3;
+
+ /* Truncate text when it's too long to fit */
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+
+ outline: none; /* Hide focus outline */
+}
+.spectrum-Dialog--fullscreen {
+ left: 32px;
+ top: 32px;
+ right: 32px;
+ bottom: 32px;
+
+ transform: translate(0, 8px);
+}
+.spectrum-Dialog--fullscreen.is-open {
+ transform: translate(0, 0);
+ }
+.spectrum-Dialog--fullscreen,
+.spectrum-Dialog--fullscreenTakeover {
+ width: auto;
+ max-height: none;
+ max-width: none;
+
+ padding-top: 30px;
+}
+.spectrum-Dialog--fullscreen .spectrum-Dialog-header, .spectrum-Dialog--fullscreenTakeover .spectrum-Dialog-header {
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ }
+.spectrum-Dialog--fullscreen .spectrum-Dialog-title, .spectrum-Dialog--fullscreenTakeover .spectrum-Dialog-title {
+ font-size: 28px;
+ font-weight: 100;
+ }
+.spectrum-Dialog--fullscreen .spectrum-Dialog-content, .spectrum-Dialog--fullscreenTakeover .spectrum-Dialog-content {
+ max-height: none;
+ }
+.spectrum-Dialog--fullscreenTakeover {
+ position: fixed;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+
+ box-sizing: border-box;
+
+ /* Remove the border since we've taken over */
+ border: none;
+ border-radius: 0;
+}
+.spectrum-Dialog--fullscreenTakeover,
+ .spectrum-Dialog--fullscreenTakeover.is-open {
+ transform: none;
+ }
+.spectrum-Slider,
+.spectrum-Dial {
+ position: relative;
+
+ /* Don't let z-index'd child elements float above other things on the page */
+ z-index: 1;
+ display: block;
+ min-height: 32px;
+ min-width: 128px;
+
+ -webkit-user-select: none;
+
+ -moz-user-select: none;
+
+ -ms-user-select: none;
+
+ user-select: none;
+}
+.spectrum-Slider-controls,
+.spectrum-Dial-controls {
+ display: inline-block;
+ box-sizing: border-box;
+
+ position: relative;
+ z-index: auto;
+
+ /* These calculations prevent the track from spilling outside of the control */
+ width: calc(100% - 16px);
+ margin-left: 8px;
+ min-height: 32px;
+
+ vertical-align: top;
+}
+.spectrum-Slider-track,
+.spectrum-Slider-buffer,
+.spectrum-Slider-ramp {
+ height: 2px;
+ box-sizing: border-box;
+
+ position: absolute;
+ z-index: 1;
+ top: 16px;
+ left: 0;
+ right: auto;
+
+ margin-top: -1px;
+
+ pointer-events: none;
+}
+.spectrum-Slider-track,
+.spectrum-Slider-buffer {
+ padding: 0 4px 0 0;
+ margin-left: -8px;
+}
+.spectrum-Slider-track::before, .spectrum-Slider-buffer::before {
+ content: '';
+ display: block;
+ height: 100%;
+
+ border-radius: 1px;
+ }
+.spectrum-Slider-buffer {
+ padding: 0 4px 0 0;
+}
+.spectrum-Slider-track ~ .spectrum-Slider-track,
+.spectrum-Slider-buffer ~ .spectrum-Slider-buffer {
+ left: auto;
+ right: 0;
+ padding: 0 0 0 4px;
+ margin-left: 0;
+ margin-right: -8px;
+}
+.spectrum-Slider-buffer ~ .spectrum-Slider-buffer {
+ margin-right: 0;
+ padding: 0 0 0 12px;
+}
+.spectrum-Slider-buffer ~ .spectrum-Slider-buffer:after {
+ display: none;
+ }
+.spectrum-Slider--range .spectrum-Slider-value {
+ -webkit-user-select: text;
+ -moz-user-select: text;
+ -ms-user-select: text;
+ user-select: text;
+ }
+.spectrum-Slider--range .spectrum-Slider-track:first-of-type {
+ padding: 0 4px 0 0;
+ left: 0;
+ right: auto;
+ margin-left: -8px;
+ }
+.spectrum-Slider--range .spectrum-Slider-track {
+ padding: 0 12px 0 12px;
+ left: auto;
+ right: auto;
+ margin: 0;
+ }
+.spectrum-Slider--range .spectrum-Slider-track:last-of-type {
+ padding: 0 0 0 4px;
+ left: auto;
+ right: 0;
+ margin-right: -8px;
+ }
+.spectrum-Slider-buffer {
+ /* Appear above track */
+ z-index: 2;
+}
+.spectrum-Slider-ramp {
+ margin-top: 0;
+ height: 16px;
+
+ position: absolute;
+ left: -8px;
+ right: -8px;
+ top: 8px;
+}
+.spectrum-Slider-ramp svg {
+ width: 100%;
+ height: 100%;
+ }
+.spectrum-Slider-handle,
+.spectrum-Dial-handle {
+ position: absolute;
+ left: 0;
+ top: 16px;
+ z-index: 2;
+
+ display: inline-block;
+ box-sizing: border-box;
+
+ width: 16px;
+ height: 16px;
+
+ margin: -8px 0 0 -8px;
+
+ border-width: 2px;
+ border-style: solid;
+
+ border-radius: 8px;
+
+ transition: border-width 130ms ease-in-out;
+
+ outline: none;
+ cursor: pointer;
+ cursor: grab;
+}
+.spectrum-Slider-handle:active,
+.spectrum-Slider-handle.is-focused,
+.spectrum-Slider-handle.is-dragged,
+.spectrum-Dial-handle:active {
+ border-width: 6px;
+ cursor: ns-resize;
+ cursor: grabbing;
+ }
+.spectrum-Slider-handle:active,
+.spectrum-Slider-handle.is-focused,
+.spectrum-Slider-handle.is-dragged,
+.spectrum-Slider-handle.is-tophandle,
+.spectrum-Dial-handle:active {
+ z-index: 3;
+ }
+.spectrum-Slider-input,
+.spectrum-Dial-input {
+ /* Remove the margin for input in Firefox and Safari. */
+ margin: 0;
+
+ width: 16px;
+ height: 16px;
+ padding: 0;
+ position: absolute;
+ top: -2px;
+ left: -2px;
+ overflow: hidden;
+ opacity: .000001;
+ cursor: default;
+ -webkit-appearance: none;
+ border: 0;
+ pointer-events: none;
+}
+.spectrum-Slider-input:focus,
+.spectrum-Dial-input:focus {
+ outline: none;
+ }
+.spectrum-Slider-labelContainer,
+.spectrum-Dial-labelContainer {
+ display: -ms-flexbox;
+ display: flex;
+ position: relative;
+
+ width: auto;
+
+ padding-top: 4px;
+
+ font-size: 12px;
+ line-height: 1.3;
+}
+.spectrum-Slider-label,
+.spectrum-Dial-label {
+ padding-left: 0;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+}
+.spectrum-Slider-value,
+.spectrum-Dial-value {
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ padding-right: 0;
+ cursor: default;
+}
+.spectrum-Slider-ticks {
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+
+ z-index: 0;
+
+ margin: 0 -8px;
+ margin-top: 11px;
+}
+.spectrum-Slider-tick {
+ position: relative;
+
+ width: 2px;
+}
+.spectrum-Slider-tick:after {
+ display: block;
+ position: absolute;
+ top: 0;
+ left: calc(50% - 1px);
+ content: '';
+ width: 2px;
+ height: 10px;
+
+ border-radius: 1px;
+ }
+.spectrum-Slider-tick .spectrum-Slider-tickLabel {
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-align: center;
+ align-items: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+
+ margin: 16px -16px 0 -16px;
+
+ font-size: 12px;
+ line-height: 1.3;
+ }
+.spectrum-Slider-tick:first-of-type .spectrum-Slider-tickLabel, .spectrum-Slider-tick:last-of-type .spectrum-Slider-tickLabel {
+ display: block;
+ position: absolute;
+ margin: 16px 0 0 0;
+ }
+.spectrum-Slider-tick:first-of-type .spectrum-Slider-tickLabel {
+ left: 0;
+ }
+.spectrum-Slider-tick:last-of-type .spectrum-Slider-tickLabel {
+ right: 0;
+ }
+.spectrum-Slider--color .spectrum-Slider-labelContainer,
+.spectrum-Slider--color .spectrum-Dial-labelContainer {
+ padding-bottom: 5px;
+ }
+.spectrum-Slider--color .spectrum-Slider-controls,
+.spectrum-Slider--color .spectrum-Slider-controls::before,
+.spectrum-Slider--color .spectrum-Slider-track,
+.spectrum-Slider--color .spectrum-Dial-controls,
+.spectrum-Slider--color .spectrum-Dial-controls::before {
+ min-height: auto;
+ height: 24px;
+ margin-left: 0;
+ width: 100%;
+ }
+.spectrum-Slider--color .spectrum-Slider-controls::before,
+.spectrum-Slider--color .spectrum-Dial-controls::before {
+ display: block;
+ content: '';
+ }
+.spectrum-Slider--color .spectrum-Slider-controls::before,
+.spectrum-Slider--color .spectrum-Slider-track,
+.spectrum-Slider--color .spectrum-Dial-controls::before {
+ top: 0;
+ padding: 0;
+ margin-top: 0;
+ margin-right: 0;
+ border-radius: 4px;
+ }
+.spectrum-Slider--color .spectrum-Slider-handle,
+.spectrum-Slider--color .spectrum-Dial-handle {
+ top: 50%;
+ }
+.spectrum-Dial {
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-direction: column;
+ flex-direction: column;
+
+ height: auto;
+ min-width: 0;
+ min-height: 0;
+ width: 48px;
+}
+.spectrum-Dial-labelContainer {
+ margin-bottom: 5px;
+}
+.spectrum-Dial-label:only-child {
+ /* Only center if we don't have a value */
+ text-align: center;
+ }
+.spectrum-Dial-controls {
+ width: 32px;
+ height: 32px;
+ min-height: 0;
+
+ border-radius: 16px;
+ position: relative;
+ display: inline-block;
+ margin: 0;
+
+ box-sizing: border-box;
+ outline: none;
+}
+.spectrum-Dial-controls::before,
+ .spectrum-Dial-controls::after {
+ content: '';
+ width: 4px;
+ height: 2px;
+ border-radius: 1px;
+ position: absolute;
+ bottom: 0;
+ }
+.spectrum-Dial-controls::before {
+ left: auto;
+ right: -2px;
+ transform: rotate(45deg);
+ }
+.spectrum-Dial-controls::after {
+ left: -2px;
+ transform: rotate(-45deg);
+ }
+.spectrum-Dial-handle {
+ width: 100%;
+ height: 100%;
+ border-width: 2px;
+ box-shadow: none;
+ position: absolute;
+ top: 8px;
+ left: 8px;
+ right: 8px;
+ bottom: 8px;
+ border-radius: 16px;
+ transform: rotate(-45deg);
+ cursor: pointer;
+ cursor: grab;
+
+ transition: background-color 130ms ease-in-out;
+}
+.spectrum-Dial-handle::after {
+ content: '';
+ position: absolute;
+ top: 50%;
+ left: -2px;
+ width: 12px;
+ height: 2px;
+ border-radius: 1px;
+ transform: translateY(-50%);
+ transition: background-color 130ms ease-in-out;
+ }
+.spectrum-Dial-handle:active,
+ .spectrum-Dial-handle.is-focused,
+ .spectrum-Dial-handle.is-dragged {
+ border-width: 2px;
+ cursor: ns-resize;
+ cursor: grabbing;
+ }
+.spectrum-Dial-input {
+ width: 100%;
+ height: 100%;
+ left: 0;
+ top: 0;
+}
+.spectrum-Dial--small .spectrum-Dial-controls {
+ width: 24px;
+ height: 24px;
+ }
+.spectrum-Slider.is-disabled, .spectrum-Dial.is-disabled {
+ cursor: default;
+ }
+.spectrum-Slider.is-disabled .spectrum-Slider-handle,
+.spectrum-Dial.is-disabled .spectrum-Slider-handle,
+.spectrum-Slider.is-disabled .spectrum-Dial-handle,
+.spectrum-Dial.is-disabled .spectrum-Dial-handle {
+ cursor: default;
+ pointer-events: none;
+ }
+.spectrum-Slider.is-disabled.spectrum-Slider--color .spectrum-Slider-handle:hover,
+.spectrum-Slider.is-disabled.spectrum-Slider--color .spectrum-Slider-handle:active,
+.spectrum-Dial.is-disabled.spectrum-Slider--color .spectrum-Slider-handle:hover,
+.spectrum-Dial.is-disabled.spectrum-Slider--color .spectrum-Slider-handle:active,
+.spectrum-Slider.is-disabled.spectrum-Slider--color .spectrum-Dial-handle:hover,
+.spectrum-Slider.is-disabled.spectrum-Slider--color .spectrum-Dial-handle:active,
+.spectrum-Dial.is-disabled.spectrum-Slider--color .spectrum-Dial-handle:hover,
+.spectrum-Dial.is-disabled.spectrum-Slider--color .spectrum-Dial-handle:active {
+ border-width: 1px;
+ }
+.u-isGrabbing {
+ cursor: ns-resize;
+ cursor: grabbing;
+
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+}
+.u-isGrabbing .spectrum-Dial .spectrum-Dial-label,
+ .u-isGrabbing .spectrum-Dial .spectrum-Dial-value {
+ cursor: inherit;
+ }
+.u-isGrabbing .spectrum-Slider .spectrum-Slider-label,
+.u-isGrabbing .spectrum-Slider .spectrum-Slider-value,
+.u-isGrabbing .spectrum-Dial .spectrum-Slider-label,
+.u-isGrabbing .spectrum-Dial .spectrum-Slider-value {
+ cursor: inherit;
+ }
+.spectrum-Tabs {
+ display: -ms-flexbox;
+ display: flex;
+
+ /* Contain the selection indicator */
+ position: relative;
+ z-index: 0;
+
+ margin: 0;
+ padding: 0 8px;
+
+ /* Friends should align to the top of the tabs */
+ vertical-align: top;
+}
+.spectrum-Tabs-item {
+ /* Contain the focus ring */
+ position: relative;
+
+ box-sizing: border-box;
+
+ height: 46px;
+ line-height: 46px;
+
+ /* Float above the tab line */
+ z-index: 1;
+
+ text-decoration: none;
+ white-space: nowrap;
+
+ transition: color 130ms ease-out;
+ cursor: pointer;
+ outline: none;
+}
+.spectrum-Tabs-item.is-disabled {
+ cursor: default;
+ }
+.spectrum-Tabs-item.is-disabled .spectrum-Tabs-itemLabel {
+ cursor: default;
+ }
+.spectrum-Tabs-item .spectrum-Icon {
+ /* Vertical centering */
+ height: 46px;
+ }
+.spectrum-Tabs-item .spectrum-Icon + .spectrum-Tabs-itemLabel {
+ /* icons are inexplicably offset by 3px. Subtract this value from the icon-gap
+ to correct the gap in CSS */
+ margin-left: 5px;
+ }
+.spectrum-Tabs-item::before {
+ content: '';
+ position: absolute;
+ top: 50%;
+
+ box-sizing: border-box;
+
+ height: 32px;
+ margin-top: -15px;
+ left: -8px;
+ right: -8px;
+ border: 2px solid transparent;
+ border-radius: 5px;
+
+ pointer-events: none;
+ }
+.spectrum-Tabs-itemLabel {
+ cursor: pointer;
+ vertical-align: top;
+ display: inline-block;
+
+ font-size: 14px;
+ font-weight: 400;
+}
+.spectrum-Tabs-itemLabel:empty {
+ /* Hide the tab label if it's not being used */
+ display: none;
+ }
+.spectrum-Tabs-selectionIndicator {
+ position: absolute;
+ left: 0;
+
+ /* Be below the tab */
+ z-index: 0;
+
+ transition: transform 130ms ease-in-out;
+ transform-origin: top left;
+
+ border-radius: 1px;
+}
+.spectrum-Tabs--compact .spectrum-Tabs-item {
+ height: 30px;
+ line-height: 30px;
+ }
+.spectrum-Tabs--compact .spectrum-Tabs-item .spectrum-Icon {
+ /* Vertical centering */
+ height: 30px;
+ }
+.spectrum-Tabs--horizontal {
+ -ms-flex-align: center;
+ align-items: center;
+
+ border-bottom: 2px solid;
+}
+.spectrum-Tabs--horizontal .spectrum-Tabs-item {
+ vertical-align: top;
+ }
+/* Target anything since React likes to add lots of happy
s around all things */
+.spectrum-Tabs--horizontal .spectrum-Tabs-item + *:not(.spectrum-Tabs-selectionIndicator) {
+ margin-left: 24px;
+ }
+.spectrum-Tabs--horizontal .spectrum-Tabs-selectionIndicator {
+ position: absolute;
+ bottom: 0;
+ height: 2px;
+
+ bottom: -2px;
+ }
+.spectrum-Tabs--horizontal.spectrum-Tabs--compact {
+ /* The ActionButton is taller than the tabs, so don't push tabs around */
+ box-sizing: content-box;
+ height: 30px;
+ -ms-flex-align: end;
+ align-items: end;
+ }
+/* Quiet tabs should not extend all the way across the screen as their line doesn't */
+.spectrum-Tabs--quiet {
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+}
+.spectrum-Tabs--vertical {
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ padding: 0;
+ border-left: 2px solid;
+}
+.spectrum-Tabs--vertical .spectrum-Tabs-item {
+ height: 44px;
+ padding: 0 8px;
+ /* Subtract focus ring padding from margin-left since the padding value already offsets tabs-items */
+ margin-left: 4px;
+ margin-bottom: 4px;
+ }
+.spectrum-Tabs--vertical .spectrum-Tabs-item::before {
+ /* padding is included in click area of tab items, so only need to offset by the size of the focus ring's border */
+ left: -2px;
+ right: -2px;
+ margin-top: -16px;
+ }
+.spectrum-Tabs--vertical.spectrum-Tabs--compact .spectrum-Tabs-item {
+ height: 32px;
+ line-height: 32px;
+ margin-bottom: 4px;
+ }
+.spectrum-Tabs--vertical.spectrum-Tabs--compact .spectrum-Tabs-item .spectrum-Icon {
+ /* Vertical centering */
+ height: 32px;
+ }
+.spectrum-Tabs--vertical .spectrum-Tabs-selectionIndicator {
+ position: absolute;
+ left: 0px;
+ width: 2px;
+
+ left: -2px;
+ }
+/* topdoc
+{{ tabs/tabs-toomany.yml }}
+*/
+:root {
+ /* The width of a step */
+
+ /* The diameter of the marker */
+
+ /* The width of the hit area */
+
+ /* The height of the line */
+
+ /* This gives enough space for one line of text */
+
+ /* This gives enough space for the longest possible label */
+
+ /* Offset from the BOTTOM of the steplist */
+
+ /* Font size of the label */
+}
+/* topdoc
+{{ steplist/steplist-default.yml }}
+*/
+.spectrum-Steplist {
+ /* Contain child elements with positive z-index */
+ z-index: 0;
+ position: relative;
+
+ display: block;
+ vertical-align: top;
+ margin: 0;
+ padding-top: 22px;
+ padding-left: 60px;
+ padding-right: 60px;
+
+ text-align: center;
+ white-space: nowrap;
+ font-size: 0; /* To remove html whitespace between inline elements */
+ line-height: 16px; /* in case the container changes it */
+}
+.spectrum-Steplist--interactive .spectrum-Steplist-label,
+ .spectrum-Steplist--interactive .spectrum-Steplist-markerContainer {
+ /* Show cursor on hit zone when clickable */
+ cursor: pointer;
+ }
+/* Small (w/o label or tooltip) */
+.spectrum-Steplist--small {
+ padding: 11px 0;
+}
+.spectrum-Steplist--small .spectrum-Steplist-item {
+ padding: 0 40px 0 0;
+ width: 80px;
+ }
+/* Disable Label */
+.spectrum-Steplist--small .spectrum-Steplist-item .spectrum-Steplist-label {
+ display: none;
+ }
+.spectrum-Steplist--small .spectrum-Steplist-item:first-child, .spectrum-Steplist--small .spectrum-Steplist-item:last-child {
+ width: 20px;
+ }
+/* Disable first line */
+.spectrum-Steplist--small .spectrum-Steplist-item:first-child .spectrum-Steplist-markerContainer {
+ margin-left: -10px;
+ }
+.spectrum-Steplist--small .spectrum-Steplist-item:last-child .spectrum-Steplist-markerContainer {
+ margin-right: -10px;
+ }
+.spectrum-Steplist-item {
+ outline: none;
+ position: relative;
+ display: inline-block;
+ margin: 0;
+
+ /* Don't let tooltips mess up alignment */
+ vertical-align: bottom;
+
+ box-sizing: content-box;
+ width: 80px;
+ padding: 0 40px 0 0;
+}
+/* Completed State */
+.spectrum-Steplist-item.is-complete .spectrum-Steplist-marker {
+ border: none;
+ }
+/* The next step's line should be solid */
+.spectrum-Steplist-item.is-complete + .spectrum-Steplist-item .spectrum-Steplist-segment {
+ border-bottom-width: 2px;
+ border-bottom-style: solid;
+ }
+/* Selected state */
+/* Focus */
+.spectrum-Steplist-item.is-selected:focus {
+ outline: none;
+ }
+.spectrum-Steplist-item.is-selected .spectrum-Steplist-marker {
+ border: none;
+ }
+/* topdoc
+{{ steplist/steplist-label.yml }}
+*/
+.spectrum-Steplist-label {
+ position: absolute;
+ left: 50%;
+ bottom: 10px;
+
+ display: block;
+ width: 120px;
+
+ font-size: 12px;
+ white-space: normal;
+
+ transform: translateX(-50%);
+}
+.spectrum-Steplist-markerContainer {
+ display: block;
+
+ z-index: 2;
+ position: absolute;
+ bottom: -10px;
+ left: 50%;
+
+ width: 20px;
+ height: 20px;
+
+ margin-left: -10px;
+}
+/* Circle step marker */
+.spectrum-Steplist-marker {
+ box-sizing: border-box; /* So we can stroke nicely */
+ display: block;
+
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ margin-top: -4px;
+ margin-left: -4px;
+
+ width: 8px;
+ height: 8px;
+
+ border-radius: 8px;
+
+ border: 2px solid;
+ border-color: transparent;
+ background: transparent;
+}
+/* Step line */
+.spectrum-Steplist-segment {
+ display: block;
+ z-index: 1;
+ position: absolute;
+ right: 68px;
+
+ box-sizing: content-box;
+ width: 104px;
+ bottom: -1px;
+
+ /* Default is dashed */
+ border-bottom-width: 2px;
+ border-bottom-style: dashed;
+}
+/* First step overrides */
+.spectrum-Steplist-item:first-child .spectrum-Steplist-markerContainer {
+ left: 0;
+ }
+.spectrum-Steplist-item:first-child .spectrum-Steplist-label {
+ left: 0;
+ }
+.spectrum-Steplist-item:first-child .spectrum-Steplist-segment {
+ /* Not visible for first step */
+ display: none;
+ }
+/* Last step overrides */
+.spectrum-Steplist-item:last-child .spectrum-Steplist-label {
+ left: auto;
+ right: 0;
+
+ transform: translateX(50%);
+ }
+.spectrum-Steplist-item:last-child .spectrum-Steplist-markerContainer {
+ left: auto;
+ right: 0;
+
+ margin-left: 0;
+ margin-right: -10px;
+ }
+.spectrum-Steplist-item:last-child .spectrum-Steplist-segment {
+ right: 8px;
+ left: auto;
+ }
+.spectrum-Steplist-item:first-child,
+.spectrum-Steplist-item:last-child {
+ width: 20px;
+}
+/* Single step */
+.spectrum-Steplist-item:only-child .spectrum-Steplist-label {
+ /* Be centered */
+ left: 50%;
+
+ /* Override last-child bits */
+ transform: translate(-50%);
+ }
+.spectrum-Steplist-item:only-child .spectrum-Steplist-markerContainer {
+ /* Be centered */
+ left: 50%;
+
+ /* Override last-child bits */
+ margin-right: 0;
+ margin-left: -10px;
+ }
+/* topdoc
+{{ steplist/steplist-tooltip.yml }}
+*/
+/* topdoc
+{{ toggle/toggle-onoffdefault.yml }}
+*/
+.spectrum-ToggleSwitch {
+ display: inline-block;
+ position: relative;
+ font-size: 0;
+ height: 32px;
+ line-height: 32px;
+}
+.spectrum-ToggleSwitch-input {
+ /* Change the font styles in all browsers for input. */
+ font-family: inherit;
+ font-size: 100%;
+ line-height: 1.15;
+
+ /* Remove the margin for input in Firefox and Safari. */
+ margin: 0;
+
+ /* Show the overflow for input in Edge. */
+ overflow: visible;
+
+ /* Add the correct box sizing for [type="checkbox"] in IE 10-. */
+ box-sizing: border-box;
+
+ /* Remove the padding for [type="checkbox"] in IE 10-. */
+ padding: 0;
+
+ position: absolute;
+ width: 100%;
+ height: 100%;
+ top: 0;
+ left: 0;
+ opacity: .0001;
+ z-index: 1;
+
+ cursor: pointer;
+}
+.spectrum-ToggleSwitch-input:checked + .spectrum-ToggleSwitch-switch::after {
+ transform: translateX(12px);
+ }
+.spectrum-ToggleSwitch-input:disabled,
+ .spectrum-ToggleSwitch-input[disabled] {
+ cursor: default;
+ }
+.spectrum-ToggleSwitch-label {
+ margin: 0 10px;
+ font-size: 14px;
+ vertical-align: middle;
+ transition: color 160ms ease-in-out;
+}
+.spectrum-ToggleSwitch-switch {
+ display: inline-block;
+ /* positions the pseudo elements relative to this one */
+ position: relative;
+
+ height: 14px;
+ width: 26px;
+
+ vertical-align: middle;
+}
+.spectrum-ToggleSwitch-switch::before,
+ .spectrum-ToggleSwitch-switch::after {
+ display: block;
+ position: absolute;
+ content: "";
+ box-sizing: border-box;
+ }
+/* ::before is used for the track of the switch */
+.spectrum-ToggleSwitch-switch::before {
+ transition: background 130ms ease-in-out, border 130ms ease-in-out;
+
+ height: 14px;
+
+ left: 0;
+ right: 0;
+
+ border-radius: 7px;
+ }
+/* ::after is used for the handle of the switch */
+.spectrum-ToggleSwitch-switch::after {
+ transition: background 130ms ease-in-out, border 130ms ease-in-out, transform 130ms ease-in-out, box-shadow 130ms ease-in-out;
+
+ width: 14px;
+ height: 14px;
+
+ top: 0;
+ left: 0;
+
+ border-width: 2px;
+ border-radius: 7px;
+ border-style: solid;
+ }
+/* topdoc
+{{ toggle/toggle-abdefault.yml }}
+*/
+.spectrum-Menu {
+ display: inline-block;
+
+ box-sizing: border-box;
+
+ margin: 4px 0;
+ padding: 0;
+
+ list-style-type: none;
+
+ overflow: auto;
+}
+.spectrum-Menu > .spectrum-Menu-sectionHeading {
+ /* Support headings as LI */
+ margin-top: 3px;
+ margin-bottom: 3px;
+ }
+.spectrum-Menu.is-selectable .spectrum-Menu-item {
+ padding-right: 32px;
+ }
+.spectrum-Menu.is-selectable .spectrum-Menu-item.is-selected {
+ padding-right: 11px;
+ }
+.spectrum-Menu-checkmark {
+ transform: scale(1);
+ opacity: 1;
+}
+.spectrum-Menu-item {
+ cursor: pointer;
+ position: relative;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-align: center;
+ align-items: center;
+
+ box-sizing: border-box;
+
+ padding: 7px 12px 7px 10px;
+
+ margin: 0;
+
+ border-left: 2px solid transparent;
+
+ min-height: 32px;
+
+ font-size: 14px;
+ font-weight: 400;
+ font-style: normal;
+}
+.spectrum-Menu-item:focus {
+ outline: none;
+ }
+.spectrum-Menu-item.is-selected {
+ /* Redundant, but included for backwards compatibility */
+ padding-right: 11px;
+ }
+.spectrum-Menu-item.is-selected .spectrum-Menu-checkmark {
+ display: block;
+ }
+.spectrum-Menu-item .spectrum-Icon {
+ /* Don't get smaller, you're an icon! */
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ }
+.spectrum-Menu-item .spectrum-Icon + .spectrum-Menu-itemLabel {
+ margin-left: 8px;
+ }
+.spectrum-Menu-itemLabel {
+ -ms-flex: 1 1 0px;
+ flex: 1 1 0;
+}
+.spectrum-Menu-itemLabel--wrapping {
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ overflow: hidden;
+}
+.spectrum-Menu-checkmark {
+ display: none;
+ -ms-flex-item-align: start;
+ align-self: flex-start;
+ margin-top: 4px;
+}
+.spectrum-Menu-checkmark,
+.spectrum-Menu-chevron {
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ margin-left: 12px;
+}
+.spectrum-Menu-divider {
+ /* Add the correct box sizing for hr in Firefox. */
+ box-sizing: content-box;
+
+ /* Show the overflow for hr in Edge and IE. */
+ overflow: visible;
+
+ height: 2px;
+ margin: 1.5px 12px;
+ padding: 0 0;
+ border: none;
+}
+.spectrum-Menu-sectionHeading {
+ display: block;
+ margin: 6px 0 0 0;
+ padding: 0 36px 0 12px;
+
+ font-size: 11px;
+ font-weight: 400;
+ line-height: 20px;
+ text-transform: uppercase;
+ letter-spacing: 0.06em;
+}
+.spectrum-Menu .spectrum-Menu {
+ /* Fill parent menu when nested */
+ display: block;
+}
+/* topdoc
+{{ dropdown/dropdown.yml }}
+*/
+.spectrum-Dropdown {
+ position: relative;
+ display: inline-block;
+
+ /* Truncate if menu options make us too wide */
+ max-width: 100%;
+ width: 192px;
+ min-width: 48px;
+}
+/* Hack to enable select-powered Dropdowns */
+.spectrum-Dropdown select {
+ -webkit-appearance: none;
+ -moz-appearance: none;
+ appearance: none;
+ -ms-appearance: none;
+ }
+/* Edge */
+.spectrum-Dropdown select::-ms-expand {
+ display: none;
+ }
+.spectrum-Dropdown select::-ms-value {
+ background-color: transparent;
+ }
+.spectrum-Dropdown select + .spectrum-Dropdown-icon {
+ position: absolute;
+ right: 12px;
+ top: 50%;
+ margin-top: -3px;
+ }
+.spectrum-Dropdown-trigger {
+ position: relative;
+ width: 100%;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+ -ms-flex-align: center;
+ align-items: center;
+}
+.spectrum-Dropdown-label {
+ /* Be the biggest! */
+ -ms-flex: 1;
+ flex: 1;
+
+ white-space: nowrap;
+ overflow: hidden;
+
+ height: 30px;
+ line-height: 30px;
+
+ font-size: 14px;
+
+ text-overflow: ellipsis;
+ text-align: left;
+}
+.spectrum-Dropdown-label.is-placeholder {
+ font-weight: 400;
+ font-style: italic;
+ transition: color 130ms ease-in-out;
+ }
+/* Only apply margin to the icon if there's a label */
+.spectrum-Dropdown-label + .spectrum-Dropdown-icon {
+ margin-left: 12px;
+}
+.spectrum-Icon + .spectrum-Dropdown-label {
+ margin-left: 8px;
+}
+/* Only apply margin if there's a label */
+.spectrum-Dropdown-label ~ .spectrum-Dropdown-icon {
+ margin-left: 12px;
+}
+.spectrum-Dropdown-icon {
+ display: inline-block;
+ position: relative;
+ vertical-align: top;
+ transition: color 130ms ease-out;
+
+ /* Fix Safari 10 bug where align-items is ignored inside of buttons */
+ margin-top: 12px;
+ margin-bottom: 12px;
+
+ opacity: 1;
+}
+/* Error icons */
+.spectrum-Dropdown-trigger .spectrum-Icon:not(.spectrum-Dropdown-icon) {
+ /* Fix Safari 10 bug where align-items is ignored inside of buttons */
+ margin-top: 6px;
+ margin-bottom: 6px;
+ }
+.spectrum-Dropdown-trigger .spectrum-Dropdown-label + .spectrum-Icon:not(.spectrum-Dropdown-icon) {
+ margin-left: 12px;
+ }
+.spectrum-Icon + .spectrum-Dropdown-icon {
+ margin-left: 8px;
+}
+/* topdoc
+{{ dropdown/dropdown-quiet.yml }}
+*/
+.spectrum-Dropdown--quiet {
+ width: auto;
+ min-width: 48px;
+}
+.spectrum-Dropdown-popover {
+ max-width: 240px;
+}
+.spectrum-Dropdown-popover--quiet {
+ margin-left: -13px;
+}
+/* topdoc
+{{ dropzone/dropzone.yml }}
+*/
+.spectrum-Dropzone {
+ text-align: center;
+ border-width: 2px;
+ border-radius: 4px;
+ padding: 72px;
+ border-style: dashed;
+}
+.spectrum-Dropzone.is-dragged {
+ border-style: solid;
+ }
+.spectrum-Dropzone:focus {
+ outline: 0;
+ border-style: dashed;
+ }
+.spectrum-Dropzone:focus.focus-ring {
+ border-style: solid;
+ }
+/* topdoc
+{{ popover/popover.yml }}
+*/
+.spectrum-Popover {
+
+ /* Be a flexbox to allow a full sized content area that scrolls */
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ box-sizing: border-box;
+
+ min-width: 32px;
+ min-height: 32px;
+
+ position: absolute;
+
+ border-style: solid;
+ border-width: 1px;
+ border-radius: 4px;
+
+ outline: none;
+}
+/* Hide focus outline */
+.spectrum-Popover-tip {
+ position: absolute;
+ /* This hides half of the tooltip, but it also crops the shadow slightly, which is undesireable */
+ overflow: hidden;
+ width: 21px;
+ height: 11px;
+}
+.spectrum-Popover-tip::after {
+ content: '';
+ width: 20px;
+ height: 20px;
+ border-width: 1px;
+ border-style: solid;
+ position: absolute;
+ transform: rotate(45deg);
+ top: -18px;
+ left: -1px;
+ }
+.spectrum-Popover--dialog {
+ min-width: 270px;
+ padding: 30px 29px;
+}
+/* topdoc
+{{ popover/popover-dialog.yml }}
+*/
+.spectrum-Popover--left.spectrum-Popover--withTip {
+ margin-right: 13px;
+ }
+.spectrum-Popover--left .spectrum-Popover-tip {
+ right: -16px;
+ transform: rotate(-90deg);
+ }
+.spectrum-Popover--right.spectrum-Popover--withTip {
+ margin-left: 13px;
+ }
+.spectrum-Popover--right .spectrum-Popover-tip {
+ left: -16px;
+ transform: rotate(90deg);
+ }
+/* Center the tip by default */
+.spectrum-Popover--left .spectrum-Popover-tip, .spectrum-Popover--right .spectrum-Popover-tip {
+ top: 50%;
+ margin-top: -6px;
+ }
+.spectrum-Popover--bottom.spectrum-Popover--withTip {
+ margin-top: 13px;
+ }
+.spectrum-Popover--bottom .spectrum-Popover-tip {
+ top: -11px;
+ transform: rotate(180deg);
+ }
+.spectrum-Popover--top.spectrum-Popover--withTip {
+ margin-bottom: 13px;
+ }
+.spectrum-Popover--top .spectrum-Popover-tip {
+ bottom: -11px;
+ }
+/* Center the tip by default */
+.spectrum-Popover--bottom .spectrum-Popover-tip, .spectrum-Popover--top .spectrum-Popover-tip {
+ left: 50%;
+ margin-left: -12px;
+ }
+/* topdoc
+{{ splitbutton/splitbutton-cta.yml }}
+*/
+/* topdoc
+{{ splitbutton/splitbutton-primary.yml }}
+*/
+/* topdoc
+{{ splitbutton/splitbutton-secondary.yml }}
+*/
+.spectrum-SplitButton {
+ position: relative;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-direction: row;
+ flex-direction: row;
+ vertical-align: top;
+}
+/* Spacing for buttons placed inline */
+.spectrum-SplitButton + .spectrum-SplitButton,
+ .spectrum-SplitButton + .spectrum-Button {
+ margin-left: 12px;
+ }
+/* Spacing for buttons placed inline */
+.spectrum-Button + .spectrum-SplitButton {
+ margin-left: 12px;
+}
+.spectrum-SplitButton-action {
+ margin-left: 0;
+
+ border-radius: 16px 0 0 16px;
+}
+/* CTA is special and doesn't have a border between the buttons */
+.spectrum-SplitButton-action.spectrum-Button--cta {
+ border-right: 0;
+ margin-right: 2px;
+ }
+.spectrum-SplitButton-action + .spectrum-SplitButton-trigger {
+ /* Override button + button style */
+ margin-left: 0;
+ }
+.spectrum-SplitButton-trigger {
+ margin-left: 0;
+
+ border-radius: 0 16px 16px 0;
+ border-left-width: 0;
+
+ padding-left: 8.00004px;
+ padding-right: 10px;
+
+ min-width: 0;
+}
+.spectrum-SplitButton-trigger.focus-ring {
+ box-shadow: none;
+ }
+.spectrum-SplitButton-icon {
+ display: block;
+ margin-top: 1px;
+}
+.spectrum-SplitButton-action,
+.spectrum-SplitButton-trigger {
+ position: relative;
+}
+.spectrum-SplitButton-action:focus, .spectrum-SplitButton-trigger:focus {
+ /* Be on top when focused or border leaks */
+ z-index: 1;
+ }
+.spectrum-SplitButton-action .spectrum-Button-label + .spectrum-Icon {
+ margin-left: 12px;
+ }
+.spectrum-SplitButton--left .spectrum-SplitButton-action {
+ border-radius: 0 16px 16px 0;
+ margin-right: 0;
+ margin-left: 0;
+ }
+/* CTA is special and doesn't have a border between the buttons */
+.spectrum-SplitButton--left .spectrum-SplitButton-action.spectrum-Button--cta {
+ border-left: 0;
+ margin-left: 2px;
+ }
+.spectrum-SplitButton--left .spectrum-SplitButton-trigger {
+ margin-right: 0;
+
+ border-radius: 16px 0 0 16px;
+
+ border-left-width: 2px;
+ border-right-width: 0;
+
+ padding-right: 8.00004px;
+ padding-left: 10px;
+ }
+/* https://git.corp.adobe.com/Spectrum/spectrum-origins/pull/60 */
+:root {
+
+ /* Subtract the size of the border since it's on the item itself */
+}
+/* topdoc
+{{ accordion/accordion.yml }}
+*/
+.spectrum-Accordion {
+ display: block;
+ list-style: none;
+ padding: 0;
+ margin: 0;
+}
+.spectrum-Accordion-itemIndicator {
+ display: block;
+
+ position: absolute;
+ left: 16px;
+ top: 14.5px;
+
+ transition: transform ease 130ms;
+}
+.spectrum-Accordion-item {
+ z-index: inherit;
+ position: relative;
+
+ display: list-item;
+ margin: 0;
+
+ border-bottom: 1px solid transparent;
+}
+.spectrum-Accordion-item:first-of-type {
+ border-top: 1px solid transparent;
+ }
+.spectrum-Accordion-itemHeader {
+ position: relative;
+
+ box-sizing: border-box;
+ /* left padding takes into account the icon's size as well as the focus state's left border */
+ padding: 0 16px 0 34px;
+ margin: 0;
+
+ height: 39px;
+
+ font-size: 11px;
+ text-transform: uppercase;
+ line-height: 39px;
+ letter-spacing: 0.0006em;
+
+ text-overflow: ellipsis;
+ cursor: pointer;
+ font-weight: 500;
+}
+.spectrum-Accordion-itemHeader:focus {
+ outline: none;
+ }
+.spectrum-Accordion-itemHeader:focus::after {
+ content: '';
+
+ position: absolute;
+ left: 0;
+ top: -1px;
+ bottom: -1px;
+
+ width: 2px;
+ }
+.spectrum-Accordion-itemContent {
+ padding: 0 16px 16px 16px;
+ display: none;
+}
+.spectrum-Accordion-item.is-open > .spectrum-Accordion-itemIndicator {
+ transform: rotate(90deg);
+ }
+.spectrum-Accordion-item.is-open > .spectrum-Accordion-itemHeader::after {
+ /* No bottom border when open, so be less tall */
+ height: 39px;
+ }
+.spectrum-Accordion-item.is-open > .spectrum-Accordion-itemContent {
+ display: block;
+ }
+.spectrum-Accordion-item.is-disabled .spectrum-Accordion-itemHeader {
+ cursor: default;
+ }
+/* topdoc
+{{ actionmenu/actionmenu.yml }}
+*/
+.spectrum-Well {
+ display: block;
+ min-width: 248px;
+ padding: 16px;
+ margin-top: 4px;
+ border-width: 1px;
+ border-style: solid;
+ border-radius: 4px;
+}
+/* topdoc
+{{ fieldlabel/fieldlabel.yml }}
+*/
+/* topdoc
+{{ fieldlabel/fieldlabel-required.yml }}
+*/
+.spectrum-FieldLabel,
+.spectrum-Form-itemLabel {
+ display: block;
+
+ box-sizing: border-box;
+
+ padding: 4px 0 5px;
+
+ font-size: 12px;
+ font-weight: 400;
+ line-height: 1.3;
+
+ vertical-align: top;
+
+ -webkit-font-smoothing: subpixel-antialiased;
+ -moz-osx-font-smoothing: auto;
+ font-smoothing: subpixel-antialiased;
+}
+.spectrum-FieldLabel-requiredIcon {
+ margin: 4px 0 0 2px;
+}
+/* topdoc
+{{ fieldlabel/fieldlabel-left.yml }}
+*/
+.spectrum-FieldLabel--left {
+ display: inline-block;
+ padding: 8px 8px 0 0;
+}
+.spectrum-FieldLabel--left .spectrum-FieldLabel-requiredIcon {
+ margin: 0px 0 0 2px;
+ }
+/* topdoc
+{{ fieldlabel/fieldlabel-right.yml }}
+*/
+.spectrum-FieldLabel--right {
+ display: inline-block;
+ text-align: right;
+ padding: 8px 8px 0 0;
+}
+/* topdoc
+{{ form/index.yml }}
+*/
+.spectrum-Form {
+ display: table;
+ border-collapse: separate;
+ border-spacing: 0 24px;
+ margin: -20px 0;
+}
+.spectrum-Form-item {
+ display: table-row;
+}
+.spectrum-Form-itemLabel {
+ display: table-cell;
+}
+.spectrum-Form-itemField {
+ display: table-cell;
+}
+/* topdoc
+{{ search/search.yml }}
+*/
+/* topdoc
+{{ search/search-quiet.yml }}
+*/
+.spectrum-Search {
+ display: inline-block;
+ position: relative;
+}
+.spectrum-Search .spectrum-ClearButton {
+ position: absolute;
+ right: 0;
+ top: 0;
+ }
+.spectrum-Search-input {
+ display: block;
+
+ /* Correct the odd appearance of input[type="search"] in Chrome and Safari.*/
+ /* This gets overridden by .spectrum-Textfield */
+ -webkit-appearance: textfield;
+
+ /* Correct the outline for input[type="search"] style in Safari. */
+ outline-offset: -2px;
+
+ /* Use padding instead of text-indent so long strings don't overlap the icon */
+ padding-left: 36px;
+ text-indent: 0;
+
+ /* Don't let long strings overlap the close icon */
+ padding-right: 28px;
+}
+/* Remove the inner padding and cancel buttons for input[type="search"] in Chrome and Safari on macOS. */
+.spectrum-Search-input::-webkit-search-cancel-button,
+ .spectrum-Search-input::-webkit-search-decoration {
+ -webkit-appearance: none;
+ }
+.spectrum-Search-input.spectrum-Textfield--quiet {
+ padding-left: 24px;
+ padding-right: 20px;
+ }
+/* Since quiet button has no left padding, push the icon all the way to the left */
+.spectrum-Search-input.spectrum-Textfield--quiet ~ .spectrum-Search-icon {
+ left: 0;
+ }
+.spectrum-Search-input.spectrum-Textfield--quiet ~ .spectrum-Search-clear {
+ right: -8px;
+ }
+/* Since quiet button has no right padding, push the icon all the way to the right */
+.spectrum-Search-input.spectrum-Textfield--quiet ~ .spectrum-Search-rightIcon {
+ right: 0;
+ }
+.spectrum-Search-icon {
+ display: block;
+ position: absolute;
+ left: 12px;
+ top: 8px;
+
+ pointer-events: none;
+}
+.spectrum-Stepper {
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-direction: row-reverse;
+ flex-direction: row-reverse;
+ -ms-flex-wrap: nowrap;
+ flex-wrap: nowrap;
+
+ width: 192px;
+ line-height: 0;
+ border-radius: 4px;
+ transition: border-color 130ms ease-in-out, box-shadow 130ms ease-in-out;
+}
+.spectrum-Stepper::before {
+ content: '';
+}
+.spectrum-Stepper-buttons {
+ display: block;
+ border-radius: 4px 0 0 4px;
+ transition: box-shadow 130ms ease-in-out;
+}
+.spectrum-Stepper-stepUp,
+.spectrum-Stepper-stepDown {
+ position: relative;
+ display: block;
+
+ height: 16px;
+ width: 24px;
+
+ padding-left: 6px;
+ padding-right: 6px;
+
+ /* Avoid margin added by adjacent buttons */
+ margin: 0 !important;
+
+ border-width: 1px;
+ border-right-width: 0;
+ border-radius: 4px 0 0 4px;
+}
+.spectrum-Stepper-stepUp .spectrum-Icon, .spectrum-Stepper-stepDown .spectrum-Icon {
+ margin: 0 !important;
+ opacity: 1;
+ }
+.spectrum-Stepper-stepUp {
+ border-bottom: none;
+ border-bottom-left-radius: 0;
+}
+.spectrum-Stepper-stepUp .spectrum-Icon {
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+ bottom: 3px;
+ }
+.spectrum-Stepper-stepDown {
+ border-top: none;
+ border-top-left-radius: 0;
+ border-bottom-width: 1px;
+}
+.spectrum-Stepper-stepDown:focus {
+ border-top: none;
+ }
+.spectrum-Stepper-stepDown .spectrum-Icon {
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+ top: 3px;
+ }
+.spectrum-Stepper-input {
+ position: relative;
+
+ -ms-flex: 1;
+
+ flex: 1;
+
+ border-top-left-radius: 0;
+ border-bottom-left-radius: 0;
+
+ z-index: 1;
+}
+.spectrum-Stepper--quiet {
+ border-radius: 0;
+}
+.spectrum-Stepper--quiet .spectrum-Stepper-buttons .spectrum-ActionButton,
+.spectrum-Stepper--quiet .spectrum-Stepper-buttons .spectrum-Tool {
+ border-top: none;
+ border-left: none;
+ border-radius: 0;
+ }
+/* topdoc
+{{ calendar/calendar.yml }}
+*/
+/* topdoc
+{{ calendar/calendar-disabled.yml }}
+*/
+/* topdoc
+{{ calendar/calendar-focused.yml }}
+*/
+/* topdoc
+{{ calendar/calendar-range.yml }}
+*/
+.spectrum-Calendar {
+ display: inline-block;
+}
+.spectrum-Calendar--padded {
+ margin: 32px 24px;
+}
+.spectrum-Calendar-header {
+ position: relative;
+ box-sizing: border-box;
+ width: 100%;
+ height: 32px;
+}
+.spectrum-Calendar-title {
+ position: absolute;
+ left: 0;
+ top: 0;
+
+ font-size: 18px;
+ font-weight: bold;
+
+ box-sizing: border-box;
+ width: 100%;
+ line-height: 32px;
+ margin: 0;
+ padding: 0 32px;
+
+ text-align: center;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+}
+.spectrum-Calendar-prevMonth,
+.spectrum-Calendar-nextMonth {
+ position: absolute;
+
+}
+.spectrum-Calendar-prevMonth {
+ left: 3px;
+}
+.spectrum-Calendar-nextMonth {
+ right: 3px;
+}
+.spectrum-Calendar-dayOfWeek {
+ position: absolute;
+ bottom: 4px;
+
+ display: block;
+
+ width: 32px;
+
+ border-bottom: none !important; /* override abbr styling from normalize.css */
+
+ font-size: 11px;
+ font-weight: 500;
+ text-transform: uppercase;
+ text-decoration: none !important; /* override abbr styling from normalize.css */
+
+ cursor: default;
+}
+.spectrum-Calendar-dayOfWeek[title] {
+ /* Normalize abbr[title] */
+ /* Remove the bottom border in Chrome 57- and Firefox 39-. */
+ border-bottom: none;
+
+ /* Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. */
+ text-decoration: underline;
+ text-decoration: underline dotted;
+ }
+.spectrum-Calendar-body {
+ outline: none;
+}
+.spectrum-Calendar-table {
+ table-layout: fixed;
+ /*width: 100%;*/
+
+ border-collapse: collapse;
+ border-spacing: 0;
+
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+}
+.spectrum-Calendar-tableCell {
+ text-align: center;
+ padding: 0;
+ position: relative;
+ box-sizing: content-box;
+ height: 32px;
+ width: 32px;
+ padding: 4px;
+}
+.spectrum-Calendar-tableCell:focus {
+ outline: 0;
+ }
+.spectrum-Calendar-date {
+ /* This is fun, but we need to trick the table so it doesn't size itself in a weird way */
+ position: absolute;
+ display: block;
+ top: 0;
+ left: 0;
+
+ box-sizing: border-box;
+
+ height: 32px;
+ width: 32px;
+ margin: 4px;
+
+ border-radius: 32px;
+ border: 2px solid transparent;
+
+ font-size: 14px;
+ line-height: 28px;
+
+ cursor: pointer;
+
+ transition: background 130ms ease-in-out,
+ color 130ms ease-in-out,
+ border-color 130ms ease-in-out;
+}
+.spectrum-Calendar-date.is-disabled {
+ cursor: default;
+ pointer-events: none;
+ }
+.spectrum-Calendar-date.is-outsideMonth {
+ visibility: hidden;
+ }
+.spectrum-Calendar-date:before {
+ content: '';
+ position: absolute;
+ top: calc(50% - 16px);
+ left: calc(50% - 16px);
+ box-sizing: border-box;
+ width: 32px;
+ height: 32px;
+ border-radius: 32px;
+ border: 2px solid transparent;
+ }
+.spectrum-Calendar-date.is-selected:not(.is-range-selection) {
+ font-weight: 700;
+ }
+.spectrum-Calendar-date.is-selected:not(.is-range-selection):before {
+ /* No highlight for lone selections */
+ display: none;
+ }
+.spectrum-Calendar-date.is-today {
+ font-weight: 700;
+ }
+.spectrum-Calendar-date.is-range-selection {
+ /* overrides to make the cells appear connected */
+ margin: 4px 0;
+ border-width: 0;
+ line-height: 32px;
+ border-radius: 0;
+
+ /* Todo: Calculate this */
+ width: 40px;
+ }
+.spectrum-Calendar-date.is-range-selection.is-range-start,
+ .spectrum-Calendar-date.is-range-selection.is-range-end,
+ .spectrum-Calendar-date.is-range-selection.is-selection-start,
+ .spectrum-Calendar-date.is-range-selection.is-selection-end {
+ width: 36px;
+ }
+.spectrum-Calendar-date.is-range-selection.is-selection-start,
+ .spectrum-Calendar-date.is-range-selection.is-selection-end {
+ font-weight: 700;
+ }
+.spectrum-Calendar-date.is-range-selection.is-selection-start:after, .spectrum-Calendar-date.is-range-selection.is-selection-end:after {
+ position: absolute;
+ top: 0;
+
+ display: block;
+
+ height: 32px;
+ width: 32px;
+
+ border-radius: 32px;
+
+ content: '';
+ }
+.spectrum-Calendar-date.is-range-selection.is-range-start,
+ .spectrum-Calendar-date.is-range-selection.is-selection-start {
+ padding-right: 4px;
+ margin-left: 4px;
+ border-radius: 32px 0 0 32px;
+ }
+.spectrum-Calendar-date.is-range-selection.is-range-start:before,
+ .spectrum-Calendar-date.is-range-selection.is-range-start:after,
+ .spectrum-Calendar-date.is-range-selection.is-selection-start:before,
+ .spectrum-Calendar-date.is-range-selection.is-selection-start:after {
+ left: 0;
+ }
+.spectrum-Calendar-date.is-range-selection.is-range-end,
+ .spectrum-Calendar-date.is-range-selection.is-selection-end {
+ padding-left: 4px;
+ margin-right: 4px;
+ border-radius: 0 32px 32px 0;
+ }
+.spectrum-Calendar-date.is-range-selection.is-range-end:before,
+ .spectrum-Calendar-date.is-range-selection.is-range-end:after,
+ .spectrum-Calendar-date.is-range-selection.is-selection-end:before,
+ .spectrum-Calendar-date.is-range-selection.is-selection-end:after {
+ left: auto;
+ right: 0;
+ }
+.spectrum-Calendar-date.is-range-selection.is-selection-start.is-selection-end,
+ .spectrum-Calendar-date.is-range-selection.is-selection-start.is-range-end,
+ .spectrum-Calendar-date.is-range-selection.is-selection-end.is-range-start,
+ .spectrum-Calendar-date.is-range-selection.is-range-start.is-range-end {
+ width: 32px;
+ border-radius: 32px;
+ }
+/* topdoc
+{{ table/table-standard.yml }}
+*/
+/* topdoc
+{{ table/table-divs.yml }}
+*/
+/* topdoc
+{{ table/table-divs-quiet.yml }}
+*/
+/* topdoc
+{{ table/table-dropzone.yml }}
+*/
+.spectrum-Table {
+ border-collapse: separate;
+ border-spacing: 0;
+}
+.spectrum-Table-sortedIcon {
+ display: none;
+ margin-left: 10px;
+
+ vertical-align: middle;
+
+ transition: transform 130ms ease-in-out;
+}
+.spectrum-Table-headCell {
+ box-sizing: border-box;
+ text-align: left;
+ font-size: 11px;
+ font-weight: 700;
+ line-height: 1.3;
+ min-height: 12px;
+ letter-spacing: 0.06em;
+ text-transform: uppercase;
+ padding: 10px 16px;
+ transition: color 130ms ease-in-out;
+ cursor: default;
+ outline: 0;
+ border-radius: 0px;
+}
+.spectrum-Table-headCell.is-sortable {
+ cursor: pointer;
+ }
+.spectrum-Table-headCell.is-sorted-asc .spectrum-Table-sortedIcon, .spectrum-Table-headCell.is-sorted-desc .spectrum-Table-sortedIcon {
+ display: inline-block;
+ /* offset icon because it's not properly aligned */
+ margin-top: -2px;
+ }
+.spectrum-Table-headCell.is-sorted-asc .spectrum-Table-sortedIcon {
+ transform: rotateZ(180deg);
+ }
+.spectrum-Table-cell--alignCenter {
+ text-align: center;
+}
+.spectrum-Table-cell--alignRight {
+ text-align: right;
+}
+/* Helper for shared drop target overlay */
+.spectrum-Table-body.is-drop-target::before,
+.spectrum-Table-row.is-drop-target::before {
+ content: '';
+ position: absolute;
+ top: 0;
+ left: 0;
+ bottom: 0;
+ right: 0;
+ z-index: 1;
+ }
+.spectrum-Table-body {
+ position: relative;
+
+ border-width: 1px;
+ border-radius: 4px;
+ overflow: auto;
+ vertical-align: top;
+}
+/* The tbody tag doesn't allow setting a border-radius, so these hacks are to make that work
+ by putting it on the individual cells instead. */
+.spectrum-Table:not(.spectrum-Table--quiet) tbody.spectrum-Table-body {
+ border-width: 1px;
+ border-radius: 4px;
+ }
+.spectrum-Table:not(.spectrum-Table--quiet) tbody.spectrum-Table-body .spectrum-Table-row:first-child .spectrum-Table-cell:first-child {
+ border-top-left-radius: 4px;
+ }
+.spectrum-Table:not(.spectrum-Table--quiet) tbody.spectrum-Table-body .spectrum-Table-row:first-child .spectrum-Table-cell:last-child {
+ border-top-right-radius: 4px;
+ }
+.spectrum-Table:not(.spectrum-Table--quiet) tbody.spectrum-Table-body .spectrum-Table-row:last-child .spectrum-Table-cell:first-child {
+ border-bottom-left-radius: 4px;
+ }
+.spectrum-Table:not(.spectrum-Table--quiet) tbody.spectrum-Table-body .spectrum-Table-row:last-child .spectrum-Table-cell:last-child {
+ border-bottom-right-radius: 4px;
+ }
+.spectrum-Table-cell {
+ box-sizing: border-box;
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 1.5;
+ padding: 14px 16px;
+ /* Subtract top/bottom padding for this value to be correct in this implementation */
+ min-height: 20px;
+}
+.spectrum-Table-cell,
+.spectrum-Table-headCell {
+ position: relative;
+}
+.spectrum-Table-cell.focus-ring,
+ .spectrum-Table-cell .is-focused,
+ .spectrum-Table-headCell.focus-ring,
+ .spectrum-Table-headCell .is-focused {
+ outline: none;
+ }
+.spectrum-Table-cell.focus-ring::before, .spectrum-Table-cell .is-focused::before, .spectrum-Table-headCell.focus-ring::before, .spectrum-Table-headCell .is-focused::before {
+ content: '';
+
+ /* Float above border */
+ z-index: 1;
+ position: absolute;
+
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+
+ border-radius: 3px;
+ }
+.spectrum-Table-headCell.focus-ring::before, .spectrum-Table-headCell .is-focused::before {
+ top: 1px;
+ right: 1px;
+ bottom: 1px;
+ left: 1px;
+ }
+.spectrum-Table-cell--divider {
+ border-right-width: 1px;
+}
+.spectrum-Table-row {
+ position: relative;
+ cursor: pointer;
+ transition: background-color 130ms ease-in-out;
+}
+.spectrum-Table-row:focus {
+ outline: 0;
+ }
+.spectrum-Table > .spectrum-Table-body > .spectrum-Table-row:last-of-type {
+ border-bottom-style: none;
+}
+/* topdoc
+{{ table/table-quiet.yml }}
+*/
+.spectrum-Table--quiet .spectrum-Table-body {
+ border-radius: 0px;
+ }
+.spectrum-Table--quiet .spectrum-Table-body.is-drop-target::before, .spectrum-Table--quiet .spectrum-Table-row.is-drop-target::before {
+ border-radius: 4px;
+ }
+/* topdoc
+{{ table/table-standard-multiselect.yml }}
+*/
+.spectrum-Table-checkboxCell {
+ padding-right: 8px;
+ /* have to eliminate vertical padding to allow proper vertical alignment */
+ padding-top: 0px;
+ padding-bottom: 0px;
+ vertical-align: middle;
+}
+.spectrum-Table-checkbox {
+ vertical-align: super;
+}
+/* topdoc
+{{ table/table-quiet-multiselect.yml }}
+*/
+/* topdoc
+{{ table/table-dividers.yml }}
+*/
+.spectrum-Rating {
+ cursor: pointer;
+ position: relative;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+}
+.spectrum-Rating.is-disabled {
+ cursor: default;
+ pointer-events: none;
+ }
+.spectrum-Rating-input {
+ position: absolute;
+ width: 130px;
+ height: 18px;
+ margin: 0;
+ opacity: 0.0001;
+ pointer-events: none;
+ z-index: 0;
+}
+.spectrum-Rating-icon {
+ background-size: contain;
+ background-repeat: no-repeat;
+ width: 26px;
+ height: 18px;
+}
+.spectrum-Rating-starActive,
+.spectrum-Rating-starInactive {
+ width: 18px;
+ height: 18px;
+ margin: 0 auto;
+}
+.spectrum-Rating-starActive {
+ display: none;
+}
+.spectrum-Rating-starInactive {
+ display: block;
+}
+/* topdoc
+{{ tags/tags.yml }}
+*/
+/* topdoc
+{{ tags/tags-deletable.yml }}
+*/
+.spectrum-Tags {
+ display: inline-block;
+
+ margin: 0;
+ padding: 0;
+ list-style: none;
+}
+.spectrum-Tags:after {
+ content: "";
+ display: table;
+ clear: both;
+ }
+.spectrum-Tags-item {
+ float: left;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-align: center;
+ align-items: center;
+ box-sizing: border-box;
+
+ margin: 4px 4px;
+ padding: 0 9px;
+ height: 24px;
+ max-width: 100%;
+
+ border-width: 1px;
+ border-style: solid;
+ border-radius: 4px;
+ outline: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+
+ transition: border-color 130ms ease-in-out,
+ color 130ms ease-in-out,
+ box-shadow 130ms ease-in-out,
+ background-color 130ms ease-in-out;
+}
+.spectrum-Tags-item.is-disabled {
+ pointer-events: none;
+ }
+.spectrum-Tags-item > .spectrum-Icon,
+ .spectrum-Tags-item > .spectrum-Avatar {
+ margin-right: 8px;
+
+ /* Add padding for "avatar" variant */
+ margin-left: -2px;
+ }
+.spectrum-Tags-item > .spectrum-Icon ~ .spectrum-Tags-itemLabel, .spectrum-Tags-item > .spectrum-Avatar ~ .spectrum-Tags-itemLabel {
+ margin-right: -2px;
+ }
+.spectrum-Tags-item .spectrum-ClearButton {
+ margin-right: -10px;
+ }
+.spectrum-Tags-itemLabel {
+ height: 100%;
+ line-height: 22px;
+ -ms-flex: 1 1 auto;
+ flex: 1 1 auto;
+ font-size: 12px;
+ cursor: default;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+}
+/* topdoc
+{{ searchwithin/searchwithin.yml }}
+*/
+:root {
+
+ /* Force override */
+}
+.spectrum-SearchWithin {
+ width: 250px;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ position: relative;
+}
+.spectrum-SearchWithin .spectrum-Dropdown {
+ width: auto;
+ min-width: 0;
+ }
+.spectrum-SearchWithin .spectrum-Dropdown-trigger {
+ border-top-right-radius: 0;
+ border-bottom-right-radius: 0;
+ }
+.spectrum-SearchWithin .spectrum-Dropdown-label {
+ /* Override dropdown's min-width and be tiny */
+ min-width: 0;
+ }
+.spectrum-SearchWithin .spectrum-Textfield {
+ -ms-flex: 1;
+ flex: 1;
+ margin-left: -1px; /* hides left border */
+ border-top-left-radius: 0;
+ border-bottom-left-radius: 0;
+ }
+.spectrum-SearchWithin .spectrum-Textfield:hover, .spectrum-SearchWithin .spectrum-Textfield:focus {
+ position: relative; /* shows left border */
+ }
+.spectrum-SearchWithin .spectrum-ClearButton {
+ position: absolute;
+ top: 0;
+ right: 0;
+ }
+.spectrum-QuickActions {
+ box-sizing: border-box;
+
+ display: -ms-inline-flexbox;
+
+ display: inline-flex;
+ -ms-flex-align: center;
+ align-items: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+
+ padding: 4px 4px;
+
+ height: 40px;
+
+ border-radius: 4px;
+}
+.spectrum-QuickActions .spectrum-ActionButton + .spectrum-ActionButton,
+.spectrum-QuickActions .spectrum-Tool + .spectrum-Tool {
+ margin-left: 8px;
+ }
+.spectrum-QuickActions--textOnly .spectrum-ActionButton + .spectrum-ActionButton,
+.spectrum-QuickActions--textOnly .spectrum-Tool + .spectrum-Tool {
+ margin-left: 4px;
+ }
+.spectrum-QuickActions--right.is-open { /* should animate to the left when aligned right */
+ }
+.spectrum-QuickActions--left.is-open { /* should animate to the right when aligned left */
+ }
+/* topdoc
+{{ assetlist/assetlist.yml }}
+*/
+.spectrum-AssetList {
+ margin-top: 0;
+ margin-bottom: 0;
+ padding: 0;
+}
+.spectrum-AssetList-item {
+ position: relative;
+
+ display: -ms-flexbox;
+
+ display: flex;
+ box-sizing: border-box;
+ -ms-flex-align: center;
+ align-items: center;
+
+ width: 272px;
+ height: 40px;
+
+ padding: 0 16px 0 16px;
+ margin: 0 0 4px 0;
+
+ border-radius: 4px;
+
+ transition: background-color 130ms ease-in-out;
+
+ font-size: 14px;
+ font-weight: 400;
+ font-style: normal;
+
+ cursor: pointer;
+
+ outline: none;
+}
+.spectrum-AssetList-item::before {
+ content: '';
+
+ position: absolute;
+ left: 0;
+ right: 0;
+
+ height: 40px;
+
+ background-color: transparent;
+
+ border-radius: 4px;
+ }
+/* checkbox on the left, shows up always */
+.spectrum-AssetList-item.is-selectable .spectrum-Checkbox, .spectrum-AssetList-item.is-selected .spectrum-Checkbox, .spectrum-AssetList-item:hover .spectrum-Checkbox, .spectrum-AssetList-item:focus .spectrum-Checkbox {
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ }
+/* show chevron */
+.spectrum-AssetList-item.is-branch .spectrum-AssetList-itemChildIndicator {
+ display: block;
+ }
+.spectrum-AssetList-item .spectrum-AssetList-itemThumbnail {
+ /* Remove the border on images inside links in IE 10-. */
+ border-style: none;
+
+ width: 24px;
+ height: 24px;
+ margin-left: 8px;
+ vertical-align: middle;
+ }
+.spectrum-AssetList-itemSelector {
+ display: none;
+ margin: 0;
+}
+.spectrum-AssetList-itemChildIndicator {
+ display: none;
+ transition: transform ease 130ms;
+}
+.spectrum-AssetList-itemLabel {
+ -ms-flex: 1;
+ flex: 1;
+ padding-left: 8px;
+
+ text-overflow: ellipsis;
+ overflow: hidden;
+ white-space: nowrap;
+}
+/* topdoc
+{{ miller/miller-column.yml }}
+*/
+.spectrum-MillerColumns {
+ overflow-x: auto;
+ white-space: nowrap;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ padding: 8px 0;
+}
+.spectrum-MillerColumns-item {
+ display: inline-block;
+ width: 272px;
+ vertical-align: top;
+ outline: none;
+ margin: 0;
+ padding: 0;
+ margin-right: 8px;
+ overflow: auto;
+ height: 100%;
+}
+.spectrum-MillerColumns-item:first-child {
+ margin-left: 8px;
+ }
+/* topdoc
+{{ splitview/splitview-horizontal.yml }}
+*/
+/* topdoc
+{{ splitview/splitview-horizontal-resizable.yml }}
+*/
+/* topdoc
+{{ splitview/splitview-vertical-resizable.yml }}
+*/
+/* topdoc
+{{ splitview/splitview-horizontal-collapsed-left.yml }}
+*/
+/* topdoc
+{{ splitview/splitview-horizontal-collapsed-right.yml }}
+*/
+/* topdoc
+{{ splitview/splitview-vertical-collapsed-top.yml }}
+*/
+/* topdoc
+{{ splitview/splitview-vertical-collapsed-bottom.yml }}
+*/
+.spectrum-SplitView {
+ display: -ms-flexbox;
+ display: flex;
+ overflow: hidden;
+}
+.spectrum-SplitView-pane {
+ height: 100%;
+}
+.spectrum-SplitView-gripper {
+ content: '';
+ display: block;
+ position: absolute;
+ border-style: solid;
+ border-radius: 2px;
+
+ top: 50%;
+ transform: translate(0, -50%);
+
+ /* half of (width + horizontal border - handle width) * -1 (for negative opposite) */
+ left: -4px;
+ width: 4px;
+ height: 16px;
+ border-width: 4px 3px;
+}
+.spectrum-SplitView-splitter {
+ /* Contain the gripper */
+ position: relative;
+
+ /* Prevent text selection while dragging */
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+
+ width: 2px;
+ height: 100%;
+ z-index: 1;
+}
+/* make the center line of the gripper */
+.spectrum-SplitView-splitter.is-collapsed-start .spectrum-SplitView-gripper:before, .spectrum-SplitView-splitter.is-collapsed-end .spectrum-SplitView-gripper:before {
+ content: '';
+ position: absolute;
+
+ top: 0;
+ left: calc(50% - 1px);
+ width: 2px;
+ height: 100%;
+ }
+.spectrum-SplitView-splitter.is-collapsed-start .spectrum-SplitView-gripper {
+ left: 0;
+ }
+.spectrum-SplitView-splitter.is-collapsed-end .spectrum-SplitView-gripper {
+ right: 0;
+ left: auto;
+ }
+.spectrum-SplitView--vertical {
+ -ms-flex-direction: column;
+ flex-direction: column;
+}
+.spectrum-SplitView--vertical .spectrum-SplitView-pane {
+ height: auto;
+ width: 100%;
+ }
+.spectrum-SplitView--vertical .spectrum-SplitView-gripper {
+ /* half of (height + vertical border - handle width) * -1 (for negative opposite) */
+ top: -4px;
+
+ transform: translate(-50%, 0);
+ left: 50%;
+ width: 16px; /* same as default height */
+ height: 4px; /* same as default width */
+
+ /* opposite of default border-width */
+ border-width: 3px 4px;
+ }
+.spectrum-SplitView--vertical .spectrum-SplitView-splitter {
+ width: 100%;
+ height: 2px;
+ }
+.spectrum-SplitView--vertical .spectrum-SplitView-splitter.is-collapsed-start .spectrum-SplitView-gripper, .spectrum-SplitView--vertical .spectrum-SplitView-splitter.is-collapsed-end .spectrum-SplitView-gripper {
+ left: 50%;
+ }
+/* make the center line of the gripper */
+.spectrum-SplitView--vertical .spectrum-SplitView-splitter.is-collapsed-start .spectrum-SplitView-gripper:before, .spectrum-SplitView--vertical .spectrum-SplitView-splitter.is-collapsed-end .spectrum-SplitView-gripper:before {
+ top: calc(50% - 1px);
+ left: 0;
+ width: 100%;
+ height: 2px;
+ }
+.spectrum-SplitView--vertical .spectrum-SplitView-splitter.is-collapsed-start .spectrum-SplitView-gripper {
+ top: 0;
+ }
+.spectrum-SplitView--vertical .spectrum-SplitView-splitter.is-collapsed-end .spectrum-SplitView-gripper {
+ top: auto;
+ bottom: 0;
+ }
+/* topdoc
+{{ cyclebutton/cyclebutton-default.yml }}
+*/
+.spectrum-CycleButton {
+ /* Be square */
+ padding: 0 7px;
+}
+.spectrum-CycleButton .spectrum-CycleButton-item:not(.is-selected) {
+ display: none
+ }
+/* topdoc
+{{ pagination/pagination-listing.yml }}
+*/
+.spectrum-Pagination--explicit,
+.spectrum-Pagination--listing {
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-direction: row;
+ flex-direction: row;
+ -ms-flex-align: center;
+ align-items: center;
+}
+/* topdoc
+{{ pagination/pagination-explicit.yml }}
+*/
+.spectrum-Pagination-input {
+ width: 48px;
+ min-width: 48px;
+}
+.spectrum-Pagination-counter {
+ margin-left: 5px;
+}
+.spectrum-Pagination-prevButton {
+ margin-right: 5px;
+}
+.spectrum-Pagination-nextButton {
+ margin-left: 5px;
+}
+/* topdoc
+{{ pagination/pagination-button-style-cta.yml }}
+*/
+/* topdoc
+{{ pagination/pagination-button-style-primary.yml }}
+*/
+/* topdoc
+{{ pagination/pagination-button-style-secondary.yml }}
+*/
+.spectrum-Banner {
+ display: inline-block;
+ border-radius: 8px;
+ padding: 4px 8px;
+ font-size: 12px;
+ line-height: 1.3;
+}
+.spectrum-Banner-header {
+ font-weight: bold;
+}
+/* topdoc
+{{ banner/banner-info.yml }}
+*/
+/* topdoc
+{{ banner/banner-warning.yml }}
+*/
+/* topdoc
+{{ banner/banner-error.yml }}
+*/
+/* topdoc
+{{ banner/banner-corner.yml }}
+*/
+.spectrum-Banner--corner {
+ position: absolute;
+ top: -10px;
+ right: -10px;
+}
+/* topdoc
+{{ rule/rule.yml }}
+*/
+.spectrum-Rule {
+ /* Show the overflow for hr in Edge and IE. */
+ overflow: visible;
+
+ border: none;
+ border-width: 2px;
+ border-radius: 2px;
+}
+.spectrum-Rule--large {
+ height: 4px;
+
+ border-radius: 2px;
+}
+.spectrum-Rule--medium {
+ height: 2px;
+
+ border-radius: 1px;
+}
+.spectrum-Rule--small {
+ height: 1px;
+
+ border-radius: 1px;
+}
+/* topdoc
+{{ statuslight/statuslight-semantic.yml }}
+*/
+.spectrum-StatusLight {
+ height: 32px;
+
+ line-height: 32px;
+ font-size: 14px;
+ font-weight: 400;
+}
+.spectrum-StatusLight::before {
+ content: '';
+ display: inline-block;
+ width: 8px;
+ height: 8px;
+ border-radius: 50%;
+ margin: 0 12px;
+ }
+.spectrum-StatusLight--neutral {
+ font-style: italic;
+}
+/* topdoc
+{{ statuslight/statuslight-label.yml }}
+*/
+/* topdoc
+{{ treeview/treeview.yml }}
+*/
+.spectrum-TreeView {
+ display: block;
+ list-style: none;
+ position: relative;
+ padding: 0;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ outline: none;
+}
+.spectrum-TreeView-item {
+ /* Don't let child treeviews that are open spill out */
+ overflow: hidden;
+}
+.spectrum-TreeView-item.is-open > .spectrum-TreeView-itemLink > .spectrum-TreeView-indicator {
+ /* Rotate the chevron */
+ transform: rotate(90deg);
+ }
+.spectrum-TreeView-item.is-open > .spectrum-TreeView {
+ /* Open the treeview */
+ height: auto;
+ visibility: visible;
+ }
+.spectrum-TreeView-itemLink {
+ display: block;
+ box-sizing: border-box;
+ cursor: pointer;
+
+ padding: 12px 30px;
+
+ text-decoration: none;
+
+ /* Prevent weirdness that can cause the vertical bar to fall down */
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+}
+.spectrum-TreeView-itemLink:focus {
+ /* we cannot achieve rounded corners with outline so we use box-shadow (on skin.css) instead */
+ outline: none;
+ }
+.spectrum-TreeView-itemLink .spectrum-Icon {
+ vertical-align: top;
+ margin-right: 8px;
+ }
+.spectrum-TreeView-itemLink::before {
+ content: '';
+
+ position: absolute;
+ left: 2px;
+ right: 0;
+ z-index: -1; /* make sure we don't block clicks on chevron */
+
+ /* Position correctly since top is not defined */
+ margin-top: -8px;
+
+ height: 36px;
+
+ background-color: transparent;
+
+ border-radius: 4px;
+ }
+.spectrum-TreeView-indicator {
+ display: block;
+
+ float: left;
+ position: relative;
+
+ left: 10px;
+ top: -5px;
+ margin-left: -34px;
+ margin-bottom: -10px;
+
+ padding: 10px;
+
+ transition: transform ease 130ms;
+
+ pointer-events: all !important;
+}
+/* Close nested treeviews by default */
+.spectrum-TreeView .spectrum-TreeView {
+ /* Don't be a highlight container stealer */
+ position: static;
+
+ padding-left: 28px;
+
+ /* Be hidden */
+ height: 0;
+ visibility: hidden;
+}
+/* topdoc
+{{ treeview/treeview-flat.yml }}
+*/
+.spectrum-TreeView-item--indent1 {
+ padding-left: 28px;
+}
+.spectrum-TreeView-item--indent2 {
+ padding-left: 56px;
+}
+.spectrum-TreeView-item--indent3 {
+ padding-left: 84px;
+}
+.spectrum-TreeView-item--indent4 {
+ padding-left: 112px;
+}
+.spectrum-TreeView-item--indent5 {
+ padding-left: 140px;
+}
+.spectrum-TreeView-item--indent6 {
+ padding-left: 168px;
+}
+.spectrum-TreeView-item--indent7 {
+ padding-left: 196px;
+}
+.spectrum-TreeView-item--indent8 {
+ padding-left: 224px;
+}
+.spectrum-TreeView-item--indent9 {
+ padding-left: 252px;
+}
+.spectrum-TreeView-item--indent10 {
+ padding-left: 280px;
+}
+/* topdoc
+{{ treeview/treeview-icons.yml }}
+*/
+/* topdoc
+{{ treeview/treeview-disabled.yml }}
+*/
+.spectrum-SideNav {
+ list-style-type: none;
+ margin: 0;
+ padding: 0;
+ width: 240px;
+}
+.spectrum-SideNav-item {
+ list-style-type: none;
+
+ margin: 4px 0;
+}
+.spectrum-SideNav-itemLink {
+ position: relative;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-align: center;
+ align-items: center;
+ -ms-flex-pack: left;
+ justify-content: left;
+ box-sizing: border-box;
+
+ width: 100%;
+ min-height: 32px;
+
+ padding: 5px 12px;
+
+ border-radius: 4px;
+
+ font-size: 14px;
+ font-weight: 400;
+ font-style: normal;
+ text-decoration: none;
+
+ cursor: pointer;
+
+ transition: background-color 130ms ease-out,
+ color 130ms ease-out;
+}
+.spectrum-SideNav-itemLink:focus {
+ outline: none;
+ }
+.spectrum-SideNav-itemLink.focus-ring::before {
+ content: '';
+ position: absolute;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+
+ border: 2px solid transparent;
+ border-radius: 4px;
+ }
+/* topdoc
+{{ sidenav/sidenav-heading.yml }}
+*/
+.spectrum-SideNav-heading {
+ height: 32px;
+ line-height: 32px;
+
+ margin: 16px 0 4px 0;
+ padding: 0 12px;
+
+ border-radius: 4px;
+
+ font-size: 11px;
+ font-weight: 500;
+ font-style: normal;
+ letter-spacing: 0.06em;
+
+ text-transform: uppercase;
+}
+.spectrum-SideNav--multiLevel .spectrum-SideNav-itemLink {
+ font-weight: 700;
+ }
+.spectrum-SideNav--multiLevel .spectrum-SideNav {
+ margin: 0;
+ padding: 0;
+ }
+.spectrum-SideNav--multiLevel .spectrum-SideNav .spectrum-SideNav-itemLink {
+ font-weight: 400;
+
+ padding-left: 24px;
+ }
+.spectrum-SideNav--multiLevel .spectrum-SideNav .spectrum-SideNav .spectrum-SideNav-itemLink {
+ padding-left: 36px;
+ }
+/* topdoc
+{{ illustratedmessage/illustratedmessage.yml }}
+*/
+/* topdoc
+{{ illustratedmessage/illustratedmessage-cta.yml }}
+*/
+.spectrum-IllustratedMessage {
+ height: 100%;
+
+ display: -ms-flexbox;
+
+ display: flex;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ -ms-flex-align: center;
+ align-items: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+
+ text-align: center;
+}
+.spectrum-IllustratedMessage-illustration {
+ margin-bottom: 24px;
+}
+.spectrum-IllustratedMessage-heading {
+ max-width: 500px;
+ margin: 0;
+}
+.spectrum-IllustratedMessage-description {
+ max-width: 500px;
+ margin: 4px 0 0 0;
+
+ font-style: italic;
+}
+.spectrum-IllustratedMessage--cta .spectrum-IllustratedMessage-description {
+ font-style: normal;
+ }
+/* topdoc
+{{ dropindicator/dropindicator.yml }}
+*/
+.spectrum-DropIndicator {
+ position: relative;
+}
+.spectrum-DropIndicator:before,
+ .spectrum-DropIndicator:after {
+ content: '';
+ position: absolute;
+ width: 12px;
+ height: 12px;
+ border-radius: 50%;
+ border: 2px solid;
+ box-sizing: border-box;
+ }
+.spectrum-DropIndicator--horizontal {
+ height: 2px;
+ margin: 0 12px;
+}
+.spectrum-DropIndicator--horizontal:before,
+ .spectrum-DropIndicator--horizontal:after {
+ top: -5px;
+ }
+.spectrum-DropIndicator--horizontal:before {
+ left: -12px;
+ }
+.spectrum-DropIndicator--horizontal:after {
+ right: -12px;
+ }
+.spectrum-DropIndicator--vertical {
+ width: 2px;
+ margin: 12px 0;
+}
+.spectrum-DropIndicator--vertical:before,
+ .spectrum-DropIndicator--vertical:after {
+ left: -5px;
+ }
+.spectrum-DropIndicator--vertical:before {
+ top: -12px;
+ }
+.spectrum-DropIndicator--vertical:after {
+ bottom: -12px;
+ }
+/* topdoc
+{{ card/card.yml }}
+*/
+/*! topdoc
+{{ card/card-asset.yml }}
+*/
+/*! topdoc
+{{ card/card-small.yml }}
+*/
+.spectrum-Card {
+ position: relative;
+
+ display: -ms-inline-flexbox;
+
+ display: inline-flex;
+ -ms-flex-direction: column;
+ flex-direction: column;
+
+ box-sizing: border-box;
+ min-width: 240px;
+
+ border: 1px solid transparent;
+ border-radius: 4px;
+}
+.spectrum-Card:focus {
+ outline: none;
+ }
+.spectrum-Card.is-selected .spectrum-Card-quickActions,
+ .spectrum-Card.is-selected .spectrum-Card-actions,
+ .spectrum-Card:focus .spectrum-Card-quickActions,
+ .spectrum-Card:focus .spectrum-Card-actions,
+ .spectrum-Card:hover .spectrum-Card-quickActions,
+ .spectrum-Card:hover .spectrum-Card-actions {
+ /* Ideally, this would simply apply is-open to the QuickActions component */
+ visibility: visible;
+ opacity: 1;
+ pointer-events: all;
+ }
+.spectrum-Card-actions {
+ position: absolute;
+ right: 10px;
+ top: 10px;
+ height: 40px;
+ visibility: hidden;
+}
+.spectrum-Card-quickActions {
+ position: absolute;
+ left: 16px;
+ top: 16px;
+
+ width: 40px;
+ height: 40px;
+
+ visibility: hidden;
+}
+.spectrum-Card-quickActions .spectrum-Checkbox {
+ margin: 0;
+ }
+.spectrum-Card-coverPhoto {
+ height: 136px;
+ box-sizing: border-box;
+
+ display: -ms-flexbox;
+
+ display: flex;
+ -ms-flex-align: center;
+ align-items: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+
+ border-bottom: 1px solid transparent;
+ border-radius: 3px 3px 0 0;
+
+ background-size: cover;
+ background-position: center center;
+}
+.spectrum-Card-body {
+ padding-top: 20px;
+ padding-right: 24px;
+ padding-bottom: 20px;
+ padding-left: 24px;
+}
+.spectrum-Card-body:last-child {
+ border-radius: 0 0 4px 4px;
+ }
+.spectrum-Card-preview {
+ overflow: hidden;
+ border-radius: 3px 3px 0 0;
+}
+.spectrum-Card-header {
+ height: 18px;
+}
+.spectrum-Card-content {
+ display: -ms-flexbox;
+ display: flex;
+ height: 14px;
+ margin-top: 6px;
+}
+.spectrum-Card-title {
+ font-size: 14px;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ padding-right: 8px;
+}
+.spectrum-Card-subtitle {
+ font-size: 11px;
+ letter-spacing: 0.06em;
+ text-transform: uppercase;
+ padding-right: 8px;
+}
+.spectrum-Card-description {
+ font-size: 11px;
+}
+.spectrum-Card-subtitle + .spectrum-Card-description:before {
+ content: "•";
+ padding-right: 8px;
+}
+.spectrum-Card-footer {
+ padding-top: 14px;
+ margin-right: 24px;
+ padding-bottom: 20px;
+ margin-left: 24px;
+
+ border-top: 1px solid;
+}
+.spectrum-Card-header {
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-align: baseline;
+ align-items: baseline;
+}
+.spectrum-Card-actionButton {
+ -ms-flex: 1;
+ flex: 1;
+ -ms-flex-item-align: center;
+ align-self: center;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+}
+/* topdoc
+{{ card/card-quiet-large.yml }}
+*/
+/* topdoc
+{{ card/card-quiet-small.yml }}
+*/
+/* topdoc
+{{ card/card-quiet-folder.yml }}
+*/
+/* topdoc
+{{ card/card-quiet-file.yml }}
+*/
+/* topdoc
+{{ card/card-gallery.yml }}
+*/
+.spectrum-Card--quiet,
+.spectrum-Card--gallery {
+ width: 100%;
+ height: 100%;
+ min-width: 136px;
+ border-width: 0;
+ border-radius: 0;
+ overflow: visible;
+}
+.spectrum-Card--quiet .spectrum-Card-preview, .spectrum-Card--gallery .spectrum-Card-preview {
+ width: 100%;
+ -ms-flex: 1;
+ flex: 1;
+ min-height: 136px;
+ padding: 20px;
+ margin: 0 auto;
+ box-sizing: border-box;
+ border-radius: 4px;
+ position: relative;
+ transition: background-color 130ms;
+ }
+/* Use a :before to show the selection outline so that the border doesn't
+ * affect the layout of the content within the preview. */
+.spectrum-Card--quiet .spectrum-Card-preview:before, .spectrum-Card--gallery .spectrum-Card-preview:before {
+ content: '';
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ box-sizing: border-box;
+ border-radius: inherit;
+ border: 1px solid transparent;
+ }
+.spectrum-Card--quiet.is-drop-target .spectrum-Card-preview, .spectrum-Card--gallery.is-drop-target .spectrum-Card-preview {
+ transition: none;
+ }
+.spectrum-Card--quiet .spectrum-Card-header, .spectrum-Card--gallery .spectrum-Card-header {
+ height: 18px;
+ margin-top: 14px;
+ }
+.spectrum-Card--quiet .spectrum-Card-body, .spectrum-Card--gallery .spectrum-Card-body {
+ padding: 0;
+ }
+.spectrum-Card--small {
+ min-width: 72px;
+}
+.spectrum-Card--small .spectrum-Card-quickActions {
+ left: 10px;
+ top: 10px;
+ }
+.spectrum-Card--small .spectrum-Card-preview {
+ padding: 12px;
+ min-height: 72px;
+ }
+.spectrum-Card--small .spectrum-Card-header {
+ margin-top: 8px;
+ height: 12px;
+ }
+.spectrum-Card--small .spectrum-Card-title {
+ font-size: 12px;
+ }
+.spectrum-Card--small .spectrum-Card-content,
+ .spectrum-Card--small .spectrum-Card-subtitle,
+ .spectrum-Card--small .spectrum-Card-description {
+ display: none;
+ }
+.spectrum-Card--gallery {
+ min-width: 0;
+}
+.spectrum-Card--gallery .spectrum-Card-preview {
+ padding: 0;
+ border-radius: 0;
+ }
+.spectrum-Asset {
+ width: 100%;
+ height: 100%;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-align: center;
+ align-items: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+}
+.spectrum-Asset-image {
+ max-width: 100%;
+ max-height: 100%;
+ object-fit: contain;
+ transition: opacity 130ms;
+}
+.spectrum-Asset-folder,
+.spectrum-Asset-file {
+ width: 100%;
+ height: 100%;
+ min-width: 48px;
+ max-width: 80px;
+ margin: 20px;
+}
+
+/* Temporary skin variables that need to be moved into origins */
+.spectrum--dark :root {
+ /* Icon Button*/
+
+ /* Button */
+
+ /* Shell */
+
+ /* haha remove this */
+
+ /* Custom selection color for placeholders using global blue-500 at 30% opacity. Should be updated in Spectrum-DNA */
+}
+/* topdoc
+{{ page/page.yml }}
+*/
+.spectrum--dark {
+ background-color: rgb(50, 50, 50);
+
+ /* Prevent tap highlights */
+ -webkit-tap-highlight-color: rgba(0,0,0,0);
+}
+/* generated from dna-version: 5.8.0 */
+.spectrum--dark .spectrum-Body1 {
+ color: rgb(227, 227, 227);
+ }
+/* generated from dna-version: 5.8.0 */
+.spectrum--dark .spectrum-Body2 {
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Body3 {
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Body4 {
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Body5 {
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Heading1 {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Heading2 {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Heading3 {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Heading4 {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Heading5 {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Heading6 {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Subheading {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Detail {
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Heading1--quiet {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Heading2--quiet {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Heading1--strong {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Heading2--strong {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Heading1--display {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Heading2--display {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Heading1--display.spectrum-Heading1--strong {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Heading2--display.spectrum-Heading2--strong {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Heading1--display.spectrum-Heading1--quiet {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Heading2--display.spectrum-Heading2--quiet {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Article .spectrum-Body1 {
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Article .spectrum-Body2 {
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Article .spectrum-Body3 {
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Article .spectrum-Body4 {
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Article .spectrum-Body5 {
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Article .spectrum-Heading1 {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Article .spectrum-Heading2 {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Article .spectrum-Heading3 {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Article .spectrum-Heading4 {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Article .spectrum-Heading5 {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Article .spectrum-Heading6 {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Article .spectrum-Subheading {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Article .spectrum-Detail {
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Article .spectrum-Heading1--quiet {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Article .spectrum-Heading2--quiet {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Article .spectrum-Heading1--display {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Article .spectrum-Heading2--display {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Article .spectrum-Heading1--display.spectrum-Heading1--quiet {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Article .spectrum-Heading2--display.spectrum-Heading2--quiet {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum:lang(ja) .spectrum-Body1, .spectrum--dark .spectrum:lang(ko) .spectrum-Body1, .spectrum--dark .spectrum:lang(zh) .spectrum-Body1 {
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum:lang(ja) .spectrum-Body2, .spectrum--dark .spectrum:lang(ko) .spectrum-Body2, .spectrum--dark .spectrum:lang(zh) .spectrum-Body2 {
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum:lang(ja) .spectrum-Body3, .spectrum--dark .spectrum:lang(ko) .spectrum-Body3, .spectrum--dark .spectrum:lang(zh) .spectrum-Body3 {
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum:lang(ja) .spectrum-Body4, .spectrum--dark .spectrum:lang(ko) .spectrum-Body4, .spectrum--dark .spectrum:lang(zh) .spectrum-Body4 {
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum:lang(ja) .spectrum-Body5, .spectrum--dark .spectrum:lang(ko) .spectrum-Body5, .spectrum--dark .spectrum:lang(zh) .spectrum-Body5 {
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum:lang(ja) .spectrum-Heading1, .spectrum--dark .spectrum:lang(ko) .spectrum-Heading1, .spectrum--dark .spectrum:lang(zh) .spectrum-Heading1 {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum:lang(ja) .spectrum-Heading2, .spectrum--dark .spectrum:lang(ko) .spectrum-Heading2, .spectrum--dark .spectrum:lang(zh) .spectrum-Heading2 {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum:lang(ja) .spectrum-Heading3, .spectrum--dark .spectrum:lang(ko) .spectrum-Heading3, .spectrum--dark .spectrum:lang(zh) .spectrum-Heading3 {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum:lang(ja) .spectrum-Heading4, .spectrum--dark .spectrum:lang(ko) .spectrum-Heading4, .spectrum--dark .spectrum:lang(zh) .spectrum-Heading4 {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum:lang(ja) .spectrum-Heading5, .spectrum--dark .spectrum:lang(ko) .spectrum-Heading5, .spectrum--dark .spectrum:lang(zh) .spectrum-Heading5 {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum:lang(ja) .spectrum-Heading6, .spectrum--dark .spectrum:lang(ko) .spectrum-Heading6, .spectrum--dark .spectrum:lang(zh) .spectrum-Heading6 {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum:lang(ja) .spectrum-Subheading, .spectrum--dark .spectrum:lang(ko) .spectrum-Subheading, .spectrum--dark .spectrum:lang(zh) .spectrum-Subheading {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum:lang(ja) .spectrum-Detail, .spectrum--dark .spectrum:lang(ko) .spectrum-Detail, .spectrum--dark .spectrum:lang(zh) .spectrum-Detail {
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum:lang(ja) .spectrum-Heading1--quiet, .spectrum--dark .spectrum:lang(ko) .spectrum-Heading1--quiet, .spectrum--dark .spectrum:lang(zh) .spectrum-Heading1--quiet {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum:lang(ja) .spectrum-Heading2--quiet, .spectrum--dark .spectrum:lang(ko) .spectrum-Heading2--quiet, .spectrum--dark .spectrum:lang(zh) .spectrum-Heading2--quiet {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum:lang(ja) .spectrum-Heading1--strong, .spectrum--dark .spectrum:lang(ko) .spectrum-Heading1--strong, .spectrum--dark .spectrum:lang(zh) .spectrum-Heading1--strong {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum:lang(ja) .spectrum-Heading2--strong, .spectrum--dark .spectrum:lang(ko) .spectrum-Heading2--strong, .spectrum--dark .spectrum:lang(zh) .spectrum-Heading2--strong {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum:lang(ja) .spectrum-Heading1--display, .spectrum--dark .spectrum:lang(ko) .spectrum-Heading1--display, .spectrum--dark .spectrum:lang(zh) .spectrum-Heading1--display {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum:lang(ja) .spectrum-Heading2--display, .spectrum--dark .spectrum:lang(ko) .spectrum-Heading2--display, .spectrum--dark .spectrum:lang(zh) .spectrum-Heading2--display {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum:lang(ja) .spectrum-Heading1--display.spectrum-Heading1--strong, .spectrum--dark .spectrum:lang(ko) .spectrum-Heading1--display.spectrum-Heading1--strong, .spectrum--dark .spectrum:lang(zh) .spectrum-Heading1--display.spectrum-Heading1--strong {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum:lang(ja) .spectrum-Heading2--display.spectrum-Heading2--strong, .spectrum--dark .spectrum:lang(ko) .spectrum-Heading2--display.spectrum-Heading2--strong, .spectrum--dark .spectrum:lang(zh) .spectrum-Heading2--display.spectrum-Heading2--strong {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum:lang(ja) .spectrum-Heading1--display.spectrum-Heading1--quiet, .spectrum--dark .spectrum:lang(ko) .spectrum-Heading1--display.spectrum-Heading1--quiet, .spectrum--dark .spectrum:lang(zh) .spectrum-Heading1--display.spectrum-Heading1--quiet {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum:lang(ja) .spectrum-Heading2--display.spectrum-Heading2--quiet, .spectrum--dark .spectrum:lang(ko) .spectrum-Heading2--display.spectrum-Heading2--quiet, .spectrum--dark .spectrum:lang(zh) .spectrum-Heading2--display.spectrum-Heading2--quiet {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Code1 {
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Code2 {
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Code3 {
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Code4 {
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Code5 {
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark,
+.spectrum--dark .spectrum-Body {
+ color: rgb(227, 227, 227);
+}
+.spectrum--dark .spectrum-Body--large {
+ color: rgb(227, 227, 227);
+}
+.spectrum--dark .spectrum-Body--small {
+ color: rgb(227, 227, 227);
+}
+.spectrum--dark .spectrum-Body--secondary {
+ color: rgb(185, 185, 185);
+}
+.spectrum--dark .spectrum-Heading--display {
+ color: rgb(255, 255, 255);
+}
+.spectrum--dark .spectrum-Heading--pageTitle {
+ color: rgb(185, 185, 185);
+}
+.spectrum--dark .spectrum-Heading--subtitle1 {
+ color: rgb(255, 255, 255);
+}
+.spectrum--dark .spectrum-Heading--subtitle2 {
+ color: rgb(255, 255, 255);
+}
+.spectrum--dark .spectrum-Heading--subtitle3 {
+ color: rgb(185, 185, 185);
+}
+.spectrum--dark .spectrum-Link {
+ color: rgb(75, 156, 245);
+}
+.spectrum--dark .spectrum-Link:hover {
+ color: rgb(75, 156, 245);
+ }
+.spectrum--dark .spectrum-Link:active {
+ color: rgb(90, 169, 250);
+ }
+.spectrum--dark .spectrum-Link.focus-ring {
+ color: rgb(75, 156, 245);
+ }
+.spectrum--dark .spectrum-Link.is-disabled {
+ color: rgb(110, 110, 110);
+ }
+.spectrum--dark .spectrum-Link--quiet,
+.spectrum--dark .spectrum-Link--subtle {
+ color: inherit;
+}
+.spectrum--dark .spectrum-Link--quiet:hover, .spectrum--dark .spectrum-Link--subtle:hover {
+ color: inherit;
+ }
+.spectrum--dark .spectrum-Link--quiet:active, .spectrum--dark .spectrum-Link--subtle:active {
+ color: inherit;
+ }
+.spectrum--dark .spectrum-Link--quiet:focus, .spectrum--dark .spectrum-Link--subtle:focus {
+ color: inherit;
+ }
+.spectrum--dark .spectrum-Link--overBackground {
+ color: rgb(255, 255, 255);
+}
+.spectrum--dark .spectrum-Link--overBackground:hover {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Link--overBackground:active {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Link--overBackground:focus {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Link--overBackground.is-disabled {
+ color: rgba(255,255,255,0.5);
+ }
+.spectrum--dark .spectrum-Button.focus-ring {
+ box-shadow: 0 0 0 1px rgb(20, 115, 230);
+ }
+.spectrum--dark .spectrum-Button:active {
+ /* Override focus -- clicking with spacebar should not show outline */
+ box-shadow: none;
+ }
+.spectrum--dark .spectrum-ClearButton {
+ background-color: rgba(0, 0, 0, 0);
+
+ color: rgb(144, 144, 144);
+}
+.spectrum--dark .spectrum-ClearButton:hover {
+ background-color: rgba(0, 0, 0, 0);
+
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-ClearButton:active {
+ background-color: rgba(0, 0, 0, 0);
+
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-ClearButton.focus-ring {
+ background-color: rgba(0, 0, 0, 0);
+
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-ClearButton:disabled,
+ .spectrum--dark .spectrum-ClearButton.is-disabled {
+ background-color: rgba(0, 0, 0, 0);
+
+ color: rgb(110, 110, 110);
+ }
+/* topdoc
+{{ button/button-cta.yml }}
+*/
+.spectrum--dark .spectrum-Button--cta {
+ background-color: rgb(20, 115, 230);
+ border-color: rgb(20, 115, 230);
+ color: rgb(255, 255, 255);
+}
+.spectrum--dark .spectrum-Button--cta:hover {
+ background-color: rgb(13, 102, 208);
+ border-color: rgb(13, 102, 208);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Button--cta.focus-ring {
+ background-color: rgb(20, 115, 230);
+ border-color: rgb(20, 115, 230);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Button--cta:active {
+ background-color: rgb(13, 102, 208);
+ border-color: rgb(13, 102, 208);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Button--cta:disabled,
+ .spectrum--dark .spectrum-Button--cta.is-disabled {
+ background-color: rgb(62, 62, 62);
+ border-color: rgb(62, 62, 62);
+ color: rgb(110, 110, 110);
+ }
+/* topdoc
+{{ button/button-primary.yml }}
+*/
+.spectrum--dark .spectrum-Button--primary {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgb(227, 227, 227);
+ color: rgb(227, 227, 227);
+}
+.spectrum--dark .spectrum-Button--primary:hover {
+ background-color: rgb(227, 227, 227);
+ border-color: rgb(227, 227, 227);
+ color: rgb(37, 37, 37);
+ }
+.spectrum--dark .spectrum-Button--primary.focus-ring {
+ background-color: rgb(20, 115, 230);
+ border-color: rgb(20, 115, 230);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Button--primary:active {
+ background-color: rgb(255, 255, 255);
+ border-color: rgb(255, 255, 255);
+ color: rgb(37, 37, 37);
+ }
+.spectrum--dark .spectrum-Button--primary:disabled,
+ .spectrum--dark .spectrum-Button--primary.is-disabled {
+ background-color: rgb(62, 62, 62);
+ border-color: rgb(62, 62, 62);
+ color: rgb(110, 110, 110);
+ }
+/* topdoc
+{{ button/button-secondary.yml }}
+*/
+.spectrum--dark .spectrum-Button--secondary {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgb(185, 185, 185);
+ color: rgb(185, 185, 185);
+}
+.spectrum--dark .spectrum-Button--secondary:hover {
+ background-color: rgb(185, 185, 185);
+ border-color: rgb(185, 185, 185);
+ color: rgb(37, 37, 37);
+ }
+.spectrum--dark .spectrum-Button--secondary.focus-ring {
+ background-color: rgb(20, 115, 230);
+ border-color: rgb(20, 115, 230);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Button--secondary:active {
+ background-color: rgb(227, 227, 227);
+ border-color: rgb(227, 227, 227);
+ color: rgb(37, 37, 37);
+ }
+.spectrum--dark .spectrum-Button--secondary:disabled,
+ .spectrum--dark .spectrum-Button--secondary.is-disabled {
+ background-color: rgb(62, 62, 62);
+ border-color: rgb(62, 62, 62);
+ color: rgb(110, 110, 110);
+ }
+/* topdoc
+{{ button/button-warning.yml }}
+*/
+.spectrum--dark .spectrum-Button--warning {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgb(247, 109, 116);
+ color: rgb(247, 109, 116);
+}
+.spectrum--dark .spectrum-Button--warning:hover {
+ background-color: rgb(247, 109, 116);
+ border-color: rgb(247, 109, 116);
+ color: rgb(37, 37, 37);
+ }
+.spectrum--dark .spectrum-Button--warning.focus-ring {
+ background-color: rgb(20, 115, 230);
+ border-color: rgb(20, 115, 230);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Button--warning:active {
+ background-color: rgb(255, 123, 130);
+ border-color: rgb(255, 123, 130);
+ color: rgb(37, 37, 37);
+ }
+.spectrum--dark .spectrum-Button--warning:disabled,
+ .spectrum--dark .spectrum-Button--warning.is-disabled {
+ background-color: rgb(62, 62, 62);
+ border-color: rgb(62, 62, 62);
+ color: rgb(110, 110, 110);
+ }
+/* topdoc
+{{ button/button-over-background.yml }}
+*/
+.spectrum--dark .spectrum-Button--overBackground {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgb(255, 255, 255);
+ color: rgb(255, 255, 255);
+}
+.spectrum--dark .spectrum-Button--overBackground:hover {
+ background-color: rgb(255, 255, 255);
+ border-color: rgb(255, 255, 255);
+ color: inherit;
+ }
+.spectrum--dark .spectrum-Button--overBackground.focus-ring {
+ background-color: rgb(255, 255, 255);
+ border-color: rgb(255, 255, 255);
+ color: inherit;
+ box-shadow: 0 0 0 1px rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Button--overBackground:active {
+ background-color: rgb(255, 255, 255);
+ border-color: rgb(255, 255, 255);
+ color: inherit;
+ box-shadow: none;
+ }
+.spectrum--dark .spectrum-Button--overBackground:disabled,
+ .spectrum--dark .spectrum-Button--overBackground.is-disabled {
+ background-color: rgba(255,255,255,0.1);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgba(255,255,255,0.35);
+ }
+/* topdoc
+{{ button/button-quiet-over-background.yml }}
+*/
+.spectrum--dark .spectrum-Button--overBackground.spectrum-Button--quiet,
+.spectrum--dark .spectrum-ClearButton--overBackground {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgb(255, 255, 255);
+}
+.spectrum--dark .spectrum-Button--overBackground.spectrum-Button--quiet:hover, .spectrum--dark .spectrum-ClearButton--overBackground:hover {
+ background-color: rgba(255,255,255,0.1);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Button--overBackground.spectrum-Button--quiet.focus-ring, .spectrum--dark .spectrum-ClearButton--overBackground.focus-ring {
+ background-color: rgb(255, 255, 255);
+ border-color: rgb(255, 255, 255);
+ color: inherit;
+ box-shadow: 0 0 0 1px rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Button--overBackground.spectrum-Button--quiet:active, .spectrum--dark .spectrum-ClearButton--overBackground:active {
+ background-color: rgba(255,255,255,0.15);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgb(255, 255, 255);
+ box-shadow: none;
+ }
+.spectrum--dark .spectrum-Button--overBackground.spectrum-Button--quiet:disabled,
+ .spectrum--dark .spectrum-Button--overBackground.spectrum-Button--quiet.is-disabled,
+ .spectrum--dark .spectrum-ClearButton--overBackground:disabled,
+ .spectrum--dark .spectrum-ClearButton--overBackground.is-disabled {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgba(255,255,255,0.15);
+ }
+/* topdoc
+{{ button/button-quiet-primary.yml }}
+*/
+.spectrum--dark .spectrum-Button--primary.spectrum-Button--quiet {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgb(227, 227, 227);
+}
+.spectrum--dark .spectrum-Button--primary.spectrum-Button--quiet:hover {
+ background-color: rgb(62, 62, 62);
+ border-color: rgb(62, 62, 62);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Button--primary.spectrum-Button--quiet.focus-ring {
+ background-color: rgb(20, 115, 230);
+ border-color: rgb(20, 115, 230);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Button--primary.spectrum-Button--quiet:active {
+ background-color: rgb(74, 74, 74);
+ border-color: rgb(74, 74, 74);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Button--primary.spectrum-Button--quiet:disabled,
+ .spectrum--dark .spectrum-Button--primary.spectrum-Button--quiet.is-disabled {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgb(110, 110, 110);
+ }
+/* topdoc
+{{ button/button-quiet-secondary.yml }}
+*/
+.spectrum--dark .spectrum-Button--secondary.spectrum-Button--quiet {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgb(185, 185, 185);
+}
+.spectrum--dark .spectrum-Button--secondary.spectrum-Button--quiet:hover {
+ background-color: rgb(62, 62, 62);
+ border-color: rgb(62, 62, 62);
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Button--secondary.spectrum-Button--quiet.focus-ring {
+ background-color: rgb(20, 115, 230);
+ border-color: rgb(20, 115, 230);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Button--secondary.spectrum-Button--quiet:active {
+ background-color: rgb(74, 74, 74);
+ border-color: rgb(74, 74, 74);
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Button--secondary.spectrum-Button--quiet:disabled,
+ .spectrum--dark .spectrum-Button--secondary.spectrum-Button--quiet.is-disabled {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgb(110, 110, 110);
+ }
+/* topdoc
+{{ button/actionbutton.yml }}
+*/
+.spectrum--dark .spectrum-ActionButton,
+.spectrum--dark .spectrum-Tool {
+ background-color: rgb(47, 47, 47);
+ border-color: rgb(74, 74, 74);
+ color: rgb(227, 227, 227);
+}
+.spectrum--dark .spectrum-ActionButton .spectrum-Icon,
+.spectrum--dark .spectrum-Tool .spectrum-Icon {
+ color: rgb(185, 185, 185);
+ }
+.spectrum--dark .spectrum-ActionButton .spectrum-ActionButton-hold,
+.spectrum--dark .spectrum-Tool .spectrum-ActionButton-hold {
+ color: rgb(185, 185, 185);
+ }
+.spectrum--dark .spectrum-ActionButton:hover,
+.spectrum--dark .spectrum-Tool:hover {
+ background-color: rgb(37, 37, 37);
+ border-color: rgb(90, 90, 90);
+ box-shadow: none;
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-ActionButton:hover .spectrum-Icon,
+.spectrum--dark .spectrum-Tool:hover .spectrum-Icon {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-ActionButton:hover .spectrum-ActionButton-hold,
+.spectrum--dark .spectrum-Tool:hover .spectrum-ActionButton-hold {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-ActionButton.focus-ring,
+.spectrum--dark .spectrum-Tool.focus-ring {
+ background-color: rgb(37, 37, 37);
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-ActionButton.focus-ring .spectrum-Icon,
+.spectrum--dark .spectrum-Tool.focus-ring .spectrum-Icon {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-ActionButton.focus-ring .spectrum-ActionButton-hold,
+.spectrum--dark .spectrum-Tool.focus-ring .spectrum-ActionButton-hold {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-ActionButton:active,
+.spectrum--dark .spectrum-Tool:active {
+ background-color: rgb(62, 62, 62);
+ border-color: rgb(90, 90, 90);
+ box-shadow: none;
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-ActionButton:active .spectrum-ActionButton-hold,
+.spectrum--dark .spectrum-Tool:active .spectrum-ActionButton-hold {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-ActionButton:disabled,
+.spectrum--dark .spectrum-ActionButton.is-disabled,
+.spectrum--dark .spectrum-Tool:disabled {
+ background-color: rgb(62, 62, 62);
+ border-color: rgb(62, 62, 62);
+ color: rgb(110, 110, 110);
+ }
+.spectrum--dark .spectrum-ActionButton:disabled .spectrum-Icon,
+.spectrum--dark .spectrum-ActionButton.is-disabled .spectrum-Icon,
+.spectrum--dark .spectrum-Tool:disabled .spectrum-Icon {
+ color: rgb(90, 90, 90);
+ }
+.spectrum--dark .spectrum-ActionButton:disabled .spectrum-ActionButton-hold,
+.spectrum--dark .spectrum-ActionButton.is-disabled .spectrum-ActionButton-hold,
+.spectrum--dark .spectrum-Tool:disabled .spectrum-ActionButton-hold {
+ color: rgb(90, 90, 90);
+ }
+.spectrum--dark .spectrum-ActionButton.is-selected {
+ background-color: rgb(62, 62, 62);
+ border-color: rgb(74, 74, 74);
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-ActionButton.is-selected .spectrum-Icon {
+ color: rgb(185, 185, 185);
+ }
+.spectrum--dark .spectrum-ActionButton.is-selected.focus-ring {
+ background-color: rgb(62, 62, 62);
+ border-color: rgb(38, 128, 235);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-ActionButton.is-selected.focus-ring .spectrum-Icon {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-ActionButton.is-selected:hover {
+ background-color: rgb(62, 62, 62);
+ border-color: rgb(90, 90, 90);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-ActionButton.is-selected:hover .spectrum-Icon {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-ActionButton.is-selected:active {
+ background-color: rgb(62, 62, 62);
+ border-color: rgb(90, 90, 90);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-ActionButton.is-selected:active .spectrum-Icon {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-ActionButton.is-selected:disabled,
+ .spectrum--dark .spectrum-ActionButton.is-selected.is-disabled {
+ background-color: rgb(62, 62, 62);
+ border-color: rgb(62, 62, 62);
+ color: rgb(110, 110, 110);
+ }
+.spectrum--dark .spectrum-ActionButton.is-selected:disabled .spectrum-Icon, .spectrum--dark .spectrum-ActionButton.is-selected.is-disabled .spectrum-Icon {
+ color: rgb(90, 90, 90);
+ }
+/* topdoc
+{{ button/actionbutton-quiet.yml }}
+*/
+.spectrum--dark .spectrum-ActionButton--quiet,
+.spectrum--dark .spectrum-Tool {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgb(227, 227, 227);
+}
+.spectrum--dark .spectrum-ActionButton--quiet:hover,
+.spectrum--dark .spectrum-Tool:hover {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgb(255, 255, 255);
+ box-shadow: none;
+ }
+.spectrum--dark .spectrum-ActionButton--quiet.focus-ring,
+.spectrum--dark .spectrum-Tool.focus-ring {
+ background-color: rgba(0, 0, 0, 0);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ border-color: rgb(38, 128, 235);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-ActionButton--quiet:active,
+.spectrum--dark .spectrum-Tool:active {
+ background-color: rgb(74, 74, 74);
+ border-color: rgb(74, 74, 74);
+ color: rgb(255, 255, 255);
+ box-shadow: none;
+ }
+.spectrum--dark .spectrum-ActionButton--quiet:disabled,
+.spectrum--dark .spectrum-ActionButton--quiet.is-disabled,
+.spectrum--dark .spectrum-Tool:disabled {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgb(110, 110, 110);
+ }
+.spectrum--dark .spectrum-ActionButton--quiet.is-selected {
+ background-color: rgb(74, 74, 74);
+ border-color: rgb(74, 74, 74);
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-ActionButton--quiet.is-selected.focus-ring {
+ background-color: rgb(74, 74, 74);
+ border-color: rgb(38, 128, 235);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-ActionButton--quiet.is-selected:hover {
+ background-color: rgb(74, 74, 74);
+ border-color: rgb(74, 74, 74);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-ActionButton--quiet.is-selected:active {
+ background-color: rgb(74, 74, 74);
+ border-color: rgb(74, 74, 74);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-ActionButton--quiet.is-selected:disabled,
+ .spectrum--dark .spectrum-ActionButton--quiet.is-selected.is-disabled {
+ background-color: rgb(62, 62, 62);
+ border-color: rgb(62, 62, 62);
+ color: rgb(110, 110, 110);
+ }
+/* topdoc
+{{ button/button-quiet-warning.yml }}
+*/
+.spectrum--dark .spectrum-Button--warning.spectrum-Button--quiet {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgb(236, 91, 98);
+}
+.spectrum--dark .spectrum-Button--warning.spectrum-Button--quiet:hover {
+ background-color: rgb(62, 62, 62);
+ border-color: rgb(62, 62, 62);
+ color: rgb(247, 109, 116);
+ }
+.spectrum--dark .spectrum-Button--warning.spectrum-Button--quiet.focus-ring {
+ background-color: rgb(20, 115, 230);
+ border-color: rgb(20, 115, 230);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Button--warning.spectrum-Button--quiet:active {
+ background-color: rgb(74, 74, 74);
+ border-color: rgb(74, 74, 74);
+ color: rgb(247, 109, 116);
+ }
+.spectrum--dark .spectrum-Button--warning.spectrum-Button--quiet:disabled,
+ .spectrum--dark .spectrum-Button--warning.spectrum-Button--quiet.is-disabled {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgb(110, 110, 110);
+ }
+/* topdoc
+{{ button/logicbutton.yml }}
+*/
+.spectrum--dark .spectrum-LogicButton--and {
+ background-color: rgb(55, 142, 240);
+ border-color: rgb(55, 142, 240);
+ color: rgb(255, 255, 255);
+}
+.spectrum--dark .spectrum-LogicButton--and:hover {
+ background-color: rgb(90, 169, 250);
+ border-color: rgb(90, 169, 250);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-LogicButton--and.focus-ring {
+ background-color: rgb(90, 169, 250);
+ border-color: rgb(38, 128, 235);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-LogicButton--and:disabled,
+ .spectrum--dark .spectrum-LogicButton--and.is-disabled {
+ background-color: rgb(62, 62, 62);
+ border-color: rgb(62, 62, 62);
+ color: rgb(110, 110, 110);
+ }
+.spectrum--dark .spectrum-LogicButton--or {
+ background-color: rgb(226, 73, 157);
+ border-color: rgb(226, 73, 157);
+ color: rgb(255, 255, 255);
+}
+.spectrum--dark .spectrum-LogicButton--or:hover {
+ background-color: rgb(245, 107, 183);
+ border-color: rgb(245, 107, 183);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-LogicButton--or.focus-ring {
+ background-color: rgb(245, 107, 183);
+ border-color: rgb(38, 128, 235);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-LogicButton--or:disabled,
+ .spectrum--dark .spectrum-LogicButton--or.is-disabled {
+ background-color: rgb(62, 62, 62);
+ border-color: rgb(62, 62, 62);
+ color: rgb(110, 110, 110);
+ }
+/* topdoc
+{{ button/clearbutton-medium.yml }}
+*/
+.spectrum--dark .spectrum-FieldButton {
+ color: rgb(227, 227, 227);
+ background-color: rgb(47, 47, 47);
+ border-color: rgb(74, 74, 74);
+}
+.spectrum--dark .spectrum-FieldButton:hover {
+ color: rgb(255, 255, 255);
+ background-color: rgb(37, 37, 37);
+ border-color: rgb(90, 90, 90);
+ }
+.spectrum--dark .spectrum-FieldButton.focus-ring,
+ .spectrum--dark .spectrum-FieldButton.is-focused {
+ background-color: rgb(37, 37, 37);
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-FieldButton.focus-ring.is-placeholder, .spectrum--dark .spectrum-FieldButton.is-focused.is-placeholder {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-FieldButton:active,
+ .spectrum--dark .spectrum-FieldButton.is-selected {
+ background-color: rgb(62, 62, 62);
+ border-color: rgb(90, 90, 90);
+ }
+.spectrum--dark .spectrum-FieldButton:active.focus-ring,
+ .spectrum--dark .spectrum-FieldButton:active.is-focused,
+ .spectrum--dark .spectrum-FieldButton.is-selected.focus-ring,
+ .spectrum--dark .spectrum-FieldButton.is-selected.is-focused {
+ box-shadow: none;
+ }
+.spectrum--dark .spectrum-FieldButton.is-invalid {
+ border-color: rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-FieldButton.is-invalid:hover {
+ border-color: rgb(247, 109, 116);
+ }
+.spectrum--dark .spectrum-FieldButton.is-invalid:active,
+ .spectrum--dark .spectrum-FieldButton.is-invalid.is-selected {
+ border-color: rgb(247, 109, 116);
+ }
+.spectrum--dark .spectrum-FieldButton.is-invalid.focus-ring,
+ .spectrum--dark .spectrum-FieldButton.is-invalid.is-focused {
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-FieldButton:disabled,
+ .spectrum--dark .spectrum-FieldButton.is-disabled {
+ background-color: rgb(62, 62, 62);
+ color: rgb(110, 110, 110);
+ }
+.spectrum--dark .spectrum-FieldButton:disabled.focus-ring, .spectrum--dark .spectrum-FieldButton.is-disabled.focus-ring {
+ box-shadow: none;
+ }
+.spectrum--dark .spectrum-FieldButton:disabled .spectrum-Icon, .spectrum--dark .spectrum-FieldButton.is-disabled .spectrum-Icon {
+ color: rgb(90, 90, 90);
+ }
+.spectrum--dark .spectrum-FieldButton--quiet {
+ color: rgb(227, 227, 227);
+ border-color: rgba(0, 0, 0, 0);
+ background-color: rgba(0, 0, 0, 0);
+}
+.spectrum--dark .spectrum-FieldButton--quiet:hover {
+ background-color: rgba(0, 0, 0, 0);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-FieldButton--quiet.focus-ring,
+ .spectrum--dark .spectrum-FieldButton--quiet.is-focused {
+ background-color: rgba(0, 0, 0, 0);
+ box-shadow: 0 2px 0 0 rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-FieldButton--quiet.focus-ring.is-placeholder, .spectrum--dark .spectrum-FieldButton--quiet.is-focused.is-placeholder {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-FieldButton--quiet:active,
+ .spectrum--dark .spectrum-FieldButton--quiet.is-selected {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgba(0, 0, 0, 0);
+ }
+.spectrum--dark .spectrum-FieldButton--quiet:active.focus-ring,
+ .spectrum--dark .spectrum-FieldButton--quiet:active.is-focused,
+ .spectrum--dark .spectrum-FieldButton--quiet.is-selected.focus-ring,
+ .spectrum--dark .spectrum-FieldButton--quiet.is-selected.is-focused {
+ background-color: rgba(0, 0, 0, 0);
+ box-shadow: 0 2px 0 0 rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-FieldButton--quiet.is-invalid.focus-ring,
+ .spectrum--dark .spectrum-FieldButton--quiet.is-invalid.is-focused {
+ box-shadow: 0 2px 0 0 rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-FieldButton--quiet:disabled,
+ .spectrum--dark .spectrum-FieldButton--quiet.is-disabled {
+ background-color: rgba(0, 0, 0, 0);
+ color: rgb(110, 110, 110);
+ }
+.spectrum--dark .spectrum-FieldButton--quiet:disabled.focus-ring, .spectrum--dark .spectrum-FieldButton--quiet.is-disabled.focus-ring {
+ box-shadow: none;
+ }
+.spectrum--dark .spectrum-Tool.is-selected .spectrum-Icon {
+ color: rgb(55, 142, 240);
+ }
+.spectrum--dark .spectrum-Tool.is-selected .spectrum-Tool-hold {
+ color: rgb(55, 142, 240);
+ }
+.spectrum--dark .spectrum-Tool.is-selected:hover .spectrum-Icon {
+ color: rgb(75, 156, 245);
+ }
+.spectrum--dark .spectrum-Tool.is-selected:hover .spectrum-Tool-hold {
+ color: rgb(75, 156, 245);
+ }
+.spectrum--dark .spectrum-Tool.is-selected:active .spectrum-Icon {
+ color: rgb(90, 169, 250);
+ }
+.spectrum--dark .spectrum-Tool.is-selected:active .spectrum-Tool-hold {
+ color: rgb(90, 169, 250);
+ }
+.spectrum--dark .spectrum-Tool.is-selected.focus-ring .spectrum-Icon {
+ color: rgb(75, 156, 245);
+ }
+.spectrum--dark .spectrum-Tool.is-selected.focus-ring .spectrum-Tool-hold {
+ color: rgb(75, 156, 245);
+ }
+.spectrum--dark .spectrum-Tool.is-selected:disabled,
+ .spectrum--dark .spectrum-Tool.is-selected.is-disabled {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgba(0, 0, 0, 0);
+ }
+.spectrum--dark .spectrum-Tool.is-selected:disabled .spectrum-Icon, .spectrum--dark .spectrum-Tool.is-selected.is-disabled .spectrum-Icon {
+ color: rgb(90, 90, 90);
+ }
+.spectrum--dark .spectrum-Tool.is-selected:disabled .spectrum-Tool-hold, .spectrum--dark .spectrum-Tool.is-selected.is-disabled .spectrum-Tool-hold {
+ color: rgb(90, 90, 90);
+ }
+.spectrum--dark .spectrum-Tool .spectrum-Tool-hold {
+ color: rgb(185, 185, 185);
+ }
+.spectrum--dark .spectrum-Tool:hover .spectrum-Tool-hold {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Tool:active {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgba(0, 0, 0, 0);
+ }
+.spectrum--dark .spectrum-Tool:active .spectrum-Tool-hold {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Tool.focus-ring .spectrum-Tool-hold {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Tool.is-disabled .spectrum-Tool-hold, .spectrum--dark .spectrum-Tool:disabled .spectrum-Tool-hold {
+ color: rgb(90, 90, 90);
+ }
+.spectrum--dark .spectrum-Breadcrumbs-item {
+ color: rgb(185, 185, 185);
+}
+.spectrum--dark .spectrum-Breadcrumbs-item .spectrum-Breadcrumbs-itemSeparator {
+ color: rgb(110, 110, 110);
+ }
+.spectrum--dark .spectrum-Breadcrumbs-item .spectrum-Breadcrumbs-itemLink {
+ color: inherit;
+ text-decoration: none;
+ }
+.spectrum--dark .spectrum-Breadcrumbs-item .spectrum-Breadcrumbs-itemLink:hover {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Breadcrumbs-item .spectrum-Breadcrumbs-itemLink.focus-ring {
+ color: rgb(75, 156, 245);
+ outline: 0;
+ border-bottom: 2px solid rgb(75, 156, 245);
+ }
+.spectrum--dark .spectrum-Breadcrumbs-item .spectrum-Breadcrumbs-itemLink:active {
+ color: rgb(255, 255, 255);
+ border-bottom: 0;
+ }
+.spectrum--dark .spectrum-Breadcrumbs-item.is-selected,
+ .spectrum--dark .spectrum-Breadcrumbs-item:last-of-type {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Breadcrumbs-item.is-selected ~ .spectrum-Breadcrumb:last-of-type {
+ color: rgb(185, 185, 185);
+ }
+.spectrum--dark .spectrum-Breadcrumbs-item.is-selected .spectrum-Breadcrumbs-itemLink.focus-ring {
+ color: rgb(255, 255, 255);
+ border-bottom: 0;
+ }
+/* topdoc
+{{ breadcrumb/breadcrumb-title.yml }}
+*/
+.spectrum--dark .spectrum-Label {
+ color: rgb(255, 255, 255);
+}
+/* topdoc
+{{ label/label-special.yml }}
+*/
+.spectrum--dark .spectrum-Label--inactive,
+.spectrum--dark .spectrum-Label--grey {
+ background-color: rgb(116, 116, 116);
+}
+/* topdoc
+{{ breadcrumb/breadcrumb.yml }}
+*/
+.spectrum--dark .spectrum-Label--red {
+ background-color: rgb(215, 55, 63);
+}
+.spectrum--dark .spectrum-Label--orange, .spectrum--dark .spectrum-Label--or {
+ background-color: rgb(218, 123, 17);
+}
+.spectrum--dark .spectrum-Label--yellow {
+ background-color: rgb(223, 191, 0);
+}
+.spectrum--dark .spectrum-Label--seafoam {
+ background-color: rgb(27, 149, 154);
+}
+.spectrum--dark .spectrum-Label--green {
+ background-color: rgb(38, 142, 108);
+}
+.spectrum--dark .spectrum-Label--blue, .spectrum--dark .spectrum-Label--active, .spectrum--dark .spectrum-Label--and {
+ background-color: rgb(20, 115, 230);
+}
+.spectrum--dark .spectrum-Label--fuchsia {
+ background-color: rgb(192, 56, 204);
+}
+.spectrum--dark .spectrum-Alert {
+ background-color: rgb(37, 37, 37);
+ /* default color set to body color, header element overwrites this */
+ color: rgb(185, 185, 185);
+}
+.spectrum--dark .spectrum-Alert-header {
+ color: rgb(255, 255, 255);
+}
+.spectrum--dark .spectrum-Alert-content {
+ color: rgb(185, 185, 185);
+}
+/* topdoc
+{{ alert/alert-info.yml }}
+*/
+.spectrum--dark .spectrum-Alert--info {
+ border-color: rgb(38, 128, 235);
+}
+.spectrum--dark .spectrum-Alert--info .spectrum-Alert-icon {
+ color: rgb(38, 128, 235);
+ }
+/* topdoc
+{{ alert/alert-help.yml }}
+*/
+.spectrum--dark .spectrum-Alert--help {
+ border-color: rgb(38, 128, 235);
+}
+.spectrum--dark .spectrum-Alert--help .spectrum-Alert-icon {
+ color: rgb(38, 128, 235);
+ }
+/* topdoc
+{{ alert/alert-error.yml }}
+*/
+.spectrum--dark .spectrum-Alert--error {
+ border-color: rgb(227, 72, 80);
+}
+.spectrum--dark .spectrum-Alert--error .spectrum-Alert-icon {
+ color: rgb(227, 72, 80);
+ }
+/* topdoc
+{{ alert/alert-success.yml }}
+*/
+.spectrum--dark .spectrum-Alert--success {
+ border-color: rgb(45, 157, 120);
+}
+.spectrum--dark .spectrum-Alert--success .spectrum-Alert-icon {
+ color: rgb(45, 157, 120);
+ }
+/* topdoc
+{{ alert/alert-warning.yml }}
+*/
+.spectrum--dark .spectrum-Alert--warning {
+ border-color: rgb(230, 134, 25);
+}
+.spectrum--dark .spectrum-Alert--warning .spectrum-Alert-icon {
+ color: rgb(230, 134, 25);
+ }
+.spectrum--dark .spectrum-Avatar {
+ opacity: 1;
+}
+.spectrum--dark .spectrum-Avatar.is-disabled {
+ opacity: 0.3;
+ }
+.spectrum--dark .spectrum-Checkbox-label {
+ color: rgb(227, 227, 227);
+}
+.spectrum--dark .spectrum-Checkbox-checkmark,
+.spectrum--dark .spectrum-Checkbox-partialCheckmark {
+ color: rgb(47, 47, 47);
+}
+.spectrum--dark .spectrum-Checkbox-box {
+ border-color: rgb(144, 144, 144);
+ background-color: rgb(47, 47, 47);
+}
+/* Indetermiate is basically a checked state, so handle colors for checked state here */
+.spectrum--dark .spectrum-Checkbox.is-indeterminate .spectrum-Checkbox-box,
+.spectrum--dark .spectrum-Checkbox-input:checked + .spectrum-Checkbox-box {
+ border-color: rgb(55, 142, 240);
+}
+.spectrum--dark .spectrum-Checkbox:hover.is-indeterminate .spectrum-Checkbox-box,
+ .spectrum--dark .spectrum-Checkbox:hover .spectrum-Checkbox-input:checked + .spectrum-Checkbox-box {
+ border-color: rgb(75, 156, 245);
+
+ }
+.spectrum--dark .spectrum-Checkbox:active.is-indeterminate .spectrum-Checkbox-box,
+ .spectrum--dark .spectrum-Checkbox:active .spectrum-Checkbox-input:checked + .spectrum-Checkbox-box {
+ border-color: rgb(90, 169, 250);
+
+ }
+/* topdoc
+{{ checkbox/checkbox.yml }}
+*/
+.spectrum--dark .spectrum-Checkbox {
+ border-color: rgb(144, 144, 144);
+}
+.spectrum--dark .spectrum-Checkbox:hover .spectrum-Checkbox-box {
+ border-color: rgb(185, 185, 185);
+
+ box-shadow: none;
+ }
+.spectrum--dark .spectrum-Checkbox:hover .spectrum-Checkbox-label {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Checkbox:active .spectrum-Checkbox-box {
+ border-color: rgb(227, 227, 227);
+
+ }
+.spectrum--dark .spectrum-Checkbox:active .spectrum-Checkbox-label {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Checkbox-input:disabled + .spectrum-Checkbox-box {
+ /* Use important to override hover states */
+ border-color: rgb(90, 90, 90) !important;
+
+ background-color: rgb(47, 47, 47);
+ }
+.spectrum--dark .spectrum-Checkbox-input:disabled ~ .spectrum-Checkbox-label {
+ color: rgb(110, 110, 110);
+ }
+/* Focus */
+.spectrum--dark .spectrum-Checkbox-input.focus-ring + .spectrum-Checkbox-box {
+ /* Since the specificity of .focus-ring is less than :hover, we need important */
+ border-color: rgb(38, 128, 235) !important;
+
+ box-shadow: 0 0 0 1px rgb(38, 128, 235) !important;
+ }
+.spectrum--dark .spectrum-Checkbox-input.focus-ring ~ .spectrum-Checkbox-label {
+ color: rgb(75, 156, 245) !important;
+ }
+/* topdoc
+{{ checkbox/checkbox-quiet.yml }}
+*/
+.spectrum--dark .spectrum-Checkbox--quiet.is-indeterminate .spectrum-Checkbox-box,
+ .spectrum--dark .spectrum-Checkbox--quiet .spectrum-Checkbox-input:checked + .spectrum-Checkbox-box {
+ border-color: rgb(185, 185, 185);
+}
+.spectrum--dark .spectrum-Checkbox--quiet:hover.is-indeterminate .spectrum-Checkbox-box,
+ .spectrum--dark .spectrum-Checkbox--quiet:hover .spectrum-Checkbox-input:checked + .spectrum-Checkbox-box {
+ border-color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Checkbox--quiet:active.is-indeterminate .spectrum-Checkbox-box,
+ .spectrum--dark .spectrum-Checkbox--quiet:active .spectrum-Checkbox-input:checked + .spectrum-Checkbox-box {
+ border-color: rgb(255, 255, 255);
+ }
+/* Extra-specific selectors added here to handle checked state */
+.spectrum--dark .spectrum-Checkbox.is-invalid .spectrum-Checkbox-input:checked + .spectrum-Checkbox-box,
+ .spectrum--dark .spectrum-Checkbox.is-invalid .spectrum-Checkbox-box {
+ border-color: rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Checkbox.is-invalid .spectrum-Checkbox-label {
+ color: rgb(247, 109, 116);
+ }
+.spectrum--dark .spectrum-Checkbox.is-invalid:hover .spectrum-Checkbox-input:checked + .spectrum-Checkbox-box,
+ .spectrum--dark .spectrum-Checkbox.is-invalid:hover .spectrum-Checkbox-box {
+ border-color: rgb(247, 109, 116);
+ }
+.spectrum--dark .spectrum-Checkbox.is-invalid:hover .spectrum-Checkbox-label {
+ color: rgb(255, 123, 130);
+ }
+.spectrum--dark .spectrum-Checkbox.is-invalid:active .spectrum-Checkbox-input:checked + .spectrum-Checkbox-box,
+ .spectrum--dark .spectrum-Checkbox.is-invalid:active .spectrum-Checkbox-box {
+ border-color: rgb(255, 123, 130);
+ }
+.spectrum--dark .spectrum-Checkbox.is-invalid:active .spectrum-Checkbox-label {
+ color: rgb(255, 123, 130);
+ }
+.spectrum--dark .spectrum-Radio .spectrum-Radio-input:checked + .spectrum-Radio-button {
+ border-color: rgb(55, 142, 240);
+ }
+.spectrum--dark .spectrum-Radio-label {
+ color: rgb(227, 227, 227);
+}
+.spectrum--dark .spectrum-Radio-button {
+ background-color: rgb(47, 47, 47);
+ border-color: rgb(144, 144, 144);
+}
+/* topdoc
+{{ radio/radio.yml }}
+*/
+.spectrum--dark .spectrum-Radio:hover .spectrum-Radio-button {
+ border-color: rgb(185, 185, 185);
+ box-shadow: none;
+ }
+.spectrum--dark .spectrum-Radio:hover .spectrum-Radio-input:checked + .spectrum-Radio-button {
+ border-color: rgb(75, 156, 245);
+
+ }
+.spectrum--dark .spectrum-Radio:hover .spectrum-Radio-label {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Radio:active .spectrum-Radio-button {
+ border-color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Radio:active .spectrum-Radio-input:checked + .spectrum-Radio-button {
+ border-color: rgb(90, 169, 250);
+
+ }
+.spectrum--dark .spectrum-Radio:active .spectrum-Radio-label {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Radio--quiet .spectrum-Radio-input:checked + .spectrum-Radio-button {
+ border-color: rgb(185, 185, 185);
+ }
+.spectrum--dark .spectrum-Radio--quiet:hover .spectrum-Radio-input:checked + .spectrum-Radio-button {
+ border-color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Radio--quiet:active .spectrum-Radio-input:checked + .spectrum-Radio-button {
+ border-color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Radio.is-invalid:hover .spectrum-Radio-input + .spectrum-Radio-button, .spectrum--dark .spectrum-Radio--quiet.is-invalid:hover .spectrum-Radio-input + .spectrum-Radio-button {
+ border-color: rgb(247, 109, 116);
+ }
+.spectrum--dark .spectrum-Radio.is-invalid:hover .spectrum-Radio-label, .spectrum--dark .spectrum-Radio--quiet.is-invalid:hover .spectrum-Radio-label {
+ color: rgb(247, 109, 116);
+ }
+.spectrum--dark .spectrum-Radio.is-invalid:active .spectrum-Radio-input + .spectrum-Radio-button, .spectrum--dark .spectrum-Radio--quiet.is-invalid:active .spectrum-Radio-input + .spectrum-Radio-button {
+ border-color: rgb(255, 123, 130);
+ }
+.spectrum--dark .spectrum-Radio.is-invalid:active .spectrum-Radio-label, .spectrum--dark .spectrum-Radio--quiet.is-invalid:active .spectrum-Radio-label {
+ color: rgb(255, 123, 130);
+ }
+.spectrum--dark .spectrum-Radio.is-invalid .spectrum-Radio-button, .spectrum--dark .spectrum-Radio.is-invalid .spectrum-Radio-input:checked + .spectrum-Radio-button, .spectrum--dark .spectrum-Radio--quiet.is-invalid .spectrum-Radio-button, .spectrum--dark .spectrum-Radio--quiet.is-invalid .spectrum-Radio-input:checked + .spectrum-Radio-button {
+ border-color: rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Radio.is-invalid .spectrum-Radio-label, .spectrum--dark .spectrum-Radio--quiet.is-invalid .spectrum-Radio-label {
+ color: rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Radio-input:disabled + .spectrum-Radio-button {
+ border-color: rgb(90, 90, 90) !important;
+ }
+.spectrum--dark .spectrum-Radio-input:disabled ~ .spectrum-Radio-label {
+ color: rgb(110, 110, 110) !important;
+ }
+/* Focus Overrides all */
+.spectrum--dark .spectrum-Radio .spectrum-Radio-input.focus-ring + .spectrum-Radio-button, .spectrum--dark .spectrum-Radio:hover .spectrum-Radio-input.focus-ring + .spectrum-Radio-button, .spectrum--dark .spectrum-Radio--quiet .spectrum-Radio-input.focus-ring + .spectrum-Radio-button, .spectrum--dark .spectrum-Radio--quiet:hover .spectrum-Radio-input.focus-ring + .spectrum-Radio-button {
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Radio .spectrum-Radio-input.focus-ring ~ .spectrum-Radio-label, .spectrum--dark .spectrum-Radio:hover .spectrum-Radio-input.focus-ring ~ .spectrum-Radio-label, .spectrum--dark .spectrum-Radio--quiet .spectrum-Radio-input.focus-ring ~ .spectrum-Radio-label, .spectrum--dark .spectrum-Radio--quiet:hover .spectrum-Radio-input.focus-ring ~ .spectrum-Radio-label {
+ color: rgb(75, 156, 245);
+ }
+.spectrum--dark .spectrum-Radio.is-invalid .spectrum-Radio-input:checked.focus-ring + .spectrum-Radio-button, .spectrum--dark .spectrum-Radio--quiet.is-invalid .spectrum-Radio-input:checked.focus-ring + .spectrum-Radio-button {
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+/* topdoc
+{{ textfield/textfield.yml }}
+*/
+.spectrum--dark .spectrum-Textfield {
+ background-color: rgb(37, 37, 37);
+ border-color: rgb(74, 74, 74);
+ color: rgb(227, 227, 227);
+}
+/* topdoc
+{{ textfield/textarea-quiet.yml }}
+*/
+.spectrum--dark .spectrum-Textfield::placeholder {
+ color: rgb(144, 144, 144);
+ }
+/* topdoc
+{{ textfield/textarea.yml }}
+*/
+.spectrum--dark .spectrum-Textfield:hover {
+ border-color: rgb(90, 90, 90);
+ box-shadow: none;
+ }
+.spectrum--dark .spectrum-Textfield:hover::placeholder {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Textfield:focus {
+ border-color: rgb(55, 142, 240);
+ }
+.spectrum--dark .spectrum-Textfield.focus-ring:not(:active) {
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Textfield[disabled] {
+ background-color: rgb(62, 62, 62);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgb(110, 110, 110);
+
+ /* For safari mobile browser */
+ -webkit-text-fill-color: rgb(110, 110, 110);
+ }
+.spectrum--dark .spectrum-Textfield[disabled]::placeholder {
+ color: rgb(110, 110, 110);
+ }
+.spectrum--dark .spectrum-Textfield.is-invalid,
+ .spectrum--dark .spectrum-Textfield:invalid {
+ border-color: rgb(236, 91, 98);
+ background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' height='18' viewBox='0 0 18 18' width='18'%3E%3Cpath style='fill:rgb%28227%2C 72%2C 80%29' d='M8.564 1.289L.2 16.256A.5.5 0 0 0 .636 17h16.728a.5.5 0 0 0 .5-.5.494.494 0 0 0-.064-.244L9.436 1.289a.5.5 0 0 0-.872 0zM10 14.75a.25.25 0 0 1-.25.25h-1.5a.25.25 0 0 1-.25-.25v-1.5a.25.25 0 0 1 .25-.25h1.5a.25.25 0 0 1 .25.25zm0-3a.25.25 0 0 1-.25.25h-1.5a.25.25 0 0 1-.25-.25v-6a.25.25 0 0 1 .25-.25h1.5a.25.25 0 0 1 .25.25z'/%3E%3C/svg%3E");
+ }
+/* might break things due to pre-defined focus-ring */
+.spectrum--dark .spectrum-Textfield.is-invalid.focus-ring:not(:active), .spectrum--dark .spectrum-Textfield:invalid.focus-ring:not(:active) {
+ border-color: rgb(236, 91, 98);
+ box-shadow: 0 0 0 1px rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Textfield.is-valid {
+ background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' height='12' viewBox='0 0 12 12' width='12'%3E%3Cpath style='fill:rgb%2857%2C 185%2C 144%29' d='M4.5 10a1.023 1.023 0 0 1-.8-.384l-2.488-3a1 1 0 0 1 1.577-1.233L4.5 7.376l4.712-5.991a1 1 0 1 1 1.576 1.23l-5.511 7A.977.977 0 0 1 4.5 10z'/%3E%3C/svg%3E");
+ }
+/* topdoc
+{{ textfield/textfield-quiet.yml }}
+*/
+.spectrum--dark .spectrum-Textfield--quiet {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgb(74, 74, 74);
+}
+.spectrum--dark .spectrum-Textfield--quiet:hover {
+ border-color: rgb(90, 90, 90);
+ }
+.spectrum--dark .spectrum-Textfield--quiet:active {
+ border-color: rgb(55, 142, 240);
+ }
+.spectrum--dark .spectrum-Textfield--quiet:focus {
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 1px 0 rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Textfield--quiet.focus-ring:not(:active) {
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 1px 0 rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Textfield--quiet:disabled {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgb(74, 74, 74);
+ }
+.spectrum--dark .spectrum-Textfield--quiet.is-invalid,
+ .spectrum--dark .spectrum-Textfield--quiet:invalid {
+ border-color: rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Textfield--quiet.is-invalid:focus, .spectrum--dark .spectrum-Textfield--quiet:invalid:focus {
+ box-shadow: 0 1px 0 rgb(236, 91, 98);
+ }
+/* might break things due to pre-defined focus-ring */
+.spectrum--dark .spectrum-Textfield--quiet.is-invalid.focus-ring:not(:active), .spectrum--dark .spectrum-Textfield--quiet:invalid.focus-ring:not(:active) {
+ border-color: rgb(236, 91, 98);
+ box-shadow: 0 1px 0 rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-InputGroup:hover .spectrum-InputGroup-field:not(:disabled):not(.is-invalid):not(:focus),
+ .spectrum--dark .spectrum-InputGroup:hover .spectrum-InputGroup-field:not(:disabled):not(.is-invalid):not(:focus) ~ .spectrum-FieldButton {
+ border-color: rgb(90, 90, 90);
+ }
+.spectrum--dark .spectrum-InputGroup-field:focus ~ .spectrum-FieldButton {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-InputGroup-field:focus.is-invalid ~ .spectrum-FieldButton, .spectrum--dark .spectrum-InputGroup-field:focus:invalid ~ .spectrum-FieldButton {
+ border-color: rgb(236, 91, 98);
+ }
+/* Only add the 2px ring for keyboard focus */
+.spectrum--dark .spectrum-InputGroup-field.focus-ring ~ .spectrum-FieldButton {
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-InputGroup-field.focus-ring.is-invalid ~ .spectrum-FieldButton, .spectrum--dark .spectrum-InputGroup-field.focus-ring:invalid ~ .spectrum-FieldButton {
+ box-shadow: 0 0 0 1px rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-InputGroup--quiet .spectrum-FieldButton,
+ .spectrum--dark .spectrum-InputGroup--quiet .spectrum-FieldButton:hover,
+ .spectrum--dark .spectrum-InputGroup--quiet .spectrum-FieldButton:focus,
+ .spectrum--dark .spectrum-InputGroup--quiet .spectrum-FieldButton:active,
+ .spectrum--dark .spectrum-InputGroup--quiet .spectrum-FieldButton.is-selected,
+ .spectrum--dark .spectrum-InputGroup--quiet .spectrum-FieldButton:invalid,
+ .spectrum--dark .spectrum-InputGroup--quiet .spectrum-FieldButton.is-invalid,
+ .spectrum--dark .spectrum-InputGroup--quiet .spectrum-FieldButton:disabled,
+ .spectrum--dark .spectrum-InputGroup--quiet .spectrum-FieldButton:disabled:hover {
+ border-color: rgb(74, 74, 74);
+ }
+.spectrum--dark .spectrum-InputGroup--quiet:hover .spectrum-InputGroup-field:not(:disabled):not(.is-invalid):not(:focus),
+ .spectrum--dark .spectrum-InputGroup--quiet:hover .spectrum-InputGroup-field:not(:disabled):not(.is-invalid):not(:focus) ~ .spectrum-FieldButton {
+ border-color: rgb(90, 90, 90);
+ }
+.spectrum--dark .spectrum-InputGroup--quiet .spectrum-InputGroup-field.is-invalid,
+ .spectrum--dark .spectrum-InputGroup--quiet .spectrum-InputGroup-field.is-invalid ~ .spectrum-FieldButton,
+ .spectrum--dark .spectrum-InputGroup--quiet .spectrum-InputGroup-field:invalid,
+ .spectrum--dark .spectrum-InputGroup--quiet .spectrum-InputGroup-field:invalid ~ .spectrum-FieldButton {
+ border-color: rgb(236, 91, 98);
+ }
+/* Always add the 2px ring for keyboard focus for quiet inputgroups */
+.spectrum--dark .spectrum-InputGroup--quiet .spectrum-InputGroup-field:focus ~ .spectrum-FieldButton {
+ box-shadow: 0 1px 0 rgb(38, 128, 235);
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-InputGroup--quiet .spectrum-InputGroup-field:focus.is-invalid ~ .spectrum-FieldButton, .spectrum--dark .spectrum-InputGroup--quiet .spectrum-InputGroup-field:focus:invalid ~ .spectrum-FieldButton {
+ box-shadow: 0 1px 0 rgb(236, 91, 98);
+ border-color: rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Tooltip {
+ background-color: rgb(116, 116, 116);
+
+ color: rgb(255, 255, 255);
+}
+.spectrum--dark .spectrum-Tooltip-tip {
+ border-top-color: rgb(116, 116, 116);
+}
+.spectrum--dark .spectrum-Tooltip--negative,
+.spectrum--dark .spectrum-Tooltip--error {
+ background-color: rgb(201, 37, 45);
+}
+.spectrum--dark .spectrum-Tooltip--negative .spectrum-Tooltip-tip, .spectrum--dark .spectrum-Tooltip--error .spectrum-Tooltip-tip {
+ border-top-color: rgb(201, 37, 45);
+ }
+.spectrum--dark .spectrum-Tooltip--info,
+.spectrum--dark .spectrum-Tooltip--help {
+ background-color: rgb(13, 102, 208);
+}
+.spectrum--dark .spectrum-Tooltip--info .spectrum-Tooltip-tip, .spectrum--dark .spectrum-Tooltip--help .spectrum-Tooltip-tip {
+ border-top-color: rgb(13, 102, 208);
+ }
+.spectrum--dark .spectrum-Tooltip--positive,
+.spectrum--dark .spectrum-Tooltip--success {
+ background-color: rgb(18, 128, 92);
+}
+.spectrum--dark .spectrum-Tooltip--positive .spectrum-Tooltip-tip, .spectrum--dark .spectrum-Tooltip--success .spectrum-Tooltip-tip {
+ border-top-color: rgb(18, 128, 92);
+ }
+.spectrum--dark .spectrum-BarLoader .spectrum-BarLoader-fill {
+ background: rgb(55, 142, 240);
+ }
+.spectrum--dark .spectrum-BarLoader .spectrum-BarLoader-track {
+ background-color: rgb(74, 74, 74);
+ }
+.spectrum--dark .spectrum-BarLoader.spectrum-BarLoader--overBackground .spectrum-BarLoader-fill {
+ background: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-BarLoader.spectrum-BarLoader--overBackground .spectrum-BarLoader-label,
+ .spectrum--dark .spectrum-BarLoader.spectrum-BarLoader--overBackground .spectrum-BarLoader-percentage {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-BarLoader.spectrum-BarLoader--overBackground .spectrum-BarLoader-track {
+ background-color: rgba(255,255,255,0.2);
+ }
+.spectrum--dark .spectrum-BarLoader.is-positive .spectrum-BarLoader-fill {
+ background: rgb(45, 157, 120);
+ }
+.spectrum--dark .spectrum-BarLoader.is-warning .spectrum-BarLoader-fill {
+ background: rgb(230, 134, 25);
+ }
+.spectrum--dark .spectrum-BarLoader.is-critical .spectrum-BarLoader-fill {
+ background: rgb(227, 72, 80);
+ }
+.spectrum--dark .spectrum-BarLoader-label,
+.spectrum--dark .spectrum-BarLoader-percentage {
+ color: rgb(185, 185, 185);
+}
+.spectrum--dark .spectrum-BarLoader-label,
+.spectrum--dark .spectrum-BarLoader-percentage {
+ color: rgb(185, 185, 185);
+}
+.spectrum--dark .spectrum-BarLoader-label,
+.spectrum--dark .spectrum-BarLoader-percentage {
+ color: rgb(185, 185, 185);
+}
+.spectrum--dark .spectrum-CoachMarkPopover {
+ background-color: rgb(37, 37, 37);
+ border-color: rgb(90, 90, 90);
+ box-shadow: 0 1px 4px rgba(0,0,0,0.5);
+}
+.spectrum--dark .spectrum-CoachMarkPopover-title {
+ color: rgb(255, 255, 255);
+}
+.spectrum--dark .spectrum-CoachMarkPopover-step {
+ color: rgb(185, 185, 185);
+}
+.spectrum--dark .spectrum-CoachMarkPopover-content {
+ color: rgb(227, 227, 227);
+}
+.spectrum--dark .spectrum-CoachMarkIndicator-ring {
+ border-color: rgb(38, 128, 235);
+}
+.spectrum--dark .spectrum-CoachMarkIndicator--light .spectrum-CoachMarkIndicator-ring {
+ border-color: rgb(37, 37, 37);
+}
+.spectrum--dark .spectrum-CoachMarkIndicator--dark .spectrum-CoachMarkIndicator-ring {
+ border-color: rgb(255, 255, 255);
+}
+.spectrum--dark .spectrum-CircleLoader-track {
+ border-color: rgb(74, 74, 74);
+}
+.spectrum--dark .spectrum-CircleLoader-fill {
+ border-color: rgb(55, 142, 240);
+}
+.spectrum--dark .spectrum-CircleLoader--overBackground .spectrum-CircleLoader-track {
+ border-color: rgba(255,255,255,0.2);
+ }
+.spectrum--dark .spectrum-CircleLoader--overBackground .spectrum-CircleLoader-fill {
+ border-color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-CircleLoader--indeterminate.spectrum-CircleLoader--overBackground .spectrum-CircleLoader-track {
+ border-color: rgba(255,255,255,0.2);
+ }
+.spectrum--dark .spectrum-CircleLoader--indeterminate.spectrum-CircleLoader--overBackground .spectrum-CircleLoader-fill {
+ border-color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Underlay {
+ background: rgba(0,0,0,0.5);
+}
+.spectrum--dark .spectrum-Dialog {
+ background: rgb(50, 50, 50);
+}
+.spectrum--dark .spectrum-Dialog-header {
+ background: rgb(50, 50, 50);
+}
+.spectrum--dark .spectrum-Dialog-header:after {
+ background: rgb(62, 62, 62);
+ }
+.spectrum--dark .spectrum-Dialog-title {
+ color: rgb(255, 255, 255);
+}
+.spectrum--dark .spectrum-Dialog-content {
+ color: rgb(227, 227, 227);
+}
+.spectrum--dark .spectrum-Dialog-typeIcon {
+ color: rgb(255, 255, 255);
+}
+.spectrum--dark .spectrum-Dialog-footer {
+ background: rgb(50, 50, 50);
+}
+.spectrum--dark .spectrum-Dialog--error .spectrum-Dialog-title {
+ color: rgb(247, 109, 116);
+ }
+.spectrum--dark .spectrum-Dialog--error .spectrum-Dialog-typeIcon {
+ color: rgb(247, 109, 116);
+ }
+/* topdoc
+{{ slider/slider-ramp.yml }}
+*/
+.spectrum--dark .spectrum-Slider-track::before {
+ background: rgb(74, 74, 74);
+ }
+/* topdoc
+{{ slider/slider-tick-label.yml }}
+*/
+.spectrum--dark .spectrum-Slider-labelContainer,
+.spectrum--dark .spectrum-Dial-labelContainer {
+ color: rgb(185, 185, 185);
+}
+/* topdoc
+{{ slider/slider-tick.yml }}
+*/
+.spectrum--dark .spectrum-Slider--filled .spectrum-Slider-track:first-child::before {
+ background: rgb(185, 185, 185);
+ }
+/* topdoc
+{{ slider/slider-player.yml }}
+*/
+.spectrum--dark .spectrum-Slider-buffer::before,
+ .spectrum--dark .spectrum-Slider-buffer::after {
+ background: rgb(110, 110, 110);
+ }
+/* topdoc
+{{ slider/slider-filled.yml }}
+*/
+.spectrum--dark .spectrum-Slider-ramp path {
+ fill: rgb(74, 74, 74);
+ }
+/* topdoc
+{{ slider/slider-label.yml }}
+*/
+.spectrum--dark .spectrum-Slider-handle {
+ border-color: rgb(185, 185, 185);
+ background: rgb(50, 50, 50);
+}
+/* topdoc
+{{ slider/slider.yml }}
+*/
+.spectrum--dark .spectrum-Slider-handle:hover {
+ border-color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Slider-handle.is-focused {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Slider-handle:active,
+ .spectrum--dark .spectrum-Slider-handle.is-dragged {
+ border-color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Slider--ramp .spectrum-Slider-handle {
+ /* We can't draw this one correctly without this hack : ( */
+ box-shadow: 0 0 0 4px rgb(50, 50, 50);
+ }
+.spectrum--dark .spectrum-Slider-input {
+ background: transparent;
+}
+.spectrum--dark .spectrum-Slider-tick:after {
+ background-color: rgb(74, 74, 74);
+ }
+.spectrum--dark .spectrum-Slider-handle.is-focused {
+ border-color: rgb(38, 128, 235);
+ background: rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Slider-handle.is-dragged {
+ border-color: rgb(227, 227, 227);
+ background: rgba(0, 0, 0, 0);
+ }
+/* topdoc
+{{ slider/slider-range.yml }}
+*/
+.spectrum--dark .spectrum-Slider--range .spectrum-Slider-track:not(:first-of-type):not(:last-of-type):before {
+ background: rgb(185, 185, 185);
+ }
+/* topdoc
+{{ slider/slider-colored.yml }}
+*/
+.spectrum--dark .spectrum-Slider--color .spectrum-Slider-controls::before {
+ background-color: rgb(255, 255, 255);
+ /* Add a half-percent to fix diagonal line issue in Chrome on non-retina displays */
+ background-image:
+ linear-gradient(-45deg, transparent 75.5%, rgb(188, 188, 188) 75.5%),
+ linear-gradient(45deg, transparent 75.5%, rgb(188, 188, 188) 75.5%),
+ linear-gradient(-45deg, rgb(188, 188, 188) 25.5%, transparent 25.5%),
+ linear-gradient(45deg, rgb(188, 188, 188) 25.5%, transparent 25.5%);
+ background-size:
+ 16px
+ 16px;
+ background-position:
+ 0 0,
+ 0 8px,
+ 8px -8px,
+ -8px 0;
+ z-index: 0;
+ }
+.spectrum--dark .spectrum-Slider--color .spectrum-Slider-track {
+ background-color: transparent;
+ background-image: linear-gradient(to right, rgb(38, 128, 235), rgb(90, 169, 250));
+ box-shadow: inset 0 0 0 1px rgba(0,0,0,0.05);
+ }
+.spectrum--dark .spectrum-Slider--color .spectrum-Slider-track::before {
+ display: none;
+ }
+.spectrum--dark .spectrum-Slider--color .spectrum-Slider-handle {
+ box-shadow: inset 0 0 0 1px rgba(0,0,0,0.05), 0 0 0 1px rgba(0,0,0,0.05);
+ border-color: rgb(37, 37, 37);
+ background: rgba(0, 0, 0, 0);
+ }
+.spectrum--dark .spectrum-Slider--color .spectrum-Slider-handle.is-focused {
+ box-shadow: 0 0 0 1px rgba(0,0,0,0.05);
+ }
+/* topdoc
+{{ slider/dial-label.yml }}
+*/
+.spectrum--dark .spectrum-Dial-handle {
+ box-shadow: none;
+}
+/* topdoc
+{{ slider/dial.yml }}
+*/
+.spectrum--dark .spectrum-Dial-handle::after {
+ background-color: rgb(185, 185, 185);
+ }
+.spectrum--dark .spectrum-Dial-handle:hover::after {
+ background-color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Dial-handle.is-focused {
+ background-color: rgb(38, 128, 235);
+
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Dial-handle.is-focused::after {
+ background-color: rgb(37, 37, 37);
+ }
+.spectrum--dark .spectrum-Dial-handle:active,
+ .spectrum--dark .spectrum-Dial-handle.is-dragged {
+ background-color: rgb(227, 227, 227);
+
+ border-color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Dial-handle:active::after, .spectrum--dark .spectrum-Dial-handle.is-dragged::after {
+ background-color: rgb(37, 37, 37);
+ }
+.spectrum--dark .spectrum-Dial-controls::before,
+ .spectrum--dark .spectrum-Dial-controls::after {
+ background-color: rgb(144, 144, 144);
+ }
+.spectrum--dark .spectrum-Dial.is-disabled .spectrum-Dial-labelContainer {
+ color: rgb(110, 110, 110);
+ }
+.spectrum--dark .spectrum-Dial.is-disabled .spectrum-Dial-controls::after,
+ .spectrum--dark .spectrum-Dial.is-disabled .spectrum-Dial-controls::before {
+ background-color: rgb(90, 90, 90);
+ }
+.spectrum--dark .spectrum-Dial.is-disabled .spectrum-Dial-handle {
+ border-color: rgb(90, 90, 90);
+ background: rgb(50, 50, 50);
+ }
+.spectrum--dark .spectrum-Dial.is-disabled .spectrum-Dial-handle:hover,
+ .spectrum--dark .spectrum-Dial.is-disabled .spectrum-Dial-handle:active {
+ border-color: rgb(90, 90, 90);
+ background: rgba(0, 0, 0, 0);
+ }
+.spectrum--dark .spectrum-Dial.is-disabled .spectrum-Dial-handle::after,
+ .spectrum--dark .spectrum-Dial.is-disabled .spectrum-Dial-handle::before {
+ background-color: rgb(74, 74, 74);
+ }
+.spectrum--dark .spectrum-Slider.is-disabled .spectrum-Slider-labelContainer,
+.spectrum--dark .spectrum-Slider.is-disabled .spectrum-Dial-labelContainer {
+ color: rgb(110, 110, 110);
+ }
+.spectrum--dark .spectrum-Slider.is-disabled .spectrum-Slider-handle {
+ border-color: rgb(90, 90, 90);
+ background: rgb(50, 50, 50);
+ }
+.spectrum--dark .spectrum-Slider.is-disabled .spectrum-Slider-handle:hover,
+ .spectrum--dark .spectrum-Slider.is-disabled .spectrum-Slider-handle:active {
+ border-color: rgb(90, 90, 90);
+ background: rgba(0, 0, 0, 0);
+ }
+.spectrum--dark .spectrum-Slider.is-disabled .spectrum-Slider-track::before {
+ background: rgb(74, 74, 74);
+ }
+.spectrum--dark .spectrum-Slider.is-disabled.spectrum-Slider--filled .spectrum-Slider-track:first-child::before {
+ background: rgb(74, 74, 74);
+ }
+.spectrum--dark .spectrum-Slider.is-disabled .spectrum-Slider-buffer::before {
+ background: rgb(74, 74, 74);
+ }
+.spectrum--dark .spectrum-Slider.is-disabled .spectrum-Slider-ramp path {
+ fill: rgb(62, 62, 62);
+ }
+.spectrum--dark .spectrum-Slider.is-disabled.spectrum-Slider--color .spectrum-Slider-track {
+ background: rgb(62, 62, 62) !important;
+ box-shadow: none;
+ }
+.spectrum--dark .spectrum-Slider.is-disabled.spectrum-Slider--color .spectrum-Slider-handle {
+ background: rgba(0, 0, 0, 0);
+ box-shadow: none;
+ border-color: rgb(90, 90, 90);
+ }
+.spectrum--dark .spectrum-Slider.is-disabled.spectrum-Slider--color .spectrum-Slider-handle:hover,
+ .spectrum--dark .spectrum-Slider.is-disabled.spectrum-Slider--color .spectrum-Slider-handle:active {
+ background: rgba(0, 0, 0, 0);
+ box-shadow: none;
+ border-color: rgb(90, 90, 90);
+ }
+.spectrum--dark .spectrum-Slider.is-disabled.spectrum-Slider--range .spectrum-Slider-track:not(:first-of-type):not(:last-of-type):before {
+ background: rgb(74, 74, 74);
+ }
+/* topdoc
+{{ tabs/tabs-compact-vertical.yml }}
+*/
+.spectrum--dark .spectrum-Tabs {
+ border-bottom-color: rgb(62, 62, 62);
+}
+/* topdoc
+{{ tabs/tabs-vertical.yml }}
+*/
+.spectrum--dark .spectrum-Tabs--vertical {
+ border-left-color: rgb(62, 62, 62);
+}
+/* topdoc
+{{ tabs/tabs-quiet-compact.yml }}
+*/
+.spectrum--dark .spectrum-Tabs-selectionIndicator {
+ background-color: rgb(255, 255, 255);
+}
+/* topdoc
+{{ tabs/tabs-compact.yml }}
+*/
+.spectrum--dark .spectrum-Tabs-item {
+ color: rgb(185, 185, 185);
+}
+/* topdoc
+{{ tabs/tabs-quiet.yml }}
+*/
+.spectrum--dark .spectrum-Tabs-item .spectrum-Icon {
+ color: rgb(185, 185, 185)
+ }
+/* topdoc
+{{ tabs/tabs.yml }}
+*/
+.spectrum--dark .spectrum-Tabs-item:hover {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Tabs-item:hover .spectrum-Icon {
+ color: rgb(255, 255, 255)
+ }
+.spectrum--dark .spectrum-Tabs-item.is-selected {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Tabs-item.is-selected .spectrum-Icon {
+ color: rgb(255, 255, 255)
+ }
+.spectrum--dark .spectrum-Tabs-item.focus-ring {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Tabs-item.focus-ring::before {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Tabs-item.focus-ring .spectrum-Icon {
+ color: rgb(255, 255, 255)
+ }
+.spectrum--dark .spectrum-Tabs-item.is-disabled {
+ color: rgb(110, 110, 110);
+ }
+.spectrum--dark .spectrum-Tabs-item.is-disabled .spectrum-Icon {
+ color: rgb(90, 90, 90)
+ }
+.spectrum--dark .spectrum-Tabs--quiet {
+ border-bottom-color: rgba(0, 0, 0, 0);
+}
+.spectrum--dark .spectrum-Tabs--quiet .spectrum-Tabs-selectionIndicator {
+ background-color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Tabs--vertical.spectrum-Tabs--quiet,
+ .spectrum--dark .spectrum-Tabs--vertical.spectrum-Tabs--compact {
+ border-left-color: rgba(0, 0, 0, 0);
+ }
+.spectrum--dark .spectrum-Tabs--vertical.spectrum-Tabs--quiet .spectrum-Tabs-selectionIndicator, .spectrum--dark .spectrum-Tabs--vertical.spectrum-Tabs--compact .spectrum-Tabs-selectionIndicator {
+ background-color: rgb(255, 255, 255);
+ }
+/* Default Label Style is 'incomplete' */
+.spectrum--dark .spectrum-Steplist .spectrum-Steplist-label {
+ color: rgb(144, 144, 144)
+ }
+/* Default Marker Style is 'incomplete' */
+.spectrum--dark .spectrum-Steplist .spectrum-Steplist-marker {
+ border-color: rgb(74, 74, 74)
+ }
+/* Default Line Style is 'incomplete' */
+.spectrum--dark .spectrum-Steplist .spectrum-Steplist-segment {
+ border-bottom-color: rgb(74, 74, 74)
+ }
+/* Step Completed */
+.spectrum--dark .spectrum-Steplist .spectrum-Steplist-item.is-complete .spectrum-Steplist-label {
+ color: rgb(185, 185, 185)
+ }
+.spectrum--dark .spectrum-Steplist .spectrum-Steplist-item.is-complete .spectrum-Steplist-marker {
+ background-color: rgb(144, 144, 144)
+ }
+/* Step Selected aka Current */
+.spectrum--dark .spectrum-Steplist .spectrum-Steplist-item.is-selected .spectrum-Steplist-label {
+ color: rgb(227, 227, 227)
+ }
+.spectrum--dark .spectrum-Steplist .spectrum-Steplist-item.is-selected .spectrum-Steplist-marker {
+ background-color: rgb(227, 227, 227)
+ }
+.spectrum--dark .spectrum-Steplist .spectrum-Steplist-item.is-complete .spectrum-Steplist-segment, .spectrum--dark .spectrum-Steplist .spectrum-Steplist-item.is-selected .spectrum-Steplist-segment {
+ border-bottom-color: rgb(110, 110, 110)
+ }
+/* Step Focused */
+.spectrum--dark .spectrum-Steplist.spectrum-Steplist--interactive .spectrum-Steplist-item:focus .spectrum-Steplist-marker {
+ background-color: rgb(38, 128, 235)
+ }
+/* :before is used for the track of the switch */
+.spectrum--dark .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(74, 74, 74);
+ }
+/* :after is used for the handle of the switch */
+.spectrum--dark .spectrum-ToggleSwitch-switch::after {
+ background-color: rgb(47, 47, 47);
+ border-color: rgb(144, 144, 144);
+ }
+/* Default */
+.spectrum--dark .spectrum-ToggleSwitch-input ~ .spectrum-ToggleSwitch-label {
+ color: rgb(227, 227, 227);
+}
+/* Selected */
+.spectrum--dark .spectrum-ToggleSwitch-input:checked + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(55, 142, 240);
+ }
+/* Interactivity Styles */
+.spectrum--dark .spectrum-ToggleSwitch-input:checked + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(55, 142, 240);
+ }
+/* Hover */
+.spectrum--dark .spectrum-ToggleSwitch:hover .spectrum-ToggleSwitch-input + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(185, 185, 185);
+ box-shadow: none;
+ }
+.spectrum--dark .spectrum-ToggleSwitch:hover .spectrum-ToggleSwitch-input ~ .spectrum-ToggleSwitch-label {
+ color: rgb(255, 255, 255);
+ }
+/* Selected Hover */
+.spectrum--dark .spectrum-ToggleSwitch:hover .spectrum-ToggleSwitch-input:checked:enabled + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(75, 156, 245);
+ }
+.spectrum--dark .spectrum-ToggleSwitch:hover .spectrum-ToggleSwitch-input:checked:enabled + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(75, 156, 245);
+ }
+/* Down */
+.spectrum--dark .spectrum-ToggleSwitch:active .spectrum-ToggleSwitch-input + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-ToggleSwitch:active .spectrum-ToggleSwitch-input ~ .spectrum-ToggleSwitch-label {
+ color: rgb(255, 255, 255);
+ }
+/* Selected Down */
+.spectrum--dark .spectrum-ToggleSwitch:active .spectrum-ToggleSwitch-input:checked:enabled + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(90, 169, 250);
+ }
+.spectrum--dark .spectrum-ToggleSwitch:active .spectrum-ToggleSwitch-input:checked:enabled + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(90, 169, 250);
+ }
+/* Disabled */
+.spectrum--dark .spectrum-ToggleSwitch .spectrum-ToggleSwitch-input:disabled + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(74, 74, 74);
+ }
+.spectrum--dark .spectrum-ToggleSwitch .spectrum-ToggleSwitch-input:disabled + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(90, 90, 90);
+ }
+.spectrum--dark .spectrum-ToggleSwitch .spectrum-ToggleSwitch-input:disabled ~ .spectrum-ToggleSwitch-label {
+ color: rgb(110, 110, 110);
+ }
+/* Selected Disabled */
+.spectrum--dark .spectrum-ToggleSwitch .spectrum-ToggleSwitch-input:disabled:checked + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(90, 90, 90);
+ }
+.spectrum--dark .spectrum-ToggleSwitch .spectrum-ToggleSwitch-input:disabled:checked + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(90, 90, 90);
+ }
+.spectrum--dark .spectrum-ToggleSwitch .spectrum-ToggleSwitch-input:disabled:checked ~ .spectrum-ToggleSwitch-label {
+ color: rgb(110, 110, 110);
+ }
+/* Quiet Selected */
+.spectrum--dark .spectrum-ToggleSwitch--quiet .spectrum-ToggleSwitch-input:checked + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(185, 185, 185);
+ }
+/* Quiet */
+.spectrum--dark .spectrum-ToggleSwitch--quiet .spectrum-ToggleSwitch-input:checked + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(185, 185, 185);
+ }
+/* Quiet Selected Hover */
+.spectrum--dark .spectrum-ToggleSwitch--quiet:hover .spectrum-ToggleSwitch-input:checked:enabled + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(227, 227, 227);
+ }
+/* topdoc
+{{ toggle/toggle-onoffquiet.yml }}
+*/
+.spectrum--dark .spectrum-ToggleSwitch--quiet:hover .spectrum-ToggleSwitch-input:checked:enabled + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(227, 227, 227);
+ }
+/* Quiet Selected Down */
+.spectrum--dark .spectrum-ToggleSwitch.spectrum-ToggleSwitch--quiet:active .spectrum-ToggleSwitch-input:checked:enabled + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-ToggleSwitch.spectrum-ToggleSwitch--quiet:active .spectrum-ToggleSwitch-input:checked:enabled + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(255, 255, 255);
+ }
+/* Key Focus */
+.spectrum--dark .spectrum-ToggleSwitch .spectrum-ToggleSwitch-input.focus-ring + .spectrum-ToggleSwitch-switch::after, .spectrum--dark .spectrum-ToggleSwitch:hover .spectrum-ToggleSwitch-input.focus-ring + .spectrum-ToggleSwitch-switch::after, .spectrum--dark .spectrum-ToggleSwitch--quiet .spectrum-ToggleSwitch-input.focus-ring + .spectrum-ToggleSwitch-switch::after, .spectrum--dark .spectrum-ToggleSwitch--quiet:hover .spectrum-ToggleSwitch-input.focus-ring + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-ToggleSwitch .spectrum-ToggleSwitch-input.focus-ring ~ .spectrum-ToggleSwitch-label, .spectrum--dark .spectrum-ToggleSwitch:hover .spectrum-ToggleSwitch-input.focus-ring ~ .spectrum-ToggleSwitch-label, .spectrum--dark .spectrum-ToggleSwitch--quiet .spectrum-ToggleSwitch-input.focus-ring ~ .spectrum-ToggleSwitch-label, .spectrum--dark .spectrum-ToggleSwitch--quiet:hover .spectrum-ToggleSwitch-input.focus-ring ~ .spectrum-ToggleSwitch-label {
+ color: rgb(75, 156, 245);
+ }
+/* Selected Key Focus */
+.spectrum--dark .spectrum-ToggleSwitch .spectrum-ToggleSwitch-input.focus-ring:checked + .spectrum-ToggleSwitch-switch::before, .spectrum--dark .spectrum-ToggleSwitch:hover .spectrum-ToggleSwitch-input.focus-ring:checked + .spectrum-ToggleSwitch-switch::before, .spectrum--dark .spectrum-ToggleSwitch--quiet .spectrum-ToggleSwitch-input.focus-ring:checked + .spectrum-ToggleSwitch-switch::before, .spectrum--dark .spectrum-ToggleSwitch--quiet:hover .spectrum-ToggleSwitch-input.focus-ring:checked + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-ToggleSwitch .spectrum-ToggleSwitch-input.focus-ring:checked + .spectrum-ToggleSwitch-switch::after, .spectrum--dark .spectrum-ToggleSwitch:hover .spectrum-ToggleSwitch-input.focus-ring:checked + .spectrum-ToggleSwitch-switch::after, .spectrum--dark .spectrum-ToggleSwitch--quiet .spectrum-ToggleSwitch-input.focus-ring:checked + .spectrum-ToggleSwitch-switch::after, .spectrum--dark .spectrum-ToggleSwitch--quiet:hover .spectrum-ToggleSwitch-input.focus-ring:checked + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-ToggleSwitch .spectrum-ToggleSwitch-input.focus-ring:checked ~ .spectrum-ToggleSwitch-label, .spectrum--dark .spectrum-ToggleSwitch:hover .spectrum-ToggleSwitch-input.focus-ring:checked ~ .spectrum-ToggleSwitch-label, .spectrum--dark .spectrum-ToggleSwitch--quiet .spectrum-ToggleSwitch-input.focus-ring:checked ~ .spectrum-ToggleSwitch-label, .spectrum--dark .spectrum-ToggleSwitch--quiet:hover .spectrum-ToggleSwitch-input.focus-ring:checked ~ .spectrum-ToggleSwitch-label {
+ color: rgb(75, 156, 245);
+ }
+.spectrum--dark .spectrum-ToggleSwitch--ab .spectrum-ToggleSwitch-input:checked + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(74, 74, 74);
+ }
+.spectrum--dark .spectrum-ToggleSwitch--ab .spectrum-ToggleSwitch-input:checked + .spectrum-ToggleSwitch-switch::after {
+ /* Don't be blue */
+ border-color: rgb(144, 144, 144);
+ }
+.spectrum--dark .spectrum-ToggleSwitch--ab .spectrum-ToggleSwitch-input.focus-ring:checked + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(74, 74, 74);
+ }
+.spectrum--dark .spectrum-ToggleSwitch--ab .spectrum-ToggleSwitch-input.focus-ring:checked + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-ToggleSwitch--ab .spectrum-ToggleSwitch-input:disabled:checked + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(74, 74, 74);
+ }
+.spectrum--dark .spectrum-ToggleSwitch--ab .spectrum-ToggleSwitch-input:disabled + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(74, 74, 74);
+ }
+.spectrum--dark .spectrum-ToggleSwitch--ab .spectrum-ToggleSwitch-input:disabled + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(90, 90, 90);
+ }
+.spectrum--dark .spectrum-ToggleSwitch--ab:hover .spectrum-ToggleSwitch-input:checked:enabled + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(74, 74, 74);
+ }
+.spectrum--dark .spectrum-ToggleSwitch--ab:hover .spectrum-ToggleSwitch-input:checked:enabled + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(185, 185, 185);
+ }
+.spectrum--dark .spectrum-ToggleSwitch--ab:active .spectrum-ToggleSwitch-input:checked:enabled + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(74, 74, 74);
+ }
+.spectrum--dark .spectrum-ToggleSwitch--ab:active .spectrum-ToggleSwitch-input:checked:enabled + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(227, 227, 227);
+ }
+/* topdoc
+{{ menu/menu-nested.yml }}
+*/
+.spectrum--dark .spectrum-Menu {
+ background-color: rgba(0, 0, 0, 0);
+}
+/* topdoc
+{{ menu/menu-default.yml }}
+*/
+.spectrum--dark .spectrum-Menu-item {
+ background-color: rgba(0, 0, 0, 0);
+ color: rgb(227, 227, 227);
+}
+.spectrum--dark .spectrum-Menu-item.focus-ring,
+ .spectrum--dark .spectrum-Menu-item.is-focused {
+ background-color: rgba(255,255,255,0.06);
+ color: rgb(227, 227, 227);
+ border-left-color: rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Menu-item:hover,
+ .spectrum--dark .spectrum-Menu-item:focus,
+ .spectrum--dark .spectrum-Menu-item.is-open {
+ background-color: rgba(255,255,255,0.06);
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Menu-item.is-selected {
+ color: rgb(75, 156, 245);
+ }
+.spectrum--dark .spectrum-Menu-item.is-selected .spectrum-Menu-checkmark {
+ color: rgb(55, 142, 240);
+ }
+.spectrum--dark .spectrum-Menu-item .is-active,
+ .spectrum--dark .spectrum-Menu-item:active {
+ background-color: rgba(255,255,255,0.06);
+ }
+.spectrum--dark .spectrum-Menu-item.is-disabled {
+ background-color: rgba(0, 0, 0, 0);
+ background-image: none;
+ color: rgb(110, 110, 110);
+ cursor: default;
+ }
+.spectrum--dark .spectrum-Menu-sectionHeading {
+ color: rgb(185, 185, 185);
+}
+.spectrum--dark .spectrum-Menu-divider {
+ background-color: rgb(50, 50, 50);
+}
+.spectrum--dark .spectrum-Dropdown .spectrum-Dropdown-trigger:hover .spectrum-Dropdown-icon {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Dropdown .spectrum-Dropdown-trigger.is-selected .is-placeholder {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Dropdown.is-invalid .spectrum-Icon:not(.spectrum-Dropdown-icon):not(.spectrum-Menu-checkmark) {
+ color: rgb(247, 109, 116);
+ }
+.spectrum--dark .spectrum-Dropdown.is-invalid.is-disabled .spectrum-Icon,
+ .spectrum--dark .spectrum-Dropdown.is-invalid.is-disabled .spectrum-Icon:not(.spectrum-Dropdown-icon):not(.spectrum-Menu-checkmark) {
+ color: rgb(90, 90, 90);
+ }
+.spectrum--dark .spectrum-Dropdown.is-disabled .spectrum-Dropdown-icon, .spectrum--dark .spectrum-Dropdown.is-disabled .spectrum-Dropdown-trigger:hover .spectrum-Dropdown-icon {
+ color: rgb(90, 90, 90);
+ }
+.spectrum--dark .spectrum-Dropdown.is-disabled .spectrum-Dropdown-label.is-placeholder {
+ color: rgb(110, 110, 110);
+ }
+.spectrum--dark .spectrum-Dropdown-icon {
+ color: rgb(185, 185, 185);
+}
+.spectrum--dark .spectrum-Dropdown-label.is-placeholder {
+ color: rgb(144, 144, 144);
+ }
+.spectrum--dark .spectrum-Dropdown-label.is-placeholder:hover {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Dropdown-label.is-placeholder:active {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Dropdown-trigger.focus-ring .spectrum-Dropdown-label.is-placeholder {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Dropdown-trigger.focus-ring .spectrum-Dropdown-icon {
+ color: rgb(255, 255, 255)
+ }
+.spectrum--dark .spectrum-Dropzone {
+ border-color: rgb(74, 74, 74);
+}
+.spectrum--dark .spectrum-Dropzone.is-dragged {
+ border-color: rgb(38, 128, 235);
+ background-color: rgba(55,142,240,0.15);
+ }
+.spectrum--dark .spectrum-Dropzone.is-dragged .spectrum-IllustratedMessage-illustration {
+ color: rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Dropzone:focus {
+ border-color: rgb(74, 74, 74);
+ }
+.spectrum--dark .spectrum-Dropzone:focus .spectrum-IllustratedMessage-illustration {
+ color: rgb(188, 188, 188);
+ }
+.spectrum--dark .spectrum-Dropzone:focus.focus-ring {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Dropzone:focus.is-dragged.focus-ring .spectrum-IllustratedMessage-illustration {
+ color: rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Tooltip-label p {
+ margin: 0;
+}
+.spectrum--dark .spectrum-Toast {
+ background-color: rgb(116, 116, 116);
+ color: rgb(116, 116, 116);
+}
+.spectrum--dark .spectrum-Toast-content {
+ color: rgb(255, 255, 255);
+}
+.spectrum--dark .spectrum-Toast-typeIcon {
+ color: white;
+}
+.spectrum--dark .spectrum-Toast-buttons {
+ border-left-color: rgba(255, 255, 255, 0.2);
+}
+.spectrum--dark .spectrum-Toast--warning {
+ background-color: rgb(203, 111, 16);
+ color: rgb(203, 111, 16);
+}
+.spectrum--dark .spectrum-Toast--warning .spectrum-Toast-closeButton.focus-ring:not(:active) {
+ color: rgb(203, 111, 16);
+ }
+.spectrum--dark .spectrum-Toast--negative,
+.spectrum--dark .spectrum-Toast--error {
+ background-color: rgb(201, 37, 45);
+ color: rgb(201, 37, 45);
+}
+.spectrum--dark .spectrum-Toast--negative .spectrum-Toast-closeButton.focus-ring:not(:active), .spectrum--dark .spectrum-Toast--error .spectrum-Toast-closeButton.focus-ring:not(:active) {
+ color: rgb(201, 37, 45);
+ }
+.spectrum--dark .spectrum-Toast--info {
+ background-color: rgb(13, 102, 208);
+ color: rgb(13, 102, 208);
+}
+.spectrum--dark .spectrum-Toast--info .spectrum-Toast-closeButton.focus-ring:not(:active) {
+ color: rgb(13, 102, 208);
+ }
+.spectrum--dark .spectrum-Toast--positive,
+.spectrum--dark .spectrum-Toast--success {
+ background-color: rgb(18, 128, 92);
+ color: rgb(18, 128, 92);
+}
+.spectrum--dark .spectrum-Toast--positive .spectrum-Toast-closeButton.focus-ring:not(:active), .spectrum--dark .spectrum-Toast--success .spectrum-Toast-closeButton.focus-ring:not(:active) {
+ color: rgb(18, 128, 92);
+ }
+.spectrum--dark .spectrum-Popover {
+ background-color: rgb(37, 37, 37);
+ border-color: rgb(90, 90, 90);
+ /*
+ box-shadow offset/blur is hardcoded here as it cannot be adjusted when scale changes,
+ and we'd rather it be able to change when color stops change
+ */
+ box-shadow: 0 1px 4px rgba(0,0,0,0.5);
+}
+.spectrum--dark .spectrum-Popover .spectrum-Dialog-header,
+ .spectrum--dark .spectrum-Popover .spectrum-Dialog-footer,
+ .spectrum--dark .spectrum-Popover .spectrum-Dialog-wrapper {
+ background-color: transparent;
+ }
+.spectrum--dark .spectrum-Popover .spectrum-Popover-tip::after {
+ background-color: rgb(37, 37, 37);
+ border-color: rgb(90, 90, 90);
+ /* The math is weird here since the tip is rotated 45°... Technically it should be different for each tip position */
+ box-shadow: -1px -1px 4px rgba(0,0,0,0.5);
+ }
+.spectrum--dark .spectrum-Accordion-item {
+ border-color: rgb(74, 74, 74);
+}
+.spectrum--dark .spectrum-Accordion-itemIndicator {
+ color: rgb(144, 144, 144);
+}
+.spectrum--dark .spectrum-Accordion-itemHeader {
+ color: rgb(185, 185, 185);
+}
+.spectrum--dark .spectrum-Accordion-itemHeader:focus,
+ .spectrum--dark .spectrum-Accordion-itemHeader:hover {
+ color: rgb(255, 255, 255);
+
+ background-color: rgb(62, 62, 62);
+ }
+.spectrum--dark .spectrum-Accordion-itemHeader:focus + .spectrum-Accordion-itemIndicator, .spectrum--dark .spectrum-Accordion-itemHeader:hover + .spectrum-Accordion-itemIndicator {
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Accordion-itemHeader.focus-ring:after {
+ background-color: rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Accordion-item.is-open .spectrum-Accordion-itemHeader:hover {
+ background-color: transparent;
+ }
+.spectrum--dark .spectrum-Accordion-item.is-disabled .spectrum-Accordion-itemHeader,
+ .spectrum--dark .spectrum-Accordion-item.is-disabled .spectrum-Accordion-itemHeader:hover,
+ .spectrum--dark .spectrum-Accordion-item.is-disabled .spectrum-Accordion-itemHeader:focus {
+ color: rgb(110, 110, 110);
+ background-color: transparent;
+ }
+.spectrum--dark .spectrum-Accordion-item.is-disabled .spectrum-Accordion-itemHeader + .spectrum-Accordion-itemIndicator {
+ color: rgb(90, 90, 90);
+ }
+/* topdoc
+{{ well/well.yml }}
+*/
+.spectrum--dark .spectrum-Well {
+ background-color: rgba(227,227,227,0.02);
+ border-color: rgba(255,255,255,0.05);
+}
+.spectrum--dark .spectrum-FieldLabel,
+.spectrum--dark .spectrum-Form-itemLabel {
+ color: rgb(185, 185, 185);
+}
+.spectrum--dark .spectrum-FieldLabel.is-disabled, .spectrum--dark .spectrum-Form-itemLabel.is-disabled {
+ color: rgb(110, 110, 110);
+ }
+.spectrum--dark .spectrum-FieldLabel.is-disabled .spectrum-FieldLabel-requiredIcon, .spectrum--dark .spectrum-Form-itemLabel.is-disabled .spectrum-FieldLabel-requiredIcon {
+ color: rgb(110, 110, 110);
+ }
+.spectrum--dark .spectrum-FieldLabel-requiredIcon {
+ color: rgb(144, 144, 144);
+}
+.spectrum--dark .spectrum-Search-icon {
+ color: rgb(185, 185, 185);
+}
+.spectrum--dark .spectrum-Search-input:disabled ~ .spectrum-Search-icon {
+ color: rgb(110, 110, 110);
+ }
+/* topdoc
+{{ stepper/stepper-default.yml }}
+*/
+.spectrum--dark .spectrum-Stepper .spectrum-Stepper-input:focus {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Stepper .spectrum-Stepper-input:focus + .spectrum-Stepper-buttons .spectrum-Stepper-stepUp,
+ .spectrum--dark .spectrum-Stepper .spectrum-Stepper-input:focus + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Stepper .spectrum-Stepper-input:focus:invalid,
+ .spectrum--dark .spectrum-Stepper .spectrum-Stepper-input:focus.is-invalid {
+ border-color: rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Stepper .spectrum-Stepper-input:focus:invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepUp,
+ .spectrum--dark .spectrum-Stepper .spectrum-Stepper-input:focus:invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown,
+ .spectrum--dark .spectrum-Stepper .spectrum-Stepper-input:focus.is-invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepUp,
+ .spectrum--dark .spectrum-Stepper .spectrum-Stepper-input:focus.is-invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ border-color: rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Stepper .spectrum-Stepper-input.focus-ring {
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Stepper .spectrum-Stepper-input.focus-ring + .spectrum-Stepper-buttons {
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Stepper .spectrum-Stepper-input.focus-ring:invalid,
+ .spectrum--dark .spectrum-Stepper .spectrum-Stepper-input.focus-ring.is-invalid {
+ box-shadow: 0 0 0 1px rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Stepper .spectrum-Stepper-input.focus-ring:invalid + .spectrum-Stepper-buttons, .spectrum--dark .spectrum-Stepper .spectrum-Stepper-input.focus-ring.is-invalid + .spectrum-Stepper-buttons {
+ box-shadow: 0 0 0 1px rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Stepper .spectrum-Stepper-input:invalid,
+ .spectrum--dark .spectrum-Stepper .spectrum-Stepper-input.is-invalid {
+ border-color: rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Stepper .spectrum-Stepper-input:invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepUp,
+ .spectrum--dark .spectrum-Stepper .spectrum-Stepper-input:invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown,
+ .spectrum--dark .spectrum-Stepper .spectrum-Stepper-input.is-invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepUp,
+ .spectrum--dark .spectrum-Stepper .spectrum-Stepper-input.is-invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ border-color: rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Stepper.is-focused .spectrum-Stepper-input {
+ border-color: rgb(38, 128, 235);
+ box-shadow: none;
+ }
+.spectrum--dark .spectrum-Stepper.is-focused .spectrum-Stepper-input + .spectrum-Stepper-buttons .spectrum-Stepper-stepUp,
+ .spectrum--dark .spectrum-Stepper.is-focused .spectrum-Stepper-input + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Stepper.is-focused .spectrum-Stepper-input.focus-ring {
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Stepper.is-focused .spectrum-Stepper-input.focus-ring + .spectrum-Stepper-buttons {
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Stepper.is-focused .spectrum-Stepper-input.focus-ring:invalid,
+ .spectrum--dark .spectrum-Stepper.is-focused .spectrum-Stepper-input.focus-ring.is-invalid {
+ box-shadow: 0 0 0 1px rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Stepper.is-focused .spectrum-Stepper-input.focus-ring:invalid + .spectrum-Stepper-buttons, .spectrum--dark .spectrum-Stepper.is-focused .spectrum-Stepper-input.focus-ring.is-invalid + .spectrum-Stepper-buttons {
+ box-shadow: 0 0 0 1px rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Stepper.is-focused .spectrum-Stepper-input:invalid,
+ .spectrum--dark .spectrum-Stepper.is-focused .spectrum-Stepper-input.is-invalid {
+ border-color: rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Stepper.is-focused .spectrum-Stepper-input:invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepUp,
+ .spectrum--dark .spectrum-Stepper.is-focused .spectrum-Stepper-input:invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown,
+ .spectrum--dark .spectrum-Stepper.is-focused .spectrum-Stepper-input.is-invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepUp,
+ .spectrum--dark .spectrum-Stepper.is-focused .spectrum-Stepper-input.is-invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ border-color: rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Stepper.is-invalid .spectrum-Stepper-input {
+ border-color: rgb(236, 91, 98);
+ box-shadow: none;
+ }
+.spectrum--dark .spectrum-Stepper.is-invalid .spectrum-Stepper-input + .spectrum-Stepper-buttons .spectrum-Stepper-stepUp,
+ .spectrum--dark .spectrum-Stepper.is-invalid .spectrum-Stepper-input + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ border-color: rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Stepper.is-invalid .spectrum-Stepper-input.focus-ring {
+ box-shadow: 0 0 0 1px rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Stepper.is-invalid .spectrum-Stepper-input.focus-ring + .spectrum-Stepper-buttons {
+ box-shadow: 0 0 0 1px rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Stepper-stepUp,
+.spectrum--dark .spectrum-Stepper-stepDown {
+ border-color: rgb(74, 74, 74);
+}
+.spectrum--dark .spectrum-Stepper-stepUp:disabled, .spectrum--dark .spectrum-Stepper-stepDown:disabled {
+ border-color: rgba(0, 0, 0, 0);
+ }
+.spectrum--dark .spectrum-Stepper-stepUp:hover, .spectrum--dark .spectrum-Stepper-stepDown:hover {
+ /* Keep the border on hover */
+ border-color: rgb(74, 74, 74);
+ }
+/* topdoc
+{{ stepper/stepper-quiet.yml }}
+*/
+.spectrum--dark .spectrum-Stepper--quiet .spectrum-Stepper-stepUp:disabled, .spectrum--dark .spectrum-Stepper--quiet .spectrum-Stepper-stepDown:disabled {
+ border-color: rgb(74, 74, 74);
+ }
+.spectrum--dark .spectrum-Stepper--quiet .spectrum-Stepper-input {
+ box-shadow: none;
+ }
+.spectrum--dark .spectrum-Stepper--quiet .spectrum-Stepper-input:focus + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Stepper--quiet .spectrum-Stepper-input:focus:invalid,
+ .spectrum--dark .spectrum-Stepper--quiet .spectrum-Stepper-input:focus.is-invalid {
+ box-shadow: none;
+ }
+.spectrum--dark .spectrum-Stepper--quiet .spectrum-Stepper-input.focus-ring {
+ box-shadow: 0 1px 0 0 rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Stepper--quiet .spectrum-Stepper-input.focus-ring + .spectrum-Stepper-buttons {
+ box-shadow: none;
+ }
+.spectrum--dark .spectrum-Stepper--quiet .spectrum-Stepper-input.focus-ring + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ box-shadow: 0 1px 0 0 rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Stepper--quiet .spectrum-Stepper-input.focus-ring:invalid,
+ .spectrum--dark .spectrum-Stepper--quiet .spectrum-Stepper-input.focus-ring.is-invalid {
+ box-shadow: 0 1px 0 0 rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Stepper--quiet .spectrum-Stepper-input.focus-ring:invalid + .spectrum-Stepper-buttons, .spectrum--dark .spectrum-Stepper--quiet .spectrum-Stepper-input.focus-ring.is-invalid + .spectrum-Stepper-buttons {
+ box-shadow: none;
+ }
+.spectrum--dark .spectrum-Stepper--quiet .spectrum-Stepper-input.focus-ring:invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown, .spectrum--dark .spectrum-Stepper--quiet .spectrum-Stepper-input.focus-ring.is-invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ box-shadow: 0 1px 0 0 rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Stepper--quiet .spectrum-Stepper-input:invalid,
+ .spectrum--dark .spectrum-Stepper--quiet .spectrum-Stepper-input.is-invalid {
+ border-color: rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Stepper--quiet .spectrum-Stepper-input:invalid + .spectrum-Stepper-buttons, .spectrum--dark .spectrum-Stepper--quiet .spectrum-Stepper-input.is-invalid + .spectrum-Stepper-buttons {
+ box-shadow: none;
+ }
+.spectrum--dark .spectrum-Stepper--quiet .spectrum-Stepper-input:invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown, .spectrum--dark .spectrum-Stepper--quiet .spectrum-Stepper-input.is-invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ border-color: rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input {
+ box-shadow: none;
+ }
+.spectrum--dark .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input + .spectrum-Stepper-buttons {
+ box-shadow: none;
+ }
+.spectrum--dark .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input:focus + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input.focus-ring {
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 1px 0 0 rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input.focus-ring + .spectrum-Stepper-buttons {
+ box-shadow: none;
+ }
+.spectrum--dark .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input.focus-ring + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ box-shadow: 0 1px 0 0 rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input.focus-ring:invalid,
+ .spectrum--dark .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input.focus-ring.is-invalid {
+ box-shadow: 0 1px 0 0 rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input.focus-ring:invalid + .spectrum-Stepper-buttons, .spectrum--dark .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input.focus-ring.is-invalid + .spectrum-Stepper-buttons {
+ box-shadow: none;
+ }
+.spectrum--dark .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input.focus-ring:invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown, .spectrum--dark .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input.focus-ring.is-invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ box-shadow: 0 1px 0 0 rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input:invalid,
+ .spectrum--dark .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input.is-invalid {
+ border-color: rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input:invalid + .spectrum-Stepper-buttons, .spectrum--dark .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input.is-invalid + .spectrum-Stepper-buttons {
+ box-shadow: none;
+ }
+.spectrum--dark .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input:invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown, .spectrum--dark .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input.is-invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ border-color: rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Stepper--quiet.is-invalid .spectrum-Stepper-input {
+ border-color: rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Stepper--quiet.is-invalid .spectrum-Stepper-input + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ border-color: rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Stepper--quiet.is-invalid .spectrum-Stepper-input:focus + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ border-color: rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Stepper--quiet.is-invalid .spectrum-Stepper-input.focus-ring {
+ box-shadow: 0 1px 0 0 rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Stepper--quiet.is-invalid .spectrum-Stepper-input.focus-ring + .spectrum-Stepper-buttons {
+ box-shadow: none;
+ }
+.spectrum--dark .spectrum-Stepper--quiet.is-invalid .spectrum-Stepper-input.focus-ring + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ box-shadow: 0 1px 0 0 rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Calendar-prevMonth {
+ color: rgb(185, 185, 185);
+}
+.spectrum--dark .spectrum-Calendar-nextMonth {
+ color: rgb(185, 185, 185);
+}
+.spectrum--dark .spectrum-Calendar-dayOfWeek {
+ color: rgb(185, 185, 185);
+}
+.spectrum--dark .spectrum-Calendar-date:hover {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Calendar-date:hover:not(.is-selection-end):not(.is-selection-start):before {
+ background: rgba(255,255,255,0.07);
+ }
+.spectrum--dark .spectrum-Calendar-date:hover.is-selected {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Calendar-date:hover.is-selected:not(.is-selection-end):not(.is-selection-start):before {
+ background: rgba(55,142,240,0.25);
+ }
+.spectrum--dark .spectrum-Calendar-date:hover.is-range-selection:before {
+ background: rgba(55,142,240,0.25);
+ }
+.spectrum--dark .spectrum-Calendar-date:active {
+ background-color: rgba(255,255,255,0.1);
+ }
+.spectrum--dark .spectrum-Calendar-date.is-selected {
+ color: rgb(255, 255, 255);
+ background: rgba(55,142,240,0.15);
+ }
+.spectrum--dark .spectrum-Calendar-date.is-selected:not(.is-range-selection) {
+ background: rgba(55,142,240,0.25);
+ }
+.spectrum--dark .spectrum-Calendar-date.is-today {
+ color: rgb(227, 227, 227);
+ border-color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Calendar-date.is-today:before {
+ border-color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Calendar-date.is-today:hover.is-selected:not(.is-range-selection):before {
+ background: rgba(55,142,240,0.25);
+ }
+.spectrum--dark .spectrum-Calendar-date.is-today.is-disabled {
+ color: rgb(110, 110, 110);
+ border-color: rgb(90, 90, 90);
+ }
+.spectrum--dark .spectrum-Calendar-date.is-today.is-disabled:before {
+ border-color: rgb(90, 90, 90);
+ }
+.spectrum--dark .spectrum-Calendar-date.is-focused:not(.is-range-selection) {
+ background: rgba(255,255,255,0.07);
+ border-color: rgb(38, 128, 235);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Calendar-date.is-focused:not(.is-range-selection).is-today {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Calendar-date.is-focused:not(.is-range-selection):active,
+ .spectrum--dark .spectrum-Calendar-date.is-focused:not(.is-range-selection).is-selected {
+ color: rgb(255, 255, 255);
+ background: rgba(55,142,240,0.25);
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Calendar-date.is-focused.is-selected:before {
+ background: rgba(55,142,240,0.25);
+ }
+.spectrum--dark .spectrum-Calendar-date.is-focused.is-range-selection:before {
+ background: rgba(55,142,240,0.25);
+ }
+.spectrum--dark .spectrum-Calendar-date.is-disabled {
+ color: rgb(110, 110, 110);
+ }
+.spectrum--dark .spectrum-Calendar-date.is-selection-start,
+ .spectrum--dark .spectrum-Calendar-date.is-selection-end {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Calendar-date.is-selection-start:after, .spectrum--dark .spectrum-Calendar-date.is-selection-end:after {
+ background-color: rgba(55,142,240,0.15);
+ }
+.spectrum--dark .spectrum-Calendar-date.is-selection-start.is-disabled, .spectrum--dark .spectrum-Calendar-date.is-selection-end.is-disabled {
+ color: rgb(110, 110, 110);
+ }
+.spectrum--dark .spectrum-Table-headCell {
+ color: rgb(185, 185, 185);
+ background-color: rgba(0, 0, 0, 0);
+}
+.spectrum--dark .spectrum-Table-headCell.is-sortable .spectrum-Table-sortedIcon {
+ color: rgb(144, 144, 144);
+ }
+.spectrum--dark .spectrum-Table-headCell.is-sortable:hover {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Table-headCell.is-sortable:hover .spectrum-Table-sortedIcon {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Table-headCell.is-sortable.focus-ring,
+ .spectrum--dark .spectrum-Table-headCell.is-sortable.is-focused {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Table-headCell.is-sortable.focus-ring .spectrum-Table-sortedIcon, .spectrum--dark .spectrum-Table-headCell.is-sortable.is-focused .spectrum-Table-sortedIcon {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Table-headCell.is-sortable:active {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Table-headCell.is-sortable:active .spectrum-Table-sortedIcon {
+ color: rgb(255, 255, 255);
+ }
+/* Helper for shared drop target overlay */
+.spectrum--dark .spectrum-Table-cell.focus-ring::before, .spectrum--dark .spectrum-Table-cell .is-focused::before, .spectrum--dark .spectrum-Table-headCell.focus-ring::before, .spectrum--dark .spectrum-Table-headCell .is-focused::before {
+ box-shadow: inset 0 0 0 2px rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Table-body {
+ border-style: solid;
+ border-color: rgb(74, 74, 74);
+ background-color: rgb(37, 37, 37);
+}
+.spectrum--dark .spectrum-Table-body.is-drop-target {
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Table-body.is-drop-target::before {
+ background-color: rgba(55,142,240,0.15);
+ }
+/* The tbody tag doesn't allow setting a border-radius, so these hacks are to make that work
+ by putting the border on the individual cells instead. */
+.spectrum--dark tbody.spectrum-Table-body {
+ border: none;
+}
+.spectrum--dark tbody.spectrum-Table-body .spectrum-Table-row {
+ border-top: none;
+ }
+.spectrum--dark tbody.spectrum-Table-body .spectrum-Table-cell {
+ border-top: 1px solid rgb(74, 74, 74);
+ }
+.spectrum--dark tbody.spectrum-Table-body .spectrum-Table-row .spectrum-Table-cell:first-child {
+ border-left: 1px solid rgb(74, 74, 74);
+ }
+.spectrum--dark tbody.spectrum-Table-body .spectrum-Table-row .spectrum-Table-cell:last-child {
+ border-right: 1px solid rgb(74, 74, 74);
+ }
+.spectrum--dark tbody.spectrum-Table-body .spectrum-Table-row:last-child .spectrum-Table-cell {
+ border-bottom: 1px solid rgb(74, 74, 74);
+ }
+.spectrum--dark .spectrum-Table-row {
+ border-bottom: 1px solid rgb(74, 74, 74);
+ background-color: rgba(0, 0, 0, 0);
+}
+.spectrum--dark .spectrum-Table-row:hover {
+ background-color: rgba(255,255,255,0.07);
+ }
+.spectrum--dark .spectrum-Table-row.focus-ring,
+ .spectrum--dark .spectrum-Table-row.is-focused {
+ background-color: rgba(255,255,255,0.07);
+ }
+.spectrum--dark .spectrum-Table-row:active {
+ background-color: rgba(255,255,255,0.1);
+ }
+.spectrum--dark .spectrum-Table-row.is-selected {
+ background-color: rgba(55,142,240,0.15);
+ }
+.spectrum--dark .spectrum-Table-row.is-selected:hover {
+ background-color: rgba(55,142,240,0.25);
+ }
+.spectrum--dark .spectrum-Table-row.is-selected.focus-ring,
+ .spectrum--dark .spectrum-Table-row.is-selected.is-focused {
+ background-color: rgba(55,142,240,0.25);
+ }
+.spectrum--dark .spectrum-Table-row.is-drop-target::before {
+ box-shadow: inset 0 0 0 2px rgb(38, 128, 235);
+ background-color: rgba(55,142,240,0.15);
+ }
+.spectrum--dark .spectrum-Table-cell {
+ color: rgb(227, 227, 227);
+ background-color: rgba(0, 0, 0, 0);
+}
+.spectrum--dark .spectrum-Table-cell--divider {
+ border-right-style: solid;
+ border-right-color: rgb(74, 74, 74);
+}
+.spectrum--dark .spectrum-Table--quiet .spectrum-Table-body {
+ border-width: 1px 0;
+ background-color: rgba(0, 0, 0, 0);
+ }
+.spectrum--dark .spectrum-Table--quiet .spectrum-Table-body.is-drop-target {
+ box-shadow: none;
+ border-color: transparent;
+ }
+.spectrum--dark .spectrum-Table--quiet .spectrum-Table-body.is-drop-target::before {
+ box-shadow: inset 0 0 0 2px rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Table--quiet .spectrum-Table-row {
+ background-color: rgba(0, 0, 0, 0);
+ }
+.spectrum--dark .spectrum-Table--quiet .spectrum-Table-row:hover {
+ background-color: rgba(255,255,255,0.07);
+ }
+.spectrum--dark .spectrum-Table--quiet .spectrum-Table-row.focus-ring,
+ .spectrum--dark .spectrum-Table--quiet .spectrum-Table-row.is-focused {
+ background-color: rgba(255,255,255,0.07);
+ }
+.spectrum--dark .spectrum-Table--quiet .spectrum-Table-row:active {
+ background-color: rgba(255,255,255,0.1);
+ }
+.spectrum--dark .spectrum-Table--quiet .spectrum-Table-row.is-selected {
+ background-color: rgba(55,142,240,0.15);
+ }
+.spectrum--dark .spectrum-Table--quiet .spectrum-Table-row.is-selected:hover {
+ background-color: rgba(55,142,240,0.25);
+ }
+.spectrum--dark .spectrum-Table--quiet .spectrum-Table-row.is-selected.focus-ring,
+ .spectrum--dark .spectrum-Table--quiet .spectrum-Table-row.is-selected.is-focused {
+ background-color: rgba(55,142,240,0.25);
+ }
+.spectrum--dark .spectrum-Table--quiet tbody.spectrum-Table-body .spectrum-Table-row .spectrum-Table-cell:first-child,
+ .spectrum--dark .spectrum-Table--quiet tbody.spectrum-Table-body .spectrum-Table-row .spectrum-Table-cell:last-child {
+ border-left: none;
+ border-right: none;
+ }
+/* topdoc
+{{ rating/rating.yml }}
+*/
+.spectrum--dark .spectrum-Rating-icon {
+ color: rgb(144, 144, 144);
+}
+/* Star */
+.spectrum--dark .spectrum-Rating-icon .spectrum-Rating-starActive {
+ display: block;
+ }
+.spectrum--dark .spectrum-Rating-icon .spectrum-Rating-starInactive {
+ display: none;
+ }
+.spectrum--dark .spectrum-Rating:not(:hover) .spectrum-Rating-icon:not(.is-selected) {
+ color: rgb(144, 144, 144);
+ }
+/* StarOutline */
+.spectrum--dark .spectrum-Rating:not(:hover) .spectrum-Rating-icon:not(.is-selected) .spectrum-Rating-starActive {
+ display: none;
+ }
+.spectrum--dark .spectrum-Rating:not(:hover) .spectrum-Rating-icon:not(.is-selected) .spectrum-Rating-starInactive {
+ display: block;
+ }
+.spectrum--dark .spectrum-Rating-icon:hover ~ .spectrum-Rating-icon:not(.is-selected) {
+ color: rgb(144, 144, 144);
+}
+/* StarOutline */
+.spectrum--dark .spectrum-Rating-icon:hover ~ .spectrum-Rating-icon:not(.is-selected) .spectrum-Rating-starActive {
+ display: none;
+ }
+.spectrum--dark .spectrum-Rating-icon:hover ~ .spectrum-Rating-icon:not(.is-selected) .spectrum-Rating-starInactive {
+ display: block;
+ }
+/* topdoc
+{{ rating/rating-active.yml }}
+*/
+.spectrum--dark .spectrum-Rating-icon:hover ~ .spectrum-Rating-icon.is-selected {
+ color: rgb(144, 144, 144);
+}
+/* Star */
+.spectrum--dark .spectrum-Rating-icon:hover ~ .spectrum-Rating-icon.is-selected .spectrum-Rating-starActive {
+ display: block;
+ }
+.spectrum--dark .spectrum-Rating-icon:hover ~ .spectrum-Rating-icon.is-selected .spectrum-Rating-starInactive {
+ display: none;
+ }
+.spectrum--dark .spectrum-Rating-icon.is-selected {
+ color: rgb(227, 227, 227);
+ }
+/* Star */
+.spectrum--dark .spectrum-Rating-icon.is-selected .spectrum-Rating-starActive {
+ display: block;
+ }
+.spectrum--dark .spectrum-Rating-icon.is-selected .spectrum-Rating-starInactive {
+ display: none;
+ }
+/* topdoc
+{{ rating/rating-disabled.yml }}
+*/
+.spectrum--dark .spectrum-Rating.is-disabled .spectrum-Rating-icon.is-selected {
+ color: rgb(74, 74, 74);
+}
+/* Star */
+.spectrum--dark .spectrum-Rating.is-disabled .spectrum-Rating-icon.is-selected .spectrum-Rating-starActive {
+ display: block;
+ }
+.spectrum--dark .spectrum-Rating.is-disabled .spectrum-Rating-icon.is-selected .spectrum-Rating-starInactive {
+ display: none;
+ }
+.spectrum--dark .spectrum-Rating:not(:hover).is-disabled .spectrum-Rating-icon:not(.is-selected) {
+ color: rgb(74, 74, 74);
+}
+/* StarOutline */
+.spectrum--dark .spectrum-Rating:not(:hover).is-disabled .spectrum-Rating-icon:not(.is-selected) .spectrum-Rating-starActive {
+ display: none;
+ }
+.spectrum--dark .spectrum-Rating:not(:hover).is-disabled .spectrum-Rating-icon:not(.is-selected) .spectrum-Rating-starInactive {
+ display: block;
+ }
+.spectrum--dark .spectrum-Rating:not(:hover) .spectrum-Rating-input.focus-ring ~ .spectrum-Rating-icon,
+ .spectrum--dark .spectrum-Rating:not(:hover) .spectrum-Rating-input.focus-ring ~ .spectrum-Rating-icon:not(.is-selected),
+ .spectrum--dark .spectrum-Rating:not(:hover) .spectrum-Rating-input.focus-ring ~ .spectrum-Rating-icon.is-selected {
+ color: rgb(20, 115, 230);
+
+ }
+.spectrum--dark .spectrum-Rating:not(:hover) .spectrum-Rating-input.focus-ring ~ .spectrum-Rating-icon > .spectrum-Icon, .spectrum--dark .spectrum-Rating:not(:hover) .spectrum-Rating-input.focus-ring ~ .spectrum-Rating-icon:not(.is-selected) > .spectrum-Icon, .spectrum--dark .spectrum-Rating:not(:hover) .spectrum-Rating-input.focus-ring ~ .spectrum-Rating-icon.is-selected > .spectrum-Icon {
+ stroke: currentColor;
+ stroke-width: 1px;
+ }
+.spectrum--dark .spectrum-Tags-item {
+ color: rgb(185, 185, 185);
+ background-color: rgb(47, 47, 47);
+ border-color: rgb(144, 144, 144);
+}
+.spectrum--dark .spectrum-Tags-item .spectrum-ClearButton {
+ color: rgb(144, 144, 144);
+ }
+.spectrum--dark .spectrum-Tags-item:hover {
+ background-color: rgb(47, 47, 47);
+ color: rgb(255, 255, 255);
+ border-color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Tags-item:hover .spectrum-ClearButton {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Tags-item.focus-ring {
+ background-color: rgb(47, 47, 47);
+ color: rgb(255, 255, 255);
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Tags-item.focus-ring .spectrum-ClearButton {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Tags-item.is-invalid {
+ color: rgb(185, 185, 185);
+ border-color: rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Tags-item.is-invalid .spectrum-ClearButton {
+ color: rgb(236, 91, 98);
+ }
+.spectrum--dark .spectrum-Tags-item.is-invalid:hover {
+ color: rgb(255, 255, 255);
+ border-color: rgb(247, 109, 116);
+ }
+.spectrum--dark .spectrum-Tags-item.is-invalid:hover .spectrum-ClearButton {
+ color: rgb(247, 109, 116);
+ }
+.spectrum--dark .spectrum-Tags-item.is-invalid.focus-ring {
+ color: rgb(255, 255, 255);
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Tags-item.is-invalid.focus-ring .spectrum-ClearButton {
+ color: rgb(247, 109, 116);
+ }
+.spectrum--dark .spectrum-Tags-item.is-disabled {
+ color: rgb(110, 110, 110);
+ background-color: rgb(62, 62, 62);
+ border-color: rgb(62, 62, 62);
+ }
+.spectrum--dark .spectrum-Tags-item.is-disabled .spectrum-Avatar {
+ /* Duplicated so state is on the tag */
+ opacity: 0.3;
+ }
+.spectrum--dark .spectrum-Tags-item--deletable:hover {
+ color: rgb(185, 185, 185);
+ }
+.spectrum--dark .spectrum-Tags-item--deletable:hover .spectrum-ClearButton {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Tags-item--deletable:active {
+ color: rgb(185, 185, 185);
+ }
+.spectrum--dark .spectrum-Tags-item--deletable:active .spectrum-ClearButton {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Tags-item--deletable.is-invalid:hover {
+ border-color: rgb(247, 109, 116);
+ color: rgb(185, 185, 185);
+ }
+.spectrum--dark .spectrum-Tags-item--deletable.is-invalid:hover .spectrum-ClearButton {
+ color: rgb(247, 109, 116);
+ }
+.spectrum--dark .spectrum-Tags-item--deletable.is-invalid:active {
+ border-color: rgb(255, 123, 130);
+ color: rgb(185, 185, 185);
+ }
+.spectrum--dark .spectrum-Tags-item--deletable.is-invalid:active .spectrum-ClearButton {
+ color: rgb(255, 123, 130);
+ }
+.spectrum--dark .spectrum-Tags-item--deletable.focus-ring {
+ color: rgb(185, 185, 185);
+ }
+.spectrum--dark .spectrum-Tags-item--deletable.focus-ring .spectrum-ClearButton {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Tags-item--deletable.focus-ring.is-invalid {
+ color: rgb(185, 185, 185);
+ }
+.spectrum--dark .spectrum-Tags-item.is-disabled .spectrum-ClearButton .spectrum-Icon {
+ color: rgb(110, 110, 110);
+ }
+/* topdoc
+{{ quickaction/quickactions.yml }}
+*/
+.spectrum--dark .spectrum-QuickActions-overlay {
+ background-color: rgba(0,0,0,0.2);
+}
+.spectrum--dark .spectrum-QuickActions {
+ background-color: rgba(50,50,50,0.9);
+}
+.spectrum--dark .spectrum-AssetList-item:hover {
+ background-color: rgb(62, 62, 62);
+ }
+.spectrum--dark .spectrum-AssetList-item:focus.focus-ring,
+ .spectrum--dark .spectrum-AssetList-item:focus.is-focused {
+ background-color: rgb(62, 62, 62);
+ }
+.spectrum--dark .spectrum-AssetList-item:focus.focus-ring::before, .spectrum--dark .spectrum-AssetList-item:focus.is-focused::before {
+ /* we cannot achieve rounded corners with outline so we use box-shadow instead */
+ box-shadow: 0px 0px 0px 2px rgb(38, 128, 235) inset;
+ }
+.spectrum--dark .spectrum-AssetList-item.is-navigated {
+ /* gray background */
+ background-color: rgb(74, 74, 74);
+ }
+.spectrum--dark .spectrum-AssetList-item.is-navigated:hover,
+ .spectrum--dark .spectrum-AssetList-item.is-navigated:focus {
+ background-color: rgb(74, 74, 74);
+ }
+.spectrum--dark .spectrum-AssetList-item.is-selected {
+ background-color: rgba(55,142,240,0.1);
+ }
+.spectrum--dark .spectrum-AssetList-item.is-selected:hover,
+ .spectrum--dark .spectrum-AssetList-item.is-selected:focus {
+ background-color: rgba(55,142,240,0.2);
+ }
+.spectrum--dark .spectrum-SplitView-pane {
+ background-color: rgb(50, 50, 50);
+}
+.spectrum--dark .spectrum-SplitView-splitter {
+ background-color: rgb(74, 74, 74);
+}
+.spectrum--dark .spectrum-SplitView-gripper {
+ border-color: rgb(74, 74, 74);
+}
+.spectrum--dark .spectrum-SplitView-gripper:before {
+ background-color: rgb(74, 74, 74);
+ }
+.spectrum--dark .spectrum-SplitView-splitter.is-draggable:hover,
+ .spectrum--dark .spectrum-SplitView-splitter.is-draggable.is-hovered {
+ background-color: rgb(90, 90, 90);
+ }
+.spectrum--dark .spectrum-SplitView-splitter.is-draggable:hover .spectrum-SplitView-gripper, .spectrum--dark .spectrum-SplitView-splitter.is-draggable.is-hovered .spectrum-SplitView-gripper {
+ border-color: rgb(90, 90, 90);
+ }
+.spectrum--dark .spectrum-SplitView-splitter.is-draggable:hover .spectrum-SplitView-gripper:before, .spectrum--dark .spectrum-SplitView-splitter.is-draggable.is-hovered .spectrum-SplitView-gripper:before {
+ background-color: rgb(90, 90, 90);
+ }
+.spectrum--dark .spectrum-SplitView-splitter.is-draggable:active,
+ .spectrum--dark .spectrum-SplitView-splitter.is-draggable.is-active {
+ background-color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-SplitView-splitter.is-draggable:active .spectrum-SplitView-gripper, .spectrum--dark .spectrum-SplitView-splitter.is-draggable.is-active .spectrum-SplitView-gripper {
+ border-color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-SplitView-splitter.is-draggable:active .spectrum-SplitView-gripper:before, .spectrum--dark .spectrum-SplitView-splitter.is-draggable.is-active .spectrum-SplitView-gripper:before {
+ background-color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-SplitView-splitter.is-draggable:focus {
+ outline: none;
+ }
+.spectrum--dark .spectrum-SplitView-splitter.is-draggable.focus-ring {
+ background-color: rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-SplitView-splitter.is-draggable.focus-ring .spectrum-SplitView-gripper {
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-SplitView-splitter.is-draggable.focus-ring .spectrum-SplitView-gripper:before {
+ background-color: rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Pagination-pageButton:hover {
+ background-color: rgba(255,255,255,0.06);
+ }
+.spectrum--dark .spectrum-Pagination-pageButton:focus {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Pagination-pageButton.is-selected {
+ background-color: rgb(227, 227, 227);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-Banner {
+ color: rgb(255, 255, 255);
+}
+.spectrum--dark .spectrum-Banner--info {
+ background-color: rgb(55, 142, 240);
+}
+.spectrum--dark .spectrum-Banner--warning {
+ background-color: rgb(242, 148, 35);
+}
+.spectrum--dark .spectrum-Banner--error {
+ background-color: rgb(236, 91, 98);
+}
+.spectrum--dark .spectrum-Rule--large {
+ background-color: rgb(227, 227, 227);
+}
+.spectrum--dark .spectrum-Rule--medium {
+ background-color: rgb(74, 74, 74);
+}
+.spectrum--dark .spectrum-Rule--small {
+ background-color: rgb(74, 74, 74);
+}
+.spectrum--dark .spectrum-StatusLight {
+ color: rgb(227, 227, 227);
+}
+.spectrum--dark .spectrum-StatusLight[disabled],
+ .spectrum--dark .spectrum-StatusLight.is-disabled {
+ color: rgb(110, 110, 110);
+ }
+.spectrum--dark .spectrum-StatusLight[disabled]::before, .spectrum--dark .spectrum-StatusLight.is-disabled::before {
+ background-color: rgb(90, 90, 90);
+ }
+.spectrum--dark .spectrum-StatusLight--negative::before {
+ background-color: rgb(227, 72, 80);
+}
+.spectrum--dark .spectrum-StatusLight--notice::before {
+ background-color: rgb(230, 134, 25);
+}
+.spectrum--dark .spectrum-StatusLight--positive::before {
+ background-color: rgb(45, 157, 120);
+}
+.spectrum--dark .spectrum-StatusLight--info::before,
+.spectrum--dark .spectrum-StatusLight--active::before {
+ background-color: rgb(38, 128, 235);
+}
+.spectrum--dark .spectrum-StatusLight--neutral {
+ color: rgb(185, 185, 185);
+}
+.spectrum--dark .spectrum-StatusLight--neutral::before {
+ background-color: rgb(110, 110, 110);
+ }
+.spectrum--dark .spectrum-StatusLight--celery::before {
+ background-color: rgb(68, 181, 86);
+}
+.spectrum--dark .spectrum-StatusLight--yellow::before {
+ background-color: rgb(223, 191, 0);
+}
+.spectrum--dark .spectrum-StatusLight--fuchsia::before {
+ background-color: rgb(192, 56, 204);
+}
+.spectrum--dark .spectrum-StatusLight--indigo::before {
+ background-color: rgb(103, 103, 236);
+}
+.spectrum--dark .spectrum-StatusLight--seafoam::before {
+ background-color: rgb(27, 149, 154);
+}
+.spectrum--dark .spectrum-StatusLight--chartreuse::before {
+ background-color: rgb(133, 208, 68);
+}
+.spectrum--dark .spectrum-StatusLight--magenta::before {
+ background-color: rgb(216, 55, 144);
+}
+.spectrum--dark .spectrum-StatusLight--purple::before {
+ background-color: rgb(146, 86, 217);
+}
+.spectrum--dark .spectrum-TreeView-item.is-disabled > .spectrum-TreeView-itemLink {
+ color: rgb(110, 110, 110);
+ }
+.spectrum--dark .spectrum-TreeView-item.is-disabled > .spectrum-TreeView-itemLink .spectrum-Icon {
+ color: rgb(90, 90, 90);
+ }
+.spectrum--dark .spectrum-TreeView-itemLink {
+ color: rgb(227, 227, 227);
+}
+.spectrum--dark .spectrum-TreeView-itemLink:hover,
+ .spectrum--dark .spectrum-TreeView-itemLink.is-selected {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-TreeView-itemLink:hover::before, .spectrum--dark .spectrum-TreeView-itemLink.is-selected::before {
+ background-color: rgba(255,255,255,0.06);
+ }
+.spectrum--dark .spectrum-TreeView-itemLink.focus-ring {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-TreeView-itemLink.focus-ring::before {
+ background-color: rgba(255,255,255,0.06);
+
+ /* we cannot achieve rounded corners with outline so we use box-shadow instead */
+ box-shadow: 0px 0px 0px 2px rgb(38, 128, 235) inset;
+ }
+.spectrum--dark .spectrum-TreeView-itemLink.is-drop-target::before {
+ background-color: rgba(55,142,240,0.15);
+ box-shadow: 0px 0px 0px 2px rgb(38, 128, 235) inset;
+ }
+/* topdoc
+{{ sidenav/sidenav-multilevel.yml }}
+*/
+.spectrum--dark .spectrum-SideNav-item.is-selected > .spectrum-SideNav-itemLink {
+ color: rgb(255, 255, 255);
+ background-color: rgba(255,255,255,0.07);
+ }
+/* topdoc
+{{ sidenav/sidenav.yml }}
+*/
+.spectrum--dark .spectrum-SideNav-item .is-active > .spectrum-SideNav-itemLink {
+ background-color: rgba(255,255,255,0.07);
+ }
+/* Disable all children */
+.spectrum--dark .spectrum-SideNav-item.is-disabled .spectrum-SideNav-itemLink {
+ background-color: rgba(0, 0, 0, 0);
+ color: rgb(110, 110, 110);
+
+ cursor: default;
+ pointer-events: none;
+ }
+.spectrum--dark .spectrum-SideNav-itemLink {
+ background-color: rgba(0, 0, 0, 0);
+ color: rgb(227, 227, 227);
+}
+.spectrum--dark .spectrum-SideNav-itemLink:hover {
+ background-color: rgba(255,255,255,0.07);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-SideNav-itemLink:active {
+ background-color: rgba(255,255,255,0.07);
+ }
+.spectrum--dark .spectrum-SideNav-itemLink.focus-ring {
+ background-color: rgba(255,255,255,0.07);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--dark .spectrum-SideNav-itemLink.focus-ring::before {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-SideNav-heading {
+ color: rgb(185, 185, 185);
+}
+.spectrum--dark .spectrum-IllustratedMessage-illustration {
+ color: rgb(110, 110, 110);
+ fill: currentColor;
+ stroke: currentColor;
+}
+.spectrum--dark .spectrum-DropIndicator {
+ background: rgb(38, 128, 235);
+}
+.spectrum--dark .spectrum-DropIndicator:before,
+ .spectrum--dark .spectrum-DropIndicator:after {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Card {
+ border-color: rgb(62, 62, 62);
+ background-color: rgb(37, 37, 37);
+}
+.spectrum--dark .spectrum-Card:hover {
+ border-color: rgb(90, 90, 90);
+ }
+.spectrum--dark .spectrum-Card.is-selected,
+ .spectrum--dark .spectrum-Card:focus {
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--dark .spectrum-Card.is-drop-target {
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ background-color: rgba(55,142,240,0.15);
+ }
+.spectrum--dark .spectrum-Card-description {
+ color: rgb(185, 185, 185);
+}
+.spectrum--dark .spectrum-Card-coverPhoto {
+ background-color: rgb(62, 62, 62);
+ border-bottom-color: rgb(62, 62, 62);
+}
+.spectrum--dark .spectrum-Card-footer {
+ border-color: rgb(62, 62, 62);
+}
+.spectrum--dark .spectrum-Card--quiet,
+.spectrum--dark .spectrum-Card--gallery {
+ border-color: transparent;
+ background-color: transparent;
+}
+.spectrum--dark .spectrum-Card--quiet .spectrum-Card-preview, .spectrum--dark .spectrum-Card--gallery .spectrum-Card-preview {
+ background-color: rgb(62, 62, 62);
+ }
+.spectrum--dark .spectrum-Card--quiet:hover, .spectrum--dark .spectrum-Card--gallery:hover {
+ border-color: transparent;
+ }
+.spectrum--dark .spectrum-Card--quiet:hover .spectrum-Card-preview, .spectrum--dark .spectrum-Card--gallery:hover .spectrum-Card-preview {
+ background-color: rgb(74, 74, 74);
+ }
+.spectrum--dark .spectrum-Card--quiet.is-selected,
+ .spectrum--dark .spectrum-Card--quiet:focus,
+ .spectrum--dark .spectrum-Card--gallery.is-selected,
+ .spectrum--dark .spectrum-Card--gallery:focus {
+ border-color: transparent;
+ box-shadow: none;
+ }
+.spectrum--dark .spectrum-Card--quiet.is-selected .spectrum-Card-preview, .spectrum--dark .spectrum-Card--quiet:focus .spectrum-Card-preview, .spectrum--dark .spectrum-Card--gallery.is-selected .spectrum-Card-preview, .spectrum--dark .spectrum-Card--gallery:focus .spectrum-Card-preview {
+ background-color: rgb(62, 62, 62);
+ }
+.spectrum--dark .spectrum-Card--quiet.is-selected .spectrum-Card-preview:before, .spectrum--dark .spectrum-Card--quiet:focus .spectrum-Card-preview:before, .spectrum--dark .spectrum-Card--gallery.is-selected .spectrum-Card-preview:before, .spectrum--dark .spectrum-Card--gallery:focus .spectrum-Card-preview:before {
+ border-color: rgb(55, 142, 240);
+ box-shadow: 0 0 0 1px rgb(55, 142, 240);
+ }
+.spectrum--dark .spectrum-Card--quiet.is-drop-target, .spectrum--dark .spectrum-Card--gallery.is-drop-target {
+ border-color: transparent;
+ background-color: transparent;
+ box-shadow: none;
+ }
+.spectrum--dark .spectrum-Card--quiet.is-drop-target .spectrum-Card-preview, .spectrum--dark .spectrum-Card--gallery.is-drop-target .spectrum-Card-preview {
+ background-color: rgba(55,142,240,0.15);
+ }
+.spectrum--dark .spectrum-Card--quiet.is-drop-target .spectrum-Card-preview:before, .spectrum--dark .spectrum-Card--gallery.is-drop-target .spectrum-Card-preview:before {
+ border-color: rgb(55, 142, 240);
+ box-shadow: 0 0 0 1px rgb(55, 142, 240);
+ }
+.spectrum--dark .spectrum-Card--quiet.is-drop-target .spectrum-Asset-folderBackground,
+ .spectrum--dark .spectrum-Card--quiet.is-drop-target .spectrum-Asset-fileBackground,
+ .spectrum--dark .spectrum-Card--gallery.is-drop-target .spectrum-Asset-folderBackground,
+ .spectrum--dark .spectrum-Card--gallery.is-drop-target .spectrum-Asset-fileBackground {
+ fill: rgba(55,142,240,0.15);
+ }
+.spectrum--dark .spectrum-Card--quiet.is-drop-target .spectrum-Asset-folderOutline,
+ .spectrum--dark .spectrum-Card--quiet.is-drop-target .spectrum-Asset-fileOutline,
+ .spectrum--dark .spectrum-Card--gallery.is-drop-target .spectrum-Asset-folderOutline,
+ .spectrum--dark .spectrum-Card--gallery.is-drop-target .spectrum-Asset-fileOutline {
+ fill: rgb(55, 142, 240);
+ }
+.spectrum--dark .spectrum-Card--quiet .spectrum-Card-title, .spectrum--dark .spectrum-Card--gallery .spectrum-Card-title {
+ color: rgb(227, 227, 227);
+ }
+.spectrum--dark .spectrum-Card--quiet .spectrum-Card-subtitle, .spectrum--dark .spectrum-Card--gallery .spectrum-Card-subtitle {
+ color: rgb(185, 185, 185);
+ }
+.spectrum--dark .spectrum-Asset-folderBackground {
+ fill: rgb(74, 74, 74);
+}
+.spectrum--dark .spectrum-Asset-fileBackground {
+ fill: rgb(37, 37, 37);
+}
+.spectrum--dark .spectrum-Asset-folderOutline,
+.spectrum--dark .spectrum-Asset-fileOutline {
+ fill: rgb(110, 110, 110);
+}
diff --git a/css/spectrum-light.css b/css/spectrum-light.css
new file mode 100644
index 0000000..4811035
--- /dev/null
+++ b/css/spectrum-light.css
@@ -0,0 +1,11454 @@
+/* generated from dna-version: 5.8.0 */
+/* generated from dna-version: 5.8.0 */
+.spectrum {
+ font-family: adobe-clean, "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+ font-size: 14px;
+}
+.spectrum:lang(ar) {
+ font-family: myriad-arabic, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+ }
+.spectrum:lang(he) {
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+ }
+.spectrum:lang(zh-Hans) {
+ font-family: adobe-clean-han-japanese, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+ }
+.spectrum:lang(zh) {
+ font-family: adobe-clean-han-japanese, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+ }
+.spectrum:lang(ko) {
+ font-family: adobe-clean-han-japanese, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+ }
+.spectrum:lang(ja) {
+ font-family: adobe-clean-han-japanese, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+ }
+.spectrum-Body1 {
+ font-size: 20px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Body1 em {
+ font-size: 20px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: italic;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Body1 strong {
+ font-size: 20px;
+ font-weight: 700;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Body2,
+.spectrum-Body--large {
+ font-size: 18px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Body2 em,
+.spectrum-Body--large em {
+ font-size: 18px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: italic;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Body2 strong,
+.spectrum-Body--large strong {
+ font-size: 18px;
+ font-weight: 700;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Body3 {
+ font-size: 16px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Body3 em {
+ font-size: 16px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: italic;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Body3 strong {
+ font-size: 16px;
+ font-weight: 700;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Body4,
+.spectrum-Body--secondary {
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Body4 em,
+.spectrum-Body--secondary em {
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: italic;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Body4 strong,
+.spectrum-Body--secondary strong {
+ font-size: 14px;
+ font-weight: 700;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Body5,
+.spectrum-Body--small {
+ font-size: 12px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Body5 em,
+.spectrum-Body--small em {
+ font-size: 12px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: italic;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Body5 strong,
+.spectrum-Body--small strong {
+ font-size: 12px;
+ font-weight: 700;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading1 {
+ font-size: 36px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Heading1 em {
+ font-size: 36px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading1 strong {
+ font-size: 36px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading2 {
+ font-size: 28px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Heading2 em {
+ font-size: 28px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading2 strong {
+ font-size: 28px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading3 {
+ font-size: 22px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Heading3 em {
+ font-size: 22px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading3 strong {
+ font-size: 22px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading4,
+.spectrum-Heading--subtitle1 {
+ font-size: 18px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Heading4 em,
+.spectrum-Heading--subtitle1 em {
+ font-size: 18px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading4 strong,
+.spectrum-Heading--subtitle1 strong {
+ font-size: 18px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading5 {
+ font-size: 16px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Heading5 em {
+ font-size: 16px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading5 strong {
+ font-size: 16px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading6,
+.spectrum-Heading--subtitle2 {
+ font-size: 14px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Heading6 em,
+.spectrum-Heading--subtitle2 em {
+ font-size: 14px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading6 strong,
+.spectrum-Heading--subtitle2 strong {
+ font-size: 14px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Subheading,
+.spectrum-Heading--subtitle3 {
+ font-size: 11px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0.06em;
+ text-transform: uppercase;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Subheading em,
+.spectrum-Heading--subtitle3 em {
+ font-size: 11px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0.06em;
+ text-transform: uppercase;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Subheading strong,
+.spectrum-Heading--subtitle3 strong {
+ font-size: 11px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0.06em;
+ text-transform: uppercase;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Detail {
+ font-size: 11px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.06em;
+ text-transform: uppercase;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Detail em {
+ font-size: 11px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: italic;
+ letter-spacing: 0.06em;
+ text-transform: uppercase;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Detail strong {
+ font-size: 11px;
+ font-weight: 700;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.06em;
+ text-transform: uppercase;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading1--quiet {
+ font-size: 36px;
+ font-weight: 300;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Heading1--quiet em {
+ font-size: 36px;
+ font-weight: 300;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading1--quiet strong {
+ font-size: 36px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading2--quiet,
+.spectrum-Heading--pageTitle {
+ font-size: 28px;
+ font-weight: 300;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Heading2--quiet em,
+.spectrum-Heading--pageTitle em {
+ font-size: 28px;
+ font-weight: 300;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading2--quiet strong,
+.spectrum-Heading--pageTitle strong {
+ font-size: 28px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading1--strong {
+ font-size: 36px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Heading1--strong em {
+ font-size: 36px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading1--strong strong {
+ font-size: 36px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading2--strong {
+ font-size: 28px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Heading2--strong em {
+ font-size: 28px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading2--strong strong {
+ font-size: 28px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading1--display {
+ font-size: 45px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Heading1--display em {
+ font-size: 45px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading1--display strong {
+ font-size: 45px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading2--display {
+ font-size: 40px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Heading2--display em {
+ font-size: 40px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading2--display strong {
+ font-size: 40px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading1--display.spectrum-Heading1--strong {
+ font-size: 45px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Heading1--display.spectrum-Heading1--strong em {
+ font-size: 45px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading1--display.spectrum-Heading1--strong strong {
+ font-size: 45px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading2--display.spectrum-Heading2--strong {
+ font-size: 40px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Heading2--display.spectrum-Heading2--strong em {
+ font-size: 40px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading2--display.spectrum-Heading2--strong strong {
+ font-size: 40px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading1--display.spectrum-Heading1--quiet {
+ font-size: 45px;
+ font-weight: 300;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Heading1--display.spectrum-Heading1--quiet em {
+ font-size: 45px;
+ font-weight: 300;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading1--display.spectrum-Heading1--quiet strong {
+ font-size: 45px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading2--display.spectrum-Heading2--quiet,
+.spectrum-Heading--display {
+ font-size: 40px;
+ font-weight: 300;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Heading2--display.spectrum-Heading2--quiet em,
+.spectrum-Heading--display em {
+ font-size: 40px;
+ font-weight: 300;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Heading2--display.spectrum-Heading2--quiet strong,
+.spectrum-Heading--display strong {
+ font-size: 40px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Typography .spectrum-Body1 {
+ margin-top: 0px;
+ margin-bottom: 16px;
+ }
+.spectrum-Typography .spectrum-Body2,
+.spectrum-Typography .spectrum-Body--large {
+ margin-top: 0px;
+ margin-bottom: 13px;
+ }
+.spectrum-Typography .spectrum-Body3 {
+ margin-top: 0px;
+ margin-bottom: 12px;
+ }
+.spectrum-Typography .spectrum-Body4,
+.spectrum-Typography .spectrum-Body--secondary {
+ margin-top: 0px;
+ margin-bottom: 10px;
+ }
+.spectrum-Typography .spectrum-Body5,
+.spectrum-Typography .spectrum-Body--small {
+ margin-top: 0px;
+ margin-bottom: 9px;
+ }
+.spectrum-Typography .spectrum-Heading1 {
+ margin-top: 32px;
+ margin-bottom: 9px;
+ }
+.spectrum-Typography .spectrum-Heading2 {
+ margin-top: 25px;
+ margin-bottom: 7px;
+ }
+.spectrum-Typography .spectrum-Heading3 {
+ margin-top: 20px;
+ margin-bottom: 6px;
+ }
+.spectrum-Typography .spectrum-Heading4,
+.spectrum-Typography .spectrum-Heading--subtitle1 {
+ margin-top: 16px;
+ margin-bottom: 5px;
+ }
+.spectrum-Typography .spectrum-Heading5 {
+ margin-top: 14px;
+ margin-bottom: 4px;
+ }
+.spectrum-Typography .spectrum-Heading6,
+.spectrum-Typography .spectrum-Heading--subtitle2 {
+ margin-top: 12px;
+ margin-bottom: 3px;
+ }
+.spectrum-Typography .spectrum-Subheading,
+.spectrum-Typography .spectrum-Heading--subtitle3 {
+ margin-top: 12px;
+ margin-bottom: 3px;
+ }
+.spectrum-Typography .spectrum-Detail {
+ margin-top: 0px;
+ margin-bottom: 8px;
+ }
+.spectrum-Typography .spectrum-Heading1--quiet {
+ margin-top: 32px;
+ margin-bottom: 9px;
+ }
+.spectrum-Typography .spectrum-Heading2--quiet,
+.spectrum-Typography .spectrum-Heading--pageTitle {
+ margin-top: 25px;
+ margin-bottom: 7px;
+ }
+.spectrum-Typography .spectrum-Heading1--strong {
+ margin-top: 32px;
+ margin-bottom: 9px;
+ }
+.spectrum-Typography .spectrum-Heading2--strong {
+ margin-top: 25px;
+ margin-bottom: 7px;
+ }
+.spectrum-Typography .spectrum-Heading1--display {
+ margin-top: 40px;
+ margin-bottom: 11px;
+ }
+.spectrum-Typography .spectrum-Heading2--display {
+ margin-top: 36px;
+ margin-bottom: 10px;
+ }
+.spectrum-Typography .spectrum-Heading1--display.spectrum-Heading1--strong {
+ margin-top: 40px;
+ margin-bottom: 11px;
+ }
+.spectrum-Typography .spectrum-Heading2--display.spectrum-Heading2--strong {
+ margin-top: 36px;
+ margin-bottom: 10px;
+ }
+.spectrum-Typography .spectrum-Heading1--display.spectrum-Heading1--quiet {
+ margin-top: 40px;
+ margin-bottom: 11px;
+ }
+.spectrum-Typography .spectrum-Heading2--display.spectrum-Heading2--quiet,
+.spectrum-Typography .spectrum-Heading--display {
+ margin-top: 36px;
+ margin-bottom: 10px;
+ }
+.spectrum-Article {
+ font-family: adobe-clean-serif, 'Source Serif Pro', Georgia, serif;
+}
+.spectrum-Article .spectrum-Body1 {
+ font-size: 20px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Article .spectrum-Body1 em {
+ font-size: 20px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: italic;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Body1 strong {
+ font-size: 20px;
+ font-weight: 900;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Body2,
+.spectrum-Article .spectrum-Body--large {
+ font-size: 18px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Article .spectrum-Body2 em,
+.spectrum-Article .spectrum-Body--large em {
+ font-size: 18px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: italic;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Body2 strong,
+.spectrum-Article .spectrum-Body--large strong {
+ font-size: 18px;
+ font-weight: 900;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Body3 {
+ font-size: 16px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Article .spectrum-Body3 em {
+ font-size: 16px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: italic;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Body3 strong {
+ font-size: 16px;
+ font-weight: 900;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Body4,
+.spectrum-Article .spectrum-Body--secondary {
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Article .spectrum-Body4 em,
+.spectrum-Article .spectrum-Body--secondary em {
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: italic;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Body4 strong,
+.spectrum-Article .spectrum-Body--secondary strong {
+ font-size: 14px;
+ font-weight: 900;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Body5,
+.spectrum-Article .spectrum-Body--small {
+ font-size: 12px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Article .spectrum-Body5 em,
+.spectrum-Article .spectrum-Body--small em {
+ font-size: 12px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: italic;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Body5 strong,
+.spectrum-Article .spectrum-Body--small strong {
+ font-size: 12px;
+ font-weight: 900;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Heading1 {
+ font-size: 36px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Article .spectrum-Heading1 em {
+ font-size: 36px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Heading1 strong {
+ font-size: 36px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Heading2 {
+ font-size: 28px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Article .spectrum-Heading2 em {
+ font-size: 28px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Heading2 strong {
+ font-size: 28px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Heading3 {
+ font-size: 22px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Article .spectrum-Heading3 em {
+ font-size: 22px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Heading3 strong {
+ font-size: 22px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Heading4,
+.spectrum-Article .spectrum-Heading--subtitle1 {
+ font-size: 18px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Article .spectrum-Heading4 em,
+.spectrum-Article .spectrum-Heading--subtitle1 em {
+ font-size: 18px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Heading4 strong,
+.spectrum-Article .spectrum-Heading--subtitle1 strong {
+ font-size: 18px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Heading5 {
+ font-size: 16px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Article .spectrum-Heading5 em {
+ font-size: 16px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Heading5 strong {
+ font-size: 16px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Heading6,
+.spectrum-Article .spectrum-Heading--subtitle2 {
+ font-size: 14px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Article .spectrum-Heading6 em,
+.spectrum-Article .spectrum-Heading--subtitle2 em {
+ font-size: 14px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Heading6 strong,
+.spectrum-Article .spectrum-Heading--subtitle2 strong {
+ font-size: 14px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Subheading,
+.spectrum-Article .spectrum-Heading--subtitle3 {
+ font-size: 11px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Article .spectrum-Subheading em,
+.spectrum-Article .spectrum-Heading--subtitle3 em {
+ font-size: 11px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Subheading strong,
+.spectrum-Article .spectrum-Heading--subtitle3 strong {
+ font-size: 11px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Detail {
+ font-size: 11px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Article .spectrum-Detail em {
+ font-size: 11px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: italic;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Detail strong {
+ font-size: 11px;
+ font-weight: 700;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Heading1--quiet {
+ font-size: 36px;
+ font-weight: 400;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Article .spectrum-Heading1--quiet em {
+ font-size: 36px;
+ font-weight: 400;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Heading1--quiet strong {
+ font-size: 36px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Heading2--quiet,
+.spectrum-Article .spectrum-Heading--pageTitle {
+ font-size: 28px;
+ font-weight: 400;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Article .spectrum-Heading2--quiet em,
+.spectrum-Article .spectrum-Heading--pageTitle em {
+ font-size: 28px;
+ font-weight: 400;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Heading2--quiet strong,
+.spectrum-Article .spectrum-Heading--pageTitle strong {
+ font-size: 28px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Heading1--display {
+ font-size: 45px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Article .spectrum-Heading1--display em {
+ font-size: 45px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Heading1--display strong {
+ font-size: 45px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Heading2--display {
+ font-size: 40px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Article .spectrum-Heading2--display em {
+ font-size: 40px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Heading2--display strong {
+ font-size: 40px;
+ font-weight: 900;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Heading1--display.spectrum-Heading1--quiet {
+ font-size: 45px;
+ font-weight: 400;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Article .spectrum-Heading1--display.spectrum-Heading1--quiet em {
+ font-size: 45px;
+ font-weight: 400;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Heading1--display.spectrum-Heading1--quiet strong {
+ font-size: 45px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Heading2--display.spectrum-Heading2--quiet,
+.spectrum-Article .spectrum-Heading--display {
+ font-size: 40px;
+ font-weight: 400;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum-Article .spectrum-Heading2--display.spectrum-Heading2--quiet em,
+.spectrum-Article .spectrum-Heading--display em {
+ font-size: 40px;
+ font-weight: 400;
+ line-height: 1.3;
+ font-style: italic;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Article .spectrum-Heading2--display.spectrum-Heading2--quiet strong,
+.spectrum-Article .spectrum-Heading--display strong {
+ font-size: 40px;
+ font-weight: 700;
+ line-height: 1.3;
+ font-style: normal;
+ letter-spacing: 0.0125em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Body1, .spectrum:lang(ko) .spectrum-Body1, .spectrum:lang(zh) .spectrum-Body1 {
+ font-size: 20px;
+ font-weight: 400;
+ line-height: 1.7;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum:lang(ja) .spectrum-Body1 em, .spectrum:lang(ko) .spectrum-Body1 em, .spectrum:lang(zh) .spectrum-Body1 em {
+ font-size: 20px;
+ font-weight: 700;
+ line-height: 1.7;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Body1 strong, .spectrum:lang(ko) .spectrum-Body1 strong, .spectrum:lang(zh) .spectrum-Body1 strong {
+ font-size: 20px;
+ font-weight: 900;
+ line-height: 1.7;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Body2,
+.spectrum:lang(ko) .spectrum-Body2,
+.spectrum:lang(zh) .spectrum-Body2,
+.spectrum:lang(ja) .spectrum-Body--large,
+.spectrum:lang(ko) .spectrum-Body--large,
+.spectrum:lang(zh) .spectrum-Body--large {
+ font-size: 18px;
+ font-weight: 400;
+ line-height: 1.7;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum:lang(ja) .spectrum-Body2 em,
+.spectrum:lang(ko) .spectrum-Body2 em,
+.spectrum:lang(zh) .spectrum-Body2 em,
+.spectrum:lang(ja) .spectrum-Body--large em,
+.spectrum:lang(ko) .spectrum-Body--large em,
+.spectrum:lang(zh) .spectrum-Body--large em {
+ font-size: 18px;
+ font-weight: 700;
+ line-height: 1.7;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Body2 strong,
+.spectrum:lang(ko) .spectrum-Body2 strong,
+.spectrum:lang(zh) .spectrum-Body2 strong,
+.spectrum:lang(ja) .spectrum-Body--large strong,
+.spectrum:lang(ko) .spectrum-Body--large strong,
+.spectrum:lang(zh) .spectrum-Body--large strong {
+ font-size: 18px;
+ font-weight: 900;
+ line-height: 1.7;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Body3, .spectrum:lang(ko) .spectrum-Body3, .spectrum:lang(zh) .spectrum-Body3 {
+ font-size: 16px;
+ font-weight: 400;
+ line-height: 1.7;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum:lang(ja) .spectrum-Body3 em, .spectrum:lang(ko) .spectrum-Body3 em, .spectrum:lang(zh) .spectrum-Body3 em {
+ font-size: 16px;
+ font-weight: 700;
+ line-height: 1.7;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Body3 strong, .spectrum:lang(ko) .spectrum-Body3 strong, .spectrum:lang(zh) .spectrum-Body3 strong {
+ font-size: 16px;
+ font-weight: 900;
+ line-height: 1.7;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Body4,
+.spectrum:lang(ko) .spectrum-Body4,
+.spectrum:lang(zh) .spectrum-Body4,
+.spectrum:lang(ja) .spectrum-Body--secondary,
+.spectrum:lang(ko) .spectrum-Body--secondary,
+.spectrum:lang(zh) .spectrum-Body--secondary {
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 1.7;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum:lang(ja) .spectrum-Body4 em,
+.spectrum:lang(ko) .spectrum-Body4 em,
+.spectrum:lang(zh) .spectrum-Body4 em,
+.spectrum:lang(ja) .spectrum-Body--secondary em,
+.spectrum:lang(ko) .spectrum-Body--secondary em,
+.spectrum:lang(zh) .spectrum-Body--secondary em {
+ font-size: 14px;
+ font-weight: 700;
+ line-height: 1.7;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Body4 strong,
+.spectrum:lang(ko) .spectrum-Body4 strong,
+.spectrum:lang(zh) .spectrum-Body4 strong,
+.spectrum:lang(ja) .spectrum-Body--secondary strong,
+.spectrum:lang(ko) .spectrum-Body--secondary strong,
+.spectrum:lang(zh) .spectrum-Body--secondary strong {
+ font-size: 14px;
+ font-weight: 900;
+ line-height: 1.7;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Body5,
+.spectrum:lang(ko) .spectrum-Body5,
+.spectrum:lang(zh) .spectrum-Body5,
+.spectrum:lang(ja) .spectrum-Body--small,
+.spectrum:lang(ko) .spectrum-Body--small,
+.spectrum:lang(zh) .spectrum-Body--small {
+ font-size: 12px;
+ font-weight: 400;
+ line-height: 1.7;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum:lang(ja) .spectrum-Body5 em,
+.spectrum:lang(ko) .spectrum-Body5 em,
+.spectrum:lang(zh) .spectrum-Body5 em,
+.spectrum:lang(ja) .spectrum-Body--small em,
+.spectrum:lang(ko) .spectrum-Body--small em,
+.spectrum:lang(zh) .spectrum-Body--small em {
+ font-size: 12px;
+ font-weight: 700;
+ line-height: 1.7;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Body5 strong,
+.spectrum:lang(ko) .spectrum-Body5 strong,
+.spectrum:lang(zh) .spectrum-Body5 strong,
+.spectrum:lang(ja) .spectrum-Body--small strong,
+.spectrum:lang(ko) .spectrum-Body--small strong,
+.spectrum:lang(zh) .spectrum-Body--small strong {
+ font-size: 12px;
+ font-weight: 900;
+ line-height: 1.7;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading1, .spectrum:lang(ko) .spectrum-Heading1, .spectrum:lang(zh) .spectrum-Heading1 {
+ font-size: 32px;
+ font-weight: 700;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum:lang(ja) .spectrum-Heading1 em, .spectrum:lang(ko) .spectrum-Heading1 em, .spectrum:lang(zh) .spectrum-Heading1 em {
+ font-size: 32px;
+ font-weight: 800;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading1 strong, .spectrum:lang(ko) .spectrum-Heading1 strong, .spectrum:lang(zh) .spectrum-Heading1 strong {
+ font-size: 32px;
+ font-weight: 900;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading2, .spectrum:lang(ko) .spectrum-Heading2, .spectrum:lang(zh) .spectrum-Heading2 {
+ font-size: 25px;
+ font-weight: 700;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum:lang(ja) .spectrum-Heading2 em, .spectrum:lang(ko) .spectrum-Heading2 em, .spectrum:lang(zh) .spectrum-Heading2 em {
+ font-size: 25px;
+ font-weight: 800;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading2 strong, .spectrum:lang(ko) .spectrum-Heading2 strong, .spectrum:lang(zh) .spectrum-Heading2 strong {
+ font-size: 25px;
+ font-weight: 900;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading3, .spectrum:lang(ko) .spectrum-Heading3, .spectrum:lang(zh) .spectrum-Heading3 {
+ font-size: 20px;
+ font-weight: 700;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum:lang(ja) .spectrum-Heading3 em, .spectrum:lang(ko) .spectrum-Heading3 em, .spectrum:lang(zh) .spectrum-Heading3 em {
+ font-size: 20px;
+ font-weight: 800;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading3 strong, .spectrum:lang(ko) .spectrum-Heading3 strong, .spectrum:lang(zh) .spectrum-Heading3 strong {
+ font-size: 20px;
+ font-weight: 900;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading4,
+.spectrum:lang(ko) .spectrum-Heading4,
+.spectrum:lang(zh) .spectrum-Heading4,
+.spectrum:lang(ja) .spectrum-Heading--subtitle1,
+.spectrum:lang(ko) .spectrum-Heading--subtitle1,
+.spectrum:lang(zh) .spectrum-Heading--subtitle1 {
+ font-size: 18px;
+ font-weight: 700;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum:lang(ja) .spectrum-Heading4 em,
+.spectrum:lang(ko) .spectrum-Heading4 em,
+.spectrum:lang(zh) .spectrum-Heading4 em,
+.spectrum:lang(ja) .spectrum-Heading--subtitle1 em,
+.spectrum:lang(ko) .spectrum-Heading--subtitle1 em,
+.spectrum:lang(zh) .spectrum-Heading--subtitle1 em {
+ font-size: 18px;
+ font-weight: 800;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading4 strong,
+.spectrum:lang(ko) .spectrum-Heading4 strong,
+.spectrum:lang(zh) .spectrum-Heading4 strong,
+.spectrum:lang(ja) .spectrum-Heading--subtitle1 strong,
+.spectrum:lang(ko) .spectrum-Heading--subtitle1 strong,
+.spectrum:lang(zh) .spectrum-Heading--subtitle1 strong {
+ font-size: 18px;
+ font-weight: 900;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading5, .spectrum:lang(ko) .spectrum-Heading5, .spectrum:lang(zh) .spectrum-Heading5 {
+ font-size: 16px;
+ font-weight: 700;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum:lang(ja) .spectrum-Heading5 em, .spectrum:lang(ko) .spectrum-Heading5 em, .spectrum:lang(zh) .spectrum-Heading5 em {
+ font-size: 16px;
+ font-weight: 800;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading5 strong, .spectrum:lang(ko) .spectrum-Heading5 strong, .spectrum:lang(zh) .spectrum-Heading5 strong {
+ font-size: 16px;
+ font-weight: 900;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading6,
+.spectrum:lang(ko) .spectrum-Heading6,
+.spectrum:lang(zh) .spectrum-Heading6,
+.spectrum:lang(ja) .spectrum-Heading--subtitle2,
+.spectrum:lang(ko) .spectrum-Heading--subtitle2,
+.spectrum:lang(zh) .spectrum-Heading--subtitle2 {
+ font-size: 14px;
+ font-weight: 700;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum:lang(ja) .spectrum-Heading6 em,
+.spectrum:lang(ko) .spectrum-Heading6 em,
+.spectrum:lang(zh) .spectrum-Heading6 em,
+.spectrum:lang(ja) .spectrum-Heading--subtitle2 em,
+.spectrum:lang(ko) .spectrum-Heading--subtitle2 em,
+.spectrum:lang(zh) .spectrum-Heading--subtitle2 em {
+ font-size: 14px;
+ font-weight: 800;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading6 strong,
+.spectrum:lang(ko) .spectrum-Heading6 strong,
+.spectrum:lang(zh) .spectrum-Heading6 strong,
+.spectrum:lang(ja) .spectrum-Heading--subtitle2 strong,
+.spectrum:lang(ko) .spectrum-Heading--subtitle2 strong,
+.spectrum:lang(zh) .spectrum-Heading--subtitle2 strong {
+ font-size: 14px;
+ font-weight: 900;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Subheading,
+.spectrum:lang(ko) .spectrum-Subheading,
+.spectrum:lang(zh) .spectrum-Subheading,
+.spectrum:lang(ja) .spectrum-Heading--subtitle3,
+.spectrum:lang(ko) .spectrum-Heading--subtitle3,
+.spectrum:lang(zh) .spectrum-Heading--subtitle3 {
+ font-size: 11px;
+ font-weight: 700;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum:lang(ja) .spectrum-Subheading em,
+.spectrum:lang(ko) .spectrum-Subheading em,
+.spectrum:lang(zh) .spectrum-Subheading em,
+.spectrum:lang(ja) .spectrum-Heading--subtitle3 em,
+.spectrum:lang(ko) .spectrum-Heading--subtitle3 em,
+.spectrum:lang(zh) .spectrum-Heading--subtitle3 em {
+ font-size: 11px;
+ font-weight: 800;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Subheading strong,
+.spectrum:lang(ko) .spectrum-Subheading strong,
+.spectrum:lang(zh) .spectrum-Subheading strong,
+.spectrum:lang(ja) .spectrum-Heading--subtitle3 strong,
+.spectrum:lang(ko) .spectrum-Heading--subtitle3 strong,
+.spectrum:lang(zh) .spectrum-Heading--subtitle3 strong {
+ font-size: 11px;
+ font-weight: 900;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Detail, .spectrum:lang(ko) .spectrum-Detail, .spectrum:lang(zh) .spectrum-Detail {
+ font-size: 11px;
+ font-weight: 400;
+ line-height: 1.7;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum:lang(ja) .spectrum-Detail em, .spectrum:lang(ko) .spectrum-Detail em, .spectrum:lang(zh) .spectrum-Detail em {
+ font-size: 11px;
+ font-weight: 700;
+ line-height: 1.7;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Detail strong, .spectrum:lang(ko) .spectrum-Detail strong, .spectrum:lang(zh) .spectrum-Detail strong {
+ font-size: 11px;
+ font-weight: 900;
+ line-height: 1.7;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading1--quiet, .spectrum:lang(ko) .spectrum-Heading1--quiet, .spectrum:lang(zh) .spectrum-Heading1--quiet {
+ font-size: 32px;
+ font-weight: 300;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum:lang(ja) .spectrum-Heading1--quiet em, .spectrum:lang(ko) .spectrum-Heading1--quiet em, .spectrum:lang(zh) .spectrum-Heading1--quiet em {
+ font-size: 32px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading1--quiet strong, .spectrum:lang(ko) .spectrum-Heading1--quiet strong, .spectrum:lang(zh) .spectrum-Heading1--quiet strong {
+ font-size: 32px;
+ font-weight: 700;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading2--quiet,
+.spectrum:lang(ko) .spectrum-Heading2--quiet,
+.spectrum:lang(zh) .spectrum-Heading2--quiet,
+.spectrum:lang(ja) .spectrum-Heading--pageTitle,
+.spectrum:lang(ko) .spectrum-Heading--pageTitle,
+.spectrum:lang(zh) .spectrum-Heading--pageTitle {
+ font-size: 25px;
+ font-weight: 300;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum:lang(ja) .spectrum-Heading2--quiet em,
+.spectrum:lang(ko) .spectrum-Heading2--quiet em,
+.spectrum:lang(zh) .spectrum-Heading2--quiet em,
+.spectrum:lang(ja) .spectrum-Heading--pageTitle em,
+.spectrum:lang(ko) .spectrum-Heading--pageTitle em,
+.spectrum:lang(zh) .spectrum-Heading--pageTitle em {
+ font-size: 25px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading2--quiet strong,
+.spectrum:lang(ko) .spectrum-Heading2--quiet strong,
+.spectrum:lang(zh) .spectrum-Heading2--quiet strong,
+.spectrum:lang(ja) .spectrum-Heading--pageTitle strong,
+.spectrum:lang(ko) .spectrum-Heading--pageTitle strong,
+.spectrum:lang(zh) .spectrum-Heading--pageTitle strong {
+ font-size: 25px;
+ font-weight: 700;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading1--strong, .spectrum:lang(ko) .spectrum-Heading1--strong, .spectrum:lang(zh) .spectrum-Heading1--strong {
+ font-size: 32px;
+ font-weight: 900;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum:lang(ja) .spectrum-Heading1--strong em, .spectrum:lang(ko) .spectrum-Heading1--strong em, .spectrum:lang(zh) .spectrum-Heading1--strong em {
+ font-size: 32px;
+ font-weight: 900;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading1--strong strong, .spectrum:lang(ko) .spectrum-Heading1--strong strong, .spectrum:lang(zh) .spectrum-Heading1--strong strong {
+ font-size: 32px;
+ font-weight: 900;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading2--strong, .spectrum:lang(ko) .spectrum-Heading2--strong, .spectrum:lang(zh) .spectrum-Heading2--strong {
+ font-size: 25px;
+ font-weight: 900;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum:lang(ja) .spectrum-Heading2--strong em, .spectrum:lang(ko) .spectrum-Heading2--strong em, .spectrum:lang(zh) .spectrum-Heading2--strong em {
+ font-size: 25px;
+ font-weight: 900;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading2--strong strong, .spectrum:lang(ko) .spectrum-Heading2--strong strong, .spectrum:lang(zh) .spectrum-Heading2--strong strong {
+ font-size: 25px;
+ font-weight: 900;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading1--display, .spectrum:lang(ko) .spectrum-Heading1--display, .spectrum:lang(zh) .spectrum-Heading1--display {
+ font-size: 40px;
+ font-weight: 700;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum:lang(ja) .spectrum-Heading1--display em, .spectrum:lang(ko) .spectrum-Heading1--display em, .spectrum:lang(zh) .spectrum-Heading1--display em {
+ font-size: 40px;
+ font-weight: 800;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading1--display strong, .spectrum:lang(ko) .spectrum-Heading1--display strong, .spectrum:lang(zh) .spectrum-Heading1--display strong {
+ font-size: 40px;
+ font-weight: 900;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading2--display, .spectrum:lang(ko) .spectrum-Heading2--display, .spectrum:lang(zh) .spectrum-Heading2--display {
+ font-size: 36px;
+ font-weight: 700;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum:lang(ja) .spectrum-Heading2--display em, .spectrum:lang(ko) .spectrum-Heading2--display em, .spectrum:lang(zh) .spectrum-Heading2--display em {
+ font-size: 36px;
+ font-weight: 800;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading2--display strong, .spectrum:lang(ko) .spectrum-Heading2--display strong, .spectrum:lang(zh) .spectrum-Heading2--display strong {
+ font-size: 36px;
+ font-weight: 900;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading1--display.spectrum-Heading1--strong, .spectrum:lang(ko) .spectrum-Heading1--display.spectrum-Heading1--strong, .spectrum:lang(zh) .spectrum-Heading1--display.spectrum-Heading1--strong {
+ font-size: 40px;
+ font-weight: 900;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum:lang(ja) .spectrum-Heading1--display.spectrum-Heading1--strong em, .spectrum:lang(ko) .spectrum-Heading1--display.spectrum-Heading1--strong em, .spectrum:lang(zh) .spectrum-Heading1--display.spectrum-Heading1--strong em {
+ font-size: 40px;
+ font-weight: 900;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading1--display.spectrum-Heading1--strong strong, .spectrum:lang(ko) .spectrum-Heading1--display.spectrum-Heading1--strong strong, .spectrum:lang(zh) .spectrum-Heading1--display.spectrum-Heading1--strong strong {
+ font-size: 40px;
+ font-weight: 900;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading2--display.spectrum-Heading2--strong, .spectrum:lang(ko) .spectrum-Heading2--display.spectrum-Heading2--strong, .spectrum:lang(zh) .spectrum-Heading2--display.spectrum-Heading2--strong {
+ font-size: 36px;
+ font-weight: 900;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum:lang(ja) .spectrum-Heading2--display.spectrum-Heading2--strong em, .spectrum:lang(ko) .spectrum-Heading2--display.spectrum-Heading2--strong em, .spectrum:lang(zh) .spectrum-Heading2--display.spectrum-Heading2--strong em {
+ font-size: 36px;
+ font-weight: 900;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading2--display.spectrum-Heading2--strong strong, .spectrum:lang(ko) .spectrum-Heading2--display.spectrum-Heading2--strong strong, .spectrum:lang(zh) .spectrum-Heading2--display.spectrum-Heading2--strong strong {
+ font-size: 36px;
+ font-weight: 900;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading1--display.spectrum-Heading1--quiet, .spectrum:lang(ko) .spectrum-Heading1--display.spectrum-Heading1--quiet, .spectrum:lang(zh) .spectrum-Heading1--display.spectrum-Heading1--quiet {
+ font-size: 40px;
+ font-weight: 300;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum:lang(ja) .spectrum-Heading1--display.spectrum-Heading1--quiet em, .spectrum:lang(ko) .spectrum-Heading1--display.spectrum-Heading1--quiet em, .spectrum:lang(zh) .spectrum-Heading1--display.spectrum-Heading1--quiet em {
+ font-size: 40px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading1--display.spectrum-Heading1--quiet strong, .spectrum:lang(ko) .spectrum-Heading1--display.spectrum-Heading1--quiet strong, .spectrum:lang(zh) .spectrum-Heading1--display.spectrum-Heading1--quiet strong {
+ font-size: 40px;
+ font-weight: 700;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading2--display.spectrum-Heading2--quiet,
+.spectrum:lang(ko) .spectrum-Heading2--display.spectrum-Heading2--quiet,
+.spectrum:lang(zh) .spectrum-Heading2--display.spectrum-Heading2--quiet,
+.spectrum:lang(ja) .spectrum-Heading--display,
+.spectrum:lang(ko) .spectrum-Heading--display,
+.spectrum:lang(zh) .spectrum-Heading--display {
+ font-size: 36px;
+ font-weight: 300;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+ }
+.spectrum:lang(ja) .spectrum-Heading2--display.spectrum-Heading2--quiet em,
+.spectrum:lang(ko) .spectrum-Heading2--display.spectrum-Heading2--quiet em,
+.spectrum:lang(zh) .spectrum-Heading2--display.spectrum-Heading2--quiet em,
+.spectrum:lang(ja) .spectrum-Heading--display em,
+.spectrum:lang(ko) .spectrum-Heading--display em,
+.spectrum:lang(zh) .spectrum-Heading--display em {
+ font-size: 36px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum:lang(ja) .spectrum-Heading2--display.spectrum-Heading2--quiet strong,
+.spectrum:lang(ko) .spectrum-Heading2--display.spectrum-Heading2--quiet strong,
+.spectrum:lang(zh) .spectrum-Heading2--display.spectrum-Heading2--quiet strong,
+.spectrum:lang(ja) .spectrum-Heading--display strong,
+.spectrum:lang(ko) .spectrum-Heading--display strong,
+.spectrum:lang(zh) .spectrum-Heading--display strong {
+ font-size: 36px;
+ font-weight: 700;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0.05em;
+ text-transform: none;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Code1 {
+ font-size: 20px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ margin-top: 0;
+ margin-bottom: 0;
+ font-family: 'Source Code Pro', Monaco, monospace;
+ }
+.spectrum-Code1 em {
+ font-size: 20px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: italic;
+ letter-spacing: 0;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Code1 strong {
+ font-size: 20px;
+ font-weight: 700;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Code2 {
+ font-size: 18px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ margin-top: 0;
+ margin-bottom: 0;
+ font-family: 'Source Code Pro', Monaco, monospace;
+ }
+.spectrum-Code2 em {
+ font-size: 18px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: italic;
+ letter-spacing: 0;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Code2 strong {
+ font-size: 18px;
+ font-weight: 700;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Code3 {
+ font-size: 16px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ margin-top: 0;
+ margin-bottom: 0;
+ font-family: 'Source Code Pro', Monaco, monospace;
+ }
+.spectrum-Code3 em {
+ font-size: 16px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: italic;
+ letter-spacing: 0;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Code3 strong {
+ font-size: 16px;
+ font-weight: 700;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Code4 {
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ margin-top: 0;
+ margin-bottom: 0;
+ font-family: 'Source Code Pro', Monaco, monospace;
+ }
+.spectrum-Code4 em {
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: italic;
+ letter-spacing: 0;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Code4 strong {
+ font-size: 14px;
+ font-weight: 700;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Code5 {
+ font-size: 12px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ margin-top: 0;
+ margin-bottom: 0;
+ font-family: 'Source Code Pro', Monaco, monospace;
+ }
+.spectrum-Code5 em {
+ font-size: 12px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: italic;
+ letter-spacing: 0;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+.spectrum-Code5 strong {
+ font-size: 12px;
+ font-weight: 700;
+ line-height: 1.5;
+ font-style: normal;
+ letter-spacing: 0;
+ margin-top: 0;
+ margin-bottom: 0;
+
+ }
+/* topdoc
+{{ typography/typography-default.yml }}
+*/
+/* topdoc
+{{ typography/typography-deprecated.yml }}
+*/
+/* topdoc
+{{ typography/typography-article.yml }}
+*/
+/* topdoc
+{{ typography/typography-han.yml }}
+*/
+/* topdoc
+{{ typography/typography-heading.yml }}
+*/
+/* topdoc
+{{ typography/typography-heading-quiet.yml }}
+*/
+/* topdoc
+{{ typography/typography-heading-strong.yml }}
+*/
+/* topdoc
+{{ typography/typography-display.yml }}
+*/
+/* topdoc
+{{ typography/typography-display-quiet.yml }}
+*/
+/* topdoc
+{{ typography/typography-display-strong.yml }}
+*/
+/* topdoc
+{{ typography/typography-body.yml }}
+*/
+/* topdoc
+{{ typography/typography-code.yml }}
+*/
+/*
+ The &.spectrum makes it so users can do
and still get the right font sizes
+ Without this, they would have to do
, which makes no sense
+*/
+.spectrum,
+.spectrum-Body {
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 1.5;
+ font-style: normal;
+}
+.spectrum-Body--italic {
+ font-style: italic;
+}
+.spectrum-Icon {
+ display: inline-block;
+
+ /* Inherit the text color */
+ color: inherit;
+
+ /* Fill should match the current text color */
+ fill: currentColor;
+
+ /* Don't catch clicks or hover, otherwise they may not escape the SVG */
+ pointer-events: none;
+}
+/* Hide the svg overflow in IE. */
+.spectrum-Icon:not(:root) {
+ overflow: hidden;
+ }
+.spectrum-Icon--sizeXXS,
+ .spectrum-Icon--sizeXXS img,
+ .spectrum-Icon--sizeXXS svg {
+ height: 9px;
+ width: 9px;
+ }
+.spectrum-Icon--sizeXS,
+ .spectrum-Icon--sizeXS img,
+ .spectrum-Icon--sizeXS svg {
+ height: 12px;
+ width: 12px;
+ }
+.spectrum-Icon--sizeS,
+ .spectrum-Icon--sizeS img,
+ .spectrum-Icon--sizeS svg {
+ height: 18px;
+ width: 18px;
+ }
+.spectrum-Icon--sizeM,
+ .spectrum-Icon--sizeM img,
+ .spectrum-Icon--sizeM svg {
+ height: 24px;
+ width: 24px;
+ }
+.spectrum-Icon--sizeL,
+ .spectrum-Icon--sizeL img,
+ .spectrum-Icon--sizeL svg {
+ height: 36px;
+ width: 36px;
+ }
+.spectrum-Icon--sizeXL,
+ .spectrum-Icon--sizeXL img,
+ .spectrum-Icon--sizeXL svg {
+ height: 48px;
+ width: 48px;
+ }
+.spectrum-Icon--sizeXXL,
+ .spectrum-Icon--sizeXXL img,
+ .spectrum-Icon--sizeXXL svg {
+ height: 72px;
+ width: 72px;
+ }
+/* Hide UI icons on older browsers with SVG 1.1 implementations */
+.spectrum--medium .spectrum-UIIcon--large {
+ display: none;
+ }
+.spectrum--medium .spectrum-UIIcon--medium {
+ display: inline;
+ }
+.spectrum--large .spectrum-UIIcon--medium {
+ display: none;
+ }
+.spectrum--large .spectrum-UIIcon--large {
+ display: inline;
+ }
+/* Hide UI icons on browsers that implement SVG 2 correctly (Firefox 56+) */
+.spectrum--large {
+ --ui-icon-large-display: block;
+ --ui-icon-medium-display: none;
+}
+.spectrum--medium {
+ --ui-icon-medium-display: block;
+ --ui-icon-large-display: none;
+}
+.spectrum-UIIcon--large {
+ display: var(--ui-icon-large-display);
+}
+.spectrum-UIIcon--medium {
+ display: var(--ui-icon-medium-display);
+}
+/* UI Icons */
+.spectrum-UIIcon-AlertMedium {
+ width: 18px;
+ height: 18px;
+}
+.spectrum-UIIcon-AlertSmall {
+ width: 14px;
+ height: 14px;
+}
+.spectrum-UIIcon-ArrowDownSmall {
+ width: 8px;
+ height: 10px;
+}
+.spectrum-UIIcon-ArrowLeftMedium {
+ width: 14px;
+ height: 10px;
+}
+.spectrum-UIIcon-Asterisk {
+ width: 8px;
+ height: 8px;
+}
+.spectrum-UIIcon-CheckmarkMedium {
+ width: 12px;
+ height: 12px;
+}
+.spectrum-UIIcon-CheckmarkSmall {
+ width: 10px;
+ height: 10px;
+}
+.spectrum-UIIcon-ChevronDownMedium {
+ width: 10px;
+ height: 6px;
+}
+.spectrum-UIIcon-ChevronDownSmall {
+ width: 8px;
+ height: 6px;
+}
+.spectrum-UIIcon-ChevronLeftLarge {
+ width: 12px;
+ height: 16px;
+}
+.spectrum-UIIcon-ChevronLeftMedium {
+ width: 6px;
+ height: 10px;
+}
+.spectrum-UIIcon-ChevronRightLarge {
+ width: 12px;
+ height: 16px;
+}
+.spectrum-UIIcon-ChevronRightMedium {
+ width: 6px;
+ height: 10px;
+}
+.spectrum-UIIcon-ChevronRightSmall {
+ width: 6px;
+ height: 8px;
+}
+.spectrum-UIIcon-ChevronUpSmall {
+ width: 8px;
+ height: 6px;
+}
+.spectrum-UIIcon-CornerTriangle {
+ width: 5px;
+ height: 5px;
+}
+.spectrum-UIIcon-CrossLarge {
+ width: 12px;
+ height: 12px;
+}
+.spectrum-UIIcon-CrossMedium {
+ width: 8px;
+ height: 8px;
+}
+.spectrum-UIIcon-CrossSmall {
+ width: 8px;
+ height: 8px;
+}
+.spectrum-UIIcon-DashSmall {
+ width: 10px;
+ height: 10px;
+}
+.spectrum-UIIcon-DoubleGripper {
+ width: 16px;
+ height: 4px;
+}
+.spectrum-UIIcon-HelpMedium {
+ width: 18px;
+ height: 18px;
+}
+.spectrum-UIIcon-HelpSmall {
+ width: 14px;
+ height: 14px;
+}
+.spectrum-UIIcon-InfoMedium {
+ width: 18px;
+ height: 18px;
+}
+.spectrum-UIIcon-InfoSmall {
+ width: 14px;
+ height: 14px;
+}
+.spectrum-UIIcon-Magnifier {
+ width: 16px;
+ height: 16px;
+}
+.spectrum-UIIcon-SkipLeft {
+ width: 9px;
+ height: 10px;
+}
+.spectrum-UIIcon-SkipRight {
+ width: 9px;
+ height: 10px;
+}
+.spectrum-UIIcon-Star {
+ width: 18px;
+ height: 18px;
+}
+.spectrum-UIIcon-StarOutline {
+ width: 18px;
+ height: 18px;
+}
+.spectrum-UIIcon-SuccessMedium {
+ width: 18px;
+ height: 18px;
+}
+.spectrum-UIIcon-SuccessSmall {
+ width: 14px;
+ height: 14px;
+}
+.spectrum-UIIcon-TripleGripper {
+ width: 10px;
+ height: 7px;
+}
+/* topdoc
+{{ link/link.yml }}
+*/
+.spectrum-Link {
+ /* Remove the gray background on active links in IE 10. */
+ background-color: transparent;
+ /* Remove gaps in links underline in iOS 8+ and Safari 8+. */
+ -webkit-text-decoration-skip: objects;
+ text-decoration: none;
+ transition: color 130ms ease-in-out;
+ outline: none;
+}
+.spectrum-Link:hover {
+ text-decoration: underline;
+ }
+.spectrum-Link.focus-ring {
+ text-decoration: underline;
+ }
+.spectrum-Link.focus-ring {
+ text-decoration: underline;
+ -webkit-text-decoration-style: double;
+ text-decoration-style: double;
+ }
+.spectrum-Link.is-disabled {
+ cursor: default;
+ pointer-events: none;
+ }
+.spectrum-Link.is-disabled:hover,
+ .spectrum-Link.is-disabled:focus {
+ text-decoration: none;
+ }
+.spectrum-Link--subtle,
+/** @deprecated */.spectrum-Link--quiet {
+ text-decoration: underline;
+}
+.spectrum-Link--overBackground {
+ text-decoration: underline;
+}
+/* topdoc
+{{ label/label-default.yml }}
+*/
+.spectrum-Label {
+ display: inline-block;
+ position: relative;
+
+ width: auto;
+
+ padding: 4px 10px;
+
+ border-radius: 4px;
+
+ font-size: 12px;
+ line-height: 1.5;
+
+ cursor: default;
+
+ -webkit-font-smoothing: subpixel-antialiased;
+ -moz-osx-font-smoothing: auto;
+ font-smoothing: subpixel-antialiased;
+}
+/* topdoc
+{{ label/label-large.yml }}
+*/
+.spectrum-Label--large {
+ font-size: 14px;
+ padding: 8px 12px;
+}
+/* topdoc
+{{ label/label-small.yml }}
+*/
+.spectrum-Label--small {
+ font-size: 11px;
+ padding: 3px 7px;
+}
+.spectrum-Breadcrumbs {
+ display: inline-block;
+ list-style-type: none;
+ margin: 0;
+ padding: 0;
+}
+.spectrum-Breadcrumbs:after {
+ content: "";
+ display: table;
+ clear: both;
+ }
+.spectrum-Breadcrumbs-itemSeparator {
+ position: absolute;
+ top: calc(50% - 3px);
+ right: -19px;
+
+ width: 6px;
+ height: 8px;
+
+ transform: scale(1);
+
+ opacity: 1;
+}
+.spectrum-Breadcrumbs-item {
+ display: block;
+ float: left;
+
+ position: relative;
+
+ margin-right: 32px;
+
+ font-size: 16px;
+ font-weight: 300;
+}
+.spectrum-Breadcrumbs-item .spectrum-Breadcrumbs-itemLink {
+ cursor: default;
+ display: inline;
+ }
+.spectrum-Breadcrumbs-item .spectrum-Breadcrumbs-itemLink[href],
+ .spectrum-Breadcrumbs-item .spectrum-Breadcrumbs-itemLink[tabindex="0"] {
+ cursor: pointer;
+ }
+.spectrum-Breadcrumbs-item:last-of-type .spectrum-Breadcrumbs-itemSeparator {
+ display: none;
+ }
+.spectrum-Breadcrumbs--title .spectrum-Breadcrumbs-item:last-of-type {
+ /* Clear the floats so we drop to a new line */
+ clear: left;
+
+ display: block;
+
+ margin: 0.3em 0;
+
+ font-size: 28px;
+ font-weight: 300;
+ line-height: 32px;
+ }
+.spectrum-Breadcrumbs--title .spectrum-Breadcrumbs-item .spectrum-Heading--pageTitle {
+ margin: 0;
+
+ font-size: inherit;
+ font-weight: inherit;
+ }
+:root {
+ /* Todo: fix in DNA, should have been zero */
+}
+.spectrum-Button,
+.spectrum-ActionButton,
+.spectrum-LogicButton,
+.spectrum-FieldButton,
+.spectrum-ClearButton,
+.spectrum-Tool {
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ box-sizing: border-box;
+
+ -ms-flex-align: center;
+
+ align-items: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+
+ /* Show the button overflow in Edge. */
+ overflow: visible;
+
+ /* Remove button the margin in Firefox and Safari. */
+ margin: 0;
+
+ border-style: solid;
+ white-space: nowrap;
+
+ /* Remove the inheritance of text transform on button in Edge, Firefox, and IE. */
+ text-transform: none;
+ -webkit-font-smoothing: antialiased;
+
+ /* Correct the inability to style clickable types in iOS and Safari. */
+ -webkit-appearance: button;
+
+ /* Adjacent buttons should be aligned correctly */
+ vertical-align: top;
+
+ transition: background 130ms ease-out,
+ border-color 130ms ease-out,
+ color 130ms ease-out,
+ box-shadow 130ms ease-out;
+
+ text-decoration: none;
+ font-family: adobe-clean, "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+
+ cursor: pointer;
+}
+.spectrum-Button:focus,
+.spectrum-ActionButton:focus,
+.spectrum-LogicButton:focus,
+.spectrum-FieldButton:focus,
+.spectrum-ClearButton:focus,
+.spectrum-Tool:focus {
+ outline: none;
+ }
+/* Fix Firefox */
+.spectrum-Button::-moz-focus-inner,
+.spectrum-ActionButton::-moz-focus-inner,
+.spectrum-LogicButton::-moz-focus-inner,
+.spectrum-FieldButton::-moz-focus-inner,
+.spectrum-ClearButton::-moz-focus-inner,
+.spectrum-Tool::-moz-focus-inner {
+ border: 0;
+
+ /* Remove the inner border and padding for button in Firefox. */
+ border-style: none;
+ padding: 0;
+
+ /* Use uppercase PX so values don't get converted to rem */
+ margin-top: -2PX;
+ margin-bottom: -2PX;
+ }
+/* Restore the focus styles unset by the previous rule. */
+.spectrum-Button:-moz-focusring,
+.spectrum-ActionButton:-moz-focusring,
+.spectrum-LogicButton:-moz-focusring,
+.spectrum-FieldButton:-moz-focusring,
+.spectrum-ClearButton:-moz-focusring,
+.spectrum-Tool:-moz-focusring {
+ outline: 1px dotted ButtonText;
+ }
+.spectrum-Button:disabled,
+.spectrum-ActionButton:disabled,
+.spectrum-LogicButton:disabled,
+.spectrum-FieldButton:disabled,
+.spectrum-ClearButton:disabled,
+.spectrum-Tool:disabled {
+ cursor: default;
+ }
+.spectrum-Button .spectrum-Icon,
+.spectrum-ActionButton .spectrum-Icon,
+.spectrum-LogicButton .spectrum-Icon,
+.spectrum-FieldButton .spectrum-Icon,
+.spectrum-ClearButton .spectrum-Icon,
+.spectrum-Tool .spectrum-Icon {
+ max-height: 100%;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ }
+.spectrum-Button {
+
+ border-width: 2px;
+ border-style: solid;
+ border-radius: 16px;
+
+ height: 32px;
+ min-width: 72px;
+
+ padding: 0 14px 0;
+
+ font-size: 15px;
+ font-weight: 700;
+
+ /* Prevent vertical text alignment mismatch between anchor and button in Chrome */
+ line-height: 0;
+}
+.spectrum-Button:hover,
+ .spectrum-Button:active {
+ box-shadow: none;
+ }
+.spectrum-Button .spectrum-Icon + .spectrum-Button-label {
+ margin-left: 8px;
+ }
+.spectrum-Button .spectrum-Button-label + .spectrum-Icon {
+ margin-left: 4px;
+ }
+a.spectrum-Button,
+a.spectrum-ActionButton {
+ /* Remove appearance for clickable types in iOS and Safari. */
+ -webkit-appearance: none;
+ /* Make link text not selectable */
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+}
+.spectrum-ActionButton,
+.spectrum-Tool {
+ position: relative;
+
+ height: 32px;
+ min-width: 32px;
+
+ /* Use icon padding by default as it's smaller */
+ padding: 0 6px;
+
+ border-width: 1px;
+ border-radius: 4px;
+
+ font-size: 14px;
+ font-weight: 400;
+}
+.spectrum-ActionButton .spectrum-Icon + .spectrum-ActionButton-label,
+.spectrum-Tool .spectrum-Icon + .spectrum-ActionButton-label {
+ /* Have icon padding on the left */
+ padding-left: 7px;
+
+ /* Have text padding on the right */
+ padding-right: 5px;
+ }
+.spectrum-ActionButton .spectrum-Icon--sizeS:only-child,
+.spectrum-Tool .spectrum-Icon--sizeS:only-child {
+ /* Position absolutely to avoid layout errors introduced by padding */
+ position: absolute;
+ top: calc(50% - 9px);
+ left: calc(50% - 9px);
+ }
+.spectrum-ActionButton .spectrum-ActionButton-label:only-child,
+.spectrum-Tool .spectrum-ActionButton-label:only-child {
+ /* Add padding for text only buttons */
+ padding: 0 5px;
+ }
+.spectrum-ActionButton-hold {
+ position: absolute;
+ right: 3px;
+ bottom: 3px;
+}
+.spectrum-ActionButton-label,
+.spectrum-Button-label {
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-pack: center;
+ justify-content: center;
+ -ms-flex-align: center;
+ align-items: center;
+}
+.spectrum-ActionButton-label:empty, .spectrum-Button-label:empty {
+ display: none;
+ }
+.spectrum-ActionButton--quiet,
+.spectrum-Tool {
+ border-width: 1px;
+ border-radius: 4px;
+
+ font-size: 14px;
+ font-weight: 400;
+}
+.spectrum-LogicButton {
+
+ height: 24px;
+ padding: 8px;
+
+ border-width: 2px;
+ border-radius: 4px;
+
+ font-size: 14px;
+ font-weight: 700;
+ line-height: 0;
+}
+.spectrum-FieldButton {
+
+ height: 32px;
+
+ padding: 0 12px;
+
+ font-family: inherit;
+ font-weight: normal;
+ font-size: 14px;
+ line-height: normal;
+ -webkit-font-smoothing: initial;
+
+ cursor: pointer;
+ outline: none;
+}
+.spectrum-FieldButton {
+ margin: 0;
+ padding: 0 12px;
+
+ border-width: 1px;
+ border-style: solid;
+ border-radius: 4px;
+
+ transition: background-color 130ms,
+ box-shadow 130ms,
+ border-color 130ms;
+}
+.spectrum-FieldButton:disabled,
+ .spectrum-FieldButton.is-disabled {
+ border-width: 0;
+ cursor: default;
+ }
+.spectrum-FieldButton.is-open {
+ border-width: 1px;
+ }
+.spectrum-FieldButton--quiet {
+ margin: 0;
+ padding: 0;
+
+ border-width: 0;
+ border-radius: 0px;
+}
+.spectrum-ClearButton {
+
+ width: 32px;
+ height: 32px;
+
+ border-radius: 100%;
+
+ padding: 0;
+ margin: 0;
+
+ border: none;
+}
+.spectrum-ClearButton--small {
+ width: 24px;
+ height: 24px;
+}
+/* topdoc
+{{ button/tool.yml }}
+*/
+.spectrum-Tool {
+
+ position: relative;
+
+ -ms-flex-pack: center;
+
+ justify-content: center;
+
+ width: 32px;
+ height: 32px;
+
+ padding: 0;
+}
+.spectrum-Tool-hold {
+ position: absolute;
+ right: 3px;
+ bottom: 3px;
+}
+/* Potentially temporary: Add back default margin between all buttons when adjacent */
+.spectrum-Button + .spectrum-Button {
+ margin-left: 16px;
+}
+.spectrum-ActionButton + .spectrum-ActionButton,
+.spectrum-Tool + .spectrum-Tool {
+ margin-left: 8px;
+}
+.spectrum-Tool + .spectrum-Tool {
+ margin-left: 8px;
+}
+/* topdoc
+{{ buttongroup/buttongroup.yml }}
+*/
+.spectrum-ButtonGroup {
+ display: -ms-flexbox;
+ display: flex;
+}
+.spectrum-ButtonGroup .spectrum-Button,
+.spectrum-ButtonGroup .spectrum-ActionButton,
+.spectrum-ButtonGroup .spectrum-Tool {
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ }
+.spectrum-ButtonGroup .spectrum-Button + .spectrum-Button {
+ margin-left: 16px;
+ }
+.spectrum-ButtonGroup .spectrum-ActionButton + .spectrum-ActionButton,
+.spectrum-ButtonGroup .spectrum-Tool + .spectrum-Tool {
+ margin-left: 8px;
+ }
+.spectrum-ButtonGroup .spectrum-Tool + .spectrum-Tool {
+ margin-left: 8px;
+ }
+/* topdoc
+{{ buttongroup/buttongroup-vertical.yml }}
+*/
+.spectrum-ButtonGroup--vertical {
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-direction: column;
+ flex-direction: column;
+}
+.spectrum-ButtonGroup--vertical .spectrum-ActionButton-label {
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+ text-align: left;
+ }
+.spectrum-ButtonGroup--vertical .spectrum-Button + .spectrum-Button {
+ margin-top: 16px;
+ margin-left: 0;
+ }
+.spectrum-ButtonGroup--vertical .spectrum-ActionButton + .spectrum-ActionButton,
+.spectrum-ButtonGroup--vertical .spectrum-Tool + .spectrum-Tool {
+ margin-top: 8px;
+ margin-left: 0;
+ }
+.spectrum-ButtonGroup--vertical .spectrum-Tool + .spectrum-Tool {
+ margin-top: 8px;
+ margin-left: 0;
+ }
+@keyframes pulse {
+ 0% {
+ -webkit-transform: scale(1);
+ opacity: 0;
+ }
+ 50% {
+ -webkit-transform: scale(1.5);
+ opacity: 0.6;
+ }
+ 100% {
+ -webkit-transform: scale(2);
+ opacity: 0;
+ }
+}
+@keyframes pulse--quiet {
+ 0% {
+ -webkit-transform: scale(0.8);
+ opacity: 0;
+ }
+ 50% {
+ -webkit-transform: scale(1.5);
+ opacity: 0.6;
+ }
+ 100% {
+ -webkit-transform: scale(2);
+ opacity: 0;
+ }
+}
+/* topdoc
+{{ coachmark/coachmark.yml }}
+*/
+.spectrum-CoachMarkPopover {
+ position: relative;
+
+ min-width: 272px;
+ max-width: 400px;
+
+ border-radius: 4px;
+ border-width: 1px;
+ border-style: solid;
+
+}
+.spectrum-CoachMarkPopover-image {
+ border-radius: 4px 4px 0 0;
+
+ width: 100%;
+}
+.spectrum-CoachMarkPopover-header,
+.spectrum-CoachMarkPopover-content,
+.spectrum-CoachMarkPopover-footer {
+ padding: 0 24px;
+}
+.spectrum-CoachMarkPopover-header {
+ padding-top: 24px;
+}
+.spectrum-CoachMarkPopover-footer {
+ padding-bottom: 24px;
+}
+.spectrum-CoachMarkPopover-header {
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+ -ms-flex-align: end;
+ align-items: flex-end;
+ margin-bottom: 16px;
+}
+.spectrum-CoachMarkPopover-title {
+ font-size: 16px;
+ font-weight: 700;
+ line-height: 1.3;
+ margin-bottom: 0;
+}
+.spectrum-CoachMarkPopover-step {
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 1.5;
+}
+.spectrum-CoachMarkPopover-content {
+ margin-bottom: 16px;
+}
+.spectrum-CoachMarkPopover-footer {
+ margin-top: 0;
+ text-align: right;
+}
+.spectrum-CoachMarkIndicator {
+ position: relative;
+
+ margin: 6px;
+}
+.spectrum-CoachMarkIndicator-ring {
+ display: block;
+ position: absolute;
+
+ border-style: solid;
+ border-width: 2px;
+ border-radius: 50%;
+}
+.spectrum-CoachMarkIndicator-ring:nth-child(2) {
+ animation-delay: -1980ms;
+ }
+.spectrum-CoachMarkIndicator-ring:nth-child(3) {
+ animation-delay: -3000ms
+ }
+.spectrum-CoachMarkIndicator {
+ min-width: 48px;
+ min-height: 48px;
+}
+.spectrum-CoachMarkIndicator-ring {
+ top: 12px;
+ left: 12px;
+
+ width: 16px;
+ height: 16px;
+ animation: pulse 3000ms linear infinite;
+}
+.spectrum-CoachMarkIndicator-ring:nth-child(1) {
+ animation-delay: -1500ms;
+ }
+.spectrum-CoachMarkIndicator--quiet {
+ min-width: 22px;
+ min-height: 22px;
+}
+.spectrum-CoachMarkIndicator--quiet .spectrum-CoachMarkIndicator-ring {
+ top: 6px;
+ left: 6px;
+
+ width: 8px;
+ height: 8px;
+ animation: pulse--quiet 3000ms linear infinite;
+ }
+.spectrum-CoachMarkIndicator--quiet .spectrum-CoachMarkIndicator-ring:nth-child(1) {
+ animation-delay: -990ms;
+ }
+:root {
+
+ /* DNA */
+}
+/* topdoc
+{{ alert/alert-closeable.yml }}
+*/
+.spectrum-Alert {
+ position: relative;
+
+ display: inline-block;
+ box-sizing: border-box;
+ min-width: 368px;
+ min-height: 38px;
+ margin: 8px 0;
+ padding: 20px 20px;
+
+ border-width: 2px;
+ border-style: solid;
+ border-radius: 4px;
+}
+.spectrum-Alert-icon {
+ position: absolute;
+ display: block;
+ top: 20px;
+ right: 20px;
+}
+.spectrum-Alert-header {
+ display: inline-block;
+ height: auto;
+ min-height: 0;
+ margin: 0;
+ padding: 0;
+
+ /* Leave room for the icon */
+ padding-right: 30px;
+
+ font-size: 14px;
+ font-weight: 700;
+ font-style: normal;
+ line-height: 14px;
+ text-transform: none;
+}
+.spectrum-Alert-content {
+ display: block;
+ margin: 8px 0 0 0;
+ padding: 0;
+
+ font-size: 14px;
+ word-wrap: break-word;
+}
+.spectrum-Alert-footer {
+ display: block;
+
+ text-align: right;
+
+ padding-top: 0.5rem;
+}
+.spectrum-Alert-footer:empty {
+ display: none;
+ }
+.spectrum-Alert-footer .spectrum-Button {
+ margin-right: 0;
+
+ /* Spacing between buttons */
+ margin-left: 0.75rem;
+ }
+/* topdoc
+{{ avatar/avatar-small.yml }}
+*/
+.spectrum-Avatar {
+ width: 16px;
+ height: 16px;
+
+ border-radius: 50%;
+ border-style: none;
+
+ -webkit-user-drag: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+}
+.spectrum-Checkbox {
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-align: center;
+ align-items: center;
+
+ position: relative;
+
+ height: 32px;
+ max-width: 100%;
+
+ margin-right: 16px;
+
+ vertical-align: top;
+}
+.spectrum-Checkbox-input {
+ /* Change the font styles in all browsers for input. */
+ font-family: inherit;
+ font-size: 100%;
+ line-height: 1.15;
+
+ /* Remove the margin for input in Firefox and Safari. */
+ margin: 0;
+
+ /* Show the overflow for input in Edge. */
+ overflow: visible;
+
+ /* Add the correct box sizing for [type="checkbox"] in IE 10-. */
+ box-sizing: border-box;
+
+ /* Remove the padding for [type="checkbox"] in IE 10-. */
+ padding: 0;
+
+ /* Hit area */
+ position: absolute;
+ top: 0;
+ left: -8px;
+ width: calc(100% + 16px);;
+ height: 100%;
+
+ opacity: .0001;
+ z-index: 1;
+
+ cursor: pointer;
+}
+.spectrum-Checkbox-input:disabled {
+ cursor: default;
+ }
+.spectrum-Checkbox-input:checked + .spectrum-Checkbox-box {
+ border-width: 7px;
+ }
+.spectrum-Checkbox-input:checked + .spectrum-Checkbox-box .spectrum-Checkbox-checkmark {
+ transform: scale(1);
+ opacity: 1;
+ }
+.spectrum-Checkbox.is-indeterminate .spectrum-Checkbox-box,
+ .spectrum-Checkbox.is-indeterminate .spectrum-Checkbox-input:checked + .spectrum-Checkbox-box {
+ border-width: 7px;
+ }
+.spectrum-Checkbox.is-indeterminate .spectrum-Checkbox-box .spectrum-Checkbox-checkmark, .spectrum-Checkbox.is-indeterminate .spectrum-Checkbox-input:checked + .spectrum-Checkbox-box .spectrum-Checkbox-checkmark {
+ display: none;
+ }
+.spectrum-Checkbox.is-indeterminate .spectrum-Checkbox-box .spectrum-Checkbox-partialCheckmark, .spectrum-Checkbox.is-indeterminate .spectrum-Checkbox-input:checked + .spectrum-Checkbox-box .spectrum-Checkbox-partialCheckmark {
+ display: block;
+
+ transform: scale(1);
+ opacity: 1;
+ }
+.spectrum-Checkbox-label {
+ margin-left: 10px;
+ font-size: 14px;
+ font-weight: 400;
+ transition: color 130ms ease-in-out;
+
+ white-space: nowrap;
+
+ overflow: hidden;
+ text-overflow: ellipsis;
+}
+.spectrum-Checkbox-box {
+ position: relative;
+ box-sizing: border-box;
+ width: 14px;
+ height: 14px;
+
+ -ms-flex-positive: 0;
+
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+
+ border-radius: 2px;
+ border-width: 2px;
+ border-style: solid;
+
+ transition: border 130ms ease-in-out, box-shadow 130ms ease-in-out;
+}
+.spectrum-Checkbox-checkmark,
+.spectrum-Checkbox-partialCheckmark {
+ position: absolute;
+ top: 50%;
+ left: 50%;
+
+ margin-top: -5px;
+ margin-left: -5px;
+
+ opacity: 0;
+ transform: scale(0);
+
+ transition: opacity 130ms ease-in-out, transform 130ms ease-in-out;
+}
+.spectrum-Checkbox-partialCheckmark {
+ display: none;
+}
+.spectrum-Radio {
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-align: center;
+ align-items: center;
+
+ position: relative;
+
+ height: 32px;
+ max-width: 100%;
+
+ margin-right: 16px;
+
+ vertical-align: top;
+}
+.spectrum-Radio-input {
+ /* Change the font styles in all browsers for input. */
+ font-family: inherit;
+ font-size: 100%;
+ line-height: 1.15;
+
+ /* Remove the margin for input in Firefox and Safari. */
+ margin: 0;
+
+ /* Show the overflow for input in Edge. */
+ overflow: visible;
+
+ /* Add the correct box sizing for [type="radio"] in IE 10-. */
+ box-sizing: border-box;
+
+ /* Remove the padding for [type="radio"] in IE 10-. */
+ padding: 0;
+
+ /* Hit area */
+ position: absolute;
+ top: 0;
+ left: -8px;
+ width: calc(100% + 16px);
+ height: 100%;
+
+ opacity: .0001;
+ z-index: 1;
+
+ cursor: pointer;
+}
+.spectrum-Radio-input:disabled {
+ cursor: default;
+ }
+.spectrum-Radio-input:checked + .spectrum-Radio-button {
+ border-width: 5px;
+ }
+.spectrum-Radio-label {
+ margin-left: 10px;
+ font-size: 14px;
+
+ transition: color 130ms ease-in-out;
+
+ white-space: nowrap;
+
+ overflow: hidden;
+ text-overflow: ellipsis;
+}
+.spectrum-Radio-button {
+ position: relative;
+ box-sizing: border-box;
+ width: 14px;
+ height: 14px;
+
+ -ms-flex-positive: 0;
+
+ flex-grow: 0;
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+
+ border-radius: 7px;
+ border-width: 2px;
+ border-style: solid;
+
+ transition: border 130ms ease-in-out, box-shadow 130ms ease-in-out;
+}
+.spectrum-Radio--labelBelow {
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ -ms-flex-align: center;
+ align-items: center;
+ height: auto;
+}
+.spectrum-Radio--labelBelow .spectrum-Radio-button {
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ }
+.spectrum-Radio--labelBelow .spectrum-Radio-label {
+ margin: 3px 0 0 0;
+ }
+:root {
+ /* Field group */
+}
+/* topdoc
+{{ fieldgroup/fieldgroup-default.yml }}
+*/
+.spectrum-FieldGroup {
+ display: -ms-flexbox;
+ display: flex;
+ vertical-align: top;
+}
+/* topdoc
+{{ fieldgroup/fieldgroup-vertical.yml }}
+*/
+.spectrum-FieldGroup--vertical {
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-direction: column;
+ flex-direction: column;
+}
+/* topdoc
+{{ fieldgroup/fieldgroup-labelsbelow.yml }}
+*/
+:root {
+
+ /* Todo fix in DNA */
+
+ /* Todo: DNA uses incorrect font family "Adobe Clean" */
+}
+.spectrum-Textfield {
+ /* box */
+ box-sizing: border-box;
+ border: 1px solid;
+ border-radius: 4px;
+
+ /* Apply padding by default to center text, giving consistency between input and textfield */
+ padding: 3px 12px 5px 12px;
+ /* Use padding instead of text-indent because text-indent does not left align the text in Edge browser */
+ text-indent: 0;
+
+ min-width: 72px;
+ height: 32px;
+ width: 192px;
+
+ vertical-align: top; /* used to align them correctly in forms. */
+
+ /* Remove the margin for input in Firefox and Safari. */
+ margin: 0;
+
+ /* Show the overflow for input in Edge. */
+ overflow: visible;
+
+ /* Change the input font styles in all browsers */
+ font-family: adobe-clean, Helvetica, Arial, sans-serif;
+ font-size: 14px;
+ line-height: 20px;
+ text-overflow: ellipsis;
+
+ transition: border-color 130ms ease-in-out, box-shadow 130ms ease-in-out;
+
+ outline: none;
+
+ /* removes the native spin buttons in firefox. -mox-appearance: none has no effect */
+ /* http://stackoverflow.com/questions/23372903/hide-spinner-in-input-number-firefox-29 */
+ -moz-appearance: textfield;
+
+ /* Normalize is adding a specific selector that resets this, so be important */
+ -webkit-appearance: none !important;
+}
+.spectrum-Textfield::placeholder {
+ font-weight: 400;
+ font-style: italic;
+ transition: color 130ms ease-in-out;
+ }
+/* added to work with Edge, note, it needs double ::
+ * not single : which is what autoprefixer will add
+ */
+.spectrum-Textfield::-ms-input-placeholder {
+ font-weight: 400;
+ font-style: italic;
+ transition: color 130ms ease-in-out;
+ }
+.spectrum-Textfield:lang(ja)::placeholder, .spectrum-Textfield:lang(zh)::placeholder, .spectrum-Textfield:lang(ko)::placeholder {
+ font-style: normal;
+ }
+.spectrum-Textfield:lang(ja)::-ms-input-placeholder, .spectrum-Textfield:lang(zh)::-ms-input-placeholder, .spectrum-Textfield:lang(ko)::-ms-input-placeholder { /* added to work with Edge, same as above */
+ font-style: normal;
+ }
+.spectrum-Textfield:hover::placeholder {
+ font-weight: 400;
+ }
+.spectrum-Textfield:disabled {
+ /* The opacity must be set to 1 */
+ opacity: 1;
+ }
+.spectrum-Textfield:disabled::placeholder {
+ font-weight: 400;
+ }
+/* http://stackoverflow.com/questions/14007655/remove-ie10s-clear-field-x-button-on-certain-inputs */
+.spectrum-Textfield::-ms-clear {
+ width: 0;
+ height: 0;
+ }
+/* http://stackoverflow.com/questions/23372903/hide-spinner-in-input-number-firefox-29 */
+.spectrum-Textfield::-webkit-inner-spin-button,
+ .spectrum-Textfield::-webkit-outer-spin-button {
+ -webkit-appearance: none;
+ margin: 0;
+ }
+/* removes the red border that appears in Firefox */
+.spectrum-Textfield:-moz-ui-invalid {
+ box-shadow: none;
+ }
+/* removes the native spin buttons */
+.spectrum-Textfield.is-invalid,
+ .spectrum-Textfield:invalid,
+ .spectrum-Textfield.is-valid {
+ background-repeat: no-repeat;
+ }
+/* Remove the native clear button in IE */
+.spectrum-Textfield.is-invalid,
+ .spectrum-Textfield:invalid {
+ background-size: 18px 18px;
+ background-position: calc(100% - 12px) 50%;
+ padding-right: 42px;
+ }
+.spectrum-Textfield.is-valid {
+ background-size: 12px 12px;
+ background-position: calc(100% - 12px) 50%;
+ padding-right: 36px;
+ }
+.spectrum-Textfield--multiline {
+ height: auto;
+ padding: 4px 8px;
+
+ /* Remove the default vertical scrollbar for textarea in IE. */
+ overflow: auto;
+}
+.spectrum-Textfield--multiline.is-invalid,
+ .spectrum-Textfield--multiline:invalid,
+ .spectrum-Textfield--multiline.is-valid {
+ background-position: calc(100% - 9px) calc(100% - 9px);
+ }
+.spectrum-Textfield--quiet {
+ border-radius: 0;
+ border-width: 0 0 1px 0;
+
+ /* removes the side padding to align the text properly */
+ padding-left: 0;
+ padding-right: 0;
+
+ /* Treat all quiet inputs and textareas the same */
+ resize: none;
+ overflow-y: hidden;
+}
+.spectrum-Textfield--quiet.is-invalid,
+ .spectrum-Textfield--quiet:invalid,
+ .spectrum-Textfield--quiet.is-valid {
+ background-position: 100% 50%;
+ }
+/* topdoc
+{{ decoratedtextfield/decoratedtextfield.yml }}
+*/
+.spectrum-DecoratedTextfield {
+ display: inline-block;
+ position: relative;
+}
+.spectrum-DecoratedTextfield-icon {
+ width: 18px;
+ height: 18px;
+
+ position: absolute;
+ bottom: 7px;
+ right: 7px;
+}
+.spectrum-DecoratedTextfield-field {
+ padding-right: 32px;
+}
+/* topdoc
+{{ inputgroup/combobox.yml }}
+*/
+/* topdoc
+{{ inputgroup/combobox-quiet.yml }}
+*/
+/* topdoc
+{{ inputgroup/datepicker.yml }}
+*/
+/* topdoc
+{{ inputgroup/datepicker-quiet.yml }}
+*/
+:root {
+ /* Todo: move to DNA */
+}
+.spectrum-InputGroup {
+ position: relative;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-direction: row;
+ flex-direction: row;
+ -ms-flex-wrap: nowrap;
+ flex-wrap: nowrap;
+ min-width: 192px;
+}
+.spectrum-InputGroup .spectrum-FieldButton {
+ padding: 0 12px;
+ border-top-left-radius: 0;
+ border-bottom-left-radius: 0;
+ }
+.spectrum-InputGroup-field {
+ border-top-right-radius: 0;
+ border-bottom-right-radius: 0;
+ border-right-width: 0;
+ -ms-flex: 1;
+ flex: 1;
+}
+.spectrum-InputGroup--quiet .spectrum-FieldButton {
+ border-radius: 0;
+
+ position: relative;
+ padding-right: 0;
+ border-bottom: 1px solid;
+ }
+/* More hitarea */
+.spectrum-InputGroup--quiet .spectrum-FieldButton:after {
+ content: '';
+ position: absolute;
+ height: 100%;
+ width: 10px;
+ right: -10px;
+ }
+.spectrum-InputGroup--quiet .spectrum-InputGroup-icon {
+ right: 0;
+ }
+.spectrum-Tooltip,
+.spectrum-Underlay,
+.spectrum-Dialog,
+.spectrum-Popover,
+.spectrum-QuickActions {
+ visibility: hidden;
+
+ opacity: 0;
+
+ transition: transform 130ms ease-in-out,
+ opacity 130ms ease-in-out,
+ visibility 0ms linear 130ms;
+
+ pointer-events: none;
+}
+.spectrum-Tooltip.is-open,
+.spectrum-Underlay.is-open,
+.spectrum-Dialog.is-open,
+.spectrum-Popover.is-open,
+.spectrum-QuickActions.is-open {
+ visibility: visible;
+
+ opacity: 1;
+
+ transition-delay: 0ms;
+
+ pointer-events: auto;
+}
+.spectrum-Tooltip--bottom.is-open,
+.spectrum-Popover--bottom.is-open {
+ transform: translateY(6px);
+}
+.spectrum-Tooltip--top.is-open,
+.spectrum-Popover--top.is-open {
+ transform: translateY(-6px);
+}
+.spectrum-Tooltip--right.is-open,
+.spectrum-Popover--right.is-open,
+.spectrum-QuickActions--left.is-open {
+ transform: translateX(6px);
+}
+.spectrum-Tooltip--left.is-open,
+.spectrum-Popover--left.is-open,
+.spectrum-QuickActions--right.is-open {
+ transform: translateX(-6px);
+}
+:root {
+ /* This variable needs to be updated in Spectrum DNA. Using the height variable so it scales to spectrum-large */
+}
+/* topdoc
+{{ tooltip/tooltip.yml }}
+*/
+.spectrum-Tooltip {
+
+ position: relative;
+ left: 0px;
+ top: 0px;
+
+ display: -ms-inline-flexbox;
+
+ display: inline-flex;
+ -ms-flex-direction: row;
+ flex-direction: row;
+ -ms-flex-align: center;
+ align-items: center;
+ box-sizing: border-box;
+
+ vertical-align: top;
+
+ width: auto;
+ padding: 4px 10px;
+ border-radius: 4px;
+ min-height: 24px;
+
+ font-size: 12px;
+ font-weight: 400;
+ line-height: 16px;
+ word-break: break-word;
+ -webkit-font-smoothing: antialiased;
+}
+.spectrum-Tooltip {
+ cursor: default;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ }
+.spectrum-Tooltip-tip {
+ position: absolute;
+
+ height: 0;
+ width: 0;
+
+ border-width: 4px;
+ border-style: solid;
+ border-left-color: transparent;
+ border-right-color: transparent;
+ border-bottom-color: transparent;
+}
+.spectrum-Tooltip--right .spectrum-Tooltip-tip, .spectrum-Tooltip--left .spectrum-Tooltip-tip {
+ top: 50%;
+ margin-top: -4px;
+ }
+.spectrum-Tooltip--right {
+ margin-left: 3px;
+}
+.spectrum-Tooltip--right .spectrum-Tooltip-tip {
+ right: 100%;
+ transform: rotate(90deg);
+ }
+.spectrum-Tooltip--left {
+ margin-right: 3px;
+}
+.spectrum-Tooltip--left .spectrum-Tooltip-tip {
+ left: 100%;
+ transform: rotate(-90deg);
+ }
+.spectrum-Tooltip--top {
+ margin-bottom: 3px;
+}
+.spectrum-Tooltip--top .spectrum-Tooltip-tip {
+ top: 100%;
+ }
+.spectrum-Tooltip--bottom {
+ margin-top: 3px;
+}
+.spectrum-Tooltip--bottom .spectrum-Tooltip-tip {
+ bottom: 100%;
+ transform: rotate(-180deg);
+ }
+.spectrum-Tooltip--bottom .spectrum-Tooltip-tip, .spectrum-Tooltip--top .spectrum-Tooltip-tip {
+ left: 50%;
+ margin-left: -4px;
+ }
+.spectrum-Tooltip-typeIcon {
+ margin-left: -2px;
+ margin-right: 8px;
+ width: 14px;
+ height: 14px;
+ -ms-flex-item-align: start;
+ align-self: flex-start;
+
+ /* Adjusts for weird misalignment */
+ margin-top: 1px;
+}
+.spectrum-Tooltip-label {
+ max-width: 101px;
+
+ /* Make sure line height is correct to prevent problems in Windows */
+ line-height: 16px;
+}
+.u-tooltip-showOnHover {
+ display: inline-block;
+ position: relative;
+}
+.u-tooltip-showOnHover .spectrum-Tooltip {
+ position: absolute;
+ white-space: nowrap;
+ /* Required for animations to work, !important for diff scaling to work */
+ visibility: visible !important;
+ transition: transform 130ms ease-in-out;
+ top: -100%;
+ }
+.u-tooltip-showOnHover .spectrum-Tooltip-label {
+ /* Don't try to wrap as the mechanism used for this helper does not support wrapping */
+ max-width: none;
+ }
+.u-tooltip-showOnHover .spectrum-Tooltip--right,
+ .u-tooltip-showOnHover .spectrum-Tooltip--left {
+ top: 50%;
+ }
+.u-tooltip-showOnHover .spectrum-Tooltip--right .spectrum-Tooltip-tip, .u-tooltip-showOnHover .spectrum-Tooltip--left .spectrum-Tooltip-tip {
+ top: 50%;
+ }
+.u-tooltip-showOnHover .spectrum-Tooltip--right {
+ left: 100%;
+ transform: translate(0, -50%);
+ }
+.u-tooltip-showOnHover .spectrum-Tooltip--left {
+ transform: translate(-100%, -50%);
+ }
+.u-tooltip-showOnHover .spectrum-Tooltip--bottom,
+ .u-tooltip-showOnHover .spectrum-Tooltip--top {
+ left: 50%;
+ }
+.u-tooltip-showOnHover .spectrum-Tooltip--bottom .spectrum-Tooltip-tip, .u-tooltip-showOnHover .spectrum-Tooltip--top .spectrum-Tooltip-tip {
+ left: 50%;
+ }
+.u-tooltip-showOnHover .spectrum-Tooltip--bottom {
+ top: 100%;
+ transform: translate(-50%, -8px);
+ }
+.u-tooltip-showOnHover .spectrum-Tooltip--top {
+ transform: translate(-50%, 8px);
+ }
+.u-tooltip-showOnHover:hover .spectrum-Tooltip {
+ opacity: 1;
+ }
+.u-tooltip-showOnHover:hover .spectrum-Tooltip.spectrum-Tooltip--bottom {
+ transform: translate(-50%, 0);
+ }
+.u-tooltip-showOnHover:hover .spectrum-Tooltip.spectrum-Tooltip--top {
+ transform: translate(-50%, -8px);
+ }
+.u-tooltip-showOnHover:hover .spectrum-Tooltip.spectrum-Tooltip--left {
+ transform: translate(calc(-100% - 8px), -50%);
+ }
+.u-tooltip-showOnHover:hover .spectrum-Tooltip.spectrum-Tooltip--right {
+ transform: translate(8px, -50%);
+ }
+/* topdoc
+{{ barloader/barloader-large.yml }}
+*/
+.spectrum-BarLoader {
+ position: relative;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-flow: row wrap;
+ flex-flow: row wrap;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+ -ms-flex-align: center;
+ align-items: center;
+ width: 192px;
+ vertical-align: top;
+}
+.spectrum-BarLoader-track {
+ /* Visually apply border radius to child elements */
+ overflow: hidden;
+ width: 192px;
+ height: 6px;
+ border-radius: 3px;
+}
+.spectrum-BarLoader-fill {
+ border: none;
+ height: 6px;
+
+ transition: width 1s;
+}
+.spectrum-BarLoader-label,
+.spectrum-BarLoader-percentage {
+ font-size: 12px;
+ font-weight: 400;
+ line-height: 1.3;
+ text-align: left;
+ margin-bottom: 9px;
+
+}
+.spectrum-BarLoader--sideLabel {
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-flow: row;
+ flex-flow: row;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+ width: auto;
+}
+.spectrum-BarLoader--sideLabel .spectrum-BarLoader-label {
+ margin-right: 12px;
+ margin-bottom: 0;
+ }
+.spectrum-BarLoader--sideLabel .spectrum-BarLoader-percentage {
+ -ms-flex-order: 3;
+ order: 3;
+ text-align: right;
+ margin-left: 12px;
+ margin-bottom: 0;
+ }
+/* topdoc
+{{ barloader/barloader-small.yml }}
+*/
+.spectrum-BarLoader--small {
+ height: 4px;
+ min-width: 192px;
+}
+.spectrum-BarLoader--small .spectrum-BarLoader-fill {
+ height: 4px;
+ }
+.spectrum-BarLoader--small .spectrum-BarLoader-track {
+ height: 4px;
+ border-radius: 2px;
+ }
+/* topdoc
+{{ barloader/barloader-large-over-background.yml }}
+*/
+/* topdoc
+{{ barloader/barloader-small-over-background.yml }}
+*/
+/* topdoc
+{{ barloader/barloader-meter.yml }}
+*/
+.spectrum-CircleLoader--indeterminate-fill-submask-2 {
+ animation: 1s infinite linear spectrum-fill-mask-2;
+}
+@keyframes spectrum-fill-mask-1 {
+ 0% {
+ transform: rotate(90deg);
+ }
+
+ 1.69% {
+ transform: rotate(72.3deg);
+ }
+
+ 3.39% {
+ transform: rotate(55.5deg);
+ }
+
+ 5.08% {
+ transform: rotate(40.3deg);
+ }
+
+ 6.78% {
+ transform: rotate(25deg);
+ }
+
+ 8.47% {
+ transform: rotate(10.6deg);
+ }
+
+ 10.17% {
+ transform: rotate(0deg);
+ }
+
+ 11.86% {
+ transform: rotate(0deg);
+ }
+
+ 13.56% {
+ transform: rotate(0deg);
+ }
+
+ 15.25% {
+ transform: rotate(0deg);
+ }
+
+ 16.95% {
+ transform: rotate(0deg);
+ }
+
+ 18.64% {
+ transform: rotate(0deg);
+ }
+
+ 20.34% {
+ transform: rotate(0deg);
+ }
+
+ 22.03% {
+ transform: rotate(0deg);
+ }
+
+ 23.73% {
+ transform: rotate(0deg);
+ }
+
+ 25.42% {
+ transform: rotate(0deg);
+ }
+
+ 27.12% {
+ transform: rotate(0deg);
+ }
+
+ 28.81% {
+ transform: rotate(0deg);
+ }
+
+ 30.51% {
+ transform: rotate(0deg);
+ }
+
+ 32.2% {
+ transform: rotate(0deg);
+ }
+
+ 33.9% {
+ transform: rotate(0deg);
+ }
+
+ 35.59% {
+ transform: rotate(0deg);
+ }
+
+ 37.29% {
+ transform: rotate(0deg);
+ }
+
+ 38.98% {
+ transform: rotate(0deg);
+ }
+
+ 40.68% {
+ transform: rotate(0deg);
+ }
+
+ 42.37% {
+ transform: rotate(5.3deg);
+ }
+
+ 44.07% {
+ transform: rotate(13.4deg);
+ }
+
+ 45.76% {
+ transform: rotate(20.6deg);
+ }
+
+ 47.46% {
+ transform: rotate(29deg);
+ }
+
+ 49.15% {
+ transform: rotate(36.5deg);
+ }
+
+ 50.85% {
+ transform: rotate(42.6deg);
+ }
+
+ 52.54% {
+ transform: rotate(48.8deg);
+ }
+
+ 54.24% {
+ transform: rotate(54.2deg);
+ }
+
+ 55.93% {
+ transform: rotate(59.4deg);
+ }
+
+ 57.63% {
+ transform: rotate(63.2deg);
+ }
+
+ 59.32% {
+ transform: rotate(67.2deg);
+ }
+
+ 61.02% {
+ transform: rotate(70.8deg);
+ }
+
+ 62.71% {
+ transform: rotate(73.8deg);
+ }
+
+ 64.41% {
+ transform: rotate(76.2deg);
+ }
+
+ 66.1% {
+ transform: rotate(78.7deg);
+ }
+
+ 67.8% {
+ transform: rotate(80.6deg);
+ }
+
+ 69.49% {
+ transform: rotate(82.6deg);
+ }
+
+ 71.19% {
+ transform: rotate(83.7deg);
+ }
+
+ 72.88% {
+ transform: rotate(85deg);
+ }
+
+ 74.58% {
+ transform: rotate(86.3deg);
+ }
+
+ 76.27% {
+ transform: rotate(87deg);
+ }
+
+ 77.97% {
+ transform: rotate(87.7deg);
+ }
+
+ 79.66% {
+ transform: rotate(88.3deg);
+ }
+
+ 81.36% {
+ transform: rotate(88.6deg);
+ }
+
+ 83.05% {
+ transform: rotate(89.2deg);
+ }
+
+ 84.75% {
+ transform: rotate(89.2deg);
+ }
+
+ 86.44% {
+ transform: rotate(89.5deg);
+ }
+
+ 88.14% {
+ transform: rotate(89.9deg);
+ }
+
+ 89.83% {
+ transform: rotate(89.7deg);
+ }
+
+ 91.53% {
+ transform: rotate(90.1deg);
+ }
+
+ 93.22% {
+ transform: rotate(90.2deg);
+ }
+
+ 94.92% {
+ transform: rotate(90.1deg);
+ }
+
+ 96.61% {
+ transform: rotate(90deg);
+ }
+
+ 98.31% {
+ transform: rotate(89.8deg);
+ }
+
+ 100% {
+ transform: rotate(90deg);
+ }
+}
+@keyframes spectrum-fill-mask-2 {
+ 0% {
+ transform: rotate(180deg);
+ }
+
+ 1.69% {
+ transform: rotate(180deg);
+ }
+
+ 3.39% {
+ transform: rotate(180deg);
+ }
+
+ 5.08% {
+ transform: rotate(180deg);
+ }
+
+ 6.78% {
+ transform: rotate(180deg);
+ }
+
+ 8.47% {
+ transform: rotate(180deg);
+ }
+
+ 10.17% {
+ transform: rotate(179.2deg);
+ }
+
+ 11.86% {
+ transform: rotate(164deg);
+ }
+
+ 13.56% {
+ transform: rotate(151.8deg);
+ }
+
+ 15.25% {
+ transform: rotate(140.8deg);
+ }
+
+ 16.95% {
+ transform: rotate(130.3deg);
+ }
+
+ 18.64% {
+ transform: rotate(120.4deg);
+ }
+
+ 20.34% {
+ transform: rotate(110.8deg);
+ }
+
+ 22.03% {
+ transform: rotate(101.6deg);
+ }
+
+ 23.73% {
+ transform: rotate(93.5deg);
+ }
+
+ 25.42% {
+ transform: rotate(85.4deg);
+ }
+
+ 27.12% {
+ transform: rotate(78.1deg);
+ }
+
+ 28.81% {
+ transform: rotate(71.2deg);
+ }
+
+ 30.51% {
+ transform: rotate(89.1deg);
+ }
+
+ 32.2% {
+ transform: rotate(105.5deg);
+ }
+
+ 33.9% {
+ transform: rotate(121.3deg);
+ }
+
+ 35.59% {
+ transform: rotate(135.5deg);
+ }
+
+ 37.29% {
+ transform: rotate(148.4deg);
+ }
+
+ 38.98% {
+ transform: rotate(161deg);
+ }
+
+ 40.68% {
+ transform: rotate(173.5deg);
+ }
+
+ 42.37% {
+ transform: rotate(180deg);
+ }
+
+ 44.07% {
+ transform: rotate(180deg);
+ }
+
+ 45.76% {
+ transform: rotate(180deg);
+ }
+
+ 47.46% {
+ transform: rotate(180deg);
+ }
+
+ 49.15% {
+ transform: rotate(180deg);
+ }
+
+ 50.85% {
+ transform: rotate(180deg);
+ }
+
+ 52.54% {
+ transform: rotate(180deg);
+ }
+
+ 54.24% {
+ transform: rotate(180deg);
+ }
+
+ 55.93% {
+ transform: rotate(180deg);
+ }
+
+ 57.63% {
+ transform: rotate(180deg);
+ }
+
+ 59.32% {
+ transform: rotate(180deg);
+ }
+
+ 61.02% {
+ transform: rotate(180deg);
+ }
+
+ 62.71% {
+ transform: rotate(180deg);
+ }
+
+ 64.41% {
+ transform: rotate(180deg);
+ }
+
+ 66.1% {
+ transform: rotate(180deg);
+ }
+
+ 67.8% {
+ transform: rotate(180deg);
+ }
+
+ 69.49% {
+ transform: rotate(180deg);
+ }
+
+ 71.19% {
+ transform: rotate(180deg);
+ }
+
+ 72.88% {
+ transform: rotate(180deg);
+ }
+
+ 74.58% {
+ transform: rotate(180deg);
+ }
+
+ 76.27% {
+ transform: rotate(180deg);
+ }
+
+ 77.97% {
+ transform: rotate(180deg);
+ }
+
+ 79.66% {
+ transform: rotate(180deg);
+ }
+
+ 81.36% {
+ transform: rotate(180deg);
+ }
+
+ 83.05% {
+ transform: rotate(180deg);
+ }
+
+ 84.75% {
+ transform: rotate(180deg);
+ }
+
+ 86.44% {
+ transform: rotate(180deg);
+ }
+
+ 88.14% {
+ transform: rotate(180deg);
+ }
+
+ 89.83% {
+ transform: rotate(180deg);
+ }
+
+ 91.53% {
+ transform: rotate(180deg);
+ }
+
+ 93.22% {
+ transform: rotate(180deg);
+ }
+
+ 94.92% {
+ transform: rotate(180deg);
+ }
+
+ 96.61% {
+ transform: rotate(180deg);
+ }
+
+ 98.31% {
+ transform: rotate(180deg);
+ }
+
+ 100% {
+ transform: rotate(180deg);
+ }
+}
+@keyframes spectrum-fills-rotate {
+ 0% {transform: rotate(-90deg)}
+ 100% {transform: rotate(270deg)}
+}
+/* topdoc
+{{ circleloader/circleloader-medium.yml }}
+*/
+.spectrum-CircleLoader {
+ display: inline-block;
+ width: 32px;
+ height: 32px;
+ position: relative;
+ direction: ltr;
+}
+.spectrum-CircleLoader-track {
+ box-sizing: border-box;
+ width: 32px;
+ height: 32px;
+ border-style: solid;
+ border-width: 3px;
+ border-radius: 32px;
+}
+.spectrum-CircleLoader-fills {
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+}
+.spectrum-CircleLoader-fill {
+ box-sizing: border-box;
+ width: 32px;
+ height: 32px;
+ border-style: solid;
+ border-width: 3px;
+ border-radius: 32px;
+}
+.spectrum-CircleLoader-fillMask1,
+.spectrum-CircleLoader-fillMask2 {
+ width: 50%;
+ height: 100%;
+ transform-origin: 100% center;
+ transform: rotate(180deg);
+ overflow: hidden;
+ position: absolute;
+}
+.spectrum-CircleLoader-fillSubMask1,
+.spectrum-CircleLoader-fillSubMask2 {
+ width: 100%;
+ height: 100%;
+ transform-origin: 100% center;
+ overflow: hidden;
+ transform: rotate(-180deg);
+}
+.spectrum-CircleLoader-fillMask2 {
+ transform: rotate(0deg);
+}
+/* topdoc
+{{ circleloader/circleloader-small.yml }}
+*/
+.spectrum-CircleLoader--small {
+ width: 16px;
+ height: 16px;
+}
+.spectrum-CircleLoader--small .spectrum-CircleLoader-track {
+ width: 16px;
+ height: 16px;
+ border-style: solid;
+ border-width: 2px;
+ border-radius: 16px;
+ }
+.spectrum-CircleLoader--small .spectrum-CircleLoader-fill {
+ width: 16px;
+ height: 16px;
+ border-style: solid;
+ border-width: 2px;
+ border-radius: 16px;
+ }
+/* topdoc
+{{ circleloader/circleloader-large.yml }}
+*/
+.spectrum-CircleLoader--large {
+ width: 64px;
+ height: 64px;
+}
+.spectrum-CircleLoader--large .spectrum-CircleLoader-track {
+ width: 64px;
+ height: 64px;
+ border-style: solid;
+ border-width: 4px;
+ border-radius: 64px;
+ }
+.spectrum-CircleLoader--large .spectrum-CircleLoader-fill {
+ width: 64px;
+ height: 64px;
+ border-style: solid;
+ border-width: 4px;
+ border-radius: 64px;
+ }
+/* topdoc
+{{ circleloader/circleloader-indeterminate-default.yml }}
+*/
+.spectrum-CircleLoader--indeterminate .spectrum-CircleLoader-fills {
+ will-change: transform;
+ transform: translateZ(0);
+ animation: 1s infinite cubic-bezier(.25,.78,.48,.89) spectrum-fills-rotate;
+ transform-origin: center;
+ }
+.spectrum-CircleLoader--indeterminate .spectrum-CircleLoader-fillSubMask1 {
+ will-change: transform;
+ transform: translateZ(0);
+ animation: 1s infinite linear spectrum-fill-mask-1;
+ }
+.spectrum-CircleLoader--indeterminate .spectrum-CircleLoader-fillSubMask2 {
+ will-change: transform;
+ transform: translateZ(0);
+ animation: 1s infinite linear spectrum-fill-mask-2;
+ }
+/* topdoc
+{{ circleloader/circleloader-indeterminate-small.yml }}
+*/
+/* topdoc
+{{ circleloader/circleloader-indeterminate-large.yml }}
+*/
+/* topdoc
+{{ circleloader/circleloader-small-over-background.yml }}
+*/
+/* topdoc
+{{ circleloader/circleloader-medium-over-background.yml }}
+*/
+/* topdoc
+{{ circleloader/circleloader-large-over-background.yml }}
+*/
+/* topdoc
+{{ circleloader/circleloader-indeterminate-over-background.yml }}
+*/
+/* topdoc
+{{ toast/toast.yml }}
+*/
+.spectrum-Toast {
+ box-sizing: border-box;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-direction: row;
+ flex-direction: row;
+ -ms-flex-align: stretch;
+ align-items: stretch;
+
+ border-radius: 4px;
+
+ padding: 8px 8px 8px 16px;
+
+ font-size: 14px;
+ font-weight: 700;
+ -webkit-font-smoothing: antialiased;
+}
+.spectrum-Toast-typeIcon {
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+
+ margin: 7px 12px 7px 0;
+}
+.spectrum-Toast-content {
+ -ms-flex: 1;
+ flex: 1;
+ display: inline-block;
+ box-sizing: border-box;
+ padding: 5px 16px 5px 0;
+ text-align: left;
+}
+.spectrum-Toast-buttons {
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex: 0 0 auto;
+ flex: 0 0 auto;
+ -ms-flex-align: end;
+ align-items: flex-end;
+ -ms-flex-wrap: wrap-reverse;
+ flex-wrap: wrap-reverse;
+}
+.spectrum-Toast-buttons .spectrum-Button + .spectrum-Button,
+ .spectrum-Toast-buttons .spectrum-Button + .spectrum-ClearButton,
+ .spectrum-Toast-buttons .spectrum-ClearButton + .spectrum-Button,
+ .spectrum-Toast-buttons .spectrum-ClearButton + .spectrum-ClearButton {
+ margin-left: 8px;
+ }
+.spectrum-Toast-body {
+ -ms-flex: 1;
+ flex: 1;
+ -ms-flex-item-align: center;
+ -ms-grid-row-align: center;
+ align-self: center;
+}
+.spectrum-Toast-body .spectrum-Button {
+ float: right;
+ margin-right: 11px;
+ }
+.spectrum-Toast-body + .spectrum-Toast-buttons {
+ padding-left: 8px;
+
+ border-left-width: 1px;
+ border-left-style: solid;
+ }
+.spectrum-Underlay {
+
+ position: fixed;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+
+ /* Float above things by default */
+ z-index: 1;
+
+ overflow: hidden;
+}
+:root {
+ /* Distance between top and bottom of dialog and edge of window for fullscreen dialog */
+
+ /* Distance between the edge of the fullscreen dialog and header */
+
+ /* The font-size of the fullscreen dialog header */
+
+ /* The font-weight of the fullscreen dialog header */
+}
+/* topdoc
+{{ dialog/dialog.yml }}
+*/
+.spectrum-Dialog {
+
+ /* Be a flexbox to allow a full sized content area that scrolls */
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-direction: column;
+ flex-direction: column;
+
+ /* Centered by default */
+ position: fixed;
+ left: 50%;
+ top: 50%;
+ transform: translateX(-50%) translateY(-50%) translateY(8px);
+
+ /* Appear above underlay */
+ z-index: 2;
+
+ /* Allow 100% width, taking into account padding */
+ box-sizing: border-box;
+
+ /* Don't be bigger than the screen */
+ max-height: 90%;
+
+ /* Be no bigger than max-width, but also be 90% if the viewport is smaller than max-width */
+ width: -webkit-fit-content;
+ width: -moz-fit-content;
+ width: fit-content;
+ max-width: 90%;
+ min-width: 288px;
+
+ padding: 40px;
+
+ border-radius: 4px;
+ outline: none;
+}
+/* Firefox shows outline */
+.spectrum-Dialog.is-open {
+
+ transform: translate(-50%, -50%);
+ }
+.spectrum-Dialog--alert {
+ /* Smaller dialog for alerts */
+ width: 90%;
+ max-width: 480px;
+}
+.spectrum-Dialog-header {
+ display: -ms-flexbox;
+ display: flex;
+ position: relative;
+ box-sizing: border-box;
+ width: 100%;
+
+ /* Don't get small when the dialog does */
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+
+ border-radius: 4px 4px 0 0;
+ outline: none; /* Hide focus outline around header */
+
+ padding-bottom: 30px;
+}
+/* The rule element */
+.spectrum-Dialog-header::after {
+ position: absolute;
+ bottom: 16px;
+ left: 0;
+ right: 0;
+ content: '';
+
+ height: 2px;
+ }
+.spectrum-Dialog-typeIcon {
+ display: block;
+}
+.spectrum-Dialog-content {
+ display: block;
+ box-sizing: border-box;
+
+ overflow-y: auto;
+ -webkit-overflow-scrolling: touch;
+
+ -ms-flex: 1 1 auto;
+
+ flex: 1 1 auto;
+
+ /* Temporary IE 11 fix */
+ max-height: 70vh;
+
+ outline: none; /* Hide focus outline */
+
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 1.5;
+}
+.spectrum-Dialog-footer {
+ border-radius: 0 0 4px 4px;
+ margin-top: 48px;
+
+ -ms-flex: 0 1 auto;
+
+ flex: 0 1 auto;
+
+ display: -ms-flexbox;
+
+ display: flex;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+
+ outline: none; /* Hide focus outline */
+}
+.spectrum-Dialog-title {
+ -ms-flex: 1 1 auto;
+ flex: 1 1 auto;
+
+ margin: 0;
+
+ font-size: 18px;
+ font-weight: 700;
+ line-height: 1.3;
+
+ /* Truncate text when it's too long to fit */
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+
+ outline: none; /* Hide focus outline */
+}
+.spectrum-Dialog--fullscreen {
+ left: 32px;
+ top: 32px;
+ right: 32px;
+ bottom: 32px;
+
+ transform: translate(0, 8px);
+}
+.spectrum-Dialog--fullscreen.is-open {
+ transform: translate(0, 0);
+ }
+.spectrum-Dialog--fullscreen,
+.spectrum-Dialog--fullscreenTakeover {
+ width: auto;
+ max-height: none;
+ max-width: none;
+
+ padding-top: 30px;
+}
+.spectrum-Dialog--fullscreen .spectrum-Dialog-header, .spectrum-Dialog--fullscreenTakeover .spectrum-Dialog-header {
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ }
+.spectrum-Dialog--fullscreen .spectrum-Dialog-title, .spectrum-Dialog--fullscreenTakeover .spectrum-Dialog-title {
+ font-size: 28px;
+ font-weight: 100;
+ }
+.spectrum-Dialog--fullscreen .spectrum-Dialog-content, .spectrum-Dialog--fullscreenTakeover .spectrum-Dialog-content {
+ max-height: none;
+ }
+.spectrum-Dialog--fullscreenTakeover {
+ position: fixed;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+
+ box-sizing: border-box;
+
+ /* Remove the border since we've taken over */
+ border: none;
+ border-radius: 0;
+}
+.spectrum-Dialog--fullscreenTakeover,
+ .spectrum-Dialog--fullscreenTakeover.is-open {
+ transform: none;
+ }
+.spectrum-Slider,
+.spectrum-Dial {
+ position: relative;
+
+ /* Don't let z-index'd child elements float above other things on the page */
+ z-index: 1;
+ display: block;
+ min-height: 32px;
+ min-width: 128px;
+
+ -webkit-user-select: none;
+
+ -moz-user-select: none;
+
+ -ms-user-select: none;
+
+ user-select: none;
+}
+.spectrum-Slider-controls,
+.spectrum-Dial-controls {
+ display: inline-block;
+ box-sizing: border-box;
+
+ position: relative;
+ z-index: auto;
+
+ /* These calculations prevent the track from spilling outside of the control */
+ width: calc(100% - 16px);
+ margin-left: 8px;
+ min-height: 32px;
+
+ vertical-align: top;
+}
+.spectrum-Slider-track,
+.spectrum-Slider-buffer,
+.spectrum-Slider-ramp {
+ height: 2px;
+ box-sizing: border-box;
+
+ position: absolute;
+ z-index: 1;
+ top: 16px;
+ left: 0;
+ right: auto;
+
+ margin-top: -1px;
+
+ pointer-events: none;
+}
+.spectrum-Slider-track,
+.spectrum-Slider-buffer {
+ padding: 0 4px 0 0;
+ margin-left: -8px;
+}
+.spectrum-Slider-track::before, .spectrum-Slider-buffer::before {
+ content: '';
+ display: block;
+ height: 100%;
+
+ border-radius: 1px;
+ }
+.spectrum-Slider-buffer {
+ padding: 0 4px 0 0;
+}
+.spectrum-Slider-track ~ .spectrum-Slider-track,
+.spectrum-Slider-buffer ~ .spectrum-Slider-buffer {
+ left: auto;
+ right: 0;
+ padding: 0 0 0 4px;
+ margin-left: 0;
+ margin-right: -8px;
+}
+.spectrum-Slider-buffer ~ .spectrum-Slider-buffer {
+ margin-right: 0;
+ padding: 0 0 0 12px;
+}
+.spectrum-Slider-buffer ~ .spectrum-Slider-buffer:after {
+ display: none;
+ }
+.spectrum-Slider--range .spectrum-Slider-value {
+ -webkit-user-select: text;
+ -moz-user-select: text;
+ -ms-user-select: text;
+ user-select: text;
+ }
+.spectrum-Slider--range .spectrum-Slider-track:first-of-type {
+ padding: 0 4px 0 0;
+ left: 0;
+ right: auto;
+ margin-left: -8px;
+ }
+.spectrum-Slider--range .spectrum-Slider-track {
+ padding: 0 12px 0 12px;
+ left: auto;
+ right: auto;
+ margin: 0;
+ }
+.spectrum-Slider--range .spectrum-Slider-track:last-of-type {
+ padding: 0 0 0 4px;
+ left: auto;
+ right: 0;
+ margin-right: -8px;
+ }
+.spectrum-Slider-buffer {
+ /* Appear above track */
+ z-index: 2;
+}
+.spectrum-Slider-ramp {
+ margin-top: 0;
+ height: 16px;
+
+ position: absolute;
+ left: -8px;
+ right: -8px;
+ top: 8px;
+}
+.spectrum-Slider-ramp svg {
+ width: 100%;
+ height: 100%;
+ }
+.spectrum-Slider-handle,
+.spectrum-Dial-handle {
+ position: absolute;
+ left: 0;
+ top: 16px;
+ z-index: 2;
+
+ display: inline-block;
+ box-sizing: border-box;
+
+ width: 16px;
+ height: 16px;
+
+ margin: -8px 0 0 -8px;
+
+ border-width: 2px;
+ border-style: solid;
+
+ border-radius: 8px;
+
+ transition: border-width 130ms ease-in-out;
+
+ outline: none;
+ cursor: pointer;
+ cursor: grab;
+}
+.spectrum-Slider-handle:active,
+.spectrum-Slider-handle.is-focused,
+.spectrum-Slider-handle.is-dragged,
+.spectrum-Dial-handle:active {
+ border-width: 6px;
+ cursor: ns-resize;
+ cursor: grabbing;
+ }
+.spectrum-Slider-handle:active,
+.spectrum-Slider-handle.is-focused,
+.spectrum-Slider-handle.is-dragged,
+.spectrum-Slider-handle.is-tophandle,
+.spectrum-Dial-handle:active {
+ z-index: 3;
+ }
+.spectrum-Slider-input,
+.spectrum-Dial-input {
+ /* Remove the margin for input in Firefox and Safari. */
+ margin: 0;
+
+ width: 16px;
+ height: 16px;
+ padding: 0;
+ position: absolute;
+ top: -2px;
+ left: -2px;
+ overflow: hidden;
+ opacity: .000001;
+ cursor: default;
+ -webkit-appearance: none;
+ border: 0;
+ pointer-events: none;
+}
+.spectrum-Slider-input:focus,
+.spectrum-Dial-input:focus {
+ outline: none;
+ }
+.spectrum-Slider-labelContainer,
+.spectrum-Dial-labelContainer {
+ display: -ms-flexbox;
+ display: flex;
+ position: relative;
+
+ width: auto;
+
+ padding-top: 4px;
+
+ font-size: 12px;
+ line-height: 1.3;
+}
+.spectrum-Slider-label,
+.spectrum-Dial-label {
+ padding-left: 0;
+ -ms-flex-positive: 1;
+ flex-grow: 1;
+}
+.spectrum-Slider-value,
+.spectrum-Dial-value {
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ padding-right: 0;
+ cursor: default;
+}
+.spectrum-Slider-ticks {
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+
+ z-index: 0;
+
+ margin: 0 -8px;
+ margin-top: 11px;
+}
+.spectrum-Slider-tick {
+ position: relative;
+
+ width: 2px;
+}
+.spectrum-Slider-tick:after {
+ display: block;
+ position: absolute;
+ top: 0;
+ left: calc(50% - 1px);
+ content: '';
+ width: 2px;
+ height: 10px;
+
+ border-radius: 1px;
+ }
+.spectrum-Slider-tick .spectrum-Slider-tickLabel {
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-align: center;
+ align-items: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+
+ margin: 16px -16px 0 -16px;
+
+ font-size: 12px;
+ line-height: 1.3;
+ }
+.spectrum-Slider-tick:first-of-type .spectrum-Slider-tickLabel, .spectrum-Slider-tick:last-of-type .spectrum-Slider-tickLabel {
+ display: block;
+ position: absolute;
+ margin: 16px 0 0 0;
+ }
+.spectrum-Slider-tick:first-of-type .spectrum-Slider-tickLabel {
+ left: 0;
+ }
+.spectrum-Slider-tick:last-of-type .spectrum-Slider-tickLabel {
+ right: 0;
+ }
+.spectrum-Slider--color .spectrum-Slider-labelContainer,
+.spectrum-Slider--color .spectrum-Dial-labelContainer {
+ padding-bottom: 5px;
+ }
+.spectrum-Slider--color .spectrum-Slider-controls,
+.spectrum-Slider--color .spectrum-Slider-controls::before,
+.spectrum-Slider--color .spectrum-Slider-track,
+.spectrum-Slider--color .spectrum-Dial-controls,
+.spectrum-Slider--color .spectrum-Dial-controls::before {
+ min-height: auto;
+ height: 24px;
+ margin-left: 0;
+ width: 100%;
+ }
+.spectrum-Slider--color .spectrum-Slider-controls::before,
+.spectrum-Slider--color .spectrum-Dial-controls::before {
+ display: block;
+ content: '';
+ }
+.spectrum-Slider--color .spectrum-Slider-controls::before,
+.spectrum-Slider--color .spectrum-Slider-track,
+.spectrum-Slider--color .spectrum-Dial-controls::before {
+ top: 0;
+ padding: 0;
+ margin-top: 0;
+ margin-right: 0;
+ border-radius: 4px;
+ }
+.spectrum-Slider--color .spectrum-Slider-handle,
+.spectrum-Slider--color .spectrum-Dial-handle {
+ top: 50%;
+ }
+.spectrum-Dial {
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-direction: column;
+ flex-direction: column;
+
+ height: auto;
+ min-width: 0;
+ min-height: 0;
+ width: 48px;
+}
+.spectrum-Dial-labelContainer {
+ margin-bottom: 5px;
+}
+.spectrum-Dial-label:only-child {
+ /* Only center if we don't have a value */
+ text-align: center;
+ }
+.spectrum-Dial-controls {
+ width: 32px;
+ height: 32px;
+ min-height: 0;
+
+ border-radius: 16px;
+ position: relative;
+ display: inline-block;
+ margin: 0;
+
+ box-sizing: border-box;
+ outline: none;
+}
+.spectrum-Dial-controls::before,
+ .spectrum-Dial-controls::after {
+ content: '';
+ width: 4px;
+ height: 2px;
+ border-radius: 1px;
+ position: absolute;
+ bottom: 0;
+ }
+.spectrum-Dial-controls::before {
+ left: auto;
+ right: -2px;
+ transform: rotate(45deg);
+ }
+.spectrum-Dial-controls::after {
+ left: -2px;
+ transform: rotate(-45deg);
+ }
+.spectrum-Dial-handle {
+ width: 100%;
+ height: 100%;
+ border-width: 2px;
+ box-shadow: none;
+ position: absolute;
+ top: 8px;
+ left: 8px;
+ right: 8px;
+ bottom: 8px;
+ border-radius: 16px;
+ transform: rotate(-45deg);
+ cursor: pointer;
+ cursor: grab;
+
+ transition: background-color 130ms ease-in-out;
+}
+.spectrum-Dial-handle::after {
+ content: '';
+ position: absolute;
+ top: 50%;
+ left: -2px;
+ width: 12px;
+ height: 2px;
+ border-radius: 1px;
+ transform: translateY(-50%);
+ transition: background-color 130ms ease-in-out;
+ }
+.spectrum-Dial-handle:active,
+ .spectrum-Dial-handle.is-focused,
+ .spectrum-Dial-handle.is-dragged {
+ border-width: 2px;
+ cursor: ns-resize;
+ cursor: grabbing;
+ }
+.spectrum-Dial-input {
+ width: 100%;
+ height: 100%;
+ left: 0;
+ top: 0;
+}
+.spectrum-Dial--small .spectrum-Dial-controls {
+ width: 24px;
+ height: 24px;
+ }
+.spectrum-Slider.is-disabled, .spectrum-Dial.is-disabled {
+ cursor: default;
+ }
+.spectrum-Slider.is-disabled .spectrum-Slider-handle,
+.spectrum-Dial.is-disabled .spectrum-Slider-handle,
+.spectrum-Slider.is-disabled .spectrum-Dial-handle,
+.spectrum-Dial.is-disabled .spectrum-Dial-handle {
+ cursor: default;
+ pointer-events: none;
+ }
+.spectrum-Slider.is-disabled.spectrum-Slider--color .spectrum-Slider-handle:hover,
+.spectrum-Slider.is-disabled.spectrum-Slider--color .spectrum-Slider-handle:active,
+.spectrum-Dial.is-disabled.spectrum-Slider--color .spectrum-Slider-handle:hover,
+.spectrum-Dial.is-disabled.spectrum-Slider--color .spectrum-Slider-handle:active,
+.spectrum-Slider.is-disabled.spectrum-Slider--color .spectrum-Dial-handle:hover,
+.spectrum-Slider.is-disabled.spectrum-Slider--color .spectrum-Dial-handle:active,
+.spectrum-Dial.is-disabled.spectrum-Slider--color .spectrum-Dial-handle:hover,
+.spectrum-Dial.is-disabled.spectrum-Slider--color .spectrum-Dial-handle:active {
+ border-width: 1px;
+ }
+.u-isGrabbing {
+ cursor: ns-resize;
+ cursor: grabbing;
+
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+}
+.u-isGrabbing .spectrum-Dial .spectrum-Dial-label,
+ .u-isGrabbing .spectrum-Dial .spectrum-Dial-value {
+ cursor: inherit;
+ }
+.u-isGrabbing .spectrum-Slider .spectrum-Slider-label,
+.u-isGrabbing .spectrum-Slider .spectrum-Slider-value,
+.u-isGrabbing .spectrum-Dial .spectrum-Slider-label,
+.u-isGrabbing .spectrum-Dial .spectrum-Slider-value {
+ cursor: inherit;
+ }
+.spectrum-Tabs {
+ display: -ms-flexbox;
+ display: flex;
+
+ /* Contain the selection indicator */
+ position: relative;
+ z-index: 0;
+
+ margin: 0;
+ padding: 0 8px;
+
+ /* Friends should align to the top of the tabs */
+ vertical-align: top;
+}
+.spectrum-Tabs-item {
+ /* Contain the focus ring */
+ position: relative;
+
+ box-sizing: border-box;
+
+ height: 46px;
+ line-height: 46px;
+
+ /* Float above the tab line */
+ z-index: 1;
+
+ text-decoration: none;
+ white-space: nowrap;
+
+ transition: color 130ms ease-out;
+ cursor: pointer;
+ outline: none;
+}
+.spectrum-Tabs-item.is-disabled {
+ cursor: default;
+ }
+.spectrum-Tabs-item.is-disabled .spectrum-Tabs-itemLabel {
+ cursor: default;
+ }
+.spectrum-Tabs-item .spectrum-Icon {
+ /* Vertical centering */
+ height: 46px;
+ }
+.spectrum-Tabs-item .spectrum-Icon + .spectrum-Tabs-itemLabel {
+ /* icons are inexplicably offset by 3px. Subtract this value from the icon-gap
+ to correct the gap in CSS */
+ margin-left: 5px;
+ }
+.spectrum-Tabs-item::before {
+ content: '';
+ position: absolute;
+ top: 50%;
+
+ box-sizing: border-box;
+
+ height: 32px;
+ margin-top: -15px;
+ left: -8px;
+ right: -8px;
+ border: 2px solid transparent;
+ border-radius: 5px;
+
+ pointer-events: none;
+ }
+.spectrum-Tabs-itemLabel {
+ cursor: pointer;
+ vertical-align: top;
+ display: inline-block;
+
+ font-size: 14px;
+ font-weight: 400;
+}
+.spectrum-Tabs-itemLabel:empty {
+ /* Hide the tab label if it's not being used */
+ display: none;
+ }
+.spectrum-Tabs-selectionIndicator {
+ position: absolute;
+ left: 0;
+
+ /* Be below the tab */
+ z-index: 0;
+
+ transition: transform 130ms ease-in-out;
+ transform-origin: top left;
+
+ border-radius: 1px;
+}
+.spectrum-Tabs--compact .spectrum-Tabs-item {
+ height: 30px;
+ line-height: 30px;
+ }
+.spectrum-Tabs--compact .spectrum-Tabs-item .spectrum-Icon {
+ /* Vertical centering */
+ height: 30px;
+ }
+.spectrum-Tabs--horizontal {
+ -ms-flex-align: center;
+ align-items: center;
+
+ border-bottom: 2px solid;
+}
+.spectrum-Tabs--horizontal .spectrum-Tabs-item {
+ vertical-align: top;
+ }
+/* Target anything since React likes to add lots of happy
s around all things */
+.spectrum-Tabs--horizontal .spectrum-Tabs-item + *:not(.spectrum-Tabs-selectionIndicator) {
+ margin-left: 24px;
+ }
+.spectrum-Tabs--horizontal .spectrum-Tabs-selectionIndicator {
+ position: absolute;
+ bottom: 0;
+ height: 2px;
+
+ bottom: -2px;
+ }
+.spectrum-Tabs--horizontal.spectrum-Tabs--compact {
+ /* The ActionButton is taller than the tabs, so don't push tabs around */
+ box-sizing: content-box;
+ height: 30px;
+ -ms-flex-align: end;
+ align-items: end;
+ }
+/* Quiet tabs should not extend all the way across the screen as their line doesn't */
+.spectrum-Tabs--quiet {
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+}
+.spectrum-Tabs--vertical {
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ padding: 0;
+ border-left: 2px solid;
+}
+.spectrum-Tabs--vertical .spectrum-Tabs-item {
+ height: 44px;
+ padding: 0 8px;
+ /* Subtract focus ring padding from margin-left since the padding value already offsets tabs-items */
+ margin-left: 4px;
+ margin-bottom: 4px;
+ }
+.spectrum-Tabs--vertical .spectrum-Tabs-item::before {
+ /* padding is included in click area of tab items, so only need to offset by the size of the focus ring's border */
+ left: -2px;
+ right: -2px;
+ margin-top: -16px;
+ }
+.spectrum-Tabs--vertical.spectrum-Tabs--compact .spectrum-Tabs-item {
+ height: 32px;
+ line-height: 32px;
+ margin-bottom: 4px;
+ }
+.spectrum-Tabs--vertical.spectrum-Tabs--compact .spectrum-Tabs-item .spectrum-Icon {
+ /* Vertical centering */
+ height: 32px;
+ }
+.spectrum-Tabs--vertical .spectrum-Tabs-selectionIndicator {
+ position: absolute;
+ left: 0px;
+ width: 2px;
+
+ left: -2px;
+ }
+/* topdoc
+{{ tabs/tabs-toomany.yml }}
+*/
+:root {
+ /* The width of a step */
+
+ /* The diameter of the marker */
+
+ /* The width of the hit area */
+
+ /* The height of the line */
+
+ /* This gives enough space for one line of text */
+
+ /* This gives enough space for the longest possible label */
+
+ /* Offset from the BOTTOM of the steplist */
+
+ /* Font size of the label */
+}
+/* topdoc
+{{ steplist/steplist-default.yml }}
+*/
+.spectrum-Steplist {
+ /* Contain child elements with positive z-index */
+ z-index: 0;
+ position: relative;
+
+ display: block;
+ vertical-align: top;
+ margin: 0;
+ padding-top: 22px;
+ padding-left: 60px;
+ padding-right: 60px;
+
+ text-align: center;
+ white-space: nowrap;
+ font-size: 0; /* To remove html whitespace between inline elements */
+ line-height: 16px; /* in case the container changes it */
+}
+.spectrum-Steplist--interactive .spectrum-Steplist-label,
+ .spectrum-Steplist--interactive .spectrum-Steplist-markerContainer {
+ /* Show cursor on hit zone when clickable */
+ cursor: pointer;
+ }
+/* Small (w/o label or tooltip) */
+.spectrum-Steplist--small {
+ padding: 11px 0;
+}
+.spectrum-Steplist--small .spectrum-Steplist-item {
+ padding: 0 40px 0 0;
+ width: 80px;
+ }
+/* Disable Label */
+.spectrum-Steplist--small .spectrum-Steplist-item .spectrum-Steplist-label {
+ display: none;
+ }
+.spectrum-Steplist--small .spectrum-Steplist-item:first-child, .spectrum-Steplist--small .spectrum-Steplist-item:last-child {
+ width: 20px;
+ }
+/* Disable first line */
+.spectrum-Steplist--small .spectrum-Steplist-item:first-child .spectrum-Steplist-markerContainer {
+ margin-left: -10px;
+ }
+.spectrum-Steplist--small .spectrum-Steplist-item:last-child .spectrum-Steplist-markerContainer {
+ margin-right: -10px;
+ }
+.spectrum-Steplist-item {
+ outline: none;
+ position: relative;
+ display: inline-block;
+ margin: 0;
+
+ /* Don't let tooltips mess up alignment */
+ vertical-align: bottom;
+
+ box-sizing: content-box;
+ width: 80px;
+ padding: 0 40px 0 0;
+}
+/* Completed State */
+.spectrum-Steplist-item.is-complete .spectrum-Steplist-marker {
+ border: none;
+ }
+/* The next step's line should be solid */
+.spectrum-Steplist-item.is-complete + .spectrum-Steplist-item .spectrum-Steplist-segment {
+ border-bottom-width: 2px;
+ border-bottom-style: solid;
+ }
+/* Selected state */
+/* Focus */
+.spectrum-Steplist-item.is-selected:focus {
+ outline: none;
+ }
+.spectrum-Steplist-item.is-selected .spectrum-Steplist-marker {
+ border: none;
+ }
+/* topdoc
+{{ steplist/steplist-label.yml }}
+*/
+.spectrum-Steplist-label {
+ position: absolute;
+ left: 50%;
+ bottom: 10px;
+
+ display: block;
+ width: 120px;
+
+ font-size: 12px;
+ white-space: normal;
+
+ transform: translateX(-50%);
+}
+.spectrum-Steplist-markerContainer {
+ display: block;
+
+ z-index: 2;
+ position: absolute;
+ bottom: -10px;
+ left: 50%;
+
+ width: 20px;
+ height: 20px;
+
+ margin-left: -10px;
+}
+/* Circle step marker */
+.spectrum-Steplist-marker {
+ box-sizing: border-box; /* So we can stroke nicely */
+ display: block;
+
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ margin-top: -4px;
+ margin-left: -4px;
+
+ width: 8px;
+ height: 8px;
+
+ border-radius: 8px;
+
+ border: 2px solid;
+ border-color: transparent;
+ background: transparent;
+}
+/* Step line */
+.spectrum-Steplist-segment {
+ display: block;
+ z-index: 1;
+ position: absolute;
+ right: 68px;
+
+ box-sizing: content-box;
+ width: 104px;
+ bottom: -1px;
+
+ /* Default is dashed */
+ border-bottom-width: 2px;
+ border-bottom-style: dashed;
+}
+/* First step overrides */
+.spectrum-Steplist-item:first-child .spectrum-Steplist-markerContainer {
+ left: 0;
+ }
+.spectrum-Steplist-item:first-child .spectrum-Steplist-label {
+ left: 0;
+ }
+.spectrum-Steplist-item:first-child .spectrum-Steplist-segment {
+ /* Not visible for first step */
+ display: none;
+ }
+/* Last step overrides */
+.spectrum-Steplist-item:last-child .spectrum-Steplist-label {
+ left: auto;
+ right: 0;
+
+ transform: translateX(50%);
+ }
+.spectrum-Steplist-item:last-child .spectrum-Steplist-markerContainer {
+ left: auto;
+ right: 0;
+
+ margin-left: 0;
+ margin-right: -10px;
+ }
+.spectrum-Steplist-item:last-child .spectrum-Steplist-segment {
+ right: 8px;
+ left: auto;
+ }
+.spectrum-Steplist-item:first-child,
+.spectrum-Steplist-item:last-child {
+ width: 20px;
+}
+/* Single step */
+.spectrum-Steplist-item:only-child .spectrum-Steplist-label {
+ /* Be centered */
+ left: 50%;
+
+ /* Override last-child bits */
+ transform: translate(-50%);
+ }
+.spectrum-Steplist-item:only-child .spectrum-Steplist-markerContainer {
+ /* Be centered */
+ left: 50%;
+
+ /* Override last-child bits */
+ margin-right: 0;
+ margin-left: -10px;
+ }
+/* topdoc
+{{ steplist/steplist-tooltip.yml }}
+*/
+/* topdoc
+{{ toggle/toggle-onoffdefault.yml }}
+*/
+.spectrum-ToggleSwitch {
+ display: inline-block;
+ position: relative;
+ font-size: 0;
+ height: 32px;
+ line-height: 32px;
+}
+.spectrum-ToggleSwitch-input {
+ /* Change the font styles in all browsers for input. */
+ font-family: inherit;
+ font-size: 100%;
+ line-height: 1.15;
+
+ /* Remove the margin for input in Firefox and Safari. */
+ margin: 0;
+
+ /* Show the overflow for input in Edge. */
+ overflow: visible;
+
+ /* Add the correct box sizing for [type="checkbox"] in IE 10-. */
+ box-sizing: border-box;
+
+ /* Remove the padding for [type="checkbox"] in IE 10-. */
+ padding: 0;
+
+ position: absolute;
+ width: 100%;
+ height: 100%;
+ top: 0;
+ left: 0;
+ opacity: .0001;
+ z-index: 1;
+
+ cursor: pointer;
+}
+.spectrum-ToggleSwitch-input:checked + .spectrum-ToggleSwitch-switch::after {
+ transform: translateX(12px);
+ }
+.spectrum-ToggleSwitch-input:disabled,
+ .spectrum-ToggleSwitch-input[disabled] {
+ cursor: default;
+ }
+.spectrum-ToggleSwitch-label {
+ margin: 0 10px;
+ font-size: 14px;
+ vertical-align: middle;
+ transition: color 160ms ease-in-out;
+}
+.spectrum-ToggleSwitch-switch {
+ display: inline-block;
+ /* positions the pseudo elements relative to this one */
+ position: relative;
+
+ height: 14px;
+ width: 26px;
+
+ vertical-align: middle;
+}
+.spectrum-ToggleSwitch-switch::before,
+ .spectrum-ToggleSwitch-switch::after {
+ display: block;
+ position: absolute;
+ content: "";
+ box-sizing: border-box;
+ }
+/* ::before is used for the track of the switch */
+.spectrum-ToggleSwitch-switch::before {
+ transition: background 130ms ease-in-out, border 130ms ease-in-out;
+
+ height: 14px;
+
+ left: 0;
+ right: 0;
+
+ border-radius: 7px;
+ }
+/* ::after is used for the handle of the switch */
+.spectrum-ToggleSwitch-switch::after {
+ transition: background 130ms ease-in-out, border 130ms ease-in-out, transform 130ms ease-in-out, box-shadow 130ms ease-in-out;
+
+ width: 14px;
+ height: 14px;
+
+ top: 0;
+ left: 0;
+
+ border-width: 2px;
+ border-radius: 7px;
+ border-style: solid;
+ }
+/* topdoc
+{{ toggle/toggle-abdefault.yml }}
+*/
+.spectrum-Menu {
+ display: inline-block;
+
+ box-sizing: border-box;
+
+ margin: 4px 0;
+ padding: 0;
+
+ list-style-type: none;
+
+ overflow: auto;
+}
+.spectrum-Menu > .spectrum-Menu-sectionHeading {
+ /* Support headings as LI */
+ margin-top: 3px;
+ margin-bottom: 3px;
+ }
+.spectrum-Menu.is-selectable .spectrum-Menu-item {
+ padding-right: 32px;
+ }
+.spectrum-Menu.is-selectable .spectrum-Menu-item.is-selected {
+ padding-right: 11px;
+ }
+.spectrum-Menu-checkmark {
+ transform: scale(1);
+ opacity: 1;
+}
+.spectrum-Menu-item {
+ cursor: pointer;
+ position: relative;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-align: center;
+ align-items: center;
+
+ box-sizing: border-box;
+
+ padding: 7px 12px 7px 10px;
+
+ margin: 0;
+
+ border-left: 2px solid transparent;
+
+ min-height: 32px;
+
+ font-size: 14px;
+ font-weight: 400;
+ font-style: normal;
+}
+.spectrum-Menu-item:focus {
+ outline: none;
+ }
+.spectrum-Menu-item.is-selected {
+ /* Redundant, but included for backwards compatibility */
+ padding-right: 11px;
+ }
+.spectrum-Menu-item.is-selected .spectrum-Menu-checkmark {
+ display: block;
+ }
+.spectrum-Menu-item .spectrum-Icon {
+ /* Don't get smaller, you're an icon! */
+ -ms-flex-negative: 0;
+ flex-shrink: 0;
+ }
+.spectrum-Menu-item .spectrum-Icon + .spectrum-Menu-itemLabel {
+ margin-left: 8px;
+ }
+.spectrum-Menu-itemLabel {
+ -ms-flex: 1 1 0px;
+ flex: 1 1 0;
+}
+.spectrum-Menu-itemLabel--wrapping {
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ overflow: hidden;
+}
+.spectrum-Menu-checkmark {
+ display: none;
+ -ms-flex-item-align: start;
+ align-self: flex-start;
+ margin-top: 4px;
+}
+.spectrum-Menu-checkmark,
+.spectrum-Menu-chevron {
+ -ms-flex-positive: 0;
+ flex-grow: 0;
+ margin-left: 12px;
+}
+.spectrum-Menu-divider {
+ /* Add the correct box sizing for hr in Firefox. */
+ box-sizing: content-box;
+
+ /* Show the overflow for hr in Edge and IE. */
+ overflow: visible;
+
+ height: 2px;
+ margin: 1.5px 12px;
+ padding: 0 0;
+ border: none;
+}
+.spectrum-Menu-sectionHeading {
+ display: block;
+ margin: 6px 0 0 0;
+ padding: 0 36px 0 12px;
+
+ font-size: 11px;
+ font-weight: 400;
+ line-height: 20px;
+ text-transform: uppercase;
+ letter-spacing: 0.06em;
+}
+.spectrum-Menu .spectrum-Menu {
+ /* Fill parent menu when nested */
+ display: block;
+}
+/* topdoc
+{{ dropdown/dropdown.yml }}
+*/
+.spectrum-Dropdown {
+ position: relative;
+ display: inline-block;
+
+ /* Truncate if menu options make us too wide */
+ max-width: 100%;
+ width: 192px;
+ min-width: 48px;
+}
+/* Hack to enable select-powered Dropdowns */
+.spectrum-Dropdown select {
+ -webkit-appearance: none;
+ -moz-appearance: none;
+ appearance: none;
+ -ms-appearance: none;
+ }
+/* Edge */
+.spectrum-Dropdown select::-ms-expand {
+ display: none;
+ }
+.spectrum-Dropdown select::-ms-value {
+ background-color: transparent;
+ }
+.spectrum-Dropdown select + .spectrum-Dropdown-icon {
+ position: absolute;
+ right: 12px;
+ top: 50%;
+ margin-top: -3px;
+ }
+.spectrum-Dropdown-trigger {
+ position: relative;
+ width: 100%;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-pack: justify;
+ justify-content: space-between;
+ -ms-flex-align: center;
+ align-items: center;
+}
+.spectrum-Dropdown-label {
+ /* Be the biggest! */
+ -ms-flex: 1;
+ flex: 1;
+
+ white-space: nowrap;
+ overflow: hidden;
+
+ height: 30px;
+ line-height: 30px;
+
+ font-size: 14px;
+
+ text-overflow: ellipsis;
+ text-align: left;
+}
+.spectrum-Dropdown-label.is-placeholder {
+ font-weight: 400;
+ font-style: italic;
+ transition: color 130ms ease-in-out;
+ }
+/* Only apply margin to the icon if there's a label */
+.spectrum-Dropdown-label + .spectrum-Dropdown-icon {
+ margin-left: 12px;
+}
+.spectrum-Icon + .spectrum-Dropdown-label {
+ margin-left: 8px;
+}
+/* Only apply margin if there's a label */
+.spectrum-Dropdown-label ~ .spectrum-Dropdown-icon {
+ margin-left: 12px;
+}
+.spectrum-Dropdown-icon {
+ display: inline-block;
+ position: relative;
+ vertical-align: top;
+ transition: color 130ms ease-out;
+
+ /* Fix Safari 10 bug where align-items is ignored inside of buttons */
+ margin-top: 12px;
+ margin-bottom: 12px;
+
+ opacity: 1;
+}
+/* Error icons */
+.spectrum-Dropdown-trigger .spectrum-Icon:not(.spectrum-Dropdown-icon) {
+ /* Fix Safari 10 bug where align-items is ignored inside of buttons */
+ margin-top: 6px;
+ margin-bottom: 6px;
+ }
+.spectrum-Dropdown-trigger .spectrum-Dropdown-label + .spectrum-Icon:not(.spectrum-Dropdown-icon) {
+ margin-left: 12px;
+ }
+.spectrum-Icon + .spectrum-Dropdown-icon {
+ margin-left: 8px;
+}
+/* topdoc
+{{ dropdown/dropdown-quiet.yml }}
+*/
+.spectrum-Dropdown--quiet {
+ width: auto;
+ min-width: 48px;
+}
+.spectrum-Dropdown-popover {
+ max-width: 240px;
+}
+.spectrum-Dropdown-popover--quiet {
+ margin-left: -13px;
+}
+/* topdoc
+{{ dropzone/dropzone.yml }}
+*/
+.spectrum-Dropzone {
+ text-align: center;
+ border-width: 2px;
+ border-radius: 4px;
+ padding: 72px;
+ border-style: dashed;
+}
+.spectrum-Dropzone.is-dragged {
+ border-style: solid;
+ }
+.spectrum-Dropzone:focus {
+ outline: 0;
+ border-style: dashed;
+ }
+.spectrum-Dropzone:focus.focus-ring {
+ border-style: solid;
+ }
+/* topdoc
+{{ popover/popover.yml }}
+*/
+.spectrum-Popover {
+
+ /* Be a flexbox to allow a full sized content area that scrolls */
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ box-sizing: border-box;
+
+ min-width: 32px;
+ min-height: 32px;
+
+ position: absolute;
+
+ border-style: solid;
+ border-width: 1px;
+ border-radius: 4px;
+
+ outline: none;
+}
+/* Hide focus outline */
+.spectrum-Popover-tip {
+ position: absolute;
+ /* This hides half of the tooltip, but it also crops the shadow slightly, which is undesireable */
+ overflow: hidden;
+ width: 21px;
+ height: 11px;
+}
+.spectrum-Popover-tip::after {
+ content: '';
+ width: 20px;
+ height: 20px;
+ border-width: 1px;
+ border-style: solid;
+ position: absolute;
+ transform: rotate(45deg);
+ top: -18px;
+ left: -1px;
+ }
+.spectrum-Popover--dialog {
+ min-width: 270px;
+ padding: 30px 29px;
+}
+/* topdoc
+{{ popover/popover-dialog.yml }}
+*/
+.spectrum-Popover--left.spectrum-Popover--withTip {
+ margin-right: 13px;
+ }
+.spectrum-Popover--left .spectrum-Popover-tip {
+ right: -16px;
+ transform: rotate(-90deg);
+ }
+.spectrum-Popover--right.spectrum-Popover--withTip {
+ margin-left: 13px;
+ }
+.spectrum-Popover--right .spectrum-Popover-tip {
+ left: -16px;
+ transform: rotate(90deg);
+ }
+/* Center the tip by default */
+.spectrum-Popover--left .spectrum-Popover-tip, .spectrum-Popover--right .spectrum-Popover-tip {
+ top: 50%;
+ margin-top: -6px;
+ }
+.spectrum-Popover--bottom.spectrum-Popover--withTip {
+ margin-top: 13px;
+ }
+.spectrum-Popover--bottom .spectrum-Popover-tip {
+ top: -11px;
+ transform: rotate(180deg);
+ }
+.spectrum-Popover--top.spectrum-Popover--withTip {
+ margin-bottom: 13px;
+ }
+.spectrum-Popover--top .spectrum-Popover-tip {
+ bottom: -11px;
+ }
+/* Center the tip by default */
+.spectrum-Popover--bottom .spectrum-Popover-tip, .spectrum-Popover--top .spectrum-Popover-tip {
+ left: 50%;
+ margin-left: -12px;
+ }
+/* topdoc
+{{ splitbutton/splitbutton-cta.yml }}
+*/
+/* topdoc
+{{ splitbutton/splitbutton-primary.yml }}
+*/
+/* topdoc
+{{ splitbutton/splitbutton-secondary.yml }}
+*/
+.spectrum-SplitButton {
+ position: relative;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-direction: row;
+ flex-direction: row;
+ vertical-align: top;
+}
+/* Spacing for buttons placed inline */
+.spectrum-SplitButton + .spectrum-SplitButton,
+ .spectrum-SplitButton + .spectrum-Button {
+ margin-left: 12px;
+ }
+/* Spacing for buttons placed inline */
+.spectrum-Button + .spectrum-SplitButton {
+ margin-left: 12px;
+}
+.spectrum-SplitButton-action {
+ margin-left: 0;
+
+ border-radius: 16px 0 0 16px;
+}
+/* CTA is special and doesn't have a border between the buttons */
+.spectrum-SplitButton-action.spectrum-Button--cta {
+ border-right: 0;
+ margin-right: 2px;
+ }
+.spectrum-SplitButton-action + .spectrum-SplitButton-trigger {
+ /* Override button + button style */
+ margin-left: 0;
+ }
+.spectrum-SplitButton-trigger {
+ margin-left: 0;
+
+ border-radius: 0 16px 16px 0;
+ border-left-width: 0;
+
+ padding-left: 8.00004px;
+ padding-right: 10px;
+
+ min-width: 0;
+}
+.spectrum-SplitButton-trigger.focus-ring {
+ box-shadow: none;
+ }
+.spectrum-SplitButton-icon {
+ display: block;
+ margin-top: 1px;
+}
+.spectrum-SplitButton-action,
+.spectrum-SplitButton-trigger {
+ position: relative;
+}
+.spectrum-SplitButton-action:focus, .spectrum-SplitButton-trigger:focus {
+ /* Be on top when focused or border leaks */
+ z-index: 1;
+ }
+.spectrum-SplitButton-action .spectrum-Button-label + .spectrum-Icon {
+ margin-left: 12px;
+ }
+.spectrum-SplitButton--left .spectrum-SplitButton-action {
+ border-radius: 0 16px 16px 0;
+ margin-right: 0;
+ margin-left: 0;
+ }
+/* CTA is special and doesn't have a border between the buttons */
+.spectrum-SplitButton--left .spectrum-SplitButton-action.spectrum-Button--cta {
+ border-left: 0;
+ margin-left: 2px;
+ }
+.spectrum-SplitButton--left .spectrum-SplitButton-trigger {
+ margin-right: 0;
+
+ border-radius: 16px 0 0 16px;
+
+ border-left-width: 2px;
+ border-right-width: 0;
+
+ padding-right: 8.00004px;
+ padding-left: 10px;
+ }
+/* https://git.corp.adobe.com/Spectrum/spectrum-origins/pull/60 */
+:root {
+
+ /* Subtract the size of the border since it's on the item itself */
+}
+/* topdoc
+{{ accordion/accordion.yml }}
+*/
+.spectrum-Accordion {
+ display: block;
+ list-style: none;
+ padding: 0;
+ margin: 0;
+}
+.spectrum-Accordion-itemIndicator {
+ display: block;
+
+ position: absolute;
+ left: 16px;
+ top: 14.5px;
+
+ transition: transform ease 130ms;
+}
+.spectrum-Accordion-item {
+ z-index: inherit;
+ position: relative;
+
+ display: list-item;
+ margin: 0;
+
+ border-bottom: 1px solid transparent;
+}
+.spectrum-Accordion-item:first-of-type {
+ border-top: 1px solid transparent;
+ }
+.spectrum-Accordion-itemHeader {
+ position: relative;
+
+ box-sizing: border-box;
+ /* left padding takes into account the icon's size as well as the focus state's left border */
+ padding: 0 16px 0 34px;
+ margin: 0;
+
+ height: 39px;
+
+ font-size: 11px;
+ text-transform: uppercase;
+ line-height: 39px;
+ letter-spacing: 0.0006em;
+
+ text-overflow: ellipsis;
+ cursor: pointer;
+ font-weight: 500;
+}
+.spectrum-Accordion-itemHeader:focus {
+ outline: none;
+ }
+.spectrum-Accordion-itemHeader:focus::after {
+ content: '';
+
+ position: absolute;
+ left: 0;
+ top: -1px;
+ bottom: -1px;
+
+ width: 2px;
+ }
+.spectrum-Accordion-itemContent {
+ padding: 0 16px 16px 16px;
+ display: none;
+}
+.spectrum-Accordion-item.is-open > .spectrum-Accordion-itemIndicator {
+ transform: rotate(90deg);
+ }
+.spectrum-Accordion-item.is-open > .spectrum-Accordion-itemHeader::after {
+ /* No bottom border when open, so be less tall */
+ height: 39px;
+ }
+.spectrum-Accordion-item.is-open > .spectrum-Accordion-itemContent {
+ display: block;
+ }
+.spectrum-Accordion-item.is-disabled .spectrum-Accordion-itemHeader {
+ cursor: default;
+ }
+/* topdoc
+{{ actionmenu/actionmenu.yml }}
+*/
+.spectrum-Well {
+ display: block;
+ min-width: 248px;
+ padding: 16px;
+ margin-top: 4px;
+ border-width: 1px;
+ border-style: solid;
+ border-radius: 4px;
+}
+/* topdoc
+{{ fieldlabel/fieldlabel.yml }}
+*/
+/* topdoc
+{{ fieldlabel/fieldlabel-required.yml }}
+*/
+.spectrum-FieldLabel,
+.spectrum-Form-itemLabel {
+ display: block;
+
+ box-sizing: border-box;
+
+ padding: 4px 0 5px;
+
+ font-size: 12px;
+ font-weight: 400;
+ line-height: 1.3;
+
+ vertical-align: top;
+
+ -webkit-font-smoothing: subpixel-antialiased;
+ -moz-osx-font-smoothing: auto;
+ font-smoothing: subpixel-antialiased;
+}
+.spectrum-FieldLabel-requiredIcon {
+ margin: 4px 0 0 2px;
+}
+/* topdoc
+{{ fieldlabel/fieldlabel-left.yml }}
+*/
+.spectrum-FieldLabel--left {
+ display: inline-block;
+ padding: 8px 8px 0 0;
+}
+.spectrum-FieldLabel--left .spectrum-FieldLabel-requiredIcon {
+ margin: 0px 0 0 2px;
+ }
+/* topdoc
+{{ fieldlabel/fieldlabel-right.yml }}
+*/
+.spectrum-FieldLabel--right {
+ display: inline-block;
+ text-align: right;
+ padding: 8px 8px 0 0;
+}
+/* topdoc
+{{ form/index.yml }}
+*/
+.spectrum-Form {
+ display: table;
+ border-collapse: separate;
+ border-spacing: 0 24px;
+ margin: -20px 0;
+}
+.spectrum-Form-item {
+ display: table-row;
+}
+.spectrum-Form-itemLabel {
+ display: table-cell;
+}
+.spectrum-Form-itemField {
+ display: table-cell;
+}
+/* topdoc
+{{ search/search.yml }}
+*/
+/* topdoc
+{{ search/search-quiet.yml }}
+*/
+.spectrum-Search {
+ display: inline-block;
+ position: relative;
+}
+.spectrum-Search .spectrum-ClearButton {
+ position: absolute;
+ right: 0;
+ top: 0;
+ }
+.spectrum-Search-input {
+ display: block;
+
+ /* Correct the odd appearance of input[type="search"] in Chrome and Safari.*/
+ /* This gets overridden by .spectrum-Textfield */
+ -webkit-appearance: textfield;
+
+ /* Correct the outline for input[type="search"] style in Safari. */
+ outline-offset: -2px;
+
+ /* Use padding instead of text-indent so long strings don't overlap the icon */
+ padding-left: 36px;
+ text-indent: 0;
+
+ /* Don't let long strings overlap the close icon */
+ padding-right: 28px;
+}
+/* Remove the inner padding and cancel buttons for input[type="search"] in Chrome and Safari on macOS. */
+.spectrum-Search-input::-webkit-search-cancel-button,
+ .spectrum-Search-input::-webkit-search-decoration {
+ -webkit-appearance: none;
+ }
+.spectrum-Search-input.spectrum-Textfield--quiet {
+ padding-left: 24px;
+ padding-right: 20px;
+ }
+/* Since quiet button has no left padding, push the icon all the way to the left */
+.spectrum-Search-input.spectrum-Textfield--quiet ~ .spectrum-Search-icon {
+ left: 0;
+ }
+.spectrum-Search-input.spectrum-Textfield--quiet ~ .spectrum-Search-clear {
+ right: -8px;
+ }
+/* Since quiet button has no right padding, push the icon all the way to the right */
+.spectrum-Search-input.spectrum-Textfield--quiet ~ .spectrum-Search-rightIcon {
+ right: 0;
+ }
+.spectrum-Search-icon {
+ display: block;
+ position: absolute;
+ left: 12px;
+ top: 8px;
+
+ pointer-events: none;
+}
+.spectrum-Stepper {
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-direction: row-reverse;
+ flex-direction: row-reverse;
+ -ms-flex-wrap: nowrap;
+ flex-wrap: nowrap;
+
+ width: 192px;
+ line-height: 0;
+ border-radius: 4px;
+ transition: border-color 130ms ease-in-out, box-shadow 130ms ease-in-out;
+}
+.spectrum-Stepper::before {
+ content: '';
+}
+.spectrum-Stepper-buttons {
+ display: block;
+ border-radius: 4px 0 0 4px;
+ transition: box-shadow 130ms ease-in-out;
+}
+.spectrum-Stepper-stepUp,
+.spectrum-Stepper-stepDown {
+ position: relative;
+ display: block;
+
+ height: 16px;
+ width: 24px;
+
+ padding-left: 6px;
+ padding-right: 6px;
+
+ /* Avoid margin added by adjacent buttons */
+ margin: 0 !important;
+
+ border-width: 1px;
+ border-right-width: 0;
+ border-radius: 4px 0 0 4px;
+}
+.spectrum-Stepper-stepUp .spectrum-Icon, .spectrum-Stepper-stepDown .spectrum-Icon {
+ margin: 0 !important;
+ opacity: 1;
+ }
+.spectrum-Stepper-stepUp {
+ border-bottom: none;
+ border-bottom-left-radius: 0;
+}
+.spectrum-Stepper-stepUp .spectrum-Icon {
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+ bottom: 3px;
+ }
+.spectrum-Stepper-stepDown {
+ border-top: none;
+ border-top-left-radius: 0;
+ border-bottom-width: 1px;
+}
+.spectrum-Stepper-stepDown:focus {
+ border-top: none;
+ }
+.spectrum-Stepper-stepDown .spectrum-Icon {
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+ top: 3px;
+ }
+.spectrum-Stepper-input {
+ position: relative;
+
+ -ms-flex: 1;
+
+ flex: 1;
+
+ border-top-left-radius: 0;
+ border-bottom-left-radius: 0;
+
+ z-index: 1;
+}
+.spectrum-Stepper--quiet {
+ border-radius: 0;
+}
+.spectrum-Stepper--quiet .spectrum-Stepper-buttons .spectrum-ActionButton,
+.spectrum-Stepper--quiet .spectrum-Stepper-buttons .spectrum-Tool {
+ border-top: none;
+ border-left: none;
+ border-radius: 0;
+ }
+/* topdoc
+{{ calendar/calendar.yml }}
+*/
+/* topdoc
+{{ calendar/calendar-disabled.yml }}
+*/
+/* topdoc
+{{ calendar/calendar-focused.yml }}
+*/
+/* topdoc
+{{ calendar/calendar-range.yml }}
+*/
+.spectrum-Calendar {
+ display: inline-block;
+}
+.spectrum-Calendar--padded {
+ margin: 32px 24px;
+}
+.spectrum-Calendar-header {
+ position: relative;
+ box-sizing: border-box;
+ width: 100%;
+ height: 32px;
+}
+.spectrum-Calendar-title {
+ position: absolute;
+ left: 0;
+ top: 0;
+
+ font-size: 18px;
+ font-weight: bold;
+
+ box-sizing: border-box;
+ width: 100%;
+ line-height: 32px;
+ margin: 0;
+ padding: 0 32px;
+
+ text-align: center;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+}
+.spectrum-Calendar-prevMonth,
+.spectrum-Calendar-nextMonth {
+ position: absolute;
+
+}
+.spectrum-Calendar-prevMonth {
+ left: 3px;
+}
+.spectrum-Calendar-nextMonth {
+ right: 3px;
+}
+.spectrum-Calendar-dayOfWeek {
+ position: absolute;
+ bottom: 4px;
+
+ display: block;
+
+ width: 32px;
+
+ border-bottom: none !important; /* override abbr styling from normalize.css */
+
+ font-size: 11px;
+ font-weight: 500;
+ text-transform: uppercase;
+ text-decoration: none !important; /* override abbr styling from normalize.css */
+
+ cursor: default;
+}
+.spectrum-Calendar-dayOfWeek[title] {
+ /* Normalize abbr[title] */
+ /* Remove the bottom border in Chrome 57- and Firefox 39-. */
+ border-bottom: none;
+
+ /* Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. */
+ text-decoration: underline;
+ text-decoration: underline dotted;
+ }
+.spectrum-Calendar-body {
+ outline: none;
+}
+.spectrum-Calendar-table {
+ table-layout: fixed;
+ /*width: 100%;*/
+
+ border-collapse: collapse;
+ border-spacing: 0;
+
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+}
+.spectrum-Calendar-tableCell {
+ text-align: center;
+ padding: 0;
+ position: relative;
+ box-sizing: content-box;
+ height: 32px;
+ width: 32px;
+ padding: 4px;
+}
+.spectrum-Calendar-tableCell:focus {
+ outline: 0;
+ }
+.spectrum-Calendar-date {
+ /* This is fun, but we need to trick the table so it doesn't size itself in a weird way */
+ position: absolute;
+ display: block;
+ top: 0;
+ left: 0;
+
+ box-sizing: border-box;
+
+ height: 32px;
+ width: 32px;
+ margin: 4px;
+
+ border-radius: 32px;
+ border: 2px solid transparent;
+
+ font-size: 14px;
+ line-height: 28px;
+
+ cursor: pointer;
+
+ transition: background 130ms ease-in-out,
+ color 130ms ease-in-out,
+ border-color 130ms ease-in-out;
+}
+.spectrum-Calendar-date.is-disabled {
+ cursor: default;
+ pointer-events: none;
+ }
+.spectrum-Calendar-date.is-outsideMonth {
+ visibility: hidden;
+ }
+.spectrum-Calendar-date:before {
+ content: '';
+ position: absolute;
+ top: calc(50% - 16px);
+ left: calc(50% - 16px);
+ box-sizing: border-box;
+ width: 32px;
+ height: 32px;
+ border-radius: 32px;
+ border: 2px solid transparent;
+ }
+.spectrum-Calendar-date.is-selected:not(.is-range-selection) {
+ font-weight: 700;
+ }
+.spectrum-Calendar-date.is-selected:not(.is-range-selection):before {
+ /* No highlight for lone selections */
+ display: none;
+ }
+.spectrum-Calendar-date.is-today {
+ font-weight: 700;
+ }
+.spectrum-Calendar-date.is-range-selection {
+ /* overrides to make the cells appear connected */
+ margin: 4px 0;
+ border-width: 0;
+ line-height: 32px;
+ border-radius: 0;
+
+ /* Todo: Calculate this */
+ width: 40px;
+ }
+.spectrum-Calendar-date.is-range-selection.is-range-start,
+ .spectrum-Calendar-date.is-range-selection.is-range-end,
+ .spectrum-Calendar-date.is-range-selection.is-selection-start,
+ .spectrum-Calendar-date.is-range-selection.is-selection-end {
+ width: 36px;
+ }
+.spectrum-Calendar-date.is-range-selection.is-selection-start,
+ .spectrum-Calendar-date.is-range-selection.is-selection-end {
+ font-weight: 700;
+ }
+.spectrum-Calendar-date.is-range-selection.is-selection-start:after, .spectrum-Calendar-date.is-range-selection.is-selection-end:after {
+ position: absolute;
+ top: 0;
+
+ display: block;
+
+ height: 32px;
+ width: 32px;
+
+ border-radius: 32px;
+
+ content: '';
+ }
+.spectrum-Calendar-date.is-range-selection.is-range-start,
+ .spectrum-Calendar-date.is-range-selection.is-selection-start {
+ padding-right: 4px;
+ margin-left: 4px;
+ border-radius: 32px 0 0 32px;
+ }
+.spectrum-Calendar-date.is-range-selection.is-range-start:before,
+ .spectrum-Calendar-date.is-range-selection.is-range-start:after,
+ .spectrum-Calendar-date.is-range-selection.is-selection-start:before,
+ .spectrum-Calendar-date.is-range-selection.is-selection-start:after {
+ left: 0;
+ }
+.spectrum-Calendar-date.is-range-selection.is-range-end,
+ .spectrum-Calendar-date.is-range-selection.is-selection-end {
+ padding-left: 4px;
+ margin-right: 4px;
+ border-radius: 0 32px 32px 0;
+ }
+.spectrum-Calendar-date.is-range-selection.is-range-end:before,
+ .spectrum-Calendar-date.is-range-selection.is-range-end:after,
+ .spectrum-Calendar-date.is-range-selection.is-selection-end:before,
+ .spectrum-Calendar-date.is-range-selection.is-selection-end:after {
+ left: auto;
+ right: 0;
+ }
+.spectrum-Calendar-date.is-range-selection.is-selection-start.is-selection-end,
+ .spectrum-Calendar-date.is-range-selection.is-selection-start.is-range-end,
+ .spectrum-Calendar-date.is-range-selection.is-selection-end.is-range-start,
+ .spectrum-Calendar-date.is-range-selection.is-range-start.is-range-end {
+ width: 32px;
+ border-radius: 32px;
+ }
+/* topdoc
+{{ table/table-standard.yml }}
+*/
+/* topdoc
+{{ table/table-divs.yml }}
+*/
+/* topdoc
+{{ table/table-divs-quiet.yml }}
+*/
+/* topdoc
+{{ table/table-dropzone.yml }}
+*/
+.spectrum-Table {
+ border-collapse: separate;
+ border-spacing: 0;
+}
+.spectrum-Table-sortedIcon {
+ display: none;
+ margin-left: 10px;
+
+ vertical-align: middle;
+
+ transition: transform 130ms ease-in-out;
+}
+.spectrum-Table-headCell {
+ box-sizing: border-box;
+ text-align: left;
+ font-size: 11px;
+ font-weight: 700;
+ line-height: 1.3;
+ min-height: 12px;
+ letter-spacing: 0.06em;
+ text-transform: uppercase;
+ padding: 10px 16px;
+ transition: color 130ms ease-in-out;
+ cursor: default;
+ outline: 0;
+ border-radius: 0px;
+}
+.spectrum-Table-headCell.is-sortable {
+ cursor: pointer;
+ }
+.spectrum-Table-headCell.is-sorted-asc .spectrum-Table-sortedIcon, .spectrum-Table-headCell.is-sorted-desc .spectrum-Table-sortedIcon {
+ display: inline-block;
+ /* offset icon because it's not properly aligned */
+ margin-top: -2px;
+ }
+.spectrum-Table-headCell.is-sorted-asc .spectrum-Table-sortedIcon {
+ transform: rotateZ(180deg);
+ }
+.spectrum-Table-cell--alignCenter {
+ text-align: center;
+}
+.spectrum-Table-cell--alignRight {
+ text-align: right;
+}
+/* Helper for shared drop target overlay */
+.spectrum-Table-body.is-drop-target::before,
+.spectrum-Table-row.is-drop-target::before {
+ content: '';
+ position: absolute;
+ top: 0;
+ left: 0;
+ bottom: 0;
+ right: 0;
+ z-index: 1;
+ }
+.spectrum-Table-body {
+ position: relative;
+
+ border-width: 1px;
+ border-radius: 4px;
+ overflow: auto;
+ vertical-align: top;
+}
+/* The tbody tag doesn't allow setting a border-radius, so these hacks are to make that work
+ by putting it on the individual cells instead. */
+.spectrum-Table:not(.spectrum-Table--quiet) tbody.spectrum-Table-body {
+ border-width: 1px;
+ border-radius: 4px;
+ }
+.spectrum-Table:not(.spectrum-Table--quiet) tbody.spectrum-Table-body .spectrum-Table-row:first-child .spectrum-Table-cell:first-child {
+ border-top-left-radius: 4px;
+ }
+.spectrum-Table:not(.spectrum-Table--quiet) tbody.spectrum-Table-body .spectrum-Table-row:first-child .spectrum-Table-cell:last-child {
+ border-top-right-radius: 4px;
+ }
+.spectrum-Table:not(.spectrum-Table--quiet) tbody.spectrum-Table-body .spectrum-Table-row:last-child .spectrum-Table-cell:first-child {
+ border-bottom-left-radius: 4px;
+ }
+.spectrum-Table:not(.spectrum-Table--quiet) tbody.spectrum-Table-body .spectrum-Table-row:last-child .spectrum-Table-cell:last-child {
+ border-bottom-right-radius: 4px;
+ }
+.spectrum-Table-cell {
+ box-sizing: border-box;
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 1.5;
+ padding: 14px 16px;
+ /* Subtract top/bottom padding for this value to be correct in this implementation */
+ min-height: 20px;
+}
+.spectrum-Table-cell,
+.spectrum-Table-headCell {
+ position: relative;
+}
+.spectrum-Table-cell.focus-ring,
+ .spectrum-Table-cell .is-focused,
+ .spectrum-Table-headCell.focus-ring,
+ .spectrum-Table-headCell .is-focused {
+ outline: none;
+ }
+.spectrum-Table-cell.focus-ring::before, .spectrum-Table-cell .is-focused::before, .spectrum-Table-headCell.focus-ring::before, .spectrum-Table-headCell .is-focused::before {
+ content: '';
+
+ /* Float above border */
+ z-index: 1;
+ position: absolute;
+
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+
+ border-radius: 3px;
+ }
+.spectrum-Table-headCell.focus-ring::before, .spectrum-Table-headCell .is-focused::before {
+ top: 1px;
+ right: 1px;
+ bottom: 1px;
+ left: 1px;
+ }
+.spectrum-Table-cell--divider {
+ border-right-width: 1px;
+}
+.spectrum-Table-row {
+ position: relative;
+ cursor: pointer;
+ transition: background-color 130ms ease-in-out;
+}
+.spectrum-Table-row:focus {
+ outline: 0;
+ }
+.spectrum-Table > .spectrum-Table-body > .spectrum-Table-row:last-of-type {
+ border-bottom-style: none;
+}
+/* topdoc
+{{ table/table-quiet.yml }}
+*/
+.spectrum-Table--quiet .spectrum-Table-body {
+ border-radius: 0px;
+ }
+.spectrum-Table--quiet .spectrum-Table-body.is-drop-target::before, .spectrum-Table--quiet .spectrum-Table-row.is-drop-target::before {
+ border-radius: 4px;
+ }
+/* topdoc
+{{ table/table-standard-multiselect.yml }}
+*/
+.spectrum-Table-checkboxCell {
+ padding-right: 8px;
+ /* have to eliminate vertical padding to allow proper vertical alignment */
+ padding-top: 0px;
+ padding-bottom: 0px;
+ vertical-align: middle;
+}
+.spectrum-Table-checkbox {
+ vertical-align: super;
+}
+/* topdoc
+{{ table/table-quiet-multiselect.yml }}
+*/
+/* topdoc
+{{ table/table-dividers.yml }}
+*/
+.spectrum-Rating {
+ cursor: pointer;
+ position: relative;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+}
+.spectrum-Rating.is-disabled {
+ cursor: default;
+ pointer-events: none;
+ }
+.spectrum-Rating-input {
+ position: absolute;
+ width: 130px;
+ height: 18px;
+ margin: 0;
+ opacity: 0.0001;
+ pointer-events: none;
+ z-index: 0;
+}
+.spectrum-Rating-icon {
+ background-size: contain;
+ background-repeat: no-repeat;
+ width: 26px;
+ height: 18px;
+}
+.spectrum-Rating-starActive,
+.spectrum-Rating-starInactive {
+ width: 18px;
+ height: 18px;
+ margin: 0 auto;
+}
+.spectrum-Rating-starActive {
+ display: none;
+}
+.spectrum-Rating-starInactive {
+ display: block;
+}
+/* topdoc
+{{ tags/tags.yml }}
+*/
+/* topdoc
+{{ tags/tags-deletable.yml }}
+*/
+.spectrum-Tags {
+ display: inline-block;
+
+ margin: 0;
+ padding: 0;
+ list-style: none;
+}
+.spectrum-Tags:after {
+ content: "";
+ display: table;
+ clear: both;
+ }
+.spectrum-Tags-item {
+ float: left;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-align: center;
+ align-items: center;
+ box-sizing: border-box;
+
+ margin: 4px 4px;
+ padding: 0 9px;
+ height: 24px;
+ max-width: 100%;
+
+ border-width: 1px;
+ border-style: solid;
+ border-radius: 4px;
+ outline: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+
+ transition: border-color 130ms ease-in-out,
+ color 130ms ease-in-out,
+ box-shadow 130ms ease-in-out,
+ background-color 130ms ease-in-out;
+}
+.spectrum-Tags-item.is-disabled {
+ pointer-events: none;
+ }
+.spectrum-Tags-item > .spectrum-Icon,
+ .spectrum-Tags-item > .spectrum-Avatar {
+ margin-right: 8px;
+
+ /* Add padding for "avatar" variant */
+ margin-left: -2px;
+ }
+.spectrum-Tags-item > .spectrum-Icon ~ .spectrum-Tags-itemLabel, .spectrum-Tags-item > .spectrum-Avatar ~ .spectrum-Tags-itemLabel {
+ margin-right: -2px;
+ }
+.spectrum-Tags-item .spectrum-ClearButton {
+ margin-right: -10px;
+ }
+.spectrum-Tags-itemLabel {
+ height: 100%;
+ line-height: 22px;
+ -ms-flex: 1 1 auto;
+ flex: 1 1 auto;
+ font-size: 12px;
+ cursor: default;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+}
+/* topdoc
+{{ searchwithin/searchwithin.yml }}
+*/
+:root {
+
+ /* Force override */
+}
+.spectrum-SearchWithin {
+ width: 250px;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ position: relative;
+}
+.spectrum-SearchWithin .spectrum-Dropdown {
+ width: auto;
+ min-width: 0;
+ }
+.spectrum-SearchWithin .spectrum-Dropdown-trigger {
+ border-top-right-radius: 0;
+ border-bottom-right-radius: 0;
+ }
+.spectrum-SearchWithin .spectrum-Dropdown-label {
+ /* Override dropdown's min-width and be tiny */
+ min-width: 0;
+ }
+.spectrum-SearchWithin .spectrum-Textfield {
+ -ms-flex: 1;
+ flex: 1;
+ margin-left: -1px; /* hides left border */
+ border-top-left-radius: 0;
+ border-bottom-left-radius: 0;
+ }
+.spectrum-SearchWithin .spectrum-Textfield:hover, .spectrum-SearchWithin .spectrum-Textfield:focus {
+ position: relative; /* shows left border */
+ }
+.spectrum-SearchWithin .spectrum-ClearButton {
+ position: absolute;
+ top: 0;
+ right: 0;
+ }
+.spectrum-QuickActions {
+ box-sizing: border-box;
+
+ display: -ms-inline-flexbox;
+
+ display: inline-flex;
+ -ms-flex-align: center;
+ align-items: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+
+ padding: 4px 4px;
+
+ height: 40px;
+
+ border-radius: 4px;
+}
+.spectrum-QuickActions .spectrum-ActionButton + .spectrum-ActionButton,
+.spectrum-QuickActions .spectrum-Tool + .spectrum-Tool {
+ margin-left: 8px;
+ }
+.spectrum-QuickActions--textOnly .spectrum-ActionButton + .spectrum-ActionButton,
+.spectrum-QuickActions--textOnly .spectrum-Tool + .spectrum-Tool {
+ margin-left: 4px;
+ }
+.spectrum-QuickActions--right.is-open { /* should animate to the left when aligned right */
+ }
+.spectrum-QuickActions--left.is-open { /* should animate to the right when aligned left */
+ }
+/* topdoc
+{{ assetlist/assetlist.yml }}
+*/
+.spectrum-AssetList {
+ margin-top: 0;
+ margin-bottom: 0;
+ padding: 0;
+}
+.spectrum-AssetList-item {
+ position: relative;
+
+ display: -ms-flexbox;
+
+ display: flex;
+ box-sizing: border-box;
+ -ms-flex-align: center;
+ align-items: center;
+
+ width: 272px;
+ height: 40px;
+
+ padding: 0 16px 0 16px;
+ margin: 0 0 4px 0;
+
+ border-radius: 4px;
+
+ transition: background-color 130ms ease-in-out;
+
+ font-size: 14px;
+ font-weight: 400;
+ font-style: normal;
+
+ cursor: pointer;
+
+ outline: none;
+}
+.spectrum-AssetList-item::before {
+ content: '';
+
+ position: absolute;
+ left: 0;
+ right: 0;
+
+ height: 40px;
+
+ background-color: transparent;
+
+ border-radius: 4px;
+ }
+/* checkbox on the left, shows up always */
+.spectrum-AssetList-item.is-selectable .spectrum-Checkbox, .spectrum-AssetList-item.is-selected .spectrum-Checkbox, .spectrum-AssetList-item:hover .spectrum-Checkbox, .spectrum-AssetList-item:focus .spectrum-Checkbox {
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ }
+/* show chevron */
+.spectrum-AssetList-item.is-branch .spectrum-AssetList-itemChildIndicator {
+ display: block;
+ }
+.spectrum-AssetList-item .spectrum-AssetList-itemThumbnail {
+ /* Remove the border on images inside links in IE 10-. */
+ border-style: none;
+
+ width: 24px;
+ height: 24px;
+ margin-left: 8px;
+ vertical-align: middle;
+ }
+.spectrum-AssetList-itemSelector {
+ display: none;
+ margin: 0;
+}
+.spectrum-AssetList-itemChildIndicator {
+ display: none;
+ transition: transform ease 130ms;
+}
+.spectrum-AssetList-itemLabel {
+ -ms-flex: 1;
+ flex: 1;
+ padding-left: 8px;
+
+ text-overflow: ellipsis;
+ overflow: hidden;
+ white-space: nowrap;
+}
+/* topdoc
+{{ miller/miller-column.yml }}
+*/
+.spectrum-MillerColumns {
+ overflow-x: auto;
+ white-space: nowrap;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ padding: 8px 0;
+}
+.spectrum-MillerColumns-item {
+ display: inline-block;
+ width: 272px;
+ vertical-align: top;
+ outline: none;
+ margin: 0;
+ padding: 0;
+ margin-right: 8px;
+ overflow: auto;
+ height: 100%;
+}
+.spectrum-MillerColumns-item:first-child {
+ margin-left: 8px;
+ }
+/* topdoc
+{{ splitview/splitview-horizontal.yml }}
+*/
+/* topdoc
+{{ splitview/splitview-horizontal-resizable.yml }}
+*/
+/* topdoc
+{{ splitview/splitview-vertical-resizable.yml }}
+*/
+/* topdoc
+{{ splitview/splitview-horizontal-collapsed-left.yml }}
+*/
+/* topdoc
+{{ splitview/splitview-horizontal-collapsed-right.yml }}
+*/
+/* topdoc
+{{ splitview/splitview-vertical-collapsed-top.yml }}
+*/
+/* topdoc
+{{ splitview/splitview-vertical-collapsed-bottom.yml }}
+*/
+.spectrum-SplitView {
+ display: -ms-flexbox;
+ display: flex;
+ overflow: hidden;
+}
+.spectrum-SplitView-pane {
+ height: 100%;
+}
+.spectrum-SplitView-gripper {
+ content: '';
+ display: block;
+ position: absolute;
+ border-style: solid;
+ border-radius: 2px;
+
+ top: 50%;
+ transform: translate(0, -50%);
+
+ /* half of (width + horizontal border - handle width) * -1 (for negative opposite) */
+ left: -4px;
+ width: 4px;
+ height: 16px;
+ border-width: 4px 3px;
+}
+.spectrum-SplitView-splitter {
+ /* Contain the gripper */
+ position: relative;
+
+ /* Prevent text selection while dragging */
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+
+ width: 2px;
+ height: 100%;
+ z-index: 1;
+}
+/* make the center line of the gripper */
+.spectrum-SplitView-splitter.is-collapsed-start .spectrum-SplitView-gripper:before, .spectrum-SplitView-splitter.is-collapsed-end .spectrum-SplitView-gripper:before {
+ content: '';
+ position: absolute;
+
+ top: 0;
+ left: calc(50% - 1px);
+ width: 2px;
+ height: 100%;
+ }
+.spectrum-SplitView-splitter.is-collapsed-start .spectrum-SplitView-gripper {
+ left: 0;
+ }
+.spectrum-SplitView-splitter.is-collapsed-end .spectrum-SplitView-gripper {
+ right: 0;
+ left: auto;
+ }
+.spectrum-SplitView--vertical {
+ -ms-flex-direction: column;
+ flex-direction: column;
+}
+.spectrum-SplitView--vertical .spectrum-SplitView-pane {
+ height: auto;
+ width: 100%;
+ }
+.spectrum-SplitView--vertical .spectrum-SplitView-gripper {
+ /* half of (height + vertical border - handle width) * -1 (for negative opposite) */
+ top: -4px;
+
+ transform: translate(-50%, 0);
+ left: 50%;
+ width: 16px; /* same as default height */
+ height: 4px; /* same as default width */
+
+ /* opposite of default border-width */
+ border-width: 3px 4px;
+ }
+.spectrum-SplitView--vertical .spectrum-SplitView-splitter {
+ width: 100%;
+ height: 2px;
+ }
+.spectrum-SplitView--vertical .spectrum-SplitView-splitter.is-collapsed-start .spectrum-SplitView-gripper, .spectrum-SplitView--vertical .spectrum-SplitView-splitter.is-collapsed-end .spectrum-SplitView-gripper {
+ left: 50%;
+ }
+/* make the center line of the gripper */
+.spectrum-SplitView--vertical .spectrum-SplitView-splitter.is-collapsed-start .spectrum-SplitView-gripper:before, .spectrum-SplitView--vertical .spectrum-SplitView-splitter.is-collapsed-end .spectrum-SplitView-gripper:before {
+ top: calc(50% - 1px);
+ left: 0;
+ width: 100%;
+ height: 2px;
+ }
+.spectrum-SplitView--vertical .spectrum-SplitView-splitter.is-collapsed-start .spectrum-SplitView-gripper {
+ top: 0;
+ }
+.spectrum-SplitView--vertical .spectrum-SplitView-splitter.is-collapsed-end .spectrum-SplitView-gripper {
+ top: auto;
+ bottom: 0;
+ }
+/* topdoc
+{{ cyclebutton/cyclebutton-default.yml }}
+*/
+.spectrum-CycleButton {
+ /* Be square */
+ padding: 0 7px;
+}
+.spectrum-CycleButton .spectrum-CycleButton-item:not(.is-selected) {
+ display: none
+ }
+/* topdoc
+{{ pagination/pagination-listing.yml }}
+*/
+.spectrum-Pagination--explicit,
+.spectrum-Pagination--listing {
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-direction: row;
+ flex-direction: row;
+ -ms-flex-align: center;
+ align-items: center;
+}
+/* topdoc
+{{ pagination/pagination-explicit.yml }}
+*/
+.spectrum-Pagination-input {
+ width: 48px;
+ min-width: 48px;
+}
+.spectrum-Pagination-counter {
+ margin-left: 5px;
+}
+.spectrum-Pagination-prevButton {
+ margin-right: 5px;
+}
+.spectrum-Pagination-nextButton {
+ margin-left: 5px;
+}
+/* topdoc
+{{ pagination/pagination-button-style-cta.yml }}
+*/
+/* topdoc
+{{ pagination/pagination-button-style-primary.yml }}
+*/
+/* topdoc
+{{ pagination/pagination-button-style-secondary.yml }}
+*/
+.spectrum-Banner {
+ display: inline-block;
+ border-radius: 8px;
+ padding: 4px 8px;
+ font-size: 12px;
+ line-height: 1.3;
+}
+.spectrum-Banner-header {
+ font-weight: bold;
+}
+/* topdoc
+{{ banner/banner-info.yml }}
+*/
+/* topdoc
+{{ banner/banner-warning.yml }}
+*/
+/* topdoc
+{{ banner/banner-error.yml }}
+*/
+/* topdoc
+{{ banner/banner-corner.yml }}
+*/
+.spectrum-Banner--corner {
+ position: absolute;
+ top: -10px;
+ right: -10px;
+}
+/* topdoc
+{{ rule/rule.yml }}
+*/
+.spectrum-Rule {
+ /* Show the overflow for hr in Edge and IE. */
+ overflow: visible;
+
+ border: none;
+ border-width: 2px;
+ border-radius: 2px;
+}
+.spectrum-Rule--large {
+ height: 4px;
+
+ border-radius: 2px;
+}
+.spectrum-Rule--medium {
+ height: 2px;
+
+ border-radius: 1px;
+}
+.spectrum-Rule--small {
+ height: 1px;
+
+ border-radius: 1px;
+}
+/* topdoc
+{{ statuslight/statuslight-semantic.yml }}
+*/
+.spectrum-StatusLight {
+ height: 32px;
+
+ line-height: 32px;
+ font-size: 14px;
+ font-weight: 400;
+}
+.spectrum-StatusLight::before {
+ content: '';
+ display: inline-block;
+ width: 8px;
+ height: 8px;
+ border-radius: 50%;
+ margin: 0 12px;
+ }
+.spectrum-StatusLight--neutral {
+ font-style: italic;
+}
+/* topdoc
+{{ statuslight/statuslight-label.yml }}
+*/
+/* topdoc
+{{ treeview/treeview.yml }}
+*/
+.spectrum-TreeView {
+ display: block;
+ list-style: none;
+ position: relative;
+ padding: 0;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+ outline: none;
+}
+.spectrum-TreeView-item {
+ /* Don't let child treeviews that are open spill out */
+ overflow: hidden;
+}
+.spectrum-TreeView-item.is-open > .spectrum-TreeView-itemLink > .spectrum-TreeView-indicator {
+ /* Rotate the chevron */
+ transform: rotate(90deg);
+ }
+.spectrum-TreeView-item.is-open > .spectrum-TreeView {
+ /* Open the treeview */
+ height: auto;
+ visibility: visible;
+ }
+.spectrum-TreeView-itemLink {
+ display: block;
+ box-sizing: border-box;
+ cursor: pointer;
+
+ padding: 12px 30px;
+
+ text-decoration: none;
+
+ /* Prevent weirdness that can cause the vertical bar to fall down */
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+}
+.spectrum-TreeView-itemLink:focus {
+ /* we cannot achieve rounded corners with outline so we use box-shadow (on skin.css) instead */
+ outline: none;
+ }
+.spectrum-TreeView-itemLink .spectrum-Icon {
+ vertical-align: top;
+ margin-right: 8px;
+ }
+.spectrum-TreeView-itemLink::before {
+ content: '';
+
+ position: absolute;
+ left: 2px;
+ right: 0;
+ z-index: -1; /* make sure we don't block clicks on chevron */
+
+ /* Position correctly since top is not defined */
+ margin-top: -8px;
+
+ height: 36px;
+
+ background-color: transparent;
+
+ border-radius: 4px;
+ }
+.spectrum-TreeView-indicator {
+ display: block;
+
+ float: left;
+ position: relative;
+
+ left: 10px;
+ top: -5px;
+ margin-left: -34px;
+ margin-bottom: -10px;
+
+ padding: 10px;
+
+ transition: transform ease 130ms;
+
+ pointer-events: all !important;
+}
+/* Close nested treeviews by default */
+.spectrum-TreeView .spectrum-TreeView {
+ /* Don't be a highlight container stealer */
+ position: static;
+
+ padding-left: 28px;
+
+ /* Be hidden */
+ height: 0;
+ visibility: hidden;
+}
+/* topdoc
+{{ treeview/treeview-flat.yml }}
+*/
+.spectrum-TreeView-item--indent1 {
+ padding-left: 28px;
+}
+.spectrum-TreeView-item--indent2 {
+ padding-left: 56px;
+}
+.spectrum-TreeView-item--indent3 {
+ padding-left: 84px;
+}
+.spectrum-TreeView-item--indent4 {
+ padding-left: 112px;
+}
+.spectrum-TreeView-item--indent5 {
+ padding-left: 140px;
+}
+.spectrum-TreeView-item--indent6 {
+ padding-left: 168px;
+}
+.spectrum-TreeView-item--indent7 {
+ padding-left: 196px;
+}
+.spectrum-TreeView-item--indent8 {
+ padding-left: 224px;
+}
+.spectrum-TreeView-item--indent9 {
+ padding-left: 252px;
+}
+.spectrum-TreeView-item--indent10 {
+ padding-left: 280px;
+}
+/* topdoc
+{{ treeview/treeview-icons.yml }}
+*/
+/* topdoc
+{{ treeview/treeview-disabled.yml }}
+*/
+.spectrum-SideNav {
+ list-style-type: none;
+ margin: 0;
+ padding: 0;
+ width: 240px;
+}
+.spectrum-SideNav-item {
+ list-style-type: none;
+
+ margin: 4px 0;
+}
+.spectrum-SideNav-itemLink {
+ position: relative;
+ display: -ms-inline-flexbox;
+ display: inline-flex;
+ -ms-flex-align: center;
+ align-items: center;
+ -ms-flex-pack: left;
+ justify-content: left;
+ box-sizing: border-box;
+
+ width: 100%;
+ min-height: 32px;
+
+ padding: 5px 12px;
+
+ border-radius: 4px;
+
+ font-size: 14px;
+ font-weight: 400;
+ font-style: normal;
+ text-decoration: none;
+
+ cursor: pointer;
+
+ transition: background-color 130ms ease-out,
+ color 130ms ease-out;
+}
+.spectrum-SideNav-itemLink:focus {
+ outline: none;
+ }
+.spectrum-SideNav-itemLink.focus-ring::before {
+ content: '';
+ position: absolute;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+
+ border: 2px solid transparent;
+ border-radius: 4px;
+ }
+/* topdoc
+{{ sidenav/sidenav-heading.yml }}
+*/
+.spectrum-SideNav-heading {
+ height: 32px;
+ line-height: 32px;
+
+ margin: 16px 0 4px 0;
+ padding: 0 12px;
+
+ border-radius: 4px;
+
+ font-size: 11px;
+ font-weight: 500;
+ font-style: normal;
+ letter-spacing: 0.06em;
+
+ text-transform: uppercase;
+}
+.spectrum-SideNav--multiLevel .spectrum-SideNav-itemLink {
+ font-weight: 700;
+ }
+.spectrum-SideNav--multiLevel .spectrum-SideNav {
+ margin: 0;
+ padding: 0;
+ }
+.spectrum-SideNav--multiLevel .spectrum-SideNav .spectrum-SideNav-itemLink {
+ font-weight: 400;
+
+ padding-left: 24px;
+ }
+.spectrum-SideNav--multiLevel .spectrum-SideNav .spectrum-SideNav .spectrum-SideNav-itemLink {
+ padding-left: 36px;
+ }
+/* topdoc
+{{ illustratedmessage/illustratedmessage.yml }}
+*/
+/* topdoc
+{{ illustratedmessage/illustratedmessage-cta.yml }}
+*/
+.spectrum-IllustratedMessage {
+ height: 100%;
+
+ display: -ms-flexbox;
+
+ display: flex;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ -ms-flex-align: center;
+ align-items: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+
+ text-align: center;
+}
+.spectrum-IllustratedMessage-illustration {
+ margin-bottom: 24px;
+}
+.spectrum-IllustratedMessage-heading {
+ max-width: 500px;
+ margin: 0;
+}
+.spectrum-IllustratedMessage-description {
+ max-width: 500px;
+ margin: 4px 0 0 0;
+
+ font-style: italic;
+}
+.spectrum-IllustratedMessage--cta .spectrum-IllustratedMessage-description {
+ font-style: normal;
+ }
+/* topdoc
+{{ dropindicator/dropindicator.yml }}
+*/
+.spectrum-DropIndicator {
+ position: relative;
+}
+.spectrum-DropIndicator:before,
+ .spectrum-DropIndicator:after {
+ content: '';
+ position: absolute;
+ width: 12px;
+ height: 12px;
+ border-radius: 50%;
+ border: 2px solid;
+ box-sizing: border-box;
+ }
+.spectrum-DropIndicator--horizontal {
+ height: 2px;
+ margin: 0 12px;
+}
+.spectrum-DropIndicator--horizontal:before,
+ .spectrum-DropIndicator--horizontal:after {
+ top: -5px;
+ }
+.spectrum-DropIndicator--horizontal:before {
+ left: -12px;
+ }
+.spectrum-DropIndicator--horizontal:after {
+ right: -12px;
+ }
+.spectrum-DropIndicator--vertical {
+ width: 2px;
+ margin: 12px 0;
+}
+.spectrum-DropIndicator--vertical:before,
+ .spectrum-DropIndicator--vertical:after {
+ left: -5px;
+ }
+.spectrum-DropIndicator--vertical:before {
+ top: -12px;
+ }
+.spectrum-DropIndicator--vertical:after {
+ bottom: -12px;
+ }
+/* topdoc
+{{ card/card.yml }}
+*/
+/*! topdoc
+{{ card/card-asset.yml }}
+*/
+/*! topdoc
+{{ card/card-small.yml }}
+*/
+.spectrum-Card {
+ position: relative;
+
+ display: -ms-inline-flexbox;
+
+ display: inline-flex;
+ -ms-flex-direction: column;
+ flex-direction: column;
+
+ box-sizing: border-box;
+ min-width: 240px;
+
+ border: 1px solid transparent;
+ border-radius: 4px;
+}
+.spectrum-Card:focus {
+ outline: none;
+ }
+.spectrum-Card.is-selected .spectrum-Card-quickActions,
+ .spectrum-Card.is-selected .spectrum-Card-actions,
+ .spectrum-Card:focus .spectrum-Card-quickActions,
+ .spectrum-Card:focus .spectrum-Card-actions,
+ .spectrum-Card:hover .spectrum-Card-quickActions,
+ .spectrum-Card:hover .spectrum-Card-actions {
+ /* Ideally, this would simply apply is-open to the QuickActions component */
+ visibility: visible;
+ opacity: 1;
+ pointer-events: all;
+ }
+.spectrum-Card-actions {
+ position: absolute;
+ right: 10px;
+ top: 10px;
+ height: 40px;
+ visibility: hidden;
+}
+.spectrum-Card-quickActions {
+ position: absolute;
+ left: 16px;
+ top: 16px;
+
+ width: 40px;
+ height: 40px;
+
+ visibility: hidden;
+}
+.spectrum-Card-quickActions .spectrum-Checkbox {
+ margin: 0;
+ }
+.spectrum-Card-coverPhoto {
+ height: 136px;
+ box-sizing: border-box;
+
+ display: -ms-flexbox;
+
+ display: flex;
+ -ms-flex-align: center;
+ align-items: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+
+ border-bottom: 1px solid transparent;
+ border-radius: 3px 3px 0 0;
+
+ background-size: cover;
+ background-position: center center;
+}
+.spectrum-Card-body {
+ padding-top: 20px;
+ padding-right: 24px;
+ padding-bottom: 20px;
+ padding-left: 24px;
+}
+.spectrum-Card-body:last-child {
+ border-radius: 0 0 4px 4px;
+ }
+.spectrum-Card-preview {
+ overflow: hidden;
+ border-radius: 3px 3px 0 0;
+}
+.spectrum-Card-header {
+ height: 18px;
+}
+.spectrum-Card-content {
+ display: -ms-flexbox;
+ display: flex;
+ height: 14px;
+ margin-top: 6px;
+}
+.spectrum-Card-title {
+ font-size: 14px;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ padding-right: 8px;
+}
+.spectrum-Card-subtitle {
+ font-size: 11px;
+ letter-spacing: 0.06em;
+ text-transform: uppercase;
+ padding-right: 8px;
+}
+.spectrum-Card-description {
+ font-size: 11px;
+}
+.spectrum-Card-subtitle + .spectrum-Card-description:before {
+ content: "•";
+ padding-right: 8px;
+}
+.spectrum-Card-footer {
+ padding-top: 14px;
+ margin-right: 24px;
+ padding-bottom: 20px;
+ margin-left: 24px;
+
+ border-top: 1px solid;
+}
+.spectrum-Card-header {
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-align: baseline;
+ align-items: baseline;
+}
+.spectrum-Card-actionButton {
+ -ms-flex: 1;
+ flex: 1;
+ -ms-flex-item-align: center;
+ align-self: center;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-pack: end;
+ justify-content: flex-end;
+}
+/* topdoc
+{{ card/card-quiet-large.yml }}
+*/
+/* topdoc
+{{ card/card-quiet-small.yml }}
+*/
+/* topdoc
+{{ card/card-quiet-folder.yml }}
+*/
+/* topdoc
+{{ card/card-quiet-file.yml }}
+*/
+/* topdoc
+{{ card/card-gallery.yml }}
+*/
+.spectrum-Card--quiet,
+.spectrum-Card--gallery {
+ width: 100%;
+ height: 100%;
+ min-width: 136px;
+ border-width: 0;
+ border-radius: 0;
+ overflow: visible;
+}
+.spectrum-Card--quiet .spectrum-Card-preview, .spectrum-Card--gallery .spectrum-Card-preview {
+ width: 100%;
+ -ms-flex: 1;
+ flex: 1;
+ min-height: 136px;
+ padding: 20px;
+ margin: 0 auto;
+ box-sizing: border-box;
+ border-radius: 4px;
+ position: relative;
+ transition: background-color 130ms;
+ }
+/* Use a :before to show the selection outline so that the border doesn't
+ * affect the layout of the content within the preview. */
+.spectrum-Card--quiet .spectrum-Card-preview:before, .spectrum-Card--gallery .spectrum-Card-preview:before {
+ content: '';
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ box-sizing: border-box;
+ border-radius: inherit;
+ border: 1px solid transparent;
+ }
+.spectrum-Card--quiet.is-drop-target .spectrum-Card-preview, .spectrum-Card--gallery.is-drop-target .spectrum-Card-preview {
+ transition: none;
+ }
+.spectrum-Card--quiet .spectrum-Card-header, .spectrum-Card--gallery .spectrum-Card-header {
+ height: 18px;
+ margin-top: 14px;
+ }
+.spectrum-Card--quiet .spectrum-Card-body, .spectrum-Card--gallery .spectrum-Card-body {
+ padding: 0;
+ }
+.spectrum-Card--small {
+ min-width: 72px;
+}
+.spectrum-Card--small .spectrum-Card-quickActions {
+ left: 10px;
+ top: 10px;
+ }
+.spectrum-Card--small .spectrum-Card-preview {
+ padding: 12px;
+ min-height: 72px;
+ }
+.spectrum-Card--small .spectrum-Card-header {
+ margin-top: 8px;
+ height: 12px;
+ }
+.spectrum-Card--small .spectrum-Card-title {
+ font-size: 12px;
+ }
+.spectrum-Card--small .spectrum-Card-content,
+ .spectrum-Card--small .spectrum-Card-subtitle,
+ .spectrum-Card--small .spectrum-Card-description {
+ display: none;
+ }
+.spectrum-Card--gallery {
+ min-width: 0;
+}
+.spectrum-Card--gallery .spectrum-Card-preview {
+ padding: 0;
+ border-radius: 0;
+ }
+.spectrum-Asset {
+ width: 100%;
+ height: 100%;
+ display: -ms-flexbox;
+ display: flex;
+ -ms-flex-align: center;
+ align-items: center;
+ -ms-flex-pack: center;
+ justify-content: center;
+}
+.spectrum-Asset-image {
+ max-width: 100%;
+ max-height: 100%;
+ object-fit: contain;
+ transition: opacity 130ms;
+}
+.spectrum-Asset-folder,
+.spectrum-Asset-file {
+ width: 100%;
+ height: 100%;
+ min-width: 48px;
+ max-width: 80px;
+ margin: 20px;
+}
+
+/* Temporary skin variables that need to be moved into origins */
+.spectrum--light :root {
+ /* Icon Button*/
+
+ /* Button */
+
+ /* Shell */
+
+ /* haha remove this */
+
+ /* Custom selection color for placeholders using global blue-500 at 30% opacity. Should be updated in Spectrum-DNA */
+}
+/* topdoc
+{{ page/page.yml }}
+*/
+.spectrum--light {
+ background-color: rgb(245, 245, 245);
+
+ /* Prevent tap highlights */
+ -webkit-tap-highlight-color: rgba(0,0,0,0);
+}
+/* generated from dna-version: 5.8.0 */
+.spectrum--light .spectrum-Body1 {
+ color: rgb(75, 75, 75);
+ }
+/* generated from dna-version: 5.8.0 */
+.spectrum--light .spectrum-Body2 {
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Body3 {
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Body4 {
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Body5 {
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Heading1 {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Heading2 {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Heading3 {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Heading4 {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Heading5 {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Heading6 {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Subheading {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Detail {
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Heading1--quiet {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Heading2--quiet {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Heading1--strong {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Heading2--strong {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Heading1--display {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Heading2--display {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Heading1--display.spectrum-Heading1--strong {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Heading2--display.spectrum-Heading2--strong {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Heading1--display.spectrum-Heading1--quiet {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Heading2--display.spectrum-Heading2--quiet {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Article .spectrum-Body1 {
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Article .spectrum-Body2 {
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Article .spectrum-Body3 {
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Article .spectrum-Body4 {
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Article .spectrum-Body5 {
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Article .spectrum-Heading1 {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Article .spectrum-Heading2 {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Article .spectrum-Heading3 {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Article .spectrum-Heading4 {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Article .spectrum-Heading5 {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Article .spectrum-Heading6 {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Article .spectrum-Subheading {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Article .spectrum-Detail {
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Article .spectrum-Heading1--quiet {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Article .spectrum-Heading2--quiet {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Article .spectrum-Heading1--display {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Article .spectrum-Heading2--display {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Article .spectrum-Heading1--display.spectrum-Heading1--quiet {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Article .spectrum-Heading2--display.spectrum-Heading2--quiet {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum:lang(ja) .spectrum-Body1, .spectrum--light .spectrum:lang(ko) .spectrum-Body1, .spectrum--light .spectrum:lang(zh) .spectrum-Body1 {
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum:lang(ja) .spectrum-Body2, .spectrum--light .spectrum:lang(ko) .spectrum-Body2, .spectrum--light .spectrum:lang(zh) .spectrum-Body2 {
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum:lang(ja) .spectrum-Body3, .spectrum--light .spectrum:lang(ko) .spectrum-Body3, .spectrum--light .spectrum:lang(zh) .spectrum-Body3 {
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum:lang(ja) .spectrum-Body4, .spectrum--light .spectrum:lang(ko) .spectrum-Body4, .spectrum--light .spectrum:lang(zh) .spectrum-Body4 {
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum:lang(ja) .spectrum-Body5, .spectrum--light .spectrum:lang(ko) .spectrum-Body5, .spectrum--light .spectrum:lang(zh) .spectrum-Body5 {
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum:lang(ja) .spectrum-Heading1, .spectrum--light .spectrum:lang(ko) .spectrum-Heading1, .spectrum--light .spectrum:lang(zh) .spectrum-Heading1 {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum:lang(ja) .spectrum-Heading2, .spectrum--light .spectrum:lang(ko) .spectrum-Heading2, .spectrum--light .spectrum:lang(zh) .spectrum-Heading2 {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum:lang(ja) .spectrum-Heading3, .spectrum--light .spectrum:lang(ko) .spectrum-Heading3, .spectrum--light .spectrum:lang(zh) .spectrum-Heading3 {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum:lang(ja) .spectrum-Heading4, .spectrum--light .spectrum:lang(ko) .spectrum-Heading4, .spectrum--light .spectrum:lang(zh) .spectrum-Heading4 {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum:lang(ja) .spectrum-Heading5, .spectrum--light .spectrum:lang(ko) .spectrum-Heading5, .spectrum--light .spectrum:lang(zh) .spectrum-Heading5 {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum:lang(ja) .spectrum-Heading6, .spectrum--light .spectrum:lang(ko) .spectrum-Heading6, .spectrum--light .spectrum:lang(zh) .spectrum-Heading6 {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum:lang(ja) .spectrum-Subheading, .spectrum--light .spectrum:lang(ko) .spectrum-Subheading, .spectrum--light .spectrum:lang(zh) .spectrum-Subheading {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum:lang(ja) .spectrum-Detail, .spectrum--light .spectrum:lang(ko) .spectrum-Detail, .spectrum--light .spectrum:lang(zh) .spectrum-Detail {
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum:lang(ja) .spectrum-Heading1--quiet, .spectrum--light .spectrum:lang(ko) .spectrum-Heading1--quiet, .spectrum--light .spectrum:lang(zh) .spectrum-Heading1--quiet {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum:lang(ja) .spectrum-Heading2--quiet, .spectrum--light .spectrum:lang(ko) .spectrum-Heading2--quiet, .spectrum--light .spectrum:lang(zh) .spectrum-Heading2--quiet {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum:lang(ja) .spectrum-Heading1--strong, .spectrum--light .spectrum:lang(ko) .spectrum-Heading1--strong, .spectrum--light .spectrum:lang(zh) .spectrum-Heading1--strong {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum:lang(ja) .spectrum-Heading2--strong, .spectrum--light .spectrum:lang(ko) .spectrum-Heading2--strong, .spectrum--light .spectrum:lang(zh) .spectrum-Heading2--strong {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum:lang(ja) .spectrum-Heading1--display, .spectrum--light .spectrum:lang(ko) .spectrum-Heading1--display, .spectrum--light .spectrum:lang(zh) .spectrum-Heading1--display {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum:lang(ja) .spectrum-Heading2--display, .spectrum--light .spectrum:lang(ko) .spectrum-Heading2--display, .spectrum--light .spectrum:lang(zh) .spectrum-Heading2--display {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum:lang(ja) .spectrum-Heading1--display.spectrum-Heading1--strong, .spectrum--light .spectrum:lang(ko) .spectrum-Heading1--display.spectrum-Heading1--strong, .spectrum--light .spectrum:lang(zh) .spectrum-Heading1--display.spectrum-Heading1--strong {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum:lang(ja) .spectrum-Heading2--display.spectrum-Heading2--strong, .spectrum--light .spectrum:lang(ko) .spectrum-Heading2--display.spectrum-Heading2--strong, .spectrum--light .spectrum:lang(zh) .spectrum-Heading2--display.spectrum-Heading2--strong {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum:lang(ja) .spectrum-Heading1--display.spectrum-Heading1--quiet, .spectrum--light .spectrum:lang(ko) .spectrum-Heading1--display.spectrum-Heading1--quiet, .spectrum--light .spectrum:lang(zh) .spectrum-Heading1--display.spectrum-Heading1--quiet {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum:lang(ja) .spectrum-Heading2--display.spectrum-Heading2--quiet, .spectrum--light .spectrum:lang(ko) .spectrum-Heading2--display.spectrum-Heading2--quiet, .spectrum--light .spectrum:lang(zh) .spectrum-Heading2--display.spectrum-Heading2--quiet {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Code1 {
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Code2 {
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Code3 {
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Code4 {
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Code5 {
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light,
+.spectrum--light .spectrum-Body {
+ color: rgb(75, 75, 75);
+}
+.spectrum--light .spectrum-Body--large {
+ color: rgb(75, 75, 75);
+}
+.spectrum--light .spectrum-Body--small {
+ color: rgb(75, 75, 75);
+}
+.spectrum--light .spectrum-Body--secondary {
+ color: rgb(110, 110, 110);
+}
+.spectrum--light .spectrum-Heading--display {
+ color: rgb(44, 44, 44);
+}
+.spectrum--light .spectrum-Heading--pageTitle {
+ color: rgb(110, 110, 110);
+}
+.spectrum--light .spectrum-Heading--subtitle1 {
+ color: rgb(44, 44, 44);
+}
+.spectrum--light .spectrum-Heading--subtitle2 {
+ color: rgb(44, 44, 44);
+}
+.spectrum--light .spectrum-Heading--subtitle3 {
+ color: rgb(110, 110, 110);
+}
+.spectrum--light .spectrum-Link {
+ color: rgb(13, 102, 208);
+}
+.spectrum--light .spectrum-Link:hover {
+ color: rgb(13, 102, 208);
+ }
+.spectrum--light .spectrum-Link:active {
+ color: rgb(9, 90, 186);
+ }
+.spectrum--light .spectrum-Link.focus-ring {
+ color: rgb(13, 102, 208);
+ }
+.spectrum--light .spectrum-Link.is-disabled {
+ color: rgb(179, 179, 179);
+ }
+.spectrum--light .spectrum-Link--quiet,
+.spectrum--light .spectrum-Link--subtle {
+ color: inherit;
+}
+.spectrum--light .spectrum-Link--quiet:hover, .spectrum--light .spectrum-Link--subtle:hover {
+ color: inherit;
+ }
+.spectrum--light .spectrum-Link--quiet:active, .spectrum--light .spectrum-Link--subtle:active {
+ color: inherit;
+ }
+.spectrum--light .spectrum-Link--quiet:focus, .spectrum--light .spectrum-Link--subtle:focus {
+ color: inherit;
+ }
+.spectrum--light .spectrum-Link--overBackground {
+ color: rgb(255, 255, 255);
+}
+.spectrum--light .spectrum-Link--overBackground:hover {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-Link--overBackground:active {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-Link--overBackground:focus {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-Link--overBackground.is-disabled {
+ color: rgba(255,255,255,0.5);
+ }
+.spectrum--light .spectrum-Button.focus-ring {
+ box-shadow: 0 0 0 1px rgb(20, 115, 230);
+ }
+.spectrum--light .spectrum-Button:active {
+ /* Override focus -- clicking with spacebar should not show outline */
+ box-shadow: none;
+ }
+.spectrum--light .spectrum-ClearButton {
+ background-color: rgba(0, 0, 0, 0);
+
+ color: rgb(142, 142, 142);
+}
+.spectrum--light .spectrum-ClearButton:hover {
+ background-color: rgba(0, 0, 0, 0);
+
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-ClearButton:active {
+ background-color: rgba(0, 0, 0, 0);
+
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-ClearButton.focus-ring {
+ background-color: rgba(0, 0, 0, 0);
+
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-ClearButton:disabled,
+ .spectrum--light .spectrum-ClearButton.is-disabled {
+ background-color: rgba(0, 0, 0, 0);
+
+ color: rgb(179, 179, 179);
+ }
+/* topdoc
+{{ button/button-cta.yml }}
+*/
+.spectrum--light .spectrum-Button--cta {
+ background-color: rgb(20, 115, 230);
+ border-color: rgb(20, 115, 230);
+ color: rgb(255, 255, 255);
+}
+.spectrum--light .spectrum-Button--cta:hover {
+ background-color: rgb(13, 102, 208);
+ border-color: rgb(13, 102, 208);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-Button--cta.focus-ring {
+ background-color: rgb(20, 115, 230);
+ border-color: rgb(20, 115, 230);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-Button--cta:active {
+ background-color: rgb(13, 102, 208);
+ border-color: rgb(13, 102, 208);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-Button--cta:disabled,
+ .spectrum--light .spectrum-Button--cta.is-disabled {
+ background-color: rgb(234, 234, 234);
+ border-color: rgb(234, 234, 234);
+ color: rgb(179, 179, 179);
+ }
+/* topdoc
+{{ button/button-primary.yml }}
+*/
+.spectrum--light .spectrum-Button--primary {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgb(75, 75, 75);
+ color: rgb(75, 75, 75);
+}
+.spectrum--light .spectrum-Button--primary:hover {
+ background-color: rgb(75, 75, 75);
+ border-color: rgb(75, 75, 75);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-Button--primary.focus-ring {
+ background-color: rgb(20, 115, 230);
+ border-color: rgb(20, 115, 230);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-Button--primary:active {
+ background-color: rgb(44, 44, 44);
+ border-color: rgb(44, 44, 44);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-Button--primary:disabled,
+ .spectrum--light .spectrum-Button--primary.is-disabled {
+ background-color: rgb(234, 234, 234);
+ border-color: rgb(234, 234, 234);
+ color: rgb(179, 179, 179);
+ }
+/* topdoc
+{{ button/button-secondary.yml }}
+*/
+.spectrum--light .spectrum-Button--secondary {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgb(110, 110, 110);
+ color: rgb(110, 110, 110);
+}
+.spectrum--light .spectrum-Button--secondary:hover {
+ background-color: rgb(110, 110, 110);
+ border-color: rgb(110, 110, 110);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-Button--secondary.focus-ring {
+ background-color: rgb(20, 115, 230);
+ border-color: rgb(20, 115, 230);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-Button--secondary:active {
+ background-color: rgb(75, 75, 75);
+ border-color: rgb(75, 75, 75);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-Button--secondary:disabled,
+ .spectrum--light .spectrum-Button--secondary.is-disabled {
+ background-color: rgb(234, 234, 234);
+ border-color: rgb(234, 234, 234);
+ color: rgb(179, 179, 179);
+ }
+/* topdoc
+{{ button/button-warning.yml }}
+*/
+.spectrum--light .spectrum-Button--warning {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgb(201, 37, 45);
+ color: rgb(201, 37, 45);
+}
+.spectrum--light .spectrum-Button--warning:hover {
+ background-color: rgb(201, 37, 45);
+ border-color: rgb(201, 37, 45);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-Button--warning.focus-ring {
+ background-color: rgb(20, 115, 230);
+ border-color: rgb(20, 115, 230);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-Button--warning:active {
+ background-color: rgb(187, 18, 26);
+ border-color: rgb(187, 18, 26);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-Button--warning:disabled,
+ .spectrum--light .spectrum-Button--warning.is-disabled {
+ background-color: rgb(234, 234, 234);
+ border-color: rgb(234, 234, 234);
+ color: rgb(179, 179, 179);
+ }
+/* topdoc
+{{ button/button-over-background.yml }}
+*/
+.spectrum--light .spectrum-Button--overBackground {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgb(255, 255, 255);
+ color: rgb(255, 255, 255);
+}
+.spectrum--light .spectrum-Button--overBackground:hover {
+ background-color: rgb(255, 255, 255);
+ border-color: rgb(255, 255, 255);
+ color: inherit;
+ }
+.spectrum--light .spectrum-Button--overBackground.focus-ring {
+ background-color: rgb(255, 255, 255);
+ border-color: rgb(255, 255, 255);
+ color: inherit;
+ box-shadow: 0 0 0 1px rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-Button--overBackground:active {
+ background-color: rgb(255, 255, 255);
+ border-color: rgb(255, 255, 255);
+ color: inherit;
+ box-shadow: none;
+ }
+.spectrum--light .spectrum-Button--overBackground:disabled,
+ .spectrum--light .spectrum-Button--overBackground.is-disabled {
+ background-color: rgba(255,255,255,0.1);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgba(255,255,255,0.35);
+ }
+/* topdoc
+{{ button/button-quiet-over-background.yml }}
+*/
+.spectrum--light .spectrum-Button--overBackground.spectrum-Button--quiet,
+.spectrum--light .spectrum-ClearButton--overBackground {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgb(255, 255, 255);
+}
+.spectrum--light .spectrum-Button--overBackground.spectrum-Button--quiet:hover, .spectrum--light .spectrum-ClearButton--overBackground:hover {
+ background-color: rgba(255,255,255,0.1);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-Button--overBackground.spectrum-Button--quiet.focus-ring, .spectrum--light .spectrum-ClearButton--overBackground.focus-ring {
+ background-color: rgb(255, 255, 255);
+ border-color: rgb(255, 255, 255);
+ color: inherit;
+ box-shadow: 0 0 0 1px rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-Button--overBackground.spectrum-Button--quiet:active, .spectrum--light .spectrum-ClearButton--overBackground:active {
+ background-color: rgba(255,255,255,0.15);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgb(255, 255, 255);
+ box-shadow: none;
+ }
+.spectrum--light .spectrum-Button--overBackground.spectrum-Button--quiet:disabled,
+ .spectrum--light .spectrum-Button--overBackground.spectrum-Button--quiet.is-disabled,
+ .spectrum--light .spectrum-ClearButton--overBackground:disabled,
+ .spectrum--light .spectrum-ClearButton--overBackground.is-disabled {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgba(255,255,255,0.15);
+ }
+/* topdoc
+{{ button/button-quiet-primary.yml }}
+*/
+.spectrum--light .spectrum-Button--primary.spectrum-Button--quiet {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgb(75, 75, 75);
+}
+.spectrum--light .spectrum-Button--primary.spectrum-Button--quiet:hover {
+ background-color: rgb(234, 234, 234);
+ border-color: rgb(234, 234, 234);
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Button--primary.spectrum-Button--quiet.focus-ring {
+ background-color: rgb(20, 115, 230);
+ border-color: rgb(20, 115, 230);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-Button--primary.spectrum-Button--quiet:active {
+ background-color: rgb(225, 225, 225);
+ border-color: rgb(225, 225, 225);
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Button--primary.spectrum-Button--quiet:disabled,
+ .spectrum--light .spectrum-Button--primary.spectrum-Button--quiet.is-disabled {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgb(179, 179, 179);
+ }
+/* topdoc
+{{ button/button-quiet-secondary.yml }}
+*/
+.spectrum--light .spectrum-Button--secondary.spectrum-Button--quiet {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgb(110, 110, 110);
+}
+.spectrum--light .spectrum-Button--secondary.spectrum-Button--quiet:hover {
+ background-color: rgb(234, 234, 234);
+ border-color: rgb(234, 234, 234);
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Button--secondary.spectrum-Button--quiet.focus-ring {
+ background-color: rgb(20, 115, 230);
+ border-color: rgb(20, 115, 230);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-Button--secondary.spectrum-Button--quiet:active {
+ background-color: rgb(225, 225, 225);
+ border-color: rgb(225, 225, 225);
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Button--secondary.spectrum-Button--quiet:disabled,
+ .spectrum--light .spectrum-Button--secondary.spectrum-Button--quiet.is-disabled {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgb(179, 179, 179);
+ }
+/* topdoc
+{{ button/actionbutton.yml }}
+*/
+.spectrum--light .spectrum-ActionButton,
+.spectrum--light .spectrum-Tool {
+ background-color: rgb(250, 250, 250);
+ border-color: rgb(225, 225, 225);
+ color: rgb(75, 75, 75);
+}
+.spectrum--light .spectrum-ActionButton .spectrum-Icon,
+.spectrum--light .spectrum-Tool .spectrum-Icon {
+ color: rgb(110, 110, 110);
+ }
+.spectrum--light .spectrum-ActionButton .spectrum-ActionButton-hold,
+.spectrum--light .spectrum-Tool .spectrum-ActionButton-hold {
+ color: rgb(110, 110, 110);
+ }
+.spectrum--light .spectrum-ActionButton:hover,
+.spectrum--light .spectrum-Tool:hover {
+ background-color: rgb(255, 255, 255);
+ border-color: rgb(202, 202, 202);
+ box-shadow: none;
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-ActionButton:hover .spectrum-Icon,
+.spectrum--light .spectrum-Tool:hover .spectrum-Icon {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-ActionButton:hover .spectrum-ActionButton-hold,
+.spectrum--light .spectrum-Tool:hover .spectrum-ActionButton-hold {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-ActionButton.focus-ring,
+.spectrum--light .spectrum-Tool.focus-ring {
+ background-color: rgb(255, 255, 255);
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-ActionButton.focus-ring .spectrum-Icon,
+.spectrum--light .spectrum-Tool.focus-ring .spectrum-Icon {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-ActionButton.focus-ring .spectrum-ActionButton-hold,
+.spectrum--light .spectrum-Tool.focus-ring .spectrum-ActionButton-hold {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-ActionButton:active,
+.spectrum--light .spectrum-Tool:active {
+ background-color: rgb(234, 234, 234);
+ border-color: rgb(202, 202, 202);
+ box-shadow: none;
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-ActionButton:active .spectrum-ActionButton-hold,
+.spectrum--light .spectrum-Tool:active .spectrum-ActionButton-hold {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-ActionButton:disabled,
+.spectrum--light .spectrum-ActionButton.is-disabled,
+.spectrum--light .spectrum-Tool:disabled {
+ background-color: rgb(234, 234, 234);
+ border-color: rgb(234, 234, 234);
+ color: rgb(179, 179, 179);
+ }
+.spectrum--light .spectrum-ActionButton:disabled .spectrum-Icon,
+.spectrum--light .spectrum-ActionButton.is-disabled .spectrum-Icon,
+.spectrum--light .spectrum-Tool:disabled .spectrum-Icon {
+ color: rgb(202, 202, 202);
+ }
+.spectrum--light .spectrum-ActionButton:disabled .spectrum-ActionButton-hold,
+.spectrum--light .spectrum-ActionButton.is-disabled .spectrum-ActionButton-hold,
+.spectrum--light .spectrum-Tool:disabled .spectrum-ActionButton-hold {
+ color: rgb(202, 202, 202);
+ }
+.spectrum--light .spectrum-ActionButton.is-selected {
+ background-color: rgb(234, 234, 234);
+ border-color: rgb(225, 225, 225);
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-ActionButton.is-selected .spectrum-Icon {
+ color: rgb(110, 110, 110);
+ }
+.spectrum--light .spectrum-ActionButton.is-selected.focus-ring {
+ background-color: rgb(234, 234, 234);
+ border-color: rgb(38, 128, 235);
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-ActionButton.is-selected.focus-ring .spectrum-Icon {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-ActionButton.is-selected:hover {
+ background-color: rgb(234, 234, 234);
+ border-color: rgb(202, 202, 202);
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-ActionButton.is-selected:hover .spectrum-Icon {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-ActionButton.is-selected:active {
+ background-color: rgb(234, 234, 234);
+ border-color: rgb(202, 202, 202);
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-ActionButton.is-selected:active .spectrum-Icon {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-ActionButton.is-selected:disabled,
+ .spectrum--light .spectrum-ActionButton.is-selected.is-disabled {
+ background-color: rgb(234, 234, 234);
+ border-color: rgb(234, 234, 234);
+ color: rgb(179, 179, 179);
+ }
+.spectrum--light .spectrum-ActionButton.is-selected:disabled .spectrum-Icon, .spectrum--light .spectrum-ActionButton.is-selected.is-disabled .spectrum-Icon {
+ color: rgb(202, 202, 202);
+ }
+/* topdoc
+{{ button/actionbutton-quiet.yml }}
+*/
+.spectrum--light .spectrum-ActionButton--quiet,
+.spectrum--light .spectrum-Tool {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgb(75, 75, 75);
+}
+.spectrum--light .spectrum-ActionButton--quiet:hover,
+.spectrum--light .spectrum-Tool:hover {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgb(44, 44, 44);
+ box-shadow: none;
+ }
+.spectrum--light .spectrum-ActionButton--quiet.focus-ring,
+.spectrum--light .spectrum-Tool.focus-ring {
+ background-color: rgba(0, 0, 0, 0);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ border-color: rgb(38, 128, 235);
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-ActionButton--quiet:active,
+.spectrum--light .spectrum-Tool:active {
+ background-color: rgb(225, 225, 225);
+ border-color: rgb(225, 225, 225);
+ color: rgb(44, 44, 44);
+ box-shadow: none;
+ }
+.spectrum--light .spectrum-ActionButton--quiet:disabled,
+.spectrum--light .spectrum-ActionButton--quiet.is-disabled,
+.spectrum--light .spectrum-Tool:disabled {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgb(179, 179, 179);
+ }
+.spectrum--light .spectrum-ActionButton--quiet.is-selected {
+ background-color: rgb(225, 225, 225);
+ border-color: rgb(225, 225, 225);
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-ActionButton--quiet.is-selected.focus-ring {
+ background-color: rgb(225, 225, 225);
+ border-color: rgb(38, 128, 235);
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-ActionButton--quiet.is-selected:hover {
+ background-color: rgb(225, 225, 225);
+ border-color: rgb(225, 225, 225);
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-ActionButton--quiet.is-selected:active {
+ background-color: rgb(225, 225, 225);
+ border-color: rgb(225, 225, 225);
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-ActionButton--quiet.is-selected:disabled,
+ .spectrum--light .spectrum-ActionButton--quiet.is-selected.is-disabled {
+ background-color: rgb(234, 234, 234);
+ border-color: rgb(234, 234, 234);
+ color: rgb(179, 179, 179);
+ }
+/* topdoc
+{{ button/button-quiet-warning.yml }}
+*/
+.spectrum--light .spectrum-Button--warning.spectrum-Button--quiet {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgb(215, 55, 63);
+}
+.spectrum--light .spectrum-Button--warning.spectrum-Button--quiet:hover {
+ background-color: rgb(234, 234, 234);
+ border-color: rgb(234, 234, 234);
+ color: rgb(201, 37, 45);
+ }
+.spectrum--light .spectrum-Button--warning.spectrum-Button--quiet.focus-ring {
+ background-color: rgb(20, 115, 230);
+ border-color: rgb(20, 115, 230);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-Button--warning.spectrum-Button--quiet:active {
+ background-color: rgb(225, 225, 225);
+ border-color: rgb(225, 225, 225);
+ color: rgb(201, 37, 45);
+ }
+.spectrum--light .spectrum-Button--warning.spectrum-Button--quiet:disabled,
+ .spectrum--light .spectrum-Button--warning.spectrum-Button--quiet.is-disabled {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgb(179, 179, 179);
+ }
+/* topdoc
+{{ button/logicbutton.yml }}
+*/
+.spectrum--light .spectrum-LogicButton--and {
+ background-color: rgb(20, 115, 230);
+ border-color: rgb(20, 115, 230);
+ color: rgb(255, 255, 255);
+}
+.spectrum--light .spectrum-LogicButton--and:hover {
+ background-color: rgb(9, 90, 186);
+ border-color: rgb(9, 90, 186);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-LogicButton--and.focus-ring {
+ background-color: rgb(9, 90, 186);
+ border-color: rgb(38, 128, 235);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-LogicButton--and:disabled,
+ .spectrum--light .spectrum-LogicButton--and.is-disabled {
+ background-color: rgb(234, 234, 234);
+ border-color: rgb(234, 234, 234);
+ color: rgb(179, 179, 179);
+ }
+.spectrum--light .spectrum-LogicButton--or {
+ background-color: rgb(206, 39, 131);
+ border-color: rgb(206, 39, 131);
+ color: rgb(255, 255, 255);
+}
+.spectrum--light .spectrum-LogicButton--or:hover {
+ background-color: rgb(174, 14, 102);
+ border-color: rgb(174, 14, 102);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-LogicButton--or.focus-ring {
+ background-color: rgb(174, 14, 102);
+ border-color: rgb(38, 128, 235);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-LogicButton--or:disabled,
+ .spectrum--light .spectrum-LogicButton--or.is-disabled {
+ background-color: rgb(234, 234, 234);
+ border-color: rgb(234, 234, 234);
+ color: rgb(179, 179, 179);
+ }
+/* topdoc
+{{ button/clearbutton-medium.yml }}
+*/
+.spectrum--light .spectrum-FieldButton {
+ color: rgb(75, 75, 75);
+ background-color: rgb(250, 250, 250);
+ border-color: rgb(225, 225, 225);
+}
+.spectrum--light .spectrum-FieldButton:hover {
+ color: rgb(44, 44, 44);
+ background-color: rgb(255, 255, 255);
+ border-color: rgb(202, 202, 202);
+ }
+.spectrum--light .spectrum-FieldButton.focus-ring,
+ .spectrum--light .spectrum-FieldButton.is-focused {
+ background-color: rgb(255, 255, 255);
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-FieldButton.focus-ring.is-placeholder, .spectrum--light .spectrum-FieldButton.is-focused.is-placeholder {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-FieldButton:active,
+ .spectrum--light .spectrum-FieldButton.is-selected {
+ background-color: rgb(234, 234, 234);
+ border-color: rgb(202, 202, 202);
+ }
+.spectrum--light .spectrum-FieldButton:active.focus-ring,
+ .spectrum--light .spectrum-FieldButton:active.is-focused,
+ .spectrum--light .spectrum-FieldButton.is-selected.focus-ring,
+ .spectrum--light .spectrum-FieldButton.is-selected.is-focused {
+ box-shadow: none;
+ }
+.spectrum--light .spectrum-FieldButton.is-invalid {
+ border-color: rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-FieldButton.is-invalid:hover {
+ border-color: rgb(201, 37, 45);
+ }
+.spectrum--light .spectrum-FieldButton.is-invalid:active,
+ .spectrum--light .spectrum-FieldButton.is-invalid.is-selected {
+ border-color: rgb(201, 37, 45);
+ }
+.spectrum--light .spectrum-FieldButton.is-invalid.focus-ring,
+ .spectrum--light .spectrum-FieldButton.is-invalid.is-focused {
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-FieldButton:disabled,
+ .spectrum--light .spectrum-FieldButton.is-disabled {
+ background-color: rgb(234, 234, 234);
+ color: rgb(179, 179, 179);
+ }
+.spectrum--light .spectrum-FieldButton:disabled.focus-ring, .spectrum--light .spectrum-FieldButton.is-disabled.focus-ring {
+ box-shadow: none;
+ }
+.spectrum--light .spectrum-FieldButton:disabled .spectrum-Icon, .spectrum--light .spectrum-FieldButton.is-disabled .spectrum-Icon {
+ color: rgb(202, 202, 202);
+ }
+.spectrum--light .spectrum-FieldButton--quiet {
+ color: rgb(75, 75, 75);
+ border-color: rgba(0, 0, 0, 0);
+ background-color: rgba(0, 0, 0, 0);
+}
+.spectrum--light .spectrum-FieldButton--quiet:hover {
+ background-color: rgba(0, 0, 0, 0);
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-FieldButton--quiet.focus-ring,
+ .spectrum--light .spectrum-FieldButton--quiet.is-focused {
+ background-color: rgba(0, 0, 0, 0);
+ box-shadow: 0 2px 0 0 rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-FieldButton--quiet.focus-ring.is-placeholder, .spectrum--light .spectrum-FieldButton--quiet.is-focused.is-placeholder {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-FieldButton--quiet:active,
+ .spectrum--light .spectrum-FieldButton--quiet.is-selected {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgba(0, 0, 0, 0);
+ }
+.spectrum--light .spectrum-FieldButton--quiet:active.focus-ring,
+ .spectrum--light .spectrum-FieldButton--quiet:active.is-focused,
+ .spectrum--light .spectrum-FieldButton--quiet.is-selected.focus-ring,
+ .spectrum--light .spectrum-FieldButton--quiet.is-selected.is-focused {
+ background-color: rgba(0, 0, 0, 0);
+ box-shadow: 0 2px 0 0 rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-FieldButton--quiet.is-invalid.focus-ring,
+ .spectrum--light .spectrum-FieldButton--quiet.is-invalid.is-focused {
+ box-shadow: 0 2px 0 0 rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-FieldButton--quiet:disabled,
+ .spectrum--light .spectrum-FieldButton--quiet.is-disabled {
+ background-color: rgba(0, 0, 0, 0);
+ color: rgb(179, 179, 179);
+ }
+.spectrum--light .spectrum-FieldButton--quiet:disabled.focus-ring, .spectrum--light .spectrum-FieldButton--quiet.is-disabled.focus-ring {
+ box-shadow: none;
+ }
+.spectrum--light .spectrum-Tool.is-selected .spectrum-Icon {
+ color: rgb(20, 115, 230);
+ }
+.spectrum--light .spectrum-Tool.is-selected .spectrum-Tool-hold {
+ color: rgb(20, 115, 230);
+ }
+.spectrum--light .spectrum-Tool.is-selected:hover .spectrum-Icon {
+ color: rgb(13, 102, 208);
+ }
+.spectrum--light .spectrum-Tool.is-selected:hover .spectrum-Tool-hold {
+ color: rgb(13, 102, 208);
+ }
+.spectrum--light .spectrum-Tool.is-selected:active .spectrum-Icon {
+ color: rgb(9, 90, 186);
+ }
+.spectrum--light .spectrum-Tool.is-selected:active .spectrum-Tool-hold {
+ color: rgb(9, 90, 186);
+ }
+.spectrum--light .spectrum-Tool.is-selected.focus-ring .spectrum-Icon {
+ color: rgb(13, 102, 208);
+ }
+.spectrum--light .spectrum-Tool.is-selected.focus-ring .spectrum-Tool-hold {
+ color: rgb(13, 102, 208);
+ }
+.spectrum--light .spectrum-Tool.is-selected:disabled,
+ .spectrum--light .spectrum-Tool.is-selected.is-disabled {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgba(0, 0, 0, 0);
+ }
+.spectrum--light .spectrum-Tool.is-selected:disabled .spectrum-Icon, .spectrum--light .spectrum-Tool.is-selected.is-disabled .spectrum-Icon {
+ color: rgb(202, 202, 202);
+ }
+.spectrum--light .spectrum-Tool.is-selected:disabled .spectrum-Tool-hold, .spectrum--light .spectrum-Tool.is-selected.is-disabled .spectrum-Tool-hold {
+ color: rgb(202, 202, 202);
+ }
+.spectrum--light .spectrum-Tool .spectrum-Tool-hold {
+ color: rgb(110, 110, 110);
+ }
+.spectrum--light .spectrum-Tool:hover .spectrum-Tool-hold {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Tool:active {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgba(0, 0, 0, 0);
+ }
+.spectrum--light .spectrum-Tool:active .spectrum-Tool-hold {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Tool.focus-ring .spectrum-Tool-hold {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Tool.is-disabled .spectrum-Tool-hold, .spectrum--light .spectrum-Tool:disabled .spectrum-Tool-hold {
+ color: rgb(202, 202, 202);
+ }
+.spectrum--light .spectrum-Breadcrumbs-item {
+ color: rgb(110, 110, 110);
+}
+.spectrum--light .spectrum-Breadcrumbs-item .spectrum-Breadcrumbs-itemSeparator {
+ color: rgb(179, 179, 179);
+ }
+.spectrum--light .spectrum-Breadcrumbs-item .spectrum-Breadcrumbs-itemLink {
+ color: inherit;
+ text-decoration: none;
+ }
+.spectrum--light .spectrum-Breadcrumbs-item .spectrum-Breadcrumbs-itemLink:hover {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Breadcrumbs-item .spectrum-Breadcrumbs-itemLink.focus-ring {
+ color: rgb(13, 102, 208);
+ outline: 0;
+ border-bottom: 2px solid rgb(13, 102, 208);
+ }
+.spectrum--light .spectrum-Breadcrumbs-item .spectrum-Breadcrumbs-itemLink:active {
+ color: rgb(44, 44, 44);
+ border-bottom: 0;
+ }
+.spectrum--light .spectrum-Breadcrumbs-item.is-selected,
+ .spectrum--light .spectrum-Breadcrumbs-item:last-of-type {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Breadcrumbs-item.is-selected ~ .spectrum-Breadcrumb:last-of-type {
+ color: rgb(110, 110, 110);
+ }
+.spectrum--light .spectrum-Breadcrumbs-item.is-selected .spectrum-Breadcrumbs-itemLink.focus-ring {
+ color: rgb(44, 44, 44);
+ border-bottom: 0;
+ }
+/* topdoc
+{{ breadcrumb/breadcrumb-title.yml }}
+*/
+.spectrum--light .spectrum-Label {
+ color: rgb(255, 255, 255);
+}
+/* topdoc
+{{ label/label-special.yml }}
+*/
+.spectrum--light .spectrum-Label--inactive,
+.spectrum--light .spectrum-Label--grey {
+ background-color: rgb(116, 116, 116);
+}
+/* topdoc
+{{ breadcrumb/breadcrumb.yml }}
+*/
+.spectrum--light .spectrum-Label--red {
+ background-color: rgb(215, 55, 63);
+}
+.spectrum--light .spectrum-Label--orange, .spectrum--light .spectrum-Label--or {
+ background-color: rgb(218, 123, 17);
+}
+.spectrum--light .spectrum-Label--yellow {
+ background-color: rgb(223, 191, 0);
+}
+.spectrum--light .spectrum-Label--seafoam {
+ background-color: rgb(27, 149, 154);
+}
+.spectrum--light .spectrum-Label--green {
+ background-color: rgb(38, 142, 108);
+}
+.spectrum--light .spectrum-Label--blue, .spectrum--light .spectrum-Label--active, .spectrum--light .spectrum-Label--and {
+ background-color: rgb(20, 115, 230);
+}
+.spectrum--light .spectrum-Label--fuchsia {
+ background-color: rgb(192, 56, 204);
+}
+.spectrum--light .spectrum-Alert {
+ background-color: rgb(255, 255, 255);
+ /* default color set to body color, header element overwrites this */
+ color: rgb(110, 110, 110);
+}
+.spectrum--light .spectrum-Alert-header {
+ color: rgb(44, 44, 44);
+}
+.spectrum--light .spectrum-Alert-content {
+ color: rgb(110, 110, 110);
+}
+/* topdoc
+{{ alert/alert-info.yml }}
+*/
+.spectrum--light .spectrum-Alert--info {
+ border-color: rgb(38, 128, 235);
+}
+.spectrum--light .spectrum-Alert--info .spectrum-Alert-icon {
+ color: rgb(38, 128, 235);
+ }
+/* topdoc
+{{ alert/alert-help.yml }}
+*/
+.spectrum--light .spectrum-Alert--help {
+ border-color: rgb(38, 128, 235);
+}
+.spectrum--light .spectrum-Alert--help .spectrum-Alert-icon {
+ color: rgb(38, 128, 235);
+ }
+/* topdoc
+{{ alert/alert-error.yml }}
+*/
+.spectrum--light .spectrum-Alert--error {
+ border-color: rgb(227, 72, 80);
+}
+.spectrum--light .spectrum-Alert--error .spectrum-Alert-icon {
+ color: rgb(227, 72, 80);
+ }
+/* topdoc
+{{ alert/alert-success.yml }}
+*/
+.spectrum--light .spectrum-Alert--success {
+ border-color: rgb(45, 157, 120);
+}
+.spectrum--light .spectrum-Alert--success .spectrum-Alert-icon {
+ color: rgb(45, 157, 120);
+ }
+/* topdoc
+{{ alert/alert-warning.yml }}
+*/
+.spectrum--light .spectrum-Alert--warning {
+ border-color: rgb(230, 134, 25);
+}
+.spectrum--light .spectrum-Alert--warning .spectrum-Alert-icon {
+ color: rgb(230, 134, 25);
+ }
+.spectrum--light .spectrum-Avatar {
+ opacity: 1;
+}
+.spectrum--light .spectrum-Avatar.is-disabled {
+ opacity: 0.3;
+ }
+.spectrum--light .spectrum-Checkbox-label {
+ color: rgb(75, 75, 75);
+}
+.spectrum--light .spectrum-Checkbox-checkmark,
+.spectrum--light .spectrum-Checkbox-partialCheckmark {
+ color: rgb(250, 250, 250);
+}
+.spectrum--light .spectrum-Checkbox-box {
+ border-color: rgb(142, 142, 142);
+ background-color: rgb(250, 250, 250);
+}
+/* Indetermiate is basically a checked state, so handle colors for checked state here */
+.spectrum--light .spectrum-Checkbox.is-indeterminate .spectrum-Checkbox-box,
+.spectrum--light .spectrum-Checkbox-input:checked + .spectrum-Checkbox-box {
+ border-color: rgb(20, 115, 230);
+}
+.spectrum--light .spectrum-Checkbox:hover.is-indeterminate .spectrum-Checkbox-box,
+ .spectrum--light .spectrum-Checkbox:hover .spectrum-Checkbox-input:checked + .spectrum-Checkbox-box {
+ border-color: rgb(13, 102, 208);
+
+ }
+.spectrum--light .spectrum-Checkbox:active.is-indeterminate .spectrum-Checkbox-box,
+ .spectrum--light .spectrum-Checkbox:active .spectrum-Checkbox-input:checked + .spectrum-Checkbox-box {
+ border-color: rgb(9, 90, 186);
+
+ }
+/* topdoc
+{{ checkbox/checkbox.yml }}
+*/
+.spectrum--light .spectrum-Checkbox {
+ border-color: rgb(142, 142, 142);
+}
+.spectrum--light .spectrum-Checkbox:hover .spectrum-Checkbox-box {
+ border-color: rgb(110, 110, 110);
+
+ box-shadow: none;
+ }
+.spectrum--light .spectrum-Checkbox:hover .spectrum-Checkbox-label {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Checkbox:active .spectrum-Checkbox-box {
+ border-color: rgb(75, 75, 75);
+
+ }
+.spectrum--light .spectrum-Checkbox:active .spectrum-Checkbox-label {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Checkbox-input:disabled + .spectrum-Checkbox-box {
+ /* Use important to override hover states */
+ border-color: rgb(202, 202, 202) !important;
+
+ background-color: rgb(250, 250, 250);
+ }
+.spectrum--light .spectrum-Checkbox-input:disabled ~ .spectrum-Checkbox-label {
+ color: rgb(179, 179, 179);
+ }
+/* Focus */
+.spectrum--light .spectrum-Checkbox-input.focus-ring + .spectrum-Checkbox-box {
+ /* Since the specificity of .focus-ring is less than :hover, we need important */
+ border-color: rgb(38, 128, 235) !important;
+
+ box-shadow: 0 0 0 1px rgb(38, 128, 235) !important;
+ }
+.spectrum--light .spectrum-Checkbox-input.focus-ring ~ .spectrum-Checkbox-label {
+ color: rgb(13, 102, 208) !important;
+ }
+/* topdoc
+{{ checkbox/checkbox-quiet.yml }}
+*/
+.spectrum--light .spectrum-Checkbox--quiet.is-indeterminate .spectrum-Checkbox-box,
+ .spectrum--light .spectrum-Checkbox--quiet .spectrum-Checkbox-input:checked + .spectrum-Checkbox-box {
+ border-color: rgb(110, 110, 110);
+}
+.spectrum--light .spectrum-Checkbox--quiet:hover.is-indeterminate .spectrum-Checkbox-box,
+ .spectrum--light .spectrum-Checkbox--quiet:hover .spectrum-Checkbox-input:checked + .spectrum-Checkbox-box {
+ border-color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Checkbox--quiet:active.is-indeterminate .spectrum-Checkbox-box,
+ .spectrum--light .spectrum-Checkbox--quiet:active .spectrum-Checkbox-input:checked + .spectrum-Checkbox-box {
+ border-color: rgb(44, 44, 44);
+ }
+/* Extra-specific selectors added here to handle checked state */
+.spectrum--light .spectrum-Checkbox.is-invalid .spectrum-Checkbox-input:checked + .spectrum-Checkbox-box,
+ .spectrum--light .spectrum-Checkbox.is-invalid .spectrum-Checkbox-box {
+ border-color: rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Checkbox.is-invalid .spectrum-Checkbox-label {
+ color: rgb(201, 37, 45);
+ }
+.spectrum--light .spectrum-Checkbox.is-invalid:hover .spectrum-Checkbox-input:checked + .spectrum-Checkbox-box,
+ .spectrum--light .spectrum-Checkbox.is-invalid:hover .spectrum-Checkbox-box {
+ border-color: rgb(201, 37, 45);
+ }
+.spectrum--light .spectrum-Checkbox.is-invalid:hover .spectrum-Checkbox-label {
+ color: rgb(187, 18, 26);
+ }
+.spectrum--light .spectrum-Checkbox.is-invalid:active .spectrum-Checkbox-input:checked + .spectrum-Checkbox-box,
+ .spectrum--light .spectrum-Checkbox.is-invalid:active .spectrum-Checkbox-box {
+ border-color: rgb(187, 18, 26);
+ }
+.spectrum--light .spectrum-Checkbox.is-invalid:active .spectrum-Checkbox-label {
+ color: rgb(187, 18, 26);
+ }
+.spectrum--light .spectrum-Radio .spectrum-Radio-input:checked + .spectrum-Radio-button {
+ border-color: rgb(20, 115, 230);
+ }
+.spectrum--light .spectrum-Radio-label {
+ color: rgb(75, 75, 75);
+}
+.spectrum--light .spectrum-Radio-button {
+ background-color: rgb(250, 250, 250);
+ border-color: rgb(142, 142, 142);
+}
+/* topdoc
+{{ radio/radio.yml }}
+*/
+.spectrum--light .spectrum-Radio:hover .spectrum-Radio-button {
+ border-color: rgb(110, 110, 110);
+ box-shadow: none;
+ }
+.spectrum--light .spectrum-Radio:hover .spectrum-Radio-input:checked + .spectrum-Radio-button {
+ border-color: rgb(13, 102, 208);
+
+ }
+.spectrum--light .spectrum-Radio:hover .spectrum-Radio-label {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Radio:active .spectrum-Radio-button {
+ border-color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Radio:active .spectrum-Radio-input:checked + .spectrum-Radio-button {
+ border-color: rgb(9, 90, 186);
+
+ }
+.spectrum--light .spectrum-Radio:active .spectrum-Radio-label {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Radio--quiet .spectrum-Radio-input:checked + .spectrum-Radio-button {
+ border-color: rgb(110, 110, 110);
+ }
+.spectrum--light .spectrum-Radio--quiet:hover .spectrum-Radio-input:checked + .spectrum-Radio-button {
+ border-color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Radio--quiet:active .spectrum-Radio-input:checked + .spectrum-Radio-button {
+ border-color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Radio.is-invalid:hover .spectrum-Radio-input + .spectrum-Radio-button, .spectrum--light .spectrum-Radio--quiet.is-invalid:hover .spectrum-Radio-input + .spectrum-Radio-button {
+ border-color: rgb(201, 37, 45);
+ }
+.spectrum--light .spectrum-Radio.is-invalid:hover .spectrum-Radio-label, .spectrum--light .spectrum-Radio--quiet.is-invalid:hover .spectrum-Radio-label {
+ color: rgb(201, 37, 45);
+ }
+.spectrum--light .spectrum-Radio.is-invalid:active .spectrum-Radio-input + .spectrum-Radio-button, .spectrum--light .spectrum-Radio--quiet.is-invalid:active .spectrum-Radio-input + .spectrum-Radio-button {
+ border-color: rgb(187, 18, 26);
+ }
+.spectrum--light .spectrum-Radio.is-invalid:active .spectrum-Radio-label, .spectrum--light .spectrum-Radio--quiet.is-invalid:active .spectrum-Radio-label {
+ color: rgb(187, 18, 26);
+ }
+.spectrum--light .spectrum-Radio.is-invalid .spectrum-Radio-button, .spectrum--light .spectrum-Radio.is-invalid .spectrum-Radio-input:checked + .spectrum-Radio-button, .spectrum--light .spectrum-Radio--quiet.is-invalid .spectrum-Radio-button, .spectrum--light .spectrum-Radio--quiet.is-invalid .spectrum-Radio-input:checked + .spectrum-Radio-button {
+ border-color: rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Radio.is-invalid .spectrum-Radio-label, .spectrum--light .spectrum-Radio--quiet.is-invalid .spectrum-Radio-label {
+ color: rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Radio-input:disabled + .spectrum-Radio-button {
+ border-color: rgb(202, 202, 202) !important;
+ }
+.spectrum--light .spectrum-Radio-input:disabled ~ .spectrum-Radio-label {
+ color: rgb(179, 179, 179) !important;
+ }
+/* Focus Overrides all */
+.spectrum--light .spectrum-Radio .spectrum-Radio-input.focus-ring + .spectrum-Radio-button, .spectrum--light .spectrum-Radio:hover .spectrum-Radio-input.focus-ring + .spectrum-Radio-button, .spectrum--light .spectrum-Radio--quiet .spectrum-Radio-input.focus-ring + .spectrum-Radio-button, .spectrum--light .spectrum-Radio--quiet:hover .spectrum-Radio-input.focus-ring + .spectrum-Radio-button {
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Radio .spectrum-Radio-input.focus-ring ~ .spectrum-Radio-label, .spectrum--light .spectrum-Radio:hover .spectrum-Radio-input.focus-ring ~ .spectrum-Radio-label, .spectrum--light .spectrum-Radio--quiet .spectrum-Radio-input.focus-ring ~ .spectrum-Radio-label, .spectrum--light .spectrum-Radio--quiet:hover .spectrum-Radio-input.focus-ring ~ .spectrum-Radio-label {
+ color: rgb(13, 102, 208);
+ }
+.spectrum--light .spectrum-Radio.is-invalid .spectrum-Radio-input:checked.focus-ring + .spectrum-Radio-button, .spectrum--light .spectrum-Radio--quiet.is-invalid .spectrum-Radio-input:checked.focus-ring + .spectrum-Radio-button {
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+/* topdoc
+{{ textfield/textfield.yml }}
+*/
+.spectrum--light .spectrum-Textfield {
+ background-color: rgb(255, 255, 255);
+ border-color: rgb(225, 225, 225);
+ color: rgb(75, 75, 75);
+}
+/* topdoc
+{{ textfield/textarea-quiet.yml }}
+*/
+.spectrum--light .spectrum-Textfield::placeholder {
+ color: rgb(142, 142, 142);
+ }
+/* topdoc
+{{ textfield/textarea.yml }}
+*/
+.spectrum--light .spectrum-Textfield:hover {
+ border-color: rgb(202, 202, 202);
+ box-shadow: none;
+ }
+.spectrum--light .spectrum-Textfield:hover::placeholder {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Textfield:focus {
+ border-color: rgb(20, 115, 230);
+ }
+.spectrum--light .spectrum-Textfield.focus-ring:not(:active) {
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Textfield[disabled] {
+ background-color: rgb(234, 234, 234);
+ border-color: rgba(0, 0, 0, 0);
+ color: rgb(179, 179, 179);
+
+ /* For safari mobile browser */
+ -webkit-text-fill-color: rgb(179, 179, 179);
+ }
+.spectrum--light .spectrum-Textfield[disabled]::placeholder {
+ color: rgb(179, 179, 179);
+ }
+.spectrum--light .spectrum-Textfield.is-invalid,
+ .spectrum--light .spectrum-Textfield:invalid {
+ border-color: rgb(215, 55, 63);
+ background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' height='18' viewBox='0 0 18 18' width='18'%3E%3Cpath style='fill:rgb%28227%2C 72%2C 80%29' d='M8.564 1.289L.2 16.256A.5.5 0 0 0 .636 17h16.728a.5.5 0 0 0 .5-.5.494.494 0 0 0-.064-.244L9.436 1.289a.5.5 0 0 0-.872 0zM10 14.75a.25.25 0 0 1-.25.25h-1.5a.25.25 0 0 1-.25-.25v-1.5a.25.25 0 0 1 .25-.25h1.5a.25.25 0 0 1 .25.25zm0-3a.25.25 0 0 1-.25.25h-1.5a.25.25 0 0 1-.25-.25v-6a.25.25 0 0 1 .25-.25h1.5a.25.25 0 0 1 .25.25z'/%3E%3C/svg%3E");
+ }
+/* might break things due to pre-defined focus-ring */
+.spectrum--light .spectrum-Textfield.is-invalid.focus-ring:not(:active), .spectrum--light .spectrum-Textfield:invalid.focus-ring:not(:active) {
+ border-color: rgb(215, 55, 63);
+ box-shadow: 0 0 0 1px rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Textfield.is-valid {
+ background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' height='12' viewBox='0 0 12 12' width='12'%3E%3Cpath style='fill:rgb%2818%2C 128%2C 92%29' d='M4.5 10a1.023 1.023 0 0 1-.8-.384l-2.488-3a1 1 0 0 1 1.577-1.233L4.5 7.376l4.712-5.991a1 1 0 1 1 1.576 1.23l-5.511 7A.977.977 0 0 1 4.5 10z'/%3E%3C/svg%3E");
+ }
+/* topdoc
+{{ textfield/textfield-quiet.yml }}
+*/
+.spectrum--light .spectrum-Textfield--quiet {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgb(225, 225, 225);
+}
+.spectrum--light .spectrum-Textfield--quiet:hover {
+ border-color: rgb(202, 202, 202);
+ }
+.spectrum--light .spectrum-Textfield--quiet:active {
+ border-color: rgb(20, 115, 230);
+ }
+.spectrum--light .spectrum-Textfield--quiet:focus {
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 1px 0 rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Textfield--quiet.focus-ring:not(:active) {
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 1px 0 rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Textfield--quiet:disabled {
+ background-color: rgba(0, 0, 0, 0);
+ border-color: rgb(225, 225, 225);
+ }
+.spectrum--light .spectrum-Textfield--quiet.is-invalid,
+ .spectrum--light .spectrum-Textfield--quiet:invalid {
+ border-color: rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Textfield--quiet.is-invalid:focus, .spectrum--light .spectrum-Textfield--quiet:invalid:focus {
+ box-shadow: 0 1px 0 rgb(215, 55, 63);
+ }
+/* might break things due to pre-defined focus-ring */
+.spectrum--light .spectrum-Textfield--quiet.is-invalid.focus-ring:not(:active), .spectrum--light .spectrum-Textfield--quiet:invalid.focus-ring:not(:active) {
+ border-color: rgb(215, 55, 63);
+ box-shadow: 0 1px 0 rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-InputGroup:hover .spectrum-InputGroup-field:not(:disabled):not(.is-invalid):not(:focus),
+ .spectrum--light .spectrum-InputGroup:hover .spectrum-InputGroup-field:not(:disabled):not(.is-invalid):not(:focus) ~ .spectrum-FieldButton {
+ border-color: rgb(202, 202, 202);
+ }
+.spectrum--light .spectrum-InputGroup-field:focus ~ .spectrum-FieldButton {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-InputGroup-field:focus.is-invalid ~ .spectrum-FieldButton, .spectrum--light .spectrum-InputGroup-field:focus:invalid ~ .spectrum-FieldButton {
+ border-color: rgb(215, 55, 63);
+ }
+/* Only add the 2px ring for keyboard focus */
+.spectrum--light .spectrum-InputGroup-field.focus-ring ~ .spectrum-FieldButton {
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-InputGroup-field.focus-ring.is-invalid ~ .spectrum-FieldButton, .spectrum--light .spectrum-InputGroup-field.focus-ring:invalid ~ .spectrum-FieldButton {
+ box-shadow: 0 0 0 1px rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-InputGroup--quiet .spectrum-FieldButton,
+ .spectrum--light .spectrum-InputGroup--quiet .spectrum-FieldButton:hover,
+ .spectrum--light .spectrum-InputGroup--quiet .spectrum-FieldButton:focus,
+ .spectrum--light .spectrum-InputGroup--quiet .spectrum-FieldButton:active,
+ .spectrum--light .spectrum-InputGroup--quiet .spectrum-FieldButton.is-selected,
+ .spectrum--light .spectrum-InputGroup--quiet .spectrum-FieldButton:invalid,
+ .spectrum--light .spectrum-InputGroup--quiet .spectrum-FieldButton.is-invalid,
+ .spectrum--light .spectrum-InputGroup--quiet .spectrum-FieldButton:disabled,
+ .spectrum--light .spectrum-InputGroup--quiet .spectrum-FieldButton:disabled:hover {
+ border-color: rgb(225, 225, 225);
+ }
+.spectrum--light .spectrum-InputGroup--quiet:hover .spectrum-InputGroup-field:not(:disabled):not(.is-invalid):not(:focus),
+ .spectrum--light .spectrum-InputGroup--quiet:hover .spectrum-InputGroup-field:not(:disabled):not(.is-invalid):not(:focus) ~ .spectrum-FieldButton {
+ border-color: rgb(202, 202, 202);
+ }
+.spectrum--light .spectrum-InputGroup--quiet .spectrum-InputGroup-field.is-invalid,
+ .spectrum--light .spectrum-InputGroup--quiet .spectrum-InputGroup-field.is-invalid ~ .spectrum-FieldButton,
+ .spectrum--light .spectrum-InputGroup--quiet .spectrum-InputGroup-field:invalid,
+ .spectrum--light .spectrum-InputGroup--quiet .spectrum-InputGroup-field:invalid ~ .spectrum-FieldButton {
+ border-color: rgb(215, 55, 63);
+ }
+/* Always add the 2px ring for keyboard focus for quiet inputgroups */
+.spectrum--light .spectrum-InputGroup--quiet .spectrum-InputGroup-field:focus ~ .spectrum-FieldButton {
+ box-shadow: 0 1px 0 rgb(38, 128, 235);
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-InputGroup--quiet .spectrum-InputGroup-field:focus.is-invalid ~ .spectrum-FieldButton, .spectrum--light .spectrum-InputGroup--quiet .spectrum-InputGroup-field:focus:invalid ~ .spectrum-FieldButton {
+ box-shadow: 0 1px 0 rgb(215, 55, 63);
+ border-color: rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Tooltip {
+ background-color: rgb(116, 116, 116);
+
+ color: rgb(255, 255, 255);
+}
+.spectrum--light .spectrum-Tooltip-tip {
+ border-top-color: rgb(116, 116, 116);
+}
+.spectrum--light .spectrum-Tooltip--negative,
+.spectrum--light .spectrum-Tooltip--error {
+ background-color: rgb(201, 37, 45);
+}
+.spectrum--light .spectrum-Tooltip--negative .spectrum-Tooltip-tip, .spectrum--light .spectrum-Tooltip--error .spectrum-Tooltip-tip {
+ border-top-color: rgb(201, 37, 45);
+ }
+.spectrum--light .spectrum-Tooltip--info,
+.spectrum--light .spectrum-Tooltip--help {
+ background-color: rgb(13, 102, 208);
+}
+.spectrum--light .spectrum-Tooltip--info .spectrum-Tooltip-tip, .spectrum--light .spectrum-Tooltip--help .spectrum-Tooltip-tip {
+ border-top-color: rgb(13, 102, 208);
+ }
+.spectrum--light .spectrum-Tooltip--positive,
+.spectrum--light .spectrum-Tooltip--success {
+ background-color: rgb(18, 128, 92);
+}
+.spectrum--light .spectrum-Tooltip--positive .spectrum-Tooltip-tip, .spectrum--light .spectrum-Tooltip--success .spectrum-Tooltip-tip {
+ border-top-color: rgb(18, 128, 92);
+ }
+.spectrum--light .spectrum-BarLoader .spectrum-BarLoader-fill {
+ background: rgb(20, 115, 230);
+ }
+.spectrum--light .spectrum-BarLoader .spectrum-BarLoader-track {
+ background-color: rgb(225, 225, 225);
+ }
+.spectrum--light .spectrum-BarLoader.spectrum-BarLoader--overBackground .spectrum-BarLoader-fill {
+ background: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-BarLoader.spectrum-BarLoader--overBackground .spectrum-BarLoader-label,
+ .spectrum--light .spectrum-BarLoader.spectrum-BarLoader--overBackground .spectrum-BarLoader-percentage {
+ color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-BarLoader.spectrum-BarLoader--overBackground .spectrum-BarLoader-track {
+ background-color: rgba(255,255,255,0.2);
+ }
+.spectrum--light .spectrum-BarLoader.is-positive .spectrum-BarLoader-fill {
+ background: rgb(45, 157, 120);
+ }
+.spectrum--light .spectrum-BarLoader.is-warning .spectrum-BarLoader-fill {
+ background: rgb(230, 134, 25);
+ }
+.spectrum--light .spectrum-BarLoader.is-critical .spectrum-BarLoader-fill {
+ background: rgb(227, 72, 80);
+ }
+.spectrum--light .spectrum-BarLoader-label,
+.spectrum--light .spectrum-BarLoader-percentage {
+ color: rgb(110, 110, 110);
+}
+.spectrum--light .spectrum-BarLoader-label,
+.spectrum--light .spectrum-BarLoader-percentage {
+ color: rgb(110, 110, 110);
+}
+.spectrum--light .spectrum-BarLoader-label,
+.spectrum--light .spectrum-BarLoader-percentage {
+ color: rgb(110, 110, 110);
+}
+.spectrum--light .spectrum-CoachMarkPopover {
+ background-color: rgb(255, 255, 255);
+ border-color: rgb(202, 202, 202);
+ box-shadow: 0 1px 4px rgba(0,0,0,0.15);
+}
+.spectrum--light .spectrum-CoachMarkPopover-title {
+ color: rgb(44, 44, 44);
+}
+.spectrum--light .spectrum-CoachMarkPopover-step {
+ color: rgb(110, 110, 110);
+}
+.spectrum--light .spectrum-CoachMarkPopover-content {
+ color: rgb(75, 75, 75);
+}
+.spectrum--light .spectrum-CoachMarkIndicator-ring {
+ border-color: rgb(38, 128, 235);
+}
+.spectrum--light .spectrum-CoachMarkIndicator--light .spectrum-CoachMarkIndicator-ring {
+ border-color: rgb(255, 255, 255);
+}
+.spectrum--light .spectrum-CoachMarkIndicator--dark .spectrum-CoachMarkIndicator-ring {
+ border-color: rgb(44, 44, 44);
+}
+.spectrum--light .spectrum-CircleLoader-track {
+ border-color: rgb(225, 225, 225);
+}
+.spectrum--light .spectrum-CircleLoader-fill {
+ border-color: rgb(20, 115, 230);
+}
+.spectrum--light .spectrum-CircleLoader--overBackground .spectrum-CircleLoader-track {
+ border-color: rgba(255,255,255,0.2);
+ }
+.spectrum--light .spectrum-CircleLoader--overBackground .spectrum-CircleLoader-fill {
+ border-color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-CircleLoader--indeterminate.spectrum-CircleLoader--overBackground .spectrum-CircleLoader-track {
+ border-color: rgba(255,255,255,0.2);
+ }
+.spectrum--light .spectrum-CircleLoader--indeterminate.spectrum-CircleLoader--overBackground .spectrum-CircleLoader-fill {
+ border-color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-Underlay {
+ background: rgba(0,0,0,0.4);
+}
+.spectrum--light .spectrum-Dialog {
+ background: rgb(245, 245, 245);
+}
+.spectrum--light .spectrum-Dialog-header {
+ background: rgb(245, 245, 245);
+}
+.spectrum--light .spectrum-Dialog-header:after {
+ background: rgb(234, 234, 234);
+ }
+.spectrum--light .spectrum-Dialog-title {
+ color: rgb(44, 44, 44);
+}
+.spectrum--light .spectrum-Dialog-content {
+ color: rgb(75, 75, 75);
+}
+.spectrum--light .spectrum-Dialog-typeIcon {
+ color: rgb(44, 44, 44);
+}
+.spectrum--light .spectrum-Dialog-footer {
+ background: rgb(245, 245, 245);
+}
+.spectrum--light .spectrum-Dialog--error .spectrum-Dialog-title {
+ color: rgb(201, 37, 45);
+ }
+.spectrum--light .spectrum-Dialog--error .spectrum-Dialog-typeIcon {
+ color: rgb(201, 37, 45);
+ }
+/* topdoc
+{{ slider/slider-ramp.yml }}
+*/
+.spectrum--light .spectrum-Slider-track::before {
+ background: rgb(225, 225, 225);
+ }
+/* topdoc
+{{ slider/slider-tick-label.yml }}
+*/
+.spectrum--light .spectrum-Slider-labelContainer,
+.spectrum--light .spectrum-Dial-labelContainer {
+ color: rgb(110, 110, 110);
+}
+/* topdoc
+{{ slider/slider-tick.yml }}
+*/
+.spectrum--light .spectrum-Slider--filled .spectrum-Slider-track:first-child::before {
+ background: rgb(110, 110, 110);
+ }
+/* topdoc
+{{ slider/slider-player.yml }}
+*/
+.spectrum--light .spectrum-Slider-buffer::before,
+ .spectrum--light .spectrum-Slider-buffer::after {
+ background: rgb(179, 179, 179);
+ }
+/* topdoc
+{{ slider/slider-filled.yml }}
+*/
+.spectrum--light .spectrum-Slider-ramp path {
+ fill: rgb(225, 225, 225);
+ }
+/* topdoc
+{{ slider/slider-label.yml }}
+*/
+.spectrum--light .spectrum-Slider-handle {
+ border-color: rgb(110, 110, 110);
+ background: rgb(245, 245, 245);
+}
+/* topdoc
+{{ slider/slider.yml }}
+*/
+.spectrum--light .spectrum-Slider-handle:hover {
+ border-color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Slider-handle.is-focused {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Slider-handle:active,
+ .spectrum--light .spectrum-Slider-handle.is-dragged {
+ border-color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Slider--ramp .spectrum-Slider-handle {
+ /* We can't draw this one correctly without this hack : ( */
+ box-shadow: 0 0 0 4px rgb(245, 245, 245);
+ }
+.spectrum--light .spectrum-Slider-input {
+ background: transparent;
+}
+.spectrum--light .spectrum-Slider-tick:after {
+ background-color: rgb(225, 225, 225);
+ }
+.spectrum--light .spectrum-Slider-handle.is-focused {
+ border-color: rgb(38, 128, 235);
+ background: rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Slider-handle.is-dragged {
+ border-color: rgb(75, 75, 75);
+ background: rgba(0, 0, 0, 0);
+ }
+/* topdoc
+{{ slider/slider-range.yml }}
+*/
+.spectrum--light .spectrum-Slider--range .spectrum-Slider-track:not(:first-of-type):not(:last-of-type):before {
+ background: rgb(110, 110, 110);
+ }
+/* topdoc
+{{ slider/slider-colored.yml }}
+*/
+.spectrum--light .spectrum-Slider--color .spectrum-Slider-controls::before {
+ background-color: rgb(255, 255, 255);
+ /* Add a half-percent to fix diagonal line issue in Chrome on non-retina displays */
+ background-image:
+ linear-gradient(-45deg, transparent 75.5%, rgb(188, 188, 188) 75.5%),
+ linear-gradient(45deg, transparent 75.5%, rgb(188, 188, 188) 75.5%),
+ linear-gradient(-45deg, rgb(188, 188, 188) 25.5%, transparent 25.5%),
+ linear-gradient(45deg, rgb(188, 188, 188) 25.5%, transparent 25.5%);
+ background-size:
+ 16px
+ 16px;
+ background-position:
+ 0 0,
+ 0 8px,
+ 8px -8px,
+ -8px 0;
+ z-index: 0;
+ }
+.spectrum--light .spectrum-Slider--color .spectrum-Slider-track {
+ background-color: transparent;
+ background-image: linear-gradient(to right, rgb(38, 128, 235), rgb(9, 90, 186));
+ box-shadow: inset 0 0 0 1px rgba(0,0,0,0.05);
+ }
+.spectrum--light .spectrum-Slider--color .spectrum-Slider-track::before {
+ display: none;
+ }
+.spectrum--light .spectrum-Slider--color .spectrum-Slider-handle {
+ box-shadow: inset 0 0 0 1px rgba(0,0,0,0.05), 0 0 0 1px rgba(0,0,0,0.05);
+ border-color: rgb(255, 255, 255);
+ background: rgba(0, 0, 0, 0);
+ }
+.spectrum--light .spectrum-Slider--color .spectrum-Slider-handle.is-focused {
+ box-shadow: 0 0 0 1px rgba(0,0,0,0.05);
+ }
+/* topdoc
+{{ slider/dial-label.yml }}
+*/
+.spectrum--light .spectrum-Dial-handle {
+ box-shadow: none;
+}
+/* topdoc
+{{ slider/dial.yml }}
+*/
+.spectrum--light .spectrum-Dial-handle::after {
+ background-color: rgb(110, 110, 110);
+ }
+.spectrum--light .spectrum-Dial-handle:hover::after {
+ background-color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Dial-handle.is-focused {
+ background-color: rgb(38, 128, 235);
+
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Dial-handle.is-focused::after {
+ background-color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-Dial-handle:active,
+ .spectrum--light .spectrum-Dial-handle.is-dragged {
+ background-color: rgb(75, 75, 75);
+
+ border-color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Dial-handle:active::after, .spectrum--light .spectrum-Dial-handle.is-dragged::after {
+ background-color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-Dial-controls::before,
+ .spectrum--light .spectrum-Dial-controls::after {
+ background-color: rgb(142, 142, 142);
+ }
+.spectrum--light .spectrum-Dial.is-disabled .spectrum-Dial-labelContainer {
+ color: rgb(179, 179, 179);
+ }
+.spectrum--light .spectrum-Dial.is-disabled .spectrum-Dial-controls::after,
+ .spectrum--light .spectrum-Dial.is-disabled .spectrum-Dial-controls::before {
+ background-color: rgb(202, 202, 202);
+ }
+.spectrum--light .spectrum-Dial.is-disabled .spectrum-Dial-handle {
+ border-color: rgb(202, 202, 202);
+ background: rgb(245, 245, 245);
+ }
+.spectrum--light .spectrum-Dial.is-disabled .spectrum-Dial-handle:hover,
+ .spectrum--light .spectrum-Dial.is-disabled .spectrum-Dial-handle:active {
+ border-color: rgb(202, 202, 202);
+ background: rgba(0, 0, 0, 0);
+ }
+.spectrum--light .spectrum-Dial.is-disabled .spectrum-Dial-handle::after,
+ .spectrum--light .spectrum-Dial.is-disabled .spectrum-Dial-handle::before {
+ background-color: rgb(225, 225, 225);
+ }
+.spectrum--light .spectrum-Slider.is-disabled .spectrum-Slider-labelContainer,
+.spectrum--light .spectrum-Slider.is-disabled .spectrum-Dial-labelContainer {
+ color: rgb(179, 179, 179);
+ }
+.spectrum--light .spectrum-Slider.is-disabled .spectrum-Slider-handle {
+ border-color: rgb(202, 202, 202);
+ background: rgb(245, 245, 245);
+ }
+.spectrum--light .spectrum-Slider.is-disabled .spectrum-Slider-handle:hover,
+ .spectrum--light .spectrum-Slider.is-disabled .spectrum-Slider-handle:active {
+ border-color: rgb(202, 202, 202);
+ background: rgba(0, 0, 0, 0);
+ }
+.spectrum--light .spectrum-Slider.is-disabled .spectrum-Slider-track::before {
+ background: rgb(225, 225, 225);
+ }
+.spectrum--light .spectrum-Slider.is-disabled.spectrum-Slider--filled .spectrum-Slider-track:first-child::before {
+ background: rgb(225, 225, 225);
+ }
+.spectrum--light .spectrum-Slider.is-disabled .spectrum-Slider-buffer::before {
+ background: rgb(225, 225, 225);
+ }
+.spectrum--light .spectrum-Slider.is-disabled .spectrum-Slider-ramp path {
+ fill: rgb(234, 234, 234);
+ }
+.spectrum--light .spectrum-Slider.is-disabled.spectrum-Slider--color .spectrum-Slider-track {
+ background: rgb(234, 234, 234) !important;
+ box-shadow: none;
+ }
+.spectrum--light .spectrum-Slider.is-disabled.spectrum-Slider--color .spectrum-Slider-handle {
+ background: rgba(0, 0, 0, 0);
+ box-shadow: none;
+ border-color: rgb(202, 202, 202);
+ }
+.spectrum--light .spectrum-Slider.is-disabled.spectrum-Slider--color .spectrum-Slider-handle:hover,
+ .spectrum--light .spectrum-Slider.is-disabled.spectrum-Slider--color .spectrum-Slider-handle:active {
+ background: rgba(0, 0, 0, 0);
+ box-shadow: none;
+ border-color: rgb(202, 202, 202);
+ }
+.spectrum--light .spectrum-Slider.is-disabled.spectrum-Slider--range .spectrum-Slider-track:not(:first-of-type):not(:last-of-type):before {
+ background: rgb(225, 225, 225);
+ }
+/* topdoc
+{{ tabs/tabs-compact-vertical.yml }}
+*/
+.spectrum--light .spectrum-Tabs {
+ border-bottom-color: rgb(234, 234, 234);
+}
+/* topdoc
+{{ tabs/tabs-vertical.yml }}
+*/
+.spectrum--light .spectrum-Tabs--vertical {
+ border-left-color: rgb(234, 234, 234);
+}
+/* topdoc
+{{ tabs/tabs-quiet-compact.yml }}
+*/
+.spectrum--light .spectrum-Tabs-selectionIndicator {
+ background-color: rgb(44, 44, 44);
+}
+/* topdoc
+{{ tabs/tabs-compact.yml }}
+*/
+.spectrum--light .spectrum-Tabs-item {
+ color: rgb(110, 110, 110);
+}
+/* topdoc
+{{ tabs/tabs-quiet.yml }}
+*/
+.spectrum--light .spectrum-Tabs-item .spectrum-Icon {
+ color: rgb(110, 110, 110)
+ }
+/* topdoc
+{{ tabs/tabs.yml }}
+*/
+.spectrum--light .spectrum-Tabs-item:hover {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Tabs-item:hover .spectrum-Icon {
+ color: rgb(44, 44, 44)
+ }
+.spectrum--light .spectrum-Tabs-item.is-selected {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Tabs-item.is-selected .spectrum-Icon {
+ color: rgb(44, 44, 44)
+ }
+.spectrum--light .spectrum-Tabs-item.focus-ring {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Tabs-item.focus-ring::before {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Tabs-item.focus-ring .spectrum-Icon {
+ color: rgb(44, 44, 44)
+ }
+.spectrum--light .spectrum-Tabs-item.is-disabled {
+ color: rgb(179, 179, 179);
+ }
+.spectrum--light .spectrum-Tabs-item.is-disabled .spectrum-Icon {
+ color: rgb(202, 202, 202)
+ }
+.spectrum--light .spectrum-Tabs--quiet {
+ border-bottom-color: rgba(0, 0, 0, 0);
+}
+.spectrum--light .spectrum-Tabs--quiet .spectrum-Tabs-selectionIndicator {
+ background-color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Tabs--vertical.spectrum-Tabs--quiet,
+ .spectrum--light .spectrum-Tabs--vertical.spectrum-Tabs--compact {
+ border-left-color: rgba(0, 0, 0, 0);
+ }
+.spectrum--light .spectrum-Tabs--vertical.spectrum-Tabs--quiet .spectrum-Tabs-selectionIndicator, .spectrum--light .spectrum-Tabs--vertical.spectrum-Tabs--compact .spectrum-Tabs-selectionIndicator {
+ background-color: rgb(44, 44, 44);
+ }
+/* Default Label Style is 'incomplete' */
+.spectrum--light .spectrum-Steplist .spectrum-Steplist-label {
+ color: rgb(142, 142, 142)
+ }
+/* Default Marker Style is 'incomplete' */
+.spectrum--light .spectrum-Steplist .spectrum-Steplist-marker {
+ border-color: rgb(225, 225, 225)
+ }
+/* Default Line Style is 'incomplete' */
+.spectrum--light .spectrum-Steplist .spectrum-Steplist-segment {
+ border-bottom-color: rgb(225, 225, 225)
+ }
+/* Step Completed */
+.spectrum--light .spectrum-Steplist .spectrum-Steplist-item.is-complete .spectrum-Steplist-label {
+ color: rgb(110, 110, 110)
+ }
+.spectrum--light .spectrum-Steplist .spectrum-Steplist-item.is-complete .spectrum-Steplist-marker {
+ background-color: rgb(142, 142, 142)
+ }
+/* Step Selected aka Current */
+.spectrum--light .spectrum-Steplist .spectrum-Steplist-item.is-selected .spectrum-Steplist-label {
+ color: rgb(75, 75, 75)
+ }
+.spectrum--light .spectrum-Steplist .spectrum-Steplist-item.is-selected .spectrum-Steplist-marker {
+ background-color: rgb(75, 75, 75)
+ }
+.spectrum--light .spectrum-Steplist .spectrum-Steplist-item.is-complete .spectrum-Steplist-segment, .spectrum--light .spectrum-Steplist .spectrum-Steplist-item.is-selected .spectrum-Steplist-segment {
+ border-bottom-color: rgb(179, 179, 179)
+ }
+/* Step Focused */
+.spectrum--light .spectrum-Steplist.spectrum-Steplist--interactive .spectrum-Steplist-item:focus .spectrum-Steplist-marker {
+ background-color: rgb(38, 128, 235)
+ }
+/* :before is used for the track of the switch */
+.spectrum--light .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(225, 225, 225);
+ }
+/* :after is used for the handle of the switch */
+.spectrum--light .spectrum-ToggleSwitch-switch::after {
+ background-color: rgb(250, 250, 250);
+ border-color: rgb(142, 142, 142);
+ }
+/* Default */
+.spectrum--light .spectrum-ToggleSwitch-input ~ .spectrum-ToggleSwitch-label {
+ color: rgb(75, 75, 75);
+}
+/* Selected */
+.spectrum--light .spectrum-ToggleSwitch-input:checked + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(20, 115, 230);
+ }
+/* Interactivity Styles */
+.spectrum--light .spectrum-ToggleSwitch-input:checked + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(20, 115, 230);
+ }
+/* Hover */
+.spectrum--light .spectrum-ToggleSwitch:hover .spectrum-ToggleSwitch-input + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(110, 110, 110);
+ box-shadow: none;
+ }
+.spectrum--light .spectrum-ToggleSwitch:hover .spectrum-ToggleSwitch-input ~ .spectrum-ToggleSwitch-label {
+ color: rgb(44, 44, 44);
+ }
+/* Selected Hover */
+.spectrum--light .spectrum-ToggleSwitch:hover .spectrum-ToggleSwitch-input:checked:enabled + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(13, 102, 208);
+ }
+.spectrum--light .spectrum-ToggleSwitch:hover .spectrum-ToggleSwitch-input:checked:enabled + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(13, 102, 208);
+ }
+/* Down */
+.spectrum--light .spectrum-ToggleSwitch:active .spectrum-ToggleSwitch-input + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-ToggleSwitch:active .spectrum-ToggleSwitch-input ~ .spectrum-ToggleSwitch-label {
+ color: rgb(44, 44, 44);
+ }
+/* Selected Down */
+.spectrum--light .spectrum-ToggleSwitch:active .spectrum-ToggleSwitch-input:checked:enabled + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(9, 90, 186);
+ }
+.spectrum--light .spectrum-ToggleSwitch:active .spectrum-ToggleSwitch-input:checked:enabled + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(9, 90, 186);
+ }
+/* Disabled */
+.spectrum--light .spectrum-ToggleSwitch .spectrum-ToggleSwitch-input:disabled + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(225, 225, 225);
+ }
+.spectrum--light .spectrum-ToggleSwitch .spectrum-ToggleSwitch-input:disabled + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(202, 202, 202);
+ }
+.spectrum--light .spectrum-ToggleSwitch .spectrum-ToggleSwitch-input:disabled ~ .spectrum-ToggleSwitch-label {
+ color: rgb(179, 179, 179);
+ }
+/* Selected Disabled */
+.spectrum--light .spectrum-ToggleSwitch .spectrum-ToggleSwitch-input:disabled:checked + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(202, 202, 202);
+ }
+.spectrum--light .spectrum-ToggleSwitch .spectrum-ToggleSwitch-input:disabled:checked + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(202, 202, 202);
+ }
+.spectrum--light .spectrum-ToggleSwitch .spectrum-ToggleSwitch-input:disabled:checked ~ .spectrum-ToggleSwitch-label {
+ color: rgb(179, 179, 179);
+ }
+/* Quiet Selected */
+.spectrum--light .spectrum-ToggleSwitch--quiet .spectrum-ToggleSwitch-input:checked + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(110, 110, 110);
+ }
+/* Quiet */
+.spectrum--light .spectrum-ToggleSwitch--quiet .spectrum-ToggleSwitch-input:checked + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(110, 110, 110);
+ }
+/* Quiet Selected Hover */
+.spectrum--light .spectrum-ToggleSwitch--quiet:hover .spectrum-ToggleSwitch-input:checked:enabled + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(75, 75, 75);
+ }
+/* topdoc
+{{ toggle/toggle-onoffquiet.yml }}
+*/
+.spectrum--light .spectrum-ToggleSwitch--quiet:hover .spectrum-ToggleSwitch-input:checked:enabled + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(75, 75, 75);
+ }
+/* Quiet Selected Down */
+.spectrum--light .spectrum-ToggleSwitch.spectrum-ToggleSwitch--quiet:active .spectrum-ToggleSwitch-input:checked:enabled + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-ToggleSwitch.spectrum-ToggleSwitch--quiet:active .spectrum-ToggleSwitch-input:checked:enabled + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(44, 44, 44);
+ }
+/* Key Focus */
+.spectrum--light .spectrum-ToggleSwitch .spectrum-ToggleSwitch-input.focus-ring + .spectrum-ToggleSwitch-switch::after, .spectrum--light .spectrum-ToggleSwitch:hover .spectrum-ToggleSwitch-input.focus-ring + .spectrum-ToggleSwitch-switch::after, .spectrum--light .spectrum-ToggleSwitch--quiet .spectrum-ToggleSwitch-input.focus-ring + .spectrum-ToggleSwitch-switch::after, .spectrum--light .spectrum-ToggleSwitch--quiet:hover .spectrum-ToggleSwitch-input.focus-ring + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-ToggleSwitch .spectrum-ToggleSwitch-input.focus-ring ~ .spectrum-ToggleSwitch-label, .spectrum--light .spectrum-ToggleSwitch:hover .spectrum-ToggleSwitch-input.focus-ring ~ .spectrum-ToggleSwitch-label, .spectrum--light .spectrum-ToggleSwitch--quiet .spectrum-ToggleSwitch-input.focus-ring ~ .spectrum-ToggleSwitch-label, .spectrum--light .spectrum-ToggleSwitch--quiet:hover .spectrum-ToggleSwitch-input.focus-ring ~ .spectrum-ToggleSwitch-label {
+ color: rgb(13, 102, 208);
+ }
+/* Selected Key Focus */
+.spectrum--light .spectrum-ToggleSwitch .spectrum-ToggleSwitch-input.focus-ring:checked + .spectrum-ToggleSwitch-switch::before, .spectrum--light .spectrum-ToggleSwitch:hover .spectrum-ToggleSwitch-input.focus-ring:checked + .spectrum-ToggleSwitch-switch::before, .spectrum--light .spectrum-ToggleSwitch--quiet .spectrum-ToggleSwitch-input.focus-ring:checked + .spectrum-ToggleSwitch-switch::before, .spectrum--light .spectrum-ToggleSwitch--quiet:hover .spectrum-ToggleSwitch-input.focus-ring:checked + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-ToggleSwitch .spectrum-ToggleSwitch-input.focus-ring:checked + .spectrum-ToggleSwitch-switch::after, .spectrum--light .spectrum-ToggleSwitch:hover .spectrum-ToggleSwitch-input.focus-ring:checked + .spectrum-ToggleSwitch-switch::after, .spectrum--light .spectrum-ToggleSwitch--quiet .spectrum-ToggleSwitch-input.focus-ring:checked + .spectrum-ToggleSwitch-switch::after, .spectrum--light .spectrum-ToggleSwitch--quiet:hover .spectrum-ToggleSwitch-input.focus-ring:checked + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-ToggleSwitch .spectrum-ToggleSwitch-input.focus-ring:checked ~ .spectrum-ToggleSwitch-label, .spectrum--light .spectrum-ToggleSwitch:hover .spectrum-ToggleSwitch-input.focus-ring:checked ~ .spectrum-ToggleSwitch-label, .spectrum--light .spectrum-ToggleSwitch--quiet .spectrum-ToggleSwitch-input.focus-ring:checked ~ .spectrum-ToggleSwitch-label, .spectrum--light .spectrum-ToggleSwitch--quiet:hover .spectrum-ToggleSwitch-input.focus-ring:checked ~ .spectrum-ToggleSwitch-label {
+ color: rgb(13, 102, 208);
+ }
+.spectrum--light .spectrum-ToggleSwitch--ab .spectrum-ToggleSwitch-input:checked + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(225, 225, 225);
+ }
+.spectrum--light .spectrum-ToggleSwitch--ab .spectrum-ToggleSwitch-input:checked + .spectrum-ToggleSwitch-switch::after {
+ /* Don't be blue */
+ border-color: rgb(142, 142, 142);
+ }
+.spectrum--light .spectrum-ToggleSwitch--ab .spectrum-ToggleSwitch-input.focus-ring:checked + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(225, 225, 225);
+ }
+.spectrum--light .spectrum-ToggleSwitch--ab .spectrum-ToggleSwitch-input.focus-ring:checked + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-ToggleSwitch--ab .spectrum-ToggleSwitch-input:disabled:checked + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(225, 225, 225);
+ }
+.spectrum--light .spectrum-ToggleSwitch--ab .spectrum-ToggleSwitch-input:disabled + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(225, 225, 225);
+ }
+.spectrum--light .spectrum-ToggleSwitch--ab .spectrum-ToggleSwitch-input:disabled + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(202, 202, 202);
+ }
+.spectrum--light .spectrum-ToggleSwitch--ab:hover .spectrum-ToggleSwitch-input:checked:enabled + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(225, 225, 225);
+ }
+.spectrum--light .spectrum-ToggleSwitch--ab:hover .spectrum-ToggleSwitch-input:checked:enabled + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(110, 110, 110);
+ }
+.spectrum--light .spectrum-ToggleSwitch--ab:active .spectrum-ToggleSwitch-input:checked:enabled + .spectrum-ToggleSwitch-switch::before {
+ background-color: rgb(225, 225, 225);
+ }
+.spectrum--light .spectrum-ToggleSwitch--ab:active .spectrum-ToggleSwitch-input:checked:enabled + .spectrum-ToggleSwitch-switch::after {
+ border-color: rgb(75, 75, 75);
+ }
+/* topdoc
+{{ menu/menu-nested.yml }}
+*/
+.spectrum--light .spectrum-Menu {
+ background-color: rgba(0, 0, 0, 0);
+}
+/* topdoc
+{{ menu/menu-default.yml }}
+*/
+.spectrum--light .spectrum-Menu-item {
+ background-color: rgba(0, 0, 0, 0);
+ color: rgb(75, 75, 75);
+}
+.spectrum--light .spectrum-Menu-item.focus-ring,
+ .spectrum--light .spectrum-Menu-item.is-focused {
+ background-color: rgba(44,44,44,0.04);
+ color: rgb(75, 75, 75);
+ border-left-color: rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Menu-item:hover,
+ .spectrum--light .spectrum-Menu-item:focus,
+ .spectrum--light .spectrum-Menu-item.is-open {
+ background-color: rgba(44,44,44,0.04);
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Menu-item.is-selected {
+ color: rgb(13, 102, 208);
+ }
+.spectrum--light .spectrum-Menu-item.is-selected .spectrum-Menu-checkmark {
+ color: rgb(20, 115, 230);
+ }
+.spectrum--light .spectrum-Menu-item .is-active,
+ .spectrum--light .spectrum-Menu-item:active {
+ background-color: rgba(44,44,44,0.04);
+ }
+.spectrum--light .spectrum-Menu-item.is-disabled {
+ background-color: rgba(0, 0, 0, 0);
+ background-image: none;
+ color: rgb(179, 179, 179);
+ cursor: default;
+ }
+.spectrum--light .spectrum-Menu-sectionHeading {
+ color: rgb(110, 110, 110);
+}
+.spectrum--light .spectrum-Menu-divider {
+ background-color: rgb(245, 245, 245);
+}
+.spectrum--light .spectrum-Dropdown .spectrum-Dropdown-trigger:hover .spectrum-Dropdown-icon {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Dropdown .spectrum-Dropdown-trigger.is-selected .is-placeholder {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Dropdown.is-invalid .spectrum-Icon:not(.spectrum-Dropdown-icon):not(.spectrum-Menu-checkmark) {
+ color: rgb(201, 37, 45);
+ }
+.spectrum--light .spectrum-Dropdown.is-invalid.is-disabled .spectrum-Icon,
+ .spectrum--light .spectrum-Dropdown.is-invalid.is-disabled .spectrum-Icon:not(.spectrum-Dropdown-icon):not(.spectrum-Menu-checkmark) {
+ color: rgb(202, 202, 202);
+ }
+.spectrum--light .spectrum-Dropdown.is-disabled .spectrum-Dropdown-icon, .spectrum--light .spectrum-Dropdown.is-disabled .spectrum-Dropdown-trigger:hover .spectrum-Dropdown-icon {
+ color: rgb(202, 202, 202);
+ }
+.spectrum--light .spectrum-Dropdown.is-disabled .spectrum-Dropdown-label.is-placeholder {
+ color: rgb(179, 179, 179);
+ }
+.spectrum--light .spectrum-Dropdown-icon {
+ color: rgb(110, 110, 110);
+}
+.spectrum--light .spectrum-Dropdown-label.is-placeholder {
+ color: rgb(142, 142, 142);
+ }
+.spectrum--light .spectrum-Dropdown-label.is-placeholder:hover {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Dropdown-label.is-placeholder:active {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Dropdown-trigger.focus-ring .spectrum-Dropdown-label.is-placeholder {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Dropdown-trigger.focus-ring .spectrum-Dropdown-icon {
+ color: rgb(44, 44, 44)
+ }
+.spectrum--light .spectrum-Dropzone {
+ border-color: rgb(225, 225, 225);
+}
+.spectrum--light .spectrum-Dropzone.is-dragged {
+ border-color: rgb(38, 128, 235);
+ background-color: rgba(20,115,230,0.1);
+ }
+.spectrum--light .spectrum-Dropzone.is-dragged .spectrum-IllustratedMessage-illustration {
+ color: rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Dropzone:focus {
+ border-color: rgb(225, 225, 225);
+ }
+.spectrum--light .spectrum-Dropzone:focus .spectrum-IllustratedMessage-illustration {
+ color: rgb(188, 188, 188);
+ }
+.spectrum--light .spectrum-Dropzone:focus.focus-ring {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Dropzone:focus.is-dragged.focus-ring .spectrum-IllustratedMessage-illustration {
+ color: rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Tooltip-label p {
+ margin: 0;
+}
+.spectrum--light .spectrum-Toast {
+ background-color: rgb(116, 116, 116);
+ color: rgb(116, 116, 116);
+}
+.spectrum--light .spectrum-Toast-content {
+ color: rgb(255, 255, 255);
+}
+.spectrum--light .spectrum-Toast-typeIcon {
+ color: white;
+}
+.spectrum--light .spectrum-Toast-buttons {
+ border-left-color: rgba(255, 255, 255, 0.2);
+}
+.spectrum--light .spectrum-Toast--warning {
+ background-color: rgb(203, 111, 16);
+ color: rgb(203, 111, 16);
+}
+.spectrum--light .spectrum-Toast--warning .spectrum-Toast-closeButton.focus-ring:not(:active) {
+ color: rgb(203, 111, 16);
+ }
+.spectrum--light .spectrum-Toast--negative,
+.spectrum--light .spectrum-Toast--error {
+ background-color: rgb(201, 37, 45);
+ color: rgb(201, 37, 45);
+}
+.spectrum--light .spectrum-Toast--negative .spectrum-Toast-closeButton.focus-ring:not(:active), .spectrum--light .spectrum-Toast--error .spectrum-Toast-closeButton.focus-ring:not(:active) {
+ color: rgb(201, 37, 45);
+ }
+.spectrum--light .spectrum-Toast--info {
+ background-color: rgb(13, 102, 208);
+ color: rgb(13, 102, 208);
+}
+.spectrum--light .spectrum-Toast--info .spectrum-Toast-closeButton.focus-ring:not(:active) {
+ color: rgb(13, 102, 208);
+ }
+.spectrum--light .spectrum-Toast--positive,
+.spectrum--light .spectrum-Toast--success {
+ background-color: rgb(18, 128, 92);
+ color: rgb(18, 128, 92);
+}
+.spectrum--light .spectrum-Toast--positive .spectrum-Toast-closeButton.focus-ring:not(:active), .spectrum--light .spectrum-Toast--success .spectrum-Toast-closeButton.focus-ring:not(:active) {
+ color: rgb(18, 128, 92);
+ }
+.spectrum--light .spectrum-Popover {
+ background-color: rgb(255, 255, 255);
+ border-color: rgb(202, 202, 202);
+ /*
+ box-shadow offset/blur is hardcoded here as it cannot be adjusted when scale changes,
+ and we'd rather it be able to change when color stops change
+ */
+ box-shadow: 0 1px 4px rgba(0,0,0,0.15);
+}
+.spectrum--light .spectrum-Popover .spectrum-Dialog-header,
+ .spectrum--light .spectrum-Popover .spectrum-Dialog-footer,
+ .spectrum--light .spectrum-Popover .spectrum-Dialog-wrapper {
+ background-color: transparent;
+ }
+.spectrum--light .spectrum-Popover .spectrum-Popover-tip::after {
+ background-color: rgb(255, 255, 255);
+ border-color: rgb(202, 202, 202);
+ /* The math is weird here since the tip is rotated 45°... Technically it should be different for each tip position */
+ box-shadow: -1px -1px 4px rgba(0,0,0,0.15);
+ }
+.spectrum--light .spectrum-Accordion-item {
+ border-color: rgb(225, 225, 225);
+}
+.spectrum--light .spectrum-Accordion-itemIndicator {
+ color: rgb(142, 142, 142);
+}
+.spectrum--light .spectrum-Accordion-itemHeader {
+ color: rgb(110, 110, 110);
+}
+.spectrum--light .spectrum-Accordion-itemHeader:focus,
+ .spectrum--light .spectrum-Accordion-itemHeader:hover {
+ color: rgb(44, 44, 44);
+
+ background-color: rgb(234, 234, 234);
+ }
+.spectrum--light .spectrum-Accordion-itemHeader:focus + .spectrum-Accordion-itemIndicator, .spectrum--light .spectrum-Accordion-itemHeader:hover + .spectrum-Accordion-itemIndicator {
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Accordion-itemHeader.focus-ring:after {
+ background-color: rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Accordion-item.is-open .spectrum-Accordion-itemHeader:hover {
+ background-color: transparent;
+ }
+.spectrum--light .spectrum-Accordion-item.is-disabled .spectrum-Accordion-itemHeader,
+ .spectrum--light .spectrum-Accordion-item.is-disabled .spectrum-Accordion-itemHeader:hover,
+ .spectrum--light .spectrum-Accordion-item.is-disabled .spectrum-Accordion-itemHeader:focus {
+ color: rgb(179, 179, 179);
+ background-color: transparent;
+ }
+.spectrum--light .spectrum-Accordion-item.is-disabled .spectrum-Accordion-itemHeader + .spectrum-Accordion-itemIndicator {
+ color: rgb(202, 202, 202);
+ }
+/* topdoc
+{{ well/well.yml }}
+*/
+.spectrum--light .spectrum-Well {
+ background-color: rgba(75,75,75,0.02);
+ border-color: rgba(44,44,44,0.05);
+}
+.spectrum--light .spectrum-FieldLabel,
+.spectrum--light .spectrum-Form-itemLabel {
+ color: rgb(110, 110, 110);
+}
+.spectrum--light .spectrum-FieldLabel.is-disabled, .spectrum--light .spectrum-Form-itemLabel.is-disabled {
+ color: rgb(179, 179, 179);
+ }
+.spectrum--light .spectrum-FieldLabel.is-disabled .spectrum-FieldLabel-requiredIcon, .spectrum--light .spectrum-Form-itemLabel.is-disabled .spectrum-FieldLabel-requiredIcon {
+ color: rgb(179, 179, 179);
+ }
+.spectrum--light .spectrum-FieldLabel-requiredIcon {
+ color: rgb(142, 142, 142);
+}
+.spectrum--light .spectrum-Search-icon {
+ color: rgb(110, 110, 110);
+}
+.spectrum--light .spectrum-Search-input:disabled ~ .spectrum-Search-icon {
+ color: rgb(179, 179, 179);
+ }
+/* topdoc
+{{ stepper/stepper-default.yml }}
+*/
+.spectrum--light .spectrum-Stepper .spectrum-Stepper-input:focus {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Stepper .spectrum-Stepper-input:focus + .spectrum-Stepper-buttons .spectrum-Stepper-stepUp,
+ .spectrum--light .spectrum-Stepper .spectrum-Stepper-input:focus + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Stepper .spectrum-Stepper-input:focus:invalid,
+ .spectrum--light .spectrum-Stepper .spectrum-Stepper-input:focus.is-invalid {
+ border-color: rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Stepper .spectrum-Stepper-input:focus:invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepUp,
+ .spectrum--light .spectrum-Stepper .spectrum-Stepper-input:focus:invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown,
+ .spectrum--light .spectrum-Stepper .spectrum-Stepper-input:focus.is-invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepUp,
+ .spectrum--light .spectrum-Stepper .spectrum-Stepper-input:focus.is-invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ border-color: rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Stepper .spectrum-Stepper-input.focus-ring {
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Stepper .spectrum-Stepper-input.focus-ring + .spectrum-Stepper-buttons {
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Stepper .spectrum-Stepper-input.focus-ring:invalid,
+ .spectrum--light .spectrum-Stepper .spectrum-Stepper-input.focus-ring.is-invalid {
+ box-shadow: 0 0 0 1px rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Stepper .spectrum-Stepper-input.focus-ring:invalid + .spectrum-Stepper-buttons, .spectrum--light .spectrum-Stepper .spectrum-Stepper-input.focus-ring.is-invalid + .spectrum-Stepper-buttons {
+ box-shadow: 0 0 0 1px rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Stepper .spectrum-Stepper-input:invalid,
+ .spectrum--light .spectrum-Stepper .spectrum-Stepper-input.is-invalid {
+ border-color: rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Stepper .spectrum-Stepper-input:invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepUp,
+ .spectrum--light .spectrum-Stepper .spectrum-Stepper-input:invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown,
+ .spectrum--light .spectrum-Stepper .spectrum-Stepper-input.is-invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepUp,
+ .spectrum--light .spectrum-Stepper .spectrum-Stepper-input.is-invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ border-color: rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Stepper.is-focused .spectrum-Stepper-input {
+ border-color: rgb(38, 128, 235);
+ box-shadow: none;
+ }
+.spectrum--light .spectrum-Stepper.is-focused .spectrum-Stepper-input + .spectrum-Stepper-buttons .spectrum-Stepper-stepUp,
+ .spectrum--light .spectrum-Stepper.is-focused .spectrum-Stepper-input + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Stepper.is-focused .spectrum-Stepper-input.focus-ring {
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Stepper.is-focused .spectrum-Stepper-input.focus-ring + .spectrum-Stepper-buttons {
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Stepper.is-focused .spectrum-Stepper-input.focus-ring:invalid,
+ .spectrum--light .spectrum-Stepper.is-focused .spectrum-Stepper-input.focus-ring.is-invalid {
+ box-shadow: 0 0 0 1px rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Stepper.is-focused .spectrum-Stepper-input.focus-ring:invalid + .spectrum-Stepper-buttons, .spectrum--light .spectrum-Stepper.is-focused .spectrum-Stepper-input.focus-ring.is-invalid + .spectrum-Stepper-buttons {
+ box-shadow: 0 0 0 1px rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Stepper.is-focused .spectrum-Stepper-input:invalid,
+ .spectrum--light .spectrum-Stepper.is-focused .spectrum-Stepper-input.is-invalid {
+ border-color: rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Stepper.is-focused .spectrum-Stepper-input:invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepUp,
+ .spectrum--light .spectrum-Stepper.is-focused .spectrum-Stepper-input:invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown,
+ .spectrum--light .spectrum-Stepper.is-focused .spectrum-Stepper-input.is-invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepUp,
+ .spectrum--light .spectrum-Stepper.is-focused .spectrum-Stepper-input.is-invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ border-color: rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Stepper.is-invalid .spectrum-Stepper-input {
+ border-color: rgb(215, 55, 63);
+ box-shadow: none;
+ }
+.spectrum--light .spectrum-Stepper.is-invalid .spectrum-Stepper-input + .spectrum-Stepper-buttons .spectrum-Stepper-stepUp,
+ .spectrum--light .spectrum-Stepper.is-invalid .spectrum-Stepper-input + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ border-color: rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Stepper.is-invalid .spectrum-Stepper-input.focus-ring {
+ box-shadow: 0 0 0 1px rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Stepper.is-invalid .spectrum-Stepper-input.focus-ring + .spectrum-Stepper-buttons {
+ box-shadow: 0 0 0 1px rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Stepper-stepUp,
+.spectrum--light .spectrum-Stepper-stepDown {
+ border-color: rgb(225, 225, 225);
+}
+.spectrum--light .spectrum-Stepper-stepUp:disabled, .spectrum--light .spectrum-Stepper-stepDown:disabled {
+ border-color: rgba(0, 0, 0, 0);
+ }
+.spectrum--light .spectrum-Stepper-stepUp:hover, .spectrum--light .spectrum-Stepper-stepDown:hover {
+ /* Keep the border on hover */
+ border-color: rgb(225, 225, 225);
+ }
+/* topdoc
+{{ stepper/stepper-quiet.yml }}
+*/
+.spectrum--light .spectrum-Stepper--quiet .spectrum-Stepper-stepUp:disabled, .spectrum--light .spectrum-Stepper--quiet .spectrum-Stepper-stepDown:disabled {
+ border-color: rgb(225, 225, 225);
+ }
+.spectrum--light .spectrum-Stepper--quiet .spectrum-Stepper-input {
+ box-shadow: none;
+ }
+.spectrum--light .spectrum-Stepper--quiet .spectrum-Stepper-input:focus + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Stepper--quiet .spectrum-Stepper-input:focus:invalid,
+ .spectrum--light .spectrum-Stepper--quiet .spectrum-Stepper-input:focus.is-invalid {
+ box-shadow: none;
+ }
+.spectrum--light .spectrum-Stepper--quiet .spectrum-Stepper-input.focus-ring {
+ box-shadow: 0 1px 0 0 rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Stepper--quiet .spectrum-Stepper-input.focus-ring + .spectrum-Stepper-buttons {
+ box-shadow: none;
+ }
+.spectrum--light .spectrum-Stepper--quiet .spectrum-Stepper-input.focus-ring + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ box-shadow: 0 1px 0 0 rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Stepper--quiet .spectrum-Stepper-input.focus-ring:invalid,
+ .spectrum--light .spectrum-Stepper--quiet .spectrum-Stepper-input.focus-ring.is-invalid {
+ box-shadow: 0 1px 0 0 rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Stepper--quiet .spectrum-Stepper-input.focus-ring:invalid + .spectrum-Stepper-buttons, .spectrum--light .spectrum-Stepper--quiet .spectrum-Stepper-input.focus-ring.is-invalid + .spectrum-Stepper-buttons {
+ box-shadow: none;
+ }
+.spectrum--light .spectrum-Stepper--quiet .spectrum-Stepper-input.focus-ring:invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown, .spectrum--light .spectrum-Stepper--quiet .spectrum-Stepper-input.focus-ring.is-invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ box-shadow: 0 1px 0 0 rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Stepper--quiet .spectrum-Stepper-input:invalid,
+ .spectrum--light .spectrum-Stepper--quiet .spectrum-Stepper-input.is-invalid {
+ border-color: rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Stepper--quiet .spectrum-Stepper-input:invalid + .spectrum-Stepper-buttons, .spectrum--light .spectrum-Stepper--quiet .spectrum-Stepper-input.is-invalid + .spectrum-Stepper-buttons {
+ box-shadow: none;
+ }
+.spectrum--light .spectrum-Stepper--quiet .spectrum-Stepper-input:invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown, .spectrum--light .spectrum-Stepper--quiet .spectrum-Stepper-input.is-invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ border-color: rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input {
+ box-shadow: none;
+ }
+.spectrum--light .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input + .spectrum-Stepper-buttons {
+ box-shadow: none;
+ }
+.spectrum--light .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input:focus + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input.focus-ring {
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 1px 0 0 rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input.focus-ring + .spectrum-Stepper-buttons {
+ box-shadow: none;
+ }
+.spectrum--light .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input.focus-ring + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ box-shadow: 0 1px 0 0 rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input.focus-ring:invalid,
+ .spectrum--light .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input.focus-ring.is-invalid {
+ box-shadow: 0 1px 0 0 rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input.focus-ring:invalid + .spectrum-Stepper-buttons, .spectrum--light .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input.focus-ring.is-invalid + .spectrum-Stepper-buttons {
+ box-shadow: none;
+ }
+.spectrum--light .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input.focus-ring:invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown, .spectrum--light .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input.focus-ring.is-invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ box-shadow: 0 1px 0 0 rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input:invalid,
+ .spectrum--light .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input.is-invalid {
+ border-color: rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input:invalid + .spectrum-Stepper-buttons, .spectrum--light .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input.is-invalid + .spectrum-Stepper-buttons {
+ box-shadow: none;
+ }
+.spectrum--light .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input:invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown, .spectrum--light .spectrum-Stepper--quiet.is-focused .spectrum-Stepper-input.is-invalid + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ border-color: rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Stepper--quiet.is-invalid .spectrum-Stepper-input {
+ border-color: rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Stepper--quiet.is-invalid .spectrum-Stepper-input + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ border-color: rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Stepper--quiet.is-invalid .spectrum-Stepper-input:focus + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ border-color: rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Stepper--quiet.is-invalid .spectrum-Stepper-input.focus-ring {
+ box-shadow: 0 1px 0 0 rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Stepper--quiet.is-invalid .spectrum-Stepper-input.focus-ring + .spectrum-Stepper-buttons {
+ box-shadow: none;
+ }
+.spectrum--light .spectrum-Stepper--quiet.is-invalid .spectrum-Stepper-input.focus-ring + .spectrum-Stepper-buttons .spectrum-Stepper-stepDown {
+ box-shadow: 0 1px 0 0 rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Calendar-prevMonth {
+ color: rgb(110, 110, 110);
+}
+.spectrum--light .spectrum-Calendar-nextMonth {
+ color: rgb(110, 110, 110);
+}
+.spectrum--light .spectrum-Calendar-dayOfWeek {
+ color: rgb(110, 110, 110);
+}
+.spectrum--light .spectrum-Calendar-date:hover {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Calendar-date:hover:not(.is-selection-end):not(.is-selection-start):before {
+ background: rgba(44,44,44,0.06);
+ }
+.spectrum--light .spectrum-Calendar-date:hover.is-selected {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Calendar-date:hover.is-selected:not(.is-selection-end):not(.is-selection-start):before {
+ background: rgba(20,115,230,0.2);
+ }
+.spectrum--light .spectrum-Calendar-date:hover.is-range-selection:before {
+ background: rgba(20,115,230,0.2);
+ }
+.spectrum--light .spectrum-Calendar-date:active {
+ background-color: rgba(44,44,44,0.1);
+ }
+.spectrum--light .spectrum-Calendar-date.is-selected {
+ color: rgb(44, 44, 44);
+ background: rgba(20,115,230,0.1);
+ }
+.spectrum--light .spectrum-Calendar-date.is-selected:not(.is-range-selection) {
+ background: rgba(20,115,230,0.2);
+ }
+.spectrum--light .spectrum-Calendar-date.is-today {
+ color: rgb(75, 75, 75);
+ border-color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Calendar-date.is-today:before {
+ border-color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Calendar-date.is-today:hover.is-selected:not(.is-range-selection):before {
+ background: rgba(20,115,230,0.2);
+ }
+.spectrum--light .spectrum-Calendar-date.is-today.is-disabled {
+ color: rgb(179, 179, 179);
+ border-color: rgb(202, 202, 202);
+ }
+.spectrum--light .spectrum-Calendar-date.is-today.is-disabled:before {
+ border-color: rgb(202, 202, 202);
+ }
+.spectrum--light .spectrum-Calendar-date.is-focused:not(.is-range-selection) {
+ background: rgba(44,44,44,0.06);
+ border-color: rgb(38, 128, 235);
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Calendar-date.is-focused:not(.is-range-selection).is-today {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Calendar-date.is-focused:not(.is-range-selection):active,
+ .spectrum--light .spectrum-Calendar-date.is-focused:not(.is-range-selection).is-selected {
+ color: rgb(44, 44, 44);
+ background: rgba(20,115,230,0.2);
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Calendar-date.is-focused.is-selected:before {
+ background: rgba(20,115,230,0.2);
+ }
+.spectrum--light .spectrum-Calendar-date.is-focused.is-range-selection:before {
+ background: rgba(20,115,230,0.2);
+ }
+.spectrum--light .spectrum-Calendar-date.is-disabled {
+ color: rgb(179, 179, 179);
+ }
+.spectrum--light .spectrum-Calendar-date.is-selection-start,
+ .spectrum--light .spectrum-Calendar-date.is-selection-end {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Calendar-date.is-selection-start:after, .spectrum--light .spectrum-Calendar-date.is-selection-end:after {
+ background-color: rgba(20,115,230,0.1);
+ }
+.spectrum--light .spectrum-Calendar-date.is-selection-start.is-disabled, .spectrum--light .spectrum-Calendar-date.is-selection-end.is-disabled {
+ color: rgb(179, 179, 179);
+ }
+.spectrum--light .spectrum-Table-headCell {
+ color: rgb(110, 110, 110);
+ background-color: rgba(0, 0, 0, 0);
+}
+.spectrum--light .spectrum-Table-headCell.is-sortable .spectrum-Table-sortedIcon {
+ color: rgb(142, 142, 142);
+ }
+.spectrum--light .spectrum-Table-headCell.is-sortable:hover {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Table-headCell.is-sortable:hover .spectrum-Table-sortedIcon {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Table-headCell.is-sortable.focus-ring,
+ .spectrum--light .spectrum-Table-headCell.is-sortable.is-focused {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Table-headCell.is-sortable.focus-ring .spectrum-Table-sortedIcon, .spectrum--light .spectrum-Table-headCell.is-sortable.is-focused .spectrum-Table-sortedIcon {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Table-headCell.is-sortable:active {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Table-headCell.is-sortable:active .spectrum-Table-sortedIcon {
+ color: rgb(44, 44, 44);
+ }
+/* Helper for shared drop target overlay */
+.spectrum--light .spectrum-Table-cell.focus-ring::before, .spectrum--light .spectrum-Table-cell .is-focused::before, .spectrum--light .spectrum-Table-headCell.focus-ring::before, .spectrum--light .spectrum-Table-headCell .is-focused::before {
+ box-shadow: inset 0 0 0 2px rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Table-body {
+ border-style: solid;
+ border-color: rgb(225, 225, 225);
+ background-color: rgb(255, 255, 255);
+}
+.spectrum--light .spectrum-Table-body.is-drop-target {
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Table-body.is-drop-target::before {
+ background-color: rgba(20,115,230,0.1);
+ }
+/* The tbody tag doesn't allow setting a border-radius, so these hacks are to make that work
+ by putting the border on the individual cells instead. */
+.spectrum--light tbody.spectrum-Table-body {
+ border: none;
+}
+.spectrum--light tbody.spectrum-Table-body .spectrum-Table-row {
+ border-top: none;
+ }
+.spectrum--light tbody.spectrum-Table-body .spectrum-Table-cell {
+ border-top: 1px solid rgb(225, 225, 225);
+ }
+.spectrum--light tbody.spectrum-Table-body .spectrum-Table-row .spectrum-Table-cell:first-child {
+ border-left: 1px solid rgb(225, 225, 225);
+ }
+.spectrum--light tbody.spectrum-Table-body .spectrum-Table-row .spectrum-Table-cell:last-child {
+ border-right: 1px solid rgb(225, 225, 225);
+ }
+.spectrum--light tbody.spectrum-Table-body .spectrum-Table-row:last-child .spectrum-Table-cell {
+ border-bottom: 1px solid rgb(225, 225, 225);
+ }
+.spectrum--light .spectrum-Table-row {
+ border-bottom: 1px solid rgb(225, 225, 225);
+ background-color: rgba(0, 0, 0, 0);
+}
+.spectrum--light .spectrum-Table-row:hover {
+ background-color: rgba(44,44,44,0.06);
+ }
+.spectrum--light .spectrum-Table-row.focus-ring,
+ .spectrum--light .spectrum-Table-row.is-focused {
+ background-color: rgba(44,44,44,0.06);
+ }
+.spectrum--light .spectrum-Table-row:active {
+ background-color: rgba(44,44,44,0.1);
+ }
+.spectrum--light .spectrum-Table-row.is-selected {
+ background-color: rgba(20,115,230,0.1);
+ }
+.spectrum--light .spectrum-Table-row.is-selected:hover {
+ background-color: rgba(20,115,230,0.2);
+ }
+.spectrum--light .spectrum-Table-row.is-selected.focus-ring,
+ .spectrum--light .spectrum-Table-row.is-selected.is-focused {
+ background-color: rgba(20,115,230,0.2);
+ }
+.spectrum--light .spectrum-Table-row.is-drop-target::before {
+ box-shadow: inset 0 0 0 2px rgb(38, 128, 235);
+ background-color: rgba(20,115,230,0.1);
+ }
+.spectrum--light .spectrum-Table-cell {
+ color: rgb(75, 75, 75);
+ background-color: rgba(0, 0, 0, 0);
+}
+.spectrum--light .spectrum-Table-cell--divider {
+ border-right-style: solid;
+ border-right-color: rgb(225, 225, 225);
+}
+.spectrum--light .spectrum-Table--quiet .spectrum-Table-body {
+ border-width: 1px 0;
+ background-color: rgba(0, 0, 0, 0);
+ }
+.spectrum--light .spectrum-Table--quiet .spectrum-Table-body.is-drop-target {
+ box-shadow: none;
+ border-color: transparent;
+ }
+.spectrum--light .spectrum-Table--quiet .spectrum-Table-body.is-drop-target::before {
+ box-shadow: inset 0 0 0 2px rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Table--quiet .spectrum-Table-row {
+ background-color: rgba(0, 0, 0, 0);
+ }
+.spectrum--light .spectrum-Table--quiet .spectrum-Table-row:hover {
+ background-color: rgba(44,44,44,0.06);
+ }
+.spectrum--light .spectrum-Table--quiet .spectrum-Table-row.focus-ring,
+ .spectrum--light .spectrum-Table--quiet .spectrum-Table-row.is-focused {
+ background-color: rgba(44,44,44,0.06);
+ }
+.spectrum--light .spectrum-Table--quiet .spectrum-Table-row:active {
+ background-color: rgba(44,44,44,0.1);
+ }
+.spectrum--light .spectrum-Table--quiet .spectrum-Table-row.is-selected {
+ background-color: rgba(20,115,230,0.1);
+ }
+.spectrum--light .spectrum-Table--quiet .spectrum-Table-row.is-selected:hover {
+ background-color: rgba(20,115,230,0.2);
+ }
+.spectrum--light .spectrum-Table--quiet .spectrum-Table-row.is-selected.focus-ring,
+ .spectrum--light .spectrum-Table--quiet .spectrum-Table-row.is-selected.is-focused {
+ background-color: rgba(20,115,230,0.2);
+ }
+.spectrum--light .spectrum-Table--quiet tbody.spectrum-Table-body .spectrum-Table-row .spectrum-Table-cell:first-child,
+ .spectrum--light .spectrum-Table--quiet tbody.spectrum-Table-body .spectrum-Table-row .spectrum-Table-cell:last-child {
+ border-left: none;
+ border-right: none;
+ }
+/* topdoc
+{{ rating/rating.yml }}
+*/
+.spectrum--light .spectrum-Rating-icon {
+ color: rgb(142, 142, 142);
+}
+/* Star */
+.spectrum--light .spectrum-Rating-icon .spectrum-Rating-starActive {
+ display: block;
+ }
+.spectrum--light .spectrum-Rating-icon .spectrum-Rating-starInactive {
+ display: none;
+ }
+.spectrum--light .spectrum-Rating:not(:hover) .spectrum-Rating-icon:not(.is-selected) {
+ color: rgb(142, 142, 142);
+ }
+/* StarOutline */
+.spectrum--light .spectrum-Rating:not(:hover) .spectrum-Rating-icon:not(.is-selected) .spectrum-Rating-starActive {
+ display: none;
+ }
+.spectrum--light .spectrum-Rating:not(:hover) .spectrum-Rating-icon:not(.is-selected) .spectrum-Rating-starInactive {
+ display: block;
+ }
+.spectrum--light .spectrum-Rating-icon:hover ~ .spectrum-Rating-icon:not(.is-selected) {
+ color: rgb(142, 142, 142);
+}
+/* StarOutline */
+.spectrum--light .spectrum-Rating-icon:hover ~ .spectrum-Rating-icon:not(.is-selected) .spectrum-Rating-starActive {
+ display: none;
+ }
+.spectrum--light .spectrum-Rating-icon:hover ~ .spectrum-Rating-icon:not(.is-selected) .spectrum-Rating-starInactive {
+ display: block;
+ }
+/* topdoc
+{{ rating/rating-active.yml }}
+*/
+.spectrum--light .spectrum-Rating-icon:hover ~ .spectrum-Rating-icon.is-selected {
+ color: rgb(142, 142, 142);
+}
+/* Star */
+.spectrum--light .spectrum-Rating-icon:hover ~ .spectrum-Rating-icon.is-selected .spectrum-Rating-starActive {
+ display: block;
+ }
+.spectrum--light .spectrum-Rating-icon:hover ~ .spectrum-Rating-icon.is-selected .spectrum-Rating-starInactive {
+ display: none;
+ }
+.spectrum--light .spectrum-Rating-icon.is-selected {
+ color: rgb(75, 75, 75);
+ }
+/* Star */
+.spectrum--light .spectrum-Rating-icon.is-selected .spectrum-Rating-starActive {
+ display: block;
+ }
+.spectrum--light .spectrum-Rating-icon.is-selected .spectrum-Rating-starInactive {
+ display: none;
+ }
+/* topdoc
+{{ rating/rating-disabled.yml }}
+*/
+.spectrum--light .spectrum-Rating.is-disabled .spectrum-Rating-icon.is-selected {
+ color: rgb(225, 225, 225);
+}
+/* Star */
+.spectrum--light .spectrum-Rating.is-disabled .spectrum-Rating-icon.is-selected .spectrum-Rating-starActive {
+ display: block;
+ }
+.spectrum--light .spectrum-Rating.is-disabled .spectrum-Rating-icon.is-selected .spectrum-Rating-starInactive {
+ display: none;
+ }
+.spectrum--light .spectrum-Rating:not(:hover).is-disabled .spectrum-Rating-icon:not(.is-selected) {
+ color: rgb(225, 225, 225);
+}
+/* StarOutline */
+.spectrum--light .spectrum-Rating:not(:hover).is-disabled .spectrum-Rating-icon:not(.is-selected) .spectrum-Rating-starActive {
+ display: none;
+ }
+.spectrum--light .spectrum-Rating:not(:hover).is-disabled .spectrum-Rating-icon:not(.is-selected) .spectrum-Rating-starInactive {
+ display: block;
+ }
+.spectrum--light .spectrum-Rating:not(:hover) .spectrum-Rating-input.focus-ring ~ .spectrum-Rating-icon,
+ .spectrum--light .spectrum-Rating:not(:hover) .spectrum-Rating-input.focus-ring ~ .spectrum-Rating-icon:not(.is-selected),
+ .spectrum--light .spectrum-Rating:not(:hover) .spectrum-Rating-input.focus-ring ~ .spectrum-Rating-icon.is-selected {
+ color: rgb(20, 115, 230);
+
+ }
+.spectrum--light .spectrum-Rating:not(:hover) .spectrum-Rating-input.focus-ring ~ .spectrum-Rating-icon > .spectrum-Icon, .spectrum--light .spectrum-Rating:not(:hover) .spectrum-Rating-input.focus-ring ~ .spectrum-Rating-icon:not(.is-selected) > .spectrum-Icon, .spectrum--light .spectrum-Rating:not(:hover) .spectrum-Rating-input.focus-ring ~ .spectrum-Rating-icon.is-selected > .spectrum-Icon {
+ stroke: currentColor;
+ stroke-width: 1px;
+ }
+.spectrum--light .spectrum-Tags-item {
+ color: rgb(110, 110, 110);
+ background-color: rgb(250, 250, 250);
+ border-color: rgb(142, 142, 142);
+}
+.spectrum--light .spectrum-Tags-item .spectrum-ClearButton {
+ color: rgb(142, 142, 142);
+ }
+.spectrum--light .spectrum-Tags-item:hover {
+ background-color: rgb(250, 250, 250);
+ color: rgb(44, 44, 44);
+ border-color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Tags-item:hover .spectrum-ClearButton {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Tags-item.focus-ring {
+ background-color: rgb(250, 250, 250);
+ color: rgb(44, 44, 44);
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Tags-item.focus-ring .spectrum-ClearButton {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Tags-item.is-invalid {
+ color: rgb(110, 110, 110);
+ border-color: rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Tags-item.is-invalid .spectrum-ClearButton {
+ color: rgb(215, 55, 63);
+ }
+.spectrum--light .spectrum-Tags-item.is-invalid:hover {
+ color: rgb(44, 44, 44);
+ border-color: rgb(201, 37, 45);
+ }
+.spectrum--light .spectrum-Tags-item.is-invalid:hover .spectrum-ClearButton {
+ color: rgb(201, 37, 45);
+ }
+.spectrum--light .spectrum-Tags-item.is-invalid.focus-ring {
+ color: rgb(44, 44, 44);
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Tags-item.is-invalid.focus-ring .spectrum-ClearButton {
+ color: rgb(201, 37, 45);
+ }
+.spectrum--light .spectrum-Tags-item.is-disabled {
+ color: rgb(179, 179, 179);
+ background-color: rgb(234, 234, 234);
+ border-color: rgb(234, 234, 234);
+ }
+.spectrum--light .spectrum-Tags-item.is-disabled .spectrum-Avatar {
+ /* Duplicated so state is on the tag */
+ opacity: 0.3;
+ }
+.spectrum--light .spectrum-Tags-item--deletable:hover {
+ color: rgb(110, 110, 110);
+ }
+.spectrum--light .spectrum-Tags-item--deletable:hover .spectrum-ClearButton {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Tags-item--deletable:active {
+ color: rgb(110, 110, 110);
+ }
+.spectrum--light .spectrum-Tags-item--deletable:active .spectrum-ClearButton {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Tags-item--deletable.is-invalid:hover {
+ border-color: rgb(201, 37, 45);
+ color: rgb(110, 110, 110);
+ }
+.spectrum--light .spectrum-Tags-item--deletable.is-invalid:hover .spectrum-ClearButton {
+ color: rgb(201, 37, 45);
+ }
+.spectrum--light .spectrum-Tags-item--deletable.is-invalid:active {
+ border-color: rgb(187, 18, 26);
+ color: rgb(110, 110, 110);
+ }
+.spectrum--light .spectrum-Tags-item--deletable.is-invalid:active .spectrum-ClearButton {
+ color: rgb(187, 18, 26);
+ }
+.spectrum--light .spectrum-Tags-item--deletable.focus-ring {
+ color: rgb(110, 110, 110);
+ }
+.spectrum--light .spectrum-Tags-item--deletable.focus-ring .spectrum-ClearButton {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-Tags-item--deletable.focus-ring.is-invalid {
+ color: rgb(110, 110, 110);
+ }
+.spectrum--light .spectrum-Tags-item.is-disabled .spectrum-ClearButton .spectrum-Icon {
+ color: rgb(179, 179, 179);
+ }
+/* topdoc
+{{ quickaction/quickactions.yml }}
+*/
+.spectrum--light .spectrum-QuickActions-overlay {
+ background-color: rgba(0,0,0,0.2);
+}
+.spectrum--light .spectrum-QuickActions {
+ background-color: rgba(245,245,245,0.9);
+}
+.spectrum--light .spectrum-AssetList-item:hover {
+ background-color: rgb(234, 234, 234);
+ }
+.spectrum--light .spectrum-AssetList-item:focus.focus-ring,
+ .spectrum--light .spectrum-AssetList-item:focus.is-focused {
+ background-color: rgb(234, 234, 234);
+ }
+.spectrum--light .spectrum-AssetList-item:focus.focus-ring::before, .spectrum--light .spectrum-AssetList-item:focus.is-focused::before {
+ /* we cannot achieve rounded corners with outline so we use box-shadow instead */
+ box-shadow: 0px 0px 0px 2px rgb(38, 128, 235) inset;
+ }
+.spectrum--light .spectrum-AssetList-item.is-navigated {
+ /* gray background */
+ background-color: rgb(225, 225, 225);
+ }
+.spectrum--light .spectrum-AssetList-item.is-navigated:hover,
+ .spectrum--light .spectrum-AssetList-item.is-navigated:focus {
+ background-color: rgb(225, 225, 225);
+ }
+.spectrum--light .spectrum-AssetList-item.is-selected {
+ background-color: rgba(20,115,230,0.1);
+ }
+.spectrum--light .spectrum-AssetList-item.is-selected:hover,
+ .spectrum--light .spectrum-AssetList-item.is-selected:focus {
+ background-color: rgba(20,115,230,0.2);
+ }
+.spectrum--light .spectrum-SplitView-pane {
+ background-color: rgb(245, 245, 245);
+}
+.spectrum--light .spectrum-SplitView-splitter {
+ background-color: rgb(225, 225, 225);
+}
+.spectrum--light .spectrum-SplitView-gripper {
+ border-color: rgb(225, 225, 225);
+}
+.spectrum--light .spectrum-SplitView-gripper:before {
+ background-color: rgb(225, 225, 225);
+ }
+.spectrum--light .spectrum-SplitView-splitter.is-draggable:hover,
+ .spectrum--light .spectrum-SplitView-splitter.is-draggable.is-hovered {
+ background-color: rgb(202, 202, 202);
+ }
+.spectrum--light .spectrum-SplitView-splitter.is-draggable:hover .spectrum-SplitView-gripper, .spectrum--light .spectrum-SplitView-splitter.is-draggable.is-hovered .spectrum-SplitView-gripper {
+ border-color: rgb(202, 202, 202);
+ }
+.spectrum--light .spectrum-SplitView-splitter.is-draggable:hover .spectrum-SplitView-gripper:before, .spectrum--light .spectrum-SplitView-splitter.is-draggable.is-hovered .spectrum-SplitView-gripper:before {
+ background-color: rgb(202, 202, 202);
+ }
+.spectrum--light .spectrum-SplitView-splitter.is-draggable:active,
+ .spectrum--light .spectrum-SplitView-splitter.is-draggable.is-active {
+ background-color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-SplitView-splitter.is-draggable:active .spectrum-SplitView-gripper, .spectrum--light .spectrum-SplitView-splitter.is-draggable.is-active .spectrum-SplitView-gripper {
+ border-color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-SplitView-splitter.is-draggable:active .spectrum-SplitView-gripper:before, .spectrum--light .spectrum-SplitView-splitter.is-draggable.is-active .spectrum-SplitView-gripper:before {
+ background-color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-SplitView-splitter.is-draggable:focus {
+ outline: none;
+ }
+.spectrum--light .spectrum-SplitView-splitter.is-draggable.focus-ring {
+ background-color: rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-SplitView-splitter.is-draggable.focus-ring .spectrum-SplitView-gripper {
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-SplitView-splitter.is-draggable.focus-ring .spectrum-SplitView-gripper:before {
+ background-color: rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Pagination-pageButton:hover {
+ background-color: rgba(44,44,44,0.04);
+ }
+.spectrum--light .spectrum-Pagination-pageButton:focus {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Pagination-pageButton.is-selected {
+ background-color: rgb(75, 75, 75);
+ color: rgb(255, 255, 255);
+ }
+.spectrum--light .spectrum-Banner {
+ color: rgb(255, 255, 255);
+}
+.spectrum--light .spectrum-Banner--info {
+ background-color: rgb(20, 115, 230);
+}
+.spectrum--light .spectrum-Banner--warning {
+ background-color: rgb(218, 123, 17);
+}
+.spectrum--light .spectrum-Banner--error {
+ background-color: rgb(215, 55, 63);
+}
+.spectrum--light .spectrum-Rule--large {
+ background-color: rgb(75, 75, 75);
+}
+.spectrum--light .spectrum-Rule--medium {
+ background-color: rgb(225, 225, 225);
+}
+.spectrum--light .spectrum-Rule--small {
+ background-color: rgb(225, 225, 225);
+}
+.spectrum--light .spectrum-StatusLight {
+ color: rgb(75, 75, 75);
+}
+.spectrum--light .spectrum-StatusLight[disabled],
+ .spectrum--light .spectrum-StatusLight.is-disabled {
+ color: rgb(179, 179, 179);
+ }
+.spectrum--light .spectrum-StatusLight[disabled]::before, .spectrum--light .spectrum-StatusLight.is-disabled::before {
+ background-color: rgb(202, 202, 202);
+ }
+.spectrum--light .spectrum-StatusLight--negative::before {
+ background-color: rgb(227, 72, 80);
+}
+.spectrum--light .spectrum-StatusLight--notice::before {
+ background-color: rgb(230, 134, 25);
+}
+.spectrum--light .spectrum-StatusLight--positive::before {
+ background-color: rgb(45, 157, 120);
+}
+.spectrum--light .spectrum-StatusLight--info::before,
+.spectrum--light .spectrum-StatusLight--active::before {
+ background-color: rgb(38, 128, 235);
+}
+.spectrum--light .spectrum-StatusLight--neutral {
+ color: rgb(110, 110, 110);
+}
+.spectrum--light .spectrum-StatusLight--neutral::before {
+ background-color: rgb(179, 179, 179);
+ }
+.spectrum--light .spectrum-StatusLight--celery::before {
+ background-color: rgb(68, 181, 86);
+}
+.spectrum--light .spectrum-StatusLight--yellow::before {
+ background-color: rgb(223, 191, 0);
+}
+.spectrum--light .spectrum-StatusLight--fuchsia::before {
+ background-color: rgb(192, 56, 204);
+}
+.spectrum--light .spectrum-StatusLight--indigo::before {
+ background-color: rgb(103, 103, 236);
+}
+.spectrum--light .spectrum-StatusLight--seafoam::before {
+ background-color: rgb(27, 149, 154);
+}
+.spectrum--light .spectrum-StatusLight--chartreuse::before {
+ background-color: rgb(133, 208, 68);
+}
+.spectrum--light .spectrum-StatusLight--magenta::before {
+ background-color: rgb(216, 55, 144);
+}
+.spectrum--light .spectrum-StatusLight--purple::before {
+ background-color: rgb(146, 86, 217);
+}
+.spectrum--light .spectrum-TreeView-item.is-disabled > .spectrum-TreeView-itemLink {
+ color: rgb(179, 179, 179);
+ }
+.spectrum--light .spectrum-TreeView-item.is-disabled > .spectrum-TreeView-itemLink .spectrum-Icon {
+ color: rgb(202, 202, 202);
+ }
+.spectrum--light .spectrum-TreeView-itemLink {
+ color: rgb(75, 75, 75);
+}
+.spectrum--light .spectrum-TreeView-itemLink:hover,
+ .spectrum--light .spectrum-TreeView-itemLink.is-selected {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-TreeView-itemLink:hover::before, .spectrum--light .spectrum-TreeView-itemLink.is-selected::before {
+ background-color: rgba(44,44,44,0.04);
+ }
+.spectrum--light .spectrum-TreeView-itemLink.focus-ring {
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-TreeView-itemLink.focus-ring::before {
+ background-color: rgba(44,44,44,0.04);
+
+ /* we cannot achieve rounded corners with outline so we use box-shadow instead */
+ box-shadow: 0px 0px 0px 2px rgb(38, 128, 235) inset;
+ }
+.spectrum--light .spectrum-TreeView-itemLink.is-drop-target::before {
+ background-color: rgba(20,115,230,0.1);
+ box-shadow: 0px 0px 0px 2px rgb(38, 128, 235) inset;
+ }
+/* topdoc
+{{ sidenav/sidenav-multilevel.yml }}
+*/
+.spectrum--light .spectrum-SideNav-item.is-selected > .spectrum-SideNav-itemLink {
+ color: rgb(44, 44, 44);
+ background-color: rgba(44,44,44,0.06);
+ }
+/* topdoc
+{{ sidenav/sidenav.yml }}
+*/
+.spectrum--light .spectrum-SideNav-item .is-active > .spectrum-SideNav-itemLink {
+ background-color: rgba(44,44,44,0.06);
+ }
+/* Disable all children */
+.spectrum--light .spectrum-SideNav-item.is-disabled .spectrum-SideNav-itemLink {
+ background-color: rgba(0, 0, 0, 0);
+ color: rgb(179, 179, 179);
+
+ cursor: default;
+ pointer-events: none;
+ }
+.spectrum--light .spectrum-SideNav-itemLink {
+ background-color: rgba(0, 0, 0, 0);
+ color: rgb(75, 75, 75);
+}
+.spectrum--light .spectrum-SideNav-itemLink:hover {
+ background-color: rgba(44,44,44,0.06);
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-SideNav-itemLink:active {
+ background-color: rgba(44,44,44,0.06);
+ }
+.spectrum--light .spectrum-SideNav-itemLink.focus-ring {
+ background-color: rgba(44,44,44,0.06);
+ color: rgb(44, 44, 44);
+ }
+.spectrum--light .spectrum-SideNav-itemLink.focus-ring::before {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-SideNav-heading {
+ color: rgb(110, 110, 110);
+}
+.spectrum--light .spectrum-IllustratedMessage-illustration {
+ color: rgb(179, 179, 179);
+ fill: currentColor;
+ stroke: currentColor;
+}
+.spectrum--light .spectrum-DropIndicator {
+ background: rgb(38, 128, 235);
+}
+.spectrum--light .spectrum-DropIndicator:before,
+ .spectrum--light .spectrum-DropIndicator:after {
+ border-color: rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Card {
+ border-color: rgb(234, 234, 234);
+ background-color: rgb(255, 255, 255);
+}
+.spectrum--light .spectrum-Card:hover {
+ border-color: rgb(202, 202, 202);
+ }
+.spectrum--light .spectrum-Card.is-selected,
+ .spectrum--light .spectrum-Card:focus {
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ }
+.spectrum--light .spectrum-Card.is-drop-target {
+ border-color: rgb(38, 128, 235);
+ box-shadow: 0 0 0 1px rgb(38, 128, 235);
+ background-color: rgba(20,115,230,0.1);
+ }
+.spectrum--light .spectrum-Card-description {
+ color: rgb(110, 110, 110);
+}
+.spectrum--light .spectrum-Card-coverPhoto {
+ background-color: rgb(234, 234, 234);
+ border-bottom-color: rgb(234, 234, 234);
+}
+.spectrum--light .spectrum-Card-footer {
+ border-color: rgb(234, 234, 234);
+}
+.spectrum--light .spectrum-Card--quiet,
+.spectrum--light .spectrum-Card--gallery {
+ border-color: transparent;
+ background-color: transparent;
+}
+.spectrum--light .spectrum-Card--quiet .spectrum-Card-preview, .spectrum--light .spectrum-Card--gallery .spectrum-Card-preview {
+ background-color: rgb(234, 234, 234);
+ }
+.spectrum--light .spectrum-Card--quiet:hover, .spectrum--light .spectrum-Card--gallery:hover {
+ border-color: transparent;
+ }
+.spectrum--light .spectrum-Card--quiet:hover .spectrum-Card-preview, .spectrum--light .spectrum-Card--gallery:hover .spectrum-Card-preview {
+ background-color: rgb(225, 225, 225);
+ }
+.spectrum--light .spectrum-Card--quiet.is-selected,
+ .spectrum--light .spectrum-Card--quiet:focus,
+ .spectrum--light .spectrum-Card--gallery.is-selected,
+ .spectrum--light .spectrum-Card--gallery:focus {
+ border-color: transparent;
+ box-shadow: none;
+ }
+.spectrum--light .spectrum-Card--quiet.is-selected .spectrum-Card-preview, .spectrum--light .spectrum-Card--quiet:focus .spectrum-Card-preview, .spectrum--light .spectrum-Card--gallery.is-selected .spectrum-Card-preview, .spectrum--light .spectrum-Card--gallery:focus .spectrum-Card-preview {
+ background-color: rgb(234, 234, 234);
+ }
+.spectrum--light .spectrum-Card--quiet.is-selected .spectrum-Card-preview:before, .spectrum--light .spectrum-Card--quiet:focus .spectrum-Card-preview:before, .spectrum--light .spectrum-Card--gallery.is-selected .spectrum-Card-preview:before, .spectrum--light .spectrum-Card--gallery:focus .spectrum-Card-preview:before {
+ border-color: rgb(20, 115, 230);
+ box-shadow: 0 0 0 1px rgb(20, 115, 230);
+ }
+.spectrum--light .spectrum-Card--quiet.is-drop-target, .spectrum--light .spectrum-Card--gallery.is-drop-target {
+ border-color: transparent;
+ background-color: transparent;
+ box-shadow: none;
+ }
+.spectrum--light .spectrum-Card--quiet.is-drop-target .spectrum-Card-preview, .spectrum--light .spectrum-Card--gallery.is-drop-target .spectrum-Card-preview {
+ background-color: rgba(20,115,230,0.1);
+ }
+.spectrum--light .spectrum-Card--quiet.is-drop-target .spectrum-Card-preview:before, .spectrum--light .spectrum-Card--gallery.is-drop-target .spectrum-Card-preview:before {
+ border-color: rgb(20, 115, 230);
+ box-shadow: 0 0 0 1px rgb(20, 115, 230);
+ }
+.spectrum--light .spectrum-Card--quiet.is-drop-target .spectrum-Asset-folderBackground,
+ .spectrum--light .spectrum-Card--quiet.is-drop-target .spectrum-Asset-fileBackground,
+ .spectrum--light .spectrum-Card--gallery.is-drop-target .spectrum-Asset-folderBackground,
+ .spectrum--light .spectrum-Card--gallery.is-drop-target .spectrum-Asset-fileBackground {
+ fill: rgba(20,115,230,0.1);
+ }
+.spectrum--light .spectrum-Card--quiet.is-drop-target .spectrum-Asset-folderOutline,
+ .spectrum--light .spectrum-Card--quiet.is-drop-target .spectrum-Asset-fileOutline,
+ .spectrum--light .spectrum-Card--gallery.is-drop-target .spectrum-Asset-folderOutline,
+ .spectrum--light .spectrum-Card--gallery.is-drop-target .spectrum-Asset-fileOutline {
+ fill: rgb(20, 115, 230);
+ }
+.spectrum--light .spectrum-Card--quiet .spectrum-Card-title, .spectrum--light .spectrum-Card--gallery .spectrum-Card-title {
+ color: rgb(75, 75, 75);
+ }
+.spectrum--light .spectrum-Card--quiet .spectrum-Card-subtitle, .spectrum--light .spectrum-Card--gallery .spectrum-Card-subtitle {
+ color: rgb(110, 110, 110);
+ }
+.spectrum--light .spectrum-Asset-folderBackground {
+ fill: rgb(225, 225, 225);
+}
+.spectrum--light .spectrum-Asset-fileBackground {
+ fill: rgb(255, 255, 255);
+}
+.spectrum--light .spectrum-Asset-folderOutline,
+.spectrum--light .spectrum-Asset-fileOutline {
+ fill: rgb(179, 179, 179);
+}
diff --git a/docker/docs.conf b/docker/docs.conf
new file mode 100644
index 0000000..51ad82f
--- /dev/null
+++ b/docker/docs.conf
@@ -0,0 +1,18 @@
+server {
+ listen 80 default_server;
+ location / {
+ if ($http_x_forwarded_proto != "https") {
+ return 302 https://$host$uri;
+ }
+ root /srv/docs;
+ index index.html;
+ }
+}
+
+server {
+ listen 80;
+ server_name developer.adobedtm.com;
+ location / {
+ return 302 https://developer.adobelaunch.com$request_uri;
+ }
+}
diff --git a/extensions/guides/getting-started.md b/extensions/guides/getting-started.md
new file mode 100644
index 0000000..7454232
--- /dev/null
+++ b/extensions/guides/getting-started.md
@@ -0,0 +1,499 @@
+---
+title: Getting Started
+---
+
+To write an extension for Launch, we need to make sure your Adobe Experience Cloud Organization is set up properly, and that developers on your team have the correct permissions. Your extension project (extension package) should be ready for uploading to our system, and of course you'll need to be familiar with the Launch user interface. In this guide we'll walk through all the steps and links to all the resources you need to start your own extension project.
+
+# Getting Started Guide - Table Of Contents
+{:.no_toc}
+
+* TOC
+{:toc}
+
+## Get Your Company Set Up
+
+### Your Experience Cloud Account
+
+The first step is to confirm you have access to an Experience Cloud Organization. This will enable you to login to the Experience Cloud, to assign user permissions to your team, and to use Adobe Experience Cloud products. You can get an Experience Cloud Organization as a customer or a partner.
+
+Customers already have an Experience Cloud Organization that's created when contracts are signed. You can use this for extension development.
+
+Partners can have an Experience Cloud Organization created by joining one of Adobe's Partner Programs.
+
+* **Exchange Partner Program** - This program is for partners who have technology that's complimentary to Adobe and can be integrated with Adobe technologies to add value to our mutual customers. This program maintains a [marketplace](https://www.adobeexchange.com/experiencecloud.html) where partners can create listings that promote their integrations. You can see the registration guide [here](https://partners.adobe.com/exchangeprogram/experiencecloud/reg-guide.html) and you can begin your registration [here](https://partners.adobe.com/exchangeprogram/experiencecloud/prereg.html). **You must be a member of this program in order to create a listing that will show in the marketplace.**
+* **Solution Partner Program (SPP)** – This program is for consulting firms that help Adobe customers make the most of their investments and partners that resell Adobe solutions. You can register for the Solution Partner Program and check out our information on how to join if you have any questions. See the registration guide [here](https://spark.adobe.com/page/7PKZzIJJjkcDd/) or begin your registration [here](https://solutionpartners.adobe.com/home.html).
+
+**Note** - Solution Partners must also [register](https://partners.adobe.com/exchangeprogram/experiencecloud/prereg.html) for the Exchange Partner Program as the Exchange agreement contains the terms and conditions for Launch extension development.
+
+Before you complete your Exchange registration, please email the Exchange admin at
and explain that you are registering so that you can promote your Launch extension. If you don't do this, they will likely deny your application and suggest you are a better fit for the SPP. Please note that currently your corporate email can only be used in one partner program at a time, so you will need to use a different corporate email as the registered contact for each of the programs.
+
+If your company is already an Exchange Partner, but you don't have an Experience Cloud Sandbox account, you can request access by signing in to the [Exchange Portal](https://partners.adobe.com/exchangeprogram/experiencecloud.html) and [requesting a Sandbox](https://partners.adobe.com/exchangeprogram/experiencecloud/build/sandbox.html).
+
+If you already have an Experience Cloud Account, but do not have access to Launch, please see the instructions for setting up groups and users [here](https://docs.adobelaunch.com/administration/users).
+
+### Create a Listing in the Exchange Partner Portal (required)
+
+Extensions created for public release are required to have a listing in the [Exchange Marketplace](https://experiencecloud.adobeexchange.com/). These listings enable extension developers to post support information, links to additional support or documentation, and to market your extensions to prospective users who may not be aware of your company or the functionality of your extension. In this marketplace, your Extension will have a public listing that can be viewed without the user being authenticated to Launch.
+
+To create a listing, please sign in to the [Partner Portal](https://partners.adobe.com/exchangeprogram/experiencecloud#). Once signed in, click on the Application Listing button next to your name. Then click on create listing and follow through the screens. Before you start, it will help to read the [App Submission Guideline](https://partners.adobe.com/exchangeprogram/experiencecloud/build/ec-exchange.html) to learn how to submit the most persuasive listing. One question asked often is about the Featured Image included in the Application Listing. The Featured Image is shown when you or someone else shares your Exchange listing in social media or messengers, so it should be an image that can stand alone and represents your brand and product well.
+
+We also suggest being very clear about what your extension does and why someone might want to use it. **This is your marketing space**, please feel free to promote your extension here with clear descriptions, links to landing pages on your site, links to help docs or support email addresses, etc. While you have limited space in your extension views, this Exchange listing is your chance to really promote your extension, and your company. The [App Submission Guideline](https://partners.adobe.com/exchangeprogram/experiencecloud/build/ec-exchange.html) will help you craft a successful listing in the Exchange Marketplace.
+
+On the first page of editing your listing, please be sure to include the word "Launch" in the 'Custom Tags' field. This will make your listing appear in searches for Launch.
+
+
+
+Once submitted, the Adobe Exchange team will review the application and will either approve the application, or respond with comments about changes. This process is detailed in the [App Submission Instructions](https://app-cdn.adobe.com/content/dam/mcp_assets/public/documents/Adobe-Exchange-Program-Experience-Cloud-Submit-App-Guide.pdf).
+
+If you don't have a login to the Exchange site, make sure that your email is registered for the Exchange program by following the instructions in the [Program Registration Guide](https://partners.adobe.com/content/mcp/us/en/home/reg-guide.html). Even if your company is registered, each user still has to associate their email with the partner account for the company. For questions on this process, email .
+
+### Your Admin Console Set Up
+
+Before you get started with your extension_package, you need to set up your team members with user accounts and permissions. This is accomplished in the Adobe [Administration Console](https://adminconsole.adobe.com/).
+
+The steps included here should get you sorted, but if you need more information about Admin Console and user administration, there are a few resources to help you out:
+
+* [Administration User Guide](https://helpx.adobe.com/enterprise/administering/user-guide.html?topic=/enterprise/administering/morehelp/introduction.ug.js) - Information about all things in the Admin Console
+* [Administrative Roles in the Enterprise User Guide](https://helpx.adobe.com/au/enterprise/using/admin-roles.html) - More about the different types of administration roles. For the guide below, we'll assume you are an Org Admin.
+
+#### Choose Your Organization
+
+Your Adobe Experience Cloud organization administrator should sign in to the [Admin Console](https://adminconsole.adobe.com/). The first screen is the Overview:
+
+
+
+Some of you may have access to more than one Organization. In order to add the Launch product to the correct Org, click the name of the Organization you see in the upper right corner of the screen, then choose the one where you want to use Launch:
+
+
+
+#### Create a Product Profile
+
+A Product Profile is a group. Individual rights are assigned to product profiles and any users in the profile will inherit those rights.
+
+Choose the "Products" link at the top, and "LAUNCH, BY ADOBE" on the left. If you do not have the Launch Product listed, customers should contact their account team and partners should email .
+
+
+
+The screenshot above shows one existing Profile for Launch, you may not have one yet. To create one, click the blue "New Profile" button. On the Create a New Profile screen, just add a Profile Name (Adobe Launch, for example), and an optional Description, then click Done:
+
+
+
+Now that we have the Product Profile in our Organization, let's add our users.
+
+#### Assign Users to the Product Profile
+
+Notice that the Product Profile shows zero for Entitled Users and Admins. Click the name of the Product Profile you created (Adobe Lunch in our example):
+
+
+
+Click on the Users tab, then you can add users by clicking the blue Add User link:
+
+
+
+Here you can search for existing Adobe ID users by email, or add new ones as Users of this Adobe Launch Product Profile:
+
+
+
+Click the blue Save link when you add the user. When you have all the users you need in this Product Profile, we'll add Permissions for them. Click the Permissions tab:
+
+
+
+On the Permissions screen you'll see PROPERTIES, COMPANY RIGHTS, and PROPERTY RIGHTS:
+
+
+
+To author extensions, you and your team need - at minimum - `Manage Properties` from the Company group as well as `Manage Extensions`, `Manage Environments`, and `Develop` from the Property group. You can create additional Product Profiles with more limited rights later if you like, but for now it is simplest to click "+ Add all" for both Company Rights and Property Rights, being sure to click blue "Save" link on each:
+
+
+
+
+
+So far, we have chosen the appropriate Organization, created a Product Profile, added Users to the product profile, and assigned permissions.
+
+This completes the required set up in the Administration Console! You and your team members that have been set up as users can now sign in to [Launch](https://launch.adobe.com/).
+
+### Confirm Provisioning
+
+After your company is provisioned with access to Launch and your users are set up as described above, you should be able to access the [Launch](https://launch.adobe.com/) production environment. If you know you've been provisioned for Launch and you've gone through the Admin Console steps above, but you still can't sign in to [Launch](https://launch.adobe.com/), please contact your Adobe support representatives.
+
+## Creating Your Extension Package
+
+We have a number of resources available to help you write extensions.
+
+### Launch UI Basics
+
+Before you get too deep into extension development is is helpful to understand how users will use your extension. If you're not familiar with the Launch user interface, here are a few resources that can help you out:
+
+* Introduction to Launch, by Adobe [YouTube playlist](https://www.youtube.com/watch?v=rmf1Nch43pI&list=PLOdw8u2F8CIjJtANC7IUzUW69cePHnZ3x)
+* Launch User [help docs](https://docs.adobelaunch.com)
+
+### Extension Development
+
+Once you're up to speed on the Launch UI and how users will use it, you can start planning how you want your own extension to work and how you want users to be able to use it. Think of it like its own mini-product with requirements.
+
+#### Guides
+
+These guides can help you understand the extension development process:
+
+* The [Extension Quickstart](/extensions/guides/quickstart) guide and most of the other links available in the left-nav are great reference material for understanding what extensions can do, how user information is stored and passed between your extension and Launch, how your code is bundled into Launch libraries, and how your extension code is interpreted and used at runtime in the browser.
+* The recently updated [tutorial video](https://youtu.be/rxjtC9o4rl0) is a great place to start.
+* The [Introduction to Extensions](https://www.youtube.com/playlist?list=PLOdw8u2F8CIgynzKrPEwCPuDxzHW1WP5m) YouTube playlist walks through the process of creating extension packages.
+* [Understanding JSON Schema](https://spacetelescope.github.io/understanding-json-schema/index.html#) article.
+* [JSON Lint/Validator](http://jsonlint.com/)
+* [JSON Viewer](https://chrome.google.com/webstore/detail/json-viewer/gbmdgpbipfallnflgajpaliibnhdgobh) Chrome extension to highlight & print JSON & JSONP.
+* [jsonschema.net](https://jsonschema.net/#/editor) editor to help create JSON schema from your object
+* [JSON Schema Validator](http://www.jsonschemavalidator.net/) An online, interactive JSON Schema validator.
+
+#### Tools
+
+NPM tools to help you with your extension package development:
+
+* [Launch Extension Scaffold Tool](https://www.npmjs.com/package/@adobe/reactor-scaffold) helps you easily create a starter project on your local machine
+* [Launch Extension Sandbox](https://www.npmjs.com/package/@adobe/reactor-sandbox) helps you validate your extension views and modules on your local machine
+* [Launch Extension Packager](https://www.npmjs.com/package/@adobe/reactor-packager) is a command-line utility for packaging a Launch extension into a zip file
+* [Reactor Uploader](https://www.npmjs.com/package/@adobe/reactor-uploader) - interactive command line tool to help you input your technical account credentials and upload your extension package to Launch
+
+#### Example Extensions
+
+There are example extensions on Github you can review or use as starter projects:
+
+* [Hello World example extension](https://github.com/Adobe-Marketing-Cloud/reactor-helloworld-extension)
+* [Facebook example extension](https://github.com/Adobe-Marketing-Cloud-Activation/extension-facebookpixel)
+* [Typekit example extension](https://github.com/jeffchasin/extension-typekit)
+* [Pinterest example extension](https://github.com/jeffchasin/extension-pinterest)
+
+#### Slack Workspace
+
+There is a Slack community workspace where extension authors can support each other. You can request access at [http://join.launchdevelopers.chat](http://join.launchdevelopers.chat).
+
+**Please note**: while there are members of the Launch team in this Slack workspace, it is a community resource not sponsored by or moderated by Adobe.
+
+### Extension Validation
+
+Once your team is satisfied with the performance of your extension and the results they see in the [Sandbox](https://www.npmjs.com/package/@adobe/reactor-sandbox#running-the-sandbox) tool, you should be ready to upload your extension package to Launch. Before uploading, please validate that any required fields or settings are present. For example, reviewing your [extension manifest](/extensions/reference/extension-manifest/), your [extension configuration](/extensions/reference/extension-configuration/), your [views](/extensions/reference/views/), and your [library modules](/extensions/reference/library-module-format/) (at a minimum) would be good practice. One specific example is your logo file: Add an `"iconPath": "example.svg",` line to your `extension.json` file and include that logo image file in your project. This is the relative path to the icon that will be displayed for the extension within Launch. It should not begin with a slash. It must reference an SVG file with a `.svg` extension. The SVG should appear normally when rendered square and may be scaled by our user interface. See [How to Scale SVG](https://css-tricks.com/scale-svg/) for more details.
+
+**Required**: For public extensions, please include an item in your `extension.json` with a link to your Exchange listing. Your [extension manifest](/extensions/reference/extension-manifest/) should include an entry like this:
+`"exchangeUrl":"https://www.adobeexchange.com/experiencecloud.details.12345.html"` pointing to the URL of your Exchange listing.
+
+## Upload and E2E Testing
+
+Testing extensions involves using the Launch API to upload your extension packages as well as using the Launch UI to install your extension package to a property and then exercise its capabilities inside a Launch library and build.
+
+The basic steps to achieve this are:
+
+1. Create an Adobe I/O Integration (also called a technical account)
+1. Upload your extension package
+1. Login to Launch
+1. Create a Development property
+1. Install your extension package to a development property
+1. Create resources that use your extension capabilities
+1. Publish your changes
+1. Install Launch on your test site
+1. Test
+
+When you discover issues that need to be fixed, you will:
+
+1. Update your extension package - your installed extension will reference this new package automatically
+1. Update resources as needed
+1. Publish again
+1. Test
+
+As we walk through the steps below, we'll assume you're using Mac OS with node and npm installed and available.
+
+### Create an Adobe I/O Technical Account
+
+Currently, extension packages are uploaded using the Reactor API. In order to use the API, you need a technical account with Adobe I/O. We'll create the technical account in the I/O console and then we'll use the Uploader tool to upload the extension package.
+
+**Please note**: Only Experience Cloud Organization Administrators can create integrations in Adobe I/O for this purpose. This is different than being an Admin in a particular product, like Analytics. If you create an integration and you see the Launch product button grayed out, please confirm with your support team that you are and Administrator for your Experience Cloud Organization, or contact the Administrator in your company.
+
+The first thing we need is a public/private key pair. You can purchase key pairs if you want, but for this guide, we'll generate our own self signed keys.
+
+In your terminal, issue the following three commands:
+
+```bash
+mkdir keys
+cd keys
+openssl req -x509 -sha256 -nodes -days 365 -newkey rsa:2048 -keyout reactor_private.key -out reactor_public.crt
+```
+
+We recommend naming your keys for easy reference later (`reactor_private.key` and `reactor_public.crt` in the above example) and to store them in a folder. If you create multiple integrations, you can easily identify and manage which keys go with which integration.
+
+[OpenSSL](https://www.openssl.org/) asks for some information that will be incorporated into the keys:
+
+```bash
+Country Name (2 letter code: // Example: US
+State or Province Name: // Example: California
+Locality Name (eg, city): // Example: Santa Monica
+Organization Name (eg, company): // Example: Grunions Incorporated
+Organizational Unit Name (eg, section): // Example: Engineering
+Common Name (e.g. server FQDN or YOUR name): // Example: Jane Doe
+Email Address: // Example: jane.doe@grunions.com
+```
+
+After you input your information, open the current directory and you should see your .key and .crt files, with the name you used in the `openssl` command above. Here's an example:
+
+
+
+Now we need to actually create the technical account in Adobe I/O:
+
+1. Go to [https://console.adobe.io/](https://console.adobe.io/) and sign in with your Adobe ID.
+1. Click the blue "New Integration" button
+1. Select "Access an API", then click "Continue"
+1. Select "New integration", then click "Continue"
+1. Select the Adobe service to integrate with: select "Experience Platform Launch API" and click "Continue"
+1. On the "Create a new integration" screen, enter a Name and Description. Drag & drop your xxxx_public.crt file onto the "Public keys certificates" drop zone. At the bottom of the screen, under "Launch, by Adobe Configuration", select "Extension Developer" as the role and click the blue button:
+
+
+
+You should see a message that says "Your integration has been created". Now click the "Continue to integration details" button.
+
+You are now looking at the "Overview" screen of the integration. Keep this screen open, we need several pieces of information from here for the next step.
+
+
+
+### Upload Your Extension Package
+
+With your credentials sorted out, you're now ready to test your extension package end-to-end.
+
+When you first upload your extension package, it goes into a state of `development`. This means that it is only visible with your own Launch company and only with a Launch property that has been marked for extension development (more on this later).
+
+For now, go back to the command line within the directory that contains your .zip package.
+
+```bash
+npx @adobe/reactor-uploader
+```
+
+**Note**: `npx` allows you to download and run an npm package without actually installing it on your machine. This is the simplest way to run the Uploader.
+
+The Uploader will ask you to input several pieces of information:
+
+* Which environment do you want to upload to? Production.
+* How would you like to authenticate? Provide Adobe I/O integration details.
+* What is the path to your private key? /path/to/reactor_private.key. This is the place you saved your private key above.
+* What is your Org ID? Copy/paste this from the I/O Console overview page that you left open earlier.
+* What is your technical account ID? Copy/paste from I/O Console.
+* What is your API key? Copy/paste from I/O Console.
+* What is client secret? Copy/paste from I/O console.
+* What is the path to the extension_package you want to upload? /path/to/extension_package.zip. If you invoke the uploader from within the directory containing your .zip package, you can just select it from the list instead of typing the path.
+
+Your extension package will then be uploaded and the uploader will give you the ID of the extension_package.
+
+**Note**: When uploading or patching, extension packages are placed into a pending state while the system asynchronously extracts the package and deploys. While this process is taking place, you can poll the `extension_package` ID for its status using the API and within Launch, you'll see an extension card in the catalog marked as Pending.
+
+**Note**: If you plan to run the uploader often, putting all this information each time in can be a burden. You can also pass these in as argument from the command line. Check out the [Command Line Arguments section](https://www.npmjs.com/package/@adobe/reactor-uploader#command-line-arguments) of the NPM docs for more info.
+
+### Login to Launch
+
+The users we set up earlier can now login to Launch at [https://launch.adobe.com](https://launch.adobe.com/). Again, if you have multiple Experience Cloud Organizations with Adobe, you'll need to select the Organization where you added the Product Profile in the first step above:
+
+
+
+### Create a Development Property
+
+When you sign in to the Launch you'll see the Properties screen first. A property is a container for the tags that you want to deploy and it can be used on one or many sites.
+
+
+
+You see my 'test' property here but you won't see any properties on your screen the first time you sign in. Click **New Property** to create one. Enter a name and a URL. You'll probably want to use the URL of your test site or page where you'll be testing your extension. This domain field can be used by some extensions or by a condition using the Core extension (which we'll look at later). Note that `localhost` won't work, so if you're on a `localhost` URL, just use any value for this testing, like example.com.
+
+Because you want to use this property for extension development testing, you also need to expand the Advanced Options and make sure to check the box for "Configure for extension development".
+
+
+
+Click the blue **Save** link at the bottom to save your new property.
+
+This brings you back to the Properties screen. Click on the name of your property that you just created. This is the Overview screen in a property. Not much work happens here, but there are links to each area of the system, with the global navigation links at the top.
+
+### Install Your Extension
+
+To install your extension in this property, click on the **Extensions** link in the main navigation links at the top.
+
+
+
+You'll see the **Core** extension on this **Installed** screen. The Core extension contains all the tag management functionality within Launch. To add your extension, click on the **Catalog**:
+
+
+
+The catalog displays card icons for each available extension. If your extension isn't displayed in the catalog, be sure you completed the steps above in the Adobe Administration Console Set Up and Creating Your Extension Package sections above first. Your extension package may also show up as Pending if Launch hasn't completed the initial processing.
+
+If you are convinced you've done everything correctly, and you still don't see a Pending or Failed extension package in the catalog, you may want to hit the API directly to check the status of your extension package. For more info on that, please read [Get an ExtensionPackage](/api/reference/1.0/extension_packages/fetch/) in the API docs.
+
+Assuming that your extension package has finished processing, the card here will have an **Install** button for you to click:
+
+
+
+This will bring up the configuration screen you built for your extension (if you have one). Add any information needed to configure your extension and click the blue **Save** link at the bottom. If your extension does not have configuration, then it will be installed as soon as you click Install.
+
+Here's an example with the Facebook extension:
+
+
+
+You should now see the **Installed** extensions screen with the Core extension and your extension.
+
+
+
+### Create Resources to Use Your Extension
+
+Extensions provide new capabilities to users in Launch. These almost always show up in Data Elements or in the Rule Builder. We'll discuss both of these areas next.
+
+#### Data Elements
+
+Data elements exist in Launch to help users persist values. Each data element is a mapping or pointer to source data. A single data element is a variable that can be mapped to query strings, URLs, cookie values, JavaScript variables, etc.
+
+Extensions can define data element types if needed for your extension to operate, or simply as a convenience to users. When an extension provides data element types, they appear in a dropdown list for users on the Create New Data Element screen:
+
+
+
+When a user selects your extension from the Extension dropdown, the Data Element Type dropdown is populated with any data element types supplied by your extension. The user can then map each data element to its source value. Data elements can then be used when building rules in the Data Element Change Event or Custom Code Event to trigger a rule to execute. A data element can also be used in the Data Element Condition, or other Conditions, Exceptions, or Actions in a rule.
+
+Once the data element is created (the mapping is set up), users can reference the source data simply by referencing the data element. If the source of the value ever changes (site re-designs, etc.) users only need update the mapping once in Launch and all the data elements will automatically receive the new source value.
+
+#### Rules
+
+Click on the **Rules** link in the top navigation, then **Add Rule**:
+
+
+
+First, name the rule, any name is fine. The Create New Rule screen is set up like an `if-then` statement:
+
+
+
+If an event occurs, and conditions pass, and there are no exceptions, the action is triggered. This same flow exists in extensions where you can create or leverage events, conditions, exceptions, data elements, or actions.
+
+Continuing with the Facebook example, let's add an event for any time a page loads on our site:
+
+
+
+With the `Window Loaded` Event Type, any time a page loads on our site this rule will be triggered. Click **Save**. For this example, let's skip Conditions and Exceptions as we want this rule triggered for any page on our site - our "global" On Load rule so to speak.
+
+Under Actions click **Add**. On this Action Configuration screen we can choose the extension we want to work with and the action we want to occur when this rule is triggered. Let's choose the **Facebook Pixel** under Extension, and **Send Page View** under Action Type:
+
+
+
+Click the blue **Keep Changes** at the bottom, and **Save Rule** on the next screen. When testing your extension, you can select any events, conditions, etc. supplied by your extension in any number of rules.
+
+### Publish Your Changes
+
+In the main navigation, click on **Publishing**, then on the blue **Add New Library** link:
+
+
+
+A library is a set of instructions for how extensions, data elements, and rules will interact with one another and with a website. Libraries are compiled into builds. A library can contain as many changes as a user is comfortable making or testing at once.
+
+On the Create New Library screen, add a Name and choose an Environment. Launch provides a default development environment helpfully named `Development`, so select that one from the Environment list. For now, we'll add all available resources, so click on **Add All Changed Resources**.
+
+**Note**: When you add a resource to a library, a snapshot of that resource as of that exact moment is taken and added to the library. When you make changes to your resources later (for example, as a result of fixes you need to make), you'll need to also update the library to include the latest changes to your resources. The **Add All Changed Resources** button is useful for this purpose as well.
+
+
+
+Then click the blue **Save** link at the bottom. Now that we have all our changes included in this `dev` library, let's build it:
+
+
+
+After the build process completes, you should see a green **success** indicator next to the library name:
+
+
+
+The Launch library is now published and waiting to be used. We now need to tell our test page to look for this Launch library so we can test the behavior for the end-user in a browser.
+
+### Install Launch in Your Test Site or Page
+
+Installation instructions are available from the Environments tab, so let's navigate there now.
+
+On this page, you'll see all available environments and you have the ability to create more. We published our library to the Development environment, so let's get the installation instructions for that Environment by clicking the box icon in the Install column on the Development row.
+
+
+
+We're now looking at the installation instructions for the Development environment. All we need to do here is copy the ``
+
+This script provides a communication API to allow your view to communicate with the Launch application.
+
+## Registering With The Extension Bridge Communication API
+
+After Launch's iframe script is loaded, you will need to provide some methods to Launch which it will use for communication. Call `window.extensionBridge.register` and pass it an object as follows:
+
+```javascript
+window.extensionBridge.register({
+ init: function(info) {
+ // Populate view with info.settings which will exist if the user is editing something
+ // that was previously saved.
+ if (info.settings) {
+ document.getElementById('name').value = info.settings.name;
+ }
+ },
+ validate: function() {
+ // Return whether the view is valid.
+ return document.getElementById('name').value.length > 0;
+ },
+ getSettings: function() {
+ // Return user-provided settings.
+ return {
+ name: document.getElementById('name').value
+ };
+ }
+});
+```
+
+The content of each of the methods will need to be modified to accommodate your particular view requirements.
+
+#### `init(info: Object)`
+
+The `init` method will be called by Launch as soon as the view has been loaded into the iframe. It will be passed a single argument which will be an object containing the following properties:
+
+* `info.settings: Object`
+
+ An object containing settings that were previously saved from this view. If `settings` is `null`, it indicates that the user is creating the initial settings rather than loading a saved version. If `settings` is an object, you should use it to populate your view since the user is choosing to edit the previously persisted settings.
+
+* `info.extensionSettings: Object`
+
+ Settings saved from the extension configuration view. This can be useful to access extension settings in views that are not the extension configuration view. If the current view is the extension configuration view, use `info.settings` instead.
+
+* `info.propertySettings: Object`
+
+ An object containing settings for the property. See the [turbine.propertySettings documentation](../turbine-free-variable/#turbinepropertysettings-object) for detail on what is contained in this object.
+
+* `info.tokens: Object`
+
+ An object containing API tokens.
+
+ * `info.tokens.imsAccess: string`
+
+ For accessing Adobe APIs from inside the view you will need to usually use an IMS token. This token will made available only for extensions developed by Adobe. If you are building an Adobe extension, please [email the Launch engineering team](mailto:reactor@adobe.com) and provide the name of the extension so we can whitelist it.
+
+* `info.company: Object`
+
+ An object containing information about the user's company.
+
+ * `info.company.orgId: string`
+
+ The Marketing Cloud organization ID (a 24-character alphanumeric string).
+
+* `info.schema: Object`
+
+ An object in [JSON Schema](http://json-schema.org/) format. This object will come from the [extension manifest](../extension-manifest) and may be helpful in validating your form.
+
+Your view should use this information to render and manage its form. It is likely you will only need to deal with `info.settings`, but the other information is provided in case it is necessary.
+
+#### `validate() => boolean`
+
+The `validate` method will be called after the user hits the "Save" button in Launch. It should return a boolean indicating whether the user's input is valid. It's up to you as the extension developer to determine what constitutes valid input since your library module will be acting upon that input.
+
+If the user's input is invalid, please show some indication of this within your view so users will know what needs to be corrected.
+
+#### `getSettings() => Object`
+
+The `getSettings` method will be called after the user hits the "Save" button in Launch and the view has been validated. The function should return an object containing settings based on user input. This settings object will later be emitted in the Launch runtime library. The content of this object is under your discretion. The object must be serializable and deserializable to and from JSON. Values such as functions or [RegExp](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp) instances don't meet these criteria and are therefore not allowed.
+
+## Leveraging Shared Views
+
+The `window.extensionBridge` object has several methods that allow you to take advantage of existing views available in Launch so you don't have to reproduce them within your view. The available methods are as follows:
+
+#### `window.extensionBridge.openCodeEditor([options: Object]) => Promise`
+
+```javascript
+window.extensionBridge.openCodeEditor().then(function(code) {
+ console.log(code);
+});
+```
+
+Calling this method will show a modal allowing a user to edit a snippet of code. When the user has finished editing the code, the promise will be resolved with the updated code. If the user closes the code editor without electing to save changes, the promise will never be resolved. The `options` object should be structured as follows:
+
+* `options.code: string`
+
+ Code that should be shown in the editor. This is typically provided when the user is editing existing code. If this is not provided, the code editor will be empty when opened.
+
+* `options.language: string`
+
+ The language of the code that will be edited. Valid options are `javascript`, `html`, `css`, `json`, and `plaintext`. If this is not provided, `javascript` will be assumed.
+
+#### `window.extensionBridge.openRegexTester([options: Object]) => Promise`
+
+```javascript
+window.extensionBridge.openRegexTester().then(function(pattern) {
+ console.log(pattern);
+});
+```
+
+Calling this method will show a modal allowing a user to test and modify a regular expression pattern. When the user has finished editing the regular expression, the promise will be resolved with the updated regular expression pattern. If the user closes the regex tester without electing to save changes, the promise will never be resolved. The `options` object should be structured as follows:
+
+* `options.pattern: string`
+
+ The regular expression pattern that should be used as the initial value of the pattern field inside the tester. This is typically provided when the user is editing an existing regular expression. If this is not provided, the pattern field will initially be empty.
+
+* `options.flags: string`
+
+ The regular expression flags that should be used by the tester. As an example, `gi` would indicate the global match flag and the ignore case flag. These flags are not modifiable by the user within the tester, but are used to demonstrate the specific flags the extension will use when executing the regular expression. If this is not provided, no flags will be used within the tester. See [MDN's RegExp documentation](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp) for more information about regular expression flags.
+
+ A common scenario is an extension that allows users to toggle case sensitivity for a regular expression. In order to support this, the extension would typically provide a checkbox within its extension view that, when checked, enables case insensitivity (represented by the `i` flag). The settings object saved by the view would need to represent whether the checkbox was checked so that the library module executing the regular expression can know whether to use the `i` flag. Also, when the extension view wishes to open the regular expression tester, it would need to pass the `i` flag if the case insensitivity checkbox is checked. This allows the user to properly test the regular expression with case insensitivity enabled.
+
+#### `window.extensionBridge.openDataElementSelector([options: Object]) => Promise`
+
+```javascript
+window.extensionBridge.openDataElementSelector().then(function(dataElement) {
+ console.log(dataElement);
+});
+```
+
+Calling this method will show a modal allowing a user to select a data element. When the user has finished selecting a data element, the promise will be resolved with the name of the selected data element (by default the name will be wrapped in percent signs). If the user closes the element selector without electing to save changes, the promise will never be resolved. The `options` object should be structured as follows:
+
+* `options.tokenize: boolean`
+
+ Whether the name of the selected data element should be wrapped in percent signs before resolving the promise. See [Supporting Data Elements](#supporting-data-elements) for why this is useful. This option defaults to `true`.
+
+## Supporting data elements
+
+It's probable that your views have form fields where users would like to leverage data elements. For example, if your view has a textfield where the user should enter a product name, it may not make sense for the user to type a hard-coded value into the field. Instead, they may want the value of the field to be dynamic (determined at runtime) and can accomplish this by using a data element.
+
+As an example, assume we are building an extension that sends a beacon to track a conversion. Let's also assume that one of the pieces of data our beacon sends is a product name. Our extension view that allows the Launch user to configure the beacon would likely have a text field for product name. It typically wouldn't make much sense for the Launch user to type in a static product name like "Calzone Oven XL" because the product name is likely dependent upon the page from which the beacon will be sent. This is a great case for a data element.
+
+If a user wanted to use the data element named `productname` for the product name value, they may type the name of the data element with percent signs on both sides (`%productname%`). We refer to the percentage-sign-wrapped data element name as a "data element token" and Launch users are often familiar with this construct. Your extension, in turn, would save the data element token inside the `settings` object it exports. Your settings object may then look like this:
+
+```javascript
+{
+ productName: '%productname%'
+}
+```
+
+At runtime, before passing the settings object to your library module, Launch will deeply scan the settings object and replace any data element tokens with their respective values. If, at runtime, the value of the `productname` data element were `Ceiling Medallion Pro 2000`, the settings object that would be passed into your library module would be as follows:
+
+```javascript
+{
+ productName: 'Ceiling Medallion Pro 2000'
+}
+```
+
+To indicate where it may be helpful for users to use data elements and to make it easy for users to enter a data element, we highly recommend adding an icon button next to such fields as shown here:
+
+
+
+When the button next to the text field is clicked by a user, call `window.extensionBridge.openDataElementSelector` as [outlined above](#windowextensionbridgeopendataelementselectorcallback-function-options-object). This will display a list of the user's data elements that the user can choose from rather than forcing them to remember the name and type percent signs. Once the user has selected a data element, you will receive the name of the selected data element wrapped in percent signs (unless you've set the `tokenize` option to `false`). We encourage you to then populate the text field with the result.
+
+### Data element token replacement methodology
+
+As described previously, if a persisted settings object consisted of the following:
+
+```javascript
+{
+ productName: '%productname%'
+}
+```
+
+And, at runtime, the value of the `productname` data element were `Ceiling Medallion Pro 2000`, then the settings object that is passed into your library module would be as follows:
+
+```javascript
+{
+ productName: 'Ceiling Medallion Pro 2000'
+}
+```
+
+Whenever a value inside a settings object is encountered that consists of a percent sign, then a string, then a percent sign, _and nothing more_, it is replaced by the data element value _without changing the data element value's type_.
+
+For example, if the value of `productname` at runtime were instead the number `538` (not a string), the settings object passed to your library module would be as follows:
+
+```javascript
+{
+ productName: 538
+}
+```
+
+Notice that the resulting `538` is a number here and not a string. Similarly, if the data element value at runtime were a function (a rare but possible use case), the resulting settings object would be as follows:
+
+```javascript
+{
+ productName: function() { … }
+}
+```
+
+On the other hand, let's assume the persisted settings object were as follows:
+
+```javascript
+{
+ productName: '%productname% - %modelnumber%'
+}
+```
+
+In this case, because the value of `productName` is more than a single data element token, the result will always be a string. Each data element token will be replaced by its respective value after being cast to a string. If, at runtime, the value of `productname` were `Ceiling Medallion Pro` (a string) and `modelnumber` were `2000` (a number), the resulting settings object passed into your library module would be:
+
+```javascript
+{
+ productName: 'Ceiling Medallion Pro - 2000'
+}
+```
diff --git a/favicon.ico b/favicon.ico
new file mode 100644
index 0000000..869b909
Binary files /dev/null and b/favicon.ico differ
diff --git a/files/launch-gpg-prod.zip b/files/launch-gpg-prod.zip
new file mode 100644
index 0000000..32a2c66
Binary files /dev/null and b/files/launch-gpg-prod.zip differ
diff --git a/files/launch-integration@adobe.com_pub.gpg b/files/launch-integration@adobe.com_pub.gpg
new file mode 100644
index 0000000..fd4cf55
--- /dev/null
+++ b/files/launch-integration@adobe.com_pub.gpg
@@ -0,0 +1,51 @@
+-----BEGIN PGP PUBLIC KEY BLOCK-----
+
+mQINBFn7giYBEACYL++QkGrGZ0+aXMsKZS/j3+fGQsG9ZrfnfC7LiDUmPSmL3flp
+OFv3yjmMdihljirPsERJPccUJism4GpDcJgmvqmnaHMzNy+1V+8IF1Ce6TpSglsj
+9IsHFAsczQGaG2ITHBQcz/d81EHlPv/E28Q8lEPg8EQK0kIT8hvGpclcbnMJ/fkb
+vHBxRtBRbgthufHvoM2KWr399kV/0FjOBDywnGDt2AmrHRTtmM+6dlhr/MSMclYf
+y2lVo2TS6gxdIZb/cnPoVmS52+lYqNgNlBKMsAV3KhTAOMZzXdUp0s620Vgi9xa1
+VdiWbKVrBUHpOclYIlajzTRt594gidk8rhApDX/lwP7pE7ZhkATxhIcr9sjjISh+
+s2gtR3cuWyKrmU7NuvzUYw4hZvqygufk0MQFo8HEWbuOSaCzPoMnVKKfMTaR1/SE
+H/SzcGlBHNHkZjg/7fzBNeRwACu3++9WIUIVuQxUL/NcKLruJPPk7r0mHkLOprhq
+PHEpqtppckmbY5lZ2BZBjlBwyAF38rCbLmPKy63hhWcw3+jKZYx2cpQrkog31XEG
+Y/2EtJ2zkfoAyA2Rg+a61oQtjXbQf7BjFegcew/9w4nxbvfDFmobVzhOpQm2BTJf
+9TAXhH9da7cFGDYNC72dBKc76vlVZnyzknVk+wWFqLTKC6HIKlanlJHXVQARAQAB
+tD1BZG9iZSBMYXVuY2ggRGF0YSBFbmNyeXB0aW9uIC0gSW50ZWdyYXRpb24gPGxh
+dW5jaEBhZG9iZS5jb20+iQI5BBMBCAAjBQJZ+4ImAhsDBwsJCAcDAgEGFQgCCQoL
+BBYCAwECHgECF4AACgkQIYUkQMhCBASnAg//bbs4N4RWiWplcouaSW471VyDcQFn
+XM8qC4qzvb0/xZq3BRGI7WlJghyHxXzQPneRyJZhNvZsfpgrT+++K4Gcfv6wmOfH
+eq5sl5O8MxoHipWOX/6yTN3IP+Xob5BpXk3TkD3E76vObn2e4cXZKiMu3SMWocWr
+o1uozGEFGe0WiPirCfDAqF507y+aUuEGhTJvsTDSYWH+QCN03muiCIkDnEiaIoAF
+2JuiMfiViFy+LMttBJF18WA+SF4JSkMhVRLwvdcWk7CoGV28x3pXBvWuDBAimfcF
+fkzF63MWPYAJZzEfEufdkgF1YyKWllTWpGMgqO4C6sQ7KLNwUMft6b7AO98Ybq8s
+IRXJg176/dQVf2TeFjFCCt/05sHD1fiRWj8KK0miW7yhEZ1VwfL6g7ZxDg7jcdBF
+PDySrkWgCOqtaCnoQiqwz278FJ7arMiCN8cOaTGqKJ8NNQU2iFi2rrNDS/AUOCtI
+qK3jDgAMhUL0JBV/s8NhTHu6hUhvFPKU8PMBL90tCs89y72CbuLt+qYPFDGWKm0a
+hWLXkNaszbLL2S65EX9T4CGK//K2kDlneOwId8pkwMqkibElvO/E1x4VLJ6xsMX2
+XkEr8VOualkgFYLzWUR2TMLnJHYfs85jXKrpX2GI8WczU+bDnLJSzVb7V4eDDpwO
+Bo3kIKFachhoo8q5Ag0EWfuCJgEQAMLcwtZJf97UQsTwU16KfEF6JqbQZCBTMumB
+QVVvn8ve1IFnwO2fHaGEA0fV3Qhatp3i0HKMW1wsvAIRnuTr5dLkqA1hEWilFzIH
+vgeqNJ7vSnBAQi4xjG6mP/RbfP95bWQ2Gr41xPMsIM9Pp0K8IhbntzLt0O8iSJsJ
+vNFtnx70b9sYfbMMLXscNlxGCeb9zT1sZTTq7wrQH7tzyyu6POML+wE1YfIXVVTq
+6gyNco5HO+CGw4ygujun8e4AdalDnlmym6xNw/zxCLTnm5w9uFR+y6Pdvz3jrQzE
+JhMzWw9T9o6Q8Lat0rjp7mpzcndX+khlRkMpR51VgA5VPBNojzw/ZkKhf06H1FLx
+ib6UoixRyn2nMD88Vh5Z6kUpHCFtwz1w1hcj5iGHtzfq3c0t185Wx4nNIl5J2vIH
+p1murwKZ0WO3V2/Az/BFZgLG9q40QXnJr6n4WtBCmFFMjbRfJqtui0kXSra6Taip
+f/NzQnxkFL2dDFkbnFFJPkOhg9ThnBV4DsT3gjiZCyosqtyRRBW9i8SLk0h2Xpq0
+uxIMrxFK7cGyifF/YkEDZYR8x/vo6gk51dSceScyGeaN2DKqsFZzNJJho7KOUNfP
+iUo6MTaqvZOWMByAzOkt4ycCr3KuZJY9SNv12wBVgpTiljnQZv5kKWl3/W6gVUt0
+tAW42D9LABEBAAGJAh8EGAEIAAkFAln7giYCGwwACgkQIYUkQMhCBAT2vxAAhVoi
+UuXTL0dYC8/KKrL9BEMLaS+r2P1k7AHwHDXW5o94LYjgu9ZZFz+JrpF+57AO4hj8
+YE5LhTJXbu5CPENEqcrx5pZEMbiX3tx87e9Gl6qzDav6Bl8GYrS1sto0SmkQ6/3M
+MZczrAHmBPMMX8qofHT8EX8B+p2GMLsGL9oIe92UQddyjYoyPwx+9gpUM2l72VN3
+oTM0F0KYt+QGDNYliZDesP6afVlkSgYnDy4lJUmt9gSXYTpRlj+qYXVMLglkOrJX
+vAdueh1huiF20TwWofxdTiLLX1PwzV1vCJIPY83/Kw1+/lYEOtQ+t7ecauo0Q8P5
+letUNO4xFiiqV09EuTIQFkB+AeWrJD9dmrv6lybFMHFKCjEknjf7CN1+wFeNHUBF
+c+5v93kqz3eknaFf3FxTQp8lactQdX9fountACt08OA2ghYSgdJaXRsVQ0F7qAK6
+NnB7iMPd8oEZh3NkmQhe5ugqyPFsChxJILokA2PjRgbyiWK/hkIyGmcCc8XFuX2P
+bfWjj4Jtmo+msc5MFReBEOvSKl67MU/eLNBZgNktZ+yJNjFY9lFSofyw+PGUdcIa
+piU2GFqFyInEPJciHLzk89oILfnPVj1Ed3HeCBy7kLDL8H2k6uFfvnz+afecetBa
+13C6ei4XXRLZkNYEAIbYGeMwVmmsDsVDjHhi9W0=
+=FOUp
+-----END PGP PUBLIC KEY BLOCK-----
diff --git a/files/launch-integration@adobe.com_pub.gpg.sum b/files/launch-integration@adobe.com_pub.gpg.sum
new file mode 100644
index 0000000..ce61bbe
--- /dev/null
+++ b/files/launch-integration@adobe.com_pub.gpg.sum
@@ -0,0 +1 @@
+e1925068dcc45bbf6760b5c8425b25dfe649a3c391186061a4b27682c4cb231e5518b76ab2733dd9b5b9d87e16941ce525358368db84f0c8bceb82672b6abede
diff --git a/files/launch-test@adobe.com_pub.gpg b/files/launch-test@adobe.com_pub.gpg
new file mode 100644
index 0000000..1491316
--- /dev/null
+++ b/files/launch-test@adobe.com_pub.gpg
@@ -0,0 +1,51 @@
+-----BEGIN PGP PUBLIC KEY BLOCK-----
+
+mQINBFn7g4cBEADK1XUoJtsncaSy9s/iarSr/n523EXb0E8vY2Hqpp8wTySPFTzB
+nWpgNrjtCfrXkZMJhaz5ptoQo3puTqxX65FURbWiv6JVNo1TfMDGoyaqrYU9zB8V
+k4AFnvalu6dgjn9pRFtC5gtucxbRvnHtAcBqZf4dSEW+o76iRLAUdmahNPEZ6FsO
+yhB8DF+WqZWsUOdrHi+LL2PmqmSMS1R8JQM6YBHVqdTVbZ8mIJhOXgrJUmyxsesT
+bpRzhSEzdYKFrAt0IXPbB77c2hoNVBUUiCD+65jx/V+3Sfb/7C+JWbUc4z0Jv/Ck
+sg3kdZM5SvOxpzM7P/puQGzirvMpqxkCQHmmn42MU8N3RgsUH/Ktnj4C3c+2b7yK
+ide2zBIE21dYVKipLtK/aSxyqqmwuwMNtJHRl/mbPKrwype+dXnMZ3txefskULzi
+xhy3ck5YS2n3uVX/H/Zja+OU8kbVIVUvwiolWsltwk5gwkptz96+EKJ/Sj8r5R/I
+yi45BhlLIg8wRfU3ZfEZ2CTYticPq79NKJaofC2MUGeaV6ag+BITmmgngjM/izcq
+jEM0CrpoyOi2n0rTofdssk5Y5wt6qQQTnXN029pR4jqyZHi7dsuIIIcsxy7sfB79
+KEiKS2wlWgQMlB+6PbWOvS7JulSzSTMfPMwHGImBOLAmqYVPlrTZC/+XCwARAQAB
+tDZBZG9iZSBMYXVuY2ggRGF0YSBFbmNyeXB0aW9uIC0gVGVzdCA8bGF1bmNoQGFk
+b2JlLmNvbT6JAjkEEwEIACMFAln7g4cCGwMHCwkIBwMCAQYVCAIJCgsEFgIDAQIe
+AQIXgAAKCRBKjMIZNiCUVhMzEACVTnSiiOoSnWzoaGwpOYAkmb88zl90wOZBa1/1
+U60at6USZlgk3tExl5J3RLvoBeCqFQ9kBwMTujRfMh7U4GrCwnjPZ4Ou9j/ruRex
+PhsOsYs7EnswzZdd9Wga1jYBsktF8+iKfm4XYjbyforiYwZ+CofD4vhlZk2VxyUD
+tvAbfaHkOq0CHPDgX+tLcBvXAMKU9BEOsVnMfMylPbG53eGcKEfPisfaMRaLVHsP
+Mz36xUXHLKIsuHdLPYAFQR/F7nXAwo6eqQyqPGrc0abHt72tbZIzhgQUyv7hKQMg
+mlpUJ8K8UKtiiy5UXPJgm6N2h7thhkdsKGEJt9IzMZj7QYReJNCPP16BqkFCeB8h
+EybGLxZOF7mNM2nFE8nRr3sZPAqCez9EB14qu4UztNPelEkAr9WjsN3SK0JQdKz3
+2K7yqSjro27hphSoMAToLbSHBmEqvJTHHbu6P9URcN8c259WPpd89ljXkKOIDNCw
+uYJGScGB3LM1lvoNGAghyLB9Lir4OcRYABEWsMeMcEtg8uaI7851KqN/K+PrrTSt
+K+EJxZYGLB1AB7V0afM65zQH19vbm8kiZ5s4GekZ9MduBPmTycuIlL+VTcl6WiZ0
+mm3g6Eh2223ek16ODEU6t33rezAqhdBpfCeIEVr8tdTEsE1N6I5o1HjM5aa7oH7u
+XbpvMrkCDQRZ+4OHARAAzpQzRcSZci2VsLFCeXtX4sWy7Hiaa80hEt0yulah1dif
+VSEqSq9E0jyYk+xJzVch/OGZOYQdKt4ksOZ+tcb9vKaq/kbE4hhs7omHf3Il11Bq
+hPn5H78M0RrH1KtOxQw3YoC2s5GdtLehxsVNlhiKANuLkVrefa3eZDpPPANVCG8B
+bmHfQFgf/CbqujR72aveu8QGbiCLzqbABGYIqHygGTuWFRDaEY3BAkGXMXtyPf7F
+n+oABGrx7BG43MEGBKgfw6CmoULLuFaFlyDe9RwfH7Mhv1ILny5+vWo7O72QVwYJ
+woEUcYM2PPvM14245JPUEKCKbR0Myb91uqj4g5N1/DfjDXyXX6Vc8h2u/PdM+R72
+1DdGZUufFW0ekMvTYB5qDTmk/zzf8bOQV5Ii3cqPd9G39UQuUTo+Pur+soJqgyH5
+ZwHrkiltJYMe/AsXdwk7tSCcfHCUUVYLWRQg97AEaLDRyram4sNrfJrLgKDMQ5BO
+KkNISYN4kNDj1zZsi3dKmpmYc4V0Y65cNWXNR4D2MPZkBh52/cGojjnTi2uZ9rJA
+qHtr3xFoLbnH37VKWk2/izbcaqhWzROLjRfu/FTB9vYzlyS7dK781GCH14xDRRML
+3AlbWkUKKsBAwm1lPVGEZCgNAQutPkeRr6I6CBLc5Y6OC7gq3jK7F6AC/pVKdhMA
+EQEAAYkCHwQYAQgACQUCWfuDhwIbDAAKCRBKjMIZNiCUVvAjEAC93MSMWZSppPF+
+u33NI4BqjQ7igU5/CIyVoUKufIM3qGKmiFxeE3MS+53Ok87s8yx8JLFmD16iH7Ck
+aUuAMzGUqHcUCgXMZ4sh1QmsfpjhC+GoKckjCms0suURMWdjmZyVlxkeGO7MPpWJ
+xiBKXr0MJNrpixgUlFNOIagkULrmOKINAF/B5kcB9UvV7Rl7AZf8WRbBrYo7fEKa
+BdzQW2Hw3LvVmclnhQPIZvZ/eilSXgEvOkfu//Qh0gn2c1Iz2aFk4Pd1aO6Y5W/M
+LZd6f16mRAyNdqRuWHIPBy6vWn0Zb3ilQAVf5oXBq3JTam1o+/+Pggl23ZY2M+fV
+aJ9G88rOz6TCQLVclHzdlYwqCUCcEEPujE37HD4LW6MpkazcL1qzJgwfR6S57VL7
+fEkpraen4CRmbc/4vOOC/nAG2+biWhLCtA1eJuQveDNV+u3sDL3f46iuy4SeD6IU
+iJzgVRMk5Tnza7pcsMvpODFDg1YS2h8DdMguoVEH6gYPWJA56fB121ke80PSkoGO
+uOpga56EymIQtbW0/yiFD2ZifLlyxYmz7lKft68Y2hrUIBtp0jKKT50xYw3JjdOv
+GSXYN8zMM+GDBLuuvX69WMszibjUHcvvT3r9KzMUtCW5q3HIWATP25te0jdkF0Yx
+sOqAcKfRWPFrx/MxnOeDqCEn1jXDzw==
+=hGyo
+-----END PGP PUBLIC KEY BLOCK-----
diff --git a/files/launch-test@adobe.com_pub.gpg.sum b/files/launch-test@adobe.com_pub.gpg.sum
new file mode 100644
index 0000000..2524917
--- /dev/null
+++ b/files/launch-test@adobe.com_pub.gpg.sum
@@ -0,0 +1 @@
+a7a5cf6e5f1c09ea92faa5ae31b56ab2258cf92f602c3fae0d31cfa74e658a081e8aa2e2d5e31057f0108d804330817c3cd7219c22666e5ca69dfe29816223bd
diff --git a/files/launch@adobe.com_pub.gpg b/files/launch@adobe.com_pub.gpg
new file mode 100644
index 0000000..8bb3529
--- /dev/null
+++ b/files/launch@adobe.com_pub.gpg
@@ -0,0 +1,51 @@
+-----BEGIN PGP PUBLIC KEY BLOCK-----
+
+mQINBFn7gfcBEADAEMApmPiTQRzqNysxjyhXBenyyCGbfgNgJBzA37fJbboQVPMl
+h+7bzLyEUTEzNPfmB0A+2vRfIbS5/zQB1MjBBNOXDSrXP/WxIi1rJ+cOdBu0IjuY
+eHG71tz/I5HcCtpvzPavxK4o0THTOuQtsRYbOB/l0+QraqCVXgfRx6rR8rWpKX17
+vWcl+ISFDy94GTCzYo3QnFGEoI6cDB5PGTV2tJUAKdzIYTPiN4D03w8U/qBlfxOO
+KmTbJ2WHx3mSVwatw8xuxiJd+46JgDiLAlT90AcDtP0dIhMnT6HLDXrSepMeOs4c
+NCCEA293uOzfDeVYK2PoAby2j7th/wFD4hgpe4hK1U+csZmwhBuPOZx+RbxwJwpn
+d7dgl8tcI0ecyOux3mh6qoq1PSjEFVCP9tDtTGwIBpNH7uyfXNO944b7emC/6EJe
+pNLRBvhFuIqUH7JZ0PHIT5a+dmDQtIvUWjosOxqQoi4dqVJJ1tcjRzbjXk+JZC6f
+LwURrdopDbUgfjfnduSI4kEx1MvMiPhThU9fGHKexFV0+xYU1EOP7TfES4kelS2x
+BZySiZC/Z5Eqtm3/Vg7+BroyBswaog+txetXY7KV2xXm7vHcr9ui+elxSgQwuJeN
+hctB7k7bTFNQDTdjCGYIdj7vYrHYJsVeHpSoNLec+oXpr9Vbj4pDVnRSYwARAQAB
+tC9BZG9iZSBMYXVuY2ggRGF0YSBFbmNyeXB0aW9uIDxsYXVuY2hAYWRvYmUuY29t
+PokCOQQTAQgAIwUCWfuB9wIbAwcLCQgHAwIBBhUIAgkKCwQWAgMBAh4BAheAAAoJ
+EI11dhb7OnhKCoAQALiOfswf/vZXsEWaUukwC9NYsUeTcR9iY12MjMlxKTqXflei
+zgUPhzadRqzJAPo6aWeHCX3MTO1XM9tq+wYOp6Dao/uPy6knlkbSySSeyeYOBY/R
+8A385z0wiupByotjP4UgxmBldCEGhd3wUgOfw2IsY1A75ZD5Hh47c/Y7xyAPlT7w
+fqcSwxms5P0djrjctYNOPcKPW9gicTrfRx61crF9GvlZEvInOAnQOiBh1uCtvpWI
+AdxP6JE62Anb2H+PE/+f/yc1KMXdFyVW6ltKu3eMXJmn2q0DLvj3a62BRLvo5+zT
+imeZuIHmaoE82Vds+0wghBEjTcHon3W94jVcKrLJAf53BfpdqnYqZ6pR1vXGYj4d
+LiPve8mcmikPoHdlQ8h7vLkO1dTIDHRNGD7E2S0vSnZ/xZ8lowjNHxAlJuSIe7bP
+u7EFjEjf5fnZusAgXaiHLv7IdW7j1NXlrqx9NL/ZfZ9LO+kbWvMEfDUAB7yn694F
+dZS4TuVgGjiwd4kf/WL5fEprlfbaM0mcaZMKM8eE0QUzj3U0Dswf+vr7XKwDrERi
+dvivo0iBhzBeoK1KfVwcXqJ+IhihuIwW9I2fYVYxh3x8Qgv0HPoOGZi6KH3x3Zd5
+nLNy2AE9ZPatftqTCpARsb5GwhJna6kkOzZSF0+L+fLqr7gln4k+wnvRYoFJuQIN
+BFn7gfcBEADxuQe0snRFoNuiTK639U7NMPtq6Qgyi7egEDVXoHlfFWcEEKEwFh/R
+w11+sPRe5Ar00PYE9Se+jsCpuHHRWkvXSLArnkQnlpeADQTzHEWpLwcHIEAblxaq
+/KiZeDC5VvOZYRVeH6lFu6c+cY+RAfteSQgabzYTbmHzAM8WzqNA9LN6VhJmxbKy
+JvTsOBoeoe57s4vqjeniE2KPpMjbZt2BZJIzj8ehAE263pUpN/B2TDNy7TEb/08O
+oWJOokFXdjcnD6vfECWP08bclg1zRd0L9NE6Sw1d9iSUZIswO00mQqyHEDQBa93U
+qKp8yVQnCCFRBg+F3JUevOlxj8KZsJLwvm5UQ1V1ZKKAxIgAdN3Qt266/LRx0gtP
+hYtR59flHGMPL765I/nYR4bF6q1ozp3Zf6SOUS9c0rtbkUX8+rK13wHn0TmK/lC8
+JVeLv4CyuUd55jfZcPQkLxoAZwXcazRSbyShls56QScl8Z9daZeNFD+QU89J61U7
+7fQaDY2wLfbj3cRESQ0UwRGGjIR5Fa5Ry+X4MDqx40tgBzWWeCecgYBhj/DnUj+t
+IYU+P9vI5/nuTLQ378XsRUeFmSrwSk/xy7QFu8WB7OaK6ztN3tKp88voizt4ySvC
+62MNdt2+3reicCncDQQIvdrUfoMjWqu7MB8SbvXNEh05u/jATBvUoQARAQABiQIf
+BBgBCAAJBQJZ+4H3AhsMAAoJEI11dhb7OnhKgbMP/RxzuR7MJXURNHNY0RVAdx8w
+RoktWQWVVOjOPEnE/Lq64rvLZjAcAj5f2KpzuiGqUiz9hvTf0Hlt3ki9mEWaCo1i
+Ey/gRUlWThj5oYCMK/C/YKCLGP+3VMMRiyvGqHKxnCmsjxKxBQbR5otXsQd7sYlB
+LA1VtCXoXvQDuwZt9EptzryhH1gpeBEj9nxs+9KDp3vP+dViC82MBcZXS975yeMc
+TcAp6uMWsRS6isGBgDCKTKxmB9Rlx57mWbMrHWH2nYxYBFLnw5iyQNylkOunzS4K
+Py4+UwVT5mhbNv/ZZOvRXw3VKcfUc5o1OSKYK/DP1shZaSHPZ2vlpU6+PZv36UV/
+ovldYpZlgUtKEmtbMYQt6Sjk5CwS0Gb9PWBAqz4yqc31MhISscNSsugMBGxpbvAL
+OwfUBOFN/mHXm5sWqkOO/klofTqhqw078eUhL7GeyGD300Dc6Ro4i0Y0NHfcT40R
+UR19PN9qbQwYo5LjZye2FdSsqy213z32ZIrGlX3eCLyZgdTjtUm4F0lAT5aC2jxh
+tCfwMpYLdlVcveDsGrPrg7TdWmKAfEZsBpOtUfx3AmxQCGxdK5bkFxA9NNpBhgJr
+b4h1GoPhrMGh7vcdHFr5cZ2d8n+pjwe+QNSkBwhpwQIpGMfSE9FiYxDaAC8VKf1l
+MrHgiXmzJaGV+u+5+AzY
+=293Q
+-----END PGP PUBLIC KEY BLOCK-----
diff --git a/files/launch@adobe.com_pub.gpg.sum b/files/launch@adobe.com_pub.gpg.sum
new file mode 100644
index 0000000..0ec9588
--- /dev/null
+++ b/files/launch@adobe.com_pub.gpg.sum
@@ -0,0 +1 @@
+c68539d1939dc6a1937b360059f5c455a6c16a357a9ddaaedfab21b36c4e9b7bc95f07192deba1daa5c0d73ebd9a666968b0848dfcd63099a122b65d3db5b592
diff --git a/images/access-token/IO-1.jpg b/images/access-token/IO-1.jpg
new file mode 100644
index 0000000..3123c1b
Binary files /dev/null and b/images/access-token/IO-1.jpg differ
diff --git a/images/access-token/IO-2.jpg b/images/access-token/IO-2.jpg
new file mode 100644
index 0000000..720f276
Binary files /dev/null and b/images/access-token/IO-2.jpg differ
diff --git a/images/access-token/IO-3.jpg b/images/access-token/IO-3.jpg
new file mode 100644
index 0000000..425492f
Binary files /dev/null and b/images/access-token/IO-3.jpg differ
diff --git a/images/access-token/IO-4.jpg b/images/access-token/IO-4.jpg
new file mode 100644
index 0000000..30b5f69
Binary files /dev/null and b/images/access-token/IO-4.jpg differ
diff --git a/images/access-token/IO-5.jpg b/images/access-token/IO-5.jpg
new file mode 100644
index 0000000..6e8f662
Binary files /dev/null and b/images/access-token/IO-5.jpg differ
diff --git a/images/access-token/IO-6.jpg b/images/access-token/IO-6.jpg
new file mode 100644
index 0000000..445d98f
Binary files /dev/null and b/images/access-token/IO-6.jpg differ
diff --git a/images/access-token/IO-7.jpg b/images/access-token/IO-7.jpg
new file mode 100644
index 0000000..6abd878
Binary files /dev/null and b/images/access-token/IO-7.jpg differ
diff --git a/images/access-token/IO-8.jpg b/images/access-token/IO-8.jpg
new file mode 100644
index 0000000..f46ecc0
Binary files /dev/null and b/images/access-token/IO-8.jpg differ
diff --git a/images/data-element-field.png b/images/data-element-field.png
new file mode 100644
index 0000000..de98488
Binary files /dev/null and b/images/data-element-field.png differ
diff --git a/images/extension-flow.png b/images/extension-flow.png
new file mode 100644
index 0000000..20fbe81
Binary files /dev/null and b/images/extension-flow.png differ
diff --git a/images/getting-started/action-configuration.jpg b/images/getting-started/action-configuration.jpg
new file mode 100644
index 0000000..9bb876b
Binary files /dev/null and b/images/getting-started/action-configuration.jpg differ
diff --git a/images/getting-started/adapter-success.jpg b/images/getting-started/adapter-success.jpg
new file mode 100644
index 0000000..45c7617
Binary files /dev/null and b/images/getting-started/adapter-success.jpg differ
diff --git a/images/getting-started/adapters-link.jpg b/images/getting-started/adapters-link.jpg
new file mode 100644
index 0000000..1c05da4
Binary files /dev/null and b/images/getting-started/adapters-link.jpg differ
diff --git a/images/getting-started/add-new-library.jpg b/images/getting-started/add-new-library.jpg
new file mode 100644
index 0000000..f3c6c51
Binary files /dev/null and b/images/getting-started/add-new-library.jpg differ
diff --git a/images/getting-started/admin-console-add-admin.jpg b/images/getting-started/admin-console-add-admin.jpg
new file mode 100644
index 0000000..f3dd82f
Binary files /dev/null and b/images/getting-started/admin-console-add-admin.jpg differ
diff --git a/images/getting-started/admin-console-add-admin2.jpg b/images/getting-started/admin-console-add-admin2.jpg
new file mode 100644
index 0000000..3db6f87
Binary files /dev/null and b/images/getting-started/admin-console-add-admin2.jpg differ
diff --git a/images/getting-started/admin-console-add-all-rights.jpg b/images/getting-started/admin-console-add-all-rights.jpg
new file mode 100644
index 0000000..f5c6687
Binary files /dev/null and b/images/getting-started/admin-console-add-all-rights.jpg differ
diff --git a/images/getting-started/admin-console-add-launch-user.jpg b/images/getting-started/admin-console-add-launch-user.jpg
new file mode 100644
index 0000000..e1b6e36
Binary files /dev/null and b/images/getting-started/admin-console-add-launch-user.jpg differ
diff --git a/images/getting-started/admin-console-add-user-profile.jpg b/images/getting-started/admin-console-add-user-profile.jpg
new file mode 100644
index 0000000..7428366
Binary files /dev/null and b/images/getting-started/admin-console-add-user-profile.jpg differ
diff --git a/images/getting-started/admin-console-add-user.jpg b/images/getting-started/admin-console-add-user.jpg
new file mode 100644
index 0000000..1de2a4f
Binary files /dev/null and b/images/getting-started/admin-console-add-user.jpg differ
diff --git a/images/getting-started/admin-console-assign-rights.jpg b/images/getting-started/admin-console-assign-rights.jpg
new file mode 100644
index 0000000..854207c
Binary files /dev/null and b/images/getting-started/admin-console-assign-rights.jpg differ
diff --git a/images/getting-started/admin-console-choose-org.jpg b/images/getting-started/admin-console-choose-org.jpg
new file mode 100644
index 0000000..7ed06d7
Binary files /dev/null and b/images/getting-started/admin-console-choose-org.jpg differ
diff --git a/images/getting-started/admin-console-create-a-new-profile.jpg b/images/getting-started/admin-console-create-a-new-profile.jpg
new file mode 100644
index 0000000..6f6021d
Binary files /dev/null and b/images/getting-started/admin-console-create-a-new-profile.jpg differ
diff --git a/images/getting-started/admin-console-launchCard.jpg b/images/getting-started/admin-console-launchCard.jpg
new file mode 100644
index 0000000..ddce886
Binary files /dev/null and b/images/getting-started/admin-console-launchCard.jpg differ
diff --git a/images/getting-started/admin-console-overview.jpg b/images/getting-started/admin-console-overview.jpg
new file mode 100644
index 0000000..0aae605
Binary files /dev/null and b/images/getting-started/admin-console-overview.jpg differ
diff --git a/images/getting-started/admin-console-products-launch.jpg b/images/getting-started/admin-console-products-launch.jpg
new file mode 100644
index 0000000..a8da35f
Binary files /dev/null and b/images/getting-started/admin-console-products-launch.jpg differ
diff --git a/images/getting-started/admin-console-profile-permissions.jpg b/images/getting-started/admin-console-profile-permissions.jpg
new file mode 100644
index 0000000..09764c8
Binary files /dev/null and b/images/getting-started/admin-console-profile-permissions.jpg differ
diff --git a/images/getting-started/admin-console-profiles-add-user.jpg b/images/getting-started/admin-console-profiles-add-user.jpg
new file mode 100644
index 0000000..dca7fc2
Binary files /dev/null and b/images/getting-started/admin-console-profiles-add-user.jpg differ
diff --git a/images/getting-started/admin_console_add_all_company_rights.png b/images/getting-started/admin_console_add_all_company_rights.png
new file mode 100644
index 0000000..818e1c9
Binary files /dev/null and b/images/getting-started/admin_console_add_all_company_rights.png differ
diff --git a/images/getting-started/admin_console_add_all_property_rights.png b/images/getting-started/admin_console_add_all_property_rights.png
new file mode 100644
index 0000000..defc9aa
Binary files /dev/null and b/images/getting-started/admin_console_add_all_property_rights.png differ
diff --git a/images/getting-started/admin_console_rights.png b/images/getting-started/admin_console_rights.png
new file mode 100644
index 0000000..c23bb83
Binary files /dev/null and b/images/getting-started/admin_console_rights.png differ
diff --git a/images/getting-started/build-for-dev.jpg b/images/getting-started/build-for-dev.jpg
new file mode 100644
index 0000000..98d3f65
Binary files /dev/null and b/images/getting-started/build-for-dev.jpg differ
diff --git a/images/getting-started/catalog.jpg b/images/getting-started/catalog.jpg
new file mode 100644
index 0000000..23449ff
Binary files /dev/null and b/images/getting-started/catalog.jpg differ
diff --git a/images/getting-started/create-a-property.jpg b/images/getting-started/create-a-property.jpg
new file mode 100644
index 0000000..1251e5e
Binary files /dev/null and b/images/getting-started/create-a-property.jpg differ
diff --git a/images/getting-started/create-data-element.jpg b/images/getting-started/create-data-element.jpg
new file mode 100644
index 0000000..7c1cd15
Binary files /dev/null and b/images/getting-started/create-data-element.jpg differ
diff --git a/images/getting-started/create-new-adapter-link.jpg b/images/getting-started/create-new-adapter-link.jpg
new file mode 100644
index 0000000..3018667
Binary files /dev/null and b/images/getting-started/create-new-adapter-link.jpg differ
diff --git a/images/getting-started/create-new-environment.jpg b/images/getting-started/create-new-environment.jpg
new file mode 100644
index 0000000..bdf6914
Binary files /dev/null and b/images/getting-started/create-new-environment.jpg differ
diff --git a/images/getting-started/create-new-library.jpg b/images/getting-started/create-new-library.jpg
new file mode 100644
index 0000000..db7f2f6
Binary files /dev/null and b/images/getting-started/create-new-library.jpg differ
diff --git a/images/getting-started/create-new-rule.jpg b/images/getting-started/create-new-rule.jpg
new file mode 100644
index 0000000..fe63f55
Binary files /dev/null and b/images/getting-started/create-new-rule.jpg differ
diff --git a/images/getting-started/custom-tags.jpg b/images/getting-started/custom-tags.jpg
new file mode 100644
index 0000000..7b112ad
Binary files /dev/null and b/images/getting-started/custom-tags.jpg differ
diff --git a/images/getting-started/dev-adapter.jpg b/images/getting-started/dev-adapter.jpg
new file mode 100644
index 0000000..a290efc
Binary files /dev/null and b/images/getting-started/dev-adapter.jpg differ
diff --git a/images/getting-started/embed-codes.jpg b/images/getting-started/embed-codes.jpg
new file mode 100644
index 0000000..bced6af
Binary files /dev/null and b/images/getting-started/embed-codes.jpg differ
diff --git a/images/getting-started/extension-installed.jpg b/images/getting-started/extension-installed.jpg
new file mode 100644
index 0000000..9ba9f1f
Binary files /dev/null and b/images/getting-started/extension-installed.jpg differ
diff --git a/images/getting-started/extensions.jpg b/images/getting-started/extensions.jpg
new file mode 100644
index 0000000..68f7cfe
Binary files /dev/null and b/images/getting-started/extensions.jpg differ
diff --git a/images/getting-started/fb-extension.jpg b/images/getting-started/fb-extension.jpg
new file mode 100644
index 0000000..7ae4902
Binary files /dev/null and b/images/getting-started/fb-extension.jpg differ
diff --git a/images/getting-started/i-o_overview.jpg b/images/getting-started/i-o_overview.jpg
new file mode 100644
index 0000000..fe6a2cf
Binary files /dev/null and b/images/getting-started/i-o_overview.jpg differ
diff --git a/images/getting-started/imsUserID.jpg b/images/getting-started/imsUserID.jpg
new file mode 100644
index 0000000..4cad883
Binary files /dev/null and b/images/getting-started/imsUserID.jpg differ
diff --git a/images/getting-started/install-extension.jpg b/images/getting-started/install-extension.jpg
new file mode 100644
index 0000000..a0e207c
Binary files /dev/null and b/images/getting-started/install-extension.jpg differ
diff --git a/images/getting-started/keys.gif b/images/getting-started/keys.gif
new file mode 100644
index 0000000..6181d5f
Binary files /dev/null and b/images/getting-started/keys.gif differ
diff --git a/images/getting-started/launch-choose-org.jpg b/images/getting-started/launch-choose-org.jpg
new file mode 100644
index 0000000..f62d018
Binary files /dev/null and b/images/getting-started/launch-choose-org.jpg differ
diff --git a/images/getting-started/launch_create_a_dev_property.png b/images/getting-started/launch_create_a_dev_property.png
new file mode 100644
index 0000000..9372a9d
Binary files /dev/null and b/images/getting-started/launch_create_a_dev_property.png differ
diff --git a/images/getting-started/launch_installation_instructions.png b/images/getting-started/launch_installation_instructions.png
new file mode 100644
index 0000000..ecd5ace
Binary files /dev/null and b/images/getting-started/launch_installation_instructions.png differ
diff --git a/images/getting-started/launch_installation_instructions_copy.png b/images/getting-started/launch_installation_instructions_copy.png
new file mode 100644
index 0000000..0d76005
Binary files /dev/null and b/images/getting-started/launch_installation_instructions_copy.png differ
diff --git a/images/getting-started/load-event.jpg b/images/getting-started/load-event.jpg
new file mode 100644
index 0000000..2580be3
Binary files /dev/null and b/images/getting-started/load-event.jpg differ
diff --git a/images/getting-started/new-integration.gif b/images/getting-started/new-integration.gif
new file mode 100644
index 0000000..84ee6fa
Binary files /dev/null and b/images/getting-started/new-integration.gif differ
diff --git a/images/getting-started/properties-screen.jpg b/images/getting-started/properties-screen.jpg
new file mode 100644
index 0000000..24502aa
Binary files /dev/null and b/images/getting-started/properties-screen.jpg differ
diff --git a/images/getting-started/rules-link.jpg b/images/getting-started/rules-link.jpg
new file mode 100644
index 0000000..0adc781
Binary files /dev/null and b/images/getting-started/rules-link.jpg differ
diff --git a/images/getting-started/select-development.jpg b/images/getting-started/select-development.jpg
new file mode 100644
index 0000000..157b849
Binary files /dev/null and b/images/getting-started/select-development.jpg differ
diff --git a/images/getting-started/successful-build.jpg b/images/getting-started/successful-build.jpg
new file mode 100644
index 0000000..7649ef8
Binary files /dev/null and b/images/getting-started/successful-build.jpg differ
diff --git a/images/getting-started/tech-accnt-id.jpg b/images/getting-started/tech-accnt-id.jpg
new file mode 100644
index 0000000..67f94e2
Binary files /dev/null and b/images/getting-started/tech-accnt-id.jpg differ
diff --git a/images/getting-started/userData.imsAccessToken.jpg b/images/getting-started/userData.imsAccessToken.jpg
new file mode 100644
index 0000000..f171924
Binary files /dev/null and b/images/getting-started/userData.imsAccessToken.jpg differ
diff --git a/images/launch.svg b/images/launch.svg
new file mode 100644
index 0000000..989d3fa
--- /dev/null
+++ b/images/launch.svg
@@ -0,0 +1 @@
+launch
\ No newline at end of file
diff --git a/images/rule-processing-flow.png b/images/rule-processing-flow.png
new file mode 100644
index 0000000..85ec4bd
Binary files /dev/null and b/images/rule-processing-flow.png differ
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..6de1dbe
--- /dev/null
+++ b/index.html
@@ -0,0 +1,40 @@
+---
+---
+
+
+
+ {% include head.html %}
+
+
+
+ {% include header.html %}
+
+
+
+ Deploy digital experiences faster
+
+
+ Launch is a platform to develop and deploy tag management extensions into the Adobe ecosystem.
+
+
+
+
+
+
+
+ Learn About Extensions
+
+
+
+
+
+
+
+ Learn About API Integration
+
+
+
+
+ {% include pagebottom.html %}
+
+
diff --git a/js/docs.js b/js/docs.js
new file mode 100644
index 0000000..6694b12
--- /dev/null
+++ b/js/docs.js
@@ -0,0 +1,198 @@
+/* eslint-disable no-unused-vars */
+/* global document, window, Element, URLSearchParams */
+
+'use strict';
+
+
+loadIcons('/css/icons/spectrum-css-icons.svg');
+loadIcons('/css/icons/spectrum-icons.svg');
+
+var curColorstop = window.localStorage.getItem("colorStop") || 'light';
+function changeCSS(colorStop) {
+ curColorstop = colorStop;
+ Array.prototype.forEach.call(document.getElementsByClassName('spectrum'), function(el) {
+ el.classList.remove('spectrum--light');
+ el.classList.remove('spectrum--dark');
+ el.classList.add('spectrum--'+colorStop);
+ });
+
+ window.localStorage.setItem("colorStop", colorStop);
+
+ if (colorStop === 'light') {
+ document.querySelector('link[data-pygments]').setAttribute('href', '/css/pygments.css');
+ }
+ else {
+ document.querySelector('link[data-pygments]').setAttribute('href', '/css/pygments-dark.css');
+ }
+}
+
+function openDialog(dialog, withOverlay) {
+ if (withOverlay !== false) {
+ document.getElementById('spectrum-underlay').classList.add('is-open');
+ }
+
+ dialog.classList.add('is-open');
+}
+
+function closeDialog(dialog) {
+ document.getElementById('spectrum-underlay').classList.remove('is-open');
+ dialog.classList.remove('is-open');
+ setTimeout(function() {
+ dialog.classList.remove('cssdocs-Dialog');
+ }, 10);
+}
+
+// Show and hide code samples
+function toggleMarkupVisibility(event) {
+ event.preventDefault();
+ var exampleMarkup = event.target.closest('.cssdocs-example-markup');
+ var style = window.getComputedStyle(exampleMarkup);
+ var isOpen = exampleMarkup.classList.contains('is-open');
+ event.target.innerHTML = isOpen ? 'Show Markup' : 'Hide Markup';
+ exampleMarkup.classList.toggle('is-open');
+}
+
+document.addEventListener('click', function(event) {
+ if (event.target.classList.contains('js-markup-toggle')) {
+ toggleMarkupVisibility(event);
+ }
+});
+
+window.addEventListener('click', function(event) {
+ var isDisabled = event.target.closest('.spectrum-TreeView-item') !== null &&
+ event.target.closest('.spectrum-TreeView-item').classList.contains('is-disabled');
+ var el;
+ if ((el = event.target.closest('.spectrum-TreeView-item')) !== null && !isDisabled) {
+ el.classList.toggle('is-open');
+ }
+});
+
+var currentTitle = null;
+var titles;
+function setHashFromScroll() {
+ var sdlDocsComponents = document.querySelector('.sdldocs-components');
+ if (!sdlDocsComponents) { return; }
+ var scrollTop = document.querySelector('.sdldocs-components').scrollTop;
+ var minTitleCloseness = Infinity;
+ var closestTitle = null;
+ for (var i = 0; i < titles.length; i++) {
+ var title = titles[i];
+ var titleCloseness = Math.abs(scrollTop - title.offsetTop);
+ if (titleCloseness < minTitleCloseness) {
+ minTitleCloseness = titleCloseness;
+ closestTitle = title;
+ }
+
+ if (closestTitle !== null && titleCloseness > minTitleCloseness) {
+ // We're not finding closer titles now
+ break;
+ }
+ }
+ if (closestTitle && currentTitle !== closestTitle) {
+ selectNavItem(closestTitle.getAttribute('href'));
+ currentTitle = closestTitle;
+ }
+}
+
+var selectedNavItem = null;
+var nav;
+function selectNavItem(href) {
+ var navLink = document.querySelector('.sdldocs-nav [href="' + href + '"]');
+ if (navLink) {
+ var navItem = navLink.parentElement;
+
+ if (navItem != selectedNavItem) {
+ if (selectedNavItem) {
+ selectedNavItem.classList.remove('is-selected');
+ }
+ navItem.classList.add('is-selected');
+
+ if (navItem.offsetTop + navItem.offsetHeight > nav.scrollTop + nav.offsetHeight) {
+ // Scroll down to the item
+ nav.scrollTop = navItem.offsetTop - nav.offsetHeight + navItem.offsetHeight;
+ }
+ else if (navItem.offsetTop < nav.scrollTop) {
+ // Scroll up to the item
+ nav.scrollTop = navItem.offsetTop;
+ }
+
+ selectedNavItem = navItem;
+ }
+ }
+}
+
+window.ignoreScroll = false;
+
+var curScale = 'medium';
+var curMethod = 'standalone';
+var scaleAbbreviations = {
+ 'medium': 'md',
+ 'large': 'lg'
+};
+
+window.addEventListener('DOMContentLoaded', function() {
+ // Get elements once
+ titles = document.getElementsByClassName('js-hashtitle');
+ nav = document.querySelector('.sdldocs-nav');
+
+ changeCSS(curColorstop);
+
+ if (window.location.hash) {
+ // Scroll to the hash
+ // This is required for refreshes when the size is changed
+ var el = document.querySelector(window.location.hash);
+ if (el) {
+ document.querySelector('.sdldocs-components').scrollTop = el.offsetTop;
+ }
+ }
+ else {
+ // Make it #official
+ setHashFromScroll();
+ }
+
+ // Set the hash while scrolling
+ var scrollTimeDelay = 100;
+ var hashTimeout;
+ var sdlDocsComponents = document.querySelector('.sdldocs-components');
+ if (sdlDocsComponents) {
+ sdlDocsComponents.addEventListener('scroll', function() {
+ clearTimeout(hashTimeout);
+ if (window.ignoreScroll) {
+ return;
+ }
+ hashTimeout = setTimeout(setHashFromScroll, scrollTimeDelay);
+ });
+ }
+
+ // scroll navigation
+ var selectedNavItem = document.getElementsByClassName('spectrum-TreeView-item is-selected')[0]
+ if (selectedNavItem) {
+ selectedNavItem.scrollIntoView();
+ }
+});
+
+function changeLoader(loader, value, submask1, submask2) {
+ submask1 = submask1 || loader.querySelector('.spectrum-CircleLoader-fillSubMask1');
+ submask2 = submask2 || loader.querySelector('.spectrum-CircleLoader-fillSubMask2');
+ var angle;
+ if(value > 0 && value <= 50) {
+ angle = -180 + (value/50 * 180);
+ submask1.style.transform = 'rotate('+angle+'deg)';
+ submask2.style.transform = 'rotate(-180deg)';
+ }
+ else if (value > 50) {
+ angle = -180 + (value-50)/50 * 180;
+ submask1.style.transform = 'rotate(0deg)';
+ submask2.style.transform = 'rotate('+angle+'deg)';
+ }
+}
+
+function toggleMenu(elem) {
+ let target = document.getElementById(elem.getAttribute('data-target'));
+ if (target.classList.contains('is-open')) {
+ target.classList.remove('is-open');
+ }
+ else {
+ target.classList.add('is-open');
+ }
+}
diff --git a/js/lunr.min.js b/js/lunr.min.js
new file mode 100644
index 0000000..29d905f
--- /dev/null
+++ b/js/lunr.min.js
@@ -0,0 +1,472 @@
+/**
+ * lunr - http://lunrjs.com - A bit like Solr, but much smaller and not as bright - 0.7.1
+ * Copyright (C) 2016 Oliver Nightingale
+ * @license MIT
+ */
+! function() {
+ var t = function(e) {
+ var n = new t.Index;
+ return n.pipeline.add(t.trimmer, t.stopWordFilter, t.stemmer), e && e.call(n, n), n
+ };
+ t.version = "0.7.1", t.utils = {}, t.utils.warn = function(t) {
+ return function(e) {
+ t.console && console.warn && console.warn(e)
+ }
+ }(this), t.utils.asString = function(t) {
+ return void 0 === t || null === t ? "" : t.toString()
+ }, t.EventEmitter = function() {
+ this.events = {}
+ }, t.EventEmitter.prototype.addListener = function() {
+ var t = Array.prototype.slice.call(arguments),
+ e = t.pop(),
+ n = t;
+ if ("function" != typeof e) throw new TypeError("last argument must be a function");
+ n.forEach(function(t) {
+ this.hasHandler(t) || (this.events[t] = []), this.events[t].push(e)
+ }, this)
+ }, t.EventEmitter.prototype.removeListener = function(t, e) {
+ if (this.hasHandler(t)) {
+ var n = this.events[t].indexOf(e);
+ this.events[t].splice(n, 1), this.events[t].length || delete this.events[t]
+ }
+ }, t.EventEmitter.prototype.emit = function(t) {
+ if (this.hasHandler(t)) {
+ var e = Array.prototype.slice.call(arguments, 1);
+ this.events[t].forEach(function(t) {
+ t.apply(void 0, e)
+ })
+ }
+ }, t.EventEmitter.prototype.hasHandler = function(t) {
+ return t in this.events
+ }, t.tokenizer = function(e) {
+ return arguments.length && null != e && void 0 != e ? Array.isArray(e) ? e.map(function(e) {
+ return t.utils.asString(e).toLowerCase()
+ }) : e.toString().trim().toLowerCase().split(t.tokenizer.seperator) : []
+ }, t.tokenizer.seperator = /[\s\-]+/, t.tokenizer.load = function(t) {
+ var e = this.registeredFunctions[t];
+ if (!e) throw new Error("Cannot load un-registered function: " + t);
+ return e
+ }, t.tokenizer.label = "default", t.tokenizer.registeredFunctions = {
+ "default": t.tokenizer
+ }, t.tokenizer.registerFunction = function(e, n) {
+ n in this.registeredFunctions && t.utils.warn("Overwriting existing tokenizer: " + n), e.label = n, this.registeredFunctions[n] = e
+ }, t.Pipeline = function() {
+ this._stack = []
+ }, t.Pipeline.registeredFunctions = {}, t.Pipeline.registerFunction = function(e, n) {
+ n in this.registeredFunctions && t.utils.warn("Overwriting existing registered function: " + n), e.label = n, t.Pipeline.registeredFunctions[e.label] = e
+ }, t.Pipeline.warnIfFunctionNotRegistered = function(e) {
+ var n = e.label && e.label in this.registeredFunctions;
+ n || t.utils.warn("Function is not registered with pipeline. This may cause problems when serialising the index.\n", e)
+ }, t.Pipeline.load = function(e) {
+ var n = new t.Pipeline;
+ return e.forEach(function(e) {
+ var i = t.Pipeline.registeredFunctions[e];
+ if (!i) throw new Error("Cannot load un-registered function: " + e);
+ n.add(i)
+ }), n
+ }, t.Pipeline.prototype.add = function() {
+ var e = Array.prototype.slice.call(arguments);
+ e.forEach(function(e) {
+ t.Pipeline.warnIfFunctionNotRegistered(e), this._stack.push(e)
+ }, this)
+ }, t.Pipeline.prototype.after = function(e, n) {
+ t.Pipeline.warnIfFunctionNotRegistered(n);
+ var i = this._stack.indexOf(e);
+ if (-1 == i) throw new Error("Cannot find existingFn");
+ i += 1, this._stack.splice(i, 0, n)
+ }, t.Pipeline.prototype.before = function(e, n) {
+ t.Pipeline.warnIfFunctionNotRegistered(n);
+ var i = this._stack.indexOf(e);
+ if (-1 == i) throw new Error("Cannot find existingFn");
+ this._stack.splice(i, 0, n)
+ }, t.Pipeline.prototype.remove = function(t) {
+ var e = this._stack.indexOf(t); - 1 != e && this._stack.splice(e, 1)
+ }, t.Pipeline.prototype.run = function(t) {
+ for (var e = [], n = t.length, i = this._stack.length, r = 0; n > r; r++) {
+ for (var o = t[r], s = 0; i > s && (o = this._stack[s](o, r, t), void 0 !== o && "" !== o); s++);
+ void 0 !== o && "" !== o && e.push(o)
+ }
+ return e
+ }, t.Pipeline.prototype.reset = function() {
+ this._stack = []
+ }, t.Pipeline.prototype.toJSON = function() {
+ return this._stack.map(function(e) {
+ return t.Pipeline.warnIfFunctionNotRegistered(e), e.label
+ })
+ }, t.Vector = function() {
+ this._magnitude = null, this.list = void 0, this.length = 0
+ }, t.Vector.Node = function(t, e, n) {
+ this.idx = t, this.val = e, this.next = n
+ }, t.Vector.prototype.insert = function(e, n) {
+ this._magnitude = void 0;
+ var i = this.list;
+ if (!i) return this.list = new t.Vector.Node(e, n, i), this.length++;
+ if (e < i.idx) return this.list = new t.Vector.Node(e, n, i), this.length++;
+ for (var r = i, o = i.next; void 0 != o;) {
+ if (e < o.idx) return r.next = new t.Vector.Node(e, n, o), this.length++;
+ r = o, o = o.next
+ }
+ return r.next = new t.Vector.Node(e, n, o), this.length++
+ }, t.Vector.prototype.magnitude = function() {
+ if (this._magnitude) return this._magnitude;
+ for (var t, e = this.list, n = 0; e;) t = e.val, n += t * t, e = e.next;
+ return this._magnitude = Math.sqrt(n)
+ }, t.Vector.prototype.dot = function(t) {
+ for (var e = this.list, n = t.list, i = 0; e && n;) e.idx < n.idx ? e = e.next : e.idx > n.idx ? n = n.next : (i += e.val * n.val, e = e.next, n = n.next);
+ return i
+ }, t.Vector.prototype.similarity = function(t) {
+ return this.dot(t) / (this.magnitude() * t.magnitude())
+ }, t.SortedSet = function() {
+ this.length = 0, this.elements = []
+ }, t.SortedSet.load = function(t) {
+ var e = new this;
+ return e.elements = t, e.length = t.length, e
+ }, t.SortedSet.prototype.add = function() {
+ var t, e;
+ for (t = 0; t < arguments.length; t++) e = arguments[t], ~this.indexOf(e) || this.elements.splice(this.locationFor(e), 0, e);
+ this.length = this.elements.length
+ }, t.SortedSet.prototype.toArray = function() {
+ return this.elements.slice()
+ }, t.SortedSet.prototype.map = function(t, e) {
+ return this.elements.map(t, e)
+ }, t.SortedSet.prototype.forEach = function(t, e) {
+ return this.elements.forEach(t, e)
+ }, t.SortedSet.prototype.indexOf = function(t) {
+ for (var e = 0, n = this.elements.length, i = n - e, r = e + Math.floor(i / 2), o = this.elements[r]; i > 1;) {
+ if (o === t) return r;
+ t > o && (e = r), o > t && (n = r), i = n - e, r = e + Math.floor(i / 2), o = this.elements[r]
+ }
+ return o === t ? r : -1
+ }, t.SortedSet.prototype.locationFor = function(t) {
+ for (var e = 0, n = this.elements.length, i = n - e, r = e + Math.floor(i / 2), o = this.elements[r]; i > 1;) t > o && (e = r), o > t && (n = r), i = n - e, r = e + Math.floor(i / 2), o = this.elements[r];
+ return o > t ? r : t > o ? r + 1 : void 0
+ }, t.SortedSet.prototype.intersect = function(e) {
+ for (var n = new t.SortedSet, i = 0, r = 0, o = this.length, s = e.length, a = this.elements, h = e.elements;;) {
+ if (i > o - 1 || r > s - 1) break;
+ a[i] !== h[r] ? a[i] < h[r] ? i++ : a[i] > h[r] && r++ : (n.add(a[i]), i++, r++)
+ }
+ return n
+ }, t.SortedSet.prototype.clone = function() {
+ var e = new t.SortedSet;
+ return e.elements = this.toArray(), e.length = e.elements.length, e
+ }, t.SortedSet.prototype.union = function(t) {
+ var e, n, i;
+ this.length >= t.length ? (e = this, n = t) : (e = t, n = this), i = e.clone();
+ for (var r = 0, o = n.toArray(); r < o.length; r++) i.add(o[r]);
+ return i
+ }, t.SortedSet.prototype.toJSON = function() {
+ return this.toArray()
+ }, t.Index = function() {
+ this._fields = [], this._ref = "id", this.pipeline = new t.Pipeline, this.documentStore = new t.Store, this.tokenStore = new t.TokenStore, this.corpusTokens = new t.SortedSet, this.eventEmitter = new t.EventEmitter, this.tokenizerFn = t.tokenizer, this._idfCache = {}, this.on("add", "remove", "update", function() {
+ this._idfCache = {}
+ }.bind(this))
+ }, t.Index.prototype.on = function() {
+ var t = Array.prototype.slice.call(arguments);
+ return this.eventEmitter.addListener.apply(this.eventEmitter, t)
+ }, t.Index.prototype.off = function(t, e) {
+ return this.eventEmitter.removeListener(t, e)
+ }, t.Index.load = function(e) {
+ e.version !== t.version && t.utils.warn("version mismatch: current " + t.version + " importing " + e.version);
+ var n = new this;
+ return n._fields = e.fields, n._ref = e.ref, n.tokenizer = t.tokenizer.load(e.tokenizer), n.documentStore = t.Store.load(e.documentStore), n.tokenStore = t.TokenStore.load(e.tokenStore), n.corpusTokens = t.SortedSet.load(e.corpusTokens), n.pipeline = t.Pipeline.load(e.pipeline), n
+ }, t.Index.prototype.field = function(t, e) {
+ var e = e || {}, n = {
+ name: t,
+ boost: e.boost || 1
+ };
+ return this._fields.push(n), this
+ }, t.Index.prototype.ref = function(t) {
+ return this._ref = t, this
+ }, t.Index.prototype.tokenizer = function(e) {
+ var n = e.label && e.label in t.tokenizer.registeredFunctions;
+ return n || t.utils.warn("Function is not a registered tokenizer. This may cause problems when serialising the index"), this.tokenizerFn = e, this
+ }, t.Index.prototype.add = function(e, n) {
+ var i = {}, r = new t.SortedSet,
+ o = e[this._ref],
+ n = void 0 === n ? !0 : n;
+ this._fields.forEach(function(t) {
+ var n = this.pipeline.run(this.tokenizerFn(e[t.name]));
+ i[t.name] = n;
+ for (var o = 0; o < n.length; o++) {
+ var s = n[o];
+ r.add(s), this.corpusTokens.add(s)
+ }
+ }, this), this.documentStore.set(o, r);
+ for (var s = 0; s < r.length; s++) {
+ for (var a = r.elements[s], h = 0, u = 0; u < this._fields.length; u++) {
+ var l = this._fields[u],
+ c = i[l.name],
+ f = c.length;
+ if (f) {
+ for (var d = 0, p = 0; f > p; p++) c[p] === a && d++;
+ h += d / f * l.boost
+ }
+ }
+ this.tokenStore.add(a, {
+ ref: o,
+ tf: h
+ })
+ }
+ n && this.eventEmitter.emit("add", e, this)
+ }, t.Index.prototype.remove = function(t, e) {
+ var n = t[this._ref],
+ e = void 0 === e ? !0 : e;
+ if (this.documentStore.has(n)) {
+ var i = this.documentStore.get(n);
+ this.documentStore.remove(n), i.forEach(function(t) {
+ this.tokenStore.remove(t, n)
+ }, this), e && this.eventEmitter.emit("remove", t, this)
+ }
+ }, t.Index.prototype.update = function(t, e) {
+ var e = void 0 === e ? !0 : e;
+ this.remove(t, !1), this.add(t, !1), e && this.eventEmitter.emit("update", t, this)
+ }, t.Index.prototype.idf = function(t) {
+ var e = "@" + t;
+ if (Object.prototype.hasOwnProperty.call(this._idfCache, e)) return this._idfCache[e];
+ var n = this.tokenStore.count(t),
+ i = 1;
+ return n > 0 && (i = 1 + Math.log(this.documentStore.length / n)), this._idfCache[e] = i
+ }, t.Index.prototype.search = function(e) {
+ var n = this.pipeline.run(this.tokenizerFn(e)),
+ i = new t.Vector,
+ r = [],
+ o = this._fields.reduce(function(t, e) {
+ return t + e.boost
+ }, 0),
+ s = n.some(function(t) {
+ return this.tokenStore.has(t)
+ }, this);
+ if (!s) return [];
+ n.forEach(function(e, n, s) {
+ var a = 1 / s.length * this._fields.length * o,
+ h = this,
+ u = this.tokenStore.expand(e).reduce(function(n, r) {
+ var o = h.corpusTokens.indexOf(r),
+ s = h.idf(r),
+ u = 1,
+ l = new t.SortedSet;
+ if (r !== e) {
+ var c = Math.max(3, r.length - e.length);
+ u = 1 / Math.log(c)
+ }
+ o > -1 && i.insert(o, a * s * u);
+ for (var f = h.tokenStore.get(r), d = Object.keys(f), p = d.length, v = 0; p > v; v++) l.add(f[d[v]].ref);
+ return n.union(l)
+ }, new t.SortedSet);
+ r.push(u)
+ }, this);
+ var a = r.reduce(function(t, e) {
+ return t.intersect(e)
+ });
+ return a.map(function(t) {
+ return {
+ ref: t,
+ score: i.similarity(this.documentVector(t))
+ }
+ }, this).sort(function(t, e) {
+ return e.score - t.score
+ })
+ }, t.Index.prototype.documentVector = function(e) {
+ for (var n = this.documentStore.get(e), i = n.length, r = new t.Vector, o = 0; i > o; o++) {
+ var s = n.elements[o],
+ a = this.tokenStore.get(s)[e].tf,
+ h = this.idf(s);
+ r.insert(this.corpusTokens.indexOf(s), a * h)
+ }
+ return r
+ }, t.Index.prototype.toJSON = function() {
+ return {
+ version: t.version,
+ fields: this._fields,
+ ref: this._ref,
+ tokenizer: this.tokenizerFn.label,
+ documentStore: this.documentStore.toJSON(),
+ tokenStore: this.tokenStore.toJSON(),
+ corpusTokens: this.corpusTokens.toJSON(),
+ pipeline: this.pipeline.toJSON()
+ }
+ }, t.Index.prototype.use = function(t) {
+ var e = Array.prototype.slice.call(arguments, 1);
+ e.unshift(this), t.apply(this, e)
+ }, t.Store = function() {
+ this.store = {}, this.length = 0
+ }, t.Store.load = function(e) {
+ var n = new this;
+ return n.length = e.length, n.store = Object.keys(e.store).reduce(function(n, i) {
+ return n[i] = t.SortedSet.load(e.store[i]), n
+ }, {}), n
+ }, t.Store.prototype.set = function(t, e) {
+ this.has(t) || this.length++, this.store[t] = e
+ }, t.Store.prototype.get = function(t) {
+ return this.store[t]
+ }, t.Store.prototype.has = function(t) {
+ return t in this.store
+ }, t.Store.prototype.remove = function(t) {
+ this.has(t) && (delete this.store[t], this.length--)
+ }, t.Store.prototype.toJSON = function() {
+ return {
+ store: this.store,
+ length: this.length
+ }
+ }, t.stemmer = function() {
+ var t = {
+ ational: "ate",
+ tional: "tion",
+ enci: "ence",
+ anci: "ance",
+ izer: "ize",
+ bli: "ble",
+ alli: "al",
+ entli: "ent",
+ eli: "e",
+ ousli: "ous",
+ ization: "ize",
+ ation: "ate",
+ ator: "ate",
+ alism: "al",
+ iveness: "ive",
+ fulness: "ful",
+ ousness: "ous",
+ aliti: "al",
+ iviti: "ive",
+ biliti: "ble",
+ logi: "log"
+ }, e = {
+ icate: "ic",
+ ative: "",
+ alize: "al",
+ iciti: "ic",
+ ical: "ic",
+ ful: "",
+ ness: ""
+ }, n = "[^aeiou]",
+ i = "[aeiouy]",
+ r = n + "[^aeiouy]*",
+ o = i + "[aeiou]*",
+ s = "^(" + r + ")?" + o + r,
+ a = "^(" + r + ")?" + o + r + "(" + o + ")?$",
+ h = "^(" + r + ")?" + o + r + o + r,
+ u = "^(" + r + ")?" + i,
+ l = new RegExp(s),
+ c = new RegExp(h),
+ f = new RegExp(a),
+ d = new RegExp(u),
+ p = /^(.+?)(ss|i)es$/,
+ v = /^(.+?)([^s])s$/,
+ g = /^(.+?)eed$/,
+ m = /^(.+?)(ed|ing)$/,
+ y = /.$/,
+ S = /(at|bl|iz)$/,
+ w = new RegExp("([^aeiouylsz])\\1$"),
+ k = new RegExp("^" + r + i + "[^aeiouwxy]$"),
+ x = /^(.+?[^aeiou])y$/,
+ b = /^(.+?)(ational|tional|enci|anci|izer|bli|alli|entli|eli|ousli|ization|ation|ator|alism|iveness|fulness|ousness|aliti|iviti|biliti|logi)$/,
+ E = /^(.+?)(icate|ative|alize|iciti|ical|ful|ness)$/,
+ F = /^(.+?)(al|ance|ence|er|ic|able|ible|ant|ement|ment|ent|ou|ism|ate|iti|ous|ive|ize)$/,
+ _ = /^(.+?)(s|t)(ion)$/,
+ z = /^(.+?)e$/,
+ O = /ll$/,
+ P = new RegExp("^" + r + i + "[^aeiouwxy]$"),
+ T = function(n) {
+ var i, r, o, s, a, h, u;
+ if (n.length < 3) return n;
+ if (o = n.substr(0, 1), "y" == o && (n = o.toUpperCase() + n.substr(1)), s = p, a = v, s.test(n) ? n = n.replace(s, "$1$2") : a.test(n) && (n = n.replace(a, "$1$2")), s = g, a = m, s.test(n)) {
+ var T = s.exec(n);
+ s = l, s.test(T[1]) && (s = y, n = n.replace(s, ""))
+ } else if (a.test(n)) {
+ var T = a.exec(n);
+ i = T[1], a = d, a.test(i) && (n = i, a = S, h = w, u = k, a.test(n) ? n += "e" : h.test(n) ? (s = y, n = n.replace(s, "")) : u.test(n) && (n += "e"))
+ }
+ if (s = x, s.test(n)) {
+ var T = s.exec(n);
+ i = T[1], n = i + "i"
+ }
+ if (s = b, s.test(n)) {
+ var T = s.exec(n);
+ i = T[1], r = T[2], s = l, s.test(i) && (n = i + t[r])
+ }
+ if (s = E, s.test(n)) {
+ var T = s.exec(n);
+ i = T[1], r = T[2], s = l, s.test(i) && (n = i + e[r])
+ }
+ if (s = F, a = _, s.test(n)) {
+ var T = s.exec(n);
+ i = T[1], s = c, s.test(i) && (n = i)
+ } else if (a.test(n)) {
+ var T = a.exec(n);
+ i = T[1] + T[2], a = c, a.test(i) && (n = i)
+ }
+ if (s = z, s.test(n)) {
+ var T = s.exec(n);
+ i = T[1], s = c, a = f, h = P, (s.test(i) || a.test(i) && !h.test(i)) && (n = i)
+ }
+ return s = O, a = c, s.test(n) && a.test(n) && (s = y, n = n.replace(s, "")), "y" == o && (n = o.toLowerCase() + n.substr(1)), n
+ };
+ return T
+ }(), t.Pipeline.registerFunction(t.stemmer, "stemmer"), t.generateStopWordFilter = function(t) {
+ var e = t.reduce(function(t, e) {
+ return t[e] = e, t
+ }, {});
+ return function(t) {
+ return t && e[t] !== t ? t : void 0
+ }
+ }, t.stopWordFilter = t.generateStopWordFilter(["a", "able", "about", "across", "after", "all", "almost", "also", "am", "among", "an", "and", "any", "are", "as", "at", "be", "because", "been", "but", "by", "can", "cannot", "could", "dear", "did", "do", "does", "either", "else", "ever", "every", "for", "from", "get", "got", "had", "has", "have", "he", "her", "hers", "him", "his", "how", "however", "i", "if", "in", "into", "is", "it", "its", "just", "least", "let", "like", "likely", "may", "me", "might", "most", "must", "my", "neither", "no", "nor", "not", "of", "off", "often", "on", "only", "or", "other", "our", "own", "rather", "said", "say", "says", "she", "should", "since", "so", "some", "than", "that", "the", "their", "them", "then", "there", "these", "they", "this", "tis", "to", "too", "twas", "us", "wants", "was", "we", "were", "what", "when", "where", "which", "while", "who", "whom", "why", "will", "with", "would", "yet", "you", "your"]), t.Pipeline.registerFunction(t.stopWordFilter, "stopWordFilter"), t.trimmer = function(t) {
+ return t.replace(/^\W+/, "").replace(/\W+$/, "")
+ }, t.Pipeline.registerFunction(t.trimmer, "trimmer"), t.TokenStore = function() {
+ this.root = {
+ docs: {}
+ }, this.length = 0
+ }, t.TokenStore.load = function(t) {
+ var e = new this;
+ return e.root = t.root, e.length = t.length, e
+ }, t.TokenStore.prototype.add = function(t, e, n) {
+ var n = n || this.root,
+ i = t.charAt(0),
+ r = t.slice(1);
+ return i in n || (n[i] = {
+ docs: {}
+ }), 0 === r.length ? (n[i].docs[e.ref] = e, void(this.length += 1)) : this.add(r, e, n[i])
+ }, t.TokenStore.prototype.has = function(t) {
+ if (!t) return !1;
+ for (var e = this.root, n = 0; n < t.length; n++) {
+ if (!e[t.charAt(n)]) return !1;
+ e = e[t.charAt(n)]
+ }
+ return !0
+ }, t.TokenStore.prototype.getNode = function(t) {
+ if (!t) return {};
+ for (var e = this.root, n = 0; n < t.length; n++) {
+ if (!e[t.charAt(n)]) return {};
+ e = e[t.charAt(n)]
+ }
+ return e
+ }, t.TokenStore.prototype.get = function(t, e) {
+ return this.getNode(t, e).docs || {}
+ }, t.TokenStore.prototype.count = function(t, e) {
+ return Object.keys(this.get(t, e)).length
+ }, t.TokenStore.prototype.remove = function(t, e) {
+ if (t) {
+ for (var n = this.root, i = 0; i < t.length; i++) {
+ if (!(t.charAt(i) in n)) return;
+ n = n[t.charAt(i)]
+ }
+ delete n.docs[e]
+ }
+ }, t.TokenStore.prototype.expand = function(t, e) {
+ var n = this.getNode(t),
+ i = n.docs || {}, e = e || [];
+ return Object.keys(i).length && e.push(t), Object.keys(n).forEach(function(n) {
+ "docs" !== n && e.concat(this.expand(t + n, e))
+ }, this), e
+ }, t.TokenStore.prototype.toJSON = function() {
+ return {
+ root: this.root,
+ length: this.length
+ }
+ },
+ function(t, e) {
+ "function" == typeof define && define.amd ? define(e) : "object" == typeof exports ? module.exports = e() : t.lunr = e()
+ }(this, function() {
+ return t
+ })
+}();
diff --git a/js/search.js b/js/search.js
new file mode 100644
index 0000000..77242a0
--- /dev/null
+++ b/js/search.js
@@ -0,0 +1,63 @@
+(function() {
+ function displaySearchResults(results, store) {
+ var searchResults = document.getElementById('search-results');
+
+ if (results.length) { // Are there any results?
+ var appendString = '';
+
+ for (var i = 0; i < results.length; i++) { // Iterate over the results
+ var item = store[results[i].ref];
+ appendString += '
';
+ }
+
+ searchResults.innerHTML = appendString;
+ } else {
+ searchResults.innerHTML = '
No results found
';
+ }
+ }
+
+ function getQueryVariable(variable) {
+ var query = window.location.search.substring(1);
+ var vars = query.split('&');
+
+ for (var i = 0; i < vars.length; i++) {
+ var pair = vars[i].split('=');
+
+ if (pair[0] === variable) {
+ return decodeURIComponent(pair[1].replace(/\+/g, '%20'));
+ }
+ }
+ }
+
+ var searchTerm = getQueryVariable('query');
+
+ if (searchTerm) {
+ document.getElementById('search-box').setAttribute("value", searchTerm);
+
+ // Initalize lunr with the fields it will be searching on. I've given title
+ // a boost of 10 to indicate matches on this field are more important.
+ var idx = lunr(function() {
+ this.field('id');
+ this.field('title', {
+ boost: 10
+ });
+ this.field('author');
+ this.field('category');
+ this.field('content');
+ });
+
+ for (var key in window.store) { // Add the data to lunr
+ idx.add({
+ 'id': key,
+ 'title': window.store[key].title,
+ 'author': window.store[key].author,
+ 'category': window.store[key].category,
+ 'content': window.store[key].content
+ });
+
+ var results = idx.search(searchTerm); // Get lunr to perform a search
+ displaySearchResults(results, window.store); // We'll write this in the next section
+ }
+ }
+})();
diff --git a/js/vendor/typekit.js b/js/vendor/typekit.js
new file mode 100644
index 0000000..c752f92
--- /dev/null
+++ b/js/vendor/typekit.js
@@ -0,0 +1,45 @@
+/* global Typekit, document */
+/* jshint -W033,-W116 */
+(function(window, undefined) {
+ "use strict"
+
+ var config = {
+ /* REPEAT AFTER ME:
+ I WILL NOT REUSE THE TYPEKIT ID FOR SPECTRUM-CSS DOCS IN MY PRODUCT
+ I WILL NOT REUSE THE TYPEKIT ID FOR SPECTRUM-CSS DOCS IN MY PRODUCT
+ I WILL NOT REUSE THE TYPEKIT ID FOR SPECTRUM-CSS DOCS IN MY PRODUCT
+ See https://wiki.corp.adobe.com/display/devrel/Using+Typekit+at+Adobe to get set up right. */
+ kitId: 'pbi5ojv',
+ scriptTimeout: 3000
+ };
+
+ if (!window.Typekit) { // we load the typescript only once
+ var h = document.getElementsByTagName("html")[0];
+ h.className += " wf-loading";
+ var t = setTimeout(function() {
+ h.className = h.className.replace(/(\s|^)wf-loading(\s|$)/g, " ");
+ h.className += " wf-inactive";
+ }, config.scriptTimeout);
+ var tk = document.createElement("script"),
+ d = false;
+
+ // Always load over https
+ tk.src = 'https://use.typekit.net/' + config.kitId + '.js'
+ tk.type = "text/javascript";
+ tk.async = "true";
+ tk.onload = tk.onreadystatechange = function() {
+ var a = this.readyState;
+ if (d || a && a !== "complete" && a !== "loaded") {
+ return;
+ }
+ d = true;
+ clearTimeout(t);
+ try {
+ Typekit.load(config);
+ } catch (b) {}
+ };
+ var s = document.getElementsByTagName("script")[0];
+ s.parentNode.insertBefore(tk, s);
+ }
+
+}(this));
diff --git a/resources/example_projects.md b/resources/example_projects.md
new file mode 100644
index 0000000..054dea9
--- /dev/null
+++ b/resources/example_projects.md
@@ -0,0 +1,9 @@
+---
+title: Example Projects
+---
+
+# Example Projects
+
+[Hello World Extension](https://github.com/Adobe-Marketing-Cloud/reactor-helloworld-extension)
+
+A simple example extension.
\ No newline at end of file
diff --git a/resources/index.md b/resources/index.md
new file mode 100644
index 0000000..d3296bb
--- /dev/null
+++ b/resources/index.md
@@ -0,0 +1,26 @@
+---
+title: Overview
+---
+
+# Get in touch
+
+## Slack
+
+[Launch Developers](http://join.launchdevelopers.chat)
+
+If you would like to develop extensions for Launch, [please join us](http://join.launchdevelopers.chat) in the community Slack workspace! Feel free to reach out and a member of the community will typically respond very quickly. The Adobe Launch team is also active in this workspace.
+
+
+## Forum
+
+[Launch Forums](https://forums.adobe.com/community/experience-cloud/platform/launch)
+
+
+## Blogs
+
+[Adobe Tech Blog](https://medium.com/adobetech/search?q=launch)
+
+
+## Additonal Documentation
+
+[Launch User Docs](https://docs.adobelaunch.com)
\ No newline at end of file
diff --git a/resources/tooling.md b/resources/tooling.md
new file mode 100644
index 0000000..b4fa066
--- /dev/null
+++ b/resources/tooling.md
@@ -0,0 +1,34 @@
+---
+title: Tooling
+---
+
+# Tooling
+
+## Library Switching
+
+[Adobe Experience Cloud Chrome Extension](https://chrome.google.com/webstore/detail/adobe-experience-cloud-de/ocdmogmohccmeicdhlhhgepeaijenapj?src=propaganda)
+
+We recommend installing the Adobe Experience Cloud Debugger Chrome extension to help with debugging. Under the "tools" section of the Debugger, you can toggle debug mode for both DTM and Launch in order to see more verbose output in the browser console.
+
+[Launch and DTM Switch](https://chrome.google.com/webstore/detail/adobe-dtm-switch/nlgdemkdapolikbjimjajpmonpbpmipk)
+
+While not developed by Adobe, you can also try the Launch and DTM Switch Chrome Extension. After enabling debugging through the extension, you should see messages logged to the console when running a DTM or Launch library on a website.
+
+
+## Extension Development
+
+[Extension Scaffold Tool](https://www.npmjs.com/package/@adobe/reactor-scaffold)
+
+A command-line tool that's particularly helpful for setting up initial files when building a Reactor extension.
+
+[Extension Sandbox](https://www.npmjs.com/package/@adobe/reactor-sandbox)
+
+This project provides a sandbox that runs on your local computer in which you can manually test your extension. We highly recommend using this tool while developing your extension.
+
+[Extension Packager](https://www.npmjs.com/package/@adobe/reactor-packager)
+
+This project provides a command-line utility for packaging a Launch extension into a zip file. While using this utility is not necessary, it will validate your extension and make an effort to exclude anything from the zip file not necessary for the extension to run properly.
+
+[Extension Uploader](https://www.npmjs.com/package/@adobe/reactor-uploader)
+
+This project provides a command-line utility for uploading a Launch extension to the Launch extension marketplace. It can be used for uploading brand new extension packages or new versions of existing extension packages.
\ No newline at end of file
diff --git a/search/index.html b/search/index.html
new file mode 100644
index 0000000..0af67d1
--- /dev/null
+++ b/search/index.html
@@ -0,0 +1,21 @@
+---
+layout: search
+---
+
+
+
+
+
\ No newline at end of file