@charset "utf-8";
/* CSS Document */

@font-face {
  font-family: 'Inter UI';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/InterUI/Inter-UI-Light-BETA.woff2') format('woff2'), url('../fonts/InterUI/Inter-UI-Light-BETA.woff') format('woff');
}

@font-face {
  font-family: 'Inter UI';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/InterUI/Inter-UI-Medium.woff2') format('woff2'), url('../fonts/InterUI/Inter-UI-Medium.woff') format('woff');
}

body,
body.greyTheme {
  --headercolor: rgb(77, 78, 88);
  --highlightcolor: rgb(77, 78, 88);
  --navicolor: #fff;
  --sidebarcolor: #ffecf0;
  --sidenavicolor: rgb(77, 78, 88);
  --backgroundcolor: #fff;
  --processingbackgroundcolor: rgba(77, 78, 88, 0.7);
  --bordercolor: #ffdae2;
  --infocolor: #53f;
  --errorcolor: #f04;
  --errorcolor-rgb: 255 0 68;
  --succescolor: #0c0;
  --succescolor-rgb: 0 204 0;
}

body.blueTheme {
  --headercolor: #10034c;
  --highlightcolor: #0d0099;
  --navicolor: #fff;
  --sidebarcolor: #0d0099;
  --sidenavicolor: #fff;
  --backgroundcolor: #f0f1fb;
  --processingbackgroundcolor: rgba(16, 3, 76, 0.7);
  --bordercolor: #ecedf7;
  --infocolor: #0d0099;
}

body.lightBlueTheme {
  --headercolor: #10034c;
  --highlightcolor: #0d0099;
  --navicolor: #fff;
  --sidebarcolor: #c4ceff;
  --sidenavicolor: #0d0099;
  --backgroundcolor: #f0f1fb;
  --processingbackgroundcolor: rgba(16, 3, 76, 0.7);
  --bordercolor: #ecedf7;
  --infocolor: #0d0099;
}

body {
  background-color: var(--backgroundcolor);
  color: var(--highlightcolor);
  font-family: 'Inter UI', Arial, Helvetica, sans-serif;
  font-size: calc(11px + 0.25vmin);
  font-weight: 300;
  line-height: 1;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
}

strong {
  font-weight: 500;
}

i {
  font-style: italic;
}

a,
a:visited,
button,
input:not([type='text']) {
  color: var(--highlightcolor);
  text-decoration: none;
  transition: opacity 0.1s linear;
  cursor: pointer;
}
.info.sublabel {
  /*color: var(--infocolor);*/
  background-color: #fff;
  padding: 0.6em 0.8em;
  /*border: 0.12em solid var(--infocolor);*/
  border-radius: 4px;
  font-size: 75%;
  font-style: italic;
  letter-spacing: 0.04em;
}
.info.sublabel::after {
  content: ']';
}
.info.sublabel::before {
  content: '[';
}
.info.text-center {
  text-align: center;
  display: block;
}

.info.text-center a {
  padding: 5px;
}

nav a,
nav a:visited {
  color: var(--navicolor);
}

#nav a,
#nav a:visited {
  color: var(--sidenavicolor);
}

nav a:not(.selected):hover,
a.btn:hover,
button:hover,
#content a:hover,
table .icon:hover,
input:not([type='text']):hover {
  opacity: 0.6;
}

#nav .open > a:hover {
  opacity: 1;
}

#nav .open > a,
nav a.selected {
  color: var(--sidenavicolor);
  font-weight: 400;
  position: relative;
}

#nav .open > a:not([href='javascript:']):after,
#nav a.selected::after {
  content: '';
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0.8em 1.2em 0.8em 0;
  border-color: transparent var(--backgroundcolor) transparent transparent;
  position: absolute;
  right: -2.25vmax;
  top: -0.1em;
}

.scroll a,
.truncate,
#breadcrumb span:not(.icon) {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#nav,
header {
  position: fixed;
  z-index: 100;
}

header {
  background-color: var(--headercolor);
  box-shadow: 0 0 11px var(--headercolor);
}

#releaseInfo,
header {
  width: 100%;
}

#login,
#forgotpwd {
  width: clamp(300px, 50%, 800px);
  margin: auto;
  left: 0;
  right: 0;
}

.composer {
  position: absolute;
  z-index: 10000;
  border: var(--navicolor) 1px solid;
  right: 10px;
  top: 10px;
  padding: 6px;
  border-radius: 20px;
  color: var(--navicolor);
}

header nav {
  display: flex;
  align-items: center;
  padding: 0 2.25vmax;
  height: max(5rem, 8.5vh);
}

