/* Volet « Tableau » à côté des cartes de déclinaison et de morphologie (js/grec-tableau.js) */
.refRow { display: flex; justify-content: center; margin: 10px 0 4px; }
.refRow.hidden { display: none; }
.refBtn {
  font: 650 .95rem system-ui, sans-serif; color: var(--blue); background: #fff;
  border: 1.5px solid var(--blue); border-radius: 999px; padding: 8px 18px; cursor: pointer;
}
.refBtn:hover, .refBtn:focus-visible { background: var(--blue); color: #fff; }

.refPanel {
  position: fixed; z-index: 60; display: flex; flex-direction: column;
  background: var(--paper, #fffdf8); box-shadow: 0 -6px 24px rgba(20, 50, 70, .22);
  /* Téléphone et petit écran : volet en bas */
  left: 0; right: 0; bottom: 0; height: 66vh; height: 66dvh;
  border-radius: 16px 16px 0 0; border-top: 1px solid var(--line);
}
.refPanel[hidden] { display: none; }
.refHead { padding: 10px 14px 8px; border-bottom: 1px solid var(--line); background: #edf5f8; border-radius: inherit; }
.refTitleRow { display: flex; align-items: center; gap: 10px; }
.refTitle { flex: 1; min-width: 0; color: #143d55; font-size: 1rem; line-height: 1.3; }
.refClose {
  flex: none; font: 650 .9rem system-ui, sans-serif; color: #fff; background: var(--blue);
  border: 0; border-radius: 999px; padding: 8px 14px; cursor: pointer;
}
.refHint { margin: 6px 0 0; font-size: .85rem; color: var(--muted); }
.refHint.hidden { display: none; }
.refJumpLabel { display: flex; align-items: center; gap: 8px; margin-top: 8px; font-size: .85rem; color: var(--muted); }
.refJumpLabel select { flex: 1; min-width: 0; max-width: 100%; font-size: .9rem; padding: 4px 6px; }
.refScroll { flex: 1; overflow-y: auto; overflow-x: hidden; padding: 4px 12px 24px; -webkit-overflow-scrolling: touch; }
.refScroll .tableaux-section { margin-bottom: 26px; }
.refScroll .tableaux-section h3 { font-size: 1.15rem; }
.refScroll .side-by-side-grid { grid-template-columns: 1fr; }
.refScroll .table-wrap { margin: 8px 0 16px; }

/* Téléphone : laisser de la place pour faire défiler la carte au-dessus du volet */
@media (max-width: 999px) {
  body.refOpen main { padding-bottom: 70vh; padding-bottom: 70dvh; }
  body.refOpen .acc-btn, body.refOpen .pwa-btn { display: none; }
}

/* PC : panneau à droite, la carte reste visible à gauche */
@media (min-width: 1000px) {
  .refPanel {
    left: auto; top: 0; bottom: 0; right: 0; height: auto;
    width: clamp(420px, 46vw, 760px);
    border-radius: 0; border-top: 0; border-left: 1px solid var(--line);
    box-shadow: -6px 0 24px rgba(20, 50, 70, .18);
  }
  body.refOpen { padding-right: clamp(420px, 46vw, 760px); }
}

/* Participes déclinés (section 13) : tableaux un peu plus serrés sur téléphone pour tenir en largeur */
@media (max-width: 520px) {
  #tab-participes .pdf-table th, #tab-participes .pdf-table td { padding: 4px 3px; }
  #tab-participes .pdf-table .col-mode { width: auto; writing-mode: vertical-rl; transform: rotate(180deg); letter-spacing: .04em; }
  #tab-participes .pdf-table th.col-mode-hdr { width: auto; font-size: 0; }
  #tab-participes .pdf-table .gr { font-size: .95rem; }
}

/* Forme de la carte repérée dans le tableau (seulement dans le volet) */
.refScroll .pdf-table td.refHit {
  background: #ffe9a8; box-shadow: inset 0 0 0 2px #d08a00; font-weight: 700; color: #3a2a00;
  border-radius: 4px;
}
