/* /css/community.css */

/* -------------------------------------
   COMMUNITY SHELL (coerente con index)
   ------------------------------------- */
html[data-theme] body {
  background-color: #f4f4f4;
  color: #333;
  line-height: 1.5;
  font-family: 'Inter', sans-serif;
}

.container {
  width: 95%;
  max-width: 1400px;
  margin: 20px auto;
  min-height: fit-content;
}

/* Layout a 3 colonne per Desktop */
.page-layout-container {
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 20px;
}

@media (min-width: 992px) {
  .page-layout-container {
    flex-direction: row;
    align-items: flex-start;
  }

  .col-left {
    flex: 0 0 22%;
    max-width: 300px;
    position: sticky;
    top: 80px;
    max-height: calc(100vh - 40px);
    overflow-y: auto;
  }

  .col-center {
    flex: 1;
    min-width: 0;
    max-width: none;
  }

  .col-right {
    flex: 0 0 20%;
    max-width: 20%;
    position: sticky;
    top: 80px;
    max-height: calc(100vh - 40px);
    overflow-y: auto;
  }

  .col-left::-webkit-scrollbar, .col-right::-webkit-scrollbar { width: 5px; }
  .col-left::-webkit-scrollbar-thumb, .col-right::-webkit-scrollbar-thumb { background: #ccc; border-radius: 3px; }
}

@media (max-width: 991px) {
  .col-left, .col-right { display: none; }
  .col-center { max-width: 100%; flex: 1; }
}

/* Barra superiore: ricerca/azioni */
.top-action-bar {
  display: flex;
  align-items: center;
  gap: 15px;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.search-container {
  flex: 1;
  position: relative;
  min-width: 250px;
  display: flex;
}

.search-input-wrapper {
  position: relative;
  width: 100%;
}

.search-input-wrapper input {
  width: 100%;
  padding: 10px 40px 10px 15px;
  border-radius: 20px;
  border: 1px solid rgba(0,0,0,0.1);
  background: rgba(255,255,255,0.7);
  backdrop-filter: blur(10px);
  font-size: 0.95rem;
  outline: none;
  transition: all 0.3s;
}

.search-input-wrapper input:focus {
  background: #fff;
  border-color: #007bff;
  box-shadow: 0 0 0 3px rgba(0,123,255,0.15);
}

.search-btn {
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  color: #888;
  cursor: pointer;
  padding: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: color 0.2s;
}
.search-btn:hover { color: #007bff; }

.search-dropdown {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  margin-top: 5px;
  background: rgba(255,255,255,0.95);
  backdrop-filter: blur(15px);
  border: 1px solid rgba(0,0,0,0.1);
  border-radius: 12px;
  box-shadow: 0 10px 25px rgba(0,0,0,0.1);
  z-index: 100;
  max-height: 400px;
  overflow-y: auto;
}
.search-dropdown.active { display: block; }
.search-dropdown-section { padding: 10px 15px 5px; font-size: 0.75rem; font-weight: 700; color: #888; text-transform: uppercase; letter-spacing: 0.5px; }
.search-dropdown-item {
  display: flex;
  align-items: center;
  padding: 10px 15px;
  text-decoration: none;
  color: #333;
  border-bottom: 1px solid rgba(0,0,0,0.03);
  transition: background 0.2s;
}
.search-dropdown-item:last-child { border-bottom: none; }
.search-dropdown-item:hover { background: rgba(0,123,255,0.05); }
.search-dropdown-item i { width: 20px; color: #aaa; margin-right: 10px; text-align: center; }
.search-dropdown-item .cm-topic-hash-icon {
  width: 20px;
  color: var(--meedico-community, #7c3aed);
  margin-right: 10px;
  text-align: center;
}
.search-dropdown-empty { padding: 15px; text-align: center; color: #777; font-size: 0.9rem; }
.search-loading { padding: 15px; text-align: center; color: #007bff; }

/* Liste laterali */
.list-item-link {
  display: flex;
  align-items: center;
  padding: 8px 12px;
  border-radius: 8px;
  text-decoration: none;
  color: #333;
  font-size: 0.9rem;
  font-weight: 500;
  transition: background 0.2s;
  margin-bottom: 4px;
}
.list-item-link:hover {
  background: rgba(0, 123, 255, 0.1);
  color: #007bff;
}
.list-item-link i { width: 20px; color: #888; }

.topic-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 12px;
  border-radius: 8px;
  margin-bottom: 4px;
  transition: background 0.2s;
}
.topic-row:hover { background: rgba(0,0,0,0.02); }
.topic-info { display: flex; flex-direction: column; }
.topic-name { font-size: 0.9rem; font-weight: 600; color: #333; text-decoration: none; }
.topic-name:hover { color: #007bff; }
.topic-followers { font-size: 0.75rem; color: #777; }

/* Tabs feed */
.filter-tabs { display: flex; gap: 8px; margin-bottom: 15px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: none; }
.filter-tabs::-webkit-scrollbar { display: none; }
.filter-tabs--toolbar {
  margin-bottom: 0;
  padding-bottom: 0;
  gap: 6px;
}
.filter-tab {
  padding: 6px 14px;
  background: rgba(255,255,255,0.6);
  border: 1px solid transparent;
  border-radius: 16px;
  font-size: 0.9rem;
  font-weight: 600;
  color: #555;
  text-decoration: none;
  transition: all 0.2s;
  white-space: nowrap;
}
.filter-tab:hover { background: rgba(0,123,255,0.1); color: #007bff; }
.filter-tab.active { background: #007bff; color: #fff; }

/* STILE BASE & TYPOGRAPHY */
.cm-page-head {
  margin: 16px 0;
}

.cm-breadcrumbs {
  font-size: 0.85rem;
  color: #888;
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 12px;
}

.cm-breadcrumbs a {
  color: #333;
  text-decoration: none;
  font-weight: 600;
}
.cm-breadcrumbs a:hover {
  text-decoration: underline;
}

.cm-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: #111;
  margin: 0 0 4px 0 !important;
  line-height: 1.2;
}

.cm-submeta {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: center;
  font-size: 0.85rem;
  color: #888;
}

.cm-badge {
  display: inline-flex;
  align-items: center;
  height: 24px;
  padding: 0 8px;
  border-radius: 6px;
  font-weight: 600;
  font-size: 0.75rem;
  background: #f0f2f5;
  color: #555;
}

/* TOPIC & CHIP */
.cm-topic-row {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 10px;
}
.cm-topic-chip {
  display: inline-flex;
  align-items: center;
  height: 26px;
  padding: 0 10px;
  border-radius: 13px;
  background: #eef2f6;
  text-decoration: none;
  color: #444;
  font-weight: 600;
  font-size: 0.8rem;
  transition: background 0.2s;
}
.cm-topic-chip:hover {
  background: #dce6f1;
}

/* FILTRI CUMULATIVI (Home) */
.list-item-link.is-active {
  background: rgba(0, 123, 255, 0.12);
  color: #007bff;
}

.topic-name.is-active {
  color: #007bff;
  font-weight: 800;
}

.cm-topic-chip.is-active {
  background: #007bff;
  color: #fff;
}
.cm-topic-chip.is-active:hover {
  background: #0056b3;
}

.cm-inline-filter.is-active {
  color: #007bff;
  font-weight: 700;
  text-decoration: underline;
}

.cm-filter-bar__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.cm-filter-bar__label {
  font-size: 0.85rem;
  color: #666;
  font-weight: 700;
}
.cm-filter-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.cm-filter-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 999px;
  text-decoration: none;
  border: 1px solid rgba(0,0,0,0.08);
  background: rgba(255,255,255,0.65);
  color: #333;
  font-size: 0.85rem;
  font-weight: 600;
}
.cm-filter-chip:hover {
  border-color: rgba(0, 123, 255, 0.35);
  background: rgba(0, 123, 255, 0.08);
  color: #007bff;
}
.cm-filter-chip__type {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.4px;
  color: #888;
  font-weight: 800;
}
.cm-filter-chip:hover .cm-filter-chip__type {
  color: #007bff;
}
.cm-filter-chip__x {
  font-size: 1.1rem;
  line-height: 1;
  opacity: 0.65;
}
.cm-filter-chip:hover .cm-filter-chip__x {
  opacity: 1;
}

/* FORM ELEMENTS MINIMAL */
.cm-input, .cm-select, .cm-textarea {
  width: 100%;
  border: 1px solid #e0e0e0;
  border-radius: 12px;
  padding: 14px 16px;
  font-size: 1rem;
  background: #fcfcfc;
  outline: none;
  font-family: inherit;
  transition: border-color 0.2s, background 0.2s;
}
.cm-input::placeholder, .cm-textarea::placeholder {
  color: #aaa;
}
.cm-input:focus, .cm-select:focus, .cm-textarea:focus {
  border-color: #007bff;
  background: #fff;
}
.cm-textarea {
  min-height: 120px;
  resize: vertical;
}

/* BOTTONI */
.cm-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: #111;
  color: #fff;
  border: none;
  border-radius: 12px;
  padding: 12px 20px;
  font-weight: 600;
  font-size: 0.95rem;
  cursor: pointer;
  transition: transform 0.1s, background 0.2s;
  text-decoration: none;
}
.cm-btn:active {
  transform: scale(0.98);
}
.cm-btn--ghost {
  background: transparent;
  color: #111;
  /* border: 1px solid #ddd; */
}
.cm-btn--ghost:hover {
  background: #f5f5f5;
}
.cm-btn--primary {
  background: #007bff;
  color: #fff;
}
.cm-btn--primary:hover {
  background: #0056b3;
}

/* TOPIC PICKER SCROLLABLE (Rubrica) */
.cm-topic-picker-container {
  max-height: 250px;
  overflow-y: auto;
  border: 1px solid #e0e0e0;
  border-radius: 12px;
  padding: 10px;
  background: #fff;
  /* Scrollbar styling minimal */
  scrollbar-width: thin;
  scrollbar-color: #ccc transparent;
}
.cm-topic-picker-container::-webkit-scrollbar {
  width: 6px;
}
.cm-topic-picker-container::-webkit-scrollbar-thumb {
  background-color: #ccc;
  border-radius: 10px;
}

.cm-topic-letter-group {
  margin-bottom: 12px;
}
.cm-topic-letter-header {
  font-size: 0.9rem;
  font-weight: 800;
  color: #bbb;
  margin: 8px 0 4px 8px;
  text-transform: uppercase;
}
.cm-topic-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
/* Nascondo la checkbox ma la uso per lo stato */
.cm-topic-item input {
  display: none;
}
.cm-topic-item span {
  display: inline-flex;
  align-items: center;
  padding: 6px 14px;
  border-radius: 20px;
  background: #f5f5f5;
  color: #444;
  font-size: 0.9rem;
  font-weight: 500;
  cursor: pointer;
  border: 1px solid transparent;
  transition: all 0.2s;
  user-select: none;
}
.cm-topic-item input:checked + span {
  background: #e6f0ff;
  color: #007bff;
  border-color: #007bff;
  font-weight: 600;
}
.cm-topic-item span:hover {
  background: #e8e8e8;
}

/* UTILS */
.cm-inline-card {
  border: 1px solid #eaeaea;
  background: #fafafa;
  border-radius: 12px;
  padding: 16px;
}
.cm-alert {
  display: none;
  padding: 12px 16px;
  border-radius: 8px;
  border: 1px solid #f5c2c7;
  background: #f8d7da;
  color: #842029;
  margin-top: 12px;
  font-weight: 500;
  font-size: 0.9rem;
}

/* -------------------------------------
   CHAT UI (Discussione Thread)
   ------------------------------------- */
.cm-chat-container {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding-bottom: 24px;
}

/* Riga messaggio: head = avatar + bubble (align end come WA);
   toggle/thread sotto, fuori dal flex dell’avatar */
.cm-chat-row {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  max-width: 100%;
  margin-top: 10px;
  /* salto a citazione: lascia spazio sotto pill data sticky */
  scroll-margin-top: calc(var(--hf-sticky-hub-top, 60px) + 56px);
}
@media (min-width: 769px) {
  .cm-chat-row {
    scroll-margin-top: calc(12px + 56px);
  }
}
.cm-chat-row__head {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  max-width: 100%;
}
.cm-chat-row--me .cm-chat-row__head {
  justify-content: flex-end;
}

.cm-chat-row:first-child {
  margin-top: 0;
}

.cm-chat-row--stacked {
  margin-top: 3px;
}

.cm-chat-row--me {
  /* allineamento gestito su __head */
}

.cm-chat-row__col {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.cm-chat-row--me .cm-chat-row__col {
  flex: 0 1 auto;
  max-width: 85%;
}

/* Toggle risposte: allineato sotto la bubble (offset avatar sulle ricevute) */
.cm-chat-row--theirs > .cm-thread-toggle,
.cm-chat-row--theirs > .cm-thread-indent {
  margin-left: calc(32px + 8px);
}
.cm-chat-row--me > .cm-thread-toggle {
  align-self: flex-end;
}

.cm-msg-avatar,
.cm-msg-avatar-spacer {
  width: 32px;
  height: 32px;
  flex-shrink: 0;
}

.cm-msg-avatar {
  border-radius: 50%;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #dbeafe;
  color: #1e40af;
  font-weight: 700;
  font-size: 0.72rem;
  text-decoration: none;
}

.cm-msg-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.cm-msg-avatar__initials {
  line-height: 1;
}

.cm-msg-avatar--link {
  cursor: pointer;
  transition: opacity 0.15s ease;
}

.cm-msg-avatar--link:hover {
  opacity: 0.88;
}

.cm-msg-avatar--static {
  cursor: default;
}

.cm-op-block .cm-chat-row--op {
  align-items: flex-start;
}

/* Nuvoletta base */
.cm-bubble-wrapper {
  display: flex;
  flex-direction: column;
  max-width: 100%;
}

.cm-chat-row--theirs .cm-bubble-wrapper {
  max-width: 100%;
}

.cm-bubble-wrapper--other { align-self: flex-start; }
.cm-bubble-wrapper--me { align-self: flex-end; }

.cm-bubble-wrapper--author {
  align-self: flex-start;
}

.cm-bubble-wrapper--reply {
  align-self: flex-start; /* Se vuoi farle sembrare tutte ricevute */
  /* align-self: flex-end; /* Se vuoi distinguere "tuoi" e "altri" */
}

/* Identificativo utente e info minime sopra la nuvoletta */
.cm-bubble-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.75rem;
  color: #888;
  margin-bottom: 4px;
  margin-left: 4px;
}
.cm-bubble-meta strong {
  color: #555;
  font-weight: 600;
}

.cm-bubble {
  position: relative;
  --cm-bubble-bg: rgba(255,255,255,0.92);
  --cm-bubble-border: rgba(0,0,0,0.06);
  padding: 12px 16px;
  border-radius: 16px;
  font-size: 0.95rem;
  line-height: 1.5;
  color: #222;
  background: var(--cm-bubble-bg);
  border: 1px solid var(--cm-bubble-border);
  box-shadow: 0 1px 2px rgba(0,0,0,0.05);
  word-wrap: break-word;
}

/* "Tail" WhatsApp semplificato: solo angolo meno smussato, ma SOLO sull'ultimo messaggio consecutivo */
.cm-bubble--has-tail.cm-bubble--tail-left { border-bottom-left-radius: 4px; }
.cm-bubble--has-tail.cm-bubble--tail-right { border-bottom-right-radius: 4px; }

/* Timestamp dentro la bubble (in basso a destra) */
.cm-bubble {
  padding-bottom: 20px; /* spazio per orario */
}
.cm-bubble-time {
  position: absolute;
  right: 10px;
  bottom: 6px;
  font-size: 0.72rem;
  color: rgba(0,0,0,0.45);
  user-select: none;
  white-space: nowrap;
}

/* Autore dentro bubble (WhatsApp-like) */
.cm-bubble-author {
  font-size: 0.78rem;
  font-weight: 800;
  color: rgba(0,0,0,0.55);
  margin: 0 0 6px 0;
  padding-right: 0.25rem;
  max-width: 100%;
  overflow-wrap: anywhere;
}
.cm-chat-row--stacked .cm-bubble-author {
  display: none;
}
.cm-bubble--me .cm-bubble-author { text-align: right; }
.cm-bubble--op .cm-bubble-time {
  color: rgba(0,0,0,0.5);
}

/* Contatore commenti: stessa riga del nome, a destra sotto il chevron */
.cm-bubble--op .cm-bubble-author--op {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-right: 28px; /* spazio angolo chevron, senza riga vuota sopra */
  margin-top: 0;
}
.cm-bubble--op .cm-bubble-author__main {
  min-width: 0;
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cm-bubble--op .cm-bubble-comments {
  position: static;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin: 0;
  font-size: 0.75rem;
  font-weight: 600;
  color: rgba(0, 0, 0, 0.45);
  line-height: 1;
  user-select: none;
  pointer-events: none;
}
.cm-bubble--op .cm-bubble-comments i {
  font-size: 0.78rem;
  opacity: 0.9;
}
.cm-bubble--op .cm-bubble-comments__n {
  font-variant-numeric: tabular-nums;
}
.cm-bubble--op .cm-op-title {
  padding-right: 0.25rem;
}

/* Separatore giorno (WhatsApp-like): sticky DENTRO .cm-day-section
   Gradiente solo quando .is-stuck (attaccata al top), desktop + mobile */
.cm-post-page,
.cm-chat-container {
  --cm-lilac-tint: rgb(0 29 255 / 11%);
  /* stesso lilla della top-bar, reso opaco su bianco */
  --cm-lilac-opaque: color-mix(in srgb, rgb(0, 29, 255) 11%, #ffffff);
}
body.cm-post-page {
  overflow-x: clip;
}
.cm-day-section {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.cm-day-divider {
  --cm-day-sticky-top: var(--hf-sticky-hub-top, 60px);
  position: sticky;
  top: var(--cm-day-sticky-top);
  z-index: 15;
  display: flex;
  justify-content: center;
  margin: 10px 0 6px;
  padding: 6px 0;
  background: transparent;
  pointer-events: none;
  transition: top 0.3s ease-in-out;
}
/* Gradiente grigio full-bleed: parte dal margine superiore pagina (sopra lo sticky)
   per ammorbidire il bordo alto, poi sfuma sotto la pill */
.cm-day-divider.is-stuck {
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: 0;
  padding-left: 0;
  padding-right: 0;
  box-sizing: border-box;
  background: transparent;
  overflow: visible;
}
.cm-day-divider.is-stuck::before {
  content: '';
  position: absolute;
  left: 50%;
  width: 100vw;
  margin-left: -50vw;
  /* Dal top pagina/viewport fino sotto la pill */
  top: calc(-1 * var(--cm-day-sticky-top));
  height: calc(var(--cm-day-sticky-top) + 100%);
  z-index: 0;
  pointer-events: none;
  background: linear-gradient(
    to bottom,
    #f5f5f7 0%,
    #f5f5f7 calc(var(--cm-day-sticky-top) + 18px),
    rgba(245, 245, 247, 0.55) calc(var(--cm-day-sticky-top) + 36px),
    rgba(245, 245, 247, 0) 100%
  );
}
.cm-day-divider span {
  position: relative;
  z-index: 1;
  font-size: 0.75rem;
  font-weight: 600;
  color: #555;
  background: rgba(255,255,255,0.96);
  border: 1px solid rgba(0,0,0,0.08);
  padding: 5px 12px;
  border-radius: 999px;
  backdrop-filter: blur(8px);
  box-shadow: 0 2px 10px rgba(0,0,0,0.08);
}
@media (min-width: 769px) {
  .cm-day-divider {
    --cm-day-sticky-top: 12px;
    top: 12px;
  }
  /* Niente gradiente sticky data su desktop */
  .cm-day-divider.is-stuck {
    width: auto;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    background: transparent;
  }
  .cm-day-divider.is-stuck::before {
    display: none;
  }
}

/* Il post originale (Primo messaggio) */
.cm-bubble--op {
  --cm-bubble-bg: #fff;
  --cm-bubble-border: #e0e0e0;
  background: #fff;
  border: 1px solid #e0e0e0;
}

/* OP tail usa le stesse regole via CSS vars */
.cm-post-page section h1.cm-op-title,
.cm-bubble--op .cm-op-title {
  font-size: 1.1rem;
  font-weight: 700;
  margin-bottom: 6px;
  color: #111;
  text-align: left;
}
.cm-bubble--op .cm-op-body {
  color: #444;
}

/* Annidamento visivo (replies alle replies) — collassabile */
.cm-thread-indent {
  margin-left: 18px;
  border-left: 2px solid var(--cm-lilac-tint, rgb(0 29 255 / 11%));
  padding-left: 12px;
  display: flex;
  flex-direction: column;
  gap: 0;
  margin-top: 6px;
}
.cm-thread-indent[hidden],
.cm-thread-indent.is-collapsed {
  display: none !important;
}
.cm-thread-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 4px 0 2px 4px;
  padding: 4px 10px;
  border: none;
  border-radius: 999px;
  background: var(--cm-lilac-opaque, color-mix(in srgb, rgb(0, 29, 255) 11%, #fff));
  color: #334155;
  font-size: 0.8rem;
  font-weight: 700;
  cursor: pointer;
  align-self: flex-start;
}
.cm-thread-toggle:hover,
.cm-thread-toggle:focus-visible {
  background: color-mix(in srgb, rgb(0, 29, 255) 16%, #ffffff);
  outline: none;
}
.cm-thread-toggle__ico {
  font-size: 0.65rem;
  transition: transform 0.15s ease;
}
.cm-thread-toggle[aria-expanded="true"] .cm-thread-toggle__ico {
  transform: rotate(180deg);
}

/* Spaziatura messaggi: gestita da .cm-chat-row */
.cm-thread-indent > .cm-chat-row {
  margin-top: 10px;
}
.cm-thread-indent > .cm-chat-row:first-child {
  margin-top: 0;
}
.cm-bubble-wrapper--stacked {
  margin-top: 0 !important;
}

/* Azioni legacy (non usate) */
.cm-bubble-actions {
  display: flex;
  gap: 12px;
  margin-top: 4px;
  margin-left: 4px;
}
.cm-bubble-reply-btn {
  background: none;
  border: none;
  color: #007bff;
  font-size: 0.8rem;
  font-weight: 600;
  cursor: pointer;
  padding: 0;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.cm-bubble-reply-btn:hover {
  text-decoration: underline;
}

/* WhatsApp-like: cluster bubble + hover rail fuori dalla nuvoletta */
.cm-msg-cluster {
  display: inline-flex;
  align-items: flex-start;
  gap: 4px;
  max-width: 100%;
  position: relative;
}
.cm-msg-cluster > .cm-bubble {
  max-width: min(100%, 520px);
}
.cm-msg-hover-rail {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  flex-shrink: 0;
  align-self: center; /* smile centrato verticalmente rispetto alla bubble */
  margin-top: 0;
  opacity: 0;
  pointer-events: none;
  transform: translateY(0);
  transition: opacity 0.12s ease;
}
.cm-bubble-wrapper:hover .cm-msg-hover-rail,
.cm-msg-cluster:focus-within .cm-msg-hover-rail,
.cm-msg-hover-rail:focus-within {
  opacity: 1;
  pointer-events: auto;
}
.cm-msg-hover-btn {
  width: 28px;
  height: 28px;
  border-radius: 999px;
  border: none;
  background: rgba(255,255,255,0.92);
  box-shadow: 0 1px 3px rgba(0,0,0,0.12);
  color: #54656f;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  gap: 2px;
  font-size: 0.85rem;
  padding: 0 4px;
  min-width: 28px;
}
.cm-msg-hover-btn:hover {
  background: #fff;
  color: #111b21;
}
.cm-msg-hover-btn.cm-comment-like-btn.is-liked,
.cm-msg-hover-btn.cm-comment-like-btn.is-liked:hover {
  color: #e11d48;
}
.cm-msg-hover-btn .cm-comment-like-num {
  font-size: 0.68rem;
  font-weight: 700;
  line-height: 1;
}
.cm-msg-hover-btn.cm-comment-delete-btn:hover,
.cm-msg-hover-btn.cm-post-delete-btn:hover {
  color: #b91c1c;
}

/* Chevron menu DENTRO la bubble: alone centrato sotto icona, clippato nel corner */
.cm-msg-menu-slot {
  position: absolute;
  top: 0;
  z-index: 4;
  width: 40px;
  height: 34px;
  overflow: hidden; /* maschera alone: non sborda fuori dalla bubble */
  pointer-events: none;
}
.cm-bubble-wrapper--other .cm-msg-menu-slot,
.cm-chat-row--theirs .cm-msg-menu-slot {
  right: 0;
  border-top-right-radius: 16px;
}
.cm-bubble-wrapper--me .cm-msg-menu-slot,
.cm-chat-row--me .cm-msg-menu-slot {
  left: 0;
  border-top-left-radius: 16px;
}
.cm-msg-menu-btn {
  position: absolute;
  top: 2px;
  z-index: 1;
  width: 26px;
  height: 26px;
  border: none;
  border-radius: 999px;
  background: transparent;
  color: rgba(0,0,0,0.45);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  opacity: 0;
  transition: opacity 0.12s ease;
  font-size: 0.72rem;
  padding: 0;
  pointer-events: auto;
}
.cm-bubble-wrapper--other .cm-msg-menu-btn,
.cm-chat-row--theirs .cm-msg-menu-btn {
  right: 2px;
  left: auto;
}
.cm-bubble-wrapper--me .cm-msg-menu-btn,
.cm-chat-row--me .cm-msg-menu-btn {
  left: 2px;
  right: auto;
}
.cm-msg-menu-btn::before {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: 44px;
  height: 44px;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: radial-gradient(
    circle at center,
    var(--cm-bubble-bg, #fff) 0%,
    var(--cm-bubble-bg, #fff) 38%,
    transparent 72%
  );
  z-index: -1;
  pointer-events: none;
}
.cm-bubble:hover .cm-msg-menu-btn,
.cm-bubble:focus-within .cm-msg-menu-btn,
.cm-bubble-wrapper:hover .cm-msg-menu-btn,
.cm-msg-menu-btn:focus-visible {
  opacity: 1;
}
.cm-msg-menu-btn:hover {
  color: #111b21;
}
/* Nome utente: non spostare per lo chevron (overlay) */
.cm-bubble-wrapper--other .cm-bubble-author,
.cm-chat-row--theirs .cm-bubble-author,
.cm-bubble-wrapper--me .cm-bubble-author,
.cm-chat-row--me .cm-bubble-author {
  padding-right: 0.25rem;
  padding-left: 0;
}

/* Reazioni sotto bubble (WhatsApp) */
.cm-bubble {
  padding-bottom: 22px;
}
.cm-bubble:has(.cm-bubble-reactions:not([hidden])) {
  padding-bottom: 28px;
  margin-bottom: 10px;
}
.cm-bubble-reactions {
  position: absolute;
  left: 8px;
  bottom: -10px;
  display: inline-flex;
  flex-wrap: wrap;
  gap: 4px;
  z-index: 3;
  max-width: calc(100% - 16px);
}
.cm-bubble-reaction-chip {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  border: 1px solid rgba(0,0,0,0.1);
  background: var(--cm-bubble-bg, #fff);
  border-radius: 999px;
  padding: 2px 7px;
  font-size: 0.82rem;
  line-height: 1.2;
  cursor: pointer;
  box-shadow: 0 1px 2px rgba(0,0,0,0.06);
}
.cm-bubble-reaction-chip.is-mine {
  border-color: rgba(0,128,105,0.4);
  box-shadow: inset 0 0 0 1px rgba(0,128,105,0.12);
}
.cm-bubble-reaction-chip__n {
  font-size: 0.72rem;
  font-weight: 700;
  color: #54656f;
}

/* Menu hover ↓ */
.cm-msg-hover-menu {
  position: fixed;
  z-index: 1300;
  min-width: 180px;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 8px 28px rgba(0,0,0,0.18);
  padding: 6px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.cm-msg-hover-menu[hidden] { display: none !important; }
.cm-msg-hover-menu button {
  border: none;
  background: transparent;
  text-align: left;
  padding: 10px 12px;
  border-radius: 8px;
  font-size: 0.92rem;
  cursor: pointer;
  color: #111b21;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.cm-msg-hover-menu button i,
.cm-msg-hover-menu button .cm-menu-ico {
  width: 1.15em;
  height: 1.15em;
  flex-shrink: 0;
  text-align: center;
  color: #54656f;
  font-size: 0.95rem;
}
.cm-msg-hover-menu button .cm-menu-ico {
  display: block;
}
.cm-msg-hover-menu button:hover {
  background: rgba(0,0,0,0.05);
}

/* Toast “Messaggio copiato” — lilla top-bar opaco */
.cm-copy-toast {
  position: fixed;
  left: 50%;
  bottom: 28%;
  z-index: 1600;
  transform: translate(-50%, 12px);
  background: var(--cm-lilac-opaque, color-mix(in srgb, rgb(0, 29, 255) 11%, #ffffff));
  color: #111b21;
  font-size: 0.88rem;
  font-weight: 600;
  padding: 10px 16px;
  border-radius: 999px;
  border: none;
  box-shadow: none;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease, transform 0.55s ease;
}
.cm-copy-toast.is-show {
  opacity: 1;
  transform: translate(-50%, -28px);
}
.cm-copy-toast.is-out {
  opacity: 0;
  transform: translate(-50%, -56px);
}
.cm-copy-toast--error {
  background: #fde8e8;
  color: #7f1d1d;
}

/* Picker reazioni — stesso schema messaggi privati (card 16px, no cerchio clipping) */
.mrp {
  position: fixed;
  z-index: 1400;
  background: transparent;
  border-radius: 0;
  box-shadow: none;
  padding: 0;
  width: min(392px, calc(100vw - 16px));
  max-width: min(392px, calc(100vw - 16px));
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 10px;
  overflow: visible;
}
.mrp[hidden] { display: none !important; }

.mrp__tray,
.mrp__full {
  border: 1px solid rgba(15, 23, 42, 0.1);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.16);
  box-sizing: border-box;
}

.mrp__tray {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  padding: 8px;
  flex-shrink: 0;
  order: 1; /* community: presets sopra il catalogo */
}

.mrp__full {
  display: flex;
  flex-direction: column;
  min-height: 0;
  gap: 4px;
  order: 2;
  padding: 8px;
  max-height: min(360px, 62vh);
  overflow: hidden;
}
.mrp__full[hidden] { display: none !important; }

.mrp__emoji {
  appearance: none;
  flex: 1;
  width: auto;
  height: auto;
  min-width: 0;
  border: none;
  background: #f1f5f9;
  border-radius: 12px;
  font-size: 1.35rem;
  line-height: 1.2;
  padding: 10px 4px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.mrp__emoji:hover,
.mrp__emoji.is-selected {
  background: #e2e8f0;
  transform: none;
}
.mrp__emoji--more {
  flex: 0 0 44px;
  font-weight: 700;
  font-size: 1.1rem;
  color: #334155;
  background: #f1f5f9;
}
.mrp__emoji--more[hidden] { display: none !important; }

.mrp__cats {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2px;
  overflow-x: auto;
  padding-bottom: 2px;
  overscroll-behavior: contain;
  flex-shrink: 0;
  scrollbar-width: thin;
}
.mrp__cat {
  appearance: none;
  flex: 1 1 0;
  min-width: 0;
  border: none;
  background: transparent;
  border-radius: 8px;
  height: 34px;
  padding: 0;
  cursor: pointer;
  font-size: 1.05rem;
  color: inherit;
  white-space: nowrap;
}
.mrp__cat.is-active,
.mrp__cat:hover {
  background: #f1f5f9;
  color: inherit;
  font-weight: inherit;
}

.mrp__grid {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 2px;
  overflow-y: auto;
  max-height: min(240px, 42vh);
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
.mrp__emoji--grid,
.mrp__grid .mrp__emoji {
  flex: none;
  width: auto;
  height: auto;
  background: transparent;
  border-radius: 8px;
  font-size: 1.25rem;
  line-height: 1.4;
  padding: 4px 0;
}
.mrp__emoji--grid:hover,
.mrp__grid .mrp__emoji:hover,
.mrp__grid .mrp__emoji.is-selected {
  background: #f1f5f9;
}
.mrp__empty {
  color: #64748b;
  font-size: 0.85rem;
  padding: 10px;
  text-align: center;
  grid-column: 1 / -1;
}

/* Motion stile “pop” (Duolingo-ish) */
.cm-react-pop {
  animation: cm-react-pop 0.42s cubic-bezier(0.34, 1.56, 0.64, 1);
}
@keyframes cm-react-pop {
  0% { transform: scale(1); }
  40% { transform: scale(1.08); }
  100% { transform: scale(1); }
}
.cm-react-burst {
  position: fixed;
  z-index: 1500;
  font-size: 1.6rem;
  pointer-events: none;
  transform: translate(-50%, -50%);
  animation: cm-react-burst 0.65s ease-out forwards;
}
@keyframes cm-react-burst {
  0% { opacity: 1; transform: translate(-50%, -50%) scale(0.4); }
  60% { opacity: 1; transform: translate(-50%, -120%) scale(1.25); }
  100% { opacity: 0; transform: translate(-50%, -160%) scale(0.9); }
}

.cm-msg-context-bar__reacts {
  display: none; /* reazioni = pill floating, non in barra */
}
.cm-msg-context-bar__react {
  display: none;
}

/* Barra contesto mobile long-press: lilla top-bar opaco */
.cm-msg-context-bar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1200;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 10px 12px;
  padding-top: calc(10px + env(safe-area-inset-top, 0px));
  background: var(--cm-lilac-opaque, color-mix(in srgb, rgb(0, 29, 255) 11%, #ffffff));
  color: #111b21;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06), 0 2px 12px rgba(0, 29, 255, 0.06);
  backdrop-filter: blur(12px);
}
.cm-msg-context-bar[hidden] {
  display: none !important;
}
.cm-msg-context-bar__btn {
  border: none;
  background: transparent;
  color: #111b21;
  font-size: 0.92rem;
  font-weight: 600;
  padding: 8px 10px;
  border-radius: 8px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 40px;
  min-height: 40px;
  justify-content: center;
}
.cm-msg-context-bar__btn:hover,
.cm-msg-context-bar__btn:focus-visible {
  background: rgb(0 29 255 / 11%);
  outline: none;
}
.cm-msg-context-bar__spacer {
  flex: 1;
}
.cm-msg-context-bar__close {
  margin-left: 0;
}
.cm-msg-context-bar__more {
  font-size: 1.15rem;
}
body.cm-msg-context-open .cm-bubble.is-context-target {
  outline: 2px solid rgb(0 29 255 / 22%);
  outline-offset: 2px;
}

@media (hover: hover) and (pointer: fine) {
  /* Desktop: solo hover — niente rail persistente */
}
@media (hover: none), (pointer: coarse) {
  .cm-msg-hover-rail {
    display: none !important;
  }
}

/* Legacy absolute-in-bubble (se ancora presente in markup vecchio) */
.cm-bubble-actions-bar {
  position: absolute;
  top: 6px;
  right: 6px;
  display: inline-flex;
  gap: 4px;
  z-index: 2;
}
.cm-bubble-action-btn {
  position: static;
  width: 30px;
  height: 30px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,0.08);
  background: rgba(255,255,255,0.75);
  color: #555;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  opacity: 0;
  transform: translateY(-2px);
  transition: opacity 0.15s ease, transform 0.15s ease, background 0.15s ease;
  gap: 2px;
  font-size: 0.72rem;
  padding: 0 6px;
  min-width: 30px;
}
.cm-bubble:hover .cm-bubble-action-btn,
.cm-bubble:focus-within .cm-bubble-action-btn,
.cm-bubble-action-btn.is-liked {
  opacity: 1;
  transform: translateY(0);
}

/* Tooltip per date */
.cm-tooltip-icon {
  cursor: pointer;
  color: #aaa;
}
.cm-tooltip-icon:hover {
  color: #666;
}

/* INPUT CHAT STICKY (A fondo pagina) */
.cm-chat-input-sticky {
  position: sticky;
  bottom: 80px; /* Spazio per navbar mobile/footer */
  background: rgba(255,255,255,0.95);
  backdrop-filter: blur(10px);
  border-top: 1px solid #eaeaea;
  border-radius: 24px;
  padding: 12px 16px;
  margin-top: auto;
  box-shadow: 0 -4px 20px rgba(0,0,0,0.05);
  z-index: 100;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

/* Post page: barra input stile Telegram (solo contorno esterno) */
.cm-post-page .cm-chat-input-sticky {
  position: sticky;
  bottom: 0;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-radius: 22px;
  box-shadow: 0 2px 12px rgba(15, 23, 42, 0.06);
  backdrop-filter: none;
}

/* App shell community: footer nascosto (desktop + mobile); DOM resta per script/analytics */
body.cm-community-page footer {
  display: none !important;
}

.cm-post-page .cm-chat-input-sticky {
  z-index: 120;
}

.cm-post-page .cm-chat-input-sticky::before {
  display: none;
}

/* Su mobile: stessa posizione/larghezza della barra feed (sopra navbar, gap costante) */
@media (max-width: 991px) {
  .cm-post-page .cm-chat-input-sticky,
  .cm-post-page .cm-post-chat-stage .cm-chat-input-sticky {
    position: fixed;
    left: 18px;
    right: 18px;
    bottom: calc(var(--meedico-nav-stack, 83px) + env(safe-area-inset-bottom, 0px));
    width: auto;
    margin: 0;
    padding: 0;
    border: none;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    z-index: 120;
    transform-origin: center bottom;
    will-change: transform, opacity;
  }
}

/* Desktop: chat stage riempie viewport così l'input resta in basso anche con pochi messaggi */
@media (min-width: 992px) {
  body.cm-post-page {
    --cm-post-stage-offset: 96px;
  }

  .cm-post-page .page-layout-container {
    align-items: stretch;
  }

  .cm-post-page .col-center {
    display: flex;
    flex-direction: column;
  }

  body.cm-post-page .cm-post-main-column {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: calc(100vh - var(--cm-post-stage-offset, 96px));
  }

  .cm-post-page .cm-post-chat-stage {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: calc(100dvh - var(--cm-post-stage-offset, 96px));
  }

  .cm-post-page .cm-post-chat-stage .cm-chat-container {
    flex: 1 1 auto;
    min-height: 0;
    padding-bottom: 8px;
  }

  .cm-post-page .cm-post-chat-stage .cm-chat-input-sticky {
    bottom: 12px;
    margin-top: auto;
    margin-bottom: 12px;
    flex-shrink: 0;
  }
}

/* Post page: barra input stile composer feed (pill + invio esterno) */
.cm-post-page .cm-chat-input-sticky {
  padding: 0;
  border: none;
  background: transparent;
  box-shadow: none;
  border-radius: 0;
}

.cm-post-page .cm-chat-input-row {
  align-items: center;
  gap: 10px;
}

.cm-chat-composer-bar {
  position: relative;
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 2px;
  border: 1px solid rgba(0, 102, 204, 0.18);
  background: #fff;
  border-radius: 999px;
  padding: 5px 6px 5px 4px;
  min-height: 46px;
  overflow: visible;
  box-shadow:
    0 0 0 3px rgba(0, 123, 255, 0.07),
    0 0 22px rgba(0, 123, 255, 0.13),
    0 5px 16px rgba(15, 23, 42, 0.09);
  cursor: text;
}

.cm-chat-bar-emoji,
.cm-chat-bar-attach,
.cm-chat-bar-camera {
  position: relative;
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border: none;
  padding: 0;
  border-radius: 50%;
  background: transparent;
  color: #5b6b7c;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.05rem;
  cursor: pointer;
}
.cm-chat-bar-emoji:hover,
.cm-chat-bar-attach:hover,
.cm-chat-bar-camera:hover {
  color: #007bff;
  background: rgba(0, 123, 255, 0.08);
}

.cm-chat-icon-desktop { display: none !important; }
.cm-chat-icon-mobile { display: inline-block !important; }

.cm-chat-bar-attach-badge {
  position: absolute;
  top: 2px;
  right: 2px;
  min-width: 14px;
  height: 14px;
  padding: 0 3px;
  border-radius: 999px;
  background: #007bff;
  color: #fff;
  font-size: 0.62rem;
  font-weight: 700;
  line-height: 14px;
  text-align: center;
}
.cm-chat-bar-attach-badge[hidden] { display: none !important; }

.cm-chat-bar-field {
  position: relative;
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
}

.cm-post-page .cm-anon-toggle--compact span {
  width: 36px;
  height: 36px;
  padding: 0;
  justify-content: center;
  border-radius: 50%;
  margin-top: 0;
  border: none;
  background: transparent;
  -webkit-tap-highlight-color: transparent;
}

.cm-post-page .cm-anon-toggle--compact input:checked + span {
  background: rgba(0, 123, 255, 0.1);
}

.cm-post-page .cm-anon-toggle--compact input:not(:checked) + span {
  background: transparent;
  color: #444;
}

.cm-post-page .cm-anon-toggle--compact span i {
  font-size: 1.05rem;
  color: #666;
}

.cm-post-page .cm-anon-toggle--compact input:checked + span i {
  color: #007bff;
}

.cm-post-page .cm-anon-toggle--compact input:not(:checked) + span i {
  color: #666;
}

.cm-post-page .cm-anon-toggle--compact .cm-anon-toggle__text {
  display: none;
}

.cm-post-page .cm-chat-input-textarea {
  width: 100%;
  min-height: 36px;
  max-height: 120px;
  padding: 8px 6px;
  border-radius: 0;
  background: transparent;
  border: none;
  box-shadow: none;
  resize: none;
}
.cm-post-page .cm-chat-input-textarea:focus {
  border: none;
  box-shadow: none;
  outline: none;
}

.cm-post-page .cm-chat-send-btn {
  width: 48px;
  height: 48px;
  flex-shrink: 0;
  box-shadow: 0 2px 10px rgba(0, 123, 255, 0.35);
}

.cm-chat-attach-preview {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  padding: 0 4px 8px;
}
.cm-chat-attach-preview[hidden] { display: none !important; }
.cm-chat-attach-preview__item {
  position: relative;
  width: 56px;
  height: 56px;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid rgba(15, 23, 42, 0.1);
}
.cm-chat-attach-preview__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.cm-chat-attach-preview__remove {
  position: absolute;
  top: 2px;
  right: 2px;
  width: 20px;
  height: 20px;
  border: none;
  border-radius: 50%;
  background: rgba(15, 23, 42, 0.72);
  color: #fff;
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
}

.cm-chat-emoji-panel {
  position: absolute;
  left: auto;
  right: 0;
  bottom: calc(100% + 10px);
  z-index: 5;
  width: min(392px, calc(100vw - 16px));
  max-width: 100%;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 0;
  border-radius: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
  max-height: none;
  overflow: visible;
}
.cm-chat-emoji-panel[hidden] { display: none !important; }
.cm-chat-emoji-presets,
.cm-chat-emoji-all {
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.14);
}
.cm-chat-emoji-presets {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  padding: 8px;
  flex-shrink: 0;
  order: 2;
}
.cm-chat-emoji-preset {
  appearance: none;
  flex: 1;
  border: 0;
  background: #f1f5f9;
  border-radius: 12px;
  font-size: 1.35rem;
  line-height: 1.2;
  padding: 10px 4px;
  cursor: pointer;
}
.cm-chat-emoji-preset:hover {
  background: #e2e8f0;
}
.cm-chat-emoji-preset--more {
  flex: 0 0 44px;
  font-weight: 700;
  color: #334155;
}
.cm-chat-emoji-preset--more[hidden] {
  display: none !important;
}
.cm-chat-emoji-all[hidden] {
  display: none !important;
}
.cm-chat-emoji-all {
  display: flex;
  flex-direction: column;
  min-height: 0;
  gap: 4px;
  order: 1;
  padding: 8px;
  max-height: min(360px, 62vh);
  overflow: hidden;
}
.cm-chat-emoji-loading {
  padding: 18px 8px;
  text-align: center;
  color: #6b7280;
  font-size: 0.85rem;
}
.cm-chat-emoji-cats {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2px;
  flex-shrink: 0;
  overflow-x: auto;
  padding-bottom: 2px;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}
.cm-chat-emoji-cat {
  appearance: none;
  flex: 1 1 0;
  min-width: 0;
  width: auto;
  height: 34px;
  border: none;
  border-radius: 10px;
  background: transparent;
  font-size: 1.05rem;
  cursor: pointer;
}
.cm-chat-emoji-cat.is-active,
.cm-chat-emoji-cat:hover {
  background: #f1f5f9;
}
.cm-chat-emoji-grid {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 2px;
  overflow-y: auto;
  max-height: min(240px, 42vh);
  min-height: 0;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
.cm-chat-emoji-btn {
  width: 100%;
  aspect-ratio: 1;
  border: none;
  border-radius: 10px;
  background: transparent;
  font-size: 1.2rem;
  cursor: pointer;
}
.cm-chat-emoji-btn:hover {
  background: #f1f5f9;
}

.cm-bubble-media {
  display: grid;
  gap: 3px;
  margin: 2px 0 6px;
  max-width: min(280px, 74vw);
  border-radius: 14px;
  overflow: hidden;
  background: transparent;
}
.cm-bubble-media--1 {
  grid-template-columns: 1fr;
}
.cm-bubble-media--2,
.cm-bubble-media--3,
.cm-bubble-media--4 {
  grid-template-columns: 1fr 1fr;
}
.cm-bubble-media__item,
.cm-bubble-media__trigger {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 0;
  overflow: hidden;
  /* PNG trasparenti: fondo bubble, non nero */
  background: var(--cm-bubble-bg, #fff);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.cm-bubble-media__item img,
.cm-bubble-media__trigger img {
  display: block;
  width: 100%;
  height: 148px;
  object-fit: cover;
  vertical-align: middle;
  pointer-events: none;
}
.cm-bubble-media--1 .cm-bubble-media__item img,
.cm-bubble-media--1 .cm-bubble-media__trigger img {
  height: auto;
  min-height: 180px;
  max-height: min(360px, 55vh);
  object-fit: cover;
}
.cm-bubble-media--2 .cm-bubble-media__item img,
.cm-bubble-media--2 .cm-bubble-media__trigger img {
  height: 168px;
}
.cm-bubble-media--3 .cm-bubble-media__item img,
.cm-bubble-media--3 .cm-bubble-media__trigger img,
.cm-bubble-media--4 .cm-bubble-media__item img,
.cm-bubble-media--4 .cm-bubble-media__trigger img {
  height: 136px;
}
@media (min-width: 992px) {
  .cm-bubble-media {
    max-width: 320px;
  }
  .cm-bubble-media--1 .cm-bubble-media__item img,
  .cm-bubble-media--1 .cm-bubble-media__trigger img {
    min-height: 200px;
    max-height: 420px;
  }
  .cm-bubble-media--2 .cm-bubble-media__item img,
  .cm-bubble-media--2 .cm-bubble-media__trigger img {
    height: 180px;
  }
  .cm-bubble-media--3 .cm-bubble-media__item img,
  .cm-bubble-media--3 .cm-bubble-media__trigger img,
  .cm-bubble-media--4 .cm-bubble-media__item img,
  .cm-bubble-media--4 .cm-bubble-media__trigger img {
    height: 150px;
  }
}
.cm-bubble-text {
  word-break: break-word;
}

@media (min-width: 992px) {
  .cm-chat-composer-bar {
    padding: 6px 44px 6px 8px;
    min-height: 50px;
    gap: 4px;
  }
  .cm-chat-bar-camera {
    display: none !important;
  }
  .cm-chat-icon-mobile { display: none !important; }
  .cm-chat-icon-desktop { display: inline-block !important; }
  .cm-post-page .cm-chat-input-row {
    gap: 0;
  }
  .cm-chat-bar-attach {
    position: relative;
    z-index: 2;
  }
  .cm-post-page .cm-chat-send-btn {
    width: 36px;
    height: 36px;
    margin-left: -40px;
    margin-right: 8px;
    position: relative;
    z-index: 1;
  }
  .cm-chat-emoji-panel {
    left: auto;
    right: 0;
    width: min(392px, calc(100vw - 48px));
    max-height: none;
  }
}

.cm-anon-toggle--compact {
  position: relative;
  flex-shrink: 0;
}

.cm-anon-float-tip {
  position: absolute;
  left: 50%;
  bottom: calc(100% + 4px);
  transform: translateX(-50%);
  width: auto;
  height: auto;
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  color: #111 !important;
  font-family: inherit;
  font-size: 0.72rem !important;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: normal;
  text-align: center;
  white-space: nowrap;
  display: block;
  pointer-events: none;
  z-index: 30;
  animation: cm-anon-float-up 1.1s ease-out forwards;
  box-shadow: none;
}

@keyframes cm-anon-float-up {
  0% {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
  }
  100% {
    opacity: 0;
    transform: translateX(-50%) translateY(-26px);
  }
}

/* Anonimo minimal */
.cm-anon-label {
  font-weight: 700;
  font-size: 0.85rem;
  color: #666;
}

/* Opzioni input bar */
.cm-chat-input-options {
  display: flex;
  justify-content: flex-start;
  gap: 10px;
  padding: 2px 4px 0;
}

.cm-anon-toggle {
  display: inline-flex;
  align-items: center;
}
.cm-anon-toggle input { display: none; }
.cm-anon-toggle span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,0.12);
  /* background: rgba(255,255,255,0.85); */
  color: #444;
  font-size: 0.75rem;
  font-weight: 700;
  cursor: pointer;
  user-select: none;
  margin-top: 5px;
}
.cm-anon-toggle span i { color: #777; }
.cm-anon-toggle input:checked + span {
  background: rgba(0,123,255,0.12);
  border-color: rgba(0,123,255,0.35);
  color: #007bff;
}
.cm-anon-toggle input:checked + span i { color: #007bff; }

/* -------------------------------------
   NUOVO POST (Typeform-like)
   ------------------------------------- */
.cm-typeform {
  max-width: 760px;
  margin: 0 auto;
}

.cm-typeform-overlay {
  position: relative;
}

.cm-typeform-mode .cm-typeform-overlay {
  position: fixed;
  inset: 0;
  z-index: 3000;
  background: #f4f4f4;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
}
.cm-typeform-mode .cm-typeform-overlay__inner {
  width: 100%;
  max-width: 900px;
}
.cm-typeform-mode main.container { pointer-events: none; }
.cm-typeform-mode .cm-typeform-overlay { pointer-events: auto; }

/* Nascondi top-action-bar/ footer mentre in modalità focus (overlay copre tutto) */
.cm-typeform-mode .top-action-bar,
.cm-typeform-mode footer,
.cm-typeform-mode #bottom-nav,
.cm-typeform-mode #main-header {
  visibility: hidden;
}

.cm-exit-typeform-btn,
.cm-enter-typeform-btn {
  position: fixed;
  top: 135px;
  right: 16px;
  z-index: 3100;
  border: 1px solid rgba(0,0,0,0.12);
  background: rgba(255,255,255,0.9);
  backdrop-filter: blur(12px);
  padding: 10px 12px;
  border-radius: 999px;
  font-weight: 800;
  font-size: 0.9rem;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.cm-exit-typeform-btn:hover,
.cm-enter-typeform-btn:hover {
  border-color: rgba(0,123,255,0.25);
  background: rgba(0,123,255,0.10);
  color: #007bff;
}

.cm-wizard {
  position: relative;
}
.cm-wizard-viewport {
  overflow: hidden;
}
.cm-wizard-track {
  display: flex;
  width: 100%;
  transition: transform 0.35s ease-in-out;
  will-change: transform;
}
.cm-wizard-step {
  flex: 0 0 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  /* min-height: 65vh; */
}
.cm-wizard-step .cm-card {
  width: 100%;
  max-width: 760px;
  box-shadow: none;
  border: 1px solid rgba(0,0,0,0.10);
  background: rgba(255,255,255,0.92);
  backdrop-filter: blur(12px);
}

.cm-wizard-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
  border: 1px solid rgba(0,0,0,0.10);
  background: rgba(255,255,255,0.85);
  backdrop-filter: blur(10px);
  width: 44px;
  height: 44px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: #111;
  transition: transform 0.2s ease, border-color 0.2s ease, background 0.2s ease, opacity 0.2s ease;
}
.cm-wizard-nav:hover {
  border-color: rgba(0,123,255,0.25);
  background: rgba(0,123,255,0.10);
  transform: translateY(-50%) scale(1.03);
}
.cm-wizard-nav[disabled] {
  opacity: 0.35;
  cursor: default;
}
.cm-wizard-nav--prev { left: -54px; }
.cm-wizard-nav--next { right: -54px; }

@media (max-width: 991px) {
  .cm-wizard-nav--prev { left: 6px; }
  .cm-wizard-nav--next { right: 6px; }
}

.cm-wizard-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}
.cm-wizard-title {
  font-size: 1.05rem;
  font-weight: 900;
  margin: 0;
  color: #111;
}

.cm-wizard-footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 14px;
}

.cm-space-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 10px;
}

.cm-space-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 14px 14px;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,0.10);
  background: rgba(255,255,255,0.75);
  cursor: pointer;
  user-select: none;
  transition: border-color 0.2s ease, background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}
.cm-space-card:hover {
  border-color: rgba(0,123,255,0.28);
  background: rgba(0,123,255,0.06);
  box-shadow: 0 10px 22px rgba(0,0,0,0.06);
  transform: translateY(-1px);
}
.cm-space-card input { display: none; }
.cm-space-card__name {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 900;
  color: #111;
  font-size: 0.98rem;
  padding-right: 28px; /* spazio per il check */
}
.cm-space-card__icon {
  flex: 0 0 auto;
  font-size: 1.15rem;
  line-height: 1;
}
.cm-space-card__label {
  min-width: 0;
}
.cm-space-card__hint {
  display: none; /* minimal */
}
.cm-space-card__check {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 26px;
  height: 26px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,0.12);
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(0,0,0,0.35);
  background: rgba(255,255,255,0.85);
}
.cm-space-card input:checked ~ .cm-space-card__check {
  border-color: rgba(0,123,255,0.35);
  background: rgba(0,123,255,0.12);
  color: #007bff;
}
.cm-space-card input:checked ~ .cm-space-card__name {
  color: #007bff;
}

.cm-chat-input-row {
  display: flex;
  align-items: flex-end;
  gap: 10px;
}

.cm-chat-input-textarea {
  flex: 1;
  border: none;
  background: #f0f2f5;
  border-radius: 20px;
  padding: 12px 16px;
  font-size: 0.95rem;
  font-family: inherit;
  resize: none;
  max-height: 120px;
  outline: none;
  overflow-y: auto;
}
.cm-chat-input-textarea::placeholder {
  color: #888;
}

.cm-chat-send-btn {
  background: #007bff;
  color: #fff;
  border: none;
  border-radius: 50%;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  transition: transform 0.1s, background 0.2s;
}
.cm-chat-send-btn:hover { background: #0056b3; }
.cm-chat-send-btn:active { transform: scale(0.9); }

.cm-chat-input-options {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 4px;
}

/* Stile per indicare a chi stiamo rispondendo (quote WhatsApp-like) */
.cm-replying-to {
  display: none;
  align-items: stretch;
  gap: 6px;
  margin-bottom: 6px;
  padding: 0;
  background: transparent;
}
.cm-replying-to.active {
  display: flex;
}
.cm-replying-to__quote {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: stretch;
  gap: 0;
  border: none;
  border-radius: 8px;
  background: #eef2f6;
  padding: 0;
  cursor: pointer;
  text-align: left;
  overflow: hidden;
}
.cm-replying-to__bar {
  width: 4px;
  flex-shrink: 0;
  background: color-mix(in srgb, rgb(0, 29, 255) 35%, #64748b);
}
.cm-replying-to__meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 6px 10px;
  min-width: 0;
}
.cm-replying-to__author {
  font-size: 0.78rem;
  font-weight: 700;
  color: color-mix(in srgb, rgb(0, 29, 255) 42%, #334155);
  line-height: 1.2;
}
.cm-replying-to__body {
  font-size: 0.78rem;
  color: #54656f;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cm-cancel-reply {
  flex-shrink: 0;
  width: 32px;
  border: none;
  background: #eef2f6;
  border-radius: 8px;
  cursor: pointer;
  color: #667781;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.cm-cancel-reply:hover { color: #111b21; background: #e4e8ec; }

/* Citazione dentro bubble (messaggio inviato)
   Larghezza bubble = max(testo risposta, citazione), fino al max della chat */
.cm-bubble:has(> .cm-bubble-quote) {
  width: max-content;
  max-width: min(100%, 520px);
  box-sizing: border-box;
}
.cm-bubble-quote {
  display: flex;
  align-items: stretch;
  width: max-content;
  max-width: 100%;
  box-sizing: border-box;
  margin: 0 0 6px;
  padding: 0;
  border: none;
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.06);
  cursor: pointer;
  text-align: left;
  overflow: hidden;
}
.cm-bubble--me .cm-bubble-quote {
  background: rgba(0, 0, 0, 0.08);
}
.cm-bubble-quote__bar {
  width: 4px;
  flex-shrink: 0;
  background: color-mix(in srgb, rgb(0, 29, 255) 35%, #64748b);
}
.cm-bubble--me .cm-bubble-quote__bar {
  background: color-mix(in srgb, rgb(0, 29, 255) 32%, #64748b);
}
.cm-bubble-quote__meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 6px 8px;
  min-width: 0;
  /* contribuisce alla max-content della bubble */
  max-width: min(70vw, 400px);
}
.cm-bubble-quote__author {
  font-size: 0.78rem;
  font-weight: 700;
  color: color-mix(in srgb, rgb(0, 29, 255) 42%, #334155);
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cm-bubble-quote__body {
  font-size: 0.8rem;
  color: #3b4a54;
  line-height: 1.25;
  /* una riga: la larghezza naturale del testo cita allarga la bubble se > risposta */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.cm-chat-row--flash .cm-bubble {
  animation: cm-quote-flash 1.4s ease;
}
@keyframes cm-quote-flash {
  0%, 100% { box-shadow: none; }
  25%, 55% { box-shadow: 0 0 0 3px rgb(0 29 255 / 22%); }
}

.cm-card {
  position: relative;
  background: rgba(255, 255, 255, 0.55);
  backdrop-filter: blur(12px);
  border-radius: 12px;
  padding: 18px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
}

.cm-card__head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.chat-card {
    cursor: pointer;
    transition: transform 0.2s ease, background-color 0.2s ease, border-color 0.25s ease, box-shadow 0.25s ease;
    padding: 15px;
    border: 1px solid rgba(255, 255, 255, 0);
}
.chat-card:hover {
  border: 1px solid rgba(0, 123, 255, 0.35);
  background-color: rgba(248, 251, 255, 0.8);
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(0, 123, 255, 0.08);
}

/* Colonna centrale (layout generico community) */
.cm-community-main-column {
  position: relative;
  z-index: 1;
}

/* Home community: pannello lettura — tentativo meno “card flottante” (padding ridotto) */
body.cm-community-index main.container {
  width: min(100%, 1400px);
  margin: 10px auto 24px;
  padding: 0 10px;
  box-sizing: border-box;
}

body.cm-community-index .cm-community-main-column {
  background: rgba(255, 255, 255, 0.98);
  border: 1px solid rgba(15, 23, 42, 0.1);
  border-radius: 12px;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.9) inset,
    0 10px 40px rgba(15, 23, 42, 0.08),
    0 2px 10px rgba(15, 23, 42, 0.04);
  padding: 10px 12px 14px;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

@media (max-width: 991px) {
  body.cm-community-index main.container {
    width: 100%;
    margin: 0;
    padding: 0;
  }

  body.cm-community-index .cm-community-main-column {
    /* Lati a filo; un filo di respiro sotto la topbar */
    padding: 8px 0 12px;
    border-radius: 0;
    border-left: none;
    border-right: none;
    border-top: none;
  }

  body.cm-community-index .cm-feed-head {
    padding-left: 12px;
    padding-right: 12px;
  }
}

/* Separatore tra post: elemento a sé, linea dritta (non segue il border-radius della card) */
body.cm-community-index .cm-community-main-column .cm-feed-sep {
  height: 1px;
  margin: 10px 0;
  background: rgba(15, 23, 42, 0.1);
  border: 0;
  flex-shrink: 0;
}

/* Feed home: card piatta a riposo; hover “illuminato” + bordo + angoli */
body.cm-community-index .cm-community-main-column .cm-feed-card.chat-card {
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: none;
  border: 1px solid transparent;
  border-radius: 12px;
  padding: 0;
  margin-bottom: 0;
  transform: none;
}

body.cm-community-index .cm-community-main-column .cm-feed-card.chat-card:hover {
  background: rgba(248, 251, 255, 0.92);
  border: 1px solid rgba(0, 123, 255, 0.35);
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(0, 123, 255, 0.12);
}

/* Sfocatura globale sopra i blob (sotto al contenuto della pagina) */
.cm-blob-frost-layer {
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  background: rgba(244, 246, 248, 0.42);
}

@media (min-width: 992px) {
  .cm-community-page .page-layout-container > .col-left {
    flex: 0 0 22%;
    max-width: 300px;
    align-self: flex-start;
    padding: 12px 14px;
    border-radius: 18px;
    background: rgba(12, 22, 38, 0.07);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid rgba(255, 255, 255, 0.35);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
  }

  .cm-post-page .page-layout-container {
    min-width: 0;
    width: 100%;
  }
}

.cm-sidebar-intro {
  font-size: 0.82rem;
  line-height: 1.45;
  color: #555;
  margin: 0 0 12px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(0, 123, 255, 0.06);
  border: 1px solid rgba(0, 123, 255, 0.12);
}

.cm-sidebar-divider {
  height: 1px;
  background: rgba(0, 0, 0, 0.06);
  margin: 16px 0 12px;
}

.post-meta .meta-votes {
  color: #c45c00;
  font-weight: 600;
}

/* Composer feed → modale nuovo post (campo testo finto) */
.cm-feed-head {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 14px;
}

.cm-feed-compose-row {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
}

.cm-feed-compose-row__login {
  flex-shrink: 0;
  background: #007bff;
  color: #fff;
  text-decoration: none;
  white-space: nowrap;
  padding: 8px 14px;
  border-radius: 999px;
  font-size: 0.88rem;
  font-weight: 700;
}

.cm-feed-compose-field {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 44px;
  padding: 0 16px 0 14px;
  margin: 0;
  border-radius: 20px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(10px);
  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.08), 0 2px 10px rgba(0, 102, 204, 0.06);
  cursor: text;
  text-align: left;
  font: inherit;
  box-sizing: border-box;
  transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}
.cm-feed-compose-field__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: #94a3b8;
  font-size: 1rem;
  line-height: 1;
}
.cm-feed-compose-field__placeholder {
  flex: 1;
  min-width: 0;
  color: #94a3b8;
  font-size: 0.95rem;
  font-weight: 400;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: color 0.2s ease;
}
a.cm-feed-compose-field {
  text-decoration: none;
}
.cm-feed-compose-field:hover,
.cm-feed-compose-field:focus {
  outline: none;
  background: #fff;
  border-color: #007bff;
  box-shadow:
    0 2px 8px rgba(15, 23, 42, 0.1),
    0 4px 14px rgba(0, 102, 204, 0.1),
    0 0 0 3px rgba(0, 123, 255, 0.12);
}
.cm-feed-compose-field:hover .cm-feed-compose-field__placeholder,
.cm-feed-compose-field:focus .cm-feed-compose-field__placeholder {
  color: #64748b;
}
.cm-feed-compose-field:active {
  box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.18);
}

.cm-feed-toolbar {
  --cm-feed-toolbar-h: 40px;
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-width: 0;
  min-height: var(--cm-feed-toolbar-h);
}
.cm-feed-toolbar .cm-feed-search-wrap {
  flex: 1;
  min-width: 0;
  margin-bottom: 0;
  display: flex;
  align-items: center;
}
.cm-feed-toolbar .search-container {
  width: 100%;
  max-width: none;
}
.cm-feed-toolbar .search-input-wrapper {
  display: flex;
  align-items: center;
  width: 100%;
}
.cm-feed-toolbar .search-input-wrapper input {
  height: var(--cm-feed-toolbar-h);
  box-sizing: border-box;
  padding-top: 0;
  padding-bottom: 0;
  line-height: var(--cm-feed-toolbar-h);
}
.cm-feed-sort {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
  max-width: 100%;
  height: var(--cm-feed-toolbar-h);
}
.cm-feed-sort__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: var(--cm-feed-toolbar-h);
  color: #64748b;
  font-size: 0.95rem;
  flex-shrink: 0;
  line-height: 1;
}
.cm-feed-toolbar .cm-feed-sort .filter-tabs.filter-tabs--toolbar {
  display: flex;
  align-items: center;
  align-self: center;
  gap: 6px;
  height: var(--cm-feed-toolbar-h);
  margin: 0;
  padding: 0;
  overflow-x: auto;
  scrollbar-width: none;
}
.cm-feed-toolbar .cm-feed-sort .filter-tabs.filter-tabs--toolbar::-webkit-scrollbar {
  display: none;
}
.cm-feed-toolbar .cm-feed-sort .filter-tabs.filter-tabs--toolbar .filter-tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: var(--cm-feed-toolbar-h);
  min-height: var(--cm-feed-toolbar-h);
  padding: 0 12px;
  margin: 0;
  line-height: 1;
  font-size: 0.82rem;
  box-sizing: border-box;
  flex-shrink: 0;
}

@media (min-width: 992px) {
  .cm-feed-compose-row__login {
    display: none !important;
  }
}

.cm-feed-hint {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  padding: 8px 12px;
  border-radius: 10px;
  font-size: 0.82rem;
  line-height: 1.35;
}
.cm-feed-hint--follow {
  background: rgba(238, 245, 255, 0.85);
  border: 1px solid #b8daff;
  color: #004085;
  width: 100%;
  text-align: left;
  font: inherit;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease;
}
button.cm-feed-hint--follow:hover,
button.cm-feed-hint--follow:focus-visible {
  background: rgba(219, 234, 254, 0.95);
  border-color: #80bdff;
  outline: none;
}
.cm-feed-hint i {
  flex-shrink: 0;
  opacity: 0.85;
}

@media (max-width: 991px) {
  .cm-feed-toolbar {
    flex-wrap: nowrap;
  }
  .cm-feed-sort {
    overflow-x: auto;
    scrollbar-width: none;
  }
  .cm-feed-sort::-webkit-scrollbar {
    display: none;
  }
}

/* Legacy composer (altre pagine) */
.cm-feed-composer {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 14px 18px;
  margin-bottom: 14px;
  border-radius: 14px;
  border: 1px solid rgba(0, 123, 255, 0.22);
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.95) 0%, rgba(240, 248, 255, 0.92) 100%);
  box-shadow: 0 4px 18px rgba(0, 86, 179, 0.12);
  cursor: pointer;
  color: #334;
  font-size: 0.98rem;
  font-weight: 600;
  transition: border-color 0.2s, box-shadow 0.2s, transform 0.15s;
  text-align: left;
}
.cm-feed-composer:hover,
.cm-feed-composer:focus {
  outline: none;
  border-color: rgba(0, 123, 255, 0.45);
  box-shadow: 0 6px 22px rgba(0, 86, 179, 0.18);
  transform: translateY(-1px);
  color: #222;
}
.cm-feed-composer i {
  color: #007bff;
  font-size: 1.15rem;
}

a.cm-feed-composer {
  text-decoration: none;
  box-sizing: border-box;
}

/* Modali (topic grid + nuovo post) */
.modal-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(4px);
  z-index: 1050;
  align-items: center;
  justify-content: center;
}
.modal-overlay.active {
  display: flex;
}
.modal-content {
  background: rgba(255, 255, 255, 0.95);
  border-radius: 16px;
  width: 90%;
  max-width: 600px;
  max-height: 85vh;
  display: flex;
  flex-direction: column;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);
}
.modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.modal-body {
  padding: 20px;
  overflow-y: auto;
  flex: 1;
}
.modal-topic-grid {
  display: flex;
  flex-direction: column;
  gap: 1.1rem;
  width: 100%;
}

/* Sovrascrive eventuali regole legacy: una lettera per “fila”, mai affiancata */
#topicsModal .modal-topic-grid {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 100%;
}

.cm-modal-topic-card {
  padding: 8px 10px;
}

.cm-modal-topic-hint {
  font-size: 0.88rem;
  color: #555;
  line-height: 1.45;
  margin: 0 0 0.35rem;
}

.cm-modal-topic-letter__head {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: #888;
  text-transform: uppercase;
  margin-bottom: 0.45rem;
  padding-bottom: 0.25rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.cm-modal-topic-letter {
  width: 100%;
}

.cm-modal-topic-letter__list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.cm-modal-topic-letter__list > .cm-card {
  width: 100%;
}

.cm-feed-stream {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.cm-feed-sentinel {
  height: 1px;
  margin: 0;
  padding: 0;
  pointer-events: none;
}

.cm-feed-loading {
  text-align: center;
  padding: 14px 10px;
  font-size: 0.9rem;
  color: #666;
}

#newPostModal.modal-overlay {
  background: rgba(0, 0, 0, 0.42);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
#newPostModal.modal-overlay.active {
  align-items: flex-start;
  padding: max(10px, env(safe-area-inset-top)) 10px max(10px, env(safe-area-inset-bottom));
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
#newPostModal .modal-content {
  margin: auto;
  width: 100%;
  background: transparent;
  box-shadow: none;
  border: none;
  max-width: min(560px, 94vw);
  max-height: min(92vh, 92dvh);
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
#newPostModal .modal-header {
  flex-shrink: 0;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255, 255, 255, 0.5);
  border-radius: 16px;
  box-shadow: 0 4px 28px rgba(0, 0, 0, 0.07);
}
#newPostModal .modal-body {
  flex: 1 1 auto;
  min-height: 0;
  background: transparent;
  padding: 12px 0 calc(16px + env(safe-area-inset-bottom, 0px));
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}
#newPostModal .cm-wizard {
  position: relative;
  padding: 0;
  display: flex;
  flex-direction: column;
}
#newPostModal .cm-wizard-viewport {
  overflow: hidden;
  border-radius: 16px;
  transition: height 0.2s ease;
}
#newPostModal .cm-wizard-track {
  align-items: flex-start;
}
#newPostModal .cm-wizard-step {
  align-items: flex-start;
  justify-content: flex-start;
}
#newPostModal .cm-wizard-step .cm-card {
  background: rgba(255, 255, 255, 0.82);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(255, 255, 255, 0.55);
  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.08);
}
#newPostModal .np-oggetto-hint {
  font-size: 0.88rem;
  color: #555;
  margin: 0 0 14px;
  line-height: 1.45;
}
#newPostModal .np-step-actions {
  margin-top: 20px;
  display: flex;
  justify-content: flex-end;
}
#newPostModal .np-wizard-nav-row {
  display: none;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-top: 12px;
  padding: 0 2px;
  flex-shrink: 0;
}
#newPostModal .np-wizard-nav-btn {
  position: static;
  transform: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: 12px;
  font-weight: 600;
  font-size: 0.92rem;
  cursor: pointer;
  border: 1px solid rgba(0, 0, 0, 0.12);
  background: rgba(255, 255, 255, 0.9);
  color: #333;
  transition: background 0.2s, border-color 0.2s;
}
#newPostModal .np-wizard-nav-btn:hover:not(:disabled) {
  border-color: rgba(0, 123, 255, 0.35);
  background: rgba(0, 123, 255, 0.08);
  color: #007bff;
}
#newPostModal .np-wizard-nav-btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
#newPostModal .np-wizard-nav-btn--next {
  border-color: rgba(0, 123, 255, 0.35);
  background: #007bff;
  color: #fff;
}
#newPostModal .np-wizard-nav-btn--next:hover:not(:disabled) {
  background: #0069d9;
  color: #fff;
}

#newPostModal .np-new-tag-hint {
  font-size: 0.82rem;
  color: #666;
  margin: 0 0 12px;
  line-height: 1.45;
}

.np-post-images {
  margin-top: 14px;
}

.np-post-images__add {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border-radius: 12px;
  border: 1.5px dashed rgba(0, 102, 204, 0.45);
  background: rgba(0, 102, 204, 0.06);
  color: #0066cc;
  font-weight: 700;
  font-size: 0.9rem;
  cursor: pointer;
  font-family: inherit;
  transition: background 0.15s, border-color 0.15s;
}

.np-post-images__add:hover {
  background: rgba(0, 102, 204, 0.12);
  border-color: rgba(0, 102, 204, 0.65);
}

.np-post-images__add-icon {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08);
}

