@charset "utf-8";

#stats-header {
	width: 100%;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.content-statsgolfer-width {
	max-width: 64rem;
}

.content-container-grid {
	display: grid;
	grid-template-columns: 1fr;
	grid-row-gap: 0rem;
	grid-template-areas:
	 "content-header"
	 "statsbar"
	 "area1"
	 "area2"
	 "area3";
}

.content-header__golfer {
	display: grid;
	grid-area: content-header;
	grid-template-areas:
		"logo main select";
	grid-template-columns: minmax(0, auto) 1fr 1fr;
	height: auto !important;
	line-height: normal !important;
	padding: .5rem !important;
	margin-bottom: 0 !important; /* default is .5rem set by formatting.css */
}

.content-header__logo {
	display: none;
}

.content-header-left {
	display: grid;
	grid-area: main;
	text-align: left;
	}
		.content-header__name {
			display: grid;
			align-content: center;
			font-size: 1.4rem;
			font-weight: 400;
			white-space: nowrap;
			}
		.content-header__rank {
			display: grid;
			align-content: center;
			font-size: 1rem;
			font-weight: 400;
			white-space: nowrap;
			}

.content-header-right {
	display: none;
}
		.content-header__teamnumber {
			display: none;
			display: grid;
			font-size: .75rem;
			font-weight: 300;
			white-space: nowrap;
			align-content: start;
			justify-content: right;
		}
		.content-header__selectbox {
			display: none;
		}

.content-statsbar{
	grid-area: statsbar;
	color: #FAF332; /* yellow */
	background-color: #12476d; /* navy blue */
	padding-top: 0.3rem;
    padding-bottom: 0.3rem;
	margin-bottom: 1rem;
	  }
		.content-statsbar__stats {
			display: grid;
	    grid-template-columns: repeat(2,min-content);
	    grid-column-gap: 2rem;
	    justify-content: center;
		  }
		.content-statsbar__stats--box {
			display: grid;
			/* grid-template-rows: 1fr 1fr; */
			grid-column-gap: 0.5rem;
			grid-template-areas:
				"label"
				"data";
			text-align: center;
			/* background-color: lightgray; */
		  }
				.content-statsbar__stats--box_matches{
					display: none;
					}
				.content-statsbar__stats--label {
					grid-area: label;
					font-size: .75rem;
					font-weight: 700;
					white-space: nowrap;
					/* border: 1px solid yellow; */
				  }
				.content-statsbar__stats--data {
					grid-area: data;
					font-size: .75rem;
					font-weight: 400;
					white-space: nowrap;
				  }

.area1 {
	display: grid;
	grid-area: area1;
	grid-template-columns: 1fr;
	grid-auto-rows: auto minmax(0, 1fr);
	grid-template-areas:
	 "weekly-scores"
	 "front9"
	 "back9";
}
		.weekly-scores {
			grid-area: weekly-scores;
			margin-bottom: 1rem;
		}
				.head_previous {
					display: none;
				}
				.data_previous-weeks {
					display: none;
				}
				.data_previous-scores {
					display: none;
				}
				.data_hdcp-label {
					display: none;
				}
		.front9 {
			grid-area: front9;
			display: none;
		}
		.back9 {
			grid-area: back9;
			display: none;
		}

.area2 {
	display: grid;
	grid-area: area2;
	grid-auto-rows: auto minmax(0, 1fr);
	grid-template-areas:
	"stat-box"
	"match-results";
}
	.stat-box {
		display: grid;
		grid-area: stat-box;
		grid-template-columns: 1fr 1fr;
		grid-template-areas:
			"box1 box1"
			"box2 box2"
			"box3 box4";
		background-color: #f6f7f9;
		border: 1px solid #7c7d7e;
		margin-bottom: 1rem;
	}

	.stat-box__label {
		color: #000;
		text-align: center;
		font-size: 0.75rem;
		font-weight: 700;
	}

	.stat-box__data {
		color: #366091;
		text-align: center;
		font-size: 1.5rem;
		font-weight: 700;
	}

			.stat-box1 {
				grid-area: box1;
				display: grid;
				grid-template-columns: .5fr 1fr 1fr .5fr;
				grid-template-rows: 3fr;
				grid-template-areas:
				"box1A box1A box1A box1A"
        		". box1B box1C ."
        		"teeboxLeft box1D box1E teeboxRight";
				padding: .5rem;
			}
			.stat-box2 {
				grid-area: box2;
				display: grid;
				grid-template-columns: 1fr 1fr;
				grid-template-rows: 1.2rem;
				grid-template-areas:
					"box2A box2C"
					"box2B box2D";
				padding: 1rem .5rem 1rem .5rem;
			}
			.stat-box3 {
				grid-area: box3;
				padding: 0.5rem;
			}
			.stat-box4 {
				grid-area: box4;
				padding: 0.5rem;
			}
			.stat-box5 {
				grid-area: box5;
			}

			.stat-box1A{
				grid-area: box1A;
				padding-bottom: .2rem;
				border-bottom: 1px solid #7c7d7e;
			}
			.stat-box1B{
				grid-area: box1B;
				border-right: 1px solid #7c7d7e;
			}
			.stat-box1C{
				grid-area: box1C;
			}
			.stat-box1D{
				grid-area: box1D;
				border-right: 1px solid #7c7d7e;
			}
			.stat-box1E{
				grid-area: box1E;
			}

			.stat-box2A{
				grid-area: box2A;
			}
			.stat-box2B{
				grid-area: box2B;
			}
			.stat-box2C{
				grid-area: box2C;
			}
			.stat-box2D{
				grid-area: box2D;
			}
			.teeboxL{
				grid-area: teeboxLeft;
				padding-top: .5rem;
				padding-bottom: .5rem;
			}
			.teeboxR{
				grid-area: teeboxRight;
				padding-top: .5rem;
				padding-bottom: .5rem;
			}
				.tee-marker{
					height: 15px;
					width: 15px;
					border-radius: 25%;
					display: inline-block;
				}


			.match-results {
				display: none;
				grid-area: match-results;
				/* background-color: orange; */
			}


