/*
Theme Name: Accilize
Theme URI: https://accilize.com
Author: Accilize
Description: A modern, elegant, light-themed WordPress block theme for accounting, analytics, and quality improvement professionals. Features a premium design with warm neutral tones, muted gold accents, strong typography hierarchy, and dashboard-inspired visuals.
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: accilize
Tags: block-theme, full-site-editing, wide-blocks, block-styles, custom-colors, custom-fonts, editor-style, one-column, two-columns, three-columns, blog, portfolio
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 8.0
*/

/* ============================================================
   FOUNDATIONS
   ============================================================ */

/* Antialiasing */
body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* Overflow control — required for sticky header */
:root,
body,
.wp-site-blocks {
	overflow: visible;
}

/* ============================================================
   STICKY HEADER
   ============================================================ */

.wp-site-blocks > header.wp-block-template-part {
	position: sticky;
	top: 0;
	z-index: 100;
	background-color: var(--wp--preset--color--background);
	border-bottom: 1px solid var(--wp--preset--color--surface);
	transition: box-shadow 0.3s ease;
}

.wp-site-blocks > header.wp-block-template-part:hover {
	box-shadow: 0 1px 8px rgba(28, 28, 30, 0.05);
}

/* ============================================================
   TYPOGRAPHY POLISH
   ============================================================ */

/* Heading kerning refinement */
h1, h2, h3,
.wp-block-post-title {
	text-wrap: balance;
}

/* Body text polish */
p, li, dd, dt, td, th, figcaption, blockquote {
	text-wrap: pretty;
}

/* Small-caps utility for labels / micro headings */
.has-small-caps {
	font-variant-caps: small-caps;
	letter-spacing: 0.06em;
}

/* Drop cap refinement */
.has-drop-cap:not(:focus)::first-letter {
	font-family: var(--wp--preset--font-family--heading);
	color: var(--wp--preset--color--muted-gold);
	font-weight: 700;
	margin-right: 0.08em;
}

/* ============================================================
   LINK STYLES
   ============================================================ */

/* Subtle underline treatment for content links */
.entry-content a:not(.wp-block-button__link):not(.wp-block-navigation-item__content),
.wp-block-post-content a:not(.wp-block-button__link) {
	text-decoration: underline;
	text-decoration-color: var(--wp--preset--color--muted-gold);
	text-underline-offset: 0.2em;
	text-decoration-thickness: 1px;
	transition: color 0.2s ease, text-decoration-color 0.2s ease;
}

.entry-content a:not(.wp-block-button__link):not(.wp-block-navigation-item__content):hover,
.wp-block-post-content a:not(.wp-block-button__link):hover {
	color: var(--wp--preset--color--text);
	text-decoration-color: var(--wp--preset--color--text);
}

/* Navigation link hover underline */
.wp-block-navigation a {
	position: relative;
	transition: color 0.25s ease;
}

.wp-block-navigation a::after {
	content: "";
	position: absolute;
	bottom: -2px;
	left: 0;
	right: 0;
	height: 1px;
	background-color: var(--wp--preset--color--muted-gold);
	transform: scaleX(0);
	transform-origin: center;
	transition: transform 0.3s ease;
}

.wp-block-navigation a:hover::after,
.wp-block-navigation a:focus::after,
.wp-block-navigation .current-menu-item > a::after {
	transform: scaleX(1);
}

/* ============================================================
   BUTTON VARIANTS
   ============================================================ */