header img {
  height: 4rem;
  width: auto;
  padding-right: 2.5rem;
}

header nav * {
  white-space: nowrap;
}

header nav a:not(.logout, .brand-logo, .mobile-nav) {
  padding: 0 1.5rem;
}

header nav a,
header nav a:visited,
header nav a.selected {
  color: var(--navicolor);
}

header .mobile-nav {
  font-size: 230%;
  z-index: 100;
}

header nav a.mobile-nav {
  padding: 1.5rem 0;
}

header .logout {
  font-size: 175%;
}

.spacer {
  flex-grow: 1;
}

#release {
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 1000;
  text-align: right;
  padding: 0.5rem 2rem;
  width: 100%;
  background-color: var(--headercolor);
}

#release a {
  color: var(--navicolor);
}

#releaseInfo h1 {
  font-size: 150%;
  font-weight: bold;
  margin-bottom: 1em;
}

#releaseInfo h2 {
  font-size: 120%;
  font-weight: bold;
  margin-bottom: 1em;
}

#releaseInfo ul {
  margin-left: 0;
  margin-bottom: 2em;
  list-style-type: none;
  padding: 0;
}

#releaseInfo li {
  line-height: 2em;
}

#releaseInfo .tag {
  background-color: var(--headercolor);
  padding: 0.1em 0.5em;
  border-radius: 5px;
  color: var(--navicolor);
  margin-right: 5px;
}

#releaseInfo .tag.fix {
  background-color: var(--errorcolor);
}

#releaseInfo .tag.migration {
  background-color: #9c27b0;
}

#releaseInfo .tag.add,
#releaseInfo .tag.feat {
  background-color: var(--succescolor);
}

#releaseInfo,
#login,
#forgotpwd,
#nav,
#content {
  min-height: 100vh;
}

#nav,
#content {
  background-color: var(--sidebarcolor);
  width: 20vw;
  padding: 2rem;
  z-index: 10;
}

#nav {
  padding: max(6rem, 10.5vh) 2.25vmax 6em;
  overflow: hidden;
  height: 100vh;
}

#nav a {
  line-height: 1.41;
  display: block;
  margin-top: clamp(1em, 3vh, 2em);
  position: relative;
}

#nav .menu_item:first-child a {
  margin-top: 2vmax;
}

#nav .mnu_sub {
  margin: 0 0 2em 1em;
}

#nav .toggle:after {
  position: absolute;
  right: -16px;
}

#nav .open .toggle:after {
  content: '\f104';
}

#nav span:first-child {
  width: 90%;
  display: inline-block;
}

#nav .icon {
  color: color-mix(in oklab, var(--sidebarcolor), #000 25%);
  position: absolute;
  right: 0;
}

#nav .groupName .icon {
  position: initial;
  margin-right: 0.3em;
}

#nav:hover {
  overflow-y: auto;
}

#nav .mnu_item:not(:first-child).separator {
  margin-top: clamp(2em, 6vh, 4em);
}

#nav .mnu_item:not(:first-child).separator span {
  padding-top: 1em;
}

#nav .mnu_item.separator span {
  color: color-mix(in oklab, var(--sidebarcolor), #000 25%);
  font-size: 70%;
  font-weight: 400;
  text-transform: uppercase;
  white-space: nowrap;
  border-top: 1px solid color-mix(in oklab, var(--sidebarcolor), #000 15%);
}

#nav .bottom {
  padding-bottom: 1vh;
  padding-left: 2.25vmax;
  position: fixed;
  bottom: 30px;
  left: 0;
  width: 20vw;
  background-color: var(--sidebarcolor);
}

#feedback-btn {
  display: flex;
  justify-items: center;
  align-items: center;
  gap: 5px;
  font-weight: 400;
}

#feedback-btn svg {
  width: 2em;
  height: 2em;
}

#feedback-btn svg path {
  stroke: var(--sidenavicolor);
}

#feedback-btn svg circle {
  fill: var(--sidenavicolor);
}

#breadcrumb {
  font-size: 90%;
  line-height: 1.41;
  display: flex;
  column-gap: min(2vw, 1.5em);
}

#breadcrumb > div {
  cursor: pointer;
  float: left;
  position: relative;
}

#breadcrumb .icon {
  margin-right: 0.5em;
  position: relative;
  top: -0.3em;
}

#breadcrumb span:not(.icon) {
  border-bottom: 1px solid;
  max-width: 20em;
  display: inline-block;
}

#breadcrumb div.icon {
  transform: translateX(50%);
  display: block;
}

#breadcrumb a {
  color: color-mix(in oklab, var(--sidebarcolor), #000 25%);
}

