/*
  Clases compartidas por los paneles de entidad del Context Workspace
  (Components/Workspace/ContextWorkspace.razor + Features/*/Components/
  *WorkspacePanel.razor). Global (no aislado a un componente) a propósito,
  igual que list-page.css — lo consumen 7 componentes distintos.
*/

.workspace-cabecera-entidad {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-2);
    margin-bottom: var(--space-4);
}

.workspace-titulo-entidad {
    font: var(--font-heading-sm);
    color: var(--color-text);
    margin: 0;
}

.workspace-subtitulo-entidad {
    font: var(--font-body-md);
    color: var(--color-text-muted);
}

.workspace-texto-notas {
    font: var(--font-body-md);
    color: var(--color-text);
    white-space: pre-wrap;
}

.workspace-nota-contextual {
    font: var(--font-body-sm);
    color: var(--color-text-muted);
    background-color: var(--color-bg);
    border: var(--border-default);
    border-radius: var(--radius-sm);
    padding: var(--space-3);
    margin-bottom: var(--space-3);
}

.workspace-grupo-campos {
    display: flex;
    flex-direction: column;
}

/* Subtítulo de una sub-sección dentro de una pestaña (p. ej. "Firmas del archivo" en Validación, "Firmas ya realizadas" en Firma). */
.workspace-subtitulo {
    font: var(--font-heading-sm);
    color: var(--color-text);
    margin: var(--space-4) 0 var(--space-2);
}

/*
  Tipografía cursiva para la firma "escrita" (el nombre tecleado se dibuja
  con esta fuente sobre el mismo <canvas> del trazo — ver firmaEnCampo.js,
  función escribirNombre). Autoalojada (TTF variable de Google Fonts,
  licencia OFL-1.1 en wwwroot/fonts/LICENSE-DancingScript.txt) — nada de
  CDN externo en tiempo de ejecución, mismo criterio que DejaVu Sans para
  PdfSharp.
*/
@font-face {
    font-family: 'Dancing Script';
    src: url('/fonts/DancingScript-Variable.ttf') format('truetype-variations');
    font-weight: 400 700;
    font-display: swap;
}

.firma-escrita-nombre {
    max-width: 500px;
}

/*
  Lienzo de captura del trazo manuscrito (firma en campo) — global y no
  aislado a un componente porque lo comparten FirmaEnCampoTab (pestaña
  "Firma" de un Documento) y MiFirma (/mi-firma, la firma habitual del
  usuario), ambos con firmaEnCampo.js.
*/
.firma-en-campo-lienzo {
    display: block;
    width: 100%;
    max-width: 500px;
    height: 200px;
    border: var(--border-default);
    border-radius: var(--radius-sm);
    background-color: var(--color-bg);
    cursor: crosshair;
    /* Sin esto, un dedo sobre el lienzo hace scroll de la página en vez de dibujar. */
    touch-action: none;
}

.firma-en-campo-lienzo.oculto {
    display: none;
}

.firma-guardada-vista-previa {
    max-width: 300px;
    max-height: 120px;
    border: var(--border-default);
    border-radius: var(--radius-sm);
    background-color: var(--color-bg);
}

/*
  Edición in situ de la pestaña "Información" (Centro 360 § 0.10) —
  Guardar/Cancelar bajo los campos editables, mismo alineado a la derecha
  que el pie de un Drawer.
*/
.workspace-acciones-edicion {
    display: flex;
    justify-content: flex-end;
    gap: var(--space-2);
    margin-top: var(--space-3);
}

.workspace-metrica-inline {
    font: var(--font-body-sm);
    color: var(--color-text-muted);
    margin: var(--space-1) 0 0;
}

.workspace-lista-requisitos {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.workspace-tarjeta-requisito {
    border: var(--border-default);
    border-radius: var(--radius-md);
    padding: var(--space-3);
}

.workspace-tarjeta-requisito-cabecera {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
    font: var(--font-body-md);
    font-weight: 600;
    color: var(--color-text);
}

.workspace-tarjeta-requisito-acciones {
    display: flex;
    gap: var(--space-2);
    margin-top: var(--space-2);
}

.workspace-cabecera-seccion {
    display: flex;
    justify-content: flex-end;
    margin-bottom: var(--space-3);
}