/* ============================================================ Tema Escuro (loja) — downGrade Aplica quando tem a classe .dark-mode ============================================================ */ html.dark-mode, html.dark-mode body { background-color: #15171c !important; color: #c4c8d0 !important; } /* Fundos */ .dark-mode .bg-light, .dark-mode .bg-white, .dark-mode .bg-secondary, .dark-mode header.bg-light, .dark-mode .navbar, .dark-mode .card, .dark-mode .dropdown-menu, .dark-mode .modal-content, .dark-mode .list-group-item, .dark-mode .accordion .card, .dark-mode .input-group-text, .dark-mode .page-link, .dark-mode .cz-sidebar, .dark-mode .cz-sidebar-static, .dark-mode .toast { background-color: #1e2128 !important; color: #c4c8d0 !important; border-color: #2c3038 !important; } .dark-mode .bg-darker, .dark-mode .navbar-sticky.navbar-stuck, .dark-mode .navbar-stuck { background-color: #1a1c22 !important; } /* Cabeçalhos e textos escuros viram claros */ .dark-mode h1, .dark-mode h2, .dark-mode h3, .dark-mode h4, .dark-mode h5, .dark-mode h6, .dark-mode .h1, .dark-mode .h2, .dark-mode .h3, .dark-mode .h4, .dark-mode .h5, .dark-mode .h6, .dark-mode .text-dark, .dark-mode .text-heading, .dark-mode .navbar-light .navbar-nav .nav-link, .dark-mode .nav-link, .dark-mode .widget-product-title a, .dark-mode .product-title a, .dark-mode .dropdown-item, .dark-mode label, .dark-mode .breadcrumb-item, .dark-mode .breadcrumb-item a { color: #e6e8ec !important; } .dark-mode .text-muted, .dark-mode .text-gray-600, .dark-mode .opacity-60, .dark-mode small, .dark-mode .font-size-sm.text-muted { color: #8b90a0 !important; } /* Links de ação mantêm o destaque do tema */ .dark-mode a:not(.btn):not(.navbar-tool):not(.dropdown-item):not(.nav-link) { color: #7f9cff; } /* Bordas e divisores */ .dark-mode .border, .dark-mode .border-top, .dark-mode .border-bottom, .dark-mode .border-left, .dark-mode .border-right, .dark-mode .border-light, .dark-mode .dropdown-divider, .dark-mode .widget-cart-item, .dark-mode .card-header, .dark-mode .card-footer, .dark-mode .table td, .dark-mode .table th, .dark-mode hr { border-color: #2c3038 !important; } /* Formulários */ .dark-mode .form-control, .dark-mode .custom-select, .dark-mode textarea, .dark-mode select, .dark-mode .cz-filter-search { background-color: #23262e !important; color: #e6e8ec !important; border-color: #2c3038 !important; } .dark-mode .form-control::placeholder { color: #6c7280 !important; } .dark-mode .form-control:focus { background-color: #23262e !important; color: #fff !important; } /* icones sobrepostos (login/cadastro): manter transparentes para nao cobrir o placeholder */ .dark-mode .input-group-prepend-overlay .input-group-text, .dark-mode .input-group-append-overlay .input-group-text { background-color: transparent !important; border-color: transparent !important; } /* Tabelas */ .dark-mode .table { color: #c4c8d0 !important; } .dark-mode .table-striped tbody tr:nth-of-type(odd) { background-color: rgba(255,255,255,.03) !important; } .dark-mode .table thead th { color: #e6e8ec !important; } /* Dropdown / modais */ .dark-mode .dropdown-item:hover, .dark-mode .dropdown-item:focus { background-color: #2a2e37 !important; color: #fff !important; } .dark-mode .modal-header, .dark-mode .modal-footer { border-color: #2c3038 !important; } .dark-mode .close { color: #e6e8ec !important; text-shadow: none; } /* Topbar escura já é escura — mantém */ .dark-mode .topbar.bg-dark { background-color: #101216 !important; } /* Rodapé */ .dark-mode footer .bg-dark, .dark-mode .footer, .dark-mode footer { background-color: #101216 !important; } /* Botões outline secundários */ .dark-mode .btn-outline-secondary { color: #c4c8d0; border-color: #3a3f4a; } .dark-mode .btn-light { background-color: #2a2e37 !important; color: #e6e8ec !important; border-color: #3a3f4a !important; } .dark-mode .btn-secondary { background-color: #2a2e37 !important; border-color: #3a3f4a !important; color:#e6e8ec !important; } /* Cartões de produto / imagens */ .dark-mode .card-img-top, .dark-mode .gallery-item { background-color: #23262e; } /* Inputs de busca da navbar */ .dark-mode .navbar-tool-icon-box { color: #e6e8ec; } /* Preços / cor de destaque (carrinho, dropdown, cards) */ .dark-mode .text-accent { color: #4fd69c !important; } .dark-mode .bg-faded-accent { background-color: rgba(79,214,156,0.14) !important; } .dark-mode .price-old { color: #8b90a0 !important; } .dark-mode .widget-cart-item, .dark-mode .widget-product-meta { color: #c4c8d0 !important; } /* Botão de alternância de tema — igualar tamanho/altura aos demais ícones da navbar (FontAwesome força 14px na classe .fa; aqui restauramos 1.25rem como os ícones dwg) */ .navbar-tool.dg-theme-toggle { cursor: pointer; } .dg-theme-toggle .navbar-tool-icon { font-size: 1.45rem !important; line-height: 2.875rem !important; vertical-align: middle; position: relative; top: 2px; }