/* ===========================================
   Wander Wise Pro - AI Trip Planner
   Consumes tokens from design-system.css only.
=========================================== */

.ww-ai-planner{
	background:var(--bg);
	padding-bottom:100px;
}

/* ---------- Hero ---------- */

.ww-ai-planner-hero{
	position:relative;
	background:var(--gradient-twilight);
	padding:110px 0 170px;
	overflow:hidden;
	isolation:isolate;
}

.ww-ai-planner-hero::before{
	content:'';
	position:absolute;
	inset:0;
	background-image:radial-gradient(rgba(255,255,255,.14) 1px, transparent 1px);
	background-size:26px 26px;
	opacity:.35;
	z-index:-1;
}

.ww-ai-planner-hero-inner{
	text-align:center;
	max-width:760px;
}

.ww-ai-planner-eyebrow{
	display:inline-flex;
	align-items:center;
	gap:8px;
	font-size:12px;
	font-weight:700;
	letter-spacing:.14em;
	text-transform:uppercase;
	color:var(--gold);
	background:rgba(255,255,255,.08);
	border:1px solid rgba(255,255,255,.18);
	padding:9px 18px 9px 14px;
	border-radius:999px;
	margin-bottom:24px;
}

.ww-ai-planner-eyebrow-icon.ww-icon{
	width:15px;
	height:15px;
	color:var(--gold);
}

.ww-ai-planner-hero h1{
	color:#fff;
	font-size:clamp(36px,5.4vw,58px);
	line-height:1.08;
	margin-bottom:20px;
}

