/* stylelint-disable */

/*
  Additional Admin CSS Styles for BAAG
*/

:root {
  --i-contact-fallback: url("data:image/svg+xml;utf8,%3C?xml version='1.0' encoding='utf-8'?%3E %3Csvg viewBox='0 0 200 200' fill='none' xmlns='http://www.w3.org/2000/svg'%3E %3Crect width='200' height='200' style='fill: hsl(var(--c-primary));'/%3E %3Cpath d='M121.35 92.5593H112.833C108.483 95.5966 103.306 97.2253 98.0002 97.2253C92.695 97.2253 87.5175 95.5966 83.1677 92.5593H74.6503C70.8539 92.5593 67.213 94.0674 64.5285 96.7519C61.8441 99.4364 60.3359 103.077 60.3359 106.874V129.997C60.3359 131.875 60.7064 133.735 61.4262 135.47C62.1459 137.205 63.2008 138.781 64.5305 140.107C65.8601 141.434 67.4384 142.485 69.1749 143.201C70.9114 143.917 72.7721 144.283 74.6503 144.279H121.35C123.228 144.283 125.089 143.917 126.826 143.201C128.562 142.485 130.14 141.434 131.47 140.107C132.8 138.781 133.855 137.205 134.574 135.47C135.294 133.735 135.665 131.875 135.665 129.997V106.874C135.665 103.077 134.156 99.4364 131.472 96.7519C128.788 94.0674 125.147 92.5593 121.35 92.5593Z' fill='white'/%3E %3Cpath d='M74.8125 68.3674C74.8125 63.789 76.1697 59.3134 78.7127 55.5062C81.2556 51.699 84.8701 48.7311 89.0994 46.9775C93.3286 45.224 97.9828 44.7635 102.474 45.6544C106.965 46.5452 111.091 48.7474 114.33 51.9825C117.57 55.2176 119.778 59.3405 120.675 63.8301C121.572 68.3198 121.118 72.9746 119.37 77.2062C117.623 81.4379 114.66 85.0566 110.856 87.6049C107.053 90.1531 102.579 91.5166 98.0005 91.523C94.9569 91.5273 91.9424 90.9315 89.1293 89.7697C86.3162 88.6079 83.7597 86.903 81.6061 84.7524C79.4524 82.6017 77.7439 80.0476 76.5782 77.2362C75.4125 74.4247 74.8125 71.411 74.8125 68.3674Z' fill='white'/%3E %3C/svg%3E ");
}

/* Gin */
.gin--dark-mode {
  color-scheme: dark;
}

/* Paragraph browser */
.paragraphs-browser-wrapper h2 {
  grid-column: 1 / -1;
  margin: 2rem 0 -1rem;
}

.paragraphs-browser-wrapper fieldset:not(.fieldgroup) {
  width: 100%;
  margin: unset;
}

.paragraphs-browser-wrapper img {
  max-width: 70%;
  height: auto;
}

.paragraphs-browser-wrapper fieldset {
  margin-left: 0;
}

.paragraphs-browser-wrapper .form-wrapper {
  display: grid;
  gap: 3rem 1rem;
}

.paragraphs-browser-wrapper fieldset:not(.fieldgroup) legend {
  width: auto;
  padding: 0 20px;
  font-weight: bold;
}

.paragraphs-browser-wrapper .button {
  backdrop-filter: blur(1rem);
}

.paragraphs-browser-header {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
}

.paragraphs-browser-paragraph-type:hover {
  border-color: var(--gin-color-primary-hover);
}

.paragraphs-browser-wrapper .form-wrapper:last-child {
  margin-bottom: 4rem;
}

.paragraph-slider {
  overflow: hidden;
}

.paragraph-slider > div {
  display: flex;
  gap: 1rem;
  scroll-snap-type: x mandatory;
  overflow-x: auto;
}

.paragraph-slider .field--name-thumbnail + div {
  display: none;
}

.paragraph-slider .field__item {
  display: grid;
  place-items: center;
  flex-shrink: 0;
}

.paragraph-slider article > div {
  grid-template-columns: 1fr !important;
}

.paragraph--type--text-with-image .field--name-field-storages > .field__label {
  margin: 1rem 0 0.5rem;
}

.paragraph--type--text-with-image .field--name-field-storages > .field__items {
  display: flex;
  overflow-x: auto;
}

.paragraph--type--text-with-image .field--name-field-storages > div > .field__item {
  flex: 1 0 90%;
}

