/* ==========================================================
   TEMA ESCURO — Gestão CRM
   Este arquivo sobrescreve as cores do Tailwind já compiladas,
   sem precisar rodar npm run build de novo.
   ========================================================== */

html, body {
    background-color: #0f172a !important;
}

/* Fundos */
.bg-gray-100 { background-color: #0f172a !important; }
.bg-gray-50  { background-color: #1e293b !important; }
.bg-white    { background-color: #1e293b !important; color: #e2e8f0 !important; }

/* Bordas */
.border-gray-100,
.border-gray-200,
.border-gray-300 { border-color: #334155 !important; }

.divide-gray-100 > :not([hidden]) ~ :not([hidden]),
.divide-gray-200 > :not([hidden]) ~ :not([hidden]) { border-color: #334155 !important; }

/* Textos */
.text-gray-900, .text-gray-800, .text-gray-700 { color: #e2e8f0 !important; }
.text-gray-600, .text-gray-500 { color: #94a3b8 !important; }
.text-gray-400 { color: #64748b !important; }

/* Sombras mais visíveis no fundo escuro */
.shadow, .shadow-sm, .shadow-md, .shadow-lg { box-shadow: 0 2px 6px rgba(0,0,0,0.5) !important; }

/* Campos de formulário */
input[type="text"], input[type="email"], input[type="password"], input[type="number"],
input[type="date"], input[type="search"], input[type="tel"], input[type="url"],
select, textarea {
    background-color: #0f172a !important;
    color: #e2e8f0 !important;
    border-color: #334155 !important;
}
input::placeholder, textarea::placeholder { color: #64748b !important; }
input:focus, select:focus, textarea:focus {
    border-color: #6366f1 !important;
    box-shadow: 0 0 0 1px #6366f1 !important;
}

/* Corrige os controles nativos do navegador (setinhas de número, ícone de calendário)
   que ficavam claros/quebrados em cima do fundo escuro */
input[type="number"], input[type="date"], input[type="datetime-local"] {
    color-scheme: dark;
}

/* Campos dentro de tabelas (ex: itens do orçamento) — um pouco mais de respiro */
table input, table select {
    min-width: 70px;
    padding: 6px 8px !important;
}
table input[type="file"] {
    min-width: 0;
    color: #94a3b8 !important;
}

/* Navegação e cabeçalhos */
nav { background-color: #1e293b !important; border-color: #334155 !important; }
header { background-color: #1e293b !important; }

/* Botões cinza (secundários) */
.bg-gray-800 { background-color: #111827 !important; }
.bg-gray-200 { background-color: #334155 !important; color: #e2e8f0 !important; }
.hover\:bg-gray-100:hover,
.hover\:bg-gray-200:hover { background-color: #334155 !important; }
.hover\:bg-gray-50:hover  { background-color: #1e293b !important; }

/* Tabelas */
thead.bg-gray-50 { background-color: #0f172a !important; }
tbody tr:hover { background-color: #263449 !important; }

/* Dropdowns (menu do usuário, Financeiro) */
.ring-1.ring-black { box-shadow: 0 0 0 1px #334155, 0 4px 12px rgba(0,0,0,0.5) !important; }

/* Cards de cartões de resumo com fundo colorido leve (verde/vermelho/etc.) 
   ficam com fundo levemente escurecido, mantendo o texto colorido legível */
.bg-green-50  { background-color: #052e1c !important; }
.bg-red-50    { background-color: #2f1113 !important; }
.bg-indigo-50 { background-color: #1e1b3a !important; }
.bg-green-100 { background-color: #0a3d24 !important; }
.bg-red-100   { background-color: #3a1518 !important; }
.bg-slate-100 { background-color: #1e293b !important; }
.bg-blue-100  { background-color: #14243d !important; }

/* Logo/ícone da aplicação (originalmente preto) fica visível no fundo escuro */
.text-gray-800.fill-current,
svg.fill-current { color: #e2e8f0 !important; }

/* Barra de rolagem mais fina e discreta */
* {
    scrollbar-width: thin;
    scrollbar-color: #475569 #1e293b;
}
*::-webkit-scrollbar {
    height: 10px;
    width: 10px;
}
*::-webkit-scrollbar-track {
    background: #1e293b;
}
*::-webkit-scrollbar-thumb {
    background-color: #475569;
    border-radius: 6px;
    border: 2px solid #1e293b;
}
*::-webkit-scrollbar-thumb:hover {
    background-color: #64748b;
}

/* Ajustes gerais para celular: toque mais fácil, rolagem de tabelas mais suave */
@media (max-width: 640px) {
    /* Tabelas ficam com rolagem horizontal suave (arrastar com o dedo) */
    .overflow-x-auto {
        -webkit-overflow-scrolling: touch;
    }
    table {
        font-size: 13px;
    }
    /* Botões e links de ação em tabelas/listas ficam maiores, mais fáceis de tocar */
    table td a, table td button {
        padding: 4px 2px;
        display: inline-block;
    }
    /* Formulários com 2 colunas continuam ocupando a largura toda (empilhados) */
    .max-w-7xl, .max-w-5xl, .max-w-4xl, .max-w-3xl, .max-w-2xl {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
}
