/**
 * Freemius pricing page — brand-aligned styles.
 *
 * Scoped to #fs_pricing so there is no risk of leaking into other WP admin
 * pages. Same token set as freemius-connect.css; kept in sync manually.
 */

/* ── Design tokens ───────────────────────────────────────────────────── */

#fs_pricing {

	/* Brand */
	--fs-brand:              #7047eb;
	--fs-brand-dark:         #5e30d0;
	--fs-brand-darker:       #4c22b0;
	--fs-brand-gradient:     linear-gradient( 135deg, #7047eb 0%, #6647f0 100% );
	--fs-brand-soft:         #f5f3ff;
	--fs-brand-border:       #c4b5fd;

	/* Surfaces */
	--fs-surface:            #fff;
	--fs-surface-app:        #f0f0f1;
	--fs-surface-subtle:     #f9f8ff;
	--fs-surface-overlay:    #f0ecff;
	--fs-surface-hover:      #ede9fe;
	--fs-surface-card:       #fff;
	--fs-surface-dark:       #1e1040;
	--fs-surface-darker:     #130b2e;

	/* Text */
	--fs-text:               #1d2327;
	--fs-text-2:             #50575e;
	--fs-text-3:             #8c8f94;
	--fs-text-brand:         #7047eb;
	--fs-text-inverse:       #f8f8f8;
	--fs-text-on-dark:       #e2d9ff;

	/* Borders */
	--fs-border:             #dcdcde;
	--fs-border-subtle:      #e9e9eb;
	--fs-border-card:        #e4e0f9;

	/* Shadows */
	--fs-shadow-xs:          0 1px 2px 0 rgb( 0 0 0 / .05 );
	--fs-shadow-sm:          0 1px 3px 0 rgb( 0 0 0 / .10 ), 0 1px 2px -1px rgb( 0 0 0 / .10 );
	--fs-shadow-md:          0 4px 6px -1px rgb( 0 0 0 / .08 ), 0 2px 4px -2px rgb( 0 0 0 / .06 );
	--fs-shadow-card:        0 0 0 1px var( --fs-border-card ), 0 2px 8px -2px rgb( 112 71 235 / .12 );
	--fs-shadow-card-hover:  0 0 0 2px var( --fs-brand-border ), 0 8px 24px -4px rgb( 112 71 235 / .18 );

	/* Radii */
	--fs-radius-sm:          4px;
	--fs-radius-md:          6px;
	--fs-radius-lg:          12px;
	--fs-radius-xl:          16px;
	--fs-radius-full:        9999px;

	/* Typography */
	--fs-font:               -apple-system, blinkmacsystemfont, "Segoe UI", roboto, sans-serif;

	/* Motion */
	--fs-duration:           150ms;
	--fs-ease:               cubic-bezier( 0.16, 1, 0.3, 1 );
}

/* ── Base reset ──────────────────────────────────────────────────────── */

#fs_pricing {
	padding: 0 !important;
	margin: 0 !important;
	font-family: var( --fs-font );
	background: var( --fs-surface-app );
}

/* ── WP admin + Freemius element resets ──────────────────────────────── */

/* WP admin injects padding on bare p, h*, a, li inside #wpcontent.
   Reset everything inside our container then re-add via component rules. */
#fs_pricing h1,
#fs_pricing h2,
#fs_pricing h3,
#fs_pricing h4,
#fs_pricing h5,
#fs_pricing h6 {
	margin: 0;
	padding: 0;
}

#fs_pricing p {
	margin: 0;
	padding: 0;
}

#fs_pricing ul,
#fs_pricing ol {
	list-style: none;
	margin: 0;
	padding: 0;
}

#fs_pricing li {
	margin: 0;
	padding: 0;
}

#fs_pricing a {
	margin: 0;
	padding: 0;
}

/* Freemius global .fs-section adds padding: 20px on every section.
   Nullify it — our component rules re-add spacing precisely. */
#fs_pricing .fs-section {
	margin: 0;
	padding: 0;
}

