/* Estilos para botões */
.btn-primary {
    background-color: #ff0000;
    color: #FFFFFF;
}

.btn-primary:hover {
    background-color: #ff0000;
}

.btn-secondary {
    background-color: #334155;
    color: #FFFFFF;
}

.btn-secondary:hover {
    background-color: #ff0000;
}

/* Estilos para ícones */
.icone-primario,
.icone-principal,
.recurso-icon i,
.feature-icon i {
    color: #0aff54 !important;
}

.icone-secundario,
.icone-feature,
.section-icon i {
    color: #e265ba !important;
}

.icone-destaque,
.destaque-icon i,
.highlight-icon i {
    color: #ff7b00 !important;
}

/* Cores específicas para ícones nas seções da página */
.hero-section .icon,
.hero-section i,
.recursos-section .icon,
.recursos-section i {
    color: #0aff54 !important;
}

.produtos-section .icon,
.produtos-section i,
.planos-section .icon, 
.planos-section i {
    color: #e265ba !important;
}

.depoimentos-section .icon,
.depoimentos-section i,
.faq-section .icon,
.faq-section i,
.cta-section .icon,
.cta-section i {
    color: #ff7b00 !important;
}

/* Círculos de ícones com background */
.icon-circle {
    background-color: rgba(10, 255, 84, 0.2) !important;
}

.icon-circle i,
.circle-icon i {
    color: #0aff54 !important;
}

/* Backgrounds customizados para ícones */
.bg-icon-primary {
    background-color: #ffefef !important;
}

.bg-icon-secondary {
    background-color: #eef7ff !important;
}

.bg-icon-highlight {
    background-color: #ffe8e8 !important;
}

/* Estilo para cards de recursos na página inicial */
.recurso-card {
    background-color: #1e293b;
    border-radius: 0.75rem;
    padding: 1.5rem;
    transition: all 0.3s ease;
}

.recurso-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
}

.recurso-icon-wrapper {
    width: 5rem;
    height: 5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    margin: 0 auto 1.5rem auto;
}

/* Estilos para a faixa de popular */
.popular-badge {
    position: absolute;
    top: 2rem;
    right: -3rem;
    background-color: #ff7b00;
    color: #fff;
    padding: 0.5rem 3.5rem;
    transform: rotate(45deg);
    z-index: 10;
    overflow: visible;
    font-weight: bold;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

/* Seletor de produtos para planos */
.product-selector {
    background-color: #1e293b;
    padding: 1rem;
    border-radius: 0.5rem;
    margin-bottom: 2rem;
    text-align: center;
}

.product-selector select {
    background-color: #334155;
    color: white;
    padding: 0.5rem 1rem;
    border-radius: 0.375rem;
    border: 1px solid #475569;
    margin-left: 1rem;
    outline: none;
}

.product-selector select:focus {
    border-color: #ff0000;
    box-shadow: 0 0 0 2px rgba(255, 0, 0, 0.2);
} 

/* Estilos para o tema do site */
body, 
html,
.body-bg,
.dark-bg,
.site-background,
.main-background,
.bg-gray-900,
.bg-darkblue-900 {
    background-color: #0f172a !important;
}

/* Garantir contraste em todas as seções de fundo do site */
#main,
#content,
#wrapper,
.main-content,
.content-wrapper,
.page-wrapper,
.site-wrapper,
.main-wrapper,
main,
.banner-section,
.hero-section,
.faq-section,
.cta-section,
.perguntas-section,
.contato-section,
.pricing-section,
.recursos-section,
section:not(.card):not(.component-bg):not(.bg-component),
div.container:not(.card):not(.component-bg):not(.bg-component),
div.container-fluid:not(.card):not(.component-bg):not(.bg-component) {
    background-color: #0f172a !important;
}

/* Garantir que todos os componentes tenham a cor de fundo correta */
.card,
.section-card,
.feature-card,
.component-bg,
.navbar,
.sidebar,
.footer,
.header,
.recurso-card,
.product-card,
.pricing-card,
.testimonial-card,
.faq-card,
.form-card,
.panel,
.modal-content,
.dropdown-menu,
.container-bg,
.bg-component,
.bg-darkblue-800,
.bg-darkblue-700,
article,
.article,
.accordion-item,
.accordion-header,
.pricing-box,
.plan-box,
.feature-box,
.service-box,
.resource-box,
.info-box,
.card-body,
.plano-card,
.item-destaque,
/* Cards de planos/preços específicos das imagens */
[class*="plano-"],
[class*="price-"],
[class*="pricing-"],
[class*="card-"],
[class*="box-"],
[class*="container-"],
[class*="wrapper-"],
[class*="panel-"],
[class*="box"],
[class*="card"],
.recuperacao-carrinho,
.envio-automatico,
.api-container,
.gestao-clientes,
.financeiro,
.entradas-saidas {
    background-color: #1e293b !important;
    /* Adicionar borda sutil para aumentar o contraste visual */
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

/* Estilos específicos para os cards de recursos/serviços nas imagens */
.feature-item,
.service-item,
.resource-item,
.info-item,
.card-item,
[class*="feature-"],
[class*="service-"],
[class*="resource-"],
[class*="info-"],
.icon-card,
.icon-box,
.circle-icon-container,
.feature-icon-container,
.icon-wrapper {
    background-color: #1e293b !important;
    /* Adicionar borda sutil para aumentar o contraste visual */
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    /* Adicionar sombra para destacar do fundo */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1) !important;
}

/* Estilos específicos para os cartões de planos/preços vistos nas imagens */
.basic,
.medium,
.advanced,
.basico,
.medio,
.avancado,
.plano-item,
.pricing-item,
.price-item,
.plano-card,
.plano-box,
.plano-container,
.plano-wrapper,
.plano-panel,
.plano-section,
[class*="plano-item"],
[class*="pricing-item"],
[class*="price-item"],
[class*="plan-item"] {
    background-color: #1e293b !important;
    /* Adicionar borda sutil para aumentar o contraste visual */
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    /* Adicionar sombra para destacar do fundo */
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.2) !important;
}

