@font-face {
    font-family: "Mundial-Regular";
    src: url("fonts/Mundial-Regular.otf") format("opentype");
}

@font-face {
    font-family: "Mundial-Italic";
    src: url("fonts/Mundial-Italic.otf") format("opentype");
}

@font-face {
    font-family: "Mundial-Light";
    src: url("fonts/Mundial-Light.otf") format("opentype");
}

@font-face {
    font-family: "Mundial-Light-Italic";
    src: url("fonts/Mundial-LightItalic.otf") format("opentype");
}

@font-face {
    font-family: "Mundial-Thin";
    src: url("fonts/Mundial-Thin.otf") format("opentype");
}

@font-face {
    font-family: "Mundial-Thin-Italic";
    src: url("fonts/Mundial-ThinItalic.otf") format("opentype");
}

@font-face {
    font-family: "Mundial-Hair";
    src: url("fonts/Mundial-Hair.otf") format("opentype");
}

@font-face {
    font-family: "Mundial-Hair-Italic";
    src: url("fonts/Mundial-HairItalic.otf") format("opentype");
}

.handwrite {
    font-family: "Mundial-Hair-Italic";
}

.pin-input input {
    text-align: center !important;
}

.mud-icon-root.mud-svg-icon {
    fill: currentColor
}

.ti-logo-home {
    width: 100%;
    height: 100%;
    max-width: 492px; 
    max-height: 128px;
}

.ti-logo-verify-result {
    width: 248px;
    height: 64px;
    margin-left: 0.5rem;
    margin-right: 0.5rem;
    margin-top: 0.5rem;
}

.ti-full-navbar {
    width: 96px;
    height: calc(96px * (128px / 492px));
}

.header-bar-background-dark {
    backdrop-filter: blur(10px);
    background-color: rgba(0, 0, 0, 0.5);
}

.header-bar-background-light {
    backdrop-filter: blur(10px);
    background-color: rgba(128, 128, 128, 0.5);
}

.mud-overlay-content {
    object-fit: fill;
    width: -webkit-fill-available;
    height: -webkit-fill-available;
    width: 100%;
    height: 100%;
}

.mud-button-label {
    margin-top: 0.2rem;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

h2 {
    padding: 0.5rem;
}

.mud-primary-text {
    color: var(--mud-palette-text-primary) !important;
}

.mud-secondary-text {
    color: var(--mud-palette-text-secondary) !important;
}

.mud-dialog-actions .mud-message-box__yes-button {
    color: var(--mud-palette-text-primary) !important;
    font-family: "Mundial-Regular";
}