/*
Theme Name: Velour
Theme URI: https://schedopia.com/themes/velour
Author: ThinkMatic
Author URI: https://schedopia.com
Description: Velour is an elegant block theme for hair salons, barbers and beauty studios. It ships with every page a salon needs — home, services, price list, team, gallery, about, FAQ, contact and online booking — and works hand in hand with the free Schedopia booking plugin, so clients can pick a service, choose their stylist and book a time right on your site. One click installs Schedopia and sets up your services, stylists, opening hours and pages, so your salon is ready to take bookings in minutes.
Requires at least: 6.5
Tested up to: 7.1
Requires PHP: 7.4
Version: 1.1.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: velour
Tags: block-patterns, block-styles, custom-colors, custom-logo, custom-menu, editor-style, featured-images, full-site-editing, full-width-template, one-column, style-variations, template-editing, threaded-comments, translation-ready, wide-blocks, blog, portfolio
*/

/*
 * Almost all styling lives in theme.json. This file only holds what
 * theme.json cannot express: block style variations and small refinements.
 */

/* ---------- Accessibility ---------- */

.screen-reader-text:focus {
	clip: auto !important;
	clip-path: none;
	height: auto;
	width: auto;
}

:where(a, button, input, select, textarea, summary):focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 3px;
}

/* ---------- Eyebrow text ---------- */

.is-style-eyebrow,
.velour-eyebrow {
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--wp--preset--color--accent);
}

.has-contrast-background-color .is-style-eyebrow,
.has-contrast-background-color .velour-eyebrow,
.has-contrast-background-color .velour-stars,
.wp-block-cover .is-style-eyebrow {
	color: var(--wp--preset--color--accent-3);
}

/* ---------- Buttons ---------- */

.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent;
	border: 1px solid currentColor;
	color: inherit;
}

.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: var(--wp--preset--color--contrast);
	border-color: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--base);
}

.has-contrast-background-color .wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: var(--wp--preset--color--base);
	border-color: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
}

.wp-block-button.is-style-text-link > .wp-block-button__link {
	background: transparent;
	border-radius: 0;
	color: inherit;
	padding: 0 0 0.35em;
	border: 0;
	border-bottom: 1px solid var(--wp--preset--color--accent);
}

.wp-block-button.is-style-text-link > .wp-block-button__link:hover {
	background: transparent;
	color: var(--wp--preset--color--accent);
}

.has-heading-font-family .velour-stars {
	font-size: 0.55em;
	vertical-align: middle;
}

/* ---------- Images ---------- */

.wp-block-image.is-style-arched img,
.wp-block-cover.is-style-arched,
.wp-block-post-featured-image.is-style-arched img {
	border-radius: 999px 999px 0 0;
}

.wp-block-image.is-style-framed {
	position: relative;
}

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

.wp-block-image.is-style-framed::before {
	content: "";
	position: absolute;
	inset: 1.25rem -1.25rem -1.25rem 1.25rem;
	border: 1px solid var(--wp--preset--color--accent);
	z-index: 0;
	pointer-events: none;
}

/* ---------- Groups ---------- */

.wp-block-group.is-style-card {
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--line);
	padding: var(--wp--preset--spacing--40);
}

.wp-block-group.is-style-bordered {
	border-top: 1px solid var(--wp--preset--color--line);
	border-bottom: 1px solid var(--wp--preset--color--line);
}

/* ---------- Separators ---------- */

.wp-block-separator.is-style-short-gold {
	width: 3.5rem;
	border: 0;
	border-top: 1px solid var(--wp--preset--color--accent);
	margin-left: 0;
	opacity: 1;
}

.has-text-align-center .wp-block-separator.is-style-short-gold,
.wp-block-separator.is-style-short-gold.aligncenter {
	margin-left: auto;
	margin-right: auto;
}

/* ---------- Lists ---------- */

.wp-block-list.is-style-checks {
	list-style: none;
	padding-left: 0;
}

.wp-block-list.is-style-checks li {
	position: relative;
	padding-left: 1.75em;
	margin-bottom: 0.6em;
}

.wp-block-list.is-style-checks li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.55em;
	width: 0.9em;
	height: 0.45em;
	border-left: 1.5px solid var(--wp--preset--color--accent);
	border-bottom: 1.5px solid var(--wp--preset--color--accent);
	transform: rotate(-45deg);
}

/* ---------- Header ---------- */

.velour-header {
	border-bottom: 1px solid var(--wp--preset--color--line);
}

.velour-header .wp-block-navigation__responsive-container.is-menu-open {
	padding: var(--wp--preset--spacing--40);
}

.velour-header .wp-block-site-title a {
	text-decoration: none;
}

.velour-header .wp-block-site-title,
.velour-header .wp-block-button__link {
	white-space: nowrap;
}

/* Collapse the menu into the overlay below 1080px, not WordPress's default 600px. */
@media (max-width: 1079px) {
	.velour-header .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}

	.velour-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
	}
}

@media (max-width: 599px) {
	.velour-header .velour-header__cta {
		display: none;
	}
}

