/*
 * Posicionador de assinatura do GED (ged-documentos, 2026-08-10) — crh-ged-sign-place.js.
 * Folha estática versionada (docs/css.md): carregada como asset do painel (FilamentAsset) E no
 * layout público (components/layouts/app.blade.php) — os dois lugares onde se assina.
 * Tokens --crh-* com fallback neutro; funciona nos dois temas.
 */

.crh-signplace {
    display: block;
}

/* Duas linhas (pedido 2026-08-10, mobile): a DICA ocupa a largura toda em cima; a navegação de
   páginas vem centrada embaixo — antes a dica espremia numa coluna estreita ao lado dos botões. */
.crh-signplace__bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    margin-bottom: 0.375rem;
    font-size: 0.75rem;
    color: var(--crh-text-muted, #64748b);
}

.crh-signplace__nav {
    border: 1px solid rgba(100, 116, 139, 0.4);
    border-radius: 0.375rem;
    padding: 0 0.875rem;
    line-height: 1.75rem;
    font-size: 1rem;
    background: transparent;
    color: inherit;
    cursor: pointer;
}

.crh-signplace__nav:disabled {
    opacity: 0.4;
    cursor: default;
}

.crh-signplace__pageinfo {
    min-width: 6.5rem;
    text-align: center;
    white-space: nowrap;
}

.crh-signplace__hint {
    order: -1;
    flex: 1 1 100%;
    margin: 0 0 0.25rem;
    text-align: center;
}

.crh-signplace__stage {
    position: relative;
    border: 1px solid rgba(100, 116, 139, 0.35);
    border-radius: 0.5rem;
    overflow: hidden;
    cursor: crosshair;
    background: #fff; /* papel: o documento é sempre claro, nos dois temas */
}

.crh-signplace__stage canvas,
.crh-signplace__stage img {
    display: block;
    width: 100%;
    height: auto;
    user-select: none;
    -webkit-user-drag: none;
}

.crh-signplace__marker {
    position: absolute;
    transform: translate(-50%, -50%);
    width: 30%;
    aspect-ratio: 3 / 1;
    display: none;
    align-items: center;
    justify-content: center;
    border: 2px dashed var(--crh-primary, #2563eb);
    border-radius: 0.375rem;
    background: rgba(37, 99, 235, 0.08);
    color: var(--crh-primary, #2563eb);
    font-size: 0.7rem;
    font-weight: 600;
    /* Arrastável (2026-08-10): recebe pointer events; touch-action none evita rolar a página
       durante o arrasto no toque. */
    cursor: grab;
    touch-action: none;
    user-select: none;
}

.crh-signplace__marker.is-visible {
    display: flex;
}

.crh-signplace__marker.is-dragging {
    cursor: grabbing;
    background: rgba(37, 99, 235, 0.16);
}

/* Assinatura JÁ coletada de outra parte (2026-08-10): caixa-fantasma informativa na posição real —
   o próximo signatário vê o que está ocupado e assina ao lado. Nunca interativa. */
.crh-signplace__ghost {
    position: absolute;
    transform: translate(-50%, -50%);
    width: 30%;
    aspect-ratio: 3 / 1;
    display: none;
    align-items: center;
    justify-content: center;
    text-align: center;
    border: 2px solid rgba(22, 163, 74, 0.55);
    border-radius: 0.375rem;
    background: rgba(22, 163, 74, 0.08);
    color: #15803d;
    font-size: 0.65rem;
    font-weight: 600;
    pointer-events: none;
}

.crh-signplace__ghost.is-visible {
    display: flex;
}

/* Fallback sem PDF.js: visualizador nativo (sem clique) — o serviço posiciona no rodapé. */
.crh-signplace__stage--fallback {
    cursor: default;
}

.crh-signplace__frame {
    display: block;
    width: 100%;
    height: 420px;
    border: 0;
}