:root {
  --bs-body-font-family: 'Roboto', sans-serif;
  --bs-body-font-weight: 300;
  --bs-body-font-size: 24px;
}

* {
  font-size: 20px;
}

.table th, .table td {
  font-size: 75% !important;
  vertical-align: middle;
}

html, body {
  height: 100%;
  background-color: #fff; 
  color: #174892;
  /*color: #4B4B4B;  
  background-image: url("https://gerenciador.limeira.sp.leg.br/img/logo_fundo.png");
  background-position: center;
  background-repeat: no-repeat;*/
}

a:link {
  color: #3279a0;
  text-decoration: none;
}

.small{
  font-size: 75% !important;
}

.figure-caption{
  font-size: 75% !important;
}

.btn-group {
  border-radius: 0.375rem !important;
}

.card{
  color: #174892;
}

h1 {
  font-size: 36px !important;
}

.opaco {
  background-color: black;
  opacity: 0.5;
}

/* ==========================
   MENU (tile original)
   ========================== */

.mnu-item {
  font-size: 14px !important;
  font-weight: 500;
  border-color: #fff;
  border-width: 2;
  border-style: solid;
  background-color: #3279a0;
  color: #cff2f8;
}

.mnu-item a {
  font-size: 14px !important;
  font-weight: 500;
  color: #cff2f8;
  text-decoration: none;
}

.mnu-item:hover {
  background-color: #4390b9;
  color: #ffffff;
}

/* ==========================
   OUTROS BOTÕES / RODAPÉ
   ========================== */

.acesso-azul {
  border-color: #fff;
  border-width: 2;
  border-style: solid;
  background-color: #3279a0;
  color: #cff2f8;
}

.acesso-azul:hover {
  background-color: #428bb3;
  color: #cff2f8;
}

.acesso-verde {
  border-color: #fff;
  border-width: 2;
  border-style: solid;
  background-color: #5baa0e;
  color: #cff2f8;
}

.acesso-verde:hover {
  background-color: #6dc01a;
  color: #cff2f8;
}

#rodape {
  background-color: #3279a0;
  color: #cff2f8;
}

#rodape a {
  text-decoration: none;
  color: #cff2f8;
}

/* ==========================
   MENU (Bootstrap Navbar + Dropdown)
   Consolidado (sem regras repetidas)
   Requer:
   - <ul class="... menu-tiles">
   - links com class="nav-link menu-tile-link ..."
   - subitens com class="dropdown-item"
   ========================== */

/* Layout igual ao antigo: 1 / 3 / 6 colunas */
.menu-tiles > li.nav-item{
  flex: 0 0 100% !important;
  max-width: 100% !important;
}

@media (min-width: 576px){
  .menu-tiles > li.nav-item{
    flex: 0 0 calc(33.333% - .5rem) !important;
    max-width: calc(33.333% - .5rem) !important;
  }
}

@media (min-width: 992px){
  .menu-tiles > li.nav-item{
    flex: 0 0 calc(16.666% - .5rem) !important;
    max-width: calc(16.666% - .5rem) !important;
  }
}

/* Link do tile: mesma altura/largura para itens com e sem dropdown */
.menu-tiles .menu-tile-link{
  width: 100% !important;
  height: 72px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;

  position: relative;
  padding: 1rem 2.2rem 1rem 1rem !important; /* reserva espaço pro caret */
  color: #cff2f8 !important;
  text-decoration: none !important;
}

/* caret fora do fluxo (não altera o “miolo” do tile) */
.menu-tiles .menu-tile-link.dropdown-toggle::after{
  position: absolute;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
  margin-left: 0 !important;
  vertical-align: 0 !important;
  border-top-color: #cff2f8;
}

/* Dropdown com o mesmo tema do menu */
.menu-tiles .dropdown-menu{
  background: #4390b9;
  border: 1px solid #ffffff;
  border-radius: 0;
  padding: .25rem 0;
  z-index: 1050;
}

/* Subitens (agora com highlight funcionando) */
.menu-tiles .dropdown-item{
  color: #cff2f8;
  text-align: center;
  padding: .75rem 1rem;
}

.menu-tiles .dropdown-item:hover,
.menu-tiles .dropdown-item:focus{
  background: rgba(0,0,0,.12);
  color: #cff2f8;
}

/* Corrige tamanho dos tiles com dropdown no menu */
.menu-tiles > li.dropdown {
  padding: 0 !important;
}

/* Submenus: alinhar à esquerda e quebrar linha */
.menu-tiles .dropdown-item{
  text-align: left !important;
  white-space: normal !important;     /* permite quebrar linha */
  overflow-wrap: anywhere;            /* quebra palavras longas */
  word-break: break-word;             /* fallback */
  line-height: 1.25;                  /* melhora leitura em 2+ linhas */
}

/* (opcional) um “respiro” à esquerda */
.menu-tiles .dropdown-item{
  padding-left: 1rem;
  padding-right: 1rem;
}

.menu-tiles .dropdown-menu { width: 100%; }

.card-quadro {
  width: 100%;
  height: 220px;

  display: flex;
  align-items: center;
  justify-content: center;

  text-align: center;
  color: #fff;
  font-size: 1.2rem;
  font-weight: 300;
  text-decoration: none;

  padding: 1rem;
  transition: transform 0.2s ease, opacity 0.2s ease;
}

.objetivo-link {
    transition: transform 0.3s ease, filter 0.3s ease;
    display: block; /* Garante que o link ocupe todo o espaço da coluna */
}

.objetivo-link:hover {
    transform: scale(1.05); /* Aumenta 5% o tamanho */
    filter: brightness(1.1); /* Dá um leve brilho */
    z-index: 10; /* Garante que o quadro fique por cima dos vizinhos ao crescer */
    position: relative;
}

a.card-quadro,
a.card-quadro:link,
a.card-quadro:visited,
a.card-quadro:hover,
a.card-quadro:active,
a.card-quadro:focus {
  color: #fff;
  text-decoration: none;
}

/* Azul */
.quadro-azul {
  background-color: #0077a3;
}

/* Verde */
.quadro-verde {
  background-color: #16a600;
}

/* Cinza (desativado) */
.quadro-cinza {
  background-color: #b5b5b5;
  cursor: not-allowed;
  opacity: 0.7;
}

/* Hover apenas para links ativos */
a.card-quadro:hover {
  transform: translateY(-4px);
  opacity: 0.9;
}

/* Cor base do card (Azul Petróleo da imagem) */
.custom-card {
    background-color: #0076a3; 
    transition: all 0.3s ease-in-out;
    cursor: pointer;
}

/* Efeito de Highlight ao passar o mouse */
.custom-card:hover {
    background-color: #008fbc;
    transform: translateY(-8px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.2);
}

/* Ajuste para que a imagem não "suma" com o brilho */
.custom-card img {
    transition: transform 0.3s ease;
}

.custom-card:hover img {
    transform: scale(1.1);
}

.custom-card {
    background-color: #0076a3; /* Tom de azul da sua imagem */
    transition: transform 0.3s ease, background-color 0.3s ease, box-shadow 0.3s ease;
    cursor: pointer;
}

.custom-card:hover {
    background-color: #008fbc; /* Azul um pouco mais claro no hover */
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.2);
}

.custom-card img {
    transition: transform 0.3s ease;
}

.custom-card:hover img {
    transform: scale(1.1);
}