/* ---------- Opening hours table ---------- */

.velour-hours {
	margin: 0;
}

.velour-hours p {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	margin: 0;
	padding: 0.6em 0;
	border-bottom: 1px solid var(--wp--preset--color--line);
}

.has-contrast-background-color .velour-hours p {
	border-bottom-color: rgba(255, 255, 255, 0.14);
}

/* ---------- Testimonials ---------- */

.velour-quote .wp-block-quote {
	border: 0;
	padding: 0;
	margin: 0;
}

.velour-stars {
	color: var(--wp--preset--color--accent);
	letter-spacing: 0.2em;
}

/* ---------- FAQ (details) ---------- */

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

.wp-block-details summary {
	cursor: pointer;
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--large);
	list-style: none;
	position: relative;
	padding-right: 2rem;
}

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

.wp-block-details summary::after {
	content: "+";
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	font-family: var(--wp--preset--font-family--body);
	font-weight: 300;
	color: var(--wp--preset--color--accent);
}

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

.wp-block-details > :not(summary) {
	margin-top: 0.75em;
	color: var(--wp--preset--color--contrast-2);
}

/* ---------- Gallery ---------- */

.wp-block-gallery.is-style-velour-tight {
	gap: 0.5rem;
}

/* ---------- Stats ---------- */

.velour-stat .velour-stat__number {
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--xx-large);
	line-height: 1;
	color: var(--wp--preset--color--accent);
	margin: 0;
}

/* ---------- Booking placeholder (when Schedopia is not active) ---------- */

.velour-booking-placeholder {
	border: 1px dashed var(--wp--preset--color--accent);
	background: var(--wp--preset--color--base-2);
	padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40);
	text-align: center;
}

.velour-booking-placeholder__title {
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--x-large);
	margin: 0 0 0.4em;
}

.velour-booking-placeholder p {
	margin: 0.4em 0;
}

/* ---------- Motion ---------- */

@media (prefers-reduced-motion: no-preference) {
	.wp-block-button__link,
	.wp-block-navigation-item__content,
	.wp-block-image img {
		transition: all 0.25s ease;
	}
}

/* ---------- Service menu preview (before Schedopia is set up) ---------- */

.velour-preview-note {
	font-size: var(--wp--preset--font-size--x-small);
	color: var(--wp--preset--color--contrast-2);
	text-align: center;
	margin-bottom: var(--wp--preset--spacing--30);
}

.velour-services {
	list-style: none;
	margin: 0;
	padding: 0;
}

.velour-services--grid {
	display: grid;
	gap: var(--wp--preset--spacing--40);
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr));
}

@media (min-width: 960px) {
	.velour-services--grid {
		grid-template-columns: repeat(var(--velour-cols, 3), minmax(0, 1fr));
	}
}

.velour-card {
	display: flex;
	flex-direction: column;
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--line);
}

.velour-card img {
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	display: block;
}

.velour-card__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 0.5rem;
	padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--30) var(--wp--preset--spacing--30);
}

.velour-card__body p,
.velour-card__body h3 {
	margin: 0;
}

.velour-card__cat {
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--wp--preset--color--accent);
}

.velour-card__title {
	font-size: var(--wp--preset--font-size--x-large);
}

.velour-card__desc {
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--contrast-2);
	flex: 1;
}

.velour-card__foot {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1rem;
	padding-top: 0.75rem;
	margin-top: 0.5rem;
	border-top: 1px solid var(--wp--preset--color--line);
	font-size: var(--wp--preset--font-size--small);
}

.velour-card__book {
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	text-decoration: none;
	border-bottom: 1px solid var(--wp--preset--color--accent);
	padding-bottom: 0.2em;
}

.velour-menu__row {
	display: grid;
	grid-template-columns: 1fr auto auto;
	gap: 0.25rem 1.5rem;
	align-items: baseline;
	padding: 1rem 0;
	border-bottom: 1px solid var(--wp--preset--color--line);
}

.velour-menu__row p {
	margin: 0;
}

.velour-menu__title {
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--large);
}

.velour-menu__desc {
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--contrast-2);
}

.velour-menu__meta {
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--contrast-2);
	white-space: nowrap;
}

.velour-menu__price {
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--large);
	white-space: nowrap;
}

/* ---------- Muted text and dividers on any background ---------- */

.velour-muted {
	opacity: 0.78;
}

.velour-divider {
	border-top-style: solid;
	border-top-color: color-mix(in srgb, currentColor 16%, transparent);
}

/* ---------- Category tiles ---------- */

.velour-tiles .wp-block-heading a {
	text-decoration: none;
}

.velour-tiles .wp-block-image img {
	transition: transform 0.4s ease;
}

.velour-tiles .wp-block-image a:hover img {
	transform: scale(1.03);
}

/* Anchored sections clear the header. */
[id] {
	scroll-margin-top: 2rem;
}

/* Sections butt up against the header and footer; no gap between template parts. */
.wp-site-blocks > * + * {
	margin-block-start: 0;
}
