/*!*******************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!./src/index.css ***!
  \*******************************************************************************************************************************************************************/
@import url(https://fonts.googleapis.com/css2?family=Lexend+Exa:wght@100..900&display=swap);
/*!***********************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!./src/index.css (1) ***!
  \***********************************************************************************************************************************************************************/
@import url(https://fonts.googleapis.com/css2?family=Geist:wght@100..900&display=swap);
/*!***********************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!./src/index.css (2) ***!
  \***********************************************************************************************************************************************************************/
@import url(https://fonts.googleapis.com/css2?family=Redacted+Script:wght@300;400;700&display=swap);
/*!***********************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!./src/index.css (3) ***!
  \***********************************************************************************************************************************************************************/
:root {
  --shc-color-primary: #1E1E1E;
  --shc-color-secondary: #ffffff;
  --shc-color-muted: rgb(255, 255, 255, 0.5);
  --shc-color-muted-75: rgb(255, 255, 255, 0.75);
  --shc-color-line: rgb(255, 255, 255, 0.10);
  --shc-font-geist: 'Geist', sans-serif;
  --shc-font-lexend: 'Lexend Exa', sans-serif;
  --shc-font-redacted: 'Redacted Script', cursive;
  --shc-font-primary: var(--shc-font-geist);
  --shc-font-special: var(--shc-font-lexend);
  --diagram-components-width: 320px;
  --diagram-label-gap: 8px;
  --shc-connector-color: #2385E2;
} 

/* BEM styles for Home header with icons */
.home__header {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
  position: relative;
  margin-bottom: 3rem; /* increased spacing */
}

.home__header-title {
  flex: 1 1 auto;
  text-align: center;
  font-size: 1.5rem; /* reduced size */
  font-weight: 600;
  color: var(--shc-color-muted); /* muted header title */
  letter-spacing: 0.02em;
}

.field__input-redacted {
  font-family: var(--shc-font-redacted) !important;
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 0;
  /* nearly doubled font for redacted script; reduce vertical padding to keep the control height similar */
  font-size: 1.8rem;
  line-height: 1.0;
  padding: 0.15em 0.75em;
  width: 100%;
  display: block;
  box-sizing: border-box;
  transition: border-color 120ms ease;
}

.field__input-redacted:focus,
.field__input-redacted:focus-visible {
  outline: none;
  border-radius: 0; /* ensure no rounding on focus */
  border-color: rgba(255,255,255,0.18); /* slightly lighter/brighter border on focus */
  box-shadow: none; /* avoid glow/rounded white border */
} 

.field__instructions {
  color: var(--shc-color-muted);
  font-size: 1rem;
  line-height: 1.2;
  font-family: var(--shc-font-redacted);
  margin-top: 1.5rem; /* gap between control and instructions */
} 

.field__label-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
  margin-bottom: 0.5rem; /* space between label row and input */
}

.demo-field-form .field__label {
  font-weight: 400;
  font-family: var(--shc-font-redacted);
  font-size: 1.8rem;
  line-height: 1.0;
  flex: 1 1 auto;
  min-width: 0;
  word-break: break-word;
  color: var(--shc-color-muted-75);
}

.field__help-icon {
  flex: 0 0 auto;
  color: var(--shc-color-muted-75);
  /* SVG uses currentColor for stroke/fill so this controls the icon color */
}

body {
  font-family: var(--shc-font-primary);
  background: var(--shc-color-primary);
  color: var(--shc-color-secondary);
  margin: 0;
  padding: 0;
}

.page__title {
  font-size: 2rem;
  margin-bottom: 1.5rem;
  font-weight: 500;
  color: var(--shc-color-muted);
}

/* Diagram layout */
.diagram {
  position: relative; /* main inlines this too, kept for safety */
  /* responsive, reduced height range for a smaller UI footprint */
  min-height: clamp(320px, 40vh, 640px);
  display: flex;
  align-items: center;
  justify-content: center;
}

.diagram__components {
  width: min(100%, var(--diagram-components-width));
  margin: 0 auto; /* center horizontally */
  position: relative;
}

.diagram__label--top-left {
  top: var(--diagram-label-gap);
  left: 0;
  z-index: 1;
}

.diagram__label--top-right {
  top: var(--diagram-label-gap);
  right: 0;
  z-index: 1;
}

.diagram__label--bottom-left {
  bottom: var(--diagram-label-gap);
  left: 0;
  z-index: 1;
}

.diagram__label--bottom-right {
  bottom: var(--diagram-label-gap);
  right: 0;
  z-index: 1;
}

.diagram__labels {
  position: absolute;
  inset: 0; /* fill the diagram */
  pointer-events: none; /* let individual labels handle pointer events */
}

.diagram__label {
  position: absolute;
  pointer-events: auto;
  color: var(--shc-color-muted-75);
  font-family: var(--shc-font-lexend);
  font-weight: 500;
  border-radius: 4px;
  font-size: 0.875rem;
  background: none;
}

.showcase-footer-heading {
  font-family: var(--shc-font-special);
  font-size: 0.75rem !important;
  font-weight: 500;
  color: var(--shc-color-muted-75);
  margin: 8px 0;
}
/*!*******************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!../gateway/react/packages/forms/dist/components/field-types/relation/relation-style.css ***!
  \*******************************************************************************************************************************************************************************************************************************************/
.relation-field {
  width: 100%;
}

.relation-field__label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  margin-bottom: 0.25rem;
}

.relation-field__required {
  color: #ef4444;
  margin-left: 0.25rem;
}

.relation-field__help {
  font-size: 0.875rem;
  color: #6b7280;
  margin-bottom: 0.5rem;
}

.relation-field__loading,
.relation-field__error {
  width: 100%;
  padding: 0.75rem;
  border-radius: 0.375rem;
}

.relation-field__loading {
  background-color: #f9fafb;
  border: 1px solid #d1d5db;
  color: #6b7280;
}

.relation-field__error {
  background-color: #fef2f2;
  border: 1px solid #fca5a5;
  color: #dc2626;
}

.relation-field__select {
  width: 100%;
  padding: 0.5rem 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
}

.relation-field__select:focus {
  outline: none;
  ring: 2px;
  ring-color: #3b82f6;
}

.relation-field__select--error {
  border-color: #ef4444;
}

.relation-field__select--error:focus {
  ring-color: #ef4444;
}

.relation-field__error-message {
  margin-top: 0.25rem;
  font-size: 0.875rem;
  color: #dc2626;
}

.relation-field__display {
  display: inline;
}

.relation-field__display--empty {
  color: #9ca3af;
}
/*!*******************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!../gateway/react/packages/forms/dist/components/field-types/checkbox/checkbox-style.css ***!
  \*******************************************************************************************************************************************************************************************************************************************/
.checkbox-field__container {
  display: flex;
  align-items: center;
}

.checkbox-field__input {
  height: 1rem;
  width: 1rem;
  color: #2563eb;
  border: 1px solid #d1d5db;
  border-radius: 0.25rem;
  cursor: pointer;
}

.checkbox-field__input:focus {
  outline: none;
  box-shadow: 0 0 0 2px #3b82f6;
}

.checkbox-field__input--error {
  border-color: #ef4444;
}

.checkbox-field__label {
  margin-left: 0.5rem;
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  cursor: pointer;
}

.checkbox-field__required {
  color: #ef4444;
  margin-left: 0.25rem;
}

.checkbox-field__help {
  margin-top: 0.25rem;
  margin-left: 1.5rem;
  font-size: 0.875rem;
  color: #6b7280;
}

.checkbox-field__error {
  margin-top: 0.25rem;
  margin-left: 1.5rem;
  font-size: 0.875rem;
  color: #dc2626;
}

.checkbox-field__display {
  font-size: 1.25rem;
  line-height: 1;
}

.checkbox-field__display--checked {
  color: #2563eb;
}

.checkbox-field__display--unchecked {
  color: #9ca3af;
}

/*!***************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!../gateway/react/packages/forms/dist/components/field-types/color-picker/color-picker-style.css ***!
  \***************************************************************************************************************************************************************************************************************************************************/
.color-picker-field__label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.5rem;
}

.color-picker-field__required {
  color: #ef4444;
  margin-left: 0.25rem;
}