/* Freemius JS sets width on .fs-packages-nav for its carousel; the
   resolved auto margin creates unwanted 33.5px side gutter. Kill it. */
#fs_pricing .fs-packages-nav,
#fs_pricing .fs-section--faq-items {
	margin-left: 0 !important;
	margin-right: 0 !important;
}

/* ── Freemius SDK dynamic CSS overrides ──────────────────────────────── */
/* Freemius injects inline <style> sheets AFTER our file loads, so equal-
   specificity rules lose to them. !important is the correct fix here.   */

/* Section spacing: .fs-app-main > .fs-section { margin: 4em auto 0; padding: 20px } */
/* Exclude .fs-section--faq so its margin-top: 56px survives. */
#fs_pricing_app .fs-app-main > .fs-section:not( .fs-section--faq ) {
	margin: 0 !important;
	padding: 0 !important;
}

/* FAQ needs breathing room from plans section */
#fs_pricing_app .fs-app-main > .fs-section--faq {
	margin-top: 56px !important;
	padding: 0 !important;
}

/* Remove alternating section backgrounds */
#fs_pricing_app .fs-app-main > .fs-section:nth-child( 2n ) {
	background: transparent !important;
}

/* Plugin title logo box: border + margin + bg */
#fs_pricing_app .fs-app-header .fs-plugin-title-and-logo {
	border: none !important;
	background: transparent !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* Page title: text-align: left; padding: 20px 15px 10px */
#fs_pricing_app .fs-app-header .fs-page-title {
	display: block !important;
	text-align: center !important;
	padding: 0 !important;
	margin: 0 !important;
}

/* Billing cycles: display: inline-block → flex */
#fs_pricing_app .fs-section--billing-cycles {
	display: flex !important;
	padding: 0 !important;
}

/* Packages container: display: inline-block → block */
#fs_pricing_app .fs-section--packages {
	display: block !important;
}

/* Sub-sections inside plans: zero margins except where we set spacing below */
#fs_pricing_app .fs-app-main .fs-section--plans-and-pricing > .fs-section:not( .fs-section--custom-implementation ):not( .fs-section--money-back-guarantee ):not( .fs-section--badges ) {
	margin: 0 !important;
}

/* Package card: fixed 315px width, inline-block, border-bottom */
#fs_pricing_app .fs-package {
	display: flex !important;
	flex-direction: column !important;
	width: auto !important;
	border-bottom: none !important;
	border-left: none !important;
	border-right: none !important;
}

/* Plan title: text-transform: uppercase, grey background */
#fs_pricing_app .fs-package .fs-plan-title {
	text-transform: none !important;
	background: transparent !important;
	border: none !important;
	padding: 0 !important;
	margin: 0 0 4px !important;
}

/* Most Popular: Freemius hides it (display: none) on non-featured plans */
#fs_pricing_app .fs-package .fs-most-popular {
	display: block !important;
}

/* Upgrade button container side padding: 0 13px */
#fs_pricing_app .fs-package .fs-upgrade-button-container {
	padding: 0 !important;
}

/* Button base: text-transform: uppercase; font-size: 18px */
#fs_pricing_app .fs-button {
	text-transform: none !important;
	font-size: 14px !important;
}

/* Support-and-features block spacing */
#fs_pricing_app .fs-package .fs-support-and-main-features {
	margin: 0 !important;
	padding: 0 !important;
}

/* Feature list left margin: margin-left: 13px */
#fs_pricing_app .fs-package .fs-plan-features {
	margin-left: 0 !important;
}

/* FAQ section background */
#fs_pricing_app .fs-section--faq {
	background: transparent !important;
}

/* FAQ 2-column layout → single column */
#fs_pricing_app .fs-section--faq .fs-section--faq-items {
	columns: unset !important;
	column-gap: 0 !important;
	max-width: none !important;
	text-align: left !important;
	margin: 0 !important;
}

/* FAQ item: display: inline-block breaks flow */
#fs_pricing_app .fs-section--faq-item {
	display: block !important;
	width: auto !important;
	overflow: visible !important;
}

