.Toast .k-notification-actions, .tinyToast .k-notification-actions {
    display: none;
}

.Toast .k-notification-container{
    display : block !important;
}
.k-notification-group.Toast {
    top: 40px !important;
}

.Toast .k-notification {
    width: 520px;
    border-radius: 12px !important;
    box-shadow: 0 4px 20px 5px rgba(0, 0, 0, 0.08) !important;
    padding: 8px 24px 8px 26px;
}


.Toast .contentContainer {
    align-items: center;
    justify-content: space-between;
}

.Toast .iconAndTextContainer {
    align-items: center;
    gap: 16px;
}

.Toast .textContainer {
    flex-direction: column;
    gap: 6px;
}

.Toast .titleText {
    font-family: "halyard-display";
    font-size: 16px;
    font-weight: 500;
}

.Toast .bodyText {
    font-family: "ProximaNova";
    font-size: 14px;
    font-weight: normal;
}

.successToast.Toast .k-notification {
    border-left: solid 3px var(--colors-fill-success-light-green);
}

.recurringToast.Toast .k-notification {
    border-left: solid 3px var(--colors-fill-brand);
}

.warningToast.Toast .k-notification {
    border-left: solid 3px var(--colors-fill-warning);
}
.errorToast.Toast .k-notification {
    border-left: solid 3px var(--colors-fill-error);
}
.Toast .closeIcon {
    cursor: pointer;
    padding-left : 24px;
}

/* Tiny Toast */
.k-notification-group.tinyToast {
    bottom: 16px !important;
    /* Temporarily have right right aligned and 16px from right until Andrew checks in with UI/UX. Current design doesn't seem that possible to incorporate */
    right: 16px !important;
    position: absolute;
}

.tinyToast .k-notification {
    min-width: 338px;
    max-width: 520px;
    padding: 16px;
    border-radius: 8px;
    box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.08);
}


.tinyToast .contentContainer {
    align-items: center;
    justify-content: space-between;
}

.tinyToast .iconAndTextContainer {
    align-items: center;
    gap: 8px;
}

.tinyToast .titleText {
    font-family: "halyard-display";
    font-size: 14px;
    font-weight: normal;
}

.tinyToast .closeIcon {
    cursor: pointer;
    padding-left: 24px;
}


.successToast.Toast span.successToast.Toast svg path, .successToast.tinyToast span.successToast.tinyToast svg path {
    fill: var(--colors-content-success-light);
}

.recurringToast.Toast span.recurringToast.Toast svg path, .recurringToast.tinyToast span.recurringToast.tinyToast svg path {
    stroke: var(--colors-content-brand);
}

.warningToast.Toast span.warningToast.Toast svg path, .warningToast.tinyToast span.warningToast.tinyToast svg path {
    fill: var(--colors-content-warning);
}
.errorToast.Toast span.errorToast.Toast svg path, .errorToast.tinyToast span.errorToast.tinyToast svg path {
    fill: var(--colors-fill-error);
}