/* /Components/AnimatedLogo.razor.rz.scp.css */
/* =====================================================================
   AnimatedLogo – "MRKTIM – The Impact"
   Alla lager delar canvas 1983×793 och skalas som EN enhet.
   Endast transform/opacity animeras. Spelas en gång, sedan helt stilla.
   Slutläget motsvarar mrktim_original.png.

   Tidslinje (ms):
     0–260     basen slår upp ur mörkret
     120–780   gorillan faller in uppifrån, landar, laddar och SLÅR
     780       IMPACT: R trycks ned, blixt, dubbel chockvåg, hela loggan kickas
     780–1300  rekyl och stabilisering
   ===================================================================== */

.animated-logo[b-6zkqc4000s] {
	position: relative;
	width: 100%;
	aspect-ratio: 1983 / 793;
	--impact-x: 32%;
	--impact-y: 52%;
	animation: logo-kick-b-6zkqc4000s 360ms cubic-bezier(0.2, 0.9, 0.3, 1) 780ms 1 both;
}

.animated-logo__layer[b-6zkqc4000s] {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: contain;
	will-change: transform, opacity;
}

/* ---- Basen: snabb reveal + vibration vid impact ---- */
.animated-logo__base[b-6zkqc4000s] {
	transform-origin: 50% 70%;
	animation:
		base-in-b-6zkqc4000s 260ms cubic-bezier(0.2, 0.9, 0.2, 1) 0ms 1 both,
		base-shake-b-6zkqc4000s 320ms cubic-bezier(0.2, 0.9, 0.3, 1) 780ms 1 both;
}

/* ---- R:et: in med basen, hård stöt nedåt + rekyl vid slaget ---- */
.animated-logo__impact[b-6zkqc4000s] {
	transform-origin: 50% 15%;
	animation:
		base-in-b-6zkqc4000s 260ms cubic-bezier(0.2, 0.9, 0.2, 1) 0ms 1 both,
		r-hit-b-6zkqc4000s 380ms cubic-bezier(0.2, 0.9, 0.3, 1) 780ms 1 both;
}

/* ---- Gorillan: faller in uppifrån, landar, laddar, slår ---- */
.animated-logo__gorilla[b-6zkqc4000s] {
	/* Rotation runt stödpunkten vid R:et */
	transform-origin: 34% 100%;
	animation: gorilla-strike-b-6zkqc4000s 660ms linear 120ms 1 both;
}

/* ---- Grön blixt över träffpunkten ---- */
.animated-logo__flash[b-6zkqc4000s] {
	position: absolute;
	left: var(--impact-x);
	top: var(--impact-y);
	width: 34%;
	aspect-ratio: 1;
	translate: -50% -50%;
	border-radius: var(--radius-full);
	background: radial-gradient(circle, var(--color-accent) 0%, var(--color-accent-subtle) 35%, transparent 65%);
	opacity: 0;
	pointer-events: none;
	will-change: transform, opacity;
	animation: flash-b-6zkqc4000s 260ms cubic-bezier(0.1, 0.9, 0.2, 1) 780ms 1 both;
}

/* ---- Dubbel chockvåg ---- */
.animated-logo__shock[b-6zkqc4000s] {
	position: absolute;
	left: var(--impact-x);
	top: var(--impact-y);
	width: 16%;
	aspect-ratio: 1;
	translate: -50% -50%;
	border-radius: var(--radius-full);
	border: 2px solid var(--color-accent);
	opacity: 0;
	pointer-events: none;
	will-change: transform, opacity;
}

.animated-logo__shock--inner[b-6zkqc4000s] {
	box-shadow: 0 0 0 1px var(--color-accent-border), 0 0 18px var(--color-accent-subtle), inset 0 0 12px var(--color-accent-subtle);
	animation: shock-b-6zkqc4000s 420ms cubic-bezier(0.1, 0.8, 0.2, 1) 780ms 1 both;
}

.animated-logo__shock--outer[b-6zkqc4000s] {
	border-width: 1px;
	animation: shock-outer-b-6zkqc4000s 520ms cubic-bezier(0.1, 0.8, 0.2, 1) 820ms 1 both;
}

/* =========================== Keyframes ============================= */
@keyframes base-in-b-6zkqc4000s {
	0%   { opacity: 0; transform: translateY(6%) scale(0.94); }
	60%  { opacity: 1; }
	100% { opacity: 1; transform: translateY(0) scale(1); }
}

