/* ======================================================================== For Goodness Cakes (FkTeam 48599) — site-wide theme overrides. App.razor loads this file on every page, for every team. PaywallLayout.razor puts class="fgc" on the wrapper
around the whole layout (header, sidebar and main) when the TeamId claim is 48599. Every rule below is scoped under .fgc, so it applies to FGC users only and leaves every other team on the default Argenta palette. FGC palette: #EE7779 melon — primary accent (was Argenta teal #00A1BE) #1A8584 deep teal — secondary accent (was Argenta green #00CC78) #92C4B6 pastel teal — tertiary highlights (open icons, badges, date-range buttons) #FFFFFF white — text-on-color Original Argenta vars being overridden: --color-primary, --color-buttons, --color-buttons-hover, --color-secondary, --color-links-hover, --color-tertiary, --color-rfv, --color-icons, --color-links. ======================================================================== */ /* ===== Theme variable overrides ===== */ .fgc { --color-primary: #EE7779; --color-buttons: #EE7779; --color-buttons-hover: #d96a6c; --color-secondary: #1A8584; --color-links-hover: #1A8584; --color-tertiary: #EE7779; --color-rfv: #EE7779; --color-icons: #EE7779; --color-links: #EE7779; } /* ===== Top-right header icons (New Tab / Report Center / Help Center / Settings / Sign Out) — pastel teal #92C4B6 for FGC team. The icons use the global `.teal` class (color:#00A1BE !important). The Help Center icon also carries an inline `color:#00A1BE` (without !important on Blazor side, so external !important wins). */ .fgc .paywall-header .teal, .fgc .paywall-header i[style*="#00A1BE"] { color: #92C4B6 !important; } /* ===== Sidebar (left-hand main menu) — nav-header icons in FGC melon ===== Sidebar lives outside
, so PaywallLayout also adds .fgc to via JS interop. That makes both `.fgc .nav-header` (body-level) and `.fgc .cst-iconbar` (main-level) match. */ .fgc .nav-header i:first-child, .fgc .nav-header:hover i:first-child, .fgc .sidebar-menu .nav-link i:first-child, .fgc .sidebar-menu .nav-link:hover i:first-child, .fgc .sidebar-menu .nav-link.active i:first-child { color: #EE7779 !important; } /* ===== Workspace iconbar (cst-iconbar) — swap teal accents to FGC melon ===== */ .fgc .cst-iconbar a:hover { background: rgba(238,119,121,.10) !important; } .fgc .cst-iconbar a i, .fgc .cst-iconbar a:hover i, .fgc .cst-iconbar a.active i { color: #EE7779 !important; } .fgc .cst-iconbar a.active, .fgc .cst-iconbar a.active:hover { background: rgba(238,119,121,.15) !important; border-bottom-color: #EE7779 !important; } /* ===== Title-bar action icons (cst-title-link) — pastel teal ===== */ .fgc .cst-title-link, .fgc .cst-title-link i, .fgc .cst-title-link:hover, .fgc .cst-title-link:hover i { color: #92C4B6 !important; } /* ===== Record name (between workspace title and menu) — deep teal ===== */ .fgc strong[style*="var(--color-primary)"] { color: #1A8584 !important; } /* ===== HIDE FILTER pill hover state — pin to melon, no orange flash ===== */ .fgc .grid-filter-panel.is-open .grid-filter-header:hover .grid-filter-toggle-pill { background: #EE7779 !important; border-color: #EE7779 !important; } /* ===== Date-range quick-click filter buttons — pastel teal ===== */ .fgc .btn-date-range, .fgc .btn.btn-date-range { background-color: #92C4B6 !important; border-color: #92C4B6 !important; color: #fff !important; } .fgc .btn-date-range:hover, .fgc .btn.btn-date-range:hover { background-color: #7DB7A6 !important; border-color: #7DB7A6 !important; color: #fff !important; } /* ===== Grid Open-record button — pastel teal, no hover state change ===== */ .fgc .grid-action-btn.green, .fgc .grid-action-btn.green:hover, .fgc .grid-action-btn.green:focus, .fgc .grid-action-btn.green:active, .fgc .grid-action-btn.green:visited { background: #92C4B6 !important; color: #fff !important; text-decoration: none !important; } .fgc .grid-action-btn.green i, .fgc .grid-action-btn.green:hover i, .fgc .grid-action-btn.green:focus i { color: #fff !important; } /* ===== Argenta `.green` text + btn-green button — deep teal ===== */ .fgc .green { color: #1A8584 !important; } .fgc .btn.btn-green { background-color: #1A8584 !important; border-color: #1A8584 !important; } /* ===== Status badges in grids (Volunteers, Donors, etc.) — swap the global Argenta green/active background (#00CC78) to FGC pastel teal #92C4B6. Many grid pages set the badge color via INLINE style (e.g., `background:#00CC78`) which inline-CSS normally beats external CSS — `!important` on the attribute-selector match wins. We only swap "background" and "background-color" tokens, never border/text color. */ .fgc [style*="background:#00CC78"], .fgc [style*="background: #00CC78"], .fgc [style*="background-color:#00CC78"], .fgc [style*="background-color: #00CC78"] { background: #92C4B6 !important; background-color: #92C4B6 !important; } /* ===== Notifications-card record-type badge ("VolunteerTasks", "Clients", etc.). NotificationPanel.razor renders the badge with INLINE `background-color:#E0F5F9; color:#00A1BE`. Recolor for FGC users to melon. */ .fgc .badge[style*="#00A1BE"] { background-color: #FCE3E4 !important; color: #EE7779 !important; }