/*
 * Summer Reports — styles for the public trail report shortcode.
 *
 * Copied from the kallyas-child theme's style.css, which is where these rules
 * lived while the shortcode was theme code. Only the selectors that shortcode
 * emits were brought across, so this is not a copy of the theme's element-box
 * system in general.
 *
 * The @media blocks matter and must stay wrapped. The first version of this
 * file was generated by a flat regex that dropped the wrappers and collapsed
 * duplicate selectors, so the mobile "float:none; width:100%" override
 * survived as an unconditional rule while the desktop "float:left; width:50%"
 * one was discarded — which rendered the two trail columns as one at every
 * screen width. Regenerate with scratchpad/extract-css.php, not by hand.
 *
 * Duplication of the theme's rules is deliberate. The theme still needs its
 * own copies for the winter/snow shortcodes sharing these class names, and the
 * plugin needs its own so the report renders without kallyas-child present.
 * The cost is that a change to the theme's version does not reach this file.
 *
 * Enqueued only on pages that actually run the shortcode (see
 * includes/shortcode-public-report.php), not site-wide.
 */

/* Sized by HEIGHT, not width.
 *
 * This was width:100%; max-width:60px; height:auto, which only looked right
 * while every status sprite shared one 80x35 canvas. The trimmed sprites in
 * assets/images/trail-report/ run 0.72 (hiker), 1.64 (bike) and 2.69
 * (hiker+bike) in aspect, so a fixed width would render the lone hiker at
 * roughly four times the visual weight of the combined icon. Equal heights
 * make them read as one set.
 *
 * 26px is what a 60px-wide untrimmed sprite used to occupy vertically
 * (60 x 35/80), so rows keep their existing height.
 */
.icon-trailreport-hikebike {
	height:26px;
	width:auto;
	max-width:100%;
	display:block;
	margin:0 auto;
}

/* Difficulty markers. Their 30x30 canvas already normalises a 14px circle
 * against a 30px double-diamond, so they only need a matching height. */
.table-trails tr td:nth-child(2) img {
	height:26px;
	width:auto;
	display:block;
	margin:0 auto;
}

/* table-layout:fixed is the important part. On the default (auto) each section
 * table sizes its own columns from its own content, so Elk Side, Timber Side
 * and Base Area all came out different widths. Fixed takes the percentages
 * below and nothing else, so every section table lines up -- and matches the
 * app's trail report, which uses the same four proportions. */
.table-trails {
	border:solid 0px red;
	width:100%;
	table-layout:fixed;
}

.table-trails tr th:nth-child(1),
.table-trails tr td:nth-child(1) { width:12%; }
.table-trails tr th:nth-child(2),
.table-trails tr td:nth-child(2) { width:16%; }
.table-trails tr th:nth-child(3),
.table-trails tr td:nth-child(3) { width:48%; }
.table-trails tr th:nth-child(4),
.table-trails tr td:nth-child(4) { width:24%; }

.table-trails tr th {
	height:60px;
}

.table-trails tr td {
	height:45px;
}

.table-trails th {
	background-color:#808080;
	color:#ffffff;
	padding-top:8px;
	padding-bottom:8px;
	font-family:Montserrat;
	font-size:13px;
}

.table-trails tr th:nth-child(1) {
	text-align:center;
	font-size:13px;
}

.table-trails tr th:nth-child(2) {
	padding-right:8px;
	font-size:9px;
}

.table-trails tr th:nth-child(3) {
	border:solid 0px blue;
}

.table-trails tr th:nth-child(4) {
	padding-left:8px;
	padding-right:8px;
	font-size:10px;
}

.table-trails td {
	padding-top:0px;
	padding-bottom:0px;
	font-size:13px;
	font-family:Montserrat;
	text-transform:uppercase;
}

.table-trails tr td:nth-child(1) {
	text-align:center;
}

.table-trails tr td:nth-child(2) {
	padding-right:8px;
	font-size:9px;
	text-align:center;
}

.table-trails tr td:nth-child(3) {
	border:solid 0px blue;
	text-align:left;
}

.table-trails tr td:nth-child(4) {
	font-size:11px;
}

.table-trails tr:nth-child(odd) {
	background-color:#ffffff;
}

.rcr-element-box {
	width:100%;
	margin-top:0px;
}

.rcr-element-box-padsides {
	padding-left:5px;
	padding-right:5px;
	margin-left:15px;
	margin-right:16px;
}

.rcr-element-box-title {
	font-weight:bold;
	width:100%;
	text-align:center;
	text-transform: uppercase;
	font-family:montserrat;
	font-weight:bold;
	padding:0;
	margin-top:0px;
	margin-right:0px;
	margin-bottom:10px;
	margin-left:0px;
}

.rcr-element-box-title-summertrailreport {
	font-weight:bold;
	font-size:60px !important;
	color:#006bb6;
	width:100%;
	text-align:center;
	text-transform: uppercase;
	font-family:montserrat;
	padding:0;
	margin-top:0px;
	margin-right:0px;
	margin-bottom:10px;
	margin-left:0px;
	display:inline;
}

.rcr-element-box-title-summertrailreport-title {
	font-size:30px !important;
	color:#000000;
	width:100%;
	text-align:center;
	text-transform: uppercase;
	font-family:montserrat;
	padding:0;
	margin-top:40px;
	margin-right:0px;
	margin-bottom:40px;
	margin-left:0px;
}

.rcr-element-box-fl50 {
	float:left;
	margin:0;
	padding:0;
	width:50%;
	text-align:center;
	border-right:solid 1px #b1b3b5;
}

.rcr-element-box-fl33 {
	float:left;
	margin:0;
	padding:0;
	width:33%;
	text-align:center;
	border-right:solid 1px #b1b3b5;
}

.rcr-element-box-fl66 {
	float:left;
	margin:0;
	padding:0;
	width:66%;
	text-align:center;
	border-right:solid 0px #b1b3b5;
}

.rcr-element-box-last {
	border-right:solid 0px #b1b3b5 !important;
}

@media (max-width: 990px) {
	.table-trails {
		margin-top:40px;
	}
	.rcr-element-box-fl50 {
		float:none;
		width:100%;
		border-right:solid 0px #b1b3b5;
		margin-top:40px;
	}
	.rcr-element-box-fl33 {
		float:none;
		width:100%;
		border-right:solid 0px #b1b3b5;
	}
	.rcr-element-box-fl66 {
		float:none;
		width:100%;
	}
	.rcr-element-box-title {
		padding-top:15px;
	}
	.rcr-element-box-title-summertrailreport {
		padding-top:15px;
	}
}

@media (max-width: 480px) {
	.rcr-element-box-fl50 {
		float:none;
		width:100%;
		border-right:solid 0px #b1b3b5;
	}
	.rcr-element-box-fl33 {
		float:none;
		width:100%;
		border-right:solid 0px #b1b3b5;
	}
	.rcr-element-box-title {
		padding-top:15px;
	}
	.rcr-element-box-title-summertrailreport {
		padding-top:15px;
	}
}