/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jun 22 2026 | 00:17:11 */
/* ============================================================
   BrightLeaf Giving — Admin Accounts Dashboard
   ------------------------------------------------------------
   Scope: /dashboard/adminaccounts/ (page 5158)
   Snippet: 126 ([code_snippet id=126 shortcodes name="BL Accounts Dashboard"])
   Audience: internal (Gil, Boruch). Information-dense, scannable.
   Brand: BLG tokens — forest green, ink, paper.
   ============================================================ */

/* Tokens scoped to the dashboard wrapper so we don't leak. */
.bl-da {
    --bl-green:        #2F7E4B;
    --bl-green-dark:   #225A36;
    --bl-green-soft:   rgba(47, 126, 75, 0.10);
    --bl-green-tint:   #EAF3EE;
    --bl-lime:         #A8C64A;
    --bl-navy:         #0b2a4a;

    --bl-ink:          #1F2A26;
    --bl-ink-2:        #2A3833;
    --bl-muted:        #56645F;
    --bl-faint:        #8A958F;

    --bl-paper:        #F7F9F6;
    --bl-paper-2:      #F1F4F0;
    --bl-surface:      #FFFFFF;
    --bl-border:       #DEE4E1;
    --bl-border-soft:  #E8EDE9;

    --bl-amber:        #B07C1D;
    --bl-red:          #C0392B;
    --bl-red-soft:     rgba(192, 57, 43, 0.06);

    --bl-radius-sm:    8px;
    --bl-radius-md:    12px;
    --bl-radius-lg:    16px;

    --bl-shadow-xs:    0 1px 2px rgba(11, 42, 74, 0.04);
    --bl-shadow-sm:    0 1px 3px rgba(11, 42, 74, 0.06), 0 4px 12px rgba(11, 42, 74, 0.04);
    --bl-shadow-md:    0 4px 12px rgba(11, 42, 74, 0.10), 0 12px 32px rgba(11, 42, 74, 0.08);

    --bl-font:         'Nunito Sans', -apple-system, BlinkMacSystemFont, sans-serif;
    --bl-font-display: 'RM Neue', 'Nunito Sans', -apple-system, sans-serif;

    font-family: var(--bl-font);
    color: var(--bl-ink);
    background: var(--bl-paper);
    padding: 24px clamp(16px, 3vw, 32px) 56px;
    border-radius: var(--bl-radius-lg);
    max-width: 100%;
}

/* ---------- Header ---------- */
.bl-da__header {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding-bottom: 20px;
    margin-bottom: 28px;
    border-bottom: 1px solid var(--bl-border);
}
.bl-da__title {
    font-family: var(--bl-font-display);
    font-size: clamp(24px, 2.4vw, 32px);
    font-weight: 700;
    color: var(--bl-ink);
    margin: 0;
    letter-spacing: -0.01em;
}
.bl-da__subtitle {
    font-size: 14px;
    color: var(--bl-muted);
    margin: 0;
}

/* ---------- Sections ---------- */
.bl-da-section {
    margin-bottom: 36px;
}
.bl-da-section:last-child { margin-bottom: 0; }

.bl-da-section__title {
    font-family: var(--bl-font-display);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--bl-muted);
    margin: 0 0 14px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--bl-border-soft);
    display: flex;
    align-items: center;
    gap: 10px;
}
.bl-da-section__tag {
    display: inline-block;
    background: var(--bl-green-soft);
    color: var(--bl-green-dark);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    padding: 2px 8px;
    border-radius: 999px;
}

/* ---------- Period grouping (MTD / Last Month / YTD) ---------- */
.bl-da-period {
    margin-bottom: 22px;
}
.bl-da-period:last-child { margin-bottom: 0; }

.bl-da-period__title {
    font-family: var(--bl-font);
    font-size: 14px;
    font-weight: 700;
    color: var(--bl-ink);
    margin: 0 0 10px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.bl-da-period__tag {
    display: inline-block;
    background: var(--bl-paper-2);
    color: var(--bl-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    padding: 2px 8px;
    border-radius: 999px;
}

/* ---------- Grids ---------- */
.bl-da-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 12px;
}
.bl-da-grid--hero {
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 14px;
    margin-bottom: 14px;
}
.bl-da-grid--breakdown {
    grid-template-columns: 1fr repeat(auto-fill, minmax(180px, 1fr));
    gap: 10px;
    padding: 12px 14px;
    background: var(--bl-paper-2);
    border-radius: var(--bl-radius-md);
    border: 1px solid var(--bl-border-soft);
    align-items: center;
}
.bl-da-breakdown-label {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--bl-muted);
}

