:root {
    /* Paleta principal extraída da marca (logo Instituto Fazendo a Diferença) */
    --brand-primary: #a8431c;
    --brand-primary-dark: #832f12;
    --brand-primary-light: #f4e2da;

    --menu-bg: #ffffff;
    --menu-fg: #4a2f24;
    --menu-fg-muted: #8a6a5c;
    --menu-hover-bg: var(--brand-primary-light);
    --menu-active-bg: var(--brand-primary);
    --menu-active-fg: #fff;
    --menu-border: rgba(168, 67, 28, 0.15);
}

.app-nav {
    background: var(--menu-bg);
    border-bottom-color: var(--menu-border) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

.app-nav .app-nav-link,
.app-nav .dropdown-item {
    cursor: pointer;
}

.app-nav .app-nav-link {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    color: var(--menu-fg);
    text-decoration: none;
    border-radius: .375rem;
    padding: .5rem .9rem;
    font-weight: 500;
    transition: background-color .15s ease-in-out, color .15s ease-in-out;
}

.app-nav .app-nav-link:hover,
.app-nav .app-nav-link:focus {
    background-color: var(--menu-hover-bg);
    color: var(--brand-primary-dark);
    text-decoration: none;
}

.app-nav .app-nav-link[data-active="true"] {
    background-color: var(--menu-active-bg);
    color: var(--menu-active-fg);
}

.app-nav .app-nav-link[data-active="true"]:hover {
    background-color: var(--brand-primary-dark);
    color: var(--menu-active-fg);
}

.app-nav .dropdown-item.small {
    padding-top: .5rem;
    padding-bottom: .5rem;
}

.app-nav .dropdown-item.small:hover,
.app-nav .dropdown-item.small:focus {
    background-color: var(--menu-hover-bg);
    color: var(--brand-primary-dark);
}

.app-nav .dropdown-item.small.active {
    background-color: var(--brand-primary);
    color: #fff;
}

.app-nav .dropdown-menu {
    border-color: var(--menu-border);
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, 0.1);
}

.app-nav .navbar-toggler {
    cursor: pointer;
    border-color: var(--menu-border);
}

.app-nav-user-name {
    font-weight: 600;
    color: var(--menu-fg);
}

.app-nav-user-email {
    color: var(--menu-fg-muted);
    font-size: .85rem;
}

/* Responsividade: menu colapsado em telas pequenas vira lista de toque, alvo minimo 44px */
@media (max-width: 991.98px) {
    .app-nav .navbar-collapse {
        max-height: calc(100vh - 64px);
        overflow-y: auto;
    }

    .app-nav .app-nav-link {
        width: 100%;
        padding: .75rem .9rem;
    }

    .app-nav .dropdown-menu {
        border: none;
        box-shadow: none;
        background: var(--brand-primary-light);
        margin: 0 0 .5rem .5rem;
    }

    .app-nav .dropdown-item.small {
        padding: .75rem 1rem;
    }

    .app-nav .navbar-nav {
        width: 100%;
    }

    .app-nav .dropdown-menu.dropdown-menu-lg-right {
        width: 100%;
    }
}

.home-background {
    background: url('/img/atka_fundo_login.jpg') no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}
.loader-ajax {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0px;
    top: 0px;
    background-color: #000;
    opacity: 0.5;
    z-index: 2;
}
