/* GetFood public styles. CSS variables at the top so re-theming to
   match the exact site brand colors later is a one place edit. */
:root {
	--gf-primary: #ff5a36;
	--gf-primary-dark: #e8471f;
	--gf-text: #1c1c1c;
	--gf-muted: #6b6b6b;
	--gf-border: #e2e2e2;
	--gf-bg-soft: #faf9f7;
	--gf-radius: 10px;
	--gf-success-bg: #e9f7ee;
	--gf-success-text: #1e7a3d;
	--gf-info-bg: #eaf2fb;
	--gf-info-text: #1c5da1;
	--gf-error-bg: #fdeceb;
	--gf-error-text: #b3261e;
}

.gf-card {
	max-width: 640px;
	margin: 0 auto;
	padding: 28px 24px;
	background: #fff;
	border: 1px solid var(--gf-border);
	border-radius: var(--gf-radius);
	font-family: inherit;
	color: var(--gf-text);
}

.gf-subtext {
	color: var(--gf-muted);
	font-size: 0.95em;
	margin-top: -8px;
}

/* Restaurant page */
.gf-restaurant-page { max-width: 900px; margin: 0 auto; padding: 20px; }
.gf-status { font-weight: 600; }

/* Form fields, shared by signup, login, dashboard */
.gf-field { margin-bottom: 18px; display: flex; flex-direction: column; gap: 6px; }
.gf-field label { font-weight: 600; font-size: 0.9em; }
.gf-field input[type="text"],
.gf-field input[type="email"],
.gf-field input[type="tel"],
.gf-field input[type="password"] {
	padding: 12px 14px;
	border: 1px solid var(--gf-border);
	border-radius: var(--gf-radius);
	font-size: 1em;
	width: 100%;
	box-sizing: border-box;
}
.gf-field input:focus {
	outline: none;
	border-color: var(--gf-primary);
	box-shadow: 0 0 0 3px rgba(255, 90, 54, 0.15);
}
.gf-field-invalid input { border-color: var(--gf-error-text); }
.gf-error { color: var(--gf-error-text); font-size: 0.85em; min-height: 1em; }

.gf-field-row {
	display: flex;
	gap: 12px;
	margin-bottom: 18px;
}
.gf-field-row .gf-field { margin-bottom: 0; flex: 1; }
.gf-field-row .gf-field-state { flex: 0 0 90px; }
.gf-field-row .gf-field-postcode { flex: 0 0 100px; }
.gf-field-row select {
	padding: 12px 10px;
	border: 1px solid var(--gf-border);
	border-radius: var(--gf-radius);
	font-size: 1em;
	width: 100%;
	box-sizing: border-box;
	background: #fff;
}

.gf-checkbox-grid,
.gf-checkbox-grid * {
	box-sizing: border-box;
}
.gf-checkbox-grid {
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
	gap: 8px 12px;
	list-style: none;
	margin: 0;
	padding: 0;
}
.gf-checkbox {
	display: flex !important;
	align-items: center;
	gap: 6px;
	font-weight: 400 !important;
	font-size: 0.92em;
	list-style: none;
	margin: 0 !important;
}
.gf-checkbox input {
	margin: 0 !important;
	width: auto !important;
	flex: 0 0 auto;
}

@media (max-width: 480px) {
	.gf-field-row { flex-wrap: wrap; }
	.gf-field-row .gf-field-state,
	.gf-field-row .gf-field-postcode { flex: 1 1 45%; }
}

.gf-btn {
	display: inline-block;
	padding: 13px 24px;
	border-radius: var(--gf-radius);
	border: none;
	font-size: 1em;
	font-weight: 600;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
}
.gf-btn-primary {
	background: var(--gf-primary);
	color: #fff;
	width: 100%;
}
.gf-btn-primary:hover { background: var(--gf-primary-dark); }
.gf-btn-primary:disabled { opacity: 0.6; cursor: default; }

.gf-alert {
	padding: 14px 16px;
	border-radius: var(--gf-radius);
	margin-bottom: 18px;
	font-size: 0.95em;
}
.gf-alert-success { background: var(--gf-success-bg); color: var(--gf-success-text); }
.gf-alert-info { background: var(--gf-info-bg); color: var(--gf-info-text); }
.gf-alert-error { background: var(--gf-error-bg); color: var(--gf-error-text); }

/* Login, fixes the input glued to the button issue: they now stack
   with normal spacing instead of sharing a row with no gap. */
.gf-login-form .gf-field { margin-bottom: 14px; }
.gf-login-form .gf-btn { margin-top: 4px; }

/* Homepage restaurant search bar, a proper pill shaped search group
   rather than an unstyled input + button sitting side by side. */
.gf-restaurants-search {
	max-width: 640px;
	margin: 0 auto;
	padding: 20px;
}
.gf-search-group {
	display: flex;
	align-items: stretch;
	background: #fff;
	border: 1px solid var(--gf-border);
	border-radius: 999px;
	padding: 6px;
	gap: 6px;
	box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}
