/* Tema visual oficial da Compumaq Tecnologia (claro, com dourado como
   assinatura da marca - substitui a versao anterior em preto/dourado,
   pesada demais pro uso diario) - aplicado a TODAS as telas do Portal,
   sobrescrevendo os componentes padrao do Bootstrap 5 (carregado via
   CDN em cada view). Incluido em toda página depois do link do
   bootstrap.min.css, então as regras abaixo (mesma especificidade de
   classe) vencem por ordem de carregamento. */

:root {
  --cq-bg: #f6f2ea;
  --cq-surface: #ffffff;
  --cq-surface-alt: #f1ead9;
  --cq-texto: #2b2420;
  --cq-texto-suave: #8a7f6f;
  --cq-dourado: #a1762e;
  --cq-dourado-escuro: #85601f;
  --cq-dourado-fill: #c9a24d;
  --cq-dourado-fill-hover: #b8903f;
  --cq-texto-no-dourado: #2b2107;
  --cq-borda: rgba(161, 118, 46, 0.2);
  --cq-borda-forte: rgba(161, 118, 46, 0.42);
}

body {
  background: var(--cq-bg);
  color: var(--cq-texto);
}

a {
  color: var(--cq-dourado);
}
a:hover {
  color: var(--cq-dourado-escuro);
}

h1, h2, h3, h4, h5, h6, .text-dark {
  color: var(--cq-texto) !important;
}

.text-muted {
  color: var(--cq-texto-suave) !important;
}

hr {
  border-color: var(--cq-borda);
}

.border,
.border-top,
.border-bottom,
.border-start,
.border-end {
  border-color: var(--cq-borda) !important;
}

/* ---- Navbar (fora daqui, .navbar-dourado ja e definida por view - isto
   cobre navbars que nao tenham essa classe explicita) ---- */
.navbar-light {
  background: var(--cq-surface) !important;
  border-color: var(--cq-borda) !important;
}
.navbar-light .navbar-brand,
.navbar-light .nav-link {
  color: var(--cq-texto) !important;
}

/* ---- Cards / paineis ---- */
.card {
  background: var(--cq-surface);
  border: 1px solid var(--cq-borda);
  color: var(--cq-texto);
}
.card-header, .card-footer {
  background: var(--cq-surface-alt);
  border-color: var(--cq-borda);
}
.card-title, .card-text {
  color: var(--cq-texto);
}

/* ---- Tabelas ---- */
.table {
  color: var(--cq-texto);
  border-color: var(--cq-borda);
  --bs-table-bg: transparent;
  --bs-table-color: var(--cq-texto);
  --bs-table-striped-bg: rgba(161, 118, 46, 0.05);
  --bs-table-striped-color: var(--cq-texto);
  --bs-table-hover-bg: rgba(161, 118, 46, 0.09);
  --bs-table-hover-color: var(--cq-texto);
  --bs-table-border-color: var(--cq-borda);
}
.table thead th {
  background: var(--cq-surface-alt);
  color: var(--cq-texto-suave);
  border-color: var(--cq-borda);
  text-transform: uppercase;
  font-size: 0.78rem;
  letter-spacing: 0.03em;
}
.table > :not(caption) > * > * {
  border-bottom-color: var(--cq-borda);
}
.table-responsive {
  border-radius: 0.5rem;
}

/* ---- Formularios ---- */
.form-control,
.form-select {
  background-color: var(--cq-surface);
  border: 1px solid var(--cq-borda);
  color: var(--cq-texto);
}
.form-control:focus,
.form-select:focus {
  background-color: var(--cq-surface);
  color: var(--cq-texto);
  border-color: var(--cq-dourado);
  box-shadow: 0 0 0 0.2rem var(--cq-borda);
}
.form-control::placeholder {
  color: var(--cq-texto-suave);
  opacity: 0.8;
}
.form-control:disabled,
.form-select:disabled,
.form-control[readonly] {
  background-color: var(--cq-surface-alt);
  color: var(--cq-texto-suave);
}
.form-label {
  color: var(--cq-texto-suave);
}
.form-check-input {
  background-color: var(--cq-surface);
  border-color: var(--cq-borda-forte);
}
.form-check-input:checked {
  background-color: var(--cq-dourado-fill);
  border-color: var(--cq-dourado-fill);
}
.form-check-label {
  color: var(--cq-texto);
}
.input-group-text {
  background: var(--cq-surface-alt);
  border-color: var(--cq-borda);
  color: var(--cq-texto-suave);
}