.np-post-images__add-badge {
  margin-left: 2px;
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  border-radius: 999px;
  background: #0066cc;
  color: #fff;
  font-size: 0.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.np-post-images__hint {
  margin: 8px 0 0;
  color: #64748b;
  font-size: 0.78rem;
}

.np-post-images__input {
  display: none;
}

.np-post-images__preview {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.np-post-images__preview img {
  width: 72px;
  height: 72px;
  object-fit: cover;
  border-radius: 10px;
  border: 1px solid rgba(15, 23, 42, 0.12);
}

.np-post-images__tile {
  position: relative;
  width: 72px;
  height: 72px;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid rgba(15, 23, 42, 0.12);
  background: #f8fafc;
}

.np-post-images__tile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border: 0;
  border-radius: 0;
}

.np-post-images__tile-remove {
  position: absolute;
  top: 4px;
  right: 4px;
  width: 22px;
  height: 22px;
  border: 0;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.72);
  color: #fff;
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}

.np-post-images__tile-remove:hover {
  background: rgba(15, 23, 42, 0.9);
}

.cm-post-media {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}

.cm-post-media--feed {
  margin-top: 10px;
}

.cm-post-media--multi {
  grid-template-columns: repeat(2, 1fr);
  align-items: start;
}

.cm-post-media__item {
  margin: 0;
  min-width: 0;
}