/* FAQ question: dark background card */
#fs_pricing_app .fs-section--faq-item h3 {
	background: transparent !important;
	color: var( --fs-text ) !important;
	padding: 0 !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	border: none !important;
	border-radius: 0 !important;
}

/* FAQ answer: white background card with 15px padding */
#fs_pricing_app .fs-section--faq-item p {
	background: transparent !important;
	padding: 0 !important;
	font-size: 13px !important;
	line-height: 1.65 !important;
	border: none !important;
	border-radius: 0 !important;
}

/* Section header (FAQ "Frequently Asked Questions") */
#fs_pricing_app .fs-app-main > .fs-section > header {
	margin: 0 !important;
}

#fs_pricing_app .fs-app-main > .fs-section > header h2 {
	font-size: 22px !important;
}

#fs_pricing_wrapper {
	display: flex;
	justify-content: center;
	width: 100% !important;
	padding: 0;
}

#fs_pricing_app {
	box-sizing: border-box;
	width: 100%;
	max-width: 1100px;
	padding: 40px 24px 60px;
}

/* ── App header ──────────────────────────────────────────────────────── */

#fs_pricing .fs-app-header {
	display: flex;
	flex-direction: column;
	gap: 16px;
	align-items: center;
	margin-bottom: 40px;
	text-align: center;
}

#fs_pricing .fs-page-title {
	order: 2;
}

#fs_pricing .fs-page-title h1 {
	padding: 0 !important;
	margin: 0 0 6px !important;
	font-size: 11px !important;
	font-weight: 600 !important;
	line-height: 1;
	color: var( --fs-brand ) !important;
	letter-spacing: .07em;
	text-transform: uppercase !important;
	background: transparent !important;
}

#fs_pricing .fs-page-title h3 {
	padding: 0 !important;
	margin: 0 !important;
	font-size: 15px !important;
	font-weight: 400 !important;
	color: var( --fs-text-2 ) !important;
	background: transparent !important;
}

#fs_pricing .fs-plugin-title-and-logo {
	display: flex;
	flex-direction: column;
	gap: 12px;
	align-items: center;
	order: 1;
}

#fs_pricing .fs-plugin-title-and-logo h1 {
	display: none;
}

#fs_pricing .fs-plugin-logo {
	width: 72px;
	height: 72px;
	border-radius: var( --fs-radius-lg );
	box-shadow: var( --fs-shadow-card );
}

/* ── Billing cycle tabs ───────────────────────────────────────────────── */

#fs_pricing .fs-section--billing-cycles {
	display: flex;
	justify-content: center;
	margin-bottom: 32px;
}

#fs_pricing .fs-billing-cycles {
	display: inline-flex;
	gap: 2px;
	padding: 3px;
	margin: 0;
	list-style: none;
	background: var( --fs-surface );
	border: 1px solid var( --fs-border-subtle );
	border-radius: var( --fs-radius-full );
	box-shadow: var( --fs-shadow-xs );
}

#fs_pricing .fs-billing-cycles li {
	padding: 6px 18px;
	margin: 0;
	font-size: 13px;
	font-weight: 500;
	color: var( --fs-text-2 );
	cursor: pointer;
	border-radius: var( --fs-radius-full );
	transition: background var( --fs-duration ) var( --fs-ease ),
	            color var( --fs-duration ) var( --fs-ease );
}

#fs_pricing .fs-billing-cycles li:hover {
	color: var( --fs-text );
	background: var( --fs-surface-hover );
}

#fs_pricing .fs-billing-cycles li.fs-selected-billing-cycle {
	color: #fff;
	background: var( --fs-brand );
}

#fs_pricing .fs-billing-cycles li.fs-selected-billing-cycle:hover {
	background: var( --fs-brand-dark );
}

#fs_pricing .fs-billing-cycles li span {
	font-size: 11px;
	opacity: .8;
}

/* ── Package tab navigation ──────────────────────────────────────────── */

#fs_pricing .fs-packages-nav {
	width: 100% !important;
	overflow: hidden;
	margin-top: 20px !important;
}

