@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap');

/**
Copyright 2025
**/

:root {
    --primary-bg: #161C77;
    --navigation: #FF9E0E;
    --text-light: #FFFFFF;
    --text-dark: #333333;
    --card-bg: #F5F5F5;
}

html, body, main {
    height: 100%;
}

body {
    color: #333333;
    font-family: "Outfit", sans-serif;
    font-optical-sizing: auto;
    font-variation-settings: "slnt" 0;
    min-height: 100%;
    overflow-x: hidden;
	overscroll-behavior: contain;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    /* background: #f9f9f9; */
    letter-spacing: 0.0312rem;
    line-height: 1.6;
    font-size: 14px;
}

a {
    color: inherit;
}

a:hover {
    color: inherit;
    text-decoration: none;
}

a:focus, a:active {
    color: inherit;
    text-decoration: none;
}

a:focus:active, button:focus:active {
    /* color: #FFF !important; */
    /* background-color: #0047BA; */
    transform: scale(.95,.95);
    -webkit-transform: scale(.95,.95);
    -moz-transform: scale(.95,.95);
    -ms-transform: scale(.95,.95);
    -o-transform: scale(.95,.95);
}

select:active,
select:focus {
	outline: none;
}

::selection {
	color: #FFF;
	background-color: #0047BA;
}

::-moz-selection {
	color: #FFF;
	background-color: #0047BA;
}

::-webkit-selection {
	color: #FFF;
	background-color: #0047BA;
}

::-webkit-scrollbar {
    display: block;
	/* width: .3rem; */
    width: 0;
    height: .3rem;
	background: transparent !important;
}

::-webkit-scrollbar-track {
	-webkit-box-shadow: inset 0 0 6px rgba(248, 248, 248, 1);
	border-radius: .6rem;
    -webkit-border-radius: .6rem;
	-moz-border-radius: .6rem;
	-ms-border-radius: .6rem;
	-o-border-radius: .6rem;
	display: none;
	/* box-shadow: inset 0 0 1px rgba(0,0,0,.5) !important; */
	/* background-color: rgba(0,0,0,.5); */
}

::-webkit-scrollbar-thumb {
	border-radius: .6rem;
	background: #ccc;
	display: block;
    /* border-radius: 20px; */
    /* box-shadow: inset 0 0 6px unset; */
    /* background: rgba(0,0,0,.3); */
}

.form-check-input:checked {
    background-color: #ff6200 !important;
    border-color: #ff6200 !important;
}

.form-check-input:focus {
    border-color: #AF4708 !important;
    box-shadow: 0 0 0 .25rem rgba(175, 71, 8, .25) !important;
}

.navbar-nav .dropdown-menu {
    position: absolute;
}

header .nav-profile .dropdown-toggle::after {
    display: none;
}

canvas {
    width: 100%;
}

.toast-container  {
    z-index: 1366 !important;
}

.maintenance {
    filter: url("data:image/svg+xml;utf8,&lt;svg xmlns=\'http://www.w3.org/2000/svg\'&gt;&lt;filter id=\'grayscale\'&gt;&lt;feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/&gt;&lt;/filter&gt;&lt;/svg&gt;#grayscale");
    -webkit-filter: grayscale(100%);
}

.maintenance a {
    cursor: not-allowed;
}

.offcanvas.offcanvas-bottom {
    height: fit-content !important;
}

/* .showhide {
    display: inline-block;
    position: absolute;
    top: 1.6vh;
    right: 15px;
    z-index: 1;
} */

.btn-float-copy {
    position: absolute;
    top: 1.5vh;
    right: 5%;
    z-index: 1;
}

.air-datepicker-global-container {
    z-index: 1368 !important;
}

.carousel-indicators [data-bs-target] {
    background-color: #0047BA;
}

.carousel-item figure {
    margin: 0 !important;
}

.carousel-item img {
    width: 100%;
}

.action-group {
    background-color: transparent !important;
}

.active>.page-link, .page-link.active {
    color: #FFF !important;
    background-color: #ff6200 !important;
    border-color: #ff6200 !important;
}

/*
* Mobile Frame
*/

.portrait-container {
    width: 100%;
    max-width: 414px;
    margin: 0 auto;
    background-color: #000;
    min-height: 100vh;
    position: relative;
}

/*
* End Mobile Frame
*/

/*
* Color & Button
*/

.txt-default {
    color: #ff6200 !important;
}

.txt-default-shadow {
    color: #ff6200 !important;
    text-shadow: 0 0 .5rem #000;
}

.btn-default {
    color: #FFF;
    background-color: #ff6200;
}

.btn-default:hover, .btn-default:focus, .btn-default:active, .btn-default:active:focus {
    color: #FFF;
    background-color: #AF4708;
}

.bg-custom-grey {
    background-color: #1C1C1C;
}

/*
* End Color & Button
*/

.table>:not(caption)>*>* {
    color: #FFF !important;
    background-color: transparent !important;
    padding: 1.5rem 0 0 0 !important;
}

table.table.dataTable>:not(caption)>*>* {
    background-color: transparent !important;
}

#matchTable.table-bordered tr, #matchTable.table-bordered td,
#pastMatchTable.table-bordered tr, #pastMatchTable.table-bordered td {
    border-width: 0 !important;
    border-style: initial !important;
    border-color: #000 !important;
}

.section-title {
    text-align: center;
    margin-bottom: 2rem;
    /* color: var(--primary-bg); */
    position: relative;
    padding-bottom: 0.5rem;
}

.section-title:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 3px;
    background-color: var(--navigation);
}