/* ---------- Card base (.go-metric is the existing shortcode output) ---------- */
.bl-da .go-metric {
    background: var(--bl-surface);
    border: 1px solid var(--bl-border-soft);
    border-radius: var(--bl-radius-md);
    padding: 14px 16px;
    box-shadow: var(--bl-shadow-xs);
    transition: box-shadow 0.18s ease, transform 0.18s ease, border-color 0.18s ease;
    position: relative;
}
.bl-da .go-metric:hover {
    box-shadow: var(--bl-shadow-sm);
    border-color: var(--bl-border);
}

.bl-da .go-metric__inner {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.bl-da .go-metric__metric {
    font-family: var(--bl-font-display);
    font-size: 22px;
    font-weight: 700;
    color: var(--bl-ink);
    line-height: 1.15;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

.bl-da .go-metric__label {
    font-size: 12px;
    font-weight: 600;
    color: var(--bl-muted);
    line-height: 1.3;
}

/* ---------- Accent cards (heroes) ---------- */
.bl-da .go-metric.is-accent {
    background: linear-gradient(180deg, #FFFFFF 0%, var(--bl-green-tint) 100%);
    border-color: var(--bl-green-soft);
    border-left: 3px solid var(--bl-green);
}
.bl-da .go-metric.is-accent .go-metric__metric {
    color: var(--bl-green-dark);
}

/* Hero-tier cards get larger numbers */
.bl-da .go-metric.is-hero .go-metric__metric {
    font-size: 28px;
}

/* Sub-cards inside breakdown rows — compact */
.bl-da .go-metric.is-sub {
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 0;
}
.bl-da .go-metric.is-sub:hover { box-shadow: none; }
.bl-da .go-metric.is-sub .go-metric__metric {
    font-size: 18px;
    color: var(--bl-ink);
}
.bl-da .go-metric.is-sub .go-metric__label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

/* ---------- Currency / Percent / Count formatting ---------- */
.bl-da .go-metric.is-currency .go-metric__metric::before {
    content: "$";
    font-weight: 600;
    color: var(--bl-faint);
    margin-right: 2px;
    font-size: 0.78em;
    vertical-align: 0.08em;
}
.bl-da .go-metric.is-currency.is-accent .go-metric__metric::before {
    color: var(--bl-green);
    opacity: 0.6;
}

/* Percent and count: no prefix; the value already includes % if applicable */
.bl-da .go-metric.is-percent .go-metric__metric,
.bl-da .go-metric.is-count .go-metric__metric {
    color: var(--bl-navy);
}
.bl-da .go-metric.is-percent.is-accent .go-metric__metric,
.bl-da .go-metric.is-count.is-accent .go-metric__metric {
    color: var(--bl-green-dark);
}

/* ---------- Negative-value coloring (set by JS pass) ---------- */
.bl-da .go-metric.is-negative .go-metric__metric {
    color: var(--bl-red);
}
.bl-da .go-metric.is-negative.is-accent {
    background: linear-gradient(180deg, #FFFFFF 0%, var(--bl-red-soft) 100%);
    border-left-color: var(--bl-red);
}
.bl-da .go-metric.is-negative.is-accent .go-metric__metric {
    color: var(--bl-red);
}

/* Delta metric (MoM change) — show sign indicator */
.bl-da .go-metric.is-delta.is-negative .go-metric__metric::after {
    content: " 25BC";
    font-size: 0.7em;
    margin-left: 4px;
    vertical-align: 0.08em;
}
.bl-da .go-metric.is-delta.is-positive .go-metric__metric::after {
    content: " 25B2";
    font-size: 0.7em;
    margin-left: 4px;
    color: var(--bl-green);
    vertical-align: 0.08em;
}

/* ---------- Tablet ---------- */
@media (max-width: 900px) {
    .bl-da { padding: 20px 16px 40px; }
    .bl-da-grid,
    .bl-da-grid--hero {
        grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
        gap: 10px;
    }
    .bl-da-grid--breakdown {
        grid-template-columns: 1fr 1fr;
    }
    .bl-da-breakdown-label {
        grid-column: 1 / -1;
        margin-bottom: 2px;
    }
    .bl-da .go-metric__metric { font-size: 20px; }
    .bl-da .go-metric.is-hero .go-metric__metric { font-size: 24px; }
}

/* ---------- Mobile ---------- */
@media (max-width: 560px) {
    .bl-da {
        padding: 16px 12px 32px;
        border-radius: var(--bl-radius-md);
    }
    .bl-da__title { font-size: 22px; }
    .bl-da-grid,
    .bl-da-grid--hero {
        grid-template-columns: 1fr 1fr;
        gap: 8px;
    }
    .bl-da-grid--breakdown {
        grid-template-columns: 1fr;
        padding: 10px;
    }
    .bl-da .go-metric { padding: 12px 12px; }
    .bl-da .go-metric__metric { font-size: 18px; }
    .bl-da .go-metric.is-hero .go-metric__metric { font-size: 22px; }
    .bl-da .go-metric__label { font-size: 11px; }
}
