/* ==========================================================================
   AI YouTube SEO Generator Pro — Contact Form, Essential Pages & Footer Bar
   Colours, fonts and radii come from the shared .aiysg-wrapper tokens in
   base.css (always loaded alongside this file) - this stylesheet only
   defines component layout on top of them, so every surface the plugin
   renders (contact form, essential pages, footer bar) shares one look and
   responds to the same Light / Red / Dark theme switch.
   ========================================================================== */

.aiysg-contact-form-wrapper {
	max-width: 640px;
	margin: 24px 0;
	font-family: inherit;
}

.aiysg-contact-form {
	background: var(--aiysg-surface);
	border: 1px solid var(--aiysg-border);
	border-radius: 18px;
	padding: 28px;
	box-shadow: 0 10px 30px rgba(20, 21, 31, 0.06);
}

.aiysg-contact-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}

.aiysg-contact-field {
	margin-bottom: 16px;
}

.aiysg-contact-field label {
	display: block;
	font-size: 13px;
	font-weight: 600;
	margin-bottom: 6px;
	color: var(--aiysg-text);
}

.aiysg-contact-field input,
.aiysg-contact-field textarea {
	width: 100%;
	padding: 12px 14px;
	border-radius: 10px;
	border: 1.5px solid var(--aiysg-border);
	background: #fff;
	font-size: 14px;
	font-family: inherit;
	color: var(--aiysg-text);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.aiysg-contact-field input:focus,
.aiysg-contact-field textarea:focus {
	outline: none;
	border-color: var(--aiysg-accent);
	box-shadow: 0 0 0 3px rgba(225, 29, 63, 0.1);
}

.aiysg-contact-field textarea {
	resize: vertical;
	min-height: 130px;
}

.aiysg-contact-honeypot {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.aiysg-contact-status {
	padding: 12px 14px;
	border-radius: 10px;
	font-size: 13px;
	margin-bottom: 16px;
}

.aiysg-contact-status.is-success {
	background: rgba(23, 168, 101, 0.12);
	color: #128a53;
}

.aiysg-contact-status.is-error {
	background: rgba(225, 29, 63, 0.1);
	color: var(--aiysg-accent-dark);
}

.aiysg-contact-submit {
	appearance: none;
	border: none;
	cursor: pointer;
	font-family: inherit;
	font-size: 15px;
	font-weight: 700;
	padding: 14px 28px;
	border-radius: 12px;
	background: linear-gradient(135deg, var(--aiysg-accent), var(--aiysg-accent-dark));
	color: #fff;
	box-shadow: 0 10px 24px rgba(225, 29, 63, 0.22);
	transition: transform 0.14s ease, box-shadow 0.2s ease, opacity 0.14s ease;
}

.aiysg-contact-submit:hover:not(:disabled) {
	transform: translateY(-2px);
	box-shadow: 0 14px 30px rgba(225, 29, 63, 0.28);
}

.aiysg-contact-submit:disabled {
	opacity: 0.65;
	cursor: not-allowed;
	transform: none;
}

@media (max-width: 560px) {
	.aiysg-contact-form {
		padding: 20px;
		border-radius: 14px;
	}

	.aiysg-contact-row {
		grid-template-columns: 1fr;
	}
}

/* --- Site-wide footer links bar ------------------------------------------ */

.aiysg-footer-bar {
	background: #14151f;
	padding: 16px 20px;
}

.aiysg-footer-bar-inner {
	max-width: 1100px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px 22px;
}

.aiysg-footer-bar-inner a {
	color: rgba(255, 255, 255, 0.75);
	font-size: 13px;
	text-decoration: none;
	transition: color 0.15s ease;
}

.aiysg-footer-bar-inner a:hover {
	color: #ffffff;
	text-decoration: underline;
}

/* ==========================================================================
   Essential page content (Home / About / Privacy / Terms / Disclaimer / Contact)
   Rendered by the [adsense_*] shortcodes. Self-contained tokens so it looks
   consistent regardless of the active theme.
   ========================================================================== */

.aiysg-pg {
	max-width: 1080px;
	margin: 0 auto;
	color: var(--aiysg-text);
}

.aiysg-pg-topbar {
	display: flex;
	justify-content: flex-end;
	margin-bottom: 18px;
	position: relative;
	z-index: 1;
}

.aiysg-pg * {
	box-sizing: border-box;
}

.aiysg-pg h1,
.aiysg-pg h2,
.aiysg-pg h3 {
	line-height: 1.25;
}

/* Hero */

.aiysg-pg-hero {
	text-align: center;
	padding: 48px 24px;
	border-radius: var(--aiysg-radius-lg);
	background: linear-gradient(135deg, var(--aiysg-accent) 0%, var(--aiysg-accent-dark) 100%);
	color: #fff;
	margin-bottom: 32px;
}

.aiysg-pg-hero-sm {
	padding: 34px 24px;
}

.aiysg-pg-eyebrow {
	display: inline-block;
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	background: rgba(255, 255, 255, 0.16);
	padding: 6px 14px;
	border-radius: 999px;
	margin-bottom: 14px;
}

.aiysg-pg-hero h1 {
	font-size: 32px;
	font-weight: 800;
	margin: 0 0 12px;
}

.aiysg-pg-hero-sm h1 {
	font-size: 26px;
	margin: 0 0 10px;
}

.aiysg-pg-hero-text,
.aiysg-pg-hero-sm p {
	max-width: 620px;
	margin: 0 auto;
	font-size: 15.5px;
	opacity: 0.95;
	line-height: 1.7;
}

.aiysg-pg-hero-actions {
	margin-top: 24px;
	display: flex;
	justify-content: center;
	gap: 12px;
	flex-wrap: wrap;
}

.aiysg-pg-btn {
	display: inline-block;
	padding: 13px 26px;
	border-radius: 12px;
	font-weight: 700;
	font-size: 14.5px;
	text-decoration: none;
	transition: transform 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease;
}

.aiysg-pg-btn-primary {
	background: #fff;
	color: var(--aiysg-accent-dark);
}

.aiysg-pg-btn-outline {
	background: transparent;
	color: #fff;
	border: 1.5px solid rgba(255, 255, 255, 0.6);
}

.aiysg-pg-btn:hover {
	transform: translateY(-2px);
	opacity: 0.92;
}

/* Sections */

.aiysg-pg-section {
	margin-bottom: 36px;
}

.aiysg-pg-section h2 {
	font-size: 22px;
	font-weight: 700;
	margin: 0 0 14px;
}

.aiysg-pg-section > p {
	color: var(--aiysg-muted);
	font-size: 15px;
	line-height: 1.75;
	max-width: 760px;
}

/* Feature / icon grids */

.aiysg-pg-features-grid,
.aiysg-pg-icon-grid,
.aiysg-pg-values-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 16px;
	margin-top: 16px;
}

.aiysg-pg-feature-card {
	background: var(--aiysg-surface);
	border: 1px solid var(--aiysg-border);
	border-radius: 16px;
	padding: 22px 20px;
	transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.aiysg-pg-feature-card:hover {
	transform: translateY(-3px);
	border-color: var(--aiysg-accent);
	box-shadow: 0 10px 26px rgba(20, 21, 31, 0.08);
}

.aiysg-pg-feature-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	border-radius: 12px;
	background: var(--aiysg-accent-soft);
	color: var(--aiysg-accent);
	margin-bottom: 12px;
}

.aiysg-pg-feature-icon svg {
	width: 21px;
	height: 21px;
}

.aiysg-pg-feature-card h3 {
	font-size: 15.5px;
	font-weight: 700;
	margin: 0 0 6px;
}

.aiysg-pg-feature-card p {
	font-size: 13.5px;
	color: var(--aiysg-muted);
	line-height: 1.6;
	margin: 0;
}

/* Call to action */

.aiysg-pg-cta {
	text-align: center;
	background: var(--aiysg-surface);
	border: 1px solid var(--aiysg-border);
	border-radius: var(--aiysg-radius-lg);
	padding: 40px 24px;
	margin-bottom: 36px;
}

.aiysg-pg-cta h2 {
	font-size: 22px;
	margin: 0 0 10px;
}

.aiysg-pg-cta p {
	color: var(--aiysg-muted);
	margin: 0 0 20px;
}

/* Latest updates */

.aiysg-pg-updates-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 16px;
	margin-top: 16px;
}