@media (min-width: 768px) {
  .paragraphs-browser-wrapper .form-wrapper {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .paragraphs-browser-wrapper .form-wrapper {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 1280px) {
  .paragraphs-browser-wrapper .form-wrapper {
    grid-template-columns: repeat(4, 1fr);
  }
}

/**
 * Entity Browser
 */
.entity-browser-modal {
  overflow: hidden;
}

.entity-browser-modal .ajax-progress-throbber {
  display: none;
}

.entity-browser-modal .ui-front {
  padding: 0;
}

.entity-browser-form {
  border-radius: 0;
  height: calc(100vh - 2px);
  display: grid;
  grid-template-rows: 1fr auto;
}

.view-storage-entity-browser {
  padding: 1em var(--gin-spacing-l);
}

.entity-browser-form {
  counter-reset: items;
}

.entity-browser-form input[name^="entity_browser_select"]:checked {
  counter-increment: items;
}

.entity-browser-form .views-exposed-form {
  margin-top: 0;
  box-shadow: var(--gin-shadow-l1);
  border-radius: var(--gin-border-l);
  padding: var(--gin-spacing-l);
  padding-top: var(--gin-spacing-xs);
  border: 1px solid var(--gin-border-color-layer);
}

.entity-browser-form > .form-actions {
  padding: var(--gin-spacing-s) var(--gin-spacing-l);
  border-top: 1px solid var(--gin-border-color-layer);
  border-bottom-left-radius: var(--gin-border-m);
  border-bottom-right-radius: var(--gin-border-m);
  background: var(--gin-bg-app);
  justify-content: end;
  align-items: center;
}

.entity-browser-form > .form-actions::before {
  flex: 1;
  content: counter(items) attr(data-t);
  color: var(--gin-color-text-light);
}

.entity-browser-form > .form-actions .button {
  margin: 0;
}

.entity-browser-form .views-row {
  border: 0;
  border-radius: 0;
}

.entity-browser-form .views-row img {
  display: block;
  border-radius: var(--gin-border-xl);
}

.entity-browser-form .views-row:hover img {
  border-color: var(--gin-color-text);
  box-shadow: 0 0 0 2px var(--gin-color-text);
}

.entity-browser-form .views-row .storage > div:only-child {
  display: grid;
  padding-top: 0;
  gap: var(--gin-spacing-xs);
}

.entity-browser-form .views-row .storage > div:only-child::before {
  content: '';
  display: block;
  aspect-ratio: 1/1;
  width: calc(100% + var(--gin-spacing-xs) * 2);
  mask-image: var(--i-contact-fallback);
  -webkit-mask-image: var(--i-contact-fallback);
  background-color: var(--gin-color-text);
  translate: calc(-1 * var(--gin-spacing-xs));
  pointer-events: none;
}

.entity-browser-form .views-row .storage > div:only-child::after {
  content: '';
  display: block;
  aspect-ratio: 1/1;
  border-radius: var(--gin-border-xl);
  position: absolute;
  width: 100%;
  left: 0;
  pointer-events: none;
}

.entity-browser-form .views-row:hover .storage > div:only-child::after {
  border-color: var(--gin-color-text);
  box-shadow: 0 0 0 2px var(--gin-color-text);
}

.entity-browser-form .field--type-string {
  padding: var(--gin-spacing-xs);
  font-size: 0.875rem;
}

.entity-browser-form .pager {
  display: inline-block;
}

.gin--dark-mode .entity-browser-form .views-exposed-form {
  background: var(--gin-bg-layer2);
}

.views-field-entity-browser-select {
  position: static;
  margin: 0%;
}

.views-field-entity-browser-select .form-item__label {
  width: 100%;
  inset: 0;
  aspect-ratio: 1/1;
  display: block;
  height: auto;
  margin: 0;
  clip: unset;
  color: transparent;
}

.views-field-entity-browser-select input[name^="entity_browser_select"] {
  position: absolute;
  margin: var(--gin-spacing-s);
  top: 0;
  left: 0;
}

.gin-entity-browser .entity-browser-form .view-content {
  grid-template-columns: repeat(auto-fit,minmax(180px, 192px));
}

.entities-list .item-container .field__item:nth-child(n+2) {
  border: 0;
  cursor: unset;
  padding: var(--gin-spacing-xs);
  font-size: 0.875rem;
}

.toolbar .toolbar-tab .toolbar-item-baag-translate-interface:before,
.toolbar .toolbar-bar .toolbar-icon-baag-admin-menu-domain-config-page:before {
  -webkit-mask-image: var(--gin-icon-globe) !important;
  mask-image: var(--gin-icon-globe) !important;
}

.min-w-\[120px\] {
  min-width: 120px;
}

.justify-center {
  justify-content: center;
}

.toolbar .toolbar-tray a.is-active {
  background: var(--gin-color-primary-light);
}

.views-data-export-feed .feed-icon {
  margin-top: 1rem;
}
