/* Cores Primárias Personalizadas */
:root {
    --brand-primary: #2f9e5c;
    --brand-secondary: #247d47;
    --brand-primary-light: #57c684;
    --brand-primary-dark: #1b8a48;
    --brand-primary-darker: #077634;
}

/* Botões Primários */
/* O terceiro seletor pintava TODO botão de submit com a cor da marca. A lista
   de exceções só previa quatro classes de fundo do Tailwind, então qualquer
   botão de componente próprio caía nela: os `icon-btn icon-btn-danger` de
   deletar módulo e aula viravam quadrados verdes preenchidos (o ícone
   `x-circle` em cima do verde virava um símbolo de proibido), e o "Deletar"
   dos cards de produto ficava verde em vez de vermelho.
   As exclusões abaixo poupam qualquer botão que já declare o próprio visual -
   classe de fundo do Tailwind, `btn-*`, `icon-btn*` ou `card-action*`. */
.btn-primary,
.bg-orange-500,
button[type="submit"]:not([class*="bg-"]):not([class*="btn-"]):not([class*="icon-btn"]):not([class*="card-action"]) {
    background: linear-gradient(to left, #2f9e5c, #247d47) !important;}

/* Hover em Botões */
.btn-primary:hover,
.bg-orange-500:hover,
button[type="submit"]:hover:not([class*="bg-"]):not([class*="btn-"]):not([class*="icon-btn"]):not([class*="card-action"]) {
        background: linear-gradient(to left, #57c684, #247d47) !important;
    }

/* Links Ativos e Destaques */
.text-orange-500,
.text-orange-600,
.text-orange-700 {
    color: #2f9e5c !important;
}

/* Bordas */
.border-orange-500,
.border-orange-600 {
    border-color: #2f9e5c !important;
}

/* Backgrounds Claros */
.bg-orange-50,
.bg-orange-100 {
    background-color: #2f9e5c15 !important;
}

/* Hover em Links do Menu */
.hover\:bg-orange-100:hover,
.hover\:text-orange-700:hover {
    background-color: #2f9e5c20 !important;
    color: #1b8a48 !important;
}

/* Menu Lateral Ativo
   Os dois temas tratam o item selecionado de formas diferentes, de propósito:

   - Claro: pastilha cinza clara, barra da marca à esquerda, texto e ícone
     pretos. No fundo branco do painel, a pastilha sólida colorida com texto
     branco vira uma mancha e o rótulo perde legibilidade.
   - Escuro: a pastilha sólida na cor da marca com texto branco funciona, e
     é o que estava aqui antes. Fica.

   Antes destas regras havia um bloco único, sem separar tema, que pintava os
   dois iguais. */
html:not(.dark) .admin-sidebar-active-link,
html:not(.dark) .sidebar-active-link {
    background: #e8edeb !important;
    box-shadow: none !important;
}

html:not(.dark) .admin-sidebar-active-link::after,
html:not(.dark) .sidebar-active-link::after {
    background-color: #2f9e5c !important;
    box-shadow: none !important;
    width: 3px !important;
}

html.dark .admin-sidebar-active-link,
html.dark .sidebar-active-link {
        background: linear-gradient(to right, #2f9e5c 0%, #247d47 100%) !important;
        box-shadow: 0 4px 15px #2f9e5c40 !important;
}

html.dark .admin-sidebar-active-link::after,
html.dark .sidebar-active-link::after {
    background-color: #2f9e5c !important;
    box-shadow: 0 0 10px #2f9e5c, 0 0 20px #2f9e5c !important;
}

/* Badges e Tags */
.bg-orange-500\/20 {
    background-color: #2f9e5c33 !important;
}

.border-orange-500\/30 {
    border-color: #2f9e5c4D !important;
}

/* Gradientes de Texto */
.bg-gradient-to-r.from-orange-400.to-orange-200 {
    background: linear-gradient(to right, #57c684, #2f9e5cCC) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
}

/* Sombras */
.shadow-orange-500\/30,
.shadow-orange-500\/40 {
    box-shadow: 0 10px 15px -3px #2f9e5c4D, 0 4px 6px -2px #2f9e5c33 !important;
}

/* Focus em Inputs */
.modern-input:focus {
    border-color: #2f9e5c !important;
    box-shadow: 0 4px 20px -2px #2f9e5c26 !important;
}

.modern-input:focus + .input-icon,
.modern-input:focus ~ .input-icon {
    color: #2f9e5c !important;
}

/* Checkbox Customizado */
.custom-checkbox input:checked + div {
    background-color: #2f9e5c !important;
    border-color: #2f9e5c !important;
}

/* Notificações */
.notification-badge {
    background-color: #2f9e5c !important;
}

/* Ring Focus */
.peer-focus\:ring-orange-200:focus,
.focus\:ring-orange-200:focus {
    --tw-ring-color: #2f9e5c33 !important;
}

/* Hover em Bordas */
.group-hover\:border-orange-400:hover {
    border-color: #57c684 !important;
}

/* Meta Tag Theme Color */
meta[name="theme-color"] {
    content: "#2f9e5c" !important;
}

/* Gradiente em Botões */
.btn-primary::before {
        background: linear-gradient(135deg, #57c684 0%, #2f9e5c 100%) !important;
    }

/* Tailwind Config Override */
.bg-orange-600 {
    background-color: #247d47 !important;
}

.text-orange-400 {
    color: #57c684 !important;
}

/* Cor Secundária em Elementos Específicos */
.bg-orange-600,
.text-orange-600 {
    background-color: #247d47 !important;
}

/* Hover com Cor Secundária */
.hover\:bg-orange-600:hover {
    background-color: #247d47 !important;
}

/* Bordas com Cor Secundária */
.border-orange-600 {
    border-color: #247d47 !important;
}

/* Sombras com Cor Secundária */
.shadow-orange-600\/30 {
    box-shadow: 0 10px 15px -3px #247d474D, 0 4px 6px -2px #247d4733 !important;
}

/* Notificação Card Border */
.border-l-4.border-orange-500 {
    border-left-color: #2f9e5c !important;
}

/* PWA Splash Screen */
.bg-slate-900 {
    /* Mantém o fundo escuro */
}

/* Ícone e rótulo do item selecionado - segue a mesma divisão por tema do
   bloco "Menu Lateral Ativo" acima: preto no claro, branco no escuro. */
html:not(.dark) .admin-sidebar-active-link i[data-lucide],
html:not(.dark) .admin-sidebar-active-link svg,
html:not(.dark) .admin-sidebar-active-link span,
html:not(.dark) .sidebar-active-link i[data-lucide],
html:not(.dark) .sidebar-active-link svg,
html:not(.dark) .sidebar-active-link span {
    color: #101815 !important;
    stroke: #101815 !important;
    font-weight: 700 !important;
}

html.dark .admin-sidebar-active-link i[data-lucide],
html.dark .admin-sidebar-active-link svg,
html.dark .admin-sidebar-active-link span,
html.dark .sidebar-active-link i[data-lucide],
html.dark .sidebar-active-link svg,
html.dark .sidebar-active-link span {
    color: #ffffff !important;
    stroke: #ffffff !important;
}

/* Badge "PAINEL ADMIN" */
.text-orange-600.bg-orange-100 {
    color: #2f9e5c !important;
    background-color: #2f9e5c15 !important;
}

/* Botão "Salvar Configurações" */
.bg-black {
    background-color: #000000 !important;
}

/* Botão "Restaurar Padrão" com borda */
.border-gray-300 {
    border-color: #d1d5db !important;
}

/* Inputs de Cor */
input[type="color"] {
    cursor: pointer;
}

/* Preview do Gradiente */
.rounded-lg.h-20 {
    border-radius: 0.5rem;
}

/* Checkbox de Gradiente */
input[type="checkbox"]:checked {
    background-color: #2f9e5c !important;
    border-color: #2f9e5c !important;
}

/* ===== ÍCONES DO DASHBOARD - Cor Primária do Admin ===== */
.stat-icon-box {
    /* Fundo removido para deixar apenas o ícone sem quadrado colorido */
}

/* Cor dos ícones Lucide dentro do cartão de métrica.
   Cada cartão pode declarar --accent no style para dar cor semântica ao seu
   ícone (âmbar em "Pendentes", vermelho em "Rejeitadas"); sem --accent, cai na
   cor da marca, que é o caso do dashboard do produtor. Antes daqui a cor da
   marca vinha fixa com !important e engolia o --accent, deixando os seis
   cartões do admin com o mesmo verde, sem distinguir estado. */
.stat-icon-box svg,
.stat-icon-box svg path,
.stat-icon-box svg line,
.stat-icon-box svg polyline,
.stat-icon-box svg polygon,
.stat-icon-box svg rect,
.stat-icon-box svg circle,
.stat-icon-box svg ellipse {
    color: var(--accent, #2f9e5c) !important;
    stroke: var(--accent, #2f9e5c) !important;
}

.stat-icon-box i[data-lucide],
.stat-icon-box [data-lucide] {
    color: var(--accent, #2f9e5c) !important;
}

/* Os cards do dashboard tinham aqui .stat-value-modern em #ffffff, o rótulo
   em #94a3b8 e os títulos em #f1f5f9, todos !important - sobras da época em
   que o painel só existia no tema escuro. Em fundo branco isso é valor branco
   sobre card branco. As cores saíram: o dashboard.php já define as mesmas
   classes com var(--text-primary)/var(--text-tertiary), que acertam nos dois
   temas. Este arquivo cuida da cor de MARCA, não dos neutros. */

/* Barra de progresso e decorações */
.stat-card-modern::before,
.section-title-modern::before {
    background: linear-gradient(90deg, #2f9e5c, #247d47) !important;
}

.stat-card-modern:hover {
    box-shadow: 0 20px 40px -10px #2f9e5c4D !important;
    border-color: #2f9e5c4D !important;
}

/* Botões de filtro ativos */
.filter-btn-modern.active {
    background: linear-gradient(135deg, #2f9e5c, #247d47) !important;
}

/* ===== REMOVER FUNDO COLORIDO DOS ÍCONES SVG GLOBALMENTE ===== */
/* Remove qualquer fundo aplicado diretamente nos elementos SVG e ícones Lucide */
svg,
svg *,
i[data-lucide],
i[data-lucide] *,
[data-lucide],
[data-lucide] * {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
}

/* Remove fundo de containers de ícones no admin */
.dark svg,
.dark svg *,
.dark i[data-lucide],
.dark i[data-lucide] *,
.dark [data-lucide],
.dark [data-lucide] * {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
}

/* Força transparência em ícones dentro de cards de estatísticas */
.rounded-xl svg,
.rounded-xl i[data-lucide],
.rounded-lg svg,
.rounded-lg i[data-lucide],
.shadow-sm svg,
.shadow-sm i[data-lucide] {
    background: transparent !important;
    background-color: transparent !important;
}

/* Garantir que textos coloridos não tenham fundo */
.text-orange-500,
.text-orange-600,
.text-orange-400,
span.text-orange-500,
span.text-orange-600,
span.text-orange-400 {
    background: transparent !important;
    background-color: transparent !important;
}