#breadcrumb a.dropdown {
  clear: both;
  cursor: pointer;
  display: block;
  text-align: center;
  top: 3px;
  width: calc(100% + 2vw);
}

#breadcrumb .inner > div:last-of-type a.label:hover {
  color: inherit;
}

.scroll {
  position: absolute;
  z-index: 13;
}

.scroll div {
  background-color: #e3e2e6;
  box-shadow: 0 10px 20px 10px rgba(0, 0, 0, 0.1);
  max-height: calc(85vh - 80px);
  max-width: 40vw;
  overflow-x: hidden;
  overflow-y: auto;
}

.scroll a {
  background-color: var(--navicolor);
  display: block;
  padding: 0.4em 0.7em;
}

.scroll a:empty {
  display: none;
}

.scroll a:hover {
  background-color: #ddd;
}

.scroll a.selected {
  background-color: var(--headercolor);
  color: var(--navicolor);
}

.scroll a + a {
  margin-top: 1px;
}

#releaseInfo,
#login,
#forgotpwd,
#content {
  background-color: var(--backgroundcolor);
  padding: calc(max(6rem, 10.5vh) + 2.2vh) 5vw 6.5vmax 3.75vw;
  position: absolute;
}

#panel {
  margin-top: calc(clamp(1em, 3vh, 2em) + 1.41rem);
}

#content {
  left: 20vw;
  width: 80vw;
}

#CMS_lang_toggles {
  background-color: var(--backgroundcolor);
  position: sticky;
  position: -webkit-sticky;
  top: max(5rem, 8.5vh);
  padding: 3vh 0 2vh;
  margin-bottom: 2vh;
  z-index: 12;
}

#panel .separator,
form .group .name {
  margin: 2vh 0 3vh !important;
}

.fld-lang,
.smalltxt,
.counter {
  font-size: 75%;
  font-style: italic;
  letter-spacing: 0.04em;
  justify-content: right;
}

.fld-lang {
  font-size: 50%;
}

.linktable > span {
  display: inline-block;
  padding: 6px 4px 6px 0;
}

.use-ai {
  text-align: right;
}

.use-ai .message {
  text-align: center;
}

.use-ai .message.error {
  color: var(--errorcolor);
}

.header-messagebar {
  color: white;
  text-align: center;
  padding: 6px;
}

.header-messagebar.info {
  background-color: var(--infocolor);
}

.header-messagebar.warning {
  background-color: var(--errorcolor);
}

/*FORMS*/
form .group .content,
form {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
}

form .group .content > div,
form > div {
  width: 100%;
  margin-bottom: 1.5vh;
}

option[disabled] {
  display: none;
}

textarea {
  background-color: var(--navicolor);
  padding: 0.6vh 0.8vw;
  min-height: 50px;
  resize: vertical;
}

input[type='password'],
input[type='text'],
input[type='email'],
input[data-jscolor],
textarea {
  cursor: text;
}

input[type='password'],
input[type='text'],
input[type='email'],
input[data-jscolor],
textarea,
select {
  border: 1px solid var(--bordercolor);
  border-radius: 0.2em;
  background-color: var(--navicolor);
  color: var(--highlightcolor);
  line-height: 1.41;
  width: 100%;
  padding: 0.4em 2em 0.4em 0.7em;
}

.input-wrap,
.input-wrap > label,
label {
  display: flex;
  align-items: center;
  width: auto;
}

.input-wrap {
  column-gap: 3vw;
  row-gap: 1em;
  flex-wrap: wrap;
  position: relative;
}

.input-wrap label {
  margin: 0 2.5% 0 0.7em;
}

.select {
  background-color: var(--navicolor);
  position: relative;
}

.select::after {
  font-family: cms-icons;
  content: '\f280';
  position: absolute;
  right: 0.75em;
  line-height: 2.4;
}

select {
  background-color: transparent;
  position: relative;
  z-index: 1;
}

input:disabled,
.select.disabled,
select:disabled,
textarea:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

input[readonly] {
  opacity: 0.5;
  cursor: text;
}

input.error,
textarea.error,
select.error {
  color: var(--errorcolor);
  background: color-mix(in srgb, var(--backgroundcolor) 80%, var(--errorcolor) 20%) !important;
  background-color: rgb(var(--errorcolor-rgb) / 0.15) !important;
  box-shadow: 0 0 10px rgb(var(--errorcolor-rgb) / 0.35);
}