/* Gorillan 120→780 ms. Faller in, landar, drar tillbaka, SLÅR. */
@keyframes gorilla-strike-b-6zkqc4000s {
	0%   { opacity: 0; transform: translateY(-28%) rotate(-6deg); animation-timing-function: cubic-bezier(0.3, 0, 0.6, 1); }
	22%  { opacity: 1; transform: translateY(-3%) rotate(-2deg); }
	/* landar och sätter sig */
	34%  { transform: translateY(0.6%) rotate(0.4deg); }
	44%  { transform: translateY(0) rotate(0deg); animation-timing-function: cubic-bezier(0.4, 0, 0.6, 1); }
	/* laddar – tung, långsam uppresning, accelererar sedan hårt in i slaget */
	78%  { transform: translateY(-7%) rotate(-6deg); animation-timing-function: cubic-bezier(0.7, 0, 1, 0.4); }
	/* SLAGET – följer igenom förbi viloläget */
	92%  { transform: translateY(4%) rotate(2deg); animation-timing-function: cubic-bezier(0.2, 0.9, 0.3, 1); }
	100% { transform: translateY(0) rotate(0deg); }
}

/* R:et: hårt ned, studs upp, sätter sig */
@keyframes r-hit-b-6zkqc4000s {
	0%   { transform: translateY(0) rotate(0deg) scaleY(1); }
	18%  { transform: translateY(11%) rotate(3deg) scaleY(0.86); }
	45%  { transform: translateY(-2.5%) rotate(-1deg) scaleY(1.04); }
	70%  { transform: translateY(1.2%) rotate(0.4deg) scaleY(1); }
	100% { transform: translateY(0) rotate(0deg) scaleY(1); }
}

/* Balken och övriga bokstäver vibrerar av träffen */
@keyframes base-shake-b-6zkqc4000s {
	0%   { transform: translate(0, 0); }
	15%  { transform: translate(-1%, 1.8%); }
	35%  { transform: translate(0.9%, -0.8%); }
	55%  { transform: translate(-0.5%, 0.5%); }
	75%  { transform: translate(0.25%, -0.25%); }
	100% { transform: translate(0, 0); }
}

/* Hela loggan kickas – kort, hård, dämpad */
@keyframes logo-kick-b-6zkqc4000s {
	0%   { transform: translate(0, 0) scale(1); }
	12%  { transform: translate(-2%, 3%) scale(1.06); }
	30%  { transform: translate(1.5%, -1.2%) scale(1.025); }
	50%  { transform: translate(-0.8%, 0.6%) scale(1.01); }
	70%  { transform: translate(0.3%, -0.25%) scale(1); }
	100% { transform: translate(0, 0) scale(1); }
}

@keyframes flash-b-6zkqc4000s {
	0%   { opacity: 1; transform: scale(0.4); }
	40%  { opacity: 0.7; transform: scale(1); }
	100% { opacity: 0; transform: scale(1.3); }
}

@keyframes shock-b-6zkqc4000s {
	0%   { opacity: 1; transform: scale(0.3); }
	100% { opacity: 0; transform: scale(2.6); }
}

@keyframes shock-outer-b-6zkqc4000s {
	0%   { opacity: 0.8; transform: scale(0.5); }
	100% { opacity: 0; transform: scale(4); }
}

/* =========================== Reduced motion ======================== */
@media (prefers-reduced-motion: reduce) {
	.animated-logo[b-6zkqc4000s],
	.animated-logo__layer[b-6zkqc4000s] {
		animation: none;
		will-change: auto;
	}

	.animated-logo__flash[b-6zkqc4000s],
	.animated-logo__shock[b-6zkqc4000s] {
		display: none;
	}
}
/* /Components/QuickReport.razor.rz.scp.css */
.quick[b-1oq88rbav6] {
	display: flex;
	flex-direction: column;
	gap: var(--space-5);
}

/* ---- Toolbar: dag + start ---- */
.quick__toolbar[b-1oq88rbav6] {
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
}

.quick__day[b-1oq88rbav6] {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-1);
}

.quick__day-label[b-1oq88rbav6] {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	min-height: var(--control-height);
	padding: var(--space-1) var(--space-2);
	border: 0;
	border-radius: var(--radius-md);
	background: transparent;
	color: inherit;
	line-height: var(--leading-tight);
}

.quick__day-label:hover[b-1oq88rbav6] {
	background: var(--color-surface-hover);
}

.quick__day-name[b-1oq88rbav6] {
	font-weight: var(--weight-bold);
	font-size: var(--text-lg);
}

.quick__day-date[b-1oq88rbav6] {
	font-size: var(--text-xs);
	color: var(--color-text-muted);
}

.quick__start[b-1oq88rbav6] {
	display: flex;
	align-items: center;
	gap: var(--space-3);
}

