<div ng-show="popover.text" class="at-Popover" ng-class="{ 'at-Popover--inline': popover.inline }">
    <div class="at-Popover-icon"
          ng-class="{ 'at-Popover-icon--defaultCursor': popover.on === 'mouseenter' && !popover.click }">
        <i class="fa {{ popover.icon }}"></i>
    </div>
    <div class="at-Popover-container">
        <div class="at-Popover-arrow">
            <div ng-if="popover.position === 'right'" class="fa fa-caret-left fa-2x"></div>
            <div ng-if="popover.position === 'top'" class="fa fa-caret-down fa-2x"></div>
        </div>
        <div class="at-Popover-content">
            <h4 ng-if="popover.title" class="at-Popover-title">{{ popover.title | translate }}</h4>
            <p ng-if="popover.text" class="at-Popover-text">{{ popover.text | translate }}</p>
        </div>
    </div>
</div>