input.valid,
textarea.valid,
select.valid {
  color: var(--succescolor);
  background: color-mix(in srgb, var(--backgroundcolor) 85%, var(--succescolor) 15%) !important;
  background-color: rgb(var(--succescolor-rgb) / 0.18) !important;
  box-shadow: 0 0 10px rgb(var(--succescolor-rgb) / 0.35);
}

.tox-fullscreen header {
  display: none;
}

.cke .cke_inner,
.tox-tinymce {
  border-radius: 0.2em !important;
}

.cke_resizer_ltr {
  margin: 0.2em !important;
}

.cke_bottom,
.cke_top,
.cke_contents,
.cke_chrome {
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}

body.cke_editable {
  font-family: 'Inter UI', Arial, Helvetica, sans-serif !important;
  font-size: calc(11px + 0.25vmin) !important;
  font-weight: 300 !important;
  line-height: 1 !important;
  color: #444 !important;
}

div.input-wrap input[type='file'] {
  width: auto;
  margin: 0;
  float: none;
  background: none;
  position: relative;
  border: none;
}

form .group .content > div input[type='checkbox'],
form .group .content > div input[type='radio'],
form > div > input[type='checkbox'],
form > div > input[type='radio'] {
  position: relative;
}

.ts {
  display: block;
}

/* toggle switcher */

.toggleswitch,
.ts-check,
.ts-switch,
.ts-track {
  margin: 0;
  padding: 0;
  position: relative;
}

.toggleswitch {
  width: 36px;
  height: 20px;
  border-radius: 100px;
  background-color: #ddd;
  overflow: hidden;
  box-shadow: inset 0 0 2px 1px rgba(0, 0, 0, 0.05);
}

.ts_check {
  position: absolute;
  display: block;
  cursor: pointer;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  z-index: 6;
}

.ts_check:checked ~ .ts_track {
  box-shadow: inset 0 0 0 20px var(--highlightcolor);
}

.ts_check:checked ~ .ts_switch {
  right: 2px;
  left: 17px;
  transition: 0.25s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-property: left, right;
  transition-delay: 0.05s, 0s;
}

.ts_switch {
  position: absolute;
  left: 2px;
  top: 2px;
  bottom: 2px;
  right: 17px;
  background-color: var(--navicolor);
  border-radius: 36px;
  z-index: 1;
  transition: 0.25s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-property: left, right;
  transition-delay: 0s, 0.05s;
}

.ts_track {
  border: 1px solid var(--highlightcolor);
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  transition: 0.35s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  border-radius: 40px;
}

.form_actions,
#form_actions {
  display: flex;
  justify-content: space-between;
  margin: 3vh 0 0;
  flex-grow: 1;
}

#forgot {
  margin: 0.5vh 0 0;
  text-align: right;
}

.form_actions button,
#form_actions button,
#processing button {
  display: inline-block !important;
  text-align: center;
}

#overlay a.green,
#overlay a.active.green {
  background-color: var(--succescolor) !important;
}

#overlay a.red,
#overlay a.active.red {
  background: var(--errorcolor) !important;
}

tbody button,
form .icon {
  color: var(--highlightcolor);
  font-size: 125%;
  cursor: pointer;
  transition: opacity 0.1s linear;
}

.tbl_online .ion-ios-eye {
  font-size: 115%;
}

form .tbl_checkbox.no_edit .icon,
form .tbl_checkbox.no_edit .icon:hover {
  cursor: default;
  opacity: 1;
}

.sublabel,
#panel .linktable,
div.form_actions button,
#form_actions button,
a.reload,
a.del,
a.add,
a.btn {
  display: flex;
  align-items: center;
  column-gap: 0.5em;
}

.sublabel:not(:empty) {
  margin-top: 0.5em;
  width: calc(100% - 0.8vh);
}

.sublabel a {
  padding: 0 0.2em;
}

.actions {
  display: flex;
  column-gap: 0.5em;
}

a.reload,
a.del,
a.add,
a.btn > span {
  box-sizing: border-box;
  font-family: 'cms-icons';
  font-size: 120%;
  line-height: 109%;
  margin: 0;
  width: 100%;
  min-width: 36px;
}

td.add {
  vertical-align: text-top;
}

a.del {
  float: left;
  width: 52px;
  text-align: center;
}

a.btn {
  font-size: 75%;
  float: left;
  margin-right: 0px;
  padding: 1em !important;
}

a.reload,
a.del,
a.btn,
a.add,
.form_actions button,
#form_actions button,
#processing button,
#overlay button {
  color: var(--navicolor);
  background-color: var(--highlightcolor) !important;
  border-radius: 10em;
  font-weight: 500;
  white-space: nowrap;
  max-width: 14em;
  flex-basis: 20%;
  padding: 1.25em 1.75em;
}

