/* ============================================================
   CPOOL DASHBOARD DESIGN SYSTEM V11.3.18D
   Dashboard = unica fonte madre per tipografia e pulsanti.
   Nessuna regola di larghezza o flusso applicativo.
   ============================================================ */

:root {
  /* Font UI già usato dalla Dashboard. */
  --cpool-font-ui:
    Inter,
    ui-sans-serif,
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;

  /* Allinea anche il vecchio sistema tipografico V9.1. */
  --cpool-type-page-title: 30px;
  --cpool-type-section-title: 20px;
  --cpool-type-subtitle: 16px;
  --cpool-type-body: 14px;
  --cpool-type-label: 13px;
  --cpool-type-small: 12px;
  --cpool-type-micro: 10px;

  /* Gerarchia effettiva della Dashboard auditata. */
  --cpool-ds-page-title-size: 30px;
  --cpool-ds-page-title-weight: 800;
  --cpool-ds-page-title-line: 1.14;
  --cpool-ds-page-title-spacing: -0.035em;

  --cpool-ds-page-subtitle-size: 15px;
  --cpool-ds-page-subtitle-weight: 400;
  --cpool-ds-page-subtitle-line: 1.55;

  --cpool-ds-section-title-size: 20px;
  --cpool-ds-section-title-weight: 700;
  --cpool-ds-section-title-line: 1.30;

  --cpool-ds-subsection-size: 16px;
  --cpool-ds-subsection-weight: 600;

  --cpool-ds-body-size: 14px;
  --cpool-ds-label-size: 13px;
  --cpool-ds-small-size: 12px;
  --cpool-ds-micro-size: 10px;

  /* Documenti recenti / attività Dashboard. */
  --cpool-ds-list-title-size: 12px;
  --cpool-ds-list-title-weight: 700;
  --cpool-ds-list-meta-size: 10px;

  /* Stat Dashboard. */
  --cpool-ds-stat-label-size: 10px;
  --cpool-ds-stat-value-size: 28px;

  /* Pulsanti Dashboard. */
  --cpool-ds-button-height: 46px;
  --cpool-ds-button-radius: 12px;
  --cpool-ds-button-padding-x: 18px;
  --cpool-ds-button-size: 13px;
  --cpool-ds-button-weight: 800;

  --cpool-ds-button-small-height: 36px;
  --cpool-ds-button-small-radius: 10px;
  --cpool-ds-button-small-padding-x: 13px;
  --cpool-ds-button-small-size: 12px;
  --cpool-ds-button-small-weight: 750;
}

/* ============================================================
   1. FONT MADRE
   ============================================================ */

