/**
 A set of global styles that cannot be handled by themes, because of Angular/Material
 problems.
 */

body {
    margin: 0 !important;
    padding: 0 !important;
    background-color: #f6f6f6;
}

.repayment-tooltip-class {
    white-space: pre-line;
    max-width: 360px !important;
}

/**

   SNACKBARS

 */
.mat-snack-bar-container {
    max-width: 80vw !important;
    -webkit-box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.4);
    box-shadow: 0 10px 30px 0 rgba(0, 0, 0, 0.4);
}

/*  ------------------------------------- Fix   */
/* Fix a width of snackbars for HandSet modes */
.mat-snack-bar-handset .ca-snackbar {
    margin-bottom: 0 !important;
}

.mat-snack-bar-handset .mat-snack-bar-container {
    max-width: 100vw !important;
}
/*  ------------------------------------ FixEnd */

.ca-snackbar {
    margin-bottom: 5vh !important;
}

.ca-snackbar.ca-info {
    background-color: #353535 !important;
    color: white !important;
}

.ca-snackbar.ca-error {
    background-color: #d50012 !important;
    color: white !important;
}

/* All snackbar action buttons have always white text */
.ca-snackbar .mat-button-wrapper {
    color: white !important;
}

.ca-notification-info {
    background-color: #353535 !important;
    color: white !important;
}

@media #{$mat-lt-md} {
    .ca-notification-info {
        width: 100%;
    }
}

/*Some basic styles for unsupported browsers, used in case angular failed to load*/
.center-parent {
    display: none;
    height: 100%;
    background: url("../assets/images/central-support.png") no-repeat right bottom;
    background-size: contain;
}

.fake-header {
    height: 64px;
    background-color: #FF3E17;
    position: fixed;
    top: 0;
    left:0;
    right: 0;
}
.fake-header img {
    height: 25px;
    width: 150px;
    margin-top: 20px;
}

.center-parent:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}

.centered-child {
    display: inline-block;
    vertical-align: middle;
    width: 500px;
    min-width: 400px;
    text-align: left;
}

.centered-child-content {
    padding: 1em;
    margin-left: 1em;
}

.centered-child-header {
    margin-left: .5em;
}

@media screen and (max-width: 600px) {
    .centered-child {
        width: 80%;
    }
}

/* Copy for unsupported browsers*/
.mat-dialog-container {
    box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12);
    background: white;
    color: rgba(0, 0, 0, 0.87);
}