/**
 * Floor Ready Pro - Single Post template
 *
 * Styles for single.php + comments.php. The hero reuses .frp-page-header/
 * .frp-breadcrumb from about.css, and CTA from home.css/about.css — this
 * template loads both alongside this file.
 */

/* ----------------------------------------------------------------------
 * Hero meta row
 * -------------------------------------------------------------------- */
.frp-post-hero-meta {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--frp-space-5);
	margin-top: var(--frp-space-5);
}

.frp-post-hero-meta__item {
	display: inline-flex;
	align-items: center;
	gap: var(--frp-space-2);
	font-size: var(--frp-fs-sm);
	color: var(--frp-on-dark-70);
}

.frp-post-hero-meta__item .frp-icon {
	color: var(--frp-gold);
}

/* ----------------------------------------------------------------------
 * Layout
 * -------------------------------------------------------------------- */
.frp-post {
	padding-top: var(--frp-space-20);
	padding-bottom: var(--frp-space-12);
}

.frp-post__grid {
	max-width: 780px;
	margin-inline: auto;
}

.frp-post__image {
	margin-bottom: var(--frp-space-8);
	border-radius: var(--frp-radius-lg);
	overflow: hidden;
}

.frp-post__image img {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

/* ----------------------------------------------------------------------
 * Post content (the_content())
 * -------------------------------------------------------------------- */
.frp-post__content {
	line-height: var(--frp-lh-loose);
}

.frp-post__content > * + * {
	margin-top: var(--frp-space-5);
}

.frp-post__content h2,
.frp-post__content h3,
.frp-post__content h4 {
	margin-top: var(--frp-space-8);
}

.frp-post__content ul,
.frp-post__content ol {
	padding-left: var(--frp-space-6);
}

.frp-post__content li + li {
	margin-top: var(--frp-space-2);
}

.frp-post__content a {
	color: var(--frp-gold);
	text-decoration: underline;
}

.frp-post__content blockquote {
	margin: 0;
	padding: var(--frp-space-5) var(--frp-space-6);
	background: var(--frp-beige);
	border-left: 4px solid var(--frp-gold);
	border-radius: var(--frp-radius-md);
	font-style: italic;
	color: var(--frp-ink);
}

.frp-post__content img {
	max-width: 100%;
	height: auto;
	border-radius: var(--frp-radius-md);
}

/* ----------------------------------------------------------------------
 * Tags
 * -------------------------------------------------------------------- */
.frp-post__tags {
	display: flex;
	flex-wrap: wrap;
	gap: var(--frp-space-2);
	margin-top: var(--frp-space-8);
	padding-top: var(--frp-space-6);
	border-top: var(--frp-border);
}

.frp-post__tag {
	padding: var(--frp-space-1) var(--frp-space-4);
	background: var(--frp-grey-50);
	border-radius: var(--frp-radius-pill);
	font-size: var(--frp-fs-xs);
	font-weight: var(--frp-fw-medium);
	color: var(--frp-ink);
}

.frp-post__tag:hover {
	background: var(--frp-gold);
	color: var(--frp-white);
}

/* ----------------------------------------------------------------------
 * Author box
 * -------------------------------------------------------------------- */
.frp-post__author {
	display: flex;
	gap: var(--frp-space-4);
	align-items: flex-start;
	margin-top: var(--frp-space-10);
	padding: var(--frp-space-6);
	background: var(--frp-grey-50);
	border-radius: var(--frp-radius-lg);
}

.frp-post__author-avatar {
	flex-shrink: 0;
	width: 64px;
	height: 64px;
	border-radius: var(--frp-radius-circle);
	object-fit: cover;
}

.frp-post__author-name {
	margin: 0 0 var(--frp-space-1);
	font-size: var(--frp-fs-h5);
}

.frp-post__author-bio {
	margin: 0;
	font-size: var(--frp-fs-sm);
	color: var(--frp-grey-500);
}

/* ----------------------------------------------------------------------
 * Prev/next post navigation
 * -------------------------------------------------------------------- */
.frp-post__nav {
	display: flex;
	justify-content: space-between;
	gap: var(--frp-space-6);
	margin-top: var(--frp-space-10);
	padding-top: var(--frp-space-6);
	border-top: var(--frp-border);
}

.frp-post__nav-link {
	max-width: 45%;
}

.frp-post__nav-link a {
	display: flex;
	flex-direction: column;
	gap: var(--frp-space-1);
}

.frp-post__nav-link--next {
	margin-left: auto;
	text-align: right;
}

.frp-post__nav-label {
	font-size: var(--frp-fs-xs);
	font-weight: var(--frp-fw-semibold);
	color: var(--frp-gold);
	text-transform: uppercase;
	letter-spacing: var(--frp-ls-eyebrow);
}

.frp-post__nav-title {
	font-size: var(--frp-fs-sm);
	font-weight: var(--frp-fw-medium);
	color: var(--frp-ink);
}

/* ----------------------------------------------------------------------
 * Comments
 * -------------------------------------------------------------------- */
.frp-comments {
	margin-top: var(--frp-space-12);
	padding-top: var(--frp-space-10);
	border-top: var(--frp-border);
}

.frp-comments__title {
	margin-bottom: var(--frp-space-6);
	font-size: var(--frp-fs-h3);
}

.frp-comments__closed {
	color: var(--frp-grey-500);
}

.comment-list,
.comment-list .children {
	list-style: none;
	margin: 0;
	padding: 0;
}

.comment-list {
	display: flex;
	flex-direction: column;
	gap: var(--frp-space-6);
}

.comment-list .children {
	margin-top: var(--frp-space-6);
	padding-left: var(--frp-space-8);
	display: flex;
	flex-direction: column;
	gap: var(--frp-space-6);
}

.comment-body {
	padding-bottom: var(--frp-space-6);
	border-bottom: var(--frp-border);
}

.comment-meta {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--frp-space-3);
	margin-bottom: var(--frp-space-3);
}

