/*
 * ACF Directory Theme — main stylesheet.
 * Enqueued by inc/enqueue.php. Add real styles here.
 * (style.css in the theme root is only for the theme header.)
 */

.site-content {
	max-width: 1200px;
	margin: 0 auto;
	padding: 1rem;
}

/* ---- Signup template ---- */
.signup__inner {
	max-width: 460px;
	margin: 3rem auto;
}
.signup__card {
	background: #fff;
	border: 1px solid #e2e5ea;
	border-radius: 8px;
	padding: 2rem;
}
.signup__title {
	margin: 0 0 1rem;
	font-size: 1.6rem;
}
.signup__field {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	margin-bottom: 1rem;
}
.signup__field label {
	font-weight: 600;
	font-size: 0.9rem;
}
.signup__field input {
	padding: 0.6rem 0.75rem;
	border: 1px solid #cbd2dd;
	border-radius: 6px;
	font-size: 1rem;
}
.signup__field input:focus-visible {
	outline: 2px solid #3b6ea5;
	outline-offset: 1px;
	border-color: #3b6ea5;
}
.signup__hint {
	font-size: 0.8rem;
	color: #5b6472;
}
.signup__error {
	color: #b3261e;
	font-size: 0.9rem;
	margin: 0 0 1rem;
}
.signup__notice {
	font-size: 0.9rem;
	padding: 0.6rem 0.8rem;
	border-radius: 6px;
	background: #eaf0f7;
	margin: 0 0 1rem;
}
.signup__notice--error {
	background: #fdecea;
	color: #922;
}
.signup__btn,
.signup__submit {
	display: inline-block;
	width: 100%;
	padding: 0.7rem 1rem;
	background: #3b6ea5;
	color: #fff;
	border: 0;
	border-radius: 6px;
	font-size: 1rem;
	font-weight: 600;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
}
.signup__submit[disabled] {
	opacity: 0.6;
	cursor: default;
}

/* Full-screen checkout-redirect overlay */
.signup__loading {
	position: fixed;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 1rem;
	background: rgba(255, 255, 255, 0.92);
	z-index: 9999;
}
.signup__spinner {
	width: 40px;
	height: 40px;
	border: 4px solid #e2e5ea;
	border-top-color: #3b6ea5;
	border-radius: 50%;
	animation: signup-spin 0.8s linear infinite;
}
@keyframes signup-spin {
	to { transform: rotate(360deg); }
}
@media (prefers-reduced-motion: reduce) {
	.signup__spinner { animation: none; }
}

