/* CKEditor */
.ck.ck-editor__main {
  color: white;
}
.ck.ck-editor__main p {
  color: white;
}

/* Paragraphs Layout Styles */
/* Fields */
.js-lpb-component-list .field .field__label {
  font-size: 0.8rem;
}
.js-lpb-component-list .field .field__item {
  font-size: 0.8rem;
}

/* Layout */
.js-lpb-component-list .layout {
  flex-wrap: nowrap;
  margin: 10px 0;
}
.lp-builder:not(.is-navigating) .js-lpb-component:hover, .lp-builder:not(.is-navigating) .js-lpb-component:focus-within {
  border-radius: 0.3rem 0 0.3rem 0.3rem;
  outline: 2px solid #54585f;
}
.lp-builder:not(.is-navigating) .js-lpb-component:not(:first-child){
  margin-top: 30px;
}
.js-lpb-component > .lpb-btn {
  color: #9e9ea0;
}
.js-lpb-component > .lpb-btn:hover {
  color: #151515;
}

/* Controls */
.lpb-controls.is-layout {
  right: -2px;
}
.js-lpb-component .lpb-controls:not(.is-layout) {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  box-shadow: none;
  border-radius: inherit;
}

.lpb-controls .lpb-drag {
  background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.5 11C13.3284 11 14 10.3284 14 9.5C14 8.67157 13.3284 8 12.5 8C11.6716 8 11 8.67157 11 9.5C11 10.3284 11.6716 11 12.5 11Z' fill='white'/%3E%3Cpath d='M12.5 16C13.3284 16 14 15.3284 14 14.5C14 13.6716 13.3284 13 12.5 13C11.6716 13 11 13.6716 11 14.5C11 15.3284 11.6716 16 12.5 16Z' fill='white'/%3E%3Cpath d='M14 19.5C14 20.3284 13.3284 21 12.5 21C11.6716 21 11 20.3284 11 19.5C11 18.6716 11.6716 18 12.5 18C13.3284 18 14 18.6716 14 19.5Z' fill='white'/%3E%3Cpath d='M17.5 11C18.3284 11 19 10.3284 19 9.5C19 8.67157 18.3284 8 17.5 8C16.6716 8 16 8.67157 16 9.5C16 10.3284 16.6716 11 17.5 11Z' fill='white'/%3E%3Cpath d='M19 14.5C19 15.3284 18.3284 16 17.5 16C16.6716 16 16 15.3284 16 14.5C16 13.6716 16.6716 13 17.5 13C18.3284 13 19 13.6716 19 14.5Z' fill='white'/%3E%3Cpath d='M17.5 21C18.3284 21 19 20.3284 19 19.5C19 18.6716 18.3284 18 17.5 18C16.6716 18 16 18.6716 16 19.5C16 20.3284 16.6716 21 17.5 21Z' fill='white'/%3E%3C/svg%3E%0A");
  background-size: cover;
  opacity: 1;
}
.lpb-controls .lpb-controls-label {
  color: white;
}
.lpb-controls .lpb-up {
  background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 18L15 12L21 18H9Z' fill='white'/%3E%3C/svg%3E%0A");
  background-size: cover;
  opacity: 1;
}
.lpb-controls .lpb-down {
  background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(/modules/contrib/layout_paragraphs/css/%2523clip0)'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M21 12L15 18L9 12L21 12Z' fill='white'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0'%3E%3Crect width='12' height='6' fill='white' transform='translate(21 18) rotate(-180)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
  background-size: cover;
  opacity: 1;
}
.lp-builder:not(.is-navigating) .js-lpb-component:not(:first-child) .lpb-controls .lpb-up {
  opacity: 1;
}
.lp-builder:not(.is-navigating) .js-lpb-region :first-child .lpb-controls .lpb-up {
  opacity: 0.5;
}
.lp-builder:not(.is-navigating) .js-lpb-component:not(:first-child) .lpb-controls .lpb-up:hover {
  background-color: rgba(0,0,0,.1);
}
.lp-builder:not(.is-navigating) .js-lpb-component:not(:first-child) .lpb-controls .lpb-up:focus {
  outline: none;
  box-shadow: 0 0 0 1px var(--colorGinFocusBorder),0 0 0 4px var(--colorGinFocus);
}
.lpb-down[tabindex="-1"], .lpb-up[tabindex="-1"] {
  opacity: 0.5;
}
.lpb-controls .lpb-edit {
  background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18.284 8.63082L19.6136 7.30121C20.0152 6.8996 20.6664 6.8996 21.068 7.30121L22.6988 8.93203C23.1004 9.33365 23.1004 9.98479 22.6988 10.3864L21.3692 11.716L18.284 8.63082Z' fill='white'/%3E%3Cpath d='M17.2556 9.65922L9.0284 17.8864L8 22L12.1136 20.9716L20.3408 12.7444L17.2556 9.65922Z' fill='white'/%3E%3C/svg%3E%0A");
  background-size: cover;
  opacity: 1;
}
.lpb-controls .lpb-duplicate {
  background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M20.7,8C21.4,8,22,8.6,22,9.3v7.9c0,0.7-0.6,1.3-1.3,1.3h-7.9c-0.7,0-1.3-0.6-1.3-1.3V9.3c0-0.7,0.6-1.3,1.3-1.3H20.7 M12.8,19.4c-1.2,0-2.2-1-2.2-2.2v-5.7H9.3c-0.7,0-1.3,0.6-1.3,1.3v7.9C8,21.4,8.6,22,9.3,22h7.9c0.7,0,1.3-0.6,1.3-1.3v-1.3H12.8z' fill='white' /%3E%3C/svg%3E%0A");
  background-size: cover;
  opacity: 1;
}
.lpb-controls .lpb-delete {
  background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M14 8H16C16.5523 8 17 8.44772 17 9H21V11H9V9H13C13 8.44772 13.4477 8 14 8ZM10 12H20L19.09 21.0995C19.0389 21.6107 18.6088 22 18.095 22H11.905C11.3912 22 10.9611 21.6107 10.91 21.0995L10 12Z' fill='white'/%3E%3C/svg%3E%0A");
  background-size: cover;
  opacity: 1;
}
.lp-builder:not(.is-navigating) .js-lpb-component:hover > .lpb-controls, .lp-builder:not(.is-navigating) .js-lpb-component:focus-within > .lpb-controls {
  background-color: #54585f;
}
.js-lpb-component-list .layout .js-lpb-region {
  background: white;
  border-radius: 10px;
  height: fit-content;
}
.js-lpb-component-list .layout .js-lpb-region:last-child {
  margin-left: 10px;
}
.js-lpb-component-list .layout .js-lpb-region:first-child {
  margin-right: 10px;
}
.layout--col3_col3_col3_col3 .js-lpb-region:nth-child(2) {
  margin-right: 10px;
}
.js-lpb-component-list .layout .js-lpb-region .js-lpb-component {
  margin: 5px;
  padding: 5px 15px;
  border-radius: 5px;
  background-image: url("/modules/customer/img/striche.svg");
  outline: none;
}
.js-lpb-component-list .layout .js-lpb-region .js-lpb-component:hover {
  background-image: url("/modules/customer/img/striche_hover.svg");
  outline: none;
}
.layout-paragraphs-component-form .form-textarea-wrapper .ck-content p {
  color: #42424c;
}

/* Create new Layout */
.layout-select__item label.option {
  outline: 1px solid #42454a;
  border-radius: 0.3rem;
  transition: 0.1s ease-in-out;
}
.layout-select__item label.option:hover {
  color: var(--colorGinPrimary);
  background-color: var(--colorGinItemHover);
}
.layout-select__item input:checked + label.option {
  outline: none;
  box-shadow: 0 0 0 1px var(--colorGinFocusBorder),0 0 0 4px var(--colorGinFocus);
}
/* Add New Component */
.lp-builder:not(.is-navigating) .js-lpb-component:hover > .lpb-btn--add, .lp-builder:not(.is-navigating) .js-lpb-component:focus-within > .lpb-btn--add, .js-lpb-component .lpb-btn--add, .js-lpb-region .lpb-btn--add {
  border: none;
  box-shadow: 0px 0px 5px 1px #434548;
  color: #76777b;
}