.cm-post-media__frame {
  width: 100%;
  max-height: 280px;
  aspect-ratio: var(--cm-media-ar, 4 / 3);
  border-radius: 12px;
  overflow: hidden;
  background: rgba(15, 23, 42, 0.04);
}

.cm-post-media--feed .cm-post-media__frame {
  max-height: 160px;
}

.cm-post-media--full .cm-post-media__frame {
  max-height: 320px;
}

.cm-post-media__frame img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  user-select: none;
}

.cm-post-media--feed .cm-post-media__frame img {
  pointer-events: none;
  cursor: inherit;
}

.cm-post-media--full .cm-post-media__trigger {
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
  border: none;
  background: none;
  cursor: zoom-in;
  line-height: 0;
}

.cm-post-media--full .cm-post-media__trigger img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.cm-feed-comments {
  margin: 12px 0 0;
  padding: 10px 0 0;
  border-top: 1px solid rgba(15, 23, 42, 0.08);
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.cm-feed-comments__item {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 0.88rem;
  line-height: 1.35;
  color: #334155;
}

.cm-feed-comments__item--reply {
  margin-left: 12px;
  padding-left: 10px;
  border-left: 2px solid rgba(0, 102, 204, 0.2);
}

.cm-feed-comments__avatar.cm-msg-avatar {
  width: 28px;
  height: 28px;
  font-size: 0.65rem;
  margin-top: 1px;
}

.cm-feed-comments__text {
  flex: 1;
  min-width: 0;
}

.cm-feed-comments__author {
  font-weight: 600;
  color: #0f172a;
}

.cm-feed-comments__body {
  color: #475569;
}

.cm-feed-comments__body {
  color: #475569;
}

/* Lightbox */
body.cm-media-lightbox-open {
  overflow: hidden;
}

.cm-media-lightbox[hidden] {
  display: none !important;
}

.cm-media-lightbox {
  position: fixed;
  inset: 0;
  z-index: 13000;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: stretch;
  padding: 0;
}

.cm-media-lightbox__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(10, 14, 24, 0.94);
}

