/* ============================================================================
   BLOCO: tokens visuais minimos compartilhados (sem layout)
   ----------------------------------------------------------------------------
   Somente variaveis de design e o estilo dos componentes transversais
   (toasts). PROIBIDO conter layout de pagina (seccao 5 do prompt mestre):
   o layout pertence a camada de templates de cada painel.
   ============================================================================ */

:root {
    /* Cores semanticas da plataforma */
    --g10dns_cor_sucesso: #1e7e34;        /* verde: operacao validada/salva */
    --g10dns_cor_sucesso_fundo: #e6f4ea;
    --g10dns_cor_erro: #b02a37;           /* vermelho: falha */
    --g10dns_cor_erro_fundo: #fdecea;
    --g10dns_cor_aviso: #b8860b;
    --g10dns_cor_texto: #1f2933;
    --g10dns_cor_texto_claro: #ffffff;

    /* Tipografia e espacamento base */
    --g10dns_fonte: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --g10dns_raio_borda: 6px;
    --g10dns_sombra: 0 4px 12px rgba(0, 0, 0, 0.15);
}

/* ----------------------------------------------------------------------------
   BLOCO: toasts (canto superior direito)
   ---------------------------------------------------------------------------- */

/* Conteiner fixo no canto SUPERIOR DIREITO (convencao da seccao 4). */
#g10dns_toasts {
    position: fixed;
    top: 16px;
    right: 16px;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-width: 360px;
    font-family: var(--g10dns_fonte);
}

/* Caixa individual do toast. */
.g10dns_toast {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 14px;
    border-radius: var(--g10dns_raio_borda);
    box-shadow: var(--g10dns_sombra);
    color: var(--g10dns_cor_texto_claro);
    font-size: 0.95rem;
    line-height: 1.35;
    animation: g10dns_toast_entrada 0.25s ease-out;
}

/* VERDE: operacao validada/salva. */
.g10dns_toast_sucesso {
    background: var(--g10dns_cor_sucesso);
}

/* VERMELHO: falha na operacao. */
.g10dns_toast_erro {
    background: var(--g10dns_cor_erro);
}

/* Botao de fechar manual. */
.g10dns_toast_fechar {
    flex-shrink: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font-size: 1.1rem;
    line-height: 1;
    cursor: pointer;
    opacity: 0.8;
}

.g10dns_toast_fechar:hover,
.g10dns_toast_fechar:focus {
    opacity: 1;
}

/* Transicoes de entrada e saida. */
.g10dns_toast_saindo {
    opacity: 0;
    transform: translateX(24px);
    transition: opacity 0.3s ease-in, transform 0.3s ease-in;
}

@keyframes g10dns_toast_entrada {
    from {
        opacity: 0;
        transform: translateX(24px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}