/**
 * Lizenzseite im NEXUS-Design. Nutzt die Bausteine und Farb-Tokens aus Theme
 * und NEXUS Shop (--nx-*), mit Ersatzwerten falls sie fehlen. Hell/Dunkel
 * folgt automatisch den Tokens.
 */
.wtpm-portal {
	--wtpm-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
	display: grid;
	gap: 1rem;
	max-width: 760px;
	margin: 0 auto;
}
.wtpm-portal--account { max-width: none; margin: 0; }
.wtpm-portal .nx-card { margin: 0; }
.wtpm-portal .nx-card + .nx-card { margin-top: 0; }
.wtpm-portal .woocommerce-message,
.wtpm-portal .woocommerce-error,
.wtpm-portal .woocommerce-info,
.wtpm-portal .nx-alert { margin: 0; }
.wtpm-portal h2, .wtpm-portal h3 { color: var(--nx-text, #1d1d1f); }

/* Lizenzkopf */
.wtpm-license__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin-bottom: 1.25rem; }
.wtpm-license__head .nx-eyebrow { margin-bottom: .2rem; }
.wtpm-license__title { margin: 0; font-size: clamp(1.375rem, 3.2vw, 1.875rem); font-weight: 700; letter-spacing: -.025em; line-height: 1.15; }
.wtpm-license__head .nx-badge { flex-shrink: 0; margin-top: .3rem; font-size: .8125rem; }
.wtpm-license__facts { gap: .55rem 1.5rem; padding-top: 1.1rem; border-top: 1px solid var(--nx-line, #d2d2d7); }
.wtpm-license__facts dt { font-size: .9375rem; }

.wtpm-code {
	font: 500 .875rem/1.4 var(--wtpm-mono);
	letter-spacing: .02em;
	padding: .12em .45em;
	border-radius: 6px;
	background: var(--nx-surface-2, #f5f5f7);
	color: var(--nx-text, #1d1d1f);
	overflow-wrap: anywhere;
}

/* Anleitung: nummerierte Schritte */
.wtpm-howto { counter-reset: wtpm; list-style: none; margin: 0 0 1.25rem; padding: 0; display: grid; gap: .7rem; }
.wtpm-howto li { counter-increment: wtpm; display: flex; gap: .75rem; align-items: flex-start; line-height: 1.45; }
.wtpm-howto li::before {
	content: counter(wtpm);
	display: grid; place-items: center; flex-shrink: 0;
	width: 26px; height: 26px; margin-top: -.05em;
	border-radius: 50%;
	background: color-mix(in srgb, var(--nx-accent, #0071e3) 14%, transparent);
	color: var(--nx-accent, #0071e3);
	font-size: .8125rem; font-weight: 600;
}

/* Formulare */
.wtpm-form { margin: 0; }
.wtpm-form .nx-field { margin: 0; }
.wtpm-field__row { display: flex; gap: .6rem; flex-wrap: wrap; }
.wtpm-field__row input { flex: 1 1 16rem; min-width: 0; }
.wtpm-field__row .nx-btn { flex: 0 0 auto; }
.wtpm-portal input.wtpm-mono { font-family: var(--wtpm-mono); letter-spacing: .04em; text-transform: uppercase; }
.wtpm-portal input.wtpm-mono::placeholder { text-transform: none; letter-spacing: .02em; }
.wtpm-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 0 1rem; }
.wtpm-grid .nx-field { margin-bottom: 1rem; }
.wtpm-resend .nx-form__actions { margin-top: .25rem; }
.wtpm-resend__login { margin: 1.25rem 0 0; padding-top: 1rem; border-top: 1px solid var(--nx-line, #d2d2d7); font-size: .9375rem; color: var(--nx-muted, #6e6e73); }

/* Lizenzschlüssel */
.wtpm-key { position: relative; margin-top: .75rem; }
.wtpm-key__text {
	margin: 0;
	padding: 1rem 1.1rem;
	max-height: 11em;
	overflow: auto;
	border-radius: var(--nx-radius-sm, 12px);
	background: var(--nx-surface-2, #f5f5f7);
	border: 1px solid var(--nx-line, #d2d2d7);
	color: var(--nx-text, #1d1d1f);
	font: 500 .8125rem/1.55 var(--wtpm-mono);
	white-space: pre-wrap;
	word-break: break-all;
	-webkit-user-select: all;
	user-select: all;
}
.wtpm-key__text:focus-visible { outline: 0; border-color: var(--nx-accent, #0071e3); box-shadow: 0 0 0 4px color-mix(in srgb, var(--nx-accent, #0071e3) 20%, transparent); }
.wtpm-key__copy { margin-top: .75rem; }
.wtpm-portal .wtpm-key__copy.is-done, .wtpm-portal .wtpm-key__copy.is-done:hover { background: var(--nx-success, #1a7f37); }
.wtpm-key__hint { margin: .75rem 0 0; display: block; }

.wtpm-pending { display: flex; align-items: center; gap: .75rem; margin: 0; color: var(--nx-muted, #6e6e73); }
.wtpm-spinner { width: 18px; height: 18px; flex-shrink: 0; border-radius: 50%; border: 2px solid var(--nx-line, #d2d2d7); border-top-color: var(--nx-accent, #0071e3); animation: wtpm-spin .9s linear infinite; }
@keyframes wtpm-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .wtpm-spinner { animation: none; } }

/* Umzug: aufklappbar */
.wtpm-disclosure { padding: 0 !important; overflow: hidden; }
.wtpm-disclosure > summary {
	display: flex; align-items: center; gap: .75rem;
	padding: 1.1rem clamp(1.25rem, 3vw, 2rem);
	font-weight: 600; cursor: pointer; list-style: none;
}
.wtpm-disclosure > summary::-webkit-details-marker { display: none; }
.wtpm-disclosure > summary::after {
	content: ""; width: 9px; height: 9px; margin-left: .25rem; flex-shrink: 0;
	border-right: 2px solid var(--nx-muted, #6e6e73); border-bottom: 2px solid var(--nx-muted, #6e6e73);
	transform: rotate(45deg) translateY(-2px); transition: transform .2s ease;
}
.wtpm-disclosure[open] > summary::after { transform: rotate(-135deg) translateY(-2px); }
.wtpm-disclosure > summary:hover { background: color-mix(in srgb, var(--nx-surface-2, #f5f5f7) 70%, transparent); }
.wtpm-disclosure > summary:focus-visible { outline: 3px solid color-mix(in srgb, var(--nx-accent, #0071e3) 45%, transparent); outline-offset: -3px; }
.wtpm-disclosure__meta { margin-left: auto; font-weight: 400; font-size: .875rem; color: var(--nx-muted, #6e6e73); }
.wtpm-disclosure__body { padding: 0 clamp(1.25rem, 3vw, 2rem) clamp(1.25rem, 3vw, 2rem); }
.wtpm-disclosure__body > p:first-child { margin-top: 0; }

/* Aktionen */
.wtpm-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.wtpm-cta { display: flex; align-items: center; justify-content: space-between; gap: 1rem 1.5rem; flex-wrap: wrap; }
.wtpm-cta .nx-card__title { margin-bottom: .25rem; }
.wtpm-cta p { margin: 0; }

/* Liste (Mein Konto) */
.wtpm-portal .wtpm-list { list-style: none !important; margin: 0; padding: 0 !important; display: grid; gap: .75rem; }
.wtpm-portal .wtpm-list > li { list-style: none !important; margin: 0; }
.wtpm-portal .wtpm-list > li::marker { content: none; }
.wtpm-list__item { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.wtpm-list__title { margin: 0 0 .35rem; font-size: 1.125rem; font-weight: 600; letter-spacing: -.01em; display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.wtpm-list__meta { margin: 0; font-size: .9375rem; color: var(--nx-muted, #6e6e73); }
.wtpm-list .nx-eyebrow { font-family: var(--wtpm-mono); letter-spacing: .03em; }
.wtpm-back { margin: 0; font-size: .9375rem; }
.wtpm-back a { text-decoration: none; }
.wtpm-empty__icon {
	display: inline-block; width: 44px; height: 44px; margin-bottom: .25rem;
	background: var(--nx-muted, #6e6e73);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='15' r='4'/%3E%3Cpath d='m10.85 12.15 8.65-8.65M17 6l2.5 2.5M15 8l1.5 1.5'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='15' r='4'/%3E%3Cpath d='m10.85 12.15 8.65-8.65M17 6l2.5 2.5M15 8l1.5 1.5'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Kaufangebot ohne Lizenz */
.wtpm-offer { display: grid; gap: 1.25rem; }
.wtpm-offer__intro { display: flex; gap: 1rem; align-items: flex-start; }
.wtpm-offer__intro .nx-eyebrow { margin-bottom: .2rem; }
.wtpm-offer__intro p { margin: 0; }
.wtpm-offer__icon {
	flex-shrink: 0; width: 52px; height: 52px; border-radius: 14px;
	background: linear-gradient(145deg, #4f8df5, #1d4ed8);
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .18);
	position: relative;
}
.wtpm-offer__icon::after {
	content: ""; position: absolute; inset: 13px; background: #fff;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M17.4 6.6a8 8 0 1 1-10.8 0M12 3v8'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M17.4 6.6a8 8 0 1 1-10.8 0M12 3v8'/%3E%3C/svg%3E") center / contain no-repeat;
}
.wtpm-offer__title { margin: 0 0 .4rem; font-size: clamp(1.375rem, 3.2vw, 1.75rem); font-weight: 700; letter-spacing: -.025em; line-height: 1.15; }
.wtpm-portal .wtpm-offer__points { list-style: none !important; margin: 0; padding: 0 !important; display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; font-size: .9375rem; }
.wtpm-offer__points li { position: relative; padding-left: 1.4rem; }
.wtpm-offer__points li::before {
	content: ""; position: absolute; left: 0; top: .2em; width: 1rem; height: 1rem; background: var(--nx-success, #1a7f37);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / contain no-repeat;
}
.wtpm-portal .wtpm-tiers { list-style: none !important; margin: 0; padding: 0 !important; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .6rem; }
.wtpm-tiers li { margin: 0; }
.wtpm-tier {
	display: flex; flex-direction: column; align-items: flex-start; height: 100%; padding: .9rem 1rem;
	border: 1px solid var(--nx-line, #d2d2d7); border-radius: var(--nx-radius-sm, 12px);
	color: var(--nx-text, #1d1d1f) !important; text-decoration: none !important;
	transition: border-color .2s ease, transform .2s ease;
}
.wtpm-tier:hover, .wtpm-tier:focus-visible { border-color: var(--nx-accent, #0071e3); transform: translateY(-1px); }
.wtpm-tier__n { font-size: 1.75rem; font-weight: 700; letter-spacing: -.03em; line-height: 1; }
.wtpm-tier__label { font-size: .8125rem; color: var(--nx-muted, #6e6e73); margin: .2rem 0 .6rem; }
.wtpm-tier__price { margin-top: auto; font-weight: 600; }
.wtpm-offer__note { margin: -.4rem 0 0; }
@media (max-width: 760px) {
	.wtpm-portal .wtpm-tiers { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) {
	.wtpm-tier { transition: none; }
	.wtpm-tier:hover { transform: none; }
}

@media (max-width: 560px) {
	.wtpm-offer__intro { flex-direction: column; }
	.wtpm-license__head { flex-direction: column-reverse; gap: .6rem; }
	.wtpm-license__head .nx-badge { margin-top: 0; }
	.wtpm-license__facts { grid-template-columns: 1fr; gap: .1rem; }
	.wtpm-license__facts dd { margin-bottom: .5rem; }
	.wtpm-field__row .nx-btn, .wtpm-actions .nx-btn, .wtpm-cta .nx-btn, .wtpm-list__item .nx-btn { width: 100%; }
	.wtpm-disclosure > summary { flex-wrap: wrap; }
}

/* Menüpunkt „Power Manager Lizenz“ in Mein Konto: Schlüssel-Symbol im Stil der anderen Symbole */
.woocommerce-MyAccount-navigation-link--pwm-lizenzen { --nx-nav-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='15' r='4'/%3E%3Cpath d='m10.85 12.15 8.65-8.65M17 6l2.5 2.5M15 8l1.5 1.5'/%3E%3C/svg%3E"); }