/* Erbjudanden runda 2 (2026-10-09) – inc/valkomst.php, valkomst.js */

/* ---------- Toppbalken ---------- */
.v-topbar{position:relative;display:flex;align-items:center;justify-content:center;min-height:38px;padding:.55rem 3rem}
.v-topbar__rad{margin:0;display:flex;align-items:center;justify-content:center;gap:0 .2rem;white-space:nowrap;overflow:hidden;max-width:100%}
.v-topbar .v-topbar__del{color:inherit;text-decoration:none;transition:opacity .4s ease}
.v-topbar .v-topbar__del:hover,.v-topbar .v-topbar__del:focus-visible{text-decoration:underline;text-underline-offset:3px}
.v-topbar__sep{margin:0 .9em;opacity:.55}
.v-topbar.is-vaxlar .v-topbar__sep{display:none}
.v-topbar.is-vaxlar .v-topbar__del.is-dold{display:none}
.v-topbar__x{position:absolute;right:max(.25rem,calc(var(--gutter,16px) - .75rem));top:50%;transform:translateY(-50%);
	width:44px;height:44px;display:flex;align-items:center;justify-content:center;
	background:none;border:0;color:inherit;opacity:.7;font-size:1.15rem;line-height:1;cursor:pointer}
.v-topbar__x:hover{opacity:1}
@media (max-width:640px){.v-topbar{padding:.5rem 2.75rem}}

/* ---------- Kryssruta + GDPR (listformulären och rutan) ---------- */
.v-samtycke{flex:1 1 100%;display:flex;gap:.6rem;align-items:flex-start;margin-top:.35rem;font-size:var(--t-sm);line-height:1.45;cursor:pointer;text-align:left}
.v-samtycke input{flex:0 0 auto;width:18px;height:18px;margin:.1rem 0 0;accent-color:var(--cherry);cursor:pointer}
.v-samtycke__gdpr{flex:1 1 100%;margin:.1rem 0 0;font-size:.72rem;line-height:1.5;opacity:.78;text-align:left}
.v-samtycke__gdpr a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.v-formsvar__kod{display:block;margin:.5rem 0 .15rem;font-family:var(--serif);font-size:1.6rem;letter-spacing:.06em;color:var(--ink)}
.v-footer .v-formsvar__kod{color:inherit}
.v-formsvar__villkor{display:block;font-size:.75rem;opacity:.85}

/* ---------- Välkomstrutan ---------- */
.v-valk{position:fixed;z-index:96;right:clamp(1rem,2vw,1.5rem);bottom:clamp(1rem,2vw,1.5rem);width:min(24.5rem,calc(100vw - 2rem));
	padding:2rem 1.75rem 1.5rem;background:#171313;color:#F3EDE6;border:1px solid rgba(243,237,230,.14);
	box-shadow:0 18px 50px rgba(23,19,19,.28);opacity:0;transform:translateY(12px);
	transition:opacity .35s ease,transform .35s ease}
