@media (min-width: 1120px) {
  .css-1f3mf5k-StyledModal {
    width: calc(940px);
  }
}

:root {
  --body-bg-color: #05070c;
  --primary-text-color: #cbd5e1;
  --secondary-text-color: #94a3b8;
  --success-text-color: #00ff9d;
  --danger-text-color: #ff0055;
  --disabled-text-color: #475569;
  --url-text-color: #00f0ff;
  --input-bg-color: #0a0f1d;
  --input-border-color: rgba(0, 240, 255, 0.3);
  --input-placeholder-color: #64748b;
  --btn-gray-default-bg: #0d1629;
  --btn-gray-default-border: rgba(0, 240, 255, 0.3);
  --btn-gray-hover-bg: rgba(0, 240, 255, 0.15);
  --btn-gray-hover-border: #00f0ff;
  --btn-gray-focus-bg: #0d1629;
  --btn-gray-disabled-text: #475569;
  --btn-gray-disabled-bg: #070b16;
  --btn-gray-disabled-border: #1e293b;
  --btn-red-default-text: #ff0055;
  --btn-red-default-bg: #0d1629;
  --btn-red-default-border: rgba(255, 0, 85, 0.4);
  --btn-red-hover-text: #fff;
  --btn-red-hover-bg: #ff0055;
  --btn-red-hover-border: #ff0055;
  --btn-red-active-bg: #b0003a;
  --btn-red-active-border: rgba(255, 0, 85, 0.8);
  --btn-red-disabled-text: rgba(255, 0, 85, 0.4);
  --btn-red-disabled-bg: #070b16;
  --btn-green-default-text: #05070c;
  --btn-green-default-bg: #00ff9d;
  --btn-green-default-border: #00ff9d;
  --btn-green-hover-bg: #00f0ff;
  --btn-green-hover-border: #00f0ff;
  --btn-green-active-bg: #00e58c;
  --btn-green-disabled-text: rgba(255, 255, 255, 0.4);
  --btn-green-disabled-bg: rgba(0, 255, 157, 0.2);
  --btn-green-disabled-border: transparent;
  --scrollbar-thumb-color: rgba(0, 240, 255, 0.3);
  --scrollbar-thumb-hover-color: #00f0ff;
  --dropdownlist-bg: #070b16;
  --dropdownlist-border: rgba(0, 240, 255, 0.3);
  --dropdownlist-shadow: 0 16px 32px rgba(0, 0, 0, 0.85);
  --dropdownitem-bg: #070b16;
  --dropdownitem-hover-bg: rgba(0, 240, 255, 0.15);
  --header-bg: #070b16;
  --header-button-text: #94a3b8;
  --header-button-text-hover: #00f0ff;
  --header-button-text-active: #00ff9d;
  --header-dropdownitem-hover-text: #00f0ff;
  --header-dropdownitem-hover-bg: rgba(0, 240, 255, 0.15);
  --card-bg: #070b16;
  --card-border: rgba(0, 240, 255, 0.25);
  --card-hover-bg: #0b1222;
  --modal-bg-color: #070b16;
  --modal-border-color: rgba(0, 240, 255, 0.4);
  --modal-box-shadow: 0 0 25px rgba(0, 240, 255, 0.2);
  --card-active-border: #00f0ff;
  --checkerboard-dark-color: #070b16;
  --checkerboard-bg-color: #0d1629;
  --widgets-bg-color: #070b16;
  --widgets-label-bg-color: #0d1629;
  --widgets-border-color: rgba(0, 240, 255, 0.25);
  --widgets-active-label-bg-color: #00f0ff;
  --widgets-active-border-color: #00f0ff;
  --widgets-error-label-bg-color: #ff0055;
  --widgets-error-border-color: #ff0055;
  --rdtPicker-bg-color: #070b16;
  --rdtPicker-border-color: rgba(0, 240, 255, 0.3);
  --rdtPicker-shadow: 0 16px 32px rgba(0, 0, 0, 0.85);
  --rdtPicker-hover-bg-color: rgba(0, 240, 255, 0.15);
  --rdtPicker-active-bg-color: #00f0ff;
  --color-picker-bg-color: #070b16;
  --color-picker-border-color: rgba(0, 240, 255, 0.3);
  --color-picker-shadow: 0 16px 32px rgba(0, 0, 0, 0.85);
  --toggle-true-bg-color: #00ff9d;
  --toggle-false-bg-color: #1e293b;
  --toggle-handle-color: #00f0ff;
  --topbar-bg-color: #070b16;
  --short-code-bg-color: rgba(0, 240, 255, 0.15);
  --code-block-bg-color: #040711;
  --code-line-number-color: #64748b;
}

body {
  background-color: var(--body-bg-color);
  color: var(--primary-text-color);
}
a {
  font-size: inherit;
  color: var(--url-text-color);
}
h1,
h2,
h3,
h4,
h5,
h6,
p {
  color: inherit;
}
::-webkit-scrollbar-thumb {
  background-color: var(--scrollbar-thumb-color) !important;
  border: unset !important;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background-color: var(--scrollbar-thumb-hover-color) !important;
}
::-webkit-scrollbar-track {
  background: var(--body-bg-color) !important;
}
iframe#netlify-identity-widget {
  z-index: 400 !important;
}
/* button */
/* gray button */
[class*="button-default-gray"],
[class*="button-medium-gray "],
[class*="button-default-disabled"],
[class*="button-default-lightBlue"],
[class*="AddButton-button"],
[class*="FileWidgetButton-button"],
[class*="SaveButton-lightBlue"],
[class*="StatusButton"],
[class*="StyledDropdownButton"]:not([class*="grayText"]):not(
    [class*="Publish"]
  ) {
  color: var(--primary-text-color);
  background-color: var(--btn-gray-default-bg);
  border: 1px solid;
  border-color: var(--btn-gray-default-border);
  border-radius: 6px;
  transition: 0.2s cubic-bezier(0.3, 0, 0.5, 1);
  transition-property: color, background-color, border-color;
}

[class*="button-default-gray"]:hover,
[class*="button-medium-gray "]:hover,
[class*="button-default-disabled"]:hover,
[class*="button-default-lightBlue"]:hover,
[class*="AddButton-button"]:hover,
[class*="FileWidgetButton-button"]:hover,
[class*="SaveButton-lightBlue"]:hover,
[class*="StatusButton"]:hover,
[class*="StyledDropdownButton"]:not([class*="grayText"]):not(
    [class*="Publish"]
  ):hover {
  background-color: var(--btn-gray-hover-bg);
  border-color: var(--btn-gray-hover-border);
  transition-duration: 0.1s;
}

[class*="button-default-gray"]:focus,
[class*="button-medium-gray "]:focus,
[class*="button-default-disabled"]:focus,
[class*="button-default-lightBlue"]:focus,
[class*="AddButton-button"]:focus,
[class*="FileWidgetButton-button"]:focus,
[class*="SaveButton-lightBlue"]:focus,
[class*="StatusButton"]:focus,
[class*="StyledDropdownButton"]:not([class*="grayText"]):not(
    [class*="Publish"]
  ):focus {
  color: var(--primary-text-color);
  background-color: var(--btn-gray-focus-bg);
}

[class*="button-default-disabled"][disabled] {
  color: var(--btn-gray-disabled-text);
  background-color: var(--btn-gray-disabled-bg);
  border: 1px solid;
  border-color: var(--btn-gray-disabled-border);
  border-radius: 6px;
}

/* red button */
[class*="utton-lightRed"],
[class*="FileWidgetButtonRemove-button"],
[class*="DeleteButton"] {
  color: var(--btn-red-default-text);
  background-color: var(--btn-red-default-bg);
  border: 1px solid;
  border-color: var(--btn-red-default-border);
  border-radius: 6px;
  transition: 0.2s cubic-bezier(0.3, 0, 0.5, 1);
  transition-property: color, background-color, border-color;
}

