/* Redéfinir les variables pour un off-canvas plus clair */
#drupal-off-canvas-wrapper {
  --off-canvas-background-color-light: #f5f5f5 !important;
  --off-canvas-background-color-medium: #ffffff !important;
  --off-canvas-background-color-dark: #e0e0e0 !important;
  --off-canvas-background-color: var(--off-canvas-background-color-medium) !important;
  --off-canvas-text-color: var(--gin-bg-app) !important;
  --off-canvas-link-color: #1a73e8 !important;
  --off-canvas-border-color: #ccc !important;

  --off-canvas-title-background-color: #1a73e8  !important;
  --off-canvas-title-text-color: #ffffff !important;
  --off-canvas-title-font-size: 1rem !important;

  color: var(--gin-color-text);
  background: var(--gin-bg-app);
}


#drupal-off-canvas-wrapper a {
  color: var(--gin-color-primary) !important;
  text-decoration-style: var(--gin-link-decoration-style) !important;
}

#drupal-off-canvas-wrapper a:focus {
  outline: none !important;
  box-shadow: 0 0 0 1px var(--gin-color-focus-border), 0 0 0 4px var(--gin-color-focus) !important;
}

#drupal-off-canvas,
.ui-dialog#drupal-off-canvas-wrapper {
  background: var(--gin-bg-app);
}

#drupal-off-canvas-wrapper .ui-dialog-titlebar {
  background: var(--gin-bg-app) !important;
  color: var(--gin-color-text) !important;
  background-color: var(--gin-bg-layer);
  background-repeat: no-repeat;
  background-attachment: local, local, scroll, scroll;
  background-size: 100% 40px, 100% 40px, 100% 16px, 100% 16px;
  background: linear-gradient(var(--gin-bg-layer) 30%, var(--gin-bg-layer)), linear-gradient(var(--gin-bg-layer), var(--gin-bg-layer) 80%) 0 100%, radial-gradient(farthest-side at 50% 0, rgba(0, 0, 0, .15), rgba(0, 0, 0, 0)), radial-gradient(farthest-side at 50% 100%, rgba(0, 0, 0, .15), rgba(0, 0, 0, 0)) 0 100%;
}

#drupal-off-canvas-wrapper .ui-dialog-titlebar::after {
  margin-block-start: calc(var(--gin-spacing-s) - var(--gin-spacing-xxs));
  padding-block-start: calc(var(--gin-spacing-xs) + var(--gin-spacing-xxs));
  content: "";
  display: block;
  border-block-start: 1px solid var(--gin-border-color-table);

}

#drupal-off-canvas-wrapper .ui-dialog-titlebar::before {
  display: none !important;
}

#drupal-off-canvas-wrapper .ui-dialog-content {
    color: var(--gin-color-text) !important;
}

@media (scripting: enabled) {
    .js-hide.js-hide {
        display: none !important;
    }
}

#drupal-off-canvas-wrapper .bef-link--selected,
#drupal-off-canvas-wrapper .highlight-word {
  color: var(--gin-color-primary-active) !important;
  background-color: var(--gin-bg-item) !important;
}

#drupal-off-canvas-wrapper .node button.word {
  background: transparent;
}


/* Start List */
#drupal-off-canvas .list--unstyled,
#drupal-off-canvas .item-list ul.list--unstyled {
  list-style: none;
  padding: 0;
  margin: 0;
}
#drupal-off-canvas .list--unstyled,
#drupal-off-canvas .item-list ul.list--unstyled li {
  margin: 0; /* optionnel, pour être sûr qu'il n'y a pas d'espacement parasite */
  list-style: none;
}

#drupal-off-canvas .list-horizontal {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  list-style: none;
  padding: 0;
  margin: 0;
}
#drupal-off-canvas .list-horizontal li {
  white-space: nowrap;
  text-align: center;
  list-style: none;
  margin: 0;
}
/* Edn List */

/* @Start Allow OffCanvas Dialog to disallow resizing */
/* Une issue (problème) dans le core de Drupal https://www.drupal.org/project/drupal/issues/3364302  */
#drupal-off-canvas,
.ui-dialog#drupal-off-canvas-wrapper {
  resize: none !important;
}
/* Cache la poignée de redimensionnement si elle apparaît quand même */
.ui-resizable-handle {
  display: none !important;
}
/* @End Allow OffCanvas Dialog to disallow resizing */

