
:root{
    --ez-bg:#0b1c2d;
    --ez-bg2:#0e2236;

    --ez-panel:#101f30;
    --ez-panel2:#13273b;

    --ez-border:#1c3b54;

    --ez-accent:#38bdf8;
    --ez-accent-soft:#7dd3fc;

    --ez-text:#f1f5f9;
    --ez-muted:#8ba3b7;
}

html,
body{
    background:var(--ez-bg)!important;
    color:var(--ez-text)!important;
    font-family:Inter,system-ui,-apple-system,sans-serif;
}

/* ======================================================
   TOPO
====================================================== */

.navbar{
    min-height:72px!important;

    background:
        linear-gradient(
            180deg,
            #0a1928 0%,
            #0b1b2b 100%
        )!important;

    border-bottom:
        1px solid rgba(56,189,248,.35)!important;

    box-shadow:
        0 5px 18px rgba(0,0,0,.14)!important;
}

.navbar .container-fluid{
    padding-left:26px!important;
    padding-right:26px!important;
}

.navbar-brand{
    margin-right:32px!important;
}

.ez-brand-logo{
    width:42px!important;
    height:42px!important;
    object-fit:contain;
    display:block;
}

.navbar .nav-link,
#modo-edicao{

    color:#d3dee8!important;

    font-size:14px!important;
    font-weight:600!important;

    text-decoration:none!important;

    padding:10px 13px!important;

    border-radius:7px!important;

    transition:
        background .18s ease,
        color .18s ease;
}

.navbar .nav-link:hover,
.navbar .nav-link:focus,
#modo-edicao:hover{

    color:#ffffff!important;

    background:
        rgba(56,189,248,.08)!important;
}

.navbar-text{
    color:#93a9bb!important;
}

/* ======================================================
   MAPA
====================================================== */

#core{

    background-color:#0d2134!important;

    background-image:

        radial-gradient(
            circle at 50% 10%,
            rgba(56,189,248,.045),
            transparent 35%
        ),

        linear-gradient(
            rgba(125,211,252,.045) 1px,
            transparent 1px
        ),

        linear-gradient(
            90deg,
            rgba(125,211,252,.045) 1px,
            transparent 1px
        )!important;

    background-size:
        auto,
        40px 40px,
        40px 40px!important;
}

/* ======================================================
   FORM / MODAIS
====================================================== */

.modal-content,
.card,
.dropdown-menu{

    background:
        var(--ez-panel)!important;

    border:
        1px solid var(--ez-border)!important;

    color:
        var(--ez-text)!important;

    border-radius:
        10px!important;
}

.form-control,
.form-select,
textarea{

    background:
        #0b1b2a!important;

    color:
        var(--ez-text)!important;

    border-color:
        #29465d!important;
}

.form-control:focus,
.form-select:focus,
textarea:focus{

    border-color:
        var(--ez-accent)!important;

    box-shadow:
        0 0 0 .16rem rgba(56,189,248,.12)!important;
}

/* ======================================================
   BOTÕES
====================================================== */

.btn-primary,
.btn-info{

    background:
        linear-gradient(
            135deg,
            #0ea5e9,
            #38bdf8
        )!important;

    border:
        0!important;

    color:
        #04121d!important;

    font-weight:
        700!important;
}

/* ======================================================
   TABELAS
====================================================== */

.table{

    --bs-table-bg:
        transparent!important;

    --bs-table-color:
        var(--ez-text)!important;
}

.table>:not(caption)>*>*{

    border-color:
        #223d53!important;
}

/* ======================================================
   RODAPÉ
====================================================== */

footer{

    background:
        #081725!important;

    border-top:
        1px solid rgba(56,189,248,.18)!important;

    padding:
        10px 26px!important;
}

.ez-footer{

    max-width:
        1400px;

    margin:
        0 auto;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        20px;

    flex-wrap:
        wrap;

    color:
        var(--ez-muted);

    font-size:
        12px;
}

.ez-footer-brand img{

    width:
        26px!important;

    height:
        26px!important;

    object-fit:
        contain;
}

.ez-footer-slogan{

    color:
        #9eb1c1;
}

.ez-footer-slogan b{

    color:
        var(--ez-accent-soft);

    font-weight:
        600;
}

/* ======================================================
   MOBILE
====================================================== */

@media(max-width:900px){

    .ez-brand-logo{
        width:36px!important;
        height:36px!important;
    }

    .navbar{
        min-height:64px!important;
    }

    .ez-footer{
        justify-content:center;
        text-align:center;
    }
}
