/* Box sizing rules */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* Prevent font size inflation */
html {
  -moz-text-size-adjust: none;
  -webkit-text-size-adjust: none;
  text-size-adjust: none;
}

/* Remove default margin in favour of better control in authored CSS */
body,
h1,
h2,
h3,
h4,
p,
figure,
blockquote,
dl,
dd {
  margin-block-end: 0;
  margin: 0;
}

/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
ul[role=list],
ol[role=list] {
  list-style: none;
}

/* Set core body defaults */
body {
  line-height: 1.5;
}

/* Set shorter line heights on headings and interactive elements */
h1,
h2,
h3,
h4,
button,
input,
label {
  line-height: 1.1;
}

/* Balance text wrapping on headings */
h1,
h2,
h3,
h4 {
  text-wrap: balance;
}

/* Addition: To match GitHub reset */
a {
  text-decoration: none;
}

/* A elements that don't have a class get default styles */
a:not([class]) {
  text-decoration-skip-ink: auto;
  color: currentColor;
}

/* Make images easier to work with */
img,
picture {
  max-width: 100%;
  display: block;
}

/* Inherit fonts for inputs and buttons */
input,
button,
textarea,
select {
  font: inherit;
}

/* Make sure textareas without a rows attribute are not tiny */
textarea:not([rows]) {
  min-height: 10em;
}

/* Anything that has been anchored to should have extra scroll margin */
:target {
  scroll-margin-block: 5ex;
}

button {
  background: transparent;
  border: 0;
  padding: 0;
}

iframe {
  border: 0;
}

:root {
  --base-size-2: 0.125rem;
  --base-size-4: 0.25rem;
  --base-size-6: 0.375rem;
  --base-size-8: 0.5rem;
  --base-size-12: 0.75rem;
  --base-size-16: 1rem;
  --base-size-20: 1.25rem;
  --base-size-24: 1.5rem;
  --base-size-28: 1.75rem;
  --base-size-32: 2rem;
  --base-size-36: 2.25rem;
  --base-size-40: 2.5rem;
  --base-size-44: 2.75rem;
  --base-size-48: 3rem;
  --base-size-64: 4rem;
  --base-size-80: 5rem;
  --base-size-96: 6rem;
  --base-size-112: 7rem;
  --base-size-128: 8rem;
}

:root {
  --base-text-weight-light: 300;
  --base-text-weight-normal: 400;
  --base-text-weight-medium: 500;
  --base-text-weight-semibold: 600;
}

:root {
  --motion-skeletonLoader-shimmer-duration-scale: 1s;
  --motion-spinner-duration-rotation: 1s;
  --motion-loading-delay-default: 1s;
}

:root {
  --boxShadow-thin: inset 0 0 0 max(1px, 0.0625rem);
  --boxShadow-thick: inset 0 0 0 max(2px, 0.125rem);
  --boxShadow-thicker: inset 0 0 0 max(4px, 0.25rem);
  --borderWidth-thin: max(1px, 0.0625rem);
  --borderWidth-thick: max(2px, 0.125rem);
  --borderWidth-thicker: max(4px, 0.25rem);
  --borderRadius-small: 0.1875rem;
  --borderRadius-medium: 0.375rem;
  --borderRadius-large: 0.75rem;
  --borderRadius-full: 624.9375rem;
  --outline-focus-offset: -0.125rem;
  --outline-focus-width: 0.125rem;
}

:root {
  --breakpoint-xsmall: 20rem;
  --breakpoint-small: 34rem;
  --breakpoint-medium: 48rem;
  --breakpoint-large: 63.25rem;
  --breakpoint-xlarge: 80rem;
  --breakpoint-xxlarge: 87.5rem;
}

@media (pointer: coarse) {
  :root {
    --control-minTarget-auto: 2.75rem;
    --controlStack-small-gap-auto: 1rem;
    --controlStack-medium-gap-auto: 0.75rem;
  }
}
@media (pointer: fine) {
  :root {
    --control-minTarget-auto: 1rem;
    --controlStack-small-gap-auto: 0.5rem;
    --controlStack-medium-gap-auto: 0.5rem;
  }
}
:root {
  --control-minTarget-fine: 1rem;
  --control-minTarget-coarse: 2.75rem;
  --control-xsmall-size: 1.5rem;
  --control-xsmall-lineBoxHeight: 1.25rem;
  --control-xsmall-paddingBlock: 0.125rem;
  --control-xsmall-paddingInline-condensed: 0.25rem;
  --control-xsmall-paddingInline-normal: 0.5rem;
  --control-xsmall-paddingInline-spacious: 0.75rem;
  --control-xsmall-gap: 0.25rem;
  --control-small-size: 1.75rem;
  --control-small-lineBoxHeight: 1.25rem;
  --control-small-paddingBlock: 0.25rem;
  --control-small-paddingInline-condensed: 0.5rem;
  --control-small-paddingInline-normal: 0.75rem;
  --control-small-gap: 0.25rem;
  --control-medium-size: 2rem;
  --control-medium-lineBoxHeight: 1.25rem;
  --control-medium-paddingBlock: 0.375rem;
  --control-medium-paddingInline-condensed: 0.5rem;
  --control-medium-paddingInline-normal: 0.75rem;
  --control-medium-paddingInline-spacious: 1rem;
  --control-medium-gap: 0.5rem;
  --control-large-size: 2.5rem;
  --control-large-lineBoxHeight: 1.25rem;
  --control-large-paddingBlock: 0.625rem;
  --control-large-paddingInline-normal: 0.75rem;
  --control-large-paddingInline-spacious: 1rem;
  --control-large-gap: 0.5rem;
  --control-xlarge-size: 3rem;
  --control-xlarge-lineBoxHeight: 1.25rem;
  --control-xlarge-paddingBlock: 0.875rem;
  --control-xlarge-paddingInline-normal: 0.75rem;
  --control-xlarge-paddingInline-spacious: 1rem;
  --control-xlarge-gap: 0.5rem;
  --controlStack-small-gap-condensed: 0.5rem;
  --controlStack-small-gap-spacious: 1rem;
  --controlStack-medium-gap-condensed: 0.5rem;
  --controlStack-medium-gap-spacious: 0.75rem;
  --controlStack-large-gap-auto: 0.5rem;
  --controlStack-large-gap-condensed: 0.5rem;
  --controlStack-large-gap-spacious: 0.75rem;
  --space-xxsmall: 0.125rem;
  --space-xsmall: 0.25rem;
  --space-small: 0.375rem;
  --space-medium: 0.5rem;
  --space-large: 0.75rem;
  --space-xlarge: 1rem;
  --spinner-strokeWidth-default: 0.125rem;
  --spinner-size-small: 1rem;
  --spinner-size-medium: 2rem;
  --spinner-size-large: 4rem;
  --stack-padding-condensed: 0.5rem;
  --stack-padding-normal: 1rem;
  --stack-padding-spacious: 1.5rem;
  --stack-gap-condensed: 0.5rem;
  --stack-gap-normal: 1rem;
  --stack-gap-spacious: 1.5rem;
  --overlay-width-xsmall: 12rem;
  --overlay-width-small: 20rem;
  --overlay-width-medium: 30rem;
  --overlay-width-large: 40rem;
  --overlay-width-xlarge: 60rem;
  --overlay-height-small: 16rem;
  --overlay-height-medium: 20rem;
  --overlay-height-large: 27rem;
  --overlay-height-xlarge: 37.5rem;
  --overlay-padding-normal: 1rem;
  --overlay-padding-condensed: 0.5rem;
  --overlay-paddingBlock-condensed: 0.25rem;
  --overlay-paddingBlock-normal: 0.75rem;
  --overlay-borderRadius: 0.375rem;
  --overlay-offset: 0.25rem;
}

@custom-media --viewportRange-narrow (max-width: calc(48rem - 0.02px));
@custom-media --viewportRange-narrowLandscape (max-width: calc(63.25rem - 0.02px) and (max-height: calc(34rem - 0.02px)) and (orientation: landscape));
@custom-media --viewportRange-regular (min-width: 48rem);
@custom-media --viewportRange-wide (min-width: 87.5rem);
@custom-media --viewportRange-portrait (orientation: portrait);
@custom-media --viewportRange-landscape (orientation: landscape);
[data-color-mode=light][data-light-theme=light],
[data-color-mode=light][data-light-theme=light] ::backdrop,
[data-color-mode=auto][data-light-theme=light],
[data-color-mode=auto][data-light-theme=light] ::backdrop {
  --topicTag-borderColor: #ffffff00;
  --highlight-neutral-bgColor: #fff8c5;
  --page-header-bgColor: #f6f8fa;
  --diffBlob-addition-fgColor-text: #1f2328;
  --diffBlob-addition-fgColor-num: #1f2328;
  --diffBlob-addition-bgColor-num: #d1f8d9;
  --diffBlob-addition-bgColor-line: #dafbe1;
  --diffBlob-addition-bgColor-word: #aceebb;
  --diffBlob-deletion-fgColor-text: #1f2328;
  --diffBlob-deletion-fgColor-num: #1f2328;
  --diffBlob-deletion-bgColor-num: #ffcecb;
  --diffBlob-deletion-bgColor-line: #ffebe9;
  --diffBlob-deletion-bgColor-word: #ff818266;
  --diffBlob-hunk-bgColor-num: #54aeff66;
  --diffBlob-expander-iconColor: #636c76;
  --codeMirror-fgColor: #1f2328;
  --codeMirror-bgColor: #ffffff;
  --codeMirror-gutters-bgColor: #ffffff;
  --codeMirror-gutterMarker-fgColor-default: #ffffff;
  --codeMirror-gutterMarker-fgColor-muted: #636c76;
  --codeMirror-lineNumber-fgColor: #636c76;
  --codeMirror-cursor-fgColor: #1f2328;
  --codeMirror-selection-bgColor: #54aeff66;
  --codeMirror-activeline-bgColor: #afb8c133;
  --codeMirror-matchingBracket-fgColor: #1f2328;
  --codeMirror-lines-bgColor: #ffffff;
  --codeMirror-syntax-fgColor-comment: #24292f;
  --codeMirror-syntax-fgColor-constant: #0550ae;
  --codeMirror-syntax-fgColor-entity: #8250df;
  --codeMirror-syntax-fgColor-keyword: #cf222e;
  --codeMirror-syntax-fgColor-storage: #cf222e;
  --codeMirror-syntax-fgColor-string: #0a3069;
  --codeMirror-syntax-fgColor-support: #0550ae;
  --codeMirror-syntax-fgColor-variable: #953800;
  --header-fgColor-default: #ffffffb3;
  --header-fgColor-logo: #ffffff;
  --header-bgColor: #24292f;
  --header-borderColor-divider: #57606a;
  --headerSearch-bgColor: #24292f;
  --headerSearch-borderColor: #57606a;
  --data-blue-color: #006edb;
  --data-blue-color-muted: #d1f0ff;
  --data-auburn-color: #9d615c;
  --data-auburn-color-muted: #f2e9e9;
  --data-orange-color: #eb670f;
  --data-orange-color-muted: #ffe7d1;
  --data-yellow-color: #b88700;
  --data-yellow-color-muted: #ffec9e;
  --data-green-color: #30a147;
  --data-green-color-muted: #caf7ca;
  --data-teal-color: #179b9b;
  --data-teal-color-muted: #c7f5ef;
  --data-purple-color: #894ceb;
  --data-purple-color-muted: #f1e5ff;
  --data-pink-color: #ce2c85;
  --data-pink-color-muted: #ffe5f1;
  --data-red-color: #df0c24;
  --data-red-color-muted: #ffe2e0;
  --data-gray-color: #808fa3;
  --data-gray-color-muted: #e8ecf2;
  --display-blue-bgColor-muted: #d1f0ff;
  --display-blue-bgColor-emphasis: #006edb;
  --display-blue-fgColor: #005fcc;
  --display-blue-borderColor-muted: #ade1ff;
  --display-blue-borderColor-emphasis: #006edb;
  --display-green-bgColor-muted: #caf7ca;
  --display-green-bgColor-emphasis: #2c8141;
  --display-green-fgColor: #2b6e3f;
  --display-green-borderColor-muted: #9ceda0;
  --display-green-borderColor-emphasis: #2c8141;
  --display-orange-bgColor-muted: #ffe7d1;
  --display-orange-bgColor-emphasis: #b8500f;
  --display-orange-fgColor: #a24610;
  --display-orange-borderColor-muted: #fecfaa;
  --display-orange-borderColor-emphasis: #b8500f;
  --display-purple-bgColor-muted: #f1e5ff;
  --display-purple-bgColor-emphasis: #894ceb;
  --display-purple-fgColor: #783ae4;
  --display-purple-borderColor-muted: #e6d2fe;
  --display-purple-borderColor-emphasis: #894ceb;
  --display-plum-bgColor-muted: #f8e5ff;
  --display-plum-bgColor-emphasis: #a830e8;
  --display-plum-fgColor: #961edc;
  --display-plum-borderColor-muted: #f0cdfe;
  --display-plum-borderColor-emphasis: #a830e8;
  --display-red-bgColor-muted: #ffe2e0;
  --display-red-bgColor-emphasis: #df0c24;
  --display-red-fgColor: #c50d28;
  --display-red-borderColor-muted: #fecdcd;
  --display-red-borderColor-emphasis: #df0c24;
  --display-coral-bgColor-muted: #ffe5db;
  --display-coral-bgColor-emphasis: #d43511;
  --display-coral-fgColor: #ba2e12;
  --display-coral-borderColor-muted: #fecebe;
  --display-coral-borderColor-emphasis: #d43511;
  --display-yellow-bgColor-muted: #ffec9e;
  --display-yellow-bgColor-emphasis: #946a00;
  --display-yellow-fgColor: #805900;
  --display-yellow-borderColor-muted: #ffd642;
  --display-yellow-borderColor-emphasis: #946a00;
  --display-gray-bgColor-muted: #e8ecf2;
  --display-gray-bgColor-emphasis: #647182;
  --display-gray-fgColor: #5c6570;
  --display-gray-borderColor-muted: #d2dae4;
  --display-gray-borderColor-emphasis: #647182;
  --display-auburn-bgColor-muted: #f2e9e9;
  --display-auburn-bgColor-emphasis: #9d615c;
  --display-auburn-fgColor: #8a5551;
  --display-auburn-borderColor-muted: #e6d6d5;
  --display-auburn-borderColor-emphasis: #9d615c;
  --display-brown-bgColor-muted: #eeeae2;
  --display-brown-bgColor-emphasis: #856d4c;
  --display-brown-fgColor: #755f43;
  --display-brown-borderColor-muted: #dfd7c8;
  --display-brown-borderColor-emphasis: #856d4c;
  --display-lemon-bgColor-muted: #f7eea1;
  --display-lemon-bgColor-emphasis: #866e04;
  --display-lemon-fgColor: #786002;
  --display-lemon-borderColor-muted: #f0db3d;
  --display-lemon-borderColor-emphasis: #866e04;
  --display-olive-bgColor-muted: #f0f0ad;
  --display-olive-bgColor-emphasis: #64762d;
  --display-olive-fgColor: #56682c;
  --display-olive-borderColor-muted: #dbe170;
  --display-olive-borderColor-emphasis: #64762d;
  --display-lime-bgColor-muted: #e3f2b5;
  --display-lime-bgColor-emphasis: #527a29;
  --display-lime-fgColor: #476c28;
  --display-lime-borderColor-muted: #c7e580;
  --display-lime-borderColor-emphasis: #527a29;
  --display-pine-bgColor-muted: #bff8db;
  --display-pine-bgColor-emphasis: #167e53;
  --display-pine-fgColor: #156f4b;
  --display-pine-borderColor-muted: #80efb9;
  --display-pine-borderColor-emphasis: #167e53;
  --display-teal-bgColor-muted: #c7f5ef;
  --display-teal-bgColor-emphasis: #127e81;
  --display-teal-fgColor: #106e75;
  --display-teal-borderColor-muted: #89ebe1;
  --display-teal-borderColor-emphasis: #127e81;
  --display-cyan-bgColor-muted: #bdf4ff;
  --display-cyan-bgColor-emphasis: #007b94;
  --display-cyan-fgColor: #006a80;
  --display-cyan-borderColor-muted: #7ae9ff;
  --display-cyan-borderColor-emphasis: #007b94;
  --display-indigo-bgColor-muted: #e5e9ff;
  --display-indigo-bgColor-emphasis: #5a61e7;
  --display-indigo-fgColor: #494edf;
  --display-indigo-borderColor-muted: #d2d7fe;
  --display-indigo-borderColor-emphasis: #5a61e7;
  --display-pink-bgColor-muted: #ffe5f1;
  --display-pink-bgColor-emphasis: #ce2c85;
  --display-pink-fgColor: #b12f79;
  --display-pink-borderColor-muted: #fdc9e2;
  --display-pink-borderColor-emphasis: #ce2c85;
  --avatar-bgColor: #ffffff;
  --avatar-borderColor: #1f232826;
  --avatar-shadow: 0px 0px 0px 2px #ffffffcc;
  --avatarStack-fade-bgColor-default: #afb8c1;
  --avatarStack-fade-bgColor-muted: #d0d7de;
  --control-bgColor-rest: #f6f8fa;
  --control-bgColor-hover: #eef1f4;
  --control-bgColor-active: #e7ebef;
  --control-bgColor-disabled: #eaeef2b3;
  --control-bgColor-selected: #f6f8fa;
  --control-fgColor-rest: #24292f;
  --control-fgColor-placeholder: #69727c;
  --control-fgColor-disabled: #8c959f;
  --control-borderColor-rest: #d0d7de;
  --control-borderColor-emphasis: #868f99;
  --control-borderColor-disabled: #eaeef2b3;
  --control-borderColor-selected: #f6f8fa;
  --control-borderColor-success: #08856c;
  --control-borderColor-danger: #cf222e;
  --control-borderColor-warning: #bf8700;
  --control-iconColor-rest: #636c76;
  --control-transparent-bgColor-rest: #ffffff00;
  --control-transparent-bgColor-hover: #d0d7de33;
  --control-transparent-bgColor-active: #d0d7de66;
  --control-transparent-bgColor-disabled: #eaeef2b3;
  --control-transparent-bgColor-selected: #d0d7de33;
  --control-transparent-borderColor-rest: #ffffff00;
  --control-transparent-borderColor-hover: #ffffff00;
  --control-transparent-borderColor-active: #ffffff00;
  --control-danger-fgColor-rest: #d1242f;
  --control-danger-fgColor-hover: #d1242f;
  --control-danger-bgColor-hover: #ffebe9;
  --control-danger-bgColor-active: #ffebe966;
  --control-checked-bgColor-rest: #0969da;
  --control-checked-bgColor-hover: #0860ca;
  --control-checked-bgColor-active: #0757ba;
  --control-checked-bgColor-disabled: #8c959f;
  --control-checked-fgColor-rest: #ffffff;
  --control-checked-fgColor-disabled: #ffffff;
  --control-checked-borderColor-rest: #0969da;
  --control-checked-borderColor-hover: #0860ca;
  --control-checked-borderColor-active: #0757ba;
  --control-checked-borderColor-disabled: #8c959f;
  --controlTrack-bgColor-rest: #eaeef2;
  --controlTrack-bgColor-hover: #dee3e8;
  --controlTrack-bgColor-active: #d2d8de;
  --controlTrack-bgColor-disabled: #8c959f;
  --controlTrack-fgColor-rest: #636c76;
  --controlTrack-fgColor-disabled: #ffffff;
  --controlTrack-borderColor-rest: #ffffff00;
  --controlTrack-borderColor-disabled: #8c959f;
  --controlKnob-bgColor-rest: #ffffff;
  --controlKnob-bgColor-disabled: #eaeef2b3;
  --controlKnob-bgColor-checked: #ffffff;
  --controlKnob-borderColor-rest: #868f99;
  --controlKnob-borderColor-disabled: #eaeef2b3;
  --controlKnob-borderColor-checked: #0969da;
  --counter-borderColor: #ffffff00;
  --button-default-fgColor-rest: #24292f;
  --button-default-bgColor-rest: #f6f8fa;
  --button-default-bgColor-hover: #eef1f4;
  --button-default-bgColor-active: #e7ebef;
  --button-default-bgColor-selected: #e7ebef;
  --button-default-bgColor-disabled: #eaeef2b3;
  --button-default-borderColor-rest: #d0d7de;
  --button-default-borderColor-hover: #d0d7de;
  --button-default-borderColor-active: #d0d7de;
  --button-default-borderColor-disabled: #eaeef2b3;
  --button-default-shadow-resting: 0px 1px 0px 0px #1f23280a;
  --button-primary-fgColor-rest: #ffffff;
  --button-primary-fgColor-disabled: #ffffffcc;
  --button-primary-iconColor-rest: #ffffffcc;
  --button-primary-bgColor-rest: #1c8e75;
  --button-primary-bgColor-hover: #1a8566;
  --button-primary-bgColor-active: #187d57;
  --button-primary-bgColor-disabled: #95d8a6;
  --button-primary-borderColor-rest: #1f232826;
  --button-primary-borderColor-hover: #1f232826;
  --button-primary-borderColor-active: #1f232826;
  --button-primary-borderColor-disabled: #95d8a6;
  --button-primary-shadow-selected: inset 0px 1px 0px 0px #07251f4d;
  --button-invisible-fgColor-rest: #0969da;
  --button-invisible-fgColor-hover: #0969da;
  --button-invisible-fgColor-disabled: #8c959f;
  --button-invisible-iconColor-rest: #636c76;
  --button-invisible-iconColor-hover: #636c76;
  --button-invisible-iconColor-disabled: #8c959f;
  --button-invisible-bgColor-rest: #ffffff00;
  --button-invisible-bgColor-hover: #d0d7de33;
  --button-invisible-bgColor-active: #d0d7de66;
  --button-invisible-bgColor-disabled: #eaeef2b3;
  --button-invisible-borderColor-rest: #ffffff00;
  --button-invisible-borderColor-hover: #ffffff00;
  --button-invisible-borderColor-disabled: #eaeef2b3;
  --button-outline-fgColor-rest: #0969da;
  --button-outline-fgColor-hover: #ffffff;
  --button-outline-fgColor-active: #ffffff;
  --button-outline-fgColor-disabled: #0969da80;
  --button-outline-bgColor-rest: #f6f8fa;
  --button-outline-bgColor-hover: #0969da;
  --button-outline-bgColor-active: #0757ba;
  --button-outline-bgColor-disabled: #f6f8fa;
  --button-outline-borderColor-hover: #1f232826;
  --button-outline-borderColor-active: #1f232826;
  --button-outline-shadow-selected: inset 0px 1px 0px 0px #00215533;
  --button-danger-fgColor-rest: #d1242f;
  --button-danger-fgColor-hover: #ffffff;
  --button-danger-fgColor-active: #ffffff;
  --button-danger-fgColor-disabled: #d1242f80;
  --button-danger-iconColor-rest: #d1242f;
  --button-danger-iconColor-hover: #ffffff;
  --button-danger-bgColor-rest: #f6f8fa;
  --button-danger-bgColor-hover: #a40e26;
  --button-danger-bgColor-active: #8b0820;
  --button-danger-bgColor-disabled: #eaeef2b3;
  --button-danger-borderColor-rest: #d0d7de;
  --button-danger-borderColor-hover: #1f232826;
  --button-danger-borderColor-active: #1f232826;
  --button-danger-shadow-selected: inset 0px 1px 0px 0px #4c001433;
  --button-inactive-fgColor: #57606a;
  --button-inactive-bgColor: #eaeef2;
  --button-star-iconColor: #eac54f;
  --buttonCounter-default-bgColor-rest: #afb8c133;
  --buttonCounter-invisible-bgColor-rest: #afb8c133;
  --buttonCounter-primary-bgColor-rest: #002d1133;
  --buttonCounter-outline-bgColor-rest: #0969da1a;
  --buttonCounter-outline-bgColor-hover: #ffffff33;
  --buttonCounter-outline-bgColor-disabled: #0969da0d;
  --buttonCounter-outline-fgColor-rest: #0550ae;
  --buttonCounter-outline-fgColor-hover: #ffffff;
  --buttonCounter-outline-fgColor-disabled: #0969da80;
  --buttonCounter-danger-bgColor-hover: #ffffff33;
  --buttonCounter-danger-bgColor-disabled: #cf222e0d;
  --buttonCounter-danger-bgColor-rest: #cf222e1a;
  --buttonCounter-danger-fgColor-rest: #c21c2c;
  --buttonCounter-danger-fgColor-hover: #ffffff;
  --buttonCounter-danger-fgColor-disabled: #d1242f80;
  --reactionButton-selected-bgColor-rest: #ddf4ff;
  --reactionButton-selected-bgColor-hover: #caecff;
  --reactionButton-selected-fgColor-rest: #0969da;
  --reactionButton-selected-fgColor-hover: #0550ae;
  --focus-outlineColor: #0969da;
  --focus-outline: #0969da solid 2px;
  --menu-bgColor-active: #ffffff00;
  --overlay-bgColor: #ffffff;
  --overlay-borderColor: #d0d7de80;
  --overlay-backdrop-bgColor: #8c959f33;
  --selectMenu-borderColor: #ffffff00;
  --selectMenu-bgColor-active: #b6e3ff;
  --sideNav-bgColor-selected: #ffffff;
  --skeletonLoader-bgColor: #f6f8fa;
  --timelineBadge-bgColor: #eaeef2;
  --treeViewItem-leadingVisual-iconColor-rest: #54aeff;
  --underlineNav-borderColor-active: #fd8c73;
  --underlineNav-borderColor-hover: #afb8c133;
  --underlineNav-iconColor-rest: #636c76;
  --selection-bgColor: #0969da33;
  --card-bgColor: #ffffff;
  --label-green-bgColor-rest: #caf7ca;
  --label-green-bgColor-hover: #9ceda0;
  --label-green-bgColor-active: #54d961;
  --label-green-fgColor-rest: #2b6e3f;
  --label-green-fgColor-hover: #285c3b;
  --label-green-fgColor-active: #254b34;
  --label-orange-bgColor-rest: #ffe7d1;
  --label-orange-bgColor-hover: #fecfaa;
  --label-orange-bgColor-active: #fbaf74;
  --label-orange-fgColor-rest: #a24610;
  --label-orange-fgColor-hover: #8d3c11;
  --label-orange-fgColor-active: #70300f;
  --label-purple-bgColor-rest: #f1e5ff;
  --label-purple-bgColor-hover: #e6d2fe;
  --label-purple-bgColor-active: #d1b1fc;
  --label-purple-fgColor-rest: #783ae4;
  --label-purple-fgColor-hover: #6223d7;
  --label-purple-fgColor-active: #4f21ab;
  --label-red-bgColor-rest: #ffe2e0;
  --label-red-bgColor-hover: #fecdcd;
  --label-red-bgColor-active: #fda5a7;
  --label-red-fgColor-rest: #c50d28;
  --label-red-fgColor-hover: #a60c29;
  --label-red-fgColor-active: #880c27;
  --label-yellow-bgColor-rest: #ffec9e;
  --label-yellow-bgColor-hover: #ffd642;
  --label-yellow-bgColor-active: #ebb400;
  --label-yellow-fgColor-rest: #805900;
  --label-yellow-fgColor-hover: #704d00;
  --label-yellow-fgColor-active: #5c3d00;
  --label-gray-bgColor-rest: #e8ecf2;
  --label-gray-bgColor-hover: #d2dae4;
  --label-gray-bgColor-active: #b4c0cf;
  --label-gray-fgColor-rest: #5c6570;
  --label-gray-fgColor-hover: #4e535a;
  --label-gray-fgColor-active: #424448;
  --label-auburn-bgColor-rest: #f2e9e9;
  --label-auburn-bgColor-hover: #e6d6d5;
  --label-auburn-bgColor-active: #d4b7b5;
  --label-auburn-fgColor-rest: #8a5551;
  --label-auburn-fgColor-hover: #744744;
  --label-auburn-fgColor-active: #5d3937;
  --label-brown-bgColor-rest: #eeeae2;
  --label-brown-bgColor-hover: #dfd7c8;
  --label-brown-bgColor-active: #cbbda4;
  --label-brown-fgColor-rest: #755f43;
  --label-brown-fgColor-hover: #64513a;
  --label-brown-fgColor-active: #51412f;
  --label-lemon-bgColor-rest: #f7eea1;
  --label-lemon-bgColor-hover: #f0db3d;
  --label-lemon-bgColor-active: #d8bd0e;
  --label-lemon-fgColor-rest: #786002;
  --label-lemon-fgColor-hover: #654f01;
  --label-lemon-fgColor-active: #523f00;
  --label-olive-bgColor-rest: #f0f0ad;
  --label-olive-bgColor-hover: #dbe170;
  --label-olive-bgColor-active: #b9c832;
  --label-olive-fgColor-rest: #56682c;
  --label-olive-fgColor-hover: #495a2b;
  --label-olive-fgColor-active: #3b4927;
  --label-lime-bgColor-rest: #e3f2b5;
  --label-lime-bgColor-hover: #c7e580;
  --label-lime-bgColor-active: #9bd039;
  --label-lime-fgColor-rest: #476c28;
  --label-lime-fgColor-hover: #3a5b25;
  --label-lime-fgColor-active: #2f4a21;
  --label-pine-bgColor-rest: #bff8db;
  --label-pine-bgColor-hover: #80efb9;
  --label-pine-bgColor-active: #1dd781;
  --label-pine-fgColor-rest: #156f4b;
  --label-pine-fgColor-hover: #135d41;
  --label-pine-fgColor-active: #114b36;
  --label-teal-bgColor-rest: #c7f5ef;
  --label-teal-bgColor-hover: #89ebe1;
  --label-teal-bgColor-active: #22d3c7;
  --label-teal-fgColor-rest: #106e75;
  --label-teal-fgColor-hover: #0d5b63;
  --label-teal-fgColor-active: #0a4852;
  --label-cyan-bgColor-rest: #bdf4ff;
  --label-cyan-bgColor-hover: #7ae9ff;
  --label-cyan-bgColor-active: #00d0fa;
  --label-cyan-fgColor-rest: #006a80;
  --label-cyan-fgColor-hover: #00596b;
  --label-cyan-fgColor-active: #004857;
  --label-indigo-bgColor-rest: #e5e9ff;
  --label-indigo-bgColor-hover: #d2d7fe;
  --label-indigo-bgColor-active: #b1b9fb;
  --label-indigo-fgColor-rest: #494edf;
  --label-indigo-fgColor-hover: #393cd5;
  --label-indigo-fgColor-active: #2d2db4;
  --label-blue-bgColor-rest: #d1f0ff;
  --label-blue-bgColor-hover: #ade1ff;
  --label-blue-bgColor-active: #75c8ff;
  --label-blue-fgColor-rest: #005fcc;
  --label-blue-fgColor-hover: #004db3;
  --label-blue-fgColor-active: #003d99;
  --label-plum-bgColor-rest: #f8e5ff;
  --label-plum-bgColor-hover: #f0cdfe;
  --label-plum-bgColor-active: #e2a7fb;
  --label-plum-fgColor-rest: #961edc;
  --label-plum-fgColor-hover: #7d1eb8;
  --label-plum-fgColor-active: #651d96;
  --label-pink-bgColor-rest: #ffe5f1;
  --label-pink-bgColor-hover: #fdc9e2;
  --label-pink-bgColor-active: #f8a5cf;
  --label-pink-fgColor-rest: #b12f79;
  --label-pink-fgColor-hover: #8e2e66;
  --label-pink-fgColor-active: #6e2b53;
  --label-coral-bgColor-rest: #ffe5db;
  --label-coral-bgColor-hover: #fecebe;
  --label-coral-bgColor-active: #fcab92;
  --label-coral-fgColor-rest: #ba2e12;
  --label-coral-fgColor-hover: #9b2712;
  --label-coral-fgColor-active: #7e2011;
  --fgColor-default: #1f2328;
  --fgColor-muted: #636c76;
  --fgColor-onEmphasis: #ffffff;
  --fgColor-white: #ffffff;
  --fgColor-black: #1f2328;
  --fgColor-disabled: #8c959f;
  --fgColor-link: #0969da;
  --fgColor-neutral: #57606a;
  --fgColor-accent: #0969da;
  --fgColor-success: #1a7f37;
  --fgColor-open: #1a7f37;
  --fgColor-attention: #9a6700;
  --fgColor-severe: #bc4c00;
  --fgColor-danger: #d1242f;
  --fgColor-closed: #d1242f;
  --fgColor-done: #8250df;
  --fgColor-upsell: #8250df;
  --fgColor-sponsors: #bf3989;
  --bgColor-default: #ffffff;
  --bgColor-muted: #f6f8fa;
  --bgColor-inset: #f6f8fa;
  --bgColor-emphasis: #24292f;
  --bgColor-inverse: #24292f;
  --bgColor-white: #ffffff;
  --bgColor-black: #1f2328;
  --bgColor-disabled: #eaeef2b3;
  --bgColor-transparent: #ffffff00;
  --bgColor-neutral-muted: #afb8c133;
  --bgColor-neutral-emphasis: #6e7781;
  --bgColor-accent-muted: #ddf4ff;
  --bgColor-accent-emphasis: #0969da;
  --bgColor-success-muted: #dafbe1;
  --bgColor-success-emphasis: #1c8e75;
  --bgColor-open-muted: #dafbe1;
  --bgColor-open-emphasis: #1c8e75;
  --bgColor-attention-muted: #fff8c5;
  --bgColor-attention-emphasis: #9a6700;
  --bgColor-severe-muted: #fff1e5;
  --bgColor-severe-emphasis: #bc4c00;
  --bgColor-danger-muted: #ffebe9;
  --bgColor-danger-emphasis: #cf222e;
  --bgColor-closed-muted: #ffebe9;
  --bgColor-closed-emphasis: #cf222e;
  --bgColor-done-muted: #fbefff;
  --bgColor-done-emphasis: #8250df;
  --bgColor-upsell-muted: #fbefff;
  --bgColor-upsell-emphasis: #8250df;
  --bgColor-sponsors-muted: #ffeff7;
  --bgColor-sponsors-emphasis: #bf3989;
  --borderColor-default: #d0d7de;
  --borderColor-muted: #d0d7deb3;
  --borderColor-emphasis: #6e7781;
  --borderColor-disabled: #eaeef2b3;
  --borderColor-transparent: #ffffff00;
  --borderColor-translucent: #1f232826;
  --borderColor-neutral-muted: #afb8c133;
  --borderColor-neutral-emphasis: #6e7781;
  --borderColor-accent-muted: #54aeff66;
  --borderColor-accent-emphasis: #0969da;
  --borderColor-success-muted: #94c5b666;
  --borderColor-success-emphasis: #08856c;
  --borderColor-open-muted: #94c5b666;
  --borderColor-open-emphasis: #08856c;
  --borderColor-attention-muted: #d4a72c66;
  --borderColor-attention-emphasis: #bf8700;
  --borderColor-severe-muted: #fb8f4466;
  --borderColor-severe-emphasis: #bc4c00;
  --borderColor-danger-muted: #ff818266;
  --borderColor-danger-emphasis: #cf222e;
  --borderColor-closed-muted: #ff818266;
  --borderColor-closed-emphasis: #cf222e;
  --borderColor-done-muted: #c297ff66;
  --borderColor-done-emphasis: #8250df;
  --borderColor-upsell-muted: #c297ff66;
  --borderColor-upsell-emphasis: #8250df;
  --borderColor-sponsors-muted: #ff80c866;
  --borderColor-sponsors-emphasis: #bf3989;
  --color-ansi-black: #24292f;
  --color-ansi-black-bright: #57606a;
  --color-ansi-white: #6e7781;
  --color-ansi-white-bright: #8c959f;
  --color-ansi-gray: #6e7781;
  --color-ansi-red: #cf222e;
  --color-ansi-red-bright: #a40e26;
  --color-ansi-green: #116329;
  --color-ansi-green-bright: #1a7f37;
  --color-ansi-yellow: #4d2d00;
  --color-ansi-yellow-bright: #633c01;
  --color-ansi-blue: #0969da;
  --color-ansi-blue-bright: #218bff;
  --color-ansi-magenta: #8250df;
  --color-ansi-magenta-bright: #a475f9;
  --color-ansi-cyan: #1b7c83;
  --color-ansi-cyan-bright: #3192aa;
  --color-prettylights-syntax-comment: #57606a;
  --color-prettylights-syntax-constant: #0550ae;
  --color-prettylights-syntax-constant-other-reference-link: #0a3069;
  --color-prettylights-syntax-entity: #6639ba;
  --color-prettylights-syntax-storage-modifier-import: #24292f;
  --color-prettylights-syntax-entity-tag: #0550ae;
  --color-prettylights-syntax-keyword: #cf222e;
  --color-prettylights-syntax-string: #0a3069;
  --color-prettylights-syntax-variable: #953800;
  --color-prettylights-syntax-brackethighlighter-unmatched: #82071e;
  --color-prettylights-syntax-brackethighlighter-angle: #57606a;
  --color-prettylights-syntax-invalid-illegal-text: #f6f8fa;
  --color-prettylights-syntax-invalid-illegal-bg: #82071e;
  --color-prettylights-syntax-carriage-return-text: #f6f8fa;
  --color-prettylights-syntax-carriage-return-bg: #cf222e;
  --color-prettylights-syntax-string-regexp: #116329;
  --color-prettylights-syntax-markup-list: #3b2300;
  --color-prettylights-syntax-markup-heading: #0550ae;
  --color-prettylights-syntax-markup-italic: #24292f;
  --color-prettylights-syntax-markup-bold: #24292f;
  --color-prettylights-syntax-markup-deleted-text: #82071e;
  --color-prettylights-syntax-markup-deleted-bg: #ffebe9;
  --color-prettylights-syntax-markup-inserted-text: #116329;
  --color-prettylights-syntax-markup-inserted-bg: #dafbe1;
  --color-prettylights-syntax-markup-changed-text: #953800;
  --color-prettylights-syntax-markup-changed-bg: #ffd8b5;
  --color-prettylights-syntax-markup-ignored-text: #eaeef2;
  --color-prettylights-syntax-markup-ignored-bg: #0550ae;
  --color-prettylights-syntax-meta-diff-range: #8250df;
  --color-prettylights-syntax-sublimelinter-gutter-mark: #8c959f;
  --shadow-inset: inset 0px 1px 0px 0px #1f23280a;
  --shadow-resting-xsmall: 0px 1px 0px 0px #1f23281a;
  --shadow-resting-small: 0px 1px 0px 0px #1f23280a;
  --shadow-resting-medium: 0px 3px 6px 0px #424a531f;
  --shadow-floating-small: 0px 0px 0px 1px #d0d7de80, 0px 6px 12px -3px #424a530a, 0px 6px 18px 0px #424a531f;
  --shadow-floating-medium: 0px 0px 0px 1px #d0d7de, 0px 8px 16px -4px #424a5314, 0px 4px 32px -4px #424a5314, 0px 24px 48px -12px #424a5314, 0px 48px 96px -24px #424a5314;
  --shadow-floating-large: 0px 0px 0px 1px #d0d7de, 0px 40px 80px 0px #424a533d;
  --shadow-floating-xlarge: 0px 0px 0px 1px #d0d7de, 0px 56px 112px 0px #424a5352;
  --shadow-floating-legacy: 0px 6px 12px -3px #424a530a, 0px 6px 18px 0px #424a531f;
}

@media (prefers-color-scheme: dark) {
  [data-color-mode=auto][data-dark-theme=light],
  [data-color-mode=auto][data-dark-theme=light] ::backdrop {
    --topicTag-borderColor: #ffffff00;
    --highlight-neutral-bgColor: #fff8c5;
    --page-header-bgColor: #f6f8fa;
    --diffBlob-addition-fgColor-text: #1f2328;
    --diffBlob-addition-fgColor-num: #1f2328;
    --diffBlob-addition-bgColor-num: #d1f8d9;
    --diffBlob-addition-bgColor-line: #dafbe1;
    --diffBlob-addition-bgColor-word: #aceebb;
    --diffBlob-deletion-fgColor-text: #1f2328;
    --diffBlob-deletion-fgColor-num: #1f2328;
    --diffBlob-deletion-bgColor-num: #ffcecb;
    --diffBlob-deletion-bgColor-line: #ffebe9;
    --diffBlob-deletion-bgColor-word: #ff818266;
    --diffBlob-hunk-bgColor-num: #54aeff66;
    --diffBlob-expander-iconColor: #636c76;
    --codeMirror-fgColor: #1f2328;
    --codeMirror-bgColor: #ffffff;
    --codeMirror-gutters-bgColor: #ffffff;
    --codeMirror-gutterMarker-fgColor-default: #ffffff;
    --codeMirror-gutterMarker-fgColor-muted: #636c76;
    --codeMirror-lineNumber-fgColor: #636c76;
    --codeMirror-cursor-fgColor: #1f2328;
    --codeMirror-selection-bgColor: #54aeff66;
    --codeMirror-activeline-bgColor: #afb8c133;
    --codeMirror-matchingBracket-fgColor: #1f2328;
    --codeMirror-lines-bgColor: #ffffff;
    --codeMirror-syntax-fgColor-comment: #24292f;
    --codeMirror-syntax-fgColor-constant: #0550ae;
    --codeMirror-syntax-fgColor-entity: #8250df;
    --codeMirror-syntax-fgColor-keyword: #cf222e;
    --codeMirror-syntax-fgColor-storage: #cf222e;
    --codeMirror-syntax-fgColor-string: #0a3069;
    --codeMirror-syntax-fgColor-support: #0550ae;
    --codeMirror-syntax-fgColor-variable: #953800;
    --header-fgColor-default: #ffffffb3;
    --header-fgColor-logo: #ffffff;
    --header-bgColor: #24292f;
    --header-borderColor-divider: #57606a;
    --headerSearch-bgColor: #24292f;
    --headerSearch-borderColor: #57606a;
    --data-blue-color: #006edb;
    --data-blue-color-muted: #d1f0ff;
    --data-auburn-color: #9d615c;
    --data-auburn-color-muted: #f2e9e9;
    --data-orange-color: #eb670f;
    --data-orange-color-muted: #ffe7d1;
    --data-yellow-color: #b88700;
    --data-yellow-color-muted: #ffec9e;
    --data-green-color: #30a147;
    --data-green-color-muted: #caf7ca;
    --data-teal-color: #179b9b;
    --data-teal-color-muted: #c7f5ef;
    --data-purple-color: #894ceb;
    --data-purple-color-muted: #f1e5ff;
    --data-pink-color: #ce2c85;
    --data-pink-color-muted: #ffe5f1;
    --data-red-color: #df0c24;
    --data-red-color-muted: #ffe2e0;
    --data-gray-color: #808fa3;
    --data-gray-color-muted: #e8ecf2;
    --display-blue-bgColor-muted: #d1f0ff;
    --display-blue-bgColor-emphasis: #006edb;
    --display-blue-fgColor: #005fcc;
    --display-blue-borderColor-muted: #ade1ff;
    --display-blue-borderColor-emphasis: #006edb;
    --display-green-bgColor-muted: #caf7ca;
    --display-green-bgColor-emphasis: #2c8141;
    --display-green-fgColor: #2b6e3f;
    --display-green-borderColor-muted: #9ceda0;
    --display-green-borderColor-emphasis: #2c8141;
    --display-orange-bgColor-muted: #ffe7d1;
    --display-orange-bgColor-emphasis: #b8500f;
    --display-orange-fgColor: #a24610;
    --display-orange-borderColor-muted: #fecfaa;
    --display-orange-borderColor-emphasis: #b8500f;
    --display-purple-bgColor-muted: #f1e5ff;
    --display-purple-bgColor-emphasis: #894ceb;
    --display-purple-fgColor: #783ae4;
    --display-purple-borderColor-muted: #e6d2fe;
    --display-purple-borderColor-emphasis: #894ceb;
    --display-plum-bgColor-muted: #f8e5ff;
    --display-plum-bgColor-emphasis: #a830e8;
    --display-plum-fgColor: #961edc;
    --display-plum-borderColor-muted: #f0cdfe;
    --display-plum-borderColor-emphasis: #a830e8;
    --display-red-bgColor-muted: #ffe2e0;
    --display-red-bgColor-emphasis: #df0c24;
    --display-red-fgColor: #c50d28;
    --display-red-borderColor-muted: #fecdcd;
    --display-red-borderColor-emphasis: #df0c24;
    --display-coral-bgColor-muted: #ffe5db;
    --display-coral-bgColor-emphasis: #d43511;
    --display-coral-fgColor: #ba2e12;
    --display-coral-borderColor-muted: #fecebe;
    --display-coral-borderColor-emphasis: #d43511;
    --display-yellow-bgColor-muted: #ffec9e;
    --display-yellow-bgColor-emphasis: #946a00;
    --display-yellow-fgColor: #805900;
    --display-yellow-borderColor-muted: #ffd642;
    --display-yellow-borderColor-emphasis: #946a00;
    --display-gray-bgColor-muted: #e8ecf2;
    --display-gray-bgColor-emphasis: #647182;
    --display-gray-fgColor: #5c6570;
    --display-gray-borderColor-muted: #d2dae4;
    --display-gray-borderColor-emphasis: #647182;
    --display-auburn-bgColor-muted: #f2e9e9;
    --display-auburn-bgColor-emphasis: #9d615c;
    --display-auburn-fgColor: #8a5551;
    --display-auburn-borderColor-muted: #e6d6d5;
    --display-auburn-borderColor-emphasis: #9d615c;
    --display-brown-bgColor-muted: #eeeae2;
    --display-brown-bgColor-emphasis: #856d4c;
    --display-brown-fgColor: #755f43;
    --display-brown-borderColor-muted: #dfd7c8;
    --display-brown-borderColor-emphasis: #856d4c;
    --display-lemon-bgColor-muted: #f7eea1;
    --display-lemon-bgColor-emphasis: #866e04;
    --display-lemon-fgColor: #786002;
    --display-lemon-borderColor-muted: #f0db3d;
    --display-lemon-borderColor-emphasis: #866e04;
    --display-olive-bgColor-muted: #f0f0ad;
    --display-olive-bgColor-emphasis: #64762d;
    --display-olive-fgColor: #56682c;
    --display-olive-borderColor-muted: #dbe170;
    --display-olive-borderColor-emphasis: #64762d;
    --display-lime-bgColor-muted: #e3f2b5;
    --display-lime-bgColor-emphasis: #527a29;
    --display-lime-fgColor: #476c28;
    --display-lime-borderColor-muted: #c7e580;
    --display-lime-borderColor-emphasis: #527a29;
    --display-pine-bgColor-muted: #bff8db;
    --display-pine-bgColor-emphasis: #167e53;
    --display-pine-fgColor: #156f4b;
    --display-pine-borderColor-muted: #80efb9;
    --display-pine-borderColor-emphasis: #167e53;
    --display-teal-bgColor-muted: #c7f5ef;
    --display-teal-bgColor-emphasis: #127e81;
    --display-teal-fgColor: #106e75;
    --display-teal-borderColor-muted: #89ebe1;
    --display-teal-borderColor-emphasis: #127e81;
    --display-cyan-bgColor-muted: #bdf4ff;
    --display-cyan-bgColor-emphasis: #007b94;
    --display-cyan-fgColor: #006a80;
    --display-cyan-borderColor-muted: #7ae9ff;
    --display-cyan-borderColor-emphasis: #007b94;
    --display-indigo-bgColor-muted: #e5e9ff;
    --display-indigo-bgColor-emphasis: #5a61e7;
    --display-indigo-fgColor: #494edf;
    --display-indigo-borderColor-muted: #d2d7fe;
    --display-indigo-borderColor-emphasis: #5a61e7;
    --display-pink-bgColor-muted: #ffe5f1;
    --display-pink-bgColor-emphasis: #ce2c85;
    --display-pink-fgColor: #b12f79;
    --display-pink-borderColor-muted: #fdc9e2;
    --display-pink-borderColor-emphasis: #ce2c85;
    --avatar-bgColor: #ffffff;
    --avatar-borderColor: #1f232826;
    --avatar-shadow: 0px 0px 0px 2px #ffffffcc;
    --avatarStack-fade-bgColor-default: #afb8c1;
    --avatarStack-fade-bgColor-muted: #d0d7de;
    --control-bgColor-rest: #f6f8fa;
    --control-bgColor-hover: #eef1f4;
    --control-bgColor-active: #e7ebef;
    --control-bgColor-disabled: #eaeef2b3;
    --control-bgColor-selected: #f6f8fa;
    --control-fgColor-rest: #24292f;
    --control-fgColor-placeholder: #69727c;
    --control-fgColor-disabled: #8c959f;
    --control-borderColor-rest: #d0d7de;
    --control-borderColor-emphasis: #868f99;
    --control-borderColor-disabled: #eaeef2b3;
    --control-borderColor-selected: #f6f8fa;
    --control-borderColor-success: #08856c;
    --control-borderColor-danger: #cf222e;
    --control-borderColor-warning: #bf8700;
    --control-iconColor-rest: #636c76;
    --control-transparent-bgColor-rest: #ffffff00;
    --control-transparent-bgColor-hover: #d0d7de33;
    --control-transparent-bgColor-active: #d0d7de66;
    --control-transparent-bgColor-disabled: #eaeef2b3;
    --control-transparent-bgColor-selected: #d0d7de33;
    --control-transparent-borderColor-rest: #ffffff00;
    --control-transparent-borderColor-hover: #ffffff00;
    --control-transparent-borderColor-active: #ffffff00;
    --control-danger-fgColor-rest: #d1242f;
    --control-danger-fgColor-hover: #d1242f;
    --control-danger-bgColor-hover: #ffebe9;
    --control-danger-bgColor-active: #ffebe966;
    --control-checked-bgColor-rest: #0969da;
    --control-checked-bgColor-hover: #0860ca;
    --control-checked-bgColor-active: #0757ba;
    --control-checked-bgColor-disabled: #8c959f;
    --control-checked-fgColor-rest: #ffffff;
    --control-checked-fgColor-disabled: #ffffff;
    --control-checked-borderColor-rest: #0969da;
    --control-checked-borderColor-hover: #0860ca;
    --control-checked-borderColor-active: #0757ba;
    --control-checked-borderColor-disabled: #8c959f;
    --controlTrack-bgColor-rest: #eaeef2;
    --controlTrack-bgColor-hover: #dee3e8;
    --controlTrack-bgColor-active: #d2d8de;
    --controlTrack-bgColor-disabled: #8c959f;
    --controlTrack-fgColor-rest: #636c76;
    --controlTrack-fgColor-disabled: #ffffff;
    --controlTrack-borderColor-rest: #ffffff00;
    --controlTrack-borderColor-disabled: #8c959f;
    --controlKnob-bgColor-rest: #ffffff;
    --controlKnob-bgColor-disabled: #eaeef2b3;
    --controlKnob-bgColor-checked: #ffffff;
    --controlKnob-borderColor-rest: #868f99;
    --controlKnob-borderColor-disabled: #eaeef2b3;
    --controlKnob-borderColor-checked: #0969da;
    --counter-borderColor: #ffffff00;
    --button-default-fgColor-rest: #24292f;
    --button-default-bgColor-rest: #f6f8fa;
    --button-default-bgColor-hover: #eef1f4;
    --button-default-bgColor-active: #e7ebef;
    --button-default-bgColor-selected: #e7ebef;
    --button-default-bgColor-disabled: #eaeef2b3;
    --button-default-borderColor-rest: #d0d7de;
    --button-default-borderColor-hover: #d0d7de;
    --button-default-borderColor-active: #d0d7de;
    --button-default-borderColor-disabled: #eaeef2b3;
    --button-default-shadow-resting: 0px 1px 0px 0px #1f23280a;
    --button-primary-fgColor-rest: #ffffff;
    --button-primary-fgColor-disabled: #ffffffcc;
    --button-primary-iconColor-rest: #ffffffcc;
    --button-primary-bgColor-rest: #1c8e75;
    --button-primary-bgColor-hover: #1a8566;
    --button-primary-bgColor-active: #187d57;
    --button-primary-bgColor-disabled: #95d8a6;
    --button-primary-borderColor-rest: #1f232826;
    --button-primary-borderColor-hover: #1f232826;
    --button-primary-borderColor-active: #1f232826;
    --button-primary-borderColor-disabled: #95d8a6;
    --button-primary-shadow-selected: inset 0px 1px 0px 0px #07251f4d;
    --button-invisible-fgColor-rest: #0969da;
    --button-invisible-fgColor-hover: #0969da;
    --button-invisible-fgColor-disabled: #8c959f;
    --button-invisible-iconColor-rest: #636c76;
    --button-invisible-iconColor-hover: #636c76;
    --button-invisible-iconColor-disabled: #8c959f;
    --button-invisible-bgColor-rest: #ffffff00;
    --button-invisible-bgColor-hover: #d0d7de33;
    --button-invisible-bgColor-active: #d0d7de66;
    --button-invisible-bgColor-disabled: #eaeef2b3;
    --button-invisible-borderColor-rest: #ffffff00;
    --button-invisible-borderColor-hover: #ffffff00;
    --button-invisible-borderColor-disabled: #eaeef2b3;
    --button-outline-fgColor-rest: #0969da;
    --button-outline-fgColor-hover: #ffffff;
    --button-outline-fgColor-active: #ffffff;
    --button-outline-fgColor-disabled: #0969da80;
    --button-outline-bgColor-rest: #f6f8fa;
    --button-outline-bgColor-hover: #0969da;
    --button-outline-bgColor-active: #0757ba;
    --button-outline-bgColor-disabled: #f6f8fa;
    --button-outline-borderColor-hover: #1f232826;
    --button-outline-borderColor-active: #1f232826;
    --button-outline-shadow-selected: inset 0px 1px 0px 0px #00215533;
    --button-danger-fgColor-rest: #d1242f;
    --button-danger-fgColor-hover: #ffffff;
    --button-danger-fgColor-active: #ffffff;
    --button-danger-fgColor-disabled: #d1242f80;
    --button-danger-iconColor-rest: #d1242f;
    --button-danger-iconColor-hover: #ffffff;
    --button-danger-bgColor-rest: #f6f8fa;
    --button-danger-bgColor-hover: #a40e26;
    --button-danger-bgColor-active: #8b0820;
    --button-danger-bgColor-disabled: #eaeef2b3;
    --button-danger-borderColor-rest: #d0d7de;
    --button-danger-borderColor-hover: #1f232826;
    --button-danger-borderColor-active: #1f232826;
    --button-danger-shadow-selected: inset 0px 1px 0px 0px #4c001433;
    --button-inactive-fgColor: #57606a;
    --button-inactive-bgColor: #eaeef2;
    --button-star-iconColor: #eac54f;
    --buttonCounter-default-bgColor-rest: #afb8c133;
    --buttonCounter-invisible-bgColor-rest: #afb8c133;
    --buttonCounter-primary-bgColor-rest: #002d1133;
    --buttonCounter-outline-bgColor-rest: #0969da1a;
    --buttonCounter-outline-bgColor-hover: #ffffff33;
    --buttonCounter-outline-bgColor-disabled: #0969da0d;
    --buttonCounter-outline-fgColor-rest: #0550ae;
    --buttonCounter-outline-fgColor-hover: #ffffff;
    --buttonCounter-outline-fgColor-disabled: #0969da80;
    --buttonCounter-danger-bgColor-hover: #ffffff33;
    --buttonCounter-danger-bgColor-disabled: #cf222e0d;
    --buttonCounter-danger-bgColor-rest: #cf222e1a;
    --buttonCounter-danger-fgColor-rest: #c21c2c;
    --buttonCounter-danger-fgColor-hover: #ffffff;
    --buttonCounter-danger-fgColor-disabled: #d1242f80;
    --reactionButton-selected-bgColor-rest: #ddf4ff;
    --reactionButton-selected-bgColor-hover: #caecff;
    --reactionButton-selected-fgColor-rest: #0969da;
    --reactionButton-selected-fgColor-hover: #0550ae;
    --focus-outlineColor: #0969da;
    --focus-outline: #0969da solid 2px;
    --menu-bgColor-active: #ffffff00;
    --overlay-bgColor: #ffffff;
    --overlay-borderColor: #d0d7de80;
    --overlay-backdrop-bgColor: #8c959f33;
    --selectMenu-borderColor: #ffffff00;
    --selectMenu-bgColor-active: #b6e3ff;
    --sideNav-bgColor-selected: #ffffff;
    --skeletonLoader-bgColor: #f6f8fa;
    --timelineBadge-bgColor: #eaeef2;
    --treeViewItem-leadingVisual-iconColor-rest: #54aeff;
    --underlineNav-borderColor-active: #fd8c73;
    --underlineNav-borderColor-hover: #afb8c133;
    --underlineNav-iconColor-rest: #636c76;
    --selection-bgColor: #0969da33;
    --card-bgColor: #ffffff;
    --label-green-bgColor-rest: #caf7ca;
    --label-green-bgColor-hover: #9ceda0;
    --label-green-bgColor-active: #54d961;
    --label-green-fgColor-rest: #2b6e3f;
    --label-green-fgColor-hover: #285c3b;
    --label-green-fgColor-active: #254b34;
    --label-orange-bgColor-rest: #ffe7d1;
    --label-orange-bgColor-hover: #fecfaa;
    --label-orange-bgColor-active: #fbaf74;
    --label-orange-fgColor-rest: #a24610;
    --label-orange-fgColor-hover: #8d3c11;
    --label-orange-fgColor-active: #70300f;
    --label-purple-bgColor-rest: #f1e5ff;
    --label-purple-bgColor-hover: #e6d2fe;
    --label-purple-bgColor-active: #d1b1fc;
    --label-purple-fgColor-rest: #783ae4;
    --label-purple-fgColor-hover: #6223d7;
    --label-purple-fgColor-active: #4f21ab;
    --label-red-bgColor-rest: #ffe2e0;
    --label-red-bgColor-hover: #fecdcd;
    --label-red-bgColor-active: #fda5a7;
    --label-red-fgColor-rest: #c50d28;
    --label-red-fgColor-hover: #a60c29;
    --label-red-fgColor-active: #880c27;
    --label-yellow-bgColor-rest: #ffec9e;
    --label-yellow-bgColor-hover: #ffd642;
    --label-yellow-bgColor-active: #ebb400;
    --label-yellow-fgColor-rest: #805900;
    --label-yellow-fgColor-hover: #704d00;
    --label-yellow-fgColor-active: #5c3d00;
    --label-gray-bgColor-rest: #e8ecf2;
    --label-gray-bgColor-hover: #d2dae4;
    --label-gray-bgColor-active: #b4c0cf;
    --label-gray-fgColor-rest: #5c6570;
    --label-gray-fgColor-hover: #4e535a;
    --label-gray-fgColor-active: #424448;
    --label-auburn-bgColor-rest: #f2e9e9;
    --label-auburn-bgColor-hover: #e6d6d5;
    --label-auburn-bgColor-active: #d4b7b5;
    --label-auburn-fgColor-rest: #8a5551;
    --label-auburn-fgColor-hover: #744744;
    --label-auburn-fgColor-active: #5d3937;
    --label-brown-bgColor-rest: #eeeae2;
    --label-brown-bgColor-hover: #dfd7c8;
    --label-brown-bgColor-active: #cbbda4;
    --label-brown-fgColor-rest: #755f43;
    --label-brown-fgColor-hover: #64513a;
    --label-brown-fgColor-active: #51412f;
    --label-lemon-bgColor-rest: #f7eea1;
    --label-lemon-bgColor-hover: #f0db3d;
    --label-lemon-bgColor-active: #d8bd0e;
    --label-lemon-fgColor-rest: #786002;
    --label-lemon-fgColor-hover: #654f01;
    --label-lemon-fgColor-active: #523f00;
    --label-olive-bgColor-rest: #f0f0ad;
    --label-olive-bgColor-hover: #dbe170;
    --label-olive-bgColor-active: #b9c832;
    --label-olive-fgColor-rest: #56682c;
    --label-olive-fgColor-hover: #495a2b;
    --label-olive-fgColor-active: #3b4927;
    --label-lime-bgColor-rest: #e3f2b5;
    --label-lime-bgColor-hover: #c7e580;
    --label-lime-bgColor-active: #9bd039;
    --label-lime-fgColor-rest: #476c28;
    --label-lime-fgColor-hover: #3a5b25;
    --label-lime-fgColor-active: #2f4a21;
    --label-pine-bgColor-rest: #bff8db;
    --label-pine-bgColor-hover: #80efb9;
    --label-pine-bgColor-active: #1dd781;
    --label-pine-fgColor-rest: #156f4b;
    --label-pine-fgColor-hover: #135d41;
    --label-pine-fgColor-active: #114b36;
    --label-teal-bgColor-rest: #c7f5ef;
    --label-teal-bgColor-hover: #89ebe1;
    --label-teal-bgColor-active: #22d3c7;
    --label-teal-fgColor-rest: #106e75;
    --label-teal-fgColor-hover: #0d5b63;
    --label-teal-fgColor-active: #0a4852;
    --label-cyan-bgColor-rest: #bdf4ff;
    --label-cyan-bgColor-hover: #7ae9ff;
    --label-cyan-bgColor-active: #00d0fa;
    --label-cyan-fgColor-rest: #006a80;
    --label-cyan-fgColor-hover: #00596b;
    --label-cyan-fgColor-active: #004857;
    --label-indigo-bgColor-rest: #e5e9ff;
    --label-indigo-bgColor-hover: #d2d7fe;
    --label-indigo-bgColor-active: #b1b9fb;
    --label-indigo-fgColor-rest: #494edf;
    --label-indigo-fgColor-hover: #393cd5;
    --label-indigo-fgColor-active: #2d2db4;
    --label-blue-bgColor-rest: #d1f0ff;
    --label-blue-bgColor-hover: #ade1ff;
    --label-blue-bgColor-active: #75c8ff;
    --label-blue-fgColor-rest: #005fcc;
    --label-blue-fgColor-hover: #004db3;
    --label-blue-fgColor-active: #003d99;
    --label-plum-bgColor-rest: #f8e5ff;
    --label-plum-bgColor-hover: #f0cdfe;
    --label-plum-bgColor-active: #e2a7fb;
    --label-plum-fgColor-rest: #961edc;
    --label-plum-fgColor-hover: #7d1eb8;
    --label-plum-fgColor-active: #651d96;
    --label-pink-bgColor-rest: #ffe5f1;
    --label-pink-bgColor-hover: #fdc9e2;
    --label-pink-bgColor-active: #f8a5cf;
    --label-pink-fgColor-rest: #b12f79;
    --label-pink-fgColor-hover: #8e2e66;
    --label-pink-fgColor-active: #6e2b53;
    --label-coral-bgColor-rest: #ffe5db;
    --label-coral-bgColor-hover: #fecebe;
    --label-coral-bgColor-active: #fcab92;
    --label-coral-fgColor-rest: #ba2e12;
    --label-coral-fgColor-hover: #9b2712;
    --label-coral-fgColor-active: #7e2011;
    --fgColor-default: #1f2328;
    --fgColor-muted: #636c76;
    --fgColor-onEmphasis: #ffffff;
    --fgColor-white: #ffffff;
    --fgColor-black: #1f2328;
    --fgColor-disabled: #8c959f;
    --fgColor-link: #0969da;
    --fgColor-neutral: #57606a;
    --fgColor-accent: #0969da;
    --fgColor-success: #1a7f37;
    --fgColor-open: #1a7f37;
    --fgColor-attention: #9a6700;
    --fgColor-severe: #bc4c00;
    --fgColor-danger: #d1242f;
    --fgColor-closed: #d1242f;
    --fgColor-done: #8250df;
    --fgColor-upsell: #8250df;
    --fgColor-sponsors: #bf3989;
    --bgColor-default: #ffffff;
    --bgColor-muted: #f6f8fa;
    --bgColor-inset: #f6f8fa;
    --bgColor-emphasis: #24292f;
    --bgColor-inverse: #24292f;
    --bgColor-white: #ffffff;
    --bgColor-black: #1f2328;
    --bgColor-disabled: #eaeef2b3;
    --bgColor-transparent: #ffffff00;
    --bgColor-neutral-muted: #afb8c133;
    --bgColor-neutral-emphasis: #6e7781;
    --bgColor-accent-muted: #ddf4ff;
    --bgColor-accent-emphasis: #0969da;
    --bgColor-success-muted: #dafbe1;
    --bgColor-success-emphasis: #1c8e75;
    --bgColor-open-muted: #dafbe1;
    --bgColor-open-emphasis: #1c8e75;
    --bgColor-attention-muted: #fff8c5;
    --bgColor-attention-emphasis: #9a6700;
    --bgColor-severe-muted: #fff1e5;
    --bgColor-severe-emphasis: #bc4c00;
    --bgColor-danger-muted: #ffebe9;
    --bgColor-danger-emphasis: #cf222e;
    --bgColor-closed-muted: #ffebe9;
    --bgColor-closed-emphasis: #cf222e;
    --bgColor-done-muted: #fbefff;
    --bgColor-done-emphasis: #8250df;
    --bgColor-upsell-muted: #fbefff;
    --bgColor-upsell-emphasis: #8250df;
    --bgColor-sponsors-muted: #ffeff7;
    --bgColor-sponsors-emphasis: #bf3989;
    --borderColor-default: #d0d7de;
    --borderColor-muted: #d0d7deb3;
    --borderColor-emphasis: #6e7781;
    --borderColor-disabled: #eaeef2b3;
    --borderColor-transparent: #ffffff00;
    --borderColor-translucent: #1f232826;
    --borderColor-neutral-muted: #afb8c133;
    --borderColor-neutral-emphasis: #6e7781;
    --borderColor-accent-muted: #54aeff66;
    --borderColor-accent-emphasis: #0969da;
    --borderColor-success-muted: #94c5b666;
    --borderColor-success-emphasis: #08856c;
    --borderColor-open-muted: #94c5b666;
    --borderColor-open-emphasis: #08856c;
    --borderColor-attention-muted: #d4a72c66;
    --borderColor-attention-emphasis: #bf8700;
    --borderColor-severe-muted: #fb8f4466;
    --borderColor-severe-emphasis: #bc4c00;
    --borderColor-danger-muted: #ff818266;
    --borderColor-danger-emphasis: #cf222e;
    --borderColor-closed-muted: #ff818266;
    --borderColor-closed-emphasis: #cf222e;
    --borderColor-done-muted: #c297ff66;
    --borderColor-done-emphasis: #8250df;
    --borderColor-upsell-muted: #c297ff66;
    --borderColor-upsell-emphasis: #8250df;
    --borderColor-sponsors-muted: #ff80c866;
    --borderColor-sponsors-emphasis: #bf3989;
    --color-ansi-black: #24292f;
    --color-ansi-black-bright: #57606a;
    --color-ansi-white: #6e7781;
    --color-ansi-white-bright: #8c959f;
    --color-ansi-gray: #6e7781;
    --color-ansi-red: #cf222e;
    --color-ansi-red-bright: #a40e26;
    --color-ansi-green: #116329;
    --color-ansi-green-bright: #1a7f37;
    --color-ansi-yellow: #4d2d00;
    --color-ansi-yellow-bright: #633c01;
    --color-ansi-blue: #0969da;
    --color-ansi-blue-bright: #218bff;
    --color-ansi-magenta: #8250df;
    --color-ansi-magenta-bright: #a475f9;
    --color-ansi-cyan: #1b7c83;
    --color-ansi-cyan-bright: #3192aa;
    --color-prettylights-syntax-comment: #57606a;
    --color-prettylights-syntax-constant: #0550ae;
    --color-prettylights-syntax-constant-other-reference-link: #0a3069;
    --color-prettylights-syntax-entity: #6639ba;
    --color-prettylights-syntax-storage-modifier-import: #24292f;
    --color-prettylights-syntax-entity-tag: #0550ae;
    --color-prettylights-syntax-keyword: #cf222e;
    --color-prettylights-syntax-string: #0a3069;
    --color-prettylights-syntax-variable: #953800;
    --color-prettylights-syntax-brackethighlighter-unmatched: #82071e;
    --color-prettylights-syntax-brackethighlighter-angle: #57606a;
    --color-prettylights-syntax-invalid-illegal-text: #f6f8fa;
    --color-prettylights-syntax-invalid-illegal-bg: #82071e;
    --color-prettylights-syntax-carriage-return-text: #f6f8fa;
    --color-prettylights-syntax-carriage-return-bg: #cf222e;
    --color-prettylights-syntax-string-regexp: #116329;
    --color-prettylights-syntax-markup-list: #3b2300;
    --color-prettylights-syntax-markup-heading: #0550ae;
    --color-prettylights-syntax-markup-italic: #24292f;
    --color-prettylights-syntax-markup-bold: #24292f;
    --color-prettylights-syntax-markup-deleted-text: #82071e;
    --color-prettylights-syntax-markup-deleted-bg: #ffebe9;
    --color-prettylights-syntax-markup-inserted-text: #116329;
    --color-prettylights-syntax-markup-inserted-bg: #dafbe1;
    --color-prettylights-syntax-markup-changed-text: #953800;
    --color-prettylights-syntax-markup-changed-bg: #ffd8b5;
    --color-prettylights-syntax-markup-ignored-text: #eaeef2;
    --color-prettylights-syntax-markup-ignored-bg: #0550ae;
    --color-prettylights-syntax-meta-diff-range: #8250df;
    --color-prettylights-syntax-sublimelinter-gutter-mark: #8c959f;
    --shadow-inset: inset 0px 1px 0px 0px #1f23280a;
    --shadow-resting-xsmall: 0px 1px 0px 0px #1f23281a;
    --shadow-resting-small: 0px 1px 0px 0px #1f23280a;
    --shadow-resting-medium: 0px 3px 6px 0px #424a531f;
    --shadow-floating-small: 0px 0px 0px 1px #d0d7de80, 0px 6px 12px -3px #424a530a, 0px 6px 18px 0px #424a531f;
    --shadow-floating-medium: 0px 0px 0px 1px #d0d7de, 0px 8px 16px -4px #424a5314, 0px 4px 32px -4px #424a5314, 0px 24px 48px -12px #424a5314, 0px 48px 96px -24px #424a5314;
    --shadow-floating-large: 0px 0px 0px 1px #d0d7de, 0px 40px 80px 0px #424a533d;
    --shadow-floating-xlarge: 0px 0px 0px 1px #d0d7de, 0px 56px 112px 0px #424a5352;
    --shadow-floating-legacy: 0px 6px 12px -3px #424a530a, 0px 6px 18px 0px #424a531f;
  }
}
:root {
  --text-codeInline-size: 0.9285em;
  --text-codeBlock-lineHeight: 1.5385;
  --text-codeBlock-size: 0.8125rem;
  --text-caption-lineHeight: 1.3333;
  --text-caption-size: 0.75rem;
  --text-body-lineHeight-small: 1.6666;
  --text-body-lineHeight-medium: 1.4285;
  --text-body-lineHeight-large: 1.5;
  --text-body-size-small: 0.75rem;
  --text-body-size-medium: 0.875rem;
  --text-body-size-large: 1rem;
  --text-subtitle-lineHeight: 1.6;
  --text-subtitle-size: 1.25rem;
  --text-title-lineHeight-small: 1.5;
  --text-title-lineHeight-medium: 1.6;
  --text-title-lineHeight-large: 1.5;
  --text-title-size-small: 1rem;
  --text-title-size-medium: 1.25rem;
  --text-title-size-large: 2rem;
  --text-display-lineHeight: 1.4;
  --text-display-size: 2.5rem;
  --text-display-lineBoxHeight: 1.4;
  --fontStack-monospace: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;
  --fontStack-sansSerifDisplay: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
  --fontStack-sansSerif: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
  --fontStack-system: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
  --text-codeInline-weight: var(--base-text-weight-normal);
  --text-codeBlock-weight: var(--base-text-weight-normal);
  --text-caption-weight: var(--base-text-weight-normal);
  --text-body-weight: var(--base-text-weight-normal);
  --text-subtitle-weight: var(--base-text-weight-normal);
  --text-title-weight-small: var(--base-text-weight-semibold);
  --text-title-weight-medium: var(--base-text-weight-semibold);
  --text-title-weight-large: var(--base-text-weight-semibold);
  --text-display-weight: var(--base-text-weight-medium);
  --text-codeInline-shorthand: var(--text-codeInline-weight) var(--text-codeInline-size) var(--fontStack-monospace);
  --text-codeBlock-shorthand: var(--text-codeBlock-weight) var(--text-codeBlock-size) / var(--text-codeBlock-lineHeight) var(--fontStack-monospace);
  --text-caption-shorthand: var(--text-caption-weight) var(--text-caption-size) / var(--text-caption-lineHeight) var(--fontStack-sansSerif);
  --text-body-shorthand-small: var(--text-body-weight) var(--text-body-size-small) / var(--text-body-lineHeight-small) var(--fontStack-sansSerif);
  --text-body-shorthand-medium: var(--text-body-weight) var(--text-body-size-medium) / var(--text-body-lineHeight-medium) var(--fontStack-sansSerif);
  --text-body-shorthand-large: var(--text-body-weight) var(--text-body-size-large) / var(--text-body-lineHeight-large) var(--fontStack-sansSerif);
  --text-subtitle-shorthand: var(--text-subtitle-weight) var(--text-subtitle-size) / var(--text-subtitle-lineHeight) var(--fontStack-sansSerifDisplay);
  --text-title-shorthand-small: var(--text-title-weight-small) var(--text-title-size-small) / var(--text-title-lineHeight-small) var(--fontStack-sansSerif);
  --text-title-shorthand-medium: var(--text-title-weight-medium) var(--text-title-size-medium) / var(--text-title-lineHeight-medium) var(--fontStack-sansSerifDisplay);
  --text-title-shorthand-large: var(--text-title-weight-large) var(--text-title-size-large) / var(--text-title-lineHeight-large) var(--fontStack-sansSerifDisplay);
  --text-display-shorthand: var(--text-display-weight) var(--text-display-size) / var(--text-display-lineHeight) var(--fontStack-sansSerifDisplay);
}

:root {
  --breakpoint-xsmall: 20rem;
  --breakpoint-small: 34rem;
  --breakpoint-medium: 48rem;
  --breakpoint-large: 63.25rem;
  --breakpoint-xlarge: 80rem;
  --breakpoint-xxlarge: 87.5rem;
}

/*
This copies selected CSS from files in @primer/css/src/base, to tailor our use of Primer.
*/
[hidden][hidden] {
  display: none !important;
}

/*** Primer CSS ***/
:root {
  --Layout-pane-width: 220px;
  --Layout-content-width: 100%;
  --Layout-template-columns: 1fr var(--Layout-pane-width);
  --Layout-template-areas: "content pane";
  --Layout-column-gap: var(--base-size-16);
  --Layout-row-gap: var(--base-size-16);
  --Layout-outer-spacing-x: 0px;
  --Layout-outer-spacing-y: 0px;
  --Layout-inner-spacing-min: 0px;
  --Layout-inner-spacing-max: 0px;
}

.PageLayout {
  display: block;
  margin: var(--Layout-outer-spacing-y) var(--Layout-outer-spacing-x);
}
@media (min-width: 768px) {
  .PageLayout.PageLayout--panePos-start {
    --Layout-template-columns: var(--Layout-pane-width) minmax(0, calc(100% - var(--Layout-pane-width) - var(--Layout-column-gap)));
    --Layout-template-areas: "pane content";
  }
  .PageLayout.PageLayout--panePos-end {
    --Layout-template-columns: minmax(0, calc(100% - var(--Layout-pane-width) - var(--Layout-column-gap))) var(--Layout-pane-width);
    --Layout-template-areas: "content pane";
  }
  .PageLayout .PageLayout-header--hasDivider {
    padding-bottom: max(var(--Layout-row-gap), var(--Layout-inner-spacing-min));
    border-bottom: 1px solid var(--borderColor-default, var(--color-border-default));
  }
  .PageLayout .PageLayout-footer--hasDivider {
    padding-top: max(var(--Layout-row-gap), var(--Layout-inner-spacing-min));
    border-top: 1px solid var(--borderColor-default, var(--color-border-default));
  }
  .PageLayout.PageLayout--hasPaneDivider.PageLayout--panePos-start .PageLayout-pane {
    border-right: 1px solid var(--borderColor-default, var(--color-border-default));
  }
  .PageLayout.PageLayout--hasPaneDivider.PageLayout--panePos-start:not(.PageLayout--columnGap-none) .PageLayout-pane {
    padding-right: calc(var(--Layout-column-gap) - 1px);
    margin-right: calc(var(--Layout-column-gap) * -1);
  }
  .PageLayout.PageLayout--hasPaneDivider.PageLayout--panePos-start:not(.PageLayout--columnGap-none) .PageLayout-content {
    margin-left: var(--Layout-column-gap);
  }
  .PageLayout.PageLayout--hasPaneDivider.PageLayout--panePos-end .PageLayout-pane {
    border-left: 1px solid var(--borderColor-default, var(--color-border-default));
  }
  .PageLayout.PageLayout--hasPaneDivider.PageLayout--panePos-end:not(.PageLayout--columnGap-none) .PageLayout-pane {
    padding-left: calc(var(--Layout-column-gap) - 1px);
    margin-left: calc(var(--Layout-column-gap) * -1);
  }
  .PageLayout.PageLayout--hasPaneDivider.PageLayout--panePos-end:not(.PageLayout--columnGap-none) .PageLayout-content {
    margin-right: var(--Layout-column-gap);
  }
  .PageLayout .PageLayout-pane--sticky {
    position: sticky;
    top: 0;
    max-height: 100vh;
    overflow: auto;
    scrollbar-width: thin;
  }
  @supports (max-height: 100dvh) {
    .PageLayout .PageLayout-pane--sticky {
      max-height: 100dvh;
    }
  }
  .PageLayout [class^=PageLayout-content-centered-] {
    max-width: calc(var(--Layout-content-width) + var(--Layout-pane-width) + var(--Layout-column-gap));
    margin-right: auto;
    margin-left: auto;
  }
  .PageLayout.PageLayout--hasPaneDivider [class^=PageLayout-content-centered-] {
    max-width: calc(var(--Layout-content-width) + var(--Layout-pane-width) + var(--Layout-column-gap) * 2);
  }
  .PageLayout.PageLayout--panePos-start [class^=PageLayout-content-centered-] > [class^=container-] {
    margin-left: 0;
  }
  .PageLayout.PageLayout--panePos-end [class^=PageLayout-content-centered-] > [class^=container-] {
    margin-right: 0;
  }
  .PageLayout .PageLayout-content-centered-sm {
    --Layout-content-width: 544px;
  }
  .PageLayout .PageLayout-content-centered-md {
    --Layout-content-width: 768px;
  }
  .PageLayout .PageLayout-content-centered-lg {
    --Layout-content-width: 1012px;
  }
  .PageLayout .PageLayout-content-centered-xl {
    --Layout-content-width: 1280px;
  }
}
@media (min-width: 768px) and (min-width: 544px) {
  .PageLayout {
    --Layout-pane-width: 220px;
  }
}
@media (min-width: 768px) and (min-width: 768px) {
  .PageLayout {
    --Layout-pane-width: 256px;
  }
}
@media (min-width: 768px) and (min-width: 1012px) {
  .PageLayout {
    --Layout-pane-width: 296px;
  }
}
@media (min-width: 768px) and (min-width: 768px) {
  .PageLayout.PageLayout--paneWidth-narrow {
    --Layout-pane-width: 240px;
  }
}
@media (min-width: 768px) and (min-width: 1012px) {
  .PageLayout.PageLayout--paneWidth-narrow {
    --Layout-pane-width: 256px;
  }
}
@media (min-width: 768px) and (min-width: 1012px) {
  .PageLayout.PageLayout--paneWidth-wide {
    --Layout-pane-width: 320px;
  }
}
@media (min-width: 768px) and (min-width: 1280px) {
  .PageLayout.PageLayout--paneWidth-wide {
    --Layout-pane-width: 336px;
  }
}
@media (max-width: 767.98px) {
  .PageLayout.PageLayout--responsive-stackRegions {
    --Layout-template-columns: 1fr;
    --Layout-template-areas: "content" "pane";
  }
  .PageLayout.PageLayout--responsive-stackRegions.PageLayout--responsive-panePos-start {
    --Layout-template-areas: "pane" "content";
  }
  .PageLayout.PageLayout--responsive-separateRegions {
    --Layout-template-columns: 1fr;
    --Layout-template-areas: "content";
  }
  .PageLayout.PageLayout--responsive-separateRegions.PageLayout--responsive-primary-content {
    --Layout-template-areas: "content";
  }
  .PageLayout.PageLayout--responsive-separateRegions.PageLayout--responsive-primary-content .PageLayout-pane {
    display: none;
  }
  .PageLayout.PageLayout--responsive-separateRegions.PageLayout--responsive-primary-pane {
    --Layout-template-areas: "pane";
  }
  .PageLayout.PageLayout--responsive-separateRegions.PageLayout--responsive-primary-pane .PageLayout-content {
    display: none;
  }
  .PageLayout .PageLayout-region--dividerNarrow-line-before {
    position: relative;
    margin-top: var(--Layout-row-gap);
  }
  .PageLayout .PageLayout-region--dividerNarrow-line-before::before {
    position: absolute;
    left: calc(var(--Layout-outer-spacing-x) * -1);
    display: block;
    width: calc(100% + var(--Layout-outer-spacing-x) * 2);
    height: 1px;
    content: "";
    background-color: var(--borderColor-default, var(--color-border-default));
    top: calc(-1px - var(--Layout-row-gap));
  }
  .PageLayout .PageLayout-region--dividerNarrow-line-after {
    position: relative;
    margin-bottom: var(--Layout-row-gap);
  }
  .PageLayout .PageLayout-region--dividerNarrow-line-after::after {
    position: absolute;
    left: calc(var(--Layout-outer-spacing-x) * -1);
    display: block;
    width: calc(100% + var(--Layout-outer-spacing-x) * 2);
    height: 1px;
    content: "";
    background-color: var(--borderColor-default, var(--color-border-default));
    bottom: calc(-1px - var(--Layout-row-gap));
  }
  .PageLayout .PageLayout-region--dividerNarrow-filled-before {
    position: relative;
    margin-top: calc(var(--base-size-8) + var(--Layout-row-gap));
  }
  .PageLayout .PageLayout-region--dividerNarrow-filled-before::after {
    position: absolute;
    bottom: calc(var(--base-size-8) * -1);
    left: calc(var(--Layout-outer-spacing-x) * -1);
    display: block;
    width: calc(100% + var(--Layout-outer-spacing-x) * 2);
    height: var(--base-size-8);
    content: "";
    background-color: var(--bgColor-inset, var(--color-canvas-inset));
    box-shadow: inset 0 1px var(--borderColor-default, var(--color-border-default)), inset 0 -1px var(--borderColor-default, var(--color-border-default));
    top: calc(var(--base-size-8) * -1 - var(--Layout-row-gap));
  }
  .PageLayout .PageLayout-region--dividerNarrow-filled-after {
    position: relative;
    margin-bottom: calc(var(--base-size-8) + var(--Layout-row-gap));
  }
  .PageLayout .PageLayout-region--dividerNarrow-filled-after::before {
    position: absolute;
    bottom: calc(var(--base-size-8) * -1);
    left: calc(var(--Layout-outer-spacing-x) * -1);
    display: block;
    width: calc(100% + var(--Layout-outer-spacing-x) * 2);
    height: var(--base-size-8);
    content: "";
    background-color: var(--bgColor-inset, var(--color-canvas-inset));
    box-shadow: inset 0 1px var(--borderColor-default, var(--color-border-default)), inset 0 -1px var(--borderColor-default, var(--color-border-default));
    bottom: calc(var(--base-size-8) * -1 - var(--Layout-row-gap));
  }
}

.PageLayout-wrapper {
  display: grid;
  grid: auto-flow/1fr;
  row-gap: var(--Layout-row-gap);
}

.PageLayout-columns {
  display: grid;
  column-gap: var(--Layout-column-gap);
  row-gap: var(--Layout-row-gap);
  grid-template-columns: var(--Layout-template-columns);
  grid-template-rows: 1fr;
  grid-template-areas: var(--Layout-template-areas);
}
.PageLayout-columns .PageLayout-content {
  padding-right: var(--Layout-inner-spacing-max);
  padding-left: var(--Layout-inner-spacing-max);
  grid-area: content;
}
.PageLayout-columns .PageLayout-pane {
  grid-area: pane;
}

.PageLayout--outerSpacing-normal {
  --Layout-outer-spacing-x: var(--base-size-16);
  --Layout-outer-spacing-y: var(--base-size-16);
}
@media (min-width: 1012px) {
  .PageLayout--outerSpacing-normal {
    --Layout-outer-spacing-x: var(--base-size-24);
    --Layout-outer-spacing-y: var(--base-size-24);
  }
}

.PageLayout--outerSpacing-condensed {
  --Layout-outer-spacing-x: var(--base-size-16);
  --Layout-outer-spacing-y: var(--base-size-16);
}

.PageLayout--innerSpacing-normal {
  --Layout-inner-spacing-min: var(--base-size-16);
  --Layout-inner-spacing-max: var(--base-size-16);
}
@media (min-width: 1012px) {
  .PageLayout--innerSpacing-normal {
    --Layout-inner-spacing-max: var(--base-size-24);
  }
}

.PageLayout--innerSpacing-condensed {
  --Layout-inner-spacing-min: var(--base-size-16);
  --Layout-inner-spacing-max: var(--base-size-16);
}

.PageLayout--columnGap-normal {
  --Layout-column-gap: var(--base-size-16);
}
@media (min-width: 1012px) {
  .PageLayout--columnGap-normal {
    --Layout-column-gap: var(--base-size-24);
  }
}

.PageLayout--columnGap-condensed {
  --Layout-column-gap: var(--base-size-16);
}

.PageLayout--columnGap-none {
  --Layout-column-gap: 0px;
}

.PageLayout--rowGap-normal {
  --Layout-row-gap: var(--base-size-16);
}
@media (min-width: 1012px) {
  .PageLayout--rowGap-normal {
    --Layout-row-gap: var(--base-size-24);
  }
}

.PageLayout--rowGap-none {
  --Layout-row-gap: 0px;
}

.PageLayout--rowGap-condensed {
  --Layout-row-gap: var(--base-size-16);
}

.PageLayout-header,
.PageLayout-content,
.PageLayout-pane,
.PageLayout-footer {
  padding: var(--Layout-inner-spacing-min);
}

/* Fade in an element */
.anim-fade-in {
  animation-name: fade-in;
  animation-duration: 1s;
  animation-timing-function: ease-in-out;
}
.anim-fade-in.fast {
  animation-duration: 300ms;
}

@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
/* Fade out an element */
.anim-fade-out {
  animation-name: fade-out;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  animation-timing-function: ease-out;
}
.anim-fade-out.fast {
  animation-duration: 0.3s;
}

@keyframes fade-out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
/* Fade in and slide up an element */
.anim-fade-up {
  opacity: 0;
  animation-name: fade-up;
  animation-duration: 0.3s;
  animation-fill-mode: forwards;
  animation-timing-function: ease-out;
  animation-delay: 1s;
}

@keyframes fade-up {
  0% {
    opacity: 0.8;
    transform: translateY(100%);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
/* Fade an element out and slide down */
.anim-fade-down {
  animation-name: fade-down;
  animation-duration: 0.3s;
  animation-fill-mode: forwards;
  animation-timing-function: ease-in;
}

@keyframes fade-down {
  0% {
    opacity: 1;
    transform: translateY(0);
  }
  100% {
    opacity: 0.5;
    transform: translateY(100%);
  }
}
/* Grow an element width from 0 to 100% */
.anim-grow-x {
  width: 0%;
  animation-name: grow-x;
  animation-duration: 0.3s;
  animation-fill-mode: forwards;
  animation-timing-function: ease;
  animation-delay: 0.5s;
}

@keyframes grow-x {
  to {
    width: 100%;
  }
}
/* Shrink an element from 100% to 0% */
.anim-shrink-x {
  animation-name: shrink-x;
  animation-duration: 0.3s;
  animation-fill-mode: forwards;
  animation-timing-function: ease-in-out;
  animation-delay: 0.5s;
}

@keyframes shrink-x {
  to {
    width: 0%;
  }
}
/* Fade in an element and scale it fast */
.anim-scale-in {
  animation-name: scale-in;
  animation-duration: 0.15s;
  animation-timing-function: cubic-bezier(0.2, 0, 0.13, 1.5);
}

@keyframes scale-in {
  0% {
    opacity: 0;
    transform: scale(0.5);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
/* Pulse an element's opacity */
.anim-pulse {
  animation-name: pulse;
  animation-duration: 2s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}

@keyframes pulse {
  0% {
    opacity: 0.3;
  }
  10% {
    opacity: 1;
  }
  100% {
    opacity: 0.3;
  }
}
/* Pulse in an element */
.anim-pulse-in {
  animation-name: pulse-in;
  animation-duration: 0.5s;
}

@keyframes pulse-in {
  0% {
    transform: scale3d(1, 1, 1);
  }
  50% {
    transform: scale3d(1.1, 1.1, 1.1);
  }
  100% {
    transform: scale3d(1, 1, 1);
  }
}
/* Increase scale of an element on hover */
.hover-grow,
.anim-hover-grow {
  transition: transform 0.3s;
  backface-visibility: hidden;
}
.hover-grow:hover,
.anim-hover-grow:hover {
  transform: scale(1.025);
}

/* Rotate an element 360 degrees over and over, used for spinners */
.anim-rotate {
  animation: rotate-keyframes 1s linear infinite;
}

@keyframes rotate-keyframes {
  100% {
    transform: rotate(360deg);
  }
}
/* Add a gray border to the left and right */
.border-x {
  border-right: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
  border-left: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
}

/* Add a gray border to the top and bottom */
.border-y {
  border-top: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
  border-bottom: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
}

/* Responsive gray borders */
/* Add a gray border on all sides at/above this breakpoint */
.border {
  border: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
}

.border-0 {
  border: 0 !important;
}

.border-top {
  border-top: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
}

.border-right {
  border-right: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
}

.border-bottom {
  border-bottom: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
}

.border-left {
  border-left: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
}

.border-top-0 {
  border-top: 0 !important;
}

.border-right-0 {
  border-right: 0 !important;
}

.border-bottom-0 {
  border-bottom: 0 !important;
}

.border-left-0 {
  border-left: 0 !important;
}

.rounded {
  border-radius: var(--borderRadius-medium, 6px) !important;
}

.rounded-0 {
  border-radius: 0 !important;
}

.rounded-1 {
  border-radius: var(--borderRadius-small, 4px) !important;
}

.rounded-2 {
  border-radius: var(--borderRadius-medium, 6px) !important;
}

.rounded-3 {
  border-radius: var(--borderRadius-large, 8px) !important;
}

.rounded-top-0 {
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
}

.rounded-top-1 {
  border-top-left-radius: var(--borderRadius-small, 4px) !important;
  border-top-right-radius: var(--borderRadius-small, 4px) !important;
}

.rounded-top-2 {
  border-top-left-radius: var(--borderRadius-medium, 6px) !important;
  border-top-right-radius: var(--borderRadius-medium, 6px) !important;
}

.rounded-top-3 {
  border-top-left-radius: var(--borderRadius-medium, 8px) !important;
  border-top-right-radius: var(--borderRadius-medium, 8px) !important;
}

.rounded-right-0 {
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

.rounded-right-1 {
  border-top-right-radius: var(--borderRadius-small, 4px) !important;
  border-bottom-right-radius: var(--borderRadius-small, 4px) !important;
}

.rounded-right-2 {
  border-top-right-radius: var(--borderRadius-medium, 6px) !important;
  border-bottom-right-radius: var(--borderRadius-medium, 6px) !important;
}

.rounded-right-3 {
  border-top-right-radius: var(--borderRadius-medium, 8px) !important;
  border-bottom-right-radius: var(--borderRadius-medium, 8px) !important;
}

.rounded-bottom-0 {
  border-bottom-right-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}

.rounded-bottom-1 {
  border-bottom-right-radius: var(--borderRadius-small, 4px) !important;
  border-bottom-left-radius: var(--borderRadius-small, 4px) !important;
}

.rounded-bottom-2 {
  border-bottom-right-radius: var(--borderRadius-medium, 6px) !important;
  border-bottom-left-radius: var(--borderRadius-medium, 6px) !important;
}

.rounded-bottom-3 {
  border-bottom-right-radius: var(--borderRadius-medium, 8px) !important;
  border-bottom-left-radius: var(--borderRadius-medium, 8px) !important;
}

.rounded-left-0 {
  border-bottom-left-radius: 0 !important;
  border-top-left-radius: 0 !important;
}

.rounded-left-1 {
  border-bottom-left-radius: var(--borderRadius-small, 4px) !important;
  border-top-left-radius: var(--borderRadius-small, 4px) !important;
}

.rounded-left-2 {
  border-bottom-left-radius: var(--borderRadius-medium, 6px) !important;
  border-top-left-radius: var(--borderRadius-medium, 6px) !important;
}

.rounded-left-3 {
  border-bottom-left-radius: var(--borderRadius-medium, 8px) !important;
  border-top-left-radius: var(--borderRadius-medium, 8px) !important;
}

@media (min-width: 544px) {
  /* Add a gray border on all sides at/above this breakpoint */
  .border-sm {
    border: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
  }
  .border-sm-0 {
    border: 0 !important;
  }
  .border-sm-top {
    border-top: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
  }
  .border-sm-right {
    border-right: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
  }
  .border-sm-bottom {
    border-bottom: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
  }
  .border-sm-left {
    border-left: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
  }
  .border-sm-top-0 {
    border-top: 0 !important;
  }
  .border-sm-right-0 {
    border-right: 0 !important;
  }
  .border-sm-bottom-0 {
    border-bottom: 0 !important;
  }
  .border-sm-left-0 {
    border-left: 0 !important;
  }
  .rounded-sm {
    border-radius: var(--borderRadius-medium, 6px) !important;
  }
  .rounded-sm-0 {
    border-radius: 0 !important;
  }
  .rounded-sm-1 {
    border-radius: var(--borderRadius-small, 4px) !important;
  }
  .rounded-sm-2 {
    border-radius: var(--borderRadius-medium, 6px) !important;
  }
  .rounded-sm-3 {
    border-radius: var(--borderRadius-large, 8px) !important;
  }
  .rounded-sm-top-0 {
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
  }
  .rounded-sm-top-1 {
    border-top-left-radius: var(--borderRadius-small, 4px) !important;
    border-top-right-radius: var(--borderRadius-small, 4px) !important;
  }
  .rounded-sm-top-2 {
    border-top-left-radius: var(--borderRadius-medium, 6px) !important;
    border-top-right-radius: var(--borderRadius-medium, 6px) !important;
  }
  .rounded-sm-top-3 {
    border-top-left-radius: var(--borderRadius-medium, 8px) !important;
    border-top-right-radius: var(--borderRadius-medium, 8px) !important;
  }
  .rounded-sm-right-0 {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
  }
  .rounded-sm-right-1 {
    border-top-right-radius: var(--borderRadius-small, 4px) !important;
    border-bottom-right-radius: var(--borderRadius-small, 4px) !important;
  }
  .rounded-sm-right-2 {
    border-top-right-radius: var(--borderRadius-medium, 6px) !important;
    border-bottom-right-radius: var(--borderRadius-medium, 6px) !important;
  }
  .rounded-sm-right-3 {
    border-top-right-radius: var(--borderRadius-medium, 8px) !important;
    border-bottom-right-radius: var(--borderRadius-medium, 8px) !important;
  }
  .rounded-sm-bottom-0 {
    border-bottom-right-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
  }
  .rounded-sm-bottom-1 {
    border-bottom-right-radius: var(--borderRadius-small, 4px) !important;
    border-bottom-left-radius: var(--borderRadius-small, 4px) !important;
  }
  .rounded-sm-bottom-2 {
    border-bottom-right-radius: var(--borderRadius-medium, 6px) !important;
    border-bottom-left-radius: var(--borderRadius-medium, 6px) !important;
  }
  .rounded-sm-bottom-3 {
    border-bottom-right-radius: var(--borderRadius-medium, 8px) !important;
    border-bottom-left-radius: var(--borderRadius-medium, 8px) !important;
  }
  .rounded-sm-left-0 {
    border-bottom-left-radius: 0 !important;
    border-top-left-radius: 0 !important;
  }
  .rounded-sm-left-1 {
    border-bottom-left-radius: var(--borderRadius-small, 4px) !important;
    border-top-left-radius: var(--borderRadius-small, 4px) !important;
  }
  .rounded-sm-left-2 {
    border-bottom-left-radius: var(--borderRadius-medium, 6px) !important;
    border-top-left-radius: var(--borderRadius-medium, 6px) !important;
  }
  .rounded-sm-left-3 {
    border-bottom-left-radius: var(--borderRadius-medium, 8px) !important;
    border-top-left-radius: var(--borderRadius-medium, 8px) !important;
  }
}
@media (min-width: 768px) {
  /* Add a gray border on all sides at/above this breakpoint */
  .border-md {
    border: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
  }
  .border-md-0 {
    border: 0 !important;
  }
  .border-md-top {
    border-top: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
  }
  .border-md-right {
    border-right: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
  }
  .border-md-bottom {
    border-bottom: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
  }
  .border-md-left {
    border-left: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
  }
  .border-md-top-0 {
    border-top: 0 !important;
  }
  .border-md-right-0 {
    border-right: 0 !important;
  }
  .border-md-bottom-0 {
    border-bottom: 0 !important;
  }
  .border-md-left-0 {
    border-left: 0 !important;
  }
  .rounded-md {
    border-radius: var(--borderRadius-medium, 6px) !important;
  }
  .rounded-md-0 {
    border-radius: 0 !important;
  }
  .rounded-md-1 {
    border-radius: var(--borderRadius-small, 4px) !important;
  }
  .rounded-md-2 {
    border-radius: var(--borderRadius-medium, 6px) !important;
  }
  .rounded-md-3 {
    border-radius: var(--borderRadius-large, 8px) !important;
  }
  .rounded-md-top-0 {
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
  }
  .rounded-md-top-1 {
    border-top-left-radius: var(--borderRadius-small, 4px) !important;
    border-top-right-radius: var(--borderRadius-small, 4px) !important;
  }
  .rounded-md-top-2 {
    border-top-left-radius: var(--borderRadius-medium, 6px) !important;
    border-top-right-radius: var(--borderRadius-medium, 6px) !important;
  }
  .rounded-md-top-3 {
    border-top-left-radius: var(--borderRadius-medium, 8px) !important;
    border-top-right-radius: var(--borderRadius-medium, 8px) !important;
  }
  .rounded-md-right-0 {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
  }
  .rounded-md-right-1 {
    border-top-right-radius: var(--borderRadius-small, 4px) !important;
    border-bottom-right-radius: var(--borderRadius-small, 4px) !important;
  }
  .rounded-md-right-2 {
    border-top-right-radius: var(--borderRadius-medium, 6px) !important;
    border-bottom-right-radius: var(--borderRadius-medium, 6px) !important;
  }
  .rounded-md-right-3 {
    border-top-right-radius: var(--borderRadius-medium, 8px) !important;
    border-bottom-right-radius: var(--borderRadius-medium, 8px) !important;
  }
  .rounded-md-bottom-0 {
    border-bottom-right-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
  }
  .rounded-md-bottom-1 {
    border-bottom-right-radius: var(--borderRadius-small, 4px) !important;
    border-bottom-left-radius: var(--borderRadius-small, 4px) !important;
  }
  .rounded-md-bottom-2 {
    border-bottom-right-radius: var(--borderRadius-medium, 6px) !important;
    border-bottom-left-radius: var(--borderRadius-medium, 6px) !important;
  }
  .rounded-md-bottom-3 {
    border-bottom-right-radius: var(--borderRadius-medium, 8px) !important;
    border-bottom-left-radius: var(--borderRadius-medium, 8px) !important;
  }
  .rounded-md-left-0 {
    border-bottom-left-radius: 0 !important;
    border-top-left-radius: 0 !important;
  }
  .rounded-md-left-1 {
    border-bottom-left-radius: var(--borderRadius-small, 4px) !important;
    border-top-left-radius: var(--borderRadius-small, 4px) !important;
  }
  .rounded-md-left-2 {
    border-bottom-left-radius: var(--borderRadius-medium, 6px) !important;
    border-top-left-radius: var(--borderRadius-medium, 6px) !important;
  }
  .rounded-md-left-3 {
    border-bottom-left-radius: var(--borderRadius-medium, 8px) !important;
    border-top-left-radius: var(--borderRadius-medium, 8px) !important;
  }
}
@media (min-width: 1012px) {
  /* Add a gray border on all sides at/above this breakpoint */
  .border-lg {
    border: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
  }
  .border-lg-0 {
    border: 0 !important;
  }
  .border-lg-top {
    border-top: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
  }
  .border-lg-right {
    border-right: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
  }
  .border-lg-bottom {
    border-bottom: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
  }
  .border-lg-left {
    border-left: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
  }
  .border-lg-top-0 {
    border-top: 0 !important;
  }
  .border-lg-right-0 {
    border-right: 0 !important;
  }
  .border-lg-bottom-0 {
    border-bottom: 0 !important;
  }
  .border-lg-left-0 {
    border-left: 0 !important;
  }
  .rounded-lg {
    border-radius: var(--borderRadius-medium, 6px) !important;
  }
  .rounded-lg-0 {
    border-radius: 0 !important;
  }
  .rounded-lg-1 {
    border-radius: var(--borderRadius-small, 4px) !important;
  }
  .rounded-lg-2 {
    border-radius: var(--borderRadius-medium, 6px) !important;
  }
  .rounded-lg-3 {
    border-radius: var(--borderRadius-large, 8px) !important;
  }
  .rounded-lg-top-0 {
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
  }
  .rounded-lg-top-1 {
    border-top-left-radius: var(--borderRadius-small, 4px) !important;
    border-top-right-radius: var(--borderRadius-small, 4px) !important;
  }
  .rounded-lg-top-2 {
    border-top-left-radius: var(--borderRadius-medium, 6px) !important;
    border-top-right-radius: var(--borderRadius-medium, 6px) !important;
  }
  .rounded-lg-top-3 {
    border-top-left-radius: var(--borderRadius-medium, 8px) !important;
    border-top-right-radius: var(--borderRadius-medium, 8px) !important;
  }
  .rounded-lg-right-0 {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
  }
  .rounded-lg-right-1 {
    border-top-right-radius: var(--borderRadius-small, 4px) !important;
    border-bottom-right-radius: var(--borderRadius-small, 4px) !important;
  }
  .rounded-lg-right-2 {
    border-top-right-radius: var(--borderRadius-medium, 6px) !important;
    border-bottom-right-radius: var(--borderRadius-medium, 6px) !important;
  }
  .rounded-lg-right-3 {
    border-top-right-radius: var(--borderRadius-medium, 8px) !important;
    border-bottom-right-radius: var(--borderRadius-medium, 8px) !important;
  }
  .rounded-lg-bottom-0 {
    border-bottom-right-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
  }
  .rounded-lg-bottom-1 {
    border-bottom-right-radius: var(--borderRadius-small, 4px) !important;
    border-bottom-left-radius: var(--borderRadius-small, 4px) !important;
  }
  .rounded-lg-bottom-2 {
    border-bottom-right-radius: var(--borderRadius-medium, 6px) !important;
    border-bottom-left-radius: var(--borderRadius-medium, 6px) !important;
  }
  .rounded-lg-bottom-3 {
    border-bottom-right-radius: var(--borderRadius-medium, 8px) !important;
    border-bottom-left-radius: var(--borderRadius-medium, 8px) !important;
  }
  .rounded-lg-left-0 {
    border-bottom-left-radius: 0 !important;
    border-top-left-radius: 0 !important;
  }
  .rounded-lg-left-1 {
    border-bottom-left-radius: var(--borderRadius-small, 4px) !important;
    border-top-left-radius: var(--borderRadius-small, 4px) !important;
  }
  .rounded-lg-left-2 {
    border-bottom-left-radius: var(--borderRadius-medium, 6px) !important;
    border-top-left-radius: var(--borderRadius-medium, 6px) !important;
  }
  .rounded-lg-left-3 {
    border-bottom-left-radius: var(--borderRadius-medium, 8px) !important;
    border-top-left-radius: var(--borderRadius-medium, 8px) !important;
  }
}
@media (min-width: 1280px) {
  /* Add a gray border on all sides at/above this breakpoint */
  .border-xl {
    border: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
  }
  .border-xl-0 {
    border: 0 !important;
  }
  .border-xl-top {
    border-top: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
  }
  .border-xl-right {
    border-right: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
  }
  .border-xl-bottom {
    border-bottom: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
  }
  .border-xl-left {
    border-left: var(--borderWidth-thin, 1px) solid var(--borderColor-default, var(--color-border-default)) !important;
  }
  .border-xl-top-0 {
    border-top: 0 !important;
  }
  .border-xl-right-0 {
    border-right: 0 !important;
  }
  .border-xl-bottom-0 {
    border-bottom: 0 !important;
  }
  .border-xl-left-0 {
    border-left: 0 !important;
  }
  .rounded-xl {
    border-radius: var(--borderRadius-medium, 6px) !important;
  }
  .rounded-xl-0 {
    border-radius: 0 !important;
  }
  .rounded-xl-1 {
    border-radius: var(--borderRadius-small, 4px) !important;
  }
  .rounded-xl-2 {
    border-radius: var(--borderRadius-medium, 6px) !important;
  }
  .rounded-xl-3 {
    border-radius: var(--borderRadius-large, 8px) !important;
  }
  .rounded-xl-top-0 {
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
  }
  .rounded-xl-top-1 {
    border-top-left-radius: var(--borderRadius-small, 4px) !important;
    border-top-right-radius: var(--borderRadius-small, 4px) !important;
  }
  .rounded-xl-top-2 {
    border-top-left-radius: var(--borderRadius-medium, 6px) !important;
    border-top-right-radius: var(--borderRadius-medium, 6px) !important;
  }
  .rounded-xl-top-3 {
    border-top-left-radius: var(--borderRadius-medium, 8px) !important;
    border-top-right-radius: var(--borderRadius-medium, 8px) !important;
  }
  .rounded-xl-right-0 {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
  }
  .rounded-xl-right-1 {
    border-top-right-radius: var(--borderRadius-small, 4px) !important;
    border-bottom-right-radius: var(--borderRadius-small, 4px) !important;
  }
  .rounded-xl-right-2 {
    border-top-right-radius: var(--borderRadius-medium, 6px) !important;
    border-bottom-right-radius: var(--borderRadius-medium, 6px) !important;
  }
  .rounded-xl-right-3 {
    border-top-right-radius: var(--borderRadius-medium, 8px) !important;
    border-bottom-right-radius: var(--borderRadius-medium, 8px) !important;
  }
  .rounded-xl-bottom-0 {
    border-bottom-right-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
  }
  .rounded-xl-bottom-1 {
    border-bottom-right-radius: var(--borderRadius-small, 4px) !important;
    border-bottom-left-radius: var(--borderRadius-small, 4px) !important;
  }
  .rounded-xl-bottom-2 {
    border-bottom-right-radius: var(--borderRadius-medium, 6px) !important;
    border-bottom-left-radius: var(--borderRadius-medium, 6px) !important;
  }
  .rounded-xl-bottom-3 {
    border-bottom-right-radius: var(--borderRadius-medium, 8px) !important;
    border-bottom-left-radius: var(--borderRadius-medium, 8px) !important;
  }
  .rounded-xl-left-0 {
    border-bottom-left-radius: 0 !important;
    border-top-left-radius: 0 !important;
  }
  .rounded-xl-left-1 {
    border-bottom-left-radius: var(--borderRadius-small, 4px) !important;
    border-top-left-radius: var(--borderRadius-small, 4px) !important;
  }
  .rounded-xl-left-2 {
    border-bottom-left-radius: var(--borderRadius-medium, 6px) !important;
    border-top-left-radius: var(--borderRadius-medium, 6px) !important;
  }
  .rounded-xl-left-3 {
    border-bottom-left-radius: var(--borderRadius-medium, 8px) !important;
    border-top-left-radius: var(--borderRadius-medium, 8px) !important;
  }
}
/* Add a 50% border-radius to make something into a circle */
.circle {
  border-radius: var(--borderRadius-full, 50%) !important;
}

/* Change the border style to dashed, in conjunction with another utility */
.border-dashed {
  border-style: dashed !important;
}

.color-shadow-small {
  box-shadow: var(--shadow-resting-small, var(--color-shadow-small)) !important;
}

.color-shadow-medium {
  box-shadow: var(--shadow-resting-medium, var(--color-shadow-medium)) !important;
}

.color-shadow-large {
  box-shadow: var(--shadow-floating-large, var(--color-shadow-large)) !important;
}

.color-shadow-extra-large {
  box-shadow: var(--shadow-floating-xlarge, var(--color-shadow-extra-large)) !important;
}

.shadow-floating-small {
  box-shadow: var(--shadow-floating-small, var(--color-overlay-shadow)) !important;
}

.box-shadow-none {
  box-shadow: none !important;
}

.color-fg-default, .fgColor-default {
  color: var(--fgColor-default, var(--color-fg-default)) !important;
}

.color-fg-muted, .fgColor-muted {
  color: var(--fgColor-muted, var(--color-fg-muted)) !important;
}

.color-fg-subtle {
  color: var(--fgColor-muted, var(--color-fg-subtle)) !important;
}

.color-fg-accent, .fgColor-accent {
  color: var(--fgColor-accent, var(--color-accent-fg)) !important;
}

.color-fg-success, .fgColor-success {
  color: var(--fgColor-success, var(--color-success-fg)) !important;
}

.color-fg-attention, .fgColor-attention {
  color: var(--fgColor-attention, var(--color-attention-fg)) !important;
}

.color-fg-severe, .fgColor-severe {
  color: var(--fgColor-severe, var(--color-severe-fg)) !important;
}

.color-fg-danger, .fgColor-danger {
  color: var(--fgColor-danger, var(--color-danger-fg)) !important;
}

.color-fg-open, .fgColor-open {
  color: var(--fgColor-open, var(--color-open-fg)) !important;
}

.color-fg-closed, .fgColor-closed {
  color: var(--fgColor-closed, var(--color-closed-fg)) !important;
}

.color-fg-done, .fgColor-done {
  color: var(--fgColor-done, var(--color-done-fg)) !important;
}

.color-fg-sponsors, .fgColor-sponsors {
  color: var(--fgColor-sponsors, var(--color-sponsors-fg)) !important;
}

.color-fg-on-emphasis, .fgColor-onEmphasis {
  color: var(--fgColor-onEmphasis, var(--color-fg-on-emphasis)) !important;
}

.color-bg-default, .bgColor-default {
  background-color: var(--bgColor-default, var(--color-canvas-default)) !important;
}

.color-bg-overlay {
  background-color: var(--overlay-bgColor, var(--color-canvas-overlay)) !important;
}

.color-bg-inset, .bgColor-inset {
  background-color: var(--bgColor-inset, var(--color-canvas-inset)) !important;
}

.color-bg-subtle, .bgColor-muted {
  background-color: var(--bgColor-muted, var(--color-canvas-subtle)) !important;
}

.color-bg-emphasis, .bgColor-emphasis {
  background-color: var(--bgColor-emphasis, var(--color-neutral-emphasis-plus)) !important;
}

.color-bg-accent, .bgColor-accent-muted {
  background-color: var(--bgColor-accent-muted, var(--color-accent-subtle)) !important;
}

.color-bg-accent-emphasis, .bgColor-accent-emphasis {
  background-color: var(--bgColor-accent-emphasis, var(--color-accent-emphasis)) !important;
}

.color-bg-success, .bgColor-success-muted {
  background-color: var(--bgColor-success-muted, var(--color-success-subtle)) !important;
}

.color-bg-success-emphasis, .bgColor-success-emphasis {
  background-color: var(--bgColor-success-emphasis, var(--color-success-emphasis)) !important;
}

.color-bg-attention, .bgColor-attention-muted {
  background-color: var(--bgColor-attention-muted, var(--color-attention-subtle)) !important;
}

.color-bg-attention-emphasis, .bgColor-attention-emphasis {
  background-color: var(--bgColor-attention-emphasis, var(--color-attention-emphasis)) !important;
}

.color-bg-severe, .bgColor-severe-muted {
  background-color: var(--bgColor-severe-muted, var(--color-severe-subtle)) !important;
}

.color-bg-severe-emphasis, .bgColor-severe-emphasis {
  background-color: var(--bgColor-severe-emphasis, var(--color-severe-emphasis)) !important;
}

.color-bg-danger, .bgColor-danger-muted {
  background-color: var(--bgColor-danger-muted, var(--color-danger-subtle)) !important;
}

.color-bg-danger-emphasis, .bgColor-danger-emphasis {
  background-color: var(--bgColor-danger-emphasis, var(--color-danger-emphasis)) !important;
}

.color-bg-open, .bgColor-open-muted {
  background-color: var(--bgColor-open-muted, var(--color-open-subtle)) !important;
}

.color-bg-open-emphasis, .bgColor-open-emphasis {
  background-color: var(--bgColor-open-emphasis, var(--color-open-emphasis)) !important;
}

.color-bg-closed, .bgColor-closed-muted {
  background-color: var(--bgColor-closed-muted, var(--color-closed-subtle)) !important;
}

.color-bg-closed-emphasis, .bgColor-closed-emphasis {
  background-color: var(--bgColor-closed-emphasis, var(--color-closed-emphasis)) !important;
}

.color-bg-done, .bgColor-done-muted {
  background-color: var(--bgColor-done-muted, var(--color-done-subtle)) !important;
}

.color-bg-done-emphasis, .bgColor-done-emphasis {
  background-color: var(--bgColor-done-emphasis, var(--color-done-emphasis)) !important;
}

.color-bg-sponsors, .bgColor-sponsors-muted {
  background-color: var(--bgColor-sponsors-muted, var(--color-sponsors-subtle)) !important;
}

.color-bg-sponsors-emphasis, .bgColor-sponsors-emphasis {
  background-color: var(--bgColor-sponsors-emphasis, var(--color-sponsors-emphasis)) !important;
}

.color-bg-transparent, .bgColor-transparent {
  background-color: transparent !important;
}

.color-border-default, .borderColor-default {
  border-color: var(--borderColor-default, var(--color-border-default)) !important;
}

.color-border-muted, .borderColor-muted {
  border-color: var(--borderColor-muted, var(--color-border-muted)) !important;
}

.color-border-subtle {
  border-color: var(--borderColor-muted, var(--color-border-subtle)) !important;
}

.color-border-accent, .borderColor-accent-muted {
  border-color: var(--borderColor-accent-muted, var(--color-accent-muted)) !important;
}

.color-border-accent-emphasis, .borderColor-accent-emphasis {
  border-color: var(--borderColor-accent-emphasis, var(--color-accent-emphasis)) !important;
}

.color-border-success, .borderColor-success-muted {
  border-color: var(--borderColor-success-muted, var(--color-success-muted)) !important;
}

.color-border-success-emphasis, .borderColor-success-emphasis {
  border-color: var(--borderColor-success-emphasis, var(--color-success-emphasis)) !important;
}

.color-border-attention, .borderColor-attention-muted {
  border-color: var(--borderColor-attention-muted, var(--color-attention-muted)) !important;
}

.color-border-attention-emphasis, .borderColor-attention-emphasis {
  border-color: var(--borderColor-attention-emphasis, var(--color-attention-emphasis)) !important;
}

.color-border-severe, .borderColor-severe-muted {
  border-color: var(--borderColor-severe-muted, var(--color-severe-muted)) !important;
}

.color-border-severe-emphasis, .borderColor-severe-emphasis {
  border-color: var(--borderColor-severe-emphasis, var(--color-severe-emphasis)) !important;
}

.color-border-danger, .borderColor-danger-muted {
  border-color: var(--borderColor-danger-muted, var(--color-danger-muted)) !important;
}

.color-border-danger-emphasis, .borderColor-danger-emphasis {
  border-color: var(--borderColor-danger-emphasis, var(--color-danger-emphasis)) !important;
}

.color-border-open, .borderColor-open-muted {
  border-color: var(--borderColor-open-muted, var(--color-open-muted)) !important;
}

.color-border-open-emphasis, .borderColor-open-emphasis {
  border-color: var(--borderColor-open-emphasis, var(--color-open-emphasis)) !important;
}

.color-border-closed, .borderColor-closed-muted {
  border-color: var(--borderColor-closed-muted, var(--color-closed-muted)) !important;
}

.color-border-closed-emphasis, .borderColor-closed-emphasis {
  border-color: var(--borderColor-closed-emphasis, var(--color-closed-emphasis)) !important;
}

.color-border-done, .borderColor-done-muted {
  border-color: var(--borderColor-done-muted, var(--color-done-muted)) !important;
}

.color-border-done-emphasis, .borderColor-done-emphasis {
  border-color: var(--borderColor-done-emphasis, var(--color-done-emphasis)) !important;
}

.color-border-sponsors, .borderColor-sponsors-muted {
  border-color: var(--borderColor-sponsors-muted, var(--color-sponsors-muted)) !important;
}

.color-border-sponsors-emphasis, .borderColor-sponsors-emphasis {
  border-color: var(--borderColor-sponsors-emphasis, var(--color-sponsors-emphasis)) !important;
}

.color-fg-inherit, .fgColor-inherit {
  color: inherit !important;
}

.details-overlay[open] > summary::before {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 80;
  display: block;
  cursor: default;
  content: " ";
  background: transparent;
}

.details-overlay-dark[open] > summary::before {
  z-index: 111;
  background: var(--overlay-backdrop-bgColor, var(--color-primer-canvas-backdrop));
}

.details-reset > summary {
  list-style: none;
  transition: 80ms cubic-bezier(0.33, 1, 0.68, 1);
  transition-property: color, background-color, box-shadow, border-color;
}
.details-reset > summary:focus {
  outline: 2px solid var(--focus-outlineColor, var(--color-accent-fg));
  outline-offset: -2px;
  box-shadow: none;
}
.details-reset > summary:focus:not(:focus-visible) {
  outline: solid 1px transparent;
}
.details-reset > summary:focus-visible {
  outline: 2px solid var(--focus-outlineColor, var(--color-accent-fg));
  outline-offset: -2px;
  box-shadow: none;
}
.details-reset > summary.btn-primary:focus {
  outline: 2px solid var(--focus-outlineColor, var(--color-accent-fg));
  outline-offset: -2px;
  box-shadow: inset 0 0 0 3px var(--fgColor-onEmphasis, var(--color-fg-on-emphasis));
}
.details-reset > summary.btn-primary:focus:not(:focus-visible) {
  outline: solid 1px transparent;
  box-shadow: none;
}
.details-reset > summary.btn-primary:focus-visible {
  outline: 2px solid var(--focus-outlineColor, var(--color-accent-fg));
  outline-offset: -2px;
  box-shadow: inset 0 0 0 3px var(--fgColor-onEmphasis, var(--color-fg-on-emphasis));
}
.details-reset > summary::before {
  display: none;
}
.details-reset > summary::-webkit-details-marker {
  display: none;
}

.details-overlay > summary {
  transition: 80ms cubic-bezier(0.33, 1, 0.68, 1);
  transition-property: color, background-color, box-shadow, border-color;
}
.details-overlay > summary:focus {
  outline: 2px solid var(--focus-outlineColor, var(--color-accent-fg));
  outline-offset: -2px;
  box-shadow: none;
}
.details-overlay > summary:focus:not(:focus-visible) {
  outline: solid 1px transparent;
}
.details-overlay > summary:focus-visible {
  outline: 2px solid var(--focus-outlineColor, var(--color-accent-fg));
  outline-offset: -2px;
  box-shadow: none;
}
.details-overlay > summary.btn-primary:focus {
  outline: 2px solid var(--focus-outlineColor, var(--color-accent-fg));
  outline-offset: -2px;
  box-shadow: inset 0 0 0 3px var(--fgColor-onEmphasis, var(--color-fg-on-emphasis));
}
.details-overlay > summary.btn-primary:focus:not(:focus-visible) {
  outline: solid 1px transparent;
  box-shadow: none;
}
.details-overlay > summary.btn-primary:focus-visible {
  outline: 2px solid var(--focus-outlineColor, var(--color-accent-fg));
  outline-offset: -2px;
  box-shadow: inset 0 0 0 3px var(--fgColor-onEmphasis, var(--color-fg-on-emphasis));
}

.flex-row {
  flex-direction: row !important;
}

.flex-row-reverse {
  flex-direction: row-reverse !important;
}

.flex-column {
  flex-direction: column !important;
}

.flex-column-reverse {
  flex-direction: column-reverse !important;
}

.flex-wrap {
  flex-wrap: wrap !important;
}

.flex-nowrap {
  flex-wrap: nowrap !important;
}

.flex-wrap-reverse {
  flex-wrap: wrap-reverse !important;
}

.flex-justify-start {
  justify-content: flex-start !important;
}

.flex-justify-end {
  justify-content: flex-end !important;
}

.flex-justify-center {
  justify-content: center !important;
}

.flex-justify-between {
  justify-content: space-between !important;
}

.flex-justify-around {
  justify-content: space-around !important;
}

.flex-items-start {
  align-items: flex-start !important;
}

.flex-items-end {
  align-items: flex-end !important;
}

.flex-items-center {
  align-items: center !important;
}

.flex-items-baseline {
  align-items: baseline !important;
}

.flex-items-stretch {
  align-items: stretch !important;
}

.flex-content-start {
  align-content: flex-start !important;
}

.flex-content-end {
  align-content: flex-end !important;
}

.flex-content-center {
  align-content: center !important;
}

.flex-content-between {
  align-content: space-between !important;
}

.flex-content-around {
  align-content: space-around !important;
}

.flex-content-stretch {
  align-content: stretch !important;
}

.flex-1 {
  flex: 1 !important;
}

.flex-auto {
  flex: auto !important;
}

.flex-grow-0 {
  flex-grow: 0 !important;
}

.flex-shrink-0 {
  flex-shrink: 0 !important;
}

.flex-self-auto {
  align-self: auto !important;
}

.flex-self-start {
  align-self: flex-start !important;
}

.flex-self-end {
  align-self: flex-end !important;
}

.flex-self-center {
  align-self: center !important;
}

.flex-self-baseline {
  align-self: baseline !important;
}

.flex-self-stretch {
  align-self: stretch !important;
}

.flex-order-1 {
  order: 1 !important;
}

.flex-order-2 {
  order: 2 !important;
}

.flex-order-none {
  order: inherit !important;
}

@media (min-width: 544px) {
  .flex-sm-row {
    flex-direction: row !important;
  }
  .flex-sm-row-reverse {
    flex-direction: row-reverse !important;
  }
  .flex-sm-column {
    flex-direction: column !important;
  }
  .flex-sm-column-reverse {
    flex-direction: column-reverse !important;
  }
  .flex-sm-wrap {
    flex-wrap: wrap !important;
  }
  .flex-sm-nowrap {
    flex-wrap: nowrap !important;
  }
  .flex-sm-wrap-reverse {
    flex-wrap: wrap-reverse !important;
  }
  .flex-sm-justify-start {
    justify-content: flex-start !important;
  }
  .flex-sm-justify-end {
    justify-content: flex-end !important;
  }
  .flex-sm-justify-center {
    justify-content: center !important;
  }
  .flex-sm-justify-between {
    justify-content: space-between !important;
  }
  .flex-sm-justify-around {
    justify-content: space-around !important;
  }
  .flex-sm-items-start {
    align-items: flex-start !important;
  }
  .flex-sm-items-end {
    align-items: flex-end !important;
  }
  .flex-sm-items-center {
    align-items: center !important;
  }
  .flex-sm-items-baseline {
    align-items: baseline !important;
  }
  .flex-sm-items-stretch {
    align-items: stretch !important;
  }
  .flex-sm-content-start {
    align-content: flex-start !important;
  }
  .flex-sm-content-end {
    align-content: flex-end !important;
  }
  .flex-sm-content-center {
    align-content: center !important;
  }
  .flex-sm-content-between {
    align-content: space-between !important;
  }
  .flex-sm-content-around {
    align-content: space-around !important;
  }
  .flex-sm-content-stretch {
    align-content: stretch !important;
  }
  .flex-sm-1 {
    flex: 1 !important;
  }
  .flex-sm-auto {
    flex: auto !important;
  }
  .flex-sm-grow-0 {
    flex-grow: 0 !important;
  }
  .flex-sm-shrink-0 {
    flex-shrink: 0 !important;
  }
  .flex-sm-self-auto {
    align-self: auto !important;
  }
  .flex-sm-self-start {
    align-self: flex-start !important;
  }
  .flex-sm-self-end {
    align-self: flex-end !important;
  }
  .flex-sm-self-center {
    align-self: center !important;
  }
  .flex-sm-self-baseline {
    align-self: baseline !important;
  }
  .flex-sm-self-stretch {
    align-self: stretch !important;
  }
  .flex-sm-order-1 {
    order: 1 !important;
  }
  .flex-sm-order-2 {
    order: 2 !important;
  }
  .flex-sm-order-none {
    order: inherit !important;
  }
}
@media (min-width: 768px) {
  .flex-md-row {
    flex-direction: row !important;
  }
  .flex-md-row-reverse {
    flex-direction: row-reverse !important;
  }
  .flex-md-column {
    flex-direction: column !important;
  }
  .flex-md-column-reverse {
    flex-direction: column-reverse !important;
  }
  .flex-md-wrap {
    flex-wrap: wrap !important;
  }
  .flex-md-nowrap {
    flex-wrap: nowrap !important;
  }
  .flex-md-wrap-reverse {
    flex-wrap: wrap-reverse !important;
  }
  .flex-md-justify-start {
    justify-content: flex-start !important;
  }
  .flex-md-justify-end {
    justify-content: flex-end !important;
  }
  .flex-md-justify-center {
    justify-content: center !important;
  }
  .flex-md-justify-between {
    justify-content: space-between !important;
  }
  .flex-md-justify-around {
    justify-content: space-around !important;
  }
  .flex-md-items-start {
    align-items: flex-start !important;
  }
  .flex-md-items-end {
    align-items: flex-end !important;
  }
  .flex-md-items-center {
    align-items: center !important;
  }
  .flex-md-items-baseline {
    align-items: baseline !important;
  }
  .flex-md-items-stretch {
    align-items: stretch !important;
  }
  .flex-md-content-start {
    align-content: flex-start !important;
  }
  .flex-md-content-end {
    align-content: flex-end !important;
  }
  .flex-md-content-center {
    align-content: center !important;
  }
  .flex-md-content-between {
    align-content: space-between !important;
  }
  .flex-md-content-around {
    align-content: space-around !important;
  }
  .flex-md-content-stretch {
    align-content: stretch !important;
  }
  .flex-md-1 {
    flex: 1 !important;
  }
  .flex-md-auto {
    flex: auto !important;
  }
  .flex-md-grow-0 {
    flex-grow: 0 !important;
  }
  .flex-md-shrink-0 {
    flex-shrink: 0 !important;
  }
  .flex-md-self-auto {
    align-self: auto !important;
  }
  .flex-md-self-start {
    align-self: flex-start !important;
  }
  .flex-md-self-end {
    align-self: flex-end !important;
  }
  .flex-md-self-center {
    align-self: center !important;
  }
  .flex-md-self-baseline {
    align-self: baseline !important;
  }
  .flex-md-self-stretch {
    align-self: stretch !important;
  }
  .flex-md-order-1 {
    order: 1 !important;
  }
  .flex-md-order-2 {
    order: 2 !important;
  }
  .flex-md-order-none {
    order: inherit !important;
  }
}
@media (min-width: 1012px) {
  .flex-lg-row {
    flex-direction: row !important;
  }
  .flex-lg-row-reverse {
    flex-direction: row-reverse !important;
  }
  .flex-lg-column {
    flex-direction: column !important;
  }
  .flex-lg-column-reverse {
    flex-direction: column-reverse !important;
  }
  .flex-lg-wrap {
    flex-wrap: wrap !important;
  }
  .flex-lg-nowrap {
    flex-wrap: nowrap !important;
  }
  .flex-lg-wrap-reverse {
    flex-wrap: wrap-reverse !important;
  }
  .flex-lg-justify-start {
    justify-content: flex-start !important;
  }
  .flex-lg-justify-end {
    justify-content: flex-end !important;
  }
  .flex-lg-justify-center {
    justify-content: center !important;
  }
  .flex-lg-justify-between {
    justify-content: space-between !important;
  }
  .flex-lg-justify-around {
    justify-content: space-around !important;
  }
  .flex-lg-items-start {
    align-items: flex-start !important;
  }
  .flex-lg-items-end {
    align-items: flex-end !important;
  }
  .flex-lg-items-center {
    align-items: center !important;
  }
  .flex-lg-items-baseline {
    align-items: baseline !important;
  }
  .flex-lg-items-stretch {
    align-items: stretch !important;
  }
  .flex-lg-content-start {
    align-content: flex-start !important;
  }
  .flex-lg-content-end {
    align-content: flex-end !important;
  }
  .flex-lg-content-center {
    align-content: center !important;
  }
  .flex-lg-content-between {
    align-content: space-between !important;
  }
  .flex-lg-content-around {
    align-content: space-around !important;
  }
  .flex-lg-content-stretch {
    align-content: stretch !important;
  }
  .flex-lg-1 {
    flex: 1 !important;
  }
  .flex-lg-auto {
    flex: auto !important;
  }
  .flex-lg-grow-0 {
    flex-grow: 0 !important;
  }
  .flex-lg-shrink-0 {
    flex-shrink: 0 !important;
  }
  .flex-lg-self-auto {
    align-self: auto !important;
  }
  .flex-lg-self-start {
    align-self: flex-start !important;
  }
  .flex-lg-self-end {
    align-self: flex-end !important;
  }
  .flex-lg-self-center {
    align-self: center !important;
  }
  .flex-lg-self-baseline {
    align-self: baseline !important;
  }
  .flex-lg-self-stretch {
    align-self: stretch !important;
  }
  .flex-lg-order-1 {
    order: 1 !important;
  }
  .flex-lg-order-2 {
    order: 2 !important;
  }
  .flex-lg-order-none {
    order: inherit !important;
  }
}
@media (min-width: 1280px) {
  .flex-xl-row {
    flex-direction: row !important;
  }
  .flex-xl-row-reverse {
    flex-direction: row-reverse !important;
  }
  .flex-xl-column {
    flex-direction: column !important;
  }
  .flex-xl-column-reverse {
    flex-direction: column-reverse !important;
  }
  .flex-xl-wrap {
    flex-wrap: wrap !important;
  }
  .flex-xl-nowrap {
    flex-wrap: nowrap !important;
  }
  .flex-xl-wrap-reverse {
    flex-wrap: wrap-reverse !important;
  }
  .flex-xl-justify-start {
    justify-content: flex-start !important;
  }
  .flex-xl-justify-end {
    justify-content: flex-end !important;
  }
  .flex-xl-justify-center {
    justify-content: center !important;
  }
  .flex-xl-justify-between {
    justify-content: space-between !important;
  }
  .flex-xl-justify-around {
    justify-content: space-around !important;
  }
  .flex-xl-items-start {
    align-items: flex-start !important;
  }
  .flex-xl-items-end {
    align-items: flex-end !important;
  }
  .flex-xl-items-center {
    align-items: center !important;
  }
  .flex-xl-items-baseline {
    align-items: baseline !important;
  }
  .flex-xl-items-stretch {
    align-items: stretch !important;
  }
  .flex-xl-content-start {
    align-content: flex-start !important;
  }
  .flex-xl-content-end {
    align-content: flex-end !important;
  }
  .flex-xl-content-center {
    align-content: center !important;
  }
  .flex-xl-content-between {
    align-content: space-between !important;
  }
  .flex-xl-content-around {
    align-content: space-around !important;
  }
  .flex-xl-content-stretch {
    align-content: stretch !important;
  }
  .flex-xl-1 {
    flex: 1 !important;
  }
  .flex-xl-auto {
    flex: auto !important;
  }
  .flex-xl-grow-0 {
    flex-grow: 0 !important;
  }
  .flex-xl-shrink-0 {
    flex-shrink: 0 !important;
  }
  .flex-xl-self-auto {
    align-self: auto !important;
  }
  .flex-xl-self-start {
    align-self: flex-start !important;
  }
  .flex-xl-self-end {
    align-self: flex-end !important;
  }
  .flex-xl-self-center {
    align-self: center !important;
  }
  .flex-xl-self-baseline {
    align-self: baseline !important;
  }
  .flex-xl-self-stretch {
    align-self: stretch !important;
  }
  .flex-xl-order-1 {
    order: 1 !important;
  }
  .flex-xl-order-2 {
    order: 2 !important;
  }
  .flex-xl-order-none {
    order: inherit !important;
  }
}
/* Position */
.position-static {
  position: static !important;
}

.position-relative {
  position: relative !important;
}

.position-absolute {
  position: absolute !important;
}

.position-fixed {
  position: fixed !important;
}

.position-sticky {
  position: sticky !important;
}

@media (min-width: 544px) {
  .position-sm-static {
    position: static !important;
  }
  .position-sm-relative {
    position: relative !important;
  }
  .position-sm-absolute {
    position: absolute !important;
  }
  .position-sm-fixed {
    position: fixed !important;
  }
  .position-sm-sticky {
    position: sticky !important;
  }
}
@media (min-width: 768px) {
  .position-md-static {
    position: static !important;
  }
  .position-md-relative {
    position: relative !important;
  }
  .position-md-absolute {
    position: absolute !important;
  }
  .position-md-fixed {
    position: fixed !important;
  }
  .position-md-sticky {
    position: sticky !important;
  }
}
@media (min-width: 1012px) {
  .position-lg-static {
    position: static !important;
  }
  .position-lg-relative {
    position: relative !important;
  }
  .position-lg-absolute {
    position: absolute !important;
  }
  .position-lg-fixed {
    position: fixed !important;
  }
  .position-lg-sticky {
    position: sticky !important;
  }
}
@media (min-width: 1280px) {
  .position-xl-static {
    position: static !important;
  }
  .position-xl-relative {
    position: relative !important;
  }
  .position-xl-absolute {
    position: absolute !important;
  }
  .position-xl-fixed {
    position: fixed !important;
  }
  .position-xl-sticky {
    position: sticky !important;
  }
}
/* Final position */
.top-0 {
  top: 0 !important;
}

.right-0 {
  right: 0 !important;
}

.bottom-0 {
  bottom: 0 !important;
}

.left-0 {
  left: 0 !important;
}

.top-auto {
  top: auto !important;
}

.right-auto {
  right: auto !important;
}

.bottom-auto {
  bottom: auto !important;
}

.left-auto {
  left: auto !important;
}

@media (min-width: 544px) {
  .top-sm-0 {
    top: 0 !important;
  }
  .right-sm-0 {
    right: 0 !important;
  }
  .bottom-sm-0 {
    bottom: 0 !important;
  }
  .left-sm-0 {
    left: 0 !important;
  }
  .top-sm-auto {
    top: auto !important;
  }
  .right-sm-auto {
    right: auto !important;
  }
  .bottom-sm-auto {
    bottom: auto !important;
  }
  .left-sm-auto {
    left: auto !important;
  }
}
@media (min-width: 768px) {
  .top-md-0 {
    top: 0 !important;
  }
  .right-md-0 {
    right: 0 !important;
  }
  .bottom-md-0 {
    bottom: 0 !important;
  }
  .left-md-0 {
    left: 0 !important;
  }
  .top-md-auto {
    top: auto !important;
  }
  .right-md-auto {
    right: auto !important;
  }
  .bottom-md-auto {
    bottom: auto !important;
  }
  .left-md-auto {
    left: auto !important;
  }
}
@media (min-width: 1012px) {
  .top-lg-0 {
    top: 0 !important;
  }
  .right-lg-0 {
    right: 0 !important;
  }
  .bottom-lg-0 {
    bottom: 0 !important;
  }
  .left-lg-0 {
    left: 0 !important;
  }
  .top-lg-auto {
    top: auto !important;
  }
  .right-lg-auto {
    right: auto !important;
  }
  .bottom-lg-auto {
    bottom: auto !important;
  }
  .left-lg-auto {
    left: auto !important;
  }
}
@media (min-width: 1280px) {
  .top-xl-0 {
    top: 0 !important;
  }
  .right-xl-0 {
    right: 0 !important;
  }
  .bottom-xl-0 {
    bottom: 0 !important;
  }
  .left-xl-0 {
    left: 0 !important;
  }
  .top-xl-auto {
    top: auto !important;
  }
  .right-xl-auto {
    right: auto !important;
  }
  .bottom-xl-auto {
    bottom: auto !important;
  }
  .left-xl-auto {
    left: auto !important;
  }
}
/* Vertical align middle */
.v-align-middle {
  vertical-align: middle !important;
}

/* Vertical align top */
.v-align-top {
  vertical-align: top !important;
}

/* Vertical align bottom */
.v-align-bottom {
  vertical-align: bottom !important;
}

/* Vertical align to the top of the text */
.v-align-text-top {
  vertical-align: text-top !important;
}

/* Vertical align to the bottom of the text */
.v-align-text-bottom {
  vertical-align: text-bottom !important;
}

/* Vertical align to the parent's baseline */
.v-align-baseline {
  vertical-align: baseline !important;
}

.overflow-visible {
  overflow: visible !important;
}

.overflow-x-visible {
  overflow-x: visible !important;
}

.overflow-y-visible {
  overflow-y: visible !important;
}

.overflow-hidden {
  overflow: hidden !important;
}

.overflow-x-hidden {
  overflow-x: hidden !important;
}

.overflow-y-hidden {
  overflow-y: hidden !important;
}

.overflow-auto {
  overflow: auto !important;
}

.overflow-x-auto {
  overflow-x: auto !important;
}

.overflow-y-auto {
  overflow-y: auto !important;
}

.overflow-scroll {
  overflow: scroll !important;
}

.overflow-x-scroll {
  overflow-x: scroll !important;
}

.overflow-y-scroll {
  overflow-y: scroll !important;
}

@media (min-width: 544px) {
  .overflow-sm-visible {
    overflow: visible !important;
  }
  .overflow-sm-x-visible {
    overflow-x: visible !important;
  }
  .overflow-sm-y-visible {
    overflow-y: visible !important;
  }
  .overflow-sm-hidden {
    overflow: hidden !important;
  }
  .overflow-sm-x-hidden {
    overflow-x: hidden !important;
  }
  .overflow-sm-y-hidden {
    overflow-y: hidden !important;
  }
  .overflow-sm-auto {
    overflow: auto !important;
  }
  .overflow-sm-x-auto {
    overflow-x: auto !important;
  }
  .overflow-sm-y-auto {
    overflow-y: auto !important;
  }
  .overflow-sm-scroll {
    overflow: scroll !important;
  }
  .overflow-sm-x-scroll {
    overflow-x: scroll !important;
  }
  .overflow-sm-y-scroll {
    overflow-y: scroll !important;
  }
}
@media (min-width: 768px) {
  .overflow-md-visible {
    overflow: visible !important;
  }
  .overflow-md-x-visible {
    overflow-x: visible !important;
  }
  .overflow-md-y-visible {
    overflow-y: visible !important;
  }
  .overflow-md-hidden {
    overflow: hidden !important;
  }
  .overflow-md-x-hidden {
    overflow-x: hidden !important;
  }
  .overflow-md-y-hidden {
    overflow-y: hidden !important;
  }
  .overflow-md-auto {
    overflow: auto !important;
  }
  .overflow-md-x-auto {
    overflow-x: auto !important;
  }
  .overflow-md-y-auto {
    overflow-y: auto !important;
  }
  .overflow-md-scroll {
    overflow: scroll !important;
  }
  .overflow-md-x-scroll {
    overflow-x: scroll !important;
  }
  .overflow-md-y-scroll {
    overflow-y: scroll !important;
  }
}
@media (min-width: 1012px) {
  .overflow-lg-visible {
    overflow: visible !important;
  }
  .overflow-lg-x-visible {
    overflow-x: visible !important;
  }
  .overflow-lg-y-visible {
    overflow-y: visible !important;
  }
  .overflow-lg-hidden {
    overflow: hidden !important;
  }
  .overflow-lg-x-hidden {
    overflow-x: hidden !important;
  }
  .overflow-lg-y-hidden {
    overflow-y: hidden !important;
  }
  .overflow-lg-auto {
    overflow: auto !important;
  }
  .overflow-lg-x-auto {
    overflow-x: auto !important;
  }
  .overflow-lg-y-auto {
    overflow-y: auto !important;
  }
  .overflow-lg-scroll {
    overflow: scroll !important;
  }
  .overflow-lg-x-scroll {
    overflow-x: scroll !important;
  }
  .overflow-lg-y-scroll {
    overflow-y: scroll !important;
  }
}
@media (min-width: 1280px) {
  .overflow-xl-visible {
    overflow: visible !important;
  }
  .overflow-xl-x-visible {
    overflow-x: visible !important;
  }
  .overflow-xl-y-visible {
    overflow-y: visible !important;
  }
  .overflow-xl-hidden {
    overflow: hidden !important;
  }
  .overflow-xl-x-hidden {
    overflow-x: hidden !important;
  }
  .overflow-xl-y-hidden {
    overflow-y: hidden !important;
  }
  .overflow-xl-auto {
    overflow: auto !important;
  }
  .overflow-xl-x-auto {
    overflow-x: auto !important;
  }
  .overflow-xl-y-auto {
    overflow-y: auto !important;
  }
  .overflow-xl-scroll {
    overflow: scroll !important;
  }
  .overflow-xl-x-scroll {
    overflow-x: scroll !important;
  }
  .overflow-xl-y-scroll {
    overflow-y: scroll !important;
  }
}
/* Clear floats around the element */
.clearfix::before {
  display: table;
  content: "";
}
.clearfix::after {
  display: table;
  clear: both;
  content: "";
}

/* Float to the left */
.float-left {
  float: left !important;
}

/* Float to the right */
.float-right {
  float: right !important;
}

/* No float */
.float-none {
  float: none !important;
}

@media (min-width: 544px) {
  /* Float to the left */
  .float-sm-left {
    float: left !important;
  }
  /* Float to the right */
  .float-sm-right {
    float: right !important;
  }
  /* No float */
  .float-sm-none {
    float: none !important;
  }
}
@media (min-width: 768px) {
  /* Float to the left */
  .float-md-left {
    float: left !important;
  }
  /* Float to the right */
  .float-md-right {
    float: right !important;
  }
  /* No float */
  .float-md-none {
    float: none !important;
  }
}
@media (min-width: 1012px) {
  /* Float to the left */
  .float-lg-left {
    float: left !important;
  }
  /* Float to the right */
  .float-lg-right {
    float: right !important;
  }
  /* No float */
  .float-lg-none {
    float: none !important;
  }
}
@media (min-width: 1280px) {
  /* Float to the left */
  .float-xl-left {
    float: left !important;
  }
  /* Float to the right */
  .float-xl-right {
    float: right !important;
  }
  /* No float */
  .float-xl-none {
    float: none !important;
  }
}
/* Max width 100% */
.width-fit {
  max-width: 100% !important;
}

/* Set the width to 100% */
.width-full {
  width: 100% !important;
}

/* Set the max-width to 65 characters */
.width-comfortable {
  max-width: 65ch !important;
}

/* Max height 100% */
.height-fit {
  max-height: 100% !important;
}

/* Set the height to 100% */
.height-full {
  height: 100% !important;
}

/* Remove min-width from element */
.min-width-0 {
  min-width: 0 !important;
}

.width-auto {
  width: auto !important;
}

/* Set the direction to rtl */
.direction-rtl {
  direction: rtl !important;
}

/* Set the direction to ltr */
.direction-ltr {
  direction: ltr !important;
}

@media (min-width: 544px) {
  .width-sm-auto {
    width: auto !important;
  }
  /* Set the direction to rtl */
  .direction-sm-rtl {
    direction: rtl !important;
  }
  /* Set the direction to ltr */
  .direction-sm-ltr {
    direction: ltr !important;
  }
}
@media (min-width: 768px) {
  .width-md-auto {
    width: auto !important;
  }
  /* Set the direction to rtl */
  .direction-md-rtl {
    direction: rtl !important;
  }
  /* Set the direction to ltr */
  .direction-md-ltr {
    direction: ltr !important;
  }
}
@media (min-width: 1012px) {
  .width-lg-auto {
    width: auto !important;
  }
  /* Set the direction to rtl */
  .direction-lg-rtl {
    direction: rtl !important;
  }
  /* Set the direction to ltr */
  .direction-lg-ltr {
    direction: ltr !important;
  }
}
@media (min-width: 1280px) {
  .width-xl-auto {
    width: auto !important;
  }
  /* Set the direction to rtl */
  .direction-xl-rtl {
    direction: rtl !important;
  }
  /* Set the direction to ltr */
  .direction-xl-ltr {
    direction: ltr !important;
  }
}
/* Set a $size margin to all sides at $breakpoint */
.m-0 {
  margin: 0 !important;
}

/* Set a $size margin on the top at $breakpoint */
.mt-0 {
  margin-top: 0 !important;
}

/* Set a $size margin on the bottom at $breakpoint */
.mb-0 {
  margin-bottom: 0 !important;
}

/* Set a $size margin on the right at $breakpoint */
.mr-0 {
  margin-right: 0 !important;
}

/* Set a $size margin on the left at $breakpoint */
.ml-0 {
  margin-left: 0 !important;
}

/* Set a $size margin on the left & right at $breakpoint */
.mx-0 {
  margin-right: 0 !important;
  margin-left: 0 !important;
}

/* Set a $size margin on the top & bottom at $breakpoint */
.my-0 {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Set a $size margin to all sides at $breakpoint */
.m-1 {
  margin: var(--base-size-4, 4px) !important;
}

/* Set a $size margin on the top at $breakpoint */
.mt-1 {
  margin-top: var(--base-size-4, 4px) !important;
}

/* Set a $size margin on the bottom at $breakpoint */
.mb-1 {
  margin-bottom: var(--base-size-4, 4px) !important;
}

/* Set a $size margin on the right at $breakpoint */
.mr-1 {
  margin-right: var(--base-size-4, 4px) !important;
}

/* Set a $size margin on the left at $breakpoint */
.ml-1 {
  margin-left: var(--base-size-4, 4px) !important;
}

/* Set a negative $size margin on top at $breakpoint */
.mt-n1 {
  margin-top: calc(-1 * var(--base-size-4, 4px)) !important;
}

/* Set a negative $size margin on the bottom at $breakpoint */
.mb-n1 {
  margin-bottom: calc(-1 * var(--base-size-4, 4px)) !important;
}

/* Set a negative $size margin on the right at $breakpoint */
.mr-n1 {
  margin-right: calc(-1 * var(--base-size-4, 4px)) !important;
}

/* Set a negative $size margin on the left at $breakpoint */
.ml-n1 {
  margin-left: calc(-1 * var(--base-size-4, 4px)) !important;
}

/* Set a $size margin on the left & right at $breakpoint */
.mx-1 {
  margin-right: var(--base-size-4, 4px) !important;
  margin-left: var(--base-size-4, 4px) !important;
}

/* Set a $size margin on the top & bottom at $breakpoint */
.my-1 {
  margin-top: var(--base-size-4, 4px) !important;
  margin-bottom: var(--base-size-4, 4px) !important;
}

/* Set a $size margin to all sides at $breakpoint */
.m-2 {
  margin: var(--base-size-8, 8px) !important;
}

/* Set a $size margin on the top at $breakpoint */
.mt-2 {
  margin-top: var(--base-size-8, 8px) !important;
}

/* Set a $size margin on the bottom at $breakpoint */
.mb-2 {
  margin-bottom: var(--base-size-8, 8px) !important;
}

/* Set a $size margin on the right at $breakpoint */
.mr-2 {
  margin-right: var(--base-size-8, 8px) !important;
}

/* Set a $size margin on the left at $breakpoint */
.ml-2 {
  margin-left: var(--base-size-8, 8px) !important;
}

/* Set a negative $size margin on top at $breakpoint */
.mt-n2 {
  margin-top: calc(-1 * var(--base-size-8, 8px)) !important;
}

/* Set a negative $size margin on the bottom at $breakpoint */
.mb-n2 {
  margin-bottom: calc(-1 * var(--base-size-8, 8px)) !important;
}

/* Set a negative $size margin on the right at $breakpoint */
.mr-n2 {
  margin-right: calc(-1 * var(--base-size-8, 8px)) !important;
}

/* Set a negative $size margin on the left at $breakpoint */
.ml-n2 {
  margin-left: calc(-1 * var(--base-size-8, 8px)) !important;
}

/* Set a $size margin on the left & right at $breakpoint */
.mx-2 {
  margin-right: var(--base-size-8, 8px) !important;
  margin-left: var(--base-size-8, 8px) !important;
}

/* Set a $size margin on the top & bottom at $breakpoint */
.my-2 {
  margin-top: var(--base-size-8, 8px) !important;
  margin-bottom: var(--base-size-8, 8px) !important;
}

/* Set a $size margin to all sides at $breakpoint */
.m-3 {
  margin: var(--base-size-16, 16px) !important;
}

/* Set a $size margin on the top at $breakpoint */
.mt-3 {
  margin-top: var(--base-size-16, 16px) !important;
}

/* Set a $size margin on the bottom at $breakpoint */
.mb-3 {
  margin-bottom: var(--base-size-16, 16px) !important;
}

/* Set a $size margin on the right at $breakpoint */
.mr-3 {
  margin-right: var(--base-size-16, 16px) !important;
}

/* Set a $size margin on the left at $breakpoint */
.ml-3 {
  margin-left: var(--base-size-16, 16px) !important;
}

/* Set a negative $size margin on top at $breakpoint */
.mt-n3 {
  margin-top: calc(-1 * var(--base-size-16, 16px)) !important;
}

/* Set a negative $size margin on the bottom at $breakpoint */
.mb-n3 {
  margin-bottom: calc(-1 * var(--base-size-16, 16px)) !important;
}

/* Set a negative $size margin on the right at $breakpoint */
.mr-n3 {
  margin-right: calc(-1 * var(--base-size-16, 16px)) !important;
}

/* Set a negative $size margin on the left at $breakpoint */
.ml-n3 {
  margin-left: calc(-1 * var(--base-size-16, 16px)) !important;
}

/* Set a $size margin on the left & right at $breakpoint */
.mx-3 {
  margin-right: var(--base-size-16, 16px) !important;
  margin-left: var(--base-size-16, 16px) !important;
}

/* Set a $size margin on the top & bottom at $breakpoint */
.my-3 {
  margin-top: var(--base-size-16, 16px) !important;
  margin-bottom: var(--base-size-16, 16px) !important;
}

/* Set a $size margin to all sides at $breakpoint */
.m-4 {
  margin: var(--base-size-24, 24px) !important;
}

/* Set a $size margin on the top at $breakpoint */
.mt-4 {
  margin-top: var(--base-size-24, 24px) !important;
}

/* Set a $size margin on the bottom at $breakpoint */
.mb-4 {
  margin-bottom: var(--base-size-24, 24px) !important;
}

/* Set a $size margin on the right at $breakpoint */
.mr-4 {
  margin-right: var(--base-size-24, 24px) !important;
}

/* Set a $size margin on the left at $breakpoint */
.ml-4 {
  margin-left: var(--base-size-24, 24px) !important;
}

/* Set a negative $size margin on top at $breakpoint */
.mt-n4 {
  margin-top: calc(-1 * var(--base-size-24, 24px)) !important;
}

/* Set a negative $size margin on the bottom at $breakpoint */
.mb-n4 {
  margin-bottom: calc(-1 * var(--base-size-24, 24px)) !important;
}

/* Set a negative $size margin on the right at $breakpoint */
.mr-n4 {
  margin-right: calc(-1 * var(--base-size-24, 24px)) !important;
}

/* Set a negative $size margin on the left at $breakpoint */
.ml-n4 {
  margin-left: calc(-1 * var(--base-size-24, 24px)) !important;
}

/* Set a $size margin on the left & right at $breakpoint */
.mx-4 {
  margin-right: var(--base-size-24, 24px) !important;
  margin-left: var(--base-size-24, 24px) !important;
}

/* Set a $size margin on the top & bottom at $breakpoint */
.my-4 {
  margin-top: var(--base-size-24, 24px) !important;
  margin-bottom: var(--base-size-24, 24px) !important;
}

/* Set a $size margin to all sides at $breakpoint */
.m-5 {
  margin: var(--base-size-32, 32px) !important;
}

/* Set a $size margin on the top at $breakpoint */
.mt-5 {
  margin-top: var(--base-size-32, 32px) !important;
}

/* Set a $size margin on the bottom at $breakpoint */
.mb-5 {
  margin-bottom: var(--base-size-32, 32px) !important;
}

/* Set a $size margin on the right at $breakpoint */
.mr-5 {
  margin-right: var(--base-size-32, 32px) !important;
}

/* Set a $size margin on the left at $breakpoint */
.ml-5 {
  margin-left: var(--base-size-32, 32px) !important;
}

/* Set a negative $size margin on top at $breakpoint */
.mt-n5 {
  margin-top: calc(-1 * var(--base-size-32, 32px)) !important;
}

/* Set a negative $size margin on the bottom at $breakpoint */
.mb-n5 {
  margin-bottom: calc(-1 * var(--base-size-32, 32px)) !important;
}

/* Set a negative $size margin on the right at $breakpoint */
.mr-n5 {
  margin-right: calc(-1 * var(--base-size-32, 32px)) !important;
}

/* Set a negative $size margin on the left at $breakpoint */
.ml-n5 {
  margin-left: calc(-1 * var(--base-size-32, 32px)) !important;
}

/* Set a $size margin on the left & right at $breakpoint */
.mx-5 {
  margin-right: var(--base-size-32, 32px) !important;
  margin-left: var(--base-size-32, 32px) !important;
}

/* Set a $size margin on the top & bottom at $breakpoint */
.my-5 {
  margin-top: var(--base-size-32, 32px) !important;
  margin-bottom: var(--base-size-32, 32px) !important;
}

/* Set a $size margin to all sides at $breakpoint */
.m-6 {
  margin: var(--base-size-40, 40px) !important;
}

/* Set a $size margin on the top at $breakpoint */
.mt-6 {
  margin-top: var(--base-size-40, 40px) !important;
}

/* Set a $size margin on the bottom at $breakpoint */
.mb-6 {
  margin-bottom: var(--base-size-40, 40px) !important;
}

/* Set a $size margin on the right at $breakpoint */
.mr-6 {
  margin-right: var(--base-size-40, 40px) !important;
}

/* Set a $size margin on the left at $breakpoint */
.ml-6 {
  margin-left: var(--base-size-40, 40px) !important;
}

/* Set a negative $size margin on top at $breakpoint */
.mt-n6 {
  margin-top: calc(-1 * var(--base-size-40, 40px)) !important;
}

/* Set a negative $size margin on the bottom at $breakpoint */
.mb-n6 {
  margin-bottom: calc(-1 * var(--base-size-40, 40px)) !important;
}

/* Set a negative $size margin on the right at $breakpoint */
.mr-n6 {
  margin-right: calc(-1 * var(--base-size-40, 40px)) !important;
}

/* Set a negative $size margin on the left at $breakpoint */
.ml-n6 {
  margin-left: calc(-1 * var(--base-size-40, 40px)) !important;
}

/* Set a $size margin on the left & right at $breakpoint */
.mx-6 {
  margin-right: var(--base-size-40, 40px) !important;
  margin-left: var(--base-size-40, 40px) !important;
}

/* Set a $size margin on the top & bottom at $breakpoint */
.my-6 {
  margin-top: var(--base-size-40, 40px) !important;
  margin-bottom: var(--base-size-40, 40px) !important;
}

/* Set a $size margin on the top at $breakpoint */
.mt-7 {
  margin-top: var(--base-size-48, 48px) !important;
}

/* Set a $size margin on the bottom at $breakpoint */
.mb-7 {
  margin-bottom: var(--base-size-48, 48px) !important;
}

/* Set a negative $size margin on top at $breakpoint */
.mt-n7 {
  margin-top: calc(-1 * var(--base-size-48, 48px)) !important;
}

/* Set a negative $size margin on the bottom at $breakpoint */
.mb-n7 {
  margin-bottom: calc(-1 * var(--base-size-48, 48px)) !important;
}

/* Set a $size margin on the top & bottom at $breakpoint */
.my-7 {
  margin-top: var(--base-size-48, 48px) !important;
  margin-bottom: var(--base-size-48, 48px) !important;
}

/* Set a $size margin on the top at $breakpoint */
.mt-8 {
  margin-top: var(--base-size-64, 64px) !important;
}

/* Set a $size margin on the bottom at $breakpoint */
.mb-8 {
  margin-bottom: var(--base-size-64, 64px) !important;
}

/* Set a negative $size margin on top at $breakpoint */
.mt-n8 {
  margin-top: calc(-1 * var(--base-size-64, 64px)) !important;
}

/* Set a negative $size margin on the bottom at $breakpoint */
.mb-n8 {
  margin-bottom: calc(-1 * var(--base-size-64, 64px)) !important;
}

/* Set a $size margin on the top & bottom at $breakpoint */
.my-8 {
  margin-top: var(--base-size-64, 64px) !important;
  margin-bottom: var(--base-size-64, 64px) !important;
}

/* Set a $size margin on the top at $breakpoint */
.mt-9 {
  margin-top: var(--base-size-80, 80px) !important;
}

/* Set a $size margin on the bottom at $breakpoint */
.mb-9 {
  margin-bottom: var(--base-size-80, 80px) !important;
}

/* Set a negative $size margin on top at $breakpoint */
.mt-n9 {
  margin-top: calc(-1 * var(--base-size-80, 80px)) !important;
}

/* Set a negative $size margin on the bottom at $breakpoint */
.mb-n9 {
  margin-bottom: calc(-1 * var(--base-size-80, 80px)) !important;
}

/* Set a $size margin on the top & bottom at $breakpoint */
.my-9 {
  margin-top: var(--base-size-80, 80px) !important;
  margin-bottom: var(--base-size-80, 80px) !important;
}

/* Set a $size margin on the top at $breakpoint */
.mt-10 {
  margin-top: var(--base-size-96, 96px) !important;
}

/* Set a $size margin on the bottom at $breakpoint */
.mb-10 {
  margin-bottom: var(--base-size-96, 96px) !important;
}

/* Set a negative $size margin on top at $breakpoint */
.mt-n10 {
  margin-top: calc(-1 * var(--base-size-96, 96px)) !important;
}

/* Set a negative $size margin on the bottom at $breakpoint */
.mb-n10 {
  margin-bottom: calc(-1 * var(--base-size-96, 96px)) !important;
}

/* Set a $size margin on the top & bottom at $breakpoint */
.my-10 {
  margin-top: var(--base-size-96, 96px) !important;
  margin-bottom: var(--base-size-96, 96px) !important;
}

/* Set a $size margin on the top at $breakpoint */
.mt-11 {
  margin-top: var(--base-size-112, 112px) !important;
}

/* Set a $size margin on the bottom at $breakpoint */
.mb-11 {
  margin-bottom: var(--base-size-112, 112px) !important;
}

/* Set a negative $size margin on top at $breakpoint */
.mt-n11 {
  margin-top: calc(-1 * var(--base-size-112, 112px)) !important;
}

/* Set a negative $size margin on the bottom at $breakpoint */
.mb-n11 {
  margin-bottom: calc(-1 * var(--base-size-112, 112px)) !important;
}

/* Set a $size margin on the top & bottom at $breakpoint */
.my-11 {
  margin-top: var(--base-size-112, 112px) !important;
  margin-bottom: var(--base-size-112, 112px) !important;
}

/* Set a $size margin on the top at $breakpoint */
.mt-12 {
  margin-top: var(--base-size-128, 128px) !important;
}

/* Set a $size margin on the bottom at $breakpoint */
.mb-12 {
  margin-bottom: var(--base-size-128, 128px) !important;
}

/* Set a negative $size margin on top at $breakpoint */
.mt-n12 {
  margin-top: calc(-1 * var(--base-size-128, 128px)) !important;
}

/* Set a negative $size margin on the bottom at $breakpoint */
.mb-n12 {
  margin-bottom: calc(-1 * var(--base-size-128, 128px)) !important;
}

/* Set a $size margin on the top & bottom at $breakpoint */
.my-12 {
  margin-top: var(--base-size-128, 128px) !important;
  margin-bottom: var(--base-size-128, 128px) !important;
}

/* responsive horizontal auto margins */
.mx-auto {
  margin-right: auto !important;
  margin-left: auto !important;
}

@media (min-width: 544px) {
  /* Set a $size margin to all sides at $breakpoint */
  .m-sm-0 {
    margin: 0 !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-sm-0 {
    margin-top: 0 !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-sm-0 {
    margin-bottom: 0 !important;
  }
  /* Set a $size margin on the right at $breakpoint */
  .mr-sm-0 {
    margin-right: 0 !important;
  }
  /* Set a $size margin on the left at $breakpoint */
  .ml-sm-0 {
    margin-left: 0 !important;
  }
  /* Set a $size margin on the left & right at $breakpoint */
  .mx-sm-0 {
    margin-right: 0 !important;
    margin-left: 0 !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-sm-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
  /* Set a $size margin to all sides at $breakpoint */
  .m-sm-1 {
    margin: var(--base-size-4, 4px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-sm-1 {
    margin-top: var(--base-size-4, 4px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-sm-1 {
    margin-bottom: var(--base-size-4, 4px) !important;
  }
  /* Set a $size margin on the right at $breakpoint */
  .mr-sm-1 {
    margin-right: var(--base-size-4, 4px) !important;
  }
  /* Set a $size margin on the left at $breakpoint */
  .ml-sm-1 {
    margin-left: var(--base-size-4, 4px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-sm-n1 {
    margin-top: calc(-1 * var(--base-size-4, 4px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-sm-n1 {
    margin-bottom: calc(-1 * var(--base-size-4, 4px)) !important;
  }
  /* Set a negative $size margin on the right at $breakpoint */
  .mr-sm-n1 {
    margin-right: calc(-1 * var(--base-size-4, 4px)) !important;
  }
  /* Set a negative $size margin on the left at $breakpoint */
  .ml-sm-n1 {
    margin-left: calc(-1 * var(--base-size-4, 4px)) !important;
  }
  /* Set a $size margin on the left & right at $breakpoint */
  .mx-sm-1 {
    margin-right: var(--base-size-4, 4px) !important;
    margin-left: var(--base-size-4, 4px) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-sm-1 {
    margin-top: var(--base-size-4, 4px) !important;
    margin-bottom: var(--base-size-4, 4px) !important;
  }
  /* Set a $size margin to all sides at $breakpoint */
  .m-sm-2 {
    margin: var(--base-size-8, 8px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-sm-2 {
    margin-top: var(--base-size-8, 8px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-sm-2 {
    margin-bottom: var(--base-size-8, 8px) !important;
  }
  /* Set a $size margin on the right at $breakpoint */
  .mr-sm-2 {
    margin-right: var(--base-size-8, 8px) !important;
  }
  /* Set a $size margin on the left at $breakpoint */
  .ml-sm-2 {
    margin-left: var(--base-size-8, 8px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-sm-n2 {
    margin-top: calc(-1 * var(--base-size-8, 8px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-sm-n2 {
    margin-bottom: calc(-1 * var(--base-size-8, 8px)) !important;
  }
  /* Set a negative $size margin on the right at $breakpoint */
  .mr-sm-n2 {
    margin-right: calc(-1 * var(--base-size-8, 8px)) !important;
  }
  /* Set a negative $size margin on the left at $breakpoint */
  .ml-sm-n2 {
    margin-left: calc(-1 * var(--base-size-8, 8px)) !important;
  }
  /* Set a $size margin on the left & right at $breakpoint */
  .mx-sm-2 {
    margin-right: var(--base-size-8, 8px) !important;
    margin-left: var(--base-size-8, 8px) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-sm-2 {
    margin-top: var(--base-size-8, 8px) !important;
    margin-bottom: var(--base-size-8, 8px) !important;
  }
  /* Set a $size margin to all sides at $breakpoint */
  .m-sm-3 {
    margin: var(--base-size-16, 16px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-sm-3 {
    margin-top: var(--base-size-16, 16px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-sm-3 {
    margin-bottom: var(--base-size-16, 16px) !important;
  }
  /* Set a $size margin on the right at $breakpoint */
  .mr-sm-3 {
    margin-right: var(--base-size-16, 16px) !important;
  }
  /* Set a $size margin on the left at $breakpoint */
  .ml-sm-3 {
    margin-left: var(--base-size-16, 16px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-sm-n3 {
    margin-top: calc(-1 * var(--base-size-16, 16px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-sm-n3 {
    margin-bottom: calc(-1 * var(--base-size-16, 16px)) !important;
  }
  /* Set a negative $size margin on the right at $breakpoint */
  .mr-sm-n3 {
    margin-right: calc(-1 * var(--base-size-16, 16px)) !important;
  }
  /* Set a negative $size margin on the left at $breakpoint */
  .ml-sm-n3 {
    margin-left: calc(-1 * var(--base-size-16, 16px)) !important;
  }
  /* Set a $size margin on the left & right at $breakpoint */
  .mx-sm-3 {
    margin-right: var(--base-size-16, 16px) !important;
    margin-left: var(--base-size-16, 16px) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-sm-3 {
    margin-top: var(--base-size-16, 16px) !important;
    margin-bottom: var(--base-size-16, 16px) !important;
  }
  /* Set a $size margin to all sides at $breakpoint */
  .m-sm-4 {
    margin: var(--base-size-24, 24px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-sm-4 {
    margin-top: var(--base-size-24, 24px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-sm-4 {
    margin-bottom: var(--base-size-24, 24px) !important;
  }
  /* Set a $size margin on the right at $breakpoint */
  .mr-sm-4 {
    margin-right: var(--base-size-24, 24px) !important;
  }
  /* Set a $size margin on the left at $breakpoint */
  .ml-sm-4 {
    margin-left: var(--base-size-24, 24px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-sm-n4 {
    margin-top: calc(-1 * var(--base-size-24, 24px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-sm-n4 {
    margin-bottom: calc(-1 * var(--base-size-24, 24px)) !important;
  }
  /* Set a negative $size margin on the right at $breakpoint */
  .mr-sm-n4 {
    margin-right: calc(-1 * var(--base-size-24, 24px)) !important;
  }
  /* Set a negative $size margin on the left at $breakpoint */
  .ml-sm-n4 {
    margin-left: calc(-1 * var(--base-size-24, 24px)) !important;
  }
  /* Set a $size margin on the left & right at $breakpoint */
  .mx-sm-4 {
    margin-right: var(--base-size-24, 24px) !important;
    margin-left: var(--base-size-24, 24px) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-sm-4 {
    margin-top: var(--base-size-24, 24px) !important;
    margin-bottom: var(--base-size-24, 24px) !important;
  }
  /* Set a $size margin to all sides at $breakpoint */
  .m-sm-5 {
    margin: var(--base-size-32, 32px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-sm-5 {
    margin-top: var(--base-size-32, 32px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-sm-5 {
    margin-bottom: var(--base-size-32, 32px) !important;
  }
  /* Set a $size margin on the right at $breakpoint */
  .mr-sm-5 {
    margin-right: var(--base-size-32, 32px) !important;
  }
  /* Set a $size margin on the left at $breakpoint */
  .ml-sm-5 {
    margin-left: var(--base-size-32, 32px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-sm-n5 {
    margin-top: calc(-1 * var(--base-size-32, 32px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-sm-n5 {
    margin-bottom: calc(-1 * var(--base-size-32, 32px)) !important;
  }
  /* Set a negative $size margin on the right at $breakpoint */
  .mr-sm-n5 {
    margin-right: calc(-1 * var(--base-size-32, 32px)) !important;
  }
  /* Set a negative $size margin on the left at $breakpoint */
  .ml-sm-n5 {
    margin-left: calc(-1 * var(--base-size-32, 32px)) !important;
  }
  /* Set a $size margin on the left & right at $breakpoint */
  .mx-sm-5 {
    margin-right: var(--base-size-32, 32px) !important;
    margin-left: var(--base-size-32, 32px) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-sm-5 {
    margin-top: var(--base-size-32, 32px) !important;
    margin-bottom: var(--base-size-32, 32px) !important;
  }
  /* Set a $size margin to all sides at $breakpoint */
  .m-sm-6 {
    margin: var(--base-size-40, 40px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-sm-6 {
    margin-top: var(--base-size-40, 40px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-sm-6 {
    margin-bottom: var(--base-size-40, 40px) !important;
  }
  /* Set a $size margin on the right at $breakpoint */
  .mr-sm-6 {
    margin-right: var(--base-size-40, 40px) !important;
  }
  /* Set a $size margin on the left at $breakpoint */
  .ml-sm-6 {
    margin-left: var(--base-size-40, 40px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-sm-n6 {
    margin-top: calc(-1 * var(--base-size-40, 40px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-sm-n6 {
    margin-bottom: calc(-1 * var(--base-size-40, 40px)) !important;
  }
  /* Set a negative $size margin on the right at $breakpoint */
  .mr-sm-n6 {
    margin-right: calc(-1 * var(--base-size-40, 40px)) !important;
  }
  /* Set a negative $size margin on the left at $breakpoint */
  .ml-sm-n6 {
    margin-left: calc(-1 * var(--base-size-40, 40px)) !important;
  }
  /* Set a $size margin on the left & right at $breakpoint */
  .mx-sm-6 {
    margin-right: var(--base-size-40, 40px) !important;
    margin-left: var(--base-size-40, 40px) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-sm-6 {
    margin-top: var(--base-size-40, 40px) !important;
    margin-bottom: var(--base-size-40, 40px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-sm-7 {
    margin-top: var(--base-size-48, 48px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-sm-7 {
    margin-bottom: var(--base-size-48, 48px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-sm-n7 {
    margin-top: calc(-1 * var(--base-size-48, 48px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-sm-n7 {
    margin-bottom: calc(-1 * var(--base-size-48, 48px)) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-sm-7 {
    margin-top: var(--base-size-48, 48px) !important;
    margin-bottom: var(--base-size-48, 48px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-sm-8 {
    margin-top: var(--base-size-64, 64px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-sm-8 {
    margin-bottom: var(--base-size-64, 64px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-sm-n8 {
    margin-top: calc(-1 * var(--base-size-64, 64px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-sm-n8 {
    margin-bottom: calc(-1 * var(--base-size-64, 64px)) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-sm-8 {
    margin-top: var(--base-size-64, 64px) !important;
    margin-bottom: var(--base-size-64, 64px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-sm-9 {
    margin-top: var(--base-size-80, 80px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-sm-9 {
    margin-bottom: var(--base-size-80, 80px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-sm-n9 {
    margin-top: calc(-1 * var(--base-size-80, 80px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-sm-n9 {
    margin-bottom: calc(-1 * var(--base-size-80, 80px)) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-sm-9 {
    margin-top: var(--base-size-80, 80px) !important;
    margin-bottom: var(--base-size-80, 80px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-sm-10 {
    margin-top: var(--base-size-96, 96px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-sm-10 {
    margin-bottom: var(--base-size-96, 96px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-sm-n10 {
    margin-top: calc(-1 * var(--base-size-96, 96px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-sm-n10 {
    margin-bottom: calc(-1 * var(--base-size-96, 96px)) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-sm-10 {
    margin-top: var(--base-size-96, 96px) !important;
    margin-bottom: var(--base-size-96, 96px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-sm-11 {
    margin-top: var(--base-size-112, 112px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-sm-11 {
    margin-bottom: var(--base-size-112, 112px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-sm-n11 {
    margin-top: calc(-1 * var(--base-size-112, 112px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-sm-n11 {
    margin-bottom: calc(-1 * var(--base-size-112, 112px)) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-sm-11 {
    margin-top: var(--base-size-112, 112px) !important;
    margin-bottom: var(--base-size-112, 112px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-sm-12 {
    margin-top: var(--base-size-128, 128px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-sm-12 {
    margin-bottom: var(--base-size-128, 128px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-sm-n12 {
    margin-top: calc(-1 * var(--base-size-128, 128px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-sm-n12 {
    margin-bottom: calc(-1 * var(--base-size-128, 128px)) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-sm-12 {
    margin-top: var(--base-size-128, 128px) !important;
    margin-bottom: var(--base-size-128, 128px) !important;
  }
  /* responsive horizontal auto margins */
  .mx-sm-auto {
    margin-right: auto !important;
    margin-left: auto !important;
  }
}
@media (min-width: 768px) {
  /* Set a $size margin to all sides at $breakpoint */
  .m-md-0 {
    margin: 0 !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-md-0 {
    margin-top: 0 !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-md-0 {
    margin-bottom: 0 !important;
  }
  /* Set a $size margin on the right at $breakpoint */
  .mr-md-0 {
    margin-right: 0 !important;
  }
  /* Set a $size margin on the left at $breakpoint */
  .ml-md-0 {
    margin-left: 0 !important;
  }
  /* Set a $size margin on the left & right at $breakpoint */
  .mx-md-0 {
    margin-right: 0 !important;
    margin-left: 0 !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-md-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
  /* Set a $size margin to all sides at $breakpoint */
  .m-md-1 {
    margin: var(--base-size-4, 4px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-md-1 {
    margin-top: var(--base-size-4, 4px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-md-1 {
    margin-bottom: var(--base-size-4, 4px) !important;
  }
  /* Set a $size margin on the right at $breakpoint */
  .mr-md-1 {
    margin-right: var(--base-size-4, 4px) !important;
  }
  /* Set a $size margin on the left at $breakpoint */
  .ml-md-1 {
    margin-left: var(--base-size-4, 4px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-md-n1 {
    margin-top: calc(-1 * var(--base-size-4, 4px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-md-n1 {
    margin-bottom: calc(-1 * var(--base-size-4, 4px)) !important;
  }
  /* Set a negative $size margin on the right at $breakpoint */
  .mr-md-n1 {
    margin-right: calc(-1 * var(--base-size-4, 4px)) !important;
  }
  /* Set a negative $size margin on the left at $breakpoint */
  .ml-md-n1 {
    margin-left: calc(-1 * var(--base-size-4, 4px)) !important;
  }
  /* Set a $size margin on the left & right at $breakpoint */
  .mx-md-1 {
    margin-right: var(--base-size-4, 4px) !important;
    margin-left: var(--base-size-4, 4px) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-md-1 {
    margin-top: var(--base-size-4, 4px) !important;
    margin-bottom: var(--base-size-4, 4px) !important;
  }
  /* Set a $size margin to all sides at $breakpoint */
  .m-md-2 {
    margin: var(--base-size-8, 8px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-md-2 {
    margin-top: var(--base-size-8, 8px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-md-2 {
    margin-bottom: var(--base-size-8, 8px) !important;
  }
  /* Set a $size margin on the right at $breakpoint */
  .mr-md-2 {
    margin-right: var(--base-size-8, 8px) !important;
  }
  /* Set a $size margin on the left at $breakpoint */
  .ml-md-2 {
    margin-left: var(--base-size-8, 8px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-md-n2 {
    margin-top: calc(-1 * var(--base-size-8, 8px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-md-n2 {
    margin-bottom: calc(-1 * var(--base-size-8, 8px)) !important;
  }
  /* Set a negative $size margin on the right at $breakpoint */
  .mr-md-n2 {
    margin-right: calc(-1 * var(--base-size-8, 8px)) !important;
  }
  /* Set a negative $size margin on the left at $breakpoint */
  .ml-md-n2 {
    margin-left: calc(-1 * var(--base-size-8, 8px)) !important;
  }
  /* Set a $size margin on the left & right at $breakpoint */
  .mx-md-2 {
    margin-right: var(--base-size-8, 8px) !important;
    margin-left: var(--base-size-8, 8px) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-md-2 {
    margin-top: var(--base-size-8, 8px) !important;
    margin-bottom: var(--base-size-8, 8px) !important;
  }
  /* Set a $size margin to all sides at $breakpoint */
  .m-md-3 {
    margin: var(--base-size-16, 16px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-md-3 {
    margin-top: var(--base-size-16, 16px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-md-3 {
    margin-bottom: var(--base-size-16, 16px) !important;
  }
  /* Set a $size margin on the right at $breakpoint */
  .mr-md-3 {
    margin-right: var(--base-size-16, 16px) !important;
  }
  /* Set a $size margin on the left at $breakpoint */
  .ml-md-3 {
    margin-left: var(--base-size-16, 16px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-md-n3 {
    margin-top: calc(-1 * var(--base-size-16, 16px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-md-n3 {
    margin-bottom: calc(-1 * var(--base-size-16, 16px)) !important;
  }
  /* Set a negative $size margin on the right at $breakpoint */
  .mr-md-n3 {
    margin-right: calc(-1 * var(--base-size-16, 16px)) !important;
  }
  /* Set a negative $size margin on the left at $breakpoint */
  .ml-md-n3 {
    margin-left: calc(-1 * var(--base-size-16, 16px)) !important;
  }
  /* Set a $size margin on the left & right at $breakpoint */
  .mx-md-3 {
    margin-right: var(--base-size-16, 16px) !important;
    margin-left: var(--base-size-16, 16px) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-md-3 {
    margin-top: var(--base-size-16, 16px) !important;
    margin-bottom: var(--base-size-16, 16px) !important;
  }
  /* Set a $size margin to all sides at $breakpoint */
  .m-md-4 {
    margin: var(--base-size-24, 24px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-md-4 {
    margin-top: var(--base-size-24, 24px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-md-4 {
    margin-bottom: var(--base-size-24, 24px) !important;
  }
  /* Set a $size margin on the right at $breakpoint */
  .mr-md-4 {
    margin-right: var(--base-size-24, 24px) !important;
  }
  /* Set a $size margin on the left at $breakpoint */
  .ml-md-4 {
    margin-left: var(--base-size-24, 24px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-md-n4 {
    margin-top: calc(-1 * var(--base-size-24, 24px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-md-n4 {
    margin-bottom: calc(-1 * var(--base-size-24, 24px)) !important;
  }
  /* Set a negative $size margin on the right at $breakpoint */
  .mr-md-n4 {
    margin-right: calc(-1 * var(--base-size-24, 24px)) !important;
  }
  /* Set a negative $size margin on the left at $breakpoint */
  .ml-md-n4 {
    margin-left: calc(-1 * var(--base-size-24, 24px)) !important;
  }
  /* Set a $size margin on the left & right at $breakpoint */
  .mx-md-4 {
    margin-right: var(--base-size-24, 24px) !important;
    margin-left: var(--base-size-24, 24px) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-md-4 {
    margin-top: var(--base-size-24, 24px) !important;
    margin-bottom: var(--base-size-24, 24px) !important;
  }
  /* Set a $size margin to all sides at $breakpoint */
  .m-md-5 {
    margin: var(--base-size-32, 32px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-md-5 {
    margin-top: var(--base-size-32, 32px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-md-5 {
    margin-bottom: var(--base-size-32, 32px) !important;
  }
  /* Set a $size margin on the right at $breakpoint */
  .mr-md-5 {
    margin-right: var(--base-size-32, 32px) !important;
  }
  /* Set a $size margin on the left at $breakpoint */
  .ml-md-5 {
    margin-left: var(--base-size-32, 32px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-md-n5 {
    margin-top: calc(-1 * var(--base-size-32, 32px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-md-n5 {
    margin-bottom: calc(-1 * var(--base-size-32, 32px)) !important;
  }
  /* Set a negative $size margin on the right at $breakpoint */
  .mr-md-n5 {
    margin-right: calc(-1 * var(--base-size-32, 32px)) !important;
  }
  /* Set a negative $size margin on the left at $breakpoint */
  .ml-md-n5 {
    margin-left: calc(-1 * var(--base-size-32, 32px)) !important;
  }
  /* Set a $size margin on the left & right at $breakpoint */
  .mx-md-5 {
    margin-right: var(--base-size-32, 32px) !important;
    margin-left: var(--base-size-32, 32px) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-md-5 {
    margin-top: var(--base-size-32, 32px) !important;
    margin-bottom: var(--base-size-32, 32px) !important;
  }
  /* Set a $size margin to all sides at $breakpoint */
  .m-md-6 {
    margin: var(--base-size-40, 40px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-md-6 {
    margin-top: var(--base-size-40, 40px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-md-6 {
    margin-bottom: var(--base-size-40, 40px) !important;
  }
  /* Set a $size margin on the right at $breakpoint */
  .mr-md-6 {
    margin-right: var(--base-size-40, 40px) !important;
  }
  /* Set a $size margin on the left at $breakpoint */
  .ml-md-6 {
    margin-left: var(--base-size-40, 40px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-md-n6 {
    margin-top: calc(-1 * var(--base-size-40, 40px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-md-n6 {
    margin-bottom: calc(-1 * var(--base-size-40, 40px)) !important;
  }
  /* Set a negative $size margin on the right at $breakpoint */
  .mr-md-n6 {
    margin-right: calc(-1 * var(--base-size-40, 40px)) !important;
  }
  /* Set a negative $size margin on the left at $breakpoint */
  .ml-md-n6 {
    margin-left: calc(-1 * var(--base-size-40, 40px)) !important;
  }
  /* Set a $size margin on the left & right at $breakpoint */
  .mx-md-6 {
    margin-right: var(--base-size-40, 40px) !important;
    margin-left: var(--base-size-40, 40px) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-md-6 {
    margin-top: var(--base-size-40, 40px) !important;
    margin-bottom: var(--base-size-40, 40px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-md-7 {
    margin-top: var(--base-size-48, 48px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-md-7 {
    margin-bottom: var(--base-size-48, 48px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-md-n7 {
    margin-top: calc(-1 * var(--base-size-48, 48px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-md-n7 {
    margin-bottom: calc(-1 * var(--base-size-48, 48px)) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-md-7 {
    margin-top: var(--base-size-48, 48px) !important;
    margin-bottom: var(--base-size-48, 48px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-md-8 {
    margin-top: var(--base-size-64, 64px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-md-8 {
    margin-bottom: var(--base-size-64, 64px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-md-n8 {
    margin-top: calc(-1 * var(--base-size-64, 64px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-md-n8 {
    margin-bottom: calc(-1 * var(--base-size-64, 64px)) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-md-8 {
    margin-top: var(--base-size-64, 64px) !important;
    margin-bottom: var(--base-size-64, 64px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-md-9 {
    margin-top: var(--base-size-80, 80px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-md-9 {
    margin-bottom: var(--base-size-80, 80px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-md-n9 {
    margin-top: calc(-1 * var(--base-size-80, 80px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-md-n9 {
    margin-bottom: calc(-1 * var(--base-size-80, 80px)) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-md-9 {
    margin-top: var(--base-size-80, 80px) !important;
    margin-bottom: var(--base-size-80, 80px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-md-10 {
    margin-top: var(--base-size-96, 96px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-md-10 {
    margin-bottom: var(--base-size-96, 96px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-md-n10 {
    margin-top: calc(-1 * var(--base-size-96, 96px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-md-n10 {
    margin-bottom: calc(-1 * var(--base-size-96, 96px)) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-md-10 {
    margin-top: var(--base-size-96, 96px) !important;
    margin-bottom: var(--base-size-96, 96px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-md-11 {
    margin-top: var(--base-size-112, 112px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-md-11 {
    margin-bottom: var(--base-size-112, 112px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-md-n11 {
    margin-top: calc(-1 * var(--base-size-112, 112px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-md-n11 {
    margin-bottom: calc(-1 * var(--base-size-112, 112px)) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-md-11 {
    margin-top: var(--base-size-112, 112px) !important;
    margin-bottom: var(--base-size-112, 112px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-md-12 {
    margin-top: var(--base-size-128, 128px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-md-12 {
    margin-bottom: var(--base-size-128, 128px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-md-n12 {
    margin-top: calc(-1 * var(--base-size-128, 128px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-md-n12 {
    margin-bottom: calc(-1 * var(--base-size-128, 128px)) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-md-12 {
    margin-top: var(--base-size-128, 128px) !important;
    margin-bottom: var(--base-size-128, 128px) !important;
  }
  /* responsive horizontal auto margins */
  .mx-md-auto {
    margin-right: auto !important;
    margin-left: auto !important;
  }
}
@media (min-width: 1012px) {
  /* Set a $size margin to all sides at $breakpoint */
  .m-lg-0 {
    margin: 0 !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-lg-0 {
    margin-top: 0 !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-lg-0 {
    margin-bottom: 0 !important;
  }
  /* Set a $size margin on the right at $breakpoint */
  .mr-lg-0 {
    margin-right: 0 !important;
  }
  /* Set a $size margin on the left at $breakpoint */
  .ml-lg-0 {
    margin-left: 0 !important;
  }
  /* Set a $size margin on the left & right at $breakpoint */
  .mx-lg-0 {
    margin-right: 0 !important;
    margin-left: 0 !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-lg-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
  /* Set a $size margin to all sides at $breakpoint */
  .m-lg-1 {
    margin: var(--base-size-4, 4px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-lg-1 {
    margin-top: var(--base-size-4, 4px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-lg-1 {
    margin-bottom: var(--base-size-4, 4px) !important;
  }
  /* Set a $size margin on the right at $breakpoint */
  .mr-lg-1 {
    margin-right: var(--base-size-4, 4px) !important;
  }
  /* Set a $size margin on the left at $breakpoint */
  .ml-lg-1 {
    margin-left: var(--base-size-4, 4px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-lg-n1 {
    margin-top: calc(-1 * var(--base-size-4, 4px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-lg-n1 {
    margin-bottom: calc(-1 * var(--base-size-4, 4px)) !important;
  }
  /* Set a negative $size margin on the right at $breakpoint */
  .mr-lg-n1 {
    margin-right: calc(-1 * var(--base-size-4, 4px)) !important;
  }
  /* Set a negative $size margin on the left at $breakpoint */
  .ml-lg-n1 {
    margin-left: calc(-1 * var(--base-size-4, 4px)) !important;
  }
  /* Set a $size margin on the left & right at $breakpoint */
  .mx-lg-1 {
    margin-right: var(--base-size-4, 4px) !important;
    margin-left: var(--base-size-4, 4px) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-lg-1 {
    margin-top: var(--base-size-4, 4px) !important;
    margin-bottom: var(--base-size-4, 4px) !important;
  }
  /* Set a $size margin to all sides at $breakpoint */
  .m-lg-2 {
    margin: var(--base-size-8, 8px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-lg-2 {
    margin-top: var(--base-size-8, 8px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-lg-2 {
    margin-bottom: var(--base-size-8, 8px) !important;
  }
  /* Set a $size margin on the right at $breakpoint */
  .mr-lg-2 {
    margin-right: var(--base-size-8, 8px) !important;
  }
  /* Set a $size margin on the left at $breakpoint */
  .ml-lg-2 {
    margin-left: var(--base-size-8, 8px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-lg-n2 {
    margin-top: calc(-1 * var(--base-size-8, 8px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-lg-n2 {
    margin-bottom: calc(-1 * var(--base-size-8, 8px)) !important;
  }
  /* Set a negative $size margin on the right at $breakpoint */
  .mr-lg-n2 {
    margin-right: calc(-1 * var(--base-size-8, 8px)) !important;
  }
  /* Set a negative $size margin on the left at $breakpoint */
  .ml-lg-n2 {
    margin-left: calc(-1 * var(--base-size-8, 8px)) !important;
  }
  /* Set a $size margin on the left & right at $breakpoint */
  .mx-lg-2 {
    margin-right: var(--base-size-8, 8px) !important;
    margin-left: var(--base-size-8, 8px) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-lg-2 {
    margin-top: var(--base-size-8, 8px) !important;
    margin-bottom: var(--base-size-8, 8px) !important;
  }
  /* Set a $size margin to all sides at $breakpoint */
  .m-lg-3 {
    margin: var(--base-size-16, 16px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-lg-3 {
    margin-top: var(--base-size-16, 16px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-lg-3 {
    margin-bottom: var(--base-size-16, 16px) !important;
  }
  /* Set a $size margin on the right at $breakpoint */
  .mr-lg-3 {
    margin-right: var(--base-size-16, 16px) !important;
  }
  /* Set a $size margin on the left at $breakpoint */
  .ml-lg-3 {
    margin-left: var(--base-size-16, 16px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-lg-n3 {
    margin-top: calc(-1 * var(--base-size-16, 16px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-lg-n3 {
    margin-bottom: calc(-1 * var(--base-size-16, 16px)) !important;
  }
  /* Set a negative $size margin on the right at $breakpoint */
  .mr-lg-n3 {
    margin-right: calc(-1 * var(--base-size-16, 16px)) !important;
  }
  /* Set a negative $size margin on the left at $breakpoint */
  .ml-lg-n3 {
    margin-left: calc(-1 * var(--base-size-16, 16px)) !important;
  }
  /* Set a $size margin on the left & right at $breakpoint */
  .mx-lg-3 {
    margin-right: var(--base-size-16, 16px) !important;
    margin-left: var(--base-size-16, 16px) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-lg-3 {
    margin-top: var(--base-size-16, 16px) !important;
    margin-bottom: var(--base-size-16, 16px) !important;
  }
  /* Set a $size margin to all sides at $breakpoint */
  .m-lg-4 {
    margin: var(--base-size-24, 24px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-lg-4 {
    margin-top: var(--base-size-24, 24px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-lg-4 {
    margin-bottom: var(--base-size-24, 24px) !important;
  }
  /* Set a $size margin on the right at $breakpoint */
  .mr-lg-4 {
    margin-right: var(--base-size-24, 24px) !important;
  }
  /* Set a $size margin on the left at $breakpoint */
  .ml-lg-4 {
    margin-left: var(--base-size-24, 24px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-lg-n4 {
    margin-top: calc(-1 * var(--base-size-24, 24px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-lg-n4 {
    margin-bottom: calc(-1 * var(--base-size-24, 24px)) !important;
  }
  /* Set a negative $size margin on the right at $breakpoint */
  .mr-lg-n4 {
    margin-right: calc(-1 * var(--base-size-24, 24px)) !important;
  }
  /* Set a negative $size margin on the left at $breakpoint */
  .ml-lg-n4 {
    margin-left: calc(-1 * var(--base-size-24, 24px)) !important;
  }
  /* Set a $size margin on the left & right at $breakpoint */
  .mx-lg-4 {
    margin-right: var(--base-size-24, 24px) !important;
    margin-left: var(--base-size-24, 24px) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-lg-4 {
    margin-top: var(--base-size-24, 24px) !important;
    margin-bottom: var(--base-size-24, 24px) !important;
  }
  /* Set a $size margin to all sides at $breakpoint */
  .m-lg-5 {
    margin: var(--base-size-32, 32px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-lg-5 {
    margin-top: var(--base-size-32, 32px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-lg-5 {
    margin-bottom: var(--base-size-32, 32px) !important;
  }
  /* Set a $size margin on the right at $breakpoint */
  .mr-lg-5 {
    margin-right: var(--base-size-32, 32px) !important;
  }
  /* Set a $size margin on the left at $breakpoint */
  .ml-lg-5 {
    margin-left: var(--base-size-32, 32px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-lg-n5 {
    margin-top: calc(-1 * var(--base-size-32, 32px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-lg-n5 {
    margin-bottom: calc(-1 * var(--base-size-32, 32px)) !important;
  }
  /* Set a negative $size margin on the right at $breakpoint */
  .mr-lg-n5 {
    margin-right: calc(-1 * var(--base-size-32, 32px)) !important;
  }
  /* Set a negative $size margin on the left at $breakpoint */
  .ml-lg-n5 {
    margin-left: calc(-1 * var(--base-size-32, 32px)) !important;
  }
  /* Set a $size margin on the left & right at $breakpoint */
  .mx-lg-5 {
    margin-right: var(--base-size-32, 32px) !important;
    margin-left: var(--base-size-32, 32px) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-lg-5 {
    margin-top: var(--base-size-32, 32px) !important;
    margin-bottom: var(--base-size-32, 32px) !important;
  }
  /* Set a $size margin to all sides at $breakpoint */
  .m-lg-6 {
    margin: var(--base-size-40, 40px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-lg-6 {
    margin-top: var(--base-size-40, 40px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-lg-6 {
    margin-bottom: var(--base-size-40, 40px) !important;
  }
  /* Set a $size margin on the right at $breakpoint */
  .mr-lg-6 {
    margin-right: var(--base-size-40, 40px) !important;
  }
  /* Set a $size margin on the left at $breakpoint */
  .ml-lg-6 {
    margin-left: var(--base-size-40, 40px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-lg-n6 {
    margin-top: calc(-1 * var(--base-size-40, 40px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-lg-n6 {
    margin-bottom: calc(-1 * var(--base-size-40, 40px)) !important;
  }
  /* Set a negative $size margin on the right at $breakpoint */
  .mr-lg-n6 {
    margin-right: calc(-1 * var(--base-size-40, 40px)) !important;
  }
  /* Set a negative $size margin on the left at $breakpoint */
  .ml-lg-n6 {
    margin-left: calc(-1 * var(--base-size-40, 40px)) !important;
  }
  /* Set a $size margin on the left & right at $breakpoint */
  .mx-lg-6 {
    margin-right: var(--base-size-40, 40px) !important;
    margin-left: var(--base-size-40, 40px) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-lg-6 {
    margin-top: var(--base-size-40, 40px) !important;
    margin-bottom: var(--base-size-40, 40px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-lg-7 {
    margin-top: var(--base-size-48, 48px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-lg-7 {
    margin-bottom: var(--base-size-48, 48px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-lg-n7 {
    margin-top: calc(-1 * var(--base-size-48, 48px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-lg-n7 {
    margin-bottom: calc(-1 * var(--base-size-48, 48px)) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-lg-7 {
    margin-top: var(--base-size-48, 48px) !important;
    margin-bottom: var(--base-size-48, 48px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-lg-8 {
    margin-top: var(--base-size-64, 64px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-lg-8 {
    margin-bottom: var(--base-size-64, 64px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-lg-n8 {
    margin-top: calc(-1 * var(--base-size-64, 64px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-lg-n8 {
    margin-bottom: calc(-1 * var(--base-size-64, 64px)) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-lg-8 {
    margin-top: var(--base-size-64, 64px) !important;
    margin-bottom: var(--base-size-64, 64px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-lg-9 {
    margin-top: var(--base-size-80, 80px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-lg-9 {
    margin-bottom: var(--base-size-80, 80px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-lg-n9 {
    margin-top: calc(-1 * var(--base-size-80, 80px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-lg-n9 {
    margin-bottom: calc(-1 * var(--base-size-80, 80px)) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-lg-9 {
    margin-top: var(--base-size-80, 80px) !important;
    margin-bottom: var(--base-size-80, 80px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-lg-10 {
    margin-top: var(--base-size-96, 96px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-lg-10 {
    margin-bottom: var(--base-size-96, 96px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-lg-n10 {
    margin-top: calc(-1 * var(--base-size-96, 96px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-lg-n10 {
    margin-bottom: calc(-1 * var(--base-size-96, 96px)) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-lg-10 {
    margin-top: var(--base-size-96, 96px) !important;
    margin-bottom: var(--base-size-96, 96px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-lg-11 {
    margin-top: var(--base-size-112, 112px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-lg-11 {
    margin-bottom: var(--base-size-112, 112px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-lg-n11 {
    margin-top: calc(-1 * var(--base-size-112, 112px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-lg-n11 {
    margin-bottom: calc(-1 * var(--base-size-112, 112px)) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-lg-11 {
    margin-top: var(--base-size-112, 112px) !important;
    margin-bottom: var(--base-size-112, 112px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-lg-12 {
    margin-top: var(--base-size-128, 128px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-lg-12 {
    margin-bottom: var(--base-size-128, 128px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-lg-n12 {
    margin-top: calc(-1 * var(--base-size-128, 128px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-lg-n12 {
    margin-bottom: calc(-1 * var(--base-size-128, 128px)) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-lg-12 {
    margin-top: var(--base-size-128, 128px) !important;
    margin-bottom: var(--base-size-128, 128px) !important;
  }
  /* responsive horizontal auto margins */
  .mx-lg-auto {
    margin-right: auto !important;
    margin-left: auto !important;
  }
}
@media (min-width: 1280px) {
  /* Set a $size margin to all sides at $breakpoint */
  .m-xl-0 {
    margin: 0 !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-xl-0 {
    margin-top: 0 !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-xl-0 {
    margin-bottom: 0 !important;
  }
  /* Set a $size margin on the right at $breakpoint */
  .mr-xl-0 {
    margin-right: 0 !important;
  }
  /* Set a $size margin on the left at $breakpoint */
  .ml-xl-0 {
    margin-left: 0 !important;
  }
  /* Set a $size margin on the left & right at $breakpoint */
  .mx-xl-0 {
    margin-right: 0 !important;
    margin-left: 0 !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-xl-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }
  /* Set a $size margin to all sides at $breakpoint */
  .m-xl-1 {
    margin: var(--base-size-4, 4px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-xl-1 {
    margin-top: var(--base-size-4, 4px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-xl-1 {
    margin-bottom: var(--base-size-4, 4px) !important;
  }
  /* Set a $size margin on the right at $breakpoint */
  .mr-xl-1 {
    margin-right: var(--base-size-4, 4px) !important;
  }
  /* Set a $size margin on the left at $breakpoint */
  .ml-xl-1 {
    margin-left: var(--base-size-4, 4px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-xl-n1 {
    margin-top: calc(-1 * var(--base-size-4, 4px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-xl-n1 {
    margin-bottom: calc(-1 * var(--base-size-4, 4px)) !important;
  }
  /* Set a negative $size margin on the right at $breakpoint */
  .mr-xl-n1 {
    margin-right: calc(-1 * var(--base-size-4, 4px)) !important;
  }
  /* Set a negative $size margin on the left at $breakpoint */
  .ml-xl-n1 {
    margin-left: calc(-1 * var(--base-size-4, 4px)) !important;
  }
  /* Set a $size margin on the left & right at $breakpoint */
  .mx-xl-1 {
    margin-right: var(--base-size-4, 4px) !important;
    margin-left: var(--base-size-4, 4px) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-xl-1 {
    margin-top: var(--base-size-4, 4px) !important;
    margin-bottom: var(--base-size-4, 4px) !important;
  }
  /* Set a $size margin to all sides at $breakpoint */
  .m-xl-2 {
    margin: var(--base-size-8, 8px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-xl-2 {
    margin-top: var(--base-size-8, 8px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-xl-2 {
    margin-bottom: var(--base-size-8, 8px) !important;
  }
  /* Set a $size margin on the right at $breakpoint */
  .mr-xl-2 {
    margin-right: var(--base-size-8, 8px) !important;
  }
  /* Set a $size margin on the left at $breakpoint */
  .ml-xl-2 {
    margin-left: var(--base-size-8, 8px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-xl-n2 {
    margin-top: calc(-1 * var(--base-size-8, 8px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-xl-n2 {
    margin-bottom: calc(-1 * var(--base-size-8, 8px)) !important;
  }
  /* Set a negative $size margin on the right at $breakpoint */
  .mr-xl-n2 {
    margin-right: calc(-1 * var(--base-size-8, 8px)) !important;
  }
  /* Set a negative $size margin on the left at $breakpoint */
  .ml-xl-n2 {
    margin-left: calc(-1 * var(--base-size-8, 8px)) !important;
  }
  /* Set a $size margin on the left & right at $breakpoint */
  .mx-xl-2 {
    margin-right: var(--base-size-8, 8px) !important;
    margin-left: var(--base-size-8, 8px) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-xl-2 {
    margin-top: var(--base-size-8, 8px) !important;
    margin-bottom: var(--base-size-8, 8px) !important;
  }
  /* Set a $size margin to all sides at $breakpoint */
  .m-xl-3 {
    margin: var(--base-size-16, 16px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-xl-3 {
    margin-top: var(--base-size-16, 16px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-xl-3 {
    margin-bottom: var(--base-size-16, 16px) !important;
  }
  /* Set a $size margin on the right at $breakpoint */
  .mr-xl-3 {
    margin-right: var(--base-size-16, 16px) !important;
  }
  /* Set a $size margin on the left at $breakpoint */
  .ml-xl-3 {
    margin-left: var(--base-size-16, 16px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-xl-n3 {
    margin-top: calc(-1 * var(--base-size-16, 16px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-xl-n3 {
    margin-bottom: calc(-1 * var(--base-size-16, 16px)) !important;
  }
  /* Set a negative $size margin on the right at $breakpoint */
  .mr-xl-n3 {
    margin-right: calc(-1 * var(--base-size-16, 16px)) !important;
  }
  /* Set a negative $size margin on the left at $breakpoint */
  .ml-xl-n3 {
    margin-left: calc(-1 * var(--base-size-16, 16px)) !important;
  }
  /* Set a $size margin on the left & right at $breakpoint */
  .mx-xl-3 {
    margin-right: var(--base-size-16, 16px) !important;
    margin-left: var(--base-size-16, 16px) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-xl-3 {
    margin-top: var(--base-size-16, 16px) !important;
    margin-bottom: var(--base-size-16, 16px) !important;
  }
  /* Set a $size margin to all sides at $breakpoint */
  .m-xl-4 {
    margin: var(--base-size-24, 24px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-xl-4 {
    margin-top: var(--base-size-24, 24px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-xl-4 {
    margin-bottom: var(--base-size-24, 24px) !important;
  }
  /* Set a $size margin on the right at $breakpoint */
  .mr-xl-4 {
    margin-right: var(--base-size-24, 24px) !important;
  }
  /* Set a $size margin on the left at $breakpoint */
  .ml-xl-4 {
    margin-left: var(--base-size-24, 24px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-xl-n4 {
    margin-top: calc(-1 * var(--base-size-24, 24px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-xl-n4 {
    margin-bottom: calc(-1 * var(--base-size-24, 24px)) !important;
  }
  /* Set a negative $size margin on the right at $breakpoint */
  .mr-xl-n4 {
    margin-right: calc(-1 * var(--base-size-24, 24px)) !important;
  }
  /* Set a negative $size margin on the left at $breakpoint */
  .ml-xl-n4 {
    margin-left: calc(-1 * var(--base-size-24, 24px)) !important;
  }
  /* Set a $size margin on the left & right at $breakpoint */
  .mx-xl-4 {
    margin-right: var(--base-size-24, 24px) !important;
    margin-left: var(--base-size-24, 24px) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-xl-4 {
    margin-top: var(--base-size-24, 24px) !important;
    margin-bottom: var(--base-size-24, 24px) !important;
  }
  /* Set a $size margin to all sides at $breakpoint */
  .m-xl-5 {
    margin: var(--base-size-32, 32px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-xl-5 {
    margin-top: var(--base-size-32, 32px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-xl-5 {
    margin-bottom: var(--base-size-32, 32px) !important;
  }
  /* Set a $size margin on the right at $breakpoint */
  .mr-xl-5 {
    margin-right: var(--base-size-32, 32px) !important;
  }
  /* Set a $size margin on the left at $breakpoint */
  .ml-xl-5 {
    margin-left: var(--base-size-32, 32px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-xl-n5 {
    margin-top: calc(-1 * var(--base-size-32, 32px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-xl-n5 {
    margin-bottom: calc(-1 * var(--base-size-32, 32px)) !important;
  }
  /* Set a negative $size margin on the right at $breakpoint */
  .mr-xl-n5 {
    margin-right: calc(-1 * var(--base-size-32, 32px)) !important;
  }
  /* Set a negative $size margin on the left at $breakpoint */
  .ml-xl-n5 {
    margin-left: calc(-1 * var(--base-size-32, 32px)) !important;
  }
  /* Set a $size margin on the left & right at $breakpoint */
  .mx-xl-5 {
    margin-right: var(--base-size-32, 32px) !important;
    margin-left: var(--base-size-32, 32px) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-xl-5 {
    margin-top: var(--base-size-32, 32px) !important;
    margin-bottom: var(--base-size-32, 32px) !important;
  }
  /* Set a $size margin to all sides at $breakpoint */
  .m-xl-6 {
    margin: var(--base-size-40, 40px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-xl-6 {
    margin-top: var(--base-size-40, 40px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-xl-6 {
    margin-bottom: var(--base-size-40, 40px) !important;
  }
  /* Set a $size margin on the right at $breakpoint */
  .mr-xl-6 {
    margin-right: var(--base-size-40, 40px) !important;
  }
  /* Set a $size margin on the left at $breakpoint */
  .ml-xl-6 {
    margin-left: var(--base-size-40, 40px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-xl-n6 {
    margin-top: calc(-1 * var(--base-size-40, 40px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-xl-n6 {
    margin-bottom: calc(-1 * var(--base-size-40, 40px)) !important;
  }
  /* Set a negative $size margin on the right at $breakpoint */
  .mr-xl-n6 {
    margin-right: calc(-1 * var(--base-size-40, 40px)) !important;
  }
  /* Set a negative $size margin on the left at $breakpoint */
  .ml-xl-n6 {
    margin-left: calc(-1 * var(--base-size-40, 40px)) !important;
  }
  /* Set a $size margin on the left & right at $breakpoint */
  .mx-xl-6 {
    margin-right: var(--base-size-40, 40px) !important;
    margin-left: var(--base-size-40, 40px) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-xl-6 {
    margin-top: var(--base-size-40, 40px) !important;
    margin-bottom: var(--base-size-40, 40px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-xl-7 {
    margin-top: var(--base-size-48, 48px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-xl-7 {
    margin-bottom: var(--base-size-48, 48px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-xl-n7 {
    margin-top: calc(-1 * var(--base-size-48, 48px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-xl-n7 {
    margin-bottom: calc(-1 * var(--base-size-48, 48px)) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-xl-7 {
    margin-top: var(--base-size-48, 48px) !important;
    margin-bottom: var(--base-size-48, 48px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-xl-8 {
    margin-top: var(--base-size-64, 64px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-xl-8 {
    margin-bottom: var(--base-size-64, 64px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-xl-n8 {
    margin-top: calc(-1 * var(--base-size-64, 64px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-xl-n8 {
    margin-bottom: calc(-1 * var(--base-size-64, 64px)) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-xl-8 {
    margin-top: var(--base-size-64, 64px) !important;
    margin-bottom: var(--base-size-64, 64px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-xl-9 {
    margin-top: var(--base-size-80, 80px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-xl-9 {
    margin-bottom: var(--base-size-80, 80px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-xl-n9 {
    margin-top: calc(-1 * var(--base-size-80, 80px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-xl-n9 {
    margin-bottom: calc(-1 * var(--base-size-80, 80px)) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-xl-9 {
    margin-top: var(--base-size-80, 80px) !important;
    margin-bottom: var(--base-size-80, 80px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-xl-10 {
    margin-top: var(--base-size-96, 96px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-xl-10 {
    margin-bottom: var(--base-size-96, 96px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-xl-n10 {
    margin-top: calc(-1 * var(--base-size-96, 96px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-xl-n10 {
    margin-bottom: calc(-1 * var(--base-size-96, 96px)) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-xl-10 {
    margin-top: var(--base-size-96, 96px) !important;
    margin-bottom: var(--base-size-96, 96px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-xl-11 {
    margin-top: var(--base-size-112, 112px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-xl-11 {
    margin-bottom: var(--base-size-112, 112px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-xl-n11 {
    margin-top: calc(-1 * var(--base-size-112, 112px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-xl-n11 {
    margin-bottom: calc(-1 * var(--base-size-112, 112px)) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-xl-11 {
    margin-top: var(--base-size-112, 112px) !important;
    margin-bottom: var(--base-size-112, 112px) !important;
  }
  /* Set a $size margin on the top at $breakpoint */
  .mt-xl-12 {
    margin-top: var(--base-size-128, 128px) !important;
  }
  /* Set a $size margin on the bottom at $breakpoint */
  .mb-xl-12 {
    margin-bottom: var(--base-size-128, 128px) !important;
  }
  /* Set a negative $size margin on top at $breakpoint */
  .mt-xl-n12 {
    margin-top: calc(-1 * var(--base-size-128, 128px)) !important;
  }
  /* Set a negative $size margin on the bottom at $breakpoint */
  .mb-xl-n12 {
    margin-bottom: calc(-1 * var(--base-size-128, 128px)) !important;
  }
  /* Set a $size margin on the top & bottom at $breakpoint */
  .my-xl-12 {
    margin-top: var(--base-size-128, 128px) !important;
    margin-bottom: var(--base-size-128, 128px) !important;
  }
  /* responsive horizontal auto margins */
  .mx-xl-auto {
    margin-right: auto !important;
    margin-left: auto !important;
  }
}
.m-auto {
  margin: auto !important;
}

.mt-auto {
  margin-top: auto !important;
}

.mr-auto {
  margin-right: auto !important;
}

.mb-auto {
  margin-bottom: auto !important;
}

.ml-auto {
  margin-left: auto !important;
}

/* Set a $size padding to all sides at $breakpoint */
.p-0 {
  padding: 0 !important;
}

/* Set a $size padding to the top at $breakpoint */
.pt-0 {
  padding-top: 0 !important;
}

/* Set a $size padding to the right at $breakpoint */
.pr-0 {
  padding-right: 0 !important;
}

/* Set a $size padding to the bottom at $breakpoint */
.pb-0 {
  padding-bottom: 0 !important;
}

/* Set a $size padding to the left at $breakpoint */
.pl-0 {
  padding-left: 0 !important;
}

/* Set a $size padding to the left & right at $breakpoint */
.px-0 {
  padding-right: 0 !important;
  padding-left: 0 !important;
}

/* Set a $size padding to the top & bottom at $breakpoint */
.py-0 {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Set a $size padding to all sides at $breakpoint */
.p-1 {
  padding: var(--base-size-4, 4px) !important;
}

/* Set a $size padding to the top at $breakpoint */
.pt-1 {
  padding-top: var(--base-size-4, 4px) !important;
}

/* Set a $size padding to the right at $breakpoint */
.pr-1 {
  padding-right: var(--base-size-4, 4px) !important;
}

/* Set a $size padding to the bottom at $breakpoint */
.pb-1 {
  padding-bottom: var(--base-size-4, 4px) !important;
}

/* Set a $size padding to the left at $breakpoint */
.pl-1 {
  padding-left: var(--base-size-4, 4px) !important;
}

/* Set a $size padding to the left & right at $breakpoint */
.px-1 {
  padding-right: var(--base-size-4, 4px) !important;
  padding-left: var(--base-size-4, 4px) !important;
}

/* Set a $size padding to the top & bottom at $breakpoint */
.py-1 {
  padding-top: var(--base-size-4, 4px) !important;
  padding-bottom: var(--base-size-4, 4px) !important;
}

/* Set a $size padding to all sides at $breakpoint */
.p-2 {
  padding: var(--base-size-8, 8px) !important;
}

/* Set a $size padding to the top at $breakpoint */
.pt-2 {
  padding-top: var(--base-size-8, 8px) !important;
}

/* Set a $size padding to the right at $breakpoint */
.pr-2 {
  padding-right: var(--base-size-8, 8px) !important;
}

/* Set a $size padding to the bottom at $breakpoint */
.pb-2 {
  padding-bottom: var(--base-size-8, 8px) !important;
}

/* Set a $size padding to the left at $breakpoint */
.pl-2 {
  padding-left: var(--base-size-8, 8px) !important;
}

/* Set a $size padding to the left & right at $breakpoint */
.px-2 {
  padding-right: var(--base-size-8, 8px) !important;
  padding-left: var(--base-size-8, 8px) !important;
}

/* Set a $size padding to the top & bottom at $breakpoint */
.py-2 {
  padding-top: var(--base-size-8, 8px) !important;
  padding-bottom: var(--base-size-8, 8px) !important;
}

/* Set a $size padding to all sides at $breakpoint */
.p-3 {
  padding: var(--base-size-16, 16px) !important;
}

/* Set a $size padding to the top at $breakpoint */
.pt-3 {
  padding-top: var(--base-size-16, 16px) !important;
}

/* Set a $size padding to the right at $breakpoint */
.pr-3 {
  padding-right: var(--base-size-16, 16px) !important;
}

/* Set a $size padding to the bottom at $breakpoint */
.pb-3 {
  padding-bottom: var(--base-size-16, 16px) !important;
}

/* Set a $size padding to the left at $breakpoint */
.pl-3 {
  padding-left: var(--base-size-16, 16px) !important;
}

/* Set a $size padding to the left & right at $breakpoint */
.px-3 {
  padding-right: var(--base-size-16, 16px) !important;
  padding-left: var(--base-size-16, 16px) !important;
}

/* Set a $size padding to the top & bottom at $breakpoint */
.py-3 {
  padding-top: var(--base-size-16, 16px) !important;
  padding-bottom: var(--base-size-16, 16px) !important;
}

/* Set a $size padding to all sides at $breakpoint */
.p-4 {
  padding: var(--base-size-24, 24px) !important;
}

/* Set a $size padding to the top at $breakpoint */
.pt-4 {
  padding-top: var(--base-size-24, 24px) !important;
}

/* Set a $size padding to the right at $breakpoint */
.pr-4 {
  padding-right: var(--base-size-24, 24px) !important;
}

/* Set a $size padding to the bottom at $breakpoint */
.pb-4 {
  padding-bottom: var(--base-size-24, 24px) !important;
}

/* Set a $size padding to the left at $breakpoint */
.pl-4 {
  padding-left: var(--base-size-24, 24px) !important;
}

/* Set a $size padding to the left & right at $breakpoint */
.px-4 {
  padding-right: var(--base-size-24, 24px) !important;
  padding-left: var(--base-size-24, 24px) !important;
}

/* Set a $size padding to the top & bottom at $breakpoint */
.py-4 {
  padding-top: var(--base-size-24, 24px) !important;
  padding-bottom: var(--base-size-24, 24px) !important;
}

/* Set a $size padding to all sides at $breakpoint */
.p-5 {
  padding: var(--base-size-32, 32px) !important;
}

/* Set a $size padding to the top at $breakpoint */
.pt-5 {
  padding-top: var(--base-size-32, 32px) !important;
}

/* Set a $size padding to the right at $breakpoint */
.pr-5 {
  padding-right: var(--base-size-32, 32px) !important;
}

/* Set a $size padding to the bottom at $breakpoint */
.pb-5 {
  padding-bottom: var(--base-size-32, 32px) !important;
}

/* Set a $size padding to the left at $breakpoint */
.pl-5 {
  padding-left: var(--base-size-32, 32px) !important;
}

/* Set a $size padding to the left & right at $breakpoint */
.px-5 {
  padding-right: var(--base-size-32, 32px) !important;
  padding-left: var(--base-size-32, 32px) !important;
}

/* Set a $size padding to the top & bottom at $breakpoint */
.py-5 {
  padding-top: var(--base-size-32, 32px) !important;
  padding-bottom: var(--base-size-32, 32px) !important;
}

/* Set a $size padding to all sides at $breakpoint */
.p-6 {
  padding: var(--base-size-40, 40px) !important;
}

/* Set a $size padding to the top at $breakpoint */
.pt-6 {
  padding-top: var(--base-size-40, 40px) !important;
}

/* Set a $size padding to the right at $breakpoint */
.pr-6 {
  padding-right: var(--base-size-40, 40px) !important;
}

/* Set a $size padding to the bottom at $breakpoint */
.pb-6 {
  padding-bottom: var(--base-size-40, 40px) !important;
}

/* Set a $size padding to the left at $breakpoint */
.pl-6 {
  padding-left: var(--base-size-40, 40px) !important;
}

/* Set a $size padding to the left & right at $breakpoint */
.px-6 {
  padding-right: var(--base-size-40, 40px) !important;
  padding-left: var(--base-size-40, 40px) !important;
}

/* Set a $size padding to the top & bottom at $breakpoint */
.py-6 {
  padding-top: var(--base-size-40, 40px) !important;
  padding-bottom: var(--base-size-40, 40px) !important;
}

/* Set a $size padding to the top at $breakpoint */
.pt-7 {
  padding-top: var(--base-size-48, 48px) !important;
}

/* Set a $size padding to the right at $breakpoint */
.pr-7 {
  padding-right: var(--base-size-48, 48px) !important;
}

/* Set a $size padding to the bottom at $breakpoint */
.pb-7 {
  padding-bottom: var(--base-size-48, 48px) !important;
}

/* Set a $size padding to the left at $breakpoint */
.pl-7 {
  padding-left: var(--base-size-48, 48px) !important;
}

/* Set a $size padding to the top & bottom at $breakpoint */
.py-7 {
  padding-top: var(--base-size-48, 48px) !important;
  padding-bottom: var(--base-size-48, 48px) !important;
}

/* Set a $size padding to the top at $breakpoint */
.pt-8 {
  padding-top: var(--base-size-64, 64px) !important;
}

/* Set a $size padding to the right at $breakpoint */
.pr-8 {
  padding-right: var(--base-size-64, 64px) !important;
}

/* Set a $size padding to the bottom at $breakpoint */
.pb-8 {
  padding-bottom: var(--base-size-64, 64px) !important;
}

/* Set a $size padding to the left at $breakpoint */
.pl-8 {
  padding-left: var(--base-size-64, 64px) !important;
}

/* Set a $size padding to the top & bottom at $breakpoint */
.py-8 {
  padding-top: var(--base-size-64, 64px) !important;
  padding-bottom: var(--base-size-64, 64px) !important;
}

/* Set a $size padding to the top at $breakpoint */
.pt-9 {
  padding-top: var(--base-size-80, 80px) !important;
}

/* Set a $size padding to the right at $breakpoint */
.pr-9 {
  padding-right: var(--base-size-80, 80px) !important;
}

/* Set a $size padding to the bottom at $breakpoint */
.pb-9 {
  padding-bottom: var(--base-size-80, 80px) !important;
}

/* Set a $size padding to the left at $breakpoint */
.pl-9 {
  padding-left: var(--base-size-80, 80px) !important;
}

/* Set a $size padding to the top & bottom at $breakpoint */
.py-9 {
  padding-top: var(--base-size-80, 80px) !important;
  padding-bottom: var(--base-size-80, 80px) !important;
}

/* Set a $size padding to the top at $breakpoint */
.pt-10 {
  padding-top: var(--base-size-96, 96px) !important;
}

/* Set a $size padding to the right at $breakpoint */
.pr-10 {
  padding-right: var(--base-size-96, 96px) !important;
}

/* Set a $size padding to the bottom at $breakpoint */
.pb-10 {
  padding-bottom: var(--base-size-96, 96px) !important;
}

/* Set a $size padding to the left at $breakpoint */
.pl-10 {
  padding-left: var(--base-size-96, 96px) !important;
}

/* Set a $size padding to the top & bottom at $breakpoint */
.py-10 {
  padding-top: var(--base-size-96, 96px) !important;
  padding-bottom: var(--base-size-96, 96px) !important;
}

/* Set a $size padding to the top at $breakpoint */
.pt-11 {
  padding-top: var(--base-size-112, 112px) !important;
}

/* Set a $size padding to the right at $breakpoint */
.pr-11 {
  padding-right: var(--base-size-112, 112px) !important;
}

/* Set a $size padding to the bottom at $breakpoint */
.pb-11 {
  padding-bottom: var(--base-size-112, 112px) !important;
}

/* Set a $size padding to the left at $breakpoint */
.pl-11 {
  padding-left: var(--base-size-112, 112px) !important;
}

/* Set a $size padding to the top & bottom at $breakpoint */
.py-11 {
  padding-top: var(--base-size-112, 112px) !important;
  padding-bottom: var(--base-size-112, 112px) !important;
}

/* Set a $size padding to the top at $breakpoint */
.pt-12 {
  padding-top: var(--base-size-128, 128px) !important;
}

/* Set a $size padding to the right at $breakpoint */
.pr-12 {
  padding-right: var(--base-size-128, 128px) !important;
}

/* Set a $size padding to the bottom at $breakpoint */
.pb-12 {
  padding-bottom: var(--base-size-128, 128px) !important;
}

/* Set a $size padding to the left at $breakpoint */
.pl-12 {
  padding-left: var(--base-size-128, 128px) !important;
}

/* Set a $size padding to the top & bottom at $breakpoint */
.py-12 {
  padding-top: var(--base-size-128, 128px) !important;
  padding-bottom: var(--base-size-128, 128px) !important;
}

@media (min-width: 544px) {
  /* Set a $size padding to all sides at $breakpoint */
  .p-sm-0 {
    padding: 0 !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-sm-0 {
    padding-top: 0 !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-sm-0 {
    padding-right: 0 !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-sm-0 {
    padding-bottom: 0 !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-sm-0 {
    padding-left: 0 !important;
  }
  /* Set a $size padding to the left & right at $breakpoint */
  .px-sm-0 {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-sm-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  /* Set a $size padding to all sides at $breakpoint */
  .p-sm-1 {
    padding: var(--base-size-4, 4px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-sm-1 {
    padding-top: var(--base-size-4, 4px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-sm-1 {
    padding-right: var(--base-size-4, 4px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-sm-1 {
    padding-bottom: var(--base-size-4, 4px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-sm-1 {
    padding-left: var(--base-size-4, 4px) !important;
  }
  /* Set a $size padding to the left & right at $breakpoint */
  .px-sm-1 {
    padding-right: var(--base-size-4, 4px) !important;
    padding-left: var(--base-size-4, 4px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-sm-1 {
    padding-top: var(--base-size-4, 4px) !important;
    padding-bottom: var(--base-size-4, 4px) !important;
  }
  /* Set a $size padding to all sides at $breakpoint */
  .p-sm-2 {
    padding: var(--base-size-8, 8px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-sm-2 {
    padding-top: var(--base-size-8, 8px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-sm-2 {
    padding-right: var(--base-size-8, 8px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-sm-2 {
    padding-bottom: var(--base-size-8, 8px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-sm-2 {
    padding-left: var(--base-size-8, 8px) !important;
  }
  /* Set a $size padding to the left & right at $breakpoint */
  .px-sm-2 {
    padding-right: var(--base-size-8, 8px) !important;
    padding-left: var(--base-size-8, 8px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-sm-2 {
    padding-top: var(--base-size-8, 8px) !important;
    padding-bottom: var(--base-size-8, 8px) !important;
  }
  /* Set a $size padding to all sides at $breakpoint */
  .p-sm-3 {
    padding: var(--base-size-16, 16px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-sm-3 {
    padding-top: var(--base-size-16, 16px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-sm-3 {
    padding-right: var(--base-size-16, 16px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-sm-3 {
    padding-bottom: var(--base-size-16, 16px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-sm-3 {
    padding-left: var(--base-size-16, 16px) !important;
  }
  /* Set a $size padding to the left & right at $breakpoint */
  .px-sm-3 {
    padding-right: var(--base-size-16, 16px) !important;
    padding-left: var(--base-size-16, 16px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-sm-3 {
    padding-top: var(--base-size-16, 16px) !important;
    padding-bottom: var(--base-size-16, 16px) !important;
  }
  /* Set a $size padding to all sides at $breakpoint */
  .p-sm-4 {
    padding: var(--base-size-24, 24px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-sm-4 {
    padding-top: var(--base-size-24, 24px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-sm-4 {
    padding-right: var(--base-size-24, 24px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-sm-4 {
    padding-bottom: var(--base-size-24, 24px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-sm-4 {
    padding-left: var(--base-size-24, 24px) !important;
  }
  /* Set a $size padding to the left & right at $breakpoint */
  .px-sm-4 {
    padding-right: var(--base-size-24, 24px) !important;
    padding-left: var(--base-size-24, 24px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-sm-4 {
    padding-top: var(--base-size-24, 24px) !important;
    padding-bottom: var(--base-size-24, 24px) !important;
  }
  /* Set a $size padding to all sides at $breakpoint */
  .p-sm-5 {
    padding: var(--base-size-32, 32px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-sm-5 {
    padding-top: var(--base-size-32, 32px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-sm-5 {
    padding-right: var(--base-size-32, 32px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-sm-5 {
    padding-bottom: var(--base-size-32, 32px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-sm-5 {
    padding-left: var(--base-size-32, 32px) !important;
  }
  /* Set a $size padding to the left & right at $breakpoint */
  .px-sm-5 {
    padding-right: var(--base-size-32, 32px) !important;
    padding-left: var(--base-size-32, 32px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-sm-5 {
    padding-top: var(--base-size-32, 32px) !important;
    padding-bottom: var(--base-size-32, 32px) !important;
  }
  /* Set a $size padding to all sides at $breakpoint */
  .p-sm-6 {
    padding: var(--base-size-40, 40px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-sm-6 {
    padding-top: var(--base-size-40, 40px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-sm-6 {
    padding-right: var(--base-size-40, 40px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-sm-6 {
    padding-bottom: var(--base-size-40, 40px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-sm-6 {
    padding-left: var(--base-size-40, 40px) !important;
  }
  /* Set a $size padding to the left & right at $breakpoint */
  .px-sm-6 {
    padding-right: var(--base-size-40, 40px) !important;
    padding-left: var(--base-size-40, 40px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-sm-6 {
    padding-top: var(--base-size-40, 40px) !important;
    padding-bottom: var(--base-size-40, 40px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-sm-7 {
    padding-top: var(--base-size-48, 48px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-sm-7 {
    padding-right: var(--base-size-48, 48px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-sm-7 {
    padding-bottom: var(--base-size-48, 48px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-sm-7 {
    padding-left: var(--base-size-48, 48px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-sm-7 {
    padding-top: var(--base-size-48, 48px) !important;
    padding-bottom: var(--base-size-48, 48px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-sm-8 {
    padding-top: var(--base-size-64, 64px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-sm-8 {
    padding-right: var(--base-size-64, 64px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-sm-8 {
    padding-bottom: var(--base-size-64, 64px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-sm-8 {
    padding-left: var(--base-size-64, 64px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-sm-8 {
    padding-top: var(--base-size-64, 64px) !important;
    padding-bottom: var(--base-size-64, 64px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-sm-9 {
    padding-top: var(--base-size-80, 80px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-sm-9 {
    padding-right: var(--base-size-80, 80px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-sm-9 {
    padding-bottom: var(--base-size-80, 80px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-sm-9 {
    padding-left: var(--base-size-80, 80px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-sm-9 {
    padding-top: var(--base-size-80, 80px) !important;
    padding-bottom: var(--base-size-80, 80px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-sm-10 {
    padding-top: var(--base-size-96, 96px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-sm-10 {
    padding-right: var(--base-size-96, 96px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-sm-10 {
    padding-bottom: var(--base-size-96, 96px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-sm-10 {
    padding-left: var(--base-size-96, 96px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-sm-10 {
    padding-top: var(--base-size-96, 96px) !important;
    padding-bottom: var(--base-size-96, 96px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-sm-11 {
    padding-top: var(--base-size-112, 112px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-sm-11 {
    padding-right: var(--base-size-112, 112px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-sm-11 {
    padding-bottom: var(--base-size-112, 112px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-sm-11 {
    padding-left: var(--base-size-112, 112px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-sm-11 {
    padding-top: var(--base-size-112, 112px) !important;
    padding-bottom: var(--base-size-112, 112px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-sm-12 {
    padding-top: var(--base-size-128, 128px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-sm-12 {
    padding-right: var(--base-size-128, 128px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-sm-12 {
    padding-bottom: var(--base-size-128, 128px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-sm-12 {
    padding-left: var(--base-size-128, 128px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-sm-12 {
    padding-top: var(--base-size-128, 128px) !important;
    padding-bottom: var(--base-size-128, 128px) !important;
  }
}
@media (min-width: 768px) {
  /* Set a $size padding to all sides at $breakpoint */
  .p-md-0 {
    padding: 0 !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-md-0 {
    padding-top: 0 !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-md-0 {
    padding-right: 0 !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-md-0 {
    padding-bottom: 0 !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-md-0 {
    padding-left: 0 !important;
  }
  /* Set a $size padding to the left & right at $breakpoint */
  .px-md-0 {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-md-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  /* Set a $size padding to all sides at $breakpoint */
  .p-md-1 {
    padding: var(--base-size-4, 4px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-md-1 {
    padding-top: var(--base-size-4, 4px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-md-1 {
    padding-right: var(--base-size-4, 4px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-md-1 {
    padding-bottom: var(--base-size-4, 4px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-md-1 {
    padding-left: var(--base-size-4, 4px) !important;
  }
  /* Set a $size padding to the left & right at $breakpoint */
  .px-md-1 {
    padding-right: var(--base-size-4, 4px) !important;
    padding-left: var(--base-size-4, 4px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-md-1 {
    padding-top: var(--base-size-4, 4px) !important;
    padding-bottom: var(--base-size-4, 4px) !important;
  }
  /* Set a $size padding to all sides at $breakpoint */
  .p-md-2 {
    padding: var(--base-size-8, 8px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-md-2 {
    padding-top: var(--base-size-8, 8px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-md-2 {
    padding-right: var(--base-size-8, 8px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-md-2 {
    padding-bottom: var(--base-size-8, 8px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-md-2 {
    padding-left: var(--base-size-8, 8px) !important;
  }
  /* Set a $size padding to the left & right at $breakpoint */
  .px-md-2 {
    padding-right: var(--base-size-8, 8px) !important;
    padding-left: var(--base-size-8, 8px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-md-2 {
    padding-top: var(--base-size-8, 8px) !important;
    padding-bottom: var(--base-size-8, 8px) !important;
  }
  /* Set a $size padding to all sides at $breakpoint */
  .p-md-3 {
    padding: var(--base-size-16, 16px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-md-3 {
    padding-top: var(--base-size-16, 16px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-md-3 {
    padding-right: var(--base-size-16, 16px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-md-3 {
    padding-bottom: var(--base-size-16, 16px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-md-3 {
    padding-left: var(--base-size-16, 16px) !important;
  }
  /* Set a $size padding to the left & right at $breakpoint */
  .px-md-3 {
    padding-right: var(--base-size-16, 16px) !important;
    padding-left: var(--base-size-16, 16px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-md-3 {
    padding-top: var(--base-size-16, 16px) !important;
    padding-bottom: var(--base-size-16, 16px) !important;
  }
  /* Set a $size padding to all sides at $breakpoint */
  .p-md-4 {
    padding: var(--base-size-24, 24px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-md-4 {
    padding-top: var(--base-size-24, 24px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-md-4 {
    padding-right: var(--base-size-24, 24px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-md-4 {
    padding-bottom: var(--base-size-24, 24px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-md-4 {
    padding-left: var(--base-size-24, 24px) !important;
  }
  /* Set a $size padding to the left & right at $breakpoint */
  .px-md-4 {
    padding-right: var(--base-size-24, 24px) !important;
    padding-left: var(--base-size-24, 24px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-md-4 {
    padding-top: var(--base-size-24, 24px) !important;
    padding-bottom: var(--base-size-24, 24px) !important;
  }
  /* Set a $size padding to all sides at $breakpoint */
  .p-md-5 {
    padding: var(--base-size-32, 32px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-md-5 {
    padding-top: var(--base-size-32, 32px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-md-5 {
    padding-right: var(--base-size-32, 32px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-md-5 {
    padding-bottom: var(--base-size-32, 32px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-md-5 {
    padding-left: var(--base-size-32, 32px) !important;
  }
  /* Set a $size padding to the left & right at $breakpoint */
  .px-md-5 {
    padding-right: var(--base-size-32, 32px) !important;
    padding-left: var(--base-size-32, 32px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-md-5 {
    padding-top: var(--base-size-32, 32px) !important;
    padding-bottom: var(--base-size-32, 32px) !important;
  }
  /* Set a $size padding to all sides at $breakpoint */
  .p-md-6 {
    padding: var(--base-size-40, 40px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-md-6 {
    padding-top: var(--base-size-40, 40px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-md-6 {
    padding-right: var(--base-size-40, 40px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-md-6 {
    padding-bottom: var(--base-size-40, 40px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-md-6 {
    padding-left: var(--base-size-40, 40px) !important;
  }
  /* Set a $size padding to the left & right at $breakpoint */
  .px-md-6 {
    padding-right: var(--base-size-40, 40px) !important;
    padding-left: var(--base-size-40, 40px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-md-6 {
    padding-top: var(--base-size-40, 40px) !important;
    padding-bottom: var(--base-size-40, 40px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-md-7 {
    padding-top: var(--base-size-48, 48px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-md-7 {
    padding-right: var(--base-size-48, 48px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-md-7 {
    padding-bottom: var(--base-size-48, 48px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-md-7 {
    padding-left: var(--base-size-48, 48px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-md-7 {
    padding-top: var(--base-size-48, 48px) !important;
    padding-bottom: var(--base-size-48, 48px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-md-8 {
    padding-top: var(--base-size-64, 64px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-md-8 {
    padding-right: var(--base-size-64, 64px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-md-8 {
    padding-bottom: var(--base-size-64, 64px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-md-8 {
    padding-left: var(--base-size-64, 64px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-md-8 {
    padding-top: var(--base-size-64, 64px) !important;
    padding-bottom: var(--base-size-64, 64px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-md-9 {
    padding-top: var(--base-size-80, 80px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-md-9 {
    padding-right: var(--base-size-80, 80px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-md-9 {
    padding-bottom: var(--base-size-80, 80px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-md-9 {
    padding-left: var(--base-size-80, 80px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-md-9 {
    padding-top: var(--base-size-80, 80px) !important;
    padding-bottom: var(--base-size-80, 80px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-md-10 {
    padding-top: var(--base-size-96, 96px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-md-10 {
    padding-right: var(--base-size-96, 96px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-md-10 {
    padding-bottom: var(--base-size-96, 96px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-md-10 {
    padding-left: var(--base-size-96, 96px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-md-10 {
    padding-top: var(--base-size-96, 96px) !important;
    padding-bottom: var(--base-size-96, 96px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-md-11 {
    padding-top: var(--base-size-112, 112px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-md-11 {
    padding-right: var(--base-size-112, 112px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-md-11 {
    padding-bottom: var(--base-size-112, 112px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-md-11 {
    padding-left: var(--base-size-112, 112px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-md-11 {
    padding-top: var(--base-size-112, 112px) !important;
    padding-bottom: var(--base-size-112, 112px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-md-12 {
    padding-top: var(--base-size-128, 128px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-md-12 {
    padding-right: var(--base-size-128, 128px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-md-12 {
    padding-bottom: var(--base-size-128, 128px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-md-12 {
    padding-left: var(--base-size-128, 128px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-md-12 {
    padding-top: var(--base-size-128, 128px) !important;
    padding-bottom: var(--base-size-128, 128px) !important;
  }
}
@media (min-width: 1012px) {
  /* Set a $size padding to all sides at $breakpoint */
  .p-lg-0 {
    padding: 0 !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-lg-0 {
    padding-top: 0 !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-lg-0 {
    padding-right: 0 !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-lg-0 {
    padding-bottom: 0 !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-lg-0 {
    padding-left: 0 !important;
  }
  /* Set a $size padding to the left & right at $breakpoint */
  .px-lg-0 {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-lg-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  /* Set a $size padding to all sides at $breakpoint */
  .p-lg-1 {
    padding: var(--base-size-4, 4px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-lg-1 {
    padding-top: var(--base-size-4, 4px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-lg-1 {
    padding-right: var(--base-size-4, 4px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-lg-1 {
    padding-bottom: var(--base-size-4, 4px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-lg-1 {
    padding-left: var(--base-size-4, 4px) !important;
  }
  /* Set a $size padding to the left & right at $breakpoint */
  .px-lg-1 {
    padding-right: var(--base-size-4, 4px) !important;
    padding-left: var(--base-size-4, 4px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-lg-1 {
    padding-top: var(--base-size-4, 4px) !important;
    padding-bottom: var(--base-size-4, 4px) !important;
  }
  /* Set a $size padding to all sides at $breakpoint */
  .p-lg-2 {
    padding: var(--base-size-8, 8px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-lg-2 {
    padding-top: var(--base-size-8, 8px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-lg-2 {
    padding-right: var(--base-size-8, 8px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-lg-2 {
    padding-bottom: var(--base-size-8, 8px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-lg-2 {
    padding-left: var(--base-size-8, 8px) !important;
  }
  /* Set a $size padding to the left & right at $breakpoint */
  .px-lg-2 {
    padding-right: var(--base-size-8, 8px) !important;
    padding-left: var(--base-size-8, 8px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-lg-2 {
    padding-top: var(--base-size-8, 8px) !important;
    padding-bottom: var(--base-size-8, 8px) !important;
  }
  /* Set a $size padding to all sides at $breakpoint */
  .p-lg-3 {
    padding: var(--base-size-16, 16px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-lg-3 {
    padding-top: var(--base-size-16, 16px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-lg-3 {
    padding-right: var(--base-size-16, 16px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-lg-3 {
    padding-bottom: var(--base-size-16, 16px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-lg-3 {
    padding-left: var(--base-size-16, 16px) !important;
  }
  /* Set a $size padding to the left & right at $breakpoint */
  .px-lg-3 {
    padding-right: var(--base-size-16, 16px) !important;
    padding-left: var(--base-size-16, 16px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-lg-3 {
    padding-top: var(--base-size-16, 16px) !important;
    padding-bottom: var(--base-size-16, 16px) !important;
  }
  /* Set a $size padding to all sides at $breakpoint */
  .p-lg-4 {
    padding: var(--base-size-24, 24px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-lg-4 {
    padding-top: var(--base-size-24, 24px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-lg-4 {
    padding-right: var(--base-size-24, 24px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-lg-4 {
    padding-bottom: var(--base-size-24, 24px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-lg-4 {
    padding-left: var(--base-size-24, 24px) !important;
  }
  /* Set a $size padding to the left & right at $breakpoint */
  .px-lg-4 {
    padding-right: var(--base-size-24, 24px) !important;
    padding-left: var(--base-size-24, 24px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-lg-4 {
    padding-top: var(--base-size-24, 24px) !important;
    padding-bottom: var(--base-size-24, 24px) !important;
  }
  /* Set a $size padding to all sides at $breakpoint */
  .p-lg-5 {
    padding: var(--base-size-32, 32px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-lg-5 {
    padding-top: var(--base-size-32, 32px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-lg-5 {
    padding-right: var(--base-size-32, 32px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-lg-5 {
    padding-bottom: var(--base-size-32, 32px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-lg-5 {
    padding-left: var(--base-size-32, 32px) !important;
  }
  /* Set a $size padding to the left & right at $breakpoint */
  .px-lg-5 {
    padding-right: var(--base-size-32, 32px) !important;
    padding-left: var(--base-size-32, 32px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-lg-5 {
    padding-top: var(--base-size-32, 32px) !important;
    padding-bottom: var(--base-size-32, 32px) !important;
  }
  /* Set a $size padding to all sides at $breakpoint */
  .p-lg-6 {
    padding: var(--base-size-40, 40px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-lg-6 {
    padding-top: var(--base-size-40, 40px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-lg-6 {
    padding-right: var(--base-size-40, 40px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-lg-6 {
    padding-bottom: var(--base-size-40, 40px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-lg-6 {
    padding-left: var(--base-size-40, 40px) !important;
  }
  /* Set a $size padding to the left & right at $breakpoint */
  .px-lg-6 {
    padding-right: var(--base-size-40, 40px) !important;
    padding-left: var(--base-size-40, 40px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-lg-6 {
    padding-top: var(--base-size-40, 40px) !important;
    padding-bottom: var(--base-size-40, 40px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-lg-7 {
    padding-top: var(--base-size-48, 48px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-lg-7 {
    padding-right: var(--base-size-48, 48px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-lg-7 {
    padding-bottom: var(--base-size-48, 48px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-lg-7 {
    padding-left: var(--base-size-48, 48px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-lg-7 {
    padding-top: var(--base-size-48, 48px) !important;
    padding-bottom: var(--base-size-48, 48px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-lg-8 {
    padding-top: var(--base-size-64, 64px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-lg-8 {
    padding-right: var(--base-size-64, 64px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-lg-8 {
    padding-bottom: var(--base-size-64, 64px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-lg-8 {
    padding-left: var(--base-size-64, 64px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-lg-8 {
    padding-top: var(--base-size-64, 64px) !important;
    padding-bottom: var(--base-size-64, 64px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-lg-9 {
    padding-top: var(--base-size-80, 80px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-lg-9 {
    padding-right: var(--base-size-80, 80px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-lg-9 {
    padding-bottom: var(--base-size-80, 80px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-lg-9 {
    padding-left: var(--base-size-80, 80px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-lg-9 {
    padding-top: var(--base-size-80, 80px) !important;
    padding-bottom: var(--base-size-80, 80px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-lg-10 {
    padding-top: var(--base-size-96, 96px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-lg-10 {
    padding-right: var(--base-size-96, 96px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-lg-10 {
    padding-bottom: var(--base-size-96, 96px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-lg-10 {
    padding-left: var(--base-size-96, 96px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-lg-10 {
    padding-top: var(--base-size-96, 96px) !important;
    padding-bottom: var(--base-size-96, 96px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-lg-11 {
    padding-top: var(--base-size-112, 112px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-lg-11 {
    padding-right: var(--base-size-112, 112px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-lg-11 {
    padding-bottom: var(--base-size-112, 112px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-lg-11 {
    padding-left: var(--base-size-112, 112px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-lg-11 {
    padding-top: var(--base-size-112, 112px) !important;
    padding-bottom: var(--base-size-112, 112px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-lg-12 {
    padding-top: var(--base-size-128, 128px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-lg-12 {
    padding-right: var(--base-size-128, 128px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-lg-12 {
    padding-bottom: var(--base-size-128, 128px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-lg-12 {
    padding-left: var(--base-size-128, 128px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-lg-12 {
    padding-top: var(--base-size-128, 128px) !important;
    padding-bottom: var(--base-size-128, 128px) !important;
  }
}
@media (min-width: 1280px) {
  /* Set a $size padding to all sides at $breakpoint */
  .p-xl-0 {
    padding: 0 !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-xl-0 {
    padding-top: 0 !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-xl-0 {
    padding-right: 0 !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-xl-0 {
    padding-bottom: 0 !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-xl-0 {
    padding-left: 0 !important;
  }
  /* Set a $size padding to the left & right at $breakpoint */
  .px-xl-0 {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-xl-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  /* Set a $size padding to all sides at $breakpoint */
  .p-xl-1 {
    padding: var(--base-size-4, 4px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-xl-1 {
    padding-top: var(--base-size-4, 4px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-xl-1 {
    padding-right: var(--base-size-4, 4px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-xl-1 {
    padding-bottom: var(--base-size-4, 4px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-xl-1 {
    padding-left: var(--base-size-4, 4px) !important;
  }
  /* Set a $size padding to the left & right at $breakpoint */
  .px-xl-1 {
    padding-right: var(--base-size-4, 4px) !important;
    padding-left: var(--base-size-4, 4px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-xl-1 {
    padding-top: var(--base-size-4, 4px) !important;
    padding-bottom: var(--base-size-4, 4px) !important;
  }
  /* Set a $size padding to all sides at $breakpoint */
  .p-xl-2 {
    padding: var(--base-size-8, 8px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-xl-2 {
    padding-top: var(--base-size-8, 8px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-xl-2 {
    padding-right: var(--base-size-8, 8px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-xl-2 {
    padding-bottom: var(--base-size-8, 8px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-xl-2 {
    padding-left: var(--base-size-8, 8px) !important;
  }
  /* Set a $size padding to the left & right at $breakpoint */
  .px-xl-2 {
    padding-right: var(--base-size-8, 8px) !important;
    padding-left: var(--base-size-8, 8px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-xl-2 {
    padding-top: var(--base-size-8, 8px) !important;
    padding-bottom: var(--base-size-8, 8px) !important;
  }
  /* Set a $size padding to all sides at $breakpoint */
  .p-xl-3 {
    padding: var(--base-size-16, 16px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-xl-3 {
    padding-top: var(--base-size-16, 16px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-xl-3 {
    padding-right: var(--base-size-16, 16px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-xl-3 {
    padding-bottom: var(--base-size-16, 16px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-xl-3 {
    padding-left: var(--base-size-16, 16px) !important;
  }
  /* Set a $size padding to the left & right at $breakpoint */
  .px-xl-3 {
    padding-right: var(--base-size-16, 16px) !important;
    padding-left: var(--base-size-16, 16px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-xl-3 {
    padding-top: var(--base-size-16, 16px) !important;
    padding-bottom: var(--base-size-16, 16px) !important;
  }
  /* Set a $size padding to all sides at $breakpoint */
  .p-xl-4 {
    padding: var(--base-size-24, 24px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-xl-4 {
    padding-top: var(--base-size-24, 24px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-xl-4 {
    padding-right: var(--base-size-24, 24px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-xl-4 {
    padding-bottom: var(--base-size-24, 24px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-xl-4 {
    padding-left: var(--base-size-24, 24px) !important;
  }
  /* Set a $size padding to the left & right at $breakpoint */
  .px-xl-4 {
    padding-right: var(--base-size-24, 24px) !important;
    padding-left: var(--base-size-24, 24px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-xl-4 {
    padding-top: var(--base-size-24, 24px) !important;
    padding-bottom: var(--base-size-24, 24px) !important;
  }
  /* Set a $size padding to all sides at $breakpoint */
  .p-xl-5 {
    padding: var(--base-size-32, 32px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-xl-5 {
    padding-top: var(--base-size-32, 32px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-xl-5 {
    padding-right: var(--base-size-32, 32px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-xl-5 {
    padding-bottom: var(--base-size-32, 32px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-xl-5 {
    padding-left: var(--base-size-32, 32px) !important;
  }
  /* Set a $size padding to the left & right at $breakpoint */
  .px-xl-5 {
    padding-right: var(--base-size-32, 32px) !important;
    padding-left: var(--base-size-32, 32px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-xl-5 {
    padding-top: var(--base-size-32, 32px) !important;
    padding-bottom: var(--base-size-32, 32px) !important;
  }
  /* Set a $size padding to all sides at $breakpoint */
  .p-xl-6 {
    padding: var(--base-size-40, 40px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-xl-6 {
    padding-top: var(--base-size-40, 40px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-xl-6 {
    padding-right: var(--base-size-40, 40px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-xl-6 {
    padding-bottom: var(--base-size-40, 40px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-xl-6 {
    padding-left: var(--base-size-40, 40px) !important;
  }
  /* Set a $size padding to the left & right at $breakpoint */
  .px-xl-6 {
    padding-right: var(--base-size-40, 40px) !important;
    padding-left: var(--base-size-40, 40px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-xl-6 {
    padding-top: var(--base-size-40, 40px) !important;
    padding-bottom: var(--base-size-40, 40px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-xl-7 {
    padding-top: var(--base-size-48, 48px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-xl-7 {
    padding-right: var(--base-size-48, 48px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-xl-7 {
    padding-bottom: var(--base-size-48, 48px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-xl-7 {
    padding-left: var(--base-size-48, 48px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-xl-7 {
    padding-top: var(--base-size-48, 48px) !important;
    padding-bottom: var(--base-size-48, 48px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-xl-8 {
    padding-top: var(--base-size-64, 64px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-xl-8 {
    padding-right: var(--base-size-64, 64px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-xl-8 {
    padding-bottom: var(--base-size-64, 64px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-xl-8 {
    padding-left: var(--base-size-64, 64px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-xl-8 {
    padding-top: var(--base-size-64, 64px) !important;
    padding-bottom: var(--base-size-64, 64px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-xl-9 {
    padding-top: var(--base-size-80, 80px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-xl-9 {
    padding-right: var(--base-size-80, 80px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-xl-9 {
    padding-bottom: var(--base-size-80, 80px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-xl-9 {
    padding-left: var(--base-size-80, 80px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-xl-9 {
    padding-top: var(--base-size-80, 80px) !important;
    padding-bottom: var(--base-size-80, 80px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-xl-10 {
    padding-top: var(--base-size-96, 96px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-xl-10 {
    padding-right: var(--base-size-96, 96px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-xl-10 {
    padding-bottom: var(--base-size-96, 96px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-xl-10 {
    padding-left: var(--base-size-96, 96px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-xl-10 {
    padding-top: var(--base-size-96, 96px) !important;
    padding-bottom: var(--base-size-96, 96px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-xl-11 {
    padding-top: var(--base-size-112, 112px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-xl-11 {
    padding-right: var(--base-size-112, 112px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-xl-11 {
    padding-bottom: var(--base-size-112, 112px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-xl-11 {
    padding-left: var(--base-size-112, 112px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-xl-11 {
    padding-top: var(--base-size-112, 112px) !important;
    padding-bottom: var(--base-size-112, 112px) !important;
  }
  /* Set a $size padding to the top at $breakpoint */
  .pt-xl-12 {
    padding-top: var(--base-size-128, 128px) !important;
  }
  /* Set a $size padding to the right at $breakpoint */
  .pr-xl-12 {
    padding-right: var(--base-size-128, 128px) !important;
  }
  /* Set a $size padding to the bottom at $breakpoint */
  .pb-xl-12 {
    padding-bottom: var(--base-size-128, 128px) !important;
  }
  /* Set a $size padding to the left at $breakpoint */
  .pl-xl-12 {
    padding-left: var(--base-size-128, 128px) !important;
  }
  /* Set a $size padding to the top & bottom at $breakpoint */
  .py-xl-12 {
    padding-top: var(--base-size-128, 128px) !important;
    padding-bottom: var(--base-size-128, 128px) !important;
  }
}
.p-responsive {
  padding-right: var(--base-size-16) !important;
  padding-left: var(--base-size-16) !important;
}
@media (min-width: 544px) {
  .p-responsive {
    padding-right: var(--base-size-40) !important;
    padding-left: var(--base-size-40) !important;
  }
}
@media (min-width: 1012px) {
  .p-responsive {
    padding-right: var(--base-size-16) !important;
    padding-left: var(--base-size-16) !important;
  }
}

/* Set the font size to 26px */
.h1 {
  font-size: var(--h1-size-mobile, 26px) !important;
}
@media (min-width: 768px) {
  .h1 {
    font-size: var(--h1-size, 32px) !important;
  }
}

/* Set the font size to 22px */
.h2 {
  font-size: var(--h2-size-mobile, 22px) !important;
}
@media (min-width: 768px) {
  .h2 {
    font-size: var(--h2-size, 24px) !important;
  }
}

/* Set the font size to 18px */
.h3 {
  font-size: var(--h3-size-mobile, 18px) !important;
}
@media (min-width: 768px) {
  .h3 {
    font-size: var(--h3-size, 20px) !important;
  }
}

/* Set the font size to 16px */
.h4 {
  font-size: var(--h4-size, 16px) !important;
}

/* Set the font size to 14px */
.h5 {
  font-size: var(--h5-size, 14px) !important;
}

/* Set the font size to 12px */
.h6 {
  font-size: var(--h6-size, 12px) !important;
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  font-weight: var(--base-text-weight-semibold, 600) !important;
}

/* Set the font size to 26px */
.f1 {
  font-size: var(--h1-size-mobile, 26px) !important;
}
@media (min-width: 768px) {
  .f1 {
    font-size: var(--h1-size, 32px) !important;
  }
}

/* Set the font size to 22px */
.f2 {
  font-size: var(--h2-size-mobile, 22px) !important;
}
@media (min-width: 768px) {
  .f2 {
    font-size: var(--h2-size, 24px) !important;
  }
}

/* Set the font size to 18px */
.f3 {
  font-size: var(--h3-size-mobile, 18px) !important;
}
@media (min-width: 768px) {
  .f3 {
    font-size: var(--h3-size, 20px) !important;
  }
}

/* Set the font size to 16px */
.f4 {
  font-size: var(--h4-size, 16px) !important;
}
@media (min-width: 768px) {
  .f4 {
    font-size: var(--h4-size, 16px) !important;
  }
}

/* Set the font size to 14px */
.f5 {
  font-size: var(--h5-size, 14px) !important;
}

/* Set the font size to 12px */
.f6 {
  font-size: var(--h6-size, 12px) !important;
}

/* Set the font size to 40px and weight to light */
.f00-light {
  font-size: var(--h00-size-mobile, 40px) !important;
  font-weight: var(--base-text-weight-light, 300) !important;
}
@media (min-width: 768px) {
  .f00-light {
    font-size: var(--h00-size, 48px) !important;
  }
}

/* Set the font size to 32px and weight to light */
.f0-light {
  font-size: var(--h0-size-mobile, 32px) !important;
  font-weight: var(--base-text-weight-light, 300) !important;
}
@media (min-width: 768px) {
  .f0-light {
    font-size: var(--h0-size, 40px) !important;
  }
}

/* Set the font size to 26px and weight to light */
.f1-light {
  font-size: var(--h1-size-mobile, 26px) !important;
  font-weight: var(--base-text-weight-light, 300) !important;
}
@media (min-width: 768px) {
  .f1-light {
    font-size: var(--h1-size, 32px) !important;
  }
}

/* Set the font size to 22px and weight to light */
.f2-light {
  font-size: var(--h2-size-mobile, 22px) !important;
  font-weight: var(--base-text-weight-light, 300) !important;
}
@media (min-width: 768px) {
  .f2-light {
    font-size: var(--h2-size, 24px) !important;
  }
}

/* Set the font size to 18px and weight to light */
.f3-light {
  font-size: var(--h3-size-mobile, 18px) !important;
  font-weight: var(--base-text-weight-light, 300) !important;
}
@media (min-width: 768px) {
  .f3-light {
    font-size: var(--h3-size, 20px) !important;
  }
}

/* Set the font size to ${#h6-size} */
.text-small {
  font-size: var(--h6-size, 12px) !important;
}

/* Large leading paragraphs */
.lead {
  margin-bottom: 30px;
  font-size: var(--h3-size, 20px);
  font-weight: var(--base-text-weight-light, 300);
}

/* Set the line height to ultra condensed */
.lh-condensed-ultra {
  line-height: 1 !important;
}

/* Set the line height to condensed */
.lh-condensed {
  line-height: 1.25 !important;
}

/* Set the line height to default */
.lh-default {
  line-height: 1.5 !important;
}

/* Set the line height to zero */
.lh-0 {
  line-height: 0 !important;
}

@media (min-width: 544px) {
  /* Set the line height to ultra condensed */
  .lh-sm-condensed-ultra {
    line-height: 1 !important;
  }
  /* Set the line height to condensed */
  .lh-sm-condensed {
    line-height: 1.25 !important;
  }
  /* Set the line height to default */
  .lh-sm-default {
    line-height: 1.5 !important;
  }
  /* Set the line height to zero */
  .lh-sm-0 {
    line-height: 0 !important;
  }
}
@media (min-width: 768px) {
  /* Set the line height to ultra condensed */
  .lh-md-condensed-ultra {
    line-height: 1 !important;
  }
  /* Set the line height to condensed */
  .lh-md-condensed {
    line-height: 1.25 !important;
  }
  /* Set the line height to default */
  .lh-md-default {
    line-height: 1.5 !important;
  }
  /* Set the line height to zero */
  .lh-md-0 {
    line-height: 0 !important;
  }
}
@media (min-width: 1012px) {
  /* Set the line height to ultra condensed */
  .lh-lg-condensed-ultra {
    line-height: 1 !important;
  }
  /* Set the line height to condensed */
  .lh-lg-condensed {
    line-height: 1.25 !important;
  }
  /* Set the line height to default */
  .lh-lg-default {
    line-height: 1.5 !important;
  }
  /* Set the line height to zero */
  .lh-lg-0 {
    line-height: 0 !important;
  }
}
@media (min-width: 1280px) {
  /* Set the line height to ultra condensed */
  .lh-xl-condensed-ultra {
    line-height: 1 !important;
  }
  /* Set the line height to condensed */
  .lh-xl-condensed {
    line-height: 1.25 !important;
  }
  /* Set the line height to default */
  .lh-xl-default {
    line-height: 1.5 !important;
  }
  /* Set the line height to zero */
  .lh-xl-0 {
    line-height: 0 !important;
  }
}
/* Text align to the right */
.text-right {
  text-align: right !important;
}

/* Text align to the left */
.text-left {
  text-align: left !important;
}

/* Text align to the center */
.text-center {
  text-align: center !important;
}

@media (min-width: 544px) {
  /* Text align to the right */
  .text-sm-right {
    text-align: right !important;
  }
  /* Text align to the left */
  .text-sm-left {
    text-align: left !important;
  }
  /* Text align to the center */
  .text-sm-center {
    text-align: center !important;
  }
}
@media (min-width: 768px) {
  /* Text align to the right */
  .text-md-right {
    text-align: right !important;
  }
  /* Text align to the left */
  .text-md-left {
    text-align: left !important;
  }
  /* Text align to the center */
  .text-md-center {
    text-align: center !important;
  }
}
@media (min-width: 1012px) {
  /* Text align to the right */
  .text-lg-right {
    text-align: right !important;
  }
  /* Text align to the left */
  .text-lg-left {
    text-align: left !important;
  }
  /* Text align to the center */
  .text-lg-center {
    text-align: center !important;
  }
}
@media (min-width: 1280px) {
  /* Text align to the right */
  .text-xl-right {
    text-align: right !important;
  }
  /* Text align to the left */
  .text-xl-left {
    text-align: left !important;
  }
  /* Text align to the center */
  .text-xl-center {
    text-align: center !important;
  }
}
/* Set the font weight to normal */
.text-normal {
  font-weight: var(--base-text-weight-normal, 400) !important;
}

/* Set the font weight to bold */
.text-bold {
  font-weight: var(--base-text-weight-semibold, 600) !important;
}

.text-semibold {
  font-weight: var(--base-text-weight-medium, 500) !important;
}

.text-light {
  font-weight: var(--base-text-weight-light, 300) !important;
}

/* Set the font to italic */
.text-italic {
  font-style: italic !important;
}

/* Make text uppercase */
.text-uppercase {
  text-transform: uppercase !important;
}

/* Underline text */
.text-underline {
  text-decoration: underline !important;
}

/* Don't underline text */
.no-underline {
  text-decoration: none !important;
}

/* Don't wrap white space */
.no-wrap {
  white-space: nowrap !important;
}

/* Normal white space */
.ws-normal {
  white-space: normal !important;
}

/* Force long "words" to wrap if they exceed the width of the container */
.wb-break-word {
  word-break: break-word !important;
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
}

/*
 * Specifically apply word-break: break-all; per MDN:
 *
 * > Note: In contrast to `word-break: break-word` and `overflow-wrap: break-word`,
 * > `word-break: break-all` will create a break at the exact place where text would
 * > otherwise overflow its container (even if putting an entire word on its own line
 * > would negate the need for a break).
 *
 * see: https://developer.mozilla.org/en-US/docs/Web/CSS/word-break#Values
 */
.wb-break-all {
  word-break: break-all !important;
}

.text-emphasized {
  font-weight: var(--base-text-weight-semibold, 600);
}

.list-style-none {
  list-style: none !important;
}

/* Set to monospace font */
.text-mono {
  font-family: var(--fontStack-monospace, ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace) !important;
}

/* Disallow user from selecting text */
.user-select-none {
  user-select: none !important;
}

/* Make text capitalized (transforms first character to uppercase) */
.text-capitalize {
  text-transform: capitalize !important;
}

.d-block {
  display: block !important;
}

.d-flex {
  display: flex !important;
}

.d-inline {
  display: inline !important;
}

.d-inline-block {
  display: inline-block !important;
}

.d-inline-flex {
  display: inline-flex !important;
}

.d-none {
  display: none !important;
}

.d-table {
  display: table !important;
}

.d-table-cell {
  display: table-cell !important;
}

@media (min-width: 544px) {
  .d-sm-block {
    display: block !important;
  }
  .d-sm-flex {
    display: flex !important;
  }
  .d-sm-inline {
    display: inline !important;
  }
  .d-sm-inline-block {
    display: inline-block !important;
  }
  .d-sm-inline-flex {
    display: inline-flex !important;
  }
  .d-sm-none {
    display: none !important;
  }
  .d-sm-table {
    display: table !important;
  }
  .d-sm-table-cell {
    display: table-cell !important;
  }
}
@media (min-width: 768px) {
  .d-md-block {
    display: block !important;
  }
  .d-md-flex {
    display: flex !important;
  }
  .d-md-inline {
    display: inline !important;
  }
  .d-md-inline-block {
    display: inline-block !important;
  }
  .d-md-inline-flex {
    display: inline-flex !important;
  }
  .d-md-none {
    display: none !important;
  }
  .d-md-table {
    display: table !important;
  }
  .d-md-table-cell {
    display: table-cell !important;
  }
}
@media (min-width: 1012px) {
  .d-lg-block {
    display: block !important;
  }
  .d-lg-flex {
    display: flex !important;
  }
  .d-lg-inline {
    display: inline !important;
  }
  .d-lg-inline-block {
    display: inline-block !important;
  }
  .d-lg-inline-flex {
    display: inline-flex !important;
  }
  .d-lg-none {
    display: none !important;
  }
  .d-lg-table {
    display: table !important;
  }
  .d-lg-table-cell {
    display: table-cell !important;
  }
}
@media (min-width: 1280px) {
  .d-xl-block {
    display: block !important;
  }
  .d-xl-flex {
    display: flex !important;
  }
  .d-xl-inline {
    display: inline !important;
  }
  .d-xl-inline-block {
    display: inline-block !important;
  }
  .d-xl-inline-flex {
    display: inline-flex !important;
  }
  .d-xl-none {
    display: none !important;
  }
  .d-xl-table {
    display: table !important;
  }
  .d-xl-table-cell {
    display: table-cell !important;
  }
}
.v-hidden {
  visibility: hidden !important;
}

.v-visible {
  visibility: visible !important;
}

@media (max-width: 543.98px) {
  .hide-sm {
    display: none !important;
  }
}
@media (min-width: 544px) and (max-width: 767.98px) {
  .hide-md {
    display: none !important;
  }
}
@media (min-width: 768px) and (max-width: 1011.98px) {
  .hide-lg {
    display: none !important;
  }
}
@media (min-width: 1012px) {
  .hide-xl {
    display: none !important;
  }
}
.show-whenNarrow,
.show-whenRegular,
.show-whenWide,
.show-whenRegular.hide-whenWide {
  display: none !important;
}

.hide-whenNarrow,
.hide-whenRegular,
.hide-whenWide {
  display: block !important;
}

@media (max-width: 767.98px) {
  .show-whenNarrow {
    display: block !important;
  }
  .hide-whenNarrow {
    display: none !important;
  }
}
@media (min-width: 768px) {
  .show-whenRegular,
  .show-whenRegular.hide-whenWide {
    display: block !important;
  }
  .hide-whenRegular {
    display: none !important;
  }
}
@media (min-width: 1280px) {
  .show-whenWide {
    display: block !important;
  }
  .hide-whenWide,
  .show-whenRegular.hide-whenWide {
    display: none !important;
  }
}
/* Set the table-layout to fixed */
.table-fixed {
  table-layout: fixed !important;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  word-wrap: normal;
  border: 0;
}

.show-on-focus {
  position: absolute !important;
}
.show-on-focus:not(:focus) {
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(1px, 1px, 1px, 1px) !important;
  border: 0 !important;
}
.show-on-focus:focus {
  z-index: 999;
}

/* dm-sans-regular - latin */
@font-face {
  font-display: swap;
  font-family: "DM Sans";
  font-style: normal;
  font-weight: 400;
  src: url(https://assets.provenance.org/web-assets/dm-sans-v11-latin-regular-dc4ac401146973f0c69cda96279d6c0debbf6d63569d87e3dd43b59b71b56225.woff2);
}
/* dm-sans-700 - latin */
@font-face {
  font-display: swap;
  font-family: "DM Sans";
  font-style: normal;
  font-weight: 700;
  src: url(https://assets.provenance.org/web-assets/dm-sans-v11-latin-700-2904a84886017a1db5532d20e46a0d6786a364797af7af9acd5fea059926aa5f.woff2);
}
/* dm-sans-italic - latin */
@font-face {
  font-display: swap;
  font-family: "DM Sans";
  font-style: italic;
  font-weight: 400;
  src: url(https://assets.provenance.org/web-assets/dm-sans-v11-latin-italic-0d63cba233bff76ea9cc5c4a3d720cb0766c8cbacf45136c561a9d368302108e.woff2);
}
html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  font-family: "DM Sans", sans-serif;
}

h1 {
  font-size: var(--base-size-36);
  font-weight: 400;
}

/**
 * Theme
 *
 * Global variables in use throughout the application
 */
/**
 * Colours
 */
/* Main colour palette */
/* rgb(0, 0, 0) */
/* rgb(42, 42, 42) */
/* rgb(61, 61, 61) */
/* rgb(82, 82, 82) */
/* rgb(102, 102, 102) */
/* rgb(122, 122, 122) */
/* rgb(164, 164, 164) */
/* rgb(204, 204, 204) */
/* rgb(244, 244, 244) */
/* rgb(249, 249, 249) */
/* rgb(255, 255, 255) */
/* rgb(122, 122, 122) */
/* rgba(255, 200, 202) */
/* rgb(61,61,61) */
/* rgba(225, 234, 224) */
/* rgb(225, 234, 224) */
/* rgb(42, 42, 42) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(59, 45, 81) */
/* rgb(77, 66, 98) */
/* rgb(153, 185, 174) */
/* rgb(238, 98, 101) */
/* rgb(240, 114, 116) */
/* rgb(255, 200, 202) */
/* rgb(73, 84, 100) */
/* rgb(244, 244, 244) */
/* rgb(204, 204, 204) */
/* rgb(204, 204, 204) */
/* black percentages use absolute black */
/* Additional colours */
/* rgb(133, 187, 204) */
/* rgb(120, 169, 184) */
/* rgb(240, 103, 100) */
/* rgb(217, 93, 90) */
/* rgb(28, 89, 127) */
/* rgb(25, 81, 115) */
/* New colours */
/* Family */
/* For now, both of these are being defined to the DM Sans font. At a later time
this will be cleaned up to improve how the site-wide fonts are defined. */
/* Sizes */
/* Font-weight */
/* Line height */
/* Letter-spacing */
/* Spacing */
/**
 * Animations
 */
/**
 * Transitions
 */
/* Duration */
/* timing function */
/**
 * Breakpoints
 */
/**
 * Container widths
 */
/**
 * Action
 *
 * A special component for styling actions, i.e. buttons
 */
/* stylelint-disable no-descending-specificity */
.Action {
  background-color: #3b2d51;
  border: 1px solid #3b2d51;
  border-radius: 4px;
  color: #fff;
  display: block;
  font-family: "DM Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1.5;
  padding: 10px 16px 11px;
  position: relative;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap;
  width: 100%;
  /* stylelint-disable selector-no-attribute */
  /* stylelint-enable selector-no-attribute */
  /* Fix to allow use of .Action within a Copy component */
}
.Action:visited {
  color: #fff;
}
.Action:focus, .Action:hover {
  background-color: #4d4262;
  border: 1px solid #4d4262;
  color: #fff;
  cursor: pointer;
}
.Action[disabled], .Action.is-disabled {
  background-color: #ccc;
  border: 1px solid #ccc;
  cursor: default;
}
.Action.is-inactive {
  background-color: #f4f4f4;
  border-color: #f4f4f4;
  color: #a4a4a4;
  cursor: default;
}
.Action.is-hidden {
  display: none;
}
.Action + .Action:not(.Action--inline) {
  margin-top: 8px;
}
.Copy .Action {
  color: #fff;
}
.Copy .Action:visited {
  color: #fff;
}
.Copy .Action:focus, .Copy .Action:hover {
  color: #fff;
}

/**
 * No hover modifier
 *
 * For disabling the hover effect, so that it can be applied instead to an
 * outer wrapping element.
 */
.Action--noHover:focus, .Action--noHover:hover {
  background-color: #3b2d51;
  border: 1px solid #3b2d51;
  color: #fff;
}

/**
 * Rounded modifier
 *
 * Rounded corners, smaller in height
 */
.Action--rounded {
  border-radius: 16px;
  min-width: 32px;
  padding: 4px 12px 5px;
}

/**
 * Small modifier
 *
 * Action text has slightly smaller font-size
 */
.Action--small {
  font-size: 13px;
  padding-bottom: 5.5px;
  padding-top: 5.5px;
  /* reduce margin-top slightly in these circumstances */
}
.Action--small .Action-icon--small {
  margin-top: 4px;
}

/**
 * Inline modifier
 *
 * For when the action should not fill its container
 */
.Action--inline {
  display: inline-block;
  width: auto;
}

/**
 * Transform None modifier
 *
 * For when action text should not be transformed
 */
.Action--transformNone {
  letter-spacing: normal;
  text-transform: none;
}

/**
 * Underline modifier
 *
 * For when action text should have an link underline
 */
.Action--underline {
  text-decoration: underline;
}

/**
 * No wrap modifier
 *
 * A modifier for when the action Ftext should not wrap at all
 */
.Action--noWrap {
  white-space: nowrap;
}

/**
 * Inherit the color from surrounding text
 *
 */
.Action--inheritColor {
  color: inherit;
}
.Action--inheritColor:link, .Action--inheritColor:visited, .Action--inheritColor:hover, .Action--inheritColor:active {
  color: inherit;
}

/**
 * Long text modifier
 *
 * When the action text is long and we want to squeeze in as much as possible
 */
.Action--longText {
  padding-left: 12px;
  padding-right: 12px;
}

/**
 * Red colour modifier
 */
.Action--red {
  background-color: #ee6265;
  border-color: #ee6265;
  /* stylelint-disable selector-no-attribute */
  /* stylelint-enable selector-no-attribute */
}
.Action--red:focus, .Action--red:hover {
  background-color: #f07274;
  border-color: #f07274;
}
.Action--red[disabled], .Action--red.is-disabled {
  background-color: #ccc;
  border: 1px solid #ccc;
  cursor: default;
}

/**
 * Green colour modifier
 */
.Action--green {
  background-color: #99b9ae;
  border-color: #99b9ae;
}
.Action--green:focus, .Action--green:hover {
  background-color: #e1eae0;
  border-color: #e1eae0;
  color: #7a7a7a;
}

/**
 * Green-60 colour modifier
 */
.Action--green60 {
  background-color: #3d9982;
  border-color: #3d9982;
}
.Action--green60:focus, .Action--green60:hover {
  background-color: #55b79e;
  border-color: #55b79e;
  color: #fff;
}

/**
 * Light green modifer
 */
.Action--greenLight {
  background-color: #e1eae0;
  border-color: #e1eae0;
  color: #7a7a7a;
}
.Action--greenLight:visited {
  color: #7a7a7a;
}
.Action--greenLight:focus, .Action--greenLight:hover {
  background-color: #f4f4f4;
  border-color: #f4f4f4;
  color: #7a7a7a;
}
.Action--greenLight:disabled {
  background-color: #ccc;
  border-color: #ccc;
  color: #fff;
  cursor: default;
}

/**
 * Light green modifer with white hover
 */
.Action--greenLightHoverWhite {
  background-color: #e1eae0;
  border-color: #e1eae0;
  color: #7a7a7a;
}
.Action--greenLightHoverWhite:visited {
  color: #7a7a7a;
}
.Action--greenLightHoverWhite:focus, .Action--greenLightHoverWhite:hover {
  background-color: #fff;
  border-color: #fff;
  color: #7a7a7a;
}
.Action--greenLightHoverWhite:disabled {
  background-color: #ccc;
  border-color: #ccc;
  color: #fff;
  cursor: default;
}

/**
 * Transparent hover red modifier
 *
 * Normally transparent but red on hover
 */
.Action--transparentHoverRed {
  background-color: transparent;
  border: 1px solid #a4a4a4;
  color: #666;
}
.Action--transparentHoverRed:visited {
  color: #666;
}
.Action--transparentHoverRed:focus, .Action--transparentHoverRed:hover {
  background-color: #ee6265;
  border-color: #ee6265;
  color: #fff;
}

/**
 * Transparent hover green colour modifier
 *
 * Normally transparent but green on hover
 */
.Action--transparentHoverGreen {
  background-color: transparent;
  border: 1px solid #666;
  color: #525252;
}
.Action--transparentHoverGreen:visited {
  color: #525252;
}
.Action--transparentHoverGreen:focus, .Action--transparentHoverGreen:hover {
  background-color: #99b9ae;
  border-color: #99b9ae;
  color: #fff;
}

/**
 * Transparent hover white modifier
 *
 * Normally transparent but white on hover
 */
.Action--transparentHoverWhite {
  background-color: transparent;
  border: 1px solid #525252;
  color: #2a2a2a;
}
.Action--transparentHoverWhite:visited {
  color: #3d3d3d;
}
.Action--transparentHoverWhite:focus, .Action--transparentHoverWhite:hover {
  background-color: #fff;
  border-color: #666;
  color: #3d3d3d;
}

/**
 * Transparent white hover white modifier
 *
 * Transparent but with a white border then white on hover
 */
.Action--transparentWhiteHoverWhite {
  background-color: transparent;
  border: 1px solid #fff;
  color: #fff;
}
.Action--transparentWhiteHoverWhite:visited {
  color: #fff;
}
.Action--transparentWhiteHoverWhite:focus, .Action--transparentWhiteHoverWhite:hover {
  background-color: #fff;
  border-color: #fff;
  color: #3d3d3d;
}

/**
 * Minimal modifier
 *
 * An action that looks like a link
 */
.Action--minimal {
  background-color: transparent;
  border-color: transparent;
  color: #3b2d51;
  /* stylelint-disable selector-no-attribute */
  /* stylelint-enable selector-no-attribute */
}
.Action--minimal:visited {
  color: #3b2d51;
}
.Action--minimal:focus, .Action--minimal:hover {
  background-color: transparent;
  border-color: transparent;
  color: #4d4262;
}
.Action--minimal[disabled], .Action--minimal.is-disabled {
  background-color: transparent;
  border-color: transparent;
  color: #ccc;
}

/**
 * White hover grey modifer
 *
 * Normally white but grey on hover
 */
.Action--whiteHoverGrey {
  background-color: #fff;
  border-color: #fff;
  color: #666;
  /* Fix to allow use of .Action--whiteHoverGrey within a Copy component */
}
.Action--whiteHoverGrey:visited {
  color: #666;
}
.Action--whiteHoverGrey:focus, .Action--whiteHoverGrey:hover {
  background-color: #7a7a7a;
  border-color: #7a7a7a;
  color: #fff;
}
.Action--whiteHoverGrey.is-disabled:focus, .Action--whiteHoverGrey.is-disabled:hover {
  background-color: #ccc;
  border: 1px solid #ccc;
  color: #666;
  cursor: default;
}
.Copy .Action--whiteHoverGrey {
  color: #666;
}
.Copy .Action--whiteHoverGrey:visited {
  color: #666;
}
.Copy .Action--whiteHoverGrey:focus, .Copy .Action--whiteHoverGrey:hover {
  color: #fff;
}

.Action--greyBorderHoverPurple {
  background-color: transparent;
  border-color: #ccc;
  color: #2a2a2a;
  transition: all 0.2s ease-in-out;
}
.Action--greyBorderHoverPurple:visited {
  color: #666;
}
.Action--greyBorderHoverPurple:focus, .Action--greyBorderHoverPurple:hover {
  background-color: #3b2d51;
  border-color: #3b2d51;
  color: #fff;
}
.Action--greyBorderHoverPurple.is-disabled:focus, .Action--greyBorderHoverPurple.is-disabled:hover {
  background-color: #ccc;
  border: 1px solid #ccc;
  color: #666;
  cursor: default;
}

/**
 * White purple border modifer
 *
 * A white action with a purple border
 */
.Action--whitePurpleBorder {
  background-color: #fff;
  border-color: #3b2d51;
  color: #3b2d51;
}
.Action--whitePurpleBorder:visited {
  color: #3b2d51;
}
.Action--whitePurpleBorder:focus, .Action--whitePurpleBorder:hover {
  background-color: #fff;
  border-color: #4d4262;
  color: #4d4262;
}
.Action--whitePurpleBorder[disabled], .Action--whitePurpleBorder.is-disabled {
  background-color: #ccc;
  border: 1px solid #ccc;
  color: #fff;
  cursor: default;
}

/**
 * White red border modifier
 *
 * A white action with a red border
 */
.Action--whiteRedBorder {
  background-color: #fff;
  border-color: #ee6265;
  color: #ee6265;
}
.Action--whiteRedBorder:visited {
  color: #ee6265;
}
.Action--whiteRedBorder:focus, .Action--whiteRedBorder:hover {
  background-color: #fff;
  border-color: #f07274;
  color: #f07274;
}

/**
 * Navy colour modifier
 */
.Action--navy {
  background-color: #2f3a4a;
  border-color: #2f3a4a;
  color: #fff;
}
.Action--navy:visited {
  color: #fff;
}
.Action--navy:focus, .Action--navy:hover {
  background-color: #a4a4a4;
  border-color: #a4a4a4;
  color: #fff;
}

.Action--navyLight {
  background-color: #495464;
  border-color: #495464;
  color: #fff;
}
.Action--navyLight:visited {
  color: #fff;
}
.Action--navyLight:focus, .Action--navyLight:hover {
  background-color: #a4a4a4;
  border-color: #a4a4a4;
  color: #fff;
}

/**
 * Twitter colour modifier
 */
.Action--twitter {
  background-color: #85bbcc;
  border-color: #85bbcc;
}
.Action--twitter:focus, .Action--twitter:hover {
  background-color: #78a9b8;
  border-color: #78a9b8;
}

/**
 * Pinterest colour modifier
 */
.Action--pinterest {
  background-color: #f06764;
  border-color: #f06764;
}
.Action--pinterest:focus, .Action--pinterest:hover {
  background-color: #d95d5a;
  border-color: #d95d5a;
}

/**
 * Facebook colour modifer
 */
.Action--facebook {
  background-color: #1c597f;
  border-color: #1c597f;
}
.Action--facebook:focus, .Action--facebook:hover {
  background-color: #195173;
  border-color: #195173;
}

.Action--share {
  background-color: #3b2d51;
  border-color: #fff;
  color: #fff;
  white-space: nowrap;
}
.Action--share:visited {
  color: #fff;
}
.Action--share:focus, .Action--share:hover {
  background-color: #fff;
  border-color: #7a7a7a;
  color: #666;
}

/**
 * Share/Sign up/Sign in modifier
 *
 * Special styles for the share/sign up/sign in buttons
 *
 * NB see Chrome.scss for additional styles that apply when .Chrome-header
 * has the state 'is-transparent'
 */
.Action--join,
.Action--signUp,
.Action--signIn {
  background-color: #fff;
  border-color: #666;
  color: #666;
  white-space: nowrap;
}
.Action--join:visited,
.Action--signUp:visited,
.Action--signIn:visited {
  color: #666;
}
.Action--join:focus, .Action--join:hover,
.Action--signUp:focus,
.Action--signUp:hover,
.Action--signIn:focus,
.Action--signIn:hover {
  background-color: #7a7a7a;
  border-color: #7a7a7a;
  color: #fff;
}

.Action--noPaddingLeft {
  padding-left: 0;
}

/**
 * Action just icon
 *
 * An action with just an SVG icon explicitly positioned within, no text
 */
.Action--justIcon {
  border-radius: 50%;
  display: inline-flex;
  height: 32px;
  padding: 8px;
  width: 32px;
}
.Action--justIcon .Action-icon {
  margin: auto;
  position: static;
}

.Action--justIconSmall {
  height: 24px;
  padding: 6px;
  width: 24px;
}

/* medium modifier, to be used in conjunction with .Action--justIcon */
.Action--justIconMedium {
  height: 36px;
  padding: 4px;
  width: 36px;
}

/* large modifier, to be used in conjunction with .Action--justIcon */
.Action--justIconLarge {
  height: 44px;
  width: 44px;
}

/**
 * Icon
 *
 * Used for styling SVGs that appear alongside text in an action
 */
.Action-icon {
  fill: currentColor;
  height: 12px;
  margin-top: 2px;
  position: absolute;
  width: 12px;
}
.Action-icon.is-hidden {
  display: none;
}

.Action-icon--small {
  height: 10px;
  margin-top: 5px;
  width: 10px;
}

.Action-icon--smallRight {
  height: 10px;
  margin-top: 5px;
  right: 10px;
  width: 10px;
}

.Action-icon--medium {
  height: 22px;
  width: 22px;
}

.Action-icon--embed {
  height: 12px;
  width: 16px;
}

.Action-icon--file {
  height: 14px;
  width: 14px;
}

.Action-icon--delete {
  background-color: currentColor;
  border-radius: 11px;
  fill: #fff;
  height: 20px;
  padding: 6px;
  top: 6px;
  width: 20px;
}

/**
 * Used to style the text alongside the icon
 */
.Action-textLeft {
  margin-left: 0;
  margin-right: 6px;
}

.Action-textLeft--wide {
  margin-right: 18px;
}

.Action-textLeft--wider {
  margin-right: 24px;
}

.Action-textRight {
  margin-left: 18px;
  margin-right: 0;
}
.Action-textRight.is-reset {
  margin-left: 0;
}

.Action-textRight--tight {
  margin-left: 10px;
}

.Action-textRight--wide {
  margin-left: 24px;
}

.Action-textRight--wider {
  margin-left: 28px;
}

/**
 * Background icon modifiers
 *
 * An action with an SVG as a background image icone
 */
.Action--backgroundIcon {
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
  padding-left: 0;
  padding-right: 0;
  text-indent: 100%;
  white-space: nowrap;
}

/* Adds the envelope icon */
.Action--backgroundIconEmail {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cpath%20fill%3D%22white%22%20d%3D%22M.997%2010.627c-.625.98-.997%202.14-.997%203.39v19.966c0%20.78.16%201.52.418%202.21L15.26%2023.157.998%2010.627zm46.034.053L32.827%2023.157%2047.6%2036.133c.246-.673.398-1.392.398-2.15V14.016c0-1.227-.36-2.367-.967-3.336m-3.058-1.446L42.594%207.83c-.245-.03-.485-.077-.738-.077H6.146c-.22%200-.43.043-.643.066L4.116%209.233l19.928%2017.5%2019.928-17.5zM24.044%2030.87l-6.43-5.647L2.64%2038.376l1.457%201.483c.644.235%201.327.387%202.048.387h35.71c.77%200%201.497-.162%202.175-.428l1.417-1.444-14.973-13.153-6.43%205.648z%22%2F%3E%3C%2Fsvg%3E");
  height: 44px;
  width: 54px;
}
.Action--backgroundIconEmail.Action--greenLight {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cpath%20fill%3D%22%232f3a4a%22%20d%3D%22M.997%2010.627c-.625.98-.997%202.14-.997%203.39v19.966c0%20.78.16%201.52.418%202.21L15.26%2023.157.998%2010.627zm46.034.053L32.827%2023.157%2047.6%2036.133c.246-.673.398-1.392.398-2.15V14.016c0-1.227-.36-2.367-.967-3.336m-3.058-1.446L42.594%207.83c-.245-.03-.485-.077-.738-.077H6.146c-.22%200-.43.043-.643.066L4.116%209.233l19.928%2017.5%2019.928-17.5zM24.044%2030.87l-6.43-5.647L2.64%2038.376l1.457%201.483c.644.235%201.327.387%202.048.387h35.71c.77%200%201.497-.162%202.175-.428l1.417-1.444-14.973-13.153-6.43%205.648z%22%2F%3E%3C%2Fsvg%3E");
}

/* Adds the tick icon */
.Action--backgroundIconTick {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2048%2048%22%3E%3Cpath%20fill%3D%22white%22%20d%3D%22M14.485%2041.896h-.04c-.823-.012-1.608-.35-2.183-.937L.874%2029.285c-1.19-1.22-1.162-3.17.066-4.357%201.224-1.185%203.187-1.158%204.38.065l9.22%209.453L42.737%206.984c1.222-1.193%203.18-1.17%204.38.045%201.197%201.216%201.176%203.166-.046%204.356l-30.418%2029.63c-.58.564-1.358.88-2.167.88%22%2F%3E%3C%2Fsvg%3E");
  height: 44px;
  width: 54px;
}

/* Adds the Twitter icon */
.Action--backgroundIconTwitter {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2050%2050%22%3E%3Cpath%20fill%3D%22white%22%20d%3D%22M44.884%2014.804c.02.44.025.88.025%201.327%200%2013.554-10.317%2029.187-29.184%2029.187-5.794%200-11.188-1.697-15.726-4.61.804.098%201.62.144%202.45.144%204.806%200%209.228-1.64%2012.736-4.388-4.49-.083-8.277-3.048-9.58-7.124.623.12%201.27.185%201.93.185.934%200%201.84-.127%202.7-.36-4.693-.946-8.226-5.09-8.226-10.06v-.13c1.382.767%202.965%201.233%204.645%201.282-2.75-1.84-4.565-4.98-4.565-8.536%200-1.885.51-3.644%201.39-5.16C8.54%2012.766%2016.1%2016.85%2024.63%2017.28c-.176-.75-.27-1.533-.27-2.338%200-5.666%204.594-10.257%2010.258-10.257%202.95%200%205.62%201.245%207.492%203.236%202.335-.46%204.53-1.312%206.512-2.488-.765%202.396-2.393%204.406-4.51%205.676%202.073-.248%204.05-.8%205.89-1.617-1.377%202.06-3.114%203.864-5.116%205.314%22%2F%3E%3C%2Fsvg%3E");
}

/* Adds the Pinterest icon */
.Action--backgroundIconPinterest {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2050%2050%22%3E%3Cpath%20fill%3D%22white%22%20d%3D%22M28.858%2036.137c-3.1%200-6.017-1.676-7.014-3.58%200%200-1.67%206.617-2.022%207.893-1.243%204.514-4.9%209.03-5.184%209.4-.2.255-.635.175-.682-.166-.08-.575-1.012-6.27.085-10.913l3.694-15.65s-.914-1.832-.914-4.543c0-4.256%202.468-7.435%205.54-7.435%202.61%200%203.87%201.96%203.87%204.312%200%202.628-1.67%206.554-2.535%2010.19-.718%203.048%201.53%205.534%204.534%205.534%205.437%200%209.103-6.99%209.103-15.27%200-6.293-4.237-11.006-11.95-11.006-8.708%200-14.14%206.498-14.14%2013.755%200%202.5.74%204.268%201.896%205.632.53.628.604.88.41%201.6-.138.528-.452%201.8-.586%202.305-.19.727-.777.987-1.435.72-4.014-1.64-5.885-6.034-5.885-10.97C5.645%209.784%2012.525%200%2026.175%200c10.964%200%2018.18%207.933%2018.18%2016.454%200%2011.266-6.265%2019.683-15.497%2019.683%22%2F%3E%3C%2Fsvg%3E");
}

/* Adds the Facebook icon */
.Action--backgroundIconFacebook {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2050%2050%22%3E%3Cpath%20fill%3D%22white%22%20d%3D%22M35.748%2025h-6.9v25H18.504V25h-5.17v-8.617h5.17v-5.17C18.504%204.18%2021.424%200%2029.714%200h6.898v8.617h-4.31c-3.228%200-3.442%201.206-3.442%203.452l-.013%204.313h7.817L35.748%2025z%22%2F%3E%3C%2Fsvg%3E");
}

.Action-backgroundIconCopy {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 488.3 488.3'%3E%3Cpath d='M314.25 85.4h-227c-21.3 0-38.6 17.3-38.6 38.6v325.7c0 21.3 17.3 38.6 38.6 38.6h227c21.3 0 38.6-17.3 38.6-38.6V124c-.1-21.3-17.4-38.6-38.6-38.6zm11.5 364.2c0 6.4-5.2 11.6-11.6 11.6h-227c-6.4 0-11.6-5.2-11.6-11.6V124c0-6.4 5.2-11.6 11.6-11.6h227c6.4 0 11.6 5.2 11.6 11.6v325.6z'/%3E%3Cpath d='M401.05 0h-227c-21.3 0-38.6 17.3-38.6 38.6 0 7.5 6 13.5 13.5 13.5s13.5-6 13.5-13.5c0-6.4 5.2-11.6 11.6-11.6h227c6.4 0 11.6 5.2 11.6 11.6v325.7c0 6.4-5.2 11.6-11.6 11.6-7.5 0-13.5 6-13.5 13.5s6 13.5 13.5 13.5c21.3 0 38.6-17.3 38.6-38.6V38.6c0-21.3-17.3-38.6-38.6-38.6z'/%3E%3C/svg%3E");
}

.Action-backgroundIconShare {
  background-image: url("data:image/svg+xml,%3Csvg height='22' viewBox='0 0 22 22' width='22' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd' stroke='%23fff' stroke-linecap='round' stroke-width='1.5' transform='translate(1 1)'%3E%3Cpath d='m0 11.1111111v8.8888889h20v-8.8888889' stroke-linejoin='round'/%3E%3Cpath d='m6.11111111 3.33333333 3.88888889-3.33333333 3.8888889 3.33333333' stroke-linejoin='round'/%3E%3Cpath d='m10 11.1111111v-11.1111111'/%3E%3C/g%3E%3C/svg%3E");
}

.Action-social {
  background-size: 50% 50%;
}

/**
 * New modifer
 *
 * Add a 'new' tout to the top right of the Action
 */
.Action--new {
  margin-right: 17.5px;
  position: relative;
}
.Action--new::after {
  background-color: #ee6265;
  border-radius: 8px;
  color: #fff;
  content: "new";
  font-family: "DM Sans", sans-serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  padding: 2px 6px;
  position: absolute;
  right: 0;
  text-transform: uppercase;
  top: 0;
  transform: translate(50%, -50%);
}

/**
 * Info
 *
 * An i character suggesting more info to toggle
 */
.Action-info {
  border: 1px solid #2a2a2a;
  border-radius: 50%;
  color: #2a2a2a;
  font-weight: 700;
  margin-left: -4px;
  margin-right: 5px;
  padding-left: 6px;
  padding-right: 6px;
}

.Action--arrow {
  color: #3b2d51;
  font-family: "DM Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  text-decoration: none;
}
.Action--arrow::after {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='14' viewBox='0 0 17 14'%3E%3Cg fill='none' fill-rule='evenodd' transform='translate(-1 -2)'%3E%3Crect width='18' height='18'/%3E%3Cpath stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2,9 L15,9'/%3E%3Cpolyline stroke='currentColor' stroke-linecap='round' stroke-width='2' points='10 3 16 9 10 15'/%3E%3C/g%3E%3C/svg%3E");
  content: "";
  display: inline-block;
  height: 14px;
  margin-left: 4px;
  transition: transform 0.1s ease-out;
  vertical-align: middle;
  width: 17px;
}
.Action--arrow:hover::after {
  transform: translateX(8px);
}
.Action--arrow[disabled], .Action--arrow.is-disabled {
  color: #a4a4a4;
  cursor: default;
}
.Action--arrow[disabled]::after, .Action--arrow.is-disabled::after {
  color: #a4a4a4;
  opacity: 0.25;
}
.Action--arrow[disabled]:hover::after, .Action--arrow.is-disabled:hover::after {
  transform: none;
}

.StoryButton:hover .Action--arrow::after {
  transform: translateX(8px);
}

.Action--arrowWhite {
  color: #fff;
}
.Action--arrowWhite::after {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='14' viewBox='0 0 17 14'%3E%3Cg fill='none' fill-rule='evenodd' transform='translate(-1 -2)'%3E%3Crect width='18' height='18'/%3E%3Cpath stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2,9 L15,9'/%3E%3Cpolyline stroke='white' stroke-linecap='round' stroke-width='2' points='10 3 16 9 10 15'/%3E%3C/g%3E%3C/svg%3E");
}

.ActionSubtitle {
  color: #7a7a7a;
  font-family: "DM Sans", sans-serif;
  font-size: 12px;
  margin-top: 4px;
  text-align: center;
}

/* -----------------------------------------------------------------------------
 * Media queries
 * -------------------------------------------------------------------------- */
/**
 * Desktop
 */
@media (min-width: 960px) {
  /* restore original padding values */
  .Action--longText {
    padding-left: 16px;
    padding-right: 16px;
  }
}
/* stylelint-disable */
/**
 * Theme
 *
 * Global variables in use throughout the application
 */
/**
 * Colours
 */
/* Main colour palette */
/* rgb(0, 0, 0) */
/* rgb(42, 42, 42) */
/* rgb(61, 61, 61) */
/* rgb(82, 82, 82) */
/* rgb(102, 102, 102) */
/* rgb(122, 122, 122) */
/* rgb(164, 164, 164) */
/* rgb(204, 204, 204) */
/* rgb(244, 244, 244) */
/* rgb(249, 249, 249) */
/* rgb(255, 255, 255) */
/* rgb(122, 122, 122) */
/* rgba(255, 200, 202) */
/* rgb(61,61,61) */
/* rgba(225, 234, 224) */
/* rgb(225, 234, 224) */
/* rgb(42, 42, 42) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(59, 45, 81) */
/* rgb(77, 66, 98) */
/* rgb(153, 185, 174) */
/* rgb(238, 98, 101) */
/* rgb(240, 114, 116) */
/* rgb(255, 200, 202) */
/* rgb(73, 84, 100) */
/* rgb(244, 244, 244) */
/* rgb(204, 204, 204) */
/* rgb(204, 204, 204) */
/* black percentages use absolute black */
/* Additional colours */
/* rgb(133, 187, 204) */
/* rgb(120, 169, 184) */
/* rgb(240, 103, 100) */
/* rgb(217, 93, 90) */
/* rgb(28, 89, 127) */
/* rgb(25, 81, 115) */
/* New colours */
/* Family */
/* For now, both of these are being defined to the DM Sans font. At a later time
this will be cleaned up to improve how the site-wide fonts are defined. */
/* Sizes */
/* Font-weight */
/* Line height */
/* Letter-spacing */
/* Spacing */
/**
 * Animations
 */
/**
 * Transitions
 */
/* Duration */
/* timing function */
/**
 * Breakpoints
 */
/**
 * Container widths
 */
/**
 * Form
 *
 * The Form module provides a standard set of styles for SimpleForm elements,
 * item errors and help. Not all forms in the site need to use this module, it
 * is only for standard forms.
 *
 * SimpleForm generates additional class, e.g. 'email' and 'optional'.
 * These should not be used for styling as they don't match our naming
 * conventions.
 *
 * Global errors (e.g. ones related to the form as a whole) are
 * handled by the Flash component.
 *
 * Main sections:
 * - Group
 * - Item
 * - Label
 * - Control
 * - Item group
 * - Error
 * - Hint
 * - Info
 * - Actions
 * - Grid
 * - Row
 * - Miscellaneous
 * - Media queries
 */
/* stylelint-disable no-descending-specificity */
.Form {
  /**
   * 'is hidden'
   *
   * For hiding the form entirely, e.g. on successful request invite form submission
   */
  /**
   * 'is enhanced'
   *
   * A state when JS is enabled and so some form features should be enhanced
   */
}
.Form.is-hidden {
  opacity: 0;
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  visibility: hidden;
}
.Form.is-enhanced {
  /* Show the credit card icons */
  /* Make room for the show/hide password toggle */
  /* Display the show/hide password toggle */
}
.Form.is-enhanced .Form-control--creditCard {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%221%200%2060%2040%22%3E%3Cpath%20fill%3D%22%23C4DAB0%22%20d%3D%22M61%2035c0%202.8-2.2%205-5%205H6c-2.8%200-5-2.2-5-5V5c0-2.8%202.2-5%205-5h50c2.8%200%205%202.2%205%205v30z%22%2F%3E%3Cpath%20fill%3D%22%23424143%22%20d%3D%22M2%206.3h59v8H2z%22%2F%3E%3Cpath%20fill%3D%22%237D9769%22%20d%3D%22M56%201c2.2%200%204%201.8%204%204v30c0%202.2-1.8%204-4%204H6c-2.2%200-4-1.8-4-4V5c0-2.2%201.8-4%204-4h50m0-1H6C3.2%200%201%202.2%201%205v30c0%202.8%202.2%205%205%205h50c2.8%200%205-2.2%205-5V5c0-2.8-2.3-5-5-5z%22%2F%3E%3C%2Fsvg%3E");
  background-position: right 10px center;
  background-repeat: no-repeat;
  background-size: 36px 24px;
}
.Form.is-enhanced .Form-control--creditCard.visa {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2224%22%20height%3D%2216%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20fill-rule%3D%22nonzero%22%20fill%3D%22none%22%3E%3Crect%20stroke-opacity%3D%22.2%22%20stroke%3D%22%23000%22%20stroke-width%3D%22.5%22%20fill%3D%22%23FFF%22%20x%3D%22.25%22%20y%3D%22.25%22%20width%3D%2223.5%22%20height%3D%2215.5%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M2.788%205.914A7.201%207.201%200%20001%205.237l.028-.125h2.737c.371.013.672.125.77.519l.595%202.836.182.854%201.666-4.21h1.799l-2.674%206.167H4.304L2.788%205.914zm7.312%205.37H8.399l1.064-6.172h1.7L10.1%2011.284zm6.167-6.021l-.232%201.333-.153-.066a3.054%203.054%200%2000-1.268-.236c-.671%200-.972.269-.98.531%200%20.29.365.48.96.762.98.44%201.435.979%201.428%201.681-.014%201.28-1.176%202.108-2.96%202.108-.764-.007-1.5-.158-1.898-.328l.238-1.386.224.099c.553.23.917.328%201.596.328.49%200%201.015-.19%201.022-.604%200-.27-.224-.466-.882-.769-.644-.295-1.505-.788-1.491-1.674C11.878%205.84%2013.06%205%2014.74%205c.658%200%201.19.138%201.526.263zm2.26%203.834h1.415c-.07-.308-.392-1.786-.392-1.786l-.12-.531c-.083.23-.23.604-.223.59l-.68%201.727zm2.1-3.985L22%2011.284h-1.575s-.154-.71-.203-.926h-2.184l-.357.926h-1.785l2.527-5.66c.175-.4.483-.512.889-.512h1.316z%22%20fill%3D%22%23171E6C%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}
.Form.is-enhanced .Form-control--creditCard.mastercard {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20height%3D%2216%22%20width%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%3Crect%20fill%3D%22%23252525%22%20height%3D%2216%22%20rx%3D%222%22%20width%3D%2224%22%2F%3E%3Ccircle%20cx%3D%229%22%20cy%3D%228%22%20fill%3D%22%23eb001b%22%20r%3D%225%22%2F%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%228%22%20fill%3D%22%23f79e1b%22%20r%3D%225%22%2F%3E%3Cpath%20d%3D%22M12%204c1.214.912%202%202.364%202%204s-.786%203.088-2%204c-1.214-.912-2-2.364-2-4s.786-3.088%202-4z%22%20fill%3D%22%23ff5f00%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}
.Form.is-enhanced .Form-control--creditCard.amex {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20height%3D%2216%22%20width%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%3Crect%20fill%3D%22%23016fd0%22%20height%3D%2216%22%20rx%3D%222%22%20width%3D%2224%22%2F%3E%3Cpath%20d%3D%22M13.764%2013.394V7.692l10.148.01v1.574l-1.173%201.254%201.173%201.265v1.608h-1.873l-.995-1.098-.988%201.102z%22%20fill%3D%22%23fffffe%22%2F%3E%3Cpath%20d%3D%22M14.442%2012.769v-4.45h3.772v1.026h-2.55v.695h2.49v1.008h-2.49v.684h2.55v1.037z%22%20fill%3D%22%23016fd0%22%2F%3E%3Cpath%20d%3D%22M18.195%2012.769l2.088-2.227-2.088-2.222h1.616l1.275%201.41%201.28-1.41h1.546v.035l-2.043%202.187%202.043%202.164v.063H22.35l-1.298-1.424-1.285%201.424z%22%20fill%3D%22%23016fd0%22%2F%3E%3Cpath%20d%3D%22M14.237%202.632h2.446l.86%201.95v-1.95h3.02l.52%201.462.523-1.462h2.306v5.701H11.725z%22%20fill%3D%22%23fffffe%22%2F%3E%3Cg%20fill%3D%22%23016fd0%22%3E%3Cpath%20d%3D%22M14.7%203.251l-1.974%204.446h1.354l.373-.89h2.018l.372.89h1.387L16.265%203.25zm.17%202.558l.592-1.415.592%201.415z%22%2F%3E%3Cpath%20d%3D%22M18.212%207.696V3.25l1.903.006.98%202.733.985-2.74h1.832v4.446l-1.179.01V4.653L21.62%207.696h-1.075l-1.136-3.054v3.054z%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}
.Form.is-enhanced .Form-control.password {
  padding-right: 40px;
}
.Form.is-enhanced .Form-passwordToggle {
  display: block;
}

.Form-rule {
  background-color: #ccc;
  border: none;
  color: #ccc;
  height: 2px;
  margin-top: 24px;
}

.Form-section {
  border-top: 1px solid #ccc;
  margin-top: 24px;
  padding-top: 28px;
}

/* -----------------------------------------------------------------------------
 * Group
 *
 * The container around each set of form controls, mainly used for adding
 * whitespace to the page
 * -------------------------------------------------------------------------- */
.Form-group {
  padding-top: 32px;
  position: relative;
}

.Form-group--collapsible {
  transition: opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1), margin 0.2s cubic-bezier(0.4, 0, 0.2, 1), padding 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}
.Form-group--collapsible.is-hidden {
  height: 0;
  margin: 0;
  opacity: 0;
  overflow: hidden;
  padding: 0;
  visibility: hidden;
}

.Form-group--inline .Form-itemGroupItem {
  display: inline-block;
  margin-right: 40px;
}

/**
 * Multiple items modifier
 *
 * When a form group contains several form items it should have flexbox on
 * on small screens
 */
.Form-group--multipleItems {
  display: flex;
  flex-wrap: wrap;
  margin-left: -8px;
  margin-right: -8px;
}

/**
 * Desktop flex modifier
 *
 * When a form group should have flexbox only on desktop screens
 */
.Form-group--smallPaddingTop {
  padding-top: 8px;
}

.Form-group--mediumPaddingTop {
  padding-top: 16px;
}

/**
 * Checkbox
 */
.Form-group--checkbox {
  /**
   * When there are two elements of this type, the second one should have a
   * reduced margin-top
   */
  /**
   * However, when the first element is hidden, the second should have a NORMAL
   * margin-top
   */
}
.Form-group--checkbox + .Form-group--checkbox {
  padding-top: 16px;
}
.Form-group--checkbox.is-hidden + .Form-group--checkbox {
  padding-top: 32px;
}

/* -----------------------------------------------------------------------------
 * Group inner
 *
 * When we need an additional wrapper within a form group for correct
 * positioning of elements
 * -------------------------------------------------------------------------- */
/**
 * Flex modifier
 */
.Form-groupInner--flex {
  display: flex;
  margin-top: 8px;
}

/**
 * Social modifier
 */
/**
 * Center modifier
 */
.Form-groupInner--center {
  text-align: center;
}

/* -----------------------------------------------------------------------------
 * Item
 *
 * The container for each individual form control
 * -------------------------------------------------------------------------- */
.Form-item {
  position: relative;
  /**
   * 'invalid' state
   *
   * This state is Applied to a form item when the form fails validation.
   *
   * When active, change the appearance of the child form control so users can
   * identify which form element is failing validation.
   */
  /**
   * 'is disabled' state
   *
   * This state is applied when the user does not have permission to fill out
   * the form, e.g. when they have not yet created a profile.
   */
}
.Form-item.is-invalid .Form-control {
  border-color: #ffc8ca;
  border-radius: 4px 4px 0 0;
}
.Form-item.is-invalid .Form-itemGroup {
  border: 1px solid #ffc8ca;
  border-radius: 4px 4px 0 0;
  margin-top: 8px;
  padding-left: 6px;
  padding-right: 6px;
}
.Form-item.is-disabled {
  /* make sure cursor does not change from default */
  cursor: default;
  /* make sure labels are greyed out too */
  /* make sure cursor does not change from default */
  /* Make sure hints are greyed out too */
}
.Form-item.is-disabled .Form-label {
  color: #a4a4a4;
}
.Form-item.is-disabled .Form-label--withCheckbox {
  cursor: default;
}
.Form-item.is-disabled .Form-hint {
  color: #a4a4a4;
}

.Form-item--collapsible {
  transition: opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1), margin 0.2s cubic-bezier(0.4, 0, 0.2, 1), padding 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}
.Form-item--collapsible.is-hidden {
  height: 0;
  margin: 0;
  margin-top: 0;
  opacity: 0;
  overflow: hidden;
  padding: 0;
  visibility: hidden;
}

.FormChrome-form--v2 .Form-group {
  padding-top: 0;
}
.FormChrome-form--v2 .Form-item:has(.hidden) {
  margin-top: 0;
}
.FormChrome-form--v2 .Form-item {
  margin-top: 24px;
}

/**
 * Secondary modifier
 *
 * For secondary form items, typically revealed after a checkbox has been ticked
 * e.g alt maker, new location etc.
 */
.Form-item--secondary {
  max-height: 0;
  opacity: 0;
  overflow-y: hidden;
  transition: max-height 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  visibility: hidden;
  width: 100%;
}
.Form-item--secondary.is-visible {
  max-height: 110px;
  opacity: 1;
  visibility: visible;
}
.Form-item--secondary .Form-control {
  margin-top: 0;
}
.Form-item--secondary .Form-hint {
  padding-bottom: 8px;
}

/**
 * Flex item modifier
 *
 * A form item that is a child of a parent that has flexbox on small screens
 */
.Form-item--flexItem {
  flex-basis: auto;
  padding-left: 8px;
  padding-right: 8px;
}

/* apply width on small screens */
.Form-item--flexItemSmall50 {
  width: 50%;
}

/**
 * Flex modifier
 *
 * When a form item should itself have flexbox, i.e. when used for correct
 * positioning of inline checkboxes
 */
.Form-item--flex {
  align-items: center;
  display: flex;
  justify-content: space-between;
}

/**
 * Item social modifier
 *
 * The social network fields on the edit profile/onboarding page need:
 * 1. flexbox for correct positioning of children
 * 2. a margin top to separate them from eachother
 */
.Form-item--social {
  display: flex; /* 1 */
}
.Form-item--social:not(:first-of-type) {
  margin-top: 8px; /* 2 */
}

/**
 * Select modifier
 *
 * Standard browser select arrows are hidden so that we can use our own
 * consistent arrow design.
 */
.Form-item--select {
  position: relative;
  /* when element also has the flexItem modifer adapt the position of the icon */
  /* for the units item adapt the position of the icon */
}
.Form-item--select::after {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2248%22%20height%3D%2248%22%20viewBox%3D%220%200%2048%2048%22%20enable-background%3D%22new%200%200%2048%2048%22%3E%0A%20%20%3Cpath%20fill%3D%22%232a2a2a%22%20d%3D%22M0%2014.3c0-.9.4-1.7%201.2-2.4%201.5-1.2%203.9-1%205.3.3L24%2028.9l17.5-16.7c1.4-1.3%203.7-1.4%205.3-.3%201.5%201.2%201.7%203.2.3%204.5L26.8%2035.8c-.7.7-1.7%201.1-2.8%201.1-1.1%200-2.1-.4-2.8-1.1L.9%2016.4c-.6-.6-.9-1.3-.9-2.1z%22%2F%3E%0A%3C%2Fsvg%3E");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  content: "";
  height: 16px;
  pointer-events: none;
  position: absolute;
  right: 12px;
  top: 44px;
  width: 16px;
  z-index: 1;
}
.Form-item--select.Form-item--flexItem::after {
  right: 20px;
}
.Form-item--select.Form-item--units::after {
  top: 14px;
}

/**
 * With action
 *
 * A form item with an inline action
 */
/**
 * Newsletter consent
 */
.Form-item--newsletterConsent {
  margin-top: 8px;
}

.Form-item--confirmation {
  margin-left: auto;
  margin-right: auto;
  max-width: 250px;
}

/* -----------------------------------------------------------------------------
 * Label
 *
 * The default form labels
 * -------------------------------------------------------------------------- */
.Form-label {
  display: block;
  font-family: "DM Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1.5;
  text-transform: uppercase;
}
.Form-label:disabled, .Form-label.is-disabled {
  color: #a4a4a4;
}
.Form-label a {
  color: #2a2a2a;
}
.Form-label a:visited {
  color: #2a2a2a;
}
.Form-label a:focus, .Form-label a:hover {
  color: #666;
}

/* Form labels that should not be capitalised */
.Form-label--lowercase {
  letter-spacing: normal;
  text-transform: none;
}

.Form-label--light {
  font-weight: 400;
}

/* stylelint-disable selector-class-pattern */
.Form-label--withCheckbox,
.collection_check_boxes {
  flex-grow: 1;
  /* style the fancy checkboxes */
}
.Form-label--withCheckbox::before,
.collection_check_boxes::before {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2218.134%22%20height%3D%2215.066%22%3E%3Cpolygon%20fill%3D%22white%22%20points%3D%2218.134%2C3.119%2015.013%2C0%206.187%2C8.827%203.12%2C5.76%200%2C8.878%206.185%2C15.066%206.187%2C15.064%206.187%2C15.066%22%2F%3E%3C%2Fsvg%3E");
  background-position: -100em 50%;
  background-repeat: no-repeat;
  background-size: 80%;
  border: 1px solid #8F8F8F;
  border-radius: 4px;
  content: "";
  display: block;
  height: 21px;
  left: 0;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 21px;
}

.Form-label--withRadio,
.collection_radio_buttons {
  flex-grow: 1;
  /* style the fancy radio buttons */
}
.Form-label--withRadio::before,
.collection_radio_buttons::before {
  border: 1px solid #8F8F8F;
  border-radius: 50%;
  content: "";
  height: 21px;
  left: 0;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 21px;
}
.Form-label--withRadio::after,
.collection_radio_buttons::after {
  border-radius: 50%;
  content: "";
  display: block;
  height: 13px;
  left: 4px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 13px;
}

/* stylelint-enable selector-class-pattern */
/* Labels that accompany boolean inputs positioned to the left */
.Form-label--withCheckboxAlignedLeft {
  padding-bottom: 8px;
  padding-top: 8px;
}

/* Labels that accompany boolean inputs positioned to the right */
.Form-label--withCheckboxAlignedRight {
  font-weight: 400;
  padding-bottom: 0;
  padding-top: 0;
  /* Correctly position the fancy checkboxes */
}
.Form-label--withCheckboxAlignedRight::before {
  left: auto;
  right: 0;
  top: 0;
  transform: none;
}

/* override cursor behaviour in some circumstances */
.Form-label--noClick {
  cursor: default;
}

/* Labels for social network fields */
.Form-label--social {
  flex-basis: auto;
  font-weight: 400;
  padding-right: 4px;
  padding-top: 13px;
  text-align: right;
  width: 50%;
}

/* Custom behaviour for alt maker label */
.Form-label--altMaker {
  margin-bottom: 8px;
}

/* -----------------------------------------------------------------------------
 * Control
 *
 * The control is the form element itself (input, select etc)
 * It changes depending on error state.
 * -------------------------------------------------------------------------- */
.Form-control {
  background-color: #f4f4f4;
  border: 1px solid #ccc;
  border-radius: 4px;
  color: #2a2a2a;
  font-family: "DM Sans", sans-serif;
  font-size: 14px;
  height: 44px;
  margin-top: 8px;
  padding: 11px 8px;
  width: 100%;
}
.Form-control:disabled, .Form-control.is-disabled {
  background-color: #fff;
  border: 0;
  cursor: default;
  padding-left: 0;
  padding-right: 0;
  /* make sure placeholders are greyed out too */
  /* stylelint-disable selector-no-vendor-prefix */
  /* Firefox 19+ */
  /* Firefox 18- */
  /* stylelint-enable selector-no-vendor-prefix */
}
.Form-control:disabled::-webkit-input-placeholder, .Form-control.is-disabled::-webkit-input-placeholder {
  color: #a4a4a4;
}
.Form-control:disabled::-moz-placeholder, .Form-control.is-disabled::-moz-placeholder {
  color: #a4a4a4;
}
.Form-control:disabled:-moz-placeholder, .Form-control.is-disabled:-moz-placeholder {
  color: #a4a4a4;
}
.Form-control:disabled:-ms-input-placeholder, .Form-control.is-disabled:-ms-input-placeholder {
  color: #a4a4a4;
}
.Form-control:focus, .Form-control.is-focus {
  background-color: #fff;
  outline: 0;
}
.Form-control.is-invalid {
  border-color: #ffc8ca;
  border-radius: 4px 4px 0 0;
}
.Form-control:read-only {
  user-select: none;
}
.Form-control:read-write {
  user-select: text;
}

.Form-control--search {
  margin-top: 0;
}

/* White modifier, has a white background for use on a non-white background */
.Form-control--white {
  background-color: #fff;
}

/* Style checkbox and radio inputs */
.Form-control--checkbox,
.Form-control--radio {
  flex-shrink: 0;
  height: 12px;
  margin-left: 4px;
  margin-right: 12px;
  margin-top: 0;
  opacity: 0;
  outline: none;
  width: auto;
  /**
   * when a checkbox has focus, change background-colour of fancy checkboxes
   * and radio buttons
   */
  /* stylelint-disable selector-class-pattern */
  /**
   * When a checkbox is checked, show the tick
   */
  /**
   * When a radio button is selected, show the filled input
   */
  /* make sure a disabled input actually looks disabled */
  /* stylelint-enable selector-class-pattern */
}
.Form-control--checkbox:focus ~ .Form-label--withCheckbox::before, .Form-control--checkbox:focus ~ .Form-label--withRadio::before, .Form-control--checkbox:focus ~ .collection_check_boxes::before, .Form-control--checkbox:focus ~ .collection_radio_buttons::before,
.Form-control--radio:focus ~ .Form-label--withCheckbox::before,
.Form-control--radio:focus ~ .Form-label--withRadio::before,
.Form-control--radio:focus ~ .collection_check_boxes::before,
.Form-control--radio:focus ~ .collection_radio_buttons::before {
  background-color: #BEDCFF;
  outline: 5px auto -webkit-focus-ring-color;
}
.Form-control--checkbox:checked ~ .Form-label--withCheckbox::before, .Form-control--checkbox:checked ~ .collection_check_boxes::before,
.Form-control--radio:checked ~ .Form-label--withCheckbox::before,
.Form-control--radio:checked ~ .collection_check_boxes::before {
  background-color: #267CDD;
  background-position: 50% 50%;
  border: 2px solid #267CDD;
}
.Form-control--checkbox:checked ~ .Form-label--withRadio::after, .Form-control--checkbox:checked ~ .collection_radio_buttons::after,
.Form-control--radio:checked ~ .Form-label--withRadio::after,
.Form-control--radio:checked ~ .collection_radio_buttons::after {
  background-color: #267CDD;
}
.Form-control--checkbox:disabled ~ .Form-label--withCheckbox, .Form-control--checkbox:disabled ~ .collection_check_boxes,
.Form-control--radio:disabled ~ .Form-label--withCheckbox,
.Form-control--radio:disabled ~ .collection_check_boxes {
  color: #a4a4a4;
  cursor: default;
}
.Form-control--checkbox:disabled ~ .Form-label--withCheckbox::before, .Form-control--checkbox:disabled ~ .collection_check_boxes::before,
.Form-control--radio:disabled ~ .Form-label--withCheckbox::before,
.Form-control--radio:disabled ~ .collection_check_boxes::before {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2218.134%22%20height%3D%2215.066%22%3E%3Cpolygon%20fill%3D%22%20%23a4a4a4%22%20points%3D%2218.134%2C3.119%2015.013%2C0%206.187%2C8.827%203.12%2C5.76%200%2C8.878%206.185%2C15.066%206.187%2C15.064%206.187%2C15.066%22%2F%3E%3C%2Fsvg%3E");
  cursor: default;
}
.Form-control--checkbox:disabled ~ .Form-label--withRadio, .Form-control--checkbox:disabled ~ .collection_radio_buttons,
.Form-control--radio:disabled ~ .Form-label--withRadio,
.Form-control--radio:disabled ~ .collection_radio_buttons {
  color: #a4a4a4;
  cursor: default;
}
.Form-control--checkbox:disabled ~ .Form-label--withRadio::before, .Form-control--checkbox:disabled ~ .collection_radio_buttons::before,
.Form-control--radio:disabled ~ .Form-label--withRadio::before,
.Form-control--radio:disabled ~ .collection_radio_buttons::before {
  cursor: default;
}
.Form-control--checkbox:disabled:checked ~ .Form-label--withRadio::after, .Form-control--checkbox:disabled:checked ~ .collection_radio_buttons::after,
.Form-control--radio:disabled:checked ~ .Form-label--withRadio::after,
.Form-control--radio:disabled:checked ~ .collection_radio_buttons::after {
  background-color: #a4a4a4;
}

/* Correctly position boolean inputs that should appear on the right */
.Form-control--checkboxAlignedRight {
  margin-left: 12px;
  margin-right: 4px;
  order: 1;
}

/* Style form controls that are textareas */
.Form-control--textarea {
  display: block;
  height: 126px;
  resize: none;
  /* special styles for disabled textareas */
}
.Form-control--textarea:disabled {
  background-color: #fff;
  border: 1px solid #f4f4f4;
  padding-left: 8px;
  padding-right: 8px;
}

/* Style the form control that contains the invite code slightly differently */
.Form-control--inviteCode {
  resize: none;
}
.Form-control--inviteCode:focus {
  background-color: #f4f4f4;
  outline: 0;
}
.Form-control--inviteCode:read-only {
  user-select: text;
}

/* Form controls for the social network fields */
.Form-control--social {
  flex-basis: auto;
  margin: 0;
  width: 50%;
}

/**
 * Select inputs
 *
 * Hide the standard browser select arrows
 */
.Form-control--select {
  appearance: none;
  padding-right: 38px;
}

/**
 * Password inputs
 *
 * see Form 'is-enhanced' state above
 */
/**
 * Transparent form control
 *
 * Requires individual vendor prefixes for some reason
 */
.Form-control--transparent {
  background-color: transparent;
  border-color: #fff;
  /* stylelint-disable selector-no-vendor-prefix */
  /* Firefox 19+ */
  /* Firefox 18- */
  /* ensure white background when input has a value */
}
.Form-control--transparent::-webkit-input-placeholder {
  color: #fff;
}
.Form-control--transparent::-moz-placeholder {
  color: #fff;
  opacity: 1;
}
.Form-control--transparent:-moz-placeholder {
  color: #fff;
  opacity: 1;
}
.Form-control--transparent:-ms-input-placeholder {
  color: #fff;
}
.Form-control--transparent:focus {
  /* Firefox 19+ */
  /* Firefox 18- */
}
.Form-control--transparent:focus::-webkit-input-placeholder {
  color: #7a7a7a;
}
.Form-control--transparent:focus::-moz-placeholder {
  color: #7a7a7a;
}
.Form-control--transparent:focus:-moz-placeholder {
  color: #7a7a7a;
}
.Form-control--transparent:focus:-ms-input-placeholder {
  color: #7a7a7a;
}
.Form-control--transparent.is-notEmpty {
  background-color: #fff;
}

.Form-control--cvv,
.Form-control--expiry {
  width: 80px;
}

.Form-control--uppercase {
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

/**
 * Read only
 *
 * For presenting information only
 */
.Form-control--readOnly {
  background-color: #fff;
  border-color: #fff;
  color: #2a2a2a;
  font-family: "DM Sans", sans-serif;
  font-size: 14px;
  font-weight: 400;
  height: auto;
  line-height: 1.5;
  padding: 0;
}

.Form-control--latlngName {
  margin-top: 24px;
}

.Form-control--array:not(:last-of-type) {
  margin-bottom: 24px;
}

/* -----------------------------------------------------------------------------
 * Item group
 *
 * Sometimes (e.g. for radio/check groups) an item can contain
 * more than one label and control. An Item Group is used to wrap
 * these labels and controls.
 * -------------------------------------------------------------------------- */
.Form-itemGroupItem {
  align-items: center;
  display: flex;
  font-family: "DM Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  padding-bottom: 8px;
  padding-top: 8px;
  position: relative;
}

/* -----------------------------------------------------------------------------
 * Error
 *
 * Errors are displayed after a form has been submitted with invalid entries
 * -------------------------------------------------------------------------- */
.Form-errors {
  background-color: #ee6265;
  border-radius: 4px;
  color: #fff;
  font-family: "DM Sans", sans-serif;
  font-size: 13px;
  font-weight: 700;
  margin-top: 24px;
  padding: 16px;
}
.Form-errors.is-hidden {
  display: none;
}

.Form-errorsList {
  list-style: disc;
  margin-left: 16px;
  margin-top: 4px;
}

/* an error that appears at the top of the form */
.Form-errorsItem {
  padding-top: 4px;
}

/* an error that appears under a Form-control */
.Form-error {
  background-color: #ee6265;
  border-radius: 0 0 4px 4px;
  color: #fff;
  font-family: "DM Sans", sans-serif;
  font-size: 13px;
  font-weight: 700;
  padding: 8px;
}

/* -----------------------------------------------------------------------------
 * Hint
 *
 * Hints are used to provide extra guidance to users about certain form inputs
 * -------------------------------------------------------------------------- */
.Form-hint {
  color: #3d3d3d;
  font-family: "DM Sans", sans-serif;
  font-size: 12px;
  font-weight: 400;
  margin-top: 8px;
  /**
   * 'is disabled' state
   *
   * Grey out the hint text
   */
}
.Form-hint.is-disabled {
  color: #a4a4a4;
}

.Form-hint--center {
  text-align: center;
}

.Form-hint--withCheckbox {
  order: 1;
  width: 100%;
}

.Form-hint--link:link, .Form-hint--link:visited, .Form-hint--link:hover, .Form-hint--link:active {
  color: #3d3d3d;
}

/* -----------------------------------------------------------------------------
 * Info
 *
 * Info elements are used to provide additional text on the form
 * -------------------------------------------------------------------------- */
.Form-info {
  color: #3d3d3d;
  font-family: "DM Sans", sans-serif;
  font-size: 12px;
  font-weight: 400;
  margin-top: 16px;
  transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}
.Form-info.is-hidden {
  opacity: 0;
}

.Form-info--terms {
  margin-bottom: 8px;
  margin-top: 8px;
}

.Form-info--alignCenter {
  text-align: center;
}

.Form-infoInner {
  color: #3d3d3d;
}
.Form-infoInner:visited {
  color: #3d3d3d;
}

.Form-infoHeading {
  font-family: "DM Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1.5;
  padding-top: 8px;
  text-transform: uppercase;
}

.Form-info--required {
  font-size: 14px;
  font-weight: 700;
  margin-top: 32px;
}

/**
 * Help
 */
.Form-help {
  font-family: "DM Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 24px;
  text-align: center;
}

/* -----------------------------------------------------------------------------
 * Action
 *
 * Container for form actions, e.g. submit buttons
 * -------------------------------------------------------------------------- */
.Form-action {
  margin-top: 8px;
}
.Form-action.is-hidden {
  display: none;
}

.Form-actionsOuter {
  margin-top: 32px;
}
.Form-actionsOuter .Form-actions {
  margin-top: 0;
}

.Form-actions {
  margin-left: auto;
  margin-right: auto;
  margin-top: 32px;
  max-width: 320px;
  text-align: center;
}

.Form-actions--inline {
  margin-top: 0;
}

.Form-actions--collapsible {
  transition: opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1), padding 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.Form-actions--collapsible.is-hidden {
  height: 0;
  margin-top: 0;
  opacity: 0;
  overflow: hidden;
  visibility: hidden;
}

/* -----------------------------------------------------------------------------
 * Grid
 *
 * For displaying avatars (of collaborators) in a grid layout
 *--------------------------------------------------------------------------- */
.Form-grid {
  background-color: #f4f4f4;
  border: 1px dashed #ccc;
  padding-bottom: 32px;
  padding-left: 16px;
  padding-right: 16px;
}

.Form-gridList {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-left: -8px;
  margin-right: -8px;
}

.Form-gridItem {
  flex-basis: auto;
  margin-top: 16px;
  max-width: 176px;
  padding-left: 8px;
  padding-right: 8px;
  position: relative;
  width: 50%;
}

.Form-gridItem--collaborator {
  width: 80px;
}

.Form-gridItemMedia {
  max-width: 100%;
}

.Form-gridAction {
  margin-top: 32px;
  text-align: center;
}

/* -----------------------------------------------------------------------------
 * Row
 *
 * For displaying story posts and photos in a row layout
 * -------------------------------------------------------------------------- */
.Form-row {
  background-color: #f4f4f4;
  border: 1px dashed #ccc;
  display: flex;
  margin-top: 8px;
  padding: 16px;
  position: relative;
}
.Form-row.is-hidden {
  display: none;
}

.Form-row--action {
  justify-content: center;
}

.Form-rowLoading {
  align-items: center;
  background-color: #f4f4f4;
  display: flex;
  height: 100%;
  justify-content: center;
  left: 0;
  opacity: 0;
  position: absolute;
  top: 0;
  transition: background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  visibility: hidden;
  width: 100%;
  z-index: 1;
}
.Form-rowLoading.is-visible {
  background-color: rgba(244, 244, 244, 0.9);
  opacity: 1;
  visibility: visible;
}

.Form-rowLoadingCopy {
  color: #525252;
  font-family: "DM Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
}

.Form-rowImage {
  max-width: 160px;
  width: 50%;
}

.Form-rowImageInner.is-hover .Form-rowImageMask {
  background-color: rgba(0, 0, 0, 0.5);
}

.Form-rowImageMask {
  align-items: center;
  display: flex;
  height: 100%;
  justify-content: center;
  left: 0;
  position: absolute;
  top: 0;
  transition: background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  width: 100%;
}

.Form-rowImageMedia {
  max-width: 100%;
}

.Form-rowActions {
  align-items: center;
  display: flex;
  flex-grow: 1;
  justify-content: space-around;
  padding-left: 16px;
}

.Form-rowActionOuter--delete {
  order: 1;
}

.Form-rowAction {
  color: #666;
  font-family: "DM Sans", sans-serif;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  width: 100%;
  /* stylelint-disable selector-no-attribute */
  /* stylelint-enable selector-no-attribute */
}
.Form-rowAction:visited {
  color: #666;
}
.Form-rowAction.is-hover .Form-rowActionText {
  opacity: 1;
}
.Form-rowAction[disabled] {
  color: #ccc;
}

.Form-rowAction--delete {
  color: #3b2d51;
}
.Form-rowAction--delete:visited {
  color: #3b2d51;
}

.Form-rowActionInner {
  display: flex;
  justify-content: center;
}

.Form-rowActionText {
  display: none;
  margin-bottom: auto;
  margin-top: auto;
  opacity: 0;
  padding-left: 8px;
  transition: opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.Form-rowActionMedia {
  fill: currentColor;
  flex-shrink: 0;
  height: 24px;
  width: 24px;
}

.Form-rowActionMedia--up {
  transform: rotate(270deg);
}

.Form-rowActionMedia--down {
  transform: rotate(90deg);
}

.Form-rowActionMedia--delete {
  background-color: #3b2d51;
  border-radius: 50%;
  fill: #fff;
  padding: 8px;
}

/* -----------------------------------------------------------------------------
 * Miscellaneous
 *
 * Additional miscellaneous form elements
 * -------------------------------------------------------------------------- */
/**
 * Copy
 */
.Form-copy {
  margin-top: 24px;
  text-align: center;
}

.Form-copy--underCheckbox {
  margin-top: 32px;
}

.Form-copy--largeMarginTop {
  margin-top: 32px;
}

/**
 * Flex inner
 *
 * Used to apply flex positioning to form elements that should appear in the
 * same row, e.g. the sign up forms on the homepage
 *
 * 1. Set a deliberately small width, but allow it to grow (fixes an issue seen
 * in Firefox and Safari, but not Chrome)
 */
.Form-flexInner {
  display: flex;
}
.Form-flexInner .Form-control {
  flex-basis: auto;
  flex-grow: 1;
  margin-right: 8px;
  margin-top: 0;
  width: 50%; /* 1 */
}
.Form-flexInner .Form-actions {
  flex-basis: auto;
  flex-shrink: 0;
  margin-top: 0;
  width: auto;
}

/* wrap until mobile-wide viewport */
.Form-flexInner--wrap {
  flex-wrap: wrap;
}
.Form-flexInner--wrap .Form-control {
  margin-left: auto;
  margin-right: auto;
  max-width: 320px;
  width: 100%;
}
.Form-flexInner--wrap .Form-actions {
  flex-grow: 1;
  margin-top: 8px;
  width: 100%;
}

/**
 * Flex image
 *
 * Is used within a flex container to contain an image on the left-hand side
 */
.Form-flexImage {
  flex-shrink: 0;
  height: 64px;
  width: 64px;
}

.Form-flexImage--grey {
  background-color: #f4f4f4;
}

.Form-flexImageMedia {
  border: 3px solid #fff;
  box-shadow: 0 0 2px 0 #ccc;
  height: auto;
  width: 100%;
}

/**
 * Flex content
 *
 * Is used within a flex container to contain additional content
 */
.Form-flexContent {
  flex-grow: 1;
  margin-bottom: auto;
  margin-top: auto;
  padding-left: 16px;
}

.Form-flexCopy {
  color: #666;
  font-family: "DM Sans", sans-serif;
  font-size: 13px;
  font-weight: 400;
  margin-top: 1px;
}
.Form-flexCopy:first-of-type {
  margin-top: 0;
}

.Form-flexCopy--quantity {
  color: #99b9ae;
  margin-top: 12px;
}

.Form-flexCopy--heading {
  color: #2a2a2a;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

/**
 * Story image default
 *
 * Present icon for stories with no lead product photo.
 */
.Form-storyImageDefault {
  background-color: #f4f4f4;
  fill: #ccc;
  height: 100%;
  width: 100%;
}

/**
 * Social network fields
 */
.Form-socialIcon {
  fill: #3b2d51;
  height: 20px;
  left: 0;
  position: absolute;
  top: 14px;
  width: 20px;
}

/**
 * Block title
 */
.Form-blockTitle {
  margin-top: 24px;
}

.Form-blockTitle--narrow {
  margin-left: auto;
  margin-right: auto;
  max-width: 320px;
}

.Form-blockTitle--moreMargin {
  margin-top: 32px;
}

.Form-blockTitle--photoEvidence {
  margin-bottom: 32px;
  margin-top: 32px;
}

/**
 * Multiple posts
 */
.Form-multiplePosts {
  margin-left: -16px;
  margin-right: -16px;
}

/**
 * Multiple pills
 */
.Form-multiplePills {
  margin-top: 16px;
}
.Form-multiplePills.is-invalid {
  border: 1px solid #ee6265;
  border-radius: 4px 4px 0 0;
  padding-bottom: 10px;
  padding-left: 6px;
  padding-right: 6px;
}
.Form-multiplePills + .Form-error {
  text-align: center;
}

/**
 * Additional fields
 */
.Form-additionalFields {
  margin-top: 24px;
  overflow-y: hidden;
}

.Form-additionalFieldsToggle {
  color: #2a2a2a;
  display: block;
  font-family: "DM Sans", sans-serif;
  font-size: 14px;
  font-weight: 400;
  text-align: center;
}
.Form-additionalFieldsToggle:visited {
  color: #2a2a2a;
}
.Form-additionalFieldsToggle:active, .Form-additionalFieldsToggle:hover, .Form-additionalFieldsToggle:focus {
  color: #666;
}

.Form-additionalFieldsInner {
  max-height: 0;
  opacity: 0;
  transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  visibility: hidden;
}
.Form-additionalFieldsInner.is-visible {
  max-height: 500px;
  opacity: 1;
  visibility: visible;
}

/**
 * Password toggle
 *
 * A toggle for show/hide password, shown only when Form 'is enhanced'
 */
.Form-passwordToggle {
  color: #3b2d51;
  display: none;
  font-family: "DM Sans", sans-serif;
  font-size: 13px;
  font-weight: 400;
  position: absolute;
  right: 8px;
  text-decoration: none;
  top: 44px;
}

/**
 * Quantity units
 */
.Form-quantityUnits {
  display: flex;
  width: 100%;
}
.Form-quantityUnits .Form-item--quantity {
  padding-right: 8px;
  width: 50%;
}
.Form-quantityUnits .Form-item--units {
  padding-left: 8px;
  width: 50%;
}
.Form-quantityUnits .Form-control {
  margin-top: 0;
  width: 100%;
}

/**
 * Loading
 */
.Form-loading {
  padding-top: 20px;
}

/**
 * Photo evidence
 */
.Form-photoEvidence.is-hidden {
  display: none;
}

/* -----------------------------------------------------------------------------
 * Media queries
 * -------------------------------------------------------------------------- */
/**
 * Mobile wide viewport
 */
@media (min-width: 480px) {
  .Form-flexInner--wrap {
    flex-wrap: nowrap;
  }
  .Form-flexInner--wrap .Form-control {
    margin-right: 8px;
    max-width: none;
  }
  .Form-flexInner--wrap .Form-actions {
    flex-grow: 0;
    margin-top: 0;
    width: auto;
  }
}
/**
 * Desktop viewport
 */
@media (min-width: 960px) {
  .Form-group {
    padding-top: 48px;
  }
  .Form-group--desktopFlex {
    display: flex;
    flex-wrap: wrap;
  }
  .Form-group--tight {
    padding-top: 40px;
  }
  .Form-group--tighter {
    padding-top: 32px;
  }
  .Form-group--smallPaddingTop {
    padding-top: 8px;
  }
  .Form-group--mediumPaddingTop {
    padding-top: 24px;
  }
  .Form-group--checkbox.is-hidden + .Form-group--checkbox {
    padding-top: 48px;
  }
  .Form-groupInner {
    align-self: flex-start;
    flex-basis: auto;
    width: 66.6666666667%;
  }
  /* remove margin-top */
  .Form-groupInner--flex {
    margin-top: 0;
  }
  /* negative margin to prevent double spacing */
  .Form-groupInner--social {
    margin-top: -8px;
  }
  .Form-groupInner--noLabel {
    margin-left: 33.3333333333%;
  }
  /**
   * Items
   */
  /* Apply flexbox to the standard form items on bigger screens */
  .Form-item {
    display: flex;
    flex-wrap: wrap;
  }
  .Form-item.is-invalid .Form-itemGroup {
    margin-top: 0;
  }
  /* Position items center */
  .Form-item--justifyContent {
    justify-content: center;
  }
  /* Push the newsletter Form-item over to the RHS */
  .Form-item--newsletter {
    margin-left: 33.3333333333%;
  }
  /* Push the remember me Form-item over to the RHS */
  .Form-item--rememberMe {
    margin-left: 33.3333333333%;
  }
  /* Make sure custom drop-down arrows are correctly positioned */
  .Form-item--select::after {
    top: 14px;
  }
  .Form-item--flexItem + .Form-item--flexItem {
    margin-top: 48px;
  }
  /* Make these form items full width */
  .Form-item--flexItemSmall50 {
    width: 100%;
  }
  .Form-item--withAction .Form-label {
    margin-top: 0;
    width: 100%;
  }
  .Form-item--withAction .Form-control {
    flex-grow: 1;
    margin-top: 8px;
    width: auto;
  }
  .Form-item--withAction .Form-action {
    margin-left: 8px;
    min-width: 200px;
    position: relative;
  }
  /**
   * Labels
   */
  /* Position standard labels on the LHS */
  .Form-label {
    flex-basis: auto;
    margin-top: 12px;
    padding-right: 24px;
    width: 33.3333333333%;
  }
  /* when label falls onto two lines, remove margin-top for better positioning */
  .Form-label--twoLines {
    margin-top: 0;
  }
  /* a label alongside a single checkbox needs less top margin */
  .Form-label--singleCheckbox {
    margin-top: 8px;
  }
  /* Correctly position checkbox labels */
  .Form-label--withCheckbox {
    flex-grow: 1;
    margin-top: 0;
    padding-right: 0;
  }
  /* Make sure alt maker label fills the width of its container */
  .Form-label--altMaker {
    flex-basis: auto;
    margin-top: 0;
    min-height: 0;
    padding-right: 0;
    width: 100%;
  }
  /* Ensure the Form-labels for social networks aren't too big */
  .Form-label--social {
    flex-basis: auto;
    margin-top: 0;
    padding-right: 4px;
    width: 40%;
  }
  /* Remove the top margin */
  .Form-label--readOnly {
    margin-top: 0;
  }
  /**
   * Controls
   */
  /* Position standard form controls on the RHS */
  .Form-control {
    flex-basis: auto;
    margin-top: 0;
    width: 66.6666666667%;
  }
  .Form-item--secondary .Form-control {
    width: 100%;
  }
  /* Correctly position checkboxes and radio inputs */
  .Form-control--checkbox,
  .Form-control--radio {
    width: auto;
  }
  /* Increase the size of the Form-controls for social networks */
  .Form-control--social {
    width: 60%;
  }
  .Form-control--inviteCode {
    width: 100%;
  }
  .Form-control--search {
    width: 100%;
  }
  .Form-control--cvv,
  .Form-control--expiry {
    width: 80px;
  }
  /* Ensure these controls fill the width and keeps a margin-top */
  .Form-control--noLabel {
    margin-top: 8px;
    width: 100%;
  }
  /* Ensure this form input is a specific width */
  .Form-control--latlngName {
    margin-top: 24px;
    width: 320px;
  }
  /* Correctly position unusual elements on the RHS */
  .Form-itemInner {
    flex-basis: auto;
    width: 66.6666666667%;
  }
  /**
   * Location
   */
  /* comes in its own span which needs to be correctly positioned on the RHS */
  .Form-location {
    flex-basis: auto;
    width: 66.6666666667%;
  }
  .Form-location .Form-control--location {
    width: 100%;
  }
  /* override standard behaviour for the new location input */
  .Form-item--newLocation .Form-item {
    width: 100%;
  }
  .Form-item--newLocation .Form-location {
    width: 100%;
  }
  /**
   * Item group
   *
   * Comes in its own div which needs to be correctly positioned on the RHS
   * and remove default margin-top
   */
  .Form-itemGroup {
    flex-basis: auto;
    margin-top: 0;
    width: 66.6666666667%;
  }
  /**
   * Hints
   *
   * Ensure Form-hints wrap and then appear on the RHS
   */
  .Form-hint {
    flex-basis: auto;
    margin-left: 33.3333333333%;
    width: 66.6666666667%;
    /* but not these ones */
  }
  .Form-item--secondary .Form-hint {
    margin-left: 0;
    width: 100%;
  }
  .Form-hint--center {
    margin-left: 0;
    width: 100%;
  }
  .Form-hint--withCheckbox {
    margin-left: 0;
    width: 100%;
  }
  /**
   * Copy
   */
  .Form-copy {
    margin-top: 40px;
  }
  .Form-copy--underCheckbox {
    margin-top: 40px;
  }
  .Form-copy--largeMarginTop {
    margin-top: 48px;
  }
  /**
   * Info
   *
   * Standard Form-info text should be positioned on the RHS
   */
  .Form-info {
    margin-left: 33.3333333333%;
  }
  /* Form-info that appears beneath a box element should be positioned center */
  .Form-info--center {
    margin-left: auto;
    margin-right: auto;
    margin-top: 16px;
    max-width: 320px;
    text-align: center;
  }
  .Form-info--terms {
    margin-left: 0;
  }
  /* Form-info that appears beneath a box element that does not need padding */
  .Form-info--underBox {
    margin-left: 0;
    margin-right: 0;
    margin-top: 16px;
  }
  .Form-info--alignCenter {
    margin-left: auto;
    margin-right: auto;
  }
  .Form-info--required {
    margin-top: 48px;
  }
  /**
   * Errors
   */
  .Form-errors {
    margin-top: 32px;
    padding: 24px;
  }
  .Form-errorsList {
    margin-top: 8px;
  }
  /* Standard form error items should be positioned on the RHS */
  .Form-error {
    flex-basis: auto;
    margin-left: 33.3333333333%;
    width: 100%;
  }
  /* Form error items that are within a form group with flexbox should have no margin-left */
  .Form-group--desktopFlex .Form-error,
  .Form-groupInner--noLabel .Form-error {
    margin-left: 0;
  }
  /* Form error item that follows a filestack module should be centred */
  .Form-filestack + .Form-error {
    margin-left: 0;
    text-align: center;
  }
  .Form-multiplePills + .Form-error {
    margin-left: 0;
  }
  /**
   * Actions
   */
  .Form-actionsOuter {
    margin-top: 48px;
  }
  .Form-actions {
    margin-top: 40px;
  }
  .Form-actions--reducePadding {
    margin-top: 32px;
  }
  /* Prevent extra spacing above inline Form-actions */
  .Form-actions--inline {
    margin-top: 0;
  }
  /**
   * Grid
   */
  /* Ensure the grid action fills the width */
  .Form-gridAction {
    flex-basis: auto;
    width: 100%;
  }
  /**
   * Row
   */
  .Form-row:first-of-type {
    margin-top: 0;
  }
  .Form-rowActions {
    flex-direction: column;
  }
  .Form-rowActionOuter {
    width: 100%;
  }
  .Form-rowActionOuter--delete {
    order: 0;
  }
  .Form-rowActionInner {
    justify-content: flex-start;
  }
  .Form-rowAction--delete .Form-rowActionText {
    opacity: 1;
  }
  .Form-rowActionText {
    display: block;
  }
  /**
   * Block title
   */
  .Form-blockTitle {
    margin-top: 48px;
  }
  .Form-blockTitle--narrow {
    margin-top: 32px;
  }
  .Form-blockTitle--photoEvidence {
    margin-bottom: 40px;
    margin-top: 40px;
  }
  /**
   * Multiple posts
   */
  .Form-multiplePosts {
    margin-left: -20px;
    margin-right: -20px;
  }
  .Form-multiplePills {
    margin-top: 24px;
  }
  /**
   * Flex content
   */
  .Form-flexImage {
    height: 80px;
    width: 80px;
  }
  .Form-flexContent {
    padding-left: 24px;
  }
  .Form-flexCopy {
    font-size: 14px;
    margin-top: 4px;
  }
  .Form-flexCopy:first-of-type {
    margin-top: 0;
  }
  .Form-flexCopy--heading {
    font-size: 14px;
  }
  /**
   * Additional fields
   */
  .Form-additionalFields {
    margin-top: 48px;
  }
  .Form-additionalFieldsToggle {
    margin-left: 33.3333333333%;
    text-align: left;
  }
  /**
   * Password toggle
   */
  .Form-passwordToggle {
    top: 14px;
  }
}
/**
 * Large viewport
 */
@media (min-width: 1200px) {
  /**
   * Multiple posts
   */
  .Form-multiplePosts {
    margin-left: -24px;
    margin-right: -24px;
  }
}
/**
 * Theme
 *
 * Global variables in use throughout the application
 */
/**
 * Colours
 */
/* Main colour palette */
/* rgb(0, 0, 0) */
/* rgb(42, 42, 42) */
/* rgb(61, 61, 61) */
/* rgb(82, 82, 82) */
/* rgb(102, 102, 102) */
/* rgb(122, 122, 122) */
/* rgb(164, 164, 164) */
/* rgb(204, 204, 204) */
/* rgb(244, 244, 244) */
/* rgb(249, 249, 249) */
/* rgb(255, 255, 255) */
/* rgb(122, 122, 122) */
/* rgba(255, 200, 202) */
/* rgb(61,61,61) */
/* rgba(225, 234, 224) */
/* rgb(225, 234, 224) */
/* rgb(42, 42, 42) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(59, 45, 81) */
/* rgb(77, 66, 98) */
/* rgb(153, 185, 174) */
/* rgb(238, 98, 101) */
/* rgb(240, 114, 116) */
/* rgb(255, 200, 202) */
/* rgb(73, 84, 100) */
/* rgb(244, 244, 244) */
/* rgb(204, 204, 204) */
/* rgb(204, 204, 204) */
/* black percentages use absolute black */
/* Additional colours */
/* rgb(133, 187, 204) */
/* rgb(120, 169, 184) */
/* rgb(240, 103, 100) */
/* rgb(217, 93, 90) */
/* rgb(28, 89, 127) */
/* rgb(25, 81, 115) */
/* New colours */
/* Family */
/* For now, both of these are being defined to the DM Sans font. At a later time
this will be cleaned up to improve how the site-wide fonts are defined. */
/* Sizes */
/* Font-weight */
/* Line height */
/* Letter-spacing */
/* Spacing */
/**
 * Animations
 */
/**
 * Transitions
 */
/* Duration */
/* timing function */
/**
 * Breakpoints
 */
/**
 * Container widths
 */
/**
 * Page header
 *
 * A simple header section with a light grey background
 */
.PageHeader {
  background-color: #f9f9f9;
  padding-bottom: 32px;
  padding-top: 32px;
}

.PageHeader--withTabs {
  padding-bottom: 0;
}

.PageHeader-inner {
  padding-left: 24px;
  padding-right: 24px;
}

.PageHeader-contents {
  align-items: flex-end;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.PageHeader-title {
  margin-right: 24px;
}

.PageHeader-intro {
  color: #2a2a2a;
  font-family: "DM Sans", sans-serif;
  font-size: 16px;
  line-height: 1.3;
  margin: 8px 0 24px;
}

.PageHeader-button {
  margin-top: 24px;
}

.PageHeader-tabs {
  display: flex;
  padding-top: 32px;
}

.PageHeader-tab {
  color: #666;
  font-family: "DM Sans", sans-serif;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1.5;
  margin-right: 40px;
  text-transform: uppercase;
}
.PageHeader-tab.is-active {
  border-bottom: 2px solid #3b2d51;
  color: #3b2d51;
}
.PageHeader-tab a {
  color: inherit;
  text-decoration: none;
}
.PageHeader-tab a:visited {
  color: inherit;
}

/* -----------------------------------------------------------------------------
 * Media queries
 * -------------------------------------------------------------------------- */
@media (min-width: 768px) {
  .PageHeader-inner {
    padding-left: 32px;
    padding-right: 32px;
  }
}
@media (min-width: 960px) {
  .PageHeader--tabs {
    padding-bottom: 0;
  }
  .PageHeader-intro {
    max-width: 66%;
  }
}
@media (min-width: 1200px) {
  .PageHeader-inner {
    padding-left: 48px;
    padding-right: 48px;
  }
}
/* stylelint-disable */
.Action--primary {
  background-color: #3b2d51;
  border: 1px solid #3b2d51;
  display: inline-block;
  width: auto;
  /* stylelint-disable selector-no-attribute */
  /* stylelint-enable selector-no-attribute */
}
.Action--primary:visited {
  color: #fff;
}
.Action--primary:focus, .Action--primary:hover {
  background-color: #4d4262;
  border: 1px solid #4d4262;
  color: #fff;
  cursor: pointer;
}
.Action--primary[disabled], .Action--primary.is-disabled {
  background-color: #ccc;
  border: 1px solid #ccc;
  cursor: default;
}
.Action--primary.is-inactive {
  background-color: #f4f4f4;
  border-color: #f4f4f4;
  color: #a4a4a4;
  cursor: default;
}
.Action--primary + .Action:not(.Action--inline) {
  margin-top: 8px;
}

/**
 * Primary alternative action
 */
.Action--secondary {
  background-color: #fff;
  border-color: var(--color-scale-prov-gray-8);
  color: #3b2d51;
  display: inline-block;
  width: auto;
}
.Action--secondary:visited {
  color: #3b2d51;
}
.Action--secondary:focus, .Action--secondary:hover {
  background-color: #fff;
  border-color: #4d4262;
  color: #4d4262;
}
.Action--secondary[disabled], .Action--secondary.is-disabled {
  background-color: #fff;
  border: 1px solid #B4B4B4;
  color: #B4B4B4;
  cursor: default;
}

/**
 * Action full width
 */
.Action--wide {
  display: block;
  width: 100%;
}

/**
 * An Action that grows to fill remaining space in flexbox
 */
.Action--grow {
  display: block;
  flex-grow: 1;
}

.Action--flex {
  display: flex;
}

/**
 * Action with no padding
 */
.Action--noPadding {
  padding: 0;
}

/**
* Action that aligns on the left
*
*/
.Action--flushLeft {
  flex-shrink: 0;
  padding-left: 0;
}

/**
 * Action inline display, for left alignment for example
 */
.Action--inline {
  display: inline;
}

.Action--text {
  background-color: transparent;
  border-color: transparent;
  color: #3b2d51;
  letter-spacing: normal;
  text-decoration: underline;
  text-transform: none;
  /* stylelint-disable selector-no-attribute */
  /* stylelint-enable selector-no-attribute */
}
.Action--text:visited {
  color: #3b2d51;
}
.Action--text:focus, .Action--text:hover {
  background-color: transparent;
  border-color: transparent;
  color: #4d4262;
  text-decoration: none;
}
.Action--text[disabled], .Action--text.is-disabled {
  background-color: transparent;
  border-color: transparent;
  color: #ccc;
}

/**
 * Alert action
 */
.Action--alert {
  background-color: #ee6265;
  border-color: #ee6265;
  /* stylelint-disable selector-no-attribute */
  /* stylelint-enable selector-no-attribute */
}
.Action--alert:focus, .Action--alert:hover {
  background-color: #f07274;
  border-color: #f07274;
}
.Action--alert[disabled], .Action--alert.is-disabled {
  background-color: #ccc;
  border: 1px solid #ccc;
  cursor: default;
}

/**
 * Delete action
 */
.Action--delete {
  color: #ee6265;
  /* stylelint-disable selector-no-attribute */
  /* stylelint-enable selector-no-attribute */
}
.Action--delete:visited {
  color: #ee6265;
}
.Action--delete:focus, .Action--delete:hover {
  color: #f07274;
}
.Action--delete[disabled], .Action--delete.is-disabled {
  cursor: default;
}

/**
 * Medium modifier
 *
 * Action text has slightly smaller font-size
 * and tighter padding
 */
.Action--medium {
  font-size: 13px;
  line-height: 13px;
  padding: 8px;
  /* reduce margin-top slightly in these circumstances */
}
.Action--medium > svg {
  margin-right: 4px;
}

.Action--circle {
  align-items: center;
  background-color: rgba(42, 42, 42, 0.4);
  border-radius: 50%;
  color: #fff;
  display: flex;
  height: 40px;
  justify-content: center;
  width: 40px;
}
.Action--circle > svg {
  max-width: 16px;
}

.ActionGroup {
  align-items: baseline;
  display: flex;
  width: auto;
}
.ActionGroup * + * {
  margin-left: 16px;
}

/**
 * Theme
 *
 * Global variables in use throughout the application
 */
/**
 * Colours
 */
/* Main colour palette */
/* rgb(0, 0, 0) */
/* rgb(42, 42, 42) */
/* rgb(61, 61, 61) */
/* rgb(82, 82, 82) */
/* rgb(102, 102, 102) */
/* rgb(122, 122, 122) */
/* rgb(164, 164, 164) */
/* rgb(204, 204, 204) */
/* rgb(244, 244, 244) */
/* rgb(249, 249, 249) */
/* rgb(255, 255, 255) */
/* rgb(122, 122, 122) */
/* rgba(255, 200, 202) */
/* rgb(61,61,61) */
/* rgba(225, 234, 224) */
/* rgb(225, 234, 224) */
/* rgb(42, 42, 42) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(59, 45, 81) */
/* rgb(77, 66, 98) */
/* rgb(153, 185, 174) */
/* rgb(238, 98, 101) */
/* rgb(240, 114, 116) */
/* rgb(255, 200, 202) */
/* rgb(73, 84, 100) */
/* rgb(244, 244, 244) */
/* rgb(204, 204, 204) */
/* rgb(204, 204, 204) */
/* black percentages use absolute black */
/* Additional colours */
/* rgb(133, 187, 204) */
/* rgb(120, 169, 184) */
/* rgb(240, 103, 100) */
/* rgb(217, 93, 90) */
/* rgb(28, 89, 127) */
/* rgb(25, 81, 115) */
/* New colours */
/* Family */
/* For now, both of these are being defined to the DM Sans font. At a later time
this will be cleaned up to improve how the site-wide fonts are defined. */
/* Sizes */
/* Font-weight */
/* Line height */
/* Letter-spacing */
/* Spacing */
/**
 * Animations
 */
/**
 * Transitions
 */
/* Duration */
/* timing function */
/**
 * Breakpoints
 */
/**
 * Container widths
 */
/*
* Bundle
*
* A container for multiple proofpoints
*
*/
.Bundle {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 4px 7px 0;
  position: relative;
  width: 100%;
}

.Bundle-wordmark {
  align-items: flex-end;
  border-top: solid 1px #000;
  display: flex;
  flex-direction: column;
  height: 36px;
  margin-top: 12px;
  padding-top: 8px;
}

tabs-nav + .Bundle-wordmark .powered-by {
  display: none;
}

@media (min-width: 380px) {
  tabs-nav + .Bundle-wordmark .powered-by {
    display: block;
  }
}
.Bundle--card .Bundle-wordmark {
  margin-top: -7px; /* this negative margin is a hack to make sure that the card hover shadow is visible (it may get cut off by overflow hidden) */
}

/**
 * Theme
 *
 * Global variables in use throughout the application
 */
/**
 * Colours
 */
/* Main colour palette */
/* rgb(0, 0, 0) */
/* rgb(42, 42, 42) */
/* rgb(61, 61, 61) */
/* rgb(82, 82, 82) */
/* rgb(102, 102, 102) */
/* rgb(122, 122, 122) */
/* rgb(164, 164, 164) */
/* rgb(204, 204, 204) */
/* rgb(244, 244, 244) */
/* rgb(249, 249, 249) */
/* rgb(255, 255, 255) */
/* rgb(122, 122, 122) */
/* rgba(255, 200, 202) */
/* rgb(61,61,61) */
/* rgba(225, 234, 224) */
/* rgb(225, 234, 224) */
/* rgb(42, 42, 42) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(59, 45, 81) */
/* rgb(77, 66, 98) */
/* rgb(153, 185, 174) */
/* rgb(238, 98, 101) */
/* rgb(240, 114, 116) */
/* rgb(255, 200, 202) */
/* rgb(73, 84, 100) */
/* rgb(244, 244, 244) */
/* rgb(204, 204, 204) */
/* rgb(204, 204, 204) */
/* black percentages use absolute black */
/* Additional colours */
/* rgb(133, 187, 204) */
/* rgb(120, 169, 184) */
/* rgb(240, 103, 100) */
/* rgb(217, 93, 90) */
/* rgb(28, 89, 127) */
/* rgb(25, 81, 115) */
/* New colours */
/* Family */
/* For now, both of these are being defined to the DM Sans font. At a later time
this will be cleaned up to improve how the site-wide fonts are defined. */
/* Sizes */
/* Font-weight */
/* Line height */
/* Letter-spacing */
/* Spacing */
/**
 * Animations
 */
/**
 * Transitions
 */
/* Duration */
/* timing function */
/**
 * Breakpoints
 */
/**
 * Container widths
 */
/**
 * Theme
 *
 * Global variables in use throughout the application
 */
/**
 * Colours
 */
/* Main colour palette */
/* rgb(0, 0, 0) */
/* rgb(42, 42, 42) */
/* rgb(61, 61, 61) */
/* rgb(82, 82, 82) */
/* rgb(102, 102, 102) */
/* rgb(122, 122, 122) */
/* rgb(164, 164, 164) */
/* rgb(204, 204, 204) */
/* rgb(244, 244, 244) */
/* rgb(249, 249, 249) */
/* rgb(255, 255, 255) */
/* rgb(122, 122, 122) */
/* rgba(255, 200, 202) */
/* rgb(61,61,61) */
/* rgba(225, 234, 224) */
/* rgb(225, 234, 224) */
/* rgb(42, 42, 42) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(59, 45, 81) */
/* rgb(77, 66, 98) */
/* rgb(153, 185, 174) */
/* rgb(238, 98, 101) */
/* rgb(240, 114, 116) */
/* rgb(255, 200, 202) */
/* rgb(73, 84, 100) */
/* rgb(244, 244, 244) */
/* rgb(204, 204, 204) */
/* rgb(204, 204, 204) */
/* black percentages use absolute black */
/* Additional colours */
/* rgb(133, 187, 204) */
/* rgb(120, 169, 184) */
/* rgb(240, 103, 100) */
/* rgb(217, 93, 90) */
/* rgb(28, 89, 127) */
/* rgb(25, 81, 115) */
/* New colours */
/* Family */
/* For now, both of these are being defined to the DM Sans font. At a later time
this will be cleaned up to improve how the site-wide fonts are defined. */
/* Sizes */
/* Font-weight */
/* Line height */
/* Letter-spacing */
/* Spacing */
/**
 * Animations
 */
/**
 * Transitions
 */
/* Duration */
/* timing function */
/**
 * Breakpoints
 */
/**
 * Container widths
 */
/**
 * Claim themes
 */
/**
 * Colours
 */
.ClaimCapsule {
  align-items: center;
  background-color: #fff;
  border-color: #a4a4a4;
  border-radius: 1em;
  border-style: solid; /* 1/16 */
  border-width: 0.0625em; /* 1/16 */
  display: inline-flex;
  justify-content: center;
  padding: 0.375em 0.75em; /* 6/16 */ /* 12/16 */
}

.ClaimCapsule--small {
  border-radius: 1.75em; /* 28px */
  overflow: hidden;
  padding: 0.25em 0.5em; /* 4/16 */ /* 8/16 */
}

.ClaimCapsule--shadow {
  box-shadow: 0 0.5em 1em 0 rgba(0, 0, 0, 0.08); /* 4/16 */ /* 8/16 */
}

.ClaimCapsule--certificate {
  margin-top: 0.5em; /* 8/16 */
}

.ClaimCapsule-title {
  color: #2a2a2a;
  font-family: "DM Sans", sans-serif;
  font-size: 1em;
  font-weight: 700;
  line-height: 1;
  text-align: center;
}

.ClaimCapsule-title--small {
  font-size: 0.75em; /* 12/16 */
}

/**
 * Theme
 *
 * Global variables in use throughout the application
 */
/**
 * Colours
 */
/* Main colour palette */
/* rgb(0, 0, 0) */
/* rgb(42, 42, 42) */
/* rgb(61, 61, 61) */
/* rgb(82, 82, 82) */
/* rgb(102, 102, 102) */
/* rgb(122, 122, 122) */
/* rgb(164, 164, 164) */
/* rgb(204, 204, 204) */
/* rgb(244, 244, 244) */
/* rgb(249, 249, 249) */
/* rgb(255, 255, 255) */
/* rgb(122, 122, 122) */
/* rgba(255, 200, 202) */
/* rgb(61,61,61) */
/* rgba(225, 234, 224) */
/* rgb(225, 234, 224) */
/* rgb(42, 42, 42) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(59, 45, 81) */
/* rgb(77, 66, 98) */
/* rgb(153, 185, 174) */
/* rgb(238, 98, 101) */
/* rgb(240, 114, 116) */
/* rgb(255, 200, 202) */
/* rgb(73, 84, 100) */
/* rgb(244, 244, 244) */
/* rgb(204, 204, 204) */
/* rgb(204, 204, 204) */
/* black percentages use absolute black */
/* Additional colours */
/* rgb(133, 187, 204) */
/* rgb(120, 169, 184) */
/* rgb(240, 103, 100) */
/* rgb(217, 93, 90) */
/* rgb(28, 89, 127) */
/* rgb(25, 81, 115) */
/* New colours */
/* Family */
/* For now, both of these are being defined to the DM Sans font. At a later time
this will be cleaned up to improve how the site-wide fonts are defined. */
/* Sizes */
/* Font-weight */
/* Line height */
/* Letter-spacing */
/* Spacing */
/**
 * Animations
 */
/**
 * Transitions
 */
/* Duration */
/* timing function */
/**
 * Breakpoints
 */
/**
 * Container widths
 */
/**
 * Claim card CMS
 *
 * Layout of a claim and help on CMS pages.
 */
.ClaimCardCMS {
  border: 1px solid #2f3a4a;
  border-radius: 10px;
  position: relative;
}

.ClaimCardCMS-stateTag {
  left: 12px;
  position: absolute;
  top: 12px;
}

.ClaimCardCMS-header {
  margin: -32px auto 0;
  text-align: center;
  transform: translateY(50%);
}

.ClaimCardCMS-main {
  margin: 42px 12px;
  position: relative;
}

.ClaimCardCMS-layout {
  display: grid;
  grid-column-gap: 20px;
  grid-template-columns: 1fr;
}

.ClaimCardCMS-layoutStatement {
  display: grid;
  grid-gap: 16px 20px;
  grid-template-columns: 1fr;
}

.ClaimCardCMS-layoutInner {
  display: flex;
  justify-content: space-around;
}

.ClaimCardCMS-statement {
  font-family: "DM Sans", serif;
  font-size: 13px;
  font-weight: 400;
}

.ClaimCardCMS-initiatives {
  font-family: "DM Sans", serif;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.25;
  list-style-type: disc;
  margin-left: 20px;
}

.ClaimCardCMS-actions {
  position: absolute;
  right: 12px;
  top: 12px;
}

.ClaimCardCMS-evidence {
  flex: 1 0 270px;
  margin-right: 6px;
}

.ClaimCardCMS-evidenceDetails {
  margin-top: 6px;
  position: relative;
}

.ClaimCardCMS-evidenceActions {
  position: absolute;
  right: 0;
  top: -7px;
}

.ClaimCardCMS-products {
  flex: 1 0 270px;
  margin-left: 6px;
}

.ClaimCardCMS-productsInner {
  display: block;
  padding: 18px;
  position: relative;
  text-align: center;
}

.ClaimCardCMS-productsActions {
  position: absolute;
  right: 0;
  top: 0;
}

.ClaimCardCMS-productsCount {
  color: #2a2a2a;
  display: block;
  font-size: 25px;
  font-weight: 500;
}

.ClaimCardCMS-share {
  background-color: #2f3a4a;
}

.ClaimCardCMS-separator::before, .ClaimCardCMS-separator::after {
  border-top: 1px solid #ccc;
  content: "";
  display: block;
  flex-grow: 1;
  margin: 0 12px;
}

.ClaimCardCMS-footer {
  padding: 12px;
}
.ClaimCardCMS-footer > form {
  display: inline-block;
}

/* -----------------------------------------------------------------------------
 * Media queries
 * -------------------------------------------------------------------------- */
/**
 * Desktop viewport
 */
@media (min-width: 960px) {
  .ClaimCardCMS-layoutStatement {
    grid-template-columns: 1fr 1fr 24px;
  }
}
.EmbedWrapper {
  display: flex;
  justify-content: center;
  opacity: 1;
  text-align: center;
  transition: all 500ms ease-in-out;
  width: 100%;
}

.EmbedWrapper--hidden {
  height: 0;
  opacity: 0;
}

/**
 * Theme
 *
 * Global variables in use throughout the application
 */
/**
 * Colours
 */
/* Main colour palette */
/* rgb(0, 0, 0) */
/* rgb(42, 42, 42) */
/* rgb(61, 61, 61) */
/* rgb(82, 82, 82) */
/* rgb(102, 102, 102) */
/* rgb(122, 122, 122) */
/* rgb(164, 164, 164) */
/* rgb(204, 204, 204) */
/* rgb(244, 244, 244) */
/* rgb(249, 249, 249) */
/* rgb(255, 255, 255) */
/* rgb(122, 122, 122) */
/* rgba(255, 200, 202) */
/* rgb(61,61,61) */
/* rgba(225, 234, 224) */
/* rgb(225, 234, 224) */
/* rgb(42, 42, 42) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(59, 45, 81) */
/* rgb(77, 66, 98) */
/* rgb(153, 185, 174) */
/* rgb(238, 98, 101) */
/* rgb(240, 114, 116) */
/* rgb(255, 200, 202) */
/* rgb(73, 84, 100) */
/* rgb(244, 244, 244) */
/* rgb(204, 204, 204) */
/* rgb(204, 204, 204) */
/* black percentages use absolute black */
/* Additional colours */
/* rgb(133, 187, 204) */
/* rgb(120, 169, 184) */
/* rgb(240, 103, 100) */
/* rgb(217, 93, 90) */
/* rgb(28, 89, 127) */
/* rgb(25, 81, 115) */
/* New colours */
/* Family */
/* For now, both of these are being defined to the DM Sans font. At a later time
this will be cleaned up to improve how the site-wide fonts are defined. */
/* Sizes */
/* Font-weight */
/* Line height */
/* Letter-spacing */
/* Spacing */
/**
 * Animations
 */
/**
 * Transitions
 */
/* Duration */
/* timing function */
/**
 * Breakpoints
 */
/**
 * Container widths
 */
/**
 * Cell Data
 *
 * Variants of data cells in collection table
 */
.cell-data--image {
  line-height: 0;
  vertical-align: top;
  width: 86px;
}

.cell-data--nameWithProof {
  width: calc(100% - 106px);
}

.cell-data--hasOne {
  width: auto;
}

.cell-data--organization {
  width: 200px;
}

.cell-data--channel {
  width: 200px;
}

.cell-data--chevron {
  color: #000;
}
.cell-data--chevronhidden {
  color: transparent;
}

@media (min-width: 640px) {
  .cell-data--nameWithProof {
    width: 300px;
  }
  .cell-data--hasOne {
    width: 240px;
  }
}
/**
 * Theme
 *
 * Global variables in use throughout the application
 */
/**
 * Colours
 */
/* Main colour palette */
/* rgb(0, 0, 0) */
/* rgb(42, 42, 42) */
/* rgb(61, 61, 61) */
/* rgb(82, 82, 82) */
/* rgb(102, 102, 102) */
/* rgb(122, 122, 122) */
/* rgb(164, 164, 164) */
/* rgb(204, 204, 204) */
/* rgb(244, 244, 244) */
/* rgb(249, 249, 249) */
/* rgb(255, 255, 255) */
/* rgb(122, 122, 122) */
/* rgba(255, 200, 202) */
/* rgb(61,61,61) */
/* rgba(225, 234, 224) */
/* rgb(225, 234, 224) */
/* rgb(42, 42, 42) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(59, 45, 81) */
/* rgb(77, 66, 98) */
/* rgb(153, 185, 174) */
/* rgb(238, 98, 101) */
/* rgb(240, 114, 116) */
/* rgb(255, 200, 202) */
/* rgb(73, 84, 100) */
/* rgb(244, 244, 244) */
/* rgb(204, 204, 204) */
/* rgb(204, 204, 204) */
/* black percentages use absolute black */
/* Additional colours */
/* rgb(133, 187, 204) */
/* rgb(120, 169, 184) */
/* rgb(240, 103, 100) */
/* rgb(217, 93, 90) */
/* rgb(28, 89, 127) */
/* rgb(25, 81, 115) */
/* New colours */
/* Family */
/* For now, both of these are being defined to the DM Sans font. At a later time
this will be cleaned up to improve how the site-wide fonts are defined. */
/* Sizes */
/* Font-weight */
/* Line height */
/* Letter-spacing */
/* Spacing */
/**
 * Animations
 */
/**
 * Transitions
 */
/* Duration */
/* timing function */
/**
 * Breakpoints
 */
/**
 * Container widths
 */
/**
 * Collection Header
 *
 * The title and top level actions for collection
 */
.CollectionHeader {
  background-color: #f9f9f9;
  height: 216px;
  padding-bottom: 24px;
  width: 100%;
}

.CollectionHeader-inner {
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: flex-end;
  max-width: 1162px;
}

@media (min-width: 640px) {
  .CollectionHeader-inner {
    align-items: flex-end;
    flex-direction: row;
    justify-content: space-between;
  }
}
/* stylelint-disable */
/**
 * Theme
 *
 * Global variables in use throughout the application
 */
/**
 * Colours
 */
/* Main colour palette */
/* rgb(0, 0, 0) */
/* rgb(42, 42, 42) */
/* rgb(61, 61, 61) */
/* rgb(82, 82, 82) */
/* rgb(102, 102, 102) */
/* rgb(122, 122, 122) */
/* rgb(164, 164, 164) */
/* rgb(204, 204, 204) */
/* rgb(244, 244, 244) */
/* rgb(249, 249, 249) */
/* rgb(255, 255, 255) */
/* rgb(122, 122, 122) */
/* rgba(255, 200, 202) */
/* rgb(61,61,61) */
/* rgba(225, 234, 224) */
/* rgb(225, 234, 224) */
/* rgb(42, 42, 42) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(59, 45, 81) */
/* rgb(77, 66, 98) */
/* rgb(153, 185, 174) */
/* rgb(238, 98, 101) */
/* rgb(240, 114, 116) */
/* rgb(255, 200, 202) */
/* rgb(73, 84, 100) */
/* rgb(244, 244, 244) */
/* rgb(204, 204, 204) */
/* rgb(204, 204, 204) */
/* black percentages use absolute black */
/* Additional colours */
/* rgb(133, 187, 204) */
/* rgb(120, 169, 184) */
/* rgb(240, 103, 100) */
/* rgb(217, 93, 90) */
/* rgb(28, 89, 127) */
/* rgb(25, 81, 115) */
/* New colours */
/* Family */
/* For now, both of these are being defined to the DM Sans font. At a later time
this will be cleaned up to improve how the site-wide fonts are defined. */
/* Sizes */
/* Font-weight */
/* Line height */
/* Letter-spacing */
/* Spacing */
/**
 * Animations
 */
/**
 * Transitions
 */
/* Duration */
/* timing function */
/**
 * Breakpoints
 */
/**
 * Container widths
 */
/* stylelint-disable no-descending-specificity */
/**
 * Collection Table
 *
 * A tabular layout of a collection e.g. products
 */
.CollectionTable {
  border-collapse: collapse;
  margin-top: 16px;
  width: 100%;
}

.CollectionTable-heading {
  display: none;
  text-decoration: none;
}

.CollectionTable-heading--hidden {
  display: none;
}

.CollectionTable-row {
  border: 1px solid #f4f4f4;
  display: flex;
  flex-wrap: wrap;
}

.CollectionTable-row--highlight {
  box-shadow: inset 12px 0 0 #94C5B6;
}

.CollectionTable-row--minimal {
  border: none;
}
.CollectionTable-row--minimal:last-of-type {
  border: none;
}
.CollectionTable-row--minimal + .CollectionTable-row--minimal {
  border-top: 0.5px solid #ccc;
}

.CollectionTable-children {
  border: 1px solid #ccc;
  display: none;
  flex-wrap: wrap;
}

.show-children {
  display: table-row;
}
.show-children .CollectionTable-cell:nth-child(2) {
  transform: translateX(15px);
}

.CollectionTable-cell .variant-chevron {
  transform: translate(6px, 10px);
}
.CollectionTable-cell .variant-chevron--open {
  transform: translate(6px, 10px) rotate(180deg);
}

.CollectionTable-row--heading:nth-child(odd) {
  background-color: #fff;
}

.CollectionTable-cell,
.CollectionTable-headingCell {
  font-family: "DM Sans", sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
  padding: 12px;
}

.CollectionTable-icon {
  align-items: center;
  display: flex;
  height: 56px;
  justify-content: center;
}

.Action--collectionTable.Action--collectionTable {
  color: #2a2a2a;
  text-decoration: underline;
  text-decoration-thickness: 2px;
}
.Action--collectionTable.Action--collectionTable:visited {
  color: #2a2a2a;
}
.Action--collectionTable.Action--collectionTable:focus, .Action--collectionTable.Action--collectionTable:hover {
  color: #2a2a2a;
  text-decoration-color: rgba(42, 42, 42, 0.4);
}

@media (min-width: 640px) {
  .CollectionTable {
    display: table;
  }
  .CollectionTable-heading {
    display: table-header-group;
  }
  .CollectionTable-heading--hidden {
    display: none;
  }
  .CollectionTable-body {
    display: table-row-group;
  }
  .CollectionTable-row {
    border: 1px solid #f4f4f4;
    display: table-row;
  }
  .CollectionTable-row--minimal {
    border: none;
  }
  .CollectionTable-row--minimal:last-of-type {
    border: none;
  }
  .CollectionTable-row--minimal + .CollectionTable-row--minimal {
    border-top: 0.5px solid #ccc;
  }
  .CollectionTable-row--heading:nth-child(odd) {
    background-color: #fff;
  }
  .CollectionTable-cell,
  .CollectionTable-headingCell {
    display: table-cell;
  }
  .CollectionTable-cell a,
  .CollectionTable-headingCell a {
    text-decoration: none;
  }
  .CollectionTable-headingCell {
    white-space: nowrap;
  }
}
/* stylelint-disable */
/**
 * Theme
 *
 * Global variables in use throughout the application
 */
/**
 * Colours
 */
/* Main colour palette */
/* rgb(0, 0, 0) */
/* rgb(42, 42, 42) */
/* rgb(61, 61, 61) */
/* rgb(82, 82, 82) */
/* rgb(102, 102, 102) */
/* rgb(122, 122, 122) */
/* rgb(164, 164, 164) */
/* rgb(204, 204, 204) */
/* rgb(244, 244, 244) */
/* rgb(249, 249, 249) */
/* rgb(255, 255, 255) */
/* rgb(122, 122, 122) */
/* rgba(255, 200, 202) */
/* rgb(61,61,61) */
/* rgba(225, 234, 224) */
/* rgb(225, 234, 224) */
/* rgb(42, 42, 42) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(59, 45, 81) */
/* rgb(77, 66, 98) */
/* rgb(153, 185, 174) */
/* rgb(238, 98, 101) */
/* rgb(240, 114, 116) */
/* rgb(255, 200, 202) */
/* rgb(73, 84, 100) */
/* rgb(244, 244, 244) */
/* rgb(204, 204, 204) */
/* rgb(204, 204, 204) */
/* black percentages use absolute black */
/* Additional colours */
/* rgb(133, 187, 204) */
/* rgb(120, 169, 184) */
/* rgb(240, 103, 100) */
/* rgb(217, 93, 90) */
/* rgb(28, 89, 127) */
/* rgb(25, 81, 115) */
/* New colours */
/* Family */
/* For now, both of these are being defined to the DM Sans font. At a later time
this will be cleaned up to improve how the site-wide fonts are defined. */
/* Sizes */
/* Font-weight */
/* Line height */
/* Letter-spacing */
/* Spacing */
/**
 * Animations
 */
/**
 * Transitions
 */
/* Duration */
/* timing function */
/**
 * Breakpoints
 */
/**
 * Container widths
 */
/**
 * Details
 */
.Details,
.DetailsV1 {
  border: 1px solid #686868;
  border-radius: 0.25rem;
  font-family: "DM Sans", sans-serif;
  padding: 0.75rem;
}

.DetailsV1 .chevron {
  transition: transform 0.4s;
  width: 8px;
}
section + .DetailsV1 {
  margin-top: 1.5rem;
}

.Details {
  position: relative;
}
.Details .chevron {
  color: #CCCCCC;
  position: absolute;
  right: 5px;
  transition: transform 0.4s;
  width: 2rem;
}
section + .Details {
  margin-top: 1.5rem;
}
.Details[open] > *:not(summary) {
  animation: details-show 150ms ease-in-out;
}

.DetailsV1-description {
  font-size: 0.875rem;
  line-height: 1.5;
  margin: 20px 0;
}
.DetailsV1-description + a {
  margin-bottom: 20px;
}

.Details-description {
  font-size: 0.875rem;
  line-height: 1.5;
  margin-top: 16px;
}

.Details--explore {
  color: #2a2a2a;
  display: block;
  font-size: 0.75rem;
  margin: 15px 0 40px;
}

.Details--icons {
  display: flex;
  justify-content: space-between;
  text-align: center;
  margin-top: 32px;
}
.Details--icons svg {
  color: #0a3942;
}
.Details--icons span {
  font-size: 9px;
  text-transform: uppercase;
}

.Details--plain {
  position: relative;
}
.StoryButton + .Details--plain {
  margin-top: 0.75rem;
}

.Details--plain .chevron {
  color: #CCCCCC;
  position: absolute;
  right: -7px;
  transition: transform 0.4s;
  width: 2rem;
}

.Details[open] > summary,
.DetailsV1[open] > summary,
.Details--plain[open] > summary {
  margin-bottom: 0.5em;
}
.Details[open] > summary > .chevron,
.DetailsV1[open] > summary > .chevron,
.Details--plain[open] > summary > .chevron {
  transform: rotate(-180deg);
}

/**
 * Summary
 */
.Summary,
.SummaryV1 {
  align-items: center;
  display: flex;
  font-family: "DM Sans", sans-serif;
  justify-content: space-between;
  outline: none;
}
.Summary:focus-visible,
.SummaryV1:focus-visible {
  outline: none;
}
.Summary::-webkit-details-marker,
.SummaryV1::-webkit-details-marker {
  display: none;
}

.Summary-title,
.SummaryV1-title {
  border-radius: 40px;
  display: flex;
  flex-direction: row;
  font-size: 14px;
  height: 20px;
  padding: 0 12px 0 2px;
  width: max-content;
}
.Summary-title p,
.SummaryV1-title p {
  margin: auto;
  padding-left: 0.25em;
}
.Summary-title svg,
.SummaryV1-title svg {
  height: 18px;
  width: 18px;
}

.Summary--withIcon {
  display: grid;
  grid-template-columns: 88px 1fr 22px;
}

@keyframes details-show {
  from {
    opacity: 0;
    transform: translateY(-0.5em);
  }
}
/**
 * Theme
 *
 * Global variables in use throughout the application
 */
/**
 * Colours
 */
/* Main colour palette */
/* rgb(0, 0, 0) */
/* rgb(42, 42, 42) */
/* rgb(61, 61, 61) */
/* rgb(82, 82, 82) */
/* rgb(102, 102, 102) */
/* rgb(122, 122, 122) */
/* rgb(164, 164, 164) */
/* rgb(204, 204, 204) */
/* rgb(244, 244, 244) */
/* rgb(249, 249, 249) */
/* rgb(255, 255, 255) */
/* rgb(122, 122, 122) */
/* rgba(255, 200, 202) */
/* rgb(61,61,61) */
/* rgba(225, 234, 224) */
/* rgb(225, 234, 224) */
/* rgb(42, 42, 42) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(59, 45, 81) */
/* rgb(77, 66, 98) */
/* rgb(153, 185, 174) */
/* rgb(238, 98, 101) */
/* rgb(240, 114, 116) */
/* rgb(255, 200, 202) */
/* rgb(73, 84, 100) */
/* rgb(244, 244, 244) */
/* rgb(204, 204, 204) */
/* rgb(204, 204, 204) */
/* black percentages use absolute black */
/* Additional colours */
/* rgb(133, 187, 204) */
/* rgb(120, 169, 184) */
/* rgb(240, 103, 100) */
/* rgb(217, 93, 90) */
/* rgb(28, 89, 127) */
/* rgb(25, 81, 115) */
/* New colours */
/* Family */
/* For now, both of these are being defined to the DM Sans font. At a later time
this will be cleaned up to improve how the site-wide fonts are defined. */
/* Sizes */
/* Font-weight */
/* Line height */
/* Letter-spacing */
/* Spacing */
/**
 * Animations
 */
/**
 * Transitions
 */
/* Duration */
/* timing function */
/**
 * Breakpoints
 */
/**
 * Container widths
 */
/**
 * Image
 *
 * Generic image element.
 */
/* 56/16 */
/* 72/16 */
/* 90/16 */
/* 154/16 */
/* 298/16 */
/**
 * Theme
 *
 * Global variables in use throughout the application
 */
/**
 * Colours
 */
/* Main colour palette */
/* rgb(0, 0, 0) */
/* rgb(42, 42, 42) */
/* rgb(61, 61, 61) */
/* rgb(82, 82, 82) */
/* rgb(102, 102, 102) */
/* rgb(122, 122, 122) */
/* rgb(164, 164, 164) */
/* rgb(204, 204, 204) */
/* rgb(244, 244, 244) */
/* rgb(249, 249, 249) */
/* rgb(255, 255, 255) */
/* rgb(122, 122, 122) */
/* rgba(255, 200, 202) */
/* rgb(61,61,61) */
/* rgba(225, 234, 224) */
/* rgb(225, 234, 224) */
/* rgb(42, 42, 42) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(59, 45, 81) */
/* rgb(77, 66, 98) */
/* rgb(153, 185, 174) */
/* rgb(238, 98, 101) */
/* rgb(240, 114, 116) */
/* rgb(255, 200, 202) */
/* rgb(73, 84, 100) */
/* rgb(244, 244, 244) */
/* rgb(204, 204, 204) */
/* rgb(204, 204, 204) */
/* black percentages use absolute black */
/* Additional colours */
/* rgb(133, 187, 204) */
/* rgb(120, 169, 184) */
/* rgb(240, 103, 100) */
/* rgb(217, 93, 90) */
/* rgb(28, 89, 127) */
/* rgb(25, 81, 115) */
/* New colours */
/* Family */
/* For now, both of these are being defined to the DM Sans font. At a later time
this will be cleaned up to improve how the site-wide fonts are defined. */
/* Sizes */
/* Font-weight */
/* Line height */
/* Letter-spacing */
/* Spacing */
/**
 * Animations
 */
/**
 * Transitions
 */
/* Duration */
/* timing function */
/**
 * Breakpoints
 */
/**
 * Container widths
 */
/**
 * Container
 *
 * A container that holds content to the standard width of the page.
 */
.Container {
  margin-left: auto;
  margin-right: auto;
  max-width: 1060px;
  padding-left: 24px;
  padding-right: 24px;
}

.Container--overflow {
  width: max-content;
}

.Container--passport {
  max-width: 960px;
}

.Container--borderTop {
  border-top: 1px solid #e4e4e4;
}

.Container--report {
  margin-bottom: 32px;
  margin-top: 32px;
  max-width: 752px;
}

.Container--collection,
.Container--collectionHeader {
  max-width: 1162px;
}

.Container--full {
  padding-left: 0;
  padding-right: 0;
}

.Container--left {
  margin-left: 0;
}

.Container-form {
  margin-left: auto;
  margin-right: auto;
  max-width: 640px;
}

/* -----------------------------------------------------------------------------
 * Media queries
 * -------------------------------------------------------------------------- */
/**
 * Large viewport
 */
@media (min-width: 1200px) {
  .Container--report {
    margin-bottom: 48px;
    margin-top: 48px;
  }
  .Container--left {
    margin-left: auto;
    margin-right: auto;
  }
}
@media (min-width: 1500px) {
  .Container {
    padding-left: 0;
    padding-right: 0;
  }
}
/**
 * Theme
 *
 * Global variables in use throughout the application
 */
/**
 * Colours
 */
/* Main colour palette */
/* rgb(0, 0, 0) */
/* rgb(42, 42, 42) */
/* rgb(61, 61, 61) */
/* rgb(82, 82, 82) */
/* rgb(102, 102, 102) */
/* rgb(122, 122, 122) */
/* rgb(164, 164, 164) */
/* rgb(204, 204, 204) */
/* rgb(244, 244, 244) */
/* rgb(249, 249, 249) */
/* rgb(255, 255, 255) */
/* rgb(122, 122, 122) */
/* rgba(255, 200, 202) */
/* rgb(61,61,61) */
/* rgba(225, 234, 224) */
/* rgb(225, 234, 224) */
/* rgb(42, 42, 42) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(59, 45, 81) */
/* rgb(77, 66, 98) */
/* rgb(153, 185, 174) */
/* rgb(238, 98, 101) */
/* rgb(240, 114, 116) */
/* rgb(255, 200, 202) */
/* rgb(73, 84, 100) */
/* rgb(244, 244, 244) */
/* rgb(204, 204, 204) */
/* rgb(204, 204, 204) */
/* black percentages use absolute black */
/* Additional colours */
/* rgb(133, 187, 204) */
/* rgb(120, 169, 184) */
/* rgb(240, 103, 100) */
/* rgb(217, 93, 90) */
/* rgb(28, 89, 127) */
/* rgb(25, 81, 115) */
/* New colours */
/* Family */
/* For now, both of these are being defined to the DM Sans font. At a later time
this will be cleaned up to improve how the site-wide fonts are defined. */
/* Sizes */
/* Font-weight */
/* Line height */
/* Letter-spacing */
/* Spacing */
/**
 * Animations
 */
/**
 * Transitions
 */
/* Duration */
/* timing function */
/**
 * Breakpoints
 */
/**
 * Container widths
 */
/**
 * Lined heading
 */
.LinedHeading {
  align-items: center;
  color: #7a7a7a;
  display: flex;
  font-family: "DM Sans", sans-serif;
  font-size: 13px;
  font-weight: 700;
  justify-content: center;
  letter-spacing: 0.1em;
  line-height: 1.5;
  text-transform: uppercase;
}
.LinedHeading::before, .LinedHeading::after {
  background-color: #ccc;
  border-top: 1px solid #ccc;
  content: "";
  display: block;
  flex-grow: 1;
}
.LinedHeading::before {
  margin-right: 8px;
}
.LinedHeading::after {
  margin-left: 8px;
}

/* stylelint-disable */
/**
 * Theme
 *
 * Global variables in use throughout the application
 */
/**
 * Colours
 */
/* Main colour palette */
/* rgb(0, 0, 0) */
/* rgb(42, 42, 42) */
/* rgb(61, 61, 61) */
/* rgb(82, 82, 82) */
/* rgb(102, 102, 102) */
/* rgb(122, 122, 122) */
/* rgb(164, 164, 164) */
/* rgb(204, 204, 204) */
/* rgb(244, 244, 244) */
/* rgb(249, 249, 249) */
/* rgb(255, 255, 255) */
/* rgb(122, 122, 122) */
/* rgba(255, 200, 202) */
/* rgb(61,61,61) */
/* rgba(225, 234, 224) */
/* rgb(225, 234, 224) */
/* rgb(42, 42, 42) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(59, 45, 81) */
/* rgb(77, 66, 98) */
/* rgb(153, 185, 174) */
/* rgb(238, 98, 101) */
/* rgb(240, 114, 116) */
/* rgb(255, 200, 202) */
/* rgb(73, 84, 100) */
/* rgb(244, 244, 244) */
/* rgb(204, 204, 204) */
/* rgb(204, 204, 204) */
/* black percentages use absolute black */
/* Additional colours */
/* rgb(133, 187, 204) */
/* rgb(120, 169, 184) */
/* rgb(240, 103, 100) */
/* rgb(217, 93, 90) */
/* rgb(28, 89, 127) */
/* rgb(25, 81, 115) */
/* New colours */
/* Family */
/* For now, both of these are being defined to the DM Sans font. At a later time
this will be cleaned up to improve how the site-wide fonts are defined. */
/* Sizes */
/* Font-weight */
/* Line height */
/* Letter-spacing */
/* Spacing */
/**
 * Animations
 */
/**
 * Transitions
 */
/* Duration */
/* timing function */
/**
 * Breakpoints
 */
/**
 * Container widths
 */
/*
* Pill List
*
* A list of pill-shaped proof points
*
*/
.PillList {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  list-style: none;
  margin: 0;
  padding-left: 0.25rem;
}
.Timeline-product + .PillList {
  margin-top: 0.75rem;
}
.CollectionTable-cell .PillList {
  margin-bottom: 1.5rem;
}

.PillList-item--button {
  border-radius: 16px;
  padding: 0;
}
.PillList-item--button:focus {
  outline: none;
}
.PillList-item--button:focus-visible {
  outline: 2px solid #0a3942;
}

/* stylelint-disable */
/**
 * Theme
 *
 * Global variables in use throughout the application
 */
/**
 * Colours
 */
/* Main colour palette */
/* rgb(0, 0, 0) */
/* rgb(42, 42, 42) */
/* rgb(61, 61, 61) */
/* rgb(82, 82, 82) */
/* rgb(102, 102, 102) */
/* rgb(122, 122, 122) */
/* rgb(164, 164, 164) */
/* rgb(204, 204, 204) */
/* rgb(244, 244, 244) */
/* rgb(249, 249, 249) */
/* rgb(255, 255, 255) */
/* rgb(122, 122, 122) */
/* rgba(255, 200, 202) */
/* rgb(61,61,61) */
/* rgba(225, 234, 224) */
/* rgb(225, 234, 224) */
/* rgb(42, 42, 42) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(59, 45, 81) */
/* rgb(77, 66, 98) */
/* rgb(153, 185, 174) */
/* rgb(238, 98, 101) */
/* rgb(240, 114, 116) */
/* rgb(255, 200, 202) */
/* rgb(73, 84, 100) */
/* rgb(244, 244, 244) */
/* rgb(204, 204, 204) */
/* rgb(204, 204, 204) */
/* black percentages use absolute black */
/* Additional colours */
/* rgb(133, 187, 204) */
/* rgb(120, 169, 184) */
/* rgb(240, 103, 100) */
/* rgb(217, 93, 90) */
/* rgb(28, 89, 127) */
/* rgb(25, 81, 115) */
/* New colours */
/* Family */
/* For now, both of these are being defined to the DM Sans font. At a later time
this will be cleaned up to improve how the site-wide fonts are defined. */
/* Sizes */
/* Font-weight */
/* Line height */
/* Letter-spacing */
/* Spacing */
/**
 * Animations
 */
/**
 * Transitions
 */
/* Duration */
/* timing function */
/**
 * Breakpoints
 */
/**
 * Container widths
 */
.Pill {
  align-items: center;
  background-color: #fff;
  border-radius: 16px;
  /* Elevation 1 */
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2), 0 1px 3px 1px rgba(0, 0, 0, 0.12);
  color: #2a2a2a;
  display: flex;
  height: 22px;
  justify-content: center;
  line-height: 1rem;
  padding: 2px 6px 2px 2px;
  position: relative;
  transition: background-color 0.15s, border-color 0.15s;
}
.Pill:hover {
  border-color: #000;
}

.Pill-details {
  padding-left: 4px;
}

.Pill-category {
  -webkit-box-orient: vertical; /* stylelint-disable-line */
  display: -webkit-box; /* stylelint-disable-line */
  font-family: "DM Sans", sans-serif;
  font-size: 12px;
  font-weight: 700;
  -webkit-line-clamp: 1;
  margin-bottom: 1px;
  overflow-y: hidden;
  padding-right: 10px;
  position: relative;
  text-align: left;
  text-decoration: none;
  word-break: break-all;
}
.Pill-category::after {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='10' viewBox='0 0 6 10'%3E%3Cpath fill='none' stroke='%232a2a2a' stroke-linecap='round' stroke-linejoin='round' d='m-1 3 4 4 4-4' transform='matrix(0 1 1 0 -2 2)'/%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  content: "";
  height: 16px;
  padding-left: 6px;
  position: absolute;
  right: 0;
  top: 0;
}

/**
 * Theme
 *
 * Global variables in use throughout the application
 */
/**
 * Colours
 */
/* Main colour palette */
/* rgb(0, 0, 0) */
/* rgb(42, 42, 42) */
/* rgb(61, 61, 61) */
/* rgb(82, 82, 82) */
/* rgb(102, 102, 102) */
/* rgb(122, 122, 122) */
/* rgb(164, 164, 164) */
/* rgb(204, 204, 204) */
/* rgb(244, 244, 244) */
/* rgb(249, 249, 249) */
/* rgb(255, 255, 255) */
/* rgb(122, 122, 122) */
/* rgba(255, 200, 202) */
/* rgb(61,61,61) */
/* rgba(225, 234, 224) */
/* rgb(225, 234, 224) */
/* rgb(42, 42, 42) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(59, 45, 81) */
/* rgb(77, 66, 98) */
/* rgb(153, 185, 174) */
/* rgb(238, 98, 101) */
/* rgb(240, 114, 116) */
/* rgb(255, 200, 202) */
/* rgb(73, 84, 100) */
/* rgb(244, 244, 244) */
/* rgb(204, 204, 204) */
/* rgb(204, 204, 204) */
/* black percentages use absolute black */
/* Additional colours */
/* rgb(133, 187, 204) */
/* rgb(120, 169, 184) */
/* rgb(240, 103, 100) */
/* rgb(217, 93, 90) */
/* rgb(28, 89, 127) */
/* rgb(25, 81, 115) */
/* New colours */
/* Family */
/* For now, both of these are being defined to the DM Sans font. At a later time
this will be cleaned up to improve how the site-wide fonts are defined. */
/* Sizes */
/* Font-weight */
/* Line height */
/* Letter-spacing */
/* Spacing */
/**
 * Animations
 */
/**
 * Transitions
 */
/* Duration */
/* timing function */
/**
 * Breakpoints
 */
/**
 * Container widths
 */
/**
 * PoweredTagline
 */
.PoweredTagline {
  height: 20px;
}

.PoweredTagline--embed {
  padding-left: 8px;
  transform: scale(0.8);
  transform-origin: left;
}

.PoweredTagline--center {
  transform-origin: center;
}

.PoweredTagline-wordmark {
  color: #7a7a7a;
  width: 100%;
}

.PoweredTagline-click {
  cursor: pointer;
}

.PoweredTagline-flag {
  display: flex;
}

.PoweredTagline-logo {
  display: none;
}

proof-point-status-wrapper {
  height: 18px;
}

proof-point-status {
  align-items: center;
  display: flex;
  opacity: 1;
  transition: transform 0.6s, opacity 0.3s 0.15s;
}
.Capsule proof-point-status, .Pill proof-point-status, .ClaimCard-headerDetails proof-point-status, .ModalCardHeader-details proof-point-status, .SchemeCard proof-point-status {
  font-family: "DM Sans", serif;
  font-size: 11px;
  font-style: italic;
  line-height: 1.5;
}

.Pill proof-point-status-wrapper {
  margin: 1px -4px 0 2px;
}

.Card--embed.ClaimCard proof-point-status-wrapper {
  margin: 10px auto 0;
  width: 72px;
}

.ModalCardHeader-details {
  position: relative;
}
.ModalCardHeader-details proof-point-status {
  position: absolute;
}

proof-point-status svg {
  margin-right: 1px;
}

proof-point-status[data-state=checked] {
  opacity: 0;
  transform: translateY(100%);
}

proof-point-status[hidden] {
  display: flex; /* resets [hidden] { display: none } */
  opacity: 0;
  transform-origin: left;
}

proof-point-status[checking] svg {
  animation: halfTurnClockwise 1.5s infinite ease-in-out;
}

proof-point-status[evidenced] {
  transform: translateY(-200%);
}
proof-point-status[evidenced]:not([hidden]) {
  transform: translateY(-100%);
}

proof-point-status[verified] {
  transform: translateY(-300%);
}
proof-point-status[verified]:not([hidden]) {
  transform: translateY(-200%);
}

.ModalCardHeader-title + proof-point-status-wrapper proof-point-status {
  transform: none !important; /* stylelint-disable-line declaration-no-important */ /* !important was needed for overriding specificity of :not([hidden]) selector defined above */
}

.Capsule,
.Pill {
  overflow-y: hidden;
}

/* This CSS below is also needed by the SDK
 * to be injected into a page on initial loading
 */
/* .provenance-Fixed class is added by the SDK, it's not used in the app */
/* stylelint-disable-next-line selector-class-pattern */
.provenance-Fixed {
  position: fixed;
}

.ProvenanceModal {
  --gap: 10px;
}

.ProvenanceModal-backdrop {
  align-items: center;
  background-color: transparent;
  bottom: 0;
  box-sizing: border-box;
  display: flex;
  height: 100%;
  justify-content: center;
  left: 0;
  opacity: 1;
  position: fixed;
  right: 0;
  top: 0;
  width: 100%;
  z-index: 9999;
  transition: background-color 0.4s allow-discrete;
}

.is-open .ProvenanceModal-backdrop {
  background-color: rgba(0, 0, 0, 0.75);
}

.ProvenanceModal-dialog {
  display: block;
  flex-grow: 1;
  height: 100%;
  margin: 0;
  margin-left: auto;
  margin-right: auto;
  max-width: 800px;
  min-width: 300px;
  padding: 0;
  position: relative;
}

/*
Close button
*/
.ProvenanceModal-closeBtn {
  color: #7a7a7a; /* $colour-grey */
  cursor: pointer;
  height: 40px;
  opacity: 0;
  position: absolute;
  right: 1em;
  top: 1em;
  transition: opacity 0.6s;
  z-index: 10;
}

.is-open .ProvenanceModal-closeBtn {
  opacity: 1;
}

/* Close button style tweaks for when it originates from the SDK */
.SDK .ProvenanceModal-closeBtn {
  background-color: transparent;
  border: 0;
  padding: 0;
  top: 16px;
  width: 40px;
}

.ProvenanceModal-closeBtn:hover,
.ProvenanceModal-closeBtn:active {
  color: inherit;
}

.ProvenanceModal-closeBtn:active circle,
.ProvenanceModal-closeBtn:focus circle {
  display: block;
}

.ProvenanceModal-closeBtn:focus {
  outline: none;
}

.ProvenanceModal-closeBtn svg {
  height: 40px;
  pointer-events: none; /* https://github.com/ghosh/Micromodal/issues/392 */
  stroke: currentColor;
  width: 40px;
}

.ProvenanceModal-closeBtn circle {
  display: none;
}

/*
Accessibility tooltip (hidden by default)
*/
.ProvenanceModal-tooltip {
  background: #7a7a7a;
  border-radius: 0.25rem;
  color: #fff;
  font-size: 0.75rem;
  opacity: 0;
  padding: 3px 5px;
  pointer-events: none;
  transform: translateY(-3px);
  transition: transform 0.25s, opacity 0.25s;
  transition-delay: 0.5s;
  z-index: 1;
}

/*
Tooltip for close button
*/
.ProvenanceModal-closeBtnTooltip {
  position: absolute;
  right: -5px;
  top: 60px;
}

.ProvenanceModal-closeBtn:hover + .ProvenanceModal-closeBtnTooltip,
.ProvenanceModal-closeBtn:focus + .ProvenanceModal-closeBtnTooltip {
  opacity: 1;
  transform: translateY(0);
}

/*
"confirm" variant.
*/
.ProvenanceModal--confirmVariant .ProvenanceModal-dialog {
  background-color: #fff;
  height: auto;
  max-width: 360px;
  min-width: 0;
  padding: 20px;
  width: auto;
}

/*
"small" variant.
*/
.ProvenanceModal--smallVariant .ProvenanceModal-dialog {
  border-radius: 4px;
  box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.3);
  max-height: 525px;
  width: 95%;
}

@media (min-width: 640px) {
  .ProvenanceModal--smallVariant .ProvenanceModal-dialog {
    max-width: 368px;
  }
}
/*
"full" variant.
*/
.ProvenanceModal--fullVariant .ProvenanceModal-dialog {
  background-color: #fff;
  height: calc(100% - var(--gap) - var(--gap));
  margin: var(--gap);
  width: 100%;
}

.ProvenanceModal--fullVariant .ProvenanceModal-content {
  height: 100%;
}

/*
"story" variant.
*/
.ProvenanceModal--storyVariant .ProvenanceModal-content {
  height: 100%;
  opacity: 0;
  transition: opacity 0.6s;
}

.is-open.ProvenanceModal--storyVariant .ProvenanceModal-content {
  opacity: 1;
}

.ProvenanceModal--storyVariant .ProvenanceModal-closeBtn,
.ProvenanceModal--fullVariant .ProvenanceModal-closeBtn {
  background-color: rgba(42, 42, 42, 0.4);
  border-radius: 50%;
  color: #fff;
  z-index: 101; /* 101 makes the closeBtn appear over the box shadow in the story header */
}

.ProvenanceModal--storyVariant .ProvenanceModal-closeBtn {
  top: 24px;
}

.ProvenanceModal--storyVariant .ProvenanceModal-closeBtn:hover,
.ProvenanceModal--fullVariant .ProvenanceModal-closeBtn:hover {
  background-color: #000;
}

.ProvenanceModal--storyVariant .ProvenanceModal-closeBtn:active circle,
.ProvenanceModal--storyVariant .ProvenanceModal-closeBtn:focus circle,
.ProvenanceModal--fullVariant .ProvenanceModal-closeBtn:active circle,
.ProvenanceModal--fullVariant .ProvenanceModal-closeBtn:focus circle {
  display: block;
}

.ProvenanceModal--storyVariant .StoryHeader-buttons {
  margin-right: 4em; /* margin-right to push the buttons to the left, to make space for the close button */
}

@media (min-width: 640px) {
  .ProvenanceModal--storyVariant .ProvenanceModal-dialog {
    height: 95vh;
    max-width: 436px;
  }
}
/*
Drawer behavior
*/
.ProvenanceModal--drawerBehavior .ProvenanceModal-dialog {
  background: #fff; /* #fff bg needed in the experience map template to avoid a transparent card flash at the beginning of the transition animation */
  border-radius: 0.25em; /* hack: 0.25em is the same as .ClaimCard, needed only for map template */
  bottom: var(--gap);
  position: absolute;
  transform: translateY(100%);
  transition: transform 0.6s;
}

[data-state=drawer-open] .ProvenanceModal-dialog {
  transform: translateY(0);
}

@media (min-width: 640px) {
  .ProvenanceModal--drawerBehavior .ProvenanceModal-dialog {
    bottom: auto;
    right: var(--gap);
    transform: translateX(100%);
  }
  [data-state=drawer-open] .ProvenanceModal-dialog {
    transform: translateX(0);
  }
}
/*
Ugly hack to prevent a bundle from being rendered twice on Safari/WebKit.
Only needed in SDK/embedded context, not used in the app.
Can be removed when we stop using iframes.
*/
provenance-bundle > div:nth-child(2) {
  display: none !important; /* stylelint-disable-line declaration-no-important */ /* !important for overriding display: inline-block; being applied by zoid on an ID selector */
}

/* stylelint-disable */
/**
 * Theme
 *
 * Global variables in use throughout the application
 */
/**
 * Colours
 */
/* Main colour palette */
/* rgb(0, 0, 0) */
/* rgb(42, 42, 42) */
/* rgb(61, 61, 61) */
/* rgb(82, 82, 82) */
/* rgb(102, 102, 102) */
/* rgb(122, 122, 122) */
/* rgb(164, 164, 164) */
/* rgb(204, 204, 204) */
/* rgb(244, 244, 244) */
/* rgb(249, 249, 249) */
/* rgb(255, 255, 255) */
/* rgb(122, 122, 122) */
/* rgba(255, 200, 202) */
/* rgb(61,61,61) */
/* rgba(225, 234, 224) */
/* rgb(225, 234, 224) */
/* rgb(42, 42, 42) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(59, 45, 81) */
/* rgb(77, 66, 98) */
/* rgb(153, 185, 174) */
/* rgb(238, 98, 101) */
/* rgb(240, 114, 116) */
/* rgb(255, 200, 202) */
/* rgb(73, 84, 100) */
/* rgb(244, 244, 244) */
/* rgb(204, 204, 204) */
/* rgb(204, 204, 204) */
/* black percentages use absolute black */
/* Additional colours */
/* rgb(133, 187, 204) */
/* rgb(120, 169, 184) */
/* rgb(240, 103, 100) */
/* rgb(217, 93, 90) */
/* rgb(28, 89, 127) */
/* rgb(25, 81, 115) */
/* New colours */
/* Family */
/* For now, both of these are being defined to the DM Sans font. At a later time
this will be cleaned up to improve how the site-wide fonts are defined. */
/* Sizes */
/* Font-weight */
/* Line height */
/* Letter-spacing */
/* Spacing */
/**
 * Animations
 */
/**
 * Transitions
 */
/* Duration */
/* timing function */
/**
 * Breakpoints
 */
/**
 * Container widths
 */
.Tag {
  border-radius: 6px;
  display: inline-block;
  font-family: "DM Sans", sans-serif;
  font-size: 12px;
  font-weight: 400;
  padding: 4px 6px;
}

.Tag-grey {
  background-color: #ccc;
}

.Tag-lightgrey {
  background-color: #e4e4e4;
}

.Tag-green {
  background-color: #99b9ae;
}

.Tag-yellow {
  background-color: #ffcd6c;
}

.Tag-red {
  background-color: #ffbabb;
}

.Tag-lightblue {
  background-color: #ECF3FC;
}

.Tag-spaced {
  margin: 0 4px 4px;
}

/**
 * Theme
 *
 * Global variables in use throughout the application
 */
/**
 * Colours
 */
/* Main colour palette */
/* rgb(0, 0, 0) */
/* rgb(42, 42, 42) */
/* rgb(61, 61, 61) */
/* rgb(82, 82, 82) */
/* rgb(102, 102, 102) */
/* rgb(122, 122, 122) */
/* rgb(164, 164, 164) */
/* rgb(204, 204, 204) */
/* rgb(244, 244, 244) */
/* rgb(249, 249, 249) */
/* rgb(255, 255, 255) */
/* rgb(122, 122, 122) */
/* rgba(255, 200, 202) */
/* rgb(61,61,61) */
/* rgba(225, 234, 224) */
/* rgb(225, 234, 224) */
/* rgb(42, 42, 42) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(59, 45, 81) */
/* rgb(77, 66, 98) */
/* rgb(153, 185, 174) */
/* rgb(238, 98, 101) */
/* rgb(240, 114, 116) */
/* rgb(255, 200, 202) */
/* rgb(73, 84, 100) */
/* rgb(244, 244, 244) */
/* rgb(204, 204, 204) */
/* rgb(204, 204, 204) */
/* black percentages use absolute black */
/* Additional colours */
/* rgb(133, 187, 204) */
/* rgb(120, 169, 184) */
/* rgb(240, 103, 100) */
/* rgb(217, 93, 90) */
/* rgb(28, 89, 127) */
/* rgb(25, 81, 115) */
/* New colours */
/* Family */
/* For now, both of these are being defined to the DM Sans font. At a later time
this will be cleaned up to improve how the site-wide fonts are defined. */
/* Sizes */
/* Font-weight */
/* Line height */
/* Letter-spacing */
/* Spacing */
/**
 * Animations
 */
/**
 * Transitions
 */
/* Duration */
/* timing function */
/**
 * Breakpoints
 */
/**
 * Container widths
 */
/**
 * Text
 *
 * A special component that provides a range of heading and paragraph styles
 * that can be applied directly to text elements.
 */
/**
 * Headings
 */
/*
$line-height-heading: 1.25em;

.Heading {
  font-family: $font-family-serif;
  font-size: 22px;
  font-weight: $font-weight-serif;
  line-height: $line-height-heading;
}

.Heading--profile,
.Heading--hero {
  font-family: $font-family-serif;
  font-size: 36px;
  font-weight: $font-weight-serif;
  line-height: $line-height-heading;

  &::before {
    content: '';
    display: table;
    margin-top: -0.25em;
  }
}

.Heading--product {
  font-family: $font-family-serif;
  font-size: 36px;
  font-weight: $font-weight-serif;
  line-height: $line-height-heading;
}

.Heading--page {
  font-family: $font-family-serif;
  font-size: 30px;
  font-weight: $font-weight-serif;
  line-height: $line-height-heading;
}

.Heading--card {
  font-family: $font-family-serif;
  font-size: 18px;
  font-weight: $font-weight-serif;
  line-height: $line-height-heading;
}
*/
.Subheading {
  font-family: "DM Sans", sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1.25;
  text-transform: uppercase;
}

.Subheading-lowercase {
  letter-spacing: 0.03em;
  text-transform: capitalize;
}

/*
  OLD HEADING STYLES
*/
/*
.Text-headingSmall {
  font-family: $font-family-sans;
  font-size: $font-size-sans-smaller;
  font-weight: $font-weight-sans-bold;
  letter-spacing: $letter-spacing-sans-uppercase;
  line-height: $line-height-tighter;
  text-transform: uppercase;
}*/
/**
 * Captions (help text)
 */
/*
.CaptionUI--regular {
  font-family: $font-family-sans;
  font-size: $font-size-sans-small;
  font-weight: $font-weight-sans;
  line-height: $line-height;
}

.CaptionUI--emphasis {
  font-family: $font-family-sans;
  font-size: $font-size-sans-small;
  font-weight: $font-weight-sans-bold;
  line-height: $line-height;
}
*/
/**
* Hint text
**/
.HintUI {
  font-family: "DM Sans", sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;
}

.HintUI--emphasis {
  font-family: "DM Sans", sans-serif;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.5;
}

/**
 * Paragraphs (body text)
 */
.BodyUI--regular {
  font-family: "DM Sans", sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
}

.BodyUI--emphasis {
  font-family: "DM Sans", sans-serif;
  font-size: 16px;
  font-weight: 700;
  line-height: 125%;
}

.BodyUI--hint {
  font-family: "DM Sans", sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
}

.Text-bodySerif {
  font-family: "DM Sans", serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
}

.Text-standfirst {
  font-family: "DM Sans", serif;
  font-size: 30px;
  font-weight: 400;
  line-height: 1.25;
}

.Text-bodySerifSmallItalics {
  font-family: "DM Sans", serif;
  font-size: 16px;
  font-style: italic;
  font-weight: 400;
  line-height: 1.5;
}

.Text-bodySansSmall {
  font-family: "DM Sans", sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
}

.Text-bodySansSmaller {
  font-family: "DM Sans", sans-serif;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.5;
}

.Text-bodySansSmallest {
  font-family: "DM Sans", sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: normal;
}

.Text-bodySansSmallestBold {
  font-family: "DM Sans", sans-serif;
  font-size: 12px;
  font-weight: 700;
  line-height: normal;
}

.Text-bodySansSmallBold {
  font-family: "DM Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.5;
}

.Text--colourWhite {
  color: #fff;
}

.Text--colourBoulder {
  color: #7a7a7a;
}

.Text--colourIron {
  color: #ccc;
}

.Text--colourNavy {
  color: #2f3a4a;
}

.Text--colourPurple {
  color: #3b2d51;
}

.Text--colourRed {
  color: #ee6265;
}

.Text--defaultLabel {
  display: none;
}
.Text--defaultLabel.is-active {
  display: inline;
}

@media (min-width: 960px) {
  .Heading--profile,
  .Heading--hero {
    font-size: 52px;
  }
}
/**
 * Theme
 *
 * Global variables in use throughout the application
 */
/**
 * Colours
 */
/* Main colour palette */
/* rgb(0, 0, 0) */
/* rgb(42, 42, 42) */
/* rgb(61, 61, 61) */
/* rgb(82, 82, 82) */
/* rgb(102, 102, 102) */
/* rgb(122, 122, 122) */
/* rgb(164, 164, 164) */
/* rgb(204, 204, 204) */
/* rgb(244, 244, 244) */
/* rgb(249, 249, 249) */
/* rgb(255, 255, 255) */
/* rgb(122, 122, 122) */
/* rgba(255, 200, 202) */
/* rgb(61,61,61) */
/* rgba(225, 234, 224) */
/* rgb(225, 234, 224) */
/* rgb(42, 42, 42) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(47, 58, 74) */
/* rgb(59, 45, 81) */
/* rgb(77, 66, 98) */
/* rgb(153, 185, 174) */
/* rgb(238, 98, 101) */
/* rgb(240, 114, 116) */
/* rgb(255, 200, 202) */
/* rgb(73, 84, 100) */
/* rgb(244, 244, 244) */
/* rgb(204, 204, 204) */
/* rgb(204, 204, 204) */
/* black percentages use absolute black */
/* Additional colours */
/* rgb(133, 187, 204) */
/* rgb(120, 169, 184) */
/* rgb(240, 103, 100) */
/* rgb(217, 93, 90) */
/* rgb(28, 89, 127) */
/* rgb(25, 81, 115) */
/* New colours */
/* Family */
/* For now, both of these are being defined to the DM Sans font. At a later time
this will be cleaned up to improve how the site-wide fonts are defined. */
/* Sizes */
/* Font-weight */
/* Line height */
/* Letter-spacing */
/* Spacing */
/**
 * Animations
 */
/**
 * Transitions
 */
/* Duration */
/* timing function */
/**
 * Breakpoints
 */
/**
 * Container widths
 */
/**
 * Tips
 */
.Tips {
  position: relative;
}

.Tips-action {
  text-align: right;
}

.Tips-content {
  animation-duration: 400ms;
  animation-fill-mode: both;
  animation-name: fadeIn;
  background-color: rgba(0, 0, 0, 0.8);
  border-radius: 4px;
  display: none;
  padding: 12px;
  position: absolute;
  right: 0;
  top: 40px;
  width: 200px;
  z-index: 1;
}
.Tips-content.is-visible {
  display: block;
}

.Tips-header {
  border-bottom: 1px solid #e1eae0;
  padding-bottom: 8px;
  position: relative;
}

.Tips-close {
  position: absolute;
  right: 0;
  top: 0;
}

.Tips-closeMedia {
  fill: #fff;
  height: 10px;
  width: 10px;
}

.Tips-title {
  font-family: "DM Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.5;
}

.Tips-item {
  font-family: "DM Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.5;
  margin-top: 10px;
}

.Badge {
  border-radius: 24px;
  font-size: 1em;
  font-weight: bold;
  padding: 3px 12px;
  position: relative;
}

.Badge + .Badge {
  margin-left: 10px;
}

.Badge--plain {
  border: 1px solid var(--color-black);
  color: var(--color-black);
}

.ProofPointCardContent {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  height: 80px;
  justify-content: space-between;
  margin-right: 17px; /* 17px is the arrow's width that has position: absolute */
  max-width: 500px;
}

.ProofPointCardContent-theme {
  border-radius: 6px;
  color: var(--color-slate);
  font-size: var(--font-size-smallest);
  font-weight: normal;
  letter-spacing: 0;
  line-height: 1.35;
  padding: 2px 6px;
}
.ProofPointCardContent-theme svg {
  display: inline-block;
  margin-top: -2px;
  vertical-align: middle;
}

.ProofPointCardList-item--theme5 .ProofPointCardContent-theme svg {
  margin-top: -3px;
}

.ProofPointCardContent-title {
  font-size: 1em;
  font-weight: bold;
  letter-spacing: 0.5px;
  line-height: 1.1;
  margin: 0;
}

.ProofPointCardContent-description {
  -webkit-box-orient: vertical; /* stylelint-disable-line */
  color: var(--color-grey-dark);
  -webkit-line-clamp: 2;
  display: -webkit-box; /* stylelint-disable-line */
  font-size: var(--font-size-small);
  line-height: 1.3;
  margin: 0;
  overflow: hidden;
}

/* stylelint-disable */
ul.ProofPointCardList {
  margin: 0 10px;
  overflow: hidden;
  padding-bottom: 15px;
}

.ProofPointCardList-item {
  align-items: center;
  background: #fff;
  border: 1px solid var(--color-grey-lightest);
  border-radius: 10px;
  box-shadow: 0 1px 2px 0 rgba(31, 30, 30, 0.08);
  cursor: pointer;
  display: flex;
  height: 100px;
  padding: 0 15px;
  position: relative;
  transform: translateY(0);
  transition: border 0.3s, box-shadow 0.3s, transform 0.5s, opacity 0.3s;
}
.ProofPointCardList-item:hover, .ProofPointCardList-item:focus {
  border: 1px solid #ccc;
  box-shadow: 0 4px 8px 3px rgba(31, 30, 30, 0.08);
}
.ProofPointCardList-item:hover .ProofPointCard-chevron, .ProofPointCardList-item:focus .ProofPointCard-chevron {
  transform: translateX(8px);
}
.ProofPointCardList-item:active {
  border: 1px solid var(--color-grey-lightest);
  box-shadow: inset 0 4px 8px rgba(0, 0, 0, 0.08);
}

.ProofPointCardList-item + .ProofPointCardList-item {
  margin-top: 15px;
}

.ProofPointCard {
  align-items: center;
  color: var(--black);
  display: flex;
  gap: 15px;
  text-decoration: none;
}

.ProofPointCard-chevron {
  display: block;
  min-width: 17px;
  position: absolute;
  right: 8px;
  transition: transform 0.2s ease-in-out;
}

.ProofPointHeader-icon {
  float: left;
}

.ProofPointHeader-heading {
  margin-bottom: 36px;
  margin-left: 98px;
}

.ProofPointHeader-title {
  font-family: inherit;
  font-size: var(--font-size-larger);
  font-weight: bold;
  line-height: 100%;
  margin: 0;
}

.ProofPointHeader-description {
  line-height: 1.5;
  margin: 1em 0;
}

.ProofPointHeader-link {
  border: 1px solid var(--color-purple);
  border-radius: 4px;
  color: var(--color-purple);
  font-size: var(--font-size-small);
  font-weight: bold;
  letter-spacing: 1px;
  padding: 6px 8px;
  text-decoration: none;
  text-transform: uppercase;
}

.ProofPointIcon {
  background-color: var(--color-grey-lightest);
  flex: 0 0 44px;
  float: left;
}
.ProofPointIcon--circle {
  border-radius: 50%;
}

.SchemeApplicability {
  background: rgba(0, 0, 0, 0.2);
  color: var(--color-white-absolute);
  padding: 3px 16px 3px 32px;
}

.SchemeApplicability::before {
  background: var(--color-white-absolute);
  border-radius: 12px;
  content: "";
  display: inline-block;
  height: 18px;
  left: 4px;
  position: absolute;
  top: 4px;
  width: 18px;
}

.SchemeApplicability--present {
  background: var(--color-slate);
}

/* stylelint-disable */
.SmallHeading,
.SecondaryContent h3 {
  color: var(--color-grey-light);
  font-family: var(--font-family);
  font-size: 1em;
  font-weight: normal;
}

.SecondaryContent {
  color: var(--color-black);
}
.SecondaryContent a {
  color: inherit;
  font-weight: bold;
}
.SecondaryContent h2 {
  margin: 42px 0 16px;
  font-size: 1.375rem !important;
}
.SecondaryContent h3 {
  margin-bottom: 1rem;
}
.SecondaryContent h4 {
  font-size: 1rem;
  margin-top: 1rem;
}
.SecondaryContent p,
.SecondaryContent ul,
.SecondaryContent ol {
  line-height: 24px;
}
.SecondaryContent ul > li + li,
.SecondaryContent ol > li + li {
  margin-top: 6px;
}
.SecondaryContent img {
  max-width: 100%;
}
.SecondaryContent table {
  border-collapse: collapse;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
  font-size: 0.9em;
  margin: 25px 0;
  min-width: 400px;
}
.SecondaryContent thead tr {
  background-color: #08856C;
  color: #fff;
  text-align: left;
}
.SecondaryContent th,
.SecondaryContent td {
  padding: 12px 15px;
}
.SecondaryContent tbody tr {
  border-bottom: 1px solid #ddd;
}
.SecondaryContent tbody tr:nth-of-type(even) {
  background-color: #f3f3f3;
}
.SecondaryContent tbody tr:last-of-type {
  border-bottom: 2px solid #08856C;
}
.SecondaryContent details :last-child {
  margin-bottom: 1.5rem;
}
.SecondaryContent details + details {
  border-top: 1px solid #ccc;
}
.SecondaryContent summary {
  font-size: 1.125rem;
  position: relative;
  padding: 1rem 0;
}
.SecondaryContent summary > svg {
  position: absolute;
  right: 0;
  margin-top: 0.5rem;
  transform: rotate(180deg);
}
.SecondaryContent [open] summary > svg {
  transform: rotate(0);
}

/* stylelint-disable */
/* stylelint-disable no-descending-specificity */
.ThemeFilter a,
.ThemeFilter-subAnchor {
  text-decoration: none;
}

.ThemeFilter-listItem {
  color: #2a2a2a;
  font-size: var(--font-size-small);
  letter-spacing: 1px;
}
.ThemeFilter-listItem :checked + label {
  font-weight: bold;
}
.ThemeFilter-listItem :active + label {
  outline: 1px solid #000;
}

.ThemeFilter-listItem + .ThemeFilter-listItem,
.ThemeDetails + .ThemeDetails {
  margin-top: 18px;
}

.ThemeFilter-listItem > label,
.ThemeDetails > summary {
  cursor: pointer;
}

.ThemeFilter-listItem > label:hover,
.ThemeDetails[open] > summary,
.ThemeFilter-listItem :checked + label {
  text-decoration: underline;
}

.ThemeFilter-capsule {
  border-radius: 40px;
  display: flex;
  flex-direction: row;
  height: 20px;
  line-height: 1;
  padding: 0 12px 0 2px;
  width: max-content;
}
.ThemeFilter-capsule p {
  margin: auto;
  padding-left: 0.25em;
  text-transform: uppercase;
}
.ThemeFilter-capsule svg {
  height: 18px;
  width: 18px;
}

.ThemeFilter-anchor,
.ThemeDetails > summary {
  align-items: center;
  color: inherit;
  display: grid;
  font-weight: bold;
  grid-gap: 10px;
  grid-template-columns: 50px auto;
  text-transform: uppercase;
}

.ThemeFilter input {
  display: none;
}

.ThemeFilter-subListItem {
  letter-spacing: normal;
  margin-left: 28px;
  margin-top: 10px;
}

.ThemeFilter-subAnchor {
  align-items: center;
  color: var(--color-slate);
  display: grid;
  grid-gap: 10px;
  grid-template-columns: 22px auto;
}
.ThemeFilter-subAnchor:hover, .ThemeFilter-subAnchor:focus {
  text-decoration: underline;
}

.ThemeFilter-subAnchor::before,
.ThemeDetails > summary::before {
  border-radius: 11px;
  content: "";
  display: inline-block;
  height: 22px;
}

.ThemeFilter-subListItem--active {
  font-weight: bold;
  text-decoration: underline;
}

/* Hide the filter and sidebar on mobile */
.ThemeFilter,
.ThemeDetailsList {
  display: none;
}

.ThemeDetails > summary {
  color: var(--color-slate);
  display: inline;
  letter-spacing: 1px;
  outline: none;
  text-transform: uppercase;
}
.ThemeDetails > summary::before {
  margin-right: 10px;
  vertical-align: middle;
  width: 50px;
}

.ThemeDetails-linkBack {
  color: #09332B;
  text-decoration: none;
}
.ThemeDetails-linkBack:hover {
  text-decoration: underline;
}

::-webkit-details-marker {
  display: none;
}

html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  scroll-behavior: smooth;
}

body {
  margin: 0;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}
hr {
  border: 0;
  border-bottom: 1px solid var(--color-mercury);
  margin: 30px 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--font-family-title);
}

h6 {
  margin: 25px 0 15px;
}

aside {
  padding-bottom: 88px;
}

[type=reset] {
  border: 0;
}

* {
  box-sizing: border-box;
}

ul[class] {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* CSS specific to the /framework (index) page */
.Chip + label {
  display: inline-flex;
}

@media (min-width: 640px) {
  ul.ProofPointCardList {
    max-width: 620px;
    min-height: 561px;
  }
}
:root {
  --font-family: "DM Sans", sans-serif;
  --font-family-title: "DM Sans", sans-serif;
  --color-black: #2a2a2a;
  --color-black-absolute: #000;
  --color-grey-dark: #666;
  --color-grey-light: #a4a4a4;
  --color-grey-lightest: #f4f4f4;
  --color-mercury: #e4e4e4;
  --color-slate: #495464;
  --color-purple: #3b2d51;
  --color-white-absolute: #fff;
  --color-theme-climate: #c3ebe5;
  --color-theme-communities: #ffdfc9;
  --color-theme-nature: #e4f4c9;
  --color-theme-waste: #d1dbeb;
  --color-theme-workers: #ffb7b2;
  --font-size-smallest: 0.75em;
  --font-size-small: 0.875em;
  --font-size-larger: 2.5em;
}

.ProofPointContent {
  margin: 15px 0;
  max-width: 720px;
}

.TransparencyFrameworkProofPointBody main {
  margin: 15px 0;
  padding: 0 15px;
}

.TransparencyFrameworkProofPointBody aside {
  margin: 15px 0 0 15px;
}

@media (min-width: 640px) {
  .ThemeDetailsList {
    display: block;
  }
  .ProofPointHeader {
    max-width: 760px;
  }
  .SecondaryContent {
    margin-bottom: 60px;
  }
}
@media (min-width: 960px) {
  .ThemeFilter-subAnchor {
    font-size: 1rem;
  }
}
.ProofPointCardList-item--theme1 .ProofPointCardContent-theme,
.ProofPointHeader--theme1 .ProofPointHeader-theme,
.ProofPointHeader--theme1::before,
.ThemeDetails--theme1 .ThemeFilter-anchor::before,
.ThemeDetails--theme1 .ThemeFilter-subAnchor::before,
.ThemeDetails--theme1 > summary::before {
  background-color: var(--color-theme-climate);
}

.ProofPointCardList-item--theme2 .ProofPointCardContent-theme,
.ProofPointHeader--theme2 .ProofPointHeader-theme,
.ThemeDetails--theme2 .ThemeFilter-anchor::before,
.ThemeDetails--theme2 .ThemeFilter-subAnchor::before,
.ThemeDetails--theme2 > summary::before {
  background-color: var(--color-theme-waste);
}

.ProofPointCardList-item--theme3 .ProofPointCardContent-theme,
.ProofPointHeader--theme3 .ProofPointHeader-theme,
.ThemeDetails--theme3 .ThemeFilter-anchor::before,
.ThemeDetails--theme3 .ThemeFilter-subAnchor::before,
.ThemeDetails--theme3 > summary::before {
  background-color: var(--color-theme-nature);
}

.ProofPointCardList-item--theme4 .ProofPointCardContent-theme,
.ProofPointHeader--theme4 .ProofPointHeader-theme,
.ThemeDetails--theme4 .ThemeFilter-anchor::before,
.ThemeDetails--theme4 .ThemeFilter-subAnchor::before,
.ThemeDetails--theme4 > summary::before {
  background-color: var(--color-theme-workers);
}

.ProofPointCardList-item--theme5 .ProofPointCardContent-theme,
.ProofPointHeader--theme5 .ProofPointHeader-theme,
.ThemeDetails--theme5 .ThemeFilter-anchor::before,
.ThemeDetails--theme5 .ThemeFilter-subAnchor::before,
.ThemeDetails--theme5 > summary::before {
  background-color: var(--color-theme-communities);
}

.Theme--climate {
  background-color: #c3ebe5;
}

.Theme--waste {
  background-color: #d1dbeb;
}

.Theme--nature {
  background-color: #e4f4c9;
}

.Theme--workers {
  background-color: #ffb7b2;
}

.Theme--communities {
  background-color: #ffdfc9;
}

/* Utilities */
.u-mr3 {
  margin-right: 0.75rem;
}

/* Disable text highlighting */
.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
  user-select: none;
}

.overflow-hidden {
  overflow: hidden;
}

.box {
  border: 1px solid var(--color-scale-gray-2);
  border-radius: var(--base-size-4);
  padding: var(--base-size-12);
}

/* stylelint-disable */
cards-container {
  display: grid;
  gap: 1.5rem;
  grid-auto-flow: column;
  margin-bottom: -0.75rem;
  margin-left: -0.75rem;
  margin-top: -0.75rem !important;
  overflow-x: auto;
  padding: 0.75rem;
  scroll-behavior: smooth;
  scroll-snap-type: x mandatory;
}

cards-container > * {
  scroll-margin-left: 0.75rem;
  scroll-snap-align: start;
  scroll-snap-stop: always;
}

/* The rules below replicate the appearance of macOS scrollbar as of March 2023.
 * These were added because we wanted to ensure a scrollbar would always appear,
 * for every user, even trackpad users, but only on desktop and larger screens.
 *
 */
@media (min-width: 768px) {
  cards-container::-webkit-scrollbar {
    -webkit-appearance: none;
  }
  cards-container::-webkit-scrollbar:vertical {
    width: 11px;
  }
  cards-container::-webkit-scrollbar:horizontal {
    height: 11px;
  }
  cards-container::-webkit-scrollbar-thumb {
    border-radius: 8px;
    border: 2px solid #fff; /* should match background, can't be transparent */
    background-color: rgba(0, 0, 0, 0.5);
  }
}
.center {
  box-sizing: content-box;
  margin-inline: auto;
  max-inline-size: 1060px;
}

.cluster {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space, --base-size-4);
}

.icon {
  width: 0.75em;
  width: 1cap;
  height: 0.75em;
  height: 1cap;
}

.with-icon {
  display: inline-flex;
  align-items: baseline;
}

.with-icon .icon {
  margin-inline-start: 0.75rem;
}

.CircleBgIcon {
  background-color: var(--bgColor-neutral-muted);
  border-radius: 50%;
  height: 32px;
  width: 32px;
}

.stack-4 > * + * {
  margin-top: var(--base-size-4);
}

.stack-5 > * + * {
  margin-top: var(--base-size-8);
}

/* stylelint-disable */
.Action--tertiary {
  background-color: transparent;
  border-color: transparent;
  color: #3C3C3C;
  letter-spacing: normal;
  line-height: 1.2;
  padding: 4px;
  text-transform: none;
  width: fit-content;
  /* stylelint-disable selector-no-attribute */
  /* stylelint-enable selector-no-attribute */
}
.Action--tertiary:visited, .Action--tertiary:active {
  background-color: rgba(60, 60, 60, 0.25);
  border-color: transparent;
  color: #3C3C3C;
}
.Action--tertiary:focus {
  background-color: rgba(60, 60, 60, 0.25);
  border-color: #B4B4B4;
}
.Action--tertiary:hover {
  background-color: rgba(60, 60, 60, 0.1);
  border-color: transparent;
  color: #3C3C3C;
}
.Action--tertiary[disabled], .Action--tertiary.is-disabled {
  background-color: transparent;
  border-color: transparent;
  color: #8F8F8F;
}
.Action--tertiary[disabled] > svg, .Action--tertiary.is-disabled > svg {
  stroke: #8F8F8F;
}

.Action-icon--tertiary {
  height: 16px;
  position: absolute;
  width: 16px;
}
.Action-icon--tertiary.is-hidden {
  display: none;
}

.Action-text--left {
  margin-left: 0;
  margin-right: 2px;
}

.Action-text--right {
  margin-left: 18px;
  margin-right: 0;
}

.Action-outline {
  border: 1px solid #B4B4B4;
  border-radius: 4px;
  padding: 8px;
  text-decoration: none;
}

.BoardContainer {
  border: 1px solid #DDDDDD;
  border-radius: 8px;
  max-width: max-content;
}

.BoardHeader {
  width: max-content;
}

.BoardHeader-sticky {
  position: sticky;
  top: 0;
  z-index: 2;
}

.Board {
  border-bottom: 1px solid #DDDDDD;
  position: relative;
  width: 100%;
}
.Board .chevron {
  color: var(--color-scale-prov-gray-8);
  left: 6px;
  position: absolute;
  transition: transform 0.5s;
  width: var(--spacing-spacer-5);
}
.Board[open] > *:not(summary) {
  animation: details-show 150ms ease-in-out;
}

.Board[open] > summary {
  margin-bottom: 0.5em;
}
.Board[open] > summary > .chevron {
  transform: rotate(-180deg);
}

.Count {
  border-radius: 50%;
  display: inline-block;
  font-size: 14px;
  height: 20px;
  line-height: 20px;
  text-align: center;
  width: 20px;
}

/* stylelint-disable */
.Capsule {
  align-items: center;
  background-color: #fff;
  border: solid transparent;
  border-radius: 24px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2), 0 1px 3px 1px rgba(0, 0, 0, 0.12);
  color: #2a2a2a;
  display: flex;
  height: 48px;
  justify-content: center;
  padding-right: 20px;
  position: relative;
}

.Capsule-icon {
  align-items: center;
  background: #f4f4f4;
  border-radius: 50%;
  display: flex;
  flex-shrink: 0;
  height: 44px;
  justify-content: center;
  overflow: hidden;
  width: 44px;
}

.Capsule-wrapper {
  background: var(--bgColor-neutral-muted, rgba(175, 184, 193, 0.2));
  border-radius: 24px 24px 12px 12px;
}

.Capsule-footer {
  padding: 6px 2px 8px 2px;
}

.ag-root-wrapper {
  margin-top: 16px;
}

.ag-theme-quartz, .ag-theme-quartz-dark {
  /* disable all borders */
  --ag-borders: none !important;
  /* then add back a border between rows */
  --ag-row-border-style: solid !important;
  --ag-row-border-width: 1px !important;
  --ag-row-border-color: #D0D7DE !important;
  --ag-header-foreground-color: $colour-white !important;
  --ag-header-background-color: $colour-white !important;
}

.ag-header-cell-text {
  color: #636C76;
  font-size: 12px;
  font-weight: 500;
  line-height: 15px;
}

.DataTable__proofPointLabel {
  width: max-content;
}

.DataTable__proofPointName {
  font-family: var(--font-family-title);
  font-weight: bold;
}

.DataTable__proofPointProductCoverage {
  gap: 8px;
}

.ag-theme-quartz .ag-tooltip {
  background-color: #ffffff;
  color: #000000;
  padding: 5px;
  z-index: 9999;
}

/* Only used in the dashboard. Ideally it shouldn't have these very specific styles,
   So feel free to refactor in case you want to use this in other places.
  */
.DescriptionList {
  flex: 1;
}

.DescriptionList + .DescriptionList {
  border-left: 1px solid var(--borderColor-default);
  padding-left: 1rem;
}

.Drawer {
  border: 0;
  margin: 0;
  padding: 0;
  width: 35rem;
  margin-left: calc(100% - 35rem);
  transition: all 0.4s allow-discrete;
  transform: translateX(100%);
}
.Drawer[open] {
  opacity: 1;
  transform: translateX(0);
}
.Drawer header,
.Drawer section {
  padding: 1rem;
}
.Drawer ul,
.Drawer ol {
  padding-left: 1.25rem;
}
.Drawer section h2 {
  margin-bottom: 1.25rem;
}
.Drawer section h3 {
  margin-bottom: 1rem;
}
.Drawer summary::marker {
  font-size: 0;
}

.OpenDrawer {
  box-shadow: 0 3px 6px rgba(140, 149, 159, 0.15);
  height: calc(100vh - 76px);
  max-width: 35rem;
}

.Drawer section a {
  color: var(--color-accent-fg);
  text-decoration: underline;
}

.Drawer:-internal-dialog-in-top-layer {
  height: 100%; /* to make the animation look decent */
  max-height: 100%; /* overrides default user agent stylesheet */
}

.Drawer-closeBtn {
  cursor: pointer;
  border-radius: 50%;
  height: 2rem;
  left: 90%;
  position: sticky;
  top: 1rem;
}
.Drawer-closeBtn:focus {
  outline: 1px solid #000;
}

@starting-style {
  .Drawer[open] {
    transform: translateX(100%);
  }
}
.Drawer::backdrop {
  background-color: rgba(0, 0, 0, 0);
  transition: all 0.4s allow-discrete;
}

.Drawer[open]::backdrop {
  background-color: rgba(0, 0, 0, 0.75);
}

@starting-style {
  .Drawer[open]::backdrop {
    background-color: rgba(0, 0, 0, 0);
  }
}
/* stylelint-disable */
.Filter fieldset {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 0.75rem;
}
.Filter fieldset + fieldset {
  margin-top: 2rem;
}
.Filter legend {
  color: #686868;
  font-size: 1rem;
  font-weight: bold;
  margin-bottom: 0.75rem;
}
.Filter [type=reset] {
  background: none;
  color: #3C3C3C;
  letter-spacing: 1px;
  margin-top: 0.75rem;
  padding: 6px 4px;
  text-transform: uppercase;
}
.Filter [type=reset]:hover {
  background: #E1EEEA;
  border-radius: 0.25rem;
}
.Filter [type=reset]:disabled {
  color: #DDDDDD;
}

.FiltersContainer {
  position: relative;
}

.FilterOptions {
  box-shadow: 0 2px 3px 0 rgba(31, 30, 30, 0.15), 0 6px 10px 4px rgba(31, 30, 30, 0.08);
  position: absolute;
  z-index: 16;
}

.FilterOptions--right {
  right: 0;
}

.FilterOptions--left {
  left: 0;
}

.FilterOption:hover {
  background-color: #ECF3FC;
  cursor: pointer;
}
.FilterOption.selected {
  background-color: #ECF3FC;
}

.LinkList-row {
  border-top: 1px solid #d0d7de;
  margin: 0 -1rem;
}
.LinkList-row:hover {
  background-color: #f6f8fa;
}

.LinkList-row .ProofPointIcon {
  background-color: #f4f4f4;
}

.LinkList-anchor {
  font-weight: bold;
  color: var(--fgColor-black);
  padding: 1rem;
}

.LinkList-anchor, .LinkList-content {
  gap: 1rem;
}

.Overlayer {
  background: rgba(0, 0, 0, 0.5);
  height: 100%;
  left: 0;
  opacity: 0;
  position: fixed;
  top: 0;
  transition: visibility 0s 0.5s, opacity 0.5s;
  visibility: hidden;
  width: 100%;
  z-index: 15;
}

.Overlayer--visible {
  opacity: 1;
  transition: visibility 0s, opacity 0.5s;
  visibility: visible;
}

.ProgressBar__container {
  display: flex;
  align-items: center;
  width: max-content;
}

.ProgressBar__bar {
  width: 120px;
}

.ProgressBar__percentage {
  width: max-content;
}

.ProgressBar__count {
  width: max-content;
  font-family: var(--font-family-title);
  font-weight: bold;
}

/* stylelint-disable */
tabs-content {
  display: flex;
  overflow: hidden;
}
tabs-content [role=tabpanel] {
  align-items: flex-end;
  display: flex;
  flex: 0 0 auto;
  padding: 2px 0 3px 3px;
  transition: transform 0.15s;
  width: 100%;
}
tabs-content [role=tabpanel]:not(:first-child) {
  margin-left: 7px;
}

tabs-nav {
  bottom: 7px;
  position: absolute;
}
tabs-nav [role=tab] {
  border: 1px solid transparent;
  color: #3C3C3C;
  font-size: 0.75rem;
  font-weight: bold;
  padding: 10px 5px 2px;
  transition: box-shadow 0.4s;
}
tabs-nav [role=tab]:hover {
  color: #000;
}
tabs-nav [aria-selected=true] {
  box-shadow: inset 0 4px 0 0 #000;
  color: #000;
}
tabs-nav :focus {
  outline: none;
}
tabs-nav :focus-visible {
  border: 1px solid #000;
  outline: none;
}

/* stylelint-disable */
p-tag {
  border-radius: 6px;
  font-size: 0.75em;
  padding: 0.188em 0.375em;
}
p-tag svg {
  margin-top: -3px;
  vertical-align: middle;
}
p-tag[inert] {
  background: #F4F4F4;
  color: #8F8F8F;
  user-select: none;
}
p-tag[inert] svg {
  opacity: 0.4;
}

.Dialog-body {
  font-weight: 400;
  line-height: 20px;
}

:root {
  --text-body-size-medium: 1rem;
}

.ActionListItem.ActionListItem--navActive:not(.ActionListItem--danger)::after {
  background-color: #c9f04d;
}

.FormControl-spacingWrapper {
  row-gap: 1.5rem;
}

.focused .FormControl-spacingWrapper {
  position: relative;
  margin: 0 auto;
  max-width: 300px;
}

#new_proof_point_form {
  row-gap: 0.5rem;
}
#new_proof_point_form button {
  margin-top: 10px;
  padding: 10px;
  line-height: 0;
}
#new_proof_point_form input {
  padding: 20px;
  line-height: 0;
}

.FormControl .error {
  color: var(--color-danger-fg); /* This is actually not Primer. It's the error message from `simple_form_for`. */
}

.Link--primary {
  font-weight: 700;
}

.forgot-password-link {
  position: absolute;
  left: 200px;
  bottom: 146px;
}

ul.devise-links {
  margin: 2rem auto;
  max-width: 300px;
}

.UnderlineNav {
  --underlineNav-borderColor-active: #1F1E1E;
  box-shadow: none;
}

.BorderBox-overflow {
  overflow: auto;
}

.Button__disabled {
  pointer-events: none;
  cursor: not-allowed;
  opacity: 0.5;
}

/* similar to Primer::Beta::Avatar component, but really just an empty div with a text in the middle */
.AvatarEmpty {
  /* copied from .avatar */
  background-color: var(--avatar-bgColor);
  border-radius: var(--borderRadius-medium);
  box-shadow: 0 0 0 1px var(--avatar-borderColor);
  line-height: 1;
  overflow: hidden;
  width: 80px;
  height: 80px;
  /* added extra */
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* stylelint-disable */
.ProvCard {
  border-radius: 0.5rem;
  box-shadow: 0 1px 3px 1px rgba(31, 30, 30, 0.15), 0 1px 2px 0 rgba(31, 30, 30, 0.08);
  padding: 0;
  transition: box-shadow 0.2s;
}
.ProvCard:hover {
  box-shadow: 0 1px 3px 0 rgba(31, 30, 30, 0.15), 0 4px 8px 3px rgba(31, 30, 30, 0.08);
}

.SchemeCard {
  margin-bottom: 12px;
  width: 256px;
}
.SchemeCard a {
  color: #3C3C3C;
  text-decoration: none;
}

.SchemeCard-footer {
  border-top: 1px solid lightgrey;
  pointer-events: none;
}

.MetricsCard {
  height: max-content;
}

.MetricsCard--standard {
  width: 650px;
}

.MetricsCard--narrow {
  width: 420px;
}

.MetricsCard--wide {
  width: 1080px;
}

.Card {
  background-repeat: no-repeat;
  background-size: cover 160px;
  border-radius: 10px;
  /* Elevation 1 */
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2), 0 1px 3px 1px rgba(0, 0, 0, 0.12);
  color: #07251F;
  display: block;
  overflow: hidden;
  padding-bottom: 2rem;
  position: relative;
  text-decoration: none;
  transform: translateY(0);
  transition: border 0.3s, box-shadow 0.3s, transform 0.5s, opacity 0.3s;
  width: 100%;
}
.Card:hover {
  color: #07251F;
}
.Card::after {
  bottom: 0.75rem;
  content: "See the Impact →";
  font-weight: bold;
  position: absolute;
  right: 0.75rem;
  text-decoration: underline;
}

.Card-hero {
  display: block;
}

.Card-hero img {
  aspect-ratio: 39/16;
  width: 100%;
}

.Card-logo {
  border-radius: 50%;
  box-shadow: 0 0 4px #ccc;
  float: right;
  margin-left: 0.25rem;
  margin-right: 0.75rem;
  margin-top: 0.75rem;
}

.Card-heading {
  color: #3C3C3C;
  font-size: 22px;
  line-height: 1.2;
  margin: 1rem;
  margin-bottom: 0;
}

.Card > .cluster {
  --space: 0.5rem;
  padding: 1rem;
}

@media (min-width: 960px) {
  .Card {
    display: flex;
    flex-wrap: wrap;
    height: 142px;
    padding-bottom: 0;
  }
  .Card-hero {
    max-width: 195px;
  }
  .Card-hero img {
    aspect-ratio: 195/142;
  }
  .Card-logo {
    position: absolute;
    right: 0;
  }
  .Card > .cluster {
    left: 195px;
    position: absolute;
    top: 50px;
  }
}
@media (min-width: 1012px) {
  .Channels {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(3, 80px);
  }
}
.FormHorizontal .FormControl {
  display: grid;
  grid-template-columns: 2fr 3fr;
  align-items: center;
}

/* stylelint-disable */
.RoadmapGrid {
  display: grid;
  grid-column-gap: 8px;
}

.RoadmapGrid-themes {
  grid-template-columns: repeat(5, auto);
}

.RoadmapGrid-hotspots {
  grid-template-columns: repeat(7, auto);
}

.RoadmapHeaderItem-themeClimate {
  border-bottom: 2px solid #c3ebe5;
}

.RoadmapHeaderItem-themeCommunities {
  border-bottom: 2px solid #ffdfc9;
}

.RoadmapHeaderItem-themeNature {
  border-bottom: 2px solid #e4f4c9;
}

.RoadmapHeaderItem-themeWaste {
  border-bottom: 2px solid #d1dbeb;
}

.RoadmapHeaderItem-themeWorkers {
  border-bottom: 2px solid #ffb7b2;
}

.RoadmapHeaderItem,
.RoadmapBoardCol {
  width: 280px;
}

.RoadmapSummary {
  display: grid;
  grid-column-gap: 10px;
  grid-template-columns: 420px 650px;
  max-width: 1080px;
}
.RoadmapSummary > .MetricsCard--wide {
  grid-column: 1/3;
}

.RoadmapFilterOption {
  display: flex;
  width: 320px;
}

.FreePlanLink {
  --control-small-size: 19px;
  --control-small-gap: 0;
  --control-small-paddingInline-condensed: 0;
  --button-default-bgColor-rest: #E1D4FD;
  --button-default-bgColor-hover: #d1befc; /* #E1D4FD darkened 5% */
  --button-default-borderColor-hover: #c2a8fb !important; /* #E1D4FD darkened 10% */
  --button-default-borderColor-rest: #E1D4FD;
  --button-default-borderColor-hover: #E1D4FD;
  --button-default-borderColor-active: #E1D4FD;
}
button:has(.FreePlanLink) {
  text-wrap: nowrap; /* this nifty little trick prevents the icon from going to the next line in the 'Insights & Analytics' button */
}
.ProofPointSubmission .FreePlanLink {
  --control-small-size: 23px;
}

.PaymentFrequencyForm {
  float: right;
  margin-top: -1.4rem;
}

.PaymentPlan {
  background-color: #f9f8f1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.25rem 1.5rem;
  margin-top: 1rem;
  border-radius: 0.75rem;
}

.PaymentPlan h2,
.PaymentPlan div span {
  font-size: 1rem;
  font-weight: normal;
  color: #636c76;
}

.PaymentPlan h3 {
  font-size: 2rem;
}

/* stylelint-disable */
.ProofPointContainer {
  border-radius: 8px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15), 0 2px 6px 2px rgba(0, 0, 0, 0.1);
  scroll-margin-top: 50px;
}
.ProofPointContainer > header {
  align-items: center;
  background: #F3F8F6;
  display: grid;
  grid-template-columns: min-content 380px min-content min-content auto;
  min-height: 80px;
}
.ProofPointContainer > header > div {
  border-right: 1px solid #DDDDDD;
  height: 48px;
}
.ProofPointContainer > header :first-child {
  border-right: none;
}
.ProofPointContainer > header :last-child {
  border-right: none;
}

.ProofPointSubmission {
  border-bottom: 0;
  border-left: 0;
  border-radius: 0;
  border-right: 0;
}
.ProofPointSubmission > summary {
  align-items: center;
  display: grid;
  gap: 15px;
  grid-template-columns: 220px 1fr 1fr 1fr 220px;
}
.ProofPointSubmission .ClaimCardCMS-main,
.ProofPointSubmission .ClaimCardCMS-footer {
  margin-left: 210px;
}
.ProofPointSubmission .ProofPointSubmission--actions {
  position: relative;
}

[aria-label="Sidebar Navigation"] .ActionListItem-label {
  color: #fff;
}
[aria-label="Sidebar Navigation"] .ActionListItem-visual,
[aria-label="Sidebar Navigation"] .ActionList-sectionDivider-title {
  color: rgba(255, 255, 255, 0.5);
}
[aria-label="Sidebar Navigation"] .ActionList-sectionDivider:empty {
  display: none;
}
@media (min-height: 500px) {
  [aria-label="Sidebar Navigation"] .ActionListItem {
    margin: var(--stack-gap-normal) 0;
  }
}

.Button-visual {
  transition: transform 0.2s;
}

.Sidebar-bottom {
  position: absolute;
  background-color: var(--color-scale-prov-green-8);
  bottom: 0;
  width: 90%;
}
.Sidebar-bottom action-menu focus-group > button {
  box-shadow: none;
  color: #fff;
  font-size: 300%;
  background: transparent;
  position: absolute;
  left: 0;
  width: 100%;
  outline-offset: var(--base-size-8);
  padding-bottom: var(--base-size-4);
}
.Sidebar-bottom action-menu focus-group > button:hover .Button-visual {
  transform: translateX(var(--base-size-4));
}
.Sidebar-bottom .Button--secondary:hover:not(:disabled, .Button--inactive) {
  background: transparent;
}

.FormHeader-component {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 40px;
  align-self: stretch;
}

.FormHeader-icon {
  align-items: center;
  display: flex;
  margin-right: 16px;
}

.FormHeader-content {
  border-left: 1px solid #D0D7DE;
  flex-grow: 1;
  padding: 0 16px;
}

.FormHeader-progress-bar {
  width: 260px;
}

.HeaderComponent-container {
  max-width: 1060px;
}

.ProofPointHeader-content-label-name {
  font-size: 30px;
  font-weight: 500;
  line-height: 125%;
}

.Label-list {
  gap: 8px;
}

.Label-container {
  height: 24px;
  gap: 2px;
  background: var(--Greys-Grey-2, #EDEDED);
}

.Label-container-label {
  color: var(--Greys-Grey-9, #1F1E1E);
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 100%; /* 12px */
}

.AssociatedProductsAction {
  gap: 10px;
}

.AssociatedProductsAction--count {
  display: flex;
  align-items: center;
  text-wrap: nowrap;
}

.EvidenceTimelineComponent ul {
  padding-inline-start: 10px;
  padding-inline-end: 10px;
  margin: 0;
}

.EvidenceTimelineComponent ul li {
  margin-left: 0;
}

.EvidenceTimelineComponent ul li:last-child {
  border-bottom: none !important;
  padding-bottom: 14px;
  padding-top: 14px;
}

.EvidenceTimelineComponent ul li:first-child {
  padding-top: 14px;
  padding-bottom: 14px;
}

.EvidenceTimelineComponent__event {
  display: flex;
  align-items: flex-start;
  gap: 32px;
  padding: 8px 0;
}

.EvidenceTimelineComponent__timestamp {
  color: #636C76;
  width: 16%;
}

.EvidenceTimelineComponent__content {
  display: flex;
  flex-direction: column;
}

.EvidenceTimelineComponent__evidence-name {
  font-weight: 700;
}

.EvidenceTimelineComponent__danger-icon {
  fill: #CF222E;
}

.EvidenceTimelineComponent__content-event {
  display: flex;
  flex-direction: column;
}

.EvidenceTimelineComponent__content-name {
  display: flex;
  align-items: center;
  gap: 5px;
}

.EvidenceTimelineComponent__content-rejection-reason {
  background: #FFEBE9;
  display: flex;
  flex-direction: column;
  padding: 12px;
  margin-top: 8px;
  border-radius: var(--base-size-4);
  width: 303px;
}

.EvidenceTimelineComponent__content-rejection-reason-category {
  font-weight: 700;
}

.IngredientsList-listItem {
  display: grid;
  grid-template-columns: auto 1fr auto 24rem auto;
  gap: var(--base-size-16);
  align-items: center;
  margin: var(--base-size-8) 0;
}
.IngredientsList-listItem .octicon-x-circle,
.IngredientsList-listItem .octicon-check-circle {
  margin-right: var(--base-size-8);
}

.IngredientsList-sortMessage {
  font-size: 14px;
  color: #7a7a7a;
  font-family: "DM Sans", sans-serif;
  margin-top: 4px;
  text-align: center;
}

.IngredientsList-userInput {
  overflow: hidden;
  text-overflow: ellipsis;
}

.ag-icon {
  font-family: var(--ag-icon-font-family);
  font-weight: var(--ag-icon-font-weight);
  color: var(--ag-icon-font-color);
  font-size: var(--ag-icon-size);
  line-height: var(--ag-icon-size);
  font-style: normal;
  font-variant: normal;
  text-transform: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  width: var(--ag-icon-size);
  height: var(--ag-icon-size);
  position: relative;
}

.ag-icon::before {
  content: "";
  font-family: inherit;
}

.ag-icon::after {
  background: transparent var(--ag-icon-image, none) center/contain no-repeat;
  display: var(--ag-icon-image-display);
  opacity: var(--ag-icon-image-opacity, 0.9);
  position: absolute;
  inset: 0;
  content: "";
}

.ag-icon-aggregation {
  font-family: var(--ag-icon-font-family-aggregation, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-aggregation, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-aggregation, var(--ag-icon-font-color));
}

.ag-icon-aggregation::before {
  content: var(--ag-icon-font-code-aggregation, "\f101");
  display: var(--ag-icon-font-display-aggregation, var(--ag-icon-font-display));
}

.ag-icon-aggregation::after {
  background-image: var(--ag-icon-image-aggregation, var(--ag-icon-image));
  display: var(--ag-icon-image-display-aggregation, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-aggregation, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-arrows {
  font-family: var(--ag-icon-font-family-arrows, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-arrows, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-arrows, var(--ag-icon-font-color));
}

.ag-icon-arrows::before {
  content: var(--ag-icon-font-code-arrows, "\f102");
  display: var(--ag-icon-font-display-arrows, var(--ag-icon-font-display));
}

.ag-icon-arrows::after {
  background-image: var(--ag-icon-image-arrows, var(--ag-icon-image));
  display: var(--ag-icon-image-display-arrows, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-arrows, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-asc {
  font-family: var(--ag-icon-font-family-asc, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-asc, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-asc, var(--ag-icon-font-color));
}

.ag-icon-asc::before {
  content: var(--ag-icon-font-code-asc, "\f103");
  display: var(--ag-icon-font-display-asc, var(--ag-icon-font-display));
}

.ag-icon-asc::after {
  background-image: var(--ag-icon-image-asc, var(--ag-icon-image));
  display: var(--ag-icon-image-display-asc, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-asc, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-cancel {
  font-family: var(--ag-icon-font-family-cancel, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-cancel, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-cancel, var(--ag-icon-font-color));
}

.ag-icon-cancel::before {
  content: var(--ag-icon-font-code-cancel, "\f104");
  display: var(--ag-icon-font-display-cancel, var(--ag-icon-font-display));
}

.ag-icon-cancel::after {
  background-image: var(--ag-icon-image-cancel, var(--ag-icon-image));
  display: var(--ag-icon-image-display-cancel, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-cancel, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-chart {
  font-family: var(--ag-icon-font-family-chart, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-chart, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-chart, var(--ag-icon-font-color));
}

.ag-icon-chart::before {
  content: var(--ag-icon-font-code-chart, "\f105");
  display: var(--ag-icon-font-display-chart, var(--ag-icon-font-display));
}

.ag-icon-chart::after {
  background-image: var(--ag-icon-image-chart, var(--ag-icon-image));
  display: var(--ag-icon-image-display-chart, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-chart, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-checkbox-checked {
  font-family: var(--ag-icon-font-family-checkbox-checked, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-checkbox-checked, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-checkbox-checked, var(--ag-icon-font-color));
}

.ag-icon-checkbox-checked::before {
  content: var(--ag-icon-font-code-checkbox-checked, "\f106");
  display: var(--ag-icon-font-display-checkbox-checked, var(--ag-icon-font-display));
}

.ag-icon-checkbox-checked::after {
  background-image: var(--ag-icon-image-checkbox-checked, var(--ag-icon-image));
  display: var(--ag-icon-image-display-checkbox-checked, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-checkbox-checked, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-checkbox-indeterminate {
  font-family: var(--ag-icon-font-family-checkbox-indeterminate, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-checkbox-indeterminate, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-checkbox-indeterminate, var(--ag-icon-font-color));
}

.ag-icon-checkbox-indeterminate::before {
  content: var(--ag-icon-font-code-checkbox-indeterminate, "\f107");
  display: var(--ag-icon-font-display-checkbox-indeterminate, var(--ag-icon-font-display));
}

.ag-icon-checkbox-indeterminate::after {
  background-image: var(--ag-icon-image-checkbox-indeterminate, var(--ag-icon-image));
  display: var(--ag-icon-image-display-checkbox-indeterminate, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-checkbox-indeterminate, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-checkbox-unchecked {
  font-family: var(--ag-icon-font-family-checkbox-unchecked, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-checkbox-unchecked, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-checkbox-unchecked, var(--ag-icon-font-color));
}

.ag-icon-checkbox-unchecked::before {
  content: var(--ag-icon-font-code-checkbox-unchecked, "\f108");
  display: var(--ag-icon-font-display-checkbox-unchecked, var(--ag-icon-font-display));
}

.ag-icon-checkbox-unchecked::after {
  background-image: var(--ag-icon-image-checkbox-unchecked, var(--ag-icon-image));
  display: var(--ag-icon-image-display-checkbox-unchecked, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-checkbox-unchecked, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-color-picker {
  font-family: var(--ag-icon-font-family-color-picker, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-color-picker, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-color-picker, var(--ag-icon-font-color));
}

.ag-icon-color-picker::before {
  content: var(--ag-icon-font-code-color-picker, "\f109");
  display: var(--ag-icon-font-display-color-picker, var(--ag-icon-font-display));
}

.ag-icon-color-picker::after {
  background-image: var(--ag-icon-image-color-picker, var(--ag-icon-image));
  display: var(--ag-icon-image-display-color-picker, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-color-picker, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-columns {
  font-family: var(--ag-icon-font-family-columns, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-columns, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-columns, var(--ag-icon-font-color));
}

.ag-icon-columns::before {
  content: var(--ag-icon-font-code-columns, "\f10a");
  display: var(--ag-icon-font-display-columns, var(--ag-icon-font-display));
}

.ag-icon-columns::after {
  background-image: var(--ag-icon-image-columns, var(--ag-icon-image));
  display: var(--ag-icon-image-display-columns, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-columns, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-contracted {
  font-family: var(--ag-icon-font-family-contracted, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-contracted, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-contracted, var(--ag-icon-font-color));
}

.ag-icon-contracted::before {
  content: var(--ag-icon-font-code-contracted, "\f10b");
  display: var(--ag-icon-font-display-contracted, var(--ag-icon-font-display));
}

.ag-icon-contracted::after {
  background-image: var(--ag-icon-image-contracted, var(--ag-icon-image));
  display: var(--ag-icon-image-display-contracted, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-contracted, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-copy {
  font-family: var(--ag-icon-font-family-copy, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-copy, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-copy, var(--ag-icon-font-color));
}

.ag-icon-copy::before {
  content: var(--ag-icon-font-code-copy, "\f10c");
  display: var(--ag-icon-font-display-copy, var(--ag-icon-font-display));
}

.ag-icon-copy::after {
  background-image: var(--ag-icon-image-copy, var(--ag-icon-image));
  display: var(--ag-icon-image-display-copy, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-copy, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-cross {
  font-family: var(--ag-icon-font-family-cross, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-cross, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-cross, var(--ag-icon-font-color));
}

.ag-icon-cross::before {
  content: var(--ag-icon-font-code-cross, "\f10d");
  display: var(--ag-icon-font-display-cross, var(--ag-icon-font-display));
}

.ag-icon-cross::after {
  background-image: var(--ag-icon-image-cross, var(--ag-icon-image));
  display: var(--ag-icon-image-display-cross, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-cross, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-csv {
  font-family: var(--ag-icon-font-family-csv, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-csv, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-csv, var(--ag-icon-font-color));
}

.ag-icon-csv::before {
  content: var(--ag-icon-font-code-csv, "\f10e");
  display: var(--ag-icon-font-display-csv, var(--ag-icon-font-display));
}

.ag-icon-csv::after {
  background-image: var(--ag-icon-image-csv, var(--ag-icon-image));
  display: var(--ag-icon-image-display-csv, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-csv, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-cut {
  font-family: var(--ag-icon-font-family-cut, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-cut, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-cut, var(--ag-icon-font-color));
}

.ag-icon-cut::before {
  content: var(--ag-icon-font-code-cut, "\f10f");
  display: var(--ag-icon-font-display-cut, var(--ag-icon-font-display));
}

.ag-icon-cut::after {
  background-image: var(--ag-icon-image-cut, var(--ag-icon-image));
  display: var(--ag-icon-image-display-cut, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-cut, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-desc {
  font-family: var(--ag-icon-font-family-desc, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-desc, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-desc, var(--ag-icon-font-color));
}

.ag-icon-desc::before {
  content: var(--ag-icon-font-code-desc, "\f110");
  display: var(--ag-icon-font-display-desc, var(--ag-icon-font-display));
}

.ag-icon-desc::after {
  background-image: var(--ag-icon-image-desc, var(--ag-icon-image));
  display: var(--ag-icon-image-display-desc, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-desc, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-excel {
  font-family: var(--ag-icon-font-family-excel, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-excel, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-excel, var(--ag-icon-font-color));
}

.ag-icon-excel::before {
  content: var(--ag-icon-font-code-excel, "\f111");
  display: var(--ag-icon-font-display-excel, var(--ag-icon-font-display));
}

.ag-icon-excel::after {
  background-image: var(--ag-icon-image-excel, var(--ag-icon-image));
  display: var(--ag-icon-image-display-excel, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-excel, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-expanded {
  font-family: var(--ag-icon-font-family-expanded, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-expanded, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-expanded, var(--ag-icon-font-color));
}

.ag-icon-expanded::before {
  content: var(--ag-icon-font-code-expanded, "\f112");
  display: var(--ag-icon-font-display-expanded, var(--ag-icon-font-display));
}

.ag-icon-expanded::after {
  background-image: var(--ag-icon-image-expanded, var(--ag-icon-image));
  display: var(--ag-icon-image-display-expanded, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-expanded, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-eye-slash {
  font-family: var(--ag-icon-font-family-eye-slash, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-eye-slash, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-eye-slash, var(--ag-icon-font-color));
}

.ag-icon-eye-slash::before {
  content: var(--ag-icon-font-code-eye-slash, "\f113");
  display: var(--ag-icon-font-display-eye-slash, var(--ag-icon-font-display));
}

.ag-icon-eye-slash::after {
  background-image: var(--ag-icon-image-eye-slash, var(--ag-icon-image));
  display: var(--ag-icon-image-display-eye-slash, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-eye-slash, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-eye {
  font-family: var(--ag-icon-font-family-eye, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-eye, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-eye, var(--ag-icon-font-color));
}

.ag-icon-eye::before {
  content: var(--ag-icon-font-code-eye, "\f114");
  display: var(--ag-icon-font-display-eye, var(--ag-icon-font-display));
}

.ag-icon-eye::after {
  background-image: var(--ag-icon-image-eye, var(--ag-icon-image));
  display: var(--ag-icon-image-display-eye, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-eye, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-filter {
  font-family: var(--ag-icon-font-family-filter, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-filter, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-filter, var(--ag-icon-font-color));
}

.ag-icon-filter::before {
  content: var(--ag-icon-font-code-filter, "\f115");
  display: var(--ag-icon-font-display-filter, var(--ag-icon-font-display));
}

.ag-icon-filter::after {
  background-image: var(--ag-icon-image-filter, var(--ag-icon-image));
  display: var(--ag-icon-image-display-filter, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-filter, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-first {
  font-family: var(--ag-icon-font-family-first, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-first, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-first, var(--ag-icon-font-color));
}

.ag-icon-first::before {
  content: var(--ag-icon-font-code-first, "\f116");
  display: var(--ag-icon-font-display-first, var(--ag-icon-font-display));
}

.ag-icon-first::after {
  background-image: var(--ag-icon-image-first, var(--ag-icon-image));
  display: var(--ag-icon-image-display-first, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-first, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-grip {
  font-family: var(--ag-icon-font-family-grip, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-grip, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-grip, var(--ag-icon-font-color));
}

.ag-icon-grip::before {
  content: var(--ag-icon-font-code-grip, "\f117");
  display: var(--ag-icon-font-display-grip, var(--ag-icon-font-display));
}

.ag-icon-grip::after {
  background-image: var(--ag-icon-image-grip, var(--ag-icon-image));
  display: var(--ag-icon-image-display-grip, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-grip, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-group {
  font-family: var(--ag-icon-font-family-group, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-group, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-group, var(--ag-icon-font-color));
}

.ag-icon-group::before {
  content: var(--ag-icon-font-code-group, "\f118");
  display: var(--ag-icon-font-display-group, var(--ag-icon-font-display));
}

.ag-icon-group::after {
  background-image: var(--ag-icon-image-group, var(--ag-icon-image));
  display: var(--ag-icon-image-display-group, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-group, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-last {
  font-family: var(--ag-icon-font-family-last, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-last, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-last, var(--ag-icon-font-color));
}

.ag-icon-last::before {
  content: var(--ag-icon-font-code-last, "\f119");
  display: var(--ag-icon-font-display-last, var(--ag-icon-font-display));
}

.ag-icon-last::after {
  background-image: var(--ag-icon-image-last, var(--ag-icon-image));
  display: var(--ag-icon-image-display-last, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-last, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-left {
  font-family: var(--ag-icon-font-family-left, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-left, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-left, var(--ag-icon-font-color));
}

.ag-icon-left::before {
  content: var(--ag-icon-font-code-left, "\f11a");
  display: var(--ag-icon-font-display-left, var(--ag-icon-font-display));
}

.ag-icon-left::after {
  background-image: var(--ag-icon-image-left, var(--ag-icon-image));
  display: var(--ag-icon-image-display-left, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-left, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-linked {
  font-family: var(--ag-icon-font-family-linked, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-linked, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-linked, var(--ag-icon-font-color));
}

.ag-icon-linked::before {
  content: var(--ag-icon-font-code-linked, "\f11b");
  display: var(--ag-icon-font-display-linked, var(--ag-icon-font-display));
}

.ag-icon-linked::after {
  background-image: var(--ag-icon-image-linked, var(--ag-icon-image));
  display: var(--ag-icon-image-display-linked, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-linked, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-loading {
  font-family: var(--ag-icon-font-family-loading, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-loading, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-loading, var(--ag-icon-font-color));
}

.ag-icon-loading::before {
  content: var(--ag-icon-font-code-loading, "\f11c");
  display: var(--ag-icon-font-display-loading, var(--ag-icon-font-display));
}

.ag-icon-loading::after {
  background-image: var(--ag-icon-image-loading, var(--ag-icon-image));
  display: var(--ag-icon-image-display-loading, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-loading, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-maximize {
  font-family: var(--ag-icon-font-family-maximize, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-maximize, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-maximize, var(--ag-icon-font-color));
}

.ag-icon-maximize::before {
  content: var(--ag-icon-font-code-maximize, "\f11d");
  display: var(--ag-icon-font-display-maximize, var(--ag-icon-font-display));
}

.ag-icon-maximize::after {
  background-image: var(--ag-icon-image-maximize, var(--ag-icon-image));
  display: var(--ag-icon-image-display-maximize, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-maximize, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-menu {
  font-family: var(--ag-icon-font-family-menu, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-menu, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-menu, var(--ag-icon-font-color));
}

.ag-icon-menu::before {
  content: var(--ag-icon-font-code-menu, "\f11e");
  display: var(--ag-icon-font-display-menu, var(--ag-icon-font-display));
}

.ag-icon-menu::after {
  background-image: var(--ag-icon-image-menu, var(--ag-icon-image));
  display: var(--ag-icon-image-display-menu, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-menu, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-minimize {
  font-family: var(--ag-icon-font-family-minimize, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-minimize, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-minimize, var(--ag-icon-font-color));
}

.ag-icon-minimize::before {
  content: var(--ag-icon-font-code-minimize, "\f11f");
  display: var(--ag-icon-font-display-minimize, var(--ag-icon-font-display));
}

.ag-icon-minimize::after {
  background-image: var(--ag-icon-image-minimize, var(--ag-icon-image));
  display: var(--ag-icon-image-display-minimize, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-minimize, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-next {
  font-family: var(--ag-icon-font-family-next, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-next, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-next, var(--ag-icon-font-color));
}

.ag-icon-next::before {
  content: var(--ag-icon-font-code-next, "\f120");
  display: var(--ag-icon-font-display-next, var(--ag-icon-font-display));
}

.ag-icon-next::after {
  background-image: var(--ag-icon-image-next, var(--ag-icon-image));
  display: var(--ag-icon-image-display-next, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-next, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-none {
  font-family: var(--ag-icon-font-family-none, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-none, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-none, var(--ag-icon-font-color));
}

.ag-icon-none::before {
  content: var(--ag-icon-font-code-none, "\f121");
  display: var(--ag-icon-font-display-none, var(--ag-icon-font-display));
}

.ag-icon-none::after {
  background-image: var(--ag-icon-image-none, var(--ag-icon-image));
  display: var(--ag-icon-image-display-none, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-none, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-not-allowed {
  font-family: var(--ag-icon-font-family-not-allowed, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-not-allowed, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-not-allowed, var(--ag-icon-font-color));
}

.ag-icon-not-allowed::before {
  content: var(--ag-icon-font-code-not-allowed, "\f122");
  display: var(--ag-icon-font-display-not-allowed, var(--ag-icon-font-display));
}

.ag-icon-not-allowed::after {
  background-image: var(--ag-icon-image-not-allowed, var(--ag-icon-image));
  display: var(--ag-icon-image-display-not-allowed, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-not-allowed, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-paste {
  font-family: var(--ag-icon-font-family-paste, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-paste, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-paste, var(--ag-icon-font-color));
}

.ag-icon-paste::before {
  content: var(--ag-icon-font-code-paste, "\f123");
  display: var(--ag-icon-font-display-paste, var(--ag-icon-font-display));
}

.ag-icon-paste::after {
  background-image: var(--ag-icon-image-paste, var(--ag-icon-image));
  display: var(--ag-icon-image-display-paste, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-paste, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-pin {
  font-family: var(--ag-icon-font-family-pin, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-pin, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-pin, var(--ag-icon-font-color));
}

.ag-icon-pin::before {
  content: var(--ag-icon-font-code-pin, "\f124");
  display: var(--ag-icon-font-display-pin, var(--ag-icon-font-display));
}

.ag-icon-pin::after {
  background-image: var(--ag-icon-image-pin, var(--ag-icon-image));
  display: var(--ag-icon-image-display-pin, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-pin, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-pivot {
  font-family: var(--ag-icon-font-family-pivot, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-pivot, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-pivot, var(--ag-icon-font-color));
}

.ag-icon-pivot::before {
  content: var(--ag-icon-font-code-pivot, "\f125");
  display: var(--ag-icon-font-display-pivot, var(--ag-icon-font-display));
}

.ag-icon-pivot::after {
  background-image: var(--ag-icon-image-pivot, var(--ag-icon-image));
  display: var(--ag-icon-image-display-pivot, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-pivot, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-previous {
  font-family: var(--ag-icon-font-family-previous, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-previous, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-previous, var(--ag-icon-font-color));
}

.ag-icon-previous::before {
  content: var(--ag-icon-font-code-previous, "\f126");
  display: var(--ag-icon-font-display-previous, var(--ag-icon-font-display));
}

.ag-icon-previous::after {
  background-image: var(--ag-icon-image-previous, var(--ag-icon-image));
  display: var(--ag-icon-image-display-previous, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-previous, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-radio-button-off {
  font-family: var(--ag-icon-font-family-radio-button-off, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-radio-button-off, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-radio-button-off, var(--ag-icon-font-color));
}

.ag-icon-radio-button-off::before {
  content: var(--ag-icon-font-code-radio-button-off, "\f127");
  display: var(--ag-icon-font-display-radio-button-off, var(--ag-icon-font-display));
}

.ag-icon-radio-button-off::after {
  background-image: var(--ag-icon-image-radio-button-off, var(--ag-icon-image));
  display: var(--ag-icon-image-display-radio-button-off, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-radio-button-off, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-radio-button-on {
  font-family: var(--ag-icon-font-family-radio-button-on, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-radio-button-on, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-radio-button-on, var(--ag-icon-font-color));
}

.ag-icon-radio-button-on::before {
  content: var(--ag-icon-font-code-radio-button-on, "\f128");
  display: var(--ag-icon-font-display-radio-button-on, var(--ag-icon-font-display));
}

.ag-icon-radio-button-on::after {
  background-image: var(--ag-icon-image-radio-button-on, var(--ag-icon-image));
  display: var(--ag-icon-image-display-radio-button-on, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-radio-button-on, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-right {
  font-family: var(--ag-icon-font-family-right, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-right, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-right, var(--ag-icon-font-color));
}

.ag-icon-right::before {
  content: var(--ag-icon-font-code-right, "\f129");
  display: var(--ag-icon-font-display-right, var(--ag-icon-font-display));
}

.ag-icon-right::after {
  background-image: var(--ag-icon-image-right, var(--ag-icon-image));
  display: var(--ag-icon-image-display-right, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-right, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-save {
  font-family: var(--ag-icon-font-family-save, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-save, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-save, var(--ag-icon-font-color));
}

.ag-icon-save::before {
  content: var(--ag-icon-font-code-save, "\f12a");
  display: var(--ag-icon-font-display-save, var(--ag-icon-font-display));
}

.ag-icon-save::after {
  background-image: var(--ag-icon-image-save, var(--ag-icon-image));
  display: var(--ag-icon-image-display-save, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-save, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-small-down {
  font-family: var(--ag-icon-font-family-small-down, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-small-down, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-small-down, var(--ag-icon-font-color));
}

.ag-icon-small-down::before {
  content: var(--ag-icon-font-code-small-down, "\f12b");
  display: var(--ag-icon-font-display-small-down, var(--ag-icon-font-display));
}

.ag-icon-small-down::after {
  background-image: var(--ag-icon-image-small-down, var(--ag-icon-image));
  display: var(--ag-icon-image-display-small-down, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-small-down, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-small-left {
  font-family: var(--ag-icon-font-family-small-left, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-small-left, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-small-left, var(--ag-icon-font-color));
}

.ag-icon-small-left::before {
  content: var(--ag-icon-font-code-small-left, "\f12c");
  display: var(--ag-icon-font-display-small-left, var(--ag-icon-font-display));
}

.ag-icon-small-left::after {
  background-image: var(--ag-icon-image-small-left, var(--ag-icon-image));
  display: var(--ag-icon-image-display-small-left, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-small-left, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-small-right {
  font-family: var(--ag-icon-font-family-small-right, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-small-right, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-small-right, var(--ag-icon-font-color));
}

.ag-icon-small-right::before {
  content: var(--ag-icon-font-code-small-right, "\f12d");
  display: var(--ag-icon-font-display-small-right, var(--ag-icon-font-display));
}

.ag-icon-small-right::after {
  background-image: var(--ag-icon-image-small-right, var(--ag-icon-image));
  display: var(--ag-icon-image-display-small-right, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-small-right, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-small-up {
  font-family: var(--ag-icon-font-family-small-up, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-small-up, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-small-up, var(--ag-icon-font-color));
}

.ag-icon-small-up::before {
  content: var(--ag-icon-font-code-small-up, "\f12e");
  display: var(--ag-icon-font-display-small-up, var(--ag-icon-font-display));
}

.ag-icon-small-up::after {
  background-image: var(--ag-icon-image-small-up, var(--ag-icon-image));
  display: var(--ag-icon-image-display-small-up, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-small-up, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-tick {
  font-family: var(--ag-icon-font-family-tick, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-tick, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-tick, var(--ag-icon-font-color));
}

.ag-icon-tick::before {
  content: var(--ag-icon-font-code-tick, "\f12f");
  display: var(--ag-icon-font-display-tick, var(--ag-icon-font-display));
}

.ag-icon-tick::after {
  background-image: var(--ag-icon-image-tick, var(--ag-icon-image));
  display: var(--ag-icon-image-display-tick, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-tick, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-tree-closed {
  font-family: var(--ag-icon-font-family-tree-closed, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-tree-closed, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-tree-closed, var(--ag-icon-font-color));
}

.ag-icon-tree-closed::before {
  content: var(--ag-icon-font-code-tree-closed, "\f130");
  display: var(--ag-icon-font-display-tree-closed, var(--ag-icon-font-display));
}

.ag-icon-tree-closed::after {
  background-image: var(--ag-icon-image-tree-closed, var(--ag-icon-image));
  display: var(--ag-icon-image-display-tree-closed, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-tree-closed, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-tree-indeterminate {
  font-family: var(--ag-icon-font-family-tree-indeterminate, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-tree-indeterminate, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-tree-indeterminate, var(--ag-icon-font-color));
}

.ag-icon-tree-indeterminate::before {
  content: var(--ag-icon-font-code-tree-indeterminate, "\f131");
  display: var(--ag-icon-font-display-tree-indeterminate, var(--ag-icon-font-display));
}

.ag-icon-tree-indeterminate::after {
  background-image: var(--ag-icon-image-tree-indeterminate, var(--ag-icon-image));
  display: var(--ag-icon-image-display-tree-indeterminate, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-tree-indeterminate, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-tree-open {
  font-family: var(--ag-icon-font-family-tree-open, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-tree-open, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-tree-open, var(--ag-icon-font-color));
}

.ag-icon-tree-open::before {
  content: var(--ag-icon-font-code-tree-open, "\f132");
  display: var(--ag-icon-font-display-tree-open, var(--ag-icon-font-display));
}

.ag-icon-tree-open::after {
  background-image: var(--ag-icon-image-tree-open, var(--ag-icon-image));
  display: var(--ag-icon-image-display-tree-open, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-tree-open, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-unlinked {
  font-family: var(--ag-icon-font-family-unlinked, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-unlinked, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-unlinked, var(--ag-icon-font-color));
}

.ag-icon-unlinked::before {
  content: var(--ag-icon-font-code-unlinked, "\f133");
  display: var(--ag-icon-font-display-unlinked, var(--ag-icon-font-display));
}

.ag-icon-unlinked::after {
  background-image: var(--ag-icon-image-unlinked, var(--ag-icon-image));
  display: var(--ag-icon-image-display-unlinked, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-unlinked, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-up {
  font-family: var(--ag-icon-font-family-up, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-up, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-up, var(--ag-icon-font-color));
}

.ag-icon-up::before {
  content: var(--ag-icon-font-code-up, "\f134");
  display: var(--ag-icon-font-display-up, var(--ag-icon-font-display));
}

.ag-icon-up::after {
  background-image: var(--ag-icon-image-up, var(--ag-icon-image));
  display: var(--ag-icon-image-display-up, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-up, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-down {
  font-family: var(--ag-icon-font-family-down, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-down, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-down, var(--ag-icon-font-color));
}

.ag-icon-down::before {
  content: var(--ag-icon-font-code-down, "\f135");
  display: var(--ag-icon-font-display-down, var(--ag-icon-font-display));
}

.ag-icon-down::after {
  background-image: var(--ag-icon-image-down, var(--ag-icon-image));
  display: var(--ag-icon-image-display-down, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-down, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-plus {
  font-family: var(--ag-icon-font-family-plus, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-plus, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-plus, var(--ag-icon-font-color));
}

.ag-icon-plus::before {
  content: var(--ag-icon-font-code-plus, "\f136");
  display: var(--ag-icon-font-display-plus, var(--ag-icon-font-display));
}

.ag-icon-plus::after {
  background-image: var(--ag-icon-image-plus, var(--ag-icon-image));
  display: var(--ag-icon-image-display-plus, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-plus, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-minus {
  font-family: var(--ag-icon-font-family-minus, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-minus, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-minus, var(--ag-icon-font-color));
}

.ag-icon-minus::before {
  content: var(--ag-icon-font-code-minus, "\f137");
  display: var(--ag-icon-font-display-minus, var(--ag-icon-font-display));
}

.ag-icon-minus::after {
  background-image: var(--ag-icon-image-minus, var(--ag-icon-image));
  display: var(--ag-icon-image-display-minus, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-minus, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-menu-alt {
  font-family: var(--ag-icon-font-family-menu-alt, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-menu-alt, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-menu-alt, var(--ag-icon-font-color));
}

.ag-icon-menu-alt::before {
  content: var(--ag-icon-font-code-menu-alt, "\f138");
  display: var(--ag-icon-font-display-menu-alt, var(--ag-icon-font-display));
}

.ag-icon-menu-alt::after {
  background-image: var(--ag-icon-image-menu-alt, var(--ag-icon-image));
  display: var(--ag-icon-image-display-menu-alt, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-menu-alt, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-settings {
  font-family: var(--ag-icon-font-family-settings, var(--ag-icon-font-family));
  font-weight: var(--ag-icon-font-weight-settings, var(--ag-icon-font-weight));
  color: var(--ag-icon-font-color-settings, var(--ag-icon-font-color));
}

.ag-icon-settings::before {
  content: var(--ag-icon-font-code-settings, "\f139");
  display: var(--ag-icon-font-display-settings, var(--ag-icon-font-display));
}

.ag-icon-settings::after {
  background-image: var(--ag-icon-image-settings, var(--ag-icon-image));
  display: var(--ag-icon-image-display-settings, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-settings, var(--ag-icon-image-opacity, 0.9));
}

.ag-icon-row-drag::before {
  content: var(--ag-icon-font-code-grip);
}

.ag-left-arrow::before {
  content: var(--ag-icon-font-code-left);
}

.ag-right-arrow::before {
  content: var(--ag-icon-font-code-right);
}

[class*=ag-theme-] {
  --ag-foreground-color: #000;
  --ag-data-color: var(--ag-foreground-color);
  --ag-secondary-foreground-color: var(--ag-foreground-color);
  --ag-header-foreground-color: var(--ag-secondary-foreground-color);
  --ag-disabled-foreground-color: rgba(0, 0, 0, 0.5);
  --ag-background-color: #fff;
  --ag-header-background-color: transparent;
  --ag-tooltip-background-color: transparent;
  --ag-subheader-background-color: transparent;
  --ag-subheader-toolbar-background-color: transparent;
  --ag-control-panel-background-color: transparent;
  --ag-side-button-selected-background-color: var(--ag-control-panel-background-color);
  --ag-selected-row-background-color: #bbb;
  --ag-odd-row-background-color: var(--ag-background-color);
  --ag-modal-overlay-background-color: rgba(255, 255, 255, 0.66);
  --ag-menu-background-color: var(--ag-background-color);
  --ag-menu-border-color: var(--ag-border-color);
  --ag-panel-background-color: var(--ag-background-color);
  --ag-panel-border-color: var(--ag-border-color);
  --ag-row-hover-color: transparent;
  --ag-column-hover-color: transparent;
  --ag-range-selection-border-color: var(--ag-foreground-color);
  --ag-range-selection-border-style: solid;
  --ag-range-selection-background-color: rgba(0, 0, 0, 0.2);
  --ag-range-selection-background-color-2: var(--ag-range-selection-background-color);
  --ag-range-selection-background-color-3: var(--ag-range-selection-background-color);
  --ag-range-selection-background-color-4: var(--ag-range-selection-background-color);
  --ag-range-selection-highlight-color: var(--ag-range-selection-border-color);
  --ag-selected-tab-underline-color: var(--ag-range-selection-border-color);
  --ag-selected-tab-underline-width: 0;
  --ag-selected-tab-underline-transition-speed: 0s;
  --ag-range-selection-chart-category-background-color: rgba(0, 255, 132, 0.1);
  --ag-range-selection-chart-background-color: rgba(0, 88, 255, 0.1);
  --ag-header-cell-hover-background-color: transparent;
  --ag-header-cell-moving-background-color: var(--ag-background-color);
  --ag-value-change-value-highlight-background-color: rgba(22, 160, 133, 0.5);
  --ag-value-change-delta-up-color: #43a047;
  --ag-value-change-delta-down-color: #e53935;
  --ag-row-loading-skeleton-effect-color: rgba(66, 66, 66, 0.2);
  --ag-chip-background-color: transparent;
  --ag-chip-border-color: var(--ag-chip-background-color);
  --ag-borders: solid 1px;
  --ag-border-color: rgba(0, 0, 0, 0.25);
  --ag-borders-critical: var(--ag-borders);
  --ag-borders-secondary: var(--ag-borders);
  --ag-secondary-border-color: var(--ag-border-color);
  --ag-row-border-style: solid;
  --ag-row-border-color: var(--ag-secondary-border-color);
  --ag-row-border-width: 1px;
  --ag-cell-horizontal-border: solid transparent;
  --ag-borders-input: var(--ag-borders-secondary);
  --ag-input-border-color: var(--ag-secondary-border-color);
  --ag-borders-input-invalid: solid 2px;
  --ag-input-border-color-invalid: var(--ag-invalid-color);
  --ag-borders-side-button: var(--ag-borders);
  --ag-border-radius: 0px;
  --ag-wrapper-border-radius: var(--ag-border-radius);
  --ag-row-border-color: var(--ag-secondary-border-color);
  --ag-header-column-separator-display: none;
  --ag-header-column-separator-height: 100%;
  --ag-header-column-separator-width: 1px;
  --ag-header-column-separator-color: var(--ag-secondary-border-color);
  --ag-header-column-resize-handle-display: none;
  --ag-header-column-resize-handle-height: 50%;
  --ag-header-column-resize-handle-width: 1px;
  --ag-header-column-resize-handle-color: var(--ag-secondary-border-color);
  --ag-invalid-color: red;
  --ag-input-disabled-border-color: var(--ag-input-border-color);
  --ag-input-disabled-background-color: transparent;
  --ag-checkbox-background-color: transparent;
  --ag-checkbox-border-radius: var(--ag-border-radius);
  --ag-checkbox-checked-color: var(--ag-foreground-color);
  --ag-checkbox-unchecked-color: var(--ag-foreground-color);
  --ag-checkbox-indeterminate-color: var(--ag-checkbox-unchecked-color);
  --ag-toggle-button-off-border-color: var(--ag-checkbox-unchecked-color);
  --ag-toggle-button-off-background-color: var(--ag-checkbox-unchecked-color);
  --ag-toggle-button-on-border-color: var(--ag-checkbox-checked-color);
  --ag-toggle-button-on-background-color: var(--ag-checkbox-checked-color);
  --ag-toggle-button-switch-background-color: var(--ag-background-color);
  --ag-toggle-button-switch-border-color: var(--ag-toggle-button-off-border-color);
  --ag-toggle-button-border-width: 1px;
  --ag-toggle-button-height: var(--ag-icon-size);
  --ag-toggle-button-width: calc(var(--ag-toggle-button-height) * 2);
  --ag-input-focus-box-shadow: none;
  --ag-input-focus-border-color: none;
  --ag-minichart-selected-chart-color: var(--ag-checkbox-checked-color);
  --ag-minichart-selected-page-color: var(--ag-checkbox-checked-color);
  --ag-grid-size: 4px;
  --ag-icon-size: 12px;
  --ag-icon-font-weight: normal;
  --ag-icon-font-color: var(--ag-foreground-color);
  --ag-icon-image-display: block;
  --ag-widget-container-horizontal-padding: calc(var(--ag-grid-size) * 1.5);
  --ag-widget-container-vertical-padding: calc(var(--ag-grid-size) * 1.5);
  --ag-widget-horizontal-spacing: calc(var(--ag-grid-size) * 2);
  --ag-widget-vertical-spacing: var(--ag-grid-size);
  --ag-cell-horizontal-padding: calc(var(--ag-grid-size) * 3);
  --ag-cell-widget-spacing: var(--ag-cell-horizontal-padding);
  --ag-row-height: calc(var(--ag-grid-size) * 6 + 1px);
  --ag-header-height: var(--ag-row-height);
  --ag-list-item-height: calc(var(--ag-grid-size) * 5);
  --ag-column-select-indent-size: calc(var(--ag-grid-size) + var(--ag-icon-size));
  --ag-set-filter-indent-size: calc(var(--ag-grid-size) + var(--ag-icon-size));
  --ag-advanced-filter-builder-indent-size: calc(var(--ag-grid-size) * 2 + var(--ag-icon-size));
  --ag-row-group-indent-size: calc(var(--ag-cell-widget-spacing) + var(--ag-icon-size));
  --ag-filter-tool-panel-group-indent: 16px;
  --ag-tab-min-width: 220px;
  --ag-chart-menu-panel-width: var(--ag-tab-min-width);
  --ag-menu-min-width: 181px;
  --ag-side-bar-panel-width: 200px;
  --ag-font-family: "Helvetica Neue", sans-serif;
  --ag-font-size: 14px;
  --ag-card-radius: var(--ag-border-radius);
  --ag-card-shadow: none;
  --ag-popup-shadow: 5px 5px 10px rgba(0, 0, 0, 0.3);
  --ag-advanced-filter-join-pill-color: #f08e8d;
  --ag-advanced-filter-column-pill-color: #a6e194;
  --ag-advanced-filter-option-pill-color: #f3c08b;
  --ag-advanced-filter-value-pill-color: #85c0e4;
}

.ag-root-wrapper,
.ag-sticky-top,
.ag-sticky-bottom,
.ag-dnd-ghost {
  background-color: var(--ag-background-color);
}

.ag-sticky-bottom {
  border-top: var(--ag-row-border-style) var(--ag-row-border-color) var(--ag-row-border-width);
}

.ag-root-wrapper,
.ag-popup {
  --ag-indentation-level: 0;
}

[class*=ag-theme-] {
  -webkit-font-smoothing: antialiased;
  font-family: var(--ag-font-family);
  font-size: var(--ag-font-size);
  line-height: normal;
  color: var(--ag-foreground-color);
}

ag-grid,
ag-grid-angular,
ag-grid-ng2,
ag-grid-polymer,
ag-grid-aurelia {
  display: block;
}

.ag-aria-description-container {
  z-index: 9999;
  border: 0px;
  clip: rect(1px, 1px, 1px, 1px);
  height: 1px;
  width: 1px;
  position: absolute;
  overflow: hidden;
  padding: 0px;
  white-space: nowrap;
}

.ag-hidden {
  display: none !important;
}

.ag-invisible {
  visibility: hidden !important;
}

.ag-drag-handle {
  cursor: grab;
}

.ag-column-drop-wrapper {
  display: flex;
}

.ag-column-drop-horizontal-half-width {
  display: inline-block;
  width: 50% !important;
}

.ag-unselectable {
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.ag-selectable {
  -moz-user-select: text;
  -webkit-user-select: text;
  -ms-user-select: text;
  user-select: text;
}

.ag-tab {
  position: relative;
}

.ag-tab-guard {
  position: absolute;
  width: 0;
  height: 0;
  display: block;
}

.ag-virtual-list-viewport .ag-tab-guard {
  position: sticky;
}

.ag-tab-guard-top {
  top: 1px;
}

.ag-tab-guard-bottom {
  bottom: 1px;
}

.ag-select-agg-func-popup {
  position: absolute;
}

.ag-input-wrapper,
.ag-picker-field-wrapper {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  line-height: normal;
  position: relative;
}

.ag-shake-left-to-right {
  animation-direction: alternate;
  animation-duration: 0.2s;
  animation-iteration-count: infinite;
  animation-name: ag-shake-left-to-right;
}

@keyframes ag-shake-left-to-right {
  from {
    padding-left: 6px;
    padding-right: 2px;
  }
  to {
    padding-left: 2px;
    padding-right: 6px;
  }
}
.ag-root-wrapper {
  cursor: default;
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  white-space: normal;
}

.ag-root-wrapper.ag-layout-normal {
  height: 100%;
}

.ag-watermark {
  position: absolute;
  bottom: 20px;
  right: 25px;
  opacity: 0.7;
  transition: opacity 1s ease-out 3s;
  color: #9b9b9b;
}

.ag-watermark::before {
  content: "";
  background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjA5IiBoZWlnaHQ9IjM2IiB2aWV3Qm94PSIwIDAgMjA5IDM2IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNMTkyLjk5MyAyMy42NTgyVjE1LjcxMTdIMTc5LjQ1MkwxNzEuNTA1IDIzLjY1ODJIMTkyLjk5M1oiIGZpbGw9IiM5QjlCOUIiLz4KPHBhdGggZD0iTTIwOC4yNSAzLjk1MDgxSDE5MS4yNzZMMTgzLjI2NiAxMS44OTczSDIwOC4yNVYzLjk1MDgxWiIgZmlsbD0iIzlCOUI5QiIvPgo8cGF0aCBkPSJNMTYzLjYyMiAzMS42MDQ4TDE2Ny42OTEgMjcuNTM2MUgxODEuNDIzVjM1LjQ4MjdIMTYzLjYyMlYzMS42MDQ4WiIgZmlsbD0iIzlCOUI5QiIvPgo8cGF0aCBkPSJNMTY2LjYxIDE5Ljc4MDNIMTc1LjM4M0wxODMuMzkzIDExLjgzMzdIMTY2LjYxVjE5Ljc4MDNaIiBmaWxsPSIjOUI5QjlCIi8+CjxwYXRoIGQ9Ik0xNTcuMDExIDMxLjYwNDdIMTYzLjYyMkwxNzEuNTA1IDIzLjY1ODJIMTU3LjAxMVYzMS42MDQ3WiIgZmlsbD0iIzlCOUI5QiIvPgo8cGF0aCBkPSJNMTkxLjI3NiAzLjk1MDgxTDE4Ny4yMDggOC4wMTk0MUgxNjEuMjdWMC4wNzI4NzZIMTkxLjI3NlYzLjk1MDgxWiIgZmlsbD0iIzlCOUI5QiIvPgo8cGF0aCBkPSJNMjAuODM5MSAzMC4yMDYxSDguMzc4OTJMNi4yMTc0NSAzNS41NDYySDAuNzUwMjQ0TDEyLjI1NjggOC41OTE1NUgxNy4wMjQ3TDI4LjUzMTMgMzUuNTQ2MkgyMy4wMDA1TDIwLjgzOTEgMzAuMjA2MVpNMTkuMTIyNyAyNS45NDY4TDE0LjYwOSAxNC45NDg4TDEwLjA5NTQgMjUuOTQ2OEgxOS4xMjI3WiIgZmlsbD0iIzlCOUI5QiIvPgo8cGF0aCBkPSJNMTA0LjQzNyAxOC41MDg5QzEwNi4wMjYgMTYuMTU2NyAxMTAuMDMxIDE1LjkwMjQgMTExLjY4NCAxNS45MDI0VjIwLjQ3OTZDMTA5LjY1IDIwLjQ3OTYgMTA3LjYxNSAyMC41NDMyIDEwNi40MDcgMjEuNDMzMkMxMDUuMiAyMi4zMjMyIDEwNC41NjQgMjMuNTMxMSAxMDQuNTY0IDI0Ljk5MzJWMzUuNTQ2Mkg5OS42MDUxVjE1LjkwMjRIMTA0LjM3M0wxMDQuNDM3IDE4LjUwODlaIiBmaWxsPSIjOUI5QjlCIi8+CjxwYXRoIGQ9Ik0xMTkuMzc2IDE1LjkwMjRIMTE0LjQxOFYzNS41NDYySDExOS4zNzZWMTUuOTAyNFoiIGZpbGw9IiM5QjlCOUIiLz4KPHBhdGggZD0iTTExOS4zNzYgNy4xMjkzOUgxMTQuNDE4VjEyLjk3OEgxMTkuMzc2VjcuMTI5MzlaIiBmaWxsPSIjOUI5QjlCIi8+CjxwYXRoIGQ9Ik0xNDMuOTc5IDcuMTI5MzlWMzUuNTQ2MkgxMzkuMjExTDEzOS4wODQgMzIuNTU4M0MxMzguMzg0IDMzLjU3NTUgMTM3LjQ5NCAzNC40MDE5IDEzNi40MTQgMzUuMDM3NkMxMzUuMzMzIDM1LjYwOTggMTMzLjk5OCAzNS45Mjc2IDEzMi40NzIgMzUuOTI3NkMxMzEuMTM3IDM1LjkyNzYgMTI5Ljg2NiAzNS42NzMzIDEyOC43ODUgMzUuMjI4M0MxMjcuNjQxIDM0LjcxOTcgMTI2LjYyMyAzNC4wODQgMTI1Ljc5NyAzMy4xOTRDMTI0Ljk3MSAzMi4zMDQgMTI0LjI3MSAzMS4yMjMzIDEyMy44MjYgMzAuMDE1NEMxMjMuMzE4IDI4LjgwNzUgMTIzLjEyNyAyNy40MDkgMTIzLjEyNyAyNS44ODMyQzEyMy4xMjcgMjQuMzU3NSAxMjMuMzgxIDIyLjk1ODkgMTIzLjgyNiAyMS42ODc0QzEyNC4zMzUgMjAuNDE2IDEyNC45NzEgMTkuMzM1MyAxMjUuNzk3IDE4LjQ0NTNDMTI2LjYyMyAxNy41NTUyIDEyNy42NDEgMTYuODU2IDEyOC43ODUgMTYuMzQ3NEMxMjkuOTI5IDE1LjgzODggMTMxLjEzNyAxNS41ODQ1IDEzMi40NzIgMTUuNTg0NUMxMzMuOTk4IDE1LjU4NDUgMTM1LjI2OSAxNS44Mzg4IDEzNi4zNSAxNi40MTA5QzEzNy40MzEgMTYuOTgzMSAxMzguMzIxIDE3Ljc0NTkgMTM5LjAyIDE4LjgyNjdWNy4xOTI5NUgxNDMuOTc5VjcuMTI5MzlaTTEzMy41NTMgMzEuNjY4M0MxMzUuMjA2IDMxLjY2ODMgMTM2LjQ3NyAzMS4wOTYyIDEzNy40OTQgMzAuMDE1NEMxMzguNTExIDI4LjkzNDcgMTM5LjAyIDI3LjQ3MjUgMTM5LjAyIDI1LjY5MjVDMTM5LjAyIDIzLjkxMjUgMTM4LjUxMSAyMi41MTM5IDEzNy40OTQgMjEuMzY5NkMxMzYuNDc3IDIwLjI4ODggMTM1LjIwNiAxOS43MTY3IDEzMy41NTMgMTkuNzE2N0MxMzEuOTYzIDE5LjcxNjcgMTMwLjYyOCAyMC4yODg4IDEyOS42NzUgMjEuMzY5NkMxMjguNjU4IDIyLjQ1MDMgMTI4LjE0OSAyMy45MTI1IDEyOC4xNDkgMjUuNjkyNUMxMjguMTQ5IDI3LjQ3MjUgMTI4LjY1OCAyOC44NzExIDEyOS42NzUgMjkuOTUxOEMxMzAuNjkyIDMxLjA5NjEgMTMxLjk2MyAzMS42NjgzIDEzMy41NTMgMzEuNjY4M1oiIGZpbGw9IiM5QjlCOUIiLz4KPHBhdGggZD0iTTU3LjIwMjQgMjAuMzUyNUg0NC45MzNWMjQuNjExOEg1MS45MjU5QzUxLjczNTIgMjYuNzczMyA1MC45MDg4IDI4LjQyNjEgNDkuNTEwMiAyOS43NjExQzQ4LjExMTYgMzEuMDMyNiA0Ni4zMzE1IDMxLjY2ODMgNDQuMDQyOSAzMS42NjgzQzQyLjc3MTUgMzEuNjY4MyA0MS41NjM2IDMxLjQxNCA0MC41NDY1IDMwLjk2OUMzOS40NjU3IDMwLjUyNCAzOC41NzU3IDI5Ljg4ODMgMzcuODEyOSAyOC45OTgzQzM3LjA1IDI4LjE3MTggMzYuNDc3OCAyNy4xNTQ3IDM2LjAzMjggMjUuOTQ2OEMzNS41ODc4IDI0LjczODkgMzUuMzk3MSAyMy40Njc1IDM1LjM5NzEgMjIuMDA1M0MzNS4zOTcxIDIwLjU0MzIgMzUuNTg3OCAxOS4yNzE3IDM2LjAzMjggMTguMDYzOEMzNi40MTQzIDE2Ljg1NiAzNy4wNSAxNS45MDI0IDM3LjgxMjkgMTUuMDEyNEMzOC41NzU3IDE0LjE4NTkgMzkuNDY1NyAxMy41NTAyIDQwLjU0NjUgMTMuMDQxNkM0MS42MjcyIDEyLjU5NjYgNDIuNzcxNSAxMi4zNDIzIDQ0LjEwNjUgMTIuMzQyM0M0Ni43NzY2IDEyLjM0MjMgNDguODEwOSAxMi45NzggNTAuMjA5NSAxNC4yNDk1TDUzLjUxNTIgMTAuOTQzOEM1MS4wMzU5IDkuMDM2NTkgNDcuODU3MyA4LjAxOTQxIDQ0LjEwNjUgOC4wMTk0MUM0Mi4wMDg2IDguMDE5NDEgNDAuMTAxNSA4LjMzNzI5IDM4LjM4NSA5LjAzNjU5QzM2LjY2ODYgOS43MzU4OCAzNS4yMDY0IDEwLjYyNTkgMzMuOTk4NSAxMS44MzM3QzMyLjc5MDYgMTMuMDQxNiAzMS44MzcxIDE0LjUwMzggMzEuMjAxNCAxNi4yMjAzQzMwLjU2NTYgMTcuOTM2NyAzMC4yNDc4IDE5Ljg0MzggMzAuMjQ3OCAyMS44NzgyQzMwLjI0NzggMjMuOTEyNSAzMC41NjU2IDI1LjgxOTcgMzEuMjY0OSAyNy41MzYxQzMxLjk2NDIgMjkuMjUyNiAzMi44NTQyIDMwLjcxNDcgMzQuMDYyMSAzMS45MjI2QzM1LjI3IDMzLjEzMDUgMzYuNzMyMSAzNC4wODQxIDM4LjQ0ODYgMzQuNzE5OEM0MC4xNjUgMzUuNDE5MSA0Mi4wNzIyIDM1LjczNyA0NC4xMDY1IDM1LjczN0M0Ni4xNDA4IDM1LjczNyA0Ny45ODQ0IDM1LjQxOTEgNDkuNjM3MyAzNC43MTk4QzUxLjI5MDIgMzQuMDIwNSA1Mi42ODg4IDMzLjEzMDUgNTMuODMzMSAzMS45MjI2QzU0Ljk3NzQgMzAuNzE0NyA1NS44Njc0IDI5LjI1MjYgNTYuNTAzMSAyNy41MzYxQzU3LjEzODggMjUuODE5NyA1Ny40NTY3IDIzLjkxMjUgNTcuNDU2NyAyMS44NzgyVjIxLjA1MTdDNTcuMjY2IDIwLjkyNDYgNTcuMjAyNCAyMC42MDY3IDU3LjIwMjQgMjAuMzUyNVoiIGZpbGw9IiM5QjlCOUIiLz4KPHBhdGggZD0iTTk1Ljk4MTUgMjAuMzUyNUg4My43MTIxVjI0LjYxMThIOTAuNzA1QzkwLjUxNDMgMjYuNzczMyA4OS42ODc5IDI4LjQyNjEgODguMjg5MyAyOS43NjExQzg2Ljg5MDcgMzEuMDMyNiA4NS4xMTA2IDMxLjY2ODMgODIuODIyIDMxLjY2ODNDODEuNTUwNiAzMS42NjgzIDgwLjM0MjcgMzEuNDE0IDc5LjMyNTYgMzAuOTY5Qzc4LjI0NDggMzAuNTI0IDc3LjM1NDggMjkuODg4MyA3Ni41OTIgMjguOTk4M0M3NS44MjkxIDI4LjE3MTggNzUuMjU3IDI3LjE1NDcgNzQuODExOSAyNS45NDY4Qzc0LjM2NjkgMjQuNzM4OSA3NC4xNzYyIDIzLjQ2NzUgNzQuMTc2MiAyMi4wMDUzQzc0LjE3NjIgMjAuNTQzMiA3NC4zNjY5IDE5LjI3MTcgNzQuODExOSAxOC4wNjM4Qzc1LjE5MzQgMTYuODU2IDc1LjgyOTEgMTUuOTAyNCA3Ni41OTIgMTUuMDEyNEM3Ny4zNTQ4IDE0LjE4NTkgNzguMjQ0OCAxMy41NTAyIDc5LjMyNTYgMTMuMDQxNkM4MC40MDYzIDEyLjU5NjYgODEuNTUwNiAxMi4zNDIzIDgyLjg4NTYgMTIuMzQyM0M4NS41NTU3IDEyLjM0MjMgODcuNTkgMTIuOTc4IDg4Ljk4ODYgMTQuMjQ5NUw5Mi4yOTQzIDEwLjk0MzhDODkuODE1IDkuMDM2NTkgODYuNjM2NCA4LjAxOTQxIDgyLjg4NTYgOC4wMTk0MUM4MC43ODc4IDguMDE5NDEgNzguODgwNiA4LjMzNzI5IDc3LjE2NDEgOS4wMzY1OUM3NS40NDc3IDkuNzM1ODggNzMuOTg1NSAxMC42MjU5IDcyLjc3NzYgMTEuODMzN0M3MS41Njk4IDEzLjA0MTYgNzAuNjE2MiAxNC41MDM4IDY5Ljk4MDUgMTYuMjIwM0M2OS4zNDQ3IDE3LjkzNjcgNjkuMDI2OSAxOS44NDM4IDY5LjAyNjkgMjEuODc4MkM2OS4wMjY5IDIzLjkxMjUgNjkuMzQ0NyAyNS44MTk3IDcwLjA0NCAyNy41MzYxQzcwLjc0MzMgMjkuMjUyNiA3MS42MzM0IDMwLjcxNDcgNzIuODQxMiAzMS45MjI2Qzc0LjA0OTEgMzMuMTMwNSA3NS41MTEyIDM0LjA4NDEgNzcuMjI3NyAzNC43MTk4Qzc4Ljk0NDEgMzUuNDE5MSA4MC44NTEzIDM1LjczNyA4Mi44ODU2IDM1LjczN0M4NC45MiAzNS43MzcgODYuNzYzNiAzNS40MTkxIDg4LjQxNjQgMzQuNzE5OEM5MC4wNjkzIDM0LjAyMDUgOTEuNDY3OSAzMy4xMzA1IDkyLjYxMjIgMzEuOTIyNkM5My43NTY1IDMwLjcxNDcgOTQuNjQ2NSAyOS4yNTI2IDk1LjI4MjIgMjcuNTM2MUM5NS45MTggMjUuODE5NyA5Ni4yMzU4IDIzLjkxMjUgOTYuMjM1OCAyMS44NzgyVjIxLjA1MTdDOTYuMDQ1MSAyMC45MjQ2IDk1Ljk4MTUgMjAuNjA2NyA5NS45ODE1IDIwLjM1MjVaIiBmaWxsPSIjOUI5QjlCIi8+Cjwvc3ZnPgo=);
  background-repeat: no-repeat;
  background-size: 170px 40px;
  display: block;
  height: 40px;
  width: 170px;
}

.ag-watermark-text {
  opacity: 0.5;
  font-weight: bold;
  font-family: Impact, sans-serif;
  font-size: 19px;
  padding-left: 0.7rem;
}

.ag-root-wrapper-body {
  display: flex;
  flex-direction: row;
}

.ag-root-wrapper-body.ag-layout-normal {
  flex: 1 1 auto;
  height: 0;
  min-height: 0;
}

.ag-root {
  position: relative;
  display: flex;
  flex-direction: column;
}

.ag-root.ag-layout-normal, .ag-root.ag-layout-auto-height {
  overflow: hidden;
  flex: 1 1 auto;
  width: 0;
}

.ag-root.ag-layout-normal {
  height: 100%;
}

.ag-header-viewport,
.ag-floating-top-viewport,
.ag-body-viewport,
.ag-center-cols-viewport,
.ag-floating-bottom-viewport,
.ag-body-horizontal-scroll-viewport,
.ag-body-vertical-scroll-viewport,
.ag-virtual-list-viewport,
.ag-sticky-top-viewport,
.ag-sticky-bottom-viewport {
  position: relative;
  height: 100%;
  min-width: 0px;
  overflow: hidden;
  flex: 1 1 auto;
}

.ag-body-viewport,
.ag-center-cols-viewport,
.ag-header-viewport,
.ag-floating-top-viewport,
.ag-floating-bottom-viewport,
.ag-sticky-top-viewport,
.ag-sticky-bottom-viewport {
  overflow-x: auto;
  -ms-overflow-style: none !important;
  scrollbar-width: none !important;
}

.ag-body-viewport::-webkit-scrollbar,
.ag-center-cols-viewport::-webkit-scrollbar,
.ag-header-viewport::-webkit-scrollbar,
.ag-floating-top-viewport::-webkit-scrollbar,
.ag-floating-bottom-viewport::-webkit-scrollbar,
.ag-sticky-top-viewport::-webkit-scrollbar,
.ag-sticky-bottom-viewport::-webkit-scrollbar {
  display: none !important;
}

.ag-body-viewport {
  display: flex;
  overflow-x: hidden;
}

.ag-body-viewport.ag-layout-normal {
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.ag-sticky-top-container,
.ag-sticky-bottom-container {
  min-height: 1px;
}

.ag-center-cols-viewport {
  min-height: 100%;
  width: 100%;
}

.ag-body-horizontal-scroll-viewport {
  overflow-x: scroll;
}

.ag-body-vertical-scroll-viewport {
  overflow-y: scroll;
}

.ag-virtual-list-viewport {
  overflow: auto;
  width: 100%;
}

.ag-header-container,
.ag-floating-top-container,
.ag-body-container,
.ag-pinned-right-cols-container,
.ag-center-cols-container,
.ag-pinned-left-cols-container,
.ag-floating-bottom-container,
.ag-body-horizontal-scroll-container,
.ag-body-vertical-scroll-container,
.ag-full-width-container,
.ag-floating-bottom-full-width-container,
.ag-virtual-list-container,
.ag-sticky-top-container,
.ag-sticky-bottom-container {
  position: relative;
}

.ag-header-container,
.ag-floating-top-container,
.ag-floating-bottom-container,
.ag-sticky-top-container,
.ag-sticky-bottom-container {
  height: 100%;
  white-space: nowrap;
}

.ag-center-cols-container {
  display: block;
}

.ag-pinned-right-cols-container {
  display: block;
}

.ag-body-horizontal-scroll-container {
  height: 100%;
}

.ag-body-vertical-scroll-container {
  width: 100%;
}

.ag-full-width-container,
.ag-floating-top-full-width-container,
.ag-floating-bottom-full-width-container,
.ag-sticky-top-full-width-container,
.ag-sticky-bottom-full-width-container {
  position: absolute;
  top: 0px;
  pointer-events: none;
}

.ag-ltr .ag-full-width-container,
.ag-ltr .ag-floating-top-full-width-container,
.ag-ltr .ag-floating-bottom-full-width-container,
.ag-ltr .ag-sticky-top-full-width-container,
.ag-ltr .ag-sticky-bottom-full-width-container {
  left: 0;
}

.ag-rtl .ag-full-width-container,
.ag-rtl .ag-floating-top-full-width-container,
.ag-rtl .ag-floating-bottom-full-width-container,
.ag-rtl .ag-sticky-top-full-width-container,
.ag-rtl .ag-sticky-bottom-full-width-container {
  right: 0;
}

.ag-full-width-container {
  width: 100%;
}

.ag-floating-bottom-full-width-container,
.ag-floating-top-full-width-container {
  display: inline-block;
  overflow: hidden;
  height: 100%;
  width: 100%;
}

.ag-virtual-list-container {
  overflow: hidden;
}

.ag-body {
  position: relative;
  display: flex;
  flex: 1 1 auto;
  flex-direction: row !important;
  min-height: 0;
}

.ag-body-horizontal-scroll,
.ag-body-vertical-scroll {
  min-height: 0;
  min-width: 0;
  display: flex;
  position: relative;
}

.ag-body-horizontal-scroll.ag-scrollbar-invisible,
.ag-body-vertical-scroll.ag-scrollbar-invisible {
  position: absolute;
  bottom: 0;
}

.ag-body-horizontal-scroll.ag-scrollbar-invisible.ag-apple-scrollbar,
.ag-body-vertical-scroll.ag-scrollbar-invisible.ag-apple-scrollbar {
  opacity: 0;
  transition: opacity 400ms;
  visibility: hidden;
}

.ag-body-horizontal-scroll.ag-scrollbar-invisible.ag-apple-scrollbar.ag-scrollbar-scrolling, .ag-body-horizontal-scroll.ag-scrollbar-invisible.ag-apple-scrollbar.ag-scrollbar-active,
.ag-body-vertical-scroll.ag-scrollbar-invisible.ag-apple-scrollbar.ag-scrollbar-scrolling,
.ag-body-vertical-scroll.ag-scrollbar-invisible.ag-apple-scrollbar.ag-scrollbar-active {
  visibility: visible;
  opacity: 1;
}

.ag-body-horizontal-scroll {
  width: 100%;
}

.ag-body-horizontal-scroll.ag-scrollbar-invisible {
  left: 0;
  right: 0;
}

.ag-body-vertical-scroll {
  height: 100%;
}

.ag-body-vertical-scroll.ag-scrollbar-invisible {
  top: 0;
  z-index: 10;
}

.ag-ltr .ag-body-vertical-scroll.ag-scrollbar-invisible {
  right: 0;
}

.ag-rtl .ag-body-vertical-scroll.ag-scrollbar-invisible {
  left: 0;
}

.ag-force-vertical-scroll {
  overflow-y: scroll !important;
}

.ag-horizontal-left-spacer,
.ag-horizontal-right-spacer {
  height: 100%;
  min-width: 0;
  overflow-x: scroll;
}

.ag-horizontal-left-spacer.ag-scroller-corner,
.ag-horizontal-right-spacer.ag-scroller-corner {
  overflow-x: hidden;
}

.ag-header,
.ag-pinned-left-header,
.ag-pinned-right-header {
  display: inline-block;
  overflow: hidden;
  position: relative;
}

.ag-header-cell-sortable .ag-header-cell-label {
  cursor: pointer;
}

.ag-header {
  display: flex;
  width: 100%;
  white-space: nowrap;
}

.ag-pinned-left-header {
  height: 100%;
}

.ag-pinned-right-header {
  height: 100%;
}

.ag-header-row {
  position: absolute;
}

.ag-header-row:not(.ag-header-row-column-group) {
  overflow: hidden;
}

.ag-header.ag-header-allow-overflow .ag-header-row {
  overflow: visible;
}

.ag-header-cell {
  display: inline-flex;
  align-items: center;
  position: absolute;
  height: 100%;
  overflow: hidden;
}

.ag-header-cell.ag-header-active .ag-header-cell-menu-button,
.ag-header-cell-filter-button {
  opacity: 1;
}

.ag-header-cell-menu-button:not(.ag-header-menu-always-show) {
  transition: opacity 0.2s;
  opacity: 0;
}

.ag-header-group-cell-label,
.ag-header-cell-label {
  display: flex;
  flex: 1 1 auto;
  align-self: stretch;
  align-items: center;
}

.ag-header-cell-label {
  overflow: hidden;
  text-overflow: ellipsis;
}

.ag-header-group-cell-label.ag-sticky-label {
  position: sticky;
  flex: none;
  max-width: 100%;
}

.ag-header-group-text {
  overflow: hidden;
  text-overflow: ellipsis;
}

.ag-header-cell-text {
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
}

.ag-header-group-cell .ag-header-cell-comp-wrapper {
  display: flex;
}

.ag-header-cell:not(.ag-header-cell-auto-height) .ag-header-cell-comp-wrapper {
  height: 100%;
  display: flex;
  align-items: center;
}

.ag-header-cell-comp-wrapper {
  width: 100%;
}

.ag-header-cell-wrap-text .ag-header-cell-comp-wrapper {
  white-space: normal;
}

.ag-right-aligned-header .ag-header-cell-label {
  flex-direction: row-reverse;
}

.ag-header-cell-resize {
  position: absolute;
  z-index: 2;
  height: 100%;
  width: 8px;
  top: 0;
  cursor: ew-resize;
}

.ag-ltr .ag-header-cell-resize {
  right: -4px;
}

.ag-rtl .ag-header-cell-resize {
  left: -4px;
}

.ag-pinned-left-header .ag-header-cell-resize {
  right: -4px;
}

.ag-pinned-right-header .ag-header-cell-resize {
  left: -4px;
}

.ag-header-select-all {
  display: flex;
}

.ag-header-cell-menu-button,
.ag-header-cell-filter-button,
.ag-side-button-button,
.ag-panel-title-bar-button,
.ag-floating-filter-button-button {
  cursor: pointer;
}

.ag-column-moving .ag-cell {
  transition: left 0.2s;
}

.ag-column-moving .ag-header-cell {
  transition: left 0.2s;
}

.ag-column-moving .ag-header-group-cell {
  transition: left 0.2s, width 0.2s;
}

.ag-column-panel {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  flex: 1 1 auto;
}

.ag-column-select {
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  flex: 3 1 0px;
}

.ag-column-select-header {
  position: relative;
  display: flex;
  flex: none;
}

.ag-column-select-header-icon {
  position: relative;
}

.ag-column-select-header-filter-wrapper {
  flex: 1 1 auto;
}

.ag-column-select-header-filter {
  width: 100%;
}

.ag-column-select-list {
  flex: 1 1 0px;
  overflow: hidden;
}

.ag-column-drop {
  position: relative;
  display: inline-flex;
  align-items: center;
  overflow: auto;
  width: 100%;
}

.ag-column-drop-list {
  display: flex;
  align-items: center;
}

.ag-column-drop-cell {
  position: relative;
  display: flex;
  align-items: center;
}

.ag-column-drop-cell-text {
  overflow: hidden;
  flex: 1 1 auto;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ag-column-drop-vertical {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  align-items: stretch;
  flex: 1 1 0px;
}

.ag-column-drop-vertical-title-bar {
  display: flex;
  align-items: center;
  flex: none;
}

.ag-column-drop-vertical-list {
  position: relative;
  align-items: stretch;
  flex-grow: 1;
  flex-direction: column;
  overflow-x: auto;
}

.ag-column-drop-vertical-list > * {
  flex: none;
}

.ag-column-drop-empty .ag-column-drop-vertical-list {
  overflow: hidden;
}

.ag-column-drop-vertical-empty-message {
  display: block;
}

.ag-column-drop.ag-column-drop-horizontal {
  white-space: nowrap;
  overflow: hidden;
}

.ag-column-drop-cell-button {
  cursor: pointer;
}

.ag-filter-toolpanel {
  flex: 1 1 0px;
  min-width: 0;
}

.ag-filter-toolpanel-header {
  position: relative;
}

.ag-filter-toolpanel-header,
.ag-filter-toolpanel-search {
  display: flex;
  align-items: center;
}

.ag-filter-toolpanel-header > *,
.ag-filter-toolpanel-search > * {
  display: flex;
  align-items: center;
}

.ag-filter-apply-panel {
  display: flex;
  justify-content: flex-end;
  overflow: hidden;
}

.ag-row-animation .ag-row {
  transition: transform 0.4s, top 0.4s, opacity 0.2s;
}

.ag-row-animation .ag-row.ag-after-created {
  transition: transform 0.4s, top 0.4s, height 0.4s, opacity 0.2s;
}

.ag-row-no-animation .ag-row {
  transition: none;
}

.ag-row {
  white-space: nowrap;
  width: 100%;
}

.ag-row-loading {
  display: flex;
  align-items: center;
}

.ag-row-position-absolute {
  position: absolute;
}

.ag-row-position-relative {
  position: relative;
}

.ag-full-width-row {
  overflow: hidden;
  pointer-events: all;
}

.ag-row-inline-editing {
  z-index: 1;
}

.ag-row-dragging {
  z-index: 2;
}

.ag-stub-cell {
  display: flex;
  align-items: center;
}

.ag-cell {
  display: inline-block;
  position: absolute;
  white-space: nowrap;
  height: 100%;
}

.ag-cell-value {
  flex: 1 1 auto;
}

.ag-cell-value,
.ag-group-value {
  overflow: hidden;
  text-overflow: ellipsis;
}

.ag-cell-wrap-text {
  white-space: normal;
  word-break: break-word;
}

.ag-cell-wrapper {
  display: flex;
  align-items: center;
}

.ag-cell-wrapper.ag-row-group {
  align-items: flex-start;
}

.ag-sparkline-wrapper {
  position: absolute;
  height: 100%;
  width: 100%;
  left: 0;
  top: 0;
}

.ag-full-width-row .ag-cell-wrapper.ag-row-group {
  height: 100%;
  align-items: center;
}

.ag-cell-inline-editing {
  z-index: 1;
}

.ag-cell-inline-editing .ag-cell-wrapper,
.ag-cell-inline-editing .ag-cell-edit-wrapper,
.ag-cell-inline-editing .ag-cell-editor,
.ag-cell-inline-editing .ag-cell-editor .ag-wrapper,
.ag-cell-inline-editing .ag-cell-editor input {
  height: 100%;
  width: 100%;
  line-height: normal;
}

.ag-cell .ag-icon {
  display: inline-block;
  vertical-align: middle;
}

.ag-set-filter-item {
  display: flex;
  align-items: center;
  height: 100%;
}

.ag-set-filter-item-checkbox {
  display: flex;
  width: 100%;
  height: 100%;
}

.ag-set-filter-group-icons {
  display: block;
}

.ag-set-filter-group-icons > * {
  cursor: pointer;
}

.ag-filter-body-wrapper {
  display: flex;
  flex-direction: column;
}

.ag-filter-filter {
  flex: 1 1 0px;
}

.ag-filter-condition {
  display: flex;
  justify-content: center;
}

.ag-floating-filter-body {
  position: relative;
  display: flex;
  flex: 1 1 auto;
  height: 100%;
}

.ag-floating-filter-full-body {
  display: flex;
  flex: 1 1 auto;
  height: 100%;
  width: 100%;
  align-items: center;
  overflow: hidden;
}

.ag-floating-filter-full-body > div {
  flex: 1 1 auto;
}

.ag-floating-filter-input {
  align-items: center;
  display: flex;
  width: 100%;
}

.ag-floating-filter-input > * {
  flex: 1 1 auto;
}

.ag-floating-filter-button {
  display: flex;
  flex: none;
}

.ag-set-floating-filter-input input[disabled] {
  pointer-events: none;
}

.ag-dnd-ghost {
  position: absolute;
  display: inline-flex;
  align-items: center;
  cursor: move;
  white-space: nowrap;
  z-index: 9999;
}

.ag-overlay {
  height: 100%;
  left: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 2;
}

.ag-overlay-panel {
  display: flex;
  height: 100%;
  width: 100%;
}

.ag-overlay-wrapper {
  display: flex;
  flex: none;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.ag-overlay-loading-wrapper {
  pointer-events: all;
}

.ag-popup-child {
  z-index: 5;
  top: 0;
}

.ag-popup-editor {
  position: absolute;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.ag-large-text-input {
  display: block;
}

.ag-virtual-list-item {
  position: absolute;
  width: 100%;
}

.ag-floating-top {
  overflow: hidden;
  white-space: nowrap;
  width: 100%;
  position: relative;
  display: flex;
}

.ag-pinned-left-floating-top {
  display: inline-block;
  overflow: hidden;
  position: relative;
  min-width: 0px;
}

.ag-pinned-right-floating-top {
  display: inline-block;
  overflow: hidden;
  position: relative;
  min-width: 0px;
}

.ag-floating-bottom {
  overflow: hidden;
  white-space: nowrap;
  width: 100%;
  position: relative;
  display: flex;
}

.ag-pinned-left-floating-bottom {
  display: inline-block;
  overflow: hidden;
  position: relative;
  min-width: 0px;
}

.ag-pinned-right-floating-bottom {
  display: inline-block;
  overflow: hidden;
  position: relative;
  min-width: 0px;
}

.ag-sticky-top,
.ag-sticky-bottom {
  position: absolute;
  display: flex;
  width: 100%;
  overflow: hidden;
  height: 0px;
}

.ag-sticky-bottom {
  box-sizing: content-box !important;
}

.ag-pinned-left-sticky-top,
.ag-pinned-right-sticky-top {
  position: relative;
  height: 100%;
  overflow: hidden;
}

.ag-sticky-top-full-width-container,
.ag-sticky-bottom-full-width-container {
  overflow: hidden;
  width: 100%;
  height: 100%;
}

.ag-dialog,
.ag-panel {
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
}

.ag-panel-title-bar {
  display: flex;
  flex: none;
  align-items: center;
  cursor: default;
}

.ag-panel-title-bar-title {
  flex: 1 1 auto;
}

.ag-panel-title-bar-buttons {
  display: flex;
}

.ag-panel-title-bar-button {
  cursor: pointer;
}

.ag-panel-content-wrapper {
  display: flex;
  flex: 1 1 auto;
  position: relative;
  overflow: hidden;
}

.ag-dialog {
  position: absolute;
}

.ag-resizer {
  position: absolute;
  pointer-events: none;
  z-index: 1;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.ag-resizer.ag-resizer-topLeft {
  top: 0;
  left: 0;
  height: 5px;
  width: 5px;
  cursor: nwse-resize;
}

.ag-resizer.ag-resizer-top {
  top: 0;
  left: 5px;
  right: 5px;
  height: 5px;
  cursor: ns-resize;
}

.ag-resizer.ag-resizer-topRight {
  top: 0;
  right: 0;
  height: 5px;
  width: 5px;
  cursor: nesw-resize;
}

.ag-resizer.ag-resizer-right {
  top: 5px;
  right: 0;
  bottom: 5px;
  width: 5px;
  cursor: ew-resize;
}

.ag-resizer.ag-resizer-bottomRight {
  bottom: 0;
  right: 0;
  height: 5px;
  width: 5px;
  cursor: nwse-resize;
}

.ag-resizer.ag-resizer-bottom {
  bottom: 0;
  left: 5px;
  right: 5px;
  height: 5px;
  cursor: ns-resize;
}

.ag-resizer.ag-resizer-bottomLeft {
  bottom: 0;
  left: 0;
  height: 5px;
  width: 5px;
  cursor: nesw-resize;
}

.ag-resizer.ag-resizer-left {
  left: 0;
  top: 5px;
  bottom: 5px;
  width: 5px;
  cursor: ew-resize;
}

.ag-tooltip {
  position: absolute;
  z-index: 99999;
}

.ag-tooltip-custom {
  position: absolute;
  z-index: 99999;
}

.ag-tooltip:not(.ag-tooltip-interactive),
.ag-tooltip-custom:not(.ag-tooltip-interactive) {
  pointer-events: none;
}

.ag-value-slide-out {
  margin-right: 5px;
  opacity: 1;
  transition: opacity 3s, margin-right 3s;
  transition-timing-function: linear;
}

.ag-value-slide-out-end {
  margin-right: 10px;
  opacity: 0;
}

.ag-opacity-zero {
  opacity: 0 !important;
}

.ag-menu {
  max-height: 100%;
  overflow-y: auto;
  position: absolute;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.ag-menu-column-select-wrapper {
  height: 265px;
  overflow: auto;
}

.ag-menu-column-select-wrapper .ag-column-select {
  height: 100%;
}

.ag-dialog .ag-panel-content-wrapper .ag-column-select {
  user-select: none;
}

.ag-menu-list {
  display: table;
  width: 100%;
}

.ag-menu-option,
.ag-menu-separator {
  display: table-row;
}

.ag-menu-option-part,
.ag-menu-separator-part {
  display: table-cell;
  vertical-align: middle;
}

.ag-menu-option-text {
  white-space: nowrap;
}

.ag-menu-option-custom {
  display: contents;
}

.ag-compact-menu-option {
  width: 100%;
  display: flex;
  flex-wrap: nowrap;
}

.ag-compact-menu-option-text {
  white-space: nowrap;
  flex: 1 1 auto;
}

.ag-pill-container {
  display: flex;
  gap: 0.25rem;
  flex-wrap: nowrap;
}

.ag-pill {
  display: flex;
  white-space: nowrap;
  padding: 0 0.25rem;
  align-items: center;
}

.ag-pill .ag-pill-button {
  border: none;
  padding: 0;
}

.ag-rich-select {
  cursor: default;
  outline: none;
  height: 100%;
}

.ag-rich-select-value {
  display: flex;
  align-items: center;
  height: 100%;
}

.ag-rich-select-value .ag-picker-field-display {
  overflow: hidden;
  text-overflow: ellipsis;
}

.ag-rich-select-value .ag-picker-field-display.ag-display-as-placeholder {
  opacity: 0.5;
}

.ag-rich-select-list {
  position: relative;
}

.ag-rich-select-list .ag-loading-text {
  min-height: 2rem;
}

.ag-rich-select-row {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  white-space: nowrap;
  overflow: hidden;
  height: 100%;
}

.ag-rich-select-field-input {
  flex: 1 1 auto;
}

.ag-rich-select-field-input .ag-input-field-input {
  padding: 0 !important;
  border: none !important;
  box-shadow: none !important;
  text-overflow: ellipsis;
}

.ag-rich-select-field-input .ag-input-field-input::placeholder {
  opacity: 0.8;
}

.ag-autocomplete {
  align-items: center;
  display: flex;
}

.ag-autocomplete > * {
  flex: 1 1 auto;
}

.ag-autocomplete-list-popup {
  position: absolute;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.ag-autocomplete-list {
  position: relative;
}

.ag-autocomplete-virtual-list-item {
  display: flex;
}

.ag-autocomplete-row {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  overflow: hidden;
}

.ag-autocomplete-row-label {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ag-paging-panel {
  align-items: center;
  display: flex;
  justify-content: flex-end;
}

.ag-paging-page-summary-panel {
  display: flex;
  align-items: center;
}

.ag-paging-button {
  position: relative;
}

.ag-disabled .ag-paging-page-summary-panel {
  pointer-events: none;
}

.ag-tool-panel-wrapper {
  display: flex;
  overflow-y: auto;
  overflow-x: hidden;
  cursor: default;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.ag-column-select-column,
.ag-column-select-column-group,
.ag-select-agg-func-item {
  position: relative;
  align-items: center;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  height: 100%;
}

.ag-column-select-column > *,
.ag-column-select-column-group > *,
.ag-select-agg-func-item > * {
  flex: none;
}

.ag-select-agg-func-item,
.ag-column-select-column-label {
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ag-column-select-checkbox {
  display: flex;
}

.ag-tool-panel-horizontal-resize {
  cursor: ew-resize;
  height: 100%;
  position: absolute;
  top: 0;
  width: 5px;
  z-index: 1;
}

.ag-ltr .ag-side-bar-left .ag-tool-panel-horizontal-resize {
  right: -3px;
}

.ag-rtl .ag-side-bar-left .ag-tool-panel-horizontal-resize {
  left: -3px;
}

.ag-ltr .ag-side-bar-right .ag-tool-panel-horizontal-resize {
  left: -3px;
}

.ag-rtl .ag-side-bar-right .ag-tool-panel-horizontal-resize {
  right: -3px;
}

.ag-details-row {
  width: 100%;
}

.ag-details-row-fixed-height {
  height: 100%;
}

.ag-details-grid {
  width: 100%;
}

.ag-details-grid-fixed-height {
  height: 100%;
}

.ag-header-group-cell {
  display: flex;
  align-items: center;
  height: 100%;
  position: absolute;
}

.ag-header-group-cell-no-group.ag-header-span-height .ag-header-cell-resize {
  display: none;
}

.ag-cell-label-container {
  display: flex;
  justify-content: space-between;
  flex-direction: row-reverse;
  align-items: center;
  height: 100%;
  width: 100%;
}

.ag-header-group-cell-label,
.ag-cell-label-container {
  padding: 5px 0px;
}

.ag-right-aligned-header .ag-cell-label-container {
  flex-direction: row;
}

.ag-right-aligned-header .ag-header-cell-text {
  text-align: end;
}

.ag-side-bar {
  display: flex;
  flex-direction: row-reverse;
}

.ag-side-bar-left {
  order: -1;
  flex-direction: row;
}

.ag-side-button-button {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex-wrap: nowrap;
  white-space: nowrap;
  outline: none;
  cursor: pointer;
}

.ag-side-button-label {
  writing-mode: vertical-lr;
}

.ag-status-bar {
  display: flex;
  justify-content: space-between;
  overflow: hidden;
}

.ag-status-panel {
  display: inline-flex;
}

.ag-status-name-value {
  white-space: nowrap;
}

.ag-status-bar-left {
  display: inline-flex;
}

.ag-status-bar-center {
  display: inline-flex;
}

.ag-status-bar-right {
  display: inline-flex;
}

.ag-icon {
  display: block;
  speak: none;
}

.ag-group {
  position: relative;
  width: 100%;
}

.ag-group-title-bar {
  display: flex;
  align-items: center;
}

.ag-group-title {
  display: inline;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.ag-group-title-bar .ag-group-title {
  cursor: default;
}

.ag-group-toolbar {
  display: flex;
  align-items: center;
}

.ag-group-container {
  display: flex;
}

.ag-disabled .ag-group-container {
  pointer-events: none;
}

.ag-group-container-horizontal {
  flex-direction: row;
  flex-wrap: wrap;
}

.ag-group-container-vertical {
  flex-direction: column;
}

.ag-column-group-icons {
  display: block;
}

.ag-column-group-icons > * {
  cursor: pointer;
}

.ag-group-item-alignment-stretch .ag-group-item {
  align-items: stretch;
}

.ag-group-item-alignment-start .ag-group-item {
  align-items: flex-start;
}

.ag-group-item-alignment-end .ag-group-item {
  align-items: flex-end;
}

.ag-toggle-button-icon {
  transition: right 0.3s;
  position: absolute;
  top: -1px;
}

.ag-input-field,
.ag-select {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.ag-input-field-input {
  flex: 1 1 auto;
}

.ag-floating-filter-input .ag-input-field-input[type=date] {
  width: 1px;
}

.ag-range-field {
  display: flex;
  align-items: center;
}

.ag-angle-select {
  display: flex;
  align-items: center;
}

.ag-angle-select-wrapper {
  display: flex;
}

.ag-angle-select-parent-circle {
  display: block;
  position: relative;
}

.ag-angle-select-child-circle {
  position: absolute;
}

.ag-slider-wrapper {
  display: flex;
}

.ag-slider-wrapper .ag-input-field {
  flex: 1 1 auto;
}

.ag-picker-field-display {
  flex: 1 1 auto;
}

.ag-picker-field {
  display: flex;
  align-items: center;
}

.ag-picker-field-icon {
  display: flex;
  border: 0;
  padding: 0;
  margin: 0;
  cursor: pointer;
}

.ag-picker-field-wrapper {
  overflow: hidden;
}

.ag-label-align-right .ag-label {
  order: 1;
}

.ag-label-align-right > * {
  flex: none;
}

.ag-label-align-top {
  flex-direction: column;
  align-items: flex-start;
}

.ag-label-align-top > * {
  align-self: stretch;
}

.ag-label-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: 1;
}

.ag-color-panel {
  width: 100%;
  display: flex;
  flex-direction: column;
  text-align: center;
}

.ag-spectrum-color {
  flex: 1 1 auto;
  position: relative;
  overflow: visible;
  cursor: default;
}

.ag-spectrum-fill {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.ag-spectrum-val {
  cursor: pointer;
}

.ag-spectrum-dragger {
  position: absolute;
  pointer-events: none;
  cursor: pointer;
}

.ag-spectrum-hue,
.ag-spectrum-alpha {
  cursor: default;
}

.ag-spectrum-hue-background {
  background: linear-gradient(to left, #ff0000 3%, #ffff00 17%, #00ff00 33%, #00ffff 50%, #0000ff 67%, #ff00ff 83%, #ff0000 100%);
  width: 100%;
  height: 100%;
}

.ag-spectrum-alpha {
  --ag-spectrum-alpha-background-checked: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="4" height="4"><rect x="0" y="0" width="4" height="4" fill="%23fff"/><path d="M0 0H2V4H4V2H0Z" fill="%23b2b2b2"/></svg>');
}

.ag-spectrum-alpha-background {
  background: linear-gradient(to right, var(--ag-internal-spectrum-alpha-color-from), var(--ag-internal-spectrum-alpha-color-to)), var(--ag-spectrum-alpha-background-checked) top left/4px 4px;
  width: 100%;
  height: 100%;
}

.ag-spectrum-tool {
  cursor: pointer;
  position: relative;
}

.ag-spectrum-slider {
  position: absolute;
  pointer-events: none;
}

.ag-spectrum-alpha .ag-spectrum-slider {
  background: linear-gradient(to bottom, var(--ag-internal-spectrum-alpha-color), var(--ag-internal-spectrum-alpha-color)) white;
}

.ag-recent-colors {
  display: flex;
}

.ag-recent-color {
  cursor: pointer;
}

.ag-pill-select {
  display: flex;
  flex-direction: column;
}

.ag-pill-select .ag-column-drop {
  flex: unset;
}

.ag-ltr {
  direction: ltr;
}

.ag-ltr .ag-body,
.ag-ltr .ag-floating-top,
.ag-ltr .ag-floating-bottom,
.ag-ltr .ag-header,
.ag-ltr .ag-sticky-top,
.ag-ltr .ag-sticky-bottom,
.ag-ltr .ag-body-viewport,
.ag-ltr .ag-body-horizontal-scroll {
  flex-direction: row;
}

.ag-rtl {
  direction: rtl;
}

.ag-rtl .ag-body,
.ag-rtl .ag-floating-top,
.ag-rtl .ag-floating-bottom,
.ag-rtl .ag-header,
.ag-rtl .ag-sticky-top,
.ag-rtl .ag-sticky-bottom,
.ag-rtl .ag-body-viewport,
.ag-rtl .ag-body-horizontal-scroll {
  flex-direction: row-reverse;
}

.ag-rtl .ag-icon-contracted,
.ag-rtl .ag-icon-expanded,
.ag-rtl .ag-icon-tree-closed {
  display: block;
  transform: rotate(180deg);
}

.ag-body .ag-body-viewport {
  -webkit-overflow-scrolling: touch;
}

.ag-measurement-container {
  width: 0;
  overflow: hidden;
  visibility: hidden;
}

.ag-measurement-container div {
  position: absolute;
}

.ag-layout-print.ag-body {
  display: block;
  height: unset;
}

.ag-layout-print.ag-root-wrapper {
  display: inline-block;
}

.ag-layout-print .ag-body-vertical-scroll {
  display: none;
}

.ag-layout-print .ag-body-horizontal-scroll {
  display: none;
}

.ag-layout-print.ag-force-vertical-scroll {
  overflow-y: visible !important;
}

@media print {
  .ag-root-wrapper.ag-layout-print {
    display: table;
  }
  .ag-root-wrapper.ag-layout-print .ag-root-wrapper-body,
  .ag-root-wrapper.ag-layout-print .ag-root,
  .ag-root-wrapper.ag-layout-print .ag-body-viewport,
  .ag-root-wrapper.ag-layout-print .ag-center-cols-container,
  .ag-root-wrapper.ag-layout-print .ag-center-cols-viewport,
  .ag-root-wrapper.ag-layout-print .ag-body-horizontal-scroll-viewport,
  .ag-root-wrapper.ag-layout-print .ag-virtual-list-viewport {
    height: auto !important;
    overflow: hidden !important;
    display: block !important;
  }
  .ag-root-wrapper.ag-layout-print .ag-row,
  .ag-root-wrapper.ag-layout-print .ag-cell {
    break-inside: avoid;
  }
}
[class^=ag-],
[class^=ag-]:focus,
[class^=ag-]:after,
[class^=ag-]:before {
  box-sizing: border-box;
  outline: none;
}

[class^=ag-]::-ms-clear {
  display: none;
}

.ag-checkbox .ag-input-wrapper,
.ag-radio-button .ag-input-wrapper {
  overflow: visible;
}

.ag-range-field .ag-input-wrapper {
  height: 100%;
}

.ag-toggle-button {
  flex: none;
  width: unset;
  min-width: unset;
}

.ag-button {
  border-radius: 0px;
  color: var(--ag-foreground-color);
}

.ag-button:hover {
  background-color: transparent;
}

.ag-ltr .ag-label-align-right .ag-label {
  margin-left: var(--ag-grid-size);
}

.ag-rtl .ag-label-align-right .ag-label {
  margin-right: var(--ag-grid-size);
}

input[class^=ag-] {
  margin: 0;
  background-color: var(--ag-background-color);
}

textarea[class^=ag-],
select[class^=ag-] {
  background-color: var(--ag-background-color);
}

input[class^=ag-]:not([type]),
input[class^=ag-][type=text],
input[class^=ag-][type=number],
input[class^=ag-][type=tel],
input[class^=ag-][type=date],
input[class^=ag-][type=datetime-local],
textarea[class^=ag-] {
  font-size: inherit;
  line-height: inherit;
  color: inherit;
  font-family: inherit;
  border: var(--ag-borders-input) var(--ag-input-border-color);
}

input[class^=ag-]:not([type]):disabled,
input[class^=ag-][type=text]:disabled,
input[class^=ag-][type=number]:disabled,
input[class^=ag-][type=tel]:disabled,
input[class^=ag-][type=date]:disabled,
input[class^=ag-][type=datetime-local]:disabled,
textarea[class^=ag-]:disabled {
  color: var(--ag-disabled-foreground-color);
  background-color: var(--ag-input-disabled-background-color);
  border-color: var(--ag-input-disabled-border-color);
}

input[class^=ag-]:not([type]):focus,
input[class^=ag-][type=text]:focus,
input[class^=ag-][type=number]:focus,
input[class^=ag-][type=tel]:focus,
input[class^=ag-][type=date]:focus,
input[class^=ag-][type=datetime-local]:focus,
textarea[class^=ag-]:focus {
  outline: none;
  box-shadow: var(--ag-input-focus-box-shadow);
  border-color: var(--ag-input-focus-border-color);
}

input[class^=ag-]:not([type]):invalid,
input[class^=ag-][type=text]:invalid,
input[class^=ag-][type=number]:invalid,
input[class^=ag-][type=tel]:invalid,
input[class^=ag-][type=date]:invalid,
input[class^=ag-][type=datetime-local]:invalid,
textarea[class^=ag-]:invalid {
  border: var(--ag-borders-input-invalid) var(--ag-input-border-color-invalid);
}

input[class^=ag-][type=number]:not(.ag-number-field-input-stepper) {
  -moz-appearance: textfield;
}

input[class^=ag-][type=number]:not(.ag-number-field-input-stepper)::-webkit-outer-spin-button, input[class^=ag-][type=number]:not(.ag-number-field-input-stepper)::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[class^=ag-][type=range] {
  padding: 0;
}

input[class^=ag-][type=button]:focus,
button[class^=ag-]:focus {
  box-shadow: var(--ag-input-focus-box-shadow);
}

.ag-drag-handle {
  color: var(--ag-secondary-foreground-color);
}

.ag-list-item,
.ag-virtual-list-item {
  height: var(--ag-list-item-height);
}

.ag-virtual-list-item:focus-visible {
  outline: none;
}

.ag-virtual-list-item:focus-visible::after {
  content: "";
  position: absolute;
  background-color: transparent;
  pointer-events: none;
  top: 4px;
  left: 4px;
  display: block;
  width: calc(100% - 8px);
  height: calc(100% - 8px);
  border: 1px solid;
  border-color: var(--ag-input-focus-border-color);
}

.ag-select-list {
  background-color: var(--ag-background-color);
  overflow-y: auto;
  overflow-x: hidden;
  border-radius: var(--ag-border-radius);
  border: var(--ag-borders) var(--ag-border-color);
}

.ag-list-item {
  display: flex;
  align-items: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ag-list-item.ag-active-item {
  background-color: var(--ag-row-hover-color);
}

.ag-select-list-item {
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: default;
}

.ag-ltr .ag-select-list-item {
  padding-left: calc(var(--ag-cell-horizontal-padding) / 2);
}

.ag-rtl .ag-select-list-item {
  padding-right: calc(var(--ag-cell-horizontal-padding) / 2);
}

.ag-select-list-item span {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.ag-row-drag,
.ag-selection-checkbox,
.ag-group-expanded,
.ag-group-contracted {
  color: var(--ag-secondary-foreground-color);
}

.ag-ltr .ag-row-drag,
.ag-ltr .ag-selection-checkbox,
.ag-ltr .ag-group-expanded,
.ag-ltr .ag-group-contracted {
  margin-right: var(--ag-cell-widget-spacing);
}

.ag-rtl .ag-row-drag,
.ag-rtl .ag-selection-checkbox,
.ag-rtl .ag-group-expanded,
.ag-rtl .ag-group-contracted {
  margin-left: var(--ag-cell-widget-spacing);
}

.ag-cell-wrapper > *:not(.ag-cell-value):not(.ag-group-value) {
  --ag-internal-calculated-line-height: var(
      --ag-line-height,
      calc(var(--ag-row-height) - var(--ag-row-border-width))
  );
  --ag-internal-padded-row-height: calc(var(--ag-row-height) - var(--ag-row-border-width));
  height: min(var(--ag-internal-calculated-line-height), var(--ag-internal-padded-row-height));
  display: flex;
  align-items: center;
  flex: none;
}

.ag-group-expanded,
.ag-group-contracted {
  cursor: pointer;
}

.ag-group-title-bar-icon {
  cursor: pointer;
  flex: none;
  color: var(--ag-secondary-foreground-color);
}

.ag-ltr .ag-group-child-count {
  margin-left: 2px;
}

.ag-rtl .ag-group-child-count {
  margin-right: 2px;
}

.ag-group-title-bar {
  background-color: var(--ag-subheader-background-color);
  padding: var(--ag-grid-size);
}

.ag-group-toolbar {
  padding: var(--ag-grid-size);
  background-color: var(--ag-subheader-toolbar-background-color);
}

.ag-disabled-group-title-bar,
.ag-disabled-group-container {
  opacity: 0.5;
}

.group-item {
  margin: calc(var(--ag-grid-size) * 0.5) 0;
}

.ag-label {
  white-space: nowrap;
}

.ag-ltr .ag-label {
  margin-right: var(--ag-grid-size);
}

.ag-rtl .ag-label {
  margin-left: var(--ag-grid-size);
}

.ag-label-align-top .ag-label {
  margin-bottom: calc(var(--ag-grid-size) * 0.5);
}

.ag-angle-select[disabled] {
  color: var(--ag-disabled-foreground-color);
  pointer-events: none;
}

.ag-angle-select[disabled] .ag-angle-select-field {
  opacity: 0.4;
}

.ag-ltr .ag-slider-field,
.ag-ltr .ag-angle-select-field {
  margin-right: calc(var(--ag-grid-size) * 2);
}

.ag-rtl .ag-slider-field,
.ag-rtl .ag-angle-select-field {
  margin-left: calc(var(--ag-grid-size) * 2);
}

.ag-angle-select-parent-circle {
  width: 24px;
  height: 24px;
  border-radius: 12px;
  border: solid 1px;
  border-color: var(--ag-border-color);
  background-color: var(--ag-background-color);
}

.ag-angle-select-child-circle {
  top: 4px;
  left: 12px;
  width: 6px;
  height: 6px;
  margin-left: -3px;
  margin-top: -4px;
  border-radius: 3px;
  background-color: var(--ag-secondary-foreground-color);
}

.ag-picker-field-wrapper {
  border: var(--ag-borders);
  border-color: var(--ag-border-color);
  border-radius: 5px;
  background-color: var(--ag-background-color);
}

.ag-picker-field-wrapper:disabled {
  color: var(--ag-disabled-foreground-color);
  background-color: var(--ag-input-disabled-background-color);
  border-color: var(--ag-input-disabled-border-color);
}

.ag-picker-field-wrapper.ag-picker-has-focus, .ag-picker-field-wrapper:focus-within {
  outline: none;
  box-shadow: var(--ag-input-focus-box-shadow);
  border-color: var(--ag-input-focus-border-color);
}

.ag-picker-field-button {
  background-color: var(--ag-background-color);
  color: var(--ag-secondary-foreground-color);
}

.ag-dialog.ag-color-dialog {
  border-radius: 5px;
}

.ag-color-picker .ag-picker-field-wrapper {
  padding-left: var(--ag-grid-size);
  padding-right: var(--ag-grid-size);
}

.ag-color-picker .ag-picker-field-display {
  display: flex;
  flex-direction: row;
  align-items: center;
  min-height: var(--ag-list-item-height);
}

.ag-ltr .ag-color-picker-color,
.ag-ltr .ag-color-picker-value {
  margin-right: var(--ag-grid-size);
}

.ag-rtl .ag-color-picker-color,
.ag-rtl .ag-color-picker-value {
  margin-left: var(--ag-grid-size);
}

.ag-color-panel {
  padding: var(--ag-grid-size);
}

.ag-spectrum-color {
  background-color: rgb(255, 0, 0);
  border-radius: 2px;
}

.ag-spectrum-tools {
  padding: 10px;
}

.ag-spectrum-sat {
  background-image: linear-gradient(to right, white, rgba(204, 154, 129, 0));
}

.ag-spectrum-val {
  background-image: linear-gradient(to top, black, rgba(204, 154, 129, 0));
}

.ag-spectrum-dragger {
  border-radius: 12px;
  height: 12px;
  width: 12px;
  border: 2px solid white;
  background: black;
  box-shadow: 0 0 2px 0px rgba(0, 0, 0, 0.24);
}

.ag-spectrum-hue-background {
  border-radius: 2px;
}

.ag-spectrum-alpha-background {
  border-radius: 2px;
}

.ag-spectrum-tool {
  margin-bottom: 10px;
  height: 11px;
  border-radius: 2px;
}

.ag-spectrum-slider {
  margin-top: -12px;
  width: 13px;
  height: 13px;
  border-radius: 13px;
  border: 2px solid white;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.37);
}

.ag-recent-colors {
  margin-top: 10px;
}

.ag-recent-color {
  margin: 0 3px;
}

.ag-recent-color:first-child {
  margin-left: 0;
}

.ag-recent-color:last-child {
  margin-right: 0;
}

.ag-spectrum-color:focus-visible:not(:disabled):not([readonly]),
.ag-spectrum-slider:focus-visible:not(:disabled):not([readonly]),
.ag-recent-color:focus-visible:not(:disabled):not([readonly]) {
  box-shadow: var(--ag-input-focus-box-shadow);
}

.ag-ltr .ag-color-input input[class^=ag-][type=text].ag-input-field-input {
  padding-left: calc(var(--ag-icon-size) + var(--ag-grid-size) * 2);
}

.ag-rtl .ag-color-input input[class^=ag-][type=text].ag-input-field-input {
  padding-right: calc(var(--ag-icon-size) + var(--ag-grid-size) * 2);
}

.ag-color-input .ag-color-input-color {
  position: absolute;
}

.ag-ltr .ag-color-input .ag-color-input-color {
  margin-left: var(--ag-grid-size);
}

.ag-rtl .ag-color-input .ag-color-input-color {
  margin-right: var(--ag-grid-size);
}

.ag-color-picker-color,
.ag-color-input-color {
  width: var(--ag-icon-size);
  height: var(--ag-icon-size);
  border: var(--ag-borders-secondary) var(--ag-secondary-border-color);
  border-radius: 2px;
}

.ag-dnd-ghost {
  border: var(--ag-borders) var(--ag-border-color);
  background: var(--ag-background-color);
  border-radius: var(--ag-card-radius);
  box-shadow: var(--ag-card-shadow);
  padding: var(--ag-grid-size);
  overflow: hidden;
  text-overflow: ellipsis;
  border: var(--ag-borders-secondary) var(--ag-secondary-border-color);
  color: var(--ag-secondary-foreground-color);
  height: var(--ag-header-height) !important;
  line-height: var(--ag-header-height);
  margin: 0;
  padding: 0 calc(var(--ag-grid-size) * 2);
  transform: translateY(calc(var(--ag-grid-size) * 2));
}

.ag-dnd-ghost-icon {
  margin-right: var(--ag-grid-size);
  color: var(--ag-foreground-color);
}

.ag-popup-child:not(.ag-tooltip-custom) {
  box-shadow: var(--ag-popup-shadow);
}

.ag-select .ag-picker-field-wrapper {
  min-height: var(--ag-list-item-height);
  cursor: default;
}

.ag-ltr .ag-select .ag-picker-field-wrapper {
  padding-left: calc(var(--ag-cell-horizontal-padding) / 2);
}

.ag-rtl .ag-select .ag-picker-field-wrapper {
  padding-right: calc(var(--ag-cell-horizontal-padding) / 2);
}

.ag-ltr .ag-select .ag-picker-field-wrapper {
  padding-right: var(--ag-grid-size);
}

.ag-rtl .ag-select .ag-picker-field-wrapper {
  padding-left: var(--ag-grid-size);
}

.ag-select.ag-disabled .ag-picker-field-wrapper:focus {
  box-shadow: none;
}

.ag-select:not(.ag-cell-editor, .ag-label-align-top) {
  min-height: var(--ag-list-item-height);
}

.ag-select .ag-picker-field-display {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ag-select .ag-picker-field-icon {
  display: flex;
  align-items: center;
}

.ag-select.ag-disabled {
  opacity: 0.5;
}

.ag-rich-select-value,
.ag-rich-select-list {
  background-color: var(--ag-background-color);
}

.ag-rich-select-list {
  width: 100%;
  height: auto;
  border-radius: var(--ag-border-radius);
  border: var(--ag-borders) var(--ag-border-color);
}

.ag-rich-select-list .ag-loading-text {
  padding: var(--ag-widget-vertical-spacing) var(--ag-widget-horizontal-spacing);
}

.ag-rich-select-value {
  border-bottom: var(--ag-borders-secondary) var(--ag-secondary-border-color);
  padding-top: 0;
  padding-bottom: 0;
}

.ag-ltr .ag-rich-select-value {
  padding-left: calc(var(--ag-cell-horizontal-padding) / 2);
}

.ag-rtl .ag-rich-select-value {
  padding-right: calc(var(--ag-cell-horizontal-padding) / 2);
}

.ag-ltr .ag-rich-select-value {
  padding-right: var(--ag-grid-size);
}

.ag-rtl .ag-rich-select-value {
  padding-left: var(--ag-grid-size);
}

.ag-ltr .ag-rich-select-field-input {
  left: calc(var(--ag-cell-horizontal-padding));
}

.ag-rtl .ag-rich-select-field-input {
  right: calc(var(--ag-cell-horizontal-padding));
}

.ag-popup-editor .ag-rich-select-value {
  height: var(--ag-row-height);
  min-width: 200px;
}

.ag-rich-select-virtual-list-item {
  cursor: default;
  height: var(--ag-list-item-height);
}

.ag-rich-select-virtual-list-item:focus-visible::after {
  content: none;
}

.ag-ltr .ag-rich-select-row {
  padding-left: calc(var(--ag-cell-horizontal-padding) / 2);
}

.ag-rtl .ag-rich-select-row {
  padding-right: calc(var(--ag-cell-horizontal-padding) / 2);
}

.ag-rich-select-row-selected {
  background-color: var(--ag-selected-row-background-color);
}

.ag-rich-select-row:hover,
.ag-rich-select-row-highlighted {
  background-image: linear-gradient(var(--ag-row-hover-color), var(--ag-row-hover-color));
}

.ag-rich-select-row-text-highlight {
  font-weight: bold;
}

.ag-autocomplete {
  width: 100%;
}

.ag-autocomplete-list {
  width: 100%;
  min-width: 200px;
  height: calc(var(--ag-row-height) * 6.5);
}

.ag-autocomplete-virtual-list-item {
  cursor: default;
  height: var(--ag-list-item-height);
}

.ag-autocomplete-virtual-list-item:focus-visible::after {
  content: none;
}

.ag-autocomplete-virtual-list-item:hover {
  background-color: var(--ag-row-hover-color);
}

.ag-autocomplete-row-label {
  margin: 0px var(--ag-widget-container-horizontal-padding);
}

.ag-autocomplete-row-selected {
  background-color: var(--ag-selected-row-background-color);
}

.ag-pill {
  border: 1px solid var(--ag-chip-border-color);
  border-radius: var(--ag-border-radius);
  background-color: var(--ag-chip-background-color);
}

.ag-ltr .ag-pill .ag-pill-button {
  margin-left: var(--ag-grid-size);
}

.ag-rtl .ag-pill .ag-pill-button {
  margin-right: var(--ag-grid-size);
}

.ag-pill:focus-visible {
  border-color: var(--ag-input-focus-border-color);
}

.ag-pill .ag-pill-button:hover {
  color: var(--ag-active-color);
  cursor: pointer;
}

.ag-dragging-range-handle .ag-dialog,
.ag-dragging-fill-handle .ag-dialog {
  opacity: 0.7;
  pointer-events: none;
}

.ag-dialog {
  border-radius: var(--ag-border-radius);
  border: var(--ag-borders) var(--ag-border-color);
  box-shadow: var(--ag-popup-shadow);
}

.ag-panel {
  background-color: var(--ag-panel-background-color);
  border-color: var(--ag-panel-border-color);
}

.ag-panel-title-bar {
  color: var(--ag-header-foreground-color);
  height: var(--ag-header-height);
  padding: var(--ag-grid-size) var(--ag-cell-horizontal-padding);
  border-bottom: var(--ag-borders) var(--ag-border-color);
}

.ag-ltr .ag-panel-title-bar-button {
  margin-left: var(--ag-grid-size);
}

.ag-rtl .ag-panel-title-bar-button {
  margin-right: var(--ag-grid-size);
}

.ag-tooltip {
  background-color: var(--ag-tooltip-background-color);
  color: var(--ag-foreground-color);
  padding: var(--ag-grid-size);
  border: var(--ag-borders) var(--ag-border-color);
  border-radius: var(--ag-card-radius);
  white-space: normal;
}

.ag-tooltip.ag-tooltip-animate,
.ag-tooltip-custom.ag-tooltip-animate {
  transition: opacity 1s;
}

.ag-tooltip.ag-tooltip-animate.ag-tooltip-hiding,
.ag-tooltip-custom.ag-tooltip-animate.ag-tooltip-hiding {
  opacity: 0;
}

.ag-ltr .ag-column-select-column,
.ag-ltr .ag-column-select-column-group {
  padding-left: calc(var(--ag-indentation-level) * var(--ag-column-select-indent-size));
}

.ag-rtl .ag-column-select-column,
.ag-rtl .ag-column-select-column-group {
  padding-right: calc(var(--ag-indentation-level) * var(--ag-column-select-indent-size));
}

.ag-column-select-header-icon {
  cursor: pointer;
}

.ag-column-select-header-icon:focus-visible {
  outline: none;
}

.ag-column-select-header-icon:focus-visible::after {
  content: "";
  position: absolute;
  background-color: transparent;
  pointer-events: none;
  top: 0px;
  left: 0px;
  display: block;
  width: calc(100% - 0px);
  height: calc(100% - 0px);
  border: 1px solid;
  border-color: var(--ag-input-focus-border-color);
}

.ag-ltr .ag-column-group-icons:not(:last-child),
.ag-ltr .ag-column-select-header-icon:not(:last-child),
.ag-ltr .ag-column-select-header-checkbox:not(:last-child),
.ag-ltr .ag-column-select-header-filter-wrapper:not(:last-child),
.ag-ltr .ag-column-select-checkbox:not(:last-child),
.ag-ltr .ag-column-select-column-drag-handle:not(:last-child),
.ag-ltr .ag-column-select-column-group-drag-handle:not(:last-child),
.ag-ltr .ag-column-select-column-label:not(:last-child) {
  margin-right: var(--ag-widget-horizontal-spacing);
}

.ag-rtl .ag-column-group-icons:not(:last-child),
.ag-rtl .ag-column-select-header-icon:not(:last-child),
.ag-rtl .ag-column-select-header-checkbox:not(:last-child),
.ag-rtl .ag-column-select-header-filter-wrapper:not(:last-child),
.ag-rtl .ag-column-select-checkbox:not(:last-child),
.ag-rtl .ag-column-select-column-drag-handle:not(:last-child),
.ag-rtl .ag-column-select-column-group-drag-handle:not(:last-child),
.ag-rtl .ag-column-select-column-label:not(:last-child) {
  margin-left: var(--ag-widget-horizontal-spacing);
}

.ag-column-select-virtual-list-item:focus-visible {
  outline: none;
}

.ag-column-select-virtual-list-item:focus-visible::after {
  content: "";
  position: absolute;
  background-color: transparent;
  pointer-events: none;
  top: 1px;
  left: 1px;
  display: block;
  width: calc(100% - 2px);
  height: calc(100% - 2px);
  border: 1px solid;
  border-color: var(--ag-input-focus-border-color);
}

.ag-column-select-column-group:not(:last-child),
.ag-column-select-column:not(:last-child) {
  margin-bottom: var(--ag-widget-vertical-spacing);
}

.ag-column-select-column-readonly,
.ag-column-select-column-group-readonly {
  color: var(--ag-disabled-foreground-color);
  pointer-events: none;
}

.ag-ltr .ag-column-select-add-group-indent {
  margin-left: calc(var(--ag-icon-size) + var(--ag-grid-size) * 2);
}

.ag-rtl .ag-column-select-add-group-indent {
  margin-right: calc(var(--ag-icon-size) + var(--ag-grid-size) * 2);
}

.ag-column-select-virtual-list-viewport {
  padding: calc(var(--ag-widget-container-vertical-padding) * 0.5) 0px;
}

.ag-column-select-virtual-list-item {
  padding: 0 var(--ag-widget-container-horizontal-padding);
}

.ag-checkbox-edit {
  padding-left: var(--ag-cell-horizontal-padding);
  padding-right: var(--ag-cell-horizontal-padding);
}

.ag-pill-select .ag-column-drop {
  border-bottom: 0;
  min-height: unset;
}

.ag-pill-select .ag-column-drop-list {
  padding: 0;
}

.ag-pill-select .ag-select {
  padding-top: var(--ag-grid-size);
}

.ag-pill-select .ag-picker-field-wrapper {
  background-color: transparent;
  border: 0;
}

.ag-pill-select .ag-picker-field-display {
  cursor: pointer;
}

.ag-rtl {
  text-align: right;
}

.ag-root-wrapper {
  border-radius: var(--ag-wrapper-border-radius);
  border: var(--ag-borders) var(--ag-border-color);
}

.ag-row > .ag-cell-wrapper.ag-row-group {
  padding-left: calc(var(--ag-cell-horizontal-padding) + var(--ag-row-group-indent-size) * var(--ag-indentation-level));
}

.ag-cell-wrapper.ag-row-group,
.ag-cell-wrapper.ag-row-group-leaf-indent,
.ag-cell-wrapper.ag-pivot-leaf-group {
  padding-left: calc(var(--ag-indentation-level) * var(--ag-row-group-indent-size));
}

.ag-pivot-leaf-group {
  margin-left: min(var(--ag-row-group-indent-size), var(--ag-row-group-indent-size) * var(--ag-indentation-level));
}

.ag-ltr .ag-row-group-leaf-indent {
  margin-left: var(--ag-row-group-indent-size);
}

.ag-rtl .ag-row-group-leaf-indent {
  margin-right: var(--ag-row-group-indent-size);
}

.ag-value-change-delta {
  padding-right: 2px;
}

.ag-value-change-delta-up {
  color: var(--ag-value-change-delta-up-color);
}

.ag-value-change-delta-down {
  color: var(--ag-value-change-delta-down-color);
}

.ag-value-change-value {
  background-color: transparent;
  border-radius: 1px;
  padding-left: 1px;
  padding-right: 1px;
  transition: background-color 1s;
}

.ag-value-change-value-highlight {
  background-color: var(--ag-value-change-value-highlight-background-color);
  transition: background-color 0.1s;
}

.ag-cell-data-changed {
  background-color: var(--ag-value-change-value-highlight-background-color) !important;
}

.ag-cell-data-changed-animation {
  background-color: transparent;
}

.ag-cell-highlight {
  background-color: var(--ag-range-selection-highlight-color) !important;
}

.ag-row {
  height: var(--ag-row-height);
  background-color: var(--ag-background-color);
  color: var(--ag-data-color);
  border-bottom: var(--ag-row-border-style) var(--ag-row-border-color) var(--ag-row-border-width);
}

.ag-row-highlight-above::after,
.ag-row-highlight-below::after {
  content: "";
  position: absolute;
  width: calc(100% - 1px);
  height: 1px;
  background-color: var(--ag-range-selection-border-color);
  left: 1px;
}

.ag-row-highlight-above::after {
  top: -1px;
}

.ag-row-highlight-above.ag-row-first::after {
  top: 0;
}

.ag-row-highlight-below::after {
  bottom: 0px;
}

.ag-row-odd {
  background-color: var(--ag-odd-row-background-color);
}

.ag-body-horizontal-scroll:not(.ag-scrollbar-invisible) .ag-horizontal-left-spacer:not(.ag-scroller-corner) {
  border-right: var(--ag-borders-critical) var(--ag-border-color);
}

.ag-body-horizontal-scroll:not(.ag-scrollbar-invisible) .ag-horizontal-right-spacer:not(.ag-scroller-corner) {
  border-left: var(--ag-borders-critical) var(--ag-border-color);
}

.ag-row-selected::before {
  content: "";
  background-color: var(--ag-selected-row-background-color);
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.ag-row-hover:not(.ag-full-width-row)::before,
.ag-row-hover.ag-full-width-row.ag-row-group::before {
  content: "";
  background-color: var(--ag-row-hover-color);
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  pointer-events: none;
}

.ag-row-hover.ag-full-width-row.ag-row-group > * {
  position: relative;
}

.ag-row-hover.ag-row-selected::before {
  background-color: var(--ag-row-hover-color);
  background-image: linear-gradient(var(--ag-selected-row-background-color), var(--ag-selected-row-background-color));
}

.ag-column-hover {
  background-color: var(--ag-column-hover-color);
}

.ag-ltr .ag-right-aligned-cell {
  text-align: right;
}

.ag-rtl .ag-right-aligned-cell {
  text-align: left;
}

.ag-ltr .ag-right-aligned-cell .ag-cell-value,
.ag-ltr .ag-right-aligned-cell .ag-group-value {
  margin-left: auto;
}

.ag-rtl .ag-right-aligned-cell .ag-cell-value,
.ag-rtl .ag-right-aligned-cell .ag-group-value {
  margin-right: auto;
}

.ag-ltr .ag-right-aligned-cell .ag-skeleton-effect {
  margin-left: auto;
}

.ag-rtl .ag-right-aligned-cell .ag-skeleton-effect {
  margin-right: auto;
}

.ag-cell,
.ag-full-width-row .ag-cell-wrapper.ag-row-group {
  --ag-internal-calculated-line-height: var(
      --ag-line-height,
      calc(var(--ag-row-height) - var(--ag-row-border-width))
  );
  --ag-internal-padded-row-height: calc(var(--ag-row-height) - var(--ag-row-border-width));
  border: 1px solid transparent;
  line-height: min(var(--ag-internal-calculated-line-height), var(--ag-internal-padded-row-height));
  padding-left: calc(var(--ag-cell-horizontal-padding) - 1px + var(--ag-row-group-indent-size) * var(--ag-indentation-level));
  padding-right: calc(var(--ag-cell-horizontal-padding) - 1px);
  -webkit-font-smoothing: subpixel-antialiased;
}

.ag-row > .ag-cell-wrapper {
  padding-left: calc(var(--ag-cell-horizontal-padding) - 1px);
  padding-right: calc(var(--ag-cell-horizontal-padding) - 1px);
}

.ag-row-dragging {
  cursor: move;
  opacity: 0.5;
}

.ag-cell-inline-editing {
  border: 1px solid var(--ag-border-color);
  border-radius: var(--ag-card-radius);
  box-shadow: var(--ag-card-shadow);
  padding: 0;
  background-color: var(--ag-control-panel-background-color);
}

.ag-popup-editor .ag-large-text,
.ag-autocomplete-list-popup {
  border: var(--ag-borders) var(--ag-border-color);
  background: var(--ag-background-color);
  border-radius: var(--ag-card-radius);
  box-shadow: var(--ag-card-shadow);
  padding: var(--ag-grid-size);
  background-color: var(--ag-control-panel-background-color);
  padding: 0;
}

.ag-large-text-input {
  height: auto;
  padding: var(--ag-cell-horizontal-padding);
}

.ag-rtl .ag-large-text-input textarea {
  resize: none;
}

.ag-details-row {
  padding: calc(var(--ag-grid-size) * 5);
  background-color: var(--ag-background-color);
}

.ag-layout-auto-height .ag-center-cols-viewport,
.ag-layout-auto-height .ag-center-cols-container,
.ag-layout-print .ag-center-cols-viewport,
.ag-layout-print .ag-center-cols-container {
  min-height: 50px;
}

.ag-overlay-loading-wrapper {
  background-color: var(--ag-modal-overlay-background-color);
}

.ag-overlay-loading-center {
  border: var(--ag-borders) var(--ag-border-color);
  background: var(--ag-background-color);
  border-radius: var(--ag-card-radius);
  box-shadow: var(--ag-card-shadow);
  padding: var(--ag-grid-size);
}

.ag-skeleton-container {
  width: 100%;
  height: 100%;
  align-content: center;
}

.ag-skeleton-effect {
  background-color: var(--ag-row-loading-skeleton-effect-color);
  width: 100%;
  height: 1em;
  border-radius: 0.25rem;
  animation: ag-skeleton-loading 1.5s ease-in-out 0.5s infinite;
}

@keyframes ag-skeleton-loading {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.4;
  }
  100% {
    opacity: 1;
  }
}
.ag-loading {
  display: flex;
  height: 100%;
  align-items: center;
}

.ag-ltr .ag-loading {
  padding-left: var(--ag-cell-horizontal-padding);
}

.ag-rtl .ag-loading {
  padding-right: var(--ag-cell-horizontal-padding);
}

.ag-ltr .ag-loading-icon {
  padding-right: var(--ag-cell-widget-spacing);
}

.ag-rtl .ag-loading-icon {
  padding-left: var(--ag-cell-widget-spacing);
}

.ag-icon-loading {
  animation-name: spin;
  animation-duration: 1000ms;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.ag-floating-top {
  border-bottom: var(--ag-borders-critical) var(--ag-border-color);
}

.ag-floating-bottom {
  border-top: var(--ag-borders-critical) var(--ag-border-color);
}

.ag-ltr .ag-cell {
  border-right: var(--ag-cell-horizontal-border);
}

.ag-rtl .ag-cell {
  border-left: var(--ag-cell-horizontal-border);
}

.ag-ltr .ag-cell {
  border-right-width: 1px;
}

.ag-rtl .ag-cell {
  border-left-width: 1px;
}

.ag-cell.ag-cell-first-right-pinned:not(.ag-cell-range-left):not(.ag-cell-range-single-cell) {
  border-left: var(--ag-borders-critical) var(--ag-border-color);
}

.ag-cell.ag-cell-last-left-pinned:not(.ag-cell-range-right):not(.ag-cell-range-single-cell) {
  border-right: var(--ag-borders-critical) var(--ag-border-color);
}

.ag-cell-range-selected:not(.ag-cell-focus),
.ag-body-viewport:not(.ag-has-focus) .ag-cell-range-single-cell:not(.ag-cell-inline-editing) {
  background-color: var(--ag-range-selection-background-color);
}

.ag-cell-range-selected:not(.ag-cell-focus).ag-cell-range-chart,
.ag-body-viewport:not(.ag-has-focus) .ag-cell-range-single-cell:not(.ag-cell-inline-editing).ag-cell-range-chart {
  background-color: var(--ag-range-selection-chart-background-color) !important;
}

.ag-cell-range-selected:not(.ag-cell-focus).ag-cell-range-chart.ag-cell-range-chart-category,
.ag-body-viewport:not(.ag-has-focus) .ag-cell-range-single-cell:not(.ag-cell-inline-editing).ag-cell-range-chart.ag-cell-range-chart-category {
  background-color: var(--ag-range-selection-chart-category-background-color) !important;
}

.ag-cell-range-selected-1:not(.ag-cell-focus),
.ag-root:not(.ag-context-menu-open) .ag-body-viewport:not(.ag-has-focus) .ag-cell-range-selected-1:not(.ag-cell-inline-editing) {
  background-color: var(--ag-range-selection-background-color);
}

.ag-cell-range-selected-2:not(.ag-cell-focus),
.ag-body-viewport:not(.ag-has-focus) .ag-cell-range-selected-2 {
  background-color: var(--ag-range-selection-background-color-2);
}

.ag-cell-range-selected-3:not(.ag-cell-focus),
.ag-body-viewport:not(.ag-has-focus) .ag-cell-range-selected-3 {
  background-color: var(--ag-range-selection-background-color-3);
}

.ag-cell-range-selected-4:not(.ag-cell-focus),
.ag-body-viewport:not(.ag-has-focus) .ag-cell-range-selected-4 {
  background-color: var(--ag-range-selection-background-color-4);
}

.ag-cell.ag-cell-range-selected:not(.ag-cell-range-single-cell).ag-cell-range-top {
  border-top-color: var(--ag-range-selection-border-color);
  border-top-style: var(--ag-range-selection-border-style);
}

.ag-cell.ag-cell-range-selected:not(.ag-cell-range-single-cell).ag-cell-range-right {
  border-right-color: var(--ag-range-selection-border-color);
  border-right-style: var(--ag-range-selection-border-style);
}

.ag-cell.ag-cell-range-selected:not(.ag-cell-range-single-cell).ag-cell-range-bottom {
  border-bottom-color: var(--ag-range-selection-border-color);
  border-bottom-style: var(--ag-range-selection-border-style);
}

.ag-cell.ag-cell-range-selected:not(.ag-cell-range-single-cell).ag-cell-range-left {
  border-left-color: var(--ag-range-selection-border-color);
  border-left-style: var(--ag-range-selection-border-style);
}

.ag-ltr .ag-cell-focus:not(.ag-cell-range-selected):focus-within,
.ag-ltr .ag-context-menu-open .ag-cell-focus:not(.ag-cell-range-selected),
.ag-ltr .ag-full-width-row.ag-row-focus:focus .ag-cell-wrapper.ag-row-group,
.ag-ltr .ag-cell-range-single-cell,
.ag-ltr .ag-cell-range-single-cell.ag-cell-range-handle,
.ag-rtl .ag-cell-focus:not(.ag-cell-range-selected):focus-within,
.ag-rtl .ag-context-menu-open .ag-cell-focus:not(.ag-cell-range-selected),
.ag-rtl .ag-full-width-row.ag-row-focus:focus .ag-cell-wrapper.ag-row-group,
.ag-rtl .ag-cell-range-single-cell,
.ag-rtl .ag-cell-range-single-cell.ag-cell-range-handle {
  border: 1px solid;
  border-color: var(--ag-range-selection-border-color);
  border-style: var(--ag-range-selection-border-style);
  outline: initial;
}

.ag-cell.ag-selection-fill-top,
.ag-cell.ag-selection-fill-top.ag-cell-range-selected {
  border-top: 1px dashed;
  border-top-color: var(--ag-range-selection-border-color);
}

.ag-ltr .ag-cell.ag-selection-fill-right,
.ag-ltr .ag-cell.ag-selection-fill-right.ag-cell-range-selected {
  border-right: 1px dashed var(--ag-range-selection-border-color) !important;
}

.ag-rtl .ag-cell.ag-selection-fill-right,
.ag-rtl .ag-cell.ag-selection-fill-right.ag-cell-range-selected {
  border-left: 1px dashed var(--ag-range-selection-border-color) !important;
}

.ag-cell.ag-selection-fill-bottom,
.ag-cell.ag-selection-fill-bottom.ag-cell-range-selected {
  border-bottom: 1px dashed;
  border-bottom-color: var(--ag-range-selection-border-color);
}

.ag-ltr .ag-cell.ag-selection-fill-left,
.ag-ltr .ag-cell.ag-selection-fill-left.ag-cell-range-selected {
  border-left: 1px dashed var(--ag-range-selection-border-color) !important;
}

.ag-rtl .ag-cell.ag-selection-fill-left,
.ag-rtl .ag-cell.ag-selection-fill-left.ag-cell-range-selected {
  border-right: 1px dashed var(--ag-range-selection-border-color) !important;
}

.ag-fill-handle,
.ag-range-handle {
  position: absolute;
  width: 6px;
  height: 6px;
  bottom: -1px;
  background-color: var(--ag-range-selection-border-color);
}

.ag-ltr .ag-fill-handle,
.ag-ltr .ag-range-handle {
  right: -1px;
}

.ag-rtl .ag-fill-handle,
.ag-rtl .ag-range-handle {
  left: -1px;
}

.ag-fill-handle {
  cursor: cell;
}

.ag-range-handle {
  cursor: nwse-resize;
}

.ag-cell-inline-editing {
  border-color: var(--ag-input-focus-border-color) !important;
}

.ag-menu {
  border: var(--ag-borders) var(--ag-border-color);
  background: var(--ag-background-color);
  border-radius: var(--ag-card-radius);
  box-shadow: var(--ag-card-shadow);
  padding: var(--ag-grid-size);
  background-color: var(--ag-menu-background-color);
  border-color: var(--ag-menu-border-color);
  padding: 0;
}

.ag-menu.ag-tabs {
  min-width: var(--ag-tab-min-width);
}

.ag-menu-list {
  cursor: default;
  padding: var(--ag-grid-size) 0;
}

.ag-menu-separator {
  height: calc(var(--ag-grid-size) * 2 + 1px);
}

.ag-menu-separator-part::after {
  content: "";
  display: block;
  border-top: var(--ag-borders-critical) var(--ag-border-color);
}

.ag-menu-option-active,
.ag-compact-menu-option-active {
  background-color: var(--ag-row-hover-color);
}

.ag-menu-option-part,
.ag-compact-menu-option-part {
  line-height: var(--ag-icon-size);
  padding: calc(var(--ag-grid-size) + 2px) 0;
}

.ag-menu-option-disabled,
.ag-compact-menu-option-disabled {
  opacity: 0.5;
}

.ag-menu-option-icon,
.ag-compact-menu-option-icon {
  width: var(--ag-icon-size);
}

.ag-ltr .ag-menu-option-icon,
.ag-ltr .ag-compact-menu-option-icon {
  padding-left: calc(var(--ag-grid-size) * 2);
}

.ag-rtl .ag-menu-option-icon,
.ag-rtl .ag-compact-menu-option-icon {
  padding-right: calc(var(--ag-grid-size) * 2);
}

.ag-menu-option-text,
.ag-compact-menu-option-text {
  padding-left: calc(var(--ag-grid-size) * 2);
  padding-right: calc(var(--ag-grid-size) * 2);
}

.ag-ltr .ag-menu-option-shortcut,
.ag-ltr .ag-compact-menu-option-shortcut {
  padding-right: var(--ag-grid-size);
}

.ag-rtl .ag-menu-option-shortcut,
.ag-rtl .ag-compact-menu-option-shortcut {
  padding-left: var(--ag-grid-size);
}

.ag-ltr .ag-menu-option-popup-pointer,
.ag-ltr .ag-compact-menu-option-popup-pointer {
  padding-right: var(--ag-grid-size);
}

.ag-rtl .ag-menu-option-popup-pointer,
.ag-rtl .ag-compact-menu-option-popup-pointer {
  padding-left: var(--ag-grid-size);
}

.ag-tabs-header {
  display: flex;
}

.ag-tabs-header-wrapper {
  display: flex;
}

.ag-tabs-header-wrapper .ag-tabs-header {
  flex: 1;
}

.ag-tabs-close-button-wrapper {
  border: 0;
  border-right: var(--ag-borders) var(--ag-border-color);
  padding: var(--ag-grid-size);
}

.ag-tabs-close-button {
  border: 0;
  background-color: unset;
  cursor: pointer;
  padding: 0;
}

.ag-tab {
  border-bottom: var(--ag-selected-tab-underline-width) solid transparent;
  transition: border-bottom var(--ag-selected-tab-underline-transition-speed);
  display: flex;
  flex: none;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.ag-tab:focus-visible {
  outline: none;
}

.ag-tab:focus-visible::after {
  content: "";
  position: absolute;
  background-color: transparent;
  pointer-events: none;
  top: 4px;
  left: 4px;
  display: block;
  width: calc(100% - 8px);
  height: calc(100% - 8px);
  border: 1px solid;
  border-color: var(--ag-input-focus-border-color);
}

.ag-tab-selected {
  border-bottom-color: var(--ag-selected-tab-underline-color);
}

.ag-menu-header {
  color: var(--ag-secondary-foreground-color);
}

.ag-filter-separator {
  border-top: var(--ag-borders-critical) var(--ag-border-color);
}

.ag-filter-select .ag-picker-field-wrapper {
  width: 0;
}

.ag-filter-condition-operator {
  height: 17px;
}

.ag-ltr .ag-filter-condition-operator-or {
  margin-left: calc(var(--ag-grid-size) * 2);
}

.ag-rtl .ag-filter-condition-operator-or {
  margin-right: calc(var(--ag-grid-size) * 2);
}

.ag-set-filter-select-all {
  padding-top: var(--ag-widget-container-vertical-padding);
}

.ag-set-filter-list,
.ag-filter-no-matches {
  height: calc(var(--ag-list-item-height) * 6);
}

.ag-set-filter-tree-list {
  height: calc(var(--ag-list-item-height) * 10);
}

.ag-set-filter-filter {
  margin-top: var(--ag-widget-container-vertical-padding);
  margin-left: var(--ag-widget-container-horizontal-padding);
  margin-right: var(--ag-widget-container-horizontal-padding);
}

.ag-filter-to {
  margin-top: var(--ag-widget-vertical-spacing);
}

.ag-mini-filter {
  margin: var(--ag-widget-container-vertical-padding) var(--ag-widget-container-horizontal-padding);
}

.ag-set-filter {
  --ag-indentation-level: 0;
}

.ag-ltr .ag-set-filter-item {
  padding-left: calc(var(--ag-widget-container-horizontal-padding) + var(--ag-indentation-level) * var(--ag-set-filter-indent-size));
}

.ag-rtl .ag-set-filter-item {
  padding-right: calc(var(--ag-widget-container-horizontal-padding) + var(--ag-indentation-level) * var(--ag-set-filter-indent-size));
}

.ag-ltr .ag-set-filter-add-group-indent {
  margin-left: calc(var(--ag-icon-size) + var(--ag-widget-container-horizontal-padding));
}

.ag-rtl .ag-set-filter-add-group-indent {
  margin-right: calc(var(--ag-icon-size) + var(--ag-widget-container-horizontal-padding));
}

.ag-ltr .ag-set-filter-group-icons {
  margin-right: var(--ag-widget-container-horizontal-padding);
}

.ag-rtl .ag-set-filter-group-icons {
  margin-left: var(--ag-widget-container-horizontal-padding);
}

.ag-filter-menu .ag-set-filter-list {
  min-width: 200px;
}

.ag-filter-virtual-list-item:focus-visible {
  outline: none;
}

.ag-filter-virtual-list-item:focus-visible::after {
  content: "";
  position: absolute;
  background-color: transparent;
  pointer-events: none;
  top: 1px;
  left: 1px;
  display: block;
  width: calc(100% - 2px);
  height: calc(100% - 2px);
  border: 1px solid;
  border-color: var(--ag-input-focus-border-color);
}

.ag-filter-apply-panel {
  padding: var(--ag-widget-container-vertical-padding) var(--ag-widget-container-horizontal-padding);
  border-top: var(--ag-borders-secondary) var(--ag-secondary-border-color);
}

.ag-filter-apply-panel-button {
  line-height: 1.5;
}

.ag-ltr .ag-filter-apply-panel-button {
  margin-left: calc(var(--ag-grid-size) * 2);
}

.ag-rtl .ag-filter-apply-panel-button {
  margin-right: calc(var(--ag-grid-size) * 2);
}

.ag-simple-filter-body-wrapper {
  padding: var(--ag-widget-container-vertical-padding) var(--ag-widget-container-horizontal-padding);
  padding-bottom: calc(var(--ag-widget-container-vertical-padding) - var(--ag-widget-vertical-spacing));
  overflow-y: auto;
  min-height: calc(var(--ag-list-item-height) + var(--ag-widget-container-vertical-padding) + var(--ag-widget-vertical-spacing));
}

.ag-simple-filter-body-wrapper > * {
  margin-bottom: var(--ag-widget-vertical-spacing);
}

.ag-simple-filter-body-wrapper .ag-resizer-wrapper {
  margin: 0;
}

.ag-menu:not(.ag-tabs) .ag-filter .ag-filter-body-wrapper,
.ag-menu:not(.ag-tabs) .ag-filter > *:not(.ag-filter-wrapper) {
  min-width: calc(var(--ag-menu-min-width) - 2px);
}

.ag-filter-no-matches {
  padding: var(--ag-widget-container-vertical-padding) var(--ag-widget-container-horizontal-padding);
}

.ag-multi-filter-menu-item {
  margin: var(--ag-grid-size) 0;
}

.ag-multi-filter-group-title-bar {
  padding: calc(var(--ag-grid-size) * 2) var(--ag-grid-size);
  background-color: transparent;
}

.ag-group-filter-field-select-wrapper {
  padding: var(--ag-widget-container-vertical-padding) var(--ag-widget-container-horizontal-padding);
  padding-bottom: calc(var(--ag-widget-container-vertical-padding) - var(--ag-widget-vertical-spacing));
}

.ag-group-filter-field-select-wrapper > * {
  margin-bottom: var(--ag-widget-vertical-spacing);
}

.ag-multi-filter-group-title-bar:focus-visible {
  outline: none;
}

.ag-multi-filter-group-title-bar:focus-visible::after {
  content: "";
  position: absolute;
  background-color: transparent;
  pointer-events: none;
  top: 4px;
  left: 4px;
  display: block;
  width: calc(100% - 8px);
  height: calc(100% - 8px);
  border: 1px solid;
  border-color: var(--ag-input-focus-border-color);
}

.ag-side-bar {
  position: relative;
}

.ag-tool-panel-wrapper {
  width: var(--ag-side-bar-panel-width);
  background-color: var(--ag-control-panel-background-color);
}

.ag-side-buttons {
  padding-top: calc(var(--ag-grid-size) * 4);
  width: calc(var(--ag-icon-size) + 4px);
  position: relative;
  overflow: hidden;
}

button.ag-side-button-button {
  color: inherit;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  background: transparent;
  padding: calc(var(--ag-grid-size) * 2) 0 calc(var(--ag-grid-size) * 2) 0;
  width: 100%;
  margin: 0;
  min-height: calc(var(--ag-grid-size) * 18);
  background-position-y: center;
  background-position-x: center;
  background-repeat: no-repeat;
  border: none;
  border-top: var(--ag-borders-side-button) var(--ag-border-color);
  border-bottom: var(--ag-borders-side-button) var(--ag-border-color);
}

button.ag-side-button-button:focus {
  box-shadow: none;
}

.ag-side-button-button:focus-visible {
  outline: none;
}

.ag-side-button-button:focus-visible::after {
  content: "";
  position: absolute;
  background-color: transparent;
  pointer-events: none;
  top: 4px;
  left: 4px;
  display: block;
  width: calc(100% - 8px);
  height: calc(100% - 8px);
  border: 1px solid;
  border-color: var(--ag-input-focus-border-color);
}

.ag-selected button.ag-side-button-button {
  background-color: var(--ag-side-button-selected-background-color);
}

.ag-side-button-icon-wrapper {
  margin-bottom: 3px;
}

.ag-ltr .ag-side-bar-left,
.ag-rtl .ag-side-bar-right {
  border-right: var(--ag-borders) var(--ag-border-color);
}

.ag-ltr .ag-side-bar-left .ag-tool-panel-wrapper,
.ag-rtl .ag-side-bar-right .ag-tool-panel-wrapper {
  border-left: var(--ag-borders) var(--ag-border-color);
}

.ag-ltr .ag-side-bar-left .ag-side-button-button,
.ag-rtl .ag-side-bar-right .ag-side-button-button {
  border-right: var(--ag-selected-tab-underline-width) solid transparent;
  transition: border-right var(--ag-selected-tab-underline-transition-speed);
}

.ag-ltr .ag-side-bar-left .ag-selected .ag-side-button-button,
.ag-rtl .ag-side-bar-right .ag-selected .ag-side-button-button {
  border-right-color: var(--ag-selected-tab-underline-color);
}

.ag-rtl .ag-side-bar-left,
.ag-ltr .ag-side-bar-right {
  border-left: var(--ag-borders) var(--ag-border-color);
}

.ag-rtl .ag-side-bar-left .ag-tool-panel-wrapper,
.ag-ltr .ag-side-bar-right .ag-tool-panel-wrapper {
  border-right: var(--ag-borders) var(--ag-border-color);
}

.ag-rtl .ag-side-bar-left .ag-side-button-button,
.ag-ltr .ag-side-bar-right .ag-side-button-button {
  border-left: var(--ag-selected-tab-underline-width) solid transparent;
  transition: border-left var(--ag-selected-tab-underline-transition-speed);
}

.ag-rtl .ag-side-bar-left .ag-selected .ag-side-button-button,
.ag-ltr .ag-side-bar-right .ag-selected .ag-side-button-button {
  border-left-color: var(--ag-selected-tab-underline-color);
}

.ag-filter-toolpanel-header {
  height: calc(var(--ag-grid-size) * 6);
}

.ag-filter-toolpanel-header,
.ag-filter-toolpanel-search {
  padding: 0 var(--ag-grid-size);
}

.ag-filter-toolpanel-header:focus-visible {
  outline: none;
}

.ag-filter-toolpanel-header:focus-visible::after {
  content: "";
  position: absolute;
  background-color: transparent;
  pointer-events: none;
  top: 4px;
  left: 4px;
  display: block;
  width: calc(100% - 8px);
  height: calc(100% - 8px);
  border: 1px solid;
  border-color: var(--ag-input-focus-border-color);
}

.ag-filter-toolpanel-group:not(.ag-has-filter) > .ag-group-title-bar .ag-filter-toolpanel-group-instance-header-icon {
  display: none;
}

.ag-filter-toolpanel-group-level-0-header {
  height: calc(var(--ag-grid-size) * 8);
}

.ag-filter-toolpanel-group-item {
  margin-top: calc(var(--ag-grid-size) * 0.5);
  margin-bottom: calc(var(--ag-grid-size) * 0.5);
}

.ag-filter-toolpanel-search {
  height: var(--ag-header-height);
}

.ag-filter-toolpanel-search-input {
  flex-grow: 1;
  height: calc(var(--ag-grid-size) * 4);
}

.ag-ltr .ag-filter-toolpanel-search-input {
  margin-right: var(--ag-grid-size);
}

.ag-rtl .ag-filter-toolpanel-search-input {
  margin-left: var(--ag-grid-size);
}

.ag-filter-toolpanel-group-level-0 {
  border-top: var(--ag-borders-secondary) var(--ag-secondary-border-color);
}

.ag-ltr .ag-filter-toolpanel-expand,
.ag-ltr .ag-filter-toolpanel-group-title-bar-icon {
  margin-right: var(--ag-grid-size);
}

.ag-rtl .ag-filter-toolpanel-expand,
.ag-rtl .ag-filter-toolpanel-group-title-bar-icon {
  margin-left: var(--ag-grid-size);
}

.ag-filter-toolpanel-group-title-bar {
  background-color: transparent;
}

.ag-ltr .ag-filter-toolpanel-header {
  padding-left: calc(var(--ag-filter-tool-panel-group-indent) * var(--ag-indentation-level, 0) + var(--ag-grid-size));
}

.ag-rtl .ag-filter-toolpanel-header {
  padding-right: calc(var(--ag-filter-tool-panel-group-indent) * var(--ag-indentation-level, 0) + var(--ag-grid-size));
}

.ag-filter-toolpanel-instance-filter {
  border-bottom: var(--ag-borders) var(--ag-border-color);
  border-top: var(--ag-borders) var(--ag-border-color);
  margin-top: var(--ag-grid-size);
}

.ag-ltr .ag-filter-toolpanel-group-instance-header-icon,
.ag-ltr .ag-filter-toolpanel-instance-header-icon {
  margin-left: var(--ag-grid-size);
}

.ag-rtl .ag-filter-toolpanel-group-instance-header-icon,
.ag-rtl .ag-filter-toolpanel-instance-header-icon {
  margin-right: var(--ag-grid-size);
}

.ag-set-filter-group-icons {
  color: var(--ag-secondary-foreground-color);
}

.ag-pivot-mode-panel {
  min-height: var(--ag-header-height);
  height: var(--ag-header-height);
  display: flex;
}

.ag-pivot-mode-select {
  display: flex;
  align-items: center;
}

.ag-ltr .ag-pivot-mode-select {
  margin-left: var(--ag-widget-container-horizontal-padding);
}

.ag-rtl .ag-pivot-mode-select {
  margin-right: var(--ag-widget-container-horizontal-padding);
}

.ag-column-select-header:focus-visible {
  outline: none;
}

.ag-column-select-header:focus-visible::after {
  content: "";
  position: absolute;
  background-color: transparent;
  pointer-events: none;
  top: 4px;
  left: 4px;
  display: block;
  width: calc(100% - 8px);
  height: calc(100% - 8px);
  border: 1px solid;
  border-color: var(--ag-input-focus-border-color);
}

.ag-column-select-header {
  height: var(--ag-header-height);
  align-items: center;
  padding: 0 var(--ag-widget-container-horizontal-padding);
  border-bottom: var(--ag-borders-secondary) var(--ag-secondary-border-color);
}

.ag-column-panel-column-select {
  border-bottom: var(--ag-borders-secondary) var(--ag-secondary-border-color);
  border-top: var(--ag-borders-secondary) var(--ag-secondary-border-color);
}

.ag-column-group-icons,
.ag-column-select-header-icon {
  color: var(--ag-secondary-foreground-color);
}

.ag-column-select-list .ag-list-item-hovered::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 1px;
  background-color: var(--ag-range-selection-border-color);
}

.ag-column-select-list .ag-item-highlight-top::after {
  top: 0;
}

.ag-column-select-list .ag-item-highlight-bottom::after {
  bottom: 0;
}

.ag-header,
.ag-advanced-filter-header {
  background-color: var(--ag-header-background-color);
  border-bottom: var(--ag-borders-critical) var(--ag-border-color);
}

.ag-header-row {
  color: var(--ag-header-foreground-color);
  height: var(--ag-header-height);
}

.ag-pinned-right-header {
  border-left: var(--ag-borders-critical) var(--ag-border-color);
}

.ag-pinned-left-header {
  border-right: var(--ag-borders-critical) var(--ag-border-color);
}

.ag-ltr .ag-header-cell:not(.ag-right-aligned-header) .ag-header-label-icon,
.ag-ltr .ag-header-cell:not(.ag-right-aligned-header) .ag-header-menu-icon {
  margin-left: var(--ag-grid-size);
}

.ag-rtl .ag-header-cell:not(.ag-right-aligned-header) .ag-header-label-icon,
.ag-rtl .ag-header-cell:not(.ag-right-aligned-header) .ag-header-menu-icon {
  margin-right: var(--ag-grid-size);
}

.ag-ltr .ag-header-cell.ag-right-aligned-header .ag-header-label-icon,
.ag-ltr .ag-header-cell.ag-right-aligned-header .ag-header-menu-icon {
  margin-right: var(--ag-grid-size);
}

.ag-rtl .ag-header-cell.ag-right-aligned-header .ag-header-label-icon,
.ag-rtl .ag-header-cell.ag-right-aligned-header .ag-header-menu-icon {
  margin-left: var(--ag-grid-size);
}

.ag-header-cell,
.ag-header-group-cell {
  padding-left: var(--ag-cell-horizontal-padding);
  padding-right: var(--ag-cell-horizontal-padding);
}

.ag-header-cell.ag-header-cell-moving,
.ag-header-group-cell.ag-header-cell-moving {
  background-color: var(--ag-header-cell-moving-background-color);
}

.ag-ltr .ag-header-group-cell-label.ag-sticky-label {
  left: var(--ag-cell-horizontal-padding);
}

.ag-rtl .ag-header-group-cell-label.ag-sticky-label {
  right: var(--ag-cell-horizontal-padding);
}

.ag-header-cell:focus-visible {
  outline: none;
}

.ag-header-cell:focus-visible::after {
  content: "";
  position: absolute;
  background-color: transparent;
  pointer-events: none;
  top: 4px;
  left: 4px;
  display: block;
  width: calc(100% - 8px);
  height: calc(100% - 8px);
  border: 1px solid;
  border-color: var(--ag-input-focus-border-color);
}

.ag-header-group-cell:focus-visible {
  outline: none;
}

.ag-header-group-cell:focus-visible::after {
  content: "";
  position: absolute;
  background-color: transparent;
  pointer-events: none;
  top: 4px;
  left: 4px;
  display: block;
  width: calc(100% - 8px);
  height: calc(100% - 8px);
  border: 1px solid;
  border-color: var(--ag-input-focus-border-color);
}

.ag-advanced-filter-header-cell:focus-visible {
  outline: none;
}

.ag-advanced-filter-header-cell:focus-visible::after {
  content: "";
  position: absolute;
  background-color: transparent;
  pointer-events: none;
  top: 4px;
  left: 4px;
  display: block;
  width: calc(100% - 8px);
  height: calc(100% - 8px);
  border: 1px solid;
  border-color: var(--ag-input-focus-border-color);
}

.ag-header-icon {
  color: var(--ag-secondary-foreground-color);
}

.ag-header-expand-icon {
  cursor: pointer;
}

.ag-ltr .ag-header-expand-icon {
  margin-left: 4px;
}

.ag-rtl .ag-header-expand-icon {
  margin-right: 4px;
}

.ag-header-row:not(:first-child) .ag-header-cell:not(.ag-header-span-height.ag-header-span-total),
.ag-header-row:not(:first-child) .ag-header-group-cell.ag-header-group-cell-with-group {
  border-top: var(--ag-borders-critical) var(--ag-border-color);
}

.ag-header-group-cell:not(.ag-column-resizing) + .ag-header-group-cell:not(.ag-column-hover):not(.ag-header-cell-moving):hover, .ag-header-group-cell:not(.ag-column-resizing) + .ag-header-group-cell:not(.ag-column-hover).ag-column-resizing,
.ag-header-cell:not(.ag-column-resizing) + .ag-header-cell:not(.ag-column-hover):not(.ag-header-cell-moving):hover,
.ag-header-cell:not(.ag-column-resizing) + .ag-header-cell:not(.ag-column-hover).ag-column-resizing,
.ag-header-group-cell:first-of-type:not(.ag-header-cell-moving):hover,
.ag-header-group-cell:first-of-type.ag-column-resizing,
.ag-header-cell:not(.ag-column-hover):first-of-type:not(.ag-header-cell-moving):hover,
.ag-header-cell:not(.ag-column-hover):first-of-type.ag-column-resizing {
  background-color: var(--ag-header-cell-hover-background-color);
}

.ag-header-cell::before,
.ag-header-group-cell:not(.ag-header-span-height.ag-header-group-cell-no-group)::before {
  content: "";
  position: absolute;
  z-index: 1;
  display: var(--ag-header-column-separator-display);
  width: var(--ag-header-column-separator-width);
  height: var(--ag-header-column-separator-height);
  top: calc(50% - var(--ag-header-column-separator-height) * 0.5);
  background-color: var(--ag-header-column-separator-color);
}

.ag-ltr .ag-header-cell::before,
.ag-ltr .ag-header-group-cell:not(.ag-header-span-height.ag-header-group-cell-no-group)::before {
  right: 0;
}

.ag-rtl .ag-header-cell::before,
.ag-rtl .ag-header-group-cell:not(.ag-header-span-height.ag-header-group-cell-no-group)::before {
  left: 0;
}

.ag-header-cell-resize {
  display: flex;
  align-items: center;
}

.ag-header-cell-resize::after {
  content: "";
  position: absolute;
  z-index: 1;
  display: var(--ag-header-column-resize-handle-display);
  width: var(--ag-header-column-resize-handle-width);
  height: var(--ag-header-column-resize-handle-height);
  top: calc(50% - var(--ag-header-column-resize-handle-height) * 0.5);
  background-color: var(--ag-header-column-resize-handle-color);
}

.ag-header-cell.ag-header-span-height .ag-header-cell-resize::after {
  height: calc(100% - var(--ag-grid-size) * 4);
  top: calc(var(--ag-grid-size) * 2);
}

.ag-ltr .ag-header-viewport .ag-header-cell-resize::after {
  left: calc(50% - var(--ag-header-column-resize-handle-width));
}

.ag-rtl .ag-header-viewport .ag-header-cell-resize::after {
  right: calc(50% - var(--ag-header-column-resize-handle-width));
}

.ag-pinned-left-header .ag-header-cell-resize::after {
  left: calc(50% - var(--ag-header-column-resize-handle-width));
}

.ag-pinned-right-header .ag-header-cell-resize::after {
  left: 50%;
}

.ag-ltr .ag-header-select-all {
  margin-right: var(--ag-cell-horizontal-padding);
}

.ag-rtl .ag-header-select-all {
  margin-left: var(--ag-cell-horizontal-padding);
}

.ag-ltr .ag-floating-filter-button {
  margin-left: var(--ag-cell-widget-spacing);
}

.ag-rtl .ag-floating-filter-button {
  margin-right: var(--ag-cell-widget-spacing);
}

.ag-floating-filter-button-button {
  color: inherit;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  appearance: none;
  background: transparent;
  border: none;
  height: var(--ag-icon-size);
  padding: 0;
  width: var(--ag-icon-size);
}

.ag-filter-loading {
  background-color: var(--ag-control-panel-background-color);
  height: 100%;
  padding: var(--ag-widget-container-vertical-padding) var(--ag-widget-container-horizontal-padding);
  position: absolute;
  width: 100%;
  z-index: 1;
}

.ag-paging-panel {
  border-top: 1px solid;
  border-top-color: var(--ag-border-color);
  color: var(--ag-secondary-foreground-color);
  height: var(--ag-header-height);
}

.ag-paging-panel > * {
  margin: 0 var(--ag-cell-horizontal-padding);
}

.ag-paging-panel > .ag-paging-page-size .ag-wrapper {
  min-width: calc(var(--ag-grid-size) * 10);
}

.ag-paging-button {
  cursor: pointer;
}

.ag-paging-button.ag-disabled {
  cursor: default;
  color: var(--ag-disabled-foreground-color);
}

.ag-paging-button:focus-visible {
  outline: none;
}

.ag-paging-button:focus-visible::after {
  content: "";
  position: absolute;
  background-color: transparent;
  pointer-events: none;
  top: 0px;
  left: 0px;
  display: block;
  width: calc(100% - 0px);
  height: calc(100% - 0px);
  border: 1px solid;
  border-color: var(--ag-input-focus-border-color);
}

.ag-paging-button,
.ag-paging-description {
  margin: 0 var(--ag-grid-size);
}

.ag-status-bar {
  border-top: var(--ag-borders) var(--ag-border-color);
  color: var(--ag-disabled-foreground-color);
  padding-right: calc(var(--ag-grid-size) * 4);
  padding-left: calc(var(--ag-grid-size) * 4);
  line-height: 1.5;
}

.ag-status-name-value-value {
  color: var(--ag-foreground-color);
}

.ag-status-bar-center {
  text-align: center;
}

.ag-status-name-value {
  margin-left: var(--ag-grid-size);
  margin-right: var(--ag-grid-size);
  padding-top: calc(var(--ag-grid-size) * 2);
  padding-bottom: calc(var(--ag-grid-size) * 2);
}

.ag-column-drop-cell {
  background: var(--ag-chip-background-color);
  border-radius: calc(var(--ag-grid-size) * 4);
  height: calc(var(--ag-grid-size) * 4);
  padding: 0 calc(var(--ag-grid-size) * 0.5);
  border: 1px solid var(--ag-chip-border-color);
}

.ag-column-drop-cell:focus-visible {
  outline: none;
}

.ag-column-drop-cell:focus-visible::after {
  content: "";
  position: absolute;
  background-color: transparent;
  pointer-events: none;
  top: 2px;
  left: 2px;
  display: block;
  width: calc(100% - 4px);
  height: calc(100% - 4px);
  border: 1px solid;
  border-color: var(--ag-input-focus-border-color);
}

.ag-column-drop-cell-text {
  margin: 0 var(--ag-grid-size);
}

.ag-column-drop-cell-button {
  min-width: calc(var(--ag-grid-size) * 4);
  margin: 0 calc(var(--ag-grid-size) * 0.5);
  color: var(--ag-secondary-foreground-color);
}

.ag-column-drop-cell-drag-handle {
  margin-left: calc(var(--ag-grid-size) * 2);
}

.ag-column-drop-cell-ghost {
  opacity: 0.5;
}

.ag-column-drop-horizontal {
  background-color: var(--ag-header-background-color);
  color: var(--ag-secondary-foreground-color);
  height: var(--ag-header-height);
  border-bottom: var(--ag-borders) var(--ag-border-color);
}

.ag-ltr .ag-column-drop-horizontal {
  padding-left: var(--ag-cell-horizontal-padding);
}

.ag-rtl .ag-column-drop-horizontal {
  padding-right: var(--ag-cell-horizontal-padding);
}

.ag-ltr .ag-column-drop-horizontal-half-width:not(:last-child) {
  border-right: var(--ag-borders) var(--ag-border-color);
}

.ag-rtl .ag-column-drop-horizontal-half-width:not(:last-child) {
  border-left: var(--ag-borders) var(--ag-border-color);
}

.ag-column-drop-horizontal-cell-separator {
  margin: 0 var(--ag-grid-size);
  color: var(--ag-secondary-foreground-color);
}

.ag-column-drop-horizontal-empty-message {
  color: var(--ag-disabled-foreground-color);
}

.ag-ltr .ag-column-drop-horizontal-icon {
  margin-right: var(--ag-cell-horizontal-padding);
}

.ag-rtl .ag-column-drop-horizontal-icon {
  margin-left: var(--ag-cell-horizontal-padding);
}

.ag-column-drop-vertical-list {
  padding-bottom: var(--ag-grid-size);
  padding-right: var(--ag-grid-size);
  padding-left: var(--ag-grid-size);
}

.ag-column-drop-vertical-cell {
  margin-top: var(--ag-grid-size);
}

.ag-column-drop-vertical {
  min-height: 50px;
  border-bottom: var(--ag-borders-secondary) var(--ag-secondary-border-color);
}

.ag-column-drop-vertical.ag-last-column-drop {
  border-bottom: none;
}

.ag-column-drop-vertical-icon {
  margin-left: var(--ag-grid-size);
  margin-right: var(--ag-grid-size);
}

.ag-column-drop-vertical-empty-message {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  overflow: hidden;
  color: var(--ag-disabled-foreground-color);
  margin-top: var(--ag-grid-size);
}

.ag-select-agg-func-popup {
  border: var(--ag-borders) var(--ag-border-color);
  background: var(--ag-background-color);
  border-radius: var(--ag-card-radius);
  box-shadow: var(--ag-card-shadow);
  padding: var(--ag-grid-size);
  background: var(--ag-background-color);
  height: calc(var(--ag-grid-size) * 5 * 3.5);
  padding: 0;
}

.ag-select-agg-func-virtual-list-item {
  cursor: default;
}

.ag-ltr .ag-select-agg-func-virtual-list-item {
  padding-left: calc(var(--ag-grid-size) * 2);
}

.ag-rtl .ag-select-agg-func-virtual-list-item {
  padding-right: calc(var(--ag-grid-size) * 2);
}

.ag-select-agg-func-virtual-list-item:hover {
  background-color: var(--ag-selected-row-background-color);
}

.ag-select-agg-func-virtual-list-item:focus-visible {
  outline: none;
}

.ag-select-agg-func-virtual-list-item:focus-visible::after {
  content: "";
  position: absolute;
  background-color: transparent;
  pointer-events: none;
  top: 1px;
  left: 1px;
  display: block;
  width: calc(100% - 2px);
  height: calc(100% - 2px);
  border: 1px solid;
  border-color: var(--ag-input-focus-border-color);
}

.ag-sort-indicator-container {
  display: flex;
}

.ag-ltr .ag-sort-indicator-icon {
  padding-left: var(--ag-grid-size);
}

.ag-rtl .ag-sort-indicator-icon {
  padding-right: var(--ag-grid-size);
}

.ag-chart {
  position: relative;
  display: flex;
  width: 100%;
  height: 100%;
}

.ag-chart-components-wrapper {
  position: relative;
  display: flex;
  flex: 1 1 auto;
}

.ag-chart-canvas-wrapper {
  position: relative;
  flex: 1 1 auto;
}

.ag-chart-menu {
  position: absolute;
  top: 16px;
  display: flex;
  flex-direction: column;
}

.ag-ltr .ag-chart-menu {
  right: 20px;
}

.ag-rtl .ag-chart-menu {
  left: 20px;
}

.ag-chart-docked-container {
  position: relative;
  min-width: var(--ag-chart-menu-panel-width);
}

.ag-chart-menu-hidden ~ .ag-chart-docked-container {
  display: none;
}

.ag-chart-tabbed-menu {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.ag-chart-tabbed-menu-header {
  flex: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: default;
}

.ag-chart-tabbed-menu-body {
  display: flex;
  flex: 1 1 auto;
  align-items: stretch;
  overflow: hidden;
}

.ag-chart-tab {
  width: 100%;
  overflow: hidden;
  overflow-y: auto;
}

.ag-chart-settings {
  overflow-x: hidden;
}

.ag-chart-settings-wrapper {
  position: relative;
  flex-direction: column;
  width: 100%;
  height: 100%;
  display: flex;
  overflow: hidden;
}

.ag-chart-settings-nav-bar {
  display: flex;
  align-items: center;
  width: 100%;
  height: 30px;
  padding: 0 10px;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.ag-chart-settings-card-selector {
  display: flex;
  align-items: center;
  justify-content: space-around;
  flex: 1 1 auto;
  height: 100%;
  padding: 0 10px;
}

.ag-chart-settings-card-item {
  cursor: pointer;
  width: 10px;
  height: 10px;
  background-color: #000;
  position: relative;
}

.ag-chart-settings-card-item.ag-not-selected {
  opacity: 0.2;
}

.ag-chart-settings-card-item::before {
  content: " ";
  display: block;
  position: absolute;
  background-color: transparent;
  left: 50%;
  top: 50%;
  margin-left: -10px;
  margin-top: -10px;
  width: 20px;
  height: 20px;
}

.ag-chart-settings-prev,
.ag-chart-settings-next {
  position: relative;
  flex: none;
}

.ag-chart-settings-prev:focus-within,
.ag-chart-settings-next:focus-within {
  box-shadow: var(--ag-input-focus-box-shadow);
  border-radius: 1px;
}

.ag-chart-settings-prev-button,
.ag-chart-settings-next-button {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
  opacity: 0;
}

.ag-chart-settings-mini-charts-container {
  position: relative;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
}

.ag-chart-settings-mini-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  flex-direction: column;
  width: 100%;
  min-height: 100%;
  overflow: hidden;
}

.ag-chart-settings-mini-wrapper.ag-animating {
  transition: left 0.3s;
  transition-timing-function: ease-in-out;
}

.ag-chart-mini-thumbnail {
  cursor: pointer;
}

.ag-chart-mini-thumbnail-canvas {
  display: block;
}

.ag-chart-data-wrapper,
.ag-chart-format-wrapper,
.ag-chart-advanced-settings-wrapper {
  display: flex;
  flex-direction: column;
  position: relative;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  padding-bottom: 16px;
}

.ag-chart-data-wrapper,
.ag-chart-advanced-settings-wrapper {
  height: 100%;
  overflow-y: auto;
}

.ag-chart-advanced-settings {
  background-color: var(--ag-control-panel-background-color);
}

.ag-chart-advanced-settings-wrapper,
.ag-chart-advanced-settings {
  width: 100%;
}

.ag-chart-advanced-settings-wrapper {
  padding-bottom: 0;
}

.ag-chart-data-section,
.ag-chart-format-section,
.ag-chart-advanced-settings-section {
  display: flex;
  margin: 0;
}

.ag-chart-advanced-settings-section {
  padding-top: var(--ag-grid-size);
  padding-bottom: var(--ag-grid-size);
}

.ag-chart-advanced-settings-section:not(:last-child) {
  border-bottom: 1px solid var(--ag-secondary-border-color);
}

.ag-chart-empty-text {
  display: flex;
  top: 0;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  background-color: var(--ag-background-color);
}

.ag-chart .ag-chart-menu {
  display: none;
}

.ag-chart-menu-hidden:hover .ag-chart-menu {
  display: block;
}

.ag-chart .ag-chart-menu-wrapper .ag-chart-menu {
  display: flex;
  flex-direction: row;
  top: 8px;
  gap: 20px;
  width: auto;
}

.ag-ltr .ag-chart .ag-chart-menu-wrapper .ag-chart-menu {
  right: calc(var(--ag-cell-horizontal-padding) + var(--ag-grid-size) - 4px);
  justify-content: right;
}

.ag-rtl .ag-chart .ag-chart-menu-wrapper .ag-chart-menu {
  left: calc(var(--ag-cell-horizontal-padding) + var(--ag-grid-size) - 4px);
  justify-content: left;
}

.ag-charts-font-size-color {
  display: flex;
  align-self: stretch;
  justify-content: space-between;
}

.ag-charts-data-group-item {
  position: relative;
}

.ag-charts-data-group-item:not(:last-child) {
  margin-bottom: var(--ag-grid-size);
}

.ag-chart-menu {
  border-radius: var(--ag-card-radius);
  background: var(--ag-background-color);
}

.ag-chart-menu-icon {
  opacity: 0.5;
  margin: 2px 0;
  cursor: pointer;
  border-radius: var(--ag-card-radius);
  color: var(--ag-secondary-foreground-color);
}

.ag-chart-menu-icon:hover {
  opacity: 1;
}

.ag-chart-menu-toolbar-button {
  border: 0;
  background-color: unset;
  padding: 0 2px;
  border-radius: 1px;
}

.ag-chart-mini-thumbnail {
  border: 1px solid var(--ag-secondary-border-color);
  border-radius: 5px;
}

.ag-chart-mini-thumbnail.ag-selected {
  border-color: var(--ag-minichart-selected-chart-color);
  border-width: 2px;
}

.ag-chart-mini-thumbnail:focus-visible {
  outline: none;
  border-color: var(--ag-minichart-selected-chart-color);
  box-shadow: var(--ag-input-focus-box-shadow);
}

.ag-chart-settings-card-item {
  background: var(--ag-foreground-color);
  width: 8px;
  height: 8px;
  border-radius: 4px;
}

.ag-chart-settings-card-item.ag-selected {
  background-color: var(--ag-minichart-selected-page-color);
}

.ag-chart-data-column-drag-handle {
  margin-left: var(--ag-grid-size);
}

.ag-charts-settings-group-title-bar,
.ag-charts-data-group-title-bar,
.ag-charts-format-top-level-group-title-bar {
  border-top: var(--ag-borders-secondary) var(--ag-secondary-border-color);
  position: relative;
}

.ag-charts-advanced-settings-top-level-group-title-bar {
  position: relative;
  background-color: unset;
}

.ag-charts-data-group-title-bar:focus-visible {
  outline: none;
}

.ag-charts-data-group-title-bar:focus-visible::after {
  content: "";
  position: absolute;
  background-color: transparent;
  pointer-events: none;
  top: 4px;
  left: 4px;
  display: block;
  width: calc(100% - 8px);
  height: calc(100% - 8px);
  border: 1px solid;
  border-color: var(--ag-input-focus-border-color);
}

.ag-charts-format-top-level-group-title-bar:focus-visible {
  outline: none;
}

.ag-charts-format-top-level-group-title-bar:focus-visible::after {
  content: "";
  position: absolute;
  background-color: transparent;
  pointer-events: none;
  top: 4px;
  left: 4px;
  display: block;
  width: calc(100% - 8px);
  height: calc(100% - 8px);
  border: 1px solid;
  border-color: var(--ag-input-focus-border-color);
}

.ag-charts-data-group-title-bar .ag-charts-data-group-title,
.ag-charts-format-top-level-group-title-bar .ag-charts-format-top-level-group-title {
  cursor: pointer;
}

.ag-charts-data-group-container {
  padding: calc(var(--ag-widget-container-vertical-padding) * 0.5) var(--ag-widget-container-horizontal-padding);
}

.ag-charts-data-group-container .ag-charts-data-group-item:not(.ag-charts-format-sub-level-group):not(.ag-pill-select):not(.ag-select) {
  height: var(--ag-list-item-height);
}

.ag-charts-data-group-container .ag-charts-data-group-item.ag-picker-field {
  margin-top: var(--ag-grid-size);
}

.ag-charts-data-group-container .ag-list-item-hovered::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 1px;
  background-color: var(--ag-range-selection-border-color);
}

.ag-charts-data-group-container .ag-item-highlight-top::after {
  top: 0;
}

.ag-charts-data-group-container .ag-item-highlight-bottom::after {
  bottom: 0;
}

.ag-charts-format-top-level-group-container,
.ag-charts-advanced-settings-top-level-group-container {
  padding: var(--ag-grid-size);
}

.ag-ltr .ag-charts-format-top-level-group-container,
.ag-ltr .ag-charts-advanced-settings-top-level-group-container {
  margin-left: calc(var(--ag-grid-size) * 2);
}

.ag-rtl .ag-charts-format-top-level-group-container,
.ag-rtl .ag-charts-advanced-settings-top-level-group-container {
  margin-right: calc(var(--ag-grid-size) * 2);
}

.ag-charts-format-top-level-group-item,
.ag-charts-advanced-settings-top-level-group-item {
  margin: var(--ag-grid-size) 0;
}

.ag-charts-format-sub-level-group-container {
  padding: var(--ag-widget-container-vertical-padding) var(--ag-widget-container-horizontal-padding);
  padding-bottom: calc(var(--ag-widget-container-vertical-padding) - var(--ag-widget-vertical-spacing));
}

.ag-charts-format-sub-level-group-container > * {
  margin-bottom: var(--ag-widget-vertical-spacing);
}

.ag-charts-format-sub-level-no-header-group-container > * {
  margin-bottom: var(--ag-widget-vertical-spacing);
}

.ag-charts-format-sub-level-group-container .ag-charts-format-sub-level-group-item.ag-font-panel-no-header {
  margin: 0;
}

.ag-charts-settings-group-container {
  padding: var(--ag-grid-size);
  row-gap: 8px;
  display: grid;
  grid-template-columns: 60px 1fr 60px 1fr 60px;
}

.ag-charts-settings-group-container .ag-chart-mini-thumbnail:nth-child(3n+1) {
  grid-column: 1;
}

.ag-charts-settings-group-container .ag-chart-mini-thumbnail:nth-child(3n+2) {
  grid-column: 3;
}

.ag-charts-settings-group-container .ag-chart-mini-thumbnail:nth-child(3n+3) {
  grid-column: 5;
}

.ag-chart-menu-panel {
  background-color: var(--ag-control-panel-background-color);
}

.ag-ltr .ag-chart-menu-panel {
  border-left: solid 1px var(--ag-border-color);
}

.ag-rtl .ag-chart-menu-panel {
  border-right: solid 1px var(--ag-border-color);
}

.ag-charts-theme-default {
  --ag-charts-align: none !important;
  --ag-charts-justify: none !important;
}

.ag-date-time-list-page-title-bar {
  display: flex;
}

.ag-date-time-list-page-title {
  flex-grow: 1;
  text-align: center;
}

.ag-date-time-list-page-column-labels-row,
.ag-date-time-list-page-entries-row {
  display: flex;
}

.ag-date-time-list-page-column-label,
.ag-date-time-list-page-entry {
  flex-basis: 0;
  flex-grow: 1;
}

.ag-date-time-list-page-entry {
  cursor: pointer;
  text-align: center;
}

.ag-date-time-list-page-column-label {
  text-align: center;
}

.ag-advanced-filter-header {
  position: relative;
  display: flex;
  align-items: center;
  padding-left: var(--ag-cell-horizontal-padding);
  padding-right: var(--ag-cell-horizontal-padding);
}

.ag-advanced-filter {
  display: flex;
  align-items: center;
  width: 100%;
}

.ag-advanced-filter-apply-button,
.ag-advanced-filter-builder-button {
  line-height: normal;
  white-space: nowrap;
}

.ag-ltr .ag-advanced-filter-apply-button,
.ag-ltr .ag-advanced-filter-builder-button {
  margin-left: calc(var(--ag-grid-size) * 2);
}

.ag-rtl .ag-advanced-filter-apply-button,
.ag-rtl .ag-advanced-filter-builder-button {
  margin-right: calc(var(--ag-grid-size) * 2);
}

.ag-advanced-filter-builder-button {
  display: flex;
  align-items: center;
  border: 0;
  background-color: unset;
  color: var(--ag-foreground-color);
  font-size: var(--ag-font-size);
  font-weight: 600;
}

.ag-advanced-filter-builder-button:hover:not(:disabled) {
  background-color: var(--ag-row-hover-color);
}

.ag-advanced-filter-builder-button:not(:disabled) {
  cursor: pointer;
}

.ag-advanced-filter-builder-button-label {
  margin-left: var(--ag-grid-size);
}

.ag-advanced-filter-builder {
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  width: 100%;
  background-color: var(--ag-control-panel-background-color);
  display: flex;
  flex-direction: column;
}

.ag-advanced-filter-builder-list {
  flex: 1;
  overflow: auto;
}

.ag-advanced-filter-builder-list .ag-list-item-hovered::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 1px;
  background-color: var(--ag-range-selection-border-color);
}

.ag-advanced-filter-builder-list .ag-item-highlight-top::after {
  top: 0;
}

.ag-advanced-filter-builder-list .ag-item-highlight-bottom::after {
  bottom: 0;
}

.ag-advanced-filter-builder-button-panel {
  display: flex;
  justify-content: flex-end;
  padding: var(--ag-widget-container-vertical-padding) var(--ag-widget-container-horizontal-padding);
  border-top: var(--ag-borders-secondary) var(--ag-secondary-border-color);
}

.ag-advanced-filter-builder .ag-advanced-filter-builder-button-panel .ag-advanced-filter-builder-apply-button,
.ag-advanced-filter-builder .ag-advanced-filter-builder-button-panel .ag-advanced-filter-builder-cancel-button {
  margin-left: calc(var(--ag-grid-size) * 2);
}

.ag-advanced-filter-builder-item-wrapper {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  justify-content: space-between;
  overflow: hidden;
  padding-left: calc(var(--ag-icon-size) / 2);
  padding-right: var(--ag-icon-size);
}

.ag-virtual-list-viewport .ag-advanced-filter-builder-item-wrapper .ag-tab-guard {
  position: absolute;
}

.ag-advanced-filter-builder-item-tree-lines > * {
  width: var(--ag-advanced-filter-builder-indent-size);
}

.ag-advanced-filter-builder-item-tree-lines .ag-advanced-filter-builder-item-tree-line-root {
  width: var(--ag-icon-size);
}

.ag-advanced-filter-builder-item-tree-lines .ag-advanced-filter-builder-item-tree-line-root::before {
  top: 50%;
  height: 50%;
}

.ag-advanced-filter-builder-item-tree-line-horizontal,
.ag-advanced-filter-builder-item-tree-line-vertical,
.ag-advanced-filter-builder-item-tree-line-vertical-top,
.ag-advanced-filter-builder-item-tree-line-vertical-bottom {
  position: relative;
  height: 100%;
  display: flex;
  align-items: center;
}

.ag-advanced-filter-builder-item-tree-line-horizontal::before, .ag-advanced-filter-builder-item-tree-line-horizontal::after,
.ag-advanced-filter-builder-item-tree-line-vertical::before,
.ag-advanced-filter-builder-item-tree-line-vertical::after,
.ag-advanced-filter-builder-item-tree-line-vertical-top::before,
.ag-advanced-filter-builder-item-tree-line-vertical-top::after,
.ag-advanced-filter-builder-item-tree-line-vertical-bottom::before,
.ag-advanced-filter-builder-item-tree-line-vertical-bottom::after {
  content: "";
  position: absolute;
  height: 100%;
}

.ag-advanced-filter-builder-item-tree-line-horizontal::after {
  height: 50%;
  width: calc(var(--ag-advanced-filter-builder-indent-size) - var(--ag-icon-size));
  top: 0;
  left: calc(var(--ag-icon-size) / 2);
  border-bottom: 1px solid;
  border-color: var(--ag-border-color);
}

.ag-advanced-filter-builder-item-tree-line-vertical::before {
  width: calc(var(--ag-advanced-filter-builder-indent-size) - var(--ag-icon-size) / 2);
  top: 0;
  left: calc(var(--ag-icon-size) / 2);
  border-left: 1px solid;
  border-color: var(--ag-border-color);
}

.ag-advanced-filter-builder-item-tree-line-vertical-top::before {
  height: 50%;
  width: calc(var(--ag-advanced-filter-builder-indent-size) - var(--ag-icon-size) / 2);
  top: 0;
  left: calc(var(--ag-icon-size) / 2);
  border-left: 1px solid;
  border-color: var(--ag-border-color);
}

.ag-advanced-filter-builder-item-tree-line-vertical-bottom::before {
  height: calc((100% - 1.5 * var(--ag-icon-size)) / 2);
  width: calc(var(--ag-icon-size) / 2);
  top: calc((100% + 1.5 * var(--ag-icon-size)) / 2);
  left: calc(var(--ag-icon-size) / 2);
  border-left: 1px solid;
  border-color: var(--ag-border-color);
}

.ag-advanced-filter-builder-item-condition {
  padding-top: var(--ag-grid-size);
  padding-bottom: var(--ag-grid-size);
}

.ag-advanced-filter-builder-item,
.ag-advanced-filter-builder-item-condition,
.ag-advanced-filter-builder-pill-wrapper,
.ag-advanced-filter-builder-pill,
.ag-advanced-filter-builder-item-buttons,
.ag-advanced-filter-builder-item-tree-lines {
  display: flex;
  align-items: center;
  height: 100%;
}

.ag-advanced-filter-builder-pill-wrapper {
  margin: 0px var(--ag-grid-size);
}

.ag-advanced-filter-builder-pill {
  position: relative;
  border-radius: var(--ag-border-radius);
  padding: var(--ag-grid-size) calc(var(--ag-grid-size) * 2);
  min-height: calc(100% - var(--ag-grid-size) * 3);
  min-width: calc(var(--ag-grid-size) * 2);
}

.ag-advanced-filter-builder-pill .ag-picker-field-display {
  margin-right: var(--ag-grid-size);
}

.ag-advanced-filter-builder-pill .ag-advanced-filter-builder-value-number {
  font-family: monospace;
  font-weight: 700;
}

.ag-advanced-filter-builder-pill .ag-advanced-filter-builder-value-empty {
  color: var(--ag-disabled-foreground-color);
}

.ag-advanced-filter-builder-pill:focus-visible {
  outline: none;
}

.ag-advanced-filter-builder-pill:focus-visible::after {
  content: "";
  position: absolute;
  background-color: transparent;
  pointer-events: none;
  top: -4px;
  left: -4px;
  display: block;
  width: calc(100% + 8px);
  height: calc(100% + 8px);
  border: 1px solid;
  border-color: var(--ag-input-focus-border-color);
}

.ag-advanced-filter-builder-item-button:focus-visible {
  outline: none;
}

.ag-advanced-filter-builder-item-button:focus-visible::after {
  content: "";
  position: absolute;
  background-color: transparent;
  pointer-events: none;
  top: -4px;
  left: -4px;
  display: block;
  width: calc(100% + 8px);
  height: calc(100% + 8px);
  border: 1px solid;
  border-color: var(--ag-input-focus-border-color);
}

.ag-advanced-filter-builder-pill-display {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 500;
}

.ag-advanced-filter-builder-join-pill {
  color: var(--ag-foreground-color);
  background-color: var(--ag-advanced-filter-join-pill-color);
  cursor: pointer;
}

.ag-advanced-filter-builder-column-pill {
  color: var(--ag-foreground-color);
  background-color: var(--ag-advanced-filter-column-pill-color);
  cursor: pointer;
}

.ag-advanced-filter-builder-option-pill {
  color: var(--ag-foreground-color);
  background-color: var(--ag-advanced-filter-option-pill-color);
  cursor: pointer;
}

.ag-advanced-filter-builder-value-pill {
  color: var(--ag-foreground-color);
  background-color: var(--ag-advanced-filter-value-pill-color);
  cursor: text;
  max-width: 140px;
}

.ag-advanced-filter-builder-value-pill .ag-advanced-filter-builder-pill-display {
  display: block;
}

.ag-advanced-filter-builder-item-buttons > * {
  margin: 0 calc(var(--ag-grid-size) * 0.5);
}

.ag-advanced-filter-builder-item-button {
  position: relative;
  cursor: pointer;
  color: var(--ag-secondary-foreground-color);
  opacity: 50%;
}

.ag-advanced-filter-builder-item-button-disabled {
  color: var(--ag-disabled-foreground-color);
  cursor: default;
}

.ag-advanced-filter-builder-virtual-list-container {
  top: var(--ag-grid-size);
}

.ag-advanced-filter-builder-virtual-list-item {
  display: flex;
  cursor: default;
  height: var(--ag-list-item-height);
}

.ag-advanced-filter-builder-virtual-list-item:hover {
  background-color: var(--ag-row-hover-color);
}

.ag-advanced-filter-builder-virtual-list-item:hover .ag-advanced-filter-builder-item-button {
  opacity: 100%;
}

.ag-advanced-filter-builder-virtual-list-item-highlight .ag-advanced-filter-builder-item-button:focus-visible,
.ag-advanced-filter-builder-validation .ag-advanced-filter-builder-invalid {
  opacity: 100%;
}

.ag-advanced-filter-builder-invalid {
  margin: 0 var(--ag-grid-size);
  color: var(--ag-invalid-color);
  cursor: default;
}

.ag-input-field-input {
  width: 100%;
  min-width: 0;
}

.ag-checkbox-input-wrapper {
  font-family: var(--ag-icon-font-family);
  font-weight: var(--ag-icon-font-weight);
  color: var(--ag-icon-font-color);
  font-size: var(--ag-icon-size);
  line-height: var(--ag-icon-size);
  font-style: normal;
  font-variant: normal;
  text-transform: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  width: var(--ag-icon-size);
  height: var(--ag-icon-size);
  background-color: var(--ag-checkbox-background-color);
  border-radius: var(--ag-checkbox-border-radius);
  display: inline-block;
  vertical-align: middle;
  flex: none;
}

.ag-checkbox-input-wrapper input,
.ag-checkbox-input-wrapper input {
  -webkit-appearance: none;
  opacity: 0;
  width: 100%;
  height: 100%;
}

.ag-checkbox-input-wrapper:focus-within, .ag-checkbox-input-wrapper:active {
  outline: none;
  box-shadow: var(--ag-input-focus-box-shadow);
}

.ag-checkbox-input-wrapper.ag-disabled {
  opacity: 0.5;
}

.ag-checkbox-input-wrapper::after {
  content: var(--ag-icon-font-code-checkbox-unchecked, "\f108");
  font-family: inherit;
  color: var(--ag-checkbox-unchecked-color);
  display: var(--ag-icon-font-display-checkbox-unchecked, var(--ag-icon-font-display));
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
}

.ag-checkbox-input-wrapper.ag-checked::after {
  content: var(--ag-icon-font-code-checkbox-checked, "\f106");
  color: var(--ag-checkbox-checked-color);
  display: var(--ag-icon-font-display-checkbox-checked, var(--ag-icon-font-display));
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
}

.ag-checkbox-input-wrapper.ag-indeterminate::after {
  content: var(--ag-icon-font-code-checkbox-indeterminate, "\f107");
  color: var(--ag-checkbox-indeterminate-color);
  display: var(--ag-icon-font-display-checkbox-indeterminate, var(--ag-icon-font-display));
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
}

.ag-checkbox-input-wrapper::before {
  content: "";
  background: transparent center/contain no-repeat;
  position: absolute;
  inset: 0;
  background-image: var(--ag-icon-image-checkbox-unchecked, var(--ag-icon-image));
  display: var(--ag-icon-image-display-checkbox-unchecked, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-checkbox-unchecked, var(--ag-icon-image-opacity, 0.9));
}

.ag-checkbox-input-wrapper.ag-checked::before {
  background-image: var(--ag-icon-image-checkbox-checked, var(--ag-icon-image));
  display: var(--ag-icon-image-display-checkbox-checked, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-checkbox-checked, var(--ag-icon-image-opacity, 0.9));
}

.ag-checkbox-input-wrapper.ag-indeterminate::before {
  background-image: var(--ag-icon-image-checkbox-indeterminate, var(--ag-icon-image));
  display: var(--ag-icon-image-display-checkbox-indeterminate, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-checkbox-indeterminate, var(--ag-icon-image-opacity, 0.9));
}

.ag-toggle-button-input-wrapper {
  box-sizing: border-box;
  width: var(--ag-toggle-button-width);
  min-width: var(--ag-toggle-button-width);
  max-width: var(--ag-toggle-button-width);
  height: var(--ag-toggle-button-height);
  background-color: var(--ag-toggle-button-off-background-color);
  border-radius: calc(var(--ag-toggle-button-height) * 0.5);
  position: relative;
  flex: none;
  border: var(--ag-toggle-button-border-width) solid;
  border-color: var(--ag-toggle-button-off-border-color);
}

.ag-toggle-button-input-wrapper input {
  opacity: 0;
  height: 100%;
  width: 100%;
}

.ag-toggle-button-input-wrapper:focus-within {
  outline: none;
  box-shadow: var(--ag-input-focus-box-shadow);
}

.ag-toggle-button-input-wrapper.ag-disabled {
  opacity: 0.5;
}

.ag-toggle-button-input-wrapper.ag-checked {
  background-color: var(--ag-toggle-button-on-background-color);
  border-color: var(--ag-toggle-button-on-border-color);
}

.ag-toggle-button-input-wrapper::before {
  content: " ";
  position: absolute;
  top: calc(0px - var(--ag-toggle-button-border-width));
  left: calc(0px - var(--ag-toggle-button-border-width));
  display: block;
  box-sizing: border-box;
  height: var(--ag-toggle-button-height);
  width: var(--ag-toggle-button-height);
  background-color: var(--ag-toggle-button-switch-background-color);
  border-radius: 100%;
  transition: left 100ms;
  border: var(--ag-toggle-button-border-width) solid;
  border-color: var(--ag-toggle-button-switch-border-color);
}

.ag-toggle-button-input-wrapper.ag-checked::before {
  left: calc(100% - var(--ag-toggle-button-height) + var(--ag-toggle-button-border-width));
  border-color: var(--ag-toggle-button-on-border-color);
}

.ag-radio-button-input-wrapper {
  font-family: var(--ag-icon-font-family);
  font-weight: var(--ag-icon-font-weight);
  color: var(--ag-icon-font-color);
  font-size: var(--ag-icon-size);
  line-height: var(--ag-icon-size);
  font-style: normal;
  font-variant: normal;
  text-transform: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  width: var(--ag-icon-size);
  height: var(--ag-icon-size);
  background-color: var(--ag-checkbox-background-color);
  border-radius: var(--ag-checkbox-border-radius);
  display: inline-block;
  vertical-align: middle;
  flex: none;
  border-radius: var(--ag-icon-size);
}

.ag-radio-button-input-wrapper input,
.ag-radio-button-input-wrapper input {
  -webkit-appearance: none;
  opacity: 0;
  width: 100%;
  height: 100%;
}

.ag-radio-button-input-wrapper:focus-within, .ag-radio-button-input-wrapper:active {
  outline: none;
  box-shadow: var(--ag-input-focus-box-shadow);
}

.ag-radio-button-input-wrapper.ag-disabled {
  opacity: 0.5;
}

.ag-radio-button-input-wrapper::after {
  content: var(--ag-icon-font-code-radio-button-off, "\f127");
  color: var(--ag-checkbox-unchecked-color);
  display: var(--ag-icon-font-display-radio-button-off, var(--ag-icon-font-display));
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
}

.ag-radio-button-input-wrapper.ag-checked::after {
  content: var(--ag-icon-font-code-radio-button-on, "\f128");
  color: var(--ag-checkbox-checked-color);
  display: var(--ag-icon-font-display-radio-button-on, var(--ag-icon-font-display));
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
}

.ag-radio-button-input-wrapper::before {
  content: "";
  background: transparent center/contain no-repeat;
  position: absolute;
  inset: 0;
  background-image: var(--ag-icon-image-radio-button-off, var(--ag-icon-image));
  display: var(--ag-icon-image-display-radio-button-off, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-radio-button-off, var(--ag-icon-image-opacity, 0.9));
}

.ag-radio-button-input-wrapper.ag-checked::before {
  background-image: var(--ag-icon-image-radio-button-on, var(--ag-icon-image));
  display: var(--ag-icon-image-display-radio-button-on, var(--ag-icon-image-display));
  opacity: var(--ag-icon-image-opacity-radio-button-on, var(--ag-icon-image-opacity, 0.9));
}

input[class^=ag-][type=range] {
  -webkit-appearance: none;
  width: 100%;
  height: 100%;
  background: none;
  overflow: visible;
}

input[class^=ag-][type=range]::-webkit-slider-runnable-track {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 3px;
  background-color: var(--ag-border-color);
  border-radius: var(--ag-border-radius);
  border-radius: var(--ag-checkbox-border-radius);
}

input[class^=ag-][type=range]::-moz-range-track {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 3px;
  background-color: var(--ag-border-color);
  border-radius: var(--ag-border-radius);
  border-radius: var(--ag-checkbox-border-radius);
}

input[class^=ag-][type=range]::-ms-track {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 3px;
  background-color: var(--ag-border-color);
  border-radius: var(--ag-border-radius);
  border-radius: var(--ag-checkbox-border-radius);
  color: transparent;
  width: calc(100% - 2px);
}

input[class^=ag-][type=range]::-webkit-slider-thumb {
  margin: 0;
  padding: 0;
  -webkit-appearance: none;
  width: var(--ag-icon-size);
  height: var(--ag-icon-size);
  background-color: var(--ag-background-color);
  border: 1px solid;
  border-color: var(--ag-checkbox-unchecked-color);
  border-radius: var(--ag-icon-size);
  transform: translateY(calc(var(--ag-icon-size) * -0.5 + 1.5px));
}

input[class^=ag-][type=range]::-ms-thumb {
  margin: 0;
  padding: 0;
  -webkit-appearance: none;
  width: var(--ag-icon-size);
  height: var(--ag-icon-size);
  background-color: var(--ag-background-color);
  border: 1px solid;
  border-color: var(--ag-checkbox-unchecked-color);
  border-radius: var(--ag-icon-size);
}

input[class^=ag-][type=range]::-moz-ag-range-thumb {
  margin: 0;
  padding: 0;
  -webkit-appearance: none;
  width: var(--ag-icon-size);
  height: var(--ag-icon-size);
  background-color: var(--ag-background-color);
  border: 1px solid;
  border-color: var(--ag-checkbox-unchecked-color);
  border-radius: var(--ag-icon-size);
}

input[class^=ag-][type=range]:focus {
  outline: none;
}

input[class^=ag-][type=range]:focus::-webkit-slider-thumb {
  box-shadow: var(--ag-input-focus-box-shadow);
  border-color: var(--ag-checkbox-checked-color);
}

input[class^=ag-][type=range]:focus::-ms-thumb {
  box-shadow: var(--ag-input-focus-box-shadow);
  border-color: var(--ag-checkbox-checked-color);
}

input[class^=ag-][type=range]:focus::-moz-ag-range-thumb {
  box-shadow: var(--ag-input-focus-box-shadow);
  border-color: var(--ag-checkbox-checked-color);
}

input[class^=ag-][type=range]:active::-webkit-slider-runnable-track {
  background-color: var(--ag-input-focus-border-color);
}

input[class^=ag-][type=range]:active::-moz-ag-range-track {
  background-color: var(--ag-input-focus-border-color);
}

input[class^=ag-][type=range]:active::-ms-track {
  background-color: var(--ag-input-focus-border-color);
}

input[class^=ag-][type=range]:disabled {
  opacity: 0.5;
}

.ag-theme-quartz,
.ag-theme-quartz-dark,
.ag-theme-quartz-auto-dark {
  --ag-active-color: #2196f3;
  --ag-background-color: #fff;
  --ag-foreground-color: #181d1f;
  --ag-border-color: color-mix(in srgb, transparent, var(--ag-foreground-color) 15%);
  --ag-secondary-border-color: var(--ag-border-color);
  --ag-header-background-color: color-mix(in srgb, var(--ag-background-color), var(--ag-foreground-color) 2%);
  --ag-tooltip-background-color: var(--ag-header-background-color);
  --ag-control-panel-background-color: var(--ag-header-background-color);
  --ag-subheader-background-color: transparent;
  --ag-invalid-color: #e02525;
  --ag-checkbox-unchecked-color: color-mix(in srgb, var(--ag-background-color), var(--ag-foreground-color) 30%);
  --ag-advanced-filter-join-pill-color: #f08e8d;
  --ag-advanced-filter-column-pill-color: #a6e194;
  --ag-advanced-filter-option-pill-color: #f3c08b;
  --ag-advanced-filter-value-pill-color: #85c0e4;
  --ag-header-column-resize-handle-color: var(--ag-secondary-border-color);
  --ag-icon-font-color: color-mix(in srgb, transparent, var(--ag-foreground-color) 90%);
  --ag-panel-background-color: color-mix(in srgb, var(--ag-background-color), var(--ag-foreground-color) 3%);
  --ag-panel-border-color: color-mix(in srgb, transparent, var(--ag-foreground-color) 20%);
  --ag-menu-background-color: color-mix(in srgb, var(--ag-background-color), var(--ag-foreground-color) 3%);
  --ag-menu-border-color: color-mix(in srgb, transparent, var(--ag-foreground-color) 20%);
  --ag-selected-row-background-color: color-mix(in srgb, transparent, var(--ag-active-color) 8%);
  --ag-row-hover-color: color-mix(in srgb, transparent, var(--ag-active-color) 12%);
  --ag-column-hover-color: color-mix(in srgb, transparent, var(--ag-foreground-color) 5%);
  --ag-input-focus-border-color: var(--ag-active-color);
  --ag-input-focus-box-shadow: 0 0 0 3px color-mix(in srgb, transparent, var(--ag-input-focus-border-color) 47%);
  --ag-range-selection-background-color: color-mix(in srgb, transparent, var(--ag-active-color) 20%);
  --ag-range-selection-background-color-2: color-mix(in srgb, transparent, var(--ag-active-color) 36%);
  --ag-range-selection-background-color-3: color-mix(in srgb, transparent, var(--ag-active-color) 49%);
  --ag-range-selection-background-color-4: color-mix(in srgb, transparent, var(--ag-active-color) 59%);
  --ag-checkbox-background-color: var(--ag-background-color);
  --ag-checkbox-checked-color: var(--ag-active-color);
  --ag-range-selection-border-color: var(--ag-active-color);
  --ag-secondary-foreground-color: var(--ag-foreground-color);
  --ag-input-border-color: var(--ag-border-color);
  --ag-input-border-color-invalid: var(--ag-invalid-color);
  --ag-disabled-foreground-color: color-mix(in srgb, transparent, var(--ag-foreground-color) 50%);
  --ag-chip-background-color: color-mix(in srgb, transparent, var(--ag-foreground-color) 7%);
  --ag-chip-border-color: color-mix(in srgb, var(--ag-header-background-color), var(--ag-foreground-color) 13%);
  --ag-input-disabled-border-color: var(--ag-border-color);
  --ag-input-disabled-background-color: color-mix(in srgb, var(--ag-background-color), var(--ag-foreground-color) 6%);
  --ag-modal-overlay-background-color: color-mix(in srgb, transparent, var(--ag-background-color) 66%);
  --ag-chart-menu-label-color: color-mix(in srgb, transparent, var(--ag-foreground-color) 80%);
  --ag-chart-menu-pill-select-button-color: color-mix(in srgb, transparent, var(--ag-foreground-color) 70%);
  --ag-borders: solid 1px;
  --ag-border-radius: 4px;
  --ag-wrapper-border-radius: 8px;
  --ag-borders-side-button: none;
  --ag-side-button-selected-background-color: transparent;
  --ag-header-column-resize-handle-display: block;
  --ag-header-column-resize-handle-width: 2px;
  --ag-header-column-resize-handle-height: 30%;
  --ag-grid-size: 8px;
  --ag-icon-size: 16px;
  --ag-header-height: calc(var(--ag-font-size) + var(--ag-grid-size) * 4.25);
  --ag-row-height: calc(var(--ag-font-size) + var(--ag-grid-size) * 3.5);
  --ag-list-item-height: calc(
      var(--ag-icon-size) + var(--ag-widget-vertical-spacing)
  );
  --ag-column-select-indent-size: var(--ag-icon-size);
  --ag-set-filter-indent-size: var(--ag-icon-size);
  --ag-filter-tool-panel-group-indent: var(--ag-grid-size);
  --ag-advanced-filter-builder-indent-size: calc(var(--ag-icon-size) + var(--ag-grid-size) * 2);
  --ag-cell-horizontal-padding: calc(var(--ag-grid-size) * 2);
  --ag-cell-widget-spacing: calc(var(--ag-grid-size) * 1.5);
  --ag-widget-container-vertical-padding: calc(var(--ag-grid-size) * 1.5);
  --ag-widget-container-horizontal-padding: calc(var(--ag-grid-size) * 1.5);
  --ag-widget-horizontal-spacing: calc(var(--ag-grid-size) * 1.5);
  --ag-widget-vertical-spacing: calc(var(--ag-grid-size) * 1);
  --ag-toggle-button-height: 18px;
  --ag-toggle-button-width: 28px;
  --ag-toggle-button-border-width: 2px;
  --ag-font-family: "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu,
      Cantarell, "Helvetica Neue", sans-serif;
  --ag-font-size: 14px;
  --ag-icon-font-family: agGridQuartz;
  --ag-tab-min-width: 290px;
  --ag-chart-menu-panel-width: 260px;
  --ag-card-shadow: 0 1px 4px 1px rgba(186, 191, 199, 0.4);
  --ag-popup-shadow: 0 0 16px 0 rgba(0, 0, 0, 0.15);
  --ag-side-bar-panel-width: 250px;
}

.ag-theme-quartz-dark {
  --ag-background-color: color-mix(in srgb, #fff, #182230 97%);
  --ag-foreground-color: #fff;
  --ag-border-color: rgba(255, 255, 255, 0.16);
  --ag-secondary-border-color: color-mix(in srgb, transparent, var(--ag-foreground-color) 10%);
  --ag-header-background-color: color-mix(in srgb, #fff, #182230 93%);
  --ag-tooltip-background-color: color-mix(in srgb, #fff, #182230 96%);
  --ag-control-panel-background-color: color-mix(in srgb, #fff, #182230 93%);
  --ag-input-disabled-background-color: #68686e12;
  --ag-card-shadow: 0 1px 20px 1px black;
  --ag-input-border-color: var(--ag-border-color);
  --ag-input-disabled-border-color: rgba(255, 255, 255, 0.07);
  --ag-checkbox-unchecked-color: color-mix(in srgb, var(--ag-background-color), var(--ag-foreground-color) 40%);
  --ag-row-hover-color: color-mix(in srgb, transparent, var(--ag-active-color) 20%);
  --ag-selected-row-background-color: var(--ag-row-hover-color);
  --ag-panel-background-color: color-mix(in srgb, var(--ag-background-color), var(--ag-foreground-color) 10%);
  --ag-panel-border-color: color-mix(in srgb, transparent, var(--ag-foreground-color) 10%);
  --ag-menu-background-color: color-mix(in srgb, var(--ag-background-color), var(--ag-foreground-color) 10%);
  --ag-menu-border-color: color-mix(in srgb, transparent, var(--ag-foreground-color) 10%);
  --ag-advanced-filter-join-pill-color: #7a3a37;
  --ag-advanced-filter-column-pill-color: #355f2d;
  --ag-advanced-filter-option-pill-color: #5a3168;
  --ag-advanced-filter-value-pill-color: #374c86;
  --ag-popup-shadow: 0 0px 20px rgba(0, 0, 0, 0.3);
  --ag-row-loading-skeleton-effect-color: rgba(202, 203, 204, 0.4);
  color-scheme: dark;
}

@media (prefers-color-scheme: dark) {
  .ag-theme-quartz-auto-dark {
    --ag-background-color: color-mix(in srgb, #fff, #182230 97%);
    --ag-foreground-color: #fff;
    --ag-border-color: rgba(255, 255, 255, 0.16);
    --ag-secondary-border-color: color-mix(in srgb, transparent, var(--ag-foreground-color) 10%);
    --ag-header-background-color: color-mix(in srgb, #fff, #182230 93%);
    --ag-tooltip-background-color: color-mix(in srgb, #fff, #182230 96%);
    --ag-control-panel-background-color: color-mix(in srgb, #fff, #182230 93%);
    --ag-input-disabled-background-color: #68686e12;
    --ag-card-shadow: 0 1px 20px 1px black;
    --ag-input-border-color: var(--ag-border-color);
    --ag-input-disabled-border-color: rgba(255, 255, 255, 0.07);
    --ag-checkbox-unchecked-color: color-mix(in srgb, var(--ag-background-color), var(--ag-foreground-color) 40%);
    --ag-row-hover-color: color-mix(in srgb, transparent, var(--ag-active-color) 20%);
    --ag-selected-row-background-color: var(--ag-row-hover-color);
    --ag-panel-background-color: color-mix(in srgb, var(--ag-background-color), var(--ag-foreground-color) 10%);
    --ag-panel-border-color: color-mix(in srgb, transparent, var(--ag-foreground-color) 10%);
    --ag-menu-background-color: color-mix(in srgb, var(--ag-background-color), var(--ag-foreground-color) 10%);
    --ag-menu-border-color: color-mix(in srgb, transparent, var(--ag-foreground-color) 10%);
    --ag-advanced-filter-join-pill-color: #7a3a37;
    --ag-advanced-filter-column-pill-color: #355f2d;
    --ag-advanced-filter-option-pill-color: #5a3168;
    --ag-advanced-filter-value-pill-color: #374c86;
    --ag-popup-shadow: 0 0px 20px rgba(0, 0, 0, 0.3);
    --ag-row-loading-skeleton-effect-color: rgba(202, 203, 204, 0.4);
    color-scheme: dark;
  }
}
.ag-theme-quartz .ag-filter-toolpanel-header,
.ag-theme-quartz .ag-filter-toolpanel-search,
.ag-theme-quartz .ag-status-bar,
.ag-theme-quartz .ag-header-row,
.ag-theme-quartz .ag-panel-title-bar-title,
.ag-theme-quartz .ag-multi-filter-group-title-bar,
.ag-theme-quartz-dark .ag-filter-toolpanel-header,
.ag-theme-quartz-dark .ag-filter-toolpanel-search,
.ag-theme-quartz-dark .ag-status-bar,
.ag-theme-quartz-dark .ag-header-row,
.ag-theme-quartz-dark .ag-panel-title-bar-title,
.ag-theme-quartz-dark .ag-multi-filter-group-title-bar,
.ag-theme-quartz-auto-dark .ag-filter-toolpanel-header,
.ag-theme-quartz-auto-dark .ag-filter-toolpanel-search,
.ag-theme-quartz-auto-dark .ag-status-bar,
.ag-theme-quartz-auto-dark .ag-header-row,
.ag-theme-quartz-auto-dark .ag-panel-title-bar-title,
.ag-theme-quartz-auto-dark .ag-multi-filter-group-title-bar {
  font-weight: 500;
  color: var(--ag-header-foreground-color);
}

.ag-theme-quartz input[class^=ag-]:not([type]),
.ag-theme-quartz input[class^=ag-][type=text],
.ag-theme-quartz input[class^=ag-][type=number],
.ag-theme-quartz input[class^=ag-][type=tel],
.ag-theme-quartz input[class^=ag-][type=date],
.ag-theme-quartz input[class^=ag-][type=datetime-local],
.ag-theme-quartz textarea[class^=ag-],
.ag-theme-quartz-dark input[class^=ag-]:not([type]),
.ag-theme-quartz-dark input[class^=ag-][type=text],
.ag-theme-quartz-dark input[class^=ag-][type=number],
.ag-theme-quartz-dark input[class^=ag-][type=tel],
.ag-theme-quartz-dark input[class^=ag-][type=date],
.ag-theme-quartz-dark input[class^=ag-][type=datetime-local],
.ag-theme-quartz-dark textarea[class^=ag-],
.ag-theme-quartz-auto-dark input[class^=ag-]:not([type]),
.ag-theme-quartz-auto-dark input[class^=ag-][type=text],
.ag-theme-quartz-auto-dark input[class^=ag-][type=number],
.ag-theme-quartz-auto-dark input[class^=ag-][type=tel],
.ag-theme-quartz-auto-dark input[class^=ag-][type=date],
.ag-theme-quartz-auto-dark input[class^=ag-][type=datetime-local],
.ag-theme-quartz-auto-dark textarea[class^=ag-] {
  min-height: calc(var(--ag-grid-size) * 4);
  border-radius: var(--ag-border-radius);
}

.ag-theme-quartz .ag-ltr input[class^=ag-]:not([type]), .ag-theme-quartz .ag-ltr input[class^=ag-][type=text], .ag-theme-quartz .ag-ltr input[class^=ag-][type=number], .ag-theme-quartz .ag-ltr input[class^=ag-][type=tel], .ag-theme-quartz .ag-ltr input[class^=ag-][type=date], .ag-theme-quartz .ag-ltr input[class^=ag-][type=datetime-local], .ag-theme-quartz .ag-ltr textarea[class^=ag-], .ag-theme-quartz-dark .ag-ltr input[class^=ag-]:not([type]), .ag-theme-quartz-dark .ag-ltr input[class^=ag-][type=text], .ag-theme-quartz-dark .ag-ltr input[class^=ag-][type=number], .ag-theme-quartz-dark .ag-ltr input[class^=ag-][type=tel], .ag-theme-quartz-dark .ag-ltr input[class^=ag-][type=date], .ag-theme-quartz-dark .ag-ltr input[class^=ag-][type=datetime-local], .ag-theme-quartz-dark .ag-ltr textarea[class^=ag-], .ag-theme-quartz-auto-dark .ag-ltr input[class^=ag-]:not([type]), .ag-theme-quartz-auto-dark .ag-ltr input[class^=ag-][type=text], .ag-theme-quartz-auto-dark .ag-ltr input[class^=ag-][type=number], .ag-theme-quartz-auto-dark .ag-ltr input[class^=ag-][type=tel], .ag-theme-quartz-auto-dark .ag-ltr input[class^=ag-][type=date], .ag-theme-quartz-auto-dark .ag-ltr input[class^=ag-][type=datetime-local], .ag-theme-quartz-auto-dark .ag-ltr textarea[class^=ag-] {
  padding-left: var(--ag-grid-size);
}

.ag-theme-quartz .ag-rtl input[class^=ag-]:not([type]), .ag-theme-quartz .ag-rtl input[class^=ag-][type=text], .ag-theme-quartz .ag-rtl input[class^=ag-][type=number], .ag-theme-quartz .ag-rtl input[class^=ag-][type=tel], .ag-theme-quartz .ag-rtl input[class^=ag-][type=date], .ag-theme-quartz .ag-rtl input[class^=ag-][type=datetime-local], .ag-theme-quartz .ag-rtl textarea[class^=ag-], .ag-theme-quartz-dark .ag-rtl input[class^=ag-]:not([type]), .ag-theme-quartz-dark .ag-rtl input[class^=ag-][type=text], .ag-theme-quartz-dark .ag-rtl input[class^=ag-][type=number], .ag-theme-quartz-dark .ag-rtl input[class^=ag-][type=tel], .ag-theme-quartz-dark .ag-rtl input[class^=ag-][type=date], .ag-theme-quartz-dark .ag-rtl input[class^=ag-][type=datetime-local], .ag-theme-quartz-dark .ag-rtl textarea[class^=ag-], .ag-theme-quartz-auto-dark .ag-rtl input[class^=ag-]:not([type]), .ag-theme-quartz-auto-dark .ag-rtl input[class^=ag-][type=text], .ag-theme-quartz-auto-dark .ag-rtl input[class^=ag-][type=number], .ag-theme-quartz-auto-dark .ag-rtl input[class^=ag-][type=tel], .ag-theme-quartz-auto-dark .ag-rtl input[class^=ag-][type=date], .ag-theme-quartz-auto-dark .ag-rtl input[class^=ag-][type=datetime-local], .ag-theme-quartz-auto-dark .ag-rtl textarea[class^=ag-] {
  padding-right: var(--ag-grid-size);
}

.ag-theme-quartz .ag-picker-field-wrapper,
.ag-theme-quartz-dark .ag-picker-field-wrapper,
.ag-theme-quartz-auto-dark .ag-picker-field-wrapper {
  min-height: calc(var(--ag-grid-size) * 4);
}

.ag-theme-quartz .ag-tab,
.ag-theme-quartz-dark .ag-tab,
.ag-theme-quartz-auto-dark .ag-tab {
  padding: var(--ag-grid-size);
  border-left: var(--ag-borders) transparent;
  border-right: var(--ag-borders) transparent;
  flex: 1 1 auto;
}

.ag-theme-quartz .ag-tab-selected,
.ag-theme-quartz-dark .ag-tab-selected,
.ag-theme-quartz-auto-dark .ag-tab-selected {
  background-color: var(--ag-background-color);
}

.ag-theme-quartz .ag-ltr .ag-tab-selected:not(:first-of-type), .ag-theme-quartz-dark .ag-ltr .ag-tab-selected:not(:first-of-type), .ag-theme-quartz-auto-dark .ag-ltr .ag-tab-selected:not(:first-of-type) {
  border-left-color: var(--ag-border-color);
}

.ag-theme-quartz .ag-rtl .ag-tab-selected:not(:first-of-type), .ag-theme-quartz-dark .ag-rtl .ag-tab-selected:not(:first-of-type), .ag-theme-quartz-auto-dark .ag-rtl .ag-tab-selected:not(:first-of-type) {
  border-right-color: var(--ag-border-color);
}

.ag-theme-quartz .ag-ltr .ag-tab-selected:not(:last-of-type), .ag-theme-quartz-dark .ag-ltr .ag-tab-selected:not(:last-of-type), .ag-theme-quartz-auto-dark .ag-ltr .ag-tab-selected:not(:last-of-type) {
  border-right-color: var(--ag-border-color);
}

.ag-theme-quartz .ag-rtl .ag-tab-selected:not(:last-of-type), .ag-theme-quartz-dark .ag-rtl .ag-tab-selected:not(:last-of-type), .ag-theme-quartz-auto-dark .ag-rtl .ag-tab-selected:not(:last-of-type) {
  border-left-color: var(--ag-border-color);
}

.ag-theme-quartz .ag-tab:not(.ag-tab-selected),
.ag-theme-quartz-dark .ag-tab:not(.ag-tab-selected),
.ag-theme-quartz-auto-dark .ag-tab:not(.ag-tab-selected) {
  opacity: 0.7;
}

.ag-theme-quartz .ag-tab:not(.ag-tab-selected):hover,
.ag-theme-quartz-dark .ag-tab:not(.ag-tab-selected):hover,
.ag-theme-quartz-auto-dark .ag-tab:not(.ag-tab-selected):hover {
  opacity: 1;
}

.ag-theme-quartz .ag-menu,
.ag-theme-quartz-dark .ag-menu,
.ag-theme-quartz-auto-dark .ag-menu {
  color: color-mix(in srgb, transparent, var(--ag-foreground-color) 95%);
}

.ag-theme-quartz .ag-panel-content-wrapper .ag-column-select,
.ag-theme-quartz-dark .ag-panel-content-wrapper .ag-column-select,
.ag-theme-quartz-auto-dark .ag-panel-content-wrapper .ag-column-select {
  background-color: var(--ag-control-panel-background-color);
  color: color-mix(in srgb, transparent, var(--ag-foreground-color) 95%);
}

.ag-theme-quartz .ag-menu-option .ag-icon,
.ag-theme-quartz-dark .ag-menu-option .ag-icon,
.ag-theme-quartz-auto-dark .ag-menu-option .ag-icon {
  opacity: 65%;
}

.ag-theme-quartz .ag-menu-header,
.ag-theme-quartz-dark .ag-menu-header,
.ag-theme-quartz-auto-dark .ag-menu-header {
  background-color: var(--ag-control-panel-background-color);
}

.ag-theme-quartz .ag-menu-option,
.ag-theme-quartz-dark .ag-menu-option,
.ag-theme-quartz-auto-dark .ag-menu-option {
  font-weight: 500;
  cursor: pointer;
}

.ag-theme-quartz .ag-ltr .ag-menu-option-popup-pointer .ag-icon, .ag-theme-quartz-dark .ag-ltr .ag-menu-option-popup-pointer .ag-icon, .ag-theme-quartz-auto-dark .ag-ltr .ag-menu-option-popup-pointer .ag-icon {
  text-align: right;
}

.ag-theme-quartz .ag-rtl .ag-menu-option-popup-pointer .ag-icon, .ag-theme-quartz-dark .ag-rtl .ag-menu-option-popup-pointer .ag-icon, .ag-theme-quartz-auto-dark .ag-rtl .ag-menu-option-popup-pointer .ag-icon {
  text-align: left;
}

.ag-theme-quartz .ag-tabs-header,
.ag-theme-quartz-dark .ag-tabs-header,
.ag-theme-quartz-auto-dark .ag-tabs-header {
  border-bottom: var(--ag-borders) var(--ag-border-color);
  display: flex;
  background-color: color-mix(in srgb, transparent, var(--ag-foreground-color) 5%);
}

.ag-theme-quartz .ag-side-bar,
.ag-theme-quartz-dark .ag-side-bar,
.ag-theme-quartz-auto-dark .ag-side-bar {
  background-color: var(--ag-control-panel-background-color);
  min-width: calc(var(--ag-icon-size) + var(--ag-grid-size) * 2);
}

.ag-theme-quartz .ag-side-buttons,
.ag-theme-quartz-dark .ag-side-buttons,
.ag-theme-quartz-auto-dark .ag-side-buttons {
  padding: 0;
  align-self: stretch;
  width: calc(var(--ag-icon-size) + var(--ag-grid-size) * 2);
  background: var(--ag-control-panel-background-color);
}

.ag-theme-quartz .ag-side-button,
.ag-theme-quartz-dark .ag-side-button,
.ag-theme-quartz-auto-dark .ag-side-button {
  border-top: var(--ag-borders) transparent;
  border-bottom: var(--ag-borders) transparent;
}

@media (max-resolution: 1.5x) {
  .ag-theme-quartz .ag-side-button-label,
  .ag-theme-quartz-dark .ag-side-button-label,
  .ag-theme-quartz-auto-dark .ag-side-button-label {
    font-family: "Segoe UI", var(--ag-font-family);
    transform: rotate(0.05deg);
  }
}
.ag-theme-quartz .ag-side-button.ag-selected,
.ag-theme-quartz-dark .ag-side-button.ag-selected,
.ag-theme-quartz-auto-dark .ag-side-button.ag-selected {
  border-bottom-color: var(--ag-border-color);
  background-color: var(--ag-background-color);
}

.ag-theme-quartz .ag-side-button.ag-selected:not(:first-of-type),
.ag-theme-quartz-dark .ag-side-button.ag-selected:not(:first-of-type),
.ag-theme-quartz-auto-dark .ag-side-button.ag-selected:not(:first-of-type) {
  border-top-color: var(--ag-border-color);
}

.ag-theme-quartz .ag-column-panel-column-select,
.ag-theme-quartz-dark .ag-column-panel-column-select,
.ag-theme-quartz-auto-dark .ag-column-panel-column-select {
  border-top: none;
  border-bottom: 1px solid var(--ag-secondary-border-color);
}

.ag-theme-quartz .ag-filter-toolpanel-search,
.ag-theme-quartz-dark .ag-filter-toolpanel-search,
.ag-theme-quartz-auto-dark .ag-filter-toolpanel-search {
  height: initial;
  margin-top: var(--ag-widget-container-vertical-padding);
}

.ag-theme-quartz .ag-filter-toolpanel-search-input,
.ag-theme-quartz-dark .ag-filter-toolpanel-search-input,
.ag-theme-quartz-auto-dark .ag-filter-toolpanel-search-input {
  margin: 0;
}

.ag-theme-quartz .ag-filter-apply-panel,
.ag-theme-quartz-dark .ag-filter-apply-panel,
.ag-theme-quartz-auto-dark .ag-filter-apply-panel {
  border: none;
  padding-top: var(--ag-widget-vertical-spacing);
}

.ag-theme-quartz .ag-chart-tabbed-menu-body,
.ag-theme-quartz-dark .ag-chart-tabbed-menu-body,
.ag-theme-quartz-auto-dark .ag-chart-tabbed-menu-body {
  position: relative;
}

.ag-theme-quartz .ag-chart-tabbed-menu-body::after,
.ag-theme-quartz-dark .ag-chart-tabbed-menu-body::after,
.ag-theme-quartz-auto-dark .ag-chart-tabbed-menu-body::after {
  content: "";
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  right: 0;
  height: 16px;
  background: linear-gradient(var(--ag-control-panel-background-color), transparent);
}

.ag-theme-quartz .ag-charts-settings-group-title-bar,
.ag-theme-quartz .ag-charts-data-group-title-bar,
.ag-theme-quartz .ag-charts-format-top-level-group-title-bar,
.ag-theme-quartz .ag-charts-advanced-settings-top-level-group-title-bar,
.ag-theme-quartz .ag-charts-settings-group-container,
.ag-theme-quartz-dark .ag-charts-settings-group-title-bar,
.ag-theme-quartz-dark .ag-charts-data-group-title-bar,
.ag-theme-quartz-dark .ag-charts-format-top-level-group-title-bar,
.ag-theme-quartz-dark .ag-charts-advanced-settings-top-level-group-title-bar,
.ag-theme-quartz-dark .ag-charts-settings-group-container,
.ag-theme-quartz-auto-dark .ag-charts-settings-group-title-bar,
.ag-theme-quartz-auto-dark .ag-charts-data-group-title-bar,
.ag-theme-quartz-auto-dark .ag-charts-format-top-level-group-title-bar,
.ag-theme-quartz-auto-dark .ag-charts-advanced-settings-top-level-group-title-bar,
.ag-theme-quartz-auto-dark .ag-charts-settings-group-container {
  border-top: none;
  font-weight: 500;
}

.ag-theme-quartz .ag-chart-mini-thumbnail,
.ag-theme-quartz-dark .ag-chart-mini-thumbnail,
.ag-theme-quartz-auto-dark .ag-chart-mini-thumbnail {
  background-color: var(--ag-background-color);
  margin-top: 0;
  margin-bottom: 0;
}

.ag-theme-quartz .ag-chart-settings-nav-bar,
.ag-theme-quartz-dark .ag-chart-settings-nav-bar,
.ag-theme-quartz-auto-dark .ag-chart-settings-nav-bar {
  border-top: var(--ag-borders-secondary) var(--ag-secondary-border-color);
}

.ag-theme-quartz .ag-charts-format-sub-level-group-title-bar,
.ag-theme-quartz-dark .ag-charts-format-sub-level-group-title-bar,
.ag-theme-quartz-auto-dark .ag-charts-format-sub-level-group-title-bar {
  background: none;
  font-weight: 500;
}

.ag-theme-quartz .ag-chart-data-section .ag-label:not(.ag-group-title-bar),
.ag-theme-quartz .ag-chart-format-section .ag-label:not(.ag-group-title-bar),
.ag-theme-quartz-dark .ag-chart-data-section .ag-label:not(.ag-group-title-bar),
.ag-theme-quartz-dark .ag-chart-format-section .ag-label:not(.ag-group-title-bar),
.ag-theme-quartz-auto-dark .ag-chart-data-section .ag-label:not(.ag-group-title-bar),
.ag-theme-quartz-auto-dark .ag-chart-format-section .ag-label:not(.ag-group-title-bar) {
  color: var(--ag-chart-menu-label-color);
}

.ag-theme-quartz .ag-chart-data-section .ag-label-align-top .ag-label,
.ag-theme-quartz .ag-chart-format-section .ag-label-align-top .ag-label,
.ag-theme-quartz-dark .ag-chart-data-section .ag-label-align-top .ag-label,
.ag-theme-quartz-dark .ag-chart-format-section .ag-label-align-top .ag-label,
.ag-theme-quartz-auto-dark .ag-chart-data-section .ag-label-align-top .ag-label,
.ag-theme-quartz-auto-dark .ag-chart-format-section .ag-label-align-top .ag-label {
  margin-top: calc(var(--ag-widget-vertical-spacing) * 0.5);
  margin-bottom: var(--ag-widget-vertical-spacing);
}

.ag-theme-quartz .ag-chart-data-section .ag-slider.ag-label-align-top .ag-label,
.ag-theme-quartz .ag-chart-format-section .ag-slider.ag-label-align-top .ag-label,
.ag-theme-quartz-dark .ag-chart-data-section .ag-slider.ag-label-align-top .ag-label,
.ag-theme-quartz-dark .ag-chart-format-section .ag-slider.ag-label-align-top .ag-label,
.ag-theme-quartz-auto-dark .ag-chart-data-section .ag-slider.ag-label-align-top .ag-label,
.ag-theme-quartz-auto-dark .ag-chart-format-section .ag-slider.ag-label-align-top .ag-label {
  margin-bottom: 0;
}

.ag-theme-quartz .ag-chart-data-section label,
.ag-theme-quartz .ag-chart-format-section label,
.ag-theme-quartz-dark .ag-chart-data-section label,
.ag-theme-quartz-dark .ag-chart-format-section label,
.ag-theme-quartz-auto-dark .ag-chart-data-section label,
.ag-theme-quartz-auto-dark .ag-chart-format-section label {
  display: inline-block;
}

.ag-theme-quartz .ag-chart-format-wrapper,
.ag-theme-quartz .ag-chart-data-wrapper,
.ag-theme-quartz .ag-charts-format-top-level-group,
.ag-theme-quartz .ag-charts-format-top-level-group-title-bar,
.ag-theme-quartz .ag-charts-format-top-level-group .ag-charts-format-top-level-group-container,
.ag-theme-quartz .ag-charts-format-top-level-group-item,
.ag-theme-quartz .ag-charts-format-sub-level-group,
.ag-theme-quartz .ag-charts-format-sub-level-group-title-bar,
.ag-theme-quartz .ag-charts-format-sub-level-group-container,
.ag-theme-quartz .ag-charts-format-sub-level-group-item:last-child,
.ag-theme-quartz .ag-charts-format-sub-level-group-container > *,
.ag-theme-quartz .ag-charts-data-group-title-bar,
.ag-theme-quartz .ag-charts-data-group-container,
.ag-theme-quartz .ag-charts-settings-group-title-bar,
.ag-theme-quartz .ag-charts-settings-group-container,
.ag-theme-quartz-dark .ag-chart-format-wrapper,
.ag-theme-quartz-dark .ag-chart-data-wrapper,
.ag-theme-quartz-dark .ag-charts-format-top-level-group,
.ag-theme-quartz-dark .ag-charts-format-top-level-group-title-bar,
.ag-theme-quartz-dark .ag-charts-format-top-level-group .ag-charts-format-top-level-group-container,
.ag-theme-quartz-dark .ag-charts-format-top-level-group-item,
.ag-theme-quartz-dark .ag-charts-format-sub-level-group,
.ag-theme-quartz-dark .ag-charts-format-sub-level-group-title-bar,
.ag-theme-quartz-dark .ag-charts-format-sub-level-group-container,
.ag-theme-quartz-dark .ag-charts-format-sub-level-group-item:last-child,
.ag-theme-quartz-dark .ag-charts-format-sub-level-group-container > *,
.ag-theme-quartz-dark .ag-charts-data-group-title-bar,
.ag-theme-quartz-dark .ag-charts-data-group-container,
.ag-theme-quartz-dark .ag-charts-settings-group-title-bar,
.ag-theme-quartz-dark .ag-charts-settings-group-container,
.ag-theme-quartz-auto-dark .ag-chart-format-wrapper,
.ag-theme-quartz-auto-dark .ag-chart-data-wrapper,
.ag-theme-quartz-auto-dark .ag-charts-format-top-level-group,
.ag-theme-quartz-auto-dark .ag-charts-format-top-level-group-title-bar,
.ag-theme-quartz-auto-dark .ag-charts-format-top-level-group .ag-charts-format-top-level-group-container,
.ag-theme-quartz-auto-dark .ag-charts-format-top-level-group-item,
.ag-theme-quartz-auto-dark .ag-charts-format-sub-level-group,
.ag-theme-quartz-auto-dark .ag-charts-format-sub-level-group-title-bar,
.ag-theme-quartz-auto-dark .ag-charts-format-sub-level-group-container,
.ag-theme-quartz-auto-dark .ag-charts-format-sub-level-group-item:last-child,
.ag-theme-quartz-auto-dark .ag-charts-format-sub-level-group-container > *,
.ag-theme-quartz-auto-dark .ag-charts-data-group-title-bar,
.ag-theme-quartz-auto-dark .ag-charts-data-group-container,
.ag-theme-quartz-auto-dark .ag-charts-settings-group-title-bar,
.ag-theme-quartz-auto-dark .ag-charts-settings-group-container {
  padding: 0;
  margin: 0;
}

.ag-theme-quartz .ag-charts-format-top-level-group,
.ag-theme-quartz .ag-charts-data-group,
.ag-theme-quartz-dark .ag-charts-format-top-level-group,
.ag-theme-quartz-dark .ag-charts-data-group,
.ag-theme-quartz-auto-dark .ag-charts-format-top-level-group,
.ag-theme-quartz-auto-dark .ag-charts-data-group {
  border-top: var(--ag-borders-secondary) var(--ag-secondary-border-color);
}

.ag-theme-quartz .ag-charts-format-top-level-group-title-bar,
.ag-theme-quartz .ag-charts-data-group-title-bar,
.ag-theme-quartz .ag-charts-settings-group-title-bar,
.ag-theme-quartz-dark .ag-charts-format-top-level-group-title-bar,
.ag-theme-quartz-dark .ag-charts-data-group-title-bar,
.ag-theme-quartz-dark .ag-charts-settings-group-title-bar,
.ag-theme-quartz-auto-dark .ag-charts-format-top-level-group-title-bar,
.ag-theme-quartz-auto-dark .ag-charts-data-group-title-bar,
.ag-theme-quartz-auto-dark .ag-charts-settings-group-title-bar {
  padding: var(--ag-widget-container-vertical-padding) var(--ag-widget-container-horizontal-padding);
}

.ag-theme-quartz .ag-charts-format-top-level-group .ag-charts-format-top-level-group-container,
.ag-theme-quartz .ag-charts-data-group .ag-charts-data-group-container,
.ag-theme-quartz .ag-charts-settings-group .ag-charts-settings-group-container,
.ag-theme-quartz-dark .ag-charts-format-top-level-group .ag-charts-format-top-level-group-container,
.ag-theme-quartz-dark .ag-charts-data-group .ag-charts-data-group-container,
.ag-theme-quartz-dark .ag-charts-settings-group .ag-charts-settings-group-container,
.ag-theme-quartz-auto-dark .ag-charts-format-top-level-group .ag-charts-format-top-level-group-container,
.ag-theme-quartz-auto-dark .ag-charts-data-group .ag-charts-data-group-container,
.ag-theme-quartz-auto-dark .ag-charts-settings-group .ag-charts-settings-group-container {
  padding: 0 var(--ag-widget-container-horizontal-padding);
}

.ag-theme-quartz .ag-charts-format-sub-level-group-title-bar,
.ag-theme-quartz-dark .ag-charts-format-sub-level-group-title-bar,
.ag-theme-quartz-auto-dark .ag-charts-format-sub-level-group-title-bar {
  padding: var(--ag-widget-vertical-spacing) 0;
}

.ag-theme-quartz .ag-charts-format-sub-level-group-container,
.ag-theme-quartz-dark .ag-charts-format-sub-level-group-container,
.ag-theme-quartz-auto-dark .ag-charts-format-sub-level-group-container {
  padding-top: var(--ag-widget-vertical-spacing);
  padding-bottom: var(--ag-widget-container-vertical-padding);
}

.ag-theme-quartz .ag-charts-format-top-level-group-container > *,
.ag-theme-quartz .ag-charts-format-sub-level-group-container > *,
.ag-theme-quartz-dark .ag-charts-format-top-level-group-container > *,
.ag-theme-quartz-dark .ag-charts-format-sub-level-group-container > *,
.ag-theme-quartz-auto-dark .ag-charts-format-top-level-group-container > *,
.ag-theme-quartz-auto-dark .ag-charts-format-sub-level-group-container > * {
  margin-bottom: var(--ag-widget-vertical-spacing);
}

.ag-theme-quartz .ag-charts-data-group-item,
.ag-theme-quartz-dark .ag-charts-data-group-item,
.ag-theme-quartz-auto-dark .ag-charts-data-group-item {
  padding-bottom: var(--ag-widget-container-vertical-padding);
}

.ag-theme-quartz .ag-chart-settings-mini-wrapper,
.ag-theme-quartz-dark .ag-chart-settings-mini-wrapper,
.ag-theme-quartz-auto-dark .ag-chart-settings-mini-wrapper {
  padding-bottom: var(--ag-widget-container-vertical-padding);
}

.ag-theme-quartz .ag-chart-advanced-settings-section,
.ag-theme-quartz-dark .ag-chart-advanced-settings-section,
.ag-theme-quartz-auto-dark .ag-chart-advanced-settings-section {
  padding-top: var(--ag-widget-container-vertical-padding);
  padding-bottom: var(--ag-widget-container-vertical-padding);
}

.ag-theme-quartz .ag-charts-advanced-settings-top-level-group .ag-charts-advanced-settings-top-level-group-title-bar,
.ag-theme-quartz .ag-charts-advanced-settings-top-level-group .ag-charts-advanced-settings-top-level-group-container,
.ag-theme-quartz-dark .ag-charts-advanced-settings-top-level-group .ag-charts-advanced-settings-top-level-group-title-bar,
.ag-theme-quartz-dark .ag-charts-advanced-settings-top-level-group .ag-charts-advanced-settings-top-level-group-container,
.ag-theme-quartz-auto-dark .ag-charts-advanced-settings-top-level-group .ag-charts-advanced-settings-top-level-group-title-bar,
.ag-theme-quartz-auto-dark .ag-charts-advanced-settings-top-level-group .ag-charts-advanced-settings-top-level-group-container {
  padding: 0 var(--ag-widget-container-horizontal-padding);
}

.ag-theme-quartz .ag-charts-advanced-settings-top-level-group-container,
.ag-theme-quartz-dark .ag-charts-advanced-settings-top-level-group-container,
.ag-theme-quartz-auto-dark .ag-charts-advanced-settings-top-level-group-container {
  margin: 0;
}

.ag-theme-quartz .ag-charts-advanced-settings-top-level-group-item,
.ag-theme-quartz-dark .ag-charts-advanced-settings-top-level-group-item,
.ag-theme-quartz-auto-dark .ag-charts-advanced-settings-top-level-group-item {
  margin-top: calc(var(--ag-widget-vertical-spacing) * 2);
  margin-bottom: 0;
}

.ag-theme-quartz .ag-ltr .ag-group-title-bar-icon, .ag-theme-quartz-dark .ag-ltr .ag-group-title-bar-icon, .ag-theme-quartz-auto-dark .ag-ltr .ag-group-title-bar-icon {
  margin-right: var(--ag-grid-size);
}

.ag-theme-quartz .ag-rtl .ag-group-title-bar-icon, .ag-theme-quartz-dark .ag-rtl .ag-group-title-bar-icon, .ag-theme-quartz-auto-dark .ag-rtl .ag-group-title-bar-icon {
  margin-left: var(--ag-grid-size);
}

.ag-theme-quartz .ag-spectrum-color,
.ag-theme-quartz .ag-spectrum-fill,
.ag-theme-quartz-dark .ag-spectrum-color,
.ag-theme-quartz-dark .ag-spectrum-fill,
.ag-theme-quartz-auto-dark .ag-spectrum-color,
.ag-theme-quartz-auto-dark .ag-spectrum-fill {
  border-radius: var(--ag-border-radius);
}

.ag-theme-quartz .ag-spectrum-dragger,
.ag-theme-quartz-dark .ag-spectrum-dragger,
.ag-theme-quartz-auto-dark .ag-spectrum-dragger {
  border-radius: 18px;
  height: 18px;
  width: 18px;
  border: 3px solid white;
}

.ag-theme-quartz .ag-spectrum-tools,
.ag-theme-quartz-dark .ag-spectrum-tools,
.ag-theme-quartz-auto-dark .ag-spectrum-tools {
  padding-left: 0;
  padding-right: 0;
  padding-bottom: 0;
}

.ag-theme-quartz .ag-spectrum-tool,
.ag-theme-quartz-dark .ag-spectrum-tool,
.ag-theme-quartz-auto-dark .ag-spectrum-tool {
  height: 12px;
}

.ag-theme-quartz .ag-spectrum-hue-background,
.ag-theme-quartz .ag-spectrum-alpha-background,
.ag-theme-quartz-dark .ag-spectrum-hue-background,
.ag-theme-quartz-dark .ag-spectrum-alpha-background,
.ag-theme-quartz-auto-dark .ag-spectrum-hue-background,
.ag-theme-quartz-auto-dark .ag-spectrum-alpha-background {
  border-radius: 12px;
}

.ag-theme-quartz .ag-spectrum-slider,
.ag-theme-quartz-dark .ag-spectrum-slider,
.ag-theme-quartz-auto-dark .ag-spectrum-slider {
  margin-top: -15px;
  width: 18px;
  height: 18px;
  border-radius: 18px;
  border: 3px solid rgb(248, 248, 248);
}

.ag-theme-quartz .ag-recent-colors,
.ag-theme-quartz-dark .ag-recent-colors,
.ag-theme-quartz-auto-dark .ag-recent-colors {
  margin-left: var(--ag-grid-size);
  margin-right: var(--ag-grid-size);
  margin-bottom: 2px;
}

.ag-theme-quartz .ag-color-input-color,
.ag-theme-quartz .ag-color-picker-color,
.ag-theme-quartz .ag-recent-color,
.ag-theme-quartz-dark .ag-color-input-color,
.ag-theme-quartz-dark .ag-color-picker-color,
.ag-theme-quartz-dark .ag-recent-color,
.ag-theme-quartz-auto-dark .ag-color-input-color,
.ag-theme-quartz-auto-dark .ag-color-picker-color,
.ag-theme-quartz-auto-dark .ag-recent-color {
  border-radius: 4px;
}

.ag-theme-quartz .ag-recent-color,
.ag-theme-quartz-dark .ag-recent-color,
.ag-theme-quartz-auto-dark .ag-recent-color {
  border: var(--ag-borders-secondary) var(--ag-secondary-border-color);
}

.ag-theme-quartz.ag-dnd-ghost,
.ag-theme-quartz-dark.ag-dnd-ghost,
.ag-theme-quartz-auto-dark.ag-dnd-ghost {
  font-weight: 500;
}

.ag-theme-quartz .ag-standard-button,
.ag-theme-quartz-dark .ag-standard-button,
.ag-theme-quartz-auto-dark .ag-standard-button {
  font-family: inherit;
  appearance: none;
  -webkit-appearance: none;
  border-radius: var(--ag-border-radius);
  border: solid 1px var(--ag-input-border-color);
  background-color: var(--ag-background-color);
  padding: var(--ag-grid-size) calc(var(--ag-grid-size) * 2);
  cursor: pointer;
}

.ag-theme-quartz .ag-standard-button:hover,
.ag-theme-quartz-dark .ag-standard-button:hover,
.ag-theme-quartz-auto-dark .ag-standard-button:hover {
  background-color: var(--ag-row-hover-color);
}

.ag-theme-quartz .ag-standard-button:active,
.ag-theme-quartz-dark .ag-standard-button:active,
.ag-theme-quartz-auto-dark .ag-standard-button:active {
  border-color: var(--ag-active-color);
}

.ag-theme-quartz .ag-standard-button:disabled,
.ag-theme-quartz-dark .ag-standard-button:disabled,
.ag-theme-quartz-auto-dark .ag-standard-button:disabled {
  color: var(--ag-disabled-foreground-color);
  background-color: var(--ag-input-disabled-background-color);
  border-color: var(--ag-input-disabled-border-color);
}

.ag-theme-quartz .ag-column-drop-cell,
.ag-theme-quartz-dark .ag-column-drop-cell,
.ag-theme-quartz-auto-dark .ag-column-drop-cell {
  border-radius: calc(var(--ag-grid-size) * 3);
  height: calc(var(--ag-grid-size) * 3);
  padding: 0 var(--ag-grid-size);
}

.ag-theme-quartz .ag-column-drop-cell-button,
.ag-theme-quartz-dark .ag-column-drop-cell-button,
.ag-theme-quartz-auto-dark .ag-column-drop-cell-button {
  min-width: 0;
  margin: 0;
}

.ag-theme-quartz .ag-column-drop-cell-drag-handle,
.ag-theme-quartz-dark .ag-column-drop-cell-drag-handle,
.ag-theme-quartz-auto-dark .ag-column-drop-cell-drag-handle {
  margin-left: 0;
}

.ag-theme-quartz .ag-column-drop-vertical,
.ag-theme-quartz-dark .ag-column-drop-vertical,
.ag-theme-quartz-auto-dark .ag-column-drop-vertical {
  min-height: 75px;
}

.ag-theme-quartz .ag-column-drop-vertical-title-bar,
.ag-theme-quartz-dark .ag-column-drop-vertical-title-bar,
.ag-theme-quartz-auto-dark .ag-column-drop-vertical-title-bar {
  padding: var(--ag-widget-container-vertical-padding) calc(var(--ag-grid-size) * 2) 0;
}

.ag-theme-quartz .ag-ltr .ag-column-drop-vertical-icon, .ag-theme-quartz-dark .ag-ltr .ag-column-drop-vertical-icon, .ag-theme-quartz-auto-dark .ag-ltr .ag-column-drop-vertical-icon {
  margin-left: 0;
  margin-right: var(--ag-widget-horizontal-spacing);
}

.ag-theme-quartz .ag-rtl .ag-column-drop-vertical-icon, .ag-theme-quartz-dark .ag-rtl .ag-column-drop-vertical-icon, .ag-theme-quartz-auto-dark .ag-rtl .ag-column-drop-vertical-icon {
  margin-right: 0;
  margin-left: var(--ag-widget-horizontal-spacing);
}

.ag-theme-quartz .ag-column-drop-vertical-empty-message,
.ag-theme-quartz-dark .ag-column-drop-vertical-empty-message,
.ag-theme-quartz-auto-dark .ag-column-drop-vertical-empty-message {
  display: flex;
  align-items: center;
  justify-content: center;
  border: dashed 1px;
  border-color: var(--ag-border-color);
  margin: calc(var(--ag-grid-size) * 1.5) calc(var(--ag-grid-size) * 2);
  padding: calc(var(--ag-grid-size) * 2);
}

.ag-theme-quartz .ag-column-drop-empty-message,
.ag-theme-quartz-dark .ag-column-drop-empty-message,
.ag-theme-quartz-auto-dark .ag-column-drop-empty-message {
  color: var(--ag-foreground-color);
}

.ag-theme-quartz .ag-pill-select .ag-column-drop,
.ag-theme-quartz-dark .ag-pill-select .ag-column-drop,
.ag-theme-quartz-auto-dark .ag-pill-select .ag-column-drop {
  min-height: unset;
}

.ag-theme-quartz .ag-pill-select .ag-picker-field-display,
.ag-theme-quartz-dark .ag-pill-select .ag-picker-field-display,
.ag-theme-quartz-auto-dark .ag-pill-select .ag-picker-field-display {
  font-weight: 500;
  color: var(--ag-chart-menu-pill-select-button-color);
}

.ag-theme-quartz .ag-pill-select .ag-picker-field-icon .ag-icon,
.ag-theme-quartz-dark .ag-pill-select .ag-picker-field-icon .ag-icon,
.ag-theme-quartz-auto-dark .ag-pill-select .ag-picker-field-icon .ag-icon {
  color: var(--ag-chart-menu-pill-select-button-color);
}

.ag-theme-quartz .ag-status-bar,
.ag-theme-quartz-dark .ag-status-bar,
.ag-theme-quartz-auto-dark .ag-status-bar {
  font-weight: normal;
}

.ag-theme-quartz .ag-status-name-value,
.ag-theme-quartz-dark .ag-status-name-value,
.ag-theme-quartz-auto-dark .ag-status-name-value {
  padding: var(--ag-widget-container-vertical-padding) 0;
}

.ag-theme-quartz .ag-status-name-value-value,
.ag-theme-quartz .ag-paging-number,
.ag-theme-quartz .ag-paging-row-summary-panel-number,
.ag-theme-quartz-dark .ag-status-name-value-value,
.ag-theme-quartz-dark .ag-paging-number,
.ag-theme-quartz-dark .ag-paging-row-summary-panel-number,
.ag-theme-quartz-auto-dark .ag-status-name-value-value,
.ag-theme-quartz-auto-dark .ag-paging-number,
.ag-theme-quartz-auto-dark .ag-paging-row-summary-panel-number {
  font-weight: 500;
}

.ag-theme-quartz .ag-column-drop-cell-button,
.ag-theme-quartz-dark .ag-column-drop-cell-button,
.ag-theme-quartz-auto-dark .ag-column-drop-cell-button {
  opacity: 0.75;
}

.ag-theme-quartz .ag-column-drop-cell-button:hover,
.ag-theme-quartz-dark .ag-column-drop-cell-button:hover,
.ag-theme-quartz-auto-dark .ag-column-drop-cell-button:hover {
  opacity: 1;
}

.ag-theme-quartz .ag-header-cell-menu-button,
.ag-theme-quartz .ag-header-cell-filter-button,
.ag-theme-quartz .ag-panel-title-bar-button,
.ag-theme-quartz .ag-header-expand-icon,
.ag-theme-quartz .ag-column-group-icons,
.ag-theme-quartz .ag-set-filter-group-icons,
.ag-theme-quartz .ag-group-expanded .ag-icon,
.ag-theme-quartz .ag-group-contracted .ag-icon,
.ag-theme-quartz .ag-chart-settings-prev,
.ag-theme-quartz .ag-chart-settings-next,
.ag-theme-quartz .ag-group-title-bar-icon,
.ag-theme-quartz .ag-column-select-header-icon,
.ag-theme-quartz .ag-floating-filter-button-button,
.ag-theme-quartz .ag-filter-toolpanel-expand,
.ag-theme-quartz .ag-panel-title-bar-button-icon,
.ag-theme-quartz .ag-chart-menu-icon,
.ag-theme-quartz-dark .ag-header-cell-menu-button,
.ag-theme-quartz-dark .ag-header-cell-filter-button,
.ag-theme-quartz-dark .ag-panel-title-bar-button,
.ag-theme-quartz-dark .ag-header-expand-icon,
.ag-theme-quartz-dark .ag-column-group-icons,
.ag-theme-quartz-dark .ag-set-filter-group-icons,
.ag-theme-quartz-dark .ag-group-expanded .ag-icon,
.ag-theme-quartz-dark .ag-group-contracted .ag-icon,
.ag-theme-quartz-dark .ag-chart-settings-prev,
.ag-theme-quartz-dark .ag-chart-settings-next,
.ag-theme-quartz-dark .ag-group-title-bar-icon,
.ag-theme-quartz-dark .ag-column-select-header-icon,
.ag-theme-quartz-dark .ag-floating-filter-button-button,
.ag-theme-quartz-dark .ag-filter-toolpanel-expand,
.ag-theme-quartz-dark .ag-panel-title-bar-button-icon,
.ag-theme-quartz-dark .ag-chart-menu-icon,
.ag-theme-quartz-auto-dark .ag-header-cell-menu-button,
.ag-theme-quartz-auto-dark .ag-header-cell-filter-button,
.ag-theme-quartz-auto-dark .ag-panel-title-bar-button,
.ag-theme-quartz-auto-dark .ag-header-expand-icon,
.ag-theme-quartz-auto-dark .ag-column-group-icons,
.ag-theme-quartz-auto-dark .ag-set-filter-group-icons,
.ag-theme-quartz-auto-dark .ag-group-expanded .ag-icon,
.ag-theme-quartz-auto-dark .ag-group-contracted .ag-icon,
.ag-theme-quartz-auto-dark .ag-chart-settings-prev,
.ag-theme-quartz-auto-dark .ag-chart-settings-next,
.ag-theme-quartz-auto-dark .ag-group-title-bar-icon,
.ag-theme-quartz-auto-dark .ag-column-select-header-icon,
.ag-theme-quartz-auto-dark .ag-floating-filter-button-button,
.ag-theme-quartz-auto-dark .ag-filter-toolpanel-expand,
.ag-theme-quartz-auto-dark .ag-panel-title-bar-button-icon,
.ag-theme-quartz-auto-dark .ag-chart-menu-icon {
  --ag-quartz-icon-hover-color: color-mix(in srgb, transparent, var(--ag-foreground-color) 10%);
}

.ag-theme-quartz .ag-header-cell-menu-button:hover,
.ag-theme-quartz .ag-header-cell-filter-button:hover,
.ag-theme-quartz .ag-panel-title-bar-button:hover,
.ag-theme-quartz .ag-header-expand-icon:hover,
.ag-theme-quartz .ag-column-group-icons:hover,
.ag-theme-quartz .ag-set-filter-group-icons:hover,
.ag-theme-quartz .ag-group-expanded .ag-icon:hover,
.ag-theme-quartz .ag-group-contracted .ag-icon:hover,
.ag-theme-quartz .ag-chart-settings-prev:hover,
.ag-theme-quartz .ag-chart-settings-next:hover,
.ag-theme-quartz .ag-group-title-bar-icon:hover,
.ag-theme-quartz .ag-column-select-header-icon:hover,
.ag-theme-quartz .ag-floating-filter-button-button:hover,
.ag-theme-quartz .ag-filter-toolpanel-expand:hover,
.ag-theme-quartz .ag-panel-title-bar-button-icon:hover,
.ag-theme-quartz .ag-chart-menu-icon:hover,
.ag-theme-quartz-dark .ag-header-cell-menu-button:hover,
.ag-theme-quartz-dark .ag-header-cell-filter-button:hover,
.ag-theme-quartz-dark .ag-panel-title-bar-button:hover,
.ag-theme-quartz-dark .ag-header-expand-icon:hover,
.ag-theme-quartz-dark .ag-column-group-icons:hover,
.ag-theme-quartz-dark .ag-set-filter-group-icons:hover,
.ag-theme-quartz-dark .ag-group-expanded .ag-icon:hover,
.ag-theme-quartz-dark .ag-group-contracted .ag-icon:hover,
.ag-theme-quartz-dark .ag-chart-settings-prev:hover,
.ag-theme-quartz-dark .ag-chart-settings-next:hover,
.ag-theme-quartz-dark .ag-group-title-bar-icon:hover,
.ag-theme-quartz-dark .ag-column-select-header-icon:hover,
.ag-theme-quartz-dark .ag-floating-filter-button-button:hover,
.ag-theme-quartz-dark .ag-filter-toolpanel-expand:hover,
.ag-theme-quartz-dark .ag-panel-title-bar-button-icon:hover,
.ag-theme-quartz-dark .ag-chart-menu-icon:hover,
.ag-theme-quartz-auto-dark .ag-header-cell-menu-button:hover,
.ag-theme-quartz-auto-dark .ag-header-cell-filter-button:hover,
.ag-theme-quartz-auto-dark .ag-panel-title-bar-button:hover,
.ag-theme-quartz-auto-dark .ag-header-expand-icon:hover,
.ag-theme-quartz-auto-dark .ag-column-group-icons:hover,
.ag-theme-quartz-auto-dark .ag-set-filter-group-icons:hover,
.ag-theme-quartz-auto-dark .ag-group-expanded .ag-icon:hover,
.ag-theme-quartz-auto-dark .ag-group-contracted .ag-icon:hover,
.ag-theme-quartz-auto-dark .ag-chart-settings-prev:hover,
.ag-theme-quartz-auto-dark .ag-chart-settings-next:hover,
.ag-theme-quartz-auto-dark .ag-group-title-bar-icon:hover,
.ag-theme-quartz-auto-dark .ag-column-select-header-icon:hover,
.ag-theme-quartz-auto-dark .ag-floating-filter-button-button:hover,
.ag-theme-quartz-auto-dark .ag-filter-toolpanel-expand:hover,
.ag-theme-quartz-auto-dark .ag-panel-title-bar-button-icon:hover,
.ag-theme-quartz-auto-dark .ag-chart-menu-icon:hover {
  border-radius: 1px;
  background-color: var(--ag-quartz-icon-hover-color);
  box-shadow: 0 0 0 4px var(--ag-quartz-icon-hover-color);
}

.ag-theme-quartz .ag-filter-active,
.ag-theme-quartz-dark .ag-filter-active,
.ag-theme-quartz-auto-dark .ag-filter-active {
  --ag-quartz-icon-active-color: color-mix(in srgb, transparent, var(--ag-active-color) 14%);
  --ag-quartz-icon-hover-color: color-mix(in srgb, transparent, var(--ag-active-color) 28%);
  position: relative;
  border-radius: 1px;
  background-color: var(--ag-quartz-icon-active-color);
  box-shadow: 0 0 0 4px var(--ag-quartz-icon-active-color);
}

.ag-theme-quartz .ag-filter-active::after,
.ag-theme-quartz-dark .ag-filter-active::after,
.ag-theme-quartz-auto-dark .ag-filter-active::after {
  content: "";
  position: absolute;
  width: 6px;
  height: 6px;
  top: -1px;
  right: -1px;
  border-radius: 50%;
  background-color: var(--ag-active-color);
}

.ag-theme-quartz .ag-filter-active .ag-icon-filter,
.ag-theme-quartz-dark .ag-filter-active .ag-icon-filter,
.ag-theme-quartz-auto-dark .ag-filter-active .ag-icon-filter {
  clip-path: path("M8,0C8,4.415 11.585,8 16,8L16,16L0,16L0,0L8,0Z");
}

.ag-theme-quartz .ag-chart-menu,
.ag-theme-quartz-dark .ag-chart-menu,
.ag-theme-quartz-auto-dark .ag-chart-menu {
  --ag-icon-size: 20px;
  background-color: color-mix(in srgb, transparent, var(--ag-background-color) 30%);
  padding: 4px 2px;
}

.ag-theme-quartz .ag-chart-menu-icon,
.ag-theme-quartz-dark .ag-chart-menu-icon,
.ag-theme-quartz-auto-dark .ag-chart-menu-icon {
  opacity: 0.8;
}

.ag-theme-quartz .ag-drag-handle,
.ag-theme-quartz-dark .ag-drag-handle,
.ag-theme-quartz-auto-dark .ag-drag-handle {
  color: var(--ag-icon-font-color);
}

.ag-theme-quartz .ag-menu-option-icon,
.ag-theme-quartz .ag-compact-menu-option-icon,
.ag-theme-quartz-dark .ag-menu-option-icon,
.ag-theme-quartz-dark .ag-compact-menu-option-icon,
.ag-theme-quartz-auto-dark .ag-menu-option-icon,
.ag-theme-quartz-auto-dark .ag-compact-menu-option-icon {
  width: var(--ag-icon-size);
  cursor: pointer;
}

.ag-theme-quartz .ag-ltr .ag-menu-option-icon, .ag-theme-quartz .ag-ltr .ag-compact-menu-option-icon, .ag-theme-quartz-dark .ag-ltr .ag-menu-option-icon, .ag-theme-quartz-dark .ag-ltr .ag-compact-menu-option-icon, .ag-theme-quartz-auto-dark .ag-ltr .ag-menu-option-icon, .ag-theme-quartz-auto-dark .ag-ltr .ag-compact-menu-option-icon {
  padding-left: calc(var(--ag-grid-size) * 1.5);
}

.ag-theme-quartz .ag-rtl .ag-menu-option-icon, .ag-theme-quartz .ag-rtl .ag-compact-menu-option-icon, .ag-theme-quartz-dark .ag-rtl .ag-menu-option-icon, .ag-theme-quartz-dark .ag-rtl .ag-compact-menu-option-icon, .ag-theme-quartz-auto-dark .ag-rtl .ag-menu-option-icon, .ag-theme-quartz-auto-dark .ag-rtl .ag-compact-menu-option-icon {
  padding-right: calc(var(--ag-grid-size) * 1.5);
}

.ag-theme-quartz .ag-chart-settings-card-item.ag-not-selected:hover,
.ag-theme-quartz-dark .ag-chart-settings-card-item.ag-not-selected:hover,
.ag-theme-quartz-auto-dark .ag-chart-settings-card-item.ag-not-selected:hover {
  opacity: 0.35;
}

.ag-theme-quartz .ag-ltr .ag-panel-title-bar-button, .ag-theme-quartz-dark .ag-ltr .ag-panel-title-bar-button, .ag-theme-quartz-auto-dark .ag-ltr .ag-panel-title-bar-button {
  margin-left: calc(var(--ag-grid-size) * 2);
  margin-right: var(--ag-grid-size);
}

.ag-theme-quartz .ag-rtl .ag-panel-title-bar-button, .ag-theme-quartz-dark .ag-rtl .ag-panel-title-bar-button, .ag-theme-quartz-auto-dark .ag-rtl .ag-panel-title-bar-button {
  margin-right: calc(var(--ag-grid-size) * 2);
  margin-left: var(--ag-grid-size);
}

.ag-theme-quartz .ag-multi-filter-group-title-bar,
.ag-theme-quartz-dark .ag-multi-filter-group-title-bar,
.ag-theme-quartz-auto-dark .ag-multi-filter-group-title-bar {
  padding: calc(var(--ag-grid-size) * 1.5) var(--ag-grid-size);
}

.ag-theme-quartz .ag-ltr .ag-filter-toolpanel-instance-body, .ag-theme-quartz-dark .ag-ltr .ag-filter-toolpanel-instance-body, .ag-theme-quartz-auto-dark .ag-ltr .ag-filter-toolpanel-instance-body {
  padding-left: var(--ag-grid-size);
}

.ag-theme-quartz .ag-rtl .ag-filter-toolpanel-instance-body, .ag-theme-quartz-dark .ag-rtl .ag-filter-toolpanel-instance-body, .ag-theme-quartz-auto-dark .ag-rtl .ag-filter-toolpanel-instance-body {
  padding-right: var(--ag-grid-size);
}

.ag-theme-quartz .ag-filter-toolpanel-instance-filter,
.ag-theme-quartz-dark .ag-filter-toolpanel-instance-filter,
.ag-theme-quartz-auto-dark .ag-filter-toolpanel-instance-filter {
  border: none;
  background-color: var(--ag-control-panel-background-color);
}

.ag-theme-quartz .ag-ltr .ag-filter-toolpanel-instance-filter, .ag-theme-quartz-dark .ag-ltr .ag-filter-toolpanel-instance-filter, .ag-theme-quartz-auto-dark .ag-ltr .ag-filter-toolpanel-instance-filter {
  margin-left: calc(var(--ag-icon-size) * 0.5);
}

.ag-theme-quartz .ag-rtl .ag-filter-toolpanel-instance-filter, .ag-theme-quartz-dark .ag-rtl .ag-filter-toolpanel-instance-filter, .ag-theme-quartz-auto-dark .ag-rtl .ag-filter-toolpanel-instance-filter {
  margin-right: calc(var(--ag-icon-size) * 0.5);
}

.ag-theme-quartz .ag-filter-toolpanel-group-level-0,
.ag-theme-quartz-dark .ag-filter-toolpanel-group-level-0,
.ag-theme-quartz-auto-dark .ag-filter-toolpanel-group-level-0 {
  border-top: none;
}

.ag-theme-quartz .ag-filter-toolpanel-header,
.ag-theme-quartz-dark .ag-filter-toolpanel-header,
.ag-theme-quartz-auto-dark .ag-filter-toolpanel-header {
  height: initial;
  padding-top: var(--ag-grid-size);
  padding-bottom: var(--ag-grid-size);
}

.ag-theme-quartz .ag-filter-toolpanel-group-item,
.ag-theme-quartz-dark .ag-filter-toolpanel-group-item,
.ag-theme-quartz-auto-dark .ag-filter-toolpanel-group-item {
  margin: 0;
}

.ag-theme-quartz .ag-layout-auto-height .ag-center-cols-viewport,
.ag-theme-quartz .ag-layout-auto-height .ag-center-cols-container,
.ag-theme-quartz .ag-layout-print .ag-center-cols-viewport,
.ag-theme-quartz .ag-layout-print .ag-center-cols-container,
.ag-theme-quartz-dark .ag-layout-auto-height .ag-center-cols-viewport,
.ag-theme-quartz-dark .ag-layout-auto-height .ag-center-cols-container,
.ag-theme-quartz-dark .ag-layout-print .ag-center-cols-viewport,
.ag-theme-quartz-dark .ag-layout-print .ag-center-cols-container,
.ag-theme-quartz-auto-dark .ag-layout-auto-height .ag-center-cols-viewport,
.ag-theme-quartz-auto-dark .ag-layout-auto-height .ag-center-cols-container,
.ag-theme-quartz-auto-dark .ag-layout-print .ag-center-cols-viewport,
.ag-theme-quartz-auto-dark .ag-layout-print .ag-center-cols-container {
  min-height: 150px;
}

.ag-theme-quartz .ag-date-time-list-page-entry-is-current,
.ag-theme-quartz-dark .ag-date-time-list-page-entry-is-current,
.ag-theme-quartz-auto-dark .ag-date-time-list-page-entry-is-current {
  background-color: var(--ag-active-color);
}

.ag-theme-quartz .ag-advanced-filter-builder-button,
.ag-theme-quartz-dark .ag-advanced-filter-builder-button,
.ag-theme-quartz-auto-dark .ag-advanced-filter-builder-button {
  padding: var(--ag-grid-size);
  font-weight: 600;
}

.ag-theme-quartz .ag-advanced-filter-builder-item-button-disabled .ag-icon,
.ag-theme-quartz .ag-disabled .ag-icon,
.ag-theme-quartz .ag-column-select-column-group-readonly .ag-icon,
.ag-theme-quartz [disabled] .ag-icon,
.ag-theme-quartz-dark .ag-advanced-filter-builder-item-button-disabled .ag-icon,
.ag-theme-quartz-dark .ag-disabled .ag-icon,
.ag-theme-quartz-dark .ag-column-select-column-group-readonly .ag-icon,
.ag-theme-quartz-dark [disabled] .ag-icon,
.ag-theme-quartz-auto-dark .ag-advanced-filter-builder-item-button-disabled .ag-icon,
.ag-theme-quartz-auto-dark .ag-disabled .ag-icon,
.ag-theme-quartz-auto-dark .ag-column-select-column-group-readonly .ag-icon,
.ag-theme-quartz-auto-dark [disabled] .ag-icon {
  opacity: 0.6;
}

.ag-theme-quartz .ag-icon-grip,
.ag-theme-quartz-dark .ag-icon-grip,
.ag-theme-quartz-auto-dark .ag-icon-grip {
  opacity: 0.7;
}

.ag-theme-quartz .ag-column-select-column-readonly.ag-icon-grip,
.ag-theme-quartz .ag-column-select-column-readonly .ag-icon-grip,
.ag-theme-quartz-dark .ag-column-select-column-readonly.ag-icon-grip,
.ag-theme-quartz-dark .ag-column-select-column-readonly .ag-icon-grip,
.ag-theme-quartz-auto-dark .ag-column-select-column-readonly.ag-icon-grip,
.ag-theme-quartz-auto-dark .ag-column-select-column-readonly .ag-icon-grip {
  opacity: 0.35;
}

.ag-theme-quartz .ag-column-select-header-filter-wrapper .ag-input-wrapper::before,
.ag-theme-quartz .ag-filter-toolpanel-search .ag-input-wrapper::before,
.ag-theme-quartz .ag-mini-filter .ag-input-wrapper::before,
.ag-theme-quartz .ag-filter-filter .ag-input-wrapper::before,
.ag-theme-quartz-dark .ag-column-select-header-filter-wrapper .ag-input-wrapper::before,
.ag-theme-quartz-dark .ag-filter-toolpanel-search .ag-input-wrapper::before,
.ag-theme-quartz-dark .ag-mini-filter .ag-input-wrapper::before,
.ag-theme-quartz-dark .ag-filter-filter .ag-input-wrapper::before,
.ag-theme-quartz-auto-dark .ag-column-select-header-filter-wrapper .ag-input-wrapper::before,
.ag-theme-quartz-auto-dark .ag-filter-toolpanel-search .ag-input-wrapper::before,
.ag-theme-quartz-auto-dark .ag-mini-filter .ag-input-wrapper::before,
.ag-theme-quartz-auto-dark .ag-filter-filter .ag-input-wrapper::before {
  position: absolute;
  display: block;
  width: 12px;
  height: 12px;
  background-image: url("data:image/svg+xml;charset=utf-8;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMiIgaGVpZ2h0PSIxMiIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjMDAwIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iMS41Ij48cGF0aCBkPSJNNS4zIDlhMy43IDMuNyAwIDEgMCAwLTcuNSAzLjcgMy43IDAgMCAwIDAgNy41Wk0xMC41IDEwLjUgOC4zIDguMiIvPjwvc3ZnPg==");
  background-position: 50% 50%;
  background-size: contain;
  opacity: 40%;
  content: "";
  filter: var(--ag-icon-filter);
}

.ag-theme-quartz .ag-ltr .ag-column-select-header-filter-wrapper .ag-input-wrapper::before, .ag-theme-quartz .ag-ltr .ag-filter-toolpanel-search .ag-input-wrapper::before, .ag-theme-quartz .ag-ltr .ag-mini-filter .ag-input-wrapper::before, .ag-theme-quartz .ag-ltr .ag-filter-filter .ag-input-wrapper::before, .ag-theme-quartz-dark .ag-ltr .ag-column-select-header-filter-wrapper .ag-input-wrapper::before, .ag-theme-quartz-dark .ag-ltr .ag-filter-toolpanel-search .ag-input-wrapper::before, .ag-theme-quartz-dark .ag-ltr .ag-mini-filter .ag-input-wrapper::before, .ag-theme-quartz-dark .ag-ltr .ag-filter-filter .ag-input-wrapper::before, .ag-theme-quartz-auto-dark .ag-ltr .ag-column-select-header-filter-wrapper .ag-input-wrapper::before, .ag-theme-quartz-auto-dark .ag-ltr .ag-filter-toolpanel-search .ag-input-wrapper::before, .ag-theme-quartz-auto-dark .ag-ltr .ag-mini-filter .ag-input-wrapper::before, .ag-theme-quartz-auto-dark .ag-ltr .ag-filter-filter .ag-input-wrapper::before {
  margin-left: var(--ag-grid-size);
}

.ag-theme-quartz .ag-rtl .ag-column-select-header-filter-wrapper .ag-input-wrapper::before, .ag-theme-quartz .ag-rtl .ag-filter-toolpanel-search .ag-input-wrapper::before, .ag-theme-quartz .ag-rtl .ag-mini-filter .ag-input-wrapper::before, .ag-theme-quartz .ag-rtl .ag-filter-filter .ag-input-wrapper::before, .ag-theme-quartz-dark .ag-rtl .ag-column-select-header-filter-wrapper .ag-input-wrapper::before, .ag-theme-quartz-dark .ag-rtl .ag-filter-toolpanel-search .ag-input-wrapper::before, .ag-theme-quartz-dark .ag-rtl .ag-mini-filter .ag-input-wrapper::before, .ag-theme-quartz-dark .ag-rtl .ag-filter-filter .ag-input-wrapper::before, .ag-theme-quartz-auto-dark .ag-rtl .ag-column-select-header-filter-wrapper .ag-input-wrapper::before, .ag-theme-quartz-auto-dark .ag-rtl .ag-filter-toolpanel-search .ag-input-wrapper::before, .ag-theme-quartz-auto-dark .ag-rtl .ag-mini-filter .ag-input-wrapper::before, .ag-theme-quartz-auto-dark .ag-rtl .ag-filter-filter .ag-input-wrapper::before {
  margin-right: var(--ag-grid-size);
}

.ag-theme-quartz .ag-ltr .ag-column-select-header-filter-wrapper input.ag-text-field-input, .ag-theme-quartz .ag-ltr .ag-column-select-header-filter-wrapper input.ag-number-field-input, .ag-theme-quartz .ag-ltr .ag-filter-toolpanel-search input.ag-text-field-input, .ag-theme-quartz .ag-ltr .ag-filter-toolpanel-search input.ag-number-field-input, .ag-theme-quartz .ag-ltr .ag-mini-filter input.ag-text-field-input, .ag-theme-quartz .ag-ltr .ag-mini-filter input.ag-number-field-input, .ag-theme-quartz .ag-ltr .ag-filter-filter input.ag-text-field-input, .ag-theme-quartz .ag-ltr .ag-filter-filter input.ag-number-field-input, .ag-theme-quartz-dark .ag-ltr .ag-column-select-header-filter-wrapper input.ag-text-field-input, .ag-theme-quartz-dark .ag-ltr .ag-column-select-header-filter-wrapper input.ag-number-field-input, .ag-theme-quartz-dark .ag-ltr .ag-filter-toolpanel-search input.ag-text-field-input, .ag-theme-quartz-dark .ag-ltr .ag-filter-toolpanel-search input.ag-number-field-input, .ag-theme-quartz-dark .ag-ltr .ag-mini-filter input.ag-text-field-input, .ag-theme-quartz-dark .ag-ltr .ag-mini-filter input.ag-number-field-input, .ag-theme-quartz-dark .ag-ltr .ag-filter-filter input.ag-text-field-input, .ag-theme-quartz-dark .ag-ltr .ag-filter-filter input.ag-number-field-input, .ag-theme-quartz-auto-dark .ag-ltr .ag-column-select-header-filter-wrapper input.ag-text-field-input, .ag-theme-quartz-auto-dark .ag-ltr .ag-column-select-header-filter-wrapper input.ag-number-field-input, .ag-theme-quartz-auto-dark .ag-ltr .ag-filter-toolpanel-search input.ag-text-field-input, .ag-theme-quartz-auto-dark .ag-ltr .ag-filter-toolpanel-search input.ag-number-field-input, .ag-theme-quartz-auto-dark .ag-ltr .ag-mini-filter input.ag-text-field-input, .ag-theme-quartz-auto-dark .ag-ltr .ag-mini-filter input.ag-number-field-input, .ag-theme-quartz-auto-dark .ag-ltr .ag-filter-filter input.ag-text-field-input, .ag-theme-quartz-auto-dark .ag-ltr .ag-filter-filter input.ag-number-field-input {
  padding-left: 26px;
}

.ag-theme-quartz .ag-rtl .ag-column-select-header-filter-wrapper input.ag-text-field-input, .ag-theme-quartz .ag-rtl .ag-column-select-header-filter-wrapper input.ag-number-field-input, .ag-theme-quartz .ag-rtl .ag-filter-toolpanel-search input.ag-text-field-input, .ag-theme-quartz .ag-rtl .ag-filter-toolpanel-search input.ag-number-field-input, .ag-theme-quartz .ag-rtl .ag-mini-filter input.ag-text-field-input, .ag-theme-quartz .ag-rtl .ag-mini-filter input.ag-number-field-input, .ag-theme-quartz .ag-rtl .ag-filter-filter input.ag-text-field-input, .ag-theme-quartz .ag-rtl .ag-filter-filter input.ag-number-field-input, .ag-theme-quartz-dark .ag-rtl .ag-column-select-header-filter-wrapper input.ag-text-field-input, .ag-theme-quartz-dark .ag-rtl .ag-column-select-header-filter-wrapper input.ag-number-field-input, .ag-theme-quartz-dark .ag-rtl .ag-filter-toolpanel-search input.ag-text-field-input, .ag-theme-quartz-dark .ag-rtl .ag-filter-toolpanel-search input.ag-number-field-input, .ag-theme-quartz-dark .ag-rtl .ag-mini-filter input.ag-text-field-input, .ag-theme-quartz-dark .ag-rtl .ag-mini-filter input.ag-number-field-input, .ag-theme-quartz-dark .ag-rtl .ag-filter-filter input.ag-text-field-input, .ag-theme-quartz-dark .ag-rtl .ag-filter-filter input.ag-number-field-input, .ag-theme-quartz-auto-dark .ag-rtl .ag-column-select-header-filter-wrapper input.ag-text-field-input, .ag-theme-quartz-auto-dark .ag-rtl .ag-column-select-header-filter-wrapper input.ag-number-field-input, .ag-theme-quartz-auto-dark .ag-rtl .ag-filter-toolpanel-search input.ag-text-field-input, .ag-theme-quartz-auto-dark .ag-rtl .ag-filter-toolpanel-search input.ag-number-field-input, .ag-theme-quartz-auto-dark .ag-rtl .ag-mini-filter input.ag-text-field-input, .ag-theme-quartz-auto-dark .ag-rtl .ag-mini-filter input.ag-number-field-input, .ag-theme-quartz-auto-dark .ag-rtl .ag-filter-filter input.ag-text-field-input, .ag-theme-quartz-auto-dark .ag-rtl .ag-filter-filter input.ag-number-field-input {
  padding-right: 26px;
}

.ag-theme-quartz .ag-ltr .ag-column-select-add-group-indent, .ag-theme-quartz-dark .ag-ltr .ag-column-select-add-group-indent, .ag-theme-quartz-auto-dark .ag-ltr .ag-column-select-add-group-indent {
  margin-left: calc(var(--ag-icon-size) + var(--ag-grid-size) * 1.5);
}

.ag-theme-quartz .ag-rtl .ag-column-select-add-group-indent, .ag-theme-quartz-dark .ag-rtl .ag-column-select-add-group-indent, .ag-theme-quartz-auto-dark .ag-rtl .ag-column-select-add-group-indent {
  margin-right: calc(var(--ag-icon-size) + var(--ag-grid-size) * 1.5);
}

.ag-theme-quartz .ag-text-field-input[disabled],
.ag-theme-quartz .ag-menu-option-disabled,
.ag-theme-quartz-dark .ag-text-field-input[disabled],
.ag-theme-quartz-dark .ag-menu-option-disabled,
.ag-theme-quartz-auto-dark .ag-text-field-input[disabled],
.ag-theme-quartz-auto-dark .ag-menu-option-disabled {
  cursor: not-allowed;
}

.ag-theme-quartz .ag-checkbox-input-wrapper.ag-checked.ag-disabled,
.ag-theme-quartz-dark .ag-checkbox-input-wrapper.ag-checked.ag-disabled,
.ag-theme-quartz-auto-dark .ag-checkbox-input-wrapper.ag-checked.ag-disabled {
  --ag-checkbox-checked-color: var(--ag-checkbox-unchecked-color);
}

.ag-theme-quartz .ag-checkbox-input,
.ag-theme-quartz .ag-toggle-button-input,
.ag-theme-quartz .ag-radio-button-input,
.ag-theme-quartz input[class^=ag-][type=range],
.ag-theme-quartz-dark .ag-checkbox-input,
.ag-theme-quartz-dark .ag-toggle-button-input,
.ag-theme-quartz-dark .ag-radio-button-input,
.ag-theme-quartz-dark input[class^=ag-][type=range],
.ag-theme-quartz-auto-dark .ag-checkbox-input,
.ag-theme-quartz-auto-dark .ag-toggle-button-input,
.ag-theme-quartz-auto-dark .ag-radio-button-input,
.ag-theme-quartz-auto-dark input[class^=ag-][type=range] {
  cursor: pointer;
}

.ag-theme-quartz .ag-details-row,
.ag-theme-quartz-dark .ag-details-row,
.ag-theme-quartz-auto-dark .ag-details-row {
  padding: calc(var(--ag-grid-size) * 3.75);
}

.ag-theme-quartz-dark .ag-column-select-header-filter-wrapper .ag-input-wrapper::before,
.ag-theme-quartz-dark .ag-filter-toolpanel-search .ag-input-wrapper::before,
.ag-theme-quartz-dark .ag-mini-filter .ag-input-wrapper::before,
.ag-theme-quartz-dark .ag-filter-filter .ag-input-wrapper::before {
  opacity: 66%;
  filter: invert(100%);
}

.ag-theme-quartz-dark .ag-chart-menu {
  background-color: color-mix(in srgb, rgba(24, 39, 50, 0.3), var(--ag-background-color) 30%);
}

.ag-theme-quartz-dark .ag-text-field-input::placeholder {
  color: var(--ag-data-color);
  opacity: 0.8;
}

@font-face {
  font-family: "agGridQuartz";
  src: url(data:font/woff2;charset=utf-8;base64,d09GMgABAAAAABmsAAsAAAAANbQAABlcAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHIlWBmAAi34KxFS3OAE2AiQDgkALgSIABCAFhEYHhUIbrS1lhhRsHMDmjYY+2f9fJnBjSJQDf3Gmak2UmCoRplwn+JpsYTlytdwFD68gMxAuB6741XeLNiaMyYN/Iiaja7H1EUOGUhLUj/323jcjUYJlMU80EU94ogRKZmiBUH/jr7U+X0/3AC4BDOAS/7sQgIpQqZPxwEKiCutUygMLnSGasyZsKRo2YYIFiy8EPEDFongwrRhWQbxiSLopNaEOFUqTmm5qTrZHFe66WzFSMeAFzgogYN7fKmG3GmaqyKkJcuZTdX6S1pPWgQysvt4IsiLS+voh/7c/Nf9aap09LHbKmLfn5uSXXQaBSUDiCeFyEfB/OrPWEGLnEOaAq4q6TjMaaT1/vryWIS+yorfn9ZGikFbLXqKkOkCurrTXB3ZYQawu1RUll1g0V7TXpT5oqytTnm411z0+bukoMcg+f00X2lun4IUXCmKEACE+kpAE6lenRyKAsj4HNb6eX6ecPHBzJomInhng2DlOntjfxL1nkYIlgTuw7NOgKLrdy34IBb2MPkp1rOGX8duZ37On0REwTl4XItLicDqDRmWy2BwUhj67sc3lwbZnluMFxdG5tfcOYgid5cCtVtNehZ9qy6N8Y2XPZC7cDds5fr5VvsKT56ihWTQLJkKQ1WcJ4R0ZNjxzKu/t8IM4awcqx5ZhK4C2NmOYC8PMrLy/b+tuPdg6Y2FYi6DJoNulpfrW0iUyBGfmbB7flj4+b9u2A4Ojg7DMLMlc2lQot5k2VPOScbe2iDCsmfKIjHtnYCiqLNc97FUtol0JuSGUyx9tDMmTW27PdDTn33bOcGZq42bBvYMpTkJpSldN46kjVKfZwUqStp51wye+1u2lz/6LoCKwohYzJtX7X7GtyXp2TpAxum+e5Xx6wxbDzzBCoceT2HSt1W0cSA0adCIBQZNONWvQ2xKwrLX2dhwegjEDrnpBo/+CSmeSzfUGHo9E2G/2kWLS3okPNsBahCCpbijNlRuo69CkwPZcRJkgz/aYlslJl5Rs0p+2PbM9V5JNk8y39txZBke1ZlHnXhhyeLrFuZgzETWMvfnYprE1sMD2ZLmzI2vss+MGOI65YGuHKIcGvaYpz0Y8neFkb4yDKAZceNtQ5ixPBmuPECo9TwnmxxqwwyKyG3O1yyiz1MuuRRSq95CmAoIzc1s7w9uTM5LejRtokJ6oz4Gv5IePP2FBASR0BqK9WN6b2PG1oKaO/AnYyM592zB8fiuQAzJAh2/MpdbiUrQA3nsdMCHv9BC/Aqo4FKLjCc97s6n/+y86PeApLzZRSo+sIMXBtKopUIW9MrMAebbMG1iW5qRjTJwMsUcY19rRBULBCBoz210OTyCSyBQ+fgFBIWr9UTFxCZwFmJKWkZUjyisoKikLqqiqqWtoamnr6OrpGxjyGxmbmILIQ3QnT2nUNTGb7j1rCwuWozODdrf/+4fN/WlofVwCrwowGQ9WVctXZArYJF3AFpkAtskIsEOmgV3SC+yRRWCfdAMHZAw4JP3AMRkHTsgocEpmgDMyCJyTAeCCzAFXpAe4JsPADekDbskscEcWgHsyBDyQSeCRzANP1y6BJgIJUgBADAAkAEAaAMgAAFkAIAcA5AGAAgBQBABKAEAZAKgAAH0AQD8AMAAADAIAQwDAMAAwAgCMAgBjAMA4ADABAEwCAFMAwDQAMAMAzAIAcwDAPFS5sQBwiUUAYAkAWAYAVgCAVaiyYg2gCOsAwAYAsAkAbAEA2wDADgCwCwDsAQD7AMABAHAIABwBAMcAwAlUteEUgA1VAKAGANQhoITlzRa+gU9Q/qf2I3Li106LExgVpVnKQxjkqZk/ObMidiGpueT8tqQ2PGZHiVYjBBKD4ckloivb1pN5uXp2kE1l4ymJSctRdtYwWPKH0wEsDNwsX+Kl5KFbL1yOteU6L8pqSyE+NCvSSZVQMl+QJUlW5JWZil+coEQqEKEj0QVJNaqyP9zNF/ORTFrCwSAOBeVwPJlMRxIZgVz+iGI8gvM6LXJp4jHgR9hn2dRlE/KX0iwKLg8JpHDBKZOuXrEc3cK8bFR4RNpbktpLK/3TUFBQzHwxKHPEPemSPVYh52btL5tI2tUqu0rTu4ys7eWL8y9Eomq1uFDYnSrdfQfjF733Za2SVpL1SMCWKrm88qJqYfczJVegXwuoOvGYrLjFJ1Fw+2ResiOlvW4hH7sMWNWJZPWWbf+E84zw80iIImUxujRJtJnWM+JYtWLw+IU8A4YNd5ccTnjnCqK1wtoj9om+aLEsCpZyVDD5k9kt9HqSllAqEDPwm55gmtD4VPQz+F60fNGZSQOJEi59194/82c03/ySrw4PGT+Kf8ULrK+kh8lR+pMueTU3jJYrXifpXpkhEB70Qh2mYbYHVeKKvfd3OTFyFLH4tiOzmFZzehnv6crh4CgZH0ZrnBVdKZNR2UxJsG0Fh9CDbu55MjrIEDgwAp7DY0P0HXS9YrgMjuUYmUU+UFIlaRKwt0pBieFxOiULAVVdq82vlDTVQjoKdEYluGHl0NiWVMvIwKySisFRjgRl78c+q12XyYB8PnsTjwyc0EKRFooqyR0aAzr9tPl7D2S07t8zqipKmfvm/Q3EB7qlxuItPMEwcFLUA3jE3gDsJ0+nlaxgc9z1O5AvX5RbUqibURkH9bC+myOLzen2dGgYoiU6Po9zfPlsON32RAk9k1JiKrCGzy3JrbBmWCyipmnbZrbFIoeVKr1aHaqXiiQvmDakMWnR5wDLZZ5VL4SMhp6tKRqVWEo5IpiQIUHJnceWJaozXBElto57YC/pR30ySpIoKq5SMrTVq+Dv1UZhXBhPxckNou2a2hGnLrOJu5YgyillKpS6xmIaHLTzPxEpQ8scv5Dj5UdAe8IVLVQU2uROV7SZbsL5qcc812Wl3b2gkcMFcYUqaBtg+BLSe7CHYtpZN1cQ36lF+ojOEiWKewqjd9rTwn1GS/+Gq187dGDqRAzwopxfGSwtyma5Wz5ErfagXSKzJ+xC42QvbVVpld/Gh6Gcnb5zW+3m4P5KghzLIJKczT7ojhCwWB27MHQguUKJ8KkJXSx+ZqGrVXv7z45rSaP1To/u7p1td7bXz/j9wpAacwmWw4PZNzEvW9vafRf1k17Yg/s0HIYwikiSIPKmHd/bP7esu7V2WvW5AUbAZQ7mwNQCp769c3rF7t7To0pEtOQmCrjnix50Ndz0lZN4OprysAs9Tk9XLQKv067qMWg+a+M2pwavN81EaFZ2THFMgZu+dTHrLiO5Dc+Rzt5a7Ve90qv4AAiPXb7RhljaAvecls4kD2deTuBtn6iLh69pzFTZo7IBFGkTBh+qN2vaAySq1TVIvU/+729GTX1dAGB/tpIjUc6BoZbu+QB39DTAxt7OXFaTCXCvplGSenqq0rqHp3SnOrXkKF/zDIVyt6VLxrsazWmTn9XIq32Y//YDz4I3PEkMO5RkRhLeHdRvaZJO8+Ls0aU+aFDjYABF0V6evXhjRuEqYs9nwXOG39QWgx3haO2P55NcfSsWgQmPTk6WYhIr3fjeCKcPUG93jfzRXaMFOJBWEi0hIIPMvIMOqnVBdA3ijDasjkdmAV84g5S6++tZuTQ/CU9SlrGXy1haGczkpmHeHqjryd7OCh/IgOUumfNa1aoK2l2zlSv4E3VOSzn4aNoXDYxsYmBbs62DU7l8rtPm8NZ2d2LZtrE4GQasevPrbd0Hxvu7jqh2DX0ZAclTrv0+MFGgHNpq9ZFSIWlPPisaHp9M4OObNZqbEn63TJkdpoPIYnpi6uFjWS1n4fTIC2XyZGxMPpJVhmYQpUC0PbgekWJXMM/xkKnYgrfEOa5Tiapmfn2g4tKlNCotLo+ve2FXT2sIcbzBQTPL6qX+o+13e9vMUPnolMocb1ZJaUIhLevTVkmjxDNSatY9nLKgmBeUUlGnvqJTzs37GZfKHJs+b5osE9hHhauZ+7fIe9WYVcE1kSnO3rW+hihvY+yw4GYVHTVazHt2VoAc0tsYBw9wRLr/e4gaaKFdqneOTgyAQgP/9jbChrdsC2qcZyqymh8T7uprQs265WP36WtMusxf6esqKIeOl75ulFE1V7Hmb17GouDmAGiGvjr7Or5XwmokqVIiTLnkcL50USoDJ8kjNIUnSneznkjq4gc24hY5Es1nV317AVSHXqz53SJ4+MKcHs0y/HiB7u0kkpo/nzkICc4KaJKYYFrJTccW35Y67SVpkJAQnOUcAg4y55/zWPhh3IfxC7iAn36OltCLF5PWOySUmQFGSGuDhFq8OKOBXqdj5xS1XgLgJ7ym+WDgmSrjl3QBhrk1O4fdXDu/EZVyWEJeQj12FvBmBdMY7e5OWh+WU/fvXUcIzMC5/sgFlXo4COu/3FT3np7e3hcSg+Syiz09rcX8LB3eG5n1Oh5bKsZ7ewBPVQ4NnB0cA7YxmUMp2VZVsg1lJ55CE2aEwwX1hgFz08ctyjGafIILMtarAhdNLC5JRJFwpM6eLCpCE0PDQ1FtSVESumIyuMgG7nbHeIgtZ9Qeq4q66oWaqi3LZzbxqe8ys5ExWuzIcD2SwrimqOzaBoSqcPamHetb+za02VbU8IfS11TFHg093NzF81e8Xd+//vGK+c3ZgZm3UpMv21VTX6JYlZraGeIe0pqeRjzmPCYsWlOhO1NTVz32BKjwHIUZMHN5OUXhLCVLQWFVxmDEIKOwgMboxMT1Nys6uok2pxiszXSmvX2E69QLN24YvAysJbzNgs08r7UlbiBhw0+N9HTMaakGNMSz3XLWZrQ7nH/bsvPteQc000cDbFWz2QPcGNG+AGHcULpPFCM8JQ3JnTRf9FqN1u/aPXX31no0ExUNbaUVyQ0GRNt2VTqVA2EWSkvooSH4qKvt1mRv5KMlwO4mxiLaVvWgETNBRLovtC10nxRpe839IrWaBMz+2KHO52ROG8IqfJZwo4dwg5C7YT23nRvOY58ARD7+i6oZMdrV1c2VxEwYldzIlcYIjKSvYMgOBaIe9xUV1JStUJ9kYEVYGFaIRa3OkRr8dLfnu9p6PeOprZ+c9QejrO05OuHs3h+fXU4Wb5IITuugs5v3nwfgCPs11zQx/qlF3fYT5v1y98pNr3Vil2g8ljrtPuHk4TE0LnSF/EHlMo7Dnmur1Q1fHNmZkHmq4expl+G7OJBj8ZAsainGXfYyI6L8tG9Z14RMu3zV7+9cD9xxPjZ2nZTwN7lLgdtKaweti721e8QTt7JOp84yt7B7Mlv7vc6ad3Cn8/lmBamgFVSXNmpCzmxREVeTaj9nT0NjQCCl1oOhf/5UM9KF8crwVGayu8kt2TE1XBkvTLdSNUS7U5MPkoICk43n+KTCrKAU9Nq6Owo9PfQ2HODLgqABIzhvHz+hphskpFBAY2sTLxqUb06N/slj4s7k47s59fFzVs+Pd0vuZuM/2sflTsq9eUT1zLY71JGdmDQvo37n/Fi4x5ZjG+2uKchaENn51K5byXQG/kIjYYbRsbWomK2r1WvMOYKuAl9VDCifEZ7oJ1ePk/slle5rr2zwlt99mN4T/fBDPnMg7ofWL9etUtAXvUTw2P13cuSLC530qpbL0y+6kla5HnmuSqVrnkcuj5reED5cMC1rWBlUslAQ11DZ3l667Iy0W65O9JsRXh4SAlTLxLOHa5Kzhy7f944EuVrsddwAc1z5hhQiWiOESrON0aQehYG5lkb/hIKtcle163Ip3smtBQn+jUokJ0zRa39bGagKTvBI92qDAmWUXfO2fa8iLAeZ6M2j5XE3bVdIUlBQ0lQpbp66f8Ldcg6bUDbaC2j/hgT8zrOX1d8h0fHBRy4INRaM5zh70YGAMbQDZH9zmXLQ3vofG+r9hbTenkKRXNR/pOP7/QDwW8ejFTqyYoi3n2ssjVLPQTYZLxcVaxsB6U0ZhdGCadyBiEke7U1UM8J2NAOdJsCLsxV6BzwtncLI9LSy0DRolBihaMQKpPpZmaDPQem0sU9DTu4D9AOOsGq4ZoaKkh/2IA/D60ykLhCqPEnJ4RQqIKA/jh/Xb6rbuy0m+yxmSGAENIOeWu6IaNUYVfSgZ6xr6R4bnCacpORnTNGaiYp0UXDOtEvduYNZsjGyrEFuLF0VOLFB6aKJCn7m5IvekhMGhXbM2Mm3yiTOXhIQCpsnIdmxmTsIs/BQeyvW9JEYXVNjtjakmF2iMcl9D6gMJXoOu/iBsIqRsAzd5O8pyjGeZshlqXw1NZTEYL0tkdh73QSsjLmyXupAHQ6kiKFvHX1/v5W29v/CeRtuPwwJOIxMHxsBjpKMpYj/6qdbUYPu7wfz/4Ym3jGNiRwzP8KtfuIEn4N79lMDjDu9i8bovj5cal4Rq7K/3mIxY6HsgdAT1vitdCvrLRa938QbBvz01eJnf/utzuSxrHqckhit6b1ava7Z2cxoJivQnid2/tgxgM6KBG7uCsWY0fLcKcnB2qAgbXAyIcVpbdDeNPFZkZ1dN7ZgzMyZYwrGfT/KUUbZDvg27rz1GygY+9pgXEEdcEXuCxx5XNGpgJGrPOCUaNBjQDWJa2APoWp0kHVHYiqzuCGaOslncV1miBr9yPRrJyCdO0k94KEOzsRFNjtfTHxx4imHgOKsLHKEIYU62EFhdJ1YXFfLLirGszLF0AScbjY6D3C1opNShsZzM2+bQ1tTnBgtFcdxDJwYSHDW11eKxoub2hy2zfjqGYMm1HqiGh81KoUmeEdcCuJFTe323M9c+/bNcSJQKr4DjRx/ltpHw2pDSsruFvm7OQRwhIkjpIgZWnzlZqL3RKKxsxQjPC3toBSO1kH+fY4RdnUpP9+1K5Fd6st23dG1zJ3dwUk38u6YoQECb1nfPJurhfLshJmwaVTOKLRwRkfKhJnxTbAqpyqf2ZoyRu43vsEhKftPDtgUP3N8yvGCWY4DYcpM5ubcQj0nfX6MOFDIzJ2ybWNhtnPr9NYUFp47tREmL41JjFnqXXXoUJW3LqxxeRqjkYzzuN9CG0bK0vxnaur1m/rrlfpZtd/wVRxw+ktrUQ6/diXuAeizaamvz8yDz2IBPioDEVbP4cMWda+EHBp2BfPwMK7lsGpr8Z82PZCAgq/kVISxkMBMELzf4aRlD+BXNQLn4u8ixe3YXHxoCF+/HbjCEXg6xb7BBu8T7xoQJUNJCfngvgXMkVD9OjtpjASZvVPdMP9L56yHszB2INLmHdC74RbNWQxZOOjNKV2Tm+xvv7qdOsrL9LXN/Jzi1ppfD2liOvnTaWGwLBjrAQdtOkOPvIjRb1wf9WlMJ/YiljuYLRstA3yhIGQzf3OIo+MzfMZsNWUkzbDqdTUCCJzCyqvm5EVky2TZEXlPI/Kdzpbt3NP8z0h+LE9BHW3zTHGuKKu5OUuUK74txcq8tyhLnHs7x3wXpJbs/FLXky0t1Uu6RSK1xgimIHN4DmlEbzaSPzPvBTVrZ86HLrL/nGkIxhBTxhsDtgxghUlxKmw3qycIWPvHY4VabOHNFFl4Zma4TDE7+evIjvZto2Pkt9lJCllmWHjmOpWEJfAi6K/ZSfIMWXhzUr6zfy/xogWw7N9o0T9K2BuZlyRvUcV5ociEODMRhFSg5S/hkaGXWWZAWi6h2hDvxH3EUGsukgjA/39lSpGvs0Q5cuMZY5DJeXlqP4x7vAxKhGU7kKA89aso4W31KtGCKA2nMBGDzE2YrH488wlyNsCFPPT0/dR/kR0i86KEDnlgKGG0JPe0IJ/0JoxR4TLEaucrqA2IU6Dn5XCFaE2UJGKsZDbPaj+MS7ycECQGG1mSPJWG5A5q/1abjvlv19sf09Dx/7F1KP4YlGf37sryhNIZtzj5iqi/8FKgLm0zwj9BtL8BWcG/jtVfP5ZBoP0ZLnQTUA4eBv4R47T4hnInSMwuCZvibyKzN0KIZmfmSI6oRfIkU1LWMt92RcgzMJTlAYl7a0YoincEzpv5gSCY+SWhRf0sGMz8lwhuDfK7iapx5wXg9xLsVwXRwzf6GkHOhwXf5T9KCUzNW7efdWB7JBRQtE2/NGX076quccKp+WSKvYqRmyz8g0a7QTV/vPQeDUN2htMKeHsisL5UEPjVwTdc2FW8GBPDmPKs//BNFPzYGGm86bwyRveSmG8MFLJWb9lYxbiw3mlsOc2qXLCk8cmVMYoYCp7LnO/+QCa0O0MJN/vwEm/Ksdodw4XbsmRUo0b/B+RdUQgjgmjEIBZxiEcCEpGEZKQgH/IHgqFwJBqLJ5KpdCabyxeKpXKlWqs3mq12p9vrD4aj8WSqarphWrbjerP5Yrlab7a7/eF4Ol+uLPxaieC9oAcNTMcgwlPZQjHHBshgPDLDInnbQTS/Pc/trgXt89kOAllUlBQIFO+z8pWYel4ajixtDidz5eQk1kTl3DCpgFG0O8N5OTLCpWxNGbem6s5iMUc41508bTMD96r2DBdsS4QybPfFYxdijSGOXJCiOy8hH3nhmndXk1p+dHocAzUc9iQy2ED+NMEcUjjgLiHVU0F5qg4x4QWxthAjTzCP8t1p3CJNR7c7st7Kvd8Pt31VZWrZuZuzRnQkwQ+6KzDieUkc1raWJzqwVuAF1Fvw9JuKKPRRVLhQQWxN5AJ5Hw6nUZ6dt+eMdFpJErEp5eZYy1Gh0nDaDdpqWqWFqh08M4UG+hLrkNNpacbD3/15a6d1vhy7BwA=);
  font-weight: normal;
  font-style: normal;
}
@-webkit-keyframes passing-through {
  0% {
    opacity: 0;
    -webkit-transform: translateY(40px);
    -moz-transform: translateY(40px);
    -ms-transform: translateY(40px);
    -o-transform: translateY(40px);
    transform: translateY(40px);
  }
  30%, 70% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(-40px);
    -moz-transform: translateY(-40px);
    -ms-transform: translateY(-40px);
    -o-transform: translateY(-40px);
    transform: translateY(-40px);
  }
}
@-moz-keyframes passing-through {
  0% {
    opacity: 0;
    -webkit-transform: translateY(40px);
    -moz-transform: translateY(40px);
    -ms-transform: translateY(40px);
    -o-transform: translateY(40px);
    transform: translateY(40px);
  }
  30%, 70% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(-40px);
    -moz-transform: translateY(-40px);
    -ms-transform: translateY(-40px);
    -o-transform: translateY(-40px);
    transform: translateY(-40px);
  }
}
@keyframes passing-through {
  0% {
    opacity: 0;
    -webkit-transform: translateY(40px);
    -moz-transform: translateY(40px);
    -ms-transform: translateY(40px);
    -o-transform: translateY(40px);
    transform: translateY(40px);
  }
  30%, 70% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
  }
  100% {
    opacity: 0;
    -webkit-transform: translateY(-40px);
    -moz-transform: translateY(-40px);
    -ms-transform: translateY(-40px);
    -o-transform: translateY(-40px);
    transform: translateY(-40px);
  }
}
@-webkit-keyframes slide-in {
  0% {
    opacity: 0;
    -webkit-transform: translateY(40px);
    -moz-transform: translateY(40px);
    -ms-transform: translateY(40px);
    -o-transform: translateY(40px);
    transform: translateY(40px);
  }
  30% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
  }
}
@-moz-keyframes slide-in {
  0% {
    opacity: 0;
    -webkit-transform: translateY(40px);
    -moz-transform: translateY(40px);
    -ms-transform: translateY(40px);
    -o-transform: translateY(40px);
    transform: translateY(40px);
  }
  30% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
  }
}
@keyframes slide-in {
  0% {
    opacity: 0;
    -webkit-transform: translateY(40px);
    -moz-transform: translateY(40px);
    -ms-transform: translateY(40px);
    -o-transform: translateY(40px);
    transform: translateY(40px);
  }
  30% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
  }
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  10% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  20% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}
@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  10% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  20% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  10% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  20% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}
.dropzone, .dropzone * {
  box-sizing: border-box;
}

.dropzone {
  min-height: 150px;
  border: 2px solid rgba(0, 0, 0, 0.3);
  background: #fff;
  padding: 20px 20px;
}

.dropzone.dz-clickable {
  cursor: pointer;
}

.dropzone.dz-clickable * {
  cursor: default;
}

.dropzone.dz-clickable .dz-message, .dropzone.dz-clickable .dz-message * {
  cursor: pointer;
}

.dropzone.dz-started .dz-message {
  display: none;
}

.dropzone.dz-drag-hover {
  border-style: solid;
}

.dropzone.dz-drag-hover .dz-message {
  opacity: 0.5;
}

.dropzone .dz-message {
  text-align: center;
  margin: 2em 0;
}

.dropzone .dz-message .dz-button {
  background: none;
  color: inherit;
  border: none;
  padding: 0;
  font: inherit;
  cursor: pointer;
  outline: inherit;
}

.dropzone .dz-preview {
  position: relative;
  display: inline-block;
  vertical-align: top;
  margin: 16px;
  min-height: 100px;
}

.dropzone .dz-preview:hover {
  z-index: 1000;
}

.dropzone .dz-preview:hover .dz-details {
  opacity: 1;
}

.dropzone .dz-preview.dz-file-preview .dz-image {
  border-radius: 20px;
  background: #999;
  background: linear-gradient(to bottom, #eee, #ddd);
}

.dropzone .dz-preview.dz-file-preview .dz-details {
  opacity: 1;
}

.dropzone .dz-preview.dz-image-preview {
  background: #fff;
}

.dropzone .dz-preview.dz-image-preview .dz-details {
  -webkit-transition: opacity 0.2s linear;
  -moz-transition: opacity 0.2s linear;
  -ms-transition: opacity 0.2s linear;
  -o-transition: opacity 0.2s linear;
  transition: opacity 0.2s linear;
}

.dropzone .dz-preview .dz-remove {
  font-size: 14px;
  text-align: center;
  display: block;
  cursor: pointer;
  border: none;
}

.dropzone .dz-preview .dz-remove:hover {
  text-decoration: underline;
}

.dropzone .dz-preview:hover .dz-details {
  opacity: 1;
}

.dropzone .dz-preview .dz-details {
  z-index: 20;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  font-size: 13px;
  min-width: 100%;
  max-width: 100%;
  padding: 2em 1em;
  text-align: center;
  color: rgba(0, 0, 0, 0.9);
  line-height: 150%;
}

.dropzone .dz-preview .dz-details .dz-size {
  margin-bottom: 1em;
  font-size: 16px;
}

.dropzone .dz-preview .dz-details .dz-filename {
  white-space: nowrap;
}

.dropzone .dz-preview .dz-details .dz-filename:hover span {
  border: 1px solid rgba(200, 200, 200, 0.8);
  background-color: rgba(255, 255, 255, 0.8);
}

.dropzone .dz-preview .dz-details .dz-filename:not(:hover) {
  overflow: hidden;
  text-overflow: ellipsis;
}

.dropzone .dz-preview .dz-details .dz-filename:not(:hover) span {
  border: 1px solid transparent;
}

.dropzone .dz-preview .dz-details .dz-filename span, .dropzone .dz-preview .dz-details .dz-size span {
  background-color: rgba(255, 255, 255, 0.4);
  padding: 0 0.4em;
  border-radius: 3px;
}

.dropzone .dz-preview:hover .dz-image img {
  -webkit-transform: scale(1.05, 1.05);
  -moz-transform: scale(1.05, 1.05);
  -ms-transform: scale(1.05, 1.05);
  -o-transform: scale(1.05, 1.05);
  transform: scale(1.05, 1.05);
  -webkit-filter: blur(8px);
  filter: blur(8px);
}

.dropzone .dz-preview .dz-image {
  border-radius: 20px;
  overflow: hidden;
  width: 120px;
  height: 120px;
  position: relative;
  display: block;
  z-index: 10;
}

.dropzone .dz-preview .dz-image img {
  display: block;
}

.dropzone .dz-preview.dz-success .dz-success-mark {
  -webkit-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
  -moz-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
  -ms-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
  -o-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
  animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
}

.dropzone .dz-preview.dz-error .dz-error-mark {
  opacity: 1;
  -webkit-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
  -moz-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
  -ms-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
  -o-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
  animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
}

.dropzone .dz-preview .dz-success-mark, .dropzone .dz-preview .dz-error-mark {
  pointer-events: none;
  opacity: 0;
  z-index: 500;
  position: absolute;
  display: block;
  top: 50%;
  left: 50%;
  margin-left: -27px;
  margin-top: -27px;
}

.dropzone .dz-preview .dz-success-mark svg, .dropzone .dz-preview .dz-error-mark svg {
  display: block;
  width: 54px;
  height: 54px;
}

.dropzone .dz-preview.dz-processing .dz-progress {
  opacity: 1;
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -ms-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear;
}

.dropzone .dz-preview.dz-complete .dz-progress {
  opacity: 0;
  -webkit-transition: opacity 0.4s ease-in;
  -moz-transition: opacity 0.4s ease-in;
  -ms-transition: opacity 0.4s ease-in;
  -o-transition: opacity 0.4s ease-in;
  transition: opacity 0.4s ease-in;
}

.dropzone .dz-preview:not(.dz-processing) .dz-progress {
  -webkit-animation: pulse 6s ease infinite;
  -moz-animation: pulse 6s ease infinite;
  -ms-animation: pulse 6s ease infinite;
  -o-animation: pulse 6s ease infinite;
  animation: pulse 6s ease infinite;
}

.dropzone .dz-preview .dz-progress {
  opacity: 1;
  z-index: 1000;
  pointer-events: none;
  position: absolute;
  height: 16px;
  left: 50%;
  top: 50%;
  margin-top: -8px;
  width: 80px;
  margin-left: -40px;
  background: rgba(255, 255, 255, 0.9);
  -webkit-transform: scale(1);
  border-radius: 8px;
  overflow: hidden;
}

.dropzone .dz-preview .dz-progress .dz-upload {
  background: #333;
  background: linear-gradient(to bottom, #666, #444);
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 0;
  -webkit-transition: width 300ms ease-in-out;
  -moz-transition: width 300ms ease-in-out;
  -ms-transition: width 300ms ease-in-out;
  -o-transition: width 300ms ease-in-out;
  transition: width 300ms ease-in-out;
}

.dropzone .dz-preview.dz-error .dz-error-message {
  display: block;
}

.dropzone .dz-preview.dz-error:hover .dz-error-message {
  opacity: 1;
  pointer-events: auto;
}

.dropzone .dz-preview .dz-error-message {
  pointer-events: none;
  z-index: 1000;
  position: absolute;
  display: block;
  display: none;
  opacity: 0;
  -webkit-transition: opacity 0.3s ease;
  -moz-transition: opacity 0.3s ease;
  -ms-transition: opacity 0.3s ease;
  -o-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
  border-radius: 8px;
  font-size: 13px;
  top: 130px;
  left: -10px;
  width: 140px;
  background: #be2626;
  background: linear-gradient(to bottom, #be2626, #a92222);
  padding: 0.5em 1.2em;
  color: #fff;
}

.dropzone .dz-preview .dz-error-message:after {
  content: "";
  position: absolute;
  top: -6px;
  left: 64px;
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid #be2626;
}

.dropzone {
  border: 1px dashed var(--color-neutral-emphasis, #6e7781);
  border-radius: 6px;
  background: var(--color-canvas-subtle, #f6f8fa);
  max-width: 720px;
  min-height: 120px;
  padding: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.dropzone.dz-drag-hover {
  border-color: var(--color-accent-fg, #0969da);
  background: var(--color-canvas-subtle, #f6f8fa);
}

.dropzone .dz-message {
  text-align: center;
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.dropzone .dz-message .btn-link {
  background: none;
  border: 0;
  padding: 0;
  font: inherit;
  text-decoration: none;
  cursor: pointer;
}
.dropzone .dz-message .btn-link:hover {
  text-decoration: underline;
}

.dropzone .dz-message .dz-icon {
  background-color: var(--color-neutral-muted, rgba(175, 184, 193, 0.2));
  border-radius: 50%;
  padding: 4px;
  height: 32px;
  width: 32px;
  align-content: center;
}

.dropzone .dz-preview {
  display: none;
}

.dropzone-format-info {
  color: var(--color-fg-muted, #57606a);
  font-size: 12px;
  text-align: center;
  margin-top: 8px;
}

.dropzone .dz-error .dz-error-mark svg {
  fill: var(--color-danger-fg);
}

.dropzone .dz-error .dz-error-message {
  color: var(--color-fg-on-emphasis);
  background: var(--color-danger-emphasis);
  border-radius: 6px;
  top: 150px;
}

.DropzoneUpload__inner-button {
  border: 1px solid var(--Blues-Blue-6, #267CDD);
  box-shadow: 0px 1px 0px 0px rgba(27, 31, 35, 0.04);
  background: var(--Blues-Blue-6, #267CDD);
  color: #FFFFFF;
}

.upload-preview {
  width: 740px;
}

.PageLayout-pane {
  background: #09332b;
}
.PageLayout-pane > svg {
  height: 28px;
}

.MainContent-container {
  margin: 24px auto;
  max-width: 1060px;
  padding: 0 24px;
}

@supports (min-height: 100dvh) {
  @media (min-width: 768px) {
    .PageLayout .PageLayout-pane--sticky {
      min-height: 100dvh; /* take full page height */
      overflow: hidden;
    }
  }
}
.Interstitial {
  min-width: 320px;
  max-width: 600px;
  margin: 0 auto;
}

.Interstitial--medium {
  max-width: 916px;
}

.Interstitial--wide {
  margin: var(--base-size-80) var(--base-size-80) !important;
  max-width: none;
}

@media (min-width: 640px) {
  .Interstitial {
    margin: var(--base-size-64) auto;
  }
}
/* stylelint-disable */
.PackagingSetList,
.PackagingComponentFormLayout {
  border-bottom: 1px solid #DDDDDD;
  display: grid;
  grid-column-gap: 20px;
}

.PackagingComponentFormLayout {
  grid-template-columns: 6fr 6fr 5fr 4fr 1fr;
}

.PackagingSetList {
  grid-template-columns: 6fr 7fr 8fr 3fr;
  min-height: 4rem;
}

.PackagingSet-inactive {
  opacity: 0.6;
}

.GreenClaimsRisk_content {
  margin: 32px 64px;
  display: flex;
  flex-direction: column;
  gap: 32px;
  height: 100vh;
}

.GreenClaimsRisk_dashboard {
  flex-grow: 1;
}

/* stylelint-disable */
:root {
  --risk-high-badge: #FF8182;
  --risk-high-dot: #CF222E;
  --risk-high-icon-bg: #FFCECB;
  --risk-medium-badge: #FFB77C;
  --risk-medium-dot: #FB8F44;
  --risk-medium-icon-bg: #FFD8B5;
  --risk-low-badge: #EAC54F;
  --risk-low-dot: #EAC54F;
  --risk-low-icon-bg: #FAE17D;
}

.PageLayout-content:has(.ClaimsChecker) {
  background-color: #F9FAFA;
  height: 100%;
}

.ClaimsChecker {
  background-color: #F9FAFA;
  border-radius: 0.5rem;
}
.ClaimsChecker__layout {
  display: flex;
  justify-content: center;
  gap: 16px;
  height: calc(100vh - 200px);
  min-height: 600px;
}
.ClaimsChecker__contentColumn {
  flex: 1;
  min-width: 420px;
  max-width: 720px;
  display: flex;
  flex-direction: column;
}
.ClaimsChecker__contentColumn, .ClaimsChecker__resultsColumn {
  border-radius: 12px;
  background: var(--bgColor-default, #FFF);
  box-shadow: 0px 3px 6px 0px rgba(66, 74, 83, 0.12);
  overflow: hidden;
}
.ClaimsChecker__resultsColumn {
  max-width: 428px;
  min-width: 380px;
  flex-shrink: 1;
  flex-grow: 1;
  flex-basis: 380px;
  display: flex;
  flex-direction: column;
}
.ClaimsChecker__contentBox, .ClaimsChecker__resultsBox {
  height: 100%;
  display: flex;
  flex-direction: column;
  border: none;
  border-radius: 0;
  box-shadow: none;
}
.ClaimsChecker__contentBox .Box-header, .ClaimsChecker__resultsBox .Box-header {
  background-color: var(--color-canvas-default);
  border-bottom: 1px solid #DDDDDD;
}
.ClaimsChecker__contentBody, .ClaimsChecker__resultsBody {
  flex: 1;
  display: flex;
  flex-direction: column;
}
.ClaimsChecker__contentBody, .ClaimsChecker__resultsBody {
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--bgColor-neutral-emphasis, #6E7781) var(--bgColor-neutral-muted, rgba(175, 184, 193, 0.2));
}
.ClaimsChecker__contentBody::-webkit-scrollbar, .ClaimsChecker__resultsBody::-webkit-scrollbar {
  width: 6px;
}
.ClaimsChecker__contentBody::-webkit-scrollbar-track, .ClaimsChecker__resultsBody::-webkit-scrollbar-track {
  background: var(--bgColor-neutral-muted, rgba(175, 184, 193, 0.2));
  padding: 4px 0;
}
.ClaimsChecker__contentBody::-webkit-scrollbar-thumb, .ClaimsChecker__resultsBody::-webkit-scrollbar-thumb {
  border-radius: 12px;
  opacity: 0.4;
  background: var(--bgColor-neutral-emphasis, #6E7781);
}
.ClaimsChecker__contentBody::-webkit-scrollbar-thumb:hover, .ClaimsChecker__resultsBody::-webkit-scrollbar-thumb:hover {
  opacity: 0.6;
}
.ClaimsChecker__contentBody {
  padding: 24px;
}
.ClaimsChecker__form {
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.ClaimsChecker__textarea {
  flex: 1;
  resize: none;
  min-height: 300px;
  height: auto;
  border: none;
  outline: none;
  padding: 0;
  margin: 0;
}
.ClaimsChecker__textarea:focus {
  outline: none;
  border: none;
}
.ClaimsChecker__textarea:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  background-color: var(--color-canvas-subtle);
}
.ClaimsChecker .form-actions {
  flex-shrink: 0;
}
.ClaimsChecker__resultsContent {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  min-height: 350px;
}
.ClaimsChecker__defaultState, .ClaimsChecker__loadingState, .ClaimsChecker__errorState {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 40px 24px;
}
.ClaimsChecker__defaultState {
  text-align: center;
}
.ClaimsChecker__emptyIllustration {
  display: flex;
  justify-content: center;
  align-items: center;
}
.ClaimsChecker__emptyImage {
  width: 114px;
  height: 77px;
  max-width: 100%;
  height: auto;
}
.ClaimsChecker__emptyContent {
  max-width: 320px;
  color: var(--fgColor-muted, #636C76);
  text-align: center;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 1.5; /* 24px */
}
.ClaimsChecker__emptyTitle {
  text-align: center;
}
.ClaimsChecker__emptyFeatures {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.ClaimsChecker__emptyFeature {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 14px;
  color: var(--fgColor-muted);
  text-align: left;
}
.ClaimsChecker__featureIcon {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
}
.ClaimsChecker__loadingState {
  text-align: center;
  padding: 40px 24px;
}
.ClaimsChecker__loadingAnimation {
  width: 120px;
  height: 120px;
  margin: 0 auto 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ClaimsChecker__loadingAnimation img {
  animation: loading-pulse 2s ease-in-out infinite;
}
@keyframes loading-pulse {
  0%, 100% {
    opacity: 1;
    transform: scale(1);
  }
  50% {
    opacity: 0.7;
    transform: scale(1.05);
  }
}
.ClaimsChecker__loadingTitle {
  font-size: 18px;
  font-weight: 600;
  line-height: 1.25;
  margin: 0 0 8px 0;
  color: var(--fgColor-default, #1F2328);
}
.ClaimsChecker__loadingDescription {
  font-size: 14px;
  line-height: 1.4;
  margin: 0;
  color: var(--fgColor-muted, #636C76);
}
.ClaimsChecker__resultsDisplay {
  flex: 1;
  width: 100%;
}
.ClaimsChecker__resultsPre {
  white-space: pre-wrap;
  font-size: 12px;
}
.ClaimsChecker__errorContainer {
  height: 100%;
  min-height: 300px;
}
.ClaimsChecker .anim-rotate {
  animation: ClaimsCheckerRotate 1s linear infinite;
}
@keyframes ClaimsCheckerRotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.ClaimsChecker__disclaimer {
  color: var(--fgColor-muted, #636C76);
  text-align: center;
  /* Hint UI Regular */
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 125%; /* 15px */
  margin-top: 16px;
  margin-bottom: 32px;
}
.ClaimsChecker__claimsList {
  flex: 1;
  padding: 0;
}
.ClaimsChecker__claimItem {
  border-bottom: 1px solid var(--borderColor-default, #D9DADD);
  padding: 16px 0;
}
.ClaimsChecker__claimItem:first-child {
  padding-top: 0;
}
.ClaimsChecker__claimItem:last-child {
  border-bottom: none;
  padding-bottom: 0;
}
.ClaimsChecker__claimItem--collapsed .ClaimsChecker__claimTitle,
.ClaimsChecker__claimItem--collapsed .ClaimsChecker__claimHeader {
  margin-bottom: 0;
}
.ClaimsChecker__claimItem--collapsed .ClaimsChecker__claimDetails {
  display: none;
}
.ClaimsChecker__claimHeader {
  margin-bottom: 16px;
  cursor: pointer;
}
.ClaimsChecker__claimHeader:hover {
  opacity: 0.8;
}
.ClaimsChecker__claimDetails {
  transition: all 0.2s ease;
}
.ClaimsChecker__claimTitle {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
  margin-bottom: 12px;
  color: var(--fgColor-default, #1F2328);
}
.ClaimsChecker__claimTitle::before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-right: 8px;
  vertical-align: middle;
}
.ClaimsChecker__detailHeader strong {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  font-weight: 700;
  line-height: 125%;
}
.ClaimsChecker__detailHeaderIcon {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background-color: var(--bgColor-neutral-muted, #AFB8C1);
  display: flex;
  align-items: center;
  justify-content: center;
}
.ClaimsChecker__riskLabel {
  color: var(--fgColor-default, #1F2328);
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 125%;
}
.ClaimsChecker__riskBadge {
  height: 24px;
  padding: 4px 8px;
  align-items: flex-start;
  border-radius: 4px;
  color: var(--fgColor-default);
  font-size: 12px;
  font-weight: 400;
  line-height: 125%;
  text-transform: capitalize;
  white-space: nowrap;
}
.ClaimsChecker__riskBadge--high {
  background-color: var(--risk-high-badge);
}
.ClaimsChecker__riskBadge--medium {
  background-color: var(--risk-medium-badge);
}
.ClaimsChecker__riskBadge--low {
  background-color: var(--risk-low-badge);
}
.ClaimsChecker__claimDetails {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.ClaimsChecker__detailHeader {
  display: flex;
  align-items: center;
  gap: 6px;
}
.ClaimsChecker__detailHeader svg {
  color: var(--fgColor-muted, #636C76);
  flex-shrink: 0;
}
.ClaimsChecker__detailText {
  font-size: 14px;
  line-height: 1.25;
  font-weight: 400;
  color: var(--fgColor-default, #1F2328);
  margin: 0;
  margin-left: 34px;
}
.ClaimsChecker__recommendedAction {
  font-weight: 400;
}
.ClaimsChecker__recommendation {
  display: none;
}
.ClaimsChecker__recommendation .ClaimsChecker__recommendationIcon {
  color: var(--fgColor-danger, #CF222E);
}
.ClaimsChecker .ClaimsChecker__claimItem .ClaimsChecker__claimTitle::before {
  background-color: var(--fgColor-muted, #636C76);
}
.ClaimsChecker .ClaimsChecker__claimItem:has(.ClaimsChecker__riskBadge--high) .ClaimsChecker__claimTitle::before {
  background-color: var(--risk-high-dot);
}
.ClaimsChecker .ClaimsChecker__claimItem:has(.ClaimsChecker__riskBadge--medium) .ClaimsChecker__claimTitle::before {
  background-color: var(--risk-medium-dot);
}
.ClaimsChecker .ClaimsChecker__claimItem:has(.ClaimsChecker__riskBadge--low) .ClaimsChecker__claimTitle::before {
  background-color: var(--risk-low-dot);
}
.ClaimsChecker .ClaimsChecker__claimItem:has(.ClaimsChecker__riskBadge--high) .ClaimsChecker__recommendation .ClaimsChecker__detailHeaderIcon {
  background-color: var(--risk-high-icon-bg);
}
.ClaimsChecker .ClaimsChecker__claimItem:has(.ClaimsChecker__riskBadge--medium) .ClaimsChecker__recommendation .ClaimsChecker__detailHeaderIcon {
  background-color: var(--risk-medium-icon-bg);
}
.ClaimsChecker .ClaimsChecker__claimItem:has(.ClaimsChecker__riskBadge--low) .ClaimsChecker__recommendation .ClaimsChecker__detailHeaderIcon {
  background-color: var(--risk-low-icon-bg);
}
.ClaimsChecker__noClaimsState {
  flex: 1;
  padding: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ClaimsChecker__complianceContainer {
  border-radius: var(--borderRadius-large, 12px);
  background: #DAFBE1;
  padding: 24px;
  text-align: center;
  max-width: 400px;
  width: 100%;
}
.ClaimsChecker__complianceHeader {
  margin-bottom: 16px;
}
.ClaimsChecker__complianceIcon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  background: var(--bgColor-success-emphasis, #1A7F37);
  border-radius: 50%;
  margin: 0 auto 16px;
  color: white;
}
.ClaimsChecker__complianceIcon svg {
  width: 24px;
  height: 24px;
}
.ClaimsChecker__complianceTitle {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.25;
  margin: 0 0 8px 0;
  color: var(--fgColor-default, #1F2328);
}
.ClaimsChecker__complianceDescription {
  font-size: 14px;
  line-height: 1.4;
  margin: 0;
  color: var(--fgColor-default, #1F2328);
}
.ClaimsChecker__complianceFeatures {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 16px;
}
.ClaimsChecker__complianceFeature {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: var(--fgColor-default, #1F2328);
  text-align: left;
}
.ClaimsChecker__featureIcon {
  color: var(--fgColor-success, #1A7F37);
  flex-shrink: 0;
}
.ClaimsChecker__complianceNote {
  font-size: 12px;
  line-height: 1.4;
  color: var(--fgColor-muted, #636C76);
  text-align: center;
}
.ClaimsChecker__complianceNote strong {
  font-weight: 600;
}

/* stylelint-disable */
.bg-grey05 {
  background-color: #f4f4f4;
}

.bg-grey10 {
  background-color: #F9FAFA;
}

.bg-grey20 {
  background-color: #F4F4F4;
}

.bg-grey40 {
  background-color: #DDDDDD;
}

.bg-grey50 {
  background-color: #CCCCCC;
}

.bg-grey2 {
  background-color: #D0D7DE;
}

.bg-grey3 {
  background-color: #AFB8C1;
}

.bg-green40 {
  background-color: #94C5B6;
}

.bg-green1 {
  background-color: #ACEEBB;
}

.bg-purple1 {
  background-color: var(--color-scale-purple-1);
}

.bg-red40 {
  background-color: #ffc8ca;
}

.bg-red2 {
  background-color: #FFABA8;
}

.bg-orange1 {
  background-color: #FFD8B5;
}

.bg-yellow1 {
  background-color: #FAE17D;
}

.bg-yellow60 {
  background-color: #F1C900;
}

.bg-yellow50 {
  background-color: #FFDB25;
}

.bg-blue1 {
  background-color: #B6E3FF;
}

.bg-blue20 {
  background-color: #ECF3FC;
}

.bg-blue40 {
  background-color: #BEDCFF;
}

.bg-white {
  background-color: #fff;
}

.bg-warning50 {
  background-color: #FFD584;
}

.bg-upsell {
  background: #E1D4FD !important; /* NOTE: This is defined as background, not background-color, in order to override Primer's background-image property. */
  --borderColor-accent-muted: transparent;
}

/* stylelint-disable */
.theme-climate {
  background-color: #c3ebe5;
}

.theme-waste {
  background-color: #d1dbeb;
}

.theme-nature {
  background-color: #e4f4c9;
}

.theme-workers {
  background-color: #ffb7b2;
}

.theme-communities {
  background-color: #ffdfc9;
}

.theme-climate-light {
  background-color: #f5fffd;
}

.theme-waste-light {
  background-color: #f1f5fa;
}

.theme-nature-light {
  background-color: #f9fcf2;
}

.theme-workers-light {
  background-color: #fff8f7;
}

.theme-communities-light {
  background-color: #fff9f5;
}