.ww-ai-planner-hero h1 em{
	font-style:normal;
	background:linear-gradient(100deg, var(--gold) 10%, #F3D9AC 55%, var(--gold) 100%);
	-webkit-background-clip:text;
	background-clip:text;
	color:transparent;
}

.ww-ai-planner-hero p{
	color:rgba(255,255,255,.78);
	font-size:17px;
	line-height:1.75;
	max-width:560px;
	margin:0 auto;
}

.ww-ai-planner-trust{
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	gap:14px 28px;
	margin-top:32px;
	list-style:none;
}

.ww-ai-planner-trust li{
	display:flex;
	align-items:center;
	gap:8px;
	font-size:13px;
	font-weight:600;
	color:rgba(255,255,255,.85);
}

.ww-ai-planner-trust .ww-icon{
	width:16px;
	height:16px;
	color:var(--gold);
}

/* ---------- Body / form card ---------- */

.ww-ai-planner-body{
	position:relative;
	max-width:900px;
	margin:0 auto;
	padding-left:20px;
	padding-right:20px;
}

.ww-ai-planner-admin-notice{
	display:flex;
	gap:12px;
	align-items:flex-start;
	background:var(--primary-tint);
	border:1px solid rgba(107,47,160,.18);
	color:var(--primary-dark);
	border-radius:var(--radius-sm);
	padding:16px 18px;
	font-size:13.5px;
	line-height:1.6;
	margin:-138px auto 24px;
	max-width:820px;
	position:relative;
	z-index:2;
	box-shadow:var(--shadow-sm);
}

.ww-ai-planner-admin-notice .ww-icon{
	width:18px;
	height:18px;
	flex:none;
	margin-top:2px;
	color:var(--primary);
}

.ww-ai-planner-form{
	position:relative;
	z-index:1;
	margin-top:-130px;
	padding:36px;
	border-radius:var(--radius-lg);
	background:#fff;
	border:1px solid var(--line);
	box-shadow:var(--shadow-lg);
}

.ww-ai-planner-admin-notice + .ww-ai-planner-form{
	margin-top:0;
}

.ww-ai-planner-grid{
	display:grid;
	grid-template-columns:repeat(2,minmax(0,1fr));
	gap:20px;
}

.ww-ai-planner-form label{
	display:block;
	font-size:13px;
	font-weight:700;
	color:var(--text);
}

.ww-ai-planner-form label span{
	display:flex;
	align-items:center;
	gap:7px;
	margin:0 0 9px;
}

.ww-ai-planner-form label span .ww-icon{
	width:16px;
	height:16px;
	color:var(--primary);
}

.ww-ai-planner-form input,
.ww-ai-planner-form select,
.ww-ai-planner-form textarea{
	width:100%;
	box-sizing:border-box;
	border:1.5px solid var(--line);
	border-radius:var(--radius-sm);
	padding:13px 15px;
	background:var(--surface);
	font:inherit;
	font-weight:400;
	color:var(--text);
	transition:border-color var(--transition), box-shadow var(--transition), background var(--transition);
}

.ww-ai-planner-form input:hover,
.ww-ai-planner-form select:hover,
.ww-ai-planner-form textarea:hover{
	border-color:rgba(107,47,160,.35);
}

.ww-ai-planner-form input:focus,
.ww-ai-planner-form select:focus,
.ww-ai-planner-form textarea:focus{
	border-color:var(--primary);
	background:#fff;
	box-shadow:0 0 0 4px var(--primary-tint);
}

.ww-ai-planner-form textarea{
	resize:vertical;
}

.ww-ai-planner-notes{
	margin-top:20px;
}

.ww-ai-planner-submit{
	display:flex;
	align-items:center;
	justify-content:center;
	gap:10px;
	width:100%;
	margin-top:26px;
	border:0;
	border-radius:999px;
	padding:17px 24px;
	cursor:pointer;
	font-weight:700;
	font-size:15.5px;
	color:#fff;
	background:linear-gradient(120deg, var(--primary) 0%, var(--primary-dark) 100%);
	box-shadow:0 16px 32px rgba(74,29,115,.28);
	transition:transform var(--transition), box-shadow var(--transition), opacity var(--transition);
}

.ww-ai-planner-submit .ww-icon{
	width:18px;
	height:18px;
	color:var(--gold);
}

.ww-ai-planner-submit:hover{
	transform:translateY(-2px);
	box-shadow:0 20px 40px rgba(74,29,115,.36);
}

.ww-ai-planner-submit:active{
	transform:translateY(0);
}

.ww-ai-planner-submit:disabled,
.ww-ai-planner-submit.is-loading{
	opacity:.75;
	cursor:wait;
	transform:none;
}

.ww-ai-planner-submit.is-loading .ww-icon{
	animation:ww-ai-spin 1.1s linear infinite;
}

@keyframes ww-ai-spin{
	to{ transform:rotate(360deg); }
}

/* ---------- Status ---------- */

.ww-ai-planner-status{
	text-align:center;
	margin:22px 0 0;
	font-size:14px;
	font-weight:600;
	color:var(--muted);
	min-height:22px;
}

.ww-ai-planner-status strong{
	color:var(--text);
}

/* ---------- Result ---------- */

.ww-ai-planner-result{
	margin-top:20px;
	opacity:0;
	transform:translateY(14px);
	transition:opacity .5s var(--ease), transform .5s var(--ease);
}

.ww-ai-planner-result.is-visible{
	opacity:1;
	transform:translateY(0);
}

.ww-ai-planner-result-inner{
	padding:40px clamp(20px,4vw,52px);
	border-radius:var(--radius-lg);
	background:#fff;
	border:1px solid var(--line);
	box-shadow:var(--shadow);
	line-height:1.8;
}

.ww-ai-planner-result-inner > *:first-child{
	margin-top:0;
}

.ww-ai-planner-result-inner h2{
	position:relative;
	font-size:clamp(22px,3vw,28px);
	color:var(--primary-dark);
	margin:38px 0 16px;
	padding-bottom:12px;
	border-bottom:2px solid var(--primary-tint);
}

.ww-ai-planner-result-inner h2:first-child{
	margin-top:0;
}

.ww-ai-planner-result-inner h2::before{
	content:'';
	position:absolute;
	left:0;
	bottom:-2px;
	width:56px;
	height:2px;
	background:var(--gold);
}

.ww-ai-planner-result-inner h3{
	font-size:18px;
	margin:26px 0 10px;
	color:var(--text);
}

.ww-ai-planner-result-inner p{
	color:var(--muted);
	font-size:15.5px;
	margin-bottom:12px;
}

.ww-ai-planner-result-inner strong{
	color:var(--text);
}

.ww-ai-planner-result-inner ul,
.ww-ai-planner-result-inner ol{
	padding-left:22px;
	margin-bottom:14px;
	color:var(--muted);
	font-size:15.5px;
}

.ww-ai-planner-result-inner li{
	margin-bottom:6px;
}

.ww-ai-planner-result-inner a{
	color:var(--primary);
	font-weight:700;
	text-decoration:underline;
	text-decoration-color:rgba(107,47,160,.35);
	text-underline-offset:3px;
}

.ww-ai-planner-result-inner a:hover{
	color:var(--primary-dark);
}

/* Day headings, upgraded from a plain h3 into a badge + title row. */

.ww-ai-planner-result-inner h3.ww-day-heading{
	display:flex;
	align-items:center;
	flex-wrap:wrap;
	gap:12px;
	margin:30px 0 12px;
	padding-top:22px;
	border-top:1px dashed var(--line);
}

.ww-ai-planner-result-inner h3.ww-day-heading:first-of-type{
	border-top:0;
	padding-top:0;
}

.ww-day-badge{
	display:inline-flex;
	align-items:center;
	font-size:12px;
	font-weight:800;
	letter-spacing:.06em;
	text-transform:uppercase;
	color:#fff;
	background:linear-gradient(120deg, var(--primary) 0%, var(--primary-dark) 100%);
	padding:7px 14px;
	border-radius:999px;
	flex:none;
}

.ww-day-title{
	font-size:18px;
	font-weight:700;
	color:var(--text);
}

.ww-ai-planner-restart{
	display:flex;
	align-items:center;
	justify-content:center;
	gap:8px;
	margin:26px auto 0;
	border:1.5px solid var(--line);
	border-radius:999px;
	padding:13px 26px;
	background:#fff;
	color:var(--primary);
	font-weight:700;
	font-size:14px;
	cursor:pointer;
	transition:border-color var(--transition), color var(--transition), transform var(--transition);
}

.ww-ai-planner-restart:hover{
	border-color:var(--primary);
	color:var(--primary-dark);
	transform:translateY(-2px);
}

/* ---------- Responsive ---------- */

@media (max-width:780px){

	.ww-ai-planner-hero{
		padding:90px 0 200px;
	}

	.ww-ai-planner-admin-notice{
		margin-top:-190px;
	}

	.ww-ai-planner-form{
		margin-top:-180px;
		padding:26px;
	}
}

@media (max-width:700px){

	.ww-ai-planner-grid{
		grid-template-columns:1fr;
	}

	.ww-ai-planner-result-inner{
		padding:26px 20px;
	}
}

@media print{

	.ww-ai-planner-hero,
	.ww-ai-planner-form,
	.ww-ai-planner-status,
	.ww-ai-planner-restart,
	.ww-header,
	.ww-ai-planner-admin-notice{
		display:none !important;
	}

	.ww-ai-planner-result-inner{
		box-shadow:none;
		border:0;
	}
}

/* Use-my-preferences toggle (Slice 4) */
.ww-ai-prefs-toggle {
	display: flex; align-items: center; gap: 1rem; flex-wrap: wrap;
	margin-bottom: 1.25rem; padding-bottom: 1.1rem; border-bottom: 1px solid rgba(107,47,160,.12);
}
.ww-ai-prefs-caption { font-weight: 700; color: #3B1A5E; font-size: .95rem; }
.ww-ai-seg { display: inline-flex; background: #F3ECFA; border-radius: 999px; padding: 4px; }
.ww-ai-seg input { position: absolute; opacity: 0; pointer-events: none; }
.ww-ai-seg label {
	cursor: pointer; padding: .45rem 1rem; border-radius: 999px;
	font-size: .86rem; font-weight: 600; color: #6E6180; transition: all .15s;
}
.ww-ai-seg input:checked + label {
	background: linear-gradient(135deg,#6B2FA0,#B0688F); color: #fff;
	box-shadow: 0 2px 8px rgba(107,47,160,.3);
}
@media (max-width: 480px) {
	.ww-ai-seg { width: 100%; }
	.ww-ai-seg label { flex: 1; text-align: center; }
}