/*
Theme Name: Red Rock MQG
Theme URI: https://redrockmqg.com/
Description: Twenty Sixteen child theme reproducing the look of Monaco 1.5.4, the
  theme redrockmqg.com ran from 2015 until the 2026 rebuild. Monaco itself was
  abandoned upstream in 2015 and calls eregi(), removed in PHP 7, so its own PHP
  is not carried forward — only its palette, proportions and typography are.
Author: Seth Shoultes
Template: twentysixteen
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: redrockmqg
*/

:root {
	--rr-accent: #ef918c; /* Monaco heading salmon */
	--rr-teal:   #429698; /* Monaco link / current-page teal */
	--rr-ink:    #4b4b4d; /* Monaco body text */
	--rr-muted:  #898989;
	--rr-rule:   #eee;
}

/* =Global
   Monaco set a plain 16px/1.5 sans-serif. Restating it here also makes Twenty
   Sixteen's Merriweather/Montserrat webfonts redundant, and functions.php
   dequeues them, so the site loads no third-party fonts at all.
----------------------------------------------------------------------------- */

body,
button,
input,
select,
textarea,
.entry-content,
.entry-summary,
.comment-content,
.widget {
	color: var(--rr-ink);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	font-size: 16px;
	line-height: 1.5;
}

body {
	background-color: #b5e0d9;
}

a {
	color: var(--rr-teal);
	text-decoration: none;
	box-shadow: none;
}

a:hover,
a:focus,
a:active {
	color: var(--rr-accent);
	text-decoration: none;
	box-shadow: none;
}

/* =Headings — Monaco set every level uppercase, bold, salmon
----------------------------------------------------------------------------- */

h1, h2, h3, h4, h5, h6,
.entry-title,
.widget-title,
.page-title {
	color: var(--rr-accent);
	font-weight: 700;
	text-transform: uppercase;
	clear: none;
	letter-spacing: 0;
}

h1, .entry-title { font-size: 28px; line-height: 1.3; }
h2 { font-size: 24px; }
h3 { font-size: 20px; }
h4 { font-size: 16px; }
h5 { font-size: 14px; }
h6 { font-size: 13px; }

.entry-title a {
	color: var(--rr-accent);
}

.entry-title a:hover {
	color: var(--rr-teal);
}

/* =Page frame — a white 1040px column on the teal background
----------------------------------------------------------------------------- */

.site {
	background-color: #fff;
	margin: 0 auto;
	max-width: 1080px;
	border: 0;
}

.site-inner {
	max-width: 1040px;
	padding: 0 20px;
}

/* =Header — centred logo, then centred uppercase nav, then a dark rule
----------------------------------------------------------------------------- */

.site-header {
	border-bottom: 2px solid var(--rr-ink);
	padding: 0;
}

.site-branding {
	float: none;
	width: auto;
	margin: 0;
	padding: 30px 0;
	text-align: center;
}

.site-branding .site-logo,
.custom-logo-link {
	display: inline-block;
	margin: 0;
}

/* Monaco showed the logo INSTEAD of the site title and tagline — its header.php
   branched on the logo being set. Twenty Sixteen shows all three, which reads as
   the name printed twice. Hidden visually rather than removed, so screen readers
   and search engines still get the site name the logo image carries. */
.wp-custom-logo .site-title,
.wp-custom-logo .site-description {
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
	height: 1px;
	width: 1px;
	overflow: hidden;
}

.custom-logo {
	max-width: 100%;
	height: auto;
}

.site-title {
	font-size: 40px;
	text-transform: none;
}

.site-title a {
	color: var(--rr-ink);
}

.site-title a:hover {
	color: var(--rr-accent);
}

.site-description {
	display: block;
	color: var(--rr-muted);
	font-size: 12px;
	font-style: italic;
	font-weight: 400;
	text-transform: none;
}

/* =Primary navigation
   Monaco centred the menu and marked hover/current with a 7px underline —
   salmon on hover, teal for the page you are on.
----------------------------------------------------------------------------- */

.main-navigation {
	float: none;
	margin: 0;
	text-align: center;
	font-size: 14px;
}

.main-navigation .primary-menu {
	display: inline-block;
	border: 0;
	margin: 0;
	padding: 0;
	vertical-align: top;
}

.main-navigation li {
	float: left;
	border: 0;
	position: relative;
}

.main-navigation .primary-menu > li {
	border-bottom: 7px solid transparent;
}

.main-navigation a {
	display: block;
	padding: 10px 20px 3px;
	color: var(--rr-ink);
	text-transform: uppercase;
	letter-spacing: 0;
}

.main-navigation .primary-menu > li:hover {
	border-bottom-color: var(--rr-accent);
}

.main-navigation li:hover > a,
.main-navigation li.focus > a {
	color: var(--rr-accent);
}

