/* =========================
   Tema Câmara de Arapiraca
   ========================= */

/* Cores e elevação */
:root{
  --brand-primary:#00329F;           /* azul institucional */
  --tile-radius:16px;
  --tile-shadow:    0 10px 26px rgba(0,0,0,.18);
  --tile-shadow-lg: 0 18px 46px rgba(0,0,0,.22);
}

body{ background:#f5f7fb; }

/* -------------------------
   Navbar / links / botões
   ------------------------- */
.navbar.bg-primary{ background-color:var(--brand-primary)!important; }

a{ color:var(--brand-primary); }
a:hover{ color:#002a86; }

.btn-primary{
  background-color:var(--brand-primary);
  border-color:var(--brand-primary);
}
.btn-primary:hover,
.btn-primary:focus{
  background-color:#002a86;
  border-color:#002a86;
}

.nav-pills .nav-link.active,
.page-link.active{
  background-color:var(--brand-primary);
  border-color:var(--brand-primary);
}

/* Logo na navbar */
.brand-logo{ height:38px; width:auto; display:block; }

/* -------------------------
   Títulos de seção (barrinha)
   ------------------------- */
.section-title{
  margin:.25rem 0 1rem;
  padding-left:.6rem;
  border-left:4px solid var(--brand-primary);
  color:#0b5ed7;
  font-weight:800;
}
.section-title.rh{    border-color:#20c997; color:#198754; }
.section-title.fiscal{border-color:#fd7e14; color:#fd7e14; }

/* =========================
   GRID de Tiles (atalhos)
   ========================= */

/* Cartão */
.tiles .tile-card{
  border:0;
  border-radius:var(--tile-radius);
  background:#fff;
  box-shadow:var(--tile-shadow);
  transition:transform .15s ease, box-shadow .15s ease;
}
.tiles .tile-card:hover{
  transform:translateY(-6px);
  box-shadow:var(--tile-shadow-lg);
}

/* Layout interno do tile (SEM KPI) */
.tiles .tile{
  display:grid;
  grid-template-columns:60px 1fr;    /* ícone + texto */
  gap:1rem;
  align-items:center;
  padding:1.1rem 1.25rem;
  min-height:110px;
  position:relative;
}

/* “Badge” do ícone com gradiente */
.tile-ico{
  width:56px; height:56px;
  border-radius:14px;
  display:grid; place-items:center;
  color:#fff;
  box-shadow:0 10px 20px rgba(0,0,0,.15);
}
.tile-ico i{ font-size:22px; line-height:1; }

/* Texto */
.tile-mid .tile-title{ font-weight:800; margin-top:2px; }

/* Paletas dos ícones */
.ico-blue{   background:linear-gradient(135deg,#4da3ff,#00329F); }
.ico-green{  background:linear-gradient(135deg,#3ad29f,#1f9d72); }
.ico-orange{ background:linear-gradient(135deg,#ffb16a,#fd7e14); }
.ico-purple{ background:linear-gradient(135deg,#b28dff,#6f42c1); }

/* Garanta que qualquer contador, se existir em algum HTML legado, não apareça */
.tile-kpi{ display:none !important; }

/* -------------------------
   Tabelas (páginas internas)
   ------------------------- */
.table thead th{ background:#eef2f7; }
.table tfoot th{ background:#fff; }
/* ==== Sombra mais escura nos cards de atalho ==== */
/* normal */
.tiles .tile-card{
  box-shadow:
    0 12px 28px rgba(0,0,0,.28),
    0  2px  8px rgba(0,0,0,.18) !important;
  border: 0;
  background:#fff;
}
/* hover/focus */
.tiles .tile-card:hover,
.tiles .tile-card:focus-within{
  box-shadow:
    0 20px 48px rgba(0,0,0,.35),
    0  8px 16px rgba(0,0,0,.22) !important;
  transform: translateY(-6px);
}
/* ===== Sombra ESCURA para os cards do grid (override total) ===== */
.tiles .card,
.tiles .tile-card,
.tiles .card-tile,
.tiles .card.shadow-sm {
  border: 0 !important;
  box-shadow:
    0 12px 28px rgba(0,0,0,.32),
    0  4px 10px rgba(0,0,0,.22) !important;
  transition: transform .18s ease, box-shadow .18s ease;
}

.tiles .card:hover,
.tiles .tile-card:hover,
.tiles .card-tile:hover,
.tiles .card.shadow-sm:hover,
.tiles .card:focus-within,
.tiles .tile-card:focus-within,
.tiles .card-tile:focus-within,
.tiles .card.shadow-sm:focus-within {
  transform: translateY(-8px);
  box-shadow:
    0 22px 56px rgba(0,0,0,.40),
    0 10px 20px rgba(0,0,0,.26) !important;
}

/* garante que não herde sombras leves do bootstrap */
.tiles .card.shadow,
.tiles .card.shadow-sm,
.tiles .card.shadow-lg {
  box-shadow:
    0 12px 28px rgba(0,0,0,.32),
    0  4px 10px rgba(0,0,0,.22) !important;
}
/* ===== ELEVAÇÃO FORTE — cards do grid ===== */
.tiles :is(.tile-card, .card, .card-tile, .card.shadow, .card.shadow-sm, .card.shadow-lg){
  border: 1px solid rgba(0,0,0,.06) !important;      /* aro sutil para definir a borda */
  background:#fff !important;
  box-shadow:
    0 30px 70px rgba(0,0,0,.38),                     /* sombra longa */
    0 12px 24px rgba(0,0,0,.26),                     /* média */
    0  2px  8px rgba(0,0,0,.20) !important;          /* curta */
  transition: transform .2s ease, box-shadow .2s ease;
}

/* hover/focus ainda mais marcado */
.tiles :is(.tile-card, .card, .card-tile, .card.shadow, .card.shadow-sm, .card.shadow-lg):hover,
.tiles :is(.tile-card, .card, .card-tile, .card.shadow, .card.shadow-sm, .card.shadow-lg):focus-within{
  transform: translateY(-10px);
  box-shadow:
    0 40px 90px rgba(0,0,0,.48),
    0 18px 32px rgba(0,0,0,.30),
    0  4px 12px rgba(0,0,0,.22) !important;
}

/* brilho superior sutil para dar volume */
.tiles :is(.tile-card, .card, .card-tile)::after{
  content:"";
  position:absolute; inset:0 0 auto 0; height:12px; border-radius:16px 16px 0 0;
  background:linear-gradient(to bottom, rgba(10, 10, 10, 0.8), rgba(255,255,255,0));
  pointer-events:none;
}

/* =========================
   Accessbar (A+/A-/A | tema | Mapa do Site)
   agora no mesmo azul da navbar
   ========================= */
:root{
  --brand-primary:#00329F; /* azul Câmara */
}

.accessbar{
  background: var(--brand-primary);
  color:#fff;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.18);
}

.accessbar .btn-access{
  color:#fff;
  border:1px solid rgba(255,255,255,.35);
  background: transparent;
  line-height:1;
  padding:.2rem .5rem;
  border-radius:.375rem;
}

.accessbar .btn-access:hover,
.accessbar .btn-access:focus{
  color:#fff;
  background: rgba(255,255,255,.15);
  border-color: rgba(255,255,255,.55);
}

.accessbar .vr{
  border-left:1px solid rgba(255,255,255,.35) !important;
  height:18px;
}

.accessbar a{
  color:#fff !important;
  text-decoration:none;
}

.accessbar a:hover{ text-decoration:underline; }

.accessbar .bi{ color:#fff; } /* ícone meia-lua */

<style>
  /* barra de acessibilidade (top) – branca com ícones pretos */
  .accessbar{
    background:#fff;
    color:#000;
    border-bottom:1px solid rgba(0,0,0,.08);
  }
  .accessbar .btn-access{
    color:#000;
    background:#fff;
    border:1px solid rgba(0,0,0,.20);
    padding:.25rem .45rem;
    line-height:1;
    border-radius:.375rem;
    font-weight:600;
  }
  .accessbar .btn-access:hover,
  .accessbar .btn-access:focus{
    background:rgba(0,0,0,.06);
    border-color:rgba(0,0,0,.35);
  }
  .accessbar .btn-access i{ color:#000; } /* ícone meia-lua */
  .accessbar .vr{ border-left:1px solid rgba(0,0,0,.25)!important; height:18px; }
  .accessbar .link-map{
    color:#000; text-decoration:none; font-weight:600;
  }
  .accessbar .link-map:hover{ text-decoration:underline; }
  .brand-logo{ height:38px; width:auto; display:block; }
</style>

/* Accessbar — azul */
:root{ --brand-primary:#00329F; }

.accessbar{
  background: var(--brand-primary);
  color:#fff;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.18);
}

.accessbar .btn-access{
  color:#fff;
  background: transparent;
  border:1px solid rgba(255,255,255,.35);
  padding:.2rem .5rem;
  line-height:1;
  border-radius:.375rem;
  font-weight:600;
}
.accessbar .btn-access:hover,
.accessbar .btn-access:focus{
  background: rgba(255,255,255,.15);
  border-color: rgba(255,255,255,.55);
  color:#fff;
}

.accessbar .bi{ color:#fff; }                 /* ícone meia-lua */
.accessbar .split{ color:rgba(255,255,255,.6); } /* o “|” separador */
.accessbar a{ color:#fff; text-decoration:none; }
.accessbar a:hover{ text-decoration:underline; }

/* ===== Cores base (ajuste se quiser casar com sua navbar) ===== */
:root{
  --brand-primary: #084094; /* azul institucional (ou use o seu #00329F) */
}

/* se quiser que a navbar siga a mesma cor da brand */
.navbar.bg-primary{ background-color: var(--brand-primary)!important; }

/* ===== Estilos da barra de acessibilidade ===== */
.accessbar{
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.08);
}
.accessbar .btn-access{
  display:inline-flex; align-items:center; justify-content:center;
  gap:.25rem;
  line-height:1; padding:.25rem .55rem;
  border-radius:.375rem; font-weight:600;
  transition: background .15s ease, border-color .15s ease, color .15s ease, opacity .15s ease;
}
.accessbar .vr{ height:18px; }

.accessbar .link-map{
  font-weight:600; text-decoration:none;
}

/* --- Tema BRANCO (ícones/texto azuis) --- */
.accessbar--white{
  background:#fff; color:var(--brand-primary);
  border-bottom:1px solid rgba(0,0,0,.08);
}
.accessbar--white .btn-access{
  color:var(--brand-primary);
  background:#fff; border:1px solid rgba(0,0,0,.20);
}
.accessbar--white .btn-access:hover,
.accessbar--white .btn-access:focus{
  background:rgba(0,0,0,.06); border-color:rgba(0,0,0,.35);
}
.accessbar--white .vr{ border-left:1px solid rgba(0,0,0,.25)!important; }
.accessbar--white .link-map,
.accessbar--white .bi{ color:var(--brand-primary)!important; }

/* --- Tema AZUL (ícones/texto brancos) --- */
.accessbar--blue{
  background:var(--brand-primary); color:#fff;
}
.accessbar--blue .btn-access{
  color:#fff; background:transparent; border:1px solid rgba(255,255,255,.35);
}
.accessbar--blue .btn-access:hover,
.accessbar--blue .btn-access:focus{
  background:rgba(255,255,255,.15); border-color:rgba(255,255,255,.55);
}
.accessbar--blue .vr{ border-left:1px solid rgba(255,255,255,.35)!important; }
.accessbar--blue .link-map,
.accessbar--blue .bi{ color:#fff!important; }

/* Dropdown claro dentro da navbar escura */
.navbar-admin .dropdown-menu {
  background-color: #fff !important;
  color: #212529 !important;
  border: 1px solid rgba(0,0,0,.1);
}
.navbar-admin .dropdown-menu .dropdown-item {
  color: #212529 !important;
}
.navbar-admin .dropdown-menu .dropdown-item:hover {
  background: #f1f3f5 !important;
  color: #000 !important;
}