.linktable a,
.linktable a:visited,
.linktable button {
  color: var(--highlightcolor);
  border: 0.07em solid var(--highlightcolor);
  border-radius: 0.2em;
  font-size: 84%;
  white-space: nowrap;
  padding: 0.5em;
  cursor: pointer;
}

.linktable a.selected,
.linktable a:hover {
  background-color: var(--highlightcolor);
  color: var(--navicolor);
}

.linktable button {
  border-style: dotted;
  border-width: 0.1em;
  text-transform: uppercase;
  border-radius: 2em;
}

form .group .content > div.halfwidth,
.halfwidth {
  width: 49%;
}

.halfwidth .input-wrap {
  padding: 0.4vh 0;
  vertical-align: bottom;
}

.break {
  flex-basis: 100%;
  height: 0;
  margin-bottom: 0;
}

.passwordFld {
  position: relative;
}

.passwordFld .icon {
  position: absolute;
  top: 0.4em;
  right: 0.4em;
  opacity: 0.8;
}

#login .halfwidth:first-of-type,
#forgotwd .halfwidth:first-of-type {
  margin-bottom: 1vh;
}

#login .halfwidth,
#forgotwd .halfwidth,
.clear {
  clear: left;
}

label:empty {
  display: none;
}

label {
  margin: 0 0.7em 0.8vh;
}

label.lbl-plugin {
  margin-bottom: 0.2vh;
}

.separator label,
form .group .name {
  background-color: var(--backgroundcolor);
  border: 0.12em solid var(--highlightcolor);
  border-bottom-color: var(--backgroundcolor);
  border-radius: 4px 4px 0 0;
  font-weight: 400;
  padding: 0.6em 0.8em 0;
  margin: 0 0 -0.12em;
  width: auto !important;
  position: relative;
}

label > span {
  cursor: pointer;
  padding-left: 0.4em;
  white-space: nowrap;
}

input[type='checkbox'],
input[type='radio'] {
  color: var(--highlightcolor);
  font-size: 125%;
}

input[type='radio']:checked::before {
  font-family: 'cms-icons';
  content: '\f1f7';
}

input[type='radio']:not(:checked)::before {
  font-family: 'cms-icons';
  content: '\f360';
}

input[type='checkbox']:not(.ts_check):checked::before {
  font-family: 'cms-icons';
  content: '\f148';
}

input[type='checkbox']:not(.ts_check):not(:checked)::before {
  font-family: 'cms-icons';
  content: '\f380';
}

.CMS_languagecopy {
  margin: 0.6vh 0;
}

.CMS_languagecopy input {
  width: auto;
}

.doc-tmb {
  display: flex;
  flex-wrap: wrap;
  padding-left: 0.8vh;
}

.doc-tmb > * {
  flex-grow: 0;
}

.doc-tmb img {
  width: auto;
  margin-right: 0.4rem;
}
.doc-tmb img.svg {
  height: 32px;
}

.doc-tmb input {
  flex-grow: 1;
  align-self: center;
  padding: 0;
  max-width: 280px;
}

.doc-tmb input::file-selector-button {
  color: var(--highlightcolor);
  background-color: transparent;
  border: 0.12em solid var(--highlightcolor);
  border-radius: 5px;
  padding: 0.4em 0.7em 0.4em 0.8em;
  cursor: pointer;
}

.doc-tmb i.icon {
  font-size: 220%;
  margin-right: 0.4rem;
}

.doc-tmb i.icon,
.doc-tmb a.download,
.doc-tmb button.del,
.doc-tmb .sublabel a {
  display: flex;
  align-self: center;
  margin: 0 0.7rem 0 0;
}

.txt-center {
  text-align: center;
}

.centered {
  margin: 0 auto;
}

table {
  width: 100%;
  overflow-x: initial;
  display: table;
}

td,
th {
  vertical-align: middle;
}

th.search {
  text-align: left;
  position: relative;
  display: table-cell;
}

th.search .icon.ion-icon-search {
  position: absolute;
  right: 0.9rem;
  cursor: initial;
  font-size: 150%;
}

.tbl > tbody td,
.tbl > tfoot tr.footer_totals td {
  padding: 0.6vh 0.25vw;
}

.tbl > tbody td.list {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 10vw;
}

.orderable {
  cursor: pointer;
  text-align: left;
  max-width: 5vw;
}

.orderable span:last-of-type {
  position: absolute;
  margin: -0.1em 0 0 0.25em;
}

.no_drag,
.tbl_chk,
.tbl_action,
.tbl_edit,
.tbl_online,
.lang {
  cursor: default;
}

