:root {
    --color-primary: #0F8F60;
    --color-hover: #0C6E4A;
    --color-dark: #084A33;
    --color-light: #D9F0E5;
    --color-muted: #727782;
    --modall-header-height: 60px;
    --modall-sidebar-footer-height: 63px;
    --modall-btn-radius: 10px;
}

.text-brand {
    color: var(--color-primary) !important;
}

.main-sidebar,
.main-sidebar .sidebar,
.main-sidebar .sidebar-menu,
.modall-sidebar-footer,
.modall-sidebar-logout-btn {
    font-family: "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.42857143;
}

.skin-blue-light .main-header .navbar,
.main-header .navbar.navbar-static-top {
    background-color: var(--color-primary) !important;
    min-height: var(--modall-header-height);
    border: none;
}

.main-header .sidebar-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: var(--modall-header-height);
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.main-header .sidebar-toggle::before {
    line-height: 1;
}

.main-header .navbar .modall-header-page-title {
    display: flex;
    align-items: center;
    height: var(--modall-header-height);
    margin: 0;
    padding: 0 15px;
    background: transparent;
    border: none;
}

.main-header .navbar .modall-header-page-title h1 {
    margin: 0;
    color: #fff !important;
    display: flex;
    align-items: center;
    font-size: 22px;
    font-weight: 400;
}

.main-header .navbar .modall-header-page-title h1 small {
    color: rgba(255, 255, 255, 0.85) !important;
    margin-left: 10px;
    font-size: 14px;
}

.main-header .navbar-custom-menu .navbar-nav > li > a {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    height: var(--modall-header-height);
    line-height: 1.2;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    color: #ffffff;
}

.main-header .navbar-custom-menu .navbar-nav > li.user-menu > a.modall-header-user,
.main-header .navbar-custom-menu .navbar-nav > li > a.modall-header-user {
    max-width: 240px;
}

.modall-header-user__name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.skin-blue-light .main-header .navbar .sidebar-toggle:hover,
.skin-blue-light .main-header .navbar .dropdown-menu li a:hover,
.skin-blue-light .main-header .navbar .nav > li > a:hover,
.skin-blue-light .main-header .navbar .nav > li > a:active,
.skin-blue-light .main-header .navbar .nav > li > a:focus,
.skin-blue-light .main-header .navbar .nav .open > a,
.skin-blue-light .main-header .navbar .nav .open > a:hover,
.skin-blue-light .main-header .navbar .nav .open > a:focus {
    background-color: var(--color-hover) !important;
}

.skin-blue-light .main-header li.user-header,
li.user-header,
.modall-applications-header {
    background-color: var(--color-primary) !important;
}