/* Base button transition */
.wp-block-button__link {
	transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

/* Outline button */
.wp-block-button.is-style-outline .wp-block-button__link {
	background-color: transparent;
	border: 1px solid var(--wp--preset--color--muted-gold);
	color: var(--wp--preset--color--muted-gold);
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
	background-color: var(--wp--preset--color--muted-gold);
	color: var(--wp--preset--color--white);
	border-color: var(--wp--preset--color--muted-gold);
}

/* Slate blue button variant via custom class */
.wp-block-button.is-style-slate .wp-block-button__link {
	background-color: var(--wp--preset--color--slate-blue);
	color: var(--wp--preset--color--white);
	border-color: var(--wp--preset--color--slate-blue);
}

.wp-block-button.is-style-slate .wp-block-button__link:hover {
	background-color: var(--wp--preset--color--text);
	border-color: var(--wp--preset--color--text);
	color: var(--wp--preset--color--white);
}

/* Ghost / text-link button */
.wp-block-button.is-style-ghost .wp-block-button__link {
	background-color: transparent;
	color: var(--wp--preset--color--muted-gold);
	border: none;
	padding-left: 0;
	padding-right: 0;
	border-bottom: 1px solid var(--wp--preset--color--muted-gold);
	border-radius: 0;
}

.wp-block-button.is-style-ghost .wp-block-button__link:hover {
	color: var(--wp--preset--color--text);
	border-bottom-color: var(--wp--preset--color--text);
	background-color: transparent;
}

/* ============================================================
   CARD SYSTEM
   ============================================================ */

/* Rounded card with subtle shadow — apply via "card" class on wp:group */
.is-style-card,
.wp-block-group.is-style-card {
	background-color: var(--wp--preset--color--white);
	border-radius: 8px;
	box-shadow: 0 1px 3px rgba(28, 28, 30, 0.06), 0 4px 16px rgba(28, 28, 30, 0.03);
	overflow: hidden;
	transition: box-shadow 0.3s ease, transform 0.3s ease;
}

.is-style-card:hover,
.wp-block-group.is-style-card:hover {
	box-shadow: 0 2px 6px rgba(28, 28, 30, 0.08), 0 8px 24px rgba(28, 28, 30, 0.06);
	transform: translateY(-2px);
}

/* Surface card — parchment tone */
.is-style-card-surface,
.wp-block-group.is-style-card-surface {
	background-color: var(--wp--preset--color--surface);
	border-radius: 8px;
	overflow: hidden;
	transition: box-shadow 0.3s ease, transform 0.3s ease;
}

.is-style-card-surface:hover,
.wp-block-group.is-style-card-surface:hover {
	box-shadow: 0 2px 8px rgba(28, 28, 30, 0.06);
	transform: translateY(-2px);
}

/* Metric / KPI card */
.is-style-metric-card {
	text-align: left;
}

.is-style-metric-card .wp-block-heading:first-child {
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--xx-large);
	color: var(--wp--preset--color--text);
	line-height: 1;
	letter-spacing: -0.02em;
	margin-bottom: var(--wp--preset--spacing--10);
}

.is-style-metric-card hr,
.is-style-metric-card .wp-block-separator {
	border-top: 1px solid var(--wp--preset--color--surface);
	margin-block: var(--wp--preset--spacing--20);
	opacity: 1;
}

/* ============================================================
   IMAGES
   ============================================================ */

/* Subtle desaturation + contrast for editorial feel */
.wp-block-image img,
.wp-block-cover__image-background,
.wp-block-post-featured-image img {
	filter: grayscale(10%) contrast(1.03);
	transition: filter 0.4s ease;
}

.wp-block-image:hover img,
.wp-block-post-featured-image:hover img {
	filter: grayscale(0%) contrast(1.05);
}

/* Gold-bordered frame for featured images */
.is-style-framed {
	position: relative;
}

.is-style-framed::before {
	content: "";
	position: absolute;
	top: -8px;
	left: -8px;
	right: 8px;
	bottom: 8px;
	border: 1px solid var(--wp--preset--color--muted-gold);
	z-index: 0;
	pointer-events: none;
}

.is-style-framed img {
	position: relative;
	z-index: 1;
}

/* ============================================================
   SEPARATOR / DIVIDER
   ============================================================ */

.wp-block-separator {
	opacity: 1;
}

/* Gold thin rule — default from theme.json */
.wp-block-separator:not(.is-style-wide):not(.is-style-dots) {
	max-width: 480px;
}

.wp-block-separator.is-style-wide {
	max-width: 100%;
}

/* ============================================================
   COVER BLOCK POLISH
   ============================================================ */

.wp-block-cover {
	border-radius: 2px;
}

.wp-block-cover .wp-block-cover__inner-container {
	max-width: var(--wp--style--global--wide-size, 1280px);
}

/* ============================================================
   QUOTE / PULLQUOTE MICRO POLISH
   ============================================================ */

.wp-block-quote cite,
.wp-block-pullquote cite {
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--small);
	font-style: normal;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--wp--preset--color--muted-gold);
	display: block;
	margin-top: var(--wp--preset--spacing--20);
}

/* ============================================================
   TABLE BLOCK
   ============================================================ */

.wp-block-table table {
	border-collapse: collapse;
	width: 100%;
}

.wp-block-table th {
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--wp--preset--color--text);
	text-align: left;
	padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--30);
	border-bottom: 2px solid var(--wp--preset--color--muted-gold);
}

.wp-block-table td {
	color: var(--wp--preset--color--body);
	padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--30);
	border-bottom: 1px solid var(--wp--preset--color--surface);
}

.wp-block-table tbody tr:hover td {
	background-color: var(--wp--preset--color--gold-light);
}

/* ============================================================
   FAQ ACCORDION (details/summary pattern)
   ============================================================ */

details.wp-block-details {
	border-bottom: 1px solid var(--wp--preset--color--surface);
	padding-block: var(--wp--preset--spacing--30);
}

