/**
 * Paketguide — wizard-stilar.
 *
 * @package Starby_Paket
 */

.starby-pkg-wizard {
	max-width: 700px;
	margin: 0 auto;
	padding: 48px 24px;
}

/* Steg-indikator */
.starby-pkg-wizard__steps {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: 48px;
}

.starby-pkg-wizard__step {
	display: flex;
	align-items: center;
	gap: 8px;
}

.starby-pkg-wizard__step-dot {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 13px;
	font-weight: 500;
	border: 1.5px solid rgba(190, 170, 118, 0.1);
	color: rgba(242, 237, 217, 0.25);
	transition: all 0.3s;
}

.starby-pkg-wizard__step.is-active .starby-pkg-wizard__step-dot {
	background: #BEAA76;
	border-color: #BEAA76;
	color: #162928;
}

.starby-pkg-wizard__step.is-done .starby-pkg-wizard__step-dot {
	background: rgba(41, 161, 102, 0.15);
	border-color: #29A166;
	color: #29A166;
}

.starby-pkg-wizard__step-name {
	font-size: 12px;
	font-weight: 300;
	color: rgba(242, 237, 217, 0.2);
}

.starby-pkg-wizard__step.is-active .starby-pkg-wizard__step-name {
	color: #F2EDD9;
	font-weight: 400;
}

.starby-pkg-wizard__step-line {
	width: 48px;
	height: 1px;
	background: rgba(190, 170, 118, 0.08);
	margin: 0 16px;
}

/* Paneler */
.starby-pkg-wizard__panel {
	display: none;
	text-align: center;
}

.starby-pkg-wizard__panel.is-active {
	display: block;
}

.starby-pkg-wizard__question {
	font-size: 28px;
	font-weight: 300;
	color: #F2EDD9;
	margin-bottom: 8px;
}

.starby-pkg-wizard__hint {
	font-size: 14px;
	font-weight: 300;
	color: rgba(242, 237, 217, 0.4);
	margin-bottom: 32px;
}

/* Svarsalternativ */
.starby-pkg-wizard__options {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 12px;
	margin-bottom: 32px;
}

.starby-pkg-wizard__option {
	background: rgba(242, 237, 217, 0.02);
	border: 1.5px solid rgba(190, 170, 118, 0.06);
	border-radius: 12px;
	padding: 24px 16px;
	cursor: pointer;
	transition: all 0.3s;
	text-align: center;
	color: #F2EDD9;
}

.starby-pkg-wizard__option:hover {
	border-color: rgba(190, 170, 118, 0.2);
	background: rgba(190, 170, 118, 0.04);
}

.starby-pkg-wizard__option.is-selected {
	border-color: #BEAA76;
	background: rgba(190, 170, 118, 0.08);
}

.starby-pkg-wizard__option-icon {
	font-size: 28px;
	display: block;
	margin-bottom: 8px;
}

.starby-pkg-wizard__option-title {
	font-size: 15px;
	font-weight: 500;
	display: block;
	margin-bottom: 2px;
}

.starby-pkg-wizard__option-desc {
	font-size: 12px;
	font-weight: 300;
	color: rgba(242, 237, 217, 0.35);
	display: block;
}

/* Budget */
.starby-pkg-wizard__budget {
	max-width: 440px;
	margin: 0 auto 32px;
}

.starby-pkg-wizard__budget-value {
	font-size: 36px;
	font-weight: 300;
	color: #BEAA76;
	margin-bottom: 16px;
}

.starby-pkg-wizard__budget-value small {
	font-size: 15px;
	color: rgba(242, 237, 217, 0.35);
}

.starby-pkg-wizard__budget-range {
	width: 100%;
	-webkit-appearance: none;
	appearance: none;
	height: 6px;
	background: rgba(190, 170, 118, 0.12);
	border-radius: 3px;
	outline: none;
}

.starby-pkg-wizard__budget-range::-webkit-slider-thumb {
	-webkit-appearance: none;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: #BEAA76;
	cursor: pointer;
	border: 4px solid #162928;
}

.starby-pkg-wizard__budget-labels {
	display: flex;
	justify-content: space-between;
	font-size: 12px;
	font-weight: 300;
	color: rgba(242, 237, 217, 0.2);
	margin-top: 8px;
}

/* Navigering */
.starby-pkg-wizard__nav {
	display: flex;
	justify-content: center;
	gap: 12px;
}

.starby-pkg-wizard__btn-next {
	background: #B85A3A;
	color: #fff;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 2px;
	text-transform: uppercase;
	padding: 16px 48px;
	border: none;
	border-radius: 25px;
	cursor: pointer;
	transition: all 0.3s;
}

.starby-pkg-wizard__btn-next:hover {
	background: #a04e2e;
}

.starby-pkg-wizard__btn-back {
	background: transparent;
	color: rgba(242, 237, 217, 0.4);
	font-size: 14px;
	font-weight: 300;
	padding: 16px 24px;
	border: none;
	cursor: pointer;
}

/* Resultat */
.starby-pkg-wizard__results-tag {
	display: inline-block;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: #29A166;
	background: rgba(41, 161, 102, 0.1);
	padding: 6px 14px;
	border-radius: 20px;
	margin-bottom: 16px;
}

.starby-pkg-wizard__results-title {
	font-size: 28px;
	font-weight: 300;
	color: #F2EDD9;
	margin-bottom: 16px;
}