[class*="utton-lightRed"]:hover,
[class*="FileWidgetButtonRemove-button"]:hover,
[class*="DeleteButton"]:hover {
  color: var(--btn-red-hover-text);
  background-color: var(--btn-red-hover-bg);
  border-color: var(--btn-red-hover-border);
  transition-duration: 0.1s;
}

[class*="utton-lightRed"]:focus,
[class*="FileWidgetButtonRemove-button"]:focus,
[class*="DeleteButton"]:focus {
  border-color: var(--btn-red-hover-border);
}

[class*="utton-lightRed"]:active,
[class*="FileWidgetButtonRemove-button"]:active,
[class*="DeleteButton"]:active {
  color: var(--btn-red-hover-text);
  background-color: var(--btn-red-active-bg);
  border-color: var(--btn-red-active-border);
}

[class*="utton-lightRed"][disabled] {
  color: var(--btn-red-disabled-text);
  background-color: var(--btn-red-disabled-bg);
  border: 1px solid;
  border-color: var(--btn-red-default-border);
  border-radius: 6px;
}
/* green button */
[class*="button-green"],
[class*="PublishButton"],
[class*="publishedButton"] {
  color: var(--btn-green-default-text);
  background-color: var(--btn-green-default-bg);
  border: 1px solid;
  border-color: var(--btn-green-default-border);
  border-radius: 6px;
  transition: 0.2s cubic-bezier(0.3, 0, 0.5, 1);
  transition-property: color, background-color, border-color;
}

[class*="button-green"]:hover,
[class*="PublishButton"]:hover,
[class*="publishedButton"]:hover {
  background-color: var(--btn-green-hover-bg);
  border-color: var(--btn-green-hover-border);
  transition-duration: 0.1s;
}

[class*="button-green"]:active,
[class*="PublishButton"]:active,
[class*="publishedButton"]:active {
  background-color: var(--btn-green-active-bg);
}

[class*="button-green"]:focus,
[class*="PublishButton"]:focus,
[class*="publishedButton"]:focus {
  background-color: var(--btn-green-active-bg);
  border-color: var(--btn-green-hover-border);
}

[class*="button-green"][disabled],
[class*="PublishButton"][disabled] {
  color: var(--btn-green-disabled-text);
  background-color: var(--btn-green-disabled-bg);
  border: 1px solid;
  border-color: var(--btn-green-disabled-border);
  border-radius: 6px;
}
/* notification */
[class*="toast-success"] {
  color: var(--success-text-color);
  background-color: var(--dropdownitem-bg);
  box-shadow: var(--dropdownlist-shadow);
  border-radius: 6px;
}
[class*="toast-danger"] {
  color: var(--danger-text-color);
  background-color: var(--dropdownitem-bg);
  box-shadow: var(--dropdownlist-shadow);
  border-radius: 6px;
}

/* dropdown */
ul[class*="dropdownList"],
ul[class*="Suggestions"],
[class*="ControlContainer"] [class*="menu"] {
  background-color: var(--dropdownlist-bg);
  border: 1px solid var(--dropdownlist-border);
  border-radius: 6px;
  box-shadow: var(--dropdownlist-shadow);
}

ul[class*="dropdownList"] > [class*="dropdownItem"],
ul[class*="Suggestions"] > li[class*="SuggestionItem"],
[class*="ControlContainer"] [class*="menu"] [class*="option"] {
  color: var(--primary-text-color);
  background-color: var(--dropdownitem-bg);
  border-width: 0;
}

ul[class*="dropdownList"] > [class*="dropdownItem"]:hover,
ul[class*="Suggestions"] > li[class*="SuggestionItem"]:hover,
[class*="ControlContainer"] [class*="menu"] [class*="option"]:hover {
  color: inherit;
  background-color: var(--dropdownitem-hover-bg);
}

li[class*="SuggestionItem"] {
  display: flex;
  justify-content: space-between;
  padding: 6px 20px 6px 32px;
}

li.css-fmy46h-SuggestionItem::after {
  content: "✓";
  position: relative;
  right: 0px;
}
[role="menuitem"].css-zcym63-button-dropdownItem-StyledMenuItem > span {
  display: contents;
}
[role="menuitem"].css-zcym63-button-dropdownItem-StyledMenuItem
  > span:only-child::after {
  content: "✓";
  position: relative;
  right: 0px;
}

div.css-8fe0f3-option::after {
  content: "✓";
  position: absolute;
  right: 22px;
}

[role="menuitem"] > input[type="checkbox"] {
  display: none;
}
[role="menuitem"] > input[type="checkbox"] + span::before {
  content: "✓";
  color: transparent;
  display: inline-block;
  padding-right: 6px;
}

[role="menuitem"] > input[type="checkbox"]:checked + span::before {
  color: inherit;
}

li[class*="SuggestionHeader"] {
  color: inherit;
}

[class*="MenuItemIconContainer"] > [class*="IconWrapper"] {
  color: inherit;
}

ul[class*="dropdownList"]::-webkit-scrollbar-track,
ul[class*="Suggestions"]::-webkit-scrollbar-track,
[class*="ControlContainer"] [class*="menu"] > div::-webkit-scrollbar-track {
  background: var(--dropdownlist-bg) !important;
}

/*header*/
header[class*="AppHeader"] {
  background-color: var(--header-bg);
}

header [class*="AppHeaderButton"] {
  color: var(--header-button-text);
}

header [class*="AppHeaderButton"]:hover,
header [class*="AppHeaderButton"]:focus {
  color: var(--header-button-text-hover);
}

header [class*="AppHeaderButton"].header-link-active {
  color: var(--header-button-text-active);
}

header [class*="AppHeaderNavList"] [class*="IconWrapper"] {
  color: inherit !important;
}

header ul[class*="dropdownList"] > [class*="dropdownItem"]:hover,
[class*="EditorContainer"]
  > [class*="ToolbarContainer"]
  ul[class*="dropdownList"]
  > [class*="dropdownItem"]:hover {
  color: var(--header-dropdownitem-hover-text);
  background-color: var(--header-dropdownitem-hover-bg);
  z-index: 320;
}

[class*="EditorContainer"] > [class*="ToolbarContainer"] {
  background-color: var(--header-bg);
}

[class*="EditorContainer"]
  > [class*="ToolbarContainer"]
  [class*="ToolbarSectionBackLink"] {
  border-color: var(--btn-gray-default-border);
}

[class*="EditorContainer"]
  > [class*="ToolbarContainer"]
  [class*="ToolbarSectionBackLink"]:hover,
[class*="EditorContainer"]
  > [class*="ToolbarContainer"]
  [class*="ToolbarSectionBackLink"]:focus {
  background-color: var(--btn-gray-default-bg);
}

[class*="EditorContainer"]
  > [class*="ToolbarContainer"]
  [class*="ToolbarSectionBackLink"]
  [class*="BackArrow"],
[class*="EditorContainer"]
  > [class*="ToolbarContainer"]
  [class*="ToolbarSectionBackLink"]
  [class*="BackCollection"] {
  color: var(--primary-text-color);
}

[class*="EditorContainer"]
  > [class*="ToolbarContainer"]
  [class*="ToolbarSectionBackLink"]
  [class*="textBadgeSuccess"] {
  color: var(--success-text-color);
}

[class*="EditorContainer"]
  > [class*="ToolbarContainer"]
  [class*="ToolbarSectionMeta"] {
  border-color: var(--btn-gray-default-border);
}
/* card */
[class*="CollectionContainer"] [class*="Container-card"],
[class*="CollectionContainer"] [class*="ListCard-card"],
[class*="CollectionContainer"] [class*="GridCard-card"],
[class*="WorkflowContainer"] [class*="WorkflowTop-card-cardTop"],
[class*="WorkflowContainer"] [class*="WorkflowCardContainer-card"],
[class*="WorkflowContainer"] [class*="ColumnHeader"] {
  background-color: var(--card-bg);
  border: 1px solid var(--card-border);
  box-shadow: none;
  border-radius: 6px;
}

