/* animacoes.css — micro-interações e animações fluidas do portal do cliente.
   Respeita 'prefers-reduced-motion' (acessibilidade). */

/* Entrada suave de elementos (aplicar .anim-in; revela ao entrar na tela via JS .is-visible) */
.anim-in {
    opacity: 0;
    transform: translateY(14px);
    transition: opacity .5s ease, transform .5s cubic-bezier(.22, 1, .36, 1);
    will-change: opacity, transform;
}
.anim-in.is-visible {
    opacity: 1;
    transform: translateY(0);
}
/* atraso em cascata para grupos (use .anim-in com style="--d:1..n") */
.anim-in { transition-delay: calc(var(--d, 0) * 70ms); }

/* Elevação suave em cards clicáveis */
.hover-lift {
    transition: transform .25s cubic-bezier(.22, 1, .36, 1), box-shadow .25s ease;
}
.hover-lift:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 40px -12px rgba(0, 0, 0, .22);
}

/* Botões com leve "press" ao clicar */
.btn-press { transition: transform .12s ease, filter .15s ease; }
.btn-press:hover { filter: brightness(1.03); }
.btn-press:active { transform: scale(.96); }

/* Linhas de tabela: realce suave ao passar */
.row-anim { transition: background-color .2s ease; }

/* Skeleton shimmer (para estados de carregamento) */
.skeleton {
    background: linear-gradient(90deg, rgba(148,163,184,.15) 25%, rgba(148,163,184,.30) 37%, rgba(148,163,184,.15) 63%);
    background-size: 400% 100%;
    animation: skeleton-shimmer 1.4s ease infinite;
    border-radius: .5rem;
}
@keyframes skeleton-shimmer { 0% { background-position: 100% 0; } 100% { background-position: 0 0; } }

/* Spinner simples */
.spinner {
    width: 1.15rem; height: 1.15rem; border: 2px solid rgba(255,255,255,.4);
    border-top-color: #fff; border-radius: 50%; animation: spin .7s linear infinite; display: inline-block;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* Pulso sutil (para chamar atenção, ex.: badge/alerta) */
.pulse-soft { animation: pulse-soft 2.4s ease-in-out infinite; }
@keyframes pulse-soft { 0%,100% { opacity: 1; } 50% { opacity: .55; } }

/* Fade de entrada da página inteira */
.page-fade { animation: page-fade .45s ease both; }
@keyframes page-fade { from { opacity: 0; } to { opacity: 1; } }

/* Barra de rolagem fina/arredondada no estilo do site (claro/escuro) */
.scroll-fino { scrollbar-width: thin; scrollbar-color: #cbd5e1 transparent; }
.dark .scroll-fino { scrollbar-color: #475569 transparent; }
.scroll-fino::-webkit-scrollbar { width: 10px; height: 10px; }
.scroll-fino::-webkit-scrollbar-track { background: transparent; }
.scroll-fino::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 999px; border: 2px solid transparent; background-clip: content-box; }
.scroll-fino::-webkit-scrollbar-thumb:hover { background: #94a3b8; background-clip: content-box; }
.dark .scroll-fino::-webkit-scrollbar-thumb { background: #475569; background-clip: content-box; }
.dark .scroll-fino::-webkit-scrollbar-thumb:hover { background: #64748b; background-clip: content-box; }

/* Popover do tour (driver.js) no estilo do site */
.driver-popover.gm-tour {
    background: #fff; color: #334155; border-radius: 1rem;
    box-shadow: 0 20px 45px -12px rgba(0,0,0,.28); border: 1px solid #e2e8f0;
}
.driver-popover.gm-tour .driver-popover-title { color: #0f172a; font-weight: 700; }
.driver-popover.gm-tour .driver-popover-description { color: #475569; }
.driver-popover.gm-tour .driver-popover-progress-text { color: #94a3b8; }
.driver-popover.gm-tour .driver-popover-navigation-btns button {
    background: #008ace; color: #fff; border: 0; border-radius: .55rem; padding: .35rem .9rem;
    text-shadow: none; font-weight: 600;
}
.driver-popover.gm-tour .driver-popover-navigation-btns button:hover { background: #006da3; }
.driver-popover.gm-tour .driver-popover-close-btn { color: #94a3b8; }
.driver-popover.gm-tour .driver-popover-arrow { border-color: #fff; }
.dark .driver-popover.gm-tour {
    background: #1e293b; color: #cbd5e1; border-color: #334155;
}
.dark .driver-popover.gm-tour .driver-popover-title { color: #f1f5f9; }
.dark .driver-popover.gm-tour .driver-popover-description { color: #94a3b8; }
.dark .driver-popover.gm-tour .driver-popover-arrow-side-left.driver-popover-arrow,
.dark .driver-popover.gm-tour .driver-popover-arrow-side-right.driver-popover-arrow,
.dark .driver-popover.gm-tour .driver-popover-arrow-side-top.driver-popover-arrow,
.dark .driver-popover.gm-tour .driver-popover-arrow-side-bottom.driver-popover-arrow { border-color: #1e293b; }

@media (prefers-reduced-motion: reduce) {
    .anim-in, .hover-lift, .btn-press, .skeleton, .spinner, .pulse-soft, .page-fade {
        animation: none !important;
        transition: none !important;
        opacity: 1 !important;
        transform: none !important;
    }
}

/* Esconde o "olho" nativo do navegador nos campos de senha (usamos um botão custom) */
.senha-input::-ms-reveal,
.senha-input::-ms-clear { display: none !important; }
.senha-input::-webkit-credentials-auto-fill-button,
.senha-input::-webkit-strong-password-auto-fill-button,
.senha-input::-webkit-contacts-auto-fill-button { visibility: hidden; display: none !important; pointer-events: none; }