/* Correção para o cabeçalho da tabela de preços */
.planos-header,
.pricing-header,
.price-header,
.plano-header,
.plan-header,
.pricing-title,
.price-title,
.plano-title,
.plan-title,
[class*="plano-header"],
[class*="pricing-header"],
[class*="price-header"],
[class*="plan-header"] {
    background-color: #1e293b !important;
}

/* Seção laranja vista no topo das imagens */
.hero-banner,
.top-banner,
.cta-banner,
.main-banner,
.header-banner,
.banner,
.orange-section,
.highlight-section,
.top-section,
[class*="banner-"],
[class*="hero-"],
[class*="header-area"],
[class*="top-area"] {
    background-color: #ff9900 !important; /* Manter a cor laranja original */
    color: #000000 !important; /* Texto escuro para contraste */
}

/* Botões de ação que devem se destacar */
.btn-action,
.btn-cta,
.btn-highlight,
.btn-contratar,
.btn-register,
.btn-signup,
.btn-cadastre-se,
.cta-button,
.action-button,
.login-button,
.register-button,
[class*="btn-action"],
[class*="btn-cta"],
[class*="btn-contratar"],
[class*="btn-cadastre"] {
    background-color: #ff0000 !important; /* Manter o vermelho original */
    color: #ffffff !important; /* Texto branco para contraste */
    border: none !important;
    /* Adicionar sombra para destacar */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2) !important;
}

h1, h2, h3, h4, h5, h6,
.heading,
.title,
.page-title,
.section-title,
.component-title,
.main-text,
.primary-text,
.card-title,
.widget-title,
.strong-text,
.text-white,
.text-lg,
.text-xl,
.text-2xl,
.text-3xl,
.text-4xl,
.text-5xl,
.text-6xl,
a,
button,
.navbar-brand,
.nav-link {
    color: #ffffff !important;
}

p, 
.text-gray-400,
.text-gray-500,
.text-gray-600,
.description,
.subtitle,
.body-text,
.card-text,
.supporting-text,
.secondary-text,
.text-content,
.text-body,
.small-text,
.meta-text,
.text-sm,
.text-base,
.nav-text,
footer span,
.footer-text {
    color: #94a3b8 !important;
}

/* Exceções para elementos que devem manter suas cores originais */
.btn-primary,
.btn-secondary,
.btn-success,
.btn-danger,
.btn-warning,
.btn-info,
.btn-primary:hover,
.btn-secondary:hover,
.btn-success:hover,
.btn-danger:hover,
.btn-warning:hover,
.btn-info:hover,
.text-success,
.text-danger,
.text-warning,
.text-info,
.badge,
.alert {
    color: inherit !important;
}

/* Aplicar cores em elementos específicos que aparecem no site */
.accordion-button::after,
.accordion-button:not(.collapsed)::after {
    filter: brightness(0) invert(1);
}

.accordion-button:not(.collapsed) {
    background-color: #1e293b !important;
    color: #ffffff !important;
}

/* Estilos específicos para elementos de depoimentos e cards personalizados */
.testimonial-section,
.depoimento-card,
.depoimento-box,
.depoimento-container,
[class*="depoimento"],
[class*="testimonial"],
.card-depoimento,
.box-depoimento {
    background-color: #1e293b !important;
}

/* Estilos para texto em depoimentos */
.depoimento-texto,
.testimonial-text,
.depoimento-content,
.testimonial-content,
.depoimento-quote,
.testimonial-quote {
    color: #94a3b8 !important;
}

/* Estilos para nomes em depoimentos */
.depoimento-autor,
.testimonial-author,
.depoimento-nome,
.testimonial-name,
.author-name {
    color: #ffffff !important;
}

