/* AJR TrackMate Plugin - Today Styles - @package ajr-trackmate/css */

/* ----------------------------------------------------------------------------------------- */
/* TODAY CONTAINER
/* ----------------------------------------------------------------------------------------- */
#trackmate_today {
    position: relative;
    z-index: 10; }

	/* overflow */
    #trackmate_today .overflow_wrapper {}
        #trackmate_today .overflow_container {
            display: -webkit-flex; display: flex; }

    /* filter */
	#trackmate_today .filter_container {
		display:flex; display:-webkit-flex;
		justify-content:center; -webkit-justify-content:center;
		align-items:center; -webkit-align-items:center; }
		#trackmate_today .filter_container .show_today {}
        #trackmate_today .filter_container .ajr-button {}
            #trackmate_today .filter_container .ajr-button + .ajr-button {
                margin-left: 0.5em; }
		#trackmate_today .filter_container .show_yesterday,
		#trackmate_today .filter_container .show_tomorrow {
			opacity:0.5; }
		#trackmate_today .filter_container .show_yesterday {}
		#trackmate_today .filter_container .show_tomorrow {}
			#trackmate_today .filter_container .show_yesterday:hover,
			#trackmate_today .filter_container .show_tomorrow:hover {
				opacity:1; }
			#trackmate_today .filter_container .show_yesterday i,
			#trackmate_today .filter_container .show_tomorrow i {
				--icon_margin:0.3rem;
				--icon_x:-3px;
				top:0; }
			#trackmate_today .filter_container .show_yesterday i {
				left:var(--icon_x);
				margin-right:var(--icon_margin); }
			#trackmate_today .filter_container .show_tomorrow i {
				right:var(--icon_x);
				margin-left:var(--icon_margin); }

	/* filter results */
	#trackmate_today .filter_results {
		position:relative;
		display:flex; display:-webkit-flex;
		justify-content:center; -webkit-justify-content:center;
		align-items:center; -webkit-align-items:center;
		min-height:1.5rem;
		margin:1.5rem auto;
		font-size:0.8em; }
		#trackmate_today .filter_results div {
			margin:0 0.5rem; }
			#trackmate_today .filter_results div small:nth-child(1) {
				padding:0 4px 0 0; }
			#trackmate_today .filter_results div small:nth-child(2) {
				padding:0 0 0 2px; }

	/* container */
	#trackmate_today .races_container {
		position:relative;
		max-width:1000px;
		min-height:320px;
		margin:auto;
		opacity:1;
		transition:opacity var(--transition); }
		#trackmate_today .races_container.loading {
			opacity:0;
			transition:opacity var(--transition); }

		/* loading */
		#trackmate_today .races_container .loading {
			position: absolute;
			left: calc(50% - 0.5em);
			top: calc(50% - 0.5em);
			color: rgb(var(--color_accent)); }

		/* empty */
		#trackmate_today .races_container .empty {
            font-size: 0.9em;
            font-weight: 300;
            text-align: center;
            color: rgb(var(--colour_grey_light)); }

        /* race */
		#trackmate_today .races_container .race_item {
			position: relative;
			margin-bottom: 0.5em;
			padding: 1em 1.25em;
			border: 1px solid #ddd;
			border-radius: 10px;
			background: var(--morph_bgd_concave);
			box-shadow: inset 0 0 0 1px rgb(255,255,255), 0 0 30px 0 rgba(0,0,0,0.1);
			overflow: hidden; }
			#trackmate_today .races_container .race_item .race_header {
				display:-webkit-flex; display:flex;
				-webkit-justify-content:space-between; justify-content:space-between;
				-webkit-flex-direction:row; flex-direction:row;
				-webkit-align-items:center; align-items:center; }
                #trackmate_today .races_container .race_item .race_header form {/*
                    display:-webkit-flex; display:flex;
                    -webkit-flex-wrap:wrap; flex-wrap:wrap;
                    margin-left: auto; */}
                    #trackmate_today .races_container .race_item .race_header .race_title {
                        margin:0; }
                    #trackmate_today .races_container .race_item .race_header .race_status {
                        position: absolute;
                        top: 16px;
                        right: -35px;
                        transform: rotate(45deg);
                        width: 120px;
                        padding: 5px 0 3px;
                        line-height: 1em;
                        text-align: center;
                        font-size: 0.6rem;
                        text-transform: uppercase;
                        background: rgb(var(--colour_grey_lighterererer));
                        box-shadow: 0px 5px 5px -4px rgba(0,0,0,0.5); }
                    #trackmate_today .races_container .race_item.has_status:not(.tomorrow) .race_header .race_status {
                        color: #fff;
                        text-shadow: 1px 1px 2px #000; }
                    #trackmate_today .races_container .race_item.has_status.has_result.pending .race_header .race_status {
                        background: rgb(var(--colour_success_lightererer)); }
                    #trackmate_today .races_container .race_item.has_status.has_result.provisional_result .race_header .race_status {
                        background: rgb(var(--colour_success_lighter)); }
                    #trackmate_today .races_container .race_item.has_status.has_result .race_header .race_status {
                        background: rgb(var(--colour_success)); }
                    #trackmate_today .races_container .race_item.has_status .race_header a.button {
                        margin-right: 1rem; }
                    #trackmate_today .races_container .race_item .race_desc {
                        margin-bottom:0.75rem; }
                    #trackmate_today .races_container .race_item .race_info {
                        display:flex; display:-webkit-flex;
                        flex-wrap:wrap; -webkit-flex-wrap:wrap;
                        justify-content:flex-start; -webkit-justify-content:flex-start; }
                        #trackmate_today .races_container .race_item .race_info div {
                            display:flex; display:-webkit-flex;
                            align-items:center; -webkit-align-items:center;
                            margin:0.25rem 0.75rem 0 0;
                            font-size:0.9em; }
                        #trackmate_today .races_container .race_item .race_info form {}
	
	/* info */
	#trackmate_today .info {
		margin-top:2rem; }

