/* DashAway balance component */
dashaway-balance {
    min-height: 32px;
}

.dashaway-balance {
    background:
        color-mix(
            in oklab,
            var(--accent) 8%,
            transparent
        );

    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        color 0.2s ease,
        transform 0.2s ease;
}

.dashaway-balance:hover {
    background:
        color-mix(
            in oklab,
            var(--accent) 16%,
            transparent
        );

    transform: translateY(-1px);
}

/* Signed-out state: accent-aware dollar-credit icon button */
.dashaway-balance-signed-out {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    color: var(--accent);
    border: 1px solid
        color-mix(
            in oklab,
            var(--accent) 55%,
            var(--border)
        );
    background:
        color-mix(
            in oklab,
            var(--accent) 10%,
            transparent
        );

    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        color 0.2s ease,
        transform 0.2s ease,
        box-shadow 0.2s ease;
}

.dashaway-balance-signed-out:hover {
    color: #fff;
    border-color: var(--accent-hover);
    background: var(--accent-hover);
    transform: translateY(-1px);
}

.dashaway-balance-signed-out:focus-visible {
    outline: none;
    box-shadow:
        0 0 0 2px var(--bg),
        0 0 0 4px var(--accent);
}

.dashaway-balance-currency-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    color: currentColor;
    font-family:
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Roboto,
        sans-serif;
    font-size: 22px;
    font-weight: 750;
    line-height: 1;
    transform: translateY(-0.5px);
}