#fs_pricing .fs-packages-tab {
	display: flex;
	gap: 8px;
	justify-content: center;
	padding: 0;
	margin: 0 0 24px;
	list-style: none;
}

#fs_pricing .fs-package-tab a {
	display: block;
	padding: 5px 16px;
	font-size: 12px;
	font-weight: 500;
	color: var( --fs-text-2 );
	text-decoration: none;
	border: 1.5px solid var( --fs-border );
	border-radius: var( --fs-radius-full );
	transition: border-color var( --fs-duration ) var( --fs-ease ),
	            color var( --fs-duration ) var( --fs-ease ),
	            background var( --fs-duration ) var( --fs-ease );
}

#fs_pricing .fs-package-tab a:hover {
	color: var( --fs-text-brand );
	background: var( --fs-surface-hover );
	border-color: var( --fs-brand-border );
}

#fs_pricing .fs-package-tab--selected a {
	color: var( --fs-text-brand );
	background: var( --fs-brand-soft );
	border-color: var( --fs-brand );
}

/* ── Plan cards ──────────────────────────────────────────────────────── */

#fs_pricing .fs-packages {
	display: flex;
	gap: 16px;
	padding: 4px;
	margin: 0;
	list-style: none;
}

#fs_pricing .fs-package {
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 0;
	overflow: visible;
	background: var( --fs-surface-card );
	border-radius: var( --fs-radius-xl );
	box-shadow: var( --fs-shadow-card );
	transition: box-shadow var( --fs-duration ) var( --fs-ease ),
	            transform var( --fs-duration ) var( --fs-ease );
}

#fs_pricing .fs-package:hover {
	box-shadow: var( --fs-shadow-card-hover );
	transform: translateY( -2px );
}

/* Most Popular badge */
#fs_pricing .fs-most-popular {
	padding: 6px 0;
	text-align: center;
	background: var( --fs-brand-gradient );
	border-radius: var( --fs-radius-xl ) var( --fs-radius-xl ) 0 0;
}

#fs_pricing .fs-most-popular h4 {
	padding: 0;
	margin: 0;
	font-size: 11px;
	font-weight: 600;
	color: #fff;
	text-transform: uppercase;
	letter-spacing: .06em;
}

#fs_pricing .fs-package-content {
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: 24px;
}

/* Plan name */
#fs_pricing .fs-plan-title {
	padding: 0;
	margin: 0 0 4px;
	font-size: 20px;
	font-weight: 700;
	color: var( --fs-text );
}

#fs_pricing .fs-plan-description {
	min-height: 0;
	padding: 0;
	margin: 0 0 16px;
	font-size: 13px;
	font-weight: 400;
	color: var( --fs-text-3 );
}

/* Price display */
#fs_pricing .fs-placeholder {
	display: none;
}

#fs_pricing .fs-selected-pricing-amount {
	display: flex;
	gap: 1px;
	align-items: flex-start;
	margin-bottom: 4px;
	line-height: 1;
	color: var( --fs-text );
}

#fs_pricing .fs-currency-symbol {
	margin-top: 6px;
	font-size: 20px;
	font-weight: 600;
	color: var( --fs-text-2 );
}

#fs_pricing .fs-selected-pricing-amount-integer {
	font-size: 48px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: -.03em;
}

#fs_pricing .fs-selected-pricing-amount-fraction-container {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	margin-top: 8px;
}

#fs_pricing .fs-selected-pricing-amount-fraction {
	font-size: 18px;
	font-weight: 600;
	color: var( --fs-text-2 );
}

#fs_pricing .fs-selected-pricing-amount-cycle {
	font-size: 12px;
	font-weight: 400;
	color: var( --fs-text-3 );
}

#fs_pricing .fs-selected-pricing-cycle {
	margin-bottom: 4px;
	font-size: 12px;
	font-weight: 400;
	color: var( --fs-text-3 );
}

