body { background: #121212; color: #e0e0e0; transition: background 0.3s, color 0.3s; font-family: 'Roboto', sans-serif; margin: 0; padding: 0; }
.card { background: #1e1e1e !important; border-radius: 8px; padding: 15px; margin-bottom: 15px; border: 1px solid #333; }
.btn-custom { border-radius: 6px !important; text-transform: none; font-weight: bold; margin: 3px; font-size: 0.85rem;}
nav { background: #1e1e1e !important; box-shadow: 0 2px 4px rgba(0,0,0,0.5) !important; margin-bottom: 20px;}
nav ul a { color: #e0e0e0; font-weight: bold;}
nav ul a:hover { background: rgba(33,150,243,0.2); }
.nav-active { border-bottom: 3px solid #2196F3; }

body.light { background: #f0f4f3 !important; color: #1f1f1f !important; }
body.light nav { background: #ffffff !important; box-shadow: 0 2px 4px rgba(0,0,0,0.05) !important; }
body.light nav ul a { color: #1f1f1f !important; }
body.light .card { background: #ffffff !important; box-shadow: 0 4px 12px rgba(0,0,0,0.05) !important; color: #1f1f1f !important;}
body.light .brand-logo, body.light h5, body.light #t-icon, body.light th { color: #0d47a1 !important; }
body.light h5 { border-bottom: 1px solid #ddd !important; }
body.light input, body.light select, body.light td { color: #1f1f1f !important; border-bottom: 1px solid #2196F3 !important; }
body.light .fin-box { background: rgba(0,0,0,0.03) !important; }
body.light .val-pos { color: #2e7d32 !important; }
body.light .val-neg { color: #c62828 !important; }

body:not(.light) input[type="date"]::-webkit-calendar-picker-indicator,
body:not(.light) input[type="week"]::-webkit-calendar-picker-indicator,
body:not(.light) input[type="month"]::-webkit-calendar-picker-indicator { filter: invert(1) !important; cursor: pointer; }

.brand-logo { color: #2196F3 !important; font-weight: bold !important; font-size: 1.4rem !important; }
h5 { color: #2196F3 !important; font-weight: bold !important; margin-top: 0; margin-bottom: 15px; font-size: 1.1rem; border-bottom: 1px solid #333; padding-bottom: 8px; }

input, select { color: #e0e0e0 !important; background-color: transparent !important; font-family: inherit !important; border-bottom: 1px solid #2196F3 !important; }
select.browser-default { background: transparent !important; }
body:not(.light) select.browser-default option { background: #1e1e1e !important; color: #e0e0e0 !important; }

.chart-container { position: relative; height: 320px; width: 100%; }
.fin-box { text-align: center; padding: 10px; border-radius: 8px; background: rgba(0,0,0,0.2); height: 100%; display: flex; flex-direction: column; justify-content: center;}
.val-pos { color: #4CAF50 !important; font-weight: bold; font-size: 1.4rem; }
.val-neg { color: #F44336 !important; font-weight: bold; font-size: 1.4rem; }

.eco-box { background: linear-gradient(135deg, #2e7d32, #81c784) !important; color: white !important; border-radius: 10px; padding: 10px; display: flex; align-items: center; box-shadow: 0 2px 10px rgba(76,175,80,0.2); margin-bottom: 10px;}
.eco-box-blue { background: linear-gradient(135deg, #00838f, #00bcd4) !important; }
.eco-box-green { background: linear-gradient(135deg, #558b2f, #9ccc65) !important; }
.eco-icon { font-size: 2rem !important; margin-right: 15px; opacity: 0.9; }
.eco-content { text-align: left; }
.eco-val { font-size: 1.2rem; font-weight: bold; line-height: 1.1; }
.eco-text { font-size: 0.75rem; opacity: 0.9; }
.table-wrapper { overflow-x: auto; width: 100%; }
.ts-link { color: #2196F3 !important; font-weight: bold; text-decoration: none; border-bottom: 1px dashed #2196F3; transition: 0.2s;}
.ts-link:hover { opacity: 0.7; }
.login-container { max-width: 400px; margin: 10vh auto; }
.login-btn { width: 100%; font-weight: bold; margin-top: 20px; }