
:root{
  --bg:#0b1a2b; --bg2:#07121f; --cobalt:#2157a6; --brand:#1e90ff;
  --light:#e6f1ff; --accent:#7cc6ff; --card:#0f223a; --border:#1c3357;
  --rowA:#0c203b; --rowB:#0f2747;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:linear-gradient(180deg,var(--bg),var(--bg2) 60%);color:var(--light);
  font-family:Inter,Segoe UI,Roboto,Helvetica,Arial,sans-serif}
.wrapper{max-width:1100px;margin:32px auto;padding:0 16px}
.header{display:flex;align-items:center;gap:16px;background:linear-gradient(90deg,var(--cobalt),var(--brand));
  padding:16px 20px;border-radius:18px;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.header img{height:54px;width:auto;display:block}
.title{display:flex;flex-direction:column}
.title h1{margin:0;font-weight:800;letter-spacing:.4px}
.title .subtitle{opacity:.95;font-size:.95rem;margin-top:4px;font-weight:bold}
.card{background:var(--card);border:1px solid var(--border);border-radius:18px;margin-top:18px;
  box-shadow:0 12px 40px rgba(0,0,0,.35);overflow:hidden}
.footer{padding:16px 6px;text-align:center;opacity:.85;font-size:.85rem}
.topnav{display:flex;gap:12px;align-items:center;justify-content:center;background:rgba(255,255,255,.05);
  padding:10px;border-bottom:1px solid var(--border)}
.topnav a{color:#fff;text-decoration:none;font-weight:700;padding:6px 10px;border-radius:999px;border:1px solid var(--border);
  background:rgba(255,255,255,.05)}
.topnav a.active, .topnav a:hover{background:var(--brand);border-color:transparent}
.grid-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;margin-top:16px}
.card-cat{background:var(--rowB);border:1px solid var(--border);border-radius:16px;padding:16px}
.card-cat h3{margin:0 0 8px 0}
.card-cat .links{display:flex;flex-wrap:wrap;gap:8px}
.pill{border:1px solid var(--border);padding:8px 10px;border-radius:999px;background:rgba(255,255,255,.04);font-weight:600}
.thead{position:sticky;top:0;background:var(--rowB);border-bottom:1px solid var(--border);
  display:grid}
.row-main{display:grid;align-items:center}
.list .row:nth-child(odd) .row-main{background:var(--rowA)}
.list .row:nth-child(even) .row-main{background:var(--rowB)}
.row-main > div{padding:12px 14px;border-bottom:1px solid var(--border);white-space:nowrap}
.select-mobile{display:none;width:100%;margin:10px 0;padding:10px;border-radius:12px;border:1px solid var(--border);
  background:#0c1d31;color:#fff}
.tabs{display:flex;gap:8px;overflow-x:auto;padding:10px;border-bottom:1px solid var(--border);background:rgba(255,255,255,.02)}
.tab{background:rgba(255,255,255,.08);color:#fff;border:1px solid var(--border);border-radius:999px;padding:8px 12px;
  font-weight:700;cursor:pointer;white-space:nowrap}
.tab.active{background:var(--brand);border-color:transparent}
@media (max-width: 720px){
  .header img{height:44px}
  .title h1{font-size:1.12rem}
  .tabs{display:none}
  .select-mobile{display:block}
}

/* ======== CENTRALIZAÇÃO DO MENU PRINCIPAL (DESKTOP) ======== */
/* Cole este bloco no FINAL de assets/app.css */

@media (min-width: 992px) {

  /* Ajuste estes seletores para o(s) seu(s) container(es) de menu */
  nav.main-nav,
  .topnav,
  header .main-nav,
  .nav-wrapper,
  .navbar {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;   /* centro geométrico do menu */
    gap: 16px;
    width: 100%;
  }

  /* Caso o menu esteja dentro de uma UL */
  nav.main-nav > ul,
  .topnav > ul,
  header .main-nav > ul,
  .nav-wrapper > ul,
  .navbar > ul {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;   /* centraliza os itens */
    gap: 18px;
    list-style: none;
    margin: 0 auto !important;            /* centraliza o bloco UL */
    padding: 0;
    float: none !important;                /* neutraliza layouts antigos com float */
    text-align: center;
    width: auto;
  }

  /* Itens do menu */
  nav.main-nav > ul > li,
  .topnav > ul > li,
  header .main-nav > ul > li,
  .nav-wrapper > ul > li,
  .navbar > ul > li {
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  /* Links do menu */
  nav.main-nav a,
  .topnav a,
  header .main-nav a,
  .nav-wrapper a,
  .navbar a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    /* opcional: herdar cores/padding do seu tema */
  }

  /* Se houver um container superior (topbar) com largura máxima, garanta centralização do conjunto */
  .topbar,
  .nav-container,
  .nav-row {
    max-width: 1250px;    /* ajuste ao seu layout */
    margin: 0 auto;       /* centraliza o container do menu */
    width: 100%;
  }

  /* Neutraliza “space-between” que puxa o menu para as laterais */
  .nav-left, .nav-right, .brand-left, .brand-right {
    /* Se os lados estiverem empurrando o menu, descomente uma das opções abaixo */

    /* Opção 1: manter as colunas, mas sem empurrar o centro */
     /* flex: 0 0 auto; */

    /* Opção 2: ocultar colunas laterais em desktop (se forem meramente decorativas) */
     display: none !important; 
  }
}

/* ======== MOBILE permanece como está ======== */
@media (max-width: 991.98px) {
  nav.main-nav > ul,
  .topnav > ul,
  header .main-nav > ul,
  .nav-wrapper > ul,
  .navbar > ul {
    justify-content: flex-start; /* ou space-between, conforme seu layout móvel */
  }
}

/* ================== COMPONENTE: TOTALS BAR (PADRÃO GLOBAL) ================== */
.toolbar.toolbar--totals{
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  padding:12px 14px;
  border-bottom:1px solid var(--border);
  background:rgba(255,255,255,.02);
}

.toolbar.toolbar--totals .pill{
  border:1px solid var(--border);
  padding:10px 16px;
  border-radius:999px;
  background:rgba(255,255,255,.07);
  font-weight:800;
  color:#fff;
  font-size:1.15rem;
  letter-spacing:.01em;
  white-space:nowrap;
}

.toolbar.toolbar--totals .label{
  opacity:.95;
  margin-right:.35rem;
}
.toolbar.toolbar--totals .value{
  font-weight:900;
}

@media (max-width: 680px){
  .toolbar.toolbar--totals{
    justify-content:center;
    gap:8px;
    padding:10px 12px;
  }
  .toolbar.toolbar--totals .pill{
    font-size:1.05rem;
    padding:9px 14px;
  }
}
