/* Step by Step — Dark Theme Patch Fundo: preto, Títulos: amarelo, Texto: branco Coloque este arquivo DEPOIS do CSS principal no do site. */ :root{ --bg-0:#0b0b0b; --bg-1:#121212; --bg-2:#161616; --border:#2a2a2a; --txt:#f0f0f0; --muted:#bbbbbb; --brand:#ffc400; --brand-2:#ffd24a; --brand-3:#ffea8a; --danger:#ff4d4f; } /* Base */ html,body{background:var(--bg-0); color:var(--txt);} body{line-height:1.6;} /* Tipografia */ h1,h2,h3,h4,h5,h6, .section-title,.card-title,.title,.heading, h1 a,h2 a,h3 a,h4 a{color:var(--brand) !important;} p,li,span,small,strong,em,blockquote{color:var(--txt);} .text-muted, .muted, small, .small{color:var(--muted) !important;} /* Links */ a{color:var(--brand-2);} a:hover, a:focus{color:var(--brand-3); text-decoration:none;} /* Navbar / Header / Footer */ header, .header, .site-header, .navbar, .topbar, .menu, .site-menu{ background: #000 !important; color: var(--txt) !important; border-bottom:1px solid var(--border); } .navbar a, .nav-link, .menu a{color:var(--txt) !important;} .navbar .active > a, .nav-link.active, .nav-link:hover, .menu a:hover, .menu .current a{color:var(--brand) !important;} /* Cards / Boxes / Painéis */ .card, .panel, .box, .well, .callout{ background:var(--bg-1) !important; border:1px solid var(--border) !important; color:var(--txt) !important; } .card-header, .panel-heading{background:var(--bg-2) !important; border-bottom:1px solid var(--border) !important;} .card-title{color:var(--brand) !important;} /* Botões (Bootstrap-like e genéricos) */ .btn, button, [type="button"], [type="submit"]{ border-radius:.5rem; } .btn-primary, .btn-warning, .button-primary{ background:var(--brand) !important; border-color:var(--brand) !important; color:#000 !important; } .btn-primary:hover,.btn-warning:hover,.button-primary:hover{ background:#e0a800 !important; border-color:#e0a800 !important; color:#000 !important; } .btn-outline, .btn-outline-light, .btn-secondary, .button{ background:transparent !important; border:1px solid var(--brand) !important; color:var(--brand) !important; } .btn-outline:hover, .btn-outline-light:hover, .btn-secondary:hover{ background:var(--brand) !important; color:#000 !important; } /* Inputs / Forms */ input,select,textarea{ background:var(--bg-2) !important; border:1px solid var(--border) !important; color:var(--txt) !important; } ::placeholder{color:#9e9e9e !important;} /* Tabelas */ table{color:var(--txt) !important; background:var(--bg-1) !important;} thead th{background:var(--bg-2) !important; color:var(--brand) !important; border-bottom:1px solid var(--border) !important;} tbody td, tbody th{border-top:1px solid var(--border) !important;} .table-striped tbody tr:nth-of-type(odd){background:rgba(255,255,255,.02) !important;} /* Listas / Cards de benefícios */ .feature, .benefit, .list-group-item{ background:var(--bg-1) !important; color:var(--txt) !important; border-color:var(--border) !important; } .list-group-item.active{background:var(--brand) !important; color:#000 !important; border-color:var(--brand) !important;} /* Seções comuns */ section, .section, .hero, .banner, .jumbotron, .footer, footer{ background:transparent; color:var(--txt); } hr{border-color:var(--border);} /* Links do rodapé e pequenos detalhes */ footer a{color:var(--brand-2);} footer a:hover{color:var(--brand-3);} /* Ajustes de elementos escuros herdados */ .bg-light, .bg-white{background:var(--bg-1) !important; color:var(--txt) !important;} .text-dark{color:var(--txt) !important;} .border{border-color:var(--border) !important;} /* Navegação ativa sublinhada opcional */ .nav-link.active::after{ content:""; display:block; height:2px; background:var(--brand); margin-top:6px; }