/* Bloc « Accordéon ressources » */

.acc-res {
  display: block;
  width: 100%;
}

.acc-res__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.acc-res__row {
  border-top: 2px solid var(--acc-res-line, #000);
}

.acc-res__row:last-child {
  border-bottom: 2px solid var(--acc-res-line, #000);
}

/* 50 % titre | 50 % extrait OU contenu (même cellule) | pastille */
.acc-res__details {
  --acc-res-pad-top: 0.875rem;
  --acc-res-pad-bottom: 0.875rem;
  --acc-res-pad-bottom-open: 1.5rem;
  --acc-res-pad-inline: 1rem;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
  column-gap: 1.25rem;
  row-gap: 0;
  padding: var(--acc-res-pad-top) var(--acc-res-pad-inline) var(--acc-res-pad-bottom);
  background: transparent;
  box-sizing: border-box;
  align-items: start;
  scroll-margin-top: calc(var(--site-header-offset-top, 9.5rem) + 0.5rem);
}

/* Ouvert : padding bas un peu plus grand */
.acc-res__details[open] {
  padding-bottom: var(--acc-res-pad-bottom-open);
}

.acc-res__summary {
  display: contents;
  list-style: none;
  cursor: pointer;
}

.acc-res__summary::-webkit-details-marker {
  display: none;
}

.acc-res__title.copy,
.acc-res__excerpt.copy,
.acc-res__expand.copy {
  max-width: none;
  margin: 0;
  padding: 0;
  text-align: left;
  text-transform: none;
  color: var(--acc-res-title, inherit);
}

.acc-res__title {
  grid-column: 1;
  grid-row: 1;
}

/* Typo unifiée : titre = extrait = contenu (charte « Petit » / text-2xl) */
.acc-res__title,
.acc-res__excerpt,
.acc-res__expand {
  font-size: var(--text-2xl, 1.25rem) !important;
  line-height: var(--text-2xl--line-height, 1.35) !important;
  letter-spacing: normal;
}

.acc-res__excerpt {
  grid-column: 2;
  grid-row: 1;
  opacity: 0.55;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
  display: block;
}

.acc-res__excerpt:empty {
  display: none;
}

.acc-res__expand {
  grid-column: 2;
  grid-row: 1;
  display: none;
  min-width: 0;
  justify-self: stretch;
}

.acc-res__details[open] .acc-res__excerpt {
  display: none;
}

.acc-res__details[open] .acc-res__expand {
  display: block;
}

/* Pas de padding / marges layout : aligné pixel-perfect avec l’extrait */
.acc-res__expand .layout-section {
  padding: 0 !important;
  margin: 0 !important;
}

.acc-res__expand .layout-grid,
.acc-res__expand .kirby-inner-grid {
  margin: 0 !important;
  padding: 0 !important;
  max-width: none !important;
  width: 100%;
}

.acc-res__expand .layout-column {
  padding: 0;
  margin: 0;
}

/* Boutons layout : même alignement à gauche que le texte (pas le menu header flex-end) */
.acc-res__expand .layout-column:has(.block-type-actions) {
  grid-column: 1 / -1;
  justify-self: start;
  width: auto;
  max-width: 100%;
}

.acc-res__expand .block-type-actions {
  width: auto !important;
  max-width: 100%;
  flex: 0 0 auto !important;
}

.acc-res__expand .block-type-actions .actions-wrapper {
  justify-content: flex-start !important;
  width: auto !important;
  max-width: 100%;
  gap: 0.5rem;
}

.acc-res__expand .block-type-actions .action-item {
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: 100%;
}

.acc-res__expand .block-type-actions .action-item > :is(.button, a.button, button.button) {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
}

.acc-res__expand .space-y-10 > :first-child {
  margin-top: 0 !important;
}

.acc-res__expand .max-w-copy {
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.acc-res__expand .copy,
.acc-res__expand .copy p,
.acc-res__expand .copy li,
.acc-res__expand .copy :is(h1, h2, h3, h4, h5, h6, .text-lg, .text-xl, .text-2xl, .text-3xl, .text-4xl, .text-5xl, .text-6xl, .text-7xl) {
  font-size: inherit !important;
  line-height: inherit !important;
  letter-spacing: normal;
  text-wrap: wrap;
}

.acc-res__expand .copy > :first-child,
.acc-res__expand .layout-column .space-y-10 > :first-child {
  margin-top: 0 !important;
}

.acc-res__expand .copy > p,
.acc-res__expand .copy > ul,
.acc-res__expand .copy > ol {
  margin-top: 0;
  margin-bottom: 0;
}

.acc-res__expand .copy > p + p,
.acc-res__expand .copy > ul + p,
.acc-res__expand .copy > p + ul {
  margin-top: var(--copy-space, 1em);
}

.acc-res__expand .copy > h1,
.acc-res__expand .copy > h2,
.acc-res__expand .copy > h3 {
  margin-top: 0 !important;
  margin-bottom: 0;
}

.acc-res__expand .copy > h1 + *,
.acc-res__expand .copy > h2 + *,
.acc-res__expand .copy > h3 + * {
  margin-top: var(--copy-space, 1em);
}

.acc-res__toggle {
  grid-column: 3;
  grid-row: 1;
  width: 2.125rem;
  height: 2.125rem;
  min-width: 2.125rem;
  min-height: 2.125rem;
  border-radius: 9999px;
  border: 1px solid var(--acc-res-toggle-bg, #000);
  background: var(--acc-res-toggle-bg, #000);
  color: var(--acc-res-toggle-fg, #fff);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
  justify-self: end;
}

.acc-res__toggle::before {
  content: "+";
  font-size: 1.35rem;
  line-height: 1;
  display: block;
  transform: rotate(0deg);
  transform-origin: 50% 50%;
  transition: transform 0.15s ease;
}

.acc-res__details[open] .acc-res__toggle::before {
  transform: rotate(45deg);
}

body:not([data-contrast-mode="bw"]) .acc-res__details[open] {
  background: var(--acc-res-open-bg, #fff) !important;
  background-color: var(--acc-res-open-bg, #fff) !important;
  color: var(--acc-res-open-text, var(--acc-res-page-bg, #000));
}

body:not([data-contrast-mode="bw"]) .acc-res__details[open] .acc-res__title,
body:not([data-contrast-mode="bw"]) .acc-res__details[open] .acc-res__excerpt,
body:not([data-contrast-mode="bw"]) .acc-res__details[open] .acc-res__expand,
body:not([data-contrast-mode="bw"]) .acc-res__details[open] .acc-res__expand :is(.copy, .copy p, .copy li, .copy :is(h1, h2, h3, h4, h5, h6)) {
  color: var(--acc-res-open-text, var(--acc-res-page-bg, #000));
}

body:not([data-contrast-mode="bw"]) .acc-res__details[open] .acc-res__toggle {
  background: var(--acc-res-open-text, var(--acc-res-page-bg, #000));
  border-color: var(--acc-res-open-text, var(--acc-res-page-bg, #000));
  color: #fff;
}

body:not([data-contrast-mode="bw"]) .acc-res__details[open] .acc-res__toggle::before {
  color: #fff;
}

body[data-contrast-mode="bw"] .acc-res__row {
  border-top-color: var(--acc-res-bw-line, #000);
}

body[data-contrast-mode="bw"] .acc-res__row:last-child {
  border-bottom-color: var(--acc-res-bw-line, #000);
}

body[data-contrast-mode="bw"] .acc-res__title {
  color: var(--acc-res-bw-title, inherit);
}

body[data-contrast-mode="bw"] .acc-res__toggle {
  background: var(--acc-res-bw-toggle-bg, #000);
  border-color: var(--acc-res-bw-toggle-bg, #000);
  color: var(--acc-res-bw-toggle-fg, #fff);
}

body[data-contrast-mode="bw"] .acc-res__details[open] {
  background: var(--acc-res-bw-open-bg, #000);
  color: var(--acc-res-bw-open-text, #fff);
}

body[data-contrast-mode="bw"] .acc-res__details[open] .acc-res__title,
body[data-contrast-mode="bw"] .acc-res__details[open] .acc-res__expand {
  color: var(--acc-res-bw-open-text, #fff);
}

body[data-contrast-mode="bw"] .acc-res__details[open] .acc-res__toggle {
  background: var(--acc-res-bw-open-text, #fff);
  border-color: var(--acc-res-bw-open-text, #fff);
  color: var(--acc-res-bw-open-bg, #000);
}

body[data-contrast-mode="bw"] .acc-res__details[open] .acc-res__toggle::before {
  color: var(--acc-res-bw-open-bg, #000);
}

@media (max-width: 767px) {
  /* Ne pas hériter du 5vw global sur .copy p (main.css) */
  .acc-res__expand .copy :is(p, li) {
    font-size: inherit !important;
    line-height: inherit !important;
  }

  .acc-res__details {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto auto;
    row-gap: 0.65rem;
  }

  .acc-res__details[open] {
    row-gap: 1rem;
  }

  .acc-res__title {
    grid-column: 1;
    grid-row: 1;
  }

  .acc-res__excerpt {
    grid-column: 1;
    grid-row: 2;
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  .acc-res__excerpt:empty {
    display: none;
  }

  .acc-res__expand {
    grid-column: 1;
    grid-row: 2;
  }

  .acc-res__details[open] .acc-res__excerpt {
    display: none;
  }

  .acc-res__toggle {
    grid-column: 2;
    grid-row: 1;
    align-self: start;
  }
}

/*
 * Liste déroulante : survol (fermé) et ouvert = mêmes jetons Panel (--acc-res-open-*).
 */
.acc-res__details {
  transition:
    background-color 0.18s ease,
    color 0.18s ease;
}

body:not([data-contrast-mode="bw"]) .acc-res__details:not([open]):hover {
  background-color: var(--acc-res-open-bg, #000) !important;
  color: var(--acc-res-open-text, #fff) !important;
}

body:not([data-contrast-mode="bw"]) .acc-res__details:not([open]):hover .acc-res__title,
body:not([data-contrast-mode="bw"]) .acc-res__details:not([open]):hover .acc-res__excerpt {
  color: var(--acc-res-open-text, #fff) !important;
  -webkit-text-fill-color: var(--acc-res-open-text, #fff);
}

.acc-res__details:not([open]):hover .acc-res__excerpt {
  opacity: 1;
}

body:not([data-contrast-mode="bw"]) .acc-res__details:not([open]):hover .acc-res__toggle {
  background-color: var(--acc-res-open-text, #fff) !important;
  border-color: var(--acc-res-open-text, #fff) !important;
  color: var(--acc-res-open-bg, #000) !important;
}

body:not([data-contrast-mode="bw"]) .acc-res__details:not([open]):hover .acc-res__toggle::before {
  color: var(--acc-res-open-bg, #000) !important;
}

body[data-contrast-mode="bw"] .acc-res__details:not([open]):hover {
  background-color: var(--acc-res-bw-open-bg, #000) !important;
  color: var(--acc-res-bw-open-text, #fff) !important;
}

body[data-contrast-mode="bw"] .acc-res__details:not([open]):hover .acc-res__title,
body[data-contrast-mode="bw"] .acc-res__details:not([open]):hover .acc-res__excerpt {
  color: var(--acc-res-bw-open-text, #fff) !important;
  -webkit-text-fill-color: var(--acc-res-bw-open-text, #fff);
}

body[data-contrast-mode="bw"] .acc-res__details:not([open]):hover .acc-res__toggle {
  background-color: var(--acc-res-bw-open-text, #fff) !important;
  border-color: var(--acc-res-bw-open-text, #fff) !important;
  color: var(--acc-res-bw-open-bg, #000) !important;
}

body[data-contrast-mode="bw"] .acc-res__details:not([open]):hover .acc-res__toggle::before {
  color: var(--acc-res-bw-open-bg, #000) !important;
}

/* Ouvert : jetons Panel (défaut noir / blanc si non renseignés) */
body:not([data-contrast-mode="bw"]) .acc-res__details[open] {
  background-color: var(--acc-res-open-bg, #000) !important;
  color: var(--acc-res-open-text, #fff) !important;
}

body[data-contrast-mode="bw"] .acc-res__details[open] {
  background-color: var(--acc-res-bw-open-bg, #000) !important;
  color: var(--acc-res-bw-open-text, #fff) !important;
}

body:not([data-contrast-mode="bw"]) .acc-res__details[open] .acc-res__title,
body:not([data-contrast-mode="bw"]) .acc-res__details[open] .acc-res__excerpt,
body:not([data-contrast-mode="bw"]) .acc-res__details[open] .acc-res__expand,
body:not([data-contrast-mode="bw"]) .acc-res__details[open] .acc-res__expand :is(.copy, .copy p, .copy li, .copy :is(h1, h2, h3, h4, h5, h6)),
body:not([data-contrast-mode="bw"]) .acc-res__details[open] .acc-res__expand a:not(.button) {
  color: var(--acc-res-open-text, #fff) !important;
  -webkit-text-fill-color: var(--acc-res-open-text, #fff);
}

body[data-contrast-mode="bw"] .acc-res__details[open] .acc-res__title,
body[data-contrast-mode="bw"] .acc-res__details[open] .acc-res__excerpt,
body[data-contrast-mode="bw"] .acc-res__details[open] .acc-res__expand,
body[data-contrast-mode="bw"] .acc-res__details[open] .acc-res__expand :is(.copy, .copy p, .copy li, .copy :is(h1, h2, h3, h4, h5, h6)),
body[data-contrast-mode="bw"] .acc-res__details[open] .acc-res__expand a:not(.button) {
  color: var(--acc-res-bw-open-text, #fff) !important;
  -webkit-text-fill-color: var(--acc-res-bw-open-text, #fff);
}

/* Boutons layout (panel saisonnier) : fond / texte du panel, pas la couleur « ouvert » de l’accordéon */
.acc-res__details[open] .acc-res__expand .layout-section[data-has-seasonal="1"] .block-type-actions .action-item > :is(.button, a.button, button.button):not(.action-download) {
  --button-ring-color: var(--section-button-bg, var(--section-text, #000000)) !important;
  background-color: var(--section-button-bg, var(--section-text, #000000)) !important;
  color: var(--section-button-text, #ffffff) !important;
  -webkit-text-fill-color: var(--section-button-text, #ffffff) !important;
  border-color: var(--section-button-bg, var(--section-text, #000000)) !important;
  outline-color: var(--section-button-bg, var(--section-text, #000000)) !important;
}

.acc-res__details[open] .acc-res__expand .layout-section[data-has-seasonal="1"] .block-type-actions .action-item > :is(.button, a.button, button.button):not(.action-download):is(:hover, :focus-visible) {
  --button-inset-ring: 1px !important;
  --button-ring-color: #000000 !important;
  background-color: #ffffff !important;
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
  border: 0 !important;
  border-color: transparent !important;
  outline: none !important;
  box-shadow: inset 0 0 0 var(--button-inset-ring) var(--button-ring-color) !important;
}

body[data-contrast-mode="bw"] .acc-res__details[open] .acc-res__expand .layout-section[data-has-bw-layout="1"] .block-type-actions .action-item > :is(.button, a.button, button.button):not(.action-download) {
  background-color: var(--bw-section-button-bg, var(--section-button-bg, #000000)) !important;
  color: var(--bw-section-button-text, var(--section-button-text, #ffffff)) !important;
  -webkit-text-fill-color: var(--bw-section-button-text, var(--section-button-text, #ffffff)) !important;
  border-color: var(--bw-section-button-bg, var(--section-button-bg, #000000)) !important;
}

body[data-contrast-mode="bw"] .acc-res__details[open] .acc-res__expand .layout-section[data-has-bw-layout="1"] .block-type-actions .action-item > :is(.button, a.button, button.button):not(.action-download):is(:hover, :focus-visible) {
  background-color: #ffffff !important;
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
  border: 0 !important;
  box-shadow: inset 0 0 0 1px #000000 !important;
}

body:not([data-contrast-mode="bw"]) .acc-res__details[open] .acc-res__toggle {
  background-color: var(--acc-res-open-text, #fff) !important;
  border-color: var(--acc-res-open-text, #fff) !important;
  color: var(--acc-res-open-bg, #000) !important;
}

body:not([data-contrast-mode="bw"]) .acc-res__details[open] .acc-res__toggle::before {
  color: var(--acc-res-open-bg, #000) !important;
}

body[data-contrast-mode="bw"] .acc-res__details[open] .acc-res__toggle {
  background-color: var(--acc-res-bw-open-text, #fff) !important;
  border-color: var(--acc-res-bw-open-text, #fff) !important;
  color: var(--acc-res-bw-open-bg, #000) !important;
}

body[data-contrast-mode="bw"] .acc-res__details[open] .acc-res__toggle::before {
  color: var(--acc-res-bw-open-bg, #000) !important;
}
