/**
 * Restaurant Elementor Widgets — minimal fallback styling.
 *
 * The ig-restaurant theme already ships full CSS for every class used by
 * these widgets (.ig-hero, .ig-food-card, .ig-testimonials, .ig-offer-banner,
 * .ig-newsletter, .ig-blog-section, .ig-feature-icons, etc). When that
 * theme is active this file adds nothing new — the theme's own stylesheet,
 * loaded after this one, simply takes over.
 *
 * These rules only exist so widgets aren't a totally unstyled wall of text
 * if this plugin is ever activated on a different theme.
 */

.ig-hero,
.ig-offer-banner,
.ig-newsletter,
.ig-blog-section,
.ig-popular-dishes {
	padding: 48px 24px;
}

.ig-container {
	max-width: 1200px;
	margin: 0 auto;
}

.ig-eyebrow {
	display: inline-block;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	margin-bottom: 8px;
	opacity: 0.75;
}

.ig-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 24px;
	border-radius: 999px;
	text-decoration: none;
	font-weight: 600;
}

.ig-btn--primary {
	background: #d9822b;
	color: #fff;
}

.ig-btn--secondary {
	background: transparent;
	border: 1px solid currentColor;
}

.ig-food-grid,
.ig-feature-icons,
.ig-blog-grid {
	display: grid;
	gap: 24px;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.ig-food-card,
.ig-blog-card {
	border: 1px solid #eee;
	border-radius: 12px;
	overflow: hidden;
}

.ig-food-card__body,
.ig-blog-card__body {
	padding: 16px;
}

.ig-newsletter__form {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.ig-newsletter__form input[type="email"] {
	flex: 1 1 240px;
	padding: 10px 14px;
	border-radius: 999px;
	border: 1px solid #ddd;
}