[class*="CollectionContainer"] [class*="GridCardLink"] {
  color: var(--primary-text-color);
  background-color: unset;
}

[class*="CollectionContainer"] [class*="ListCardLink"] {
  color: var(--primary-text-color);
}

[class*="CollectionContainer"]
  [class*="GridCardLink"]
  [class*="CardBody"]::after {
  content: unset;
}

[class*="CollectionContainer"] [class*="ListCardLink"]:hover,
[class*="CollectionContainer"] [class*="GridCardLink"]:hover,
[class*="WorkflowContainer"] [class*="WorkflowCardContainer-card"]:hover {
  color: inherit;
  background-color: var(--card-hover-bg);
}

[class*="CardButtonContainer"] {
  background-color: inherit;
}

a[class*="AppHeaderTestRepoIndicator"],
a[class*="AppHeaderSiteLink"] {
  color: var(--secondary-text-color);
}
a[class*="RefreshPreviewButton"],
a[class*="RefreshPreviewButton"] > [class*="IconWrapper"] {
  color: var(--url-text-color);
}
/* auth page */
section[class*="StyledAuthenticationPage"] a[class*="GoBackButtonStyle"] {
  color: var(--secondary-text-color);
}
section[class*="StyledAuthenticationPage"]
  a[class*="GoBackButtonStyle"]
  > p[class*="ButtonText"] {
  color: inherit;
}
section[class*="StyledAuthenticationPage"] span[class*="PageLogoIcon"],
section[class*="StyledAuthenticationPage"] a[class*="GoBackButtonStyle"]:hover {
  color: var(--primary-text-color);
}
/* contents */
/*sidebar*/
[class*="SidebarHeading"] {
  color: inherit;
}
[class*="SidebarNavLink"],
[class*="TreeNavLink"] {
  border-left: none;
  color: var(--header-button-text);
}
[class*="SidebarNavLink"]:hover,
[class*="TreeNavLink"]:hover {
  color: var(--header-button-text);
  background-color: var(--dropdownitem-hover-bg);
}
[class*="SidebarNavLink"].sidebar-active,
[class*="TreeNavLink"].sidebar-active {
  color: var(--header-button-text-active);
  background-color: var(--header-dropdownitem-hover-bg);
}
[class*="SearchContainer"] input[class*="SearchInput"] {
  background-color: var(--input-bg-color);
  border: 1px solid var(--input-border-color);
  color: inherit;
}
[class*="SearchContainer"] [class*="IconWrapper"] {
  color: var(--input-placeholder-color);
}
[class*="SearchContainer"] input[class*="SearchInput"]::placeholder {
  color: var(--input-placeholder-color);
}

/*collection*/
[class*="CollectionControlsContainer"]
  .css-14aa6nw-StyledDropdownButton-button-default-caret-caretDown-Button-button-medium-grayText-ControlButton {
  color: var(--header-button-text);
}
[class*="CollectionControlsContainer"]
  .css-14aa6nw-StyledDropdownButton-button-default-caret-caretDown-Button-button-medium-grayText-ControlButton:hover {
  color: var(--header-button-text-hover);
}
[class*="CollectionControlsContainer"]
  .css-58ai8s-StyledDropdownButton-button-default-caret-caretDown-Button-button-medium-grayText-ControlButton {
  color: var(--header-button-text-active);
}
[class*="CollectionControlsContainer"] .css-1jfbwn6-ViewControlsButton-button {
  color: var(--header-button-text);
}
[class*="CollectionControlsContainer"]
  .css-1jfbwn6-ViewControlsButton-button:hover {
  color: var(--header-button-text-hover);
}
[class*="CollectionControlsContainer"] .css-1fh4556-ViewControlsButton-button {
  color: var(--header-button-text-active);
}
[class*="GroupHeading"] [class*="cardTopDescription"] {
  color: var(--secondary-text-color);
}
/* workflow */
[class*="WorkflowContainer"] [class*="ColumnHeader"] {
  color: var(--primary-text-color);
}
.css-1njtcvy-column-WorkflowList::before,
.css-1njtcvy-column-WorkflowList::after,
.css-lhns9r-column-columnHovered-WorkflowList::before,
.css-lhns9r-column-columnHovered-WorkflowList::after {
  background-color: var(--card-border);
  height: 100%;
  top: 0px;
}
[class*="WorkflowLink"] [class*="CardCollection"],
[class*="WorkflowLink"] [class*="CardTitle"] {
  color: var(--primary-text-color);
}
[class*="WorkflowLink"] [class*="CardDate"],
[class*="WorkflowLink"] [class*="CardBody"],
p[class*="WorkflowTopDescription"] {
  color: var(--secondary-text-color);
}

/* media */
[class*="StyledModal"] {
  background-color: var(--modal-bg-color);
  box-shadow: var(--modal-box-shadow);
  border: 1px solid var(--modal-border-color);
  border-radius: 6px;
}
[class*="StyledModal"] [class*="CloseButton"] {
  color: var(--primary-text-color);
  background-color: var(--btn-gray-default-bg);
  border: 1px solid;
  border-color: var(--btn-gray-default-border);
}
[class*="StyledModal"] .css-1er4xqr-Card {
  border: 2px solid var(--card-border);
}
[class*="StyledModal"] .css-1v1y2wn-Card {
  border: 2px solid var(--card-active-border);
}
[class*="StyledModal"] [class*="checkerboard"] {
  background-color: var(--checkerboard-bg-color);
  border-bottom: 2px solid var(--modal-border-color);
  background-image:
    linear-gradient(
      45deg,
      var(--checkerboard-dark-color) 25%,
      transparent 25%,
      transparent 75%,
      var(--checkerboard-dark-color) 75%,
      var(--checkerboard-dark-color)
    ),
    linear-gradient(
      45deg,
      var(--checkerboard-dark-color) 25%,
      transparent 25%,
      transparent 75%,
      var(--checkerboard-dark-color) 75%,
      var(--checkerboard-dark-color)
    );
}
[class*="StyledModal"] [class*="DraftText"] {
  color: inherit;
  background-color: var(--modal-border-color);
  padding: 5px 8px;
}
[class*="StyledModal"] [class*="CardText"] {
  color: inherit;
}

/*editor*/
[class*="EditorContainer"] [class*="card-splitPane"] {
  background-color: var(--body-bg-color);
}
#preview-pane {
  background-color: var(--body-bg-color);
  border-radius: 0;
}
.Resizer.vertical {
  width: 5px;
  border-right: 1px solid var(--modal-border-color);
}
.Resizer.vertical::before {
  content: none;
}
button.css-1glyzdz-ButtonRound-button-EditorToggle {
  color: var(--toggle-true-bg-color);
  background-color: var(--btn-gray-default-bg);
  border: 1px solid;
  border-color: var(--btn-gray-default-border);
  transition: 0.2s cubic-bezier(0.3, 0, 0.5, 1);
  transition-property: color, background-color, border-color;
}
button.css-1f8dk1z-ButtonRound-button-EditorToggle {
  color: var(--toggle-false-bg-color);
  background-color: var(--btn-gray-default-bg);
  border: 1px solid;
  border-color: var(--btn-gray-default-border);
  transition: 0.2s cubic-bezier(0.3, 0, 0.5, 1);
  transition-property: color, background-color, border-color;
}
button.css-1glyzdz-ButtonRound-button-EditorToggle:hover {
  color: var(--header-button-text-active);
  background-color: var(--btn-gray-hover-bg);
  border-color: var(--btn-gray-hover-border);
  transition-duration: 0.1s;
}
button.css-1f8dk1z-ButtonRound-button-EditorToggle:hover {
  color: var(--secondary-text-color);
  background-color: var(--btn-gray-hover-bg);
  border-color: var(--btn-gray-hover-border);
  transition-duration: 0.1s;
}