#fs_pricing .fs-selected-pricing-license-quantity {
	display: flex;
	gap: 4px;
	align-items: center;
	margin-bottom: 20px;
	font-size: 13px;
	font-weight: 500;
	color: var( --fs-text-2 );
}

/* Support line */
#fs_pricing .fs-support-and-main-features {
	margin-bottom: 16px;
}

#fs_pricing .fs-plan-support {
	display: flex;
	gap: 6px;
	align-items: center;
	margin-bottom: 0;
	font-size: 12px;
	font-weight: 600;
	color: var( --fs-text-brand );
}

#fs_pricing .fs-plan-support::before {
	display: inline-block;
	flex-shrink: 0;
	width: 6px;
	height: 6px;
	content: "";
	background: var( --fs-brand );
	border-radius: 50%;
}

/* Upgrade button */
#fs_pricing .fs-upgrade-button-container {
	margin-bottom: 24px;
}

#fs_pricing .fs-upgrade-button {
	width: 100%;
	height: 42px !important;
	padding: 0 20px !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	line-height: 40px !important;
	color: #fff !important;
	letter-spacing: -.01em;
	cursor: pointer;
	background: var( --fs-brand ) !important;
	border: 1.5px solid var( --fs-brand-dark ) !important;
	border-radius: var( --fs-radius-md ) !important;
	box-shadow: var( --fs-shadow-sm );
	transition: background var( --fs-duration ) var( --fs-ease ),
	            box-shadow var( --fs-duration ) var( --fs-ease ),
	            transform var( --fs-duration ) var( --fs-ease ) !important;
}

#fs_pricing .fs-upgrade-button:hover,
#fs_pricing .fs-upgrade-button:focus {
	background: var( --fs-brand-dark ) !important;
	border-color: var( --fs-brand-darker ) !important;
	box-shadow: 0 4px 12px rgb( 112 71 235 / .30 ) !important;
	transform: translateY( -1px );
}

#fs_pricing .fs-upgrade-button:active {
	transform: translateY( 0 );
}

/* Feature list */
#fs_pricing .fs-plan-features {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 20px 0 0;
	margin: 0;
	list-style: none;
	border-top: 1px solid var( --fs-border-subtle );
}

#fs_pricing .fs-plan-features li {
	display: flex !important;
	gap: 10px;
	align-items: flex-start;
	padding: 0 !important;
	margin: 0 !important;
	margin-bottom: 0 !important;
}

#fs_pricing .fs-plan-features li .fs-icon {
	flex-shrink: 0;
	margin-top: 1px;
	line-height: 1;
}

#fs_pricing .fs-plan-features li .fs-icon svg {
	width: 14px;
	height: 14px;
	color: var( --fs-brand );
	fill: var( --fs-brand );
}

#fs_pricing .fs-feature-title {
	font-size: 13px;
	line-height: 1.45;
	color: var( --fs-text-2 );
}

/* ── Package prev/next nav ───────────────────────────────────────────── */

#fs_pricing .fs-prev-package,
#fs_pricing .fs-next-package {
	display: flex;
	align-items: center;
}

#fs_pricing .fs-prev-package .fs-icon,
#fs_pricing .fs-next-package .fs-icon {
	display: flex;
	width: 32px;
	height: 32px;
	padding: 8px;
	color: var( --fs-text-2 );
	cursor: pointer;
	background: var( --fs-surface );
	border: 1px solid var( --fs-border );
	border-radius: 50%;
	box-shadow: var( --fs-shadow-sm );
}

/* ── Custom implementation band ─────────────────────────────────────── */

#fs_pricing .fs-section--custom-implementation {
	padding: 24px 28px !important;
	margin-top: 32px !important;
	text-align: center;
	background: var( --fs-surface-overlay ) !important;
	border: 1px solid var( --fs-brand-border ) !important;
	border-radius: var( --fs-radius-lg ) !important;
}

#fs_pricing .fs-section--custom-implementation h2 {
	padding: 0;
	margin: 0 0 8px;
	font-size: 17px;
	font-weight: 600;
	color: var( --fs-text );
}

