/*
	Theme Name: Hello Elementor Child — NearMe AI
	Theme URI: https://elementor.com/hello-theme/
	Description: Child theme of Hello Elementor for the NearMe AI site. Enqueues the compiled Tailwind stylesheet and Google Fonts used by the design.
	Author: NearMe AI
	Template: hello-elementor
	Version: 1.0.0
	Requires at least: 6.0
	Tested up to: 6.8
	Requires PHP: 7.4
	License: GNU General Public License v3 or later.
	License URI: https://www.gnu.org/licenses/gpl-3.0.html
	Text Domain: hello-elementor-child
*/

/* Add your own CSS overrides below this line. The NearMe AI design lives in assets/styles.css. */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Bricolage+Grotesque:opsz,wght@12..96,400..800&family=Open+Sans:wght@400;600;700;800&display=swap');

/* =========================================================
   NearMe AI — Territory Checker + Claim Workflow styles
   Scoped under .nm-territory-checker so nothing collides
   with your theme's own .card / .btn / .form-* rules.
   ========================================================= */

/* ---------- Design tokens ---------- */
.nm-territory-checker {
	--color-bg: #ffffff;
	--color-fg: #0f172a;
	--color-muted-bg: #f6f7fb;
	--color-muted-fg: #6b7280;
	--color-border: #e6e8ef;
	--color-card: #ffffff;
	--color-primary: #2f5bff;
	--color-primary-fg: #ffffff;
	--color-success: #16a34a;
	--color-success-bg: #ecfdf5;
	--color-danger: #dc2626;
	--color-danger-bg: #fef2f2;

	--gradient-brand: linear-gradient(135deg, #0a2472 0%, #2f5bff 25%, #7a5cff 50%, #ec4899 75%, #ff5e3a 100%);
	--gradient-soft: linear-gradient(180deg, #fafbff 0%, #f4f0fb 100%);

	--shadow-soft: 0 1px 2px rgba(15, 23, 42, 0.04), 0 8px 24px rgba(90, 60, 200, 0.08);
	--shadow-glow: 0 20px 60px -10px rgba(90, 60, 200, 0.35);

	--radius-sm: 0.5rem;
	--radius: 0.875rem;
	--radius-lg: 1.25rem;

	--font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--font-display: "Bricolage Grotesque", "Inter", system-ui, sans-serif;
	--font-heading: "Open Sans", system-ui, sans-serif;

	font-family: var(--font-body);
	color: var(--color-fg);
	line-height: 1.5;
}

.nm-territory-checker *,
.nm-territory-checker *::before,
.nm-territory-checker *::after { box-sizing: border-box; }

.nm-territory-checker h1,
.nm-territory-checker h2,
.nm-territory-checker h3,
.nm-territory-checker h4 { margin: 0; line-height: 1.1; letter-spacing: -0.02em; }
.nm-territory-checker p { margin: 0; }
.nm-territory-checker ul { margin: 0; padding: 0; list-style: none; }

/* ---------- Typography helpers ---------- */
.nm-territory-checker .gradient-text {
	background: var(--gradient-brand);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
}
.nm-territory-checker .font-display { font-family: var(--font-display); font-weight: 700; letter-spacing: -0.035em; }
.nm-territory-checker .muted { color: var(--color-muted-fg); }
.nm-territory-checker .lead { font-size: 1.125rem; color: var(--color-muted-fg); line-height: 1.6; }
.nm-territory-checker .section-title { font-family: var(--font-heading); font-size: clamp(1.75rem, 4vw, 3rem); font-weight: 800; line-height: 1.1; }
.nm-territory-checker .eyebrow {
	display: inline-flex; align-items: center; gap: 0.5rem;
	font-size: 0.75rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase;
	color: var(--color-primary); margin-bottom: 0.75rem;
}

/* ---------- Buttons ---------- */
.nm-territory-checker .btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
	height: 3rem; padding: 0 1.5rem;
	border-radius: var(--radius-sm); border: 1px solid transparent;
	font-family: var(--font-body); font-weight: 600; font-size: 0.95rem;
	white-space: nowrap; cursor: pointer; text-decoration: none;
	transition: opacity .15s, background .15s, transform .15s;
}
.nm-territory-checker .btn:hover { opacity: 0.9; }
.nm-territory-checker .btn:disabled { opacity: 0.6; cursor: default; }
.nm-territory-checker .btn-primary { background: var(--gradient-brand); color: var(--color-primary-fg); box-shadow: var(--shadow-glow); }
.nm-territory-checker .btn-secondary { background: var(--color-bg); color: var(--color-fg); border-color: var(--color-border); }
.nm-territory-checker .btn-secondary:hover { background: var(--color-muted-bg); }
.nm-territory-checker .btn-lg { height: 3.5rem; padding: 0 2rem; font-size: 1rem; }
.nm-territory-checker .btn-block { width: 100%; }

/* ---------- Cards ---------- */
.nm-territory-checker .card {
	background: var(--color-card);
	border: 1px solid var(--color-border);
	border-radius: var(--radius);
	box-shadow: var(--shadow-soft);
	padding: 1.75rem;
}
.nm-territory-checker .card-highlight {
	border-color: rgba(47, 91, 255, 0.4);
	box-shadow: var(--shadow-glow);
	background: linear-gradient(135deg, rgba(47, 91, 255, 0.05), transparent);
}
.nm-territory-checker .card-success {
	border-color: rgba(22, 163, 74, 0.4);
	background: linear-gradient(135deg, var(--color-success-bg), transparent);
}
.nm-territory-checker .card-danger {
	border-color: rgba(220, 38, 38, 0.3);
	background: linear-gradient(135deg, var(--color-danger-bg), transparent);
}

/* ---------- Form fields ---------- */
.nm-territory-checker .form-field { display: flex; flex-direction: column; }
.nm-territory-checker .form-label {
	font-size: 0.7rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase;
	color: var(--color-muted-fg); margin-bottom: 0.5rem;
}
.nm-territory-checker .form-input,
.nm-territory-checker .form-select,
.nm-territory-checker .form-textarea {
	width: 100%; height: 3rem;
	border: 1px solid var(--color-border); border-radius: var(--radius-sm);
	background: #fff; color: var(--color-fg); padding: 0 0.85rem; font-size: 0.95rem;
	font-family: var(--font-body);
	transition: border-color .15s, box-shadow .15s;
}
.nm-territory-checker .form-textarea { height: auto; padding: 0.6rem 0.85rem; min-height: 6rem; resize: vertical; }
.nm-territory-checker .form-input:focus,
.nm-territory-checker .form-select:focus,
.nm-territory-checker .form-textarea:focus {
	outline: 0; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(47, 91, 255, 0.15);
}
.nm-territory-checker .form-error { color: var(--color-danger); font-size: 0.85rem; margin-top: 0.5rem; }
.nm-territory-checker .form-row { display: grid; gap: 1rem; }
@media (min-width: 768px) {
	.nm-territory-checker .form-row-3 { grid-template-columns: 1fr 1fr auto; align-items: end; }
	.nm-territory-checker .form-row-2 { grid-template-columns: 1fr 1fr; }
}

/* ---------- Icon tile ---------- */
.nm-territory-checker .icon-tile {
	display: inline-flex; align-items: center; justify-content: center;
	width: 2.5rem; height: 2.5rem; border-radius: var(--radius-sm);
	background: var(--gradient-brand); color: #fff;
	box-shadow: var(--shadow-soft); flex-shrink: 0; font-size: 1.125rem;
}

/* ---------- Check lists ---------- */
.nm-territory-checker .check-list { display: grid; gap: 0.6rem; }
.nm-territory-checker .check-list li { display: flex; gap: 0.5rem; align-items: flex-start; font-size: 0.9rem; }
.nm-territory-checker .check-list li::before { content: "✓"; color: var(--color-success); font-weight: 700; flex-shrink: 0; }
.nm-territory-checker .check-list-2col { grid-template-columns: 1fr; }
@media (min-width: 640px) { .nm-territory-checker .check-list-2col { grid-template-columns: 1fr 1fr; } }

/* ---------- Chips ---------- */
.nm-territory-checker .chip {
	display: inline-flex; align-items: center; gap: 0.4rem;
	border: 1px solid var(--color-border); border-radius: 9999px;
	background: #fff; padding: 0.4rem 0.85rem; font-size: 0.8rem;
}
.nm-territory-checker .chip-primary { background: rgba(47, 91, 255, 0.1); color: var(--color-primary); border-color: rgba(47, 91, 255, 0.2); }
.nm-territory-checker .chip-success { background: var(--color-success-bg); color: var(--color-success); border-color: rgba(22, 163, 74, 0.25); }
.nm-territory-checker .chip-list { display: flex; flex-wrap: wrap; gap: 0.5rem; justify-content: center; }

/* ---------- Multi-step progress bar ---------- */
.nm-territory-checker .steps-bar { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.5rem; }
.nm-territory-checker .step-pill { display: flex; flex-direction: column; align-items: center; text-align: center; }
.nm-territory-checker .step-circle {
	width: 2.5rem; height: 2.5rem; border-radius: 50%;
	display: inline-flex; align-items: center; justify-content: center;
	font-weight: 700; font-size: 0.9rem; border: 2px solid var(--color-border);
	color: var(--color-muted-fg); background: #fff; transition: all .2s;
}
.nm-territory-checker .step-pill.is-active .step-circle { border-color: var(--color-primary); color: var(--color-primary); background: rgba(47, 91, 255, 0.1); }
.nm-territory-checker .step-pill.is-done .step-circle { background: var(--gradient-brand); color: #fff; border-color: transparent; }
.nm-territory-checker .step-pill .step-label { font-size: 0.7rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-muted-fg); margin-top: 0.5rem; }
.nm-territory-checker .step-pill.is-active .step-label,
.nm-territory-checker .step-pill.is-done .step-label { color: var(--color-fg); }

/* ---------- Summary aside ---------- */
.nm-territory-checker .summary-row { display: flex; justify-content: space-between; gap: 0.75rem; padding: 0.4rem 0; font-size: 0.9rem; }
.nm-territory-checker .summary-row .label { color: var(--color-muted-fg); }
.nm-territory-checker .summary-row .value { font-weight: 600; }
.nm-territory-checker .summary-total {
	margin-top: 1.25rem; background: var(--gradient-brand); color: #fff;
	border-radius: var(--radius); padding: 1.25rem;
}
.nm-territory-checker .summary-total .total-label { font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.08em; opacity: 0.8; }
.nm-territory-checker .summary-total .total-value { font-family: var(--font-display); font-size: 2rem; font-weight: 800; }

/* ---------- Layout with sticky aside ---------- */
.nm-territory-checker .sticky-aside { position: relative; }
@media (min-width: 1024px) {
	.nm-territory-checker .sticky-aside { position: sticky; top: 6rem; }
	.nm-territory-checker .layout-with-aside,
	.nm-territory-checker .layout-form-aside { display: grid; grid-template-columns: 1fr 360px; gap: 2.5rem; align-items: start; }
}

/* ---------- Territory (cart) cards ---------- */
.nm-territory-checker .territory-card { position: relative; }
.nm-territory-checker .territory-card .remove-btn {
	position: absolute; top: 0.75rem; right: 0.75rem;
	width: 1.75rem; height: 1.75rem; border-radius: 0.4rem;
	background: #fff; border: 1px solid var(--color-border);
	color: var(--color-muted-fg); display: inline-flex; align-items: center; justify-content: center; cursor: pointer;
}
.nm-territory-checker .territory-card .remove-btn:hover { color: var(--color-danger); border-color: var(--color-danger); }

/* ---------- Grids ---------- */
.nm-territory-checker .grid { display: grid; gap: 1.5rem; }
.nm-territory-checker .grid-2,
.nm-territory-checker .grid-3 { grid-template-columns: 1fr; }
@media (min-width: 768px) {
	.nm-territory-checker .grid-2 { grid-template-columns: 1fr 1fr; }
	.nm-territory-checker .grid-3 { grid-template-columns: repeat(3, 1fr); }
}
.nm-territory-checker .items-start { align-items: start; }
.nm-territory-checker .items-center { align-items: center; }

/* ---------- Utilities ---------- */
.nm-territory-checker .flex { display: flex; }
.nm-territory-checker .flex-wrap { flex-wrap: wrap; }
.nm-territory-checker .gap-2 { gap: 0.5rem; }
.nm-territory-checker .gap-3 { gap: 0.75rem; }
.nm-territory-checker .gap-4 { gap: 1rem; }
.nm-territory-checker .justify-center { justify-content: center; }
.nm-territory-checker .text-center { text-align: center; }
.nm-territory-checker .mx-auto { margin-left: auto; margin-right: auto; }
.nm-territory-checker .mt-1 { margin-top: 0.25rem; }
.nm-territory-checker .mt-2 { margin-top: 0.5rem; }
.nm-territory-checker .mt-3 { margin-top: 0.75rem; }
.nm-territory-checker .mt-4 { margin-top: 1rem; }
.nm-territory-checker .mt-5 { margin-top: 1.25rem; }
.nm-territory-checker .mt-6 { margin-top: 1.5rem; }
.nm-territory-checker .mt-8 { margin-top: 2rem; }
.nm-territory-checker .mt-10 { margin-top: 2.5rem; }
.nm-territory-checker .mt-12 { margin-top: 3rem; }
.nm-territory-checker .mb-3 { margin-bottom: 0.75rem; }
.nm-territory-checker .mb-6 { margin-bottom: 1.5rem; }
.nm-territory-checker .is-hidden { display: none !important; }