details.wp-block-details summary {
	font-family: var(--wp--preset--font-family--body);
	font-weight: 600;
	font-size: var(--wp--preset--font-size--medium);
	color: var(--wp--preset--color--text);
	cursor: pointer;
	list-style: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--20);
}

details.wp-block-details summary::-webkit-details-marker {
	display: none;
}

details.wp-block-details summary::after {
	content: "+";
	font-size: 1.25rem;
	color: var(--wp--preset--color--muted-gold);
	transition: transform 0.3s ease;
	flex-shrink: 0;
}

details.wp-block-details[open] summary::after {
	content: "−";
}

details.wp-block-details > *:not(summary) {
	color: var(--wp--preset--color--body);
	margin-top: var(--wp--preset--spacing--20);
}

/* ============================================================
   FORM STYLING (for search, newsletter, contact forms)
   ============================================================ */

.wp-block-search__input,
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
input[type="number"],
textarea,
select {
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--medium);
	color: var(--wp--preset--color--text);
	background-color: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--surface);
	border-radius: 2px;
	padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--30);
	transition: border-color 0.3s ease, box-shadow 0.3s ease;
	width: 100%;
}

.wp-block-search__input:focus,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="number"]:focus,
textarea:focus,
select:focus {
	outline: none;
	border-color: var(--wp--preset--color--muted-gold);
	box-shadow: 0 0 0 3px var(--wp--preset--color--gold-light);
}

::placeholder {
	color: var(--wp--preset--color--body);
	opacity: 0.5;
}

/* Search button match */
.wp-block-search__button {
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	background-color: var(--wp--preset--color--muted-gold);
	color: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--muted-gold);
	border-radius: 2px;
	padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--40);
	cursor: pointer;
	transition: background-color 0.3s ease, color 0.3s ease;
}

.wp-block-search__button:hover {
	background-color: var(--wp--preset--color--text);
	border-color: var(--wp--preset--color--text);
	color: var(--wp--preset--color--white);
}

/* ============================================================
   POST TEMPLATE / QUERY LOOP CARDS
   ============================================================ */

/* Card-like treatment for post template items */
.wp-block-post-template.is-layout-grid > li,
.wp-block-post-template.is-layout-flow > li {
	background-color: var(--wp--preset--color--white);
	border-radius: 8px;
	overflow: hidden;
	box-shadow: 0 1px 3px rgba(28, 28, 30, 0.06), 0 4px 16px rgba(28, 28, 30, 0.03);
	transition: box-shadow 0.3s ease, transform 0.3s ease;
}

.wp-block-post-template.is-layout-grid > li:hover,
.wp-block-post-template.is-layout-flow > li:hover {
	box-shadow: 0 2px 6px rgba(28, 28, 30, 0.08), 0 8px 24px rgba(28, 28, 30, 0.06);
	transform: translateY(-2px);
}

/* Featured image in grid cards — fill card width */
.wp-block-post-template .wp-block-post-featured-image {
	margin: 0;
}

.wp-block-post-template .wp-block-post-featured-image img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: 0;
}

/* ============================================================
   COLUMNS RESPONSIVE POLISH
   ============================================================ */

@media (max-width: 781px) {
	.wp-block-columns:not(.is-not-stacked-on-mobile) {
		gap: var(--wp--preset--spacing--40);
	}
}

/* ============================================================
   HERO SECTION MICRO-LABEL (italic kicker above headlines)
   ============================================================ */

.is-style-micro-label,
.wp-block-paragraph.is-style-micro-label {
	font-family: var(--wp--preset--font-family--heading);
	font-style: italic;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--muted-gold);
	letter-spacing: 0.03em;
	line-height: 1.4;
}

/* ============================================================
   VERTICAL LABEL UTILITY
   ============================================================ */

.is-style-vertical-label {
	writing-mode: vertical-rl;
	text-orientation: mixed;
	font-family: var(--wp--preset--font-family--body);
	font-size: 10px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--wp--preset--color--body);
	opacity: 0.35;
	white-space: nowrap;
}

/* ============================================================
   SECTION BACKGROUND VARIATIONS
   ============================================================ */

/* Gold wash background */
.is-style-gold-wash {
	background-color: var(--wp--preset--color--gold-light);
}

/* ============================================================
   PAGINATION
   ============================================================ */

.wp-block-query-pagination {
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--small);
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.wp-block-query-pagination a {
	color: var(--wp--preset--color--slate-blue);
	text-decoration: none;
	transition: color 0.2s ease;
}

.wp-block-query-pagination a:hover {
	color: var(--wp--preset--color--text);
}