/* @Start Scroll and open off canvas, probleme with top */
#drupal-off-canvas-wrapper {
  top: 0 !important;
  height: 100% !important;
}
/* @End Scroll and open off canvas, probleme with top */


/* @Start Pager */
#drupal-off-canvas-wrapper .pager {
  --pager-size: 2rem; /* --space-m Ã— 2 */
  --pager-border-width: 0.125rem; /* 2px */
  --pager-fg-color: var(--color-gray-800);
  --pager-bg-color: var(--color-white);
  --pager-hover-bg-color: var(--color-bgblue-active);
  --pager-focus-bg-color: var(--color-focus);
  --pager-active-fg-color: var(--color-white);
  --pager-active-bg-color: var(--color-absolutezero);
  --pager-border-radius--action: var(--pager-border-width);

  margin-block: var(--space-m);
}

#drupal-off-canvas-wrapper .pager__link {
  color: var(--gin-color-text) !important;
  background-color: transparent !important;
}

#drupal-off-canvas-wrapper .pager__link.is-active,
#drupal-off-canvas-wrapper .pager__item--current {
  color: var(--gin-bg-app) !important;
}

#drupal-off-canvas-wrapper .pager__link:hover,
#drupal-off-canvas-wrapper .pager__link.is-active:hover {
  color: var(--gin-color-button-text) !important;
  background: var(--gin-color-primary-hover) !important;
}

#drupal-off-canvas-wrapper .pager__item--first .pager__link::before {
  -webkit-mask-image: url("../../media/sprite.svg#first-view");
          mask-image: url("../../media/sprite.svg#first-view");
}

#drupal-off-canvas-wrapper .pager__item--previous .pager__link::before {
  -webkit-mask-image: url("../../media/sprite.svg#prev-view");
          mask-image: url("../../media/sprite.svg#prev-view");
}

#drupal-off-canvas-wrapper .pager__item--next .pager__link::after {
  -webkit-mask-image: url("../../media/sprite.svg#next-view");
          mask-image: url("../../media/sprite.svg#next-view");
}

#drupal-off-canvas-wrapper .pager__item--last .pager__link::after {
  -webkit-mask-image: url("../../media/sprite.svg#last-view");
          mask-image: url("../../media/sprite.svg#last-view");
}

#drupal-off-canvas-wrapper .pager__item--first .pager__link::before,
#drupal-off-canvas-wrapper .pager__item--first .pager__link::after,
#drupal-off-canvas-wrapper .pager__item--previous .pager__link::before,
#drupal-off-canvas-wrapper .pager__item--previous .pager__link::after,
#drupal-off-canvas-wrapper .pager__item--next .pager__link::before,
#drupal-off-canvas-wrapper .pager__item--next .pager__link::after,
#drupal-off-canvas-wrapper .pager__item--last .pager__link::before,
#drupal-off-canvas-wrapper .pager__item--last .pager__link::after {
  background: var(--gin-color-text-light) !important;
}

#drupal-off-canvas-wrapper .pager__item--first .pager__link:hover::before,
#drupal-off-canvas-wrapper .pager__item--first .pager__link:hover::after,
#drupal-off-canvas-wrapper .pager__item--previous .pager__link:hover::before,
#drupal-off-canvas-wrapper .pager__item--previous .pager__link:hover::after,
#drupal-off-canvas-wrapper .pager__item--next .pager__link:hover::before,
#drupal-off-canvas-wrapper .pager__item--next .pager__link:hover::after,
#drupal-off-canvas-wrapper .pager__item--last .pager__link:hover::before,
#drupal-off-canvas-wrapper .pager__item--last .pager__link:hover::after {
  background: var(--gin-bg-app) !important;
}