@media screen and (max-width:767px) {
	.filter_container {
		overflow-x:hidden; }
}


/* ----------------------------------------------------------------------------------------- */
/* NEXT RACE INFORMATION BAR
/* ----------------------------------------------------------------------------------------- */
.next_race_container {
	position:relative;
	z-index: 10;
    display: -webkit-flex; display: flex;
    -webkit-align-items: baseline; align-items: baseline;
    width: max-content;
    height: auto;
    margin:1rem auto 0;
	border-spacing:0.25rem;
	border-radius:var(--background_border_radius);
	border:var(--glass_background_border);
	background:var(--glass_background);
	box-shadow:0 0 10px 0 rgba(0,0,0,0.2); }
	.next_race_container:before {
		content:'';
		position:absolute;
		z-index:-1;
		top:0;
		right:0;
		bottom:0;
		left:0;
		border-radius:var(--background_border_radius);
		-webkit-backfrop-filter:blur(var(--glass_background_blur)); backdrop-filter:blur(var(--glass_background_blur)); }
	.next_race_container .next_race_header {
		min-width: 50px;
        padding: 0 2px 0 0.5rem;
        line-height: 0.7rem;
        font-size: 0.75rem;
        font-weight: 400;
        color: #000;
        text-shadow: 0 0 5px #fff;
        transform: translateY(1px); }
	.next_race_container .next_race_items_wrapper {}
        .next_race_container .next_race_items_container {
            display: -webkit-flex; display: flex;
            padding: 0.5rem; }
            .next_race_container .next_race_item {
                position:relative; }
                .next_race_container .next_race_item + .next_race_item {
                    margin-left: 0.25rem; }
                .next_race_container .next_race_item button {
                    box-shadow:1px 1px 2px 0 rgba(0,0,0,0.5); }
                    .next_race_container .next_race_item.i_1 button {}
                    .next_race_container .next_race_item.i_2 button {
                        opacity:0.6; }
                    .next_race_container .next_race_item.i_3 button {
                        opacity:0.5; }
                    .next_race_container .next_race_item.i_4 button {
                        opacity:0.4; }
                    .next_race_container .next_race_item button:hover {
                        opacity:1 !important; }

@media screen and (max-width:767px) {
	.next_race_container {
		display: block;
		padding: 0;
		overflow-x: hidden; }
		.next_race_container .next_race_header {
			display: block !important;
			padding: 6px 0 0 5px;
			line-height: 0.8rem;
			text-align: left;
			font-size: 0.9rem; }
			.next_race_container .next_race_header::after {
				content:':'; }
			.next_race_container .next_race_header .is_mobile_remove_br {
				display:inline-block;
				width:4px; }
		.next_race_container .next_race_items_wrapper {
			padding:0 5px 5px;
			overflow-x:auto; }
			.next_race_container .next_race_items_wrapper::-webkit-scrollbar {
				display:none; }
			.next_race_container .next_race_items_container {
				position:relative;
				left:0;
				width:max-content;
				transition: left 0.2s cubic-bezier(.2, .0, .5, 3); }
				.next_race_container .next_race_item {
					display: inline-block;
					width: auto; }
					.next_race_container .next_race_item button {
						width: 100% !important;
						padding: 10px 1em !important;
						font-size: 1em !important; }
}