/*widgets*/
[class*="FieldLabel"]::after {
  background-color: var(--body-bg-color);
}
[class*="pcief1-FieldLabel"] {
  color: var(--primary-text-color);
  background-color: var(--widgets-label-bg-color);
  padding: 3px 8px 2px;
  text-transform: capitalize;
}
.css-83wr9v,
.css-2ek3w9,
.css-wesa1q-TextControl,
.css-182avcw,
.css-18h6btn,
.css-12fzmby,
.css-xa00c7,
.css-1d0dxug {
  color: inherit;
  background-color: var(--widgets-bg-color);
  border: 1px solid var(--widgets-border-color);
  border-radius: 0 6px 6px;
}
[class*="1vur7zs-FieldLabel"] {
  color: var(--header-button-text-active);
  background-color: var(--widgets-active-label-bg-color);
  padding: 3px 8px 2px;
  text-transform: capitalize;
}
.css-188efjc,
.css-3yr7zq-TextControl,
.css-12fzmby {
  color: inherit;
  background-color: var(--widgets-bg-color);
  border: 1px solid var(--widgets-active-border-color);
  border-radius: 0 6px 6px;
}
.css-1noq96f-FieldLabel-fieldLabel {
  background-color: var(--widgets-error-label-bg-color);
  padding: 3px 8px 2px;
  text-transform: capitalize;
}
.css-9guxbf-ControlErrorsList {
  color: var(--danger-text-color);
}
.css-1caau9x,
.css-xo8dlj,
.css-14hxnzs-TextControl,
.css-1eeq9l0-TextControl,
.css-ntdq13 {
  color: inherit;
  background-color: var(--widgets-bg-color);
  border: 1px solid var(--widgets-error-border-color);
  border-radius: 0 6px 6px;
}
/*dropdown*/
[class*="ControlContainer"] div[class$="-control"] {
  background-color: transparent;
}
[class*="ControlContainer"]
  div[class$="-control"]
  [class*="indicatorContainer"] {
  color: var(--input-placeholder-color);
}
[class*="ControlContainer"]
  div[class$="-control"]
  [class*="indicatorContainer"]:hover {
  color: var(--header-button-text-hover);
}
[class*="ControlContainer"]
  div[class$="-control"]
  [class*="-loadingIndicator"]
  > span {
  background-color: var(--input-placeholder-color);
}
[class*="ControlContainer"] div[class$="-control"] [class*="css-1g6gooi"],
[class*="ControlContainer"] div[class$="-control"] [class*="-singleValue"] {
  color: inherit;
}
/*date*/
.rdt .rdtPicker {
  background-color: var(--rdtPicker-bg-color);
  box-shadow: var(--rdtPicker-shadow);
  border: 1px solid var(--rdtPicker-border-color);
  border-radius: 6px;
}
.rdt .rdtPicker thead tr:first-child th:hover,
.rdt .rdtPicker td.rdtDay:hover,
.rdt .rdtPicker td.rdtHour:hover,
.rdt .rdtPicker td.rdtMinute:hover,
.rdt .rdtPicker td.rdtSecond:hover,
.rdt .rdtPicker .rdtTimeToggle:hover,
.rdt .rdtPicker .rdtCounter .rdtBtn:hover,
.rdt .rdtPicker td.rdtMonth:hover,
.rdt .rdtPicker td.rdtYear:hover {
  background-color: var(--rdtPicker-hover-bg-color);
}
.rdt .rdtPicker td.rdtActive,
.rdt .rdtPicker td.rdtActive:hover {
  background-color: var(--rdtPicker-active-bg-color);
}
.rdt .rdtPicker td.rdtOld,
.rdt .rdtPicker td.rdtNew {
  color: var(--disabled-text-color);
}
.rdt .rdtPicker td.rdtToday::before {
  border-bottom: 7px solid var(--rdtPicker-active-bg-color);
}
.rdt .rdtPicker th {
  border-bottom: 1px solid var(--rdtPicker-border-color);
}
/*image uplaod*/
[class*="ImageWrapper-checkerboard"] {
  border: 2px solid var(--widgets-border-color);
  background-color: var(--checkerboard-bg-color);
  background-image:
    linear-gradient(
      45deg,
      var(--checkerboard-dark-color) 25%,
      transparent 25%,
      transparent 75%,
      var(--checkerboard-dark-color) 75%,
      var(--checkerboard-dark-color)
    ),
    linear-gradient(
      45deg,
      var(--checkerboard-dark-color) 25%,
      transparent 25%,
      transparent 75%,
      var(--checkerboard-dark-color) 75%,
      var(--checkerboard-dark-color)
    );
}
/*color picker*/
[class*="ColorSwatch"] {
  border-color: var(--btn-gray-default-border);
}
.css-177o7zx-ColorSwatch {
  color: var(--primary-text-color);
  background-color: var(--btn-gray-default-bg);
}
.chrome-picker {
  background: var(--color-picker-bg-color) !important;
  overflow: hidden;
  border: 1px solid var(--color-picker-border-color);
  border-radius: 6px !important;
  box-shadow: var(--color-picker-shadow) !important;
}
[id^="rc-editable-input-"] {
  box-shadow: none !important;
  background-color: var(--color-picker-bg-color);
  border: 1px solid var(--color-picker-border-color) !important;
  border-radius: 4px !important;
  color: inherit !important;
}
div.chrome-picker
  > div
  > .flexbox-fix:nth-child(1)
  > div:nth-child(1)
  > div
  > div:nth-child(1) {
  box-shadow: none !important;
  border: 1px solid var(--color-picker-border-color);
}
div.chrome-picker
  > div
  > .flexbox-fix:nth-child(1)
  > div:nth-child(2)
  > div:nth-child(2)
  > div
  > div:nth-child(1)::after {
  content: "";
  height: 100%;
  display: block;
  background-color: white;
}
div.chrome-picker > div > .flexbox-fix:nth-child(2) > div:nth-child(2) svg {
  fill: var(--secondary-text-color) !important;
}
div.chrome-picker
  > div
  > .flexbox-fix:nth-child(2)
  > div:nth-child(2)
  svg:hover {
  fill: var(--primary-text-color) !important;
  background: var(--btn-gray-default-border) !important;
}
/* toggle */
[class*="ToggleContainer-StyledToggle"][aria-checked="true"]
  > span[class*="ToggleBackground"] {
  background-color: var(--toggle-true-bg-color);
}
[class*="ToggleContainer-StyledToggle"][aria-checked="false"]
  > span[class*="ToggleBackground"] {
  background-color: var(--toggle-false-bg-color);
}
[class*="ToggleContainer-StyledToggle"] > span[class*="ToggleHandle"] {
  background-color: var(--toggle-handle-color);
}
/* object */
[class*="listControlItem"] {
  border: 1px solid var(--widgets-border-color);
  border-radius: 6px;
}
[class*="TopBarContainer"],
[class*="StyledListItemTopBar"],
[class*="NestedObjectLabel"] {
  background-color: var(--topbar-bg-color);
  border-top-right-radius: 6px;
}
.css-1cjg468,
.css-55unpk {
  border: 0px;
  color: inherit;
  background-color: var(--widgets-bg-color);
}
[class*="TopBarContainer"] button[class*="ExpandButton"],
[class*="StyledListItemTopBar"] [class*="TopBarButton"] {
  color: var(--header-button-text);
}
[class*="TopBarContainer"] button[class*="ExpandButton"]:hover,
[class*="StyledListItemTopBar"] [class*="TopBarButton"]:hover {
  color: var(--header-button-text-hover);
}
/* markdown */
[class*="cms-editor"] {
  border: 1px solid var(--widgets-border-color);
  border-radius: 0 6px 6px;
}
[class*="cms-editor"] [class*="ToolbarContainer"] {
  background-color: var(--topbar-bg-color);
  border-top-right-radius: 6px;
}
.css-12vfcwo,
.css-isnoua {
  border-color: transparent;
  color: inherit;
  background-color: var(--widgets-bg-color);
}
.css-189bh5w,
.css-f8f1e2 {
  border-color: var(--widgets-error-border-color);
  color: inherit;
  background-color: var(--widgets-bg-color);
}
[class*="cms-editor"]
  [class*="ToolbarContainer"]
  button[class*="StyledToolbarButton"],