#fs_pricing .fs-section--custom-implementation p {
	margin: 0;
	font-size: 14px;
	color: var( --fs-text-2 );
}

#fs_pricing .fs-section--custom-implementation a {
	font-weight: 500;
	color: var( --fs-text-brand );
	text-decoration: underline;
}

/* ── Money back guarantee ────────────────────────────────────────────── */

#fs_pricing .fs-section--money-back-guarantee {
	display: flex !important;
	flex-direction: column;
	gap: 12px;
	align-items: center;
	padding: 28px !important;
	margin-top: 16px !important;
	text-align: center;
	background: var( --fs-surface ) !important;
	border: 1px solid var( --fs-border-subtle ) !important;
	border-radius: var( --fs-radius-lg ) !important;
	box-shadow: var( --fs-shadow-xs ) !important;
}

#fs_pricing .fs-money-back-guarantee-title {
	padding: 0;
	margin: 0;
	font-size: 18px;
	font-weight: 700;
	color: var( --fs-text );
}

#fs_pricing .fs-money-back-guarantee-message {
	max-width: 600px;
	margin: 0;
	font-size: 13px;
	line-height: 1.65;
	color: var( --fs-text-2 );
}

#fs_pricing .fs-section--money-back-guarantee .fs-button {
	padding: 6px 16px;
	font-size: 12px;
	font-weight: 600;
	color: var( --fs-text-brand );
	cursor: pointer;
	background: transparent;
	border: 1.5px solid var( --fs-brand );
	border-radius: var( --fs-radius-md );
	transition: background var( --fs-duration ) var( --fs-ease );
}

#fs_pricing .fs-section--money-back-guarantee .fs-button:hover {
	background: var( --fs-surface-hover );
}

#fs_pricing .fs-section--money-back-guarantee img {
	position: absolute !important;
	top: 50% !important;
	right: 28px !important;
	transform: translateY( -50% );
	width: auto;
	height: 72px;
	opacity: .5;
	filter: grayscale( 30% );
}

/* ── Badges ──────────────────────────────────────────────────────────── */

#fs_pricing_app .fs-section--badges,
#fs_pricing .fs-section--badges {
	padding: 0 !important;
	margin-top: 32px !important;
}

#fs_pricing .fs-badges {
	display: flex !important;
	flex-wrap: wrap;
	gap: 24px 32px;
	align-items: center;
	justify-content: center;
	padding: 20px 32px !important;
	margin: 0 auto !important;
	list-style: none;
	max-width: 800px;
	background: var( --fs-surface );
	border: 1px solid var( --fs-border-card );
	border-radius: var( --fs-radius-lg );
	box-shadow: var( --fs-shadow-sm );
}

#fs_pricing .fs-badges__item {
	display: flex;
	align-items: center;
	justify-content: center;
}

#fs_pricing .fs-badges__item a {
	display: flex;
	align-items: center;
	padding: 0 !important;
}

#fs_pricing .fs-badges__item img {
	display: block;
	width: auto;
	height: auto;
	max-height: 44px;
	max-width: 160px;
	object-fit: contain;
	opacity: .7;
	filter: grayscale( 30% );
	transition:
		opacity var( --fs-duration ) var( --fs-ease ),
		filter var( --fs-duration ) var( --fs-ease );
}

#fs_pricing .fs-badges__item:hover img {
	opacity: 1;
	filter: grayscale( 0% );
}

/* Freemius payment badge is wider — let it breathe */
#fs_pricing .fs-badges__item:first-child img {
	max-height: 36px;
	max-width: 200px;
}

/* ── FAQ section ─────────────────────────────────────────────────────── */

#fs_pricing_app .fs-section--faq,
#fs_pricing .fs-section--faq {
	margin-top: 56px !important;
	background: transparent !important;
}

/* Section heading */
#fs_pricing .fs-section--faq .fs-section-header,
#fs_pricing .fs-section-header {
	margin: 0 0 32px !important;
	padding: 0 !important;
	text-align: center;
	background: transparent !important;
}

