/* TV CUBO — CENTRAL DE CONTAS
   Camada visual independente do CSS original do Wizarr.
*/

:root {
  --tvcubo-navy: #101827;
  --tvcubo-blue: #087fae;
  --tvcubo-cyan: #35c8ff;
  --tvcubo-magenta: #d946ef;
  --tvcubo-text: #172033;
  --tvcubo-radius: 13px;
}

/* Identidade principal */
.bg-primary {
  background-color: var(--tvcubo-blue) !important;
}

.text-primary {
  color: var(--tvcubo-blue) !important;
}

.hover\:text-primary:hover {
  color: var(--tvcubo-cyan) !important;
}

/* Navegação */
nav {
  border-bottom: 1px solid rgba(8, 127, 174, .16);
  box-shadow: 0 3px 16px rgba(16, 24, 39, .045);
}

.nav-btn {
  border-radius: 10px !important;
  transition: background .2s ease, color .2s ease, box-shadow .2s ease;
}

.nav-btn.bg-primary {
  background: linear-gradient(115deg, #087fae, #075985) !important;
  box-shadow: 0 4px 12px rgba(8, 127, 174, .22);
}

/* Botões principais */
button.bg-primary,
a.bg-primary {
  border-radius: 10px;
  box-shadow: 0 4px 12px rgba(8, 127, 174, .15);
  transition: transform .18s ease, box-shadow .18s ease;
}

button.bg-primary:hover,
a.bg-primary:hover {
  box-shadow: 0 6px 17px rgba(8, 127, 174, .25);
  transform: translateY(-1px);
}

/* Cartões e painéis */
#content .bg-white,
#content .dark\:bg-gray-800 {
  border-radius: var(--tvcubo-radius);
}

#content .shadow,
#content .shadow-md,
#content .shadow-lg {
  box-shadow: 0 5px 18px rgba(16, 24, 39, .075);
}

/* Campos de formulário */
input,
select,
textarea {
  border-radius: 9px !important;
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--tvcubo-cyan) !important;
  box-shadow: 0 0 0 3px rgba(53, 200, 255, .15) !important;
}

/* Barra institucional */
#support-banner {
  min-height: 62px;
  padding: 10px 18px;
  border-top: 1px solid rgba(53, 200, 255, .5);
  box-shadow: 0 -4px 18px rgba(8, 127, 174, .08);
}

/* Cabeçalho e marca */
nav img[alt="TV CUBO"],
header img[alt="TV CUBO"] {
  object-fit: contain;
  filter: drop-shadow(0 2px 5px rgba(8, 127, 174, .16));
}

/* Tema escuro */
.dark nav {
  background-color: var(--tvcubo-navy);
  border-bottom-color: rgba(53, 200, 255, .2);
}

.dark #content .bg-white {
  border: 1px solid rgba(53, 200, 255, .10);
}

/* Acessibilidade: respeitar redução de movimento */
@media (prefers-reduced-motion: reduce) {
  .nav-btn,
  button.bg-primary,
  a.bg-primary {
    transition: none;
    transform: none;
  }
}

/* Telas menores */
@media (max-width: 767px) {
  #support-banner {
    gap: 8px;
    padding: 12px;
    text-align: center;
  }
}