.quick__start .input[b-1oq88rbav6] {
	width: auto;
	flex: 1;
}

/* ---- Rader ---- */
.quick__lines[b-1oq88rbav6],
.quick__saved[b-1oq88rbav6] {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
}

.quick__line[b-1oq88rbav6] {
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
	padding: var(--space-3);
	background: var(--color-surface);
	border: 1px solid var(--color-border-subtle);
	border-radius: var(--radius-md);
	transition: border-color var(--transition-fast);
}

.quick__line--active[b-1oq88rbav6] {
	border-color: var(--color-accent-border);
}

.quick__line-head[b-1oq88rbav6] {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: var(--space-2);
}

.quick__line-text[b-1oq88rbav6],
.quick__saved-text[b-1oq88rbav6] {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.quick__line-project[b-1oq88rbav6] {
	font-weight: var(--weight-semibold);
	overflow-wrap: anywhere;
}

.quick__line-activity[b-1oq88rbav6] {
	font-size: var(--text-sm);
	color: var(--color-text-secondary);
	overflow-wrap: anywhere;
}

.quick__line-stepper[b-1oq88rbav6] {
	justify-content: space-between;
}

.quick__line-stepper .btn[b-1oq88rbav6] {
	flex: 1;
}

.quick__line-stepper[b-1oq88rbav6]  .stepper__value {
	flex: 0 0 4.5rem;
}

/* ---- Redan sparat ---- */
.quick__saved-row[b-1oq88rbav6] {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: var(--space-3);
	padding: var(--space-2) 0;
	border-bottom: 1px solid var(--color-border-subtle);
	font-size: var(--text-sm);
}

.quick__saved-row--editing[b-1oq88rbav6] {
	flex-direction: column;
	align-items: stretch;
	gap: var(--space-2);
	padding: var(--space-3);
	background: var(--color-surface);
	border: 1px solid var(--color-accent-border);
	border-radius: var(--radius-md);
}

.quick__saved-comment[b-1oq88rbav6] {
	display: inline-flex;
	align-items: flex-start;
	gap: var(--space-1);
	margin-top: var(--space-1);
	font-size: var(--text-xs);
	color: var(--color-text-muted);
	overflow-wrap: anywhere;
}

.quick__saved-side[b-1oq88rbav6] {
	display: flex;
	align-items: center;
	gap: var(--space-1);
	flex-shrink: 0;
}

.quick__saved-actions[b-1oq88rbav6] {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2);
}

.quick__saved-delete[b-1oq88rbav6] {
	margin-left: auto;
}

.quick__saved-hours[b-1oq88rbav6] {
	display: inline-flex;
	align-items: center;
	gap: var(--space-1);
	color: var(--color-accent);
	font-weight: var(--weight-semibold);
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

[b-1oq88rbav6] .quick__saved-icon,
[b-1oq88rbav6] .quick__total-check {
	width: 1rem;
	height: 1rem;
	stroke-width: 2.5;
}

/* ---- Actions ---- */
.quick__actions[b-1oq88rbav6] {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2);
	margin-top: var(--space-3);
}

.quick__other[b-1oq88rbav6] {
	margin-top: var(--space-3);
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
}

/* Sticky spara-knapp på mobil – alltid nåbar med tummen */
.quick__save[b-1oq88rbav6] {
	position: sticky;
	bottom: var(--space-3);
	box-shadow: var(--shadow-md);
}

/* ---- Tablet+ ---- */
@media (min-width: 768px) {
	.quick__toolbar[b-1oq88rbav6] {
		flex-direction: row;
		align-items: flex-end;
		justify-content: space-between;
	}

	.quick__day[b-1oq88rbav6] {
		justify-content: flex-start;
	}

	.quick__day-label[b-1oq88rbav6] {
		flex: 0 0 auto;
		min-width: 12rem;
	}

	.quick__start .input[b-1oq88rbav6] {
		flex: 0 0 8rem;
	}

	.quick__line[b-1oq88rbav6] {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		flex-wrap: wrap;
	}

	.quick__line-head[b-1oq88rbav6] {
		flex: 1;
		min-width: 14rem;
	}

	.quick__line-stepper[b-1oq88rbav6] {
		justify-content: flex-end;
	}

	.quick__line-stepper .btn[b-1oq88rbav6] {
		flex: 0 0 auto;
	}

	.quick__line-comment[b-1oq88rbav6] {
		flex-basis: 100%;
	}

	.quick__save[b-1oq88rbav6] {
		position: static;
		box-shadow: none;
		width: auto;
		align-self: flex-end;
	}
}
/* /Layout/LoginDisplay.razor.rz.scp.css */
.user[b-0ot6d5lyby] {
	display: flex;
	align-items: center;
	gap: var(--space-3);
	min-width: 0;
}