.wp-block-query-pagination .page-numbers.current {
	color: var(--wp--preset--color--muted-gold);
	font-weight: 600;
}

/* ============================================================
   TAG / CATEGORY CHIPS
   ============================================================ */

.wp-block-post-terms a {
	text-decoration: none;
	transition: color 0.2s ease;
}

.wp-block-post-terms a:hover {
	color: var(--wp--preset--color--text);
}

/* Tag cloud refinement */
.wp-block-tag-cloud a {
	font-family: var(--wp--preset--font-family--body);
	text-decoration: none;
	color: var(--wp--preset--color--slate-blue);
	transition: color 0.2s ease;
}

.wp-block-tag-cloud a:hover {
	color: var(--wp--preset--color--muted-gold);
}

/* ============================================================
   SITE TITLE REFINEMENT
   ============================================================ */

.wp-block-site-title a {
	text-decoration: none;
	color: inherit;
}

.wp-block-site-title a:hover {
	color: var(--wp--preset--color--muted-gold);
}

/* ============================================================
   SCROLL-MARGIN FOR ANCHOR LINKS (sticky header offset)
   ============================================================ */

[id] {
	scroll-margin-top: 80px;
}

/* ============================================================
   SUBTLE ANIMATION UTILITIES
   ============================================================ */

@media (prefers-reduced-motion: no-preference) {
	.is-style-card,
	.wp-block-group.is-style-card,
	.is-style-card-surface,
	.wp-block-group.is-style-card-surface,
	.wp-block-post-template > li,
	.wp-block-button__link {
		will-change: transform;
	}
}

/* ============================================================
   FOOTER POLISH
   ============================================================ */

footer.wp-block-template-part {
	border-top: 1px solid var(--wp--preset--color--surface);
}

/* Footer link styles */
footer.wp-block-template-part a {
	text-decoration: none;
	transition: color 0.2s ease;
}

footer.wp-block-template-part a:hover {
	color: var(--wp--preset--color--muted-gold);
}

/* ============================================================
   PRINT STYLES
   ============================================================ */

@media print {
	.wp-site-blocks > header.wp-block-template-part,
	footer.wp-block-template-part,
	.wp-block-navigation,
	.wp-block-button {
		display: none !important;
	}

	body {
		background: #fff;
		color: #000;
		font-size: 12pt;
	}
}

/* ---------- Loop layout utilities ---------- */
/* These classes are wired to the wp:query blocks emitted by content/pages and
   templates. Do not rename. Tune colours and spacing to theme.json tokens. */

/* Horizontal scrollable rail */
.wp-block-query.is-style-loop-rail .wp-block-post-template {
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: thin;
	padding-bottom: var(--wp--preset--spacing--20);
}
.wp-block-query.is-style-loop-rail .wp-block-post-template > * {
	flex: 0 0 320px;
	scroll-snap-align: start;
}

/* Compact list with hairline row dividers */
.wp-block-query.is-style-loop-list .wp-block-post-template > * {
	border-bottom: 1px solid var(--wp--preset--color--surface);
	padding-block: var(--wp--preset--spacing--30);
}
.wp-block-query.is-style-loop-list .wp-block-post-template > *:last-child {
	border-bottom: 0;
}

/* Zigzag — flip the columns inside every even entry */
.wp-block-query.is-style-loop-zigzag .wp-block-post-template > *:nth-child(even) .wp-block-columns {
	flex-direction: row-reverse;
}

/* Timeline — vertical line with node markers per entry */
.wp-block-query.is-style-loop-timeline .wp-block-post-template {
	position: relative;
	padding-inline-start: 2.5rem;
}
.wp-block-query.is-style-loop-timeline .wp-block-post-template::before {
	content: "";
	position: absolute;
	inset-block: 0;
	inset-inline-start: 0.5rem;
	width: 2px;
	background: var(--wp--preset--color--muted-gold);
	opacity: 0.2;
}
.wp-block-query.is-style-loop-timeline .wp-block-post-template > * {
	position: relative;
}
.wp-block-query.is-style-loop-timeline .wp-block-post-template > *::before {
	content: "";
	position: absolute;
	inset-inline-start: -2.25rem;
	inset-block-start: 0.6rem;
	width: 1rem;
	height: 1rem;
	border: 2px solid var(--wp--preset--color--muted-gold);
	border-radius: 50%;
	background: var(--wp--preset--color--background);
}

/* Magazine — first child spans 2 columns of the grid */
.wp-block-query.is-style-loop-magazine .wp-block-post-template > *:first-child {
	grid-column: span 2;
}
@media (max-width: 600px) {
	.wp-block-query.is-style-loop-magazine .wp-block-post-template > *:first-child {
		grid-column: auto;
	}
}