/*
 * FX Tools Frontend Styles
 *
 * Standalone styles for TOC + comment form/button so plugin works with any theme.
 */

.fxt-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.35rem;
	padding: 0.72rem 1.25rem;
	border-radius: var(--fxt-radius, 14px);
	font-size: 0.95rem;
	font-weight: 600;
	cursor: pointer;
	transition: background .2s, color .2s, box-shadow .2s;
	border: 1px solid transparent;
	box-sizing: border-box;
	line-height: 1.2;
	letter-spacing: 0;
	margin-right: 0;
	min-height: 2.85rem;
	text-decoration: none;
	text-shadow: none;
	text-transform: none;
	vertical-align: middle;
	-webkit-appearance: none;
	appearance: none;
}

.fxt-btn--primary {
	background: var(--fxt-ui-primary, #2563eb);
	color: var(--fxt-ui-on-primary, #fff);
}

.fxt-btn--primary:hover {
	background: var(--fxt-ui-primary-hover, #1d4ed8);
	color: var(--fxt-ui-on-primary, #fff);
}

.fxt-toc {
	background: var(--fxt-ui-surface-bg, var(--fxt-glass, #fff));
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	border: 1px solid var(--fxt-ui-border, var(--fxt-color-bg-alt, #e2e8f0));
	border-radius: var(--fxt-radius, 10px);
	margin-bottom: 2rem;
	font-size: 0.9rem;
	overflow: hidden;
}

.fxt-toc__toggle, button.fxt-toc__toggle {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	width: 100%;
	padding: 10px 20px;
	margin-bottom: 0;
	background: none;
	border: none;
	cursor: pointer;
	color: var(--fxt-ui-text, var(--fxt-color-text, #0f172a));
	font-family: inherit;
	font-size: 0.9rem;
	text-align: left;
}


.fxt-toc__toggle:hover, .fxt-toc__toggle:focus, .fxt-toc__toggle:active {
	background: var(--fxt-ui-state-bg, #eff6ff);
	color: var(--fxt-ui-text, var(--fxt-color-text, #0f172a));
}

.fxt-toc__icon {
	color: var(--fxt-ui-primary, var(--fxt-accent, #2563eb));
	flex-shrink: 0;
	display: flex;
	align-items: center;
}

.fxt-toc__label {
	flex: 1;
	font-weight: 700;
}

.fxt-toc__count {
	font-weight: 400;
	color: var(--fxt-ui-muted, var(--fxt-color-muted, #475569));
}

.fxt-toc__chevron {
	flex-shrink: 0;
	color: var(--fxt-ui-muted, var(--fxt-color-muted, #475569));
	display: flex;
	align-items: center;
	transition: transform .25s ease;
}

.fxt-toc[data-open] .fxt-toc__chevron {
	transform: rotate(180deg);
}

.fxt-toc__body {
	border-top: 1px solid var(--fxt-ui-border, var(--fxt-glass-border, #e2e8f0));
	max-height: 400px;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior: contain;
	padding: 10px;
	scrollbar-width: thin;
}

.fxt-toc__body[hidden] {
	display: none;
}

.fxt-toc__list {
	list-style: decimal;
	padding-left: 1.4rem;
	margin: 0;
}

.fxt-toc__list ol {
	list-style: none;
	padding-left: 0;
	margin: 0.25rem 0 0.1rem;
	counter-reset: none;
}

.fxt-toc__item, li.fxt-toc__item {
    padding: 0.3rem 0;
    line-height: 1.4;
    margin-bottom: 0;
}

.fxt-toc__item--h3 {
	padding: 0.2rem 0;
}

.fxt-toc__item a {
	color: var(--fxt-ui-text, var(--fxt-color-text, #0f172a));
	text-decoration: none;
	transition: color .15s;
}

.fxt-toc__item--h3 a {
	color: var(--fxt-ui-muted, var(--fxt-color-muted, #475569));
	font-size: 0.875rem;
}

.fxt-toc__item a:hover,
.fxt-toc__item a.is-active {
	color: var(--fxt-ui-primary, var(--fxt-accent, #2563eb));
	font-weight: 600;
}

.comments-area,
.fxt-comments {
	margin-top: 3rem;
}

.comments-area .comments-title,
.fxt-comments__title {
	margin: 0 0 1.5rem;
	font-size: 1.1rem;
	font-weight: 600;
	line-height: 1.4;
	color: var(--fxt-ui-text, #0f172a);
}

.comments-area .comment-list,
.comments-area .comment-list .children,
#reviews .commentlist {
	list-style: none;
	padding: 0;
}

.comments-area .comment-list {
	margin-top: 2rem;
    padding: 1.35rem 1.5rem 1.5rem;
    background: var(--fxt-ui-surface-bg, #fff);
    border: 1px solid var(--fxt-ui-border, #e2e8f0);
    border-radius: var(--fxt-radius, 14px);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.comments-area .comment-list > li {
	margin-bottom: 1rem;
}

.comments-area .comment-list > li:last-child {
	margin-bottom: 0;
}

.comments-area .comment-list .children {
	margin: 1rem 0 0 1.5rem;
	padding-left: 1rem;
	border-left: 2px solid var(--fxt-ui-border, #e2e8f0);
	border-radius: var(--fxt-radius, 10px);	
}

.comments-area .comment-body {
	padding: 1rem 1.15rem;
	background: var(--fxt-ui-surface-bg, #fff);
	border: 1px solid var(--fxt-ui-border, #e2e8f0);
	border-radius: var(--fxt-radius, 10px);
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.comments-area .comment-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem;
	margin-bottom: 0.9rem;
}

.comments-area .comment-author {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	flex: 1 1 auto;
	min-width: 0;
	color: var(--fxt-ui-text, #0f172a);
}

.comments-area .comment-author .avatar {
	width: 40px;
	height: 40px;
	border-radius: 999px;
	flex-shrink: 0;
}

.comments-area .comment-author .fn,
.comments-area .comment-author .fn a {
	font-size: 0.92rem;
	font-weight: 600;
	font-style: normal;
	color: var(--fxt-ui-text, #0f172a);
	text-decoration: none;
}

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

.comments-area .comment-metadata,
.comments-area .comment-metadata a {
	font-size: 0.78rem;
	color: var(--fxt-ui-muted, #475569);
	text-decoration: none;
}

.comments-area .comment-metadata a:hover,
.comments-area .comment-metadata a:focus {
	color: var(--fxt-ui-primary, #2563eb);
}

.comments-area .reply {
	margin-left: auto;
	font-size: 0.78rem;
}

.comments-area .reply a,
.comments-area .comment-reply-link {
	color: var(--fxt-ui-primary, #2563eb);
	text-decoration: none;
	font-weight: 600;
}

.comments-area .reply a:hover,
.comments-area .reply a:focus,
.comments-area .comment-reply-link:hover,
.comments-area .comment-reply-link:focus {
	color: var(--fxt-ui-primary-hover, #1d4ed8);
}

.comments-area .comment-content {
	font-size: 0.925rem;
	line-height: 1.7;
	color: var(--fxt-ui-text, #0f172a);
}

.comments-area .comment-content p {
	margin: 0 0 0.6rem;
}

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

.comments-area .pingback .comment-body,
.comments-area .trackback .comment-body {
	padding: 0.9rem 1rem;
	font-size: 0.9rem;
}

.comments-area .comment.bypostauthor > .comment-body .fn::after {
	content: " Tác giả";
	display: inline-flex;
	align-items: center;
	margin-left: 0.4em;
	padding: 0.1em 0.45em;
	border-radius: 999px;
	background: var(--fxt-ui-primary, #2563eb);
	color: var(--fxt-ui-on-primary, #fff);
	font-size: 0.68rem;
	font-weight: 400;
}

.comments-area .comment-awaiting-moderation,
.comments-area .no-comments {
	display: block;
	margin-top: 0.35rem;
	padding: 0.8rem 0.95rem;
	background: var(--fxt-ui-state-bg, #eff6ff);
	border: 1px solid var(--fxt-ui-border, #e2e8f0);
	border-radius: var(--fxt-radius, 10px);
	font-size: 0.84rem;
	font-style: italic;
	color: var(--fxt-ui-muted, #475569);
}

.comments-area .comment-navigation {
	margin: 1.5rem 0 2rem;
}

.comments-area .comment-navigation .nav-links {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
}

.comments-area .comment-navigation a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 2.25rem;
	padding: 0.55rem 0.95rem;
	background: var(--fxt-ui-surface-bg, #fff);
	border: 1px solid var(--fxt-ui-border, #e2e8f0);
	border-radius: 999px;
	color: var(--fxt-ui-text, #0f172a);
	text-decoration: none;
	font-size: 0.85rem;
	font-weight: 600;
}

.comments-area .comment-navigation a:hover,
.comments-area .comment-navigation a:focus {
	border-color: var(--fxt-ui-primary, #2563eb);
	background: var(--fxt-ui-state-bg, #eff6ff);
	color: var(--fxt-ui-primary, #2563eb);
}

.fxt-comment-form {
	margin-top: 2rem;
	padding: 1.35rem 1.5rem 1.5rem;
	background: var(--fxt-ui-surface-bg, #fff);
	border: 1px solid var(--fxt-ui-border, #e2e8f0);
	border-radius: var(--fxt-radius, 10px);
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.fxt-comment-form .comment-reply-title {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.65rem;
	margin: 0 0 1.25rem;
	font-size: 1.1rem;
	font-weight: 600;
	line-height: 1.4;
	color: var(--fxt-ui-text, #0f172a);
}

.fxt-comment-form .comment-reply-title small {
	margin-left: auto;
	font-size: 0.82rem;
	font-weight: 500;
}

.fxt-comment-form #cancel-comment-reply-link {
	color: var(--fxt-ui-primary, #2563eb);
	text-decoration: none;
}

.fxt-comment-form #cancel-comment-reply-link:hover,
.fxt-comment-form #cancel-comment-reply-link:focus {
	color: var(--fxt-ui-primary-hover, #1d4ed8);
}

.fxt-comment-form .comment-notes,
.fxt-comment-form .logged-in-as,
.fxt-comment-form .required-field-message,
.fxt-comment-form #email-notes,
.fxt-comment-form .must-log-in {
	margin: 0;
	font-size: 0.925rem;
	line-height: 1.6;
	color: var(--fxt-ui-muted, #475569);
}

.fxt-comment-form .must-log-in {
	padding: 0.85rem 0.95rem;
	background: var(--fxt-ui-state-bg, #eff6ff);
	border: 1px solid var(--fxt-ui-border, #e2e8f0);
	border-radius: var(--fxt-radius, 10px);
}

.fxt-comment-form .must-log-in a,
.fxt-comment-form .logged-in-as a {
	color: var(--fxt-ui-primary, #2563eb);
	text-decoration: none;
	font-weight: 600;
}

.fxt-comment-form .must-log-in a:hover,
.fxt-comment-form .must-log-in a:focus,
.fxt-comment-form .logged-in-as a:hover,
.fxt-comment-form .logged-in-as a:focus {
	color: var(--fxt-ui-primary-hover, #1d4ed8);
}

.fxt-comment-form .required {
	color: var(--fxt-ui-primary, #2563eb);
}

.fxt-comment-form .comment-form {
	display: grid;
	gap: 1rem;
	margin: 0;
}

.fxt-comment-form .comment-notes,
.fxt-comment-form .logged-in-as,
.fxt-comment-form .must-log-in,
.fxt-comment-form .comment-form-rating,
.fxt-comment-form .comment-form-comment,
.fxt-comment-form .comment-form-cookies-consent,
.fxt-comment-form .form-submit {
	grid-column: 1 / -1;
}

.fxt-comment-form .comment-form-author,
.fxt-comment-form .comment-form-email,
.fxt-comment-form .comment-form-url,
.fxt-comment-form .comment-form-comment,
.fxt-comment-form .comment-form-rating {
	display: flex;
	flex-direction: column;
	gap: 0.45rem;
	margin: 0;
}

.fxt-comment-form .comment-form-cookies-consent {
	display: flex;
	align-items: flex-start;
	gap: 0.65rem;
	margin: 0;
	font-size: 0.82rem;
	color: var(--fxt-ui-muted, #475569);
}

.fxt-comment-form .comment-form-cookies-consent input[type="checkbox"] {
	margin: 0.18rem 0 0;
	accent-color: var(--fxt-ui-primary, #2563eb);
}

.fxt-comment-form label {
	font-size: 0.82rem;
	font-weight: 600;
	color: var(--fxt-ui-muted, #475569);
}

.fxt-comment-form input[type="text"],
.fxt-comment-form input[type="email"],
.fxt-comment-form input[type="url"],
.fxt-comment-form select,
.fxt-comment-form textarea {
	width: 100%;
	padding: 0.75rem 0.95rem;
	border: 1px solid var(--fxt-ui-border, #cbd5e1);
	border-radius: var(--fxt-radius, 10px);
	font-family: inherit;
	font-size: 0.9rem;
	line-height: 1.5;
	background: var(--fxt-ui-surface-bg, #fff);
	color: var(--fxt-ui-text, #0f172a);
	transition: border-color .2s, box-shadow .2s, background .2s;
}

.fxt-comment-form input::placeholder,
.fxt-comment-form textarea::placeholder {
	color: var(--fxt-ui-muted, #475569);
	opacity: 0.8;
}

.fxt-comment-form input:focus,
.fxt-comment-form select:focus,
.fxt-comment-form textarea:focus {
	outline: none;
	border-color: var(--fxt-ui-primary, #2563eb);
	box-shadow: 0 0 0 1px var(--fxt-ui-primary, #2563eb);
}

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

.fxt-comment-form .form-submit {
	display: flex;
	align-items: center;
	margin: 0.25rem 0 0;
}

#reviews.woocommerce-Reviews {
	margin-top: 2.5rem;
}

#reviews .woocommerce-Reviews-title {
	margin: 0 0 1.25rem;
	font-size: 1.12rem;
	line-height: 1.4;
	color: var(--fxt-ui-text, #0f172a);
}

#reviews .woocommerce-Reviews-title span {
	color: var(--fxt-ui-primary, #2563eb);
}

#reviews .woocommerce-noreviews,
#reviews .woocommerce-verification-required {
	margin: 0;
	padding: 1rem 1.1rem;
	background: var(--fxt-ui-state-bg, #eff6ff);
	border: 1px solid var(--fxt-ui-border, #e2e8f0);
	border-radius: var(--fxt-radius, 10px);
	font-size: 0.92rem;
	line-height: 1.6;
	color: var(--fxt-ui-text, #0f172a);
}

#reviews .commentlist {
	margin: 0 0 1.5rem;
}

#reviews .commentlist > li {
	margin-bottom: 1rem;
}

#reviews .commentlist > li:last-child {
	margin-bottom: 0;
}

#reviews .comment_container {
	display: grid;
	grid-template-columns: 48px minmax(0, 1fr);
	gap: 1rem;
	align-items: start;
}

.comment-list>li:not(:first-child), .commentlist>li:not(:first-child) {
    border-top: none !important
}

#reviews .comment_container img.avatar {
	width: 48px;
	height: 48px;
	border-radius: 999px;
}

#reviews .comment-text {
	padding: 1rem 1.1rem;
	background: var(--fxt-ui-surface-bg, #fff);
	border: 1px solid var(--fxt-ui-border, #e2e8f0);
	border-radius: var(--fxt-radius, 10px);
	color: var(--fxt-ui-text, #0f172a);
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

#reviews .comment-text .star-rating {
	margin: 0 0 0.6rem;
}

#reviews .star-rating:before,
#reviews .woocommerce-page .star-rating:before {
	color: var(--fxt-ui-muted, #475569);
	opacity: 0.35;
}



#reviews .comment-text p.meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.35rem 0.6rem;
	margin: 0 0 0.8rem;
	font-size: 0.82rem;
	line-height: 1.5;
	color: var(--fxt-ui-muted, #475569);
}

#reviews .comment-text p.meta strong,
#reviews .woocommerce-review__author {
	color: var(--fxt-ui-text, #0f172a);
	font-size: 0.92rem;
	font-weight: 600;
}

#reviews .woocommerce-review__published-date,
#reviews .comment-text p.meta time,
#reviews .woocommerce-review__dash {
	color: var(--fxt-ui-muted, #475569);
}

#reviews .woocommerce-review__verified.verified,
#reviews .verified {
	display: inline-flex;
	align-items: center;
	padding: 0.2rem 0.5rem;
	background: var(--fxt-ui-state-bg, #eff6ff);
	border: 1px solid var(--fxt-ui-border, #e2e8f0);
	border-radius: 999px;
	color: var(--fxt-ui-primary, #2563eb);
	font-size: 0.72rem;
	font-style: normal;
	font-weight: 600;
}

#reviews .comment-text .description {
	font-size: 0.925rem;
	line-height: 1.7;
	color: var(--fxt-ui-text, #0f172a);
}

#reviews .comment-text .description p {
	margin: 0 0 0.6rem;
}

#reviews .comment-text .description p:last-child {
	margin-bottom: 0;
}

#reviews .woocommerce-pagination {
	margin-top: 1.25rem;
}

#reviews .woocommerce-pagination ul {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	padding: 0;
	margin: 0;
	list-style: none;
}

#reviews .woocommerce-pagination a,
#reviews .woocommerce-pagination span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.25rem;
	min-height: 2.25rem;
	padding: 0.45rem 0.8rem;
	background: var(--fxt-ui-surface-bg, #fff);
	border: 1px solid var(--fxt-ui-border, #e2e8f0);
	border-radius: 999px;
	color: var(--fxt-ui-text, #0f172a);
	text-decoration: none;
	font-size: 0.85rem;
	font-weight: 600;
}

#reviews .woocommerce-pagination a:hover,
#reviews .woocommerce-pagination a:focus,
#reviews .woocommerce-pagination .current {
	border-color: var(--fxt-ui-primary, #2563eb);
	background: var(--fxt-ui-state-bg, #eff6ff);
	color: var(--fxt-ui-primary, #2563eb);
}

#reviews #review_form_wrapper {
	margin-top: 1.5rem;
}

#reviews #review_form .col-inner,
#reviews .review-form-inner.has-border {
	height: 100%;
}



#reviews .review-form-inner.has-border .fxt-comment-form {
	margin-top: 0;
	padding: 0;
	background: none;
	border: 0;
	border-radius: 0;
	box-shadow: none;
}

#reviews .comment-form-rating p.stars {
	margin: 0;
}

#reviews .comment-form-rating .stars > span[role="group"] {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.45rem;
}

#reviews .comment-form-rating .stars a {
	display: inline-flex;
	align-items: center;
	margin: 0;
	padding: 0 0.25rem 0 0;
	color: transparent !important;
	font-size: 0;
	line-height: 1;
	text-decoration: none;
}

#reviews .comment-form-rating .stars a + a {
	padding-left: 0.55rem;
	border-left: 1px solid var(--fxt-ui-border, #e2e8f0);
}

#reviews .comment-form-rating .stars a:after {
	color: var(--fxt-ui-muted, #475569);
}

#reviews .comment-form-rating .stars a:hover:after,
#reviews .comment-form-rating .stars a.active:after {
	color: var(--fxt-ui-primary, #2563eb);
}

#reviews .comment-form-rating select#rating {
	max-width: 16rem;
}

:is(.comments-area, #reviews) #respond.fxt-comment-form {
	margin-top: 2rem;
	padding: 1.35rem 1.5rem 1.5rem;
	background: var(--fxt-ui-surface-bg, #fff);
	border: 1px solid var(--fxt-ui-border, #e2e8f0);
	border-radius: var(--fxt-radius, 14px);
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

#reviews .review-form-inner.has-border #respond.fxt-comment-form {
	margin-top: 0;
	padding: 0;
	background: none;
	border: 0;
	border-radius: 0;
	box-shadow: none;
}

:is(.comments-area, #reviews) #respond.fxt-comment-form .comment-reply-title {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.65rem;
	margin: 0 0 1.25rem;
	font-size: 1.1rem;
	font-weight: 600;
	line-height: 1.4;
	color: var(--fxt-ui-text, #0f172a);
}

:is(.comments-area, #reviews) #respond.fxt-comment-form .comment-reply-title small {
	margin-left: auto;
	font-size: 0.82rem;
	font-weight: 500;
}

:is(.comments-area, #reviews) #respond.fxt-comment-form #cancel-comment-reply-link {
	color: var(--fxt-ui-primary, #2563eb);
	text-decoration: none;
}

:is(.comments-area, #reviews) #respond.fxt-comment-form #cancel-comment-reply-link:hover,
:is(.comments-area, #reviews) #respond.fxt-comment-form #cancel-comment-reply-link:focus {
	color: var(--fxt-ui-primary-hover, #1d4ed8);
}

:is(.comments-area, #reviews) #respond.fxt-comment-form .comment-form {
	display: grid;
	gap: 1rem;
	margin: 0;
}

:is(.comments-area, #reviews) #respond.fxt-comment-form .comment-notes,
:is(.comments-area, #reviews) #respond.fxt-comment-form .logged-in-as,
:is(.comments-area, #reviews) #respond.fxt-comment-form .required-field-message,
:is(.comments-area, #reviews) #respond.fxt-comment-form #email-notes,
:is(.comments-area, #reviews) #respond.fxt-comment-form .must-log-in {
	margin: 0;
	font-size: 0.925rem;
	line-height: 1.6;
	color: var(--fxt-ui-muted, #475569);
}

:is(.comments-area, #reviews) #respond.fxt-comment-form .must-log-in {
	padding: 0.85rem 0.95rem;
	background: var(--fxt-ui-state-bg, #eff6ff);
	border: 1px solid var(--fxt-ui-border, #e2e8f0);
	border-radius: var(--fxt-radius, 14px);
}

:is(.comments-area, #reviews) #respond.fxt-comment-form .must-log-in a,
:is(.comments-area, #reviews) #respond.fxt-comment-form .logged-in-as a {
	color: var(--fxt-ui-primary, #2563eb);
	text-decoration: none;
	font-weight: 600;
}

:is(.comments-area, #reviews) #respond.fxt-comment-form .must-log-in a:hover,
:is(.comments-area, #reviews) #respond.fxt-comment-form .must-log-in a:focus,
:is(.comments-area, #reviews) #respond.fxt-comment-form .logged-in-as a:hover,
:is(.comments-area, #reviews) #respond.fxt-comment-form .logged-in-as a:focus {
	color: var(--fxt-ui-primary-hover, #1d4ed8);
}

:is(.comments-area, #reviews) #respond.fxt-comment-form .required {
	color: var(--fxt-ui-primary, #2563eb);
}

:is(.comments-area, #reviews) #respond.fxt-comment-form .comment-notes,
:is(.comments-area, #reviews) #respond.fxt-comment-form .logged-in-as,
:is(.comments-area, #reviews) #respond.fxt-comment-form .must-log-in,
:is(.comments-area, #reviews) #respond.fxt-comment-form .comment-form-rating,
:is(.comments-area, #reviews) #respond.fxt-comment-form .comment-form-comment,
:is(.comments-area, #reviews) #respond.fxt-comment-form .comment-form-cookies-consent,
:is(.comments-area, #reviews) #respond.fxt-comment-form .form-submit {
	grid-column: 1 / -1;
}

:is(.comments-area, #reviews) #respond.fxt-comment-form .comment-form-author,
:is(.comments-area, #reviews) #respond.fxt-comment-form .comment-form-email,
:is(.comments-area, #reviews) #respond.fxt-comment-form .comment-form-url,
:is(.comments-area, #reviews) #respond.fxt-comment-form .comment-form-comment,
:is(.comments-area, #reviews) #respond.fxt-comment-form .comment-form-rating {
	display: flex;
	flex-direction: column;
	gap: 0.45rem;
	margin: 0;
}

:is(.comments-area, #reviews) #respond.fxt-comment-form .comment-form-cookies-consent {
	display: flex;
	align-items: flex-start;
	gap: 0.65rem;
	margin: 0;
	font-size: 0.82rem;
	color: var(--fxt-ui-muted, #475569);
}

:is(.comments-area, #reviews) #respond.fxt-comment-form .comment-form-cookies-consent input[type="checkbox"] {
	margin: 0.18rem 0 0;
	accent-color: var(--fxt-ui-primary, #2563eb);
}

:is(.comments-area, #reviews) #respond.fxt-comment-form label {
	font-size: 0.82rem;
	font-weight: 600;
	color: var(--fxt-ui-muted, #475569);
}

:is(.comments-area, #reviews) #respond.fxt-comment-form input[type="text"],
:is(.comments-area, #reviews) #respond.fxt-comment-form input[type="email"],
:is(.comments-area, #reviews) #respond.fxt-comment-form input[type="url"],
:is(.comments-area, #reviews) #respond.fxt-comment-form select,
:is(.comments-area, #reviews) #respond.fxt-comment-form textarea {
	width: 100%;
	padding: 0.75rem 0.95rem;
	border: 1px solid var(--fxt-ui-border, #cbd5e1);
	border-radius: var(--fxt-radius, 14px);
	font-family: inherit;
	font-size: 0.9rem;
	line-height: 1.5;
	background: var(--fxt-ui-surface-bg, #fff);
	color: var(--fxt-ui-text, #0f172a);
	transition: border-color .2s, box-shadow .2s, background .2s;
	box-shadow: none;
}

:is(.comments-area, #reviews) #respond.fxt-comment-form input::placeholder,
:is(.comments-area, #reviews) #respond.fxt-comment-form textarea::placeholder {
	color: var(--fxt-ui-muted, #475569);
	opacity: 0.8;
}

:is(.comments-area, #reviews) #respond.fxt-comment-form input:focus,
:is(.comments-area, #reviews) #respond.fxt-comment-form select:focus,
:is(.comments-area, #reviews) #respond.fxt-comment-form textarea:focus {
	outline: none;
	border-color: var(--fxt-ui-primary, #2563eb);
	box-shadow: 0 0 0 1px var(--fxt-ui-primary, #2563eb);
}

:is(.comments-area, #reviews) #respond.fxt-comment-form textarea {
	min-height: 140px;
	resize: vertical;
}

:is(.comments-area, #reviews) #respond.fxt-comment-form .form-submit {
	display: flex;
	align-items: center;
	margin: 0.25rem 0 0;
}

:is(.comments-area, #reviews) #respond.fxt-comment-form input[type="submit"].fxt-submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.35rem;
	width: auto;
	max-width: 100%;
	min-height: 2.85rem;
	padding: 0.78rem 1.3rem;
	background: var(--fxt-ui-primary, #2563eb);
	border: 1px solid var(--fxt-ui-primary, #2563eb);
	border-radius: var(--fxt-radius, 14px);
	box-sizing: border-box;
	box-shadow: none;
	color: var(--fxt-ui-on-primary, #fff);
	cursor: pointer;
	font-size: 0.95rem;
	font-weight: 600;
	letter-spacing: 0;
	line-height: 1.2;
	margin: 0;
	text-align: center;
	text-decoration: none;
	text-shadow: none;
	text-transform: none;
	vertical-align: middle;
	-webkit-appearance: none;
	appearance: none;
}

:is(.comments-area, #reviews) #respond.fxt-comment-form input[type="submit"].fxt-submit:hover,
:is(.comments-area, #reviews) #respond.fxt-comment-form input[type="submit"].fxt-submit:focus {
	background: var(--fxt-ui-primary-hover, #1d4ed8);
	border-color: var(--fxt-ui-primary-hover, #1d4ed8);
	color: var(--fxt-ui-on-primary, #fff);
}

:is(.comments-area, #reviews) #respond.fxt-comment-form input[type="submit"].fxt-submit:focus-visible {
	outline: none;
	box-shadow: 0 0 0 3px var(--fxt-ui-state-bg, #eff6ff);
}

@media (min-width: 782px) {
	:is(.comments-area, #reviews) #respond.fxt-comment-form .comment-form {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	#reviews.woocommerce-Reviews {
		row-gap: 1.5rem;
	}
}

@media (max-width: 782px) {
	.comments-area .comment-list .children {
		margin-left: 0.75rem;
		padding-left: 0.85rem;
	}

	.comments-area .comment-meta {
		align-items: flex-start;
	}

	.comments-area .reply {
		width: 100%;
		margin-left: 0;
	}

	.fxt-comment-form {
		padding: 1.1rem 1rem 1.15rem;
	}

	#reviews .comment_container {
		grid-template-columns: 1fr;
	}

	#reviews .comment_container img.avatar {
		display: none;
	}

	#reviews .review-form-inner.has-border {
		padding: 1.1rem 1rem 1.15rem;
	}
}
