body {
    background-color: #f8f9fa;
}
h1 {
    color: #393939;
}
th {
    cursor: pointer;
}
th:hover {
    background-color: #adb5bd !important;
}
.logo {
    max-width: 360px;  /* Ajusta o tamanho do logo */
    margin-bottom: 20px;
}
.label-custom {
    font-weight: bold;  /* Negrito */
    color: #1f8700;  /* Vermelho Bootstrap */
}
/* Estiliza o <select> conforme a opção escolhida */
select {
    font-weight: bold;
    padding: 8px;
    border-radius: 5px;
}

/* Estiliza cada opção quando selecionada */
select option {
    font-weight: bold;
}

/* Muda a cor do texto do <select> conforme a opção */

.select-status[value="Novo"] {
    color: blue;
}

.select-status[value="Negociando"] {
    color: orange;
}

.select-status[value="Fechado"] {
    color: green;
}

.select-status[value="Cancelado"] {
    color: rgb(255, 0, 0);
}


.status {
    font-weight: bold;
    padding: 5px 10px;
    border-radius: 5px;
    display: inline-block;
}

.status-novo {
    color: white;
    background-color: blue;
}

.status-negociando {
    color: white;
    background-color: orange;
}

.status-fechado {
    color: white;
    background-color: green;
}

.status-cancelado {
    color: rgb(255, 255, 255);
    background-color: rgb(255, 0, 0);
}

.btn-custom {
    background: linear-gradient(45deg, #6a11cb, #2575fc);
    color: white;
    border: none;
}
.btn-custom:hover {
    background: linear-gradient(45deg, #2575fc, #6a11cb);
}

.btn-edit {
    background: linear-gradient(45deg, #05a730, #6abc90);
    color: white;
    border: none;
}
.btn-edit:hover {
    background: linear-gradient(45deg, #6abc90, #05a730);
}

.btn-group {
    display: flex;
    gap: 5px; /* Espaçamento entre os botões */
}

th {
    text-align: center !important;
}

    .table-container {
        max-width: 100%;
        overflow-x: auto; /* Adiciona rolagem horizontal se necessário */
    }
    
    table {
        width: 100%; /* Faz a tabela ocupar toda a largura disponível */
        table-layout: auto; /* Mantém a distribuição automática */
    }

    th, td {
        white-space: nowrap; /* Evita que os textos quebrem em várias linhas */
        text-align: center; /* Centraliza os dados */
    }


    /* Ajuste do logotipo */
   .logo {
            max-width: 200px; /* Define um tamanho máximo */
            height: auto; /* Mantém a proporção */
            display: block;
            margin: 10px auto;
        }


.table-responsive {
    overflow-x: auto; /* Ativa a rolagem horizontal */
    max-width: 100%; /* Evita que a tabela ultrapasse o limite da página */
}



/* ANIMAÇÃO LOGIN CSS */

  .load-wrapp {
    float: auto;
    width: auto;
    height: 100px;
    margin: 0 10px 10px 0;
    padding: 20px 20px 20px;
    border-radius: 5px;
    text-align: center;
  }
  
  .load-wrapp p {
    padding: 10 10 10px;
  }
  .load-wrapp:last-child {
    margin-right: 100;
  }
  
  .line {
    display: inline-block;
    width: 15px;
    height: 15px;
    border-radius: 15px;
    background-color: #4b9cdb;
  }
  
  /* =Animate the stuff
  ------------------------ */
  .load-1 .line:nth-last-child(1) {
    animation: loadingA 1.5s 1s infinite;
  }
  .load-1 .line:nth-last-child(2) {
    animation: loadingA 1.5s 0.5s infinite;
  }
  .load-1 .line:nth-last-child(3) {
    animation: loadingA 1.5s 0s infinite;
  }
  
  .l-1 {
    animation-delay: 0.48s;
  }
  
  @keyframes loadingA {
    0% {
        height: 15px;
    }
    50% {
        height: 35px;
    }
    100% {
        height: 15px;
    }
}

/* FIM ANIMAÇÃO LOGIN CSS */


/* =====================================================================
   PADRÃO DE TELA "LISTAGEM COM FILTROS" (clientes, orçamentos, leads...)
   Compartilhado por todas as telas que usam esse layout, pra manter uma
   cara só no sistema. Ver includes/header.php pro JS do toggle de filtros.
   ===================================================================== */

.page-title{ font-weight:700; letter-spacing:.2px; }

.kpi-pill{
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.4rem .8rem;
  border-radius:999px;
  font-size:.82rem;
  font-weight:600;
  border:1px solid var(--bs-border-color);
  background: var(--bs-body-bg);
}
.kpi-pill .val{ font-weight:800; }
.kpi-pill.kpi-total{ color:#0d6efd; }
.kpi-pill.kpi-filtrado{ color:#198754; }

.filtros-card{ background: var(--bs-tertiary-bg, rgba(0,0,0,.02)); border-radius:.9rem; padding:1rem; }
.filtros-card .form-label{ font-size:.78rem; font-weight:600; color:var(--bs-secondary-color); text-transform:uppercase; letter-spacing:.03em; }
.filtros-hint{ font-size:.76rem; color:var(--bs-secondary-color); margin-top:.25rem; }

.filtros-toggle-label{ font-size:.78rem; font-weight:600; color:var(--bs-secondary-color); text-transform:uppercase; letter-spacing:.03em; }

.tabela-wrapper{
  position: relative;
  max-height: 70vh;
  overflow-y: auto;
  background: var(--bs-body-bg);
}
.tabela-wrapper::-webkit-scrollbar{ height: 12px; }

.table-sticky-head thead th{
  position: sticky;
  top: 0;
  z-index: 3;
  background: var(--bs-body-bg);
  box-shadow: inset 0 -1px 0 var(--bs-border-color);
}

.empty-state{ padding: 2.5rem 1rem; text-align:center; color: var(--bs-secondary-color); }
.empty-state i{ font-size:2rem; opacity:.5; display:block; margin-bottom:.5rem; }