{"version":3,"sources":["LiveTemplateOptions.css","LiveTemplateOptions.scss","_helpers/_respond-to.scss","core/_Property.scss","core/_config.scss","_helpers/_visually-hidden.scss","_helpers/_clearfix.scss","core/_PropertyEditor.scss","core/_PropertyGroup.scss","theme/standard/_themeConfig.scss","theme/standard/_Property.scss","theme/standard/_PropertyEditor.scss","theme/standard/_PropertyGroup.scss"],"names":[],"mappings":"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IAYI,sBDqPoB;ICnPpB,yBD6LgB;IC5LhB,wCDgcqC;IC/brC,mBDmWgB;IClWhB,kBDmWe;IClWf,qBDmWkB,EAAA;;AC9VpB;EACE,oED4XgC,EAAA;;ACzXlC;EACE,oEDwXgC,EAAA;;ACnXpC;EAEI,cDwcmC,EAAA;;AC1cvC;EAMI,oDAnJ4G;EAoJ5G,yBAnJ+F,EAAA;;AAwJnG;EACE,gCAxJ2F,EAAA;;AA2J7F;EACE,gCAAiE,EAAA;;AAGnE;+EVyvB+E;AUnvB/E;+EVqvB+E;AU7uB/E;EACE,6BDgVkC,EAAA;;AC7UpC;EACE,2BAA2B;EAC3B,wCAAwC,EAAA;EAF1C;IAKI,gCDmYqC,EAAA;;AC9XzC;;8EV2uB8E;AUxuB9E;EACE,yBDsHkB,EAAA;;ACnHpB;;8EV0uB8E;AUvuB9E;;EAaE;+EV8tB6E,EU7tBC;EAdhF;;IAIM,yBD4Gc;IC3Gd,qBDiHc,EAAA;ECtHpB;;IASM,cDwGc,EAAA;ECjHpB;;;;IAiBI,qBDqJoB;ICpJpB,wCA/MsF,EAAA;EA6L1F;;;;IAuBI,qBD+IoB;IC9IpB,yBD8IoB,EAAA;;ACzIxB;;8EVquB8E;AUluB9E;EAKM,qBD0Fe;ECzFf,yBDyFe,EAAA;;AC/FrB;EAYM,yBDqEc,EAAA;;AC1DpB;;8EVqtB8E;AUltB9E;EAGM,mCDuEe;ECtEf,uCDsEe,EAAA;;AC/DrB;;8EV8sB8E;AU3sB9E;EAGI,YAAA;EAMA,YAAA,EAAa;EATjB;IAKM,yBDyCc;ICxCd,mFAlQ2H,EAAA;EA4PjI;IAWM,qDArQmG;IAsQnG,yBDkCc;ICjCd,sFD+RmC,EAAA;EC5SzC;IAiBM,6ED2RmC,EAAA;EC5SzC;IAqBM,sFDuRmC;ICtRnC,yBDuBc,EAAA;;ACjBpB;EACE,8CAlR8F,EAAA;;AAqRhG;EAEI,yBD4DoB,EAAA;;AAuHxB;;+ET+gB+E;AS3gB/E;;ET8gBE;ASzgBF;;;;;;;;ETkhBE;ASnbF;;;;;;;;ET4bE;ASvaF;;;;;;;;ETgbE;ASzXF;;;;;ET+XE;AWtgCF;;+EXygC+E;AWrgC/E;EACE,yBFsSkB,EAAA;;AEnSpB;EACE,6BAA6B,EAAA;;AAG/B;+EXqgC+E;AWngC/E;;;EAGE,qBF0RkB,EAAA;;AEvRpB;EAEE,yBFkRkB,EAAA;EEpRpB;IAMI,0CFwUc,EAAA;;AEpUlB;EACE,cFwQkB;EEvQlB,yBFkRmB,EAAA;;AE/QrB;EACE,cFsRmB,EAAA;;AEnRrB;EAEI,qBFkQgB,EAAA;;AE9PpB;EAGI,iCF+bgC,EAAA;EElcpC;IAMM,yBFySkB,EAAA;;AEpSxB;EACE,4BFiQmB,EAAA;;AE9PrB;EACE,4BF6PmB,EAAA;;AE1PrB;+EXk/B+E;AWh/B/E;EAEI,cFsPiB,EAAA;;AExPrB;EASM,cFiRkB,EAAA;;AE1RxB;EAiBM,cF+Sa;EE9Sb,iCAA4D;EAC5D,gBAAgB,EAAA;;AAnBtB;EAuBM,cF6Mc;EE5Md,oCAAgE;EAChE,gBAAgB,EAAA;EAzBtB;IA8BQ,cFsMY;IErMZ,oCAAmE;IACnE,mCAzG8D,EAAA;;AAyEtE;EAuCM,yBF8Lc;EE7Ld,wCFgcmC,EAAA;;AExezC;EA4CM,cF8OkB,EAAA;;AEzOxB;EACE,yBFmUiB;EElUjB,gDF0XkC,EAAA;;AEvXpC;+EX29B+E;AWz9B/E;EACE,4BF+LmB,EAAA;;AAyJrB;;+ETsoB+E;ASloB/E;;ETqoBE;AShoBF;;;;;;;;ETyoBE;AS1iBF;;;;;;;;ETmjBE;AS9hBF;;;;;;;;ETuiBE;AShfF;;;;;ETsfE;AY5pCF;;8EZ+pC8E;AY5pC9E;EACE,yBH0UmB,EAAA","file":"LiveTemplateOptions.css","sourcesContent":["@charset \"UTF-8\";\n/******************************************************************************\n\nFile Name:    LiveTemplateOptions\nPurpose:      Loads the necessary styles for the Live Template Options dialog\n              which is loaded during runtime\n\n******************************************************************************/\n/*\n$display-xxxs: 640px;\n$display-xxs: 800px;\n$display-xs: 1024px;\n$display-small: 1280px;\n$display-medium: 1680px;\n$display-large: 1920px;\n*/\n/* ==========================================================================\n   Property (Property Editor Properties)\n   ========================================================================== */\n/**\n * Property Component\n *\n * This is a property that is used within the context of a property editor to\n * provide a label and input field.\n *\n * Example HTML:\n *\n * <div class=\"a-Property\">\n *   <div class=\"a-Property-labelContainer\">\n *     <label class=\"a-Property-label\">Label</label>\n *   </div>\n *   <div class=\"a-Property-fieldContainer\">\n *     <input type=\"text\" class=\"a-Property-field\">\n *   </div>\n * </div>\n */\n.a-Property {\n  position: relative;\n  display: table;\n  margin: 0;\n  padding: 0;\n  width: 100%;\n  table-layout: auto; }\n\n.a-Property .a-Icon.icon-required {\n  display: none; }\n\n.a-Property-buttonContainer,\n.a-Property-labelContainer,\n.a-Property-unitContainer {\n  display: table-cell;\n  vertical-align: middle; }\n\n.a-Property-buttonContainer,\n.a-Property-labelContainer,\n.a-Property-fieldContainer,\n.a-Property-unitContainer {\n  padding: 4px 8px; }\n  @media only screen and (max-width: 1024px) {\n    .a-Property-buttonContainer,\n    .a-Property-labelContainer,\n    .a-Property-fieldContainer,\n    .a-Property-unitContainer {\n      padding: 2px 8px; } }\n\n.a-Property-labelContainer {\n  padding-right: 0;\n  min-width: 112px; }\n\n#templateOptionsDlgPE .a-Property-labelContainer {\n  min-width: 144px; }\n\n.a-PropertyEditor--stacked .a-Property:not(.a-Property--stacked) .a-Property-labelContainer {\n  display: table-row;\n  width: 100%; }\n\n.a-Property-fieldContainer {\n  display: table-cell;\n  width: 100%;\n  vertical-align: middle; }\n\n.a-Property-fieldContainer--comboBox {\n  padding-right: 0 !important; }\n\n.a-Property-buttonContainer--comboBox .a-Button {\n  margin-left: -1px; }\n\n.a-Property-colorPreview {\n  display: block;\n  width: 12px;\n  height: 12px;\n  border-radius: 100%; }\n\n.a-Property-fieldContainer--colorPicker .a-Property-field {\n  padding-left: calc(var(--a-icon-size, 16px) + var(--a-icon-padding, 4px) + var(--a-icon-padding, 4px));\n  border-top-right-radius: 0 !important;\n  border-bottom-right-radius: 0 !important; }\n\n.a-Property-fieldContainer--colorPicker .a-Button {\n  --a-button-padding-y: 4px;\n  --a-button-padding-x: 8px; }\n\n.a-Property-buttonContainer--colorPicker .a-Button {\n  margin-left: -1px; }\n\n.a-Property-unitContainer {\n  padding-left: 0 !important;\n  white-space: nowrap; }\n\n/******************************************************************************\nProperty Error\n******************************************************************************/\n.a-Property.is-error .icon-error {\n  margin-right: 4px; }\n\n/******************************************************************************\nProperty Warning\n******************************************************************************/\n.a-Property.is-warning .icon-warning {\n  margin-right: 4px; }\n\n/******************************************************************************\nLabel and Pre / Post Text\n******************************************************************************/\n.a-Property-label,\n.a-Property-setItemsHeader-header,\n.a-Property-unit {\n  padding: 4px 0;\n  font-size: 12px;\n  line-height: 16px; }\n\n.a-Property-checkbox-label,\n.a-Property-radio {\n  font-size: 12px;\n  line-height: 16px; }\n\n.a-Property-unit {\n  font-size: 11px; }\n\n.a-Property-label--withIcon {\n  padding: 4px 0;\n  line-height: 16px; }\n\n/******************************************************************************\nProperty Field - Used for property editor\n******************************************************************************/\n.a-Property-field {\n  padding: 4px;\n  min-height: 24px;\n  font-size: 12px;\n  line-height: 16px;\n  border-radius: 2px; }\n  .a-Property-field:focus {\n    outline: none; }\n\n.a-Property.is-variable .a-Icon.icon-variable {\n  margin-right: 4px; }\n\n.a-Property.is-variable .a-Property-field {\n  border-radius: 2px; }\n\n/* Property Editor Select List\n   ========================================================================== */\n.a-Property-field--select {\n  overflow: hidden;\n  padding-right: 30px;\n  text-indent: 0.01px;\n  text-overflow: ' ';\n  background-position: 100% 0;\n  background-size: 32px 24px;\n  background-repeat: no-repeat;\n  appearance: none; }\n\nbody:not(:-moz-handler-blocked) .a-Property-field--select {\n  padding: 2px 24px 2px 2px; }\n\n/* Text Area\n   ========================================================================== */\n.a-Property-field--textarea,\nbody .ui-widget .a-Property-field--textarea {\n  padding: 4px;\n  max-height: 320px;\n  height: auto;\n  font-size: 11px;\n  font-family: SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n  line-height: 14px; }\n\n.a-Property-readOnly {\n  font-weight: bold;\n  font-size: 12px;\n  line-height: 2; }\n\n.a-Property-setItemsTable-header {\n  font-weight: normal; }\n\n.a-Property-setItemsTable .a-Property-field {\n  border-top-right-radius: 0;\n  border-bottom-right-radius: 0; }\n\n/******************************************************************************\nCombo Box Styles\n******************************************************************************/\n.a-Property-buttonContainer--comboBox .a-Button {\n  margin-left: 8px; }\n\n/******************************************************************************\nCheckbox + Radio Buttons\n******************************************************************************/\n.a-Property-checkbox-input[type=\"checkbox\"],\n.a-Property-radio-input[type=\"radio\"] {\n  position: absolute;\n  overflow: hidden;\n  clip: rect(0 0 0 0);\n  margin: -1px;\n  padding: 0;\n  width: 1px;\n  height: 1px;\n  border: 0;\n  /* Disabled State\n   ========================================================================== */\n  /* Focus\n   ========================================================================== */ }\n  .a-Property-checkbox-input[type=\"checkbox\"] + label,\n  .a-Property-radio-input[type=\"radio\"] + label {\n    position: relative;\n    padding-right: 8px;\n    padding-left: 20px;\n    cursor: pointer; }\n    .u-RTL .a-Property-checkbox-input[type=\"checkbox\"] + label, .u-RTL\n    .a-Property-radio-input[type=\"radio\"] + label {\n      padding-left: 8px;\n      padding-right: 20px; }\n    .a-Property-checkbox-input[type=\"checkbox\"] + label:before, .a-Property-checkbox-input[type=\"checkbox\"] + label:after,\n    .a-Property-radio-input[type=\"radio\"] + label:before,\n    .a-Property-radio-input[type=\"radio\"] + label:after {\n      position: absolute;\n      top: 3px;\n      left: 0;\n      display: block;\n      width: 14px;\n      height: 14px;\n      content: '';\n      transition: .125s opacity ease; }\n      .u-RTL .a-Property-checkbox-input[type=\"checkbox\"] + label:before, .u-RTL .a-Property-checkbox-input[type=\"checkbox\"] + label:after, .u-RTL\n      .a-Property-radio-input[type=\"radio\"] + label:before, .u-RTL\n      .a-Property-radio-input[type=\"radio\"] + label:after {\n        left: auto;\n        right: 0; }\n    .a-Property-checkbox-input[type=\"checkbox\"] + label:before,\n    .a-Property-radio-input[type=\"radio\"] + label:before {\n      z-index: 90;\n      border: 1px solid; }\n    .a-Property-checkbox-input[type=\"checkbox\"] + label:after,\n    .a-Property-radio-input[type=\"radio\"] + label:after {\n      z-index: 100;\n      opacity: 0; }\n  .a-Property-checkbox-input[type=\"checkbox\"]:disabled + label,\n  .a-Property-radio-input[type=\"radio\"]:disabled + label {\n    opacity: .5;\n    cursor: default;\n    pointer-events: none; }\n    .a-Property-checkbox-input[type=\"checkbox\"]:disabled + label:before,\n    .a-Property-radio-input[type=\"radio\"]:disabled + label:before {\n      opacity: .5; }\n  .a-Property-checkbox-input[type=\"checkbox\"]:hover:checked + label:after,\n  .a-Property-checkbox-input[type=\"checkbox\"]:focus:checked + label:after,\n  .a-Property-radio-input[type=\"radio\"]:hover:checked + label:after,\n  .a-Property-radio-input[type=\"radio\"]:focus:checked + label:after {\n    opacity: 1; }\n\n/******************************************************************************\nCheckbox Specific\n******************************************************************************/\n.a-Property-checkbox-input[type=\"checkbox\"] {\n  /* Unchecked\n   ========================================================================== */\n  /* Checked\n   ========================================================================== */ }\n  .a-Property-checkbox-input[type=\"checkbox\"] + label:before {\n    border-radius: 2px; }\n  .a-Property-checkbox-input[type=\"checkbox\"] + label:after {\n    background-position: 50%;\n    background-size: 16px;\n    background-repeat: no-repeat;\n    text-transform: none;\n    font-weight: normal;\n    font-style: normal;\n    font-variant: normal;\n    font-family: \"apex-5-icon-font\";\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n    speak: none;\n    content: var(--a-checkbox-icon-character, \"\");\n    text-align: center;\n    line-height: 14px;\n    font-size: 10px; }\n  .a-Property-checkbox-input[type=\"checkbox\"]:indeterminate + label:after {\n    opacity: 1;\n    background-image: none;\n    width: 8px;\n    height: 2px;\n    border-radius: 2px;\n    margin: 6px 3px;\n    transform: scale(0.75); }\n  .a-Property-checkbox-input[type=\"checkbox\"]:checked + label:after,\n  .a-Property-checkbox-input[type=\"checkbox\"]:checked + label:before {\n    opacity: 1; }\n\n/******************************************************************************\nRadio Specific\n******************************************************************************/\n.a-Property-radio-input[type=\"radio\"] {\n  /* Unchecked\n   ========================================================================== */\n  /* Checked\n   ========================================================================== */ }\n  .a-Property-radio-input[type=\"radio\"] + label:before {\n    border-radius: 16px; }\n  .a-Property-radio-input[type=\"radio\"] + label:after {\n    margin: 5px;\n    width: 4px;\n    height: 4px;\n    border-radius: 100%; }\n  .a-Property-radio-input[type=\"radio\"]:checked + label:after {\n    opacity: 1; }\n\n/******************************************************************************\nYes / No Buttons\n******************************************************************************/\n.a-PropertyEditor--stacked .a-Property-radioGroup--buttonSet {\n  padding: 0 4px; }\n\n.a-Property-radioGroup--buttonSet .a-Property-radio {\n  margin-right: -1px; }\n\n.a-Property-radioGroup--buttonSet .a-Property-radio-input {\n  /* Unchecked */\n  /* Checked */\n  /* Focused */ }\n  .a-Property-radioGroup--buttonSet .a-Property-radio-input + label {\n    padding: 2px 8px;\n    transition: background-color .15s ease; }\n    .a-Property-radioGroup--buttonSet .a-Property-radio-input + label:before, .a-Property-radioGroup--buttonSet .a-Property-radio-input + label:after {\n      content: initial; }\n  .a-Property-radioGroup--buttonSet .a-Property-radio-input:checked + label {\n    font-weight: bold; }\n  .a-Property-radioGroup--buttonSet .a-Property-radio-input:focus + label {\n    z-index: 1;\n    outline: none;\n    border-radius: 2px; }\n\n/******************************************************************************\nRadio\n******************************************************************************/\n.a-Property-radioGroup:focus {\n  outline: none; }\n\n.a-Property-radio {\n  display: inline-block; }\n\n.a-Property-radio-input {\n  display: inline-block;\n  margin: 2px;\n  width: 16px;\n  height: 16px;\n  vertical-align: top; }\n\n.a-Property-radio-label {\n  display: inline-block;\n  padding: 2px;\n  vertical-align: top;\n  font-size: 12px; }\n\n.a-Property-fieldContainer--radioGroup {\n  padding-top: 6px;\n  padding-bottom: 6px; }\n\n/******************************************************************************\nYes / No Radios\n******************************************************************************/\n.a-Property-radioGroup--buttonSet:before, .a-Property-radioGroup--buttonSet:after {\n  display: table;\n  content: ''; }\n\n.a-Property-radioGroup--buttonSet:after {\n  clear: both; }\n\n.a-Property-radioGroup--buttonSet .a-Property-radio {\n  float: left; }\n\n.a-Property-radioGroup--buttonSet .a-Property-radio-input {\n  position: absolute;\n  overflow: hidden;\n  clip: rect(0 0 0 0);\n  margin: -1px;\n  padding: 0;\n  width: 1px;\n  height: 1px;\n  border: 0; }\n  .a-Property-radioGroup--buttonSet .a-Property-radio-input:disabled + label {\n    opacity: .5; }\n\n.a-Property-radioGroup--buttonSet .a-Property-radio-input + label {\n  min-width: 48px;\n  text-align: center;\n  line-height: 20px;\n  border-radius: 2px; }\n  .a-Property-radioGroup--buttonSet .a-Property-radio-input + label .a-Icon {\n    margin: 2px; }\n\n/******************************************************************************\nStacked Properties\n******************************************************************************/\n.a-Property--stacked {\n  position: relative; }\n  .a-Property--stacked .a-Property-labelContainer,\n  .a-Property--stacked .a-Property-fieldContainer {\n    display: block; }\n  .a-Property--stacked .a-Property-labelContainer {\n    margin-right: 64px;\n    padding-bottom: 0; }\n  .a-Property--stacked .a-Property-fieldContainer {\n    padding-top: 0; }\n  .a-Property--stacked .a-Property-buttonContainer {\n    position: absolute;\n    top: 0;\n    right: 0; }\n    .a-Property--stacked .a-Property-buttonContainer + .a-Property-fieldContainer {\n      padding-top: 4px; }\n    .a-Property--stacked .a-Property-buttonContainer .a-Button--quickPick {\n      margin-left: 8px; }\n\n.a-Property--scrollable {\n  display: block;\n  overflow: auto; }\n\n.a-Property-labelContainer--withButtons {\n  display: table-cell;\n  table-layout: auto;\n  padding-bottom: 8px; }\n\n.a-Property-labelContainer--hiddenLabel {\n  padding: 0; }\n\n.a-Property-buttonContainer {\n  padding-left: 0 !important; }\n\n.a-Property-buttonContainer--pullRight {\n  float: right; }\n\n.a-Property.is-changed .a-Property-labelContainer:before {\n  position: absolute;\n  top: 1px;\n  bottom: 0;\n  left: 1px;\n  display: inline-block;\n  width: 3px;\n  content: '';\n  opacity: .5; }\n\n.a-Property.is-changed:hover .a-Property-labelContainer:before, .a-Property.is-changed.is-focused .a-Property-labelContainer:before {\n  opacity: 1; }\n\n.a-Property-label,\n.a-Property-unit {\n  display: block;\n  -ms-text-overflow: ellipsis;\n  text-overflow: ellipsis;\n  overflow: hidden; }\n\n.a-Property-field {\n  display: block;\n  width: 100%;\n  background-clip: border-box;\n  border: 0 solid; }\n\n.a-Property-field--textarea {\n  min-height: 48px;\n  font-family: SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n  resize: vertical; }\n\n/******************************************************************************\nHide/Show Classes\n******************************************************************************/\n.a-Property.js-showAll,\n.a-PropertyEditor-propertyGroup.js-showAll {\n  display: none; }\n\n.a-PropertyEditor.js-showAll .a-Property.js-showAll,\n.a-PropertyEditor.js-showAll .a-PropertyEditor-propertyGroup.js-showAll {\n  display: block; }\n\n.a-PropertyEditor--stacked.js-showAll .a-Property.js-showAll {\n  display: table; }\n\n/******************************************************************************\nVariable Field\n******************************************************************************/\n/******************************************************************************\nCheckbox\n******************************************************************************/\n.a-Property-checkboxGroup:focus {\n  outline: none; }\n\n.a-Property-checkbox-input {\n  display: inline-block;\n  margin: 2px;\n  width: 16px;\n  height: 16px;\n  vertical-align: top; }\n\n.a-Property-checkbox-label {\n  display: inline-block;\n  padding: 2px;\n  vertical-align: top;\n  font-size: 12px; }\n\n/******************************************************************************\nSet Items Table\n******************************************************************************/\n.a-Property-setItemsTable {\n  width: 100%;\n  border-spacing: 0;\n  border-collapse: collapse; }\n  .a-Property-setItemsTable td {\n    padding-bottom: 4px; }\n  .a-Property-setItemsTable tr:last-child td {\n    padding-bottom: 0; }\n\n.a-Property-setItemsHeader-header {\n  text-align: left; }\n\n.a-Property-setItemsTable-removeCol {\n  width: 40px; }\n\n/******************************************************************************\nProperty Editor in Dialogs\n******************************************************************************/\n/******************************************************************************\nProperty Editor Buttons\n******************************************************************************/\n.a-Property-button {\n  --a-button-padding-y: 6px;\n  width: 100%;\n  white-space: normal; }\n\n/******************************************************************************\nStacked Styles\n******************************************************************************/\n.a-PropertyEditor--stacked .a-Property-labelContainer .a-Property-label {\n  padding-right: 12px;\n  padding-bottom: 2px;\n  padding-left: 12px;\n  font-size: 11px; }\n\n.a-PropertyEditor--stacked .a-Property-fieldContainer,\n.a-PropertyEditor--stacked .a-Property-buttonContainer {\n  padding-top: 0;\n  padding-bottom: 8px; }\n\n.a-PropertyEditor--stacked .a-Property--stacked .a-Property-buttonContainer {\n  padding-top: 4px;\n  padding-bottom: 4px; }\n\n.a-PropertyEditor--stacked .a-Property--stacked .a-Property-labelContainer .a-Property-label {\n  padding: 4px 0; }\n\n/* ==========================================================================\n   High Contrast Mode\n   ========================================================================== */\n.u-HCM .a-Property-field {\n  border: 1px solid !important; }\n\n/*\n$display-xxxs: 640px;\n$display-xxs: 800px;\n$display-xs: 1024px;\n$display-small: 1280px;\n$display-medium: 1680px;\n$display-large: 1920px;\n*/\n/* ==========================================================================\n   Property Editor\n   ========================================================================== */\n.a-PropertyEditor-wrapper .a-PropertyEditor-propertyGroup:first-child {\n  margin-top: 8px; }\n\n.ui-dialog .a-PropertyEditor {\n  overflow: auto;\n  max-height: 400px; }\n\n/* Property Editor Groups\n   ========================================================================== */\n.a-PropertyEditor-propertyGroup {\n  display: block;\n  background-clip: padding-box;\n  transition: background-color 0.1s ease, box-shadow 0.1s ease; }\n  .a-PropertyEditor-propertyGroup.is-collapsed .a-PropertyEditor-propertyGroup-header {\n    border-bottom: none; }\n  .a-PropertyEditor-propertyGroup.is-collapsed .a-PropertyEditor-propertyGroup-body {\n    display: none; }\n\n.a-PropertyEditor .a-PropertyEditor-propertyGroup:first-child {\n  margin-top: 4px; }\n\n.a-PropertyEditor-propertyGroup-button {\n  appearance: none;\n  border: 0;\n  background: transparent;\n  color: inherit;\n  padding: 0;\n  margin: 0;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  font: inherit;\n  text-align: inherit; }\n\n.a-PropertyEditor-propertyGroup-header {\n  margin-top: 4px;\n  padding: 12px 8px;\n  border-width: 0;\n  transition: margin .1s ease; }\n  @media only screen and (max-width: 1024px) {\n    .a-PropertyEditor-propertyGroup-header {\n      padding-top: 4px;\n      padding-bottom: 4px; } }\n  @media only screen and (min-width: 1025px) and (max-width: 1279px) {\n    .a-PropertyEditor-propertyGroup-header {\n      padding-top: 6px;\n      padding-bottom: 6px; } }\n  @media only screen and (min-width: 1281px) and (max-width: 1679px) {\n    .a-PropertyEditor-propertyGroup-header {\n      padding-top: 8px;\n      padding-bottom: 8px; } }\n  .a-PropertyEditor-propertyGroup-header:hover .a-Icon {\n    opacity: 1; }\n  .a-PropertyEditor-propertyGroup-header .a-Icon {\n    margin: 2px 6px 2px 0;\n    border-radius: 2px;\n    opacity: 0.5;\n    transition: .2s ease; }\n    .u-RTL .a-PropertyEditor-propertyGroup-header .a-Icon {\n      margin: 2px 0 2px 6px; }\n    .a-PropertyEditor-propertyGroup-header .a-Icon.icon-right-arrow:before {\n      content: \"\\E0D8\"; }\n    .a-PropertyEditor-propertyGroup-header .a-Icon.icon-down-arrow:before {\n      content: \"\\e0c2\"; }\n  .a-PropertyEditor-propertyGroup-header.is-focused {\n    position: relative;\n    z-index: 100;\n    outline: none; }\n    .a-PropertyEditor-propertyGroup-header.is-focused .a-Icon {\n      opacity: 1; }\n\n.a-PropertyEditor-propertyGroup-title {\n  display: inline-block;\n  margin: 0;\n  padding: 0;\n  vertical-align: top;\n  font-weight: 600;\n  font-size: 14px;\n  line-height: 20px; }\n\n/**\n * Modifier: is-empty\n *\n * Used when an error message is displayed\n */\n.a-PropertyEditor.is-empty {\n  display: flex;\n  overflow: hidden;\n  height: 100%;\n  align-items: center; }\n\n.a-PropertyEditor-message {\n  padding: 12px;\n  width: 100%;\n  text-align: center; }\n\n.a-PropertyEditor-messageText {\n  margin: 0; }\n  .a-Icon + .a-PropertyEditor-messageText {\n    margin-top: 8px; }\n\n.a-PropertyEditor-editParent {\n  padding: 6px 8px;\n  text-align: center; }\n  @media only screen and (max-width: 1024px) {\n    .a-PropertyEditor-editParent {\n      padding: 2px 8px; } }\n  @media only screen and (min-width: 1025px) and (max-width: 1279px) {\n    .a-PropertyEditor-editParent {\n      padding: 4px 8px; } }\n\n/* Filtering\n   ========================================================================== */\n.a-PropertyEditor-filter {\n  position: relative;\n  display: flex;\n  padding: 0; }\n  .a-PropertyEditor-filter .a-PropertyEditor-filter-icon {\n    position: absolute;\n    top: 0;\n    left: 0;\n    margin: 8px;\n    opacity: .5;\n    transition: .1s ease;\n    pointer-events: none; }\n    .u-RTL .a-PropertyEditor-filter .a-PropertyEditor-filter-icon {\n      left: auto;\n      right: 0; }\n  .a-PropertyEditor-filter .a-Property-field:not(.a-Property-field--text) {\n    box-sizing: border-box;\n    padding: 8px 8px 8px 32px;\n    height: 32px;\n    line-height: 32px;\n    border-radius: 2px; }\n    .u-RTL .a-PropertyEditor-filter .a-Property-field:not(.a-Property-field--text) {\n      padding: 8px 32px 8px 8px; }\n    .a-PropertyEditor-filter .a-Property-field:not(.a-Property-field--text):focus + .a-Icon {\n      opacity: 1; }\n  .a-PropertyEditor-filter .a-Button--stickyFilter {\n    position: absolute;\n    top: 0;\n    right: 0;\n    bottom: 0;\n    z-index: 10;\n    margin: 4px;\n    padding: 4px;\n    opacity: 0;\n    transition: opacity .1s ease; }\n  .a-PropertyEditor-filter:focus-within .a-Property-field + .a-Icon {\n    opacity: 1; }\n  .a-PropertyEditor-filter .a-Property-field:focus ~ .a-Button--stickyFilter,\n  .a-PropertyEditor-filter .a-Button--stickyFilter.is-active,\n  .a-PropertyEditor-filter .a-Button--stickyFilter:focus {\n    opacity: 1; }\n\n.a-Property-highlight {\n  padding: 2px 0;\n  border-radius: 2px;\n  transition: .1s ease; }\n\n/* Property Filter Not Found\n   ========================================================================== */\n.a-Property-notFound {\n  padding: 1.6rem;\n  text-align: center; }\n  .a-Property-notFound .a-Icon {\n    margin-bottom: 8px; }\n\n/*\n$display-xxxs: 640px;\n$display-xxs: 800px;\n$display-xs: 1024px;\n$display-small: 1280px;\n$display-medium: 1680px;\n$display-large: 1920px;\n*/\n/* ==========================================================================\n   Property Group (Property Editor Groups)\n   ========================================================================== */\n/**\n * Property Group Component\n *\n * This is a grouping of one or more properties in the context of a property\n * editor. This allows us to conveniently group our properties and use\n * psuedo selectors to apply styles to first / last elements within the group.\n *\n * Example HTML:\n *\n * <div class=\"a-PropertyGroup\">\n *   <div class=\"a-PropertyGroup-item\">\n *     [Property  Here]\n *   </div>\n *   <div class=\"a-PropertyGroup-item\">\n *     [Property  Here]\n *   </div>\n *   <div class=\"a-PropertyGroup-item\">\n *     [Property  Here]\n *   </div>\n * </div>\n */\n.a-PropertyGroup-item {\n  border-top: 1px solid;\n  border-bottom-width: 0; }\n\n.a-PropertyEditor-propertyGroup-body {\n  padding: 4px 0; }\n\n/* ==========================================================================\n   Theme Configuration File\n   ========================================================================== */\n/**\n * Images\n */\n/**\n * Base Colors\n *\n * Description:\n * Provides a base for the UI.\n *\n * Usage:\n * General UI Background, Region Headers, Buttons\n */\n/**\n * Highlight Colors\n *\n * Description:\n * Used for providing emphasis or importance to UI components.\n *\n * Usage:\n * Region Headers, Primary / Hot Buttons\n */\n/**\n * Accent and Status Colors\n *\n * Description:\n * Used for indicating state-based UI components, status, or accents.\n *\n * Usage:\n * Warnings, Errors, Danger Text, Success, Focus\n */\n/**\n * Application Based Colors\n *\n * Description:\n * Used for applications within APEX development\n */\n/* ==========================================================================\n   Theme Configuration File\n   ========================================================================== */\n/**\n * Images\n */\n/**\n * Base Colors\n *\n * Description:\n * Provides a base for the UI.\n *\n * Usage:\n * General UI Background, Region Headers, Buttons\n */\n/**\n * Highlight Colors\n *\n * Description:\n * Used for providing emphasis or importance to UI components.\n *\n * Usage:\n * Region Headers, Primary / Hot Buttons\n */\n/**\n * Accent and Status Colors\n *\n * Description:\n * Used for indicating state-based UI components, status, or accents.\n *\n * Usage:\n * Warnings, Errors, Danger Text, Success, Focus\n */\n/**\n * Application Based Colors\n *\n * Description:\n * Used for applications within APEX development\n */\n/******************************************************************************\nProperties\n******************************************************************************/\n/******************************************************************************\nProperty Error\n******************************************************************************/\n.a-Property.is-error {\n  /* Make the text red when it is not focused to bring more attention */ }\n  .a-Property.is-error .a-Property-label {\n    color: #100F0E; }\n  .a-Property.is-error .a-Property-field:not(:focus) {\n    color: #C74634; }\n  .a-Property.is-error .icon-error {\n    color: #C74634 !important; }\n\n/******************************************************************************\nProperty Warning\n******************************************************************************/\n.a-Property.is-warning .a-Property-label {\n  color: #100F0E; }\n\n.a-Property.is-warning .icon-warning {\n  color: #D8974D !important; }\n\n/******************************************************************************\nLabel and Pre / Post Text\n******************************************************************************/\n.a-Property-label,\n.a-Property-setItemsHeader-header,\n.a-Property-unit {\n  color: #100F0E; }\n\n.a-Property-checkbox-label,\n.a-Property-radio {\n  color: rgba(16, 15, 14, 0.8); }\n\n/******************************************************************************\nProperty Field - Used for property editor\n******************************************************************************/\n.a-Property-field {\n  background-color: #FCFBFA;\n  color: #100F0E;\n  border-color: #E6E3E0;\n  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); }\n  .a-Property-field:hover {\n    background-color: #FFFFFF;\n    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); }\n  .a-Property-field:focus {\n    outline-color: #377E55;\n    background-color: #FFFFFF;\n    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);\n    outline-offset: 2px;\n    outline-width: 2px;\n    outline-style: dotted; }\n\n.a-Property.is-error.is-active .a-Property-field:not(.a-Property-field--textarea):focus {\n  box-shadow: 0 0 0 1px #E3513C inset, 0 1px 2px rgba(51, 51, 51, 0.1); }\n\n.a-Property.is-shadow.is-active .a-Property-field:not(.a-Property-field--textarea):focus {\n  box-shadow: 0 0 0 1px #E3513C inset, 0 1px 2px rgba(51, 51, 51, 0.1); }\n\n.a-Property.is-variable .a-Icon.icon-variable {\n  color: #7FBEF2; }\n\n.a-Property.is-variable .a-Property-field {\n  box-shadow: 0 0 0 1px rgba(127, 190, 242, 0.5) inset;\n  background-color: #f3f9fe; }\n\n.a-Property.is-warning .a-Property-field--textarea:focus {\n  border-color: #FACD62 !important; }\n\n.a-Property.is-error .a-Property-field--textarea:focus {\n  border-color: #E3513C !important; }\n\n/* Property Editor Select List\n   ========================================================================== */\n/* Text Area\n   ========================================================================== */\n.a-Property-readOnly {\n  color: rgba(51, 51, 51, 0.65); }\n\n.a-Property-field--readOnly {\n  box-shadow: none !important;\n  background-color: transparent !important; }\n  .a-Property-field--readOnly:focus {\n    border-color: rgba(0, 0, 0, 0.1); }\n\n/******************************************************************************\nProperty Editor Buttons\n******************************************************************************/\n.a-Property-buttonContainer .a-Button {\n  background-color: #FFFFFF; }\n\n/******************************************************************************\nCheckbox + Radio Buttons\n******************************************************************************/\n.a-Property-checkbox-input[type=\"checkbox\"],\n.a-Property-radio-input[type=\"radio\"] {\n  /* Focus\n   ========================================================================== */ }\n  .a-Property-checkbox-input[type=\"checkbox\"] + label:before,\n  .a-Property-radio-input[type=\"radio\"] + label:before {\n    background-color: #FFFFFF;\n    border-color: #DFDCD8; }\n  .a-Property-checkbox-input[type=\"checkbox\"] + label:after,\n  .a-Property-radio-input[type=\"radio\"] + label:after {\n    color: #FCFBFA; }\n  .a-Property-checkbox-input[type=\"checkbox\"]:focus + label:before,\n  .a-Property-checkbox-input[type=\"checkbox\"]:indeterminate + label:before,\n  .a-Property-radio-input[type=\"radio\"]:focus + label:before,\n  .a-Property-radio-input[type=\"radio\"]:indeterminate + label:before {\n    border-color: #377E55;\n    box-shadow: rgba(0, 0, 0, 0.1) 0 1px 1px; }\n  .a-Property-checkbox-input[type=\"checkbox\"]:focus:checked + label:before,\n  .a-Property-checkbox-input[type=\"checkbox\"]:focus:indeterminate + label:before,\n  .a-Property-radio-input[type=\"radio\"]:focus:checked + label:before,\n  .a-Property-radio-input[type=\"radio\"]:focus:indeterminate + label:before {\n    border-color: #377E55;\n    background-color: #377E55; }\n\n/******************************************************************************\nCheckbox Specific\n******************************************************************************/\n.a-Property-checkbox-input[type=\"checkbox\"]:indeterminate + label:before, .a-Property-checkbox-input[type=\"checkbox\"]:checked + label:before {\n  border-color: #67605B;\n  background-color: #67605B; }\n\n.a-Property-checkbox-input[type=\"checkbox\"]:indeterminate + label:after {\n  background-color: #FCFBFA; }\n\n/******************************************************************************\nRadio Specific\n******************************************************************************/\n.a-Property-radio-input[type=\"radio\"]:checked + label:before {\n  border-color: rgba(16, 15, 14, 0.6);\n  background-color: rgba(16, 15, 14, 0.6); }\n\n/******************************************************************************\nYes / No Buttons\n******************************************************************************/\n.a-Property-radioGroup--buttonSet .a-Property-radio-input {\n  /* Checked */\n  /* Focused */ }\n  .a-Property-radioGroup--buttonSet .a-Property-radio-input:checked + label {\n    background-color: #DFDCD8;\n    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1) inset, 0 2px 1px rgba(0, 0, 0, 0.05) inset; }\n  .a-Property-radioGroup--buttonSet .a-Property-radio-input:focus + label {\n    border-color: 0 1px 2px rgba(0, 0, 0, 0.1) !important;\n    background-color: #DFDCD8;\n    box-shadow: 0 0 0 1px 0 1px 2px rgba(0, 0, 0, 0.1) inset, 0 1px 2px rgba(0, 0, 0, 0.1); }\n  .a-Property-radioGroup--buttonSet .a-Property-radio-input:not(:checked):hover + label {\n    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15) inset, 0 1px 2px rgba(0, 0, 0, 0.1); }\n  .a-Property-radioGroup--buttonSet .a-Property-radio-input:hover:active + label {\n    box-shadow: 0 0 0 1px 0 1px 2px rgba(0, 0, 0, 0.1) inset, 0 1px 2px rgba(0, 0, 0, 0.1);\n    background-color: #E6E3E0; }\n\n.a-Property-colorPreview {\n  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1) inset; }\n\n.a-Property.is-changed .a-Property-labelContainer:before {\n  background-color: #377E55; }\n\n/* ==========================================================================\n   Theme Configuration File\n   ========================================================================== */\n/**\n * Images\n */\n/**\n * Base Colors\n *\n * Description:\n * Provides a base for the UI.\n *\n * Usage:\n * General UI Background, Region Headers, Buttons\n */\n/**\n * Highlight Colors\n *\n * Description:\n * Used for providing emphasis or importance to UI components.\n *\n * Usage:\n * Region Headers, Primary / Hot Buttons\n */\n/**\n * Accent and Status Colors\n *\n * Description:\n * Used for indicating state-based UI components, status, or accents.\n *\n * Usage:\n * Warnings, Errors, Danger Text, Success, Focus\n */\n/**\n * Application Based Colors\n *\n * Description:\n * Used for applications within APEX development\n */\n/* ==========================================================================\n   Property Editor\n   ========================================================================== */\n.a-PropertyEditor {\n  background-color: #E6E3E0; }\n\n.ui-dialog .a-PropertyEditor {\n  background-color: transparent; }\n\n/* Property Editor Groups\n   ========================================================================== */\n.a-PropertyEditor-propertyGroup,\n.a-PropertyEditor-propertyGroup-header,\n.a-PropertyEditor-propertyGroup-body {\n  border-color: #E6E3E0; }\n\n.a-PropertyEditor-propertyGroup {\n  background-color: #F7F5F3; }\n  .a-PropertyEditor-propertyGroup:focus-within, .a-PropertyEditor-propertyGroup.has-focus {\n    background-color: rgba(224, 245, 218, 0.3); }\n\n.a-PropertyEditor-propertyGroup-header .a-Icon {\n  color: #FCFBFA;\n  background-color: #A8A29B; }\n\n.a-PropertyEditor-propertyGroup-title {\n  color: #100F0E; }\n\n.a-PropertyEditor-propertyGroup-body .a-Property {\n  border-color: #E6E3E0; }\n\n.a-PropertyEditor-propertyGroup-header.is-focused {\n  box-shadow: rgba(51, 51, 51, 0.1); }\n  .a-PropertyEditor-propertyGroup-header.is-focused .a-Icon {\n    background-color: #377E55; }\n\n.a-PropertyEditor-message {\n  color: rgba(16, 15, 14, 0.6); }\n\n.a-PropertyEditor-messageText {\n  color: rgba(16, 15, 14, 0.8); }\n\n/* Filtering\n   ========================================================================== */\n.a-PropertyEditor-filter .a-PropertyEditor-filter-icon {\n  color: #100F0E; }\n\n.a-PropertyEditor-filter .a-Property-field:not(.a-Property-field--text):focus + .a-Icon {\n  color: #377E55; }\n\n.a-PropertyEditor-filter .a-Button--stickyFilter:focus, .a-PropertyEditor-filter .a-Button--stickyFilter:hover {\n  color: #AE562C;\n  background-color: #fff !important;\n  box-shadow: none; }\n\n.a-PropertyEditor-filter .a-Button--stickyFilter.is-active {\n  color: #FFFFFF;\n  background-color: #FACD62 !important;\n  box-shadow: none; }\n  .a-PropertyEditor-filter .a-Button--stickyFilter.is-active:focus, .a-PropertyEditor-filter .a-Button--stickyFilter.is-active:focus:active, .a-PropertyEditor-filter .a-Button--stickyFilter.is-active:hover {\n    color: #FFFFFF;\n    background-color: #FACD62 !important;\n    box-shadow: 0 0 0 1px #377E55 inset; }\n\n.a-PropertyEditor-filter:focus-within .a-Property-field {\n  background-color: #FCFBFA;\n  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); }\n\n.a-PropertyEditor-filter:focus-within .a-Property-field + .a-Icon {\n  color: #377E55; }\n\n.a-Property-highlight {\n  background-color: #FEEDC3;\n  box-shadow: 0 1px 1px -1px rgba(51, 51, 51, 0.1); }\n\n/* Property Filter Not Found\n   ========================================================================== */\n.a-Property-notFound {\n  color: rgba(16, 15, 14, 0.6); }\n\n/* ==========================================================================\n   Theme Configuration File\n   ========================================================================== */\n/**\n * Images\n */\n/**\n * Base Colors\n *\n * Description:\n * Provides a base for the UI.\n *\n * Usage:\n * General UI Background, Region Headers, Buttons\n */\n/**\n * Highlight Colors\n *\n * Description:\n * Used for providing emphasis or importance to UI components.\n *\n * Usage:\n * Region Headers, Primary / Hot Buttons\n */\n/**\n * Accent and Status Colors\n *\n * Description:\n * Used for indicating state-based UI components, status, or accents.\n *\n * Usage:\n * Warnings, Errors, Danger Text, Success, Focus\n */\n/**\n * Application Based Colors\n *\n * Description:\n * Used for applications within APEX development\n */\n/******************************************************************************\nProperty Group Styles\n******************************************************************************/\n.a-PropertyGroup-item {\n  border-top-color: #CBC5BF; }\n","/******************************************************************************\n\nFile Name:    LiveTemplateOptions\nPurpose:      Loads the necessary styles for the Live Template Options dialog\n              which is loaded during runtime\n\n******************************************************************************/\n\n@import 'core/Property';\n@import 'core/PropertyEditor';\n@import 'core/PropertyGroup';\n\n@import 'theme/standard/_themeConfig';\n@import 'theme/standard/Property';\n@import 'theme/standard/PropertyEditor';\n@import 'theme/standard/PropertyGroup';\n","// /******************************************************************************\n// Media Queries\n// ******************************************************************************/\n/*\n$display-xxxs: 640px;\n$display-xxs: 800px;\n$display-xs: 1024px;\n$display-small: 1280px;\n$display-medium: 1680px;\n$display-large: 1920px;\n*/\n\n@mixin respond-to($media) {\n  @if $media==xxxs-screens {\n    @media only screen and (max-width: $display-xxxs) {\n      @content;\n    }\n  }\n\n  @if $media==xxs-screens {\n    @media only screen and (max-width: $display-xxs) {\n      @content;\n    }\n  }\n\n  @if $media==smallest-screens {\n    @media only screen and (max-width: $display-xs) {\n      @content;\n    }\n  }\n\n  @if $media==small-screens-in {\n    @media only screen and (max-width: $display-small) {\n      @content;\n    }\n  }\n\n  @if $media==medium-screens-in {\n    @media only screen and (max-width: $display-medium) {\n      @content;\n    }\n  }\n\n  @if $media==large-screens-in {\n    @media only screen and (max-width: $display-large) {\n      @content;\n    }\n  }\n\n  @if $media==small-screens-out {\n    @media only screen and (min-width: $display-small + 1) {\n      @content;\n    }\n  }\n\n  @if $media==medium-screens-out {\n    @media only screen and (min-width: $display-medium + 1) {\n      @content;\n    }\n  }\n\n  @if $media==large-screens-out {\n    @media only screen and (min-width: $display-large + 1) {\n      @content;\n    }\n  }\n\n  @else if $media==small-screens {\n    @media only screen and (min-width: $display-xs + 1) and (max-width: $display-small - 1) {\n      @content;\n    }\n  }\n\n  @else if $media==medium-screens {\n    @media only screen and (min-width: $display-small + 1) and (max-width: $display-medium - 1) {\n      @content;\n    }\n  }\n\n  @else if $media==large-screens {\n    @media only screen and (min-width: $display-medium + 1) and (max-width: $display-large - 1) {\n      @content;\n    }\n  }\n\n  @else if $media==largest-screens {\n    @media only screen and (min-width: $display-large) {\n      @content;\n    }\n  }\n}\n","// ---\n// Import Core Config\n// ---\n@import \"_config\";\n\n/* ==========================================================================\n   Property (Property Editor Properties)\n   ========================================================================== */\n\n/**\n * Property Component\n *\n * This is a property that is used within the context of a property editor to\n * provide a label and input field.\n *\n * Example HTML:\n *\n * <div class=\"a-Property\">\n *   <div class=\"a-Property-labelContainer\">\n *     <label class=\"a-Property-label\">Label</label>\n *   </div>\n *   <div class=\"a-Property-fieldContainer\">\n *     <input type=\"text\" class=\"a-Property-field\">\n *   </div>\n * </div>\n */\n\n.a-Property {\n  position: relative;\n  display: table;\n  margin: 0;\n  padding: 0;\n  width: 100%;\n  table-layout: auto;\n}\n\n.a-Property .a-Icon.icon-required {\n  // position: absolute;\n  // top: 0;\n  // left: 0;\n  display: none; // Hiding in 5.1\n}\n\n.a-Property-buttonContainer,\n.a-Property-labelContainer,\n.a-Property-unitContainer {\n  display: table-cell;\n  vertical-align: middle;\n}\n\n.a-Property-buttonContainer,\n.a-Property-labelContainer,\n.a-Property-fieldContainer,\n.a-Property-unitContainer {\n  padding: 4px 8px;\n\n  //\n  @include respond-to(smallest-screens) {\n    padding: 2px 8px;\n  }\n}\n\n.a-Property-labelContainer {\n  padding-right: 0;\n  min-width: 112px;\n}\n\n#templateOptionsDlgPE .a-Property-labelContainer {\n  min-width: 144px;\n}\n\n// Stacking Label Container\n.a-PropertyEditor--stacked .a-Property:not(.a-Property--stacked) .a-Property-labelContainer {\n  display: table-row;\n  width: 100%;\n}\n\n.a-Property-fieldContainer {\n  display: table-cell;\n  width: 100%;\n  vertical-align: middle;\n}\n\n.a-Property-fieldContainer--comboBox {\n  padding-right: 0 !important;\n\n  .a-Property-field {\n    // border-top-right-radius: 0 !important;\n    // border-bottom-right-radius: 0 !important;\n  }\n}\n\n.a-Property-buttonContainer--comboBox {\n  .a-Button {\n    margin-left: -1px;\n  }\n}\n\n.a-Property-colorPreview {\n  display: block;\n  width: 12px;\n  height: 12px;\n  border-radius: 100%;\n}\n\n// Color Picker\n.a-Property-fieldContainer--colorPicker {\n\n  .a-Property-field {\n    padding-left: calc(var(--a-icon-size, 16px) + var(--a-icon-padding, 4px) + var(--a-icon-padding, 4px));\n    border-top-right-radius: 0 !important;\n    border-bottom-right-radius: 0 !important;\n  }\n\n  .a-Button {\n    --a-button-padding-y: 4px;\n    --a-button-padding-x: 8px;\n  }\n}\n\n.a-Property-buttonContainer--colorPicker {\n  .a-Button {\n    margin-left: -1px;\n  }\n}\n\n// Remove left padding to remove extra gap from field\n.a-Property-unitContainer {\n  padding-left: 0 !important;\n  white-space: nowrap;\n}\n\n/******************************************************************************\nProperty Error\n******************************************************************************/\n.a-Property.is-error {\n  .icon-error {\n    margin-right: 4px;\n  }\n}\n\n/******************************************************************************\nProperty Warning\n******************************************************************************/\n.a-Property.is-warning {\n  .icon-warning {\n    margin-right: 4px;\n  }\n}\n\n/******************************************************************************\nLabel and Pre / Post Text\n******************************************************************************/\n.a-Property-label,\n.a-Property-setItemsHeader-header,\n.a-Property-unit {\n  padding: 4px 0;\n  font-size: 12px;\n  line-height: 16px;\n}\n\n.a-Property-checkbox-label,\n.a-Property-radio {\n  font-size: 12px;\n  line-height: 16px;\n}\n\n.a-Property-unit {\n  font-size: 11px;\n}\n\n.a-Property-label--withIcon {\n  padding: 4px 0;\n  line-height: 16px;\n}\n\n/******************************************************************************\nProperty Field - Used for property editor\n******************************************************************************/\n.a-Property-field {\n  padding: 4px;\n  min-height: 24px;\n  font-size: 12px;\n  line-height: 16px;\n  border-radius: 2px;\n\n  &:focus {\n    outline: none;\n  }\n}\n\n.a-Property-field:not(.a-Property-field--textarea) {\n  // transition: box-shadow 0.1s ease;\n}\n\n// When multiple components are selected, fields with variable information are shown with the following background color\n.a-Property.is-variable {\n  .a-Icon.icon-variable {\n    margin-right: 4px;\n  }\n\n  .a-Property-field {\n    border-radius: 2px;\n  }\n}\n\n/* Property Editor Select List\n   ========================================================================== */\n.a-Property-field--select {\n  overflow: hidden;\n  padding-right: 30px;\n  text-indent: 0.01px;\n  text-overflow: ' ';\n  background-position: 100% 0;\n  background-size: 32px 24px;\n  background-repeat: no-repeat;\n  appearance: none;\n}\n\nbody:not(:-moz-handler-blocked) .a-Property-field--select {\n  padding: 2px 24px 2px 2px;\n}\n\n/* Text Area\n   ========================================================================== */\n.a-Property-field--textarea,\nbody .ui-widget .a-Property-field--textarea {\n  padding: 4px;\n  max-height: 320px;\n  height: auto;\n  font-size: 11px;\n  font-family: $font-family-mono;\n  line-height: 14px;\n}\n\n.a-Property-readOnly {\n  font-weight: bold;\n  font-size: 12px;\n  line-height: 2;\n}\n\n.a-Property-setItemsTable-header {\n  font-weight: normal;\n}\n\n.a-Property-setItemsTable {\n  .a-Property-field {\n    border-top-right-radius: 0;\n    border-bottom-right-radius: 0;\n  }\n}\n\n/******************************************************************************\nCombo Box Styles\n******************************************************************************/\n.a-Property-buttonContainer--comboBox .a-Button {\n  margin-left: 8px;\n}\n\n/******************************************************************************\nCheckbox + Radio Buttons\n******************************************************************************/\n.a-Property-checkbox-input[type=\"checkbox\"],\n.a-Property-radio-input[type=\"radio\"] {\n  @include visuallyHidden;\n\n  & + label {\n    position: relative;\n    padding-right: 8px;\n    padding-left: 20px;\n    cursor: pointer;\n\n    .u-RTL & {\n      padding-left: 8px;\n      padding-right: 20px;\n    }\n\n    &:before,\n    &:after {\n      position: absolute;\n      top: 3px;\n      left: 0;\n      display: block;\n      width: 14px;\n      height: 14px;\n      content: '';\n      transition: .125s opacity ease;\n\n      .u-RTL & {\n        left: auto;\n        right: 0;\n      }\n    }\n\n    &:before {\n      z-index: 90;\n      border: 1px solid;\n    }\n\n    &:after {\n      z-index: 100;\n      opacity: 0;\n    }\n  }\n\n  /* Disabled State\n   ========================================================================== */\n  &:disabled + label {\n    opacity: .5;\n    cursor: default;\n    pointer-events: none;\n\n    &:before {\n      opacity: .5;\n    }\n  }\n\n  /* Focus\n   ========================================================================== */\n  &:focus + label:before {}\n\n  &:focus:checked + label:before {}\n\n  &:hover:checked + label:after,\n  &:focus:checked + label:after {\n    opacity: 1;\n  }\n}\n\n\n/******************************************************************************\nCheckbox Specific\n******************************************************************************/\n.a-Property-checkbox-input[type=\"checkbox\"] {\n\n  & + label {\n    &:before {\n      border-radius: 2px;\n    }\n\n    &:after {\n      background-position: 50%;\n      background-size: 16px;\n      background-repeat: no-repeat;\n      text-transform: none;\n      font-weight: normal;\n      font-style: normal;\n      font-variant: normal;\n      font-family: \"apex-5-icon-font\";\n      -webkit-font-smoothing: antialiased;\n      -moz-osx-font-smoothing: grayscale;\n      speak: none;\n      content: var(--a-checkbox-icon-character, \"\\e007\");\n      text-align: center;\n      line-height: 14px;\n      font-size: 10px;\n    }\n  }\n\n  &:indeterminate + label {\n    &:after {\n      opacity: 1;\n      background-image: none;\n      width: 8px;\n      height: 2px;\n      border-radius: 2px;\n      margin: 6px 3px;\n      transform: scale(0.75);\n    }\n  }\n\n  /* Unchecked\n   ========================================================================== */\n\n  /* Checked\n   ========================================================================== */\n  &:checked {\n    & + label:before {}\n\n    & + label:after,\n    & + label:before {\n      opacity: 1;\n    }\n  }\n}\n\n/******************************************************************************\nRadio Specific\n******************************************************************************/\n.a-Property-radio-input[type=\"radio\"] {\n\n  & + label {\n    &:before {\n      border-radius: 16px;\n    }\n\n    &:after {\n      margin: 5px;\n      width: 4px;\n      height: 4px;\n      border-radius: 100%;\n    }\n  }\n\n  /* Unchecked\n   ========================================================================== */\n\n  /* Checked\n   ========================================================================== */\n  &:checked {\n    & + label:after {\n      opacity: 1;\n    }\n  }\n}\n\n\n\n/******************************************************************************\nYes / No Buttons\n******************************************************************************/\n.a-Property-radioGroup--buttonSet {\n  .a-PropertyEditor--stacked & {\n    padding: 0 4px;\n  }\n\n  .a-Property-radio {\n    margin-right: -1px;\n  }\n\n  .a-Property-radio-input {\n\n    /* Unchecked */\n    & + label {\n      padding: 2px 8px;\n      transition: background-color .15s ease;\n\n      &:before,\n      &:after {\n        content: initial;\n      }\n    }\n\n    /* Checked */\n    &:checked + label {\n      font-weight: bold;\n    }\n\n    /* Focused */\n    &:focus + label {\n      z-index: 1;\n      outline: none;\n      border-radius: 2px;\n    }\n  }\n}\n\n/******************************************************************************\nRadio\n******************************************************************************/\n// .a-Property-radioGroup.ui-buttonset .a-Property-radio {\n//   display: inline-block;\n// }\n\n.a-Property-radioGroup:focus {\n  outline: none;\n}\n\n.a-Property-radio {\n  display: inline-block;\n}\n\n.a-Property-radio-input {\n  display: inline-block;\n  margin: 2px;\n  width: 16px;\n  height: 16px;\n  vertical-align: top;\n}\n\n.a-Property-radio-label {\n  display: inline-block;\n  padding: 2px;\n  vertical-align: top;\n  font-size: 12px;\n}\n\n.a-Property-fieldContainer--radioGroup {\n  padding-top: 6px;\n  padding-bottom: 6px;\n}\n\n.a-Property-fieldContainer--radioGroup {}\n\n/******************************************************************************\nYes / No Radios\n******************************************************************************/\n\n.a-Property-radioGroup--buttonSet {\n  @include clearfix;\n\n  .a-Property-radio {\n    float: left;\n  }\n\n  .a-Property-radio-input {\n    @include visuallyHidden;\n\n    &:checked + label {}\n\n    &:not(:checked) + label {}\n\n    &:hover + label {}\n\n    &:focus + label {}\n\n    &:disabled + label {\n      opacity: .5;\n    }\n  }\n\n  .a-Property-radio-input + label {\n    min-width: 48px;\n    text-align: center;\n    line-height: 20px;\n    border-radius: 2px;\n\n    .a-Icon {\n      margin: 2px;\n    }\n  }\n}\n\n/******************************************************************************\nStacked Properties\n******************************************************************************/\n\n.a-Property--stacked {\n  position: relative;\n\n  .a-Property-labelContainer,\n  .a-Property-fieldContainer {\n    display: block;\n\n  }\n\n  .a-Property-labelContainer {\n    margin-right: 64px;\n    padding-bottom: 0;\n  }\n\n  .a-Property-fieldContainer {\n    padding-top: 0;\n  }\n\n  .a-Property-buttonContainer {\n    position: absolute;\n    top: 0;\n    right: 0;\n\n    & + .a-Property-fieldContainer {\n      padding-top: 4px;\n    }\n\n    .a-Button--quickPick {\n      margin-left: 8px;\n    }\n  }\n}\n\n.a-Property--scrollable {\n  display: block;\n  overflow: auto;\n}\n\n.a-Property-labelContainer--withButtons {\n  display: table-cell;\n  table-layout: auto;\n  // float: left;\n  padding-bottom: 8px;\n}\n\n.a-Property-labelContainer--hiddenLabel {\n  padding: 0;\n}\n\n\n.a-Property-buttonContainer {\n  padding-left: 0 !important;\n\n  // & > .a-Button {\n  //   margin-left: -1px;\n  // }\n}\n\n.a-Property-buttonContainer--pullRight {\n  float: right;\n}\n\n.a-Property.is-active {}\n\n.a-Property.is-focused {}\n\n.a-Property.is-required {}\n\n.a-Property.is-changed {\n  .a-Property-labelContainer:before {\n    position: absolute;\n    top: 1px;\n    bottom: 0;\n    left: 1px;\n    display: inline-block;\n    width: 3px;\n    content: '';\n    opacity: .5;\n  }\n\n  &:hover,\n  &.is-focused {\n    .a-Property-labelContainer:before {\n      opacity: 1;\n    }\n  }\n}\n\n\n// Sub Components\n.a-Property-label,\n.a-Property-unit {\n  display: block;\n  -ms-text-overflow: ellipsis;\n  text-overflow: ellipsis;\n  // white-space: nowrap; // Removing to allow labels to wrap\n  overflow: hidden; // Hidden Overflow\n}\n\n.a-Property-field {\n  display: block;\n  width: 100%;\n  background-clip: border-box;\n  border: 0 solid; // removing as it made the properties look too heavy in PE\n}\n\n.a-Property-field--textarea {\n  min-height: 48px;\n  font-family: $font-family-mono;\n  resize: vertical;\n}\n\n/******************************************************************************\nHide/Show Classes\n******************************************************************************/\n.a-Property.js-showAll,\n.a-PropertyEditor-propertyGroup.js-showAll {\n  display: none;\n}\n\n.a-PropertyEditor.js-showAll .a-Property.js-showAll,\n.a-PropertyEditor.js-showAll .a-PropertyEditor-propertyGroup.js-showAll {\n  display: block;\n}\n\n.a-PropertyEditor--stacked.js-showAll .a-Property.js-showAll {\n  display: table;\n}\n\n/******************************************************************************\nVariable Field\n******************************************************************************/\n.a-Property-field.is-variable {}\n\n/******************************************************************************\nCheckbox\n******************************************************************************/\n.a-Property-checkboxGroup:focus {\n  outline: none;\n}\n\n.a-Property-checkbox-input {\n  display: inline-block;\n  margin: 2px;\n  width: 16px;\n  height: 16px;\n  vertical-align: top;\n}\n\n.a-Property-checkbox-label {\n  display: inline-block;\n  padding: 2px;\n  vertical-align: top;\n  font-size: 12px;\n}\n\n/******************************************************************************\nSet Items Table\n******************************************************************************/\n.a-Property-setItemsTable {\n  width: 100%;\n  border-spacing: 0;\n  border-collapse: collapse;\n\n  td {\n    padding-bottom: 4px;\n  }\n\n  tr:last-child td {\n    padding-bottom: 0;\n  }\n}\n\n.a-Property-setItemsHeader-header {\n  text-align: left;\n}\n\n.a-Property-setItemsTable-removeCol {\n  width: 40px;\n}\n\n\n/******************************************************************************\nProperty Editor in Dialogs\n******************************************************************************/\n// .ui-dialog .a-Property {\n//   border-top: 1px solid;\n//   border-bottom: 1px solid;\n//   margin-top: -1px;\n// }\n\n/******************************************************************************\nProperty Editor Buttons\n******************************************************************************/\n// .a-Button.a-Property-button,\n.a-Property-button {\n  --a-button-padding-y: 6px;\n  // padding-top: 6px;\n  // padding-bottom: 6px;\n  width: 100%;\n  white-space: normal;\n}\n\n\n/******************************************************************************\nStacked Styles\n******************************************************************************/\n.a-PropertyEditor--stacked {\n  .a-Property-labelContainer .a-Property-label {\n    padding-right: 12px;\n    padding-bottom: 2px;\n    padding-left: 12px;\n    font-size: 11px;\n  }\n\n  .a-Property-fieldContainer,\n  .a-Property-buttonContainer {\n    padding-top: 0;\n    padding-bottom: 8px;\n  }\n\n  .a-Property--stacked .a-Property-buttonContainer {\n    padding-top: 4px;\n    padding-bottom: 4px;\n  }\n\n  .a-Property--stacked .a-Property-labelContainer .a-Property-label {\n    padding: 4px 0;\n  }\n}\n\n\n/* ==========================================================================\n   High Contrast Mode\n   ========================================================================== */\n.u-HCM {\n  .a-Property-field {\n    border: 1px solid !important;\n  }\n}\n","// *************************************\n//\n//   Core Config & Common Imports\n//   -> ...\n//\n// *************************************\n\n// Config\n$font-family-base:          \"Oracle Sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Roboto\", \"Oxygen\", \"Ubuntu\", \"Cantarell\", \"Fira Sans\", \"Droid Sans\", \"Helvetica Neue\", sans-serif;\n$font-family-serif:         Georgia, Times, \"Times New Roman\", serif;\n$font-family-mono:          SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n\n// Breakpoints\n$display-xxxs:              640px;\n$display-xxs:               800px;\n$display-xs:                1024px;\n$display-small:             1280px;\n$display-medium:            1680px;\n$display-large:             1920px;\n\n// Helpers & Mixins\n@import '../_helpers/_a-icon';\n@import '../_helpers/_apex5-icon';\n@import '../_helpers/_clearfix';\n@import '../_helpers/_respond-to';\n@import '../_helpers/_shadow-scroll';\n@import '../_helpers/_visually-hidden';\n","@mixin visuallyHidden {\n  position: absolute;\n  overflow: hidden;\n  clip: rect(0 0 0 0);\n  margin: -1px;\n  padding: 0;\n  width: 1px;\n  height: 1px;\n  border: 0;\n}\n","@mixin clearfix {\n\n  &:before,\n  &:after {\n    display: table;\n    content: '';\n  }\n\n  &:after {\n    clear: both;\n  }\n}\n","// ---\n// Import Core Config\n// ---\n@import \"_config\";\n\n/* ==========================================================================\n   Property Editor\n   ========================================================================== */\n\n.a-PropertyEditor {}\n\n.a-PropertyEditor-wrapper {\n  .a-PropertyEditor-propertyGroup:first-child {\n    margin-top: 8px;\n  }\n}\n\n.ui-dialog .a-PropertyEditor {\n  overflow: auto;\n  max-height: 400px;\n}\n\n/* Property Editor Groups\n   ========================================================================== */\n.a-PropertyEditor-propertyGroup {\n  display: block;\n  // margin-top: -1px;\n  background-clip: padding-box;\n  transition: background-color 0.1s ease, box-shadow 0.1s ease;\n\n  &.is-collapsed {\n    .a-PropertyEditor-propertyGroup-header {\n      border-bottom: none;\n    }\n\n    .a-PropertyEditor-propertyGroup-body {\n      display: none;\n    }\n  }\n}\n\n.a-PropertyEditor .a-PropertyEditor-propertyGroup:first-child {\n  margin-top: 4px;\n}\n\n// Remove styles from button used for better accessibility\n.a-PropertyEditor-propertyGroup-button {\n  appearance: none;\n  border: 0;\n  background: transparent;\n  color: inherit;\n  padding: 0;\n  margin: 0;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  font: inherit;\n  text-align: inherit;\n}\n\n.a-PropertyEditor-propertyGroup-header {\n  margin-top: 4px;\n  padding: 12px 8px;\n  border-width: 0;\n  transition: margin .1s ease;\n\n  //\n  @include respond-to(smallest-screens) {\n    padding-top: 4px;\n    padding-bottom: 4px;\n  }\n\n  //\n  @include respond-to(small-screens) {\n    padding-top: 6px;\n    padding-bottom: 6px;\n  }\n\n  //\n  @include respond-to(medium-screens) {\n    padding-top: 8px;\n    padding-bottom: 8px;\n  }\n\n  &:hover {\n    .a-Icon {\n      opacity: 1;\n    }\n  }\n\n  .a-Icon {\n    margin: 2px 6px 2px 0;\n    border-radius: 2px;\n    opacity: 0.5;\n    transition: .2s ease;\n\n    .u-RTL & {\n      margin: 2px 0 2px 6px;\n    }\n\n    &.icon-right-arrow:before {\n      content: \"\\E0D8\";\n    }\n\n    &.icon-down-arrow:before {\n      content: \"\\e0c2\";\n    }\n  }\n\n  &.is-focused {\n    position: relative;\n    z-index: 100;\n    outline: none;\n\n    .a-Icon {\n      opacity: 1;\n    }\n  }\n}\n\n// /* Reducing margin when collapsed */\n// .a-PropertyEditor-propertyGroup:not(.is-expanded) {\n//   & + .a-PropertyEditor-propertyGroup.is-expanded .a-PropertyEditor-propertyGroup-header,\n//   .a-PropertyEditor-propertyGroup-header {\n//     margin-top: 4px;\n//   }\n// }\n\n\n\n.a-PropertyEditor-propertyGroup-title {\n  display: inline-block;\n  margin: 0;\n  padding: 0;\n  vertical-align: top;\n  font-weight: 600;\n  font-size: 14px;\n  line-height: 20px;\n}\n\n\n/**\n * Modifier: is-empty\n *\n * Used when an error message is displayed\n */\n.a-PropertyEditor.is-empty {\n  display: flex;\n  overflow: hidden;\n  height: 100%;\n  align-items: center;\n}\n\n.a-PropertyEditor-message {\n  padding: 12px;\n  width: 100%;\n  text-align: center;\n}\n\n.a-PropertyEditor-messageText {\n  margin: 0;\n\n  @at-root .a-Icon + & {\n    margin-top: 8px;\n  }\n}\n\n.a-PropertyEditor-editParent {\n  padding: 6px 8px;\n  text-align: center;\n\n  //\n  @include respond-to(smallest-screens) {\n    padding: 2px 8px;\n  }\n\n  //\n  @include respond-to(small-screens) {\n    padding: 4px 8px;\n  }\n}\n\n/* Filtering\n   ========================================================================== */\n.a-PropertyEditor-filter {\n  position: relative;\n  display: flex;\n  padding: 0;\n\n  .a-PropertyEditor-filter-icon {\n    position: absolute;\n    top: 0;\n    left: 0;\n    margin: 8px;\n    opacity: .5;\n    transition: .1s ease;\n    pointer-events: none;\n\n    .u-RTL & {\n      left: auto;\n      right: 0;\n    }\n  }\n\n  .a-Property-field:not(.a-Property-field--text) {\n    box-sizing: border-box;\n    padding: 8px 8px 8px 32px;\n    height: 32px;\n    line-height: 32px;\n    border-radius: 2px;\n\n    .u-RTL & {\n      padding: 8px 32px 8px 8px;\n    }\n\n    &:focus + .a-Icon {\n      opacity: 1;\n    }\n  }\n\n  .a-Button--stickyFilter {\n    position: absolute;\n    top: 0;\n    right: 0;\n    bottom: 0;\n    z-index: 10;\n    margin: 4px;\n    padding: 4px;\n    opacity: 0;\n    transition: opacity .1s ease;\n  }\n\n  &:focus-within {\n    .a-Property-field + .a-Icon {\n      opacity: 1;\n    }\n  }\n\n  .a-Property-field:focus ~ .a-Button--stickyFilter,\n  .a-Button--stickyFilter.is-active,\n  .a-Button--stickyFilter:focus {\n    opacity: 1;\n  }\n}\n\n.a-Property-highlight {\n  padding: 2px 0;\n  border-radius: 2px;\n  transition: .1s ease;\n}\n\n/* Property Filter Not Found\n   ========================================================================== */\n.a-Property-notFound {\n  padding: 1.6rem;\n  text-align: center;\n\n  .a-Icon {\n    margin-bottom: 8px;\n  }\n}\n","// ---\n// Import Core Config\n// ---\n@import \"_config\";\n\n/* ==========================================================================\n   Property Group (Property Editor Groups)\n   ========================================================================== */\n\n/**\n * Property Group Component\n *\n * This is a grouping of one or more properties in the context of a property\n * editor. This allows us to conveniently group our properties and use\n * psuedo selectors to apply styles to first / last elements within the group.\n *\n * Example HTML:\n *\n * <div class=\"a-PropertyGroup\">\n *   <div class=\"a-PropertyGroup-item\">\n *     [Property  Here]\n *   </div>\n *   <div class=\"a-PropertyGroup-item\">\n *     [Property  Here]\n *   </div>\n *   <div class=\"a-PropertyGroup-item\">\n *     [Property  Here]\n *   </div>\n * </div>\n */\n\n.a-PropertyGroup {\n}\n\n.a-PropertyGroup-item {\n  border-top: 1px solid;\n  //border-bottom: 1px solid;\n  border-bottom-width: 0;\n}\n\n.a-PropertyEditor-propertyGroup-body {\n  padding: 4px 0;\n}\n","// Redwood\n$font-family-base:    \"Oracle Sans\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Roboto\", \"Oxygen\", \"Ubuntu\", \"Cantarell\", \"Fira Sans\", \"Droid Sans\", \"Helvetica Neue\", sans-serif !default;\n$font-family-serif:   Georgia, Times, \"Times New Roman\", serif !default;\n$font-family-mono:    SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace !default;\n\n$white: #fff;\n$black: #000;\n\n// Neutral\n$n-0: $white !default;\n$n-10: #FCFBFA !default;\n$n-20: #F7F5F3 !default;\n$n-30: #F1EFED !default;\n$n-40: #E8E5E3 !default;\n$n-50: #DFDCD8 !default;\n$n-60: #CBC7C3 !default;\n$n-70: #B8B2AE !default;\n$n-80: #A49E98 !default;\n$n-90: #918983 !default;\n$n-100: #7D746E !default;\n$n-110: #736B65 !default;\n$n-120: #69615C !default;\n$n-130: #5E5852 !default;\n$n-140: #544E49 !default;\n$n-150: #4A4540 !default;\n$n-160: #3B3733 !default;\n$n-170: #2C2926 !default;\n$n-180: #1E1C1A !default;\n$n-190: #0F0E0D !default;\n$n-200: $black !default;\n\n// Beige\n$b-0: $white !default;\n$b-10: #FFFDF7 !default;\n$b-20: #FAF6EA !default;\n$b-30: #F5EFDD !default;\n$b-40: #EDE5CE !default;\n$b-50: #E5DBBE !default;\n$b-60: #D0C7AC !default;\n$b-70: #BAB29B !default;\n$b-80: #A79F88 !default;\n$b-90: #918A75 !default;\n$b-100: #7B7664 !default;\n$b-110: #716C5B !default;\n$b-120: #69624F !default;\n$b-130: #5E5947 !default;\n$b-140: #544F3E !default;\n$b-150: #4B4537 !default;\n$b-160: #3B382B !default;\n$b-170: #2C2923 !default;\n$b-180: #1E1D15 !default;\n$b-190: #0F0E0C !default;\n$b-200: $black !default;\n\n// Forest Green\n$fg-0: $white !default;\n$fg-10: #F8FCFA !default;\n$fg-20: #EDF8F2 !default;\n$fg-30: #E2F3E9 !default;\n$fg-40: #CFECDC !default;\n$fg-50: #BFE6D0 !default;\n$fg-60: #A5D2B9 !default;\n$fg-70: #8BBEA2 !default;\n$fg-80: #72AB8C !default;\n$fg-90: #589775 !default;\n$fg-100: #3E835E !default;\n$fg-110: #377956 !default;\n$fg-120: #326E4D !default;\n$fg-130: #2E6347 !default;\n$fg-140: #28583F !default;\n$fg-150: #244E39 !default;\n$fg-160: #1D4331 !default;\n$fg-170: #162E23 !default;\n$fg-180: #0F2018 !default;\n$fg-190: #07100D !default;\n$fg-200: $black !default;\n\n// Green\n$g-0: $white !default;\n$g-10: #F9FFF7 !default;\n$g-20: #EDFAE9 !default;\n$g-30: #DFF5DB !default;\n$g-40: #D1EDCA !default;\n$g-50: #C2E6B9 !default;\n$g-60: #AED1A5 !default;\n$g-70: #9ABD91 !default;\n$g-80: #87A880 !default;\n$g-90: #719369 !default;\n$g-100: #5F7E58 !default;\n$g-110: #587450 !default;\n$g-120: #4C6A46 !default;\n$g-130: #485F42 !default;\n$g-140: #41543D !default;\n$g-150: #3A4A37 !default;\n$g-160: #2F3B2B !default;\n$g-170: #1F2D1C !default;\n$g-180: #151F12 !default;\n$g-190: #0B0F0B !default;\n$g-200: $black !default;\n\n// Blue\n$bl-0: $white !default;\n$bl-10: #F5FDFF !default;\n$bl-20: #E6F8FC !default;\n$bl-30: #D9F4FA !default;\n$bl-40: #C9ECF3 !default;\n$bl-50: #B5E3ED !default;\n$bl-60: #A0D0DB !default;\n$bl-70: #88BBC7 !default;\n$bl-80: #73A7B3 !default;\n$bl-90: #60929E !default;\n$bl-100: #497D8A !default;\n$bl-110: #407481 !default;\n$bl-120: #3C6974 !default;\n$bl-130: #345F6B !default;\n$bl-140: #2B555F !default;\n$bl-150: #274B53 !default;\n$bl-160: #1C3C44 !default;\n$bl-170: #162D31 !default;\n$bl-180: #121E22 !default;\n$bl-190: #081012 !default;\n$bl-200: $black !default;\n\n// Teal\n$t-0: $white !default;\n$t-10: #F4FCFC !default;\n$t-20: #E9FAF9 !default;\n$t-30: #DAF5F4 !default;\n$t-40: #CBECEA !default;\n$t-50: #BDE3E1 !default;\n$t-60: #A1D1CF !default;\n$t-70: #8ABCB9 !default;\n$t-80: #74A8A6 !default;\n$t-90: #5A9491 !default;\n$t-100: #40807D !default;\n$t-110: #3A7673 !default;\n$t-120: #366B69 !default;\n$t-130: #2E615F !default;\n$t-140: #235756 !default;\n$t-150: #1F4D4A !default;\n$t-160: #1A3D3C !default;\n$t-170: #132E2C !default;\n$t-180: #101F1E !default;\n$t-190: #071010 !default;\n$t-200: $black !default;\n\n// Slate\n$s-0: $white !default;\n$s-10: #F8FCFC !default;\n$s-20: #EDF7F7 !default;\n$s-30: #E3F2F2 !default;\n$s-40: #D4EBEB !default;\n$s-50: #C5E3E3 !default;\n$s-60: #A9CFCF !default;\n$s-70: #95BABA !default;\n$s-80: #80A6A6 !default;\n$s-90: #6E9191 !default;\n$s-100: #627A7A !default;\n$s-110: #5D7070 !default;\n$s-120: #546666 !default;\n$s-130: #4C5C5C !default;\n$s-140: #425252 !default;\n$s-150: #384949 !default;\n$s-160: #2D3A3A !default;\n$s-170: #232B2B !default;\n$s-180: #191D1D !default;\n$s-190: #0B0F0F !default;\n$s-200: $black !default;\n\n// Purple\n$p-0: $white !default;\n$p-10: #FDFAFF !default;\n$p-20: #FCF2FF !default;\n$p-30: #F9EBFF !default;\n$p-40: #F4DEFC !default;\n$p-50: #EDD2F7 !default;\n$p-60: #DEBCEB !default;\n$p-70: #CBA6D9 !default;\n$p-80: #B693C4 !default;\n$p-90: #A17EB0 !default;\n$p-100: #8B6A99 !default;\n$p-110: #80618C !default;\n$p-120: #745880 !default;\n$p-130: #695073 !default;\n$p-140: #5D4766 !default;\n$p-150: #533E5C !default;\n$p-160: #43314A !default;\n$p-170: #302634 !default;\n$p-180: #221926 !default;\n$p-190: #100D12 !default;\n$p-200: $black !default;\n\n// Mauve\n$m-0: $white !default;\n$m-10: #FFFAFB !default;\n$m-20: #FFF2F5 !default;\n$m-30: #FFEBEF !default;\n$m-40: #FCDEE5 !default;\n$m-50: #F7D2DB !default;\n$m-60: #EBBCC6 !default;\n$m-70: #D6A7B1 !default;\n$m-80: #C4919C !default;\n$m-90: #B37B87 !default;\n$m-100: #A16572 !default;\n$m-110: #965C68 !default;\n$m-120: #8A535E !default;\n$m-130: #814854 !default;\n$m-140: #73404B !default;\n$m-150: #663842 !default;\n$m-160: #4F2E35 !default;\n$m-170: #3B2229 !default;\n$m-180: #29171B !default;\n$m-190: #150C0E !default;\n$m-200: $black !default;\n\n// Red\n$r-0: $white !default;\n$r-10: #FFFAFA !default;\n$r-20: #FEF2F1 !default;\n$r-30: #FEEAE7 !default;\n$r-40: #FFE0DB !default;\n$r-50: #FDD3CD !default;\n$r-60: #FFB6AB !default;\n$r-70: #FF9687 !default;\n$r-80: #FF745E !default;\n$r-90: #F2543D !default;\n$r-100: #CF4732 !default;\n$r-110: #BD4533 !default;\n$r-120: #AB3E2D !default;\n$r-130: #9C3728 !default;\n$r-140: #8A3225 !default;\n$r-150: #7A2C22 !default;\n$r-160: #61241C !default;\n$r-170: #471B16 !default;\n$r-180: #33120F !default;\n$r-190: #1C0807 !default;\n$r-200: $black !default;\n\n// Orange\n$o-0: $white !default;\n$o-10: #FFFBF7 !default;\n$o-20: #FFF2E8 !default;\n$o-30: #FFECDE !default;\n$o-40: #FFE0C9 !default;\n$o-50: #FFD4B5 !default;\n$o-60: #FBB98A !default;\n$o-70: #FF9A52 !default;\n$o-80: #FA7A1E !default;\n$o-90: #E36409 !default;\n$o-100: #C45302 !default;\n$o-110: #B54C02 !default;\n$o-120: #A24808 !default;\n$o-130: #91420A !default;\n$o-140: #823A06 !default;\n$o-150: #753202 !default;\n$o-160: #5C2905 !default;\n$o-170: #451F04 !default;\n$o-180: #2F1604 !default;\n$o-190: #170E07 !default;\n$o-200: $black !default;\n\n// Yellow\n$y-0: $white !default;\n$y-10: #FEFBF4 !default;\n$y-20: #FDF4DF !default;\n$y-30: #FCEDCA !default;\n$y-40: #FCE3A7 !default;\n$y-50: #FCD881 !default;\n$y-60: #F5C149 !default;\n$y-70: #E6A91B !default;\n$y-80: #D09408 !default;\n$y-90: #B97F02 !default;\n$y-100: #9E6C03 !default;\n$y-110: #916405 !default;\n$y-120: #855B03 !default;\n$y-130: #785100 !default;\n$y-140: #6B4801 !default;\n$y-150: #5E4002 !default;\n$y-160: #4A3301 !default;\n$y-170: #392600 !default;\n$y-180: #261B04 !default;\n$y-190: #140F03 !default;\n$y-200: $black !default;\n\n// Neutral (Lighter)\n// $neutral-10: $n-10 !default;\n// $neutral-20: $n-20 !default;\n// $neutral-30: $n-30 !default;\n// $neutral-40: $n-40 !default;\n// $neutral-50: $n-50 !default;\n// $neutral-60: $n-60 !default;\n// $neutral-70: $n-70 !default;\n// $neutral-80: $n-80 !default;\n// $neutral-90: $n-90 !default;\n// $neutral-100: $n-100 !default;\n\n// // Neautral (Darker)\n// $neutral-110: $n-110 !default;\n// $neutral-120: $n-120 !default;\n// $neutral-130: $n-130 !default;\n// $neutral-140: $n-140 !default;\n// $neutral-150: $n-150 !default;\n// $neutral-160: $n-160 !default;\n// $neutral-170: $n-170 !default;\n// $neutral-180: $n-180 !default;\n// $neutral-190: $n-190 !default;\n// $neutral-200: $n-200 !default;\n\n// Neutral (Lighter)\n// $neutral-10: $white !default; //#FFFFFF\n// $neutral-20: $n-10 !default; //#FCFBFA\n// $neutral-30: $n-20 !default; //#F7F5F3\n// $neutral-40: $n-30 !default; //#F1EFED\n// $neutral-50: #ECE9E6 !default; //#ECE9E6\n// $neutral-60: #E6E3E0 !default; //#E6E3E0\n// $neutral-70: #DFDCD8 !default; //#DFDCD8\n// $neutral-80: #D9D4D0 !default; //#D9D4D0\n// $neutral-90: #D2CDC7 !default ;//#D2CDC7\n// $neutral-100: #CBC5BF !default; //#CBC5BF\n\n// // Neautral (Darker)\n// $neutral-110: #A8A29B !default;\n// $neutral-120: #8B8580 !default;\n// $neutral-130: #79726D !default;\n// $neutral-140: #67605B !default;\n// $neutral-150: #56504B !default;\n// $neutral-160: $n-160 !default; //#403C38\n// $neutral-170: $n-170 !default; //#312D2A\n// $neutral-180: $n-180 !default; //#211E1C\n// $neutral-190: $n-190 !default; //#100F0E\n// $neutral-200: $black !default; //#000000\n\n// Neutral (Lighter)\n$neutral-10: #FFFFFF !default;\n$neutral-20: #FCFBFA !default; // UI Light\n$neutral-30: #F7F5F3 !default;\n$neutral-40: #F1EFED !default;\n$neutral-50: #ECE9E6 !default;\n$neutral-60: #E6E3E0 !default;\n$neutral-70: #DFDCD8 !default;\n$neutral-80: #D9D4D0 !default;\n$neutral-90: #D2CDC7 !default;\n$neutral-100: #CBC5BF !default;\n\n// Neautral (Darker)\n$neutral-110: #A8A29B !default;\n$neutral-120: #8B8580 !default;\n$neutral-130: #79726D !default;\n$neutral-140: #67605B !default;\n$neutral-150: #56504B !default;\n$neutral-160: #403C38 !default;\n$neutral-170: #312D2A !default; // UI Dark\n$neutral-180: #211E1C !default;\n$neutral-190: #100F0E !default;\n$neutral-200: #000000 !default;\n\n// Beige\n$beige-10: #F5EFDF !default;\n$beige-20: #EDE5CF !default;\n$beige-30: #E5DBBE !default;\n$beige-40: #D0C7AC !default;\n$beige-50: #BEB397 !default;\n$beige-60: #A79F88 !default;\n$beige-70: #928B76 !default;\n$beige-80: #7D7764 !default;\n$beige-90: #696352 !default;\n$beige-100: #544F40 !default;\n\n// Blue\n$blue-10: #D1E6ED !default;\n$blue-20: #AECCD4 !default;\n$blue-30: #8CB2BB !default;\n$blue-40: #6A97A3 !default;\n$blue-50: #477D8A !default;\n$blue-60: #41727E !default;\n$blue-70: #376673 !default;\n$blue-80: #2C5967 !default;\n$blue-90: #274F5B !default;\n$blue-100: #22444F !default;\n\n// Forest Green\n$forestgreen-10: #D5F5E2 !default;\n$forestgreen-20: #B4DFC6 !default;\n$forestgreen-30: #94C8AA !default;\n$forestgreen-40: #74B28E !default;\n$forestgreen-50: #539B72 !default;\n$forestgreen-60: #3D8C5F !default;\n$forestgreen-70: #377E55 !default;\n$forestgreen-80: #31704C !default;\n$forestgreen-90: #2B6242 !default;\n$forestgreen-100: #255439 !default;\n\n// Green\n$green-10: #E0F5DA !default;\n$green-20: #C5DFBE !default;\n$green-30: #ABC9A3 !default;\n$green-40: #90B288 !default;\n$green-50: #759C6C !default;\n$green-60: #6B8F63 !default;\n$green-70: #61815A !default;\n$green-80: #577450 !default;\n$green-90: #4D6647 !default;\n$green-100: #43593E !default;\n\n// Mauve\n$mauve-10: #FAD4DD !default;\n$mauve-20: #EBBAC5 !default;\n$mauve-30: #DB9FAE !default;\n$mauve-40: #CC8596 !default;\n$mauve-50: #BC6A7E !default;\n$mauve-60: #A95E70 !default;\n$mauve-70: #965262 !default;\n$mauve-80: #844655 !default;\n$mauve-90: #713A47 !default;\n$mauve-100: #5E2E39 !default;\n\n// Orange\n$orange-10: #FFE9CF !default;\n$orange-20: #F9DAB1 !default;\n$orange-30: #F3CB94 !default;\n$orange-40: #ECBB76 !default;\n$orange-50: #E6AC58 !default;\n$orange-60: #D8974D !default;\n$orange-70: #CA8142 !default;\n$orange-80: #BC6C37 !default;\n$orange-90: #AE562C !default;\n$orange-100: #9E4F28 !default;\n\n// Purple\n$purple-10: #F2DFFA !default;\n$purple-20: #D9C2E2 !default;\n$purple-30: #C0A5CB !default;\n$purple-40: #A687B3 !default;\n$purple-50: #8D6A9B !default;\n$purple-60: #7E5E8A !default;\n$purple-70: #6E5279 !default;\n$purple-80: #5F4669 !default;\n$purple-90: #4F3A58 !default;\n$purple-100: #402E47 !default;\n\n// Red\n$red-10: #FFD9D4 !default;\n$red-20: #F8B7AE !default;\n$red-30: #F19588 !default;\n$red-40: #EA7362 !default;\n$red-50: #E3513C !default;\n$red-60: #D64C38 !default;\n$red-70: #C74634 !default;\n$red-80: #B54030 !default;\n$red-90: #A33B2C !default;\n$red-100: #913528 !default;\n\n// Slate\n$slate-10: #E3F2F2 !default;\n$slate-20: #CFE1E1 !default;\n$slate-30: #BBD1D1 !default;\n$slate-40: #A8C0C0 !default;\n$slate-50: #94AFAF !default;\n$slate-60: #869E9E !default;\n$slate-70: #778D8D !default;\n$slate-80: #697B7B !default;\n$slate-90: #5A6A6A !default;\n$slate-100: #4C5959 !default;\n\n// Teal\n$teal-10: #D1F0EF !default;\n$teal-20: #AED7D5 !default;\n$teal-30: #8CBEBC !default;\n$teal-40: #6AA5A3 !default;\n$teal-50: #478C89 !default;\n$teal-60: #41817E !default;\n$teal-70: #387575 !default;\n$teal-80: #2E686C !default;\n$teal-90: #295B5F !default;\n$teal-100: #234E52 !default;\n\n// Yellow\n$yellow-10: #FFF8E3 !default;\n$yellow-20: #FEEDC3 !default;\n$yellow-30: #FCE3A3 !default;\n$yellow-40: #FBD882 !default;\n$yellow-50: #FACD62 !default;\n$yellow-60: #E5B757 !default;\n$yellow-70: #CFA14D !default;\n$yellow-80: #BA8C42 !default;\n$yellow-90: #A47638 !default;\n$yellow-100: #8F602D !default;\n\n\n$branding: $red-70 !default;\n$branding-fg: $red-10 !default;\n$accent: $orange-90 !default;\n$accent-fg: $orange-10 !default;\n$primary: $forestgreen-70 !default;\n$primary-fg: $neutral-20 !default;\n$primary-darker: $forestgreen-80 !default;\n$primary-darker-fg: $neutral-10 !default;\n$primary-lighter: $forestgreen-60 !default;\n$primary-lighter-fg: $neutral-10 !default;\n\n// Outline Styles\n$outline-offset: 2px !default;\n$outline-width: 2px !default;\n$outline-style: dotted !default;\n$outline-color: $primary !default; // Default\n\n/* ==========================================================================\n   Theme Configuration File\n   ========================================================================== */\n\n/**\n * Images\n */\n$_img-suffix:                   '' !default;\n\n/**\n * Base Colors\n *\n * Description:\n * Provides a base for the UI.\n *\n * Usage:\n * General UI Background, Region Headers, Buttons\n */\n\n$_base-dark-bg:                 #E4E4E4 !default;\n$_base_dark_bright_bg:          #ECECEC !default;\n$_base_dark_dark_bg:            #D0D0D0 !default;\n$_base-dark-border:             #BBBBBB !default;\n$_base-dark-text:               #222222 !default;\n\n$_base_light_dark_bg:           #F2F2F2 !default;\n$_base_light_border:            #C3C3C3 !default;\n\n$_base:                         #333 !default;\n$_base-bg:                      #fff !default;\n\n$_base-tint:                    white;\n$_base-tint-percentage:         0%;\n\n$_active:                       $green-50 !default;\n$_active-fg:                    $neutral-20 !default;\n\n// $_base-shade-0:                 $_base-bg !default;\n// $_base-shade-1:                 mix($_base, $_base-bg, 2.5%) !default; // #f9f9f9\n// $_base-shade-2:                 mix($_base, $_base-bg, 6%) !default; // #f0f0f0\n// $_base-shade-3:                 mix($_base, $_base-bg, 12%) !default; // #e0e0e0\n// $_base-shade-4:                 mix($_base, $_base-bg, 18%) !default; // #d1d1d1\n// $_base-shade-5:                 mix($_base, $_base-bg, 37%) !default; // #a0a0a0\n// $_base-shade-6:                 mix($_base, $_base-bg, 56%) !default; // #707070\n// $_base-shade-7:                 mix($_base, $_base-bg, 60%) !default; // #666\n// $_base-shade-8:                 mix($_base, $_base-bg, 75%) !default; // #404040\n// $_base-shade-9:                 mix($_base, $_base-bg, 85%) !default; // #212121\n// $_base-shade-10:                $_base !default;\n\n$_base-shade-0:                 mix($_base-tint, $_base-bg, $_base-tint-percentage);\n$_base-shade-1:                 mix($_base-tint, mix($_base, $_base-bg, 2.5%), $_base-tint-percentage); // #f9f9f9\n$_base-shade-2:                 mix($_base-tint, mix($_base, $_base-bg, 6%), $_base-tint-percentage); // #f0f0f0\n$_base-shade-3:                 mix($_base-tint, mix($_base, $_base-bg, 12%), $_base-tint-percentage); // #e0e0e0\n$_base-shade-4:                 mix($_base-tint, mix($_base, $_base-bg, 18%), $_base-tint-percentage); // #d1d1d1\n$_base-shade-5:                 mix($_base-tint, mix($_base, $_base-bg, 37%), $_base-tint-percentage); // #a0a0a0\n$_base-shade-6:                 mix($_base-tint, mix($_base, $_base-bg, 56%), $_base-tint-percentage); // #707070\n$_base-shade-7:                 mix($_base-tint, mix($_base, $_base-bg, 60%), $_base-tint-percentage); // #666\n$_base-shade-8:                 mix($_base-tint, mix($_base, $_base-bg, 75%), $_base-tint-percentage); // #404040\n$_base-shade-9:                 mix($_base-tint, mix($_base, $_base-bg, 85%), $_base-tint-percentage); // #212121\n$_base-shade-10:                mix($_base-tint, $_base, $_base-tint-percentage);\n\n$_base-alpha-0:                 rgba($_base,0) !default;\n$_base-alpha-1:                 rgba($_base,.05) !default;\n$_base-alpha-2:                 rgba($_base,.1) !default;\n$_base-alpha-3:                 rgba($_base,.15) !default;\n$_base-alpha-4:                 rgba($_base,.2) !default;\n$_base-alpha-5:                 rgba($_base,.25) !default;\n$_base-alpha-6:                 rgba($_base,.5) !default;\n$_base-alpha-7:                 rgba($_base,.65) !default;\n$_base-alpha-8:                 rgba($_base,.75) !default;\n$_base-alpha-9:                 rgba($_base,.95) !default;\n$_base-alpha-10:                rgba($_base,1) !default;\n\n$_base-bg-alpha-0:              rgba($_base-bg,0) !default;\n$_base-bg-alpha-1:              rgba($_base-bg,.05) !default;\n$_base-bg-alpha-2:              rgba($_base-bg,.1) !default;\n$_base-bg-alpha-3:              rgba($_base-bg,.15) !default;\n$_base-bg-alpha-4:              rgba($_base-bg,.2) !default;\n$_base-bg-alpha-5:              rgba($_base-bg,.25) !default;\n$_base-bg-alpha-6:              rgba($_base-bg,.5) !default;\n$_base-bg-alpha-7:              rgba($_base-bg,.65) !default;\n$_base-bg-alpha-8:              rgba($_base-bg,.75) !default;\n$_base-bg-alpha-9:              rgba($_base-bg,.95) !default;\n$_base-bg-alpha-10:             rgba($_base-bg,1) !default;\n\n$_base-shadow-0:                rgba(#000,0) !default;\n$_base-shadow-1:                rgba(#000,.05) !default;\n$_base-shadow-2:                rgba(#000,.1) !default;\n$_base-shadow-3:                rgba(#000,.15) !default;\n$_base-shadow-4:                rgba(#000,.2) !default;\n$_base-shadow-5:                rgba(#000,.25) !default;\n$_base-shadow-6:                rgba(#000,.5) !default;\n$_base-shadow-7:                rgba(#000,.65) !default;\n$_base-shadow-8:                rgba(#000,.75) !default;\n$_base-shadow-9:                rgba(#000,.95) !default;\n$_base-shadow-10:               rgba(#000,1) !default;\n\n$_brand-oracle:                 $branding !default;\n$_brand-facebook:               #3b5998 !default;\n$_brand-twitter:                #1da1f2 !default;\n$_brand-gplus:                  #dd4b39 !default;\n$_brand-youtube:                #ff0000 !default;\n$_brand-linkedin:               #0077b5 !default;\n\n/**\n * Highlight Colors\n *\n * Description:\n * Used for providing emphasis or importance to UI components.\n *\n * Usage:\n * Region Headers, Primary / Hot Buttons\n */\n$_highlight-bg:                 #CFE6FA !default; //#D6E6F7; //#DFEBFB;\n$_highlight-bright-bg:          #DEEFFB !default; //#DBEDFA; //#E5EEFB;\n$_highlight-dark-bg:            #7FBEF2 !default; //#A6D2F4; //#C8D2E0;\n$_highlight-border:             #AFBEC8 !default; //#9EA9B7;\n$_highlight-text:               #404040 !default;\n\n$_dark-highlight-bg:            #0572CE !default; //#3182D8; //#2E6FB0\n$_dark-highlight-bright-bg:     #1E80D2 !default; //#588BBF\n$_dark-highlight-dark-bg:       #0466B8 !default; //#25598C\n$_dark-highlight-border:        #0466B8 !default; //#225384;\n$_dark-highlight-text:          #fff !default;\n\n/**\n * Accent and Status Colors\n *\n * Description:\n * Used for indicating state-based UI components, status, or accents.\n *\n * Usage:\n * Warnings, Errors, Danger Text, Success, Focus\n */\n\n$_alert-bg:                 $yellow-10 !default;\n$_alert-success-bg:         $green-10 !default;\n$_alert-danger-bg:          $red-10 !default;\n$_alert-info-bg:            $blue-10 !default;\n$_alert-icon:               $yellow-50 !default;\n$_alert-success-icon:       $green-50 !default;\n$_alert-danger-icon:        $red-50 !default;\n$_alert-info-icon:          $blue-50 !default;\n\n$_alert-page-success-bg:    rgba($green-80, .95) !default;\n$_alert-page-error-bg:      rgba($red-70, .95) !default;\n\n$_text-success:             $forestgreen-40 !default;\n$_text-danger:              $red-70 !default;\n\n// $_danger:                   $_base-bg !default;\n$_danger:                   $red-10 !default;\n$_danger-bg:                $red-70 !default;\n$_danger-border:            $red-30 !default;\n\n$_error-bg:                 $red-10 !default;\n$_error-text:               $neutral-190 !default;\n$_error-icon:               $red-50 !default;\n$_error-border:             $red-50 !default;\n$_error-dim-border:         $red-40 !default;\n$_error-shadow:             $red-20 !default;\n\n$_warning-bg:               $yellow-10 !default;\n$_warning-dim-bg:           $yellow-20 !default;\n$_warning-text:             $neutral-190 !default;\n$_warning-icon:             $yellow-50 !default;\n$_warning-border:           $yellow-50 !default;\n$_warning-dim-border:       $yellow-40 !default;\n$_warning-shadow:           $yellow-20 !default;\n\n$_focus-shadow:             $primary !default; //#4696FC;\n$_focus-danger-shadow:      $red-50 !default;\n$_focus-warning-shadow:     $yellow-50 !default;\n\n$_active-bg:                #759C6C !default; //#3182D8;\n$_active-dark-bg:           #61815A !default;\n\n$_button-active-bg:         #E8E8E8 !default;\n$_button-pressed-bg:        #E0E0E0 !default;\n\n/**\n * Application Based Colors\n *\n * Description:\n * Used for applications within APEX development\n */\n\n$_apex-app-builder:             $blue-50 !default;\n$_apex-sql-workshop:            $forestgreen-50 !default;\n$_apex-team-dev:                $orange-50 !default;\n$_apex-pkg-apps:                $red-50 !default;\n$_apex-instance-admin:          $slate-50 !default;\n$_apex-workspace-admin:         $slate-50 !default;\n\n\n\n$_colors: #5856D6, #007aff, #34aadc, #5ac8fa, #4cd964, #ff2d55, #ff3b30, #ff9500, #ffcc00, #8e8e93,\n          mix(#fff, #5856D6, 20%), mix(#fff, #007aff, 20%), mix(#fff, #34aadc, 20%), mix(#fff, #5ac8fa, 20%), mix(#fff, #4cd964, 20%), mix(#fff, #ff2d55, 20%), mix(#fff, #ff3b30, 20%), mix(#fff, #ff9500, 20%), mix(#fff, #ffcc00, 20%), mix(#fff, #8e8e93, 20%),\n          mix(#000, #5856D6, 10%), mix(#000, #007aff, 10%), mix(#000, #34aadc, 10%), mix(#000, #5ac8fa, 10%), mix(#000, #4cd964, 10%), mix(#000, #ff2d55, 10%), mix(#000, #ff3b30, 10%), mix(#000, #ff9500, 10%), mix(#000, #ffcc00, 10%), mix(#000, #8e8e93, 10%);\n\n\n$_propertyGroup-focus__bg:      rgba($green-10, .3) !default;\n","@import \"themeConfig\";\n\n// ***************\n// Theme Variables\n// ***************\n\n$Property--is-error-field__text:                                  $red-70 !default;\n$Property--is-error-icon__text:                                  $red-70 !important !default;\n$Property--is-warning-icon__text:                                $orange-60 !important !default;\n$Property-checkbox-label__text:                                  rgba($neutral-190, .8) !default;\n$Property-field__bg:                                              $neutral-20 !default;\n$Property-field__text:                                            $neutral-190 !default;\n$Property-field__border:                                          $neutral-60 !default;\n$Property-field__shadow:                                          0 1px 2px $_base-shadow-2 !default;\n$Property-field-hover__bg:                                        $neutral-10 !default;\n$Property-field-hover__shadow:                                      0 1px 2px $_base-shadow-2 !default;\n$Property-field-focus__outline-c:                                 $primary !default;\n$Property-field-focus__bg:                                        $neutral-10 !default;\n$Property-field-focus__shadow:                                    0 1px 2px $_base-shadow-2 !default;\n$Property-field-is-error-focus__shadow:                           0 0 0 1px $_error-border inset, 0 1px 2px $_base-alpha-2 !default;\n$Property-field-is-shadow-focus__shadow:                          0 0 0 1px $_error-border inset, 0 1px 2px $_base-alpha-2 !default;\n$Property-is-variable-icon__text:                                $_highlight-dark-bg !default;\n$Property-is-variable-field__shadow:                              0 0 0 1px rgba($_highlight-dark-bg, 0.5) inset !default;\n$Property-is-variable-field__bg:                                  lighten($_highlight-dark-bg, 25%) !default;\n$Property-is-warning-field--textarea-focus:                       $_warning-border !important !default;\n$Property-is-error-field--textarea-focus:                         $_error-border !default;\n$Property-readOnly__text:                                        $_base-alpha-7 !default;\n$Property-field--readOnly-focus__bg:                              $_base-shadow-2 !default;\n$Property-buttonContainer__bg:                                   $neutral-10 !default;\n$Property-checkbox-input-radio__bg:                              $neutral-10 !default;\n$Property-checkbox-input-radio__border:                          $neutral-70 !default;\n$Property-checkbox-input-radio-focus__border:                    $primary !default;\n$Property-checkbox-input-radio-focus__shadow:                    $_base-shadow-2 0 1px 1px !default;\n$Property-checkbox-input-radio-focus-checked__border:            $primary !default;\n$Property-checkbox-input-radio-focus-checked__bg:                $primary !default;\n$Property-checkbox-input-checked-before__border:                 $neutral-140 !default;\n$Property-checkbox-input-checked-before__bg:                     $neutral-140 !default;\n$Property-checkbox-input-checked-after__bg:                      $primary-fg !default;\n$Property-radio-input__border-c:                                 rgba($neutral-190, .6) !default;\n$Property-radio-input__bg:                                       rgba($neutral-190, .6) !default;\n$Property-radioGroup--buttonSet-radio-input-checked__bg:         $neutral-70 !default;\n$Property-radioGroup--buttonSet-radio-input-checked__shadow:     0 0 0 1px $_base-shadow-2 inset, 0 2px 1px $_base-shadow-1 inset !default;\n$Property-radioGroup--buttonSet-radio-input-focus__shadow:       0 0 0 1px $Property-field_focus__shadow inset, 0 1px 2px $_base-shadow-2 !default;\n$Property-radioGroup--buttonSet-radio-input-focus__border:       $Property-field_focus__shadow !important !default;\n$Property-radioGroup--buttonSet-radio-input-focus__bg:           $neutral-70 !default;\n$Property-radioGroup--buttonSet-radio-input-not-checked__shadow: 0 0 0 1px $_base-shadow-3 inset, 0 1px 2px $_base-shadow-2 !default;\n$Property-radioGroup--buttonSet-radio-input-hover__shadow:       0 0 0 1px $Property-field_focus__shadow inset, 0 1px 2px $_base-shadow-2 !default;\n$Property-radioGroup--buttonSet-radio-input-hover__bg:           $neutral-60 !default;\n$Property-colorPreview__shadow:                                  0 0 0 1px $_base-shadow-2 inset !default;\n$Property-is-changed-labelContainer__bg:                         $primary !default;\n\n$Property--is-active__bg:                                        $blue-10 !default;\n$Property--is-focused__shadow:                                   $primary !default;\n$Property--is-focused__border:                                   $primary !default;\n\n$Property--is-error__bg:                                         $_error-bg !default;\n$Property--is-error__border:                                     $_error-border !default;\n$Property--is-error-label__text:                                 $_error-text !default;\n$Property--is-error--is-focused__shadow:                         $_error-shadow !default;\n\n$Property--is-warning__bg:                                       $_warning-bg !default;\n$Property--is-warning__border:                                   $_warning-border !default;\n$Property--is-warning-label__text:                               $_warning-text !default;\n$Property--is-warning--is-focused__shadow:                       $_warning-shadow !default;\n\n$Property-label__text:                                           $neutral-190 !default;\n\n$Property-field_focus__shadow:                                    $primary !default;\n$Property-field--select__border:                                  $_base-dark-border !default;\n\n$dialog-property__border:                                        $neutral-60 !default;\n\n$isVariableColor:                                                $_highlight-dark-bg !default;\n$isVariableLabelColor:                                           $blue-70 !default;\n\n$propertyGroup-focus__bg:                                        $_propertyGroup-focus__bg !default;\n\n/******************************************************************************\nProperties\n******************************************************************************/\n\n/******************************************************************************\nProperty Error\n******************************************************************************/\n.a-Property.is-error {\n  /* Make the text red when it is not focused to bring more attention */\n\n  .a-Property-label {\n    color: $Property--is-error-label__text;\n  }\n\n  .a-Property-field:not(:focus) {\n    color: $Property--is-error-field__text;\n  }\n\n  .icon-error {\n    color: $Property--is-error-icon__text;\n  }\n}\n\n/******************************************************************************\nProperty Warning\n******************************************************************************/\n.a-Property.is-warning {\n  .a-Property-label {\n    color: $Property--is-warning-label__text;\n  }\n\n  .icon-warning {\n    color: $Property--is-warning-icon__text;\n  }\n}\n\n/******************************************************************************\nLabel and Pre / Post Text\n******************************************************************************/\n.a-Property-label,\n.a-Property-setItemsHeader-header,\n.a-Property-unit {\n  color: $Property-label__text;\n}\n\n.a-Property-checkbox-label,\n.a-Property-radio {\n  color: $Property-checkbox-label__text;\n}\n\n/******************************************************************************\nProperty Field - Used for property editor\n******************************************************************************/\n.a-Property-field {\n  background-color: $Property-field__bg;\n  color: $Property-field__text;\n  border-color: $Property-field__border;\n  box-shadow: $Property-field__shadow;\n\n  &:hover {\n    background-color: $Property-field-hover__bg;\n    box-shadow: $Property-field-hover__shadow;\n  }\n\n  &:focus {\n    outline-color: $Property-field-focus__outline-c;\n    // border-color: $primary;\n    background-color: $Property-field-focus__bg;\n    box-shadow: $Property-field-focus__shadow;\n    outline-offset: $outline-offset;\n    outline-width: $outline-width;\n    outline-style: $outline-style;\n  }\n}\n\n.a-Property-field:not(.a-Property-field--textarea) {\n  .a-Property.is-error.is-active &:focus {\n    box-shadow: $Property-field-is-error-focus__shadow;\n  }\n\n  .a-Property.is-shadow.is-active &:focus {\n    box-shadow: $Property-field-is-shadow-focus__shadow;\n  }\n}\n\n// When multiple components are selected, fields with variable information are shown with the following background color\n.a-Property.is-variable {\n  .a-Icon.icon-variable {\n    color: $Property-is-variable-icon__text;\n  }\n\n  .a-Property-field {\n    box-shadow: $Property-is-variable-field__shadow;\n    background-color: $Property-is-variable-field__bg;\n  }\n}\n\n// Focus color changes when it is in a warning or error property\n.a-Property.is-warning .a-Property-field--textarea:focus {\n  border-color: $Property-is-warning-field--textarea-focus;\n}\n\n.a-Property.is-error .a-Property-field--textarea:focus {\n  border-color: $Property-is-error-field--textarea-focus !important;\n}\n\n/* Property Editor Select List\n   ========================================================================== */\n.a-Property-field--select {\n  // color: inherit;\n}\n\n/* Text Area\n   ========================================================================== */\n.a-Property-field--textarea,\nbody .ui-widget .a-Property-field--textarea {\n  // border-color: $neutral-60;\n  // background-color: $_base-shade-0;\n}\n\n.a-Property-readOnly {\n  color: $Property-readOnly__text;\n}\n\n.a-Property-field--readOnly {\n  box-shadow: none !important;\n  background-color: transparent !important;\n\n  &:focus {\n    border-color: $Property-field--readOnly-focus__bg;\n    // box-shadow: 0 0 0 1px $_base-shadow-2 inset !important;\n  }\n}\n\n/******************************************************************************\nProperty Editor Buttons\n******************************************************************************/\n.a-Property-buttonContainer .a-Button {\n  background-color: $Property-buttonContainer__bg;\n}\n\n/******************************************************************************\nCheckbox + Radio Buttons\n******************************************************************************/\n.a-Property-checkbox-input[type=\"checkbox\"],\n.a-Property-radio-input[type=\"radio\"] {\n  & + label {\n    &:before {\n      background-color: $Property-checkbox-input-radio__bg;\n      border-color: $Property-checkbox-input-radio__border;\n    }\n\n    &:after {\n      color: $Property-checkbox-input-checked-after__bg;\n    }\n  }\n\n  /* Focus\n   ========================================================================== */\n  &:focus + label:before,\n  &:indeterminate + label:before {\n    border-color: $Property-checkbox-input-radio-focus__border;\n    box-shadow: $Property-checkbox-input-radio-focus__shadow;\n  }\n\n  &:focus:checked + label:before,\n  &:focus:indeterminate + label:before {\n    border-color: $Property-checkbox-input-radio-focus-checked__border;\n    background-color: $Property-checkbox-input-radio-focus-checked__bg;\n  }\n}\n\n\n/******************************************************************************\nCheckbox Specific\n******************************************************************************/\n.a-Property-checkbox-input[type=\"checkbox\"] {\n\n  &:indeterminate,\n  &:checked {\n    & + label:before {\n      border-color: $Property-checkbox-input-checked-before__border;\n      background-color: $Property-checkbox-input-checked-before__bg;\n    }\n  }\n\n  &:indeterminate {\n    & + label:after {\n      background-color: $Property-checkbox-input-checked-after__bg;\n    }\n  }\n\n  &:checked {\n    & + label:after {\n      // background-image: url('../img/ui/checkbox-checked#{$_img-suffix}.svg');\n    }\n  }\n}\n\n/******************************************************************************\nRadio Specific\n******************************************************************************/\n.a-Property-radio-input[type=\"radio\"] {\n  &:checked {\n    & + label:before {\n      border-color: $Property-radio-input__border-c;\n      background-color: $Property-radio-input__bg;\n    }\n  }\n}\n\n\n\n/******************************************************************************\nYes / No Buttons\n******************************************************************************/\n.a-Property-radioGroup--buttonSet {\n  .a-Property-radio-input {\n\n    /* Checked */\n    &:checked + label {\n      background-color: $Property-radioGroup--buttonSet-radio-input-checked__bg;\n      box-shadow: $Property-radioGroup--buttonSet-radio-input-checked__shadow;\n    }\n\n    /* Focused */\n    &:focus + label {\n      border-color: $Property-radioGroup--buttonSet-radio-input-focus__border;\n      background-color: $Property-radioGroup--buttonSet-radio-input-focus__bg;\n      box-shadow: $Property-radioGroup--buttonSet-radio-input-focus__shadow;\n    }\n\n    &:not(:checked):hover + label {\n      box-shadow: $Property-radioGroup--buttonSet-radio-input-not-checked__shadow;\n    }\n\n    &:hover:active + label {\n      box-shadow: $Property-radioGroup--buttonSet-radio-input-hover__shadow;\n      background-color: $Property-radioGroup--buttonSet-radio-input-hover__bg;\n    }\n  }\n}\n\n\n.a-Property-colorPreview {\n  box-shadow: $Property-colorPreview__shadow;\n}\n\n.a-Property.is-changed {\n  .a-Property-labelContainer:before {\n    background-color: $Property-is-changed-labelContainer__bg;\n  }\n}\n","@import \"themeConfig\";\n\n// ***************\n// Theme Variables\n// ***************\n\n$propertyGroup__bg:                           $neutral-30 !default;\n$propertyGroup__border:                       $neutral-60 !default;\n$propertyGroup-property__border:              $neutral-60 !default;\n$propertyGroup-header__bg:                    mix($_base, $_base-shade-0, 4%) !default;\n$propertyGroup-title__text:                   $neutral-190 !default;\n$propertyGroup-title-badge__bg:               $_danger-bg !default;\n$propertyGroup-title-badge__text:             $_danger !default;\n$propertyGroup-accordion-active__shadow:      $primary !default;\n\n$PropertyHighlight__bg:                       $yellow-20 !default;\n\n$PropertyEditor__bg:                          $neutral-60 !default;\n$_propertyGroup-focus__bg:                    rgba($green-10, .3) !default;\n$PropertyEditor-propertyGroup-header__text:   $neutral-20 !default;\n$PropertyEditor-propertyGroup-header__bg:     $neutral-110 !default;\n$PropertyEditor-propertyGroup-header__shadow: $_base-alpha-2 !default;\n$PropertyEditor-message__text:                rgba($neutral-190, .6) !default;\n$PropertyEditor-messageText__text:            rgba($neutral-190, .8) !default;\n$PropertyEditor-filter__text:                  $neutral-190 !default;\n$Property-field-focus__text:                   $primary !default;\n$Button--stickyFilter-hover_text:             $accent !default;\n$Button--stickyFilter-hover__bg:              #fff !default;\n$Button--stickyFilter-is-active__text:        $neutral-10 !default;\n$Button--stickyFilter-is-active__bg:          $yellow-50 !default;\n$Button--stickyFilter-focus-active__bg:       $yellow-50 !default;\n$Button--stickyFilter-focus-active__text:     $neutral-10 !default;\n$Button--stickyFilter-focus-active__shadow:   0 0 0 1px $primary inset !default;\n// $Property-field__bg:                           $neutral-10 !default;\n$Property-field__shadow:                       0 1px 2px $_base-shadow-2 !default;\n$Property-field-icon__text:                    $primary !default;\n$PropertyHighlight__shadow:                   0 1px 1px -1px $_base-alpha-2 !default;\n$Property-notFound__text:                     rgba($neutral-190, .6) !default;\n\n/* ==========================================================================\n   Property Editor\n   ========================================================================== */\n\n.a-PropertyEditor {\n  background-color: $PropertyEditor__bg;\n}\n\n.ui-dialog .a-PropertyEditor {\n  background-color: transparent;\n}\n\n/* Property Editor Groups\n   ========================================================================== */\n.a-PropertyEditor-propertyGroup,\n.a-PropertyEditor-propertyGroup-header,\n.a-PropertyEditor-propertyGroup-body {\n  border-color: $propertyGroup__border;\n}\n\n.a-PropertyEditor-propertyGroup {\n\n  background-color: $propertyGroup__bg;\n\n  &:focus-within,\n  &.has-focus {\n    background-color: $_propertyGroup-focus__bg;\n  }\n}\n\n.a-PropertyEditor-propertyGroup-header .a-Icon {\n  color: $PropertyEditor-propertyGroup-header__text;\n  background-color: $PropertyEditor-propertyGroup-header__bg;\n}\n\n.a-PropertyEditor-propertyGroup-title {\n  color: $propertyGroup-title__text;\n}\n\n.a-PropertyEditor-propertyGroup-body {\n  .a-Property {\n    border-color: $propertyGroup-property__border;\n  }\n}\n\n.a-PropertyEditor-propertyGroup-header {\n  &.is-focused {\n    // border-color: $propertyGroup-accordion-active__shadow;\n    box-shadow: $PropertyEditor-propertyGroup-header__shadow;\n\n    .a-Icon {\n      background-color: $propertyGroup-accordion-active__shadow;\n    }\n  }\n}\n\n.a-PropertyEditor-message {\n  color: $PropertyEditor-message__text;\n}\n\n.a-PropertyEditor-messageText {\n  color: $PropertyEditor-messageText__text;\n}\n\n/* Filtering\n   ========================================================================== */\n.a-PropertyEditor-filter {\n  .a-PropertyEditor-filter-icon {\n    color: $PropertyEditor-filter__text;\n  }\n\n  .a-Property-field:not(.a-Property-field--text) {\n    // box-shadow: none;\n\n    &:focus + .a-Icon {\n      color: $Property-field-focus__text;\n    }\n  }\n\n  .a-Button--stickyFilter {\n\n    &:focus,\n    &:hover {\n      color: $Button--stickyFilter-hover_text;\n      background-color: $Button--stickyFilter-hover__bg !important;\n      box-shadow: none;\n    }\n\n    &.is-active {\n      color: $Button--stickyFilter-is-active__text;\n      background-color: $Button--stickyFilter-is-active__bg !important;\n      box-shadow: none;\n\n      &:focus,\n      &:focus:active,\n      &:hover {\n        color: $Button--stickyFilter-focus-active__text;\n        background-color: $Button--stickyFilter-focus-active__bg !important;\n        box-shadow: $Button--stickyFilter-focus-active__shadow;\n      }\n    }\n  }\n\n  &:focus-within {\n    .a-Property-field {\n      background-color: $Property-field__bg;\n      box-shadow: $Property-field__shadow;\n    }\n\n    .a-Property-field + .a-Icon {\n      color: $Property-field-icon__text;\n    }\n  }\n}\n\n.a-Property-highlight {\n  background-color: $PropertyHighlight__bg;\n  box-shadow: $PropertyHighlight__shadow;\n}\n\n/* Property Filter Not Found\n   ========================================================================== */\n.a-Property-notFound {\n  color: $Property-notFound__text;\n}\n","@import \"themeConfig\";\n\n// ***************\n// Theme Variables\n// ***************\n\n$PropertyGroup-item__border: $neutral-100 !default;\n\n/******************************************************************************\nProperty Group Styles\n******************************************************************************/\n.a-PropertyGroup-item {\n  border-top-color: $PropertyGroup-item__border;\n}\n"]}