@import url("sidebar.css");
@import url("dashboard.css");
@import url("cards.css");

/* ==========================
   RESET
========================== */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

:root{

    --verde:#049D84;
    --verde-hover:#03856f;

    --fundo:#f5f7fb;
    --card:#ffffff;

    --texto:#222;
    --cinza:#666;

    --borda:#e8e8e8;

    --shadow:0 8px 20px rgba(0,0,0,.06);

    --radius:18px;

}

html{
    scroll-behavior:smooth;
}

body{

    font-family:'Inter',sans-serif;

    background:var(--fundo);

    color:var(--texto);

}

img{

    display:block;

    max-width:100%;

}

button{

    font-family:inherit;

    cursor:pointer;

}

a{

    text-decoration:none;

    color:inherit;

}

input{

    font-family:inherit;

    outline:none;

}

/* ==========================
   PAGINAÇÃO
========================== */

.paginacao{

    display:flex;

    justify-content:center;

    align-items:center;

    gap:8px;

    margin:35px 0;

    flex-wrap:wrap;

}

.paginacao a{

    text-decoration:none;

    min-width:42px;

    height:42px;

    display:flex;

    justify-content:center;

    align-items:center;

    border-radius:10px;

    background:#fff;

    border:1px solid #e5e7eb;

    color:#555;

    font-weight:600;

    transition:.2s;

    box-shadow:0 2px 8px rgba(0,0,0,.04);

}

.paginacao a:hover{

    background:#049D84;

    color:#fff;

    border-color:#049D84;

    transform:translateY(-2px);

}

.paginacao a.ativo{

    background:#049D84;

    color:#fff;

    border-color:#049D84;

}

/* =====================================================
   SIDEBAR OVERRIDE
===================================================== */

.sidebar>ul{

    display:block!important;

}

.sidebar>ul>li{

    display:block!important;

    margin-bottom:8px!important;

}

.has-submenu{

    display:block!important;

}

.has-submenu>a{

    display:flex!important;

    justify-content:space-between!important;

    align-items:center!important;

    width:100%;

}

.has-submenu>a>span{

    display:flex!important;

    align-items:center!important;

    flex-direction:row!important;

    gap:12px!important;

    white-space:nowrap!important;

}

.has-submenu>a>span i{

    width:20px;

    flex:none;

}
/* =====================================================
   SUBMENU RN
===================================================== */

.submenu-cidades{

    max-height:0;

    overflow:hidden;

    opacity:0;

    list-style:none!important;

    margin:8px 0 0 34px!important;

    padding-left:14px!important;

    border-left:2px solid #e8ecef;

    transition:
        max-height .35s ease,
        opacity .25s ease;

}

.has-submenu.open .submenu-cidades{

    max-height:500px;

    opacity:1;

}

.submenu-cidades li{

    margin:2px 0!important;

    display:block;

}

.submenu-cidades li a{

    position:relative;

    display:block!important;

    padding:10px 12px 10px 28px!important;

    border-radius:8px;

    background:none!important;

    color:#666!important;

    font-size:14px;

    font-weight:500;

    transition:.20s;

}

.submenu-cidades li a::before{

    content:"";

    position:absolute;

    left:10px;

    top:50%;

    transform:translateY(-50%);

    width:7px;

    height:7px;

    border-radius:50%;

    background:transparent;

    transition:.2s;

}

.submenu-cidades li a:hover{

    background:#eef8f5!important;

    color:#049D84!important;

}

.submenu-cidades li a.cidade-ativa{

    background:none!important;

    color:#049D84!important;

    font-weight:700;

}

.submenu-cidades li a.cidade-ativa::before{

    background:#049D84;

}

.seta{

    font-size:12px;

    transition:transform .25s ease;

}

.has-submenu.open>.seta,
.has-submenu.open>a .seta{

    transform:rotate(180deg);

}

/* =====================================================
   EFEITOS
===================================================== */

.sidebar li>a{

    transition:
        background .20s,
        color .20s,
        transform .15s;

}

.sidebar li>a:hover{

    transform:translateX(3px);

}

.sidebar li.active>a{

    background:#049D84;

    color:#fff;

}

.sidebar li.active>a i{

    color:#fff;

}

.sidebar-footer{

    margin-top:25px;

    border-top:1px solid var(--borda);

    padding-top:20px;

}

.version{

    background:#f8f9fb;

    border-radius:14px;

    padding:16px;

}

.version small{

    display:block;

    color:#888;

    margin-bottom:4px;

}

.version strong{

    color:#049D84;

}