.aiysg-pg-update-card {
	display: block;
	background: var(--aiysg-surface);
	border: 1px solid var(--aiysg-border);
	border-radius: 14px;
	padding: 18px;
	text-decoration: none;
	color: var(--aiysg-text);
	transition: transform 0.15s ease, border-color 0.15s ease;
}

.aiysg-pg-update-card:hover {
	transform: translateY(-2px);
	border-color: var(--aiysg-accent);
}

.aiysg-pg-update-title {
	display: block;
	font-weight: 700;
	font-size: 14.5px;
	margin-bottom: 6px;
	color: var(--aiysg-text);
}

.aiysg-pg-update-excerpt {
	display: block;
	font-size: 13px;
	color: var(--aiysg-muted);
	line-height: 1.6;
}

.aiysg-pg-empty-note {
	color: var(--aiysg-muted);
	font-size: 14px;
	font-style: italic;
}

/* Legal pages (Privacy / Terms / Disclaimer) */

.aiysg-pg-legal {
	max-width: 760px;
	margin: 0 auto;
}

.aiysg-pg-legal h2 {
	font-size: 18px;
	font-weight: 700;
	margin: 30px 0 10px;
}

.aiysg-pg-legal h2:first-of-type {
	margin-top: 0;
}

.aiysg-pg-legal p {
	font-size: 14.5px;
	line-height: 1.75;
	color: var(--aiysg-muted);
	margin: 0 0 4px;
}