.cm-media-lightbox__stage {
  position: relative;
  z-index: 1;
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  overflow: hidden;
  touch-action: pan-y;
  cursor: grab;
}
.cm-media-lightbox__stage.is-zoomed {
  cursor: grab;
  touch-action: none;
}

.cm-media-lightbox__track {
  display: flex;
  width: 300%;
  height: 100%;
  transform: translate3d(-100%, 0, 0);
  will-change: transform;
}

.cm-media-lightbox__slide {
  flex: 0 0 33.3333%;
  width: 33.3333%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 56px 12px 12px;
  box-sizing: border-box;
}

.cm-media-lightbox__img {
  display: block;
  max-width: min(96vw, 1100px);
  max-height: calc(100dvh - 168px);
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: 8px;
  /* PNG trasparenti: stesso fondo della bubble (non nero) */
  background: #fff;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35);
  user-select: none;
  -webkit-user-drag: none;
  transform-origin: center center;
  will-change: transform;
  touch-action: none;
}
.cm-media-lightbox__img.is-zoomed {
  cursor: grab;
}

.cm-media-lightbox__topbar {
  display: none;
}

.cm-media-lightbox__close {
  position: fixed;
  top: calc(10px + env(safe-area-inset-top, 0px));
  right: calc(12px + env(safe-area-inset-right, 0px));
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: none;
  background: transparent;
  color: #fff;
  cursor: pointer;
  z-index: 5;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  box-shadow: none;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.55);
}

.cm-media-lightbox__nav {
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: none;
  background: transparent;
  color: #fff;
  cursor: pointer;
  z-index: 5;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  box-shadow: none;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.55);
}

.cm-media-lightbox__nav--prev {
  left: calc(10px + env(safe-area-inset-left, 0px));
}

.cm-media-lightbox__nav--next {
  right: calc(10px + env(safe-area-inset-right, 0px));
}

.cm-media-lightbox__nav[hidden] {
  display: none !important;
}

.cm-media-lightbox__counter {
  position: relative;
  z-index: 4;
  align-self: center;
  margin: 0 0 8px;
  padding: 4px 12px;
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: 600;
  color: #f8fafc;
  background: rgba(15, 23, 42, 0.45);
}

.cm-media-lightbox__strip {
  position: relative;
  z-index: 4;
  display: flex;
  gap: 8px;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x mandatory;
  /* Padding laterale ≈ metà viewport strip − metà thumb: così prima/ultima possono stare al centro */
  padding: 8px max(14px, calc(50% - 28px)) calc(12px + env(safe-area-inset-bottom, 0px));
  scrollbar-width: thin;
}

.cm-media-lightbox__strip[hidden] {
  display: none !important;
}

.cm-media-lightbox__thumb {
  flex: 0 0 auto;
  width: 56px;
  height: 56px;
  padding: 0;
  border: 2px solid transparent;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
  cursor: pointer;
  opacity: 0.72;
  scroll-snap-align: center;
}

.cm-media-lightbox__thumb.is-active {
  border-color: #fff;
  opacity: 1;
}

.cm-media-lightbox__thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  background: #fff;
  pointer-events: none;
}

@media (max-width: 720px) {
  .cm-media-lightbox__slide {
    padding: 52px 8px 8px;
  }
  .cm-media-lightbox__img {
    max-height: calc(100dvh - 180px);
  }
  .cm-media-lightbox__nav--prev {
    left: 6px;
  }
  .cm-media-lightbox__nav--next {
    right: 6px;
  }
  .cm-media-lightbox__thumb {
    width: 52px;
    height: 52px;
  }
}

/* Mobile lightbox: barra top stile chat, niente X/frecce */
@media (max-width: 991px) {
  .cm-media-lightbox__close,
  .cm-media-lightbox__nav,
  .cm-media-lightbox__counter {
    display: none !important;
  }

  .cm-media-lightbox__topbar {
    display: flex;
    align-items: center;
    gap: 10px;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 6;
    padding: calc(8px + env(safe-area-inset-top, 0px)) 12px 10px;
    background: linear-gradient(180deg, rgba(10, 14, 24, 0.92) 0%, rgba(10, 14, 24, 0.55) 70%, rgba(10, 14, 24, 0) 100%);
    color: #fff;
  }

  .cm-media-lightbox__back,
  .cm-media-lightbox__download {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border: none;
    border-radius: 50%;
    background: transparent;
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.15rem;
    cursor: pointer;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.45);
  }

  .cm-media-lightbox__meta {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
  }

  .cm-media-lightbox__author {
    font-size: 0.95rem;
    font-weight: 700;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .cm-media-lightbox__date {
    font-size: 0.72rem;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.78);
    line-height: 1.2;
  }

  .cm-media-lightbox__slide {
    padding-top: 64px;
  }
}

/* Tag appena creati nel wizard */
.cm-topic-item--new {
  outline: 1px dashed rgba(0, 123, 255, 0.35);
  border-radius: 10px;
  padding: 4px 2px;
}

/* Index: destra = widget temi */
@media (min-width: 992px) {
  .cm-sidebar--topics .cm-sidebar--topics__head,
  .cm-sidebar--topics .cm-sidebar--topics__related {
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(0, 0, 0, 0.06);
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.05);
  }
  .cm-sidebar--topics__row {
    border-radius: 12px;
    background: rgba(0, 123, 255, 0.05);
    border: 1px solid rgba(0, 123, 255, 0.08);
    align-items: stretch;
    padding: 0;
    overflow: hidden;
  }

  .topic-row.cm-sidebar--topics__row {
    align-items: stretch;
  }
  .cm-sidebar--topics__row:hover {
    background: rgba(0, 123, 255, 0.09);
  }
  .cm-sidebar--topics__row-link {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 2px;
    padding: 6px 10px;
    text-decoration: none;
    color: inherit;
    border-radius: 12px 0 0 12px;
  }
  .cm-sidebar--topics__row-link .topic-name {
    color: #222;
  }
  .cm-sidebar--topics__row-link:hover .topic-name {
    color: #007bff;
  }
  .cm-sidebar--topics__row-link .topic-followers {
    color: #777;
  }
  .cm-sidebar--topics__row-actions {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    padding: 4px 8px 4px 2px;
    position: relative;
    z-index: 1;
  }
  .cm-sidebar--topics__rel-link {
    font-size: 0.9rem;
    text-decoration: none;
    font-weight: 600;
    color: #333;
    display: block;
    padding: 4px 0;
  }
  .cm-sidebar--topics__rel-link:hover {
    color: #007bff;
  }
  .cm-sidebar--topics__rel-type {
    font-size: 0.72rem;
    color: #999;
    font-weight: 500;
  }
  .cm-sidebar--topics__all {
    width: 100%;
  }
}

/* Discussioni collegate (fragment) */
.cm-linked-posts__title {
  margin: 0 0 10px;
  font-size: 0.95rem;
  color: #333;
}

.cm-linked-posts__list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.cm-linked-posts__item {
  display: block;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid rgba(0, 0, 0, 0.08);
  background: rgba(250, 251, 252, 0.95);
  text-decoration: none;
  color: #1a1a1a;
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}

.cm-linked-posts__item:hover {
  border-color: rgba(0, 123, 255, 0.22);
  background: #fff;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
}

.cm-linked-posts__item-title {
  display: block;
  font-weight: 600;
  font-size: 0.9rem;
  color: #222;
  line-height: 1.35;
}

.cm-linked-posts__item:hover .cm-linked-posts__item-title {
  color: #0d5cb3;
}

.cm-linked-posts__item-space {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 4px;
  font-size: 0.78rem;
  color: #666;
  font-weight: 500;
}

.cm-space-icon {
  color: #007bff;
  font-size: 0.72rem;
  opacity: 0.85;
  flex-shrink: 0;
  margin-right: 5px;
}

.cm-space-emoji.cm-space-icon,
.cm-space-emoji.cm-feed-card__meta-space-icon {
  color: inherit;
  font-size: 0.95em;
  line-height: 1;
  opacity: 1;
  font-style: normal;
  font-family: "Segoe UI Emoji", "Apple Color Emoji", "Noto Color Emoji", sans-serif;
}

.list-item-link .cm-space-icon {
  margin-right: 8px;
}

.cm-linked-posts__item-space .cm-space-icon {
  font-size: 0.68rem;
  opacity: 0.75;
  margin-right: 0;
}

/* Pagina post: contesto sopra al thread */
.cm-post-thread-context {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  margin: 0 0 14px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid rgba(0, 0, 0, 0.07);
  font-size: 0.85rem;
}

.cm-post-thread-context__space {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 700;
  color: #333;
  text-decoration: none;
}

.cm-post-thread-context__space:hover {
  color: #007bff;
}

.cm-post-thread-context__space .cm-space-icon {
  font-size: 0.72rem;
  opacity: 0.9;
  margin-right: 0;
}

.cm-post-thread-context__sep {
  color: #ccc;
  user-select: none;
}

.cm-post-thread-context__topics {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 8px;
  align-items: center;
}