#drupal-off-canvas-wrapper .pager__link.is-active,
#drupal-off-canvas-wrapper .pager__item--current {
  background-color: var(--gin-color-primary) !important;
}
#drupal-off-canvas-wrapper .pager__items {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: center;
  margin: var(--space-m) 0;
  list-style: none;
  text-align: center;
  font-weight: bold;
}
#drupal-off-canvas-wrapper .pager__item {
  display: inline-block;
  margin-inline: calc(var(--space-xs) / 2);
  vertical-align: top;
}
#drupal-off-canvas-wrapper .pager__link,
#drupal-off-canvas-wrapper .pager__item--current {
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-inline-size: var(--pager-size);
  block-size: var(--pager-size);
  padding-inline: var(--space-xs);
  -webkit-text-decoration: none;
  text-decoration: none;
  color: var(--pager-fg-color);
  border-radius: var(--space-m); /* Pager size ÷ 2 */
  background: var(--pager-bg-color); /* Make sure that the text is visible on dark background. */
  line-height: 1;
}
#drupal-off-canvas-wrapper .pager__link:hover,
#drupal-off-canvas-wrapper .pager__link:focus,
#drupal-off-canvas-wrapper .pager__link:active {
  -webkit-text-decoration: none !important;
  text-decoration: none !important;
}
#drupal-off-canvas-wrapper .pager__link:hover,
#drupal-off-canvas-wrapper .pager__link.is-active:hover {
  color: var(--gin-color-button-text) !important;
  background: var(--gin-color-primary-hover) !important;
}
#drupal-off-canvas-wrapper .pager__link--action-link {
  border-radius: var(--pager-border-radius--action);
}
/* Active number link. */
#drupal-off-canvas-wrapper .pager__link.is-active,
#drupal-off-canvas-wrapper .pager__item--current {
  color: var(--pager-active-fg-color);
  border: var(--pager-border-width) solid transparent;
  background: var(--pager-active-bg-color);
}
#drupal-off-canvas-wrapper .pager__item--first #drupal-off-canvas-wrapper .pager__link::before {
  --background-image: url("data:image/svg+xml,%3csvg width='16' height='16' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M2 2v12M14 2L8 8l6 6' stroke='%23545560' stroke-width='2'/%3e%3c/svg%3e");
}
#drupal-off-canvas-wrapper .pager__item--previous #drupal-off-canvas-wrapper .pager__link::before {
  --background-image: url("data:image/svg+xml,%3csvg width='16' height='16' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M11 2L5 8l6 6' stroke='%23545560' stroke-width='2'/%3e%3c/svg%3e");
}
#drupal-off-canvas-wrapper .pager__item--next #drupal-off-canvas-wrapper .pager__link::after {
  --background-image: url("data:image/svg+xml,%3csvg width='16' height='16' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M5 14l6-6-6-6' stroke='%23545560' stroke-width='2'/%3e%3c/svg%3e");
}
#drupal-off-canvas-wrapper .pager__item--last #drupal-off-canvas-wrapper .pager__link::after {
  --background-image: url("data:image/svg+xml,%3csvg width='16' height='16' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M14 14V2M2 14l6-6-6-6' stroke='%23545560' stroke-width='2'/%3e%3c/svg%3e");
}
#drupal-off-canvas-wrapper .pager__item--first  .pager__link::before,
#drupal-off-canvas-wrapper .pager__item--previous .pager__link::before,
#drupal-off-canvas-wrapper .pager__item--next .pager__link::after,
#drupal-off-canvas-wrapper .pager__item--last .pager__link::after {
  position: relative;
  display: inline-block;
  inline-size: 1rem;
  block-size: 1rem;
  content: "";
  background-image: var(--background-image);
  background-repeat: no-repeat;
  background-position: center;
}
@media (forced-colors: active) {
  #drupal-off-canvas-wrapper .pager__item--first .pager__link::before,
  #drupal-off-canvas-wrapper .pager__item--previous .pager__link::before,
  #drupal-off-canvas-wrapper .pager__item--next .pager__link::after,
  #drupal-off-canvas-wrapper .pager__item--last .pager__link::after {
    background-color: linktext;
    background-image: none;
    mask-image: var(--background-image);
    mask-repeat: no-repeat;
    mask-position: center;
  }
}
[dir="rtl"] #drupal-off-canvas-wrapper .pager__item--first .pager__link::before,
[dir="rtl"] #drupal-off-canvas-wrapper .pager__item--previous .pager__link::before,
[dir="rtl"] #drupal-off-canvas-wrapper .pager__item--next .pager__link::after,
[dir="rtl"] #drupal-off-canvas-wrapper .pager__item--last .pager__link::after {
  transform: scaleX(-1);
}
#drupal-off-canvas-wrapper .pager__item--mini {
  margin-inline: calc(var(--space-m) / 2);
}
#drupal-off-canvas-wrapper .pager__link--mini {
  border-radius: 50%;
}
/**
* On the mini pager, remove margins for the previous and next icons.
* Margins are not needed here as there is no accompanying text.
*/
#drupal-off-canvas-wrapper .pager__link--mini::before {
  margin-inline: 0;
}
#drupal-off-canvas-wrapper .pager__item-title--backwards {
  margin-inline-start: 0.5rem;
}
#drupal-off-canvas-wrapper .pager__item-title--forward {
  margin-inline-end: 0.5rem;
}
@media (forced-colors: active) {
  #drupal-off-canvas-wrapper .pager__item a:hover {
    -webkit-text-decoration: underline;
    text-decoration: underline;
  }
}