.color-picker-field__controls {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.color-picker-field__preview-container {
  position: relative;
}

.color-picker-field__preview {
  width: 3rem;
  height: 3rem;
  border-radius: 0.375rem;
  border: 2px solid #d1d5db;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  cursor: pointer;
  transition: all 0.2s;
  background: none;
  padding: 0;
}

.color-picker-field__preview:hover {
  transform: scale(1.05);
}

.color-picker-field__preview--error {
  border-color: #ef4444;
}

.color-picker-field__overlay {
  position: fixed;
  inset: 0;
  z-index: 10;
}

.color-picker-field__popup {
  position: absolute;
  z-index: 20;
  margin-top: 0.5rem;
  padding: 0.75rem;
  background: #ffffff;
  border-radius: 0.5rem;
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
  border: 1px solid #e5e7eb;
}

.color-picker-field__picker {
  width: 12rem;
  height: 12rem;
  cursor: pointer;
  border: none;
}

.color-picker-field__input-wrapper {
  flex: 1;
}

.color-picker-field__input {
  width: 100%;
  padding: 0.5rem 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  font-family: monospace;
  text-transform: uppercase;
  outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.color-picker-field__input:focus {
  outline: none;
  box-shadow: 0 0 0 2px #3b82f6;
  border-color: #3b82f6;
}

.color-picker-field__input--error {
  border-color: #ef4444;
}

.color-picker-field__input--error:focus {
  box-shadow: 0 0 0 2px #ef4444;
  border-color: #ef4444;
}

.color-picker-field__swatches {
  display: flex;
  gap: 0.25rem;
}

.color-picker-field__swatch {
  width: 2rem;
  height: 2rem;
  border-radius: 0.25rem;
  border: 2px solid #d1d5db;
  cursor: pointer;
  transition: transform 0.2s;
  background: none;
  padding: 0;
}

.color-picker-field__swatch:hover {
  transform: scale(1.1);
}

.color-picker-field__swatch--selected {
  border-color: #3b82f6;
  box-shadow: 0 0 0 2px #bfdbfe;
}

.color-picker-field__help {
  margin-top: 0.5rem;
  font-size: 0.875rem;
  color: #6b7280;
}

.color-picker-field__error {
  margin-top: 0.25rem;
  font-size: 0.875rem;
  color: #dc2626;
}

.color-picker-field__display {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

.color-picker-field__display--empty {
  color: #9ca3af;
  font-style: italic;
}

.color-picker-field__display-swatch {
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 0.25rem;
  border: 1px solid #d1d5db;
  vertical-align: middle;
}

.color-picker-field__display-value {
  font-family: monospace;
  text-transform: uppercase;
  font-size: 0.875rem;
  color: #374151;
}

/*!*******************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!../gateway/react/packages/forms/node_modules/react-datepicker/dist/react-datepicker.css ***!
  \*******************************************************************************************************************************************************************************************************************************************/
@charset "UTF-8";
.react-datepicker__navigation-icon::before, .react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-year-read-view--down-arrow {
  border-color: #ccc;
  border-style: solid;
  border-width: 3px 3px 0 0;
  content: "";
  display: block;
  height: 9px;
  position: absolute;
  top: 6px;
  width: 9px;
}
/* sr-only utility class for accessibility */
.react-datepicker__sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.react-datepicker-wrapper {
  display: inline-block;
  padding: 0;
  border: 0;
}

.react-datepicker {
  font-family: "Helvetica Neue", helvetica, arial, sans-serif;
  font-size: 0.8rem;
  background-color: #fff;
  color: #000;
  border: 1px solid #aeaeae;
  border-radius: 0.3rem;
  display: inline-block;
  position: relative;
  line-height: initial;
}

.react-datepicker--time-only .react-datepicker__time-container {
  border-left: 0;
}
.react-datepicker--time-only .react-datepicker__time,
.react-datepicker--time-only .react-datepicker__time-box {
  border-bottom-left-radius: 0.3rem;
  border-bottom-right-radius: 0.3rem;
}

.react-datepicker-popper {
  z-index: 1;
  line-height: 0;
}
.react-datepicker-popper .react-datepicker__triangle {
  stroke: #aeaeae;
}
.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle {
  fill: #f0f0f0;
  color: #f0f0f0;
}
.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle {
  fill: #fff;
  color: #fff;
}

.react-datepicker__header {
  text-align: center;
  background-color: #f0f0f0;
  border-bottom: 1px solid #aeaeae;
  border-top-left-radius: 0.3rem;
  padding: 8px 0;
  position: relative;
}
.react-datepicker__header--time {
  padding-bottom: 8px;
  padding-left: 5px;
  padding-right: 5px;
}
.react-datepicker__header--time:not(.react-datepicker__header--time--only) {
  border-top-left-radius: 0;
}
.react-datepicker__header:not(.react-datepicker__header--has-time-select) {
  border-top-right-radius: 0.3rem;
}

.react-datepicker__year-dropdown-container--select,
.react-datepicker__month-dropdown-container--select,
.react-datepicker__month-year-dropdown-container--select,
.react-datepicker__year-dropdown-container--scroll,
.react-datepicker__month-dropdown-container--scroll,
.react-datepicker__month-year-dropdown-container--scroll {
  display: inline-block;
  margin: 0 15px;
}

.react-datepicker__current-month,
.react-datepicker-time__header,
.react-datepicker-year-header {
  margin-top: 0;
  color: #000;
  font-weight: bold;
  font-size: 0.944rem;
}

h2.react-datepicker__current-month {
  padding: 0;
  margin: 0;
}

.react-datepicker-time__header {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.react-datepicker__navigation {
  align-items: center;
  background: none;
  display: flex;
  justify-content: center;
  text-align: center;
  cursor: pointer;
  position: absolute;
  top: 2px;
  padding: 0;
  border: none;
  z-index: 1;
  height: 32px;
  width: 32px;
  text-indent: -999em;
  overflow: hidden;
}
.react-datepicker__navigation--previous {
  left: 2px;
}
.react-datepicker__navigation--next {
  right: 2px;
}
.react-datepicker__navigation--next--with-time:not(.react-datepicker__navigation--next--with-today-button) {
  right: 85px;
}
.react-datepicker__navigation--years {
  position: relative;
  top: 0;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.react-datepicker__navigation--years-previous {
  top: 4px;
}
.react-datepicker__navigation--years-upcoming {
  top: -4px;
}
.react-datepicker__navigation:hover *::before {
  border-color: rgb(165.75, 165.75, 165.75);
}

.react-datepicker__navigation-icon {
  position: relative;
  top: -1px;
  font-size: 20px;
  width: 0;
}
.react-datepicker__navigation-icon--next {
  left: -2px;
}
.react-datepicker__navigation-icon--next::before {
  transform: rotate(45deg);
  left: -7px;
}
.react-datepicker__navigation-icon--previous {
  right: -2px;
}
.react-datepicker__navigation-icon--previous::before {
  transform: rotate(225deg);
  right: -7px;
}

.react-datepicker__month-container {
  float: left;
}

.react-datepicker__year {
  margin: 0.4rem;
  text-align: center;
}
.react-datepicker__year-wrapper {
  display: flex;
  flex-wrap: wrap;
  max-width: 180px;
}
.react-datepicker__year .react-datepicker__year-text {
  display: inline-block;
  width: 4rem;
  margin: 2px;
}

.react-datepicker__month {
  margin: 0.4rem;
  text-align: center;
}
.react-datepicker__month .react-datepicker__month-text,
.react-datepicker__month .react-datepicker__quarter-text {
  display: inline-block;
  width: 4rem;
  margin: 2px;
}

.react-datepicker__input-time-container {
  clear: both;
  width: 100%;
  float: left;
  margin: 5px 0 10px 15px;
  text-align: left;
}
.react-datepicker__input-time-container .react-datepicker-time__caption {
  display: inline-block;
}
.react-datepicker__input-time-container .react-datepicker-time__input-container {
  display: inline-block;
}
.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input {
  display: inline-block;
  margin-left: 10px;
}
.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input {
  width: auto;
}
.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]::-webkit-inner-spin-button,
.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time] {
  -moz-appearance: textfield;
}
.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__delimiter {
  margin-left: 5px;
  display: inline-block;
}

.react-datepicker__time-container {
  float: right;
  border-left: 1px solid #aeaeae;
  width: 85px;
}
.react-datepicker__time-container--with-today-button {
  display: inline;
  border: 1px solid #aeaeae;
  border-radius: 0.3rem;
  position: absolute;
  right: -87px;
  top: 0;
}
.react-datepicker__time-container .react-datepicker__time {
  position: relative;
  background: white;
  border-bottom-right-radius: 0.3rem;
}
.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box {
  width: 85px;
  overflow-x: hidden;
  margin: 0 auto;
  text-align: center;
  border-bottom-right-radius: 0.3rem;
}
.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list {
  list-style: none;
  margin: 0;
  height: calc(195px + 1.7rem / 2);
  overflow-y: scroll;
  padding-right: 0;
  padding-left: 0;
  width: 100%;
  box-sizing: content-box;
}
.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item {
  height: 30px;
  padding: 5px 10px;
  white-space: nowrap;
}
.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item:hover {
  cursor: pointer;
  background-color: #f0f0f0;
}
.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected {
  background-color: #216ba5;
  color: white;
  font-weight: bold;
}
.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected:hover {
  background-color: #216ba5;
}
.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled {
  color: #ccc;
}
.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled:hover {
  cursor: default;
  background-color: transparent;
}

.react-datepicker__week-number {
  color: #ccc;
  display: inline-block;
  width: 1.7rem;
  line-height: 1.7rem;
  text-align: center;
  margin: 0.166rem;
}
.react-datepicker__week-number.react-datepicker__week-number--clickable {
  cursor: pointer;
}
.react-datepicker__week-number.react-datepicker__week-number--clickable:not(.react-datepicker__week-number--selected):hover {
  border-radius: 0.3rem;
  background-color: #f0f0f0;
}
.react-datepicker__week-number--selected {
  border-radius: 0.3rem;
  background-color: #216ba5;
  color: #fff;
}
.react-datepicker__week-number--selected:hover {
  background-color: rgb(28.75, 93.2196969697, 143.75);
}

.react-datepicker__day-names {
  text-align: center;
  white-space: nowrap;
  margin-bottom: -8px;
}

.react-datepicker__week {
  white-space: nowrap;
}

.react-datepicker__day-name,
.react-datepicker__day,
.react-datepicker__time-name {
  color: #000;
  display: inline-block;
  width: 1.7rem;
  line-height: 1.7rem;
  text-align: center;
  margin: 0.166rem;
}
.react-datepicker__day-name--disabled,
.react-datepicker__day--disabled,
.react-datepicker__time-name--disabled {
  cursor: default;
  color: #ccc;
}

.react-datepicker__day,
.react-datepicker__month-text,
.react-datepicker__quarter-text,
.react-datepicker__year-text {
  cursor: pointer;
}
.react-datepicker__day:not([aria-disabled=true]):hover,
.react-datepicker__month-text:not([aria-disabled=true]):hover,
.react-datepicker__quarter-text:not([aria-disabled=true]):hover,
.react-datepicker__year-text:not([aria-disabled=true]):hover {
  border-radius: 0.3rem;
  background-color: #f0f0f0;
}
.react-datepicker__day--today,
.react-datepicker__month-text--today,
.react-datepicker__quarter-text--today,
.react-datepicker__year-text--today {
  font-weight: bold;
}
.react-datepicker__day--highlighted,
.react-datepicker__month-text--highlighted,
.react-datepicker__quarter-text--highlighted,
.react-datepicker__year-text--highlighted {
  border-radius: 0.3rem;
  background-color: #3dcc4a;
  color: #fff;
}
.react-datepicker__day--highlighted:not([aria-disabled=true]):hover,
.react-datepicker__month-text--highlighted:not([aria-disabled=true]):hover,
.react-datepicker__quarter-text--highlighted:not([aria-disabled=true]):hover,
.react-datepicker__year-text--highlighted:not([aria-disabled=true]):hover {
  background-color: rgb(49.8551020408, 189.6448979592, 62.5632653061);
}
.react-datepicker__day--highlighted-custom-1,
.react-datepicker__month-text--highlighted-custom-1,
.react-datepicker__quarter-text--highlighted-custom-1,
.react-datepicker__year-text--highlighted-custom-1 {
  color: magenta;
}
.react-datepicker__day--highlighted-custom-2,
.react-datepicker__month-text--highlighted-custom-2,
.react-datepicker__quarter-text--highlighted-custom-2,
.react-datepicker__year-text--highlighted-custom-2 {
  color: green;
}
.react-datepicker__day--holidays,
.react-datepicker__month-text--holidays,
.react-datepicker__quarter-text--holidays,
.react-datepicker__year-text--holidays {
  position: relative;
  border-radius: 0.3rem;
  background-color: #ff6803;
  color: #fff;
}
.react-datepicker__day--holidays .overlay,
.react-datepicker__month-text--holidays .overlay,
.react-datepicker__quarter-text--holidays .overlay,
.react-datepicker__year-text--holidays .overlay {
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  background-color: #333;
  color: #fff;
  padding: 4px;
  border-radius: 4px;
  white-space: nowrap;
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s, opacity 0.3s ease-in-out;
}
.react-datepicker__day--holidays:not([aria-disabled=true]):hover,
.react-datepicker__month-text--holidays:not([aria-disabled=true]):hover,
.react-datepicker__quarter-text--holidays:not([aria-disabled=true]):hover,
.react-datepicker__year-text--holidays:not([aria-disabled=true]):hover {
  background-color: rgb(207, 82.9642857143, 0);
}
.react-datepicker__day--holidays:hover .overlay,
.react-datepicker__month-text--holidays:hover .overlay,
.react-datepicker__quarter-text--holidays:hover .overlay,
.react-datepicker__year-text--holidays:hover .overlay {
  visibility: visible;
  opacity: 1;
}
.react-datepicker__day--selected, .react-datepicker__day--in-selecting-range, .react-datepicker__day--in-range,
.react-datepicker__month-text--selected,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__month-text--in-range,
.react-datepicker__quarter-text--selected,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__quarter-text--in-range,
.react-datepicker__year-text--selected,
.react-datepicker__year-text--in-selecting-range,
.react-datepicker__year-text--in-range {
  border-radius: 0.3rem;
  background-color: #216ba5;
  color: #fff;
}
.react-datepicker__day--selected:not([aria-disabled=true]):hover, .react-datepicker__day--in-selecting-range:not([aria-disabled=true]):hover, .react-datepicker__day--in-range:not([aria-disabled=true]):hover,
.react-datepicker__month-text--selected:not([aria-disabled=true]):hover,
.react-datepicker__month-text--in-selecting-range:not([aria-disabled=true]):hover,
.react-datepicker__month-text--in-range:not([aria-disabled=true]):hover,
.react-datepicker__quarter-text--selected:not([aria-disabled=true]):hover,
.react-datepicker__quarter-text--in-selecting-range:not([aria-disabled=true]):hover,
.react-datepicker__quarter-text--in-range:not([aria-disabled=true]):hover,
.react-datepicker__year-text--selected:not([aria-disabled=true]):hover,
.react-datepicker__year-text--in-selecting-range:not([aria-disabled=true]):hover,
.react-datepicker__year-text--in-range:not([aria-disabled=true]):hover {
  background-color: rgb(28.75, 93.2196969697, 143.75);
}
.react-datepicker__day--keyboard-selected,
.react-datepicker__month-text--keyboard-selected,
.react-datepicker__quarter-text--keyboard-selected,
.react-datepicker__year-text--keyboard-selected {
  border-radius: 0.3rem;
  background-color: rgb(186.25, 217.0833333333, 241.25);
  color: rgb(0, 0, 0);
}
.react-datepicker__day--keyboard-selected:not([aria-disabled=true]):hover,
.react-datepicker__month-text--keyboard-selected:not([aria-disabled=true]):hover,
.react-datepicker__quarter-text--keyboard-selected:not([aria-disabled=true]):hover,
.react-datepicker__year-text--keyboard-selected:not([aria-disabled=true]):hover {
  background-color: rgb(28.75, 93.2196969697, 143.75);
}
.react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range,
.react-datepicker__month-text--in-range,
.react-datepicker__quarter-text--in-range,
.react-datepicker__year-text--in-range),
.react-datepicker__month-text--in-selecting-range:not(.react-datepicker__day--in-range,
.react-datepicker__month-text--in-range,
.react-datepicker__quarter-text--in-range,
.react-datepicker__year-text--in-range),
.react-datepicker__quarter-text--in-selecting-range:not(.react-datepicker__day--in-range,
.react-datepicker__month-text--in-range,
.react-datepicker__quarter-text--in-range,
.react-datepicker__year-text--in-range),
.react-datepicker__year-text--in-selecting-range:not(.react-datepicker__day--in-range,
.react-datepicker__month-text--in-range,
.react-datepicker__quarter-text--in-range,
.react-datepicker__year-text--in-range) {
  background-color: rgba(33, 107, 165, 0.5);
}
.react-datepicker__month--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__year-text--in-selecting-range), .react-datepicker__year--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__year-text--in-selecting-range),
.react-datepicker__month--selecting-range .react-datepicker__month-text--in-range:not(.react-datepicker__day--in-selecting-range,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__year-text--in-selecting-range),
.react-datepicker__year--selecting-range .react-datepicker__month-text--in-range:not(.react-datepicker__day--in-selecting-range,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__year-text--in-selecting-range),
.react-datepicker__month--selecting-range .react-datepicker__quarter-text--in-range:not(.react-datepicker__day--in-selecting-range,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__year-text--in-selecting-range),
.react-datepicker__year--selecting-range .react-datepicker__quarter-text--in-range:not(.react-datepicker__day--in-selecting-range,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__year-text--in-selecting-range),
.react-datepicker__month--selecting-range .react-datepicker__year-text--in-range:not(.react-datepicker__day--in-selecting-range,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__year-text--in-selecting-range),
.react-datepicker__year--selecting-range .react-datepicker__year-text--in-range:not(.react-datepicker__day--in-selecting-range,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__year-text--in-selecting-range) {
  background-color: #f0f0f0;
  color: #000;
}
.react-datepicker__day--disabled,
.react-datepicker__month-text--disabled,
.react-datepicker__quarter-text--disabled,
.react-datepicker__year-text--disabled {
  cursor: default;
  color: #ccc;
}
.react-datepicker__day--disabled .overlay,
.react-datepicker__month-text--disabled .overlay,
.react-datepicker__quarter-text--disabled .overlay,
.react-datepicker__year-text--disabled .overlay {
  position: absolute;
  bottom: 70%;
  left: 50%;
  transform: translateX(-50%);
  background-color: #333;
  color: #fff;
  padding: 4px;
  border-radius: 4px;
  white-space: nowrap;
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s, opacity 0.3s ease-in-out;
}

