.tabela-container {
        overflow-x: auto;
        max-height: calc(100vh - 300px);
        /* Ajusta conforme a altura dos seus cards + header */
        position: relative;
    }

    .tabela-container::-webkit-scrollbar {
        height: 10px;
    }

    .tabela-container::-webkit-scrollbar-thumb {
        background: #888;
        border-radius: 5px;
    }

    .tabela-container::-webkit-scrollbar-thumb:hover {
        background: #555;
    }

    /* Mantém a barra fixa no fundo da viewport */
    .scroll-wrapper {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        background: #fff;
        padding: 5px 10px;
        border-top: 1px solid #ddd;
        z-index: 999;
    }

    :root {
        --marrom: #C4645F;
        --vermelho: #B91710;
        --azul: #1B1B43;
        --azul-escuro: #0A0A24;
    }

    html {
        scroll-behavior: smooth;
        height: -webkit-fill-available;
    }

    body {
        font-family: "Montserrat", sans-serif !important;
        font-optical-sizing: auto !important;
        font-weight: 400 !important;
        font-style: normal !important;
        min-height: 100vh;
        min-height: -webkit-fill-available;
    }

    .fundo {
        background-position: center !important;
        background-size: cover;
        background-repeat: no-repeat;
        background-image: url(../img/fundo.webp) !important;
        min-height: 100vh;
    }

    /* celular (default) */
    #form-login {
        min-width: 50vh;
        /* opcional para evitar overflow em telas pequenas */
        max-width: 95vw;
    }

    #form-login .form-control::placeholder,
    #form-login input::placeholder,
    #form-login textarea::placeholder {
        color: #000000;
        font-weight: 700;
        /* negrito */
        opacity: 1;
        /* opcional: Bootstrap deixa mais "apagado" */
    }

    /* Prefixos (compatibilidade extra) */
    #form-login .form-control::-webkit-input-placeholder {
        font-weight: 700;
    }

    #form-login .form-control::-ms-input-placeholder {
        font-weight: 700;
    }

    /* Edge antigo */
    #form-login .form-control:-ms-input-placeholder {
        font-weight: 700;
    }

    /* IE */

    /* desktop (>= lg do Bootstrap, 992px) */
    @media (min-width: 992px) {
        #form-login {
            min-width: 35vh;
            max-width: none;
            /* opcional: libera no desktop */
        }
    }


    main {
        height: 100vh;
        height: -webkit-fill-available;
        max-height: 100vh;
        overflow-x: auto;
        overflow-y: hidden;
    }

    #main-content {
        width: 100%;
        overflow-x: auto;
        background-color: #f9f9f9 !important;
    }

    html body .text-danger {
        color: var(--vermelho) !important;
    }

    .btn-danger {
        background-color: var(--vermelho) !important;
    }

    .btn-danger:hover {
        background-color: var(--vermelho) !important;
    }

    .btn-outline-danger {
        color: var(--vermelho) !important;
    }

    .btn-outline-danger:hover {
        background-color: var(--vermelho) !important;
        color: #ffffff !important;
    }

    code {
        color: var(--vermelho) !important;
    }


    .fonte-1 {
        font-family: "Manrope", sans-serif;
        font-optical-sizing: auto;
        font-weight: 500;
        font-style: normal;
    }

    .dropdown-item:hover {
        background-color: var(--vermelho) !important;
        color: white !important;
    }

    .form-check-input:checked {
        background-color: var(--vermelho) !important;
        border-color: var(--vermelho) !important;
    }

    .nav-link:hover {
        background-color: var(--vermelho) !important;
        color: white !important;
    }

    .nav-pills .nav-link {
        color: var(--vermelho) !important;
        background-color: #ffffff;
    }

    .nav-pills .nav-link:hover {
        color: #ffffff !important;
    }

    .nav-pills .nav-link.active,
    .nav-pills .show>.nav-link {
        color: #ffffff !important;
        background-color: var(--vermelho) !important;
    }

    .img-perfil {
        width: 100%;
        height: auto;
        max-width: 120px;
    }

    .loading-overlay {
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        background-color: rgba(0, 0, 0, 0.6);
        /* fundo escurecido */
        backdrop-filter: blur(2px);
        /* leve desfoque */
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 1050;
        /* acima de quase tudo */
    }

    /* Sidebar padrão: 280px */
    .sidebar {
        width: 280px;
        flex: 0 0 280px;
        min-height: 100dvh;
        border-right: 1px solid rgba(255, 255, 255, 0.08);
        overflow-y: auto;
        background-color: var(--azul-escuro) !important;
        box-shadow: 18px 0 40px rgba(10, 10, 36, 0.12);
        transition: margin-left 0.3s ease, box-shadow 0.3s ease;
    }

    .sidebar-header {
        position: relative;
        gap: 0.75rem;
    }

    .sidebar-toggle {
        width: 42px;
        height: 42px;
        flex: 0 0 42px;
        border-radius: 12px !important;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background-color: rgba(255, 255, 255, 0.96) !important;
        border-color: rgba(185, 23, 16, 0.15) !important;
        box-shadow: 0 10px 30px rgba(10, 10, 36, 0.2);
        transition: transform 0.25s ease, box-shadow 0.25s ease, background-color 0.25s ease;
    }

    .sidebar-toggle-icon {
        font-size: 1rem;
        line-height: 1;
        /* transform: rotate(90deg); */
    }

    .sidebar-toggle-external {
        position: fixed;
        top: 1rem;
        left: 1rem;
        z-index: 1061;
        display: none;
    }

    .sidebar-toggle[hidden] {
        display: none !important;
    }

    .sidebar-toggle:hover {
        transform: translateY(-1px);
        box-shadow: 0 14px 34px rgba(10, 10, 36, 0.24);
    }

    .sidebar-backdrop {
        position: fixed;
        inset: 0;
        background: rgba(10, 10, 36, 0.45);
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.3s ease-in-out;
        z-index: 1049;
    }

    /* No mobile, esconde a sidebar por padrão */
    @media (max-width: 768px) {
        .sidebar {
            position: fixed;
            left: -280px;
            top: 0;
            height: 100%;
            z-index: 1050;
            transition: left 0.3s ease-in-out;
            /* box-shadow: 16px 0 36px rgba(0, 0, 0, 0.22); */
        }

        .sidebar.active {
            left: 0;
        }

        .sidebar-toggle-external {
            display: inline-flex;
        }

        .sidebar-backdrop.active {
            opacity: 1;
            pointer-events: auto;
        }

        #main-content {
            padding-left: 0 !important;
            padding-top: 4.5rem;
        }
    }

    @media (min-width: 769px) {
        .sidebar {
            position: relative !important;
            left: 0 !important;
            top: 0;
            flex-shrink: 0;
            box-shadow: none !important;
        }

        body.sidebar-collapsed .sidebar {
            margin-left: -280px;
            box-shadow: none !important;
        }

        body.sidebar-collapsed .sidebar-toggle-external {
            display: inline-flex;
        }

        #main-content {
            min-width: 0;
            padding-top: 0;
        }

        .sidebar-backdrop {
            display: none !important;
        }
    }


    .sticky-col {
        position: sticky;
        left: 0;
        z-index: 2;
    }

    /* Para o <th> ter prioridade no cabeçalho */
    thead .sticky-col {
        z-index: 3;
    }

    .selecionadas:hover {
        color: white !important;
    }