/*
Theme Name: Heartwood
Description: A Twenty Sixteen child theme for ifstherapy.org.uk. Visual structure stays Twenty Sixteen's own — horizontal masthead, optional right sidebar — restyled with a grounded, warm-neutral palette and a serif/sans type pairing in the spirit of unfoldingself.co.uk, without copying its colours or font.
Author: Nick Churchill
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: heartwood
*/

/**
 * Table of Contents
 *
 * 1.0 - Custom properties (palette & type)
 * 2.0 - Base type — body moves to the sans, headings move to the serif
 * 3.0 - Links, buttons & form fields
 * 4.0 - Navigation
 * 5.0 - Header & branding
 * 6.0 - Content — titles, blockquotes, meta text
 * 7.0 - Comments
 * 8.0 - Widgets & sidebar
 * 9.0 - Footer
 * 10.0 - Borders, rules & misc
 */

/**
 * 1.0 - Custom properties
 */
:root {
	--font-serif: "Frank Ruhl Libre", Georgia, serif;
	--font-sans: "Public Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;

	--ink: #232b26;        /* near-black, warm charcoal-pine — replaces Twenty Sixteen's #1a1a1a */
	--moss: #45573f;       /* primary accent — replaces Twenty Sixteen's #007acc */
	--moss-deep: #313b2c;  /* pressed/darker moss, used sparingly */
	--walnut: #7a4a32;     /* one deliberate second accent, reserved for blockquotes */
	--stone: #6b655b;      /* secondary text — replaces #686868 */
	--hairline: #ddd7cb;   /* borders & rules — replaces #d1d1d1 */
	--paper: #fbf9f5;      /* the site's card background — replaces #fff */
	--paper-dim: #f2efe8;  /* inputs & recessed surfaces — replaces #f7f7f7 */
}

/**
 * 2.0 - Base type
 */
body,
button,
input,
select,
textarea {
	color: var(--ink);
	font-family: var(--font-sans);
}

.site-title,
.entry-title,
.page-title,
.comments-title,
.comment-reply-title,
.post-navigation .post-title,
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-summary h1,
.entry-summary h2,
.entry-summary h3,
.comment-content h1,
.comment-content h2,
.comment-content h3,
.textwidget h1,
.textwidget h2,
.textwidget h3,
.widecolumn h2 {
	font-family: var(--font-serif);
	font-weight: 700;
}

.site-title,
.entry-title {
	letter-spacing: -0.01em;
}

/* Elements that were explicitly set to Montserrat and should stay sans rather than
   silently falling back to "Helvetica Neue" once Montserrat is no longer loaded. */
.site .skip-link,
.logged-in .site .skip-link,
.main-navigation,
.post-navigation,
.post-navigation .meta-nav,
.pagination,
.image-navigation,
.comment-navigation,
.widget .widget-title,
.widget_recent_entries .post-date,
.widget_rss .rss-date,
.widget_rss cite,
.tagcloud a,
button,
input[type="button"],
input[type="reset"],
input[type="submit"],
.post-password-form label,
.entry-footer,
.sticky-post,
.page-links,
.comment-metadata,
.pingback .edit-link,
.comment-reply-link,
.comment-form label,
.no-comments,
.widecolumn label,
.widecolumn .mu_register label,
.site-footer .site-title:after,
.site-footer span[role="separator"] {
	font-family: var(--font-sans);
}

::-webkit-input-placeholder { color: var(--stone); font-family: var(--font-sans); }
:-moz-placeholder { color: var(--stone); font-family: var(--font-sans); }
::-moz-placeholder { color: var(--stone); font-family: var(--font-sans); opacity: 1; }
:-ms-input-placeholder { color: var(--stone); font-family: var(--font-sans); }

.required,
.comment-form-cookies-consent label {
	font-family: var(--font-sans);
}

/**
 * 3.0 - Links, buttons & form fields
 */
a {
	color: var(--moss);
}

a:hover,
a:focus,
a:active {
	color: var(--stone);
}