.gf-search-group input[type="text"] {
	flex: 1;
	border: none;
	padding: 12px 16px;
	font-size: 1em;
	border-radius: 999px;
}
.gf-search-group input[type="text"]:focus { outline: none; }
.gf-search-group .gf-btn {
	width: auto;
	border-radius: 999px;
	white-space: nowrap;
}
.gf-use-location {
	background: none;
	border: none;
	color: var(--gf-primary);
	font-size: 0.85em;
	margin-top: 8px;
	cursor: pointer;
	padding: 4px 0;
}

.gf-admin-panel { max-width: 820px; }

.gf-restaurants-page { max-width: 1000px; margin: 0 auto; padding: 20px; }
.gf-hero-search { max-width: 640px; margin: 0 auto; text-align: center; }

.gf-category-row {
	display: flex;
	gap: 8px;
	overflow-x: auto;
	margin: 18px 0;
	padding-bottom: 6px;
}
.gf-chip {
	flex: 0 0 auto;
	padding: 8px 16px;
	border-radius: 999px;
	border: 1px solid var(--gf-border);
	background: #fff;
	cursor: pointer;
	font-size: 0.88em;
	white-space: nowrap;
}
.gf-chip-active { background: var(--gf-primary); color: #fff; border-color: var(--gf-primary); }

.gf-restaurant-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 16px;
}
.gf-restaurant-card {
	display: block;
	border: 1px solid var(--gf-border);
	border-radius: var(--gf-radius);
	padding: 16px;
	text-decoration: none;
	color: var(--gf-text);
	background: #fff;
}
.gf-restaurant-card:hover { border-color: var(--gf-primary); }
.gf-restaurant-card h3 { margin: 0 0 6px; font-size: 1.05em; }
.gf-open { color: var(--gf-success-text); font-weight: 600; font-size: 0.85em; }
.gf-closed { color: var(--gf-error-text); font-weight: 600; font-size: 0.85em; }

/* Restaurant page menu */
.gf-restaurant-header { margin-bottom: 20px; }
.gf-menu-category-title { margin-top: 28px; margin-bottom: 10px; font-size: 1.2em; }
.gf-menu-items { display: flex; flex-direction: column; gap: 10px; }
.gf-menu-item {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	padding: 12px 14px;
	border: 1px solid var(--gf-border);
	border-radius: var(--gf-radius);
}
.gf-menu-item-sold-out { opacity: 0.55; }
.gf-menu-item-price { font-weight: 600; white-space: nowrap; }

/* Billing badge */
.gf-billing-badge {
	background: var(--gf-bg-soft);
	border: 1px solid var(--gf-border);
	border-radius: var(--gf-radius);
	padding: 12px 14px;
	font-size: 0.9em;
	margin: 14px 0;
}

/* Menu builder in the merchant dashboard */
.gf-menu-tabs { display: flex; gap: 8px; margin: 14px 0 18px; }
.gf-tab-btn {
	padding: 9px 16px;
	border: 1px solid var(--gf-border);
	border-radius: 999px;
	background: #fff;
	cursor: pointer;
	font-size: 0.9em;
}
.gf-tab-active { background: var(--gf-primary); color: #fff; border-color: var(--gf-primary); }

.gf-menu-category {
	border: 1px solid var(--gf-border);
	border-radius: var(--gf-radius);
	padding: 14px;
	margin-bottom: 14px;
}
.gf-menu-category-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.gf-menu-category-header h3 { margin: 0; font-size: 1em; }
.gf-menu-row {
	display: flex;
	justify-content: space-between;
	gap: 10px;
	padding: 8px 0;
	border-bottom: 1px solid #f0f0f0;
}
.gf-menu-row-actions { display: flex; gap: 10px; white-space: nowrap; }
.gf-link { color: var(--gf-primary); text-decoration: none; font-size: 0.9em; background: none; border: none; cursor: pointer; padding: 0; }

.gf-add-item-form { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.gf-add-item-form input { padding: 8px 10px; border: 1px solid var(--gf-border); border-radius: 6px; font-size: 0.9em; }
.gf-add-item-form input[name="name"] { flex: 1 1 140px; }
.gf-add-item-form input[name="description"] { flex: 2 1 200px; }

.gf-review-row { display: flex; align-items: center; gap: 10px; padding: 6px 0; border-bottom: 1px solid #f0f0f0; }
.gf-review-row input[data-f="name"] { flex: 1; padding: 8px; border: 1px solid var(--gf-border); border-radius: 6px; }
.gf-review-row input[data-f="price"] { padding: 8px; border: 1px solid var(--gf-border); border-radius: 6px; }

/* Merchant dashboard */
.gf-dashboard-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 16px;
}
.gf-link { color: var(--gf-primary); text-decoration: none; font-size: 0.9em; }
.gf-dashboard-next-steps ul { padding-left: 20px; color: var(--gf-muted); }
.gf-dashboard-gate { text-align: center; }
.gf-dashboard-gate .gf-btn { display: inline-block; width: auto; padding: 13px 40px; margin-top: 10px; }

@media (max-width: 480px) {
	.gf-checkbox-grid { grid-template-columns: repeat(2, 1fr); }
	.gf-search-group { flex-direction: column; border-radius: var(--gf-radius); }
	.gf-search-group .gf-btn { border-radius: var(--gf-radius); }
}