@media (max-width: 767px) {
    .main-header .navbar .modall-header-page-title {
        max-width: calc(100% - 180px);
        overflow: hidden;
    }

    .main-header .navbar .modall-header-page-title h1 {
        font-size: 16px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .main-header .navbar .modall-header-page-title h1 small {
        display: none;
    }

    .main-header .navbar-custom-menu {
        margin-right: 0;
    }

    .main-header .navbar-custom-menu .navbar-nav {
        display: flex;
        align-items: center;
        margin: 0;
    }

    .main-header .navbar-custom-menu .navbar-nav > li > a {
        width: 44px;
        justify-content: center;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .main-header .navbar-custom-menu .navbar-nav > li.user-menu > a.modall-header-user {
        width: auto;
        max-width: 44px;
        min-width: 44px;
    }

    .main-header .navbar-custom-menu .navbar-nav > li.user-menu > a.modall-header-user .modall-header-user__name {
        display: none;
    }

    .main-footer {
        padding: 12px 14px;
    }

    .modall-footer-content {
        align-items: flex-start;
        flex-direction: column;
    }

    .modall-footer-version {
        align-self: flex-start;
    }
}

.main-footer {
    position: relative;
    z-index: 1030;
    min-height: var(--modall-sidebar-footer-height);
    padding: 0 18px;
    border-top: 1px solid #e5e7eb;
    background: #ffffff;
    color: #6c757d;
    font-size: 14px;
    display: flex;
    align-items: center;
}

.modall-footer-content {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.modall-footer-copy {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    min-width: 0;
}

.modall-footer-brand {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 3px 9px;
    border: 1px solid var(--color-light);
    border-radius: 999px;
    background: var(--color-light);
    color: var(--color-dark);
    font-weight: 700;
}

.modall-footer-version {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 28px;
    padding: 4px 10px;
    border: 1px solid #e5e7eb;
    border-radius: 999px;
    background: #f8fafc;
    color: #64748b;
    font-weight: 700;
    white-space: nowrap;
}

.modall-footer-version .fa {
    color: var(--color-primary);
}

.main-footer a {
    color: var(--color-primary);
    font-weight: 700;
}

.main-footer a:hover,
.main-footer a:focus {
    color: var(--color-hover);
}

.main-sidebar {
    position: fixed !important;
    top: 0;
    bottom: 0;
    height: 100vh !important;
    min-height: 100vh !important;
    max-height: 100vh;
    padding-top: 0 !important;
    overflow: hidden;
    box-sizing: border-box;
}

.main-sidebar .sidebar {
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding-bottom: var(--modall-sidebar-footer-height);
}

.main-sidebar .logoMenu {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    min-height: 50px;
    padding: 10px 12px 12px;
    margin: 0;
    overflow: visible;
    line-height: normal;
    box-sizing: border-box;
    flex-shrink: 0;
}

.main-sidebar .logoMenu img {
    display: block;
    width: 175px;
    max-width: calc(100% - 8px);
    height: auto;
    margin: 0;
    object-fit: contain;
}

.main-sidebar .sidebar-menu {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding-bottom: 8px;
}

.main-sidebar .sidebar-menu > li.sidebar-search {
    margin: 14px 14px 10px !important;
    padding: 0 !important;
}

.sidebar-mini.sidebar-collapse .sidebar-search {
    display: none;
}

.main-sidebar .sidebar-menu > li.sidebar-search .sidebar-search__field {
    position: relative;
    display: block;
}

.main-sidebar .sidebar-menu > li.sidebar-search .sidebar-search__input {
    width: 100%;
    height: 34px;
    padding: 0 10px 0 30px;
    border: 1px solid #d2d6de;
    border-radius: 8px;
    background: #ffffff;
    color: #444;
    font-size: 12px;
    outline: none;
    box-sizing: border-box;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.main-sidebar .sidebar-menu > li.sidebar-search .sidebar-search__icon {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    color: #94a3b8;
    font-size: 12px;
    pointer-events: none;
}

.main-sidebar .sidebar-menu > li.sidebar-search .sidebar-search__input::placeholder {
    color: #94a3b8;
}

.main-sidebar .sidebar-menu > li.sidebar-search .sidebar-search__input:focus {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 2px rgba(79, 111, 82, 0.12);
}

.modall-sidebar-footer {
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 1045;
    width: 230px;
    margin-top: 0;
    padding: 12px;
    border-top: 1px solid #d1d5dc;
    border-right: 1px solid #d1d5dc;
    background: #ffffff;
    box-sizing: border-box;
    min-height: var(--modall-sidebar-footer-height);
}

.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover) .modall-sidebar-footer {
    width: 50px;
}

.sidebar-mini.sidebar-collapse .main-sidebar:hover .modall-sidebar-footer {
    width: 230px;
}

.modall-sidebar-logout-btn {
    width: 100%;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #d1d5dc;
    border-radius: 12px;
    background: transparent;
    color: #111827 !important;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    text-decoration: none !important;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.modall-sidebar-logout-btn .fa {
    margin-right: 6px;
    font-size: 14px;
}

.modall-sidebar-logout-btn:hover,
.modall-sidebar-logout-btn:focus,
.modall-sidebar-logout-btn:active {
    background: #c2c8d1;
    border-color: #c2c8d1;
    color: #111827 !important;
    box-shadow: none;
    outline: none;
}

.sidebar-mini.sidebar-collapse .main-sidebar .logoMenu {
    height: 50px;
    min-height: 50px;
    padding: 6px 4px;
}

.sidebar-mini.sidebar-collapse .main-sidebar .logoMenu img {
    width: auto;
    max-height: 38px;
    max-width: 42px;
}

.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover) .modall-sidebar-footer {
    padding: 8px 6px;
}

.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover) .modall-sidebar-logout-btn {
    width: 38px;
    margin: 0 auto;
}

.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover) .modall-sidebar-logout-btn .fa {
    margin-right: 0;
}

.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover) .modall-sidebar-logout-text {
    display: none;
}

.sidebar-mini.sidebar-collapse .main-sidebar .sidebar-menu {
    overflow-x: hidden;
    overflow-y: hidden;
    padding-bottom: 0;
}

.sidebar-mini.sidebar-collapse .main-sidebar .sidebar-menu > li.header {
    display: none;
}

.sidebar-mini.sidebar-collapse .main-sidebar .sidebar-menu > li > a,
.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover) .sidebar-menu > li:hover > a {
    display: flex !important;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 8px 0 !important;
    border-left-width: 0 !important;
    background-color: transparent !important;
}

/* Colapsado: NUNCA exibe submenu (evita scroll e abertura indevida) */
.sidebar-mini.sidebar-collapse .main-sidebar .sidebar-menu > li > .treeview-menu,
.sidebar-mini.sidebar-collapse .main-sidebar .sidebar-menu > li.menu-open > .treeview-menu,
.sidebar-mini.sidebar-collapse .main-sidebar .sidebar-menu > li.active > .treeview-menu,
.sidebar-mini.sidebar-collapse .main-sidebar:hover .sidebar-menu > li > .treeview-menu,
.sidebar-mini.sidebar-collapse .main-sidebar:hover .sidebar-menu > li.menu-open > .treeview-menu,
.sidebar-mini.sidebar-collapse .main-sidebar:hover .sidebar-menu > li.active > .treeview-menu {
    display: none !important;
    position: static !important;
    width: 0 !important;
    height: 0 !important;
    max-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    visibility: hidden !important;
}