.react-datepicker__input-container {
  position: relative;
  display: inline-block;
  width: 100%;
}
.react-datepicker__input-container .react-datepicker__calendar-icon {
  position: absolute;
  padding: 0.5rem;
  box-sizing: content-box;
}

.react-datepicker__view-calendar-icon input {
  padding: 6px 10px 5px 25px;
}

.react-datepicker__year-read-view,
.react-datepicker__month-read-view,
.react-datepicker__month-year-read-view {
  border: 1px solid transparent;
  border-radius: 0.3rem;
  position: relative;
}
.react-datepicker__year-read-view:hover,
.react-datepicker__month-read-view:hover,
.react-datepicker__month-year-read-view:hover {
  cursor: pointer;
}
.react-datepicker__year-read-view:hover .react-datepicker__year-read-view--down-arrow,
.react-datepicker__year-read-view:hover .react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-read-view:hover .react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-read-view:hover .react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-year-read-view:hover .react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-year-read-view:hover .react-datepicker__month-read-view--down-arrow {
  border-top-color: rgb(178.5, 178.5, 178.5);
}
.react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-year-read-view--down-arrow {
  transform: rotate(135deg);
  right: -16px;
  top: 0;
}

.react-datepicker__year-dropdown,
.react-datepicker__month-dropdown,
.react-datepicker__month-year-dropdown {
  background-color: #f0f0f0;
  position: absolute;
  width: 50%;
  left: 25%;
  top: 30px;
  z-index: 1;
  text-align: center;
  border-radius: 0.3rem;
  border: 1px solid #aeaeae;
}
.react-datepicker__year-dropdown:hover,
.react-datepicker__month-dropdown:hover,
.react-datepicker__month-year-dropdown:hover {
  cursor: pointer;
}
.react-datepicker__year-dropdown--scrollable,
.react-datepicker__month-dropdown--scrollable,
.react-datepicker__month-year-dropdown--scrollable {
  height: 150px;
  overflow-y: scroll;
}

.react-datepicker__year-option,
.react-datepicker__month-option,
.react-datepicker__month-year-option {
  line-height: 20px;
  width: 100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.react-datepicker__year-option:first-of-type,
.react-datepicker__month-option:first-of-type,
.react-datepicker__month-year-option:first-of-type {
  border-top-left-radius: 0.3rem;
  border-top-right-radius: 0.3rem;
}
.react-datepicker__year-option:last-of-type,
.react-datepicker__month-option:last-of-type,
.react-datepicker__month-year-option:last-of-type {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  border-bottom-left-radius: 0.3rem;
  border-bottom-right-radius: 0.3rem;
}
.react-datepicker__year-option:hover,
.react-datepicker__month-option:hover,
.react-datepicker__month-year-option:hover {
  background-color: #ccc;
}
.react-datepicker__year-option:hover .react-datepicker__navigation--years-upcoming,
.react-datepicker__month-option:hover .react-datepicker__navigation--years-upcoming,
.react-datepicker__month-year-option:hover .react-datepicker__navigation--years-upcoming {
  border-bottom-color: rgb(178.5, 178.5, 178.5);
}
.react-datepicker__year-option:hover .react-datepicker__navigation--years-previous,
.react-datepicker__month-option:hover .react-datepicker__navigation--years-previous,
.react-datepicker__month-year-option:hover .react-datepicker__navigation--years-previous {
  border-top-color: rgb(178.5, 178.5, 178.5);
}
.react-datepicker__year-option--selected,
.react-datepicker__month-option--selected,
.react-datepicker__month-year-option--selected {
  position: absolute;
  left: 15px;
}

.react-datepicker__close-icon {
  cursor: pointer;
  background-color: transparent;
  border: 0;
  outline: 0;
  padding: 0 6px 0 0;
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  display: table-cell;
  vertical-align: middle;
}
.react-datepicker__close-icon::after {
  cursor: pointer;
  background-color: #216ba5;
  color: #fff;
  border-radius: 50%;
  height: 16px;
  width: 16px;
  padding: 2px;
  font-size: 12px;
  line-height: 1;
  text-align: center;
  display: table-cell;
  vertical-align: middle;
  content: "×";
}
.react-datepicker__close-icon--disabled {
  cursor: default;
}
.react-datepicker__close-icon--disabled::after {
  cursor: default;
  background-color: #ccc;
}

.react-datepicker__today-button {
  background: #f0f0f0;
  border-top: 1px solid #aeaeae;
  cursor: pointer;
  text-align: center;
  font-weight: bold;
  padding: 5px 0;
  clear: left;
}

.react-datepicker__portal {
  position: fixed;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.8);
  left: 0;
  top: 0;
  justify-content: center;
  align-items: center;
  display: flex;
  z-index: 2147483647;
}
.react-datepicker__portal .react-datepicker__day-name,
.react-datepicker__portal .react-datepicker__day,
.react-datepicker__portal .react-datepicker__time-name {
  width: 3rem;
  line-height: 3rem;
}
@media (max-width: 400px), (max-height: 550px) {
  .react-datepicker__portal .react-datepicker__day-name,
  .react-datepicker__portal .react-datepicker__day,
  .react-datepicker__portal .react-datepicker__time-name {
    width: 2rem;
    line-height: 2rem;
  }
}
.react-datepicker__portal .react-datepicker__current-month,
.react-datepicker__portal .react-datepicker-time__header {
  font-size: 1.44rem;
}

.react-datepicker__children-container {
  width: 13.8rem;
  margin: 0.4rem;
  padding-right: 0.2rem;
  padding-left: 0.2rem;
  height: auto;
}

.react-datepicker__aria-live {
  position: absolute;
  clip-path: circle(0);
  border: 0;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  width: 1px;
  white-space: nowrap;
}

.react-datepicker__calendar-icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.125em;
}

/*!*************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!../gateway/react/packages/forms/dist/components/field-types/date-picker/date-picker-style.css ***!
  \*************************************************************************************************************************************************************************************************************************************************/
.date-picker-field__label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.25rem;
}

.date-picker-field__required {
  color: #ef4444;
  margin-left: 0.25rem;
}

.date-picker-field__help {
  font-size: 0.875rem;
  color: #6b7280;
  margin-bottom: 0.5rem;
}

.date-picker-field__input {
  padding: 0.5rem 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.date-picker-field__input:focus {
  outline: none;
  box-shadow: 0 0 0 2px #3b82f6;
  border-color: #3b82f6;
}

.date-picker-field__input--error {
  border-color: #ef4444;
}

.date-picker-field__input--error:focus {
  box-shadow: 0 0 0 2px #ef4444;
  border-color: #ef4444;
}

.date-picker-field__error {
  margin-top: 0.25rem;
  font-size: 0.875rem;
  color: #dc2626;
}

.date-picker-field__display {
  color: #1d2327;
}

.date-picker-field__display--empty {
  color: #9ca3af;
  font-style: italic;
}

.date-picker-field__display--invalid {
  color: #dc2626;
  font-style: italic;
}

/*!*********************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!../gateway/react/packages/forms/dist/components/field-types/datetime-picker/datetime-picker-style.css ***!
  \*********************************************************************************************************************************************************************************************************************************************************/
.datetime-picker-field__label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.25rem;
}

.datetime-picker-field__required {
  color: #ef4444;
  margin-left: 0.25rem;
}

.datetime-picker-field__help {
  font-size: 0.875rem;
  color: #6b7280;
  margin-bottom: 0.5rem;
}

.datetime-picker-field__input {
  padding: 0.5rem 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.datetime-picker-field__input:focus {
  outline: none;
  box-shadow: 0 0 0 2px #3b82f6;
  border-color: #3b82f6;
}

.datetime-picker-field__input--error {
  border-color: #ef4444;
}

.datetime-picker-field__input--error:focus {
  box-shadow: 0 0 0 2px #ef4444;
  border-color: #ef4444;
}

.datetime-picker-field__error {
  margin-top: 0.25rem;
  font-size: 0.875rem;
  color: #dc2626;
}

.datetime-picker-field__display {
  color: #1d2327;
}

.datetime-picker-field__display--empty {
  color: #9ca3af;
  font-style: italic;
}

.datetime-picker-field__display--invalid {
  color: #dc2626;
  font-style: italic;
}

/*!*************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!../gateway/react/packages/forms/dist/components/field-types/email/email-style.css ***!
  \*************************************************************************************************************************************************************************************************************************************/
.email-field__label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.25rem;
}