.area3 {
	display: grid;
	grid-area: area3;
	grid-template-areas:
		"scoring-record"
		"matches-chart"
		"putts-chart";
}
		.scoring-record {
			grid-area: scoring-record;
			margin-bottom: 1rem;
			/* background-color: tan; */
		}
		.matches-chart {
			grid-area: matches-chart;
			margin-bottom: 1rem;
			/* background-color: tan; */
		}

		.putts-chart {
			grid-area: putts-chart;
			margin-bottom: 1rem;
			/* background-color: tan; */
		}

		/* SCORING RECORD TABLE */
		.column__view--Date {
			display: table-cell;
		}
		.column__view--RoundName {
			display: none;
		}
		.column__view--HdcpIndex {
			display: none;
		}
		.column__view--Hdcp {
			display: none;
		}
		.column__view--AdjScore {
			display: table-cell;
		}
		.column__view--Side {
			display: none;
		}
		.column__view--Tee {
			display: none;
		}
		.column__view--CrSlp {
			display: table-cell;
		}
		.column__view--Differential {
			display: table-cell;
		}

.scoring-record__row {
    background: #FFF;
    border-bottom: 1px solid #D7D7D7;
}
.scoring-record__row--LowDiff {
    background: #c0d9af!important;
    border-bottom: 1px solid rgba(0,102,0,.5)!important;
}



/* 400px */
@media (min-width: 25em) {

	.content-header__logo {
		grid-area: logo;
		display: grid;
		align-self: center; /* vertical center */
		width: min-content;
	}

	.content-header-left {
		margin-left: 0.8rem;
	}

	.content-header-select {
		grid-area: select;
		display: grid;
		grid-template-columns: auto;
		grid-template-rows: 1fr;
		text-align: right;
		/* background-color: lightblue; */
		}
			.content-header__teamnumber {
				display: none;
				display: grid;
				font-size: .75rem;
				font-weight: 300;
				white-space: nowrap;
				align-content: start;
				justify-content: right;
				}
			.content-header__selectbox {
				display: none;
				}

	.content-statsbar__stats {
    grid-template-columns: repeat(3,min-content);
    grid-column-gap: 3.5rem;
	}
			.content-statsbar__stats--box_matches{
				display: block;
				}

	/* SCORING RECORD TABLE */
	.column__view--HdcpIndex {
		display: table-cell;
	}
	.column__view--RoundName {
		display: table-cell;
	}
	.column__view--Side {
		display: table-cell;
	}
}

/* 446px */
@media (min-width: 27.875em) {
	.stat-box {
		grid-template-columns: 1fr 1fr;
		grid-template-rows: 1fr;
		grid-template-areas:
			"box1 box2";
		background-color: #f6f7f9;
		border: 1px solid #7c7d7e;
		padding: .5rem .5rem;
	}
			.stat-box2{
				padding: 2rem 0.5rem 2rem 0.5rem;
			}
			.stat-box3 {
				display: none;
			}
			.stat-box4 {
				display: none;
			}

	.match-results{
		display: block;
		margin-bottom: 1rem;
	}

	.content-header-stats {
		grid-template-columns: repeat(3,min-content);
		justify-content: start;
		grid-column-gap: 1.5rem;
	}

	.content-header-stats__box {
		grid-template-columns: 1fr 1fr;
		grid-template-rows: 1fr;
		grid-column-gap: .4rem;
		text-align: left;
	}

	.head_previous {
		display: table-cell;
	}

	.data_previous-weeks {
		display: table-cell;
	}

	.data_previous-scores {
		display: table-cell;
	}

	.data_hdcp-label {
		display: table-cell;
	}
}