html body.cpool-typography-scope,
html body.cpool-editor-layout {
  font-family: var(--cpool-font-ui) !important;
  font-size: var(--cpool-ds-body-size);
  font-weight: 400;
  line-height: 1.5;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

html body.cpool-typography-scope :where(
  button,
  input,
  select,
  textarea,
  option,
  optgroup,
  label,
  table,
  th,
  td,
  dialog,
  summary,
  .btn,
  .badge,
  .input,
  .select,
  .textarea,
  .table,
  .menu,
  .dropdown,
  .modal-box,
  [class^="cpool-"],
  [class*=" cpool-"]
),
html body.cpool-editor-layout :where(
  button,
  input,
  select,
  textarea,
  option,
  optgroup,
  label,
  .btn,
  .base-button,
  .white-button,
  .cpool-document-full-header,
  .cpool-parent-section-shell,
  .title-container,
  #fields_list_container
) {
  font-family: var(--cpool-font-ui) !important;
}

/* ============================================================
   2. TITOLI PAGINA = "BUONGIORNO LUCA" DELLA DASHBOARD
   Selettori volutamente UI-specifici: il contenuto dei documenti
   non viene coinvolto.
   ============================================================ */

html body.cpool-typography-scope :is(
  .cpool-dashboard > .cpool-v2-hero h1,
  .cpool-v2-page > .cpool-v2-hero h1,
  .cpool-page-header h1,
  .cpool-support-hero h1,
  .cpool-client-hero h1,
  .cpool-document-choice-hero h1,
  .cpool-parent-section-shell .cpool-v2-hero h1,
  .cpool-document-full-header h1,
  h1.text-3xl,
  h1.text-2xl
),
html body.cpool-editor-layout :is(
  .cpool-parent-section-shell .cpool-v2-hero h1,
  .cpool-document-full-header h1
) {
  margin-top: 0 !important;
  color: #0b1220 !important;
  font-family: var(--cpool-font-ui) !important;
  font-size: var(--cpool-ds-page-title-size) !important;
  font-weight: var(--cpool-ds-page-title-weight) !important;
  line-height: var(--cpool-ds-page-title-line) !important;
  letter-spacing: var(--cpool-ds-page-title-spacing) !important;
}

/* Sottotitolo collegato al titolo pagina. */
html body.cpool-typography-scope :is(
  .cpool-dashboard > .cpool-v2-hero,
  .cpool-v2-page > .cpool-v2-hero,
  .cpool-page-header,
  .cpool-support-hero,
  .cpool-client-hero,
  .cpool-document-choice-hero,
  .cpool-parent-section-shell .cpool-v2-hero,
  .cpool-document-full-header
) p,
html body.cpool-typography-scope h1.text-3xl + p,
html body.cpool-typography-scope h1.text-2xl + p,
html body.cpool-editor-layout :is(
  .cpool-parent-section-shell .cpool-v2-hero,
  .cpool-document-full-header
) p {
  font-family: var(--cpool-font-ui) !important;
  font-size: var(--cpool-ds-page-subtitle-size) !important;
  font-weight: var(--cpool-ds-page-subtitle-weight) !important;
  line-height: var(--cpool-ds-page-subtitle-line) !important;
}

/* ============================================================
   3. TITOLI DI RIQUADRO / SOTTOSEZIONE
   ============================================================ */

html body.cpool-typography-scope :is(
  .cpool-v2-panel-head h2,
  .cpool-v2-section-title h2,
  .cpool-drafts-toolbar h2,
  .cpool-support-page h2,
  .cpool-settings-v2-card h2,
  h2.text-xl,
  h2.text-lg
) {
  font-family: var(--cpool-font-ui) !important;
  font-size: var(--cpool-ds-section-title-size) !important;
  font-weight: var(--cpool-ds-section-title-weight) !important;
  line-height: var(--cpool-ds-section-title-line) !important;
  letter-spacing: -0.015em !important;
}

html body.cpool-typography-scope :is(
  .cpool-v2-page h3,
  .cpool-support-page h3,
  h3.text-lg,
  h3.font-semibold
) {
  font-family: var(--cpool-font-ui) !important;
  font-size: var(--cpool-ds-subsection-size) !important;
  font-weight: var(--cpool-ds-subsection-weight) !important;
  line-height: 1.4 !important;
  letter-spacing: -0.005em !important;
}

/* Descrizione dei riquadri come nella Dashboard. */
html body.cpool-typography-scope :is(
  .cpool-v2-panel-head p,
  .cpool-v2-section-title p,
  .cpool-drafts-toolbar p
) {
  font-size: var(--cpool-ds-small-size) !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
}

/* ============================================================
   4. TESTI DI LISTA = "DOCUMENTI RECENTI" DELLA DASHBOARD
   ============================================================ */

html body.cpool-typography-scope :is(
  .cpool-v2-list-main,
  .cpool-working-main
) > strong,
html body.cpool-typography-scope .cpool-timeline-mini-row strong,
html body.cpool-typography-scope .cpool-timeline-content strong,
html body.cpool-typography-scope .cpool-support-ticket strong {
  font-family: var(--cpool-font-ui) !important;
  font-size: var(--cpool-ds-list-title-size) !important;
  font-weight: var(--cpool-ds-list-title-weight) !important;
  line-height: 1.35 !important;
  letter-spacing: 0 !important;
}

html body.cpool-typography-scope :is(
  .cpool-v2-list-main,
  .cpool-working-main
) > :is(span, small),
html body.cpool-typography-scope .cpool-timeline-mini-row small,
html body.cpool-typography-scope .cpool-timeline-content small,
html body.cpool-typography-scope :is(
  .cpool-support-ticket-meta,
  .cpool-support-chat-sub,
  .cpool-support-message-time
) {
  font-family: var(--cpool-font-ui) !important;
  font-size: var(--cpool-ds-list-meta-size) !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
}

/* ============================================================
   5. STATISTICHE = CARD DASHBOARD
   ============================================================ */

html body.cpool-typography-scope .cpool-stat-card > :is(span, small) {
  font-family: var(--cpool-font-ui) !important;
  font-size: var(--cpool-ds-stat-label-size) !important;
  line-height: 1.35 !important;
}

html body.cpool-typography-scope .cpool-stat-card > span {
  font-weight: 700 !important;
}

html body.cpool-typography-scope .cpool-stat-card > small {
  font-weight: 400 !important;
}

html body.cpool-typography-scope .cpool-stat-card > strong {
  font-family: var(--cpool-font-ui) !important;
  font-size: var(--cpool-ds-stat-value-size) !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: -0.04em !important;
}

/* ============================================================
   6. LABEL, TABELLE, BADGE
   Mantengono la scala Dashboard/CPool già attiva, ma vengono
   fissati in modo definitivo per impedire override locali.
   ============================================================ */

html body.cpool-typography-scope :where(label, .label, .cpool-field-label) {
  font-size: var(--cpool-ds-label-size) !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
}

html body.cpool-typography-scope :where(
  input:not([type="checkbox"]):not([type="radio"]),
  select,
  textarea,
  option
) {
  font-size: var(--cpool-ds-body-size) !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
}

html body.cpool-typography-scope :is(th, .table th) {
  font-size: var(--cpool-ds-small-size) !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  letter-spacing: 0.035em !important;
}

html body.cpool-typography-scope :is(td, .table td) {
  font-size: var(--cpool-ds-body-size) !important;
  font-weight: 400;
  line-height: 1.5 !important;
}

html body.cpool-typography-scope :is(
  .badge,
  .cpool-status,
  [class*="-badge"]
) {
  font-family: var(--cpool-font-ui) !important;
  font-size: var(--cpool-ds-micro-size) !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  letter-spacing: 0.015em !important;
}

/* ============================================================
   7. PULSANTI = DASHBOARD
   Si uniformano SOLO geometria e tipografia.
   Colori, varianti primary/outline/error/ghost e comportamento
   restano quelli già presenti.
   ============================================================ */

html body.cpool-typography-scope .btn,
html body.cpool-document-layout .btn,
html body.cpool-editor-layout .cpool-document-full-header .btn,
html body.cpool-editor-layout .cpool-parent-section-shell .btn {
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  text-align: center !important;
  white-space: nowrap !important;
  font-family: var(--cpool-font-ui) !important;
  letter-spacing: 0 !important;
  text-transform: uppercase !important;
}

html body.cpool-typography-scope .btn:not(.btn-sm):not(.btn-xs),
html body.cpool-document-layout .btn:not(.btn-sm):not(.btn-xs),
html body.cpool-editor-layout .cpool-document-full-header .btn:not(.btn-sm):not(.btn-xs),
html body.cpool-editor-layout .cpool-parent-section-shell .btn:not(.btn-sm):not(.btn-xs) {
  min-height: var(--cpool-ds-button-height) !important;
  height: var(--cpool-ds-button-height) !important;
  padding: 0 var(--cpool-ds-button-padding-x) !important;
  border-radius: var(--cpool-ds-button-radius) !important;
  font-size: var(--cpool-ds-button-size) !important;
  font-weight: var(--cpool-ds-button-weight) !important;
}

html body.cpool-typography-scope .btn.btn-sm,
html body.cpool-document-layout .btn.btn-sm,
html body.cpool-editor-layout .cpool-document-full-header .btn.btn-sm,
html body.cpool-editor-layout .cpool-parent-section-shell .btn.btn-sm {
  min-height: var(--cpool-ds-button-small-height) !important;
  height: var(--cpool-ds-button-small-height) !important;
  padding: 0 var(--cpool-ds-button-small-padding-x) !important;
  border-radius: var(--cpool-ds-button-small-radius) !important;
  font-size: var(--cpool-ds-button-small-size) !important;
  font-weight: var(--cpool-ds-button-small-weight) !important;
}

html body.cpool-typography-scope .btn.btn-xs,
html body.cpool-document-layout .btn.btn-xs {
  min-height: 30px !important;
  height: 30px !important;
  padding: 0 10px !important;
  border-radius: 9px !important;
  font-size: 11px !important;
  font-weight: 750 !important;
}

/* btn-lg non crea una terza forma: usa la forma madre Dashboard. */
html body.cpool-typography-scope .btn.btn-lg {
  min-height: var(--cpool-ds-button-height) !important;
  height: var(--cpool-ds-button-height) !important;
  padding: 0 var(--cpool-ds-button-padding-x) !important;
  border-radius: var(--cpool-ds-button-radius) !important;
  font-size: var(--cpool-ds-button-size) !important;
  font-weight: var(--cpool-ds-button-weight) !important;
}

/* ============================================================
   8. EDITOR PDF
   Solo i due veri pulsanti di azione della barra superiore.
   Le tessere Testo/Firma/Data/Checkbox NON vengono trasformate.
   ============================================================ */

html body.cpool-editor-layout
.cpool-editor-builder-stage template-builder #send_button,
html body.cpool-editor-layout
.cpool-editor-builder-stage template-builder #save_button_container .base-button {
  box-sizing: border-box !important;
  min-height: var(--cpool-ds-button-height) !important;
  height: var(--cpool-ds-button-height) !important;
  padding-left: var(--cpool-ds-button-padding-x) !important;
  padding-right: var(--cpool-ds-button-padding-x) !important;
  border-radius: var(--cpool-ds-button-radius) !important;
  font-family: var(--cpool-font-ui) !important;
  font-size: var(--cpool-ds-button-size) !important;
  font-weight: var(--cpool-ds-button-weight) !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-transform: uppercase !important;
}