/* Colapsado sem hover: só ícones */
.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover) .sidebar-menu > li > a > span,
.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover) .sidebar-menu > li > a > .pull-right-container {
    display: none !important;
    position: static !important;
    width: 0 !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
}

/* Colapsado + hover: mostra só o rótulo do módulo (sem submenu) */
.sidebar-mini.sidebar-collapse .main-sidebar:hover .sidebar-menu > li > a {
    display: flex !important;
    align-items: center;
    justify-content: flex-start;
    min-height: 44px;
    padding: 9px 15px !important;
    border-left-width: 3px !important;
}

.sidebar-mini.sidebar-collapse .main-sidebar:hover .sidebar-menu > li > a > span,
.sidebar-mini.sidebar-collapse .main-sidebar:hover .sidebar-menu > li > a > .pull-right-container {
    display: inline-block !important;
    position: static !important;
    width: auto !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    visibility: visible !important;
}

.sidebar-mini.sidebar-collapse .main-sidebar .sidebar-menu > li > a > i.fa:not(.pull-right),
.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover) .sidebar-menu > li:hover > a > i.fa:not(.pull-right) {
    flex: 0 0 auto;
    margin: 0 !important;
}

.sidebar-mini.sidebar-collapse .main-sidebar:hover .sidebar-menu > li > a > i.fa:not(.pull-right) {
    margin-right: 8px !important;
}

.skin-blue-light .sidebar-menu > li > a {
    padding-top: 9px;
    padding-bottom: 9px;
    line-height: 1.2;
    border-left: 3px solid transparent;
    font-size: 15px;
    font-weight: 600;
    color: #444;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.skin-blue-light .sidebar-menu > li.header {
    color: #848484;
    background: #f9fafc;
    font-size: 12px;
    font-weight: 600;
}

.skin-blue-light .sidebar-menu li > a > i.fa:not(.pull-right) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    margin-right: 8px;
    border-radius: 6px;
    background: var(--color-light);
    color: var(--color-primary);
    font-size: 12px;
    line-height: 1;
    vertical-align: middle;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.skin-blue-light .sidebar-menu > li > a > i.fa:not(.pull-right) {
    font-size: 14px;
}

.skin-blue-light .sidebar-menu .treeview-menu > li > a > i.fa:not(.pull-right) {
    width: 20px;
    height: 20px;
    margin-right: 6px;
    border-radius: 5px;
    font-size: 10px;
    background: var(--color-light);
}

.skin-blue-light .sidebar-menu .treeview-menu > li > a {
    padding-left: 24px !important;
    font-size: 14px;
    font-weight: 400;
    color: #777;
}

.skin-blue-light .sidebar-menu > li > a:hover > i.fa:not(.pull-right),
.skin-blue-light .sidebar-menu .treeview-menu > li > a:hover > i.fa:not(.pull-right) {
    background: #dce5dc;
    color: var(--color-hover);
}

.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover) .sidebar-menu > li > a > i.fa:not(.pull-right) {
    width: 26px;
    height: 26px;
    margin-right: 0;
}

.sidebar-mini.sidebar-collapse .main-sidebar:hover .sidebar-menu > li > a > i.fa:not(.pull-right) {
    width: 24px;
    height: 24px;
    margin-right: 8px !important;
}

.skin-blue-light .sidebar-menu > li.active:not(.treeview) > a {
    color: var(--color-primary) !important;
    background-color: var(--color-light) !important;
    border-left-color: var(--color-primary) !important;
    font-weight: 600 !important;
}

.skin-blue-light .sidebar-menu > li.active:not(.treeview) > a > i.fa:not(.pull-right),
.skin-blue-light .sidebar-menu .treeview-menu > li.active > a > i.fa:not(.pull-right) {
    background: var(--color-primary);
    color: #fff !important;
}

.skin-blue-light .sidebar-menu > li.treeview.menu-open.active > a {
    color: #475569 !important;
    background-color: transparent !important;
    border-left-color: transparent !important;
    font-weight: 600 !important;
}

.skin-blue-light .sidebar-menu > li.treeview.menu-open.active > a > i.fa:not(.pull-right) {
    background: #dce5dc;
    color: var(--color-primary) !important;
}

.skin-blue-light .sidebar-menu .treeview-menu > li.active > a {
    color: var(--color-primary) !important;
    background-color: var(--color-light) !important;
    border-left: none !important;
    font-weight: 600 !important;
}

.skin-blue-light .sidebar-menu > li:hover:not(.active) > a {
    background-color: #eef1f6 !important;
}

.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover) .sidebar-menu > li:hover:not(.active) > a {
    background-color: transparent !important;
}

.sidebar-mini.sidebar-collapse .main-sidebar:not(:hover) .sidebar-menu > li.active:not(.treeview) > a {
    background-color: transparent !important;
    border-left-color: transparent !important;
}

.skin-blue-light .sidebar-menu .treeview-menu > li:hover:not(.active) > a {
    background-color: rgba(79, 111, 82, 0.08) !important;
    color: #334155 !important;
}

@media (max-width: 767px) {
    .main-sidebar {
        padding-top: 50px !important;
    }
}