/*
Theme Name: Westchase
Theme URI: https://westchaseproducts.com/
Author: Westchase Products Company, LLC
Author URI: https://westchaseproducts.com/
Description: The site theme of Westchase Products: a neutral company look, with each app section in its own color. Source Sans 3, with the wordmark in EB Garamond Bold (as on Westchase Signs), served from the site itself. No tracking, no third-party requests.
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.1
Version: 1.2.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: westchase
*/

/*
 * theme/westchase/style.css
 *
 * Almost everything is in theme.json. This file holds only what theme.json
 * cannot say: the app accent, which changes with the section of the site a
 * page is in (functions.php adds the body class), and a few details.
 */

/* The accent: Ink at company level; an app's own color inside its section. */
body {
	--westchase-accent: var(--wp--preset--color--ink);
	--westchase-accent-soft: var(--wp--preset--color--gray-50);
	--westchase-on-accent: var(--wp--preset--color--white);
}

body.app-kulmen {
	--westchase-accent: var(--wp--preset--color--kulmen);
	--westchase-accent-soft: var(--wp--preset--color--kulmen-soft);
}

/* Links in the page take the accent; the header and footer stay neutral. */
main a:where(:not(.wp-element-button)) {
	color: var(--westchase-accent);
}

/* Buttons take the accent: filled, or outlined for the second choice. */
main .wp-block-button:not(.is-style-outline) .wp-block-button__link {
	background-color: var(--westchase-accent);
	color: var(--westchase-on-accent);
}

main .wp-block-button.is-style-outline .wp-block-button__link {
	background-color: transparent;
	color: var(--westchase-accent);
	border: 2px solid currentColor;
}

/* Long words and addresses (a URL in a policy) wrap rather than widen the
   page on a phone. */
main {
	overflow-wrap: anywhere;
}

/* The heading band of an app page (patterns/app-header.php). */
.westchase-app-band {
	background-color: var(--westchase-accent-soft);
	border-bottom: 1px solid var(--wp--preset--color--gray-200);
}

/* An app card: the whole card is one link target. */
.westchase-app-card {
	position: relative;
	border: 1px solid var(--wp--preset--color--gray-200);
	border-radius: 16px;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.westchase-app-card:hover,
.westchase-app-card:focus-within {
	border-color: var(--wp--preset--color--gray-500);
	box-shadow: 0 2px 10px rgb(14 42 45 / 0.08);
}

.westchase-app-card .wp-block-heading a::after {
	content: "";
	position: absolute;
	inset: 0;
}

.westchase-app-icon img {
	border-radius: 22%;
}

/* Legal pages: the date line under the title. */
.westchase-meta {
	color: var(--wp--preset--color--gray-700);
}

/* Keyboard focus is always visible. */
:where(a, button, input, select, textarea, summary):focus-visible {
	outline: 2px solid var(--westchase-accent);
	outline-offset: 2px;
}

/* Contents lists on long pages (the help page) read better unbulleted. */
.westchase-contents {
	list-style: none;
	padding-left: 0;
}

/* The gold W beside the company name (header). Smaller on phones. */
.westchase-w img { display: block; height: auto; }
@media (max-width: 600px) {
	.westchase-w img { width: 48px !important; }
}

/* Keep the app icon square when the card is narrow (phones). */
.westchase-app-card .westchase-app-icon { flex: 0 0 auto; }