/**
 * CSS para Sistema de Whitelabel - Mouv
 * Controla a transição suave dos elementos durante o carregamento do whitelabel
 */

/* OCULTA ELEMENTOS SENSÍVEIS POR PADRÃO - ANTI-FLASH */
.navbar-logo img,
.footer-logo,
#login-form-logo,
#login-img-logo,
#app-logo,
#mobile-nav-logo,
#loading-screen img,
img[src*="logo-full.svg"],
#logo-img {
    /* OCULTA POR PADRÃO - será mostrado pelo JavaScript */
    opacity: 0 !important;
    transition: opacity 0.3s ease-in-out;
}

/* Estado de carregamento do whitelabel */
.whitelabel-loading {
    /* Adiciona uma transição suave para todo o body */
    transition: all 0.2s ease-in-out;
}

/* MOSTRA ELEMENTOS APÓS WHITELABEL SER APLICADO */
.whitelabel-ready .navbar-logo img,
.whitelabel-ready .footer-logo,
.whitelabel-ready #login-form-logo,
.whitelabel-ready #login-img-logo,
.whitelabel-ready #app-logo,
.whitelabel-ready #mobile-nav-logo,
.whitelabel-ready #loading-screen img,
.whitelabel-ready img[src*="logo-full.svg"],
.whitelabel-ready #logo-img {
    opacity: 1 !important;
}

/* Melhora a transição do favicon */
link[rel="icon"] {
    transition: all 0.1s ease-in-out;
}

/* Adiciona um indicador visual sutil durante o carregamento (opcional) */
.whitelabel-loading::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background: linear-gradient(90deg, #007bff, #28a745);
    z-index: 9999;
    animation: whitelabel-loading-bar 0.5s ease-in-out;
}

@keyframes whitelabel-loading-bar {
    0% {
        width: 0%;
    }

    100% {
        width: 100%;
    }
}

/* Remove o indicador após o carregamento */
body:not(.whitelabel-loading)::before {
    display: none;
}

/* Melhora a experiência em dispositivos móveis */
@media (max-width: 768px) {

    .navbar-logo img,
    #mobile-nav-logo {
        transition: opacity 0.15s ease-in-out;
    }
}

/* Garante que o título da página também tenha transição suave */
title {
    transition: all 0.1s ease-in-out;
}