/* TrustVault - Dark Theme
 * Tema escuro do TrustVault
 */

:root {
  /* Cores principais */
  --color-background: #121214;
  --color-surface: #202024;
  --color-primary: #8257E5;
  --color-primary-hover: #9466FF;
  --color-text-primary: #FFFFFF;
  --color-text-secondary: #E1E1E6;
  --color-text-tertiary: #A8A8B3;
  --color-border: #29292E;
  
  /* Cores de status */
  --color-success: #04D361;
  --color-warning: #FFCD1E;
  --color-alert: #FF8700;
  --color-error: #FF4D4F;
  
  /* Sombras */
  --shadow-sm: 0 2px 6px rgba(0, 0, 0, 0.15);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.2);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.25);
}

/* Estilos Globais */
body.theme-dark {
  background-color: var(--color-background);
  color: var(--color-text-primary);
}

/* Links */
.theme-dark a {
  color: var(--color-primary);
}

.theme-dark a:hover {
  color: var(--color-primary-hover);
}

/* Botões */
.theme-dark .btn-primary {
  background-color: var(--color-primary) !important;
  color: var(--color-text-primary) !important;
  border: none !important;
}

.theme-dark .btn-primary:hover {
  background-color: var(--color-primary-hover) !important;
  border-color: var(--color-primary-hover) !important;
}

.theme-dark .btn-secondary {
  background-color: var(--color-surface);
  color: var(--color-text-secondary);
  border: 1px solid var(--color-border);
}

.theme-dark .btn-secondary:hover {
  background-color: var(--color-border);
  color: var(--color-text-primary);
}

/* Cards */
.theme-dark .card {
  background-color: var(--color-surface) !important;
  border: 1px solid var(--color-border) !important;
  color: var(--color-text-primary) !important;
}

.theme-dark .card-header {
  background-color: var(--color-primary) !important;
  border-bottom: none !important;
  color: var(--color-text-primary) !important;
}

.theme-dark .card-header.bg-primary {
  background-color: var(--color-primary) !important;
  color: var(--color-text-primary) !important;
}

.theme-dark .card-header h3,
.theme-dark .card-header p,
.theme-dark .card-header .text-white {
  color: var(--color-text-primary) !important;
}

.theme-dark .card-body {
  background-color: var(--color-surface) !important;
  color: var(--color-text-primary) !important;
}

.theme-dark .card-footer {
  background-color: var(--color-border) !important;
  color: var(--color-text-secondary) !important;
  border-top: 1px solid var(--color-border) !important;
}

.theme-dark .card-title {
  color: var(--color-text-primary) !important;
  font-weight: 500;
}

/* Formulários */
.theme-dark .form-control {
  background-color: var(--color-background) !important;
  border: 1px solid var(--color-border) !important;
  color: var(--color-text-primary) !important;
}

.theme-dark .form-control:focus {
  background-color: var(--color-background) !important;
  border-color: var(--color-primary) !important;
  box-shadow: 0 0 0 2px rgba(130, 87, 229, 0.25) !important;
  color: var(--color-text-primary) !important;
}

/* Corrigir cor do texto de ajuda nos formulários */
.theme-dark .form-text.text-muted,
.theme-dark .text-muted {
  color: var(--color-text-tertiary) !important;
}

/* Corrigir cor do texto do checkbox no tema escuro */
.theme-dark .form-check-label {
  color: var(--color-text-secondary) !important;
}

/* Configuração de placeholders */
.theme-dark ::placeholder {
  color: var(--color-text-tertiary) !important;
  opacity: 1;
}
.theme-dark :-ms-input-placeholder {
  color: var(--color-text-tertiary) !important;
}
.theme-dark ::-ms-input-placeholder {
  color: var(--color-text-tertiary) !important;
}

.theme-dark .form-label {
  color: var(--color-text-secondary) !important;
}

/* Navbar */
.theme-dark .navbar {
  background-color: var(--color-surface) !important;
  border-bottom: 1px solid var(--color-border);
}

.theme-dark .navbar-brand {
  color: var(--color-text-primary) !important;
}

/* Sidebar */
.theme-dark .sidebar {
  background-color: var(--color-surface) !important;
  border-right: 1px solid var(--color-border);
}

