/* Tema visual inspirado no Velzon (themesbrand.com), recriado do zero para o
   personalizadosflux: tipografia, cards, sidebar, topbar, badges, tabelas e
   componentes no estilo do Velzon, mantendo a cor de marca do app (#1f8fe0)
   em vez do indigo padrão do tema original. Carregar DEPOIS do
   material-dashboard.min.css e do brand-overrides.css para sobrepor o visual
   "soft UI" do tema base sem alterar a estrutura/JS existente. */

:root {
    --vz-radius: .25rem;
    --vz-radius-md: .5rem;
    --vz-border: #e9ebec;
    --vz-body-bg: #f3f3f9;
    --vz-shadow-card: 0 2px 4px rgba(15, 34, 58, .12);
    --vz-shadow-pop: 0 4px 16px rgba(15, 34, 58, .14);
    --vz-muted: #878a99;
}

/* Tipografia — Public Sans é a fonte usada pelo Velzon */
html, body {
    font-family: 'Public Sans', -apple-system, "Segoe UI", Roboto, Arial, sans-serif !important;
}

h1, h2, h3, h4, h5, h6,
.font-weight-bolder, .font-weight-bold {
    font-family: 'Public Sans', -apple-system, "Segoe UI", Roboto, Arial, sans-serif !important;
}

body.bg-gray-100 {
    background-color: var(--vz-body-bg) !important;
}

/* Cards — Velzon usa sombra suave, sem borda, cantos pouco arredondados e
   divisor tracejado no cabeçalho */
.card {
    border: none !important;
    border-radius: var(--vz-radius) !important;
    box-shadow: var(--vz-shadow-card) !important;
}

.card .card-header {
    background-color: transparent !important;
    border-bottom: 1px dashed var(--vz-border) !important;
    padding: .9375rem 1.25rem !important;
}

.card .card-footer {
    background-color: transparent !important;
    border-top: 1px dashed var(--vz-border) !important;
}

.card.border-dashed {
    border: 1px dashed var(--vz-border) !important;
    box-shadow: none !important;
}

/* Botões — Velzon usa botões "achatados", sem gradiente/relevo e sem
   caixa-alta; a cor de marca do app é preservada em cada variante */
.btn {
    border-radius: var(--vz-radius) !important;
    font-weight: 500 !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    box-shadow: none !important;
}

.btn:hover, .btn:focus {
    box-shadow: 0 2px 6px rgba(15, 34, 58, .15) !important;
}

