/*
 * Instance-specific color overrides.
 * Uncomment and change any variable below to customize the portal appearance.
 * This file is loaded after style.css, so values here take precedence.
 *
 * TIP: Change just --tp-primary and --tp-footer-bg for a quick rebrand.
 * The component variables (header, nav, title, etc.) inherit from the
 * base palette by default, so changing a base color propagates everywhere.
 */

:root {
    /* ── Base palette ─────────────────────────────────────────────── */
    --tp-primary: #4477a7;            /* Main brand color - sophisticated blue */
    --tp-primary-dark: #2d5a87;       /* Darker shade for hover states */
    --tp-primary-light: #e6f0f8;      /* Light tint for hover backgrounds */
    --tp-bg: #f8fafc;                 /* Page background */
    --tp-surface: #ffffff;            /* Card / content background */
    --tp-text: #1a202c;              /* Body text - WCAG AA compliant */
    --tp-text-dark: #1a202c;         /* Headings, strong text */
    --tp-text-secondary: #2d3748;    /* Secondary text */
    --tp-muted: #4a5568;             /* Muted / helper text */
    --tp-border: #e2e8f0;            /* Borders, dividers */

    /* ── Typography ─────────────────────────────────────────────────── */
    /* --tp-font-size-base: 16px;       Base font size */
    /* --tp-font-size-sm: 14px;         Small text */
    /* --tp-font-size-lg: 18px;         Large text */
    /* --tp-font-size-xl: 20px;         Extra large text */
    /* --tp-font-size-2xl: 24px;        2X large text */
    /* --tp-line-height-base: 1.5;     Base line height */

    /* ── Header ───────────────────────────────────────────────────── */
    /* --tp-header-bg: var(--tp-surface);       Header background */
    /* --tp-header-border: var(--tp-border);    Header bottom border */
    /* --tp-header-title: var(--tp-text-dark);  Site title color */
    /* --tp-header-title-link: var(--tp-primary); Header title link color */
    /* --tp-header-subtitle: var(--tp-muted);   Site subtitle color */
    /* --tp-header-subtitle-size: clamp(0.9375rem, 2.2vw, 1.0625rem);  Subtitle responsive size */
    /* --tp-header-subtitle-weight: 500;         Subtitle font weight */
    /* --tp-header-subtitle-margin-top: 0.375rem;  Subtitle top margin */
    /* --tp-header-subtitle-line-height: 1.3;     Subtitle line height */
    /* --tp-header-subtitle-spacing: 0.005em;    Subtitle letter spacing */

    /* ── Navigation ───────────────────────────────────────────────── */
    /* --tp-nav-text: var(--tp-text-secondary);  Nav link text */
    /* --tp-nav-hover: var(--tp-primary);        Nav link hover */
    /* --tp-nav-active-bg: var(--tp-primary);    Active nav background */
    /* --tp-nav-active-text: #ffffff;            Active nav text */

    /* ── Search ───────────────────────────────────────────────────── */
    /* --tp-search-bg: var(--tp-surface);       Search input background */
    /* --tp-search-border: var(--tp-border);     Search input border */
    /* --tp-search-text: var(--tp-text);         Search input text */
    /* --tp-search-icon: var(--tp-muted);        Search icon color */
    /* --tp-search-btn-bg: var(--tp-surface);    Search button background */
    /* --tp-search-btn-border: var(--tp-border); Search button border */
    /* --tp-search-btn-hover: var(--tp-primary);  Search button hover */

    /* ── Page title banner ────────────────────────────────────────── */
    /* --tp-title-bg: var(--tp-primary);         Banner gradient start */
    /* --tp-title-bg-dark: var(--tp-primary-dark); Banner gradient end */
    /* --tp-title-text: #ffffff;                 Banner text */

    /* ── Footer ───────────────────────────────────────────────────── */
    /* --tp-footer-bg: #1e293b;          Footer background */
    /* --tp-footer-text: #cbd5e1;        Footer body text */
    /* --tp-footer-link: #e2e8f0;        Footer link color */
    /* --tp-footer-hover: #fbbf24;       Footer link hover (accent) */
    /* --tp-footer-muted: #94a3b8;       Footer small / muted text */

    /* ── Tables ───────────────────────────────────────────────────── */
    /* --tp-table-header-bg: #4477a7;   /* Primary blue table header background */
    /* --tp-table-header-text: #ffffff;  /* White table header text */

    /* ── Accordion ────────────────────────────────────────────────── */
    /* --tp-accordion-bg: #f1f5f9;                        Collapsed background */
    /* --tp-accordion-text: var(--tp-text-dark);           Collapsed text */
    /* --tp-accordion-active-bg: var(--tp-primary-light);  Expanded background */
    /* --tp-accordion-active-text: var(--tp-primary-dark); Expanded text */

    /* ── Return to top button ─────────────────────────────────────── */
    /* --tp-return-to-top-bg: var(--tp-primary);  Button background */
    /* --tp-return-to-top-hover: var(--tp-primary-dark); Button hover */
    /* --tp-return-to-top-icon: #ffffff;          Icon color */

    /* ── Elected members cards ────────────────────────────────────── */
    /* --tp-member-card-bg: var(--tp-surface);           Card background */
    /* --tp-member-card-border: var(--tp-border);        Card border */
    /* --tp-member-card-hover-shadow: var(--tp-shadow-md); Card hover shadow */
    /* --tp-member-card-position: var(--tp-muted);       Position text color */
    /* --tp-member-card-salary-bg: var(--tp-primary-light);  Salary badge background */
    /* --tp-member-card-salary-text: var(--tp-primary-dark); Salary badge text */

    /* ── Shapes ───────────────────────────────────────────────────── */
    /* --tp-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);    Small shadow */
    /* --tp-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.06); Medium shadow */
    /* --tp-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1); Large shadow */
    /* --tp-radius: 0.5rem;              Default border radius */
    /* --tp-radius-lg: 0.75rem;          Large border radius */
}