.theme-dark .nav-link {
  color: var(--color-text-secondary) !important;
}

.theme-dark .nav-link:hover {
  color: var(--color-text-primary) !important;
}

.theme-dark .nav-link.active {
  background-color: var(--color-primary) !important;
  color: var(--color-text-primary) !important;
}

.theme-dark .nav-link i {
  color: var(--color-text-tertiary);
}

.theme-dark .nav-link:hover i,
.theme-dark .nav-link.active i {
  color: var(--color-text-primary) !important;
}

/* Tabelas */
.theme-dark .table {
  color: var(--color-text-primary) !important;
  background-color: var(--color-surface) !important;
  border-color: var(--color-border) !important;
}

.theme-dark .table,
.theme-dark .table th,
.theme-dark .table td {
  color: var(--color-text-primary) !important;
  background-color: var(--color-surface) !important;
  border-color: var(--color-border) !important;
}

.theme-dark .table tbody td, 
.theme-dark .table thead th {
  border-color: var(--color-border) !important;
  background-color: var(--color-surface) !important;
  color: var(--color-text-primary) !important;
}

.theme-dark .table-striped>tbody>tr:nth-of-type(odd)>* {
  background-color: rgba(130, 87, 229, 0.05) !important;
  color: var(--color-text-primary) !important;
}

.theme-dark .table-striped>tbody>tr:nth-of-type(even)>* {
  background-color: var(--color-surface) !important;
  color: var(--color-text-primary) !important;
}

.theme-dark .table th, .theme-dark .table thead th {
  background-color: var(--color-border) !important;
  color: var(--color-text-primary) !important;
  border-color: var(--color-border) !important;
  font-weight: 600;
}

.theme-dark .table td {
  background-color: var(--color-surface) !important;
  color: var(--color-text-secondary) !important;
  border-color: var(--color-border) !important;
}

.theme-dark .table-hover>tbody>tr:hover>* {
  background-color: rgba(130, 87, 229, 0.1) !important;
  color: var(--color-text-primary) !important;
}

/* Modais */
.theme-dark .modal-content {
  background-color: var(--color-surface) !important;
  border: 1px solid var(--color-border) !important;
  color: var(--color-text-primary) !important;
}

.theme-dark .modal-header, 
.theme-dark .modal-footer {
  border-color: var(--color-border) !important;
}

.theme-dark .modal-title {
  color: var(--color-text-primary) !important;
}

.theme-dark .modal-body {
  color: var(--color-text-secondary) !important;
  background-color: var(--color-surface) !important;
}

/* Status colors */
.theme-dark .status-valid {
  color: var(--color-success) !important;
  background-color: rgba(4, 211, 97, 0.1) !important;
}

.theme-dark .status-warning {
  color: var(--color-warning) !important;
  background-color: rgba(255, 205, 30, 0.1) !important;
}

.theme-dark .status-critical {
  color: var(--color-alert) !important;
  background-color: rgba(255, 135, 0, 0.1) !important;
}

.theme-dark .status-expired {
  color: var(--color-error) !important;
  background-color: rgba(255, 77, 79, 0.1) !important;
}

/* Stats Cards */
.theme-dark .stats-card {
  background: linear-gradient(135deg, var(--color-surface), var(--color-border)) !important;
  border: 1px solid var(--color-border) !important;
  box-shadow: var(--shadow-md) !important;
  color: var(--color-text-primary) !important;
  transition: all 0.3s ease !important;
}

.theme-dark .stats-card:hover {
  transform: translateY(-2px) !important;
  box-shadow: var(--shadow-lg) !important;
}

.theme-dark .stats-card .card-body {
  color: var(--color-text-primary) !important;
  background: transparent !important;
}

.theme-dark .stats-card .display-4,
.theme-dark .stats-card .card-text {
  color: var(--color-text-primary) !important;
}

/* Status specific cards */
.theme-dark .card-valid {
  border-left: 4px solid var(--color-success) !important;
}

.theme-dark .card-warning {
  border-left: 4px solid var(--color-warning) !important;
}

.theme-dark .card-expired {
  border-left: 4px solid var(--color-error) !important;
}

.theme-dark .card-critical {
  border-left: 4px solid var(--color-alert) !important;
}

