/* ===================================================== Finance Assistant Global Theme File : green.css Theme : Green Version : 1.0.0 Description : Green Theme Override ===================================================== */ /* ===================================================== THEME VARIABLES ===================================================== */ html[data-theme="green"]{ color-scheme:dark; --primary:#63C48A; --background:#071A12; --card:#0E241A; --text:#ECFDF5; --text-secondary:#9BB7AA; --border:#234536; --shadow: 0 2px 10px rgba(0,0,0,.35); --surface:#10291E; --text-primary:#ECFDF5; } /* ===================================================== BODY ===================================================== */ html[data-theme="green"] body{ background:var(--background); color:var(--text); } /* ===================================================== CARD ===================================================== */ html[data-theme="green"] .card{ background:var(--card); color:var(--text); box-shadow: 0 4px 16px rgba(0,0,0,.28); } /* ===================================================== SECTION ===================================================== */ html[data-theme="green"] .section{ color:var(--text); } /* ===================================================== TEXT ===================================================== */ html[data-theme="green"] .text-primary{ color:var(--text); } html[data-theme="green"] .text-secondary{ color:var(--text-secondary); } /* ===================================================== INPUT ===================================================== */ html[data-theme="green"] input, html[data-theme="green"] select, html[data-theme="green"] textarea{ background:#163126; color:var(--text); border-color:var(--border); } html[data-theme="green"] input::placeholder{ color:#6F8B7F; } /* ===================================================== BUTTON OUTLINE ===================================================== */ html[data-theme="green"] .button-outline{ background:#163126; color:var(--text); border-color:var(--border); } /* ===================================================== FILTER ===================================================== */ html[data-theme="green"] .filter-select{ background:#163126; color:var(--text); } html[data-theme="green"] .filter-input{ background:#163126; color:var(--text); } html[data-theme="green"] .filter-period{ background:#163126; } html[data-theme="green"] .filter-period:hover{ background:#1D4030; } html[data-theme="green"] .filter-period-text{ color:var(--text); } html[data-theme="green"] .filter-chip{ background:#163126; color:#D7EEE3; border-color:#285342; } html[data-theme="green"] .filter-chip.active{ background:var(--primary); border-color:var(--primary); color:#062015; } /* ===================================================== FILTER SHEET ===================================================== */ html[data-theme="green"] .filter-sheet{ background:#071A12; color:var(--text); } html[data-theme="green"] .filter-sheet-header{ border-color:#234536; } html[data-theme="green"] .filter-sheet-header p{ color:var(--text-secondary); } html[data-theme="green"] .filter-sheet-handle{ background:#3B6652; } html[data-theme="green"] .filter-input label{ color:#D7EEE3; } html[data-theme="green"] .filter-input input{ background:#163126; color:var(--text); border-color:#234536; } html[data-theme="green"] .filter-sheet-footer{ background:#071A12; border-color:#234536; } html[data-theme="green"] #filter-cancel{ background:#163126; color:#D7EEE3; } /* ===================================================== HOME ===================================================== */ html[data-theme="green"] .section-badge{ background:#163126; color:#D7EEE3; } html[data-theme="green"] #summary-label{ color:var(--text-secondary); } html[data-theme="green"] #summary-total{ color:var(--text); } html[data-theme="green"] #summary-week{ border-color:var(--border); } html[data-theme="green"] .summary-item strong{ color:var(--text); } /* ===================================================== STATISTICS ===================================================== */ html[data-theme="green"] .statistics-pagination button{ color:var(--primary); } html[data-theme="green"] .statistics-pagination button:disabled{ color:#6F8B7F; } html[data-theme="green"] .statistics-pagination span{ color:var(--text-secondary); } html[data-theme="green"] .transaction-item{ border-color:var(--border); } html[data-theme="green"] .transaction-info strong{ color:var(--text); } html[data-theme="green"] .transaction-info small{ color:var(--text-secondary); } html[data-theme="green"] .transaction-info p{ color:var(--text-secondary); } html[data-theme="green"] .transaction-amount{ color:var(--text); } /* ===================================================== SUMMARY ===================================================== */ html[data-theme="green"] .summary-item{ background:#163126; } html[data-theme="green"] .summary-total{ color:var(--text); } html[data-theme="green"] .distribution-header{ color:var(--text); } html[data-theme="green"] .distribution-percent{ color:var(--text-secondary); } html[data-theme="green"] .distribution-bar{ background:#234536; } /* ===================================================== PROFILE ===================================================== */ html[data-theme="green"] #profile-component{ color:var(--text); } html[data-theme="green"] .profile-card{ background:#0E241A; color:var(--text); box-shadow: 0 8px 24px rgba(0,0,0,.30); } html[data-theme="green"] .profile-menu-item{ background:#0E241A; color:var(--text); box-shadow: 0 4px 16px rgba(0,0,0,.25); } html[data-theme="green"] .profile-menu-title{ color:var(--text); } html[data-theme="green"] .profile-menu-description{ color:var(--text-secondary); } html[data-theme="green"] .profile-menu-arrow{ color:#668276; } html[data-theme="green"] .profile-avatar{ border-color:#234536; } html[data-theme="green"] .profile-greeting{ background:#173B2A; } html[data-theme="green"] .profile-email{ color:var(--text-secondary); } html[data-theme="green"] .profile-description{ color:var(--text-secondary); } /* ===================================================== WORKSPACE ===================================================== */ html[data-theme="green"] .workspace-item{ background:#0E241A; border-color:var(--border); color:var(--text); } html[data-theme="green"] .workspace-item:hover{ border-color:var(--primary); } html[data-theme="green"] .workspace-icon{ background:#173B2A; } html[data-theme="green"] .workspace-name{ color:var(--text); } html[data-theme="green"] .workspace-group-title{ color:var(--text-secondary); } html[data-theme="green"] .workspace-create{ color:var(--primary); border-color:var(--border); } html[data-theme="green"] .workspace-create:hover{ background:#0D2B1E; } /* ===================================================== PROFILE MENU ICON ===================================================== */ html[data-theme="green"] .profile-menu-icon{ background:#173B2A; } /* ===================================================== NAVIGATION ===================================================== */ html[data-theme="green"] #bottom-navigation{ background:#091E16; border-top-color:#234536; box-shadow: 0 -8px 24px rgba(0,0,0,.38); } html[data-theme="green"] .nav-icon{ color:#668276; } html[data-theme="green"] .nav-label{ color:#668276; } html[data-theme="green"] .nav-item.active{ background:#0E241A; } html[data-theme="green"] .nav-item:hover .nav-icon{ background:#163126; color:var(--primary); } html[data-theme="green"] .nav-item:hover .nav-label{ color:var(--primary); } /* ===================================================== HEADER ===================================================== */ html[data-theme="green"] #global-header{ color:var(--text); } html[data-theme="green"] #header-banner{ box-shadow: 0 8px 24px rgba(0,0,0,.30); } /* ===================================================== EMPTY ===================================================== */ html[data-theme="green"] .empty{ color:#668276; } /* ===================================================== SCROLLBAR ===================================================== */ html[data-theme="green"]{ scrollbar-color:#3B6652 #071A12; } html[data-theme="green"] ::-webkit-scrollbar{ width:8px; } html[data-theme="green"] ::-webkit-scrollbar-track{ background:#071A12; } html[data-theme="green"] ::-webkit-scrollbar-thumb{ background:#3B6652; border-radius:999px; } html[data-theme="green"] ::-webkit-scrollbar-thumb:hover{ background:#4D8068; } /* ===================================================== STATISTICS PAGINATION — GREEN ===================================================== */ .statistics-pagination button{ background:#234536; color:#ECFDF5; border:1px solid #35644E; } /* ===================================================== DISABLED ===================================================== */ .statistics-pagination button:disabled{ background:#142C21; color:#8AA99B; border-color:#234536; opacity:1; } /* ===================================================== STATISTICS PAGINATION — GREEN THEME Override page pagination ===================================================== */ .statistics-pagination button{ background:#234536 !important; color:#ECFDF5 !important; border:1px solid #35644E !important; } /* DISABLED */ .statistics-pagination button:disabled{ background:#142C21 !important; color:#8AA99B !important; border-color:#234536 !important; opacity:1 !important; } /* ===================================================== SUMMARY — DEBT PAGINATION ===================================================== */ .debt-page-button{ background:#234536; color:#ECFDF5; border:1px solid #35644E; } .debt-page-button:hover{ background:#35644E; } .debt-page-button:disabled{ background:#163126; color:#8AA99B; border-color:#2B4F3E; opacity:1; } .debt-page-info{ color:#C8DFD4; } /* ===================================================== PAYROLL MONTHLY — HOME ===================================================== */ /* ===================================================== PREVIOUS PAYROLL ===================================================== */ html[data-theme="green"] .home-payroll-title{ color:var(--text); } html[data-theme="green"] .home-payroll-period{ color:var(--text-secondary); } html[data-theme="green"] .home-payroll-salary{ color:var(--text); } /* ===================================================== PREVIOUS ATTENDANCE ===================================================== */ html[data-theme="green"] .home-attendance-item{ background:#163126; } html[data-theme="green"] .home-attendance-item span{ color:var(--text-secondary); } html[data-theme="green"] .home-attendance-item strong{ color:var(--text); } /* ===================================================== CURRENT ATTENDANCE ===================================================== */ html[data-theme="green"] .attendance-period{ color:var(--text-secondary); } html[data-theme="green"] .attendance-item{ background:#163126; } html[data-theme="green"] .attendance-item span{ color:var(--text-secondary); } html[data-theme="green"] .attendance-item strong{ color:var(--text); } /* ===================================================== FINANCIAL HOME HIGHEST EXPENSE — GREEN ===================================================== */ html[data-theme="green"] .financial-home-highest-date{ color:var(--text) !important; } html[data-theme="green"] .financial-home-highest-value{ color:var(--text) !important; }