.v-valk.is-in{opacity:1;transform:none}
.v-valk[hidden]{display:none}
.v-valk__x{position:absolute;top:.25rem;right:.25rem;width:44px;height:44px;display:flex;align-items:center;justify-content:center;
	background:none;border:0;color:#F3EDE6;opacity:.7;font-size:1.3rem;line-height:1;cursor:pointer}
.v-valk__x:hover{opacity:1}
.v-valk__eyebrow{margin:0 0 .6rem;font-size:var(--t-xs);letter-spacing:.16em;text-transform:uppercase;color:#A89C94}
.v-valk__t{margin:0;font-family:var(--serif);font-weight:400;font-size:clamp(1.7rem,1.3rem + 1vw,2.1rem);line-height:1.05;letter-spacing:-.01em;color:#F3EDE6;outline:none}
.v-valk__lede{margin:.7rem 0 0;font-size:var(--t-sm);line-height:1.55;color:#CFC5BC}
.v-valk__form{margin-top:1.1rem!important;max-width:none!important;flex-direction:column;gap:.6rem!important}
.v-valk__form .v-input{width:100%;background:transparent;color:#F3EDE6;border-color:rgba(243,237,230,.45)}
.v-valk__form .v-input::placeholder{color:#A89C94}
.v-valk__form .v-input:focus{border-color:#F3EDE6}
.v-valk__form .v-samtycke{color:#CFC5BC;order:2}
.v-valk__form .v-samtycke__gdpr{color:#A89C94;opacity:1;order:3}
.v-valk__form .v-valk__btn{order:4;width:100%;background:#F3EDE6;color:#171313;border-color:#F3EDE6;min-height:48px}
.v-valk__form .v-valk__btn:hover{background:var(--cherry);border-color:var(--cherry);color:#fff}
.v-valk__hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.v-valk .v-formsvar{color:#E7CBC9;margin:.6rem 0 0}
.v-valk__nej{display:block;margin:.85rem auto 0;min-height:44px;padding:0 .5rem;background:none;border:0;color:#A89C94;
	font-size:var(--t-xs);letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.v-valk__nej:hover{color:#F3EDE6}
.v-valk__kod{margin:1rem 0 .9rem;padding:1rem;border:1px solid #6B615C;text-align:center;font-family:var(--serif);font-size:2rem;letter-spacing:.08em;color:#F3EDE6;user-select:all}
.v-valk__kopiera{width:100%;min-height:46px;color:#F3EDE6;border-color:rgba(243,237,230,.55)}
.v-valk__kopiera:hover{background:#F3EDE6;color:#171313;border-color:#F3EDE6}
.v-valk__villkor{margin:.9rem 0 0;font-size:.75rem;line-height:1.55;color:#A89C94}
.v-valk :focus-visible{box-shadow:0 0 0 2px #171313,0 0 0 4px #F3EDE6;outline:none}
@media (max-width:600px){
	.v-valk{left:0;right:0;bottom:0;width:auto;max-height:88svh;overflow-y:auto;border-width:1px 0 0;
		padding:1.6rem var(--gutter,16px) calc(1rem + env(safe-area-inset-bottom,0px))}
	.v-valk__t{font-size:1.75rem}
	.v-valk__lede{margin-top:.5rem}
	.v-valk__nej{margin-top:.4rem}
}
/* 2026-10-09 (ll-fixar): på desktop-produktsidan står rutan till vänster, över
   bilderna – aldrig över köpkolumnen. Hamnar en köpknapp under rutan viker den undan. */
.v-valk--vanster{right:auto;left:clamp(1rem,2vw,1.5rem)}
.v-valk.is-mat{transform:none!important;transition:none!important}
.v-valk.is-undan{opacity:0!important;visibility:hidden;pointer-events:none}
@media (max-width:600px){
	/* Bottenruta: kompakt, så att sidan och köpraden syns ovanför och under. */
	.v-valk{max-height:min(30rem,62svh);padding-top:1.25rem}
	.v-valk__eyebrow{margin-bottom:.35rem}
	.v-valk__t{font-size:1.5rem}
	.v-valk__form{margin-top:.8rem!important}
}
/* Mobilfliken: liten, nere till vänster, öppnar rutan vid tryck. */
.v-valk-flik{position:fixed;z-index:95;left:var(--gutter,16px);bottom:calc(16px + env(safe-area-inset-bottom,0px));display:flex;align-items:stretch;
	background:#171313;color:#F3EDE6;border:1px solid rgba(243,237,230,.18);box-shadow:0 8px 24px rgba(23,19,19,.22)}
.v-valk-flik[hidden]{display:none}
.v-valk-flik.is-undan{visibility:hidden;pointer-events:none}
.v-valk-flik__oppna{min-height:44px;padding:0 .4rem 0 1rem;background:none;border:0;color:inherit;font:inherit;font-size:var(--t-xs,.75rem);letter-spacing:.14em;text-transform:uppercase;cursor:pointer}
.v-valk-flik__x{width:40px;min-height:44px;background:none;border:0;color:#A89C94;font-size:1.15rem;line-height:1;cursor:pointer}
.v-valk-flik__x:hover{color:#F3EDE6}
.v-valk-flik :focus-visible{outline:2px solid #F3EDE6;outline-offset:-4px}
@media (min-width:601px){.v-valk-flik{display:none!important}}
@media print{.v-valk-flik{display:none!important}}
@media (prefers-reduced-motion:reduce){.v-valk{transition:none;transform:none}}
@media print{.v-valk,.v-topbar{display:none!important}}

/* ---------- Kassan: SEK-länken ---------- */
.v-sek-lank{margin:0 0 1rem;padding:.75rem .9rem;background:var(--surface);border:1px solid var(--line);font-size:var(--t-sm);line-height:1.5}
.v-sek-lank[hidden]{display:none}
.v-sek-lank .v-link{font-weight:500;text-decoration:underline;text-underline-offset:3px}
.v-sek-lank__not{display:block;margin-top:.2rem;color:var(--muted);font-size:.75rem}

/* ---------- Korgen: stegen mot det tredje plagget ---------- */
.v-b2g1-steg{display:flex;align-items:center;gap:.6rem;margin:.6rem 0 0}
.v-b2g1-steg__prickar{display:flex;gap:4px;flex:0 0 auto}
.v-b2g1-steg__prickar span{display:block;width:22px;height:3px;background:var(--line-strong);opacity:.45}
.v-b2g1-steg__prickar span.is-pa{background:var(--cherry);opacity:1}
.v-b2g1-steg__txt{font-size:var(--t-sm);line-height:1.4;color:var(--ink)}
.v-b2g1-steg__txt a{color:inherit;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.v-b2g1-korg .v-b2g1-steg{margin:0 0 .35rem}

/* Mobil: kryssrutan före knappen när formuläret ligger i en kolumn. */
@media (max-width:640px){
	.v-news__form .v-samtycke{order:1}
	.v-news__form .v-samtycke__gdpr{order:2}
	.v-news__form > .v-btn{order:3}
}
