/* ===================================================== Finance Assistant Global Theme File : pink.css Theme : Pink Version : 1.0.0 Description : Soft Elegant Dominant Pink Theme ===================================================== */ /* ===================================================== THEME VARIABLES ===================================================== */ html[data-theme="pink"]{ color-scheme:light; --primary:#D97898; --background:#F8E5EC; --card:#FBEAF0; --text:#49353D; --text-secondary:#8C6F79; --border:#E9C7D3; --shadow: 0 4px 18px rgba(180,90,120,.12); --surface:#F3D5DF; --text-primary:#49353D; } /* ===================================================== BODY ===================================================== */ html[data-theme="pink"] body{ background:var(--background); color:var(--text); } /* ===================================================== CARD ===================================================== */ html[data-theme="pink"] .card{ background:var(--card); color:var(--text); border-color:var(--border); box-shadow: 0 4px 16px rgba(180,90,120,.10); } /* ===================================================== SECTION ===================================================== */ html[data-theme="pink"] .section{ color:var(--text); } /* ===================================================== TEXT ===================================================== */ html[data-theme="pink"] .text-primary{ color:var(--text); } html[data-theme="pink"] .text-secondary{ color:var(--text-secondary); } /* ===================================================== INPUT ===================================================== */ html[data-theme="pink"] input, html[data-theme="pink"] select, html[data-theme="pink"] textarea{ background:#FCEFF3; color:var(--text); border-color:var(--border); } html[data-theme="pink"] input::placeholder{ color:#B99AA5; } /* ===================================================== BUTTON OUTLINE ===================================================== */ html[data-theme="pink"] .button-outline{ background:#F6DDE6; color:var(--text); border-color:var(--border); } /* ===================================================== FILTER ===================================================== */ html[data-theme="pink"] .filter-select{ background:#FCEFF3; color:var(--text); } html[data-theme="pink"] .filter-input{ background:#FCEFF3; color:var(--text); } html[data-theme="pink"] .filter-period{ background:#FCEFF3; } html[data-theme="pink"] .filter-period:hover{ background:#F3D5DF; } html[data-theme="pink"] .filter-period-text{ color:var(--text); } html[data-theme="pink"] .filter-chip{ background:#F6DDE6; color:#795764; border-color:var(--border); } html[data-theme="pink"] .filter-chip.active{ background: linear-gradient( 135deg, #D97898, #E69AB4 ); border-color:#D97898; color:#ffffff; box-shadow: 0 4px 12px rgba(217,120,152,.25); } /* ===================================================== FILTER SHEET ===================================================== */ html[data-theme="pink"] .filter-sheet{ background:#F8E5EC; color:var(--text); } html[data-theme="pink"] .filter-sheet-header{ border-color:var(--border); } html[data-theme="pink"] .filter-sheet-header p{ color:var(--text-secondary); } html[data-theme="pink"] .filter-sheet-handle{ background:#D9A7B8; } html[data-theme="pink"] .filter-input label{ color:#765663; } html[data-theme="pink"] .filter-input input{ background:#FCEFF3; color:var(--text); border-color:var(--border); } html[data-theme="pink"] .filter-sheet-footer{ background:#F8E5EC; border-color:var(--border); } html[data-theme="pink"] #filter-cancel{ background:#EED1DC; color:#725460; } /* ===================================================== HOME ===================================================== */ html[data-theme="pink"] .section-badge{ background:#EFC8D5; color:#914E68; } html[data-theme="pink"] #summary-label{ color:var(--text-secondary); } html[data-theme="pink"] #summary-total{ color:var(--text); } html[data-theme="pink"] #summary-week{ border-color:var(--border); } html[data-theme="pink"] .summary-item strong{ color:var(--text); } /* ===================================================== HOME PRIMARY ===================================================== */ html[data-theme="pink"] .summary-total{ color:var(--text); } html[data-theme="pink"] .summary-total h2{ color:var(--primary); } /* ===================================================== STATISTICS ===================================================== */ html[data-theme="pink"] .statistics-pagination button{ background:#EBC8D4; color:#49353D; border:1px solid #DDB5C3; } html[data-theme="pink"] .statistics-pagination button:hover{ background:#E4BAC9; } html[data-theme="pink"] .statistics-pagination button:disabled{ background:#F1DCE4; color:#A9919A; border-color:#E6CCD6; opacity:1; } html[data-theme="pink"] .statistics-pagination span{ color:var(--text-secondary); } html[data-theme="pink"] .transaction-item{ border-color:var(--border); } html[data-theme="pink"] .transaction-info strong{ color:var(--text); } html[data-theme="pink"] .transaction-info small{ color:var(--text-secondary); } html[data-theme="pink"] .transaction-info p{ color:var(--text-secondary); } html[data-theme="pink"] .transaction-amount{ color:var(--text); } /* ===================================================== SUMMARY ===================================================== */ html[data-theme="pink"] .summary-item{ background:var(--surface); } html[data-theme="pink"] .summary-total{ color:var(--text); } html[data-theme="pink"] .distribution-header{ color:var(--text); } html[data-theme="pink"] .distribution-percent{ color:var(--text-secondary); } html[data-theme="pink"] .distribution-bar{ background:#E5C3CF; } html[data-theme="pink"] .distribution-fill{ background: linear-gradient( 90deg, #D97898, #E69AB4 ); } /* ===================================================== SUMMARY — DEBT ===================================================== */ html[data-theme="pink"] .debt-card{ background:#FBEAF0; color:var(--text); border-color:var(--border); } html[data-theme="pink"] .debt-card-header h3{ color:var(--text); } html[data-theme="pink"] .debt-card-header p{ color:var(--text-secondary); } html[data-theme="pink"] .debt-member{ border-color:var(--border); } html[data-theme="pink"] .debt-member-info strong{ color:var(--text); } html[data-theme="pink"] .debt-member-info small{ color:var(--text-secondary); } html[data-theme="pink"] .debt-history-item{ border-color:var(--border); } html[data-theme="pink"] .debt-history-info strong{ color:var(--text); } html[data-theme="pink"] .debt-history-info small{ color:var(--text-secondary); } html[data-theme="pink"] .debt-history-info p{ color:var(--text-secondary); } html[data-theme="pink"] .debt-history-icon{ background:#F3D5DF; } /* ===================================================== SUMMARY — DEBT PAGINATION ===================================================== */ html[data-theme="pink"] .debt-page-button{ background:#EBC8D4; color:#49353D; border:1px solid #DDB5C3; } html[data-theme="pink"] .debt-page-button:hover{ background:#E4BAC9; } html[data-theme="pink"] .debt-page-button:disabled{ background:#F1DCE4; color:#A9919A; border-color:#E6CCD6; opacity:1; } html[data-theme="pink"] .debt-page-info{ color:var(--text-secondary); } /* ===================================================== PROFILE ===================================================== */ html[data-theme="pink"] #profile-component{ color:var(--text); } html[data-theme="pink"] .profile-card{ background:var(--card); color:var(--text); border-color:var(--border); box-shadow: 0 8px 24px rgba(180,90,120,.12); } html[data-theme="pink"] .profile-menu-item{ background:var(--card); color:var(--text); box-shadow:none; } html[data-theme="pink"] .profile-menu-title{ color:var(--text); } html[data-theme="pink"] .profile-menu-description{ color:var(--text-secondary); } html[data-theme="pink"] .profile-menu-arrow{ color:#A88B96; } html[data-theme="pink"] .profile-avatar{ border-color:#F1D5DF; } html[data-theme="pink"] .profile-greeting{ background:#EFC8D5; color:#914E68; } html[data-theme="pink"] .profile-email{ color:var(--text-secondary); } html[data-theme="pink"] .profile-description{ color:var(--text-secondary); } /* ===================================================== PROFILE MENU ICON ===================================================== */ html[data-theme="pink"] .profile-menu-icon{ background:#F3D5DF; } /* ===================================================== WORKSPACE ===================================================== */ html[data-theme="pink"] .workspace-item{ background:var(--card); border-color:var(--border); color:var(--text); } html[data-theme="pink"] .workspace-item:hover{ border-color:var(--primary); } html[data-theme="pink"] .workspace-icon{ background:#F3D5DF; } html[data-theme="pink"] .workspace-name{ color:var(--text); } html[data-theme="pink"] .workspace-group-title{ color:var(--text-secondary); } html[data-theme="pink"] .workspace-create{ color:var(--primary); border-color:var(--border); } html[data-theme="pink"] .workspace-create:hover{ background:#F3D5DF; } /* ===================================================== PROFILE SETTINGS ===================================================== */ html[data-theme="pink"] .profile-settings-overlay{ background:var(--background); } html[data-theme="pink"] .profile-settings-header{ background:var(--card); border-color:var(--border); } html[data-theme="pink"] .profile-settings-back{ background:var(--surface); color:var(--text); } html[data-theme="pink"] .profile-settings-header h2{ color:var(--text); } html[data-theme="pink"] .profile-settings-header p{ color:var(--text-secondary); } html[data-theme="pink"] .profile-settings-section-title{ color:var(--text-secondary); } html[data-theme="pink"] .profile-settings-card{ background:var(--card); border-color:var(--border); box-shadow:var(--shadow); } /* ===================================================== THEME OPTIONS ===================================================== */ html[data-theme="pink"] .profile-theme-option{ background:var(--surface); color:var(--text); } html[data-theme="pink"] .profile-theme-option.active{ background:#EFC8D5; border-color:var(--primary); box-shadow: 0 4px 12px rgba(217,120,152,.15); } html[data-theme="pink"] .profile-theme-icon{ background:#FCEFF3; } html[data-theme="pink"] .profile-theme-info strong{ color:var(--text); } html[data-theme="pink"] .profile-theme-info small{ color:var(--text-secondary); } html[data-theme="pink"] .profile-theme-check{ background: linear-gradient( 135deg, #D97898, #E69AB4 ); color:#ffffff; box-shadow: 0 3px 8px rgba(217,120,152,.20); } /* ===================================================== NAVIGATION ===================================================== */ html[data-theme="pink"] #bottom-navigation{ background:#FCEFF3; border-top-color:var(--border); box-shadow: 0 -8px 24px rgba(180,90,120,.12); } html[data-theme="pink"] .nav-icon{ color:#A98D97; } html[data-theme="pink"] .nav-label{ color:#A98D97; } html[data-theme="pink"] .nav-item.active{ background: linear-gradient( 135deg, #D97898, #E69AB4 ); color:#ffffff; box-shadow: 0 5px 16px rgba(217,120,152,.25); } html[data-theme="pink"] .nav-item.active .nav-icon{ color:#ffffff; } html[data-theme="pink"] .nav-item.active .nav-label{ color:#ffffff; } html[data-theme="pink"] .nav-item:hover .nav-icon{ background:#EFC8D5; color:var(--primary); } html[data-theme="pink"] .nav-item:hover .nav-label{ color:var(--primary); } /* ===================================================== HEADER ===================================================== */ html[data-theme="pink"] #global-header{ color:var(--text); } html[data-theme="pink"] #header-banner{ box-shadow: 0 8px 24px rgba(180,90,120,.12); } /* ===================================================== EMPTY ===================================================== */ html[data-theme="pink"] .empty{ color:#A98D97; } /* ===================================================== SCROLLBAR ===================================================== */ html[data-theme="pink"]{ scrollbar-color:#D99CAF #F8E5EC; } html[data-theme="pink"] ::-webkit-scrollbar{ width:8px; } html[data-theme="pink"] ::-webkit-scrollbar-track{ background:#F8E5EC; } html[data-theme="pink"] ::-webkit-scrollbar-thumb{ background:#D99CAF; border-radius:999px; } html[data-theme="pink"] ::-webkit-scrollbar-thumb:hover{ background:#C98199; } /* ===================================================== STATISTICS PAGINATION — PINK ===================================================== */ html[data-theme="pink"] .statistics-pagination button{ background:#E8B6C7 !important; color:#5A3B47 !important; border:1px solid #D99CAF !important; box-shadow:none !important; } /* ===================================================== HOVER ===================================================== */ html[data-theme="pink"] .statistics-pagination button:hover{ background:#DFA7BB !important; color:#4B303B !important; } /* ===================================================== DISABLED ===================================================== */ html[data-theme="pink"] .statistics-pagination button:disabled{ background:#F1D9E1 !important; color:#B99AA5 !important; border-color:#E7C8D2 !important; opacity:1 !important; } /* ===================================================== PAGE INFO ===================================================== */ html[data-theme="pink"] .statistics-pagination span{ color:#8C6F79 !important; }