[class*="cms-editor"]
  [class*="ToolbarContainer"]
  div[class*="ToolbarDropdownWrapper"] {
  color: var(--header-button-text);
}
[class*="cms-editor"]
  [class*="ToolbarContainer"]
  button[class*="StyledToolbarButton"]:hover,
[class*="cms-editor"]
  [class*="ToolbarContainer"]
  div[class*="ToolbarDropdownWrapper"]:hover {
  color: var(--header-button-text-hover);
}
[class*="cms-editor"]
  [class*="ToolbarContainer"]
  button[class*="StyledToolbarButton"][disabled],
[class*="cms-editor"]
  [class*="ToolbarContainer"]
  div[class*="ToolbarDropdownWrapper"][disabled] {
  color: var(--disabled-text-color);
}
[class*="ToolbarToggleLabel"] {
  color: var(--header-button-text);
}
[class*="ToolbarToggleLabel-ToolbarToggleLabel"] {
  color: var(--header-button-text-active);
}
[class*="cms-editor"] blockquote {
  color: var(--secondary-text-color);
  border-left: 3px solid var(--secondary-text-color);
}
[class*="cms-editor"] code[class*="StyledCode"] {
  background-color: var(--short-code-bg-color);
  border-radius: 6px;
  padding: 4px 6px;
}
/*code*/
[class*="react-codemirror"] .cm-s-material.CodeMirror,
[class*="react-codemirror"] .cm-s-material .CodeMirror-gutters {
  background-color: var(--code-block-bg-color);
}
[class*="ControlContainer"] [class*="SettingsPaneContainer"] {
  color: var(--primary-text-color);
  background-color: var(--dropdownlist-bg);
  border-left: 1px solid var(--dropdownlist-border);
  overflow: hidden;
}
[class*="react-codemirror"] .cm-s-material .CodeMirror-linenumber {
  color: var(--code-line-number-color);
}
[class*="ControlContainer"] [class*="SettingsPaneContainer"] > label {
  color: var(--primary-text-color);
}
[class*="ControlContainer"]
  [class*="SettingsPaneContainer"]
  [class$="-control"] {
  border: 1px solid var(--dropdownlist-border);
}
[class*="ControlContainer"] button[class*="StyledSettingsButton-button"] {
  background-color: transparent;
  color: var(--header-button-text);
}
[class*="ControlContainer"] button[class*="StyledSettingsButton-button"]:hover {
  color: var(--header-button-text-hover);
}
.CodeMirror-vscrollbar,
.CodeMirror-hscrollbar {
  cursor: default;
}
.CodeMirror-vscrollbar::-webkit-scrollbar-track,
.CodeMirror-hscrollbar::-webkit-scrollbar-track {
  background: var(--code-block-bg-color) !important;
}

/* ==========================================================================
   CYBER ANGLER Custom CMS Cyberpunk Dark Theme Overrides
   ========================================================================== */

html,
body,
#nc-root {
  background-color: #05070c !important;
  color: #cbd5e1 !important;
  font-family:
    "Chakra Petch",
    -apple-system,
    BlinkMacSystemFont,
    sans-serif !important;
}

/* App Header & Navigation */
#nc-root [class*="AppHeader"],
#nc-root header {
  background-color: #070b16 !important;
  border-bottom: 1px solid rgba(0, 240, 255, 0.25) !important;
  color: #cbd5e1 !important;
}

#nc-root [class*="AppHeaderActions"] {
  gap: 0.5rem !important;
}

/* ==========================================================================
   COLLECTION SIDEBAR: Clean Cyberpunk HUD (No Nested Boxes)
   ========================================================================== */
html body #nc-root [class*="SidebarContainer"] {
  background-color: #05070c !important;
  border-right: 1px solid rgba(0, 240, 255, 0.15) !important;
  padding-top: 0.75rem !important;
}

html body #nc-root [class*="SidebarHeading"] {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  color: #00f0ff !important;
  font-family: "Orbitron", sans-serif !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  padding: 1rem 1.25rem 0.5rem !important;
  margin: 0 !important;
  text-shadow: 0 0 10px rgba(0, 240, 255, 0.35) !important;
}

html body #nc-root [class*="SidebarNavLink"] {
  color: #94a3b8 !important;
  font-family: "Share Tech Mono", monospace !important;
  font-size: 0.88rem !important;
  letter-spacing: 0.5px !important;
  border-left: 2px solid transparent !important;
  padding: 0.65rem 1.25rem !important;
  transition: all 0.2s ease !important;
  display: flex !important;
  align-items: center !important;
}

html body #nc-root [class*="SidebarNavLink"]:hover,
html body #nc-root [class*="SidebarNavLink"][class*="active"],
html body #nc-root [class*="SidebarNavLink"].active,
html body #nc-root [class*="SidebarNavLink"].sidebar-active {
  color: #00f0ff !important;
  background-color: rgba(0, 240, 255, 0.1) !important;
  border-left-color: #00f0ff !important;
  box-shadow: inset 2px 0 10px rgba(0, 240, 255, 0.15) !important;
}

/* ==========================================================================
   COLLECTION MAIN PAGE & TRIP CARDS: Revamped Cyberpunk Design
   Eliminate nested inner boxes and vamp up typography, borders & glow
   ========================================================================== */

/* Top Header Panel */
html body #nc-root [class*="CollectionTopContainer"],
html body #nc-root div[class*="CollectionTopContainer"] {
  background: #060a14 !important;
  border: 1px solid rgba(0, 240, 255, 0.25) !important;
  border-left: 4px solid #00f0ff !important;
  border-radius: 2px !important;
  padding: 1.25rem 1.5rem !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5) !important;
  margin-bottom: 1.5rem !important;
}

html body #nc-root [class*="CollectionTopHeading"] {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  color: #00f0ff !important;
  font-family: "Orbitron", sans-serif !important;
  font-size: 1.6rem !important;
  font-weight: 800 !important;
  letter-spacing: 1.5px !important;
  text-shadow: 0 0 12px rgba(0, 240, 255, 0.4) !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body #nc-root [class*="CollectionTopDescription"] {
  background: transparent !important;
  border: none !important;
  color: #94a3b8 !important;
  font-family: "Share Tech Mono", monospace !important;
  font-size: 0.85rem !important;
  margin-top: 0.5rem !important;
}

/* "+ New Trip Report" Button */
html body #nc-root a[class*="CollectionTopNewButton"],
html body #nc-root [class*="CollectionTopNewButton"] {
  background: #00f0ff !important;
  color: #05070c !important;
  font-family: "Share Tech Mono", monospace !important;
  font-size: 0.82rem !important;
  font-weight: bold !important;
  letter-spacing: 1.2px !important;
  text-transform: uppercase !important;
  border: 1px solid #00f0ff !important;
  border-radius: 2px !important;
  padding: 0.55rem 1.5rem !important;
  box-shadow: 0 0 15px rgba(0, 240, 255, 0.35) !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  transition: all 0.2s ease !important;
}

html body #nc-root a[class*="CollectionTopNewButton"]:hover,
html body #nc-root [class*="CollectionTopNewButton"]:hover {
  background: #00ff9d !important;
  border-color: #00ff9d !important;
  color: #05070c !important;
  box-shadow: 0 0 20px rgba(0, 255, 157, 0.55) !important;
  transform: translateY(-1px) !important;
}

/* Search bar on collection page */
html body #nc-root [class*="SearchContainer"] input[class*="SearchInput"] {
  background-color: #070b16 !important;
  border: 1px solid rgba(0, 240, 255, 0.25) !important;
  color: #00f0ff !important;
  font-family: "Share Tech Mono", monospace !important;
  font-size: 0.88rem !important;
  border-radius: 2px !important;
}

html
  body
  #nc-root
  [class*="SearchContainer"]
  input[class*="SearchInput"]:focus {
  border-color: #00f0ff !important;
  box-shadow: 0 0 10px rgba(0, 240, 255, 0.3) !important;
}

