/*
Theme Name:  LawyersFund
Theme URI:   https://lawyersfund.com
Author:      Kervin Law LLC
Description: Block theme for LawyersFund. Every colour, font and template is editable in Appearance > Editor without touching code. Data lives in the LawyersFund Core plugin, not here, so this theme can be redesigned or replaced without losing a single listing.
Version:     0.3.0
Requires at least: 6.5
Tested up to: 6.7
Requires PHP: 8.0
License:     GPL-2.0-or-later
Text Domain: lawyersfund
Tags:        block-theme, full-site-editing, directory, one-column
*/

/* theme.json carries the design tokens. Only things the block system cannot
   express live here. Keep this file short on purpose. */

.lf-contact { margin: .6rem 0 0; line-height: 1.7; }
.lf-contact a { text-decoration: none; border-bottom: 1px solid var(--wp--preset--color--rule); }
.lf-contact a:hover { border-bottom-color: var(--wp--preset--color--ink); }
.lf-contact .lf-label {
	display: inline-block; min-width: 4.2em;
	font-family: var(--wp--preset--font-family--sans);
	font-size: .7rem; font-weight: 700; letter-spacing: .02em;
	color: var(--wp--preset--color--soft); text-transform: none;
}
.lf-contact .lf-tel { font-weight: 700; }
.lf-contact .lf-line { display: block; font-family: var(--wp--preset--font-family--sans); font-size: .88rem; }
.lf-contact .lf-web { color: var(--wp--preset--color--soft); font-size: .8rem; word-break: break-word; }

.lf-paid {
	display: inline-block;
	font-family: var(--wp--preset--font-family--sans);
	font-size: .66rem; font-weight: 700; letter-spacing: .04em;
	color: var(--wp--preset--color--cost); margin-bottom: .5rem;
}
.lf-free {
	display: inline-block;
	font-family: var(--wp--preset--font-family--sans);
	font-size: .66rem; font-weight: 700; letter-spacing: .04em;
	color: var(--wp--preset--color--free); margin-bottom: .5rem;
}

/* Listing cards are separated by rules rather than boxes. Boxed cards with a
   soft shadow are the single most recognisable template look. */
.lf-card { border-top: 1px solid var(--wp--preset--color--rule); padding: 1.2rem 0 1.4rem; }
.lf-card.is-paid { border-top: 2px solid var(--wp--preset--color--cost); }

.lf-shot {
	width: 96px; height: 96px; border-radius: 50%; overflow: hidden;
	background: var(--wp--preset--color--panel);
	border: 1px solid var(--wp--preset--color--rule);
	display: flex; align-items: center; justify-content: center; flex: 0 0 96px;
}
.lf-shot img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; }
.lf-shot .lf-ini {
	font-family: var(--wp--preset--font-family--sans);
	font-size: 1.8rem; font-weight: 700; color: var(--wp--preset--color--soft);
}

.lf-search { display: flex; gap: .6rem; flex-wrap: wrap; }
.lf-search input[type="search"], .lf-search input[type="text"] {
	font-family: var(--wp--preset--font-family--sans); font-size: 1rem;
	padding: .7rem .85rem; flex: 1 1 300px;
	border: 1px solid var(--wp--preset--color--ink);
	background: var(--wp--preset--color--paper); color: var(--wp--preset--color--ink);
	border-radius: 0;
}
.lf-search button {
	font-family: var(--wp--preset--font-family--sans); font-size: .95rem; font-weight: 700;
	padding: .7rem 1.5rem; cursor: pointer; border-radius: 0;
	border: 1px solid var(--wp--preset--color--free);
	background: var(--wp--preset--color--free); color: #fff;
}
.lf-search button:hover { background: var(--wp--preset--color--ink); border-color: var(--wp--preset--color--ink); }

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

@media (max-width: 520px) {
	.lf-shot { width: 72px; height: 72px; flex: 0 0 72px; }
	.lf-shot .lf-ini { font-size: 1.4rem; }
}
@media (prefers-reduced-motion: reduce) {
	* { transition: none !important; animation: none !important; }
}

/* ---- state index ---- */
.lf-states {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
	border-top: 1px solid var(--wp--preset--color--rule);
	border-left: 1px solid var(--wp--preset--color--rule);
	margin: 1.5rem 0;
}
.lf-states .lf-state {
	display: flex; justify-content: space-between; align-items: baseline; gap: .6rem;
	padding: .65rem .8rem; text-decoration: none;
	font-family: var(--wp--preset--font-family--sans); font-size: .9rem;
	color: var(--wp--preset--color--ink);
	border-bottom: 1px solid var(--wp--preset--color--rule);
	border-right: 1px solid var(--wp--preset--color--rule);
}
.lf-states .lf-state:hover { background: var(--wp--preset--color--panel); }
.lf-states .lf-state-n {
	font-size: .78rem; color: var(--wp--preset--color--soft); font-variant-numeric: tabular-nums;
}
.lf-states .lf-state.is-empty .lf-state-name { color: var(--wp--preset--color--soft); }
.lf-empty { font-family: var(--wp--preset--font-family--sans); font-size: .9rem; color: var(--wp--preset--color--soft); }

/* ---- attorney detail grid ---- */
.lf-kv {
	display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: .8rem 1.4rem; margin: .9rem 0;
}
.lf-kv div span {
	display: block; font-family: var(--wp--preset--font-family--sans);
	font-size: .68rem; color: var(--wp--preset--color--soft); margin-bottom: .1rem;
}
.lf-kv div b { font-family: var(--wp--preset--font-family--sans); font-size: .95rem; font-weight: 700; }

.lf-area {
	font-family: var(--wp--preset--font-family--sans); font-size: .8rem;
	color: var(--wp--preset--color--soft); margin: .5rem 0 0;
}
.lf-area a { color: var(--wp--preset--color--soft); border-bottom: 1px solid var(--wp--preset--color--rule); text-decoration: none; }
.lf-area a:hover { color: var(--wp--preset--color--ink); }

/* ---- state page content ---- */
.lf-answer {
	font-size: 1.12rem; line-height: 1.65; max-width: 72ch;
	margin: 0 0 1.4rem;
}
.lf-faqs { max-width: 74ch; margin-top: 3rem; }
.lf-faq-h {
	font-family: var(--wp--preset--font-family--sans); font-size: .78rem; font-weight: 700;
	color: var(--wp--preset--color--soft); margin: 0 0 .4rem;
	padding-bottom: .5rem; border-bottom: 1px solid var(--wp--preset--color--rule);
}
.lf-fq { border-bottom: 1px solid var(--wp--preset--color--rule); padding: .7rem 0; }
.lf-fq summary {
	cursor: pointer; font-family: var(--wp--preset--font-family--sans);
	font-size: .92rem; font-weight: 500;
}
.lf-fq p { margin: .6rem 0 .2rem; color: var(--wp--preset--color--soft); max-width: 68ch; }
