/* PartnerDataHint: the partner callout inside "no data" states (reports and Investments). Violet is the Partner
   Sharing hue. Light tokens on :root, dark on [data-bs-theme="dark"] so it follows the app theme. */

:root {
    --pdh-accent: hsl(calc(262.12deg + var(--ci-accent-shift, 0deg)) 83.26% 57.84%);
    --pdh-badge-bg: hsl(calc(251.43deg + var(--ci-accent-shift, 0deg)) 91.3% 95.49%);
    --pdh-bg: linear-gradient(135deg, hsl(calc(260deg + var(--ci-accent-shift, 0deg)) 100% 97.06%) 0%, hsl(calc(260deg + var(--ci-accent-shift, 0deg)) 100% 98.82%) 100%);
    --pdh-border: hsl(calc(256.6deg + var(--ci-accent-shift, 0deg)) 74.6% 87.65%);
    --pdh-title: #0B0F19;
    --pdh-text: #565973;
}

[data-bs-theme="dark"] {
    --pdh-accent: hsl(calc(252.5deg + var(--ci-accent-shift, 0deg)) 94.74% 85.1%);
    --pdh-badge-bg: hsl(calc(255.25deg + var(--ci-accent-shift, 0deg)) 45.04% 25.69%);
    --pdh-bg: linear-gradient(135deg, hsl(calc(247.94deg + var(--ci-accent-shift, 0deg)) 83.95% 68.24% / .18) 0%, hsl(calc(247.94deg + var(--ci-accent-shift, 0deg)) 83.95% 68.24% / .06) 100%);
    --pdh-border: hsl(calc(256deg + var(--ci-accent-shift, 0deg)) 41.67% 28.24%);
    --pdh-title: #F1F2FA;
    --pdh-text: #B4B7C9;
}

.pdh {
    display: flex;
    align-items: flex-start;
    gap: .85rem;
    width: 100%;
    max-width: 520px;
    margin: .85rem auto 0;
    padding: .9rem 1rem;
    text-align: left;
    background: var(--pdh-bg);
    border: 1px solid var(--pdh-border);
    border-radius: 14px;
}

.pdh-icon {
    position: relative;
    display: inline-grid;
    flex: 0 0 auto;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: var(--pdh-badge-bg);
    color: var(--pdh-accent);
    font-size: 17px;
}

/* The arrow nods toward the avatar, which sits at the top right of the page. */
.pdh-pointer {
    position: absolute;
    top: -7px;
    right: -7px;
    display: grid;
    place-items: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--pdh-accent);
    color: #FFFFFF;
    font-size: 9px;
    transform: rotate(45deg);
    animation: pdh-nudge 1.8s ease-in-out infinite;
}

[data-bs-theme="dark"] .pdh-pointer { color: hsl(calc(251.74deg + var(--ci-accent-shift, 0deg)) 56.1% 16.08%); }

.pdh-body { display: flex; flex-direction: column; gap: .15rem; min-width: 0; }

.pdh-title {
    font-family: var(--tx-font, inherit);
    font-size: 14px;
    font-weight: 600;
    color: var(--pdh-title);
}

.pdh-text { font-size: 13px; line-height: 1.5; color: var(--pdh-text); }

@keyframes pdh-nudge {
    0%, 100% { transform: rotate(45deg) translateY(0); }
    50% { transform: rotate(45deg) translateY(-2px); }
}

@media (prefers-reduced-motion: reduce) {
    .pdh-pointer { animation: none; }
}
