/*
Theme Name: Product Order Form
Theme URI: https://example.com
Author: Custom
Author URI: https://example.com
Description: Ek fully customizable "Product Order / Lead Form" theme. Customizer se aap colors, layout, saare text/labels, product image, header logo, URL/redirect link — sab kuch edit kar sakte hain, bina code chhuye.
Version: 1.0.0
Requires at least: 5.8
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: product-order-theme
Tags: custom-colors, custom-logo, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.
*/

* { box-sizing: border-box; }

body {
	margin: 0;
	background: var(--pot-page-bg, #f2ece2);
	font-family: var(--pot-font, 'Noto Sans', 'Segoe UI', Arial, sans-serif);
	color: var(--pot-text, #2b2b2b);
}

.pot-wrapper {
	max-width: var(--pot-maxwidth, 430px);
	margin: 0 auto;
	padding: 18px 14px 60px;
}

/* Header / product banner */
.pot-header {
	background: var(--pot-header-bg, #ece5d8);
	border-radius: var(--pot-radius, 14px);
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--pot-header-gap, 10px);
	padding: var(--pot-header-padding, 18px);
	margin-bottom: 18px;
	text-align: center;
	flex-wrap: wrap;
}
.pot-header a { display:flex; align-items:center; gap: var(--pot-header-gap, 10px); text-decoration:none; color:inherit; flex-wrap: wrap; justify-content:center; }
.pot-header img.pot-logo {
	width: var(--pot-img-width, 60px);
	height: var(--pot-img-height, 40px);
	border-radius: var(--pot-img-radius, 8px);
	object-fit: contain;
}
.pot-header .pot-product-title {
	font-size: 18px;
	font-weight: 600;
	color: var(--pot-header-text, #1f3a5f);
}

/* Card */
.pot-card {
	background: var(--pot-card-bg, #ffffff);
	border-radius: var(--pot-radius, 14px);
	padding: 22px 18px 26px;
	box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

.pot-card h1 {
	font-size: 20px;
	margin: 0 0 6px;
	color: var(--pot-heading-color, #1f1f1f);
}

.pot-subtext {
	font-size: 13.5px;
	color: var(--pot-primary, #2f6b4f);
	margin: 0 0 20px;
	line-height: 1.5;
}

.pot-field { margin-bottom: 16px; }

.pot-field label {
	display: block;
	font-weight: 600;
	font-size: 14px;
	margin-bottom: 6px;
	color: var(--pot-label-color, #1f1f1f);
}
.pot-field label .pot-optional {
	font-weight: 400;
	color: var(--pot-primary, #2f6b4f);
	font-size: 12.5px;
}

.pot-field input[type="text"],
.pot-field input[type="email"],
.pot-field input[type="tel"],
.pot-field input[type="date"],
.pot-field select,
.pot-field textarea {
	width: 100%;
	padding: 11px 12px;
	border: 1px solid var(--pot-border, #d9cfba);
	border-radius: 8px;
	font-size: 14px;
	background: #fff;
	color: var(--pot-text, #2b2b2b);
	font-family: inherit;
}
.pot-field input:focus,
.pot-field select:focus,
.pot-field textarea:focus {
	outline: none;
	border-color: var(--pot-primary, #2f6b4f);
}
.pot-field textarea { resize: vertical; min-height: 90px; }

.pot-char-count {
	text-align: right;
	font-size: 12px;
	color: #9a9a9a;
	margin-top: 4px;
}

.pot-submit-btn {
	width: 100%;
	padding: 14px;
	border: none;
	border-radius: 8px;
	background: var(--pot-btn-bg, #14432c);
	color: var(--pot-btn-text, #ffffff);
	font-size: 15.5px;
	font-weight: 600;
	cursor: pointer;
	margin-top: 6px;
}
.pot-submit-btn:hover { opacity: 0.92; }

.pot-disclaimer {
	margin-top: 18px;
	font-size: 11.5px;
	line-height: 1.6;
	text-align: center;
	color: var(--pot-primary, #2f6b4f);
}

.pot-success-box {
	background: #e9f6ee;
	border: 1px solid #bfe6cf;
	color: #14432c;
	padding: 16px;
	border-radius: 10px;
	margin-bottom: 18px;
	font-size: 14px;
	text-align: center;
}
.pot-error-box {
	background: #fdeceb;
	border: 1px solid #f3b7b2;
	color: #7a1f16;
	padding: 12px;
	border-radius: 10px;
	margin-bottom: 14px;
	font-size: 13px;
}

@media (prefers-color-scheme: dark) {
	/* Intentionally not forcing dark mode; front-facing form stays on theme colors for brand consistency. */
}