/* @End Pager */


#drupal-off-canvas-wrapper {
  direction: rtl;
  text-align: right;
  font-family: 'ScheherazadeNew', 'NotoNaskhArabic', serif !important;
  font-size: 1.15rem;
  line-height: 2em;
  transition: color 0.3s;
  cursor: pointer;
}

#drupal-off-canvas-wrapper .field__item {
  margin-block-start: var(--gin-spacing-m);
  line-height: 1.8em;
}

#drupal-off-canvas-wrapper .field--name-body,
#drupal-off-canvas-wrapper .field__label {
  color: var(--gin-color-text);
  font-weight:525;
}
#drupal-off-canvas-wrapper .field__label::after{
  content: ":";
}

/* Start Detail */

#drupal-off-canvas-wrapper .claro-details {
  color: var(--gin-color-text) !important;
  border: 1px solid var(--gin-border-color) !important;
  border-radius: var(--gin-border-m) !important;
  box-shadow: none !important;
  display: block;
  margin-block: var(--space-m);
  color: var(--color-text);
  border: var(--details-border-size) solid var(--gin-border-color-layer);
  border-radius: var(--details-border-size-radius);
  background-color: var(--gin-bg-layer);
  box-shadow: var(--details-box-shadow);
  margin-left: 0;
  margin-right: 0;
}

#drupal-off-canvas-wrapper .claro-details__summary {
  color: var(--gin-color-text);
  background-color: transparent;
  font-weight: var(--gin-font-weight-semibold);
}

#drupal-off-canvas-wrapper .claro-details__summary::after {
  border-radius: var(--gin-border-m) !important;
}

#drupal-off-canvas-wrapper .claro-details__summary:hover {
  color: var(--gin-color-primary) !important;
  background-color: var(--gin-bg-item-hover) !important;
}

#drupal-off-canvas-wrapper details {
  line-height: var(--details-line-height);
}

#drupal-off-canvas-wrapper .claro-details__summary:focus {
  color: var(--gin-color-primary-active);
  outline: none;
  box-shadow: 0 0 0 1px var(--gin-color-focus-border), 0 0 0 4px var(--gin-color-focus);
  border-radius: var(--size-summary-border-radius);
}

#drupal-off-canvas-wrapper [open] .claro-details__summary--accordion,
#drupal-off-canvas-wrapper [open] .claro-details__summary--accordion-item,
#drupal-off-canvas-wrapper [open] .claro-details__summary--vertical-tabs-item {
  color: var(--color-absolutezero);
}

#drupal-off-canvas-wrapper .claro-details__summary:hover::before,
#drupal-off-canvas-wrapper .claro-details__summary:hover:focus::before,
#drupal-off-canvas-wrapper .claro-details[open] > .claro-details__summary:focus::before,
#drupal-off-canvas-wrapper .claro-details[open] > .claro-details__summary--accordion::before,
#drupal-off-canvas-wrapper .claro-details[open] > .claro-details__summary--accordion-item::before,
#drupal-off-canvas-wrapper .claro-details[open] > .claro-details__summary--vertical-tabs-item::before {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3e%3cpath d='M5.21 1.314L3.79 2.723l5.302 5.353-5.303 5.354 1.422 1.408 6.697-6.762z' fill='%230036B1'/%3e%3c/svg%3e");
}

#drupal-off-canvas-wrapper .claro-details[open] > .claro-details__summary {
  border-radius: var(--size-summary-border-radius) var(--size-summary-border-radius) 0 0;
}