.cm-post-thread-context__topic {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(0, 123, 255, 0.08);
  color: #0d5cb3;
  font-weight: 600;
  font-size: 0.8rem;
  text-decoration: none;
}

.cm-post-thread-context__topic:hover {
  background: rgba(0, 123, 255, 0.14);
  color: #0056b3;
}

/* Riga tag con “Segui”: area filtro cliccabile (index mobile + pattern condiviso) */
.cm-topic-filter-row {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: 6px;
  padding: 0;
}

.topic-row.cm-topic-filter-row {
  align-items: stretch;
}

.cm-topic-filter-row__link {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2px;
  padding: 6px 10px;
  text-decoration: none;
  color: inherit;
}

.cm-topic-filter-row__link .topic-name {
  color: #333;
}

.cm-topic-filter-row__link:hover .topic-name {
  color: #007bff;
}

.cm-topic-filter-row__actions {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  padding: 4px 8px 4px 0;
  position: relative;
  z-index: 1;
}

/* Feed index: card tipo Reddit */
.cm-feed-card {
  display: flex;
  flex-direction: column;
  padding: 0;
  overflow: visible;
}
.cm-feed-card__linkzone {
  cursor: pointer;
  padding: 14px 15px 8px;
}
.cm-feed-card__meta {
  container-type: inline-size;
  container-name: cm-feed-meta;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "author space";
  align-items: center;
  column-gap: 10px;
  row-gap: 3px;
  margin-bottom: 10px;
  font-size: 0.75rem;
  color: #787c82;
  line-height: 1.35;
}
.cm-feed-card__meta:has(.cm-feed-card__topicline) {
  grid-template-columns: minmax(0, 1fr) minmax(0, max-content) auto;
  grid-template-areas: "author topics space";
}
.cm-feed-card__meta-left {
  grid-area: author;
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  min-height: 32px;
}
.cm-feed-card__avatar-wrap {
  flex-shrink: 0;
  line-height: 0;
}
.cm-feed-card__avatar.cm-msg-avatar {
  width: 32px;
  height: 32px;
  font-size: 0.72rem;
}
.cm-feed-card__author {
  min-width: 0;
}
.cm-feed-card__author-name {
  font-weight: 700;
  color: #1a1a1b;
  text-decoration: none;
}
.cm-feed-card__author-name:hover {
  color: #007bff;
  text-decoration: underline;
}
.cm-feed-card__meta-space.cm-topic-chip {
  grid-area: space;
  justify-self: end;
  flex-shrink: 0;
  margin: 0;
  gap: 5px;
}
.cm-feed-card__meta-space-icon {
  font-size: 0.72rem;
  opacity: 0.8;
  flex-shrink: 0;
}
.cm-feed-card__meta-space.is-active .cm-feed-card__meta-space-icon {
  opacity: 0.95;
}
.cm-feed-card__meta-space-label {
  min-width: 0;
}
.cm-feed-card__topicline {
  grid-area: topics;
  justify-self: end;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 4px 6px;
  min-width: 0;
  max-width: 100%;
  line-height: 1.35;
}
.cm-feed-card__topic-chip {
  display: inline-flex;
  align-items: center;
  height: 26px;
  padding: 0 10px;
  border-radius: 13px;
  border: 1px solid rgba(15, 23, 42, 0.14);
  background: transparent;
  text-decoration: none;
  color: #555;
  font-weight: 600;
  font-size: 0.75rem;
  gap: 3px;
  transition: border-color 0.2s, color 0.2s;
}
.cm-feed-card__topic-chip:hover {
  border-color: rgba(0, 123, 255, 0.4);
  color: #007bff;
  text-decoration: none;
}
.cm-feed-card__topic-chip.is-active {
  border-color: #007bff;
  color: #007bff;
}
.cm-feed-card__topic-hash {
  color: #9ca3af;
  font-weight: 700;
  font-size: 0.72rem;
  line-height: 1;
}
.cm-feed-card__topic-chip:hover .cm-feed-card__topic-hash,
.cm-feed-card__topic-chip.is-active .cm-feed-card__topic-hash {
  color: #007bff;
}
.cm-feed-card__topic-label {
  min-width: 0;
}
/* Card stretta: topic sotto lo spazio, spazio ancora allineato al nome */
@container cm-feed-meta (max-width: 520px) {
  .cm-feed-card__meta:has(.cm-feed-card__topicline) {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "author space"
      ". topics";
    row-gap: 2px;
    margin-bottom: 8px;
  }
}
@media (max-width: 576px) {
  .cm-feed-card__meta:has(.cm-feed-card__topicline) {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "author space"
      ". topics";
    row-gap: 2px;
    margin-bottom: 8px;
  }
}
.cm-feed-card__time {
  flex-shrink: 0;
  margin-left: auto;
  color: #787c82;
  font-size: 0.72rem;
  line-height: 1.2;
  white-space: nowrap;
}
.cm-feed-card__title {
  margin: 0 0 8px;
  font-size: 1.12rem;
  line-height: 1.3;
  font-weight: 700;
}
.cm-feed-card__excerpt {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.45;
  color: #444;
  display: -webkit-box;
  line-clamp: 4;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.cm-feed-card__actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 6px 15px 12px;
  border-top: none;
  background: transparent;
  overflow: visible;
  position: relative;
  z-index: 1;
}
.cm-feed-card__actions-main {
  display: flex;
  align-items: center;
  gap: 16px;
  min-width: 0;
}
.cm-feed-card__stat {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 0.82rem;
  color: #878a8c;
  cursor: default;
}
.cm-feed-card__stat--link {
  text-decoration: none;
  color: inherit;
  cursor: pointer;
}
.cm-feed-card__stat--link:hover {
  color: #007bff;
}
.cm-post-like-btn {
  border: none;
  background: transparent;
  padding: 0;
  margin: 0;
  font-size: 0.82rem;
  font-family: inherit;
  font-weight: inherit;
  line-height: inherit;
  text-decoration: none;
}
.cm-post-like-btn:hover,
.cm-post-like-btn:focus,
.cm-post-like-btn:active {
  text-decoration: none;
}
.cm-feed-card__stat--link.cm-post-like-btn:hover:not(.is-liked) {
  color: #007bff;
}
.cm-post-like-btn.is-liked,
.cm-post-like-btn.is-liked:hover,
.cm-post-like-btn.is-liked:focus,
.cm-post-like-btn.is-liked .cm-feed-card__stat-icon,
.cm-post-like-btn.is-liked .cm-feed-card__stat-num {
  color: #e11d48;
  text-decoration: none;
}
.cm-post-like-btn .cm-feed-card__stat-icon {
  width: 1em;
  min-width: 1em;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.cm-post-like-btn .cm-feed-card__stat-icon i {
  font-size: 0.95rem;
  line-height: 1;
}
.cm-feed-card__stat-icon {
  font-size: 0.95rem;
  opacity: 0.9;
  line-height: 1;
}
.cm-feed-card__stat-num {
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.cm-feed-card__copy {
  border: none;
  background: transparent;
  font: inherit;
  cursor: pointer;
  padding: 0;
  margin: 0;
  overflow: visible;
  position: relative;
  z-index: 2;
  color: #878a8c;
}
.cm-feed-card__copy .cm-feed-card__stat-icon,
.cm-feed-card__copy .cm-feed-card__stat-icon i {
  color: inherit;
}
.cm-feed-card__copy:hover {
  color: #007bff;
}
.cm-feed-card__copy-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.cm-feed-card__copy-toast {
  position: absolute;
  left: calc(100% + 6px);
  top: 50%;
  margin: 0;
  padding: 0;
  white-space: nowrap;
  font-size: 0.72rem;
  font-weight: 600;
  color: #475569;
  letter-spacing: 0.01em;
  opacity: 0;
  pointer-events: none;
  transform: translate(0, -50%);
}
.cm-feed-card__copy-toast.is-animating {
  animation: cmFeedCopyToast 2s ease forwards;
}
@keyframes cmFeedCopyToast {
  0% { opacity: 0; }
  12% { opacity: 1; }
  70% { opacity: 1; }
  100% { opacity: 0; }
}

.cm-post-follow-btn {
  border: none;
  background: transparent;
  font: inherit;
  padding: 0;
  margin: 0;
}
.cm-post-follow-btn.is-following,
.cm-post-follow-btn.is-following .cm-feed-card__stat-icon {
  color: #007bff;
  font-weight: 600;
}
.cm-post-follow-btn:disabled {
  opacity: 0.55;
  cursor: wait;
}

.cm-post-follow-btn--icon {
  min-width: 2.1rem;
  justify-content: center;
  align-items: center;
}
.cm-feed-card__actions .cm-post-follow-btn--icon {
  padding: 0 4px;
}

/* Barre filtri orizzontali (gruppi / temi) — community index */
.cm-strip-filters {
  --cm-strip-title-width: 8.5rem;
  display: flex;
  flex-direction: column;
  gap: 0;
  margin: 0;
  border: 1px solid rgba(15, 23, 42, 0.1);
  border-radius: 14px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 2px 10px rgba(15, 23, 42, 0.04);
}

.cm-strip-bar {
  display: flex;
  align-items: stretch;
  min-height: 44px;
  border-bottom: 1px solid rgba(15, 23, 42, 0.08);
}
.cm-strip-bar:last-child {
  border-bottom: none;
}

.cm-strip-bar--groups {
  background: linear-gradient(180deg, rgba(239, 246, 255, 0.95) 0%, rgba(255, 255, 255, 0.88) 100%);
}
.cm-strip-bar--themes {
  background: linear-gradient(180deg, rgba(245, 243, 255, 0.95) 0%, rgba(255, 255, 255, 0.9) 100%);
}

.cm-strip-bar__glyph {
  flex: 0 0 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  border-right: 1px solid rgba(15, 23, 42, 0.08);
}

.cm-strip-bar__title {
  flex: 0 0 var(--cm-strip-title-width);
  width: var(--cm-strip-title-width);
  min-width: var(--cm-strip-title-width);
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  padding: 0 10px;
  margin: 0;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border: none;
  border-right: 1px solid rgba(15, 23, 42, 0.08);
  white-space: nowrap;
  user-select: none;
  box-sizing: border-box;
  font-family: inherit;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: filter 0.15s ease;
}
.cm-strip-bar__title:hover {
  filter: brightness(0.96);
}
.cm-strip-bar__title-chevron {
  display: inline-flex;
  flex-shrink: 0;
  font-size: 0.6rem;
  opacity: 0.55;
  margin-left: auto;
}
.cm-strip-bar__title span {
  flex-shrink: 0;
  overflow: visible;
}
.cm-strip-bar__title i {
  font-size: 0.95rem;
}
.cm-strip-bar__title--groups {
  color: #0066cc;
  background: rgba(0, 102, 204, 0.08);
}
.cm-strip-bar__title--themes {
  color: var(--meedico-community, #7c3aed);
  background: rgba(124, 58, 237, 0.1);
}

.cm-strip-bar__scroll {
  flex: 1;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.cm-strip-bar__scroll::-webkit-scrollbar {
  display: none;
}

.cm-strip-bar__track {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  width: max-content;
  min-height: 44px;
  box-sizing: border-box;
}

.cm-strip-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  padding: 6px 14px;
  border-radius: 999px;
  border: 1px solid rgba(15, 23, 42, 0.12);
  background: rgba(255, 255, 255, 0.85);
  color: #334155;
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
  font-family: inherit;
}
.cm-strip-pill:hover {
  text-decoration: none;
}
.cm-strip-pill--group:hover {
  border-color: rgba(0, 102, 204, 0.45);
  color: #0066cc;
  background: rgba(0, 102, 204, 0.08);
}
.cm-strip-pill--theme:hover {
  border-color: rgba(124, 58, 237, 0.45);
  color: var(--meedico-community-ink, #6d28d9);
  background: rgba(124, 58, 237, 0.08);
}
.cm-strip-pill--group.is-active {
  border-color: #0066cc;
  background: #0066cc;
  color: #fff;
  box-shadow: 0 2px 8px rgba(0, 102, 204, 0.28);
}
.cm-strip-pill--theme.is-active {
  border-color: var(--meedico-community, #7c3aed);
  background: var(--meedico-community, #7c3aed);
  color: #fff;
  box-shadow: 0 2px 8px rgba(124, 58, 237, 0.28);
}
.cm-strip-pill__hash {
  color: var(--meedico-community, #7c3aed);
  font-weight: 700;
  margin-right: 2px;
}

.cm-strip-pill--theme.is-active .cm-strip-pill__hash {
  color: #fff;
}

.cm-topic-hash-icon {
  display: inline-block;
  font-weight: 800;
  font-style: normal;
  line-height: 1;
}

.cm-h2 .cm-topic-hash-icon,
.section-title .cm-topic-hash-icon {
  color: var(--meedico-community, #7c3aed);
  margin-right: 6px;
}

.cm-badge .cm-topic-hash-icon {
  color: var(--meedico-community, #7c3aed);
  margin-right: 4px;
}

.cm-strip-bar__title--themes .cm-topic-hash-icon {
  font-size: 0.95rem;
}

.cm-strip-pill--more {
  min-width: 40px;
  padding-left: 12px;
  padding-right: 12px;
  justify-content: center;
  color: #64748b;
}

.cm-strip-pill--more i {
  font-size: 0.72rem;
  line-height: 1;
}

.cm-strip-pill__label {
  white-space: nowrap;
}

@media (min-width: 992px) {
  .cm-has-strip-filters .cm-sidebar-orient-legacy,
  .cm-has-strip-filters .cm-sidebar-groups-legacy,
  .cm-has-strip-filters .cm-sidebar-topics-legacy,
  .cm-has-strip-filters .cm-sidebar--topics__related {
    display: none !important;
  }
  .cm-has-strip-filters .col-right {
    display: none !important;
  }
  .cm-has-strip-filters:not(.cm-has-feed-sidebar) .col-left {
    display: none !important;
  }
  .cm-community-index.cm-has-strip-filters:not(.cm-has-feed-sidebar) .page-layout-container > .col-center {
    flex: 0 0 calc(60% - 40px) !important;
    max-width: calc(60% - 40px) !important;
    margin-left: 20%;
  }

  .cm-community-index.cm-has-feed-sidebar .page-layout-container {
    align-items: stretch;
    gap: 16px;
  }

  .cm-community-index.cm-has-feed-sidebar .page-layout-container > .col-left.cm-post-sidebar {
    flex: 0 0 300px;
    max-width: 300px;
    width: 300px;
    min-width: 300px;
    align-self: stretch;
    padding: 0;
    border: none;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    overflow: visible;
    max-height: calc(100vh - 96px);
    top: 80px;
    position: sticky;
  }

  .cm-community-index.cm-has-feed-sidebar .page-layout-container > .col-center {
    flex: 1 1 auto;
    min-width: 0;
    max-width: none;
    margin-left: 0;
  }

  .cm-community-index.cm-has-feed-sidebar .cm-strip-filters,
  .cm-community-index.cm-has-feed-sidebar .cm-feed-toolbar,
  .cm-community-index.cm-has-feed-sidebar .cm-feed-compose-row {
    display: none !important;
  }

  body.cm-community-index.cm-has-feed-sidebar .container {
    margin-top: 8px;
  }
}

@media (max-width: 991px) {
  .js-mobile-filter-panel:active {
    filter: brightness(0.92);
  }
}

.cm-has-strip-filters .cm-active-filters-card {
  display: none !important;
}

/* Avviso disponibilità/offerta nel wizard nuovo post */
#newPostModal .np-work-avail-hint {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  margin: 0 0 14px;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid #e8c468;
  background: #fff8e1;
  box-shadow: 0 4px 16px rgba(180, 130, 0, 0.12);
  color: #4a3b10;
}
#newPostModal .np-work-avail-hint[hidden] {
  display: none !important;
}
#newPostModal .np-work-avail-hint__icon {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #ffe082;
  color: #9a7209;
  font-size: 1rem;
}
#newPostModal .np-work-avail-hint__body {
  flex: 1;
  min-width: 0;
}
#newPostModal .np-work-avail-hint__title {
  margin: 0 0 6px;
  font-weight: 700;
  font-size: 0.95rem;
  line-height: 1.35;
}
#newPostModal .np-work-avail-hint__text {
  margin: 0 0 8px;
  font-size: 0.88rem;
  line-height: 1.5;
}
#newPostModal .np-work-avail-hint__text:last-child {
  margin-bottom: 0;
}
#newPostModal .np-work-avail-hint__text--soft {
  color: #6b5a28;
  font-size: 0.84rem;
}
#newPostModal .np-work-avail-hint__body a {
  color: #8a5f00;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 2px;
}
#newPostModal .np-work-avail-hint__body a:hover {
  color: #5c4600;
}
#newPostModal .np-work-avail-hint__dismiss {
  flex-shrink: 0;
  border: none;
  background: transparent;
  color: #6c757d;
  cursor: pointer;
  padding: 4px;
  border-radius: 8px;
  line-height: 1;
}
#newPostModal .np-work-avail-hint__dismiss:hover {
  background: rgba(0, 0, 0, 0.06);
  color: #333;
}

/* =========================================================
   Post page — chat (Telegram-like)
   ========================================================= */
.cm-post-nav-fab {
  display: none;
}

.cm-post-mobile-bar {
  display: none;
}

.cm-post-page .cm-post-mobile-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  padding: 0;
}

.cm-post-page .cm-post-mobile-bar__back,
.cm-post-page .cm-post-mobile-bar__action {
  flex-shrink: 0;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: none;
  background: rgba(0, 0, 0, 0.04);
  color: #007bff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  cursor: pointer;
}
/* Toast fallback copia: sotto il bottone, non sulle pills */
.cm-post-page .cm-post-mobile-bar__action.cm-feed-card__copy .cm-feed-card__copy-toast {
  left: auto;
  right: 0;
  top: calc(100% + 8px);
  transform: none;
  z-index: 6;
  padding: 5px 8px;
  border-radius: 8px;
  background: rgba(15, 23, 42, 0.9);
  color: #f8fafc;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.18);
}
.cm-post-page .cm-post-share-btn .cm-feed-card__copy-toast {
  left: auto;
  right: calc(100% + 6px);
  color: #475569;
  background: transparent;
  padding: 0;
  box-shadow: none;
}

.cm-post-page .cm-post-mobile-bar__scroll {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding: 2px 0;
}

.cm-post-page .cm-post-mobile-bar__scroll::-webkit-scrollbar {
  display: none;
}

.cm-post-page .cm-post-mobile-bar__chip {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 11px;
  border-radius: 999px;
  background: rgba(0, 123, 255, 0.08);
  color: #0d5cb3;
  font-size: 0.78rem;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}

.cm-post-page .cm-post-mobile-bar__chip--space {
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(0, 0, 0, 0.08);
  color: #333;
}

.cm-post-page .cm-post-mobile-bar__chip--space .cm-space-icon {
  font-size: 0.68rem;
  opacity: 0.9;
  margin-right: 0;
}

.cm-post-page .cm-post-feed-top,
.cm-post-page .cm-post-thread-context {
  display: none !important;
}