/* View Controls & Sort Buttons */
html body #nc-root [class*="CollectionControlsContainer"] button,
html body #nc-root [class*="ViewControlsButton"] {
  background: #070b16 !important;
  border: 1px solid rgba(0, 240, 255, 0.25) !important;
  color: #94a3b8 !important;
  border-radius: 2px !important;
  font-family: "Share Tech Mono", monospace !important;
  transition: all 0.2s !important;
}

html body #nc-root [class*="CollectionControlsContainer"] button:hover,
html body #nc-root [class*="ViewControlsButton"]:hover {
  background: rgba(0, 240, 255, 0.15) !important;
  border-color: #00f0ff !important;
  color: #00f0ff !important;
}

/* ==========================================================================
   TRIP CARDS: Single Sleek Cyberpunk Card (NO Nested Inner Boxes)
   ========================================================================== */

/* Outer Card Container */
html body #nc-root li[class*="ListCard"],
html body #nc-root li[class*="GridCard"] {
  background: #070c18 !important;
  border: 1px solid rgba(0, 240, 255, 0.22) !important;
  border-left: 3px solid #00f0ff !important;
  border-radius: 2px !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.5) !important;
  margin-bottom: 0.85rem !important;
  transition: all 0.25s ease !important;
  overflow: hidden !important;
}

html body #nc-root li[class*="ListCard"]:hover,
html body #nc-root li[class*="GridCard"]:hover {
  background: #0b1428 !important;
  border-color: #00f0ff !important;
  border-left-color: #00ff9d !important;
  transform: translateX(6px) !important;
  box-shadow: 0 4px 20px rgba(0, 240, 255, 0.25) !important;
}

/* STRIP ALL INNER BOXES: No backgrounds, borders, or shadows inside the card */
html body #nc-root [class*="ListCard"] [class*="ListCardLink"],
html body #nc-root [class*="GridCard"] [class*="GridCardLink"],
html body #nc-root [class*="ListCardTitle"],
html body #nc-root [class*="CardHeading"],
html body #nc-root [class*="CardBody"],
html body #nc-root [class*="CardText"],
html body #nc-root [class*="CollectionLabel"],
html body #nc-root [class*="CardCollection"],
html body #nc-root [class*="CardTitle"],
html body #nc-root [class*="CardDateContainer"] {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Trip Card Title */
html body #nc-root [class*="ListCardTitle"],
html body #nc-root [class*="CardHeading"] {
  padding: 0 !important;
  margin: 0 !important;
  font-family: "Orbitron", sans-serif !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  color: #f1f5f9 !important;
  letter-spacing: 0.5px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  transition: color 0.2s ease !important;
}

html body #nc-root li[class*="ListCard"]:hover [class*="ListCardTitle"],
html body #nc-root li[class*="ListCard"]:hover [class*="CardHeading"],
html body #nc-root li[class*="GridCard"]:hover [class*="CardHeading"] {
  color: #00f0ff !important;
  text-shadow: 0 0 10px rgba(0, 240, 255, 0.6) !important;
}

/* Small Collection Category Tag above title */
html body #nc-root [class*="CollectionLabel"] {
  font-family: "Share Tech Mono", monospace !important;
  font-size: 0.68rem !important;
  color: #00f0ff !important;
  opacity: 0.75 !important;
  letter-spacing: 1.5px !important;
  text-transform: uppercase !important;
  margin-bottom: 0.35rem !important;
  display: block !important;
  padding: 0 !important;
}

/* Workflow status badge inside card */
html body #nc-root [class*="WorkflowBadge"] {
  font-family: "Share Tech Mono", monospace !important;
  font-size: 0.68rem !important;
  font-weight: bold !important;
  border-radius: 2px !important;
  letter-spacing: 1px !important;
}

/* Editor Container & Split Pane */
html body #nc-root [class*="EditorContainer"],
html body #nc-root [class*="ControlPaneContainer"],
html body #nc-root [class*="ControlPane"],
html body #nc-root [class*="PaneContainer"],
html body #nc-root [class*="card-splitPane"],
html body #nc-root [class*="splitPane"],
html body #nc-root [class*="EditorPreviewPane"] {
  background-color: #05070c !important;
}

html body #nc-root [class*="EditorToolbar"],
html body #nc-root [class*="ToolbarContainer"] {
  background-color: #070b16 !important;
  border-bottom: 1px solid rgba(0, 240, 255, 0.2) !important;
}

html body #nc-root [class*="BackCollection"] {
  color: #00f0ff !important;
  font-family: "Share Tech Mono", monospace !important;
}

/* Editor Field Control Containers */
html body #nc-root [class*="ControlContainer"] {
  background-color: #080d19 !important;
  border: 1px solid rgba(0, 240, 255, 0.2) !important;
  border-radius: 2px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4) !important;
  margin-bottom: 1.25rem !important;
  overflow: visible !important;
}

html body #nc-root [class*="ControlContainer"]:focus-within {
  border-color: #00f0ff !important;
  box-shadow: 0 0 12px rgba(0, 240, 255, 0.25) !important;
}

/* Field Top Bar & Labels */
html body #nc-root [class*="ControlTopbar"] {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
}

html body #nc-root [class*="FieldLabel"],
html body #nc-root label[class*="FieldLabel"],
html body #nc-root [class*="FieldLabel-fieldLabel"] {
  background-color: #0d1629 !important;
  color: #00f0ff !important;
  border: 1px solid rgba(0, 240, 255, 0.25) !important;
  border-bottom: none !important;
  font-family: "Share Tech Mono", monospace !important;
  font-size: 0.78rem !important;
  letter-spacing: 1.2px !important;
  text-transform: uppercase !important;
  padding: 4px 10px !important;
}

html body #nc-root [class*="FieldLabel"]:before,
html body #nc-root [class*="FieldLabel"]:after {
  background-color: #0d1629 !important;
}

/* Field Hints */
html body #nc-root [class*="ControlHint"],
html body #nc-root p[class*="ControlHint"],
html body #nc-root [class*="Hint"] {
  color: #94a3b8 !important;
  font-family: "Share Tech Mono", monospace !important;
  font-size: 0.75rem !important;
  margin-top: 6px !important;
}

/* ==========================================================================
   UNIVERSAL WIDGET FIX: Data Entry Backgrounds & Containers
   Every Decap widget is inside ControlContainer. Make every widget wrapper dark.
   ========================================================================== */

html
  body
  #nc-root
  [class*="ControlContainer"]
  > div:not([class*="ControlTopbar"]),
html body #nc-root [class*="ControlContainer"] > input,
html body #nc-root [class*="ControlContainer"] > select,
html body #nc-root [class*="ControlContainer"] > textarea,
html
  body
  #nc-root
  [class*="ControlContainer"]
  div[class*="css-"]:not([class*="ControlTopbar"]):not([class*="FieldLabel"]) {
  background-color: #070b16 !important;
  color: #f1f5f9 !important;
  border-color: rgba(0, 240, 255, 0.25) !important;
}

/* Text Inputs, Textareas, Selects */
html body #nc-root input,
html body #nc-root textarea,
html body #nc-root select {
  background-color: #0a0f1d !important;
  color: #f1f5f9 !important;
  border: 1px solid rgba(0, 240, 255, 0.25) !important;
  border-radius: 2px !important;
  font-family: "Share Tech Mono", monospace !important;
}

html body #nc-root input:focus,
html body #nc-root textarea:focus,
html body #nc-root select:focus {
  background-color: #0d1527 !important;
  border-color: #00f0ff !important;
  box-shadow: 0 0 8px rgba(0, 240, 255, 0.3) !important;
  outline: none !important;
}

html body #nc-root input::placeholder,
html body #nc-root textarea::placeholder {
  color: #475569 !important;
}