/* Remove the marker on Chrome */

#drupal-off-canvas-wrapper summary {
  list-style: none;
  position: relative;
  padding-left: 2.75rem !important;
  padding-right: 2.75rem !important;
}

#drupal-off-canvas-wrapper summary::-webkit-details-marker {
  display: none;
}

#drupal-off-canvas-wrapper summary::before,
#drupal-off-canvas-wrapper .claro-details[open] > summary::before {
  content: "";
  inset-inline-start: 1.125rem;
  background: var(--gin-color-text);
  -webkit-mask-image: url("../../media/sprite.svg#handle-view");
          mask-image: url("../../media/sprite.svg#handle-view");
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center center;
          mask-position: center center;
  -webkit-mask-size: 100% 100%;
          mask-size: 100% 100%;
}

#drupal-off-canvas-wrapper summary::before {
  position: absolute;
  inset-block-start: 50%;
  inset-inline-start: var(--space-s);
  display: inline-block;
  width: var(--space-m);
  height: var(--space-m);
  margin-block-start: calc(var(--space-m) / -2);
  content: "";
  transition: transform var(--details-transform-transition-duration) ease-in 0s;
  transform: rotate(90deg);
  text-align: center;
  background-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3e%3cpath d='M5.21 1.314L3.79 2.723l5.302 5.353-5.303 5.354 1.422 1.408 6.697-6.762z' fill='%23545560'/%3e%3c/svg%3e);
  background-size: contain;
}

#drupal-off-canvas-wrapper .claro-details[open] > summary::before {
  transform: rotate(-90deg); /* for LTR and RTL */
}

@media (forced-colors: active) {
  #drupal-off-canvas-wrapper .claro-details__summary:hover::before,
  #drupal-off-canvas-wrapper .claro-details__summary:hover:focus::before,
  #drupal-off-canvas-wrapper .claro-details[open] > .claro-details__summary:focus::before {
    background: none;
  }

  #drupal-off-canvas-wrapper .claro-details[open] > .claro-details__summary::before,
  #drupal-off-canvas-wrapper [dir="rtl"] .claro-details[open] > .claro-details__summary::before {
    margin-block-start: -0.125rem;
    margin-inline-end: 0.125rem;
    transform: rotate(-45deg); /* for LTR and RTL */
    background: none;
  }
}

#drupal-off-canvas-wrapper .claro-details[open] > .claro-details__summary--accordion,
#drupal-off-canvas-wrapper .claro-details[open] > .claro-details__summary--accordion-item,
#drupal-off-canvas-wrapper .claro-details[open] > .claro-details__summary--vertical-tabs-item {
  box-shadow: var(--details-box-shadow);
}

#drupal-off-canvas-wrapper .claro-details__summary:hover {
  color: var(--color-absolutezero);
  background-color: var(--color-bgblue-hover);
}


/* End Detail */


#drupal-off-canvas-wrapper .views-element-container {
  padding-bottom: 5rem;
}
/* Start Gin Wrapper */
#drupal-off-canvas-wrapper .views-exposed-form.views-exposed-form,
#drupal-off-canvas-wrapper .gin-layer-wrapper {
  width: 100%;
  padding: var(--gin-spacing-s);
  background: var(--gin-bg-layer);
  border: 1px solid var(--gin-border-color-layer);
  box-sizing: border-box;
  margin-block-start: 0;
  box-shadow: var(--gin-shadow-l1);
  border-radius: var(--gin-border-l);
}

@media (min-width: 48em) {
  #drupal-off-canvas-wrapper .views-exposed-form.views-exposed-form,
  #drupal-off-canvas-wrapper .gin-layer-wrapper {
    padding: var(--gin-spacing-l);
  }
}

#drupal-off-canvas-wrapper .views-exposed-form.views-exposed-form {
  display: flex;
  flex-wrap: wrap;
  margin-block: var(--space-l);
  border: var(--details-border-size) solid var(--gin-border-color-layer);
  border-radius: var(--details-border-size-radius);
  background-color: var(--gin-bg-layer);s;
  box-shadow: var(--details-box-shadow);
  border-radius: var(--gin-border-l);
}


#drupal-off-canvas-wrapper .view-header {
    margin-block-end: var(--gin-spacing-l);
}
