/* Resource detail: gallery + information, followed by a full-width discussion. */
html body #root .fl-post-modal {
  width: min(1120px, 96vw) !important;
  max-height: 90dvh !important;
  overflow: auto !important;
  background: var(--nl-tone-10151e, #10151e) !important;
  border: 1px solid var(--nl-tone-344253, #344253) !important;
  border-radius: 18px !important;
  box-shadow: 0 32px 100px #0009 !important;
}
html body #root .fl-post-modal__grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, 1fr) !important;
  grid-template-areas: 'media heading' 'media author' 'media actions' 'discussion discussion' 'comments comments' 'composer composer';
  grid-template-rows: auto auto auto auto auto auto !important;
  gap: 20px 28px !important;
  padding: 28px !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}
html body #root .fl-post-modal__side,
html body #root .fl-post-modal__side-top {
  display: contents !important;
}
html body #root .fl-post-modal__media {
  grid-area: media;
  display: flex !important;
  flex-direction: column !important;
  background: var(--nl-tone-080d14, #080d14) !important;
  border: 1px solid var(--nl-tone-283546, #283546) !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  min-height: 330px !important;
}
html body #root .fl-post-modal__stage {
  flex: 1 !important;
  height: 100% !important;
  min-height: 280px !important;
  aspect-ratio: auto !important;
  background: var(--nl-tone-080d14, #080d14) !important;
}
html body #root .fl-post-modal__stage::before,
html body #root .fl-post-modal__stage::after { display: none !important; }
html body #root .fl-post-modal__img {
  width: 100% !important;
  height: 100% !important;
  max-height: 440px !important;
  object-fit: contain !important;
  border-radius: 0 !important;
}
html body #root .fl-post-modal__thumbs {
  padding: 12px !important;
  background: var(--nl-tone-101925, #101925) !important;
  border-color: var(--nl-tone-283546, #283546) !important;
}
html body #root .fl-post-modal__thumbs:has(> button:only-child) { display: none !important; }
html body #root .fl-post-modal__heading {
  grid-area: heading;
  padding: 10px 20px 0 0 !important;
  min-width: 0 !important;
}
html body #root .fl-post-modal__toolbar {
  position: absolute !important;
  top: 12px !important;
  right: 12px !important;
  z-index: 10 !important;
}
html body #root .fl-post-modal__icon-btn {
  width: 30px !important;
  height: 30px !important;
  background: var(--nl-tone-1b2737, #1b2737) !important;
  color: var(--nl-tone-b9c9df, #b9c9df) !important;
  border-radius: 50% !important;
}
html body #root .fl-post-modal__kicker {
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: 1.8px !important;
  text-transform: uppercase !important;
  color: var(--nl-highlight, var(--nl-tone-96bce8, #96bce8)) !important;
}
html body #root .fl-post-modal__title {
  margin: 12px 0 8px !important;
  color: var(--nl-tone-f1f5fc, #f1f5fc) !important;
  font-size: 34px !important;
  line-height: 1.15 !important;
  font-weight: 650 !important;
  letter-spacing: -1.3px !important;
  overflow-wrap: anywhere;
}
html body #root .fl-post-modal .wkv-badge {
  display: inline-block;
  margin-left: 10px !important;
  padding: 4px 7px !important;
  background: var(--nl-tone-1b283a, #1b283a) !important;
  color: var(--nl-tone-a6bad3, #a6bad3) !important;
  -webkit-text-fill-color: var(--nl-tone-a6bad3, #a6bad3) !important;
  border: 0 !important;
  border-radius: 5px !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  vertical-align: middle !important;
}
html body #root .fl-post-modal .wkr { margin: 8px 0 18px !important; gap: 10px; }
html body #root .fl-post-modal .wkr-text { color: var(--nl-tone-8698af, #8698af) !important; font-size: 11px !important; }
html body #root .fl-post-modal .wkv-tabs { gap: 16px; border-color: var(--nl-tone-2a3646, #2a3646) !important; margin-bottom: 14px !important; }
html body #root .fl-post-modal .wkv-tabs button { padding: 9px 0 !important; font-weight: 500; }
html body #root .fl-post-modal .wkv-tabs button[aria-selected='true'] { color: var(--nl-tone-c9dff9, #c9dff9) !important; border-bottom-color: var(--nl-tone-8eb8e8, #8eb8e8) !important; }
html body #root .fl-post-modal__desc { color: var(--nl-tone-b3c0d2, #b3c0d2) !important; font-size: 13px !important; line-height: 1.8 !important; }
html body #root .fl-post-modal__author {
  grid-area: author;
  margin: 0 !important;
  padding: 14px 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--nl-tone-283546, #283546) !important;
  border-bottom: 1px solid var(--nl-tone-283546, #283546) !important;
  border-radius: 0 !important;
  background: none !important;
}
html body #root .fl-post-modal__avatar { border-radius: 50% !important; width: 32px !important; height: 32px !important; }
html body #root .fl-post-modal__author-name { font-size: 12px !important; color: var(--nl-tone-cbd7e8, #cbd7e8) !important; }
html body #root .fl-post-modal__author-date { font-size: 10px !important; color: var(--nl-tone-8091a9, #8091a9) !important; }
html body #root .fl-post-modal__dl-count { border: 0 !important; background: var(--nl-tone-1b283a, #1b283a) !important; padding: 7px 9px !important; color: var(--nl-tone-b0c4df, #b0c4df) !important; }
html body #root .fl-post-modal__actions { grid-area: actions; padding: 0 !important; gap: 10px !important; margin: 0 !important; }
html body #root .fl-post-modal__actions::before { content: 'ACCÈS À LA RESSOURCE'; font-size: 9px; font-weight: 500; letter-spacing: 1.4px; color: var(--nl-tone-8298b3, #8298b3); margin-bottom: 1px; }
html body #root .fl-post-modal__download {
  min-height: 48px !important;
  height: auto !important;
  padding: 12px 14px !important;
  background: var(--nl-soft, var(--nl-tone-d5e6fb, #d5e6fb)) !important;
  color: var(--nl-tone-14243b, #14243b) !important;
  border-radius: 8px !important;
  font-size: 12px !important;
  font-weight: 650 !important;
}
html body #root .fl-post-modal__download:hover:not(:disabled) { background: var(--nl-tone-edf5ff, #edf5ff) !important; }
html body #root .fl-post-modal__download:disabled { background: var(--nl-tone-243246, #243246) !important; color: var(--nl-tone-90a2b8, #90a2b8) !important; }
html body #root .fl-post-modal__sec-btn { border-color: var(--nl-tone-304055, #304055) !important; background: var(--nl-tone-162131, #162131) !important; color: var(--nl-tone-aabdd7, #aabdd7) !important; font-size: 11px !important; height: 36px !important; border-radius: 7px !important; }
html body #root .fl-post-modal__comments-head {
  grid-area: discussion;
  margin: 6px 0 -14px !important;
  padding: 22px 0 0 !important;
  border-top: 1px solid var(--nl-tone-2b3748, #2b3748) !important;
  background: none !important;
}
html body #root .fl-post-modal__comments-head p { font-size: 14px !important; font-weight: 500 !important; color: var(--nl-tone-d0dceb, #d0dceb) !important; }
html body #root .fl-post-modal__comments {
  grid-area: comments;
  min-height: 36px !important;
  max-height: 220px !important;
  padding: 4px 0 !important;
  background: none !important;
}
html body #root .fl-post-modal__comments-empty { justify-content: flex-start !important; align-items: flex-start !important; padding: 0 !important; min-height: 0 !important; text-align: left !important; font-size: 12px !important; color: var(--nl-tone-788ca7, #788ca7) !important; }
html body #root .fl-post-modal__comments-empty::before { display: none !important; }
html body #root .fl-post-modal__composer {
  grid-area: composer;
  padding: 0 !important;
  background: none !important;
  border: 0 !important;
  position: static !important;
}
html body #root .fl-post-modal__composer-login,
html body #root .fl-post-modal__composer-verify {
  width: auto !important;
  max-width: 100% !important;
  padding: 11px 15px !important;
  border: 1px solid var(--nl-tone-34485f, #34485f) !important;
  border-radius: 7px !important;
  background: var(--nl-tone-1b2a3e, #1b2a3e) !important;
  color: var(--nl-tone-b6cce7, #b6cce7) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
}
@media (max-width: 760px) {
  html body #root .fl-post-modal { width: 96vw !important; max-height: 94dvh !important; border-radius: 13px !important; }
  html body #root .fl-post-modal__grid { grid-template-columns: minmax(0,1fr) !important; grid-template-areas: 'media' 'heading' 'author' 'actions' 'discussion' 'comments' 'composer'; padding: 16px !important; gap: 18px !important; }
  html body #root .fl-post-modal__media { min-height: 0 !important; }
  html body #root .fl-post-modal__stage { min-height: 0 !important; height: auto !important; aspect-ratio: 16/10 !important; }
  html body #root .fl-post-modal__img { height: 100% !important; max-height: 320px !important; }
  html body #root .fl-post-modal__heading { padding: 0 !important; }
  html body #root .fl-post-modal__title { font-size: 29px !important; }
  html body #root .fl-post-modal__toolbar { top: 24px !important; right: 24px !important; }
  html body #root .fl-post-modal__icon-btn { background: var(--nl-tone-0b1523df, #0b1523df) !important; }
}
html body #root .fl-post-modal { height: auto !important; min-height: 0 !important; }
html body #root .fl-post-modal__comments { display: flex !important; flex-direction: column !important; align-items: stretch !important; }
html body #root .fl-post-modal__comments-empty { display: block !important; width: 100% !important; margin: 0 !important; }
html body #root .fl-post-modal__media { max-height: none !important; height: auto !important; }
@media (max-width: 760px) {
  html body #root .fl-post-modal__stage { flex: none !important; width: 100% !important; }
}