.aiysg-pg-legal a {
	color: var(--aiysg-accent-dark);
}

.aiysg-pg-updated {
	display: inline-block;
	font-size: 12.5px;
	font-weight: 600;
	color: var(--aiysg-accent-dark);
	background: var(--aiysg-accent-soft);
	padding: 5px 12px;
	border-radius: 999px;
	margin-bottom: 20px;
}

.aiysg-pg-note {
	margin-top: 24px;
	padding-top: 16px;
	border-top: 1px solid var(--aiysg-border);
	font-size: 13px;
}

/* Contact layout */

.aiysg-pg-contact-layout {
	display: grid;
	grid-template-columns: 1.4fr 1fr;
	gap: 24px;
	align-items: start;
}

.aiysg-pg-contact-info-col {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.aiysg-pg-info-card {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	background: var(--aiysg-surface);
	border: 1px solid var(--aiysg-border);
	border-radius: 14px;
	padding: 18px;
}

.aiysg-pg-info-card h3 {
	font-size: 14px;
	font-weight: 700;
	margin: 0 0 4px;
}

.aiysg-pg-info-card p {
	font-size: 13.5px;
	color: var(--aiysg-muted);
	margin: 0;
	line-height: 1.6;
}

.aiysg-pg-social-links a {
	color: var(--aiysg-accent-dark);
	text-decoration: none;
	font-weight: 600;
}

.aiysg-pg-social-links a:hover {
	text-decoration: underline;
}

.aiysg-pg-note-sm {
	font-size: 11px !important;
	color: var(--aiysg-muted) !important;
	margin-top: 6px !important;
	opacity: 0.8;
}

@media (max-width: 780px) {
	.aiysg-pg-contact-layout {
		grid-template-columns: 1fr;
	}

	.aiysg-pg-hero {
		padding: 34px 18px;
	}

	.aiysg-pg-hero h1 {
		font-size: 25px;
	}

	.aiysg-pg-section h2,
	.aiysg-pg-cta h2 {
		font-size: 19px;
	}
}
