/* Shared role-dashboard icon treatment.
   JmsIcon renders as a child component, so dashboard colour/size rules live globally. */
svg.home-action-icon,
svg.home-row-icon,
svg.simple-role-icon {
    display: block;
    color: var(--gold, #CAA674) !important;
}

svg.home-action-icon {
    width: 34px !important;
    height: 34px !important;
}

svg.home-row-icon {
    width: 22px !important;
    height: 22px !important;
}

svg.simple-role-icon {
    width: 30px !important;
    height: 30px !important;
}

/* On Site home is intentionally simple: two actions per row with no redundant role card. */
.home-action-grid.onsite-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.onsite-actions + .simple-role-card {
    display: none !important;
}

/* Bottom navigation keeps the standard state colours: inactive grey, active gold. */
svg.bottom-nav-icon {
    display: block;
    width: 22px !important;
    height: 22px !important;
    color: inherit !important;
}

@media (max-width: 430px) {
    svg.home-action-icon {
        width: 32px !important;
        height: 32px !important;
    }

    svg.home-row-icon {
        width: 21px !important;
        height: 21px !important;
    }
}