@charset "UTF-8";
@font-face {
  font-family: "Rubik";
  font-style: normal;
  font-weight: 300;
  src: local("Rubik Light"), local("Rubik-Light"), url("../../assets/fonts/rubik-light.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  font-display: swap;
}
@font-face {
  font-family: "Rubik";
  font-style: normal;
  font-weight: 400;
  src: local("Rubik"), local("Rubik-Regular"), url("../../assets/fonts/rubik-regular.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  font-display: swap;
}
@font-face {
  font-family: "Rubik";
  font-style: normal;
  font-weight: 500;
  src: local("Rubik Medium"), local("Rubik-Medium"), url("../../assets/fonts/rubik-medium.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  font-display: swap;
}
@font-face {
  font-family: "Rubik";
  font-style: normal;
  font-weight: 700;
  src: local("Rubik Bold"), local("Rubik-Bold"), url("../../assets/fonts/rubik-bold.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
  font-display: swap;
}
.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

button {
  display: flex;
  justify-content: center;
  align-items: center;
  font-stretch: normal;
  font-style: normal;
  letter-spacing: normal;
  text-align: center;
  cursor: pointer;
  vertical-align: middle;
  transition: height 0.5s ease;
  box-sizing: border-box;
  margin: 0 0.5rem;
}
button:disabled {
  cursor: not-allowed;
  opacity: 0.7;
}

.btn-small {
  width: 8rem;
  height: 2.286rem;
  border-radius: 1.714rem;
  font-size: 1.014rem;
  font-weight: normal;
  line-height: 1.42;
}
.btn-small:disabled {
  border-color: #bdbdbd;
  color: #bdbdbd;
}

.btn-medium {
  width: 8rem;
  height: 3.429rem;
  border-radius: 1.714rem;
  font-size: 1.143rem;
  font-weight: 500;
  line-height: 1.5;
}

.btn-large {
  width: 8rem;
  height: 4rem;
  border-radius: 28px;
  font-size: 1.286rem;
  font-weight: 500;
  line-height: 1.44;
}

.btn-primary {
  background-color: #da0000;
  color: #fff;
  border: 1px solid #da0000;
}
.btn-primary:disabled, .btn-primary.disabled {
  background-color: #fff;
  border-color: #bdbdbd;
  color: #bdbdbd;
  cursor: not-allowed;
}
.btn-primary.btn-outlined {
  background-color: #fff;
  color: #da0000;
  border: 1px solid #da0000;
}
.btn-primary.btn-outlined:hover {
  background-color: #da0000;
  color: #fff;
}
.btn-primary.btn-outlined:disabled {
  border-color: #bdbdbd;
  color: #bdbdbd;
}

.btn-secondary {
  background-color: #363636;
  color: #fff;
  border: 1px solid #fff;
}
.btn-secondary:hover {
  background-color: #fff;
  color: #363636;
}
.btn-secondary:disabled {
  border-color: #bdbdbd;
  background-color: #fff;
  color: #bdbdbd;
}
.btn-secondary.btn-outlined {
  background-color: #fff;
  color: #363636;
  border: 1px solid #363636;
}
.btn-secondary.btn-outlined:hover {
  background-color: #363636;
  color: #fff;
}
.btn-secondary.btn-outlined:hover a {
  color: #fff;
}
.btn-secondary.btn-outlined:disabled {
  border-color: #bdbdbd;
  color: #bdbdbd;
}
.btn-secondary.btn-outlined:disabled:hover {
  background-color: #fff;
  color: #bdbdbd;
}

.btn-right button {
  display: block;
  margin-left: auto;
  margin-right: 0;
}

.btn-left button {
  display: block;
  margin-right: auto;
  margin-left: 0;
}

.btn-center button {
  display: flex;
  margin: 0 auto;
}

.btn-uppercase {
  text-transform: uppercase;
}

.btn-m__long {
  width: 10.143rem;
}

.btn-long {
  width: 12.286rem;
}

.btn-no__margin button {
  margin: 0;
}

.btn-with__margin button {
  margin: 0.5rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-root--container {
  display: grid;
  min-height: 100vh;
  grid-template-rows: minmax(0, min-content) 1fr minmax(0, min-content);
}

.m-root--container__background {
  background: no-repeat center 85% fixed;
  background-size: cover;
}

.context-menu {
  position: fixed;
  z-index: 1000;
  min-width: 200px;
  padding: 4px;
  background-color: white;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
  transform-origin: top left;
  transform: scale(0.95);
  opacity: 0;
  visibility: hidden;
  transition: transform 0.1s ease-out, opacity 0.1s ease-out;
  margin: 0;
  padding-left: 0;
}

.context-menu.is-open {
  transform: scale(1);
  opacity: 1;
  visibility: visible;
}

.context-menu ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.context-menu button {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  width: 100%;
  padding: 8px 12px;
  background: none;
  border: none;
  border-radius: 6px;
  color: #1f2937;
  cursor: pointer;
  font-size: 14px;
  text-align: left;
  transition: background-color 0.1s ease-in-out;
  padding-left: 1rem;
  margin-left: 0.1rem;
}
.context-menu button ul,
.context-menu button li {
  padding: 0;
  margin: 0;
}

.context-menu button:hover {
  background-color: #f3f4f6;
}

.context-menu-icon {
  width: 16px;
  height: 16px;
  color: #4b5563;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.context-menu-icon svg {
  width: 100%;
  height: 100%;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-auth--container {
  display: flex;
  height: 100%;
  align-items: flex-start;
  justify-content: center;
}

.m-auth--form--container {
  width: 31.7rem;
}

.m-auth--logo {
  width: 40%;
  margin: 0 auto;
}
.m-auth--logo svg {
  fill: #da0000;
  width: 100%;
}

.m-auth-form--section {
  display: block;
  background: #fff;
  border: 1px #dfdfdf solid;
  border-top: 0;
  padding: 1.5rem 3rem;
  border-radius: 0.125rem;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  text-decoration: none;
}
.m-auth-form--section a {
  text-decoration: none;
  padding-bottom: 0.5rem;
}
.m-auth-form--section a:last-child {
  padding-bottom: 0;
}
.m-auth-form--section a:hover {
  background-color: #fff;
}
.m-auth-form--section .m-auth__link-custom {
  text-decoration: underline;
  display: inline;
}
.m-auth-form--section span {
  text-decoration: underline;
}
.m-auth-form--section .m-rapi-import__uploadarea {
  border: 0;
  position: absolute;
  top: 35%;
  left: 35%;
}

.m-auth--topbar {
  background: #da0000;
  height: 0.5rem;
  border-bottom: 0;
  border-top-left-radius: 0.125rem;
  border-top-right-radius: 0.125rem;
}

.m-auth--forgot-pw {
  display: block;
  color: #888;
  text-align: right;
  text-decoration: none;
  float: right;
}
.m-auth--forgot-pw:hover {
  background: none;
  text-decoration: underline;
}

.m-list-icons {
  padding: 2rem 0 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
}
.m-list-icons li {
  text-align: center;
  font-size: 0.9rem;
  width: 18rem;
  height: 16rem;
  box-sizing: border-box;
}
.m-list-icons a {
  display: inline-block;
  text-decoration: none;
  padding: 0 1rem;
}
.m-list-icons img,
.m-list-icons svg {
  width: 4rem;
  height: 4rem;
  padding: 1rem 0;
}
.m-list-icons h2 {
  font-weight: 400;
}

.m-list-catalogs {
  list-style: none;
  margin: 0;
  padding: 0;
}

.m-list-catalogs__create {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.m-asset-upload__container {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr));
}
.m-asset-upload__container .m-image-uploader__container {
  padding-right: 1rem;
  padding-bottom: 1.5rem;
}

.m-generate-images {
  display: inline-block;
  text-decoration: underline;
  cursor: pointer;
  top: 0.5rem;
  position: absolute;
  z-index: 100;
  right: 2.5rem;
}

.m-item__preview {
  height: 30rem;
}
.m-item__preview img {
  display: block;
  margin: 0 auto;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-tbl__icon svg {
  width: 1.286rem;
  height: 1.286rem;
  cursor: pointer;
  vertical-align: middle;
}

.m-tbl__show-on-hover {
  visibility: hidden;
  display: block;
  text-align: end;
  padding-right: 1rem;
}

.m-tbl tr:hover .m-tbl__show-on-hover {
  visibility: visible;
  cursor: pointer;
}
.m-tbl tr.m-tbl__no_hover td {
  border-bottom: 0;
}
.m-tbl tr.m-tbl__no_hover:hover {
  background-color: unset;
  cursor: default;
}
.m-tbl tr:last-child td {
  border-bottom: 0;
}
.m-tbl td {
  padding: 0 0.5rem;
}

.m-link__active {
  text-decoration: underline;
}

.m-link__active-highlight:hover {
  text-decoration: underline;
}

.m-tbl-cell__disabled {
  opacity: 0.5;
}

.m-tbl-cell__disabled-cursor {
  cursor: not-allowed;
}

.m-tbl__plus-medium a {
  display: inline-block;
  cursor: pointer;
}
.m-tbl__plus-medium a:hover {
  background: #da0000;
}

.m-tbl__sortable {
  cursor: pointer;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-list-catalogs li {
  border: 1px solid #dfdfdf;
  width: 100%;
  height: 14.286rem;
  margin: 0 1rem 1rem 0;
  cursor: pointer;
  border-radius: 1rem;
  position: relative;
  box-sizing: border-box;
}
.m-list-catalogs li:hover {
  border-color: #979797;
}
.m-list-catalogs a,
.m-list-catalogs .m-card--button {
  display: grid;
  height: 100%;
  grid-template-rows: 1fr minmax(0, min-content);
  background: transparent none top left;
  background-size: cover;
  text-decoration: none;
}
.m-list-catalogs .m-draft__link {
  display: inline-block;
  color: #da0000;
  text-decoration: underline;
  height: auto;
  padding-left: 0.3rem;
  max-width: 6rem;
  vertical-align: middle;
}
.m-list-catalogs .m-draft__link:hover {
  background-color: transparent;
}

.m-draft-container {
  display: flex;
  justify-content: center;
  align-items: baseline;
}

.m-list-catalogs__link {
  position: relative;
}

.m-list-catalogs__textcontainer {
  background-color: rgba(255, 255, 255, 0.9);
  text-align: center;
  overflow: hidden;
  border-radius: 1rem;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.m-list-catalogs__textcontainer span {
  display: inline-block;
  font-size: 0.8rem;
}
.m-list-catalogs__textcontainer .m-draft__label {
  height: auto;
  padding-bottom: 0.5rem;
  font-weight: 700;
}

.m-list-catalogs__textcontainer-new {
  display: flex;
  justify-content: center;
  align-items: center;
}

.m-list-catalogs__logo img,
.m-list-catalogs__logo svg {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.m-list-catalogs__logo svg {
  width: 5rem;
  height: 5rem;
}
.m-list-catalogs__logo .m-fallback__icon svg {
  position: unset;
  transform: unset;
  width: 3rem;
  height: 3rem;
}
.m-list-catalogs__logo .m-item__icon-thumbnails svg {
  width: 1.5rem;
  height: 1.5rem;
  filter: drop-shadow(1px 1px 1px #fff);
  z-index: 100;
}
.m-list-catalogs__logo .h-icon-plus__disabled {
  cursor: not-allowed;
  border-radius: 50%;
}

.m-list-catalog__draft {
  text-align: end;
  display: block;
  padding: 0.2rem;
  font-weight: 700;
  color: #da0000;
  position: absolute;
  top: 0.3rem;
  left: 0.3rem;
}

.m-list-catalog__draft-list {
  align-self: baseline;
  position: relative;
}

.m-tbl-label__container {
  position: relative;
  max-width: fit-content;
  height: 100%;
}

.m-list__cover-img {
  width: 100%;
  height: 100%;
  background-size: cover;
  opacity: 0.3;
  position: absolute;
  right: 0;
  border-radius: 1rem;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background-color: #fff;
  height: 3.75rem;
  border-bottom: 1px solid #eee;
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  z-index: 204;
  box-sizing: border-box;
}

.m-header--hamburger {
  display: inline-block;
  position: relative;
  width: 1.786rem;
  height: 0.814rem;
  margin: 0 1.5rem;
  margin-left: 0;
  cursor: pointer;
  border-top: 0.196rem solid #000;
  border-bottom: 0.196rem solid #000;
}
.m-header--hamburger::before {
  content: "";
  position: absolute;
  top: 0.3rem;
  left: 0;
  width: 100%;
  border-top: 0.196rem solid #000;
}

.m-header--side-menu {
  flex-shrink: 0;
  align-self: flex-start;
}
.m-header--side-menu a {
  text-decoration: none;
}

.m-header--container {
  padding-top: 3.75rem;
  z-index: 204;
}

.m-header__full-height {
  height: 100%;
}

.m-main__close-space {
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 49;
}

.m-header--close {
  display: flex;
  position: relative;
  width: 1.786rem;
  height: 0.814rem;
  margin: 0 1.5rem;
  margin-left: 0;
  cursor: pointer;
  align-items: center;
}
.m-header--close::before, .m-header--close::after {
  position: absolute;
  left: 1rem;
  content: " ";
  height: 2.3rem;
  width: 2px;
  background-color: #000;
}
.m-header--close::before {
  transform: rotate(45deg);
}
.m-header--close::after {
  transform: rotate(-45deg);
}

.m-tbl__backward::after {
  transform: translate(0%, -50%) rotate(-45deg);
}

.m-header__content-lang {
  position: absolute;
  right: 13rem;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}
.m-header__content-lang .c-select {
  min-width: 4rem;
}
.m-header__content-lang .c-select .ember-power-select-status-icon {
  display: block;
  border-color: #000 transparent transparent;
}
.m-header__content-lang .c-select i {
  display: none;
}

.m-header__content-lang-custom {
  right: 8rem;
}

.m-header__content-lang-label {
  padding-right: 1rem;
}

.h-p__2-left {
  padding-left: 2.5rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

nav {
  position: fixed;
  top: 3.75rem;
  left: -24rem;
  width: 20rem;
  height: calc(100% - 3.75rem);
  background: #fff;
  z-index: 50;
  border-right: 2px solid #dfdfdf;
  box-shadow: 0.6rem 0 2rem rgba(0, 0, 0, 0.1);
  overflow: auto;
  transition: left 0.4s ease-in;
}
nav ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
nav ul a {
  padding: 0.3rem 0 1.3rem 1.63rem;
  text-decoration: none;
  display: block;
  font-weight: 400;
}
nav ul svg {
  position: relative;
  top: 0.48rem;
  padding: 0.2rem 1.3rem 0 0;
  width: 2.15rem;
  height: 2.15rem;
  display: inline-block;
}
nav ul .nav-embedding__item svg {
  top: 0.68rem;
  left: 0.25rem;
}
nav ul .nav-embedding__item-small svg {
  height: 1.7rem;
  position: static;
}
nav ul li {
  font-size: 1.1rem;
  color: #000;
  border-top: 1px solid #eee;
}
nav ul li:first-child {
  border-top: 0;
}
nav ul ul {
  padding: 0 0 1rem;
}
nav ul ul li {
  font-size: 1rem;
  border-top: 0;
}
nav ul ul a {
  padding: 0.3rem 0 0.3rem 4.95rem;
}
nav.show-animateable {
  left: 0;
}
nav footer {
  position: relative;
  font-size: 0.9rem;
  padding-top: 4rem;
}
nav footer li {
  display: inline;
  padding: 0;
  font-size: 0.9rem;
}
nav footer li a {
  display: inline;
  padding: 0;
  font-size: 0.9rem;
}
nav footer li + li {
  border-top: 0;
}
nav .m-fallback__title {
  display: none;
}
nav .m-fallback__image-centered {
  margin-top: 1.5rem;
  margin-bottom: 1rem;
  width: 3.2rem;
  height: 1.8rem;
}
nav .m-fallback-image {
  justify-content: center;
}

.m-menu__bottom-container {
  margin-top: 4rem;
}

.m-version__container {
  position: absolute;
  bottom: 2rem;
  width: 100%;
}
.m-version__container p,
.m-version__container a {
  color: #888;
}
.m-version__container a {
  text-decoration: underline;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-header--searchbar__container {
  width: 100%;
}

.m-header--searchbar {
  height: 2.5rem;
  background-color: #f4f4f4;
  flex-grow: 2;
  align-self: center;
  text-align: center;
  visibility: hidden;
  border-radius: 1rem;
  opacity: 0;
  position: relative;
  transition: visibility 0.4s linear, opacity 0.4s ease-in-out;
}
.m-header--searchbar input {
  appearance: textfield;
  height: 100%;
  width: 100%;
  padding: 0 1rem 0 3rem;
  font-size: 1.2rem;
  text-align: left;
  color: #000;
  border: 0;
  outline: 0;
  display: inline-block;
  box-sizing: border-box;
  font-family: Rubik, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-weight: 300;
  background-color: transparent;
  overflow: hidden;
}
.m-header--searchbar input::placeholder {
  color: #000;
  transition: color 0.4s;
}
.m-header--searchbar input:focus::placeholder {
  color: #a9a9a9;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-header--actionitems {
  display: flex;
  justify-content: flex-end;
  align-items: stretch;
}
.m-header--actionitems ul {
  list-style: none;
  padding: 0 1rem;
  margin: 0;
}
.m-header--actionitems li {
  display: block;
  padding: 0 0.5rem;
  cursor: pointer;
}

.m-header--tenantswitch {
  display: block;
  text-decoration: none;
  position: relative;
  font-size: 0.9rem;
  padding-left: 0.5rem;
  padding-right: 1.8rem;
  height: 1.8rem;
}
.m-header--tenantswitch span {
  position: absolute;
  right: 0.4rem;
  transform: translate(0%, -65%) rotate(-135deg);
  border-color: #000;
}
.m-header--tenantswitch .m-fallback__title {
  padding-left: 0;
}

.m-header--tenantswitch-menu {
  position: absolute;
  visibility: hidden;
  overflow-y: auto;
  opacity: 0;
  top: calc(3.75rem - 0.01rem);
  right: 0;
  width: 23rem;
  background: #fff;
  border-bottom-left-radius: 0.125rem;
  border: 1px solid #dfdfdf;
  box-shadow: 0.1rem 2rem 3rem rgba(0, 0, 0, 0.1);
  max-height: calc(100vh - 3.75rem);
  border-top: 0;
  border-bottom: 0;
}
.m-header--tenantswitch-menu hr {
  background: #da0000;
  height: 0.9rem;
  display: block;
  margin: 0;
  margin-left: -2px;
  border: 0;
  border-left: 2px solid #da0000;
}
.m-header--tenantswitch-menu ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.m-header--tenantswitch-menu ul li {
  padding: 0;
  border-bottom: 1px solid #eee;
  display: flex;
  justify-content: flex-start;
  overflow: hidden;
}
.m-header--tenantswitch-menu ul .no-tenants-results {
  padding: 1rem 0;
  text-align: center;
  display: block;
}
.m-header--tenantswitch-menu ul a {
  text-decoration: none;
  padding: 1rem 0 1rem 1.6rem;
  position: relative;
  display: grid;
  grid-template-columns: 80% 20%;
  align-items: center;
}
.m-header--tenantswitch-menu ul img {
  display: inline-block;
}
.m-header--tenantswitch-menu ul .active {
  font-family: Rubik, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
.m-header--tenantswitch-menu ul .active .m-fallback__title,
.m-header--tenantswitch-menu ul .active .m-header--tenant__id {
  font-weight: 700;
}
.m-header--tenantswitch-menu ul .active .m-header--tenant__id span {
  font-weight: 700;
}
.m-header--tenantswitch-menu .m-header--searchbar {
  transition: none;
  border-radius: 0;
}

.m-header--tenantswitch__container .m-fallback__image,
nav .m-fallback__image {
  width: 3.2rem;
  height: 1.8rem;
}
.m-header--tenantswitch__container .m-fallback-image__text,
nav .m-fallback-image__text {
  color: #fff;
  background: #da0000;
  font-weight: 700;
  width: 3.2rem;
  height: 1.8rem;
  box-sizing: border-box;
  text-align: center;
}
.m-header--tenantswitch__container .m-fallback__title,
nav .m-fallback__title {
  padding-left: 1rem;
}
.m-header--tenantswitch__container .m-fallback__img,
nav .m-fallback__img {
  display: inline-block;
  width: auto;
  height: auto;
  box-sizing: border-box;
  max-width: 3.2rem;
  max-height: 1.8rem;
  object-fit: cover;
}

.m-header--tenantswitch__container .m-fallback-image__container,
.m-header--tenantswitch__container .m-fallback__image {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.m-header--tenantswitch__container .m-fallback__image-centered {
  height: 100%;
}

nav .m-fallback__image {
  margin-left: auto;
  margin-right: auto;
}

.m-header--tenant__id {
  color: #888;
  padding-right: 1.6rem;
  text-align: left;
}
.m-header--tenant__id span {
  font-weight: inherit;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-header--usericon {
  margin: 0 0.8rem;
  padding: 0 0.2rem;
  margin-right: 0;
  padding-right: 0;
  cursor: pointer;
}
.m-header--usericon img {
  display: block;
  height: 3rem;
  border-radius: 50%;
}
.m-header--usericon:hover {
  background: #eee;
}

.m-header--userprofile-menu {
  position: absolute;
  visibility: hidden;
  opacity: 0;
  top: 3.75rem;
  right: 0;
  width: 25rem;
  background: #fff;
  border-bottom-left-radius: 0.125rem;
  border: 1px solid #dfdfdf;
  box-shadow: -0.1rem 0.5rem 1rem 2px rgba(0, 0, 0, 0.1);
  border-right: 0;
  border-top: 0;
}
.m-header--userprofile-menu hr {
  background: #dfdfdf;
  height: 1px;
  display: block;
  margin: 0;
  border: 0;
  border-left: 1px solid #dfdfdf;
  position: absolute;
  width: 100%;
  left: 0;
}
.m-header--userprofile-menu ul {
  padding: 0;
  margin: 0;
  padding-left: 1rem;
  padding-right: 1rem;
}
.m-header--userprofile-menu ul li {
  padding-bottom: 1.25rem;
  padding-top: 1.25rem;
}
.m-header--userprofile-menu ul li:first-child {
  padding-top: 1.5rem;
}
.m-header--userprofile-menu ul li:last-child {
  border: 0;
}
.m-header--userprofile-menu ul a {
  color: #da0000;
  font-weight: 400;
  text-decoration: underline;
}
.m-header--userprofile-menu ul a:hover {
  background-color: #fff;
}
.m-header--userprofile-menu .m-header__logout {
  display: flex;
}

.m-header__user-profile {
  padding-bottom: 0.8rem;
}

.m-header--profilemenu-name {
  font-size: 1rem;
  font-weight: 400;
}

.m-header__role-label {
  padding-bottom: 0.8rem;
  font-weight: 400;
  text-transform: uppercase;
  font-size: 0.8rem;
}
.m-header__role-label span {
  font-weight: 300;
}

.m-header__role-types,
.m-header__pricing-days {
  font-size: 1rem;
}

.m-header__role-types {
  max-width: 70%;
}

.m-header--content-lang {
  font-size: 0.8rem;
  text-overflow: ellipsis;
  overflow: hidden;
  padding-top: 1rem;
}
.m-header--content-lang svg {
  width: 1.125rem;
  height: 1.125rem;
  vertical-align: middle;
  padding-right: 0.3rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-breadcrumb__container {
  position: fixed;
  top: 3.75rem;
  margin: 0;
  padding: 0;
  z-index: 204;
  height: 1.975rem;
  width: 100%;
  box-sizing: border-box;
  left: 0;
  border: 1px solid #eee;
  background: #f9f9f9;
  border-top: 0;
}

.m-breadcrumb {
  list-style: none;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  height: 1.975rem;
  margin: 0;
  padding: 0;
}
.m-breadcrumb li {
  font-size: 0.9rem;
  color: #000;
  text-align: left;
  position: relative;
}
.m-breadcrumb svg {
  fill: #888;
  width: 1.5rem;
  height: 1.5rem;
}

.m-breadcrumb__link {
  color: #000;
  text-decoration: none;
  font-size: 0.9rem;
  overflow: hidden;
  width: 100%;
  font-weight: 400;
  align-items: center;
  cursor: pointer;
  max-width: 8rem;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: inline-block;
  vertical-align: middle;
}

.m-breadcrumb-link__disabled {
  color: #888;
}
.m-breadcrumb-link__disabled:hover {
  cursor: auto;
}

.m-breadcrumb-icon__container {
  width: 1.5rem;
  height: 1.5rem;
}

.m-breadcrumb-no__icon svg {
  display: none;
}

.m-tbl__backward::after {
  transform: translate(0%, -50%) rotate(-45deg);
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

footer {
  margin: 0.8em auto;
  text-align: center;
  color: #888;
}
footer a {
  text-decoration: none;
}
footer ul {
  margin: 0 auto;
  padding: 0;
  list-style: none;
  text-align: center;
}
footer ul::after {
  content: "";
  display: block;
  clear: both;
}
footer ul li {
  display: inline;
  text-align: center;
  padding: 0 0.5rem;
}
footer p {
  margin: 0;
  text-align: center;
}

.m-footer-logo--container {
  max-width: 10rem;
  margin: 2rem auto;
}

.help-icon__container {
  position: fixed;
  bottom: 2rem;
  right: 2rem;
  z-index: 501;
  display: block;
}
.help-icon__container svg {
  width: 1.5rem;
  height: 1.5rem;
  fill: #888;
  cursor: pointer;
}
.help-icon__container svg:hover {
  fill: #da0000;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.c-pdc-message {
  border: 1px solid #000;
  color: #fff;
  background: #000;
  padding: 0;
  box-shadow: 0 0.4rem 0.9rem 0.2rem rgba(0, 0, 0, 0.1);
  border-radius: 0.4rem;
  position: relative;
  margin: 0;
  font-size: 0.9rem;
  font-weight: 300;
  max-height: 0;
  overflow: hidden;
  display: none;
  z-index: 11;
  transition: max-height 0.4s 0ms ease-in-out, opacity 0.4s 0ms ease-in-out;
}
.c-pdc-message svg {
  position: absolute;
  width: 1.5rem;
  height: 1.5rem;
  top: 1.5rem;
  left: 1.5rem;
  fill: #fff;
}
.c-pdc-message h2 {
  font-family: Rubik, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-size: 1.2rem;
  font-weight: 400;
  padding-bottom: 0.67rem;
  padding-top: 0.67rem;
}
.c-pdc-message .c-pdc__custom-heading {
  font-size: 1rem;
  padding-bottom: 0;
}
.c-pdc-message.c-pdc-message--fade-out {
  border: 0;
  transition: max-height 0.4s 0ms ease-in-out, opacity 150ms 0ms ease-in-out, padding 0ms 0.4s ease, margin 0ms 0.4s ease;
}
.c-pdc-message.warning {
  background: #fff;
  color: #000;
}
.c-pdc-message.warning svg {
  fill: #000;
}
.c-pdc-message.info {
  background-color: #eee;
  padding: 0.5rem 1rem 1rem 3.6rem;
  box-shadow: 0 0.2rem 0.5rem 0.2rem rgba(0, 0, 0, 0.2);
}
.c-pdc-message.info svg {
  top: 50%;
  transform: translateY(-50%);
}

.c-pdc-info__icon svg {
  left: auto;
  width: 1.2rem;
  right: 1rem;
}

.c-pdc-message--fade-in {
  max-height: 100%;
  display: block;
  padding: 0.75rem 3.6rem 1.47rem 3.6rem;
  margin: 0 0 2rem;
}

.c-pdc-message__content {
  display: block;
}
.c-pdc-message__content div {
  padding-top: 0.5rem;
}

.c-pdc-message__wide {
  width: 50%;
}
.c-pdc-message__wide svg {
  display: none;
}
.c-pdc-message__wide h3 {
  font-weight: 700;
  margin-bottom: 0.5rem;
}
.c-pdc-message__wide p {
  font-size: 0.9rem;
}
.c-pdc-message__wide hr {
  width: calc(100% + 1rem + 3.6rem);
  margin-left: -3.6rem;
}
.c-pdc-message__wide .m-save-changes__overlay-buttons {
  justify-content: center;
  padding-top: 1.5rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-pdc-logo--container {
  overflow: hidden;
  text-align: center;
  letter-spacing: 0.08rem;
  font-weight: 500;
  font-size: 0.9rem;
  max-width: 10rem;
}

.m-pdc-logo--svg {
  fill: #da0000;
}

header .m-pdc-logo {
  padding-right: 2rem;
}
header .m-pdc-logo--svg {
  width: 5.5rem;
  display: block;
  padding: 0 0 0.15rem;
}
header .m-pdc-logo--container {
  max-width: 5.5rem;
  font-size: 0.8rem;
  font-weight: 500;
  letter-spacing: 0;
}

.m-logo__container-custom a {
  cursor: pointer;
}

.m-logo__disabled svg {
  fill: #888;
  width: 5.5rem;
  height: 5.5rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-droparea {
  z-index: 11;
}
.m-droparea.uploading, .m-droparea.processing {
  border-color: #da0000;
}
.m-droparea.dragging .m-rapi-import__helper {
  color: #fff;
  border-color: #fff;
  opacity: 0;
}
.m-droparea.dragging .m-filedownload {
  color: #fff;
  opacity: 0;
  cursor: pointer;
}
.m-droparea.dragging .m-droparea__uploadarea {
  opacity: 0;
}

.m-rapi-import__helper {
  align-self: flex-start;
  padding: 1rem 2rem;
}
.m-rapi-import__helper span {
  color: #da0000;
  font-weight: 500;
}

.m-filedownload {
  display: block;
  padding: 1rem 0 1rem 2rem;
  margin-left: -0.22rem;
  text-decoration: none;
  cursor: pointer;
  position: relative;
}
.m-filedownload svg {
  position: absolute;
  left: 0;
  top: 0.55rem;
  width: 1.7rem;
  height: 1.7rem;
}
.m-filedownload:hover {
  background-color: transparent;
  text-decoration: underline;
}

.m-rapi-import__uploadarea {
  border-left: 1px solid #dfdfdf;
  max-width: 14rem;
  padding: 2rem 3rem;
}
.m-rapi-import__uploadarea p {
  font-weight: 400;
  padding-left: 1rem;
  text-align: center;
}
.m-rapi-import__uploadarea img {
  width: 3rem;
  height: 3rem;
}

.m-rapi-import__uploadarea__custom {
  padding-left: 1rem;
  vertical-align: middle;
}

.m-rapi-import__minusmargin {
  margin-top: -1.2rem;
}
.m-rapi-import__minusmargin + .m-rapi-import__minusmargin {
  margin-top: -2rem;
}

.m-rapi-import__choose {
  height: 80%;
  display: flex;
  align-items: center;
  border-left: 1px solid #dfdfdf;
}

.m-rapi-import__choose-custom {
  flex-direction: column;
}
.m-rapi-import__choose-custom .m-droparea__uploadarea {
  padding-bottom: 0.5rem;
  order: 1;
}

.m-rapi-import__helper-custom {
  padding: 3rem 2rem;
}

.m-rapi-import__response-container {
  font-size: 0.9rem;
}

@media only screen and (max-width: 1329px) {
  .h-stackview-vertical {
    flex-direction: column;
  }
  .h-stackview-vertical div {
    margin: 0;
  }
}
@media only screen and (max-width: 1176px) {
  .m-rapi-import__choose {
    border-top: 1px solid #dfdfdf;
    padding-top: 1rem;
    padding-bottom: 0.5rem;
    border-left: 0;
    align-items: flex-end;
  }
  .m-droparea {
    display: flex;
    flex-direction: column;
  }
  .m-rapi-import__uploadarea {
    border-top: 1px solid #dfdfdf;
    border-left: 0;
  }
}
.m-export__container {
  position: relative;
  z-index: 11;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.roomle-glb-canvas-container {
  height: 100%;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.roomle-material-canvas-container {
  height: 25vh;
  width: 100%;
}
.roomle-material-canvas-container .dg.main {
  display: none;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.roomle-configurator-canvas-container {
  height: 100%;
  position: relative;
  border-top: 1px solid #dfdfdf;
  border-bottom: 1px solid #dfdfdf;
  box-sizing: border-box;
  border-radius: 0;
}

.rml-fill {
  border: 0;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.c-radio {
  padding: 0.2rem 0;
}

[type=radio] + label {
  position: relative;
  padding-left: 2rem;
  cursor: pointer;
  line-height: 1.42rem;
  display: inline-block;
  color: #000;
}
[type=radio] + label::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 1.286rem;
  height: 1.286rem;
  border-radius: 50%;
  border: 1px solid #dfdfdf;
  background: #fff;
}
[type=radio] + label::after {
  content: "";
  width: 0.857rem;
  height: 0.857rem;
  background-color: #000;
  position: absolute;
  top: 0.286rem;
  left: 0.286rem;
  border-radius: 50%;
  transition: transform 0.4s ease;
  transform: scale(1);
}
[type=radio]:checked {
  position: absolute;
}
[type=radio]:checked + label::after {
  opacity: 1;
  transform: scale(1);
}
[type=radio]:not(:checked) {
  position: absolute;
}
[type=radio]:not(:checked) + label::after {
  content: "";
  opacity: 0;
  transform: scale(0);
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.c-checkbox {
  position: relative;
  display: flex;
  align-items: center;
}
.c-checkbox label {
  display: inline-block;
  padding: 0;
  padding-left: 0.75rem;
  white-space: initial;
}
.c-checkbox label::before {
  content: "";
  position: absolute;
  width: 1.12rem;
  height: 1.12rem;
  left: 0;
  top: 0.05rem;
  border-radius: 0.125rem;
  border: 2px solid #000;
}
.c-checkbox input {
  visibility: hidden;
}
.c-checkbox input:checked + label::before {
  border-color: #da0000;
  background: #da0000;
}
.c-checkbox input:checked + label::after {
  content: "";
  position: absolute;
  width: 0.76rem;
  height: 0.32rem;
  left: 0.26rem;
  top: 0.36rem;
  border-style: solid;
  border-width: 0 0 0.16rem 0.16rem;
  border-color: #fff;
  transform: rotate(-45deg);
}
.c-checkbox.disabled {
  cursor: not-allowed;
}
.c-checkbox.disabled label {
  color: #a9a9a9;
}
.c-checkbox.disabled label::before, .c-checkbox.disabled label::after {
  filter: grayscale(100%);
  opacity: 0.5;
  cursor: not-allowed;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.c-textfield {
  display: block;
  padding: 0.4rem 0;
  position: relative;
}
.c-textfield label {
  font-size: 0.9rem;
  color: #000;
  text-align: left;
  display: inline-block;
  margin-bottom: 0.2rem;
}
.c-textfield input {
  font-size: 1.2rem;
  color: #000;
  text-align: left;
  line-height: 1.5rem;
  width: 100%;
  padding: 0.4rem 2rem 0.4rem 0.1rem;
  border: 1px solid #dfdfdf;
  border-radius: 0.125rem;
  box-sizing: border-box;
  outline: 0;
}
.c-textfield input:focus ~ .hint {
  opacity: 1;
}
.c-textfield.error input {
  border-color: #da0000;
}
.c-textfield.error input:focus {
  box-shadow: 0 0 5px 2px rgba(218, 0, 0, 0.15);
}
.c-textfield .hint {
  opacity: 0;
  font-size: 0.9rem;
  transition: 0.4s;
}
.c-textfield .c-textfield-hint__visible {
  opacity: 1;
}
.c-textfield .errors-container {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto;
  grid-column-gap: 0;
  justify-items: stretch;
}
.c-textfield .errors-container .error {
  font-size: 0.9rem;
  color: #da0000;
}
.c-textfield .errors-container .error-jump {
  justify-self: end;
  text-decoration: underline;
  color: #da0000;
}
.c-textfield .errors-container .error-jump:hover {
  cursor: pointer;
  background-color: transparent;
}
.c-textfield.disabled input {
  color: #a9a9a9;
  cursor: not-allowed;
  -webkit-text-fill-color: #a9a9a9;
  background: transparent;
  width: 100%;
}
.c-textfield.disabled .hint {
  color: #a9a9a9;
}
.c-textfield:hover .hint {
  opacity: 1;
}

.c-input__prefix {
  color: #a9a9a9;
  line-height: 2.2rem;
  border: 1px solid #dfdfdf;
  display: flex;
  font-size: 1.2rem;
  align-items: center;
  border-radius: 0.125rem;
}
.c-input__prefix input {
  border: 0;
  width: 100%;
}
.c-input__prefix .m-tbl__icon-copy__inner {
  top: 1.5rem;
}

.c-prefix__container {
  padding-bottom: 0.4rem;
  padding-top: 0.4rem;
  line-height: 1.5rem;
  color: #000;
  display: flex;
  border-top-left-radius: 0.125rem;
  border-bottom-left-radius: 0.125rem;
}

.c-textfield__prefix {
  display: inline-block;
  text-overflow: ellipsis;
  max-width: 8rem;
  white-space: nowrap;
  overflow: hidden;
  vertical-align: bottom;
  font-weight: 400;
  padding-left: 0.1rem;
}

.flash-bg {
  animation-name: flash;
  animation-timing-function: ease-out;
  animation-duration: 0.5s;
}

@keyframes flash {
  0% {
    background: rgba(218, 0, 0, 0.5);
  }
  100% {
    background-color: transparent;
  }
}
.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.c-select {
  display: block;
  padding: 0.5em 0;
  position: relative;
  min-width: 3rem;
  cursor: pointer;
}
.c-select label {
  font-family: Rubik, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-size: 0.9rem;
  color: #000;
  text-align: left;
  display: inline-block;
  margin-bottom: 0.2rem;
}
.c-select .c-select__trigger-wrapper {
  position: relative;
  margin: 0.2rem 0 0.6rem;
}
.c-select .c-select__trigger-wrapper .ember-basic-dropdown-trigger {
  margin: 0;
}
.c-select .c-select__trigger-wrapper i {
  position: absolute;
  right: 0.75rem;
  top: 50%;
  transform: translateY(-50%) rotate(-135deg);
  border-color: #000;
  pointer-events: none;
  z-index: 2;
}
.c-select .ember-power-select-trigger {
  height: 2.4rem;
}
.c-select .ember-power-select-trigger:focus {
  border: 1px solid #dfdfdf;
}
.c-select .ember-power-select-selected-item {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.c-select select,
.c-select .ember-basic-dropdown-trigger,
.c-select .ember-flatpickr-input {
  display: block;
  width: 100%;
  margin: 0.2rem 0 0.6rem;
  padding: 0.4rem 1.5rem 0.4rem 0.3rem;
  appearance: none;
  font-family: Rubik, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-size: 1rem;
  color: #000;
  text-align: left;
  line-height: 1.5rem;
  border: 1px solid #dfdfdf;
  border-radius: 0.125rem;
  box-sizing: border-box;
  overflow: hidden;
  z-index: 1;
}
.c-select select:focus,
.c-select .ember-basic-dropdown-trigger:focus,
.c-select .ember-flatpickr-input:focus {
  outline: 0;
}
.c-select select:focus + .hint,
.c-select .ember-basic-dropdown-trigger:focus + .hint,
.c-select .ember-flatpickr-input:focus + .hint {
  opacity: 1;
}
.c-select .ember-power-select-status-icon {
  display: none;
}
.c-select .hint {
  opacity: 0;
  transition: 0.4s;
  font-size: 0.9rem;
}
.c-select.disabled {
  cursor: not-allowed;
}
.c-select.disabled select {
  color: #a9a9a9;
  background: transparent;
}
.c-select.disabled::after {
  opacity: 0.5;
}
.c-select:hover .hint {
  opacity: 1;
}

.c-select__small {
  max-width: 30%;
}

select,
.ember-basic-dropdown-trigger,
.ember-flatpickr-input {
  z-index: 1;
}

.ember-power-select-option--no-matches-message {
  overflow: auto;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.c-textarea {
  display: block;
  padding: 0.5em 0;
}
.c-textarea label {
  font-family: Rubik, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-size: 0.9rem;
  color: #000;
  text-align: left;
  display: inline-block;
  margin-bottom: 0.2rem;
}
.c-textarea textarea {
  font-family: Rubik, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-size: 1.2rem;
  color: #000;
  text-align: left;
  line-height: 1.714rem;
  display: block;
  width: 100%;
  min-height: 5rem;
  padding: 0.3em 2rem 0.3rem 0;
  border: 1px solid #dfdfdf;
  border-radius: 0.125rem;
  box-sizing: border-box;
  outline: 0;
  white-space: pre-line;
}
.c-textarea.error textarea {
  border-color: #da0000;
}
.c-textarea.error textarea:focus {
  box-shadow: 0 0 5px 2px rgba(218, 0, 0, 0.15);
}
.c-textarea .errors-container {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto;
  grid-column-gap: 0;
  justify-items: stretch;
}
.c-textarea .errors-container .error {
  font-size: 0.9rem;
  color: #da0000;
}
.c-textarea .errors-container:disabled {
  cursor: not-allowed;
  background-color: #eee;
}
.c-textarea .errors-container:focus + .hint {
  opacity: 1;
}
.c-textarea .errors-container.code {
  font-size: 0.8rem;
  font-family: monospace, monospace;
  line-height: 1.1rem;
  resize: vertical;
  min-height: 20rem;
}
.c-textarea .hint {
  opacity: 0;
  font-size: 0.9rem;
  transition: 0.4s;
  height: 1rem;
  word-break: break-word;
}
.c-textarea.disabled textarea {
  color: #a9a9a9;
}
.c-textarea.disabled .hint {
  color: #a9a9a9;
}
.c-textarea:hover .hint {
  opacity: 1;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.c-slider {
  display: block;
  padding: 0.5em 0;
  position: relative;
}
.c-slider label {
  font-family: Rubik, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-size: 0.9rem;
  color: #888;
  text-align: left;
  display: inline-block;
  margin-bottom: 0.2rem;
}
.c-slider input {
  border: 0;
  margin: 0.9rem 0 0.6rem;
  display: block;
  width: 100%;
  padding: 0;
  appearance: none;
  transition: opacity 0.4s;
  height: 2rem;
  background: transparent;
  outline: none;
  cursor: pointer;
}
.c-slider input::-webkit-slider-thumb {
  appearance: none;
  background: #da0000;
  border-radius: 50%;
  width: 1.1rem;
  height: 1.1rem;
  cursor: pointer;
  position: relative;
  z-index: 10;
  top: -0.5rem;
}
.c-slider input::-webkit-slider-runnable-track {
  height: 1px;
  margin: 0.55rem 0;
  background: linear-gradient(#da0000, #da0000) 0/var(--p) 100% no-repeat #888;
}
.c-slider input::-moz-range-thumb {
  background: #da0000;
  border-radius: 50%;
  width: 1.1rem;
  height: 1.1rem;
  cursor: pointer;
  border: 0;
}
.c-slider input::-moz-range-progress {
  background: #da0000;
  height: 1px;
}
.c-slider input::-moz-focus-outer {
  border: 0;
}
.c-slider input:focus ~ .c-slider__hoover {
  opacity: 1;
}
.c-slider .c-slider__hoover {
  opacity: 0;
  transition: 0.4s;
  font-size: 0.9rem;
}
.c-slider.disabled input {
  cursor: not-allowed;
}
.c-slider.disabled input::-webkit-slider-thumb {
  background: #a9a9a9;
  cursor: default;
}
.c-slider.disabled input::-moz-range-thumb {
  background: #a9a9a9;
  cursor: default;
}
.c-slider:hover .c-slider__hoover {
  opacity: 1;
}
.c-slider:focus {
  outline: none;
}

.c-slider__infos {
  position: relative;
}
.c-slider__infos::after {
  content: "";
  display: block;
  clear: both;
}

.c-slider__min {
  float: left;
}

.c-slider__max {
  float: right;
}

.c-slider__current {
  position: absolute;
  left: 2rem;
  background: #fff;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

main .m-collapsible {
  box-sizing: border-box;
  position: relative;
  padding: 1rem 0;
  width: 100%;
  margin: 0 auto;
  margin-bottom: 1rem;
}
main .m-collapsible.collapsed .m-collapsible--content {
  overflow: hidden;
}
main .m-collapsible__no-border {
  border: 0;
  padding: 0;
}
main .m-error-msg {
  position: initial;
  top: -0.5rem;
  right: 3rem;
  padding: 0.2rem;
  font-size: 1rem;
  font-weight: 400;
  color: #da0000;
}

.m-collapsible--header__container {
  display: flex;
  justify-content: space-between;
  padding: 0.6rem 4%;
}

.m-collapsible--navpoint {
  position: absolute;
  top: -6.725rem;
}

.m-form-has__subnav .m-collapsible--navpoint {
  top: -10.475rem;
}

.m-collapsible--header {
  position: relative;
  padding: 0 2rem;
}
.m-collapsible--header h2 {
  padding-bottom: 0.5rem;
  font-size: 1.8rem;
}
.m-collapsible--header .m-error-underline {
  text-decoration: underline;
}
.m-collapsible--header span {
  position: absolute;
  top: 0.5rem;
  right: 1rem;
  cursor: pointer;
  transform: translate(0%, -50%) rotate(45deg);
  border-color: #000;
  transition: transform 0.4s;
}
.m-collapsible--header span.closed {
  transform: translate(0%, -50%) rotate(-135deg);
}

.m-collapsible--clickarea {
  position: absolute;
  left: 0;
  top: -1rem;
  right: 0;
  height: 3rem;
  cursor: pointer;
}

.m-collapsible--content {
  padding: 0 4%;
  transition: height 0.4s;
  height: auto;
}

.m-collapsible--innercontent {
  transition: height 0.4s;
  position: relative;
  cursor: auto;
}

.m-collapsible__fullwidth {
  margin: 0 -4.347826087%;
  margin-bottom: 2rem;
}
.m-collapsible__fullwidth .m-subform__disable {
  margin: 0 0.3rem;
}
.m-collapsible__fullwidth .m-content-result__container {
  width: 100%;
}

.m-collapsible__80_percent_width {
  margin: 0 calc(-4.347826087% / 3);
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-ps__plus {
  float: left;
  cursor: pointer;
  margin-right: 0.3rem;
}
.m-ps__plus.disabled {
  filter: grayscale(100%);
  opacity: 0.5;
  cursor: default;
}

li.m-ps__item {
  background: #eee;
  border: 1px solid #dfdfdf;
  border-radius: 0.4rem;
  color: #000;
  height: 1.5rem;
  max-width: 11rem;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  margin: 0.3rem 0.3rem 0.3rem 0;
  padding: 0.1rem 0.5rem;
  box-sizing: border-box;
}

.ember-power-select-multiple-trigger {
  overflow-y: hidden;
}
.ember-power-select-multiple-trigger:focus {
  outline: none;
}

.ps-search__container {
  width: 100%;
  list-style: none;
}

.ember-power-select-multiple-options .ember-power-select-trigger-multiple-input {
  border: 1px solid #dfdfdf;
  width: 100%;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

div.ember-power-select-dropdown.ember-basic-dropdown-content--below,
div.ember-power-select-dropdown.ember-basic-dropdown-content--above,
div.ember-power-select-dropdown.ember-basic-dropdown-content--left,
div.ember-power-select-dropdown.ember-basic-dropdown-content--below {
  border: 0;
  border-radius: 0;
}

div.ember-power-select-dropdown .ember-power-select-search {
  padding: 0;
}
div.ember-power-select-dropdown .ember-power-select-search-input {
  border-radius: -1px;
  border: 0;
  border-top: 1px solid #dfdfdf;
  border-bottom: 1px solid #dfdfdf;
}
div.ember-power-select-dropdown .ember-power-select-search-input:focus {
  outline: none;
}
div.ember-power-select-dropdown li {
  border-left: 1px solid #dfdfdf;
  border-right: 1px solid #dfdfdf;
}
div.ember-power-select-dropdown li:first-child {
  border-top: 1px solid #dfdfdf;
}
div.ember-power-select-dropdown li:last-child {
  border-bottom: 1px solid #dfdfdf;
}

.ember-power-select-options {
  background: #fff;
}

ul.ember-power-select-options::after {
  content: "";
  position: absolute;
  bottom: -1px;
  left: 0;
  height: 0;
  border: 1px solid #dfdfdf;
  width: 100%;
  box-sizing: border-box;
}
ul.ember-power-select-options[role=listbox] {
  max-height: 11.25rem;
  overflow-x: hidden;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-container__height .m-droparea {
  margin-bottom: 1rem;
}
.m-container__height h2 {
  font-weight: 700;
  padding-bottom: 0.3rem;
}

.configuration-hint__desc {
  font-size: 0.9rem;
  font-weight: 500;
}

.m-preview__containers {
  vertical-align: middle;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
}

.m-catalogs__sort-container {
  background-color: #fff;
}
.m-catalogs__sort-container .m-box-item {
  border: 0;
  padding: 0 2rem;
}

.m-export__item {
  border: 0;
  padding-top: 1rem;
}
.m-export__item .c-radio {
  flex-grow: 0;
  width: 10%;
}
.m-export__item .h-stackview-vertical {
  justify-content: flex-start;
}
.m-export__item label {
  font-size: 1rem;
}
.m-export__item button {
  display: block;
  margin-left: auto;
  margin-right: 0;
}

.m-export__item-variation {
  padding-top: 0;
  padding-bottom: 0.01rem;
}

.m-generate-images__placeholder {
  display: flex;
  justify-content: flex-start;
  width: 100%;
}

.m-assets__overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 100;
  cursor: not-allowed;
  opacity: 0.2;
  background-color: #fff;
}

.m-integration__link .m-tbl__show-on-hover {
  visibility: visible;
}

.m-collapsible .m-preview__content {
  width: 100%;
  border-radius: 0;
}
.m-collapsible .m-variations__short-url {
  position: relative;
  width: auto;
}
.m-collapsible .m-tbl__show-on-hover_hide {
  display: none;
}

.m-message__container {
  box-sizing: border-box;
  position: sticky;
  top: 5.725rem;
  z-index: 100;
  margin: 0 auto;
}

.m-2cols__50-percent {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 2rem;
}
.m-2cols__50-percent .c-textfield,
.m-2cols__50-percent .c-textarea {
  padding: 0.39rem 0;
}
.m-2cols__50-percent .c-select {
  padding-bottom: 0;
  padding-top: 0.2rem;
}
.m-2cols__50-percent textarea {
  min-height: 7.9rem;
}

.m-2cols__50-percent-custom {
  grid-template-columns: 1fr;
  align-items: center;
}
.m-2cols__50-percent-custom input:checked + label::after {
  left: -0.2rem;
  top: 0.7rem;
}
.m-2cols__50-percent-custom input[type=text] {
  border-right: 1px solid #dfdfdf;
  margin-right: 1rem;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.m-2cols__50-percent-custom .c-checkbox {
  display: flex;
}
.m-2cols__50-percent-custom .c-checkbox label {
  display: inline-block;
  max-width: 8rem;
  white-space: nowrap;
  padding-right: 0.5rem;
}
.m-2cols__50-percent-custom .c-checkbox label::before {
  top: 45%;
  transform: translateY(-50%);
  left: -0.5rem;
}

.c-input__prefix input {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.m-timestamps__container {
  display: flex;
}
.m-timestamps__container .h-date {
  padding-right: 0.5rem;
}

.m-tags__container .m-box-item {
  border: 0;
  padding-top: 2rem;
  padding-left: 0;
}

hr {
  background: #888;
  height: 1px;
  display: block;
  margin: 0;
  margin-left: -2px;
  border: 0;
  border-left: 2px solid #888;
}

.m-root-tag__heading {
  padding-top: 1rem;
}

.m-tags-roots__container {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  align-items: center;
}
.m-tags-roots__container .m-tags__tree {
  margin-top: 0;
}
.m-tags-roots__container ul li {
  padding-left: 0;
}
.m-tags-roots__container form {
  width: 100%;
}

.m-preview__container {
  z-index: 0;
}
.m-preview__container .m-preview {
  height: 20rem;
}
.m-preview__container .m-preview__content,
.m-preview__container .roomle-configurator-canvas-container {
  height: 100%;
  border: 0;
  background-color: #f9f9f9;
}
.m-preview__container .m-preview__selector {
  display: none;
}

.m-preview__separator {
  margin-top: 2.1rem;
}

.m-item__container {
  display: flex;
  flex-direction: column-reverse;
}

.m-2col-ms__side {
  margin-top: -2rem;
}

.h-sticky__container {
  position: sticky;
  top: 4rem;
}

@media only screen and (max-width: 1270px) {
  .m-2cols__50-percent {
    display: block;
  }
  .m-timestamps__container {
    padding-top: 1rem;
  }
}
.pd-configuration {
  background-color: #f9f9f9;
}

.pd-variations,
.pd-import-log,
.task-history,
.pd-drafts {
  padding-bottom: 0;
  margin-bottom: 0;
}
.pd-variations .m-tbl__no-item__creation-hint,
.pd-import-log .m-tbl__no-item__creation-hint,
.task-history .m-tbl__no-item__creation-hint,
.pd-drafts .m-tbl__no-item__creation-hint {
  border: 0;
}
.pd-variations .m-tbl__header,
.pd-import-log .m-tbl__header,
.task-history .m-tbl__header,
.pd-drafts .m-tbl__header {
  position: static;
  border-top: 0;
  padding: 0;
}
.pd-variations .m-tbl__header h2,
.pd-import-log .m-tbl__header h2,
.task-history .m-tbl__header h2,
.pd-drafts .m-tbl__header h2 {
  visibility: hidden;
}
.pd-variations .m-tbl__header .h-icon-plus,
.pd-import-log .m-tbl__header .h-icon-plus,
.task-history .m-tbl__header .h-icon-plus,
.pd-drafts .m-tbl__header .h-icon-plus {
  padding: 0.5rem 0;
}
.pd-variations .m-products__container-items,
.pd-import-log .m-products__container-items,
.task-history .m-products__container-items,
.pd-drafts .m-products__container-items {
  max-width: 90%;
  margin: 0 auto;
  border: 0;
}
.pd-variations .m-icons__separator,
.pd-import-log .m-icons__separator,
.task-history .m-icons__separator,
.pd-drafts .m-icons__separator {
  display: none;
}
.pd-variations .m-tbl-more__icon,
.pd-variations .m-content-lang__container,
.pd-import-log .m-tbl-more__icon,
.pd-import-log .m-content-lang__container,
.task-history .m-tbl-more__icon,
.task-history .m-content-lang__container,
.pd-drafts .m-tbl-more__icon,
.pd-drafts .m-content-lang__container {
  display: none;
}
.pd-variations .m-tbl-overflow__hide,
.pd-import-log .m-tbl-overflow__hide,
.task-history .m-tbl-overflow__hide,
.pd-drafts .m-tbl-overflow__hide {
  display: none;
}
.pd-variations .m-tbl,
.pd-import-log .m-tbl,
.task-history .m-tbl,
.pd-drafts .m-tbl {
  border: 0;
}
.pd-variations .m-tbl th,
.pd-variations .m-tbl thead,
.pd-import-log .m-tbl th,
.pd-import-log .m-tbl thead,
.task-history .m-tbl th,
.task-history .m-tbl thead,
.pd-drafts .m-tbl th,
.pd-drafts .m-tbl thead {
  position: static;
  border-top: 1px solid #dfdfdf;
  cursor: auto;
}
.pd-variations .m-tbl__title,
.pd-import-log .m-tbl__title,
.task-history .m-tbl__title,
.pd-drafts .m-tbl__title {
  padding-left: 3.5rem;
}
.pd-variations .m-collapsible--content,
.pd-import-log .m-collapsible--content,
.task-history .m-collapsible--content,
.pd-drafts .m-collapsible--content {
  padding: 0;
}
.pd-variations .col-span-1,
.pd-import-log .col-span-1,
.task-history .col-span-1,
.pd-drafts .col-span-1 {
  display: none;
}
.pd-variations .col-span-5,
.pd-import-log .col-span-5,
.task-history .col-span-5,
.pd-drafts .col-span-5 {
  grid-column: span 6/span 6;
}

.pd-additional-contents .m-tbl th,
.custom-tutorials-container .m-tbl th {
  top: 0;
  position: relative;
}

.m-upload__error {
  color: #da0000;
  font-weight: 700;
  margin-bottom: 0.5rem;
}

.glb-viewer {
  position: relative;
  width: 100%;
  height: 30vh;
  overflow: hidden;
}

.sdk-spinner__container {
  display: flex;
  justify-content: center;
  align-items: center;
  perspective: 25rem;
  height: 30vh;
  overflow: hidden;
}

.m-flex-item__order-1 {
  order: 1;
}

.pd-3d-upload .m-collapsible {
  width: 100%;
}
.pd-3d-upload .m-preview {
  height: 50vh;
}

main .pd-variations,
main .pd-import-log,
main .task-history,
main .pd-drafts {
  padding-bottom: 0;
}
main .pd-3d-requirements,
main .pd-3d-content-requirements {
  border-top: 0;
  margin-top: -1rem;
  padding-top: 0;
  padding-bottom: 0;
}
main .pd-3d-requirements .m-collapsible--header__container,
main .pd-3d-content-requirements .m-collapsible--header__container {
  padding-top: 1.6rem;
  padding-bottom: 1.6rem;
}
main .pd-3d-requirements .m-collapsible--content,
main .pd-3d-content-requirements .m-collapsible--content {
  padding: 0 4%;
  cursor: auto;
}
main .pd-3d-requirements .content-box,
main .pd-3d-content-requirements .content-box {
  width: 100%;
  border: 0;
  padding: 0;
}
main .pd-3d-requirements h1,
main .pd-3d-content-requirements h1 {
  font-weight: 300;
}
main .pd-3d-requirements .m-req__title,
main .pd-3d-content-requirements .m-req__title {
  display: none;
}

.pd-archive .m-collapsible--content {
  overflow: visible;
}

.m-save__bottom-container {
  box-sizing: border-box;
  margin: 0 auto;
}
.m-save__bottom-container .m-save-changes__default {
  padding: 0;
}
.m-save__bottom-container .btn-small {
  margin-right: 0;
}
.m-save__bottom-container .m-save-changes {
  background-color: transparent;
  height: auto;
}
.m-save__bottom-container .m-save-changes span {
  background-color: transparent;
}

.m-component-definition__container .m-configurator__container,
.m-item-definition__container .m-configurator__container {
  width: 100%;
}
.m-component-definition__container .cd-assets,
.m-component-definition__container .pd-assets,
.m-item-definition__container .cd-assets,
.m-item-definition__container .pd-assets {
  order: 1;
}

.m-export__disabled {
  color: #da0000;
}

.mini-product-detail {
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  height: 100%;
}

.mini-product-detail__image-wrapper {
  width: 100%;
  padding-bottom: 100%;
  position: relative;
  background-color: #f0f0f0;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid #dee2e6;
}

.mini-product-detail__image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.mini-product-detail__image-placeholder {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ccc;
}

.mini-product-detail__image-placeholder .icon {
  width: 40%;
  height: 40%;
}

.mini-product-detail__label {
  font-size: 1.25rem;
  font-weight: 600;
  margin: 0;
  word-break: break-word;
  line-height: 1.3;
}

.mini-product-detail__tags .tags-header {
  font-size: 0.9rem;
  font-weight: 600;
  color: #555;
  margin-top: 8px;
  margin-bottom: 8px;
  padding-bottom: 4px;
  border-bottom: 1px solid #eee;
}

.mini-product-detail__tags .tag-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.mini-product-detail__tags .tag-pill {
  background-color: #e9ecef;
  color: #495057;
  padding: 4px 10px;
  border-radius: 12px;
  font-size: 0.8rem;
}

.mini-product-detail__tags .no-tags-notice,
.mini-product-detail__tags .tags-loading-notice {
  font-size: 0.8rem;
  color: #888;
  font-style: italic;
}

.product-details-content .placeholder-message {
  padding: 2rem;
  text-align: center;
  color: #888;
}

.m-form-top__spacing {
  margin-top: 2.2rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-preview {
  position: relative;
  background-color: #f4f4f4;
  color: #888;
  box-sizing: border-box;
  border-radius: 0.125rem;
  height: 75vh;
}
.m-preview .m-preview__link {
  background-color: transparent;
  border: 0;
}
.m-preview .m-preview__link.active {
  border-bottom: 1px solid #da0000;
}

.m-preview__selector {
  position: absolute;
  bottom: 0.55rem;
  right: 0.75rem;
  text-align: right;
  font-size: 0.8rem;
  z-index: 110;
  display: flex;
  justify-content: flex-end;
}
.m-preview__selector a {
  display: inline-block;
  cursor: pointer;
  color: #000;
  text-decoration: none;
  margin-left: 0.75rem;
}
.m-preview__selector a.active {
  border-bottom: 1px solid #da0000;
}
.m-preview__selector a:hover {
  background: #fff;
}

.m-preview__content {
  z-index: 100;
  background-color: #f4f4f4;
  box-sizing: border-box;
  border-radius: 0.125rem;
  right: 0;
  width: 100%;
  transition: all 0.4s;
  text-align: center;
  vertical-align: middle;
  overflow: hidden;
  height: 100%;
}
.m-preview__content img {
  max-width: 100%;
  max-height: 100%;
}

.m-preview__sdkcontent {
  height: 100%;
  width: 100%;
  cursor: move;
  position: relative;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-subnav__container {
  position: fixed;
  top: 5.725rem;
  height: 3.75rem;
  width: 100%;
  z-index: 203;
  padding-left: 0;
  left: 0;
  box-sizing: border-box;
  background: #fff;
  border-bottom: 1px solid #dfdfdf;
}

.m-subnav {
  margin: 0;
  list-style: none;
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
  width: 100%;
  box-sizing: border-box;
  height: 3.75rem;
  padding-left: 0;
}
.m-subnav li {
  margin: 0;
  width: 20%;
  min-width: 6rem;
  vertical-align: middle;
  line-height: 1.6;
}
.m-subnav a {
  display: block;
  text-decoration: none;
  font-family: Rubik, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-size: 1rem;
  text-align: center;
  transition: 0.4s;
  line-height: 3.3;
}
.m-subnav a:hover {
  border-bottom: 0.214rem solid #dfdfdf;
  background: none;
  border-bottom-color: #888;
}
.m-subnav a.active {
  border-bottom: 0.214rem solid #da0000;
  color: #da0000;
}
.m-subnav span {
  padding: 0.2rem 0 0.514rem;
  display: block;
  text-transform: uppercase;
  font-family: Rubik, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-size: 0.9rem;
  text-align: center;
  color: #a9a9a9;
  line-height: 3;
}

.m-subnav-spacer {
  height: 3.625rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-image-uploader__preview {
  padding: 0.5rem;
}
.m-image-uploader__preview img {
  max-width: 100%;
}

.m-image-uploader__file-selector {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  cursor: pointer;
}
.m-image-uploader__file-selector svg {
  width: 2.15rem;
  height: 2.15rem;
}
.m-image-uploader__file-selector div {
  width: 100%;
  text-align: center;
}

.m-image-uploader__label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 0.5rem;
  height: 1.5rem;
}
.m-image-uploader__label svg {
  width: 1.5rem;
  height: 1.5rem;
  cursor: pointer;
}

.m-image-uploader__meta {
  padding-top: 0.7rem;
  color: #888;
  font-size: 0.8rem;
  padding-bottom: 1rem;
}

.m-image-uploader__container {
  position: relative;
  max-width: 15rem;
}
.m-image-uploader__container .m-droparea {
  background-color: #f4f4f4;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1rem 0;
  height: 100%;
  overflow: hidden;
  border: 1px solid #dfdfdf;
}
.m-image-uploader__container .m-droparea.dragging::after {
  font-size: 1.2rem;
}

.m-image-uploader__preview-container {
  height: 10rem;
  position: relative;
}
.m-image-uploader__preview-container .m-droparea__uploadarea {
  padding: 0;
  min-width: 0;
  border-left: 0;
  display: flex;
  height: 100%;
  width: 100%;
}

.m-image-uploader__error {
  color: #da0000;
  position: absolute;
  z-index: 20;
  bottom: 0.5rem;
}

.m-image-download__icon {
  margin-right: 0.2rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-droparea {
  background: #fff;
  border: 1px dashed #a9a9a9;
  margin: 0;
  border-radius: 0.4rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-sizing: border-box;
  position: relative;
}
.m-droparea input {
  display: none;
}
.m-droparea input[type=radio] {
  display: block;
  opacity: 0;
}
.m-droparea.dragging {
  background-color: #fff;
  border-color: #000;
  position: relative;
}
.m-droparea.dragging .m-rapi-import__helper {
  opacity: 0;
}
.m-droparea.dragging .m-filedownload {
  opacity: 0;
}
.m-droparea.dragging::after {
  content: attr(data-drophelp);
  position: absolute;
  top: 0.4rem;
  bottom: 0.4rem;
  left: 0.4rem;
  right: 0.4rem;
  color: #fff;
  font-size: 3.4rem;
  background: #eee;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  pointer-events: none;
}
.m-droparea.dragging .m-droparea__uploadarea {
  opacity: 0;
  color: #fff;
  border-color: #fff;
}
.m-droparea.dragging path {
  fill: #fff;
}

.m-droparea__highlight {
  border-color: #da0000;
}

.m-drag-confirm-btn__container {
  margin: 0 auto;
}
.m-drag-confirm-btn__container .btn-secondary {
  border-color: #000;
}
.m-drag-confirm-btn__container .btn-secondary:disabled {
  border-color: #bdbdbd;
}

.m-droparea__filedownload {
  padding-bottom: 3rem;
  display: inline-block;
  padding-top: 1rem;
}

.m-draft-creation__container {
  border-color: #da0000;
}
.m-draft-creation__container .m-rapi-import__uploadarea {
  border: 0;
}
.m-draft-creation__container .m-rapi-import__helper-custom {
  display: none;
}

.m-drag-header__confirm {
  color: #000;
  z-index: 1;
  margin: 0 auto;
  display: block;
  max-width: 25rem;
  text-align: center;
  padding-bottom: 2rem;
  font-size: 1.4rem;
}

.m-form__close {
  position: absolute;
  right: 1rem;
  top: 1rem;
  cursor: pointer;
}

.m-drag-confirm__container {
  width: 100%;
  height: 100%;
  position: relative;
  top: 0;
  left: 0;
  z-index: 100;
  bottom: 0;
  display: flex;
  justify-content: center;
  flex-direction: column;
  padding: 1.5rem;
  box-sizing: border-box;
  background-color: #fff;
  border-radius: 0.4rem;
}
.m-drag-confirm__container .m-draft-policy__container {
  margin: 0 auto;
}
.m-drag-confirm__container .m-draft-policies__container {
  max-width: 50%;
  margin: 0 auto 1rem;
}
.m-drag-confirm__container + .m-rapi-import__helper-custom, .m-drag-confirm__container + .m-rapi-import__helper, .m-drag-confirm__container + .m-rapi-import__helper-custom ~ *, .m-drag-confirm__container + .m-rapi-import__helper ~ *,
.m-drag-confirm__container .m-rapi-import__helper {
  display: none;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-droparea__uploadarea {
  min-width: 16rem;
  text-align: center;
}
.m-droparea__uploadarea p {
  padding-bottom: 0;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-reset--instruction {
  margin-bottom: 1rem;
}
.m-reset--instruction span {
  display: block;
  text-decoration: none;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-auth__btn {
  background: #da0000;
  color: #fff;
  padding: 0.2rem;
  text-decoration-line: none;
  border-radius: 0.125rem;
  font-weight: 700;
  cursor: pointer;
}
.m-auth__btn:hover {
  background: #fff;
  color: #da0000;
}

.m-password-btn__container {
  display: block;
  width: 100%;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-auth--container .m-auth__terms-link {
  text-decoration: underline;
  font-weight: 500;
  display: inline;
}

@media only screen and (max-width: 960px) {
  .m-auth--container {
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  .m-auth--container .m-auth--form--container {
    margin-right: 0;
  }
  .m-auth--container .m-auth-container__text {
    width: 100%;
    padding-top: 0;
    padding-right: 0;
  }
  .m-auth--container .m-auth-container__text h1 {
    text-align: center;
    padding-bottom: 2rem;
  }
  .m-auth--container .m-auth-container__text h2 {
    display: none;
  }
}
.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-addtl-content__type {
  text-transform: uppercase;
}

.m-addtl-content__img {
  width: 3.5rem;
}

.m-addtl-content__loading {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 2.5rem;
}

.m-addtl-content__spinner {
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 50%;
  border: 2px solid #dfdfdf;
  border-top: 2px solid #da0000;
  opacity: 0;
  animation: fadeInAndSpin 1s linear 0.5s infinite;
  animation-fill-mode: backwards;
}

.m-subform__container {
  padding: 0 20%;
}

.m-top-header__container {
  display: flex;
  padding-left: 4%;
  padding-bottom: 0.5rem;
}
.m-top-header__container h3 {
  padding-left: 0.5rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-textures__mapping {
  text-transform: uppercase;
}

.m-textures__img {
  width: 3.5rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-tbl {
  width: 100%;
  background: #fff;
  border-collapse: separate;
  border-spacing: 0;
  border-bottom-left-radius: 0.125rem;
  border-bottom-right-radius: 0.125rem;
  border: 1px solid #dfdfdf;
  border-bottom: 0;
}
.m-tbl thead {
  box-shadow: 0 0.15rem 0 0 rgba(0, 0, 0, 0.1);
  position: sticky;
  top: 11.7rem;
  z-index: 1;
}
.m-tbl td {
  margin: 0;
  height: 3.5rem;
  border-bottom: 1px solid #dfdfdf;
  max-width: 0;
  overflow: hidden;
}
.m-tbl td .ember-power-select-multiple-option {
  float: none;
  background-color: #f4f4f4;
  max-width: fit-content;
  display: inline-block;
}
.m-tbl td .ember-power-select-multiple-option__primary {
  background-color: #da0000;
  border: 0;
  color: #fff;
  font-weight: 500;
}
.m-tbl td:first-child {
  padding-left: 1.7rem;
}
.m-tbl th {
  margin: 0;
  padding: 0.5rem;
  height: 2rem;
  font-weight: 500;
  background-color: #fff;
  position: sticky;
  top: 6.5rem;
  padding-right: 1.2rem;
  z-index: 1;
  text-align: center;
  white-space: nowrap;
}
.m-tbl th:first-child {
  padding-left: 1.7rem;
}
.m-tbl .m-tbl__centered {
  padding-right: 1rem;
}
.m-tbl .m-tbl__left {
  text-align: left;
}
.m-tbl .m-tbl__center {
  text-align: center;
}
.m-tbl tbody tr:hover {
  background-color: #eee;
  cursor: pointer;
}
.m-tbl tbody td {
  padding: 0.3rem 0.5rem;
}
.m-tbl tbody .m-tbl__trash-padding {
  padding-right: 2rem;
}
.m-tbl tfoot td,
.m-tbl thead td {
  border-bottom: 0;
  padding: 0 1.1rem 0 0.5rem;
}
.m-tbl img {
  width: 3.5rem;
  vertical-align: middle;
}
.m-tbl .desc {
  margin-top: 0.2rem;
  transform: rotate(180deg);
}
.m-tbl .m-list__disabled, .m-tbl .m-list__active, .m-tbl .m-list__inactive, .m-tbl .m-tbl__active, .m-tbl .m-tbl__inactive {
  display: inline-block;
  width: 0.5rem;
  height: 0.5rem;
  border-width: 1px;
  border-style: solid;
  border-radius: 50%;
  box-sizing: border-box;
}
.m-tbl .m-tbl__inactive {
  border-color: #da0000;
}
.m-tbl .m-tbl__active {
  border-color: #3dac43;
}

.m-tbl-custom__sticky th {
  top: 10.9rem;
}

.m-tbl-custom__sticky-no-header th {
  top: 6.8rem;
}

.m-tbl__checkbox {
  min-width: 2.3rem;
  width: 2.3rem;
  white-space: nowrap;
}
.m-tbl__checkbox .c-checkbox {
  top: -0.2rem;
}

.m-tbl-search__container {
  display: flex;
  height: 100%;
  align-items: center;
  width: 100%;
}
.m-tbl-search__container input {
  min-width: 100%;
  width: 100%;
}

.m-header--searchbar__no-radius {
  width: 100%;
  border-radius: 0.4rem;
}
.m-header--searchbar__no-radius input {
  font-size: 1rem;
}

.m-tbl__container-errors {
  max-width: 100%;
  margin: 0 auto;
}

.m-icons__separator {
  border-right: 1px solid #dfdfdf;
  height: 2rem;
}

.m-tbl__no-item {
  text-align: center;
  font-size: 1.2rem;
  background-color: #fff;
  border-top: 0;
  box-sizing: border-box;
}

.m-tbl__plus {
  position: sticky;
  top: 3.75rem;
  z-index: 49;
}
.m-tbl__plus a {
  position: absolute;
  width: 2.6rem;
  height: 2.6rem;
  cursor: pointer;
}
.m-tbl__plus a:hover {
  background: #da0000;
}

.m-tbl__plus-sticky__custom {
  top: 7.5rem;
}

.m-tbl__img {
  max-width: 100%;
  max-height: 100%;
  position: relative;
}

.m-tbl__tenant-label {
  color: #666;
  font-size: 0.8rem;
  display: inline-block;
  min-width: 9rem;
}

.m-tbl__entity-label {
  font-size: 1rem;
  max-width: 9rem;
}

.m-tbl__entity-label--link {
  margin-bottom: 0.5rem;
}

.m-tbl__col-small {
  width: 1%;
}

.m-tbl__warning svg {
  width: 1rem;
  height: 1rem;
  fill: #da0000;
}

.m-tbl__rows-per-page {
  position: relative;
  display: inline-block;
  padding-right: 1rem;
  cursor: pointer;
  vertical-align: middle;
}
.m-tbl__rows-per-page .ember-power-select-status-icon {
  border-top-color: #000;
  border-top-width: 4px;
}

.m-tbl__action-icons {
  background-color: #e7e7e7;
}
.m-tbl__action-icons span {
  padding: 0 0.6rem;
}
.m-tbl__action-icons svg {
  cursor: pointer;
  padding: 0 0.4rem;
  width: 1.7rem;
  height: 1.7rem;
}

.m-tbl__action-icons__custom span:first-child,
.m-tbl__action-icons__custom svg:first-child {
  padding-left: 0;
}

.m-tbl-more__container {
  background-color: #e7e7e7;
  justify-self: end;
}

.m-tbl-more__icon svg {
  width: 1.5rem;
  height: 1.5rem;
}

.m-drop-actions__item span {
  padding: 0;
  padding-left: 0.5rem;
}

.m-drop-actions__item-disable {
  opacity: 0.3;
  pointer-events: none;
  cursor: not-allowed;
}

.m-drop-actions__label {
  text-align: left;
  width: 90%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
}

.m-tbl__sort {
  position: absolute;
  margin-left: 0.1rem;
  width: 0.9rem;
  height: 0.9rem;
  cursor: pointer;
}
.m-tbl__sort::after {
  content: "";
  position: absolute;
  left: 0.2rem;
  top: 0.15rem;
  width: 6px;
  height: 6px;
  border-left: 1.3px solid #000;
  border-top: 1.3px solid #000;
  transform: rotate(45deg);
}
.m-tbl__sort::before {
  content: "";
  position: absolute;
  top: 0.1rem;
  left: 0.41rem;
  border-left: 1.3px solid #000;
  height: 12px;
}

.m-tbl__paging .m-tbl__forward, .m-tbl__paging .m-tbl__end, .m-tbl__paging .m-tbl__backward, .m-tbl__paging .m-tbl__start, .m-tbl__backward {
  position: relative;
  display: inline-block;
  top: 0.1rem;
  width: 0;
  padding: 0 0.5rem;
  margin: 0 0.6rem;
  cursor: pointer;
  height: 0.9rem;
}
.m-tbl__paging .m-tbl__forward::after, .m-tbl__paging .m-tbl__end::after, .m-tbl__paging .m-tbl__backward::after, .m-tbl__paging .m-tbl__start::after, .m-tbl__backward::after {
  content: "";
  position: absolute;
  width: 0.45rem;
  height: 0.45rem;
  left: 0.2rem;
  top: 50%;
  border-top: 0.15rem solid #000;
  border-left: 0.15rem solid #000;
}

.m-tbl__loading {
  padding: 0.3rem;
  border-bottom: 1px solid #dfdfdf;
  padding-left: 40%;
}
.m-tbl__loading .spinner {
  width: 2.5rem;
  height: 2.5rem;
  position: relative;
  margin-left: 0.5rem;
  display: inline-block;
}

.m-table__footer {
  background-color: #fff;
  box-shadow: 0 -0.15rem 0 0 rgba(0, 0, 0, 0.1);
}

.m-table__label-uppercase {
  text-transform: capitalize;
}

.m-table__footer-container {
  display: flex;
  justify-content: space-between;
  min-height: 3.5rem;
  align-items: center;
  padding: 0 1rem;
}

.m-tbl__paging .m-tbl__start {
  border-left: 0.15rem solid #000;
}
.m-tbl__paging .m-tbl__start::after {
  transform: translate(0%, -50%) rotate(-45deg);
}
.m-tbl__paging .m-tbl__backward::after {
  transform: translate(0%, -50%) rotate(-45deg);
}
.m-tbl__paging .m-tbl__backward-custom::after {
  top: 40%;
}
.m-tbl__paging .m-tbl__end {
  border-right: 0.15rem solid #000;
}
.m-tbl__paging .m-tbl__end::after {
  transform: translate(0%, -50%) rotate(135deg);
}
.m-tbl__paging .m-tbl__forward::after {
  transform: translate(0%, -50%) rotate(135deg);
}
.m-tbl__paging span {
  display: inline-block;
  padding: 0 1rem;
}
.m-tbl__paging .disabled {
  opacity: 0.3;
  cursor: default;
}

.m-tbl__header {
  border-top-left-radius: 0.125rem;
  border-top-right-radius: 0.125rem;
  box-sizing: border-box;
  background-color: #e7e7e7;
  position: sticky;
  top: 5.725rem;
  z-index: 10;
  padding-bottom: 0.5rem;
  padding-top: 2rem;
}
.m-tbl__header h2 {
  font-weight: 700;
  font-size: 1.2rem;
  padding: 1rem 0 1rem 1.7rem;
}

.m-tbl__header-custom__grid {
  grid-template-columns: 3fr 3%;
  padding-bottom: 0.7rem;
  padding-top: 0.7rem;
}

.m-tbl__title {
  background-color: #e7e7e7;
}
.m-tbl__title h3 {
  font-size: 1rem;
  padding-left: 0.5rem;
}

.m-tbl__header-custom,
.m-tbl__header-custom-sticky {
  top: 7.525rem;
}

.m-tbl__header-create {
  top: 9.175rem;
  padding-bottom: 0.5rem;
  padding-top: 0.5rem;
  z-index: 9;
  border: 1px solid #dfdfdf;
  border-top: 0;
}

.m-tbl__header-create__custom {
  top: 9.075rem;
}

.m-tbl__noborder {
  border: 0;
}

.m-tbl__subforms th {
  padding: 0.5rem 0;
  text-align: left;
}
.m-tbl__subforms th:first-child {
  padding-left: 0;
}
.m-tbl__subforms td:first-child {
  padding-left: 0;
}
.m-tbl__subforms thead {
  position: inherit;
  top: 0;
}
.m-tbl__subforms thead td {
  padding: 0 1.1rem 0 0;
}
.m-tbl__subforms thead th {
  border-top: 1px solid #dfdfdf;
}
.m-tbl__subforms tbody td {
  position: relative;
  max-width: none;
}

.m-footer__container {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.m-footer__container span:last-child {
  margin-right: 0.5rem;
}

.m-footer__container_custom span:first-child {
  display: block;
  text-align: left;
  padding-left: 0.5rem;
}

.m-drop-actions__container {
  position: absolute;
  background: #fff;
  top: 4.2rem;
  right: 0.05rem;
  z-index: 10;
  width: 14rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  border: 1px solid #dfdfdf;
  border-right: 0;
}
.m-drop-actions__container svg {
  width: 1.5rem;
  height: 1.5rem;
}
.m-drop-actions__container .m-drop-actions__item {
  display: flex;
  align-items: center;
  width: 100%;
  padding-top: 0.5rem;
}
.m-drop-actions__container .m-drop-actions__item:last-child {
  padding-bottom: 0.5rem;
}
.m-drop-actions__container .m-drop-actions__item:hover {
  background-color: #f4f4f4;
  cursor: pointer;
}

.m-drop-actions__more {
  display: flex;
  align-self: center;
  border-bottom: 1px solid #dfdfdf;
  width: 100%;
  padding: 0;
}
.m-drop-actions__more span {
  width: 100%;
  text-align: center;
  padding: 0.5rem 0;
  font-weight: 500;
}

.m-tbl__processing-span {
  padding: 0.4rem;
  color: #fff;
  background-color: #da0000;
  border-radius: 0.4rem;
  font-weight: 700;
  font-size: 0.7rem;
}

.m-thumbnail__delete,
.m-thumbnail__duplicate,
.m-thumbnail__sample {
  position: absolute;
  top: 1.2rem;
  right: 1.2rem;
  visibility: hidden;
  z-index: 1;
  cursor: pointer;
}
.m-thumbnail__delete svg,
.m-thumbnail__duplicate svg,
.m-thumbnail__sample svg {
  width: 1.5rem;
  height: 1.5rem;
}

.m-thumbnail__duplicate {
  right: 3rem;
  top: 1.4rem;
}

.m-thumbnail__sample {
  visibility: visible;
}

.m-list-catalogs li:hover .m-thumbnail__delete,
.m-list-catalogs li:hover .m-thumbnail__duplicate {
  visibility: visible;
}

.m-sample__icon {
  position: absolute;
  left: 5rem;
  bottom: 0.5rem;
}
.m-sample__icon svg {
  width: 1rem;
  height: 1rem;
}

.m-fallback__icon svg {
  width: 2.15rem;
  height: 2.15rem;
  fill: #a9a9a9;
}

.m-fallback__icon-blacked svg,
.m-item__icon-thumbnails svg {
  fill: #000;
}

.m-item__icon-thumbnails {
  position: absolute;
  top: 0.4rem;
  left: 0.4rem;
}

.m-tbl__col-sort {
  padding: 0;
  height: 100%;
}

.m-tbl-overflow__hide {
  padding: 1.5rem;
  position: fixed;
  width: 100%;
  top: 5.725rem;
  background-color: #e7e7e7;
  z-index: 10;
}

.upgrade-popup__cursor-clickable {
  cursor: pointer;
  position: sticky;
  top: 5.725rem;
}

.upgrade-popup__spacing {
  margin-top: -2rem;
  margin-bottom: 1.6rem;
}

.m-list__checkbox {
  position: absolute;
  top: 0.5rem;
  width: 2rem;
  height: 2rem;
  left: 1rem;
  z-index: 1;
  cursor: pointer;
}
.m-list__checkbox * {
  cursor: pointer;
}

.m-tbl__tenant-label-external {
  display: inline;
  padding: 0.2rem 0.3rem 0.3rem;
  font-size: 0.7rem;
  font-weight: 700;
  color: #fff;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  border-radius: 0.25rem;
  background-color: #da0000;
  position: absolute;
  top: 1.5rem;
}

.m-thumbnails__select-all {
  background: #fff;
  padding-left: 1rem;
  padding-top: 1rem;
}

.position-relative {
  position: relative;
}

@media not all and (min-resolution: 0.001dpcm) {
  @supports (-webkit-appearance: none) {
    .m-tbl th {
      box-shadow: 0 0.15rem 0 0 rgba(0, 0, 0, 0.1);
    }
  }
}
@supports (-webkit-backdrop-filter: blur(1px)) {
  .m-tbl th {
    box-shadow: 0 0.15rem 0 0 rgba(0, 0, 0, 0.33);
  }
}
.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.c-colorpicker {
  display: block;
  padding: 0.5rem 0;
}
.c-colorpicker label {
  font-size: 0.9rem;
  color: #888;
  text-align: left;
  display: inline-block;
  margin-bottom: 0.2rem;
}
.c-colorpicker input {
  font-size: 1.2rem;
  color: #000;
  text-align: left;
  line-height: 1.5rem;
  display: block;
  width: 100%;
  padding: 0.3rem 0.1rem 0.3rem 0.6rem;
  border: 1px solid #dfdfdf;
  height: 32px;
  box-sizing: border-box;
  outline: 0;
}
.c-colorpicker input:focus ~ .hint {
  opacity: 1;
}
.c-colorpicker .input-color-container {
  position: relative;
  overflow: hidden;
  width: 32px;
  height: 32px;
  border: 1px solid #dfdfdf;
  border-right: 0;
  box-sizing: border-box;
}
.c-colorpicker .input-color-container .input-color {
  position: absolute;
  right: -10px;
  top: -10px;
  width: 56px;
  height: 56px;
  border: 0;
  cursor: pointer;
}
.c-colorpicker.error input {
  border-color: #da0000;
}
.c-colorpicker .hint {
  opacity: 0;
  font-size: 0.9rem;
  transition: 0.4s;
}
.c-colorpicker .error {
  font-size: 0.9rem;
  color: #da0000;
}
.c-colorpicker.disabled input {
  color: #a9a9a9;
  -webkit-text-fill-color: #a9a9a9;
  background: transparent;
}
.c-colorpicker.disabled .hint {
  color: #a9a9a9;
}
.c-colorpicker:hover .hint {
  opacity: 1;
}
.c-colorpicker .pcr-result {
  opacity: 0;
}

.c-colorpicker__contianer {
  display: flex;
  align-items: center;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-tags__tree {
  padding: 0;
  list-style: none;
}
.m-tags__tree ul {
  padding: 0;
  list-style: none;
  position: relative;
}
.m-tags__tree li {
  position: relative;
  padding-right: 1rem;
}
.m-tags__tree li span {
  display: flex;
  padding: 0.4rem;
  border-radius: 0.4rem;
  position: relative;
  cursor: pointer;
  padding-left: 2rem;
  font-size: 0.9rem;
}
.m-tags__tree li span i {
  content: "";
  position: absolute;
  width: 1rem;
  height: 1rem;
  left: 0.4rem;
  border-radius: 0.5rem;
  background: #da0000;
}
.m-tags__tree li span:hover {
  background-color: #dfdfdf;
}
.m-tags__tree li span.active {
  background: #dfdfdf;
}
.m-tags__tree li .m-root-tag__label-bold {
  font-weight: 500;
}
.m-tags__tree > li::before {
  border-bottom: 0;
}
.m-tags__tree > li::after {
  border-left: 0;
}

.m-root-tag__label-bold {
  font-weight: 500;
}

.m-tags__tree-root .m-root-tag__label {
  padding: 0.25rem;
  background-color: #da0000;
  color: #fff;
  border-radius: 0.4rem;
  font-weight: 500;
  display: inline;
  margin-left: 1rem;
}
.m-tags__tree-root .m-root-tag__label:hover {
  background-color: #da0000;
}

.m-tags__new ul {
  padding: 0;
  margin: 0;
}
.m-tags__new li {
  list-style-type: none;
}
.m-tags__new .m-tags__tree-root {
  margin: 1rem;
  font-size: 0.9rem;
}
.m-tags__new .m-tags__tree-root input {
  position: absolute;
  clip: rect(0, 0, 0, 0);
}
.m-tags__new .m-tags__tree-root input ~ ul {
  display: none;
}
.m-tags__new .m-tags__tree-root input:checked ~ ul {
  display: block;
}
.m-tags__new .m-tags__tree-root li {
  line-height: 1.2;
  position: relative;
  padding: 0 0 1rem 1rem;
}
.m-tags__new .m-tags__tree-root li:last-child::before {
  height: 1.5rem;
  bottom: auto;
}
.m-tags__new .m-tags__tree-root li::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: -0.5rem;
  display: block;
  width: 0;
  border-left: 1px solid #da0000;
  content: "";
}
.m-tags__new .m-tags__tree-root > li:last-child {
  padding-bottom: 0;
}
.m-tags__new .m-tags__tree-root > li:last-child::before {
  display: none;
}
.m-tags__new .m-tags__tree-root ul li {
  padding: 1rem 0 0 1rem;
}
.m-tags__new .m-tags__tree-root_label {
  position: relative;
  display: inline-block;
  background: #fff;
}
.m-tags__new .m-tags__tree-root_label::after {
  position: absolute;
  top: 0;
  left: -1.5rem;
  display: block;
  height: 0.5rem;
  width: 1rem;
  border-bottom: 1px solid #da0000;
  border-left: 1px solid #da0000;
  content: "";
}
.m-tags__new .m-tags__tree--no__roots {
  padding-left: 0.5rem;
}
.m-tags__new .m-tags__tree--no__roots::before {
  content: "";
  display: inline-block;
  border-top: 1px solid #da0000;
  width: 1rem;
  height: 1rem;
  position: absolute;
  top: 0.5rem;
  left: -1.5rem;
}
.m-tags__new .m-tags__tree--no__roots::after {
  background-color: #da0000;
  position: absolute;
  top: 0;
  left: -1rem;
  display: block;
  height: 1rem;
  width: 1rem;
  border-radius: 1rem;
  line-height: 0.95rem;
  content: "";
}
.m-tags__new label {
  border-radius: 0.1rem;
}
.m-tags__new label.m-root-tag__label-bold {
  font-weight: 500;
}
.m-tags__new label.m-tags__tree-root_label {
  cursor: pointer;
}
.m-tags__new label.m-tags__tree-root_label:hover {
  background-color: #dfdfdf;
}
.m-tags__new label.m-tags__tree-root_label::before {
  background: #da0000;
  color: #fff;
  position: relative;
  z-index: 1;
  float: left;
  margin: 0 0.5rem 0 -1rem;
  width: 1rem;
  height: 1rem;
  border-radius: 1rem;
  content: "+";
  text-align: center;
  line-height: 0.95rem;
  font-weight: 700;
  font-size: 0.8rem;
  display: flex;
  justify-content: center;
  align-items: center;
}
.m-tags__new label.m-tags__tree-root_label::after {
  border-radius: 0;
}
.m-tags__new label.m-tags__tree-root_label:first-child {
  display: none;
}
.m-tags__new label.m-tags__tree-root_label:first-child::before {
  margin-left: 0;
}
.m-tags__new label.m-tags__tree-root_label-root::before {
  margin-left: -2rem;
}
.m-tags__new :checked ~ label.m-tags__tree-root_label::before {
  content: "–";
}
.m-tags__new :checked ~ label.m-tags__tree-root_label::after {
  border-top: 1px solid #da0000;
  border-right: 1px solid #da0000;
  border-bottom: 0;
  border-left: 0;
  bottom: 0;
  top: 0.5rem;
  height: auto;
}

.m-tag-cycling__warning {
  color: #da0000;
  font-size: 1rem;
}

.m-tag-cycling__link {
  text-decoration: underline;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-save-changes {
  height: 3.75rem;
  box-sizing: border-box;
  width: 100%;
  background: #fff;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 204;
}
.m-save-changes span {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: #dfdfdf;
}

.m-save-changes__subform {
  position: absolute;
  border-bottom: 0;
  border-top-left-radius: 0.3rem;
  border-top-right-radius: 0.3rem;
  height: 3.975rem;
  top: 0;
  border: 1px solid #dfdfdf;
}

div.hidden {
  display: none;
}

.m-save-changes__default {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 100%;
  padding: 0 1rem;
}

.m-save-changes__bottom {
  position: relative;
  justify-content: flex-end;
}
.m-save-changes__bottom .m-save-logo__container {
  width: auto;
}
.m-save-changes__bottom strong {
  font-weight: 400;
}

.h-fullscreen__overlay {
  width: 100vw;
  height: 100vh;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.8);
  position: fixed;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 205;
}
.h-fullscreen__overlay .c-pdc-message {
  transform: translateY(-4vh);
}

.m-save-changes__low-opacity {
  background: rgba(0, 0, 0, 0.2);
}

.m-save-changes__overlay-subform {
  background: rgba(0, 0, 0, 0.4);
}

.m-save-changes__overlay-subformheader {
  height: 7.7rem;
  z-index: 205;
  background: rgba(0, 0, 0, 0.4);
}

.m-save-changes__overlay__custom {
  z-index: 23;
}

.m-save-changes__overlay-subformheader__custom {
  background: rgba(0, 0, 0, 0.8);
}

.m-save-changes__text {
  padding-left: 0.6rem;
  line-height: 1.25rem;
}

.m-save-changes__text-small {
  font-size: 0.7rem;
  padding-left: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.m-save-changes__buttons,
.m-save-changes__overlay-buttons {
  display: flex;
  align-items: center;
  z-index: 201;
}

.m-save-changes__overlay-buttons {
  display: flex;
  justify-content: flex-end;
  padding-top: 1rem;
}
.m-save-changes__overlay-buttons .btn-secondary {
  border-color: #000;
}

.m-subform__disable {
  position: relative;
  background: #fff;
  padding: 4.5rem 1rem 4rem;
  border-radius: 0.3rem;
  margin: -0.1rem -0.3rem;
  border: 1px solid #dfdfdf;
}

.m-subform__disable-border {
  z-index: 205;
}

.m-save-logo__container {
  display: flex;
  justify-content: space-around;
  align-items: center;
  width: 25%;
  height: 100%;
  box-sizing: border-box;
  margin-left: -0.09rem;
}

.m-save-logo__container-custom {
  width: 10%;
  margin-left: -0.6rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-custom-layer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 3rem;
}
.m-custom-layer > * {
  flex-grow: 50;
}
.m-custom-layer svg {
  width: 1.6rem;
  height: 1.6rem;
  cursor: pointer;
}
.m-custom-layer .active svg {
  fill: #da0000;
}

.m-custom-layer__settings {
  flex-grow: 1;
  width: 1.6rem;
  text-align: right;
  display: none;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.batch-items-container .c-pdc-message__content a {
  color: #da0000;
  text-decoration: underline;
}

.batch-upload-discard__dialog .c-pdc-message {
  width: 50%;
}

@media only screen and (max-width: 700px) {
  .uploads-container .m-grid-2col-container {
    display: block;
  }
  .uploads-container .m-droparea {
    margin-bottom: 1rem;
  }
}
@media only screen and (max-width: 1100px) {
  .m-2cols__50-percent {
    display: block;
  }
  .m-timestamps__container {
    padding-top: 1rem;
  }
}
.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.content-box {
  background: #fff;
  border: 1px solid #dfdfdf;
  padding: 1rem 2rem;
  border-radius: 0.125rem;
  width: 90%;
  margin: auto;
  margin-bottom: 1rem;
  position: relative;
  box-sizing: border-box;
}
.content-box h2 {
  font-size: 1.8rem;
  margin: 1rem 0;
  margin-left: 2%;
}

.m-bars__container {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom: 0;
}

.upload-box {
  padding: 0;
  width: calc(90% + 4rem);
  border: 0;
  border-radius: 0.125rem;
}
.upload-box .m-rapi-import__response-container {
  width: 100%;
  margin: 1.4rem auto;
  padding: 0;
}
.upload-box .m-rapi-import__uploadarea {
  border-left: 1px solid #dfdfdf;
  padding: 1rem;
}
.upload-box .m-rapi-import__choose {
  padding: 4rem 0;
}
.upload-box h2 {
  font-size: 1.4rem;
}
.upload-box .m-rapi-import__minusmargin h2 {
  margin: 0;
}
.upload-box p {
  border: 0;
}
.upload-box p:last-child {
  margin-bottom: 1.5rem;
}
.upload-box .upload-hint {
  margin: unset;
  padding: unset;
}

.glb-box {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 0.125rem;
}

.glb-title {
  font-weight: 700;
  font-size: 1.4rem;
  margin-top: 1rem;
  position: relative;
  z-index: 98;
}

.glb-box-container {
  position: relative;
  max-height: 80vh;
  height: 30rem;
  margin-bottom: 7rem;
}
.glb-box-container p {
  position: relative;
  z-index: 98;
}

.m-file-samples__container {
  display: flex;
}
.m-file-samples__container a {
  padding-right: 1rem;
}

.m-sticky__position {
  position: sticky;
  top: 4rem;
  margin-top: -4rem;
  border-top: 0;
  z-index: 99;
}

.m-content__non-login .m-sticky__position {
  top: 0;
}

.statistics-container {
  display: block;
}

.m-content-btn__container {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.m-logo__container {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  width: 93%;
  margin: auto;
  margin-bottom: 2rem;
  margin-top: -2rem;
}
.m-logo__container .m-logo__separator {
  border-right: 1px solid #dfdfdf;
  padding-right: 1rem;
  height: 3rem;
  margin-right: 1rem;
}
.m-logo__container span {
  font-size: 1.2rem;
  font-weight: 500;
}

.m-file-samples__container__custom {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 1rem;
}
.m-file-samples__container__custom svg {
  display: none;
}
.m-file-samples__container__custom span {
  font-size: 1.4rem;
  font-weight: 500;
}
.m-file-samples__container__custom a {
  font-weight: 500;
  font-size: 1.4rem;
  color: #da0000;
  text-decoration: underline;
  padding-left: 0.5rem;
}

.profile-table__container {
  padding-bottom: 1rem;
}
.profile-table__container .m-collapsible {
  width: 90%;
  margin-top: -1rem;
}
.profile-table__container .pd-3d-content-upload {
  padding-bottom: 2rem;
}
.profile-table__container ul {
  padding: 0;
}

.m-content-result__container {
  width: 70%;
  padding: 0;
  margin: 0 auto;
}
.m-content-result__container .content-box {
  width: 100%;
}
.m-content-result__container .m-content-analyzer-results {
  width: 100%;
}

.profile-table__container-custom .m-collapsible--header__container,
.profile-table__container-custom .m-collapsible--content,
.m-content-analyzer-results .m-collapsible--header__container,
.m-content-analyzer-results .m-collapsible--content {
  padding: 0.2rem 2%;
}

.m-content-analyzer-results .m-collapsible--header {
  margin-right: -1rem;
}
.m-content-analyzer-results .m-collapsible__titles h1 {
  font-weight: 300;
}

.content-result__header h2,
.content-result__header .content-box__desc {
  margin-left: 0;
  padding-left: 0;
}

.content-result__table {
  padding-top: 1rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.g-bars {
  position: relative;
}

.g-background__bars {
  width: 100%;
  display: flex;
}

.graphs-box {
  position: relative;
  width: 100%;
}

.g-background__bar {
  width: 33.333%;
  position: relative;
  text-align: center;
  background: #eee;
  height: 26rem;
  margin-top: 3rem;
}

.g-labels__container {
  display: flex;
  position: absolute;
  top: 0.8rem;
  left: 40%;
  align-items: center;
}
.g-labels__container .g-label__item {
  width: 4rem;
}

.g-background__circle {
  height: 1.428rem;
  width: 1.428rem;
  border-radius: 50%;
  margin-right: 0.5rem;
}

.g-background-bar__white {
  background: #fff;
}

.border-left {
  border-left: 1px dashed #888;
}

.border-right {
  border-right: 1px dashed #888;
}

.g-foreground__bars {
  position: absolute;
  z-index: 11;
  top: calc(16rem / 2 - 1rem);
  width: 100%;
}

.g-foreground__bar {
  width: 100%;
  background: #da0000;
  height: 10%;
  padding: 0.5rem 0;
  max-width: 100%;
  margin-bottom: 3rem;
  margin-top: 1rem;
}

.g-headers__container {
  padding-top: 3rem;
}
.g-headers__container h3 {
  font-weight: 100;
  font-size: 0.9rem;
  margin-bottom: 2rem;
  margin-top: 2rem;
  display: inline-block;
  white-space: nowrap;
  padding-right: 0.5rem;
}
.g-headers__container svg {
  width: 1.5rem;
  height: 1.5rem;
  padding-right: 0.5rem;
}
.g-headers__container .res--list__success span,
.g-headers__container .res--list__warn span,
.g-headers__container .res--list__error span {
  color: #888;
}

.g-indicator__label {
  position: absolute;
  top: -2rem;
  right: -4rem;
  color: #000;
  font-size: 1rem;
}

.g-indicator__label-custom {
  right: -2rem;
}

.g-headers__titles span {
  color: #888;
}

.g-foreground__bar__flex {
  display: flex;
  justify-content: flex-start;
  align-items: baseline;
}
.g-foreground__bar__flex span {
  padding-left: 0.5rem;
  background-color: transparent;
  font-size: 1.8rem;
}

.g-headers__container-separator {
  width: 100%;
  position: absolute;
  z-index: 1;
  margin-left: 1px;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.res-list {
  margin: 0;
  padding: 0;
  list-style-type: none;
}
.res-list sub {
  color: #888;
  font-size: 1.2rem;
  margin: 0 0.7rem;
  vertical-align: baseline;
  line-height: 0.9;
}
.res-list svg {
  right: 0;
  top: 0.4rem;
  margin: 0;
  padding: 0;
  position: relative;
  width: 1.5rem;
  height: 1.5rem;
  margin-top: -2rem;
}

.res--list__item {
  margin: 1rem 0;
  padding: 0;
  position: relative;
  border-bottom: 1px solid #888;
}
.res--list__item span {
  display: inline-block;
  padding-bottom: 1rem;
}
.res--list__item .res-label-1 {
  font-size: 1rem;
}
.res--list__item .res-label-1 span {
  color: #888;
  padding: 0;
}
.res--list__item:first-child {
  border: 0;
}
.res--list__item:last-child {
  margin-bottom: 2rem;
}
.res--list__item svg {
  padding-right: 0.5rem;
}

.res--list__item-no-border {
  border-bottom: 0;
}

.res-list__link {
  cursor: pointer;
  text-decoration: underline;
}

.res-list__link-active {
  text-decoration: none;
}

.res-list__inner {
  margin-top: -1rem;
}
.res-list__inner li:first-child {
  border-bottom: 1px solid #888;
}

.res-file__indentation {
  margin-left: 1rem;
}

.res-list-head {
  font-weight: 700;
  font-size: 1.4rem;
}

.res--list__error span,
.res--list__error .res-label-1,
.res--list__error .res--list-label__2 {
  color: #df0300;
}
.res--list__error p {
  display: inline;
  color: #df0300;
}

.res--list__success span {
  color: #3dac43;
}
.res--list__success p {
  display: inline;
  color: #3dac43;
}
.res--list__success svg {
  fill: #3dac43;
}

.res--list__warn span {
  color: #f79101;
}
.res--list__warn p {
  display: inline;
  color: #f79101;
}
.res--list__warn svg {
  position: relative;
  fill: #f79101;
}

.res--list-label__2 {
  text-align: right;
  position: absolute;
  right: 0;
  font-size: 1.8rem;
  top: -0.6rem;
}
.res--list-label__2 p {
  display: inline;
}

.res--list-label__2-custom {
  right: 0;
}
.res--list-label__2-custom span {
  color: #888;
  font-size: 1.2rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.requirement-box ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
.requirement-box ul li {
  display: grid;
  grid-template-columns: 3fr auto;
}

.m-requirement_btn {
  display: grid;
  width: 18%;
  font-size: 1rem;
  margin: 4rem auto 1rem;
  padding: 0.4rem;
}

.m-requirement__link {
  cursor: pointer;
  text-decoration: underline;
  color: #da0000;
}

.m-req__header {
  margin: 0 auto;
}

.m-req__title {
  font-weight: 700;
  font-size: 1.2rem;
  margin-bottom: 1rem;
}

.m-list__content {
  border-bottom: 1px solid #888;
}
.m-list__content div {
  margin: 0 auto 2rem 0;
}
.m-list__content .m-list__content-hint {
  font-size: 1.2rem;
}
.m-list__content p {
  font-size: 1.4rem;
  margin-top: 1.4rem;
  margin-bottom: 0.3rem;
  font-weight: 500;
}
.m-list__content small {
  font-size: 0.9rem;
}
.m-list__content span {
  font-size: 1.4rem;
  margin-top: 2rem;
  margin-left: auto;
  margin-right: auto;
  vertical-align: middle;
  line-height: 3rem;
}

.m-list__content-hint {
  color: #a9a9a9;
  padding-right: 1rem;
  vertical-align: middle;
  line-height: 2;
}

.m-list__content-hint__no-padding {
  padding-right: 0;
}

.m-requirement-btn__container {
  padding-top: 2rem;
  padding-bottom: 2rem;
}
.m-requirement-btn__container a {
  color: #da0000;
}

.m-requirement__no-padding {
  padding-top: 0;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.content-box__container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.content-box__container p {
  font-size: 1rem;
  margin-top: 1rem;
}
.content-box__container p:last-child {
  margin-top: 0;
  margin-bottom: 1rem;
}

.content-box__desc {
  padding: 0.1rem 0;
  font-size: 1rem;
  padding-left: 2%;
}
.content-box__desc:last-child {
  margin-bottom: 0.9rem;
}

.content-btns__container {
  width: 100%;
  margin-top: -3rem;
  margin-left: 4rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.errors-container {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: flex-start;
}
.errors-container h3 {
  font-size: 1.2rem;
  font-weight: 700;
}

.errors-container__custom {
  flex-direction: column;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-new_prod__item {
  padding: 0 2rem;
  padding-top: 1rem;
  background-color: #fff;
  border-radius: 0.125rem;
  overflow: hidden;
}
.m-new_prod__item .m-new_prod__item-header {
  font-weight: normal;
  white-space: nowrap;
  padding-left: 0;
}
.m-new_prod__item a {
  text-decoration: none;
}

.m-new_prod__item-logo {
  width: 100%;
  padding: 1rem 0;
  margin: 0 auto;
}

.m-new_prod-link {
  background-color: #fff;
  color: #000;
  border: 1px solid #000;
  display: block;
  margin: 0 auto;
}
.m-new_prod-link:hover .m-new_prod-link__label {
  color: #000;
}

.m-new_prod-link__disabled {
  cursor: not-allowed;
  border-color: #bdbdbd;
  color: #bdbdbd;
}
.m-new_prod-link__disabled:hover .m-new_prod-link__label {
  color: #bdbdbd;
}

.m-new_prod-link__label {
  font-weight: 400;
}

.m-new_prod__item-desc {
  line-height: 1.4;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
  min-height: 4rem;
}

.m-variations__content {
  position: relative;
}
.m-variations__content table {
  border: 1px solid #dfdfdf;
}
.m-variations__content table .m-variations__content__img {
  padding-left: 1.7rem;
}

.h-aspect-box,
.h-small__aspect-box {
  height: 0;
  padding-top: 74.6031746%;
  width: 100%;
  position: relative;
}
.h-aspect-box img,
.h-small__aspect-box img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

.h-small__aspect-box {
  padding-top: 10.5rem;
}
.h-small__aspect-box img {
  width: 70%;
  top: 50%;
  right: 50%;
  transform: translate(25%, -50%);
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-select__product h2 {
  font-weight: 700;
}
.m-select__product a {
  text-decoration: underline;
}
.m-select__product .m-variations__search {
  width: 40%;
}

.m-select__product-label {
  padding-top: 0;
}

.m-new-prod__small-logos {
  margin-bottom: 2rem;
}

.m-products__container a {
  text-decoration: underline;
}

.m-products__container-items {
  padding-top: 1.125rem;
  padding-left: 1.125rem;
  padding-right: 1.125rem;
  border: 1px solid #dfdfdf;
  border-top: 0;
  background-color: #fff;
}
.m-products__container-items .m-list-catalog__label {
  color: #666;
  padding-left: 0.5rem;
  height: auto;
  max-width: 7rem;
}
.m-products__container-items span {
  color: #666;
  z-index: 1;
}
.m-products__container-items .m-tbl__tenant-label-external {
  color: #fff;
  font-size: 0.7rem;
  margin-left: 0.3rem;
  position: unset;
}
.m-products__container-items .m-action-bar__label {
  color: #000;
}
.m-products__container-items a,
.m-products__container-items .m-card--button {
  grid-template-rows: 70% 30%;
  text-decoration: none;
  border-radius: 1rem;
}
.m-products__container-items a:hover,
.m-products__container-items .m-card--button:hover {
  background-color: transparent;
}
.m-products__container-items .m-tbl__processing-span {
  color: #fff;
  left: 50%;
  top: 50%;
  position: absolute;
  transform: translate(-50%, -50%);
  overflow: hidden;
  white-space: pre;
  z-index: 0;
}

.m-table__footer-container span {
  color: #000;
}

.m-variations__container {
  background: #fff;
  display: grid;
  grid-template-columns: 25% 43% 1fr;
  padding-left: 1rem;
  grid-column-gap: 3rem;
}

.m-variations__table {
  order: 3;
  width: 100%;
  position: relative;
  display: block;
  margin: 0 auto;
}

.m-variations__table__header {
  padding-left: 1rem;
  font-weight: 500;
  padding-bottom: 2rem;
  background: #fff;
  border-left: 1px solid #dfdfdf;
  border-right: 1px solid #dfdfdf;
}

.m-variations__fields .m-box-item {
  border: 0;
  padding: 0;
}
.m-variations__fields .m-box-item p {
  display: none;
}

.m-preview__sdkcontent__desc {
  padding-bottom: 1.5rem;
}

.m-image-uploader__preview img {
  width: 100%;
}

.m-init__label {
  text-decoration: underline;
}

.m-variation__img {
  padding-left: 3rem;
}

.m-copy__label {
  top: 2rem;
  right: -4rem;
  position: absolute;
  font-weight: 500;
  color: #da0000;
}

.m-copy__label-right {
  right: 4rem;
  top: 1.3rem;
}

.m-variations__icon {
  display: inline-block;
  line-height: 2.572rem;
  height: 1.286rem;
}
.m-variations__icon svg {
  vertical-align: baseline;
}

.m-variation__config {
  display: grid;
  grid-template-rows: 5.5fr 1fr;
  max-width: 100vw;
  max-height: 88vh;
  grid-gap: 4.9rem;
}
.m-variation__config h2 {
  font-weight: 700;
}

.m-tbl__icon-copy {
  cursor: pointer;
}

.m-short-url__input {
  position: relative;
  width: 8.4rem;
}
.m-short-url__input a {
  color: #da0000;
}
.m-short-url__input a:hover {
  text-decoration: underline;
}

.m-short-url__input-inner {
  position: relative;
}

.m-tbl__icon-copy__inner {
  position: absolute;
  right: 0.5rem;
  top: 2.3rem;
  cursor: pointer;
}

.c-textarea {
  position: relative;
}

.m-variations__short-url {
  position: absolute;
  right: 0.5rem;
  background: #fff;
  padding: 4rem;
  width: 32rem;
  top: 0.5rem;
  z-index: 10;
  margin-bottom: 1rem;
  border: 1px solid #dfdfdf;
}
.m-variations__short-url input {
  text-overflow: ellipsis;
  padding-right: 3rem;
}

.m-variations__short-url-icon {
  position: absolute;
  right: 1rem;
  top: 1rem;
  cursor: pointer;
}

.m-header--searchbar__icon {
  position: absolute;
  z-index: 10;
  padding: 0.6rem 1rem;
}

.m-variations__short-url-head {
  padding-bottom: 1rem;
  font-size: 1.4rem;
  font-weight: 700;
}

.m-variations__image {
  padding: 1.7rem 3rem 0 4rem;
}
.m-variations__image svg {
  display: none;
}
.m-variations__image .m-droparea {
  border: 1px solid #a9a9a9;
}

.m-list__disabled, .m-list__active, .m-list__inactive, .m-tbl .m-tbl__inactive, .m-tbl .m-tbl__active {
  display: inline-block;
  width: 0.5rem;
  height: 0.5rem;
  min-width: 0.5rem;
  min-height: 0.5rem;
  border-width: 1px;
  border-style: solid;
  border-radius: 50%;
}

.m-list__inactive {
  border-color: #da0000;
}

.m-list__active {
  border-color: #3dac43;
}

.m-list__disabled {
  border-color: #bdbdbd;
}

.m-list-catalogs__custom h5 {
  margin: 0;
  padding: 0.4rem 0;
  text-align: left;
  width: 90%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
  height: 1.25rem;
  font-weight: unset;
  padding-left: 0.5rem;
  font-size: 1.25rem;
}
.m-list-catalogs__custom img {
  object-fit: contain;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
}

.m-list-catalogs__logo {
  border-radius: 1rem;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  position: relative;
  background-color: rgba(255, 255, 255, 0.55);
  word-break: break-all;
  padding: 0 0.5rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-textures__container {
  display: grid;
  grid-template-columns: 1fr 59%;
  grid-column-gap: 3rem;
}

.m-textures__image {
  padding-top: 1.7rem;
}

.m-form__close svg {
  width: 1.286rem;
  height: 1.286rem;
}

.m-alert-content__popup {
  position: fixed;
  z-index: 205;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  min-width: 33.333%;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-form__switch {
  position: relative;
  display: inline-block;
  width: 2.5rem;
  height: 1.4rem;
  cursor: pointer;
}
.m-form__switch input {
  opacity: 0;
  width: 0;
  height: 0;
}
.m-form__switch input:checked + .m-form__slider {
  background-color: #000;
}
.m-form__switch input:checked + .m-form__slider::before {
  background-color: #fff;
  transform: translateX(0.8rem);
}
.m-form__switch input:focus + .m-form__slider {
  box-shadow: 0 0 1px #000;
}

.m-form__slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #eee;
  transition: 0.4s;
}
.m-form__slider::before {
  position: absolute;
  content: "";
  height: 0.7rem;
  width: 0.7rem;
  bottom: 0.2rem;
  background-color: #000;
  transition: 0.4s;
  top: 0.2rem;
  right: 2rem;
}
.m-form__slider.m-form__round {
  border-radius: 1rem;
  border: 2px solid #000;
}
.m-form__slider.m-form__round::before {
  border-radius: 50%;
  right: 1.2rem;
}

.m-form__switch-disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.m-form__switch-disabled .m-form__slider {
  cursor: not-allowed;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.save-variation__container {
  text-align: center;
}
.save-variation__container .c-textfield .errors-container {
  height: auto;
}

.save-variation__hint {
  padding-top: 0.5rem;
  color: #da0000;
  text-align: end;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.v-hd-renderings__container {
  background: #fff;
  padding: 1rem;
  position: relative;
  border-radius: 0.4rem;
}
.v-hd-renderings__container h3 {
  font-weight: 100;
}
.v-hd-renderings__container h2 {
  font-weight: 700;
}
.v-hd-renderings__container .m-image-uploader__preview-container {
  padding-top: 0;
}
.v-hd-renderings__container .m-image-uploader__preview {
  padding: 1rem;
}

.m-asset-upload__container {
  padding: 1rem 0;
}

.m-asset-upload__container-custom {
  padding: 0;
}
.m-asset-upload__container-custom .m-camera-box__selected {
  border-radius: 0.4rem;
  border: 1px solid #000;
}

.m-droparea__custom {
  border: 0;
  border-radius: 0;
}

.m-collapsible .v-hd-renderings__container {
  background: transparent;
  border: 0;
  padding-left: 0;
  padding-bottom: 0;
}
.m-collapsible .v-hd-renderings__container h2 {
  display: none;
}
.m-collapsible .c-pdc-message h2 {
  display: block;
  line-height: 1;
}
.m-collapsible .m-hd-render__popup h2 {
  display: block;
}
.m-collapsible .m-image-uploader__preview-container-custom {
  padding-top: 0;
  border-radius: 0.4rem;
}
.m-collapsible .m-image-uploader__result {
  padding-top: 100%;
}

.m-hd-render__popup {
  position: fixed;
  z-index: 205;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.m-hd-renderings__buttons {
  display: flex;
  justify-content: center;
  z-index: 201;
}

.m-hd-renderings__progress svg {
  width: 3rem;
  height: 2.15rem;
  vertical-align: middle;
  box-sizing: border-box;
}

.m-rendering-resolution .c-radio {
  display: inline-block;
  padding-right: 0.5rem;
}

.m-render__hint {
  text-align: end;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-image-uploader__container-custom {
  cursor: pointer;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

span.highlighted {
  background-color: #eee;
  border-radius: 1rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-btn__container {
  display: flex;
  justify-content: center;
  width: 100%;
}
.m-btn__container .btn-secondary {
  border-color: #000;
}
.m-btn__container .btn-secondary:disabled {
  border-color: #bdbdbd;
}

.m-draft-buttons {
  max-width: 50%;
  margin: 0 auto;
}

.m-catalog__container {
  padding-top: 0.2rem;
}
.m-catalog__container .m-message__container {
  top: 9.725rem;
}

.m-catalog-aside__container {
  position: relative;
  width: 100%;
  background: #fff;
  list-style: none;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  box-sizing: border-box;
  border: 1px solid #dfdfdf;
  border-radius: 2px;
  overflow: hidden;
  white-space: nowrap;
  z-index: 203;
  padding: 1rem;
}
.m-catalog-aside__container .ember-power-select-trigger.active, .m-catalog-aside__container .ember-power-select-trigger:focus {
  border: 1px solid #dfdfdf;
}

.m-textfield-container__custom label {
  display: block;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  font-size: 1rem;
  font-weight: 400;
}
.m-textfield-container__custom .c-select label {
  display: none;
}
.m-textfield-container__custom .c-select,
.m-textfield-container__custom .c-textfield {
  margin-top: 0;
  margin-bottom: 0;
  padding-top: 0;
  padding-bottom: 0;
  max-width: 12rem;
}
.m-textfield-container__custom .c-select .ember-basic-dropdown-trigger,
.m-textfield-container__custom .c-textfield .ember-basic-dropdown-trigger {
  margin: 0;
}

.m-entity-checkboxes__container {
  max-width: 100%;
}

.m-catalog-link__space {
  padding-left: 0.5rem;
}

.m-catalog-draft__status {
  width: 100%;
}
.m-catalog-draft__status span:last-child {
  margin-left: 0.5rem;
}
.m-catalog-draft__status a {
  font-weight: 400;
  text-decoration: underline;
}
.m-catalog-draft__status a:hover {
  background-color: transparent;
}

.m-catalog-draft-link__black {
  margin-left: 1rem;
  max-width: 80%;
}

.m-catalog-draft-link__primary {
  margin-left: 0;
}

.m-catalog-draft-link__disabled {
  color: #a9a9a9;
  cursor: not-allowed;
  border-color: #a9a9a9;
}
.m-catalog-draft-link__disabled:hover {
  color: #a9a9a9;
  background-color: transparent;
}

.m-catalog__action-icons {
  margin: 0 auto;
}
.m-catalog__action-icons .m-archive__container:last-child {
  padding-left: 0.5rem;
}

.m-drafts-links__container {
  max-height: 6rem;
  overflow-y: overlay;
}

.pd-drafts .m-list-catalog__draft-list {
  display: none;
}
.pd-drafts .m-collapsible--content {
  padding: 0;
}
.pd-drafts .m-tbl {
  border: 0;
}
.pd-drafts .m-tbl thead,
.pd-drafts .m-tbl .m-tbl__header {
  background-color: #fff;
}
.pd-drafts .m-tbl__header,
.pd-drafts .m-tbl__action-icons,
.pd-drafts .m-tbl__title {
  background-color: #fff;
}
.pd-drafts .m-tbl__no-item__creation-hint {
  margin-top: 1rem;
  padding-bottom: 2rem;
  line-height: 0;
  border: 0;
}

.m-tbl__label-icon svg {
  padding-right: 0.5rem;
  cursor: auto;
}
.m-tbl__label-icon a {
  padding-left: 0;
}

.m-draft-status__container {
  width: 100%;
  margin-top: -0.5rem;
}
.m-draft-status__container .c-select {
  padding-top: 0;
  margin-top: 0;
}
.m-draft-status__container label {
  display: none;
}
.m-draft-status__container .spacer {
  display: none;
}

@keyframes wrap {
  0% {
    background-color: transparent;
    transform: scale(0);
  }
  100% {
    background-color: #fff;
    transform: scale(1);
  }
}
@keyframes left {
  0% {
    width: 0;
  }
  100% {
    width: 1rem;
  }
}
.m-draft-policy__container {
  padding-bottom: 0.5rem;
}
.m-draft-policy__container .c-radio {
  padding-right: 0.5rem;
}

.m-draft-policy__disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.m-left-menus__container {
  margin-top: -3.625rem;
  position: sticky;
  top: 9.65rem;
}

.m-side-menus-sticky__custom {
  top: 7.5rem;
}

.m-left-menus__container-custom {
  margin-top: -3.925rem;
  top: 5.725rem;
}

.pd-import-log .m-tbl tr:hover {
  cursor: auto;
  background-color: transparent;
}
.pd-import-log .m-tbl a:hover {
  background-color: transparent;
}

.m-tags-manage__link {
  color: #da0000;
  text-decoration: underline;
  position: absolute;
  font-size: 1rem;
  font-weight: 400;
  right: 4%;
  top: 2rem;
  z-index: 1;
}

.m-form-extid__spacing .c-checkbox {
  margin-left: 1rem;
}

@keyframes right {
  0% {
    width: 0;
  }
  100% {
    width: 2rem;
  }
}
@media only screen and (min-width: 1024px) and (max-width: 1328px) {
  .m-catalog-draft-link__primary {
    width: 100%;
  }
}
.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-full-name__container {
  display: flex;
  justify-content: space-between;
}
.m-full-name__container .c-textfield {
  width: 45%;
}

.m-user-form__container .m-subform__disable {
  border: 0;
}
.m-user-form__container .m-error-msg {
  display: none;
}
.m-user-form__container .m-collapsible--header__container,
.m-user-form__container .m-collapsible--content {
  padding-left: 0;
}

.current-session-settings .m-auth--msgs {
  position: relative;
  left: 0;
  top: 0;
  transform: none;
  width: 100%;
}

.m-user-menus__container {
  margin-top: -3.925rem;
  top: 7.225rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-delete__warning {
  color: #da0000;
  animation: fadeIn 1s infinite alternate;
}

.m-pdc-msg__container {
  box-sizing: border-box;
  position: relative;
  width: 70%;
  margin: 0 auto;
}

.cd-users .m-collapsible--content {
  padding-bottom: 0.1rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.md-textures .m-tbl th {
  position: unset;
  top: 0;
}

.m-preview__container {
  position: relative;
}
.m-preview__container .roomle-material-canvas-container {
  height: 100vh;
  margin-top: 0.5rem;
}

.m-preview__container-material {
  position: sticky;
  top: 6rem;
}

.m-geometry__container {
  position: absolute;
  z-index: 200;
  top: 1.5rem;
  left: 1rem;
}
.m-geometry__container .c-radio {
  padding-right: 1rem;
}

.m-info__link {
  max-width: 18rem;
}

.m-material-sliders-container {
  margin-top: 0.5rem;
}

@media only screen and (max-width: 1460px) {
  .md-definitions .m-geometry__container {
    flex-direction: column;
    align-items: flex-start;
  }
}
.spinner {
  width: 6rem;
  height: 6rem;
  border-radius: 50%;
  border: 2px solid #dfdfdf;
  border-top: 2px solid #da0000;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  z-index: 301;
  opacity: 0;
  animation: fadeInAndSpin 1s linear 0.5s infinite;
}

@keyframes fadeInAndSpin {
  0% {
    opacity: 0;
    transform: rotate(0deg);
  }
  1% {
    opacity: 1;
  }
  100% {
    transform: rotate(360deg);
  }
}
.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-auth--container__custom {
  border-top-left-radius: 0.3rem;
  border-top-right-radius: 0.3rem;
  align-items: center;
  justify-content: center;
}
.m-auth--container__custom .c-textfield {
  padding-left: 2rem;
  padding-right: 2rem;
}
.m-auth--container__custom .m-auth--form--container {
  border: 1px solid #dfdfdf;
  border-radius: 0.3rem;
  background-color: #fff;
  border-top: 0;
  box-sizing: border-box;
}
.m-auth--container__custom .m-auth--topbar {
  border-top-left-radius: 0.3rem;
  border-top-right-radius: 0.3rem;
}
.m-auth--container__custom .m-auth--header,
.m-auth--container__custom .m-auth--desc {
  padding-left: 1rem;
}
.m-auth--container__custom .m-auth--desc_custom {
  padding-bottom: 10rem;
}
.m-auth--container__custom .m-auth--btn {
  font-size: 1.2rem;
  width: calc(100% - 2 * 2rem);
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 2rem;
  display: block;
}

.m-auth_control-link {
  color: #da0000;
  font-weight: 700;
  cursor: pointer;
}
.m-auth_control-link:hover {
  background-color: transparent;
}

.m-auth--form--container .m-subform__disable {
  border: 0;
}

.m-auth--msgs {
  width: 95%;
  margin: 0 auto;
}

.m-auth_control-btns {
  display: grid;
  grid-template-columns: 40% 40%;
  justify-content: center;
}
.m-auth_control-btns .btn-outlined:hover {
  background-color: #fff;
  color: #da0000;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-logo__box {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.content-header {
  display: flex;
  justify-content: center;
}
.content-header h1 {
  font-weight: 700;
  font-size: 1.8rem;
  padding-bottom: 1rem;
  padding-top: 1rem;
  text-align: center;
}

@media only screen and (max-width: 1270px) {
  .m-file-samples__container__custom {
    flex-direction: column;
  }
  .m-file-samples__container__custom span {
    text-align: center;
  }
  .content-header h1 {
    font-size: 1.4rem;
  }
  .m-logo__container {
    margin-top: -1rem;
  }
  .g-indicator__label {
    right: 0;
  }
  .g-indicator__label-custom {
    right: -4rem;
  }
  .upload-hint {
    text-align: center;
  }
}
.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.display_inline {
  display: inline-block;
}

.m-collapsible .m-change-password-btn__container {
  width: 100%;
}

.m-user-form__container hr {
  background: #dfdfdf;
  height: 1px;
  display: block;
  margin: 0;
  border: 0;
  border-left: 1px solid #dfdfdf;
  position: absolute;
  width: 100%;
  left: 0;
}

.m-user-separator {
  box-sizing: border-box;
  position: relative;
  padding: 1rem 0;
  width: 100%;
  margin: 0 auto;
  margin-bottom: 1rem;
  padding-top: 0;
}

.m-user-form__footer .m-change-password-btn__container {
  align-self: flex-end;
}

.m-user-form__footer-timestamps {
  width: 100%;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-upgrade-card {
  margin-right: 2rem;
  position: relative;
  background-color: #fff;
  border-top-left-radius: 0.4rem;
  border-top-right-radius: 0.4rem;
  border-bottom-left-radius: 0.4rem;
  border-bottom-right-radius: 0.4rem;
  border: 1px solid #dfdfdf;
  overflow: hidden;
}

.m-upgrade-card__container {
  background-color: #fff;
  border-top: 0.5rem solid #000;
  box-sizing: border-box;
}

.m-upgrade-card__container-active {
  border-color: #da0000;
}

.m-upgrade-card__container-low-opacity {
  opacity: 0.5;
}

.m-upgrade-card__container-full-opacity {
  opacity: 1;
}

.m-upgrade-card__container__active {
  border: 2px solid #da0000;
  opacity: 1;
}

.m-upgrade-card__head,
.m-upgrade-card__price-container {
  flex-direction: column;
}

.m-upgrade-card__head {
  padding-bottom: 2rem;
}

.m-upgrade-card__head-title {
  font-size: 1.4rem;
  padding-top: 0.5rem;
}
.m-upgrade-card__head-title span {
  color: #000;
}

.m-upgrade-card__free {
  background: #363636;
  cursor: pointer;
  margin-bottom: 1.1rem;
}
.m-upgrade-card__free .m-upgrade-card__head-desc,
.m-upgrade-card__free .upgrade-card__head-title,
.m-upgrade-card__free h2 {
  color: #fff;
}
.m-upgrade-card__free .upgrade-card__head-title {
  width: 70%;
  text-align: center;
}
.m-upgrade-card__free .m-upgrade__custom-padding {
  margin-top: 0;
}
.m-upgrade-card__free .m-upgrade__custom-padding li {
  color: #fff;
}
.m-upgrade-card__free .m-upgrade-card__body-part {
  margin-top: 1rem;
}
.m-upgrade-card__free .m-upgrade-card__body-part svg {
  fill: #fff;
}
.m-upgrade-card__free .m-upgrade-card__container {
  border-top: 0;
  background-color: #363636;
}
.m-upgrade-card__free .m-upgrade-card__price span {
  font-size: 1.4rem;
  font-weight: 400;
}
.m-upgrade-card__free a {
  color: #fff;
}

.m-upgrade-card__head-desc {
  font-size: 2rem;
  padding-top: 3rem;
  padding-bottom: 0.5rem;
  text-transform: capitalize;
  font-weight: 400;
}

.m-upgrade-card__body-part {
  padding-top: 1rem;
  padding-left: 2rem;
  padding-right: calc(1rem * 10);
}
.m-upgrade-card__body-part:last-child {
  padding-top: 0;
}
.m-upgrade-card__body-part h2 {
  font-size: 1rem;
}
.m-upgrade-card__body-part p {
  font-size: 1rem;
  padding-bottom: 1rem;
  font-weight: 500;
  line-height: 1.5;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
  height: 3.55em;
}
.m-upgrade-card__body-part ul {
  list-style-type: none;
  padding-left: 0;
  margin-bottom: 0;
}
.m-upgrade-card__body-part ul li {
  padding-top: 1rem;
  white-space: nowrap;
  color: #666;
}
.m-upgrade-card__body-part .m-upgrade__custom-padding {
  margin-bottom: 2rem;
}
.m-upgrade-card__body-part svg {
  width: 1rem;
  height: 1rem;
  fill: #da0000;
  vertical-align: middle;
  padding-right: 0.5rem;
}

.m-upgrade-card__body__spacing {
  padding-top: 1rem;
}
.m-upgrade-card__body__spacing:last-child {
  padding-top: 2rem;
}

.m-upgrade-card__price-container {
  margin: 0 auto;
}

.m-upgrade-card__price,
.m-upgrade-card__remain-days {
  font-weight: 500;
  text-align: center;
}
.m-upgrade-card__price .m-upgrade-card__price-total,
.m-upgrade-card__remain-days .m-upgrade-card__price-total {
  font-size: 4rem;
  font-weight: 400;
}
.m-upgrade-card__price .m-upgrade-card__currency,
.m-upgrade-card__remain-days .m-upgrade-card__currency {
  vertical-align: top;
  color: #888;
  line-height: 2;
  font-size: 1.4rem;
  font-weight: 400;
}
.m-upgrade-card__price span,
.m-upgrade-card__remain-days span {
  font-size: 1.2rem;
}

.m-upgrade-card__remain-days {
  font-size: 1.2rem;
  color: #da0000;
  padding-bottom: 2rem;
  font-weight: 300;
}

.m-card__border {
  width: 90%;
  margin: 0 auto;
  border-bottom: 1px solid #dfdfdf;
}

.m-upgrade-card__price-hint {
  font-size: 1.8rem;
}

.m-upgrade-package__desc {
  max-width: 85%;
  margin: 0 auto;
  text-align: center;
  line-height: 1.5rem;
  font-size: 1.2rem;
}

.h-small__aspect-box {
  margin-bottom: 2rem;
}

.m-upgrade-card__included-hint {
  display: block;
  text-align: center;
  min-height: 1rem;
}

@media only screen and (max-width: 1024px) {
  .m-upgrade-card {
    margin-right: 0;
  }
}
.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-packages {
  margin: -1rem auto;
}
.m-packages .m-package__custom-flex {
  align-items: flex-start;
  justify-content: center;
  flex-wrap: wrap;
}

.m-packages__header {
  flex-direction: column;
}
.m-packages__header h2,
.m-packages__header p {
  font-size: 0.9rem;
  padding-bottom: 1rem;
}
.m-packages__header h2:last-child,
.m-packages__header p:last-child {
  padding-bottom: 1rem;
}
.m-packages__header h2 span,
.m-packages__header p span {
  color: #da0000;
  vertical-align: top;
}

.m-packages__header-custom {
  margin-top: 4rem;
}

.m-billing-card {
  background: #fff;
  padding: 1rem 0;
  border: 1px solid #da0000;
}
.m-billing-card h1 {
  text-align: center;
  font-weight: 400;
  padding-top: 2rem;
  padding-bottom: 0.3rem;
  font-size: 2rem;
}
.m-billing-card p {
  max-width: 85%;
  margin-left: 2rem;
}

.m-billing-card__desc {
  margin: 0 auto;
  text-align: center;
  font-size: 1rem;
  line-height: 1.8;
  max-width: 85%;
}

.m-billing-info__container {
  padding-top: 2rem;
  max-width: 75%;
  margin: 0 auto;
}

.m-billing-info__item {
  display: flex;
  align-items: baseline;
}
.m-billing-info__item span {
  min-width: 4rem;
  text-align: end;
}

.m-billing-info__item-label {
  font-size: 1.2rem;
  font-weight: 400;
}
.m-billing-info__item-label p {
  font-weight: 400;
  margin-bottom: -0.5rem;
}

.m-billing-info__item-bold {
  font-weight: 500;
}

.m-billing-info__link {
  padding-top: 2rem;
  padding-bottom: 1rem;
}
.m-billing-info__link a {
  color: #da0000;
}

.m-billing-cards__container {
  display: grid;
  grid-template-rows: repeat(2, 1fr);
  grid-auto-rows: 1fr;
  grid-column-gap: 2.1rem;
  height: 1000px;
  min-height: 1000px;
  margin-top: 1rem;
}

.m-billing-cards__container-custom {
  grid-template-rows: 1fr;
}

.upgrade-link__inline-block {
  display: inline-block;
  color: #da0000;
  text-decoration: underline;
}

@media only screen and (max-width: 960px) {
  .m-packages .flex {
    flex-direction: column;
  }
  .m-packages .m-package__custom-flex {
    align-items: center;
  }
  .m-packages .m-upgrade-card {
    max-width: 50%;
    margin-bottom: 1rem;
  }
}
@media only screen and (max-width: 1024px) {
  .m-billing-cards__container {
    width: 50%;
  }
}
.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-btn-creation__container {
  border-top: 1px solid #888;
  background-color: #fff;
  padding: 1rem;
  margin-top: 1rem;
  position: fixed;
  bottom: 0;
  width: calc(100% - 1.5rem);
  margin-left: -1.5rem;
}
.m-btn-creation__container .m-tbl__plus-medium a:hover {
  background: unset;
}
.m-btn-creation__container a {
  text-decoration: none;
}

.m-tbl__no-item__creation-hint {
  position: relative;
  text-align: center;
  font-size: 1.2rem;
  padding: 2rem;
  line-height: 0;
  border: 1px solid #dfdfdf;
  border-top: 0;
  box-sizing: border-box;
  background-color: #fff;
  margin-top: 0.1rem;
}
.m-tbl__no-item__creation-hint .m-tbl__plus {
  display: unset;
  padding-left: 0.2rem;
  padding-right: 0.2rem;
}

.no-item__padding {
  padding-right: 0.2rem;
}

.no-item__spacing {
  padding: 0 0.2rem;
  padding-left: 0;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.payment-error-container {
  max-width: 25%;
  margin: 0 auto;
  box-shadow: 0 0.9rem 3rem 0 rgba(0, 0, 0, 0.1);
  border-radius: 0.4rem;
  padding: 0 0 2rem;
  text-align: center;
}
.payment-error-container * {
  box-sizing: border-box;
}

.payment-error__body {
  padding: 3.5rem;
  padding-top: 0;
  padding-bottom: 2rem;
}

.payment-error-container__btn {
  display: block;
  width: 80%;
  margin: 0 auto;
  height: 3.2rem;
  line-height: 3.2rem;
  border-radius: 0.125rem;
  font-size: 1.2rem;
  background-color: #fff;
  text-align: center;
  color: #da0000;
  border: 1px solid #da0000;
  text-decoration: none;
  margin-top: 1.8rem;
}
.payment-error-container__btn:hover {
  background-color: #fff;
}

.payment-error-container__circle {
  height: 8.5rem;
}
.payment-error-container__circle svg {
  fill: #da0000;
  width: 4rem;
}

.payment-error-container__text {
  padding: 0 15%;
}

.payment-error-container__text--lg {
  padding: 0 0 1.8rem;
  font-size: 1.8rem;
  color: #da0000;
}

.payment-error-container__text--sm {
  color: #000;
  font-size: 1.4rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.payment-success {
  width: 25%;
  box-shadow: 0 0.9rem 3rem 0 rgba(0, 0, 0, 0.1);
  margin: auto;
  border-radius: 0.4rem;
  text-align: center;
  position: relative;
  margin-top: 1rem;
}

.payment-success__header {
  position: relative;
  height: 100%;
  padding: 3.5rem;
  padding-bottom: 0;
}
.payment-success__header svg {
  width: 3rem;
  height: 3rem;
}

.payment-success__body {
  padding: 3.5rem;
  padding-top: 0;
}
.payment-success__body .btn-small {
  margin: 0 auto;
}

.payment-success__close {
  position: absolute;
  color: #da0000;
  font-size: 1.8rem;
  right: 1rem;
  top: 0.8rem;
  cursor: pointer;
}

.payment-success__title {
  font-size: 1.8rem;
  font-weight: normal;
  padding-bottom: 1.8rem;
  padding-top: 1rem;
}

.payment-success__main-img {
  width: 25%;
}

.payment-success__text {
  font-size: 1.2rem;
  color: #888;
  padding-bottom: 3.5rem;
}

.payment-success__cancel {
  text-decoration: none;
  font-size: 1.2rem;
  color: #888;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-variation-render-container {
  display: flex;
  flex-direction: column-reverse;
}
.m-variation-render-container .m-variation__config-custom {
  height: 70vh;
}
.m-variation-render-container .v-hd-renderings__container {
  border-top: 0;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.m-variation-render-container .m-variation__config {
  max-width: 85vw;
  width: 100%;
  margin: 0 auto;
  grid-template-rows: 5.5fr;
}

.m-save-variations {
  max-width: 85vw;
  margin: 0 auto;
  width: 100%;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-tbl-toggle-samples__container {
  border-bottom: 1px solid #dfdfdf;
  padding: 0.8rem;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  position: sticky;
  top: 7.25rem;
  z-index: 2;
  background-color: #fff;
}
.m-tbl-toggle-samples__container span {
  padding-right: 0.5rem;
}

.h-icon-plus {
  text-decoration: none;
  color: #888;
}
.h-icon-plus svg {
  fill: #da0000;
  width: 3rem;
  height: 3rem;
}
.h-icon-plus span {
  padding-left: 0.5rem;
  font-size: 1rem;
  font-weight: 700;
  color: #000;
  width: max-content;
}

.h-icon-plus__small svg {
  width: 2.15rem;
  height: 2.15rem;
}

.h-icon-plus__medium svg {
  width: 1.5rem;
  height: 1.5rem;
}

.m-icon-add__big svg {
  width: 5rem;
  height: 5rem;
}

.m-icon-add__medium svg {
  width: 2.15rem;
  height: 2.15rem;
}

.h-icon-plus__disabled {
  cursor: not-allowed;
}
.h-icon-plus__disabled svg {
  fill: #888;
}

.m-list-filtering {
  position: sticky;
  list-style: none;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  box-sizing: border-box;
  border-radius: 0.125rem;
  z-index: 203;
  margin-top: 1.3rem;
}
.m-list-filtering ul {
  padding: 0;
  margin: 0;
  width: 100%;
  box-sizing: border-box;
}
.m-list-filtering .m-box-item {
  padding: 1rem;
}
.m-list-filtering .c-radio {
  padding-bottom: 0.7rem;
}
.m-list-filtering h3 {
  font-weight: 400;
  margin-bottom: 0.7rem;
}
.m-list-filtering hr {
  background: #dfdfdf;
  height: 1px;
  display: block;
  margin: 0;
  border: 0;
  border-left: 1px solid #dfdfdf;
  position: absolute;
  width: 100%;
  left: 0;
}
.m-list-filtering svg {
  width: 1.5rem;
  height: 1.5rem;
}
.m-list-filtering li {
  list-style-type: none;
}
.m-list-filtering li.m-ps__item {
  max-width: 5.5rem;
}

.m-content-lang__container {
  position: sticky;
  margin-top: -2.125rem;
  margin-bottom: 0.5rem;
  top: 5.725rem;
}

.m-content-lang__container-custom {
  margin-top: 0;
  top: 9.8rem;
}

.m-list-filtering__head {
  padding-top: 0;
  margin-top: 0;
  font-weight: 400;
  font-size: 1rem;
}

.m-custom-meshes__container .m-list-filtering {
  margin-top: 2.4rem;
}

.m-tbl__action-icons__disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.m-tbl__action-icon {
  cursor: pointer;
}

.m-tbl-custom__sticky-container .m-tbl thead {
  top: 10.4rem;
}
.m-tbl-custom__sticky-container .m-tbl__header-custom {
  top: 7.825rem;
}
.m-tbl-custom__sticky-container .m-jobs-list__container .m-tbl__container {
  margin-left: unset;
}

@media only screen and (max-width: 960px) {
  .m-list-filtering,
  .m-content-lang__container {
    display: none;
  }
}
.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-integration-codes {
  padding-top: 2rem;
}
.m-integration-codes textarea {
  height: 8rem;
}
.m-integration-codes button {
  display: block;
  margin-left: auto;
  margin-right: 0;
}

.m-integration-codes__options {
  max-width: 300px;
}

.m-sandbox__open img {
  max-width: 15rem;
  margin-top: 1rem;
}
.m-sandbox__open:hover {
  background-color: transparent;
}

.m-sandbox__embedding img {
  margin-top: 0rem;
}

.m-rubens__link-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}
.m-rubens__link-container .c-textfield {
  width: 100%;
}
.m-rubens__link-container .i-interactive__container {
  padding-left: 1rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-labeled-toggle__container {
  display: block;
}

.m-labeled-toggle__input {
  display: none;
}
.m-labeled-toggle__input:checked + .m-labeled-toggle__slider {
  background-color: #f6f6f6;
}
.m-labeled-toggle__input:checked + .m-labeled-toggle__slider::before {
  transform: translateX(7rem);
}

.m-labeled-toggle__input-inactive + .m-labeled-toggle__slider .m-labeled-toggle-off {
  color: #f6f6f6;
}

.m-labeled-toggle__switch {
  position: relative;
  display: inline-block;
  width: 16.5rem;
  height: 4.5rem;
}

.m-labeled-toggle__slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #f6f6f6;
  transition: 0.4s;
  border: 1px solid #fff;
}
.m-labeled-toggle__slider::before {
  position: absolute;
  content: " ";
  height: 3.25rem;
  width: 8.25rem;
  left: 0.6rem;
  bottom: 0.6rem;
  background-color: #fff;
  transition: 0.4s;
}
.m-labeled-toggle__slider.m-labeled-toggle__slider-round {
  border-radius: 3rem;
}
.m-labeled-toggle__slider.m-labeled-toggle__slider-round::before {
  border-radius: 3rem;
}

.m-labeled-toggle-off {
  top: 50%;
  left: 22%;
  margin-left: 0.8rem;
}

.m-labeled-toggle-on {
  top: 50%;
  left: 58%;
  margin-left: 2.5rem;
  white-space: nowrap;
}
.m-labeled-toggle-on span {
  color: #da0000;
  vertical-align: top;
}

.m-labeled-toggle-on,
.m-labeled-toggle-off {
  color: #000;
  position: absolute;
  transform: translate(-50%, -50%);
  font-size: 1.2rem;
  font-family: inherit;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.list_view__sort_edit__container {
  white-space: nowrap;
  display: flex;
  align-items: center;
  height: 1rem;
}

.list_view__sort_edit__input {
  min-width: 3.5rem;
  width: 100%;
  height: 3rem;
  border: 0;
  background-color: transparent;
  -moz-appearance: textfield;
  padding-right: 1rem;
  text-align: center;
}
.list_view__sort_edit__input::-webkit-outer-spin-button, .list_view__sort_edit__input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.list_view__sort_edit__trigger {
  display: inline-block;
  cursor: pointer;
  height: 1rem;
  width: 1rem;
  margin-left: -1rem;
}
.list_view__sort_edit__trigger svg {
  width: 1rem;
  height: 1rem;
  display: inline-block;
  opacity: 0;
  transition: opacity ease-in-out 100ms;
}

.list_view__sort_edit__trigger--active svg {
  opacity: 1;
}

.m-tbl tbody tr:hover .list_view__sort_edit__container svg {
  opacity: 1;
}
.m-tbl tbody .m-tbl__non-clickable td:hover {
  cursor: auto;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.billing-information-form__container {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 0 2rem;
}
.billing-information-form__container .c-select label {
  margin-bottom: -0.2rem;
  display: block;
}

.billing-information__zip {
  width: 50%;
  padding-right: 2rem;
  float: left;
  box-sizing: border-box;
}

.billing-information__city {
  display: inline-block;
  width: 50%;
  box-sizing: border-box;
}

.m-billing-information__header {
  flex-direction: column;
  padding-bottom: 2rem;
}
.m-billing-information__header h1 {
  font-size: 2.8rem;
}
.m-billing-information__header p {
  font-size: 1.2rem;
}

.m-admin-logo--svg {
  width: 7rem;
  height: 7rem;
  fill: #da0000;
  margin: 0 auto;
  display: block;
}

.m-billing-information__hint p {
  font-size: 1.2rem;
}

.m-billing-information__buttons {
  margin-bottom: 2rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-auth-container__text {
  width: 30%;
  padding-top: 4rem;
  padding-right: 4rem;
}
.m-auth-container__text h1,
.m-auth-container__text h2 {
  font-size: 2.2rem;
}
.m-auth-container__text h2 {
  padding-top: 2rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-alert {
  padding: 1rem;
  border-radius: 0.4rem;
  font-weight: 300;
  position: absolute;
  width: calc(100% - 6rem);
  top: -5rem;
  left: 2rem;
}
.m-alert svg {
  width: 1.5rem;
  height: 1.5rem;
  padding-right: 0.5rem;
}

.m-alert__success {
  background: rgba(61, 172, 67, 0.05);
  color: #3dac43;
  border: 1px solid #3dac43;
}
.m-alert__success svg {
  fill: #3dac43;
}

.m-alert__warning {
  background: rgba(247, 145, 1, 0.05);
  color: #f79101;
  border: 1px solid #f79101;
}
.m-alert__warning svg {
  fill: #f79101;
}

.m-alert__danger {
  background: rgba(223, 3, 0, 0.05);
  color: #df0300;
  border: 1px solid #df0300;
}
.m-alert__danger svg {
  fill: #df0300;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-export-variation__container {
  background-color: #fff;
  padding: 1rem;
}
.m-export-variation__container h2 {
  font-weight: 700;
}

@media only screen and (max-width: 1200px) {
  .m-export-variation__container {
    padding-top: 3rem;
  }
}
.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-fallback-image__container-flex {
  margin-top: 1.5rem;
  margin-bottom: 1rem;
  font-weight: 700;
  width: auto;
  height: auto;
}
.m-fallback-image__container-flex .m-fallback-image__text {
  position: unset;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-dashboard-welcome {
  width: 100%;
  margin: 0 auto;
  margin-top: -2.607rem;
}

.m-dashboard-welcome__overlay {
  background-image: linear-gradient(#fff, #fafafa);
  border: 1px solid #dfdfdf;
  padding: 2.393rem;
  padding-left: 1.679rem;
  padding-bottom: 0;
}

.m-dashboard__news-head {
  font-size: 1rem;
  padding-bottom: 1.5rem;
}

.m-dashboard-welcome__panel {
  background-repeat: no-repeat;
  background-position: left;
  background-size: contain;
  min-height: 20rem;
  box-sizing: border-box;
}

.m-dashboard-welcome__panel,
.m-dashboard-welcome__links,
.m-dashboard__news {
  border-radius: 0.125rem;
}
.m-dashboard-welcome__panel h1,
.m-dashboard-welcome__links h1,
.m-dashboard__news h1 {
  padding-bottom: 1rem;
  font-size: 2rem;
  line-height: 1.4;
}

.m-dashboard__news h1 {
  display: inline-block;
}
.m-dashboard__news p {
  display: inline;
}

.m-dashboard-welcome__links {
  border: 1px solid #dfdfdf;
  background-color: #fff;
  padding: 2.393rem;
  padding-right: 0.7976666667rem;
  padding-left: 1.679rem;
}

.m-dashboard__links a {
  display: block;
  color: #da0000;
  margin-bottom: 1.5rem;
  font-size: 1.2rem;
  text-decoration: underline;
}
.m-dashboard__links a:hover {
  background-color: transparent;
}

.m-dashboard-error__container {
  max-width: 75%;
  margin: 0 auto;
  display: block;
}

.m-statistic-container {
  border: 1px solid #dfdfdf;
  display: block;
  margin: 0 auto;
  border-radius: 0.125rem;
  box-sizing: border-box;
  position: relative;
  overflow: hidden;
  width: 100%;
}
.m-statistic-container .m-assets__overlay {
  background: rgba(0, 0, 0, 0.2);
  opacity: 1;
}
.m-statistic-container .spinner {
  position: absolute;
}
.m-statistic-container .c-select {
  padding-bottom: 0;
  margin-bottom: -1.1rem;
  width: 15rem;
}
.m-statistic-container .c-select i {
  right: 0;
  top: 2.4rem;
}
.m-statistic-container .c-select .ember-power-select-selected-item {
  margin-left: 0;
}
.m-statistic-container .c-select .ember-basic-dropdown-trigger {
  border-top: 0;
  border-left: 0;
  border-right: 0;
  border-bottom: 1px solid #666;
  margin: 0;
  height: 3rem;
  border-radius: 0;
  padding-right: 0;
  padding-left: 0;
}

.m-statistic-container__dashboard .c-select i {
  top: 2.6rem;
}

.tenant-analytics__container .c-select .ember-basic-dropdown-trigger {
  height: 2.7rem;
}
.tenant-analytics__container .ember-power-select-trigger {
  padding-bottom: 1rem;
}

.m-statistic__header {
  background-color: #fff;
  padding: 2rem 2.393rem 0;
}
.m-statistic__header h1 {
  font-size: 2rem;
  width: 25%;
}

.m-statistic__selectors span {
  font-weight: 400;
  font-size: 1.4rem;
}
.m-statistic__selectors .m-statistic__selectors-title {
  color: #888;
  font-size: 1rem;
  padding-bottom: 1rem;
  padding-right: 0.5rem;
  align-self: end;
}
.m-statistic__selectors .m-date-picker {
  display: inline-block;
  width: 100%;
  position: relative;
}

.m-statistic__selector {
  position: relative;
  padding-right: 1.143rem;
  padding-left: 1.143rem;
}
.m-statistic__selector input {
  border-bottom: 1px solid #666;
  padding-bottom: 0.85rem;
  width: 100%;
  box-sizing: border-box;
  font-size: 1.4rem;
}
.m-statistic__selector .ember-power-select-trigger {
  min-height: auto;
  border-radius: 0;
  line-height: normal;
  width: 15rem;
}
.m-statistic__selector .ember-power-select-trigger.active, .m-statistic__selector .ember-power-select-trigger:focus {
  border: 0;
  border-bottom: 1px solid #666;
}
.m-statistic__selector .ember-flatpickr-input {
  width: 21rem;
}

.m-statistic__body {
  background-color: #f7f7f7;
  padding-top: 5rem;
  padding-bottom: 5rem;
  overflow: hidden;
}

.m-statistic__footer-title {
  padding-left: 2.393rem;
  font-size: 1.2rem;
  font-weight: 300;
  align-self: baseline;
  line-height: 1.3;
  padding-top: 2rem;
  height: 2.393rem;
}

.m-statistic-numbers__container {
  min-width: 70%;
}

.m-statistic-number__item {
  display: grid;
  grid-template-rows: repeat(2, 1fr);
}
.m-statistic-number__item:first-child {
  padding-left: 2.393rem;
}
.m-statistic-number__item:last-child {
  padding-right: 2.393rem;
}
.m-statistic-number__item svg {
  width: 1rem;
  height: 1rem;
  fill: #888;
  padding-left: 0.3rem;
  vertical-align: middle;
}
.m-statistic-number__item svg:hover {
  fill: #da0000;
}
.m-statistic-number__item hr {
  background-color: #e7e7e7;
  border-color: #e7e7e7;
}

.m-statistic-number__item-label {
  font-size: 1.4rem;
  align-self: end;
}

.m-statistic__id_label {
  padding-bottom: 1rem;
}

.m-statistic-number__item-number {
  font-weight: 400;
  font-size: 2.8rem;
  padding-top: 2rem;
}

.m-statistic__item-primary p {
  color: #da0000;
}

.ember-flatpickr-input {
  border: 0;
  background-color: transparent;
  font-weight: 400;
  font-size: 1.4rem;
  outline: none;
  z-index: 100;
  padding-left: 0.5rem;
}

body .flatpickr-calendar {
  border-radius: 0.125rem;
}
body .flatpickr-calendar::before, body .flatpickr-calendar::after {
  border: 0;
}

.flatpickr-monthSelect-months {
  margin: 0.8rem 0.1rem;
  flex-wrap: wrap;
}

.flatpickr-monthSelect-month {
  background: none;
  border: 0;
  border-radius: 0.125rem;
  box-sizing: border-box;
  color: #000;
  cursor: pointer;
  display: inline-block;
  font-weight: 400;
  justify-content: center;
  padding: 0.8rem;
  position: relative;
  text-align: center;
  width: 33%;
}
.flatpickr-monthSelect-month.selected {
  font-weight: 700;
  color: #da0000;
}
.flatpickr-monthSelect-month:hover {
  font-weight: 700;
}
.flatpickr-monthSelect-month.disabled {
  color: #888;
}
.flatpickr-monthSelect-month.disabled:hover, .flatpickr-monthSelect-month.disabled:focus {
  cursor: not-allowed;
  background: none;
  font-weight: 400;
}

@media only screen and (max-width: 1300px) {
  .m-dashboard-welcome {
    grid-template-columns: 3fr 1fr;
  }
  .m-statistic__body {
    flex-direction: column;
  }
  .m-statistic-numbers__container {
    flex-wrap: wrap;
    padding-top: 2rem;
  }
  .m-statistic__footer-title {
    margin: 0 auto;
  }
  .m-statistic-container .m-statistic__header {
    display: block;
  }
  .m-statistic-container .m-statistic__header h1 {
    width: 100%;
  }
  .m-statistic-container .m-statistic__selectors {
    justify-content: flex-start;
  }
}
.m-statistic__footer a {
  color: #da0000;
}

.m-statistic__footer-link {
  padding-right: 2.393rem;
  align-self: flex-end;
}

@media only screen and (max-width: 1024px) {
  .m-statistic-number__item,
  .m-statistic-number__item-number {
    margin: 0 auto;
    text-align: center;
  }
  .m-statistic-number__item:first-child,
  .m-statistic-number__item-number:first-child {
    padding-left: 0;
  }
  .m-statistic-number__item:last-child,
  .m-statistic-number__item-number:last-child {
    padding-right: 0;
  }
}
@media only screen and (max-width: 960px) {
  .m-statistic-numbers__container {
    flex-direction: column;
  }
  .m-dashboard-welcome {
    grid-template-columns: 1fr;
    grid-template-rows: 1fr 1fr;
  }
  .m-statistic__footer-title {
    margin: 0 auto;
  }
  .m-statistic__header {
    flex-direction: column;
  }
  .m-statistic__selectors {
    padding-top: 1rem;
  }
  .m-statistic-number__item {
    padding-left: 1.679rem;
  }
}
@media only screen and (min-width: 1900px) {
  .m-dashboard-welcome__panel {
    background-size: contain;
  }
}
.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.collapse-accordion ul {
  list-style: none;
  margin: 0;
  padding: 0;
  cursor: pointer;
}
.collapse-accordion ul ul li {
  padding: 0.25rem 0.6rem;
  padding-left: 3.3rem;
}
.collapse-accordion b {
  font-weight: 400;
}
.collapse-accordion li {
  cursor: pointer;
  padding-bottom: 0.5rem;
}
.collapse-accordion label {
  display: block;
  cursor: pointer;
  padding: 0.25rem 1.5rem;
  border-bottom: 0;
  position: relative;
  padding-left: 1.3rem;
}
.collapse-accordion label.last {
  border-bottom: 1.5px solid #fff;
}
.collapse-accordion label::after {
  content: "";
  position: absolute;
  width: 0.4rem;
  height: 0.4rem;
  text-indent: -9999px;
  border-top: 1.5px solid #fff;
  border-left: 1.5px solid #fff;
  text-decoration: none;
  color: transparent;
  user-select: none;
  transform: rotate(135deg);
  left: 0;
  top: 50%;
  margin-top: -0.2rem;
}
.collapse-accordion input[type=checkbox] {
  position: absolute;
  left: -9999px;
}
.collapse-accordion input[type=checkbox] ~ ul {
  height: 0;
  transform: scaleY(0);
}
.collapse-accordion input[type=checkbox]:checked + label .collapse-accordion__collapse {
  display: block;
}
.collapse-accordion input[type=checkbox]:checked + label .collapse-accordion__expand {
  display: none;
}
.collapse-accordion input[type=checkbox]:checked + label::after {
  transform: rotate(224deg);
  top: 0.6rem;
}
.collapse-accordion input[type=checkbox]:checked ~ ul {
  height: 100%;
  transform-origin: top;
  transform: scaleY(1);
}

.collapse-accordion__collapse {
  display: none;
}

.warning .collapse-accordion label::after {
  border-top-color: #000;
  border-left-color: #000;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.tenant-settings__container {
  display: block;
  margin: 0 auto;
  max-width: 100%;
  background-color: #fff;
  border: 0;
  padding: 0.5rem;
  padding-left: 0;
  box-sizing: border-box;
}
.tenant-settings__container h2 {
  font-weight: 500;
  margin-bottom: 0.5rem;
}
.tenant-settings__container .spacer {
  display: none;
}
.tenant-settings__container a {
  text-decoration: underline;
}
.tenant-settings__container a:hover {
  background-color: transparent;
}
.tenant-settings__container .roomle-configurator-canvas-container {
  height: 60vh;
  border-top: 0;
  border-bottom: 0;
}
.tenant-settings__container .m-statistic__selector {
  padding-left: 0;
}
.tenant-settings__container .m-subform__disable {
  padding-top: 2rem;
}
.tenant-settings__container .m-products__container-items {
  border: 0;
  padding: 0;
}
.tenant-settings__container .m-card--button h5 {
  text-align: center;
  color: #000;
}

.tenant-settings__desc {
  padding-top: 0;
}

.tenant-settings__id_label {
  font-weight: 500;
  display: block;
  margin-bottom: 0.5rem;
}

.tenant-settings__preview {
  position: absolute;
  right: 0;
  top: -4rem;
}

.tenant-analytics__container .m-statistic__header {
  padding: 0;
}
.tenant-analytics__container .c-select {
  margin-bottom: 0;
}
.tenant-analytics__container .c-select.disabled .ember-basic-dropdown-trigger {
  background-color: transparent;
  color: #a9a9a9;
}
.tenant-analytics__container .c-select.disabled .h-arrow {
  border-color: #a9a9a9;
}
.tenant-analytics__container .ember-flatpickr-input,
.tenant-analytics__container .ember-power-select-selected-item,
.tenant-analytics__container .tenant-settings__id_label {
  font-size: 1rem;
}
.tenant-analytics__container .tenant-settings__id_label {
  margin-bottom: 1.1rem;
}

.tenant-settings__container--price-services .m-collapsible--content {
  padding: 0;
}
.tenant-settings__container--price-services .m-subform__disable {
  margin: 0 0.3rem;
}
.tenant-settings__container--price-services .m-tbl th {
  top: unset;
}

.allowed-hosts__section {
  padding-top: 0.5rem;
}
.allowed-hosts__section .allowed-hosts__title {
  font-weight: 500;
  margin-bottom: 0.25rem;
}
.allowed-hosts__section .allowed-hosts__desc {
  font-size: 0.9rem;
  color: #888;
  margin-bottom: 0.75rem;
}
.allowed-hosts__section .allowed-hosts__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
  margin-bottom: 0.75rem;
}
.allowed-hosts__section .allowed-hosts__tag {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.25rem 0.375rem 0.25rem 0.625rem;
  background-color: #dfdfdf;
  border-radius: 1rem;
  font-size: 0.9rem;
  font-weight: 500;
}
.allowed-hosts__section .allowed-hosts__tag-label {
  max-width: 20rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.allowed-hosts__section .allowed-hosts__tag-remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.125rem;
  height: 1.125rem;
  padding: 0;
  background: none;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  color: #888;
  font-size: 0.9rem;
  line-height: 1;
  flex-shrink: 0;
}
.allowed-hosts__section .allowed-hosts__tag-remove:hover {
  background-color: rgb(197.5, 197.5, 197.5);
  color: #000;
}
.allowed-hosts__section .allowed-hosts__input-row {
  display: flex;
  gap: 0.5rem;
  align-items: center;
}
.allowed-hosts__section .allowed-hosts__input-row .allowed-hosts__input {
  flex: 1;
  height: 2.25rem;
  padding: 0 0.625rem;
  border: 1px solid #e7e7e7;
  border-radius: 0.4rem;
  font-size: 1rem;
  font-family: inherit;
  background-color: #fff;
  transition: border-color 0.15s ease;
}
.allowed-hosts__section .allowed-hosts__input-row .allowed-hosts__input:focus {
  outline: none;
  border-color: #da0000;
}
.allowed-hosts__section .allowed-hosts__input-row .allowed-hosts__input.allowed-hosts__input--error {
  border-color: #da0000;
}
.allowed-hosts__section .allowed-hosts__validation-error {
  margin-top: 0.25rem;
  font-size: 0.9rem;
  color: #da0000;
}
.allowed-hosts__section .allowed-hosts__save-error {
  margin-top: 0.25rem;
  font-size: 0.9rem;
  color: #da0000;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-inpagenav {
  position: relative;
  width: 100%;
  max-width: 100%;
  background: #fff;
  list-style: none;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
  box-sizing: border-box;
  overflow: hidden;
  white-space: nowrap;
  border: 1px solid #dfdfdf;
  padding: 0;
  margin: 1.143rem 0;
}
.m-inpagenav li {
  margin: 0;
  line-height: 1.6rem;
  vertical-align: middle;
  width: 100%;
}
.m-inpagenav li:last-child a {
  border-bottom: 0;
}
.m-inpagenav a {
  display: block;
  text-decoration: none;
  font-family: Rubik, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-size: 1rem;
  border-bottom: 1px solid #dfdfdf;
  transition: 0.4s;
  cursor: pointer;
  line-height: 3;
  width: 100%;
  padding-left: 1rem;
  padding-right: 3rem;
  text-align: left;
  max-width: 90%;
}
.m-inpagenav a.active {
  font-weight: 700;
}

.m-inpagenav-no__custom-margin {
  margin-top: 0.05rem;
}

@media only screen and (max-width: 1600px) {
  main .pd-3d-content-upload,
  main .pd-3d-content-requirements {
    margin-left: auto;
  }
  .m-archive__container .m-icon__overlay {
    margin-right: -11.6666666667%;
  }
}
@media only screen and (max-width: 1024px) {
  .m-inpagenav,
  .m-catalog-aside__container,
  .m-list-filtering {
    display: none;
  }
  .m-subnav li {
    min-width: auto;
  }
  main .m-collapsible,
  main .m-catalog__action-icons {
    margin: 0 auto;
  }
  .m-archive__container .m-icon__overlay {
    margin-right: 0;
  }
}
.m-inpagenav__noborders {
  border: 0;
}
.m-inpagenav__noborders a {
  border: 0;
  padding-left: 0;
  margin-left: 0;
}

.m-inpagenav__fixed {
  position: fixed;
  padding-left: 1.6rem;
}
.m-inpagenav__fixed a:hover {
  background-color: transparent;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-form-no__subnav {
  margin-top: -0.75rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.search-results__items .m-products__container-items {
  padding-left: 0;
  padding-top: 0;
}
.search-results__items .m-list-catalogs {
  padding-left: 0;
}

.search-results__item {
  padding-right: 3rem;
}
.search-results__item h3 {
  padding-left: 0.5rem;
}

.m-global-items__container .c-checkbox {
  padding-right: 0.5rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-archive__container .m-archive__centering,
.m-unlock__container .m-archive__centering {
  margin: 0 auto;
  display: flex;
  justify-content: flex-end;
  margin-top: -0.5rem;
  margin-bottom: 0.5rem;
}
.m-archive__container .m-icon__overlay,
.m-unlock__container .m-icon__overlay {
  background-color: #da0000;
  border-radius: 50%;
  width: 2.15rem;
  height: 2.15rem;
  cursor: pointer;
}
.m-archive__container .m-icon__overlay-disabled,
.m-unlock__container .m-icon__overlay-disabled {
  background-color: #a9a9a9;
}
.m-archive__container svg,
.m-unlock__container svg {
  width: 1.3rem;
  height: 1.3rem;
  fill: #fff;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.mesh-preview {
  width: 100%;
  height: 100%;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-action-bar__container {
  padding: 0.3rem;
  border-radius: 0;
  border: 1px solid #dfdfdf;
}
.m-action-bar__container svg {
  width: 1.8rem;
  height: 1.8rem;
}
.m-action-bar__container .c-select {
  padding: 0;
  margin: 0;
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
}
.m-action-bar__container .c-select .ember-power-select-status-icon {
  display: block;
  border-color: #000 transparent transparent;
}
.m-action-bar__container .c-select label,
.m-action-bar__container .c-select i,
.m-action-bar__container .c-select .ember-power-select-selected-item {
  display: none;
}
.m-action-bar__container .c-select .ember-power-select-status-icon {
  display: none;
}
.m-action-bar__container .c-select i {
  display: block;
  top: 1rem;
}
.m-action-bar__container .c-select .ember-basic-dropdown-trigger {
  border: 0;
}
.m-action-bar__container .ember-basic-dropdown-trigger[aria-expanded=true] .ember-power-select-status-icon {
  transform: rotate(360deg);
}

.m-action-bar__container-custom .m-action-bar-custom_margin {
  margin-top: 0.3rem;
}

.m-action-bar__label {
  max-width: 4.5rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.btn-switch__container button {
  margin: 0;
}
.btn-switch__container button:first-child {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-right: 0;
}
.btn-switch__container button:last-child {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  border-left: 0;
}
.btn-switch__container .btn-secondary {
  border-color: #000;
}
.btn-switch__container .btn-secondary:hover {
  background-color: #000;
  color: #fff;
}
.btn-switch__container .btn-secondary.btn-outlined:hover {
  background-color: #fff;
  color: #000;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.msg-errors__container {
  width: 100%;
  margin: 0 auto;
  display: block;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-draft-creation__container .m-rapi-import__helper {
  display: none;
}
.m-draft-creation__container .m-droparea {
  justify-content: center;
}
.m-draft-creation__container .m-rapi-import__choose {
  border-left: 0;
}
.m-draft-creation__container .m-draft-policies__container {
  max-width: 100%;
}
.m-draft-creation__container .c-pdc-message {
  min-width: 30%;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.flatpickr-calendar .flatpickr-day.selected {
  background-color: #da0000;
  border-color: #da0000;
}
.flatpickr-calendar.open {
  z-index: 100 !important;
}

.date-picker__trash {
  cursor: pointer;
  padding-left: 0.5rem;
}
.date-picker__trash svg {
  fill: #000;
  width: 1rem;
  height: 1rem;
}

.error .ember-flatpickr-input {
  border-color: #da0000;
}

.m-date-picker {
  position: relative;
}
.m-date-picker .h-arrow__custom {
  position: absolute;
  right: 0;
  top: 0.4rem;
  transform: rotate(-135deg);
  border-color: #000;
  cursor: pointer;
}
.m-date-picker .ember-power-select-trigger {
  min-height: auto;
  border-radius: 0;
  line-height: normal;
  width: 21rem;
}

.m-statistic__selectors-custom .h-arrow__custom {
  top: 0;
}

.material-expiry-date .h-arrow__custom {
  right: 2rem;
  top: 50%;
  transform: translateY(-50%) rotate(225deg);
}

.material-expiry-date {
  max-width: 100%;
}
.material-expiry-date .c-textfield.material-expiry-date__picker input {
  width: calc(100% - 1.5rem);
  padding-left: 0.5rem;
}
.material-expiry-date .disabled {
  opacity: 0.5;
  pointer-events: none;
}

.material-expiry-date__picker label {
  display: block;
}

.expiry-date__toggle {
  line-height: 1.3rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-a-better-toggle {
  position: relative;
  display: inline-block;
  width: 2.5rem;
  height: 1.4rem;
  cursor: pointer;
}
.m-a-better-toggle.m-a-better-toggle__has-text {
  width: auto;
  min-width: calc(4rem);
}
.m-a-better-toggle input {
  opacity: 0;
  width: 0;
  height: 0;
}
.m-a-better-toggle input:checked + .m-form__slider {
  background-color: #000;
}
.m-a-better-toggle input:checked + .m-form__slider .m-a-better-toggle__text {
  color: #fff;
  padding-left: 0.5rem;
  padding-right: 1rem;
}
.m-a-better-toggle input:checked + .m-form__slider::before {
  background-color: #fff;
  transform: translateX(0.8rem);
}
.m-a-better-toggle input:focus + .m-form__slider {
  box-shadow: 0 0 1px #000;
}

.m-a-better-toggle.m-a-better-toggle__has-text input:checked + .m-form__slider::before {
  transform: translateX(0);
  right: 0.2rem;
  left: auto;
}

.m-form__slider {
  position: absolute;
  cursor: pointer;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #eee;
  transition: 0.4s;
}
.m-a-better-toggle__has-text .m-form__slider {
  position: relative;
  top: 3px;
}
.m-form__slider {
  top: 0;
}
.m-form__slider::before {
  position: absolute;
  content: "";
  height: 0.7rem;
  width: 0.7rem;
  bottom: 0.2rem;
  background-color: #000;
  transition: 0.4s;
  top: 0.2rem;
  right: 2rem;
}
.m-a-better-toggle__has-text .m-form__slider::before {
  left: 0.2rem;
}
.m-form__slider.m-form__round {
  border-radius: 1rem;
  border: 2px solid #000;
}
.m-form__slider.m-form__round::before {
  border-radius: 50%;
  right: 1.2rem;
}
.m-form__slider .m-form__switch-disabled {
  opacity: 0.5;
}

.m-a-better-toggle__text {
  padding-left: 1rem;
  padding-right: 0.5rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.flatpickr-calendar .flatpickr-day.selected {
  background-color: #da0000;
  border-color: #da0000;
}
.flatpickr-calendar.open {
  z-index: 100 !important;
}

.date-picker__trash {
  cursor: pointer;
  padding-left: 0.5rem;
}
.date-picker__trash svg {
  fill: #000;
  width: 1rem;
  height: 1rem;
}

.error .ember-flatpickr-input {
  border-color: #da0000;
}

.m-date-picker {
  position: relative;
}
.m-date-picker .h-arrow__custom {
  position: absolute;
  right: 0;
  top: 0.4rem;
  transform: rotate(-135deg);
  border-color: #000;
  cursor: pointer;
}
.m-date-picker .ember-power-select-trigger {
  min-height: auto;
  border-radius: 0;
  line-height: normal;
  width: 21rem;
}

.m-statistic__selectors-custom .h-arrow__custom {
  top: 0;
}

.material-expiry-date .h-arrow__custom {
  right: 2rem;
  top: 50%;
  transform: translateY(-50%) rotate(225deg);
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-download__btns {
  float: right;
}
.m-download__btns button {
  display: inline-block;
  margin-left: 1rem;
}

.task-history .m-tbl__container {
  max-width: 100%;
}

.m-jobs-list__container .col-span-1,
.m-jobs-list__container .m-tbl-overflow__hide {
  display: none;
}
.m-jobs-list__container .col-span-5 {
  grid-column: span 6/span 6;
}
.m-jobs-list__container .m-tbl {
  margin-top: -0.5rem;
}
.m-jobs-list__container .m-tbl tbody tr:hover,
.m-jobs-list__container .m-tbl tbody td:hover,
.m-jobs-list__container .m-tbl tbody svg:hover {
  cursor: auto;
}
.m-jobs-list__container .m-tbl__header {
  display: none;
}

.m-jobs-filtering__item {
  width: 20%;
  padding-right: 2rem;
  padding-top: 0;
}
.m-jobs-filtering__item label {
  font-weight: bold;
}
.m-jobs-filtering__item .ember-flatpickr-input {
  font-weight: 100;
}
.m-jobs-filtering__item .h-arrow {
  right: 2.5rem;
}
.m-jobs-filtering__item .h-arrow__custom {
  display: none;
}
.m-jobs-filtering__item .ember-power-select-selected-item {
  max-width: 90%;
  text-overflow: ellipsis;
  overflow: hidden;
  width: 100%;
  white-space: nowrap;
  display: block;
}
.m-jobs-filtering__item:last-child {
  padding-right: 1rem;
  width: auto;
}

.m-jobs-filtering__item-custom {
  width: 18%;
}
.m-jobs-filtering__item-custom .flatpickr-input {
  padding: 1rem;
}
.m-jobs-filtering__item-custom .h-arrow {
  right: 1.5rem;
}

.m-tenant-analytics-list__container .m-collapsible {
  padding-top: 0;
}

.m-analytics__desc {
  margin-top: -1rem;
}

.m-tbl-jobs__icon svg {
  padding-right: 0.5rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-custom-creation__link .h-icon-plus {
  padding: 1rem 4%;
  color: #000;
  font-weight: 700;
  font-size: 1rem;
}
.m-custom-creation__link svg {
  padding-right: 0.5rem;
}

.disable-icon svg {
  fill: #a9a9a9;
  cursor: not-allowed;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-tags__list-filter {
  position: relative;
}
.m-tags__list-filter .m-ps__plus {
  float: none;
  text-align: right;
  margin: 0;
}
.m-tags__list-filter h3 {
  position: absolute;
  top: 0;
  margin: 0;
}
.m-tags__list-filter .ember-power-select-trigger {
  padding: 0;
}
.m-tags__list-filter .ember-power-select-multiple-option {
  margin-right: 0.5rem;
  margin-bottom: 0.5rem;
  padding: 0.1rem 0.5rem;
}
.m-tags__list-filter .h-icon-plus svg {
  width: 1.5rem;
  height: 1.5rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-spinner__container {
  height: 100%;
}

.s-shadow__overlay {
  background: rgba(0, 0, 0, 0.2);
  opacity: 1;
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 105;
  cursor: not-allowed;
}
.s-shadow__overlay .spinner {
  position: absolute;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.i-interactive__container {
  display: block;
  background-color: transparent;
  border: 0;
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  font-family: Rubik, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
.i-interactive__container span,
.i-interactive__container div {
  font-weight: 300;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.h-progress-bar__container {
  width: 7rem;
  margin-bottom: 1rem;
}

.h-progress-bar__background {
  display: block;
  width: 100%;
  height: 1rem;
  margin: 0;
  background-color: #eee;
  border-radius: 1rem;
}

.h-progress-bar__loader {
  width: 50%;
  height: 100%;
  margin-left: 0;
  background-color: #da0000;
  border-radius: 1rem;
  animation-name: spinner;
  animation-duration: 1500ms;
  animation-timing-function: ease-in-out;
  animation-play-state: running;
  animation-direction: alternate-reverse;
  animation-iteration-count: infinite;
}

@keyframes spinner {
  0% {
    margin-left: 0;
    margin-right: 100%;
  }
  100% {
    margin-left: 50%;
    margin-right: 0;
  }
}
.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-variation__hint {
  padding: 0.2rem;
  background-color: #bdbdbd;
  color: #fff;
  font-weight: 500;
  border-radius: 0.125rem;
  margin-left: 0.5rem;
  font-size: 0.8rem;
}

.m-job-icon__hint {
  padding-left: 0.3rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.c-textarea-configuration {
  height: 300px;
}
.c-textarea-configuration textarea {
  width: 100%;
  height: 100%;
  white-space: pre-wrap;
  outline: none;
  border: 0;
  padding-top: inherit;
  padding: 0;
  padding-left: 3rem;
  resize: none;
}

.c-textarea-configuration__editor {
  position: relative;
  height: 100%;
  width: 100%;
  border: 1px solid #dfdfdf;
  overflow: hidden;
}

.c-textarea-configuration__wrapper {
  position: relative;
  height: 100%;
}

.c-textarea-configuration__lines {
  position: absolute;
  top: 0;
  left: 0;
  width: 2.8rem;
  height: 100%;
  overflow: hidden;
}

.c-textarea-configuration__line-num {
  display: block;
  width: 2.5rem;
  text-align: center;
  color: #000;
  font-size: 1.2rem;
  line-height: 1.714rem;
  padding-right: 0.8rem;
}
.c-textarea-configuration__line-num:nth-child(odd) {
  background-color: #eee;
}
.c-textarea-configuration__line-num:nth-child(even) {
  background-color: #f9f9f9;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.loading-indicator {
  width: 1.5rem;
  height: 1.5rem;
  border: 1px solid #eee;
  border-top: 2px solid #da0000;
  border-radius: 100%;
  animation: spin 1s infinite linear;
  display: inline-block;
  margin-right: 0.5rem;
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-info-duplicated__warning {
  color: #da0000;
  padding-bottom: 1rem;
  margin-top: -1rem;
}

.pd-additional-contents .m-tbl__subforms tbody td,
.md-textures .m-tbl__subforms tbody td,
.cd-additional-info .m-tbl__subforms tbody td,
.cd-additional-info .m-tbl__subforms tbody td,
.pd-additional-infos .m-tbl__subforms tbody td,
.custom-tutorials-container .m-tbl__subforms tbody td,
.md-additional-infos .m-tbl__subforms tbody td {
  border-bottom: 1px solid #dfdfdf;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-item-converted {
  padding: 0.5rem 0;
}

.m-item-converted__link {
  text-decoration: underline;
  padding-top: 0.5rem;
  color: #da0000;
  cursor: pointer;
}

.m-item-converted__hint {
  font-size: 1rem;
  font-weight: 400;
}

.item-converter__form .c-prefix__container {
  background-color: #eee;
  padding: 1rem;
}
.item-converter__form .c-pdc-message {
  transform: none;
}
.item-converter__form .c-checkbox label {
  padding-bottom: 0.5rem;
}
.item-converter__form .c-checkbox label::before {
  top: 50%;
  left: 0;
}
.item-converter__form input {
  padding: 1rem;
  width: fit-content;
}
.item-converter__form input:checked + label::after {
  top: 1.4rem;
  left: 0.2rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-catalogs-filter__container .m-list-filtering {
  z-index: 104;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.embedding-flags__height-container {
  display: flex;
  flex: 1;
  height: 100%;
  position: relative;
}

.embedding-flags__layout {
  height: calc(100% + 3.75rem);
  flex: 1;
  display: grid;
  grid-template-rows: minmax(0, min-content) 1fr;
  grid-gap: 1.143rem;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
}

.embedding-flags__layout-preview-hint {
  grid-template-rows: minmax(0, min-content) 1fr minmax(0, min-content);
}

.embedding-flags__moc--header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 3rem;
}

.embedding-flags__moc--header,
.embedding-flags__sample--header {
  margin-top: -0.75rem;
}
.embedding-flags__moc--header strong,
.embedding-flags__sample--header strong {
  font-weight: 500;
}

.embedding-flags__sample--header {
  height: 3rem;
  line-height: 3rem;
}

.embedding-flags__moc--separator {
  border-bottom: 1px solid #eee;
  margin-left: -0.75rem;
  margin-right: -0.75rem;
  background-color: transparent;
  border-left: 0;
}

.embedding-flags__moc--cta {
  text-align: center;
}

.embedding-flags__moc--cta,
.embedding-flags__sample--cta {
  padding-top: 1rem;
  padding-bottom: 0.375rem;
}
.embedding-flags__moc--cta button,
.embedding-flags__sample--cta button {
  display: inline-block;
}
.embedding-flags__moc--cta .contact-sales__btn,
.embedding-flags__sample--cta .contact-sales__btn {
  width: 100%;
  margin: 0;
}
.embedding-flags__moc--cta p,
.embedding-flags__sample--cta p {
  padding-bottom: 1.5rem;
}

.embedding-flags__moc--container,
.embedding-flags__sample--container,
.embedding-flags__all--container,
.embedding-flags__one--container,
.embedding-flags__scroll--container {
  padding: 0.75rem;
  height: 100%;
}

.embedding-flags__filter--container {
  padding: 0.75rem;
  padding-top: 1.5rem;
}
.embedding-flags__filter--container hr {
  display: none;
}

.embedding-flags__moc--header--disabled {
  opacity: 0.5;
}

.embedding-flags__sample--container {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
}
.embedding-flags__sample--container .embedding-flags__moc--separator {
  opacity: 0;
}

.embedding-flags__sample--input {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.embedding-flags__sample--input .c-textfield {
  padding: 0;
  width: 50%;
}
.embedding-flags__sample--input .c-textfield label,
.embedding-flags__sample--input .c-textfield .spacer {
  display: none;
}
.embedding-flags__sample--input .m-jobs-filtering__item {
  width: 100%;
  max-width: 800px;
}

.embedding-flags__restore-default {
  cursor: pointer;
}

.embedding-flags__sample--input-value {
  justify-content: start;
  gap: 0.5rem;
  align-items: center;
}

.embedding-flags__all--container,
.embedding-flags__one--container {
  position: relative;
}

.embedding-flags__scroll--container {
  overflow-y: auto;
  overflow-x: hidden;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  box-sizing: border-box;
}
.embedding-flags__scroll--container h3 {
  display: flex;
  gap: 0.25rem;
  align-items: center;
}

.embedding-flags__active-flag {
  font-weight: 500;
}

.embedding-flags__one--container {
  position: relative;
}
.embedding-flags__one--container .btn-secondary {
  position: absolute;
  right: 1.5rem;
  bottom: 1.5rem;
}

.embedding-flags__sample--header-multiple .c-select {
  padding: 0;
}

.embedding-flags__hint {
  display: inline-block;
  color: #fff;
  border-radius: 2rem;
  padding: 0 0.5rem;
  text-transform: uppercase;
  font-size: 0.7rem;
  height: 1.2rem;
  line-height: 1.3rem;
  text-align: center;
  font-weight: 500;
}

.embedding-flags__hint--deprecated {
  background-color: #888;
}

.embedding-flags__hint--internal {
  background-color: #df0300;
}

.embedding-flags__link {
  display: block;
}

.embedding-preview__container {
  position: absolute;
  top: 5%;
  left: 10%;
  bottom: 5%;
  right: 10%;
  width: 80%;
  min-width: 1024px;
  max-width: 1440px;
  max-height: 90%;
  height: 90%;
  background-color: #fff;
  display: grid;
  grid-template-rows: min-content minmax(0, 1fr);
  padding: 3rem;
  box-sizing: border-box;
  border: 1px solid #000;
  color: #fff;
  box-shadow: 0 0.4rem 0.9rem 0.2rem rgba(0, 0, 0, 0.1);
  border-radius: 0.4rem;
}
.embedding-preview__container .roomle-configurator-canvas-container {
  border: 1px solid #dfdfdf;
}

.embedding-preview__toggle {
  padding-bottom: 1.5rem;
}

.embedding-preview__mobile {
  aspect-ratio: 9/16;
  max-height: 100%;
  margin: 0 auto;
  max-width: 1023px;
}

.embedding-flags__flag-button-preview-flag {
  box-shadow: 0 0.1rem 0.3rem 0.1rem rgba(0, 0, 0, 0.1);
}

.ember-power-select-search {
  border-left: 1px solid #dfdfdf;
  border-right: 1px solid #dfdfdf;
}

.tenant-settings__id_label-single {
  font-weight: 500;
  display: inline-block;
  margin-bottom: 0.5rem;
}

.embedding-flags__translation-keys-toggle {
  padding-top: 1rem;
}

.embedding-flags__indicator-hints {
  color: #888;
  padding-bottom: 1.5rem;
  font-weight: 400;
  display: flex;
  align-items: center;
  gap: 0.3rem;
}

.select-id__loading {
  display: flex;
  align-items: center;
  height: 100%;
  width: 100%;
  gap: 0.5rem;
}

.embedding-flags__moc--deactivated {
  pointer-events: none;
}

.embedding-flags__moc--active {
  color: #888;
  font-weight: 500;
}
.embedding-flags__moc--active span {
  text-decoration: underline;
  display: inline-block;
  padding-top: 0.3rem;
}

.embedding-flags__moc--container .m-a-better-toggle {
  width: 100%;
}
.embedding-flags__moc--container .m-a-better-toggle input:checked + .m-form__slider {
  background-color: #02af2e;
}
.embedding-flags__moc--container .m-a-better-toggle input:checked + .m-form__slider.m-form__round {
  border-color: #02af2e;
}

.embedding-flags-group__heading {
  font-weight: 500;
  margin: 0.5rem 0;
}

.embedding-flags__level1-msg {
  color: #da0000;
  font-weight: 400;
  padding-top: 0;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.cols-wrapper.h-100 .cols,
.cols-wrapper.h-100 .col {
  height: 100%;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.embedding-flags__object-props {
  border-radius: 0.125rem;
  border: 1px solid #eee;
  margin-bottom: 3rem;
}
.embedding-flags__object-props legend {
  padding: 0 0.5rem 0 0.5rem;
}

.embedding-flags__debugging {
  max-width: 450px;
  overflow: auto;
  padding: 1rem;
  border-radius: 0.125rem;
  border: 1px solid #eee;
}

.embedding-flags__one--container fieldset:has(.embedding-flags__fieldset_desc + fieldset) {
  border: none;
  padding: 0;
  margin: 0;
}
.embedding-flags__one--container fieldset:has(.embedding-flags__fieldset_desc + fieldset) > .embedding-flags__fieldset_desc,
.embedding-flags__one--container fieldset:has(.embedding-flags__fieldset_desc + fieldset) > legend:first-child {
  font-size: 0;
  padding: 0;
  margin: 0;
}

.embedding-flags__fieldset_desc {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.embedding-flags__key {
  color: #888;
  font-weight: 300;
  margin-top: -1rem;
  padding-bottom: 1rem;
}

fieldset.embedding-flags__object-props {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
fieldset.embedding-flags__object-props .embedding-flags__object-props-child:last-child .embedding-flags__spacer {
  display: none;
}

.embedding-flags__spacer {
  border-top: 1px solid #eee;
  margin-left: -0.75rem;
  margin-right: -0.75rem;
  margin-top: 1rem;
  margin-bottom: 2rem;
}

.embedding-flags__one--container .c-select i {
  top: 2.7rem;
}

.custom-tutorials-container .m-top-header__container {
  padding-left: 0;
  padding-bottom: 1rem;
}

.custom-tutorials-languages .c-select:first-child {
  width: 50%;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.any-of-search__container input {
  min-width: 5rem;
}

.any-of-search__options {
  width: 100%;
  /* background-color: blue; */
  padding: 0.2rem !important;
}
.ember-view ember-basic-dropdown-trigger .any-of-search__options {
  border: solid 1px gray;
}

.embedding-flags__any-of .ember-view ember-basic-dropdown-trigger {
  border-radius: 0;
}

.embedding-flags__any-of__input .ember-power-select-trigger {
  padding: 0;
  height: auto;
}
.embedding-flags__any-of__input .ember-basic-dropdown-trigger {
  display: flex;
  align-items: center;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.embedding-flags__restore-default-button {
  padding: 0.2rem 0.5rem;
  border-radius: 999px;
  font-size: 0.7rem;
  display: inline-block;
  font-weight: 400;
  cursor: pointer;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.progress-bar-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 4px;
  background-color: rgba(0, 0, 0, 0.1);
  z-index: 1000;
  display: block; /* Ensure it's visible */
}

.progress-bar-background {
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.1);
}

.progress-bar {
  height: 100%;
  background-color: #da0000;
  transition: width 0.4s ease;
}

.progress-text {
  text-align: center;
  color: #000;
  font-size: 12px;
}

.error-message {
  color: red;
  font-size: 12px;
  text-align: center;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.m-price-service__settings-column {
  line-break: anywhere;
}

.m-form-countries__container {
  position: relative;
}

.m-form-countries__reset {
  position: absolute;
  right: -4rem;
  top: 2.5rem;
  padding: 0.2rem 0.5rem;
  border-radius: 999px;
  font-size: 0.7rem;
  display: inline-block;
  font-weight: 400;
  cursor: pointer;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.dropdown-wrapper {
  position: relative;
  width: 18rem;
  margin-top: -1rem;
  top: 0.3rem;
  left: 1rem;
  box-sizing: border-box;
  display: block;
}
.dropdown-wrapper.selected {
  box-shadow: 0 0 0 1px #da0000;
}
.dropdown-wrapper .dropdown-icon {
  padding: 0;
}
.dropdown-wrapper svg {
  width: 1.3rem;
  height: 1.3rem;
}
.dropdown-wrapper .c-checkbox label {
  text-align: left;
  cursor: pointer;
}

.dropdown-sticky__container {
  position: sticky;
  background-color: #fff;
  z-index: 1;
  top: 0;
  border-bottom: 1px solid #dfdfdf;
}

.dropdown-button {
  width: 100%;
  padding: 8px 0;
  margin: 0;
  cursor: pointer;
  border: 1px solid #dfdfdf;
  background-color: #fff;
  text-align: left;
  position: relative;
}
.dropdown-button::after {
  content: "";
  position: absolute;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 6px solid #000;
  border-width: 7px 4px 0 4px;
}
.dropdown-button.is-open::after {
  border-top: 0;
  border-bottom: 6px solid #000;
}

.dropdown-label__container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

.dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  background-color: #fff;
  border: 1px solid #dfdfdf;
  z-index: 1;
  overflow-y: auto;
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
  box-sizing: border-box;
  max-height: 30rem;
  overflow-y: scroll;
}
.dropdown-menu .dropdown-menu__header {
  text-align: left;
  padding: 8px;
  font-weight: 400;
}
.dropdown-menu .dropdown-item {
  display: flex;
  align-items: center;
  padding: 8px;
}
.dropdown-menu .dropdown-item input {
  margin-right: 8px;
}

.dropdown-search-wrapper {
  position: relative;
  display: flex;
  align-items: center;
}
.dropdown-search-wrapper .dropdown-search-input {
  width: 100%;
  padding: 8px;
  border: 1px solid #dfdfdf;
  font-size: 0.9rem;
  border-left: 0;
  border-right: 0;
}
.dropdown-search-wrapper .dropdown-search-input:focus {
  outline-width: 0;
}
.dropdown-search-wrapper .dropdown-add-button {
  position: absolute;
  right: -5px;
  padding: 8px;
  border: none;
  background-color: #da0000;
  color: #fff;
  font-size: 0.9rem;
  cursor: pointer;
  border-radius: 4px;
}

.dropdown-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px;
}

.dropdown-delete-button {
  position: absolute;
  right: 0;
  border: none;
  color: #da0000;
  cursor: pointer;
  padding: 0.2rem;
  background-color: transparent;
}
.dropdown-delete-button svg {
  width: 1rem;
  height: 1rem;
}

.m-dropdown__info-icon {
  margin-left: 0.5rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.global-tooltip {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10000;
  background-color: #fff;
  color: #000;
  padding: 8px 12px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 500;
  max-width: 300px;
  opacity: 0;
  transition: opacity 0.15s ease-out;
}

.tooltip-arrow {
  position: absolute;
  width: 8px;
  height: 8px;
  background: #fff;
  transform: rotate(45deg);
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.slide-enter {
  transform: translateX(100%);
  transition: transform 0.3s ease-in-out;
}

.slide-enter-active {
  transform: translateX(0%);
}

.slide-leave {
  transform: translateX(0%);
  transition: transform 0.3s ease-in-out;
}

.slide-leave-active {
  transform: translateX(100%);
}

.overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 1000;
  background-color: rgba(0, 0, 0, 0.5);
}

.popup {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 65%;
  transform: translate(-50%, -50%);
  z-index: 1001;
  background-color: rgba(255, 255, 255, 0.95);
  padding: 1rem;
  box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.2);
}

.popup-container {
  position: relative;
  height: 100%;
  box-sizing: border-box;
  padding: 0.5rem;
}

.popup-close {
  position: absolute;
  top: 0;
  right: 0;
  height: 1.5rem;
  width: 1.5rem;
  cursor: pointer;
  z-index: 1002;
}

.close-icon svg {
  width: 100%;
  height: 100%;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.tutorials__wrapper {
  position: relative;
  display: flex;
  justify-content: center;
  padding: 1rem;
  margin: 0 auto;
  aspect-ratio: 0.53/1;
}
.tutorials__wrapper .tutorials__wrapper-spinner {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: 1rem;
  width: 1rem;
}
.tutorials__wrapper .tutorials__iframe {
  border: none;
  width: 100%;
  height: 100%;
}
.tutorials__wrapper .tutorials__iframe.is-loading {
  opacity: 0.5;
}
@media (min-width: 1024px) {
  .tutorials__wrapper {
    aspect-ratio: 1.55/1;
    max-width: unset;
  }
}
@media screen and (min-height: 1000px) and (min-width: 700px) {
  .tutorials__wrapper {
    max-width: unset;
    height: 100%;
  }
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.button-group {
  display: flex;
  justify-content: space-between;
  align-items: center;
  max-width: 70%;
  margin: 0 auto;
  position: relative;
}
.button-group::before {
  content: "";
  position: absolute;
  left: 3rem;
  top: 50%;
  left: 0;
  width: calc(100% - 3rem);
  height: 1px;
  background-color: #888;
  transform: translateX(1rem) translateY(-50%);
  z-index: 1;
}
.button-group .btn-secondary {
  text-align: center;
  z-index: 2;
  position: relative;
  font-weight: 500;
  height: 3rem;
}
.button-group .btn-secondary:hover.btn-outlined {
  color: #fff;
  background-color: #363636;
}
.button-group .btn-secondary:hover.btn-small:not(.btn-outlined) {
  color: #fff;
  background-color: #363636;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.partlist-info-container {
  display: block;
  line-height: 1.5;
  gap: 0.5rem;
}
.partlist-info-container .partlist-info__disabled {
  cursor: not-allowed;
  color: #a9a9a9;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

@keyframes pulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
}
@keyframes pulse-glow {
  0%, 100% {
    transform: scale(0.8);
    opacity: 0.5;
  }
  50% {
    transform: scale(1.6);
    opacity: 0;
  }
}
@keyframes fadeSlideIn {
  from {
    opacity: 0;
    transform: translateY(-0.375rem);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes fadeInPageIndicator {
  to {
    opacity: 1;
  }
}
@keyframes shimmer {
  0% {
    background-position: -200% 0;
  }
  100% {
    background-position: 200% 0;
  }
}
@keyframes pulsating-glow {
  0% {
    box-shadow: 0 0 0 0 rgba(218, 0, 0, 0.5);
  }
  70% {
    box-shadow: 0 0 0 0.625rem rgba(218, 0, 0, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(218, 0, 0, 0);
  }
}
.embedding-table {
  border: 1px solid #dfdfdf;
  border-radius: 2px;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  background: #fff;
  font-size: 0.9rem;
  box-shadow: 0 2px 0.5rem rgba(0, 0, 0, 0.05);
  position: relative;
  overflow: hidden;
}
.embedding-table.dragging {
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}

.grid-wrapper {
  display: grid;
  grid-template-columns: 0.9fr 1.3fr 0.9fr;
}
.grid-wrapper.l2-hidden {
  grid-template-columns: 0.9fr 1.3fr 0.9fr;
}

.l2-hidden .grid-wrapper {
  grid-template-columns: 0.9fr 1.3fr 0.9fr;
}

.table-header {
  border-bottom: 1px solid #dfdfdf;
  font-weight: 500;
  font-size: 0.9rem;
  align-items: center;
  background-color: #f9f9f9;
  padding-top: 1rem;
  box-sizing: border-box;
  z-index: 100;
  min-height: 4rem;
}

.header-cell {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.5rem 1rem;
  height: 100%;
  box-sizing: border-box;
}
.header-cell:not(:last-child):not(:nth-last-child(2)) {
  border-right: 1px solid #dfdfdf;
}
.header-cell:last-child {
  border-left: 1px solid #dfdfdf;
}

.header-title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  color: #363636;
}

.info-icon {
  display: inline-flex;
  width: 1.125rem;
  height: 1.125rem;
  border: 1.5px solid #666;
  border-radius: 50%;
  font-size: 0.7rem;
  font-weight: 700;
  align-items: center;
  justify-content: center;
  color: #666;
  cursor: help;
  min-width: 1.125rem;
}

.actions {
  display: flex;
  align-items: center;
  position: relative;
}
.actions .search-btn {
  background: none;
  border: none;
  cursor: pointer;
  padding: 0.25rem;
  border-radius: 0.25rem;
  color: #666;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  font-size: 1.2rem;
}
.actions .search-btn svg {
  width: 1.5rem;
  height: 1.5rem;
}
.actions .search-btn:hover {
  background-color: #e7e7e7;
  color: #000;
}

.sort-btn {
  font-size: 1rem;
  width: 1.5rem;
  height: 1.5rem;
}

.entity-sort {
  margin-left: auto;
  font-size: 0.9rem;
  color: #888;
  padding-left: 0;
}
.entity-sort:hover {
  cursor: help;
}

.entity-link__length {
  width: 1.4rem;
  height: 1.4rem;
  min-width: 1.4rem;
  min-height: 1.4rem;
  color: #fff;
  background-color: #888;
  border-radius: 50%;
  font-weight: 500;
  font-size: 0.8rem;
}
.entity-link__length:hover {
  cursor: help;
}

.entity-link__indicator {
  border-radius: 2px;
  color: #fff;
  background-color: #888;
  padding: 0.1rem 0.5rem;
  font-size: 0.8rem;
  font-weight: 500;
  position: absolute;
  right: 1rem;
}

.settings-btn {
  font-size: 1.2rem;
  width: 1.5rem;
  height: 1.5rem;
}

.plus-style-btn {
  font-size: 1rem;
  font-weight: 700;
  color: #fff;
  background-color: #da0000;
  border: none;
  border-radius: 50%;
  width: 1rem;
  height: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background-color 0.1s ease;
  line-height: 1;
  padding: 0;
}
.plus-style-btn svg {
  width: 0.625rem;
  height: 0.625rem;
  display: block;
}
.plus-style-btn:hover {
  background-color: #c10000;
}
.plus-style-btn--small {
  font-size: 0.75rem;
  font-weight: 700;
  color: #fff;
  background-color: #da0000;
  border: none;
  border-radius: 50%;
  width: 1.125rem;
  height: 1.125rem;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  line-height: 1;
}
.plus-style-btn--small svg {
  width: 0.75rem;
  height: 0.75rem;
  display: block;
}
.plus-style-btn--add-level {
  background-color: #da0000;
}
.plus-style-btn--add-level:hover {
  background-color: #a70000;
}
.plus-style-btn--add-level:disabled, .plus-style-btn--add-level.is-disabled {
  background-color: #a9a9a9;
  cursor: not-allowed;
  opacity: 0.6;
}
.plus-style-btn--add-level:disabled:hover, .plus-style-btn--add-level.is-disabled:hover {
  background-color: #a9a9a9;
}

.delete-style-btn {
  font-size: 1rem;
  font-weight: 700;
  color: #fff;
  background-color: #da0000;
  border: none;
  border-radius: 50%;
  width: 1rem;
  height: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background-color 0.1s ease;
  line-height: 1;
  padding: 0;
  margin-left: 0.25rem;
}
.delete-style-btn svg {
  width: 0.625rem;
  height: 0.625rem;
  display: block;
}
.delete-style-btn:hover {
  background-color: #a70000;
}
.delete-style-btn:disabled {
  background-color: #888;
  cursor: not-allowed;
  opacity: 0.5;
}

.add-item-btn {
  display: block;
  margin: 1rem auto 0.5rem;
  margin-top: 0.5rem;
}

.add-product-btn-column {
  margin-top: 0.625rem;
  display: block;
  width: calc(100% - 1.25rem);
  margin-left: 0.625rem;
  margin-right: 0.625rem;
}

.table-columns {
  display: flex;
  overflow-y: auto;
  max-height: 60vh;
  height: 60vh;
  scrollbar-width: none;
  -ms-overflow-style: none;
  overflow: hidden;
  min-height: 0;
}
.table-columns::-webkit-scrollbar {
  display: none;
}

.scrollable-columns {
  flex: 2;
  overflow-y: auto;
  flex-direction: row;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.column {
  --column-padding-horizontal: 1rem;
  flex: 1;
  border-right: 1px solid #dfdfdf;
  padding: 1rem var(--column-padding-horizontal);
  position: relative;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
  min-height: 0;
  max-height: 100%;
  padding-bottom: 0;
  border-left: 0;
  overflow: auto;
}
.column::-webkit-scrollbar {
  display: none;
}
.column::-webkit-scrollbar-thumb {
  background: #bdbdbd;
  border-radius: 0.25rem;
}
.column:last-child {
  border-right: none;
}
.column.category-column {
  border-right: 0;
  padding: 0;
  grid-column: 2;
  background-color: #f9f9f9;
}

.category-header-cell .search-input {
  width: 60%;
}

.column-end-spacer {
  height: 2rem;
  flex-shrink: 0;
}

.catalog-column {
  grid-column: 1;
  background-color: #eee;
  flex: 0.8;
}

.product-column {
  flex: 1;
  overflow: hidden;
  padding: 1rem;
  border-left: 1px solid #dfdfdf;
  grid-column: 3;
  background-color: #f9f9f9;
  min-height: 3.125rem;
  overflow-y: auto;
}
.product-column.drop-target-container {
  background-color: #dfdfdf;
}
.product-column.drag-over-active-column {
  background-color: #fefce8;
  border: 1px dashed #f59e0b;
}
.product-column.is-drop-target-hint {
  background-color: rgba(var(--color-primary-rgb), 0.05);
  border: 2px dashed var(--color-primary);
  box-shadow: inset 0 0 1.25rem rgba(var(--color-primary-rgb), 0.15);
  /* A subtle transition for when the class is added/removed */
  transition: all 0.2s ease-in-out;
}

.tag-placeholder {
  width: 100%;
  top: 1rem;
}
.tag-placeholder p {
  color: #888;
  width: 100%;
  display: block;
  text-align: center;
}

.tag-column {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow-y: scroll;
  overflow-x: hidden;
  scrollbar-width: none;
  min-height: 3.125rem;
}
.tag-column.drag-over-active-column {
  background-color: #fefce8;
  border: 1px dashed #f59e0b;
}
.tag-column .tag-header {
  position: sticky;
  top: 0;
  z-index: 100;
  padding: 1rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.6rem;
  background-color: #f9f9f9;
}
.tag-column .level-header-buttons {
  display: flex;
  gap: 0.25rem;
  align-items: center;
}
.tag-column .level2-header-buttons {
  position: absolute;
  right: 0;
}
.tag-column .tag-placeholder {
  top: 3rem;
  color: #888;
  font-size: 0.9rem;
  text-align: center;
  background-color: transparent;
  overflow-wrap: break-word;
  word-wrap: break-word;
}
.tag-column .tag-placeholder p {
  color: #888;
  overflow-wrap: break-word;
  word-wrap: break-word;
  white-space: normal;
}
.tag-column + .tag-column {
  border-left: 1px solid #dfdfdf;
}
.tag-column.drop-target-container {
  background-color: #dfdfdf;
}

.tag-column.is-dynamic-level {
  flex: 1 0 15rem;
  overflow-y: auto;
  scrollbar-width: thin;
}
.tag-column.is-dynamic-level::-webkit-scrollbar {
  width: 0.5rem;
  border-radius: 0.25rem;
}
.tag-column.is-dynamic-level::-webkit-scrollbar-track {
  background: transparent;
}
.tag-column.is-dynamic-level::-webkit-scrollbar-thumb {
  background-color: #bdbdbd;
  border-radius: 0.25rem;
}
.tag-column.is-dynamic-level::-webkit-scrollbar-thumb:hover {
  background-color: #888;
}

.l1-tag-column,
.l2-tag-column,
.is-dynamic-level {
  min-height: 3.125rem;
}

.is-dynamic-level .tag-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-weight: 500;
  font-size: 0.9rem;
  color: #363636;
  background-color: #f9f9f9;
  position: sticky;
  top: 0;
  z-index: 5;
}
.is-dynamic-level .tag-header__label {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.item-entry {
  border: 1px solid #dfdfdf;
  border-radius: 0.4rem;
  background: #f9f9f9;
  padding: 0.6rem 0.75rem;
  font-size: 0.9rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.75rem;
  cursor: pointer;
  position: relative;
  z-index: 1;
  box-sizing: border-box;
  transition: transform 0.1s ease;
}
.item-entry:hover {
  border-color: #bdbdbd;
  z-index: 10;
}
.item-entry:hover::before {
  opacity: 1;
}
.item-entry.selected {
  position: sticky;
  top: 0;
  background: #fff;
  z-index: 10;
}
.item-entry[draggable=true] {
  cursor: grab;
}
.item-entry.dragging {
  opacity: 0.5;
  transform: scale(0.95);
  transition: opacity 0.2s ease, transform 0.2s ease;
  z-index: 1000;
  position: relative;
  border: 2px dashed #da0000;
}
.item-entry.drag-target {
  background-color: #f9f9f9;
  border: 2px dashed #da0000;
  transform: translateY(-2px);
  transition: all 0.1s ease;
}
.item-entry.drag-target::after {
  content: "";
  position: absolute;
  top: -2px;
  left: 0;
  right: 0;
  height: 0.25rem;
  background-color: #da0000;
  border-radius: 0.125rem;
}
.item-entry[disabled] {
  opacity: 0.6;
  cursor: not-allowed;
}
.item-entry[disabled]:hover::before {
  opacity: 0;
}
.item-entry.dragging-source {
  opacity: 0.5;
  border: 2px dashed #f59e0b;
  box-shadow: 0 2px 0.625rem rgba(0, 0, 0, 0.1);
}
.item-entry.drop-target-before::before, .item-entry.drop-target-after::after {
  content: "";
  bottom: -2px;
  position: absolute;
  left: 0;
  right: 0;
  height: 0.4375rem;
  background-image: radial-gradient(circle at 0.21875rem 0.21875rem, transparent 0, transparent calc(0.21875rem - 1.5px), #da0000 calc(0.21875rem - 1.5px), #da0000 0.21875rem, transparent calc(0.21875rem + 0.5px)), linear-gradient(#da0000, #da0000);
  background-repeat: no-repeat;
  background-size: 0.4375rem 0.4375rem, calc(100% - 0.4375rem) 2px;
  background-position: 0% 50%, 0.4375rem 50%;
  opacity: 0;
  transform: scaleY(0.5);
  transform-origin: center;
  transition: opacity 0.15s ease-out, transform 0.15s ease-out;
  pointer-events: none;
  z-index: 5;
}
.item-entry.drop-target-before::before {
  top: calc(-0.75rem / 2 - 0.4375rem / 2);
  opacity: 1;
  transform: scaleY(1);
}
.item-entry.drop-target-after::after {
  bottom: calc(-0.75rem / 2 - 0.4375rem / 2);
  opacity: 1;
  transform: scaleY(1);
}
.item-entry .item-content {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-grow: 1;
  overflow: hidden;
}
.item-entry .item-content svg {
  width: 1rem;
  height: 1rem;
}
.item-entry .item-name {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #363636;
}
.item-entry .remove-btn {
  background: none;
  border: none;
  font-weight: 400;
  color: #888;
  cursor: pointer;
  padding: 0.1rem 0;
  font-size: 1.2rem;
  line-height: 1;
  border-radius: 0.1875rem;
  margin: 0;
}
.item-entry .remove-btn:hover {
  color: #da0000;
  background-color: #f9f9f9;
}
.item-entry.tag-entry.is-potential-drop-target {
  border: 1px dashed #f59e0b;
  border-radius: 0.375rem;
  transition: all 0.2s ease-in-out;
}
.item-entry.tag-entry.drop-target-product-on-tag {
  background-color: rgba(218, 0, 0, 0.05);
  border: 1px dashed #f59e0b;
  box-shadow: 0 0 0.3125rem rgba(218, 0, 0, 0.05);
}
.item-entry.tag-entry.drag-disabled {
  opacity: 0.7;
  cursor: not-allowed;
}
.item-entry.tag-entry.drag-disabled .drag-handle {
  cursor: not-allowed;
  opacity: 0.5;
}
.item-entry.tag-entry.l2-drop-target-on-l1-active {
  background-color: rgba(218, 0, 0, 0.1);
  border: 1px dashed #f59e0b;
}

.item-entry {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.item-entry:hover {
  transform: translateY(-4px) scale(1.02);
}
.item-entry:hover::before {
  opacity: 1;
}
.item-entry.selected {
  transform: translateY(-2px);
}
.item-entry.selected .item-name {
  font-weight: 600;
}
.item-entry.dragging {
  opacity: 0.8;
  transform: scale(1.05) rotate(2deg);
  animation: magical-glow 2s ease-in-out infinite;
}
.item-entry.drag-target {
  border: 2px solid rgba(67, 233, 123, 0.5);
  transform: translateY(-6px) scale(1.03);
}
.item-entry.drag-target::after {
  content: "";
  position: absolute;
  top: -4px;
  left: 0;
  right: 0;
  height: 4px;
  border-radius: 2px;
}

.catalog-column .catalog-entry {
  width: 100%;
  left: 0;
  margin-left: 0;
  margin-right: 0;
  padding: 1.3rem 0.75rem;
  background-color: #f9f9f9;
}
.catalog-column .catalog-entry .draft-timer {
  position: absolute;
  bottom: 0rem;
  right: 0.4rem;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 1px;
  background-color: #f59e0b;
  border-radius: 0.375rem;
  cursor: help;
  font-size: 0.7rem;
  font-weight: 600;
  color: #000;
  font-variant-numeric: tabular-nums;
}
.catalog-column .catalog-entry .draft-timer svg {
  width: 0.75rem;
  height: 0.75rem;
  color: #000;
  fill: #000;
}
.catalog-column .catalog-entry.selected {
  left: 0;
  width: calc(100% + var(--column-padding-horizontal));
  margin-right: 0;
  max-width: none;
  z-index: 9;
  border-right-color: transparent;
  padding-right: calc(0.75rem + var(--column-padding-horizontal));
  border-left: 0.25rem solid #4f46e5;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  margin-right: -1.07rem;
}
.catalog-column .catalog-entry.selected .item-name {
  font-weight: 500;
}
.catalog-column .catalog-entry.has-draft-changes {
  background-color: #fefce8;
  border-left: 0.25rem solid #eed87f;
}
.catalog-column .catalog-entry.is-pending-unlink {
  background-color: #ffc5c5;
  border-left: none;
  box-shadow: none;
}
.catalog-column .catalog-entry.selected-collection {
  border-left: 0.25rem solid #4f46e5;
}
.catalog-column .catalog-entry.selected {
  left: 0;
  width: calc(100% + var(--column-padding-horizontal));
  margin-right: 0;
  max-width: none;
  z-index: 9;
  border-right-color: transparent;
  padding-right: calc(0.75rem + var(--column-padding-horizontal));
  border-left: 0.25rem solid #da0000;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  margin-right: -1.07rem;
}
.catalog-column .catalog-entry.selected .item-name {
  font-weight: 500;
}

.tag-entry.has-pending-changes,
.product-entry.has-pending-changes {
  background-color: #fefce8;
}
.tag-entry .pending-change-indicator,
.product-entry .pending-change-indicator {
  margin-left: 4px;
  color: #a16207;
  font-weight: bold;
  font-size: 1.2em;
}
.tag-entry.is-pending-unlink, .tag-entry.is-pending-move-source,
.product-entry.is-pending-unlink,
.product-entry.is-pending-move-source {
  background-color: #ffc5c5;
  border-left: none;
  opacity: 0.8;
}
.tag-entry.is-pending-unlink .pending-change-indicator, .tag-entry.is-pending-move-source .pending-change-indicator,
.product-entry.is-pending-unlink .pending-change-indicator,
.product-entry.is-pending-move-source .pending-change-indicator {
  display: none;
}
.tag-entry.is-pending-unlink .remove-btn, .tag-entry.is-pending-move-source .remove-btn,
.product-entry.is-pending-unlink .remove-btn,
.product-entry.is-pending-move-source .remove-btn {
  visibility: hidden;
}
.tag-entry.is-pending-unlink .item-name, .tag-entry.is-pending-move-source .item-name,
.product-entry.is-pending-unlink .item-name,
.product-entry.is-pending-move-source .item-name {
  text-decoration: line-through;
  color: #7f1d1d;
}
.tag-entry.is-pending-addition,
.product-entry.is-pending-addition {
  background-color: #fefce8;
  border: 1px dashed #f59e0b;
}
.tag-entry.is-pending-addition.selected,
.product-entry.is-pending-addition.selected {
  border-left: 0.25rem solid #da0000;
}
.tag-entry.is-pending-addition .item-name,
.product-entry.is-pending-addition .item-name {
  text-decoration: none;
  color: inherit;
}
.tag-entry.is-pending-reorder,
.product-entry.is-pending-reorder {
  background-color: #fefce8;
  border-left: 3px solid #f59e0b;
}
.tag-entry.is-hovered-from-draft,
.product-entry.is-hovered-from-draft {
  outline: 2px solid #da0000;
  outline-offset: 2px;
  background-color: #dbeafe;
  transition: outline 0.15s ease-out, background-color 0.15s ease-out;
}
.tag-entry .is-external-collection,
.product-entry .is-external-collection {
  z-index: 1;
}

.top-table-section {
  margin-top: -0.5rem;
}

.category-column .tag-entry {
  width: 85%;
  left: 5%;
  margin-left: 0;
  margin-right: 0;
  background-color: #f9f9f9;
  outline: none;
}
.category-column .tag-entry.multi-selected {
  width: 75%;
  left: 5%;
  border-left: 0.25rem solid #4f46e5;
}
.category-column .tag-entry.has-pending-changes {
  background-color: #fefce8;
}
.category-column .tag-entry.is-pending-addition {
  background-color: #fefce8;
  border: 1px dashed #f59e0b;
}
.category-column .tag-entry.is-pending-addition.selected {
  border-left: 0.25rem solid #da0000;
}
.category-column .tag-entry.is-pending-reorder {
  background-color: #fefce8;
  border-left: 3px solid #f59e0b;
}
.category-column .tag-entry.is-pending-reorder.selected {
  border-left: 0.25rem solid #da0000;
}
.category-column .tag-entry.is-pending-unlink {
  background-color: #ffc5c5;
  border-left: none;
}
.category-column .tag-entry.selected {
  margin-left: 0.85rem;
  margin-right: 0;
  max-width: none;
  border-right-color: transparent;
  padding-right: calc(0.75rem + var(--column-padding-horizontal) + 1px);
  border-left: 0.25rem solid #da0000;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  left: 5%;
  width: calc(95% + var(--column-padding-horizontal));
  top: 3rem;
  z-index: 20;
  box-shadow: none;
}
.category-column .tag-entry.selected .item-name {
  font-weight: 500;
}

.product-column .item-entry.selected {
  width: 100%;
  max-width: none;
  left: 0;
  margin-left: 0;
  margin-right: 0;
  border-left: 0.25rem solid #4f46e5;
  background-color: #f9f9f9;
  z-index: 5;
  padding-right: 0.75rem;
}
.product-column .item-entry.selected .item-name {
  font-weight: 500;
}
.product-column.is-disabled {
  opacity: 0.6;
  pointer-events: none;
  background: linear-gradient(135deg, rgba(156, 163, 175, 0.1) 0%, rgba(209, 213, 219, 0.1) 100%);
  position: relative;
}
.product-column.is-disabled::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: repeating-linear-gradient(45deg, transparent, transparent 10px, rgba(156, 163, 175, 0.05) 10px, rgba(156, 163, 175, 0.05) 20px);
  z-index: 1;
  pointer-events: none;
}
.product-column.is-disabled:hover {
  transform: none;
  box-shadow: none;
  border-color: rgba(156, 163, 175, 0.4);
}
.product-column .product-content-disabled {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  min-height: 300px;
  padding: 2rem;
  text-align: center;
  color: rgba(107, 114, 128, 0.8);
  border-radius: 1rem;
  margin: 1rem;
  position: relative;
  z-index: 2;
}
.product-column .product-content-disabled .disabled-icon {
  width: 48px;
  height: 48px;
  margin-bottom: 1rem;
  color: rgba(156, 163, 175, 0.6);
  animation: pulse 2s ease-in-out infinite;
}
.product-column .product-content-disabled .disabled-icon svg {
  width: 100%;
  height: 100%;
}
.product-column .product-content-disabled h3 {
  font-size: 1.125rem;
  font-weight: 600;
  color: rgba(75, 85, 99, 0.9);
  margin-bottom: 0.5rem;
  margin-top: 0;
}
.product-column .product-content-disabled p {
  font-size: 0.875rem;
  line-height: 1.5;
  color: rgba(107, 114, 128, 0.7);
  max-width: 280px;
  margin: 0;
}

.product-list > .item-entry:last-child,
.tag-list > .item-entry:last-child {
  margin-bottom: 0;
}

.product-list {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  position: relative;
}
.product-list .item-entry {
  margin-bottom: 0.5rem;
}

.product-entry {
  padding: 0.5rem;
  gap: 0.5rem;
  outline: none;
  justify-content: flex-start;
}
.product-entry .product-name {
  margin-right: auto;
}
.product-entry.fading-out {
  opacity: 0;
  transform: scale(0.9);
  transition: opacity 0.2s ease-out, transform 0.2s ease-out;
  pointer-events: none;
}
.product-entry.is-linked {
  opacity: 0.5;
  background-image: repeating-linear-gradient(45deg, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05) 2px, transparent 2px, transparent 0.375rem);
}

.product-image {
  width: 2.25rem;
  height: 2.25rem;
  flex-shrink: 0;
  object-fit: contain;
  border-radius: 0.25rem;
  background-color: #eee;
  border: 1px solid #eee;
}

.product-image-placeholder {
  width: 2.25rem;
  height: 2.25rem;
  flex-shrink: 0;
  border-radius: 0.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.625rem;
  color: #666;
  line-height: 2.25rem;
}
.product-image-placeholder svg {
  fill: #a9a9a9;
}

.product-name {
  flex: 1 1 0;
  min-width: 0;
  max-width: none;
  font-size: 0.9rem;
}

.product-status {
  width: 0.625rem;
  height: 0.625rem;
  border-radius: 50%;
  flex-shrink: 0;
}

.product-content-placeholder {
  padding: 2rem 1rem;
  text-align: center;
  color: #888;
  flex-grow: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #f9f9f9;
  border-radius: 0.4rem;
  margin-bottom: 1rem;
}
.product-content-placeholder.drag-over-active-column {
  background-color: #fefce8;
  border: 1px dashed #f59e0b;
}

.tag-columns {
  display: flex;
  flex-grow: 1;
  overflow: auto;
  padding-right: 0;
  scrollbar-width: none;
}
.tag-columns.scroll-start {
  box-shadow: inset -12px 0 10px -10px rgba(0, 0, 0, 0.15);
}
.tag-columns.scroll-end {
  box-shadow: inset 12px 0 10px -10px rgba(0, 0, 0, 0.15);
}
.tag-columns.scroll-middle {
  box-shadow: inset 12px 0 10px -10px rgba(0, 0, 0, 0.15), inset -12px 0 10px -10px rgba(0, 0, 0, 0.15);
}
.tag-columns.scrollable {
  box-shadow: inset -12px 0 10px -10px rgba(0, 0, 0, 0.15);
}
.tag-columns.scrollable-end {
  box-shadow: inset 12px 0 10px -10px rgba(0, 0, 0, 0.15);
}
.tag-columns:not(.scrollable):not(.scrollable-end):not(.scroll-start):not(.scroll-end):not(.scroll-middle) {
  box-shadow: none;
}

.link-icon {
  color: #da0000;
  font-size: 1rem;
  display: flex;
  align-items: center;
}
.link-icon svg {
  width: 1rem;
  height: 1rem;
}
.link-icon:hover svg {
  opacity: 0.5;
}

.link-icon-placeholder {
  width: 1rem;
  height: 1rem;
}

.search-input {
  width: 100%;
  padding: 0.5rem 0.75rem;
  margin-top: -0.3rem;
  margin-left: 1rem;
  font-size: 0.9rem;
  color: #363636;
  border: 1px solid #dfdfdf;
  border-radius: 0.5rem;
  transition: border-color 0.1s ease, box-shadow 0.1s ease;
  background-color: #f9f9f9;
}
.search-input::placeholder {
  color: #a9a9a9;
}
.search-input:focus {
  border-color: #888;
  box-shadow: 0 0 0 2px rgba(100, 100, 100, 0.1);
  outline: none;
}

.collections-search {
  width: 85%;
  margin-top: 0.5rem;
  padding: 0.8rem;
}

.dropdown-form {
  position: absolute;
  top: 100%;
  left: 0;
  background: #fff;
  border: 1px solid #dfdfdf;
  border-radius: 0.5rem;
  padding: 1rem;
  z-index: 10;
  box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.1);
}
.dropdown-form .form-input {
  padding-left: 0.5rem;
  font-size: 0.9rem;
}
.dropdown-form .ember-power-select-placeholder,
.dropdown-form .ember-power-select-selected-item {
  font-size: 0.9rem;
  font-weight: normal;
}
.dropdown-form::before {
  content: "";
  position: absolute;
  top: -0.4375rem;
  left: 1.6875rem;
  border-left: 0.5rem solid transparent;
  border-right: 0.5rem solid transparent;
  border-bottom: 0.5rem solid #f9f9f9;
  filter: drop-shadow(0 -1px 1px rgba(0, 0, 0, 0.1));
}

.add-l1-tag-form {
  position: absolute;
  top: 100%;
  right: 0;
  z-index: 200;
  min-width: 15.625rem;
  background-color: #f9f9f9;
  border: 1px solid #e7e7e7;
  box-shadow: 0 2px 0.3125rem rgba(0, 0, 0, 0.15);
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  margin-left: 0.2rem;
}
.add-l1-tag-form .form-label {
  margin-bottom: 3px;
  display: block;
}
.add-l1-tag-form .form-input {
  width: 100%;
}
.add-l1-tag-form .form-input input {
  width: 100%;
  padding: 0.5rem;
  border: 1px solid #e7e7e7;
  border-radius: 0.25rem;
  box-sizing: border-box;
}
.add-l1-tag-form .form-actions {
  display: flex;
  justify-content: flex-end;
  gap: 0.625rem;
  margin-top: 0.625rem;
}

.toggle-root-tag-btn {
  transition: transform 0.3s ease;
}

.item-entry.tag-entry.is-editing {
  display: flex;
  align-items: center;
  padding: 0;
  margin-bottom: 0.3125rem;
  border: 1px solid #e7e7e7;
}

.new-tag-input {
  width: 100%;
  padding: 0.5rem 0.625rem;
  border: none;
  outline: none;
  background-color: transparent;
  box-shadow: none;
  font-size: inherit;
  color: inherit;
  box-sizing: border-box;
}

.sticky-entry {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #fff;
  box-shadow: 0 2px 0.25rem rgba(0, 0, 0, 0.03);
  border-top-left-radius: 0.4rem;
  border-top-right-radius: 0.4rem;
  margin-bottom: 0.5rem;
}

body.product-dragging-active {
  cursor: grabbing;
}

body.body-product-drag-for-disassociation::before {
  content: "";
  position: fixed;
  top: 3px;
  left: 3px;
  right: 3px;
  bottom: 3px;
  border: 2px dashed rgba(220, 53, 69, 0.5);
  border-radius: 0.5rem;
  pointer-events: none;
  z-index: 10000;
  opacity: 0;
  animation: fadeInPageIndicator 0.3s ease-in-out forwards;
}
body.body-product-drag-for-disassociation::after {
  content: "Drop product outside the table to remove from current tag";
  position: fixed;
  bottom: 4.375rem;
  left: 50%;
  transform: translateX(-50%);
  background-color: rgba(40, 40, 40, 0.9);
  color: #fff;
  padding: 0.625rem 1.125rem;
  border-radius: 0.375rem;
  font-size: 0.9em;
  box-shadow: 0 2px 0.5rem rgba(0, 0, 0, 0.2);
  z-index: 10001;
  pointer-events: none;
  opacity: 0;
  animation: fadeInPageIndicator 0.3s 0.15s ease-in-out forwards;
}

.disassociation-drop-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0);
  z-index: 9999;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  padding-bottom: 1.875rem;
  box-sizing: border-box;
  pointer-events: auto;
  transition: background-color 0.2s ease-in-out;
}
.disassociation-drop-overlay .disassociation-message {
  padding: 0.75rem 1.375rem;
  background-color: rgba(220, 53, 69, 0.9);
  color: #fff;
  border-radius: 0.375rem;
  font-size: 0.95em;
  text-align: center;
  box-shadow: 0 2px 0.625rem rgba(0, 0, 0, 0.25);
  opacity: 0;
  transform: translateY(1.875rem);
  transition: opacity 0.25s ease-out, transform 0.25s ease-out;
  pointer-events: none;
}
.disassociation-drop-overlay.active-target {
  background-color: rgba(220, 53, 69, 0.1);
}
.disassociation-drop-overlay.active-target .disassociation-message {
  opacity: 1;
  transform: translateY(0);
}

.fade-slide-in {
  animation: fadeSlideIn 0.1s ease-out forwards;
}

.loader-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background-color: #bdbdbd;
  z-index: 10;
}

.loader-spinner {
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, #363636, transparent);
  animation: shimmer 1.5s infinite;
}

.teaching-hint-bar {
  position: fixed;
  bottom: 1.5625rem;
  left: 50%;
  transform: translateX(-50%);
  background-color: #363636;
  color: #fff;
  padding: 0.75rem 1.5rem;
  border-radius: 0.5rem;
  box-shadow: 0 0.3125rem 1rem rgba(0, 0, 0, 0.25);
  z-index: 1050;
  font-size: 0.9rem;
  display: flex;
  align-items: center;
  gap: 0.625rem;
  animation: slide-in 0.3s ease-out;
}

.teaching-hint-bar kbd {
  background-color: #666;
  border: 1px solid #888;
  border-radius: 0.25rem;
  padding: 2px 0.375rem;
  font-size: 1rem;
}

.catalog-product-browser {
  display: flex;
  gap: 1px; /* The separator will create the gap */
  position: relative;
  min-height: 28.125rem;
  height: 70vh;
  border: 1px solid #dfdfdf;
  border-radius: 2px;
  background-color: #dfdfdf; /* Separator color */
  overflow: hidden;
}

.loading-overlay {
  position: absolute;
  inset: 0;
  background-color: rgba(255, 255, 255, 0.8);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 100;
  border-radius: 0.375rem;
}

.panel {
  display: flex;
  flex-direction: column;
  overflow-y: auto; /* Changed from hidden to auto */
  scrollbar-width: none;
}

/* New class to wrap panel content */
.panel-content {
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  min-height: 90%;
  overflow: auto;
  scrollbar-width: none;
}

.catalogs-panel {
  position: relative;
  flex: 1;
}

.products-panel {
  flex: 1;
}
.products-panel .tag-placeholder__custom {
  margin-top: 1rem;
  margin-left: 1rem;
}
.products-panel .product-grid .tag-placeholder {
  grid-column: 1/-1;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100%;
}

.external-products-panel {
  flex: 1;
}
.external-products-panel .product-details-content {
  flex: 1;
  display: flex;
  flex-direction: column;
}
.external-products-panel .product-details-content > .product-grid {
  flex: 1;
}
.external-products-panel .product-grid .tag-placeholder {
  grid-column: 1/-1;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100%;
}

/* Updated panel-header to be part of the sticky container */
.panel-header {
  font-size: 1rem;
  font-weight: 600;
  color: #363636;
  margin: 0;
  padding: 1rem 1rem 0.5rem; /* Adjusted padding */
  border-bottom: 1px solid #dfdfdf;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* New class for the sticky header container */
.sticky-header {
  position: sticky;
  top: 0;
  z-index: 10;
  background-color: #fff;
}

.search-wrapper {
  padding: 0.5rem 1rem 1rem;
  border-bottom: 1px solid #dfdfdf;
}

.placeholder {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  color: #666;
  background-color: #f6f6f6;
  border-radius: 0.375rem;
  padding: 1.25rem;
  text-align: center;
}

/* This ensures the reused ProductCard fits well into a grid */
.product-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
  gap: 1rem;
  align-content: start;
  position: relative;
}

.embedding-external-catalogs__container {
  gap: 1rem;
  display: flex;
  align-items: flex-start;
  gap: 1rem;
}
.embedding-external-catalogs__container .dropdown {
  position: relative;
}
.embedding-external-catalogs__container .dropdown-wrapper {
  margin-top: 0;
  position: relative;
  width: 18rem;
  min-width: 16rem;
}
.embedding-external-catalogs__container .m-dropdown__info-icon {
  align-self: center;
  margin-top: 0.5rem;
}
.embedding-external-catalogs__container .dropdown-wrapper {
  left: 0;
}
.embedding-external-catalogs__container .dropdown-button {
  padding: 0.5rem;
}
.embedding-external-catalogs__container .tooltip-container {
  position: absolute;
  right: 7rem;
  top: 8rem;
}

.borwser-header {
  background-color: #f9f9f9;
  height: 4.2rem;
  border-bottom: 1px solid #dfdfdf;
}
.borwser-header .search-input {
  width: 75%;
}
.borwser-header .header-title {
  font-weight: 500;
  padding-top: 1rem;
}
.borwser-header .actions {
  padding-top: 1rem;
}
.borwser-header .search-input {
  margin-top: 1rem;
}

.product-grid,
.panel {
  background-color: #f9f9f9;
}

.product-entry.is-selected:not(.is-pending-addition) {
  border-left: 0.25rem solid #da0000;
}

.product-entry.is-focused-from-detail {
  background-color: rgba(79, 70, 229, 0.1);
  border-color: #4f46e5;
}

.catalog-entry.is-external {
  /* This provides the positioning context for the label */
  position: relative;
}

.catalog-entry.is-locked-catalog {
  opacity: 0.7;
  position: relative;
}
.catalog-entry.is-unsaved {
  position: relative;
  overflow: hidden;
  background-color: #fefce8;
  border-left: 3px solid #da0000;
}
.catalog-entry.is-unsaved .remove-btn {
  visibility: hidden;
}
.catalog-entry.is-unsaved .item-content {
  opacity: 0.8;
}
.catalog-entry.is-pending-unlink {
  background-color: #ffc5c5;
  border-left: none;
  opacity: 0.8;
  position: relative;
}
.catalog-entry.is-pending-unlink .remove-btn {
  visibility: hidden;
}
.catalog-entry.is-pending-unlink .item-name {
  text-decoration: line-through;
  color: #7f1d1d;
}
.catalog-entry.is-hovered-from-draft {
  outline: 2px solid #da0000;
  outline-offset: 2px;
  background-color: #dbeafe;
  transition: outline 0.15s ease-out, background-color 0.15s ease-out;
}

.catalog-entry .external-indicator-label {
  position: absolute;
  top: 0.375rem;
  right: 0.375rem;
  background-color: var(--color-primary);
  color: #da0000;
  padding: 3px 0.4375rem;
  font-size: 0.625rem;
  font-weight: 700;
  line-height: 1;
  border-radius: 0.625rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.catalog-entry .external-indicator-icon {
  position: absolute;
  top: 0.375rem;
  right: 0.375rem;
  color: #888;
  width: 1rem;
  height: 1rem;
}

.catalog-filter-slider {
  position: sticky;
  top: 0;
  z-index: 9;
  background-color: #fff;
  padding: 0.5rem;
  box-shadow: 0 2px 0.5rem rgba(0, 0, 0, 0.06);
  display: flex;
  align-items: center;
  border-radius: 6.1875rem;
}
.catalog-filter-slider .active-filter-pill {
  position: absolute;
  top: 0.25rem;
  bottom: 0.25rem;
  width: calc((100% - 1rem) / 3);
  background-color: #fff;
  border-radius: 6.1875rem;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.06);
  transition: left 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}
.catalog-filter-slider.filter-is-all .active-filter-pill {
  left: 0.5rem;
}
.catalog-filter-slider.filter-is-internal .active-filter-pill {
  left: calc((100% - 1rem) / 3 + 0.5rem);
}
.catalog-filter-slider.filter-is-external .active-filter-pill {
  left: calc(2 * (100% - 1rem) / 3 + 0.5rem);
}
.catalog-filter-slider .filter-button {
  flex: 1 1 0%;
  text-align: center;
  padding: 0.375rem 0.5rem;
  border: none;
  background: none;
  font-size: 0.9rem;
  font-weight: 500;
  color: #888;
  position: relative;
  z-index: 1;
  cursor: pointer;
  transition: color 0.25s ease-out;
}
.catalog-filter-slider .filter-button.is-active {
  color: #363636;
  font-weight: 600;
}

/* --- GLOBAL & REUSABLE COMPONENTS --- */
.dnd-tooltip {
  position: fixed;
  z-index: 9999;
  padding: 0.25rem 0.625rem;
  background-color: #000;
  color: #fff;
  border-radius: 0.375rem;
  font-size: 0.8rem;
  font-weight: 500;
  white-space: nowrap;
  pointer-events: none;
  transition: opacity 0.15s ease-in-out;
  opacity: 1;
}
.dnd-tooltip.is-hidden {
  opacity: 0;
  visibility: hidden;
}

.visibility-indicator {
  width: 0.625rem;
  height: 0.625rem;
  border-radius: 50%;
  flex-shrink: 0;
  background-color: #4f46e5;
}
.visibility-indicator.has-draft-changes {
  background-color: #f59e0b;
}

.tag-edit-input {
  width: 100%;
  padding: 2px 0.25rem;
  border: 1px solid #da0000;
  border-radius: 0.25rem;
  background-color: #fff;
  font-size: inherit;
  font-weight: inherit;
  outline: none;
}

.embedding-filters-container {
  width: 100%;
}

.configurator-filter {
  padding: 0 1rem;
  padding-left: 0;
  padding-right: 0;
}
.configurator-filter .preview-catalog-title {
  margin-bottom: 0.5rem;
  font-size: 0.9rem;
  font-weight: 100;
}
.configurator-filter .c-select {
  margin: 0 auto;
}

.resizable-panel {
  position: relative;
  overflow: hidden;
}
.resizable-panel__content {
  height: 100%;
  padding-bottom: 0.625rem;
}
.resizable-panel__resize-handle {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 0.625rem;
  cursor: ns-resize;
  background-color: #f4f4f4;
  border-top: 1px solid #e7e7e7;
  border-bottom-left-radius: 2px;
  border-bottom-right-radius: 2px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.resizable-panel__resize-handle::after {
  content: "•••";
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  color: #979797;
  letter-spacing: 2px;
}

/* --- PUBLISH CONTROLS & STATUS --- */
.publish-controls-wrapper {
  display: flex;
  width: 100%;
  align-items: center;
  border-bottom: 1px solid #e7e7e7;
}

.publish-controls {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 0.75rem 1.25rem;
  border-bottom: 1px solid #e7e7e7;
}
.publish-controls .rubens-button--primary {
  margin-left: auto;
}

.publish-status {
  flex-grow: 1;
}

.publish-status__center {
  margin-left: 8rem;
}

.publish-actions {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.status-indicator {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.375rem 0.75rem;
  border-radius: 9999px;
  font-size: 0.8rem;
  font-weight: 600;
  cursor: pointer;
}
.status-indicator svg {
  width: 1.3rem;
  height: 1.3rem;
}
.status-indicator.is-dirty {
  color: #da0000;
}
.status-indicator.is-dirty svg {
  fill: #da0000;
}
.status-indicator.is-dirty::before {
  background-color: #f59e0b;
  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}
.status-indicator.is-published {
  color: #da0000;
  background-color: #fff;
  border: 1px solid #da0000;
}
.status-indicator.is-published::before {
  background-color: #da0000;
}

.change-count-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  height: 22px;
  border-radius: 9999px;
  color: #da0000;
  background-color: #fef3c7;
  font-size: 0.75rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  box-shadow: 0 0 0 2px #fff;
  cursor: pointer;
}
.change-count-badge:hover {
  text-decoration: underline;
}

.version-update-chooser {
  display: flex;
  gap: 1rem;
  padding: 0.375rem 0.75rem;
  margin-right: 0.75rem;
  background-color: #e7e7e7;
  border-radius: 0.5rem;
}
.version-update-chooser label {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.9rem;
  font-weight: 500;
  color: #666;
  cursor: pointer;
}

.commit-input-wrapper {
  display: flex;
  align-items: center;
  position: relative;
  width: 27rem;
  max-width: 100%;
}

.commit-input-dropdown-container {
  position: relative;
  margin-top: 1rem;
}
.commit-input-dropdown-container .c-select .spacer {
  display: none;
}

.commit-input-dropdown-trigger {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  height: 40px;
  padding: 0 0.75rem;
  margin-right: 0;
  background-color: transparent;
  border: 1px solid #dfdfdf;
  border-right: none;
  font-size: 0.9rem;
  font-weight: 500;
  color: #363636;
  cursor: pointer;
  transition: background-color 0.2s;
}
.commit-input-dropdown-trigger:hover {
  background-color: #e7e7e7;
}
.commit-input-dropdown-trigger svg {
  width: 1rem;
  height: 1rem;
  color: #666;
  transform: rotate(90deg);
}

.commit-input-textfield {
  flex-grow: 1;
  height: 40px;
  padding: 0 0.75rem;
  border: 1px solid #dfdfdf;
  border-left: 0;
  background-color: transparent;
  font-size: 0.9rem;
  box-sizing: border-box;
  margin-bottom: 0.5rem;
}
.commit-input-textfield:focus {
  z-index: 1;
  border-color: #da0000;
  outline: 2px solid #da0000;
  outline-offset: -1px;
}

.commit-input-dropdown-menu {
  position: absolute;
  top: calc(100% - 0.9rem);
  left: 0;
  z-index: 10;
  width: 200px;
  overflow: hidden;
  padding: 4px;
  background-color: #fff;
  border: 1px solid #e7e7e7;
  box-shadow: 0 4px 0.75rem rgba(0, 0, 0, 0.1);
  box-sizing: border-box;
}
.commit-input-dropdown-menu button {
  display: block;
  width: 100%;
  padding: 0.5rem 0.75rem;
  margin: 0;
  border: none;
  border-radius: 0.375rem;
  background: none;
  font-size: 0.8rem;
  color: #363636;
  text-align: left;
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.commit-input-dropdown-menu button:hover {
  background-color: #f6f6f6;
}
.commit-input-dropdown-menu button strong {
  margin-right: 0.375rem;
  font-weight: 600;
}

/* --- PUBLISH HISTORY --- */
.history-section {
  margin-top: 2rem;
  border: 1px solid #e7e7e7;
  border-radius: 0.75rem;
  background-color: #fafafa;
}

.history-toggle {
  margin-left: 1rem;
}

.toggle-visibility-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  padding: 4px;
  background: none;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  transition: background-color 0.2s, transform 0.2s;
  outline: none;
}
.toggle-visibility-btn.is-open {
  transform: rotate(180deg);
}

.history-collapser {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.35s ease-in-out;
  margin-top: 1.3rem;
}
.history-collapser.is-expanded {
  grid-template-rows: 1fr;
}

.history-content-inner {
  overflow: hidden;
}

/* --- LAST PUBLISH INFO & INDICATORS --- */
.published-indicator-block .published-indicator {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  width: auto;
  max-width: 13rem;
  padding: 0.375rem;
  border-radius: 0.375rem;
  background: #3dac43;
  color: #fff;
  font-size: 0.75rem;
  font-weight: bold;
  line-height: 1;
  vertical-align: middle;
}
.published-indicator-block .published-indicator svg {
  width: 1.3rem;
  height: 1.3rem;
  fill: #fff;
}

.last-publish-info {
  display: flex;
  align-items: center;
  margin-left: 0.5rem;
}

.version-type-badge {
  padding: 3px 0.625rem;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  white-space: nowrap;
}
.version-type-badge.is-type-patch {
  background-color: #dbeafe;
  color: #4f46e5;
}
.version-type-badge.is-type-minor {
  background-color: #dbeafe;
  color: #3dac43;
}
.version-type-badge.is-type-major {
  background-color: #ffc5c5;
  color: #da0000;
}

.commit-message-brief,
.publish-date-brief {
  display: flex;
  align-items: center;
  color: #666;
}
.commit-message-brief svg,
.publish-date-brief svg {
  width: 15px;
  height: 15px;
  flex-shrink: 0;
  color: #888;
}
@media screen and (max-width: 1300px) {
  .commit-message-brief .publish-date-brief,
  .publish-date-brief .publish-date-brief {
    display: hidden;
  }
}

.commit-message-brief span {
  position: relative;
  overflow: hidden;
  max-width: 300px;
  padding: 0 0.375rem;
  color: #363636;
  font-style: normal;
  font-weight: 500;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.commit-message-brief span::before, .commit-message-brief span::after {
  position: absolute;
  top: 0;
  color: #888;
  font-weight: bold;
}
.commit-message-brief span::before {
  content: "“";
  left: -5px;
}
.commit-message-brief span::after {
  content: "”";
  right: -5px;
}

/* --- LOCK BANNER & TABLE STYLES --- */
.table-locked .tag-columns,
.table-locked .product-column {
  opacity: 0.5;
  pointer-events: none;
  cursor: not-allowed;
}

.lock-banner {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 0.75rem 1rem;
  margin-bottom: 1rem;
  background-color: #fefce8;
  border: 1px solid #fef08a;
  border-radius: 0.625rem;
}

.lock-icon-wrapper {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #fef3c7;
  color: #a16207;
}
.lock-icon-wrapper svg {
  width: 1.25rem;
  height: 1.25rem;
}

.lock-banner-text {
  display: flex;
  flex-direction: column;
}
.lock-banner-text strong {
  color: #854d0e;
  font-size: 1rem;
  font-weight: 600;
}
.lock-banner-text span {
  color: #a16207;
  font-size: 0.8rem;
}
.lock-banner-text span b {
  font-weight: 600;
}

/* --- TAG LIST TOOLTIP --- */
.tag-list-tooltip {
  min-width: 200px;
  text-align: left;
}
.tag-list-tooltip .tooltip-title {
  display: block;
  padding-bottom: 0.375rem;
  margin-bottom: 0.5rem;
  border-bottom: 1px solid #363636;
  font-weight: 600;
}
.tag-list-tooltip .no-links-text {
  font-style: italic;
  color: #979797;
}

.tag-list-tooltip__list {
  padding: 0;
  margin: 0;
  list-style: none;
  max-height: 150px;
  overflow-y: auto;
  scrollbar-width: thin;
}
.tag-list-tooltip__list li {
  padding: 0.25rem 0;
}
.tag-list-tooltip__list::-webkit-scrollbar {
  width: 0.375rem;
}
.tag-list-tooltip__list::-webkit-scrollbar-track {
  background: transparent;
}
.tag-list-tooltip__list::-webkit-scrollbar-thumb {
  background-color: #666;
  border-radius: 0.375rem;
}

.product-column.has-active-selection {
  box-shadow: inset 0 0 0 0.125rem #da0000;
  background-color: rgba(218, 0, 0, 0.05);
}

.multi-drag-badge {
  position: absolute;
  top: -0.5rem;
  right: -0.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 1.5rem;
  height: 1.5rem;
  padding: 0 0.375rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #fff;
  background-color: #ef4444;
  border-radius: 9999px;
  border: 0.125rem solid #fff;
  box-shadow: 0 0.125rem 0.3125rem rgba(0, 0, 0, 0.2);
}

.multi-drag-image-generic {
  position: relative;
  display: flex;
  align-items: center;
  gap: 0.625rem;
  background-color: #4f46e5;
  color: #fff;
  padding: 0.5rem 1rem;
  border-radius: 0.5rem;
  box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.2);
  font-size: 0.875rem;
  font-weight: 600;
  white-space: nowrap;
}

.multi-drag-image__icon {
  width: 1.25rem;
  height: 1.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.multi-drag-image__icon svg {
  width: 100%;
  height: 100%;
}

.mouse-selection-overlay {
  position: absolute;
  border: 0.125rem dashed #007acc;
  background-color: rgba(0, 122, 204, 0.1);
  pointer-events: none;
  z-index: 1000;
  border-radius: 0.25rem;
  box-sizing: border-box;
}

.column-selecting {
  user-select: none;
  cursor: crosshair;
}

.item-entry.selection-intersecting {
  background-color: rgba(0, 122, 204, 0.2);
  border-color: #007acc;
}

.l1-tags,
.l2-tags,
.product-column {
  position: relative;
}

.l1-tags:active,
.l2-tags:active,
.product-column:active {
  user-select: none;
}

.tag-entry-wrapper {
  position: relative;
  margin: 0.25rem 0;
}
.tag-entry-wrapper:first-child .tag-insertion-zone.before {
  display: none;
}
.tag-entry-wrapper:last-child .tag-insertion-zone.after {
  top: 100%;
  margin-top: -0.375rem;
}

.tag-insertion-zone {
  position: absolute;
  top: -0.375rem;
  left: 0;
  right: 0;
  height: 0.75rem;
  z-index: 5;
  cursor: pointer;
}
.tag-insertion-zone:hover .insertion-indicator {
  opacity: 1;
}
.tag-insertion-zone:last-child .insertion-indicator {
  top: 1rem;
}

.insertion-indicator {
  position: absolute;
  top: 8%;
  left: 44%;
  transform: translate(-50%, -50%);
  opacity: 0;
  transition: opacity 0.2s ease;
  z-index: 10;
  pointer-events: none;
  width: 89%;
}
.insertion-indicator:hover {
  opacity: 1;
}

.insertion-plus {
  background: #bdbdbd;
  color: #fff;
  border: none;
  border-radius: 50%;
  width: 1rem;
  height: 1rem;
  font-size: 0.75rem;
  line-height: 1;
  cursor: pointer;
  pointer-events: auto;
  position: relative;
  z-index: 11;
}
.insertion-plus:hover {
  background-color: #bdbdbd;
}

.insertion-line {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: 2px;
  background-color: #bdbdbd;
  width: 82%;
  z-index: 9;
}
.insertion-line::before {
  content: "+";
  background: #bdbdbd;
  color: #fff;
  border-radius: 50%;
  width: 1rem;
  height: 1rem;
  font-size: 0.65rem;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  pointer-events: auto;
  position: relative;
  z-index: 11;
  top: -0.5rem;
}

.l2-tags {
  display: block;
}
.l2-tags.is-disabled {
  opacity: 0.6;
  pointer-events: none;
}
.l2-tags.is-hidden {
  display: none;
  pointer-events: none;
}

.tag-content-disabled {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 2rem;
  text-align: center;
  height: 12.5rem;
}
.tag-content-disabled .disabled-icon {
  margin-bottom: 1rem;
  opacity: 0.5;
}
.tag-content-disabled h3 {
  margin-bottom: 0.5rem;
  color: #888;
}
.tag-content-disabled p {
  color: #666;
  max-width: 15.625rem;
}

.table-columns .scrollable-columns {
  display: grid;
  transition: grid-template-columns 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.table-columns.l2-visible .scrollable-columns {
  grid-template-columns: 0.9fr 1.3fr 0.9fr;
}

.table-columns.l2-hidden .scrollable-columns {
  grid-template-columns: 0.9fr 1.3fr 0.9fr;
}

.l2-floating-toggle {
  position: fixed;
  bottom: 1.5rem;
  right: 1.5rem;
  width: 3rem;
  height: 3rem;
  background: #da0000;
  color: #fff;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.15);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
}
.l2-floating-toggle:hover {
  transform: translateY(-2px);
  box-shadow: 0 0.375rem 1.25rem rgba(0, 0, 0, 0.2);
}

.l2-toggle-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border: none;
  border-radius: 0.25rem;
  cursor: pointer;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  overflow: hidden;
}
.l2-toggle-btn svg {
  width: 1rem;
  height: 1rem;
}
.l2-toggle-btn.active {
  color: #fff;
}
.l2-toggle-btn.active:hover {
  transform: translateY(-1px);
}
.l2-toggle-btn.inactive {
  background: #f7f7f7;
  color: #888;
  border: 1px dashed #dfdfdf;
}
.l2-toggle-btn.inactive:hover {
  background: #e7e7e7;
  color: #363636;
  border-style: solid;
  transform: translateY(-1px);
}
.l2-toggle-btn:hover .toggle-icon {
  transform: scale(1.1);
}

.toggle-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.2s ease;
}
.toggle-icon svg {
  fill: #000;
  width: 1rem;
  height: 1rem;
}

.embedding-table__header .actions-menu-btn svg,
.embedding-table__header .m-drop-actions__item svg {
  width: 1rem;
  height: 1rem;
  margin-top: 0.1rem;
}
.embedding-table__header button:not(.btn-small) {
  background-color: transparent;
  margin: 0;
  padding: 0;
  border: 0;
  outline: none;
}
.embedding-table__header .actions-menu-container {
  position: relative;
  display: inline-block;
}
.embedding-table__header .actions-menu-container .m-drop-actions__container {
  position: absolute;
  top: 100%;
  right: -10px;
  margin-top: 8px;
  z-index: 200;
  width: 16rem;
  background-color: #f9f9f9;
  border-right: 1px solid #dfdfdf;
}
.embedding-table__header .actions-menu-container .m-drop-actions__container::before {
  content: "";
  position: absolute;
  top: -0.4375rem;
  right: 0.7rem;
  border-left: 0.5rem solid transparent;
  border-right: 0.5rem solid transparent;
  border-bottom: 0.5rem solid #f9f9f9;
  filter: drop-shadow(0 -1px 1px rgba(0, 0, 0, 0.1));
}

.catalog-entry.multi-selected:not(.selected) {
  opacity: 0.8;
}

.selection-count {
  font-size: 0.875rem;
  font-weight: normal;
  margin-left: 0.5rem;
}

.publish-controls-wrapper--sidebar {
  border-bottom: none;
  width: 100%;
}

.publish-controls-sidebar {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 100%;
}

.publish-controls-sidebar--no-history {
  gap: 0;
}

.publish-status-sidebar {
  width: 100%;
}
.publish-status-sidebar .status-card {
  padding: 1rem;
  border-radius: 2px;
  border: 1px solid #dfdfdf;
  background: #fff;
  transition: all 0.2s ease;
}
.publish-status-sidebar .status-card.is-dirty {
  background: #fefce8;
  border-color: #fef3c7;
  cursor: pointer;
}
.publish-status-sidebar .status-card.is-dirty:hover {
  box-shadow: 0 2px 8px rgba(161, 98, 7, 0.15);
  transform: translateY(-1px);
}
.publish-status-sidebar .status-header {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}
.publish-status-sidebar .status-header .status-icon {
  font-size: 1.25rem;
  line-height: 1;
}
.publish-status-sidebar .status-header .status-title {
  font-size: 0.9rem;
  font-weight: 600;
  color: #363636;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.publish-status-sidebar .change-count-badge-large {
  display: block;
  align-items: center;
  justify-content: center;
  padding: 0.5rem 1rem;
  color: #666;
  font-size: 0.8rem;
  border: 1px solid #dfdfdf;
  font-weight: 400;
  width: 57%;
  margin: 0 auto;
  height: 2.3rem;
  text-align: center;
  box-sizing: border-box;
  border-radius: 2px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.publish-status-sidebar .change-count-badge-large.is-active {
  border-color: #da0000;
  background-color: #da0000;
  color: #fff;
}
.publish-status-sidebar .version-info-compact {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  font-size: 0.8rem;
}
.publish-status-sidebar .version-info-compact .version-badge-row {
  display: flex;
  justify-content: flex-start;
}
.publish-status-sidebar .version-info-compact .version-type-badge {
  display: inline-block;
  padding: 0.25rem 0.625rem;
  font-size: 0.7rem;
  border-radius: 0.25rem;
}
.publish-status-sidebar .version-info-compact .commit-message-compact,
.publish-status-sidebar .version-info-compact .publish-date-compact {
  display: flex;
  align-items: flex-start;
  gap: 0.375rem;
  color: #666;
  padding: 0.25rem 0;
}
.publish-status-sidebar .version-info-compact .commit-message-compact svg,
.publish-status-sidebar .version-info-compact .publish-date-compact svg {
  width: 0.875rem;
  height: 0.875rem;
  flex-shrink: 0;
  fill: none;
  stroke: #000;
}
.publish-status-sidebar .version-info-compact .commit-message-compact span,
.publish-status-sidebar .version-info-compact .publish-date-compact span {
  overflow: visible;
  white-space: wrap;
  font-size: 0.8rem;
}
.publish-status-sidebar .version-info-compact .commit-message-compact {
  font-style: italic;
}

.publish-actions-sidebar {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  width: 100%;
}
.publish-actions-sidebar .commit-input-wrapper {
  width: 100%;
  max-width: none;
  flex-direction: column;
}
.publish-actions-sidebar .commit-input-wrapper .commit-input-dropdown-container {
  width: 100%;
}
.publish-actions-sidebar .commit-input-wrapper .commit-input-dropdown-trigger {
  width: 100%;
  border-right: 1px solid #dfdfdf;
  margin-bottom: 0.5rem;
  justify-content: space-between;
  margin: 0;
  margin-bottom: 1rem;
}
.publish-actions-sidebar .commit-input-wrapper .commit-input-textfield {
  width: 100%;
  border-left: 1px solid #dfdfdf;
}
.publish-actions-sidebar .action-buttons-stack {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  width: 100%;
  margin-bottom: 0rem;
}
.publish-actions-sidebar .action-buttons-stack button {
  width: initial;
  justify-content: center;
}

.sidebar-actions-no-history {
  margin-bottom: 1rem;
}

.sidebar-divider__custom {
  background-color: #e7e7e7;
  border-color: #e7e7e7;
}

.sidebar-toggles {
  display: flex;
  width: 100%;
  gap: 0.5rem;
}

.sidebar-toggle-btn {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  padding: 0.625rem;
  background: #fff;
  border: 1px solid #dfdfdf;
  border-radius: 2px;
  font-size: 0.8rem;
  font-weight: 500;
  color: #666;
  cursor: pointer;
  transition: all 0.2s ease;
  height: 2.3rem;
  margin: 0;
  outline: none;
}
.sidebar-toggle-btn svg {
  width: 0.9rem;
  height: 0.9rem;
}
.sidebar-toggle-btn span {
  font-size: 0.8rem;
}
.sidebar-toggle-btn:hover {
  background: #e7e7e7;
  border-color: #bdbdbd;
}
.sidebar-toggle-btn.is-active {
  background: #da0000;
  color: #fff;
  border-color: #da0000;
}
.sidebar-toggle-btn.is-active svg {
  color: #fff;
  fill: #fff;
}

.sidebar-toggle-btn__custom svg {
  width: 0.9rem;
  height: 0.9rem;
}

.preview-catalog-btn {
  font-size: 1rem;
  margin-left: 0;
  width: 100%;
}

.catalog-column.has-multiple-selection .catalog-entry,
.catalog-column.column-focused .catalog-entry,
.l1-tags .tag-entry.multi-selected,
.l1-tags.column-focused .tag-entry,
.l2-tags .tag-entry.multi-selected,
.l2-tags.column-focused .tag-entry {
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}

.sticky-message__container {
  position: sticky;
  top: 5.725rem;
  z-index: 9999;
  min-height: 4rem;
  margin-top: -4rem;
}

@media (max-width: 280px) {
  .sidebar-toggles {
    flex-direction: column;
  }
  .sidebar-toggle-btn span {
    display: none;
  }
}
@media only screen and (max-width: 1328px) {
  .sidebar-toggles {
    flex-direction: column;
  }
}
.publish-history-panel {
  display: flex;
  flex-direction: column;
  height: auto;
  max-height: 37.5rem;
  background-color: #f9f9f9;
  border-radius: 2px;
  overflow: hidden;
  margin-top: 1.3rem;
}
.publish-history-panel .panel-header {
  display: flex;
  align-items: center;
  padding: 1.25rem 1.5rem;
  background: linear-gradient(135deg, #fff 0%, #f7f7f7 100%);
  border-bottom: 1px solid #e7e7e7;
}
.publish-history-panel .panel-header .panel-title {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin: 0;
  color: #363636;
  font-size: 1.125rem;
  font-weight: 700;
  letter-spacing: -0.025em;
}
.publish-history-panel .panel-header .panel-icon {
  width: 1.25rem;
  height: 1.25rem;
  color: #4f46e5;
}
.publish-history-panel .panel-loading-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  padding: 4rem 2rem;
}
.publish-history-panel .panel-loading-state .loading-text {
  color: #888;
  font-size: 0.875rem;
}
.publish-history-panel .history-container {
  flex: 1;
  overflow-y: auto;
  padding: 1rem;
}
.publish-history-panel .history-container::-webkit-scrollbar {
  width: 0.375rem;
}
.publish-history-panel .history-container::-webkit-scrollbar-track {
  background: #f7f7f7;
}
.publish-history-panel .history-container::-webkit-scrollbar-thumb {
  background: #bdbdbd;
  border-radius: 0.1875rem;
}
.publish-history-panel .history-container::-webkit-scrollbar-thumb:hover {
  background: #888;
}
.publish-history-panel .history-card {
  margin-bottom: 0.75rem;
  background: #fff;
  border-radius: 0.5rem;
  border: 1px solid #e7e7e7;
  transition: all 0.2s ease;
}
.publish-history-panel .history-card:hover {
  border-color: #bdbdbd;
}
.publish-history-panel .history-card.is-expanded {
  border-color: #4f46e5;
}
.publish-history-panel .history-card.is-latest {
  border-color: #4f46e5;
}
.publish-history-panel .history-card-header {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.25rem;
  background: none;
  border: none;
  cursor: pointer;
  text-align: left;
  transition: background-color 0.15s ease;
  box-sizing: border-box;
}
.publish-history-panel .history-card-header:hover {
  background-color: rgba(255, 255, 255, 0.55);
}
.publish-history-panel .version-info {
  flex: 1;
  min-width: 0;
}
.publish-history-panel .version-badges {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
}
.publish-history-panel .version-number {
  display: inline-flex;
  align-items: center;
  padding: 0.25rem 0.75rem;
  background: #363636;
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  border-radius: 0.4rem;
  letter-spacing: 0.025em;
}
.publish-history-panel .version-type {
  display: inline-flex;
  align-items: center;
  padding: 0.125rem 0.5rem;
  font-size: 0.625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  border-radius: 999px;
}
.publish-history-panel .version-type-patch {
  background: #dbeafe;
  color: #363636;
}
.publish-history-panel .version-type-minor {
  background: #fef08a;
  color: #363636;
}
.publish-history-panel .version-type-major {
  background: #ffc5c5;
  color: #7f1d1d;
}
.publish-history-panel .latest-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.125rem 0.5rem;
  background: linear-gradient(135deg, #4f46e5 0%, #4f46e5 100%);
  color: #fff;
  font-size: 0.625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  border-radius: 999px;
}
.publish-history-panel .version-details .commit-message {
  margin: 0 0 0.5rem 0.5rem;
  color: #666;
  font-size: 0.8rem;
  white-space: wrap;
  font-style: italic;
  line-height: 1.4;
}
.publish-history-panel .version-meta {
  display: flex;
  align-items: center;
  gap: 1rem;
  color: #888;
  font-size: 0.8125rem;
}
.publish-history-panel .version-meta .author,
.publish-history-panel .version-meta .date {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  color: rgb(102, 102, 102);
  white-space: normal;
}
.publish-history-panel .version-meta .meta-icon {
  width: 0.875rem;
  height: 0.875rem;
  opacity: 0.6;
}
.publish-history-panel .version-actions {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.publish-history-panel .change-summary {
  display: flex;
  gap: 0.375rem;
}
.publish-history-panel .change-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.5rem;
  padding: 0.125rem 0.375rem;
  font-size: 0.75rem;
  font-weight: 600;
  border-radius: 0.4rem;
}
.publish-history-panel .change-badge-add {
  background: #fef08a;
  color: #363636;
}
.publish-history-panel .change-badge-edit {
  background: #dbeafe;
  color: #363636;
}
.publish-history-panel .change-badge-remove {
  background: #ffc5c5;
  color: #7f1d1d;
}
.publish-history-panel .expand-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  color: #888;
  transition: transform 0.2s ease;
}
.publish-history-panel .expand-icon svg {
  width: 1rem;
  height: 1rem;
}
.publish-history-panel .expand-icon.is-expanded {
  transform: rotate(180deg);
}
.publish-history-panel .history-card-body {
  padding: 0 1.25rem 1.25rem;
  animation: slideDown 0.2s ease;
}
@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-0.5rem);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.publish-history-panel .changes-section {
  margin-bottom: 1rem;
}
.publish-history-panel .section-title {
  margin: 0 0 0.75rem 0;
  color: #666;
  font-size: 0.8125rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.publish-history-panel .command-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.publish-history-panel .command-item {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 0.75rem;
  background: #f9f9f9;
  border-radius: 0.4rem;
  border-left: 0.1875rem solid transparent;
  transition: all 0.15s ease;
}
.publish-history-panel .command-item:hover {
  background: #f7f7f7;
}
.publish-history-panel .command-item.command-success {
  border-left-color: #4f46e5;
}
.publish-history-panel .command-item.command-success .command-icon-wrapper {
  background: #fef08a;
  color: #363636;
}
.publish-history-panel .command-item.command-info {
  border-left-color: #4f46e5;
}
.publish-history-panel .command-item.command-info .command-icon-wrapper {
  background: #dbeafe;
  color: #363636;
}
.publish-history-panel .command-item.command-danger {
  border-left-color: #df0300;
}
.publish-history-panel .command-item.command-danger .command-icon-wrapper {
  background: #ffc5c5;
  color: #7f1d1d;
}
.publish-history-panel .command-item.command-neutral {
  border-left-color: #888;
}
.publish-history-panel .command-item.command-neutral .command-icon-wrapper {
  background: #eee;
  color: #666;
}
.publish-history-panel .command-icon-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 2rem;
  height: 2rem;
  border-radius: 0.4rem;
}
.publish-history-panel .command-icon-wrapper .command-icon {
  width: 1.125rem;
  height: 1.125rem;
}
.publish-history-panel .command-content {
  flex: 1;
  min-width: 0;
}
.publish-history-panel .command-action {
  color: #363636;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.4;
}
.publish-history-panel .command-details {
  margin-top: 0.25rem;
  color: #888;
  font-size: 0.8125rem;
  line-height: 1.4;
}
.publish-history-panel .card-actions {
  display: flex;
  justify-content: flex-end;
  padding-top: 1rem;
  margin-top: 1rem;
  border-top: 1px solid #e7e7e7;
}
.publish-history-panel .action-button {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  border: 1px solid transparent;
  border-radius: 2px;
  font-size: 0.8rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.15s ease;
}
.publish-history-panel .action-button .button-icon {
  width: 1rem;
  height: 1rem;
}
.publish-history-panel .action-button-danger {
  background: #da0000;
  color: #fff;
  border-color: #ea6363;
}
.publish-history-panel .action-button-danger svg {
  fill: #fff;
}
.publish-history-panel .action-button-danger:hover:not(:disabled) {
  background: #ea6363;
  border-color: #df0300;
}
.publish-history-panel .action-button-danger:active:not(:disabled) {
  background: #da0000;
}
.publish-history-panel .action-button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.publish-history-panel .empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 4rem 2rem;
  text-align: center;
}
.publish-history-panel .empty-state .empty-icon {
  width: 3rem;
  height: 3rem;
  margin-bottom: 1rem;
  color: #bdbdbd;
}
.publish-history-panel .empty-state h4 {
  margin: 0 0 0.5rem 0;
  color: #666;
  font-size: 1.125rem;
  font-weight: 600;
}
.publish-history-panel .empty-state p {
  margin: 0;
  color: #888;
  font-size: 0.875rem;
}
@media (max-width: 40rem) {
  .publish-history-panel .version-meta {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.375rem;
  }
  .publish-history-panel .change-summary {
    display: none;
  }
  .publish-history-panel .command-item {
    padding: 0.625rem;
  }
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.draft-summary-panel {
  margin-bottom: 1.5rem;
  background: #fff;
  border-radius: 2px;
  box-shadow: 0 0.25rem 0.375rem -0.0625rem rgba(0, 0, 0, 0.1), 0 0.125rem 0.25rem -0.0625rem rgba(0, 0, 0, 0.06);
  overflow: hidden;
  border: 1px solid #e7e7e7;
}
.draft-summary-panel .draft-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.25rem 0.5rem;
  background: linear-gradient(135deg, #f9f9f9 0%, #f7f7f7 100%);
  border-bottom: 1px solid #e7e7e7;
}
.draft-summary-panel .draft-header-content {
  flex: 1;
}
.draft-summary-panel .draft-title-section {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.375rem;
}
.draft-summary-panel .draft-title {
  display: block;
  gap: 0.5rem;
  margin: 0;
  color: #363636;
  font-size: 1.125rem;
  font-weight: 700;
  letter-spacing: -0.025em;
}
.draft-summary-panel .draft-icon {
  width: 1.25rem;
  height: 1.25rem;
  color: #4f46e5;
}
.draft-summary-panel .draft-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.75rem;
  padding: 0.125rem 0.5rem;
  background-color: #888;
  color: #fff;
  font-size: 0.875rem;
  font-weight: 700;
  border-radius: 999px;
}
.draft-summary-panel .draft-subtitle {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
  color: #888;
  font-size: 0.875rem;
}
.draft-summary-panel .subtitle-icon {
  width: 0.875rem;
  height: 0.875rem;
  opacity: 0.7;
}
.draft-summary-panel .stat-badge {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.375rem 0.75rem;
  font-size: 0.875rem;
  font-weight: 600;
  border-radius: 0.4rem;
}
.draft-summary-panel .stat-badge .stat-icon {
  width: 0.875rem;
  height: 0.875rem;
}
.draft-summary-panel .stat-badge-add {
  background: #fef08a;
  color: #363636;
}
.draft-summary-panel .stat-badge-edit {
  background: #dbeafe;
  color: #363636;
}
.draft-summary-panel .stat-badge-remove {
  background: #ffc5c5;
  color: #7f1d1d;
}
.draft-summary-panel .draft-content {
  position: relative;
}
.draft-summary-panel .draft-command-list {
  margin: 0;
  padding: 0;
  list-style: none;
  max-height: 20rem;
  overflow-y: auto;
}
.draft-summary-panel .draft-command-list::-webkit-scrollbar {
  width: 0.375rem;
}
.draft-summary-panel .draft-command-list::-webkit-scrollbar-track {
  background: #f9f9f9;
}
.draft-summary-panel .draft-command-list::-webkit-scrollbar-thumb {
  background: #bdbdbd;
  border-radius: 0.1875rem;
}
.draft-summary-panel .draft-command-list::-webkit-scrollbar-thumb:hover {
  background: #888;
}
.draft-summary-panel .draft-command-item {
  display: flex;
  align-items: flex-start;
  position: relative;
  padding: 1rem 0.5rem;
  border-bottom: 1px solid #f7f7f7;
  transition: all 0.15s ease;
}
.draft-summary-panel .draft-command-item:hover {
  background: #f9f9f9;
}
.draft-summary-panel .draft-command-item:hover .delete-command-btn {
  opacity: 1;
}
.draft-summary-panel .draft-command-item:hover .command-indicator {
  width: 0.25rem;
}
.draft-summary-panel .draft-command-item:last-child {
  border-bottom: none;
}
.draft-summary-panel .draft-command-item.command-success .command-indicator {
  background: #fefce8;
}
.draft-summary-panel .draft-command-item.command-success .command-icon-wrapper {
  background: #fef08a;
  color: #363636;
}
.draft-summary-panel .draft-command-item.command-info .command-indicator {
  background: #4f46e5;
}
.draft-summary-panel .draft-command-item.command-info .command-icon-wrapper {
  background: #dbeafe;
  color: #363636;
}
.draft-summary-panel .draft-command-item.command-danger .command-indicator {
  background: #df0300;
}
.draft-summary-panel .draft-command-item.command-danger .command-icon-wrapper {
  background: #ffc5c5;
  color: #7f1d1d;
}
.draft-summary-panel .draft-command-item.command-neutral .command-indicator {
  background: #888;
}
.draft-summary-panel .draft-command-item.command-neutral .command-icon-wrapper {
  background: #eee;
  color: #666;
}
.draft-summary-panel .command-indicator {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 0;
  transition: width 0.15s ease;
}
.draft-summary-panel .command-icon-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 2.25rem;
  height: 2.25rem;
  margin-right: 1rem;
  border-radius: 0.5rem;
  transition: all 0.15s ease;
}
.draft-summary-panel .command-icon-wrapper .command-icon {
  width: 1.25rem;
  height: 1.25rem;
}
.draft-summary-panel .command-content {
  flex: 1;
  min-width: 0;
  padding-right: 1rem;
}
.draft-summary-panel .command-action {
  color: #363636;
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: 1.4;
  margin-bottom: 0.25rem;
}
.draft-summary-panel .command-details {
  color: #888;
  font-size: 0.8125rem;
  line-height: 1.5;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.draft-summary-panel .delete-command-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 2rem;
  height: 2rem;
  padding: 0;
  background: #fff;
  border: 1px solid #e7e7e7;
  border-radius: 0.4rem;
  color: #888;
  cursor: pointer;
  opacity: 0;
  transition: all 0.15s ease;
}
.draft-summary-panel .delete-command-btn:hover {
  background: #ffc5c5;
  border-color: #ea6363;
  color: #df0300;
  transform: scale(1.05);
}
.draft-summary-panel .delete-command-btn:active {
  transform: scale(0.95);
}
.draft-summary-panel .delete-command-btn .delete-icon {
  width: 1rem;
  height: 1rem;
}
.draft-summary-panel .draft-empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 3rem 2rem;
  text-align: center;
}
.draft-summary-panel .draft-empty-state .empty-icon {
  width: 3rem;
  height: 3rem;
  margin-bottom: 1rem;
  color: #3dac43;
  opacity: 0.3;
}
.draft-summary-panel .draft-empty-state h4 {
  margin: 0 0 0.5rem 0;
  color: #666;
  font-size: 1rem;
  font-weight: 600;
}
.draft-summary-panel .draft-empty-state p {
  margin: 0;
  color: #888;
  font-size: 0.875rem;
}
@keyframes slideIn {
  from {
    opacity: 0;
    transform: translateX(-1rem);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
.draft-summary-panel .draft-command-item {
  animation: slideIn 0.3s ease backwards;
}
.draft-summary-panel .draft-command-item:nth-child(1) {
  animation-delay: 0.05s;
}
.draft-summary-panel .draft-command-item:nth-child(2) {
  animation-delay: 0.1s;
}
.draft-summary-panel .draft-command-item:nth-child(3) {
  animation-delay: 0.15s;
}
.draft-summary-panel .draft-command-item:nth-child(4) {
  animation-delay: 0.2s;
}
.draft-summary-panel .draft-command-item:nth-child(5) {
  animation-delay: 0.25s;
}
.draft-summary-panel .draft-command-item:nth-child(6) {
  animation-delay: 0.3s;
}
.draft-summary-panel .draft-command-item:nth-child(7) {
  animation-delay: 0.35s;
}
.draft-summary-panel .draft-command-item:nth-child(8) {
  animation-delay: 0.4s;
}
.draft-summary-panel .draft-command-item:nth-child(9) {
  animation-delay: 0.45s;
}
.draft-summary-panel .draft-command-item:nth-child(10) {
  animation-delay: 0.5s;
}
@media (max-width: 40rem) {
  .draft-summary-panel .draft-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
  }
  .draft-summary-panel .draft-command-item {
    padding: 0.875rem 1rem;
  }
  .draft-summary-panel .command-icon-wrapper {
    width: 2rem;
    height: 2rem;
    margin-right: 0.75rem;
  }
  .draft-summary-panel .command-icon-wrapper .command-icon {
    width: 1rem;
    height: 1rem;
  }
  .draft-summary-panel .delete-command-btn {
    opacity: 1;
  }
}

.embedding-mini-product-card {
  display: flex;
  flex-direction: column;
  height: auto;
  min-height: 30rem;
  background: #fff;
  border-radius: 2px;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  overflow: hidden;
  cursor: pointer;
  width: 100%;
  max-width: 28.75rem;
  margin: 0 auto;
  position: relative;
  border: 0.0625rem solid #e7e7e7;
}
.embedding-mini-product-card:hover {
  transform: translateY(-0.25rem) scale(1.02);
  border-color: #da0000;
}
.embedding-mini-product-card.card--actions-open {
  transform: scale(1.05);
  z-index: 10;
}
.embedding-mini-product-card .card__status-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.75rem 1rem;
  background: linear-gradient(135deg, #f8f8f8 0%, rgb(242.9, 242.9, 242.9) 100%);
  border-bottom: 0.0625rem solid #dfdfdf;
}
.embedding-mini-product-card .card__status-bar .status-indicator {
  padding: 0.25rem 0.625rem;
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 500;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.025em;
}
.embedding-mini-product-card .card__status-bar .status-indicator--visible {
  background-color: rgba(61, 172, 67, 0.1);
  color: #3dac43;
  border: 0.0625rem solid rgba(61, 172, 67, 0.2);
}
.embedding-mini-product-card .card__status-bar .status-indicator--hidden {
  background-color: rgba(218, 0, 0, 0.1);
  color: #da0000;
  border: 0.0625rem solid rgba(218, 0, 0, 0.2);
}
.embedding-mini-product-card .card__status-bar .completeness-badge {
  position: relative;
  width: 3.75rem;
  height: 1.25rem;
  background-color: #dfdfdf;
  border-radius: 999px;
  overflow: hidden;
}
.embedding-mini-product-card .card__status-bar .completeness-badge .completeness-fill {
  height: 100%;
  background: linear-gradient(90deg, #3dac43 0%, #da0000 100%);
  transition: width 0.6s ease-out;
  border-radius: 999px;
}
.embedding-mini-product-card .card__status-bar .completeness-badge .completeness-text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 0.625rem;
  font-weight: 700;
  font-family: Rubik-Bold, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  color: #363636;
  text-shadow: 0 0.0625rem 0.125rem rgba(255, 255, 255, 0.8);
}
.embedding-mini-product-card .card__image-container {
  position: relative;
  width: 100%;
  height: 12.5rem;
  background: linear-gradient(135deg, #f8f8f8 0%, #f7f7f7 100%);
  overflow: hidden;
}
.embedding-mini-product-card .card__image-container .card__image {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 1rem;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.embedding-mini-product-card .card__image-container .card__image-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  color: #a9a9a9;
}
.embedding-mini-product-card .card__image-container .card__image-placeholder .icon {
  width: 3rem;
  height: 3rem;
  margin-bottom: 0.5rem;
  opacity: 0.6;
}
.embedding-mini-product-card .card__image-container .card__image-placeholder .placeholder-text {
  font-size: 0.8rem;
  font-weight: 500;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
.embedding-mini-product-card .card__image-container .image-overlay {
  position: absolute;
  top: 0.75rem;
  left: 0.75rem;
  display: flex;
  gap: 0.5rem;
}
.embedding-mini-product-card .card__image-container .image-overlay .overlay-badge {
  padding: 0.25rem 0.5rem;
  border-radius: 0.4rem;
  background: rgba(0, 0, 0, 0.8);
  color: #fff;
  font-size: 0.7rem;
  font-weight: 500;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  backdrop-filter: blur(0.5rem);
  border: 0.0625rem solid rgba(255, 255, 255, 0.55);
}
.embedding-mini-product-card .card__image-container .image-overlay .overlay-badge--3d {
  background: linear-gradient(135deg, #da0000 0%, #a70000 100%);
}
.embedding-mini-product-card .card__image-container .image-overlay .overlay-badge--hd {
  background: linear-gradient(135deg, #f59e0b 0%, rgb(196.9291338583, 126.7125984252, 8.0708661417) 100%);
}
.embedding-mini-product-card .card__image-container .image-overlay .overlay-badge .badge-icon {
  width: 0.75rem;
  height: 0.75rem;
  fill: #fff;
}
.embedding-mini-product-card .card__image-container .image-overlay .overlay-badge .badge-text {
  font-weight: 700;
  font-family: Rubik-Bold, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
.embedding-mini-product-card .card__image-container .quick-actions-trigger {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  width: 2rem;
  height: 2rem;
  border-radius: 999px;
  background: #da0000;
  border: 0.0625rem solid rgba(255, 255, 255, 0.55);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.15s cubic-bezier(0.4, 0, 0.2, 1);
  backdrop-filter: blur(0.5rem);
}
.embedding-mini-product-card .card__image-container .quick-actions-trigger:hover {
  background: rgba(0, 0, 0, 0.8);
  transform: scale(1.1);
}
.embedding-mini-product-card .card__image-container .quick-actions-trigger .icon {
  width: 1rem;
  height: 1rem;
  fill: #fff;
}
.embedding-mini-product-card .card__quick-actions {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #fff;
  border-radius: 1rem;
  box-shadow: 0 0.625rem 0.9375rem -0.1875rem rgba(0, 0, 0, 0.1), 0 0.25rem 0.375rem -0.25rem rgba(0, 0, 0, 0.1);
  padding: 1rem;
  display: flex;
  gap: 0.75rem;
  z-index: 25;
  border: 0.0625rem solid #dfdfdf;
  animation: quickActionsSlideIn 0.2s ease-out;
}
.embedding-mini-product-card .card__quick-actions .quick-action {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem;
  border-radius: 0.4rem;
  border: 0.0625rem solid #dfdfdf;
  background: #fff;
  color: #888;
  text-decoration: none;
  font-size: 0.7rem;
  font-weight: 500;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  transition: all 0.15s cubic-bezier(0.4, 0, 0.2, 1);
  min-width: 5.75rem;
}
.embedding-mini-product-card .card__quick-actions .quick-action:hover {
  border-color: #da0000;
  color: #da0000;
  transform: translateY(-0.125rem);
}
.embedding-mini-product-card .card__quick-actions .quick-action--primary {
  background: #da0000;
  color: #fff;
  border-color: #da0000;
}
.embedding-mini-product-card .card__quick-actions .quick-action--primary:hover {
  background: rgba(218, 0, 0, 0.8);
  color: #fff;
}
.embedding-mini-product-card .card__quick-actions .quick-action--primary svg {
  fill: #fff;
}
.embedding-mini-product-card .card__quick-actions .quick-action .action-icon {
  width: 1.25rem;
  height: 1.25rem;
}
.embedding-mini-product-card .card__integration-panel {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #fff;
  border-radius: 1rem;
  box-shadow: 0 1.25rem 1.5625rem -0.3125rem rgba(0, 0, 0, 0.1), 0 0.625rem 0.625rem -0.3125rem rgba(0, 0, 0, 0.04);
  z-index: 50;
  overflow: hidden;
  animation: integrationPanelSlideIn 0.3s ease-out;
}
.embedding-mini-product-card .card__integration-panel .integration-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem 1.25rem;
  background: linear-gradient(135deg, #da0000 0%, #a70000 100%);
  color: #fff;
}
.embedding-mini-product-card .card__integration-panel .integration-header .integration-title {
  font-size: 1rem;
  font-weight: 700;
  font-family: Rubik-Bold, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  margin: 0;
}
.embedding-mini-product-card .card__integration-panel .integration-header .close-button {
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.55);
  border: none;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.15s cubic-bezier(0.4, 0, 0.2, 1);
}
.embedding-mini-product-card .card__integration-panel .integration-header .close-button:hover {
  background: rgba(255, 255, 255, 0.9);
  color: #da0000;
  transform: scale(1.1);
}
.embedding-mini-product-card .card__integration-panel .integration-header .close-button .close-icon {
  width: 1rem;
  height: 1rem;
}
.embedding-mini-product-card .card__integration-panel .integration-content {
  padding: 1.25rem;
  height: calc(100% - 4.375rem);
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
.embedding-mini-product-card .card__integration-panel .integration-content .integration-section .section-title {
  font-size: 0.8rem;
  font-weight: 500;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  color: #363636;
  margin: 0 0 0.75rem 0;
  padding-bottom: 0.5rem;
  border-bottom: 0.125rem solid #e7e7e7;
  text-transform: uppercase;
  letter-spacing: 0.025em;
}
.embedding-mini-product-card .card__integration-panel .integration-content .integration-section .integration-fields {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.embedding-mini-product-card .card__integration-panel .integration-content .integration-section .integration-fields .integration-field .field-label {
  display: block;
  font-size: 0.7rem;
  font-weight: 500;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  color: #a9a9a9;
  margin-bottom: 0.25rem;
  text-transform: uppercase;
  letter-spacing: 0.025em;
}
.embedding-mini-product-card .card__integration-panel .integration-content .integration-section .integration-fields .integration-field .field-input {
  display: flex;
  gap: 0.5rem;
  align-items: flex-start;
}
.embedding-mini-product-card .card__integration-panel .integration-content .integration-section .integration-fields .integration-field .field-input .integration-input {
  flex: 1;
  padding: 0.5rem 0.75rem;
  border: 1px solid #dfdfdf;
  border-radius: 0.125rem;
  font-size: 0.7rem;
  font-family: monospace;
  background: #f8f8f8;
  color: #363636;
  resize: none;
}
.embedding-mini-product-card .card__integration-panel .integration-content .integration-section .integration-fields .integration-field .field-input .integration-input:focus {
  outline: none;
  border-color: #da0000;
  box-shadow: 0 0 0 0.1875rem rgba(218, 0, 0, 0.1);
}
.embedding-mini-product-card .card__integration-panel .integration-content .integration-section .integration-fields .integration-field .field-input .integration-textarea {
  flex: 1;
  padding: 0.5rem 0.75rem;
  border: 1px solid #dfdfdf;
  border-radius: 0.125rem;
  font-size: 0.7rem;
  font-family: monospace;
  background: #f8f8f8;
  color: #363636;
  resize: vertical;
  min-height: 3.75rem;
}
.embedding-mini-product-card .card__integration-panel .integration-content .integration-section .integration-fields .integration-field .field-input .integration-textarea:focus {
  outline: none;
  border-color: #da0000;
  box-shadow: 0 0 0 0.1875rem rgba(218, 0, 0, 0.1);
}
.embedding-mini-product-card .card__integration-panel .integration-content .integration-section .integration-fields .integration-field .field-input .copy-btn,
.embedding-mini-product-card .card__integration-panel .integration-content .integration-section .integration-fields .integration-field .field-input .open-btn {
  width: 2rem;
  height: 2rem;
  border-radius: 0.125rem;
  border: 1px solid #dfdfdf;
  background: #fff;
  color: #888;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.15s cubic-bezier(0.4, 0, 0.2, 1);
}
.embedding-mini-product-card .card__integration-panel .integration-content .integration-section .integration-fields .integration-field .field-input .copy-btn:hover,
.embedding-mini-product-card .card__integration-panel .integration-content .integration-section .integration-fields .integration-field .field-input .open-btn:hover {
  border-color: #da0000;
  color: #da0000;
  background: rgba(218, 0, 0, 0.05);
}
.embedding-mini-product-card .card__integration-panel .integration-content .integration-section .integration-fields .integration-field .field-input .copy-btn .copy-icon,
.embedding-mini-product-card .card__integration-panel .integration-content .integration-section .integration-fields .integration-field .field-input .copy-btn .open-icon,
.embedding-mini-product-card .card__integration-panel .integration-content .integration-section .integration-fields .integration-field .field-input .open-btn .copy-icon,
.embedding-mini-product-card .card__integration-panel .integration-content .integration-section .integration-fields .integration-field .field-input .open-btn .open-icon {
  width: 0.875rem;
  height: 0.875rem;
}
.embedding-mini-product-card .card__integration-panel .integration-content .integration-section .integration-fields .integration-field .field-input .copy-btn--textarea,
.embedding-mini-product-card .card__integration-panel .integration-content .integration-section .integration-fields .integration-field .field-input .open-btn--textarea {
  align-self: flex-start;
}
.embedding-mini-product-card .card__integration-panel .integration-content .integration-section .integration-fields .integration-field .field-input .open-btn:hover {
  border-color: #3dac43;
  color: #3dac43;
  background: rgba(61, 172, 67, 0.05);
}
.embedding-mini-product-card .card__integration-panel .integration-content .integration-section .sandbox-buttons {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.embedding-mini-product-card .card__integration-panel .integration-content .integration-section .sandbox-buttons .sandbox-link {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem;
  border: 1px solid #dfdfdf;
  border-radius: 0.4rem;
  background: #f8f8f8;
  color: #363636;
  text-decoration: none;
  font-size: 0.8rem;
  font-weight: 500;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  transition: all 0.15s cubic-bezier(0.4, 0, 0.2, 1);
}
.embedding-mini-product-card .card__integration-panel .integration-content .integration-section .sandbox-buttons .sandbox-link:hover {
  border-color: #da0000;
  background: rgba(218, 0, 0, 0.05);
  transform: translateY(-0.0625rem);
}
.embedding-mini-product-card .card__integration-panel .integration-content .integration-section .sandbox-buttons .sandbox-link .sandbox-img {
  width: 1.5rem;
  height: 1.5rem;
}
.embedding-mini-product-card .card__integration-panel .integration-content .integration-section .sandbox-buttons .sandbox-generate {
  padding: 0.75rem 1rem;
  border: 1px solid #da0000;
  border-radius: 0.4rem;
  background: transparent;
  color: #da0000;
  font-size: 0.8rem;
  font-weight: 500;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  cursor: pointer;
  transition: all 0.15s cubic-bezier(0.4, 0, 0.2, 1);
}
.embedding-mini-product-card .card__integration-panel .integration-content .integration-section .sandbox-buttons .sandbox-generate:last-child {
  margin-bottom: 2rem;
}
.embedding-mini-product-card .card__integration-panel .integration-content .integration-section .sandbox-buttons .sandbox-generate:hover {
  background: #da0000;
  color: #fff;
}
.embedding-mini-product-card .card__integration-panel .integration-content .integration-section .sandbox-buttons .sandbox-generate:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.embedding-mini-product-card .card__header {
  padding: 1rem 1.25rem 0.5rem;
}
.embedding-mini-product-card .card__header .card__title {
  font-size: 1.2rem;
  font-weight: 700;
  font-family: Rubik-Bold, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  color: #363636;
  margin: 0 0 0.25rem 0;
  line-height: 1.3;
  word-break: break-word;
}
.embedding-mini-product-card .card__header .card__subtitle {
  font-size: 0.8rem;
  color: #a9a9a9;
  font-weight: 500;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
.embedding-mini-product-card .card__tabs {
  display: flex;
  border-bottom: 1px solid #dfdfdf;
  background: #f8f8f8;
  margin: 0 1.25rem;
  border-radius: 0.125rem 0.125rem 0 0;
}
.embedding-mini-product-card .card__tabs .tab {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.75rem 0.5rem;
  border: none;
  background: transparent;
  color: #a9a9a9;
  font-size: 0.7rem;
  font-weight: 500;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  cursor: pointer;
  transition: all 0.15s cubic-bezier(0.4, 0, 0.2, 1);
  border-bottom: 0.125rem solid transparent;
  margin: 0;
}
.embedding-mini-product-card .card__tabs .tab span {
  font-weight: bold;
}
.embedding-mini-product-card .card__tabs .tab:hover {
  color: #888;
  background: rgba(218, 0, 0, 0.05);
}
.embedding-mini-product-card .card__tabs .tab--active {
  color: #da0000;
  border-bottom-color: #da0000;
  background: #fff;
}
.embedding-mini-product-card .card__tabs .tab .tab-icon {
  width: 0.875rem;
  height: 0.875rem;
}
.embedding-mini-product-card .card__content {
  flex: 1;
  padding: 1.25rem;
  min-height: 11rem;
}
.embedding-mini-product-card .card__content .tab-content {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.embedding-mini-product-card .card__content .content-section .section-title {
  font-size: 0.8rem;
  font-weight: 500;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  color: #363636;
  margin: 0 0 0.75rem 0;
  text-transform: uppercase;
  letter-spacing: 0.025em;
}
.embedding-mini-product-card .card__content .product-description {
  color: #888;
  font-size: 0.8rem;
  line-height: 1.5;
  margin: 0;
}
.embedding-mini-product-card .card__content .info-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
}
.embedding-mini-product-card .card__content .info-grid .info-item {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.embedding-mini-product-card .card__content .info-grid .info-item .info-label {
  font-size: 0.7rem;
  color: #a9a9a9;
  font-weight: 500;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.025em;
}
.embedding-mini-product-card .card__content .info-grid .info-item .info-value {
  font-size: 0.8rem;
  color: #363636;
  font-weight: 500;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
.embedding-mini-product-card .card__content .dimensions-display {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.embedding-mini-product-card .card__content .dimensions-display .dimension-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.5rem;
  background: #f8f8f8;
  border-radius: 0.125rem;
}
.embedding-mini-product-card .card__content .dimensions-display .dimension-item .dimension-label {
  font-size: 0.7rem;
  color: #a9a9a9;
  font-weight: 500;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
.embedding-mini-product-card .card__content .dimensions-display .dimension-item .dimension-value {
  font-family: monospace;
  font-size: 0.8rem;
  font-weight: 700;
  color: #363636;
}
.embedding-mini-product-card .card__content .dimensions-display .dimension-item .dimension-value .unit {
  font-size: 0.7rem;
  color: #a9a9a9;
  margin-left: 0.25rem;
}
.embedding-mini-product-card .card__content .feature-badge {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem;
  border-radius: 0.4rem;
  font-size: 0.8rem;
  font-weight: 500;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
.embedding-mini-product-card .card__content .feature-badge--configurable {
  background: linear-gradient(135deg, rgba(218, 0, 0, 0.1) 0%, rgba(218, 0, 0, 0.05) 100%);
  color: #da0000;
  border: 1px solid #da0000;
}
.embedding-mini-product-card .card__content .feature-badge .feature-icon {
  width: 1.25rem;
  height: 1.25rem;
}
.embedding-mini-product-card .card__content .tags-container {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.embedding-mini-product-card .card__content .tags-container .tag-pill {
  padding: 0.375rem 0.75rem;
  background: linear-gradient(135deg, #f8f8f8 0%, rgb(240.35, 240.35, 240.35) 100%);
  color: #363636;
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 500;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  border: 1px solid #dfdfdf;
  transition: all 0.15s cubic-bezier(0.4, 0, 0.2, 1);
}
.embedding-mini-product-card .card__content .tags-container .tag-pill:hover {
  background: linear-gradient(135deg, rgba(218, 0, 0, 0.1) 0%, rgba(218, 0, 0, 0.05) 100%);
  border-color: #da0000;
  color: #da0000;
}
.embedding-mini-product-card .card__content .tags-container .tag-toggle {
  padding: 0.375rem 0.75rem;
  background: transparent;
  color: #da0000;
  border: 0.0625rem dashed #da0000;
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 500;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  cursor: pointer;
  transition: all 0.15s cubic-bezier(0.4, 0, 0.2, 1);
}
.embedding-mini-product-card .card__content .tags-container .tag-toggle:hover {
  background: rgba(218, 0, 0, 0.1);
}
.embedding-mini-product-card .card__content .empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 2rem 1rem;
  color: #a9a9a9;
  text-align: center;
}
.embedding-mini-product-card .card__content .empty-state .empty-icon {
  width: 3rem;
  height: 3rem;
  margin-bottom: 0.75rem;
  opacity: 0.5;
}
.embedding-mini-product-card .card__content .empty-state p {
  margin: 0;
  font-size: 0.8rem;
  font-weight: 500;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
.embedding-mini-product-card .card__content .loading-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 2rem 1rem;
  color: #a9a9a9;
  text-align: center;
}
.embedding-mini-product-card .card__content .loading-state .loading-spinner {
  width: 2rem;
  height: 2rem;
  border: 0.1875rem solid #dfdfdf;
  border-top: 0.1875rem solid #da0000;
  border-radius: 50%;
  animation: spin 1s linear infinite;
  margin-bottom: 0.75rem;
}
.embedding-mini-product-card .card__content .loading-state p {
  margin: 0;
  font-size: 0.8rem;
  font-weight: 500;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
.embedding-mini-product-card .card__footer {
  display: flex;
  gap: 0.75rem;
  padding: 1rem 1.25rem;
  background: linear-gradient(135deg, #f8f8f8 0%, rgb(242.9, 242.9, 242.9) 100%);
  border-top: 1px solid #dfdfdf;
  margin-top: auto;
}
.embedding-mini-product-card .card__footer .footer-action {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.75rem 1rem;
  font-size: 0.9rem;
  font-weight: 400;
  border-radius: 1.714rem;
  border: 1px solid transparent;
  cursor: pointer;
  transition: all 0.15s cubic-bezier(0.4, 0, 0.2, 1);
  text-decoration: none;
}
.embedding-mini-product-card .card__footer .footer-action .action-icon {
  width: 1rem;
  height: 1rem;
}
.embedding-mini-product-card .card__footer .footer-action--primary {
  background: linear-gradient(135deg, #da0000 0%, rgb(192.5, 0, 0) 100%);
  color: #fff;
  border-color: #da0000;
}
.embedding-mini-product-card .card__footer .footer-action--primary svg {
  fill: #fff;
}
.embedding-mini-product-card .card__footer .footer-action--secondary {
  background-color: #fff;
  color: #da0000;
  border-color: #da0000;
}

@keyframes quickActionsSlideIn {
  from {
    opacity: 0;
    transform: translate(-50%, -50%) scale(0.8);
  }
  to {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }
}
@keyframes integrationPanelSlideIn {
  from {
    opacity: 0;
    transform: scale(0.95);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.multi-select-scroller {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding: 1rem;
}
.multi-select-scroller .embedding-mini-product-card {
  margin: 0;
  max-width: none;
}

.multi-select-header {
  position: sticky;
  top: 4.2rem;
  background: linear-gradient(135deg, #fff 0%, #f8f8f8 100%);
  padding: 1.5rem 1rem;
  z-index: 10;
  font-size: 1.2rem;
  font-weight: 700;
  font-family: Rubik-Bold, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  color: #363636;
  border-bottom: 0.125rem solid #dfdfdf;
  border-radius: 0.4rem 0.4rem 0 0;
  box-shadow: 0 0.0625rem 0.125rem 0 rgba(0, 0, 0, 0.1);
}
.multi-select-header::before {
  content: "";
  position: absolute;
  bottom: -0.125rem;
  left: 0;
  right: 0;
  height: 0.125rem;
  background: linear-gradient(90deg, #da0000 0%, transparent 100%);
}

@media (max-width: 30rem) {
  .embedding-mini-product-card {
    min-height: 26.25rem;
  }
  .embedding-mini-product-card .card__image-container {
    height: 10rem;
  }
  .embedding-mini-product-card .card__tabs .tab {
    padding: 0.5rem 0.25rem;
    font-size: 0.7rem;
  }
  .embedding-mini-product-card .card__tabs .tab span {
    display: none;
  }
  .embedding-mini-product-card .card__quick-actions {
    flex-direction: column;
    padding: 0.75rem;
  }
  .embedding-mini-product-card .card__quick-actions .quick-action {
    min-width: 3.125rem;
    padding: 0.5rem;
  }
  .embedding-mini-product-card .card__integration-panel .integration-header {
    padding: 0.75rem 1rem;
  }
  .embedding-mini-product-card .card__integration-panel .integration-header .integration-title {
    font-size: 0.9rem;
  }
  .embedding-mini-product-card .card__integration-panel .integration-content {
    padding: 1rem;
    gap: 1rem;
  }
  .embedding-mini-product-card .card__integration-panel .integration-content .integration-field .field-input {
    flex-direction: column;
    align-items: stretch;
  }
  .embedding-mini-product-card .card__integration-panel .integration-content .integration-field .field-input .copy-btn,
  .embedding-mini-product-card .card__integration-panel .integration-content .integration-field .field-input .open-btn {
    align-self: flex-end;
    width: auto;
    padding: 0.5rem 0.75rem;
  }
  .embedding-mini-product-card .card__integration-panel .integration-content .integration-field .field-input .copy-btn--textarea,
  .embedding-mini-product-card .card__integration-panel .integration-content .integration-field .field-input .open-btn--textarea {
    align-self: flex-end;
  }
}
.toast-container {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 350px;
  max-width: 90vw;
}

@keyframes toast-enter {
  from {
    opacity: 0;
    transform: translateX(100%);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
.toast-message-wrapper {
  animation: toast-enter 0.4s cubic-bezier(0.21, 1.02, 0.73, 1) forwards;
}

.toast-message {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px;
  border-radius: 10px;
  color: white;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  transition: all 0.3s ease;
}

.toast-message.is-type-success {
  background-color: #4f46e5;
}
.toast-message.is-type-success svg {
  fill: #fff;
}

.toast-message.is-type-error {
  background-color: #000;
}
.toast-message.is-type-error svg {
  fill: #fff;
}

.toast-message.is-type-info {
  background-color: #17a2b8;
}
.toast-message.is-type-info svg {
  fill: #fff;
}

.toast-icon {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
}

.toast-icon svg {
  width: 100%;
  height: 100%;
}

.toast-text {
  flex-grow: 1;
  margin: 0;
  font-size: 14px;
  line-height: 1.4;
}

.toast-close-button {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  background: none;
  border: none;
  color: white;
  opacity: 0.7;
  cursor: pointer;
  padding: 0;
}

.toast-close-button:hover {
  opacity: 1;
}

.toast-close-button svg {
  width: 100%;
  height: 100%;
}

.toast-message--sticky {
  border-radius: 0.4rem;
  width: 100%;
  box-shadow: none;
  margin: 0;
  margin-bottom: 0.5rem;
  box-sizing: border-box;
  padding-top: 0.3rem;
  padding-bottom: 0.3rem;
}

.toast-message-wrapper--inline {
  animation: toast-enter-top 0.3s ease forwards;
  width: 100%;
}

@keyframes toast-enter-top {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

/*
* ==========================================================================
* 1. Variables & Easing
* ==========================================================================
*/
/*
* ==========================================================================
* 2. Main Component Styles (.ai-image-generation)
* ==========================================================================
*/
.ai-image-generation {
  min-height: 100vh;
  background: linear-gradient(135deg, #ff4141 0%, #da0000 50%, rgb(141.5, 0, 0) 100%);
  background-attachment: fixed;
  padding: 2rem;
  font-family: Rubik, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  position: relative;
  overflow-x: hidden;
}
.ai-image-generation::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.1) 0%, transparent 50%), radial-gradient(circle at 70% 80%, rgba(255, 255, 255, 0.05) 0%, transparent 50%);
  pointer-events: none;
}
.ai-image-generation .preview-image-container .image-loader {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 99999;
}
.ai-image-generation .header-section {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 2.5rem;
  color: #fff;
  position: relative;
  z-index: 2;
}
.ai-image-generation .header-section .header-content {
  flex: 1;
}
.ai-image-generation .header-section .page-title {
  font-size: 2.8rem;
  font-weight: 700;
  font-family: Rubik-Bold, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  text-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.3);
}
.ai-image-generation .header-section .page-title .title-icon {
  font-size: 2rem;
  filter: drop-shadow(0 0.125rem 0.25rem rgba(0, 0, 0, 0.2));
  animation: float 3s ease-in-out infinite;
}
.ai-image-generation .header-section .premium-badge {
  display: inline-block;
  padding: 2px 8px;
  background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
  color: white;
  font-size: 10px;
  font-weight: 700;
  border-radius: 12px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-left: 8px;
  box-shadow: 0 2px 4px rgba(245, 158, 11, 0.3);
  margin-left: 0;
}
.ai-image-generation .header-section .beta-badge {
  background: rgba(255, 255, 255, 0.2);
  padding: 0.25rem 0.75rem;
  border-radius: 50rem;
  font-size: 0.8rem;
  font-weight: 500;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  backdrop-filter: blur(0.625rem);
  border: 0.0625rem solid rgba(255, 255, 255, 0.3);
  box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.1);
  animation: pulse 2s ease-in-out infinite;
}
.ai-image-generation .header-section .page-subtitle {
  margin: 0.75rem 0 0 0;
  opacity: 0.95;
  font-size: 1.2rem;
  font-family: Rubik-Light, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  text-shadow: 0 0.0625rem 0.125rem rgba(0, 0, 0, 0.2);
  max-width: 40rem;
  line-height: 1.6;
}
.ai-image-generation .header-section .header-actions {
  display: flex;
  gap: 1rem;
}
.ai-image-generation .content-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2.5rem;
  max-width: 87.5rem;
  margin: 0 auto;
  position: relative;
  z-index: 2;
}
.ai-image-generation .panel-card {
  background: rgba(255, 255, 255, 0.95);
  border-radius: 1.5rem;
  padding: 2.5rem;
  backdrop-filter: blur(1.25rem);
  border: 0.0625rem solid rgba(255, 255, 255, 0.2);
  box-shadow: 0 1.25rem 2.5rem rgba(0, 0, 0, 0.1), 0 0.5rem 1rem rgba(0, 0, 0, 0.05), inset 0 0.0625rem 0 rgba(255, 255, 255, 0.1);
  transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1);
  position: relative;
  overflow: hidden;
}
.ai-image-generation .panel-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 0.125rem;
  background: linear-gradient(135deg, #da0000 0%, rgb(141.5, 0, 0) 100%);
  opacity: 0;
  transition: opacity 0.3s ease;
}
.ai-image-generation .panel-card:hover {
  transform: translateY(-0.25rem);
  box-shadow: 0 2rem 4rem rgba(0, 0, 0, 0.15), 0 1rem 2rem rgba(0, 0, 0, 0.08), inset 0 0.0625rem 0 rgba(255, 255, 255, 0.2);
}
.ai-image-generation .panel-card:hover::before {
  opacity: 1;
}
.ai-image-generation .panel-card .service-status {
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 10;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  transition: all 0.3s ease;
}
.ai-image-generation .input-section {
  margin-bottom: 2rem;
}
.ai-image-generation .input-label,
.ai-image-generation .section-label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 500;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  margin-bottom: 1rem;
  color: #363636;
  font-size: 1rem;
}
.ai-image-generation .input-label .label-icon,
.ai-image-generation .section-label .label-icon {
  font-size: 1.2rem;
  filter: drop-shadow(0 0.0625rem 0.125rem rgba(218, 0, 0, 0.3));
}
.ai-image-generation .input-label .label-required,
.ai-image-generation .section-label .label-required {
  color: #da0000;
  margin-left: 0.25rem;
  font-weight: 700;
}
.ai-image-generation .input-label .label-optional,
.ai-image-generation .section-label .label-optional {
  font-weight: 400;
  font-size: 0.85rem;
  color: #888;
}
.ai-image-generation .input-group {
  position: relative;
}
.ai-image-generation .custom-prompt-section {
  margin-top: 0.5rem;
}
.ai-image-generation .input-field,
.ai-image-generation .custom-prompt-textarea {
  width: 100%;
  padding: 1.25rem 1.5rem;
  border: 0.125rem solid #dfdfdf;
  border-radius: 1.25rem;
  font-size: 1rem;
  font-family: Rubik, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  background: #fff;
  box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.02);
  box-sizing: border-box;
}
.ai-image-generation .input-field::placeholder,
.ai-image-generation .custom-prompt-textarea::placeholder {
  color: #a9a9a9;
  font-style: italic;
}
.ai-image-generation .input-field:focus,
.ai-image-generation .custom-prompt-textarea:focus {
  outline: none;
  border-color: #da0000;
  box-shadow: 0 0 0 0.1875rem rgba(218, 0, 0, 0.1), 0 0.5rem 1rem rgba(0, 0, 0, 0.05);
  transform: translateY(-0.0625rem);
}
.ai-image-generation .input-field.loading,
.ai-image-generation .custom-prompt-textarea.loading {
  background: linear-gradient(90deg, #f4f4f4 25%, #eee 50%, #f4f4f4 75%);
  background-size: 200% 100%;
  animation: shimmer 2s infinite;
}
.ai-image-generation .custom-prompt-textarea {
  min-height: 7.5rem;
  resize: vertical;
  line-height: 1.6;
}
.ai-image-generation .custom-prompt-textarea::placeholder {
  line-height: 1.5;
}
.ai-image-generation .textarea-hint {
  margin-top: 0.5rem;
  font-size: 0.9rem;
  color: #888;
  text-align: right;
  font-style: italic;
  margin-bottom: 0.5rem;
}
.ai-image-generation .input-spinner {
  position: absolute;
  right: 1.25rem;
  top: 50%;
  transform: translateY(-50%);
  width: 1.25rem;
  height: 1.25rem;
  border: 0.125rem solid #eee;
  border-top: 0.125rem solid #da0000;
  border-radius: 50rem;
  animation: spin 1s linear infinite;
}
.ai-image-generation .upload-section {
  margin-top: 1.5rem;
}
.ai-image-generation .upload-section .upload-container {
  margin-top: 1rem;
}
.ai-image-generation .upload-section .upload-container .upload-label {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  background-color: #f9fafb;
  border: 2px dashed #ccc;
  border-radius: 0.75rem;
  padding: 1rem;
  cursor: pointer;
  transition: border-color 0.3s ease, background-color 0.3s ease;
}
.ai-image-generation .upload-section .upload-container .upload-label:hover {
  border-color: #999;
  background-color: #f1f5f9;
}
.ai-image-generation .upload-section .upload-container .upload-label .upload-icon {
  font-size: 1.5rem;
}
.ai-image-generation .upload-section .upload-container .upload-label .upload-text {
  font-size: 0.95rem;
  font-weight: 500;
  color: #333;
}
.ai-image-generation .upload-section .upload-container .upload-label .upload-input {
  display: none;
}
.ai-image-generation .upload-section .upload-container .upload-hint {
  margin-top: 0.25rem;
  font-size: 0.8rem;
  color: #666;
}
.ai-image-generation .product-preview {
  border: 0.125rem solid #dfdfdf;
  border-radius: 1.25rem;
  padding: 1.5rem;
  margin-bottom: 2rem;
  background: #f9f9f9;
  box-shadow: inset 0 0.125rem 0.25rem rgba(0, 0, 0, 0.05);
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.ai-image-generation .product-preview:hover {
  border-color: rgb(255, 141.5, 141.5);
  box-shadow: inset 0 0.125rem 0.25rem rgba(0, 0, 0, 0.02), 0 0.25rem 0.5rem rgba(218, 0, 0, 0.1);
}
.ai-image-generation .product-preview .preview-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1.25rem;
}
.ai-image-generation .product-preview .preview-title {
  margin: 0;
  color: #363636;
  font-size: 1.2rem;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-weight: 500;
}
.ai-image-generation .product-preview .product-category {
  background: linear-gradient(135deg, #da0000 0%, rgb(141.5, 0, 0) 100%);
  color: #fff;
  padding: 0.25rem 0.75rem;
  border-radius: 0.75rem;
  font-size: 0.8rem;
  font-weight: 500;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  box-shadow: 0 0.25rem 0.5rem rgba(218, 0, 0, 0.3);
  text-transform: uppercase;
  letter-spacing: 0.03125rem;
}
.ai-image-generation .product-preview .product-category svg {
  width: 1rem;
  height: 1rem;
  fill: #fff;
}
.ai-image-generation .product-preview .preview-image-container {
  position: relative;
  border-radius: 1rem;
  overflow: hidden;
  margin-bottom: 1.25rem;
  background: #fff;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1);
}
.ai-image-generation .product-preview .preview-image-container:hover .preview-image {
  transform: scale(1.05);
}
.ai-image-generation .product-preview .preview-image-container:hover .image-overlay {
  transform: translateY(0);
}
.ai-image-generation .product-preview .preview-image-container .preview-image {
  width: 100%;
  height: 12.5rem;
  object-fit: contain;
  transition: transform 0.4s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.ai-image-generation .product-preview .preview-image-container .image-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.8));
  color: #fff;
  padding: 1.25rem;
  transform: translateY(100%);
  transition: transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.ai-image-generation .product-preview .preview-image-container.uploaded .overlay-text {
  background-color: rgba(60, 60, 60, 0.8);
}
.ai-image-generation .product-preview .product-name {
  margin: 0 0 0.5rem 0;
  color: #363636;
  font-size: 1.2rem;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-weight: 500;
}
.ai-image-generation .product-preview .product-description {
  margin: 0;
  color: #888;
  line-height: 1.6;
  font-size: 1rem;
}
.ai-image-generation .product-preview .product-meta {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-top: 1.25rem;
}
.ai-image-generation .product-preview .meta-item {
  color: #888;
  font-size: 0.9rem;
}
.ai-image-generation .product-preview .meta-item strong {
  color: #363636;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
.ai-image-generation .no-image-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 12.5rem;
  background: #f9f9f9;
  border-radius: 0.75rem;
  border: 0.125rem dashed #a9a9a9;
  margin-bottom: 1.25rem;
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.ai-image-generation .no-image-placeholder:hover {
  border-color: rgb(255, 141.5, 141.5);
  background: rgb(254.1, 254.1, 254.1);
}
.ai-image-generation .no-image-placeholder .placeholder-icon {
  font-size: 2.8rem;
  margin-bottom: 0.5rem;
  opacity: 0.5;
  color: #a9a9a9;
}
.ai-image-generation .no-image-placeholder .placeholder-text {
  color: #888;
  font-size: 0.9rem;
  margin: 0;
  font-style: italic;
}
.ai-image-generation .template-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(17.5rem, 1fr));
  gap: 1.25rem;
  margin-top: 1.25rem;
}
.ai-image-generation .template-grid .template-card {
  display: flex;
  align-items: center;
  padding: 1.25rem;
  border: 0.125rem solid #dfdfdf;
  border-radius: 1.25rem;
  background: #fff;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  position: relative;
  text-align: left;
  box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.05);
  margin: 0;
}
.ai-image-generation .template-grid .template-card:hover {
  border-color: rgb(255, 141.5, 141.5);
  transform: translateY(-0.125rem) scale(1.02);
  box-shadow: 0 0.75rem 1.5rem rgba(218, 0, 0, 0.15);
}
.ai-image-generation .template-grid .template-card:hover .template-icon {
  transform: scale(1.2) rotate(5deg);
}
.ai-image-generation .template-grid .template-card.selected {
  border-color: #da0000;
  background: linear-gradient(135deg, #da0000 0%, rgb(141.5, 0, 0) 100%);
  color: #fff;
  box-shadow: 0 0.75rem 1.5rem rgba(218, 0, 0, 0.3), inset 0 0.0625rem 0 rgba(255, 255, 255, 0.2);
}
.ai-image-generation .template-grid .template-card.selected .template-description {
  opacity: 0.9;
}
.ai-image-generation .template-grid .template-card .template-icon {
  font-size: 2rem;
  margin-right: 1.25rem;
  transition: transform 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  filter: drop-shadow(0 0.125rem 0.25rem rgba(0, 0, 0, 0.1));
}
.ai-image-generation .template-grid .template-card .template-content {
  flex: 1;
}
.ai-image-generation .template-grid .template-card .template-name {
  margin: 0 0 0.25rem 0;
  font-size: 1rem;
  font-weight: 500;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
.ai-image-generation .template-grid .template-card .template-description {
  margin: 0;
  font-size: 0.9rem;
  opacity: 0.8;
  line-height: 1.4;
}
.ai-image-generation .template-grid .template-card .selected-indicator {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  background: rgba(255, 255, 255, 0.2);
  border-radius: 50rem;
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.8rem;
  font-weight: 700;
  backdrop-filter: blur(0.25rem);
  animation: bounceIn 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.ai-image-generation .advanced-section {
  margin-bottom: 0.5rem;
}
.ai-image-generation .advanced-section .advanced-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 1.25rem;
  background: linear-gradient(135deg, #fff 0%, #f4f4f4 100%);
  border: 0.125rem solid #dfdfdf;
  border-radius: 1.25rem;
  font-size: 1rem;
  font-weight: 500;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  color: #363636;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  margin-bottom: 1.25rem;
  box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.04), 0 0.0625rem 0.125rem rgba(0, 0, 0, 0.02);
  position: relative;
  overflow: hidden;
  margin: 0;
}
.ai-image-generation .advanced-section .advanced-toggle::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 0.1875rem;
  background: linear-gradient(135deg, #da0000 0%, rgb(141.5, 0, 0) 100%);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.ai-image-generation .advanced-section .advanced-toggle:hover {
  background: linear-gradient(135deg, #fff 0%, rgb(251.65, 251.65, 251.65) 100%);
  transform: translateY(-0.0625rem);
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.08), 0 0.125rem 0.25rem rgba(0, 0, 0, 0.04);
  border-color: rgb(255, 141.5, 141.5);
}
.ai-image-generation .advanced-section .advanced-toggle:hover::before {
  transform: scaleX(1);
}
.ai-image-generation .advanced-section .advanced-toggle:hover .toggle-icon {
  transform: scale(1.1);
}
.ai-image-generation .advanced-section .advanced-toggle .option-help-text {
  font-size: 0.9rem;
  color: #888;
  margin-top: 0.5rem;
  padding: 0.5rem 0.75rem;
  background: rgba(218, 0, 0, 0.03);
  border-radius: 0.5rem;
  border-left: 0.1875rem solid rgba(218, 0, 0, 0.2);
  line-height: 1.5;
  font-style: italic;
}
.ai-image-generation .advanced-section .advanced-toggle .toggle-content {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.ai-image-generation .advanced-section .advanced-toggle .toggle-icon {
  font-size: 1.8rem;
  background: linear-gradient(135deg, #da0000 0%, rgb(141.5, 0, 0) 100%);
  color: #fff;
  width: 3rem;
  height: 3rem;
  border-radius: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  box-shadow: 0 0.25rem 0.5rem rgba(218, 0, 0, 0.3);
}
.ai-image-generation .advanced-section .advanced-toggle .toggle-text {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  text-align: left;
}
.ai-image-generation .advanced-section .advanced-toggle .toggle-title {
  font-size: 1.2rem;
  font-weight: 700;
  margin: 0;
  color: #363636;
}
.ai-image-generation .advanced-section .advanced-toggle .toggle-subtitle {
  font-size: 0.9rem;
  color: #888;
  font-weight: 400;
  font-family: Rubik, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  margin: 0;
  opacity: 0.8;
}
.ai-image-generation .advanced-section .advanced-toggle .toggle-arrow {
  transition: transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  font-size: 1.2rem;
  color: #da0000;
  background: rgba(218, 0, 0, 0.1);
  border-radius: 50rem;
  width: 2.5rem;
  height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 0.0625rem solid rgba(218, 0, 0, 0.2);
}
.ai-image-generation .advanced-section .advanced-toggle .toggle-arrow.expanded {
  transform: rotate(180deg);
  background: #da0000;
  color: #fff;
}
.ai-image-generation .advanced-section .advanced-options {
  animation: slideDown 0.4s cubic-bezier(0.215, 0.61, 0.355, 1);
  margin-top: 1.25rem;
}
.ai-image-generation .advanced-section .advanced-options .advanced-options-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
  gap: 1.5rem;
}
.ai-image-generation .option-card {
  background: #fff;
  border: 0.0625rem solid #dfdfdf;
  border-radius: 1.25rem;
  padding: 1.5rem;
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.04), 0 0.0625rem 0.125rem rgba(0, 0, 0, 0.02);
  position: relative;
  overflow: hidden;
  text-align: left;
}
.ai-image-generation .option-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 0.1875rem;
  background: linear-gradient(135deg, #da0000 0%, rgb(141.5, 0, 0) 100%);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.ai-image-generation .option-card:hover {
  transform: translateY(-0.125rem);
  box-shadow: 0 0.75rem 1.5rem rgba(0, 0, 0, 0.08), 0 0.25rem 0.5rem rgba(0, 0, 0, 0.04);
  border-color: rgb(255, 141.5, 141.5);
}
.ai-image-generation .option-card:hover::before {
  transform: scaleX(1);
}
.ai-image-generation .option-card:hover .option-icon {
  transform: scale(1.1);
}
.ai-image-generation .option-card.featured {
  border-color: #da0000;
  background: linear-gradient(135deg, #fff 0%, rgba(218, 0, 0, 0.02) 100%);
}
.ai-image-generation .option-card.featured::before {
  transform: scaleX(1);
}
.ai-image-generation .option-card.featured .option-badge {
  opacity: 1;
}
.ai-image-generation .option-card .option-header {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1.25rem;
  position: relative;
}
.ai-image-generation .option-card .option-icon {
  font-size: 1.8rem;
  background: linear-gradient(135deg, #da0000 0%, rgb(141.5, 0, 0) 100%);
  color: #fff;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 0.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  box-shadow: 0 0.25rem 0.5rem rgba(218, 0, 0, 0.2);
  flex-shrink: 0;
}
.ai-image-generation .option-card .option-title-group {
  flex: 1;
}
.ai-image-generation .option-card .option-title {
  font-size: 1rem;
  font-weight: 700;
  font-family: Rubik-Bold, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  margin: 0 0 0.25rem 0;
  color: #363636;
}
.ai-image-generation .option-card .option-description {
  font-size: 0.9rem;
  color: #888;
  margin: 0;
  line-height: 1.4;
  opacity: 0.9;
}
.ai-image-generation .option-card .option-badge {
  position: absolute;
  top: -0.5rem;
  right: -0.5rem;
  background: linear-gradient(135deg, #da0000 0%, rgb(141.5, 0, 0) 100%);
  color: #fff;
  font-size: 0.8rem;
  font-weight: 700;
  padding: 0.25rem 0.5rem;
  border-radius: 50rem;
  text-transform: uppercase;
  letter-spacing: 0.03125rem;
  box-shadow: 0 0.125rem 0.25rem rgba(218, 0, 0, 0.3);
  opacity: 0;
  transition: opacity 0.3s ease;
}
.ai-image-generation .option-card .option-control {
  margin-top: 1rem;
}
.ai-image-generation .form-select-wrapper {
  position: relative;
}
.ai-image-generation .form-select-wrapper .form-select {
  width: 100%;
  padding: 1rem 1.25rem;
  border: 0.125rem solid #dfdfdf;
  border-radius: 1rem;
  font-size: 1rem;
  font-family: Rubik, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  background-color: #fff;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  appearance: none;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%23666' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
  background-position: right 1rem center;
  background-repeat: no-repeat;
  background-size: 1rem;
  padding-right: 3rem;
}
.ai-image-generation .form-select-wrapper .form-select:hover {
  border-color: rgb(255, 141.5, 141.5);
}
.ai-image-generation .form-select-wrapper .form-select:focus {
  outline: none;
  border-color: #da0000;
  box-shadow: 0 0 0 0.1875rem rgba(218, 0, 0, 0.1);
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%23667eea' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
}
.ai-image-generation .checkbox-wrapper {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  cursor: pointer;
  text-align: left;
}
.ai-image-generation .checkbox-wrapper .checkbox-input {
  appearance: none;
  width: 1.25rem;
  height: 1.25rem;
  border: 0.125rem solid #dfdfdf;
  border-radius: 0.5rem;
  background: #fff;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  position: relative;
  flex-shrink: 0;
  margin-top: 0.125rem;
}
.ai-image-generation .checkbox-wrapper .checkbox-input:checked {
  background: linear-gradient(135deg, #da0000 0%, rgb(141.5, 0, 0) 100%);
  border-color: #da0000;
}
.ai-image-generation .checkbox-wrapper .checkbox-input:checked::after {
  content: "✓";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  font-size: 0.9rem;
  font-weight: 700;
}
.ai-image-generation .checkbox-wrapper .checkbox-input:focus {
  outline: none;
  box-shadow: 0 0 0 0.125rem rgba(218, 0, 0, 0.2);
}
.ai-image-generation .checkbox-wrapper .checkbox-content {
  flex: 1;
}
.ai-image-generation .checkbox-wrapper .checkbox-label {
  font-size: 1rem;
  font-weight: 500;
  color: #363636;
  margin: 0 0 0.25rem 0;
  cursor: pointer;
}
.ai-image-generation .checkbox-wrapper .checkbox-description {
  font-size: 0.9rem;
  color: #888;
  margin: 0;
  line-height: 1.4;
}
.ai-image-generation .option-tooltip {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1rem;
  height: 1rem;
  background: #888;
  color: #fff;
  border-radius: 50rem;
  font-size: 0.8rem;
  font-weight: 700;
  cursor: help;
  margin-left: 0.25rem;
}
.ai-image-generation .option-tooltip:hover::before, .ai-image-generation .option-tooltip:hover::after {
  opacity: 1;
  visibility: visible;
}
.ai-image-generation .option-tooltip::after {
  content: attr(data-tooltip);
  position: absolute;
  bottom: 150%;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(0, 0, 0, 0.9);
  color: #fff;
  padding: 0.5rem 0.75rem;
  border-radius: 0.5rem;
  font-size: 0.9rem;
  font-weight: 400;
  white-space: nowrap;
  z-index: 1000;
  animation: fadeIn 0.2s ease;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s ease;
}
.ai-image-generation .option-tooltip::before {
  content: "";
  position: absolute;
  bottom: 135%;
  left: 50%;
  transform: translateX(-50%);
  border: 0.3125rem solid transparent;
  border-top-color: rgba(0, 0, 0, 0.9);
  z-index: 1000;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s ease;
}
.ai-image-generation .generate-btn {
  width: 100%;
  padding: 1.5rem 2rem;
  background: linear-gradient(135deg, #da0000 0%, rgb(141.5, 0, 0) 100%);
  color: #fff;
  border: none;
  border-radius: 1.25rem;
  font-size: 1.2rem;
  font-weight: 700;
  font-family: Rubik-Bold, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  cursor: pointer;
  transition: all 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  position: relative;
  overflow: hidden;
  box-shadow: 0 0.75rem 1.5rem rgba(218, 0, 0, 0.3), inset 0 0.0625rem 0 rgba(255, 255, 255, 0.2);
  margin: 0;
}
.ai-image-generation .generate-btn::before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
  transition: left 0.5s ease;
}
.ai-image-generation .generate-btn:hover:not(:disabled) {
  transform: translateY(-0.25rem) scale(1.02);
  box-shadow: 0 1.25rem 2.5rem rgba(218, 0, 0, 0.4), inset 0 0.0625rem 0 rgba(255, 255, 255, 0.3);
}
.ai-image-generation .generate-btn:hover:not(:disabled)::before {
  left: 100%;
}
.ai-image-generation .generate-btn:hover:not(:disabled) .btn-icon {
  transform: scale(1.2) rotate(10deg);
}
.ai-image-generation .generate-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none !important;
}
.ai-image-generation .generate-btn.generating {
  background: linear-gradient(135deg, #ff0e0e 0%, rgb(141.5, 0, 0) 100%);
  animation: pulse 2s ease-in-out infinite;
}
.ai-image-generation .generate-btn .btn-icon {
  font-size: 1.2rem;
  transition: transform 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.ai-image-generation .generate-btn .btn-spinner {
  width: 1.25rem;
  height: 1.25rem;
  border: 0.125rem solid rgba(255, 255, 255, 0.3);
  border-top: 0.125rem solid #fff;
  border-radius: 50rem;
  animation: spin 1s linear infinite;
}
.ai-image-generation .btn {
  padding: 0.75rem 1.5rem;
  border-radius: 0.75rem;
  font-weight: 500;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  text-decoration: none;
  border: 1px solid transparent;
  font-size: 1rem;
  box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.05);
}
.ai-image-generation .btn .btn-icon {
  transition: transform 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.ai-image-generation .btn:hover .btn-icon {
  transform: scale(1.1);
}
.ai-image-generation .btn.btn-sm {
  padding: 0.5rem 1rem;
  font-size: 0.9rem;
}
.ai-image-generation .btn.btn-primary {
  background: linear-gradient(135deg, #da0000 0%, rgb(141.5, 0, 0) 100%);
  color: #fff;
  border-color: transparent;
  box-shadow: 0 0.5rem 1rem rgba(218, 0, 0, 0.3);
}
.ai-image-generation .btn.btn-primary:hover {
  transform: translateY(-0.125rem);
  box-shadow: 0 0.75rem 1.5rem rgba(218, 0, 0, 0.4);
}
.ai-image-generation .btn.btn-outline {
  background: #fff;
  border: 0.125rem solid #dfdfdf;
  color: #363636;
}
.ai-image-generation .btn.btn-outline:hover {
  border-color: #da0000;
  color: #da0000;
  background: rgba(218, 0, 0, 0.05);
  transform: translateY(-0.0625rem);
}
.ai-image-generation .results-panel .main-image-container {
  position: relative;
  border-radius: 1.25rem;
  overflow: hidden;
  margin-bottom: 1.5rem;
  background: #f9f9f9;
  box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.1);
  transition: transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.ai-image-generation .results-panel .main-image-container:hover {
  transform: scale(1.02);
}
.ai-image-generation .results-panel .main-image-container .main-generated-image {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.ai-image-generation .results-panel .main-image-container .image-info-overlay {
  position: absolute;
  top: 1.25rem;
  right: 1.25rem;
  background: rgba(0, 0, 0, 0.8);
  color: #fff;
  padding: 0.5rem 1rem;
  border-radius: 50rem;
  font-size: 0.9rem;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  backdrop-filter: blur(0.625rem);
  box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.3);
}
.ai-image-generation .results-panel .result-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1.5rem;
}
.ai-image-generation .results-panel .result-title {
  margin: 0;
  color: #363636;
  font-size: 1.4rem;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.ai-image-generation .results-panel .result-title .title-icon {
  filter: drop-shadow(0 0.125rem 0.25rem rgba(218, 0, 0, 0.3));
}
.ai-image-generation .results-panel .result-actions {
  display: flex;
  gap: 0.75rem;
}
.ai-image-generation .image-details {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
.ai-image-generation .image-details .detail-section {
  background: #f9f9f9;
  padding: 1.25rem;
  border-radius: 1rem;
  border-left: 0.25rem solid #da0000;
}
.ai-image-generation .image-details .detail-title {
  margin: 0 0 0.75rem 0;
  font-size: 1rem;
  font-weight: 500;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  color: #363636;
}
.ai-image-generation .image-details .detail-text {
  margin: 0;
  line-height: 1.6;
  color: #888;
  font-size: 1rem;
}
.ai-image-generation .settings-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.ai-image-generation .setting-tag {
  background: #fff;
  color: #363636;
  padding: 0.25rem 0.75rem;
  border-radius: 50rem;
  font-size: 0.9rem;
  font-weight: 500;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  border: 0.0625rem solid #dfdfdf;
  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.05);
  text-transform: uppercase;
  letter-spacing: 0.03125rem;
}
.ai-image-generation .setting-tag.model-tag {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  color: white;
  font-weight: 600;
  text-transform: uppercase;
  font-size: 11px;
  letter-spacing: 0.5px;
}
.ai-image-generation .setting-tag.enhanced {
  background-color: #e8f5e8;
  color: #2e7d32;
}
.ai-image-generation .empty-state {
  text-align: center;
  padding: 2.5rem 2rem;
}
.ai-image-generation .empty-state .empty-state-icon {
  font-size: 4rem;
  margin-bottom: 1.25rem;
  filter: drop-shadow(0 0.25rem 0.5rem rgba(0, 0, 0, 0.1));
  animation: float 3s ease-in-out infinite;
}
.ai-image-generation .empty-state .empty-state-title {
  margin: 0 0 1.25rem 0;
  font-size: 1.4rem;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-weight: 500;
  color: #363636;
}
.ai-image-generation .empty-state .empty-state-text {
  margin: 0 auto 2rem auto;
  color: #888;
  line-height: 1.6;
  font-size: 1rem;
  max-width: 25rem;
}
.ai-image-generation .empty-state .empty-state-features {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr));
  gap: 1.25rem;
  max-width: 25rem;
  margin: 0 auto;
}
.ai-image-generation .empty-state .feature-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.9rem;
  color: #888;
  transition: transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.ai-image-generation .empty-state .feature-item:hover {
  transform: translateY(-0.125rem);
  color: #363636;
}
.ai-image-generation .empty-state .feature-item .feature-icon {
  font-size: 1.8rem;
  filter: drop-shadow(0 0.125rem 0.25rem rgba(218, 0, 0, 0.2));
}
.ai-image-generation .gallery-title {
  margin: 0 0 1.25rem 0;
  color: #363636;
  font-size: 1.2rem;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.ai-image-generation .gallery-title .title-icon {
  filter: drop-shadow(0 0.125rem 0.25rem rgba(218, 0, 0, 0.3));
}
.ai-image-generation .gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(7.5rem, 1fr));
  gap: 1rem;
  margin-top: 1.25rem;
}
.ai-image-generation .gallery-item {
  position: relative;
  border-radius: 0.75rem;
  overflow: hidden;
  cursor: pointer;
  border: 0.1875rem solid transparent;
  transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  background: none;
  padding: 0;
  box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.1);
}
.ai-image-generation .gallery-item:hover {
  transform: translateY(-0.125rem) scale(1.05);
  box-shadow: 0 0.75rem 1.5rem rgba(0, 0, 0, 0.15);
}
.ai-image-generation .gallery-item:hover .gallery-overlay {
  opacity: 1;
}
.ai-image-generation .gallery-item.selected {
  border-color: #da0000;
  box-shadow: 0 0.75rem 1.5rem rgba(218, 0, 0, 0.3), 0 0 0 0.125rem rgba(218, 0, 0, 0.2);
}
.ai-image-generation .gallery-item .gallery-thumbnail {
  width: 100%;
  height: 7.5rem;
  object-fit: cover;
  transition: transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  display: block;
}
.ai-image-generation .gallery-item .gallery-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
  backdrop-filter: blur(0.125rem);
}
.ai-image-generation .gallery-item .overlay-icon {
  color: #fff;
  font-size: 1.8rem;
  filter: drop-shadow(0 0.125rem 0.25rem rgba(0, 0, 0, 0.5));
}
.ai-image-generation .error-message {
  background: linear-gradient(135deg, #ffc5c5 0%, #fff8f8 100%);
  border: 0.0625rem solid #ff4141;
  border-radius: 1.25rem;
  padding: 1.5rem;
  margin-top: 1.25rem;
  position: relative;
  box-shadow: 0 0.5rem 1rem rgba(218, 0, 0, 0.1);
  animation: slideIn 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.ai-image-generation .error-message .error-content {
  display: flex;
  align-items: flex-start;
  gap: 1.25rem;
}
.ai-image-generation .error-message .error-icon {
  font-size: 2rem;
  flex-shrink: 0;
  filter: drop-shadow(0 0.125rem 0.25rem rgba(218, 0, 0, 0.3));
}
.ai-image-generation .error-message .error-text {
  flex: 1;
  text-align: left;
}
.ai-image-generation .error-message .error-text strong {
  color: #da0000;
  font-size: 1.2rem;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-weight: 500;
  display: block;
  margin-bottom: 0.5rem;
}
.ai-image-generation .error-message .error-text p {
  color: rgb(141.5, 0, 0);
  margin: 0;
  line-height: 1.5;
  font-size: 1rem;
}
.ai-image-generation .error-message .error-dismiss {
  position: absolute;
  top: 1.25rem;
  right: 1.25rem;
  background: none;
  border: none;
  font-size: 1.8rem;
  color: #da0000;
  cursor: pointer;
  width: 2rem;
  height: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50rem;
  transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.ai-image-generation .error-message .error-dismiss:hover {
  background: rgba(218, 0, 0, 0.1);
  transform: scale(1.1);
}
.ai-image-generation .error-message.animate-shake {
  animation: shake 0.5s ease-in-out;
}
.ai-image-generation {
  /*
  * ==========================================================================
  * 3. Status Indicators (Not nested in .ai-image-generation)
  * ==========================================================================
  */
}
.ai-image-generation .generation-status {
  padding: 1.25rem;
  border-radius: 0.75rem;
  margin: 1.25rem 0;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 14px;
  box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.05);
  animation: slideIn 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.ai-image-generation .generation-status .status-icon {
  font-size: 16px;
}
.ai-image-generation .generation-status .status-message {
  flex: 1;
}
.ai-image-generation .generation-status.loading {
  background-color: #e3f2fd;
  color: #1976d2;
  border: 1px solid #90caf9;
}
.ai-image-generation .generation-status.loading .status-icon {
  animation: pulse 2s ease-in-out infinite;
}
.ai-image-generation .generation-status.success {
  background-color: #e8f5e8;
  color: #2e7d32;
  border: 1px solid #a5d6a7;
}
.ai-image-generation .generation-status.error {
  background-color: #ffebee;
  color: #c62828;
  border: 1px solid #ef9a9a;
}
.ai-image-generation .generation-status.warning {
  background-color: #fff8e1;
  color: #f57f17;
  border: 1px solid #ffcc02;
}
.ai-image-generation .progress-bar {
  flex: 1;
  height: 0.25rem;
  background: rgba(255, 255, 255, 0.3);
  border-radius: 0.5rem;
  overflow: hidden;
  margin-left: 1rem;
}
.ai-image-generation .progress-bar .progress-fill {
  height: 100%;
  background: linear-gradient(135deg, #da0000 0%, rgb(141.5, 0, 0) 100%);
  border-radius: 0.5rem;
  animation: progress 3s ease-in-out infinite;
}
.ai-image-generation .progress-text {
  text-align: center;
  color: #888;
  font-size: 0.9rem;
  font-style: italic;
  margin-top: 0.75rem;
  font-family: Rubik-Light, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
.ai-image-generation .form-validation-hints {
  margin-top: 12px;
}
.ai-image-generation .validation-hint {
  font-size: 13px;
  margin: 4px 0;
  padding: 6px 10px;
  border-radius: 4px;
  background-color: #f5f5f5;
  color: #666;
}
.ai-image-generation .validation-hint.error {
  background-color: #ffebee;
  color: #c62828;
  border: 1px solid #ef9a9a;
}
.ai-image-generation {
  /*
  * ==========================================================================
  * 4. Responsive Design
  * ==========================================================================
  */
}
@media (max-width: 64rem) {
  .ai-image-generation .content-grid,
  .ai-image-generation .template-grid,
  .ai-image-generation .advanced-options-grid {
    grid-template-columns: 1fr;
  }
  .ai-image-generation .content-grid {
    gap: 2rem;
  }
}
@media (max-width: 48rem) {
  .ai-image-generation {
    padding: 1.25rem;
  }
  .ai-image-generation .header-section {
    flex-direction: column;
    align-items: flex-start;
    gap: 1.25rem;
    text-align: left;
  }
  .ai-image-generation .page-title {
    font-size: 1.8rem;
  }
  .ai-image-generation .panel-card {
    padding: 1.5rem;
  }
  .ai-image-generation .result-actions {
    flex-direction: column;
    gap: 0.5rem;
  }
  .ai-image-generation .gallery-grid {
    grid-template-columns: repeat(auto-fill, minmax(6.25rem, 1fr));
    gap: 0.5rem;
  }
  .ai-image-generation .template-card {
    flex-direction: column;
    text-align: center;
    padding: 1.5rem;
  }
  .ai-image-generation .template-card .template-icon {
    margin-right: 0;
    margin-bottom: 1rem;
  }
  .ai-image-generation .advanced-options-grid {
    gap: 1.25rem;
  }
  .ai-image-generation .option-card {
    padding: 1.25rem;
  }
  .ai-image-generation .option-header {
    gap: 0.75rem;
  }
  .ai-image-generation .option-icon {
    width: 2rem;
    height: 2rem;
    font-size: 1.2rem;
  }
  .ai-image-generation .toggle-content {
    gap: 0.75rem;
  }
  .ai-image-generation .toggle-icon {
    width: 2.5rem;
    height: 2.5rem;
    font-size: 1.2rem;
  }
  .ai-image-generation .service-status {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
}
@media (max-width: 30rem) {
  .ai-image-generation {
    padding: 1rem;
  }
  .ai-image-generation .panel-card {
    padding: 1.25rem;
  }
  .ai-image-generation .page-title {
    font-size: 1.4rem;
  }
  .ai-image-generation .page-title .title-icon {
    font-size: 1.2rem;
  }
  .ai-image-generation .generate-btn {
    padding: 1.25rem 1.5rem;
    font-size: 1rem;
  }
  .ai-image-generation .input-field,
  .ai-image-generation .custom-prompt-textarea {
    padding: 1rem;
  }
  .ai-image-generation .advanced-toggle {
    padding: 1rem;
  }
}
.ai-image-generation {
  /*
  * ==========================================================================
  * 5. Animations
  * ==========================================================================
  */
}
@keyframes service-status-pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.7);
  }
  70% {
    box-shadow: 0 0 0 6px rgba(16, 185, 129, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(16, 185, 129, 0);
  }
}
@keyframes service-status-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes slideDown {
  from {
    opacity: 0;
    max-height: 0;
    padding-top: 0;
    margin-top: 0;
  }
  to {
    opacity: 1;
    max-height: 500px;
    padding-top: 1.25rem;
    margin-top: 1.25rem;
  }
}
@keyframes slideIn {
  from {
    opacity: 0;
    transform: translateX(100%);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes shake {
  0%, 100% {
    transform: translateX(0);
  }
  25% {
    transform: translateX(-0.3125rem);
  }
  75% {
    transform: translateX(0.3125rem);
  }
}
@keyframes bounceIn {
  0% {
    opacity: 0;
    transform: scale(0.3);
  }
  50% {
    opacity: 1;
    transform: scale(1.05);
  }
  70% {
    transform: scale(0.9);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes pulse {
  50% {
    opacity: 0.8;
    transform: scale(1.02);
  }
}
@keyframes float {
  50% {
    transform: translateY(-0.625rem);
  }
}
@keyframes shimmer {
  100% {
    background-position: -200% 0;
  }
}
@keyframes progress {
  0% {
    width: 0%;
    transform: translateX(-100%);
  }
  50% {
    width: 60%;
    transform: translateX(0%);
  }
  100% {
    width: 100%;
    transform: translateX(100%);
  }
}
.ai-image-generation {
  /*
  * ==========================================================================
  * 6. Animation Utility Classes
  * ==========================================================================
  */
}
.ai-image-generation .animate-slide-up {
  animation: slideUp 0.4s cubic-bezier(0.215, 0.61, 0.355, 1);
}
@keyframes slideUp {
  from {
    opacity: 0;
    transform: translateY(1.25rem);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.ai-image-generation .animate-success {
  animation: success 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
@keyframes success {
  50% {
    transform: scale(1.05);
  }
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.textarea-container {
  position: relative;
}
.textarea-container.voice-enabled {
  position: relative;
}

.voice-prompt-component {
  display: inline-block;
  position: absolute;
  bottom: 3.5rem;
}

.voice-icon-btn {
  position: absolute;
  right: 0.75rem;
  top: 50%;
  transform: translateY(-50%);
  width: 2.25rem;
  height: 2.25rem;
  border: none;
  background: #da0000;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3rem ease;
  box-shadow: 0 0.125rem 0.5rem rgba(102, 126, 234, 0.3);
  z-index: 2;
}
.voice-icon-btn:hover:not(.disabled) {
  transform: translateY(-50%) scale(1.1);
  box-shadow: 0 0.25rem 1rem rgba(102, 126, 234, 0.4);
}
.voice-icon-btn:active:not(.disabled) {
  transform: translateY(-50%) scale(0.95);
}
.voice-icon-btn:focus {
  outline: 0.125rem solid #667eea;
  outline-offset: 0.125rem;
}
.voice-icon-btn.disabled {
  opacity: 0.5;
  cursor: not-allowed;
  background: #a9a9a9;
}
@media (max-width: 40rem) {
  .voice-icon-btn {
    width: 2rem;
    height: 2rem;
    right: 0.5rem;
  }
}

.voice-icon {
  width: 1.125rem;
  height: 1.125rem;
  color: #fff;
  transition: all 0.3rem ease;
}
.voice-icon.listening {
  animation: pulse-listening 1.5s infinite;
  color: #da0000;
}
@media (max-width: 40rem) {
  .voice-icon {
    width: 1rem;
    height: 1rem;
  }
}

.voice-modal-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.8);
  backdrop-filter: blur(0.5rem);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 500;
  animation: fade-in 0.3rem ease;
}

.voice-modal {
  background: #fff;
  border-radius: 1.5rem;
  width: 90%;
  max-width: 31.25rem;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 1.563rem 3.125rem -0.75rem rgba(0, 0, 0, 0.2);
  animation: slide-up 0.4s ease;
  position: relative;
  font-family: Rubik, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
@media (max-width: 40rem) {
  .voice-modal {
    width: 95%;
    margin: 0.625rem;
    border-radius: 1rem;
  }
}
@media (prefers-color-scheme: dark) {
  .voice-modal {
    background: #363636;
    color: #fff;
  }
}
@media (prefers-contrast: high) {
  .voice-modal {
    border: 0.125rem solid #000;
  }
}

.voice-modal-header {
  padding: 1.5rem 1.5rem 0.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 0.063rem solid #eee;
  margin-bottom: 1.5rem;
}
@media (max-width: 40rem) {
  .voice-modal-header {
    padding: 1.25rem 1.25rem 0;
  }
}
@media (prefers-color-scheme: dark) {
  .voice-modal-header {
    border-bottom-color: #666;
  }
}

.voice-modal-title {
  font-size: 1.2rem;
  font-weight: 700;
  color: #000;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-family: Rubik-Bold, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
@media (max-width: 40rem) {
  .voice-modal-title {
    font-size: 1.25rem;
  }
}
@media (prefers-color-scheme: dark) {
  .voice-modal-title {
    color: #fff;
  }
}

.title-icon {
  font-size: 1.75rem;
}

.voice-modal-close {
  width: 2.25rem;
  height: 2.25rem;
  border: none;
  background: #f4f4f4;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 1.25rem;
  font-weight: 700;
  color: #888;
  transition: all 0.2s ease;
}
.voice-modal-close:hover {
  background: #eee;
  color: #666;
}

.voice-language-section {
  padding: 0 1.5rem 1.5rem;
  border-bottom: 0.063rem solid #eee;
  margin-bottom: 1.5rem;
}
@media (max-width: 40rem) {
  .voice-language-section {
    padding: 0 1.25rem 1.25rem;
  }
}
@media (prefers-color-scheme: dark) {
  .voice-language-section {
    border-bottom-color: #666;
  }
}

.voice-label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 500;
  color: #666;
  margin-bottom: 0.5rem;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}

.label-icon {
  font-size: 1rem;
}

.voice-language-select {
  width: 100%;
  padding: 0.75rem 1rem;
  border: 0.125rem solid #eee;
  border-radius: 0.4rem;
  font-size: 1rem;
  background: #fff;
  cursor: pointer;
  transition: border-color 0.2s ease;
  font-family: Rubik, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
.voice-language-select:focus {
  outline: none;
  border-color: #667eea;
  box-shadow: 0 0 0 0.188rem rgba(102, 126, 234, 0.1);
}
@media (prefers-color-scheme: dark) {
  .voice-language-select {
    background: #666;
    border-color: #888;
    color: #fff;
  }
}

.voice-recording-interface {
  padding: 0 1.5rem 1.5rem;
  min-height: 18.75rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
@media (max-width: 40rem) {
  .voice-recording-interface {
    padding: 0 1.25rem 1.25rem;
  }
}

.recording-active,
.recording-error,
.recording-success,
.recording-initial {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  width: 100%;
}

.recording-active {
  gap: 1.5rem;
}

.recording-animation {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.recording-circle {
  width: 7.5rem;
  height: 7.5rem;
  border-radius: 50%;
  background: linear-gradient(135deg, #da0000 0%, #dc2626 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0.5rem 2rem rgba(239, 68, 68, 0.3);
  position: relative;
}
.recording-circle.pulse {
  animation: pulse-record 2s infinite;
}
@media (max-width: 40rem) {
  .recording-circle {
    width: 6.25rem;
    height: 6.25rem;
  }
}

.recording-inner {
  width: 5rem;
  height: 5rem;
  background: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (max-width: 40rem) {
  .recording-inner {
    width: 4.375rem;
    height: 4.375rem;
  }
}

.recording-mic-icon {
  width: 2.25rem;
  height: 2.25rem;
  color: #da0000;
}
@media (max-width: 40rem) {
  .recording-mic-icon {
    width: 1.875rem;
    height: 1.875rem;
  }
}

.recording-status {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.recording-text {
  font-size: 1.25rem;
  font-weight: 700;
  color: #da0000;
  margin: 0;
  animation: fade-pulse 2s infinite;
  font-family: Rubik-Bold, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}

.recording-hint {
  font-size: 0.8rem;
  color: #888;
  margin: 0;
  max-width: 17.5rem;
}

.recording-tip {
  font-size: 0.8rem;
  color: #888;
  margin: 0.5rem 0 0 0;
  text-align: center;
}

.recording-timer {
  font-size: 1rem;
  font-weight: 500;
  color: #666;
  padding: 0.5rem 1rem;
  background: #f4f4f4;
  border-radius: 1.25rem;
  margin-top: 0.5rem;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}

.recording-progress {
  width: 100%;
  height: 0.25rem;
  background: #eee;
  border-radius: 0.125rem;
  overflow: hidden;
}

.progress-bar {
  height: 100%;
  background: #da0000;
  border-radius: 0.125rem;
  transition: width 0.1s linear;
}

.recording-actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}

.recording-error {
  gap: 1rem;
  color: #da0000;
}

.error-icon {
  font-size: 4rem;
  margin-bottom: 0.5rem;
}

.error-title {
  font-size: 1.25rem;
  font-weight: 700;
  margin: 0;
  color: #da0000;
  font-family: Rubik-Bold, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}

.error-message {
  font-size: 0.8rem;
  color: #888;
  margin: 0;
  max-width: 20rem;
  line-height: 1.5;
}

.error-actions {
  display: flex;
  gap: 0.75rem;
  margin-top: 0.5rem;
}
@media (max-width: 40rem) {
  .error-actions {
    flex-direction: column;
    width: 100%;
  }
}

.recording-success {
  gap: 1.25rem;
}

.success-icon {
  font-size: 4rem;
  margin-bottom: 0.5rem;
}

.success-title {
  font-size: 1.25rem;
  font-weight: 700;
  margin: 0;
  color: #3dac43;
  font-family: Rubik-Bold, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}

.transcript-container {
  width: 100%;
  background: #f8f8f8;
  border-radius: 1rem;
  padding: 1.25rem;
  border: 0.125rem solid #dfdfdf;
}
@media (prefers-color-scheme: dark) {
  .transcript-container {
    background: #666;
    border-color: #888;
  }
}

.transcript-label {
  font-size: 0.8rem;
  font-weight: 500;
  color: #888;
  display: block;
  margin-bottom: 0.75rem;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}

.transcript-text {
  font-size: 1rem;
  color: #000;
  line-height: 1.6;
  background: #fff;
  padding: 1rem;
  border-radius: 0.4rem;
  border: 0.063rem solid #dfdfdf;
  margin-bottom: 1rem;
  min-height: 3.75rem;
  word-wrap: break-word;
}
@media (prefers-color-scheme: dark) {
  .transcript-text {
    background: #363636;
    border-color: #888;
    color: #fff;
  }
}

.confidence-indicator {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.confidence-label {
  font-size: 0.8rem;
  font-weight: 500;
  color: #888;
  min-width: 3.75rem;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}

.confidence-bar {
  flex: 1;
  height: 0.5rem;
  background: #dfdfdf;
  border-radius: 0.25rem;
  overflow: hidden;
}

.confidence-fill {
  height: 100%;
  border-radius: 0.25rem;
  transition: width 0.5s ease;
}
.confidence-fill.confidence-excellent {
  background: linear-gradient(90deg, #3dac43, #059669);
}
.confidence-fill.confidence-good {
  background: linear-gradient(90deg, #3b82f6, #2563eb);
}
.confidence-fill.confidence-fair {
  background: linear-gradient(135deg, #f59e0b 0%, #a16207 100%);
}
.confidence-fill.confidence-poor {
  background: linear-gradient(135deg, #da0000 0%, #dc2626 100%);
}

.confidence-value {
  font-size: 0.8rem;
  font-weight: 700;
  color: #666;
  min-width: 2.5rem;
  text-align: right;
  font-family: Rubik-Bold, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}

.success-actions {
  display: flex;
  gap: 0.75rem;
  flex-wrap: wrap;
  justify-content: center;
}
@media (max-width: 40rem) {
  .success-actions {
    flex-direction: column;
    width: 100%;
  }
}

.recording-initial {
  gap: 1.25rem;
}

.initial-icon {
  font-size: 4rem;
  margin-bottom: 0.5rem;
}

.initial-title {
  font-size: 1.25rem;
  font-weight: 700;
  margin: 0;
  color: #000;
  font-family: Rubik-Bold, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
@media (prefers-color-scheme: dark) {
  .initial-title {
    color: #fff;
  }
}

.initial-description {
  font-size: 0.8rem;
  color: #888;
  margin: 0;
  max-width: 22.5rem;
  line-height: 1.6;
}

.recording-tips {
  background: #f8f8f8;
  border-radius: 1rem;
  padding: 1.25rem;
  width: 100%;
  max-width: 25rem;
  text-align: left;
}
@media (prefers-color-scheme: dark) {
  .recording-tips {
    background: #666;
  }
}

.tips-title {
  font-size: 1rem;
  font-weight: 700;
  color: #666;
  margin: 0 0 0.75rem 0;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-family: Rubik-Bold, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}

.tips-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.tips-list li {
  font-size: 0.8rem;
  color: #888;
  line-height: 1.5;
  position: relative;
  padding-left: 1.25rem;
}
.tips-list li::before {
  content: "•";
  position: absolute;
  left: 0;
  color: #667eea;
  font-weight: 700;
}

.permission-notice {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 1rem;
  background: #fef3c7;
  border: 0.063rem solid #f59e0b;
  border-radius: 0.4rem;
  font-size: 0.8rem;
  color: #854d0e;
  max-width: 22.5rem;
}
@media (prefers-color-scheme: dark) {
  .permission-notice {
    background: #451a03;
    border-color: #a16207;
    color: #f59e0b;
  }
}
.permission-notice p {
  margin: 0;
  line-height: 1.4;
}

.notice-icon {
  font-size: 1rem;
}

.voice-btn {
  padding: 0.75rem 1.5rem;
  border-radius: 0.4rem;
  border: none;
  font-size: 0.8rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s ease;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  text-decoration: none;
  min-height: 3rem;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
.voice-btn:focus {
  outline: 0.125rem solid currentColor;
  outline-offset: 0.125rem;
}
@media (max-width: 40rem) {
  .voice-btn {
    width: 100%;
    justify-content: center;
  }
}
.voice-btn-record {
  background: #da0000;
  color: #fff;
  box-shadow: 0 0.25rem 1rem rgba(102, 126, 234, 0.3);
}
.voice-btn-record:hover {
  transform: translateY(-0.125rem);
  box-shadow: 0 0.375rem 1.25rem rgba(102, 126, 234, 0.4);
}
.voice-btn-stop {
  background: linear-gradient(135deg, #da0000 0%, #dc2626 100%);
  color: #fff;
  box-shadow: 0 0.25rem 1rem rgba(239, 68, 68, 0.3);
}
.voice-btn-stop:hover {
  transform: translateY(-0.125rem);
  box-shadow: 0 0.375rem 1.25rem rgba(239, 68, 68, 0.4);
}
.voice-btn-primary {
  background: linear-gradient(135deg, #3dac43 0%, #047857 100%);
  color: #fff;
  box-shadow: 0 0.25rem 1rem rgba(5, 150, 105, 0.3);
}
.voice-btn-primary:hover {
  transform: translateY(-0.125rem);
  box-shadow: 0 0.375rem 1.25rem rgba(5, 150, 105, 0.4);
}
.voice-btn-retry {
  background: #da0000;
  color: #fff;
  box-shadow: 0 0.25rem 1rem rgba(245, 158, 11, 0.3);
}
.voice-btn-retry:hover {
  transform: translateY(-0.125rem);
  box-shadow: 0 0.375rem 1.25rem rgba(245, 158, 11, 0.4);
}
.voice-btn-outline {
  background: #fff;
  color: #888;
  border: 2px solid #dfdfdf;
}
.voice-btn-outline:hover {
  background: #f9f9f9;
  border-color: #a9a9a9;
  color: #666;
}
@media (prefers-contrast: high) {
  .voice-btn-outline {
    border-width: 0.188rem;
  }
}

.btn-icon {
  font-size: 1rem;
}

.custom-prompt-textarea {
  padding-right: 3.75rem;
}
.custom-prompt-textarea.voice-success {
  border-color: #3dac43;
  box-shadow: 0 0 0 0.188rem rgba(16, 185, 129, 0.1);
  animation: voice-success-pulse 2s ease;
}
@media (max-width: 40rem) {
  .custom-prompt-textarea {
    padding-right: 3.125rem;
  }
}

.voice-hint {
  color: #667eea;
  font-size: 0.7rem;
  font-weight: 500;
  margin-left: 0.5rem;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}

@keyframes pulse-listening {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.2);
  }
}
@keyframes fade-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes slide-up {
  from {
    opacity: 0;
    transform: translateY(1.875rem) scale(0.9);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
@keyframes pulse-record {
  0% {
    transform: scale(1);
    box-shadow: 0 0.5rem 2rem rgba(239, 68, 68, 0.3);
  }
  50% {
    transform: scale(1.05);
    box-shadow: 0 0.75rem 2.5rem rgba(239, 68, 68, 0.5);
  }
  100% {
    transform: scale(1);
    box-shadow: 0 0.5rem 2rem rgba(239, 68, 68, 0.3);
  }
}
@keyframes fade-pulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.7;
  }
}
@keyframes voice-success-pulse {
  0% {
    border-color: #3dac43;
    box-shadow: 0 0 0 0.188rem rgba(16, 185, 129, 0.1);
  }
  50% {
    border-color: #059669;
    box-shadow: 0 0 0 0.375rem rgba(16, 185, 129, 0.2);
  }
  100% {
    border-color: #eee;
    box-shadow: none;
  }
}
.voice-modal * {
  animation-delay: 0.1s;
  animation-fill-mode: both;
}

.tenant-creation-wizard {
  max-width: 50rem;
  margin: 0 auto;
  padding: 1.5rem;
}
.tenant-creation-wizard .wizard-progress {
  margin-bottom: 3rem;
}
.tenant-creation-wizard .progress-bar {
  height: 0.25rem;
  background-color: #eee;
  border-radius: 0.125rem;
  overflow: hidden;
  margin-bottom: 1.5rem;
}
.tenant-creation-wizard .progress-fill {
  height: 100%;
  background: linear-gradient(90deg, #da0000 0%, #a70000 100%);
  transition: width 0.5s ease;
}
.tenant-creation-wizard .steps-indicator {
  display: flex;
  justify-content: space-between;
  position: relative;
}
.tenant-creation-wizard .step {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
  position: relative;
}
.tenant-creation-wizard .step:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 1.2rem;
  left: 50%;
  width: 100%;
  height: 2px;
  background-color: #eee;
  z-index: -1;
}
.tenant-creation-wizard .step.completed:not(:last-child)::after {
  background-color: #da0000;
}
.tenant-creation-wizard .step-circle {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  background-color: #eee;
  color: #888;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  transition: all 0.3s ease;
  position: relative;
  z-index: 1;
}
.tenant-creation-wizard .step.active .step-circle {
  background-color: #da0000;
  color: #fff;
  box-shadow: 0 0 0 0.25rem rgba(218, 0, 0, 0.1);
}
.tenant-creation-wizard .step.completed .step-circle {
  background-color: #da0000;
  color: #fff;
}
.tenant-creation-wizard .step-label {
  margin-top: 0.5rem;
  font-size: 0.8rem;
  color: #888;
  text-align: center;
}
.tenant-creation-wizard .step.active .step-label {
  color: #000;
  font-weight: 500;
}
.tenant-creation-wizard .wizard-content {
  background: #fff;
  border-radius: 0.4rem;
  box-shadow: 0 0.25rem 0.375rem -0.063rem rgba(0, 0, 0, 0.1), 0 0.125rem 0.25rem -0.063rem rgba(0, 0, 0, 0.1);
  padding: 2.5rem;
}
.tenant-creation-wizard .error-message {
  background-color: #ffc5c5;
  border: 1px solid #ff4141;
  color: #da0000;
  padding: 1rem;
  border-radius: 0.4rem;
  margin-bottom: 1.5rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  max-width: 39rem;
}
.tenant-creation-wizard .error-icon {
  width: 1.2rem;
  height: 1.2rem;
  fill: currentColor;
  flex-shrink: 0;
}
.tenant-creation-wizard .step-content h2 {
  font-size: 1.8rem;
  font-weight: 700;
  color: #000;
  margin-bottom: 0.5rem;
  font-family: Rubik-Bold, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
.tenant-creation-wizard .step-description {
  color: #888;
  margin-bottom: 1.5rem;
  font-family: Rubik, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
.tenant-creation-wizard .form-group {
  margin-bottom: 1.5rem;
}
.tenant-creation-wizard .form-group label {
  display: block;
  font-weight: 500;
  color: #363636;
  margin-bottom: 0.5rem;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
.tenant-creation-wizard .required {
  color: #da0000;
}
.tenant-creation-wizard .form-input {
  width: 100%;
  padding: 0.75rem 1rem;
  border: 1px solid #dfdfdf;
  border-radius: 0.4rem;
  font-size: 1rem;
  font-family: Rubik, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  transition: all 0.2s ease;
}
.tenant-creation-wizard .form-input:focus {
  outline: none;
  border-color: #da0000;
  box-shadow: 0 0 0 3px rgba(218, 0, 0, 0.1);
}
.tenant-creation-wizard .form-select {
  appearance: none;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%23888888' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3E%3C/svg%3E");
  background-position: right 0.5rem center;
  background-repeat: no-repeat;
  background-size: 1.5em 1.5em;
  padding-right: 2.5rem;
}
.tenant-creation-wizard input[type=date] {
  position: relative;
}
.tenant-creation-wizard input[type=date]::-webkit-calendar-picker-indicator {
  position: absolute;
  right: 0.5rem;
  cursor: pointer;
}
.tenant-creation-wizard .field-hint {
  font-size: 0.8rem;
  color: #888;
  margin-top: 0.5rem;
  font-family: Rubik, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
.tenant-creation-wizard .form-actions {
  display: flex;
  gap: 1rem;
  justify-content: flex-end;
  margin-top: 1.5rem;
}
.tenant-creation-wizard .btn {
  padding: 0.75rem 1.5rem;
  border-radius: 0.4rem;
  font-weight: 500;
  border: none;
  cursor: pointer;
  transition: all 0.2s ease;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-size: 1rem;
}
.tenant-creation-wizard .btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.tenant-creation-wizard .btn-primary {
  background: linear-gradient(135deg, #da0000 0%, rgb(141.5, 0, 0) 100%);
  color: #fff;
}
.tenant-creation-wizard .btn-primary:hover:not(:disabled) {
  transform: translateY(-1px);
  box-shadow: 0 0.25rem 0.75rem rgba(218, 0, 0, 0.3);
}
.tenant-creation-wizard .btn-secondary {
  background-color: #f4f4f4;
  color: #363636;
}
.tenant-creation-wizard .btn-secondary:hover:not(:disabled) {
  background-color: #eee;
}
.tenant-creation-wizard .btn-icon {
  width: 1.2rem;
  height: 1.2rem;
  fill: currentColor;
}
.tenant-creation-wizard .processing-steps {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
.tenant-creation-wizard .processing-item {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  opacity: 0.5;
  transition: all 0.3s ease;
}
.tenant-creation-wizard .processing-item.active {
  opacity: 1;
}
.tenant-creation-wizard .processing-icon {
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background-color: #f4f4f4;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.tenant-creation-wizard .processing-item.active .processing-icon {
  background-color: #dbeafe;
}
.tenant-creation-wizard .processing-item.completed .processing-icon {
  background-color: #ffa7a7;
}
.tenant-creation-wizard .processing-details {
  flex: 1;
}
.tenant-creation-wizard .processing-details h3 {
  font-size: 1.125rem;
  font-weight: 700;
  color: #000;
  margin-bottom: 0.5rem;
  font-family: Rubik-Bold, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
.tenant-creation-wizard .mini-progress {
  height: 0.5rem;
  background-color: #eee;
  border-radius: 0.25rem;
  overflow: hidden;
}
.tenant-creation-wizard .mini-progress-fill {
  height: 100%;
  background-color: #da0000;
  transition: width 0.5s ease;
}
.tenant-creation-wizard .spinner {
  width: 1.5rem;
  height: 1.5rem;
  border: 3px solid #eee;
  border-top-color: #da0000;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}
.tenant-creation-wizard .btn-spinner {
  width: 1rem;
  height: 1rem;
  border: 2px solid rgba(255, 255, 255, 0.3);
  border-top-color: #fff;
  border-radius: 50%;
  animation: spin 1s linear infinite;
  display: inline-block;
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
.tenant-creation-wizard .checkmark {
  width: 1.5rem;
  height: 1.5rem;
  fill: #fff;
}
.tenant-creation-wizard .pending-icon {
  width: 1.5rem;
  height: 1.5rem;
  fill: #888;
}
.tenant-creation-wizard .roles-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(12.5rem, 1fr));
  gap: 1rem;
}
.tenant-creation-wizard .role-checkbox {
  display: flex;
  align-items: center;
  padding: 0.75rem;
  border: 1px solid #dfdfdf;
  border-radius: 0.4rem;
  cursor: pointer;
  transition: all 0.2s ease;
}
.tenant-creation-wizard .role-checkbox:hover {
  border-color: #da0000;
  background-color: #f7f7f7;
}
.tenant-creation-wizard .role-checkbox input {
  margin-right: 0.75rem;
}
.tenant-creation-wizard .role-label {
  font-weight: 500;
  color: #363636;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
.tenant-creation-wizard .success-animation {
  text-align: center;
  margin-bottom: 1.5rem;
}
.tenant-creation-wizard .success-checkmark {
  width: 5rem;
  height: 5rem;
}
.tenant-creation-wizard .success-checkmark-circle {
  stroke-dasharray: 166;
  stroke-dashoffset: 166;
  stroke-width: 2;
  stroke-miterlimit: 10;
  stroke: #da0000;
  fill: none;
}
.tenant-creation-wizard .success-checkmark-check {
  transform-origin: 50% 50%;
  stroke-dasharray: 48;
  stroke-dashoffset: 48;
  stroke: #da0000;
  stroke-width: 2;
}
.tenant-creation-wizard .animate .success-checkmark-circle {
  animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
}
.tenant-creation-wizard .animate .success-checkmark-check {
  animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards;
}
@keyframes stroke {
  100% {
    stroke-dashoffset: 0;
  }
}
.tenant-creation-wizard .summary {
  background-color: #f7f7f7;
  border-radius: 0.4rem;
  padding: 1.5rem;
  margin-top: 1.5rem;
}
.tenant-creation-wizard .summary-item {
  display: flex;
  justify-content: space-between;
  padding: 0.75rem 0;
  border-bottom: 1px solid #dfdfdf;
}
.tenant-creation-wizard .summary-item:last-child {
  border-bottom: none;
}
.tenant-creation-wizard .summary-label {
  font-weight: 500;
  color: #888;
  font-family: Rubik-Medium, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}
.tenant-creation-wizard .summary-value {
  font-weight: 700;
  color: #000;
  font-family: Rubik-Bold, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.sort-field-wrapper {
  position: relative;
}

.has-unsaved-changes input {
  border-left: 3px solid #000;
}

.unsaved-indicator {
  display: flex;
  align-items: center;
  gap: 0;
  margin-top: 4px;
  font-size: 13px;
}

.unsaved-text {
  color: #000;
  font-weight: 500;
  padding-bottom: 0.5rem;
}

.save-button {
  padding: 4px 12px;
  background-color: #da0000;
  color: #fff;
  border: none;
  border-radius: 4px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: background-color 0.2s;
  margin-bottom: 0.5rem;
  margin-left: 0;
}
.save-button:hover {
  background-color: #da0000;
}

.save-button:hover:not(:disabled) {
  background-color: #ea6363;
}

.save-button:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.sort-trigger-container {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  cursor: pointer;
  padding: 2px 0.375rem;
  border-radius: 0.125rem;
  transition: background-color 0.15s;
}
.sort-trigger-container:hover {
  background-color: rgba(59, 130, 246, 0.1);
}
.sort-trigger-container:hover .sort-edit-icon {
  opacity: 0.8;
}

.sort-display-value {
  font-weight: 500;
  min-width: 1.25rem;
  text-align: center;
  font-size: 0.875rem;
}

.sort-edit-icon {
  opacity: 0.4;
  transition: opacity 0.15s;
  width: 0.875rem;
  height: 0.875rem;
  display: flex;
  align-items: center;
}

.sort-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.8);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 500;
  backdrop-filter: blur(2px);
  animation: fadeIn 0.2s ease-out;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes slideUp {
  from {
    transform: translateY(1.25rem);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}
.sort-modal-content {
  background: #fff;
  border-radius: 0.4rem;
  box-shadow: 0 1.25rem 3.75rem rgba(0, 0, 0, 0.4);
  max-width: 33.75rem;
  width: 92%;
  max-height: 85vh;
  display: flex;
  flex-direction: column;
  animation: slideUp 0.25s ease-out;
}

.sort-modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.5rem 1.75rem 1.25rem;
  border-bottom: 1px solid #dfdfdf;
}
.sort-modal-header h3 {
  margin: 0;
  font-size: 1.25rem;
  font-weight: 700;
  color: #363636;
}

.sort-modal-close {
  background: none;
  border: none;
  cursor: pointer;
  padding: 0.375rem;
  opacity: 0.5;
  transition: all 0.15s;
  border-radius: 0.375rem;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
}
.sort-modal-close:hover {
  opacity: 1;
  background-color: #f4f4f4;
}
.sort-modal-close svg {
  width: 1.25rem;
  height: 1.25rem;
}

.sort-modal-body {
  padding: 1.75rem;
  overflow-y: auto;
  flex: 1;
  min-height: 0;
}

.sort-modal-loading {
  text-align: center;
  padding: 3.75rem 1.25rem;
  color: #888;
  font-size: 0.9375rem;
}

.sort-modal-empty {
  text-align: center;
  padding: 3.75rem 1.875rem;
}
.sort-modal-empty p {
  color: #888;
  font-size: 0.9375rem;
  line-height: 1.6;
  margin: 0;
}

.sort-parent-selector {
  margin-bottom: 1.75rem;
}
.sort-parent-selector .c-select label {
  display: none;
}

.sort-input-container {
  margin-bottom: 1.75rem;
}

.sort-modal-input {
  width: 100%;
  padding: 0.75rem 0.875rem;
  border: 2px solid #e7e7e7;
  border-radius: 0.4rem;
  font-size: 0.9375rem;
  transition: all 0.2s;
  font-family: inherit;
  box-sizing: border-box;
  margin-top: 0.5rem;
}
.sort-modal-input:focus {
  outline: none;
  border-color: #da0000;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}
.sort-modal-input.has-unsaved {
  border-left-width: 0.3125rem;
  border-left-color: #da0000;
  padding-left: 0.6875rem;
}

.sort-unsaved-indicator {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-top: 0.75rem;
}

.sort-unsaved-text {
  color: #da0000;
  font-size: 0.8125rem;
  font-weight: 700;
  flex: 1;
  text-align: end;
}

.sort-save-button {
  padding: 0.5rem 1.125rem;
  background-color: #da0000;
  color: #fff;
  border: none;
  border-radius: 0.375rem;
  font-size: 0.875rem;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s;
  white-space: nowrap;
}
.sort-save-button:hover:not(:disabled) {
  background-color: #da0000;
  transform: translateY(-1px);
  box-shadow: 0 0.25rem 0.75rem rgba(59, 130, 246, 0.4);
}
.sort-save-button:active:not(:disabled) {
  transform: translateY(0);
}
.sort-save-button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.sort-modal-footer {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 0.75rem;
  padding: 1.25rem 1.75rem 1.5rem;
  border-top: 1px solid #dfdfdf;
  background-color: #f9f9f9;
  border-radius: 0 0 0.4rem 0.4rem;
}

.sort-modal-button {
  padding: 0.625rem 1.25rem;
  border-radius: 0.4rem;
  font-size: 0.875rem;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s;
  border: none;
  font-family: inherit;
}
.sort-modal-button--secondary {
  background-color: #fff;
  color: #666;
  border: 2px solid #e7e7e7;
}
.sort-modal-button--secondary:hover {
  background-color: #f9f9f9;
  border-color: #888;
}
.sort-modal-button--primary {
  background-color: #da0000;
  color: #fff;
  box-shadow: 0 2px 0.5rem rgba(59, 130, 246, 0.3);
}
.sort-modal-button--primary:hover:not(:disabled) {
  background-color: #da0000;
  transform: translateY(-1px);
  box-shadow: 0 0.25rem 0.75rem rgba(59, 130, 246, 0.4);
}
.sort-modal-button--primary:active:not(:disabled) {
  transform: translateY(0);
}
.sort-modal-button--primary:disabled {
  opacity: 0.4;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}

.sort-inline-input {
  width: 4rem;
  padding: 0.25rem 0.5rem;
  border: 2px solid #da0000;
  border-radius: 0.125rem;
  font-size: 0.875rem;
  font-weight: 500;
  text-align: center;
  font-family: inherit;
  box-sizing: border-box;
  transition: all 0.2s;
}
.sort-inline-input:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}
.sort-inline-input.is-saving {
  opacity: 0.6;
  cursor: wait;
}
.sort-inline-input:disabled {
  cursor: not-allowed;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.allowed-hosts__section {
  padding-top: 0.5rem;
}
.allowed-hosts__section .allowed-hosts__title {
  font-weight: 500;
  margin-bottom: 0.25rem;
}
.allowed-hosts__section .allowed-hosts__desc {
  font-size: 0.9rem;
  color: #888;
  margin-bottom: 0.75rem;
}
.allowed-hosts__section .allowed-hosts__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
  margin-bottom: 0.75rem;
}
.allowed-hosts__section .allowed-hosts__tag {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.25rem 0.375rem 0.25rem 0.625rem;
  background-color: #dfdfdf;
  border-radius: 1rem;
  font-size: 0.9rem;
  font-weight: 500;
}
.allowed-hosts__section .allowed-hosts__tag-label {
  max-width: 20rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.allowed-hosts__section .allowed-hosts__tag-remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.125rem;
  height: 1.125rem;
  padding: 0;
  background: none;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  color: #888;
  font-size: 0.9rem;
  line-height: 1;
  flex-shrink: 0;
}
.allowed-hosts__section .allowed-hosts__tag-remove:hover {
  background-color: rgb(197.5, 197.5, 197.5);
  color: #000;
}
.allowed-hosts__section .allowed-hosts__input-row {
  display: flex;
  gap: 0.5rem;
  align-items: center;
}
.allowed-hosts__section .allowed-hosts__input-row .allowed-hosts__input {
  flex: 1;
  height: 2.25rem;
  padding: 0 0.625rem;
  border: 1px solid #e7e7e7;
  border-radius: 0.4rem;
  font-size: 1rem;
  font-family: inherit;
  background-color: #fff;
  transition: border-color 0.15s ease;
}
.allowed-hosts__section .allowed-hosts__input-row .allowed-hosts__input:focus {
  outline: none;
  border-color: #da0000;
}
.allowed-hosts__section .allowed-hosts__input-row .allowed-hosts__input.allowed-hosts__input--error {
  border-color: #da0000;
}
.allowed-hosts__section .allowed-hosts__validation-error {
  margin-top: 0.25rem;
  font-size: 0.9rem;
  color: #da0000;
}
.allowed-hosts__section .allowed-hosts__save-error {
  margin-top: 0.25rem;
  font-size: 0.9rem;
  color: #da0000;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.h-arrow {
  width: 0.45rem;
  height: 0.45rem;
  right: -0.75rem;
  top: 50%;
  border-top-style: solid;
  border-left-style: solid;
  border-top-width: 0.15rem;
  border-left-width: 0.15rem;
}

.h-padding-bottom-1 {
  padding-bottom: 1rem;
}

.h-padding-top-1 {
  padding-top: 1rem;
}

.h-padding-top-15 {
  padding-top: 1.5rem;
}

.h-padding-top-05 {
  padding-top: 0.5rem;
}

.h-padding-bottom-25 {
  padding-bottom: 2.5rem;
}

.h-padding-top-25 {
  padding-top: 2.5rem;
}

.h-padding-right-25 {
  padding-right: 2.5rem;
}

.h-padding-pageheight-1-2 {
  padding-top: 50vh;
}

.h-white-body {
  background-color: #fff;
}

.h-stackview-vertical {
  display: flex;
  justify-content: space-between;
}
.h-stackview-vertical > * {
  flex-grow: 5;
  margin: 0 0 0 1rem;
}
.h-stackview-vertical > *:first-child {
  margin: 0;
}

.h-grid-a {
  grid-area: a;
}

.h-grid-b {
  grid-area: b;
}

.h-grid-c {
  grid-area: c;
}

.h-collapsed {
  height: 0;
  overflow: hidden;
}

.h-subform-buttons {
  text-align: right;
}

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

.h-text-right {
  text-align: right;
}

.h-hidden {
  display: none;
}

.h-font-size-small {
  font-size: 0.9rem;
}

.h-font-size-regular {
  font-size: 1rem;
}

.h-font-size-medium {
  font-size: 1.2rem;
}

.h-font-size-big {
  font-size: 1.8rem;
}

.h-sticky {
  position: sticky;
  position: -webkit-sticky;
  position: -moz-sticky;
  position: -ms-sticky;
  position: -o-sticky;
}

.h-relative {
  position: relative;
}

.h-sticky-detail-side {
  top: 5.725rem;
  z-index: 24;
}

.h-sticky-detail-pagenav {
  top: 7.4rem;
  margin-bottom: -0.8rem;
  z-index: 24;
}

.h-sticky__header {
  z-index: 101;
}

.h-v-center {
  display: flex;
  align-items: center;
  height: 100%;
  position: relative;
}

.h-flex-strechitems li {
  flex: 1 100%;
}

.h-show-animateable {
  opacity: 1;
  visibility: visible;
}

.h-activity-indicator {
  margin: 0 auto;
  background-color: transparent;
  background-image: url("../assets/images/svgs/illustrations/rm.svg");
  background-repeat: no-repeat;
  background-position: center center;
  width: 2.5rem;
  height: 2.5rem;
  padding-top: 0rem;
  padding-bottom: 0rem;
  animation: spin 1.5s ease-in-out infinite;
}

.h-bg-transparent {
  background-color: transparent;
}

@keyframes spin {
  100% {
    transform: rotate(360deg);
  }
}
.h-error-color {
  color: #da0000;
}

.h-date {
  padding-bottom: 0.5rem;
}
.h-date:last-child {
  padding-bottom: 0;
}
.h-date span {
  font-weight: 400;
}

.h-link-no-hover:hover {
  background-color: transparent;
}

.h-cursor-pointer {
  cursor: pointer;
}

.h-icon-arrow-hover {
  cursor: auto;
}

.h-link-underline {
  text-decoration: underline;
}

.h-link-primary {
  color: #da0000;
}

.h-link-disabled {
  color: #a9a9a9;
  cursor: not-allowed;
}
.h-link-disabled svg {
  fill: #a9a9a9;
  cursor: not-allowed;
}

.h-link-inline {
  display: inline;
}

.h-text-overflow {
  text-overflow: ellipsis;
  overflow: hidden;
  width: 100%;
  white-space: nowrap;
  display: block;
}

.h-text-auto-width {
  width: auto;
}

.h-float-left {
  float: left;
}

.h-grid-padding-1 {
  padding-top: 1.143rem;
}

.h-full-width {
  width: 100%;
}

.h-full-height {
  height: 100%;
}

.h-display-inline {
  display: inline-block;
}

.h-display-center {
  margin: 0 auto;
}

.h-disable {
  color: #a9a9a9;
}

.h-full-min-height,
.grid-container.h-full-min-height {
  min-height: 100%;
  display: flex;
  flex-direction: column;
}

.h-box {
  border-radius: 0.125rem;
  border: 1px solid #eee;
  background-color: #fff;
  box-sizing: border-box;
}

.h-100 {
  height: 100%;
}

.h-hide-ul ul {
  padding: 0;
  margin: 0;
  list-style: none;
}
.h-hide-ul ul li {
  margin: 0;
  padding: 0;
}

.h-max-text-block-width {
  max-width: 600px;
}

.h-minus-margin-top-25 {
  margin-top: -2.5rem;
}

@keyframes autofill {
  to {
    background: transparent;
  }
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  animation-name: autofill;
  animation-fill-mode: both;
}

.cols {
  display: grid;
  grid-gap: 1.143rem;
}

.col-align-self__end {
  align-self: end;
}

.col-justify-self__end {
  justify-self: end;
}

.col-1 {
  grid-template-columns: repeat(1, minmax(0, 1fr));
}

.col-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.col-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.col-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.col-6 {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.col-8 {
  grid-template-columns: repeat(8, minmax(0, 1fr));
}

.col-12 {
  grid-template-columns: repeat(12, minmax(0, 1fr));
}

.col-15 {
  grid-template-columns: repeat(15, minmax(0, 1fr));
}

.col-20 {
  grid-template-columns: repeat(20, minmax(0, 1fr));
}

.col-span-1 {
  grid-column: span 1/span 1;
}

.col-span-2 {
  grid-column: span 2/span 2;
}

.col-span-3 {
  grid-column: span 3/span 3;
}

.col-span-4 {
  grid-column: span 4/span 4;
}

.col-span-5 {
  grid-column: span 5/span 5;
}

.col-span-6 {
  grid-column: span 6/span 6;
}

.col-span-7 {
  grid-column: span 7/span 7;
}

.col-span-8 {
  grid-column: span 8/span 8;
}

.col-span-9 {
  grid-column: span 9/span 9;
}

.col-span-10 {
  grid-column: span 10/span 10;
}

.col-span-11 {
  grid-column: span 11/span 11;
}

.col-span-12 {
  grid-column: span 12/span 12;
}

.col-span-13 {
  grid-column: span 13/span 13;
}

.col-span-14 {
  grid-column: span 14/span 14;
}

.col-span-15 {
  grid-column: span 15/span 15;
}

.col-span-16 {
  grid-column: span 16/span 16;
}

.col-span-17 {
  grid-column: span 17/span 17;
}

.col-span-18 {
  grid-column: span 18/span 18;
}

.col-span-19 {
  grid-column: span 19/span 19;
}

.col-span-20 {
  grid-column: span 20/span 20;
}

@media only screen and (min-width: 1600px) {
  .xlg-col-span-1 {
    grid-column: span 1/span 1;
  }
  .xlg-col-span-2 {
    grid-column: span 2/span 2;
  }
  .xlg-col-span-3 {
    grid-column: span 3/span 3;
  }
  .xlg-col-span-4 {
    grid-column: span 4/span 4;
  }
}
@media only screen and (max-width: 1400px) {
  .lg-col-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .lg-col-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .lg-col-8 {
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
  .lg-col-12 {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }
  .lg-col-15 {
    grid-template-columns: repeat(15, minmax(0, 1fr));
  }
  .lg-col-span-1 {
    grid-column: span 1/span 1;
  }
  .lg-col-span-2 {
    grid-column: span 2/span 2;
  }
  .lg-col-span-3 {
    grid-column: span 3/span 3;
  }
  .lg-col-span-4 {
    grid-column: span 4/span 4;
  }
  .lg-col-span-5 {
    grid-column: span 5/span 5;
  }
}
@media only screen and (max-width: 1200px) {
  .md-col-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .md-col-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .md-col-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .md-col-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .md-col-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .md-col-span-1 {
    grid-column: span 1/span 1;
  }
  .md-col-span-2 {
    grid-column: span 2/span 2;
  }
  .md-col-span-3 {
    grid-column: span 3/span 3;
  }
  .md-col-span-4 {
    grid-column: span 4/span 4;
  }
  .md-col-span-6 {
    grid-column: span 6/span 6;
  }
  .md-col-span-8 {
    grid-column: span 8/span 8;
  }
}
@media only screen and (max-width: 1024px) {
  .xm-col-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .xm-col-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .xm-col-span-1 {
    grid-column: span 1/span 1;
  }
  .xm-col-span-2 {
    grid-column: span 2/span 2;
  }
  .xm-col-span-3 {
    grid-column: span 3/span 3;
  }
  .xm-col-span-4 {
    grid-column: span 4/span 4;
  }
  .xm-col-span-5 {
    grid-column: span 5/span 5;
  }
  .xm-col-span-6 {
    grid-column: span 6/span 6;
  }
}
.grid-container {
  display: block;
  margin: 0 auto;
  width: 85%;
}

@media only screen and (min-width: 900px) and (max-width: 1024px) {
  .grid-container {
    width: 95%;
  }
}
@media only screen and (min-width: 1024px) and (max-width: 1328px) {
  .grid-container {
    width: 1008px;
  }
}
@media only screen and (min-width: 900px) and (max-width: 1328px) {
  .grid-container {
    width: 95%;
  }
}
body,
html {
  margin: 0;
  padding: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

html {
  background-color: #fff;
  height: 100vh;
  font-size: 14px;
  overflow-y: scroll;
}

body {
  min-height: 100%;
  box-sizing: border-box;
  font-family: Rubik, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-weight: 100;
  letter-spacing: 0.01rem;
  background-color: #e7e7e7;
  overflow: initial;
}

a {
  color: #000;
  cursor: pointer;
  text-decoration: none;
}

h1 {
  margin: 0;
  font-weight: 300;
}

h2 {
  margin: 0;
  font-weight: 300;
  font-size: 1.4rem;
}
h2 svg {
  transform: translateY(0.3rem);
  padding-right: 0.3rem;
  width: 1.7rem;
  height: 1.7rem;
}

h4 {
  margin: 0;
  font-size: 1rem;
  font-weight: 400;
}

p {
  padding: 0.5rem 0;
  margin: 0;
}

table a {
  text-decoration: none;
}
table .m-link__active {
  color: #da0000;
  text-decoration: underline;
}

main {
  padding: 3.75rem 0;
  font-size: 0.9rem;
}

.m-grid-container {
  padding: 4rem;
}

.m-2col-grid {
  margin: 0 auto;
  max-width: 85%;
  display: grid;
  grid: auto/1fr 1fr;
  grid-column-gap: 1.125rem;
}

.m-box-container {
  display: flex;
  flex-direction: column;
  min-width: 30rem;
}

.m-box-item {
  background: #fff;
  border: 1px solid #dfdfdf;
  padding: 1rem 2rem;
  border-radius: 0.125rem;
}
.m-box-item h2 {
  font-family: Rubik, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-weight: 700;
  color: #000;
  margin-top: 0;
}

.errors h2 {
  color: #fff;
}

.m-box-item-img img {
  display: block;
  width: 100%;
}

.m-grid-2col-container {
  display: grid;
  grid-template-columns: 80% calc(20% - 1.125rem);
  grid-template-areas: "a b" "c z";
  grid-gap: 1.125rem;
}
.m-grid-2col-container h2 {
  font-weight: 400;
}

@media only screen and (max-width: 1100px) {
  .m-grid-2col-container {
    grid-template-columns: 60% calc(40% - 1.125rem);
  }
}
.m-collapsible__titles h1,
.m-collapsible__titles h2 {
  font-weight: 700;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-left: 1rem;
}
.m-collapsible__titles h1 {
  padding: 0;
  font-size: 1.4rem;
}

.m-collapsible__no-border h1 {
  font-weight: 400;
  margin-bottom: 1rem;
}

.m-droparea h2,
.m-box-item h2 {
  font-size: 1.4rem;
  font-weight: 100;
}

.m-display__flex {
  display: flex;
  justify-content: flex-start;
  align-items: baseline;
}

.m-save-errors__text {
  position: fixed;
  right: 2rem;
  z-index: 206;
  top: 6rem;
  color: #fff;
  font-size: 1rem;
  animation: fadeIn 1s infinite alternate;
}

.m-custom-box__none {
  border: 0;
  padding-left: 0;
  padding-right: 0;
}

.no-border {
  border: 0;
}

.hidden {
  display: none;
}

.flex {
  display: flex;
  justify-content: center;
  align-items: center;
}

.flex-inline {
  display: inline-flex;
}

.block {
  display: block;
}

.flex-columns {
  flex-direction: column;
}

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

.flex-space__between {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.flex-space__around {
  justify-content: space-around;
}

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

.flex-align-end {
  align-items: flex-end;
  justify-content: flex-end;
}

.invisible {
  visibility: hidden;
}

.custom-invisible {
  visibility: hidden;
  max-height: 1px;
  overflow: hidden;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
}
.good-color__indicator {
  background-color: #3dac43;
  stroke: #3dac43;
  color: #3dac43;
}

.medium-color__indicator {
  background-color: #f79101;
  stroke: #f79101;
  color: #f79101;
}

.bad-color__indicator {
  background-color: #df0300;
  stroke: #df0300;
  color: #df0300;
}

.svg-icon__tick {
  fill: #3dac43;
}

.svg-icon__exclamerror {
  fill: #df0300;
}

.bg-white {
  background-color: #fff;
}

.bg-grey {
  background-color: #f4f4f4;
}

.visible {
  visibility: visible;
  opacity: 1;
}

.inline-block {
  display: inline-block;
  width: 100%;
}

.clear-float {
  clear: both;
}

.m-50-opacity {
  opacity: 50%;
}

[data-tooltip] {
  position: relative;
}
[data-tooltip]::before, [data-tooltip]::after {
  position: absolute;
  left: 50%;
  transition: opacity 0.15s ease-in-out, transform 0.15s ease-in-out;
  transform: translate(-50%, -5px);
  opacity: 0;
}
[data-tooltip]::before {
  content: attr(data-tooltip);
  background-color: #1a1a1a;
  bottom: 100%;
  padding: 0.5rem 0.714rem;
  border-radius: 0.125rem;
  font-size: 1rem;
  font-weight: 500;
  white-space: nowrap;
  color: #fff;
}
[data-tooltip]::after {
  content: "";
  bottom: calc(100% - 0.357rem);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0.357rem 0.357rem 0;
  border-color: #1a1a1a transparent transparent;
}
[data-tooltip]:hover::before, [data-tooltip]:hover::after, [data-tooltip]:focus::before, [data-tooltip]:focus::after {
  opacity: 1;
}

svg {
  cursor: pointer;
}

.text-align-end {
  text-align: end;
}

.disable-scrolling {
  height: 100%;
  overflow: hidden;
}

.ember-basic-dropdown {
  position: relative;
}

.ember-basic-dropdown,
.ember-basic-dropdown-content,
.ember-basic-dropdown-content * {
  box-sizing: border-box;
}

.ember-basic-dropdown-content {
  position: absolute;
  width: auto;
  z-index: 1000;
  background-color: #fff;
}

.ember-basic-dropdown-content--left {
  left: 0;
}

.ember-basic-dropdown-content--right {
  right: 0;
}

.ember-basic-dropdown-overlay {
  position: fixed;
  background: rgba(0, 0, 0, 0.5);
  width: 100%;
  height: 100%;
  z-index: 10;
  top: 0;
  left: 0;
  pointer-events: none;
}

.ember-basic-dropdown-content-wormhole-origin {
  display: inline;
}

.ember-basic-dropdown {
  position: relative;
}

.ember-basic-dropdown,
.ember-basic-dropdown-content,
.ember-basic-dropdown-content * {
  box-sizing: border-box;
}

.ember-basic-dropdown-content {
  position: absolute;
  width: auto;
  z-index: 1000;
  background-color: transparent;
}

.ember-basic-dropdown-content--left {
  left: 0;
}

.ember-basic-dropdown-content--right {
  right: 0;
}

.ember-basic-dropdown-overlay {
  position: fixed;
  background: rgba(0, 0, 0, 0.5);
  width: 100%;
  height: 100%;
  z-index: 10;
  top: 0;
  left: 0;
  pointer-events: none;
}

.ember-basic-dropdown-content-wormhole-origin {
  display: inline;
}

.ember-power-select-dropdown * {
  box-sizing: border-box;
}

.ember-power-select-trigger {
  position: relative;
  border-top: 0;
  border-bottom: 0;
  border-right: 0;
  border-left: 0;
  border-radius: 4px;
  background-color: transparent;
  line-height: 1.75;
  overflow-x: hidden;
  text-overflow: ellipsis;
  min-height: 1.75em;
  user-select: none;
  -webkit-user-select: none;
  color: inherit;
  /* Minimum clearfix for modern browsers */
}
.ember-power-select-trigger:after {
  content: "";
  display: table;
  clear: both;
}
.ember-power-select-trigger:not(.ember-power-select-multiple-trigger) .ember-power-select-input {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.ember-power-select-trigger:focus,
.ember-power-select-trigger--active {
  border-top: 0;
  border-bottom: 0;
  border-right: 0;
  border-left: 0;
  box-shadow: none;
}

.ember-basic-dropdown-trigger--below.ember-power-select-trigger[aria-expanded=true],
.ember-basic-dropdown-trigger--in-place.ember-power-select-trigger[aria-expanded=true] {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.ember-basic-dropdown-trigger--above.ember-power-select-trigger[aria-expanded=true] {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.ember-power-select-placeholder {
  color: #999999;
  display: block;
  overflow-x: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.ember-power-select-status-icon {
  position: absolute;
  display: inline-block;
  width: 0;
  height: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  border-style: solid;
  border-width: 7px 4px 0 4px;
  border-color: #aaaaaa transparent transparent transparent;
}
.ember-basic-dropdown-trigger[aria-expanded=true] .ember-power-select-status-icon {
  transform: rotate(180deg);
}

.ember-power-select-clear-btn {
  position: absolute;
  cursor: pointer;
}

.ember-power-select-multiple-options {
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  list-style: none;
}
.ember-power-select-multiple-options li.ember-power-select-trigger-multiple-input-container {
  flex-grow: 1;
  display: flex;
}
.ember-power-select-multiple-options li.ember-power-select-trigger-multiple-input-container input {
  flex-grow: 1;
}

.ember-power-select-trigger-multiple-input {
  font-family: inherit;
  font-size: inherit;
  border: none;
  line-height: inherit;
  -webkit-appearance: none;
  outline: none;
  padding: 0;
  background-color: transparent;
  text-indent: 2px;
}
.ember-power-select-trigger-multiple-input:disabled {
  background-color: #eeeeee;
}
.ember-power-select-trigger-multiple-input {
  /* There's a browser bug where this selectos cannot be chained with commas */
}
.ember-power-select-trigger-multiple-input::placeholder {
  opacity: 1;
  color: #999999;
}
.ember-power-select-trigger-multiple-input::-webkit-input-placeholder {
  opacity: 1;
  color: #999999;
}
.ember-power-select-trigger-multiple-input::-moz-placeholder {
  opacity: 1;
  color: #999999;
}
.ember-power-select-trigger-multiple-input::-ms-input-placeholder {
  opacity: 1;
  color: #999999;
}

.ember-power-select-multiple-option {
  border: 1px solid gray;
  border-radius: 4px;
  color: #333333;
  background-color: #e4e4e4;
  padding: 0 4px;
  line-height: 1.45;
  margin: 2px 0 2px 3px;
}

.ember-power-select-multiple-remove-btn {
  cursor: pointer;
}
.ember-power-select-multiple-remove-btn:not(:hover) {
  opacity: 0.5;
}

.ember-power-select-search {
  padding: 4px;
}

.ember-power-select-search-input {
  border: 0;
  border-radius: 0;
  width: 100%;
  font-size: inherit;
  line-height: inherit;
  padding: 0 5px;
}
.ember-power-select-search-input:focus {
  border: 1px solid #aaaaaa;
  box-shadow: none;
}

.ember-power-select-search-input-field {
  width: 100%;
  height: 100%;
  padding: 0 8px;
  font-family: inherit;
  font-size: inherit;
  border: none;
  display: block;
  line-height: inherit;
  -webkit-appearance: none;
  outline: none;
  background-color: transparent;
}

.ember-power-select-dropdown {
  border-left: 1px solid #dfdfdf;
  border-right: 1px solid #dfdfdf;
  line-height: 1.75;
  border-radius: 4px;
  box-shadow: none;
  overflow: hidden;
  color: inherit;
}

.ember-power-select-dropdown.ember-basic-dropdown-content--above {
  border-top: 1px solid #dfdfdf;
  border-bottom: none;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.ember-power-select-dropdown.ember-basic-dropdown-content--below,
.ember-power-select-dropdown.ember-basic-dropdown-content--in-place {
  border-top: none;
  border-bottom: 1px solid #dfdfdf;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.ember-power-select-dropdown.ember-basic-dropdown-content--in-place {
  width: 100%;
}

.ember-power-select-options {
  list-style: none;
  margin: 0;
  padding: 0;
  user-select: none;
  -webkit-user-select: none;
}
.ember-power-select-options[role=listbox] {
  overflow-y: auto; /* in firefox in windows this can cause a word-break issue. Try `overflow-y: scroll` if that happens */
  -webkit-overflow-scrolling: touch;
  max-height: 12.25em;
}

.ember-power-select-option {
  cursor: pointer;
  padding: 0 8px;
}

.ember-power-select-group[aria-disabled=true] {
  color: #999999;
  cursor: not-allowed;
}

.ember-power-select-group[aria-disabled=true] .ember-power-select-option,
.ember-power-select-option[aria-disabled=true] {
  color: #999999;
  pointer-events: none;
  cursor: not-allowed;
}

.ember-power-select-option[aria-selected=true] {
  background-color: #dddddd;
}

.ember-power-select-option[aria-current=true] {
  background-color: #da0000;
  color: #ffffff;
}

.ember-power-select-group-name {
  cursor: default;
  font-weight: bold;
}

.ember-power-select-trigger[aria-disabled=true] {
  background-color: #eeeeee;
}

.ember-power-select-trigger {
  padding: 0 16px 0 0;
}

.ember-power-select-selected-item,
.ember-power-select-placeholder {
  margin-left: 8px;
}

.ember-power-select-status-icon {
  right: 5px;
}

.ember-power-select-clear-btn {
  right: 25px;
}

.ember-power-select-group .ember-power-select-group .ember-power-select-group-name {
  padding-left: 24px;
}
.ember-power-select-group .ember-power-select-group .ember-power-select-option {
  padding-left: 40px;
}
.ember-power-select-group .ember-power-select-option {
  padding-left: 24px;
}
.ember-power-select-group .ember-power-select-group-name {
  padding-left: 8px;
}

.ember-power-select-trigger[dir=rtl] {
  padding: 0 0 0 16px;
}
.ember-power-select-trigger[dir=rtl] .ember-power-select-selected-item,
.ember-power-select-trigger[dir=rtl] .ember-power-select-placeholder {
  margin-right: 8px;
}
.ember-power-select-trigger[dir=rtl] .ember-power-select-multiple-option {
  float: right;
}
.ember-power-select-trigger[dir=rtl] .ember-power-select-trigger-multiple-input {
  float: right;
}
.ember-power-select-trigger[dir=rtl] .ember-power-select-status-icon {
  left: 5px;
  right: initial;
}
.ember-power-select-trigger[dir=rtl] .ember-power-select-clear-btn {
  left: 25px;
  right: initial;
}

.ember-power-select-visually-hidden {
  height: 1px;
  left: -9999px;
  overflow: hidden;
  position: absolute;
  width: 1px;
}

.ember-power-select-dropdown[dir=rtl] .ember-power-select-group .ember-power-select-group .ember-power-select-group-name {
  padding-right: 24px;
}
.ember-power-select-dropdown[dir=rtl] .ember-power-select-group .ember-power-select-group .ember-power-select-option {
  padding-right: 40px;
}
.ember-power-select-dropdown[dir=rtl] .ember-power-select-group .ember-power-select-option {
  padding-right: 24px;
}
.ember-power-select-dropdown[dir=rtl] .ember-power-select-group .ember-power-select-group-name {
  padding-right: 8px;
}