.btn.bg-gradient-dark { background: #0b2447 !important; border-color: #0b2447 !important; }
.btn.bg-gradient-dark:hover, .btn.bg-gradient-dark:focus { background: #081a33 !important; }

.btn.bg-gradient-primary, .btn.bg-gradient-info {
    background: #1f8fe0 !important;
    border-color: #1f8fe0 !important;
}
.btn.bg-gradient-primary:hover, .btn.bg-gradient-info:hover { background: #1a7cc4 !important; }

.btn.bg-gradient-success { background: #1f9d55 !important; border-color: #1f9d55 !important; }
.btn.bg-gradient-success:hover { background: #188044 !important; }

.btn.bg-gradient-warning { background: #fb8c00 !important; border-color: #fb8c00 !important; color: #fff !important; }
.btn.bg-gradient-warning:hover { background: #dd7a00 !important; }

.btn.bg-gradient-danger { background: #d64545 !important; border-color: #d64545 !important; }
.btn.bg-gradient-danger:hover { background: #b93a3a !important; }

.btn.bg-gradient-secondary { background: #8792a2 !important; border-color: #8792a2 !important; }
.btn.bg-gradient-secondary:hover { background: #717a8a !important; }

.btn-outline-dark { border-color: var(--vz-border) !important; color: #495057 !important; }

/* Badges — trocando o estilo "gradiente sólido" do tema base pelo badge
   "soft" (fundo clarinho + texto colorido) característico do Velzon */
.badge {
    font-weight: 600 !important;
    border-radius: 6px !important;
    letter-spacing: .2px;
}

.badge.bg-gradient-success, .badge.bg-success {
    background: rgba(31, 157, 85, .12) !important;
    color: #1f9d55 !important;
}
.badge.bg-gradient-warning, .badge.bg-warning {
    background: rgba(251, 140, 0, .14) !important;
    color: #c56f00 !important;
}
.badge.bg-gradient-danger, .badge.bg-danger {
    background: rgba(214, 69, 69, .12) !important;
    color: #d64545 !important;
}
.badge.bg-gradient-secondary, .badge.bg-secondary {
    background: rgba(107, 118, 134, .14) !important;
    color: #565f6f !important;
}
.badge.bg-gradient-primary, .badge.bg-gradient-info, .badge.bg-primary, .badge.bg-info {
    background: rgba(31, 143, 224, .12) !important;
    color: #1f8fe0 !important;
}

/* Formulários — mantém o mecanismo de label flutuante (input-group-outline)
   já usado no app, só suaviza cantos/sombra pro padrão Velzon */
.input-group.input-group-outline .form-control {
    border-radius: var(--vz-radius-md) !important;
    box-shadow: none !important;
}

.form-control, .form-select {
    border-radius: var(--vz-radius-md) !important;
}

/* Tabelas — cabeçalho discreto em caixa-alta, linhas com respiro maior e
   hover suave na cor de marca */
.table thead th {
    text-transform: uppercase;
    font-size: .7rem;
    letter-spacing: .4px;
    color: var(--vz-muted) !important;
    font-weight: 700 !important;
    background: transparent !important;
    border-bottom: 1px solid var(--vz-border) !important;
}

.table td, .table th {
    padding: .85rem .75rem !important;
    vertical-align: middle !important;
}

.table-hover > tbody > tr:hover > * {
    background-color: rgba(31, 143, 224, .04) !important;
}

/* Sidebar — recolore a navegação lateral no estilo Velzon (item ativo em
   "pill" suave na cor de marca com barra de destaque, ícones alinhados);
   mantém a "sidebar flutuante" já existente no layout para não mexer no
   posicionamento/breakpoints do tema base */
#sidenav-main {
    box-shadow: var(--vz-shadow-card) !important;
    border: 1px solid var(--vz-border) !important;
}

#sidenav-menu .nav-link {
    border-radius: var(--vz-radius-md) !important;
    color: var(--vz-muted) !important;
    font-weight: 500 !important;
    transition: background-color .15s ease, color .15s ease;
}

#sidenav-menu .nav-link:hover {
    background-color: rgba(31, 143, 224, .06) !important;
    color: #1f8fe0 !important;
}

#sidenav-menu .nav-link.active {
    background: rgba(31, 143, 224, .1) !important;
    color: #1f8fe0 !important;
    box-shadow: none !important;
    font-weight: 600 !important;
    position: relative;
}

#sidenav-menu .nav-link.active::before {
    content: "";
    position: absolute;
    left: -1px;
    top: 8px;
    bottom: 8px;
    width: 3px;
    border-radius: 0 3px 3px 0;
    background: #1f8fe0;
}

#sidenav-menu .nav-link i {
    color: inherit !important;
    opacity: 1 !important;
}

/* Topbar — remove o relevo pesado do tema base e deixa uma barra limpa com
   sombra bem sutil, como no Velzon */
.navbar-main {
    background: #fff !important;
    box-shadow: 0 1px 2px rgba(15, 34, 58, .08) !important;
    border: 1px solid var(--vz-border) !important;
}

/* Dropdowns */
.dropdown-menu {
    border: 1px solid var(--vz-border) !important;
    box-shadow: var(--vz-shadow-pop) !important;
    border-radius: var(--vz-radius) !important;
}

.dropdown-item:hover, .dropdown-item:focus {
    background-color: rgba(31, 143, 224, .06) !important;
    color: #1f8fe0 !important;
}

/* Modais */
.modal-content {
    border: none !important;
    border-radius: var(--vz-radius-md) !important;
    box-shadow: 0 10px 40px rgba(15, 34, 58, .2) !important;
}

.modal-header {
    border-bottom: 1px dashed var(--vz-border) !important;
}

.modal-footer {
    border-top: 1px dashed var(--vz-border) !important;
}

/* Breadcrumb */
.breadcrumb-item.active {
    color: var(--vz-muted) !important;
    font-weight: 500;
}

/* Alertas e paginação (reserva — estilo pronto caso passem a ser usados) */
.alert {
    border: none !important;
    border-radius: var(--vz-radius) !important;
}
.alert-success { background: rgba(31, 157, 85, .12) !important; color: #1f9d55 !important; }
.alert-danger { background: rgba(214, 69, 69, .12) !important; color: #d64545 !important; }
.alert-warning { background: rgba(251, 140, 0, .14) !important; color: #c56f00 !important; }
.alert-info, .alert-primary { background: rgba(31, 143, 224, .12) !important; color: #1f8fe0 !important; }

.page-link { color: #1f8fe0 !important; border-color: var(--vz-border) !important; }
.page-item.active .page-link { background: #1f8fe0 !important; border-color: #1f8fe0 !important; }

/* Cartões de estatística do dashboard/financeiro */
.stat-tile {
    border-radius: var(--vz-radius) !important;
    box-shadow: var(--vz-shadow-card) !important;
    border-left-width: 3px !important;
}

/* Scrollbar fina, como no Velzon */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #ced4da; border-radius: 8px; }
::-webkit-scrollbar-thumb:hover { background: #adb5bd; }