:root {
  --gin-color-title: #222330;
  --gin-color-text: #222330;
  --gin-color-text-light: #545560;
  --gin-color-focus: rgb(0 125 250 / 60%);
  --gin-color-focus-border: rgb(0 0 0 / 20%);
  --gin-color-focus-neutral-rgb: rgb(0 0 0 / 40%);
  --gin-color-disabled: #8d8d8d;
  --gin-color-disabled-bg: #eaeaea;
  --gin-color-disabled-border: #c2c2c2;
  --gin-color-warning: #d8b234;
  --gin-color-warning-light: #efcf64;
  --gin-bg-warning: #605328;
  --gin-bg-warning-light: rgb(226 151 0 / 8%);
  --gin-color-danger: #cc3d3d;
  --gin-color-danger-lightest: #fdd9d9;
  --gin-color-danger-light: #f39b9d;
  --gin-bg-danger: #583333;
  --gin-bg-danger-light: rgb(222 117 96 / 1%);
  --gin-color-green: #058260;
  --gin-color-green-light: #32cea4;
  --gin-color-green-lightest: #adebdb;
  --gin-bg-green: #145242;
  --gin-bg-green-light: rgb(72 171 123 / 1%);
  --gin-color-info: #082538;
  --gin-color-info-light: #589ac5;
  --gin-bg-info: #122b3c;
  --gin-color-contextual: var(--gin-color-text);
  --gin-color-contextual-text: #eee;
  --gin-bg-input: #fff;
  --gin-bg-layer: #fff;
  --gin-bg-layer2: #edeff5;
  --gin-bg-layer3: #fff;
  --gin-bg-layer4: #e2e5ec;
  --gin-bg-secondary: var(--gin-bg-layer);
  --gin-bg-header: #eeeff3;
  --gin-pattern: var(--gin-border-color);
  --gin-pattern-fallback: var(--gin-bg-layer2);
  --gin-pattern-square: 0.5rem;
  --gin-font: ginter, inter, 'Helvetica Neue', blinkmacsystemfont, -apple-system,
    'Segoe UI', roboto, oxygen-sans, ubuntu, cantarell, sans-serif;
  --gin-font-size-xxs: 0.75rem;
  --gin-font-size-xs: small;
  --gin-font-size-s: 0.875rem;
  --gin-font-size: 1rem;
  --gin-font-size-m: var(--gin-font-size);
  --gin-font-size-l: 1.125rem;
  --gin-font-size-xl: 1.25rem;
  --gin-font-size-h3: 1.5rem;
  --gin-font-size-h2: 1.75rem;
  --gin-font-size-h1: 1.6rem;
  --gin-font-size-quote: 1.1em;
  --gin-font-weight-normal: 400;
  --gin-font-weight-semibold: 525;
  --gin-font-weight-bold: 575;
  --gin-font-weight-heavy: 625;
  --gin-spacing-xxxs: 0.125rem;
  --gin-spacing-xxs: 0.25rem;
  --gin-spacing-xs: 0.5rem;
  --gin-spacing-s: 0.75rem;
  --gin-spacing-m: 1rem;
  --gin-spacing-l: 1.5rem;
  --gin-spacing-xl: 2rem;
  --gin-spacing-xxl: 3rem;
  --gin-spacing-xxxl: 4rem;
  --gin-icon-color: #414247;
  --gin-icon-size-close: 20px;
  --gin-icon-size-toolbar-secondary: 17px;
  --gin-icon-size-toolbar: 17px;
  --gin-icon-size-sidebar-toggle: 21px;
  --gin-border-xxs: 0.125rem;
  --gin-border-xs: 0.25rem;
  --gin-border-s: 0.375rem;
  --gin-border-m: 0.5rem;
  --gin-border-l: 0.75rem;
  --gin-border-xl: 1rem;
  --gin-border-color: #d4d4d8;
  --gin-border-color-secondary: rgb(0 0 0 / 8%);
  --gin-border-color-layer: rgb(0 0 0 / 8%);
  --gin-border-color-layer2: #d4d4d8;
  --gin-border-color-table: rgb(0 0 0 / 10%);
  --gin-border-color-table-header: rgb(0 0 0 / 20%);
  --gin-border-color-form-element: #8e929c;
  --size-summary-border-radius: calc(var(--gin-border-m) - 1px);
  --gin-easing: cubic-bezier(0.19, 1, 0.22, 1);
  --gin-transition: 0.15s var(--gin-easing);
  --gin-transition-fast: 0.3s var(--gin-easing);
  --gin-shadow-l1: 0 1px 2px rgb(20 45 82 / 2%), 0 3px 4px rgb(20 45 82 / 3%),
    0 5px 8px rgb(20 45 82 / 4%);
  --gin-shadow-l2: 0 1px 2px rgb(20 45 82 / 2%), 0 3px 4px rgb(20 45 82 / 3%),
    0 5px 8px rgb(20 45 82 / 4%), 0 20px 24px rgb(20 45 82 / 12%);
  --gin-height-sticky: 60px;
  --gin-toolbar-width-collapsed: 66px;
  --gin-toolbar-width: 256px;
  --gin-toolbar-height: 0px;
  --gin-toolbar-secondary-height: 0px;
  --gin-toolbar-bg-level2: #edeff5;
  --gin-toolbar-bg-level3: rgb(44 45 47 / 5%);
  --gin-toolbar-y-offset: 0px;
  --gin-toolbar-x-offset: 0px;
  --gin-scroll-offset: 0px;
  --gin-sticky-offset: 0px;
  --gin-sidebar-width: 320px;
  --gin-sidebar-offset: var(--gin-sidebar-width);
  --gin-switch: #26a769;
  --gin-shadow-button: #0003;
  --gin-color-button-text: #fff;
  --gin-offset-x: var(--gin-toolbar-x-offset);
  --gin-offset-y: calc(var(--gin-toolbar-y-offset) + var(--gin-sticky-offset));
  --gin-link-decoration-style: dotted;
  --input-line-height: var(--gin-spacing-l);
  --input-padding-horizontal: var(--gin-spacing-s);
  --input-padding-vertical: var(--gin-spacing-xs);
  --jui-dialog-z-index: 1260;
}

