/* Virtual Hall 360 — chapitres musicaux (module facultatif). */
.vh360__timeline-track { position: relative; }
.vh360__chapters-markers {
  --vh360-chapter-marker-size: 28px;
  position: absolute;
  inset: 0;
  z-index: 4;
  overflow: hidden;
  pointer-events: none;
}
.vh360__chapters-markers[hidden] { display: none; }
.vh360__chapter-tick {
  position: absolute;
  top: 3px;
  z-index: 2;
  width: 2px;
  height: 5px;
  transform: translateX(-50%);
  background: rgba(95, 50, 142, .62);
  pointer-events: none;
}
.vh360__chapter-marker {
  position: absolute;
  top: 50%;
  z-index: 1;
  box-sizing: border-box;
  width: var(--vh360-chapter-marker-size);
  min-width: var(--vh360-chapter-marker-size);
  height: var(--vh360-chapter-marker-size);
  min-height: var(--vh360-chapter-marker-size);
  margin: 0;
  padding: 0 2px;
  transform: translate(-50%, -50%);
  pointer-events: auto;
  border: 1px solid #7445a5;
  border-radius: 999px;
  background: #f7f1fc;
  color: #5f328e;
  box-shadow: 0 0 0 1px rgba(255,255,255,.82);
  font-size: 10px;
  font-weight: 700;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  cursor: pointer;
}
.vh360__chapter-marker[hidden] { display: none; }
.vh360__chapter-group {
  width: 40px;
  min-width: 40px;
  padding: 0 3px;
  white-space: nowrap;
  letter-spacing: -.02em;
}
.vh360__chapter-marker.is-selected { background: #e7d8f4; }
.vh360__chapter-marker.is-current { background: #7445a5; color: #fff; border-color: #5f328e; }
.vh360__chapters-actions { display: flex; grid-column: 1 / -1; grid-row: 2; align-items: center; }
.vh360__chapters-open {
  min-height: 36px;
  padding: 6px 9px;
  border: 1px solid #d4c4e7;
  border-radius: 9px;
  background: #f6f1fa;
  color: #5f328e;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.2;
  cursor: pointer;
}
.vh360__chapters-feedback {
  grid-column: 1 / -1;
  grid-row: 3;
  margin: 2px 0 0;
  color: #5e5569;
  font-size: 12px;
  line-height: 1.35;
}
.vh360__chapters-feedback[hidden] { display: none; }
/* Réglages : carte locale au dialogue, sans modifier les autres panneaux. */
.vh360 [data-settings-panel] .vh360__chapters-settings {
  margin: 10px 0 12px;
  padding: 3px;
  border: 1px solid rgba(116,69,165,.2);
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(247,242,251,.98), rgba(241,233,248,.76));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.75);
}
.vh360 [data-settings-panel] .vh360__chapters-details { margin: 0; }
.vh360 [data-settings-panel] .vh360__chapters-details > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 44px;
  padding: 7px 9px;
  border-radius: 9px;
  color: #512576;
  cursor: pointer;
  list-style: none;
}
.vh360 [data-settings-panel] .vh360__chapters-details > summary::-webkit-details-marker { display: none; }
.vh360 [data-settings-panel] .vh360__chapters-details > summary::marker { content: ''; }
.vh360 [data-settings-panel] .vh360__chapters-title {
  margin: 0;
  color: inherit;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 720;
  letter-spacing: -.01em;
  line-height: 1.25;
}
.vh360 [data-settings-panel] .vh360__chapters-chevron {
  width: 9px;
  height: 9px;
  flex: 0 0 auto;
  margin: -4px 3px 0 0;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  transition: transform .16s ease;
}
.vh360 [data-settings-panel] .vh360__chapters-details[open] > summary .vh360__chapters-chevron {
  margin-top: 5px;
  transform: rotate(225deg);
}
.vh360 [data-settings-panel] .vh360__chapters-content { padding: 0 5px 5px; }
.vh360 [data-settings-panel] .vh360__chapters-work {
  margin: 0 4px 7px;
  color: #625b6b;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.4;
}
.vh360 [data-settings-panel] .vh360__chapters-continuous {
  margin: 0 4px 8px;
  color: #625b6b;
  font-size: 12px;
  line-height: 1.4;
}
.vh360 [data-settings-panel] .vh360__chapters-list { list-style: none; margin: 0; padding: 0; }
.vh360 [data-settings-panel] .vh360__chapter-row {
  position: relative;
  margin: 0;
  padding: 3px 0;
  border-top: 1px solid rgba(116,69,165,.12);
}
.vh360 [data-settings-panel] .vh360__chapter-seek {
  display: grid;
  grid-template-columns: 58px minmax(0,1fr);
  align-items: center;
  width: 100%;
  min-height: 48px;
  padding: 5px 52px 5px 6px;
  border: 1px solid transparent;
  border-radius: 9px;
  background: transparent;
  color: #30293a;
  text-align: left;
  cursor: pointer;
}
.vh360 [data-settings-panel] .vh360__chapter-seek:hover,
.vh360 [data-settings-panel] .vh360__chapter-seek.is-selected {
  border-color: #d9c8e8;
  background: rgba(237,225,247,.72);
}
.vh360 [data-settings-panel] .vh360__chapter-row.is-current .vh360__chapter-seek {
  border-color: #c6addd;
  background: rgba(228,213,241,.86);
  box-shadow: inset 3px 0 0 #7445a5;
}
.vh360 [data-settings-panel] .vh360__chapter-row.is-current .vh360__chapter-seek.is-selected {
  border-color: #a77bcb;
  background: #e4d5f1;
}
.vh360 [data-settings-panel] .vh360__chapter-seek time {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: start;
  min-width: 48px;
  min-height: 25px;
  padding: 3px 7px;
  border-radius: 999px;
  background: #e8dcf2;
  color: #5f328e;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  line-height: 1;
}
.vh360 [data-settings-panel] .vh360__chapter-row.is-current .vh360__chapter-seek time {
  background: #7445a5;
  color: #fff;
}
.vh360 [data-settings-panel] .vh360__chapter-seek strong {
  color: #30293a;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.32;
}
.vh360 [data-settings-panel] .vh360__chapter-note {
  margin: 0;
  color: #514a5b;
  font-size: 12px;
  line-height: 1.45;
}
.vh360 [data-settings-panel] .vh360__chapter-note > summary {
  position: absolute;
  top: 5px;
  right: 0;
  display: grid;
  width: 44px;
  height: 44px;
  margin: 0;
  place-items: center;
  cursor: pointer;
  list-style: none;
}
.vh360 [data-settings-panel] .vh360__chapter-note > summary::-webkit-details-marker { display: none; }
.vh360 [data-settings-panel] .vh360__chapter-note > summary::marker { content: ''; }
.vh360 [data-settings-panel] .vh360__chapter-note-icon {
  display: grid;
  width: 22px;
  height: 22px;
  place-items: center;
  border: 1px solid #aa8bc8;
  border-radius: 50%;
  background: rgba(255,255,255,.72);
  color: #63368f;
  font-family: Georgia, serif;
  font-size: 14px;
  font-style: italic;
  font-weight: 700;
  line-height: 1;
}
.vh360 [data-settings-panel] .vh360__chapter-note[open] > summary .vh360__chapter-note-icon {
  border-color: #7445a5;
  background: #7445a5;
  color: #fff;
}
.vh360 [data-settings-panel] .vh360__chapter-note > p {
  margin: 1px 4px 7px 62px;
  padding: 7px 9px;
  border-left: 2px solid #cdb7e0;
  border-radius: 0 6px 6px 0;
  background: rgba(255,255,255,.48);
}
.vh360 .vh360__chapter-marker:focus-visible, .vh360 .vh360__chapters-open:focus-visible,
.vh360 [data-settings-panel] .vh360__chapters-details > summary:focus-visible,
.vh360 [data-settings-panel] .vh360__chapter-seek:focus-visible,
.vh360 [data-settings-panel] .vh360__chapter-note > summary:focus-visible {
  outline: 2px solid #8b5eb5;
  outline-offset: 2px;
}
/* The transparent rail never catches a drag: only each actual marker can receive input. */
.vh360__chapters-markers { pointer-events: none; }
.vh360__chapters-markers .vh360__chapter-marker { pointer-events: auto; }
.vh360[data-commands-hidden='true'] .vh360__chapters-markers,
.vh360[data-commands-hidden='true'] .vh360__chapters-actions,
.vh360[data-commands-hidden='true'] .vh360__chapters-feedback { visibility: hidden; pointer-events: none; }
.vh360.vh360--expanded[data-mobile-ui='true'] .vh360__chapters-open {
  min-height: 32px;
  padding: 5px 7px;
  border-color: rgba(229,211,244,.55);
  background: rgba(47,30,64,.48);
  color: #fff;
  font-size: 11px;
}
.vh360.vh360--expanded[data-mobile-ui='true'] .vh360__chapters-markers {
  --vh360-chapter-marker-size: 24px;
}
.vh360.vh360--expanded[data-mobile-ui='true'] .vh360__chapter-marker {
  font-size: 9px;
}
.vh360.vh360--expanded[data-mobile-ui='true'] .vh360__chapters-feedback { display: none; }
@media (max-width: 390px) {
  .vh360__chapters-markers { --vh360-chapter-marker-size: 24px; }
  .vh360__chapter-marker { font-size: 9px; }
  .vh360__chapters-open { min-height: 32px; padding: 5px 7px; font-size: 11px; }
  .vh360 [data-settings-panel] .vh360__chapter-seek { grid-template-columns: 52px minmax(0,1fr); }
  .vh360 [data-settings-panel] .vh360__chapter-seek time { min-width: 43px; padding-inline: 6px; }
  .vh360 [data-settings-panel] .vh360__chapter-note > p { margin-left: 56px; }
}
@media (max-height: 420px) and (min-width: 540px) {
  .vh360.vh360--expanded[data-mobile-ui='true'] .vh360__timeline { position: relative; }
  .vh360.vh360--expanded[data-mobile-ui='true'] .vh360__chapters-actions {
    position: absolute;
    z-index: 6;
    top: 50%;
    right: 4px;
    display: flex;
    grid-column: auto;
    grid-row: auto;
    transform: translateY(-50%);
  }
  .vh360.vh360--expanded[data-mobile-ui='true'] .vh360__chapters-open {
    min-width: 24px;
    min-height: 24px;
    padding: 3px 5px;
    font-size: 10px;
  }
  .vh360.vh360--expanded[data-mobile-ui='true'] .vh360__chapters-markers { --vh360-chapter-marker-size: 24px; }
  .vh360.vh360--expanded[data-mobile-ui='true'] .vh360__chapter-marker { font-size: 9px; }
}