/* ---- Botoes ---- */
.btn-primary {
  background-color: var(--cq-dourado-fill);
  border-color: var(--cq-dourado-fill);
  color: var(--cq-texto-no-dourado);
  font-weight: 600;
}
.btn-primary:hover,
.btn-primary:active,
.btn-primary:focus {
  background-color: var(--cq-dourado-fill-hover);
  border-color: var(--cq-dourado-fill-hover);
  color: var(--cq-texto-no-dourado);
}
.btn-outline-primary {
  color: var(--cq-dourado);
  border-color: var(--cq-dourado);
}
.btn-outline-primary:hover {
  background-color: var(--cq-dourado-fill);
  border-color: var(--cq-dourado-fill);
  color: var(--cq-texto-no-dourado);
}
.btn-secondary,
.btn-outline-secondary {
  color: var(--cq-texto);
  border-color: var(--cq-borda-forte);
  background-color: transparent;
}
.btn-secondary {
  background-color: var(--cq-surface-alt);
}
.btn-outline-secondary:hover,
.btn-secondary:hover {
  background-color: var(--cq-surface-alt);
  color: var(--cq-texto);
  border-color: var(--cq-dourado);
}
.btn-light {
  background-color: var(--cq-surface-alt);
  border-color: var(--cq-borda);
  color: var(--cq-texto);
}
.btn-link {
  color: var(--cq-dourado);
}

/* ---- Badges ---- */
.badge.bg-primary {
  background-color: var(--cq-dourado-fill) !important;
  color: var(--cq-texto-no-dourado) !important;
}
.badge.bg-secondary {
  background-color: var(--cq-surface-alt) !important;
  color: var(--cq-texto) !important;
}
.badge.bg-light {
  background-color: var(--cq-surface-alt) !important;
  color: var(--cq-texto) !important;
}

/* ---- Modais ---- */
.modal-content {
  background: var(--cq-surface);
  color: var(--cq-texto);
  border: 1px solid var(--cq-borda);
}
.modal-header, .modal-footer {
  border-color: var(--cq-borda);
}

/* ---- Dropdown ---- */
.dropdown-menu {
  background: var(--cq-surface);
  border: 1px solid var(--cq-borda);
}
.dropdown-item {
  color: var(--cq-texto);
}
.dropdown-item:hover,
.dropdown-item:focus {
  background: rgba(161, 118, 46, 0.09);
  color: var(--cq-texto);
}
.dropdown-divider {
  border-color: var(--cq-borda);
}

/* ---- Abas (nav-tabs / nav-pills) ---- */
.nav-tabs {
  border-color: var(--cq-borda);
}
.nav-tabs .nav-link {
  color: var(--cq-texto-suave);
  border: 1px solid transparent;
}
.nav-tabs .nav-link:hover {
  border-color: var(--cq-borda);
  color: var(--cq-texto);
}
.nav-tabs .nav-link.active {
  background: var(--cq-surface);
  border-color: var(--cq-borda) var(--cq-borda) var(--cq-surface);
  color: var(--cq-dourado);
}
.nav-pills .nav-link.active {
  background-color: var(--cq-dourado-fill);
  color: var(--cq-texto-no-dourado);
}

/* ---- Lista ---- */
.list-group-item {
  background: var(--cq-surface);
  border-color: var(--cq-borda);
  color: var(--cq-texto);
}
.list-group-item.active {
  background: var(--cq-dourado-fill);
  border-color: var(--cq-dourado-fill);
  color: var(--cq-texto-no-dourado);
}

/* ---- Paginacao ---- */
.page-link {
  background: var(--cq-surface);
  border-color: var(--cq-borda);
  color: var(--cq-texto);
}
.page-link:hover {
  background: var(--cq-surface-alt);
  color: var(--cq-dourado);
}
.page-item.active .page-link {
  background: var(--cq-dourado-fill);
  border-color: var(--cq-dourado-fill);
  color: var(--cq-texto-no-dourado);
}
.page-item.disabled .page-link {
  background: var(--cq-surface);
  color: var(--cq-texto-suave);
}

/* ---- Fundos utilitarios do Bootstrap usados soltos nas telas ---- */
.bg-light {
  background-color: var(--cq-surface-alt) !important;
  color: var(--cq-texto);
}
.shadow-sm {
  box-shadow: 0 2px 10px rgba(43, 36, 32, 0.08) !important;
}

/* ---- Spinner ---- */
.spinner-border.text-primary {
  color: var(--cq-dourado) !important;
}