/**
 * Brand CSS variables — CentroPago.
 * Per-product file. Single source of truth for colors, logos, OG images.
 *
 * Tailwind config (in each HTML head) references:
 *   primary:   'rgb(var(--brand-primary-rgb) / <alpha-value>)'
 *   secondary: 'rgb(var(--brand-secondary-rgb) / <alpha-value>)'
 *   dark:      '#020617'   ← hardcoded in tailwind.config (opacity variants)
 *   dark-card: '#0f172a'   ← hardcoded
 */
:root {
    /* UI accent indigo */
    --brand-primary-rgb:       99 102 241;
    --brand-primary:           #6366f1;
    --brand-primary-hover:     #4338ca;

    /* Secondary green */
    --brand-secondary-rgb:     16 185 129;
    --brand-secondary:         #10b981;

    /* Dark backgrounds */
    --brand-dark:              #01051E;
    --brand-dark-card:         #060b2e;

    /* Sidebar tooltip bg */
    --brand-tooltip-bg:        #1e293b;

    /* Tertiary accent (Maracaibonet purple) — used in gradient/shadow/chat/period */
    --brand-accent-rgb:        121 34 162;
    --brand-accent:            #7922A2;

    /* Progress bar gradient */
    --brand-progress-gradient: linear-gradient(90deg, var(--brand-accent), var(--brand-secondary));

    /* Active nav shadow */
    --brand-nav-shadow:        rgb(var(--brand-accent-rgb) / 0.35);

    /* Chat bubble */
    --brand-chat-user-bg:      var(--brand-accent);

    /* Period selector active */
    --brand-period-active-color: var(--brand-accent);

    /* OG image (referenced from per-product HTML, not from shared CSS) */
    --brand-og-image:          /images/og-banner.png;

    /* Favicon */
    --brand-favicon:           /images/favicon.png;

    /* Logo image path */
    --brand-logo-src:          url('/images/logo.png');
}