/* specificity (1,3,1) beats SDK's (1,2,2) for header h2 */
#fs_pricing_app .fs-app-main .fs-section--faq .fs-section-header h2,
#fs_pricing .fs-section--faq .fs-section-header h2,
#fs_pricing .fs-section-header h2 {
	padding: 0 !important;
	margin: 0 !important;
	font-size: 26px !important;
	font-weight: 700 !important;
	color: var( --fs-text ) !important;
	letter-spacing: -.025em;
	line-height: 1.25;
}

/* FAQ items wrapper — white card */
#fs_pricing_app .fs-section--faq .fs-section--faq-items,
#fs_pricing .fs-section--faq-items {
	display: flex !important;
	flex-direction: column;
	gap: 0 !important;
	max-width: 760px;
	margin: 0 auto !important;
	padding: 0 !important;
	background: var( --fs-surface );
	border: 1px solid var( --fs-border-card );
	border-radius: var( --fs-radius-lg );
	box-shadow: var( --fs-shadow-sm );
	overflow: hidden;
}

/* Individual FAQ item */
#fs_pricing_app .fs-section--faq-item,
#fs_pricing .fs-section--faq-item {
	display: block !important;
	width: auto !important;
	padding: 20px 28px !important;
	border-bottom: 1px solid var( --fs-border-subtle ) !important;
	border-top: none !important;
	border-left: none !important;
	border-right: none !important;
	background: transparent !important;
	transition: background var( --fs-duration ) var( --fs-ease );
}

#fs_pricing_app .fs-section--faq-item:last-child,
#fs_pricing .fs-section--faq-item:last-child {
	border-bottom: none !important;
}

#fs_pricing .fs-section--faq-item:hover {
	background: var( --fs-surface-subtle ) !important;
}

/* Question */
#fs_pricing_app .fs-section--faq-item h3,
#fs_pricing .fs-section--faq-item h3 {
	padding: 0 !important;
	margin: 0 0 8px !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	color: var( --fs-text ) !important;
	line-height: 1.4;
	background: transparent !important;
	text-transform: none !important;
	border: none !important;
	border-radius: 0 !important;
}

/* Answer */
#fs_pricing_app .fs-section--faq-item p,
#fs_pricing .fs-section--faq-item p {
	margin: 0 !important;
	padding: 0 !important;
	font-size: 13px !important;
	line-height: 1.7;
	color: var( --fs-text-2 ) !important;
	background: transparent !important;
	border: none !important;
	border-radius: 0 !important;
}

#fs_pricing .fs-section--faq-item a {
	color: var( --fs-text-brand );
	text-decoration: underline;
}

/* ── Tooltip ─────────────────────────────────────────────────────────── */

/* Tooltip trigger — the clickable "?" icon next to plan counts */
#fs_pricing .fs-tooltip {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	padding: 0;
	background: var( --fs-brand ) !important;
	border-radius: var( --fs-radius-full );
	color: #fff;
	cursor: pointer;
	vertical-align: middle;
}

#fs_pricing .fs-tooltip .fs-icon svg {
	width: 10px;
	height: 10px;
	fill: #fff;
	color: #fff;
}

/* Tooltip popup message */
#fs_pricing .fs-tooltip-message {
	padding: 8px 10px;
	font-size: 12px;
	font-weight: 500;
	line-height: 1.4;
	color: #e2d9ff;
	background: #1e1040;
	border-radius: var( --fs-radius-md );
	box-shadow: 0 4px 12px rgb( 0 0 0 / .20 );
}

/* ── Responsive ──────────────────────────────────────────────────────── */

@media screen and ( max-width: 960px ) {

	#fs_pricing_app {
		padding: 24px 16px 48px;
	}

	#fs_pricing .fs-packages {
		flex-direction: column;
		max-width: 480px;
		margin: 0 auto;
	}
}

@media screen and ( max-width: 600px ) {

	#fs_pricing .fs-page-title h1 {
		font-size: 22px;
	}

	#fs_pricing .fs-packages-tab {
		flex-direction: column;
		align-items: center;
	}
}