// Correctly inherit ion-text-wrap onto labels.
ion-item.ion-text-wrap ion-label {
    white-space: normal !important;
}


// Ionic toolbar.
ion-toolbar ion-back-button,
ion-toolbar .in-toolbar.button-clear {
    --color: var(--ion-color-primary-contrast);
}

// Ionic icon.
ion-icon {
    &.icon-slash::after,
    &.icon-backslash::after {
        content: " ";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background-color: var(--ion-color-danger);
        -webkit-mask: url("/assets/fonts/font-awesome/solid/slash.svg") no-repeat 50% 50%;
        mask: url("/assets/fonts/font-awesome/solid/slash.svg") no-repeat 50% 50%;
    }

    &.icon-slash::after {
        -webkit-transform: scale(-1, 1);
        transform: scale(-1, 1);
    }

    &.fa-fw {
        text-align: center;
        width: 1.25em;
    }
}

[dir=rtl] ion-icon.icon-flip-rtl {
    -webkit-transform: scale(-1, 1);
    transform: scale(-1, 1);
}

// Ionic alert.
ion-alert.core-alert-network-error .alert-head {
    position: relative;
    content: " ";
    background: url("/assets/fonts/font-awesome/solid/wifi.svg") no-repeat 50% 50%;
    margin: 25px auto;

    &::after {
        content: " ";
        position: absolute;
        top: -20%;
        right: -15%;
        width: 50%;
        height: 50%;
        background-color: var(--ion-color-danger);
        -webkit-mask: url("/assets/fonts/font-awesome/solid/exclamation-triangle.svg") no-repeat 50% 50%;
        mask: url("/assets/fonts/font-awesome/solid/exclamation-triangle.svg") no-repeat 50% 50%;
    }
}
[dir=rtl] ion-alert.core-alert-network-error .alert-head::after {
    right: unset;
    left: -15%;
}

// Ionic item divider.
ion-item-divider {
    --background: var(--gray-lighter);
    border: 0;
}

// Ionic list.
ion-list.list-md {
    padding-bottom: 0;
}

// Modals.
.core-modal-fullscreen  .modal-wrapper {
    position: absolute;
    // @todo @include position(0 !important, null, null, 0 !important);
    display: block;
    width: 100% !important;
    height: 100% !important;
}

.core-modal-force-on-top {
    z-index: 100000 !important;
}

// Hidden submit button.
.core-submit-hidden-enter {
    position: absolute;
    visibility: hidden;
    left: -1000px;
}

// Note on foot of ion-input.
.item .core-input-footnote {
    width: 100%;
    font-style: italic;
    margin-top: 0;
    margin-bottom: 10px;
    font-size: 14px;
}

// Avatar
// -------------------------
// Large centered avatar
img.large-avatar {
    display: block;
    margin: auto;
    width: 90px;
    height: 90px;
    max-width: 90px;
    max-height: 90px;
    margin-bottom: 10px;
    border-radius : 50%;
    padding: 4px;
    border: 1px solid #ddd;
    background-color: transparent;
}

ion-avatar ion-img, ion-avatar img {
    text-indent: -99999px;
    background-color: --var(--gray-light);
}