.user__avatar[b-0ot6d5lyby] {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.25rem;
	height: 2.25rem;
	flex-shrink: 0;
	border-radius: var(--radius-full);
	background: var(--color-surface-alt);
	border: 1px solid var(--color-border);
	color: var(--color-text-secondary);
}

.user__avatar[b-0ot6d5lyby]  svg {
	width: 1rem;
	height: 1rem;
}

.user__info[b-0ot6d5lyby] {
	display: flex;
	flex-direction: column;
	min-width: 0;
	flex: 1;
}

.user__name[b-0ot6d5lyby] {
	font-size: var(--text-sm);
	font-weight: var(--weight-medium);
	color: var(--color-text);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.user__email[b-0ot6d5lyby] {
	font-size: var(--text-xs);
	color: var(--color-text-muted);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.user--compact .user__name[b-0ot6d5lyby] {
	color: var(--color-text-secondary);
}
/* /Layout/PublicLayout.razor.rz.scp.css */
.public[b-mzjn77xmjv] {
	min-height: 100dvh;
	display: flex;
	flex-direction: column;
	background: var(--color-bg);
}

.public__main[b-mzjn77xmjv] {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: var(--page-padding);
}
/* /Pages/Home.razor.rz.scp.css */
/* Mobile First – basreglerna gäller 375–430 px */
.landing[b-v2kx0v7mkl] {
	width: 100%;
	max-width: 24rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: var(--space-6);
}

.landing__logo[b-v2kx0v7mkl] {
	width: min(14rem, 70%);
	margin-bottom: var(--space-4);
}

/* Texten framträder diskret efter impact. Bara opacity/transform – knappen är klickbar hela tiden. */
.landing__tagline[b-v2kx0v7mkl],
.landing__line[b-v2kx0v7mkl],
.landing__actions[b-v2kx0v7mkl] {
	animation: landing-reveal-b-v2kx0v7mkl 320ms cubic-bezier(0.2, 0.8, 0.2, 1) 1 both;
}

.landing__tagline[b-v2kx0v7mkl] {
	/* Storlek, vikt och letter-spacing ärvs från h1 i base.css */
	margin: 0;
	animation-delay: 1150ms;
}

.landing__description[b-v2kx0v7mkl] {
	margin: 0;
	color: var(--color-text-secondary);
	font-size: var(--text-base);
	line-height: var(--leading-normal);
}

.landing__line[b-v2kx0v7mkl] {
	display: block;
}

.landing__line--first[b-v2kx0v7mkl] {
	animation-delay: 1900ms;
}

.landing__line--second[b-v2kx0v7mkl] {
	animation-delay: 2900ms;
}

.landing__actions[b-v2kx0v7mkl] {
	width: 100%;
	display: flex;
	justify-content: center;
	margin-top: var(--space-4);
	/* Knappen visas så fort impacten lagt sig – väntar inte på textraderna */
	animation-delay: 1150ms;
}

@keyframes landing-reveal-b-v2kx0v7mkl {
	from { opacity: 0; transform: translateY(4px); }
	to   { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
	.landing__tagline[b-v2kx0v7mkl],
	.landing__line[b-v2kx0v7mkl],
	.landing__actions[b-v2kx0v7mkl] {
		animation: none;
	}
}

@media (min-width: 768px) {
	.landing[b-v2kx0v7mkl] {
		max-width: 32rem;
		gap: var(--space-8);
	}

	.landing__logo[b-v2kx0v7mkl] {
		width: 18rem;
	}

	.landing__description[b-v2kx0v7mkl] {
		font-size: var(--text-lg);
	}

	.landing__actions .btn[b-v2kx0v7mkl] {
		min-width: 12rem;
	}
}
/* /Pages/MyTime.razor.rz.scp.css */
.month-switcher[b-dzl226ln1b] {
	display: flex;
	align-items: center;
	gap: var(--space-1);
}

.month-switcher__label[b-dzl226ln1b] {
	min-width: 9rem;
	text-align: center;
	font-weight: var(--weight-semibold);
	text-transform: capitalize;
	font-variant-numeric: tabular-nums;
}

/* Redigeringsraden spänner över hela tabellen på desktop */
.data-list__edit[b-dzl226ln1b] {
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
}

@media (min-width: 768px) {
	.data-list__row--editing[b-dzl226ln1b] {
		display: block;
		padding: var(--space-4) var(--space-2);
		border-bottom: 1px solid var(--color-border-subtle);
	}
}
