/**
 * TrustSignals Public Base Styles
 *
 * ALL rules are scoped under .ts-trust-block to beat theme CSS overrides.
 * Two templates: Clinical White and Authority Navy via CSS custom properties.
 *
 * @package TrustSignals
 */

/* ── Root wrapper & design tokens ─────────────────────────────────────────── */
.ts-trust-block {
	--trustsignals-accent: #1D4ED8;
	--ts-bg:       #ffffff;
	--ts-border:   #E5E7EB;
	--ts-text:     #111827;
	--ts-muted:    #6B7280;
	--ts-card-bg:  #F9FAFB;
	--ts-tab-bg:   #F3F4F6;
	--ts-radius:   10px;

	box-sizing: border-box;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	font-size: 14px;
	line-height: 1.5;
	margin: 24px 0;
	clear: both;
	background: var(--ts-bg);
	color: var(--ts-text);
	border: 1px solid var(--ts-border);
	border-radius: var(--ts-radius);
	overflow: hidden;
	box-shadow: 0 4px 20px rgba(0,0,0,0.08);
}

/* Reset box-sizing on all children */
.ts-trust-block *,
.ts-trust-block *::before,
.ts-trust-block *::after {
	box-sizing: inherit;
}

/* ── Clinical White template ───────────────────────────────────────────────── */
.ts-trust-block.ts-template-clinical-white {
	--ts-bg:      #ffffff;
	--ts-border:  #E5E7EB;
	--ts-text:    #111827;
	--ts-muted:   #6B7280;
	--ts-card-bg: #F9FAFB;
	--ts-tab-bg:  #F3F4F6;
	border-top: 4px solid var(--trustsignals-accent);
}

/* ── Authority Navy template ───────────────────────────────────────────────── */
.ts-trust-block.ts-template-authority-navy {
	--ts-bg:      #0F172A;
	--ts-border:  #1E3A5F;
	--ts-text:    #F1F5F9;
	--ts-muted:   #94A3B8;
	--ts-card-bg: #1E293B;
	--ts-tab-bg:  #162032;
	box-shadow: 0 8px 32px rgba(0,0,0,0.5);
}

/* ── Section title (small uppercase label) ─────────────────────────────────── */
.ts-trust-block .ts-component-title {
	margin: 0 0 14px;
	padding: 0;
	font-size: 11px !important;
	font-weight: 700 !important;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--ts-muted);
	border: none;
	background: none;
}

/* ── Component padding containers ─────────────────────────────────────────── */
.ts-trust-block .ts-insurance,
.ts-trust-block .ts-accreditations,
.ts-trust-block .ts-reviewer-card,
.ts-trust-block .ts-confidentiality,
.ts-trust-block .ts-admissions-detail,
.ts-trust-block .ts-statistics {
	padding: 20px 24px;
}

/* ── Status Header Strip ───────────────────────────────────────────────────── */
.ts-trust-block .ts-status-header {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 20px;
	padding: 10px 20px;
	background: rgba(0,0,0,0.03);
	border-bottom: 1px solid var(--ts-border);
	font-size: 13px;
}
.ts-trust-block.ts-template-authority-navy .ts-status-header {
	background: rgba(255,255,255,0.05);
}