mark,
ins {
	background: var(--moss);
	color: var(--paper);
}

button,
button[disabled]:hover,
button[disabled]:focus,
input[type="button"],
input[type="button"][disabled]:hover,
input[type="button"][disabled]:focus,
input[type="reset"],
input[type="reset"][disabled]:hover,
input[type="reset"][disabled]:focus,
input[type="submit"],
input[type="submit"][disabled]:hover,
input[type="submit"][disabled]:focus {
	background: var(--ink);
	color: var(--paper);
}

button:hover,
button:focus,
input[type="button"]:hover,
input[type="button"]:focus,
input[type="reset"]:hover,
input[type="reset"]:focus,
input[type="submit"]:hover,
input[type="submit"]:focus {
	background: var(--moss);
}

input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="week"],
input[type="month"],
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="number"],
textarea {
	background: var(--paper-dim);
	border-color: var(--hairline);
	color: var(--stone);
}

input[type="date"]:focus,
input[type="time"]:focus,
input[type="datetime-local"]:focus,
input[type="week"]:focus,
input[type="month"]:focus,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="number"]:focus,
textarea:focus {
	background-color: var(--paper);
	border-color: var(--moss);
	color: var(--ink);
}

/**
 * 4.0 - Navigation
 */
.main-navigation a {
	color: var(--ink);
}

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

.main-navigation li {
	border-top-color: var(--hairline);
}

.main-navigation .primary-menu,
.main-navigation ul ul {
	border-bottom-color: var(--hairline);
}

.main-navigation ul ul li {
	background-color: var(--paper);
	border-color: var(--hairline);
}

.main-navigation ul ul:before {
	border-color: var(--hairline) transparent;
}

.main-navigation ul ul:after {
	border-color: var(--paper) transparent;
}

.dropdown-toggle {
	color: var(--ink);
	border-color: var(--hairline);
}

.dropdown-toggle:after {
	border-color: var(--hairline);
}

.dropdown-toggle:hover,
.dropdown-toggle:focus {
	color: var(--moss);
}

.social-navigation a {
	border-color: var(--hairline);
	color: var(--ink);
}

.social-navigation a:hover:before,
.social-navigation a:focus:before {
	color: var(--moss);
}

.post-navigation,
.post-navigation div + div {
	border-color: var(--ink);
}

.post-navigation a {
	color: var(--ink);
}

.post-navigation .meta-nav {
	color: var(--stone);
}

.post-navigation a:hover .post-title,
.post-navigation a:focus .post-title {
	color: var(--moss);
}

.pagination {
	border-top-color: var(--ink);
}

.pagination:before,
.pagination:after,
.pagination .prev,
.pagination .next {
	background-color: var(--ink);
	color: var(--paper);
}

.pagination a:hover,
.pagination a:focus {
	color: var(--ink);
}

.pagination .prev:hover,
.pagination .prev:focus,
.pagination .next:hover,
.pagination .next:focus {
	background-color: var(--moss);
	color: var(--paper);
}

.image-navigation,
.comment-navigation {
	border-color: var(--hairline);
	color: var(--stone);
}

.site .skip-link {
	background-color: var(--paper-dim);
	color: var(--moss-deep);
	box-shadow: 0 0 1px 1px rgba(35, 43, 38, 0.2);
}

/**
 * 5.0 - Header & branding
 */
body {
	background: var(--ink);
}

.site {
	background-color: var(--paper);
}

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

.site-branding .site-title a:hover,
.site-branding .site-title a:focus {
	color: var(--moss);
}

.site-description {
	color: var(--stone);
}

.menu-toggle {
	border-color: var(--hairline);
	color: var(--ink);
}

.menu-toggle:hover,
.menu-toggle:focus {
	border-color: var(--moss);
	color: var(--moss);
}

.menu-toggle.toggled-on,
.menu-toggle.toggled-on:hover,
.menu-toggle.toggled-on:focus {
	background-color: var(--ink);
	border-color: var(--ink);
	color: var(--paper);
}