/* ---- Add-listing form ---- */
.add-listing__inner {
	max-width: 720px;
	margin: 2.5rem auto;
}
.add-listing__title { margin: 0 0 0.25rem; }
.add-listing__note { color: #5b6472; margin: 0 0 1.5rem; font-size: 0.9rem; }
.add-listing__paid {
	background: #eaf7ee;
	border: 1px solid #bfe4cb;
	border-radius: 6px;
	padding: 0.75rem 1rem;
	margin-bottom: 1.5rem;
}
.add-listing__group {
	border: 1px solid #e2e5ea;
	border-radius: 8px;
	padding: 1.25rem 1.5rem;
	margin: 0 0 1.5rem;
}
.add-listing__group legend {
	font-weight: 700;
	padding: 0 0.5rem;
	font-size: 1.05rem;
}
.add-listing__field {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	margin-bottom: 1rem;
}
.add-listing__field label { font-weight: 600; font-size: 0.9rem; }
.add-listing__field input,
.add-listing__field textarea,
.add-listing__field select {
	padding: 0.55rem 0.7rem;
	border: 1px solid #cbd2dd;
	border-radius: 6px;
	font-size: 1rem;
	font-family: inherit;
}
.add-listing__field input:focus-visible,
.add-listing__field textarea:focus-visible,
.add-listing__field select:focus-visible,
.add-listing__service input:focus-visible {
	outline: 2px solid #3b6ea5;
	outline-offset: 1px;
	border-color: #3b6ea5;
}
.add-listing__row { display: grid; gap: 1rem; }
.add-listing__row--2 { grid-template-columns: 1fr 1fr; }
.add-listing__row--3 { grid-template-columns: 1fr 1fr 1fr; }
.is-invalid { border-color: #b3261e !important; }

.add-listing__checks { display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; }
.add-listing__check { font-weight: 400; display: inline-flex; gap: 0.35rem; align-items: center; }

/* Services repeater */
.add-listing__service {
	display: grid;
	grid-template-columns: 1fr 100px 140px 32px;
	gap: 0.5rem;
	align-items: center;
	margin-bottom: 0.5rem;
}
.add-listing__service input,
.add-listing__service select {
	padding: 0.5rem;
	border: 1px solid #cbd2dd;
	border-radius: 6px;
	font-size: 0.95rem;
}
.add-listing__service-remove {
	border: 0;
	background: #f0f2f5;
	border-radius: 6px;
	cursor: pointer;
	font-size: 1.2rem;
	line-height: 1;
	padding: 0.4rem;
}
.add-listing__add-service {
	background: none;
	border: 0;
	color: #3b6ea5;
	cursor: pointer;
	font-weight: 600;
	padding: 0.25rem 0;
}

/* Opening hours table */
.add-listing__hours { width: 100%; border-collapse: collapse; }
.add-listing__hours th,
.add-listing__hours td { padding: 0.4rem 0.5rem; text-align: left; }
.add-listing__hours thead th { font-size: 0.8rem; color: #5b6472; }
.add-listing__hours select { padding: 0.35rem; border: 1px solid #cbd2dd; border-radius: 5px; }
.add-listing__hours tr.is-closed { opacity: 0.5; }

/* Photo upload + previews */
.add-listing__upload input[type="file"] { display: block; margin-bottom: 0.5rem; }
.add-listing__previews { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.5rem; }
.add-listing__preview { width: 72px; height: 72px; object-fit: cover; border-radius: 6px; }

.add-listing__error { color: #b3261e; font-weight: 600; margin: 0 0 1rem; }
.add-listing__submit {
	width: 100%;
	padding: 0.8rem 1rem;
	background: #3b6ea5;
	color: #fff;
	border: 0;
	border-radius: 6px;
	font-size: 1.05rem;
	font-weight: 700;
	cursor: pointer;
}
.add-listing__submit[disabled] { opacity: 0.6; cursor: default; }

.add-listing__loading {
	position: fixed;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 1rem;
	background: rgba(255, 255, 255, 0.92);
	z-index: 9999;
}
.add-listing__spinner {
	width: 40px;
	height: 40px;
	border: 4px solid #e2e5ea;
	border-top-color: #3b6ea5;
	border-radius: 50%;
	animation: signup-spin 0.8s linear infinite;
}

@media (max-width: 640px) {
	.add-listing__row--2,
	.add-listing__row--3 { grid-template-columns: 1fr; }
	.add-listing__service { grid-template-columns: 1fr 1fr; }
}

/* ---- Header nav actions ---- */
.site-nav { display: flex; align-items: center; gap: 1.5rem; }
.site-nav__actions { display: flex; align-items: center; gap: 1rem; margin-left: auto; }
.site-nav__link { text-decoration: none; font-weight: 600; }
.site-nav__cta {
	background: #3b6ea5;
	color: #fff;
	text-decoration: none;
	font-weight: 600;
	padding: 0.5rem 0.9rem;
	border-radius: 6px;
}

/* ---- Single listing ---- */
.single-listing .listing__gallery {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
	gap: 0.5rem;
	margin: 1rem 0;
}
.listing__gallery-img { width: 100%; height: 160px; object-fit: cover; border-radius: 8px; }
.listing__cols { display: grid; grid-template-columns: 2fr 1fr; gap: 2rem; margin-top: 1.5rem; }
.listing__main section,
.listing__sidebar section { margin-bottom: 1.75rem; }
.listing__services-table,
.listing__hours-table { width: 100%; border-collapse: collapse; }
.listing__services-table td,
.listing__hours-table th,
.listing__hours-table td { padding: 0.4rem 0; border-bottom: 1px solid #eef1f5; text-align: left; }
.listing__svc-price { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.listing__map-frame { width: 100%; height: 320px; border: 0; border-radius: 8px; }
.listing__sidebar { background: #f7f8fa; border-radius: 10px; padding: 1.25rem; align-self: start; }
.listing__contact-list,
.listing__social-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 0.4rem; }

@media (max-width: 768px) {
	.listing__cols { grid-template-columns: 1fr; }
	.listing__sidebar { order: -1; }
}

/* ---- Dashboard ---- */
.dashboard__inner { max-width: 720px; margin: 2.5rem auto; }
.dashboard__badge { padding: 0.15rem 0.55rem; border-radius: 999px; font-size: 0.85rem; }
.dashboard__badge--active { background: #e3f5e9; color: #1c6b3a; }
.dashboard__badge--inactive { background: #fdecea; color: #922; }
.dashboard__actions { display: flex; gap: 0.75rem; flex-wrap: wrap; margin: 1rem 0 2rem; }
.dashboard__btn {
	background: #3b6ea5;
	color: #fff;
	text-decoration: none;
	font-weight: 600;
	padding: 0.6rem 1rem;
	border-radius: 6px;
}
.dashboard__btn--secondary { background: #5b6472; }
.dashboard__listing-list { list-style: none; padding: 0; }
.dashboard__listing-list li { padding: 0.5rem 0; border-bottom: 1px solid #eef1f5; }
.dashboard__listing-status { color: #5b6472; font-size: 0.85rem; }

/* ============================================================
   Content blocks (templates/template-blocks.php)
   ============================================================ */
.block { padding-block: 3.5rem; }
.block__inner { max-width: 1200px; margin: 0 auto; padding-inline: 1rem; }
.block__inner--center { text-align: center; }
.block__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: 1.75rem; }
.block__head--cta-only { justify-content: flex-end; margin-bottom: 1rem; }
.block__cta { color: #3b6ea5; font-weight: 600; text-decoration: none; white-space: nowrap; }
.block__cta:hover { text-decoration: underline; }

/* Hero */
.block--hero { background: #eaf0f7; }
.block-hero__title { font-size: clamp(2.25rem, 6vw, 4.5rem); line-height: 1; letter-spacing: -0.015em; margin: 0 auto; max-width: 20ch; text-wrap: balance; }
.block-hero__sub { margin: 1rem auto 0; color: #5b6472; font-size: 1.1rem; max-width: 55ch; }
.block-hero__search, .block--search .search-unit { margin-top: 1.75rem; display: flex; justify-content: center; }

/* Search unit form */
.search-unit { display: inline-flex; gap: 0.5rem; background: #fff; border: 1px solid #cbd2dd; border-radius: 999px; padding: 0.35rem 0.35rem 0.35rem 1rem; }
.search-unit__select { border: 0; background: none; font-size: 1rem; padding: 0.4rem; }
.search-unit__submit { background: #3b6ea5; color: #fff; border: 0; border-radius: 999px; padding: 0.55rem 1.25rem; font-weight: 600; cursor: pointer; }

/* Free text */
.block--free-text { padding-block: 1.5rem; }
.block-free-text h1, .block-free-text h2, .block-free-text h3 { line-height: 1.15; margin: 0 0 0.75rem; text-wrap: balance; }
.block-free-text p { margin: 0 0 1rem; color: #333a47; line-height: 1.7; }

/* Banner */
.block--banner { padding-block: 2rem; }
.block-banner__inner { max-width: 1000px; margin: 0 auto; text-align: center; background: linear-gradient(135deg, #3b6ea5, #2a4f77); color: #fff; border-radius: 16px; padding: 3rem 1.5rem; }
.block-banner__title { font-size: 2rem; margin: 0 0 0.5rem; color: #fff; text-wrap: balance; }
.block-banner__sub { margin: 0 auto 1.5rem; max-width: 50ch; opacity: 0.92; }
.block-banner__actions { display: flex; gap: 0.75rem; justify-content: center; flex-wrap: wrap; }
.block-btn { display: inline-block; padding: 0.65rem 1.4rem; border-radius: 8px; font-weight: 600; text-decoration: none; }
.block-btn--primary { background: #fff; color: #2a4f77; }
.block-btn--outline { border: 2px solid rgba(255,255,255,0.7); color: #fff; }

/* Category cards */
.block-categories__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
.block-category-card { --category-image: linear-gradient(135deg, #5b6472, #1c2230); position: relative; aspect-ratio: 4/3; border-radius: 12px; overflow: hidden; background-image: var(--category-image); background-size: cover; background-position: center; display: flex; align-items: flex-end; justify-content: space-between; padding: 1.25rem; color: #fff; text-decoration: none; transition: transform 0.2s, box-shadow 0.2s; }
.block-category-card:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(28,34,48,0.18); color: #fff; }
.block-category-card__overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.55), transparent 55%); pointer-events: none; }
.block-category-card__name { position: relative; font-size: 1.35rem; font-weight: 700; line-height: 1.1; }
.block-category-card__count { position: relative; background: rgba(0,0,0,0.55); font-size: 0.8rem; padding: 0.2rem 0.6rem; border-radius: 999px; }

/* Listings + articles grids */
.block-listings__grid, .block-articles__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }

/* Shared listing card */
.listing-card { border: 1px solid #e2e5ea; border-radius: 12px; overflow: hidden; background: #fff; transition: transform 0.2s, box-shadow 0.2s; }
.listing-card:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(28,34,48,0.1); }
.listing-card__link { display: block; text-decoration: none; color: inherit; }
.listing-card__media { display: block; aspect-ratio: 16/10; background-size: cover; background-position: center; }
.listing-card__media--empty { background: linear-gradient(135deg, #eaf0f7, #cbd2dd); }
.listing-card__body { display: block; padding: 1rem; }
.listing-card__cat { display: block; font-size: 0.78rem; color: #3b6ea5; margin-bottom: 0.25rem; }
.listing-card__cat a { color: inherit; text-decoration: none; }
.listing-card__title { display: block; font-weight: 700; font-size: 1.1rem; margin-bottom: 0.35rem; }
.listing-card__excerpt { display: block; color: #5b6472; font-size: 0.9rem; }

/* Article card */
.block-article-card { border: 1px solid #e2e5ea; border-radius: 12px; overflow: hidden; background: #fff; }
.block-article-card__link { display: block; text-decoration: none; color: inherit; }
.block-article-card__media { display: block; aspect-ratio: 16/10; background-size: cover; background-position: center; }
.block-article-card__body { display: block; padding: 1rem; }
.block-article-card__title { display: block; font-weight: 700; font-size: 1.05rem; margin-bottom: 0.35rem; }
.block-article-card__excerpt { display: block; color: #5b6472; font-size: 0.9rem; }

@media (max-width: 640px) {
	.block { padding-block: 2.25rem; }
	.block__head { flex-direction: column; align-items: flex-start; }
	.block-categories__grid, .block-listings__grid, .block-articles__grid { grid-template-columns: 1fr; }
	.search-unit { flex-direction: column; border-radius: 12px; width: 100%; }
	.search-unit__submit { border-radius: 8px; }
}