/* CSS para forçar modo dark como padrão */

/* Garantir que o HTML tenha a classe dark por padrão */
html {
    color-scheme: dark;
}

/* Aplicar modo dark por padrão se não estiver definido */
html:not([data-theme="light"]) {
    @apply dark;
}

/* Garantir que o body use o fundo escuro por padrão */
body {
    @apply bg-gray-900 text-white;
}

/* Estilos específicos para o componente de notificações push */
.push-notification-manager {
    @apply dark;
}

/* Garantir que os elementos do componente usem as cores corretas no modo dark */
.push-notification-manager .bg-white {
    @apply bg-gray-800;
}

.push-notification-manager .text-gray-600 {
    @apply text-gray-300;
}

.push-notification-manager .text-gray-700 {
    @apply text-gray-200;
}

.push-notification-manager .text-gray-900 {
    @apply text-white;
}

.push-notification-manager .border-gray-200 {
    @apply border-gray-600;
}

.push-notification-manager .bg-gray-50 {
    @apply bg-gray-700;
}

/* Cores específicas da marca 2BPO para modo dark */
.push-notification-manager .text-2bpo-arrow {
    @apply text-2bpo-number; /* Usar dourado para títulos no modo dark */
}

.push-notification-manager .bg-2bpo-arrow {
    @apply bg-2bpo-arrow; /* Manter azul para botões */
}

/* Hover effects para modo dark */
.push-notification-manager .hover\:bg-green-50:hover {
    @apply hover:bg-green-900/20;
}

.push-notification-manager .hover\:text-green-600:hover {
    @apply hover:text-green-400;
}

/* Inputs e checkboxes no modo dark */
.push-notification-manager input[type="checkbox"] {
    @apply bg-gray-700 border-gray-600 text-2bpo-arrow focus:ring-2bpo-arrow;
}

.push-notification-manager input[type="text"],
.push-notification-manager input[type="email"],
.push-notification-manager textarea {
    @apply bg-gray-700 border-gray-600 text-white placeholder-gray-400;
}

/* Botões no modo dark */
.push-notification-manager button {
    @apply transition-colors duration-200;
}

/* Cards e containers no modo dark */
.push-notification-manager .card {
    @apply bg-gray-800 border-gray-700;
}

/* Status indicators no modo dark */
.push-notification-manager .status-success {
    @apply bg-green-900/20 border-green-700 text-green-300;
}

.push-notification-manager .status-error {
    @apply bg-red-900/20 border-red-700 text-red-300;
}

.push-notification-manager .status-info {
    @apply bg-blue-900/20 border-blue-700 text-blue-300;
}

/* Garantir que o modo dark seja aplicado imediatamente */
.dark-mode-default {
    @apply dark;
}

/* Forçar aplicação do modo dark em todos os elementos filhos */
.dark-mode-default * {
    color-scheme: dark;
}