.starby-pkg-wizard__results-summary {
	display: flex;
	justify-content: center;
	gap: 8px;
	flex-wrap: wrap;
	margin-bottom: 32px;
}

.starby-pkg-wizard__results-chip {
	font-size: 12px;
	padding: 5px 12px;
	border-radius: 20px;
	border: 1px solid rgba(190, 170, 118, 0.12);
	color: rgba(242, 237, 217, 0.5);
	animation: wizardChipPop 0.4s ease-out both;
}

/* Resultat-sammanfattning */
.starby-pkg-wizard__results-recap {
	font-size: 14px;
	font-weight: 300;
	color: rgba(242, 237, 217, 0.4);
	text-align: center;
	margin-bottom: 8px;
	line-height: 1.6;
}

.starby-pkg-wizard__results-recap strong {
	color: rgba(242, 237, 217, 0.65);
	font-weight: 500;
}

/* Resultat-grid */
.starby-pkg-wizard__results-grid {
	max-width: 1000px;
	margin: 0 auto;
}

/* Bästa matchning — stor, fullbredd */
.starby-wizard-result--top {
	position: relative;
	margin-bottom: 24px;
}

.starby-wizard-result--top .starby-pkg-card--horizontal .starby-pkg-card__link {
	grid-template-columns: 1fr 1fr;
}

.starby-wizard-result--top .starby-pkg-card__image {
	min-height: 280px;
}

.starby-wizard-result__badge {
	position: absolute;
	top: -12px;
	left: 24px;
	z-index: 3;
	background: #29A166;
	color: #fff;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 1px;
	text-transform: uppercase;
	padding: 6px 16px;
	border-radius: 20px;
}

/* Övriga resultat — 2 kolumner under */
.starby-pkg-wizard__results-grid {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
}

.starby-wizard-result:not(.starby-wizard-result--top) {
	flex: 1;
	min-width: 250px;
}

.starby-pkg-wizard__results-grid .starby-pkg-card--vertical .starby-pkg-card__image--top {
	aspect-ratio: 16/10;
}

.starby-pkg-wizard__results-grid .starby-pkg-card__image {
	min-height: auto;
}

.starby-pkg-wizard__results-grid .starby-pkg-card__image img {
	position: static;
	aspect-ratio: 4/3;
}

.starby-pkg-wizard__results-grid .starby-pkg-card__includes {
	display: none;
}

@media (max-width: 768px) {
	.starby-pkg-wizard__results-grid {
		grid-template-columns: 1fr;
	}
}

@keyframes wizardChipPop {
	0% { opacity: 0; transform: scale(0.8); }
	100% { opacity: 1; transform: scale(1); }
}

/* ========================================
   LADDNINGS-ANDNING I WIZARD
   ======================================== */
.starby-wizard-breathe {
	width: 200px; height: 200px; border-radius: 50%;
	margin: 0 auto; position: relative;
	display: flex; align-items: center; justify-content: center;
}

.starby-wizard-breathe__ring {
	position: absolute; inset: 0; border-radius: 50%;
	background: rgba(190, 170, 118, 0.06);
	border: 2px solid rgba(190, 170, 118, 0.15);
	animation: wizardBreathe 6s ease-in-out infinite;
}

.starby-wizard-breathe__ring--inner {
	inset: 30px;
	border-width: 1.5px;
	animation-delay: 0.4s;
}

.starby-wizard-breathe__glow {
	position: absolute;
	width: 80px; height: 80px; border-radius: 50%;
	background: radial-gradient(circle, rgba(190,170,118,0.2) 0%, transparent 70%);
	animation: wizardBreatheGlow 6s ease-in-out infinite;
}

.starby-wizard-breathe__text {
	position: relative; z-index: 2;
	font-size: 18px; font-weight: 400; font-style: italic;
	color: rgba(190, 170, 118, 0.7);
	letter-spacing: 2px;
	transition: opacity 0.3s;
}

@keyframes wizardBreathe {
	0%, 100% { transform: scale(0.6); opacity: 0.2; }
	25%      { transform: scale(1.1); opacity: 0.8; }
	50%      { transform: scale(1.1); opacity: 0.8; }
	75%      { transform: scale(0.6); opacity: 0.2; }
}

@keyframes wizardBreatheGlow {
	0%, 100% { transform: scale(0.4); opacity: 0.15; }
	25%      { transform: scale(1.8); opacity: 0.6; }
	50%      { transform: scale(1.8); opacity: 0.6; }
	75%      { transform: scale(0.4); opacity: 0.15; }
}

.starby-pkg-wizard__results-grid {
	text-align: left;
}

.starby-pkg-wizard__results-footer {
	margin-top: 40px;
	text-align: center;
}

.starby-pkg-wizard__results-footer a {
	font-size: 14px;
	color: rgba(242, 237, 217, 0.4);
	border-bottom: 1px solid rgba(242, 237, 217, 0.1);
	text-decoration: none;
}

.starby-pkg-wizard__btn-restart {
	display: block;
	margin: 12px auto 0;
	font-size: 13px;
	font-weight: 300;
	color: rgba(242, 237, 217, 0.25);
	background: none;
	border: none;
	cursor: pointer;
}

@media (max-width: 600px) {
	.starby-pkg-wizard__options {
		grid-template-columns: 1fr 1fr;
	}
}