/*
 * Salesman Blocks — Frontend Styles
 * Plugin: salesman-blocks v1.0.0
 * All class names are namespaced under .salesman-* to avoid Bootstrap conflicts.
 * Brand: gradient #de4b97 → #e5bc65 | dark #2D2D2D | muted #54536C
 */

/* ─── CTA Button ───────────────────────────────────────────────────────────── */
/*
 * Salesman AI blue: #1b56db (base) → #0d3db3 (deep)
 * Hover deepens to #0d3db3 solid.
 * Full-width modifier via .salesman-cta-btn--full
 */

.salesman-cta-btn-wrap {
	margin: 28px 0;
	line-height: 1;
}
.salesman-cta-btn-wrap--left   { text-align: left;   }
.salesman-cta-btn-wrap--center { text-align: center; }
.salesman-cta-btn-wrap--right  { text-align: right;  }

.salesman-cta-btn {
	display: inline-block;
	position: relative;
	z-index: 0;
	background: linear-gradient(161deg, #1A2B96 10.11%, #1E30A0 36.29%, #2C3FBC 65.34%, #4356D2 87.44%);
	color: #ffffff !important;
	padding: 16px 40px;
	border-radius: var(--btn-br, 20px);
	font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 20px;
	font-weight: 600;
	line-height: 1.21;
	letter-spacing: 0.01em;
	text-decoration: none !important;
	text-align: center;
	transition: background 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
	border: none;
	cursor: pointer;
	white-space: nowrap;
	max-width: 100%;
	box-sizing: border-box;
	/* box-shadow: 0 4px 18px rgba(26, 43, 150, 0.36); */
}


/* Full-width modifier */
.salesman-cta-btn--full {
	display: block;
	width: 100%;
	white-space: normal;
}

.salesman-cta-btn:hover {
	background: linear-gradient(90deg, #141f78 0%, #2a3aa0 50.606%, #2c3ea4 100%);
	box-shadow: 0 6px 24px rgba(26, 43, 150, 0.48);
	transform: translateY(-2px);
	color: #ffffff !important;
	text-decoration: none !important;
}
.salesman-cta-btn:active {
	background: linear-gradient(90deg, #0f1760 0%, #1f2d82 50.606%, #213086 100%);
	transform: translateY(0);
	box-shadow: 0 2px 10px rgba(26, 43, 150, 0.30);
}
/* Keyboard focus — clearly visible ring */
.salesman-cta-btn:focus-visible {
	outline: 3px solid rgba(55, 74, 192, 0.7);
	outline-offset: 4px;
	text-decoration: none !important;
}
/* Fallback focus for browsers without :focus-visible */
.salesman-cta-btn:focus:not(:focus-visible) {
	outline: none;
}

/* ─── Core Button — Gradient Style ────────────────────────────────────────── */
/*
 * Custom "Gradient" style for the native WordPress core/button block.
 * WordPress applies .is-style-salesman-gradient to the .wp-block-button wrapper.
 * Mirrors the Salesman AI branded gradient from .salesman-cta-btn above.
 */

.wp-block-button.is-style-salesman-gradient .wp-block-button__link {
	background: linear-gradient(161deg, #1A2B96 10.11%, #1E30A0 36.29%, #2C3FBC 65.34%, #4356D2 87.44%);
	color: #ffffff !important;
	border: none;
	border-radius: 20px;
	padding: 16px 40px;
	font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 20px;
	font-weight: 600;
	line-height: 1.21;
	letter-spacing: 0.01em;
	text-decoration: none !important;
	transition: background 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
}

.wp-block-button.is-style-salesman-gradient .wp-block-button__link:hover {
	background: linear-gradient(90deg, #141f78 0%, #2a3aa0 50.606%, #2c3ea4 100%);
	box-shadow: 0 6px 24px rgba(26, 43, 150, 0.48);
	transform: translateY(-2px);
	color: #ffffff !important;
	text-decoration: none !important;
}

.wp-block-button.is-style-salesman-gradient .wp-block-button__link:active {
	background: linear-gradient(90deg, #0f1760 0%, #1f2d82 50.606%, #213086 100%);
	transform: translateY(0);
	box-shadow: 0 2px 10px rgba(26, 43, 150, 0.30);
}

.wp-block-button.is-style-salesman-gradient .wp-block-button__link:focus-visible {
	outline: 3px solid rgba(55, 74, 192, 0.7);
	outline-offset: 4px;
	text-decoration: none !important;
}

/* Responsive */
@media (max-width: 768px) {
	.wp-block-button.is-style-salesman-gradient .wp-block-button__link {
		font-size: 17px;
		padding: 15px 28px;
	}
}

/* ─── Bullet Section ───────────────────────────────────────────────────────── */

.salesman-bullet-section {
	margin: 40px 0;
}

/* Large bold section heading — e.g. "1.Bulletin Points" */
.salesman-bullet-section__title {
	font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 26px;
	font-weight: 800;
	color: #1a1a2e;
	margin: 0 0 20px;
	padding: 0;
	line-height: 1.25;
	letter-spacing: -0.3px;
}

/* Plain list — no card, no border, no background, no shadow */
.salesman-bullet-section__list {
	/* intentionally bare — visual weight comes from typography only */
}

/* ── Individual item — column: header row on top, description below ── */
.salesman-bullet-item {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin-bottom: 32px;
}
.salesman-bullet-item:last-child {
	margin-bottom: 0;
}

/* ── Icon + title on the same row, perfectly centred ── */
.salesman-bullet-item__header {
	display: flex;
	align-items: center;
	gap: 12px;
}

/* ── Logo icon — plain image, no background ── */
.salesman-bullet-item__icon {
	flex-shrink: 0;
	width: 28px;
	height: 28px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.salesman-bullet-item__icon img {
	width: 28px;
	height: 28px;
	object-fit: contain;
	display: block;
}

/* Item title — solid brand blue-purple, bold */
.salesman-bullet-item__title {
	font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 16px;
	font-weight: 700;
	color: #5b6af0;
	background: none;
	-webkit-background-clip: unset;
	-webkit-text-fill-color: unset;
	background-clip: unset;
	margin: 0;
	padding: 0;
	line-height: 1.4;
}

/* Supporting description — indented past icon so it aligns under the title */
.salesman-bullet-item__text {
	font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 15px;
	color: #1a1a2e;
	margin: 0;
	padding-left: 40px; /* 28px icon + 12px gap */
	line-height: 1.65;
}

/* ─── Gutenberg Bullet Block — Logo + Gradient Label ─────────────────────── */
/*
 * Custom block: salesman-blocks/bullet-list (parent) + bullet-item (child)
 * Gradient: same as .salesman-gradient-text in theme style.css
 */

.salesman-bullet-list {
	margin: 24px 0;
}

.salesman-bullet-block {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0 12px;
	margin-bottom: 16px;
}

.salesman-bullet-block__icon {
	flex-shrink: 0;
	width: 28px;
	height: 28px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.salesman-bullet-block__icon img {
	width: 22px;
	height: 22px;
	object-fit: contain;
	display: block;
	transform: rotate(180deg) scaleX(-1);
}

.salesman-bullet-block__label {
	flex: 1;
	min-width: 0;
	font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.4;
	margin: 0;
	padding: 0;
	background: linear-gradient(91deg, #4242C6 -0.07%, #8282F6 39.9%, #0E24B3 87.16%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}
/* Ensure gradient text flows into inline children (bold, italic, links) */
.salesman-bullet-block__label strong,
.salesman-bullet-block__label b,
.salesman-bullet-block__label em,
.salesman-bullet-block__label i,
.salesman-bullet-block__label a {
	background: inherit;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}

/* Description: full width, starts at icon's left edge */
.salesman-bullet-block__text {
	flex-basis: 100%;
	font-family: Inter ;
	font-size: 15px;
	color: #1a1a2e;
	margin: 4px 0 0 10px;
	padding: 0;
	line-height: 1.65;
}
/* Empty description = no extra spacing */
.salesman-bullet-block__text:empty {
	display: none;
	margin: 0;
}

@media (max-width: 768px) {
	.salesman-bullet-block__icon {
		width: 24px;
		height: 24px;
	}
	.salesman-bullet-block__icon img {
		width: 18px;
		height: 18px;
	}
	.salesman-bullet-block__label {
		font-size: 15px;
	}
	.salesman-bullet-block__text {
		font-size: 14px;
	}
}

/* ─── Gutenberg Banner CTA Block ──────────────────────────────────────────── */
/*
 * Custom block: salesman-blocks/banner-cta
 * Dark gradient card with gradient heading, white description, and gradient CTA
 * button. Matches Figma node 103:2.
 */

.salesman-banner-cta {
	position: relative;
	max-width: 728px;
	margin: 40px auto;
	padding: 52px 40px;
	border-radius: 36px;
	background: linear-gradient(174deg, #0D032A 0%, #1A0536 34%, #0D1C82 71%, #4356D2 100%);
	text-align: center;
	overflow: hidden;
	box-sizing: border-box;
}

/* Container alignment modifiers */
.salesman-banner-cta--left   { margin-left: 0; margin-right: auto; }
.salesman-banner-cta--center { margin-left: auto; margin-right: auto; }
.salesman-banner-cta--right  { margin-left: auto; margin-right: 0; }

/* Content wrapper */
.salesman-banner-cta__content {
	position: relative;
	z-index: 1;
	max-width: 574px;
	margin: 0 auto;
}

/* Heading — gradient text (light blue) */
.salesman-banner-cta__heading {
	font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 36px;
	font-weight: 600;
	line-height: 1.17;
	background: linear-gradient(90deg, #DEE6FA 0%, #CAD7FB 51%, #8A9EF3 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	margin: 0 0 16px;
	padding: 0;
	border: none;
}

/* Description — white */
.salesman-banner-cta .salesman-banner-cta__content p,
.salesman-banner-cta .salesman-banner-cta__desc,
.salesman-banner-cta .salesman-banner-cta__content .salesman-banner-cta__desc {
	font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 18px;
	font-weight: 400;
	color: #FFFFFF !important;
	-webkit-text-fill-color: #FFFFFF !important;
	line-height: 1.56;
	margin: 0 0 28px;
	padding: 0;
}

/* CTA button — gradient bg + gradient border (::before) + gradient text */
.salesman-banner-cta__btn {
	display: inline-block;
	position: relative;
	padding: 16px 24px;
	min-width: 300px;
	border-radius: 28px;
	background: linear-gradient(90deg, #1A2B96 0%, #374AC0 51%, #394CC4 100%);
	text-decoration: none !important;
	cursor: pointer;
	transition: transform 0.15s ease, box-shadow 0.2s ease;
	box-sizing: border-box;
	z-index: 0;
}
/* Gradient border via pseudo-element */
.salesman-banner-cta__btn::before {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: 28px;
	padding: 1px;
	background: linear-gradient(108deg, #FFFFFF 0%, #4356D2 100%);
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	mask-composite: exclude;
	pointer-events: none;
}
/* Button text — gradient */
.salesman-banner-cta__btn-text {
	font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 20px;
	font-weight: 600;
	line-height: 1.21;
	background: linear-gradient(90deg, #C2C7FF 0%, #FFFFFF 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}
.salesman-banner-cta__btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 24px rgba(26, 43, 150, 0.48);
}
.salesman-banner-cta__btn:active {
	transform: translateY(0);
}
.salesman-banner-cta__btn:focus-visible {
	outline: 3px solid rgba(138, 158, 243, 0.7);
	outline-offset: 4px;
}
.salesman-banner-cta__btn-wrap {
	text-align: center;
}

/* Responsive — tablet */
@media (max-width: 1024px) {
	.salesman-banner-cta {
		padding: 44px 32px;
	}
	.salesman-banner-cta__heading {
		font-size: 30px;
	}
}
/* Responsive — mobile */
@media (max-width: 768px) {
	.salesman-banner-cta {
		padding: 36px 20px;
		border-radius: 28px;
		margin: 28px auto;
	}
	.salesman-banner-cta__heading {
		font-size: 24px;
	}
	.salesman-banner-cta__desc {
		font-size: 16px;
	}
	.salesman-banner-cta__btn {
		min-width: unset;
		padding: 14px 20px;
	}
	.salesman-banner-cta__btn-text {
		font-size: 17px;
	}
}

/* ─── Core Table — Salesman Card Style ────────────────────────────────────── */
/*
 * Custom "Salesman Card" style for the native WordPress core/table block.
 * Rounded card with gradient header row. Matches Figma node 98:913.
 *
 * Border strategy (single-direction to prevent doubling):
 *   Outer border  → wrapper only (border + border-radius + overflow:hidden)
 *   Vertical grid → border-left on 2nd+ columns (th + th, td + td)
 *   Horiz. grid   → border-top on all tbody td (1st row = header separator)
 *   Table element  → border: none
 *   Cells default  → border: none
 */

/* ── Wrapper — sole source of the outer border ── */
.wp-block-table.is-style-salesman-card {
	max-width: 729px;
	border-radius: 36px;
	border: 1px solid #C4C3C3;
	background: #F8F7F6;
	overflow: hidden;
	margin: 40px 0;
}

/* ── Table — no border, no spacing ── */
.wp-block-table.is-style-salesman-card table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	margin: 0;
	border: none !important;
}

/* ── All cells — reset borders ── */
.wp-block-table.is-style-salesman-card th,
.wp-block-table.is-style-salesman-card td {
	border: none !important;
}

/* ── Header ── */
.wp-block-table.is-style-salesman-card thead tr {
	background: linear-gradient(143deg, rgba(240, 242, 255, 0.84) 0%, rgba(185, 196, 255, 0.5) 46%, rgba(240, 242, 255, 1) 98%);
}
.wp-block-table.is-style-salesman-card th {
	font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 20px;
	font-weight: 600;
	color: #100F0F;
	text-align: left;
	padding: 26px 32px;
}

/* ── Body cells ── */
.wp-block-table.is-style-salesman-card td {
	font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 18px;
	font-weight: 400;
	color: #404040;
	padding: 24px 32px;
	vertical-align: top;
	line-height: 1.33;
}

/* ── Vertical dividers — border-left on 2nd+ columns ── */
.wp-block-table.is-style-salesman-card th + th,
.wp-block-table.is-style-salesman-card td + td {
	border-left: 1px solid #C4C3C3 !important;
}

/* ── Horizontal dividers — border-top on all tbody cells ── */
.wp-block-table.is-style-salesman-card tbody td {
	border-top: 1px solid #C4C3C3 !important;
}
.wp-block-table.is-style-salesman-card tbody tr:first-child td {
	border-top: none !important;
}

/* ── Alternating row stripes ── */
.wp-block-table.is-style-salesman-card tbody tr:nth-child(odd) td {
	background: #F8F7F6;
}
.wp-block-table.is-style-salesman-card tbody tr:nth-child(even) td {
	background: rgb(233, 235, 248);
}

/* ── Responsive ── */
@media (max-width: 768px) {
	.wp-block-table.is-style-salesman-card {
		border-radius: 24px;
	}
	.wp-block-table.is-style-salesman-card th {
		font-size: 16px;
		padding: 20px 20px;
	}
	.wp-block-table.is-style-salesman-card td {
		font-size: 15px;
		padding: 18px 20px;
	}
}

/* ─── CTA Banner (legacy shortcode) ──────────────────────────────────────── */

.salesman-banner {
	background: linear-gradient(135deg, #de4b97 0%, #e5bc65 100%);
	border-radius: 16px;
	padding: 52px 32px;
	text-align: center;
	margin: 40px 0;
	box-shadow: 0 8px 32px rgba(222, 75, 151, 0.22);
	box-sizing: border-box;
}
.salesman-banner__title {
	font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 28px;
	font-weight: 700;
	color: #ffffff;
	margin: 0 0 12px;
	padding: 0;
	line-height: 1.2;
	border: none;
	background: transparent;
}
.salesman-banner__text {
	font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 16px;
	color: rgba(255, 255, 255, 0.92);
	margin: 0 0 28px;
	padding: 0;
	line-height: 1.6;
	max-width: 560px;
	margin-left: auto;
	margin-right: auto;
}
/* margin shorthand conflict fix — reset via explicit properties */
.salesman-banner__text {
	margin-top: 0;
	margin-bottom: 28px;
}
.salesman-banner__btn {
	display: inline-block;
	background: #ffffff;
	color: #de4b97 !important;
	padding: 14px 32px;
	border-radius: 32px;
	font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 15px;
	font-weight: 700;
	text-decoration: none !important;
	transition: opacity 0.2s ease, transform 0.15s ease;
	white-space: nowrap;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}
.salesman-banner__btn:hover,
.salesman-banner__btn:focus {
	opacity: 0.92;
	transform: translateY(-1px);
	color: #de4b97 !important;
	text-decoration: none !important;
}

/* ─── Callout / Info Block ─────────────────────────────────────────────────── */

.salesman-callout {
	border-radius: 10px;
	padding: 20px 24px;
	margin: 28px 0;
	border-left: 4px solid #de4b97;
	background: #fdf4f8;
	box-sizing: border-box;
}
.salesman-callout--tip {
	border-left-color: #e5bc65;
	background: #fdf9ef;
}
.salesman-callout--warning {
	border-left-color: #F8686F;
	background: #fff5f5;
}

.salesman-callout__label {
	font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: #de4b97;
	margin: 0 0 6px;
	padding: 0;
	line-height: 1.4;
}
.salesman-callout--tip .salesman-callout__label {
	color: #9e7018;
}
.salesman-callout--warning .salesman-callout__label {
	color: #c8303a;
}
.salesman-callout__title {
	font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 15px;
	font-weight: 600;
	color: #2D2D2D;
	margin: 0 0 6px;
	padding: 0;
	line-height: 1.4;
}
.salesman-callout__text {
	font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 14px;
	color: #54536C;
	margin: 0;
	padding: 0;
	line-height: 1.65;
}

/* ─── Table Wrapper ────────────────────────────────────────────────────────── */

.salesman-table-wrap {
	width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border-radius: 12px;
	border: 1px solid #eeedf2;
	margin: 28px 0;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
	box-sizing: border-box;
}
/* Branded table header when the wrapped table is a plain HTML table */
.salesman-table-wrap table {
	width: 100%;
	min-width: 480px;
	border-collapse: collapse;
	margin: 0 !important;
}
.salesman-table-wrap table th {
	background: linear-gradient(90deg, #de4b97 0%, #e5bc65 100%);
	color: #ffffff !important;
	padding: 13px 16px;
	font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 13px;
	font-weight: 600;
	text-align: left;
	white-space: nowrap;
}
.salesman-table-wrap table td {
	padding: 12px 16px;
	font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 14px;
	color: #2D2D2D;
	border-bottom: 1px solid #eeedf2;
	vertical-align: top;
}
.salesman-table-wrap table tr:last-child td {
	border-bottom: none;
}
.salesman-table-wrap table tbody tr:nth-child(even) td {
	background: #fafaf9;
}

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

/* Tablet — up to 1024px */
@media (max-width: 1024px) {
	/* CTA button */
	.salesman-cta-btn {
		padding: 15px 34px;
		font-size: 18px;
	}

	/* Bullet section */
	.salesman-bullet-section__title {
		font-size: 22px;
	}
	.salesman-bullet-item {
		margin-bottom: 26px;
	}
	.salesman-bullet-item__header {
		gap: 10px;
	}
	.salesman-bullet-item__title {
		font-size: 15px;
	}

	/* Banner */
	.salesman-banner__title {
		font-size: 24px;
	}
}

/* Mobile — up to 768px */
@media (max-width: 768px) {
	/* Bullet section */
	.salesman-bullet-section {
		margin: 28px 0;
	}
	.salesman-bullet-section__title {
		font-size: 20px;
		margin-bottom: 18px;
	}
	.salesman-bullet-item {
		margin-bottom: 22px;
	}
	.salesman-bullet-item__header {
		gap: 10px;
	}
	.salesman-bullet-item__icon,
	.salesman-bullet-item__icon img {
		width: 24px;
		height: 24px;
	}
	.salesman-bullet-item__title {
		font-size: 15px;
	}
	.salesman-bullet-item__text {
		font-size: 14px;
		padding-left: 34px; /* 24px icon + 10px gap */
	}

	/* Banner */
	.salesman-banner {
		padding: 36px 20px;
		border-radius: 12px;
	}
	.salesman-banner__title {
		font-size: 22px;
	}
	.salesman-banner__text {
		font-size: 15px;
	}
	.salesman-banner__btn {
		font-size: 14px;
		padding: 12px 24px;
	}

	/* CTA button — touch-friendly height, wraps gracefully */
	.salesman-cta-btn {
		font-size: 17px;
		padding: 15px 28px;
		border-radius: 22px;
		white-space: normal;
		word-break: break-word;
	}
	.salesman-cta-btn::before {
		border-radius: 23px;
	}
	/* Full-width stays full-width on mobile */
	.salesman-cta-btn--full {
		display: block;
		width: 100%;
	}

	/* Callout */
	.salesman-callout {
		padding: 16px 18px;
	}
}

/* ─── TOC Preview Card ─────────────────────────────────────────────────────── */
/*
 * Scrollable table-of-contents card component.
 * Shortcode: [salesman_toc_card] wrapping [salesman_toc_item] children.
 * First .salesman-toc-item is highlighted via :first-child — no JS needed.
 * Palette mirrors the sidebar TOC component in style.css.
 */

.salesman-toc-card {
	width: 540px;
	max-width: calc(100vw - 32px);
	height: 710px;
	border: 1px solid #BCCAF1;
	border-radius: 36px;
	overflow: hidden;
	margin-left: auto;
	margin-right: auto;
	box-sizing: border-box;
	background: #F6F8FF;
}

/* Scrollable inner list */
.salesman-toc-card__list {
	height: 100%;
	overflow-y: scroll;
	overflow-x: hidden;
	scrollbar-width: thin;
	scrollbar-color: #C2C2C2 transparent;
	box-sizing: border-box;
}

/* Webkit custom scrollbar — slim, rounded thumb */
.salesman-toc-card__list::-webkit-scrollbar {
	width: 7px;
}
.salesman-toc-card__list::-webkit-scrollbar-track {
	background: transparent;
}
.salesman-toc-card__list::-webkit-scrollbar-thumb {
	background: #C2C2C2;
	border-radius: 10px;
}
.salesman-toc-card__list::-webkit-scrollbar-thumb:hover {
	background: #ABABAB;
}

/* Individual row */
.salesman-toc-item {
	padding: 36px 52px 36px 40px; /* extra right padding = scrollbar breathing room */
	background: #F6F8FF;
	box-sizing: border-box;
}

/* Thin divider between rows */
.salesman-toc-item + .salesman-toc-item {
	border-top: 1px solid #E8EDF8;
}

/* First / active row — soft lavender-blue highlight */
.salesman-toc-item:first-child {
	background: #E4EBFF;
}

/* Item text — shared base */
.salesman-toc-item__text {
	font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 24px;
	font-weight: 500;
	color: #262525;
	line-height: 1.45;
	text-decoration: none !important;
	display: block;
}

/* First item text — vivid blue, bolder */
.salesman-toc-item:first-child .salesman-toc-item__text {
	color: #3E57DA;
	font-weight: 700;
}

/* Link variant — subtle hover */
a.salesman-toc-item__text:hover {
	opacity: 0.72;
	text-decoration: none !important;
}

/* ─── TOC Card — Tablet ─── */
@media (max-width: 1024px) {
	.salesman-toc-card {
		height: 640px;
	}
	.salesman-toc-item {
		padding: 30px 48px 30px 36px;
	}
	.salesman-toc-item__text {
		font-size: 22px;
	}
}

/* ─── TOC Card — Mobile ─── */
@media (max-width: 768px) {
	.salesman-toc-card {
		height: 560px;
		border-radius: 28px;
	}
	.salesman-toc-item {
		padding: 24px 44px 24px 28px;
	}
	.salesman-toc-item__text {
		font-size: 18px;
	}
}

@media (max-width: 480px) {
	.salesman-toc-card {
		width: calc(100vw - 32px);
		height: 480px;
		border-radius: 24px;
	}
	.salesman-toc-item {
		padding: 20px 40px 20px 24px;
	}
	.salesman-toc-item__text {
		font-size: 16px;
	}
}

.salesmanai_blog_content_container{
	margin-top: 30px ;
}

.salesmanai_blog_content_container .container{
	padding: 0 86px;
}

@media (max-width: 768px) {
	.salesmanai_blog_content_container .container{
		padding: 0 16px;
	}
}