.tbl img {
  width: 70%;
  vertical-align: middle;
  max-width: 50px;
  max-height: 32px;
  object-fit: contain;
}

.ui-sortable-handle {
  cursor: move;
}

.tbl_img {
  min-width: 54px;
  width: 7%;
}

.tbl_str {
  min-width: 15vw;
}

.tbl_str ~ .tbl_str {
  min-width: 10vw;
}

.txt_S {
  font-size: 0.75em;
}

.txt_M {
  font-size: 1em;
}

.txt_L {
  font-size: 1.25em;
}

.greyedout {
  color: lightgrey;
}

.tbl_chk,
td.add,
td.actions,
a.reload {
  text-align: center;
  width: 2.5em;
}

td.actions {
  position: relative;
}

tr.row_inactive td.list {
  opacity: 0.65;
}

a.active {
  background-color: var(--highlightcolor);
  color: var(--navicolor);
  border-radius: 40px;
  font-size: 80%;
  padding: 0.2em 0.6em;
  cursor: pointer;
  white-space: nowrap;
}

tfoot .footer-action {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.2vh 1.3vw 0.6vh 0.9vw;
}

.footer-action button,
button.del,
a.download {
  width: clamp(0.95em, 0.1vw, 1em);
  align-self: flex-start;
  flex-shrink: 0;
}

form .group.toggle .name {
  cursor: pointer;
}

form .group.toggle .name:hover {
  opacity: 0.9;
}

form .group .name .icon {
  display: none;
}

form .group.toggle .name .icon {
  position: absolute;
  right: 0.7em;
  display: inline-block;
  top: 0.4em;
  line-height: 1.1;
}

form .group.close .content {
  display: none;
}

.check-group {
  margin-bottom: 0 !important;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.check-group .input-wrap {
  margin-bottom: 1.75vh;
}

.check-group .sublabel {
  margin-left: 0.7em;
}

.pager {
  font-size: 90%;
  display: flex;
  justify-content: center;
  column-gap: 0.35em;
}

.pager > * {
  background-color: var(--highlightcolor);
  border-radius: 50px;
  color: var(--navicolor);
  font-weight: 400;
  line-height: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}

.pager .select:after {
  color: var(--navicolor);
  font-size: 75%;
  right: 0.4em;
}

.pager select {
  color: var(--navicolor);
  padding: 0 1.25em 0 0.4em;
  border: none;
}

.pager a {
  min-width: 1.43em;
}

.pager option,
.pager a.selected {
  background-color: var(--headercolor);
  cursor: auto;
}

.pager a.icon {
  min-width: 1.13em;
  display: flex;
  align-items: center;
}

.pager a.icon::before {
  color: var(--navicolor);
  font-size: 56%;
}

th.search a {
  cursor: pointer;
  float: left;
  padding-right: 10px;
}

th.search button {
  margin: 1vh 0 0 0.85vw;
}

th.search input {
  background-color: transparent;
  border: none;
  border-bottom: 1px solid color-mix(in oklab, var(--sidebarcolor), #000 2%);
  font-size: 1rem;
  color: var(--highlightcolor);
  margin-bottom: 2vh;
  width: 33%;
  padding-right: 3.1em;
  float: right;
  border-radius: 0;
  padding-top: 0;
  margin-bottom: 0.7em;
}

.tbl input {
  float: none;
  width: auto;
}

.tbl .modifying input {
  padding-left: 0;
  padding-right: 0;
  color: var(--highlightcolor);
  width: 100%;
}

.tbl_online,
.tbl_lang,
.tbl_checkbox,
.tbl_edit,
.tbl_action,
.tbl .lang {
  width: clamp(0.3em, 5%, 7vw);
  text-align: center;
  white-space: nowrap;
}

.tbl_float {
  text-align: right;
}

td.tbl_online,
td.tbl_checkbox,
td.tbl_edit {
  font-size: 15px;
}

td.tbl_checkbox {
  font-size: 100%;
}

.tbl .online0 {
  background-color: #f00;
}

.tbl .online1 {
  background-color: #0f0;
}

thead tr th:not(.search) {
  background-color: var(--headercolor);
  color: var(--navicolor);
  padding: 0.6vh 0.25vw;
  overflow: hidden;
  text-overflow: ellipsis;
}

thead tr th:not(.search):first-child {
  border-top-left-radius: 0.2em;
}

thead tr th:not(.search):last-child {
  border-top-right-radius: 0.2em;
}

thead tr th:not(.search) .icon {
  color: var(--navicolor) !important;
  font-size: 100%;
}

.tbl > tbody td:first-child,
thead tr th:not(.search):first-child {
  padding-left: 0.85vw;
}

.tbl > tbody td:last-child,
thead tr th:not(.search):last-child {
  padding-right: 0.85vw;
}

th input[type='checkbox'] {
  color: var(--navicolor);
}

.tbl > tbody tr {
  border-bottom: 1px solid color-mix(in oklab, var(--sidebarcolor), #000 2%);
  transition: background 0.2s ease;
}

.tbl > tbody tr:hover,
.tbl > tbody tr.selected {
  background-color: var(--navicolor);
}

tbody tr:hover.selected,
tbody tr:hover.selected {
  background-color: var(--highlightcolor);
}

#tbl-preview-img {
  position: absolute;
  border: 1px solid var(--highlightcolor);
  background: var(--headercolor);
  padding: 5px;
  display: none;
  color: var(--navicolor);
}

#tbl-preview-img > img {
  vertical-align: middle;
  max-height: 100px;
}

table.contracted .medium-hide,
table.contracted .small-hide {
  display: none;
}

.show-small,
.show-small::before {
  display: none;
}

.semi-transparent {
  opacity: 0.35;
}

#overlay {
  width: 100%;
  max-width: 1200px;
  position: absolute;
  top: calc(38px + 10vh);
  left: 50%;
  -ms-transform: translate(-50%, 0);
  -webkit-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  border: 0;
  z-index: 95;
}