/* Text colors override */
.theme-dark .text-success {
  color: var(--color-success) !important;
}

.theme-dark .text-warning {
  color: var(--color-warning) !important;
}

.theme-dark .text-danger, .theme-dark .text-error {
  color: var(--color-error) !important;
}

.theme-dark .text-alert {
  color: var(--color-alert) !important;
}

/* Alertas */
.theme-dark .alert {
  border: 1px solid var(--color-border) !important;
  color: var(--color-text-primary) !important;
}

.theme-dark .alert-info {
  background-color: rgba(130, 87, 229, 0.1) !important;
  border-color: var(--color-primary) !important;
  color: var(--color-text-primary) !important;
}

.theme-dark .alert-success {
  background-color: rgba(4, 211, 97, 0.1) !important;
  border-color: var(--color-success) !important;
  color: var(--color-text-primary) !important;
}

.theme-dark .alert-warning {
  background-color: rgba(255, 205, 30, 0.1) !important;
  border-color: var(--color-warning) !important;
  color: var(--color-text-primary) !important;
}

.theme-dark .alert-danger {
  background-color: rgba(255, 77, 79, 0.1) !important;
  border-color: var(--color-error) !important;
  color: var(--color-text-primary) !important;
}

/* Páginas públicas específicas */
.theme-dark .public-navbar {
  background-color: var(--color-surface) !important;
  color: var(--color-text-primary) !important;
}

.theme-dark .btn-signup {
  background: linear-gradient(135deg, var(--color-primary), var(--color-primary-hover)) !important;
  color: var(--color-text-primary) !important;
  border: none !important;
}

.theme-dark .btn-outline-primary {
  color: var(--color-primary) !important;
  border-color: var(--color-primary) !important;
  background-color: transparent !important;
}

.theme-dark .btn-outline-primary:hover {
  background-color: var(--color-primary) !important;
  color: var(--color-text-primary) !important;
  border-color: var(--color-primary) !important;
}

/* Text colors específicos para páginas públicas */
.theme-dark .text-white {
  color: var(--color-text-primary) !important;
}

.theme-dark .text-center,
.theme-dark p,
.theme-dark .small {
  color: var(--color-text-secondary) !important;
}

.theme-dark hr {
  border-color: var(--color-border) !important;
  opacity: 1 !important;
}

/* Container principal */
.theme-dark .container,
.theme-dark main {
  color: var(--color-text-primary) !important;
}

/* CORREÇÕES ESPECÍFICAS PARA PÁGINAS PÚBLICAS */

/* 1. Seção "Funcionalidades Principais" - Corrigir bg-light e textos */
.theme-dark .bg-light {
  background-color: var(--color-surface) !important;
  color: var(--color-text-primary) !important;
}

.theme-dark .bg-light h2,
.theme-dark .bg-light h3,
.theme-dark .bg-light h4,
.theme-dark .bg-light h5,
.theme-dark .bg-light p,
.theme-dark .bg-light .lead {
  color: var(--color-text-primary) !important;
}

.theme-dark .bg-light .display-5 {
  color: var(--color-text-primary) !important;
}

/* Correções específicas para página de planos */
.theme-dark .hero-section h1,
.theme-dark .hero-section .display-4,
.theme-dark .hero-section p,
.theme-dark .hero-section .lead {
  color: var(--color-text-primary) !important;
}

.theme-dark .plan-card .card-body {
  background-color: var(--color-surface) !important;
  color: var(--color-text-primary) !important;
}

.theme-dark .plan-card .card-body ul li {
  color: var(--color-text-secondary) !important;
}

.theme-dark .plan-card .card-body strong {
  color: var(--color-text-primary) !important;
}

/* Títulos de seções */
.theme-dark h1, .theme-dark h2, .theme-dark h3, .theme-dark h4, .theme-dark h5, .theme-dark h6 {
  color: var(--color-text-primary) !important;
}

.theme-dark .display-4, .theme-dark .display-5 {
  color: var(--color-text-primary) !important;
}

.theme-dark .lead {
  color: var(--color-text-secondary) !important;
}

/* Parágrafos e texto geral */
.theme-dark p {
  color: var(--color-text-secondary) !important;
}