/* Date / Time Widget */
html body #nc-root [class*="DateTimeControl"],
html body #nc-root div[class*="DateTimeControl"] {
  background-color: #0a0f1d !important;
  border: 1px solid rgba(0, 240, 255, 0.25) !important;
  border-radius: 2px !important;
}

html body #nc-root [class*="DateTimeControl"] input {
  background-color: transparent !important;
  color: #00f0ff !important;
  border: none !important;
  font-family: "Share Tech Mono", monospace !important;
  font-size: 0.92rem !important;
}

html body #nc-root input[type="date"]::-webkit-calendar-picker-indicator,
html
  body
  #nc-root
  input[type="datetime-local"]::-webkit-calendar-picker-indicator {
  filter: invert(1) hue-rotate(180deg) brightness(1.6);
  cursor: pointer;
}

html
  body
  #nc-root
  [class*="DateTimeControl"]
  button[data-testid="clear-button"],
html body #nc-root [class*="ClearButton"] {
  background: transparent !important;
  border: 1px solid #ff0055 !important;
  color: #ff0055 !important;
  font-family: "Share Tech Mono", monospace !important;
  font-size: 0.75rem !important;
  padding: 0.25rem 0.5rem !important;
  cursor: pointer !important;
  border-radius: 2px !important;
}

/* Select Widget (Water Type Dropdown) */
html body #nc-root select {
  background-color: #0a0f1d !important;
  color: #00f0ff !important;
  border: 1px solid rgba(0, 240, 255, 0.3) !important;
  padding: 0.6rem 0.85rem !important;
  cursor: pointer !important;
}

html body #nc-root select option {
  background-color: #070b16 !important;
  color: #f1f5f9 !important;
}

/* File / Image Widget (Cover Photo & Gallery) */
html body #nc-root [class*="FileLinkList"],
html body #nc-root [class*="FileLinks"],
html body #nc-root [class*="FileLink"] {
  background-color: transparent !important;
  color: #00f0ff !important;
}

html body #nc-root [class*="ImageWrapper"] {
  background-color: #040711 !important;
  border: 1px solid rgba(0, 240, 255, 0.3) !important;
  border-radius: 2px !important;
}

html body #nc-root [class*="FileWidgetButton"],
html body #nc-root button[class*="FileWidgetButton"] {
  background-color: #0a1122 !important;
  border: 1px solid #00f0ff !important;
  color: #00f0ff !important;
  font-family: "Share Tech Mono", monospace !important;
  font-size: 0.82rem !important;
  font-weight: bold !important;
  letter-spacing: 0.5px !important;
  padding: 0.5rem 1rem !important;
  cursor: pointer !important;
  border-radius: 2px !important;
  transition: all 0.2s !important;
}

html body #nc-root [class*="FileWidgetButton"]:hover {
  background-color: rgba(0, 240, 255, 0.2) !important;
  box-shadow: 0 0 10px rgba(0, 240, 255, 0.35) !important;
}

html body #nc-root [class*="FileWidgetButtonRemove"],
html body #nc-root button[class*="FileWidgetButtonRemove"] {
  background-color: transparent !important;
  border: 1px solid #ff0055 !important;
  color: #ff0055 !important;
  font-family: "Share Tech Mono", monospace !important;
  font-size: 0.78rem !important;
  padding: 0.4rem 0.8rem !important;
  cursor: pointer !important;
  border-radius: 2px !important;
}

html body #nc-root [class*="FileWidgetButtonRemove"]:hover {
  background-color: #ff0055 !important;
  color: #000 !important;
  box-shadow: 0 0 10px rgba(255, 0, 85, 0.5) !important;
}

/* List Widget (Flies & Gallery Items) */
html body #nc-root [class*="ListContainer"],
html body #nc-root [class*="ListControl"] {
  background-color: #070b16 !important;
}

html body #nc-root [class*="listControlItem"] {
  background-color: #05070c !important;
  border: 1px solid rgba(0, 240, 255, 0.25) !important;
  margin-bottom: 0.75rem !important;
  border-radius: 2px !important;
}

html body #nc-root [class*="StyledListItemTopBar"],
html body #nc-root [class*="TopBarContainer"],
html body #nc-root [class*="TopBar"],
html body #nc-root [class*="ObjectWidgetTopBar"] {
  background-color: #0b1222 !important;
  border-bottom: 1px solid rgba(0, 240, 255, 0.2) !important;
  color: #00f0ff !important;
  padding: 8px 12px !important;
}

html body #nc-root [class*="TopBarButton"] {
  color: #00f0ff !important;
}

html body #nc-root [class*="TopBarButton"]:hover {
  color: #ff0055 !important;
}

html body #nc-root [class*="SortHandle"] {
  color: #00f0ff !important;
}

html body #nc-root [class*="NestedObjectLabel"] {
  background-color: #0b1222 !important;
  color: #00f0ff !important;
  font-family: "Share Tech Mono", monospace !important;
  font-size: 0.8rem !important;
}

/* Add Buttons */
html body #nc-root [class*="AddButton"],
html body #nc-root button[class*="AddButton"],
html body #nc-root button[class*="Button-button-default"] {
  background: #08101e !important;
  border: 1px solid #00f0ff !important;
  color: #00f0ff !important;
  font-family: "Share Tech Mono", monospace !important;
  font-size: 0.8rem !important;
  font-weight: bold !important;
  letter-spacing: 1px !important;
  transition: all 0.2s !important;
  border-radius: 2px !important;
  padding: 0.5rem 1.25rem !important;
  margin-top: 0.5rem !important;
}

html body #nc-root [class*="AddButton"]:hover,
html body #nc-root button[class*="AddButton"]:hover,
html body #nc-root button[class*="Button-button-default"]:hover {
  background: rgba(0, 240, 255, 0.18) !important;
  box-shadow: 0 0 12px rgba(0, 240, 255, 0.35) !important;
}

/* ==========================================================================
   NOTES & REPORT / MARKDOWN EDITOR COMPLETE FIX:
   1. Eliminate the white background on the editor container and insertion point
   2. Fix gray-on-black text to bright, clean, ultra-readable white/slate
   ========================================================================== */

/* The entire visual and raw markdown containers */
html body #nc-root .cms-editor-visual,
html body #nc-root .cms-editor-raw,
html body #nc-root [class*="cms-editor"],
html body #nc-root .cms-editor-visual > div,
html body #nc-root .cms-editor-raw > div,
html body #nc-root [class*="RawEditorContainer"],
html body #nc-root div[target="e12tj7710"],
html body #nc-root .cms-editor-visual [class*="ToolbarContainer"] + div,
html body #nc-root [class*="InsertionPoint"],
html body #nc-root div[target="ebiot7z0"],
html body #nc-root div[class*="InsertionPoint"] {
  background-color: #070b16 !important;
  color: #f8fafc !important;
  border-color: rgba(0, 240, 255, 0.25) !important;
}

/* Markdown Toolbar */
html body #nc-root .cms-editor-visual [class*="ToolbarContainer"],
html body #nc-root .cms-editor-raw [class*="ToolbarContainer"],
html body #nc-root [class*="cms-editor"] [class*="ToolbarContainer"] {
  background-color: #0a1122 !important;
  border-bottom: 1px solid rgba(0, 240, 255, 0.25) !important;
  color: #94a3b8 !important;
}

html body #nc-root [class*="cms-editor"] [class*="StyledToolbarButton"] {
  color: #94a3b8 !important;
  background: transparent !important;
}

html body #nc-root [class*="cms-editor"] [class*="StyledToolbarButton"]:hover {
  color: #00f0ff !important;
  background: rgba(0, 240, 255, 0.15) !important;
}

html
  body
  #nc-root
  [class*="cms-editor"]
  [class*="StyledToolbarButton"][class*="active"],
html body #nc-root [class*="cms-editor"] [class*="StyledToolbarButton"].active {
  color: #00ff9d !important;
  background: rgba(0, 255, 157, 0.15) !important;
}

