:root {
    --bg-primary: #030327;
    --bg-secondary: #051337;
    --text-primary: #FFFFFF;
    --accent-gradient: linear-gradient(to right, #DD5628 0%, #F9CF16 100%) 1;
    --desktop-width: 430px;
    --alert-bg-color-btn: #DD5628;
    --alert-bg-color-btn-border-color: fff;
}

@media screen and (min-width: 430px) {

    html {
        background-color: var(--bg-secondary);
    }

    html,
    #ox_page_menubar ul {
        margin: auto;
        max-width: var(--desktop-width);
    }

    #ox_page_menubar ul,
    .ox-notification legend,
    .ox-notification-body,
    .ox-modal-region,
    .ox-menu-sponsor {
        max-width: var(--desktop-width) !important;
    }

    .slick-slider {
        max-width: var(--desktop-width) !important;
    }

    .ox-tabs-region-items,
    .ox-sponsor-list,
    .ox-notifications-list,
    .ox-menu-list,
    .ox-modal-region,
    .js-apex-region {
        overflow-x: hidden;
        scrollbar-width: thin;
        scrollbar-color: var(--bg-secondary) transparent;
    }

    #ox_noti_details .ox-notifications-list {
        overflow-y: hidden !important;
    }
}

.t-PageBody--login {
    background-color: var(--bg-primary); 
}
   
.t-Login-container {
    padding: 0;
    background-color: var(--bg-primary);
    font-family: "Arial Narrow", Arial, sans-serif;
    color: var(--text-primary);
    text-align: center;
}

.t-Login-containerHeader {
    display: block !important;
    height: 17vh;
    margin: 0;
    background-image: url("https://static.kscope25.app/kscope/kscope25/img/kscope25_login.png");
    background-size: 160% auto;
    background-position: 50% 10%;
    border-image: var(--accent-gradient);
    border-bottom: 2px solid transparent;
}

.t-Login-containerBody {
    margin-block-end: unset;
    margin-block-start: unset;
}

.t-Login-region {
    background-color: transparent;
    backdrop-filter: none;
    border: transparent;
    box-shadow: none;
}

.t-Login-body .t-Form-itemWrapper input {
    text-align: center;
}

.ox-login-btn {
    background-color: transparent !important;
    border-image: var(--accent-gradient);
    border-width: 2px;
    border-style: solid;
}

.ox-regcode-btn {
    color: var(--text-primary) !important;
    text-decoration: underline;
}

.ox-login-heading {
    opacity: 0.7;
    font-weight: 600;
    display: block;
    font-size: large;
    margin-bottom: 8px;
}

.ox-login-paragraph {
    padding: 0px 1rem 32px 1rem;
    line-height: 1.4;
}

.ui-dialog.ui-dialog--notification {
    background-color: var(--ut-palette-warning);
    color: var(--ut-palette-warning-contrast);
}

.ui-dialog-buttonpane {
    border-top: none;
    background-color: transparent;
}


.ui-button--hot {
    background-color: var(--alert-bg-color-btn);
    border: 1px solid var(--alert-bg-color-btn-border-color);
}

span#APEX_SUCCESS_MESSAGE,
span#APEX_ERROR_MESSAGE {
    position: absolute;
    z-index: 999;
    width: 90%;
    max-width: 500px;
}

.t-Alert-icon {
    display: none!important;
}

.a-AlertMessage-body {
    font-size: 16px!important;
    font-family: "Arial Narrow", Arial, sans-serif;
    line-height: normal;
    text-align: center;
}

h2.t-Alert-title {
  font-weight: 300 !important;
  font-size: 16px !important;
  text-align: center;
}

.t-Alert--page .t-Button--closeAlert {
    border-radius: 0;
    background-color: var(--alert-bg-color-btn)!important;
    right: 0!important;
    top: 0!important;
    border: none;
    box-shadow: none !important;
}