/*
Theme Name: Clay & Finch
Theme URI: https://clayandfinch.com
Author: Clay & Finch
Description: Block theme for Clay & Finch - destination-illustrated apparel for the ones who come along. Ivory, Forest, Rust, Charcoal and Gold, set in Fraunces and Libre Franklin (self-hosted). Built for WooCommerce with WooPayments multi-currency.
Version: 0.1.0
Requires at least: 6.5
Tested up to: 7.1
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: clayandfinch
Tags: e-commerce, block-styles, full-site-editing, wide-blocks, custom-colors
*/

/* Design tokens live in theme.json. Only rules theme.json cannot express go here. */

.cf-eyebrow {
	font-family: var(--wp--preset--font-family--libre-franklin);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--rust-deep);
}

.cf-topbar a { text-decoration: none; }

/* Occasion / destination tiles */
.cf-tile {
	position: relative;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.cf-tile:hover,
.cf-tile:focus-within {
	transform: translateY(-3px);
	box-shadow: 0 10px 24px -14px rgba(43, 38, 32, 0.45);
}
.cf-tile a { text-decoration: none; }
.cf-tile a::after { content: ""; position: absolute; inset: 0; } /* whole tile is the link */
@media (prefers-reduced-motion: reduce) {
	.cf-tile { transition: none; }
	.cf-tile:hover, .cf-tile:focus-within { transform: none; }
}

/* Product grid */
.wc-block-product-template .wc-block-components-product-image,
.wp-block-woocommerce-product-image { background: var(--wp--preset--color--sand); border-radius: 2px; }
.wc-block-components-product-image img { border-radius: 2px; }

/* Currency switcher: keep it quiet and legible in the header */
.cf-currency select,
.wcpay-currency-switcher select {
	font: inherit;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	color: var(--wp--preset--color--charcoal);
	background: transparent;
	border: 1px solid var(--wp--preset--color--forest);
	border-radius: 2px;
	padding: 0.4rem 0.6rem;
}