.email-field__input {
  padding: 0.5rem 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.email-field__input:focus {
  outline: none;
  box-shadow: 0 0 0 2px #3b82f6;
  border-color: #3b82f6;
}

.email-field__input--error {
  border-color: #ef4444;
}

.email-field__input--error:focus {
  box-shadow: 0 0 0 2px #ef4444;
  border-color: #ef4444;
}

.email-field__help {
  margin-top: 0.25rem;
  font-size: 0.875rem;
  color: #6b7280;
}

.email-field__error {
  margin-top: 0.25rem;
  font-size: 0.875rem;
  color: #dc2626;
}

.email-field__display {
  color: #1d2327;
}

.email-field__display--empty {
  color: #9ca3af;
  font-style: italic;
}

.email-field__display--link {
  color: #2563eb;
  text-decoration: none;
}

.email-field__display--link:hover {
  text-decoration: underline;
}

/*!***********************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!../gateway/react/packages/forms/dist/components/field-types/file/file-style.css ***!
  \***********************************************************************************************************************************************************************************************************************************/
.file-field__label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.25rem;
}

.file-field__required {
  color: #ef4444;
  margin-left: 0.25rem;
}

.file-field__help {
  font-size: 0.875rem;
  color: #6b7280;
  margin-bottom: 0.5rem;
}

.file-field__container {
  border: 2px dashed #d1d5db;
  border-radius: 0.375rem;
  padding: 1rem;
}

.file-field__container--error {
  border-color: #ef4444;
}

.file-field__preview {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.file-field__file-info {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 0.75rem;
  background-color: #f9fafb;
  border-radius: 0.375rem;
  border: 1px solid #e5e7eb;
}

.file-field__file-icon {
  font-size: 1.875rem;
  flex-shrink: 0;
}

.file-field__file-details {
  flex: 1;
  min-width: 0;
}

.file-field__file-name {
  font-weight: 500;
  font-size: 0.875rem;
  color: #111827;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.file-field__file-meta {
  display: flex;
  gap: 0.75rem;
  margin-top: 0.25rem;
}

.file-field__file-size,
.file-field__file-type {
  font-size: 0.75rem;
  color: #6b7280;
}

.file-field__file-link {
  font-size: 0.75rem;
  color: #2563eb;
  margin-top: 0.25rem;
  display: inline-block;
}

.file-field__file-link:hover {
  color: #1d4ed8;
}

.file-field__actions {
  display: flex;
  gap: 0.5rem;
}

.file-field__button {
  padding: 0.5rem 0.75rem;
  border-radius: 0.375rem;
  font-size: 0.875rem;
  border: 1px solid;
  cursor: pointer;
  transition: background-color 0.15s, border-color 0.15s;
}

.file-field__button--change {
  background-color: #f3f4f6;
  color: #374151;
  border-color: #d1d5db;
}

.file-field__button--change:hover {
  background-color: #e5e7eb;
}

.file-field__button--remove {
  background-color: #fef2f2;
  color: #dc2626;
  border-color: #fecaca;
}

.file-field__button--remove:hover {
  background-color: #fee2e2;
}

.file-field__button--select,
.file-field__button--add {
  padding: 0.5rem 1rem;
  background-color: #2563eb;
  color: white;
  border-color: #2563eb;
}

.file-field__button--select:hover,
.file-field__button--add:hover {
  background-color: #1d4ed8;
}

.file-field__id {
  font-size: 0.75rem;
  color: #6b7280;
}

.file-field__empty {
  text-align: center;
}

.file-field__empty-icon {
  margin: 0 auto;
  height: 3rem;
  width: 3rem;
  color: #9ca3af;
}

.file-field__empty-description {
  margin-top: 0.5rem;
  font-size: 0.75rem;
  color: #6b7280;
}

.file-field__empty-types {
  margin-top: 0.25rem;
  font-size: 0.75rem;
  color: #9ca3af;
}

.file-field__error {
  margin-top: 0.25rem;
  font-size: 0.875rem;
  color: #dc2626;
}

.file-field__display {
  color: #1d2327;
}

.file-field__display--empty {
  color: #9ca3af;
  font-style: italic;
}

.file-field__display--link {
  color: #2563eb;
  text-decoration: none;
}

.file-field__display--link:hover {
  text-decoration: underline;
}

/*!*****************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!../gateway/react/packages/forms/dist/components/field-types/gallery/gallery-style.css ***!
  \*****************************************************************************************************************************************************************************************************************************************/
.gallery-field__label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.25rem;
}

.gallery-field__required {
  color: #ef4444;
  margin-left: 0.25rem;
}

.gallery-field__help {
  font-size: 0.875rem;
  color: #6b7280;
  margin-bottom: 0.5rem;
}

.gallery-field__container {
  border: 2px dashed #d1d5db;
  border-radius: 0.375rem;
  padding: 1rem;
}

.gallery-field__container--error {
  border-color: #ef4444;
}

.gallery-field__preview {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.gallery-field__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
}

@media (min-width: 640px) {
  .gallery-field__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 768px) {
  .gallery-field__grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

@media (min-width: 1024px) {
  .gallery-field__grid {
    grid-template-columns: repeat(5, 1fr);
  }
}

.gallery-field__item {
  position: relative;
  cursor: move;
  border-radius: 0.375rem;
  overflow: hidden;
  border: 2px solid #e5e7eb;
  transition: opacity 0.15s;
}

.gallery-field__item:hover {
  border-color: #93c5fd;
}

.gallery-field__item--dragging {
  opacity: 0.5;
  border-color: #3b82f6;
}

.gallery-field__image-wrapper {
  aspect-ratio: 1;
  background-color: #f3f4f6;
}

.gallery-field__image {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.gallery-field__drag-handle {
  position: absolute;
  top: 0.25rem;
  left: 0.25rem;
  background-color: rgba(0, 0, 0, 0.5);
  color: white;
  padding: 0.25rem 0.375rem;
  border-radius: 0.25rem;
}

.gallery-field__drag-icon {
  width: 0.75rem;
  height: 0.75rem;
}

.gallery-field__remove {
  position: absolute;
  top: 0.25rem;
  right: 0.25rem;
  background-color: #dc2626;
  color: white;
  padding: 0.375rem;
  border-radius: 0.25rem;
  opacity: 0;
  transition: opacity 0.15s, background-color 0.15s;
  border: none;
  cursor: pointer;
}

.gallery-field__item:hover .gallery-field__remove {
  opacity: 1;
}

.gallery-field__remove:hover {
  background-color: #b91c1c;
}

.gallery-field__remove-icon {
  width: 1rem;
  height: 1rem;
}

.gallery-field__order {
  position: absolute;
  bottom: 0.25rem;
  right: 0.25rem;
  background-color: rgba(0, 0, 0, 0.5);
  color: white;
  padding: 0.125rem 0.5rem;
  border-radius: 0.25rem;
  font-size: 0.75rem;
  font-weight: 500;
}

.gallery-field__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 0.5rem;
  border-top: 1px solid #e5e7eb;
}

.gallery-field__count {
  font-size: 0.875rem;
  color: #4b5563;
}

.gallery-field__actions {
  display: flex;
  gap: 0.5rem;
}

.gallery-field__button {
  padding: 0.5rem 0.75rem;
  border-radius: 0.375rem;
  font-size: 0.875rem;
  border: 1px solid;
  cursor: pointer;
  transition: background-color 0.15s;
}

.gallery-field__button--edit,
.gallery-field__button--add {
  background-color: #2563eb;
  color: white;
  border-color: #2563eb;
}

.gallery-field__button--edit:hover,
.gallery-field__button--add:hover {
  background-color: #1d4ed8;
}

.gallery-field__button--clear {
  background-color: #fef2f2;
  color: #dc2626;
  border-color: #fecaca;
}

.gallery-field__button--clear:hover {
  background-color: #fee2e2;
}

.gallery-field__hint {
  font-size: 0.75rem;
  color: #6b7280;
  font-style: italic;
}

.gallery-field__empty {
  text-align: center;
  padding: 2rem 0;
}

.gallery-field__empty-icon {
  margin: 0 auto;
  height: 3rem;
  width: 3rem;
  color: #9ca3af;
}

.gallery-field__empty-description {
  margin-top: 0.5rem;
  font-size: 0.75rem;
  color: #6b7280;
}

.gallery-field__empty-max {
  margin-top: 0.25rem;
  font-size: 0.75rem;
  color: #9ca3af;
}

.gallery-field__error {
  margin-top: 0.25rem;
  font-size: 0.875rem;
  color: #dc2626;
}

.gallery-field__display {
  color: #1d2327;
}

.gallery-field__display--empty {
  color: #9ca3af;
  font-style: italic;
}

/*!***************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!../gateway/react/packages/forms/dist/components/field-types/hidden/hidden-style.css ***!
  \***************************************************************************************************************************************************************************************************************************************/
.hidden-field__input {
  /* Hidden field - no visual styles needed */
}

.hidden-field__display {
  color: #1d2327;
}

.hidden-field__display--empty {
  color: #9ca3af;
  font-style: italic;
}

/*!*************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!../gateway/react/packages/forms/dist/components/field-types/image/image-style.css ***!
  \*************************************************************************************************************************************************************************************************************************************/
.image-field__label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.25rem;
}

.image-field__required {
  color: #ef4444;
  margin-left: 0.25rem;
}

.image-field__help {
  font-size: 0.875rem;
  color: #6b7280;
  margin-bottom: 0.5rem;
}

.image-field__container {
  border: 2px dashed #d1d5db;
  border-radius: 0.375rem;
  padding: 1rem;
}

.image-field__container--error {
  border-color: #ef4444;
}

.image-field__preview {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.image-field__image-wrapper {
  position: relative;
  display: inline-block;
}

.image-field__image {
  max-width: 100%;
  height: auto;
  border-radius: 0.375rem;
}

.image-field__actions {
  display: flex;
  gap: 0.5rem;
}

.image-field__button {
  padding: 0.5rem 0.75rem;
  border-radius: 0.375rem;
  font-size: 0.875rem;
  border: 1px solid;
  cursor: pointer;
  transition: background-color 0.15s;
}

.image-field__button--change {
  background-color: #f3f4f6;
  color: #374151;
  border-color: #d1d5db;
}

.image-field__button--change:hover {
  background-color: #e5e7eb;
}

.image-field__button--remove {
  background-color: #fef2f2;
  color: #dc2626;
  border-color: #fecaca;
}

.image-field__button--remove:hover {
  background-color: #fee2e2;
}

.image-field__button--select {
  padding: 0.5rem 1rem;
  background-color: #2563eb;
  color: white;
  border-color: #2563eb;
}

.image-field__button--select:hover {
  background-color: #1d4ed8;
}

.image-field__id {
  font-size: 0.75rem;
  color: #6b7280;
}

.image-field__empty {
  text-align: center;
}

.image-field__empty-icon {
  margin: 0 auto;
  height: 3rem;
  width: 3rem;
  color: #9ca3af;
}

.image-field__empty-description {
  margin-top: 0.5rem;
  font-size: 0.75rem;
  color: #6b7280;
}

.image-field__error {
  margin-top: 0.25rem;
  font-size: 0.875rem;
  color: #dc2626;
}

.image-field__display {
  color: #1d2327;
}

.image-field__display--empty {
  color: #9ca3af;
  font-style: italic;
}

.image-field__display-image {
  max-width: 50px;
  max-height: 50px;
  border-radius: 0.25rem;
  -o-object-fit: cover;
     object-fit: cover;
}

/*!***********************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!../gateway/react/packages/forms/dist/components/field-types/link/link-style.css ***!
  \***********************************************************************************************************************************************************************************************************************************/
.link-field__label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.25rem;
}

.link-field__required {
  color: #ef4444;
  margin-left: 0.25rem;
}

.link-field__help {
  font-size: 0.875rem;
  color: #6b7280;
  margin-bottom: 0.5rem;
}

.link-field__container {
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
}