/* 544px */
@media (min-width: 34em) {
	.content-header__teamnumber {
		align-content: start;
	}
	.content-header {
		font-size: .8rem !important; /* default is 1.5rem in formatting.css */
	}

	/* SCORING RECORD TABLE */
	.column__view--Hdcp {
		display: table-cell;
	}
	.column__view--Tee {
		display: table-cell;
	}
}


/* 570px */
@media (min-width: 35.625em) {
	/* .area1 {
		grid-row-gap: 1rem;
		grid-template-areas:
		 "weekly-scores"
		 "front9"
		 "back9";
  } */
			.front9 {
				display: block;
				margin-bottom: 1rem;
			}
			.back9 {
				display: block;
				margin-bottom: 1rem;
			}

	.stat-box {
		grid-template-columns: repeat(2,1fr);
		grid-row-gap: 0rem;
		grid-template-areas:
			"box1 box2"
			"box3 box4";
	}
		.stat-box3 {
			display: grid;
			padding: 2rem 0.5rem 2rem 0.5rem;
		}
		.stat-box4 {
			display: grid;
			padding: 2rem 0.5rem 2rem 0.5rem;
		}

		.content-statsbar__stats--box {
			display: grid;
			grid-template-areas:
				"label data";
			text-align: center;
			/* background-color: lightgray; */
		}
}

/* 800px */
@media (min-width: 50em) {
	/* .content-header-stats__box {
		grid-template-columns: 1fr 1fr;
	} */

	.content-header-right {
		display: grid;
		grid-template-columns: auto;
		grid-template-rows: auto 1fr;
	}

			.content-header__teamnumber {
				align-content: center;
			}

			.content-header__selectbox {
				display: grid;
				text-align: right;
				/* margin-top: .8rem; */
			}

			/*
			.area3 {
				grid-auto-columns: 1fr;
				grid-column-gap: .5rem;
				grid-template-areas:
					"matches-chart putts-chart";
			}
			*/

			.area3 {
				grid-auto-columns: 1fr;
				grid-column-gap: .5rem;
				/*
				grid-template-areas:
					"putts-chart";
					*/
			}

	#stats-indv_match-results-table {
		 font-size: .8rem;
	}
}

/* 960px */
@media (min-width: 60em) {
	.content-container-grid {
		grid-template-columns: 1fr 23.75rem;
		column-gap: 1rem;
		grid-template-areas:
		 "content-header content-header"
		 "statsbar statsbar"
		 "area1 area2"
		 "area3 area3";
		}
  	.area2 {
			grid-template-columns: 1fr;
			grid-column-gap: .3rem !important;
			grid-template-areas:
				"stat-box"
				"match-results";
		}
			.stat-box {
				grid-template-rows: 3fr;
				grid-template-areas:
					"box1 box1"
					"box2 box2"
					"box3 box4";
			}
	}

/*===============
* Responsive media queries for pairing results table
=================*/
/* Default State */
#stats-indv_match-results-table th,
#stats-indv_match-results-table td {
	padding-left: 1rem;
	padding-right: 1rem;
}

#stats-indv_scoring-record-table th,
#stats-indv_scoring-record-table td {
	padding-left: .5rem;
	padding-right: .5rem;
}

/* 570px */
@media (min-width: 35.625em) {
	#stats-indv_match-results-table th:first-child,
	#stats-indv_match-results-table td:first-child {
	padding-left: 3.5rem;
	}
	#stats-indv_match-results-table th:last-child,
	#stats-indv_match-results-table td:last-child {
	padding-right: 3.5rem;
	}

	#stats-indv_scoring-record-table th:first-child,
	#stats-indv_scoring-record-table td:first-child {
	padding-left: 2.0rem;
	}
	#stats-indv_scoring-record-table th:last-child,
	#stats-indv_scoring-record-table td:last-child {
	padding-right: 2.0rem;
	}
}

/* 800px */
@media (min-width: 50em) {
	#stats-indv_match-results-table th:first-child,
	#stats-indv_match-results-table td:first-child {
	padding-left: 9.0rem;
	}
	#stats-indv_match-results-table th:last-child,
	#stats-indv_match-results-table td:last-child {
	padding-right: 9.0rem;
	}

	#stats-indv_scoring-record-table th:first-child,
	#stats-indv_scoring-record-table td:first-child {
	padding-left: 10rem;
	}
	#stats-indv_scoring-record-table th:last-child,
	#stats-indv_scoring-record-table td:last-child {
	padding-right: 10rem;
	}
}

/* 960px */
@media (min-width: 60em) {
	#stats-indv_match-results-table th:first-child,
	#stats-indv_match-results-table td:first-child {
	padding-left: .3rem;
	}
	#stats-indv_match-results-table th:last-child,
	#stats-indv_match-results-table td:last-child {
	padding-right: .3rem;
	}

	#stats-indv_scoring-record-table th:first-child,
	#stats-indv_scoring-record-table td:first-child {
	padding-left: 12rem;
	}
	#stats-indv_scoring-record-table th:last-child,
	#stats-indv_scoring-record-table td:last-child {
	padding-right: 12rem;
	}
}