/* Stylise les parametres d'éditions de composant en fenetre modale */
.lpb-enable__wrapper {
  z-index: 5;
  position: relative;
}

.lpb-controls-label {
  color: var(--bs-black);
}

.lp-builder:not(.is-navigating) .js-lpb-component:hover > .lpb-btn,
.lp-builder:not(.is-navigating) .js-lpb-component:focus-within > .lpb-btn {
  color: var(--bs-black);
}

.lpb-btn {
  color: var(--bs-black);
}

.lpb-controls.is-layout .lpb-controls-label {
  color: var(--bs-white);
}

.ui-dialog .ui-dialog-content th {
  text-align: left;
}

.ui-widget.ui-widget-content {
  -webkit-transform: translate(50%, 50%);
          transform: translate(50%, 50%);
}

.ui-dialog .ui-dialog-content th h4 {
  font-size: 1.3rem;
}

.ui-dialog .ui-dialog-content .field--name-field-file-media .img-fluid {
  max-width: 5rem;
}

.ui-dialog .ui-dialog-content .field--name-field-video-media .img-fluid,
.ui-dialog .ui-dialog-content .media--type-picture .img-fluid {
  max-width: 10rem;
}

.ui-dialog .ui-dialog-content .icon-link.btn.btn-primary {
  background-color: #fff;
}

.ui-dialog .ui-dialog-content .js-form-wrapper,
.ui-dialog .ui-dialog-content .js-form-item {
  margin: 1rem 0.5rem;
}

.js-form-wrapper.form-wrapper em.placeholder {
  display: none;
}

.ui-dialog.lpb-dialog .dropbutton-widget .dropbutton {
  background-color: var(--bs-white);
}

.lpb-btn.before {
  top: -1.5rem;
}

.lpb-btn.after {
  bottom: -1.5rem;
}

.lpb-btn--add.before {
  top: 0;
}

.lpb-btn--add.after {
  bottom: 0;
}

/* Stylise la fenetre modale de la liste de composants layout paragraph */
.ui-dialog.ui-corner-all.ui-widget.ui-widget-content.ui-front.lpb-dialog {
  top: 50% !important;
  left: 50% !important;
  -webkit-transform: translate(-50%, -55%) !important;
          transform: translate(-50%, -55%) !important;
}

.ui-dialog.lpb-dialog.ui-widget.ui-widget-content.ui-front:not(
    .ui-dialog-off-canvas,
    .ui-dialog-buttons
  ) {
  height: 70% !important;
  width: 70% !important;
  top: 45% !important;
  left: 50% !important;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.ui-dialog.ui-corner-all.ui-widget.ui-widget-content.ui-front.ui-dialog.lpb-dialog:not(
    .ui-dialog-off-canvas,
    .ui-dialog-buttons
  ) {
  height: 70% !important;
  width: 70% !important;
  top: 45% !important;
  left: 50% !important;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.ui-dialog.ui-corner-all.ui-widget.ui-widget-content.ui-front.lpb-dialog
  .lpb-component-list-search-input {
  width: 100%;
}

.ui-dialog.ui-corner-all.ui-widget.ui-widget-content.ui-front.lpb-dialog
  .form-select {
  min-width: 5rem;
  width: auto;
}

.lpb-component-list__group > div > div.lpb-component-list__item {
  width: calc(100% / 7);
  margin: -1px -1px 0 0;
}

.ui-dialog .lpb-component-list__item a {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  text-align: center;
  height: 100%;
  border: 1px solid var(--bs-blue);
  padding: 1rem;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
  text-decoration: none;
}

.ui-dialog .lpb-component-list__item a:hover,
.ui-dialog .lpb-component-list__item a:active,
.ui-dialog .lpb-component-list__item a:focus {
  background-color: var(--bs-yellow);
  color: var(--bs-black);
}

.ui-dialog:not(.ui-dialog-buttons) .ui-widget-content.ui-dialog-content {
  overflow: auto;
  max-height: unset !important;
  height: 100% !important;
}

.ui-dialog-buttonpane.ui-widget-content.ui-helper-clearfix {
  background-color: var(--bs-white) !important;
}

div.ui-dialog .paragraphs-dropdown-action.button.btn-primary {
  background: transparent;
}

.ui-dialog.ui-corner-all.ui-widget.ui-widget-content.ui-front.lpb-dialog
  .tabledrag-toggle-weight-wrapper {
  display: none;
}

.js-form-type-number .form-number.form-control {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

form.layout-paragraphs-builder-form .js-lpb-component-list {
  padding: 0;
}

@media (max-width: 992px) {
  .ui-dialog.ui-corner-all.ui-widget.ui-widget-content.ui-front.lpb-dialog
    .lpb-component-list__group
    > div
    > div {
    width: 33%;
  }

  .ui-dialog.ui-corner-all.ui-widget.ui-widget-content.ui-front.lpb-dialog:not(
      .ui-dialog-off-canvas
    ) {
    width: 90% !important;
  }
}

@media (max-width: 768px) {
  .ui-dialog.ui-corner-all.ui-widget.ui-widget-content.ui-front.lpb-dialog
    .lpb-component-list__group
    > div
    > div {
    width: 100%;
  }
}