/* nova_note.css — 10_Moduli/00_Sistema/00.03_frontend/nova_note.css
   Note adesive personali (post-it) sulla dashboard. Stile Mac, minimale. */

/* Layer che ospita i post-it: copre l'area di lavoro ma lascia passare i click
   dove non c'è una nota (pointer-events:none sul layer, auto sui figli). */
#novaNoteLayer {
  position: absolute;
  inset: 0;
  /* I post-it galleggiano SOPRA le finestre dei moduli (stile sticky Mac): le
     finestre Nova partono da z-index 20 e crescono al click (overlay 60, minimizzate
     70). Stiamo sopra di loro ma SOTTO la topbar (120) e i dialog (10000). Il layer
     crea uno stacking-context, quindi tutti i post-it figli stanno sopra le finestre.
     Senza questo, una nota su un'area coperta dalla bacheca Task era invisibile. */
  z-index: 100;
  pointer-events: none;
}

/* Il post-it. */
.nv-note {
  position: absolute;
  pointer-events: auto;
  min-width: 170px;
  min-height: 130px;
  display: flex;
  flex-direction: column;
  border-radius: 10px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, .22);
  overflow: hidden;
  resize: both;           /* maniglia di resize nativa in basso a destra */
  font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
}

/* Barra superiore (drag handle) con pallini macOS + mini-toolbar. */
.nv-note-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 5px 8px;
  cursor: grab;
  background: rgba(0, 0, 0, .06);
  user-select: none;
}
.nv-note-bar:active { cursor: grabbing; }

.nv-note-dots { display: inline-flex; gap: 6px; }
.nv-note-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  border: none;
  cursor: pointer;
  padding: 0;
}
.nv-note-dot--close { background: #ff5f57; }
.nv-note-dot--min { background: #febc2e; }

.nv-note-tools {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  margin-left: auto;
}
.nv-note-tool {
  width: 22px;
  height: 20px;
  border: none;
  background: transparent;
  border-radius: 4px;
  cursor: pointer;
  font: 600 12px/1 system-ui, sans-serif;
  color: #1f2937;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.nv-note-tool:hover { background: rgba(0, 0, 0, .08); }
.nv-note-tool--b { font-weight: 800; }
.nv-note-tool.is-on { background: rgba(0, 0, 0, .14); }
.nv-note-tool--trash { margin-left: 2px; }
.nv-note-tool--trash:hover { background: rgba(220, 38, 38, .12); }
.nv-note-tool--trash svg { display: block; }

/* Corpo editabile. */
.nv-note-body {
  flex: 1;
  min-height: 0;
  padding: 9px 11px;
  overflow: auto;
  outline: none;
  font-size: 13.5px;
  line-height: 1.45;
  color: #1f2937;
  word-break: break-word;
}
.nv-note-body img { max-width: 100%; height: auto; border-radius: 4px; }
.nv-note-body:empty::before {
  content: "Scrivi qui…";
  color: rgba(31, 41, 55, .4);
}

/* Palette colori (popover sotto la barra). */
.nv-note-palette {
  display: none;
  gap: 6px;
  padding: 7px 9px;
  flex-wrap: wrap;
  background: rgba(255, 255, 255, .55);
  border-top: 1px solid rgba(0, 0, 0, .08);
}
.nv-note-palette.is-open { display: flex; }
.nv-note-swatch {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 1.5px solid rgba(0, 0, 0, .15);
  cursor: pointer;
  padding: 0;
}
.nv-note-swatch.is-sel { outline: 2px solid #1f2937; outline-offset: 1px; }