/* Mode toggle (Rich text vs Markdown) */
html body #nc-root [class*="ToolbarToggle"] {
  background-color: #070b16 !important;
  border: 1px solid rgba(0, 240, 255, 0.3) !important;
  border-radius: 3px !important;
}

html body #nc-root [class*="ToolbarToggleLabel"] {
  color: #64748b !important;
  font-family: "Share Tech Mono", monospace !important;
  font-size: 0.75rem !important;
}

html body #nc-root [class*="ToolbarToggleLabel"][class*="active"],
html body #nc-root [class*="ToolbarToggleLabel"]:hover {
  color: #00f0ff !important;
}

/* The Slate Editable area */
html body #nc-root [data-slate-editor="true"],
html body #nc-root div[contenteditable="true"],
html body #nc-root [class*="cms-editor"] [data-slate-editor="true"],
html body #nc-root [class*="cms-editor"] div[contenteditable="true"] {
  background-color: #070b16 !important;
  color: #f8fafc !important;
  caret-color: #00f0ff !important;
  font-family:
    "Chakra Petch",
    -apple-system,
    sans-serif !important;
  font-size: 0.95rem !important;
  line-height: 1.65 !important;
}

/* FIX: Ensure EVERY text element, span, paragraph in the notes editor is crisp, bright white/slate */
html body #nc-root [data-slate-editor="true"] *,
html body #nc-root div[contenteditable="true"] *,
html body #nc-root [class*="cms-editor"] p,
html body #nc-root [class*="cms-editor"] span,
html body #nc-root [class*="cms-editor"] div,
html body #nc-root [class*="cms-editor"] [data-slate-string="true"],
html body #nc-root [class*="cms-editor"] [data-slate-node="element"],
html body #nc-root [class*="cms-editor"] [data-slate-node="text"],
html body #nc-root [class*="ParagraphElement"],
html body #nc-root [class*="StyledP"],
html body #nc-root div[target="evd8btb0"],
html body #nc-root p[target="evlbpgx8"] {
  color: #f8fafc !important;
}

/* Headings in Notes */
html body #nc-root [class*="cms-editor"] h1,
html body #nc-root [class*="cms-editor"] h2,
html body #nc-root [class*="cms-editor"] h3,
html body #nc-root [class*="cms-editor"] h4,
html body #nc-root [class*="cms-editor"] h5,
html body #nc-root [class*="cms-editor"] h6,
html body #nc-root [class*="cms-editor"] [class*="StyledH"] {
  color: #00f0ff !important;
  font-family: "Orbitron", sans-serif !important;
  text-shadow: 0 0 8px rgba(0, 240, 255, 0.3) !important;
  margin-top: 1rem !important;
  margin-bottom: 0.5rem !important;
}

/* Formatting in Notes */
html body #nc-root [class*="cms-editor"] strong {
  color: #ffffff !important;
  font-weight: 700 !important;
}

html body #nc-root [class*="cms-editor"] em {
  color: #00ff9d !important;
}

html body #nc-root [class*="cms-editor"] a {
  color: #00f0ff !important;
  text-decoration: underline !important;
}

html body #nc-root [class*="cms-editor"] code,
html body #nc-root [class*="cms-editor"] [class*="StyledCode"] {
  background-color: #020408 !important;
  color: #00ff9d !important;
  border: 1px solid rgba(0, 240, 255, 0.3) !important;
  border-radius: 3px !important;
  padding: 2px 6px !important;
  font-family: "Share Tech Mono", monospace !important;
}

html body #nc-root [class*="cms-editor"] blockquote,
html body #nc-root [class*="cms-editor"] [class*="StyledBlockQuote"] {
  border-left: 3px solid #00f0ff !important;
  background-color: rgba(0, 240, 255, 0.06) !important;
  color: #94a3b8 !important;
  padding: 0.5rem 1rem !important;
}

html body #nc-root [class*="cms-editor"] ul,
html body #nc-root [class*="cms-editor"] ol,
html body #nc-root [class*="cms-editor"] li {
  color: #f8fafc !important;
}

/* CodeMirror (Raw Markdown Mode) */
html body #nc-root .CodeMirror,
html body #nc-root .CodeMirror-lines,
html body #nc-root .CodeMirror pre.CodeMirror-line,
html body #nc-root .CodeMirror-scroll {
  background-color: #070b16 !important;
  color: #f8fafc !important;
  font-family: "Share Tech Mono", monospace !important;
}

html body #nc-root .CodeMirror-gutters {
  background-color: #040711 !important;
  border-right: 1px solid rgba(0, 240, 255, 0.2) !important;
}

html body #nc-root .CodeMirror-linenumber {
  color: #64748b !important;
}

html body #nc-root .CodeMirror-cursor {
  border-left: 2px solid #00f0ff !important;
}

/* Publish / Save Button */
html body #nc-root [class*="PublishButton"],
html body #nc-root button[class*="PublishButton"] {
  background-color: #00ff9d !important;
  color: #05070c !important;
  border: 1px solid #00ff9d !important;
  font-family: "Share Tech Mono", monospace !important;
  font-weight: bold !important;
  letter-spacing: 1px !important;
  border-radius: 2px !important;
  box-shadow: 0 0 10px rgba(0, 255, 157, 0.3) !important;
}

html body #nc-root [class*="PublishButton"]:hover,
html body #nc-root button[class*="PublishButton"]:hover {
  background-color: #00f0ff !important;
  border-color: #00f0ff !important;
  box-shadow: 0 0 15px rgba(0, 240, 255, 0.5) !important;
}

/* Delete Button */
html body #nc-root [class*="DeleteButton"],
html body #nc-root button[class*="DeleteButton"] {
  background-color: transparent !important;
  color: #ff0055 !important;
  border: 1px solid #ff0055 !important;
  font-family: "Share Tech Mono", monospace !important;
  font-size: 0.78rem !important;
  border-radius: 2px !important;
}

html body #nc-root [class*="DeleteButton"]:hover,
html body #nc-root button[class*="DeleteButton"]:hover {
  background-color: #ff0055 !important;
  color: #000 !important;
  box-shadow: 0 0 12px rgba(255, 0, 85, 0.4) !important;
}

/* Date Picker (react-datetime) */
.rdtPicker {
  background-color: #070b16 !important;
  border: 1px solid #00f0ff !important;
  box-shadow: 0 0 20px rgba(0, 240, 255, 0.25) !important;
  color: #cbd5e1 !important;
  font-family: "Share Tech Mono", monospace !important;
}

.rdtPicker th,
.rdtPicker td {
  color: #cbd5e1 !important;
}

.rdtPicker td.rdtDay:hover,
.rdtPicker td.rdtHour:hover,
.rdtPicker td.rdtMinute:hover,
.rdtPicker td.rdtSecond:hover {
  background: rgba(0, 240, 255, 0.2) !important;
  color: #00f0ff !important;
}

.rdtPicker td.rdtActive,
.rdtPicker td.rdtActive:hover {
  background-color: #00f0ff !important;
  color: #000 !important;
  font-weight: bold !important;
}

.rdtPicker td.rdtToday:before {
  border-bottom-color: #00ff9d !important;
}

/* Dropdowns & Modals */
html body #nc-root [class*="DropdownMenu"],
html body #nc-root [class*="dropdown-menu"],
html body #nc-root [class*="DropdownPane"],
html body #nc-root [class*="StyledModal"],
html body #nc-root [class*="Modal"] {
  background-color: #070b16 !important;
  border: 1px solid rgba(0, 240, 255, 0.3) !important;
  box-shadow: 0 0 25px rgba(0, 0, 0, 0.8) !important;
  color: #cbd5e1 !important;
}

html body #nc-root [class*="MenuItem"],
html body #nc-root [class*="DropdownItem"] {
  color: #cbd5e1 !important;
  font-family: "Share Tech Mono", monospace !important;
}

html body #nc-root [class*="MenuItem"]:hover,
html body #nc-root [class*="DropdownItem"]:hover {
  background-color: rgba(0, 240, 255, 0.15) !important;
  color: #00f0ff !important;
}