.comment-author {
	display: flex;
	align-items: center;
	gap: var(--frp-space-3);
}

.comment-author .avatar {
	border-radius: var(--frp-radius-circle);
}

.comment-author .fn {
	font-style: normal;
	font-weight: var(--frp-fw-semibold);
	color: var(--frp-ink);
}

.comment-author .says {
	display: none;
}

.comment-metadata {
	font-size: var(--frp-fs-xs);
	color: var(--frp-grey-500);
}

.comment-metadata a {
	color: inherit;
}

.comment-content p {
	margin: 0 0 var(--frp-space-2);
	font-size: var(--frp-fs-sm);
	color: var(--frp-grey-500);
	line-height: var(--frp-lh-loose);
}

.comment-content p:last-child {
	margin-bottom: 0;
}

.reply {
	margin-top: var(--frp-space-2);
}

.comment-reply-link {
	font-size: var(--frp-fs-xs);
	font-weight: var(--frp-fw-semibold);
	color: var(--frp-gold);
	text-transform: uppercase;
	letter-spacing: var(--frp-ls-eyebrow);
}

.frp-comments__nav {
	display: flex;
	justify-content: space-between;
	gap: var(--frp-space-4);
	margin-top: var(--frp-space-6);
	font-size: var(--frp-fs-sm);
	font-weight: var(--frp-fw-medium);
}

.frp-comments__nav a {
	color: var(--frp-gold);
}

/* ----------------------------------------------------------------------
 * Comment form
 * -------------------------------------------------------------------- */
.comment-respond {
	margin-top: var(--frp-space-10);
	padding: var(--frp-space-6) var(--frp-space-8);
	background: var(--frp-grey-50);
	border-radius: var(--frp-radius-lg);
}

#reply-title {
	margin-bottom: var(--frp-space-5);
	font-size: var(--frp-fs-h4);
}

.comment-form p {
	margin: 0 0 var(--frp-space-5);
}

.comment-form label {
	display: block;
	margin-bottom: var(--frp-space-2);
	font-size: var(--frp-fs-sm);
	font-weight: var(--frp-fw-medium);
	color: var(--frp-ink);
}

.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
	width: 100%;
	padding: var(--frp-space-3) var(--frp-space-4);
	background: var(--frp-white);
	border: 1px solid var(--frp-grey-100);
	border-radius: var(--frp-radius-sm);
	font-family: inherit;
	font-size: var(--frp-fs-sm);
	color: var(--frp-ink);
	transition: border-color var(--frp-transition);
}

.comment-form input[type="text"]:focus,
.comment-form input[type="email"]:focus,
.comment-form input[type="url"]:focus,
.comment-form textarea:focus {
	outline: none;
	border-color: var(--frp-gold);
}

.comment-form textarea {
	min-height: 120px;
	resize: vertical;
}

.comment-form .comment-form-cookies-consent {
	display: flex;
	align-items: center;
	gap: var(--frp-space-2);
	font-size: var(--frp-fs-xs);
	color: var(--frp-grey-500);
}

.comment-form .comment-form-cookies-consent label {
	margin: 0;
	font-weight: var(--frp-fw-regular);
}

/* ----------------------------------------------------------------------
 * Responsive
 * -------------------------------------------------------------------- */
@media (max-width: 640px) {
	.frp-post {
		padding-top: var(--frp-space-12);
		padding-bottom: var(--frp-space-8);
	}

	.frp-post__author {
		flex-direction: column;
	}

	.frp-post__nav {
		flex-direction: column;
	}

	.frp-post__nav-link,
	.frp-post__nav-link--next {
		max-width: 100%;
		margin-left: 0;
		text-align: left;
	}

	.comment-list .children {
		padding-left: var(--frp-space-4);
	}

	.comment-respond {
		padding: var(--frp-space-5);
	}
}