/**
 * Plan 360, סגנון מתכנן האירועים.
 * מסתמך על אסימוני העיצוב של התבנית, עם ערכי גיבוי לתבניות אחרות.
 */

.p360-planner {
	background: var(--p360-surface, #fff);
	border: 1px solid var(--p360-line, #e6ddd4);
	border-radius: var(--p360-radius-lg, 22px);
	padding: clamp(1.25rem, 3vw, 2.5rem);
	box-shadow: var(--p360-shadow, 0 8px 24px -12px rgba(23, 18, 29, .18));
}

.p360-planner__steps {
	list-style: none;
	padding: 0;
	margin: 0;
}

.p360-step fieldset {
	border: 0;
	padding: 0;
	margin: 0;
}

.p360-step__title {
	display: flex;
	align-items: center;
	gap: .7rem;
	font-family: var(--p360-font-head, sans-serif);
	font-size: var(--p360-fs-xl, 1.5rem);
	font-weight: 800;
	line-height: 1.25;
	padding: 0;
	margin-bottom: .5rem;
}

.p360-step__num {
	inline-size: 38px;
	block-size: 38px;
	flex-shrink: 0;
	border-radius: 50%;
	background: var(--p360-brand, #8a2b52);
	color: #fff;
	display: grid;
	place-items: center;
	font-size: 1rem;
}

.p360-step__hint {
	color: var(--p360-ink-3, #6b6076);
	font-size: var(--p360-fs-sm, .9375rem);
	margin-bottom: 1.25rem;
}

/* בחירה חזותית */
.p360-choice-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	gap: .75rem;
}
.p360-choice-grid--compact {
	grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
}

.p360-choice { position: relative; display: block; }

.p360-choice input {
	position: absolute;
	inset: 0;
	inline-size: 100%;
	block-size: 100%;
	opacity: 0;
	cursor: pointer;
	margin: 0;
}

.p360-choice__box {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	text-align: center;
	min-block-size: 104px;
	padding: 1rem .75rem;
	border: 2px solid var(--p360-line, #e6ddd4);
	border-radius: var(--p360-radius, 14px);
	background: var(--p360-bg, #fdfbf8);
	transition: border-color 180ms ease, background 180ms ease, transform 180ms ease;
}

.p360-choice--sm .p360-choice__box {
	flex-direction: row;
	justify-content: flex-start;
	min-block-size: 56px;
	text-align: start;
	padding: .6rem .9rem;
}

.p360-choice__icon { color: var(--p360-brand, #8a2b52); }

.p360-choice__label {
	font-family: var(--p360-font-head, sans-serif);
	font-weight: 700;
	font-size: var(--p360-fs-sm, .9375rem);
	line-height: 1.3;
}

.p360-choice__tag {
	margin-inline-start: auto;
	font-size: .7rem;
	font-weight: 700;
	color: var(--p360-gold, #a8813c);
	background: var(--p360-gold-light, #f7efdf);
	padding: .12rem .5rem;
	border-radius: 999px;
}

.p360-choice input:checked + .p360-choice__box {
	border-color: var(--p360-brand, #8a2b52);
	background: var(--p360-brand-light, #f8ecf1);
}

.p360-choice input:focus-visible + .p360-choice__box {
	outline: 3px solid var(--p360-brand, #8a2b52);
	outline-offset: 3px;
}

.p360-choice input:hover + .p360-choice__box { transform: translateY(-2px); }

/* שדות */
.p360-field-row {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 1.25rem;
}

.p360-field--range input[type='range'] {
	inline-size: 100%;
	accent-color: var(--p360-brand, #8a2b52);
	block-size: 32px;
	min-block-size: 32px;
	padding: 0;
	border: 0;
	background: transparent;
}

/* ניווט והתקדמות */
.p360-planner__nav {
	display: flex;
	gap: .75rem;
	margin-block-start: 2rem;
	flex-wrap: wrap;
}
.p360-planner__nav .p360-btn { flex: 1 1 auto; }

.p360-planner__progress {
	display: flex;
	align-items: center;
	gap: .75rem;
	margin-block-start: 1.25rem;
	margin-block-end: 0;
	font-size: var(--p360-fs-xs, .8125rem);
	color: var(--p360-ink-3, #6b6076);
}

.p360-planner__progress progress {
	flex: 1;
	block-size: 8px;
	border-radius: 999px;
	overflow: hidden;
	accent-color: var(--p360-brand, #8a2b52);
	border: 0;
	background: var(--p360-sand, #f6f0e8);
}
.p360-planner__progress progress::-webkit-progress-bar {
	background: var(--p360-sand, #f6f0e8);
	border-radius: 999px;
}
.p360-planner__progress progress::-webkit-progress-value {
	background: linear-gradient(90deg, var(--p360-brand, #8a2b52), var(--p360-gold, #a8813c));
	border-radius: 999px;
}

/* תוצאה */
.p360-planner__result:focus { outline: none; }

.p360-result__head { margin-bottom: 1.5rem; }
.p360-result__title {
	font-family: var(--p360-font-head, sans-serif);
	font-size: var(--p360-fs-2xl, 2rem);
	font-weight: 800;
	margin: 0 0 .3em;
}
.p360-result__sub { color: var(--p360-ink-3, #6b6076); margin: 0; }
.p360-result__h3 { margin-block: 2rem .9rem; font-size: var(--p360-fs-xl, 1.5rem); }

.p360-budget-table td, .p360-budget-table th { vertical-align: middle; }

.p360-bar {
	display: inline-block;
	inline-size: min(120px, 22vw);
	block-size: 8px;
	border-radius: 999px;
	background: var(--p360-sand, #f6f0e8);
	position: relative;
	overflow: hidden;
	vertical-align: middle;
	margin-inline-end: .5rem;
}
.p360-bar::before {
	content: '';
	position: absolute;
	inset-block: 0;
	inset-inline-start: 0;
	inline-size: var(--w, 0%);
	background: linear-gradient(90deg, var(--p360-brand, #8a2b52), var(--p360-gold, #a8813c));
	border-radius: 999px;
}
.p360-bar__val { font-weight: 700; font-size: var(--p360-fs-xs, .8125rem); }

.p360-budget-table tr.is-low th a { color: var(--p360-err, #9c2020); }

/* ציר זמן */
.p360-timeline {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	gap: 0;
	position: relative;
}
.p360-timeline__item {
	position: relative;
	padding-inline-start: 1.75rem;
	padding-block-end: 1.75rem;
	border-inline-start: 2px solid var(--p360-line, #e6ddd4);
}
.p360-timeline__item:last-child { border-inline-start-color: transparent; padding-block-end: 0; }
.p360-timeline__item::before {
	content: '';
	position: absolute;
	inset-block-start: .35rem;
	inset-inline-start: -8px;
	inline-size: 14px;
	block-size: 14px;
	border-radius: 50%;
	background: var(--p360-surface, #fff);
	border: 3px solid var(--p360-brand, #8a2b52);
}
.p360-timeline__item.is-urgent::before { border-color: var(--p360-err, #9c2020); }

.p360-timeline__when {
	display: flex;
	align-items: center;
	gap: .5rem;
	font-size: var(--p360-fs-xs, .8125rem);
	color: var(--p360-ink-3, #6b6076);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .05em;
}
.p360-timeline__title { margin: .2rem 0 .5rem; font-size: var(--p360-fs-lg, 1.1875rem); }
.p360-timeline__tasks {
	margin: 0;
	padding-inline-start: 1.1rem;
	display: grid;
	gap: .3rem;
	font-size: var(--p360-fs-sm, .9375rem);
	color: var(--p360-ink-2, #3d3448);
}

.p360-result__cta {
	margin-block-start: 2.5rem;
	padding: clamp(1.25rem, 3vw, 2rem);
	border-radius: var(--p360-radius-lg, 22px);
	background: var(--p360-sand, #f6f0e8);
}
.p360-result__cta .p360-form--inline {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
	gap: 1rem;
	align-items: end;
}
.p360-result__cta .p360-form__status { grid-column: 1 / -1; }

.p360-result__actions {
	display: flex;
	gap: .75rem;
	flex-wrap: wrap;
	margin-block-start: 1.5rem;
}

@media print {
	.p360-planner { border: 0; box-shadow: none; padding: 0; }
	.p360-planner__form { display: none; }
	.p360-timeline__item { break-inside: avoid; }
}