/**
 * 6.0 - Content: titles, blockquotes, meta text
 */
.entry-title a {
	color: var(--ink);
}

.entry-title a:hover,
.entry-title a:focus {
	color: var(--moss);
}

.entry-content,
.entry-summary {
	border-color: var(--hairline);
}

body:not(.search-results) .entry-summary {
	color: var(--stone);
}

/* The one deliberate second accent in this theme: pull-quotes get walnut, not moss. */
blockquote {
	border-color: var(--walnut);
	color: var(--stone);
}

blockquote cite,
blockquote small {
	color: var(--ink);
}

.entry-footer,
.entry-footer a {
	color: var(--stone);
}

.entry-footer a:hover,
.entry-footer a:focus {
	color: var(--moss);
}

.sticky-post,
.taxonomy-description,
.entry-caption,
.author-bio,
.wp-caption .wp-caption-text,
.gallery-caption {
	color: var(--stone);
}

.page-header {
	border-top-color: var(--ink);
}

.page-title {
	color: var(--ink);
}

.page-links a,
.page-links > span {
	border-color: var(--hairline);
}

.page-links a {
	background-color: var(--ink);
	border-color: var(--ink);
	color: var(--paper);
}

.page-links a:hover,
.page-links a:focus {
	background-color: var(--moss);
	border-color: transparent;
}

.page-links > .page-links-title {
	color: var(--ink);
}

/**
 * 7.0 - Comments
 */
.comments-title,
.comment-reply-title {
	border-top-color: var(--ink);
}

.comment-list article,
.comment-list .pingback,
.comment-list .trackback {
	border-top-color: var(--hairline);
}

.comment-author {
	color: var(--ink);
}

.comment-metadata,
.pingback .edit-link,
.comment-notes,
.comment-awaiting-moderation,
.logged-in-as,
.form-allowed-tags {
	color: var(--stone);
}

.comment-metadata a,
.pingback .comment-edit-link {
	color: var(--stone);
}

.comment-metadata a:hover,
.comment-metadata a:focus,
.pingback .comment-edit-link:hover,
.pingback .comment-edit-link:focus {
	color: var(--moss);
}

.comment-reply-link {
	border-color: var(--hairline);
	color: var(--moss);
}

.comment-reply-link:hover,
.comment-reply-link:focus {
	border-color: currentColor;
	color: var(--moss-deep);
}

.comment-reply-title small a:hover,
.comment-reply-title small a:focus {
	color: var(--ink);
}

.required {
	color: var(--moss);
}

.no-comments {
	border-top-color: var(--hairline);
}

.post-password-form label,
.comment-form label,
.widecolumn label,
.widecolumn .mu_register label {
	color: var(--stone);
}

/**
 * 8.0 - Widgets & sidebar
 */
.widget {
	border-top-color: var(--ink);
}

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

.widget_calendar tbody a {
	background-color: var(--moss);
	color: var(--paper);
}

.widget_calendar tbody a:hover,
.widget_calendar tbody a:focus {
	background-color: var(--stone);
	color: var(--paper);
}

.widget_recent_entries .post-date,
.widget_rss .rss-date,
.widget_rss cite {
	color: var(--stone);
}

.tagcloud a {
	border-color: var(--hairline);
}

.tagcloud a:hover,
.tagcloud a:focus {
	border-color: var(--moss);
	color: var(--moss);
}

/**
 * 9.0 - Footer
 */
.site-info,
.site-info a {
	color: var(--stone);
}

.site-info a:hover,
.site-info a:focus {
	color: var(--moss);
}

/**
 * 10.0 - Borders, rules & misc
 */
fieldset,
table,
th,
td,
pre,
abbr,
acronym,
.author-info,
.widecolumn .mu_register .mu_alert {
	border-color: var(--hairline);
}

hr {
	background-color: var(--hairline);
}

code {
	background-color: var(--paper-dim);
}