/* Cores para textos em elementos interativos como FAQ */
.faq-question,
.faq-title,
.pergunta,
.pergunta-titulo,
.accordion-button {
    color: #ffffff !important;
}

.faq-answer,
.faq-content,
.resposta,
.resposta-conteudo,
.accordion-body {
    color: #94a3b8 !important;
}

/* Garantir que os ícones e outras exceções mantenham suas cores específicas */
[class*="text-blue-"],
[class*="text-red-"],
[class*="text-green-"],
[class*="text-yellow-"],
[class*="text-pink-"],
[class*="text-purple-"],
[class*="text-indigo-"],
.fab.fa-facebook,
.fab.fa-instagram,
.fab.fa-twitter,
.fab.fa-linkedin,
.fab.fa-youtube {
    color: inherit !important;
}

/* Estilos adicionais para classes TailwindCSS e Bootstrap */
.bg-dark, 
.bg-dark-900, 
.bg-dark-800, 
.bg-dark-700,
.bg-slate-900, 
.bg-slate-800, 
.bg-slate-700,
.bg-gray-900, 
.bg-gray-800, 
.bg-gray-700,
.bg-neutral-900, 
.bg-neutral-800, 
.bg-neutral-700,
.bg-black {
    background-color: #0f172a !important;
}

.bg-dark-600, 
.bg-dark-500, 
.bg-dark-400,
.bg-slate-600, 
.bg-slate-500, 
.bg-slate-400,
.bg-gray-600, 
.bg-gray-500, 
.bg-gray-400,
.bg-neutral-600, 
.bg-neutral-500, 
.bg-neutral-400 {
    background-color: #1e293b !important;
}

/* Estilos específicos para carrossel de depoimentos */
.carousel-inner, 
.carousel-item,
.carousel-caption,
.slide,
.swiper-slide,
.testimonial-slider,
.depoimentos-slider {
    background-color: #1e293b !important;
}

/* Forçar aplicação de cores em elementos que podem estar usando !important */
div[style*="background"], 
div[style*="background-color"],
section[style*="background"],
section[style*="background-color"] {
    background-color: #0f172a !important;
}

.card[style*="background"], 
.card[style*="background-color"],
.box[style*="background"],
.box[style*="background-color"],
.panel[style*="background"],
.panel[style*="background-color"] {
    background-color: #1e293b !important;
}

/* Garantir que as cores de texto sejam aplicadas mesmo com !important no código original */
span[style*="color"], 
p[style*="color"],
div[style*="color"]:not([class*="bg-"]):not([class*="background"]) {
    color: #94a3b8 !important;
}

h1[style*="color"], 
h2[style*="color"], 
h3[style*="color"], 
h4[style*="color"], 
h5[style*="color"], 
h6[style*="color"],
a[style*="color"]:not(.btn):not(.badge):not(.alert) {
    color: #ffffff !important;
}

/* Correção para seletores de produtos e elementos de formulário */
.select-container,
.selector-container,
.product-selector,
.product-selection,
.select-wrapper,
.dropdown-wrapper,
select.form-control,
select.form-select,
select.custom-select,
.select-product,
.product-dropdown,
div:has(> select),
.form-group:has(> select),
.select-group,
.combobox,
.combobox-container {
    background-color: #1e293b !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2) !important;
}

/* Estilo específico para o select */
select,
select.form-control,
select.form-select,
select.custom-select,
.form-select,
.custom-select {
    background-color: #1e293b !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    color: #ffffff !important;
}

/* Estilo para o container da seção de seleção de produtos */
.product-selection-container,
.product-selector-container,
.selector-wrapper,
div:has(> .product-selector),
div:has(> .select-container),
div:has(> [id*="selector"]),
div:has(> [id*="select"]),
div:has(> [class*="selector"]),
div:has(> [class*="select"]) {
    background-color: #0f172a !important;
}

/* Estilos específicos para o fundo azul escuro no seletor de produtos */
.bg-navy,
.bg-navy-900,
.bg-navy-800,
.bg-navy-700,
.bg-darkblue-900,
.bg-darkblue-800,
.bg-darkblue-700,
.bg-dark-blue,
.dark-blue-bg,
.navy-bg,
.navy-background,
[class*="navy-bg"],
[class*="dark-blue-bg"],
div[style*="background-color: #0f172a"],
div[style*="background-color:#0f172a"],
div[style*="background-color: #1e293b"],
div[style*="background-color:#1e293b"],
div[style*="background: #0f172a"],
div[style*="background:#0f172a"],
div[style*="background: #1e293b"],
div[style*="background:#1e293b"] {
    background-color: #1e293b !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
}

/* Botões especiais que devem manter o estilo padrão */
.btn-selecionar,
.btn-select,
[class*="btn-select"],
.select-button,
.selection-button {
    background-color: #1e293b !important;
    color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
}