@font-face {
    font-family: 'Roboto Condensed';
    src: url('/fonts/Roboto/static/Roboto_Condensed-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Roboto';
    src: url('/fonts/Roboto/static/Roboto-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

/* Optional: Ensure the body/html doesn't cause a double scrollbar */
html, body {
    height: 100%;
    overflow: hidden;
}
body {
    font-family: 'Roboto', sans-serif;
    margin-bottom: 50px;
}
h1, h2, h3, h4 {
    font-family: 'Roboto Condensed', sans-serif;
}


.top-left-logo {
    width: 100px !important;
    height: 60px !important;
}
@media (min-width: 768px) {
    html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.title-text {
    border-bottom: 2px solid #903be0
}

.btn-ultimate {
 background-color:rgb(121, 7, 228);
 color: #ffffff;
}
.btn-ultimate:hover {
    background-color: rgb(76, 4, 144);
    color:white;
}
.bg-ultimate{
    background-color: rgb(76, 4, 144);
}
.text-ultimate{
    color:rgb(121, 7, 228);
}
.border-ultimate{
    border-color:rgb(76, 4, 144);
}
.table-ultimate {
    background-color: rgb(121, 7, 228, 0.7);
    color:white;
}


.text-ultimate-light {
    color: #dac5ef !important;
}
.nav-link {
    color: #3a06d3 !important;
    font-weight: 300px;
}
.menu {
    color: #dac5ef !important;
}
.menu:hover {
    color: rgb(76, 4, 144) !important;
}
.dropdown-item:hover {
    color: rgb(76, 4, 144) !important;
}
button.btn-link {
    color: #dac5ef !important;
}
button.btn-link:hover {
    color: rgb(76, 4, 144) !important;
}
.navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='black' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
    color: #000000 !important;
    background-color: #dac5ef !important;
}
html, body {
    height: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden; /* prevent double scrollbars */
    font-size: 14px;
}
/*html {
    position: relative;
    min-height: 100%;
}*/

header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 1050; /* higher than default Bootstrap dropdowns */
}

.navbar {
    height: 80px; /* consistent nav height for calculations */
    background-color: #ffffff !important;
    color: #3a06d3 !important;
    font-size: 18px;
}

.navbar-collapse.show {
    position: fixed !important;
    top: 70px; /* height of your navbar */
    left: 0;
    width: 100%;
    background: white;
    z-index: 1050; /* higher than main */
    padding: 1rem;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

/* Keep content from hiding behind the fixed nav */
.scrollable-content {
    position: absolute;
    top: 80px; /* same height as navbar */
    left: 0;
    right: 0;
    bottom: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 1rem;
    box-sizing: border-box;
    background: #f8f9fa; /* optional backdrop */
}
main[role="main"] {
    padding-bottom: 80px; /* space above fixed footer */
}

footer {
    background-color: #ede7f6;
    text-align: center;
    padding: 0.5rem;
    font-size: 0.9rem;
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    z-index:1001 !important;
}

/* --- CSS for Dismissable Alert 'X' --- */

/* 1. Ensure the alert is positioned correctly for the absolute 'X' */
.alert {
    position: relative;
    padding-right: 40px; /* Reserve space for the 'X' so it doesn't overlap text */
    display: flex;
    align-items: center; /* Vertically centers alert content */
  
}

/* 2. Styling for the injected close button (prominent 'X' at the end) */
.injected-close-btn {
    position: absolute;
    top: 50%; /* Start halfway down */
    right: 15px; /* 15px from the right edge */
    transform: translateY(-50%); /* Move up by 50% of its height to perfectly center */

    color: inherit; /* Inherit the text color from the alert */
    font-size: 28px; /* Make it large and prominent */
    font-weight: bold;
    cursor: pointer;
    line-height: 1;
    padding: 5px; /* Increase the clickable area */
    opacity: 0.85;
}

.injected-close-btn:hover {
    opacity: 1; /* Slight fade on hover for feedback */
}

.shield-logo{
    width:350px; height:auto;
}