#overlay .form_actions {
  margin-bottom: 2rem;
}

#content.overlay {
  height: calc(100% - (38px + 5vh));
  overflow: hidden;
}

#overlay-bg {
  background-color: var(--backgroundcolor);
  top: calc(2rem + 5vh);
  height: 100%;
  position: fixed;
  width: 100%;
  z-index: 90;
}

#processing {
  background-color: var(--processingbackgroundcolor);
  width: 100vw;
  height: 100vh;
  display: flex;
  justify-content: space-around;
  align-items: center;
  position: fixed;
  z-index: 1000;
}

#processing.hide {
  display: none;
}

#processing .message {
  display: table-cell;
  text-align: left;
  vertical-align: middle;
  z-index: 10;
}

#processing .message-box {
  background-color: var(--navicolor);
  border-radius: 2px;
  box-shadow: 0 10px 25px var(--headercolor);
  width: 70%;
  max-width: 800px;
  z-index: 1;
}

#processing .message-titlebox {
  background-color: var(--headercolor);
  color: var(--navicolor);
  padding: 1.5vh 1vw;
}

#processing .message-content {
  padding: 2vh 1vw 2.1vh;
}

#processing .message-footbox {
  display: flex;
  justify-content: space-between;
  padding: 0 1vw 1vw;
}

#processing .icon {
  position: absolute;
  width: 30px;
  height: 30px;
  border: 8px solid var(--navicolor);
  border-right-color: transparent;
  border-radius: 50%;
  box-shadow: 0 0 25px 2px var(--backgroundcolor);
  animation: spin 1s linear infinite;
  margin: -15px 0 0 -15px;
  left: 50%;
  top: 50%;
}

#processing .progress {
  position: absolute;
  bottom: 0;
  width: 100%;
}

#processing .progress .bar {
  background-color: var(--headercolor);
  width: 0%;
  height: 20px;
  border-radius: 3px;
}

#processing .progress .percent {
  position: absolute;
  display: inline-block;
  top: -20px;
  left: calc(50% - 7px);
  font-size: 0.7em;
}

#wrapperpano {
  position: relative;
  width: 100%;
  height: 500px;
}

#pano {
  position: absolute;
  width: 100%;
  height: 100%;
}

#pano div {
  width: 100% !important;
  height: 100% !important;
}

#pano img.hotspot {
  width: auto;
}

/* skin */
.tox-tinymce {
  border: 1px solid var(--bordercolor) !important;
}

.tox:not([dir='rtl']) .tox-toolbar__group:not(:last-of-type) {
  border-right: 1px solid var(--bordercolor) !important;
}

.tox .tox-menubar + .tox-toolbar,
.tox .tox-menubar + .tox-toolbar-overlord .tox-toolbar__primary,
.tox .tox-statusbar {
  border-top: 1px solid var(--bordercolor) !important;
}

.tox .tox-toolbar,
.tox .tox-toolbar__overflow,
.tox .tox-toolbar__primary {
  background: none !important;
  background-color: #fff !important;
  border-bottom: 1px solid var(--bordercolor) !important;
}

