/* ===============================
   Botões principais
   =============================== */

.btn-primary {
    background-color: #dc0220 !important;
    border-color: #dc0220 !important;
}

    .btn-primary:hover,
    .btn-primary:focus {
        background-color: #a30000 !important;
        border-color: #a30000 !important;
    }

/* ===============================
   Navbar
   =============================== */

.navbar .nav-link {
    color: #fff;
}

@media (max-width: 991.98px) {
    .navbar .btn-outline-light {
        margin-top: .3rem;
    }
}

/* ===============================
   Dropdown
   =============================== */

.dropdown-menu {
    background: #fff;
}

.dropdown-item {
    color: #212529 !important;
}

    .dropdown-item:hover,
    .dropdown-item:focus {
        background: #e9ecef; /* hover mais escuro */
        color: #000 !important;
    }

.dropdown-header-compact {
    padding: .85rem 1rem;
    background: #f8f9fa;
    border-bottom: 1px solid #e9ecef;
}

    .dropdown-header-compact .name {
        font-weight: 700;
        font-size: .95rem;
    }

    .dropdown-header-compact .email {
        font-size: .85rem;
        color: #6c757d;
        word-break: break-all;
    }

.user-meta small {
    color: #6c757d;
}

.user-meta div + div {
    margin-top: .35rem;
}

/* ===============================
   Botões pequenos (uso específico)
   =============================== */

.btn.btn-sm {
    width: 31px;
    height: 31px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    font-size: 10px;
}

/* ===============================
   Avatar do usuário (FORÇADO)
   =============================== */

/* Regras base (com !important para evitar sobrescritas) */
.user-avatar {
    width: 42px !important;
    height: 42px !important;
    flex: 0 0 42px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    background-color: #cc0000 !important; /* vermelho */
    color: #fff !important;
    margin-left: .3rem; /* respiro à esquerda */
    overflow: hidden; /* garante o círculo visual */
}

    /* Ícone no avatar do topo */
    .user-avatar i {
        font-size: 18px !important;
        line-height: 1 !important;
        color: #fff !important;
    }

/* Iniciais dentro do avatar (dropdown) */
.avatar-initials {
    color: #fff !important;
    font-weight: 700 !important;
    font-size: 18px !important;
    letter-spacing: .5px !important;
    line-height: 1 !important;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

    .avatar-initials::selection {
        background: transparent;
    }

/* ESPECIFICIDADE extra:
   - avatar no gatilho do menu (topo)
   - avatar dentro do cabeçalho do dropdown */
#userMenu .user-avatar {
    background-color: #cc0000 !important;
}

.dropdown-menu .dropdown-header-compact .user-avatar {
    background-color: #cc0000 !important;
    margin-left: .2rem !important;
    margin-right: .50rem !important;
}

/* Evita highlight/outline no botão do usuário */
#userMenu,
#userMenu:focus,
#userMenu:active,
#userMenu:focus-visible {
    background: transparent !important;
    box-shadow: none !important;
    outline: none !important;
    -webkit-tap-highlight-color: transparent;
}
.btn-auto {
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
    padding: .25rem .5rem !important; /* igual ao btn-sm */
    line-height: 1.2 !important;
}
.form-check-input.locked {
    pointer-events: none;
    opacity: .6;
}

/* Separador vertical entre a marca DocControl e os menus */
.brand-divider {
    display: inline-block;
    width: 1px;
    height: 28px;
    background-color: rgba(255, 255, 255, 0.4);
    margin-right: 1rem;
    vertical-align: middle;
}

/* Ajuste geral do nome */
header .fw-semibold {
    font-weight: 700 !important;
    letter-spacing: 0.3px;
}

/* Esconde o separador no mobile */
@media (max-width: 991.98px) {
    .brand-divider {
        display: none;
    }
}