.ts-trust-block .ts-status-badge {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	border-radius: 20px;
	padding: 3px 12px;
	font-weight: 700;
	font-size: 12px;
	letter-spacing: 0.02em;
	color: #fff;
}
.ts-trust-block .ts-status--open     { background: #16A34A; }
.ts-trust-block .ts-status--limited  { background: #D97706; }
.ts-trust-block .ts-status--waitlist { background: #EA580C; }
.ts-trust-block .ts-status--closed   { background: #DC2626; }

.ts-trust-block .ts-status-phone {
	color: var(--trustsignals-accent);
	font-weight: 600;
	text-decoration: none;
	font-size: 13px;
}
.ts-trust-block .ts-status-phone:hover { text-decoration: underline; }

.ts-trust-block .ts-status-confidentiality,
.ts-trust-block .ts-status-custom-signal {
	color: var(--ts-muted);
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 13px;
}

/* ── Insurance Grid ────────────────────────────────────────────────────────── */
.ts-trust-block .ts-insurance-grid {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 16px;
}

/* Insurance logo pill chip */
.ts-trust-block .ts-insurance-logo {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 6px 14px;
	border-radius: 6px;
	background: var(--ts-card-bg);
	border: 1px solid var(--ts-border);
	min-height: 34px;
	max-height: 50px;
	overflow: hidden;
}

/* Constrain actual uploaded images inside the pill */
.ts-trust-block .ts-insurance-logo img {
	max-height: 24px !important;
	max-width: 80px !important;
	width: auto !important;
	height: auto !important;
	display: block;
	object-fit: contain;
}

/* Text fallback when no logo uploaded */
.ts-trust-block .ts-insurance-name {
	font-size: 13px;
	font-weight: 600;
	color: var(--ts-text);
	white-space: nowrap;
}

/* Insurance CTA box */
.ts-trust-block .ts-insurance-cta {
	border-radius: 10px;
	padding: 14px 18px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 10px;
	background: color-mix(in srgb, var(--trustsignals-accent) 5%, transparent);
	border: 1px solid color-mix(in srgb, var(--trustsignals-accent) 25%, transparent);
}
.ts-trust-block.ts-template-authority-navy .ts-insurance-cta {
	background: rgba(255,255,255,0.05);
}
.ts-trust-block .ts-insurance-cta-label {
	margin: 0;
	font-weight: 700;
	font-size: 14px;
	color: var(--ts-text);
}
.ts-trust-block .ts-insurance-cta-sublabel {
	margin: 2px 0 0;
	font-size: 12px;
	color: var(--ts-muted);
}

/* ── Buttons ───────────────────────────────────────────────────────────────── */
.ts-trust-block .ts-btn {
	display: inline-block;
	border: none;
	border-radius: 8px;
	padding: 9px 18px;
	font-size: 13px;
	font-weight: 700;
	cursor: pointer;
	text-decoration: none;
	white-space: nowrap;
	line-height: 1;
}
.ts-trust-block .ts-btn-primary {
	background: var(--trustsignals-accent);
	color: #fff !important;
}
.ts-trust-block .ts-btn-primary:hover { filter: brightness(0.92); color: #fff !important; }

/* ── Accreditation & Licensing ─────────────────────────────────────────────── */
.ts-trust-block .ts-accreditation-seals {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 16px;
}

/* Individual seal card */
.ts-trust-block .ts-seal {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 5px;
	padding: 12px 14px;
	background: var(--ts-card-bg);
	border: 1px solid var(--ts-border);
	border-radius: 8px;
	min-width: 78px;
	text-align: center;
}

/* Uploaded logo inside seal card */
.ts-trust-block .ts-seal img {
	max-height: 40px !important;
	max-width: 60px !important;
	width: auto !important;
	height: auto !important;
	object-fit: contain;
	display: block;
}

/* Checkmark badge (text fallback, no logo) */
.ts-trust-block .ts-seal-badge {
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: color-mix(in srgb, var(--trustsignals-accent) 14%, transparent);
	border: 2px solid color-mix(in srgb, var(--trustsignals-accent) 40%, transparent);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	font-weight: 900;
	color: var(--trustsignals-accent);
}
.ts-trust-block .ts-seal-name {
	font-size: 11px;
	font-weight: 700;
	color: var(--ts-text);
}
.ts-trust-block .ts-seal-description {
	font-size: 9px;
	color: var(--ts-muted);
	line-height: 1.3;
	max-width: 72px;
}

/* License card(s) */
.ts-trust-block .ts-license-cards {
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.ts-trust-block .ts-license-card {
	padding: 12px 16px;
	background: var(--ts-card-bg);
	border: 1px solid var(--ts-border);
	border-radius: 8px;
	border-left: 3px solid var(--trustsignals-accent);
}
.ts-trust-block .ts-license-label {
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--ts-muted);
	margin-bottom: 3px;
	display: block;
}
.ts-trust-block .ts-license-type {
	font-size: 13px;
	font-weight: 600;
	color: var(--ts-text);
	display: block;
}
.ts-trust-block .ts-license-number,
.ts-trust-block .ts-license-state {
	font-size: 12px;
	color: var(--ts-muted);
}
.ts-trust-block .ts-license-verify-link {
	font-size: 12px;
	color: var(--trustsignals-accent);
	text-decoration: none;
	padding-left: 5px;
}
.ts-trust-block .ts-license-verify-link:hover { text-decoration: underline; }

/* ── Medical Reviewer Card ─────────────────────────────────────────────────── */
.ts-trust-block .ts-reviewer-card .ts-reviewer-meta {
	display: flex;
	gap: 14px;
	align-items: flex-start;
}
.ts-trust-block .ts-reviewer-info {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
	flex: 1;
}

/* Avatar circle (initials fallback) */
.ts-trust-block .ts-reviewer-photo {
	width: 56px;
	height: 56px;
	min-width: 56px;
	border-radius: 50%;
	flex-shrink: 0;
	background: linear-gradient(135deg, var(--trustsignals-accent), color-mix(in srgb, var(--trustsignals-accent) 60%, transparent));
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-weight: 800;
	font-size: 18px;
	border: 3px solid var(--ts-border);
	text-decoration: none;
}

/* Actual uploaded photo */
.ts-trust-block .ts-reviewer-img {
	width: 56px;
	height: 56px;
	min-width: 56px;
	border-radius: 50%;
	flex-shrink: 0;
	object-fit: cover;
	border: 3px solid var(--ts-border);
	display: block;
}

.ts-trust-block .ts-reviewer-name {
	font-weight: 800;
	font-size: 15px;
	color: var(--ts-text);
	display: block;
}
.ts-trust-block .ts-reviewer-credentials {
	font-size: 12px;
	color: var(--trustsignals-accent);
	font-weight: 600;
	display: block;
}
.ts-trust-block .ts-reviewer-title {
	font-size: 12px;
	color: var(--ts-muted);
	display: block;
}
.ts-trust-block .ts-reviewer-date time{
	display: inline-block;
	margin-top: 5px;
	background: var(--ts-card-bg);
	border: 1px solid var(--ts-border);
	border-radius: 4px;
	padding: 2px 8px;
	font-size: 11px;
	color: var(--ts-muted);
}
.ts-trust-block .ts-reviewer-bio {
	margin: 12px 0 0;
	font-size: 13px;
	color: var(--ts-muted);
	line-height: 1.6;
}
.ts-trust-block blockquote.ts-reviewer-quote {
	margin: 10px 0 0;
	padding: 10px 14px;
	border-left: 3px solid var(--trustsignals-accent);
	background: var(--ts-card-bg);
	border-radius: 0 6px 6px 0;
	font-style: italic;
	font-size: 13px;
	color: var(--ts-text);
	line-height: 1.6;
}
.ts-trust-block blockquote.ts-reviewer-quote:before{
	background-color: transparent;
}

/* ── Confidentiality Notice ────────────────────────────────────────────────── */
.ts-trust-block .ts-confidentiality {
	display: flex;
	gap: 14px;
	align-items: flex-start;
	padding: 20px 24px;
}
.ts-trust-block .ts-hipaa-badge {
	width: 42px;
	min-width: 42px;
	height: 42px;
	border-radius: 10px;
	flex-shrink: 0;
	background: color-mix(in srgb, var(--trustsignals-accent) 12%, transparent);
	border: 1px solid color-mix(in srgb, var(--trustsignals-accent) 30%, transparent);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
}
.ts-trust-block .ts-confidentiality-label {
	display: block;
	font-weight: 700;
	font-size: 14px;
	color: var(--ts-text);
	margin-bottom: 5px;
}
.ts-trust-block .ts-confidentiality-text {
	margin: 0;
	font-size: 13px;
	color: var(--ts-muted);
	line-height: 1.6;
}

/* ── Admissions Detail ─────────────────────────────────────────────────────── */
.ts-trust-block .ts-admissions-status-full {
	font-size: 14px;
	font-weight: 600;
	color: var(--ts-text);
	display: block;
	margin-bottom: 6px;
}
.ts-trust-block .ts-admissions-phone {
	font-size: 13px;
	color: var(--ts-muted);
	display: block;
}
.ts-trust-block .ts-admissions-phone a {
	color: var(--trustsignals-accent);
	text-decoration: none;
}
.ts-trust-block .ts-admissions-phone a:hover { text-decoration: underline; }

/* ── Program Statistics ────────────────────────────────────────────────────── */
.ts-trust-block .ts-stats-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 8px;
}
.ts-trust-block .ts-stat {
	padding: 12px 10px;
	border-radius: 8px;
	background: var(--ts-card-bg);
	border: 1px solid var(--ts-border);
	text-align: center;
}
/* SVG icon — inline, themed via currentColor → accent */
.ts-trust-block .ts-stat-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 6px;
	width: 28px;
	height: 28px;
}
.ts-trust-block .ts-stat-icon svg {
	width: 24px !important;
	height: 24px !important;
	stroke: var(--trustsignals-accent);
	display: block;
	flex-shrink: 0;
}
.ts-trust-block .ts-stat-value {
	display: block;
	font-size: 15px;
	font-weight: 800;
	color: var(--trustsignals-accent);
}
.ts-trust-block .ts-stat-label {
	display: block;
	font-size: 10px;
	color: var(--ts-muted);
	line-height: 1.3;
	margin-top: 2px;
}

/* ── Responsive ────────────────────────────────────────────────────────────── */
@media (max-width: 480px) {
	.ts-trust-block .ts-stats-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.ts-trust-block .ts-status-header {
		gap: 8px;
		padding: 8px 14px;
	}
}

/* ── Status badge dot (CSS-only, replaces colored emoji that matched bg) ──── */
.ts-trust-block .ts-status-dot {
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.85);
	margin-right: 7px;
	flex-shrink: 0;
	vertical-align: middle;
}
/* Pulsing animation for "open" status */
.ts-trust-block .ts-status--open .ts-status-dot {
	animation: ts-dot-pulse 2s ease-in-out infinite;
}
@keyframes ts-dot-pulse {
	0%, 100% { opacity: 1; transform: scale(1); }
	50%       { opacity: 0.6; transform: scale(0.85); }
}

/* ── Confidentiality: content wrapper (label + text stacked) ──────────────── */
.ts-trust-block .ts-confidentiality-content {
	display: flex;
	flex-direction: column;
	gap: 6px;
	flex: 1;
	min-width: 0;
}
/* Hipaa badge: just the icon, no text */
.ts-trust-block .ts-hipaa-badge {
	width: 44px;
	min-width: 44px;
	height: 44px;
	border-radius: 10px;
	flex-shrink: 0;
	background: color-mix(in srgb, var(--trustsignals-accent) 12%, transparent);
	border: 1px solid color-mix(in srgb, var(--trustsignals-accent) 30%, transparent);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 22px;
}

/* ── Twemoji / emoji-as-img fix (theme img rules stretch them) ──────────────── */
/* Stat icon Twemoji fix removed — now uses inline SVG, no Twemoji needed */
/* Phone and lock emoji in status header */
.ts-trust-block .ts-status-header img,
.ts-trust-block .ts-status-phone img,
.ts-trust-block .ts-status-confidentiality img,
.ts-trust-block .ts-icon-lock img {
	display: inline !important;
	width: 1em !important;
	height: 1em !important;
	max-width: 1.4em !important;
	vertical-align: middle;
}

/* ── Insurance logo link wrapper ────────────────────────────────────────────── */
.ts-trust-block .ts-insurance-logo-link {
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	width: 100%;
	height: 100%;
}
.ts-trust-block .ts-insurance-logo-link:hover {
	opacity: 0.82;
}

/* Reviewer name as profile link */
.ts-trust-block .ts-reviewer-name--linked {
	text-decoration: none;
	color: inherit;
}
.ts-trust-block .ts-reviewer-name--linked:hover {
	text-decoration: underline;
	color: var(--trustsignals-accent);
}