.tox .tox-tbtn {
  font-family: 'Inter UI', Arial, Helvetica, sans-serif !important;
  font-size: calc(11px + 0.25vmin) !important;
  /*line-height: 1;*/
  color: var(--highlightcolor) !important;
}

.mfa-login h1 {
  font-size: 2.5em;
  font-weight: 400;
  margin: 0 0 4.5vh 0;
}
.mfa-login input {
  font-size: 2.5em;
  font-weight: 400;
  width: 2em;
  text-align: center;
  padding: 0.2em;
}
.mfa-login input:focus {
  background-color: #eee;
}
.mfa a {
  text-decoration: underline;
}
button[disabled] {
  cursor: not-allowed;
  opacity: 0.5;
}

@keyframes spin {
  from {
    transform: rotate(0deg);
    opacity: 0.2;
  }

  50% {
    transform: rotate(180deg);
    opacity: 1;
  }

  to {
    transform: rotate(360deg);
    opacity: 0.2;
  }
}

/* general */

.notification {
  display: flex;
  align-items: start;
  gap: 0.75rem;
  padding: 1rem 1.25rem;
  border-radius: 0.5rem;
  font-size: 0.95rem;
  line-height: 1.4;
  margin-bottom: 1rem;
  border-left: 4px solid;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.notification .icon {
  font-size: 1.25rem;
  line-height: 1;
  margin-top: 0.15rem;
}

.notification.success {
  background-color: #ecfdf5;
  border-color: #10b981;
  color: #065f46;
}

.notification.error {
  background-color: #fef2f2;
  border-color: #ef4444;
  color: #991b1b;
}

.notification.warning {
  background-color: #fff7ed;
  border-color: #f59e0b;
  color: #78350f;
}

.notification.info {
  background-color: #eff6ff;
  border-color: #3b82f6;
  color: #1e3a8a;
}

.password-feedback {
  margin-top: 1em;
}

.deepl svg {
  margin-top: 2vh;
  width: 125px;
}

.disabled {
  opacity: 0.5;
}

.hide,
.force-hide,
a.btn.hide,
.hide-languages,
.hide::before,
.hide-languages::before,
.doc-tmb i.icon.hide {
  display: none;
}

#nav .open .hide {
  display: block;
}

@media all and (max-width: 1024px) {
  #nav .open > a:not([href='javascript:']):after,
  #nav a.selected::after {
    border-width: 0.7em 1em 0.7em 0;
    top: 0;
  }

  .hide-medium {
    display: none;
  }

  form .group .content > div label:not([for]),
  form > div > label:not([for]) {
    float: none;
    clear: both;
    width: 100% !important;
    display: inline-block;
  }

  .input-wrap.img-tmb {
    margin-bottom: -10px;
  }

  .halfwidth {
    clear: none;
    float: left;
    width: 100% !important;
  }
  .check-group .halfwidth > label {
    display: none;
  }

  .lbl {
    text-align: left;
  }

  #panel .separator {
    width: 100%;
    margin-left: 0px;
  }

  .medium-hide {
    display: none;
  }
}

@media all and (max-width: 900px) {
  .show-small:not(.hide),
  .show-small:not(.hide)::before {
    display: flex;
  }

  #nav {
    visibility: hidden;
    width: 60vw;
    left: -250px;
  }

  #nav.open-nav {
    visibility: visible;
    left: 0;
    z-index: 11;
  }

  #nav.open-nav nav {
    display: block !important;
  }

  .brand-logo.authorized {
    display: none;
  }

  header nav {
    padding: 2rem 1rem;
  }

  header nav a:not(.logout, .brand-logo, .mobile-nav) {
    padding: 1em 0 1em 2em;
  }

  #releaseInfo,
  #login,
  #forgotpwd,
  #content {
    left: 0;
    width: 100%;
    padding: calc(max(6rem, 9vh) + 2.2vh) 1vw;
  }

  #login,
  #forgotpwd {
    width: 90%;
  }

  #breadcrumb {
    margin-bottom: 3vh;
  }

  div.input-wrap input[type='file'] {
    margin: 15px 0 0 -1%;
  }

  #processing .message {
    margin: -62px 0 0 -150px;
  }

  #processing .message-box {
    width: 90vw;
  }

  th.search input {
    width: 89%;
  }

  a.del {
    width: 36px;
  }

  a.btn {
    margin: 2px 0 0 0;
  }
}

@media all and (max-width: 800px) {
  .hide-small {
    display: none;
  }

  .small-hide {
    display: none;
  }

  th.search input {
    width: calc(100% - 2.5em);
  }

  td.actions > div {
    width: auto;
    position: inherit;
  }

  .orderable span:last-of-type {
    visibility: hidden;
  }
}