/* Tezmy AI Writer — responsive styling for generated articles.
 * Every rule is scoped under .tezmy-ai-article so it can never leak out and
 * affect the rest of the WordPress theme or site. */

.tezmy-ai-article{
	max-width:820px;
	margin:0 auto;
	width:100%;
	box-sizing:border-box;
	padding:0 16px;
	overflow-wrap:break-word;
	word-wrap:break-word;
}
.tezmy-ai-article *{box-sizing:border-box;max-width:100%}

/* Typography */
.tezmy-ai-article h1{font-size:clamp(26px,5vw,40px);line-height:1.25;margin:0 0 20px}
.tezmy-ai-article h2{font-size:clamp(21px,3.6vw,28px);line-height:1.3;margin:34px 0 14px}
.tezmy-ai-article h3{font-size:clamp(18px,3vw,22px);line-height:1.35;margin:26px 0 10px}
.tezmy-ai-article h4,.tezmy-ai-article h5,.tezmy-ai-article h6{font-size:clamp(16px,2.4vw,18px);line-height:1.4;margin:20px 0 8px}
.tezmy-ai-article p{font-size:clamp(15px,2vw,17px);line-height:1.75;margin:0 0 18px}
.tezmy-ai-article ul,.tezmy-ai-article ol{margin:0 0 18px 22px;padding:0;font-size:clamp(15px,2vw,17px);line-height:1.7}
.tezmy-ai-article li{margin-bottom:6px}
.tezmy-ai-article blockquote{margin:22px 0;padding:14px 18px;border-left:3px solid #4f46e5;background:#f8fafc;font-size:clamp(15px,2vw,16px)}
.tezmy-ai-article figcaption,.tezmy-ai-article small,.tezmy-ai-article caption{font-size:13px;color:#64748b}

/* Images */
.tezmy-ai-article img{max-width:100%;height:auto;display:block;margin:20px auto;border-radius:8px}
.tezmy-ai-article a.tezmy-image-link{display:block;text-align:center;margin:20px auto}
.tezmy-ai-article a.tezmy-image-link img{margin:0 auto}
.tezmy-ai-article figure{margin:20px 0}

/* Links */
.tezmy-ai-article a{overflow-wrap:anywhere;word-break:break-word;color:#4f46e5}

/* Buttons / CTAs that may appear inside generated content */
.tezmy-ai-article .button,.tezmy-ai-article .btn,.tezmy-ai-article a.tezmy-cta{
	display:inline-block;max-width:100%;padding:12px 20px;border-radius:8px;
	white-space:normal;word-break:break-word;text-align:center;box-sizing:border-box;
}

/* Generic content boxes (referral / info / warning / FAQ / comparison / callout) */
.tezmy-ai-article .tezmy-box,
.tezmy-ai-article .referral-box,
.tezmy-ai-article .info-box,
.tezmy-ai-article .warning-box,
.tezmy-ai-article .faq-box,
.tezmy-ai-article .comparison-box,
.tezmy-ai-article .callout-box{
	width:100%;max-width:100%;box-sizing:border-box;padding:16px;border-radius:10px;margin:20px 0;overflow-wrap:break-word;
}

/* Table of contents, if present */
.tezmy-ai-article .toc,.tezmy-ai-article .tezmy-toc{width:100%;max-width:100%;box-sizing:border-box;overflow-wrap:break-word}

/* Tables: never let a wide table force the page to scroll horizontally.
 * The publisher wraps every <table> in .tezmy-table-scroll — only that
 * inner container scrolls, not the page. */
.tezmy-ai-article .tezmy-table-scroll{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;margin:20px 0}
.tezmy-ai-article table{border-collapse:collapse;width:100%;min-width:480px;font-size:14px}
.tezmy-ai-article th,.tezmy-ai-article td{border:1px solid #e2e8f0;padding:10px;text-align:left;white-space:normal}

/* YouTube / oEmbed videos: responsive 16:9 container */
.tezmy-ai-article .tezmy-video-responsive{position:relative;width:100%;aspect-ratio:16/9;margin:20px 0;background:#000;border-radius:8px;overflow:hidden}
.tezmy-ai-article .tezmy-video-responsive iframe,
.tezmy-ai-article .tezmy-video-responsive embed,
.tezmy-ai-article .tezmy-video-responsive object{position:absolute;inset:0;width:100%;height:100%;border:0}
.tezmy-ai-article .tezmy-ai-writer-videos{margin:24px 0}

/* Tablet / iPad */
@media (max-width:1024px){
	.tezmy-ai-article{max-width:92%;padding:0 20px}
}

/* Mobile */
@media (max-width:600px){
	.tezmy-ai-article{max-width:100%;padding:0 16px}
	.tezmy-ai-article h1{margin-bottom:14px}
	.tezmy-ai-article h2{margin:26px 0 10px}
	.tezmy-ai-article h3{margin:20px 0 8px}
	.tezmy-ai-article ul,.tezmy-ai-article ol{margin-left:18px}
	.tezmy-ai-article table{min-width:420px}
	.tezmy-ai-article .button,.tezmy-ai-article .btn,.tezmy-ai-article a.tezmy-cta{width:100%}
}

@media (max-width:360px){
	.tezmy-ai-article{padding:0 12px}
}

/* --- Tezmy article design components ------------------------------------ */
.tezmy-ai-article .tezmy-hero{
	background:linear-gradient(135deg,#eef2ff,#e0e7ff);border-radius:14px;padding:22px 24px;margin:0 0 26px;
}
.tezmy-ai-article .tezmy-hero h1{margin-top:0}
.tezmy-ai-article .tezmy-hero p:last-child{margin-bottom:0}

.tezmy-ai-article .tezmy-quick-answer,
.tezmy-ai-article .tezmy-key-facts,
.tezmy-ai-article .tezmy-highlight-box{
	background:#f8fafc;border:1px solid #e2e8f0;border-left:4px solid #4f46e5;border-radius:10px;padding:16px 18px;margin:22px 0;
}
.tezmy-ai-article .tezmy-key-facts ul{margin:8px 0 0 18px}

.tezmy-ai-article .tezmy-pros-cons{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:22px 0}
.tezmy-ai-article .tezmy-pros,.tezmy-ai-article .tezmy-cons{border-radius:10px;padding:16px 18px}
.tezmy-ai-article .tezmy-pros{background:#f0fdf4;border:1px solid #bbf7d0}
.tezmy-ai-article .tezmy-cons{background:#fef2f2;border:1px solid #fecaca}
.tezmy-ai-article .tezmy-pros ul,.tezmy-ai-article .tezmy-cons ul{margin:8px 0 0 18px}

.tezmy-ai-article .tezmy-steps{margin:22px 0;display:flex;flex-direction:column;gap:12px}
.tezmy-ai-article .tezmy-step{background:#f8fafc;border:1px solid #e2e8f0;border-radius:10px;padding:14px 18px}
.tezmy-ai-article .tezmy-step h3,.tezmy-ai-article .tezmy-step h4{margin-top:0}

.tezmy-ai-article .tezmy-tip-box{background:#eff6ff;border:1px solid #bfdbfe;border-radius:10px;padding:14px 18px;margin:20px 0}
.tezmy-ai-article .tezmy-warning-box{background:#fffbeb;border:1px solid #fde68a;border-radius:10px;padding:14px 18px;margin:20px 0}

.tezmy-ai-article .tezmy-cta-box{background:#111827;color:#fff;border-radius:12px;padding:22px 24px;margin:26px 0;text-align:center}
.tezmy-ai-article .tezmy-cta-box a{color:#fff;background:#4f46e5;padding:12px 22px;border-radius:8px;display:inline-block;margin-top:10px;text-decoration:none;font-weight:600}

.tezmy-ai-article .tezmy-faq{margin:26px 0}
.tezmy-ai-article .tezmy-faq h3,.tezmy-ai-article .tezmy-faq h4{margin:16px 0 6px}

.tezmy-ai-article .tezmy-sources{margin:26px 0;padding-top:16px;border-top:1px solid #e2e8f0;font-size:14px}
.tezmy-ai-article .tezmy-sources ul{margin:8px 0 0 18px}

.tezmy-ai-article .tezmy-related{margin:26px 0;padding-top:16px;border-top:1px solid #e2e8f0}

.tezmy-ai-article .tezmy-author-update{margin-top:30px;font-size:13px;color:#64748b}

@media (max-width:600px){
	.tezmy-ai-article .tezmy-pros-cons{grid-template-columns:1fr}
	.tezmy-ai-article .tezmy-hero{padding:18px}
	.tezmy-ai-article .tezmy-cta-box a{width:100%}
}