/* =======================
          Pesos de fonte auxiliares
           ======================= */
        .thin-text      { font-weight: 100; }
        .thin-italic    { font-weight: 100; font-style: italic; }
        .extralight-text{ font-weight: 200; }
        .bold-italic    { font-weight: 700; font-style: italic; }
        .black          { font-weight: 900; }

        /* =======================
           Reset / Global
           ======================= */
        :root {
            --app-navbar-offset: 50px;
        }

        /* 1) Aplica BRSonoma a todo o texto padrão */
        body {
            font-family: 'BRSonoma', sans-serif;
            background-color: #F2F2F2;
            color: #0F0F0F;
            padding-top: var(--app-navbar-offset, 50px);
            margin: 0;
        }
        /* 2) Garante BRSonoma em pseudo-elementos e componentes que tentem sobrescrever */
        *,
        *::before,
        *::after {
            font-family: 'BRSonoma', sans-serif !important;
        }

        /* =======================
           Navbar
           ======================= */
        .navbar {
            background-color: #D8D8D8;
            position: fixed; top: 0; left: 0; right: 0;
            z-index: 1000;
            min-height: 46px;
            height: auto;
            padding: 0 1rem;
        }
        .navbar .container-fluid {
            display: flex;
            align-items: center;
            justify-content: space-between;
            flex-wrap: nowrap;
        }
        .navbar .container-fluid > * {
            margin-bottom: 4px;
        }
        .navbar-brand,
        #menuToggle {
            flex: 0 0 auto;
            display: flex;
            align-items: center;
        }
        .logo {
            margin-right: 1rem;
        }
        .navbar .center-block {
            position: absolute;
            left: 50%;
            transform: translateX(-50%);
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            height: 100%;
            flex: 1;
            text-align: center;
        }

        /* =======================
           Botão Menu
           ======================= */
        #menuToggle {
            background: none;
            border: none;
            cursor: pointer;
            margin-right: 0;   /* mesma margem da logo */
            height: 46px;          /* centraliza verticalmente */
            display: flex;
            align-items: center;
            padding: 0;
        }
        .menu-icon {
            display: flex;
            flex-direction: column;
            justify-content: center;
        }
        .menu-icon-bar {
            width: 30px;
            height: 3px;           /* mais grossas */
            background-color: #142F5B;
            margin-bottom: 4px;    /* espaço interno */
            transition: background-color 0.3s;
            position: relative;
            top: -2px;
        }
        .menu-icon-bar:last-child {
            margin-bottom: 0;
        }
        .menu-text {
            margin-left: 6px;      /* espaçamento menor */
            color: #142F5B;        /* mesma cor da logo */
            font-weight: 500;      /* semi-bold */
            text-transform: none;
        }

        /* =======================
           Desktop tweaks (≥576px)
           ======================= */
        @media (min-width: 576px) {
            .navbar {
                padding-top: 0;
                padding-bottom: 0;
            }
            .navbar .container-fluid > * {
                margin-bottom: 0;
            }
            .navbar .center-block {
                height: 46px;
                display: flex;
                flex-direction: column;
                justify-content: center;
            }
            .navbar .center-block .black {
                margin-bottom: 4px;
            }
        }

        /* =======================
           Mobile tweaks (<576px)
           ======================= */
           @media (max-width: 575.98px) {
            .navbar {
                padding: 0.5rem 1rem;
            }
            .navbar .container-fluid {
                flex-wrap: wrap;
                justify-content: center !important;
            }

            .navbar .center-block {
                position: static !important;
                left: auto !important;
                transform: none !important;
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                width: 100%;
                margin: 0.25rem 0;
                white-space: normal;
                text-align: center !important;
            }

            .navbar .center-block > div {
                text-align: center !important;
                width: 100%;
            }

            .navbar .center-block .black {
                margin-bottom: 4px;
            }
        }

        /* =======================
           Sidebar
           ======================= */
        .sidebar {
            display: none;
            position: fixed;
            top: var(--app-navbar-offset, 46px);
            right: 0;
            width: 300px;
            height: 100%;
            background-color: #142F5B;
            box-shadow: 0 0 15px #0F0F0F;
            padding: 15px;
            z-index: 1500;
        }
        .sidebar .menu-item a {
            color: #F2F2F2;
            text-decoration: none;
        }
        .menu-item, .submenu a {
            display: block;
            color: #F2F2F2;
            text-decoration: none;
            padding: 8px 15px;
            margin-bottom: 2px;
            transition: background-color 0.3s;
            cursor: pointer;
        }
        .sidebar .menu-item > a,
        .sidebar .menu-item > .menu-action-btn {
            display: flex;
            align-items: center;
            justify-content: flex-start;
            width: 100%;
            text-align: left;
        }
        .sidebar .menu-item i,
        .menu-action-btn i {
            margin-right: 10px;
        }
        .menu-action-btn {
            background: none;
            border: none;
            padding: 0;
            width: 100%;
            text-align: left;
            display: flex;
            align-items: center;
            justify-content: flex-start;
            color: #F2F2F2;
        }
        .menu-item:hover, .submenu a:hover {
            background-color: #4E586D;
        }
        .submenu {
            margin-left: 20px;
            display: none;
        }

        /* =======================
           Containers
           ======================= */
        .container, .container-fluid,
        .container-lg, .container-md,
        .container-sm, .container-xl {
            padding: 0;
        }
        .container-fluid-main {
            padding: 15px;
            margin-top: 20px;
        }

        /* =======================
           Menu text & labels
           ======================= */
        .menu-label {
            display: block;
            color: #F2F2F2;
            padding: 8px 15px;
            margin-bottom: 10px;
            font-weight: bold;
        }

        /* =======================
           Tooltips
           ======================= */
        .fa-question-circle,
        .fa-info-circle {
            color: #2D6479;
            cursor: pointer;
        }
        .tooltip-inner {
            background-color: #2D6479;
            color: #F2F2F2;
        }
        .tooltip.bs-tooltip-top .arrow::before {
            border-top-color: #2D6479;
        }

        /* =======================
           Table
           ======================= */
        .table {
            margin-bottom: 0;
        }

        /* =======================
           Buttons
           ======================= */
        .btn {
            margin: 5px 0;
            background-color: transparent;
            transition: background-color 0.18s ease, color 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
            box-shadow: none;
            font-weight: 500;
        }
        .btn:hover,
        .btn:focus {
            box-shadow: none;
        }
        .btn.disabled,
        .btn:disabled {
            opacity: 0.55;
            box-shadow: none;
        }

        .btn.btn-primary,
        .btn.btn-outline-primary,
        .btn.btn-info,
        .btn.btn-outline-info {
            background-color: transparent;
            border-color: #2D6479;
            color: #2D6479;
        }
        .btn.btn-primary:hover,
        .btn.btn-primary:focus,
        .btn.btn-outline-primary:hover,
        .btn.btn-outline-primary:focus,
        .btn.btn-info:hover,
        .btn.btn-info:focus,
        .btn.btn-outline-info:hover,
        .btn.btn-outline-info:focus {
            background-color: #2D6479;
            border-color: #2D6479;
            color: #F2F2F2;
        }

        .btn.btn-secondary,
        .btn.btn-outline-secondary {
            background-color: transparent;
            border-color: #626166;
            color: #626166;
        }
        .btn.btn-secondary:hover,
        .btn.btn-secondary:focus,
        .btn.btn-outline-secondary:hover,
        .btn.btn-outline-secondary:focus {
            background-color: #626166;
            border-color: #626166;
            color: #F2F2F2;
        }

        .btn.btn-success,
        .btn.btn-outline-success {
            background-color: transparent;
            border-color: #2F7D46;
            color: #2F7D46;
        }
        .btn.btn-success:hover,
        .btn.btn-success:focus,
        .btn.btn-outline-success:hover,
        .btn.btn-outline-success:focus {
            background-color: #2F7D46;
            border-color: #2F7D46;
            color: #F2F2F2;
        }

        .btn.btn-danger,
        .btn.btn-outline-danger {
            background-color: transparent;
            border-color: #8F2230;
            color: #8F2230;
        }
        .btn.btn-danger:hover,
        .btn.btn-danger:focus,
        .btn.btn-outline-danger:hover,
        .btn.btn-outline-danger:focus {
            background-color: #8F2230;
            border-color: #8F2230;
            color: #F2F2F2;
        }

        .btn.btn-warning,
        .btn.btn-outline-warning {
            background-color: transparent;
            border-color: #9A6A00;
            color: #9A6A00;
        }
        .btn.btn-warning:hover,
        .btn.btn-warning:focus,
        .btn.btn-outline-warning:hover,
        .btn.btn-outline-warning:focus {
            background-color: #9A6A00;
            border-color: #9A6A00;
            color: #F2F2F2;
        }

        .btn.btn-dark,
        .btn.btn-outline-dark {
            background-color: transparent;
            border-color: #0F0F0F;
            color: #0F0F0F;
        }
        .btn.btn-dark:hover,
        .btn.btn-dark:focus,
        .btn.btn-outline-dark:hover,
        .btn.btn-outline-dark:focus {
            background-color: #0F0F0F;
            border-color: #0F0F0F;
            color: #F2F2F2;
        }

        /* =======================
           Nav-tabs
           ======================= */
        .nav-tabs .nav-link {
            border: 1px solid #D8D8D8;
            border-top-left-radius: .25rem;
            border-top-right-radius: .25rem;
            background-color: #F2F2F2 !important;
            color: #626166 !important;
        }
        .nav-tabs .nav-link.active {
            background-color: #D8D8D8 !important;
            color: #0F0F0F !important;
        }
        .nav-tabs .nav-link:hover {
            color: #0F0F0F !important;
        }

        /* =======================
           Tab content & Pagination
           ======================= */
        .tab-content {
            margin-top: 20px;
        }
        .pagination .page-link {
            background-color: #868686;
            color: #F2F2F2;
        }
        .pagination .page-link:hover {
            background-color: #626166;
            color: #F2F2F2;
        }

        /* ==============================
           Forçar Font Awesome nos ícones
           ============================== */
        /* Free Solid (fas) */
        .fas,
        .fas::before {
            font-family: "Font Awesome 6 Free" !important;
            font-weight: 900 !important;
        }
        /* Free Regular (far) */
        .far,
        .far::before {
            font-family: "Font Awesome 6 Free" !important;
            font-weight: 400 !important;
        }
        /* Brands (fab) */
        .fab,
        .fab::before {
            font-family: "Font Awesome 6 Brands" !important;
            font-weight: 400 !important;
        }
        .update-notice-stack {
            position: fixed;
            top: calc(var(--app-navbar-offset, 50px) + 10px);
            left: 50%;
            transform: translateX(-50%);
            z-index: 1190;
            width: min(760px, calc(100vw - 32px));
        }
        .update-notice {
            border-radius: 6px;
            padding: 12px 14px;
            margin-bottom: 8px;
            display: flex;
            align-items: center;
            gap: 12px;
            box-shadow: 0 4px 12px rgba(0, 0, 0, .12);
        }
        .update-notice-icon {
            width: 34px;
            height: 34px;
            border-radius: 50%;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            flex: 0 0 auto;
            font-size: 15px;
        }
        .update-notice-content {
            flex: 1 1 auto;
            min-width: 0;
            font-size: 14px;
            font-weight: 600;
            line-height: 1.35;
        }
        .update-notice-button {
            flex: 0 0 auto;
            min-width: 104px;
            font-weight: 700;
        }
        .update-notice-pending {
            background: #fff3cd;
            border: 1px solid #e5c25c;
            color: #664d03;
        }
        .update-notice-pending .update-notice-icon {
            background: #f4d36a;
            color: #573b00;
        }
        .update-notice-applied {
            background: #ddf8e7;
            border: 1px solid #8ad3a7;
            color: #146c43;
        }
        .update-notice-applied .update-notice-icon {
            background: #8ad3a7;
            color: #146c43;
        }
        @media (max-width: 575.98px) {
            .update-notice {
                align-items: flex-start;
                flex-wrap: wrap;
            }
            .update-notice-button {
                margin-left: 46px;
                width: calc(100% - 46px);
            }
        }