.main-navigation .primary-menu > .current-menu-item,
.main-navigation .primary-menu > .current_page_item,
.main-navigation .primary-menu > .current_page_ancestor {
	border-bottom-color: var(--rr-teal);
}

.main-navigation .current-menu-item > a,
.main-navigation .current_page_item > a {
	color: var(--rr-teal);
}

/* Submenus keep Monaco's white panel with a dark top rule. */
.main-navigation ul ul {
	background: #fff;
	border: 0;
	border-top: 2px solid var(--rr-ink);
	box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
	min-width: 180px;
	text-align: left;
}

.main-navigation ul ul li {
	border: 0;
	width: 100%;
}

/* =Content and sidebar — Monaco's 70/30 split with a hairline between
----------------------------------------------------------------------------- */

@media screen and (min-width: 61.5625em) {
	.content-area {
		width: 70%;
		padding-right: 2%;
		border-right: 1px solid var(--rr-rule);
	}

	.sidebar {
		width: 30%;
		padding-left: 2%;
	}

	/*
	 * Twenty Sixteen splits an entry into a narrow left meta column and a 71%
	 * content column. Monaco ran the content full width with the date beneath
	 * the title, and the guild's posts are picture-heavy, so the narrow column
	 * costs real width. The selector deliberately mirrors the parent's own
	 * `body:not(.search-results) article:not(.type-page) …` — anything shorter
	 * loses on specificity and silently does nothing.
	 */
	body:not(.search-results) article:not(.type-page) .entry-header,
	body:not(.search-results) article:not(.type-page) .entry-content,
	body:not(.search-results) article:not(.type-page) .entry-summary,
	body:not(.search-results) article:not(.type-page) .entry-footer {
		float: none;
		width: 100%;
		margin-left: 0;
		margin-right: 0;
	}
}

.site-content {
	padding: 20px 0 0;
}

.entry-header,
.entry-content,
.entry-summary,
.entry-footer,
.page-header,
.page-content,
.comments-area {
	margin-left: 0;
	margin-right: 0;
	width: 100%;
	max-width: none;
}

.hentry {
	margin: 0 0 40px;
	padding: 0;
}

.entry-meta,
.entry-footer {
	color: var(--rr-muted);
	font-size: 12px;
	text-transform: none;
	letter-spacing: 0;
}

.entry-meta a,
.entry-footer a {
	color: var(--rr-teal);
}

.entry-meta a:hover,
.entry-footer a:hover {
	color: var(--rr-accent);
	border-bottom: 1px dotted var(--rr-accent);
}

/* Monaco's byline was plain text — "by Shelly Shoultes" — with no picture.
   Twenty Sixteen puts a 49px Gravatar in front of it, which on a guild blog
   reads as one member's photo stamped on every post. Text stays, photo goes. */
.entry-footer .avatar,
.byline .avatar {
	display: none;
}

.entry-content img,
.entry-summary img {
	height: auto;
	max-width: 100%;
}

/* =Widgets
----------------------------------------------------------------------------- */

.widget {
	border: 0;
	margin: 0 0 1.5em;
	padding: 0;
}

.widget-title {
	border-bottom: 1px solid var(--rr-rule);
	font-size: 18px;
	margin-bottom: 10px;
}

.widget_search {
	background: var(--rr-rule);
	padding: 20px;
}

.widget_search .search-submit {
	display: none;
}

.widget .search-field {
	background: #fff;
	border: 1px solid #ccc;
	padding: 10px;
	width: 100%;
}

.widget ul {
	list-style: none;
	margin: 10px 0 0;
	padding: 0;
}

.widget ul li {
	border: 0;
	padding: 3px 0;
}

/* =Footer — Monaco's dark credit strip
----------------------------------------------------------------------------- */

/* Twenty Sixteen makes the footer a flex row, which shrinks the credit strip to
   the width of its text. Monaco's was a full-width dark band. */
.site-footer {
	border-top: 0;
	display: block;
	margin-top: 40px;
	padding: 0;
}

/* Twenty Sixteen repeats the primary menu in the footer. Monaco did not, and a
   four-item menu gains nothing from being shown twice on one screen. */
.site-footer .main-navigation {
	display: none;
}

.site-info {
	background-color: var(--rr-ink);
	color: #fff;
	font-size: 10px;
	margin: 0;
	padding: 10px 20px;
	text-align: right;
}

.site-info a,
.site-info .site-title a {
	color: #fff;
}

.site-info a:hover {
	color: #fff;
	text-decoration: underline;
}

/* =Small screens — stack, and let Twenty Sixteen's toggle handle the menu
----------------------------------------------------------------------------- */

@media screen and (max-width: 61.5624em) {
	.main-navigation li {
		float: none;
	}

	.main-navigation .primary-menu > li {
		border-bottom: 0;
	}

	.main-navigation .primary-menu {
		display: block;
		text-align: left;
	}
}