/* ============================================================
   9. ESCLUSIONI INTENZIONALI
   Il design system riguarda l'interfaccia CPool, NON il documento.
   ============================================================ */

html body.cpool-typography-scope :where(
  .ProseMirror,
  [contenteditable="true"],
  .pdf-viewer,
  .document-canvas,
  [data-document-editor],
  [data-pdf-viewer]
),
html body.cpool-typography-scope :where(
  .ProseMirror *,
  [contenteditable="true"] *,
  .pdf-viewer *,
  .document-canvas *,
  [data-document-editor] *,
  [data-pdf-viewer] *
),
html body.cpool-editor-layout :where(
  .ProseMirror,
  [contenteditable="true"],
  .pdf-viewer,
  .document-canvas,
  [data-document-editor],
  [data-pdf-viewer]
),
html body.cpool-editor-layout :where(
  .ProseMirror *,
  [contenteditable="true"] *,
  .pdf-viewer *,
  .document-canvas *,
  [data-document-editor] *,
  [data-pdf-viewer] *
) {
  font-family: revert !important;
  font-size: revert;
  font-weight: revert;
  line-height: revert;
  letter-spacing: revert;
  text-transform: revert;
}

@media (max-width: 640px) {
  :root {
    --cpool-type-page-title: 26px;
    --cpool-type-section-title: 18px;
    --cpool-ds-page-title-size: 26px;
    --cpool-ds-section-title-size: 18px;
  }
}