/* Post desktop: sidebar sinistra tipo chat list, solo col-center a destra */
@media (min-width: 992px) {
  .cm-post-page .col-right {
    display: none !important;
  }

  .cm-post-page .page-layout-container > .col-left.cm-post-sidebar {
    flex: 0 0 300px;
    max-width: 300px;
    width: 300px;
    min-width: 300px;
    align-self: stretch;
    padding: 0;
    border: none;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    overflow: visible;
    max-height: calc(100vh - 96px);
    top: 80px;
  }

  .cm-post-page .col-center {
    flex: 1 1 auto;
    min-width: 0;
    max-width: none;
  }

  .cm-post-page .cm-post-mobile-bar {
    display: none !important;
  }

  .cm-post-sidebar__shell {
    display: flex;
    flex-direction: column;
    gap: 8px;
    height: 100%;
    min-height: 0;
  }

  .cm-post-sidebar__head {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 10px 10px 8px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 12px;
    background: rgba(248, 250, 252, 0.98);
    box-shadow: 0 2px 14px rgba(15, 23, 42, 0.06);
  }

  .cm-post-sidebar__head-row {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    gap: 8px;
    margin-bottom: 4px;
  }

  .cm-post-sidebar__head-current {
    flex: 1;
    min-width: 0;
  }

  .cm-post-sidebar__head-current .cm-post-sidebar__chats {
    margin: 0;
    padding: 0;
  }

  .cm-post-sidebar__head-current .cm-post-sidebar__chat-link {
    min-height: 34px;
    padding: 4px 8px;
    border-radius: 10px;
    background: rgba(15, 23, 42, 0.04);
  }

  .cm-post-sidebar__chat-link--current {
    display: flex;
    align-items: flex-start;
    gap: 8px;
  }

  .cm-post-sidebar__chat-aside {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 4px;
    padding-top: 1px;
  }

  .cm-post-sidebar__share {
    width: 28px;
    height: 28px;
    border: none;
    border-radius: 8px;
    background: transparent;
    color: #64748b;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0;
    font-size: 0.9rem;
  }

  .cm-post-sidebar__share:hover {
    color: #007bff;
    background: rgba(0, 123, 255, 0.08);
  }

  .cm-post-sidebar__share .cm-feed-card__copy-toast {
    left: auto;
    right: 0;
    top: calc(100% + 4px);
    transform: none;
    color: #475569;
  }

  .cm-post-sidebar__chat-aside .cm-post-sidebar__chat-time {
    margin-left: 0;
  }

  .cm-post-sidebar__head-current .cm-post-sidebar__chat.is-active .cm-post-sidebar__chat-link {
    cursor: default;
  }

  .cm-post-sidebar__head-current .cm-post-sidebar__chat.is-active .cm-post-sidebar__chat-link:hover {
    background: rgba(15, 23, 42, 0.04);
  }

  .cm-post-sidebar__head .cm-post-sidebar__section {
    padding-left: 0;
    padding-right: 0;
  }

  .cm-post-sidebar__head .cm-post-sidebar__section + .cm-post-sidebar__section {
    border-top: none;
    padding-top: 0;
    margin-top: 0;
  }

  .cm-post-sidebar__back {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 34px;
    height: 34px;
    padding: 0;
    border-radius: 10px;
    font-size: 0.84rem;
    font-weight: 600;
    color: #007bff;
    text-decoration: none;
  }

  .cm-post-sidebar__back:hover {
    color: #0056b3;
    background: rgba(0, 123, 255, 0.08);
  }

  .cm-post-sidebar__back i {
    font-size: 0.9rem;
  }

  .cm-post-sidebar__head .cm-post-sidebar__search-wrap,
  .cm-post-sidebar__section--search .cm-post-sidebar__search-wrap {
    flex: 1;
    min-width: 0;
  }

  .cm-post-sidebar__section--search {
    border-top: none !important;
    margin-top: 0 !important;
  }

  .cm-post-sidebar__search {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 34px;
    padding: 0 10px;
    border-radius: 10px;
    background: rgba(15, 23, 42, 0.05);
    border: 1px solid rgba(15, 23, 42, 0.06);
  }

  .cm-post-sidebar__search i {
    color: #94a3b8;
    font-size: 0.78rem;
    flex-shrink: 0;
  }

  .cm-post-sidebar__search input {
    flex: 1;
    min-width: 0;
    border: none;
    background: transparent;
    font: inherit;
    font-size: 0.84rem;
    color: #1e293b;
    outline: none;
  }

  .cm-post-sidebar__search input::placeholder {
    color: #94a3b8;
  }

  .cm-post-sidebar__search-wrap {
    position: relative;
  }

  .cm-post-sidebar__search-dropdown {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    z-index: 120;
    max-height: min(320px, 50vh);
    overflow-y: auto;
  }

  .cm-post-sidebar__search-dropdown .search-dropdown-item.cm-post-sidebar__search-hit {
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
  }

  .cm-post-sidebar__search-hit-title {
    font-weight: 600;
    font-size: 0.86rem;
    line-height: 1.3;
  }

  .cm-post-sidebar__search-hit-meta {
    font-size: 0.72rem;
    color: #888;
  }

  .cm-post-sidebar__search-all {
    justify-content: center;
    color: #007bff;
    font-weight: 600;
    border-top: 1px solid #eee;
  }

  .cm-post-sidebar__scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 0 0 10px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.97);
    box-shadow: 0 2px 14px rgba(15, 23, 42, 0.06);
  }

  .cm-post-sidebar__scroll::-webkit-scrollbar {
    width: 4px;
  }

  .cm-post-sidebar__scroll::-webkit-scrollbar-thumb {
    background: rgba(15, 23, 42, 0.14);
    border-radius: 4px;
  }

  .cm-post-sidebar__section {
    padding: 0 6px;
    margin-bottom: 0;
  }

  .cm-post-sidebar__section + .cm-post-sidebar__section,
  .cm-post-sidebar__section + .cm-post-sidebar__fold,
  .cm-post-sidebar__fold + .cm-post-sidebar__section,
  .cm-post-sidebar__fold + .cm-post-sidebar__fold {
    border-top: 1px solid rgba(15, 23, 42, 0.06);
    margin-top: 0;
    padding-top: 2px;
  }

  .cm-post-sidebar__section--group + .cm-post-sidebar__section--topics {
    border-top: none;
    padding-top: 0;
  }

  .cm-post-sidebar__section--search + .cm-post-sidebar__section {
    border-top: none;
    padding-top: 0;
  }

  .cm-post-sidebar__scroll > .cm-post-sidebar__section--search {
    padding: 10px 10px 10px;
  }

  .cm-post-sidebar__section--sort {
    padding: 0 10px 8px;
    border-top: none !important;
  }

  .cm-post-sidebar__sort-tabs {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
  }

  .cm-post-sidebar__sort-tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    padding: 0 12px;
    border-radius: 999px;
    border: 1px solid rgba(15, 23, 42, 0.1);
    background: rgba(15, 23, 42, 0.03);
    color: #475569;
    font-size: 0.78rem;
    font-weight: 600;
    text-decoration: none;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
  }

  .cm-post-sidebar__sort-tab:hover {
    background: rgba(0, 123, 255, 0.08);
    border-color: rgba(0, 123, 255, 0.18);
    color: #007bff;
  }

  .cm-post-sidebar__sort-tab.is-active {
    background: #007bff;
    border-color: #007bff;
    color: #fff;
  }

  .cm-post-sidebar__chat-link--static {
    cursor: default;
  }

  .cm-post-sidebar__chat-link--static:hover {
    background: rgba(15, 23, 42, 0.04);
  }

  .cm-post-sidebar__subsection-title {
    margin: 6px 0 2px;
    padding: 0 8px;
    font-size: 0.72rem;
    font-weight: 600;
    color: #64748b;
    text-transform: none;
    letter-spacing: normal;
    text-align: left;
    width: 100%;
    box-sizing: border-box;
  }

  .cm-post-sidebar__section--discussions .cm-post-sidebar__chats + .cm-post-sidebar__subsection-title {
    border-top: 1px solid rgba(15, 23, 42, 0.06);
    margin-top: 8px;
    padding-top: 10px;
  }

  .cm-post-sidebar__inline-row {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 2px 6px 4px;
    min-width: 0;
  }

  .cm-post-sidebar__inline-row--topics {
    align-items: center;
    flex-wrap: wrap;
    gap: 4px 6px;
  }

  .cm-post-sidebar__inline-main {
    flex: 1;
    min-width: 0;
  }

  .cm-post-sidebar__inline-row .cm-post-sidebar__more-btn {
    flex-shrink: 0;
    align-self: center;
  }

  .cm-post-sidebar__inline-row--topics .cm-post-sidebar__pills {
    flex: 1;
    min-width: 0;
  }

  .cm-post-sidebar__inline-main .cm-space-icon {
    color: #007bff;
    opacity: 1;
  }

  .cm-post-sidebar__more-btn {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-width: 34px;
    height: 28px;
    padding: 0 9px;
    margin: 0;
    border: 1px solid rgba(15, 23, 42, 0.12);
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.04);
    color: #64748b;
    cursor: pointer;
    font-family: inherit;
    line-height: 1;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
  }

  .cm-post-sidebar__more-btn:hover {
    background: rgba(15, 23, 42, 0.08);
    border-color: rgba(15, 23, 42, 0.18);
    color: #475569;
  }

  .cm-post-sidebar__more-btn[aria-expanded="true"] {
    background: rgba(15, 23, 42, 0.1);
    border-color: rgba(15, 23, 42, 0.2);
    color: #334155;
  }

  .cm-post-sidebar__head .cm-post-sidebar__section--group + .cm-post-sidebar__section--compose,
  .cm-post-sidebar__head .cm-post-sidebar__section--topics + .cm-post-sidebar__section--compose {
    border-top: 1px solid rgba(15, 23, 42, 0.06);
    margin-top: 6px;
    padding: 8px 2px 2px;
  }

  .cm-post-sidebar__compose-field {
    min-height: 38px;
    padding: 0 6px 0 12px;
    border-radius: 16px;
    cursor: pointer;
  }

  .cm-post-sidebar__compose-field .cm-feed-compose-field__placeholder {
    font-size: 0.82rem;
  }

  .cm-post-sidebar__compose-plus {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    border-radius: 999px;
    background: #007bff;
    color: #fff;
    font-size: 0.72rem;
    line-height: 1;
    box-shadow: 0 2px 6px rgba(0, 123, 255, 0.28);
    transition: background 0.15s ease, transform 0.15s ease;
  }

  .cm-post-sidebar__compose-field:hover .cm-post-sidebar__compose-plus,
  .cm-post-sidebar__compose-field:focus .cm-post-sidebar__compose-plus {
    background: #0056b3;
  }

  .cm-post-sidebar__pick-btn {
    flex: 1;
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 34px;
    padding: 6px 10px;
    margin: 0;
    border: 1px solid rgba(15, 23, 42, 0.1);
    border-radius: 10px;
    background: rgba(15, 23, 42, 0.03);
    color: #64748b;
    font: inherit;
    font-size: 0.84rem;
    font-weight: 500;
    line-height: 1.25;
    text-align: left;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
  }

  .cm-post-sidebar__pick-btn:hover {
    background: rgba(0, 123, 255, 0.06);
    border-color: rgba(0, 123, 255, 0.16);
    color: #007bff;
  }

  .cm-post-sidebar__pick-btn.is-selected {
    color: #1e293b;
    font-weight: 600;
    background: rgba(15, 23, 42, 0.04);
  }

  .cm-post-sidebar__pick-btn.is-selected .cm-space-icon {
    color: #007bff;
  }

  .cm-post-sidebar__pick-btn-label {
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .cm-post-sidebar__pick-btn-caret {
    flex-shrink: 0;
    font-size: 0.58rem;
    line-height: 1;
    opacity: 0.85;
    transition: transform 0.2s ease;
  }

  .cm-post-sidebar__pick-btn[aria-expanded="true"] .cm-post-sidebar__pick-btn-caret {
    transform: rotate(180deg);
  }

  .cm-post-sidebar__pick-btn-hash {
    color: var(--meedico-community, #7c3aed);
    font-weight: 800;
    line-height: 1;
  }

  .cm-post-sidebar__pick-btn--topics {
    width: 100%;
  }

  .cm-post-sidebar .list-item-link.is-active {
    background: rgba(0, 123, 255, 0.1);
    color: #007bff;
  }

  .cm-post-sidebar__more-btn-main {
    font-size: 0.82rem;
    line-height: 1;
  }

  .cm-post-sidebar__more-btn-hash {
    font-size: 0.9rem;
    font-weight: 700;
    line-height: 1;
  }

  .cm-post-sidebar__more-btn-caret {
    font-size: 0.58rem;
    line-height: 1;
    opacity: 0.85;
    transition: transform 0.2s ease;
  }

  .cm-post-sidebar__more-btn[aria-expanded="true"] .cm-post-sidebar__more-btn-caret {
    transform: rotate(180deg);
  }

  .cm-post-sidebar__section-action {
    flex-shrink: 0;
    margin: 0;
    padding: 0 2px;
    border: none;
    background: none;
    font: inherit;
    font-size: 0.72rem;
    font-weight: 600;
    color: #007bff;
    cursor: pointer;
    text-decoration: none;
    white-space: nowrap;
  }

  .cm-post-sidebar__section-action:hover {
    color: #0056b3;
    text-decoration: underline;
  }

  .cm-post-sidebar__section-action[aria-expanded="true"] {
    color: #475569;
  }

  .cm-post-sidebar__expand-panel {
    padding-bottom: 2px;
  }

  .cm-post-sidebar__nav-block {
    padding: 0 6px 4px;
  }

  .cm-post-sidebar .list-item-link {
    margin-bottom: 2px;
    font-size: 0.86rem;
    border: 1px solid transparent;
    box-sizing: border-box;
    transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
  }

  .cm-post-sidebar .list-item-link .cm-post-sidebar__nav-label {
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .cm-post-sidebar__pills {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    padding: 0;
  }

  .cm-post-sidebar__pills .cm-strip-pill {
    font-size: 0.78rem;
    padding: 5px 11px;
  }

  .cm-post-sidebar__pills .cm-strip-pill--theme,
  .cm-post-sidebar__pills .cm-strip-pill--theme.is-active {
    border-color: rgba(15, 23, 42, 0.12);
    background: rgba(15, 23, 42, 0.06);
    color: #475569;
    box-shadow: none;
    font-weight: 600;
  }

  .cm-post-sidebar__pills .cm-strip-pill--theme:hover {
    border-color: rgba(15, 23, 42, 0.18);
    background: rgba(15, 23, 42, 0.1);
    color: #334155;
  }

  .cm-post-sidebar__pills .cm-strip-pill--theme .cm-strip-pill__hash {
    color: var(--meedico-community, #7c3aed);
    font-weight: 700;
    margin-right: 3px;
  }

  .cm-post-sidebar__pills .cm-strip-pill--theme.is-active .cm-strip-pill__hash {
    color: var(--meedico-community, #7c3aed);
  }

  .cm-post-sidebar__panel {
    padding: 0 2px 4px;
  }

  .cm-post-sidebar__subhead {
    margin: 0 0 2px;
    padding: 2px 8px 4px;
    font-size: 0.78rem;
    font-weight: 600;
  }

  .cm-post-sidebar__subhead-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #334155;
    text-decoration: none;
  }

  .cm-post-sidebar__subhead-link:hover {
    color: #007bff;
  }

  .cm-post-sidebar__fold {
    padding: 0 2px 4px;
  }

  .cm-post-sidebar__fold-summary {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
    min-height: 34px;
    padding: 6px 8px;
    border-radius: 8px;
    font-size: 0.8rem;
    font-weight: 600;
    color: #475569;
    cursor: pointer;
    list-style: none;
    user-select: none;
  }

  .cm-post-sidebar__fold-summary::-webkit-details-marker {
    display: none;
  }

  .cm-post-sidebar__fold-summary::before {
    content: '';
    width: 0;
    height: 0;
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
    border-left: 5px solid #94a3b8;
    transition: transform 0.15s ease;
    flex-shrink: 0;
  }

  .cm-post-sidebar__fold[open] > .cm-post-sidebar__fold-summary::before {
    transform: rotate(90deg);
  }

  .cm-post-sidebar__fold-summary:hover {
    background: rgba(15, 23, 42, 0.04);
    color: #1e293b;
  }

  .cm-post-sidebar__section--discussions .cm-post-sidebar__chats {
    padding: 0 2px;
  }

  .cm-post-sidebar__chats,
  .cm-post-sidebar__nav {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .cm-post-sidebar__chat-link,
  .cm-post-sidebar__nav-link {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
    min-height: 52px;
    padding: 8px 10px;
    border-radius: 10px;
    border: 1px solid transparent;
    box-sizing: border-box;
    text-decoration: none;
    color: #1e293b;
    transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
  }

  .cm-post-sidebar__chat-link:hover,
  .cm-post-sidebar__nav-link:hover {
    background: rgba(0, 123, 255, 0.07);
  }

  .cm-post-sidebar__chat-body {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
  }

  .cm-post-sidebar__chat-subline {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    min-width: 0;
  }

  .cm-post-sidebar__chat-subline .cm-post-sidebar__chat-preview {
    flex: 1;
    min-width: 0;
  }

  .cm-post-sidebar__chat-subline .cm-post-sidebar__chat-time {
    flex-shrink: 0;
    margin-left: auto;
  }

  .cm-post-sidebar__chat-title {
    font-size: 0.84rem;
    font-weight: 600;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .cm-post-sidebar__chat-preview {
    font-size: 0.76rem;
    font-weight: 400;
    line-height: 1.25;
    color: #64748b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .cm-post-sidebar__chat.is-active .cm-post-sidebar__chat-preview {
    color: #475569;
  }

  .cm-post-sidebar__chat-time {
    flex-shrink: 0;
    font-size: 0.7rem;
    font-weight: 500;
    color: #94a3b8;
    line-height: 1.25;
    white-space: nowrap;
  }

  .cm-post-sidebar__chat.is-active .cm-post-sidebar__chat-time {
    color: #64748b;
  }

  .cm-post-sidebar__nav-label {
    flex: 1;
    min-width: 0;
    font-size: 0.84rem;
    font-weight: 500;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .cm-post-sidebar__nav-meta {
    flex-shrink: 0;
    font-size: 0.72rem;
    font-weight: 500;
    color: #94a3b8;
    white-space: nowrap;
  }

  .cm-post-sidebar__nav-link {
    min-height: 36px;
    padding: 6px 10px;
    font-size: 0.84rem;
    justify-content: flex-start;
    align-items: center;
  }

  .cm-post-sidebar__nav-link .cm-space-icon {
    flex-shrink: 0;
    width: 16px;
    font-size: 0.72rem;
    color: #94a3b8;
    margin-right: 2px;
  }

  .cm-post-sidebar__nav--compact .cm-post-sidebar__nav-link {
    min-height: 32px;
    padding: 5px 10px;
  }

  .cm-post-sidebar__nav--compact .cm-post-sidebar__nav-label {
    font-size: 0.82rem;
  }
}

@media (max-width: 991px) {
  .cm-post-page .cm-post-sidebar {
    display: none !important;
  }

  body.cm-post-page {
    --cm-post-nav-gap: 8px;
    --cm-safe-area-bottom: env(safe-area-inset-bottom, 0px);
    --cm-post-input-bottom: calc(var(--meedico-nav-stack, 83px) + var(--cm-safe-area-bottom));
  }

  body.cm-post-page.cm-post-keyboard-open {
    --cm-post-input-bottom: calc(var(--meedico-nav-stack, 83px) + var(--cm-safe-area-bottom));
  }

  body.cm-post-page.cm-post-composing {
    --cm-post-input-bottom: calc(var(--meedico-nav-stack, 83px) + var(--cm-safe-area-bottom));
  }

  body.cm-post-page.cm-post-keyboard-open .cm-post-chat-stage .cm-chat-input-sticky,
  body.cm-post-page.cm-post-composing .cm-post-chat-stage .cm-chat-input-sticky {
    position: fixed;
    left: 18px;
    right: 18px;
    bottom: var(--cm-post-input-bottom, calc(var(--meedico-nav-stack, 83px) + env(safe-area-inset-bottom, 0px))) !important;
    width: auto;
    margin: 0;
    padding: 0;
    z-index: 10150; /* sopra la navbar: sempre raggiungibile */
    transition: none;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    animation: none !important;
  }

  body.cm-post-page .cm-post-shell {
    min-height: auto;
    padding-top: 8px !important;
  }

  body.cm-post-page .cm-post-main-column {
    padding: 0 10px !important;
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
  }

  .cm-post-page .cm-post-mobile-bar {
    margin: 0 0 8px;
  }

  .cm-post-page .cm-post-chat-stage {
    display: flex;
    flex-direction: column;
    position: relative;
    min-height: calc(100dvh - var(--cm-post-stage-offset, 168px) + var(--cm-post-stage-extra, 96px));
  }

  .cm-post-page .cm-post-chat-stage .cm-chat-container {
    flex: 1 1 auto;
  }

  .cm-post-page .cm-chat-container.cm-chat-pad-smooth {
    transition: padding-bottom 0.48s cubic-bezier(0.33, 1, 0.68, 1);
  }

  .cm-post-page .cm-post-chat-stage .cm-chat-input-sticky {
    position: fixed;
    left: 18px;
    right: 18px;
    bottom: var(--cm-post-input-bottom, calc(var(--meedico-nav-stack, 83px) + env(safe-area-inset-bottom, 0px)));
    margin: 0;
    flex-shrink: 0;
    width: auto;
    padding: 0;
    border: none;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    z-index: 120;
    transition: none;
  }

  body.cm-post-page.cm-post-keyboard-open .cm-chat-input-spacer {
    display: block;
    flex-shrink: 0;
  }

  .cm-chat-input-spacer {
    display: none;
    height: 0;
  }

  .cm-post-page .cm-chat-input-textarea {
    max-height: 120px;
    font-size: 0.95rem;
  }

  .cm-post-page .cm-replying-to {
    margin-bottom: 4px;
    padding: 4px 8px;
    font-size: 0.78rem;
  }

  /* Discussioni collegate / FAB bussola: rimossi su mobile post */
  .cm-post-page .cm-linked-posts-divider,
  .cm-post-page .cm-linked-posts--mobile,
  .cm-post-scroll-end-spacer,
  .cm-post-nav-fab {
    display: none !important;
  }
}

/* ===== Composer discussioni (la pill stessa che si allunga) ===== */
.np-composer {
  position: relative;
  z-index: 240;
}
.np-composer--with-bar .np-composer__dock {
  position: fixed;
  left: 12px;
  right: 12px;
  bottom: calc(12px + env(safe-area-inset-bottom, 0px));
  max-width: 720px;
  margin: 0 auto;
  z-index: 241;
  display: block;
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 0;
  overflow: visible;
}
/*
 * Shell = la barra di testo. Chiusa: pill. Aperta: stessa pill più alta.
 * Non è una card/modale attorno alla barra.
 */
.np-composer--with-bar .np-composer__shell {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  width: 100%;
  max-height: none;
  box-sizing: border-box;
  background: #fff;
  border: 1px solid rgba(0, 102, 204, 0.18);
  /* Chiusa: 50% → capsula piena. Aperta: max 30px → curve non crescono. */
  --np-pill-radius: min(30px, 50%);
  border-radius: var(--np-pill-radius);
  padding: 5px 6px 5px 4px;
  min-height: 46px;
  overflow: visible;
  box-shadow:
    0 0 0 3px rgba(0, 123, 255, 0.07),
    0 0 22px rgba(0, 123, 255, 0.13),
    0 5px 16px rgba(15, 23, 42, 0.09);
  transform-origin: center bottom;
  transition:
    box-shadow 0.28s ease,
    padding 0.22s ease;
}
.np-composer--with-bar.is-open .np-composer__shell {
  border-radius: var(--np-pill-radius); /* identico: non aumenta all’estensione */
  padding: 8px 10px 8px;
  /* visible: il picker emoji deve fuoriuscire sopra la barra (clip solo su grow/sheet) */
  overflow: visible;
  max-height: var(--np-sheet-max-h, min(78vh, 640px));
  box-shadow:
    0 0 0 3px rgba(0, 123, 255, 0.08),
    0 0 28px rgba(0, 123, 255, 0.16),
    0 10px 28px rgba(15, 23, 42, 0.12);
}
@media (min-width: 992px) {
  .np-composer--with-bar .np-composer__dock {
    left: 16px;
    right: 16px;
    transform: none;
    width: auto;
    max-width: none;
    bottom: 20px;
    box-sizing: border-box;
  }
  .np-composer--with-bar .np-composer__shell {
    padding: 6px 8px 6px 8px;
    min-height: 50px;
  }
  .np-composer--with-bar.is-open .np-composer__shell {
    padding: 10px 12px 10px;
  }
}
@media (max-width: 991px) {
  .np-composer--with-bar .np-composer__dock {
    bottom: calc(var(--meedico-nav-stack, 83px) + env(safe-area-inset-bottom, 0px));
    left: 18px;
    right: 18px;
  }
  body.cm-nav-hidden .np-composer--with-bar .np-composer__dock {
    bottom: calc(12px + env(safe-area-inset-bottom, 0px));
  }
  .np-composer--with-bar .np-composer__shell {
    min-height: 48px;
    padding: 5px 4px 5px 2px;
  }
  .np-composer--with-bar.is-open .np-composer__shell {
    padding: 8px 8px 8px;
  }
}

.np-composer__scrim {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.35);
  z-index: 240;
}
.np-composer__scrim[hidden] { display: none !important; }

.np-composer__bar-row {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
}
.np-composer__bar-row[hidden] { display: none !important; }

/* Scroll-hide / shake: sulla shell (= la barra), non su un pezzo interno */
.np-composer__shell.is-shake,
.np-composer__bar-row.is-shake {
  animation: np-bar-shake 0.42s ease;
}
@keyframes np-bar-shake {
  0%, 100% { transform: translateX(0); }
  20% { transform: translateX(-5px); }
  40% { transform: translateX(5px); }
  60% { transform: translateX(-3px); }
  80% { transform: translateX(3px); }
}

.np-composer__shell.is-scroll-hiding,
.np-composer__bar-row.is-scroll-hiding {
  animation: np-bar-scroll-away 1.25s cubic-bezier(0.33, 1.15, 0.48, 1) forwards;
  pointer-events: none;
}
.np-composer__shell.is-scroll-hidden,
.np-composer__bar-row.is-scroll-hidden {
  transform: translateY(calc(100% + 120px)) scale(1, 0.96);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.np-composer__shell.is-scroll-showing,
.np-composer__bar-row.is-scroll-showing {
  visibility: visible;
  pointer-events: auto;
  animation: np-bar-scroll-in 0.78s cubic-bezier(0.33, 1.2, 0.48, 1) forwards;
}

/* Stesso effetto sulla barra commenti (pagina post, mobile) */
@media (max-width: 991px) {
  .cm-post-page .cm-chat-input-sticky.is-scroll-hiding {
    animation: np-bar-scroll-away 1.25s cubic-bezier(0.33, 1.15, 0.48, 1) forwards;
    pointer-events: none;
  }
  .cm-post-page .cm-chat-input-sticky.is-scroll-hidden {
    transform: translateY(calc(100% + 120px)) scale(1, 0.96);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }
  .cm-post-page .cm-chat-input-sticky.is-scroll-showing {
    visibility: visible;
    pointer-events: auto;
    animation: np-bar-scroll-in 0.78s cubic-bezier(0.33, 1.2, 0.48, 1) forwards;
  }
  body.cm-post-page.cm-post-keyboard-open .cm-chat-input-sticky.is-scroll-hiding,
  body.cm-post-page.cm-post-keyboard-open .cm-chat-input-sticky.is-scroll-hidden,
  body.cm-post-page.cm-post-keyboard-open .cm-chat-input-sticky.is-scroll-showing {
    animation: none !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }
}
@keyframes np-bar-scroll-away {
  0% {
    transform: translateY(0) scale(1, 1);
    opacity: 1;
    visibility: visible;
  }
  10% {
    transform: translateY(3px) scale(1.01, 0.96);
    opacity: 1;
    visibility: visible;
  }
  /* Sale e si ingrandisce (quasi solo verticale) */
  28% {
    transform: translateY(-16px) scale(1.02, 1.08);
    opacity: 1;
    visibility: visible;
  }
  /* Leggera resa elastica, senza rimbalzi ripetuti */
  40% {
    transform: translateY(-13px) scale(1.015, 1.05);
    opacity: 1;
    visibility: visible;
  }
  52% {
    transform: translateY(-15px) scale(1.02, 1.07);
    opacity: 1;
    visibility: visible;
  }
  100% {
    transform: translateY(calc(100% + 120px)) scale(1, 0.96);
    opacity: 0;
    visibility: hidden;
  }
}
@keyframes np-bar-scroll-in {
  0% {
    transform: translateY(calc(100% + 100px)) scale(1, 0.96);
    opacity: 0;
    visibility: visible;
  }
  55% {
    transform: translateY(-12px) scale(1.02, 1.07);
    opacity: 1;
  }
  75% {
    transform: translateY(2px) scale(1.01, 0.98);
    opacity: 1;
  }
  100% {
    transform: translateY(0) scale(1, 1);
    opacity: 1;
  }
}
@media (min-width: 992px) {
  @keyframes np-bar-scroll-away {
    0% {
      transform: translateY(0) scale(1, 1);
      opacity: 1;
      visibility: visible;
    }
    10% {
      transform: translateY(2px) scale(1.008, 0.97);
      opacity: 1;
      visibility: visible;
    }
    28% {
      transform: translateY(-12px) scale(1.015, 1.06);
      opacity: 1;
      visibility: visible;
    }
    40% {
      transform: translateY(-9px) scale(1.01, 1.035);
      opacity: 1;
      visibility: visible;
    }
    52% {
      transform: translateY(-11px) scale(1.015, 1.05);
      opacity: 1;
      visibility: visible;
    }
    100% {
      transform: translateY(calc(100% + 56px)) scale(1, 0.97);
      opacity: 0;
      visibility: hidden;
    }
  }
  @keyframes np-bar-scroll-in {
    0% {
      transform: translateY(56px) scale(1, 0.97);
      opacity: 0;
      visibility: visible;
    }
    55% {
      transform: translateY(-9px) scale(1.015, 1.05);
      opacity: 1;
    }
    75% {
      transform: translateY(1px) scale(1.008, 0.99);
      opacity: 1;
    }
    100% {
      transform: translateY(0) scale(1, 1);
      opacity: 1;
    }
  }
}

.np-composer__bar {
  flex: 1;
  min-width: 0;
  width: auto;
  display: flex;
  align-items: center;
  gap: 2px;
  border: 1px solid rgba(0, 102, 204, 0.18);
  background: #fff;
  border-radius: 999px;
  padding: 5px 6px 5px 4px;
  min-height: 46px;
  overflow: visible;
  box-shadow:
    0 0 0 3px rgba(0, 123, 255, 0.07),
    0 0 22px rgba(0, 123, 255, 0.13),
    0 5px 16px rgba(15, 23, 42, 0.09);
  cursor: text;
  text-align: left;
  font: inherit;
  color: inherit;
  position: relative;
}
/* Dentro la shell: niente seconda pill — la shell È la barra */
.np-composer--with-bar .np-composer__bar {
  border: 0;
  background: transparent;
  border-radius: 0;
  box-shadow: none;
  padding: 0;
  min-height: 0;
  flex: 1;
  align-items: flex-end;
  position: relative;
  overflow: visible;
}
.np-composer--with-bar .np-composer__bar-row {
  align-items: flex-end;
}
.np-composer__bar-emoji,
.np-composer__bar-attach,
.np-composer__bar-camera {
  position: relative;
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border: none;
  padding: 0;
  border-radius: 50%;
  background: transparent;
  color: #5b6b7c;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.05rem;
  cursor: pointer;
}
.np-composer__bar-emoji:hover,
.np-composer__bar-attach:hover,
.np-composer__bar-camera:hover {
  color: #007bff;
  background: rgba(0, 123, 255, 0.08);
}
.np-composer__bar-anon {
  position: relative;
  flex-shrink: 0;
  margin: 0;
  cursor: pointer;
}
.np-composer__bar-anon input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
  margin: 0;
  pointer-events: none;
}
.np-composer__bar-anon > input + span {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #5b6b7c;
  font-size: 1.05rem;
  background: transparent;
  -webkit-tap-highlight-color: transparent;
}
@media (hover: hover) and (pointer: fine) {
  .np-composer__bar-anon:hover > input + span {
    color: #007bff;
    background: rgba(0, 123, 255, 0.08);
  }
  .np-composer__bar-anon:hover > input:checked + span {
    color: #007bff;
    background: rgba(0, 123, 255, 0.12);
  }
}
.np-composer__bar-anon > input:checked + span {
  color: #007bff;
  background: rgba(0, 123, 255, 0.1);
}
.np-composer__bar-anon > input:not(:checked) + span {
  color: #5b6b7c;
  background: transparent;
}
.np-composer__icon-desktop { display: none !important; }
.np-composer__icon-mobile { display: inline-block !important; }
.np-composer__bar-attach-badge {
  position: absolute;
  top: 2px;
  right: 2px;
  min-width: 14px;
  height: 14px;
  padding: 0 3px;
  border-radius: 999px;
  background: #007bff;
  color: #fff;
  font-size: 0.62rem;
  font-weight: 700;
  line-height: 14px;
  text-align: center;
}
.np-composer__bar-attach-badge[hidden] { display: none !important; }
.np-composer__bar-field {
  position: relative;
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  align-self: stretch;
}
.np-composer__bar-input {
  position: relative;
  z-index: 1;
  width: 100%;
  min-width: 0;
  border: none;
  outline: none;
  background: transparent;
  font: inherit;
  font-size: 0.9rem;
  line-height: 1.35;
  color: #1f2937;
  padding: 8px 0;
  margin: 0;
  resize: none;
  overflow-x: hidden;
  overflow-y: auto;
  white-space: pre-wrap;
  word-break: break-word;
  field-sizing: content;
  min-height: calc(1.35em + 16px);
  max-height: calc(1.35em * 4 + 16px); /* mobile: 4 righe poi scroll */
  box-sizing: border-box;
}
@media (min-width: 992px) {
  .np-composer__bar-input {
    font-size: 0.95rem;
    max-height: calc(1.35em * 5 + 16px); /* desktop: 5 righe */
  }
}
/* Icone laterali allineate in basso quando il messaggio cresce */
.np-composer--with-bar .np-composer__bar-anon,
.np-composer--with-bar .np-composer__emoji-wrap,
.np-composer--with-bar .np-composer__bar-emoji,
.np-composer--with-bar .np-composer__bar-attach,
.np-composer--with-bar .np-composer__bar-camera,
.np-composer--with-bar .np-composer__bar-send {
  align-self: flex-end;
  margin-bottom: 2px;
}
.np-composer__emoji-wrap {
  /* Mobile: niente containing block → il panel si ancora al .np-composer__bar */
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  align-self: flex-end;
  margin-bottom: 2px;
}
.np-composer__emoji-panel {
  position: absolute;
  left: auto;
  right: 0;
  bottom: calc(100% + 10px);
  z-index: 40;
  /* Come prima: larghezza sul bar inset, non su 100vw */
  width: min(392px, 100%);
  max-width: 100%;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 0;
  border-radius: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
  max-height: min(70dvh, 420px);
  overflow: hidden;
  transform: none;
}
.np-composer__emoji-panel[hidden] { display: none !important; }
.np-composer__emoji-presets,
.np-composer__emoji-all {
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.14);
}
.np-composer__emoji-presets {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  padding: 8px;
  flex-shrink: 0;
  order: 2;
}
.np-composer__emoji-preset {
  appearance: none;
  flex: 1;
  border: 0;
  background: #f1f5f9;
  border-radius: 12px;
  font-size: 1.35rem;
  line-height: 1.2;
  padding: 10px 4px;
  cursor: pointer;
}
.np-composer__emoji-preset:hover {
  background: #e2e8f0;
}
.np-composer__emoji-preset--more {
  flex: 0 0 44px;
  font-weight: 700;
  color: #334155;
}
.np-composer__emoji-preset--more[hidden] {
  display: none !important;
}
.np-composer__emoji-all[hidden] {
  display: none !important;
}
.np-composer__emoji-all {
  display: flex;
  flex-direction: column;
  min-height: 0;
  flex: 1 1 auto;
  gap: 4px;
  order: 1;
  padding: 8px;
  max-height: min(360px, 52dvh, 100%);
  overflow: hidden;
}
.np-composer__emoji-loading {
  padding: 18px 8px;
  text-align: center;
  color: #6b7280;
  font-size: 0.85rem;
}
.np-composer__emoji-cats {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2px;
  flex-shrink: 0;
  overflow-x: auto;
  padding-bottom: 2px;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}
.np-composer__emoji-cat {
  appearance: none;
  flex: 1 1 0;
  min-width: 0;
  width: auto;
  height: 34px;
  border: none;
  border-radius: 10px;
  background: transparent;
  font-size: 1.05rem;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.np-composer__emoji-cat.is-active,
.np-composer__emoji-cat:hover {
  background: #f1f5f9;
}
.np-composer__emoji-grid {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 2px;
  overflow-y: auto;
  max-height: min(240px, 42vh);
  min-height: 0;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
.np-composer__emoji-btn {
  width: 100%;
  aspect-ratio: 1;
  border: none;
  border-radius: 10px;
  background: transparent;
  font-size: 1.2rem;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.np-composer__emoji-btn:hover,
.np-composer__emoji-btn:focus-visible {
  background: #f1f5f9;
  outline: none;
}
@media (min-width: 992px) {
  .np-composer__bar {
    /* padding-right: spazio dove “entra” il send, senza coprire il + */
    padding: 6px 44px 6px 8px;
    min-height: 50px;
    gap: 4px;
  }
  .np-composer--with-bar .np-composer__bar {
    padding: 0;
    min-height: 0;
  }
  .np-composer__bar-camera {
    display: none !important; /* fotocamera: solo mobile */
  }
  .np-composer__icon-mobile { display: none !important; }
  .np-composer__icon-desktop { display: inline-block !important; }
  .np-composer__bar-row {
    gap: 4px;
  }
  .np-composer__bar-attach {
    position: relative;
    z-index: 2; /* resta cliccabile accanto al send */
  }
  /* Send dentro la shell-pill (no overlap negativo fuori) */
  .np-composer--with-bar .np-composer__bar-send {
    margin-left: 0;
    margin-right: 2px;
    position: relative;
    z-index: 1;
  }
  .np-composer:not(.np-composer--with-bar) .np-composer__bar-send {
    margin-left: -40px;
    margin-right: 8px;
    position: relative;
    z-index: 1;
  }
  .np-composer__bar-input {
    font-size: 0.95rem;
    padding-right: 8px;
  }
  .np-composer__emoji-wrap {
    position: relative; /* Desktop: containing block = smile */
  }
  .np-composer__emoji-panel {
    /* Desktop: centrato sopra l’icona smile */
    left: 50%;
    right: auto;
    transform: translateX(-50%);
    width: min(392px, calc(100vw - 48px));
    max-width: min(392px, calc(100vw - 48px));
    max-height: min(70dvh, 420px);
  }
}
.np-composer__bar[hidden] { display: none !important; }
.np-composer__bar-placeholder {
  position: absolute;
  left: 0;
  right: 0;
  top: 8px;
  transform: none;
  margin: 0;
  color: #888;
  font-size: 0.9rem;
  line-height: 1.35;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  pointer-events: none;
  z-index: 0;
  opacity: 1;
  transition: opacity 0.25s ease;
}
.np-composer__bar-placeholder[hidden] {
  display: block !important;
  opacity: 0;
  visibility: hidden;
}
@media (min-width: 992px) {
  .np-composer__bar-placeholder {
    font-size: 0.95rem;
  }
  .np-composer:not(.np-composer--with-bar) .np-composer__bar-placeholder {
    padding-right: 44px;
  }
}
.np-composer__bar-placeholder.is-in {
  animation: np-bar-phrase-in 0.35s ease;
}
@keyframes np-bar-phrase-in {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: none; }
}
.np-composer__bar-send {
  width: 44px;
  height: 44px;
  border: none;
  padding: 0;
  border-radius: 50%;
  background: #007bff;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 0.95rem;
  cursor: pointer;
  box-shadow: 0 2px 10px rgba(0, 123, 255, 0.35);
}
@media (max-width: 991px) {
  /* Mobile: send nella stessa shell-pill */
  .np-composer--with-bar .np-composer__bar-row {
    gap: 6px;
  }
  .np-composer:not(.np-composer--with-bar) .np-composer__bar-row {
    gap: 10px;
  }
  .np-composer:not(.np-composer--with-bar) .np-composer__bar {
    padding: 5px 4px 5px 2px;
    min-height: 48px;
  }
  .np-composer__bar-send {
    width: 48px;
    height: 48px;
  }
  .np-composer--with-bar .np-composer__bar-send {
    width: 40px;
    height: 40px;
  }
}
@media (min-width: 992px) {
  .np-composer__bar-send {
    width: 36px;
    height: 36px;
    font-size: 0.85rem;
  }
}

.np-composer__sheet {
  display: flex;
  flex-direction: column;
  max-height: var(--np-sheet-max-h, min(78vh, 640px));
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-radius: 22px;
  box-shadow: 0 12px 40px rgba(15, 23, 42, 0.18);
  overflow: hidden;
  animation: np-sheet-up 0.22s ease;
  position: relative;
}
/* Dentro la shell: niente secondo “modale”; solo area step che si allunga */
.np-composer--with-bar .np-composer__sheet--in-bar {
  border: none;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
  max-height: none;
  flex: 1 1 auto;
  min-height: 0;
  animation: none;
  overflow: hidden;
  order: 0;
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.34s cubic-bezier(0.22, 1, 0.36, 1);
  visibility: hidden;
  pointer-events: none;
}
.np-composer--with-bar.is-open .np-composer__sheet--in-bar {
  grid-template-rows: 1fr;
  visibility: visible;
  pointer-events: auto;
}
.np-composer--with-bar .np-composer__grow {
  overflow: hidden;
  min-height: 0;
  display: flex;
  flex-direction: column;
  position: relative;
}
.np-composer--with-bar .np-composer__grow .np-composer__form {
  flex: 1 1 auto;
  min-height: 0;
}
.np-composer__sheet[hidden] { display: none !important; }
/* with-bar: niente display:none — altrimenti non si vede l’allungamento */
.np-composer--with-bar .np-composer__sheet--in-bar[hidden] {
  display: grid !important;
}

.np-composer__back {
  appearance: none;
  border: 0;
  background: transparent;
  color: #94a3b8;
  font-size: 1.45rem;
  font-weight: 400;
  line-height: 1;
  width: 44px;
  height: 44px;
  border-radius: 999px;
  cursor: pointer;
  flex: 0 0 auto;
  display: none;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 4px;
  left: 4px;
  z-index: 3;
  transition: color 0.15s ease, background 0.15s ease;
}
.np-composer__back:not([hidden]) { display: inline-flex !important; }
.np-composer__back:hover { color: #475569; background: rgba(15, 23, 42, 0.05); }
.np-composer__back:active { color: #0f172a; }
.np-composer__back[hidden] { display: none !important; }

.np-composer__title--sr {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.np-composer__body-block--bar-owned,
.np-composer__anon-quiet--bar-owned {
  display: none !important;
}
.np-composer--with-bar .np-post-images__add,
.np-composer--with-bar .np-post-images__hint {
  display: none !important;
}
.np-composer--with-bar .np-post-images--bar-owned {
  margin: 0;
  /* solo input file nascosto nel form */
}
.np-composer--with-bar.is-open:not([data-step="0"]) .np-composer__rail {
  display: none !important;
}
.np-composer__actions--bar-owned {
  display: none !important;
}

/* Suggest + anteprime immagini sopra la riga input */
.np-composer__rail {
  order: 1;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
  padding: 4px 6px 2px;
  box-sizing: border-box;
}
.np-composer__rail[hidden] { display: none !important; }
.np-composer--with-bar .np-composer__bar-row {
  order: 2;
  flex-shrink: 0;
  width: 100%;
  padding: 0;
  margin: 0;
  gap: 4px;
}
.np-composer__suggest--rail {
  margin: 0;
}
.np-composer__suggest--rail .np-composer__suggest-label {
  margin-bottom: 4px;
  padding-left: 2px;
}
.np-post-images__preview--rail {
  margin: 0;
  padding: 0 2px;
}
.np-post-images__preview--rail .np-post-images__tile {
  width: 56px;
  height: 56px;
}
@media (min-width: 992px) {
  .np-post-images__preview--rail .np-post-images__tile {
    width: 64px;
    height: 64px;
  }
}
.np-composer__publish-status {
  order: 1;
  flex-shrink: 0;
  margin: 0;
  padding: 2px 10px 0;
  font-size: 0.82rem;
  font-weight: 650;
  color: #007bff;
  text-align: center;
}
.np-composer__publish-status[hidden] { display: none !important; }
.np-composer__bar-send.is-busy,
.np-composer__btn-publish.is-busy {
  pointer-events: none;
  cursor: wait;
  opacity: 0.75;
}
.np-composer__bar-send.is-busy i,
.np-composer__btn-publish.is-busy i {
  animation: np-publish-spin 0.75s linear infinite;
}
@keyframes np-publish-spin {
  to { transform: rotate(360deg); }
}
.np-composer.is-submitting {
  pointer-events: none;
}
.np-composer.is-submitting .np-composer__bar-send,
.np-composer.is-submitting .np-composer__btn-publish {
  pointer-events: auto;
}
.np-composer--with-bar.is-open .np-composer__bar-row {
  padding: 4px 2px 0;
  margin-top: auto;
  border-top: 1px solid rgba(0, 102, 204, 0.08);
  position: relative;
  z-index: 6;
  overflow: visible;
}
.np-composer--with-bar.is-open[data-step="0"] .np-composer__sheet-body {
  padding-top: 8px;
  padding-bottom: 4px;
}
.np-composer--with-bar.is-open:not([data-step="0"]) .np-composer__sheet-body {
  padding-top: 36px;
}
.np-composer--with-bar.is-open .np-composer__bar[hidden] {
  display: none !important;
}
.np-composer--with-bar.is-open .np-composer__bar-send.is-step-advance {
  margin-left: auto;
  margin-right: 2px;
}
/* Titolo: label a sinistra, campo a destra (wrap → label resta su 1ª riga) */
.np-composer__title-row {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  width: 100%;
  margin: 0 0 4px;
  box-sizing: border-box;
}
.np-composer__label--inline {
  flex: 0 0 auto;
  margin: 0;
  padding: 8px 0 0;
  line-height: 1.35;
  white-space: nowrap;
}
/* Titolo = stesso look del messaggio (niente box cm-input) */
.np-composer--with-bar .np-composer__title-input,
.np-composer--with-bar .np-composer__title-input.cm-input {
  display: block;
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
  margin: 0;
  padding: 8px 4px;
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  outline: none;
  font: inherit;
  font-size: 0.9rem;
  line-height: 1.35;
  color: #1f2937;
  box-sizing: border-box;
  resize: none;
  overflow: hidden;
  min-height: calc(1.35em + 16px);
  field-sizing: content;
}
@media (min-width: 992px) {
  .np-composer--with-bar .np-composer__title-input,
  .np-composer--with-bar .np-composer__title-input.cm-input {
    font-size: 0.95rem;
  }
}
.np-composer--with-bar .np-composer__title-input::placeholder {
  color: #888;
  opacity: 1;
}
.np-composer--with-bar .np-composer__title-input:focus {
  outline: none;
  box-shadow: none;
  border: none;
}
.np-composer--with-bar.is-open[data-step="0"] .np-composer__title-row {
  padding-left: 4px;
}
/* Fallback non-with-bar: stessa riga inline */
.np-composer:not(.np-composer--with-bar) .np-composer__title-row {
  margin-bottom: 12px;
}
.np-composer:not(.np-composer--with-bar) .np-composer__title-input {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  resize: none;
  overflow: hidden;
  min-height: calc(1.35em + 16px);
  field-sizing: content;
}
.np-composer--with-bar .np-composer__sheet--in-bar .np-composer__back {
  top: 2px;
  left: 2px;
}
/* Step notifica: pannelli in-flow (no overflow fuori schermo su mobile) */
.np-composer[data-step="3"] .np-composer__sheet-body {
  overflow-x: hidden;
  overflow-y: auto;
}
.np-composer[data-step="3"] .np-notify-wrap {
  z-index: 5;
}
.np-composer[data-step="3"] .np-notify-panel {
  z-index: 6;
}
@media (max-width: 991px) {
  body.np-composer-keyboard-open .np-composer.is-open .np-composer__dock {
    bottom: calc(var(--np-keyboard-inset, 0px) + 8px) !important;
    z-index: 10150;
  }
  body.np-composer-keyboard-open .np-composer.is-open .np-composer__shell {
    max-height: var(--np-sheet-max-h, 70dvh);
  }
  body.np-composer-keyboard-open .np-composer.is-open .np-composer__sheet--in-bar {
    max-height: none;
  }
  body.np-composer-keyboard-open .np-composer__actions {
    padding-bottom: 12px;
  }
}
@media (min-width: 992px) {
  .np-composer:not(.np-composer--with-bar).is-open .np-composer__sheet {
    max-height: min(86vh, 720px);
    border-radius: 20px;
    box-shadow: 0 24px 64px rgba(15, 23, 42, 0.22);
    animation: np-sheet-center 0.28s cubic-bezier(0.22, 1, 0.36, 1);
  }
  .np-composer--with-bar.is-open .np-composer__sheet--in-bar {
    max-height: none;
    border-radius: 0;
    box-shadow: none;
    animation: none;
  }
  .np-composer:not(.np-composer--with-bar).is-open .np-composer__actions {
    border-radius: 0 0 20px 20px;
  }
}
@keyframes np-sheet-up {
  from { transform: translateY(18px); opacity: 0.7; }
  to { transform: translateY(0); opacity: 1; }
}
@keyframes np-sheet-center {
  from { transform: translateY(12px) scale(0.98); opacity: 0.75; }
  to { transform: none; opacity: 1; }
}

.np-composer__form {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  margin: 0;
}

.np-composer:not(.np-composer--with-bar) .np-composer__dock {
  position: fixed;
  left: 12px;
  right: 12px;
  bottom: calc(12px + env(safe-area-inset-bottom, 0px));
  max-width: 720px;
  margin: 0 auto;
  z-index: 241;
}
.np-composer:not(.np-composer--with-bar):not(.is-open) {
  pointer-events: none;
}
.np-composer:not(.np-composer--with-bar):not(.is-open) .np-composer__dock {
  display: none;
}
@media (max-width: 991px) {
  .np-composer:not(.np-composer--with-bar) .np-composer__dock {
    bottom: calc(78px + env(safe-area-inset-bottom, 0px));
  }
  body.cm-nav-hidden .np-composer:not(.np-composer--with-bar) .np-composer__dock {
    bottom: calc(12px + env(safe-area-inset-bottom, 0px));
  }
}

.np-composer__sheet-head {
  display: none;
}
.np-composer__close {
  border: none;
  background: #f1f5f9;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  cursor: pointer;
  color: #475569;
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 3;
}
.np-composer__close[hidden] { display: none !important; }
.np-composer:not(.np-composer--with-bar) .np-composer__sheet-body {
  padding-top: 48px;
}
.np-composer__title {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 800;
}
.np-composer__sheet-body {
  padding: 12px 14px 8px;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  flex: 1 1 auto;
  min-height: 0;
}
.np-composer__label {
  display: block;
  font-size: 0.78rem;
  font-weight: 700;
  color: #64748b;
  margin: 0 0 6px;
}
.np-composer__title-input {
  margin-bottom: 12px;
}
.np-composer__body {
  min-height: 110px;
  margin-bottom: 10px;
}
.np-composer__section-title {
  margin: 4px 0 10px;
  font-size: 0.95rem;
  font-weight: 800;
}
.np-composer__section-title--topics {
  margin-top: 22px;
}
.np-audience {
  margin-top: 22px;
  padding-top: 4px;
}
.np-notify-wrap {
  position: relative;
  margin: 8px 0 14px;
  z-index: 5;
}
.np-notify-lock {
  margin: 12px 0 0;
  padding: 12px 14px;
  border-radius: 12px;
  background: #f1f5f9;
  color: #334155;
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1.45;
}
.np-notify-lock__text {
  margin: 0;
}
.np-notify-lock__invite {
  margin-top: 12px;
}
.np-notify-lock__invite-label {
  display: block;
  margin: 0 0 6px;
  font-size: 0.8rem;
  font-weight: 700;
  color: #64748b;
  text-transform: none;
  letter-spacing: 0;
}
.np-notify-lock__invite-row {
  display: flex;
  gap: 8px;
  align-items: stretch;
}
.np-notify-lock__invite-input {
  flex: 1 1 auto;
  min-width: 0;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  padding: 8px 10px;
  font-size: 0.82rem;
  background: #fff;
  color: #0f172a;
}
.np-notify-lock__invite-copy {
  flex: 0 0 auto;
  white-space: nowrap;
}
.np-notify-wrap.is-locked .np-notify-phrase {
  opacity: 0.55;
}
.np-notify-wrap.is-locked .np-notify-phrase__chip[disabled] {
  cursor: not-allowed;
}
.np-notify-phrase {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 6px;
  margin: 0;
  font-size: 1.02rem;
  font-weight: 650;
  color: #0f172a;
  line-height: 1.45;
}
.np-notify-phrase__text {
  color: #334155;
  font-weight: 600;
}
.np-notify-phrase__chip {
  appearance: none;
  border: 1px dashed #94a3b8;
  background: #f8fafc;
  border-radius: 999px;
  padding: 7px 12px;
  font: inherit;
  font-weight: 750;
  color: #0f172a;
  cursor: pointer;
  max-width: 100%;
}
.np-notify-phrase__chip.is-set {
  border-style: solid;
  border-color: #0066cc;
  background: #eff6ff;
  color: #0b3d91;
}
.np-notify-phrase__caret {
  opacity: 0.65;
  font-size: 0.85em;
}
.np-notify-panel {
  position: relative;
  left: auto;
  right: auto;
  top: auto;
  z-index: 6;
  margin: 10px 0 0;
  padding: 10px;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.12);
  max-height: min(280px, 45vh);
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.np-notify-panel__opt,
.np-notify-panel__clear {
  appearance: none;
  display: block;
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  padding: 10px 12px;
  border-radius: 10px;
  font-size: 0.92rem;
  font-weight: 650;
  color: #0f172a;
  cursor: pointer;
}
.np-notify-panel__opt:hover,
.np-notify-panel__clear:hover {
  background: #f1f5f9;
}
.np-notify-panel__clear {
  margin-top: 8px;
  color: #64748b;
  font-weight: 600;
}
.np-notify-panel--search {
  overflow: visible;
  max-height: none;
}
.np-notify-panel--search .cm-input {
  position: relative;
  margin-bottom: 8px;
  width: 100%;
  box-sizing: border-box;
}
.np-notify-panel--search .np-audience__suggest {
  position: relative;
  left: auto;
  right: auto;
  top: auto;
  margin: 0 0 8px;
  max-height: min(220px, 36vh);
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.np-audience__match {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin: 0 0 12px;
}
.np-audience__match-opt {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.88rem;
  font-weight: 650;
  color: #0f172a;
  cursor: pointer;
}
.np-audience__chip-row {
  position: relative;
  margin: 0 0 12px;
}
.np-audience__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}
.np-audience__chip {
  appearance: none;
  border: 1px solid #cbd5e1;
  background: #f8fafc;
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 0.82rem;
  font-weight: 650;
  cursor: pointer;
  color: #0f172a;
}
.np-audience__suggest {
  position: absolute;
  left: 0;
  right: 0;
  top: 42px;
  z-index: 5;
  max-height: 180px;
  overflow: auto;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.12);
}
.np-audience__suggest button {
  display: block;
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  padding: 10px 12px;
  font-size: 0.9rem;
  cursor: pointer;
}
.np-audience__suggest button:hover {
  background: #f1f5f9;
}
.np-audience__meta {
  display: block;
  font-size: 0.75rem;
  font-weight: 600;
  color: #64748b;
  margin-top: 2px;
}
.np-composer__topic-tools {
  display: flex;
  gap: 8px;
  align-items: center;
  margin: 0 0 10px;
  position: sticky;
  top: 0;
  z-index: 2;
  background: #fff;
  padding-bottom: 4px;
}
.np-composer__topic-tools .cm-input {
  flex: 1;
  min-width: 0;
}
#newPostModal .np-new-tag-hint {
  font-size: 0.82rem;
  color: #666;
  margin: 0 0 10px;
  line-height: 1.45;
}
.np-composer .cm-topic-picker-container {
  max-height: 280px;
}

/* Anonimato: secondario, facile da ignorare (step 1) */
.np-composer__anon-quiet {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
  cursor: pointer;
  user-select: none;
  color: #94a3b8;
  font-size: 0.82rem;
  font-weight: 500;
  opacity: 0.85;
}
.np-composer__anon-quiet input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.np-composer__anon-quiet span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 2px;
  border: none;
  background: transparent;
  border-radius: 0;
  color: inherit;
  font-weight: inherit;
}
.np-composer__anon-quiet span i {
  font-size: 0.85rem;
  color: #94a3b8;
}
.np-composer__anon-quiet:hover {
  color: #64748b;
  opacity: 1;
}
.np-composer__anon-quiet input:checked + span,
.np-composer__anon-quiet input:checked + span i {
  color: #007bff;
}

.np-composer__warn {
  color: #dc3545;
  font-size: 0.9rem;
  font-weight: 600;
  margin: 8px 0 0;
}
.np-composer__warn[hidden] { display: none !important; }

.np-composer__actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 12px 14px calc(12px + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid #f1f5f9;
  background: #fff;
  flex-shrink: 0;
  position: relative;
  z-index: 2;
  /* Serve soprattutto allo step 3 (overflow:visible per i pannelli): altrimenti angoli inferiori squadrati */
  border-radius: 0 0 22px 22px;
}
.np-composer__actions .np-composer__btn-prev {
  margin-right: auto;
}

/* Step actions: .cm-btn ignora [hidden] → forziamo display per step 0–3 */
.np-composer__actions .cm-btn[hidden] {
  display: none !important;
}
.np-composer[data-step="0"] .np-composer__btn-publish,
.np-composer[data-step="0"] .np-composer__btn-prev,
.np-composer[data-step="1"] .np-composer__btn-publish,
.np-composer[data-step="2"] .np-composer__btn-publish,
.np-composer[data-step="3"] .np-composer__btn-next {
  display: none !important;
}
.np-composer[data-step="0"] .np-composer__btn-next,
.np-composer[data-step="1"] .np-composer__btn-next,
.np-composer[data-step="1"] .np-composer__btn-prev,
.np-composer[data-step="2"] .np-composer__btn-next,
.np-composer[data-step="2"] .np-composer__btn-prev,
.np-composer[data-step="3"] .np-composer__btn-publish,
.np-composer[data-step="3"] .np-composer__btn-prev {
  display: inline-flex !important;
}

.np-composer__suggest {
  margin-top: 10px;
}
.np-composer__suggest[hidden] { display: none !important; }
.np-composer__suggest-label {
  font-size: 0.8rem;
  color: #888;
  margin-bottom: 6px;
}
.np-suggest-chip {
  cursor: pointer;
  margin: 0 4px 6px 0;
  border: none;
  font: inherit;
}
.np-suggest-chip.is-selected {
  background: #007bff;
  color: #fff;
}

/* Work avail hint inside composer */
.np-composer .np-work-avail-hint {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  background: #fff8e6;
  border: 1px solid #f0e0a8;
  border-radius: 14px;
  padding: 12px;
  margin-bottom: 12px;
}
.np-composer .np-work-avail-hint[hidden] { display: none !important; }
.np-composer .np-work-avail-hint__icon {
  color: #c9a227;
  flex-shrink: 0;
}
.np-composer .np-work-avail-hint__title {
  margin: 0 0 4px;
  font-weight: 800;
  font-size: 0.92rem;
}
.np-composer .np-work-avail-hint__text {
  margin: 0 0 6px;
  font-size: 0.86rem;
  line-height: 1.45;
  color: #444;
}
.np-composer .np-work-avail-hint__text--soft { color: #666; }
.np-composer .np-work-avail-hint__dismiss {
  border: none;
  background: transparent;
  cursor: pointer;
  color: #888;
  margin-left: auto;
}

/* Spazio in fondo feed per non coprire l'ultimo post con la barra sticky */
body.cm-community-index:has(.np-composer--with-bar) .cm-feed-list,
body.cm-community-index:has(.np-composer--with-bar) .col-center {
  padding-bottom: 88px;
}
body.hf-page:has(.np-composer--with-bar) .hf-main--stream,
body.hf-page:has(.np-composer--with-bar) .hf-feed-stream {
  padding-bottom: 88px;
}
@media (max-width: 991px) {
  body.cm-community-index:has(.np-composer--with-bar) .cm-feed-list,
  body.cm-community-index:has(.np-composer--with-bar) .col-center {
    padding-bottom: 150px;
  }
  body.hf-page:has(.np-composer--with-bar) .hf-main--stream,
  body.hf-page:has(.np-composer--with-bar) .hf-feed-stream {
    padding-bottom: 150px;
  }
}

body.np-composer-open .cm-community-index .cm-feed-compose-row {
  visibility: hidden;
}

/* Sheet avviso mirato post-publish (pagina post) */
.pn-sheet {
  position: fixed;
  inset: 0;
  z-index: 12050;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px;
  padding-bottom: max(12px, env(safe-area-inset-bottom, 0px));
  box-sizing: border-box;
  pointer-events: none;
}
.pn-sheet[hidden] {
  display: none !important;
}
.pn-sheet:not([hidden]) {
  pointer-events: auto;
}
.pn-sheet__scrim {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.45);
  opacity: 0;
  transition: opacity 0.45s ease;
}
.pn-sheet.is-open .pn-sheet__scrim {
  opacity: 1;
}
.pn-sheet__stage {
  position: relative;
  z-index: 1;
  width: min(560px, 100%);
  margin: 0;
  isolation: auto;
  overflow: visible;
  opacity: 0;
  transform: translateY(22px) scale(0.97);
}
.pn-sheet.is-open .pn-sheet__stage {
  animation: pnSheetCardIn 0.6s cubic-bezier(0.22, 1, 0.36, 1) 0.04s both;
}
@keyframes pnSheetCardIn {
  from { opacity: 0; transform: translateY(22px) scale(0.97); }
  to { opacity: 1; transform: none; }
}
.pn-sheet__glow {
  position: absolute;
  inset: -10px;
  z-index: 0;
  border-radius: 28px;
  pointer-events: none;
  background: conic-gradient(
    from var(--pn-spin, 0deg),
    transparent 0deg,
    transparent 200deg,
    rgba(96, 165, 250, 0.18) 230deg,
    rgba(167, 139, 250, 0.75) 265deg,
    rgba(244, 114, 182, 0.55) 300deg,
    rgba(34, 211, 238, 0.45) 335deg,
    transparent 360deg
  );
  filter: blur(14px);
  opacity: 0;
  animation:
    pnSheetSpin 3.2s linear infinite,
    pnSheetAuraDuty 14s ease-in-out infinite;
  animation-play-state: paused;
}
.pn-sheet.is-open .pn-sheet__glow {
  animation-play-state: running;
}
@property --pn-spin {
  syntax: '<angle>';
  inherits: false;
  initial-value: 0deg;
}
@keyframes pnSheetSpin {
  to { --pn-spin: 360deg; }
}
@keyframes pnSheetAuraDuty {
  0%, 100% { opacity: 0.35; }
  40% { opacity: 0.85; }
  70% { opacity: 0.55; }
}
.pn-sheet__panel {
  position: relative;
  z-index: 1;
  width: 100%;
  max-height: min(88vh, 720px);
  overflow: visible;
  margin: 0;
  padding: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.pn-sheet__panel.referral-panel {
  margin: 0;
}
.pn-sheet__panel .referral-panel__inner {
  max-height: min(82vh, 680px);
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.pn-sheet__panel .np-notify-wrap {
  margin: 12px 0 14px;
}
.pn-sheet__panel .np-notify-phrase {
  font-size: 0.98rem;
}
.referral-share-chip--primary {
  background: rgba(79, 124, 255, 0.22);
  border-color: rgba(79, 124, 255, 0.45);
  font-weight: 700;
}
.referral-share-chip--primary:hover {
  background: rgba(79, 124, 255, 0.32);
  border-color: rgba(79, 124, 255, 0.6);
}
@media (min-width: 992px) {
  .pn-sheet {
    padding: 24px;
  }
  .pn-sheet__stage {
    margin: 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  .pn-sheet__scrim {
    transition: none;
  }
  .pn-sheet.is-open .pn-sheet__stage {
    animation: none;
    opacity: 1;
    transform: none;
  }
  .pn-sheet__glow {
    animation: none;
    opacity: 0.45;
  }
}
.pn-sheet__title {
  margin: 0 0 8px;
  font-size: 1.2rem;
  font-weight: 800;
  color: #0f172a;
}
.pn-sheet__lead {
  margin: 0 0 14px;
  font-size: 0.92rem;
  font-weight: 600;
  color: #64748b;
  line-height: 1.45;
}
.pn-sheet__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
  margin-top: 16px;
}
.pn-sheet__actions .referral-share-chip {
  font-size: 0.8rem;
  line-height: 1.25;
  text-align: center;
  white-space: normal;
  padding: 10px 8px;
}
.pn-sheet__status {
  margin: 10px 0 0;
  font-size: 0.88rem;
  font-weight: 600;
  color: #475569;
}
.pn-sheet.is-busy .pn-sheet__panel {
  opacity: 0.92;
}
body.pn-sheet-open {
  overflow: hidden;
}