/* Listas e itens de features */
.theme-dark ul li {
  color: var(--color-text-secondary) !important;
}

.theme-dark .list-unstyled li {
  color: var(--color-text-secondary) !important;
}

/* 2. Botão "Já tenho conta" - Corrigir btn-outline-light */
.theme-dark .btn-outline-light {
  color: var(--color-text-primary) !important;
  border-color: var(--color-border) !important;
  background-color: transparent !important;
}

.theme-dark .btn-outline-light:hover {
  background-color: var(--color-border) !important;
  color: var(--color-text-primary) !important;
  border-color: var(--color-border) !important;
}

/* 3. Feature icons - Manter cores dos ícones mas melhorar visibilidade */
.theme-dark .feature-icon {
  color: var(--color-primary) !important;
}

.theme-dark .feature-icon .bi {
  color: inherit !important;
}

/* 4. Seção CTA - Melhorar contraste */
.theme-dark .bg-primary.text-white {
  background-color: var(--color-primary) !important;
  color: var(--color-text-primary) !important;
}

.theme-dark .bg-primary h2,
.theme-dark .bg-primary p,
.theme-dark .bg-primary .lead {
  color: var(--color-text-primary) !important;
}

/* Login styles (legacy - mantido para compatibilidade) */
.theme-dark .login-container {
  background-color: var(--color-background) !important;
}

.theme-dark .login-card {
  background-color: var(--color-surface) !important;
}

.theme-dark .login-title {
  color: var(--color-text-primary) !important;
}

.theme-dark .login-field i {
  color: var(--color-text-tertiary) !important;
}

.theme-dark .login-input {
  background-color: var(--color-background) !important;
  border: 1px solid var(--color-border) !important;
  color: var(--color-text-primary) !important;
}

.theme-dark .login-input:focus {
  border-color: var(--color-primary) !important;
  color: var(--color-text-primary) !important;
}

.theme-dark .login-button {
  background-color: var(--color-primary) !important;
  color: var(--color-text-primary) !important;
}

.theme-dark .login-button:hover {
  background-color: var(--color-primary-hover) !important;
}

/* CORREÇÕES ESPECÍFICAS PARA PÁGINAS DE CHECKOUT */

/* Step indicator */
.theme-dark .step-title {
  color: var(--color-text-secondary) !important;
}

.theme-dark .step.active .step-title {
  color: var(--color-primary) !important;
}

/* Existing account info */
.theme-dark .existing-account-container h5 {
  color: var(--color-text-primary) !important;
}

.theme-dark .existing-account-container .alert-success p {
  color: var(--color-text-primary) !important;
}

/* Form elements in checkout */
.theme-dark .form-control::placeholder {
  color: var(--color-text-tertiary) !important;
  opacity: 0.8;
}

/* Plan summary card */
.theme-dark #plan-summary .card-body {
  background-color: var(--color-border) !important;
  color: var(--color-text-primary) !important;
}

.theme-dark #plan-summary .card-title {
  color: var(--color-text-primary) !important;
}

.theme-dark #plan-info span,
.theme-dark #plan-info strong,
.theme-dark #plan-info small {
  color: var(--color-text-primary) !important;
}

/* Benefits section */
.theme-dark .feature-icon {
  color: var(--color-primary) !important;
}

.theme-dark .feature-icon + h6 {
  color: var(--color-text-primary) !important;
}

.theme-dark .feature-icon + h6 + p {
  color: var(--color-text-secondary) !important;
}

/* Botões de ação */
.theme-dark .btn-primary {
  background-color: var(--color-primary) !important;
  color: var(--color-text-primary) !important;
  border-color: var(--color-primary) !important;
}

/* Small text and text-muted elements */
.theme-dark .small, .theme-dark small {
  color: var(--color-text-tertiary) !important;
}

/* Badge elements */
.theme-dark .badge {
  color: var(--color-text-primary) !important;
}

.theme-dark .badge.bg-success {
  background-color: var(--color-success) !important;
}

.theme-dark .badge.bg-primary {
  background-color: var(--color-primary) !important;
}

.theme-dark .badge.bg-light {
  background-color: var(--color-border) !important;
  color: var(--color-text-primary) !important;
} 