.link-field__container--error {
  border-color: #ef4444;
}

.link-field__preview {
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.link-field__link-info {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
}

.link-field__link-icon {
  flex-shrink: 0;
  margin-top: 0.25rem;
}

.link-field__icon {
  width: 1.25rem;
  height: 1.25rem;
  color: #2563eb;
}

.link-field__link-details {
  flex: 1;
  min-width: 0;
}

.link-field__link-title {
  font-weight: 500;
  color: #111827;
  margin-bottom: 0.25rem;
}

.link-field__link-url {
  font-size: 0.875rem;
  color: #2563eb;
  word-break: break-all;
}

.link-field__link-url:hover {
  color: #1d4ed8;
}

.link-field__link-target {
  font-size: 0.75rem;
  color: #6b7280;
  margin-top: 0.25rem;
}

.link-field__actions {
  display: flex;
  gap: 0.5rem;
  padding-top: 0.5rem;
  border-top: 1px solid #e5e7eb;
}

.link-field__button {
  padding: 0.375rem 0.75rem;
  border-radius: 0.375rem;
  font-size: 0.875rem;
  border: 1px solid;
  cursor: pointer;
  transition: background-color 0.15s;
}

.link-field__button--edit,
.link-field__button--cancel {
  background-color: #f3f4f6;
  color: #374151;
  border-color: #d1d5db;
}

.link-field__button--edit:hover,
.link-field__button--cancel:hover {
  background-color: #e5e7eb;
}

.link-field__button--remove {
  background-color: #fef2f2;
  color: #dc2626;
  border-color: #fecaca;
}

.link-field__button--remove:hover {
  background-color: #fee2e2;
}

.link-field__button--save,
.link-field__button--add {
  background-color: #2563eb;
  color: white;
  border-color: #2563eb;
}

.link-field__button--save:hover,
.link-field__button--add:hover {
  background-color: #1d4ed8;
}

.link-field__button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.link-field__form {
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.link-field__form-group {
  display: flex;
  flex-direction: column;
}

.link-field__form-label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.25rem;
}

.link-field__input,
.link-field__select {
  padding: 0.5rem 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.link-field__input:focus,
.link-field__select:focus {
  outline: none;
  box-shadow: 0 0 0 2px #3b82f6;
  border-color: #3b82f6;
}

.link-field__hint {
  font-size: 0.75rem;
  color: #6b7280;
  font-style: italic;
}

.link-field__empty {
  padding: 1rem;
  text-align: center;
}

.link-field__error {
  margin-top: 0.25rem;
  font-size: 0.875rem;
  color: #dc2626;
}

.link-field__display {
  color: #1d2327;
}

.link-field__display--empty {
  color: #9ca3af;
  font-style: italic;
}

.link-field__display--link {
  color: #2563eb;
  text-decoration: none;
}

.link-field__display--link:hover {
  text-decoration: underline;
}

/*!*****************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!../gateway/react/packages/forms/node_modules/easymde/dist/easymde.min.css ***!
  \*****************************************************************************************************************************************************************************************************************************/
/**
 * easymde v2.20.0
 * Copyright Jeroen Akkerman
 * @link https://github.com/ionaru/easy-markdown-editor
 * @license MIT
 */
.CodeMirror{font-family:monospace;height:300px;color:#000;direction:ltr}.CodeMirror-lines{padding:4px 0}.CodeMirror pre.CodeMirror-line,.CodeMirror pre.CodeMirror-line-like{padding:0 4px}.CodeMirror-gutter-filler,.CodeMirror-scrollbar-filler{background-color:#fff}.CodeMirror-gutters{border-right:1px solid #ddd;background-color:#f7f7f7;white-space:nowrap}.CodeMirror-linenumber{padding:0 3px 0 5px;min-width:20px;text-align:right;color:#999;white-space:nowrap}.CodeMirror-guttermarker{color:#000}.CodeMirror-guttermarker-subtle{color:#999}.CodeMirror-cursor{border-left:1px solid #000;border-right:none;width:0}.CodeMirror div.CodeMirror-secondarycursor{border-left:1px solid silver}.cm-fat-cursor .CodeMirror-cursor{width:auto;border:0!important;background:#7e7}.cm-fat-cursor div.CodeMirror-cursors{z-index:1}.cm-fat-cursor .CodeMirror-line::-moz-selection, .cm-fat-cursor .CodeMirror-line>span::-moz-selection, .cm-fat-cursor .CodeMirror-line>span>span::-moz-selection{background:0 0}.cm-fat-cursor .CodeMirror-line::selection,.cm-fat-cursor .CodeMirror-line>span::selection,.cm-fat-cursor .CodeMirror-line>span>span::selection{background:0 0}.cm-fat-cursor .CodeMirror-line::-moz-selection,.cm-fat-cursor .CodeMirror-line>span::-moz-selection,.cm-fat-cursor .CodeMirror-line>span>span::-moz-selection{background:0 0}.cm-fat-cursor{caret-color:transparent}@keyframes blink{50%{background-color:transparent}}.cm-tab{display:inline-block;text-decoration:inherit}.CodeMirror-rulers{position:absolute;left:0;right:0;top:-50px;bottom:0;overflow:hidden}.CodeMirror-ruler{border-left:1px solid #ccc;top:0;bottom:0;position:absolute}.cm-s-default .cm-header{color:#00f}.cm-s-default .cm-quote{color:#090}.cm-negative{color:#d44}.cm-positive{color:#292}.cm-header,.cm-strong{font-weight:700}.cm-em{font-style:italic}.cm-link{text-decoration:underline}.cm-strikethrough{text-decoration:line-through}.cm-s-default .cm-keyword{color:#708}.cm-s-default .cm-atom{color:#219}.cm-s-default .cm-number{color:#164}.cm-s-default .cm-def{color:#00f}.cm-s-default .cm-variable-2{color:#05a}.cm-s-default .cm-type,.cm-s-default .cm-variable-3{color:#085}.cm-s-default .cm-comment{color:#a50}.cm-s-default .cm-string{color:#a11}.cm-s-default .cm-string-2{color:#f50}.cm-s-default .cm-meta{color:#555}.cm-s-default .cm-qualifier{color:#555}.cm-s-default .cm-builtin{color:#30a}.cm-s-default .cm-bracket{color:#997}.cm-s-default .cm-tag{color:#170}.cm-s-default .cm-attribute{color:#00c}.cm-s-default .cm-hr{color:#999}.cm-s-default .cm-link{color:#00c}.cm-s-default .cm-error{color:red}.cm-invalidchar{color:red}.CodeMirror-composing{border-bottom:2px solid}div.CodeMirror span.CodeMirror-matchingbracket{color:#0b0}div.CodeMirror span.CodeMirror-nonmatchingbracket{color:#a22}.CodeMirror-matchingtag{background:rgba(255,150,0,.3)}.CodeMirror-activeline-background{background:#e8f2ff}.CodeMirror{position:relative;overflow:hidden;background:#fff}.CodeMirror-scroll{overflow:scroll!important;margin-bottom:-50px;margin-right:-50px;padding-bottom:50px;height:100%;outline:0;position:relative;z-index:0}.CodeMirror-sizer{position:relative;border-right:50px solid transparent}.CodeMirror-gutter-filler,.CodeMirror-hscrollbar,.CodeMirror-scrollbar-filler,.CodeMirror-vscrollbar{position:absolute;z-index:6;display:none;outline:0}.CodeMirror-vscrollbar{right:0;top:0;overflow-x:hidden;overflow-y:scroll}.CodeMirror-hscrollbar{bottom:0;left:0;overflow-y:hidden;overflow-x:scroll}.CodeMirror-scrollbar-filler{right:0;bottom:0}.CodeMirror-gutter-filler{left:0;bottom:0}.CodeMirror-gutters{position:absolute;left:0;top:0;min-height:100%;z-index:3}.CodeMirror-gutter{white-space:normal;height:100%;display:inline-block;vertical-align:top;margin-bottom:-50px}.CodeMirror-gutter-wrapper{position:absolute;z-index:4;background:0 0!important;border:none!important}.CodeMirror-gutter-background{position:absolute;top:0;bottom:0;z-index:4}.CodeMirror-gutter-elt{position:absolute;cursor:default;z-index:4}.CodeMirror-gutter-wrapper ::-moz-selection{background-color:transparent}.CodeMirror-gutter-wrapper ::selection{background-color:transparent}.CodeMirror-gutter-wrapper ::-moz-selection{background-color:transparent}.CodeMirror-lines{cursor:text;min-height:1px}.CodeMirror pre.CodeMirror-line,.CodeMirror pre.CodeMirror-line-like{border-radius:0;border-width:0;background:0 0;font-family:inherit;font-size:inherit;margin:0;white-space:pre;word-wrap:normal;line-height:inherit;color:inherit;z-index:2;position:relative;overflow:visible;-webkit-tap-highlight-color:transparent;font-variant-ligatures:contextual}.CodeMirror-wrap pre.CodeMirror-line,.CodeMirror-wrap pre.CodeMirror-line-like{word-wrap:break-word;white-space:pre-wrap;word-break:normal}.CodeMirror-linebackground{position:absolute;left:0;right:0;top:0;bottom:0;z-index:0}.CodeMirror-linewidget{position:relative;z-index:2;padding:.1px}.CodeMirror-rtl pre{direction:rtl}.CodeMirror-code{outline:0}.CodeMirror-gutter,.CodeMirror-gutters,.CodeMirror-linenumber,.CodeMirror-scroll,.CodeMirror-sizer{box-sizing:content-box}.CodeMirror-measure{position:absolute;width:100%;height:0;overflow:hidden;visibility:hidden}.CodeMirror-cursor{position:absolute;pointer-events:none}.CodeMirror-measure pre{position:static}div.CodeMirror-cursors{visibility:hidden;position:relative;z-index:3}div.CodeMirror-dragcursors{visibility:visible}.CodeMirror-focused div.CodeMirror-cursors{visibility:visible}.CodeMirror-selected{background:#d9d9d9}.CodeMirror-focused .CodeMirror-selected{background:#d7d4f0}.CodeMirror-crosshair{cursor:crosshair}.CodeMirror-line::-moz-selection, .CodeMirror-line>span::-moz-selection, .CodeMirror-line>span>span::-moz-selection{background:#d7d4f0}.CodeMirror-line::selection,.CodeMirror-line>span::selection,.CodeMirror-line>span>span::selection{background:#d7d4f0}.CodeMirror-line::-moz-selection,.CodeMirror-line>span::-moz-selection,.CodeMirror-line>span>span::-moz-selection{background:#d7d4f0}.cm-searching{background-color:#ffa;background-color:rgba(255,255,0,.4)}.cm-force-border{padding-right:.1px}@media print{.CodeMirror div.CodeMirror-cursors{visibility:hidden}}.cm-tab-wrap-hack:after{content:''}span.CodeMirror-selectedtext{background:0 0}.EasyMDEContainer{display:block}.CodeMirror-rtl pre{direction:rtl}.EasyMDEContainer.sided--no-fullscreen{display:flex;flex-direction:row;flex-wrap:wrap}.EasyMDEContainer .CodeMirror{box-sizing:border-box;height:auto;border:1px solid #ced4da;border-bottom-left-radius:4px;border-bottom-right-radius:4px;padding:10px;font:inherit;z-index:0;word-wrap:break-word}.EasyMDEContainer .CodeMirror-scroll{cursor:text}.EasyMDEContainer .CodeMirror-fullscreen{background:#fff;position:fixed!important;top:50px;left:0;right:0;bottom:0;height:auto;z-index:8;border-right:none!important;border-bottom-right-radius:0!important}.EasyMDEContainer .CodeMirror-sided{width:50%!important}.EasyMDEContainer.sided--no-fullscreen .CodeMirror-sided{border-right:none!important;border-bottom-right-radius:0;position:relative;flex:1 1 auto}.EasyMDEContainer .CodeMirror-placeholder{opacity:.5}.EasyMDEContainer .CodeMirror-focused .CodeMirror-selected{background:#d9d9d9}.editor-toolbar{position:relative;-webkit-user-select:none;-moz-user-select:none;-o-user-select:none;user-select:none;padding:9px 10px;border-top:1px solid #ced4da;border-left:1px solid #ced4da;border-right:1px solid #ced4da;border-top-left-radius:4px;border-top-right-radius:4px}.editor-toolbar.fullscreen{width:100%;height:50px;padding-top:10px;padding-bottom:10px;box-sizing:border-box;background:#fff;border:0;position:fixed;top:0;left:0;opacity:1;z-index:9}.editor-toolbar.fullscreen::before{width:20px;height:50px;background:linear-gradient(to right,#fff 0,rgba(255,255,255,0) 100%);position:fixed;top:0;left:0;margin:0;padding:0}.editor-toolbar.fullscreen::after{width:20px;height:50px;background:linear-gradient(to right,rgba(255,255,255,0) 0,#fff 100%);position:fixed;top:0;right:0;margin:0;padding:0}.EasyMDEContainer.sided--no-fullscreen .editor-toolbar{width:100%}.editor-toolbar .easymde-dropdown,.editor-toolbar button{background:0 0;display:inline-block;text-align:center;text-decoration:none!important;height:30px;margin:0;padding:0;border:1px solid transparent;border-radius:3px;cursor:pointer}.editor-toolbar button{font-weight:700;min-width:30px;padding:0 6px;white-space:nowrap}.editor-toolbar button.active,.editor-toolbar button:hover{background:#fcfcfc;border-color:#95a5a6}.editor-toolbar i.separator{display:inline-block;width:0;border-left:1px solid #d9d9d9;border-right:1px solid #fff;color:transparent;text-indent:-10px;margin:0 6px}.editor-toolbar button:after{font-family:Arial,"Helvetica Neue",Helvetica,sans-serif;font-size:65%;vertical-align:text-bottom;position:relative;top:2px}.editor-toolbar button.heading-1:after{content:"1"}.editor-toolbar button.heading-2:after{content:"2"}.editor-toolbar button.heading-3:after{content:"3"}.editor-toolbar button.heading-bigger:after{content:"▲"}.editor-toolbar button.heading-smaller:after{content:"▼"}.editor-toolbar.disabled-for-preview button:not(.no-disable){opacity:.6;pointer-events:none}@media only screen and (max-width:700px){.editor-toolbar i.no-mobile{display:none}}.editor-statusbar{padding:8px 10px;font-size:12px;color:#959694;text-align:right}.EasyMDEContainer.sided--no-fullscreen .editor-statusbar{width:100%}.editor-statusbar span{display:inline-block;min-width:4em;margin-left:1em}.editor-statusbar .lines:before{content:'lines: '}.editor-statusbar .words:before{content:'words: '}.editor-statusbar .characters:before{content:'characters: '}.editor-preview-full{position:absolute;width:100%;height:100%;top:0;left:0;z-index:7;overflow:auto;display:none;box-sizing:border-box}.editor-preview-side{position:fixed;bottom:0;width:50%;top:50px;right:0;z-index:9;overflow:auto;display:none;box-sizing:border-box;border:1px solid #ddd;word-wrap:break-word}.editor-preview-active-side{display:block}.EasyMDEContainer.sided--no-fullscreen .editor-preview-active-side{flex:1 1 auto;height:auto;position:static}.editor-preview-active{display:block}.editor-preview{padding:10px;background:#fafafa}.editor-preview>p{margin-top:0}.editor-preview pre{background:#eee;margin-bottom:10px}.editor-preview table td,.editor-preview table th{border:1px solid #ddd;padding:5px}.cm-s-easymde .cm-tag{color:#63a35c}.cm-s-easymde .cm-attribute{color:#795da3}.cm-s-easymde .cm-string{color:#183691}.cm-s-easymde .cm-header-1{font-size:calc(1.375rem + 1.5vw)}.cm-s-easymde .cm-header-2{font-size:calc(1.325rem + .9vw)}.cm-s-easymde .cm-header-3{font-size:calc(1.3rem + .6vw)}.cm-s-easymde .cm-header-4{font-size:calc(1.275rem + .3vw)}.cm-s-easymde .cm-header-5{font-size:1.25rem}.cm-s-easymde .cm-header-6{font-size:1rem}.cm-s-easymde .cm-header-1,.cm-s-easymde .cm-header-2,.cm-s-easymde .cm-header-3,.cm-s-easymde .cm-header-4,.cm-s-easymde .cm-header-5,.cm-s-easymde .cm-header-6{margin-bottom:.5rem;line-height:1.2}.cm-s-easymde .cm-comment{background:rgba(0,0,0,.05);border-radius:2px}.cm-s-easymde .cm-link{color:#7f8c8d}.cm-s-easymde .cm-url{color:#aab2b3}.cm-s-easymde .cm-quote{color:#7f8c8d;font-style:italic}.editor-toolbar .easymde-dropdown{position:relative;background:linear-gradient(to bottom right,#fff 0,#fff 84%,#333 50%,#333 100%);border-radius:0;border:1px solid #fff}.editor-toolbar .easymde-dropdown:hover{background:linear-gradient(to bottom right,#fff 0,#fff 84%,#333 50%,#333 100%)}.easymde-dropdown-content{display:block;visibility:hidden;position:absolute;background-color:#f9f9f9;box-shadow:0 8px 16px 0 rgba(0,0,0,.2);padding:8px;z-index:2;top:30px}.easymde-dropdown:active .easymde-dropdown-content,.easymde-dropdown:focus .easymde-dropdown-content,.easymde-dropdown:focus-within .easymde-dropdown-content{visibility:visible}.easymde-dropdown-content button{display:block}span[data-img-src]::after{content:'';background-image:var(--bg-image);display:block;max-height:100%;max-width:100%;background-size:contain;height:0;padding-top:var(--height);width:var(--width);background-repeat:no-repeat}.CodeMirror .cm-spell-error:not(.cm-url):not(.cm-comment):not(.cm-tag):not(.cm-word){background:rgba(255,0,0,.15)}
/*!*******************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!../gateway/react/packages/forms/dist/components/field-types/markdown/markdown-style.css ***!
  \*******************************************************************************************************************************************************************************************************************************************/
.markdown-field__label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.25rem;
}

.markdown-field__required {
  color: #ef4444;
  margin-left: 0.25rem;
}

.markdown-field__help {
  font-size: 0.875rem;
  color: #6b7280;
  margin-bottom: 0.5rem;
}

.markdown-field__loading {
  padding: 1rem;
  color: #6b7280;
}

.markdown-field__wrapper {
  /* SimpleMDE editor will be rendered inside */
}

.markdown-field__wrapper--error .CodeMirror {
  border-color: #ef4444;
}

.markdown-field__error {
  margin-top: 0.25rem;
  font-size: 0.875rem;
  color: #dc2626;
}

.markdown-field__display {
  color: #1d2327;
  font-family: monospace;
  font-size: 0.875rem;
}

.markdown-field__display--empty {
  color: #9ca3af;
  font-style: italic;
}

/*!***************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!../gateway/react/packages/forms/dist/components/field-types/number/number-style.css ***!
  \***************************************************************************************************************************************************************************************************************************************/
.number-field__label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.25rem;
}

.number-field__required {
  color: #ef4444;
  margin-left: 0.25rem;
}

.number-field__input {
  padding: 0.5rem 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.number-field__input:focus {
  outline: none;
  box-shadow: 0 0 0 2px #3b82f6;
  border-color: #3b82f6;
}

.number-field__display {
  color: #1d2327;
}

.number-field__display--empty {
  color: #9ca3af;
  font-style: italic;
}

/*!***************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!../gateway/react/packages/forms/dist/components/field-types/oembed/oembed-style.css ***!
  \***************************************************************************************************************************************************************************************************************************************/
.oembed-field__label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.25rem;
}

.oembed-field__required {
  color: #ef4444;
  margin-left: 0.25rem;
}

.oembed-field__help {
  font-size: 0.875rem;
  color: #6b7280;
  margin-bottom: 0.5rem;
}

.oembed-field__container {
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
}

.oembed-field__container--error {
  border-color: #ef4444;
}

.oembed-field__preview {
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.oembed-field__embed {
  position: relative;
  background-color: #000;
  border-radius: 0.375rem;
  overflow: hidden;
}

.oembed-field__embed-container iframe {
  aspect-ratio: 16 / 9;
}

.oembed-field__embed-container blockquote {
  margin: 0;
}

.oembed-field__meta {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.oembed-field__title {
  font-weight: 500;
  color: #111827;
}

.oembed-field__author {
  font-size: 0.875rem;
  color: #4b5563;
}

.oembed-field__url {
  font-size: 0.875rem;
  color: #2563eb;
  word-break: break-all;
  display: inline-block;
}

.oembed-field__url:hover {
  color: #1d4ed8;
}

.oembed-field__provider {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.75rem;
  color: #6b7280;
}

.oembed-field__provider-name {
  padding: 0.25rem 0.5rem;
  background-color: #f3f4f6;
  border-radius: 0.25rem;
}

.oembed-field__dimensions {
  /* Inherits from provider */
}

.oembed-field__actions {
  display: flex;
  gap: 0.5rem;
  padding-top: 0.5rem;
  border-top: 1px solid #e5e7eb;
}

.oembed-field__button {
  padding: 0.375rem 0.75rem;
  border-radius: 0.375rem;
  font-size: 0.875rem;
  border: 1px solid;
  cursor: pointer;
  transition: background-color 0.15s;
}

.oembed-field__button--edit,
.oembed-field__button--clear {
  background-color: #f3f4f6;
  color: #374151;
  border-color: #d1d5db;
}

.oembed-field__button--edit:hover,
.oembed-field__button--clear:hover {
  background-color: #e5e7eb;
}

.oembed-field__button--remove {
  background-color: #fef2f2;
  color: #dc2626;
  border-color: #fecaca;
}

.oembed-field__button--remove:hover {
  background-color: #fee2e2;
}

.oembed-field__button--submit {
  background-color: #2563eb;
  color: white;
  border-color: #2563eb;
}

.oembed-field__button--submit:hover:not(:disabled) {
  background-color: #1d4ed8;
}

.oembed-field__button:disabled {
  background-color: #9ca3af;
  cursor: not-allowed;
}

.oembed-field__form {
  padding: 1rem;
}

.oembed-field__form-inner {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.oembed-field__input {
  padding: 0.5rem 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.oembed-field__input:focus {
  outline: none;
  box-shadow: 0 0 0 2px #3b82f6;
  border-color: #3b82f6;
}

.oembed-field__input:disabled {
  background-color: #f3f4f6;
  cursor: not-allowed;
}

.oembed-field__error-message {
  font-size: 0.875rem;
  color: #dc2626;
  background-color: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 0.375rem;
  padding: 0.5rem;
}

.oembed-field__loading {
  font-size: 0.875rem;
  color: #4b5563;
}

.oembed-field__buttons {
  display: flex;
  gap: 0.5rem;
}

.oembed-field__hint {
  font-size: 0.75rem;
  color: #6b7280;
}

.oembed-field__error {
  margin-top: 0.25rem;
  font-size: 0.875rem;
  color: #dc2626;
}

.oembed-field__display {
  color: #1d2327;
}

.oembed-field__display--empty {
  color: #9ca3af;
  font-style: italic;
}

.oembed-field__display--link {
  color: #2563eb;
  text-decoration: none;
}

.oembed-field__display--link:hover {
  text-decoration: underline;
}

/*!*******************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!../gateway/react/packages/forms/dist/components/field-types/password/password-style.css ***!
  \*******************************************************************************************************************************************************************************************************************************************/
.password-field__label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.25rem;
}

.password-field__required {
  color: #ef4444;
  margin-left: 0.25rem;
}

.password-field__wrapper {
  position: relative;
}

.password-field__input {
  padding: 0.5rem 0.75rem;
  padding-right: 2.5rem;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.password-field__input:focus {
  outline: none;
  box-shadow: 0 0 0 2px #3b82f6;
  border-color: #3b82f6;
}

.password-field__input--error {
  border-color: #ef4444;
}

.password-field__input--error:focus {
  box-shadow: 0 0 0 2px #ef4444;
  border-color: #ef4444;
}

.password-field__toggle {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  padding: 0 0.75rem;
  display: flex;
  align-items: center;
  color: #6b7280;
  background: none;
  border: none;
  cursor: pointer;
  outline: none;
  transition: color 0.15s;
}

.password-field__toggle:hover {
  color: #374151;
}

.password-field__toggle:focus {
  outline: none;
}

.password-field__icon {
  width: 1.25rem;
  height: 1.25rem;
}

.password-field__help {
  margin-top: 0.25rem;
  font-size: 0.875rem;
  color: #6b7280;
}

.password-field__error {
  margin-top: 0.25rem;
  font-size: 0.875rem;
  color: #dc2626;
}

.password-field__display {
  color: #1d2327;
}

.password-field__display--empty {
  color: #9ca3af;
  font-style: italic;
}

.password-field__display--masked {
  font-family: monospace;
  letter-spacing: 0.1em;
}

/*!*************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!../gateway/react/packages/forms/dist/components/field-types/post-object/post-object-style.css ***!
  \*************************************************************************************************************************************************************************************************************************************************/
.post-object-field__label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.25rem;
}

.post-object-field__help {
  font-size: 0.875rem;
  color: #6b7280;
  margin-bottom: 0.5rem;
}

.post-object-field__wrapper {
  position: relative;
}

.post-object-field__selected {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  background-color: #f9fafb;
}

.post-object-field__selected--error {
  border-color: #ef4444;
}

.post-object-field__post-info {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex: 1;
  min-width: 0;
}

.post-object-field__post-icon {
  flex-shrink: 0;
}

.post-object-field__icon {
  width: 1.25rem;
  height: 1.25rem;
  color: #2563eb;
}

.post-object-field__post-details {
  flex: 1;
  min-width: 0;
}

.post-object-field__post-title {
  font-weight: 500;
  color: #111827;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.post-object-field__post-meta {
  display: flex;
  gap: 0.5rem;
  margin-top: 0.125rem;
}

.post-object-field__post-id {
  font-size: 0.75rem;
  color: #6b7280;
}

.post-object-field__post-status {
  font-size: 0.75rem;
  color: #d97706;
}

.post-object-field__button {
  padding: 0.375rem 0.75rem;
  border-radius: 0.375rem;
  font-size: 0.875rem;
  border: 1px solid;
  cursor: pointer;
  flex-shrink: 0;
  transition: background-color 0.15s;
}

.post-object-field__button--remove {
  margin-left: 0.5rem;
  background-color: #fef2f2;
  color: #dc2626;
  border-color: #fecaca;
}

.post-object-field__button--remove:hover {
  background-color: #fee2e2;
}

.post-object-field__input {
  padding: 0.5rem 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.post-object-field__input:focus {
  outline: none;
  box-shadow: 0 0 0 2px #3b82f6;
  border-color: #3b82f6;
}

.post-object-field__input--error {
  border-color: #ef4444;
}

.post-object-field__dropdown {
  position: absolute;
  z-index: 10;
  width: 100%;
  margin-top: 0.25rem;
  background-color: white;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  max-height: 15rem;
  overflow: auto;
}

.post-object-field__dropdown-message {
  padding: 0.75rem 1rem;
  font-size: 0.875rem;
  color: #6b7280;
}

.post-object-field__results {
  list-style: none;
  margin: 0;
  padding: 0;
}

.post-object-field__result-item {
  /* No specific styles needed */
}

.post-object-field__result-button {
  width: 100%;
  padding: 0.5rem 1rem;
  text-align: left;
  background: none;
  border: none;
  cursor: pointer;
  transition: background-color 0.15s;
}

.post-object-field__result-button:hover,
.post-object-field__result-button:focus {
  background-color: #f3f4f6;
  outline: none;
}

.post-object-field__result-title {
  font-weight: 500;
  color: #111827;
}

.post-object-field__result-meta {
  display: flex;
  gap: 0.5rem;
  margin-top: 0.125rem;
}

.post-object-field__result-id {
  font-size: 0.75rem;
  color: #6b7280;
}

.post-object-field__result-status {
  font-size: 0.75rem;
  color: #d97706;
}

.post-object-field__error {
  margin-top: 0.25rem;
  font-size: 0.875rem;
  color: #dc2626;
}

.post-object-field__display {
  color: #1d2327;
}

.post-object-field__display--empty {
  color: #9ca3af;
  font-style: italic;
}

.post-object-field__display-id {
  font-size: 0.875rem;
  color: #6b7280;
}

/*!*************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!../gateway/react/packages/forms/dist/components/field-types/radio/radio-style.css ***!
  \*************************************************************************************************************************************************************************************************************************************/
.radio-field__label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.5rem;
}

.radio-field__required {
  color: #ef4444;
  margin-left: 0.25rem;
}

.radio-field__options {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.radio-field__options--horizontal {
  flex-direction: row;
  flex-wrap: wrap;
  gap: 1rem;
}

.radio-field__option {
  display: flex;
  align-items: center;
}

.radio-field__input {
  width: 1rem;
  height: 1rem;
  color: #2563eb;
  border-color: #d1d5db;
}

.radio-field__input:focus {
  outline: none;
  box-shadow: 0 0 0 2px #3b82f6;
}

.radio-field__option-label {
  margin-left: 0.5rem;
  font-size: 0.875rem;
  color: #374151;
  cursor: pointer;
}

.radio-field__help {
  margin-top: 0.5rem;
  font-size: 0.875rem;
  color: #6b7280;
}

.radio-field__error {
  margin-top: 0.25rem;
  font-size: 0.875rem;
  color: #dc2626;
}

.radio-field__display {
  color: #1d2327;
}

.radio-field__display--empty {
  color: #9ca3af;
  font-style: italic;
}

/*!*************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!../gateway/react/packages/forms/dist/components/field-types/range/range-style.css ***!
  \*************************************************************************************************************************************************************************************************************************************/
.range-field__label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.25rem;
}

.range-field__required {
  color: #ef4444;
  margin-left: 0.25rem;
}

.range-field__wrapper {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.range-field__slider-container {
  flex: 1;
}

.range-field__slider-wrapper {
  position: relative;
}

.range-field__slider {
  width: 100%;
  height: 0.5rem;
  background-color: #e5e7eb;
  border-radius: 0.5rem;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  cursor: pointer;
  accent-color: #2563eb;
}

.range-field__slider::-webkit-slider-thumb {
  -webkit-appearance: none;
          appearance: none;
  width: 1rem;
  height: 1rem;
  background-color: #2563eb;
  border-radius: 50%;
  cursor: pointer;
}

.range-field__slider::-moz-range-thumb {
  width: 1rem;
  height: 1rem;
  background-color: #2563eb;
  border-radius: 50%;
  cursor: pointer;
  border: none;
}

.range-field__minmax {
  display: flex;
  justify-content: space-between;
  font-size: 0.75rem;
  color: #6b7280;
  margin-top: 0.25rem;
}

.range-field__min,
.range-field__max {
  /* Inherits from minmax */
}

.range-field__value-container {
  flex-shrink: 0;
}

.range-field__value-wrapper {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.range-field__number-input {
  width: 5rem;
  padding: 0.25rem 0.5rem;
  font-size: 0.875rem;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.range-field__number-input:focus {
  outline: none;
  box-shadow: 0 0 0 2px #3b82f6;
  border-color: #3b82f6;
}

.range-field__append,
.range-field__prepend {
  font-size: 0.875rem;
  color: #4b5563;
}

.range-field__help {
  margin-top: 0.25rem;
  font-size: 0.875rem;
  color: #6b7280;
}

.range-field__error {
  margin-top: 0.25rem;
  font-size: 0.875rem;
  color: #dc2626;
}

.range-field__display {
  color: #1d2327;
}

.range-field__display--empty {
  color: #9ca3af;
  font-style: italic;
}

/*!*******************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!../gateway/react/packages/forms/dist/components/field-types/readonly/readonly-style.css ***!
  \*******************************************************************************************************************************************************************************************************************************************/
.readonly-field__label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.25rem;
}

.readonly-field__input {
  padding: 0.5rem 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  background-color: #f9fafb;
  color: #4b5563;
  cursor: not-allowed;
}

.readonly-field__input:focus {
  outline: none;
}

.readonly-field__help {
  margin-top: 0.25rem;
  font-size: 0.875rem;
  color: #6b7280;
}

.readonly-field__display {
  color: #1d2327;
}

.readonly-field__display--empty {
  color: #9ca3af;
  font-style: italic;
}

/*!*******************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!../gateway/react/packages/forms/dist/components/field-types/textarea/textarea-style.css ***!
  \*******************************************************************************************************************************************************************************************************************************************/
.textarea-field {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.textarea-field__label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.25rem;
}

.textarea-field__input {
  padding: 0.5rem 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  font-family: inherit;
  font-size: 0.875rem;
  line-height: 1.5;
  color: #1f2937;
  background-color: #ffffff;
  resize: vertical;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.textarea-field__input:focus {
  outline: none;
  border-color: #3b82f6;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.textarea-field__input::-moz-placeholder {
  color: #9ca3af;
}

.textarea-field__input::placeholder {
  color: #9ca3af;
}

.textarea-field__help {
  font-size: 0.75rem;
  color: #6b7280;
  margin: 0;
}

.textarea-field__display {
  font-size: 0.875rem;
  color: #1f2937;
  white-space: pre-wrap;
  word-break: break-word;
  padding: 0.5rem;
  background-color: #f9fafb;
  border-radius: 0.375rem;
  border: 1px solid #e5e7eb;
}

.textarea-field__display--empty {
  color: #9ca3af;
  font-style: italic;
}

/*!*************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!../gateway/react/packages/forms/dist/components/field-types/time-picker/time-picker-style.css ***!
  \*************************************************************************************************************************************************************************************************************************************************/
/* Time Picker Field Styles */

.time-picker-field {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.time-picker-field__label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.25rem;
}

.time-picker-field__input {
  padding: 0.5rem 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  font-family: inherit;
  font-size: 0.875rem;
  color: #1f2937;
  background-color: #ffffff;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.time-picker-field__input:focus {
  outline: none;
  border-color: #3b82f6;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.time-picker-field__input::-moz-placeholder {
  color: #9ca3af;
}

.time-picker-field__input::placeholder {
  color: #9ca3af;
}

.time-picker-field__help {
  font-size: 0.75rem;
  color: #6b7280;
  margin: 0;
}

.time-picker-field__error {
  font-size: 0.75rem;
  color: #ef4444;
  margin: 0;
}

.time-picker-field__display {
  font-size: 0.875rem;
  color: #1f2937;
  padding: 0.5rem;
  background-color: #f9fafb;
  border-radius: 0.375rem;
  border: 1px solid #e5e7eb;
}

/* React DatePicker Overrides for Time Picker */
.react-datepicker-wrapper {
  width: 100%;
}

.react-datepicker__input-container {
  width: 100%;
}

.react-datepicker-popper {
  z-index: 9999;
}

.react-datepicker__time-container .react-datepicker__time {
  background: white;
}

.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box {
  width: 100%;
}

/*!*********************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!../gateway/react/packages/forms/dist/components/field-types/url/url-style.css ***!
  \*********************************************************************************************************************************************************************************************************************************/
/* URL Field Styles */

.url-field {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.url-field__label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.25rem;
}

.url-field__input {
  padding: 0.5rem 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  font-family: inherit;
  font-size: 0.875rem;
  color: #1f2937;
  background-color: #ffffff;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.url-field__input:focus {
  outline: none;
  border-color: #3b82f6;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.url-field__input::-moz-placeholder {
  color: #9ca3af;
}

.url-field__input::placeholder {
  color: #9ca3af;
}

.url-field__input:invalid {
  border-color: #f87171;
}

.url-field__help {
  font-size: 0.75rem;
  color: #6b7280;
  margin: 0;
}

.url-field__error {
  font-size: 0.75rem;
  color: #ef4444;
  margin: 0;
}

.url-field__display {
  font-size: 0.875rem;
  color: #1f2937;
}

.url-field__link {
  color: #3b82f6;
  text-decoration: underline;
  word-break: break-all;
  transition: color 0.15s ease-in-out;
}

.url-field__link:hover {
  color: #2563eb;
}

.url-field__link:visited {
  color: #7c3aed;
}

.url-field__display--empty {
  color: #9ca3af;
  font-style: italic;
}

/*!***********************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!../gateway/react/packages/forms/dist/components/field-types/user/user-style.css ***!
  \***********************************************************************************************************************************************************************************************************************************/
/* User Field Styles */

.user-field {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.user-field__label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.25rem;
}

.user-field__selected {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  background-color: #f9fafb;
}

.user-field__user-info {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex: 1;
}

.user-field__avatar {
  width: 48px;
  height: 48px;
  border-radius: 9999px;
  -o-object-fit: cover;
     object-fit: cover;
  border: 2px solid #e5e7eb;
}

.user-field__user-details {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.user-field__user-name {
  font-size: 0.875rem;
  font-weight: 600;
  color: #1f2937;
}

.user-field__user-email {
  font-size: 0.75rem;
  color: #6b7280;
}

.user-field__user-roles {
  display: flex;
  gap: 0.25rem;
  flex-wrap: wrap;
  margin-top: 0.25rem;
}

.user-field__role-badge {
  display: inline-block;
  padding: 0.125rem 0.5rem;
  font-size: 0.625rem;
  font-weight: 500;
  color: #3b82f6;
  background-color: #dbeafe;
  border-radius: 9999px;
  text-transform: capitalize;
}

.user-field__clear-button {
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  background-color: #ef4444;
  color: #ffffff;
  border-radius: 9999px;
  font-size: 1.25rem;
  line-height: 1;
  cursor: pointer;
  transition: background-color 0.15s ease-in-out;
  flex-shrink: 0;
}

.user-field__clear-button:hover {
  background-color: #dc2626;
}

.user-field__search-container {
  position: relative;
}

.user-field__search-input {
  padding: 0.5rem 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  font-family: inherit;
  font-size: 0.875rem;
  color: #1f2937;
  background-color: #ffffff;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.user-field__search-input:focus {
  outline: none;
  border-color: #3b82f6;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.user-field__search-input::-moz-placeholder {
  color: #9ca3af;
}

.user-field__search-input::placeholder {
  color: #9ca3af;
}

.user-field__loading {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  margin-top: 0.25rem;
  padding: 0.75rem;
  background-color: #ffffff;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
  font-size: 0.875rem;
  color: #6b7280;
  text-align: center;
  z-index: 10;
}

.user-field__dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  margin-top: 0.25rem;
  max-height: 300px;
  overflow-y: auto;
  background-color: #ffffff;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
  z-index: 10;
}

.user-field__dropdown-item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  width: 100%;
  padding: 0.75rem;
  border: none;
  background-color: transparent;
  cursor: pointer;
  text-align: left;
  transition: background-color 0.15s ease-in-out;
  border-bottom: 1px solid #f3f4f6;
}

.user-field__dropdown-item:last-child {
  border-bottom: none;
}

.user-field__dropdown-item:hover {
  background-color: #f9fafb;
}

.user-field__no-results {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  margin-top: 0.25rem;
  padding: 0.75rem;
  background-color: #ffffff;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
  font-size: 0.875rem;
  color: #6b7280;
  text-align: center;
  z-index: 10;
}

.user-field__help {
  font-size: 0.75rem;
  color: #6b7280;
  margin: 0;
}

.user-field__error {
  font-size: 0.75rem;
  color: #ef4444;
  margin: 0;
}

.user-field__display {
  font-size: 0.875rem;
  color: #1f2937;
}

.user-field__display--empty {
  color: #9ca3af;
  font-style: italic;
}

/*!*****************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!../gateway/react/packages/forms/dist/components/field-types/wysiwyg/wysiwyg-style.css ***!
  \*****************************************************************************************************************************************************************************************************************************************/
/* WYSIWYG Field Styles */

.wysiwyg-field {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.wysiwyg-field__label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.25rem;
}

.wysiwyg-field__loading {
  padding: 1rem;
  text-align: center;
  font-size: 0.875rem;
  color: #6b7280;
  background-color: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 0.375rem;
}

.wysiwyg-field__editor-container {
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  overflow: hidden;
  background-color: #ffffff;
}

.wysiwyg-field__toolbar {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.5rem;
  background-color: #f9fafb;
  border-bottom: 1px solid #e5e7eb;
  flex-wrap: wrap;
}

.wysiwyg-field__toolbar-button {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  height: 32px;
  padding: 0.25rem 0.5rem;
  border: 1px solid #d1d5db;
  background-color: #ffffff;
  border-radius: 0.25rem;
  font-size: 0.875rem;
  color: #374151;
  cursor: pointer;
  transition: all 0.15s ease-in-out;
}

.wysiwyg-field__toolbar-button:hover:not(:disabled) {
  background-color: #f3f4f6;
  border-color: #9ca3af;
}

.wysiwyg-field__toolbar-button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.wysiwyg-field__toolbar-button--active {
  background-color: #3b82f6;
  border-color: #3b82f6;
  color: #ffffff;
}

.wysiwyg-field__toolbar-button--active:hover {
  background-color: #2563eb;
  border-color: #2563eb;
}

.wysiwyg-field__toolbar-separator {
  width: 1px;
  height: 24px;
  background-color: #d1d5db;
  margin: 0 0.25rem;
}

.wysiwyg-field__content {
  min-height: 200px;
}

.wysiwyg-field__content .ProseMirror {
  padding: 1rem;
  min-height: 200px;
  outline: none;
  font-size: 0.875rem;
  line-height: 1.6;
  color: #1f2937;
}

.wysiwyg-field__content .ProseMirror:focus {
  outline: none;
}

.wysiwyg-field__content .ProseMirror p.is-editor-empty:first-child::before {
  content: attr(data-placeholder);
  color: #9ca3af;
  pointer-events: none;
  height: 0;
  float: left;
}

.wysiwyg-field__content .ProseMirror h2 {
  font-size: 1.5rem;
  font-weight: 700;
  margin-top: 1rem;
  margin-bottom: 0.5rem;
  line-height: 1.3;
}

.wysiwyg-field__content .ProseMirror h3 {
  font-size: 1.25rem;
  font-weight: 600;
  margin-top: 0.75rem;
  margin-bottom: 0.5rem;
  line-height: 1.4;
}

.wysiwyg-field__content .ProseMirror p {
  margin-bottom: 0.75rem;
}

.wysiwyg-field__content .ProseMirror p:last-child {
  margin-bottom: 0;
}

.wysiwyg-field__content .ProseMirror ul,
.wysiwyg-field__content .ProseMirror ol {
  padding-left: 1.5rem;
  margin-bottom: 0.75rem;
}

.wysiwyg-field__content .ProseMirror li {
  margin-bottom: 0.25rem;
}

.wysiwyg-field__content .ProseMirror a {
  color: #3b82f6;
  text-decoration: underline;
}

.wysiwyg-field__content .ProseMirror a:hover {
  color: #2563eb;
}

.wysiwyg-field__content .ProseMirror strong {
  font-weight: 700;
}

.wysiwyg-field__content .ProseMirror em {
  font-style: italic;
}

.wysiwyg-field__content .ProseMirror u {
  text-decoration: underline;
}

.wysiwyg-field__content .ProseMirror s {
  text-decoration: line-through;
}

.wysiwyg-field__help {
  font-size: 0.75rem;
  color: #6b7280;
  margin: 0;
}

.wysiwyg-field__error {
  font-size: 0.75rem;
  color: #ef4444;
  margin: 0;
}

.wysiwyg-field__display {
  font-size: 0.875rem;
  line-height: 1.6;
  color: #1f2937;
  padding: 1rem;
  background-color: #f9fafb;
  border-radius: 0.375rem;
  border: 1px solid #e5e7eb;
}

.wysiwyg-field__display h2 {
  font-size: 1.5rem;
  font-weight: 700;
  margin-top: 1rem;
  margin-bottom: 0.5rem;
  line-height: 1.3;
}

.wysiwyg-field__display h2:first-child {
  margin-top: 0;
}

.wysiwyg-field__display h3 {
  font-size: 1.25rem;
  font-weight: 600;
  margin-top: 0.75rem;
  margin-bottom: 0.5rem;
  line-height: 1.4;
}

.wysiwyg-field__display h3:first-child {
  margin-top: 0;
}

.wysiwyg-field__display p {
  margin-bottom: 0.75rem;
}

.wysiwyg-field__display p:last-child {
  margin-bottom: 0;
}

.wysiwyg-field__display ul,
.wysiwyg-field__display ol {
  padding-left: 1.5rem;
  margin-bottom: 0.75rem;
}

.wysiwyg-field__display li {
  margin-bottom: 0.25rem;
}

.wysiwyg-field__display a {
  color: #3b82f6;
  text-decoration: underline;
}

.wysiwyg-field__display a:hover {
  color: #2563eb;
}

.wysiwyg-field__display strong {
  font-weight: 700;
}

.wysiwyg-field__display em {
  font-style: italic;
}

.wysiwyg-field__display u {
  text-decoration: underline;
}

.wysiwyg-field__display s {
  text-decoration: line-through;
}

.wysiwyg-field__display--empty {
  color: #9ca3af;
  font-style: italic;
}

/*!***********************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!../gateway/react/packages/forms/dist/components/field-types/slug/slug-style.css ***!
  \***********************************************************************************************************************************************************************************************************************************/
.slug-field {
  margin-bottom: 1rem;
}

.slug-field__label {
  display: block;
  margin-bottom: 0.5rem;
  font-weight: 500;
  color: #1e293b;
}

.slug-field__required {
  color: #dc2626;
  margin-left: 0.25rem;
}

.slug-field__input-wrapper {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  position: relative;
}

.slug-field__prefix {
  color: #64748b;
  font-family: monospace;
  font-size: 0.875rem;
  white-space: nowrap;
}

.slug-field__input {
  flex: 1;
  padding: 0.5rem;
  border: 1px solid #cbd5e1;
  border-radius: 0.375rem;
  font-size: 0.875rem;
  font-family: monospace;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.slug-field__input:focus {
  outline: none;
  border-color: #3b82f6;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.slug-field__input--error {
  border-color: #dc2626;
}

.slug-field__input--manual {
  border-color: #f59e0b;
}

.slug-field__unlock {
  cursor: pointer;
  transition: background-color 0.2s;
}

.slug-field__unlock:hover {

}

.slug-field__auto-indicator {
  color: #3b82f6;
}

.slug-field__info {
  font-style: italic;
}

.slug-field__info strong {
  color: #1e293b;
}

.slug-field__display--empty {
  color: #94a3b8;
}

.slug-field__display-prefix {
  color: #64748b;
}
/*!*****************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!./src/components/HomeHeader/index.css ***!
  \*****************************************************************************************************************************************************************************************/
.home-header {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  margin-bottom: 1.5rem;
}

/*!*****************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[2].use[2]!./src/components/DocLink/doc-link.css ***!
  \*****************************************************************************************************************************************************************************************/


/*# sourceMappingURL=index.css.map*/